/* ===== WEBAPP THEME CONFIGURATION ===== */
/* Единый пульт управления настраиваемыми параметрами WebApp */

:root {
    /* ===== ОТСТУПЫ И ПРОМЕЖУТКИ ===== */
    --edge-padding: 12px;              /* Внешний padding по периметру контейнера */
    --card-gap: 12px;                  /* Расстояние между карточками/блоками */
    --nav-padding: 12px;               /* Padding кнопок навигации */

    /* ===== РАЗМЕРЫ НАВИГАЦИИ ===== */
    --nav-height: 48px;                /* Высота верхней и нижней панели навигации */
    --nav-font-size: 15px;             /* Размер шрифта кнопок навигации */
    --nav-font-weight: 600;             /* Толщина шрифта кнопок навигации */

    /* ===== РАЗМЕРЫ КАРТОЧЕК ===== */
    --card-min-height: 120px;          /* Минимальная высота карточки (MIN_READABLE в JS) */
    --card-border-radius: 12px;         /* Радиус скругления карточек */
    --card-padding: 16px;              /* Внутренний padding карточки */

    /* ===== РАЗМЕРЫ КНОПОК ===== */
    --btn-padding: 12px 24px;          /* Padding кнопок */
    --btn-border-radius: 8px;          /* Радиус скругления кнопок */
    --btn-font-size: 14px;             /* Размер шрифта кнопок */

    /* ===== BUILD BADGE (временно, потом можно удалить) ===== */
    --badge-top: 64px;                 /* Позиция сверху (ниже верхней зоны Telegram Desktop) */
    --badge-right: 8px;                /* Позиция справа */
    --badge-z-index: 999999;           /* Z-index для гарантии видимости */
    --badge-font-size: 12px;           /* Размер шрифта */
    --badge-padding: 2px 6px;          /* Padding */
    --badge-border-radius: 6px;        /* Радиус скругления */

    /* ===== Z-INDEX СЛОИ ===== */
    --z-nav: 100;                      /* Z-index навигации */
    --z-overlay: 1000;                 /* Z-index оверлеев */
    --z-modal: 10000;                  /* Z-index модальных окон */

    /* ===== АНИМАЦИИ ===== */
    --transition-fast: 0.2s ease;      /* Быстрая анимация (кнопки, hover) */
    --transition-normal: 0.3s ease;    /* Обычная анимация */
    --transition-slow: 0.5s ease;      /* Медленная анимация */

    /* ===== КОНТЕЙНЕРЫ ===== */
    --container-max-width: 100%;       /* Максимальная ширина контейнера */
    --container-min-height: 0;         /* Минимальная высота контейнера */

    /* ===== ОПАСНОСТИ (стандартные константы, обычно не меняются) ===== */
    --opacity-active: 0.8;             /* Opacity при активном состоянии (нажатие) */
}