/* NEAR design tokens (gerado a partir de apps/mobile/src/theme/tokens.ts e layout.ts).
   Claro por padrao; escuro via prefers-color-scheme ou [data-theme="dark"]. Force claro com [data-theme="light"]. */

:root {
  /* Marca (igual nos dois temas) */
  --near-tomato: #FF5436;
  --near-sun: #FFC531;
  --near-sky: #3D8BFF;
  --near-mint: #19B88A;
  --near-grape: #7C5CFF;
  --near-on-sun: #14121F;
  --near-white: #FFFFFF;
  --near-mess-zero: #19B88A;
  --near-mess-pano: #F2A900;
  --near-mess-caos: #FF5436;

  /* Superficies e texto (claro) */
  --near-bg: #FFFFFF;
  --near-ink: #14121F;
  --near-ink-bg: #14121F;
  --near-on-ink-bg: #FFFFFF;
  --near-on-ink-bg-muted: #B9B5CC;
  --near-soft: #F3F1F8;
  --near-muted: #6E6A80;
  --near-line: #E4E0EE;
  --near-grabber: #D9D5E5;
  --near-link: #D63A22;
  --near-danger: #D93A3A;
  --near-danger-label: #FFFFFF;
  --near-tab-inactive: #B9B5CC;
  --near-chevron: #9C98B0;
  --near-scrim: rgba(20, 18, 31, 0.55);
  --near-bar-empty: rgba(20, 18, 31, 0.12);

  /* Tints e textos sobre tint (claro) */
  --near-t-tomato: #FFE5DF;
  --near-t-mint: #DDF6EE;
  --near-t-grape: #EEE9FF;
  --near-t-sky: #E3EEFF;
  --near-t-sun: #FFF4D1;
  --near-on-tomato: #B5301A;
  --near-on-mint: #0E6B4F;
  --near-on-grape: #5136C9;
  --near-on-sky: #1F56B8;
  --near-on-sun-tint: #7A5600;

  /* Tipografia */
  --near-font-title: "Fredoka", system-ui, sans-serif; /* usar peso 500 */
  --near-font-body: "Nunito", system-ui, sans-serif;   /* pesos 400, 500, 600 (nunca acima de 600) */

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

  /* Raios */
  --near-radius-small: 10px;
  --near-radius-control: 20px;
  --near-radius-card: 26px;
  --near-radius-tile: 28px;
  --near-radius-hero: 36px;
  --near-radius-sheet: 40px;
  --near-radius-pill: 999px;

  /* Sombras */
  --near-shadow-tab-bar: 0 8px 18px rgba(20, 18, 31, 0.22);
  --near-shadow-action-bar: 0 12px 30px rgba(20, 18, 31, 0.3);
  --near-shadow-toast: 0 8px 20px rgba(20, 18, 31, 0.3);
  --near-shadow-floating: 0px 2px 10px rgba(20, 18, 31, 0.22);
  --near-shadow-segment: 0 2px 8px rgba(20, 18, 31, 0.12);

  /* Alvos de toque e alturas */
  --near-touch-min: 44px;
  --near-button-hero: 64px;
  --near-button-compact: 56px;
  --near-chip-height: 44px;
  --near-field-height: 58px;
  --near-search-height: 56px;
  --near-tab-bar-height: 68px;

  /* Layout */
  --near-bp-tablet: 700px;
  --near-bp-wide: 1024px;
  --near-gutter: 16px;
  --near-content-max: 1100px;
  --near-reading-max: 680px;
  --near-sheet-max: 560px;
  --near-bar-max: 560px;
}

@media (min-width: 700px) { :root { --near-gutter: 24px; } }
@media (min-width: 1024px) { :root { --near-gutter: 32px; } }

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --near-bg: #0F0E17;
    --near-ink: #F4F2FA;
    --near-ink-bg: #2A2740;
    --near-on-ink-bg: #FFFFFF;
    --near-on-ink-bg-muted: #B9B5CC;
    --near-soft: #1E1C2B;
    --near-muted: #A6A2B8;
    --near-line: #34304A;
    --near-grabber: #403B5C;
    --near-link: #FF8A73;
    --near-danger: #FF7A7A;
    --near-danger-label: #14121F;
    --near-tab-inactive: #B9B5CC;
    --near-chevron: #7F7A98;
    --near-scrim: rgba(0, 0, 0, 0.6);
    --near-bar-empty: rgba(255, 255, 255, 0.14);
    --near-t-tomato: #3B1F1A;
    --near-t-mint: #123128;
    --near-t-grape: #251F45;
    --near-t-sky: #162944;
    --near-t-sun: #382D12;
    --near-on-tomato: #FF8A73;
    --near-on-mint: #5BD9B0;
    --near-on-grape: #B9A8FF;
    --near-on-sky: #8DBBFF;
    --near-on-sun-tint: #FFD567;
    --near-shadow-segment: none;
  }
}

:root[data-theme="dark"] {
  --near-bg: #0F0E17;
  --near-ink: #F4F2FA;
  --near-ink-bg: #2A2740;
  --near-on-ink-bg: #FFFFFF;
  --near-on-ink-bg-muted: #B9B5CC;
  --near-soft: #1E1C2B;
  --near-muted: #A6A2B8;
  --near-line: #34304A;
  --near-grabber: #403B5C;
  --near-link: #FF8A73;
  --near-danger: #FF7A7A;
  --near-danger-label: #14121F;
  --near-tab-inactive: #B9B5CC;
  --near-chevron: #7F7A98;
  --near-scrim: rgba(0, 0, 0, 0.6);
  --near-bar-empty: rgba(255, 255, 255, 0.14);
  --near-t-tomato: #3B1F1A;
  --near-t-mint: #123128;
  --near-t-grape: #251F45;
  --near-t-sky: #162944;
  --near-t-sun: #382D12;
  --near-on-tomato: #FF8A73;
  --near-on-mint: #5BD9B0;
  --near-on-grape: #B9A8FF;
  --near-on-sky: #8DBBFF;
  --near-on-sun-tint: #FFD567;
  --near-shadow-segment: none;
}
