/* =========================================================================
   DEWANTA THEME — Perpustakaan ITEBIS PGRI Dewantara Jombang
   Tema visual terpusat: warna, tipografi, komponen kartu/tombol/tabel.
   File ini murni kosmetik — tidak mengandung logika aplikasi apapun.
   ========================================================================= */

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');

:root{
  --dw-green:        #1a7a42;
  --dw-green-dark:    #0f5c30;
  --dw-green-darker:  #0a4023;
  --dw-green-light:   #e7f5ec;
  --dw-gold:          #f4b400;
  --dw-gold-dark:     #c98f00;
  --dw-gold-light:    #fff6df;
  --dw-red:           #d64545;
  --dw-ink:           #1f2a24;
  --dw-muted:         #6b7a72;
  --dw-bg:            #f4f7f5;
  --dw-card-radius:   16px;
  --dw-shadow:        0 6px 20px rgba(15, 92, 48, 0.08);
  --dw-shadow-lg:     0 14px 34px rgba(15, 92, 48, 0.16);
}

html, body{
  font-family: 'Plus Jakarta Sans', 'Segoe UI', Tahoma, sans-serif;
}

body.dw-bg{
  background: var(--dw-bg);
}

/* ---- Bootstrap color overrides so every existing .btn-primary /
   .bg-success / .text-warning etc. across the app inherits the brand
   palette automatically, with zero markup changes. ---- */
:root, [data-bs-theme]{
  --bs-primary: var(--dw-green);
  --bs-primary-rgb: 26,122,66;
  --bs-success: #2f9e58;
  --bs-success-rgb: 47,158,88;
  --bs-warning: var(--dw-gold);
  --bs-warning-rgb: 244,180,0;
  --bs-danger: var(--dw-red);
  --bs-danger-rgb: 214,69,69;
  --bs-info: #2f8fae;
  --bs-info-rgb: 47,143,174;
  --bs-secondary: #5c6b64;
  --bs-secondary-rgb: 92,107,100;
  --bs-dark: var(--dw-green-darker);
  --bs-link-color: var(--dw-green);
  --bs-link-hover-color: var(--dw-green-dark);
}

.btn{ border-radius: 10px; font-weight: 600; letter-spacing:.2px; }
.btn-primary{ --bs-btn-bg: var(--dw-green); --bs-btn-border-color: var(--dw-green); --bs-btn-hover-bg: var(--dw-green-dark); --bs-btn-hover-border-color: var(--dw-green-dark); }
.btn-warning{ color:#412c00; }
.btn-outline-primary{ --bs-btn-color: var(--dw-green); --bs-btn-border-color: var(--dw-green); --bs-btn-hover-bg: var(--dw-green); --bs-btn-hover-border-color: var(--dw-green); }
.btn:focus, .btn:active{ box-shadow: 0 0 0 .2rem rgba(26,122,66,.18) !important; }
.btn-sm i{ margin-right:2px; }

a{ text-decoration:none; }

/* ---- Cards ---- */
.card{
  border: 1px solid rgba(15,92,48,.08);
  border-radius: var(--dw-card-radius);
  box-shadow: var(--dw-shadow);
}
.card-header{
  border-top-left-radius: var(--dw-card-radius) !important;
  border-top-right-radius: var(--dw-card-radius) !important;
  font-weight: 700;
  letter-spacing:.2px;
}
.shadow-sm{ box-shadow: var(--dw-shadow) !important; }
.shadow-lg{ box-shadow: var(--dw-shadow-lg) !important; }

/* ---- Brand top strip used on every admin/CRUD page ---- */
.dw-topbar{
  display:flex; align-items:center; gap:14px;
  background: linear-gradient(120deg, var(--dw-green) 0%, var(--dw-green-dark) 65%, var(--dw-green-darker) 100%);
  color:#fff; border-radius: var(--dw-card-radius);
  padding: 16px 22px; margin-bottom: 22px;
  box-shadow: var(--dw-shadow-lg);
  position: relative; overflow:hidden;
}
.dw-topbar::after{
  content:""; position:absolute; inset:0;
  background: radial-gradient(600px 120px at 90% -20%, rgba(244,180,0,.35), transparent 60%);
  pointer-events:none;
}
.dw-topbar img.dw-logo{
  width:48px; height:48px; object-fit:contain;
  background:#fff; border-radius:50%; padding:4px;
  box-shadow: 0 2px 8px rgba(0,0,0,.25);
  flex-shrink:0;
}
.dw-topbar .dw-title{ font-weight:800; font-size:1.15rem; line-height:1.2; margin:0; }
.dw-topbar .dw-subtitle{ font-size:.8rem; opacity:.85; margin:0; }
.dw-topbar .dw-actions{ margin-left:auto; display:flex; gap:8px; flex-wrap:wrap; position:relative; z-index:1; }
.dw-topbar .btn-back{
  background: rgba(255,255,255,.15); color:#fff; border:1px solid rgba(255,255,255,.35);
}
.dw-topbar .btn-back:hover{ background: rgba(255,255,255,.28); color:#fff; }

/* Breadcrumb pill under topbar (optional) */
.dw-crumb{
  font-size:.8rem; color: var(--dw-muted); margin-bottom:14px; display:flex; align-items:center; gap:6px;
}
.dw-crumb a{ color: var(--dw-green); font-weight:600; }

/* ---- Section card headers with gradient accents (keeps bg-* classes working) ---- */
.card-header.bg-primary{ background: linear-gradient(90deg, var(--dw-green), var(--dw-green-dark)) !important; }
.card-header.bg-success{ background: linear-gradient(90deg, #2f9e58, #1f7a41) !important; }
.card-header.bg-warning{ background: linear-gradient(90deg, var(--dw-gold), var(--dw-gold-dark)) !important; color:#3a2700 !important; }
.card-header.bg-info{ background: linear-gradient(90deg, #2f8fae, #1f6e88) !important; }
.card-header.bg-danger{ background: linear-gradient(90deg, var(--dw-red), #a83232) !important; }
.card-header.bg-dark{ background: linear-gradient(90deg, var(--dw-green-darker), #06301a) !important; }

/* ---- Tables ---- */
table.table thead.table-dark th{
  background: var(--dw-green-darker); color:#fff; border-color: var(--dw-green-darker);
  font-size:.82rem; text-transform:uppercase; letter-spacing:.4px; white-space:nowrap;
}
table.table tbody tr:hover{ background: var(--dw-green-light); }
.table > :not(caption) > * > *{ vertical-align: middle; }

/* ---- Forms ---- */
.form-control:focus, .form-select:focus{
  border-color: var(--dw-green);
  box-shadow: 0 0 0 .2rem rgba(26,122,66,.15);
}
.input-group-text{ background: var(--dw-green-light); color: var(--dw-green-dark); border-color:#cfe6d7; }

/* ---- Badges ---- */
.badge.bg-success{ background: var(--dw-green) !important; }
.badge.bg-info{ background:#2f8fae !important; }

/* ---- AdminLTE dashboard tweaks (admin/index.php) ---- */
.main-sidebar.sidebar-dark-primary{
  background: linear-gradient(180deg, var(--dw-green-darker), #051f10 85%) !important;
}
.brand-link{ display:flex !important; align-items:center; gap:10px; }
.brand-link img.dw-logo-sm{ width:34px; height:34px; border-radius:50%; background:#fff; padding:2px; }
.nav-sidebar .nav-link.active{ background: var(--dw-gold) !important; color:#3a2700 !important; font-weight:700; }
.nav-sidebar .nav-link:hover{ background: rgba(244,180,0,.18); }
.main-header.navbar{ box-shadow: 0 2px 10px rgba(0,0,0,.06); }
.small-box{ border-radius: 14px; }

/* ---- Login page ---- */
.dw-login-wrap{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:
    radial-gradient(700px 380px at 15% 10%, rgba(244,180,0,.35), transparent 60%),
    radial-gradient(900px 500px at 85% 90%, rgba(255,255,255,.12), transparent 60%),
    linear-gradient(135deg, var(--dw-green-darker), var(--dw-green) 60%, var(--dw-green-dark));
  padding: 20px;
}
.dw-login-card{
  width:100%; max-width:400px; background:#fff; border-radius: 20px;
  box-shadow: var(--dw-shadow-lg); padding: 34px 30px; text-align:center;
  animation: dwFadeUp .5s ease;
}
.dw-login-card img{ width:78px; height:78px; margin-bottom:10px; }
.dw-login-card h4{ font-weight:800; color: var(--dw-green-darker); margin-bottom:2px; }
.dw-login-card p.sub{ color: var(--dw-muted); font-size:.85rem; margin-bottom:20px; }
.dw-login-card .btn-primary{ width:100%; padding:10px; }
.dw-login-card .form-control{ border-radius:10px; padding:10px 14px; }
.dw-hint{ font-size:.76rem; color:var(--dw-muted); margin-top:16px; }

@keyframes dwFadeUp{ from{opacity:0; transform:translateY(14px);} to{opacity:1; transform:translateY(0);} }

/* ---- Lightweight in-page header for CRUD screens that now live
   inside the shared AdminLTE sidebar template (no more separate
   standalone topbar / back-to-dashboard button needed) ---- */
.dw-page-head{
  display:flex; align-items:center; gap:12px; margin-bottom:18px;
}
.dw-page-head .dw-page-icon{
  width:46px; height:46px; border-radius:12px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  background: linear-gradient(135deg, var(--dw-green), var(--dw-green-dark));
  color:#fff; font-size:1.3rem; box-shadow: var(--dw-shadow);
}
.dw-page-head h4{ font-weight:800; color:var(--dw-green-darker); margin:0; }
.dw-page-head p{ color:var(--dw-muted); margin:0; font-size:.85rem; }

/* ---- Chart cards ---- */
.dw-chart-card .card-body{ position:relative; }
.dw-chart-legend{ display:flex; gap:14px; flex-wrap:wrap; font-size:.78rem; color:var(--dw-muted); margin-top:6px; }
.dw-chart-legend span{ display:inline-flex; align-items:center; gap:6px; }
.dw-chart-legend i{ width:10px; height:10px; border-radius:3px; display:inline-block; }

/* ---- Small stat pill used in rekap totals ---- */
.dw-stat-pill{
  display:inline-flex; align-items:center; gap:8px;
  background: var(--dw-green-light); color: var(--dw-green-darker);
  padding:8px 14px; border-radius:999px; font-weight:700; font-size:.85rem;
}

/* ---- Clean total-count cards (rekap harian/bulanan/tahunan) ---- */
.dw-total-card{ border:none; border-radius:14px; transition: transform .15s ease; }
.dw-total-card:hover{ transform: translateY(-2px); }
.dw-total-icon{
  width:52px; height:52px; border-radius:12px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; font-size:1.35rem;
}
.dw-total-label{ font-weight:700; color:var(--dw-green-darker); font-size:.85rem; text-transform:uppercase; letter-spacing:.03em; }
.dw-total-number{ font-weight:800; font-size:2rem; line-height:1.15; color:#212529; }
.dw-total-sub{ color:var(--dw-muted); font-size:.78rem; }

/* ---- Sidebar CRUD import label ---- */
.dw-import-hint{ font-size:.76rem; color:var(--dw-muted); }

/* ---- Small helper utility ---- */
.dw-fade-in{ animation: dwFadeUp .5s ease; }