/* =========================================================
   TOKENS DA LOJA — escopados em #loja para não colidir
   com as variáveis globais de style.css (:root)
   Fonte: referencia-design-loja/tokens/*.css
========================================================= */
#loja {
    --loja-ivory-50: #FFFDFA;
    --loja-ivory-100: #FAF7F2;
    --loja-ivory-200: #F3EEE4;
    --loja-ivory-300: #E8E2D6;
    --loja-ivory-400: #D4CBB9;

    --loja-ink-900: #12172E;
    --loja-ink-800: #1B1F3A;
    --loja-ink-700: #2A2E4A;
    --loja-ink-500: #5A5F7A;
    --loja-ink-400: #8B8FA5;
    --loja-ink-300: #B8BACB;

    --loja-purple-900: #3C2A5C;
    --loja-purple-700: #5A3F87;
    --loja-purple-500: #6B4E9F;
    --loja-purple-300: #B8A3D4;
    --loja-purple-100: #EDE5F5;

    --loja-gold-700: #8F6E2C;
    --loja-gold-600: #A88940;
    --loja-gold-500: #C9A961;
    --loja-gold-400: #D9BF83;
    --loja-gold-200: #F1E4C0;
    --loja-gold-100: #F8EFD6;

    --loja-rose-500: #C97A8A;
    --loja-rose-100: #F7E6EA;

    --loja-success-500: #4E8E6E;
    --loja-danger-500: #B4444E;

    --loja-font-display: "Cormorant Garamond", "Playfair Display", Georgia, serif;
    --loja-font-sans: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;

    --loja-sp-1: 4px;
    --loja-sp-2: 8px;
    --loja-sp-3: 12px;
    --loja-sp-4: 16px;
    --loja-sp-5: 20px;
    --loja-sp-6: 24px;
    --loja-sp-7: 32px;
    --loja-sp-8: 40px;
    --loja-sp-9: 48px;

    --loja-r-sm: 8px;
    --loja-r-md: 12px;
    --loja-r-lg: 16px;
    --loja-r-xl: 20px;
    --loja-r-2xl: 28px;
    --loja-r-full: 999px;

    --loja-shadow-sm: 0 2px 6px rgba(27, 31, 58, 0.06);
    --loja-shadow-md: 0 6px 16px rgba(27, 31, 58, 0.08);
    --loja-shadow-lg: 0 14px 32px rgba(27, 31, 58, 0.10);
    --loja-shadow-gold: 0 6px 20px rgba(201, 169, 97, 0.28);

    --loja-ease-standard: cubic-bezier(0.2, 0.7, 0.2, 1);
    --loja-ease-emphasize: cubic-bezier(0.16, 1, 0.3, 1);
    --loja-dur-fast: 120ms;
    --loja-dur-base: 200ms;
    --loja-dur-slow: 320ms;

    /* Papéis semânticos */
    --loja-bg-app: var(--loja-ivory-100);
    --loja-surface-card: #FFFFFF;
    --loja-text-primary: var(--loja-ink-800);
    --loja-text-body: var(--loja-ink-700);
    --loja-text-muted: var(--loja-ink-500);
    --loja-border-subtle: var(--loja-ivory-300);
    --loja-tag-bg: var(--loja-purple-100);
    --loja-tag-fg: var(--loja-purple-700);
    --loja-price-color: var(--loja-ink-800);
}
