/* FIX06: the existing styles are the dark theme. Only light is overridden. */
html[data-theme="light"] {
  color-scheme: light;
  --bg: #faf7f2;
  --bg-soft: #f5efe7;
  --panel: #ffffff;
  --panel-2: #f5efe7;
  --panel2: #f5efe7;
  --text: #302a27;
  --muted: #6f6259;
  --red: #b43b29;
  --red-dark: #962d21;
  --red2: #bd4829;
  --orange: #bd4829;
  --gold: #855b19;
  --gold-soft: #855b19;
  --line: #e5dbce;
  --success: #246b40;
  --green: #246b40;
  --ok: #246b40;
  --warning: #825710;
  --warn: #825710;
  --danger: #a4312a;
  --shadow: 0 18px 55px rgba(71, 46, 24, .13);
}

html[data-theme="light"] body {
  background: radial-gradient(ellipse at 50% 0, #f7e8d4 0, transparent 580px), var(--bg);
  color: var(--text);
}
html[data-theme="light"] .site-header,
html[data-theme="light"] .admin-top {
  background: rgba(255, 252, 248, .96);
  box-shadow: 0 3px 18px rgba(71, 46, 24, .04);
}
html[data-theme="light"] .main-nav a:hover,
html[data-theme="light"] .main-nav a.active,
html[data-theme="light"] .admin-sidebar button:hover,
html[data-theme="light"] .admin-sidebar button.active,
html[data-theme="light"] .sunmi-nav button.active {
  background: #f5e5d9;
  color: #943420;
}
html[data-theme="light"] .desktop-live-status,
html[data-theme="light"] .hero-tagline,
html[data-theme="light"] .contact-band p,
html[data-theme="light"] .full-description,
html[data-theme="light"] .legend-line,
html[data-theme="light"] .inline-message,
html[data-theme="light"] .address-grid label,
html[data-theme="light"] .checkout-form label,
html[data-theme="light"] .upsell-name,
html[data-theme="light"] .upsell-price,
html[data-theme="light"] .site-footer strong,
html[data-theme="light"] .cart-head button {
  color: var(--text);
}
html[data-theme="light"] .hero-glow {
  background: radial-gradient(circle, rgba(215, 148, 67, .16), rgba(217, 96, 62, .05) 42%, transparent 68%);
}
html[data-theme="light"] .hero-logo { filter: drop-shadow(0 16px 26px rgba(86, 43, 15, .17)); }
html[data-theme="light"] .status-card,
html[data-theme="light"] .category-cards a,
html[data-theme="light"] .product-card {
  background: linear-gradient(150deg, #fff, #fffcf7);
  border-color: var(--line);
  box-shadow: 0 5px 18px rgba(71, 46, 24, .045);
}
html[data-theme="light"] .product-card.clickable:hover,
html[data-theme="light"] .category-cards a:hover {
  background: #fffaf2;
  border-color: #cda77b;
  box-shadow: 0 7px 22px rgba(71, 46, 24, .09);
}
html[data-theme="light"] .contact-band { background: linear-gradient(110deg, #f6e6d4, #fcf2e0); }
html[data-theme="light"] .sticky-tools {
  background: linear-gradient(135deg, #f8e8da, #fcf4e9);
  border-color: #e3c9b1;
  box-shadow: 0 8px 23px rgba(71, 46, 24, .075);
}
html[data-theme="light"] .status-popover,
html[data-theme="light"] .modal-panel,
html[data-theme="light"] .delivery-precheck,
html[data-theme="light"] .cart-panel,
html[data-theme="light"] .contact-card,
html[data-theme="light"] .map-frame,
html[data-theme="light"] .status-order-card,
html[data-theme="light"] .login-card,
html[data-theme="light"] .admin-modal-panel,
html[data-theme="light"] .admin-confirm-panel,
html[data-theme="light"] .admin-toast,
html[data-theme="light"] .sunmi-modal-panel,
html[data-theme="light"] .sunmi-confirm-panel,
html[data-theme="light"] .sunmi-toast {
  background: var(--panel);
  color: var(--text);
  border-color: var(--line);
  box-shadow: var(--shadow);
}
html[data-theme="light"] .order-mode-bar,
html[data-theme="light"] body[data-page="order"] .order-mode-bar,
html[data-theme="light"] .legend-pop,
html[data-theme="light"] .review-card,
html[data-theme="light"] .estimate-box,
html[data-theme="light"] .payment-box,
html[data-theme="light"] .upsell-quick-config,
html[data-theme="light"] .admin-sidebar,
html[data-theme="light"] .admin-toggle,
html[data-theme="light"] .admin-order,
html[data-theme="light"] .sunmi-address,
html[data-theme="light"] .sunmi-item,
html[data-theme="light"] .sunmi-payment {
  background: var(--bg-soft);
  color: var(--text);
}
html[data-theme="light"] .sunmi-header,
html[data-theme="light"] .sunmi-nav { background: #fffcf8; }
html[data-theme="light"] .sunmi-new-banner { color: #fff; box-shadow: 0 5px 16px rgba(136, 53, 31, .15); }
html[data-theme="light"] .btn-primary,
html[data-theme="light"] .mobile-cart-button { box-shadow: 0 8px 20px rgba(163, 61, 34, .18); }
html[data-theme="light"] .btn-secondary,
html[data-theme="light"] .product-select,
html[data-theme="light"] .mobile-order-status,
html[data-theme="light"] .upsell-add,
html[data-theme="light"] .admin-btn.gold,
html[data-theme="light"] .sunmi-btn.gold {
  background: #f7e7c8;
  border-color: #dec59b;
  color: #634414;
}
html[data-theme="light"] .btn-secondary:hover,
html[data-theme="light"] .product-select:hover,
html[data-theme="light"] .upsell-add:hover { background: #f1dab3; border-color: #caa76d; }
html[data-theme="light"] .category-chip,
html[data-theme="light"] .choice,
html[data-theme="light"] .variant-btn,
html[data-theme="light"] .mode-btn,
html[data-theme="light"] .qty-btn,
html[data-theme="light"] .cart-edit,
html[data-theme="light"] .cart-remove,
html[data-theme="light"] .modal-close,
html[data-theme="light"] .nav-toggle,
html[data-theme="light"] .upsell-item,
html[data-theme="light"] .upsell-choice-list label,
html[data-theme="light"] .admin-btn.secondary,
html[data-theme="light"] .admin-modal-x,
html[data-theme="light"] .sunmi-btn.secondary,
html[data-theme="light"] .sunmi-modal-panel > [data-sunmi-modal-close] {
  background: #f8f3ec;
  border-color: var(--line);
  color: var(--text);
}
html[data-theme="light"] .category-chip.active,
html[data-theme="light"] .category-chip:hover,
html[data-theme="light"] .variant-btn.active {
  background: #f9e7db;
  border-color: #bd6b4e;
  color: #8f321f;
}
html[data-theme="light"] .mode-btn.active { background: linear-gradient(135deg, var(--red-dark), var(--red)); color: #fff; }
html[data-theme="light"] .upsell-item:hover { background: #f5eadc; border-color: #d3b38b; }
html[data-theme="light"] .nav-toggle span { background: var(--text); }
html[data-theme="light"] .search-field input,
html[data-theme="light"] .special-request,
html[data-theme="light"] .address-grid input,
html[data-theme="light"] .checkout-form input,
html[data-theme="light"] .checkout-form select,
html[data-theme="light"] .checkout-form textarea,
html[data-theme="light"] .login-card input,
html[data-theme="light"] .admin-field input,
html[data-theme="light"] .admin-field select,
html[data-theme="light"] .admin-field textarea,
html[data-theme="light"] .admin-search,
html[data-theme="light"] .sunmi-field input,
html[data-theme="light"] .sunmi-field select,
html[data-theme="light"] .sunmi-field textarea {
  background: #fff;
  color: var(--text);
  border-color: #c6b8a8;
}
html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder { color: #796b5f; opacity: 1; }
html[data-theme="light"] button:focus,
html[data-theme="light"] a:focus,
html[data-theme="light"] input:focus,
html[data-theme="light"] select:focus,
html[data-theme="light"] textarea:focus { outline: 2px solid #a55032; outline-offset: 2px; }
html[data-theme="light"] .suggestions { background: #fff; }
html[data-theme="light"] .suggestion { color: var(--text); }
html[data-theme="light"] .suggestion:hover { background: #f8eddf; }
html[data-theme="light"] .tag,
html[data-theme="light"] .status-badge { background: #f2ece3; color: #665b50; border-color: #d8ccbc; }
html[data-theme="light"] .tag.green,
html[data-theme="light"] .status-badge.paid,
html[data-theme="light"] .sunmi-payment.paid,
html[data-theme="light"] .sunmi-toast.success { background: #e6f2e7; color: #24613b; border-color: #afd0b6; }
html[data-theme="light"] .status-card .status-line.open,
html[data-theme="light"] .admin-pill.open { color: #246b40; border-color: #9bbea4; }
html[data-theme="light"] .notice-normal { background: #eee7de; color: #51453c; }
html[data-theme="light"] .notice-important,
html[data-theme="light"] .status-warning,
html[data-theme="light"] .warning-box,
html[data-theme="light"] .legal-warning,
html[data-theme="light"] .status-badge.open,
html[data-theme="light"] .sunmi-payment.open,
html[data-theme="light"] .sunmi-warning,
html[data-theme="light"] .test-ribbon,
html[data-theme="light"] .upsell-feedback { background: #fff0d5; color: #704b10; border-color: #e3c18b; }
html[data-theme="light"] .notice-urgent,
html[data-theme="light"] .danger-box,
html[data-theme="light"] .admin-error,
html[data-theme="light"] .status-badge.fail,
html[data-theme="light"] .sunmi-payment.fail,
html[data-theme="light"] .sunmi-danger,
html[data-theme="light"] .sunmi-toast.error,
html[data-theme="light"] .upsell-feedback.error { background: #fbe7e2; color: #973328; border-color: #dda59a; }
html[data-theme="light"] .tag.hot { background: #fbe7e2; color: #973328; border-color: #dda59a; }
html[data-theme="light"] .discount-label,
html[data-theme="light"] .sold-out-label,
html[data-theme="light"] .payment-countdown.urgent { color: #a13b29; }
html[data-theme="light"] .old-price,
html[data-theme="light"] .site-footer,
html[data-theme="light"] .admin-sidebar button,
html[data-theme="light"] .admin-logout,
html[data-theme="light"] .admin-table th,
html[data-theme="light"] .admin-pill.closed,
html[data-theme="light"] .status-card .status-line.closed,
html[data-theme="light"] .sunmi-nav button,
html[data-theme="light"] .sunmi-item ul { color: var(--muted); }
html[data-theme="light"] .sunmi-nav button.active,
html[data-theme="light"] .admin-sidebar button.active,
html[data-theme="light"] .admin-sidebar button:hover { color: #943420; }
html[data-theme="light"] .cart-summary p,
html[data-theme="light"] .admin-pill.test,
html[data-theme="light"] .sunmi-item .note { color: #805819; }
html[data-theme="light"] .progress-step { border-color: #d8cfc4; color: var(--muted); }
html[data-theme="light"] .progress-step.done { border-color: #a67835; color: #805819; }
html[data-theme="light"] .progress-step.current { border-color: var(--red); color: var(--red-dark); }
html[data-theme="light"] .sunmi-report { border-color: var(--line); }
html[data-theme="light"] .modal-backdrop,
html[data-theme="light"] .ui-dialog-backdrop,
html[data-theme="light"] .admin-modal-backdrop,
html[data-theme="light"] .admin-confirm,
html[data-theme="light"] .sunmi-modal,
html[data-theme="light"] .sunmi-confirm { background: rgba(45, 33, 23, .42); }

@media (max-width: 760px) {
  html[data-theme="light"] .main-nav { background: #fffcf8; }
}

/* These new controls are visible in both themes; existing dark styles stay intact. */
.appearance-options { display: flex; flex-wrap: wrap; gap: 12px; margin: 16px 0 12px; }
.appearance-option {
  display: flex; align-items: center; flex: 1 1 230px; gap: 14px;
  min-width: 0; padding: 15px; border: 2px solid var(--line); border-radius: 13px;
  background: transparent; color: var(--text); text-align: left; font: inherit; cursor: pointer;
}
.appearance-option[aria-pressed="true"] { border-color: var(--gold); }
.appearance-option:disabled { opacity: .65; cursor: wait; }
.appearance-option strong { display: block; font-size: 1rem; margin-bottom: 4px; }
.appearance-option small { display: block; color: var(--muted); line-height: 1.45; }
.appearance-sample { flex: 0 0 54px; width: 54px; height: 60px; border-radius: 9px; border: 1px solid #d8c5b0; padding: 10px 7px; }
.appearance-sample::before,.appearance-sample::after { content: ""; display: block; height: 8px; border-radius: 3px; }
.appearance-sample::after { height: 16px; margin-top: 7px; }
.appearance-sample-light { background: #faf7f2; }
.appearance-sample-light::before { background: #b43b29; }
.appearance-sample-light::after { background: #e7d9c7; }
.appearance-sample-dark { background: #101014; border-color: #665746; }
.appearance-sample-dark::before { background: #e2431f; }
.appearance-sample-dark::after { background: #383138; }
.appearance-current { margin: 0; color: var(--muted); font-size: .84rem; }
