/* ============================================================
   DESIGN SYSTEM — Estudos CAO
   Variáveis CSS, reset e tipografia base
   ============================================================ */

:root {
  /* Cores principais */
  --khaki:          #C3B091;
  --khaki-dark:     #A89570;
  --khaki-light:    rgba(195, 176, 145, 0.15);
  --khaki-solid:    rgba(195, 176, 145, 0.25);
  --black:          #000000;
  --white:          #FFFFFF;

  /* Superfícies */
  --bg-page:        #F5F5F5;
  --bg-card:        #FFFFFF;
  --bg-sidebar:     #FFFFFF;
  --bg-header:      #FFFFFF;

  /* Bordas e divisores */
  --border:         #E5E5E5;

  /* Texto */
  --text-primary:   #000000;
  --text-secondary: #6B7280;

  /* Status — Sucesso */
  --success-text:   #2F6B4F;
  --success-bg:     #EAF3EE;
  --success-border: #BFDED0;

  /* Status — Alerta */
  --warning-text:   #95591A;
  --warning-bg:     #FBF1E0;
  --warning-border: #E8CB9C;

  /* Status — Erro */
  --error-text:     #A8453D;
  --error-bg:       #FBEAEA;
  --error-border:   #E9C6C4;

  /* Status — Informativo */
  --info-text:      #3D5A73;
  --info-bg:        #EAF1F6;
  --info-border:    #C7D9E3;

  /* Tipografia */
  --font-display:   'Teko', sans-serif;
  --font-body:      'Inter', sans-serif;

  /* Layout */
  --sidebar-w:      260px;
  --header-h:       64px;

  /* Border-radius */
  --radius-card:    16px;
  --radius-btn:     10px;
  --radius-input:   8px;
  --radius-badge:   99px;

  /* Sombras */
  --shadow-card:  0 1px 3px rgba(0,0,0,0.04), 0 1px 2px rgba(0,0,0,0.02);
  --shadow-btn:   0 1px 2px rgba(0,0,0,0.08);
  --shadow-modal: 0 8px 32px rgba(0,0,0,0.12);

  /* Transições */
  --t-fast: 150ms ease-out;
  --t-base: 200ms ease-out;
  --t-slow: 250ms ease-out;
}

/* Reset */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { font-size: 16px; }

body {
  font-family: var(--font-body);
  font-size: 0.9375rem;
  color: var(--text-primary);
  background: var(--bg-page);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3 {
  font-family: var(--font-display);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: 0.01em;
}
h1 { font-size: 2.25rem; }
h2 { font-size: 1.6rem; }
h3 { font-size: 1.15rem; min-font-size: 16px; }

p { line-height: 1.6; }

a { color: inherit; text-decoration: none; }

img, svg { display: block; max-width: 100%; }

button { cursor: pointer; font-family: var(--font-body); border: none; background: none; }

input, select, textarea { font-family: var(--font-body); font-size: 0.9375rem; }

ul, ol { list-style: none; }