/* =========================================================
   WRE SERVICE — UNIFIED UI (design system)
   Dipakai di semua halaman untuk konsistensi visual.
   Warna & style diselaraskan dengan landing page (index.php).
   Tidak mengubah struktur HTML — hanya menyeragamkan tampilan.
   ========================================================= */

:root{
  --wre-blue:#1a3fb8;
  --wre-blue-2:#2f5ee6;
  --wre-blue-3:#5b7dff;
  --wre-red:#e11d2b;
  --wre-red-2:#b8121f;
  --wre-dark:#0f1e3f;
  --wre-ink:#1b2340;
  --wre-muted:#5c6784;
  --wre-line:#e5eaf3;
  --wre-soft:#f4f6fb;
  --wre-soft-2:#eef2fa;
  --wre-white:#ffffff;
  --wre-warn:#f59e0b;
  --wre-warn-2:#d97706;
  --wre-ok:#16a34a;
  --wre-ok-2:#15803d;
  --wre-radius:14px;
  --wre-radius-lg:20px;
  --wre-shadow-sm:0 4px 12px rgba(15,30,63,.06);
  --wre-shadow:0 10px 30px rgba(15,30,63,.08);
  --wre-shadow-lg:0 20px 50px rgba(15,30,63,.14);
  --wre-trans:.2s ease;
}

/* ---- Base ---- */
html,body{ font-family:'Poppins',system-ui,-apple-system,Segoe UI,sans-serif !important; color:var(--wre-ink); -webkit-font-smoothing:antialiased; }
body{ background:var(--wre-soft) !important; }
img{ image-orientation:from-image; }

/* Font hierarchy (tanpa memaksa ukuran spesifik di elemen halaman) */
h1,h2,h3,h4,h5,h6{ color:var(--wre-dark); font-weight:700; letter-spacing:-.2px; }
.text-muted{ color:var(--wre-muted) !important; }

/* ---- Navbar (admin) ---- */
.navbar{
  background:var(--wre-header-grad, linear-gradient(135deg,#1a3fb8,#2f5ee6)) !important;
  box-shadow:0 8px 24px rgba(15,30,63,.12);
  padding-top:12px; padding-bottom:12px;
}
.navbar .navbar-brand,
.navbar .nav-link,
.navbar-dark .navbar-brand,
.navbar-dark .nav-link{ color:#fff !important; font-weight:600; }
.navbar .nav-link:hover{ opacity:.9; }
.navbar .btn-outline-light{ border-radius:10px; font-weight:600; }

/* ---- Cards ---- */
.card{
  background:#fff;
  border:1px solid var(--wre-line) !important;
  border-radius:var(--wre-radius-lg) !important;
  box-shadow:var(--wre-shadow-sm);
  transition:box-shadow var(--wre-trans), transform var(--wre-trans);
}
.card:hover{ box-shadow:var(--wre-shadow); }
.card-header{
  background:#fff !important;
  border-bottom:1px solid var(--wre-line) !important;
  border-top-left-radius:var(--wre-radius-lg) !important;
  border-top-right-radius:var(--wre-radius-lg) !important;
  font-weight:700;
  color:var(--wre-dark);
  padding:16px 20px;
}
.card-body{ padding:20px; }
.card-footer{ background:#fafbfe !important; border-top:1px solid var(--wre-line) !important; }

/* Stat card (dashboard) */
.stat-card{
  border-radius:var(--wre-radius-lg) !important;
  padding:22px 20px;
  color:#fff;
  min-height:138px;
  box-shadow:var(--wre-shadow);
  transition:transform var(--wre-trans), box-shadow var(--wre-trans);
}
.stat-card:hover{ transform:translateY(-3px); box-shadow:var(--wre-shadow-lg); }
.stat-card h2{ color:#fff; font-weight:800; font-size:2.4rem; margin:0 0 4px; }
.stat-card p{ margin:0; opacity:.95; font-weight:500; }
.bg-blue   { background:linear-gradient(135deg,#2f5ee6,#1a3fb8) !important; }
.bg-orange { background:linear-gradient(135deg,#ffb300,#ff8f00) !important; }
.bg-green  { background:linear-gradient(135deg,#22c55e,#16a34a) !important; }
.bg-red    { background:linear-gradient(135deg,#ef4444,#dc2626) !important; }
.bg-purple { background:linear-gradient(135deg,#8b5cf6,#6d28d9) !important; }
.bg-teal   { background:linear-gradient(135deg,#14b8a6,#0f766e) !important; }

/* ---- Buttons (seragamkan tinggi, radius, hover) ---- */
.btn{
  border-radius:12px !important;
  font-weight:600 !important;
  padding:10px 20px;
  transition:transform var(--wre-trans), box-shadow var(--wre-trans), background var(--wre-trans), color var(--wre-trans);
  border:1.5px solid transparent;
  letter-spacing:.1px;
}
.btn-sm{ padding:6px 12px; font-size:.82rem; border-radius:10px !important; }
.btn-lg{ padding:14px 26px; font-size:1rem; }
.btn:hover{ transform:translateY(-1px); }
.btn:focus, .btn:focus-visible{ box-shadow:0 0 0 3px rgba(47,94,230,.2) !important; outline:none; }

.btn-primary{
  background:linear-gradient(135deg,var(--wre-blue-2),var(--wre-blue)) !important;
  border-color:transparent !important;
  color:#fff !important;
}
.btn-primary:hover{ box-shadow:0 10px 24px rgba(26,63,184,.35); filter:brightness(1.03); }

.btn-danger{
  background:var(--wre-red) !important;
  border-color:var(--wre-red) !important;
  color:#fff !important;
}
.btn-danger:hover{ background:var(--wre-red-2) !important; box-shadow:0 10px 24px rgba(225,29,43,.35); }

.btn-success{
  background:linear-gradient(135deg,#22c55e,#16a34a) !important;
  border-color:transparent !important;
  color:#fff !important;
}
.btn-success:hover{ box-shadow:0 10px 24px rgba(22,163,74,.3); filter:brightness(1.03); }

.btn-warning{
  background:linear-gradient(135deg,#fbbf24,#f59e0b) !important;
  border-color:transparent !important;
  color:#1b2340 !important;
}
.btn-warning:hover{ box-shadow:0 10px 24px rgba(245,158,11,.3); filter:brightness(1.03); }

.btn-secondary{
  background:#eef1f7 !important;
  border-color:#e2e6ee !important;
  color:var(--wre-dark) !important;
}
.btn-secondary:hover{ background:#e4e9f3 !important; }

.btn-outline-primary{
  background:transparent !important;
  border-color:var(--wre-blue) !important;
  color:var(--wre-blue) !important;
}
.btn-outline-primary:hover{ background:var(--wre-blue) !important; color:#fff !important; }

.btn-outline-danger{
  background:transparent !important;
  border-color:var(--wre-red) !important;
  color:var(--wre-red) !important;
}
.btn-outline-danger:hover{ background:var(--wre-red) !important; color:#fff !important; }

.btn-outline-secondary{
  background:transparent !important;
  border-color:#cfd6e4 !important;
  color:var(--wre-dark) !important;
}
.btn-outline-secondary:hover{ background:#eef1f7 !important; color:var(--wre-dark) !important; }

.btn-info{ background:linear-gradient(135deg,#38bdf8,#0284c7) !important; border:none !important; color:#fff !important; }
.btn-dark{ background:var(--wre-dark) !important; border:none !important; color:#fff !important; }
.btn-light{ background:#fff !important; border:1.5px solid var(--wre-line) !important; color:var(--wre-dark) !important; }

/* ---- Forms ---- */
.form-label{ font-weight:600; color:var(--wre-dark); margin-bottom:6px; font-size:.9rem; }
.form-control, .form-select, .input-group-text{
  border:1.5px solid var(--wre-line) !important;
  border-radius:12px !important;
  padding:.65rem .9rem;
  font-family:inherit;
  font-size:.95rem;
  color:var(--wre-ink);
  background:#fff;
  transition:border-color var(--wre-trans), box-shadow var(--wre-trans);
}
.form-control:focus, .form-select:focus{
  border-color:var(--wre-blue-2) !important;
  box-shadow:0 0 0 3px rgba(47,94,230,.15) !important;
  outline:none;
}
.form-control::placeholder{ color:#9aa4bb; }
.input-group-text{ background:#f4f6fb; color:var(--wre-muted); }
.form-check-input:checked{ background-color:var(--wre-blue) !important; border-color:var(--wre-blue) !important; }
textarea.form-control{ min-height:110px; }

/* ---- Tables ---- */
.table{ --bs-table-hover-bg:rgba(47,94,230,.06); color:var(--wre-ink); }
.table > :not(caption) > * > *{ padding:.85rem .9rem; vertical-align:middle; }
.table thead th{
  background:var(--wre-header-grad, linear-gradient(135deg,#1a3fb8,#2f5ee6)) !important;
  color:#fff !important;
  font-weight:600;
  font-size:.85rem;
  letter-spacing:.3px;
  text-transform:uppercase;
  border:none !important;
}
.table tbody tr{ transition:background var(--wre-trans); }
.table tbody tr:hover{ background:rgba(47,94,230,.06) !important; }
.table-striped > tbody > tr:nth-of-type(odd) > *{ background-color:#fafbfe !important; }
.table-responsive{ border-radius:var(--wre-radius); overflow:hidden; }

/* ---- Badges ---- */
.badge{
  font-weight:600 !important;
  font-size:.75rem !important;
  padding:.4em .75em !important;
  border-radius:999px !important;
  letter-spacing:.2px;
}
.badge.bg-primary  { background:var(--wre-blue) !important; }
.badge.bg-secondary{ background:#94a3b8 !important; }
.badge.bg-success  { background:var(--wre-ok) !important; }
.badge.bg-danger   { background:var(--wre-red) !important; }
.badge.bg-warning  { background:var(--wre-warn) !important; color:#1b2340 !important; }
.badge.bg-info     { background:#0ea5e9 !important; }
.badge.bg-dark     { background:var(--wre-dark) !important; }

/* ---- Alerts ---- */
.alert{
  border:none !important;
  border-radius:var(--wre-radius) !important;
  padding:14px 18px;
  font-weight:500;
  border-left:4px solid transparent !important;
}
.alert-primary{ background:#eaf0ff !important; color:var(--wre-blue) !important; border-left-color:var(--wre-blue) !important; }
.alert-success{ background:#e8f7ee !important; color:#166534 !important; border-left-color:var(--wre-ok) !important; }
.alert-danger { background:#fdecee !important; color:#991b1b !important; border-left-color:var(--wre-red) !important; }
.alert-warning{ background:#fff4e0 !important; color:#92400e !important; border-left-color:var(--wre-warn) !important; }
.alert-info   { background:#e6f4fb !important; color:#075985 !important; border-left-color:#0ea5e9 !important; }

/* ---- Modal ---- */
.modal-content{
  border:none !important;
  border-radius:var(--wre-radius-lg) !important;
  box-shadow:var(--wre-shadow-lg);
  overflow:hidden;
}
.modal-header{
  background:var(--wre-header-grad, linear-gradient(135deg,#1a3fb8,#2f5ee6)) !important;
  color:#fff !important;
  border-bottom:none !important;
  padding:16px 20px;
}
.modal-header .btn-close{ filter:invert(1) brightness(2); }
.modal-title{ color:#fff; font-weight:700; }
.modal-body{ padding:20px; }
.modal-footer{ border-top:1px solid var(--wre-line) !important; padding:14px 20px; }

/* ---- Dropdown ---- */
.dropdown-menu{
  border:1px solid var(--wre-line) !important;
  border-radius:var(--wre-radius) !important;
  box-shadow:var(--wre-shadow);
  padding:6px;
}
.dropdown-item{ border-radius:10px; padding:.55rem .8rem; font-weight:500; }
.dropdown-item:hover, .dropdown-item:focus{ background:var(--wre-soft-2); color:var(--wre-blue); }
.dropdown-item.active{ background:var(--wre-blue) !important; color:#fff !important; }

/* ---- Accordion ---- */
.accordion-item{
  border:1px solid var(--wre-line) !important;
  border-radius:var(--wre-radius) !important;
  overflow:hidden;
  margin-bottom:10px;
  background:#fff;
}
.accordion-button{
  background:#fff !important;
  color:var(--wre-dark) !important;
  font-weight:600;
  padding:14px 18px;
  border:none !important;
  box-shadow:none !important;
}
.accordion-button:not(.collapsed){
  background:linear-gradient(135deg,rgba(47,94,230,.08),rgba(26,63,184,.06)) !important;
  color:var(--wre-blue) !important;
}
.accordion-button:focus{ box-shadow:0 0 0 3px rgba(47,94,230,.15) !important; }
.accordion-body{ padding:16px 18px; background:#fafbfe; }

/* ---- Pagination ---- */
.pagination .page-link{
  color:var(--wre-blue);
  border:1px solid var(--wre-line);
  margin:0 3px;
  border-radius:10px !important;
  padding:.45rem .8rem;
  font-weight:600;
}
.pagination .page-link:hover{ background:var(--wre-soft-2); color:var(--wre-blue); }
.pagination .page-item.active .page-link{
  background:var(--wre-blue) !important; border-color:var(--wre-blue) !important; color:#fff !important;
}
.pagination .page-item.disabled .page-link{ color:#94a3b8; }

/* ---- Nav pills / tabs ---- */
.nav-pills .nav-link{ border-radius:10px; font-weight:600; color:var(--wre-dark); }
.nav-pills .nav-link.active{ background:var(--wre-blue) !important; color:#fff !important; }
.nav-tabs .nav-link{ color:var(--wre-muted); font-weight:600; border:none; border-bottom:2px solid transparent; }
.nav-tabs .nav-link.active{ color:var(--wre-blue); background:transparent; border-bottom-color:var(--wre-blue); }

/* ---- List group ---- */
.list-group-item{ border-color:var(--wre-line); padding:.85rem 1rem; }
.list-group-item.active{ background:var(--wre-blue) !important; border-color:var(--wre-blue) !important; }

/* ---- Utility (spacing helper) ---- */
.container, .container-fluid{ max-width:1200px; }
.page-title{ font-weight:700; margin:24px 0 18px; color:var(--wre-dark); }
.soft-shadow{ box-shadow:var(--wre-shadow-sm); }
.rounded-xl{ border-radius:var(--wre-radius-lg) !important; }

/* Hero band tipis untuk sub-header halaman */
.wre-band{
  background:var(--wre-header-grad, linear-gradient(135deg,#1a3fb8,#2f5ee6));
  color:#fff;
  padding:24px 20px;
  border-radius:var(--wre-radius-lg);
  box-shadow:var(--wre-shadow);
  margin-bottom:22px;
}
.wre-band h1,.wre-band h2,.wre-band h3{ color:#fff; margin:0 0 4px; }
.wre-band p{ margin:0; opacity:.92; }

/* Menu shortcut card (dashboard) */
.menu-card{ padding:12px; }
.menu-card a{
  display:flex; align-items:center; gap:14px;
  text-decoration:none; color:var(--wre-dark);
  padding:14px 16px; border-radius:14px; margin-bottom:10px;
  transition:background var(--wre-trans), transform var(--wre-trans);
  font-weight:600; background:#f6f8fd;
}
.menu-card a:hover{ background:#e8f0ff; color:var(--wre-blue); transform:translateX(4px); }
.menu-card a i{ font-size:1.15rem; }

/* Icon alignment inside buttons */
.btn i.bi{ vertical-align:-.05em; }

/* Responsive nudges */
@media (max-width:768px){
  .card-body{ padding:16px; }
  .card-header{ padding:14px 16px; }
  .stat-card{ min-height:110px; padding:18px; }
  .stat-card h2{ font-size:2rem; }
  .table > :not(caption) > * > *{ padding:.7rem .55rem; font-size:.9rem; }
  .btn{ padding:9px 16px; }
  .navbar-brand{ font-size:1rem; }
}

/* =========================================================
   WRE PREMIUM LAYER v3 — mengangkat seluruh tampilan agar
   konsisten dengan generate_resi.php (super premium, seirama).
   Ditambahkan sebagai layer terakhir supaya menang cascade.
   ========================================================= */

/* Background halaman: aurora gradient halus */
body{
  background:
    radial-gradient(1200px 500px at -10% -20%, rgba(47,94,230,.10), transparent 60%),
    radial-gradient(900px 400px at 110% 0%, rgba(225,29,43,.08), transparent 60%),
    linear-gradient(180deg,#eef2fa 0%, #f4f6fb 100%) !important;
  min-height:100vh;
}

/* Card upgrade — head bergradasi tipis + ikon aksen */
.card{
  border-radius:20px !important;
  box-shadow:0 10px 30px rgba(15,30,63,.08) !important;
  overflow:hidden;
}
.card-header{
  background:linear-gradient(180deg,#fafbff,#ffffff) !important;
  padding:18px 22px !important;
  font-weight:700; letter-spacing:-.2px;
  color:var(--wre-dark) !important;
  border-bottom:1px solid var(--wre-line) !important;
}
.card-body{ padding:22px !important; }

/* Buttons premium (auto untuk btn-primary, btn-success, btn-danger) */
.btn{ border-radius:14px !important; font-weight:600; letter-spacing:.2px; transition:.2s; }
.btn-primary, .btn-info{
  background:linear-gradient(120deg,var(--wre-blue) 0%, var(--wre-blue-2) 60%, var(--wre-red) 130%) !important;
  border:0 !important; color:#fff !important;
  box-shadow:0 12px 28px rgba(47,94,230,.32);
}
.btn-primary:hover, .btn-info:hover{
  transform:translateY(-1px);
  box-shadow:0 18px 40px rgba(47,94,230,.42) !important;
  color:#fff !important;
}
.btn-success{
  background:linear-gradient(135deg,#16a34a 0%, #22c55e 100%) !important;
  border:0 !important; color:#fff !important;
  box-shadow:0 12px 28px rgba(22,163,74,.32);
}
.btn-success:hover{ transform:translateY(-1px); box-shadow:0 18px 40px rgba(22,163,74,.42) !important; color:#fff !important; }
.btn-danger{
  background:linear-gradient(135deg,var(--wre-red) 0%, var(--wre-red-2) 100%) !important;
  border:0 !important; color:#fff !important;
  box-shadow:0 12px 28px rgba(225,29,43,.30);
}
.btn-danger:hover{ transform:translateY(-1px); box-shadow:0 18px 40px rgba(225,29,43,.40) !important; color:#fff !important; }
.btn-warning{
  background:linear-gradient(135deg,#f59e0b 0%, #d97706 100%) !important;
  border:0 !important; color:#fff !important;
  box-shadow:0 12px 28px rgba(245,158,11,.30);
}
.btn-warning:hover{ color:#fff !important; transform:translateY(-1px); }
.btn-secondary{
  background:#fff !important; color:var(--wre-dark) !important;
  border:1.5px solid var(--wre-line) !important;
}
.btn-secondary:hover{ background:#f4f6fb !important; color:var(--wre-blue) !important; border-color:var(--wre-blue-2) !important; }
.btn-outline-primary{
  border:1.5px dashed var(--wre-blue-2) !important; color:var(--wre-blue) !important; background:#fff !important;
}
.btn-outline-primary:hover{ background:linear-gradient(120deg, rgba(47,94,230,.08), rgba(225,29,43,.06)) !important; color:var(--wre-blue) !important; }

/* Form controls premium */
.form-control, .form-select, .form-control-lg, textarea.form-control{
  border:1.5px solid var(--wre-line) !important;
  border-radius:12px !important;
  padding:11px 14px !important;
  font-size:14px !important;
  background:#fbfcfe !important;
  transition:.18s;
}
.form-control:focus, .form-select:focus{
  border-color:var(--wre-blue-2) !important;
  background:#fff !important;
  box-shadow:0 0 0 4px rgba(47,94,230,.14) !important;
}
.form-label{ font-weight:600 !important; color:var(--wre-dark); font-size:13.5px; margin-bottom:6px; }
.input-group-text{
  background:#f4f6fb !important;
  border:1.5px solid var(--wre-line) !important;
  color:var(--wre-muted) !important;
  border-radius:12px !important;
}

/* Table premium */
.table{ border-collapse:separate !important; border-spacing:0; }
.table > thead > tr > th{
  background:linear-gradient(180deg,#f4f6fb,#eef2fa) !important;
  color:var(--wre-dark) !important;
  font-weight:700 !important;
  border-bottom:2px solid var(--wre-line) !important;
  font-size:13px; letter-spacing:.3px; text-transform:uppercase;
}
.table > tbody > tr:hover{ background:linear-gradient(90deg, rgba(47,94,230,.04), transparent) !important; }
.table-responsive{ border-radius:16px; }

/* Alert premium */
.alert{ border:0 !important; border-radius:14px !important; font-weight:500; }
.alert-success{ background:#e8f8ee !important; color:#0f5f2d !important; border-left:4px solid #16a34a !important; }
.alert-danger{ background:#fff2f3 !important; color:#7a0f19 !important; border-left:4px solid var(--wre-red) !important; }
.alert-warning{ background:#fff7e6 !important; color:#7a4a08 !important; border-left:4px solid #f59e0b !important; }
.alert-info{ background:#eef4ff !important; color:#0f2e73 !important; border-left:4px solid var(--wre-blue-2) !important; }

/* Modal premium */
.modal-content{ border:0 !important; border-radius:22px !important; overflow:hidden; box-shadow:0 30px 80px rgba(15,30,63,.28) !important; }
.modal-header{
  background:var(--wre-header-grad, linear-gradient(135deg,#1a3fb8,#2f5ee6,#e11d2b)) !important;
  color:#fff !important; border-bottom:0 !important; padding:18px 22px !important;
}
.modal-header .modal-title{ color:#fff !important; font-weight:700; }
.modal-header .btn-close{ filter:invert(1) brightness(2); opacity:.9; }
.modal-body{ padding:22px !important; }

/* Badge premium */
.badge{ font-weight:600; letter-spacing:.2px; padding:.45em .7em; border-radius:8px; }

/* Utility premium (dipakai di halaman terpilih) */
.page-hero{
  position:relative;
  background:var(--wre-header-grad, linear-gradient(135deg,#1a3fb8,#2f5ee6,#e11d2b));
  border-radius:24px; padding:26px 28px; color:#fff;
  box-shadow:0 20px 50px rgba(15,30,63,.22);
  overflow:hidden; margin-bottom:22px;
}
.page-hero::before{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(600px 200px at 90% -20%, rgba(255,255,255,.25), transparent 60%),
    radial-gradient(300px 200px at 10% 120%, rgba(255,255,255,.18), transparent 60%);
  pointer-events:none;
}
.page-hero > *{ position:relative; z-index:1; }
.page-hero h1,.page-hero h2,.page-hero h3,.page-hero h4{ color:#fff !important; font-weight:800; letter-spacing:-.5px; margin:6px 0 4px; }
.page-hero p{ color:rgba(255,255,255,.92) !important; margin:0; }
.page-hero .hero-badge{
  display:inline-flex; align-items:center; gap:8px;
  background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.28);
  padding:6px 12px; border-radius:999px; font-size:12px; font-weight:600; letter-spacing:.3px;
  backdrop-filter:blur(6px); color:#fff;
}
.btn-hero-back, .page-hero .btn-outline-light{
  background:rgba(255,255,255,.14) !important; color:#fff !important;
  border:1px solid rgba(255,255,255,.35) !important;
  border-radius:12px !important; padding:9px 14px !important; font-weight:600;
  backdrop-filter:blur(6px);
}
.btn-hero-back:hover, .page-hero .btn-outline-light:hover{
  background:#fff !important; color:var(--wre-blue) !important; border-color:#fff !important;
}

.premium-card{
  background:#fff; border-radius:20px; border:1px solid var(--wre-line);
  box-shadow:0 10px 30px rgba(15,30,63,.08); overflow:hidden;
}
.premium-card .card-head{
  padding:18px 24px; border-bottom:1px solid var(--wre-line);
  display:flex; align-items:center; gap:12px;
  background:linear-gradient(180deg,#fafbff,#ffffff);
}
.premium-card .card-head .ic{
  width:38px; height:38px; border-radius:11px; display:grid; place-items:center; color:#fff;
  background:linear-gradient(135deg,var(--wre-blue),var(--wre-blue-2));
  box-shadow:0 6px 16px rgba(47,94,230,.35);
}
.premium-card .card-head h5{ margin:0; font-weight:700; letter-spacing:-.2px; }
.premium-card .card-head small{ color:var(--wre-muted); }
.premium-card .card-body-p{ padding:24px; }

.section-title{
  display:flex; align-items:center; gap:10px;
  font-weight:700; color:var(--wre-dark);
  font-size:13px; text-transform:uppercase; letter-spacing:.8px;
  margin:6px 0 14px;
}
.section-title .dot{ width:6px; height:6px; border-radius:50%; background:var(--wre-red); }

.input-with-icon{ position:relative; }
.input-with-icon .form-control{ padding-left:40px !important; }
.input-with-icon > i{
  position:absolute; left:14px; top:50%; transform:translateY(-50%);
  color:var(--wre-blue-2); font-size:16px; pointer-events:none; z-index:2;
}

.btn-primary-wre{
  background:var(--wre-header-grad, linear-gradient(135deg,#1a3fb8,#2f5ee6,#e11d2b)) !important;
  border:0; color:#fff !important; border-radius:14px; padding:14px 18px; font-weight:700; letter-spacing:.3px;
  box-shadow:0 14px 30px rgba(47,94,230,.35); transition:.2s;
}
.btn-primary-wre:hover{ transform:translateY(-1px); box-shadow:0 18px 40px rgba(47,94,230,.45); color:#fff !important; }

.awb-chip{
  display:inline-block; background:linear-gradient(135deg,#f4f6fb,#eef2fa);
  border:1.5px dashed var(--wre-blue-2); border-radius:14px; padding:16px 22px;
  font-size:22px; font-weight:800; color:var(--wre-dark); letter-spacing:1.5px; font-family:'Poppins',monospace;
}

/* Login page premium */
body.login-bg, .login-wrap{
  background:var(--wre-header-grad, linear-gradient(135deg,#1a3fb8,#2f5ee6,#e11d2b)) !important;
}

/* Responsive premium */
@media (max-width:576px){
  .page-hero{ padding:20px 18px; border-radius:18px; }
  .page-hero h1{ font-size:20px; }
  .card-body{ padding:16px !important; }
  .btn{ padding:10px 14px; }
  .awb-chip{ font-size:18px; padding:12px 16px; letter-spacing:1px; }
}


/* ===== THEME HEADER (ikuti settings.json / data-header-theme) ===== */
.page-hero,
.page-header,
.wre-header,
.dash-header,
.unified-header,
.uh,
.detail-sticky-bar,
.wre-band,
.wre-faq-head,
.navbar,
.modal-header {
  background: var(--wre-header-grad) !important;
}