/* ===================================
   BLAZORSCORE - MOBILE RESPONSIVE CSS
   Version: 1.0
   =================================== */

/* ===== MOBILE FIRST APPROACH ===== */

/* Скрываем боковую панель на мобильных устройствах */
@media (max-width: 767px) {
    .modern-sidebar {
        display: none !important;
    }
    
    /* Показываем кнопку мобильного меню на мобильных */
    .mobile-menu-toggle {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 40px !important;
        height: 40px !important;
        border-radius: 8px !important;
        border: 1px solid var(--border-color) !important;
        background: var(--bg-secondary) !important;
    }
    
    /* Явно показываем чекбокс Only Live на мобильных */
    #live-toggle {
        -webkit-appearance: checkbox !important;
        appearance: auto !important;
        display: inline-block !important;
        width: 18px !important;
        height: 18px !important;
        vertical-align: middle !important;
        accent-color: #dc3545; /* красный в тон LIVE */
    }
    
    /* Контейнер чекбокса и текста в одну линию */
    label[for="live-toggle"], .live-toggle-label {
        display: inline-flex !important;
        align-items: center !important;
        gap: 6px !important;
    }
    
    /* Основной контент занимает 90% ширины экрана */
    .main-content {
        width: 90% !important;
        margin: 0 auto !important;
        padding: 8px !important;
    }
    
    /* Контейнер основного контента для современного дизайна */
    main.container-modern {
        width: 90% !important;
        margin: 0 auto !important;
        padding: 8px !important;
    }
    
    /* Основной контент для старого дизайна (col-md-8 внутри col-md-9) */
    .col-md-8 {
        width: 90% !important;
        margin: 0 auto !important;
        padding: 8px !important;
    }
    
    .col-md-9 {
        width: 90% !important;
        margin: 0 auto !important;
        padding: 8px !important;
    }
    
    /* Контейнер адаптируется под мобильные */
    .container-modern {
        padding: 8px !important;
        max-width: 90% !important;
        margin: 0 auto !important;
    }
    
    /* Переопределяем CSS Grid для мобильных устройств */
    main.container-modern > div[style*="grid-template-columns"] {
        display: block !important;
        /* grid-template-columns: 280px 1fr; */
        /* gap: 24px; */
    }
    
    /* Универсальное правило для всех элементов с grid-template-columns */
    div[style*="grid-template-columns: 280px 1fr"] {
        display: block !important;
        /* grid-template-columns: 280px 1fr; */
        /* gap: 24px; */
    }
    
    /* Адаптируем заголовок для мобильных */
    .modern-header {
        padding: 8px !important;
    }
    
    .header-content-modern {
        flex-direction: column !important;
        gap: 8px !important;
    }
    
    /* Поиск и управление в одной строке */
    .search-controls-container {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: center !important;
        gap: 8px !important;
        width: 100% !important;
    }
    
    .header-top {
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;
    }
    
    .header-content-modern {
        flex-direction: column !important;
        justify-content: flex-start !important;
        align-items: stretch !important;
        gap: 8px !important;
    }
    
    /* Поиск занимает половину экрана */
    .search-modern {
        flex: 0 0 50% !important;
        margin-bottom: 0 !important;
        margin-right: 8px !important;
        max-width: 50% !important;
    }
    
    .search-input-modern {
        width: 100% !important;
        padding: 8px 10px !important;
        font-size: 0.875rem !important;
    }
    
    /* Кнопки управления в контейнере */
    .header-actions-modern {
        display: flex !important;
        justify-content: flex-end !important;
        align-items: center !important;
        width: auto !important;
        gap: 6px !important;
        flex-shrink: 0 !important;
    }
    
    .header-controls-modern {
        display: flex !important;
        gap: 6px !important;
        align-items: center !important;
    }
    
    /* Кнопки дизайна, времени и языка */
    .control-btn-modern {
        padding: 6px 8px !important;
        font-size: 0.75rem !important;
        border-radius: 4px !important;
        background: var(--bg-secondary) !important;
        border: 1px solid var(--border-color) !important;
        color: var(--text-primary) !important;
        cursor: pointer !important;
        transition: all 0.2s ease !important;
    }
    
    .control-btn-modern:hover {
        background: var(--bg-tertiary) !important;
    }
    
    .control-btn-modern i {
        font-size: 0.875rem !important;
    }
    
    /* Спортивное меню в одну строку */
    .sports-nav-modern {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        gap: 4px !important;
        margin-bottom: 12px !important;
        padding: 0 4px !important;
    }
    
    .sport-btn-modern {
        flex: 1 !important;
        padding: 8px 4px !important;
        font-size: 0.75rem !important;
        text-align: center !important;
        border-radius: 6px !important;
        min-height: 44px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    .sport-btn-modern i {
        font-size: 1rem !important;
        margin-bottom: 2px !important;
    }
    
    .sport-btn-modern span {
        font-size: 0.7rem !important;
        line-height: 1 !important;
    }
    
    /* Фильтры для мобильных - в одну строку (Дата → Live → Фильтры) */
    .filters-bar {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 16px !important; /* увеличиваем расстояние между блоками */
        margin-bottom: 12px !important;
        padding: 8px !important;
        background: var(--bg-secondary) !important;
        border-radius: 6px !important;
        flex-wrap: nowrap !important;
    }
    
    .filter-item {
        flex: 0 0 28% !important; /* уменьшаем до 28% чтобы было больше места */
        max-width: 28% !important;
        margin-bottom: 0 !important;
    }

    /* Дополнительные отступы между элементами */
    .filters-bar .filter-item:nth-child(2) {
        margin-left: 12px !important;
    }
    
    .filters-bar .filter-item:nth-child(3) {
        margin-left: 8px !important;
    }
    
    /* Уменьшаем размеры элементов для экономии места */
    .filter-label {
        font-size: 0.8rem !important;
        margin-bottom: 0 !important;
        display: flex !important;
        align-items: center !important;
        gap: 4px !important;
        white-space: nowrap !important;
    }
    
    .filter-select {
        padding: 6px !important;
        font-size: 0.8rem !important;
        border-radius: 4px !important;
    }
    
    /* Дата занимает 28% */
    .filter-item .filter-select[type="date"],
    #date-selector {
        width: 100% !important;
    }
    
    /* Кастомное отображение даты без года */
    #date-selector {
        position: relative;
    }
    
    #date-selector::-webkit-datetime-edit-text {
        display: none;
    }
    
    #date-selector::-webkit-datetime-edit-month-field {
        display: none;
    }
    
    #date-selector::-webkit-datetime-edit-year-field {
        display: none;
    }
    
    /* Для Firefox */
    #date-selector::-moz-datetime-edit-year-field {
        display: none;
    }
    
    #date-selector::-moz-datetime-edit-month-field {
        display: none;
    }
    
    /* Live слева (label в строку) */
    .filter-item label.filter-label {
        display: flex !important;
        align-items: center !important;
        gap: 6px !important;
        margin-bottom: 0 !important;
        white-space: nowrap !important;
    }
    
    /* Кнопка "Фильтры" справа */
    .filter-item .dropdown-toggle-modern {
        width: 100% !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 6px !important;
    }
    
    .filter-label {
        font-size: 0.875rem !important;
        margin-bottom: 4px !important;
        display: block !important;
    }
    
    .filter-select {
        width: 100% !important;
        padding: 8px !important;
        font-size: 0.875rem !important;
        border-radius: 4px !important;
    }
    
    /* Карточки матчей для мобильных */
    .match-row-modern {
        padding: 8px !important;
        margin-bottom: 6px !important;
        border-radius: 6px !important;
        background: var(--bg-primary) !important;
        border: 1px solid var(--border-color) !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: 8px !important;
    }
    
    /* Изменяем порядок элементов для мобильных */
    .match-time-modern {
        order: 1 !important;
        flex: 0 0 50px !important;
    }
    
    .match-teams-modern {
        order: 2 !important;
        flex: 1 !important;
    }
    
    .match-score-modern {
        order: 3 !important;
        flex: 0 0 40px !important;
    }
    
    .match-odds-modern {
        order: 4 !important;
        flex: 0 0 60px !important;
    }
    
    .match-time-modern {
        font-size: 0.75rem !important;
        text-align: center !important;
        min-width: 50px !important;
    }
    
    .match-teams-modern {
        flex: 1 !important;
        padding: 0 8px !important;
    }
    
    .team-row-modern {
        display: flex !important;
        align-items: center !important;
        margin-bottom: 4px !important;
    }
    
    .team-logo-modern {
        width: 14px !important;
        height: 14px !important;
        min-width: 14px !important;
        max-width: 14px !important;
        min-height: 14px !important;
        max-height: 14px !important;
        aspect-ratio: 1 / 1 !important;
        margin-right: 6px !important;
        font-size: 0.75rem !important;
        flex-shrink: 0 !important;
        flex-grow: 0 !important;
        position: relative !important;
        padding: 0 !important;
        margin: 0 6px 0 0 !important;
    }
    
    .team-logo-modern .team-logo-img,
    .team-logo-modern img {
        width: 14px !important;
        height: 14px !important;
        max-width: 14px !important;
        max-height: 14px !important;
        object-fit: contain !important;
        object-position: center !important;
        display: block !important;
        border-radius: 0 !important;
    }
    
    .team-name-modern {
        font-size: 0.875rem !important;
        font-weight: 500 !important;
    }
    
    .match-score-modern {
        min-width: 40px !important;
        text-align: center !important;
    }
    
    .score-value {
        font-size: 0.875rem !important;
        font-weight: 600 !important;
    }
    
    .match-odds-modern {
        min-width: 60px !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 2px !important;
    }
    
    .odds-item-modern {
        font-size: 0.75rem !important;
        text-align: center !important;
        padding: 2px 4px !important;
        background: var(--bg-secondary) !important;
        border-radius: 3px !important;
    }
    
    /* Турнирные секции */
    .tournament-section-modern {
        margin-bottom: 12px !important;
        border-radius: 6px !important;
    }
    
    .tournament-header-modern {
        padding: 8px !important;
        border-radius: 6px !important;
    }
    
    .tournament-info {
        display: flex !important;
        align-items: center !important;
    }
    
    .tournament-flag {
        font-size: 1.2rem !important;
        margin-right: 8px !important;
    }
    
    .tournament-details h3 {
        font-size: 1rem !important;
        margin: 0 !important;
    }
    
    .tournament-details p {
        font-size: 0.75rem !important;
        margin: 0 !important;
        color: var(--text-secondary) !important;
    }
    
    .tournament-meta {
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
    }
    
    .match-count-badge {
        font-size: 0.75rem !important;
        padding: 2px 6px !important;
        border-radius: 3px !important;
    }
    
    .toggle-icon-modern {
        font-size: 0.875rem !important;
    }
    
    /* Заголовки страниц */
    .page-title-modern {
        font-size: 1.25rem !important;
        margin-bottom: 12px !important;
        text-align: center !important;
    }
    
    /* Карточки матчей */
    .match-card-modern {
        margin-bottom: 12px !important;
        padding: 12px !important;
        border-radius: 8px !important;
    }
    
    .match-header-modern {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 8px !important;
        margin-bottom: 12px !important;
    }
    
    .match-teams-modern {
        flex-direction: column !important;
        gap: 8px !important;
    }
    
    .team-modern {
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: center !important;
        width: 100% !important;
        padding: 8px !important;
        background: var(--bg-secondary) !important;
        border-radius: 6px !important;
    }
    
    .team-name-modern {
        font-size: 0.875rem !important;
        font-weight: 500 !important;
    }
    
    .team-score-modern {
        font-size: 1rem !important;
        font-weight: 600 !important;
    }
    
    /* Кнопки */
    .btn-modern {
        padding: 10px 16px !important;
        font-size: 0.875rem !important;
        border-radius: 6px !important;
    }
    
    .btn-modern.btn-sm {
        padding: 8px 12px !important;
        font-size: 0.75rem !important;
    }
    
    /* Навигация */
    .nav-modern {
        flex-wrap: wrap !important;
        gap: 8px !important;
        margin-bottom: 16px !important;
    }
    
    .nav-item-modern {
        flex: 1 !important;
        min-width: calc(50% - 4px) !important;
    }
    
    .nav-link-modern {
        padding: 10px 8px !important;
        font-size: 0.875rem !important;
        text-align: center !important;
        border-radius: 6px !important;
    }
    
    /* Футер */
    .footer-modern {
        padding: 16px 8px !important;
        text-align: center !important;
    }
    
    .footer-links-modern {
        flex-direction: column !important;
        gap: 12px !important;
    }
    
    .footer-link-modern {
        font-size: 0.875rem !important;
        padding: 8px !important;
    }
    
    /* Формы */
    .form-group-modern {
        margin-bottom: 12px !important;
    }
    
    .form-control-modern {
        padding: 12px !important;
        font-size: 1rem !important;
        border-radius: 6px !important;
    }
    
    .form-label-modern {
        font-size: 0.875rem !important;
        margin-bottom: 6px !important;
    }
    
    /* Модальные окна */
    .modal-modern {
        margin: 8px !important;
        max-width: calc(100% - 16px) !important;
    }
    
    .modal-content-modern {
        padding: 16px !important;
        border-radius: 8px !important;
    }
    
    .modal-header-modern {
        padding: 12px 16px !important;
        border-bottom: 1px solid var(--border-color) !important;
    }
    
    .modal-title-modern {
        font-size: 1.125rem !important;
    }
    
    .modal-body-modern {
        padding: 16px !important;
    }
    
    .modal-footer-modern {
        padding: 12px 16px !important;
        border-top: 1px solid var(--border-color) !important;
    }
    
    /* Таблицы */
    .table-modern {
        font-size: 0.875rem !important;
        border-radius: 8px !important;
        overflow: hidden !important;
    }
    
    .table-modern th,
    .table-modern td {
        padding: 8px 6px !important;
        font-size: 0.75rem !important;
    }
    
    /* Уведомления */
    .alert-modern {
        padding: 12px !important;
        font-size: 0.875rem !important;
        border-radius: 6px !important;
        margin-bottom: 12px !important;
    }
    
    /* Бейджи */
    .badge-modern {
        font-size: 0.75rem !important;
        padding: 4px 8px !important;
        border-radius: 4px !important;
    }
    
    /* Карточки лиг */
    .league-item-modern {
        padding: 10px !important;
        font-size: 0.875rem !important;
        border-radius: 6px !important;
        margin-bottom: 6px !important;
    }
    
    .league-name {
        font-size: 0.875rem !important;
    }
    
    .league-count {
        font-size: 0.75rem !important;
    }
    
    /* Статистика */
    .stats-grid-modern {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
    
    .stat-card-modern {
        padding: 12px !important;
        border-radius: 6px !important;
    }
    
    .stat-value-modern {
        font-size: 1.5rem !important;
    }
    
    .stat-label-modern {
        font-size: 0.875rem !important;
    }
    
    /* Прогресс-бары */
    .progress-modern {
        height: 6px !important;
        border-radius: 3px !important;
    }
    
    /* Табы */
    .tabs-modern {
        flex-wrap: wrap !important;
        gap: 4px !important;
    }
    
    .tab-modern {
        flex: 1 !important;
        min-width: calc(50% - 2px) !important;
        text-align: center !important;
        padding: 8px 4px !important;
        font-size: 0.875rem !important;
    }
    
    /* Заголовок сайта */
    .modern-header {
        padding: 12px 8px !important;
    }
    
    .header-content-modern {
        flex-direction: column !important;
        gap: 12px !important;
    }
    
    .logo-modern {
        font-size: 1.5rem !important;
    }
    
    .header-actions-modern {
        flex-direction: row !important;
        justify-content: flex-start !important;
        width: auto !important;
        flex: 0 0 auto !important;
    }
    
    /* Кнопки управления не растягиваются на всю ширину */
    .header-actions-modern > * {
        width: auto !important;
        flex: 0 0 auto !important;
    }
    
    /* Выпадающие меню */
    .dropdown-modern {
        position: relative !important;
    }
    
    .dropdown-menu-modern {
        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        z-index: 1000 !important;
    }
    
    /* Поиск */
    .search-modern {
        width: 100% !important;
        margin-bottom: 12px !important;
    }
    
    .search-input-modern {
        width: 100% !important;
        padding: 10px 12px !important;
        font-size: 1rem !important;
    }
    
    /* Фильтры */
    .filters-modern {
        flex-direction: column !important;
        gap: 8px !important;
        margin-bottom: 16px !important;
    }
    
    .filter-group-modern {
        width: 100% !important;
    }
    
    .filter-select-modern {
        width: 100% !important;
        padding: 10px 12px !important;
        font-size: 0.875rem !important;
    }
    
    /* Адаптация для очень маленьких экранов */
    @media (max-width: 480px) {
        /* Основной контент занимает 95% ширины на очень маленьких экранах */
        .main-content {
            width: 95% !important;
        }
        
        /* Контейнер основного контента для современного дизайна на очень маленьких экранах */
        main.container-modern {
            width: 95% !important;
        }
        
        /* Основной контент для старого дизайна на очень маленьких экранах */
        .col-md-8 {
            width: 95% !important;
        }
        
        .col-md-9 {
            width: 95% !important;
        }
        
        .container-modern {
            max-width: 95% !important;
        }
        
        /* Поиск в контейнере на очень маленьких экранах */
        .search-controls-container {
            gap: 4px !important;
        }
        
        .search-modern {
            flex: 0 0 50% !important;
            margin-right: 4px !important;
            max-width: 50% !important;
        }
        
        .header-actions-modern {
            gap: 4px !important;
        }
        
        /* Спортивное меню остается в одну строку */
        .sports-nav-modern {
            gap: 2px !important;
        }
        
        .sport-btn-modern {
            padding: 6px 2px !important;
            font-size: 0.7rem !important;
        }
        
        .sport-btn-modern i {
            font-size: 0.875rem !important;
        }
        
        .sport-btn-modern span {
            font-size: 0.65rem !important;
        }
        
        /* Карточки матчей */
        .match-card-modern {
            padding: 6px !important;
        }
        
        .team-modern {
            padding: 4px !important;
        }
        
        .btn-modern {
            padding: 6px 8px !important;
            font-size: 0.75rem !important;
        }
        
        .page-title-modern {
            font-size: 1.125rem !important;
        }
        
        /* Фильтры */
        .filters-bar {
            padding: 6px !important;
            gap: 6px !important;
        }
        
        .filter-select { padding: 6px !important; font-size: 0.8rem !important; }
        .filter-item { flex: 0 0 30% !important; max-width: 30% !important; }
        
        /* Карточки матчей */
        .match-row-modern {
            padding: 6px !important;
            gap: 4px !important;
        }
        
        /* Уменьшаем размеры элементов на очень маленьких экранах */
        .match-time-modern {
            flex: 0 0 40px !important;
        }
        
        .match-score-modern {
            flex: 0 0 30px !important;
        }
        
        .match-odds-modern {
            flex: 0 0 50px !important;
        }
        
        .team-name-modern {
            font-size: 0.8rem !important;
        }
        
        .score-value {
            font-size: 0.8rem !important;
        }
        
        .odds-item-modern {
            font-size: 0.7rem !important;
            padding: 1px 3px !important;
        }
        
        /* Турнирные секции */
        .tournament-header-modern {
            padding: 6px !important;
        }
        
        .tournament-details h3 {
            font-size: 0.9rem !important;
        }
        
        .tournament-details p {
            font-size: 0.7rem !important;
        }
        
        .match-count-badge {
            font-size: 0.7rem !important;
            padding: 1px 4px !important;
        }
        
        /* Кнопки управления */
        .control-btn-modern {
            padding: 4px 6px !important;
            font-size: 0.7rem !important;
        }
        
        .control-btn-modern i {
            font-size: 0.8rem !important;
        }
        
        /* Таблицы */
        .table-modern th,
        .table-modern td {
            padding: 4px 2px !important;
            font-size: 0.7rem !important;
        }
    }

    
}

/* ===================================
   BEGIN: MOBILE HEADER V2 (rollback-ready)
   Откат: удалите или закомментируйте весь блок ниже до END
   Область: только мобильные (<= 767px)
   =================================== */
@media (max-width: 767px) {
    /* Верхняя полоса шапки в одну линию */
    .header-top {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 8px !important;
    }

    /* Компоновка: бургер слева, логотип по центру */
    .mobile-menu-toggle {
        order: -1 !important;
    }
    .logo-modern {
        flex: 0 0 auto !important;
    }

    /* Двухстрочная шапка: управление + поиск ниже */
    .search-controls-container {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 8px !important;
        width: 100% !important;
    }

    /* Поиск во всю ширину */
    .search-modern {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
    }

    /* Кнопки управления — компактные, с горизонтальным скроллом при нехватке места */
    .header-actions-modern,
    .header-controls-modern {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        gap: 6px !important;
    }

    .control-btn-modern {
        min-width: 36px !important;
        padding: 6px !important;
    }

    /* Показываем текст у кнопок языка и часового пояса */
    .control-btn-modern span,
    .control-btn-modern .label {
        display: inline !important;
        margin-left: 4px !important;
        font-size: 0.7rem !important;
    }
}
/* ===================================
   END: MOBILE HEADER V2
   =================================== */

/* ===================================
   BEGIN: MOBILE HEADER V2 FIXES (overlay + search padding)
   Откат: удалить блок до END FIXES
   =================================== */
@media (max-width: 767px) {
    /* Исключаем перекрытие кнопки меню элементами поиска */
    .mobile-menu-toggle {
        position: relative !important;
        z-index: 20 !important;
        pointer-events: auto !important;
    }

    /* Поисковый контейнер ниже по слою */
    .search-controls-container,
    .search-modern {
        position: relative !important;
        z-index: 1 !important;
        margin-top: 4px !important; /* чуть ниже от логотипа */
    }

    /* Увеличиваем внутренние отступы, чтобы текст не налезал на иконку поиска */
    .search-input-modern {
        padding-left: 36px !important; /* место под иконку слева */
        min-height: 40px !important;
        line-height: 40px !important;
        box-sizing: border-box !important;
    }

    /* ВЫПАДАЮЩИЕ СПИСКИ: не обрезаем и поднимаем поверх поиска */
    .header-actions-modern,
    .header-controls-modern {
        overflow: visible !important; /* было auto — прятало меню */
        position: relative !important;
        z-index: 5 !important;
    }

    .dropdown-modern { position: relative !important; }
    .dropdown-menu-modern {
        position: absolute !important;
        z-index: 2000 !important; /* выше поиска (z-index:1) */
        margin-top: 6px !important;
    }
}
/* ===================================
   END: MOBILE HEADER V2 FIXES
   =================================== */

/* ===================================
   BEGIN: HIDE MENU TOGGLE ON MOBILE (override stronger than earlier rules)
   Откат: удалить блок до END HIDE
   =================================== */
@media (max-width: 991px) {
    .mobile-menu-toggle,
    .menu-toggle,
    .navbar-toggler,
    .sidebar-toggle,
    .hamburger,
    button[aria-label*="menu" i],
    button[aria-label*="меню" i] {
        display: none !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }
}
/* ===================================
   END: HIDE MENU TOGGLE ON MOBILE
   =================================== */

/* ===================================
   BEGIN: SEARCH SIZE TWEAK (mobile)
   Откат: удалить блок до END SEARCH
   Эффект: высота меньше, ширина +20% относительно контейнера
   =================================== */
@media (max-width: 767px) {
    /* Расширяем область поиска на 20% и центрируем */
    .search-modern {
        width: 120% !important;
        max-width: none !important;
        margin-left: -10% !important;
        margin-right: -10% !important;
    }

    /* Делаем поле поиска ниже по высоте */
    .search-input-modern {
        min-height: 34px !important;
        line-height: 34px !important;
        padding-top: 6px !important;
        padding-bottom: 6px !important;
    }
}
/* ===================================
   END: SEARCH SIZE TWEAK
   =================================== */

/* ===================================
   BEGIN: CENTER HEADER CONTROLS (mobile)
   Откат: удалить блок до END CENTER
   =================================== */
@media (max-width: 767px) {
    .header-actions-modern,
    .header-controls-modern {
        justify-content: center !important;
        width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}
/* ===================================
   END: CENTER HEADER CONTROLS
   =================================== */

/* ===================================
   BEGIN: MATCH DETAIL PAGE (mobile)
   Откат: удалить блок до END MATCH DETAIL
   Область: только мобильные (<= 767px)
   =================================== */
@media (max-width: 767px) {
    .match-header-detail {
        padding: var(--spacing-md) !important;
        margin-bottom: var(--spacing-md) !important;
        border-radius: var(--border-radius-md) !important;
    }

    .match-score-display {
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: center !important;
        gap: var(--spacing-sm) !important;
        margin: var(--spacing-md) 0 !important;
    }

    .team-display { max-width: 140px !important; }
    .team-logo-large {
        width: 56px !important;
        height: 56px !important;
        margin-bottom: var(--spacing-sm) !important;
        font-size: 24px !important;
    }
    .team-name-large { font-size: 16px !important; line-height: 1.2 !important; }
    .score-display-large { font-size: 36px !important; line-height: 1 !important; }

    .stats-section { padding: var(--spacing-md) !important; }
    .stat-row { padding: var(--spacing-sm) 0 !important; }
    .stat-label { font-size: 12px !important; }
    .stat-values { gap: var(--spacing-md) !important; }
    .stat-bar { width: 100% !important; max-width: 240px !important; }
}
/* ===================================
   END: MATCH DETAIL PAGE (mobile)
   =================================== */