/*
 * Modus Customer Commerce UI — colour modes
 *
 * Bootstrap owns the `data-bs-theme` switch. This file maps the Modus semantic
 * tokens and intentionally light-only surfaces onto a coherent dark palette.
 */

/* ---- Theme switch control: visible in both modes ---- */
.mc-theme-toggle {
    display: inline-grid !important;
    place-items: center;
    width: 40px;
    min-width: 40px;
    height: 40px;
    min-height: 40px;
    margin-inline: var(--mc-space-2);
    border: 1px solid var(--mc-border-subtle);
    border-radius: var(--mc-radius-sm);
    background: var(--mc-surface-subtle);
    color: var(--mc-text-primary) !important;
}

.mc-theme-toggle:hover,
.mc-theme-toggle:focus-visible {
    border-color: var(--mc-color-primary-300);
    background: var(--mc-color-primary-50);
    color: var(--mc-color-primary-700) !important;
}

.mc-theme-toggle .icon {
    width: 21px;
    height: 21px;
    color: currentColor !important;
}

/* ---- Dark semantic tokens and Bootstrap bridge ---- */
[data-bs-theme="dark"] {
    color-scheme: dark;

    --mc-color-primary-50: #15213d;
    --mc-color-primary-100: #1e315d;
    --mc-color-primary-200: #2a477f;
    --mc-color-primary-300: #4e70bf;
    --mc-color-primary-400: #7290e6;
    --mc-color-primary-500: #7f9cff;
    --mc-color-primary-600: #6e8aff;
    --mc-color-primary-700: #a9bbff;
    --mc-color-primary-800: #c4d0ff;
    --mc-color-primary-900: #dee5ff;
    --mc-color-primary-950: #f1f4ff;

    --mc-color-success: #6dd6ad;
    --mc-color-success-bg: #0d2b22;
    --mc-color-warning: #ffd166;
    --mc-color-warning-bg: #332708;
    --mc-color-danger: #ff9292;
    --mc-color-danger-bg: #341719;
    --mc-color-info: #8bc7ff;
    --mc-color-info-bg: #102b45;

    --mc-surface-page: #0c1220;
    --mc-surface-raised: #151d2d;
    --mc-surface-subtle: #1d2738;
    --mc-surface-dark: #080d17;
    --mc-surface-dark-raised: #111827;

    --mc-text-primary: #f2f5fb;
    --mc-text-secondary: #c6cfdd;
    --mc-text-muted: #9ba8bb;
    --mc-text-inverse: #ffffff;

    --mc-border-subtle: #2d394d;
    --mc-border-strong: #47556b;
    --mc-border-focus: #7f9cff;

    --mc-gradient-hero: linear-gradient(180deg, #151d2d 0%, #111a2b 48%, #101d37 100%);
    --mc-gradient-closing: linear-gradient(180deg, #111a2b 0%, #10192a 100%);

    --mc-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.28);
    --mc-shadow-sm: 0 8px 22px rgba(0, 0, 0, 0.30);
    --mc-shadow-md: 0 16px 40px rgba(0, 0, 0, 0.34);
    --mc-shadow-lg: 0 26px 72px rgba(0, 0, 0, 0.40);

    --bs-body-color: var(--mc-text-primary);
    --bs-body-color-rgb: 242, 245, 251;
    --bs-body-bg: var(--mc-surface-page);
    --bs-body-bg-rgb: 12, 18, 32;
    --bs-emphasis-color: #ffffff;
    --bs-emphasis-color-rgb: 255, 255, 255;
    --bs-secondary-color: var(--mc-text-secondary);
    --bs-secondary-bg: var(--mc-surface-subtle);
    --bs-tertiary-color: var(--mc-text-muted);
    --bs-tertiary-bg: #111827;
    --bs-heading-color: var(--mc-text-primary);
    --bs-link-color: #91adff;
    --bs-link-hover-color: #bdceff;
    --bs-border-color: var(--mc-border-subtle);
    --bs-border-color-translucent: rgba(255, 255, 255, 0.14);
    --bs-primary-text-emphasis: #bdceff;
    --bs-primary-bg-subtle: #15213d;
    --bs-primary-border-subtle: #2a477f;
    --bs-success-text-emphasis: var(--mc-color-success);
    --bs-success-bg-subtle: var(--mc-color-success-bg);
    --bs-warning-text-emphasis: var(--mc-color-warning);
    --bs-warning-bg-subtle: var(--mc-color-warning-bg);
    --bs-danger-text-emphasis: var(--mc-color-danger);
    --bs-danger-bg-subtle: var(--mc-color-danger-bg);
    --bs-info-text-emphasis: var(--mc-color-info);
    --bs-info-bg-subtle: var(--mc-color-info-bg);
}

/* ---- Shared dark shell and stock Bootstrap surfaces ---- */
[data-bs-theme="dark"] body,
[data-bs-theme="dark"] body.dashboard,
[data-bs-theme="dark"] body.mc-portal-body {
    background: linear-gradient(180deg, #0c1220 0%, #0f1726 48%, #0b111d 100%);
    color: var(--mc-text-primary);
}

[data-bs-theme="dark"] .mc-header,
[data-bs-theme="dark"] .mc-header--portal {
    border-color: var(--mc-border-subtle);
    background: rgba(15, 23, 38, 0.96);
    box-shadow: 0 14px 42px rgba(0, 0, 0, 0.28);
}

[data-bs-theme="dark"] .mc-header .nav-link,
[data-bs-theme="dark"] .mc-header .navbar-brand,
[data-bs-theme="dark"] .mc-header .dropdown-toggle {
    color: var(--mc-text-primary);
}

[data-bs-theme="dark"] .mc-header .nav-link.active,
[data-bs-theme="dark"] .mc-header .nav-link:hover,
[data-bs-theme="dark"] .mc-header .nav-link:focus-visible {
    color: var(--mc-color-primary-700);
}

[data-bs-theme="dark"] .mc-mobile-account-link {
    border-color: #47556b;
    background: #26334a;
    color: var(--mc-text-primary);
}

[data-bs-theme="dark"] .mc-mobile-account-link:hover,
[data-bs-theme="dark"] .mc-mobile-account-link:focus-visible {
    border-color: var(--mc-color-primary-400);
    background: #31415e;
}

[data-bs-theme="dark"] .mc-unpaid-banner--overdue {
    border-color: rgba(255, 120, 120, 0.35);
    background: linear-gradient(180deg, rgba(64, 20, 20, 0.55) 0%, rgba(38, 12, 12, 0.7) 100%);
}

[data-bs-theme="dark"] .mc-unpaid-banner--upcoming {
    border-color: var(--mc-border-subtle);
    background: var(--mc-surface-raised);
}

[data-bs-theme="dark"] .mc-unpaid-banner--upcoming .mc-unpaid-banner-title {
    color: var(--mc-text-primary);
}

[data-bs-theme="dark"] .mc-unpaid-banner-amount {
    color: var(--mc-text-secondary);
}

[data-bs-theme="dark"] .mc-theme-toggle {
    border-color: #47556b;
    background: #26334a;
    color: #ffffff !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04);
}

[data-bs-theme="dark"] .mc-theme-toggle:hover,
[data-bs-theme="dark"] .mc-theme-toggle:focus-visible {
    border-color: var(--mc-color-primary-400);
    background: #31415e;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .mc-sidebar,
[data-bs-theme="dark"] body.mc-portal-body .mc-sidebar,
[data-bs-theme="dark"] body.dashboard .mc-sidebar {
    border-color: var(--mc-border-subtle);
    background: linear-gradient(180deg, rgba(21, 29, 45, 0.98), rgba(17, 24, 39, 0.98));
    box-shadow: var(--mc-shadow-md);
}

[data-bs-theme="dark"] body.mc-portal-body .mc-sidebar .list-group-item.active,
[data-bs-theme="dark"] body.dashboard .mc-sidebar .list-group-item.active {
    background: linear-gradient(180deg, #1c2b4d, #172543);
    color: var(--mc-color-primary-700);
}

[data-bs-theme="dark"] .card,
[data-bs-theme="dark"] .accordion-item,
[data-bs-theme="dark"] .list-group-item,
[data-bs-theme="dark"] .modal-content,
[data-bs-theme="dark"] .dropdown-menu,
[data-bs-theme="dark"] .mc-order-summary {
    --bs-card-bg: var(--mc-surface-raised);
    --bs-card-color: var(--mc-text-primary);
    --bs-list-group-bg: var(--mc-surface-raised);
    --bs-list-group-color: var(--mc-text-primary);
    background-color: var(--mc-surface-raised);
    border-color: var(--mc-border-subtle);
    color: var(--mc-text-primary);
}

[data-bs-theme="dark"] .card-header,
[data-bs-theme="dark"] .card-footer,
[data-bs-theme="dark"] .accordion-button,
[data-bs-theme="dark"] .dropdown-header {
    background-color: var(--mc-surface-subtle);
    border-color: var(--mc-border-subtle);
    color: var(--mc-text-primary);
}

[data-bs-theme="dark"] .accordion-button:not(.collapsed) {
    background-color: var(--mc-color-primary-50);
    color: var(--mc-color-primary-700);
}

[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select,
[data-bs-theme="dark"] .input-group-text {
    background-color: #0f1726;
    border-color: var(--mc-border-strong);
    color: var(--mc-text-primary);
}

[data-bs-theme="dark"] .form-control::placeholder {
    color: var(--mc-text-muted);
    opacity: 1;
}

[data-bs-theme="dark"] .form-control:disabled,
[data-bs-theme="dark"] .form-select:disabled,
[data-bs-theme="dark"] .form-control[readonly] {
    background-color: #111827;
    color: var(--mc-text-secondary);
    opacity: 1;
}

[data-bs-theme="dark"] .table {
    --bs-table-color: var(--mc-text-primary);
    --bs-table-bg: transparent;
    --bs-table-border-color: var(--mc-border-subtle);
    --bs-table-striped-color: var(--mc-text-primary);
    --bs-table-striped-bg: rgba(255, 255, 255, 0.025);
    --bs-table-hover-color: var(--mc-text-primary);
    --bs-table-hover-bg: var(--mc-color-primary-50);
}

[data-bs-theme="dark"] .text-muted,
[data-bs-theme="dark"] .text-secondary {
    color: var(--mc-text-muted) !important;
}

[data-bs-theme="dark"] .btn-dark {
    background: var(--mc-surface-subtle);
    border-color: var(--mc-border-strong);
    color: var(--mc-text-primary);
}

[data-bs-theme="dark"] .btn-outline-primary {
    border-color: var(--mc-color-primary-400);
    color: var(--mc-color-primary-700);
}

/* ---- Portal-specific translucent surfaces ---- */
[data-bs-theme="dark"] body.mc-portal-body .mc-header--portal,
[data-bs-theme="dark"] body.dashboard .mc-header--portal {
    background: rgba(15, 23, 38, 0.96);
}

[data-bs-theme="dark"] .mc-dashboard .card {
    border-color: var(--mc-border-subtle);
    background: rgba(21, 29, 45, 0.98);
}

[data-bs-theme="dark"] .mc-dashboard .card .card-header {
    background: linear-gradient(180deg, #1d293c, #192437);
    border-color: var(--mc-border-subtle);
}

[data-bs-theme="dark"] body.mc-portal-body .mc-footer--portal,
[data-bs-theme="dark"] body.dashboard .mc-footer--portal,
[data-bs-theme="dark"] .mc-footer {
    border-color: var(--mc-border-subtle);
    background: rgba(15, 23, 38, 0.90);
    color: var(--mc-text-secondary);
}

/* ---- Commerce and storefront surfaces that are explicitly pale in light mode ---- */
[data-bs-theme="dark"] .mc-product-folder {
    --mc-folder-tab-border: var(--mc-border-subtle);
    --mc-folder-page-bg: var(--mc-surface-raised);
    border-color: var(--mc-border-subtle);
    background: linear-gradient(180deg, #151d2d, #111827);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

[data-bs-theme="dark"] .mc-product-folder-tabs,
[data-bs-theme="dark"] .mc-product-folder-tab,
[data-bs-theme="dark"] .mc-product-folder:has(.mc-product-folder-page:target) .mc-product-folder-tab--default {
    border-color: var(--mc-border-subtle);
    background: #182235;
    color: var(--mc-text-secondary);
}

[data-bs-theme="dark"] .mc-product-folder-tab:hover,
[data-bs-theme="dark"] .mc-product-folder-tab:focus-visible,
[data-bs-theme="dark"] .mc-product-folder:not(:has(.mc-product-folder-page:target)) .mc-product-folder-tab--default {
    border-color: var(--mc-color-primary-400);
    background: linear-gradient(180deg, #203052, #1a2948);
    color: var(--mc-color-primary-700);
}

[data-bs-theme="dark"] .mc-product-folder-pages,
[data-bs-theme="dark"] .mc-product-card--folder,
[data-bs-theme="dark"] .mc-product-card,
[data-bs-theme="dark"] .mc-pricing-card {
    border-color: var(--mc-border-subtle);
    background: var(--mc-surface-raised);
}

[data-bs-theme="dark"] .mc-storefront-band--essentials,
[data-bs-theme="dark"] .mc-storefront-band--trust,
[data-bs-theme="dark"] .mc-storefront-band--utility {
    background: var(--mc-surface-page);
    border-color: var(--mc-border-subtle);
}

[data-bs-theme="dark"] .mc-storefront-band--closing,
[data-bs-theme="dark"] .mc-hero--dark {
    background: var(--mc-gradient-closing);
    border-color: var(--mc-border-subtle);
}

[data-bs-theme="dark"] .mc-button--inverse.mc-button--outline,
[data-bs-theme="dark"] .mc-search-tld-chip {
    border-color: var(--mc-border-strong);
    background: var(--mc-surface-subtle);
    color: var(--mc-color-primary-700);
}

[data-bs-theme="dark"] .mc-search--hero,
[data-bs-theme="dark"] .mc-domain-results-panel,
[data-bs-theme="dark"] .mc-domain-suggestion-block,
[data-bs-theme="dark"] .modus-domain-suggestions {
    border-color: var(--mc-border-subtle);
    background: var(--mc-surface-raised);
    box-shadow: var(--mc-shadow-md);
}

[data-bs-theme="dark"] .mc-intent-banner {
    border-color: var(--mc-border-subtle);
    background: var(--mc-surface-raised);
}

[data-bs-theme="dark"] .mc-intent-banner-text strong {
    color: var(--mc-text-primary);
}

[data-bs-theme="dark"] .mc-intent-banner-text span {
    color: var(--mc-text-secondary);
}

[data-bs-theme="dark"] .mc-search--hero .mc-search-field--needs-attention {
    background: rgba(154, 103, 0, 0.18);
}

[data-bs-theme="dark"] .mc-domain-result-primary,
[data-bs-theme="dark"] .modus-domain-result-card {
    border-color: #285a47;
    background: linear-gradient(180deg, #10291f, #14251f);
}

[data-bs-theme="dark"] .mc-domain-result-primary--unavailable {
    border-color: #63352f;
    background: linear-gradient(180deg, #301b1b, #26191a);
}

[data-bs-theme="dark"] .mc-domain-result-label,
[data-bs-theme="dark"] .modus-domain-result-copy strong,
[data-bs-theme="dark"] .mc-domain-suggestion-status,
[data-bs-theme="dark"] .modus-domain-suggestion-status {
    color: var(--mc-color-success);
}

[data-bs-theme="dark"] .mc-domain-result-primary--unavailable .mc-domain-result-label {
    color: var(--mc-color-danger);
}

[data-bs-theme="dark"] .mc-domain-suggestion-heading,
[data-bs-theme="dark"] .modus-domain-suggestions-heading {
    border-color: var(--mc-border-subtle);
    background: var(--mc-color-primary-50);
}

[data-bs-theme="dark"] .mc-domain-suggestion-row,
[data-bs-theme="dark"] .modus-domain-suggestion-row {
    border-color: var(--mc-border-subtle);
}

[data-bs-theme="dark"] .mc-domain-suggestion-row:hover,
[data-bs-theme="dark"] .mc-domain-suggestion-row:focus-visible {
    background: var(--mc-color-primary-50);
}
