/* Дизайн-токены Sauda. Палитра — та же --MF*, что в core bootstrap.css (payda, qalqannext),
   здесь только роли и то, чего в --MF* нет. Цвет напрямую в стилях не пишем — только через --sd-*. */
:root {
    --sd-primary: var(--MFPrimary, #006196);
    --sd-primary-hover: #004B75;
    --sd-primary-50: #E5F1F8;
    --sd-primary-100: #CBE2F0;
    --sd-link: var(--MFLink, #2D8DC1);

    --sd-bg: var(--MFBg, #EEF4F8);
    --sd-surface: #FFFFFF;
    --sd-border: var(--MFBorder, #D2D7E3);
    --sd-hair: #E7EEF4;
    --sd-zebra: #F4F9FC;
    --sd-hover: #E9F3FC;
    --sd-muted-bg: #EEF2F7;

    --sd-ink: var(--MFText, #2A2C31);
    --sd-ink-2: #434A54;
    --sd-ink-3: var(--MFSecondary, #5F707F);
    --sd-ink-4: #98A6AD;

    --sd-success: #389E0D;
    --sd-success-bg: rgba(82, 196, 26, .12);
    --sd-warn: #A86F3E;
    --sd-warn-bg: rgba(224, 170, 122, .2);
    --sd-danger: #D9363E;
    --sd-danger-bg: rgba(255, 77, 79, .1);
    --sd-badge: #E5484D;

    --sd-r-xs: 4px;
    --sd-r-sm: 6px;
    --sd-r: 10px;
    --sd-r-lg: 14px;
    --sd-r-pill: 999px;

    --sd-shadow-sm: 0 1px 2px rgba(0, 40, 70, .06);
    --sd-shadow: 0 1px 2px rgba(0, 40, 70, .08);
    --sd-shadow-hover: 0 6px 18px rgba(0, 40, 70, .10);
    --sd-shadow-pop: 0 16px 48px -12px rgba(0, 40, 70, .28);
    --sd-ring: 0 0 0 3px var(--sd-primary-100);

    --sd-font: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
    --sd-mono: ui-monospace, SFMono-Regular, Consolas, monospace;

    --sd-ease: cubic-bezier(.16, 1, .3, 1);
    --sd-t-fast: .12s;
    --sd-t: .15s;
    --sd-t-pop: .18s;

    --sd-container: 1600px;
    --sd-topbar-h: 64px;
    --sd-menubar-h: 48px;
}

@keyframes sd-pop-in {
    from { opacity: 0; transform: translateY(6px) scale(.98); }
}

@keyframes sd-fade-in {
    from { opacity: 0; }
}

@keyframes sd-content-in {
    from { opacity: 0; transform: translateY(4px); }
}

@keyframes sd-shimmer {
    from { background-position: 100% 0; }
    to { background-position: 0 0; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}
