/* ============================================================================
   EASYTECH — Tema IT / Software Store untuk Ordermu Store
   File    : components/css/easytech.css
   Dimuat  : hanya oleh views/template/easytech/master.php
   Catatan : semua rule diprefiks `body.et-theme` supaya tidak membocorkan gaya
             ke template default / elegant. `!important` dipakai untuk menimpa
             inline-style yang ditulis di markup (header, kartu produk, dsb).
   Palet   : navy #0a1633 · indigo #2b4ce3 · cyan #22d3ee · bg #f5f7fc
   ========================================================================= */

:root{
  --et-navy:#0a1633;
  --et-navy-2:#12224a;
  --et-indigo:#2b4ce3;
  --et-indigo-2:#4f46e5;
  --et-cyan:#22d3ee;
  --et-bg:#f4f6fc;
  --et-card:#ffffff;
  --et-line:#e6ebf5;
  --et-ink:#0f172a;
  --et-muted:#64748b;
  --et-green:#16a34a;
  --et-radius:16px;
  --et-shadow:0 6px 22px rgba(15,23,42,.07);
  --et-shadow-lg:0 18px 44px rgba(43,76,227,.20);
}

/* ---------------------------------------------------------------- dasar ---- */
body.et-theme{
  background:var(--et-bg) !important;
  color:var(--et-ink);
  font-family:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif !important;
  -webkit-font-smoothing:antialiased;
}
body.et-theme .app{ background:transparent !important; }
body.et-theme .main-content{ background:transparent !important; }
body.et-theme h1,body.et-theme h2,body.et-theme h3,
body.et-theme h4,body.et-theme h5,body.et-theme h6{ font-family:inherit !important; }
body.et-theme a{ transition:color .18s ease,background-color .18s ease; }

/* --------------------------------------------------------------- header ---- */
body.et-theme .header.navbar,
body.et-theme .header.navbar[class*="bg-gradient"]{
  background:linear-gradient(115deg,var(--et-navy) 0%,#16295c 46%,var(--et-indigo-2) 100%) !important;
  border:0 !important;
  box-shadow:0 10px 30px rgba(10,22,51,.28) !important;
}
body.et-theme .header .top-header-front,
body.et-theme .header .top-header-front[class*="bg-gradient"]{
  background:transparent !important;
}
body.et-theme .header .top-header-front > div{ background:rgba(255,255,255,.06) !important; }
body.et-theme .top-nav-left,
body.et-theme .top-nav-right{ color:#cbd5e1 !important; }
body.et-theme .top-nav-left a,
body.et-theme .top-nav-right a{ color:#e2e8f0 !important; }
body.et-theme .top-nav-left a:hover,
body.et-theme .top-nav-right a:hover{ color:var(--et-cyan) !important; }

body.et-theme .header-front{
  background:linear-gradient(115deg,rgba(10,22,51,.92),rgba(43,76,227,.92)) !important;
  padding:6px 0 10px !important;
}
body.et-theme .header-front .nav>li>a,
body.et-theme .main-panel>.header .nav>li>a{ color:#fff !important; }
body.et-theme .brand,
body.et-theme .brand[class*="bg-gradient"]{ background:rgba(8,17,40,.55) !important; }
body.et-theme .brand span,
body.et-theme .brand a{ color:#fff !important; }

/* logo dibingkai rapi */
body.et-theme .header-front img[alt="gambar.jpg"]{
  background:#fff; padding:6px 10px; border-radius:12px;
  box-shadow:0 6px 18px rgba(0,0,0,.18);
}

/* pencarian gaya pill */
body.et-theme .search_produk{
  height:46px !important;
  border:0 !important;
  border-radius:999px 0 0 999px !important;
  box-shadow:none !important;
  padding-left:22px !important;
  font-size:14px !important;
  background:#fff !important;
}
body.et-theme .form-search-produk{ margin:0 !important; }
body.et-theme .input-group > .input-group-btn:last-child > .btn,
body.et-theme .input-group .search_produk + .input-group-btn > .btn{
  height:46px !important;
  border-radius:0 999px 999px 0 !important;
  background:linear-gradient(120deg,var(--et-indigo),var(--et-cyan)) !important;
  color:#fff !important;
  border:0 !important;
  padding:0 24px !important;
}
body.et-theme .count_prodincart{
  background:var(--et-cyan) !important; color:#06213a !important;
  font-weight:800 !important; border-radius:999px !important; padding:0 6px !important;
}

/* ------------------------------------------------------------- hero band ---- */
body.et-theme .et-hero{
  position:relative;
  border-radius:26px;
  overflow:hidden;
  padding:52px 46px 44px;
  margin:0 0 26px;
  color:#fff;
  background:
    radial-gradient(900px 320px at 88% -10%,rgba(34,211,238,.30),transparent 60%),
    radial-gradient(700px 300px at 8% 110%,rgba(79,70,229,.55),transparent 62%),
    linear-gradient(118deg,#081227 0%,#12224a 48%,#243f9e 100%);
  box-shadow:0 24px 60px rgba(10,22,51,.30);
}
body.et-theme .et-hero:before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);
  background-size:44px 44px;
  mask-image:linear-gradient(180deg,#000,transparent 85%);
  -webkit-mask-image:linear-gradient(180deg,#000,transparent 85%);
}
body.et-theme .et-hero-inner{ position:relative;z-index:2;max-width:760px; }
body.et-theme .et-eyebrow{
  display:inline-block;
  font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:700;
  color:#7ff0ff;
  background:rgba(34,211,238,.12);
  border:1px solid rgba(34,211,238,.35);
  border-radius:999px;padding:7px 16px;margin-bottom:20px;
}
body.et-theme .et-hero h1{
  font-size:40px;line-height:1.18;font-weight:800;margin:0 0 16px;color:#fff;
  letter-spacing:-.4px;
}
body.et-theme .et-hero h1 .et-grad{
  background:linear-gradient(100deg,#7ff0ff,#a5b4fc 70%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
body.et-theme .et-hero p.et-lead{
  font-size:15.5px;line-height:1.75;color:#c7d3ea;margin:0 0 28px;max-width:640px;
}
body.et-theme .et-hero-cta{ display:flex;flex-wrap:wrap;gap:12px;margin-bottom:34px; }
body.et-theme .et-btn{
  display:inline-flex;align-items:center;gap:9px;
  border-radius:999px;padding:14px 30px;
  font-size:13px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;
  text-decoration:none !important;border:1px solid transparent;
}
body.et-theme .et-btn-primary{
  background:linear-gradient(100deg,var(--et-cyan),#6ea8ff);
  color:#04122b !important;box-shadow:0 12px 30px rgba(34,211,238,.35);
}
body.et-theme .et-btn-ghost{ background:rgba(255,255,255,.07);color:#fff !important;border-color:rgba(255,255,255,.30); }
body.et-theme .et-btn:hover{ transform:translateY(-2px); }
body.et-theme .et-stats{ display:flex;flex-wrap:wrap;gap:34px;border-top:1px solid rgba(255,255,255,.14);padding-top:24px; }
body.et-theme .et-stat b{ display:block;font-size:26px;font-weight:800;color:#fff;line-height:1.1; }
body.et-theme .et-stat span{ font-size:11.5px;letter-spacing:.10em;text-transform:uppercase;color:#9fb2d4; }

/* strip keunggulan layanan */
body.et-theme .et-trust{
  display:flex;flex-wrap:wrap;gap:14px;margin:0 0 26px;
}
body.et-theme .et-trust-item{
  flex:1 1 200px;display:flex;align-items:flex-start;gap:12px;
  background:#fff;border:1px solid var(--et-line);border-radius:var(--et-radius);
  padding:16px 18px;box-shadow:var(--et-shadow);
}
body.et-theme .et-trust-item i{
  font-size:16px;color:var(--et-indigo);
  background:rgba(43,76,227,.09);border-radius:10px;padding:9px 11px;line-height:1;
}
body.et-theme .et-trust-item b{ display:block;font-size:13px;color:var(--et-ink);margin-bottom:2px; }
body.et-theme .et-trust-item small{ color:var(--et-muted);font-size:11.5px;line-height:1.5; }

/* judul seksi */
body.et-theme .et-section-head{
  display:flex;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;gap:10px;
  margin:4px 0 16px;
}
body.et-theme .et-section-head h2{
  font-size:21px;font-weight:800;margin:0;color:var(--et-ink);letter-spacing:-.2px;
}
body.et-theme .et-section-head h2 i{ color:var(--et-indigo);margin-right:8px; }
body.et-theme .et-section-head small{ color:var(--et-muted);font-size:12.5px; }

/* batang hijau kecil di kiri judul */
body.et-theme .et-section-head h2:before{
  content:"";display:inline-block;width:4px;height:19px;border-radius:4px;
  background:linear-gradient(180deg,var(--et-cyan),var(--et-indigo));
  margin-right:11px;vertical-align:-3px;
}

/* --------------------------------------------------------- sidebar kategori - */
body.et-theme .col-md-3 #list_kategori{
  display:flex;align-items:center;gap:10px;
  font-size:14px !important;font-weight:700;color:var(--et-ink) !important;
  background:#fff !important;border:1px solid var(--et-line) !important;
  border-radius:14px !important;padding:13px 16px !important;margin-bottom:12px;
  box-shadow:var(--et-shadow);
}
body.et-theme .col-md-3 .list-group-item{
  border:1px solid var(--et-line) !important;
  background:#fff !important;border-radius:12px !important;
  margin-bottom:8px;padding:11px 14px !important;
  color:#334155 !important;font-size:13px;font-weight:600;
  box-shadow:0 2px 8px rgba(15,23,42,.04);
}
body.et-theme .col-md-3 .list-group-item:hover{
  border-color:rgba(43,76,227,.45) !important;
  color:var(--et-indigo) !important;transform:translateX(3px);
}
body.et-theme .col-md-3 .filter_kategorini{
  background:linear-gradient(100deg,rgba(43,76,227,.10),rgba(34,211,238,.12)) !important;
  border-color:var(--et-indigo) !important;color:var(--et-indigo) !important;
}
body.et-theme .col-md-3 .card{ border:0 !important;box-shadow:none !important;background:transparent !important; }
body.et-theme .col-md-3 .card-header{
  background:#fff !important;border:1px solid var(--et-line) !important;border-radius:14px 14px 0 0 !important;
}
body.et-theme .divider{ background:transparent !important;border-color:var(--et-line) !important; }

/* --------------------------------------------------------------- kartu produk */
body.et-theme .ini-view{ margin-bottom:22px; }
body.et-theme .thumbnail.viewlist{
  border:0 !important;
  border-radius:18px !important;
  background:#fff !important;
  box-shadow:var(--et-shadow) !important;
  overflow:hidden !important;
  padding:0 !important;
  margin-bottom:0 !important;
  transition:transform .25s ease,box-shadow .25s ease;
}
body.et-theme .thumbnail.viewlist:hover{
  transform:translateY(-6px);
  box-shadow:var(--et-shadow-lg) !important;
}
body.et-theme .thumbnail.viewlist > img,
body.et-theme .thumbnail.viewlist picture,
body.et-theme .thumbnail.viewlist picture img{
  width:100%;height:186px;object-fit:contain !important;
  background:linear-gradient(160deg,#eef3ff 0%,#f8fafc 100%) !important;
  padding:20px !important;border:0 !important;border-radius:0 !important;
  border-bottom:1px solid var(--et-line) !important;
  display:block;
}
body.et-theme .thumbnail.viewlist .caption{ padding:15px 17px 18px !important;color:var(--et-ink) !important; }
body.et-theme .thumbnail.viewlist .caption h5{
  font-size:13.5px !important;font-weight:700 !important;line-height:1.42 !important;
  color:var(--et-ink) !important;margin:0 0 10px !important;min-height:38px;
  text-transform:none !important;letter-spacing:0 !important;
}
body.et-theme .thumbnail.viewlist .caption p{ margin:0 !important;font-size:11.5px;color:var(--et-muted); }
body.et-theme .thumbnail.viewlist .caption p b.text-blue,
body.et-theme .thumbnail.viewlist .caption .text-blue{
  color:var(--et-indigo) !important;font-size:15px !important;font-weight:800 !important;
}
body.et-theme .thumbnail.viewlist .caption strike{ color:#94a3b8 !important;font-weight:500;font-size:11.5px; }
body.et-theme .thumbnail.viewlist .caption .text-green{ color:var(--et-green) !important;font-weight:700; }
body.et-theme .thumbnail.viewlist .caption .text-danger{ color:#e11d48 !important;font-weight:700; }
body.et-theme .thumbnail.viewlist .caption .btn-warning{
  background:linear-gradient(100deg,#fde68a,#fbbf24) !important;color:#78350f !important;
  border:0 !important;border-radius:999px !important;font-weight:800 !important;
  letter-spacing:.05em;height:24px !important;line-height:24px !important;padding:0 10px !important;
}

/* label diskon */
body.et-theme .ini-view > span.bg-red,
body.et-theme .ini-view > .bg-red{
  background:linear-gradient(130deg,#fb7185,#e11d48) !important;
  color:#fff !important;font-weight:800 !important;font-size:12px !important;
  padding:6px 10px !important;border-radius:14px 0 14px 0 !important;
  box-shadow:0 8px 18px rgba(225,29,72,.35);z-index:3;
}

/* tombol umpan */
body.et-theme .btn{ border-radius:12px !important;font-weight:700; }
body.et-theme .btn-warning{ background:linear-gradient(100deg,#fbbf24,#f59e0b) !important;color:#4a2606 !important;border:0 !important; }
body.et-theme .btn-info{ background:linear-gradient(100deg,var(--et-indigo),var(--et-cyan)) !important;border:0 !important;color:#04223a !important; }
body.et-theme .btn-default{ border:1px solid var(--et-line) !important; }
body.et-theme .btn-block{ border-radius:999px !important; }

/* baris "Urutkan" */
body.et-theme .filter-nomobile{
  background:#fff !important;border:1px solid var(--et-line) !important;
  border-radius:14px !important;padding:6px 10px !important;margin-bottom:16px;
  box-shadow:var(--et-shadow);
}
body.et-theme .filter-nomobile .btn{ font-size:12px;text-transform:none;letter-spacing:0; }
body.et-theme .filter-nomobile .by-urutkan{ color:#475569 !important; }
body.et-theme .filter-nomobile .by-urutkan:hover{ color:var(--et-indigo) !important;background:rgba(43,76,227,.07) !important; }
body.et-theme .pilih-harga{ border-radius:14px !important;border:1px solid var(--et-line) !important;box-shadow:var(--et-shadow-lg) !important; }

/* ---------------------------------------------------------- detail & isi ---- */
body.et-theme .page-title{
  background:transparent !important;border:0 !important;padding:14px 0 6px !important;
}
body.et-theme .breadcrumb{ background:transparent !important;font-size:12.5px; }
body.et-theme .breadcrumb a{ color:var(--et-indigo) !important; }
body.et-theme .card{
  border:1px solid var(--et-line) !important;border-radius:var(--et-radius) !important;
  box-shadow:var(--et-shadow) !important;background:#fff !important;
}
body.et-theme .card-title,
body.et-theme .card-header{ background:transparent !important;border-bottom:1px solid var(--et-line) !important; }
body.et-theme .panel{ border:1px solid var(--et-line) !important;border-radius:14px !important;box-shadow:var(--et-shadow) !important; }
body.et-theme .panel-heading{ background:#fff !important;border-bottom:1px solid var(--et-line) !important;font-weight:700; }
body.et-theme .nav-tabs{ border-color:var(--et-line) !important; }
body.et-theme .nav-tabs>li>a{ border-radius:12px 12px 0 0 !important;font-weight:600;color:#475569; }
body.et-theme .nav-tabs>li.active>a,
body.et-theme .nav-tabs>li.active>a:hover{ color:var(--et-indigo) !important;border-color:var(--et-line) var(--et-line) #fff !important; }

/* pagination */
body.et-theme .pagination>li>a,
body.et-theme .pagination>li>span{
  border:1px solid var(--et-line) !important;color:#334155 !important;
  border-radius:10px !important;margin:0 3px;font-weight:700;
}
body.et-theme .pagination>li.active>a,
body.et-theme .pagination>li.active>span{
  background:linear-gradient(100deg,var(--et-indigo),var(--et-cyan)) !important;
  border-color:transparent !important;color:#04223a !important;
}
body.et-theme .modal-content{ border-radius:18px !important;border:0 !important;box-shadow:0 24px 60px rgba(10,22,51,.35) !important; }
body.et-theme .modal-header{ border-bottom:1px solid var(--et-line) !important;font-weight:700; }
body.et-theme .form-control{ border-radius:11px !important;border-color:var(--et-line) !important;box-shadow:none !important; }
body.et-theme .form-control:focus{ border-color:var(--et-indigo) !important;box-shadow:0 0 0 3px rgba(43,76,227,.12) !important; }
body.et-theme .table>thead>tr>th{ background:#f8fafc !important;border-bottom:1px solid var(--et-line) !important;font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:#475569; }
body.et-theme .table>tbody>tr>td{ border-top:1px solid var(--et-line) !important;vertical-align:middle; }

/* --------------------------------------------------------------- footer ---- */
body.et-theme .easy-footer{
  background:linear-gradient(180deg,#0b1730,#081227) !important;
  border-top:0 !important;color:#a8b6d1 !important;padding-top:26px;
}
body.et-theme .easy-footer h6,
body.et-theme .easy-footer h6 b{ color:#fff !important;font-size:13px;letter-spacing:.02em; }
body.et-theme .easy-footer p,
body.et-theme .easy-footer div,
body.et-theme .easy-footer span,
body.et-theme .easy-footer small,
body.et-theme .easy-footer a{ color:#a8b6d1 !important; }
body.et-theme .easy-footer a:hover{ color:var(--et-cyan) !important; }
body.et-theme .easy-footer img.img-circle{ border:2px solid rgba(255,255,255,.18) !important; }
body.et-theme .divider.m-a-0{ display:none !important; }
body.et-theme .easy-copy-footer{ color:#8697b5 !important; }

/* sidebar offscreen (menu mobile) */
body.et-theme .sidebar-panel{ background:#0b1730 !important; }
body.et-theme .sidebar-panel a,
body.et-theme .sidebar-panel span,
body.et-theme .sidebar-panel li{ color:#dbe4f5 !important; }

/* tombol WhatsApp mengambang */
body.et-theme .wa-float{ width:58px !important;filter:drop-shadow(0 10px 22px rgba(10,22,51,.35)); }

/* ------------------------------------------------------------ responsive --- */
@media (max-width:991px){
  body.et-theme .et-hero{ padding:38px 26px 34px;border-radius:20px; }
  body.et-theme .et-hero h1{ font-size:30px; }
  body.et-theme .et-stats{ gap:22px; }
  body.et-theme .et-stat b{ font-size:22px; }
}
@media (max-width:767px){
  body.et-theme .et-hero{ padding:30px 20px 26px; }
  body.et-theme .et-hero h1{ font-size:24px; }
  body.et-theme .et-hero p.et-lead{ font-size:13.5px; }
  body.et-theme .et-btn{ padding:12px 20px;font-size:12px;width:100%;justify-content:center; }
  body.et-theme .et-stats{ gap:16px;padding-top:18px; }
  body.et-theme .et-stat b{ font-size:19px; }
  body.et-theme .thumbnail.viewlist > img,
  body.et-theme .thumbnail.viewlist picture,
  body.et-theme .thumbnail.viewlist picture img{ height:132px;padding:12px !important; }
  body.et-theme .thumbnail.viewlist .caption{ padding:11px 12px 14px !important; }
  body.et-theme .thumbnail.viewlist .caption h5{ font-size:11.5px !important;min-height:32px; }
  body.et-theme .thumbnail.viewlist .caption p b.text-blue,
  body.et-theme .thumbnail.viewlist .caption .text-blue{ font-size:13px !important; }
}
/* ============================================================================
   EASYTECH — pass 2: visual hero, breadcrumb, tombol, label, detail produk
   (append ke components/css/easytech.css)
   ========================================================================= */

/* ------------------------------------------- hero: panel visual kanan ----- */
body.et-theme .et-hero{
  display:flex;align-items:center;gap:46px;
}
body.et-theme .et-hero-inner{flex:1 1 560px;}
body.et-theme .et-hero-visual{
  position:relative;z-index:2;flex:0 0 330px;
  display:flex;flex-direction:column;gap:12px;
  padding:26px 22px;border-radius:22px;
  background:linear-gradient(160deg,rgba(255,255,255,.13),rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 26px 60px rgba(3,10,28,.45);
  backdrop-filter:blur(6px);
}
body.et-theme .et-hv-card{
  display:flex;align-items:center;gap:12px;
  background:rgba(255,255,255,.95);border-radius:14px;padding:12px 14px;
  box-shadow:0 8px 20px rgba(3,10,28,.22);
}
body.et-theme .et-hv-card i{
  font-size:15px;color:#fff;line-height:1;
  background:linear-gradient(120deg,var(--et-indigo),var(--et-cyan));
  border-radius:10px;padding:10px 11px;
}
body.et-theme .et-hv-card b{display:block;font-size:13px;color:var(--et-ink);line-height:1.2;}
body.et-theme .et-hv-card small{font-size:10.5px;color:var(--et-muted);letter-spacing:.02em;}
body.et-theme .et-hv-badge{
  position:absolute;left:-18px;bottom:-16px;
  display:inline-flex;align-items:center;gap:8px;
  background:#0b1730;color:#7ff0ff;border:1px solid rgba(34,211,238,.45);
  font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  border-radius:999px;padding:9px 16px;box-shadow:0 14px 30px rgba(3,10,28,.5);
}
body.et-theme .et-hv-badge i{color:var(--et-cyan);}

/* --------------------------------------------- breadcrumb / page title --- */
body.et-theme .page-title{
  background:#fff !important;border:1px solid var(--et-line) !important;
  border-radius:14px !important;padding:12px 18px !important;margin-bottom:18px !important;
  box-shadow:var(--et-shadow);
}
body.et-theme .breadcrumb{ margin:0 !important;color:var(--et-muted);font-weight:600;font-size:12.5px; }
body.et-theme .breadcrumb>li+li:before{ color:#cbd5e1 !important; }

/* ------------------------------------------------- tombol utama & label --- */
body.et-theme .btn-success,
body.et-theme .btn-primary{
  background:linear-gradient(100deg,var(--et-indigo),var(--et-cyan)) !important;
  border:0 !important;color:#04122b !important;font-weight:800 !important;
  box-shadow:0 10px 24px rgba(43,76,227,.28);
}
body.et-theme .btn-success:hover,
body.et-theme .btn-primary:hover{ filter:brightness(1.06); }
body.et-theme .btn-danger{ background:linear-gradient(100deg,#fb7185,#e11d48) !important;border:0 !important;color:#fff !important; }
body.et-theme .text-blue{ color:var(--et-indigo) !important; }
body.et-theme .text-green{ color:var(--et-green) !important; }
body.et-theme .text-amber,
body.et-theme .text-orange{ color:#d97706 !important; }
body.et-theme .label{
  border-radius:8px !important;font-weight:700 !important;letter-spacing:.02em;
  padding:5px 9px !important;font-size:11px !important;
  background:linear-gradient(100deg,rgba(43,76,227,.12),rgba(34,211,238,.16)) !important;
  color:var(--et-indigo) !important;border:1px solid rgba(43,76,227,.18);
}
body.et-theme .label-danger,
body.et-theme .label-warning{
  background:linear-gradient(100deg,#fde68a,#fbbf24) !important;color:#78350f !important;border:0;
}

/* --------------------------------------------------------- detail produk -- */
body.et-theme .breadcrumb + .row h1,
body.et-theme h1{
  font-weight:800;letter-spacing:-.3px;color:var(--et-ink);
}
body.et-theme .profile-timeline-header,
body.et-theme .thumbnail.img-thumbnail{ border-radius:14px !important; }
body.et-theme #zoom-produk,
body.et-theme .easy-zoom{ border-radius:16px !important; }
body.et-theme .well{ border-radius:14px !important;border-color:var(--et-line) !important;background:#fff !important; }
body.et-theme ul.nav.nav-pills>li>a{ border-radius:999px !important; }
body.et-theme .list-group-item{border-color:var(--et-line) !important;}
body.et-theme hr{ border-color:var(--et-line) !important; }
body.et-theme .h1,body.et-theme .h2,body.et-theme .h3,
body.et-theme .h4,body.et-theme .h5{ font-weight:700; }

/* tabel & form di keranjang/checkout */
body.et-theme .table>tbody+tbody{ border-top:1px solid var(--et-line) !important; }
body.et-theme .btn-lg{ border-radius:999px !important;padding:14px 30px !important;font-size:13px !important;letter-spacing:.03em; }

/* sembunyikan label "Kembali" yang mengapung saat panel offscreen tertutup */
body.et-theme .sidebar-panel{ position:fixed !important;top:0;bottom:0;z-index:1040; }
body.et-theme .sidebar-panel:not(.offscreen-transform) .brand-logo span{ visibility:hidden; }
body.et-theme .sidebar-panel.offscreen-transform .brand-logo span{ visibility:visible; }

@media (max-width:991px){
  body.et-theme .et-hero{ flex-direction:column;align-items:stretch;gap:26px; }
  body.et-theme .et-hero-visual{ flex:none;flex-direction:row;flex-wrap:wrap;padding:16px; }
  body.et-theme .et-hv-card{ flex:1 1 44%; }
  body.et-theme .et-hv-badge{ position:static;align-self:flex-start; }
}
@media (max-width:600px){
  body.et-theme .et-hv-card{ flex:1 1 100%; }
}
/* ============================================================================
   EASYTECH — pass 3: detail produk, tombol hijau, heading, mobile stats
   ========================================================================= */

/* tombol "Beli Sekarang" (btn-success + bg-green) */
body.et-theme .bg-green{
  background:linear-gradient(100deg,var(--et-indigo),var(--et-cyan)) !important;
  color:#04122b !important;border:0 !important;
}
body.et-theme #addtoCart{
  border-radius:999px !important;
  padding:14px 34px !important;
  font-weight:800 !important;
  letter-spacing:.03em;
  box-shadow:0 12px 28px rgba(43,76,227,.30);
}
body.et-theme #items-harga{
  font-size:32px !important;
  font-weight:800 !important;
  color:var(--et-indigo) !important;
  letter-spacing:-.5px;
}
body.et-theme .main-content h4[style*="#d5d5d5"]{
  color:#3b4a63 !important;
  font-weight:800 !important;
  letter-spacing:.10em;
  font-size:12.5px !important;
  border-bottom:1px solid var(--et-line);
  padding-bottom:8px !important;
}
body.et-theme .card h4,
body.et-theme .card h5{ font-weight:800; color:var(--et-ink); }
body.et-theme .card-title h4{ font-size:16px; }
body.et-theme #addtoCart + *,
body.et-theme .input-group .btn-default{ border-radius:10px !important; }

/* kotak deskripsi / tab */
body.et-theme .card-block{ padding:20px 22px; }
body.et-theme .easy-deskripsi,
body.et-theme .deskripsi-produk{ line-height:1.85;color:#334155; }

/* ikon sosial "Bagikan ke" */
body.et-theme .jssocials-shares{ margin-top:6px; }
body.et-theme .jssocials-share-link{ border-radius:10px !important; }

/* mobile: statistik tetap satu baris */
@media (max-width:600px){
  body.et-theme .et-stats{ flex-wrap:nowrap;gap:10px; }
  body.et-theme .et-stat b{ font-size:17px; }
  body.et-theme .et-stat span{ font-size:8.5px;letter-spacing:.06em; }
  body.et-theme #items-harga{ font-size:25px !important; }
  body.et-theme #addtoCart{ width:100%; }
}
/* ============================================================================
   EASYTECH — pass 4: halaman login (login-easy.php, body.et-login)
   ========================================================================= */
body.et-login{
  min-height:100vh;
  background:
    radial-gradient(900px 380px at 85% -10%,rgba(34,211,238,.28),transparent 60%),
    radial-gradient(700px 320px at 5% 110%,rgba(79,70,229,.45),transparent 62%),
    linear-gradient(150deg,#081227 0%,#12224a 52%,#243f9e 100%) !important;
}
body.et-login .color-rgba{ background:transparent !important; padding:5vh 0 7vh; }
body.et-login h3.text-white{
  color:#fff !important;font-weight:800;letter-spacing:-.4px;
  font-size:26px;margin-bottom:26px;
}
body.et-login .easy-form{
  background:#fff;border-radius:22px;padding:26px 24px 20px;
  box-shadow:0 30px 70px rgba(3,10,28,.45);
}
body.et-login .easy-icon{
  width:84px;height:84px;border:3px solid rgba(43,76,227,.25);
  box-shadow:0 10px 26px rgba(3,10,28,.18);
}
body.et-login label{ font-size:12.5px;font-weight:700;color:#334155;letter-spacing:.01em; }
body.et-login .form-control{
  height:46px !important;border-radius:12px !important;border:1px solid var(--et-line) !important;
  font-size:13.5px;box-shadow:none !important;
}
body.et-login .form-control:focus{ border-color:var(--et-indigo) !important;box-shadow:0 0 0 3px rgba(43,76,227,.12) !important; }
body.et-login .input-group-btn .btn{ height:46px;border-radius:0 12px 12px 0 !important; }
body.et-login .divider span{ font-size:11.5px;color:var(--et-muted);background:#fff; }
body.et-login .btn-info,
body.et-login .btn-info[class*="bg-gradient"]{
  background:linear-gradient(100deg,var(--et-indigo),var(--et-cyan)) !important;
  border:0 !important;color:#04122b !important;font-weight:800 !important;
  border-radius:999px !important;letter-spacing:.02em;
  box-shadow:0 12px 26px rgba(43,76,227,.26);
}
body.et-login .btn.no-bg,
body.et-login a.btn.no-bg{
  background:transparent !important;color:#475569 !important;font-weight:700;
  border:1px dashed var(--et-line) !important;border-radius:999px !important;
}
body.et-login a.text-info{ color:var(--et-indigo) !important;font-weight:600;font-size:12.5px; }
/* ============================================================================
   EASYTECH — pass 5: chip keranjang, drawer Cart, kontras teks tombol gelap
   ========================================================================= */

/* ---------------------------------------- chip jumlah barang di keranjang --- */
body.et-theme .count_prodincart{
  display:inline-block;
  background:var(--et-cyan) !important;
  color:#06213a !important;
  font-weight:800 !important;
  font-size:11px !important;
  line-height:18px;
  min-width:18px;
  height:18px;
  text-align:center;
  border-radius:999px !important;
  padding:0 5px !important;
  margin-left:4px;
  vertical-align:2px;
}

/* ------------------------------------------------- drawer "Cart" kanan ----- */
body.et-theme .chat-panel{
  top:0 !important;
  bottom:0 !important;
  height:100vh !important;
  width:360px;
  max-width:92vw;
  border:0;
  background:#f4f6fc !important;
  box-shadow:-22px 0 55px rgba(3,10,28,.35) !important;
}
body.et-theme .chat-panel .chat-users{ background:#f4f6fc !important; }
body.et-theme .chat-panel .chat-group{ margin:0 !important; }
body.et-theme .chat-panel .chat-group-header{
  background:linear-gradient(100deg,var(--et-navy) 0%,var(--et-indigo-2) 100%) !important;
  color:#fff !important;
  font-weight:800 !important;
  font-size:14px !important;
  line-height:1.2 !important;
  margin:0 !important;
  padding:20px 22px !important;
  display:flex;align-items:center;gap:10px;
  border-radius:0 !important;
  box-shadow:0 8px 22px rgba(10,22,51,.30);
  position:relative;z-index:6;
}
body.et-theme .chat-panel .chat-group-header i{ color:var(--et-cyan) !important;font-size:16px; }
body.et-theme #list_cart_sidebarRight{ padding:16px !important; }
body.et-theme .chat-panel .table{
  background:#fff !important;
  border:1px solid var(--et-line) !important;
  border-radius:14px;
  overflow:hidden;
  margin-bottom:14px !important;
}
body.et-theme .chat-panel .table>tbody>tr>td{
  border-top:1px solid var(--et-line) !important;
  font-size:12.5px;
  color:var(--et-ink);
  padding:10px 8px !important;
  vertical-align:middle;
}
body.et-theme .chat-panel .table>tbody>tr:first-child>td{ border-top:0 !important; }
body.et-theme .chat-panel .text-muted{ color:var(--et-muted) !important;font-size:13px; }
body.et-theme .chat-panel img{ border-radius:10px; }
body.et-theme .chat-panel .btn{
  border-radius:12px !important;
  font-weight:800 !important;
  letter-spacing:.01em;
  padding:11px 16px !important;
}

/* --------------------------- kontras: tombol/elemen gelap pakai teks terang - */
body.et-theme .btn-info,
body.et-theme .btn-info[class*="bg-gradient"],
body.et-theme .bg-blue,
body.et-theme .btn-primary,
body.et-theme .btn-success,
body.et-theme .bg-green{
  background:linear-gradient(100deg,#3346d3 0%,#1f7ae0 100%) !important;
  border:0 !important;
  color:#ffffff !important;
  text-shadow:0 1px 1px rgba(6,20,45,.25);
  box-shadow:0 10px 24px rgba(31,79,200,.28);
}
body.et-theme .btn-info:hover,
body.et-theme .bg-blue:hover,
body.et-theme .btn-success:hover,
body.et-theme .bg-green:hover{
  filter:brightness(1.08);
  color:#ffffff !important;
}
/* teks putih dari sistem tetap putih */
body.et-theme .text-white{ color:#ffffff !important; }
/* pagination aktif + badge */
body.et-theme .pagination>li.active>a,
body.et-theme .pagination>li.active>span{
  background:linear-gradient(100deg,#3346d3,#1f7ae0) !important;
  border-color:transparent !important;
  color:#fff !important;
}
/* tombol di hero tetap terang → teks gelap (kontras) */
body.et-theme .et-btn-primary{ color:#04122b !important; }
/* tombol di halaman login */
body.et-login .btn-info,
body.et-login .btn-info[class*="bg-gradient"]{ color:#ffffff !important; }
/* ============================================================================
   EASYTECH — pass 6: drawer di atas header, top bar rapi, tombol Info Member
   ========================================================================= */

/* drawer Cart harus menutupi header sticky */
body.et-theme .chat-panel{ z-index:2000 !important; }

/* top bar kiri: info kontak cepat, satu baris */
body.et-theme .top-nav-left{ white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
body.et-theme .et-topbar-info{ font-weight:600;font-size:11.5px;display:inline-block; }
body.et-theme .et-topbar-info a{ margin-right:2px; }
body.et-theme .et-topbar-info .et-sep{ opacity:.45;margin:0 7px; }

/* tombol "Info Member" mengikuti tema */
body.et-theme .et-info-member{
  background:#fff !important;
  border:1px solid var(--et-line) !important;
  color:var(--et-indigo) !important;
  border-radius:999px !important;
  padding:8px 18px !important;
  font-size:12px !important;
  font-weight:800 !important;
  letter-spacing:.02em;
  box-shadow:var(--et-shadow);
}
body.et-theme .et-info-member:hover{ background:rgba(43,76,227,.07) !important; }