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

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

    --pds-ink: var(--MFText, #2A2C31);
    --pds-ink-2: #434A54;
    --pds-ink-3: #5F707F; /* не --MFTextSecondary: там #2a2c31 */
    --pds-ink-4: #98A6AD;

    /* пары фон/текст бейджей — из PaydaSectionStyles */
    --pds-success: #389E0D;
    --pds-success-bg: rgba(82, 196, 26, .12);
    --pds-info: #2D8DC1;
    --pds-info-bg: #E5F1F8;
    --pds-warn: #A86F3E;
    --pds-warn-bg: rgba(224, 170, 122, .2);
    --pds-danger: #D9363E;
    --pds-danger-bg: rgba(255, 77, 79, .1);
    --pds-neutral: #5F707F;
    --pds-neutral-bg: #EEF4F8;
    --pds-badge: #E5484D;

    --pds-r-xs: 4px;
    --pds-r-sm: 6px;
    --pds-r: 10px;
    --pds-r-lg: 14px;

    --pds-ring: 0 0 0 3px var(--pds-primary-100);

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

    --pds-btn-h: 36px;
    --pds-btn-h-sm: 32px;
    --pds-btn-r: 10px;

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

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

html { scrollbar-gutter: stable; }

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

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

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

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

/* общий скелетон: .pds-skel на любом блоке фиксированного размера */
.pds-skel {
    border-radius: var(--pds-r-xs);
    background: linear-gradient(90deg, var(--pds-bg) 0%, #F8FAFC 50%, var(--pds-bg) 100%);
    background-size: 200% 100%;
    animation: pds-shimmer 1.4s infinite linear;
}

@media (prefers-reduced-motion: reduce) {
    /* !important: перебиваем анимации и переходы темы Hyper и пакетов, иначе их не выключить одним правилом */
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}