/* HEADER KHUSUS JADWAL */
nav { justify-content: space-between; }
.login-btn { background-color: var(--primary); color: var(--btn-text); border: none; padding: 8px 20px; border-radius: 8px; font-weight: 700; font-size: 0.9rem; cursor: pointer; transition: 0.3s; }
.login-btn:hover { transform: scale(1.05); box-shadow: 0 0 15px var(--primary); }
.logo { white-space: nowrap; }
[data-theme="ui"] .back-btn { color: #000; background: #FFC107; border-color: #000; }

/* CONTENT */
.jadwal-container { max-width: 900px; margin: 3rem auto 1rem; padding: 0 1rem; }
.back-nav { margin-bottom: 1.5rem; }
.back-btn { text-decoration: none; color: var(--text-muted); font-weight: 700; font-size: 0.9rem; border: 1px solid var(--border-card); padding: 10px 24px; border-radius: 50px; background: var(--bg-card); transition: 0.3s; display: inline-block; }
.back-btn:hover { border-color: var(--primary); color: var(--btn-text); background: var(--primary); }

.card { background: var(--bg-card); border-radius: 20px; box-shadow: var(--shadow-card); padding: 10px; overflow: hidden; border: 1px solid var(--border-card); }

/* THEME HACK KALENDER (INVERT WARNA) */
.responsive-iframe-container { position: relative; width: 100%; padding-bottom: 65%; height: 0; overflow: hidden; border-radius: 15px; }
.responsive-iframe-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; transition: filter 0.4s ease; }
[data-theme="dark"] .responsive-iframe-container iframe,
[data-theme="ui"] .responsive-iframe-container iframe {
    filter: invert(0.9) hue-rotate(180deg) contrast(0.9);
}

.todo-container { max-width: 600px; margin: 0 auto 4rem; padding: 0 1.5rem; }
.todo-header-row { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.5rem; flex-wrap: wrap; gap: 10px; }
.todo-title { font-size: 1.2rem; font-weight: 700; color: var(--text-main); }
.action-group { display: flex; align-items: center; gap: 10px; }
.streak-display { display: flex; align-items: center; gap: 8px; background: var(--bg-card); border: 1px solid var(--border-card); padding: 6px 14px; border-radius: 50px; }
.fire-icon { font-size: 1.4rem; filter: grayscale(100%); opacity: 0.5; transition: 0.5s; }
.fire-icon.active { filter: grayscale(0%); opacity: 1; transform: scale(1.1); text-shadow: 0 0 15px orange; }
.streak-count { font-weight: 800; font-size: 1rem; color: var(--text-main); }
.manage-btn { background: transparent; border: 1px solid var(--primary); color: var(--text-main); padding: 6px 14px; border-radius: 50px; font-size: 0.8rem; font-weight: 700; cursor: pointer; transition: 0.3s; }
.manage-btn:hover { background: var(--primary); color: var(--btn-text); }

.todo-item { display: flex; justify-content: space-between; align-items: center; background: var(--bg-card); border: 1px solid var(--border-card); padding: 1rem 1.5rem; margin-bottom: 1rem; border-radius: 16px; transition: 0.3s; }
.todo-item:hover { transform: translateY(-3px); border-color: var(--primary); }
.task-name { font-weight: 600; color: var(--text-main); font-size: 0.95rem; }

.checkbox-wrapper input { display: none; }
.custom-checkbox { width: 28px; height: 28px; border: 2px solid var(--text-muted); border-radius: 8px; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: 0.3s; flex-shrink: 0; }
.checkbox-wrapper input:checked + .custom-checkbox { background-color: var(--primary); border-color: var(--primary); }
.custom-checkbox::after { content: '✔'; color: #000; font-size: 1.1rem; font-weight: bold; display: none; }
.checkbox-wrapper input:checked + .custom-checkbox::after { display: block; }
[data-theme="ui"] .checkbox-wrapper input:checked + .custom-checkbox::after { color: #000; }

/* MODAL JADWAL */
.modal { display: none; position: fixed; z-index: 999; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.6); backdrop-filter: blur(5px); justify-content: center; align-items: flex-start; padding: 2rem 1rem; overflow-y: auto; }
.modal-content { background-color: var(--bg-card); width: 100%; max-width: 800px; border-radius: 20px; padding: 2rem; position: relative; margin-top: 2rem; animation: slideUp 0.3s ease; box-shadow: 0 25px 50px rgba(0,0,0,0.3); }
@keyframes slideUp { from { transform: translateY(50px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.modal-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 2rem; border-bottom: 2px solid var(--primary); padding-bottom: 10px; }
.modal-title { font-size: 1.5rem; font-weight: 800; color: var(--text-main); }
.close-btn { font-size: 2rem; cursor: pointer; color: var(--text-muted); background: none; border: none; }

.week-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.5rem; }
.day-card { background: var(--bg-body); border: 1px solid var(--border-card); border-radius: 12px; padding: 1.5rem; position: relative; }
.day-label { font-weight: 800; color: var(--primary); margin-bottom: 1rem; display: block; text-transform: uppercase; letter-spacing: 1px; font-size: 1.1rem; }

.input-group { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.day-input { width: 100%; padding: 10px; border-radius: 8px; border: 1px solid var(--border-card); background: var(--bg-card); color: var(--text-main); font-family: 'Poppins'; }
.day-input:focus { outline: none; border-color: var(--primary); }

.btn-remove { background: rgba(255, 59, 48, 0.1); color: var(--danger); border: none; width: 30px; height: 30px; border-radius: 50%; font-weight: 900; cursor: pointer; transition: 0.2s; display: flex; align-items: center; justify-content: center; font-size: 1.2rem; }
.btn-remove:hover { background: var(--danger); color: #fff; }

.btn-add { width: 100%; padding: 8px; margin-top: 5px; border: 2px dashed var(--border-card); background: transparent; color: var(--text-muted); border-radius: 8px; font-weight: 600; cursor: pointer; transition: 0.2s; }
.btn-add:hover { border-color: var(--success); color: var(--success); background: rgba(52, 199, 89, 0.05); }

.modal-footer { margin-top: 2rem; display: flex; justify-content: flex-end; gap: 10px; }
.save-btn { background: var(--primary); color: var(--btn-text); border: none; padding: 10px 30px; border-radius: 50px; font-weight: 800; cursor: pointer; }
.reset-btn { background: transparent; border: 1px solid var(--text-muted); color: var(--text-muted); padding: 10px 20px; border-radius: 50px; font-weight: 600; cursor: pointer; }
/* --- FIX HOVER BUTTON TEMA UI (JAKUN) --- */
[data-theme="ui"] .back-btn {
    background-color: #FFC107 !important;
    color: #000000 !important;
    border: 2px solid #000000 !important;
    font-weight: 800;
}

[data-theme="ui"] .back-btn:hover {
    background-color: #000000 !important; /* Jadi Hitam */
    color: #FFC107 !important;             /* Teks Jadi Kuning */
    border-color: #000000 !important;
    box-shadow: 0 0 15px rgba(255, 193, 7, 0.6); /* Efek Glow dikit */
    transform: translateY(-2px);
}