/* User-selectable color themes. Loaded last so it wins over legacy layers. */

html[data-theme="dark"] { color-scheme: dark; }
html[data-theme="light"] { color-scheme: light; }

.jt-theme-toggle {
  display: inline-flex;
  min-width: 42px;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 8px 11px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 12px;
  color: var(--od-text-muted);
  background: var(--od-surface-soft);
  cursor: pointer;
  transition: color var(--motion-fast), border-color var(--motion-fast), background var(--motion-fast), transform var(--motion-fast);
}
.jt-theme-toggle:hover,
.jt-theme-toggle:focus-visible {
  color: var(--od-text);
  border-color: var(--tu-cyan);
  background: var(--tu-cyan-soft);
  transform: translateY(-1px);
}
.jt-theme-icon { width: 18px; height: 18px; flex: 0 0 auto; }
.jt-theme-icon--moon { display: none; }
.jt-theme-toggle__label { font-size: 11px; font-weight: 700; }
html[data-theme="light"] .jt-theme-icon--sun { display: none; }
html[data-theme="light"] .jt-theme-icon--moon { display: block; }
html[data-theme="light"] .jt-theme-toggle__label::after { content: "تیره"; }
html[data-theme="light"] .jt-theme-toggle__label { font-size: 0; }
html[data-theme="light"] .jt-theme-toggle__label::after { font-size: 11px; }
.admin-theme-toggle {
  width: 100%;
  justify-content: flex-start;
  margin: 0 0 14px;
}
.admin-login-theme {
  position: absolute;
  top: 16px;
  left: 16px;
}

html[data-theme="light"] body {
  background:
    radial-gradient(ellipse 80% 45% at 72% -10%, rgba(118,81,215,.12), transparent 70%),
    var(--od-bg-base);
}
html[data-theme="light"] .jt-three-wrap { opacity: .18; }
html[data-theme="light"] .admin-body {
  background:
    radial-gradient(ellipse 70% 45% at 100% 0%, rgba(118,81,215,.12), transparent 62%),
    var(--od-bg-base);
  color: var(--od-text);
}
html[data-theme="light"] .admin-side {
  background: rgba(255,255,255,.86);
  border-left-color: var(--glass-border);
}
html[data-theme="light"] .admin-main .card,
html[data-theme="light"] .admin-table-wrap,
html[data-theme="light"] .admin-main .table-wrap,
html[data-theme="light"] .admin-main .stat,
html[data-theme="light"] .admin-toolbar {
  color: var(--od-text);
  background: var(--od-surface-glass);
  border-color: var(--glass-border);
  box-shadow: var(--od-shadow-card);
}
html[data-theme="light"] .admin-main td { color: var(--od-text-muted); }
html[data-theme="light"] .admin-main tr:hover td { background: rgba(118,81,215,.07); }
html[data-theme="light"] .drive-summary article,
html[data-theme="light"] .drive-card,
html[data-theme="light"] .media-card {
  color: var(--od-text);
  background: var(--od-surface-glass);
  border-color: var(--glass-border);
  box-shadow: var(--od-shadow-card);
}
html[data-theme="light"] .drive-summary strong,
html[data-theme="light"] .drive-card h2,
html[data-theme="light"] .media-card h2,
html[data-theme="light"] .drive-account-copy strong,
html[data-theme="light"] .media-table-wrap td {
  color: var(--od-text);
}
html[data-theme="light"] .drive-form input,
html[data-theme="light"] .drive-form select,
html[data-theme="light"] .media-upload-card input,
html[data-theme="light"] .media-upload-card select,
html[data-theme="light"] .drive-oauth-grid input {
  color: var(--od-text);
  background: rgba(25,35,58,.045);
  border-color: var(--glass-border);
}
html[data-theme="light"] .drive-account {
  background: rgba(25,35,58,.045);
  border-color: var(--glass-border);
}
html[data-theme="light"] .drive-browser-select select,
html[data-theme="light"] .drive-file {
  color: var(--od-text);
  background: rgba(25,35,58,.045);
  border-color: var(--glass-border);
}
html[data-theme="light"] .drive-file strong,
html[data-theme="light"] .drive-browser-select label {
  color: var(--od-text);
}
html[data-theme="light"] .admin-brand { color: var(--od-text); }
html[data-theme="light"] .admin-mobile-nav { background: rgba(255,255,255,.9); border-color: var(--glass-border); box-shadow: 0 18px 45px rgba(31,42,68,.16); }
html[data-theme="light"] .admin-command-backdrop { background: rgba(31,42,68,.28); }
html[data-theme="light"] .admin-command-dialog { border-color: var(--glass-border); box-shadow: 0 30px 90px rgba(31,42,68,.22); }
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(--glass-border); }
html[data-theme="light"] .jt-sidebar {
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(244,246,251,.96));
  border-left-color: var(--glass-border);
  box-shadow: 8px 0 28px rgba(31,42,68,.05);
}
html[data-theme="light"] .jt-site-header {
  background: rgba(255,255,255,.78);
  border-bottom-color: var(--glass-border);
  box-shadow: 0 10px 28px rgba(31,42,68,.08);
}
html[data-theme="light"] .jt-search-bar,
html[data-theme="light"] .jt-mobile-menu,
html[data-theme="light"] .jt-header-nav a:hover,
html[data-theme="light"] .jt-header-nav a.active {
  background: rgba(25,35,58,.05);
}
html[data-theme="light"] .jt-side-nav a.active {
  background: linear-gradient(90deg, rgba(21,148,71,.12), rgba(21,148,71,.02));
}
html[data-theme="light"] .jt-site-footer {
  background: rgba(255,255,255,.65);
  border-top-color: var(--glass-border);
}

html[data-theme="light"] .glass-panel,
html[data-theme="light"] .card,
html[data-theme="light"] .search-panel,
html[data-theme="light"] .search-discovery,
html[data-theme="light"] .track-table-wrap,
html[data-theme="light"] .empty,
html[data-theme="light"] .profile-card,
html[data-theme="light"] .profile-stats,
html[data-theme="light"] .library-stat-card,
html[data-theme="light"] .media-card,
html[data-theme="light"] .home-hero,
html[data-theme="light"] .home-section,
html[data-theme="light"] .track-hero__top,
html[data-theme="light"] .track-panel,
html[data-theme="light"] .track-related-card,
html[data-theme="light"] .track-about,
html[data-theme="light"] .download-quality-row,
html[data-theme="light"] .song-description {
  background-color: var(--od-surface-glass);
  border-color: var(--glass-border);
  box-shadow: var(--od-shadow-card);
}
html[data-theme="light"] .home-hero,
html[data-theme="light"] .track-hero__top {
  background-image: linear-gradient(135deg, rgba(255,255,255,.88), rgba(238,241,247,.78));
}
html[data-theme="light"] .home-hero h1,
html[data-theme="light"] .track-hero h1,
html[data-theme="light"] .page-head h1 {
  color: var(--od-text);
}
html[data-theme="light"] .field input,
html[data-theme="light"] .field select,
html[data-theme="light"] .field textarea,
html[data-theme="light"] .track-row-wrap,
html[data-theme="light"] .track-related-card__play,
html[data-theme="light"] .track-hero-ghost {
  color: var(--od-text);
  background: rgba(25,35,58,.045);
  border-color: var(--glass-border);
}
html[data-theme="light"] .track-row-wrap:hover,
html[data-theme="light"] .media-card:hover {
  background: rgba(118,81,215,.08);
}
html[data-theme="light"] .jt-player-bar,
html[data-theme="light"] .jt-queue-panel,
html[data-theme="light"] .bottom-nav {
  color: var(--od-text);
  background: rgba(255,255,255,.86);
  border-color: var(--glass-border);
  box-shadow: 0 -10px 32px rgba(31,42,68,.13);
}
html[data-theme="light"] .jt-player-meta span,
html[data-theme="light"] .jt-queue-item__text > span,
html[data-theme="light"] .bottom-nav a {
  color: var(--od-text-muted);
}
html[data-theme="light"] .jt-queue-item:hover,
html[data-theme="light"] .jt-queue-item.is-current {
  background: rgba(21,148,71,.09);
}
html[data-theme="light"] .track-cover-halo { opacity: .2; }

/* The detail page's parent mosaic is always a two-column row. */
html body .track-info-grid {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  gap: 8px !important;
}
html body .track-info-grid > .track-panel {
  flex: 1 1 0 !important;
  width: 50% !important;
  min-width: 0 !important;
}

@media (max-width: 600px) {
  .jt-theme-toggle { padding-inline: 10px; }
  .jt-theme-toggle__label { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .jt-theme-toggle { transition: none; }
}
