/* ================================================================
   04-persediaan-stok.css
   Persediaan awal, badge stok, dropdown pemilih barang, stok persediaan AR/AP
   ================================================================ */

  /* ===== PERSEDIAAN AWAL STYLES ===== */
  #persediaan-awal-section { display: none; }
  .stok-summary-grid {
    display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; margin-bottom: 20px;
  }
  @media(max-width:900px) { .stok-summary-grid { grid-template-columns: repeat(2,1fr); } }
  .stok-summary-card {
    border-radius: 14px; padding: 18px 20px; border: 1px solid var(--border);
    background: var(--surface); position: relative; overflow: hidden;
  }
  .stok-summary-card::before { content:''; position:absolute; top:0; left:0; width:4px; height:100%; }
  .stok-card-masuk::before  { background: var(--success); }
  .stok-card-keluar::before { background: var(--danger); }
  .stok-card-nilai::before  { background: var(--gold); }
  .stok-card-sisa::before   { background: var(--info); }
  .stok-summary-label { font-size:11.5px; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:.5px; margin-bottom:4px; }
  .stok-summary-value { font-size:20px; font-weight:700; font-family:'Poppins',sans-serif; color:var(--text); }
  .stok-summary-sub   { font-size:12px; color:var(--muted); margin-top:4px; }

  /* Persediaan row in table */
  .persediaan-row-input {
    width:100%; padding:6px 8px; border:1px solid var(--border); border-radius:6px;
    font-family:inherit; font-size:13px; background:var(--surface); color:var(--text);
    transition:border-color .2s; outline:none;
  }
  .persediaan-row-input:focus { border-color:var(--navy); }

  /* Stok badge */
  .stok-badge-in  { background:var(--badge-success-bg); color:var(--badge-success-fg); padding:2px 8px; border-radius:99px; font-size:11px; font-weight:700; }
  .stok-badge-out { background:var(--badge-danger-bg);  color:var(--badge-danger-fg);  padding:2px 8px; border-radius:99px; font-size:11px; font-weight:700; }
  .stok-badge-ini { background:var(--badge-warn-bg);    color:var(--badge-warn-fg);    padding:2px 8px; border-radius:99px; font-size:11px; font-weight:700; }

  /* Barang picker dropdown in journal */
  .barang-search-wrap { position:relative; }
  /* Sama seperti .akun-search-wrap (lihat 05-akun-piutang-hutang.css) — naikkan
     z-index WRAP saat dropdown-nya terbuka, supaya tidak tertimpa elemen lain
     yang berada lebih belakangan di DOM (mis. tombol/baris di bawahnya). */
  .barang-search-wrap:has(.barang-dropdown.open) { z-index: 9999; }
  .barang-search-input {
    width:100%; padding:9px 13px; border:1.5px solid var(--border); border-radius:8px;
    font-family:inherit; font-size:13px; color:var(--text); background:var(--surface);
    transition:border-color .2s; outline:none;
  }
  .barang-search-input:focus { border-color:var(--navy); }
  .barang-dropdown {
    position:absolute; top:calc(100% + 4px); left:0; right:0;
    background:var(--surface); border:1.5px solid var(--navy);
    border-radius:8px; z-index:9999; max-height:200px; overflow-y:auto;
    box-shadow:0 6px 20px rgba(0,0,0,.15); display:none;
  }
  .barang-dropdown.open { display:block; }
  .barang-opt {
    padding:9px 13px; cursor:pointer; font-size:13px;
    border-bottom:1px solid var(--border); transition:background .15s;
  }
  .barang-opt:last-child { border-bottom:none; }
  .barang-opt:hover { background:var(--hover-row-bg); color:var(--navy); font-weight:600; }
  .barang-opt-sub { font-size:11px; color:var(--muted); margin-top:2px; }
  html[data-theme="dark"] .barang-dropdown { background:var(--surface); border-color:var(--navy); }
  html[data-theme="dark"] .barang-opt:hover { background:var(--hover-row-bg); color:var(--gold); }

  /* STOK PERSEDIAAN AR/AP */
  .stok-ar-ap-section {
    border: 1.5px dashed var(--gold); border-radius: 12px;
    background: var(--surface2); margin-bottom: 20px;
    /* overflow tidak di-hidden supaya dropdown pencarian barang (position:absolute,
       bisa lebih tinggi dari kotak ini) tampil penuh di depan kotak ini, tidak terpotong. */
    overflow: visible;
  }
  .stok-ar-ap-header {
    background: linear-gradient(135deg, rgba(200,149,46,.12) 0%, rgba(200,149,46,.04) 100%);
    border-bottom: 1px solid rgba(200,149,46,.25);
    border-radius: 10.5px 10.5px 0 0;
    padding: 12px 18px; display: flex; align-items: center; gap: 8px;
  }
  .stok-ar-ap-header .stok-ar-ap-title {
    font-size: 12px; font-weight: 700; color: var(--gold);
    text-transform: uppercase; letter-spacing: .5px;
  }
  .stok-ar-ap-body { padding: 14px 18px; }
  .stok-ar-ap-preview {
    margin-top: 12px; padding: 10px 14px; border-radius: 8px;
    background: var(--surface); border: 1px solid var(--border);
    font-size: 12.5px;
  }
  .stok-ar-ap-preview-row {
    display: grid; grid-template-columns: 1fr 120px 120px;
    gap: 8px; align-items: center; padding: 5px 0;
    border-bottom: 1px solid var(--border);
  }
  .stok-ar-ap-preview-row:last-child { border-bottom: none; }
  .stok-ar-ap-preview-header { font-weight: 700; font-size: 11px; color: var(--muted); text-transform: uppercase; }
  .stok-ar-ap-preview-val { font-family: 'Courier New', monospace; text-align: right; font-size: 12.5px; }
  .stok-ar-ap-preview-val.debit { color: var(--danger); font-weight: 700; }
  .stok-ar-ap-preview-val.kredit { color: var(--success); font-weight: 700; }
  .stok-info-bar {
    padding: 8px 12px; border-radius: 7px; font-size: 12px;
    background: var(--badge-info-bg); color: var(--badge-info-fg);
    margin-top: 8px; display: none;
  }
  html[data-theme="dark"] .stok-ar-ap-section { border-color: var(--gold); }
  html[data-theme="dark"] .stok-ar-ap-header { background: rgba(251,191,36,.08); border-bottom-color: rgba(251,191,36,.2); }
  html[data-theme="dark"] .stok-ar-ap-preview { background: var(--surface2); border-color: var(--border); }