/*
 * Shared optional light theme.
 * The site's existing CSS remains the dark default; every rule here is scoped
 * to an explicit light-theme selection.
 */
html[data-theme="light"] {
  --bg: #f3f6fb;
  --bg2: #ffffff;
  --card: #ffffff;
  --panel-bg: rgba(255, 255, 255, .92);
  --text: #172033;
  --muted: #52637a;
  --muter: #64748b;
  --border: rgba(51, 65, 85, .22);
  --code: #edf2f7;
  --tabbg: #e8eef7;
  --accent: #2563eb;
  color-scheme: light;
}

html[data-theme="light"] body {
  background:
    radial-gradient(1200px 600px at 5% -10%, #dbeafe 10%, transparent 42%),
    radial-gradient(1200px 600px at 110% 10%, #e0f2fe 10%, transparent 42%),
    linear-gradient(180deg, #f8fafc 0%, #eef3f9 100%) !important;
  color: var(--text) !important;
}

html[data-theme="light"] a:not(.btn) { color: #1d4ed8; }
html[data-theme="light"] a:not(.btn):hover { color: #1e40af; }
html[data-theme="light"] .text-light,
html[data-theme="light"] .text-white { color: var(--text) !important; }
html[data-theme="light"] .text-secondary { color: #64748b !important; }
html[data-theme="light"] .text-info { color: #0369a1 !important; }
html[data-theme="light"] .muted,
html[data-theme="light"] .soft,
html[data-theme="light"] .small-muted,
html[data-theme="light"] .auth-muted,
html[data-theme="light"] .article-meta,
html[data-theme="light"] .doc-desc,
html[data-theme="light"] .subhead,
html[data-theme="light"] .fineprint,
html[data-theme="light"] .plan-note,
html[data-theme="light"] .smallprint { color: #52637a !important; }

html[data-theme="light"] .disclaimer {
  color: #334155 !important;
}

html[data-theme="light"] .kv .k,
html[data-theme="light"] .kv .v,
html[data-theme="light"] .k,
html[data-theme="light"] .v,
html[data-theme="light"] .edi-table th {
  color: var(--text) !important;
}

html[data-theme="light"] .panel,
html[data-theme="light"] .card,
html[data-theme="light"] .article-card,
html[data-theme="light"] .doc-card,
html[data-theme="light"] .auth-card,
html[data-theme="light"] .plan-card,
html[data-theme="light"] .help-panel,
html[data-theme="light"] .summary-card,
html[data-theme="light"] .callout,
html[data-theme="light"] .cta,
html[data-theme="light"] .cta-box,
html[data-theme="light"] .edi-group {
  background: rgba(255, 255, 255, .92) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
  box-shadow: 0 10px 30px rgba(15, 23, 42, .09) !important;
}

/* File-list wrappers are layout containers, not cards. Keep their background
   transparent so only the individual filename chips are visible. */
html[data-theme="light"] .filelist,
html[data-theme="light"] #fileChips,
html[data-theme="light"] #chipsBox {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

html[data-theme="light"] .plan-top,
html[data-theme="light"] header.article-header { border-color: var(--border) !important; }
html[data-theme="light"] .feature,
html[data-theme="light"] .help-text { color: var(--text) !important; }

html[data-theme="light"] .badge-hero,
html[data-theme="light"] .badge-soft,
html[data-theme="light"] .badge-chip,
html[data-theme="light"] .pill,
html[data-theme="light"] .tag,
html[data-theme="light"] .chip,
html[data-theme="light"] .stat,
html[data-theme="light"] .edi-tag,
html[data-theme="light"] .badge:not(.text-bg-success):not(.text-bg-danger):not(.text-bg-warning) {
  background: #e7f0ff !important;
  border-color: #b8cff5 !important;
  color: #173a70 !important;
}

html[data-theme="light"] .dropzone {
  background: rgba(255, 255, 255, .7) !important;
  border-color: rgba(71, 85, 105, .38) !important;
  color: var(--text) !important;
}
html[data-theme="light"] .dropzone.dragover { background: #dbeafe !important; }

html[data-theme="light"] input:not([type="checkbox"]):not([type="radio"]),
html[data-theme="light"] textarea,
html[data-theme="light"] select,
html[data-theme="light"] .form-control,
html[data-theme="light"] .form-select,
html[data-theme="light"] .search-input {
  background: #ffffff !important;
  border-color: rgba(71, 85, 105, .32) !important;
  color: var(--text) !important;
}
html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder,
html[data-theme="light"] .form-control::placeholder,
html[data-theme="light"] .search-input::placeholder { color: #718096 !important; }
html[data-theme="light"] input:not([type="checkbox"]):not([type="radio"]):focus,
html[data-theme="light"] textarea:focus,
html[data-theme="light"] select:focus,
html[data-theme="light"] .form-control:focus,
html[data-theme="light"] .form-select:focus {
  background: #ffffff !important;
  color: var(--text) !important;
  border-color: #60a5fa !important;
  box-shadow: 0 0 0 .18rem rgba(37, 99, 235, .16) !important;
}
html[data-theme="light"] .form-label { color: var(--text) !important; }

html[data-theme="light"] .form-check-input {
  background-color: #ffffff !important;
  border-color: #9aa9bc !important;
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, .06) !important;
}

html[data-theme="light"] .form-check-input:hover:not(:disabled) {
  border-color: #64748b !important;
}

html[data-theme="light"] .form-check-input:checked {
  background-color: #2563eb !important;
  border-color: #1d4ed8 !important;
  box-shadow:
    0 0 0 1px rgba(37, 99, 235, .08),
    0 2px 7px rgba(37, 99, 235, .22) !important;
}

html[data-theme="light"] .form-check-input:focus {
  border-color: #3b82f6 !important;
  box-shadow: 0 0 0 .2rem rgba(37, 99, 235, .18) !important;
}

html[data-theme="light"] .form-check-input:disabled {
  opacity: .55 !important;
}

html[data-theme="light"] .btn-outline-light {
  background: transparent !important;
  border-color: #64748b !important;
  color: #26364d !important;
}
html[data-theme="light"] .btn-outline-light:hover,
html[data-theme="light"] .btn-outline-light:focus {
  background: #26364d !important;
  border-color: #26364d !important;
  color: #ffffff !important;
}

html[data-theme="light"] table,
html[data-theme="light"] .table {
  --bs-table-bg: rgba(255, 255, 255, .82);
  --bs-table-color: var(--text);
  --bs-table-border-color: var(--border);
  color: var(--text) !important;
  border-color: var(--border) !important;
}
html[data-theme="light"] table td,
html[data-theme="light"] table th,
html[data-theme="light"] .table td,
html[data-theme="light"] .table th,
html[data-theme="light"] .edi-table td,
html[data-theme="light"] .edi-table th {
  background-color: rgba(255, 255, 255, .82) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
}
html[data-theme="light"] table th,
html[data-theme="light"] .table th,
html[data-theme="light"] .edi-table th { background-color: #dce7f5 !important; }
html[data-theme="light"] .table-dark,
html[data-theme="light"] .table-darkish { --bs-table-color: var(--text); --bs-table-bg: #ffffff; }

html[data-theme="light"] code,
html[data-theme="light"] pre,
html[data-theme="light"] pre code,
html[data-theme="light"] .kbd {
  background: #edf2f7 !important;
  border-color: var(--border) !important;
  color: #334155 !important;
}

html[data-theme="light"] .section-title,
html[data-theme="light"] .edi-head,
html[data-theme="light"] .accordion-button,
html[data-theme="light"] .nav-tabs .nav-link.active {
  background: #e7eef8 !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
}
html[data-theme="light"] .accordion-item,
html[data-theme="light"] .accordion-body {
  background: transparent !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
}
html[data-theme="light"] .nav-tabs { border-color: var(--border) !important; }
html[data-theme="light"] .nav-tabs .nav-link { color: #334155 !important; }
html[data-theme="light"] .progress { background: #d9e2ef !important; }

html[data-theme="light"] [style*="background:rgba(255,255,255,.03)"],
html[data-theme="light"] [style*="background: rgba(255,255,255,.03)"] {
  background: rgba(255, 255, 255, .72) !important;
  border-color: var(--border) !important;
}

html[data-theme="light"] footer.site-footer {
  background: rgba(255, 255, 255, .55) !important;
  border-color: var(--border) !important;
}
html[data-theme="light"] footer.site-footer h6,
html[data-theme="light"] footer.site-footer a { color: var(--text) !important; }

html[data-theme="light"] nav.navbar.site-nav .nav-link { color: var(--text) !important; }
html[data-theme="light"] nav.navbar.site-nav .navbar-toggler {
  border-color: rgba(51, 65, 85, .35) !important;
}
html[data-theme="light"] nav.navbar.site-nav .navbar-toggler-icon { filter: none; }
html[data-theme="light"] nav.navbar.site-nav .navbar-nav.auth-nav .btn-outline-light {
  color: #26364d !important;
  border-color: rgba(51, 65, 85, .4) !important;
  background: transparent !important;
}
html[data-theme="light"] nav.navbar.site-nav .navbar-nav.auth-nav .btn-outline-light:hover,
html[data-theme="light"] nav.navbar.site-nav .navbar-nav.auth-nav .btn-outline-light:focus {
  color: #ffffff !important;
  border-color: #26364d !important;
  background: #26364d !important;
}

/* Registry-owned article workflow and relationship rails. */
.tool-cta,
.related-resources {
  max-width: 1040px;
  margin: 2rem auto;
  padding: 1.25rem;
  border: 1px solid var(--border, rgba(148, 163, 184, .3));
  border-radius: 16px;
  background: var(--panel, rgba(15, 23, 42, .72));
  color: var(--text, #e5eefb);
}
.tool-cta h2,
.related-resources h2 { margin-top: 0; }
.tool-cta__links { display: flex; flex-wrap: wrap; gap: .75rem; }
.tool-cta__link {
  display: inline-block;
  padding: .72rem 1rem;
  border-radius: 9px;
  background: #1976d2;
  color: #fff !important;
  font-weight: 750;
  text-decoration: none;
}
.tool-cta__link:hover { background: #0f65bd; }
.tool-cta__link:focus-visible,
.related-resources a:focus-visible { outline: 3px solid #7db8ff; outline-offset: 3px; }
.related-resources__list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.related-resources__item {
  min-width: 0;
  padding: 1rem;
  border: 1px solid var(--border, rgba(148, 163, 184, .3));
  border-radius: 12px;
}
.related-resources__item a { font-weight: 750; overflow-wrap: anywhere; }
.related-resources__item p { margin: .45rem 0 0; }
html[data-theme="light"] .tool-cta,
html[data-theme="light"] .related-resources,
html[data-theme="light"] .related-resources__item { background: #fff; color: #172235; }
@media (max-width: 640px) {
  .tool-cta,
  .related-resources { margin: 1.5rem .75rem; padding: 1rem; }
  .tool-cta__links,
  .tool-cta__link { width: 100%; }
  .tool-cta__link { text-align: center; }
  .related-resources__list { grid-template-columns: 1fr; }
}