/* Light reading surfaces for the existing AGY layout. Brand card art is unchanged.
   Loaded after refinement.css; one theme attribute outranks the legacy color layer.
   No typography, geometry, visibility, or interaction rules belong in this file. */

html[data-theme="light"] body[data-design="agy"][data-page][data-lang] {
  color-scheme: light;
  --canvas: #f5f7fa;
  --paper: #ffffff;
  --canvas-elevated: #edf2f7;
  --raised: #edf2f7;
  --paper-hover: #e6edf5;
  --line: #d9e2ec;
  --line-soft: #d9e2ec;
  --surface-border: #d9e2ec;
  --surface-border-hover: #a5b7ce;
  --paper-emphasis: #eff4fd;
  --ink: #172637;
  --ink-secondary: #384c62;
  --muted: #536377;
  --subtle: #5d6a7b;
  --accent: #315fc7;
  --accent-hover: #264da5;
  --accent-ink: #ffffff;
  --green: #157347;
  --amber: #895900;
  --ux-bg: var(--canvas);
  --ux-surface: var(--paper);
  --ux-line: var(--line);
  --ux-accent: var(--accent);
  --ux-ink: var(--ink);
  --ux-muted: var(--muted);
  --ux-subtle: var(--subtle);
  --banner-bg: #fff0e4;
  --banner-border: #d9e2ec;
  --banner-accent: #9d4b17;
  --banner-accent-hover: #803b10;
  background: var(--canvas);
  color: var(--ink);
}

html[data-theme="light"] body[data-design="agy"][data-page][data-lang] ::selection {
  background: #cfe0fb;
  color: var(--ink);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :focus-visible {
  outline-color: var(--accent);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(input, textarea)::placeholder {
  color: var(--subtle);
  opacity: 1;
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] option {
  background: var(--paper);
  color: var(--ink);
}

/* Navigation and footer remain quiet; active links carry the same blue as actions. */
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.header, .mobile-nav, .detail-section-nav) {
  background: var(--paper);
  border-color: var(--line);
  box-shadow: none;
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.desktop-nav a, .language, .header-compare, .menu-toggle) {
  color: var(--muted);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.desktop-nav a.active, .desktop-nav a:hover, .language:hover, .header-compare:hover, .menu-toggle:hover) {
  color: var(--accent);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.desktop-nav a.active, .feed-topics button.selected)::after {
  background: var(--accent);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .mobile-nav a:hover {
  background: var(--canvas-elevated);
  color: var(--ink);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .mobile-nav a.active {
  background: #e5edfc;
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .footer {
  background: var(--canvas-elevated);
  border-color: var(--line);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.footer-links a:hover, .breadcrumb a:hover) {
  color: var(--accent);
}

/* Each offer uses a light brand surface, with a dark brand-colored action. */
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .offers {
  background: var(--banner-bg);
  border-color: var(--banner-border);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .offer-slide {
  --offer-surface: #fff0e4;
  --banner-accent: #9d4b17;
  --banner-accent-hover: #803b10;
  --offer-stage: #fff0e4;
  background: var(--paper);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .offer-mint {
  --offer-surface: #e3f4f3;
  --offer-stage: #dcefee;
  --banner-accent: #116c71;
  --banner-accent-hover: #0d565b;
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] #offer-etherfi {
  --offer-surface: #f1eafb;
  --offer-stage: #ece4f7;
  --banner-accent: #65449b;
  --banner-accent-hover: #523680;
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.offer-brand-name, .offer-title, .offer-title-mobile) {
  color: var(--ink);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .offer-description {
  color: var(--ink-secondary);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.offer-brand, .offer-tag, .offer-terms) {
  color: var(--muted);
  border-color: var(--surface-border-hover);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .offer-cta {
  background: var(--banner-accent);
  color: #ffffff;
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .offer-cta:hover {
  background: var(--banner-accent-hover);
  color: #ffffff;
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .offer-source {
  color: var(--banner-accent);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .offer-dot span {
  background: var(--subtle);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .offer-dot:is(:hover, [aria-current="true"]) span {
  background: var(--accent);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .offer-dot:focus-visible {
  outline-color: var(--accent);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.offer-art, .detail-card-art, .discovery-card) .designed-card {
  box-shadow: inset 0 0 0 1px #ffffff24, 0 8px 24px #1726371a;
}

/* Catalog surfaces and controls. Selected filters stay flat, without dark fills. */
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.home-search, .home-select, .search-field, .select-field, .sort-wrap select, .country-picker-btn, .country-picker-search-input) {
  background: var(--paper);
  border-color: var(--line);
  color: var(--ink);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.home-select select, .select-field select, .home-search input, .search-field input) {
  background: transparent;
  color: var(--ink);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.home-search, .home-select, .search-field, .select-field):focus-within {
  border-color: var(--accent);
  box-shadow: 0 0 0 1px var(--accent);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .search-shortcut {
  background: var(--canvas);
  border-color: var(--line);
  color: var(--subtle);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .feed-topics button.selected {
  color: var(--accent);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .filter-tag {
  background: #e5edfc;
  border-color: #c2d2ee;
  color: var(--accent);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .discovery-card {
  background: var(--paper);
  border-color: var(--line);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .discovery-card:hover {
  border-color: var(--surface-border-hover);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .discovery-card .card-apply-link {
  background: #edf3ff;
  border-color: #c2d2ee;
  color: var(--accent);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .discovery-card .card-apply-link:hover {
  background: #e5edfc;
  border-color: var(--accent);
  color: var(--accent);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .country-tile:hover .country-info h3 {
  color: var(--accent);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .guide-card {
  border-color: var(--line);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .guide-card:hover {
  border-color: var(--accent);
}

/* Native country picker, including the body-level top-layer panel. */
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .country-picker-popover {
  background: var(--paper);
  border-color: var(--surface-border-hover);
  color: var(--ink);
  box-shadow: 0 14px 40px #17263726;
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.country-picker-popover, .compare-terms)::backdrop {
  background: #17263726;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.country-picker-option:hover, .country-picker-option.is-active, .country-picker-option.is-selected, .country-picker-option[aria-selected="true"]) {
  background: #e5edfc;
  color: var(--accent);
}

/* Dense comparison: white rows, light headers, a quiet blue estimate emphasis. */
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.comparison-scroll, .quick-scroll, .fee-table-scroll, .guide-table-scroll) {
  background: var(--paper);
  border-color: var(--line);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.comparison-table, .quick-table, .fee-table, .guide-table) :is(th, td) {
  border-color: var(--line);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.comparison-table, .quick-table, .fee-table, .guide-table) thead th {
  background: var(--canvas-elevated);
  color: var(--ink-secondary);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.comparison-table, .quick-table, .fee-table, .guide-table) tbody :is(th, td) {
  background: var(--paper);
  color: var(--ink);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.comparison-table, .quick-table) tbody th {
  box-shadow: 1px 0 0 var(--line);
}
/* Existing AGY corner backgrounds are !important; override only that corner. */
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .comparison-table .col-card {
  background: var(--canvas-elevated) !important;
  box-shadow: 1px 0 0 var(--line);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.comparison-table td.is-emphasis, .quick-table td.is-emphasis, .fee-table .fee-total) {
  background: var(--paper-emphasis);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .quick-table .quick-current > :is(th, td) {
  background: var(--paper-emphasis);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .quick-table .quick-current > th {
  box-shadow: inset 3px 0 var(--accent), 1px 0 0 var(--line);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.comparison-table, .quick-table, .fee-table, .guide-table) tbody tr:hover > :is(th, td) {
  background: var(--canvas-elevated);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.dense-val, .dense-full-val, .fee-total strong) {
  color: var(--ink);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(td.is-emphasis .dense-val, .quick-comparison td.is-emphasis .dense-val) {
  color: var(--ink);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.dense-note, .support-caption, .quick-comparison .dense-note, .quick-comparison .support-caption) {
  color: var(--muted);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.dense-full-note, .quick-comparison .dense-full-note) {
  color: var(--ink-secondary);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.compare-toolbar-field select, .compare-card-controls select[data-compare-card], .compare-card-header select[data-compare-card], .compare-actions .button.secondary, .compare-scroll-buttons button, .cb-custom) {
  background: var(--paper);
  border-color: var(--line);
  color: var(--ink);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .checkbox-label input:checked + .cb-custom {
  background: var(--accent);
  border-color: var(--accent);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .compare-scroll-buttons button:hover:not(:disabled) {
  background: var(--canvas-elevated);
  color: var(--accent);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .compare-remove:hover {
  background: #fbecef;
  border-color: #e7b9c4;
  color: #a12c42;
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .fee-error {
  color: #a12c42;
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .fee-controls input[aria-invalid="true"] {
  border-color: #a12c42;
}

/* Status keeps color, shape, and captions; unknown never looks like a green yes. */
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] [data-support] {
  --support-bg: #e6ecf3;
  --support-ink: #536377;
  --support-ring: transparent;
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] [data-support="yes"] {
  --support-bg: #157347;
  --support-ink: #ffffff;
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] [data-support="no"] {
  --support-bg: #f8e7eb;
  --support-ink: #a12c42;
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is([data-support="conditional"], [data-support="paused"]) {
  --support-bg: #fff0d8;
  --support-ink: #895900;
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .detail-support .support-mark {
  background: var(--support-bg);
  color: var(--support-ink);
}

/* Detail sections are continuous text, with light edition pills and source dialogs. */
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .variant-jumps a {
  background: var(--paper);
  border-color: var(--line);
  color: var(--ink-secondary);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .variant-jumps a:hover {
  background: var(--canvas-elevated);
  color: var(--accent);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .variant-jumps a[aria-selected="true"] {
  background: #e5edfc;
  border-color: var(--accent);
  color: var(--accent);
  box-shadow: inset 0 -2px var(--accent);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .detail-section-nav a[data-detail-section]:is(.is-active, [aria-current="location"]) {
  background: transparent;
  border-color: var(--accent);
  color: var(--accent);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .variant-availability strong {
  color: #895900;
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .variant-availability[data-residence-status="eligible"] strong {
  color: #157347;
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.variant-notice, .discontinued-notice) {
  background: #fff6e9;
  border-color: #e5cda5;
  color: var(--ink-secondary);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.variant-notice .notice-head strong, .discontinued-notice .notice-icon, .card-notice) {
  color: #895900;
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .compare-terms:popover-open {
  background: var(--paper);
  border-color: var(--surface-border-hover);
  color: var(--ink);
  box-shadow: 0 16px 48px #17263726;
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.compare-terms-close:hover, .quick-comparison .compare-terms-close:hover) {
  background: var(--canvas-elevated);
  color: var(--ink);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .button.secondary {
  background: var(--paper);
  border-color: var(--line);
  color: var(--ink-secondary);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] .button.secondary:hover {
  background: var(--canvas-elevated);
  border-color: var(--surface-border-hover);
  color: var(--accent);
}

html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.comparison-scroll, .quick-scroll, .fee-table-scroll, .guide-table-scroll, .country-picker-listbox) {
  scrollbar-color: #8da0b8 var(--canvas-elevated);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.comparison-scroll, .quick-scroll, .fee-table-scroll, .guide-table-scroll, .country-picker-listbox)::-webkit-scrollbar-track {
  background: var(--canvas-elevated);
}
html[data-theme="light"] body[data-design="agy"][data-page][data-lang] :is(.comparison-scroll, .quick-scroll, .fee-table-scroll, .guide-table-scroll, .country-picker-listbox)::-webkit-scrollbar-thumb {
  background: #8da0b8;
}