/**
 * ============================================
 * UNIÃO ESPORTE CLUBE - SITE PRINCIPAL
 * ============================================
 * Website oficial do União Esporte Clube
 * "O Colorado de Rondonópolis"
 * 
 * Desenvolvido com ASP.NET Core e Bootstrap 5
 * 
 * Estrutura CSS Modular:
 * - _variables.css: Variáveis e tokens de design
 * - _base.css: Reset e estilos base
 * - _components.css: Componentes reutilizáveis
 * - _navigation.css: Navbar e menus
 * - _layout.css: Hero, footer, sections
 * - _utilities.css: Classes auxiliares
 * ============================================
 */

/* === IMPORTAÇÕES === */
@import url('modules/_variables.css');
@import url('modules/_base.css');
@import url('modules/_components.css');
@import url('modules/_navigation.css');
@import url('modules/_layout.css');
@import url('modules/_utilities.css');
@import url('modules/_home-news.css');
@import url('modules/_sponsors.css');

/**
 * ============================================
 * ESTILOS ESPECÍFICOS DE PÁGINAS
 * ============================================
 * Estilos que são únicos para páginas específicas
 * e não se encaixam nos módulos acima
 */

/* === PÁGINA INICIAL === */
/* Hero com imagens de fundo específicas */
.hero-section .carousel-item img {
    width: 100%;
    height: 60vh;
    min-height: 400px;
    max-height: 600px;
    object-fit: cover;
    object-position: center;
    filter: brightness(0.8);
    transition: all 0.5s ease;
}

.hero-section .carousel-item.active img {
    filter: brightness(0.9);
}

/* Imagem da página de detalhes */
.hero-section .position-relative img {
    width: 100%;
    height: 50vh;
    min-height: 350px;
    max-height: 500px;
    object-fit: cover;
    object-position: center;
    filter: brightness(0.7);
}

/* === RESPONSIVIDADE DE IMAGENS === */
@media (max-width: 768px) {
    .hero-section .carousel-item img,
    .hero-section .position-relative img {
        height: 40vh;
        min-height: 250px;
    }
}

@media (max-width: 576px) {
    .hero-section .carousel-item img,
    .hero-section .position-relative img {
        height: 35vh;
        min-height: 200px;
    }
}

/* Bloco de próximo jogo (home) */
.home-next-match {
    background: linear-gradient(135deg, #ffffff 0%, #ffe5e5 50%, #ffffff 100%);
    color: #212529;
}

.home-next-match .card {
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(220, 53, 69, 0.12);
    border-radius: 1.25rem;
}

.home-next-match .scoreboard {
    border: 1px solid rgba(220, 53, 69, 0.18);
    box-shadow: 0 0.75rem 1.5rem -1rem rgba(220, 53, 69, 0.45);
}

.home-next-match .opponent-badge {
    background: #ffe3e6 !important;
    color: #b02032 !important;
    border: 1px solid rgba(220, 53, 69, 0.3);
}

.home-next-match__empty {
    background: rgba(255, 255, 255, 0.92);
    border: 1px dashed rgba(220, 53, 69, 0.25) !important;
}

/**
 * ============================================
 * FIM DO ARQUIVO
 * ============================================
 * 
 * NOTA: Este arquivo foi refatorado para melhor
 * manutenibilidade e performance. Os estilos foram
 * organizados em módulos específicos.
 * 
 * Total de linhas reduzido de ~1466 para ~150
 * Redução de ~90% no arquivo principal
 * 
 * Benefícios:
 * ✅ Melhor organização e manutenibilidade
 * ✅ Fácil localização de estilos específicos
 * ✅ Reutilização de código
 * ✅ Performance melhorada com módulos
 * ✅ Facilita trabalho em equipe
 * ✅ Evita conflitos de código
 * 
 * ============================================
 */