.filter-container{background:var(--card-bg);box-shadow:0 2px 8px var(--shadow-color);padding:20px;border-radius:12px;margin-bottom:1.5rem;transition:all var(--transition-speed) ease}.filter-container .form-label{color:var(--text-dark);font-size:.9rem;margin-bottom:.5rem;font-weight:500}.filter-container .form-select{border:2px solid var(--border-color);background-color:var(--input-bg);color:var(--text-dark);border-radius:8px;padding:.6rem 1rem;font-size:.95rem;transition:all .3s ease}.filter-container .form-select:focus{border-color:var(--primary-blue);box-shadow:0 0 0 .2rem #3498db26;background-color:var(--input-focus-bg);outline:none}.filter-container .btn{padding:.6rem 1.5rem;font-weight:600;border-radius:8px;transition:all .3s ease}.filter-info{background:var(--card-bg);box-shadow:0 2px 8px var(--shadow-color);border:none;border-radius:10px;color:var(--text-dark);padding:15px 20px;transition:all var(--transition-speed) ease}.filter-info .badge{font-weight:600;padding:.4rem .8rem;font-size:.85rem}.ranking-badge{display:inline-block;padding:8px 14px;border-radius:8px;font-weight:800;font-size:14px;min-width:60px;text-align:center;letter-spacing:.5px;box-shadow:0 2px 4px #0000001a;transition:all .3s ease}.ranking-gold{background:linear-gradient(135deg,gold,#ffed4e);color:#b8860b;border:2px solid #ffc107;font-size:15px;animation:pulse-gold 2s ease-in-out infinite}.ranking-silver{background:linear-gradient(135deg,silver,#e8e8e8);color:#555;border:2px solid #9e9e9e;font-size:15px}.ranking-bronze{background:linear-gradient(135deg,#cd7f32,#e6a85c);color:#654321;border:2px solid #b8732d;font-size:15px}.ranking-default{background:linear-gradient(135deg,#e0e0e0,#f5f5f5);color:#424242;border:1px solid #bdbdbd}[data-theme=dark] .ranking-default{background:linear-gradient(135deg,#374151,#4b5563);color:#e5e7eb;border:1px solid #6b7280}[data-theme=dark] .ranking-silver{color:#1f2937}[data-theme=dark] .ranking-bronze{color:#451a03}@keyframes pulse-gold{0%,to{box-shadow:0 2px 4px #0000001a;transform:scale(1)}50%{box-shadow:0 4px 12px #ffd70066;transform:scale(1.05)}}.nilai-badge{display:inline-block;padding:.4rem .8rem;border-radius:8px;font-weight:700;font-size:1rem;transition:all .3s ease}.nilai-badge.nilai-tinggi{background:linear-gradient(135deg,#aec584,#d2d378);color:#000;box-shadow:0 2px 8px #11998e4d}.nilai-badge.nilai-sedang{background:linear-gradient(135deg,#f093fb,#f5576c);color:#fff;box-shadow:0 2px 8px #f093fb4d}.nilai-badge.nilai-rendah{background:linear-gradient(135deg,#fc4a1a,#f7b733);color:#fff;box-shadow:0 2px 8px #fc4a1a4d}[data-theme=dark] .nilai-badge.nilai-tinggi{background:linear-gradient(135deg,#065f46,#047857);color:#d1fae5;box-shadow:0 2px 8px #10b98166}[data-theme=dark] .nilai-badge.nilai-sedang{background:linear-gradient(135deg,#7c2d12,#b91c1c);color:#fecaca;box-shadow:0 2px 8px #ef444466}[data-theme=dark] .nilai-badge.nilai-rendah{background:linear-gradient(135deg,#7f1d1d,#991b1b);color:#fca5a5;box-shadow:0 2px 8px #dc262666}.table tbody tr{transition:all .3s ease}.table tbody tr:hover{transform:translateY(-2px);box-shadow:0 4px 12px var(--shadow-hover)}.loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--card-bg);opacity:.95;display:none;justify-content:center;align-items:center;z-index:9999;backdrop-filter:blur(5px);transition:all var(--transition-speed) ease}.loading-overlay.active{display:flex}.toast-container{position:fixed;top:20px;right:20px;z-index:10000}.empty-state{padding:3rem 2rem;text-align:center}.empty-state i{font-size:4rem;color:var(--text-muted);margin-bottom:1rem;transition:color var(--transition-speed) ease}.empty-state p{color:var(--text-muted);font-size:1.1rem;transition:color var(--transition-speed) ease}.panduan-notification{position:fixed;top:20px;right:20px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:20px 25px;border-radius:12px;box-shadow:0 10px 30px #0000004d;z-index:10000;max-width:400px;animation:slideInRight .5s ease-out}[data-theme=dark] .panduan-notification{background:linear-gradient(135deg,#4f46e5,#7c3aed);box-shadow:0 10px 30px #0009}@keyframes slideInRight{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}.panduan-notification-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.panduan-notification-title{font-size:18px;font-weight:700;display:flex;align-items:center;gap:8px}.panduan-notification-close{background:#fff3;color:#fff;border:none;border-radius:50%;width:28px;height:28px;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.panduan-notification-close:hover{background:#ffffff4d;transform:rotate(90deg)}.panduan-notification-body{font-size:14px;line-height:1.6;margin-bottom:15px}.panduan-notification-btn{width:100%;padding:12px;background:#fff;color:#667eea;border:none;border-radius:8px;cursor:pointer;font-weight:700;font-size:14px;transition:all .2s ease}[data-theme=dark] .panduan-notification-btn{color:#4f46e5}.panduan-notification-btn:hover{background:#f8f9fa;transform:translateY(-2px);box-shadow:0 4px 12px #0003}.guru-edit-notification{position:fixed;top:140px;left:50%;transform:translate(-50%);background:linear-gradient(135deg,#4689e1,#f5576c);color:#fff;padding:0;border-radius:12px;box-shadow:0 10px 30px #0000004d;z-index:10000;max-width:400px;animation:bounceInDown .6s ease-out}[data-theme=dark] .guru-edit-notification{background:linear-gradient(135deg,#3b82f6,#ec4899);box-shadow:0 10px 30px #0009}@keyframes bounceInDown{0%{opacity:0;transform:translate(-50%) translateY(-50px)}60%{opacity:1;transform:translate(-50%) translateY(10px)}80%{transform:translate(-50%) translateY(-5px)}to{transform:translate(-50%) translateY(0)}}@keyframes fadeOutUp{0%{opacity:1;transform:translate(-50%) translateY(0)}to{opacity:0;transform:translate(-50%) translateY(-30px)}}.guru-notification-arrow{width:0;height:0;border-left:15px solid transparent;border-right:15px solid transparent;border-bottom:15px solid #f093fb;position:absolute;top:-15px;left:50%;transform:translate(-50%);filter:drop-shadow(0 -2px 3px rgba(0,0,0,.1))}[data-theme=dark] .guru-notification-arrow{border-bottom-color:#3b82f6}.guru-notification-content{padding:20px 25px}.guru-notification-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.guru-notification-title{font-size:18px;font-weight:700;display:flex;align-items:center;gap:8px;margin:0}.guru-notification-close{background:#fff3;color:#fff;border:none;border-radius:50%;width:28px;height:28px;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.guru-notification-close:hover{background:#ffffff4d;transform:rotate(90deg)}.guru-notification-body{font-size:14px;line-height:1.6}#modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#0009;backdrop-filter:blur(5px);justify-content:center;align-items:center;z-index:9999;animation:fadeIn .3s ease-out}[data-theme=dark] #modal{background:#000c}#modal.show{display:flex!important}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}#modalContent{background:var(--card-bg);padding:35px 40px;border-radius:16px;min-width:500px;max-width:90%;box-shadow:0 20px 60px #0000004d;animation:modalSlideIn .4s cubic-bezier(.175,.885,.32,1.275);position:relative;transition:background var(--transition-speed) ease}[data-theme=dark] #modalContent{box-shadow:0 20px 60px #000000b3}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(-50px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}#modalContent:before{content:"✏️";position:absolute;top:-30px;left:50%;transform:translate(-50%);font-size:50px;background:var(--card-bg);width:80px;height:80px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 5px 20px #0000004d;transition:background var(--transition-speed) ease}#modalContent label{display:block;font-size:16px;font-weight:600;color:var(--text-dark);margin-bottom:12px;margin-top:20px;transition:color var(--transition-speed) ease}#guruInput{width:100%;padding:14px 18px;border:2px solid var(--border-color);border-radius:10px;font-size:15px;font-weight:500;transition:all .3s ease;box-sizing:border-box;outline:none;background:var(--input-bg);color:var(--text-dark)}#guruInput:focus{border-color:var(--primary-blue);box-shadow:0 0 0 4px #3498db1a;background:var(--input-focus-bg)}[data-theme=dark] #guruInput:focus{box-shadow:0 0 0 4px #3b82f633}#guruInput::placeholder{color:var(--text-muted);font-weight:400}.button-group{margin-top:25px;display:flex;gap:12px;justify-content:center}#cancelBtn,#saveBtn{padding:12px 30px;border:none;border-radius:10px;font-size:15px;font-weight:600;cursor:pointer;transition:all .3s ease;min-width:140px;box-shadow:0 4px 12px #00000026}#cancelBtn{background:linear-gradient(135deg,#ff6b6b,#ee5a6f);color:#fff}#cancelBtn:hover{background:linear-gradient(135deg,#ee5a6f,#c92a2a);transform:translateY(-2px);box-shadow:0 6px 20px #ee5a6f66}#cancelBtn:active{transform:translateY(0)}#saveBtn{background:linear-gradient(135deg,#00aeff,#0086cc);color:#fff}[data-theme=dark] #saveBtn{background:linear-gradient(135deg,#3b82f6,#2563eb)}#saveBtn:hover{background:linear-gradient(135deg,#0086cc,#005f99);transform:translateY(-2px);box-shadow:0 6px 20px #00aeff66}[data-theme=dark] #saveBtn:hover{background:linear-gradient(135deg,#2563eb,#1d4ed8);box-shadow:0 6px 20px #3b82f666}#saveBtn:active{transform:translateY(0)}@media (max-width: 768px){.panduan-notification,.guru-edit-notification{max-width:90%;padding:15px 20px}.guru-edit-notification{top:100px}}@media (max-width: 600px){#modalContent{min-width:auto;width:90%;padding:30px 25px}#modalContent:before{width:60px;height:60px;font-size:35px;top:-25px}.button-group{flex-direction:column}#cancelBtn,#saveBtn{width:100%;min-width:auto}.panduan-notification,.guru-edit-notification{font-size:13px;max-width:95%}.panduan-notification-title,.guru-notification-title{font-size:16px}}[data-theme=dark] .filter-info .row,[data-theme=dark] .filter-info small,[data-theme=dark] .filter-info strong{color:var(--text-dark)!important}[data-theme=dark] .filter-info .text-muted{color:var(--text-muted)!important}[data-theme=dark] .table{background:var(--table-bg);color:var(--text-dark)}[data-theme=dark] .table thead th{background-color:var(--bg-light);color:var(--text-dark);border-bottom:2px solid var(--border-color)}[data-theme=dark] .table tbody tr{border-bottom:1px solid var(--table-border);background:var(--table-bg)}[data-theme=dark] .table tbody tr:hover{background-color:var(--table-hover)}[data-theme=dark] .table tbody td{color:var(--text-dark);border-bottom:1px solid var(--table-border)}[data-theme=dark] .table tbody td.text-center{color:var(--text-muted)}[data-theme=dark] .table tbody td.text-muted{color:var(--text-muted)!important}[data-theme=dark] .table-container{background:var(--card-bg);box-shadow:0 2px 8px var(--shadow-color)}[data-theme=dark] .table-container h2{color:var(--text-dark)}[data-theme=dark] .filter-info .badge.bg-primary{background:var(--primary-blue)!important;color:#fff}[data-theme=dark] .filter-info .badge.bg-info{background:var(--info-purple)!important;color:#fff}[data-theme=dark] .table tbody td{background:var(--table-bg)!important;color:var(--text-dark)!important}[data-theme=dark] .table tbody tr{background:var(--table-bg)!important}[data-theme=dark] .table tbody tr:hover td{background:var(--table-hover)!important}[data-theme=dark] .table tbody td .badge.bg-info{background:var(--info-purple)!important;color:#fff!important}[data-theme=dark] .table tbody td .badge{color:#fff!important}[data-theme=dark] .table tbody td small,[data-theme=dark] .table tbody td .d-block{color:var(--text-muted)!important}[data-theme=dark] .table tbody td .badge.bg-danger{background:var(--danger-red)!important;color:#fff!important}[data-theme=dark] .table tbody td .badge.bg-success{background:var(--success-green)!important;color:#fff!important}[data-theme=dark] .table tbody td .badge.bg-warning{background:var(--warning-orange)!important;color:var(--text-dark)!important}[data-theme=dark] .table tbody td small.text-muted{color:var(--text-muted)!important}[data-theme=dark] .table tbody td.fw-semibold{color:var(--text-dark)!important;font-weight:600!important}
