/* AIDV.vn — Quy chuẩn nút đã chốt 04/10/2026.
 * Tái sử dụng class hiện có. Chỉ ưu tiên thuộc tính hình thức của nút;
 * không ghi đè ẩn/hiện, chiều rộng theo khung, vị trí hoặc sự kiện.
 * Layer giúp quy chuẩn thắng các luật !important cũ trong CSS từng trang.
 */
@layer aidv-buttons {
  :root {
    --aidv-button-blue: #2457c5;
    --aidv-button-blue-hover: #1e4fb4;
    --aidv-button-surface: #131c33;
    --aidv-button-text: #f1f5f9;
    --aidv-button-border: #64748b;
    --aidv-button-hover: #1c2b48;
    --aidv-button-danger: #fca5a5;
    --aidv-button-danger-border: #b85d67;
    --aidv-button-focus: #93c5fd;
    --aidv-button-height: 40px;
    --aidv-button-font-size: 14px;
    --aidv-button-padding: 16px;
  }
  html[data-theme="light"] {
    --aidv-button-surface: #fff;
    --aidv-button-text: #172554;
    --aidv-button-border: #7186a8;
    --aidv-button-hover: #edf3ff;
    --aidv-button-danger: #b91c1c;
    --aidv-button-danger-border: #b65c64;
    --aidv-button-focus: #2457c5;
  }

  /* Giữ layout và kích thước riêng của ảnh, menu, tab, sao và ô trò chơi. */
  :is(
    button:not(:where(.fb-marquee-item,.fb-lightbox-thumb,.sg-avatar,.sg-pick-item,
      .sg-star,.clsr-star,.lxp-lesson,.press-tab,.sidebar-group-header,.user-menu-item,
      .notif-item,.gateway-toggle,.sd-toggle,.sd-tab,.rv-tab,.ir-tab,.course-display-button,
      .bingo-cell,.answer,.letter,.match-card,.mystery-box,.reveal-cell,.sticker-person,
      .token,.comment-chip,.vs-playback-start,[data-action="toggle-user-menu"])),
    .btn-primary,.btn-secondary,.btn-danger,.btn-ghost,.btn-enter-learn,
    .aidv-button,.account-button,.devices-button,.act-btn,.clsr-btn,.curr-action,
    .cs-cta,.cs-zalo-cta,.fab-btn,.lh-back-btn,.lx-link,.mic-btn,.mvc-btn,
    .mobile-prev,.mobile-next,.mu-zalo,.od-2b-zalo,.pg-ghost,.plm-btn,
    .press-panel-cta,.rv-chip,.sd-btn,.svc-btn,.zalo-consult-chat,.zalo-consult-phone,
    .attachment-upload,.course-upload-button,.upload-label,.mgw-btn,.mba-menu-item
  ) {
    --aidv-button-applied: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box !important;
    min-width: 0 !important;
    max-width: 100%;
    min-height: var(--aidv-button-height) !important;
    height: auto !important;
    padding: 8px var(--aidv-button-padding) !important;
    gap: 8px;
    border: 1px solid var(--aidv-button-border) !important;
    border-radius: 8px !important;
    background: var(--aidv-button-surface) !important;
    color: var(--aidv-button-text) !important;
    font-family: 'Inter',system-ui,-apple-system,'Segoe UI',sans-serif !important;
    font-size: var(--aidv-button-font-size) !important;
    font-weight: 500 !important;
    line-height: 20px !important;
    letter-spacing: normal !important;
    text-align: center;
    text-decoration: none !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    text-overflow: clip !important;
    box-shadow: none !important;
    transition: background-color .15s ease,border-color .15s ease,color .15s ease;
    cursor: pointer;
    vertical-align: middle;
  }
  /* Một nhóm dùng chung kích thước cho cả nút chính và nút phụ. */
  :is(.hero-section,.cta-section,.svc-hero-actions,.svc-selected-cta,
      .aidv-button-prominent,.chk-submit,.cs-zalo-cta) {
    --aidv-button-height: 44px;
    --aidv-button-font-size: 15px;
    --aidv-button-padding: 24px;
  }
  :is(.btn-primary,.btn-enter-learn,.aidv-button-primary,.account-primary,
      .clsr-btn-primary,.svc-btn-primary,.svc-btn-light,.cs-zalo-cta,
      .chk-submit,.chk-voucher-btn,.btn-search,.od-2a-cta,
      .act-complete,.mobile-complete,.pg-go,.pg-modal-btn-primary,
      .tv-btn,.tv-modal-btn-primary,.rv-go,.sd-btn-primary,.mrv-btn-approve,
      .press-panel-cta,.zalo-consult-btn,.zalo-consult-chat,.mu-zalo,.mu-primary,
      .act-btn-primary,.mobile-next,.plm-btn-primary,.fab-zalo,.rv-chip.is-on,
      .lx-tools button[aria-pressed="true"],.lxp-expand[aria-pressed="true"],
      .attachment-types button[aria-pressed="true"],
      .vs-playback-dialog-confirm,.aidv-confirm-ok,.fb-cta-btn,
      button[name="action"][value="approve"],form:has(> input[name="action"][value="approve"]) > button[type="submit"],
      .section-toggle.is-on,.press-toggle.is-on,.filter-btn.active) {
    background: var(--aidv-button-blue) !important;
    color: #fff !important;
    border-color: var(--aidv-button-blue) !important;
  }
  :is(.btn-enter-learn,.btn-primary,.svc-btn-primary,.zalo-consult-btn)::before,
  :is(.btn-enter-learn,.btn-primary,.svc-btn-primary,.zalo-consult-btn)::after {
    content: none !important;
    animation: none !important;
  }
  :is(.btn-danger,.aidv-button-danger,.devices-button-danger,.action-danger,
      .gf-act-danger,.attachment-danger,.sd-btn-danger,.mtr-delete,
      .clsr-btn-danger,.sg-danger,.mba-menu-danger,.mrv-btn-reject,.course-delete-action,
      .od-cancel-btn,.soft-delete-form button[type="submit"],.trash-harddelete-form button[type="submit"],
      form:has(> input[type="hidden"][value^="delete"]) > button[type="submit"],
      form:has(> input[name="action"][value="reject"]) > button[type="submit"],
      #lib-bulk-delete,#sg-bulk-trash,#delete-ui-button,
      button[name="action"][value="reject"],#btn-bulk-harddelete,#sg-bulk-purge,
      .aidv-confirm-type-danger .aidv-confirm-ok) {
    color: var(--aidv-button-danger) !important;
    background: var(--aidv-button-surface) !important;
    border-color: var(--aidv-button-danger-border) !important;
  }
  /* Nút chỉ có biểu tượng dùng khung vuông và giữ tên hỗ trợ đọc màn hình. */
  :is(.aidv-button-icon,.icon-btn,.notif-bell,.notif-icon-btn,.kebab-btn,
      .mba-dots,.reorder-btn,.action-btn,.sg-iconbtn,.gf-act,
      .gf-modal-close,.partner-edit-close,.press-edit-close,
      .fb-lightbox-close,.fb-lightbox-prev,.fb-lightbox-next,.ir-close,
      .zalo-consult-close,.act-unmark-icon,.btn-remove-timeline,
      .preview-remove,.fab-btn,button[onclick^="aidvTogglePassword"],button.close,
      [data-action="close-drawer"],[data-action="toggle-drawer"],
      [data-action="toggle-sidebar"],[data-action="open-drawer"],#aidv-theme-toggle-btn,#video-popup-close) {
    --aidv-button-padding: 0px;
    padding: 0 !important;
    min-width: var(--aidv-button-height) !important;
    width: var(--aidv-button-height) !important;
    flex-shrink: 0;
  }
  button[onclick^="aidvTogglePassword"] {
    border: 0 !important;
    background: transparent !important;
  }
  /* Giữ thuộc tính hidden của nút chia sẻ và các thao tác xuất hiện theo trạng thái. */
  button[hidden] { display: none !important; }
  .course-more-panel { min-width: 220px; max-width: calc(100vw - 32px); }
  .chk-submit-amount { font-weight: inherit !important; margin-left: 0; padding-left: 8px; white-space: nowrap; }
  /* Tab giữ cách biểu thị được chọn; đồng bộ chữ và vùng bấm. */
  :is(.rv-tab,.sd-tab,.ir-tab,.sg-tab,.pg-tab,.settings-tab-link,
      .instructor-nav-link-v2,.review-feedback-nav a,.account-tabs a) {
    font-family: 'Inter',system-ui,sans-serif !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  /* Các trạng thái không đổi nội dung, disabled hoặc aria-pressed hiện có. */
  :is(button,.btn-primary,.btn-secondary,.btn-enter-learn,.aidv-button,
      .account-button,.devices-button,.clsr-btn,.svc-btn,.curr-action,.lx-link,
      .sd-btn,.plm-btn,.press-panel-cta,.zalo-consult-chat,.mu-zalo,.fab-btn)
      :where(svg) { flex-shrink: 0; }
  :is(button,.btn-primary,.btn-secondary,.btn-enter-learn,.aidv-button,
      .account-button,.devices-button,.clsr-btn,.svc-btn,.curr-action,.lx-link,
      .sd-btn,.plm-btn,.press-panel-cta,.zalo-consult-chat,.mu-zalo,.fab-btn,
      .cs-cta,.cs-zalo-cta,.lh-back-btn,.mic-btn,.mvc-btn,.mobile-prev,.mobile-next,
      .od-2b-zalo,.pg-ghost,.rv-chip,.zalo-consult-phone,.attachment-upload,
      .course-upload-button,.upload-label,.mgw-btn,.mba-menu-item):focus-visible {
    outline: 2px solid var(--aidv-button-focus) !important;
    outline-offset: 3px !important;
  }
  :is(button,.btn-primary,.btn-secondary,.btn-enter-learn,.aidv-button,
      .account-button,.devices-button,.clsr-btn,.svc-btn,.curr-action,.lx-link,
      .sd-btn,.plm-btn,.press-panel-cta,.zalo-consult-chat,.mu-zalo,.fab-btn)
      :where(.btn-captcha-pending-content) { font-weight: 500; }
  :is(button,.btn-primary,.btn-secondary,.btn-enter-learn,.aidv-button,
      .account-button,.devices-button,.clsr-btn,.svc-btn,.curr-action,.lx-link,
      .sd-btn,.plm-btn,.press-panel-cta,.zalo-consult-chat,.mu-zalo,.fab-btn):is(:disabled,[aria-disabled="true"],.is-disabled) {
    cursor: not-allowed !important;
  }
  :is(button:disabled,.btn-primary[aria-disabled="true"],.btn-enter-learn[aria-disabled="true"],
      .devices-button.is-disabled,.btn-captcha-pending) {
    opacity: .55 !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
  }
  :is(button,.btn-primary,.btn-secondary,.btn-enter-learn,.aidv-button,.account-button,
      .devices-button,.act-btn,.clsr-btn,.svc-btn,.curr-action,.lx-link,.sd-btn,.plm-btn,
      .press-panel-cta,.zalo-consult-chat,.zalo-consult-phone,.mu-zalo,.fab-btn,
      .cs-cta,.cs-zalo-cta,.mic-btn,.mvc-btn,.rv-chip,.mgw-btn):active:not(:disabled):not([aria-disabled="true"]) {
    filter: brightness(.9);
  }
  @media (hover:hover) {
    :is(button:not(:where(.fb-marquee-item,.fb-lightbox-thumb,.sg-avatar,.sg-pick-item,
        .sg-star,.clsr-star,.lxp-lesson,.press-tab,.sidebar-group-header,.user-menu-item,
        .notif-item,.gateway-toggle,.sd-toggle,.sd-tab,.rv-tab,.ir-tab,.course-display-button,
        .bingo-cell,.answer,.letter,.match-card,.mystery-box,.reveal-cell,.sticker-person,
        .token,.comment-chip,.vs-playback-start,[data-action="toggle-user-menu"])),.btn-secondary,.btn-ghost,.aidv-button,.account-button,.devices-button,
        .clsr-btn,.svc-btn,.curr-action,.lx-link,.sd-btn,.plm-btn,.cs-cta,.lh-back-btn,
        .mic-btn,.mvc-btn,.mobile-prev,.mobile-next,.od-2b-zalo,.pg-ghost,.rv-chip,
        .zalo-consult-phone,.attachment-upload,.course-upload-button,.upload-label,.mgw-btn,.mba-menu-item):hover:not(:disabled):not([aria-disabled="true"]):not(.is-disabled) {
      background: var(--aidv-button-hover) !important;
      border-color: var(--aidv-button-focus) !important;
      opacity: 1;
    }
    :is(.btn-primary,.btn-enter-learn,.aidv-button-primary,.account-primary,
        .clsr-btn-primary,.svc-btn-primary,.svc-btn-light,.cs-zalo-cta,
        .chk-submit,.chk-voucher-btn,.btn-search,.od-2a-cta,
        .act-complete,.mobile-complete,.pg-go,.pg-modal-btn-primary,.tv-btn,
        .tv-modal-btn-primary,.rv-go,.sd-btn-primary,.mrv-btn-approve,
        .press-panel-cta,.zalo-consult-btn,.zalo-consult-chat,.mu-zalo,.mu-primary,
        .act-btn-primary,.mobile-next,.plm-btn-primary,.fab-zalo,.rv-chip.is-on,
        .lx-tools button[aria-pressed="true"],.lxp-expand[aria-pressed="true"],
        .attachment-types button[aria-pressed="true"],
        .vs-playback-dialog-confirm,.aidv-confirm-ok,.fb-cta-btn,
        button[name="action"][value="approve"],form:has(> input[name="action"][value="approve"]) > button[type="submit"],
        .section-toggle.is-on,.press-toggle.is-on,.filter-btn.active)
        :where(svg) { color: inherit; }
    :is(.btn-primary,.btn-enter-learn,.aidv-button-primary,.account-primary,
        .clsr-btn-primary,.svc-btn-primary,.svc-btn-light,.cs-zalo-cta,
        .chk-submit,.chk-voucher-btn,.btn-search,.od-2a-cta,
        .act-complete,.mobile-complete,.pg-go,.pg-modal-btn-primary,.tv-btn,
        .tv-modal-btn-primary,.rv-go,.sd-btn-primary,.mrv-btn-approve,
        .press-panel-cta,.zalo-consult-btn,.zalo-consult-chat,.mu-zalo,.mu-primary,
        .act-btn-primary,.mobile-next,.plm-btn-primary,.fab-zalo,.rv-chip.is-on,
        .lx-tools button[aria-pressed="true"],.lxp-expand[aria-pressed="true"],
        .attachment-types button[aria-pressed="true"],
        .vs-playback-dialog-confirm,.aidv-confirm-ok,.fb-cta-btn,
        button[name="action"][value="approve"],form:has(> input[name="action"][value="approve"]) > button[type="submit"],
        .section-toggle.is-on,.press-toggle.is-on,.filter-btn.active):hover:not(:disabled):not([aria-disabled="true"]):not(.is-disabled) {
      background: var(--aidv-button-blue-hover) !important;
      color: #fff !important;
    }
    :is(.btn-danger,.aidv-button-danger,.devices-button-danger,.action-danger,
        .gf-act-danger,.attachment-danger,.sd-btn-danger,.mtr-delete,.clsr-btn-danger,
        .sg-danger,.mba-menu-danger,.mrv-btn-reject,.course-delete-action,
        .od-cancel-btn,.soft-delete-form button[type="submit"],.trash-harddelete-form button[type="submit"],
        form:has(> input[type="hidden"][value^="delete"]) > button[type="submit"],
        form:has(> input[name="action"][value="reject"]) > button[type="submit"],
        #lib-bulk-delete,#sg-bulk-trash,#delete-ui-button,
        button[name="action"][value="reject"],#btn-bulk-harddelete,#sg-bulk-purge,
        .aidv-confirm-type-danger .aidv-confirm-ok):hover:not(:disabled) {
      background: var(--aidv-button-hover) !important;
      color: var(--aidv-button-danger) !important;
    }
  }
  @media (max-width:768px),(pointer:coarse) {
    :root { --aidv-button-height: 44px; }
    :is(button:not(:where(.bingo-cell,.answer,.letter,.match-card,.mystery-box,
        .reveal-cell,.sticker-person,.token,.comment-chip)),.btn-primary,.btn-secondary,.btn-danger,.btn-ghost,.btn-enter-learn,
        .aidv-button,.account-button,.devices-button,.act-btn,.clsr-btn,.curr-action,
        .cs-cta,.cs-zalo-cta,.fab-btn,.lh-back-btn,.lx-link,.mic-btn,.mvc-btn,
        .mobile-prev,.mobile-next,.mu-zalo,.od-2b-zalo,.pg-ghost,.plm-btn,
        .press-panel-cta,.rv-chip,.sd-btn,.svc-btn,.zalo-consult-chat,.zalo-consult-phone,
        .attachment-upload,.course-upload-button,.upload-label,.mgw-btn,.mba-menu-item) {
      min-width: 44px !important;
    }
    :is(.rv-tab,.sd-tab,.ir-tab,.sg-tab,.pg-tab,.settings-tab-link,
        .instructor-nav-link-v2,.review-feedback-nav a,.account-tabs a,
        .sg-star,.clsr-star,.course-display-button,.sidebar-group-header) {
      min-height: 44px !important;
      min-width: 44px !important;
    }
    :is(.chk-submit,.od-2a-cta,#mobile-purchase-bar button,#mobile-purchase-bar .btn-primary,
        #mobile-purchase-bar .btn-enter-learn) {
      --aidv-button-height: 48px;
    }
  }
  /* Thanh mua hàng phải chứa được nhãn dài, không cắt vùng bấm ở màn hình nhỏ. */
  @media (max-width:1023px) {
    #mobile-purchase-bar { height: auto !important; min-height: 64px; }
    #mobile-purchase-bar :is(button,.btn-primary,.btn-enter-learn) { --aidv-button-height: 48px; }
    #mobile-purchase-bar > div:last-child { align-items: stretch !important; }
    #mobile-purchase-bar > div:last-child > div { display: flex; }
  }
  @media (max-width:480px) {
    #mobile-purchase-bar { flex-direction: column; align-items: stretch !important; gap: 8px !important; }
    body:has(#mobile-purchase-bar) { padding-bottom: 128px !important; }
    body:has(#mobile-purchase-bar) .fab-contact-v2 { bottom: 128px !important; }
    .mobile-action-bar { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 8px !important; }
    .mobile-action-bar .mobile-complete { grid-column: 1 / -1 !important; grid-row: 1; justify-self: stretch !important; }
    .mobile-action-bar .mobile-prev { grid-column: 1; grid-row: 2; justify-self: stretch !important; }
    .mobile-action-bar .mobile-next { grid-column: 2 !important; grid-row: 2; justify-self: stretch !important; }
  }
  @media (prefers-reduced-motion:reduce) {
    :is(button,.btn-primary,.btn-secondary,.btn-enter-learn,.aidv-button,.svc-btn) {
      transition: none !important;
    }
  }
}