/* Persisted account themes for the client portal and admin workspace. */

/* Portal notifications use their own close control so modal button styling cannot
   turn the dismiss icon into an oversized circle. */
body.dashboard-page .portal-notification {
  align-items: center;
  display: flex;
  inset: 20px 20px auto auto;
  margin: 0;
  max-width: min(420px, calc(100vw - 32px));
  min-height: 54px;
  min-width: min(300px, calc(100vw - 32px));
  padding: 13px 52px 13px 16px !important;
  z-index: 9999;
}

body.dashboard-page .portal-notification__message {
  display: block;
  line-height: 1.45;
}

body.dashboard-page .portal-notification > .portal-notification__close {
  align-items: center !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 7px !important;
  box-shadow: none !important;
  color: currentColor !important;
  display: flex !important;
  filter: none !important;
  height: 30px !important;
  justify-content: center !important;
  opacity: .68 !important;
  padding: 0 !important;
  position: absolute !important;
  right: 11px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  transition: background-color .16s ease, opacity .16s ease !important;
  width: 30px !important;
}

body.dashboard-page .portal-notification > .portal-notification__close::before {
  content: "\00d7";
  display: block;
  font-size: 22px;
  font-weight: 400;
  line-height: 1;
  transform: translateY(-1px);
}

body.dashboard-page .portal-notification > .portal-notification__close:hover,
body.dashboard-page .portal-notification > .portal-notification__close:focus-visible {
  background: rgba(0, 0, 0, .08) !important;
  box-shadow: none !important;
  opacity: 1 !important;
  transform: translateY(-50%) !important;
}

body.dashboard-page:not([data-interface-theme='default']) .portal-notification {
  background: var(--ui-panel-raised) !important;
  border-color: var(--ui-line-strong) !important;
  color: var(--ui-text) !important;
  box-shadow: 0 18px 48px rgba(var(--ui-bg-rgb), .42) !important;
}

body.dashboard-page:not([data-interface-theme='default']) .portal-notification > .portal-notification__close:hover,
body.dashboard-page:not([data-interface-theme='default']) .portal-notification > .portal-notification__close:focus-visible {
  background: rgba(var(--ui-accent-rgb), .14) !important;
}

@media (max-width: 480px) {
  body.dashboard-page .portal-notification {
    inset: 12px 12px auto 12px;
    max-width: none;
    min-width: 0;
  }
}

body:is(.admin-page, .dashboard-page, .portal-service-page)[data-interface-theme='space'] {
  --ui-bg: #000;
  --ui-bg-rgb: 0, 0, 0;
  --ui-panel: #000;
  --ui-panel-raised: #03070b;
  --ui-input: #000;
  --ui-line: #195b8d;
  --ui-line-strong: #2aa9ff;
  --ui-accent: #2aa9ff;
  --ui-accent-2: #176bff;
  --ui-accent-rgb: 42, 169, 255;
  --ui-text: #fff;
  --ui-muted: #b8cede;
  --ui-subtle: #829eb2;
}

body:is(.admin-page, .dashboard-page, .portal-service-page)[data-interface-theme='aurora'] {
  --ui-bg: #020b0c;
  --ui-bg-rgb: 2, 11, 12;
  --ui-panel: #061819;
  --ui-panel-raised: #092324;
  --ui-input: #031112;
  --ui-line: #17675f;
  --ui-line-strong: #2fd0b3;
  --ui-accent: #32d6b1;
  --ui-accent-2: #27a9d0;
  --ui-accent-rgb: 50, 214, 177;
  --ui-text: #effffc;
  --ui-muted: #acd1ca;
  --ui-subtle: #77a59e;
}

body:is(.admin-page, .dashboard-page, .portal-service-page)[data-interface-theme='ember'] {
  --ui-bg: #0c0705;
  --ui-bg-rgb: 12, 7, 5;
  --ui-panel: #170c08;
  --ui-panel-raised: #25140d;
  --ui-input: #0d0705;
  --ui-line: #81442a;
  --ui-line-strong: #ff9147;
  --ui-accent: #ff9147;
  --ui-accent-2: #e5552f;
  --ui-accent-rgb: 255, 145, 71;
  --ui-text: #fff7f0;
  --ui-muted: #dec0ad;
  --ui-subtle: #aa8169;
}

body:is(.admin-page, .dashboard-page, .portal-service-page)[data-interface-theme='amethyst'] {
  --ui-bg: #090611;
  --ui-bg-rgb: 9, 6, 17;
  --ui-panel: #150d20;
  --ui-panel-raised: #21122f;
  --ui-input: #0c0714;
  --ui-line: #67418d;
  --ui-line-strong: #b978ff;
  --ui-accent: #b978ff;
  --ui-accent-2: #e65bbb;
  --ui-accent-rgb: 185, 120, 255;
  --ui-text: #fff7ff;
  --ui-muted: #d1badf;
  --ui-subtle: #9c7caf;
}

body:is(.admin-page, .dashboard-page, .portal-service-page):not([data-interface-theme='default']) {
  --admin-blue: var(--ui-accent);
  --admin-blue-strong: var(--ui-accent-2);
  --admin-cyan: var(--ui-accent);
  --admin-bg: var(--ui-bg);
  --admin-center: var(--ui-panel);
  --admin-center-deep: var(--ui-input);
  --admin-center-raised: var(--ui-panel-raised);
  --admin-line: var(--ui-line);
  --admin-line-strong: var(--ui-line-strong);
  --admin-accent: var(--ui-accent);
  --admin-accent-strong: var(--ui-accent-2);
  --admin-accent-soft: rgba(var(--ui-accent-rgb), .11);
  --admin-copy: var(--ui-text);
  --admin-copy-soft: var(--ui-muted);
  --admin-copy-muted: var(--ui-subtle);
  --admin-panel: var(--ui-panel);
  --admin-panel-soft: var(--ui-panel-raised);
  --admin-border: var(--ui-line);
  --au-bg: var(--ui-input);
  --au-panel: var(--ui-panel);
  --au-line: var(--ui-line);
  --au-blue: var(--ui-accent);
  --au-text: var(--ui-text);
  --au-muted: var(--ui-muted);
  --portal-blue: var(--ui-accent-2);
  --portal-blue-bright: var(--ui-accent);
  --portal-cyan: var(--ui-accent);
  --portal-bg: var(--ui-bg);
  --portal-panel: var(--ui-panel);
  --portal-panel-soft: var(--ui-panel-raised);
  --portal-border: var(--ui-line);
  --portal-muted: var(--ui-muted);
  background: var(--ui-bg) !important;
  color: var(--ui-text) !important;
}

body:is(.admin-page, .dashboard-page, .portal-service-page):not([data-interface-theme='default']) > main.container {
  background: var(--ui-bg) !important;
}

body:is(.admin-page, .dashboard-page, .portal-service-page):not([data-interface-theme='default']) > main.container::before {
  background: none !important;
  content: none !important;
}

/* Navigation inherits account themes only inside the admin and client workspaces. */
body:is(.admin-page, .dashboard-page, .portal-service-page):not([data-interface-theme='default']) #fixedR.navbar {
  background: color-mix(in srgb, var(--ui-bg) 88%, var(--ui-panel-raised) 12%) !important;
  border-bottom: 1px solid color-mix(in srgb, var(--ui-line) 78%, transparent) !important;
  box-shadow: 0 14px 36px rgba(var(--ui-bg-rgb), .28) !important;
}

body:is(.admin-page, .dashboard-page, .portal-service-page):not([data-interface-theme='default']) :is(
  #navbarType, #fixedR .offcanvas-header, #fixedR .mobile-nav-content,
  #fixedR .navbar-link-menu, #fixedR .navbar-games-menu
) {
  background: var(--ui-panel) !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
}

body:is(.admin-page, .dashboard-page, .portal-service-page):not([data-interface-theme='default']) #fixedR :is(
  .navbar-nav .nav-link, .navbar-account > .btn, .navbar-discord-link,
  .navbar-link-menu__copy strong, .navbar-games-heading, .navbar-game-link,
  .navbar-popular-game, .mobile-nav-row, .mobile-nav-section h2
) {
  color: var(--ui-text) !important;
}

body:is(.admin-page, .dashboard-page, .portal-service-page):not([data-interface-theme='default']) #fixedR :is(
  .navbar-nav .nav-link:hover, .navbar-nav .nav-link:focus, .navbar-nav .nav-link[aria-expanded='true'],
  .navbar-account > .btn:hover, .navbar-account > .btn:focus, .navbar-account > .btn[aria-expanded='true'],
  .navbar-discord-link:hover, .navbar-discord-link:focus-visible,
  .navbar-link-menu__item:hover, .navbar-link-menu__item:focus,
  .navbar-game-link:hover, .navbar-game-link:focus,
  .navbar-popular-game:hover, .navbar-popular-game:focus,
  .mobile-nav-row:hover
) {
  background: rgba(var(--ui-accent-rgb), .13) !important;
  border-color: var(--ui-line-strong) !important;
  box-shadow: 0 0 18px rgba(var(--ui-accent-rgb), .12) !important;
  color: var(--ui-text) !important;
}

body:is(.admin-page, .dashboard-page, .portal-service-page):not([data-interface-theme='default']) #fixedR :is(
  .navbar-games-search, .navbar-games-search input
) {
  background: var(--ui-input) !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
}

body:is(.admin-page, .dashboard-page, .portal-service-page):not([data-interface-theme='default']) #fixedR :is(
  .navbar-link-menu__copy small, .navbar-games-search input::placeholder, .mobile-nav-row small
) {
  color: var(--ui-muted) !important;
}

body:is(.admin-page, .dashboard-page, .portal-service-page):not([data-interface-theme='default']) #fixedR :is(
  .navbar-games-footer, .navbar-games-section + .navbar-games-section
) {
  border-color: var(--ui-line) !important;
}

body:is(.admin-page, .dashboard-page, .portal-service-page):not([data-interface-theme='default']) #fixedR .navbar-games-footer a {
  color: var(--ui-accent) !important;
}

/* Shared surfaces across the admin feature families. */
body.admin-page:not([data-interface-theme='default']) :is(
  .admin-card, .admin-page-header, .admin-form-container, .admin-table-container,
  .admin-stat, .admin-utility-hero, .admin-result-group, .admin-saved-view-list article,
  .admin-notification-list > article, .billing-admin__card, .billing-admin__webhook,
  .billing-admin__states, .ops-filter, .ops-records, .year-report-shell, .year-report,
  .invoice-ledger, .invoice-ledger__forms form, .dispute-summary > div, .dispute-card,
  .reconcile-summary > div, .reconcile-summary > form, .reconcile-explainer,
  .run-list details, .communications-card, .communications-policy, .audience-toolbar,
  .security-summary > div, .audit-summary > div, .audit-filter, .security-filter,
  .backup-summary article, .kb-admin-panel, .kb-content-block, .affiliate-panel,
  .affiliate-admin-card, .admin-create-user__card, .admin-user-card, .admin-addon-editor,
  .plan-editor-section, .admin-folder-picker-window, .admin-plan-image-picker__window,
  .analytics-panel, .analytics-kpis > div, .analytics-live, .analytics-settings,
  .card, .modal-content
) {
  background: var(--ui-panel) !important;
  background-image: none !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
  box-shadow: 0 22px 60px rgba(var(--ui-bg-rgb), .42) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .health-badge, .attention-grid > a, .dashboard-panel, .revenue-grid > div,
  .revenue-visual, .ops-mini span, .command-modules > a
) {
  background: var(--ui-panel) !important;
  background-image: none !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .attention-grid > a:hover, .command-modules > a:hover
) {
  background: var(--ui-panel-raised) !important;
  border-color: var(--ui-line-strong) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .attention-grid > a > span, .command-modules i
) {
  background: rgba(var(--ui-accent-rgb), .13) !important;
  color: var(--ui-accent) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .command-kicker, .panel-heading a, .command-modules b
) {
  color: var(--ui-accent) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .command-hero p, .health-badge small, .attention-grid small, .revenue-grid small,
  .revenue-visual small, .health-list small, .ops-mini span, .command-modules small
) {
  color: var(--ui-muted) !important;
}

body.admin-page:not([data-interface-theme='default']) .health-list > div {
  border-color: color-mix(in srgb, var(--ui-line) 72%, transparent) !important;
}

body.admin-page:not([data-interface-theme='default']) .revenue-visual > span {
  background: linear-gradient(var(--ui-accent), var(--ui-accent-2)) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .admin-toolbox .admin-global-search, .admin-toolbox .admin-tool-menu > summary,
  .admin-toolbox .admin-tool-popover, .admin-table thead, .table thead, .ops-table thead,
  .campaign-table thead, .audit-table thead, .security-table thead, .reconcile-table thead,
  .affiliate-table thead, .billing-mail__table thead, .card-header, .modal-header,
  .modal-footer, .kb-block-head, .audience-toolbar
) {
  background: var(--ui-panel-raised) !important;
  border-color: var(--ui-line) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .admin-form-input, .admin-form-select, .admin-form-textarea, .admin-filter-input,
  .admin-filter-select, .form-control, .form-select, .kb-input, .communications-page input,
  .communications-page select, .communications-page textarea, .billing-admin__card input,
  .billing-admin__card select, .ops-filter input, .ops-filter select, .reconcile-summary select,
  .invoice-ledger__forms input, .invoice-ledger__forms select, .affiliate-form input,
  .affiliate-form select, .affiliate-form textarea, .analytics-settings input,
  .analytics-settings select, .analytics-settings textarea, .analytics-directory-controls select
) {
  background: var(--ui-input) !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .admin-form-input, .admin-form-select, .admin-form-textarea, .admin-filter-input,
  .admin-filter-select, .form-control, .form-select, .kb-input, .communications-page input,
  .communications-page select, .communications-page textarea, .billing-admin__card input,
  .billing-admin__card select, .ops-filter input, .ops-filter select, .reconcile-summary select,
  .invoice-ledger__forms input, .invoice-ledger__forms select, .affiliate-form input,
  .affiliate-form select, .affiliate-form textarea, .analytics-settings input,
  .analytics-settings select, .analytics-settings textarea, .analytics-directory-controls select
):focus {
  border-color: var(--ui-line-strong) !important;
  box-shadow: 0 0 0 3px rgba(var(--ui-accent-rgb), .15) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .admin-card-button, .admin-action-btn-secondary, .admin-form-btn-secondary,
  .kb-btn-secondary, .kb-icon-btn, .kb-block-toolbar button, .affiliate-secondary,
  .admin-page-links a, .billing-admin__heading > a, .billing-ops-actions button:not(.danger),
  .reconcile-table form button, .admin-saved-view-list a, .admin-saved-view-list button,
  .admin-notification-list a, .admin-notification-list button, .btn-secondary,
  .analytics-directory-toggle, .analytics-directory-clear
) {
  background: var(--ui-input) !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .admin-action-btn-primary, .admin-form-btn-primary, .backup-primary, .affiliate-primary,
  .billing-admin__card button, .ops-filter button, .reconcile-summary button,
  .communications-filters button, .composer-submit button, .invoice-ledger__forms button,
  .btn-primary, .admin-dashboard-return
) {
  background: linear-gradient(135deg, var(--ui-accent), var(--ui-accent-2)) !important;
  border-color: var(--ui-line-strong) !important;
  color: var(--ui-text) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .admin-table, .table, .ops-table, .campaign-table table, .backup-table, .audit-table,
  .security-table, .reconcile-table, .affiliate-table, .billing-mail__table,
  .analytics-visitor-table
) :is(th, td) {
  border-color: color-mix(in srgb, var(--ui-line) 72%, transparent) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .admin-table, .table, .ops-table, .campaign-table table, .backup-table, .audit-table,
  .security-table, .reconcile-table, .affiliate-table, .billing-mail__table,
  .analytics-visitor-table
) tbody tr:hover {
  background: rgba(var(--ui-accent-rgb), .09) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .admin-page-subtitle, .admin-card-description, .billing-admin__heading p,
  .billing-admin__card p, .billing-admin__footnote, .kb-admin-hero p,
  .kb-admin-panel p, .kb-help, .communications-page p, .admin-empty-copy,
  .ops-section-title p, .backup-hero p, .analytics-hero p, .analytics-panel > header > span
) {
  color: var(--ui-muted) !important;
}

body.admin-page:not([data-interface-theme='default']) .analytics-directory-controls {
  background: var(--ui-panel-raised) !important;
  border-color: var(--ui-line) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .analytics-directory-head__actions > span, .analytics-directory-controls label > span,
  .analytics-directory-summary
) {
  color: var(--ui-muted) !important;
}

body.admin-page:not([data-interface-theme='default']) .analytics-directory-toggle b {
  background: rgba(var(--ui-accent-rgb), .18) !important;
  color: var(--ui-accent) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .analytics-directory-toggle, .analytics-directory-clear
):hover {
  background: rgba(var(--ui-accent-rgb), .14) !important;
  border-color: var(--ui-line-strong) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .admin-eyebrow, .section-kicker, .kb-admin-kicker, .affiliate-kicker,
  .communications-title span, .backup-summary span, .billing-admin__heading span,
  .analytics-kicker
) {
  color: var(--ui-accent) !important;
}

/* Client portal surfaces and controls. */
body:is(.dashboard-page, .portal-service-page):not([data-interface-theme='default']) :is(
  .dashboard-tabs-card, .dashboard-stat-card, .gaming-card, .service-card, .credits-card,
  .ticket-card, .empty-services-content, .empty-billing-content, .empty-tickets-content,
  .help-link, .portal-avatar, .modal-content, .portal-ticket-drawer,
  .portal-ticket-shell, .portal-ticket-panel
) {
  background: var(--ui-panel) !important;
  background-image: none !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
  box-shadow: 0 22px 60px rgba(var(--ui-bg-rgb), .42) !important;
}

body:is(.dashboard-page, .portal-service-page):not([data-interface-theme='default']) :is(
  .gaming-tabs, .table-gaming thead, .modal-header, .modal-footer,
  .portal-ticket-drawer__header, .portal-ticket-list__header
) {
  background: var(--ui-panel-raised) !important;
  border-color: var(--ui-line) !important;
}

body:is(.dashboard-page, .portal-service-page):not([data-interface-theme='default']) :is(
  .form-control-gaming, .form-control, .form-select, textarea,
  .portal-ticket-composer textarea
) {
  background: var(--ui-input) !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
}

body:is(.dashboard-page, .portal-service-page):not([data-interface-theme='default']) :is(
  .form-control-gaming, .form-control, .form-select, textarea,
  .portal-ticket-composer textarea
):focus {
  border-color: var(--ui-line-strong) !important;
  box-shadow: 0 0 0 3px rgba(var(--ui-accent-rgb), .15) !important;
}

body:is(.dashboard-page, .portal-service-page):not([data-interface-theme='default']) :is(
  .btn-gaming-primary, .btn-primary
) {
  background: linear-gradient(135deg, var(--ui-accent), var(--ui-accent-2)) !important;
  border-color: var(--ui-line-strong) !important;
  color: var(--ui-text) !important;
}

body:is(.dashboard-page, .portal-service-page):not([data-interface-theme='default']) :is(
  .btn-gaming-outline, .btn-outline-primary, .btn-outline-secondary, .help-link
) {
  background: var(--ui-input) !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
}

body.dashboard-page:not([data-interface-theme='default']) :is(.gaming-tab:hover, .gaming-tab.active, .nav-tabs .nav-link.active) {
  background: rgba(var(--ui-accent-rgb), .14) !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
}

body.dashboard-page:not([data-interface-theme='default']) :is(
  .portal-eyebrow, .stat-icon, .gaming-tab i, .service-plan, .invoice-amount,
  .credits-amount, .portal-avatar label
) {
  color: var(--ui-accent) !important;
}

body.dashboard-page:not([data-interface-theme='default']) :is(
  .dashboard-subtitle, .service-billing, .service-status, .support-subtitle,
  .ticket-message, .form-text-gaming, .form-text
) {
  color: var(--ui-muted) !important;
}

body:is(.admin-page, .dashboard-page, .portal-service-page):not([data-interface-theme='default']) footer {
  background: var(--ui-bg) !important;
  color: var(--ui-text) !important;
}

body:is(.admin-page, .dashboard-page, .portal-service-page):not([data-interface-theme='default']) footer .need_more {
  background: var(--ui-panel) !important;
  border-color: var(--ui-line) !important;
  box-shadow: 0 24px 60px rgba(var(--ui-bg-rgb), .42), inset 0 1px 0 rgba(var(--ui-accent-rgb), .08) !important;
}

body:is(.admin-page, .dashboard-page, .portal-service-page):not([data-interface-theme='default']) footer .need_more :is(h2, p) {
  color: var(--ui-text) !important;
}

body:is(.admin-page, .dashboard-page, .portal-service-page):not([data-interface-theme='default']) footer .need_more p {
  color: var(--ui-muted) !important;
}

body:is(.admin-page, .dashboard-page, .portal-service-page):not([data-interface-theme='default']) footer .need_more .need_more_right .btn {
  background: var(--ui-input) !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
}

body:is(.admin-page, .dashboard-page, .portal-service-page):not([data-interface-theme='default']) footer .need_more .need_more_right .btn:hover {
  background: rgba(var(--ui-accent-rgb), .13) !important;
  border-color: var(--ui-line-strong) !important;
  color: var(--ui-text) !important;
}

body:is(.admin-page, .dashboard-page, .portal-service-page):not([data-interface-theme='default']) footer :is(
  .footer_links h4, .footer_about h2, .footer_about p, .footer_links a
) {
  color: var(--ui-text) !important;
}

body:is(.admin-page, .dashboard-page, .portal-service-page):not([data-interface-theme='default']) footer :is(
  .footer_about p, .footer_links a
) {
  color: var(--ui-muted) !important;
}

body:is(.admin-page, .dashboard-page, .portal-service-page):not([data-interface-theme='default']) :is(
  footer .footer_about h2 span, footer .footer-privacy-choice
) {
  color: var(--ui-accent) !important;
}

body:is(.admin-page, .dashboard-page, .portal-service-page):not([data-interface-theme='default']) .footer_bottom {
  background: var(--ui-panel) !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-muted) !important;
}

/* Profile theme chooser: its miniature palettes stay fixed so every option is recognizable. */
.profile-theme-picker {
  border: 0;
  margin: 8px 0 28px;
  padding: 0;
}

.profile-theme-picker > legend { float: none; width: auto; }
.profile-theme-picker > p { margin: -14px 0 14px; }

.profile-theme-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.profile-theme-option {
  --preview-bg: #071019;
  --preview-panel: #0d1b28;
  --preview-line: #2b9cff;
  align-items: center;
  background: rgba(4, 13, 21, .66);
  border: 1px solid #203c51;
  border-radius: 12px;
  color: #edf7fd;
  cursor: pointer;
  display: grid;
  gap: 10px;
  grid-template-columns: 52px minmax(0, 1fr) 22px;
  min-height: 82px;
  padding: 11px;
  transition: border-color .16s ease, background .16s ease, transform .16s ease;
}

.profile-theme-option[data-theme-option='space'] { --preview-bg: #000; --preview-panel: #030303; --preview-line: #2aa9ff; }
.profile-theme-option[data-theme-option='aurora'] { --preview-bg: #020b0c; --preview-panel: #092324; --preview-line: #32d6b1; }
.profile-theme-option[data-theme-option='ember'] { --preview-bg: #0c0705; --preview-panel: #25140d; --preview-line: #ff9147; }
.profile-theme-option[data-theme-option='amethyst'] { --preview-bg: #090611; --preview-panel: #21122f; --preview-line: #b978ff; }
.profile-theme-option:hover { background: #0a1c29; border-color: #2a6b90; transform: translateY(-1px); }
.profile-theme-option:has(input:checked) { background: rgba(28, 119, 185, .12); border-color: var(--preview-line); }
.profile-theme-option input { position: absolute; opacity: 0; pointer-events: none; }

.profile-theme-swatch {
  background: var(--preview-bg);
  border: 1px solid var(--preview-line);
  border-radius: 9px;
  display: grid;
  gap: 4px;
  grid-template-columns: 11px 1fr;
  grid-template-rows: 10px 1fr;
  height: 48px;
  overflow: hidden;
  padding: 5px;
  width: 52px;
}

.profile-theme-swatch i { background: var(--preview-panel); border-radius: 2px; display: block; }
.profile-theme-swatch i:first-child { background: var(--preview-line); grid-column: 1 / -1; }
.profile-theme-swatch i:nth-child(2) { grid-row: 2; }
.profile-theme-swatch i:nth-child(3) { border: 1px solid color-mix(in srgb, var(--preview-line) 55%, transparent); grid-row: 2; }
.profile-theme-option > span:nth-of-type(2) { display: grid; gap: 3px; min-width: 0; }
.profile-theme-option strong { color: #fff; font-size: 13px; }
.profile-theme-option small { color: #809bad; font-size: 10px; line-height: 1.35; }
.profile-theme-option > b { color: var(--preview-line); opacity: 0; text-align: center; }
.profile-theme-option:has(input:checked) > b { opacity: 1; }
.profile-theme-option:focus-within { outline: 2px solid var(--preview-line); outline-offset: 2px; }

@media (max-width: 700px) {
  .profile-theme-grid { grid-template-columns: 1fr; }
}

/* Live support desk follows the saved admin theme without changing status colors. */
body.admin-page:not([data-interface-theme='default']) .live-support {
  --lc-bg: var(--ui-bg);
  --lc-panel: var(--ui-panel);
  --lc-line: var(--ui-line);
  --lc-muted: var(--ui-muted);
  --lc-blue: var(--ui-accent);
  color: var(--ui-text);
}

body.admin-page:not([data-interface-theme='default']) .live-support :is(
  .live-support__hero,
  .live-support__stats,
  .live-support__workspace,
  .live-support__queue,
  .live-support__context,
  .live-support__conversation,
  .live-support__chat-head,
  .live-support__ticket-head,
  .live-support__proactive
) {
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
}

body.admin-page:not([data-interface-theme='default']) .live-support__hero {
  background:
    radial-gradient(circle at 88% 20%, rgba(var(--ui-accent-rgb), .1), transparent 24%),
    linear-gradient(115deg, var(--ui-panel-raised), var(--ui-bg)) !important;
}

body.admin-page:not([data-interface-theme='default']) .live-support :is(
  .live-support__stats,
  .live-support__workspace,
  .live-support__queue,
  .live-support__context,
  .live-support__conversation,
  .live-support__chat-head,
  .live-support__ticket-head,
  .live-support__reply
) {
  background-color: var(--ui-panel) !important;
}

body.admin-page:not([data-interface-theme='default']) .live-support__queue > nav {
  background: color-mix(in srgb, var(--ui-panel) 94%, transparent) !important;
  border-color: var(--ui-line) !important;
}

body.admin-page:not([data-interface-theme='default']) .live-support__queue > nav button.is-active,
body.admin-page:not([data-interface-theme='default']) .live-support__row:is(:hover, .is-selected) {
  background: rgba(var(--ui-accent-rgb), .14) !important;
  border-color: var(--ui-line-strong) !important;
  color: var(--ui-text) !important;
}

body.admin-page:not([data-interface-theme='default']) .live-support :is(
  .live-support__message,
  .live-support__reply textarea,
  .live-support__proactive textarea
) {
  background: var(--ui-input) !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
}

body.admin-page:not([data-interface-theme='default']) .live-support__message.is-agent {
  background: color-mix(in srgb, var(--ui-panel-raised) 82%, var(--ui-accent) 18%) !important;
  border-color: var(--ui-line-strong) !important;
}

body.admin-page:not([data-interface-theme='default']) .live-support :is(
  .live-support__identity small,
  .live-support__chat-person small,
  .live-support__context-card small,
  .live-support__context li small,
  .live-support__empty p,
  .live-support__muted
) {
  color: var(--ui-muted) !important;
}

/* Complete feature coverage: nested admin and portal surfaces must follow the
   saved palette too, while status/severity colors remain semantic. */
body.admin-page:not([data-interface-theme='default']) .analytics-shell {
  --panel: var(--ui-panel);
  --line: var(--ui-line);
  --muted: var(--ui-muted);
}

body.admin-page:not([data-interface-theme='default']) .rbac-page {
  --rbac-line: var(--ui-line);
  --rbac-panel: var(--ui-panel);
  --rbac-panel-2: var(--ui-panel-raised);
  --rbac-blue: var(--ui-accent);
  --rbac-cyan: var(--ui-accent);
  --rbac-text: var(--ui-text);
  --rbac-muted: var(--ui-muted);
}

body:is(.admin-page, .dashboard-page):not([data-interface-theme='default']) .affiliate-shell {
  --aff-bg: var(--ui-bg);
  --aff-panel: var(--ui-panel);
  --aff-panel-2: var(--ui-panel-raised);
  --aff-border: var(--ui-line);
  --aff-text: var(--ui-text);
  --aff-muted: var(--ui-muted);
  --aff-blue: var(--ui-accent);
  --aff-cyan: var(--ui-accent-2);
}

body.admin-page:not([data-interface-theme='default']) :is(
  .analytics-kpis > article, .analytics-table-wrap, .analytics-ga-totals > span,
  .analytics-countries > span, .analytics-consent-reset, .analytics-geo-status,
  .rbac-current, .rbac-stats > article, .rbac-panel, .rbac-role-card,
  .rbac-permission-groups fieldset, .rbac-search, .rbac-locked,
  .discount-card, .scope-panel, .scope-group, .cycle-options label,
  .discount-type-picker__trigger, .discount-type-picker__menu,
  .billing-mail__designer, .billing-mail__history, .billing-mail__template,
  .billing-mail__preview, .billing-mail__footer-editor, .billing-mail__delivery-check,
  .audience-card, .composer-card, .security-policy,
  .staff-customer-area, .staff-customer-grid > *, .timeline-event,
  .internal-note, .internal-note-form, .note-list,
  .admin-addon-pricing, .admin-location-pricing, .plan-spec-editor-list,
  .admin-folder-picker-header, .admin-folder-picker-footer,
  .admin-plan-image-picker__header, .admin-plan-image-picker__body
) {
  background: var(--ui-panel) !important;
  background-image: none !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .analytics-panel th, .analytics-visitor-table th,
  .rbac-table th, .discount-table th,
  .billing-mail__table th, .affiliate-table th,
  .admin-folder-picker-toolbar, .billing-mail__preview-bar,
  .billing-mail__save-bar, .rbac-grant-form
) {
  background: var(--ui-panel-raised) !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-accent) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .analytics-panel td, .rbac-table td, .discount-table td,
  .billing-mail__table td, .affiliate-table td
) {
  border-color: color-mix(in srgb, var(--ui-line) 74%, transparent) !important;
  color: var(--ui-text) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .rbac-search input, .rbac-grant-form input, .rbac-grant-form select,
  .rbac-assignment-form select, .rbac-role-fields input,
  .rbac-role-fields select, .rbac-role-fields textarea,
  .discount-fields input, .discount-fields select, .discount-limits input,
  .admin-create-user__field input, .admin-create-user__field select,
  .billing-mail__designer input, .billing-mail__designer select,
  .billing-mail__designer textarea, .affiliate-payout-actions input,
  .internal-note-form textarea
) {
  background: var(--ui-input) !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .rbac-search input, .rbac-grant-form input, .rbac-grant-form select,
  .rbac-assignment-form select, .rbac-role-fields input,
  .rbac-role-fields select, .rbac-role-fields textarea,
  .discount-fields input, .discount-fields select, .discount-limits input,
  .admin-create-user__field input, .admin-create-user__field select,
  .billing-mail__designer input, .billing-mail__designer select,
  .billing-mail__designer textarea, .affiliate-payout-actions input,
  .internal-note-form textarea
):focus {
  border-color: var(--ui-line-strong) !important;
  box-shadow: 0 0 0 3px rgba(var(--ui-accent-rgb), .15) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .analytics-hero-actions a, .analytics-hero-actions select,
  .rbac-role-pill, .rbac-check, .discount-admin__heading a,
  .discount-actions button:not(.danger), .admin-create-user__back,
  .admin-create-user__cancel, .admin-folder-select-button,
  .admin-folder-picker-up, .admin-folder-picker-close,
  .admin-plan-image-picker__close
) {
  background: var(--ui-input) !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .analytics-kicker, .rbac-kicker, .rbac-table th,
  .rbac-role-icon, .rbac-person > span, .discount-admin__heading span,
  .discount-card__heading span, .billing-mail__section-heading,
  .billing-mail__template-icon, .admin-create-user__eyebrow,
  .admin-create-user__step
) {
  color: var(--ui-accent) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .analytics-panel td a, .rbac-page h1, .rbac-page h2, .rbac-page h3,
  .discount-admin h1, .discount-admin h2, .discount-admin legend,
  .admin-create-user h1, .admin-create-user h2,
  .billing-mail__designer h2, .billing-mail__designer h3
) {
  color: var(--ui-text) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .rbac-page p, .rbac-page small, .rbac-role-meta span,
  .discount-admin__heading p, .discount-card__heading p, .scope-panel > p,
  .discount-fields small, .discount-limits small, .discount-table td small,
  .admin-create-user__heading p, .admin-create-user__section-heading p,
  .admin-create-user__field small, .admin-create-user__setting small,
  .billing-mail__footer-help
) {
  color: var(--ui-muted) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .rbac-grant-form button, .rbac-assignment-form button,
  .rbac-card-actions button:not(.is-danger), .discount-submit button,
  .admin-create-user__submit
) {
  background: linear-gradient(135deg, var(--ui-accent), var(--ui-accent-2)) !important;
  border-color: var(--ui-line-strong) !important;
  color: var(--ui-text) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .analytics-live, .rbac-current
) {
  background: linear-gradient(120deg, var(--ui-panel-raised), var(--ui-panel)) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .source-pill, .rbac-role-pill:not(.is-owner),
  .discount-table code, .analytics-directory-toggle b
) {
  background: rgba(var(--ui-accent-rgb), .14) !important;
  border-color: var(--ui-line-strong) !important;
  color: var(--ui-accent) !important;
}

/* Client portal: dashboard sections, ticket workspace, invoice, affiliate and
   legacy ticket page all use the same palette contract. */
body:is(.dashboard-page, .portal-service-page):not([data-interface-theme='default']) :is(
  .dashboard-hero, .tab-content, .card-body, .card-header,
  .portal-support-center, .portal-support-sidebar, .portal-ticket-drawer,
  .portal-ticket-drawer__body, .portal-ticket-thread__messages,
  .portal-ticket-empty ol, .portal-support-stats > span,
  .portal-support-links a, .portal-ticket-archive,
  .invoice-header, .invoice-panel, .invoice-items, .invoice-summary,
  .ticket-center__hero, .ticket-center__layout, .ticket-center__list,
  .ticket-center__thread, .affiliate-hero, .affiliate-panel,
  .affiliate-link-card, .affiliate-join-card, .affiliate-stat-grid > article,
  .affiliate-promo-intro, .affiliate-apply-card, .affiliate-benefit-grid > article,
  .affiliate-promo-rate,
  .affiliate-admin-card, .affiliate-table-wrap
) {
  background: var(--ui-panel) !important;
  background-image: none !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
}

body:is(.dashboard-page, .portal-service-page):not([data-interface-theme='default']) :is(
  .gaming-tabs, .portal-ticket-drawer__bar,
  .portal-ticket-thread__header, .portal-ticket-thread__reply,
  .ticket-center__list > header, .ticket-center__thread > header,
  .invoice-table thead, .affiliate-table th,
  #newTicketModal .ticket-compose-header,
  #newTicketModal .ticket-compose-footer
) {
  background: var(--ui-panel-raised) !important;
  background-image: none !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
}

body:is(.dashboard-page, .portal-service-page):not([data-interface-theme='default']) :is(
  .portal-support-sidebar, .portal-ticket-drawer,
  .ticket-center__list, .ticket-center__thread
) {
  box-shadow: none !important;
}

body:is(.dashboard-page, .portal-service-page):not([data-interface-theme='default']) :is(
  .portal-ticket-row:hover, .portal-ticket-row:focus-visible, .portal-ticket-row.is-selected,
  .ticket-center__list > a:hover, .ticket-center__list > a.is-active,
  .affiliate-check, .affiliate-form--affiliate,
  .affiliate-benefit-grid article > span
) {
  background: rgba(var(--ui-accent-rgb), .13) !important;
  border-color: var(--ui-line-strong) !important;
}

body:is(.dashboard-page, .portal-service-page):not([data-interface-theme='default']) :is(
  .portal-ticket-row.is-selected, .ticket-center__list > a.is-active
) {
  box-shadow: inset 3px 0 var(--ui-accent) !important;
}

body:is(.dashboard-page, .portal-service-page):not([data-interface-theme='default']) :is(
  .portal-ticket-message, .ticket-center__messages article
) {
  background: color-mix(in srgb, var(--ui-panel-raised) 88%, var(--ui-bg) 12%) !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
}

body:is(.dashboard-page, .portal-service-page):not([data-interface-theme='default']) :is(
  .portal-ticket-message.is-customer, .ticket-center__messages article.is-customer
) {
  background: color-mix(in srgb, var(--ui-panel-raised) 74%, var(--ui-accent) 26%) !important;
  border-color: var(--ui-line-strong) !important;
}

body:is(.dashboard-page, .portal-service-page):not([data-interface-theme='default']) :is(
  .portal-ticket-message.is-system, .ticket-center__messages article.is-system
) {
  background: transparent !important;
  border-color: transparent !important;
}

body:is(.dashboard-page, .portal-service-page):not([data-interface-theme='default']) :is(
  .portal-ticket-thread__reply textarea, .ticket-center__reply textarea,
  .affiliate-form input, .affiliate-form select, .affiliate-form textarea,
  .affiliate-link-box, .affiliate-payout-actions input,
  #newTicketModal .form-control
) {
  background: var(--ui-input) !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
}

body:is(.dashboard-page, .portal-service-page):not([data-interface-theme='default']) :is(
  .ticket-choice-option > span, .ticket-priority-option > span
) {
  background: var(--ui-panel-raised) !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-muted) !important;
}

body.dashboard-page:not([data-interface-theme='default']) :is(
  .ticket-choice-option:has(input:checked) > span,
  .ticket-priority-option:has(input:checked) > span
) {
  background: rgba(var(--ui-accent-rgb), .15) !important;
  border-color: var(--ui-line-strong) !important;
  color: var(--ui-text) !important;
}

body:is(.dashboard-page, .portal-service-page):not([data-interface-theme='default']) :is(
  .portal-ticket-drawer__identity small, .portal-ticket-empty,
  .portal-ticket-empty p, .portal-ticket-empty li,
  .portal-ticket-row__copy small, .portal-ticket-row__aside time,
  .portal-ticket-message time, .ticket-center__hero p,
  .ticket-center__list > a small, .ticket-center__thread > header p,
  .ticket-center__messages time, .invoice-muted, .invoice-list dt,
  .invoice-address, .affiliate-shell p, .affiliate-shell small,
  .portal-support-links__label
) {
  color: var(--ui-muted) !important;
}

body:is(.dashboard-page, .portal-service-page):not([data-interface-theme='default']) :is(
  .portal-ticket-drawer__identity strong, .portal-ticket-empty h3,
  .portal-ticket-thread__header h2, .portal-ticket-message p,
  .ticket-center h1, .ticket-center h2, .ticket-center__messages p,
  .invoice-page, .invoice-page h1, .invoice-page h2,
  .affiliate-shell h1, .affiliate-shell h2
) {
  color: var(--ui-text) !important;
}

body:is(.dashboard-page, .portal-service-page):not([data-interface-theme='default']) :is(
  .portal-ticket-drawer__identity small, .portal-ticket-thread__header small,
  .portal-ticket-message strong, .ticket-center__hero > div > span,
  .ticket-center__thread > header span, .ticket-center__messages strong,
  .invoice-kicker, .affiliate-kicker
) {
  color: var(--ui-accent) !important;
}

body:is(.dashboard-page, .portal-service-page):not([data-interface-theme='default']) :is(
  .portal-ticket-drawer__controls button, .portal-support-links a,
  .ticket-center__hero a, .affiliate-secondary
) {
  background: var(--ui-input) !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
}

body:is(.dashboard-page, .portal-service-page):not([data-interface-theme='default']) :is(
  .portal-ticket-drawer__icon, .portal-ticket-thread__reply button,
  .ticket-center__hero button, .ticket-center__reply button,
  .affiliate-primary, .affiliate-link-box button,
  #newTicketModal .ticket-compose-submit
) {
  background: linear-gradient(135deg, var(--ui-accent), var(--ui-accent-2)) !important;
  border-color: var(--ui-line-strong) !important;
  color: var(--ui-text) !important;
}

body.dashboard-page:not([data-interface-theme='default']) #newTicketModal .ticket-compose-modal {
  background: var(--ui-panel) !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
}

body:is(.dashboard-page, .portal-service-page):not([data-interface-theme='default']) :is(
  .invoice-table th, .invoice-table td, .invoice-total.final,
  .affiliate-table th, .affiliate-table td, .affiliate-terms > div,
  .portal-ticket-thread__header, .portal-ticket-thread__reply,
  .ticket-center__thread > header, .ticket-center__reply
) {
  border-color: color-mix(in srgb, var(--ui-line) 74%, transparent) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .bg-white, .bg-gray-50
) {
  background: var(--ui-panel) !important;
  color: var(--ui-text) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .text-gray-900, .text-gray-600, .text-gray-500
) {
  color: var(--ui-muted) !important;
}

/* Small feature accents should use the active palette too. These are visual
   accents, unlike status/severity colors which intentionally remain stable. */
body.admin-page:not([data-interface-theme='default']) .analytics-ranking li > b,
body.admin-page:not([data-interface-theme='default']) .analytics-settings summary > b {
  color: var(--ui-accent) !important;
}

body.admin-page:not([data-interface-theme='default']) .analytics-ranking li i {
  background: linear-gradient(90deg, var(--ui-accent), var(--ui-accent-2)) !important;
}

body.admin-page:not([data-interface-theme='default']) .admin-global-search kbd {
  background: rgba(var(--ui-accent-rgb), .13) !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-accent) !important;
}

/* Space deliberately keeps content containers near-black. Blue is reserved
   for outlines and controls rather than filling message cards. */
body:is(.dashboard-page, .portal-service-page)[data-interface-theme='space'] :is(
  .portal-ticket-message,
  .portal-ticket-message.is-customer,
  .ticket-center__messages article,
  .ticket-center__messages article.is-customer
) {
  background: var(--ui-panel) !important;
}

body.admin-page[data-interface-theme='space'] .live-support :is(
  .live-support__message,
  .live-support__message.is-agent
) {
  background: var(--ui-panel) !important;
}

/* The affiliate screens are shared by admin and client routes, so their
   component stylesheet needs the same deep treatment in both shells. */
body.admin-page:not([data-interface-theme='default']) :is(
  .affiliate-hero, .affiliate-panel, .affiliate-link-card,
  .affiliate-join-card, .affiliate-stat-grid > article,
  .affiliate-admin-card, .affiliate-table-wrap
) {
  background: var(--ui-panel) !important;
  background-image: none !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
}

body.admin-page:not([data-interface-theme='default']) .affiliate-hero {
  background:
    radial-gradient(circle at 90% 10%, rgba(var(--ui-accent-rgb), .11), transparent 36%),
    linear-gradient(135deg, var(--ui-panel-raised), var(--ui-panel)) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .affiliate-check, .affiliate-form--affiliate,
  .affiliate-table th, .affiliate-prefix
) {
  background: var(--ui-panel-raised) !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
}

body.admin-page:not([data-interface-theme='default']) :is(
  .affiliate-primary, .affiliate-link-box button
) {
  background: linear-gradient(135deg, var(--ui-accent), var(--ui-accent-2)) !important;
  border-color: var(--ui-line-strong) !important;
  color: var(--ui-text) !important;
}

body.admin-page:not([data-interface-theme='default']) .affiliate-secondary {
  background: var(--ui-input) !important;
  border-color: var(--ui-line) !important;
  color: var(--ui-text) !important;
}