/*
 * INFINITE RENOVATIONS - Design Tokens
 * Source of truth: All App Portals (Admin, Worker, Customer)
 * V3: Warm Cream, Terracotta & Espresso — LOCKED
 * Updated: Feb 10, 2026
 *
 * DEV MODE: tokens.css v2.0
 */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

:root {
    /* ========================================
       COLORS - V3 Warm Palette
       Espresso dark, terracotta accent, warm cream text
       ======================================== */

    /* Backgrounds (Warm Espresso) */
    --bg-primary: #2B2520;        /* Espresso — main app background */
    --bg-card: #352F28;           /* Warm card surface */
    --bg-hover: #3D352E;          /* Warm hover states */
    --bg-input: #241F1A;          /* Deep espresso — form inputs */

    /* Borders (Warm Cream-based) */
    --border-color: rgba(250, 243, 225, 0.08);    /* Default border */
    --border-light: rgba(250, 243, 225, 0.12);    /* Lighter border variant */

    /* Text (Warm Cream — never pure white) */
    --text-primary: #FAF3E1;      /* Warm cream headings */
    --text-secondary: #C4B8A8;    /* Warm muted body text */
    --text-tertiary: #8A8078;     /* Warm gray — even more muted */

    /* Brand Colors (Terracotta) */
    --blue-primary: #D4845A;      /* Terracotta — primary action */
    --blue-hover: #C07248;        /* Terracotta hover state */

    /* Status Colors (PRESERVED — functional, not brand) */
    --green-success: #43DFA7;     /* Success, on-time, positive */
    --orange-warning: #FF9832;    /* Warning, waiting, caution */
    --red-danger: #FF7683;        /* Danger, late, negative */
    --purple-info: #9945FF;       /* Info, scheduled, neutral */
    --teal-accent: #72F044;       /* Accent, complete */

    /* ========================================
       TYPOGRAPHY — Inter (Premium)
       ======================================== */

    /* Font Families */
    --font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;
    --font-heading: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;

    /* Font Sizes */
    --text-xs: 11px;
    --text-sm: 12px;
    --text-base: 13px;
    --text-md: 14px;
    --text-lg: 16px;
    --text-xl: 18px;
    --text-2xl: 22px;
    --text-3xl: 24px;
    --text-4xl: 28px;
    --text-5xl: 32px;
    --text-6xl: 36px;

    /* Font Weights */
    --font-normal: 400;
    --font-medium: 500;
    --font-semibold: 600;
    --font-bold: 700;

    /* Line Heights */
    --leading-tight: 1.25;
    --leading-normal: 1.5;
    --leading-relaxed: 1.6;

    /* ========================================
       SPACING
       ======================================== */

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

    /* ========================================
       BORDER RADIUS — Sharp Corners (Infinite DNA)
       ======================================== */

    --radius-sm: 0;
    --radius-md: 0;
    --radius-lg: 0;
    --radius-xl: 0;
    --radius-2xl: 0;
    --radius-3xl: 0;
    --radius-full: 0;

    /* ========================================
       SHADOWS — Warm Espresso Base
       ======================================== */

    --shadow-sm: 0 1px 2px rgba(43, 37, 32, 0.20);
    --shadow-md: 0 4px 12px rgba(43, 37, 32, 0.25);
    --shadow-lg: 0 8px 24px rgba(43, 37, 32, 0.30);
    --shadow-xl: 0 12px 32px rgba(43, 37, 32, 0.35);

    /* ========================================
       TRANSITIONS
       ======================================== */

    --transition-fast: 0.15s ease;
    --transition-normal: 0.2s ease;
    --transition-slow: 0.3s ease;

    /* ========================================
       Z-INDEX SCALE
       ======================================== */

    --z-base: 1;
    --z-dropdown: 10;
    --z-sticky: 50;
    --z-fixed: 100;
    --z-modal-backdrop: 900;
    --z-modal: 1000;
    --z-tooltip: 1100;
}

/* ========================================
   BASE RESET
   ======================================== */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    font-size: 16px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    font-family: var(--font-primary);
    background: var(--bg-primary);
    color: var(--text-primary);
    line-height: var(--leading-normal);
    overflow-x: hidden;
}

/* ========================================
   DEV MODE BANNER
   ======================================== */

.dev-banner {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background: linear-gradient(90deg, var(--red-danger), var(--orange-warning));
    color: var(--text-primary);
    text-align: center;
    padding: var(--space-2) var(--space-4);
    font-size: var(--text-sm);
    font-weight: var(--font-bold);
    z-index: var(--z-tooltip);
    letter-spacing: 1px;
}

.dev-banner + * {
    margin-top: 32px; /* Push content below banner */
}