/* ==========================================================================
   Digital Loka Nusantara — Ledger Theme v3
   Identitas: ink navy + brass/gold, kertas hangat, sudut presisi.
   Refresh: depth berlapis lebih halus, transisi lebih hidup, aksen lebih
   percaya diri — tetap flat & rapi, tanpa gradient berlebihan.
   Menimpa AdminLTE 3 / Bootstrap 4 secara global.
   ========================================================================== */

:root{
  /* -- warna inti (bukan indigo/biru generik) -- */
  --dln-ink-900:#12161d;
  --dln-ink-800:#191f28;
  --dln-ink-700:#232b37;
  --dln-ink-line:rgba(255,255,255,.08);

  --dln-brass-700:#7a5a20;
  --dln-brass-600:#96701f;
  --dln-brass-500:#ab7d2c;
  --dln-brass-400:#c3963f;
  --dln-brass-300:#d7ae5f;
  --dln-brass-100:#f3e6c8;
  --dln-brass-050:#faf3e3;

  --dln-forest-700:#164539;
  --dln-forest-600:#1f5f4f;
  --dln-forest-100:#e3efe9;

  --dln-rust-700:#7a2a1d;
  --dln-rust-600:#9a3324;
  --dln-rust-100:#f6e3df;

  --dln-paper-0:#faf8f4;
  --dln-paper-1:#f2ede2;
  --dln-card:#ffffff;

  --dln-text:#1c1b19;
  --dln-muted:#726a5c;
  --dln-line:rgba(28,25,20,.10);
  --dln-line-strong:rgba(28,25,20,.16);

  --dln-shadow-xs:0 1px 2px rgba(20,15,5,.05);
  --dln-shadow-sm:0 2px 6px rgba(20,15,5,.06), 0 1px 2px rgba(20,15,5,.05);
  --dln-shadow-md:0 8px 20px rgba(20,15,5,.09), 0 2px 6px rgba(20,15,5,.05);
  --dln-shadow-lg:0 18px 40px rgba(20,15,5,.16), 0 4px 12px rgba(20,15,5,.06);
  --dln-shadow-glow:0 0 0 3px rgba(171,125,44,.14);

  --dln-radius-sm:6px;
  --dln-radius-md:9px;
  --dln-radius-lg:12px;
  --dln-radius-xl:16px;

  --dln-ease:cubic-bezier(.2,.7,.3,1);
}

/* --------------------------------------------------------------------------
   Base / typography
   -------------------------------------------------------------------------- */
html, body{
  font-family:'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  color:var(--dln-text);
}

h1, h2, h3, h4, h5, h6{
  font-family:inherit;
  letter-spacing:-.1px;
  color:var(--dln-text);
}

::selection{ background:rgba(171,125,44,.22); }

/* custom scrollbar */
*{ scrollbar-width:thin; scrollbar-color:rgba(28,25,20,.20) transparent; }
::-webkit-scrollbar{ width:8px; height:8px; }
::-webkit-scrollbar-track{ background:transparent; }
::-webkit-scrollbar-thumb{
  background:rgba(28,25,20,.18);
  border-radius:999px;
  border:2px solid transparent;
  background-clip:padding-box;
}
::-webkit-scrollbar-thumb:hover{ background:rgba(28,25,20,.32); background-clip:padding-box; }

/* halus, dengan sedikit gerak vertikal supaya terasa hidup */
@keyframes dlnFadeIn{
  from{ opacity:0; transform:translateY(4px); }
  to{ opacity:1; transform:translateY(0); }
}
.content-wrapper .content,
.content-wrapper .content-header{
  animation:dlnFadeIn .28s var(--dln-ease) both;
}

@keyframes dlnPop{
  from{ opacity:0; transform:scale(.985); }
  to{ opacity:1; transform:scale(1); }
}
.card{ animation:dlnPop .22s var(--dln-ease) both; }

/* --------------------------------------------------------------------------
   Layout backdrop — kertas hangat flat, dengan tekstur subtle
   -------------------------------------------------------------------------- */
.content-wrapper{
  background:var(--dln-paper-0) !important;
  background-image:
    radial-gradient(circle at 0% 0%, rgba(171,125,44,.05) 0, transparent 45%);
  background-attachment:fixed;
}

.content-header{
  padding-top:1.2rem;
  padding-bottom:.5rem;
}

/* Judul halaman: setiap file pages/*.php menulis <h1> dengan inline style
   dan pembungkus yang berbeda-beda (.content-header, .page-head, atau <h1>
   polos). Satukan semuanya di sini dengan !important supaya konsisten dan
   menang atas inline style/CSS lokal per halaman. */
.content-wrapper h1,
.content-header h1,
.page-head h1{
  font-size:19px !important;
  font-weight:700 !important;
  letter-spacing:-.2px !important;
  color:var(--dln-text) !important;
  margin:0 !important;
  line-height:1.3 !important;
}

/* --------------------------------------------------------------------------
   Sidebar — solid ink, dengan glow aktif yang lebih hidup
   -------------------------------------------------------------------------- */
.main-sidebar{
  background:var(--dln-ink-900) !important;
  border-right:1px solid var(--dln-ink-line);
  box-shadow:2px 0 16px rgba(0,0,0,.12);
}

.main-sidebar .brand-link{
  border-bottom:1px solid var(--dln-ink-line) !important;
  padding:17px 14px !important;
  background:transparent;
}

.main-sidebar .brand-text{
  font-weight:700 !important;
  font-size:16px;
  letter-spacing:0;
  color:#f4ecd8 !important;
  -webkit-text-fill-color:#f4ecd8;
  background:none;
}

.main-sidebar .os-content,
.main-sidebar .sidebar{ padding-top:8px; }

.nav-sidebar{ padding:0 10px; }

.nav-sidebar .nav-header{
  color:rgba(244,236,216,.34) !important;
  font-size:10.5px;
  font-weight:700;
  letter-spacing:1.3px;
  text-transform:uppercase;
  padding:16px 12px 8px;
}

.nav-sidebar > .nav-item{ margin-bottom:3px; }

.nav-sidebar > .nav-item > .nav-link{
  color:rgba(230,225,214,.74) !important;
  border-radius:var(--dln-radius-md) !important;
  padding:9.5px 12px !important;
  font-weight:500;
  font-size:13.5px;
  letter-spacing:0;
  transition:background .18s var(--dln-ease), color .18s var(--dln-ease), transform .18s var(--dln-ease);
  position:relative;
}

.nav-sidebar > .nav-item > .nav-link .nav-icon{
  width:28px;
  height:28px;
  min-width:28px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:var(--dln-radius-sm);
  background:transparent;
  margin-right:8px;
  font-size:13px;
  color:rgba(230,225,214,.6);
  transition:color .18s ease;
}

.nav-sidebar > .nav-item > .nav-link:hover{
  background:rgba(255,255,255,.06) !important;
  color:#fff !important;
  transform:translateX(1px);
}
.nav-sidebar > .nav-item > .nav-link:hover .nav-icon{
  color:rgba(244,236,216,.95);
}

.nav-sidebar > .nav-item > .nav-link.active,
.nav-sidebar .nav-treeview > .nav-item > .nav-link.active{
  background:rgba(171,125,44,.18) !important;
  color:#f4ecd8 !important;
  box-shadow:inset 0 0 0 1px rgba(171,125,44,.22);
}
.nav-sidebar > .nav-item > .nav-link.active .nav-icon{
  color:var(--dln-brass-400);
}
.nav-sidebar > .nav-item > .nav-link.active::before{
  content:"";
  position:absolute;
  left:-10px;
  top:50%;
  transform:translateY(-50%);
  width:3px;
  height:60%;
  border-radius:0 3px 3px 0;
  background:var(--dln-brass-400);
  box-shadow:0 0 8px rgba(195,150,63,.7);
}

.nav-sidebar .nav-link p{ font-weight:500; }

/* --------------------------------------------------------------------------
   Navbar — putih bersih, dengan bayangan lembut alih-alih garis tegas
   -------------------------------------------------------------------------- */
.main-header.navbar{
  background:#ffffff !important;
  border-bottom:1px solid var(--dln-line) !important;
  box-shadow:0 1px 0 rgba(28,25,20,.03), 0 4px 14px rgba(20,15,5,.03);
  padding:.35rem .6rem;
}

.main-header .nav-link{
  color:var(--dln-text) !important;
  border-radius:var(--dln-radius-sm);
  transition:background .18s ease;
}
.main-header .nav-item > .nav-link{ padding:.5rem .7rem; }
.main-header .nav-link:hover{ background:var(--dln-paper-1); }

.main-header [data-widget="pushmenu"]{
  width:32px;
  height:32px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:var(--dln-radius-sm);
  background:transparent;
  transition:background .18s ease;
}
.main-header [data-widget="pushmenu"]:hover{ background:var(--dln-paper-1); }

.dln-page-title{
  font-weight:700;
  font-size:14.5px;
  color:var(--dln-text);
  letter-spacing:0;
  display:flex;
  align-items:center;
  gap:9px;
}
.dln-page-title i{
  color:var(--dln-brass-600);
  font-size:12px;
  width:26px;
  height:26px;
  border-radius:var(--dln-radius-sm);
  background:var(--dln-brass-050);
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.dln-user-chip{
  display:flex;
  align-items:center;
  gap:8px;
  padding:5px 12px 5px 5px;
  border-radius:999px;
  background:var(--dln-paper-1);
  border:1px solid var(--dln-line);
  transition:box-shadow .18s ease;
}
.dln-user-chip:hover{ box-shadow:var(--dln-shadow-xs); }
.dln-user-avatar{
  width:24px;
  height:24px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--dln-ink-900);
  color:#f4ecd8;
  font-size:10.5px;
  font-weight:700;
  text-transform:uppercase;
}
.dln-user-name{
  font-weight:600;
  font-size:12.5px;
  color:var(--dln-text);
}

.dln-logout-btn{
  width:32px;
  height:32px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:var(--dln-radius-sm);
  color:#9a3324 !important;
  background:rgba(154,51,36,.08);
  transition:background .18s ease, transform .18s ease;
}
.dln-logout-btn:hover{ background:rgba(154,51,36,.16); transform:translateY(-1px); }

/* --------------------------------------------------------------------------
   Cards / boxes — kedalaman lebih halus, aksen naik saat hover
   -------------------------------------------------------------------------- */
.card,
.cardx{
  border:1px solid var(--dln-line) !important;
  border-radius:var(--dln-radius-lg) !important;
  box-shadow:var(--dln-shadow-xs) !important;
  transition:box-shadow .22s var(--dln-ease), transform .22s var(--dln-ease);
}
.card:hover{ box-shadow:var(--dln-shadow-sm) !important; }

.card-header,
.cardx-header{
  background:var(--dln-card) !important;
  border-bottom:1px solid var(--dln-line) !important;
  border-top-left-radius:var(--dln-radius-lg) !important;
  border-top-right-radius:var(--dln-radius-lg) !important;
  font-weight:700;
  padding:.9rem 1.1rem;
}

.card-title{ font-weight:700; letter-spacing:0; font-size:14.5px; }
.card-body{ padding:1.15rem; }

.content-header h2{
  font-weight:700 !important;
  letter-spacing:-.2px;
  color:var(--dln-text);
}

/* --------------------------------------------------------------------------
   Buttons — solid dengan lift halus, tanpa gradient berat
   -------------------------------------------------------------------------- */
.btn{
  border-radius:var(--dln-radius-md) !important;
  font-weight:600;
  letter-spacing:0;
  transition:filter .18s ease, box-shadow .18s var(--dln-ease), background .18s ease, transform .18s var(--dln-ease);
}
.btn:hover{ filter:brightness(.98); transform:translateY(-1px); }
.btn:active{ filter:brightness(.93); transform:translateY(0); }

.btn-primary{
  background:var(--dln-brass-500) !important;
  border:1px solid var(--dln-brass-600) !important;
  box-shadow:var(--dln-shadow-xs);
  color:#fff !important;
}
.btn-primary:hover{ background:var(--dln-brass-600) !important; filter:none; box-shadow:var(--dln-shadow-sm); }
.btn-primary:focus{ box-shadow:var(--dln-shadow-glow) !important; }

.btn-outline-secondary,
.btn-secondary{ border-radius:var(--dln-radius-md) !important; }

.btn-sm{ border-radius:var(--dln-radius-sm) !important; }

/* --------------------------------------------------------------------------
   Forms
   -------------------------------------------------------------------------- */
.form-control,
.custom-select,
select.form-control{
  border-radius:var(--dln-radius-md) !important;
  border:1px solid var(--dln-line-strong) !important;
  font-size:13.5px;
  transition:border-color .18s ease, box-shadow .18s ease;
}
.form-control:focus,
.custom-select:focus{
  border-color:var(--dln-brass-500) !important;
  box-shadow:var(--dln-shadow-glow) !important;
}
label{ font-weight:600; font-size:12.5px; color:#3a352c; }

/* --------------------------------------------------------------------------
   Tables — header lebih tegas, baris lebih nyaman dibaca
   -------------------------------------------------------------------------- */
.table thead th{
  border-top:none;
  border-bottom:1px solid var(--dln-line) !important;
  background:var(--dln-paper-1);
  font-size:11px;
  letter-spacing:.6px;
  text-transform:uppercase;
  color:#5c5648;
  font-weight:700;
  padding-top:.65rem;
  padding-bottom:.65rem;
}
.table tbody td{ vertical-align:middle; border-color:var(--dln-line); font-size:13.5px; }
.table-hover tbody tr{ transition:background .12s ease; }
.table-hover tbody tr:hover{ background:var(--dln-brass-050); }

/* --------------------------------------------------------------------------
   Badges — palet semantik lembut, senada tema
   -------------------------------------------------------------------------- */
.badge{
  border-radius:999px !important;
  padding:.36rem .65rem !important;
  font-weight:600 !important;
  letter-spacing:.1px;
}
.badge-success{ background:var(--dln-forest-100) !important; color:var(--dln-forest-700) !important; }
.badge-warning{ background:var(--dln-brass-100) !important; color:var(--dln-brass-700) !important; }
.badge-danger{ background:var(--dln-rust-100) !important; color:var(--dln-rust-700) !important; }

/* --------------------------------------------------------------------------
   Modals
   -------------------------------------------------------------------------- */
.modal-content{
  border-radius:var(--dln-radius-lg) !important;
  overflow:hidden;
  border:1px solid var(--dln-line) !important;
  box-shadow:var(--dln-shadow-lg) !important;
}
.modal-header{
  background:var(--dln-ink-900) !important;
  color:#f4ecd8 !important;
  border-bottom:none;
  padding:1rem 1.15rem;
}
/* Aturan global h1-h6{color:var(--dln-text)} menyasar <h5 class="modal-title">
   secara langsung dan menang atas warna yang diwariskan dari .modal-header,
   jadi harus dipaksa terang di sini juga. */
.modal-header,
.modal-header h1, .modal-header h2, .modal-header h3,
.modal-header h4, .modal-header h5, .modal-header h6,
.modal-header .modal-title{
  color:#f4ecd8 !important;
}
.modal-header .close{ color:#f4ecd8; opacity:.8; text-shadow:none; }
.modal-header .close:hover{ opacity:1; }
.modal-title{ font-weight:700; }
.modal-body{ padding:1.15rem; }
.modal-footer{ border-top:1px solid var(--dln-line); }
.modal-backdrop.show{ opacity:.55; }

/* --------------------------------------------------------------------------
   Alerts / pagination / empty states / misc
   -------------------------------------------------------------------------- */
.alert{ border-radius:var(--dln-radius-md) !important; border:1px solid transparent; }

.pagination .page-link{
  border-radius:var(--dln-radius-sm) !important;
  margin:0 3px;
  border:1px solid var(--dln-line);
  color:var(--dln-text);
  transition:background .15s ease, color .15s ease;
}
.pagination .page-item.active .page-link{
  background:var(--dln-brass-500);
  border-color:var(--dln-brass-500);
  color:#fff;
}

.dropdown-menu{
  border-radius:var(--dln-radius-md) !important;
  border:1px solid var(--dln-line) !important;
  box-shadow:var(--dln-shadow-md) !important;
  overflow:hidden;
}
.dropdown-item{ transition:background .12s ease; }

/* generic empty-state, aman dipakai di halaman manapun */
.dln-empty{
  text-align:center;
  padding:48px 20px;
  color:var(--dln-muted);
}
.dln-empty i{
  font-size:28px;
  color:var(--dln-brass-400);
  margin-bottom:12px;
  display:inline-block;
}
.dln-empty p{ margin:0; font-size:13.5px; }

/* Small screens: keep spacing comfortable */
@media (max-width:576px){
  .dln-user-name{ display:none; }
  .card-body{ padding:.9rem; }
}
