/* Area pengelola: tata letak AdminLTE 4 dengan palet Tema C (Segar Bersih). */
:root,
[data-bs-theme="light"] {
    --accent: #0e7c86;
    --accent-dark: #0a5f67;
    --accent-soft: #ddf1f3;
    --ink: #0f2a33;
    --muted: #4f6670;
    --line: #d6e4e7;
    --tint: #f0f7f8;
    --ok-bg: #e3f4ea;
    --ok-ink: #14532d;
    --err-bg: #fdecec;
    --err-ink: #8a1f1f;

    --bs-primary: #0e7c86;
    --bs-primary-rgb: 14, 124, 134;
    --bs-primary-text-emphasis: #0a5f67;
    --bs-primary-bg-subtle: #ddf1f3;
    --bs-primary-border-subtle: #b7dfe3;
    --bs-success: #14532d;
    --bs-success-rgb: 20, 83, 45;
    --bs-success-bg-subtle: #e3f4ea;
    --bs-danger: #8a1f1f;
    --bs-danger-rgb: 138, 31, 31;
    --bs-danger-bg-subtle: #fdecec;
    --bs-warning-bg-subtle: #fff3d6;
    --bs-warning-text-emphasis: #6b4a00;
    --bs-body-color: #0f2a33;
    --bs-body-color-rgb: 15, 42, 51;
    --bs-secondary-color: #4f6670;
    --bs-secondary-color-rgb: 79, 102, 112;
    --bs-body-bg: #ffffff;
    --bs-body-bg-rgb: 255, 255, 255;
    --bs-tertiary-bg: #f0f7f8;
    --bs-tertiary-bg-rgb: 240, 247, 248;
    --bs-secondary-bg: #e8f1f3;
    --bs-border-color: #d6e4e7;
    --bs-link-color: #0a5f67;
    --bs-link-color-rgb: 10, 95, 103;
    --bs-link-hover-color: #0f2a33;
    --bs-link-hover-color-rgb: 15, 42, 51;
    --bs-focus-ring-color: rgba(14, 124, 134, 0.3);
    --bs-form-invalid-color: #8a1f1f;
    --bs-form-invalid-border-color: #8a1f1f;
    --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

body { font-family: var(--bs-font-sans-serif); }
:focus-visible { outline: 3px solid #e0a43a; outline-offset: 2px; }

/* Tombol */
.btn-primary {
    --bs-btn-bg: #0e7c86; --bs-btn-border-color: #0e7c86;
    --bs-btn-hover-bg: #0a5f67; --bs-btn-hover-border-color: #0a5f67;
    --bs-btn-active-bg: #0a5f67; --bs-btn-active-border-color: #0a5f67;
    --bs-btn-focus-shadow-rgb: 14, 124, 134;
    --bs-btn-disabled-bg: #b8c8cc; --bs-btn-disabled-border-color: #b8c8cc; --bs-btn-disabled-color: #3d4f55;
}
.btn-outline-primary {
    --bs-btn-color: #0a5f67; --bs-btn-border-color: #0e7c86;
    --bs-btn-hover-bg: #0e7c86; --bs-btn-hover-border-color: #0e7c86;
    --bs-btn-active-bg: #0a5f67; --bs-btn-active-border-color: #0a5f67;
    --bs-btn-focus-shadow-rgb: 14, 124, 134;
}
.btn-outline-secondary {
    --bs-btn-color: #0f2a33; --bs-btn-border-color: #cfe2e6;
    --bs-btn-hover-bg: #ddf1f3; --bs-btn-hover-color: #0f2a33; --bs-btn-hover-border-color: #cfe2e6;
    --bs-btn-active-bg: #ddf1f3; --bs-btn-active-color: #0f2a33; --bs-btn-active-border-color: #cfe2e6;
}
.btn-danger {
    --bs-btn-bg: #8a1f1f; --bs-btn-border-color: #8a1f1f;
    --bs-btn-hover-bg: #6d1717; --bs-btn-hover-border-color: #6d1717;
    --bs-btn-active-bg: #6d1717; --bs-btn-active-border-color: #6d1717;
    --bs-btn-focus-shadow-rgb: 138, 31, 31;
}
.btn-outline-danger { --bs-btn-color: #8a1f1f; --bs-btn-border-color: #8a1f1f; --bs-btn-hover-bg: #8a1f1f; --bs-btn-hover-border-color: #8a1f1f; --bs-btn-active-bg: #6d1717; }
.btn-link { --bs-btn-color: #0a5f67; --bs-btn-hover-color: #0f2a33; }
.btn, .form-control, .form-select { min-height: 40px; }
.btn-sm { min-height: 36px; }

/* Formulir */
.form-control:focus, .form-select:focus, .form-check-input:focus {
    border-color: #0e7c86;
    box-shadow: 0 0 0 0.25rem rgba(14, 124, 134, 0.25);
}
.form-check-input:checked { background-color: #0e7c86; border-color: #0e7c86; }
.form-control { border-color: #6f8a92; }
.form-text { color: var(--muted); }
.form-control[readonly] { background: var(--tint); }

/* Kartu */
.card { border-color: var(--line); box-shadow: 0 1px 2px rgba(15, 42, 51, 0.04), 0 4px 12px rgba(15, 42, 51, 0.05); }
.card-header { background: #fff; }
.card-title { font-weight: 700; }

/* Notifikasi */
.alert-success { background: #e3f4ea; color: #14532d; border-color: #bfe3cd; }
.alert-danger { background: #fdecec; color: #8a1f1f; border-color: #f3c6c6; }

/* Lencana status (dipakai juga oleh purchase_badge) */
.badge { font-weight: 700; padding: 0.4em 0.8em; border-radius: 999px; }
.badge-ok { background: var(--ok-bg); color: var(--ok-ink); }
.badge-wait { background: #fff3d6; color: #6b4a00; }
.badge-bad { background: var(--err-bg); color: var(--err-ink); }
.badge-neutral { background: #e8eef0; color: #35505a; }
.badge.text-bg-warning { background-color: #fff3d6 !important; color: #6b4a00 !important; }

code { color: var(--accent-dark); background: var(--accent-soft); padding: 1px 6px; border-radius: 6px; }

/* Bilah atas */
.app-header { border-bottom: 1px solid var(--line); }
.avatar-initial {
    display: inline-flex; align-items: center; justify-content: center;
    width: 30px; height: 30px; border-radius: 50%;
    background: var(--accent); color: #fff; font-weight: 700; font-size: 0.85rem; margin-right: 6px;
}
.user-header-lite { display: flex; flex-direction: column; padding: 8px 16px; }
.user-header-lite small { color: var(--muted); }
.dropdown-menu form { margin: 0; }
.dropdown-item:active, .dropdown-item.active { background-color: var(--accent); }

/* Menu samping: warna tinta dan teal dari palet */
.app-sidebar,
.app-sidebar[data-bs-theme="dark"] {
    --lte-sidebar-color: #cfe2e6;
    --lte-sidebar-hover-bg: rgba(255, 255, 255, 0.08);
    --lte-sidebar-hover-color: #ffffff;
    --lte-sidebar-active-color: #ffffff;
    --lte-sidebar-menu-active-bg: #0e7c86;
    --lte-sidebar-menu-active-color: #ffffff;
    --lte-sidebar-header-color: #7fa3ab;
    background-color: #0f2a33;
    color: #cfe2e6;
}
.app-sidebar .sidebar-brand { border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
.app-sidebar .sidebar-brand { padding: 0 14px; }
.app-sidebar .brand-link { display: flex; align-items: center; gap: 10px; color: #fff; text-decoration: none; padding: 0; min-width: 0; }
.app-sidebar .brand-text { font-size: 1rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.app-sidebar .brand-link:hover { color: #fff; }
.brand-mark {
    display: inline-flex; align-items: center; justify-content: center;
    width: 34px; height: 34px; border-radius: 10px; background: var(--accent); color: #fff; font-size: 1.2rem; flex: none;
}
.app-sidebar .nav-header { font-size: 0.72rem; letter-spacing: 0.08em; padding: 14px 16px 6px; color: #7fa3ab; }
.app-sidebar .nav-link { color: #cfe2e6; border-radius: 8px; }
.app-sidebar .nav-link:hover { color: #fff; background: rgba(255, 255, 255, 0.08); }
.app-sidebar .nav-link.active { background: #0e7c86; color: #fff; }
.app-sidebar .nav-link.active .nav-icon { color: #fff; }
.app-sidebar form { margin: 0; }
.app-sidebar button.nav-link { display: flex; align-items: center; cursor: pointer; font: inherit; }

/* Judul halaman */
.app-content-header h1 { font-weight: 800; letter-spacing: -0.01em; }

/* Kotak ringkasan */
.stat-box { display: flex; flex-direction: row; align-items: center; gap: 16px; padding: 18px 20px; text-decoration: none; color: var(--ink); height: 100%; }
.stat-box:hover { border-color: var(--accent); color: var(--ink); }
.stat-icon {
    display: inline-flex; align-items: center; justify-content: center; flex: none;
    width: 52px; height: 52px; border-radius: 14px; background: var(--accent-soft); color: var(--accent-dark); font-size: 1.5rem;
}
.stat-box strong { display: block; font-size: 1.9rem; line-height: 1.1; font-weight: 800; color: var(--accent-dark); }
.stat-box span.label { color: var(--muted); font-size: 0.9rem; }

/* Tabel */
.table > :not(caption) > * > * { padding: 0.8rem 1rem; }
.table thead th { font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--muted); white-space: nowrap; background: #f6fafb; }
.order-inline { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; letter-spacing: 0.02em; white-space: nowrap; }
.actions-cell { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.actions-cell form { margin: 0; }
.meta { color: var(--muted); font-size: 0.9rem; }
.cell { min-width: 0; overflow-wrap: anywhere; }
.filter-pills .nav-link { border-radius: 999px; color: var(--ink); font-weight: 600; }
.filter-pills .nav-link.active { background: var(--accent); color: #fff; }
.filter-pills .badge { background: #fff; color: var(--accent-dark); border: 1px solid var(--line); }
.facts { display: grid; grid-template-columns: max-content 1fr; gap: 8px 24px; margin: 0; }
.facts dt { color: var(--muted); font-weight: 500; }
.facts dd { margin: 0; }
.reject-box { min-width: 220px; }

@media (max-width: 640px) {
    .table-stack thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
    .table-stack, .table-stack tbody, .table-stack tr, .table-stack td { display: block; width: 100%; }
    .table-stack tr { padding: 10px 4px; border-bottom: 1px solid var(--line); }
    .table-stack tr:last-child { border-bottom: 0; }
    .table-stack td { border: 0; padding: 4px 14px; display: flex; gap: 12px; justify-content: space-between; text-align: right; }
    .table-stack td::before { content: attr(data-label); font-size: 0.8rem; color: var(--muted); text-align: left; flex: 0 0 38%; }
    .table-stack .actions-cell { justify-content: flex-end; }
    .facts { grid-template-columns: 1fr; gap: 2px; }
    .facts dd { margin-bottom: 10px; }
}

.app-footer { color: var(--muted); border-top: 1px solid var(--line); }

/* Gambar sampul koleksi */
.cover-preview { max-width: 280px; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 0.375rem; border: 1px solid #dee2e6; }
.cover-thumb { width: 64px; height: 36px; object-fit: cover; border-radius: 4px; border: 1px solid #dee2e6; flex: none; }