/* 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:#E10600 !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\],
a.group.block.h-full .text-\[\#E10600\]{
  color:#E10600 !important;
  font-weight:700 !important;
}

/* Thaimart Promo Cards (Seller CTA + Free Shipping Ticket) */
.tm-promos{
  background:#fff !important;
  padding:12px 12px 4px !important;
  display:flex !important;
  flex-direction:column !important;
  gap:10px !important;
}
@media (min-width:768px){
  .tm-promos{
    max-width:1280px !important;
    margin:0 auto !important;
    flex-direction:row !important;
    padding:16px 24px 6px !important;
    gap:16px !important;
  }
  .tm-seller-card,.tm-ship-ticket{ flex:1 1 0% !important; }
}
.tm-seller-card{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:10px !important;
  padding:12px 14px !important;
  border-radius:16px !important;
  background:linear-gradient(135deg,#fff5f5 0%,#ffecec 100%) !important;
  border:1px solid #ffd6d6 !important;
  text-decoration:none !important;
}
.tm-seller-left{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  min-width:0 !important;
}
.tm-seller-ico{
  width:42px !important;
  height:42px !important;
  border-radius:50% !important;
  background:#fff !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:21px !important;
  box-shadow:0 2px 6px rgba(225,6,0,.1) !important;
  flex-shrink:0 !important;
}
.tm-seller-title{
  font-size:13.5px !important;
  font-weight:700 !important;
  color:#111 !important;
  line-height:1.25 !important;
  margin:0 !important;
}
.tm-seller-title .tm-red{ color:#E10600 !important; }
.tm-seller-sub{
  font-size:11.5px !important;
  color:#777 !important;
  margin:2px 0 0 !important;
  line-height:1.25 !important;
}
.tm-seller-btn{
  background:#E10600 !important;
  color:#fff !important;
  font-size:12px !important;
  font-weight:700 !important;
  padding:8px 13px !important;
  border-radius:999px !important;
  white-space:nowrap !important;
  flex-shrink:0 !important;
}

.tm-ship-ticket{
  position:relative !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  padding:12px 16px !important;
  border-radius:16px !important;
  background:linear-gradient(90deg,#fff9f9 0%,#fff 55%,#fff4f4 100%) !important;
  border:1.5px solid #f2b6b4 !important;
  text-decoration:none !important;
  overflow:hidden !important;
}
.tm-ship-left{
  flex:0 0 auto !important;
  padding-right:12px !important;
}
.tm-ship-head{
  display:flex !important;
  align-items:center !important;
  gap:5px !important;
}
.tm-ship-truck{ font-size:16px !important; }
.tm-ship-label{
  font-size:14px !important;
  font-weight:800 !important;
  color:#111 !important;
}
.tm-ship-sub{
  font-size:11.5px !important;
  color:#666 !important;
  margin:2px 0 0 !important;
}
.tm-ship-sep{
  width:0 !important;
  height:42px !important;
  border-left:1.5px dashed #E10600 !important;
  opacity:.55 !important;
  margin:0 10px !important;
  flex-shrink:0 !important;
}
.tm-ship-right{
  flex:1 1 auto !important;
  min-width:0 !important;
  text-align:center !important;
}
.tm-ship-num{
  margin:0 0 5px !important;
  line-height:1.1 !important;
}
.tm-ship-num strong{
  font-size:22px !important;
  font-weight:800 !important;
  color:#E10600 !important;
  letter-spacing:-.02em !important;
}
.tm-ship-num span{
  font-size:13px !important;
  font-weight:600 !important;
  color:#222 !important;
}
.tm-ship-bar{
  width:100% !important;
  height:7px !important;
  background:#eee !important;
  border-radius:999px !important;
  overflow:hidden !important;
}
.tm-ship-fill{
  width:68% !important;
  height:100% !important;
  background:#E10600 !important;
  border-radius:999px !important;
}

/* Global Thaimart Red overrides across all inner pages */
.bg-primary-800,.bg-primary-900{ background-color:#E10600 !important; }
.text-primary-800,.text-primary-900{ color:#E10600 !important; }
.border-primary-800{ border-color:#E10600 !important; }
.btn-primary{
  background:#E10600 !important;
  background-image:none !important;
  color:#fff !important;
  border-radius:999px !important;
}
.btn-primary:hover{
  background:#B80500 !important;
  background-image:none !important;
}
.btn-outline{
  border-color:#E10600 !important;
  color:#E10600 !important;
  border-radius:999px !important;
}
.btn-outline:hover{
  background:#E10600 !important;
  color:#fff !important;
}
a.group.block.h-full span.bg-\[\#000000\]{
  background:#E10600 !important;
}
a.group.block.h-full svg.text-\[\#000000\]{
  color:#f59e0b !important;
}
footer.bg-secondary-900{
  border-top:3px solid #E10600 !important;
}

/* ===== Admin sidebar: dark + clear text (not full red) ===== */
aside.fixed.bg-\[\#000000\],
aside.bg-\[\#000000\]{
  background:#0B0E1E !important;
  background-image:none !important;
  border-right:1px solid rgba(255,255,255,.12) !important;
  color:#f8fafc !important;
}
aside .text-slate-600{
  color:#a1a1aa !important;
}
aside .text-slate-500,
aside .text-slate-400{
  color:#e4e4e7 !important;
}
aside nav a{
  color:#f4f4f5 !important;
  font-weight:550 !important;
}
aside nav a:hover{
  background:rgba(255,255,255,.09) !important;
  color:#fff !important;
}
aside nav a svg{
  color:#fafafa !important;
  opacity:1 !important;
}
aside nav a.bg-\[\#E10600\],
aside nav a.bg-\[\#e10600\],
aside a.bg-\[\#E10600\],
aside nav a.bg-\[\#E10600\]\/15,
aside a.bg-\[\#E10600\]\/15{
  background:rgba(227,35,33,.22) !important;
  color:#fff !important;
  font-weight:700 !important;
}
aside nav a.text-\[\#F0E4B8\],
aside a.text-\[\#F0E4B8\]{
  color:#fff !important;
}
aside nav a.text-slate-400{
  color:#e4e4e7 !important;
}
aside nav a.text-slate-100,
aside nav a:hover.text-slate-100{
  color:#fff !important;
}
aside span.bg-\[\#E10600\]{
  background:#E32321 !important;
}
aside .bg-\[\#142033\]{
  background:#1f2937 !important;
}
aside .ring-\[\#E10600\]{
  --tw-ring-color:rgba(227,35,33,.9) !important;
}

/* Login brand panel stays red */
div.relative.hidden.overflow-hidden.bg-\[\#000000\].lg\:flex{
  background:linear-gradient(160deg,#8B1819 0%,#E32321 48%,#B42026 100%) !important;
}

/* Admin primary buttons */
button.bg-\[\#000000\],
.min-h-screen button[type="submit"]{
  background:#E32321 !important;
  background-image:none !important;
  color:#fff !important;
}
button.bg-\[\#000000\]:hover,
.min-h-screen button[type="submit"]:hover,
.hover\:bg-\[\#142033\]:hover{
  background:#B42026 !important;
}
