/* BalliCubuk UI patch - 2026-08-29
   Loaded last. Keeps Ekomart as the storefront layer and only fixes the
   desktop search, compact mobile header and homepage category cards. */

/* Desktop search: remove Ekomart's fixed input widths and keep one clean control. */
.bc-ek-header .bc-ek-search-wrap{min-width:0!important}
.bc-ek-header .search-header{height:54px!important;display:flex!important;align-items:center!important;width:100%!important;max-width:760px!important;margin:0 auto!important;background:#f7f7f8!important;border:1px solid #e3dfdc!important;border-radius:7px!important;overflow:hidden!important;box-shadow:0 4px 14px rgba(58,43,36,.035)!important}
.bc-ek-header .search-header input[type="search"]{flex:1 1 auto!important;min-width:0!important;width:auto!important;height:52px!important;padding:0 18px!important;border:0!important;border-radius:0!important;background:transparent!important;color:#302724!important;font-size:13px!important;line-height:52px!important;box-shadow:none!important;outline:0!important}
.bc-ek-header .search-header input[type="search"]::placeholder{color:#9a918d!important;opacity:1}
.bc-ek-header .search-header .rts-btn{flex:0 0 auto!important;height:44px!important;min-width:116px!important;margin:4px!important;padding:0 18px!important;border:0!important;border-radius:5px!important;background:#714441!important;color:#fff!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;font-size:13px!important;font-weight:700!important;line-height:1!important;box-shadow:none!important}
.bc-ek-header .search-header .rts-btn:hover{background:#5b342f!important;color:#fff!important}
.bc-ek-header .search-header .arrow-icon{display:inline-flex!important;align-items:center!important;justify-content:center!important;font-size:14px!important}

/* Ekomart's base stylesheet hides .search-header-area-main below 992px.
   That element contains our logo/cart/menu button, so the whole mobile header vanished.
   Keep the wrapper visible and switch it to a compact mobile layout instead. */
@media(max-width:991px){
  .bc-ek-header{display:block!important;position:relative!important;z-index:120!important;background:#fff!important}
  .bc-ek-header .search-header-area-main{display:block!important;visibility:visible!important;opacity:1!important;padding:0!important;background:#fff!important;border-top:0!important;border-bottom:1px solid #ece8e5!important}
  .bc-ek-header .logo-search-category-wrapper.bc-ek-mainline{display:flex!important;align-items:center!important;min-height:74px!important;height:auto!important;gap:10px!important;padding:8px 0!important;background:#fff!important}
  .bc-ek-header .bc-ek-logo{display:flex!important;align-items:center!important;margin-right:auto!important;min-width:0!important}
  .bc-ek-header .bc-ek-logo img{display:block!important;width:auto!important;max-width:150px!important;max-height:54px!important;object-fit:contain!important}
  .bc-ek-header .bc-ek-search-wrap{display:none!important}
  .bc-ek-header .bc-ek-actions{display:flex!important;align-items:center!important;gap:8px!important;margin-left:auto!important}
  .bc-ek-header .bc-ek-actions .account{display:none!important}
  .bc-ek-header .bc-ek-actions .cart{display:flex!important;align-items:center!important;justify-content:center!important;width:42px!important;min-width:42px!important;height:42px!important;padding:0!important;border:1px solid #e7e1dd!important;border-radius:7px!important;background:#fff!important;color:#714441!important;box-shadow:none!important}
  .bc-ek-header .bc-ek-actions .cart>.text{display:none!important}
  .bc-ek-header .bc-ek-actions .cart>i{font-size:18px!important;margin:0!important}
  .bc-ek-header .bc-ek-actions .cart>.number{top:-6px!important;right:-6px!important}
  .bc-ek-header .bc-ek-actions .cart .category-sub-menu{display:none!important}
  .bc-ek-mobile-toggle{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:42px!important;height:42px!important;padding:0!important;border:1px solid #e7e1dd!important;border-radius:7px!important;background:#714441!important;color:#fff!important;font-size:18px!important}
  .bc-ek-navrow{display:none!important}
}
@media(max-width:767px){
  .bc-ek-header .header-top-area{min-height:32px!important}
  .bc-ek-header .bc-ek-logo img{max-width:128px!important;max-height:48px!important}
  .bc-ek-header .logo-search-category-wrapper.bc-ek-mainline{min-height:68px!important}
}

/* Homepage category cards: four calm, fully-clickable cards instead of a carousel. */
.bc4-categories.bc4-category-cards-area{padding-top:34px!important;padding-bottom:34px!important}
.bc4-category-cards-area .cover-card-main-over{padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important}
.bc4-category-cards-area .title-area-between{margin-bottom:18px!important;padding-bottom:0!important;border-bottom:0!important}
.bc4-category-cards-area .title-left{font-size:24px!important;line-height:1.2!important;font-weight:650!important;color:#2f3b27!important;margin:0!important}
.bc4-category-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.bc4-category-card{min-width:0;min-height:96px;display:flex;align-items:center;gap:14px;padding:16px 17px;border:1px solid #e7e3df;border-radius:9px;background:#fff;color:#2f2a27!important;text-decoration:none!important;box-shadow:0 5px 16px rgba(43,35,31,.035);transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}
.bc4-category-card:hover{border-color:#cdb9b1;box-shadow:0 10px 24px rgba(68,45,39,.08);transform:translateY(-2px);color:#2f2a27!important}
.bc4-category-icon{width:58px;height:58px;min-width:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#f7f1ea;border:1px solid #eee1d6;overflow:hidden}
.bc4-category-icon img{width:42px!important;height:42px!important;max-width:42px!important;max-height:42px!important;object-fit:contain!important;margin:0!important}
.bc4-category-icon i{font-size:24px;color:#714441}
.bc4-category-copy{min-width:0;display:flex;flex-direction:column;gap:4px;flex:1}
.bc4-category-copy strong{font-size:14px;line-height:1.25;font-weight:700;color:#2f2a27;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bc4-category-copy small{font-size:11px;line-height:1.2;color:#91847d}
.bc4-category-arrow{width:28px;height:28px;min-width:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#f5f2f0;color:#714441;font-size:11px;transition:.18s ease}
.bc4-category-card:hover .bc4-category-arrow{background:#714441;color:#fff;transform:translateX(2px)}
@media(max-width:991px){.bc4-category-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:575px){
  .bc4-category-cards-area .title-left{font-size:21px!important}
  .bc4-category-cards{grid-template-columns:1fr;gap:10px}
  .bc4-category-card{min-height:82px;padding:12px 13px}
  .bc4-category-icon{width:52px;height:52px;min-width:52px}
  .bc4-category-icon img{width:38px!important;height:38px!important;max-width:38px!important;max-height:38px!important}
}