/* ==========================================================
   SENYUMTOTO UI FIX V2
   Pasang PALING BAWAH setelah seluruh CSS lama.
   Dibuat untuk memperbaiki layout walau utility CSS asli gagal load.
   ========================================================== */

:root{
  --st-red:#c90018;
  --st-red-dark:#960012;
  --st-black:#101014;
  --st-text:#202126;
  --st-muted:#686b73;
  --st-line:#e5e6e9;
  --st-bg:#f5f6f8;
  --st-white:#fff;
  --st-radius:12px;
  --st-container:1180px;
  --st-shadow:0 8px 30px rgba(0,0,0,.10);
}

/* ===== RESET ===== */
html{
  box-sizing:border-box;
  -webkit-text-size-adjust:100%;
}
*,*::before,*::after{box-sizing:inherit}

html,body{
  margin:0!important;
  padding:0;
  width:100%;
  min-height:100%;
}

body{
  overflow-x:hidden;
  background:var(--st-bg)!important;
  color:var(--st-text);
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:15px;
  line-height:1.55;
  padding-bottom:76px!important;
}

img,svg,video,iframe{max-width:100%}
img{height:auto}
a{text-decoration:none}
button,input,select,textarea{font:inherit}

/* ===== BOOTSTRAP-LIKE UTILITIES YANG HILANG ===== */
.container,
.main-container{
  width:100%!important;
  max-width:var(--st-container)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:18px!important;
  padding-right:18px!important;
}

.row{
  display:flex;
  flex-wrap:wrap;
  margin-left:-8px;
  margin-right:-8px;
}

.row > [class*="col-"]{
  min-width:0;
  padding-left:8px;
  padding-right:8px;
}

.col-12{width:100%;flex:0 0 100%}

.d-none{display:none!important}
.d-block{display:block!important}
.d-flex{display:flex!important}
.w-100{width:100%!important}
.w-auto{width:auto!important}
.align-items-center{align-items:center!important}
.justify-content-between{justify-content:space-between!important}
.justify-content-center{justify-content:center!important}
.flex-column{flex-direction:column!important}
.text-center{text-align:center!important}
.m-0{margin:0!important}
.mt-1{margin-top:.5rem!important}
.mt-2{margin-top:1rem!important}
.mb-0{margin-bottom:0!important}
.mb-1{margin-bottom:.5rem!important}
.mb-2{margin-bottom:1rem!important}
.ml-2{margin-left:1rem!important}
.mr-0{margin-right:0!important}
.p-2{padding:1rem!important}
.hide{display:none!important}

.order-1{order:1}
.order-2{order:2}
.order-3{order:3}
.order-4{order:4}

/* ===== HIDE LEGACY BLOCK YANG BIKIN HEADER PECAH ===== */
/* panel lokasi muncul polos karena CSS vendor tidak termuat */
.offsite-panel,
.js-ld-wrapper,
[data-panel-name="location picker location"],
[data-panel-name="location picker branch"]{
  display:none!important;
}

/* toggle VAT / top bar lama */
.header-alt__top-bar,
.toggle-alt{
  display:none!important;
}

/* bar lokasi mobile lama */
.header-alt__location-picker{
  display:none!important;
}

/* search overlay duplikat */
.header-alt__search-overlay{
  display:none!important;
}

/* widget lokasi / toko di kanan */
.header-alt__quick-bar-icon{
  display:none!important;
}

/* ===== HEADER ===== */
header,
.header-alt{
  width:100%;
  position:relative;
  z-index:100;
}

.header-alt{
  background:#fff!important;
  border-bottom:1px solid var(--st-line);
  box-shadow:0 3px 14px rgba(0,0,0,.07);
}

.header-alt__middle{
  background:#fff!important;
}

.header-alt__middle > .container{
  padding-top:14px!important;
  padding-bottom:14px!important;
}

.header-alt__components{
  width:100%;
}

.header-alt__components > .d-flex{
  display:grid!important;
  grid-template-columns:220px minmax(260px,1fr) auto;
  align-items:center!important;
  gap:22px;
  width:100%;
}

.header-alt__logo{
  min-width:0;
}

.header-alt__logo a{
  display:flex!important;
  align-items:center;
}

.header-alt__logo-img{
  display:block!important;
  width:auto!important;
  max-width:190px!important;
  max-height:62px!important;
  object-fit:contain;
}

/* ===== HEADER SEARCH ===== */
.header-alt__search{
  width:100%;
  min-width:0;
}

.header-alt__search .search,
.header-alt__search .form-group--search{
  width:100%;
}

.header-alt__search .form-group--search{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:stretch;
  gap:8px;
  margin:0!important;
}

.header-alt__search .form-group__element{
  min-width:0;
}

.header-alt__search input.form-control{
  width:100%!important;
  height:44px!important;
  min-height:44px!important;
  padding:0 14px!important;
  border:1px solid #d5d7dc!important;
  border-radius:9px!important;
  background:#fff!important;
  color:#222!important;
  outline:none!important;
  box-shadow:none!important;
}

.header-alt__search input.form-control:focus{
  border-color:var(--st-red)!important;
  box-shadow:0 0 0 3px rgba(201,0,24,.10)!important;
}

.header-alt__search .search__form-cta{
  margin:0!important;
}

.header-alt__search .btn-search{
  width:auto!important;
  min-width:88px!important;
  height:44px!important;
  margin:0!important;
  padding:0 17px!important;
  border:0!important;
  border-radius:9px!important;
  background:var(--st-red)!important;
  color:#fff!important;
  font-weight:800!important;
  cursor:pointer;
}

/* ===== LOGIN / DAFTAR QUICK BAR ===== */
.header-alt__widgets{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  min-width:0;
}

.header-alt__quick-bar{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
}

.header-alt__quick-bar > *{
  min-width:0;
}

/* sembunyikan semua quick item kecuali yang berisi user/login */
.header-alt__quick-bar > *:not(:last-child){
  display:none!important;
}

.header-alt__quick-bar-link{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:42px;
  padding:10px 15px!important;
  border:1px solid var(--st-red)!important;
  border-radius:9px!important;
  background:#fff!important;
  color:var(--st-red)!important;
  font-size:13px!important;
  font-weight:800!important;
  white-space:nowrap;
}

.header-alt__quick-bar-link:hover{
  background:var(--st-red)!important;
  color:#fff!important;
}

/* ===== MENU DESKTOP ===== */
.menu-alt{
  display:block!important;
  position:relative!important;
  width:100%!important;
  background:var(--st-black)!important;
  border:0!important;
}

.menu-alt > .container{
  padding-top:0!important;
  padding-bottom:0!important;
}

.menu-alt__wrap,
.menu-alt__inner,
.menu-alt__tray{
  width:100%!important;
  margin:0!important;
  padding:0!important;
}

.menu-alt__tray > .yCmsComponent{
  width:100%!important;
  display:flex!important;
  align-items:stretch!important;
  justify-content:center!important;
  gap:2px!important;
}

.menu-alt__tray-item{
  flex:1 1 0!important;
  min-width:0!important;
}

.menu-alt__link,
.menu-alt__link--main{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  min-height:50px!important;
  padding:11px 12px!important;
  border-radius:0!important;
  background:transparent!important;
  color:#fff!important;
  font-size:13px!important;
  font-weight:800!important;
  line-height:1.2!important;
  text-align:center!important;
  transition:.2s ease!important;
}

.menu-alt__link:hover,
.menu-alt__link--main:hover{
  background:var(--st-red)!important;
  color:#fff!important;
}

/* login + daftar pada dua item terakhir */
.menu-alt__tray-item:nth-last-child(2) .menu-alt__link--main,
.menu-alt__tray-item:last-child .menu-alt__link--main{
  background:#2a2a2f!important;
}

.menu-alt__tray-item:last-child .menu-alt__link--main{
  background:var(--st-red)!important;
}

/* elemen menu mobile jangan muncul di desktop */
.menu-alt .d-lg-none,
.header-alt__menu{
  display:none!important;
}

/* ===== CTA BAWAH HEADER ===== */
.CTASENYUMTOTO468516465{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:10px!important;
  width:calc(100% - 36px)!important;
  max-width:var(--st-container)!important;
  margin:14px auto!important;
  padding:9px!important;
  border:1px solid var(--st-line)!important;
  border-radius:13px!important;
  background:#fff!important;
  box-shadow:var(--st-shadow)!important;
  overflow:hidden!important;
  animation:none!important;
}

.CTASENYUMTOTO468516465 .m-btn{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:46px!important;
  padding:10px 12px!important;
  border:0!important;
  border-radius:9px!important;
  background:var(--st-black)!important;
  color:#fff!important;
  font:800 13px/1.2 Arial,Helvetica,sans-serif!important;
  letter-spacing:.02em!important;
  text-shadow:none!important;
  box-shadow:none!important;
  animation:none!important;
}

.CTASENYUMTOTO468516465 .m-btn:first-child{
  background:var(--st-red)!important;
}

.CTASENYUMTOTO468516465 .m-btn::before,
.CTASENYUMTOTO468516465 .m-btn::after{
  display:none!important;
}

.CTASENYUMTOTO468516465 .m-btn:hover{
  transform:translateY(-1px)!important;
  filter:brightness(.94);
}

/* ===== MAIN CONTENT ===== */
main.main{
  display:block!important;
  width:100%!important;
}

.main-container{
  padding-top:8px!important;
  padding-bottom:40px!important;
}

.yCmsContenttoto{
  width:100%!important;
  max-width:100%!important;
  overflow:hidden!important;
  background:#fff!important;
  border:1px solid var(--st-line)!important;
  border-radius:14px!important;
  box-shadow:var(--st-shadow)!important;
}

.yCmsContenttoto > .row{
  margin:0!important;
}

.yCmsContenttoto > .row > [class*="col-"]{
  padding-left:0!important;
  padding-right:0!important;
}

.breadcrumb{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:6px!important;
  margin:0!important;
  padding:11px 16px!important;
  list-style:none!important;
  background:#fafafa!important;
  border-bottom:1px solid #ececef!important;
}

.main-container h1,
.main-container h2,
.main-container h3{
  line-height:1.25!important;
  overflow-wrap:anywhere;
}

.main-container h1{font-size:clamp(25px,3vw,38px)!important}
.main-container h2{font-size:clamp(21px,2.4vw,30px)!important}
.main-container h3{font-size:clamp(18px,2vw,24px)!important}

.main-container p,
.main-container li{
  overflow-wrap:anywhere;
}

.main-container img{
  display:block;
  max-width:100%!important;
  height:auto!important;
}

.main-container table{
  width:100%!important;
  border-collapse:collapse;
}

.main-container iframe,
.main-container video{
  max-width:100%!important;
}

/* ===== BUTTON UMUM ===== */
.btn{
  min-height:40px;
  padding:9px 15px;
  border-radius:8px;
  font-weight:700;
}

.btn-primary{
  border:1px solid var(--st-red)!important;
  background:var(--st-red)!important;
  color:#fff!important;
}

.btn-tertiary{
  border:1px solid #d4d5d9!important;
  background:#fff!important;
  color:#222!important;
}

/* ===== FOOTER ===== */
footer{
  width:100%!important;
  background:var(--st-black)!important;
  color:#ddd!important;
}

.footer-floating-toto{
  position:fixed!important;
  left:50%!important;
  right:auto!important;
  bottom:8px!important;
  transform:translateX(-50%)!important;
  display:flex!important;
  width:calc(100% - 20px)!important;
  max-width:760px!important;
  gap:6px!important;
  padding:7px!important;
  border:1px solid rgba(255,255,255,.16)!important;
  border-radius:13px!important;
  background:rgba(16,16,20,.96)!important;
  box-shadow:0 8px 28px rgba(0,0,0,.35)!important;
  z-index:9999!important;
  animation:none!important;
}

.footer-btn-toto{
  flex:1 1 0!important;
  min-width:0!important;
  min-height:42px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;
  padding:7px 8px!important;
  border:1px solid rgba(255,255,255,.16)!important;
  border-radius:8px!important;
  background:#29292e!important;
  color:#fff!important;
  font-size:11px!important;
  font-weight:800!important;
  line-height:1.1!important;
  text-align:center!important;
  white-space:normal!important;
  box-shadow:none!important;
  animation:none!important;
}

.footer-btn-toto:hover{
  background:var(--st-red)!important;
}

/* ===== DESKTOP UTILITIES ===== */
@media (min-width:992px){
  .d-lg-none{display:none!important}
  .d-lg-block{display:block!important}
  .d-lg-flex{display:flex!important}

  .order-lg-4{order:4}
}

/* ===== TABLET / MOBILE ===== */
@media (max-width:991.98px){
  body{
    padding-bottom:72px!important;
  }

  .container,
  .main-container{
    padding-left:12px!important;
    padding-right:12px!important;
  }

  .d-lg-none{display:block!important}
  .d-lg-block,
  .d-lg-flex{display:none!important}

  /* header jadi logo + hamburger */
  .header-alt__middle > .container{
    padding-top:10px!important;
    padding-bottom:10px!important;
  }

  .header-alt__components > .d-flex{
    display:grid!important;
    grid-template-columns:minmax(130px,1fr) auto!important;
    gap:10px!important;
  }

  .header-alt__logo{
    grid-column:1;
  }

  .header-alt__logo-img{
    max-width:165px!important;
    max-height:50px!important;
  }

  /* search tengah desktop disembunyikan di mobile supaya tidak dobel */
  .header-alt__search{
    display:none!important;
  }

  .header-alt__widgets{
    display:none!important;
  }

  .header-alt__menu{
    display:flex!important;
    grid-column:2;
    align-items:center!important;
    justify-content:center!important;
    width:42px!important;
    height:42px!important;
    padding:8px!important;
    border-radius:9px!important;
    background:#f1f1f3!important;
    cursor:pointer;
  }

  .header-alt__menu-icon{
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    gap:5px!important;
    width:22px!important;
  }

  .header-alt__menu-icon-bar{
    display:block!important;
    width:100%!important;
    height:2px!important;
    border-radius:10px!important;
    background:#222!important;
  }

  /* menu overlay hanya tampil kalau JS memberi state buka */
  .menu-alt{
    display:none!important;
  }

  .menu-alt.is-active,
  .menu-alt.active,
  .menu-alt.open,
  .menu-alt.menu-alt--open,
  body.menu-open .menu-alt{
    display:block!important;
  }

  .menu-alt__tray > .yCmsComponent{
    display:block!important;
    padding:8px 0!important;
  }

  .menu-alt__tray-item{
    width:100%!important;
  }

  .menu-alt__link,
  .menu-alt__link--main{
    justify-content:flex-start!important;
    min-height:44px!important;
    padding:10px 14px!important;
    border-bottom:1px solid rgba(255,255,255,.08)!important;
    text-align:left!important;
  }

  .menu-alt .d-lg-none{
    display:block!important;
  }

  /* mobile CTA */
  .CTASENYUMTOTO468516465{
    width:calc(100% - 20px)!important;
    margin:10px auto!important;
    gap:7px!important;
    padding:7px!important;
  }

  .CTASENYUMTOTO468516465 .m-btn{
    min-height:43px!important;
    padding:8px 6px!important;
    font-size:11px!important;
  }

  .main-container{
    padding-top:4px!important;
  }

  .yCmsContenttoto{
    border-radius:10px!important;
  }
}

/* ===== MOBILE KECIL ===== */
@media (max-width:575.98px){
  .container,
  .main-container{
    padding-left:8px!important;
    padding-right:8px!important;
  }

  .header-alt__logo-img{
    max-width:145px!important;
  }

  .main-container h1{font-size:23px!important}
  .main-container h2{font-size:20px!important}
  .main-container h3{font-size:18px!important}

  .main-container p,
  .main-container li{
    font-size:14px!important;
    line-height:1.65!important;
  }

  .footer-floating-toto{
    width:calc(100% - 12px)!important;
    bottom:5px!important;
    padding:5px!important;
    gap:4px!important;
  }

  .footer-btn-toto{
    min-height:40px!important;
    padding:5px 4px!important;
    font-size:9px!important;
  }

  .footer-btn-toto svg{
    width:17px!important;
    height:17px!important;
  }
}

/* ===== AKSESIBILITAS ===== */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation:none!important;
    transition:none!important;
    scroll-behavior:auto!important;
  }
}


/* ==========================================================
   SENYUMTOTO UI FIX V3 PATCH
   Perbaikan komponen e-commerce legacy yang bocor ke halaman
   ========================================================== */

/* ===== HEADER V3: buang search lama yang pecah ===== */
@media (min-width:992px){
  .header-alt__middle > .container{
    padding-top:12px!important;
    padding-bottom:12px!important;
  }

  .header-alt__components > .d-flex{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:24px!important;
  }

  .header-alt__logo{
    flex:0 0 auto!important;
  }

  .header-alt__logo-img{
    max-width:200px!important;
    max-height:56px!important;
  }

  /* search bawaan rusak: sembunyikan total */
  .header-alt__search,
  .header-alt__search-overlay{
    display:none!important;
  }

  .header-alt__widgets{
    margin-left:auto!important;
  }

  .header-alt__quick-bar{
    display:flex!important;
  }
}

/* ===== PRODUK PANEL ECOMMERCE: SEMBUNYIKAN ===== */
.product__panel,
.simple-container__product-panel,
#modalSessionLocationForm,
.js-pbp-cta,
.product__panel-icon{
  display:none!important;
}

/* hilangkan sisa kolom product panel agar konten utama full-width */
.col-lg-4.product__panel{
  display:none!important;
}

.product__detail,
.product__details,
.product__main,
.product__content{
  max-width:100%!important;
}

/* bila layout produk memakai col-lg-8, paksa penuh */
.main-container .col-lg-8{
  flex:0 0 100%!important;
  width:100%!important;
  max-width:100%!important;
}

/* ===== WISHLIST / PROJECT LIST MODAL BOCOR ===== */
#modal-wishlist-create,
.modal.js-wishlist-form,
.js-wishlist-form[aria-hidden="true"]{
  display:none!important;
}

/* fallback untuk modal lain yang aria-hidden tetapi tampil polos */
.modal[aria-hidden="true"]{
  display:none!important;
}

/* modal yang benar-benar dibuka tetap boleh tampil */
.modal[aria-hidden="false"]{
  display:flex!important;
}

/* ===== STOCK CHECKER BOCOR ===== */
#modal-pdp-stock,
.check-stock-modal[aria-hidden="true"],
#pdpStockCheckFormModal,
#pdpStockCheckFormSection,
.check-stock-modal__load-more{
  display:none!important;
}

/* alternative/cross/up selling kosong */
#alternativeProductsCompponent:empty,
.yCmsContenttoto[data-totoname="AlternativeProducts"]:empty,
.yCmsContenttoto[data-totoname="UpSelling"]:empty,
.yCmsContenttoto[data-totoname="CrossSelling"]:empty{
  display:none!important;
}

/* ===== REKOMENDASI PRODUK: UBAH CAROUSEL RUSAK JADI GRID ===== */
.product-recommendations-carousel{
  width:100%!important;
  max-width:var(--st-container)!important;
  margin:30px auto!important;
  padding:22px!important;
  background:#fff!important;
  border:1px solid var(--st-line)!important;
  border-radius:14px!important;
  box-shadow:var(--st-shadow)!important;
  overflow:hidden!important;
}

.product-recommendations-carousel > h2{
  margin:0 0 18px!important;
  font-size:26px!important;
  line-height:1.2!important;
  color:#19191d!important;
}

.product-recommendations-carousel .glider-contain{
  width:100%!important;
}

.product-recommendations-carousel .glider-contain > .d-flex{
  display:block!important;
}

.product-recommendations-carousel .glider-arrow,
.product-recommendations-carousel .glider-dots{
  display:none!important;
}

.product-recommendations-carousel .glider{
  width:100%!important;
  overflow:visible!important;
}

.product-recommendations-carousel .glider-track{
  width:100%!important;
  transform:none!important;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:18px!important;
  align-items:stretch!important;
}

.product-recommendations-carousel .glider-slide,
.product-recommendations-carousel .item{
  width:100%!important;
  min-width:0!important;
  height:auto!important;
  margin:0!important;
  padding:0!important;
}

.product-recommendations-carousel .product--carousel{
  height:100%!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  padding:12px!important;
  border:1px solid #e3e4e7!important;
  border-radius:12px!important;
  background:#fff!important;
  box-shadow:0 5px 16px rgba(0,0,0,.06)!important;
}

.product-recommendations-carousel .link-header{
  display:block!important;
  color:#17171a!important;
}

.product-recommendations-carousel .product__thumb{
  width:100%!important;
  margin:0 0 10px!important;
  overflow:hidden!important;
  border-radius:9px!important;
  background:#f1f1f3!important;
}

.product-recommendations-carousel .product__image{
  display:block!important;
  width:100%!important;
}

.product-recommendations-carousel .product__image img{
  width:100%!important;
  aspect-ratio:1/1!important;
  object-fit:cover!important;
  border-radius:9px!important;
}

.product-recommendations-carousel .product__name{
  margin:8px 0 4px!important;
  color:#17171a!important;
  font-size:15px!important;
  font-weight:800!important;
  line-height:1.3!important;
}

.product-recommendations-carousel .small{
  margin:4px 0!important;
  color:#71747c!important;
  font-size:12px!important;
}

.product-recommendations-carousel a{
  color:var(--st-red)!important;
}

.product-recommendations-carousel .btn,
.product-recommendations-carousel form,
.product-recommendations-carousel [class*="price"]{
  max-width:100%!important;
}

/* ===== KONTEN UTAMA: RUANG DAN CARD ===== */
.main-container{
  max-width:1100px!important;
}

.yCmsContenttoto{
  overflow:visible!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}

/* jangan semua nested yCms jadi card */
.main-container > .yCmsContenttoto{
  background:#fff!important;
  border:1px solid var(--st-line)!important;
  border-radius:14px!important;
  box-shadow:var(--st-shadow)!important;
  overflow:hidden!important;
}

/* area artikel custom */
.wrapSENYUMTOTOaplikasigame{
  width:100%!important;
  max-width:100%!important;
  margin:22px auto!important;
}

/* ===== MODAL GENERIC - JANGAN TAMPIL INLINE ===== */
.modal{
  position:fixed!important;
  inset:0!important;
  z-index:10000!important;
}

.modal[aria-hidden="true"]{
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}

/* ===== FOOTER DEFAULT: rapikan ===== */
footer .container{
  max-width:1100px!important;
}

.footer__section{
  padding:18px 12px!important;
}

.footer__heading{
  color:#fff!important;
  font-size:15px!important;
  margin:0 0 10px!important;
}

.footer__list{
  margin:0!important;
  padding:0!important;
  list-style:none!important;
}

.footer__list li{
  margin:6px 0!important;
}

.footer__list a{
  color:#d8d8dc!important;
  font-size:13px!important;
}

.footer__list a:hover{
  color:#fff!important;
}

/* ===== TABLET ===== */
@media (max-width:991.98px){
  .product-recommendations-carousel{
    padding:16px!important;
    margin:20px auto!important;
  }

  .product-recommendations-carousel .glider-track{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

/* ===== MOBILE ===== */
@media (max-width:575.98px){
  .product-recommendations-carousel{
    padding:12px!important;
    border-radius:10px!important;
  }

  .product-recommendations-carousel > h2{
    font-size:21px!important;
  }

  .product-recommendations-carousel .glider-track{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }

  .product-recommendations-carousel .product--carousel{
    padding:10px!important;
  }

  .product-recommendations-carousel .product__image img{
    aspect-ratio:16/11!important;
  }
}


/* ==========================================================
   SENYUMTOTO UI FIX V4 PATCH
   Fokus: gallery gambar + footer 4 kolom
   ========================================================== */

/* ===== FIX BOOTSTRAP GRID DESKTOP YANG HILANG ===== */
@media (min-width:992px){
  .col-lg-3{
    flex:0 0 25%!important;
    width:25%!important;
    max-width:25%!important;
  }

  .col-lg-4{
    flex:0 0 33.333333%!important;
    width:33.333333%!important;
    max-width:33.333333%!important;
  }

  .col-lg-6{
    flex:0 0 50%!important;
    width:50%!important;
    max-width:50%!important;
  }

  .col-lg-8{
    flex:0 0 66.666667%!important;
    width:66.666667%!important;
    max-width:66.666667%!important;
  }

  .col-lg-9{
    flex:0 0 75%!important;
    width:75%!important;
    max-width:75%!important;
  }

  /* konten produk utama tetap full karena panel kanan sudah dibuang */
  .main-container .product__panel{
    display:none!important;
  }

  .main-container .col-lg-8:not(.footer__section){
    max-width:100%!important;
  }
}

/* ==========================================================
   PRODUCT GALLERY
   ========================================================== */

/* bungkus gallery di tengah dan jangan memenuhi container */
.product-details-carousel,
.js-glider-slider:not(.glider-slider--thumb),
.glider-slider__slide{
  max-width:520px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* gambar utama */
.product-details-carousel__zoom{
  width:100%!important;
  max-width:520px!important;
  margin:18px auto!important;
  overflow:hidden!important;
  border-radius:14px!important;
  background:#111!important;
  box-shadow:0 10px 28px rgba(0,0,0,.14)!important;
}

.product-details-carousel__zoom > a{
  display:block!important;
  width:100%!important;
}

.product-details-carousel__zoom img{
  display:block!important;
  width:100%!important;
  max-width:520px!important;
  height:auto!important;
  margin:0 auto!important;
  object-fit:cover!important;
  border-radius:14px!important;
}

/* tulisan click/tap zoom dibuat kecil */
.product-details-carousel__zoom-text{
  padding:6px 10px!important;
  background:#fff!important;
  color:#6b6d73!important;
  font-size:11px!important;
  text-align:center!important;
}

/*
 Thumbnail memakai foto yang sama dan saat vendor CSS gagal
 membesar seperti gambar utama. Untuk template ini tidak dibutuhkan.
*/
.glider-slider--thumb,
.product-details-carousel--track,
#gallery-product-thumb,
.product-details-carousel__thumbnail{
  display:none!important;
}

/* jaga gallery wrapper supaya tidak punya tinggi kosong */
.product-details-carousel__track,
.js-glider-thumb{
  min-height:0!important;
  height:auto!important;
}

/* ==========================================================
   PRODUCT RECOMMENDATIONS - GAMBAR LEBIH KECIL
   ========================================================== */
.product-recommendations-carousel{
  max-width:1000px!important;
}

.product-recommendations-carousel .glider-track{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:14px!important;
}

.product-recommendations-carousel .product__thumb{
  max-width:210px!important;
  margin:0 auto 10px!important;
}

.product-recommendations-carousel .product__image img{
  width:100%!important;
  max-width:210px!important;
  aspect-ratio:1/1!important;
  object-fit:cover!important;
  margin:0 auto!important;
}

/* ecommerce teks yang tidak relevan di card */
.product-recommendations-carousel .price-missing__pbp,
.product-recommendations-carousel .price,
.product-recommendations-carousel .plp__product-quantity,
.product-recommendations-carousel [itemprop="sku"]{
  display:none!important;
}

/* ==========================================================
   FOOTER V4
   ========================================================== */
footer{
  margin-top:34px!important;
  padding:0!important;
  background:#0c0c0f!important;
  color:#ddd!important;
}

.footer__inner{
  width:100%!important;
  padding:34px 0 26px!important;
  background:#0c0c0f!important;
}

.footer__inner > .container{
  width:100%!important;
  max-width:1100px!important;
  margin:0 auto!important;
  padding:0 20px!important;
}

.footer__inner .accordion.col-12{
  width:100%!important;
}

.footer__inner .accordion > .row,
.footer__inner .row.m-0{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:30px!important;
  width:100%!important;
  margin:0!important;
}

.footer__section,
.footer__section.col-12,
.footer__section.col-lg-3{
  width:100%!important;
  max-width:none!important;
  padding:0!important;
  margin:0!important;
}

.footer__heading,
.footer__heading--accordion{
  display:block!important;
  margin:0 0 13px!important;
  padding:0 0 9px!important;
  border-bottom:1px solid rgba(255,255,255,.13)!important;
  color:#fff!important;
  font-size:14px!important;
  font-weight:800!important;
  line-height:1.3!important;
}

.footer__list{
  display:block!important;
  margin:0!important;
  padding:0!important;
  list-style:none!important;
}

.footer__list li{
  margin:0!important;
  padding:0!important;
}

.footer__list a,
.footer__list li{
  color:#bfc0c5!important;
  font-size:12px!important;
  line-height:1.45!important;
}

.footer__list a{
  display:block!important;
  padding:4px 0!important;
  transition:color .18s ease!important;
}

.footer__list a:hover{
  color:#fff!important;
}

/* jangan accordion desktop mengecil / menutup */
@media (min-width:768px){
  footer .accordion-toggle__inner,
  footer .js-accordion-content,
  footer .accordion-toggle__content{
    display:block!important;
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
  }
}

/* copyright / footer paling bawah */
footer hr{
  border:0!important;
  border-top:1px solid rgba(255,255,255,.13)!important;
}

.footer__bottom,
.footer__copyright,
footer [class*="copyright"]{
  width:100%!important;
  max-width:1100px!important;
  margin:0 auto!important;
  padding:13px 20px!important;
  color:#9b9ca2!important;
  font-size:11px!important;
  text-align:center!important;
}

/* karakter encoding ©/® tidak bisa dibetulkan dengan CSS,
   tapi bar dibuat rapi secara visual */
footer > .container:last-child,
footer .footer__bottom{
  border-top:1px solid rgba(255,255,255,.10)!important;
}

/* ==========================================================
   TABLET
   ========================================================== */
@media (max-width:991.98px){
  .product-details-carousel,
  .js-glider-slider:not(.glider-slider--thumb),
  .glider-slider__slide,
  .product-details-carousel__zoom{
    max-width:460px!important;
  }

  .product-details-carousel__zoom img{
    max-width:460px!important;
  }

  .product-recommendations-carousel .glider-track{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .footer__inner .accordion > .row,
  .footer__inner .row.m-0{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:24px!important;
  }
}

/* ==========================================================
   MOBILE
   ========================================================== */
@media (max-width:575.98px){
  .product-details-carousel,
  .js-glider-slider:not(.glider-slider--thumb),
  .glider-slider__slide,
  .product-details-carousel__zoom{
    width:100%!important;
    max-width:360px!important;
  }

  .product-details-carousel__zoom{
    margin:12px auto!important;
    border-radius:10px!important;
  }

  .product-details-carousel__zoom img{
    width:100%!important;
    max-width:360px!important;
    border-radius:10px!important;
  }

  .product-recommendations-carousel .glider-track{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:9px!important;
  }

  .product-recommendations-carousel .product__thumb,
  .product-recommendations-carousel .product__image img{
    max-width:150px!important;
  }

  .product-recommendations-carousel .product__name{
    font-size:12px!important;
  }

  .footer__inner{
    padding:24px 0 85px!important;
  }

  .footer__inner > .container{
    padding:0 15px!important;
  }

  .footer__inner .accordion > .row,
  .footer__inner .row.m-0{
    grid-template-columns:1fr!important;
    gap:18px!important;
  }

  .footer__heading,
  .footer__heading--accordion{
    margin-bottom:7px!important;
    padding-bottom:7px!important;
  }

  .footer__list a{
    padding:3px 0!important;
  }
}