/* ============================================================
   SETMONA — base.css
   CSS variables, reset, typography
   ============================================================ */

:root {
  /* Brand */
  --brand-primary:   #0B3B6E;
  --brand-accent:    #20C7BC;
  --brand-highlight: #D8B46A;
  --brand-danger:    #E53935;
  --brand-warning:   #F59E0B;

  /* Backgrounds */
  --bg-page:         #F5F4F0;
  --bg-card:         #FFFFFF;
  --bg-sidebar:      #1A1F2E;
  --bg-sidebar-hover:#252B3D;
  --bg-input:        #FFFFFF;
  --bg-muted:        #F0EEE9;

  /* Text */
  --text-primary:    #1A1A18;
  --text-secondary:  #5F5E5A;
  --text-muted:      #9B9995;
  --text-inverse:    #FFFFFF;
  --text-brand:      #0B3B6E;
  --text-accent:     #20C7BC;
  --text-danger:     #C62828;

  /* Borders */
  --border-default:  #E5E3DC;
  --border-strong:   #C8C6BE;
  --border-focus:    #0B3B6E;

  /* Status backgrounds */
  --bg-success:      #E1F5EE;
  --bg-danger:       #FDECEC;
  --bg-warning:      #FEF3C7;
  --bg-info:         #EBF4FF;

  /* Typography */
  --font-sans: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  --font-serif: 'Plus Jakarta Sans', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', 'Courier New', monospace;

  /* Spacing scale */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;

  /* Radius */
  --radius-sm:  6px;
  --radius-md:  10px;
  --radius-lg:  14px;
  --radius-xl:  20px;
  --radius-full: 9999px;

  /* Shadows */
  --shadow-sm:  0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);
  --shadow-md:  0 4px 12px rgba(0,0,0,.08), 0 2px 4px rgba(0,0,0,.04);
  --shadow-lg:  0 12px 32px rgba(0,0,0,.10), 0 4px 8px rgba(0,0,0,.05);

  /* Sidebar */
  --sidebar-width: 240px;

  /* Transitions */
  --transition: 150ms ease;
}

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

html {
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-sans);
  background: var(--bg-page);
  color: var(--text-primary);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font-family: inherit; font-size: inherit; }
button { cursor: pointer; border: none; background: none; }
ul, ol { list-style: none; }
hr { border: none; border-top: 1px solid var(--border-default); }

/* ============================================================
   Typography
   ============================================================ */
h1 { font-family: var(--font-serif); font-size: 2rem; font-weight: 400; line-height: 1.25; letter-spacing: -.02em; }
h2 { font-family: var(--font-serif); font-size: 1.5rem; font-weight: 400; line-height: 1.3; letter-spacing: -.01em; }
h3 { font-size: 1.125rem; font-weight: 500; line-height: 1.4; }
h4 { font-size: 1rem; font-weight: 500; line-height: 1.4; }
h5 { font-size: .875rem; font-weight: 600; line-height: 1.4; }

p { line-height: 1.7; color: var(--text-secondary); }

.text-sm   { font-size: .875rem; }
.text-xs   { font-size: .75rem; }
.text-lg   { font-size: 1.125rem; }
.text-xl   { font-size: 1.25rem; }
.text-muted   { color: var(--text-muted); }
.text-secondary { color: var(--text-secondary); }
.text-brand   { color: var(--text-brand); }
.text-accent  { color: var(--text-accent); }
.text-danger  { color: var(--text-danger); }
.font-medium  { font-weight: 500; }
.font-semibold { font-weight: 600; }

/* ============================================================
   Google Fonts import
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');
