:root{--purple:#6e1597;--ink:#2c2530;--muted:#77717a;--line:#ece8ee;--soft:#faf7fb}
*{box-sizing:border-box}body{margin:0;background:#fff;color:var(--ink);font-family:Arial,Helvetica,sans-serif;font-size:14px}.app-promo{height:58px;display:flex;align-items:center;gap:10px;padding:6px 14px;background:#fff4f8;border-bottom:1px solid #f0d9e6}.app-promo__mark{width:38px;height:38px;border-radius:6px;background:var(--purple);color:#fff;font-size:27px;font-weight:800;display:grid;place-items:center}.app-promo__copy{display:grid;gap:4px;line-height:1.1;font-size:11px}.app-promo__copy span{color:#777}.app-promo__copy b{color:#b6447b;border:1px dashed #b6447b;padding:5px 9px;margin-left:4px}.app-promo__close{margin-left:auto;background:none;border:0;font-size:20px;color:#777}.app-promo__button{background:#e6327d;color:#fff;text-decoration:none;font-weight:700;font-size:11px;padding:10px 13px}.site-header{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}.header-main{height:62px;display:flex;align-items:center;gap:18px;padding:0 max(16px,calc((100% - 1180px)/2))}.icon-button{background:none;border:0;font-size:21px;color:#444}.brand{position:relative;color:var(--purple);font-size:22px;font-weight:800;letter-spacing:-1.2px;text-decoration:none}.brand small{position:absolute;font-size:7px;top:-7px;right:-24px;background:#ffdc64;color:#5e4800;border-radius:3px;padding:2px 3px;letter-spacing:0}.search-form{height:40px;border:1px solid #ded9e0;display:flex;align-items:center;gap:8px;padding:0 13px;border-radius:3px;background:#fff;flex:1;max-width:580px;color:#777}.search-form input{width:100%;border:0;outline:0;font-size:13px}.header-actions{margin-left:auto;display:flex;gap:20px}.header-actions a{display:grid;gap:3px;justify-items:center;text-decoration:none;color:#3e3940;font-size:20px}.header-actions small{font-size:11px}.mobile-search{display:none}.site-nav{display:flex;justify-content:center;gap:38px;height:46px;align-items:center;font-size:13px}.site-nav a{color:#4b454c;text-decoration:none;height:46px;display:grid;place-items:center;border-bottom:2px solid transparent}.site-nav a.active,.site-nav a:hover{color:var(--purple);border-color:var(--purple)}.category-strip{max-width:1180px;margin:0 auto;padding:18px 16px 15px;display:flex;justify-content:center;gap:34px}.category-strip a{width:92px;color:#4b454c;text-align:center;text-decoration:none;display:grid;gap:7px}.category-strip strong{font-size:12px;font-weight:500}.category-art{width:62px;height:62px;border-radius:50%;margin:auto;display:grid;place-items:center;font-size:30px;box-shadow:0 3px 10px #ded4e3}.category-art--skin{background:linear-gradient(145deg,#ead9e9,#fff)}.category-art--makeup{background:linear-gradient(145deg,#e0d5f7,#fff)}.category-art--combo{background:linear-gradient(145deg,#f8d9db,#fff)}.category-art--hair{background:linear-gradient(145deg,#dce9f1,#fff)}.category-art--body{background:linear-gradient(145deg,#e9e3d2,#fff)}.hero-shell{max-width:1180px;margin:0 auto;position:relative;overflow:hidden;padding:0 0 30px}.hero-track{display:flex;transition:transform .35s ease}.hero-slide{min-width:100%;display:block}.hero-slide img{display:block;width:100%;height:290px;object-fit:cover;border-radius:2px}.hero-arrow{position:absolute;top:44%;border:0;width:34px;height:34px;border-radius:50%;background:#fff;box-shadow:0 2px 9px #0002;font-size:28px;color:#555}.hero-arrow--left{left:24px}.hero-arrow--right{right:24px}.hero-dots{position:absolute;bottom:12px;left:0;right:0;display:flex;justify-content:center;gap:5px}.hero-dots i{width:6px;height:6px;border-radius:50%;background:#d1ccd2}.hero-dots i.active{background:#777}.content-section{max-width:1180px;margin:0 auto;padding:20px 16px}.section-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:17px}.section-heading span{font-size:12px;color:var(--purple);font-weight:600}.section-heading h1,.section-heading h2{font-size:22px;margin:5px 0 0;letter-spacing:-.3px}.section-heading a{color:var(--purple);text-decoration:none;font-size:12px;font-weight:700}.product-row{display:flex;gap:14px;overflow:auto;padding:4px 0 10px}.product-card{min-width:190px;max-width:210px;position:relative}.product-card img{display:block;width:100%;height:210px;object-fit:contain;background:#f7f7f7;border:1px solid #f0edf1;border-radius:3px}.product-card p{font-size:12px;line-height:1.35;min-height:48px;margin:8px 0 5px}.product-card b{font-size:13px}.product-card del{font-size:11px;color:#999;margin-left:5px}.product-card em{font-style:normal;color:#159447;font-size:11px;margin-left:5px}.product-card small{display:block;color:#d9791f;font-size:11px;margin-top:7px}.ad-badge{position:absolute;top:7px;left:7px;background:#aaa;color:#fff;font-size:8px;padding:2px 4px;z-index:1}.offer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.offer-grid a{color:var(--ink);text-align:center;text-decoration:none}.offer-grid img{width:100%;display:block;border-radius:4px}.offer-grid strong{display:block;padding-top:8px;font-size:12px}.brand-section{background:var(--soft);max-width:none;padding-left:max(16px,calc((100% - 1148px)/2));padding-right:max(16px,calc((100% - 1148px)/2))}.brand-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.brand-grid img{width:100%;height:auto;object-fit:contain;border-radius:4px;display:block;background:#fff}.mobile-footer{display:none}
@media (max-width:700px){body{padding-bottom:62px}.app-promo{height:58px;padding:6px}.app-promo__mark{width:40px;height:40px}.app-promo__copy{font-size:9px}.app-promo__button{font-size:10px;padding:10px 8px}.header-main{height:47px;padding:0 9px;gap:13px}.menu-button{font-size:18px}.brand{font-size:18px}.header-actions{gap:8px}.header-actions a{font-size:18px}.header-actions small{display:none}.header-main>.search-form{display:none}.mobile-search{display:flex;margin:7px 8px;height:38px;max-width:none}.site-nav{height:0;overflow:hidden}.category-strip{justify-content:flex-start;gap:17px;overflow:hidden;padding:11px 11px 13px}.category-strip a{min-width:61px;width:61px}.category-art{width:51px;height:51px;font-size:23px}.category-strip strong{font-size:9px}.hero-shell{padding:0 0 27px}.hero-slide img{height:213px;border-radius:2px}.hero-arrow{display:none}.hero-dots{bottom:9px}.content-section{padding:18px 12px}.section-heading{align-items:center;margin-bottom:13px}.section-heading h1,.section-heading h2{font-size:14px;margin-top:4px}.section-heading span{font-size:12px}.section-heading a{font-size:10px}.product-row{gap:9px;margin-right:-12px}.product-card{min-width:116px;max-width:116px}.product-card img{height:125px}.product-card p{font-size:10px;min-height:54px;margin:6px 0 3px}.product-card b{font-size:11px}.product-card del,.product-card em,.product-card small{font-size:9px}.offer-grid{grid-template-columns:repeat(2,1fr);gap:10px;padding-top:5px}.offer-grid strong{font-size:10px;padding-top:5px}.brand-section{padding:18px 12px}.brand-grid{gap:8px}.brand-grid img{height:auto;min-height:80px}.mobile-footer{position:fixed;z-index:8;bottom:0;left:0;right:0;height:60px;background:#fff;border-top:1px solid var(--line);display:flex;justify-content:space-around}.mobile-footer a{display:grid;place-items:center;align-content:center;gap:2px;color:#777;text-decoration:none;font-size:9px}.mobile-footer span{font-size:18px;color:#555}.mobile-footer a.active,.mobile-footer a.active span{color:var(--purple)}}
.category-strip--exact{display:flex;justify-content:center;padding:14px 16px 12px}.category-strip--exact a{display:block;width:min(100%,500px)}.category-strip--exact img{display:block;width:100%;height:auto}
@media (max-width:700px){.category-strip--exact{justify-content:center;padding:8px 7px 12px;overflow:visible}.category-strip--exact a{width:min(100%,308px);min-width:0}.category-strip--exact img{width:100%;height:auto}}
.category-strip--shopaale{justify-content:flex-start;overflow-x:auto;scrollbar-width:none}.category-strip--shopaale::-webkit-scrollbar{display:none}.category-strip--shopaale a{flex:0 0 92px}.category-art--shopaale{overflow:hidden;background:#f7f3f8}.category-art--shopaale img{display:block;width:100%;height:100%;object-fit:cover}
@media (max-width:700px){.category-strip--shopaale{justify-content:flex-start;overflow-x:auto;padding:11px 10px 13px}.category-strip--shopaale a{flex:0 0 64px;min-width:64px;width:64px}.category-strip--shopaale .category-art{width:52px;height:52px}.category-strip--shopaale strong{font-size:9px;line-height:11px}}
.brand img{display:block;width:118px;height:30px;object-fit:contain}
@media (max-width:700px){.brand img{width:92px;height:25px}}
.hero-slide picture{display:block;width:100%}.hero-slide img{width:100%;height:auto;aspect-ratio:2560/824;object-fit:contain;background:#fff}
@media (max-width:700px){.hero-slide img{height:auto;aspect-ratio:1440/1003;object-fit:contain}}
@media (max-width:700px){.mobile-footer img{display:block;width:31px;height:18px;object-fit:contain}}
@media (max-width:700px){.mobile-footer svg{display:block;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}}
.header-actions svg{display:block;width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.45;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:700px){.header-actions a{width:27px;height:38px;display:flex;align-items:center;justify-content:center}.header-actions svg{width:19px;height:19px}}
.app-promo__mark{width:54px;background:#fff;border:1px solid #eadfe8;padding:4px}.app-promo__mark img{display:block;width:100%;height:100%;object-fit:contain}
@media (max-width:700px){.app-promo__mark{width:48px;height:40px}}
.product-card-link{color:inherit;text-decoration:none}.product-card .product-brand{height:15px;margin-top:7px;overflow:hidden;color:#555;font-size:10px;font-weight:700}.product-card .product-name{display:-webkit-box;min-height:45px;margin:4px 0 5px;overflow:hidden;font-size:12px;line-height:1.3;-webkit-box-orient:vertical;-webkit-line-clamp:3}.product-loading{padding:30px 10px;color:#777}.product-card img{object-fit:contain}
@media (max-width:700px){.product-card .product-brand{font-size:9px}.product-card .product-name{min-height:39px;font-size:10px}.hero-dots{gap:4px}.hero-dots i{width:5px;height:5px}}
.hero-shell--all-banners{overflow:visible}.hero-shell--all-banners .hero-track{display:grid;gap:16px;transform:none!important}.hero-shell--all-banners .hero-slide{min-width:0}.hero-shell--all-banners .hero-arrow,.hero-shell--all-banners .hero-dots{display:none}.editorial-banner img{display:block;width:100%;height:auto;border-radius:4px}.offer-grid picture{display:block}
@media (max-width:700px){.hero-shell--all-banners{padding:0 12px 14px}.hero-shell--all-banners .hero-track{gap:16px}.hero-shell--all-banners .hero-slide img{border-radius:3px}.editorial-banner{padding-top:6px}.offer-grid{grid-template-columns:1fr}.offer-grid strong{font-size:11px}}
.banner-feed{display:grid;gap:16px}.banner-feed a,.banner-feed picture{display:block}.banner-feed img{display:block;width:100%;height:auto;border-radius:4px}
@media (max-width:700px){.banner-feed{gap:16px;padding:8px 12px 18px}.banner-feed img{border-radius:3px}}




/* =========================================
   NEW APP PROMO BANNER STYLES
   ========================================= */
.app-promo {
  height: 50px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 20px !important;
  background: #fdf5ff !important;
  border-bottom: 1px solid #f2e6f2 !important;
  position: relative !important;
  gap: 20px !important;
  overflow: hidden !important;
}
.app-promo__center {
  display: flex !important;
  align-items: center !important;
  gap: 15px !important;
  margin-left: 0 !important;
}
.app-promo__mark {
  width: 32px !important;
  height: 32px !important;
  border-radius: 8px !important;
  background: #9c27b0 !important;
  color: #fff !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  display: grid !important;
  place-items: center !important;
  line-height: 1 !important;
  font-family: sans-serif !important;
  border: none !important;
  padding: 0 !important;
}
.app-promo__text {
  font-size: 14px !important;
  color: #333 !important;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}
.app-promo__text strong {
  color: #3e4152 !important;
  font-weight: 700 !important;
}
.app-promo__code {
  border: 1.5px dashed #9c27b0 !important;
  border-radius: 4px !important;
  padding: 6px 12px !important;
  font-size: 13px !important;
  color: #555 !important;
  background: #fff !important;
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
}
.app-promo__code strong {
  color: #9c27b0 !important;
  font-weight: 800 !important;
}
.app-promo__right {
  display: flex !important;
  align-items: center !important;
  gap: 15px !important;
  margin-right: 0 !important;
}
.app-promo__button {
  background: #9c27b0 !important;
  color: #fff !important;
  text-decoration: none !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  padding: 8px 16px !important;
  border-radius: 6px !important;
}
.app-promo__close {
  background: none !important;
  border: 0 !important;
  font-size: 24px !important;
  color: #999 !important;
  cursor: pointer !important;
  padding: 0 !important;
  margin-left: 10px !important;
}

@media (max-width: 900px) {
  .app-promo {
    display: none !important;
  }
  .app-promo__center {
    flex-wrap: wrap !important;
    justify-content: center !important;
  }
  .app-promo__right {
    position: relative !important;
    width: 100% !important;
    justify-content: center !important;
    margin-top: 5px !important;
  }
  .app-promo__close {
    position: absolute !important;
    right: 5px !important;
    top: -30px !important;
  }
}

@media (min-width:701px) { .menu-button { display: none !important; } }

@media (max-width:700px) { .site-nav.open { height: auto !important; padding: 10px 0 !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; position: absolute !important; top: 100% !important; left: 0 !important; right: 0 !important; background: #fff !important; z-index: 100 !important; box-shadow: 0 4px 10px rgba(0,0,0,0.1) !important; } .site-nav.open a { width: 100% !important; padding: 12px 16px !important; border-bottom: 1px solid #f0f0f0 !important; justify-content: flex-start !important; height: auto !important; } }

/* Mobile header cart fix - prevent cart icon from being cut off */
@media (max-width: 700px) {
  .header-main {
    padding: 0 12px 0 9px !important;
    overflow: visible !important;
  }
  .header-actions {
    flex-shrink: 0 !important;
    margin-right: 2px !important;
  }
  .header-actions a {
    position: relative !important;
    overflow: visible !important;
  }
  .cart-count-badge {
    right: -2px !important;
    top: -8px !important;
  }
  .brand {
    flex-shrink: 1 !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
}

/* Search page header fixes */
@media (max-width: 700px) {
  .header {
    background: #fff !important;
    border-bottom: 1px solid var(--line) !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 50 !important;
    padding: 8px 0 !important;
  }
  .header_section {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 0 12px !important;
  }
  .logo_container img {
    height: 28px !important;
    width: auto !important;
  }
  .search_bar {
    flex: 1 !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    background: #f5f3f6 !important;
    border-radius: 10px !important;
    padding: 10px 12px !important;
    min-width: 0 !important;
  }
  .search_bar .text-container {
    flex: 1 !important;
    min-width: 0 !important;
  }
  .search_bar input {
    width: 100% !important;
    border: none !important;
    background: transparent !important;
    outline: none !important;
    font-size: 14px !important;
  }
  .icon-top {
    display: flex !important;
    gap: 12px !important;
    flex-shrink: 0 !important;
  }
  .icon-top .icons {
    width: 36px !important;
    height: 36px !important;
    display: grid !important;
    place-items: center !important;
    position: relative !important;
  }
  /* Search results container */
  #search-results {
    padding: 12px !important;
  }
  .search-page-container {
    padding: 12px !important;
    margin-top: 0 !important;
  }
}

/* Search page: override myntra-theme that hides .header on mobile */
@media screen and (max-width: 768px) {
  body.search-page .header {
    display: block !important;
  }
}

/* Mobile trending/product grid fix (2026-10-04) */
@media (max-width: 700px) {
  /* Wider cards for 2-col grid */
  .product-row .product-card,
  .trending-grid .product-card,
  [class*="trending"] .product-card {
    min-width: calc(50% - 8px) !important;
    max-width: calc(50% - 8px) !important;
    flex: 0 0 calc(50% - 8px) !important;
  }
  .product-card .product-name {
    font-size: 11px !important;
    line-height: 1.4 !important;
    min-height: 46px !important;
    -webkit-line-clamp: 3 !important;
  }
  /* Ensure Add to Cart is fully visible */
  .product-card .add-to-cart-btn,
  .product-card button[class*="cart"] {
    width: 100% !important;
    margin-top: 8px !important;
    padding: 10px 8px !important;
    font-size: 12px !important;
    white-space: nowrap !important;
  }
  /* Add bottom padding so footer doesn't cover buttons */
  .content-section:last-child,
  main:last-child {
    padding-bottom: 80px !important;
  }
}

/* Prevent mid-word truncation on mobile product names (2026-10-04) */
@media (max-width: 700px) {
  .product-card p, .product-card .product-name {
    white-space: normal !important;
    word-break: break-word !important;
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    min-height: 32px !important;
  }
}
