/* Shared light-theme overrides for the compiled Tailwind application surfaces. */
html[data-theme="light"] {
  color-scheme: light;
  --surface-page: #f8fafc;
  --surface-header: rgba(255, 255, 255, 0.96);
  --surface-card: #ffffff;
  --surface-raised: #ffffff;
  --border-subtle: #d7dee8;
  --border-strong: #94a3b8;
  --text-muted: #526176;
  --accent: #1d4ed8;
  --accent-hover: #2563eb;
  --status-aging: #a14f06;
}

html[data-theme="light"] body,
html[data-theme="light"] .bg-gray-950,
html[data-theme="light"] .bg-slate-950 { background-color: #f8fafc !important; }
html[data-theme="light"] .bg-gray-900,
html[data-theme="light"] .bg-slate-900 { background-color: #ffffff !important; }
html[data-theme="light"] .bg-gray-800,
html[data-theme="light"] .bg-slate-800 { background-color: #e8edf4 !important; }
html[data-theme="light"] .bg-gray-700,
html[data-theme="light"] .bg-slate-700 { background-color: #d7dee8 !important; }
html[data-theme="light"] [class~="bg-gray-900/95"],
html[data-theme="light"] [class~="bg-slate-900/95"] { background-color: rgba(255, 255, 255, 0.96) !important; }
html[data-theme="light"] [class~="bg-gray-900/90"] { background-color: rgba(255, 255, 255, 0.93) !important; }
html[data-theme="light"] [class~="bg-gray-900/50"],
html[data-theme="light"] [class~="bg-slate-900/50"] { background-color: rgba(248, 250, 252, 0.82) !important; }
html[data-theme="light"] [class~="bg-slate-950/60"] { background-color: rgba(241, 245, 249, 0.88) !important; }

html[data-theme="light"] .text-white,
html[data-theme="light"] .text-gray-100,
html[data-theme="light"] .text-slate-100 { color: #111827 !important; }
html[data-theme="light"] .text-gray-200,
html[data-theme="light"] .text-slate-200 { color: #1f2937 !important; }
html[data-theme="light"] .text-gray-300,
html[data-theme="light"] .text-slate-300 { color: #334155 !important; }
html[data-theme="light"] .text-gray-400,
html[data-theme="light"] .text-slate-400 { color: #475569 !important; }
html[data-theme="light"] .text-gray-500,
html[data-theme="light"] .text-slate-500,
html[data-theme="light"] .text-gray-600,
html[data-theme="light"] .text-slate-600 { color: #526176 !important; }
html[data-theme="light"] .text-blue-400 { color: #1d4ed8 !important; }
html[data-theme="light"] .text-cyan-300,
html[data-theme="light"] .text-cyan-400 { color: #0e7490 !important; }
html[data-theme="light"] .text-emerald-400 { color: #047857 !important; }
html[data-theme="light"] .text-amber-400 { color: #a14f06 !important; }
html[data-theme="light"] .text-red-300,
html[data-theme="light"] .text-red-400,
html[data-theme="light"] .text-rose-300 { color: #b91c1c !important; }

html[data-theme="light"] .border-gray-900,
html[data-theme="light"] .border-gray-800,
html[data-theme="light"] .border-slate-900,
html[data-theme="light"] .border-slate-800 { border-color: #d7dee8 !important; }
html[data-theme="light"] .border-gray-700,
html[data-theme="light"] .border-gray-600,
html[data-theme="light"] .border-slate-700,
html[data-theme="light"] .border-slate-600 { border-color: #aab6c5 !important; }
html[data-theme="light"] .divide-gray-800 > :not([hidden]) ~ :not([hidden]),
html[data-theme="light"] .divide-slate-800 > :not([hidden]) ~ :not([hidden]) { border-color: #d7dee8 !important; }

html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea { color: #111827; }
html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder { color: #64748b !important; opacity: 1; }
html[data-theme="light"] input[type="checkbox"] { background-color: #ffffff !important; border-color: #94a3b8 !important; }
html[data-theme="light"] input[type="checkbox"]:checked { background-color: #2563eb !important; border-color: #2563eb !important; }

html[data-theme="light"] .hover\:bg-gray-900:hover,
html[data-theme="light"] .hover\:bg-slate-900:hover { background-color: #f1f5f9 !important; }
html[data-theme="light"] .hover\:bg-gray-800:hover,
html[data-theme="light"] .hover\:bg-slate-800:hover { background-color: #e2e8f0 !important; }
html[data-theme="light"] .hover\:bg-gray-700:hover,
html[data-theme="light"] .hover\:bg-slate-700:hover { background-color: #d7dee8 !important; }
html[data-theme="light"] .hover\:text-white:hover { color: #111827 !important; }
html[data-theme="light"] .hover\:text-gray-200:hover,
html[data-theme="light"] .hover\:text-slate-200:hover { color: #1f2937 !important; }

html[data-theme="light"] .nav-button,
html[data-theme="light"] .ui-button-secondary { background: #e8edf4; color: #334155; }
html[data-theme="light"] .user-avatar-shell { background: #dbe4ef; color: #1e3a5f; }
html[data-theme="light"] .nav-button:hover,
html[data-theme="light"] .ui-button-secondary:hover,
html[data-theme="light"] .icon-button:hover { background: #d7dee8; color: #111827; }
html[data-theme="light"] .field-control:disabled { color: #526176; background: #edf1f6; border-color: #cbd5e1; }
html[data-theme="light"] .inventory-layout-control { background: #f1f5f9; }
html[data-theme="light"] .layout-choice:hover { background: #d7dee8; color: #111827; }
html[data-theme="light"] .layout-choice[aria-pressed="true"] { background: #1d4ed8; color: #ffffff; }
html[data-theme="light"] .inventory-filter-chip { background: #e8edf4; color: #334155; }
html[data-theme="light"] .inventory-filter-chip:hover { background: #d7dee8; color: #111827; }
html[data-theme="light"] .filter-section summary:hover { color: #111827; }
html[data-theme="light"] ::-webkit-scrollbar-track { background: #e2e8f0; }
html[data-theme="light"] ::-webkit-scrollbar-thumb { background: #94a3b8; }

.price-breakdown-summary {
  align-items: center;
  cursor: pointer;
  display: flex;
  gap: 0.75rem;
  justify-content: space-between;
  list-style: none;
  user-select: none;
}
.price-breakdown-summary::-webkit-details-marker { display: none; }
.price-breakdown-summary::after {
  border-bottom: 2px solid currentColor;
  border-right: 2px solid currentColor;
  content: '';
  flex: 0 0 auto;
  height: 0.45rem;
  margin-right: 0.15rem;
  transform: rotate(45deg);
  transition: transform 150ms ease;
  width: 0.45rem;
}
.price-breakdown-disclosure[open] > .price-breakdown-summary::after {
  transform: rotate(225deg);
}
.price-breakdown-summary:focus-visible {
  border-radius: 0.25rem;
  outline: 2px solid #60a5fa;
  outline-offset: 4px;
}
@media (prefers-reduced-motion: reduce) {
  .price-breakdown-summary::after { transition: none; }
}

/* Photos, fullscreen galleries, and modal backdrops intentionally stay dark. */
html[data-theme="light"] .theme-photo-surface,
html[data-theme="light"] .theme-photo-surface.bg-gray-950,
html[data-theme="light"] .theme-photo-surface.bg-slate-950,
html[data-theme="light"] .theme-photo-surface.bg-gray-900,
html[data-theme="light"] .theme-photo-surface.bg-slate-900 { background-color: #020617 !important; color: #f8fafc !important; }
html[data-theme="light"] .theme-photo-surface .text-white,
html[data-theme="light"] .theme-photo-surface .text-gray-100,
html[data-theme="light"] .theme-photo-surface .text-gray-400,
html[data-theme="light"] .theme-photo-surface .text-slate-100 { color: #f8fafc !important; }

/* Keep high-contrast status and primary-action text readable. */
html[data-theme="light"] .bg-blue-700.text-white,
html[data-theme="light"] .bg-blue-600.text-white,
html[data-theme="light"] .bg-red-600.text-white,
html[data-theme="light"] .bg-orange-600.text-white,
html[data-theme="light"] .employee-app .bg-orange-700.text-white,
html[data-theme="light"] .bg-emerald-700.text-white,
html[data-theme="light"] .bg-indigo-700.text-white,
html[data-theme="light"] .ui-button-primary { color: #ffffff !important; }
html[data-theme="light"] .bg-emerald-800 {
  background-color: #047857 !important;
  color: #ffffff !important;
}
html[data-theme="light"] .bg-red-950,
html[data-theme="light"] .bg-rose-950 {
  background-color: #7f1d1d !important;
  color: #ffffff !important;
}
html[data-theme="light"] .bg-red-950 .text-red-300,
html[data-theme="light"] .bg-rose-950 .text-rose-300,
html[data-theme="light"] .bg-red-950.text-red-300,
html[data-theme="light"] .bg-rose-950.text-rose-300 {
  color: #ffffff !important;
}

/* Employee help text uses the same readable muted token across every workflow. */
.employee-app .text-gray-500,
.employee-app .text-gray-600 { color: var(--text-muted); }
.employee-app input::placeholder,
.employee-app textarea::placeholder { color: var(--text-muted); opacity: 1; }
.employee-app .skip-link {
  position: fixed;
  left: 1rem;
  top: 1rem;
  z-index: 300;
  padding: 0.75rem 1rem;
  background: var(--accent);
  color: #ffffff !important;
  border-radius: 0.5rem;
}
.employee-app .skip-link:not(:focus) {
  clip-path: inset(50%);
  width: 1px;
  height: 1px;
  overflow: hidden;
  padding: 0;
}
.employee-app .theme-photo-surface .text-gray-500,
.employee-app .theme-photo-surface .text-gray-600 { color: #9ca3af !important; }

html[data-theme="light"] .employee-app .text-orange-400 { color: #c2410c !important; }
html[data-theme="light"] .employee-app .hover\:text-orange-300:hover { color: #9a3412 !important; }
html[data-theme="light"] .employee-app .text-blue-300:not(.bg-blue-900):not(.bg-blue-950) { color: #1d4ed8 !important; }
html[data-theme="light"] .employee-app .text-indigo-300 { color: #4338ca !important; }
html[data-theme="light"] .employee-app .text-emerald-300:not(.bg-emerald-950):not(.bg-emerald-800) { color: #047857 !important; }
html[data-theme="light"] .employee-app .text-amber-300:not(.bg-amber-900):not(.bg-amber-950) { color: #92400e !important; }
html[data-theme="light"] .employee-app [class~="bg-blue-950/40"] { background-color: #eff6ff !important; }
html[data-theme="light"] .employee-app [class~="bg-emerald-950/40"] { background-color: #ecfdf5 !important; }
html[data-theme="light"] .employee-app [class~="bg-amber-950/40"] { background-color: #fffbeb !important; }

@media (max-width: 599px) {
  /* Keep typing at normal scale on iOS and make form fields easier to tap. */
  .employee-app input:not([type="checkbox"]):not([type="radio"]),
  .employee-app select,
  .employee-app textarea { font-size: 1rem; min-height: 2.75rem; }
}
