/* LGS Öğrenci ve Veli Paneli Ortak Stilleri */
:root { --p-color: #3B2E85; --s-color: #5925A1; --accent: #facc15; }
body { background-color: #f4f6fb; }
.panel-container { max-width: 1200px; margin: 30px auto 100px; padding: 0 20px; font-family: 'Segoe UI', sans-serif; }

.hero-section { background: linear-gradient(135deg, var(--p-color) 0%, var(--s-color) 100%); border-radius: 24px; padding: 45px; color: #fff; display: flex; justify-content: space-between; align-items: center; box-shadow: 0 20px 40px rgba(59, 46, 133, 0.25); margin-bottom: 35px; flex-wrap: wrap; gap: 30px; position: relative; overflow: hidden; }
.hero-text h1 { margin: 0 0 12px; font-size: 36px; font-weight: 800; text-shadow: 0 2px 10px rgba(0,0,0,0.2); }
.hero-text p { margin: 0; font-size: 17px; opacity: 0.9; font-weight: 400; }
.sinif-rozeti { display: inline-block; background: rgba(255,255,255,0.15); padding: 6px 16px; border-radius: 50px; font-size: 13px; font-weight: 700; margin-bottom: 18px; border: 1px solid rgba(255,255,255,0.2); }

.hero-right { display: flex; align-items: center; }
.score-cam { background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.2); padding: 25px 35px; border-radius: 20px; text-align: center; backdrop-filter: blur(10px); min-width: 180px; box-shadow: 0 10px 20px rgba(0,0,0,0.1); }
.score-cam span { display: block; text-transform: uppercase; font-size: 12px; letter-spacing: 1px; color: var(--accent); font-weight: 700; margin-bottom: 5px; }
.score-cam b { font-size: 42px; font-weight: 900; line-height: 1; }

.lgs-countdown { background: rgba(0,0,0,0.2); padding: 25px 35px; border-radius: 20px; border: 1px solid rgba(255,255,255,0.1); text-align: center; }
.lgs-countdown h3 { margin: 0 0 15px; font-size: 13px; color: var(--accent); letter-spacing: 1px; }
.timer-boxes { display: flex; gap: 15px; }
.timer-box { display: flex; flex-direction: column; width: 60px; }
.timer-box .num { font-size: 32px; font-weight: 900; }
.timer-box .txt { font-size: 10px; opacity: 0.7; font-weight: 700; }

.stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 20px; margin-bottom: 40px; }
.stat-card { background: #fff; border-radius: 20px; padding: 25px; display: flex; align-items: center; gap: 20px; box-shadow: 0 10px 25px rgba(0,0,0,0.03); transition: all 0.4s; border: 1px solid #f0f4f8; }
.stat-card:hover { transform: translateY(-8px); box-shadow: 0 15px 35px rgba(59, 46, 133, 0.1); border-color: var(--p-color); }
.stat-icon { width: 55px; height: 55px; border-radius: 15px; display: flex; align-items: center; justify-content: center; font-size: 22px; color: #fff; flex-shrink: 0; }
.icon-blue { background: linear-gradient(135deg, #0ea5e9, #38bdf8); }
.icon-green { background: linear-gradient(135deg, #10b981, #34d399); }
.icon-purple { background: linear-gradient(135deg, #8b5cf6, #a78bfa); }
.icon-orange { background: linear-gradient(135deg, #f59e0b, #fbbf24); }
.icon-gold { background: linear-gradient(135deg, #facc15, #f59e0b); }
.stat-info h4 { margin: 0; font-size: 24px; font-weight: 900; color: #1e293b; letter-spacing: -0.5px; white-space: nowrap; }
.stat-info p { margin: 0; font-size: 13px; color: #64748b; font-weight: 600; }

.section-title { font-size: 24px; color: #1e1b4b; margin: 0 0 25px; font-weight: 800; display: flex; align-items: center; gap: 12px; }
.quick-links { display: grid; grid-template-columns: repeat(auto-fill, minmax(135px, 1fr)); gap: 15px; margin-bottom: 40px; }
.q-link { background: #fff; border-radius: 20px; padding: 22px 10px; text-align: center; text-decoration: none; color: #334155; font-weight: 700; font-size: 13px; box-shadow: 0 4px 12px rgba(0,0,0,0.02); transition: all 0.3s ease; border: 1px solid #f1f5f9; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.q-link:hover { background: var(--p-color); color: #fff; transform: translateY(-5px); box-shadow: 0 12px 25px rgba(59, 46, 133, 0.2); border-color: var(--p-color); }
.q-link i { font-size: 26px; color: #0ea5e9; transition: 0.3s; }
.q-link:hover i { color: var(--accent); transform: scale(1.1); }

.soru-bildirim-karti { background: #fff; border-radius: 20px; padding: 30px; box-shadow: 0 10px 30px rgba(0,0,0,0.04); border: 2px solid #e2e8f0; margin-bottom: 50px; position: relative; overflow: hidden; }
.soru-bildirim-karti::before { content: ''; position: absolute; left: 0; top: 0; width: 6px; height: 100%; background: linear-gradient(180deg, #f59e0b, #facc15); }
.sb-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 25px; }
.sb-header h3 { margin: 0; font-size: 20px; color: #1e293b; font-weight: 800; display: flex; align-items: center; gap: 10px; }
.sb-header h3 i { color: #f59e0b; }
.sb-note { font-size: 13px; color: #64748b; font-weight: 500; background: #f8fafc; padding: 6px 12px; border-radius: 8px; }

.sb-form { display: flex; flex-wrap: wrap; gap: 20px; align-items: flex-end; }
.sb-grup { display: flex; flex-direction: column; gap: 8px; flex: 1; min-width: 180px; }
.sb-grup label { font-size: 13px; font-weight: 700; color: #475569; }
.sb-grup select, .sb-grup input { width: 100%; padding: 14px 15px; border: 1px solid #cbd5e1; border-radius: 12px; font-size: 15px; color: #1e293b; font-weight: 600; outline: none; transition: 0.3s; background: #f8fafc; box-sizing: border-box; }
.sb-grup select:focus, .sb-grup input:focus { border-color: #f59e0b; background: #fff; box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.1); }
.sb-btn { background: #f59e0b; color: #fff; border: none; padding: 14px 30px; border-radius: 12px; font-size: 15px; font-weight: 800; cursor: pointer; transition: 0.3s; display: flex; align-items: center; gap: 8px; height: 50px; }
.sb-btn:hover { background: #d97706; transform: translateY(-2px); box-shadow: 0 8px 15px rgba(245, 158, 11, 0.2); }

.msg-box { padding: 15px 20px; border-radius: 12px; margin-bottom: 20px; font-size: 14px; font-weight: 600; display: flex; align-items: center; gap: 10px; }
.msg-success { background: #d1fae5; color: #065f46; border: 1px solid #34d399; }
.msg-error { background: #fee2e2; color: #b91c1c; border: 1px solid #f87171; }

.tasks-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 20px; margin-bottom: 50px; }
.task-card { background: #fff; border-radius: 20px; padding: 25px; box-shadow: 0 8px 20px rgba(0,0,0,0.03); border-left: 5px solid #ccc; position: relative; display: flex; flex-direction: column; justify-content: space-between; transition: all 0.3s ease; }
.task-card:hover { transform: translateY(-6px); box-shadow: 0 15px 30px rgba(0,0,0,0.08); }

.task-card.task-ders { border-left-color: #8b5cf6; } .task-card.task-ders:hover { border-left-color: #7c3aed; } 
.task-card.task-odev { border-left-color: #f59e0b; } .task-card.task-odev:hover { border-left-color: #d97706; } 
.task-card.task-sinav { border-left-color: #10b981; } .task-card.task-sinav:hover { border-left-color: #059669; } 

.task-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; border-bottom: 1px solid #f1f5f9; padding-bottom: 15px; }
.task-type { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: 1px; padding: 4px 10px; border-radius: 8px; }
.task-ders .task-type { background: #ede9fe; color: #7c3aed; }
.task-odev .task-type { background: #fef3c7; color: #d97706; }
.task-sinav .task-type { background: #d1fae5; color: #059669; }

.task-time { font-size: 13px; color: #64748b; font-weight: 600; display: flex; align-items: center; gap: 5px; }
.task-title { font-size: 18px; font-weight: 800; color: #1e293b; margin: 0 0 10px; line-height: 1.4; }
.task-desc { font-size: 14px; color: #475569; margin: 0 0 20px; line-height: 1.6; }
.task-desc i { margin-right: 5px; color: #64748b; width: 16px; text-align: center; }

.task-btn { display: block; width: 100%; padding: 12px; border-radius: 10px; text-align: center; text-decoration: none; font-weight: 700; font-size: 14px; transition: 0.3s; color: #fff; box-sizing: border-box; }
.task-ders .task-btn { background: #8b5cf6; } .task-ders .task-btn:hover { background: #7c3aed; transform: translateY(-2px); box-shadow: 0 4px 10px rgba(139, 92, 246, 0.2); }
.task-odev .task-btn { background: #f59e0b; } .task-odev .task-btn:hover { background: #d97706; transform: translateY(-2px); box-shadow: 0 4px 10px rgba(245, 158, 11, 0.2); }
.task-sinav .task-btn { background: #10b981; } .task-sinav .task-btn:hover { background: #059669; transform: translateY(-2px); box-shadow: 0 4px 10px rgba(16, 185, 129, 0.2); }

.empty-state { text-align: center; padding: 50px 20px; background: #fff; border-radius: 20px; color: #64748b; font-weight: 600; border: 2px dashed #e2e8f0; margin-bottom: 50px; }

@media (max-width: 768px) {
    .hero-section { padding: 30px; text-align: center; justify-content: center; }
    .hero-text h1 { font-size: 28px; }
    .hero-right { width: 100%; justify-content: center; }
    .sb-form { flex-direction: column; align-items: stretch; }
    .sb-btn { justify-content: center; }
    .sb-header { flex-direction: column; align-items: flex-start; gap: 10px; }
}

/* =========================================
   MODERN FORUM ÖZEL CSS (APPLE UI KONSEPTİ)
========================================= */
.forum-wrap { background-color: #f8fafc; font-family: 'Segoe UI', sans-serif; padding-top: 100px; padding-bottom: 80px; margin-bottom: -80px; min-height: 100vh; }
.forum-container { max-width: 1250px; margin: 0 auto; padding: 0 20px; }
.section-header { text-align: center; margin: 0 0 45px; }
.page-title { font-size: 28px; font-weight: 900; color: #1e1b4b; margin: 0 0 12px; display: flex; align-items: center; justify-content: center; gap: 12px; }
.page-title i { color: #3B2E85; }
.page-subtitle { font-size: 16px; color: #64748b; margin: 0; max-width: 700px; margin: 0 auto; line-height: 1.6; }
.forum-layout { display: grid; grid-template-columns: 320px 1fr; gap: 30px; align-items: start; }
@media (max-width: 992px) { .forum-layout { grid-template-columns: 1fr; } }
.sidebar-card { background: #fff; border-radius: 16px; padding: 25px; border: 1px solid #e2e8f0; box-shadow: 0 4px 15px rgba(0,0,0,0.02); margin-bottom: 25px; }
.sidebar-title { font-size: 1.1rem; font-weight: 800; color: #1e293b; margin: 0 0 20px; padding-bottom: 15px; border-bottom: 2px solid #f1f5f9; display: flex; align-items: center; gap: 10px; }
.btn-ask { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; padding: 15px; background: linear-gradient(135deg, #3B2E85 0%, #1e1b4b 100%); color: white; border-radius: 12px; font-size: 1.1rem; font-weight: 700; border: none; cursor: pointer; transition: all 0.3s; margin-bottom: 25px; box-shadow: 0 4px 15px rgba(59, 46, 133, 0.2); }
.btn-ask:hover { transform: translateY(-3px); box-shadow: 0 8px 20px rgba(59, 46, 133, 0.3); background: #facc15; color: #3B2E85; }
.cat-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.cat-item a { display: flex; align-items: center; gap: 12px; padding: 12px 15px; border-radius: 10px; color: #64748b; font-weight: 600; text-decoration: none; transition: 0.3s; background: #f8fafc; border: 1px solid transparent; }
.cat-item a:hover { background: #fff; border-color: #cbd5e1; color: #3B2E85; transform: translateX(5px); }
.cat-item.active a { background: #3B2E85; color: #facc15; border-color: #3B2E85; }
.cat-icon { width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; font-size: 1.1rem; }
.champ-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 12px; }
.champ-item { display: flex; align-items: center; justify-content: space-between; padding: 12px; background: #f8fafc; border-radius: 10px; border: 1px solid #e2e8f0; }
.champ-user { display: flex; align-items: center; gap: 10px; }
.champ-avatar { width: 35px; height: 35px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 14px; color: white; }
.champ-name { font-weight: 700; color: #1e293b; font-size: 14px; }
.champ-score { background: #e0e7ff; color: #3b82f6; padding: 4px 10px; border-radius: 20px; font-size: 12px; font-weight: 800; }
.stats-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.stat-box { text-align: center; padding: 15px; background: #f8fafc; border-radius: 12px; border: 1px solid #e2e8f0; }
.stat-num { font-size: 24px; font-weight: 900; color: #3B2E85; line-height: 1; }
.stat-text { font-size: 12px; font-weight: 700; color: #64748b; text-transform: uppercase; margin-top: 5px; }
.filter-bar { background: #fff; border-radius: 16px; padding: 20px; border: 1px solid #e2e8f0; box-shadow: 0 4px 15px rgba(0,0,0,0.02); margin-bottom: 25px; display: flex; flex-wrap: wrap; gap: 15px; align-items: center; }
.search-wrap { flex-grow: 1; display: flex; min-width: 250px; }
.search-wrap input { flex-grow: 1; padding: 12px 20px; border: 1px solid #cbd5e1; border-right: none; border-radius: 10px 0 0 10px; font-family: inherit; font-size: 14px; outline: none; }
.search-wrap button { background: #3B2E85; color: #facc15; border: none; padding: 0 25px; border-radius: 0 10px 10px 0; cursor: pointer; transition: 0.3s; }
.search-wrap button:hover { background: #1e1b4b; }
.select-wrap select { padding: 12px 15px; border: 1px solid #cbd5e1; border-radius: 10px; background: #f8fafc; font-family: inherit; font-size: 13px; font-weight: 600; color: #475569; outline: none; cursor: pointer; }
.q-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 25px; }
.q-card { background: #fff; border-radius: 16px; padding: 25px; border: 1px solid #e2e8f0; box-shadow: 0 4px 15px rgba(0,0,0,0.02); transition: 0.3s; }
.q-card:hover { transform: translateY(-3px); box-shadow: 0 10px 25px rgba(59, 46, 133, 0.05); border-color: #cbd5e1; }
.q-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 15px; gap: 15px; flex-wrap: wrap; }
.q-author { display: flex; align-items: center; gap: 12px; }
.q-avatar { width: 45px; height: 45px; border-radius: 12px; background: #facc15; color: #3B2E85; display: flex; align-items: center; justify-content: center; font-weight: 900; font-size: 16px; }
.q-author-info { display: flex; flex-direction: column; }
.q-author-name { font-weight: 800; color: #1e293b; font-size: 15px; display: flex; align-items: center; gap: 6px; }
.q-role-badge { background: #e2e8f0; color: #475569; padding: 2px 8px; border-radius: 6px; font-size: 11px; font-weight: 700; }
.q-role-teacher { background: #3B2E85; color: #facc15; }
.q-date { font-size: 12px; color: #94a3b8; font-weight: 600; margin-top: 2px; }
.q-status { padding: 6px 12px; border-radius: 8px; font-size: 12px; font-weight: 800; display: flex; align-items: center; gap: 6px; }
.status-solved { background: #dcfce7; color: #166534; border: 1px solid #bbf7d0; }
.status-waiting { background: #fef9c3; color: #854d0e; border: 1px solid #fde047; }
.q-title { font-size: 18px; font-weight: 900; color: #1e1b4b; margin: 0 0 10px 0; line-height: 1.4; }
.q-text { font-size: 15px; color: #475569; line-height: 1.6; margin-bottom: 15px; }
.q-image { max-width: 100%; border-radius: 12px; margin-bottom: 15px; border: 1px solid #e2e8f0; max-height: 400px; object-fit: contain; }
.q-tags { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 20px; }
.q-tag { background: #f8fafc; color: #64748b; border: 1px dashed #cbd5e1; padding: 4px 10px; border-radius: 6px; font-size: 12px; font-weight: 700; }
.q-actions { display: flex; gap: 12px; flex-wrap: wrap; border-top: 1px solid #f1f5f9; padding-top: 15px; }
.action-btn { display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px; border-radius: 8px; font-size: 13px; font-weight: 700; background: #fff; border: 1px solid #e2e8f0; color: #64748b; cursor: pointer; transition: 0.3s; }
.action-btn:hover:not([disabled]) { background: #f8fafc; border-color: #cbd5e1; color: #1e293b; transform: translateY(-2px); }
.action-btn.active { background: rgba(59, 46, 133, 0.05); border-color: #3B2E85; color: #3B2E85; }
.answers-wrap { margin-top: 20px; padding-left: 20px; border-left: 3px solid #e2e8f0; display: flex; flex-direction: column; gap: 15px; }
.answer-card { background: #f8fafc; border-radius: 12px; padding: 20px; border: 1px solid #f1f5f9; position: relative; }
.answer-teacher { background: #fff; border: 2px solid #3B2E85; box-shadow: 0 4px 15px rgba(59, 46, 133, 0.05); }
.teacher-ribbon { position: absolute; top: -12px; right: 20px; background: #facc15; color: #3B2E85; font-weight: 900; font-size: 11px; padding: 4px 12px; border-radius: 20px; box-shadow: 0 2px 5px rgba(0,0,0,0.1); }
.reply-form-wrap { margin-top: 15px; display: none; background: #fff; padding: 20px; border-radius: 12px; border: 1px solid #e2e8f0; box-shadow: inset 0 2px 5px rgba(0,0,0,0.02); }
.reply-form-wrap.open { display: block; animation: fadeIn 0.3s; }
.reply-textarea { width: 100%; padding: 15px; border: 1px solid #cbd5e1; border-radius: 8px; font-family: inherit; font-size: 14px; outline: none; margin-bottom: 15px; min-height: 80px; resize: vertical; box-sizing: border-box; }
.modal-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(15, 23, 42, 0.7); z-index: 100005; backdrop-filter: blur(5px); overflow-y: auto; padding: 40px 15px; box-sizing: border-box; }
.modal-box { background: #fff; padding: 30px; border-radius: 20px; width: 100%; max-width: 650px; position: relative; margin: 0 auto; box-shadow: 0 25px 50px -12px rgba(0,0,0,0.3); box-sizing: border-box; animation: slideDown 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); }
@keyframes slideDown { from { transform: translateY(-50px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.modal-close { position: absolute; top: 20px; right: 20px; background: #f1f5f9; border: none; width: 35px; height: 35px; border-radius: 50%; font-size: 1.2rem; cursor: pointer; color: #64748b; transition: 0.3s; }
.modal-close:hover { background: #ef4444; color: white; transform: rotate(90deg); }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 20px; }
@media (max-width: 576px) { .form-row { grid-template-columns: 1fr; gap: 15px; } }
.m-group label { display: block; font-weight: 700; color: #334155; margin-bottom: 8px; font-size: 14px; }
.m-group input, .m-group select, .m-group textarea { width: 100%; padding: 12px 15px; border: 1px solid #cbd5e1; border-radius: 10px; font-family: inherit; outline: none; transition: 0.3s; background: #f8fafc; box-sizing: border-box;}
.m-group input:focus, .m-group select:focus, .m-group textarea:focus { border-color: #3B2E85; background: #fff; box-shadow: 0 0 0 3px rgba(59, 46, 133, 0.1); }
.file-upload-box { border: 2px dashed #cbd5e1; padding: 30px; border-radius: 12px; text-align: center; cursor: pointer; transition: 0.3s; background: #f8fafc; margin-bottom: 20px; }
.file-upload-box:hover { border-color: #3B2E85; background: rgba(59, 46, 133, 0.02); }
.file-upload-box i { font-size: 2.5rem; color: #94a3b8; margin-bottom: 10px; transition: 0.3s; }
.file-upload-box:hover i { color: #3B2E85; }

/* =========================================
   PREMIUM VELİ PANELİ TASARIMI
========================================= */
body.veli-paneli-body { background-color: #f8fafc; font-family: 'Segoe UI', sans-serif; margin: 0; padding: 0; overflow-x: hidden; }
body.veli-paneli-body #content, body.veli-paneli-body .site-content, body.veli-paneli-body .site-main { padding: 0 !important; margin: 0 !important; width: 100%; overflow-x: hidden; }

.veli-navbar { background: linear-gradient(135deg, #3B2E85 0%, #1e1b4b 100%); padding: 15px 30px; display: flex; justify-content: space-between; align-items: center; box-shadow: 0 4px 15px rgba(0,0,0,0.1); border-bottom: 3px solid #facc15; }
.veli-navbar strong { color: white; font-size: 1.2rem; display: flex; align-items: center; gap: 10px;}
.veli-navbar a.cikis { background: rgba(255,255,255,0.1); color: white; text-decoration: none; font-weight: 700; padding: 8px 15px; border-radius: 8px; transition: 0.3s; border: 1px solid rgba(255,255,255,0.2); }

.veli-dashboard { max-width: 1250px; margin: 40px auto; padding: 0 20px; box-sizing: border-box; }
.veli-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px; flex-wrap: wrap; gap: 15px; }
.veli-header h1 { margin: 0; font-size: 24px; font-weight: 900; color: #1e293b; display: flex; align-items: center; gap: 10px; }

/* Veli Kartları */
.stats-summary-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-bottom: 35px; }
@media (max-width: 992px) { .stats-summary-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 576px) { .stats-summary-grid { grid-template-columns: 1fr; } }

.stat-badge-card { background: white; border-radius: 16px; padding: 25px 20px; display: flex; align-items: center; gap: 15px; border: 1px solid #e2e8f0; box-shadow: 0 4px 15px rgba(0,0,0,0.02); transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); position: relative; overflow: hidden; cursor: default; }
.stat-badge-card:hover { transform: translateY(-8px); box-shadow: 0 15px 35px rgba(59, 46, 133, 0.08); border-color: #3B2E85; }
.stat-badge-card::after { content: ''; position: absolute; right: -20px; bottom: -20px; width: 100px; height: 100px; background: radial-gradient(circle, rgba(250, 204, 21, 0.15) 0%, transparent 70%); border-radius: 50%; }

.stat-badge-card .stat-icon { width: 55px; height: 55px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 24px; color: white; flex-shrink: 0; z-index: 2;}
.stat-badge-card .stat-info { z-index: 2; }
.stat-badge-card .stat-info h4 { margin: 0; font-size: 12px; color: #64748b; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px;}
.stat-badge-card .stat-info span { font-size: 24px; font-weight: 900; color: #1e293b; display: block; margin-top: 2px; }

/* Veli Ana İçerik */
.dashboard-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; width: 100%; box-sizing: border-box;}
@media (max-width: 992px) { .dashboard-grid { grid-template-columns: 1fr; } }

.dashboard-card { background: white; border-radius: 16px; padding: 30px; border: 1px solid #e2e8f0; box-shadow: 0 4px 15px rgba(0,0,0,0.02); margin-bottom: 30px; height: fit-content; transition: 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);}
.dashboard-card:hover { transform: translateY(-5px); box-shadow: 0 10px 25px rgba(59, 46, 133, 0.06); border-color: #cbd5e1; }
.dashboard-card h2 { margin-top:0; border-bottom: 2px solid #f1f5f9; padding-bottom: 15px; font-size: 1.2rem; font-weight: 800; color: #1e1b4b; display: flex; align-items: center; gap: 10px; }

.student-title { margin:0 0 15px 0; font-size: 1.4rem; color: #3B2E85; font-weight: 800; }
.kocluk-notu-box { background: #fffbeb; border: 1px solid #fde047; border-left: 5px solid #facc15; padding: 20px; border-radius: 12px; margin-top: 15px; }
.btn-analiz { display:block; text-align:center; background: #3B2E85; color:white; padding:15px; border-radius:12px; text-decoration:none; font-weight: 700; transition: 0.3s; margin-top: 20px;}

.randevu-liste-item { background: #f8fafc; border: 1px solid #e2e8f0; padding: 15px 20px; border-radius: 12px; margin-top: 15px; display: flex; justify-content: space-between; align-items: center; transition: 0.3s;}
.btn-zoom { background: #22c55e; color: white; padding: 8px 15px; border-radius: 8px; text-decoration: none; font-size: 13px; font-weight: 800; transition: 0.3s; }

.form-group { margin-bottom: 18px; }
.form-group label { display: block; margin-bottom: 8px; font-weight: 700; color: #475569; font-size: 14px;}
.form-group input, .form-group select, .form-group textarea { width: 100%; padding: 12px 15px; border: 1px solid #cbd5e1; border-radius: 10px; background: #f8fafc; font-family: inherit; outline: none; transition: 0.3s; box-sizing: border-box;}
.btn-randevu { background: #3B2E85; color: white; border: none; padding: 15px 20px; width: 100%; border-radius: 10px; font-weight: 800; font-size: 15px; cursor: pointer; transition: 0.3s;}

/* RUTİN GÖREVLER KUTUSU */
.veli-rutin-modul { background:#fff; border-radius:16px; box-shadow:0 4px 15px rgba(0,0,0,0.02); padding:30px; margin-top:10px; border:1px solid #e2e8f0; margin-bottom: 50px;}
.rutin-header-flex { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:15px; margin-bottom: 20px; border-bottom: 2px solid #f1f5f9; padding-bottom: 15px;}
.rutin-header-flex h3 { margin:0; color:#1e1b4b; font-size: 1.4rem; font-weight: 800; display: flex; align-items: center; gap: 10px;}

.onay-bilgi-kutusu { background: #f8fafc; border: 1px dashed #cbd5e1; border-radius: 12px; padding: 20px; margin-bottom: 25px; display: flex; flex-direction: column; gap: 12px; }
.onay-renkleri { display:flex; gap: 20px; flex-wrap: wrap; font-size: 13px; color: #475569; }
.renk-item { display:flex; align-items:center; gap:8px; }
.r-kutu { display:inline-block; min-width:18px; height:18px; border-radius:4px; }

/* Masaüstü Tablo */
.desktop-table-wrapper { width: 100%; overflow: visible; border-radius: 12px; }
.veli-rutin-table { width:100%; border-collapse: collapse; }
.veli-rutin-table th, .veli-rutin-table td { padding: 12px; border: 1px solid #e2e8f0; text-align:center; vertical-align:middle; }
.veli-rutin-table th { background: #3B2E85; color: white; font-size: 13px; font-weight: 700; white-space: nowrap;}
.ders-baslik { font-weight: 800; font-size: 14px; color: #1e293b; background:#f8fafc; }

/* Onay Kutusu (Butonlar) */
.durum-kutu { padding: 10px; border-radius: 8px; font-size:11px; font-weight:bold; text-align:center; transition:all 0.3s; height: 100%; display: flex; flex-direction: column; justify-content: center; cursor: pointer; box-shadow: 0 2px 4px rgba(0,0,0,0.02);}
.durum-kutu:hover { transform: scale(1.05); }
.kutu-gri { background: #f8fafc; color: #64748b; border: 2px solid #cbd5e1; }
.kutu-sari { background: #fef08a; color: #854d0e; border: 2px solid #facc15; animation: pulseSari 2s infinite; }
.kutu-yesil { background: #dcfce7; color: #166534; border: 2px solid #22c55e; }
@keyframes pulseSari { 0% { box-shadow: 0 0 0 0 rgba(250, 204, 21, 0.5); } 70% { box-shadow: 0 0 0 8px rgba(250, 204, 21, 0); } 100% { box-shadow: 0 0 0 0 rgba(250, 204, 21, 0); } }

/* MOBİL AKORDİYON TASARIMI (Video ile %100 Uyumlu) */
.mobile-accordion-wrapper { display: none; }

@media (max-width: 992px) {
    .desktop-table-wrapper { display: none; } 
    .mobile-accordion-wrapper { display: flex; flex-direction: column; gap: 15px; } 
    
    .m-accordion-item { background: #fff; border-radius: 12px; overflow: hidden; border: 1px solid #e2e8f0; }
    .m-accordion-header { background: #3B2E85; color: white; padding: 15px 20px; font-size: 16px; font-weight: 800; display: flex; justify-content: space-between; align-items: center; cursor: pointer; }
    .m-accordion-header.active { background: #2f246b; border-bottom: 3px solid #facc15; }
    .m-accordion-header i { transition: transform 0.3s; }
    .m-accordion-header.active i { transform: rotate(180deg); }
    
    .m-accordion-content { display: none; padding: 15px; background: #f8fafc; }
    .m-accordion-content.active { display: block; animation: fadeIn 0.3s ease; }
    
    .m-task-card { background: #fff; border-radius: 10px; padding: 15px; margin-bottom: 10px; border-left: 4px solid #facc15; box-shadow: 0 2px 8px rgba(0,0,0,0.04); display: flex; justify-content: space-between; align-items: center; gap: 15px;}
    .m-task-card:last-child { margin-bottom: 0; }
    .m-task-info { flex-grow: 1; }
    .m-task-title { font-size: 14px; font-weight: 800; color: #1e293b; margin-bottom: 5px; }
    .m-task-desc { font-size: 12px; color: #64748b; }
    
    .durum-kutu { min-width: 90px; margin: 0; padding: 8px; flex-direction: column; }
}
@keyframes fadeIn { from { opacity: 0; transform: translateY(-5px); } to { opacity: 1; transform: translateY(0); } }

/* =========================================
   GELİŞMİŞ DENEME ANALİZLERİ TASARIMI
========================================= */
.lgs-analiz-wrapper { background-color: #f8fafc; font-family: 'Segoe UI', sans-serif; padding-top: 100px; padding-bottom: 80px; margin-bottom: -80px; min-height: 100vh; width: 100%; overflow-x: hidden; box-sizing: border-box; }
.container-analiz { max-width: 1250px; margin: 0 auto; padding: 0 15px; width: 100%; box-sizing: border-box; }

.analiz-card { background: #fff; border-radius: 16px; padding: 25px; border: 1px solid #e2e8f0; box-shadow: 0 4px 15px rgba(0,0,0,0.02); transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); width: 100%; box-sizing: border-box; margin-bottom: 25px; }
.analiz-card:hover { transform: translateY(-5px); box-shadow: 0 15px 35px rgba(59, 46, 133, 0.08); border-color: #3B2E85; }

.student-header-card { background: linear-gradient(135deg, #3B2E85 0%, #1e1b4b 100%); border-radius: 20px; padding: 30px; color: white; margin-bottom: 30px; border-bottom: 5px solid #facc15; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 20px; width: 100%; box-sizing: border-box; }
.rank-badge-box { background: rgba(0,0,0,0.25); border: 1px solid rgba(250, 204, 21, 0.4); padding: 12px 25px; border-radius: 50px; display: flex; align-items: center; gap: 12px; color: #facc15; box-shadow: inset 0 0 15px rgba(250, 204, 21, 0.1); }
.rank-badge-box i { font-size: 1.4rem; }
.rank-badge-box span { font-size: 15px; font-weight: 600; }

.analiz-stats-row { display: grid; grid-template-columns: repeat(5, 1fr); gap: 15px; margin-bottom: 30px; width: 100%; }
.analiz-stat-card { background: white; border-radius: 16px; padding: 20px; display: flex; align-items: center; gap: 15px; border: 1px solid #e2e8f0; transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); box-shadow: 0 4px 6px rgba(0,0,0,0.02); }
.analiz-stat-card:hover { transform: translateY(-5px); border-color: #3B2E85; box-shadow: 0 10px 20px rgba(59, 46, 133, 0.1); }
.a-stat-icon { width: 45px; height: 45px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 20px; color: white; flex-shrink: 0; }
.a-stat-info h4 { margin: 0; font-size: 10px; color: #64748b; font-weight: 700; text-transform: uppercase; }
.a-stat-info span { font-size: 18px; font-weight: 800; color: #1e293b; display: block; }

.analiz-grid { display: grid; grid-template-columns: 350px 1fr; gap: 30px; width: 100%; box-sizing: border-box; }

.analiz-tabs { display: flex; flex-wrap: wrap; gap: 10px; border-bottom: 2px solid #f1f5f9; margin-bottom: 25px; padding-bottom: 10px; width: 100%; }
.a-tab { flex: 1 1 calc(25% - 10px); text-align: center; padding: 12px 10px; cursor: pointer; font-weight: 700; color: #64748b; font-size: 14px; border-bottom: 3px solid transparent; transition: 0.3s; background: #fff; border-radius: 8px 8px 0 0; }
.a-tab:hover { color: #3B2E85; background: #f8fafc; }
.a-tab.active { color: #3B2E85; border-bottom-color: #facc15; background: #f8fafc; }
.tab-content { display: none; width: 100%; box-sizing: border-box; }
.tab-content.active { display: block; animation: fadeIn 0.4s ease; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }

.div-table-wrapper { width: 100%; border-radius: 12px; border: 1px solid #e2e8f0; background: #fff; overflow: hidden; }
.div-table { display: flex; flex-direction: column; width: 100%; }
.div-table-header { display: flex; background-color: #f8fafc; border-bottom: 2px solid #e2e8f0; font-weight: 800; color: #3B2E85; font-size: 13px; }
.div-table-row { display: flex; border-bottom: 1px solid #f1f5f9; transition: background 0.2s; align-items: center; }
.div-table-row:hover { background-color: #f8fafc; }
.div-col { padding: 15px 12px; display: flex; align-items: center; }
.col-tarih { flex: 1.2; font-size: 12px; color: #64748b; }
.col-ad { flex: 2; font-weight: 700; font-size: 14px; color: #1e293b; }
.col-stat { flex: 0.8; font-weight: 800; justify-content: center; }
.col-puan { flex: 1; justify-content: flex-end; }

.history-card { background: #f8fafc; border-radius: 12px; padding: 15px; border-left: 5px solid #3B2E85; display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275); box-shadow: 0 2px 5px rgba(0,0,0,0.01); }
.history-card:hover { transform: translateX(5px); background: #fff; box-shadow: 0 8px 20px rgba(59, 46, 133, 0.08); }

@media (max-width: 992px) { .analiz-grid { grid-template-columns: 1fr; } .analiz-stats-row { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 768px) {
    .analiz-stats-row { grid-template-columns: repeat(2, 1fr); }
    .analiz-stat-card { padding: 15px; flex-direction: column; text-align: center; }
    .student-header-card { padding: 20px; text-align: center; flex-direction: column; }
    .rank-badge-box { flex-direction: column; padding: 15px; width: 100%; }
    .a-tab { flex: 1 1 calc(50% - 10px); }
    .hide-on-mobile { display: none !important; }
    .div-col { padding: 12px 8px; }
    .col-ad { font-size: 13px; }
}
.chart-container { position: relative; height: 320px; width: 100%; }

/* =========================================
   DİJİTAL HATA DEFTERİ TASARIMI
========================================= */
.hd-container { max-width: 1140px; margin: 40px auto 100px; padding: 0 15px; width: 100%; box-sizing: border-box; }
.hd-main-header { margin-bottom: 35px; border-left: 5px solid #3B2E85; padding-left: 20px; }
.hd-main-header h1 { font-size: 28px; font-weight: 900; color: #1e1b4b; margin: 0; }
.hd-main-header p { color: #64748b; margin: 5px 0 0 0; font-size: 15px; }

.deneme-card { background: #fff; border-radius: 16px; box-shadow: 0 10px 30px rgba(0,0,0,0.02); border: 1px solid #e2e8f0; margin-bottom: 30px; width: 100%; box-sizing: border-box; }
.deneme-header { background: linear-gradient(135deg, #3B2E85 0%, #1e1b4b 100%); padding: 22px 25px; display: flex; justify-content: space-between; align-items: center; color: #fff; border-radius: 16px 16px 0 0; border-bottom: 4px solid #facc15; }
.deneme-header h2 { font-size: 18px; font-weight: 800; margin: 0; display: flex; align-items: center; gap: 12px; }
.deneme-header h2 i { color: #facc15; }

.btn-deneme-indir { background: rgba(255,255,255,0.15); border: 1px solid rgba(255,255,255,0.3); color: #fff; padding: 8px 16px; border-radius: 8px; font-size: 13px; font-weight: 700; cursor: pointer; transition: 0.3s; display: flex; align-items: center; gap: 8px; }
.btn-deneme-indir:hover { background: #facc15; color: #1e1b4b; border-color: #facc15; }

.hd-container .div-table-wrapper { width: 100%; border-radius: 0 0 16px 16px; background: #fff; overflow: hidden; }
.hd-container .div-table-header { text-transform: uppercase; }
.hd-container .col-ders { flex: 1.5; font-size: 14px; color: #1e293b; font-weight: 700; }
.hd-container .col-no { flex: 1; font-weight: 800; color: #3B2E85; font-size: 14px; }
.hd-container .col-konu { flex: 2.5; font-size: 13px; color: #64748b; justify-content: center; text-align: center; }
.hd-container .col-dogru { flex: 1; justify-content: center; }
.hd-container .col-senin { flex: 1; justify-content: center; }
.hd-container .col-detay { flex: 1.5; justify-content: center; }
.hd-container .col-durum { flex: 1.5; justify-content: center; }

.c-badge { display: inline-flex; width: 32px; height: 32px; align-items: center; justify-content: center; border-radius: 8px; font-weight: 800; font-size: 14px; box-shadow: 0 2px 5px rgba(0,0,0,0.05); }
.cb-dogru { background: #10b981; color: #fff; }
.cb-yanlis { background: #ef4444; color: #fff; }
.cb-bos { background: #e2e8f0; color: #64748b; }

.btn-incele { background: #f1f5f9; border: 1px solid #cbd5e1; color: #3B2E85; padding: 7px 14px; border-radius: 6px; font-size: 12px; font-weight: 800; cursor: pointer; transition: 0.2s; display: inline-flex; align-items: center; gap: 6px; }
.btn-incele:hover { background: #3B2E85; color: #fff; border-color: #3B2E85; transform: translateY(-2px); }

.btn-ogrendim-islem { background: #fff; border: 2px solid #10b981; color: #10b981; padding: 7px 14px; border-radius: 6px; font-size: 12px; font-weight: 800; cursor: pointer; transition: 0.3s; }
.btn-ogrendim-islem:hover { background: #10b981; color: #fff; }

.hd-container .div-table-row.is-learned { opacity: 0.4; filter: grayscale(1); background: #f8fafc; }
.hd-container .div-table-row.is-learned .btn-ogrendim-islem { background: #10b981; color: #fff; }

.hd-pagination { display: flex; justify-content: center; gap: 10px; margin-top: 40px; }
.p-link { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border-radius: 10px; background: white; border: 1px solid #e2e8f0; color: #3B2E85; text-decoration: none; font-weight: 800; transition: 0.3s; }
.p-link.active { background: #3B2E85; color: white; border-color: #3B2E85; box-shadow: 0 4px 10px rgba(59, 46, 133, 0.2); }
.p-link:hover:not(.active) { background: #f8fafc; transform: translateY(-2px); }

/* Modal Tasarımı */
.custom-modal { display: none; position: fixed; z-index: 999999 !important; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(15, 23, 42, 0.85); backdrop-filter: blur(5px); align-items: center; justify-content: center; padding: 20px; box-sizing: border-box; }
.modal-icerik { background: #fff; padding: 25px; border-radius: 16px; width: 100%; max-width: 750px; max-height: 90vh; display: flex; flex-direction: column; box-shadow: 0 25px 50px rgba(0,0,0,0.25); text-align: center; position: relative; box-sizing: border-box; margin: auto; }
.btn-modal-kapat { position: absolute; top: 15px; right: 15px; font-size: 20px; color: #64748b; cursor: pointer; transition: 0.2s; background: #f1f5f9; border: none; width: 38px; height: 38px; border-radius: 50%; display: flex; align-items: center; justify-content: center; z-index: 10; }
.btn-modal-kapat:hover { background: #ef4444; color: #fff; transform: scale(1.1); }
.modal-baslik-metni { margin: 0 0 15px 0; color: #1e293b; font-size: 20px; font-weight: 800; flex-shrink: 0; display: flex; align-items: center; justify-content: center; gap: 10px; }
.modal-cevap-bilgisi { display: flex; justify-content: center; gap: 15px; margin-bottom: 15px; flex-shrink: 0; flex-wrap: wrap; }
.m-cevap-kutu { background: #f8fafc; border: 1px solid #e2e8f0; padding: 10px 20px; border-radius: 10px; font-size: 14px; font-weight: 600; color: #475569; display: flex; align-items: center; gap: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.02); }
.modal-gorsel-wrap { overflow-y: auto; border-radius: 8px; border: 1px solid #e2e8f0; padding: 10px; background: #f8fafc; flex: 1 1 auto; min-height: 0; box-sizing: border-box; display: flex; align-items: flex-start; justify-content: center; position: relative; }
.modal-gorsel-wrap img { max-width: 100%; height: auto; display: block; border-radius: 6px; }

@media (max-width: 768px) {
    .hd-main-header { text-align: center; border-left: none; padding-left: 0; }
    .deneme-header { flex-direction: column; gap: 15px; text-align: center; padding: 20px; }
    .btn-deneme-indir { width: 100%; justify-content: center; }
    .hd-container .hide-on-mobile { display: none !important; }
    .hd-container .div-col { padding: 12px 10px; font-size: 13px; }
    .hd-container .col-no { flex: 1; }
    .hd-container .col-konu { flex: 2; text-align: center; font-size: 12px; line-height: 1.4; color: #64748b; }
    .hd-container .col-detay { flex: 1.2; justify-content: flex-end; }
    .modal-cevap-bilgisi { flex-direction: column; gap: 8px; }
}

/* =========================================
   ÖDEV TAKİP SİSTEMİ TASARIMI
========================================= */
.odev-container { max-width: 1100px; margin: 40px auto 100px; padding: 0 20px; }

/* Kahraman Alanı (Hero) */
.odev-hero { background: linear-gradient(135deg, var(--p-color) 0%, var(--s-color) 100%); border-radius: 20px; padding: 40px; color: #fff; box-shadow: 0 15px 30px rgba(59, 46, 133, 0.2); margin-bottom: 30px; position: relative; overflow: hidden; }
.odev-hero h1 { margin: 0 0 15px; font-size: 32px; font-weight: 800; display: flex; align-items: center; gap: 15px; }
.odev-hero h1 i { color: var(--accent); }
.info-box { background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.2); padding: 20px; border-radius: 12px; backdrop-filter: blur(5px); }
.info-box p { margin: 0; font-size: 15px; line-height: 1.6; opacity: 0.95; }

/* Filtreleme Alanı */
.filter-section { background: #fff; border-radius: 16px; padding: 20px; margin-bottom: 30px; box-shadow: 0 4px 15px rgba(0,0,0,0.03); border: 1px solid #f0f4f8; display: flex; flex-wrap: wrap; gap: 15px; align-items: center; }
.filter-section select { flex: 1; min-width: 150px; padding: 12px 15px; border: 1px solid #e2e8f0; border-radius: 10px; font-size: 14px; color: #475569; font-weight: 600; background-color: #f8fafc; outline: none; transition: 0.3s; cursor: pointer; }
.filter-section select:hover, .filter-section select:focus { border-color: var(--p-color); background-color: #fff; }
.btn-clear { background: #f1f5f9; color: #475569; border: none; padding: 12px 20px; border-radius: 10px; font-weight: 700; cursor: pointer; transition: 0.3s; display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.btn-clear:hover { background: #e2e8f0; color: #1e293b; }

/* Masaüstü Tablo Görünümü */
.table-wrapper { background: #fff; border-radius: 20px; padding: 30px; box-shadow: 0 5px 20px rgba(0,0,0,0.03); border: 1px solid #f0f4f8; overflow-x: auto; }
.odev-table { width: 100%; border-collapse: collapse; min-width: 700px; }
.odev-table th { background: #f8fafc; color: #475569; padding: 18px 15px; text-align: left; font-weight: 700; font-size: 13px; text-transform: uppercase; border-bottom: 2px solid #e2e8f0; }
.odev-table td { padding: 20px 15px; border-bottom: 1px solid #f1f5f9; vertical-align: middle; color: #334155; }
.odev-table tr:last-child td { border-bottom: none; }
.odev-table tr:hover td { background-color: #f8fafc; }

/* Etiketler ve Hücre Stilleri */
.badge-zaman { display: inline-block; background: #e0e7ff; color: #4f46e5; padding: 4px 10px; border-radius: 6px; font-size: 12px; font-weight: 700; margin-bottom: 5px; }
.gun-text { display: block; font-weight: 800; color: #1e293b; font-size: 15px; }
.ders-text { font-size: 15px; font-weight: 800; display: inline-flex; align-items: center; gap: 8px; }
.ders-text::before { content: ''; display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--p-color); }
.kitap-text { display: block; font-weight: 700; color: #1e293b; margin-bottom: 4px; font-size: 14px; }
.sayfa-text { display: inline-block; background: #f1f5f9; padding: 4px 8px; border-radius: 6px; font-size: 12px; font-weight: 600; color: #64748b; }

/* Butonlar */
.btn-gonder { background: #0ea5e9; color: #fff; padding: 10px 20px; border-radius: 10px; text-decoration: none; font-weight: 700; font-size: 13px; transition: 0.3s; display: inline-flex; align-items: center; gap: 8px; box-shadow: 0 4px 10px rgba(14, 165, 233, 0.2); white-space: nowrap; }
.btn-gonder:hover { background: #0284c7; transform: translateY(-2px); color: #fff; }
.btn-pasif { background: #f1f5f9; color: #94a3b8; padding: 10px 20px; border-radius: 10px; font-size: 13px; font-weight: 600; display: inline-flex; align-items: center; gap: 8px; cursor: not-allowed; white-space: nowrap; }

/* Mobil Kart Görünümü */
.mobile-cards { display: none; flex-direction: column; gap: 15px; }
.m-card { background: #fff; border-radius: 16px; padding: 20px; border: 1px solid #e2e8f0; box-shadow: 0 4px 10px rgba(0,0,0,0.02); display: flex; flex-direction: column; gap: 15px; }
.m-card-header { display: flex; justify-content: space-between; align-items: flex-start; border-bottom: 1px solid #f1f5f9; padding-bottom: 12px; }
.m-card-ders { font-size: 16px; font-weight: 800; color: #1e293b; }
.m-card-zaman { text-align: right; }
.m-card-body { padding-bottom: 5px; }
.no-results-msg { text-align: center; padding: 50px 20px; color: #64748b; font-weight: 500; display: none; background: #fff; border-radius: 16px; border: 2px dashed #e2e8f0; }

@media (max-width: 768px) {
    .odev-hero { padding: 30px 20px; text-align: center; }
    .odev-hero h1 { justify-content: center; font-size: 26px; }
    .table-wrapper { display: none; }
    .mobile-cards { display: flex; }
}

/* =========================================
   ÖĞRENCİ RUTİN GÖREVLER TASARIMI
========================================= */
.rutin-container { max-width: 1300px; margin: 40px auto; padding: 0 20px; }
.rutin-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px; background: #fff; padding: 20px 30px; border-radius: 12px; box-shadow: 0 4px 6px rgba(0,0,0,0.05); }

/* Masaüstü Tablo Tasarımı */
.rutin-table-wrapper { overflow-x: auto; background: #fff; border-radius: 12px; box-shadow: 0 4px 15px rgba(0,0,0,0.05); display: block; }
.rutin-table { width: 100%; border-collapse: collapse; text-align: center; }
.rutin-table th { background: #3B2E85; color: #fff; padding: 15px; font-weight: 600; }
.rutin-table td { padding: 12px; border: 1px solid #e2e8f0; vertical-align: middle; }

/* Dersleri birbirinden ayıran ince ve KESİN çizgiler (Sınır Çakışması Korumalı) */
.ders-ayrac td { border-top: 1px solid #475569 !important; box-shadow: inset 0 1px 0 0 #475569 !important; }
.ders-baslik { font-weight: 800; color: #1e293b; background: #f1f5f9; text-transform: uppercase; border-right: 1px solid #475569 !important; }
.yayin-baslik { font-weight: 600; color: #475569; font-size: 14px; }

/* Etkileşimli Kutucuklar (Görev Butonları) */
.gorev-btn { width: 100%; min-height: 40px; border: 2px solid transparent; border-radius: 8px; background: #f1f5f9; color: #64748b; font-weight: 600; font-size: 13px; cursor: pointer; transition: all 0.2s; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 5px; }
.gorev-btn:hover:not(.locked):not(.status-2) { background: #e2e8f0; border-color: #cbd5e1; transform: translateY(-2px); }

/* Durum Renkleri */
.status-1 { background: #fef08a !important; color: #854d0e !important; border-color: #facc15 !important; } /* SARI - Onay Bekliyor */
.status-2 { background: #bbf7d0 !important; color: #166534 !important; border-color: #22c55e !important; cursor: not-allowed; } /* YEŞİL - Onaylandı */
.locked { opacity: 0.6; cursor: not-allowed; background: #f8fafc !important; border: 1px dashed #cbd5e1 !important; }
.status-icon { font-size: 14px; margin-top: 4px; }

/* Mobil Akordeon Tasarımı (Telefonda Görünür) */
.rutin-mobil-wrapper { display: none; }
.mobil-gun-kart { background: #fff; margin-bottom: 15px; border-radius: 12px; box-shadow: 0 2px 8px rgba(0,0,0,0.05); overflow: hidden; }
.mobil-gun-baslik { background: #3B2E85; color: #fff; padding: 15px 20px; font-weight: 600; cursor: pointer; display: flex; justify-content: space-between; }
.mobil-gorev-liste { padding: 15px; display: none; }
.mobil-gorev-item { display: flex; justify-content: space-between; align-items: center; padding: 12px; border-bottom: 1px solid #f1f5f9; }
.mobil-gorev-item:last-child { border-bottom: none; }
.mobil-gorev-detay { display: flex; flex-direction: column; }
.mobil-gorev-btn { width: 100px; padding: 8px; border-radius: 6px; border: none; font-weight: bold; font-size: 12px; cursor: pointer; }

@media (max-width: 992px) {
    .rutin-table-wrapper { display: none; }
    .rutin-mobil-wrapper { display: block; }
    .rutin-header { flex-direction: column; gap: 15px; text-align: center; }
}

/* =========================================
   SORU TAKİP LİGİ TASARIMI
========================================= */
.sl-container { max-width: 1300px; margin: 40px auto 100px; padding: 0 20px; }

/* ÜST BAŞLIK VE FİLTRE */
.sl-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px; flex-wrap: wrap; gap: 20px; }
.sl-title { display: flex; align-items: center; gap: 15px; }
.sl-title i { font-size: 36px; color: var(--accent); background: #fff; padding: 15px; border-radius: 16px; box-shadow: 0 5px 15px rgba(0,0,0,0.05); }
.sl-title h1 { margin: 0; font-size: 28px; color: #1e1b4b; font-weight: 900; }
.sl-title p { margin: 5px 0 0 0; color: #64748b; font-size: 15px; font-weight: 600; }

.sl-filter form { display: flex; align-items: center; gap: 10px; background: #fff; padding: 8px 15px; border-radius: 12px; box-shadow: 0 4px 10px rgba(0,0,0,0.02); border: 1px solid #e2e8f0; }
.sl-filter input[type="month"] { border: none; outline: none; font-size: 15px; font-weight: 700; color: #1e293b; background: transparent; cursor: pointer; }
.sl-filter button { background: var(--p-color); color: #fff; border: none; padding: 8px 15px; border-radius: 8px; font-weight: 700; cursor: pointer; transition: 0.3s; }
.sl-filter button:hover { background: var(--s-color); }

/* YATAY LİDERLİK KARTLARI KAPSAYICISI */
.leaders-dashboard { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 40px; }

.leader-category { 
    background: #fff; border-radius: 20px; padding: 25px; 
    box-shadow: 0 5px 20px rgba(0,0,0,0.03); 
    border: 1px solid #f0f4f8; border-left: 6px solid #cbd5e1; 
    transition: all 0.3s ease;
}
.leader-category:hover { box-shadow: 0 10px 25px rgba(0,0,0,0.06); }

.cat-champions { border-left-color: #facc15; } 
.cat-daily { border-left-color: #ef4444; } 

.lc-title { font-size: 16px; font-weight: 800; color: #1e293b; margin-bottom: 25px; display: flex; align-items: center; gap: 10px; text-transform: uppercase; letter-spacing: 0.5px; }
.lc-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; }

.l-card { 
    background: #fff; border-radius: 16px; padding: 18px 15px; 
    display: flex; align-items: center; gap: 15px; 
    box-shadow: 0 4px 15px rgba(0,0,0,0.03); border: 1px solid #f0f4f8; 
    transition: all 0.3s ease; 
}
.l-card:hover { 
    transform: translateY(-6px); 
    box-shadow: 0 12px 25px rgba(59, 46, 133, 0.08); 
    border-color: #cbd5e1; 
}

.l-icon { 
    width: 48px; height: 48px; border-radius: 14px; 
    display: flex; align-items: center; justify-content: center; 
    font-size: 22px; font-weight: 900; color: #fff; flex-shrink: 0; 
    box-shadow: 0 4px 10px rgba(0,0,0,0.1); 
}
.icon-1 { background: linear-gradient(135deg, #facc15, #f59e0b); } 
.icon-2 { background: linear-gradient(135deg, #cbd5e1, #94a3b8); color: #1e293b; } 
.icon-3 { background: linear-gradient(135deg, #fb923c, #ea580c); } 
.icon-empty { background: #f1f5f9; color: #cbd5e1; box-shadow: none; }

.l-info { display: flex; flex-direction: column; justify-content: center; flex-grow: 1; overflow: hidden; }
.l-info h4 { margin: 0 0 2px; font-size: 22px; font-weight: 900; color: #1e293b; display: flex; align-items: center; gap: 6px; }
.l-info p { margin: 0; font-size: 13px; color: #64748b; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.l-subj { font-size: 11px; font-weight: 800; padding: 2px 6px; border-radius: 6px; }

/* MASAÜSTÜ VE MOBİL TABLO MATRİSİ */
.matrix-wrapper { background: #fff; border-radius: 20px; box-shadow: 0 10px 30px rgba(0,0,0,0.03); border: 1px solid #f0f4f8; overflow: hidden; margin-bottom: 40px; }
.matrix-container { overflow-x: auto; overflow-y: auto; max-height: 70vh; position: relative; }

.lgs-matrix { border-collapse: separate; border-spacing: 0; width: 100%; min-width: max-content; }
.lgs-matrix th, .lgs-matrix td { padding: 12px 10px; border-right: 1px solid #e2e8f0; border-bottom: 1px solid #e2e8f0; text-align: center; vertical-align: middle; }

.lgs-matrix th { font-weight: 800; font-size: 13px; text-transform: uppercase; color: #fff; background: #6366f1; letter-spacing: 0.5px; position: sticky; top: 0; z-index: 10; border-right: 1px solid rgba(255,255,255,0.1); }
.lgs-matrix th:first-child { position: sticky; left: 0; z-index: 15; width: 100px; min-width: 100px; background: #4f46e5; border-right: 1px solid rgba(255,255,255,0.2); }

.lgs-matrix td:first-child { position: sticky; left: 0; z-index: 5; background: #f8fafc; font-weight: 800; color: #1e293b; border-right: 2px solid #cbd5e1; }
.lgs-matrix td { font-size: 13px; font-weight: 700; color: #334155; transition: background 0.2s; }
.lgs-matrix tbody tr:hover td:not(:first-child) { background-color: #f1f5f9; }

.mat-val { font-size: 15px; font-weight: 900; color: #0f172a; margin-bottom: 4px; display: block; }
.mat-badge { font-size: 10px; padding: 3px 6px; border-radius: 4px; font-weight: 800; text-transform: uppercase; display: inline-block; white-space: nowrap; }

/* VERİ BULUNAMADI UYARISI */
.empty-state { text-align: center; padding: 60px 20px; background: #fff; border-radius: 20px; color: #64748b; border: 2px dashed #e2e8f0; margin-bottom: 40px; box-shadow: 0 5px 20px rgba(0,0,0,0.02); }
.empty-state i { font-size: 50px; color: #cbd5e1; margin-bottom: 20px; }
.empty-state h2 { font-size: 22px; color: #1e293b; font-weight: 800; margin: 0 0 10px; }

@media (max-width: 1100px) {
    .leaders-dashboard { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
    .lc-cards { grid-template-columns: 1fr; gap: 12px; }
    .sl-header { flex-direction: column; align-items: flex-start; }
}

/* =========================================
   SINAV KİTAPÇIĞI (DETAYLI ANALİZ) TASARIMI
========================================= */
.karne-container { max-width: 1000px; margin: 40px auto 100px; padding: 0 20px; }

/* ÜST BİLGİ VE PUAN ALANI */
.karne-header { background: linear-gradient(135deg, #3B2E85 0%, #5925A1 100%); border-radius: 20px; padding: 40px; display: flex; justify-content: space-between; align-items: center; color: white; box-shadow: 0 15px 30px rgba(59, 46, 133, 0.2); margin-bottom: 40px; flex-wrap: wrap; gap: 30px; }
.ogrenci-bilgi h1 { margin: 0 0 15px 0; font-size: 28px; font-weight: 800; border-bottom: 1px solid rgba(255,255,255,0.2); padding-bottom: 15px; }
.ogrenci-bilgi p { margin: 8px 0; font-size: 16px; opacity: 0.9; }
.ogrenci-bilgi p b { color: #facc15; font-weight: 700; }

.siralama-bilgisi { background: rgba(255, 255, 255, 0.15); display: inline-flex; align-items: center; gap: 10px; padding: 10px 20px; border-radius: 12px; margin-top: 20px; font-size: 15px; border: 1px solid rgba(255, 255, 255, 0.2); backdrop-filter: blur(5px); }
.siralama-bilgisi b { font-size: 18px; color: #facc15; }

.puan-kutusu { background: rgba(0,0,0,0.25); padding: 25px 40px; border-radius: 16px; text-align: center; border: 1px solid rgba(255,255,255,0.1); backdrop-filter: blur(5px); }
.puan-kutusu span { display: block; font-size: 13px; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 5px; color: #facc15; font-weight: 700; }
.puan-deger { font-size: 48px; font-weight: 900; line-height: 1; text-shadow: 0 4px 10px rgba(0,0,0,0.3); }

/* DERS KARTLARI */
.karne-icerik { display: flex; flex-direction: column; gap: 25px; margin-bottom: 40px; }
.ders-karti { background: white; border-radius: 20px; padding: 30px; box-shadow: 0 8px 20px rgba(0,0,0,0.03); border: 1px solid #f0f4f8; }
.ders-baslik { font-size: 20px; font-weight: 800; margin-bottom: 25px; display: flex; align-items: center; gap: 12px; padding-bottom: 15px; border-bottom: 2px dashed #e2e8f0; color: #1e293b; }
.ders-baslik i { color: #3B2E85; font-size: 24px; }

.istatistik-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); gap: 15px; }
.istatistik-kutu { border-radius: 16px; padding: 20px 15px; text-align: center; display: flex; flex-direction: column; gap: 5px; transition: 0.3s; }
.istatistik-kutu:hover { transform: translateY(-5px); }
.istatistik-kutu span { font-size: 13px; font-weight: 700; text-transform: uppercase; opacity: 0.8; }
.istatistik-kutu b { font-size: 28px; font-weight: 900; line-height: 1; }

.istatistik-kutu.toplam { background: #ede9fe; color: #5b21b6; border: 1px solid #ddd6fe; }
.istatistik-kutu.dogru { background: #d1fae5; color: #047857; border: 1px solid #a7f3d0; }
.istatistik-kutu.yanlis { background: #fee2e2; color: #b91c1c; border: 1px solid #fecaca; }
.istatistik-kutu.bos { background: #f1f5f9; color: #475569; border: 1px solid #e2e8f0; }
.istatistik-kutu.net { background: #e0f2fe; color: #0369a1; border: 1px solid #bae6fd; box-shadow: 0 5px 15px rgba(14, 165, 233, 0.15); transform: scale(1.02); }
.istatistik-kutu.net:hover { transform: scale(1.05); }
.istatistik-kutu.basari { background: #fef3c7; color: #b45309; border: 1px solid #fde68a; }

/* YATAY OPTİK FORM */
.detayli-analiz-alani { background: white; border-radius: 20px; padding: 30px; box-shadow: 0 8px 20px rgba(0,0,0,0.03); margin-bottom: 40px; border: 1px solid #f0f4f8; }
.detay-ana-baslik { color: #1e1b4b; margin-top: 0; margin-bottom: 30px; font-size: 22px; font-weight: 800; display: flex; align-items: center; gap: 10px; }

.ders-detay-kutu { border: 1px solid #e2e8f0; border-radius: 12px; margin-bottom: 25px; overflow: hidden; background: #fff; }
.ders-detay-baslik { background: #f8fafc; padding: 15px 20px; font-weight: 700; border-bottom: 1px solid #e2e8f0; color: #334155; font-size: 16px; display: flex; align-items: center; gap: 10px; }

.soru-grid-wrapper { padding: 20px; background: white; }
.soru-grid-scroll { display: flex; flex-wrap: nowrap; overflow-x: auto; gap: 8px; padding-bottom: 15px; }

.soru-sutun { display: flex; flex-direction: column; min-width: 45px; border: 1px solid #e2e8f0; text-align: center; border-radius: 8px; overflow: hidden; flex-shrink: 0; box-shadow: 0 2px 5px rgba(0,0,0,0.02); }
.s-no { background: #f1f5f9; padding: 8px 0; font-weight: 800; border-bottom: 1px solid #e2e8f0; font-size: 14px; color: #475569; }
.s-dogru { padding: 8px 0; border-bottom: 1px solid #e2e8f0; font-size: 14px; color: #64748b; background: white; font-weight: 600; }

.s-ogrenci { padding: 8px 0; font-weight: 800; font-size: 15px; height: 38px; display: flex; justify-content: center; align-items: center; box-sizing: border-box; }
.s-ogrenci.bg-dogru { background-color: #10b981; color: white; } 
.s-ogrenci.bg-yanlis { background-color: #ef4444; color: white; } 
.s-ogrenci.bg-bos { background-color: white; color: transparent; } 

.soru-grid-scroll::-webkit-scrollbar { height: 8px; }
.soru-grid-scroll::-webkit-scrollbar-track { background: #f1f5f9; border-radius: 10px; }
.soru-grid-scroll::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 10px; }
.soru-grid-scroll::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

/* ACCORDION VE TABLO TASARIMI */
.accordion-wrap { display: flex; flex-direction: column; gap: 15px; margin-bottom: 40px; }
.acc-item { background: #fff; border-radius: 12px; box-shadow: 0 4px 15px rgba(0,0,0,0.03); overflow: hidden; border: 1px solid #e2e8f0; }
.acc-header { background: #2f2162; color: #fff; padding: 18px 25px; display: flex; align-items: center; justify-content: space-between; cursor: pointer; border-bottom: 4px solid #facc15; transition: background 0.3s; }
.acc-header:hover { background: #23184d; }
.acc-title { font-size: 18px; font-weight: 800; display: flex; align-items: center; gap: 15px; }
.acc-title i { color: #facc15; font-size: 22px; }
.acc-icon { transition: transform 0.3s; font-size: 18px; }
.acc-item.active .acc-icon { transform: rotate(180deg); }
.acc-content { max-height: 0; overflow: hidden; transition: max-height 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); background: #fff; }
.acc-content-inner { padding: 25px; }

.konu-tablosu { width: 100%; border-collapse: separate; border-spacing: 0; text-align: left; border: 1px solid #e2e8f0; border-radius: 8px; overflow: hidden; }
.konu-tablosu th { background: #f8fafc; padding: 15px; font-size: 13px; font-weight: 800; color: #475569; text-transform: uppercase; border-bottom: 2px solid #e2e8f0; }
.konu-tablosu td { padding: 15px; font-size: 14px; font-weight: 600; color: #1e293b; border-bottom: 1px solid #f1f5f9; vertical-align: middle; }
.konu-tablosu tr:last-child td { border-bottom: none; }
.konu-tablosu tr:hover td { background: #f8fafc; }

.td-center { text-align: center; }
.cevap-badge { display: inline-flex; justify-content: center; align-items: center; width: 36px; height: 36px; border-radius: 8px; font-weight: 800; font-size: 15px; box-shadow: 0 2px 5px rgba(0,0,0,0.05); }
.c-dogru { background: #10b981; color: #fff; }
.c-yanlis { background: #ef4444; color: #fff; }
.c-bos { background: #e2e8f0; color: #64748b; }

.btn-soru-gorsel { background: #3B2E85; color: #fff; border: none; padding: 8px 16px; border-radius: 6px; font-size: 13px; font-weight: 700; cursor: pointer; display: inline-flex; align-items: center; gap: 8px; transition: 0.2s; box-shadow: 0 4px 10px rgba(59, 46, 133, 0.2); }
.btn-soru-gorsel:hover { background: #5925A1; transform: translateY(-2px); }

.btn-video { background: #f43f5e; color: #fff; border: none; padding: 8px 16px; border-radius: 6px; font-size: 13px; font-weight: 700; cursor: pointer; display: inline-flex; align-items: center; gap: 8px; transition: 0.2s; box-shadow: 0 4px 10px rgba(244, 63, 94, 0.2); margin-left: 5px; }
.btn-video:hover { background: #e11d48; transform: translateY(-2px); }

/* MODAL TASARIMI */
.video-container { position: relative; width: 100%; padding-bottom: 56.25%; height: 0; }
.video-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 8px; }

/* ALT BUTONLAR */
.karne-alt-butonlar { display: flex; justify-content: center; gap: 20px; margin-top: 30px; }
.btn-geri { background: white; color: #334155; padding: 15px 30px; border-radius: 12px; text-decoration: none; font-weight: 700; border: 1px solid #cbd5e1; transition: 0.3s; display: flex; align-items: center; gap: 10px; font-size: 15px; }
.btn-geri:hover { background: #f8fafc; border-color: #3B2E85; color: #3B2E85; transform: translateY(-2px); }
.btn-yazdir { background: #0ea5e9; color: white; border: none; padding: 15px 30px; border-radius: 12px; font-weight: 700; cursor: pointer; transition: 0.3s; display: flex; align-items: center; gap: 10px; font-size: 15px; box-shadow: 0 4px 15px rgba(14, 165, 233, 0.3); }
.btn-yazdir:hover { background: #0284c7; transform: translateY(-2px); box-shadow: 0 8px 20px rgba(14, 165, 233, 0.4); }

/* MOBİL & YAZICI DÜZENLEMELERİ */
@media (max-width: 768px) {
    .karne-header { flex-direction: column; text-align: center; justify-content: center; padding: 25px 15px; box-sizing: border-box; }
    .ogrenci-bilgi { width: 100%; box-sizing: border-box; }
    .ogrenci-bilgi p { word-wrap: break-word; }
    .siralama-bilgisi { display: flex; padding: 15px; width: 100%; box-sizing: border-box; gap: 5px; }
    .puan-kutusu { width: 100%; box-sizing: border-box; }
    .istatistik-grid { grid-template-columns: repeat(2, 1fr); }
    .karne-alt-butonlar { flex-direction: column; }
    .btn-geri, .btn-yazdir { justify-content: center; width: 100%; }
    .konu-tablosu { display: block; overflow-x: auto; white-space: nowrap; }
    .acc-content-inner { padding: 15px; }
    .btn-soru-gorsel, .btn-video { padding: 6px 12px; font-size: 12px; }
    .modal-cevap-bilgisi { flex-direction: column; gap: 8px; }
}

@media print {
    body { background: white; -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }
    .karne-alt-butonlar, #wpadminbar, .lgs-ozel-navbar, .site-footer, .btn-soru-gorsel, .btn-video { display: none !important; }
    .karne-container { margin: 0; padding: 0; box-shadow: none; max-width: 100%; }
    .karne-header { background: #f8fafc !important; border: 1px solid #e2e8f0; color: #1e293b !important; }
    .ogrenci-bilgi h1, .ogrenci-bilgi p, .ogrenci-bilgi p b { color: #1e293b !important; }
    .siralama-bilgisi { background: #fff !important; color: #1e293b !important; border: 2px solid #94a3b8; }
    .puan-kutusu { background: white !important; border: 2px solid #94a3b8; }
    .puan-kutusu span { color: #475569 !important; }
    .puan-deger { color: #1e293b !important; }
    .istatistik-kutu { border: 1px solid #cbd5e1 !important; break-inside: avoid; }
    .detayli-analiz-alani { box-shadow: none; border: 1px solid #cbd5e1; break-inside: avoid; }
    .s-ogrenci.bg-dogru { background-color: #10b981 !important; color: white !important; }
    .s-ogrenci.bg-yanlis { background-color: #ef4444 !important; color: white !important; }
    .soru-grid-scroll { flex-wrap: wrap; gap: 4px; justify-content: flex-start; }
    .soru-sutun { margin-bottom: 5px; }
    .acc-item { break-inside: avoid; margin-bottom: 20px; }
    .acc-content { max-height: none !important; }
    .acc-icon { display: none; }
}
/* =========================================
   SINAV MERKEZİ TASARIMI
========================================= */
.sm-container { max-width: 1000px; margin: 40px auto 100px; padding: 0 20px; }

.sm-header { display: flex; align-items: center; gap: 15px; margin-bottom: 30px; }
.sm-header i { font-size: 32px; color: #3B2E85; background: #fff; padding: 15px; border-radius: 16px; box-shadow: 0 5px 15px rgba(59, 46, 133, 0.1); }
.sm-header h1 { margin: 0; font-size: 28px; color: #1e1b4b; font-weight: 800; }
.sm-header p { margin: 5px 0 0 0; color: #64748b; font-size: 15px; font-weight: 500; }

.sm-tabs { display: flex; gap: 10px; background: #fff; padding: 10px; border-radius: 16px; box-shadow: 0 4px 15px rgba(0,0,0,0.03); margin-bottom: 40px; overflow-x: auto; }
.sm-tab-btn { flex: 1; padding: 15px 20px; text-align: center; text-decoration: none; font-weight: 700; font-size: 14px; border-radius: 10px; color: #64748b; transition: all 0.3s ease; white-space: nowrap; display: flex; align-items: center; justify-content: center; gap: 8px; }
.sm-tab-btn:hover { background: #f8fafc; color: #3B2E85; }
.sm-tab-btn.active { background: #3B2E85; color: #fff; box-shadow: 0 4px 12px rgba(59, 46, 133, 0.2); }
.tab-badge { background: rgba(255,255,255,0.2); padding: 2px 8px; border-radius: 50px; font-size: 12px; }
.sm-tab-btn:not(.active) .tab-badge { background: #e2e8f0; color: #475569; }

.exam-grid { display: flex; flex-direction: column; gap: 20px; }
.exam-card { background: #fff; border-radius: 20px; padding: 30px; box-shadow: 0 5px 20px rgba(0,0,0,0.03); border: 1px solid #f0f4f8; display: flex; justify-content: space-between; align-items: center; transition: all 0.3s; }
.exam-card:hover { transform: translateX(5px); box-shadow: 0 10px 25px rgba(59, 46, 133, 0.1); border-color: #3B2E85; }

.exam-info h3 { margin: 0 0 10px; font-size: 20px; color: #1e293b; font-weight: 800; }
.exam-info p { margin: 0; font-size: 14px; color: #64748b; display: flex; align-items: center; gap: 6px; font-weight: 500; }

.exam-badge { display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; border-radius: 50px; font-size: 11px; font-weight: 800; margin-bottom: 15px; text-transform: uppercase; }
.badge-active { background: #d1fae5; color: #065f46; }
.badge-vip { background: #fef08a; color: #b45309; border: 1px solid #fde047; } 
.badge-upcoming { background: #fef3c7; color: #b45309; }
.badge-missed { background: #fee2e2; color: #b91c1c; } 
.badge-waiting { background: #e0e7ff; color: #5b21b6; }
.badge-completed { background: #f1f5f9; color: #475569; }

.exam-action { min-width: 220px; }
.exam-btn { display: block; width: 100%; padding: 14px 20px; border-radius: 12px; text-align: center; text-decoration: none; font-weight: 700; font-size: 14px; transition: 0.3s; color: #fff; box-sizing: border-box; }
.btn-start { background: #10b981; box-shadow: 0 4px 15px rgba(16, 185, 129, 0.2); }
.btn-start:hover { background: #059669; transform: translateY(-2px); }
.btn-vip { background: #f59e0b; box-shadow: 0 4px 15px rgba(245, 158, 11, 0.2); } 
.btn-vip:hover { background: #d97706; transform: translateY(-2px); }
.btn-wait { background: #f1f5f9; color: #94a3b8; cursor: not-allowed; }
.btn-analysis { background: #0ea5e9; box-shadow: 0 4px 15px rgba(14, 165, 233, 0.2); }
.btn-analysis:hover { background: #0284c7; transform: translateY(-2px); }

.lgs-pagination { display: flex; justify-content: center; gap: 8px; margin-top: 40px; }
.lgs-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; color: #475569; font-weight: 700; text-decoration: none; transition: all 0.3s; padding: 0 15px; font-size: 14px; }
.lgs-pagination .page-numbers:hover { background: #f8fafc; color: #3B2E85; border-color: #cbd5e1; }
.lgs-pagination .page-numbers.current { background: #3B2E85; color: #fff; border-color: #3B2E85; box-shadow: 0 4px 10px rgba(59, 46, 133, 0.2); }

.empty-state { text-align: center; padding: 60px 20px; background: #fff; border-radius: 20px; color: #64748b; border: 2px dashed #e2e8f0; }

@media (max-width: 768px) { 
    .exam-card { flex-direction: column; text-align: center; gap: 20px; padding: 20px; } 
    .exam-action { width: 100%; } 
    .sm-tabs { flex-direction: column; } 
}
@keyframes blink { 50% { opacity: 0.5; } }

/* =========================================
   ONLİNE DENEME SINAV ODASI TASARIMI
========================================= */
body.single-online_deneme { background: #f4f6fa; }
.sinav-container { max-width: 1400px; margin: 20px auto; padding: 0 20px; min-height: 100vh; }
.sinav-top-bar { background: linear-gradient(to right, #3B2E85, #5925A1); border-radius: 12px; padding: 15px 25px; display: flex; justify-content: space-between; align-items: center; color: white; margin-bottom: 20px; box-shadow: 0 4px 15px rgba(0,0,0,0.1); flex-wrap: wrap; gap: 15px; }
.sinav-baslik h2 { margin: 0; font-size: 1.5rem; display: flex; align-items: center; gap: 10px; color: white; }
.sinav-badge { background: rgba(255,255,255,0.2); padding: 4px 10px; border-radius: 20px; font-size: 0.85rem; font-weight: 600; }
.sinav-sayac-kutusu { background: rgba(0,0,0,0.2); padding: 10px 20px; border-radius: 30px; font-size: 1.2rem; font-weight: 700; display: flex; align-items: center; gap: 10px; min-width: 200px; justify-content: center; }
.sayac-rakam.tehlike { color: #ff4d4d; animation: yanipSonme 1s infinite; }
@keyframes yanipSonme { 50% { opacity: 0.5; } }

.btn-sinavi-bitir { background: #facc15; color: #1e1b4b; border: none; padding: 12px 25px; border-radius: 8px; font-size: 1.1rem; font-weight: 800; cursor: pointer; transition: 0.3s; display: flex; align-items: center; gap: 8px; }
.btn-sinavi-bitir:hover { background: #eab308; transform: scale(1.05); }

.sinav-layout { display: flex; gap: 20px; height: 85vh; min-height: 750px; }
.sinav-pdf-alani { flex: 7; background: white; border-radius: 12px; box-shadow: 0 4px 15px rgba(0,0,0,0.05); overflow: hidden; display: flex; flex-direction: column; }
.sinav-optik-alani { flex: 3; background: white; border-radius: 12px; box-shadow: 0 4px 15px rgba(0,0,0,0.05); padding: 25px 20px; overflow-y: auto; display: flex; flex-direction: column; }

.pdf-hata-bar { background: #fff8e1; color: #856404; padding: 10px 20px; font-size: 0.9rem; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #ffeeba; z-index: 10; }
.btn-pdf-yenile { background: #ffc107; color: #333; border: none; padding: 6px 12px; border-radius: 6px; cursor: pointer; font-size: 0.85rem; font-weight: 600; transition: 0.2s; display: flex; align-items: center; gap: 5px; }
.btn-pdf-yenile:hover { background: #e0a800; }

.optik-baslik { font-size: 1.3rem; font-weight: 800; color: #5925A1; text-align: center; margin-bottom: 25px; padding-bottom: 15px; border-bottom: 2px dashed #eee; }
.optik-ders-baslik { font-weight: 800; padding: 12px; border-radius: 8px; margin-bottom: 15px; text-align: center; font-size: 1.1rem; letter-spacing: 0.5px; }
.optik-ders-baslik.mavi { background: #e3f2fd; color: #1565c0; border-left: 5px solid #1976d2; }
.optik-ders-baslik.yesil { background: #e8f5e9; color: #2e7d32; border-left: 5px solid #388e3c; }
.optik-ders-baslik.turuncu { background: #fff3e0; color: #e65100; border-left: 5px solid #f57c00; }
.optik-ders-baslik.mor { background: #f3e5f5; color: #6a1b9a; border-left: 5px solid #8e24aa; }

.optik-satir { display: flex; align-items: center; justify-content: center; margin-bottom: 12px; padding: 4px 0; transition: 0.2s; border-radius: 8px; }
.optik-satir:hover { background: #f8f9ff; }
.optik-soru-no { width: 35px; font-weight: 700; color: #444; text-align: right; margin-right: 15px; font-size: 1.1rem; }

.optik-secenekler-grubu { display: flex; gap: 15px; }
.optik-secenek { width: 42px; height: 42px; border-radius: 50%; border: 2px solid #ddd; background: white; color: #555; font-weight: 700; cursor: pointer; transition: 0.2s; outline: none; font-size: 1rem; display: flex; align-items: center; justify-content: center; padding: 0; }
.optik-secenek:hover { border-color: #3B2E85; background: #f0f4ff; }
.optik-secenek.secili { background: #3B2E85; color: white; border-color: #3B2E85; transform: scale(1.05); box-shadow: 0 3px 8px rgba(0,0,0,0.15); }

/* Sınav Bitir Modalı */
.modal-overlay-sinav { position: fixed; top:0; left:0; width:100%; height:100%; background: rgba(15, 23, 42, 0.85); backdrop-filter: blur(5px); z-index: 999999; display: flex; justify-content: center; align-items: center; }
.modal-content-sinav { background: white; padding: 40px; border-radius: 20px; text-align: center; max-width: 500px; width: 90%; box-shadow: 0 25px 50px rgba(0,0,0,0.25); }
.modal-content-sinav .modal-icon { font-size: 4rem; margin-bottom: 20px; }
.modal-content-sinav h3 { font-size: 1.8rem; margin-bottom: 10px; color: #1e293b; font-weight: 800; }
.modal-content-sinav p { color: #64748b; font-size: 1.1rem; font-weight: 600; }

@media (max-width: 992px) {
    .sinav-layout { flex-direction: column; height: auto; }
    .sinav-pdf-alani { height: 65vh; min-height: 450px; } 
    .sinav-optik-alani { height: auto; padding: 15px; }
    .sinav-top-bar { flex-direction: column; text-align: center; justify-content: center; }
    .sinav-baslik { flex-direction: column; }
    .pdf-hata-bar { flex-direction: column; gap: 10px; text-align: center; }
    .optik-secenekler-grubu { gap: 20px; }
}

/* =========================================
   DERS PROGRAMI / CANLI DERSLER TASARIMI
========================================= */
.dp-container { max-width: 1100px; margin: 40px auto 100px; padding: 0 20px; }

/* KAHRAMAN ALANI (HERO) */
.dp-hero { background: linear-gradient(135deg, var(--p-color) 0%, var(--s-color) 100%); border-radius: 20px; padding: 40px; color: #fff; box-shadow: 0 15px 30px rgba(59, 46, 133, 0.2); margin-bottom: 30px; position: relative; overflow: hidden; }
.dp-hero h1 { margin: 0 0 15px; font-size: 32px; font-weight: 800; display: flex; align-items: center; gap: 15px; }
.dp-hero h1 i { color: var(--accent); }

.dp-hero .info-box { background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.2); padding: 20px; border-radius: 12px; backdrop-filter: blur(5px); }
.dp-hero .info-box h3 { margin: 0 0 10px; font-size: 16px; color: var(--accent); text-transform: uppercase; letter-spacing: 1px; }
.dp-hero .info-box p { margin: 0; font-size: 15px; line-height: 1.6; opacity: 0.95; }

/* FİLTRELEME ALANI */
.dp-container .filter-section { background: #fff; border-radius: 16px; padding: 20px; margin-bottom: 30px; box-shadow: 0 4px 15px rgba(0,0,0,0.03); border: 1px solid #f0f4f8; display: flex; flex-wrap: wrap; gap: 15px; align-items: center; }
.dp-container .filter-section select { flex: 1; min-width: 150px; padding: 12px 15px; border: 1px solid #e2e8f0; border-radius: 10px; font-size: 14px; color: #475569; font-weight: 600; background-color: #f8fafc; outline: none; transition: 0.3s; cursor: pointer; }
.dp-container .filter-section select:hover, .dp-container .filter-section select:focus { border-color: var(--p-color); background-color: #fff; }

.dp-container .btn-clear { background: #f1f5f9; color: #475569; border: none; padding: 12px 20px; border-radius: 10px; font-weight: 700; cursor: pointer; transition: 0.3s; display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.dp-container .btn-clear:hover { background: #e2e8f0; color: #1e293b; }

.dp-container .no-results-msg { text-align: center; padding: 50px 20px; color: #64748b; font-weight: 500; display: none; background: #fff; border-radius: 16px; border: 2px dashed #e2e8f0; margin-bottom: 30px; }

/* MASAÜSTÜ TABLO GÖRÜNÜMÜ */
.schedule-container { background: #fff; border-radius: 20px; padding: 30px; box-shadow: 0 5px 20px rgba(0,0,0,0.03); border: 1px solid #f0f4f8; margin-bottom: 40px; }
.dp-table { width: 100%; border-collapse: collapse; }
.dp-table th { background: #f8fafc; color: #475569; padding: 18px 15px; text-align: left; font-weight: 700; font-size: 14px; text-transform: uppercase; border-bottom: 2px solid #e2e8f0; }
.dp-table td { padding: 20px 15px; border-bottom: 1px solid #f1f5f9; vertical-align: middle; color: #334155; font-size: 15px; font-weight: 600; }
.dp-table tr:last-child td { border-bottom: none; }
.dp-table tr:hover td { background-color: #f8fafc; }

/* HÜCRE RENKLENDİRMELERİ */
.cell-day { color: var(--p-color); font-weight: 800 !important; }
.cell-time { background: #f1f5f9; padding: 6px 12px; border-radius: 8px; color: #475569; font-size: 13px !important; display: inline-block; }
.cell-teacher { color: #64748b; font-weight: 500 !important; display: flex; align-items: center; gap: 8px; }

.btn-join { background: #10b981; color: #fff; padding: 10px 20px; border-radius: 10px; text-decoration: none; font-weight: 700; font-size: 13px; transition: 0.3s; display: inline-flex; align-items: center; gap: 8px; box-shadow: 0 4px 10px rgba(16, 185, 129, 0.2); }
.btn-join:hover { background: #059669; transform: translateY(-2px); color: #fff; }
.dp-container .btn-disabled { background: #f1f5f9; color: #94a3b8; padding: 10px 20px; border-radius: 10px; font-size: 13px; font-weight: 600; display: inline-block; cursor: not-allowed; }

/* MOBİL KART GÖRÜNÜMÜ */
.schedule-cards { display: none; flex-direction: column; gap: 15px; }
.s-card { background: #fff; border-radius: 16px; padding: 20px; border: 1px solid #e2e8f0; box-shadow: 0 4px 10px rgba(0,0,0,0.02); }
.s-card-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; border-bottom: 1px solid #f1f5f9; padding-bottom: 15px; }
.s-card-day { font-weight: 800; color: var(--p-color); font-size: 16px; }
.s-card-subject { font-size: 18px; font-weight: 800; color: #1e293b; margin-bottom: 8px; }
.s-card-teacher { font-size: 14px; color: #64748b; margin-bottom: 15px; display: flex; align-items: center; gap: 8px; }

.dp-container .empty-state { text-align: center; padding: 50px 20px; color: #64748b; font-weight: 500; }

@media (max-width: 768px) {
    .dp-hero { padding: 30px 20px; text-align: center; }
    .dp-hero h1 { justify-content: center; font-size: 26px; }
    .schedule-container { display: none; } 
    .schedule-cards { display: flex; } 
}

/* =========================================
   LGS ÖZEL GİRİŞ SAYFASI TASARIMI
========================================= */
.lgs-login-page { background-color: #f4f6fb; padding: 60px 20px 100px; min-height: calc(100vh - 80px); display: flex; align-items: center; justify-content: center; }
.lgs-login-box { background: #ffffff; width: 100%; max-width: 450px; border-radius: 20px; box-shadow: 0 15px 35px rgba(59, 46, 133, 0.1); overflow: hidden; }

.lgs-login-tabs { display: flex; background: #e2e8f0; }
.lgs-tab-btn { flex: 1; padding: 20px 10px; border: none; background: transparent; font-size: 16px; font-weight: 600; color: #64748b; cursor: pointer; transition: all 0.3s ease; display: flex; align-items: center; justify-content: center; gap: 10px; }
.lgs-tab-btn i { font-size: 18px; }

.lgs-tab-btn.active[data-target="ogrenci-form"] { background: #ffffff; color: #0ea5e9; box-shadow: 0 4px 10px rgba(0,0,0,0.05); }
.lgs-tab-btn.active[data-target="veli-form"] { background: #ffffff; color: #f59e0b; box-shadow: 0 4px 10px rgba(0,0,0,0.05); }

.lgs-form-container { padding: 40px 30px; display: none; animation: fadeIn 0.4s ease; }
.lgs-form-container.active { display: block; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

.lgs-form-header { text-align: center; margin-bottom: 30px; }
.lgs-form-header h2 { margin: 0 0 10px; font-size: 24px; color: #1e1b4b; }
.lgs-form-header p { margin: 0; color: #64748b; font-size: 14px; }

.lgs-login-box .login-username, .lgs-login-box .login-password { margin-bottom: 20px; }
.lgs-login-box label { display: block; font-size: 14px; font-weight: 600; color: #334155; margin-bottom: 8px; }
.lgs-login-box input[type="text"], .lgs-login-box input[type="password"] {
    width: 100%; padding: 14px 15px; border: 2px solid #e2e8f0; border-radius: 10px;
    font-size: 15px; color: #334155; transition: border-color 0.3s; box-sizing: border-box;
}
.lgs-login-box input[type="text"]:focus, .lgs-login-box input[type="password"]:focus { border-color: #3B2E85; outline: none; }
.lgs-login-box .login-remember { margin-bottom: 20px; font-size: 14px; color: #64748b; }

.lgs-login-box .login-submit input[type="submit"] {
    width: 100%; padding: 15px; border: none; border-radius: 50px; font-size: 16px;
    font-weight: bold; color: #ffffff; cursor: pointer; transition: all 0.3s ease;
}

#ogrenci-form .login-submit input[type="submit"] { background-color: #0ea5e9; box-shadow: 0 4px 15px rgba(14, 165, 233, 0.3); }
#ogrenci-form .login-submit input[type="submit"]:hover { background-color: #0284c7; }
#veli-form .login-submit input[type="submit"] { background-color: #facc15; color: #1e1b4b; box-shadow: 0 4px 15px rgba(250, 204, 21, 0.3); }
#veli-form .login-submit input[type="submit"]:hover { background-color: #eab308; }

/* =========================================
   KONU PDF'LERİ TASARIMI
========================================= */
.pdf-wrap { background-color: #f8fafc; font-family: 'Segoe UI', sans-serif; padding-top: 100px; padding-bottom: 80px; margin-bottom: -80px; min-height: 80vh; }
.pdf-container { max-width: 1100px; margin: 0 auto; padding: 0 20px; }

.subjects-container { display: flex; flex-direction: column; gap: 20px; }
.subject-accordion { background: #fff; border-radius: 16px; border: 1px solid #e2e8f0; box-shadow: 0 4px 15px rgba(0,0,0,0.02); overflow: hidden; transition: all 0.3s; }
.subject-accordion:hover { border-color: #cbd5e1; box-shadow: 0 10px 25px rgba(0,0,0,0.05); }

.accordion-header { padding: 25px; display: flex; justify-content: space-between; align-items: center; cursor: pointer; background: #fff; transition: 0.3s; }
.accordion-header:hover { background: #f8fafc; }
.accordion-header.active { background: linear-gradient(135deg, #3B2E85 0%, #1e1b4b 100%); color: #fff; border-bottom: 3px solid #facc15; }

.subject-title { display: flex; align-items: center; gap: 15px; font-size: 1.3rem; font-weight: 800; color: #1e293b; }
.accordion-header.active .subject-title { color: #fff; }
.subject-title i { font-size: 1.5rem; color: #3B2E85; width: 35px; text-align: center; transition: 0.3s; }
.accordion-header.active .subject-title i { color: #facc15; }

.accordion-icon { font-size: 1.1rem; color: #94a3b8; transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); }
.accordion-header.active .accordion-icon { color: #fff; transform: rotate(180deg); }

.accordion-content { max-height: 0; overflow: hidden; transition: max-height 0.4s ease-in-out; background: #f8fafc; }
.accordion-content.open { border-top: 1px solid #e2e8f0; }

.topics-grid { padding: 30px 25px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
@media (max-width: 992px) { .topics-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 576px) { .topics-grid { grid-template-columns: 1fr; } }

.topic-card { background: #fff; border-radius: 12px; padding: 20px; border: 1px solid #e2e8f0; box-shadow: 0 2px 10px rgba(0,0,0,0.01); display: flex; flex-direction: column; transition: 0.3s; }
.topic-card:hover { transform: translateY(-5px); border-color: #3B2E85; box-shadow: 0 10px 20px rgba(59, 46, 133, 0.05); }

.topic-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.topic-name { font-size: 1.05rem; font-weight: 800; color: #1e293b; line-height: 1.3; }
.topic-icon i { font-size: 1.5rem; color: #facc15; opacity: 0.8; }

.topic-description { font-size: 0.85rem; color: #64748b; line-height: 1.5; margin-bottom: 20px; flex-grow: 1; }

.download-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%; padding: 10px; background: rgba(59, 46, 133, 0.08); color: #3B2E85; font-weight: 700; font-size: 0.9rem; border-radius: 8px; text-decoration: none; border: 1px solid rgba(59, 46, 133, 0.1); transition: all 0.3s; }
.download-btn:hover { background: #3B2E85; color: #facc15; border-color: #3B2E85; transform: scale(1.02); }

.btn-disabled { background: #f1f5f9; color: #94a3b8; border-color: #e2e8f0; cursor: not-allowed; }
.btn-disabled:hover { background: #f1f5f9; color: #94a3b8; transform: none; box-shadow: none; border-color: #e2e8f0; }

.info-text { padding: 15px; color: #64748b; font-style: italic; background: #fff; border-radius: 8px; border: 1px dashed #cbd5e1; grid-column: 1 / -1; text-align: center; }

/* =========================================
   VİDEO ÇÖZÜMLER TASARIMI
========================================= */
.video-wrap { background-color: #f8fafc; font-family: 'Segoe UI', sans-serif; padding-top: 100px; padding-bottom: 80px; margin-bottom: -80px; min-height: 80vh; }
.vc-container { max-width: 1250px; margin: 0 auto; padding: 0 20px; }

.video-wrap .section-header { text-align: center; margin: 0 0 45px; }
.video-wrap .page-title { font-size: 28px; font-weight: 900; color: #1e1b4b; margin: 0 0 12px; display: flex; align-items: center; justify-content: center; gap: 12px; }
.video-wrap .page-title i { color: #3B2E85; }
.video-wrap .page-subtitle { font-size: 16px; color: #64748b; margin: 0; max-width: 700px; margin: 0 auto; line-height: 1.6; }

.video-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; }
@media (max-width: 992px) { .video-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 768px) { .video-grid { grid-template-columns: 1fr; } }

.video-card { background: #fff; border-radius: 16px; border: 1px solid #e2e8f0; box-shadow: 0 4px 15px rgba(0,0,0,0.02); overflow: hidden; transition: all 0.3s ease; display: flex; flex-direction: column; }
.video-card:hover { transform: translateY(-5px); box-shadow: 0 15px 30px rgba(59, 46, 133, 0.08); border-color: #cbd5e1; }

.vc-header { background: linear-gradient(135deg, #3B2E85 0%, #1e1b4b 100%); color: #fff; padding: 20px; text-align: center; border-bottom: 4px solid #facc15; }
.vc-title { font-size: 18px; font-weight: 800; margin: 0 0 5px 0; }
.vc-date { font-size: 13px; color: #cbd5e1; font-weight: 600; display: flex; align-items: center; justify-content: center; gap: 5px; }

.vc-body { padding: 20px; flex-grow: 1; }
.subject-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 12px; }
.subject-item { display: flex; justify-content: space-between; align-items: center; padding-bottom: 12px; border-bottom: 1px dashed #e2e8f0; }
.subject-item:last-child { border-bottom: none; padding-bottom: 0; }

.subject-name { font-size: 15px; font-weight: 700; color: #334155; display: flex; align-items: center; gap: 8px; }
.subject-name::before { content: '\f144'; font-family: 'Font Awesome 5 Free'; font-weight: 900; color: #0ea5e9; font-size: 14px; }

.video-link { background: #10b981; color: #fff; padding: 6px 12px; border-radius: 6px; font-size: 12px; font-weight: 800; text-decoration: none; transition: 0.3s; display: inline-flex; align-items: center; gap: 5px; }
.video-link:hover { background: #059669; transform: scale(1.05); color: #fff; }
.no-video { background: #f1f5f9; color: #94a3b8; padding: 6px 12px; border-radius: 6px; font-size: 12px; font-weight: 700; display: inline-flex; align-items: center; gap: 5px; cursor: not-allowed; }

.video-wrap .info-box { background: #fff; border-radius: 12px; padding: 30px; text-align: center; color: #64748b; font-size: 16px; border: 1px dashed #cbd5e1; grid-column: 1 / -1; }

.modern-pagination { display: flex; justify-content: center; margin-top: 40px; }
.modern-pagination ul { list-style: none; padding: 0; margin: 0; display: flex; gap: 8px; }
.modern-pagination li a, .modern-pagination li span { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; background: #fff; border: 1px solid #e2e8f0; color: #475569; font-weight: 700; text-decoration: none; transition: 0.3s; }
.modern-pagination li a:hover { background: #f8fafc; color: #3B2E85; border-color: #cbd5e1; transform: translateY(-2px); }
.modern-pagination li span.current { background: #3B2E85; color: #fff; border-color: #3B2E85; box-shadow: 0 4px 10px rgba(59, 46, 133, 0.2); }
/* =========================================
   HAKKIMIZDA SAYFASI TASARIMI
========================================= */
.about-wrap { font-family: 'Segoe UI', sans-serif; background-color: #ffffff; color: #334155; }

/* Üst Bölüm */
.about-intro { padding: 80px 20px; max-width: 1000px; margin: 0 auto; text-align: center; }
.about-intro h2 { color: #3B2E85; font-size: 32px; font-weight: 800; margin-bottom: 25px; }
.about-intro p { font-size: 18px; line-height: 1.8; color: #64748b; }

/* İstatistikler */
.about-stats { background: #f8fafc; padding: 60px 20px; border-top: 1px solid #f1f5f9; border-bottom: 1px solid #f1f5f9; }
.stats-grid-about { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 30px; text-align: center; }
.stat-item-about h3 { font-size: 42px; font-weight: 900; color: #facc15; margin: 0; line-height: 1; }
.stat-item-about p { font-size: 16px; font-weight: 700; color: #1e293b; margin-top: 10px; }

/* Özellikler */
.about-features { padding: 80px 20px; max-width: 1200px; margin: 0 auto; }
.about-features h3 { text-align: center; font-size: 28px; color: #1e1b4b; margin-bottom: 50px; font-weight: 800; }
.features-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 30px; }
.about-card { background: #fff; padding: 30px; border-radius: 16px; box-shadow: 0 4px 15px rgba(0,0,0,0.03); border: 1px solid #e2e8f0; text-align: center; transition: 0.3s; }
.about-card:hover { transform: translateY(-5px); box-shadow: 0 10px 25px rgba(59, 46, 133, 0.1); border-color: #3B2E85; }
.about-card i { font-size: 40px; color: #3B2E85; margin-bottom: 20px; }
.about-card h4 { font-size: 20px; font-weight: 800; color: #1e293b; margin-bottom: 15px; }
.about-card p { font-size: 15px; color: #64748b; line-height: 1.6; }

/* Misyon / Vizyon */
.mission-vision { background: #1e1b4b; color: white; padding: 80px 20px; }
.mv-container { max-width: 1000px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
@media (max-width: 768px) { .mv-container { grid-template-columns: 1fr; } }
.mv-box h3 { font-size: 24px; color: #facc15; margin-bottom: 20px; border-bottom: 2px solid rgba(255,255,255,0.1); padding-bottom: 15px; }
.mv-box p { font-size: 16px; line-height: 1.8; opacity: 0.9; }

/* Alt CTA */
.about-cta { text-align: center; padding: 80px 20px; background: #f8fafc; }
.about-cta h3 { font-size: 28px; font-weight: 800; color: #3B2E85; margin-bottom: 20px; }
.btn-about-cta { display: inline-block; background: #facc15; color: #1e1b4b; padding: 15px 35px; border-radius: 50px; font-size: 18px; font-weight: 800; text-decoration: none; transition: 0.3s; box-shadow: 0 4px 15px rgba(250, 204, 21, 0.3); }
.btn-about-cta:hover { background: #eab308; transform: scale(1.05); }

/* =========================================
   İLETİŞİM SAYFASI TASARIMI
========================================= */
.iletisim-wrap { background-color: #f8f9fa; padding: 60px 20px; font-family: 'Segoe UI', sans-serif; }
.iletisim-container { max-width: 1100px; margin: 0 auto; }

.iletisim-hero { text-align: center; margin-bottom: 50px; }
.iletisim-hero h1 { color: #3B2E85; font-size: 36px; font-weight: 800; margin-bottom: 15px; }
.iletisim-hero p { color: #64748b; font-size: 18px; max-width: 600px; margin: 0 auto; line-height: 1.6; }

.iletisim-grid { display: grid; grid-template-columns: 1fr 1.5fr; gap: 40px; }
@media (max-width: 768px) { .iletisim-grid { grid-template-columns: 1fr; } }

/* Sol Taraf - Bilgi Kartları */
.iletisim-bilgiler { display: flex; flex-direction: column; gap: 20px; }
.bilgi-kart { background: #fff; padding: 30px 25px; border-radius: 12px; box-shadow: 0 4px 15px rgba(0,0,0,0.03); display: flex; align-items: flex-start; gap: 20px; border: 1px solid #e2e8f0; transition: 0.3s; }
.bilgi-kart:hover { transform: translateY(-5px); border-color: #cbd5e1; box-shadow: 0 10px 20px rgba(59, 46, 133, 0.05); }
.b-ikon { background: #f8fafc; width: 50px; height: 50px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 20px; color: #3B2E85; flex-shrink: 0; }
.b-metin h3 { margin: 0 0 5px 0; font-size: 18px; color: #1e293b; font-weight: 800; }
.b-metin p { margin: 0; font-size: 15px; color: #64748b; line-height: 1.5; }

/* Sağ Taraf - İletişim Formu */
.iletisim-form-alani { background: #fff; padding: 40px 35px; border-radius: 16px; box-shadow: 0 10px 30px rgba(0,0,0,0.04); border: 1px solid #e2e8f0; }
.iletisim-form-alani h3 { margin: 0 0 25px 0; font-size: 22px; color: #1e1b4b; font-weight: 800; }

.form-grup { margin-bottom: 20px; }
.form-grup label { display: block; font-size: 14px; font-weight: 700; color: #475569; margin-bottom: 8px; }
.form-grup input, .form-grup textarea { width: 100%; padding: 14px 15px; border: 1px solid #cbd5e1; border-radius: 10px; font-family: inherit; font-size: 15px; color: #334155; background: #f8fafc; transition: 0.3s; box-sizing: border-box; }
.form-grup input:focus, .form-grup textarea:focus { background: #fff; border-color: #3B2E85; outline: none; box-shadow: 0 0 0 3px rgba(59, 46, 133, 0.1); }

.btn-gonder { background: #3B2E85; color: #fff; border: none; padding: 15px 30px; font-size: 16px; font-weight: 800; border-radius: 10px; cursor: pointer; width: 100%; transition: 0.3s; display: flex; align-items: center; justify-content: center; gap: 10px; }
.btn-gonder:hover { background: #1e1b4b; transform: translateY(-2px); box-shadow: 0 5px 15px rgba(59, 46, 133, 0.3); }
.btn-gonder:disabled { background: #94a3b8; cursor: not-allowed; transform: none; box-shadow: none; }

/* =========================================
   LGS PUAN HESAPLAMA TASARIMI
========================================= */
.hesaplama-wrap { background-color: #f8fafc; font-family: 'Segoe UI', sans-serif; padding-top: 100px; padding-bottom: 80px; margin-bottom: -80px; min-height: 100vh; }
.hesaplama-container { max-width: 1250px; margin: 0 auto; padding: 0 20px; }

/* Başlık Alanı */
.hesaplama-wrap .section-header { text-align: center; margin: 0 0 45px; }
.hesaplama-wrap .page-title { font-size: 28px; font-weight: 900; color: #1e1b4b; margin: 0 0 12px; display: flex; align-items: center; justify-content: center; gap: 12px; }
.hesaplama-wrap .page-title i { color: #3B2E85; }
.hesaplama-wrap .page-subtitle { font-size: 16px; color: #64748b; margin: 0; max-width: 750px; margin: 0 auto; line-height: 1.6; }

/* Ana Grid Düzeni */
.hesaplama-grid { display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 30px; align-items: start; }
@media (max-width: 992px) { .hesaplama-grid { grid-template-columns: 1fr; } }

/* SOL TARAF: VERİ GİRİŞ KARTI */
.giris-karti { background: #fff; border-radius: 16px; padding: 30px; border: 1px solid #e2e8f0; box-shadow: 0 4px 15px rgba(0,0,0,0.02); }

.ders-satir { display: flex; justify-content: space-between; align-items: center; padding: 15px 0; border-bottom: 1px dashed #cbd5e1; flex-wrap: wrap; gap: 15px; transition: 0.3s; }
.ders-satir:last-child { border-bottom: none; }
.ders-satir:hover { background-color: #f8fafc; border-radius: 8px; padding: 15px 10px; margin: 0 -10px; }

.ders-isim { font-size: 1.15rem; font-weight: 800; display: flex; align-items: center; gap: 12px; min-width: 200px; }
.katsayi-yuksek .ders-isim { color: #3B2E85; }
.katsayi-dusuk .ders-isim { color: #475569; }
.ders-isim span { font-size: 0.8rem; font-weight: 600; background: #e2e8f0; padding: 2px 8px; border-radius: 6px; color: #64748b; }

.input-grup { display: flex; gap: 15px; align-items: center; flex-wrap: wrap; }
.input-kutu { display: flex; flex-direction: column; align-items: center; }
.input-kutu label { font-size: 0.8rem; font-weight: 700; color: #64748b; margin-bottom: 6px; text-transform: uppercase; }

.input-kutu select { 
    width: 80px; padding: 12px 10px; padding-right: 25px; text-align: center; border: 2px solid #e2e8f0; 
    border-radius: 10px; font-weight: 800; font-size: 1.1rem; color: #1e293b; outline: none; transition: 0.3s; 
    cursor: pointer; appearance: none; background-color: #f8fafc;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
    background-repeat: no-repeat; background-position: right 10px center; background-size: 14px;
}
.input-kutu select:focus, .input-kutu select:hover { border-color: #3B2E85; background-color: #fff; box-shadow: 0 0 0 3px rgba(59, 46, 133, 0.1); }

.net-kutu { background: #fef08a; padding: 12px 15px; border-radius: 10px; font-weight: 800; color: #854d0e; min-width: 100px; text-align: center; margin-top: 18px; border: 1px solid #fde047; }
.katsayi-yuksek .net-kutu { background: #e0e7ff; color: #3B2E85; border-color: #c7d2fe; }

.btn-temizle { width: 100%; padding: 15px; background: #fff; border: 2px dashed #cbd5e1; color: #64748b; font-weight: 800; font-size: 1rem; border-radius: 12px; margin-top: 25px; cursor: pointer; transition: 0.3s; display: flex; align-items: center; justify-content: center; gap: 8px; }
.btn-temizle:hover { background: #fef2f2; color: #ef4444; border-color: #fca5a5; }

/* SAĞ TARAF: SONUÇ ALANI */
.sonuc-alani { display: flex; flex-direction: column; gap: 25px; }

.sonuc-karti { background: linear-gradient(135deg, #3B2E85 0%, #1e1b4b 100%); padding: 40px 30px; border-radius: 20px; color: white; text-align: center; box-shadow: 0 10px 30px rgba(59, 46, 133, 0.15); border-bottom: 5px solid #facc15; position: relative; overflow: hidden; }
.sonuc-karti::before { content: '\f1da'; font-family: 'Font Awesome 6 Free'; font-weight: 900; position: absolute; font-size: 10rem; opacity: 0.05; right: -20px; bottom: -20px; transform: rotate(-15deg); }
.sonuc-karti h3 { margin: 0 0 15px 0; font-size: 1.3rem; opacity: 0.9; text-transform: uppercase; letter-spacing: 1px; font-weight: 800; }
.dev-puan { font-size: 5rem; font-weight: 900; line-height: 1; text-shadow: 0 4px 10px rgba(0,0,0,0.3); margin-bottom: 20px; color: #fff; }
.bilgi-notu { font-size: 0.85rem; opacity: 0.8; margin: 0; line-height: 1.5; background: rgba(0,0,0,0.2); padding: 10px; border-radius: 8px; }

.sonuc-istatistik { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.mini-kutu { padding: 20px 15px; border-radius: 16px; text-align: center; display: flex; flex-direction: column; background: #fff; border: 1px solid #e2e8f0; box-shadow: 0 4px 10px rgba(0,0,0,0.01); transition: 0.3s; }
.mini-kutu:hover { transform: translateY(-3px); box-shadow: 0 8px 15px rgba(0,0,0,0.04); }
.mini-kutu span { font-size: 0.85rem; text-transform: uppercase; font-weight: 800; opacity: 0.7; margin-bottom: 8px; }
.mini-kutu strong { font-size: 2rem; font-weight: 900; line-height: 1; }

.dogru-k { border-bottom: 4px solid #22c55e; } .dogru-k strong { color: #166534; }
.yanlis-k { border-bottom: 4px solid #ef4444; } .yanlis-k strong { color: #991b1b; }
.bos-k { border-bottom: 4px solid #cbd5e1; } .bos-k strong { color: #475569; }
.net-k { border-bottom: 4px solid #3B2E85; } .net-k strong { color: #3B2E85; }

.misafir-davet-kutusu { background: #fff; border: 2px solid #e2e8f0; border-radius: 16px; padding: 30px 25px; text-align: center; box-shadow: 0 4px 15px rgba(0,0,0,0.02); transition: 0.3s; }
.misafir-davet-kutusu:hover { border-color: #3B2E85; }
.misafir-davet-kutusu h4 { color: #1e1b4b; margin: 0 0 10px 0; font-size: 1.3rem; font-weight: 800; }
.misafir-davet-kutusu p { color: #64748b; font-size: 0.95rem; margin-bottom: 20px; line-height: 1.6; }
.btn-davet { display: inline-flex; align-items: center; justify-content: center; gap: 8px; background: #3B2E85; color: white; padding: 12px 30px; border-radius: 10px; font-weight: 800; text-decoration: none; transition: 0.3s; }
.btn-davet:hover { background: #facc15; color: #3B2E85; transform: scale(1.05); }

@media (max-width: 576px) {
    .input-grup { flex-wrap: wrap; justify-content: center; width: 100%; }
    .net-kutu { width: 100%; margin-top: 5px; }
    .ders-satir { flex-direction: column; text-align: center; }
    .ders-isim { justify-content: center; }
    .dev-puan { font-size: 4rem; }
}

/* =========================================
   VİDEO KÜTÜPHANESİ TASARIMI (PREMIUM & RESPONSIVE)
========================================= */
.library-container { max-width: 1350px; margin: 40px auto 80px; padding: 0 20px; display: grid; grid-template-columns: 260px 1fr; gap: 35px; align-items: start; font-family: 'Segoe UI', sans-serif; box-sizing: border-box; width: 100%; }

/* SOL MENÜ (KATEGORİ SIDEBAR) */
.library-sidebar { background: #fff; border-radius: 16px; padding: 25px; box-shadow: 0 5px 20px rgba(0,0,0,0.04); border: 1px solid #e2e8f0; position: sticky; top: 100px; box-sizing: border-box; }
.sidebar-title { font-size: 1.1rem; font-weight: 800; color: #1e293b; margin: 0 0 20px 0; display: flex; align-items: center; gap: 10px; padding-bottom: 15px; border-bottom: 2px dashed #e2e8f0; }
.sidebar-title i { color: #facc15; }
.cat-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.cat-item a { display: flex; justify-content: space-between; align-items: center; padding: 12px 15px; background: #f8fafc; border-radius: 10px; color: #475569; font-weight: 600; text-decoration: none; transition: 0.3s; font-size: 0.95rem; border: 1px solid transparent; }
.cat-item a:hover { background: #fff; border-color: #3B2E85; color: #3B2E85; box-shadow: 0 4px 10px rgba(59,46,133,0.05); transform: translateX(5px); }
.cat-count { background: #e2e8f0; color: #475569; font-size: 0.8rem; padding: 2px 8px; border-radius: 20px; font-weight: 800; }
.cat-item a:hover .cat-count { background: #3B2E85; color: #fff; }

/* Kategori Detay Görünümü Ekleri */
.cat-item.active a { background: #3B2E85; color: #fff; border-color: #3B2E85; box-shadow: 0 4px 10px rgba(59,46,133,0.1); }
.cat-item.active a .cat-count { background: #facc15; color: #3B2E85; }
.kategori-detay-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 25px; flex-wrap: wrap; gap: 15px; border-bottom: 2px dashed #e2e8f0; padding-bottom: 15px; }

/* ANA İÇERİK & VİDEO KARTLARI */
.library-content { width: 100%; box-sizing: border-box; min-width: 0; }
.section-heading { font-size: 1.4rem; font-weight: 800; color: #1e1b4b; margin: 0 0 20px 0; display: flex; align-items: center; gap: 10px; }
.section-heading i { color: #f43f5e; }

/* Grid (Sadece son eklenenler için) */
.video-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; width: 100%; box-sizing: border-box; }

/* LGS Ozel Slider (Oynatma Listeleri ve Popüler Videolar) */
.lgs-slider-wrap { position: relative; width: 100%; display: flex; align-items: center; margin-bottom: 40px; }
.lgs-slider-track { display: flex; gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; flex-grow: 1; padding: 10px 0; -ms-overflow-style: none; scrollbar-width: none; }
.lgs-slider-track::-webkit-scrollbar { display: none; }
.slider-arrow { background: #fff; border: 1px solid #e2e8f0; border-radius: 50%; width: 45px; height: 45px; display: flex; justify-content: center; align-items: center; cursor: pointer; box-shadow: 0 5px 15px rgba(0,0,0,0.1); position: absolute; z-index: 10; color: #3B2E85; font-size: 1.2rem; transition: 0.3s; }
.slider-arrow:hover { background: #3B2E85; color: #fff; transform: scale(1.1); }
.slider-arrow.prev { left: -22px; }
.slider-arrow.next { right: -22px; }

/* Slider İçindeki Kart Genişlikleri (Masaüstü 3'lü Gösterim) */
.lgs-slider-track .playlist-card, .lgs-slider-track .video-card { flex: 0 0 calc(33.333% - 14px); scroll-snap-align: start; }

.video-card, .playlist-card { background: #fff; border-radius: 16px; overflow: hidden; box-shadow: 0 5px 20px rgba(0,0,0,0.04); border: 1px solid #e2e8f0; transition: 0.3s; cursor: pointer; display: flex; flex-direction: column; width: 100%; }
.video-card:hover, .playlist-card:hover { transform: translateY(-5px); box-shadow: 0 15px 35px rgba(0,0,0,0.08); border-color: #cbd5e1; }

.video-thumb { position: relative; width: 100%; padding-bottom: 56.25%; background: #0f172a; overflow: hidden; flex-shrink: 0; }
.video-thumb img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.85; transition: 0.5s; }
.video-card:hover .video-thumb img { opacity: 0.5; transform: scale(1.05); }

.play-overlay { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 50px; height: 50px; background: rgba(244, 63, 94, 0.9); border-radius: 50%; display: flex; justify-content: center; align-items: center; color: #fff; font-size: 1.2rem; opacity: 0; transition: 0.3s; box-shadow: 0 0 20px rgba(244, 63, 94, 0.5); }
.video-card:hover .play-overlay { opacity: 1; }

.lock-badge { position: absolute; top: 10px; right: 10px; background: rgba(15, 23, 42, 0.85); backdrop-filter: blur(4px); color: #facc15; padding: 6px 12px; border-radius: 8px; font-size: 0.8rem; font-weight: 800; display: flex; align-items: center; gap: 5px; border: 1px solid rgba(255,255,255,0.1); }
.type-badge { position: absolute; top: 10px; left: 10px; background: #3B2E85; color: #fff; padding: 4px 10px; border-radius: 6px; font-size: 0.75rem; font-weight: 700; box-shadow: 0 2px 10px rgba(0,0,0,0.2); }

.video-info { padding: 15px; flex-grow: 1; display: flex; flex-direction: column; }
.v-title { font-size: 1rem; font-weight: 800; color: #1e293b; margin: 0 0 10px 0; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.v-meta { display: flex; justify-content: space-between; align-items: flex-end; margin-top: auto; padding-top: 15px; border-top: 1px solid #f1f5f9; font-size: 0.85rem; color: #64748b; font-weight: 600; width: 100%; }

/* PLAYLIST ÖZEL TASARIM */
.pl-thumb { background: linear-gradient(135deg, #1e1b4b, #3B2E85); height: 140px; display: flex; flex-direction: column; justify-content: center; align-items: center; color: #fff; position: relative; }
.pl-thumb i { font-size: 3rem; margin-bottom: 10px; color: #facc15; }
.pl-count { background: rgba(0,0,0,0.4); padding: 4px 10px; border-radius: 20px; font-size: 0.8rem; font-weight: 700; border: 1px solid rgba(255,255,255,0.1); }
.pl-title { padding: 15px; font-size: 1.05rem; font-weight: 800; color: #1e293b; text-align: center; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* =========================================
   MODERN SAYFALANDIRMA (PAGINATION) DÜZELTMESİ
========================================= */
.modern-pagination { 
    display: flex; 
    justify-content: center; 
    align-items: center;
    flex-wrap: wrap; 
    gap: 10px; 
    margin-top: 30px; 
}
.modern-pagination .page-numbers { 
    display: inline-flex; 
    justify-content: center; 
    align-items: center; 
    min-width: 45px; 
    height: 45px; 
    background: #fff; 
    border-radius: 12px; 
    color: #475569; 
    font-weight: 800; 
    text-decoration: none; 
    border: 1px solid #e2e8f0; 
    transition: 0.3s; 
    padding: 0 15px; 
    box-sizing: border-box;
}
.modern-pagination a.page-numbers:hover { 
    background: #f1f5f9; 
    color: #3B2E85; 
    transform: translateY(-2px); 
}
.modern-pagination .page-numbers.current { 
    background: #3B2E85; 
    color: #facc15; 
    border-color: #3B2E85; 
}
.modern-pagination .page-numbers.dots { 
    background: transparent; 
    border: none; 
    font-size: 1.2rem; 
    min-width: auto; 
    padding: 0; 
}

/* =========================================
   PREMIUM KİLİTLİ İÇERİK & MODAL TASARIMI
========================================= */
/* Genel Modal Ayarları */
.custom-modal { display: none; position: fixed; z-index: 999999 !important; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(15, 23, 42, 0.9); backdrop-filter: blur(8px); align-items: center; justify-content: center; padding: 15px; box-sizing: border-box; }
.modal-icerik { background: #fff; padding: 20px; border-radius: 20px; width: 100%; max-width: 850px; position: relative; box-shadow: 0 25px 50px rgba(0,0,0,0.4); box-sizing: border-box; }
.video-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; border-radius: 12px; background: #000; }
.video-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none; }

/* Kapat Butonunun Kesilmesini Önleme */
.btn-modal-kapat { position: absolute; top: -15px; right: -15px; background: #ef4444; color: #fff; border: none; width: 42px; height: 42px; border-radius: 50%; font-size: 18px; cursor: pointer; transition: 0.3s; box-shadow: 0 5px 15px rgba(239, 68, 68, 0.4); z-index: 1000; display: flex; align-items: center; justify-content: center; }
.btn-modal-kapat:hover { transform: scale(1.1) rotate(90deg); background: #dc2626; }

/* Playlist Modal Tasarımı */
.pl-modal-icerik { width: 100%; max-width: 1000px; background: #fff; border-radius: 16px; display: flex; flex-direction: row; height: 650px; max-height: 90vh; position: relative; box-shadow: 0 25px 50px rgba(0,0,0,0.4); box-sizing: border-box; overflow: visible !important; }
.pl-left { flex: 7; background: #000; position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; border-top-left-radius: 16px; border-bottom-left-radius: 16px; overflow: hidden; }
.pl-right { flex: 3; background: #f8fafc; border-left: 1px solid #e2e8f0; display: flex; flex-direction: column; border-top-right-radius: 16px; border-bottom-right-radius: 16px; overflow: hidden; }
.pl-header { padding: 20px; background: #fff; border-bottom: 1px solid #e2e8f0; font-weight: 800; color: #1e293b; font-size: 1.1rem; display: flex; justify-content: space-between; align-items: center; box-shadow: 0 4px 10px rgba(0,0,0,0.02); z-index: 2;}
.pl-list { overflow-y: auto; flex: 1; padding: 10px; display: flex; flex-direction: column; gap: 8px; }
.pl-item { display: flex; gap: 10px; padding: 10px; background: #fff; border: 1px solid #e2e8f0; border-radius: 8px; cursor: pointer; transition: 0.2s; align-items: center; }
.pl-item:hover { background: #f1f5f9; border-color: #cbd5e1; }
.pl-item.active { border-color: #3B2E85; background: #e0e7ff; }
.pl-item-thumb { width: 90px; height: 50px; background: #0f172a; border-radius: 4px; display: flex; justify-content: center; align-items: center; color: #fff; flex-shrink: 0; overflow: hidden; position: relative;}
.pl-item-thumb img { width: 100%; height: 100%; object-fit: cover; opacity: 0.8; }
.pl-item.active .pl-item-thumb img { opacity: 0.5; }
.pl-item.active .pl-item-thumb::after { content: '\f04b'; font-family: 'Font Awesome 5 Free'; font-weight: 900; position: absolute; color: #fff; font-size: 1.2rem; }
.pl-item-info { flex: 1; overflow: hidden; }
.pl-item-title { font-size: 0.85rem; font-weight: 700; color: #1e293b; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin: 0 0 5px 0; line-height: 1.3;}
.pl-item-meta { font-size: 0.75rem; color: #64748b; display: flex; align-items: center; gap: 8px; font-weight: 600;}

/* Kilitli İçerik Ekranı - Tekil Video (Açık Tema) */
.locked-content { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; width: 100%; height: 100%; padding: 50px 20px; box-sizing: border-box; background: #f8fafc; border-radius: 12px; }
.locked-icon-wrap { width: 80px; height: 80px; background: rgba(59, 46, 133, 0.1); color: #3B2E85; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 2.2rem; margin-bottom: 20px; box-shadow: 0 0 0 10px rgba(59, 46, 133, 0.04); }
.locked-title { font-size: 1.6rem; font-weight: 900; color: #1e293b; margin: 0 0 12px 0; }
.locked-desc { font-size: 1rem; color: #475569; margin: 0 0 30px 0; line-height: 1.6; max-width: 450px; font-weight: 500; }
.btn-premium-login { background: linear-gradient(135deg, #3B2E85, #1e1b4b); color: #fff; padding: 14px 35px; border-radius: 50px; text-decoration: none; font-weight: 800; font-size: 1rem; display: inline-flex; align-items: center; gap: 10px; transition: all 0.3s ease; box-shadow: 0 10px 20px rgba(59, 46, 133, 0.2); }
.btn-premium-login:hover { transform: translateY(-3px); box-shadow: 0 15px 25px rgba(59, 46, 133, 0.3); color: #facc15; }

/* Kilitli İçerik Ekranı - Playlist (Koyu Tema) */
.pl-left .locked-content { background: #0f172a; border-radius: 0; }
.pl-left .locked-icon-wrap { background: rgba(244, 63, 94, 0.1); color: #f43f5e; box-shadow: 0 0 0 10px rgba(244, 63, 94, 0.05); }
.pl-left .locked-title { color: #fff; }
.pl-left .locked-desc { color: #94a3b8; }
.pl-left .btn-premium-login { background: linear-gradient(135deg, #f43f5e, #e11d48); box-shadow: 0 10px 20px rgba(225, 29, 72, 0.2); }
.pl-left .btn-premium-login:hover { box-shadow: 0 15px 25px rgba(225, 29, 72, 0.3); color: #fff; }

/* =========================================
   MOBİL (RESPONSIVE) DÜZENLEMELER
========================================= */
@media (max-width: 992px) {
    .library-container { grid-template-columns: 1fr; padding: 0 15px; gap: 20px; margin-top: 20px; }
    
    /* Mobil Kategori Kaydırma ve Toparlanma Çözümü */
    .library-sidebar { position: relative; top: 0; padding: 15px; }
    .cat-list { flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 10px; }
    .cat-item { width: auto; flex: 1 1 calc(50% - 10px); min-width: 130px; }
    .cat-item a { justify-content: center; gap: 10px; }
    
    /* Slider Mobilde 1 Video Gösterecek Şekilde Ayarlama */
    .lgs-slider-track .playlist-card, .lgs-slider-track .video-card { flex: 0 0 100%; }
    .slider-arrow { width: 35px; height: 35px; font-size: 1rem; }
    .slider-arrow.prev { left: -5px; }
    .slider-arrow.next { right: -5px; }
    
    /* Grid Mobilde Tek Sütun */
    .video-grid { grid-template-columns: 1fr; }
    
    /* Playlist Modal Mobilde Tam Uyum */
    .pl-modal-icerik { flex-direction: column; height: 90vh; border-radius: 12px;}
    .pl-left { flex: none; width: 100%; aspect-ratio: 16/9; height: auto; border-radius: 0; border-top-left-radius: 12px; border-top-right-radius: 12px; }
    .pl-right { flex: 1; border-left: none; border-top: 1px solid #e2e8f0; overflow: hidden; display: flex; flex-direction: column; border-radius: 0; border-bottom-left-radius: 12px; border-bottom-right-radius: 12px; }
    .pl-list { flex: 1; overflow-y: auto; }
    
    /* MODİLDE KİLİTLİ EKRAN (Butonun Görünmesi İçin Daraltma) */
    .pl-left .locked-content { padding: 15px 10px; justify-content: center; }
    .pl-left .locked-icon-wrap { width: 45px; height: 45px; font-size: 1.2rem; margin-bottom: 8px; }
    .pl-left .locked-title { font-size: 1.1rem; margin-bottom: 5px; }
    .pl-left .locked-desc { font-size: 0.8rem; margin-bottom: 10px; line-height: 1.3; max-width: 100%; }
    .pl-left .btn-premium-login { padding: 8px 16px; font-size: 0.85rem; }
}

/* =========================================
   ONLINE TEST MERKEZİ LİSTELEME TASARIMI
========================================= */
.tm-wrap { background-color: #f8fafc; padding-top: 100px; padding-bottom: 80px; margin-bottom: -80px; min-height: 85vh; font-family: 'Segoe UI', sans-serif; }
.tm-container { max-width: 1100px; margin: 0 auto; padding: 0 20px; }

.test-list-container { display: flex; flex-direction: column; gap: 15px; margin-top: 30px; }

/* Premium Kart Tasarımı */
.test-list-card { background: #fff; border-radius: 16px; padding: 20px 25px; border: 1px solid #e2e8f0; box-shadow: 0 4px 12px rgba(0,0,0,0.02); display: flex; align-items: center; justify-content: space-between; gap: 20px; transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275); }
.test-list-card:hover { transform: translateY(-3px); box-shadow: 0 12px 25px rgba(59, 46, 133, 0.06); border-color: #cbd5e1; }

.test-card-icon { width: 55px; height: 55px; background: #e0e7ff; color: #3B2E85; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 22px; flex-shrink: 0; }
.test-card-details { flex-grow: 1; }
.test-card-title { margin: 8px 0; font-size: 1.2rem; font-weight: 800; color: #1e293b; }

.test-meta-row { display: flex; align-items: center; gap: 15px; flex-wrap: wrap; }
.test-badge-ders { background: #3B2E85; color: #facc15; font-size: 0.75rem; font-weight: 800; padding: 4px 10px; border-radius: 6px; text-transform: uppercase; }
.test-meta-info { font-size: 0.85rem; color: #64748b; font-weight: 600; display: flex; align-items: center; gap: 5px; }

.test-card-time-range { margin: 0; font-size: 0.85rem; color: #94a3b8; font-weight: 500; }

/* Buton Devletleri */
.test-card-action { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; min-width: 140px; }
.btn-test { padding: 10px 20px; border-radius: 10px; text-decoration: none; font-weight: 700; font-size: 0.9rem; text-align: center; width: 100%; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; gap: 8px; transition: 0.2s; border: none; cursor: pointer; }

.btn-test-start { background: #10b981; color: #fff; box-shadow: 0 4px 10px rgba(16, 185, 129, 0.2); }
.btn-test-start:hover { background: #059669; transform: translateY(-2px); color: #fff; }

.btn-test-analiz { background: #3B2E85; color: #fff; box-shadow: 0 4px 10px rgba(59, 46, 133, 0.15); }
.btn-test-analiz:hover { background: #1e1b4b; transform: translateY(-2px); }

.btn-test-disabled { background: #f1f5f9; color: #94a3b8; cursor: not-allowed; }
.btn-test-expired { background: #fef2f2; color: #ef4444; border: 1px solid #fca5a5; cursor: not-allowed; }

.badge-test-sonuc { font-size: 0.8rem; font-weight: 800; color: #475569; background: #f1f5f9; padding: 3px 8px; border-radius: 6px; }

.info-box-test-merkezi { text-align: center; padding: 50px 20px; background: #fff; border-radius: 16px; border: 2px dashed #e2e8f0; color: #64748b; font-weight: 600; display: flex; flex-direction: column; gap: 10px; font-size: 1.1rem; }
.info-box-test-merkezi i { font-size: 40px; color: #cbd5e1; }

.test-analiz-boyut { max-width: 750px !important; }

@media (max-width: 768px) {
    .test-list-card { flex-direction: column; text-align: center; padding: 20px; }
    .test-meta-row { justify-content: center; }
    .test-card-action { width: 100%; align-items: center; }
}

/* =========================================
   CANLI ONLINE TEST EKRANI (PREMIUM UX/UI)
========================================= */
.test-screen-wrap { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; z-index: 9999999; background-color: #f8fafc; font-family: 'Segoe UI', sans-serif; display: flex; flex-direction: column; box-sizing: border-box; overflow: hidden; }

.test-top-bar { height: 75px; background: #3B2E85; color: #fff; display: flex; align-items: center; justify-content: space-between; padding: 0 40px; box-sizing: border-box; box-shadow: 0 4px 15px rgba(59, 46, 133, 0.15); flex-shrink: 0; }
.test-info-title { font-size: 1.1rem; font-weight: 800; display: flex; align-items: center; gap: 12px; }
.test-info-title span.mobil-gizle { background: rgba(255,255,255,0.2); font-size: 0.85rem; padding: 6px 12px; border-radius: 8px; color: #facc15; }

.test-counter-wrapper { display: flex; align-items: center; gap: 10px; background: #1e1b4b; padding: 8px 20px; border-radius: 50px; border: 1px solid rgba(255,255,255,0.15); font-weight: 900; font-size: 1.2rem; color: #facc15; }
.btn-finish-test { background: #ef4444; color: #fff; border: 2px solid #ef4444; padding: 8px 20px; border-radius: 10px; font-weight: 800; cursor: pointer; display: flex; align-items: center; gap: 8px; transition: 0.3s; }
.btn-finish-test:hover { background: #dc2626; border-color: #fff; }

.test-main-area { flex-grow: 1; display: flex; align-items: flex-start; justify-content: center; padding: 25px; box-sizing: border-box; overflow-y: auto; overflow-x: hidden; }
.question-display-box { background: #fff; border-radius: 20px; border: 1px solid #e2e8f0; box-shadow: 0 10px 30px rgba(0,0,0,0.05); max-width: 900px; width: 100%; padding: 20px; text-align: center; margin-bottom: 110px; }
.question-image { width: 100%; height: auto; border-radius: 8px; display: none; margin: 0 auto; }
.question-image.active-img { display: block; animation: fadeInQ 0.3s ease; }
@keyframes fadeInQ { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }

.test-bottom-bar { position: fixed; bottom: 0; left: 0; width: 100%; height: 90px; background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(10px); border-top: 1px solid #e2e8f0; display: flex; align-items: center; justify-content: space-between; padding: 0 40px; box-sizing: border-box; z-index: 99999; }
.alt-nav-sol, .alt-nav-sag { display: flex; align-items: center; gap: 15px; min-width: 150px; }
.alt-nav-sag { justify-content: flex-end; }
.soru-sayac-metin { font-weight: 800; color: #3B2E85; font-size: 1.1rem; }

.optik-form-wrapper { display: flex; align-items: center; gap: 12px; justify-content: center; flex-grow: 1; }
.btn-sik { width: 55px; height: 55px; border-radius: 50%; border: 3px solid #cbd5e1; background: #fff; color: #334155; font-size: 22px; font-weight: 900; cursor: pointer; transition: 0.2s; display: flex; align-items: center; justify-content: center; }
.btn-sik:hover { border-color: #3B2E85; color: #3B2E85; transform: translateY(-4px); }
.btn-sik.secili { background: #3B2E85; border-color: #3B2E85; color: #facc15; transform: translateY(-4px) scale(1.1); box-shadow: 0 10px 20px rgba(59,46,133,0.3); }

.btn-clear-selection { background: transparent; border: none; color: #64748b; font-weight: 700; cursor: pointer; display: flex; align-items: center; gap: 5px; transition: 0.2s; font-size: 0.9rem; }
.btn-clear-selection:hover { color: #ef4444; }

.btn-nav-question, .btn-prev-question { background: linear-gradient(135deg, #0ea5e9, #0284c7); color: #fff; border: none; padding: 12px 20px; border-radius: 12px; font-weight: 800; cursor: pointer; display: flex; align-items: center; gap: 8px; transition: 0.3s; }
.btn-prev-question { background: #94a3b8; color: #fff; }
.btn-prev-question:hover { background: #64748b; }
.btn-nav-question:hover { transform: translateX(4px); box-shadow: 0 6px 15px rgba(14,165,233,0.3); }
.btn-nav-question.onay-modu { background: #10b981; }

/* =========================================
   MOBİL DÜZENLEMELER (Kusursuz Görünüm)
========================================= */
@media (max-width: 850px) {
    .test-top-bar { padding: 0 15px; height: 60px; }
    .test-isim { font-size: 0.95rem; }
    .test-counter-wrapper { padding: 5px 12px; font-size: 1rem; min-width: 80px; }
    
    .test-main-area { padding: 5px; } 
    .question-display-box { padding: 5px; margin-bottom: 160px; border-radius: 8px; }
    
    .test-bottom-bar { height: auto; flex-direction: column; padding: 10px; gap: 12px; }
    .test-bottom-bar .mobil-gizle { display: inline !important; font-size: 0.9rem; } 
    
    .optik-form-wrapper { width: 100%; justify-content: space-between; order: 1; }
    .btn-sik { width: 50px; height: 50px; font-size: 18px; border-width: 2px; }
    .btn-clear-selection { background: #f1f5f9; padding: 8px 12px; border-radius: 8px; }
    
    .alt-nav-sol, .alt-nav-sag { width: 48%; justify-content: center; order: 2; }
    .soru-sayac-metin { display: none; } 
    .btn-nav-question, .btn-prev-question { width: 100%; justify-content: center; font-size: 0.9rem; padding: 12px 10px; }
}

/* =========================================
   ANALİZ MODALI VE YENİ DETAY GÖRÜNÜMÜ
========================================= */
.analiz-header-kutu { text-align: center; margin-bottom: 25px; border-bottom: 2px dashed #e2e8f0; padding-bottom: 20px; }
.analiz-header-kutu h3 { font-size: 1.5rem; font-weight: 900; color: #1e1b4b; margin: 0 0 5px 0; }
.analiz-header-kutu p { margin: 0; color: #64748b; font-size: 0.9rem; font-weight: 600; }

.analiz-skor-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 30px; }
.skor-kutu { padding: 15px 10px; border-radius: 12px; text-align: center; color: #fff; font-weight: 600; font-size: 0.9rem; box-shadow: 0 4px 10px rgba(0,0,0,0.1); }
.skor-kutu strong { display: block; font-size: 2rem; font-weight: 900; line-height: 1; margin-bottom: 5px; }

.kutu-dogru { background: linear-gradient(135deg, #10b981, #059669); }
.kutu-yanlis { background: linear-gradient(135deg, #ef4444, #dc2626); }
.kutu-bos { background: linear-gradient(135deg, #94a3b8, #64748b); }
.kutu-net { background: linear-gradient(135deg, #3B2E85, #1e1b4b); color: #facc15; border-bottom: 3px solid #facc15; }
.kutu-katilimci { background: linear-gradient(135deg, #0ea5e9, #0284c7); }
.kutu-sira { background: linear-gradient(135deg, #f59e0b, #d97706); }

/* Üst Üste Binmeyi Engelleyen Liste CSS'i */
.analiz-sorular-listesi { display: flex; flex-direction: column; gap: 12px; }
.analiz-soru-kart { background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; padding: 16px 20px; display: flex; justify-content: space-between; align-items: center; cursor: pointer; transition: all 0.3s ease; box-shadow: 0 2px 5px rgba(0,0,0,0.02); }
.analiz-soru-kart:hover { border-color: #3B2E85; transform: translateX(5px); box-shadow: 0 5px 15px rgba(59,46,133,0.1); }

.so-sol { font-weight: 800; color: #1e293b; font-size: 1.1rem; }
.so-sol i { margin-right: 8px; }
.so-sag { display: flex; align-items: center; gap: 10px; }

.badge-cvp { padding: 6px 12px; border-radius: 8px; font-size: 0.85rem; font-weight: 700; }
.b-senin { background: #e2e8f0; color: #475569; }
.b-dogru { background: #d1fae5; color: #065f46; border: 1px solid #34d399; }

.durum-dogru .so-sol i { color: #10b981; }
.durum-yanlis .so-sol i { color: #ef4444; }
.durum-yanlis .b-senin { background: #fee2e2; color: #991b1b; border: 1px solid #f87171; }
.durum-bos .so-sol i { color: #94a3b8; }
.ok-ikon { color: #94a3b8; margin-left: 10px; font-size: 1.2rem; }

/* Detay Ekranı CSS'i */
.detay-ust-bar { display: flex; align-items: center; justify-content: space-between; padding-bottom: 20px; border-bottom: 1px solid #e2e8f0; margin-bottom: 20px; }
.btn-analiz-geri { background: #f1f5f9; color: #334155; border: none; padding: 10px 20px; border-radius: 10px; font-weight: 700; cursor: pointer; transition: 0.2s; display: flex; align-items: center; gap: 8px; }
.btn-analiz-geri:hover { background: #e2e8f0; color: #000; }
.detay-icerik-alani { text-align: center; }
.soru-detay-resim-kutu img { max-width: 100%; border-radius: 12px; box-shadow: 0 10px 30px rgba(0,0,0,0.05); border: 1px solid #e2e8f0; }

@media (max-width: 768px) {
    .analiz-skor-grid { grid-template-columns: repeat(2, 1fr); }
    .analiz-soru-kart { flex-direction: column; align-items: flex-start; gap: 15px; }
    .so-sag { width: 100%; justify-content: space-between; }
    .ok-ikon { display: none; }
}

/* Test Merkezi Extra CSS */
.sonuc-ozet-alani { display: flex; align-items: center; gap: 10px; margin-bottom: 15px; }
.badge-test-puan { background: #f59e0b; color: #fff; padding: 6px 12px; border-radius: 6px; font-weight: 800; font-size: 0.85rem; }
.buton-grup-yan-yana { display: flex; gap: 10px; }
.btn-test-tekrar { background: #3B2E85; color: #fff; }
.btn-test-tekrar:hover { background: #1e1b4b; }