/**
 * Main App Styles v26.6 — Atmos Core + Geo-Radius Update
 * Фичи: iOS 17 Depth, Geo-Filter Glass UI, Boost Logic, Notification Toast Engine
 * Путь: assets/css/main-v26.css
 * Синхронизация: group_696765f738935 [cite: 2026-03-03]
 * Исправления: Оптимизация GPU-отрисовки, фикс темной темы для карт, Safe Areas.
 */

/* --- EXTENDED ROOT --- */
:root {
    --ios-bg: #000000;
    --ios-card: #1c1c1e;
    --ios-accent: #0A84FF;
    --ios-curve: cubic-bezier(0.32, 0.72, 0, 1);
    
    /* Статусы модерации и точек [cite: 2026-02-01] */
    --status-active: #32D74B;
    --status-pending: #FFD60A;
    --status-rejected: #FF453A;
    --status-archived: #8E8E93;
    
    /* Boost & Premium (Dynamic Gold) */
    --boost-gold: #FFD700;
    --boost-glow: rgba(255, 215, 0, 0.28);
    --boost-gradient: linear-gradient(135deg, #FFD700 0%, #FF9500 100%);
    
    /* Специфично для списков */
    --list-divider: rgba(255, 255, 255, 0.08);
    
    /* Glass & Blur Specifics */
    --glass-bg: rgba(255, 255, 255, 0.05);
    --glass-border: rgba(255, 255, 255, 0.1);
    
    /* Безопасные зоны (PWA/Safari/iOS Native) */
    --sab: env(safe-area-inset-bottom, 20px);
    --sat: env(safe-area-inset-top, 44px);
    --sal: env(safe-area-inset-left, 0px);
    --sar: env(safe-area-inset-right, 0px);
}

/* --- iOS DEPTH ENGINE (Advanced) --- */
body {
    background: var(--ios-bg);
    margin: 0;
    padding: 0;
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-smoothing: grayscale;
    color: #fff;
    overscroll-behavior-y: none; /* Кастомный pull-to-refresh ready */
    overflow-x: hidden;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
}

#page {
    will-change: transform, border-radius;
    backface-visibility: hidden;
    transition: transform 0.6s var(--ios-curve), filter 0.6s var(--ios-curve), border-radius 0.6s var(--ios-curve);
    min-height: 100vh;
    background: var(--ios-bg);
    z-index: 1;
    position: relative;
}

/* Эффект погружения при открытии модалок (iOS 17 Look) */
body.modal-open {
    overflow: hidden;
    background: #000;
}

body.modal-open #page {
    transform: scale(0.93) translateY(calc(var(--sat) + 8px));
    border-radius: 44px;
    overflow: hidden;
    filter: brightness(0.55) blur(1px);
    pointer-events: none;
    box-shadow: 0 0 50px rgba(0,0,0,0.8);
}

/* --- GEO-FILTER COMPONENT (Silver Glass) --- */
.geo-filter-container {
    display: flex;
    background: var(--glass-bg);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border: 0.5px solid var(--glass-border);
    border-radius: 14px;
    padding: 4px;
    gap: 4px;
    width: fit-content;
    margin: 12px auto;
    z-index: 100;
    position: relative;
}

.geo-filter-btn {
    background: transparent;
    border: none;
    color: rgba(255, 255, 255, 0.5);
    padding: 8px 14px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: -0.2px;
    cursor: pointer;
    transition: all 0.4s var(--ios-curve);
    outline: none;
}

.geo-filter-btn:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
}

.geo-filter-btn.active {
    background: var(--ios-accent);
    color: #fff;
    box-shadow: 0 4px 15px rgba(10, 132, 255, 0.4);
    transform: scale(1.02);
}

/* --- TOAST NOTIFICATIONS (Smart Banner) --- */
.dt-toast-notification {
    position: fixed;
    top: calc(var(--sat) + 12px);
    left: 14px;
    right: 14px;
    background: rgba(30, 30, 32, 0.82);
    backdrop-filter: blur(30px) saturate(190%);
    -webkit-backdrop-filter: blur(30px) saturate(190%);
    border-radius: 24px;
    padding: 16px 20px;
    z-index: 15000;
    border: 0.5px solid rgba(255,255,255,0.12);
    box-shadow: 0 20px 45px rgba(0,0,0,0.55);
    transform: translateY(-180%) scale(0.9);
    transition: transform 0.65s var(--ios-curve), opacity 0.4s ease;
    opacity: 0;
}

.dt-toast-notification.is-active {
    transform: translateY(0) scale(1);
    opacity: 1;
}

.dt-toast-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 6px;
}

.dt-toast-title {
    font-weight: 700;
    font-size: 15px;
    letter-spacing: -0.3px;
    color: var(--ios-accent);
}

.dt-toast-time {
    font-size: 11px;
    font-weight: 600;
    color: var(--status-archived);
}

.dt-toast-body {
    font-size: 14.5px;
    line-height: 1.45;
    color: rgba(255, 255, 255, 0.92);
}

.dt-toast-progress {
    position: absolute;
    bottom: 0;
    left: 24px;
    right: 24px;
    height: 3px;
    background: var(--ios-accent);
    border-radius: 3px;
    transform: scaleX(0);
    transform-origin: left;
}

.is-active .dt-toast-progress {
    animation: toast-progress 5s linear forwards;
}

@keyframes toast-progress {
    from { transform: scaleX(1); }
    to { transform: scaleX(0); }
}

/* --- КАРТОЧКА ТОЧКИ & BOOST (group_696765f738935) --- */
.card-tochka {
    position: relative;
    background: var(--ios-card);
    border-radius: 28px;
    padding: 18px;
    margin-bottom: 16px;
    border: 1px solid var(--list-divider);
    transition: transform 0.25s var(--ios-curve), box-shadow 0.25s ease;
    overflow: hidden;
    will-change: transform;
}

.card-tochka:active {
    transform: scale(0.97);
}

/* Оптимистичное удаление с затуханием */
.card-tochka.is-deleting {
    transform: translateX(110%) scale(0.9);
    opacity: 0;
    max-height: 0;
    margin-bottom: 0;
    padding: 0;
    pointer-events: none;
    transition: all 0.6s var(--ios-curve);
}

/* Boost Logic: Dynamic Glow & Shine */
.card-tochka.is-boosted {
    border: 1px solid rgba(255, 215, 0, 0.45);
    box-shadow: 0 12px 40px var(--boost-glow);
    background: linear-gradient(180deg, #1c1c1e 0%, #2a2a2d 100%);
}

.card-tochka.is-boosted::after {
    content: '';
    position: absolute;
    top: -100%; left: -150%; 
    width: 300%; height: 300%;
    background: linear-gradient(
        45deg, 
        transparent 45%, 
        rgba(255, 215, 0, 0.15) 50%, 
        rgba(255, 255, 255, 0.08) 52%, 
        rgba(255, 215, 0, 0.15) 54%, 
        transparent 60%
    );
    transform: rotate(25deg);
    animation: boost-shine 5s cubic-bezier(0.4, 0, 0.2, 1) infinite;
    pointer-events: none;
}

@keyframes boost-shine {
    0% { transform: translate(-30%, -30%) rotate(25deg); }
    30%, 100% { transform: translate(30%, 30%) rotate(25deg); }
}

/* --- УПРАВЛЕНИЕ УЧАСТНИКАМИ --- */
.participants-list { display: flex; flex-direction: column; gap: 10px; }
.p-card {
    background: #242426;
    border-radius: 22px;
    padding: 14px 18px;
    display: flex;
    align-items: center;
    gap: 14px;
    border: 1px solid rgba(255, 255, 255, 0.05);
    transition: transform 0.2s ease, background 0.2s ease;
}

.p-card.is-loading {
    opacity: 0.6;
    filter: saturate(0.5) blur(1px);
    pointer-events: none;
}

/* Таймеры ожидания (Pending Status) */
.timer-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 12px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 800;
    background: rgba(255, 214, 10, 0.15);
    color: var(--status-pending);
    letter-spacing: 0.03em;
}
.timer-badge.expired { 
    background: rgba(255, 69, 58, 0.18); 
    color: var(--status-rejected); 
}

/* --- BADGE SYSTEM --- */
.badge-container { position: relative; display: inline-block; }
.badge-dot {
    position: absolute;
    top: -4px;
    right: -4px;
    background: var(--status-rejected);
    color: white;
    font-size: 11px;
    font-weight: 800;
    min-width: 20px;
    height: 20px;
    padding: 0 5px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2.5px solid var(--ios-bg);
    transform: scale(0);
    transition: transform 0.45s var(--ios-curve);
    pointer-events: none;
    z-index: 10;
}
.badge-dot.show { transform: scale(1); }

/* --- MODERATION STATUS PILLS --- */
.moderation-status-pill {
    padding: 5px 14px;
    border-radius: 22px;
    font-size: 12px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.status-approved { background: rgba(50, 215, 75, 0.14); color: var(--status-active); }
.status-pending { background: rgba(255, 214, 10, 0.14); color: var(--status-pending); }
.status-rejected { background: rgba(255, 69, 58, 0.14); color: var(--status-rejected); }

/* --- КНОПКИ (iOS Atmos Edition) --- */
.ios-btn {
    width: 100%;
    background: var(--ios-accent);
    color: #fff;
    border-radius: 20px;
    padding: 18px 24px;
    font-size: 17px;
    font-weight: 600;
    border: none;
    cursor: pointer;
    transition: all 0.3s var(--ios-curve);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.ios-btn:active { transform: scale(0.95); filter: brightness(0.9); }
.ios-btn-secondary { background: #2c2c2e; color: #fff; }
.ios-btn-danger { background: #FF3B30; color: #fff; }
.ios-btn:disabled { opacity: 0.4; filter: grayscale(1); pointer-events: none; }

/* Спиннер загрузки внутри кнопок */
.spinner-ios {
    width: 20px; height: 20px;
    border: 2.5px solid rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    border-top-color: #fff;
    animation: ios-spin 0.9s linear infinite;
}

@keyframes ios-spin { 
    to { transform: rotate(360deg); } 
}

/* --- GLASS & BLUR --- */
.glass-panel {
    background: rgba(28, 28, 30, 0.72);
    backdrop-filter: blur(25px) saturate(190%);
    -webkit-backdrop-filter: blur(25px) saturate(190%);
    border: 0.5px solid var(--list-divider);
    border-radius: 24px;
}

/* Фикс для темной темы Яндекс Карт */
[class*="ymaps-2"][class*="-map"] {
    filter: invert(100%) hue-rotate(180deg) brightness(95%) contrast(90%);
}

/* --- KEYBOARD HANDLING --- */
.keyboard-is-open .tab-bar, 
.keyboard-is-open .ios-btn-fixed {
    opacity: 0;
    transform: translateY(100px);
    pointer-events: none;
}

/* --- UTILS --- */
.text-dim { color: var(--status-archived); }
.text-accent { color: var(--ios-accent); }
.animate-pop { animation: pop 0.4s var(--ios-curve) forwards; }

@keyframes pop {
    0% { transform: scale(0.85); opacity: 0; filter: blur(4px); }
    100% { transform: scale(1); opacity: 1; filter: blur(0); }
}

* { -webkit-tap-highlight-color: transparent; outline: none; }

/* --- КРИТИЧЕСКИЙ КИЛЛЕР СТАРОЙ СИСТЕМЫ УВЕДОМЛЕНИЙ --- */
/* Скрываем сам контейнер, все вложенные элементы и любые старые уведомления */
#notifications-container, 
#notifications-container *,
.notification-toast,
.notification-wrapper,
[id^="notification-"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    pointer-events: none !important;
    position: fixed !important;
    left: -9999px !important; /* Выбрасываем за пределы видимости */
    z-index: -1 !important;
}