﻿/* =====================================================================
   ReadyIlish — design tokens
   Shared by the storefront, account, auth and admin templates.
   ===================================================================== */

:root {
    /* Brand palette (TEMPLATES_PROMPT.md Part B) */
    --c-primary: #0B4F6C;
    --c-primary-dark: #083A50;
    --c-secondary: #CBD5DC;
    --c-accent: #F2A93B;
    --c-success: #1E9E6A;
    --c-danger: #D64545;
    --c-bg: #F7FAFC;
    --c-surface: #FFFFFF;
    --c-text: #1F2933;
    --c-muted: #6B7C8A;

    /* Extended tints (derived, same hue family) */
    --c-primary-soft: #E7F1F5;
    --c-primary-100: #D3E5EC;
    --c-accent-soft: #FDF3E2;
    --c-success-soft: #E4F5EE;
    --c-danger-soft: #FBEAEA;
    --c-line: #E2E8ED;
    --c-line-strong: #CBD5DC;
    --c-footer-text: #BFD3DC;

    /* Typography */
    --font-body: "Hind Siliguri", "Noto Sans Bengali", system-ui, -apple-system, "Segoe UI", sans-serif;
    --fs-body: 1rem;          /* 16px */
    --fs-small: .875rem;      /* 14px */
    --fs-xs: .78125rem;       /* 12.5px */
    --fs-h1: clamp(1.75rem, 4vw, 2rem);
    --fs-h2: clamp(1.375rem, 3vw, 1.5rem);
    --fs-h3: clamp(1.125rem, 2.4vw, 1.25rem);
    --lh-body: 1.6;
    --lh-tight: 1.25;

    /* Shape & elevation */
    --radius-sm: 8px;
    --radius: 10px;
    --radius-lg: 14px;
    --radius-pill: 999px;
    --shadow-sm: 0 2px 8px rgba(8, 58, 80, .06);
    --shadow: 0 10px 28px rgba(8, 58, 80, .10);
    --shadow-lg: 0 18px 46px rgba(8, 58, 80, .16);

    /* Spacing */
    --space-1: .25rem;
    --space-2: .5rem;
    --space-3: .75rem;
    --space-4: 1rem;
    --space-5: 1.5rem;
    --space-6: 2rem;
    --space-7: 3rem;
    --space-8: 4rem;

    /* Layout */
    --container-max: 1200px;
    --container-pad: 1rem;
    --header-height: 64px;
    --bottom-nav-height: 60px;

    /* Motion */
    --transition: .18s ease;
}
