/* =====================================================
   MOBILE-FIRST BASE
   ===================================================== */
body{font-family:"Source Sans Pro",Helvetica Neue,Helvetica,Arial,sans-serif;font-size:15px;}
.num{font-variant-numeric:tabular-nums;}
a, button{ -webkit-tap-highlight-color:transparent; }
.btn{ min-height:40px; }
.btn-xs{ min-height:32px; padding:.2rem .5rem; }

/* Larger inputs on touch screens (also prevents iOS auto-zoom on focus) */
@media (max-width:767.98px){
  .form-control, select.form-control, .custom-file-label{ font-size:16px; min-height:44px; }
  .btn{ min-height:44px; }
  .content-header h1{ font-size:1.25rem; }
}
@media (min-width:768px){
  body{font-size:14px;}
}

/* =====================================================
   NAVBAR (mobile brand vs desktop toggle)
   ===================================================== */
.navbar-brand-mobile{font-weight:600;color:#1B2A4A;font-size:15px;}
.navbar-brand-mobile i{color:#B9812F;margin-right:6px;}

/* Hide desktop sidebar entirely on mobile — bottom nav takes over */
@media (max-width:767.98px){
  .main-sidebar{ display:none !important; }
  .content-wrapper, .main-footer{ margin-left:0 !important; }
  .content-wrapper{ padding-bottom: calc(64px + env(safe-area-inset-bottom,0px)); }
}

/* =====================================================
   MOBILE BOTTOM TAB BAR
   ===================================================== */
.mobile-bottom-nav{
  position:fixed; left:0; right:0; bottom:0; z-index:1030;
  display:flex; background:#fff; border-top:1px solid #e5e7ec;
  box-shadow:0 -2px 12px rgba(0,0,0,.07);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
.mobile-bottom-nav a{
  flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:3px; padding:8px 4px 7px; color:#8a92a6; text-decoration:none; font-size:10.5px;
}
.mobile-bottom-nav a i{ font-size:18px; }
.mobile-bottom-nav a.active{ color:#1B2A4A; font-weight:600; }
.mobile-bottom-nav a.active i{ color:#B9812F; }

/* =====================================================
   SMALL-BOX SUMMARY WIDGETS
   ===================================================== */
.small-box h3{font-size:20px;}
@media (max-width:575.98px){
  .small-box h3{font-size:16.5px;}
  .small-box p{font-size:11.5px;}
  .small-box .icon{font-size:60px;}
}

/* =====================================================
   BUDGET TREE (mobile-first: stacked, becomes inline on desktop)
   ===================================================== */
.tree{overflow-x:auto;}
.tnode{border-bottom:1px solid #edf0f3;}
.tnode:last-child{border-bottom:none;}
.trow{padding:12px 14px;cursor:pointer;}
.trow:active{background:#f8f9fa;}
.trow-main{display:flex;align-items:center;gap:8px;}
.trow .tw{flex:0 0 14px;color:#adb5bd;font-size:11px;transition:transform .15s;}
.tnode.open>.trow>.trow-main>.tw{transform:rotate(90deg);color:#B9812F;}
.kode-badge{font-size:10.5px;padding:2px 7px;border-radius:5px;background:#f1f3f5;color:#5b6478;border:1px solid #e6e9ec;flex:0 0 auto;white-space:nowrap;font-weight:600;}
.trow .uraian{flex:1 1 auto;font-size:14px;min-width:0;line-height:1.35;}
.trow.lvl-1 .uraian{font-weight:700;color:#1B2A4A;font-size:14.5px;}
.trow.lvl-1{background:#fbfaf6;}
.trow .pctv{flex:0 0 auto;font-size:11.5px;color:#6c757d;font-weight:700;white-space:nowrap;}
.figs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px 8px;margin-top:9px;padding-left:22px;}
.figs-grid .fig .l{font-size:9px;color:#adb5bd;text-transform:uppercase;letter-spacing:.02em;}
.figs-grid .fig .v{font-size:12.5px;font-weight:600;}
.figs-grid .fig.sisa .v{color:#B9812F;font-weight:700;}
.children{display:none;background:#fcfcfc;}
.tnode.open>.children{display:block;}
.children .tnode{margin-left:12px;border-left:2px dashed #e6e9ec;}
.leaf .trow .tw{visibility:hidden;}
.empty-state{padding:50px 16px;text-align:center;color:#8a92a6;}
.empty-state .big{font-size:34px;margin-bottom:10px;}

@media (min-width:768px){
  .trow{display:flex;align-items:center;gap:10px;}
  .trow-main{flex:1 1 auto;min-width:0;}
  .figs-grid{display:flex;gap:16px;margin-top:0;padding-left:0;flex:0 0 auto;}
  .figs-grid .fig{min-width:110px;text-align:right;}
  .trow .pctv{min-width:44px;text-align:right;}
}

/* =====================================================
   FILE HISTORY — CARD LIST (mobile) vs TABLE (desktop)
   ===================================================== */
.file-card-list{padding:10px;}
.file-card{background:#fff;border:1px solid #e9ecef;border-radius:10px;padding:13px 14px;margin-bottom:10px;}
.file-card.is-active{border-color:#B9812F;box-shadow:0 0 0 1px #B9812F inset;}
.file-card-top{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:4px;}
.file-card-name{font-weight:700;font-size:14px;word-break:break-word;color:#1B2A4A;}
.file-card-meta{font-size:11.5px;color:#8a92a6;margin-bottom:11px;line-height:1.5;}
.file-card-figs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:12px;padding:9px 10px;background:#f8f9fb;border-radius:8px;}
.file-card-figs .l{font-size:9.5px;color:#adb5bd;text-transform:uppercase;}
.file-card-figs .v{font-size:12.5px;font-weight:700;}
.file-card-figs .v.sisa{color:#B9812F;}
.file-card-actions{display:flex;gap:8px;flex-wrap:wrap;}
.file-card-actions form{flex:0 0 auto;margin:0;}

/* =====================================================
   LOGIN PAGE
   ===================================================== */
@media (max-width:400px){
  .login-box{width:100%;padding:0 6px;}
}