/* Final light-mode layer. Loaded after page/module styles so every surface
   uses the same daylight palette across public, account, player, and admin UI. */
html[data-theme="light"] {
  --light-bg: #f4f7fb;
  --light-surface: #ffffff;
  --light-surface-soft: #f8faff;
  --light-surface-muted: #edf2f8;
  --light-text: #172033;
  --light-text-muted: #586579;
  --light-text-dim: #7b8799;
  --light-line: #d9e1ec;
  --light-line-strong: #c2cedd;
  --light-green: #147a47;
  --light-green-soft: rgba(20, 122, 71, .1);
  --light-cyan: #087c95;
  --light-purple: #6941c6;
  --light-shadow: 0 14px 34px rgba(34, 52, 82, .1);
  --light-shadow-lg: 0 24px 70px rgba(34, 52, 82, .15);
  --od-surface: var(--light-surface);
  --od-input: var(--light-surface-soft);
  --od-overlay: rgba(23, 32, 51, .42);
  --od-text-on-accent: #ffffff;
}

html[data-theme="light"] body {
  color: var(--light-text);
  background:
    radial-gradient(ellipse 80% 45% at 72% -10%, rgba(105, 65, 198, .08), transparent 70%),
    var(--light-bg);
}
html[data-theme="light"] .jt-three-wrap { opacity: .1; }
html[data-theme="light"] .jt-theme-toggle,
html[data-theme="light"] .admin-command-trigger,
html[data-theme="light"] .admin-notification,
html[data-theme="light"] .admin-date,
html[data-theme="light"] .dashboard-date {
  border-color: var(--light-line);
}

/* Shared shell, navigation, and typography */
html[data-theme="light"] .jt-sidebar,
html[data-theme="light"] .admin-side {
  color: var(--light-text);
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(238,243,249,.98)) !important;
  border-color: var(--light-line);
  box-shadow: 10px 0 32px rgba(34,52,82,.07);
}
html[data-theme="light"] .jt-brand strong,
html[data-theme="light"] .jt-brand,
html[data-theme="light"] .admin-brand strong,
html[data-theme="light"] .admin-brand {
  color: var(--light-text);
}
html[data-theme="light"] .jt-side-nav a,
html[data-theme="light"] .admin-nav a,
html[data-theme="light"] .admin-side-foot a {
  color: var(--light-text-muted);
}
html[data-theme="light"] .jt-side-nav a:hover,
html[data-theme="light"] .admin-nav a:hover,
html[data-theme="light"] .admin-nav a.active {
  color: var(--light-green);
  background: var(--light-green-soft);
}
html[data-theme="light"] .jt-side-foot,
html[data-theme="light"] .admin-nav-icon,
html[data-theme="light"] .admin-topbar,
html[data-theme="light"] .admin-command-trigger kbd {
  border-color: var(--light-line);
}
html[data-theme="light"] .jt-site-header,
html[data-theme="light"] .admin-topbar {
  background: rgba(255,255,255,.88);
  border-color: var(--light-line);
  box-shadow: 0 10px 28px rgba(34,52,82,.07);
}
html[data-theme="light"] .jt-header-nav a,
html[data-theme="light"] .jt-header-nav a:hover,
html[data-theme="light"] .jt-header-nav a.active,
html[data-theme="light"] .jt-search-bar,
html[data-theme="light"] .jt-mobile-menu,
html[data-theme="light"] .jt-user-card {
  color: var(--light-text-muted);
  background: var(--light-surface-soft);
  border-color: var(--light-line);
}
html[data-theme="light"] .jt-header-nav a.active,
html[data-theme="light"] .jt-header-nav a:hover {
  color: var(--light-green);
}
html[data-theme="light"] .jt-site-footer {
  background: rgba(255,255,255,.78);
  border-color: var(--light-line);
}
html[data-theme="light"] .admin-main,
html[data-theme="light"] .admin-breadcrumb strong,
html[data-theme="light"] .admin-main h1,
html[data-theme="light"] .admin-main h2,
html[data-theme="light"] .admin-main h3 {
  color: var(--light-text);
}
html[data-theme="light"] .admin-breadcrumb,
html[data-theme="light"] .admin-nav-group,
html[data-theme="light"] .admin-system-status {
  color: var(--light-text-dim);
}

/* Public discovery, home, music, playlists, plans, and shared cards */
html[data-theme="light"] .home-search,
html[data-theme="light"] .home-floating-card,
html[data-theme="light"] .home-now-playing,
html[data-theme="light"] .home-cards .media-card-wrap,
html[data-theme="light"] .page-tabs,
html[data-theme="light"] .search-discovery,
html[data-theme="light"] .search-panel,
html[data-theme="light"] .media-card,
html[data-theme="light"] .track-table-wrap,
html[data-theme="light"] .empty,
html[data-theme="light"] .track-hero,
html[data-theme="light"] .track-meta-item,
html[data-theme="light"] .track-hero__player,
html[data-theme="light"] .track-dl-panel,
html[data-theme="light"] .track-info-shell,
html[data-theme="light"] .track-panel,
html[data-theme="light"] .track-related-card,
html[data-theme="light"] .community-song-panel,
html[data-theme="light"] .pl-hero,
html[data-theme="light"] .pl-hero__stat,
html[data-theme="light"] .pl-card,
html[data-theme="light"] .pl-featured,
html[data-theme="light"] .pl-detail-hero,
html[data-theme="light"] .plans-faq,
html[data-theme="light"] .plans-trust span {
  color: var(--light-text);
  background: var(--light-surface) !important;
  border-color: var(--light-line);
  box-shadow: var(--light-shadow);
}
html[data-theme="light"] .home-hero,
html[data-theme="light"] .track-hero__top {
  background:
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(235,241,248,.9)),
    var(--light-surface) !important;
  border-color: var(--light-line);
  box-shadow: var(--light-shadow-lg);
}
html[data-theme="light"] .home-search,
html[data-theme="light"] .home-floating-card,
html[data-theme="light"] .home-now-playing,
html[data-theme="light"] .track-meta-item,
html[data-theme="light"] .track-hero__player,
html[data-theme="light"] .track-info-shell,
html[data-theme="light"] .pl-hero__stat {
  background: var(--light-surface-soft) !important;
}
html[data-theme="light"] .home-search,
html[data-theme="light"] .home-quick-links a,
html[data-theme="light"] .pl-card,
html[data-theme="light"] .pl-featured,
html[data-theme="light"] .pl-detail-hero {
  border-color: var(--light-line);
}
html[data-theme="light"] .home-search:focus-within,
html[data-theme="light"] .track-row-wrap:hover,
html[data-theme="light"] .media-card:hover,
html[data-theme="light"] .pl-card:hover {
  border-color: rgba(20,122,71,.42);
  background: #f1faf5 !important;
}
html[data-theme="light"] .home-quick-links a,
html[data-theme="light"] .pl-btn--ghost {
  color: var(--light-text-muted);
  background: var(--light-surface-soft);
  border-color: var(--light-line);
}
html[data-theme="light"] .home-genre-card__content small,
html[data-theme="light"] .home-seo-intro__facts span {
  color: var(--light-text-muted);
  background: var(--light-surface-muted);
}
html[data-theme="light"] .pl-chip {
  color: var(--light-purple);
  background: rgba(105,65,198,.1);
}
html[data-theme="light"] .plans-alert {
  color: #12633f;
  background: #e8f7ef;
  border-color: #a8ddbf;
}
html[data-theme="light"] .plan-card {
  background: linear-gradient(150deg, #fff, #f4f7fb) !important;
}
html[data-theme="light"] .plan-card.is-featured {
  background:
    radial-gradient(circle at 90% 0, rgba(105,65,198,.1), transparent 38%),
    linear-gradient(150deg, #fff, #f4f7fb) !important;
}

/* Inputs, tables, alerts, and buttons */
html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea,
html[data-theme="light"] .field input,
html[data-theme="light"] .field select,
html[data-theme="light"] .field textarea {
  color: var(--light-text);
  background: var(--light-surface-soft);
  border-color: var(--light-line-strong);
}
html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder {
  color: var(--light-text-dim);
}
html[data-theme="light"] input:focus,
html[data-theme="light"] select:focus,
html[data-theme="light"] textarea:focus {
  border-color: var(--light-cyan);
  box-shadow: 0 0 0 4px rgba(8,124,149,.12);
}
html[data-theme="light"] table,
html[data-theme="light"] .table-wrap,
html[data-theme="light"] .admin-table-wrap,
html[data-theme="light"] .track-table-wrap,
html[data-theme="light"] .media-table-wrap,
html[data-theme="light"] .monitor-table {
  color: var(--light-text);
  background: var(--light-surface);
  border-color: var(--light-line);
}
html[data-theme="light"] th {
  color: var(--light-text-muted);
  background: var(--light-surface-muted);
}
html[data-theme="light"] td,
html[data-theme="light"] th,
html[data-theme="light"] tr {
  border-color: var(--light-line);
}
html[data-theme="light"] tr:hover td {
  background: rgba(105,65,198,.045);
}
html[data-theme="light"] .btn,
html[data-theme="light"] button[class*="btn-"] {
  border-color: var(--light-line-strong);
}
html[data-theme="light"] .btn-download,
html[data-theme="light"] .home-search button,
html[data-theme="light"] .plan-cta,
html[data-theme="light"] .pl-btn--primary {
  color: #ffffff;
}
html[data-theme="light"] .track-alert,
html[data-theme="light"] .ai-alert,
html[data-theme="light"] .social-alert {
  color: var(--light-text);
  background: #fff8e8;
  border-color: #ead49a;
}
html[data-theme="light"] .badge-muted {
  color: var(--light-text-muted);
  background: var(--light-surface-muted);
}

/* Global player, queue, and full-screen Now Playing */
html[data-theme="light"] .jt-player-bar,
html[data-theme="light"] .jt-queue-panel,
html[data-theme="light"] .bottom-nav {
  color: var(--light-text);
  background: rgba(255,255,255,.94) !important;
  border-color: var(--light-line);
  box-shadow: 0 16px 42px rgba(34,52,82,.14);
}
html[data-theme="light"] .jt-ctrl,
html[data-theme="light"] .jt-player-action,
html[data-theme="light"] .jt-queue-toggle,
html[data-theme="light"] .jt-now-control,
html[data-theme="light"] .jt-now-action,
html[data-theme="light"] .jt-now-tool {
  color: var(--light-text-muted);
  background: var(--light-surface-soft);
  border-color: var(--light-line);
}
html[data-theme="light"] .jt-now-playing {
  color: var(--light-text);
  background:
    radial-gradient(circle at 50% 12%, rgba(105,65,198,.14), transparent 48%),
    linear-gradient(145deg, #f7f9fd, #eaf1f7 58%, #f4f7fb) !important;
}
html[data-theme="light"] .jt-now-playing__head,
html[data-theme="light"] .jt-now-playing__body {
  background: rgba(255,255,255,.86);
  border-color: var(--light-line);
  box-shadow: var(--light-shadow);
}
html[data-theme="light"] .jt-now-playing__close,
html[data-theme="light"] .jt-now-playing__more {
  color: var(--light-text-muted);
  background: var(--light-surface-soft);
  border-color: var(--light-line);
}
html[data-theme="light"] .jt-now-control--play {
  color: #102018;
  background: #ffffff;
  border-color: #ffffff;
  box-shadow: 0 14px 32px rgba(34,52,82,.18), 0 10px 26px var(--od-accent-glow);
}
html[data-theme="light"] .jt-progress-ring__track {
  stroke: rgba(23,32,51,.14);
}
html[data-theme="light"] .jt-progress-track {
  background: rgba(23,32,51,.12);
}
html[data-theme="light"] .jt-now-playing__tools:not(.jt-now-playing__tools--speed) {
  border-color: var(--light-line);
}

/* PWA install prompt */
html[data-theme="light"] .pwa-install__surface {
  color: var(--light-text);
  background: linear-gradient(135deg, #ffffff, #edf4fa) !important;
  border-color: #b8dbe3;
  box-shadow: var(--light-shadow-lg);
}
html[data-theme="light"] .pwa-install__close,
html[data-theme="light"] .pwa-install__later {
  color: var(--light-text-muted);
  background: var(--light-surface-soft);
  border-color: var(--light-line);
}
html[data-theme="light"] .pwa-install__head small,
html[data-theme="light"] .pwa-install__text {
  color: var(--light-text-muted);
}
html[data-theme="light"] .pwa-install__ios {
  color: #075d70;
  background: #e5f6fa;
}

/* Admin feature modules: keep dark module declarations from leaking into light mode. */
html[data-theme="light"] .admin-main .card,
html[data-theme="light"] .admin-main .stat,
html[data-theme="light"] .admin-toolbar,
html[data-theme="light"] .admin-card,
html[data-theme="light"] .drive-card,
html[data-theme="light"] .drive-summary article,
html[data-theme="light"] .drive-account,
html[data-theme="light"] .drive-file,
html[data-theme="light"] .media-card,
html[data-theme="light"] .media-upload-card,
html[data-theme="light"] .media-policy-card,
html[data-theme="light"] .media-report,
html[data-theme="light"] .ai-card,
html[data-theme="light"] .ai-conversations,
html[data-theme="light"] .social-card,
html[data-theme="light"] .seo-chart,
html[data-theme="light"] .seo-rank-list,
html[data-theme="light"] .seo-bot-table,
html[data-theme="light"] .songs-loading,
html[data-theme="light"] .monitor-health,
html[data-theme="light"] .monitor-table,
html[data-theme="light"] .settings-check {
  color: var(--light-text);
  background: var(--light-surface) !important;
  border-color: var(--light-line);
  box-shadow: var(--light-shadow);
}
html[data-theme="light"] .drive-form label,
html[data-theme="light"] .drive-oauth-grid label,
html[data-theme="light"] .drive-browser-select label,
html[data-theme="light"] .drive-account-copy small,
html[data-theme="light"] .drive-media-stats b,
html[data-theme="light"] .media-report h3,
html[data-theme="light"] .media-report p b,
html[data-theme="light"] .employee-copy strong,
html[data-theme="light"] .employee-copy small,
html[data-theme="light"] .admin-main label {
  color: var(--light-text-muted);
}
html[data-theme="light"] .social-pattern-list pre {
  color: #26344b;
  background: #eef3f8;
  border-color: var(--light-line);
}
html[data-theme="light"] .social-template-preview {
  color: var(--light-text);
  background: var(--light-surface-soft);
  border-color: var(--light-line);
}
html[data-theme="light"] .admin-main .ai-alert.is-success,
html[data-theme="light"] .admin-main .alert-success {
  color: #11613d;
  background: #e8f7ef;
  border-color: #a8ddbf;
}
html[data-theme="light"] .admin-main .ai-alert.is-error,
html[data-theme="light"] .admin-main .alert-error,
html[data-theme="light"] .admin-main .alert-danger {
  color: #a12b35;
  background: #fff0f1;
  border-color: #efb8bd;
}
html[data-theme="light"] .monitor-status.is-ok {
  color: #11613d;
  background: #e8f7ef;
}
html[data-theme="light"] .monitor-status.is-error,
html[data-theme="light"] .monitor-status.is-down {
  color: #a12b35;
  background: #fff0f1;
}

@media (max-width: 640px) {
  html[data-theme="light"] .jt-now-playing__head,
  html[data-theme="light"] .jt-now-playing__body {
    box-shadow: 0 10px 26px rgba(34,52,82,.1);
  }
}
