/* SHEIN homepage — clean black / white / coral */
:root{
  --ink:#111;
  --accent:#E10600;
  --line:#f0f0f0;
  --muted:#8a8a8a;
}

/* ===== Header: Thaimart red, white logo ===== */
header.sticky.bg-black{
  background:#E10600 !important;
  color:#fff !important;
  border-bottom:1px solid rgba(0,0,0,.08) !important;
}
header.sticky.bg-black > div.bg-black{
  background:#E10600 !important;
  color:#fff !important;
  border-bottom:1px solid rgba(255,255,255,.15) !important;
}
header.sticky.bg-black button,
header.sticky.bg-black a{
  color:#fff !important;
}
header.sticky.bg-black a[href="/cart"] span,
header.sticky.bg-black a[href="/wishlist"] span{
  background:#fff !important;
  color:#000 !important;
}
header.sticky.bg-black .bg-white\/15{
  background:rgba(255,255,255,.15) !important;
}
header.sticky.bg-black nav.container-custom{
  padding-left:12px !important;
  padding-right:12px !important;
}
header.sticky.bg-black nav.container-custom > div.flex{
  position:relative !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  min-height:56px !important;
  gap:.4rem !important;
}
header.sticky.bg-black nav button,
header.sticky.bg-black nav a[href="/cart"],
header.sticky.bg-black nav a[href="/wishlist"],
header.sticky.bg-black nav a[href="/login"]{
  position:relative !important;
  z-index:3 !important;
  flex-shrink:0 !important;
}
/* Logo sits in the free gap between the menu and the icons, and shrinks instead of covering them */
header.sticky.bg-black nav a[href="/"]{
  position:static !important;
  transform:none !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  flex:0 0 auto !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  z-index:1 !important;
  max-width:88px !important;
}
header.sticky.bg-black nav img[alt="Thaimart"]{
  display:block !important;
  height:auto !important;
  width:auto !important;
  max-height:1.7rem !important;
  max-width:88px !important;
  margin:0 !important;
  object-fit:contain !important;
  object-position:left center !important;
  filter:none !important;
}
@media (min-width:1024px){
  header.sticky.bg-black nav a[href="/"]{
    max-width:150px !important;
    margin:0 .35rem 0 0 !important;
  }
  header.sticky.bg-black nav img[alt="Thaimart"]{
    max-height:2rem !important;
    max-width:150px !important;
  }
}
header.sticky.bg-black .flex.items-center.gap-2,
header.sticky.bg-black .flex.items-center.gap-1\.5,
header.sticky.bg-black .flex.items-center.shrink-0{
  flex-shrink:0 !important;
  max-width:42% !important;
}
header.sticky.bg-black a[href="/login"]{
  background:#fff !important;
  color:#E10600 !important;
  border:1px solid #fff !important;
  border-radius:999px !important;
  font-weight:600 !important;
  font-size:.75rem !important;
  min-height:30px;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  padding:.3rem .75rem !important;
  white-space:nowrap !important;
}
@media (max-width:1023px){
  header.sticky.bg-black a[href="/login"]{
    font-size:0 !important;
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
    padding:0 !important;
    background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E10600' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='8' r='3.2'/%3E%3Cpath d='M5 19.2c1.4-2.8 3.8-4.2 7-4.2s5.6 1.4 7 4.2'/%3E%3C/svg%3E") center / 16px no-repeat !important;
  }
}

/* ===== Hero: 1024×316 banners, no crop ===== */
.shein-hero{
  position:relative !important;
  width:calc(100% - 24px) !important;
  margin:10px 12px 0 !important;
  padding:0 !important;
  max-height:none !important;
  border-radius:16px !important;
  box-shadow:none !important;
  aspect-ratio:1024 / 316 !important;
  background:#E10600 !important;
  overflow:hidden !important;
}
.shein-hero > div.absolute.inset-0{
  inset:0 !important;
}
.shein-hero-img{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
  opacity:1 !important;
  pointer-events:none !important;
}
.shein-hero-shade,
.shein-hero .shein-hero-copy,
.shein-hero .hidden,
.shein-hero a:not(.shein-hero-hit),
.shein-hero button{
  display:none !important;
}
.shein-hero-hit{
  position:absolute !important;
  inset:0 !important;
  z-index:10 !important;
  display:block !important;
  background:transparent !important;
}

/* ===== Trust / features strip ===== */
.border-b.border-primary-100.bg-white{
  background:#fff !important;
  border-color:var(--line) !important;
  padding:.7rem 0 .85rem !important;
}
.border-b.border-primary-100 .grid{
  gap:.55rem .85rem !important;
}
.border-b.border-primary-100 .text-secondary-800{
  color:var(--ink) !important;
  font-weight:700 !important;
  font-size:.78rem !important;
  line-height:1.25 !important;
}
.border-b.border-primary-100 .text-secondary-500{
  color:var(--muted) !important;
  font-size:.65rem !important;
  line-height:1.3 !important;
}
.border-b.border-primary-100 .text-primary-600{ color:var(--accent) !important; }
.border-b.border-primary-100 svg{
  width:1.25rem !important;
  height:1.25rem !important;
  flex-shrink:0 !important;
}

/* ===== Sections ===== */
.section-padding{
  background:#fff !important;
  padding-top:1.15rem !important;
  padding-bottom:1.35rem !important;
}
.section-padding .flex.items-end.justify-between,
.section-padding .flex.items-center.justify-between{
  align-items:flex-end !important;
  gap:.75rem !important;
  flex-wrap:nowrap !important;
}
.section-padding .flex.items-end.justify-between > a,
.section-padding .flex.items-center.justify-between > a{
  flex-shrink:0 !important;
  white-space:nowrap !important;
  font-size:.8125rem !important;
}
.section-padding img.object-cover{ border-radius:6px !important; }
.section-padding a.group.relative,
.section-padding a.relative.block{
  border-radius:8px !important;
  overflow:hidden !important;
}
.section-padding a.group.relative img,
.section-padding a.relative.block img{
  aspect-ratio:3 / 4 !important;
  object-fit:cover !important;
}

.text-primary-600,.text-primary-700{ color:var(--accent) !important; }
.bg-primary-500,.bg-primary-600{ background-color:var(--accent) !important; }
nav.fixed .text-primary-600{ color:var(--accent) !important; }
h2.text-secondary-900,.text-secondary-900{ color:var(--ink) !important; }

.rounded-2xl{ border-radius:8px !important; }
.shadow-sm,.shadow-md,.shadow-xl{ box-shadow:none !important; }

nav.fixed.bottom-0{
  border-top:1px solid #eee !important;
  background:#fff !important;
}

.shein-auth-page{ background:#fff !important; }
.shein-auth-page .input{
  border-width:1px !important; border-color:#e5e5e5 !important; border-radius:12px !important;
  background:#fafafa !important;
}
.shein-auth-submit{ background:#000 !important; color:#fff !important; border-radius:999px !important; }
body:has(.shein-auth-page) header a[href="/login"],
body:has(.shein-auth-page) footer,
body:has(.shein-auth-page) nav.fixed.bottom-0{ display:none !important; }
.shein-logo-light{ filter:invert(1) !important; }

body{ background:#f4f4f4; }

/* Search pill in the red header */
header.sticky.bg-black .tm-search{
  flex:1 1 auto !important;
  min-width:0 !important;
  margin:0 !important;
}
header.sticky.bg-black .tm-search-pill{
  display:flex !important;
  align-items:center !important;
  height:36px !important;
  background:#fff !important;
  border-radius:999px !important;
  padding:0 4px 0 12px !important;
  gap:2px !important;
}
header.sticky.bg-black .tm-search-input{
  flex:1 1 auto !important;
  width:100% !important;
  min-width:0 !important;
  border:0 !important;
  outline:none !important;
  background:transparent !important;
  color:#222 !important;
  font-size:14px !important;
  padding:0 !important;
  box-shadow:none !important;
}
header.sticky.bg-black .tm-search-input::placeholder{ color:#9a9a9a !important; }
header.sticky.bg-black .tm-search-btn{
  width:30px !important;
  height:30px !important;
  border:0 !important;
  border-radius:999px !important;
  background:transparent !important;
  color:#E10600 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:0 !important;
  flex-shrink:0 !important;
}
header.sticky.bg-black .tm-search-ico{
  width:18px !important;
  height:18px !important;
  display:block !important;
}

/* Category circles — photos from this shop */
.tm-cats{
  background:#fff !important;
  padding:12px 0 2px !important;
}
.tm-cats-row{
  display:flex !important;
  gap:12px !important;
  overflow-x:auto !important;
  padding:2px 14px 12px !important;
  scrollbar-width:none !important;
}
.tm-cats-row::-webkit-scrollbar{ display:none !important; }
.tm-cat{
  flex:0 0 68px !important;
  width:68px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  gap:6px !important;
  text-decoration:none !important;
  color:#222 !important;
}
.tm-cat-ico{
  width:58px !important;
  height:58px !important;
  border-radius:50% !important;
  overflow:hidden !important;
  background:#f3f3f3 !important;
  border:1px solid #eee !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
.tm-cat-all .tm-cat-ico{
  background:#E10600 !important;
  border-color:#E10600 !important;
  color:#fff !important;
  font-size:11px !important;
  font-weight:700 !important;
}
.tm-cat-ico img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
}
.tm-cat-name{
  font-size:11px !important;
  line-height:1.25 !important;
  text-align:center !important;
  color:#333 !important;
  max-width:72px !important;
  display:-webkit-box !important;
  -webkit-line-clamp:2 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
}

/* Product cards: white, rounded, red price */
a.group.block.h-full > div{
  border:none !important;
  border-radius:12px !important;
  background:#fff !important;
  box-shadow:0 1px 4px rgba(0,0,0,.06) !important;
  overflow:hidden !important;
}
a.group.block.h-full .aspect-\[4\/5\]{
  aspect-ratio:1 / 1 !important;
  background:#f7f7f7 !important;
  border-radius:12px 12px 0 0 !important;
}
a.group.block.h-full .p-3\.5 .uppercase,
a.group.block.h-full .tracking-\[0\.14em\]{
  display:none !important;
}
a.group.block.h-full h3{
  color:#222 !important;
  font-size:13px !important;
  min-height:2.4em !important;
}
a.group.block.h-full .text-\[\#2a2118\]{
  color:#E10600 !important;
  font-weight:700 !important;
}
