/* =====================================================================
   SEWAASET — Modern UI overlay (Bootstrap 3 tetap dipakai, tidak diganti)
   Sisi PUBLIK (phpmu-one). File ini di-load PALING TERAKHIR setelah
   bootstrap.min.css, style.css, blue.css, default.css, nivo-slider.css
   supaya override menang lewat urutan cascade tanpa menyentuh file lama.
   Tidak ada id/class yang dihapus — hanya restyle elemen yang sudah ada.
   ===================================================================== */

:root{
  --sw-bg:            #ffffff;
  --sw-surface:       #ffffff;
  --sw-border:        #e5e7eb;
  --sw-border-soft:   #eef0f3;
  --sw-primary:       #2563eb;
  --sw-primary-dark:  #1d4ed8;
  --sw-primary-soft:  #eaf1fe;
  --sw-success:       #16a34a;
  --sw-text:          #111827;
  --sw-text-body:     #374151;
  --sw-text-muted:    #6b7280;
  --sw-radius:        8px;
  --sw-radius-sm:     6px;
  --sw-shadow:        0 1px 3px rgba(16,24,40,.06), 0 1px 2px rgba(16,24,40,.04);
  --sw-shadow-hover:  0 4px 12px rgba(16,24,40,.10);
}

/* ---------- Base / Typography ---------- */
body{
  background-color: var(--sw-bg);
  font-family: "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  color: var(--sw-text-body);
  -webkit-font-smoothing: antialiased;
  font-size: 16px !important;
}
h1, h2, h3, h4, h5, h6{
  color: var(--sw-text);
  font-weight: 600;
}
a{ color: var(--sw-primary); }
a:hover, a:focus{ color: var(--sw-primary-dark); }

.container-content{ padding-top: 18px; padding-bottom: 30px; }

/* Section heading dipakai di SEMUA halaman publik (login, katalog, form, tracking, dst) */
p.sidebar-title{
  border-bottom: 2px solid var(--sw-primary-soft);
  color: var(--sw-text);
  font-weight: 600;
  font-size: 16px;
  letter-spacing: .2px;
  padding-bottom: 8px;
  margin-top: 10px;
  position: relative;
}
p.sidebar-title::after{
  content: "";
  position: absolute;
  left: 0; bottom: -2px;
  width: 46px; height: 2px;
  background: var(--sw-primary);
}

/* ---------- Navbar ---------- */
.head{ background: var(--sw-surface); border-bottom: 1px solid var(--sw-border); }
.navbar{
  background-color: var(--sw-surface) !important;
  border: none;
  border-bottom: 1px solid var(--sw-border);
  box-shadow: 0 1px 2px rgba(16,24,40,.04);
  margin-bottom: 0;
}
/* style.css men-set .navbar-default .navbar-nav>li>a { color:#fff !important; }
   (didesain untuk background navbar coklat lama) -- sekarang background navbar
   putih, jadi teks putih itu harus dipaksa hitam supaya kebaca. */
.navbar-default .navbar-nav > li > a,
.navbar-default .navbar-nav > li > a > span,
.navbar-brand{ color: #000 !important; }
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus{ color: var(--sw-primary) !important; background: transparent; }

.dropdown-menu{ border-radius: var(--sw-radius-sm); border-color: var(--sw-border); box-shadow: var(--sw-shadow-hover); }
.dropdown-menu > li > a{ color: #000 !important; }
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus{ background: var(--sw-primary-soft); color: var(--sw-primary-dark) !important; }
.dropdown-submenu > a{ color: #000 !important; }

/* ---------- Buttons ----------
   style.css men-set `.btn{border-radius:0px !important}` — override butuh !important juga. */
.btn{
  border-radius: var(--sw-radius-sm) !important;
  font-weight: 500;
  padding: 7px 16px;
  transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
  box-shadow: none;
}
.btn-primary{
  background-color: var(--sw-primary) !important;
  border-color: var(--sw-primary) !important;
}
.btn-primary:hover, .btn-primary:focus{
  background-color: var(--sw-primary-dark) !important;
  border-color: var(--sw-primary-dark) !important;
}
.btn-success{ background-color: var(--sw-success); border-color: var(--sw-success); }
.btn-success:hover, .btn-success:focus{ background-color: #128a3e; border-color: #128a3e; }
.btn-default{ background-color: #fff; border-color: var(--sw-border); color: var(--sw-text-body); }
.btn-default:hover, .btn-default:focus{ background-color: #f9fafb; border-color: #d1d5db; }
.btn-block{ margin-bottom: 6px; text-align: left; }

/* blue.css men-style `button, input[type=submit]` secara generik (bg #00a5f9) — kalau
   elemen itu juga punya class .btn, style .btn di atas harus menang: naikkan spesifisitas. */
input[type="submit"].btn,
button.btn,
input.btn{
  background-image: none;
  text-transform: none;
}

/* ---------- Forms ---------- */
.form-control,
input[type="text"], input[type="email"], input[type="password"],
input[type="number"], input[type="tel"], input[type="date"],
textarea, select{
  border: 1px solid var(--sw-border) !important;
  border-radius: var(--sw-radius-sm) !important;
  padding: 8px 12px !important;
  box-shadow: none !important;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.form-control:focus,
input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus,
textarea:focus, select:focus{
  border-color: var(--sw-primary) !important;
  box-shadow: 0 0 0 3px var(--sw-primary-soft) !important;
}
label{ font-weight: 600; color: var(--sw-text); }
label.error{ border-radius: var(--sw-radius-sm); }

/* ---------- Cards / "box" content wrappers ---------- */
.box-sidebar{
  background: var(--sw-surface);
  border: 1px solid var(--sw-border);
  border-radius: var(--sw-radius);
  box-shadow: var(--sw-shadow);
  padding: 20px 18px;
}
.logincontainer{
  background: var(--sw-surface);
  border: 1px solid var(--sw-border);
  border-radius: var(--sw-radius);
  box-shadow: var(--sw-shadow);
  padding: 30px 28px;
}

/* Fix: .box-footer dipakai di view sewa baru tapi tidak pernah didefinisikan di CSS publik */
.box-footer{
  padding-top: 14px;
  margin-top: 14px;
  border-top: 1px solid var(--sw-border-soft);
}

/* ---------- Tables ---------- */
.table{ background: var(--sw-surface); }
.table > thead > tr > th{
  background-color: #f9fafb;
  color: var(--sw-text);
  font-weight: 600;
  border-bottom: 1px solid var(--sw-border) !important;
}
.table > tbody > tr > td,
.table > thead > tr > th{ padding: 10px 12px; vertical-align: middle; }
.table-condensed > tbody > tr > td,
.table-condensed > thead > tr > th{ padding: 8px 10px; }
.table > tbody > tr:hover{ background-color: #f9fafb; }
.table-bordered{ border-color: var(--sw-border); }
.table-bordered > thead > tr > th,
.table-bordered > tbody > tr > td{ border-color: var(--sw-border); }

/* ---------- Katalog aset/produk card ----------
   .produk-col (pembungkus col-sm-3/col-xs-6) masih bawa padding gutter
   bawaan Bootstrap (15px kiri-kanan) -- kalau dibiarkan, ditambah margin
   .produk sendiri, jaraknya jadi dobel dan kelihatan terlalu lebar. Nolkan
   dulu padding bawaan itu, baru atur jarak antar kartu murni lewat margin
   .produk supaya presisi dan tetap kecil/sedikit. */
.produk-col{
  padding-left: 6px !important;
  padding-right: 6px !important;
}
.produk{
  border: 1px solid var(--sw-border) !important;
  border-radius: var(--sw-radius);
  padding: 14px 10px;
  margin: 0 0 20px 0;
  transition: box-shadow .15s ease, transform .15s ease, border-color .15s ease;
  background: var(--sw-surface);
  /* Kartu jadi flex-column supaya tinggi antar kartu dalam 1 baris otomatis
     sama rata (nama produk bisa 1-2 baris berbeda tanpa merusak grid). */
  display: flex;
  flex-direction: column;
  min-height: 0 !important; /* timpa min-height:270px lama dari style.css yang bikin kartu jadi kosong-tinggi */
}
.produk:hover{
  border-color: var(--sw-primary) !important;
  background-color: var(--sw-surface) !important;
  box-shadow: var(--sw-shadow-hover);
  transform: translateY(-2px);
}
.produk a{ display: flex; flex-direction: column; height: 100%; }
/* style.css men-set .normal/.blur { min-height:88px; width:90%; } tanpa tinggi
   tetap -- foto asli (rasio berbeda-beda) jadi punya tinggi berbeda dari foto
   placeholder "images.png", bikin tinggi kartu tidak rata dan grid Bootstrap 3
   (berbasis float) jadi berantakan saat wrap ke baris baru.
   Bungkus foto dalam wrapper ukuran tetap + overflow:hidden supaya semua foto
   (rasio apapun) benar-benar seragam dan tidak pernah bocor keluar kartu --
   lebih tahan browser daripada cuma andalkan border-radius+object-fit di <img>. */
.produk-img-wrap{
  width: 100%;
  height: 130px;
  overflow: hidden;
  border-radius: var(--sw-radius-sm);
  background: #f4f6f9;
}
.produk img.normal,
.produk img.blur,
.produk img{
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  object-fit: cover;
  display: block;
  margin: 0 !important;
}
.produk a p{ height: auto; min-height: 39px; }

/* ---------- Alerts ---------- */
.alert{ border-radius: var(--sw-radius-sm); border: 1px solid transparent; }
.alert-info{ background-color: #eaf1fe; border-color: #d6e4fd; color: #1d4ed8; }
.alert-success{ background-color: #eafaf0; border-color: #cdeedd; color: #157a3c; }
.alert-warning{ background-color: #fff8e6; border-color: #fbe8b8; color: #92650a; }
.alert-danger{ background-color: #fdecec; border-color: #f8caca; color: #b91c1c; }

/* ---------- Labels / badges (status pesanan) ---------- */
.label{ border-radius: 4px; font-weight: 600; padding: .35em .6em; }

/* ---------- Modals ---------- */
.modal-content{ border-radius: var(--sw-radius); border: none; box-shadow: 0 10px 30px rgba(16,24,40,.18); }
.modal-header{ border-bottom: 1px solid var(--sw-border-soft); }
.modal-footer{ border-top: 1px solid var(--sw-border-soft); }

/* ---------- Pagination ---------- */
.pagination > li > a, .pagination > li > span{
  border-color: var(--sw-border);
  color: var(--sw-text-body);
  border-radius: var(--sw-radius-sm) !important;
  margin: 0 2px;
}
.pagination > li > a:hover{ background-color: var(--sw-primary-soft); border-color: var(--sw-primary-soft); color: var(--sw-primary-dark); }
.pagination > .active > a, .pagination > .active > span{
  background-color: var(--sw-primary) !important;
  border-color: var(--sw-primary) !important;
}

/* ---------- Footer ---------- */
footer{ background-color: var(--sw-surface) !important; border-top: 1px solid var(--sw-border) !important; }
.text-footer{ color: var(--sw-text-muted); }

/* ---------- Responsive tweaks ---------- */
@media (max-width: 767px){
  .container-content{ padding-top: 10px; }
  .box-sidebar{ margin-top: 16px; padding: 16px 14px; }
  .produk{ min-height: auto; margin-bottom: 14px; }
  .btn-block{ margin-bottom: 8px; }
  .logincontainer{ padding: 22px 18px; }
}