/**
 * AkkinoObras - Global CSS
 * Variáveis de design, reset, tipografia e utilitários base
 * Consumido por todos os layouts Blade
 * Fonte de verdade: config/system_design.php
 */

/* ============================================================
   VARIÁVEIS DE DESIGN (CSS Custom Properties)
   ============================================================ */
:root {
  /* Cores */
  --color-primary:        #e8c547;
  --color-primary-hover:  #d4b240;
  --color-primary-muted:  rgba(232, 197, 71, 0.12);
  --color-bg:             #0d0d0d;
  --color-surface:        #1a1a1a;
  --color-surface-2:      #222222;
  --color-surface-3:      #2a2a2a;
  --color-border:         #2a2a2a;
  --color-border-light:   #333333;

  /* Texto */
  --color-text:           #f0f0f0;
  --color-text-secondary: #a0a0a0;
  --color-text-muted:     #606060;

  /* Estados */
  --color-success:        #4caf50;
  --color-success-bg:     rgba(76, 175, 80, 0.12);
  --color-warning:        #ff9800;
  --color-warning-bg:     rgba(255, 152, 0, 0.12);
  --color-danger:         #f44336;
  --color-danger-bg:      rgba(244, 67, 54, 0.12);
  --color-info:           #2196f3;
  --color-info-bg:        rgba(33, 150, 243, 0.12);

  /* Tipografia */
  --font-sans:            'DM Sans', sans-serif;
  --font-mono:            'DM Mono', monospace;
  --font-size-xs:         0.75rem;
  --font-size-sm:         0.875rem;
  --font-size-base:       1rem;
  --font-size-lg:         1.125rem;
  --font-size-xl:         1.25rem;
  --font-size-2xl:        1.5rem;
  --font-size-3xl:        1.875rem;

  /* Layout */
  --sidebar-width:        260px;
  --sidebar-collapsed:    70px;
  --header-height:        64px;

  /* Bordas */
  --radius-sm:            6px;
  --radius-md:            10px;
  --radius-lg:            16px;
  --radius-xl:            24px;
  --radius-full:          9999px;

  /* Sombras */
  --shadow-sm:            0 1px 3px rgba(0,0,0,0.3);
  --shadow-md:            0 4px 12px rgba(0,0,0,0.4);
  --shadow-lg:            0 8px 24px rgba(0,0,0,0.5);
  --shadow-card:          0 2px 12px rgba(0,0,0,0.4);
  --shadow-primary:       0 4px 20px rgba(232,197,71,0.25);

  /* Transições */
  --transition-fast:      150ms ease;
  --transition-base:      250ms ease;
  --transition-slow:      400ms ease;

  /* Z-index */
  --z-sidebar:            100;
  --z-header:             200;
  --z-modal:              1000;
  --z-toast:              2000;
}

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

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

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

a          { color: var(--color-primary); text-decoration: none; transition: color var(--transition-fast); }
a:hover    { color: var(--color-primary-hover); }
img        { max-width: 100%; display: block; }
ul, ol     { list-style: none; }
button     { cursor: pointer; font-family: var(--font-sans); border: none; background: none; }
input, select, textarea { font-family: var(--font-sans); }

/* ============================================================
   UTILITÁRIOS
   ============================================================ */
.text-primary   { color: var(--color-primary) !important; }
.text-secondary { color: var(--color-text-secondary) !important; }
.text-muted     { color: var(--color-text-muted) !important; }
.text-success   { color: var(--color-success) !important; }
.text-warning   { color: var(--color-warning) !important; }
.text-danger    { color: var(--color-danger) !important; }

.bg-surface    { background: var(--color-surface); }
.bg-surface-2  { background: var(--color-surface-2); }

.font-mono     { font-family: var(--font-mono); }
.font-medium   { font-weight: 500; }
.font-semibold { font-weight: 600; }
.font-bold     { font-weight: 700; }

.rounded-sm    { border-radius: var(--radius-sm); }
.rounded-md    { border-radius: var(--radius-md); }
.rounded-lg    { border-radius: var(--radius-lg); }
.rounded-full  { border-radius: var(--radius-full); }