/* =========================================================================
   Miriñay — Sistema de Orçamentos
   tokens.css — variáveis de design, reset e tipografia
   Cores da marca extraídas de logo-dark.svg (#22A85A / #8FC14D)
   ========================================================================= */

:root {
  /* Marca */
  --brand-50:  #eaf7ef;
  --brand-100: #cdedd9;
  --brand-200: #a3dfba;
  --brand-300: #6ecb95;
  --brand-400: #3cb673;
  --brand-500: #22a85a;  /* verde principal da logo */
  --brand-600: #1b8c4a;
  --brand-700: #146c39;
  --brand-800: #0e4d29;
  --brand-900: #0a3a1f;

  --lime-300: #b4d97f;
  --lime-400: #a0cc63;
  --lime-500: #8fc14d;   /* verde-limão da logo */
  --lime-600: #74a33a;

  /* Neutros */
  --gray-0:   #ffffff;
  --gray-25:  #fafbfa;
  --gray-50:  #f4f6f5;
  --gray-100: #eceff0;
  --gray-200: #dfe4e4;
  --gray-300: #c8cfd0;
  --gray-400: #9aa5a6;
  --gray-500: #717d7e;
  --gray-600: #556061;
  --gray-700: #3d4748;
  --gray-800: #262f30;
  --gray-900: #151c1d;

  /* Sidebar escura (a logo é verde sobre fundo escuro) */
  --sidebar-bg:      #101a15;
  --sidebar-bg-soft: #17251e;
  --sidebar-border:  #23342b;
  --sidebar-text:    #b9c6be;
  --sidebar-text-mu: #7b8b82;

  /* Semânticas */
  --success-50:  #eaf7ef;  --success-500: #22a85a;  --success-700: #146c39;
  --warning-50:  #fef6e7;  --warning-500: #e0a01a;  --warning-700: #8f6205;
  --danger-50:   #fdecec;  --danger-500:  #d64545;  --danger-700:  #9a2a2a;
  --info-50:     #eaf2fd;  --info-500:    #2c73d2;  --info-700:    #1b4a8b;
  --neutral-50:  #f1f3f3;  --neutral-500: #717d7e;  --neutral-700: #3d4748;

  /* Superfícies */
  --bg:            var(--gray-50);
  --surface:       var(--gray-0);
  --surface-muted: var(--gray-25);
  --border:        var(--gray-200);
  --border-strong: var(--gray-300);
  --text:          var(--gray-800);
  --text-muted:    var(--gray-500);
  --text-soft:     var(--gray-400);

  /* Tipografia */
  --font-sans: "Inter", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --font-mono: "JetBrains Mono", "Cascadia Mono", Consolas, "Courier New", monospace;

  --fs-xs:   0.6875rem;  /* 11px */
  --fs-sm:   0.75rem;    /* 12px */
  --fs-base: 0.8125rem;  /* 13px */
  --fs-md:   0.875rem;   /* 14px */
  --fs-lg:   1rem;       /* 16px */
  --fs-xl:   1.125rem;   /* 18px */
  --fs-2xl:  1.375rem;   /* 22px */
  --fs-3xl:  1.75rem;    /* 28px */

  /* Espaçamento */
  --sp-1: 4px;   --sp-2: 8px;   --sp-3: 12px;  --sp-4: 16px;
  --sp-5: 20px;  --sp-6: 24px;  --sp-8: 32px;  --sp-10: 40px;  --sp-12: 48px;

  /* Raios */
  --r-sm: 4px;  --r-md: 6px;  --r-lg: 10px;  --r-xl: 14px;  --r-full: 999px;

  /* Sombras */
  --sh-xs: 0 1px 2px rgba(21, 28, 29, .06);
  --sh-sm: 0 1px 3px rgba(21, 28, 29, .08), 0 1px 2px rgba(21, 28, 29, .04);
  --sh-md: 0 4px 12px rgba(21, 28, 29, .08), 0 2px 4px rgba(21, 28, 29, .04);
  --sh-lg: 0 12px 32px rgba(21, 28, 29, .12), 0 4px 8px rgba(21, 28, 29, .05);
  --sh-xl: 0 24px 64px rgba(21, 28, 29, .18);

  /* Layout */
  --sidebar-w:          248px;
  --sidebar-w-collapsed: 68px;
  --topbar-h:           58px;
  --content-max:        1560px;

  --ring: 0 0 0 3px rgba(34, 168, 90, .22);
  --transition: 160ms cubic-bezier(.4, 0, .2, 1);
}

/* ------------------------------------------------------------------ reset */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

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

h1, h2, h3, h4, h5, h6 { margin: 0; font-weight: 600; line-height: 1.3; color: var(--gray-900); }
h1 { font-size: var(--fs-2xl); }
h2 { font-size: var(--fs-xl); }
h3 { font-size: var(--fs-lg); }
h4 { font-size: var(--fs-md); }

p { margin: 0 0 var(--sp-3); }
p:last-child { margin-bottom: 0; }

a { color: var(--brand-600); text-decoration: none; }
a:hover { color: var(--brand-700); text-decoration: underline; }

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

button, input, select, textarea { font: inherit; color: inherit; }

table { border-collapse: collapse; width: 100%; }

hr { border: 0; border-top: 1px solid var(--border); margin: var(--sp-5) 0; }

:focus-visible { outline: 2px solid var(--brand-500); outline-offset: 2px; }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--gray-300); border-radius: var(--r-full); border: 2px solid transparent; background-clip: content-box; }
::-webkit-scrollbar-thumb:hover { background: var(--gray-400); background-clip: content-box; }

/* ------------------------------------------------------------- utilitários */

.u-hidden { display: none !important; }
.u-invisible { visibility: hidden; }
.u-sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.u-text-right  { text-align: right; }
.u-text-center { text-align: center; }
.u-text-muted  { color: var(--text-muted); }
.u-text-soft   { color: var(--text-soft); }
.u-text-danger { color: var(--danger-500); }
.u-text-success{ color: var(--success-700); }
.u-nowrap      { white-space: nowrap; }
.u-truncate    { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.u-mono        { font-family: var(--font-mono); font-size: 0.95em; }
.u-tabular     { font-variant-numeric: tabular-nums; }

.u-fs-xs { font-size: var(--fs-xs); }
.u-fs-sm { font-size: var(--fs-sm); }
.u-fs-lg { font-size: var(--fs-lg); }
.u-bold  { font-weight: 600; }

.u-flex     { display: flex; }
.u-flex-col { display: flex; flex-direction: column; }
.u-items-center { align-items: center; }
.u-justify-between { justify-content: space-between; }
.u-gap-1 { gap: var(--sp-1); } .u-gap-2 { gap: var(--sp-2); }
.u-gap-3 { gap: var(--sp-3); } .u-gap-4 { gap: var(--sp-4); }
.u-gap-6 { gap: var(--sp-6); }
.u-grow  { flex: 1 1 auto; min-width: 0; }
.u-wrap  { flex-wrap: wrap; }

.u-mt-0 { margin-top: 0; }   .u-mt-2 { margin-top: var(--sp-2); }
.u-mt-3 { margin-top: var(--sp-3); } .u-mt-4 { margin-top: var(--sp-4); }
.u-mt-6 { margin-top: var(--sp-6); }
.u-mb-0 { margin-bottom: 0; } .u-mb-2 { margin-bottom: var(--sp-2); }
.u-mb-3 { margin-bottom: var(--sp-3); } .u-mb-4 { margin-bottom: var(--sp-4); }
.u-mb-6 { margin-bottom: var(--sp-6); }

.u-w-full { width: 100%; }

@media print {
  .u-no-print { display: none !important; }
}
