/* ==========================================================================
   TEKNOELEKTRIK.TR - INDEX STYLE (VISITOR HOME)
   Kapsam: Ana Sayfa Modül Grid, Slider, İstatistikler
   ========================================================================== */

/* 1. ANA MODÜL GRID (4'LÜ YAPI) */
.module-grid-section { margin: 10px 0; }

.module-grid-wrapper {
    display: grid;
    grid-template-columns: repeat(4, 1fr); /* 4 Eşit Sütun */
    gap: 15px;
}

/* Modül Kartı */
.module-widget-wrapper {
    background: var(--surface-color);
    border-radius: 16px;
    height: 380px; /* Sabit Yükseklik */
    display: flex; flex-direction: column;
    box-shadow: 0 10px 25px rgba(0,0,0,0.05);
    border: 1px solid rgba(255,255,255,0.1);
    overflow: hidden; position: relative;
    transition: transform 0.3s;
}
.module-widget-wrapper:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(0, 210, 255, 0.15);
    border-color: var(--circuit-color);
}

/* Başlık */
.widget-title {
    padding: 20px; font-size: 1.1rem; color: var(--text-main);
    background: rgba(0,0,0,0.02); border-bottom: 1px solid rgba(0,0,0,0.05);
    display: flex; align-items: center; gap: 10px; margin: 0;
}
.widget-title i { color: var(--circuit-color); font-size: 1.2rem; }

/* İçerik & Scroller */
.module-widget { flex: 1; position: relative; overflow: hidden; }
.widget-scroller-wrapper { height: 100%; width: 100%; position: relative; }
.widget-scroller { animation: scrollLoop 60s linear infinite; }
.module-widget-wrapper:hover .widget-scroller { animation-play-state: paused; }

/* Liste Öğesi */
.widget-item {
    display: flex; align-items: center; gap: 15px; padding: 12px 20px;
    text-decoration: none; color: var(--text-sub);
    border-left: 3px solid transparent; transition: 0.2s;
}
.widget-item:hover {
    background: rgba(0,210,255,0.05); color: var(--circuit-color);
    border-left-color: var(--circuit-color); padding-left: 25px;
}
.widget-item i {
    font-size: 0.9rem; width: 30px; text-align: center;
    color: var(--circuit-color); opacity: 0.8;
}

/* 2. SLIDER & BANNER */
.main-banner {
    height: 500px; border-radius: 20px; overflow: hidden; position: relative;
    box-shadow: 0 15px 35px rgba(0,0,0,0.2); margin-bottom: 50px;
}
.glass-caption {
    position: absolute; bottom: 40px; left: 40px; right: 40px;
    background: rgba(255, 255, 255, 0.85); backdrop-filter: blur(15px);
    padding: 30px; border-radius: 16px; border: 1px solid rgba(255,255,255,0.5);
    display: flex; justify-content: space-between; align-items: center;
}
html.theme-dark .glass-caption { background: rgba(30, 41, 59, 0.9); border-color: rgba(255,255,255,0.1); }

/* 3. SPLIT ALAN (İSTATİSTİK & GİRİŞ) */
.split-container { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin: 60px 0; }
.split-box {
    background: var(--surface-color); border-radius: 20px; padding: 40px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05); position: relative;
}
.stats-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.stat-item {
    text-align: center; padding: 20px; background: rgba(0,0,0,0.02);
    border-radius: 12px;
}
.stat-num { font-size: 2.5rem; font-weight: 800; color: var(--circuit-color); display: block; }

/* 4. RESPONSIVE */
@media (max-width: 1200px) { .module-grid-wrapper { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 900px) { .module-grid-wrapper { grid-template-columns: repeat(2, 1fr); } .split-container { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .module-grid-wrapper { grid-template-columns: 1fr; } .glass-caption { flex-direction: column; text-align: center; gap: 20px; } }

@keyframes scrollLoop { 0% { transform: translateY(0); } 100% { transform: translateY(-50%); } }
/* ==========================================================================
   V-FINAL: SIKIŞTIRMA YAMASI (COMPACT PATCH)
   Amaç: Banner, Haber ve Grid arasındaki boşlukları minimuma indirmek.
   ========================================================================== */

/* 1. TÜM KONTEYNERLERİ SIKIŞTIR */
.container {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* 2. HABER BANDI (TICKER) YERLEŞİMİ */
.news-ticker-wrapper {
    margin-top: 0 !important;
    margin-bottom: 10px !important; /* Altına sadece 10px boşluk */
    height: 45px !important; /* Yüksekliği incelttik */
}

/* 3. ANA SLIDER ALTI */
.main-banner {
    margin-bottom: 5px !important; /* Slider ile haber arası 5px */
}

/* 4. SEKSİYONLAR ARASI GENEL SIKIŞTIRMA */
.section {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
}