/* ===================================================================
   TEKNOELEKTRIK.TR - DASHBOARD.CSS (V-FINAL: THEME & MENU FIX)
   =================================================================== */

/* 1. TEMA MOTORU (JS KODUNUN ÇALIŞMASI İÇİN GEREKLİ ALAN) */
:root {
    /* GÜNDÜZ (LIGHT) DEĞİŞKENLERİ */
    --db-bg-canvas: #f0f2f5;       /* Sayfa Zemini: Hafif Gri/Beyaz */
    --db-bg-card: #ffffff;         /* Kart Zemini: Beyaz */
    --db-text-main: #0A2342;       /* Ana Yazı: Lacivert */
    --db-text-muted: #5f6368;      /* Pasif Yazı: Gri */
    
    --db-accent-blue: #4318ff;     /* Vurgu: Neon Mavi */
    --db-accent-cyan: #05cd99;     /* Vurgu: Yeşil */
    --db-accent-red: #ee5d50;      /* Vurgu: Kırmızı */
    
    --db-border-color: #e4e6eb;    /* Kenarlıklar */
    --db-shadow-card: 0px 4px 20px rgba(0, 0, 0, 0.05);
    
    /* SOL MENÜ GÜNDÜZ AYARLARI */
    --menu-item-bg: #ffffff;
    --menu-item-text: #5f6368;
    --menu-hover-bg: #ffffff;      /* Üzerine gelince yine beyaz (Parlaklık için) */
    --menu-hover-text: #0A2342;    /* Üzerine gelince yazı Lacivert */
    --menu-hover-shadow: 0 0 15px rgba(255, 255, 255, 0.8), 0 5px 15px rgba(0,0,0,0.1); /* Flash Efekti */
}

/* GECE (DARK) DEĞİŞKENLERİ - JS BURAYI TETİKLER */
html.theme-dark, [data-theme="dark"] {
    --db-bg-canvas: #0b1437;       /* Sayfa Zemini: Koyu Lacivert */
    --db-bg-card: #111c44;         /* Kart Zemini: Lacivert */
    --db-text-main: #ffffff;       /* Ana Yazı: Beyaz */
    --db-text-muted: #a3aed0;      /* Pasif Yazı: Açık Mavi/Gri */
    
    --db-border-color: #2d3f53;    /* Kenarlık: Koyu */
    --db-shadow-card: none;
    
    /* SOL MENÜ GECE AYARLARI */
    --menu-item-bg: #111c44;       /* Fon: Lacivert */
    --menu-item-text: #a3aed0;     /* Yazı: Soluk Mavi */
    --menu-hover-bg: #1a73e8;      /* Hover Fon: Parlak Mavi */
    --menu-hover-text: #ffffff;    /* Hover Yazı: Beyaz */
    --menu-hover-shadow: 0 0 20px rgba(26, 115, 232, 0.4); /* Neon Glow */
}

body {
    background-color: var(--db-bg-canvas) !important;
    color: var(--db-text-main);
    font-family: 'DM Sans', 'Inter', sans-serif;
    overflow-x: hidden;
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* ===================================================================
   2. LAYOUT & TOOLBAR
   =================================================================== */
.dashboard-layout {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr) 320px;
    gap: 25px; padding: 25px;
    max-width: 1750px; margin: 0 auto;
    align-items: start;
}

.dashboard-toolbar {
    background: var(--db-bg-card); height: 75px; padding: 0 25px;
    display: flex; justify-content: space-between; align-items: center;
    position: sticky; top: 0; z-index: 1000;
    box-shadow: var(--db-shadow-card); border-bottom: 1px solid var(--db-border-color);
    transition: background-color 0.3s ease;
}
.toolbar-left { display: flex; align-items: center; gap: 20px; }

/* Tema Butonu */
#theme-toggle-btn-dash {
    background: transparent; border: 1px solid var(--db-border-color);
    width: 40px; height: 40px; border-radius: 50%; cursor: pointer;
    color: var(--db-text-main); display: flex; align-items: center; justify-content: center;
    transition: 0.3s;
}
#theme-toggle-btn-dash:hover { background: var(--db-bg-canvas); transform: rotate(15deg); }

/* Ticker */
.ticker-wrapper {
    flex: 1; max-width: 600px; height: 42px;
    background: var(--db-bg-canvas); border-radius: 30px;
    display: flex; align-items: center; overflow: hidden; 
    margin-left: auto; padding: 0 20px; border: 1px solid var(--db-border-color);
}
.ticker-track { display: flex; gap: 30px; animation: marquee 35s linear infinite; white-space: nowrap; }
.ticker-item { font-size: 0.85rem; font-weight: 700; color: var(--db-text-main); }
@keyframes marquee { 0% { transform: translateX(0); } 100% { transform: translateX(-100%); } }

/* ===================================================================
   3. SOL MENÜ (İSTEDİĞİN GİBİ: FLASH VE LACİVERT)
   =================================================================== */
.left-sidebar { position: sticky; top: 95px; display: flex; flex-direction: column; gap: 15px; }
.sidebar-menu { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }

.sidebar-bead-item {
    display: flex; align-items: center; gap: 15px; 
    padding: 14px 20px; border-radius: 20px;
    
    /* Renkler Değişkenlerden Geliyor */
    background-color: var(--menu-item-bg); 
    color: var(--menu-item-text); 
    
    font-weight: 600; text-decoration: none;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); /* Yumuşak geçiş */
    border: 1px solid var(--db-border-color);
    box-shadow: 0 2px 5px rgba(0,0,0,0.02);
}

.sidebar-bead-item:hover, .sidebar-bead-item.active {
    /* Hover Renkleri Değişkenlerden Geliyor */
    background-color: var(--menu-hover-bg); 
    color: var(--menu-hover-text) !important;
    
    /* Flash / Parlama Efekti */
    box-shadow: var(--menu-hover-shadow);
    border-color: transparent;
    transform: translateX(5px) scale(1.02);
}

.sidebar-bead-item svg { width: 22px; height: 22px; fill: currentColor; transition: 0.3s; }
.sidebar-bead-item:hover svg, .sidebar-bead-item.active svg { transform: scale(1.1); }

/* ===================================================================
   4. ORTA ALAN
   =================================================================== */
.main-content { min-width: 0; display: flex; flex-direction: column; gap: 25px; }

.welcome-banner {
    background: linear-gradient(81.62deg, #313860 2.25%, #151928 79.87%);
    border-radius: 20px; padding: 35px; color: #fff;
    position: relative; overflow: hidden; box-shadow: var(--db-shadow-card);
}
.ai-input {
    display: flex; margin-top: 20px; background: rgba(255,255,255,0.1);
    border-radius: 30px; padding: 5px; backdrop-filter: blur(5px); 
}
.ai-input input { flex: 1; background: transparent; border: none; padding: 10px 20px; color: #fff; outline: none; }
.ai-input button { background: #fff; color: #151928; border: none; padding: 0 30px; border-radius: 25px; font-weight: 700; cursor: pointer; }

/* Medya */
.media-split-container { overflow: hidden; width: 100%; margin-bottom: 10px; }
.media-strip { width: 100%; overflow: hidden; padding: 5px 0; position: relative; }
.strip-track { display: flex; gap: 15px; width: max-content; }
.move-right { animation: scrollRight 40s linear infinite; }
.move-left { animation: scrollLeft 40s linear infinite; }
@keyframes scrollRight { 0% { transform: translateX(-50%); } 100% { transform: translateX(0); } }
@keyframes scrollLeft { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }
.media-card-mini {
    width: 200px; background: var(--db-bg-card); border-radius: 15px;
    overflow: hidden; border: 1px solid rgba(0,0,0,0.05);
    box-shadow: var(--db-shadow-card); flex-shrink: 0; text-decoration: none; display: flex; flex-direction: column;
}
.mini-thumb { height: 110px; background-size: cover; background-position: center; position: relative; display: flex; align-items: center; justify-content: center; }
.mini-title { padding: 10px; font-size: 0.8rem; font-weight: 600; color: var(--db-text-main); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* --- SPLIT GRID (İHALE & FORUM) --- */
.dashboard-split-grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: 25px; width: 100%;
}
.split-widget-box {
    background: var(--db-bg-card); border-radius: 20px;
    box-shadow: var(--db-shadow-card); padding: 20px;
    display: flex; flex-direction: column; border: 1px solid var(--db-border-color);
}
.split-header {
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 15px; padding-bottom: 10px; border-bottom: 1px solid rgba(0,0,0,0.05);
}
.split-header h4 { font-size: 1rem; font-weight: 700; color: var(--db-text-main); margin: 0; }
.split-header a { font-size: 0.8rem; color: var(--db-accent-blue); text-decoration: none; font-weight: 600; }

/* Kompakt Liste */
.compact-list-item {
    display: flex; align-items: center; gap: 15px;
    padding: 12px 0; border-bottom: 1px solid rgba(0,0,0,0.03);
    cursor: pointer; transition: 0.2s;
}
.compact-list-item:hover { padding-left: 8px; background: var(--db-bg-canvas); }
.compact-list-item:last-child { border-bottom: none; }
.compact-icon { width: 40px; height: 40px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 1.2rem; flex-shrink: 0; }
.icon-tender { background: rgba(5, 205, 153, 0.1); color: var(--db-accent-cyan); }
.icon-forum { background: rgba(67, 24, 255, 0.1); color: var(--db-accent-blue); }
.compact-info { flex: 1; min-width: 0; }
.compact-title { font-size: 0.85rem; font-weight: 700; color: var(--db-text-main); display: block; margin-bottom: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.compact-meta { font-size: 0.7rem; color: var(--db-text-muted); display: flex; gap: 10px; }

/* --- RIGHT SIDEBAR --- */
.right-sidebar { position: sticky; top: 95px; display: flex; flex-direction: column; gap: 25px; }
.user-profile-card {
    background: var(--db-bg-card); border-radius: 20px;
    box-shadow: var(--db-shadow-card); overflow: hidden; position: relative;
    padding-bottom: 25px; border: 1px solid var(--db-border-color);
}
.user-header-bg { height: 100px; background: linear-gradient(135deg, #868CFF 0%, #4318FF 100%); }
.user-avatar-container {
    width: 86px; height: 86px; border-radius: 50%;
    border: 4px solid var(--db-bg-card);
    position: absolute; left: 50%; transform: translateX(-50%); top: 55px;
    background: var(--db-bg-card); display: flex; align-items: center; justify-content: center;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}
.user-avatar-container img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
.user-body { padding: 50px 20px 0 20px; text-align: center; }
.user-name { font-size: 1.2rem; font-weight: 700; color: var(--db-text-main); }
.user-role { font-size: 0.8rem; color: var(--db-text-muted); margin-bottom: 15px; display: block; }
.user-stats-row {
    display: flex; justify-content: space-between; margin: 20px 0;
    padding: 12px 15px; border-radius: 12px; background: var(--db-bg-canvas);
}
.u-stat { display: flex; flex-direction: column; }
.u-stat b { font-size: 1rem; color: var(--db-text-main); }
.u-stat span { font-size: 0.7rem; color: var(--db-text-muted); }
.user-btn-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.u-action-btn {
    background: var(--db-bg-canvas); color: var(--db-text-main); padding: 10px;
    border-radius: 10px; font-size: 0.75rem; font-weight: 600; text-decoration: none;
    display: flex; align-items: center; justify-content: center; gap: 5px; transition: 0.2s;
}
.u-action-btn:hover { background: var(--db-accent-blue); color: #fff; }

/* --- TOAST (LIVE MESSAGE) --- */
.toast-container {
    position: fixed; bottom: 30px; right: 30px; z-index: 99999; 
    display: flex; flex-direction: column; gap: 15px; pointer-events: none;
}
.toast-card {
    background: var(--db-bg-card); color: var(--db-text-main);
    padding: 15px 20px; border-radius: 15px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
    border-left: 5px solid var(--db-accent-blue);
    display: flex; align-items: center; gap: 15px;
    min-width: 300px; transform: translateX(120%); opacity: 0;
    transition: all 0.5s cubic-bezier(0.68, -0.55, 0.27, 1.55);
    pointer-events: auto;
}
.toast-card.show { transform: translateX(0); opacity: 1; }

/* RESPONSIVE */
@media (max-width: 1200px) { 
    .dashboard-layout { grid-template-columns: 240px 1fr; } 
    .right-sidebar { display: none; } 
}
@media (max-width: 992px) { 
    .dashboard-layout { grid-template-columns: 1fr; } 
    .left-sidebar { display: none; }
    .dashboard-split-grid { grid-template-columns: 1fr; } 
}