/*
 * Modern: палітра світлої теми, акцент — синій (поверх Radzen standard-base.css).
 * Підключається компонентом ModernTheme лише для теми "standard". Форма, типографіка
 * й правила компонентів лежать у modern-common.css, тут тільки кольори.
 *
 * Radzen не виводить варіанти кольору автоматично: -light/-lighter/-dark/-darker
 * і on-* задаються явно для кожного кольору.
 *
 * Акцент синій і живе не лише в блоці "Бренд": його відтінки продубльовані літералами
 * в --rs-ring, --rs-sidebar-active-bg, --rz-grid-selected-background-color,
 * --rz-series-1 / --rz-series-17. Міняти акцент — міняти всі ці місця (див. README набору).
 */
:root {
    color-scheme: light;

    /* ---- Нейтральна шкала (холодний сірий). 50 = найсвітліший ---- */
    --rz-white: #ffffff;
    --rz-black: #000000;
    --rz-base-50: #ffffff;
    --rz-base-100: #f5f7fa;
    --rz-base-200: #eaeef3;
    --rz-base-300: #d7dde5;
    --rz-base-400: #bfc7d2;
    --rz-base-500: #98a1b0;
    --rz-base-600: #6b7483;
    --rz-base-700: #4b5463;
    --rz-base-800: #2b3240;
    --rz-base-900: #151a23;
    --rz-base: var(--rz-base-300);
    --rz-base-light: var(--rz-base-200);
    --rz-base-lighter: var(--rz-base-100);
    --rz-base-dark: var(--rz-base-700);
    --rz-base-darker: var(--rz-base-900);
    --rz-on-base: var(--rz-base-900);
    --rz-on-base-light: var(--rz-base-900);
    --rz-on-base-lighter: var(--rz-base-900);
    --rz-on-base-dark: #ffffff;
    --rz-on-base-darker: #ffffff;

    /* ---- Бренд: акцент синій. Див. перелік місць у шапці файлу ---- */
    --rz-primary: #2563eb;
    --rz-primary-light: #3b82f6;
    --rz-primary-lighter: rgba(37, 99, 235, 0.1);
    --rz-primary-dark: #1d4ed8;
    --rz-primary-darker: #1e40af;
    --rz-on-primary: #ffffff;
    --rz-on-primary-light: #ffffff;
    --rz-on-primary-lighter: #1d4ed8;
    --rz-on-primary-dark: #ffffff;
    --rz-on-primary-darker: #ffffff;

    --rz-secondary: #6366f1;
    --rz-secondary-light: #818cf8;
    --rz-secondary-lighter: rgba(99, 102, 241, 0.12);
    --rz-secondary-dark: #4f46e5;
    --rz-secondary-darker: #4338ca;
    --rz-on-secondary: #ffffff;
    --rz-on-secondary-light: #ffffff;
    --rz-on-secondary-lighter: #4338ca;
    --rz-on-secondary-dark: #ffffff;
    --rz-on-secondary-darker: #ffffff;

    /* ---- Семантичні ---- */
    --rz-info: #0ea5e9;
    --rz-info-light: #38bdf8;
    --rz-info-lighter: rgba(14, 165, 233, 0.12);
    --rz-info-dark: #0284c7;
    --rz-info-darker: #0369a1;
    --rz-on-info: #ffffff;
    --rz-on-info-light: #ffffff;
    --rz-on-info-lighter: #0369a1;
    --rz-on-info-dark: #ffffff;
    --rz-on-info-darker: #ffffff;

    --rz-success: #059669;
    --rz-success-light: #10b981;
    --rz-success-lighter: rgba(5, 150, 105, 0.12);
    --rz-success-dark: #047857;
    --rz-success-darker: #065f46;
    --rz-on-success: #ffffff;
    --rz-on-success-light: #ffffff;
    --rz-on-success-lighter: #047857;
    --rz-on-success-dark: #ffffff;
    --rz-on-success-darker: #ffffff;

    /* Білий текст на жовтому нечитабельний — у Radzen так і є поза WCAG. Тут темний. */
    --rz-warning: #f59e0b;
    --rz-warning-light: #fbbf24;
    --rz-warning-lighter: rgba(245, 158, 11, 0.14);
    --rz-warning-dark: #d97706;
    --rz-warning-darker: #b45309;
    --rz-on-warning: #1f2937;
    --rz-on-warning-light: #1f2937;
    --rz-on-warning-lighter: #b45309;
    --rz-on-warning-dark: #ffffff;
    --rz-on-warning-darker: #ffffff;

    --rz-danger: #dc2626;
    --rz-danger-light: #ef4444;
    --rz-danger-lighter: rgba(220, 38, 38, 0.1);
    --rz-danger-dark: #b91c1c;
    --rz-danger-darker: #991b1b;
    --rz-on-danger: #ffffff;
    --rz-on-danger-light: #ffffff;
    --rz-on-danger-lighter: #b91c1c;
    --rz-on-danger-dark: #ffffff;
    --rz-on-danger-darker: #ffffff;

    /* ---- Поверхні й текст ---- */
    --rz-body-background-color: var(--rz-base-100);
    --rz-base-background-color: var(--rz-white);
    --rz-text-title-color: var(--rz-base-900);
    --rz-text-color: var(--rz-base-800);
    --rz-text-secondary-color: var(--rz-base-700);
    --rz-text-tertiary-color: var(--rz-base-600);
    --rz-text-disabled-color: var(--rz-base-500);
    --rz-link-color: var(--rz-primary);
    --rz-link-hover-color: var(--rz-primary-dark);

    /* ---- Власні токени шару (використовуються в modern-common.css) ---- */
    --rs-surface: var(--rz-white);
    --rs-surface-muted: var(--rz-base-100);
    --rs-surface-hover: #f1f4f8;
    --rs-border: var(--rz-base-200);
    --rs-border-strong: var(--rz-base-300);
    --rs-border-hover: var(--rz-base-400);
    --rs-ring: rgba(37, 99, 235, 0.25);
    --rs-tooltip-bg: var(--rz-base-900);
    --rs-sidebar-bg: var(--rz-white);
    --rs-sidebar-color: var(--rz-base-800);
    --rs-sidebar-muted: var(--rz-base-600);
    --rs-sidebar-hover: var(--rz-base-100);
    --rs-sidebar-active-bg: rgba(37, 99, 235, 0.1);
    --rs-sidebar-active-color: var(--rz-primary-dark);
    --rs-mask: rgba(15, 23, 42, 0.45);
    --rs-shadow-xs: 0 1px 2px rgba(16, 24, 40, 0.05);
    --rs-shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.06), 0 1px 3px rgba(16, 24, 40, 0.08);
    --rs-shadow-md: 0 4px 8px -2px rgba(16, 24, 40, 0.08), 0 2px 4px -2px rgba(16, 24, 40, 0.05);
    --rs-shadow-lg: 0 12px 24px -6px rgba(16, 24, 40, 0.12), 0 4px 8px -4px rgba(16, 24, 40, 0.06);
    --rs-shadow-xl: 0 24px 48px -12px rgba(16, 24, 40, 0.22);

    /* ---- Аліаси: цих змінних Radzen не визначає, але на них часто посилається власний css
            застосунку. Без них спрацьовували б світлі fallback'и і в темній темі ---- */
    --rz-border-color: var(--rs-border);
    --rz-surface: var(--rs-surface-muted);
    --rz-panel-border: 1px solid var(--rs-border);
    --rz-input-border-color: var(--rs-border-strong);

    /* ---- Літерали Radzen, прибиті до старого синього/сірого ---- */
    --rz-input-focus-shadow: 0 0 0 3px var(--rs-ring);
    --rz-grid-selected-background-color: rgba(37, 99, 235, 0.08);
    --rz-grid-stripe-background-color: #f8fafc;
    --rz-panel-menu-item-active-indicator: var(--rz-primary);
    --rz-button-base-background-color: var(--rz-base-200);
    --rz-button-base-color: var(--rz-base-800);
    --rz-validator-shadow: 0 6px 14px 0 rgba(220, 38, 38, 0.25);
    --rz-scrollbar-color: rgba(107, 116, 131, 0.35);
    --rz-series-1: #3b82f6;
    --rz-series-17: #2563eb;
}

/* Сайдбар у світлій темі світлий. Іконки меню з інлайн-кольором Colors.White / "--rz-white"
   (IconColor, Style) або білі svg у <img> на ньому не видно — не задавати їм білий колір,
   лишати дефолт (колір бере токен --rz-panel-menu-icon-color). */

/* ButtonStyle.Light + Text/Outlined у standard фарбується base-200 — задумано для
   темного фону, на білому кнопки фактично невидимі. Тут вони читаються на світлому. */
.rz-button.rz-variant-text.rz-light {
    color: var(--rz-text-secondary-color);
}

.rz-button.rz-variant-outlined.rz-light.rz-shade-default {
    box-shadow: inset 0 0 0 var(--rz-border-width) var(--rs-border-strong);
    color: var(--rz-text-secondary-color);
}

@media (hover: hover) and (pointer: fine) {
    .rz-button.rz-variant-text.rz-light:not(.rz-state-disabled):hover,
    .rz-button.rz-variant-outlined.rz-light:not(.rz-state-disabled):hover {
        background-color: var(--rs-surface-hover);
        color: var(--rz-text-title-color);
    }
}

.rz-button.rz-variant-text.rz-light:not(.rz-state-disabled):active,
.rz-button.rz-variant-outlined.rz-light:not(.rz-state-disabled):active {
    background-color: var(--rs-surface-hover);
}