/* makemusicrecordsbr-theme-provider 2.0.0 — contrato visual do Make Music System.
   A paleta escura e a escala vêm do Dashboard em projects/dashboard/public/{viz,dashboard}.css.
   theme.js sempre resolve data-theme para light ou dark. Sem JS, o escuro continua legível. */

:root,
[data-theme="dark"] {
  color-scheme: dark;
  --mm-bg: #1A1A1A;
  --mm-surface: #222222;
  --mm-surface-deep: #111111;
  --mm-surface-bar: #171717;
  --mm-surface-sunken: #1E1E1E;
  --mm-surface-raised: #252525;
  --mm-surface-hover: #292929;
  --mm-border: #747371;
  --mm-grid: #33312E;
  --mm-text: #FFFFFF;
  --mm-muted: #9A948C;
  --mm-muted-bright: #B8B4B0;
  --mm-accent: #C21121;
  --mm-accent-text: #E8394A;
  --mm-on-accent: #FFFFFF;
  --mm-accent-1: #C4B0F5;
  --mm-accent-2: #B3E6FB;
  --mm-accent-3: #FAC8B3;
  --mm-data-1: #B3E6FB;
  --mm-data-2: #5B86E5;
  --mm-data-3: #C4B0F5;
  --mm-data-4: #F5C74D;
  --mm-data-5: #EFA860;
  --mm-data-6: #D9634B;
  --mm-ok: #52C98F;
  --mm-warn: #E8A33D;
  --mm-block: #E46B56;
  --mm-platform-spotify: #1ED760;
  --mm-platform-instagram: #9456BF;
  --mm-platform-tiktok: #25F4EE;
  --mm-platform-youtube: #FF0000;
  --mm-platform-facebook: #1877F2;
  --mm-platform-apple-music: #FFFFFF;
  --mm-hover-tint: rgba(255, 255, 255, .022);
}

[data-theme="light"] {
  color-scheme: light;
  --mm-bg: #F5F5F7;
  --mm-surface: #FFFFFF;
  --mm-surface-deep: #EDEDF0;
  --mm-surface-bar: #F0F0F3;
  --mm-surface-sunken: #F2F2F5;
  --mm-surface-raised: #FFFFFF;
  --mm-surface-hover: #EAEAEE;
  --mm-border: #7A7A80;
  --mm-grid: #E3E3E8;
  --mm-text: #1D1D1F;
  --mm-muted: #5E5E63;
  --mm-muted-bright: #4F4F54;
  --mm-accent: #C21121;
  --mm-accent-text: #C21121;
  --mm-on-accent: #FFFFFF;
  --mm-accent-1: #6B4FC8;
  --mm-accent-2: #0B6A8E;
  --mm-accent-3: #9A4526;
  --mm-data-1: #1F5FBF;
  --mm-data-2: #8E2F9E;
  --mm-data-3: #B3261E;
  --mm-data-4: #16713F;
  --mm-data-5: #0B7285;
  --mm-data-6: #4D4D52;
  --mm-ok: #16713F;
  --mm-warn: #8A5100;
  --mm-block: #B3261E;
  --mm-platform-spotify: #157A3C;
  --mm-platform-instagram: #8A4FB5;
  --mm-platform-tiktok: #0B7A76;
  --mm-platform-youtube: #D60000;
  --mm-platform-facebook: #1877F2;
  --mm-platform-apple-music: #1D1D1F;
  --mm-hover-tint: rgba(0, 0, 0, .03);
}

:root {
  --mm-on-accent-soft: rgba(255, 255, 255, .92);
  --mm-on-accent-line: rgba(255, 255, 255, .68);
  --mm-scrim: rgba(0, 0, 0, .6);
  --mm-scrim-strong: rgba(0, 0, 0, .72);
  --mm-font-display: 'Bebas Neue', sans-serif;
  --mm-font-label: 'Oswald', sans-serif;
  --mm-font-body: 'Plus Jakarta Sans', sans-serif;
  --mm-font-size-title: 1.8rem;
  --mm-font-size-subtitle: .938rem;
  --mm-font-size-body: .875rem;
  --mm-font-size-label: .75rem;
  --mm-font-size-kpi: clamp(2.4rem, 5vw, 3.6rem);
  --mm-line-title: 1;
  --mm-line-subtitle: 1.5;
  --mm-line-body: 1.6;
  --mm-line-label: 1.2;
  --mm-line-kpi: .9;
  --mm-space-control-x: .75rem;
  --mm-space-control-y: .6rem;
  --mm-space-gap: .75rem;
  --mm-space-card: 1.25rem;
  --mm-space-shell: 1.5rem;
  --mm-control-min: 44px;
  --mm-radius: 0;
  --mm-radius-pill: 999px;
  --mm-border-width: 1px;
  --mm-focus-width: 2px;
  --mm-ease: cubic-bezier(0.23, 1, 0.32, 1);
}

/* Padrões opt-in. Eles descrevem papéis; cada produto preserva sua composição e navegação. */
.mm-card {
  color: var(--mm-text);
  background: var(--mm-surface);
  border: var(--mm-border-width) solid var(--mm-border);
  border-radius: var(--mm-radius);
  padding: var(--mm-space-card);
}
.mm-button,
.mm-field {
  min-height: var(--mm-control-min);
  border: var(--mm-border-width) solid var(--mm-border);
  border-radius: var(--mm-radius);
  font: var(--mm-font-size-body)/var(--mm-line-body) var(--mm-font-body);
}
.mm-button {
  padding: 0 1.25rem;
  color: var(--mm-text);
  background: transparent;
  cursor: pointer;
}
.mm-button--primary { color: var(--mm-on-accent); background: var(--mm-accent); border-color: var(--mm-accent); }
.mm-button:disabled { opacity: .45; cursor: not-allowed; }
.mm-field { padding: var(--mm-space-control-y) var(--mm-space-control-x); color: var(--mm-text); background: var(--mm-surface); }
.mm-button:focus-visible,
.mm-field:focus-visible { outline: var(--mm-focus-width) solid var(--mm-accent-text); outline-offset: 2px; }
.mm-table { width: 100%; border-collapse: collapse; color: var(--mm-text); background: var(--mm-surface); }
.mm-table th,
.mm-table td { padding: .625rem .75rem; border-bottom: var(--mm-border-width) solid var(--mm-border); text-align: left; }
.mm-table th { font: var(--mm-font-size-label)/var(--mm-line-label) var(--mm-font-label); letter-spacing: .1em; text-transform: uppercase; }
.mm-modal-backdrop { position: fixed; inset: 0; display: grid; place-items: center; padding: var(--mm-space-shell); background: var(--mm-scrim); }
.mm-modal { width: min(42rem, 100%); max-height: calc(100vh - 3rem); overflow: auto; color: var(--mm-text); background: var(--mm-surface); border: var(--mm-border-width) solid var(--mm-border); padding: var(--mm-space-card); }
.mm-badge { display: inline-flex; border: var(--mm-border-width) solid currentColor; border-radius: var(--mm-radius-pill); padding: .14rem .6rem; font: var(--mm-font-size-label)/var(--mm-line-label) var(--mm-font-label); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
