@import url("https://fonts.googleapis.com/css2?family=Aref+Ruqaa+Ink:wght@400;700&family=Cormorant+Garamond:wght@500;700&display=swap");
:root{
  --eht-pink:#ff4fa3;
  --eht-pink-2:#ffd1e8;
  --eht-rose:#b4236c;
  --eht-bg:#fff7fb;
  --eht-card:#ffffff;
  --eht-text:#231f20;
  --eht-muted:#7b6a72;

  --header-h:92px;
  --bottom-nav-h:72px;

  --max-w:1100px;
}

html, body{ height:100%; }

body{
  font-family: "Cairo", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  background: var(--eht-bg);
  color: var(--eht-text);
}

/* Make space for fixed header & bottom nav */
body.has-shell{
  padding-top: var(--header-h);
  padding-bottom: var(--bottom-nav-h);
}

/* Links */
a{ color: var(--eht-rose); text-decoration: none; }
a:hover{ text-decoration: underline; }

/* ---------- Shell (Header / Bottom Nav) ---------- */
.app-header{
  position: fixed;
  inset: 0 0 auto 0;
  height: var(--header-h);
  background: #fff;
  border-bottom: 1px solid rgba(180,35,108,0.12);
  z-index: 1050;
  display:flex;
  align-items:center;
}

.app-header .inner{
  width: 100%;
  max-width: var(--max-w);
  margin-inline: auto;
  padding-inline: 14px;
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 10px;
}

.brand{
  display:flex;
  align-items:center;
  gap: 10px;
  min-width: 0;
}

.brand-logo{
  width: 56px;
  height: 56px;
  border-radius: 18px;
  background: radial-gradient(24px 24px at 30% 30%, #ffe4f2, #ffd1e8);
  border: 1px solid rgba(255,79,163,0.35);
  padding: 6px;
}

.brand-text{
  display:flex;
  flex-direction: column;
  line-height: 1.05;
  min-width: 0;
}
.brand-names{
  display:flex;
  align-items: baseline;
  gap: 10px;
  min-width: 0;
}
.brand-names .ar{
  font-weight: 900;
  color: var(--eht-rose);
  font-size: 1.55rem;
  white-space: nowrap;
}
.brand-names .en{
  font-weight: 800;
  color: #5a4b52;
  font-size: 1.05rem;
  white-space: nowrap;
}
.brand-tagline{
  font-weight: 700;
  color: rgba(90, 75, 82, 0.82);
  font-size: .95rem;
  margin-top: 4px;
}

.icon-btn{
  height: 44px;
  border-radius: 16px;
  border: 1px solid rgba(180,35,108,0.12);
  background: #fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color: var(--eht-rose);
  position: relative;
}
.icon-btn:hover{
  background: rgba(255,79,163,0.08);
  text-decoration:none;
}
.icon-btn i{ font-size: 1.2rem; }

.cart-btn{
  width: auto;
  padding: 8px 12px;
  gap: 10px;
}
.cart-icon-wrap{
  position: relative;
  width: 34px;
  height: 34px;
  border-radius: 14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background: rgba(255,79,163,0.10);
}
.cart-label{
  font-weight: 900;
  color: var(--eht-rose);
  font-size: 0.98rem;
}

.cart-badge{
  position: absolute;
  top: -7px;
  inset-inline-start: -7px;
  background: var(--eht-pink);
  color: #fff;
  font-weight: 800;
  border-radius: 999px;
  padding: 2px 7px;
  font-size: .75rem;
  border: 2px solid #fff;
}

.bottom-nav{
  position: fixed;
  inset: auto 0 0 0;
  height: var(--bottom-nav-h);
  background: #fff;
  border-top: 1px solid rgba(180,35,108,0.12);
  z-index: 1050;
}

.bottom-nav .inner{
  max-width: var(--max-w);
  margin-inline: auto;
  height: 100%;
  display:flex;
  align-items:center;
  justify-content: space-around;
  padding-inline: 10px;
}

.bottom-nav a{
  display:flex;
  flex-direction: column;
  align-items:center;
  justify-content:center;
  gap: 4px;
  color: #6b5a62;
  text-decoration:none;
  min-width: 88px;
  padding: 8px 10px;
  border-radius: 14px;
}
.bottom-nav a i{ font-size: 1.28rem; }
.bottom-nav a span{ font-size: .82rem; font-weight: 800; }
.bottom-nav a.active{
  color: var(--eht-rose);
  background: rgba(255,79,163,0.10);
}

/* Main wrapper */
.app-main{
  width: 100%;
  max-width: var(--max-w);
  margin-inline: auto;
  padding: 14px;
}

/* ---------- Home UI blocks ---------- */
.section-title{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 10px;
  margin: 14px 0 10px;
}
.section-title h2{
  margin:0;
  font-weight: 900;
  color: var(--eht-rose);
  font-size: 1.15rem;
}
.section-title a{
  font-size: .9rem;
  font-weight: 800;
}

.search-wrap{
  position: relative;
  margin-top: 6px;
}
.search-input{
  width:100%;
  border-radius: 18px;
  border: 1px solid rgba(180,35,108,0.14);
  padding: 12px 46px 12px 46px;
  background: #fff;
  outline: none;
  font-weight: 700;
}
.search-input::placeholder{
  color: rgba(180,35,108,0.42);
}
.search-input:focus{
  box-shadow: 0 0 0 4px rgba(255,79,163,0.12);
  border-color: rgba(255,79,163,0.55);
}
.search-icon{
  position:absolute;
  inset-inline-end: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--eht-rose);
  font-size: 1.1rem;
}
.search-suggest{
  position:absolute;
  left:0; right:0;
  top: calc(100% + 8px);
  background: #fff;
  border: 1px solid rgba(180,35,108,0.12);
  border-radius: 18px;
  box-shadow: 0 18px 30px rgba(0,0,0,0.10);
  overflow: hidden;
  z-index: 1040;
  display:none;
}
.search-suggest button{
  width:100%;
  text-align: start;
  background: transparent;
  border:0;
  padding: 10px 12px;
  font-weight: 800;
  color: #372b31;
}
.search-suggest button:hover{
  background: rgba(255,79,163,0.08);
}

/* Horizontal scrollers */
.h-scroll{
  display:flex;
  gap: 10px;
  overflow-x: auto;
  padding-bottom: 8px;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  direction: ltr; /* smoother scrolling on mobile */
}
.h-scroll > *{ scroll-snap-align: start; }
.h-scroll::-webkit-scrollbar{ height: 8px; }
.h-scroll::-webkit-scrollbar-thumb{
  background: rgba(180,35,108,0.18);
  border-radius: 999px;
}

/* Category tiles */
.cat-tile{
  width: 110px;
  flex: 0 0 auto;
  background: #fff;
  border: 1px solid rgba(180,35,108,0.10);
  border-radius: 18px;
  padding: 10px 10px;
  text-align: center;
  color: #372b31;
}
.cat-tile:hover{ background: rgba(255,79,163,0.06); text-decoration:none; }
.cat-tile .icon{
  width: 46px; height: 46px;
  border-radius: 16px;
  margin: 2px auto 8px;
  background: rgba(255,79,163,0.10);
  display:flex;
  align-items:center;
  justify-content:center;
  color: var(--eht-rose);
  border: 1px solid rgba(255,79,163,0.20);
}
.cat-tile .icon i{ font-size: 1.35rem; }
.cat-tile .name{
  font-weight: 900;
  font-size: .9rem;
  line-height: 1.1;
  direction: rtl;
}

/* Banner carousel */
.banner-wrap .carousel-item img{
  width:100%;
  height: 220px;
  object-fit: cover;
  border-radius: 18px;
  border: 1px solid rgba(180,35,108,0.10);
  background:#fff;
}
@media (min-width: 768px){
  .banner-wrap .carousel-item img{ height: 300px; }
}

/* Flower tiles big */
.big-tile{
  width: 240px;
  flex: 0 0 auto;
  background: #fff;
  border: 1px solid rgba(180,35,108,0.10);
  border-radius: 22px;
  overflow: hidden;
}
.big-tile img{
  width:100%;
  height: 180px;
  object-fit: cover;
  background:#fff;
}
.big-tile .label{
  padding: 10px 12px;
  font-weight: 900;
  text-align: center;
  color: #372b31;
  direction: rtl;
}

/* Heart / occasion cards */
.occasion-card{
  width: 120px;
  flex: 0 0 auto;
  text-align:center;
  direction: rtl;
}
.heart{
  width: 120px;
  height: 110px;
  margin: 0 auto 8px;
  background: radial-gradient(90px 70px at 30% 30%, #ffd1e8 0%, #ff7bbd 60%, #ff4fa3 100%);
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 29.6'><path d='M23.6,0c-2.7,0-5.2,1.3-7.6,4C13.6,1.3,11.1,0,8.4,0C3.8,0,0,3.8,0,8.4c0,9.4,16,21.2,16,21.2s16-11.8,16-21.2C32,3.8,28.2,0,23.6,0z' fill='black'/></svg>") center/contain no-repeat;
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 29.6'><path d='M23.6,0c-2.7,0-5.2,1.3-7.6,4C13.6,1.3,11.1,0,8.4,0C3.8,0,0,3.8,0,8.4c0,9.4,16,21.2,16,21.2s16-11.8,16-21.2C32,3.8,28.2,0,23.6,0z' fill='black'/></svg>") center/contain no-repeat;
  border-radius: 10px;
  position: relative;
  overflow: hidden;
}
.heart img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  mix-blend-mode: multiply;
  opacity: .95;
}
.occasion-card .name{
  font-weight: 900;
  font-size: .9rem;
  color: #372b31;
}

/* Product tiles */
.prod-tile{
  width: 180px;
  flex: 0 0 auto;
  background:#fff;
  border: 1px solid rgba(180,35,108,0.10);
  border-radius: 22px;
  overflow:hidden;
  direction: rtl;
}
.prod-tile img{
  width:100%;
  height: 150px;
  object-fit: cover;
  background:#fff;
}
.prod-tile .body{
  padding: 10px 12px 12px;
}
.prod-tile .title{
  font-weight: 900;
  font-size: .95rem;
  margin-bottom: 4px;
}
.prod-tile .meta{
  color: var(--eht-muted);
  font-size: .82rem;
  margin-bottom: 8px;
}
.prod-tile .price{
  font-weight: 900;
  color: var(--eht-rose);
  margin-bottom: 8px;
}
.btn-ehtiwa{
  background: var(--eht-pink);
  border-color: var(--eht-pink);
  color: #fff;
  border-radius: 14px;
  font-weight: 900;
}
.btn-ehtiwa:hover{ filter: brightness(0.96); color:#fff; }
.btn-outline-ehtiwa{
  border-color: rgba(255,79,163,0.55);
  color: var(--eht-rose);
  border-radius: 14px;
  font-weight: 900;
}
.btn-outline-ehtiwa:hover{ background: rgba(255,79,163,0.10); }

/* Keep old product-card styles for shop grid */
.card.product-card{
  border: 1px solid rgba(180,35,108,0.10);
  border-radius: 16px;
  overflow: hidden;
  background: var(--eht-card);
  transition: transform .15s ease, box-shadow .15s ease;
}
.card.product-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 12px 22px rgba(0,0,0,0.08);
}
.product-img{
  width: 100%;
  height: 180px;
  object-fit: cover;
  background: #fff;
}
.badge-soft{
  background: rgba(255,79,163,0.12);
  color: var(--eht-rose);
  border: 1px solid rgba(255,79,163,0.25);
}
.small-muted{ color: var(--eht-muted); font-size: .92rem; }

/* Reviews */
.review-card{
  background:#fff;
  border: 1px solid rgba(180,35,108,0.10);
  border-radius: 18px;
  padding: 12px;
  direction: rtl;
}
.review-head{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 10px;
}
.avatar{
  width: 40px;
  height: 40px;
  border-radius: 14px;
  background: rgba(255,79,163,0.10);
  border: 1px solid rgba(255,79,163,0.22);
  display:flex;
  align-items:center;
  justify-content:center;
  color: var(--eht-rose);
  font-weight: 900;
}
.stars{
  color: #f5b301;
  letter-spacing: 1px;
  font-size: .95rem;
  white-space: nowrap;
}
.review-meta{
  color: var(--eht-muted);
  font-size: .82rem;
}
.review-imgs{
  display:flex;
  gap: 8px;
  margin-top: 10px;
}
.review-imgs img{
  width: 66px;
  height: 66px;
  object-fit: cover;
  border-radius: 16px;
  border: 1px solid rgba(180,35,108,0.10);
}

/* Footer / About */
.about-card{
  background: #fff;
  border: 1px solid rgba(180,35,108,0.10);
  border-radius: 18px;
  padding: 14px;
}
.socials{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}
.socials a{
  width: 46px;
  height: 46px;
  border-radius: 16px;
  border: 1px solid rgba(180,35,108,0.12);
  background: #fff;
  display:flex;
  align-items:center;
  justify-content:center;
  color: var(--eht-rose);
}
.socials a:hover{ background: rgba(255,79,163,0.08); text-decoration:none; }

/* WhatsApp primary button */
.btn-whatsapp{
  background: #25D366;
  color: #fff;
  border: none;
  font-weight: 900;
  border-radius: 18px;
  padding: 14px 16px;
}
.btn-whatsapp:hover{ color:#fff; filter: brightness(0.96); }

/* Product page */
.product-gallery{
  margin-top: 12px;
  border-radius: 18px;
  border: 1px solid rgba(180,35,108,0.10);
  overflow: hidden;
  background: rgba(255,79,163,0.04);
}
.product-gallery .slides{
  display:flex;
  gap: 0;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}
.product-gallery .slides::-webkit-scrollbar{ height: 8px; }
.product-gallery .slides::-webkit-scrollbar-thumb{ background: rgba(180,35,108,0.18); border-radius: 999px; }
.product-gallery .slide{
  min-width: 100%;
  scroll-snap-align: start;
}
.product-gallery img{
  width: 100%;
  height: 340px;
  object-fit: cover;
  display:block;
}
@media (max-width: 480px){
  .product-gallery img{ height: 290px; }
}

.qty-stepper{
  display:inline-flex;
  align-items:center;
  gap: 10px;
  border: 1px solid rgba(180,35,108,0.14);
  border-radius: 14px;
  padding: 6px 10px;
  background: #fff;
}
.qty-stepper button{
  width: 34px;
  height: 34px;
  border-radius: 12px;
  border: 1px solid rgba(180,35,108,0.12);
  background: rgba(255,79,163,0.06);
  color: var(--eht-rose);
  font-weight: 900;
}
.qty-stepper span{ min-width: 18px; text-align:center; font-weight: 900; }

/* Header responsive tweaks */
@media (max-width: 420px){
  :root{ --header-h: 86px; }
  .brand-names .ar{ font-size: 1.35rem; }
  .brand-names .en{ font-size: .98rem; }
  .brand-tagline{ font-size: .88rem; }
  .brand-logo{ width: 50px; height: 50px; }
  .cart-label{ font-size: .92rem; }
}

/* Whatsapp floating button (repositioned above bottom nav) */
.whatsapp-fab{
  position: fixed;
  bottom: calc(var(--bottom-nav-h) + 16px);
  left: 18px;
  z-index: 1040;
  border-radius: 999px;
  padding: 12px 14px;
  background: #25D366;
  color: #fff;
  font-weight: 900;
  box-shadow: 0 12px 22px rgba(0,0,0,0.18);
}
.whatsapp-fab:hover{ color:#fff; filter: brightness(0.95); }

/* Utilities */
hr.soft{
  border-color: rgba(180,35,108,0.12);
  opacity: 1;
}
.skeleton{
  background: linear-gradient(90deg, rgba(255,79,163,0.06) 25%, rgba(255,79,163,0.12) 37%, rgba(255,79,163,0.06) 63%);
  background-size: 400% 100%;
  animation: shimmer 1.2s ease-in-out infinite;
  border-radius: 12px;
}
@keyframes shimmer{ 0%{background-position:100% 0} 100%{background-position:0 0} }

/* Admin helpers */
.admin-top{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}


/* ---------- 2026 refresh ---------- */
body.admin-body{ background: var(--eht-bg); }
.header-actions{ display:flex; align-items:center; gap:10px; }
.icon-badge-wrap{ position:relative; width:34px; height:34px; border-radius:14px; display:inline-flex; align-items:center; justify-content:center; background:rgba(255,79,163,0.10); }
.wish-btn{ width:44px; }
.header-welcome{
  position:absolute;
  inset-inline-start:14px;
  bottom:-14px;
  display:inline-flex;
  align-items:center;
  width:fit-content;
  max-width:calc(100% - 28px);
  background:#fff;
  border:1px solid rgba(180,35,108,0.18);
  border-radius:999px;
  padding:3px 12px;
  font-size:.78rem;
  font-weight:600;
  color:var(--eht-rose);
  box-shadow:0 4px 14px rgba(180,35,108,.1);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.brand-names .ar{ font-family:"Aref Ruqaa Ink", serif; font-size:1.75rem; }
.brand-names .en{ font-family:"Cormorant Garamond", serif; font-size:1.35rem; letter-spacing:.3px; }
.brand-tagline{ font-family:"Cormorant Garamond", serif; min-height:22px; }
.brand-tagline[data-lang="ar"]{ font-family:"Aref Ruqaa Ink", serif; }
.cart-badge{ display:inline-flex; align-items:center; justify-content:center; min-width:24px; min-height:24px; }

.occasion-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
@media (min-width:768px){ .occasion-grid{ grid-template-columns:repeat(5,minmax(0,1fr)); } }
.occasion-mini-card{
  background:#fff;
  border:1px solid rgba(180,35,108,.12);
  border-radius:18px;
  padding:14px 10px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  text-align:center;
}
.occasion-mini-card .icon{
  width:54px;height:54px;border-radius:18px;background:rgba(255,79,163,.10);display:flex;align-items:center;justify-content:center;color:var(--eht-rose);font-size:1.4rem;
}
.occasion-mini-card .name{ font-weight:900; color:#372b31; }

.filter-chip{
  display:inline-flex; align-items:center; justify-content:center;
  padding:9px 14px; border-radius:999px; background:#fff; border:1px solid rgba(180,35,108,.14); color:#6b5a62; font-weight:800; white-space:nowrap;
}
.filter-chip:hover{ text-decoration:none; background:rgba(255,79,163,.07); }
.filter-chip.active{ background:rgba(255,79,163,.12); color:var(--eht-rose); border-color:rgba(255,79,163,.35); }
.chip-row{ display:flex; gap:8px; overflow:auto; padding-bottom:4px; }
.chip-row::-webkit-scrollbar{ height:8px; }
.chip-row::-webkit-scrollbar-thumb{ background:rgba(180,35,108,.18); border-radius:999px; }

.prod-card-wrap{ width:290px; flex:0 0 auto; }
.tags-row{ display:flex; flex-wrap:wrap; gap:6px; min-height:24px; }
.featured-badge,
.sold-badge{
  position:absolute; top:12px; border-radius:999px; padding:4px 10px; font-size:.78rem; font-weight:900;
}
.featured-badge{ inset-inline-end:10px; background:#fff1f8; color:var(--eht-rose); border:1px solid rgba(255,79,163,.26); }
.sold-badge{ inset-inline-start:10px; background:#fff7ed; color:#a16207; border:1px solid rgba(245,158,11,.28); }
.card.product-card.is-unavailable{ opacity:.92; }
.card.product-card.is-unavailable .product-img{ filter:grayscale(18%); }

.price-stack{ display:flex; flex-direction:column; gap:2px; }
.price-before{ color:#8b7b83; text-decoration:line-through; font-weight:700; font-size:.9rem; }
.price-current{ color:#128a45; font-weight:900; font-size:1rem; }

.btn-heart{
  border:1px solid rgba(180,35,108,.18); border-radius:14px; background:#fff; color:var(--eht-rose); font-weight:800;
}
.btn-heart.active{ background:#fff1f4; color:#d11a57; border-color:rgba(209,26,87,.25); }
.availability-pill{
  display:inline-flex; align-items:center; justify-content:center; min-height:36px; padding:8px 12px; border-radius:999px; background:#ecfdf3; color:#128a45; font-weight:900;
}
.availability-pill.unavailable{ background:#fff7ed; color:#a16207; }

.cart-item-card .price-current{ white-space:nowrap; }
.cart-item-image{ width:96px; height:96px; object-fit:cover; border-radius:16px; border:1px solid rgba(180,35,108,.10); background:#fff; }
.summary-row{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 0; }
.summary-row.total{ border-top:1px dashed rgba(180,35,108,.18); margin-top:8px; padding-top:12px; font-weight:900; }
.coupon-box{ background:#fff8fc; border:1px dashed rgba(255,79,163,.28); border-radius:16px; padding:12px; }
.coupon-applied{ background:#ecfdf3; color:#128a45; border-radius:14px; padding:10px 12px; font-weight:800; }

.payment-option{ display:block; cursor:pointer; }
.payment-option input{ display:none; }
.payment-option-body{
  display:flex; gap:12px; align-items:center; padding:12px; border:1px solid rgba(180,35,108,.14); border-radius:16px; background:#fff;
}
.payment-option-body small{ display:block; color:var(--eht-muted); font-size:.84rem; }
.payment-option-icon{ width:44px; height:44px; border-radius:16px; background:rgba(255,79,163,.10); color:var(--eht-rose); display:flex; align-items:center; justify-content:center; font-size:1.2rem; }
.payment-option.active .payment-option-body{ border-color:rgba(255,79,163,.44); background:#fff7fb; box-shadow:0 10px 20px rgba(255,79,163,.07); }
.payment-details-box{ background:#fff8fc; border:1px solid rgba(180,35,108,.10); border-radius:16px; padding:12px; min-height:92px; }

.avatar-lg{ width:56px; height:56px; border-radius:18px; }
.login-card{ max-width:620px; margin-inline:auto; }
.order-card{ background:#fff; border:1px solid rgba(180,35,108,.12); border-radius:18px; padding:14px; }
.order-items-mini{ color:var(--eht-muted); font-size:.9rem; }
.order-line{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 0; border-bottom:1px solid rgba(180,35,108,.08); }
.order-line:last-child{ border-bottom:none; }

.global-status-overlay{
  position:fixed; inset:0; background:rgba(35,31,32,.38); z-index:2000; display:flex; align-items:center; justify-content:center; padding:16px;
}
.global-status-card{
  width:min(420px, 100%); background:#fff; border-radius:24px; padding:22px 20px; text-align:center; box-shadow:0 24px 40px rgba(0,0,0,.20);
}
.global-status-icon{ min-height:74px; display:flex; align-items:center; justify-content:center; }
.global-status-title{ font-size:1.15rem; font-weight:900; color:var(--eht-rose); margin-top:4px; }
.global-status-text{ color:var(--eht-muted); margin-top:8px; }
.global-status-actions{ display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin-top:18px; }
.status-spinner{
  width:48px; height:48px; border-radius:50%; border:4px solid rgba(255,79,163,.15); border-top-color:var(--eht-pink); animation:spin 1s linear infinite;
}
@keyframes spin{ to{ transform:rotate(360deg); } }
.status-check{
  width:64px; height:64px; border-radius:50%; background:#16a34a; color:#fff; display:flex; align-items:center; justify-content:center; font-size:1.9rem;
}
.status-emoji{ font-size:3rem; line-height:1; }

.coupon-summary-card{ background:#fff8fc; border:1px solid rgba(180,35,108,.12); border-radius:16px; padding:12px; }
.admin-table td, .admin-table th{ vertical-align:top; }
.admin-list{ line-height:1.6; }

@media (max-width: 420px){
  .brand-names .ar{ font-size:1.5rem; }
  .brand-names .en{ font-size:1.08rem; }
  .occasion-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .prod-card-wrap{ width:240px; }
  .header-welcome{ display:none; }
}


body.with-bottom-nav.has-shell{
  padding-bottom: calc(var(--bottom-nav-h) + 18px);
}
body.without-bottom-nav.has-shell{
  padding-bottom: 18px;
}

.app-main{
  padding-bottom: calc(var(--bottom-nav-h) + 26px);
}
body.without-bottom-nav .app-main{
  padding-bottom: 20px;
}

#appBottomNav:empty{ display:none; }

.bottom-nav{
  transition: transform .24s ease, opacity .24s ease;
  will-change: transform;
}
.bottom-nav.is-hidden{
  transform: translateY(calc(100% + 12px));
  opacity: .98;
}

.whatsapp-fab{
  transition: bottom .24s ease, transform .24s ease, opacity .24s ease;
}
body.nav-hidden .whatsapp-fab,
body.without-bottom-nav .whatsapp-fab{
  bottom: 18px;
}

.mini-pill{
  position: absolute;
  inset-inline-end: -8px;
  bottom: -8px;
  min-width: 24px;
  height: 24px;
  padding: 0 6px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid rgba(180,35,108,.16);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: .82rem;
  box-shadow: 0 8px 16px rgba(0,0,0,.08);
}

.review-avatar{
  overflow: hidden;
  background: #fff3f8;
}
.review-avatar img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.site-mini-footer{
  text-align: center;
  color: var(--eht-muted);
  font-size: .8rem;
  line-height: 1.7;
  padding: 14px 10px 6px;
}

.choice-options-wrap{
  display: grid;
  gap: 10px;
  width: 100%;
}
.choice-option-btn{
  width: 100%;
  border: 1px solid rgba(180,35,108,.16);
  background: #fff;
  border-radius: 16px;
  padding: 12px 14px;
  text-align: start;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-weight: 800;
  color: #372b31;
}
.choice-option-btn:hover{
  background: rgba(255,79,163,.06);
}
.choice-option-btn.is-active{
  border-color: rgba(255,79,163,.42);
  background: #fff7fb;
  color: var(--eht-rose);
}
.choice-option-main{
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.choice-option-note{
  color: var(--eht-muted);
  font-size: .88rem;
  white-space: nowrap;
}

body.lang-en .brand-names .ar{ font-family: "Aref Ruqaa Ink", serif; }
body.lang-en .brand-names .en,
body.lang-en .brand-tagline{ font-family: "Cormorant Garamond", serif; }



/* ---------- mobile and 2026 polish overrides ---------- */
.brand-logo{
  width: 54px;
  height: 54px;
  border-radius: 18px;
  object-fit: cover;
}
.brand-text{ min-width: 0; }
.brand-names{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1px;
  line-height: 1;
}
.brand-names .ar{
  font-family: "Aref Ruqaa Ink", serif !important;
  font-size: 1.8rem !important;
  letter-spacing: 0;
}
.brand-names .en{
  font-family: "Cormorant Garamond", serif !important;
  font-size: 1rem !important;
  letter-spacing: .4px;
}
.brand-tagline{
  font-family: "Cairo", system-ui, sans-serif !important;
  font-size: .84rem !important;
  min-height: 20px;
  margin-top: 4px;
  color: rgba(90,75,82,.82);
}
.header-actions{
  gap: 6px !important;
  flex-shrink: 0;
}
.icon-btn{
  height: 42px;
  min-width: 42px;
  border-radius: 16px;
}
.icon-btn i{ font-size: 1.05rem; }
.icon-badge-wrap,
.cart-icon-wrap{
  width: 30px !important;
  height: 30px !important;
  border-radius: 12px !important;
}
.wish-btn,
.currency-btn{ width: 42px !important; }
.cart-btn{
  padding: 6px 10px !important;
  gap: 8px !important;
}
.mini-pill{
  position: absolute;
  inset-inline-end: -7px;
  inset-block-end: -7px;
  min-width: 22px;
  height: 22px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid rgba(180,35,108,.14);
  box-shadow: 0 6px 14px rgba(0,0,0,.08);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: .95rem;
}
.cart-badge{
  min-width: 20px;
  height: 20px;
  padding-inline: 5px;
  font-size: .75rem;
}
.socials-mobile-center{
  justify-content: flex-start;
}
.site-mini-footer{
  text-align: center;
  color: var(--eht-muted);
  font-size: .78rem;
  padding: 10px 0 6px;
}
.review-rows-wrap{
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.review-row{
  overflow: hidden;
  width: 100%;
}
.review-row-track{
  display: flex;
  gap: 12px;
  width: max-content;
  animation: reviewTicker 24s linear infinite;
}
.review-row-track.is-reverse{
  animation-direction: reverse;
}
@keyframes reviewTicker{
  from{ transform: translateX(0); }
  to{ transform: translateX(-50%); }
}
.review-mini-card{
  width: 260px;
  min-height: 138px;
  background: #fff;
  border: 1px solid rgba(180,35,108,.10);
  border-radius: 22px;
  padding: 14px;
  box-shadow: 0 10px 22px rgba(0,0,0,.04);
}
.review-mini-card.is-compact{ width: 240px; }
.review-mini-head{
  display: flex;
  gap: 10px;
  align-items: center;
  margin-bottom: 10px;
}
.review-avatar{
  width: 46px;
  height: 46px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid rgba(180,35,108,.10);
  overflow: hidden;
  flex-shrink: 0;
}
.review-avatar.big{
  width: 58px;
  height: 58px;
}
.review-avatar img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.review-mini-name,
.review-page-name{
  font-weight: 900;
  color: var(--eht-rose);
}
.review-mini-meta,
.review-page-meta{
  color: var(--eht-muted);
  font-size: .83rem;
}
.review-mini-text,
.review-page-text{
  margin: 0;
  color: var(--eht-text);
  line-height: 1.7;
  font-size: .95rem;
}
.review-page-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.review-page-card{
  background: #fff;
  border: 1px solid rgba(180,35,108,.10);
  border-radius: 24px;
  padding: 16px;
  box-shadow: 0 10px 24px rgba(0,0,0,.05);
}
.review-page-head{
  display: flex;
  gap: 12px;
  align-items: center;
  margin-bottom: 12px;
}
.review-page-photos{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
}
.review-photo{
  display: block;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(180,35,108,.10);
  background: #fff;
}
.review-photo img{
  width: 100%;
  height: 92px;
  object-fit: cover;
  display: block;
}
.review-form-stars{
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.review-form-stars button{
  width: 44px;
  height: 44px;
  border-radius: 14px;
  border: 1px solid rgba(180,35,108,.14);
  background: #fff;
  color: #d7b267;
}
.review-form-stars button.is-active{
  background: rgba(255,79,163,.08);
  border-color: rgba(180,35,108,.28);
  color: #ffb200;
}
.account-action-list{
  display: grid;
  gap: 10px;
}
.account-action-btn{
  width: 100%;
  border: 1px solid rgba(180,35,108,.12);
  background: #fff;
  min-height: 54px;
  border-radius: 18px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 16px;
  color: var(--eht-rose);
  font-weight: 800;
  text-decoration: none;
}
.account-action-btn:hover{
  text-decoration: none;
  background: rgba(255,79,163,.08);
}
.account-action-btn i{
  font-size: 1.15rem;
}
.designer-modal{
  position: fixed;
  inset: 0;
  z-index: 1200;
}
.designer-backdrop{
  position: absolute;
  inset: 0;
  background: rgba(20,10,15,.58);
  backdrop-filter: blur(3px);
}
.designer-modal-box{
  position: relative;
  width: min(92vw, 430px);
  margin: 6vh auto 0;
  background: linear-gradient(180deg, #fff 0%, #fff8fc 100%);
  border: 1px solid rgba(180,35,108,.14);
  border-radius: 28px;
  padding: 28px 20px 22px;
  box-shadow: 0 28px 60px rgba(0,0,0,.18);
  animation: designerIn .32s ease;
  text-align: center;
}
@keyframes designerIn{
  from{ transform: translateY(18px) scale(.96); opacity: 0; }
  to{ transform: translateY(0) scale(1); opacity: 1; }
}
.designer-close{
  position: absolute;
  top: 12px;
  inset-inline-end: 12px;
  width: 38px;
  height: 38px;
  border-radius: 999px;
  border: 0;
  background: rgba(255,79,163,.12);
  color: var(--eht-rose);
}
.designer-avatar-wrap{
  width: 96px;
  height: 96px;
  border-radius: 999px;
  overflow: hidden;
  margin: 0 auto 16px;
  border: 3px solid rgba(255,79,163,.16);
  box-shadow: 0 10px 20px rgba(0,0,0,.08);
}
.designer-avatar-wrap img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.designer-title-ruqaa{
  font-family: "Aref Ruqaa Ink", serif;
  font-size: 1.32rem;
  color: var(--eht-rose);
  line-height: 1.8;
  margin-bottom: 10px;
}
.designer-subtitle,
.designer-prayer{
  color: var(--eht-text);
  line-height: 1.8;
  font-size: .96rem;
}
.designer-socials{
  display: flex;
  justify-content: center;
  gap: 12px;
  margin: 16px 0;
}
.designer-socials a{
  width: 48px;
  height: 48px;
  border-radius: 16px;
  border: 1px solid rgba(180,35,108,.12);
  background: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  color: var(--eht-rose);
}
.admin-image-preview{
  min-height: 120px;
  border: 1px dashed rgba(180,35,108,.22);
  border-radius: 18px;
  background: rgba(255,79,163,.04);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px;
  color: var(--eht-muted);
  text-align: center;
}
.admin-table td[data-label]{
  vertical-align: middle;
}
@media (max-width: 767.98px){
  :root{
    --header-h: 84px;
  }
  .app-header .inner{
    padding-inline: 10px;
    gap: 6px;
  }
  .brand{
    gap: 8px;
    max-width: calc(100% - 138px);
  }
  .brand-logo{
    width: 48px;
    height: 48px;
    border-radius: 16px;
  }
  .brand-names .ar{
    font-size: 1.45rem !important;
  }
  .brand-names .en{
    font-size: .92rem !important;
  }
  .brand-tagline{
    font-size: .76rem !important;
    margin-top: 2px;
  }
  .header-actions{
    gap: 4px !important;
  }
  .icon-btn{
    height: 40px;
    min-width: 40px;
    border-radius: 14px;
  }
  .wish-btn,
  .currency-btn{
    width: 40px !important;
  }
  .cart-btn{
    min-width: 42px;
    padding: 5px 7px !important;
  }
  .cart-label{
    display: none;
  }
  .header-welcome{
    font-size: .72rem;
    bottom: -14px;
  }
  .whatsapp-fab{
    left: 12px;
    bottom: calc(var(--bottom-nav-h) + 12px);
    padding: 10px 12px;
    font-size: .85rem;
  }
  .review-page-grid{
    grid-template-columns: 1fr;
  }
  .review-page-photos{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .socials-mobile-center{
    justify-content: center;
  }
  body.admin-body .table-responsive{
    overflow: visible;
  }
  body.admin-body .admin-table thead{
    display: none;
  }
  body.admin-body .admin-table,
  body.admin-body .admin-table tbody,
  body.admin-body .admin-table tr,
  body.admin-body .admin-table td{
    display: block;
    width: 100%;
  }
  body.admin-body .admin-table tr{
    background: #fff;
    border: 1px solid rgba(180,35,108,.10);
    border-radius: 20px;
    padding: 10px;
    margin-bottom: 12px;
    box-shadow: 0 8px 18px rgba(0,0,0,.04);
  }
  body.admin-body .admin-table td{
    border: 0 !important;
    padding: 8px 6px !important;
    text-align: right;
  }
  body.admin-body .admin-table td::before{
    content: attr(data-label);
    display: block;
    color: var(--eht-muted);
    font-size: .78rem;
    margin-bottom: 4px;
    font-weight: 700;
  }
  .admin-top{
    flex-direction: column;
    align-items: stretch;
  }
  .admin-top > *{
    width: 100%;
  }
}

/* ---------- 2026 storefront refinement ---------- */
:root{
  --header-h: 102px;
}
body.is-home{
  --header-h: 148px;
}
body.has-shell{
  padding-top: var(--header-h);
}
.app-header{
  height: auto;
  min-height: var(--header-h);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  background: rgba(255,255,255,.96);
  backdrop-filter: blur(12px);
  box-shadow: 0 10px 30px rgba(180,35,108,.06);
}
.app-header .inner{
  min-height: 86px;
  padding-top: 10px;
  padding-bottom: 10px;
}
.top-whatsapp-strip{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  width: 100%;
  padding: 10px 14px;
  background: linear-gradient(90deg, #fff1f8 0%, #f6fff9 100%);
  border-bottom: 1px solid rgba(180,35,108,.10);
  color: #0f7d3a;
  font-weight: 900;
  font-size: .92rem;
  text-decoration: none;
}
.top-whatsapp-strip:hover{
  text-decoration: none;
  filter: brightness(.98);
}
.top-whatsapp-strip.is-disabled{
  pointer-events: none;
  opacity: .75;
}
.brand-logo{
  background: #fff;
  padding: 6px;
}
.currency-btn .icon-badge-wrap{
  background: rgba(255,79,163,.12);
}
.currency-flag-icon{
  font-size: 1.3rem;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.home-page .search-wrap{
  margin-top: 2px;
}
.hero-banner-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.hero-banner-card{
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 242px;
  background: #fff;
  border: 1px solid rgba(180,35,108,.12);
  border-radius: 24px;
  box-shadow: 0 16px 34px rgba(0,0,0,.05);
  text-decoration: none;
}
.hero-banner-card:hover{
  text-decoration: none;
  transform: translateY(-1px);
}
.hero-banner-card img{
  width: 100%;
  height: 140px;
  object-fit: cover;
  display: block;
  background: #fff;
}
.hero-banner-content{
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 14px 16px 16px;
  height: 100%;
}
.hero-banner-eyebrow{
  color: var(--eht-rose);
  font-weight: 900;
  font-size: .8rem;
}
.hero-banner-title{
  color: #35272e;
  font-weight: 900;
  font-size: 1.1rem;
}
.hero-banner-content p{
  margin: 0;
  color: var(--eht-muted);
  line-height: 1.7;
  font-size: .92rem;
}
.hero-banner-cta{
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--eht-rose);
  font-weight: 900;
}
.category-quick-card{
  width: 142px;
  min-height: 118px;
  flex: 0 0 auto;
  background: #fff;
  border: 1px solid rgba(180,35,108,.10);
  border-radius: 22px;
  padding: 14px 12px;
  text-align: center;
  color: #372b31;
  box-shadow: 0 10px 24px rgba(0,0,0,.04);
}
.category-quick-card:hover{
  background: rgba(255,79,163,.05);
  text-decoration: none;
}
.category-quick-card .icon{
  width: 52px;
  height: 52px;
  border-radius: 18px;
  margin: 0 auto 10px;
  background: rgba(255,79,163,.10);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--eht-rose);
  font-size: 1.35rem;
}
.category-quick-card .title{
  font-weight: 900;
  font-size: .92rem;
  line-height: 1.35;
}
.custom-order-shell{
  background: linear-gradient(180deg, #fff 0%, #fff8fc 100%);
}
.custom-order-copy{
  color: var(--eht-muted);
  line-height: 1.8;
  margin-bottom: 6px;
}
.reviews-home-section .section-title{
  margin-bottom: 12px;
}
.about-store-showcase{
  background: linear-gradient(180deg, #fff 0%, #fff5fa 100%);
  border: 1px solid rgba(180,35,108,.12);
  border-radius: 30px;
  padding: 20px;
  box-shadow: 0 18px 40px rgba(255,79,163,.06);
}
.about-store-grid{
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(280px, .9fr);
  gap: 18px;
}
.about-story-panel,
.about-contact-card,
.about-social-card{
  background: #fff;
  border: 1px solid rgba(180,35,108,.10);
  border-radius: 24px;
  padding: 18px;
}
.about-story-copy{
  color: #4e4047;
  line-height: 2;
  font-size: .98rem;
}
.about-feature-list{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 16px;
}
.about-feature-item{
  display: flex;
  gap: 12px;
  align-items: flex-start;
  background: #fff8fc;
  border: 1px solid rgba(180,35,108,.08);
  border-radius: 20px;
  padding: 14px;
}
.about-feature-item .icon{
  width: 44px;
  height: 44px;
  border-radius: 16px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--eht-rose);
  background: rgba(255,79,163,.10);
  font-size: 1.15rem;
}
.about-feature-item .title{
  font-weight: 900;
  color: #35272e;
  margin-bottom: 2px;
}
.about-feature-item .text{
  color: var(--eht-muted);
  line-height: 1.6;
  font-size: .88rem;
}
.about-contact-title{
  font-size: 1.05rem;
  font-weight: 900;
  color: var(--eht-rose);
}
.about-social-card{
  text-align: center;
}
.strip-section .section-title h2{
  font-size: 1.05rem;
}
.review-mini-card{
  min-height: 148px;
}
.order-success-hero{
  display: grid;
  gap: 16px;
}
.order-success-card{
  background: #fff;
  border: 1px solid rgba(180,35,108,.12);
  border-radius: 28px;
  padding: 18px;
  box-shadow: 0 18px 40px rgba(0,0,0,.05);
}
.order-success-summary-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.order-success-pill{
  background: #fff8fc;
  border: 1px solid rgba(180,35,108,.10);
  border-radius: 20px;
  padding: 12px 14px;
}
.order-success-pill .label{
  color: var(--eht-muted);
  font-size: .84rem;
}
.order-success-pill .value{
  color: #372b31;
  font-weight: 900;
  margin-top: 4px;
}
.local-profile-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.local-profile-card{
  background: #fff;
  border: 1px solid rgba(180,35,108,.10);
  border-radius: 20px;
  padding: 14px;
}
.local-profile-card .label{
  color: var(--eht-muted);
  font-size: .84rem;
}
.local-profile-card .value{
  font-weight: 900;
  color: #372b31;
  margin-top: 4px;
}
.account-action-list{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.account-action-btn{
  min-height: 72px;
}
.lookup-inline-form{
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
}
.return-helper-note{
  background: #fff8fc;
  border: 1px dashed rgba(255,79,163,.24);
  border-radius: 18px;
  padding: 12px 14px;
  color: var(--eht-muted);
}
@media (max-width: 991px){
  .about-store-grid{
    grid-template-columns: 1fr;
  }
}
@media (max-width: 767px){
  body.is-home{
    --header-h: 142px;
  }
  .hero-banner-grid{
    grid-template-columns: 1fr;
  }
  .hero-banner-card{
    min-height: 228px;
  }
  .hero-banner-card img{
    height: 132px;
  }
  .about-feature-list,
  .order-success-summary-grid,
  .local-profile-grid,
  .account-action-list{
    grid-template-columns: 1fr;
  }
  .lookup-inline-form{
    grid-template-columns: 1fr;
  }
}
@media (max-width: 480px){
  .top-whatsapp-strip{
    font-size: .84rem;
    min-height: 38px;
  }
  .app-header .inner{
    min-height: 82px;
  }
  .category-quick-card{
    width: 132px;
    min-height: 112px;
  }
  .hero-banner-content{
    padding: 12px 14px 14px;
  }
}

.hero-banner-slider{ position:relative; border-radius:24px; }
.hero-banner-stack{ position:relative; width:100%; height:240px; border-radius:24px; overflow:hidden; background:var(--eht-bg); border:1px solid rgba(180,35,108,.10); box-shadow:0 16px 34px rgba(0,0,0,.05); }
.hero-banner-slide{ position:absolute; inset:0; display:block; border-radius:24px; overflow:hidden; opacity:0; visibility:hidden; transition:opacity 1s cubic-bezier(0.4,0,0.2,1), visibility 0s linear 1s; pointer-events:none; }
.hero-banner-slide.is-active{ opacity:1; visibility:visible; transition:opacity 1s cubic-bezier(0.4,0,0.2,1), visibility 0s linear 0s; pointer-events:auto; z-index:1; }
.hero-banner-slide img{ width:100%; height:100%; object-fit:cover; display:block; background:var(--eht-bg); transform:scale(1); transition:transform 1s ease; }
.hero-banner-slide.is-active img{ animation: heroBannerZoom 5s ease-out forwards; }
@keyframes heroBannerZoom { 0%{ transform:scale(1); } 100%{ transform:scale(1.08); } }
.hero-banner-dots{ display:flex; justify-content:center; gap:8px; margin-top:12px; }
.hero-banner-dot{ width:10px; height:10px; border-radius:999px; border:0; cursor:pointer; background:rgba(180,35,108,.22); transition:width .35s cubic-bezier(0.4,0,0.2,1), background .3s ease; }
.hero-banner-dot.active{ width:28px; background:var(--eht-rose); }
.hero-banner-dot:hover:not(.active){ background:rgba(180,35,108,.45); }
.review-rows-static .review-mini-card{ width:100%; min-height:auto; }
.product-card-name{ font-size:.98rem; line-height:1.55; }
.product-card .price-stack{ margin-top:6px; }
.product-card-contents{ color:var(--eht-muted); font-size:.88rem; line-height:1.6; min-height:24px; }
.product-card-actions{ margin-top:4px; }
.prod-card-wrap{ width:248px; }
.btn.is-added{ background:#e9fff2; color:#128a45; border-color:rgba(18,138,69,.22); }
.payment-option-body{ border-width:1.5px; }
.payment-option.active .payment-option-body{ border-color:#ff4fa3; background:#fff0f7; box-shadow:0 12px 24px rgba(255,79,163,.12); }
.account-profile-bar{ width:100%; border:1px solid rgba(255,79,163,.18); background:#fff2f8; min-height:68px; border-radius:22px; display:flex; align-items:center; gap:14px; padding:0 16px; color:var(--eht-rose); font-weight:900; }
.account-profile-avatar{ width:48px; height:48px; border-radius:18px; background:#fff; border:1px solid rgba(180,35,108,.12); display:flex; align-items:center; justify-content:center; font-size:1.35rem; }
.account-profile-text{ flex:1; text-align:right; }
.account-profile-arrow{ transition:transform .2s ease; }
.account-profile-bar.is-open .account-profile-arrow{ transform:rotate(180deg); }
.account-profile-panel{ margin-top:14px; }
.single-column-grid{ grid-template-columns:1fr; }
.account-action-list-single{ grid-template-columns:1fr; }
.designer-modal-box{ animation:none; }
.designer-title-plain{ font-size:1.12rem; color:var(--eht-rose); line-height:1.8; margin-bottom:10px; font-weight:800; font-family:inherit; }
.designer-avatar-wrap img{ object-fit:contain; background:#fff; }
@media (max-width: 767px){ .hero-banner-stack{ height:190px; } }
body.is-home{ --header-h:92px; }
@media (max-width: 767px){ body.is-home{ --header-h:92px; } }


/* Account, wishlist and admin additions */
.account-profile-link{
  text-decoration:none;
  color: inherit;
}
.account-profile-arrow-link{
  transform: none;
}
.order-history-card .order-summary-text{
  max-width: 100%;
  white-space: normal;
  text-align: start;
}
.admin-dashboard-head{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
}
.store-owner-avatar{
  width:72px;
  height:72px;
  border-radius:22px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(255,79,163,0.12);
  color: var(--eht-rose);
  font-size: 2.4rem;
  flex: 0 0 auto;
}
.admin-owner-name{
  color: var(--eht-rose);
  font-size: 1.15rem;
}
.admin-menu-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
}
.admin-menu-card{
  background:#fff;
  border: 1px solid rgba(180,35,108,0.12);
  border-radius: 22px;
  padding: 18px 16px;
  display:flex;
  align-items:center;
  gap:12px;
  color: var(--eht-rose);
  text-decoration:none;
  font-weight: 800;
}
.admin-menu-card i{
  font-size: 1.45rem;
}
.admin-menu-card:hover{
  background: rgba(255,79,163,0.06);
  text-decoration:none;
}
.admin-summary-card{
  padding: 14px;
}
.admin-long-text{
  white-space: normal;
  min-width: 180px;
}
@media (max-width: 767.98px){
  .admin-menu-grid{
    grid-template-columns: 1fr;
  }
}

/* Requested adjustments only */
.product-card-media{
  position: relative;
}
.product-wishlist-btn{
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 3;
  width: 40px;
  height: 40px;
  border-radius: 999px;
  border: 1px solid rgba(180,35,108,.14);
  background: rgba(255,255,255,.96);
  color: #7b6c73;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 24px rgba(0,0,0,.10);
  transition: transform .18s ease, color .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.product-wishlist-btn:hover{
  transform: translateY(-1px);
}
.product-wishlist-btn i{
  font-size: 1.1rem;
  line-height: 1;
}
.product-wishlist-btn.active{
  color: #fff;
  background: #e53935;
  border-color: #e53935;
  box-shadow: 0 12px 26px rgba(229,57,53,.26);
}
.product-wishlist-btn.is-animating,
#wishlistBtn.is-animating{
  animation: wishPulse .34s ease;
}
@keyframes wishPulse{
  0%{ transform: scale(1); }
  45%{ transform: scale(1.16); }
  100%{ transform: scale(1); }
}
.phone-split-group{
  display: grid;
  grid-template-columns: 128px minmax(0, 1fr);
  gap: 10px;
}
.phone-code-select{
  min-width: 0;
}
.phone-local-input{
  min-width: 0;
}
.account-menu-stack{
  display: grid;
  gap: 12px;
}
.account-menu-bar{
  width: 100%;
  border: 1px solid rgba(255,79,163,.16);
  background: #fff;
  border-radius: 22px;
  min-height: 68px;
  padding: 14px 16px;
  display: flex;
  align-items: center;
  gap: 14px;
  text-decoration: none;
  color: #372b31;
  font-weight: 800;
  box-shadow: 0 14px 32px rgba(0,0,0,.04);
}
button.account-menu-bar{
  text-align: right;
}
.account-menu-bar:hover{
  text-decoration: none;
  background: #fff8fc;
  color: #372b31;
}
.account-menu-icon{
  width: 46px;
  height: 46px;
  border-radius: 16px;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,79,163,.10);
  color: var(--eht-rose);
  font-size: 1.22rem;
}
.account-menu-text{
  flex: 1;
}
.account-menu-arrow{
  color: var(--eht-muted);
}
.designer-modal-box{
  animation: none !important;
  transform: none !important;
}
@media (max-width: 767px){
  .phone-split-group{
    grid-template-columns: 110px minmax(0, 1fr);
  }
}

/* Admin order rows by status */
.admin-order-row-pending td { background: rgba(255, 165, 60, 0.12) !important; }
.admin-order-row-completed td { background: rgba(40, 180, 99, 0.14) !important; }
.admin-order-row-cancelled td { background: rgba(220, 53, 69, 0.14) !important; }
.admin-status-pill {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
}
.admin-status-new, .admin-status-pending { background: #ffe5c4; color: #a85a00; }
.admin-status-completed { background: #c9f0d6; color: #1a6c3b; }
.admin-status-cancelled { background: #fbd0d4; color: #9a1a26; }

/* Customer-facing order cards by status */
.order-card-pending { border-inline-start: 6px solid #ffa53c; background: rgba(255,165,60,0.06); }
.order-card-completed { border-inline-start: 6px solid #28b463; background: rgba(40,180,99,0.06); }
.order-card-cancelled { border-inline-start: 6px solid #dc3545; background: rgba(220,53,69,0.06); }
.order-status-completed { color: #1a6c3b; }
.order-status-cancelled { color: #9a1a26; }
.order-status-new, .order-status-pending { color: #a85a00; }

/* ============================================================
   ADMIN PRO THEME — lighter, professional, non-pink
   ============================================================ */
.admin-body-pro{
  background: linear-gradient(180deg,#f4f6fb 0%,#eef1f7 100%);
  min-height: 100vh;
  color: #2a2f3a;
}
.admin-card-pro{
  background:#fff;
  border:1px solid #e3e7ef;
  border-radius:18px;
  padding:18px;
  box-shadow:0 4px 16px rgba(31,42,68,.05);
}
.admin-pic-frame{
  width:120px;height:120px;
  border-radius:50%;
  overflow:hidden;
  margin:0 auto;
  border:4px solid #fff;
  box-shadow:0 6px 20px rgba(31,42,68,.18);
  background:#eef1f7;
}
.admin-pic-frame-sm{ width:90px;height:90px;border-width:3px; }
.admin-pic-frame img{ width:100%;height:100%;object-fit:cover;display:block; }

.admin-owner-title{ color:#2a3656; }

.admin-hero-pro{
  background:linear-gradient(135deg,#3b4a73 0%,#5468a6 100%);
  color:#fff;
  border-radius:22px;
  padding:24px 18px 20px;
  text-align:center;
  margin-bottom:18px;
  box-shadow:0 10px 28px rgba(59,74,115,.20);
}
.admin-hero-pro .admin-pic-frame{ border-color:rgba(255,255,255,.85); }
.admin-hero-name{ font-weight:900;font-size:1.25rem;margin-top:12px; }
.admin-hero-sub{ opacity:.85;font-size:.9rem;margin-top:2px; }

.admin-grid-2{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
@media (max-width:520px){
  .admin-grid-2{ grid-template-columns:1fr; }
}
.admin-tile-pro{
  display:flex;
  align-items:center;
  gap:14px;
  background:#fff;
  border:1px solid #e3e7ef;
  border-radius:18px;
  padding:16px;
  text-decoration:none;
  color:#2a2f3a;
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.admin-tile-pro:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 24px rgba(59,74,115,.12);
  border-color:#5468a6;
  color:#2a2f3a;
  text-decoration:none;
}
.admin-tile-icon{
  width:54px;height:54px;flex-shrink:0;
  border-radius:14px;
  background:linear-gradient(135deg,#eaf0ff,#dbe4f7);
  color:#3b4a73;
  display:flex;align-items:center;justify-content:center;
  font-size:1.5rem;
}
.admin-tile-title{ font-weight:800;font-size:1rem;color:#2a3656; }
.admin-tile-desc{ font-size:.82rem;color:#6c7591;margin-top:2px; }

.btn-admin-pro{
  background:linear-gradient(135deg,#3b4a73,#5468a6);
  color:#fff;
  border:none;
  font-weight:700;
  border-radius:12px;
  padding:8px 16px;
  transition:filter .15s;
}
.btn-admin-pro:hover{ color:#fff;filter:brightness(1.08); }
.btn-admin-pro:disabled{ opacity:.7; }

.admin-shell-pro{
  display:flex;align-items:center;gap:14px;
  background:#fff;
  border:1px solid #e3e7ef;
  border-radius:18px;
  padding:12px 16px;
  box-shadow:0 4px 14px rgba(31,42,68,.05);
}
.admin-shell-pic{
  width:54px;height:54px;border-radius:50%;
  overflow:hidden;flex-shrink:0;
  border:2px solid #fff;
  box-shadow:0 4px 10px rgba(31,42,68,.12);
}
.admin-shell-pic img{ width:100%;height:100%;object-fit:cover; }
.admin-shell-name{ color:#2a3656;font-size:1.05rem; }
.admin-shell-sub{ color:#6c7591;font-size:.85rem; }

.admin-modal-pro{ border-radius:20px;border:none;overflow:hidden; }
.admin-modal-pro .modal-header{ background:#f4f6fb;border-bottom:1px solid #e3e7ef; }
.admin-modal-pro .modal-title{ color:#2a3656; }

.admin-products-list,
.admin-categories-list{ display:flex;flex-direction:column;gap:10px; }
.admin-product-row{
  display:flex;align-items:center;gap:12px;
  background:#fff;border:1px solid #e8ecf3;
  border-radius:14px;padding:10px 12px;
  transition:border-color .15s, box-shadow .15s;
}
.admin-product-row:hover{ border-color:#5468a6;box-shadow:0 6px 14px rgba(59,74,115,.08); }
.admin-product-thumb{
  width:54px;height:54px;border-radius:12px;object-fit:cover;flex-shrink:0;background:#eef1f7;
}
.admin-product-name{ font-weight:800;color:#2a3656;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.admin-product-meta{ color:#6c7591;font-size:.82rem; }
.admin-product-actions .btn{ border-radius:10px; }
.admin-cat-icon{
  width:46px;height:46px;border-radius:12px;flex-shrink:0;
  background:linear-gradient(135deg,#eaf0ff,#dbe4f7);
  color:#3b4a73;display:flex;align-items:center;justify-content:center;font-size:1.15rem;
}

.price-currency-grid .input-group-text{
  background:#eef1f7;border:1px solid #d8dee9;color:#3b4a73;font-weight:700;min-width:50px;justify-content:center;
}

@media (max-width:540px){
  .admin-product-row{ flex-wrap:wrap; }
  .admin-product-actions{ margin-inline-start:auto; }
}

/* ============================================================
   SKELETON LOADING
   ============================================================ */
@keyframes skeleton-shimmer{
  0%{ background-position:-200px 0; }
  100%{ background-position:calc(200px + 100%) 0; }
}
.skeleton-block,.skeleton-line,.skeleton-thumb{
  background:linear-gradient(90deg,#eef1f7 0%,#f7f9fc 40%,#eef1f7 80%);
  background-size:200px 100%;
  background-repeat:no-repeat;
  animation:skeleton-shimmer 1.4s linear infinite;
  border-radius:8px;
  display:block;
}
.skeleton-line{ height:12px;margin:6px 0; }
.skeleton-line.w-15{ width:15%; }
.skeleton-line.w-40{ width:40%; }
.skeleton-line.w-50{ width:50%; }
.skeleton-line.w-60{ width:60%; }
.skeleton-line.w-70{ width:70%; }
.skeleton-thumb{ width:54px;height:54px;border-radius:12px;flex-shrink:0; }
.skeleton-row{ pointer-events:none; }
.skeleton-card{
  background:#fff;border:1px solid #eef1f7;border-radius:18px;padding:14px;height:100%;
}
.skeleton-card .sk-img{ width:100%;height:140px;border-radius:14px;margin-bottom:12px;
  background:linear-gradient(90deg,#eef1f7 0%,#f7f9fc 40%,#eef1f7 80%);
  background-size:200px 100%;animation:skeleton-shimmer 1.4s linear infinite;
}

/* ============================================================
   ORDER ANIMATION OVERLAY (car → check + green flash + stars)
   ============================================================ */
body.order-anim-lock{ overflow:hidden; }
.order-anim-overlay{
  position:fixed;inset:0;z-index:2000;
  background:rgba(15,30,15,.92);
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
}
.order-anim-flash{
  position:absolute;inset:0;
  background:radial-gradient(circle at center,#34d77a 0%,#1e9b58 60%,transparent 100%);
  opacity:0;
}
.order-anim-overlay.is-running .order-anim-flash{
  animation:anim-flash 1.6s ease-out forwards;
}
@keyframes anim-flash{
  0%{ opacity:0; }
  20%{ opacity:.55; }
  60%{ opacity:.25; }
  100%{ opacity:.15; }
}
.order-anim-stage{
  position:relative;width:min(560px,92vw);height:280px;
  display:flex;align-items:center;justify-content:center;
}
.order-anim-road{
  position:absolute;left:0;right:0;bottom:60px;height:4px;
  background:repeating-linear-gradient(90deg,#fff 0 24px,transparent 24px 48px);
  opacity:.6;
}
.order-anim-car{
  position:absolute;bottom:60px;right:-260px;width:220px;
  transform:translateY(-2px);
}
.order-anim-overlay.is-running .order-anim-car{
  animation:anim-drive 1.6s cubic-bezier(.45,.05,.55,.95) forwards;
}
@keyframes anim-drive{
  0%{ right:-260px; }
  60%{ right:50%; transform:translateX(50%) translateY(-2px); }
  100%{ right:-260px; transform:translateX(0) translateY(-2px); opacity:0; }
}
.order-anim-success{
  position:absolute;inset:0;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  opacity:0;transform:scale(.8);
  pointer-events:none;
}
.order-anim-overlay.show-success .order-anim-success{
  animation:anim-success 1.2s ease forwards;
}
@keyframes anim-success{
  0%{ opacity:0;transform:scale(.6); }
  60%{ opacity:1;transform:scale(1.06); }
  100%{ opacity:1;transform:scale(1); }
}
.order-anim-check{
  width:120px;height:120px;border-radius:50%;
  background:#fff;color:#1e9b58;
  display:flex;align-items:center;justify-content:center;
  font-size:4rem;
  box-shadow:0 0 0 12px rgba(255,255,255,.18),0 0 60px rgba(52,215,122,.7);
  margin-bottom:14px;
}
.order-anim-title{
  color:#fff;font-weight:900;font-size:1.6rem;
  text-shadow:0 2px 12px rgba(0,0,0,.4);
}
.order-anim-stars{
  position:absolute;inset:0;pointer-events:none;
}
.order-anim-stars i{
  position:absolute;color:#ffe23a;font-size:1.3rem;
  opacity:0;
}
.order-anim-overlay.show-success .order-anim-stars i{
  animation:anim-star 1.4s ease-out forwards;
  animation-delay:var(--d,0s);
}
.order-anim-stars i:nth-child(1){ top:30%;left:25%; }
.order-anim-stars i:nth-child(2){ top:25%;right:25%; }
.order-anim-stars i:nth-child(3){ bottom:30%;left:30%; }
.order-anim-stars i:nth-child(4){ bottom:35%;right:28%; }
.order-anim-stars i:nth-child(5){ top:45%;left:15%; }
.order-anim-stars i:nth-child(6){ top:50%;right:15%; }
@keyframes anim-star{
  0%{ opacity:0;transform:scale(.3) rotate(0deg); }
  40%{ opacity:1;transform:scale(1.3) rotate(180deg); }
  100%{ opacity:0;transform:scale(.6) rotate(360deg) translateY(-30px); }
}

/* ============================================================
   ADMIN PRO — login centering + table + extra fixes
   ============================================================ */
.admin-body-pro{
  background: linear-gradient(180deg,#f0f2f8 0%,#e8ecf5 100%) !important;
  min-height: 100vh;
}
.admin-login-wrap{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:100vh;
  padding:24px 16px;
}
.admin-table-pro{
  border-collapse:separate;
  border-spacing:0;
  width:100%;
  font-size:.9rem;
}
.admin-table-pro thead tr{
  background:#f4f6fb;
}
.admin-table-pro thead th{
  color:#2a3656;
  font-weight:700;
  border-bottom:2px solid #e3e7ef;
  padding:12px 14px;
  white-space:nowrap;
}
.admin-table-pro tbody tr{
  border-bottom:1px solid #eef1f7;
  transition:background .12s;
}
.admin-table-pro tbody tr:hover{
  background:#f8f9fd;
}
.admin-table-pro tbody td{
  padding:11px 14px;
  color:#2a2f3a;
  vertical-align:middle;
}
.admin-summary-card{
  background:#fff;border:1px solid #e3e7ef;border-radius:14px;padding:14px 18px;
}
@media (max-width:640px){
  .admin-table-pro thead{ display:none; }
  .admin-table-pro tbody tr{
    display:block;
    border-radius:14px;
    border:1px solid #e3e7ef;
    margin-bottom:10px;
    padding:10px 12px;
  }
  .admin-table-pro tbody td{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:8px;
    padding:7px 0;
    border-bottom:1px dashed #eef1f7;
    font-size:.85rem;
  }
  .admin-table-pro tbody td:last-child{ border-bottom:none; }
  .admin-table-pro tbody td::before{
    content:attr(data-label);
    color:#6c7591;
    font-weight:700;
    font-size:.8rem;
    flex-shrink:0;
  }
}
.admin-long-text{
  max-width:240px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  color:#4a5568;
}
.admin-status-pill{
  display:inline-flex;
  align-items:center;
  padding:3px 10px;
  border-radius:20px;
  font-size:.78rem;
  font-weight:700;
  white-space:nowrap;
}
.admin-status-completed{ background:#e6f9f0;color:#1a7f4b; }
.admin-status-cancelled{ background:#fde8e8;color:#c0392b; }
.admin-status-pending{ background:#fff8e1;color:#b7790a; }
.admin-order-row-completed td{ opacity:.75; }
.admin-order-row-cancelled td{ opacity:.6; }

/* ============================================
   v2026-05-09 New layout updates
   ============================================ */

/* Footer trim */
.site-mini-footer-tight{
  padding: 8px 14px 14px !important;
  margin-bottom: 0 !important;
  text-align: center;
  color: #8a8a96;
  font-size: 0.78rem;
  line-height: 1.4;
}
body.with-bottom-nav .app-main{ padding-bottom: 84px; }
body.without-bottom-nav .app-main{ padding-bottom: 14px; }

/* About centered new layout */
.about-store-centered{ display:flex; flex-direction:column; gap:14px; padding:14px 6px 6px; }
.about-center-title{ text-align:center; font-weight:900; color:var(--eht-rose); font-size:1.45rem; letter-spacing:.5px; margin-bottom:4px; }
.about-story-card{ background:#fff; border-radius:22px; box-shadow:0 6px 22px rgba(180,35,108,.07); border:1px solid rgba(180,35,108,.08); padding:18px 18px 14px; }
.about-story-copy p{ line-height:2.05; font-size:0.96rem; color:#3a2a35; margin-bottom:12px; }
.about-story-copy strong{ color:var(--eht-rose); }
.about-ceo-signature{ text-align:left; direction:ltr; padding-top:12px; border-top:1px dashed rgba(180,35,108,.15); margin-top:6px; font-weight:800; color:var(--eht-rose); font-size:.95rem; }
.about-sig-pen{ font-size:1.2rem; }
.about-sig-name{ margin:0 4px; }
.about-sig-role{ font-size:.8rem; color:#8a6478; font-weight:700; letter-spacing:.5px; }

.about-quick-card{ background:#fff; border-radius:22px; box-shadow:0 6px 22px rgba(180,35,108,.07); border:1px solid rgba(180,35,108,.08); padding:18px; }
.about-contact-title{ font-weight:900; color:var(--eht-rose); font-size:1.1rem; margin-bottom:6px; }
.about-quick-actions{ display:flex; gap:10px; flex-wrap:wrap; }
.about-quick-actions .btn{ flex:1 1 160px; }

.about-social-card{ background:#fff; border-radius:22px; box-shadow:0 6px 22px rgba(180,35,108,.07); border:1px solid rgba(180,35,108,.08); padding:14px 18px; }

/* Cart updates */
.cart-line-price{ font-weight:800; color:var(--eht-rose); font-size:0.98rem; margin-bottom:2px; }
.cart-line-qty{ font-variant-numeric: tabular-nums; }
.cart-checkout-card{ padding:16px 18px; }
.cart-coupon-row{ display:flex; gap:8px; align-items:stretch; }
.cart-coupon-input{ flex:1; border-radius:14px; padding:12px 14px; border:1.5px solid rgba(180,35,108,.18); }
.cart-coupon-input:focus{ border-color:var(--eht-rose); box-shadow:0 0 0 .2rem rgba(180,35,108,.12); }
.cart-coupon-apply{ border-radius:14px; padding:0 18px; }
.cart-coupon-feedback{ min-height:18px; }
.cart-finish-btn{
  background:#25D366; color:#fff; border:none; font-weight:900; padding:14px;
  border-radius:16px; font-size:1.05rem; box-shadow:0 6px 18px rgba(37,211,102,.32);
  display:flex; align-items:center; justify-content:center; gap:10px;
}
.cart-finish-btn:hover{ background:#1ebe5d; color:#fff; }
.cart-finish-btn i{ font-size:1.25rem; }

/* Charity modal animation keyframes (used by FINAL block below) */
@keyframes charityIn{ from{ transform:translateY(20px); opacity:0; } to{ transform:translateY(0); opacity:1; } }
.charity-icon{ background: linear-gradient(135deg, #f7c5d8, #f9e2ed) !important; color:#a8366d !important; }
.charity-bar{ background: linear-gradient(180deg, #fff 0%, #fff5fa 100%); }
body.no-scroll{ overflow:hidden; }

/* Gift share close button (full modal styles defined later in v2026-05-09b) */
.gift-share-close{ position:absolute; top:10px; left:10px; background:#fff; border:1px solid rgba(0,0,0,.06); width:36px; height:36px; border-radius:50%; color:var(--eht-rose); font-size:1rem; }

/* Choice overlay - new structure (flag/avatar always at start) */
.choice-option-btn{
  width:100%; display:flex; align-items:center; gap:12px;
  padding:12px 14px; border-radius:16px; background:#fff;
  border:1.5px solid rgba(180,35,108,.14); cursor:pointer;
  text-align:start; transition:all .18s ease; font-family:inherit;
}
.choice-option-btn:hover{ border-color:var(--eht-rose); background:#fff5fa; }
.choice-option-btn.is-active{ border-color:var(--eht-rose); background:#fdf0f7; box-shadow:0 4px 12px rgba(180,35,108,.12); }
.choice-option-flag{ font-size:1.6rem; line-height:1; flex:0 0 auto; min-width:32px; text-align:center; }
.choice-option-avatar{ flex:0 0 auto; width:54px; height:54px; border-radius:14px; overflow:hidden; background:#fff5fa; border:1.5px solid rgba(180,35,108,.14); display:flex; align-items:center; justify-content:center; }
.choice-option-avatar.is-rounded{ border-radius:50%; }
.choice-option-avatar img{ width:100%; height:100%; object-fit:cover; display:block; }
.choice-option-body{ flex:1 1 auto; display:flex; flex-direction:column; gap:2px; min-width:0; }
.choice-option-label{ font-weight:800; color:#3a2a35; font-size:.98rem; }
.choice-option-note{ font-size:.78rem; color:#8a6478; }
.choice-options-wrap{ display:flex; flex-direction:column; gap:10px; }
.choice-options-rounded .choice-option-btn{ padding:14px; }


/* ============================================
   v2026-05-09b — banner zoom alt, custom-order, gift, language, skeleton
   ============================================ */

/* Banner taller on mobile + alternating zoom directions */
.hero-banner-stack{ height: 220px; }
@media (max-width: 767px){ .hero-banner-stack{ height: 200px; min-height: 200px; } }
.hero-banner-slide.is-active.hero-banner-zoom-in img{ animation: heroZoomIn 6s ease-in-out forwards; }
.hero-banner-slide.is-active.hero-banner-zoom-out img{ animation: heroZoomOut 6s ease-in-out forwards; }
@keyframes heroZoomIn { 0%{ transform:scale(1); } 100%{ transform:scale(1.12); } }
@keyframes heroZoomOut { 0%{ transform:scale(1.12); } 100%{ transform:scale(1); } }
.hero-banner-card,
.hero-banner-grid{ display:none !important; }

/* Custom order simplified */
.custom-order-simple{ display:flex; gap:10px; flex-wrap:wrap; align-items:stretch; }
.custom-order-name{ flex:1 1 220px; border-radius:14px; padding:12px 14px; border:1.5px solid rgba(180,35,108,.18); }
.custom-order-name:focus{ border-color:var(--eht-rose); box-shadow:0 0 0 .2rem rgba(180,35,108,.12); }
.custom-order-wa{ flex:1 1 200px; border-radius:14px; padding:12px 18px; font-weight:800; }
@media(min-width:768px){ .custom-order-wa{ flex:0 0 auto; } }

/* Gift share popup new layout */
.gift-share-modal{ position:fixed; inset:0; z-index:1300; display:none; align-items:center; justify-content:center; padding:16px; }
.gift-share-modal.is-open{ display:flex; }
.gift-share-backdrop{ position:absolute; inset:0; background:rgba(20,8,18,.72); backdrop-filter:blur(4px); }
.gift-share-box{ position:relative; background:linear-gradient(180deg, #fff 0%, #fff5fa 100%); border-radius:24px; max-width:460px; width:100%; padding:22px 20px 22px; box-shadow:0 20px 50px rgba(120,20,70,.3); animation: charityIn .35s cubic-bezier(0.4,0,0.2,1); }
.gift-share-emoji{ font-size:2.2rem; text-align:center; }
.gift-share-title{ text-align:center; font-weight:900; color:var(--eht-rose); font-size:1.25rem; margin:6px 0 12px; letter-spacing:.5px; }
.gift-share-explain{ background:#fff; border:1px dashed rgba(180,35,108,.25); border-radius:14px; padding:12px 14px; line-height:1.95; color:#3a2a35; font-size:.92rem; text-align:center; }
.gift-share-explain strong{ color:var(--eht-rose); font-weight:900; }
.gift-share-text-bar{ margin-top:12px; background:#fffafd; border:1.5px solid rgba(180,35,108,.18); border-radius:14px; padding:14px; line-height:2; font-size:.94rem; color:#3a2a35; word-break:break-word; }

/* Language loading overlay (8s) */
.lang-loading-modal{ position:fixed; inset:0; z-index:1400; display:none; align-items:center; justify-content:center; padding:18px; }
.lang-loading-modal.is-open{ display:flex; }
.lang-loading-backdrop{ position:absolute; inset:0; background:rgba(20,8,18,.78); backdrop-filter:blur(6px); }
.lang-loading-box{ position:relative; background:#fff; border-radius:24px; max-width:380px; width:100%; padding:28px 22px; text-align:center; box-shadow:0 20px 50px rgba(120,20,70,.35); animation: charityIn .4s cubic-bezier(0.4,0,0.2,1); }
.lang-loading-spinner{ width:54px; height:54px; border:5px solid #fde7f1; border-top-color:var(--eht-rose); border-radius:50%; margin:0 auto 14px; animation: langSpin 0.9s linear infinite; }
@keyframes langSpin{ to{ transform:rotate(360deg); } }
.lang-loading-text{ font-weight:900; color:var(--eht-rose); font-size:1.1rem; margin-bottom:14px; }
.lang-loading-progress{ height:6px; background:#fde7f1; border-radius:99px; overflow:hidden; }
.lang-loading-progress-bar{ height:100%; background:linear-gradient(90deg, var(--eht-rose), #ff7eb6); width:0%; animation: langProgress linear forwards; border-radius:99px; }
@keyframes langProgress{ from{ width:0%; } to{ width:100%; } }

/* Account bar press animation (charity-style ripple) */
.account-menu-bar{ transition: transform .25s cubic-bezier(0.4,0,0.2,1), box-shadow .25s ease, background .25s ease; }
.account-menu-bar.is-pressed{ transform: scale(0.96); background:#fff5fa; box-shadow: 0 8px 22px rgba(180,35,108,.18); }
.account-menu-bar:active{ transform: scale(0.97); }

/* Skeleton loading */
@keyframes skeletonShimmer { 0%{ background-position: -200% 0; } 100%{ background-position: 200% 0; } }
.skeleton{
  background: linear-gradient(90deg, #f5e7ee 0%, #fff5fa 50%, #f5e7ee 100%);
  background-size: 200% 100%;
  animation: skeletonShimmer 1.4s ease-in-out infinite;
  border-radius: 12px;
  display: block;
}
.skeleton-card{
  background:#fff; border-radius:18px; padding:12px; box-shadow:0 4px 14px rgba(180,35,108,.06);
  border:1px solid rgba(180,35,108,.06);
  display:flex; flex-direction:column; gap:10px;
  width:248px; min-width:248px; flex:0 0 248px;
}
.skeleton-img{ aspect-ratio:1/1; width:100%; border-radius:14px; }
.skeleton-line{ height:12px; border-radius:6px; }
.skeleton-line.w-80{ width:80%; }
.skeleton-line.w-50{ width:50%; }
.skeleton-line.w-30{ width:30%; }
.skeleton-btn{ height:36px; border-radius:12px; margin-top:4px; }
.skeleton-row{ display:flex; gap:12px; flex-wrap:nowrap; padding:0 4px; overflow:hidden; }
.skeleton-circle{ width:64px; height:64px; border-radius:18px; flex:0 0 64px; }
.skeleton-cat-card{ background:#fff; border-radius:18px; padding:14px; box-shadow:0 4px 14px rgba(180,35,108,.06); border:1px solid rgba(180,35,108,.06); display:flex; flex-direction:column; align-items:center; gap:10px; min-width:120px; }
.skeleton-banner{ width:100%; height:200px; border-radius:24px; }

/* Disable any leftover designer image fade */
.designer-modal-box,
.designer-avatar-wrap img,
.choice-option-avatar img{ animation:none !important; }

/* v2026-05-09e: founder line centered on mobile */
@media (max-width: 767px){
  .about-ceo-signature{
    text-align: center !important;
    display: block !important;
    width: 100% !important;
  }
}

/* Stacked picker (admin product editor) */
.picker-trigger{
  text-align:start !important;
  background:#fff;
  cursor:pointer;
  display:flex; align-items:center; justify-content:space-between;
}
.picker-trigger::after{
  content:"\f282";
  font-family:"bootstrap-icons";
  color:#9aa3b6;
  margin-inline-start:8px;
}
.picker-stack{ display:flex; flex-direction:column; gap:8px; }
.picker-item{
  display:flex; align-items:center; justify-content:space-between;
  width:100%; padding:14px 16px; border-radius:12px;
  background:#fff; border:1.5px solid #e3e7ef;
  font-weight:700; color:#2a3656; font-size:1rem;
  transition:all .15s ease;
}
.picker-item:hover{ border-color:var(--eht-rose,#b4236c); background:#fff5fa; }
.picker-item.is-active{ border-color:var(--eht-rose,#b4236c); background:#fdf0f7; color:var(--eht-rose,#b4236c); }
.picker-item i{ color:#9aa3b6; }

/* Admin SKU search */
.sku-search-input{
  font-size:1.1rem; padding:14px 16px; border-radius:14px;
  border:1.5px solid #d6dceb; background:#fff;
}
.sku-search-input:focus{ border-color:#1c5cff; box-shadow:0 0 0 .2rem rgba(28,92,255,.12); }
.sku-result-card{
  display:flex; gap:14px; padding:14px;
  background:#fff; border:1px solid #e3e7ef; border-radius:16px;
  align-items:center; height:100%;
}
.sku-result-grid .col{ display:flex; }
.sku-result-thumb{ width:96px; height:96px; object-fit:cover; border-radius:12px; flex:0 0 96px; background:#f4f6fb; }
.sku-result-name{ font-weight:800; color:#2a3656; font-size:1.05rem; }
.sku-result-sku{ font-family:monospace; color:#1c5cff; font-weight:800; font-size:1rem; }
.sku-result-meta{ color:#6c7793; font-size:.9rem; }


/* ============================================
   v2026-05-09c — admin polish, charity image fix, no animations on support modal
   ============================================ */

/* Bulletproof: no animations anywhere inside the support/choice/dev modal */
.global-status-overlay,
.global-status-overlay *,
.choice-option-btn,
.choice-option-btn *,
.choice-option-avatar,
.choice-option-avatar img,
.designer-modal-box,
.designer-modal-box *,
.designer-avatar-wrap,
.designer-avatar-wrap img{
  animation: none !important;
  transition: none !important;
  opacity: 1 !important;
  transform: none !important;
}

/* Admin product image preview */
.admin-image-preview-wrap{
  width:100%; min-height:220px; max-height:340px; border-radius:14px;
  background:#f4f6fb; border:2px dashed #d6dceb;
  display:flex; align-items:center; justify-content:center; overflow:hidden; padding:8px;
}
.admin-image-preview-wrap img{ max-width:100%; max-height:320px; object-fit:contain; border-radius:10px; background:#fff; }
.admin-image-preview-empty{ color:#9aa3b6; text-align:center; font-size:1.3rem; display:flex; flex-direction:column; align-items:center; }

/* Admin product row */
.admin-products-list{ display:flex; flex-direction:column; gap:10px; }
.admin-product-row{
  display:flex; align-items:center; gap:12px; padding:10px 12px;
  background:#fff; border:1px solid #e3e7ef; border-radius:14px;
}
.admin-product-thumb{ width:64px; height:64px; object-fit:cover; border-radius:12px; flex:0 0 64px; background:#f4f6fb; }
.admin-product-name{ font-weight:800; color:#2a3656; font-size:.98rem; }
.admin-product-meta{ font-size:.85rem; color:#6c7793; }


/* ====== v2026-05-09d — FINAL charity + admin pic fix ====== */

/* Admin pic: force visible, no transforms */
.admin-pic-frame img,
.admin-pic-frame-sm img,
.admin-shell-pic img {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

/* Charity modal: single authoritative definition (beats all above) */
div.charity-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1400 !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 16px !important;
}
div.charity-modal:not(.d-none) {
  display: flex !important;
}
div.charity-modal .charity-backdrop {
  position: absolute !important;
  inset: 0 !important;
  background: rgba(10,5,12,.82) !important;
  backdrop-filter: blur(5px) !important;
}
div.charity-modal .charity-modal-box {
  position: relative !important;
  width: min(520px, 92vw) !important;
  max-height: 90vh !important;
  padding: 10px !important;
  background: #fff !important;
  border-radius: 20px !important;
  box-shadow: 0 20px 60px rgba(0,0,0,.4) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  overflow: hidden !important;
  animation: none !important;
}
div.charity-modal .charity-image-wrap {
  width: 100% !important;
  flex: 1 1 auto !important;
  display: block !important;
  overflow: hidden !important;
  border-radius: 14px !important;
  background: #faf9f6 !important;
  aspect-ratio: auto !important;
  max-height: none !important;
  height: auto !important;
  min-height: 0 !important;
}
div.charity-modal .charity-image-wrap img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: 80vh !important;
  object-fit: contain !important;
  border-radius: 14px !important;
  opacity: 1 !important;
  visibility: visible !important;
}
div.charity-modal .charity-close {
  position: absolute !important;
  top: 8px !important;
  inset-inline-end: 8px !important;
  width: 34px !important;
  height: 34px !important;
  border-radius: 50% !important;
  border: none !important;
  background: rgba(0,0,0,.1) !important;
  color: #444 !important;
  cursor: pointer !important;
  z-index: 5 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}