/*
 * Arsvoim Design V3 — production token layer.
 * Source: approved Phase 1 design package, normalised for the existing PHP UI.
 * This file contains no page selectors and can become the single visual source
 * of truth for later account, messenger and role-dashboard migrations.
 */
:root {
    --av3-white: #fff;
    --av3-apple-ink: #000;
    --av3-credit-label-size: 18px;
    --av3-store-ink-height: 44px;
    --av3-store-canvas-wide: 65.4762px;
    --av3-store-canvas-compact: 57.2917px;
    --av3-device-width: 252px;
    --av3-device-height: 480px;
    --av3-device-radius: 42px;
    --av3-device-frame: #b7c0d5;
    --av3-device-shadow: 0 28px 56px rgba(16,24,40,.22), 0 6px 16px rgba(16,24,40,.12);
    --av3-device-halo: radial-gradient(ellipse,rgba(109,94,245,.2),rgba(59,124,252,.1) 55%,transparent 72%);

    --av3-canvas: #f7f8fd;
    --av3-canvas-soft: #f1f5ff;
    --av3-surface: #fff;
    --av3-surface-soft: #f8fafc;
    --av3-navy-950: #0a1128;
    --av3-navy-900: #101828;
    --av3-navy-800: #172033;
    --av3-slate-700: #344054;
    --av3-slate-600: #475467;
    --av3-slate-500: #667085;
    --av3-slate-400: #98a2b3;
    --av3-slate-300: #d0d5dd;
    --av3-slate-200: #e4e7ec;
    --av3-slate-100: #f0f2f6;
    --av3-violet-700: #4536be;
    --av3-violet-600: #5847e0;
    --av3-violet-500: #6d5ef5;
    --av3-violet-400: #8b7cff;
    --av3-blue-600: #2a63d6;
    --av3-blue-500: #3b7cfc;
    --av3-blue-400: #5c93ff;
    --av3-green-700: #087a46;
    --av3-green-600: #0f9d5a;
    --av3-green-100: #e7f8ef;
    --av3-amber-700: #945000;
    --av3-amber-100: #fff3e0;
    --av3-red-600: #d92d20;
    --av3-red-100: #feebe9;

    --av3-brand-gradient: linear-gradient(100deg, #6d5ef5 0%, #4d63eb 52%, #1498e8 100%);
    --av3-control-gradient: linear-gradient(135deg, var(--av3-violet-600), var(--av3-blue-600));
    --av3-hero-gradient:
        radial-gradient(circle at 77% 26%, rgba(20, 152, 232, .12), transparent 28%),
        radial-gradient(circle at 26% 22%, rgba(109, 94, 245, .12), transparent 31%),
        linear-gradient(145deg, #fff 0%, #f6f7ff 56%, #f0f8ff 100%);

    --av3-control-min: 44px;
    --av3-preferences-panel-width: 320px;
    --av3-preferences-mobile-top: 76px;
    --av3-catalog-thumb: 80px;
    --av3-text-caption: .75rem;
    --av3-text-small: .875rem;
    --av3-text-value: 1.125rem;
    --av3-font-mono: ui-monospace, SFMono-Regular, Consolas, monospace;

    --av3-font: Inter, "Noto Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --av3-font-georgian: "Noto Sans Georgian", var(--av3-font);
    --av3-font-armenian: "Noto Sans Armenian", var(--av3-font);
    --av3-font-arabic: "Noto Sans Arabic", var(--av3-font);
    --av3-font-cjk: "Noto Sans SC", "Noto Sans JP", var(--av3-font);

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

    --av3-radius-sm: 8px;
    --av3-radius-md: 12px;
    --av3-radius-lg: 16px;
    --av3-radius-xl: 24px;
    --av3-radius-pill: 999px;

    --av3-border: #e4e7ec;
    --av3-border-strong: #d0d5dd;
    --av3-shadow-xs: 0 1px 2px rgba(16, 24, 40, .05);
    --av3-shadow-sm: 0 4px 12px rgba(16, 24, 40, .07);
    --av3-shadow-md: 0 16px 42px rgba(16, 24, 40, .11);
    --av3-focus: 0 0 0 3px rgba(109, 94, 245, .28);
    --av3-container: 1200px;
    --av3-gutter: clamp(16px, 3vw, 32px);
    /* Total inline trim shared by the homepage's primary content track. */
    --av3-home-content-trim: 112px;
    --av3-transition: 180ms cubic-bezier(.2, 0, 0, 1);

    /* Compatibility aliases used by the existing brand-v2 components. */
    --arsvoim-brand-ink: var(--av3-navy-900);
    --arsvoim-brand-muted: var(--av3-slate-600);
    --arsvoim-brand-line: var(--av3-border);
    --arsvoim-brand-violet: var(--av3-violet-500);
    --arsvoim-brand-blue: var(--av3-blue-500);
    --arsvoim-brand-gradient: var(--av3-brand-gradient);

}

html[lang="ka"] { --av3-font-current: var(--av3-font-georgian); }
html[lang="hy"] { --av3-font-current: var(--av3-font-armenian); }
html[lang="ar"] { --av3-font-current: var(--av3-font-arabic); }
html[lang="zh"],
html[lang="ja"] { --av3-font-current: var(--av3-font-cjk); }
html:not([lang="ka"]):not([lang="hy"]):not([lang="ar"]):not([lang="zh"]):not([lang="ja"]) {
    --av3-font-current: var(--av3-font);
}

@media (max-width: 1180px) {
    :root { --av3-home-content-trim: 56px; }
}

@media (max-width: 740px) {
    :root { --av3-home-content-trim: 28px; }
}

@media (prefers-reduced-motion: reduce) {
    :root {
        --av3-transition: 0ms linear;
    }
}
