/* ============================================================================
   Design Tokens — Espelhando o Figma
   ============================================================================
   PRIMITIVES: valores brutos. Nunca usar diretamente nos componentes.
   SEMANTICS: tokens com propósito. Únicos a serem usados no projeto.
   Convenção: --primitives-* | --semantics-*
   ============================================================================ */

:root {
    /* ========================================================================
       PRIMITIVES
       ======================================================================== */

    /* --- Primitives / Colors / Neutrals --- */
    --primitives-colors-white: #FFFFFF;
    --primitives-colors-black: #000000;

    /* --- Primitives / Colors / Purpura --- */
    --primitives-colors-purpura-100: #F9EDFD;
    --primitives-colors-purpura-200: #EFD1FA;
    --primitives-colors-purpura-300: #E39AFE;
    --primitives-colors-purpura-400: #D25EFD;
    --primitives-colors-purpura-500: #BF17FC;
    --primitives-colors-purpura-600: #9C02D4;
    --primitives-colors-purpura-700: #7D02AA;
    --primitives-colors-purpura-800: #590179;
    --primitives-colors-purpura-900: #38014C;
    --primitives-colors-purpura-1000: #1D0227;

    /* --- Primitives / Colors / Ponkan --- */
    --primitives-colors-ponkan-100: #FFF6E5;
    --primitives-colors-ponkan-200: #FFE9C2;
    --primitives-colors-ponkan-300: #FFD68F;
    --primitives-colors-ponkan-400: #FFC052;
    --primitives-colors-ponkan-500: #FFA301;
    --primitives-colors-ponkan-600: #D68900;
    --primitives-colors-ponkan-700: #A86B00;
    --primitives-colors-ponkan-800: #7A4E00;
    --primitives-colors-ponkan-900: #4C3100;
    --primitives-colors-ponkan-1000: #291A00;

    /* --- Primitives / Colors / Pitaya --- */
    --primitives-colors-pitaya-100: #FDECF4;
    --primitives-colors-pitaya-200: #FBD0E3;
    --primitives-colors-pitaya-300: #F7ABCD;
    --primitives-colors-pitaya-400: #F062A2;
    --primitives-colors-pitaya-500: #EB2980;
    --primitives-colors-pitaya-600: #C41362;
    --primitives-colors-pitaya-700: #9A0F4D;
    --primitives-colors-pitaya-800: #700B38;
    --primitives-colors-pitaya-900: #460723;
    --primitives-colors-pitaya-1000: #250413;

    /* --- Primitives / Colors / Pistache --- */
    --primitives-colors-pistache-100: #EEFCF8;
    --primitives-colors-pistache-200: #D4F7EE;
    --primitives-colors-pistache-300: #AAEEDE;
    --primitives-colors-pistache-400: #6EE2C6;
    --primitives-colors-pistache-500: #3AD8B2;
    --primitives-colors-pistache-600: #23B390;
    --primitives-colors-pistache-700: #1C8C71;
    --primitives-colors-pistache-800: #146652;
    --primitives-colors-pistache-900: #0D4034;
    --primitives-colors-pistache-1000: #07221B;

    /* --- Primitives / Colors / Petunia --- */
    --primitives-colors-petunia-100: #F7EDFC;
    --primitives-colors-petunia-200: #EAD3F8;
    --primitives-colors-petunia-300: #D6A7F1;
    --primitives-colors-petunia-400: #B969E8;
    --primitives-colors-petunia-500: #A134E0;
    --primitives-colors-petunia-600: #801DB9;
    --primitives-colors-petunia-700: #651792;
    --primitives-colors-petunia-800: #49106A;
    --primitives-colors-petunia-900: #310B47;
    --primitives-colors-petunia-1000: #180523;

    /* --- Primitives / Colors / Gray --- */
    --primitives-colors-gray-100: #F8F7F8;
    --primitives-colors-gray-200: #EEECEE;
    --primitives-colors-gray-300: #DCD9DD;
    --primitives-colors-gray-400: #B5AEB7;
    --primitives-colors-gray-500: #8F8593;
    --primitives-colors-gray-600: #6E6572;
    --primitives-colors-gray-700: #564F59;
    --primitives-colors-gray-800: #3A353B;
    --primitives-colors-gray-900: #221F23;
    --primitives-colors-gray-1000: #121113;

    /* --- Primitives / Typography / Family --- */
    --primitives-typography-family-poppins: "Poppins", system-ui, -apple-system, sans-serif;
    --primitives-typography-family-inter: "Inter", system-ui, -apple-system, sans-serif;

    /* --- Primitives / Typography / Weight --- */
    --primitives-typography-weight-regular: 400;
    --primitives-typography-weight-medium: 500;
    --primitives-typography-weight-semibold: 600;
    --primitives-typography-weight-bold: 700;

    /* --- Primitives / Typography / Size (escala Figma) --- */
    --primitives-typography-size-1: 10px;
    --primitives-typography-size-2: 12px;
    --primitives-typography-size-3: 14px;
    --primitives-typography-size-4: 16px;
    --primitives-typography-size-5: 18px;
    --primitives-typography-size-6: 20px;
    --primitives-typography-size-7: 24px;
    --primitives-typography-size-8: 28px;
    --primitives-typography-size-9: 32px;
    --primitives-typography-size-10: 36px;
    --primitives-typography-size-11: 40px;
    --primitives-typography-size-12: 44px;
    --primitives-typography-size-13: 48px;
    --primitives-typography-size-14: 52px;
    --primitives-typography-size-15: 56px;

    /* --- Primitives / Typography / Tracking --- */
    --primitives-typography-tracking-none: 0;
    --primitives-typography-tracking-tight-1: -0.5px;
    --primitives-typography-tracking-tight-2: -1px;
    --primitives-typography-tracking-wide-1: 0.5px;
    --primitives-typography-tracking-wide-2: 1px;

    /* --- Primitives / Typography / Baseline (line-height multipliers) --- */
    --primitives-typography-baseline-tight: 1.2;
    --primitives-typography-baseline-snug: 1.4;
    --primitives-typography-baseline-normal: 1.5;

    /* --- Primitives / Dimensions (escala numérica) --- */
    --primitives-dimensions-0: 0;
    --primitives-dimensions-1: 1px;
    --primitives-dimensions-2: 2px;
    --primitives-dimensions-4: 4px;
    --primitives-dimensions-8: 8px;
    --primitives-dimensions-12: 12px;
    --primitives-dimensions-16: 16px;
    --primitives-dimensions-20: 20px;
    --primitives-dimensions-24: 24px;
    --primitives-dimensions-32: 32px;
    --primitives-dimensions-40: 40px;
    --primitives-dimensions-48: 48px;
    --primitives-dimensions-56: 56px;
    --primitives-dimensions-64: 64px;
    --primitives-dimensions-72: 72px;
    --primitives-dimensions-80: 80px;
    --primitives-dimensions-96: 96px;
    --primitives-dimensions-120: 120px;
    --primitives-dimensions-160: 160px;
    --primitives-dimensions-full: 9999px;

    /* --- Primitives / Thickness (espessura de bordas) --- */
    --primitives-thickness-0: 0;
    --primitives-thickness-1: 1px;
    --primitives-thickness-2: 2px;
    --primitives-thickness-3: 3px;
    --primitives-thickness-4: 4px;
    --primitives-thickness-6: 6px;
    --primitives-thickness-8: 8px;

    /* --- Primitives / Motion --- */
    --primitives-motion-duration-fast: 0.15s;
    --primitives-motion-duration-base: 0.2s;
    --primitives-motion-duration-slow: 0.3s;
    --primitives-motion-easing-standard: ease;

    /* ========================================================================
       SEMANTICS — únicos a serem usados nos componentes do projeto
       ======================================================================== */

    /* --- Semantics / Colors / Fill / Background --- */
    --semantics-colors-fill-background-primary: var(--primitives-colors-white);
    --semantics-colors-fill-background-secondary: var(--primitives-colors-gray-100);

    /* --- Semantics / Colors / Fill / Brand --- */
    --semantics-colors-fill-primary: var(--primitives-colors-purpura-700);
    --semantics-colors-fill-primary-subtle: var(--primitives-colors-purpura-100);
    --semantics-colors-fill-secondary: var(--primitives-colors-ponkan-500);
    --semantics-colors-fill-secondary-subtle: var(--primitives-colors-ponkan-100);
    --semantics-colors-fill-neutral: var(--primitives-colors-white);
    --semantics-colors-fill-neutral-subtle: var(--primitives-colors-gray-100);
    --semantics-colors-fill-neutral-strong: var(--primitives-colors-gray-200);

    /* --- Semantics / Colors / Fill / Accent --- */
    --semantics-colors-fill-accent-purpura: var(--primitives-colors-purpura-700);
    --semantics-colors-fill-accent-purpura-subtle: var(--primitives-colors-purpura-100);
    --semantics-colors-fill-accent-ponkan: var(--primitives-colors-ponkan-500);
    --semantics-colors-fill-accent-ponkan-subtle: var(--primitives-colors-ponkan-100);
    --semantics-colors-fill-accent-pitaya: var(--primitives-colors-pitaya-600);
    --semantics-colors-fill-accent-pitaya-subtle: var(--primitives-colors-pitaya-100);
    --semantics-colors-fill-accent-pistache: var(--primitives-colors-pistache-500);
    --semantics-colors-fill-accent-pistache-subtle: var(--primitives-colors-pistache-100);
    --semantics-colors-fill-accent-petunia: var(--primitives-colors-petunia-900);
    --semantics-colors-fill-accent-petunia-subtle: var(--primitives-colors-petunia-100);

    /* --- Semantics / Colors / Fill / Decorative (variações de tom) --- */
    --semantics-colors-fill-decorative-purpura-500: var(--primitives-colors-purpura-500);
    --semantics-colors-fill-decorative-pitaya-400: var(--primitives-colors-pitaya-400);
    --semantics-colors-fill-decorative-pistache-500: var(--primitives-colors-pistache-500);

    /* --- Semantics / Colors / Fill / Feedback --- */
    --semantics-colors-fill-feedback-info: var(--primitives-colors-purpura-600);
    --semantics-colors-fill-feedback-info-subtle: var(--primitives-colors-purpura-100);
    --semantics-colors-fill-feedback-positive: var(--primitives-colors-pistache-600);
    --semantics-colors-fill-feedback-positive-subtle: var(--primitives-colors-pistache-100);
    --semantics-colors-fill-feedback-warning: var(--primitives-colors-ponkan-500);
    --semantics-colors-fill-feedback-warning-subtle: var(--primitives-colors-ponkan-100);
    --semantics-colors-fill-feedback-danger: var(--primitives-colors-pitaya-600);
    --semantics-colors-fill-feedback-danger-subtle: var(--primitives-colors-pitaya-100);

    /* --- Semantics / Colors / Fill / Interactive --- */
    --semantics-colors-fill-interactive-primary-hover: var(--primitives-colors-purpura-800);
    --semantics-colors-fill-interactive-primary-pressed: var(--primitives-colors-purpura-900);
    --semantics-colors-fill-interactive-primary-subtle-hover: var(--primitives-colors-purpura-200);
    --semantics-colors-fill-interactive-primary-subtle-pressed: var(--primitives-colors-purpura-300);
    --semantics-colors-fill-interactive-secondary-hover: var(--primitives-colors-ponkan-600);
    --semantics-colors-fill-interactive-secondary-pressed: var(--primitives-colors-ponkan-700);
    --semantics-colors-fill-interactive-neutral-hover: var(--primitives-colors-gray-100);
    --semantics-colors-fill-interactive-disabled: var(--primitives-colors-gray-100);

    /* --- Semantics / Colors / Fill / Overlay --- */
    --semantics-colors-fill-overlay-light: var(--primitives-colors-white);
    --semantics-colors-fill-overlay-dark: var(--primitives-colors-gray-1000);

    /* --- Semantics / Colors / Stroke --- */
    --semantics-colors-stroke-primary: var(--primitives-colors-gray-200);
    --semantics-colors-stroke-secondary: var(--primitives-colors-gray-300);
    --semantics-colors-stroke-strong: var(--primitives-colors-gray-500);
    --semantics-colors-stroke-accent-purpura: var(--primitives-colors-purpura-700);
    --semantics-colors-stroke-accent-ponkan: var(--primitives-colors-ponkan-500);
    --semantics-colors-stroke-accent-pitaya: var(--primitives-colors-pitaya-400);
    --semantics-colors-stroke-accent-pistache: var(--primitives-colors-pistache-500);
    --semantics-colors-stroke-accent-petunia: var(--primitives-colors-petunia-900);
    --semantics-colors-stroke-feedback-info: var(--primitives-colors-purpura-700);
    --semantics-colors-stroke-feedback-positive: var(--primitives-colors-pistache-700);
    --semantics-colors-stroke-feedback-warning: var(--primitives-colors-ponkan-700);
    --semantics-colors-stroke-feedback-danger: var(--primitives-colors-pitaya-700);
    --semantics-colors-stroke-interactive-hover: var(--primitives-colors-gray-400);
    --semantics-colors-stroke-interactive-pressed: var(--primitives-colors-gray-500);
    --semantics-colors-stroke-interactive-disabled: var(--primitives-colors-gray-100);
    --semantics-colors-stroke-interactive-focus: var(--primitives-colors-purpura-700);

    /* --- Semantics / Colors / Text --- */
    --semantics-colors-text-primary: var(--primitives-colors-gray-900);
    --semantics-colors-text-secondary: var(--primitives-colors-gray-600);
    --semantics-colors-text-tertiary: var(--primitives-colors-gray-400);
    --semantics-colors-text-muted: var(--primitives-colors-gray-500);
    --semantics-colors-text-on-dark: var(--primitives-colors-white);
    --semantics-colors-text-heading-default: var(--primitives-colors-gray-1000);
    --semantics-colors-text-heading-secondary: var(--primitives-colors-petunia-800);
    --semantics-colors-text-heading-accent: var(--primitives-colors-purpura-700);
    --semantics-colors-text-accent-purpura: var(--primitives-colors-purpura-700);
    --semantics-colors-text-accent-ponkan: var(--primitives-colors-ponkan-500);
    --semantics-colors-text-accent-pitaya: var(--primitives-colors-pitaya-400);
    --semantics-colors-text-accent-pistache: var(--primitives-colors-pistache-500);
    --semantics-colors-text-accent-petunia: var(--primitives-colors-petunia-900);
    --semantics-colors-text-feedback-info: var(--primitives-colors-purpura-700);
    --semantics-colors-text-feedback-positive: var(--primitives-colors-pistache-700);
    --semantics-colors-text-feedback-warning: var(--primitives-colors-ponkan-900);
    --semantics-colors-text-feedback-danger: var(--primitives-colors-pitaya-700);
    --semantics-colors-text-interactive-disabled: var(--primitives-colors-gray-300);
    --semantics-colors-text-interactive-link-default: var(--primitives-colors-purpura-700);
    --semantics-colors-text-interactive-link-hover: var(--primitives-colors-purpura-600);
    --semantics-colors-text-interactive-link-visited: var(--primitives-colors-petunia-900);
    --semantics-colors-text-interactive-accent-purpura-hover: var(--primitives-colors-purpura-600);
    --semantics-colors-text-interactive-accent-purpura-pressed: var(--primitives-colors-purpura-800);

    /* --- Semantics / Colors / Icon --- */
    --semantics-colors-icon-primary: var(--primitives-colors-gray-900);
    --semantics-colors-icon-on-dark: var(--primitives-colors-white);
    --semantics-colors-icon-accent-purpura: var(--primitives-colors-purpura-700);
    --semantics-colors-icon-accent-ponkan: var(--primitives-colors-ponkan-500);
    --semantics-colors-icon-accent-pitaya: var(--primitives-colors-pitaya-400);
    --semantics-colors-icon-accent-pistache: var(--primitives-colors-pistache-500);
    --semantics-colors-icon-accent-petunia: var(--primitives-colors-petunia-900);

    /* --- Semantics / Typography (aliases para primitives) --- */
    --semantics-typography-family-poppins: var(--primitives-typography-family-poppins);
    --semantics-typography-family-inter: var(--primitives-typography-family-inter);

    --semantics-typography-weight-regular: var(--primitives-typography-weight-regular);
    --semantics-typography-weight-medium: var(--primitives-typography-weight-medium);
    --semantics-typography-weight-semibold: var(--primitives-typography-weight-semibold);
    --semantics-typography-weight-bold: var(--primitives-typography-weight-bold);

    /* Display/Heading/Body/Label — nomes dos Text Styles do Figma */
    --semantics-typography-label-10: var(--primitives-typography-size-1);
    --semantics-typography-label-12: var(--primitives-typography-size-2);
    --semantics-typography-label-14: var(--primitives-typography-size-3);
    --semantics-typography-body-14: var(--primitives-typography-size-3);
    --semantics-typography-body-16: var(--primitives-typography-size-4);
    --semantics-typography-body-18: var(--primitives-typography-size-5);
    --semantics-typography-heading-x-small: var(--primitives-typography-size-6);
    --semantics-typography-heading-small: var(--primitives-typography-size-7);
    --semantics-typography-heading-medium: var(--primitives-typography-size-8);
    --semantics-typography-heading-large: var(--primitives-typography-size-9);
    --semantics-typography-heading-x-large: var(--primitives-typography-size-10);
    --semantics-typography-heading-xx-large: var(--primitives-typography-size-11);
    --semantics-typography-display-48: var(--primitives-typography-size-13);

    --semantics-typography-tracking-none: var(--primitives-typography-tracking-none);
    --semantics-typography-tracking-tight-1: var(--primitives-typography-tracking-tight-1);
    --semantics-typography-tracking-tight-2: var(--primitives-typography-tracking-tight-2);

    --semantics-typography-baseline-tight: var(--primitives-typography-baseline-tight);
    --semantics-typography-baseline-snug: var(--primitives-typography-baseline-snug);
    --semantics-typography-baseline-normal: var(--primitives-typography-baseline-normal);

    /* --- Semantics / Spacing (gap, margin) — aliases para Dimensions --- */
    --semantics-spacing-hairline: var(--primitives-dimensions-1);
    --semantics-spacing-micro: var(--primitives-dimensions-2);
    --semantics-spacing-tiny: var(--primitives-dimensions-4);
    --semantics-spacing-small: var(--primitives-dimensions-8);
    --semantics-spacing-medium: var(--primitives-dimensions-12);
    --semantics-spacing-large: var(--primitives-dimensions-16);
    --semantics-spacing-larger: var(--primitives-dimensions-20);
    --semantics-spacing-bigger: var(--primitives-dimensions-24);
    --semantics-spacing-big: var(--primitives-dimensions-32);
    --semantics-spacing-wide: var(--primitives-dimensions-40);
    --semantics-spacing-wider: var(--primitives-dimensions-48);
    --semantics-spacing-broad: var(--primitives-dimensions-64);
    --semantics-spacing-vast: var(--primitives-dimensions-80);
    --semantics-spacing-giant: var(--primitives-dimensions-96);
    --semantics-spacing-massive: var(--primitives-dimensions-120);

    /* --- Semantics / Padding (padding interno) — aliases para Dimensions --- */
    --semantics-padding-tiny: var(--primitives-dimensions-4);
    --semantics-padding-small: var(--primitives-dimensions-8);
    --semantics-padding-medium: var(--primitives-dimensions-12);
    --semantics-padding-large: var(--primitives-dimensions-16);
    --semantics-padding-larger: var(--primitives-dimensions-24);
    --semantics-padding-big: var(--primitives-dimensions-32);
    --semantics-padding-bigger: var(--primitives-dimensions-40);
    --semantics-padding-wide: var(--primitives-dimensions-48);
    --semantics-padding-wider: var(--primitives-dimensions-64);
    --semantics-padding-broad: var(--primitives-dimensions-80);
    --semantics-padding-vast: var(--primitives-dimensions-96);
    --semantics-padding-massive: var(--primitives-dimensions-120);
    --semantics-padding-maximum: var(--primitives-dimensions-160);

    /* --- Semantics / Radius — aliases para Dimensions --- */
    --semantics-radius-small: var(--primitives-dimensions-4);
    --semantics-radius-medium: var(--primitives-dimensions-8);
    --semantics-radius-large: var(--primitives-dimensions-12);
    --semantics-radius-larger: var(--primitives-dimensions-16);
    --semantics-radius-bigger: var(--primitives-dimensions-20);
    --semantics-radius-big: var(--primitives-dimensions-24);
    --semantics-radius-full: var(--primitives-dimensions-full);

    /* --- Semantics / Stroke — aliases para Thickness --- */
    --semantics-stroke-thin: var(--primitives-thickness-1);
    --semantics-stroke-default: var(--primitives-thickness-2);
    --semantics-stroke-medium: var(--primitives-thickness-3);
    --semantics-stroke-thick: var(--primitives-thickness-4);
    --semantics-stroke-heavy: var(--primitives-thickness-6);

    /* --- Semantics / Opacity (valores diretos com nomes do Figma) --- */
    --semantics-opacity-softest: 0.15;
    --semantics-opacity-soft: 0.20;
    --semantics-opacity-light: 0.30;
    --semantics-opacity-gentle: 0.35;
    --semantics-opacity-muted: 0.40;
    --semantics-opacity-subdued: 0.45;
    --semantics-opacity-medium: 0.50;
    --semantics-opacity-partial: 0.60;
    --semantics-opacity-visible: 0.65;
    --semantics-opacity-strong: 0.70;
    --semantics-opacity-bold: 0.80;
    --semantics-opacity-heavy: 0.85;
    --semantics-opacity-solid: 0.90;
    --semantics-opacity-full: 1;

    /* --- Semantics / Motion --- */
    --semantics-motion-duration-fast: var(--primitives-motion-duration-fast);
    --semantics-motion-duration-base: var(--primitives-motion-duration-base);
    --semantics-motion-duration-slow: var(--primitives-motion-duration-slow);
    --semantics-motion-easing-standard: var(--primitives-motion-easing-standard);

    /* --- Semantics / Layout --- */
    --semantics-container-max: 1361px;
    --semantics-touch-target-min: 44px;

    /* --- Semantics / z-index --- */
    --semantics-z-sticky: 100;
    --semantics-z-dropdown: 200;
    --semantics-z-modal: 300;

    /* --- Semantics / Shadow / Gray --- */
    --semantics-shadow-gray-1: 0 1px 2px rgba(34, 31, 35, 0.07), 0 2px 4px rgba(34, 31, 35, 0.07);
    --semantics-shadow-gray-2: 0 1px 2px rgba(34, 31, 35, 0.07), 0 2px 4px rgba(34, 31, 35, 0.07), 0 4px 8px rgba(34, 31, 35, 0.07);
    --semantics-shadow-gray-3: 0 1px 2px rgba(34, 31, 35, 0.07), 0 2px 4px rgba(34, 31, 35, 0.07), 0 4px 8px rgba(34, 31, 35, 0.07), 0 8px 16px rgba(34, 31, 35, 0.07);
    --semantics-shadow-gray-4: 0 1px 2px rgba(34, 31, 35, 0.07), 0 2px 4px rgba(34, 31, 35, 0.07), 0 4px 8px rgba(34, 31, 35, 0.07), 0 8px 16px rgba(34, 31, 35, 0.07), 0 16px 32px rgba(34, 31, 35, 0.07);

    /* --- Semantics / Shadow / Petunia --- */
    --semantics-shadow-petunia-1: 0 1px 2px rgba(49, 11, 71, 0.07), 0 2px 4px rgba(49, 11, 71, 0.07);
    --semantics-shadow-petunia-2: 0 1px 2px rgba(49, 11, 71, 0.07), 0 2px 4px rgba(49, 11, 71, 0.07), 0 4px 8px rgba(49, 11, 71, 0.07);
    --semantics-shadow-petunia-3: 0 1px 2px rgba(49, 11, 71, 0.07), 0 2px 4px rgba(49, 11, 71, 0.07), 0 4px 8px rgba(49, 11, 71, 0.07), 0 8px 16px rgba(49, 11, 71, 0.07);
    --semantics-shadow-petunia-4: 0 1px 2px rgba(49, 11, 71, 0.07), 0 2px 4px rgba(49, 11, 71, 0.07), 0 4px 8px rgba(49, 11, 71, 0.07), 0 8px 16px rgba(49, 11, 71, 0.07), 0 16px 32px rgba(49, 11, 71, 0.07);
}