/* ══════════════════════════════════════════════════════════════
   base.css — Design system: fonts, CSS vars, reset, keyframes
   Edite aqui: cores, tipografia, variáveis globais
   ══════════════════════════════════════════════════════════════ */

/* ── Fontes ─────────────────────────────────────────────────── */
@font-face{font-family:'Mosvita'; src:url('/fonts/Mosvita-Light.otf')             format('opentype');font-weight:300;font-display:swap}
@font-face{font-family:'Mosvita'; src:url('/fonts/Mosvita-Regular.otf')           format('opentype');font-weight:400;font-display:swap}
@font-face{font-family:'Mosvita'; src:url('/fonts/Mosvita-SemiBold.otf')          format('opentype');font-weight:600;font-display:swap}
@font-face{font-family:'Mosvita'; src:url('/fonts/Mosvita-Bold.otf')              format('opentype');font-weight:700;font-display:swap}
@font-face{font-family:'Mosvita'; src:url('/fonts/Mosvita-ExtraBold.otf')         format('opentype');font-weight:800;font-display:swap}
@font-face{font-family:'Mosvita'; src:url('/fonts/Mosvita-Black.otf')             format('opentype');font-weight:900;font-display:swap}
@font-face{font-family:'MosvitaX';src:url('/fonts/Mosvita-LightExpanded.otf')     format('opentype');font-weight:300;font-display:swap}
@font-face{font-family:'MosvitaX';src:url('/fonts/Mosvita-Expanded.otf')          format('opentype');font-weight:400;font-display:swap}
@font-face{font-family:'MosvitaX';src:url('/fonts/Mosvita-SemiBoldExpanded.otf')  format('opentype');font-weight:600;font-display:swap}
@font-face{font-family:'MosvitaX';src:url('/fonts/Mosvita-BoldExpanded.otf')      format('opentype');font-weight:700;font-display:swap}
@font-face{font-family:'MosvitaX';src:url('/fonts/Mosvita-ExtraBoldExpanded.otf') format('opentype');font-weight:800;font-display:swap}
@font-face{font-family:'MosvitaX';src:url('/fonts/Mosvita-BlackExpanded.otf')     format('opentype');font-weight:900;font-display:swap}

/* ── Tema claro (padrão) ────────────────────────────────────── */
:root{
  --bg:          #F9F9F7;
  --bg2:         #edecea;
  --card:        #ffffff;
  --card2:       #f9f8f6;
  --card3:       #f0ede8;
  --border:      rgba(0,0,0,.055);
  --border2:     rgba(0,0,0,.10);
  --border3:     rgba(0,0,0,.18);
  --text:        #111111;
  --text1:       #0a0a0a;
  --text2:       #666666;
  --text3:       #aaaaaa;
  --accent:      #f39021;
  --accent2:     #f39021;
  --accent3:     #f5a84a;
  --accent-bg:   rgba(243,144,33,.08);
  --accent-bd:   rgba(243,144,33,.20);
  --green:       #059669;
  --green-bg:    rgba(5,150,105,.08);
  --green-bd:    rgba(5,150,105,.22);
  --gold:        #f39021;
  --gold-bg:     rgba(243,144,33,.07);
  --gold-bd:     rgba(243,144,33,.18);
  --red:         #dc2626;
  --red-bg:      rgba(220,38,38,.07);
  --red-bd:      rgba(220,38,38,.2);
  --sb-bg:       #ffffff;
  --sb-border:   rgba(0,0,0,.07);
  --sb-text:     #0a0a0a;
  --sb-text2:    #666666;
  --sb-text3:    #bbbbbb;
  --sb-active-bg:rgba(0,0,0,.07);
  --sb-active-c: #0a0a0a;
  --sb-active-bd:#f39021;
  --sb-hover:    rgba(0,0,0,.04);
  --sb-div:      rgba(0,0,0,.07);
  --glow:        0 0 0 1.5px rgba(243,144,33,.45), 0 0 22px rgba(243,144,33,.14), 0 8px 32px rgba(0,0,0,.10);
  --glow-sm:     0 0 0 1.5px rgba(243,144,33,.35), 0 0 14px rgba(243,144,33,.12);
  --sidebar-w:   220px;
  --auth-bg:          #EDECEA;
  --auth-card:        #FFFFFF;
  --auth-card-border: rgba(0,0,0,.07);
  --auth-input:       #FFFFFF;
  --auth-text1:       #0a0a0a;
  --auth-text2:       #666666;
  --auth-text3:       #888888;
  --auth-placeholder: rgba(0,0,0,.35);
  --auth-eye:         #999999;
  --auth-eye-hover:   #0a0a0a;
  --auth-divider:     rgba(0,0,0,.07);
  --auth-pw-seg:      rgba(0,0,0,.08);
}

/* ── Tema escuro ─────────────────────────────────────────────── */
[data-theme="dark"]{
  --bg:          #1F1F1E;
  --bg2:         #1D1D1D;
  --card:        #252524;
  --card2:       #2C2C2B;
  --card3:       #333332;
  --border:      rgba(255,255,255,.04);
  --border2:     rgba(255,255,255,.09);
  --border3:     rgba(255,255,255,.16);
  --text:        #ececec;
  --text1:       #f8f8f8;
  --text2:       #b4b4b4;
  --text3:       #888888;
  --accent:      #f39021;
  --accent2:     #f5a84a;
  --accent3:     #f7c07a;
  --accent-bg:   rgba(243,144,33,.09);
  --accent-bd:   rgba(243,144,33,.22);
  --green:       #4ade80;
  --green-bg:    rgba(74,222,128,.08);
  --green-bd:    rgba(74,222,128,.22);
  --gold:        #f39021;
  --gold-bg:     rgba(243,144,33,.09);
  --gold-bd:     rgba(243,144,33,.22);
  --red:         #f87171;
  --red-bg:      rgba(248,113,113,.08);
  --red-bd:      rgba(248,113,113,.22);
  --sb-bg:       #1D1D1D;
  --sb-border:   rgba(255,255,255,.06);
  --sb-text:     rgba(255,255,255,.88);
  --sb-text2:    rgba(255,255,255,.40);
  --sb-text3:    rgba(255,255,255,.20);
  --sb-active-bg:rgba(255,255,255,.08);
  --sb-active-c: rgba(255,255,255,.97);
  --sb-active-bd:#f39021;
  --sb-hover:    rgba(255,255,255,.05);
  --sb-div:      rgba(255,255,255,.07);
  --glow:        0 0 0 1.5px rgba(243,144,33,.50), 0 0 28px rgba(243,144,33,.18), 0 8px 32px rgba(0,0,0,.35);
  --glow-sm:     0 0 0 1.5px rgba(243,144,33,.40), 0 0 16px rgba(243,144,33,.14);
  --auth-bg:          #111110;
  --auth-card:        rgba(26,24,22,.96);
  --auth-card-border: rgba(255,255,255,.08);
  --auth-input:       #231f1d;
  --auth-text1:       #f3f0ee;
  --auth-text2:       #9a9390;
  --auth-text3:       #7a7370;
  --auth-placeholder: #4a4540;
  --auth-eye:         #5a5550;
  --auth-eye-hover:   #f3f0ee;
  --auth-divider:     rgba(255,255,255,.08);
  --auth-pw-seg:      rgba(255,255,255,.1);
}

/* ── Reset & base ────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
*{transition:background-color .24s ease-out,border-color .18s ease-out,color .14s ease-out,box-shadow .2s ease-out,transform .2s cubic-bezier(.16,1,.3,1)}
svg,svg *,img,.scale-up,.skeleton{transition:none !important}
button{transition:background-color .18s ease-out,border-color .16s ease-out,color .12s ease-out,opacity .1s,box-shadow .18s ease-out,transform .14s cubic-bezier(.16,1,.3,1) !important}
body{background:var(--bg);color:var(--text);font-family:'Mosvita',system-ui,sans-serif;-webkit-font-smoothing:antialiased;min-height:100vh;font-size:14px;opacity:0;animation:appFadeIn .3s ease forwards}
@keyframes appFadeIn{to{opacity:1}}
button,input,textarea,select,a{font-family:inherit}
/* Remove as setas (spinner) de todos os inputs numéricos do sistema */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;margin:0}
input[type=number]{-moz-appearance:textfield;appearance:textfield}
/* Checkbox/radio na identidade da marca (laranja) */
input[type=checkbox],input[type=radio]{accent-color:var(--accent);width:16px;height:16px;cursor:pointer;flex-shrink:0}
::-webkit-scrollbar{width:3px;height:3px}
::-webkit-scrollbar-thumb{background:var(--border2);border-radius:2px}

/* ── Keyframes ───────────────────────────────────────────────── */
@keyframes fadeUp   {from{opacity:0;transform:translateY(8px)}to{opacity:1}}
@keyframes fadeIn   {from{opacity:0}to{opacity:1}}
@keyframes scaleUp  {from{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}
@keyframes shimmer  {0%{background-position:-600px 0}100%{background-position:600px 0}}
@keyframes spin     {to{transform:rotate(360deg)}}
@keyframes pulse-glow{0%,100%{box-shadow:0 0 0 0 rgba(245,158,11,.5)}50%{box-shadow:0 0 0 6px rgba(245,158,11,0)}}
@keyframes slideUp  {from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes mpUp     {from{opacity:0;transform:translateY(28px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}

/* ── Utility classes ─────────────────────────────────────────── */
.fade-up{animation:fadeUp .32s cubic-bezier(.16,1,.3,1) both}
.scale-up{animation:scaleUp .26s cubic-bezier(.16,1,.3,1) both}
.skeleton{background:linear-gradient(90deg,var(--card2) 0%,var(--border) 40%,var(--card2) 80%);background-size:600px 100%;animation:shimmer 1.5s ease-in-out infinite;border-radius:6px}

/* ── Logo theme filters ──────────────────────────────────────── */
:root .sb-logo-full{filter:invert(1)}
[data-theme="dark"] .sb-logo-full{filter:none}
:root .sb-logo-symbol{filter:invert(1)}
[data-theme="dark"] .sb-logo-symbol{filter:none}
:root .auth-logo-img{filter:invert(1)}
[data-theme="dark"] .auth-logo-img{filter:none}