/**
 * Asas POS Design System — Brand Tokens
 * Unified identity by Yellowzed across public, admin, shop, billing, and onboarding.
 * Canonical --asas-* tokens; --rb-* aliases preserved for legacy surfaces.
 */

:root {
    /* ── Primary (Gold — mockup palette) ── */
    --asas-primary-700: #8f7348;
    --asas-primary-600: #9c825a;
    --asas-primary-500: #a68b5b;
    --asas-primary-400: #b89a6e;
    --asas-primary-300: #d4c4a8;
    --asas-primary-200: #ebe3d4;
    --asas-primary-100: #f2ece4;
    --asas-primary: var(--asas-primary-500);

    /* ── Secondary (Slate) ── */
    --asas-secondary-700: #0f172a;
    --asas-secondary-600: #1e293b;
    --asas-secondary-500: #334155;
    --asas-secondary-400: #475569;
    --asas-secondary-300: #64748b;
    --asas-secondary-200: #94a3b8;
    --asas-secondary-100: #cbd5e1;
    --asas-secondary: var(--asas-secondary-600);

    /* ── Accent ── */
    --asas-accent: #1e293b;
    --asas-accent-dark: #0f172a;
    --asas-accent-light: #334155;
    --asas-accent-soft: #f1f5f9;
    --asas-accent-warm: #f6efe5;

    /* ── Semantic ── */
    --asas-success: #10b981;
    --asas-success-soft: #d1fae5;
    --asas-warning: #f59e0b;
    --asas-warning-soft: #fef3c7;
    --asas-danger: #ef4444;
    --asas-danger-soft: #fee2e2;
    --asas-info: #0369a1;
    --asas-info-soft: #e0f2fe;

    /* ── Surfaces ── */
    --asas-bg: #f9f7f2;
    --asas-bg-warm: #f6efe5;
    --asas-surface: #ffffff;
    --asas-surface-raised: #ffffff;
    --asas-border: #e8e2d8;
    --asas-border-strong: #d9d0c4;
    --asas-muted: #9e978e;
    --asas-text: #1a1a1a;
    --asas-text-secondary: #5c574f;

    /* ── Spacing scale ── */
    --asas-space-1: 4px;
    --asas-space-2: 8px;
    --asas-space-3: 12px;
    --asas-space-4: 16px;
    --asas-space-5: 24px;
    --asas-space-6: 32px;
    --asas-space-7: 48px;
    --asas-space-8: 64px;

    /* ── Radius ── */
    --asas-radius-sm: 8px;
    --asas-radius-md: 12px;
    --asas-radius-lg: 16px;
    --asas-radius-xl: 24px;
    --asas-radius-pill: 999px;

    /* ── Shadows ── */
    --asas-shadow-subtle: 0 1px 3px rgba(15, 23, 42, 0.04);
    --asas-shadow-card: 0 4px 24px rgba(15, 23, 42, 0.06);
    --asas-shadow-floating: 0 12px 40px rgba(15, 23, 42, 0.1);
    --asas-shadow-modal: 0 24px 64px rgba(15, 23, 42, 0.16);

    /* ── Typography ── */
    --asas-font-ar: "Lusail", "Inter", "Segoe UI", Tahoma, sans-serif;
    --asas-font-en: "Lusail", "Inter", system-ui, sans-serif;
    --asas-font-family: var(--asas-font-en);

    /* ── Motion ── */
    --asas-transition-fast: 150ms ease;
    --asas-transition: 200ms ease;
    --asas-transition-slow: 250ms ease;
    --asas-ease-out: cubic-bezier(0.22, 1, 0.36, 1);

    /* ── Layout ── */
    --asas-header-h: 72px;
    --asas-header-h-scrolled: 64px;
    --asas-sidebar-w: 270px;
    --asas-content-max: 1320px;
    --asas-content-wide: 1440px;

    /* ── Brand aliases (runtime theme override compatible) ── */
    --asas-brand: var(--theme-color, var(--asas-primary));
    --asas-brand-hover: var(--asas-primary-600);
    --asas-brand-soft: var(--asas-primary-100);
    --asas-brand-glow: rgba(184, 138, 68, 0.12);

    /* ── Dynamic theme (JS from General Settings) ── */
    --theme-color: var(--asas-primary);
    --theme-hover-bg: var(--asas-secondary-100);
    --theme-color-rgb: 184, 138, 68;
}

[dir="rtl"] {
    --asas-font-family: var(--asas-font-ar);
}

/* ── Dark mode preparation (tokens only, not enabled) ── */
.asas-dark-mode,
[data-theme="dark"] {
    --asas-bg: #0f172a;
    --asas-bg-warm: #1e293b;
    --asas-surface: #1e293b;
    --asas-surface-raised: #334155;
    --asas-border: #334155;
    --asas-border-strong: #475569;
    --asas-text: #f8fafc;
    --asas-text-secondary: #cbd5e1;
    --asas-muted: #94a3b8;
    --asas-primary-100: #1e293b;
    --asas-primary-200: #334155;
    --asas-brand-soft: rgba(184, 138, 68, 0.15);
    --asas-brand-glow: rgba(184, 138, 68, 0.2);
    --asas-shadow-subtle: 0 1px 3px rgba(0, 0, 0, 0.25);
    --asas-shadow-card: 0 4px 24px rgba(0, 0, 0, 0.35);
    --asas-shadow-floating: 0 12px 40px rgba(0, 0, 0, 0.45);
    --asas-shadow-modal: 0 24px 64px rgba(0, 0, 0, 0.55);
    --asas-success-soft: rgba(16, 185, 129, 0.2);
    --asas-warning-soft: rgba(245, 158, 11, 0.2);
    --asas-danger-soft: rgba(239, 68, 68, 0.2);
    --asas-info-soft: rgba(3, 105, 161, 0.2);
}

/* ── Legacy rb-* backward compatibility (maps to asas-*) ── */
:root {
    --rb-gold-700: var(--asas-primary-700);
    --rb-gold-600: var(--asas-primary-600);
    --rb-gold-500: var(--asas-primary-500);
    --rb-gold-400: var(--asas-primary-400);
    --rb-gold-300: var(--asas-primary-300);
    --rb-gold-200: var(--asas-primary-200);
    --rb-gold-100: var(--asas-primary-100);

    --rb-chocolate: var(--asas-accent);
    --rb-chocolate-dark: var(--asas-accent-dark);
    --rb-chocolate-light: var(--asas-accent-light);
    --rb-chocolate-soft: var(--asas-accent-soft);

    --rb-rose-600: var(--asas-secondary-400);
    --rb-rose-500: var(--asas-secondary-300);
    --rb-rose-400: var(--asas-secondary-300);
    --rb-rose-300: var(--asas-secondary-200);
    --rb-rose-200: var(--asas-secondary-100);
    --rb-rose-100: var(--asas-bg-warm);
    --rb-rose-50: var(--asas-bg);

    --rb-cream: var(--asas-bg);
    --rb-white: var(--asas-surface);
    --rb-border-color: var(--asas-border);
    --body-color: var(--asas-bg);
    --rb-workspace: var(--asas-bg);
    --rb-workspace-warm: var(--asas-bg-warm);

    --rb-brand: var(--asas-primary);
    --rb-brand-hover: var(--asas-primary-600);
    --rb-brand-deep: var(--asas-primary-700);
    --rb-brand-light: var(--asas-secondary-300);
    --rb-brand-soft: var(--asas-primary-100);
    --rb-brand-muted: var(--asas-secondary-200);
    --rb-brand-bright: var(--asas-primary-400);
    --rb-brand-glow: var(--asas-brand-glow);
    --rb-brand-focus: rgba(184, 138, 68, 0.08);

    --rb-gold: var(--asas-primary);
    --rb-gold-light: var(--asas-primary-400);
    --rb-gold-soft: var(--asas-primary-200);
    --rb-gold-deep: var(--asas-primary-700);
    --rb-gold-glow: rgba(184, 138, 68, 0.22);

    --rb-success: var(--asas-success);
    --rb-success-light: var(--asas-success-soft);
    --rb-danger: var(--asas-danger);
    --rb-danger-light: var(--asas-danger-soft);
    --rb-warning: var(--asas-warning);
    --rb-warning-light: var(--asas-warning-soft);
    --rb-info: var(--asas-info);
    --rb-info-light: var(--asas-info-soft);

    --rb-text-primary: var(--asas-text);
    --rb-text-secondary: var(--asas-text-secondary);
    --rb-text-muted: var(--asas-muted);
    --rb-text-label: var(--asas-muted);
    --rb-text-inverse: #ffffff;

    --rb-surface: rgba(255, 255, 255, 0.92);
    --rb-surface-solid: var(--asas-surface);
    --rb-surface-muted: var(--asas-bg);
    --rb-surface-subtle: var(--asas-bg-warm);
    --rb-border: var(--asas-border);
    --rb-border-soft: rgba(226, 232, 240, 0.65);
    --rb-border-strong: var(--asas-border-strong);

    --rb-neutral-50: var(--asas-bg);
    --rb-neutral-100: var(--asas-bg-warm);
    --rb-neutral-200: var(--asas-border);
    --rb-neutral-500: var(--asas-muted);
    --rb-neutral-700: var(--asas-secondary-500);
    --rb-neutral-800: var(--asas-secondary-600);
    --rb-neutral-900: var(--asas-accent);

    /* Sidebar — dark navy mockup palette */
    --sidebar-bg: #11161d;
    --sidebar-gold: #fdb022;
    --sidebar-gold-dark: #ffb347;
    --sidebar-gold-light: #fdb022;
    --sidebar-icon: rgba(255, 255, 255, 0.55);
    --sidebar-icon-muted: rgba(255, 255, 255, 0.35);
    --sidebar-cream: #11161d;
    --sidebar-surface: #11161d;
    --sidebar-accent: #fdb022;
    --sidebar-accent-soft: rgba(253, 176, 34, 0.12);
    --sidebar-text: #ffffff;
    --sidebar-text-muted: rgba(255, 255, 255, 0.55);
    --sidebar-text-active: #ffffff;
    --sidebar-border: #1e2832;
    --sidebar-icon-bg: transparent;
    --sidebar-icon-bg-active: transparent;
    --sidebar-pink-soft: rgba(80, 65, 44, 0.55);
    --sidebar-pink-active: #50412c;
    --sidebar-pink-badge: rgba(253, 176, 34, 0.15);
    --sidebar-badge-text: #fdb022;
    --sidebar-collapse-bg: rgba(255, 255, 255, 0.06);
    --sidebar-collapse-border: rgba(255, 255, 255, 0.1);
}