/* ================================================================
   On-Music — Modo escuro: ajustes das cores que NÃO passam pelos tokens
   (#fff, tons pastel e textos escuros escritos direto nos CSS).
   Gerado a partir dos CSS existentes — carregar DEPOIS de todos eles.
   Os tokens em si (--color-white, --white, --color-dark…) ficam em
   /shared/design-system.css, em :root[data-theme="dark"].
   ================================================================ */

/* Escala de cinzas do dashboard, invertida (50 = mais escuro) */
:root[data-theme="dark"] {
    --gray-50:  #121735;
    --gray-100: #171d40;
    --gray-200: #232a55;
    --gray-300: #323a6b;
    --gray-400: #7b84a6;
    --gray-500: #98a1c0;
    --gray-600: #b3bad3;
    --gray-700: #cbd1e6;
    --gray-800: #e1e5f2;
    --gray-900: #f1f3fa;
}


/* Campos de formulário: sem fundo próprio nos CSS, o navegador pintaria
   cinza. Usam o fundo da página (um tom abaixo do card) e placeholder legível. */
:root[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
:root[data-theme="dark"] select,
:root[data-theme="dark"] textarea {
    background-color: var(--color-white);
    color: var(--color-text);
    border-color: var(--color-border-strong);
}
:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder {
    color: var(--color-dark-secondary);
    opacity: 0.7;
}


/* shared/design-system.css */
:root[data-theme="dark"] a:hover {
    color: var(--color-primary-light);
}
:root[data-theme="dark"] .btn-icon-background {
    color: #fff;
}
:root[data-theme="dark"] .toggle {
    background-color: var(--white);
}
:root[data-theme="dark"] .card {
    background: var(--white);
}
:root[data-theme="dark"] .badge-primary {
    color: var(--color-primary-light);
}
:root[data-theme="dark"] .box {
    background: var(--white);
}
/* landing.css */
:root[data-theme="dark"] .lp-skip {
    color: #fff;
}
:root[data-theme="dark"] .lp-skip:focus {
    color: #fff;
}
:root[data-theme="dark"] .lp-badge {
    color: var(--color-primary-light);
}
:root[data-theme="dark"] .lp-week .is-done {
    color: #fff;
}
:root[data-theme="dark"] .lp .lp-section__title--on-dark {
    color: #fff;
}
:root[data-theme="dark"] .lp-step__num {
    color: var(--color-primary-light);
}
:root[data-theme="dark"] .lp-note-dot.is-on {
    color: #fff;
}
:root[data-theme="dark"] .lp-slide:first-child h3 {
    color: #fff;
}
:root[data-theme="dark"] .lp-slide__tag {
    color: var(--color-primary-light);
}
:root[data-theme="dark"] .lp-slide__source a {
    color: var(--color-primary-light);
}
:root[data-theme="dark"] .lp-carousel__arrow:hover:not(:disabled) {
    color: var(--color-primary-light);
}
:root[data-theme="dark"] .lp-feature--main h3 {
    color: #fff;
}
:root[data-theme="dark"] .lp-plan__name {
    color: var(--color-primary-light);
}
:root[data-theme="dark"] .lp-plan__phase {
    color: var(--color-primary-light);
}
:root[data-theme="dark"] .lp-footer__links h3 {
    color: #fff;
}
/* dashboard/dashboard.css */
:root[data-theme="dark"] .user-avatar {
    color: #fff;
}
:root[data-theme="dark"] .status--active {
    background: rgba(16, 185, 129, 0.14);
    color: #86efac;
}
:root[data-theme="dark"] .status--pending {
    background: rgba(245, 158, 11, 0.14);
    color: #fcd34d;
}
:root[data-theme="dark"] .status--overdue {
    background: rgba(239, 68, 68, 0.14);
    color: #fca5a5;
}
/* dashboard/sections/treino.css */
:root[data-theme="dark"] .cfg-pill.active {
    color: var(--color-primary-light);
}
:root[data-theme="dark"] .cfg-static-tag {
    color: var(--color-primary-light);
}
:root[data-theme="dark"] .trn-imagem-fechar {
    color: #fff;
}
/* dashboard/sections/aulas.css */
:root[data-theme="dark"] .prof-card-avatar {
    background: linear-gradient(135deg, rgba(0, 146, 146, 0.16) 0%, rgba(0, 146, 146, 0.16) 100%);
}
:root[data-theme="dark"] .prof-badge--dur {
    background: rgba(59, 130, 246, 0.14);
    color: #93c5fd;
}
:root[data-theme="dark"] .avail-slot-btn {
    background: var(--white);
}
:root[data-theme="dark"] .avail-slot-btn:hover {
    background: rgba(0, 146, 146, 0.16);
}
:root[data-theme="dark"] .avail-slot-busy {
    background: var(--gray-100);
}
:root[data-theme="dark"] .avail-slot-busy:hover {
    background: var(--gray-100);
}
:root[data-theme="dark"] .avail-busy-badge {
    color: #fca5a5;
}
:root[data-theme="dark"] .avail-legend {
    color: #fca5a5;
}
:root[data-theme="dark"] .checkout-error {
    color: #fca5a5;
}
:root[data-theme="dark"] .assin-icon {
    color: #fff;
}
:root[data-theme="dark"] .assin-btn {
    color: #fff;
}
:root[data-theme="dark"] .reagendar-btn:hover {
    background: rgba(59, 130, 246, 0.14);
}
:root[data-theme="dark"] .cancelar-aula-btn:hover {
    background: rgba(239, 68, 68, 0.14);
}
:root[data-theme="dark"] .agendar-modal {
    background: var(--white);
}
:root[data-theme="dark"] .agendar-input {
    background: var(--white);
}
:root[data-theme="dark"] .meu-prof-card {
    background: var(--white);
}
:root[data-theme="dark"] .meu-prof-instrumento {
    color: #fff;
}
:root[data-theme="dark"] .minha-aula-row {
    background: var(--white);
}
/* dashboard/sections/alunos.css */
:root[data-theme="dark"] .aluno-avatar {
    color: #fff;
}
:root[data-theme="dark"] .aluno-action-btn--wa:hover {
    background: rgba(16, 185, 129, 0.14);
}
:root[data-theme="dark"] .aluno-action-btn--cancel:hover {
    background: rgba(239, 68, 68, 0.14);
}
:root[data-theme="dark"] .cancel-modal-icon {
    background: rgba(239, 68, 68, 0.14);
}
:root[data-theme="dark"] .aluno-card--clickable:hover {
    background: rgba(0, 146, 146, 0.16);
}
/* dashboard/sections/agenda.css */
:root[data-theme="dark"] .agenda-aula-card {
    background: var(--white);
}
:root[data-theme="dark"] .agenda-btn--sala {
    background: rgba(16, 185, 129, 0.14);
    color: #86efac;
}
:root[data-theme="dark"] .agenda-btn--sala:hover {
    background: rgba(16, 185, 129, 0.14);
}
:root[data-theme="dark"] .agenda-pg-nav {
    background: var(--white);
}
:root[data-theme="dark"] .agenda-pg-stat--ok {
    background: rgba(16, 185, 129, 0.14);
}
:root[data-theme="dark"] .agenda-pg-stat--ok .agenda-pg-stat-n {
    color: #86efac;
}
:root[data-theme="dark"] .agenda-pg-stat--done {
    background: rgba(0, 146, 146, 0.16);
}
:root[data-theme="dark"] .agenda-pg-stat--done .agenda-pg-stat-n {
    color: #93c5fd;
}
:root[data-theme="dark"] .agenda-pg-stat--cancel {
    background: rgba(239, 68, 68, 0.14);
}
:root[data-theme="dark"] .agenda-pg-stat--cancel .agenda-pg-stat-n {
    color: #fca5a5;
}
:root[data-theme="dark"] .agenda-pg-col {
    background: var(--white);
}
:root[data-theme="dark"] .agenda-pg-col--hoje .agenda-pg-col-header {
    background: rgba(0, 146, 146, 0.16);
}
:root[data-theme="dark"] .agenda-card--lista {
    background: var(--white);
}
:root[data-theme="dark"] .agenda-card-status--agendada {
    background: rgba(16, 185, 129, 0.14);
    color: #86efac;
}
:root[data-theme="dark"] .agenda-card-status--ativa {
    background: rgba(245, 158, 11, 0.14);
}
:root[data-theme="dark"] .agenda-card-status--concluida {
    background: rgba(59, 130, 246, 0.14);
    color: #93c5fd;
}
:root[data-theme="dark"] .agenda-card-status--cancelada {
    background: rgba(239, 68, 68, 0.14);
    color: #fca5a5;
}
:root[data-theme="dark"] .agenda-card-status--pendente {
    background: rgba(245, 158, 11, 0.14);
    color: #fcd34d;
}
:root[data-theme="dark"] .agenda-gcal-wrapper {
    background: var(--white);
}
:root[data-theme="dark"] .agenda-gcal-header {
    background: var(--white);
}
:root[data-theme="dark"] .agenda-gcal-time-col {
    background: var(--white);
}
:root[data-theme="dark"] .agenda-gcal-event--agendada {
    background: rgba(16, 185, 129, 0.14);
    color: #86efac;
}
:root[data-theme="dark"] .agenda-gcal-event--em_andamento {
    background: rgba(245, 158, 11, 0.14);
    color: #fcd34d;
}
:root[data-theme="dark"] .agenda-gcal-event--concluida {
    background: rgba(59, 130, 246, 0.14);
    color: #93c5fd;
}
:root[data-theme="dark"] .agenda-gcal-event--cancelada {
    background: rgba(239, 68, 68, 0.14);
    color: #fca5a5;
}
:root[data-theme="dark"] .agenda-gcal-event--reagendamento_pendente,
:root[data-theme="dark"] .agenda-gcal-event--indisponibilidade_professor,
:root[data-theme="dark"] .agenda-gcal-event--indisponibilidade_aluno {
    background: rgba(245, 158, 11, 0.14);
    color: #fcd34d;
}
/* dashboard/sections/perfil.css */
:root[data-theme="dark"] .settings-card--danger {
    background: rgba(239, 68, 68, 0.14);
}
:root[data-theme="dark"] .settings-card-title.danger {
    color: #fca5a5;
}
:root[data-theme="dark"] .settings-feedback.error {
    color: #fca5a5;
}
:root[data-theme="dark"] .theme-option-preview--light {
    background: var(--gray-100);
}
:root[data-theme="dark"] .theme-option-preview--light i {
    background: var(--white);
}
:root[data-theme="dark"] .theme-option-preview--auto {
    background: linear-gradient(90deg, var(--gray-100) 50%, #0A0E27 50%);
}
:root[data-theme="dark"] .theme-option-preview--auto i:nth-child(1) {
    background: var(--white);
}
/* dashboard/sections/visao-geral.css */
:root[data-theme="dark"] .history-empty {
    color: var(--color-dark-secondary);
}
:root[data-theme="dark"] .history-item {
    background: var(--white);
}
/* lick/style.css */
:root[data-theme="dark"] .tempo.playing .number.active {
    color: #fff;
}
:root[data-theme="dark"] .tons-seq-chip[data-state="current"] {
    color: #fff;
}
/* admin/atividades.css */
:root[data-theme="dark"] .at-prio-high {
    color: #fcd34d;
}
:root[data-theme="dark"] .at-area {
    color: var(--color-primary-light);
}
:root[data-theme="dark"] .at-hint {
    color: #86efac;
}
/* admin/gestao-cursos.css */
:root[data-theme="dark"] .gc-link-btn:hover {
    color: var(--color-primary-light);
}
/* checkout/checkout.css */
:root[data-theme="dark"] .co-summary {
    color: #fff;
}
:root[data-theme="dark"] .co-pix-icon {
    color: #fff;
}
:root[data-theme="dark"] .co-copy-btn {
    color: #fff;
}
:root[data-theme="dark"] .co-btn {
    color: #fff;
}
:root[data-theme="dark"] .co-error {
    background: rgba(239, 68, 68, 0.14);
}
:root[data-theme="dark"] .co-success-icon {
    color: #fff;
}
:root[data-theme="dark"] .co-step.active .co-step-num {
    color: #fff;
}
:root[data-theme="dark"] .co-slot-avatar {
    color: #fff;
}
:root[data-theme="dark"] .slt-slot.selected {
    color: #fff;
}
/* shared/auth.css */
:root[data-theme="dark"] .brand-content h2 {
    color: #fff;
}
:root[data-theme="dark"] .btn-submit {
    color: #fff;
}
/* metronome/metronome.css */
:root[data-theme="dark"] .metro-header {
    background: var(--white);
}
:root[data-theme="dark"] .metro-display.playing .metro-bpm-num {
    color: var(--color-primary-light);
}
:root[data-theme="dark"] .metro-play-btn {
    color: #fff;
}
:root[data-theme="dark"] .metro-settings-bar {
    background: var(--white);
}
:root[data-theme="dark"] .metro-progress-footer {
    background: var(--white);
}
:root[data-theme="dark"] .metro-step-btn:hover {
    color: var(--color-primary-light);
}
:root[data-theme="dark"] .metro-chip:hover {
    color: var(--color-primary-light);
}
:root[data-theme="dark"] .metro-chip.active {
    color: #fff;
}
:root[data-theme="dark"] .btn-primary {
    color: #fff;
}
/* professor-lp/professor-lp.css */
:root[data-theme="dark"] .lp-cta-btn {
    background: var(--white);
}
:root[data-theme="dark"] .lp-carousel::before {
    background: linear-gradient(to right, var(--color-bg, rgba(59, 130, 246, 0.14)) 20%, transparent);
}
:root[data-theme="dark"] .lp-carousel::after {
    background: linear-gradient(to left,  var(--color-bg, rgba(59, 130, 246, 0.14)) 20%, transparent);
}
/* sala-aula/sala-aula.css */
:root[data-theme="dark"] .participant-avatar--aluno {
    color: #c4b5fd;
}
:root[data-theme="dark"] .ctrl-btn--end {
    color: #fff;
}
:root[data-theme="dark"] .ctrl-btn--end:hover {
    color: #fff;
}
:root[data-theme="dark"] .audio2-panel {
    background: var(--white);
}
:root[data-theme="dark"] .audio2-select {
    background: var(--white);
}
:root[data-theme="dark"] .audio2-active-badge {
    color: var(--color-primary-light);
}
:root[data-theme="dark"] .yt-panel {
    background: var(--white);
}
:root[data-theme="dark"] .yt-panel-input {
    background: var(--white);
}
:root[data-theme="dark"] #btnYoutube.toolbar-btn--active {
    color: #fca5a5;
}
:root[data-theme="dark"] .braco-select {
    background: var(--white);
}
:root[data-theme="dark"] .braco-inlay {
    background-color: var(--white);
}
:root[data-theme="dark"] .yt-ativar-som {
    color: #fff;
}
/* trainer/trainer.css */
:root[data-theme="dark"] .btn-start {
    color: #fff;
}
/* workout/style.css */
:root[data-theme="dark"] .tittles {
    color: var(--color-dark);
}
:root[data-theme="dark"] .box {
    background: var(--white);
}
:root[data-theme="dark"] .hd-bpm-val {
    color: #93c5fd;
}
:root[data-theme="dark"] .hd-chip {
    background: var(--gray-100);
}
:root[data-theme="dark"] .hd-chip-val {
    color: #93c5fd;
}
:root[data-theme="dark"] .text-body-medium-regular {
    color: #93c5fd;
}
:root[data-theme="dark"] .text-body-medium-semibold {
    color: #93c5fd;
}
:root[data-theme="dark"] .ft-bar {
    background: var(--white);
}
:root[data-theme="dark"] .ft-btn--exit:hover {
    background: var(--gray-100);
    color: var(--color-dark);
}
:root[data-theme="dark"] .ft-info-workout {
    color: #93c5fd;
}
:root[data-theme="dark"] .ft-info-session {
    color: var(--color-dark);
}
:root[data-theme="dark"] .rp-current {
    color: #93c5fd;
}
:root[data-theme="dark"] .ft-prog-track {
    background: var(--gray-100);
}
:root[data-theme="dark"] .ft-prog-val {
    color: var(--color-dark);
}
:root[data-theme="dark"] .ft-timer-val {
    color: #93c5fd;
}
:root[data-theme="dark"] .progressbar {
    background: var(--gray-100);
}
:root[data-theme="dark"] .progress-label {
    color: var(--color-dark);
}
:root[data-theme="dark"] .inlay {
    background-color: var(--white);
}
/* workout/fretBoard.css */
:root[data-theme="dark"] .mark {
    background-color: var(--white);
}
/* professor.html (<style> interno) */
:root[data-theme="dark"] .lp-cta-btn {
    background: var(--white);
}
/* admin/index.html (<style> interno) */
:root[data-theme="dark"] .kpi-card--success {
    background: rgba(16, 185, 129, 0.14);
}
:root[data-theme="dark"] .kpi-card--success .kpi-value {
    color: #86efac;
}
:root[data-theme="dark"] .kpi-card--warning {
    background: rgba(245, 158, 11, 0.14);
}
:root[data-theme="dark"] .kpi-card--warning .kpi-value {
    color: #fcd34d;
}
:root[data-theme="dark"] .notice--warning {
    color: #fcd34d;
}
:root[data-theme="dark"] .notice--success {
    color: #86efac;
}
:root[data-theme="dark"] .udash-inactive-banner {
    background: rgba(239, 68, 68, 0.14);
    color: #fca5a5;
}
/* admin/lick-editor.html (<style> interno) */
:root[data-theme="dark"] .notice--warning {
    color: #fcd34d;
}
:root[data-theme="dark"] .notice--success {
    color: #86efac;
}
:root[data-theme="dark"] .notice--danger {
    color: #fca5a5;
}
:root[data-theme="dark"] .editor-fret-input {
    background: var(--white);
}

@media (min-width: 1024px) {
    /* landing.css */
    :root[data-theme="dark"] .lp-nav__menu > a:hover {
        color: var(--color-primary-light);
    }
}

/* Estilos inline escritos direto no HTML/JS (precisam de !important) */
:root[data-theme="dark"] [style*="background:#e8f5e9"] { background: rgba(16, 185, 129, 0.14) !important; }
:root[data-theme="dark"] [style*="background:#f5f5f5"] { background: var(--gray-100) !important; }
:root[data-theme="dark"] [style*="background:#fff5f5"] { background: rgba(239, 68, 68, 0.14) !important; }
:root[data-theme="dark"] [style*="color:#2e7d32"] { color: #86efac !important; }
:root[data-theme="dark"] [style*="color:#444"] { color: var(--color-dark) !important; }
:root[data-theme="dark"] [style*="color:#c0392b"] { color: #fca5a5 !important; }
:root[data-theme="dark"] [style*="color:#dc2626"] { color: #fca5a5 !important; }

/* ===== auth (login/cadastro): tokens locais do auth.css ===== */
:root[data-theme="dark"] .auth-form-container h1,
:root[data-theme="dark"] .email-confirm h1 { color: var(--color-dark); }
:root[data-theme="dark"] .auth-subtitle { color: var(--color-text-soft); }
:root[data-theme="dark"] .brand-content p { color: #A3AAC6; }