/* ============================================================================
   AtomicAvenue dark theme
   ----------------------------------------------------------------------------
   Applies only under html[data-bs-theme="dark"], which the master's theme-boot
   script sets from the browser's prefers-color-scheme (or a stored override in
   localStorage 'aa-theme' -- the hook for a future manual toggle).

   Bootstrap 5.3 handles its own components (forms, cards, modals, dropdowns,
   .table) via data-bs-theme; this file covers the site's custom chrome, which
   BS5 knows nothing about. Lives in /atomic/Content so it deploys with the app
   (the live site-root /Styles folder deploys separately -- do not move it there).
   ========================================================================== */

/* ---- Page shell ---------------------------------------------------------- */
[data-bs-theme="dark"] body {
    background-color: #10151d;              /* was #91a8d1 signature light blue */
}
[data-bs-theme="dark"] .contentWrapperNew {
    background-color: #1b2129;              /* was white */
    color: #dee2e6;
}
[data-bs-theme="dark"] a {
    color: #7cb3f5;                         /* was darkblue */
}
[data-bs-theme="dark"] a:hover {
    color: #a3cbf9;
}

/* ---- Header chrome: gradient + menu bar stay LIGHT in both themes --------- */
/* The topHeader gradient and menu bar keep their standard light look
   regardless of theme (deliberate: the header graphic is the site's
   identity). Top-level menu text stays black on the gradient via the base
   rules; only the fly-out panels below invert. The SEARCH BAND, however,
   goes dark with the theme. */
[data-bs-theme="dark"] #mainSearchArea {
    /* Neutral dark gray, deliberately lighter than the page (#10151d) and the
       content column (#1b2129) so the band stays visually distinct. */
    background-color: #2c3239;              /* was #cce5f4 */
    color: #cfd6dd;
}
[data-bs-theme="dark"] #mainSearchArea a {
    color: #7cb3f5;
}
[data-bs-theme="dark"] #searchArea input[type="text"] {
    background: #232a33;                    /* drops the dark-on-light icon png */
    color: #e6ebf0;
    padding-left: 0.75em;
}

/* ---- Menu fly-outs invert (panels are dark; the menu BAR stays light) ----- */
[data-bs-theme="dark"] .nav li ul {
    border-color: #3a4450;
    box-shadow: 2px 2px 3px #000000;
}
[data-bs-theme="dark"] .nav li li a {
    background: #232a33;                    /* was #f5f5f7 */
    border-top-color: #1b2129;              /* was white */
    color: #cfd6dd !important;              /* base rule is !important too */
}
[data-bs-theme="dark"] .nav > li > ul > li a:hover,
[data-bs-theme="dark"] .nav li li a:hover {
    background: #2e3742;                    /* was lightgray / #f5f5f7 */
}
[data-bs-theme="dark"] .nav li li li a {
    background: #232a33;                    /* was whitesmoke */
}

/* ---- Search autocomplete (floats over the dark content) ------------------- */
[data-bs-theme="dark"] .autocomplete_completionListElement {
    background-color: #1f252d;              /* was white */
    border-color: #3a4450;
}
[data-bs-theme="dark"] .autocomplete_completionListElement li {
    color: #cfd6dd;                         /* was #202020 */
}

/* ---- Grids (custom, not BS .table) --------------------------------------- */
/* .gridheader keeps its #413b79 purple: it already reads well on dark. */
[data-bs-theme="dark"] .gridheaderBlack {
    background-color: #1b2129;              /* was white */
    color: #dee2e6;
}
[data-bs-theme="dark"] .griditem {
    border-top-color: #323a43;              /* was #EAEAEA */
}

/* ---- Buttons ------------------------------------------------------------- */
/* Base shim re-skins .btn-secondary to BS3's white btn-default; in dark it
   becomes a neutral dark button instead. */
[data-bs-theme="dark"] .btn-secondary {
    /* Borders run brighter than the fill so enabled buttons don't read as
       disabled on dark surfaces. */
    --bs-btn-color: #dee2e6;
    --bs-btn-bg: #343a40;
    --bs-btn-border-color: #7a838c;
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: #3d444b;
    --bs-btn-hover-border-color: #98a1aa;
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: #3d444b;
    --bs-btn-active-border-color: #98a1aa;
    --bs-btn-disabled-color: #8b939b;
    --bs-btn-disabled-bg: #343a40;
    --bs-btn-disabled-border-color: #495057;
}

/* ---- Sidebar stat boxes -------------------------------------------------- */
/* Headers (midnightblue/darkred/darkorange, white text) already work on dark;
   the borders vanish against the dark shell, so lift them a step. */
[data-bs-theme="dark"] .modern-box.darkblue,
[data-bs-theme="dark"] .modern-box-content.darkblue {
    border-color: #3d4c8f;
}
[data-bs-theme="dark"] .modern-box.darkred,
[data-bs-theme="dark"] .modern-box-content.darkred {
    border-color: #a04545;
}
[data-bs-theme="dark"] .modern-box.darkorange,
[data-bs-theme="dark"] .modern-box-content.darkorange {
    border-color: #b57a2e;
}

/* ---- Issue cards (SearchIssues.css, served from the live /Styles folder) -- */
[data-bs-theme="dark"] .issue-card {
    background: #1f252d;                    /* was #fff */
    border-color: #3a4450;                  /* was #d0d8e4 */
}
[data-bs-theme="dark"] .issue-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.6);
    border-color: #5a7ba0;
}
[data-bs-theme="dark"] .issue-card-info {
    border-color: #3a4450;                  /* was dashed #ccc */
}
[data-bs-theme="dark"] .search-error {
    background: #2c1a1a;                    /* was #fff3f3 */
    border-color: #6e3a3a;
    color: #f1a9a9;
}

/* ---- IssueDetail (the id-* system: listing cards, controls, wishlist) ----- */
/* The page's inline styles hardcode a light surface system; this inverts the
   neutral surfaces. The colored accents (condition pills, best-value/great-
   price ribbons, seller badges, rank dots) stay -- they read fine on dark. */
[data-bs-theme="dark"] .id-flash-info {
    background-color: #16283c;
    border-color: #2c4a6e;
    color: #a8cdf0;
}
[data-bs-theme="dark"] .sets-banner {
    background: #16283c;
    border-left-color: #4a7ab0;
    color: #a8cdf0;
}
[data-bs-theme="dark"] .sets-banner a {
    color: #7cb3f5;
}
[data-bs-theme="dark"] .id-cover img {
    border-color: #3a4450;
}
[data-bs-theme="dark"] .id-jump label,
[data-bs-theme="dark"] .id-sort-label,
[data-bs-theme="dark"] .id-scope-label,
[data-bs-theme="dark"] .id-scope-count,
[data-bs-theme="dark"] .id-storylines,
[data-bs-theme="dark"] .id-price-from,
[data-bs-theme="dark"] .id-copies-avail,
[data-bs-theme="dark"] .id-other-sellers,
[data-bs-theme="dark"] .id-country,
[data-bs-theme="dark"] .id-min-order,
[data-bs-theme="dark"] .id-notes-text {
    color: #8f9aa5;
}
[data-bs-theme="dark"] .id-copies-avail a,
[data-bs-theme="dark"] .id-other-sellers a {
    color: #8f9aa5;
}
[data-bs-theme="dark"] .id-copies-avail a:hover,
[data-bs-theme="dark"] .id-other-sellers a:hover {
    color: #b6c0c9;
}
[data-bs-theme="dark"] .id-jump select,
[data-bs-theme="dark"] .id-sort-select {
    background: #232a33;
    color: #dee2e6;
    border-color: #3a4450;
}
[data-bs-theme="dark"] .id-scope-toggle {
    border-color: #3a4450;
}
[data-bs-theme="dark"] .id-scope-btn {
    background: #232a33;
    color: #8f9aa5;
}
[data-bs-theme="dark"] .id-scope-btn + .id-scope-btn {
    border-left-color: #3a4450;
}
[data-bs-theme="dark"] .id-scope-btn.active {
    background: #dee2e6;
    color: #1a1a1a;
}
[data-bs-theme="dark"] .id-card {
    background: #1f252d;                    /* was #fff */
    border-color: #3a4450;                  /* was #ddd */
}
[data-bs-theme="dark"] .id-card:hover {
    border-color: #5a7ba0;
}
[data-bs-theme="dark"] .id-card.best-val  { border-color: #378add; }
[data-bs-theme="dark"] .id-card.great-val { border-color: #1d9e75; }
[data-bs-theme="dark"] .id-card.in-cart {
    background: #14251e;                    /* was #f0fbf6 */
    border-color: #1d9e75;
}
[data-bs-theme="dark"] .id-free-ship {
    color: #1d9e75;                         /* was #0f6e56; matches the great-price green */
}
[data-bs-theme="dark"] .id-star-off,
[data-bs-theme="dark"] .rv-star-empty {
    color: #4a545e;
}
[data-bs-theme="dark"] .id-atc-btn {
    background: #232a33;
    border-color: #6b7784;                  /* brighter than the fill: reads enabled */
    color: #dee2e6;
}
[data-bs-theme="dark"] .id-atc-btn:hover {
    background: #2e3742;
    border-color: #5a7ba0;
}
[data-bs-theme="dark"] .id-atc-btn:disabled {
    background: #14251e;
    border-color: #1d9e75;
    color: #6fd0ae;
}
[data-bs-theme="dark"] .id-atc-btn-remove {
    color: #e08a6a;
    border-color: #6e463a;
}
[data-bs-theme="dark"] .id-atc-btn-remove:hover {
    background: #2c1f1a;
    border-color: #a05a3a;
}
[data-bs-theme="dark"] .id-stepper {
    background: #14251e;
    border-color: #1d9e75;
}
[data-bs-theme="dark"] .id-stepper-btn {
    color: #6fd0ae;
}
[data-bs-theme="dark"] .id-stepper-btn:hover {
    background: #1b3a2d;
}
[data-bs-theme="dark"] .id-stepper-qty {
    color: #6fd0ae;
    border-left-color: #1d9e75;
    border-right-color: #1d9e75;
}
[data-bs-theme="dark"] .id-divider-line {
    background: #3a4450;
}
[data-bs-theme="dark"] .id-divider-label,
[data-bs-theme="dark"] .id-empty {
    color: #7a8590;
}
[data-bs-theme="dark"] .id-wishlist {
    background: #1f252d;                    /* was #f8f8f8 */
    border-color: #3a4450;
}
[data-bs-theme="dark"] .id-wishlist-title {
    color: #8f9aa5;
}
[data-bs-theme="dark"] .id-wishlist-row label {
    color: #9aa5b0;
}
[data-bs-theme="dark"] .id-wishlist-row select,
[data-bs-theme="dark"] .id-wishlist-row input[type="text"] {
    background: #232a33;
    color: #dee2e6;
    border-color: #3a4450;
}
[data-bs-theme="dark"] .id-wishlist-row .id-wl-btn {
    background: #232a33;
    color: #dee2e6;
    border-color: #6b7784;                  /* button border brighter than inputs */
}
[data-bs-theme="dark"] .id-wishlist-row .id-wl-btn:hover {
    background: #2e3742;
}
[data-bs-theme="dark"] .rv-badge-count {
    color: #8f9aa5;
}
[data-bs-theme="dark"] .rv-section {
    border-top-color: #3a4450;
}

/* ---- Funnel-card account pages ------------------------------------------- */
/* Ink colors defined inline in the master (Gutter ink-2 / ink-3). */
[data-bs-theme="dark"] .funnel-card .form-label {
    color: #aab6c2;
}
[data-bs-theme="dark"] .funnel-card .form-label .label-note {
    color: #8f9aa5;
}