
/* ✅ Genel Stiller */


/* ✅ Excel Veri Giriş Alanı */
#oso_excel_input {
    width: 100%;
    height: 180px;
    font-size: 14px;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 6px;
    resize: none;
    background: #fff;
    box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.1);
}

/* ✅ Gönderme Butonu */
#oso_excel_gonder {
    background: linear-gradient(135deg, #0073aa, #0099cc);
    color: white;
    font-size: 16px;
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    margin-top: 10px;
    transition: background 0.3s ease-in-out;
}

#oso_excel_gonder:hover {
    background: linear-gradient(135deg, #005a87, #0073aa);
}

/* ✅ Bölüm Kartları Konteyneri */
.oso-bolum-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
    margin: 30px 0;
}

/* ✅ Kart Stili */
.oso-bolum-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 180px;
    height: 120px;
    background: #ECF7FB;
    color: #0073aa;
    font-size: 16px;
    font-weight: bold;
    border-radius: 12px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease-in-out;
    text-align: center;
    text-decoration: none;
    padding: 15px;
    border: 2px solid #0073aa;
    cursor: pointer;
}

/* ✅ Hover Efekti */
.oso-bolum-btn:hover {
    background: #0073aa;
    color: white;
    transform: translateY(-5px) scale(1.05);
    box-shadow: 0 8px 20px rgba(0, 115, 170, 0.3);
}

/* ✅ Mobil Uyumlu Tasarım */
@media (max-width: 600px) {
    .oso-bolum-btn {
        width: 100px;
        height: 100 px;
        font-size: 13px;
        padding: 7px;
    }
}


/* ✅ Popup İçindeki Butonların Bulanıklık Yapmasını Engelleyen Optimizasyon */
.oso-popup {
    display: none;
    position: fixed;
    z-index: 9999;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 90%;
    max-width: 500px;
    background: rgba(255, 255, 255, 0.98);
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0px 15px 30px rgba(0, 0, 0, 0.2);
    transition: opacity 0.3s ease-in-out;
    text-align: center;
    overflow-y: auto;
    max-height: 80vh;
    
    /* ✅ Bulanıklık Sorununu Önleyen CSS */
    will-change: opacity, transform;
    transform-origin: center;
    backface-visibility: hidden;
}

/* ✅ Popup İçindeki Scroll Bar */
.oso-popup::-webkit-scrollbar {
    width: 18px;
}

.oso-popup::-webkit-scrollbar-thumb {
    background-color: rgba(0, 115, 170, 0.8);
    border-radius: 4px;
}

.oso-popup::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.1);
}

/* ✅ Kapatma Butonu */
.oso-close {
    position: absolute;
    top: 15px;
    right: 15px;
    font-size: 25px;
    cursor: pointer;
    color: #ff2d2d;
    transition: color 0.3s;
}

.oso-close:hover {
    color: #d60000;
}

/* ✅ Koyu Arkaplan (Overlay) */
.oso-popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    
    display: none;
    z-index: 999;
}

/* ✅ Hedef Butonları */
.oso-hedef-btn {
    display: block;
    margin: 6px auto;
    padding: 12px 18px;
    width: 90%;
    background: #d3ffeb ;
    color: #213242;
    font-weight: bold;
    border: none;
    cursor: pointer;
    border-radius: 8px;
    text-decoration: none;
    text-align: center;
    font-size: 15px;
    
    /* 📌 BULANIKLIK SORUNUNU ENGELLEYEN OPTİMİZASYON */
    will-change: transform;
    transform: translateZ(0);
    backface-visibility: hidden;
    transition: background 0.3s ease-in-out;
}

.oso-hedef-btn:hover {
    background: #a3fcd3 ;
}



/* ✅ Öğrenci Listesi */
.oso-admin-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
    background: white;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.oso-admin-table th,
.oso-admin-table td {
    padding: 12px;
    border: 1px solid #ddd;
    text-align: left;
}

.oso-admin-table th {
    background: #0073aa;
    color: white;
    font-weight: bold;
}

.oso-admin-table tr:nth-child(even) {
    background: #f9f9f9;
}

/* ✅ Mobil Uyum */
@media (max-width: 500px) {
    .oso-popup {
        width: 95%;
        max-width: 350px;
    }

    .oso-admin-table th,
    .oso-admin-table td {
        padding: 10px;
        font-size: 14px;
    }

    .oso-hedef-btn {
        font-size: 14px;
    }
}

/* ✅ Parola Girişi Sayfası */
.oso-parola-container {
    display: flex;
    justify-content: center;
    align-items: center;

}

.oso-parola-box {
    background: white;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.2);
    text-align: center;
    width: 350px;
}

.oso-parola-box h2 {
    font-size: 22px;
    color: #0073aa;
    margin-bottom: 15px;
}

.oso-parola-box input {
    width: 100%;
    padding: 10px;
    font-size: 16px;
    border: 1px solid #ccc;
    border-radius: 6px;
    outline: none;
    transition: border-color 0.3s ease-in-out;
}

.oso-parola-box input:focus {
    border-color: #0073aa;
}

.oso-parola-box button {
    width: 100%;
    padding: 10px;
    background: #0073aa;
    color: white;
    border: none;
    font-size: 16px;
    margin-top: 10px;
    cursor: pointer;
    border-radius: 6px;
    transition: background 0.3s;
}

.oso-parola-box button:hover {
    background: #005a87;
}




#iframePopup {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90vw;
    height: 85vh;
    background-color: #fff;
    z-index: 9999;
    border-radius: 12px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2);
    overflow: hidden;
    border: 1px solid #ddd;
}

#popupHeader {
    background-color: #393e6c;
    color: white;
    padding: 10px 20px;
    font-weight: bold;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#popupHeader span {
    flex-grow: 1;
}

#popupButtons {
    display: flex;
    gap: 10px;
    align-items: center;
}

#popupButtons button {
    border: none;
    border-radius: 4px;
    padding: 6px 10px;
    font-size: 13px;
    cursor: pointer;
    transition: 0.2s ease;
}

/* Yazıya Git (sarı) */
#popupOpenInNewTab {
    background-color: #ffd700;
    color: #000;
}
#popupOpenInNewTab:hover {
    background-color: #ffea8a;
}

/* Kapat (kırmızı) */
#popupClose {
    background-color: crimson;
    color: #fff;
}
#popupClose:hover {
    background-color: #e60026;
}

#popupIframe {
    width: 100%;
    height: calc(100% - 50px);
    border: none;
}



/* DERS İÇERİKLERİ   */
.ders-btn {
    background: linear-gradient(135deg, #4a90e2, #357ABD);
    color: white;
    padding: 10px 18px;
    border: none;
    border-radius: 6px;
    font-size: 15px;
    cursor: pointer;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    transition: 0.3s ease all;
}
.ders-btn:hover {
    background: linear-gradient(135deg, #2d6f9f, #1a4f7a);
    transform: scale(1.02);
}

.oso-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.6);
    display: flex;
    justify-content: center;
    align-items: center;
}

.oso-modal-popup {
    background: white;
    padding: 30px;
    border-radius: 10px;
    max-width: 700px;
    width: 89%;
    max-height: 90vh;
    overflow-y: auto;
    position: relative;
    box-shadow: 0 10px 40px rgba(0,0,0,0.3);
    animation: fadeInUp 0.3s ease-out;
}

.oso-modal-close {
    position: absolute;
    top: 10px;
    right: 15px;
    font-size: 22px;
    background: none;
    border: none;
    color: #999;
    cursor: pointer;
}
#ders-icerikleri-goster {
    width: 100%;
    height: 55px;
    background: linear-gradient(135deg, #f5f7fa, #e4ecf5);
    color: #2c3e50;
    padding: 16px 24px; /* önceki: 12px 20px */
    border: 1px solid #d0d7e2;
    border-radius: 8px;
    font-size: 18px; /* önceki: 16px */
    font-weight: 600;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.06);
}

#ders-icerikleri-goster:hover {
    background: linear-gradient(135deg, #e8f0fa, #d4e3f1);
    box-shadow: 0 6px 14px rgba(0, 0, 0, 0.08);
}
.section-box {
    background: #f9fbfc;
    border: 1px solid #dce4ec;
    border-radius: 10px;
    padding: 25px 30px;
    margin-bottom: 40px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.03);
}
/* 🎨 Hafif mavi ton - Ders içerikleri */
.ders-section {
    background: #f0f5fa;
    border: 2px solid #144678;
}

/* 🎨 Hafif yeşilimsi ton - Modül alanı */
.modul-section {
    background: #f4f9f4;
    border: 2px solid #098909;
}

.section-box h2 {
    font-size: 20px;
    margin-bottom: 15px;
    color: #34495e;
}

.section-desc {
    font-size: 14px;
    color: #555;
    margin-bottom: 20px;
}
.toggle-section-btn {
    width: 100%;
    height: 55px;
    background: linear-gradient(135deg, #81f0a1, #e4ecf5);
    color: #2c3e50;
    padding: 16px 24px; /* önceki: 12px 20px */
    border: 1px solid #d0d7e2;
    border-radius: 8px;
    font-size: 18px; /* önceki: 16px */
    font-weight: 600;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.06);
}

.toggle-section-btn:hover {
    background: #2980b9;
}

@media (max-width: 600px) {
    #ders-icerikleri-goster,
    .toggle-section-btn {
        font-size: 15px;
        padding: 10px 16px;
        height: auto;
        line-height: 1.4;
        font-weight: 500;
        white-space: normal;
        word-break: break-word;
    }

  
}
#oso-duzenle-modal {
    display: none;
    position: fixed;
       top: calc(5% + 32px);
    left: calc(50% + 80px); /* 160px / 2 = 80px kaydırır */
   
    transform: translateX(-50%);
    background: #fff;
    padding: 30px;
    border: 1px solid #ccc;
  z-index: 999999 !important;
    max-width: 1100px; /* genişliği artırdık */
    width: 90%;
    max-height: 90vh;
    overflow: hidden; /* dış scroll kapalı */
    box-shadow: 0 4px 20px rgba(0,0,0,0.2);
    border-radius: 8px;
}
#oso-duzenle-modal form {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    overflow-y: auto;
    max-height: 75vh; /* sadece içeriğe scroll */
    padding-right: 10px; /* scroll bar için boşluk */
}
.ogrenci-form-grup {
    flex: 0 0 calc(20% - 20px); /* 5 sütun */
    display: flex;
    flex-direction: column;
}
.ogrenci-form-grup label {
    font-weight: bold;
    font-size: 13px;
    margin-bottom: 4px;
}
.ogrenci-form-grup input {
    padding: 6px;
    font-size: 13px;
    width: 100%;
    box-sizing: border-box;
}
#oso-duzenle-modal h3 {
    flex-basis: 100%;
    margin: 20px 0 5px;
    font-size: 15px;
    color: #333;
    border-bottom: 1px solid #ddd;
    padding-bottom: 3px;
}

.duzenle-butonlar-top {
    margin: 15px 0 25px;
    text-align: right;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}
#buyuk-input-kutu {
    border: 1px solid #ccc;
    background: #fefefe;
    animation: zoomIn 0.2s ease-out;
}

@keyframes zoomIn {
    from { transform: scale(0.8) translate(-50%, -50%); opacity: 0; }
    to { transform: scale(1) translate(-50%, -50%); opacity: 1; }
}

#bastan-basla {
    background-color: #f2f2f2;
    border: 1px solid #bbb;
    padding: 8px 14px;
    font-size: 14px;
    color: #333;
    border-radius: 6px;
    cursor: pointer;
    margin-left: 10px;
    transition: background-color 0.2s ease, color 0.2s ease;
}

#bastan-basla:hover {
    background-color: #e0e0e0;
    color: #000;
    border-color: #999;
}


#dk-ders-kontrol-alani {
    max-width: 600px;
    margin: 30px auto;
    font-family: "Segoe UI", sans-serif;
}

#dk-ogrenci-ara {
    width: 100%;
    padding: 10px;
    font-size: 16px;
    border: 2px solid #ccc;
    border-radius: 4px;
}

#dk-ogrenci-sonuclar {
    margin-top: 8px;
    border: 1px solid #ddd;
    border-radius: 4px;
    max-height: 200px;
    overflow-y: auto;
    background: #fff;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

.dk-ogrenci-sec {
    padding: 10px;
    cursor: pointer;
    border-bottom: 1px solid #eee;
    transition: background-color 0.2s ease;
}

.dk-ogrenci-sec:hover {
    background-color: #f0f0f0;
}

#dk-ders-icerikleri {
    margin-top: 25px;
    padding: 20px;
    background: #fdfdfd;
    border: 1px solid #ccc;
    border-radius: 6px;
}

.dk-ders-icerik-kutu {
    line-height: 1.6;
}

.dk-ders-icerik-kutu strong {
    display: inline-block;
    margin-top: 10px;
    color: #444;
}

.ders-linko-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: linear-gradient(135deg, #00b894, #0984e3);
    color: #fff;
    padding: 12px 20px;
    border: none;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 4px 10px rgba(0,0,0,0.15);
    transition: all 0.3s ease;
    text-decoration: none;
}

.ders-linko-btn:hover {
    transform: scale(1.05);
    background: linear-gradient(135deg, #00cec9, #74b9ff);
}

.ders-linko-btn svg {
    width: 18px;
    height: 18px;
    fill: white;
}

@media (max-width: 600px) {
    .ders-linko-btn {
        width: 100%;
        justify-content: center;
        font-size: 14px;
        padding: 12px;
    }
}
/* =========================
   OSO Admin - Modern Layout
========================= */
.oso-admin { max-width: 1600px; }

.oso-admin-header{
  display:flex; gap:16px; align-items:flex-end; justify-content:space-between;
  margin: 10px 0 14px 0;
}
.oso-h1{ margin:0; padding:0; font-size:24px; line-height:1.2; }
.oso-sub{ margin-top:6px; color:#6b7280; font-size:13px; }
.oso-admin-actions{ display:flex; gap:10px; flex-wrap:wrap; }

.oso-stats{
  display:grid; grid-template-columns: repeat(3, minmax(220px, 1fr));
  gap:12px; margin: 10px 0 14px 0;
}
.oso-stat-card{
  background:#fff; border:1px solid #e5e7eb; border-radius:12px;
  padding:14px 14px;
  box-shadow: 0 2px 10px rgba(0,0,0,.04);
}
.oso-stat-label{ color:#6b7280; font-size:12px; }
.oso-stat-value{ font-size:26px; font-weight:700; margin-top:6px; }
.oso-stat-desc{ margin-top:6px; color:#6b7280; font-size:12px; }
.oso-stat-card.oso-warn{ border-color:#f1c0c0; background: #fff7f7; }
.oso-stat-card.oso-info{ border-color:#cfe6ff; background: #f4f9ff; }

.oso-tabs{
  display:flex; gap:8px; margin: 8px 0 12px 0;
}
.oso-tab-btn{
  border:1px solid #e5e7eb; background:#fff; border-radius:999px;
  padding:8px 12px; cursor:pointer; font-weight:600;
}
.oso-tab-btn.is-active{
  border-color:#2271b1; box-shadow: 0 0 0 2px rgba(34,113,177,.12);
}

.oso-tab-panel{ display:none; }
.oso-tab-panel.is-active{ display:block; }

.oso-card{
  background:#fff; border:1px solid #e5e7eb; border-radius:14px;
  padding:14px; box-shadow: 0 2px 12px rgba(0,0,0,.05);
  margin-bottom:14px;
}
.oso-card-head{
  display:flex; gap:12px; align-items:flex-start; justify-content:space-between;
  margin-bottom:10px;
}
.oso-card-title{ font-size:15px; font-weight:700; margin:0; }
.oso-card-sub{ color:#6b7280; font-size:12px; margin-top:4px; }

.oso-toolbar{
  display:flex; gap:10px; align-items:center; flex-wrap:wrap;
}
.oso-search{
  display:flex; align-items:center; gap:8px;
  border:1px solid #e5e7eb; background:#bdffce; border-radius:10px;
  padding:6px 10px;
}
.oso-search input{
  border:none; outline:none; min-width:260px; box-shadow:none;
}
.oso-search .dashicons{ color:#6b7280; }

.oso-toggle{
  display:flex; align-items:center; gap:8px;
  border:1px solid #e5e7eb; background:#f9fafb; border-radius:10px;
  padding:6px 10px;
}
.oso-inline-note{
  display:flex; gap:10px; align-items:flex-start;
  background:#fff7f7; border:1px solid #f1c0c0; color:#7f1d1d;
  border-radius:12px; padding:10px 12px; margin: 10px 0 12px 0;
}

.oso-table-wrap{
  border:1px solid #e5e7eb; border-radius:12px;
  overflow:auto; max-height: 620px;
}
.oso-admin-table{
  width:100%;
  border-collapse:collapse;
  background:#fff;
}
.oso-admin-table th{
  position: sticky; top:0;
  background:#0b3a61; color:#fff;
  padding:12px; text-align:left; z-index:2;
}
.oso-admin-table td{
  padding:12px; border-bottom:1px solid #eef2f7;
}
.oso-admin-table tr:nth-child(even) td{ background:#fbfdff; }

.oso-row-missing td{
  background:#fff0f0 !important;
  border-bottom-color:#f3caca;
}

.oso-actions{
  display:flex; gap:8px; align-items:center;
}

.oso-grid-2{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:14px;
}

.oso-empty{
  display:flex; gap:10px; align-items:center;
  padding:14px;
  background:#f0fdf4; border:1px solid #bbf7d0; border-radius:12px;
}

/*
  Öğrenci düzenleme modalı (oso-duzenle-modal)
  Sabit "+80px" kaydırma kaldırıldı: modal artık viewport içinde kalır.
*/
#oso-duzenle-modal{
  display:none;
  position:fixed;
  top: 60px;
  left: 50%;
  transform: translateX(-50%);
  background:#fff;
  padding: 18px;
  border:1px solid #e5e7eb;
  z-index:999999 !important;
  box-sizing:border-box;

  width: min(1100px, calc(100vw - 40px));
  max-height: calc(100vh - 90px);

  overflow:hidden;
  box-shadow: 0 12px 40px rgba(0,0,0,.22);
  border-radius:14px;
}

/* İç form: responsive grid */
#oso-duzenle-modal form{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 16px;
  overflow-y:auto;
  max-height: calc(100vh - 180px);
  padding-right: 8px;
  box-sizing:border-box;
}

#oso-duzenle-modal h3{
  grid-column: 1 / -1;
}

.ogrenci-form-grup{
  display:flex;
  flex-direction:column;
  gap:6px;
  min-width:0;
}

@media (max-width: 782px){
  #oso-duzenle-modal{
    top: 48px;
    width: calc(100vw - 20px);
    max-height: calc(100vh - 70px);
    padding: 14px;
  }
  #oso-duzenle-modal form{
    grid-template-columns: 1fr;
    max-height: calc(100vh - 150px);
  }
}

/* Ders Kontrol: mobil öncelikli öğrenci işlem düğmeleri ve son ders alanı */
.dk-islem-satiri{padding:10px!important}
.dk-islem-butonlari{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;width:100%}
.dk-islem-btn{min-width:0;min-height:48px;padding:10px 12px;border:1px solid transparent;border-radius:11px;font-size:14px;font-weight:800;line-height:1.2;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,filter .18s ease}
.dk-islem-btn:hover{transform:translateY(-1px);filter:saturate(1.05)}
.dk-islem-veli{background:#facc15!important;color:#172033!important;border-color:#eab308!important}
.dk-islem-ders{background:#eaf3ff;color:#0759b5;border-color:#bfdbfe}
.dk-islem-ram{background:#ecfdf5;color:#08764d;border-color:#a7f3d0}
.dk-islem-ders.is-active{background:#0874ee;color:#fff;border-color:#0874ee;box-shadow:0 8px 20px rgba(8,116,238,.22)}
.dk-islem-ram.is-active{background:#059669;color:#fff;border-color:#059669;box-shadow:0 8px 20px rgba(5,150,105,.2)}
.dk-alt-bilgi-panel{box-sizing:border-box;width:100%;margin:12px 0 18px;padding:14px;border:1px solid #dbeafe;border-radius:18px;background:linear-gradient(145deg,#f8fbff,#f2f7fd);box-shadow:0 10px 28px rgba(15,23,42,.07)}
.dk-alt-bilgi-panel[hidden]{display:none!important}
.dk-ders-modal-baslik{display:flex;align-items:center;gap:12px;margin:0 0 14px;color:#0f1f44;font-size:clamp(22px,3vw,30px);font-weight:850;letter-spacing:-.035em}
.dk-ders-baslik-ikon,.dk-ders-detay-ikon{display:grid;place-items:center;flex:0 0 auto;width:48px;height:48px;border-radius:14px;background:#eaf3ff;color:#0874ee}
.dk-ders-modal-baslik svg,.dk-ders-liste-baslik svg,.dk-ders-btn svg,.dk-ders-detay-ikon svg{width:25px;height:25px;stroke:currentColor}
.dk-ders-icerik-layout{display:grid;grid-template-columns:minmax(220px,30%) minmax(0,1fr);gap:12px}
.dk-ders-liste-panel,.dk-ders-detay-panel{min-width:0;padding:14px;border:1px solid #dbeafe;border-radius:15px;background:#fff}
.dk-ders-liste-baslik{display:flex;align-items:center;gap:8px;margin:0 0 11px;color:#132346;font-size:17px;font-weight:800}
.dk-ders-liste-baslik svg{color:#0874ee}
.dk-ders-liste{display:grid;gap:8px;max-height:530px;overflow:auto;scrollbar-width:thin}
#dk-ders-icerikleri-panel .ders-btn{display:grid;grid-template-columns:36px minmax(0,1fr) 18px;align-items:center;gap:9px;width:100%;min-height:55px;padding:8px 10px;border:1px solid #dbeafe;border-radius:12px;background:#fff;color:#132346;text-align:left;box-shadow:0 4px 13px rgba(30,64,175,.05);cursor:pointer;transform:none}
#dk-ders-icerikleri-panel .ders-btn:hover{background:#eff6ff;transform:translateY(-1px)}
#dk-ders-icerikleri-panel .ders-btn.is-active{border-color:#0874ee;background:linear-gradient(135deg,#0874ee,#0967dd);color:#fff;box-shadow:0 8px 18px rgba(8,116,238,.22)}
.dk-ders-btn-ikon{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:#eff6ff;color:#0874ee}
.ders-btn.is-active .dk-ders-btn-ikon{background:rgba(255,255,255,.16);color:#fff}
.dk-ders-btn-metin{min-width:0;overflow:hidden;font-size:14px;font-weight:750;white-space:normal}
.dk-ders-btn-metin strong{display:block;line-height:1.25}
.dk-ders-btn-metin small{display:block;margin-top:3px;color:#64748b;font-size:11px;font-weight:700;line-height:1.2}
.ders-btn.is-active .dk-ders-btn-metin small{color:rgba(255,255,255,.82)}
.dk-ders-btn-ok{font-size:25px;font-weight:300;line-height:1;opacity:.7}
.dk-ders-detay-panel{padding:14px;background:#fff}
.dk-ders-detay-baslik{display:flex;align-items:center;gap:13px;margin:-14px -14px 14px;padding:18px;border-radius:14px 14px 0 0;background:linear-gradient(135deg,#edf6ff,#f8fbff);color:#0f1f44}
.dk-ders-detay-baslik-metin{display:block;min-width:0}
.dk-ders-detay-baslik strong{font-size:clamp(20px,2.4vw,27px);line-height:1.2}
.dk-ders-detay-baslik small{display:block;margin-top:4px;color:#526581;font-size:13px;font-weight:750}
.dk-ders-detay-satirlar{display:grid;gap:9px}
.dk-ders-detay-satir{display:grid;grid-template-columns:48px minmax(105px,145px) minmax(0,1fr);align-items:center;gap:12px;min-height:70px;padding:11px 14px;border:1px solid #dbeafe;border-radius:13px;background:#fff}
.dk-ders-detay-satir .dk-ders-detay-ikon{width:44px;height:44px;border-radius:12px}
.dk-ders-detay-satir.is-note .dk-ders-detay-ikon{background:#f5f3ff;color:#7c3aed}
.dk-ders-detay-satir.is-date .dk-ders-detay-ikon{background:#eff6ff;color:#0874ee}
.dk-ders-detay-satir.is-teacher .dk-ders-detay-ikon{background:#ecfdf5;color:#10b981}
.dk-ders-detay-satir.is-target .dk-ders-detay-ikon{background:#fffbeb;color:#f59e0b}
.dk-ders-detay-etiket{color:#64748b;font-size:14px;font-weight:800}
.dk-ders-detay-deger{min-width:0;padding-left:15px;border-left:1px solid #dce4ee;color:#101828;font-size:15px;line-height:1.45;overflow-wrap:anywhere}
.dk-ders-link-alani a{color:#0969da;font-weight:750;text-decoration:none}
.dk-ders-bos{padding:28px 15px;color:#64748b;text-align:center}

@media(max-width:700px){
  #dk-ogrenci-arama-container{width:100%!important;max-width:none!important;margin:8px auto!important;padding-left:6px!important;padding-right:6px!important;box-sizing:border-box}
  .dk-islem-satiri{margin-left:0!important;margin-right:0!important;padding:7px!important}
  .dk-islem-butonlari{gap:6px}
  .dk-islem-btn{min-height:56px;padding:8px 5px;border-radius:10px;font-size:12px;overflow-wrap:anywhere}
  .dk-alt-bilgi-panel{margin:9px 0 14px;padding:10px;border-radius:15px}
  .dk-ders-modal-baslik{gap:9px;margin-bottom:10px;font-size:21px;line-height:1.15}
  .dk-ders-baslik-ikon{width:41px;height:41px;border-radius:12px}
  .dk-ders-icerik-layout{display:block}
  .dk-ders-liste-panel,.dk-ders-detay-panel{padding:10px;border-radius:13px}
  .dk-ders-liste-baslik{margin-bottom:8px;font-size:15px}
  .dk-ders-liste{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;max-height:154px;padding:0 2px 2px 0;overflow-y:auto;overflow-x:hidden}
  #dk-ders-icerikleri-panel .ders-btn{grid-template-columns:30px minmax(0,1fr);gap:7px;min-height:66px;padding:7px;scroll-snap-align:none}
  #dk-ders-icerikleri-panel .dk-ders-btn-ikon{width:30px;height:34px}
  #dk-ders-icerikleri-panel .dk-ders-btn-ikon svg{width:21px;height:21px}
  #dk-ders-icerikleri-panel .dk-ders-btn-ok{display:none}
  #dk-ders-icerikleri-panel .dk-ders-btn-metin{font-size:11px}
  #dk-ders-icerikleri-panel .dk-ders-btn-metin small{font-size:11px;font-weight:850}
  .dk-ders-detay-panel{margin-top:8px}
  .dk-ders-detay-baslik{margin:-10px -10px 10px;padding:13px}
  .dk-ders-detay-baslik .dk-ders-detay-ikon{width:40px;height:40px;border-radius:11px}
  .dk-ders-detay-baslik strong{font-size:19px}
  .dk-ders-detay-satirlar{gap:7px}
  .dk-ders-detay-satir{grid-template-columns:40px minmax(0,1fr);gap:1px 10px;min-height:62px;padding:9px 10px}
  .dk-ders-detay-satir .dk-ders-detay-ikon{grid-row:1/span 2;width:39px;height:39px}
  .dk-ders-detay-etiket{grid-column:2;font-size:11px}
  .dk-ders-detay-deger{grid-column:2;padding-left:0;border-left:0;font-size:14px;line-height:1.38}
}

.oso-bulk-modal{
  position:fixed;
  inset:0;
  z-index:999999;
}

.oso-bulk-overlay{
  position:absolute;
  inset:0;
  background:rgba(15,23,42,.48);
}

.oso-bulk-dialog{
  position:relative;
  width:min(1180px, calc(100vw - 44px));
  max-height:calc(100vh - 70px);
  margin:35px auto;
  background:#fff;
  border-radius:16px;
  box-shadow:0 26px 80px rgba(15,23,42,.28);
  padding:18px;
  display:flex;
  flex-direction:column;
  gap:14px;
}

.oso-bulk-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:14px;
}

.oso-bulk-title{
  font-size:18px;
  font-weight:800;
  color:#0f172a;
}

.oso-bulk-sub{
  margin-top:5px;
  color:#64748b;
  font-size:12px;
}

.oso-bulk-actions{
  display:flex;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:8px;
}

.oso-bulk-match-toggle{
  display:inline-flex;
  align-items:center;
  gap:7px;
  margin-right:auto;
  padding:6px 10px;
  border:1px solid #dbe5f0;
  border-radius:10px;
  background:#f8fafc;
  color:#1f2937;
  font-weight:700;
}

.oso-bulk-table-wrap{
  border:1px solid #dbe5f0;
  border-radius:12px;
  overflow:auto;
  min-height:330px;
  max-height:calc(100vh - 285px);
  background:#f8fafc;
}

.oso-bulk-table{
  width:100%;
  min-width:760px;
  border-collapse:separate;
  border-spacing:0;
  background:#fff;
}

.oso-bulk-table th{
  position:sticky;
  top:0;
  z-index:2;
  background:#0b3a61;
  color:#fff;
  padding:10px;
  min-width:210px;
  text-align:left;
  border-right:1px solid rgba(255,255,255,.18);
}

.oso-bulk-table th.oso-bulk-fixed{
  min-width:180px;
}

.oso-bulk-table select{
  width:100%;
  margin-top:6px;
  max-width:none;
}

.oso-bulk-table td{
  border-right:1px solid #e5e7eb;
  border-bottom:1px solid #e5e7eb;
  min-width:180px;
  height:34px;
  padding:7px 9px;
  outline:none;
  background:#fff;
}

.oso-bulk-table td:focus{
  box-shadow:inset 0 0 0 2px #2271b1;
  background:#f0f9ff;
}

.oso-bulk-table tbody tr:nth-child(even) td{
  background:#fbfdff;
}

.oso-bulk-result{
  white-space:pre-wrap;
  border-radius:12px;
  border:1px solid #bbf7d0;
  background:#f0fdf4;
  color:#166534;
  padding:12px;
  font-weight:600;
}

.oso-bulk-result.is-error{
  border-color:#fecaca;
  background:#fff1f2;
  color:#991b1b;
}

@media (max-width: 782px){
  .oso-bulk-dialog{
    width:calc(100vw - 18px);
    max-height:calc(100vh - 36px);
    margin:18px auto;
    padding:12px;
  }
  .oso-bulk-head{
    flex-direction:column;
  }
  .oso-bulk-actions{
    justify-content:flex-start;
  }
  .oso-bulk-table-wrap{
    max-height:calc(100vh - 300px);
  }
}


