/* =================================================================
   Sari Sarana Berkah — tema "coklat pakan di atas putih"
   Ditautkan setelah bootstrap.min.css sehingga menimpa warna bawaan
   di semua halaman (termasuk halaman lama).
   ================================================================= */
:root {
  --ssb-pellet: #7A4A26;      /* coklat pelet pakan — warna utama  */
  --ssb-pellet-rgb: 122, 74, 38;
  --ssb-pellet-dark: #5E3819; /* hover / aktif                      */
  --ssb-roast: #3B2414;       /* teks judul, coklat sangrai         */
  --ssb-bran: #C9A27A;        /* garis, dedak                        */
  --ssb-husk: #F4ECE2;        /* isian tabel, sekam                  */
  --ssb-husk-2: #FAF6F1;
  --ssb-water: #1F7A5C;       /* nilai positif (hijau dari logo)     */
  --ssb-chili: #B23A2B;       /* nilai negatif                       */
  --ssb-ink: #2A2018;

  --bs-primary: var(--ssb-pellet);
  --bs-primary-rgb: var(--ssb-pellet-rgb);
  --bs-link-color: var(--ssb-pellet);
  --bs-link-color-rgb: var(--ssb-pellet-rgb);
  --bs-link-hover-color: var(--ssb-pellet-dark);
  --bs-link-hover-color-rgb: 94, 56, 25;
  --bs-body-color: var(--ssb-ink);
  --bs-body-bg: #FFFFFF;
  --bs-border-color: #E6DACB;
  --bs-font-sans-serif: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --bs-border-radius: .5rem;
  --bs-focus-ring-color: rgba(var(--ssb-pellet-rgb), .25);
}

body {
  background: #FFFFFF;
  font-feature-settings: "tnum" 1, "lnum" 1;
}
h1, h2, h3, h4, h5 { color: var(--ssb-roast); font-weight: 700; letter-spacing: -.01em; }
h2 { font-size: 1.6rem; margin-bottom: 1rem; }

/* ---------- tombol ---------- */
.btn-primary {
  --bs-btn-bg: var(--ssb-pellet); --bs-btn-border-color: var(--ssb-pellet);
  --bs-btn-hover-bg: var(--ssb-pellet-dark); --bs-btn-hover-border-color: var(--ssb-pellet-dark);
  --bs-btn-active-bg: var(--ssb-roast); --bs-btn-active-border-color: var(--ssb-roast);
  --bs-btn-disabled-bg: var(--ssb-bran); --bs-btn-disabled-border-color: var(--ssb-bran);
  --bs-btn-focus-shadow-rgb: var(--ssb-pellet-rgb);
}
.btn-outline-primary {
  --bs-btn-color: var(--ssb-pellet); --bs-btn-border-color: var(--ssb-pellet);
  --bs-btn-hover-bg: var(--ssb-pellet); --bs-btn-hover-border-color: var(--ssb-pellet);
  --bs-btn-active-bg: var(--ssb-pellet-dark); --bs-btn-active-border-color: var(--ssb-pellet-dark);
}
.btn-secondary {
  --bs-btn-color: var(--ssb-roast); --bs-btn-bg: var(--ssb-husk); --bs-btn-border-color: #E3D3BF;
  --bs-btn-hover-color: var(--ssb-roast); --bs-btn-hover-bg: #EADCCB; --bs-btn-hover-border-color: var(--ssb-bran);
  --bs-btn-active-color: var(--ssb-roast); --bs-btn-active-bg: #E1CFB9;
}
.btn-outline-secondary {
  --bs-btn-color: var(--ssb-roast); --bs-btn-border-color: #D9C6AF;
  --bs-btn-hover-color: var(--ssb-roast); --bs-btn-hover-bg: var(--ssb-husk); --bs-btn-hover-border-color: var(--ssb-bran);
}
.btn-success {
  --bs-btn-bg: var(--ssb-water); --bs-btn-border-color: var(--ssb-water);
  --bs-btn-hover-bg: #186148; --bs-btn-hover-border-color: #186148;
}
.btn-info, .btn-warning {
  --bs-btn-color: var(--ssb-roast); --bs-btn-bg: #EBD3B3; --bs-btn-border-color: #E0C39E;
  --bs-btn-hover-color: var(--ssb-roast); --bs-btn-hover-bg: #E2C298; --bs-btn-hover-border-color: #D6B184;
}
.btn-danger { --bs-btn-bg: var(--ssb-chili); --bs-btn-border-color: var(--ssb-chili); --bs-btn-hover-bg: #932E22; --bs-btn-hover-border-color: #932E22; }

/* ---------- warna utilitas ---------- */
.bg-primary   { background-color: var(--ssb-pellet) !important; }
.text-primary { color: var(--ssb-pellet) !important; }
.bg-info      { background-color: #EBD3B3 !important; color: var(--ssb-roast) !important; }
.bg-light     { background-color: var(--ssb-husk-2) !important; }
.text-success { color: var(--ssb-water) !important; }
.text-danger  { color: var(--ssb-chili) !important; }
.border-primary { border-color: var(--ssb-pellet) !important; }
.alert-primary, .alert-info { --bs-alert-color: var(--ssb-roast); --bs-alert-bg: var(--ssb-husk); --bs-alert-border-color: #E6D4BE; }

/* ---------- form ---------- */
.form-control:focus, .form-select:focus {
  border-color: var(--ssb-bran);
  box-shadow: 0 0 0 .2rem rgba(var(--ssb-pellet-rgb), .18);
}
.form-label { font-weight: 600; color: var(--ssb-roast); font-size: .9rem; }
.form-check-input:checked { background-color: var(--ssb-pellet); border-color: var(--ssb-pellet); }
:focus-visible { outline: 2px solid var(--ssb-pellet); outline-offset: 2px; }

/* ---------- tabel ---------- */
.table { --bs-table-striped-bg: var(--ssb-husk-2); --bs-table-hover-bg: #F6EDE2; }
.table > thead > tr > th, .table > thead > tr > td, .table thead th {
  background: var(--ssb-husk); color: var(--ssb-roast); font-weight: 700;
  border-bottom: 2px solid var(--ssb-bran); font-size: .85rem;
}
.table-primary { --bs-table-bg: var(--ssb-husk); --bs-table-color: var(--ssb-roast); --bs-table-border-color: #E6D4BE; }
.table-dark    { --bs-table-bg: var(--ssb-roast); --bs-table-border-color: #5A3A22; }
.table-info    { --bs-table-bg: #F1E3D0; --bs-table-color: var(--ssb-roast); }

/* ---------- komponen ---------- */
.pagination { --bs-pagination-color: var(--ssb-pellet); --bs-pagination-active-bg: var(--ssb-pellet); --bs-pagination-active-border-color: var(--ssb-pellet); --bs-pagination-hover-color: var(--ssb-pellet-dark); --bs-pagination-focus-box-shadow: 0 0 0 .2rem rgba(var(--ssb-pellet-rgb), .2); }
.nav-tabs .nav-link { color: var(--ssb-roast); }
.nav-tabs .nav-link.active { color: var(--ssb-pellet); border-bottom-color: #fff; font-weight: 700; }
.nav-pills { --bs-nav-pills-link-active-bg: var(--ssb-pellet); }
.modal-header.bg-primary, .modal-header.bg-secondary { background: var(--ssb-pellet) !important; color: #fff; }
.card { border-color: #EADFD1; }
.badge.bg-primary { background: var(--ssb-pellet) !important; }
.badge.bg-secondary { background: #8C7764 !important; }

/* =================================================================
   Header aplikasi
   ================================================================= */
.ssb-topbar {
  background: #FFFFFF;
  border-bottom: 1px solid #EFE5D8;
  position: relative;
}
/* jajaran pelet di bawah header — satu-satunya ornamen */
.ssb-topbar::after {
  content: "";
  position: absolute; left: 0; right: 0; bottom: -7px; height: 6px;
  background:
    radial-gradient(circle at 3px 3px, var(--ssb-pellet) 2.2px, transparent 2.6px) 0 0 / 14px 6px repeat-x;
  opacity: .55;
  pointer-events: none;
}
.ssb-brand { display: flex; align-items: center; gap: .6rem; text-decoration: none; }
.ssb-brand img { width: 46px; height: 46px; }
.ssb-brand .nama { color: var(--ssb-roast); font-weight: 800; font-size: 1.05rem; line-height: 1.1; letter-spacing: -.01em; }
.ssb-brand .sub  { color: #8C735C; font-size: .72rem; font-weight: 500; }
.ssb-topbar .nav-link { color: var(--ssb-roast); font-weight: 600; font-size: .92rem; padding: .5rem .8rem; border-radius: .4rem; }
.ssb-topbar .nav-link:hover { background: var(--ssb-husk-2); color: var(--ssb-pellet); }
.ssb-topbar .nav-link.active { color: var(--ssb-pellet); background: var(--ssb-husk); }
.ssb-topbar .dropdown-menu { border-color: #EADFD1; box-shadow: 0 8px 24px rgba(59, 36, 20, .08); }
.ssb-topbar .dropdown-item:active { background: var(--ssb-pellet); }
.ssb-user { display: flex; align-items: center; gap: .5rem; }
.ssb-user img, .ssb-user .inisial {
  width: 32px; height: 32px; border-radius: 50%; object-fit: cover;
  background: var(--ssb-pellet); color: #fff; display: inline-grid; place-items: center; font-weight: 700; font-size: .85rem;
}
.ssb-user .lvl { font-size: .72rem; color: #8C735C; display: block; line-height: 1; }
.ssb-main { padding-top: 1.75rem; padding-bottom: 3rem; }
.ssb-toolbar { display: flex; flex-wrap: wrap; gap: .5rem; align-items: end; margin-bottom: 1.25rem; }

/* =================================================================
   Dashboard
   ================================================================= */
.ssb-tile {
  display: flex; gap: 1rem; align-items: center; text-decoration: none;
  padding: 1.1rem 1.25rem; border: 1px solid #EADFD1; border-radius: .75rem; background: #fff;
  color: var(--ssb-ink); height: 100%;
}
.ssb-tile:hover { border-color: var(--ssb-bran); background: var(--ssb-husk-2); color: var(--ssb-ink); }
.ssb-tile i { font-size: 1.4rem; color: var(--ssb-pellet); width: 2.75rem; height: 2.75rem; display: grid; place-items: center; background: var(--ssb-husk); border-radius: .6rem; flex: none; }
.ssb-tile b { display: block; color: var(--ssb-roast); }
.ssb-tile small { color: #8C735C; }
.ssb-saldo { border-left: 4px solid var(--ssb-pellet); padding: .25rem 0 .25rem 1rem; }
.ssb-saldo .label { color: #8C735C; font-size: .85rem; }
.ssb-saldo .nilai { font-size: 1.5rem; font-weight: 800; color: var(--ssb-roast); }

/* =================================================================
   Lembar laporan keuangan (Neraca & Laba Rugi)
   ================================================================= */
.lap-sheet {
  background: #fff; border: 1px solid #E8DCCD; border-radius: .25rem;
  max-width: 900px; margin: 0 auto; padding: 2.5rem 2.75rem 2rem;
  box-shadow: 0 1px 0 #E8DCCD, 0 12px 32px -18px rgba(59, 36, 20, .35);
}
.lap-kop { display: grid; grid-template-columns: 72px 1fr 72px; align-items: center; border-bottom: 3px double var(--ssb-roast); padding-bottom: 1rem; margin-bottom: 1.25rem; }
.lap-kop img { width: 72px; height: 72px; }
.lap-kop .judul { text-align: center; }
.lap-kop .judul .pt { font-weight: 800; color: var(--ssb-roast); font-size: 1.15rem; letter-spacing: .02em; }
.lap-kop .judul .nama-lap { font-weight: 700; font-size: 1.05rem; color: var(--ssb-pellet); margin-top: .1rem; }
.lap-kop .judul .periode { font-size: .9rem; color: #6F5A47; }
.lap-basis { font-size: .8rem; color: #6F5A47; background: var(--ssb-husk-2); border: 1px solid #EFE3D4; border-radius: .4rem; padding: .5rem .75rem; margin-bottom: 1rem; }

table.lap { width: 100%; border-collapse: collapse; font-size: .93rem; }
table.lap th.kol { text-align: right; font-size: .78rem; color: #6F5A47; font-weight: 700; padding: 0 0 .4rem .75rem; border-bottom: 1px solid var(--ssb-bran); white-space: nowrap; }
table.lap td { padding: .28rem 0; vertical-align: top; }
table.lap td.n { text-align: right; white-space: nowrap; padding-left: .75rem; font-variant-numeric: tabular-nums; width: 11.5rem; }
table.lap tr.grup td { font-weight: 800; color: var(--ssb-roast); padding-top: 1rem; text-transform: none; font-size: .98rem; }
table.lap tr.sub td { font-weight: 700; color: var(--ssb-roast); padding-top: .55rem; }
table.lap tr.i1 td:first-child { padding-left: 1.25rem; }
table.lap tr.i2 td:first-child { padding-left: 2.5rem; color: #4A3A2C; }
table.lap tr.i3 td:first-child { padding-left: 3.75rem; color: #6F5A47; font-size: .88rem; }
/* garis akuntansi: satu garis sebelum subtotal, garis ganda di bawah total akhir */
table.lap tr.subtotal td { font-weight: 700; }
table.lap tr.subtotal td.n { border-top: 1px solid var(--ssb-ink); }
table.lap tr.total td { font-weight: 800; color: var(--ssb-roast); padding-top: .45rem; }
table.lap tr.total td.n { border-top: 1px solid var(--ssb-ink); border-bottom: 3px double var(--ssb-ink); }
table.lap tr.hasil td { background: var(--ssb-husk); font-weight: 800; color: var(--ssb-roast); padding: .5rem .5rem; }
table.lap tr.hasil td.n { border-bottom: 3px double var(--ssb-ink); }
table.lap tr.memo td { color: #6F5A47; font-size: .86rem; font-style: italic; }
table.lap .neg { color: var(--ssb-chili); }
.lap-cek { margin-top: 1.25rem; font-size: .85rem; display: flex; gap: .5rem; align-items: center; }
.lap-cek .ok  { color: var(--ssb-water); font-weight: 700; }
.lap-cek .bad { color: var(--ssb-chili); font-weight: 700; }
.lap-catatan { margin-top: 1.5rem; font-size: .8rem; color: #6F5A47; border-top: 1px solid #EFE3D4; padding-top: .75rem; }
.lap-catatan ol { padding-left: 1.1rem; margin: 0; }
.lap-ttd { display: flex; justify-content: flex-end; margin-top: 2.5rem; font-size: .9rem; text-align: center; }
.lap-ttd .garis { margin-top: 3.5rem; border-top: 1px solid var(--ssb-ink); padding-top: .25rem; min-width: 14rem; }

@media (max-width: 640px) {
  .lap-sheet { padding: 1.25rem 1rem; }
  .lap-kop { grid-template-columns: 48px 1fr; }
  .lap-kop img { width: 48px; height: 48px; }
  .lap-kop > div:last-child { display: none; }
  table.lap td.n { width: auto; font-size: .85rem; }
  table.lap tr.i2 td:first-child { padding-left: 1.5rem; }
  table.lap tr.i3 td:first-child { padding-left: 2.25rem; }
}

@media print {
  .ssb-topbar, .no-print, .ssb-toolbar, .alert { display: none !important; }
  body { background: #fff; }
  .ssb-main { padding: 0; }
  .lap-sheet { border: 0; box-shadow: none; padding: 0; max-width: none; }
  table.lap tr.hasil td { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  @page { size: A4 portrait; margin: 1.5cm; }
}

@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }
