/* =====================================================================
   Mahameru Admin — gaya mengikuti tema Falcon (Bootstrap 5)
   Ganti warna utama cukup di --brand / --brand-rgb di bawah.
   (Warna asli Falcon: #2c7be5 / 44,123,229)
   ===================================================================== */
:root {
  --brand: #800000;
  --brand-rgb: 128, 0, 0;
  --brand-dark: #5a0b0b;
  --brand-soft: #f6e9e9;

  --falcon-bg: #edf2f9;
  --falcon-body: #5e6e82;
  --falcon-heading: #344050;
  --falcon-gray-300: #d8e2ef;
  --falcon-gray-200: #edf2f9;
  --falcon-card-header: #f9fafd;
  --falcon-shadow: 0 7px 14px 0 rgba(65, 69, 88, .1), 0 3px 6px 0 rgba(0, 0, 0, .07);
  --sidebar-w: 13rem;

  --bs-primary: var(--brand);
  --bs-primary-rgb: var(--brand-rgb);
  --bs-link-color: var(--brand);
  --bs-link-color-rgb: var(--brand-rgb);
  --bs-link-hover-color: var(--brand-dark);
  --bs-body-font-family: "Open Sans", -apple-system, "Segoe UI", Roboto, sans-serif;
  --bs-body-color: var(--falcon-body);
  --bs-border-color: var(--falcon-gray-300);
}

body { font-size: .875rem; background: var(--falcon-bg); }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .font-sans-serif {
  font-family: "Poppins", -apple-system, "Segoe UI", sans-serif;
  color: var(--falcon-heading);
  font-weight: 500;
}
.fs-11 { font-size: .75rem !important; }
.fs-10 { font-size: .8333rem !important; }
.text-700 { color: var(--falcon-heading) !important; }
.text-500 { color: #9da9bb !important; }

/* ---------- Tombol & form ---------- */
.btn { font-family: "Poppins", sans-serif; font-weight: 500; font-size: .8333rem; border-radius: .375rem; }
.btn-primary {
  --bs-btn-bg: var(--brand); --bs-btn-border-color: var(--brand);
  --bs-btn-hover-bg: var(--brand-dark); --bs-btn-hover-border-color: var(--brand-dark);
  --bs-btn-active-bg: var(--brand-dark); --bs-btn-active-border-color: var(--brand-dark);
  --bs-btn-disabled-bg: var(--brand); --bs-btn-disabled-border-color: var(--brand);
}
.btn-outline-primary {
  --bs-btn-color: var(--brand); --bs-btn-border-color: var(--brand);
  --bs-btn-hover-bg: var(--brand); --bs-btn-hover-border-color: var(--brand);
  --bs-btn-active-bg: var(--brand); --bs-btn-active-border-color: var(--brand);
}
.btn-falcon-default {
  color: #4d5969; background: #fff; border: 0;
  box-shadow: 0 0 0 1px rgba(43, 45, 80, .1), 0 2px 5px 0 rgba(43, 45, 80, .08), 0 1px 1.5px 0 rgba(0, 0, 0, .07), 0 1px 2px 0 rgba(0, 0, 0, .08);
}
.btn-falcon-default:hover { color: #3a4553; background: #fff; }
.form-control, .form-select { font-size: .8333rem; border-color: var(--falcon-gray-300); }
.form-control:focus, .form-select:focus { border-color: rgba(var(--brand-rgb), .5); box-shadow: 0 0 0 .2rem rgba(var(--brand-rgb), .15); }
.form-label { font-weight: 500; color: var(--falcon-heading); font-size: .8333rem; }
.form-check-input:checked { background-color: var(--brand); border-color: var(--brand); }

/* ---------- Kartu ---------- */
.card { border: 0; box-shadow: var(--falcon-shadow); border-radius: .375rem; }
.card-header { background: #fff; border-bottom: 1px solid var(--falcon-gray-200); padding: 1rem 1.25rem; }
.card-header.bg-body-tertiary, .bg-body-tertiary { background: var(--falcon-card-header) !important; }
.card-footer { background: var(--falcon-card-header); border-top: 1px solid var(--falcon-gray-200); }

/* Kartu statistik dengan hiasan pojok khas Falcon */
.card-stat { position: relative; overflow: hidden; }
.card-stat .bg-holder {
  position: absolute; inset: 0; pointer-events: none;
  background-repeat: no-repeat; background-position: right top; background-size: contain;
}
.card-stat .bg-holder::before, .card-stat .bg-holder::after {
  content: ""; position: absolute; border-radius: 50%;
}
.card-stat .bg-holder::before { width: 11rem; height: 11rem; right: -4rem; top: -5rem; background: var(--tone-soft, rgba(var(--brand-rgb), .10)); }
.card-stat .bg-holder::after  { width: 6rem;  height: 6rem;  right: 2.5rem; top: -3.2rem; background: var(--tone-soft-2, rgba(var(--brand-rgb), .06)); }
.card-stat .display-4 { font-family: "Poppins", sans-serif; font-size: 2rem; font-weight: 400; color: var(--tone, var(--brand)); }
.tone-success { --tone: #00864e; --tone-soft: rgba(0, 210, 122, .14); --tone-soft-2: rgba(0, 210, 122, .08); }
.tone-warning { --tone: #c46632; --tone-soft: rgba(245, 128, 62, .16); --tone-soft-2: rgba(245, 128, 62, .08); }
.tone-info    { --tone: #1978a2; --tone-soft: rgba(39, 188, 253, .16); --tone-soft-2: rgba(39, 188, 253, .08); }
.tone-brand   { --tone: var(--brand); }

/* ---------- Badge "subtle" Falcon ---------- */
.badge { font-family: "Poppins", sans-serif; font-weight: 600; font-size: .7rem; padding: .35em .75em; }
.badge-subtle-success   { color: #00864e; background: #ccf6e4; }
.badge-subtle-warning   { color: #9d5228; background: #fde6d8; }
.badge-subtle-danger    { color: #932338; background: #fad7dd; }
.badge-subtle-info      { color: #1978a2; background: #d4f2ff; }
.badge-subtle-primary   { color: var(--brand); background: var(--brand-soft); }
.badge-subtle-secondary { color: #4d5969; background: #e3e6ea; }

/* ---------- Tabel ---------- */
.table { --bs-table-color: var(--falcon-body); font-size: .8333rem; margin-bottom: 0; }
.table > thead > tr > th {
  background: var(--falcon-card-header); color: var(--falcon-heading); font-weight: 600;
  white-space: nowrap; border-bottom-width: 1px; font-size: .78rem;
}
.table > :not(caption) > * > * { padding: .65rem 1rem; vertical-align: middle; }
.table-hover > tbody > tr:hover > * { --bs-table-accent-bg: #f5f8fc; }

/* ---------- Avatar ---------- */
.avatar {
  width: 2rem; height: 2rem; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
  background: var(--brand-soft); color: var(--brand); font-family: "Poppins", sans-serif; font-weight: 600; font-size: .75rem;
  flex-shrink: 0; overflow: hidden;
}
.avatar-xl { width: 3rem; height: 3rem; font-size: 1rem; }
.avatar img { width: 100%; height: 100%; object-fit: cover; }

/* ---------- Sidebar (navbar-vertical) ---------- */
.navbar-vertical {
  position: fixed; top: 0; left: 0; bottom: 0; width: var(--sidebar-w);
  padding: 0 .75rem 1rem 1rem; overflow-y: auto; z-index: 1030; background: var(--falcon-bg);
}
.navbar-brand-box { display: flex; align-items: center; gap: .55rem; height: 4.3rem; text-decoration: none; }
.navbar-brand-box img { width: 34px; height: 34px; }
.navbar-brand-box span { font-family: "Poppins", sans-serif; font-weight: 800; font-size: 1.35rem; color: var(--brand); letter-spacing: -.5px; }
.navbar-vertical-label {
  display: flex; align-items: center; gap: .5rem; margin: 1.1rem 0 .35rem;
  font-size: .72rem; font-weight: 600; color: #9da9bb; text-transform: none; white-space: nowrap;
}
.navbar-vertical-label::after { content: ""; flex: 1; height: 1px; background: var(--falcon-gray-300); }
.navbar-vertical .nav-link {
  display: flex; align-items: center; gap: .55rem; padding: .38rem 0; color: var(--falcon-body);
  font-family: "Poppins", sans-serif; font-weight: 500; font-size: .8333rem;
}
.navbar-vertical .nav-link .nav-icon { width: 1.1rem; text-align: center; font-size: .82rem; }
.navbar-vertical .nav-link:hover { color: var(--falcon-heading); }
.navbar-vertical .nav-link.active { color: var(--brand); }
.navbar-vertical .nav-link .badge { margin-left: auto; }

/* ---------- Konten & top navbar ---------- */
.content { margin-left: var(--sidebar-w); padding: 0 1.5rem 1rem 1rem; min-height: 100vh; display: flex; flex-direction: column; }
.navbar-top {
  position: sticky; top: 0; z-index: 1020; height: 4.3rem; display: flex; align-items: center; gap: 1rem;
  background: rgba(237, 242, 249, .92); backdrop-filter: blur(6px); margin-bottom: .5rem;
}
.navbar-top .search-box { max-width: 22rem; flex: 1; position: relative; }
.navbar-top .search-box input { border-radius: 2rem; padding-left: 2.2rem; background: #fff; border: 1px solid var(--falcon-gray-300); }
.navbar-top .search-box .fa-search { position: absolute; left: .9rem; top: 50%; transform: translateY(-50%); color: #9da9bb; font-size: .8rem; }
.navbar-top .dropdown-menu { font-size: .8333rem; border: 0; box-shadow: var(--falcon-shadow); }
.page-title { margin-bottom: 1rem; }
.page-title h5 { margin: 0; }
.footer { margin-top: auto; padding-top: 2rem; font-size: .8rem; color: #9da9bb; }

.sidebar-toggle { display: none; }
@media (max-width: 1199.98px) {
  .navbar-vertical { transform: translateX(-100%); transition: transform .25s; background: #fff; box-shadow: var(--falcon-shadow); }
  body.sidebar-open .navbar-vertical { transform: none; }
  .content { margin-left: 0; padding: 0 1rem 1rem; }
  .sidebar-toggle { display: inline-flex; }
}

/* ---------- Halaman login (Falcon "split card") ---------- */
.auth-wrapper { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 1.5rem; }
.auth-card { max-width: 860px; width: 100%; overflow: hidden; }
.auth-side {
  position: relative; color: #fff; padding: 3rem 2.25rem;
  background: linear-gradient(-45deg, #a0262a, var(--brand), var(--brand-dark));
}
.auth-side::before, .auth-side::after { content: ""; position: absolute; border-radius: 50%; background: rgba(255, 255, 255, .07); }
.auth-side::before { width: 16rem; height: 16rem; right: -6rem; top: -6rem; }
.auth-side::after  { width: 10rem; height: 10rem; left: -4rem; bottom: -4rem; }
.auth-side .logo-circle { width: 84px; height: 84px; border-radius: 50%; background: #fff; display: flex; align-items: center; justify-content: center; box-shadow: 0 8px 20px rgba(0,0,0,.2); }
.auth-side .logo-circle img { width: 62px; }
.auth-side h4 { color: #fff; font-weight: 700; letter-spacing: 3px; }

/* ---------- Lain-lain ---------- */
.photo-thumb { width: 100%; aspect-ratio: 3/4; object-fit: cover; border-radius: .5rem; background: var(--brand-soft); }
.map-box { height: 320px; border-radius: .5rem; z-index: 1; }
.timeline-dot { width: .6rem; height: .6rem; border-radius: 50%; display: inline-block; }

@media print {
  .navbar-vertical, .navbar-top, .footer, .no-print { display: none !important; }
  .content { margin: 0; padding: 0; }
  body { background: #fff; }
  .card { box-shadow: none; }
}
