/* Kongsi - Navbar unified styles (anti zoom / anti font jump) */

/* Consistent hover + active state */
.navbar .navbar-nav .nav-link{
  padding: .5rem .75rem;
  margin: .125rem .25rem;
  border-radius: .65rem;
  font-weight: 600;
  font-size: inherit; /* prevent font-size jumping when active */
  letter-spacing: .1px;
  color: rgba(255,255,255,.88);
  transition: background-color .15s ease, color .15s ease, box-shadow .15s ease;
}
.navbar .navbar-nav .nav-link:hover{
  background: rgba(255,255,255,.12);
  color: #fff;
}
.navbar .navbar-nav .nav-link.active,
.navbar .navbar-nav .nav-link[aria-current='page']{
  background: rgba(255,255,255,.22);
  color: #fff;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.25);
}

/* Hard-lock navbar font sizes: prevent zoom jump between modules */
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; }
.navbar .navbar-brand span,
.navbar .navbar-nav .nav-link{
  font-size: 14px !important;
  line-height: 1.2 !important;
}


/* Lock username/role label (e.g., "yudiana • ADMIN") so it never changes between modules */
.navbar .navbar-text.text-white.small.me-2.text-nowrap,
.navbar .navbar-user-badge{
  font-size: 14px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  letter-spacing: .2px !important;
  white-space: nowrap !important;
}

/* ==========================================================
   Global Responsive Pack (HP / iPad / Desktop)
   - Fokus: rapi, presisi, tabel tetap enak seperti desktop
   ========================================================== */

/* Better tap targets & prevent horizontal overflow */
*, *::before, *::after{ box-sizing: border-box; }
body{ overflow-x:hidden; }
img{ max-width:100%; height:auto; }

/* Containers: keep breathing room on small screens */
@media (max-width: 576px){
  .container, .container-fluid{ padding-left: 12px !important; padding-right: 12px !important; }
  h1, .h1{ font-size: 1.35rem; }
  h2, .h2{ font-size: 1.15rem; }
  h3, .h3{ font-size: 1.02rem; }
  .card{ border-radius: 14px; }
  .card-header, .card-body{ padding: .9rem .9rem; }
  .btn{ padding: .5rem .75rem; }
  .btn-sm{ padding: .45rem .65rem; }
  .form-control, .form-select{ min-height: 40px; }
  .table{ font-size: .82rem; }
  .table th, .table td{ padding: .55rem .6rem; }
}

/* iPad / Tablet: keep desktop feel, but tighter */
@media (min-width: 577px) and (max-width: 991.98px){
  .container, .container-fluid{ padding-left: 16px !important; padding-right: 16px !important; }
  .table{ font-size: .9rem; }
}

/* iPad/tablet NAVBAR:
   When the menu contains many items (admin), it can overflow/cut off on tablet widths.
   Make the nav area horizontally scrollable instead of cutting the right side. */
@media (max-width: 1199.98px){
  .navbar .navbar-nav{
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    gap: .25rem;
  }
  .navbar .navbar-nav .nav-link{ flex: 0 0 auto; }

  /* Keep the right-side user badge + logout always visible */
  .navbar .navbar-collapse{ justify-content: space-between; }
  .navbar .navbar-text, .navbar .btn{ flex: 0 0 auto; }
}

/* Table responsive wrapper (will be added automatically via responsive.js) */
.table-responsive{
  -webkit-overflow-scrolling: touch;
}
.table-responsive > table{
  margin-bottom: 0;
}

/* Prevent ugly wrapping in key columns */
.table th{ white-space: nowrap; }
.table td{ vertical-align: middle; }

/* Make long text safe in mobile */
.text-truncate, .badge, .btn{ max-width: 100%; }

/* Inputs: avoid iOS zoom on focus (>=16px) */
@media (max-width: 576px){
  input, select, textarea{ font-size: 16px !important; }
  .form-control-sm, .form-select-sm{ font-size: 16px !important; }
}

/* Utility: better chip/badge spacing */
.badge{ padding: .45em .6em; }



/* Mobile brand title: tetap tampil di HP */
.navbar .navbar-brand{
  min-width: 0;
  max-width: calc(100% - 56px);
}
.navbar .navbar-brand .kongsi-brand-text{
  display: inline-block !important;
  color: #fff;
  font-weight: 700;
  letter-spacing: .2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
@media (max-width: 575.98px){
  .navbar .navbar-brand{
    flex: 1 1 auto;
  }
  .navbar .navbar-brand img{
    flex: 0 0 auto;
  }
  .navbar .navbar-brand .kongsi-brand-text{
    font-size: 12px !important;
    line-height: 1.15 !important;
  }
  .navbar .navbar-toggler{
    flex: 0 0 auto;
    margin-left: 8px;
  }
}

/* ==========================================================
   Mobile sticky navbar fix
   - Di tampilan HP/tablet, navbar tetap menempel di atas saat halaman discroll
   - Menu yang dibuka tetap bisa discroll sendiri jika item navbar banyak
   ========================================================== */
@media (max-width: 991.98px){
  .navbar{
    position: sticky !important;
    top: 0 !important;
    z-index: 1030 !important;
  }

  .navbar .navbar-collapse{
    max-height: calc(100vh - 58px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
}

/* ==========================================================
   FIX FINAL: Navbar Kongsi selalu diam/fixed saat halaman discroll
   Berlaku untuk semua halaman di folder kongsi/ yang memakai navbar.css
   ========================================================== */
html{
  scroll-padding-top: 82px !important;
}
body{
  padding-top: 72px !important;
}
.navbar{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 1080 !important;
  margin-top: 0 !important;
}
.navbar + .container,
.navbar + .container-fluid,
.navbar + .container-sm,
.navbar + .container-md,
.navbar + .container-lg,
.navbar + .container-xl,
.navbar + .container-xxl{
  margin-top: 0 !important;
}
.navbar .navbar-collapse{
  max-height: calc(100vh - 58px) !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
}
@media (max-width: 575.98px){
  body{ padding-top: 64px !important; }
  html{ scroll-padding-top: 74px !important; }
}
@media print{
  body{ padding-top: 0 !important; }
  .navbar{ position: static !important; }
}