/* IndoMarket UAE v4.2.5 — professional Indonesia red-and-white design system */
:root{
  --id-red:#c8102e;
  --id-red-dark:#981027;
  --id-red-deep:#6f0b1d;
  --id-red-soft:#fff1f3;
  --id-red-faint:#fff8f9;
  --id-white:#fff;
  --id-ink:#182230;
  --id-slate:#344054;
  --id-muted:#667085;
  --id-line:#e4e7ec;
  --id-soft:#f7f8fa;
  --id-success:#237a4b;
  --id-warning:#9a6700;

  --ink:var(--id-ink);
  --muted:var(--id-muted);
  --line:var(--id-line);
  --soft:var(--id-soft);
  --surface:var(--id-white);
  --brand:var(--id-red);
  --brand-dark:var(--id-red-dark);
  --accent:#f2c94c;
  --danger:#b42318;
  --logo-red:var(--id-red);
  --logo-green:var(--id-success);
  --logo-orange:#c46a0a;
  --logo-cream:var(--id-red-soft);
  --shadow:0 18px 48px rgba(24,34,48,.11);
  --shadow-sm:0 8px 24px rgba(24,34,48,.07);
  --shadow-md:0 20px 55px rgba(24,34,48,.13);
  --focus-ring:0 0 0 4px rgba(200,16,46,.17);
}

html{accent-color:var(--id-red)}
body{
  background:linear-gradient(180deg,#fff 0%,#fbfbfc 58%,#f7f8fa 100%);
  color:var(--id-ink);
}
body::selection{background:rgba(200,16,46,.18);color:var(--id-ink)}
a{accent-color:var(--id-red)}

/* Header and public navigation */
.announcement{
  background:linear-gradient(100deg,var(--id-red-deep) 0%,var(--id-red) 58%,#dc2947 100%);
  color:#fff;
}
.announcement a{color:#fff;text-decoration-color:rgba(255,255,255,.62)}
.site-header{background:rgba(255,255,255,.97);border-bottom-color:var(--id-line)}
.site-nav{background:#fff;border-top-color:var(--id-line)}
.brand-mark,.login-brand span,.invoice-brand>span{
  background:var(--id-red);
  border:1px solid rgba(200,16,46,.2);
  color:#fff;
  box-shadow:inset 0 -5px 0 #fff,0 7px 18px rgba(200,16,46,.18);
  text-shadow:0 1px 1px rgba(0,0,0,.18);
}
.brand small,.invoice-brand small{color:var(--id-red)}
.search-bar{border-color:#d9dde5;background:#fff;box-shadow:0 6px 20px rgba(24,34,48,.045)}
.search-bar:focus-within{border-color:rgba(200,16,46,.65);box-shadow:var(--focus-ring)}
.search-bar input{background:#fff;color:var(--id-ink)}
.search-bar button{background:var(--id-red)}
.search-bar button:hover{background:var(--id-red-dark)}
.language-switcher{border-color:#e1e4ea;background:#fff}
.language-switcher a:hover{background:var(--id-red-soft);color:var(--id-red)}
.language-switcher a.active{background:var(--id-red);color:#fff}
.theme-toggle:hover,.utility-link:hover{border-color:#efb3bd;background:var(--id-red-soft);color:var(--id-red)}
.cart-button span,.wishlist-count{background:var(--id-red);color:#fff}

.site-nav-modern{
  border-color:rgba(200,16,46,.1);
  background:rgba(255,255,255,.94);
  box-shadow:0 10px 30px rgba(24,34,48,.055);
}
.site-nav-modern .nav-modern-link,
.site-nav-modern .nav-modern-trigger{color:#3d4654}
.site-nav-modern .nav-modern-link:hover,
.site-nav-modern .nav-modern-trigger:hover{
  border-color:rgba(200,16,46,.16);
  background:var(--id-red-faint);
  color:var(--id-red);
}
.site-nav-modern .nav-modern-link.active,
.site-nav-modern .nav-modern-menu.active>.nav-modern-trigger,
.site-nav-modern .nav-modern-menu[open]>.nav-modern-trigger{
  border-color:rgba(200,16,46,.2);
  background:linear-gradient(135deg,#fff0f2,#fff8f9);
  color:var(--id-red-dark);
  box-shadow:inset 0 0 0 1px rgba(200,16,46,.035),0 8px 18px rgba(200,16,46,.08);
}
.site-nav-modern .nav-modern-popover{
  border-color:rgba(200,16,46,.13);
  background:rgba(255,255,255,.985);
  box-shadow:0 28px 70px rgba(24,34,48,.18);
}
.site-nav-modern .nav-category-item:hover,
.site-nav-modern .nav-help-popover a:hover{background:var(--id-red-faint);color:var(--id-red-dark)}
.site-nav-modern .nav-category-icon,
.site-nav-modern .nav-help-popover a>span:first-child{background:linear-gradient(145deg,#fff0f2,#fff)}
.site-nav-modern .nav-category-item b{color:var(--id-red)}
.site-nav-modern .nav-track-link{border-color:var(--id-red);background:var(--id-red);box-shadow:0 9px 20px rgba(200,16,46,.2)}
.site-nav-modern .nav-track-link:hover,
.site-nav-modern .nav-track-link.active{border-color:var(--id-red-dark);background:var(--id-red-dark);box-shadow:0 12px 26px rgba(200,16,46,.25)}

/* General components */
.eyebrow,.inline-link,.breadcrumb a,.category-card b,.product-category,.row-actions a,.admin-stat a,.admin-panel-head a{color:var(--id-red)}
.button-primary,.button:not(.button-outline):not(.button-ghost):not(.button-secondary){background:var(--id-red);color:#fff}
.button-primary:hover,.button:not(.button-outline):not(.button-ghost):not(.button-secondary):hover{background:var(--id-red-dark)}
.button-outline,.button-ghost{border-color:#d6dae2;background:#fff;color:var(--id-slate)}
.button-outline:hover,.button-ghost:hover{border-color:#efabb6;background:var(--id-red-soft);color:var(--id-red-dark)}
.button-secondary{border-color:#efc6cd;background:#fff4f5;color:var(--id-red-dark)}
.button-secondary:hover{background:#ffe5e9}
.alert-success{background:#edf8f2;color:#17663b;border-color:#ccebd9}
.alert-error{background:#fff1f0;color:#a61b12;border-color:#f3c8c5}
.toast{background:#273142}
.toast-error{background:var(--id-red-dark)}
.filter-pill:hover,.filter-pill.active{border-color:var(--id-red);background:var(--id-red);color:#fff}
.pagination strong{background:var(--id-red);border-color:var(--id-red);color:#fff}

/* Hero, sections, cards */
.hero{
  background:
    radial-gradient(circle at 82% 18%,rgba(200,16,46,.13),transparent 29%),
    linear-gradient(145deg,#fff1f3 0%,#fff 54%,#f7f8fa 100%);
}
.hero-card-main{background:linear-gradient(145deg,var(--id-red-deep),var(--id-red) 68%,#e24961)}
.hero-card-small{background:#fff;border-color:#eceef2}
.notice-banner{background:#fff8f9;border-color:#f1c7ce;color:#6f2430}
.section-soft{background:linear-gradient(180deg,#fafafa,#f5f6f8)}
.page-hero,.faq-page-hero{background:linear-gradient(145deg,#fff1f3 0%,#fff 58%,#f6f7f9 100%)}
.category-card{border-color:var(--id-line);background:#fff}
.category-card:hover{border-color:#e5a4af;box-shadow:0 12px 28px rgba(200,16,46,.09)}
.category-icon{background:var(--id-red-soft)}

/* Product cards: tighter, cleaner rhythm directly below the image */
.product-grid{align-items:start}
.product-card{
  align-self:start;
  height:auto;
  border-color:#e2e5ea;
  background:#fff;
  box-shadow:0 3px 0 rgba(24,34,48,.02);
}
.product-card:hover{border-color:#e7a8b3;box-shadow:0 18px 42px rgba(24,34,48,.12)}
.product-media{background:linear-gradient(145deg,#fff,#f5f6f8)}
.product-card-body{
  flex:0 0 auto;
  padding:13px 16px 16px;
}
.product-category{
  display:block;
  margin:0 0 5px;
  font-size:.72rem;
  line-height:1.25;
}
.product-card h3{
  min-height:0;
  margin:0 0 6px;
  font-size:1.02rem;
  line-height:1.32;
}
.product-card h3 a:hover{color:var(--id-red)}
.product-card-description{
  min-height:0!important;
  margin:0 0 9px!important;
  color:var(--id-muted);
  line-height:1.4;
}
.product-price{
  margin:0 0 12px;
  color:var(--id-red);
  font-size:1.17rem;
  line-height:1.12;
}
.product-card-bottom{
  margin-top:0;
  padding-top:0;
}
.stock-ok{background:#eaf6ef;color:#246b42}
.stock-low{background:#fff6dc;color:#8a6612}
.stock-out{background:#fff0ef;color:#a23833}
.featured-badge{background:var(--id-red);color:#fff}
.product-watermarked::after{background:rgba(111,11,29,.76);border-color:rgba(255,255,255,.66)}
.detail-price{color:var(--id-red)!important}

/* Home modules and footer */
.uae-delivery-strip{border-color:#efc3ca;background:#fff7f8;box-shadow:0 10px 24px rgba(200,16,46,.07)}
.uae-delivery-icon{background:#ffe7eb}
.uae-delivery-strip strong,.uae-delivery-strip b{color:var(--id-red)}
.pawon-promo{border-color:#e3e6eb;background:linear-gradient(135deg,#fff,#f6f7f9)}
.home-slider{border-color:rgba(200,16,46,.18);background:var(--id-red-deep);box-shadow:0 18px 46px rgba(111,11,29,.2)}
.home-slide-tone-1{background:linear-gradient(118deg,#670b1b 0%,#a80f29 52%,#d8314d 100%)}
.home-slide-tone-2{background:linear-gradient(118deg,#1f2937 0%,#3b1d25 48%,#c8102e 100%)}
.home-slide-tone-3{background:linear-gradient(118deg,#8f1024 0%,#c8102e 55%,#ea6074 100%)}
.home-slider-arrow:hover{background:var(--id-red);border-color:var(--id-red)}
.home-slider-dot.is-active{background:#fff}
.site-footer{background:linear-gradient(135deg,#171b24 0%,#242833 62%,#59101f 145%);color:#f8f9fb}
.footer-brand .brand-mark{background:var(--id-red);color:#fff;box-shadow:inset 0 -5px 0 #fff,0 7px 18px rgba(0,0,0,.18)}
.site-footer p,.footer-bottom{color:#cbd1da}
.site-footer a{color:#f5f6f8}
.site-footer a:hover,.footer-partner-link{color:#ff9bab!important}

/* Forms, account and checkout */
.checkout-card,.summary-card,.contact-card,.account-card,.customer-auth-card,.faq-item{border-color:var(--id-line);background:#fff}
.checkout-form input:focus,.checkout-form textarea:focus,.checkout-form select:focus,
.form-panel input:focus,.form-panel textarea:focus,.form-panel select:focus{border-color:var(--id-red);box-shadow:var(--focus-ring)}
.radio-card:has(input:checked){border-color:var(--id-red);box-shadow:0 0 0 3px rgba(200,16,46,.1)}
.tracking-review-cta{background:linear-gradient(135deg,rgba(200,16,46,.08),rgba(255,255,255,.9));border-color:rgba(200,16,46,.16)}
.testimonial-avatar{background:linear-gradient(145deg,var(--id-red-dark),var(--id-red))}
.testimonial-order-verified{border-color:rgba(200,16,46,.24);background:rgba(200,16,46,.06)}
.testimonial-order-verified>span{background:var(--id-red)}

/* Admin */
.admin-body{background:#f5f6f8}
.admin-sidebar{background:linear-gradient(180deg,#171b24 0%,#252a35 68%,#671022 135%);color:#f5f6f8}
.admin-brand>span{background:var(--id-red);color:#fff;box-shadow:inset 0 -4px 0 #fff}
.admin-sidebar nav a:hover,.admin-sidebar nav a.active{background:rgba(255,255,255,.1);box-shadow:inset 3px 0 0 #ff6b7d}
.admin-panel,.admin-stat,.login-card{border-color:var(--id-line);background:#fff;box-shadow:0 12px 30px rgba(24,34,48,.06)}
.admin-panel th{background:#f7f8fa}
.selected-row{background:#fff1f3}
.login-body{background:linear-gradient(145deg,#fff1f3 0%,#fff 52%,#f2f4f7 100%)}
.invoice-header{border-bottom-color:var(--id-red)}
.invoice-label{color:var(--id-red)!important}
.invoice-grand-total{border-top-color:var(--id-red)}

/* Dark mode keeps red as the brand while using neutral charcoal surfaces. */
html[data-theme="dark"]{
  --ink:#f3f5f7;
  --muted:#aeb7c4;
  --line:#343b49;
  --soft:#1a202b;
  --surface:#111720;
  --brand:#ff5b70;
  --brand-dark:#ff7c8d;
  --logo-red:#ff5b70;
  --danger:#ff6b6b;
  --focus-ring:0 0 0 4px rgba(255,91,112,.2);
}
html[data-theme="dark"] body{background:#0d1118;color:#f3f5f7}
html[data-theme="dark"] .announcement{background:linear-gradient(100deg,#5d0a19,#8f1024 62%,#b51732)}
html[data-theme="dark"] .site-header,
html[data-theme="dark"] .site-nav-modern{background:rgba(14,18,25,.95);border-color:rgba(255,255,255,.08)}
html[data-theme="dark"] .search-bar,
html[data-theme="dark"] .language-switcher,
html[data-theme="dark"] .product-card,
html[data-theme="dark"] .category-card,
html[data-theme="dark"] .admin-panel,
html[data-theme="dark"] .admin-stat,
html[data-theme="dark"] .login-card{background:#151b25;border-color:#343b49}
html[data-theme="dark"] .search-bar input{background:#151b25;color:#f3f5f7}
html[data-theme="dark"] .site-nav-modern .nav-modern-link:hover,
html[data-theme="dark"] .site-nav-modern .nav-modern-trigger:hover,
html[data-theme="dark"] .site-nav-modern .nav-modern-link.active,
html[data-theme="dark"] .site-nav-modern .nav-modern-menu.active>.nav-modern-trigger,
html[data-theme="dark"] .site-nav-modern .nav-modern-menu[open]>.nav-modern-trigger{border-color:rgba(255,91,112,.3);background:#36141d;color:#ffdce1}
html[data-theme="dark"] .site-nav-modern .nav-modern-popover{background:rgba(20,26,35,.99);border-color:#3b4352}
html[data-theme="dark"] .site-nav-modern .nav-category-icon,
html[data-theme="dark"] .site-nav-modern .nav-help-popover a>span:first-child{background:#34151d}
html[data-theme="dark"] .hero{background:radial-gradient(circle at 82% 18%,rgba(255,91,112,.15),transparent 29%),linear-gradient(145deg,#271017,#0d1118 56%,#171b24)}
html[data-theme="dark"] .section-soft,
html[data-theme="dark"] .page-hero,
html[data-theme="dark"] .faq-page-hero{background:#151b25}
html[data-theme="dark"] .product-media{background:linear-gradient(145deg,#1b222d,#121821)}
html[data-theme="dark"] .button-outline,
html[data-theme="dark"] .button-ghost{border-color:#465061;background:#151b25;color:#e9edf2}
html[data-theme="dark"] .button-outline:hover,
html[data-theme="dark"] .button-ghost:hover{border-color:#a33e50;background:#35151e;color:#ffdce1}
html[data-theme="dark"] .admin-body{background:#0d1118}
html[data-theme="dark"] .admin-panel th{background:#1a202b}
html[data-theme="dark"] .login-body{background:linear-gradient(145deg,#251017,#0d1118 55%,#171b24)}
html[data-theme="dark"] .site-footer{background:#090c11}

@media(max-width:760px){
  .product-card-body{padding:11px 13px 14px}
  .product-card h3{font-size:.94rem;margin-bottom:5px}
  .product-card-description{margin-bottom:8px!important}
  .product-price{margin-bottom:10px;font-size:1.05rem}
}

@media print{
  :root{--brand:#c8102e;--brand-dark:#981027}
}

/* IndoMarket UAE v4.2.6 — global foreground contrast guarantees */
:root{--id-on-brand:#fff}

/* Solid red controls must always use a high-contrast foreground. */
.site-nav-modern .nav-track-link,
.site-nav-modern .nav-track-link:hover,
.site-nav-modern .nav-track-link:focus,
.site-nav-modern .nav-track-link:focus-visible,
.site-nav-modern .nav-track-link.active,
.site-nav-modern .nav-track-link[aria-current="page"],
.search-bar button,
.language-switcher a.active,
.button-primary,
.button-danger,
.button:not(.button-outline):not(.button-ghost):not(.button-secondary):not(.button-link-danger),
.filter-pill:hover,
.filter-pill.active,
.pagination strong,
.featured-badge,
.home-slider-arrow:hover,
.testimonial-order-verified>span,
.auto-register-icon,
.faq-item[open] .faq-item-icon,
.restore-safety-list strong{
  color:var(--id-on-brand)!important;
}

/* Icons inherit the same readable foreground as their parent control. */
.site-nav-modern .nav-track-link span,
.site-nav-modern .nav-track-link svg,
.site-nav-modern .nav-track-link svg *,
.search-bar button svg,
.search-bar button svg *,
.button-primary svg,
.button-primary svg *,
.button-danger svg,
.button-danger svg *,
.button:not(.button-outline):not(.button-ghost):not(.button-secondary):not(.button-link-danger) svg,
.button:not(.button-outline):not(.button-ghost):not(.button-secondary):not(.button-link-danger) svg *{
  color:inherit!important;
  stroke:currentColor;
}

/* Preserve a visible keyboard focus ring on saturated CTA backgrounds. */
.site-nav-modern .nav-track-link:focus-visible,
.search-bar button:focus-visible,
.button-primary:focus-visible,
.button-danger:focus-visible,
.button:not(.button-outline):not(.button-ghost):not(.button-secondary):not(.button-link-danger):focus-visible{
  outline:3px solid #fff;
  outline-offset:2px;
  box-shadow:0 0 0 5px rgba(200,16,46,.28);
}

html[data-theme="dark"]{--id-on-brand:#fff}
html[data-theme="dark"] .site-nav-modern .nav-track-link,
html[data-theme="dark"] .site-nav-modern .nav-track-link:hover,
html[data-theme="dark"] .site-nav-modern .nav-track-link:focus-visible,
html[data-theme="dark"] .site-nav-modern .nav-track-link.active,
html[data-theme="dark"] .site-nav-modern .nav-track-link[aria-current="page"]{
  border-color:#d91f3d;
  background:#d91f3d;
  color:#fff!important;
}
html[data-theme="dark"] .site-nav-modern .nav-track-link:hover,
html[data-theme="dark"] .site-nav-modern .nav-track-link.active{
  border-color:#b91531;
  background:#b91531;
}


/* IndoMarket UAE v4.2.7 — mobile header brand visibility */
@media(max-width:520px){
  .site-header .header-row{
    grid-template-columns:minmax(92px,1fr) max-content !important;
    grid-template-areas:"brand actions" "search search" !important;
    column-gap:7px;
  }
  .site-header .brand{
    display:inline-flex !important;
    min-width:0;
    max-width:118px;
    gap:5px;
    overflow:visible;
    white-space:nowrap;
  }
  .site-header .brand>span:last-child{
    display:block !important;
    min-width:0;
  }
  .site-header .brand-mark{
    flex:0 0 30px;
    width:30px;
    height:30px;
    border-radius:9px;
    font-size:.72rem;
  }
  .site-header .brand strong{
    display:block;
    overflow:hidden;
    max-width:78px;
    font-size:.78rem;
    letter-spacing:-.035em;
    line-height:1.05;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .site-header .brand small{
    display:block;
    margin-top:2px;
    font-size:.52rem;
    line-height:1;
    letter-spacing:.08em;
    white-space:nowrap;
  }
  .site-header .brand-logo-image{
    display:block;
    width:auto;
    max-width:112px;
    height:32px;
    object-fit:contain;
    object-position:left center;
  }
  .site-header .header-actions{
    gap:3px;
    min-width:0;
  }
  .site-header .theme-toggle,
  .site-header .utility-link{
    width:30px;
    height:30px;
    min-width:30px;
    min-height:30px;
    border-radius:9px;
  }
  .site-header .language-switcher{
    flex:0 0 auto;
    gap:1px;
    padding:2px;
  }
  .site-header .language-switcher a{
    min-width:23px;
    height:24px;
    padding:0 4px;
    font-size:.68rem;
  }
  .site-header .header-icon,
  .site-header .theme-toggle svg{
    width:17px;
    height:17px;
  }
  .site-header .wishlist-count,
  .site-header .cart-button span[data-cart-count]{
    right:-6px;
    top:-7px;
    min-width:18px;
    height:18px;
    font-size:.61rem;
  }
}

@media(max-width:360px){
  .site-header .header-row{
    grid-template-columns:1fr !important;
    grid-template-areas:"brand" "actions" "search" !important;
    row-gap:9px;
  }
  .site-header .brand{
    justify-self:center;
    max-width:150px;
  }
  .site-header .brand strong{max-width:104px;font-size:.86rem}
  .site-header .brand small{font-size:.56rem}
  .site-header .brand-logo-image{max-width:145px;height:34px}
  .site-header .header-actions{
    width:100%;
    justify-self:stretch;
    justify-content:space-between;
  }
}