/* Additional styles for TryCotton interactive UI */

/* Language Toggle */
.tc-lang-toggle {
  background: var(--tc-bg-alt);
  border: 1px solid var(--tc-border);
  border-radius: 20px;
  padding: 5px 12px;
  font-size: 12px;
  font-weight: 600;
  color: var(--tc-dark);
  cursor: pointer;
  transition: all var(--tc-ease) .2s;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.tc-lang-toggle:hover {
  background: var(--tc-dark);
  color: var(--tc-white);
}

/* Off-canvas Cart Drawer */
.tc-cart-drawer {
  position: fixed;
  inset: 0 0 0 auto;
  width: 100%;
  max-width: 420px;
  background: var(--tc-white);
  z-index: 9999;
  transform: translateX(100%);
  transition: transform var(--tc-ease) .35s;
  box-shadow: -10px 0 40px rgba(0,0,0,0.18);
  display: flex;
  flex-direction: column;
  pointer-events: auto;
}
[dir="rtl"] .tc-cart-drawer {
  inset: 0 auto 0 0;
  transform: translateX(-100%);
  box-shadow: 10px 0 40px rgba(0,0,0,0.18);
}
.tc-cart-drawer.is-open {
  transform: translateX(0) !important;
}

.tc-cart-drawer__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  border-bottom: 1px solid var(--tc-border);
}
.tc-cart-drawer__title {
  font-size: 18px;
  font-weight: 600;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}
.tc-cart-drawer__close {
  background: none;
  border: none;
  font-size: 24px;
  cursor: pointer;
  color: var(--tc-dark);
  padding: 4px;
}

.tc-cart-drawer__body {
  flex: 1;
  overflow-y: auto;
  padding: 20px 24px;
}
.tc-cart-empty {
  text-align: center;
  padding: 40px 20px;
  color: var(--tc-muted);
}
.tc-cart-empty svg {
  width: 50px;
  height: 50px;
  margin-bottom: 12px;
  opacity: 0.4;
}

.tc-cart-item {
  display: flex;
  gap: 16px;
  padding-bottom: 16px;
  margin-bottom: 16px;
  border-bottom: 1px solid var(--tc-border);
}
.tc-cart-item__img {
  width: 70px;
  height: 70px;
  border-radius: var(--tc-radius-sm);
  background: var(--tc-bg-soft);
  object-fit: cover;
}
.tc-cart-item__info {
  flex: 1;
}
.tc-cart-item__name {
  font-size: 14px;
  font-weight: 600;
  color: var(--tc-dark);
  margin-bottom: 4px;
}
.tc-cart-item__price {
  font-size: 13px;
  color: var(--tc-accent);
  font-weight: 600;
  margin-bottom: 8px;
}
.tc-cart-item__ctrls {
  display: flex;
  align-items: center;
  gap: 8px;
}
.tc-qty-btn {
  width: 26px;
  height: 26px;
  border-radius: 4px;
  border: 1px solid var(--tc-border);
  background: var(--tc-bg-soft);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
}
.tc-qty-num {
  font-size: 13px;
  min-width: 20px;
  text-align: center;
}
.tc-cart-item__del {
  margin-inline-start: auto;
  background: none;
  border: none;
  color: var(--tc-muted);
  cursor: pointer;
  padding: 4px;
}
.tc-cart-item__del:hover {
  color: var(--tc-red);
}

.tc-cart-drawer__footer {
  padding: 20px 24px;
  background: var(--tc-bg-soft);
  border-top: 1px solid var(--tc-border);
}
.tc-cart-subtotal {
  display: flex;
  justify-content: space-between;
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 16px;
}
.tc-cart-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.tc-cart-actions .tc-btn {
  width: 100%;
  justify-content: center;
  padding: 14px;
}

/* Toast Notification */
.tc-toast {
  position: fixed;
  bottom: 24px;
  right: 24px;
  background: var(--tc-dark);
  color: var(--tc-white);
  padding: 14px 22px;
  border-radius: var(--tc-radius-sm);
  display: flex;
  align-items: center;
  gap: 12px;
  box-shadow: var(--tc-shadow-md);
  z-index: 300;
  transform: translateY(120%);
  opacity: 0;
  transition: all var(--tc-ease) .35s;
  pointer-events: none;
}
[dir="rtl"] .tc-toast {
  right: auto;
  left: 24px;
}
.tc-toast.is-show {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
}
.tc-toast svg {
  width: 20px;
  height: 20px;
  color: #4ade80;
}

/* Wishlist Drawer */
.tc-wishlist-drawer {
  position: fixed;
  inset: 0 0 0 auto;
  width: 100%;
  max-width: 400px;
  background: var(--tc-white);
  z-index: 250;
  transform: translateX(100%);
  transition: transform var(--tc-ease) .35s;
  box-shadow: -10px 0 40px rgba(0,0,0,0.12);
  display: flex;
  flex-direction: column;
}
[dir="rtl"] .tc-wishlist-drawer {
  inset: 0 auto 0 0;
  transform: translateX(-100%);
}
.tc-wishlist-drawer.is-open {
  transform: translateX(0);
}

/* Inner Page Banners */
.tc-page-header {
  background: linear-gradient(120deg, #efe7d8 0%, #f7f2e8 100%);
  padding: 50px 0;
  text-align: center;
  border-bottom: 1px solid var(--tc-border);
}
.tc-page-header h1 {
  font-size: 36px;
  margin-bottom: 8px;
}
.tc-breadcrumbs {
  font-size: 13px;
  color: var(--tc-muted);
}
.tc-breadcrumbs a {
  color: var(--tc-text);
}
.tc-breadcrumbs a:hover {
  color: var(--tc-accent);
}

/* Shop Controls */
.tc-shop-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  padding: 24px 0;
  border-bottom: 1px solid var(--tc-border);
  margin-bottom: 30px;
}
.tc-filter-pills {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.tc-filter-pill {
  border: 1px solid var(--tc-border);
  background: var(--tc-white);
  padding: 8px 18px;
  border-radius: 20px;
  font-size: 13px;
  cursor: pointer;
  transition: all var(--tc-ease) .2s;
  font-weight: 500;
}
.tc-filter-pill.is-active,
.tc-filter-pill:hover {
  background: var(--tc-dark);
  color: var(--tc-white);
  border-color: var(--tc-dark);
}

/* Product Detail Page */
.tc-product-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 50px;
  padding-block: 50px;
}
@media (max-width: 850px) {
  .tc-product-layout {
    grid-template-columns: 1fr;
    gap: 30px;
  }
}
.tc-product-gallery__main {
  background: var(--tc-white);
  border-radius: var(--tc-radius-md);
  padding: 30px;
  border: 1px solid var(--tc-border);
  text-align: center;
  margin-bottom: 16px;
}
.tc-product-gallery__main img {
  margin: 0 auto;
  max-height: 450px;
  object-fit: contain;
}
.tc-size-selector {
  display: flex;
  gap: 10px;
  margin-block: 14px 24px;
}
.tc-size-btn {
  width: 44px;
  height: 44px;
  border: 1px solid var(--tc-border);
  background: var(--tc-white);
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--tc-ease) .2s;
}
.tc-size-btn.is-active,
.tc-size-btn:hover {
  border-color: var(--tc-dark);
  background: var(--tc-dark);
  color: #fff;
}

/* Forms (Checkout, Contact) */
.tc-form-group {
  margin-bottom: 18px;
}
.tc-form-group label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 6px;
  color: var(--tc-dark);
}
.tc-form-control {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid var(--tc-border);
  background: var(--tc-white);
  border-radius: var(--tc-radius-sm);
  font-family: inherit;
  font-size: 14px;
}
.tc-form-control:focus {
  outline: none;
  border-color: var(--tc-accent);
}

.tc-grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
@media (max-width: 600px) {
  .tc-grid-2 {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   WooCommerce Mini Cart in Drawer
   ========================================================================== */
.tc-cart-drawer .widget_shopping_cart_content,
.widget_shopping_cart_content {
  display: flex;
  flex-direction: column;
  min-height: 100%;
}
.tc-cart-drawer .woocommerce-mini-cart,
.widget_shopping_cart_content .woocommerce-mini-cart,
.widget_shopping_cart .woocommerce-mini-cart {
  list-style: none;
  padding: 0;
  margin: 0;
}
.tc-cart-drawer .woocommerce-mini-cart-item,
.widget_shopping_cart_content .woocommerce-mini-cart-item,
.widget_shopping_cart .woocommerce-mini-cart-item {
  display: flex;
  align-items: center;
  gap: 14px;
  padding-bottom: 14px;
  margin-bottom: 14px;
  border-bottom: 1px solid var(--tc-border);
  position: relative;
}
.tc-cart-drawer .woocommerce-mini-cart-item img,
.widget_shopping_cart_content .woocommerce-mini-cart-item img,
.widget_shopping_cart .woocommerce-mini-cart-item img {
  width: 60px;
  height: 60px;
  border-radius: var(--tc-radius-sm);
  object-fit: cover;
  flex-shrink: 0;
}
.tc-cart-drawer .woocommerce-mini-cart-item a:not(.remove),
.widget_shopping_cart_content .woocommerce-mini-cart-item a:not(.remove) {
  font-size: 14px;
  font-weight: 600;
  color: var(--tc-dark);
  text-decoration: none;
  line-height: 1.4;
  display: inline-block;
  margin-bottom: 4px;
}
.tc-cart-drawer .woocommerce-mini-cart-item .quantity,
.widget_shopping_cart_content .woocommerce-mini-cart-item .quantity {
  font-size: 13px;
  color: var(--tc-accent);
  font-weight: 600;
  display: block;
}
.tc-cart-drawer .woocommerce-mini-cart-item a.remove,
.widget_shopping_cart_content .woocommerce-mini-cart-item a.remove,
.widget_shopping_cart .woocommerce-mini-cart-item a.remove {
  color: var(--tc-red) !important;
  font-size: 24px !important;
  line-height: 1 !important;
  margin-inline-start: auto;
  text-decoration: none;
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: background var(--tc-ease) 0.2s;
  cursor: pointer;
  flex-shrink: 0;
}
.tc-cart-drawer .woocommerce-mini-cart-item a.remove:hover {
  background: rgba(200, 50, 50, 0.12);
}
.tc-cart-drawer .woocommerce-mini-cart__total,
.widget_shopping_cart_content .woocommerce-mini-cart__total,
.widget_shopping_cart .woocommerce-mini-cart__total {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  padding-top: 16px !important;
  border-top: 2px solid var(--tc-border) !important;
  margin-top: auto !important;
  margin-bottom: 16px !important;
  color: var(--tc-dark) !important;
}
.tc-cart-drawer .woocommerce-mini-cart__buttons,
.widget_shopping_cart_content .woocommerce-mini-cart__buttons,
.widget_shopping_cart .woocommerce-mini-cart__buttons {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  margin-top: 10px !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
}
.tc-cart-drawer .woocommerce-mini-cart__buttons a.button,
.widget_shopping_cart_content .woocommerce-mini-cart__buttons a.button,
.widget_shopping_cart .woocommerce-mini-cart__buttons a.button {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  text-align: center !important;
  padding: 14px 20px !important;
  border-radius: 4px !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  letter-spacing: 0.04em !important;
  cursor: pointer !important;
  text-decoration: none !important;
  transition: all var(--tc-ease) 0.2s !important;
  position: relative !important;
  z-index: 10 !important;
  pointer-events: auto !important;
}
.tc-cart-drawer .woocommerce-mini-cart__buttons a.button:not(.checkout),
.widget_shopping_cart_content .woocommerce-mini-cart__buttons a.button:not(.checkout),
.widget_shopping_cart .woocommerce-mini-cart__buttons a.button:not(.checkout) {
  background: var(--tc-bg-soft, #f8f6f2) !important;
  color: var(--tc-dark, #201c17) !important;
  border: 1.5px solid var(--tc-dark, #201c17) !important;
}
.tc-cart-drawer .woocommerce-mini-cart__buttons a.button:not(.checkout):hover,
.widget_shopping_cart_content .woocommerce-mini-cart__buttons a.button:not(.checkout):hover {
  background: var(--tc-dark, #201c17) !important;
  color: #fff !important;
}
.tc-cart-drawer .woocommerce-mini-cart__buttons a.button.checkout,
.widget_shopping_cart_content .woocommerce-mini-cart__buttons a.button.checkout,
.widget_shopping_cart .woocommerce-mini-cart__buttons a.button.checkout {
  background: var(--tc-red, #c83232) !important;
  color: #fff !important;
  border: 1.5px solid var(--tc-red, #c83232) !important;
}
.tc-cart-drawer .woocommerce-mini-cart__buttons a.button.checkout:hover,
.widget_shopping_cart_content .woocommerce-mini-cart__buttons a.button.checkout:hover {
  background: #a92525 !important;
  border-color: #a92525 !important;
  color: #fff !important;
}
.tc-cart-drawer .woocommerce-mini-cart__empty-message,
.widget_shopping_cart_content .woocommerce-mini-cart__empty-message {
  text-align: center;
  padding: 40px 20px;
  color: var(--tc-muted);
  font-size: 15px;
}

/* WooCommerce Single Product */
.woocommerce div.product {
  margin-bottom: 60px;
}
.woocommerce div.product .product_title {
  font-size: 32px;
  margin-bottom: 14px;
  font-family: var(--tc-font-heading);
}
.woocommerce div.product p.price {
  font-size: 24px;
  font-weight: 700;
  color: var(--tc-dark);
  margin-bottom: 24px;
}
.woocommerce div.product form.cart .button {
  background: var(--tc-dark);
  color: #fff;
  padding: 14px 32px;
  border-radius: 2px;
  font-weight: 600;
  border: 1px solid var(--tc-dark);
}
.woocommerce div.product form.cart .button:hover {
  background: transparent;
  color: var(--tc-dark);
}
.woocommerce div.product .woocommerce-tabs ul.tabs {
  border-bottom: 1px solid var(--tc-border);
  display: flex;
  gap: 20px;
  padding: 0;
  list-style: none;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  border-bottom: 2px solid var(--tc-dark);
  color: var(--tc-dark);
  font-weight: 600;
}
.woocommerce-message, .woocommerce-info {
  background: var(--tc-bg-soft);
  border-top-color: var(--tc-accent);
}

/* ==========================================================================
   TryCotton Cinematic Animation Engine
   ========================================================================== */

/* Keyframe Definitions */
@keyframes tcHeroFadeUp {
  0% {
    opacity: 0;
    transform: translateY(30px) scale(0.98);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes tcShimmerSweep {
  0% {
    left: -70%;
  }
  30%, 100% {
    left: 130%;
  }
}

@keyframes tcFloatBadge {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-7px);
  }
}

@keyframes tcPulseGlow {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(207, 42, 34, 0.35);
  }
  50% {
    box-shadow: 0 0 0 6px rgba(207, 42, 34, 0);
  }
}

@keyframes tcHeartPop {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.45) rotate(-6deg);
  }
  100% {
    transform: scale(1) rotate(0);
  }
}

@keyframes tcIconWobble {
  0%, 100% {
    transform: rotate(0);
  }
  25% {
    transform: rotate(-10deg) scale(1.12);
  }
  75% {
    transform: rotate(10deg) scale(1.12);
  }
}

@keyframes tcDrawerItemSlide {
  0% {
    opacity: 0;
    transform: translateX(-24px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

/* 1. Header Glassmorphism */
.tc-header {
  transition: background-color 0.35s var(--tc-ease), backdrop-filter 0.35s var(--tc-ease), box-shadow 0.35s var(--tc-ease), padding 0.35s var(--tc-ease);
}
.tc-header.is-scrolled {
  background: rgba(248, 244, 236, 0.88) !important;
  backdrop-filter: blur(14px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(14px) saturate(180%) !important;
  box-shadow: 0 4px 24px rgba(32, 28, 23, 0.08) !important;
  border-bottom-color: rgba(227, 217, 197, 0.6) !important;
}

/* 2. Hero Staggered Entrance & Shimmer */
.tc-hero__content {
  animation: tcHeroFadeUp 1s cubic-bezier(0.16, 1, 0.3, 1) both;
}
.tc-hero__tag {
  animation: tcHeroFadeUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.1s both;
}
.tc-hero__title {
  animation: tcHeroFadeUp 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.25s both;
}
.tc-hero__subtitle {
  animation: tcHeroFadeUp 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.4s both;
}
.tc-hero__actions {
  animation: tcHeroFadeUp 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.55s both;
}

/* Shimmer on primary CTA button */
.tc-hero .tc-btn--primary,
.tc-btn--shimmer {
  position: relative;
  overflow: hidden;
  box-shadow: 0 4px 18px rgba(32, 28, 23, 0.18);
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1), background 0.3s !important;
}
.tc-hero .tc-btn--primary::after,
.tc-btn--shimmer::after {
  content: '';
  position: absolute;
  top: -50%;
  left: -70%;
  width: 50%;
  height: 200%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.35), transparent);
  transform: rotate(25deg);
  animation: tcShimmerSweep 3.8s infinite ease-in-out;
  pointer-events: none;
}
.tc-hero .tc-btn--primary:hover,
.tc-btn--shimmer:hover {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 10px 28px rgba(32, 28, 23, 0.28);
}
.tc-hero .tc-btn--primary:active,
.tc-btn--shimmer:active {
  transform: translateY(-1px) scale(0.99);
}

/* 3. Scroll Reveal System */
.tc-reveal {
  opacity: 0;
  transform: translateY(32px);
  transition: opacity 0.85s cubic-bezier(0.16, 1, 0.3, 1), transform 0.85s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}
.tc-reveal.is-revealed {
  opacity: 1;
  transform: translateY(0);
}
.tc-delay-1 { transition-delay: 0.08s; }
.tc-delay-2 { transition-delay: 0.16s; }
.tc-delay-3 { transition-delay: 0.24s; }
.tc-delay-4 { transition-delay: 0.32s; }
.tc-delay-5 { transition-delay: 0.40s; }
.tc-delay-6 { transition-delay: 0.48s; }

/* 4. Category Showcase Hover Animations */
.tc-category {
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}
.tc-category:hover {
  transform: translateY(-6px);
}
.tc-category__media {
  position: relative;
  transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.45s;
}
.tc-category__media img {
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1), filter 0.3s;
}
.tc-category:hover .tc-category__media {
  box-shadow: 0 16px 36px rgba(32, 28, 23, 0.14);
}
.tc-category:hover .tc-category__media img {
  transform: scale(1.1) rotate(1deg);
}
.tc-category__number {
  transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), background 0.3s;
}
.tc-category:hover .tc-category__number {
  transform: scale(1.18);
  background: var(--tc-dark);
  color: #fff;
}
.tc-category__link {
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), background 0.3s, color 0.3s;
}
.tc-category:hover .tc-category__link {
  background: var(--tc-red);
  color: #fff;
  transform: scale(1.1);
}
[dir="rtl"] .tc-category:hover .tc-category__link svg {
  transform: translateX(-4px);
}
[dir="ltr"] .tc-category:hover .tc-category__link svg {
  transform: translateX(4px);
}

/* 5. Features Strip Interactive Delight */
.tc-feature {
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), background 0.3s;
  border-radius: var(--tc-radius-sm);
  padding: 8px 12px;
}
.tc-feature:hover {
  transform: translateY(-3px);
  background: rgba(255, 255, 255, 0.4);
}
.tc-feature:hover .tc-feature__icon svg {
  animation: tcIconWobble 0.6s ease-in-out;
  color: var(--tc-red);
}

/* 6. Product Card 3D Lift & Interactive Elements */
.tc-product-card {
  position: relative;
  transition: transform 0.38s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.38s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.3s;
  border: 1px solid transparent;
  border-radius: var(--tc-radius-sm);
}
.tc-product-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 18px 40px rgba(32, 28, 23, 0.12);
  border-color: var(--tc-border);
  background: #fff;
}
.tc-product-card__media {
  overflow: hidden;
  border-radius: var(--tc-radius-sm);
}
.tc-product-card__media img {
  transition: transform 0.65s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: transform;
}
.tc-product-card:hover .tc-product-card__media img {
  transform: scale(1.09);
}

/* Heart button interactive pop */
.tc-product-card__wishlist {
  transition: transform 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275), background 0.2s, color 0.2s;
}
.tc-product-card__wishlist:hover {
  transform: scale(1.18);
  background: #fff;
  box-shadow: 0 4px 12px rgba(0,0,0,0.12);
}
.tc-product-card__wishlist.is-active svg {
  animation: tcHeartPop 0.45s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  fill: var(--tc-red);
  color: var(--tc-red);
}

/* Minimum Quantity Badges with Glow */
.tc-loop-min-qty,
.tc-min-qty-badge {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  background: rgba(207, 42, 34, 0.08);
  border: 1px solid rgba(207, 42, 34, 0.25);
  border-radius: 20px;
  animation: tcPulseGlow 2.8s infinite;
  font-size: 11px !important;
  font-weight: 700 !important;
  color: var(--tc-red) !important;
}

/* Add to cart button smooth bounce */
.tc-add-to-cart {
  transition: background 0.25s, transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s;
}
.tc-product-card:hover .tc-add-to-cart {
  background: var(--tc-dark);
  color: #fff;
  box-shadow: 0 4px 14px rgba(32, 28, 23, 0.2);
}
.tc-add-to-cart:hover {
  background: var(--tc-red) !important;
  color: #fff !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(207, 42, 34, 0.3) !important;
}
.tc-add-to-cart:active {
  transform: translateY(0) scale(0.97);
}

/* 7. Cart Drawer Staggered Item Slide-in */
.tc-cart-drawer.is-open .woocommerce-mini-cart-item {
  animation: tcDrawerItemSlide 0.45s cubic-bezier(0.16, 1, 0.3, 1) both;
}
.tc-cart-drawer.is-open .woocommerce-mini-cart-item:nth-child(1) { animation-delay: 0.08s; }
.tc-cart-drawer.is-open .woocommerce-mini-cart-item:nth-child(2) { animation-delay: 0.14s; }
.tc-cart-drawer.is-open .woocommerce-mini-cart-item:nth-child(3) { animation-delay: 0.20s; }
.tc-cart-drawer.is-open .woocommerce-mini-cart-item:nth-child(4) { animation-delay: 0.26s; }
.tc-cart-drawer.is-open .woocommerce-mini-cart-item:nth-child(5) { animation-delay: 0.32s; }
.tc-cart-drawer.is-open .woocommerce-mini-cart-item:nth-child(6) { animation-delay: 0.38s; }

/* 8. Back-to-Top Floating Button */
.tc-back-to-top {
  position: fixed;
  bottom: 24px;
  left: 24px;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: var(--tc-dark);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 990;
  opacity: 0;
  visibility: hidden;
  transform: translateY(20px) scale(0.85);
  transition: opacity 0.35s cubic-bezier(0.16, 1, 0.3, 1), transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.35s, background 0.2s;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.22);
  border: none;
  cursor: pointer;
}
[dir="ltr"] .tc-back-to-top {
  left: auto;
  right: 24px;
}
.tc-back-to-top.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}
.tc-back-to-top:hover {
  background: var(--tc-red);
  transform: translateY(-4px) scale(1.1);
  box-shadow: 0 10px 26px rgba(207, 42, 34, 0.38);
}
.tc-back-to-top svg {
  width: 20px;
  height: 20px;
  stroke-width: 2.4;
  transition: transform 0.25s ease;
}
.tc-back-to-top:hover svg {
  transform: translateY(-2px);
}

/* ==========================================================================
   9. Symmetrical 6-Column Category Grid
   ========================================================================== */
.tc-categories__grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr) !important;
  gap: 24px;
}
@media (max-width: 1080px) {
  .tc-categories__grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 20px;
  }
}
@media (max-width: 580px) {
  .tc-categories__grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px;
  }
}

/* Category card visual touch */
.tc-category {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
}
.tc-category__media {
  border: 3px solid #fff;
  box-shadow: 0 6px 18px rgba(32, 28, 23, 0.07);
}
.tc-category__title,
.tc-category__title-ar {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--tc-dark) !important;
  margin-top: 6px;
  margin-bottom: 12px !important;
  text-align: center !important;
  display: block !important;
  width: 100% !important;
  line-height: 1.4 !important;
}
.tc-category__link {
  margin-inline: auto !important;
  margin-top: auto !important;
}

/* ==========================================================================
   10. Best Sellers 'View All' CTA
   ========================================================================== */
.tc-best-sellers__more {
  text-align: center;
  margin-top: 48px;
}
.tc-btn--more {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 16px 40px;
  background: var(--tc-dark);
  color: #fff;
  border-radius: 4px;
  font-weight: 700;
  font-size: 16px;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  box-shadow: 0 6px 20px rgba(32, 28, 23, 0.16);
  text-decoration: none;
  border: none;
  cursor: pointer;
}
.tc-btn--more:hover {
  background: var(--tc-red);
  color: #fff;
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 10px 28px rgba(207, 42, 34, 0.35);
}
[dir="rtl"] .tc-btn--more svg {
  transform: scaleX(-1);
  transition: transform 0.25s ease;
}
[dir="rtl"] .tc-btn--more:hover svg {
  transform: scaleX(-1) translateX(4px);
}
[dir="ltr"] .tc-btn--more:hover svg {
  transform: translateX(4px);
}

/* ==========================================================================
   11. High-Impact Promo Banner ("عروض التوفير الكبرى")
   ========================================================================== */
.tc-promo-banner {
  padding-block: 50px;
  position: relative;
}
.tc-promo-banner__card {
  background: linear-gradient(135deg, #1c1815 0%, #29221b 50%, #1f1b17 100%);
  border-radius: 12px;
  padding: 56px 48px;
  color: #fff;
  position: relative;
  overflow: hidden;
  box-shadow: 0 20px 50px rgba(28, 24, 21, 0.35);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
}
.tc-promo-banner__card::before {
  content: '';
  position: absolute;
  top: -80px;
  right: -80px;
  width: 320px;
  height: 320px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(207, 42, 34, 0.25) 0%, transparent 70%);
  pointer-events: none;
}
.tc-promo-banner__card::after {
  content: '';
  position: absolute;
  bottom: -60px;
  left: -60px;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(200, 168, 107, 0.15) 0%, transparent 70%);
  pointer-events: none;
}
.tc-promo-banner__content {
  position: relative;
  z-index: 2;
  max-width: 680px;
}
.tc-promo-banner__badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(207, 42, 34, 0.2);
  border: 1px solid rgba(207, 42, 34, 0.5);
  color: #ff766e;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 20px;
  letter-spacing: 0.03em;
}
.tc-promo-banner__badge-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #ff4d42;
  animation: tcPulseGlow 1.8s infinite;
}
.tc-promo-banner__title {
  font-size: 34px;
  line-height: 1.35;
  margin: 0 0 16px;
  font-family: var(--tc-font-heading);
  color: #fff;
}
.tc-promo-banner__title span {
  color: #e5b967;
}
.tc-promo-banner__desc {
  font-size: 16px;
  line-height: 1.7;
  color: #c9c1b4;
  margin: 0 0 24px;
}
.tc-promo-banner__features {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  margin-bottom: 30px;
}
.tc-promo-banner__feature {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: #eae1cf;
}
.tc-promo-banner__feature svg {
  width: 18px;
  height: 18px;
  color: #4ade80;
  flex-shrink: 0;
}
.tc-promo-banner__action {
  position: relative;
  z-index: 2;
  flex-shrink: 0;
}
.tc-promo-banner__btn {
  padding: 16px 36px;
  background: #c83232;
  color: #fff;
  border-radius: 4px;
  font-weight: 700;
  font-size: 16px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  box-shadow: 0 8px 24px rgba(200, 50, 50, 0.45);
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.tc-promo-banner__btn:hover {
  background: #df3b3b;
  transform: translateY(-3px) scale(1.03);
  box-shadow: 0 12px 30px rgba(200, 50, 50, 0.6);
  color: #fff;
}
@media (max-width: 860px) {
  .tc-promo-banner__card {
    flex-direction: column;
    align-items: flex-start;
    padding: 36px 24px;
  }
  .tc-promo-banner__title {
    font-size: 26px;
  }
  .tc-promo-banner__action {
    width: 100%;
  }
  .tc-promo-banner__btn {
    width: 100%;
    justify-content: center;
  }
}

/* ==========================================================================
   12. Why TryCotton ("لماذا تراي قطن؟")
   ========================================================================== */
.tc-why-us {
  padding-block: 60px 40px;
  background: transparent;
}
.tc-why-us__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin-top: 40px;
}
@media (max-width: 980px) {
  .tc-why-us__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 580px) {
  .tc-why-us__grid {
    grid-template-columns: 1fr;
  }
}
.tc-why-card {
  background: #fff;
  border: 1px solid var(--tc-border);
  border-radius: 8px;
  padding: 32px 24px;
  text-align: center;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s, border-color 0.35s;
  position: relative;
  overflow: hidden;
}
.tc-why-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--tc-accent);
  opacity: 0;
  transition: opacity 0.3s;
}
.tc-why-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 36px rgba(32, 28, 23, 0.09);
  border-color: rgba(200, 168, 107, 0.4);
}
.tc-why-card:hover::before {
  opacity: 1;
}
.tc-why-card__icon-wrap {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: var(--tc-bg-soft);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
  color: var(--tc-accent);
  transition: all 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.tc-why-card:hover .tc-why-card__icon-wrap {
  transform: scale(1.12) rotate(6deg);
  background: var(--tc-dark);
  color: #fff;
}
.tc-why-card__icon-wrap svg {
  width: 30px;
  height: 30px;
}
.tc-why-card__title {
  font-size: 18px;
  font-weight: 700;
  color: var(--tc-dark);
  margin: 0 0 12px;
}
.tc-why-card__text {
  font-size: 14px;
  line-height: 1.65;
  color: var(--tc-muted);
  margin: 0;
}

/* ==========================================================================
   13. Customer Testimonials ("آراء عملاء تراي قطن")
   ========================================================================== */
.tc-reviews {
  padding-block: 60px;
}
.tc-reviews__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  margin-top: 40px;
}
@media (max-width: 900px) {
  .tc-reviews__grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}
.tc-review-card {
  background: #fff;
  border: 1px solid var(--tc-border);
  border-radius: 10px;
  padding: 32px 28px;
  display: flex;
  flex-direction: column;
  box-shadow: 0 4px 16px rgba(32, 28, 23, 0.04);
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s;
}
.tc-review-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 16px 36px rgba(32, 28, 23, 0.08);
}
.tc-review-card__stars {
  display: flex;
  gap: 4px;
  color: #f59e0b;
  margin-bottom: 16px;
}
.tc-review-card__stars svg {
  width: 18px;
  height: 18px;
  fill: #f59e0b;
}
.tc-review-card__quote {
  font-size: 15px;
  line-height: 1.7;
  color: var(--tc-dark);
  margin: 0 0 24px;
  flex: 1;
}
.tc-review-card__author {
  display: flex;
  align-items: center;
  gap: 14px;
  border-top: 1px solid var(--tc-border);
  padding-top: 18px;
}
.tc-review-card__avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--tc-bg-soft);
  color: var(--tc-dark);
  font-weight: 700;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--tc-border);
}
.tc-review-card__meta {
  display: flex;
  flex-direction: column;
}
.tc-review-card__name {
  font-size: 15px;
  font-weight: 700;
  color: var(--tc-dark);
}
.tc-review-card__location {
  font-size: 12px;
  color: var(--tc-muted);
  display: flex;
  align-items: center;
  gap: 6px;
}
.tc-review-card__verified {
  color: #16a34a;
  font-weight: 600;
}

/* ==========================================================================
   14. VIP Club / Newsletter Strip ("نادي تراي قطن")
   ========================================================================== */
.tc-newsletter {
  padding-block: 50px 70px;
}
.tc-newsletter__card {
  background: var(--tc-bg-soft);
  border: 2px dashed var(--tc-border);
  border-radius: 12px;
  padding: 48px 40px;
  text-align: center;
  max-width: 860px;
  margin: 0 auto;
}
.tc-newsletter__title {
  font-size: 28px;
  font-weight: 700;
  color: var(--tc-dark);
  margin: 0 0 10px;
}
.tc-newsletter__desc {
  font-size: 15px;
  color: var(--tc-muted);
  max-width: 540px;
  margin: 0 auto 28px;
  line-height: 1.65;
}
.tc-newsletter__form {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  max-width: 520px;
  margin: 0 auto;
}
@media (max-width: 600px) {
  .tc-newsletter__form {
    flex-direction: column;
  }
}
.tc-newsletter__input {
  flex: 1;
  padding: 14px 20px;
  border: 1px solid var(--tc-border);
  border-radius: 4px;
  font-size: 14px;
  background: #fff;
  width: 100%;
}
.tc-newsletter__input:focus {
  outline: none;
  border-color: var(--tc-dark);
}
.tc-newsletter__submit {
  padding: 14px 28px;
  background: var(--tc-dark);
  color: #fff;
  border: none;
  border-radius: 4px;
  font-weight: 700;
  font-size: 14px;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.25s, transform 0.2s;
}
.tc-newsletter__submit:hover {
  background: var(--tc-red);
  transform: translateY(-2px);
}

/* ==========================================================================
   15. Comprehensive Responsive Optimization Suite
   ========================================================================== */

/* Universal Overflow & Container Guards */
html, body {
  overflow-x: hidden !important;
  max-width: 100vw !important;
}
.tc-container {
  box-sizing: border-box !important;
}

/* Baseline alignment for Category Cards */
.tc-category {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  height: 100% !important;
}
.tc-category__title-ar {
  min-height: 44px;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  margin-bottom: 8px !important;
}
.tc-category__link {
  margin-top: auto !important;
}

/* ==================== TABLET (601px - 1024px) ==================== */
@media (min-width: 601px) and (max-width: 1024px) {
  .tc-categories__grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 20px !important;
  }
  .tc-category__media {
    max-width: 160px !important;
  }
  .tc-products {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 18px !important;
  }
  .tc-why-us__grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 18px !important;
  }
  .tc-promo-banner__card {
    padding: 40px 32px !important;
  }
  .tc-promo-banner__title {
    font-size: 28px !important;
  }
}

/* ==================== MOBILE (<= 600px) ==================== */
@media (max-width: 600px) {
  /* 1. Header */
  .tc-header__inner {
    padding-block: 10px !important;
  }
  .tc-header__side--right {
    gap: 8px !important;
  }
  .tc-icon-btn {
    width: 36px !important;
    height: 36px !important;
  }
  .tc-logo img {
    max-height: 32px !important;
    width: auto !important;
  }

  /* 2. Hero */
  .tc-hero {
    padding-block: 30px 45px !important;
  }
  .tc-hero__badge {
    width: 76px !important;
    height: 76px !important;
    margin-bottom: 14px !important;
  }
  .tc-hero__title {
    font-size: clamp(1.6rem, 7vw, 2.2rem) !important;
    line-height: 1.25 !important;
    margin-bottom: 12px !important;
  }
  .tc-hero__subtitle {
    font-size: 13.5px !important;
    line-height: 1.6 !important;
    margin-bottom: 20px !important;
  }
  .tc-hero .tc-btn,
  .tc-hero .tc-btn--shimmer {
    padding: 12px 26px !important;
    font-size: 14px !important;
  }
  .tc-hero__torn {
    height: 28px !important;
  }

  /* 3. Categories (Symmetrical 2x3 Grid) */
  .tc-categories {
    padding-block: 36px 20px !important;
  }
  .tc-categories__grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px 14px !important;
  }
  .tc-category__media {
    max-width: 125px !important;
    margin-bottom: 12px !important;
  }
  .tc-category__number {
    width: 26px !important;
    height: 26px !important;
    font-size: 10.5px !important;
  }
  .tc-category__title,
  .tc-category__title-ar {
    font-size: 13.5px !important;
    min-height: 38px !important;
    line-height: 1.35 !important;
    margin-bottom: 6px !important;
  }
  .tc-category__link {
    width: 30px !important;
    height: 30px !important;
  }
  .tc-category__link svg {
    width: 12px !important;
    height: 12px !important;
  }

  /* 4. Features Strip (Modern 2x2 Grid) */
  .tc-features {
    margin-block: 24px 40px !important;
  }
  .tc-features__inner {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
    padding: 16px 12px !important;
    border-radius: var(--tc-radius-md) !important;
  }
  .tc-feature {
    flex-direction: column !important;
    text-align: center !important;
    padding: 8px 4px !important;
    gap: 8px !important;
    border: none !important;
  }
  .tc-feature__icon {
    width: 28px !important;
    height: 28px !important;
  }
  .tc-feature__label {
    font-size: 12px !important;
  }
  .tc-feature__label-ar {
    font-size: 11.5px !important;
  }

  /* 5. Best Sellers Grid (Clean 2-Column e-Commerce Grid) */
  .tc-best-sellers {
    padding-block: 20px 50px !important;
  }
  .tc-section-heading {
    margin-bottom: 28px !important;
  }
  .tc-section-heading__title {
    font-size: 22px !important;
  }
  .tc-section-heading__tagline {
    font-size: 13px !important;
  }
  .tc-products {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
  }
  .tc-product-card {
    padding: 10px !important;
    display: flex !important;
    flex-direction: column !important;
  }
  .tc-product-card__wishlist {
    width: 28px !important;
    height: 28px !important;
    top: 8px !important;
  }
  [dir="rtl"] .tc-product-card__wishlist {
    left: 8px !important;
    right: auto !important;
  }
  [dir="ltr"] .tc-product-card__wishlist {
    right: 8px !important;
    left: auto !important;
  }
  .tc-product-card__wishlist svg {
    width: 14px !important;
    height: 14px !important;
  }
  .tc-product-card__title {
    font-size: 13px !important;
    line-height: 1.35 !important;
    min-height: 35px !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    margin-bottom: 6px !important;
  }
  .tc-product-card__price {
    font-size: 13.5px !important;
    margin-bottom: 6px !important;
  }
  .tc-loop-min-qty {
    font-size: 10px !important;
    padding: 2px 6px !important;
    margin-bottom: 8px !important;
  }
  .tc-add-to-cart {
    padding: 9px 6px !important;
    font-size: 11px !important;
    gap: 4px !important;
    margin-top: auto !important;
    white-space: nowrap !important;
  }
  .tc-add-to-cart svg {
    width: 14px !important;
    height: 14px !important;
  }
  .tc-best-sellers__more {
    margin-top: 32px !important;
  }
  .tc-btn--more {
    padding: 12px 28px !important;
    font-size: 14px !important;
    width: 100% !important;
    max-width: 280px !important;
    justify-content: center !important;
  }

  /* 6. Promo Banner */
  .tc-promo-banner {
    padding-block: 24px 36px !important;
  }
  .tc-promo-banner__card {
    padding: 28px 18px !important;
    border-radius: 10px !important;
    gap: 20px !important;
  }
  .tc-promo-banner__badge {
    font-size: 11.5px !important;
    padding: 4px 10px !important;
    margin-bottom: 14px !important;
  }
  .tc-promo-banner__title {
    font-size: 20px !important;
    line-height: 1.4 !important;
    margin-bottom: 12px !important;
  }
  .tc-promo-banner__desc {
    font-size: 13px !important;
    line-height: 1.6 !important;
    margin-bottom: 18px !important;
  }
  .tc-promo-banner__features {
    gap: 10px !important;
    margin-bottom: 22px !important;
  }
  .tc-promo-banner__feature {
    font-size: 12.5px !important;
  }
  .tc-promo-banner__btn {
    width: 100% !important;
    justify-content: center !important;
    padding: 13px 20px !important;
    font-size: 14px !important;
  }

  /* 7. Why Choose Us (Compact 2x2 Grid) */
  .tc-why-us {
    padding-block: 30px 20px !important;
  }
  .tc-why-us__grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
    margin-top: 24px !important;
  }
  .tc-why-card {
    padding: 18px 12px !important;
  }
  .tc-why-card__icon-wrap {
    width: 44px !important;
    height: 44px !important;
    margin-bottom: 10px !important;
  }
  .tc-why-card__icon-wrap svg {
    width: 22px !important;
    height: 22px !important;
  }
  .tc-why-card__title {
    font-size: 13.5px !important;
    margin-bottom: 6px !important;
  }
  .tc-why-card__text {
    font-size: 11.5px !important;
    line-height: 1.5 !important;
  }

  /* 8. Customer Reviews */
  .tc-reviews {
    padding-block: 30px 20px !important;
  }
  .tc-reviews__grid {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    margin-top: 24px !important;
  }
  .tc-review-card {
    padding: 20px 16px !important;
  }
  .tc-review-card__quote {
    font-size: 13.5px !important;
    margin-bottom: 16px !important;
  }

  /* 9. VIP Club Newsletter */
  .tc-newsletter {
    padding-block: 24px 44px !important;
  }
  .tc-newsletter__card {
    padding: 28px 16px !important;
  }
  .tc-newsletter__title {
    font-size: 20px !important;
  }
  .tc-newsletter__desc {
    font-size: 13px !important;
    margin-bottom: 18px !important;
  }
  .tc-newsletter__form {
    flex-direction: column !important;
    gap: 10px !important;
  }
  .tc-newsletter__input {
    width: 100% !important;
    box-sizing: border-box !important;
  }
  .tc-newsletter__submit {
    width: 100% !important;
  }

  /* 10. Footer */
  .tc-footer {
    padding-block: 40px 20px !important;
  }
  .tc-footer__grid {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }
  .tc-footer__bottom {
    flex-direction: column !important;
    gap: 10px !important;
    text-align: center !important;
  }
}

/* ==========================================================================
   1. HERO BANNER CAROUSEL
   ========================================================================== */
.tc-hero--carousel {
  position: relative;
  overflow: hidden;
  min-height: 640px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.tc-hero__slides {
  position: relative;
  width: 100%;
  min-height: 640px;
}

.tc-hero__slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.75s cubic-bezier(0.4, 0, 0.2, 1), transform 0.75s cubic-bezier(0.4, 0, 0.2, 1);
  transform: scale(1.03);
  display: flex;
  align-items: center;
  z-index: 1;
}

.tc-hero__slide.is-active {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
  z-index: 2;
}

.tc-hero__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.25);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.4);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10;
  transition: all 0.25s ease;
}

.tc-hero__arrow svg {
  width: 24px;
  height: 24px;
}

.tc-hero__arrow:hover {
  background: rgba(255, 255, 255, 0.9);
  color: #201c17;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
}

.tc-hero__arrow--prev {
  right: 28px;
}

.tc-hero__arrow--next {
  left: 28px;
}

[dir="rtl"] .tc-hero__arrow--prev {
  right: 28px;
  left: auto;
}

[dir="rtl"] .tc-hero__arrow--next {
  left: 28px;
  right: auto;
}

.tc-hero__dots {
  position: absolute;
  bottom: 50px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 10px;
  z-index: 10;
}

.tc-hero__dot {
  width: 12px;
  height: 12px;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.45);
  border: none;
  padding: 0;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.tc-hero__dot.is-active {
  width: 34px;
  background: #fff;
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.6);
}

@media (max-width: 768px) {
  .tc-hero--carousel,
  .tc-hero__slides {
    min-height: 520px;
  }
  .tc-hero__arrow {
    display: none;
  }
  .tc-hero__dots {
    bottom: 38px;
  }
}

/* ==========================================================================
   2. VISUAL SIZE SWATCHES
   ========================================================================== */
.tc-size-swatches {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-block: 8px 16px;
}

.tc-swatch-btn {
  min-width: 44px;
  height: 40px;
  padding: 0 14px;
  border-radius: 8px;
  border: 1.5px solid var(--tc-border, #e5e0d8);
  background: var(--tc-white, #fff);
  font-size: 13.5px;
  font-weight: 700;
  color: var(--tc-dark, #201c17);
  cursor: pointer;
  transition: all 0.2s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  user-select: none;
}

.tc-swatch-btn:hover {
  border-color: var(--tc-accent, #c83232);
  color: var(--tc-accent, #c83232);
  background: #fdfaf6;
}

.tc-swatch-btn.is-selected {
  border-color: var(--tc-accent, #c83232);
  background: var(--tc-accent, #c83232);
  color: #fff;
  box-shadow: 0 4px 12px rgba(200, 50, 50, 0.3);
}

.tc-swatch-btn.is-disabled {
  opacity: 0.35;
  text-decoration: line-through;
  cursor: not-allowed;
}

.is-shaking {
  animation: tcShake 0.4s ease-in-out;
}

@keyframes tcShake {
  0%, 100% { transform: translateX(0); }
  20%, 60% { transform: translateX(-8px); }
  40%, 80% { transform: translateX(8px); }
}

/* ==========================================================================
   3. INTERACTIVE SIZE GUIDE TRIGGER & MODAL
   ========================================================================== */
.tc-size-guide-trigger-wrap {
  margin-block: 10px 14px;
}

.tc-size-guide-trigger {
  background: none;
  border: none;
  padding: 0;
  color: var(--tc-accent, #c83232);
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color 0.2s ease;
}

.tc-size-guide-trigger:hover {
  color: #9c1f1f;
}

.tc-modal {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

.tc-modal.is-open {
  opacity: 1;
  visibility: visible;
}

.tc-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(18, 15, 12, 0.72);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.tc-modal__dialog {
  position: relative;
  width: 100%;
  max-width: 660px;
  max-height: 90vh;
  overflow-y: auto;
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.25);
  z-index: 2;
  padding: 28px;
  transform: translateY(20px) scale(0.98);
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.tc-modal.is-open .tc-modal__dialog {
  transform: translateY(0) scale(1);
}

.tc-modal__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  padding-bottom: 14px;
  border-bottom: 1px solid #f0ebe1;
}

.tc-modal__title-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
}

.tc-modal__icon {
  font-size: 22px;
}

.tc-modal__title {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  color: var(--tc-dark, #201c17);
}

.tc-modal__close {
  background: none;
  border: none;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  color: #999;
  transition: color 0.2s;
  padding: 0 6px;
}

.tc-modal__close:hover {
  color: #111;
}

.tc-size-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 20px;
}

.tc-size-tab {
  flex: 1;
  padding: 10px 14px;
  border-radius: 8px;
  border: 1px solid #ded6c9;
  background: #fbf9f5;
  font-size: 13.5px;
  font-weight: 600;
  color: #4a453e;
  cursor: pointer;
  transition: all 0.2s ease;
}

.tc-size-tab.is-active {
  background: var(--tc-dark, #201c17);
  color: #fff;
  border-color: var(--tc-dark, #201c17);
}

.tc-table-responsive {
  width: 100%;
  overflow-x: auto;
  border: 1px solid #efeae0;
  border-radius: 10px;
}

.tc-size-table {
  width: 100%;
  border-collapse: collapse;
  text-align: center;
  font-size: 13px;
}

.tc-size-table th {
  background: #f5f0e6;
  padding: 11px 14px;
  font-weight: 700;
  color: #201c17;
  border-bottom: 1px solid #e5decb;
}

.tc-size-table td {
  padding: 10px 14px;
  border-bottom: 1px solid #efeae0;
  color: #4a453e;
}

.tc-size-table tbody tr:last-child td {
  border-bottom: none;
}

.tc-size-table tbody tr:nth-child(even) {
  background: #faf7f2;
}

.tc-size-tips {
  margin-top: 22px;
  padding: 16px 20px;
  background: #fbf9f5;
  border: 1px solid #efeae0;
  border-radius: 12px;
}

.tc-size-tips h4 {
  margin: 0 0 10px;
  font-size: 14.5px;
  font-weight: 700;
  color: var(--tc-dark, #201c17);
}

.tc-size-tips ul {
  margin: 0;
  padding-inline-start: 20px;
  line-height: 1.7;
  font-size: 12.5px;
  color: #5a544b;
}

/* ==========================================================================
   4. QUICK BUY NOW (⚡ شراء الآن) BUTTON
   ========================================================================== */
.tc-btn--buy-now {
  background: linear-gradient(135deg, #e67e22 0%, #d35400 100%);
  color: #fff !important;
  border: none;
  font-size: 15px;
  font-weight: 700;
  padding: 14px 24px;
  border-radius: 8px;
  box-shadow: 0 4px 14px rgba(211, 84, 0, 0.3);
  cursor: pointer;
  transition: all 0.25s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  margin-top: 10px;
}

.tc-btn--buy-now:hover {
  background: linear-gradient(135deg, #d35400 0%, #b84300 100%);
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(211, 84, 0, 0.4);
}

.tc-spinner {
  display: inline-block;
  width: 16px;
  height: 16px;
  border: 2px solid rgba(255, 255, 255, 0.3);
  border-top-color: #fff;
  border-radius: 50%;
  animation: tcSpin 0.7s linear infinite;
  margin-inline-end: 6px;
}

@keyframes tcSpin {
  to { transform: rotate(360deg); }
}

/* ==========================================================================
   5. FLOATING WHATSAPP BUTTON
   ========================================================================== */
.tc-floating-whatsapp {
  position: fixed;
  bottom: 26px;
  left: 26px;
  right: auto;
  z-index: 9998;
}

[dir="ltr"] .tc-floating-whatsapp {
  left: auto;
  right: 26px;
}

.tc-whatsapp-btn {
  position: relative;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: #25D366;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 20px rgba(37, 211, 102, 0.45);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  text-decoration: none;
}

.tc-whatsapp-btn:hover {
  transform: scale(1.08) translateY(-2px);
  box-shadow: 0 10px 26px rgba(37, 211, 102, 0.6);
  color: #fff;
}

.tc-whatsapp-pulse {
  position: absolute;
  inset: -6px;
  border-radius: 50%;
  background: #25D366;
  opacity: 0.4;
  animation: tcWhatsappPulse 2s infinite;
  z-index: -1;
}

@keyframes tcWhatsappPulse {
  0% {
    transform: scale(0.95);
    opacity: 0.6;
  }
  70% {
    transform: scale(1.35);
    opacity: 0;
  }
  100% {
    transform: scale(1.35);
    opacity: 0;
  }
}

.tc-whatsapp-tooltip {
  position: absolute;
  bottom: 12px;
  right: 68px;
  background: #201c17;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  padding: 6px 12px;
  border-radius: 6px;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transform: translateX(10px);
  transition: all 0.25s ease;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

[dir="rtl"] .tc-whatsapp-tooltip {
  right: auto;
  left: 68px;
  transform: translateX(-10px);
}

.tc-whatsapp-btn:hover .tc-whatsapp-tooltip {
  opacity: 1;
  transform: translateX(0);
}

/* ==========================================================================
   6. LIVE INSTANT SEARCH DROPDOWN
   ========================================================================== */
.tc-live-search-results {
  margin-top: 14px;
  background: #fff;
  border: 1px solid var(--tc-border, #e5e0d8);
  border-radius: 12px;
  box-shadow: 0 14px 38px rgba(0, 0, 0, 0.12);
  max-height: 400px;
  overflow-y: auto;
  z-index: 1000;
  text-align: start;
}

.tc-search-loading,
.tc-search-no-results {
  padding: 24px;
  text-align: center;
  font-size: 14px;
  color: #666;
}

.tc-search-loading .tc-spinner {
  border-color: rgba(200, 50, 50, 0.25);
  border-top-color: var(--tc-accent, #c83232);
}

.tc-search-items {
  display: flex;
  flex-direction: column;
}

.tc-search-item {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 18px;
  border-bottom: 1px solid #f4f0e8;
  text-decoration: none;
  color: inherit;
  transition: background 0.15s ease;
}

.tc-search-item:hover {
  background: #faf7f2;
}

.tc-search-item__img {
  width: 48px;
  height: 48px;
  border-radius: 8px;
  object-fit: cover;
  background: #eee;
  flex-shrink: 0;
}

.tc-search-item__info {
  flex: 1;
  min-width: 0;
}

.tc-search-item__title {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--tc-dark, #201c17);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 4px;
}

.tc-search-item__price {
  font-size: 13px;
  font-weight: 700;
  color: var(--tc-accent, #c83232);
}

.tc-search-view-all {
  padding: 12px 16px;
  background: #fdfaf6;
  text-align: center;
  border-top: 1px solid #eee;
}

.tc-search-view-all .tc-btn {
  padding: 8px 18px;
  font-size: 13px;
}

/* ==========================================================================
   7. CHECKOUT STYLES & PRINT INVOICE COMPATIBILITY
   ========================================================================== */
.woocommerce-checkout {
  margin-top: 20px;
}

.woocommerce-checkout .col2-set {
  margin-bottom: 30px;
}

/* Strictly hide fields not present in old checkout */
#ship-to-different-address,
#ship-to-different-address-checkbox,
.woocommerce-shipping-fields,
.shipping_address,
#billing_email_field,
#billing_company_field,
#billing_postcode_field,
#billing_address_1_field,
#billing_address_2_field,
#billing_state_field {
  display: none !important;
}

.woocommerce-checkout .woocommerce-billing-fields__field-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 2%;
}

.woocommerce-checkout .form-row-first,
.woocommerce-checkout .form-row-last {
  width: 49% !important;
  float: none !important;
  margin-bottom: 0 !important;
}

.woocommerce-checkout .form-row-wide {
  width: 100% !important;
  float: none !important;
  margin-bottom: 0 !important;
}

.woocommerce-checkout input.input-text,
.woocommerce-checkout select,
.woocommerce-checkout textarea {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid var(--tc-border, #e5e0d8);
  border-radius: 8px;
  font-size: 14px;
  background: #fff;
  transition: border-color 0.2s, box-shadow 0.2s;
  box-sizing: border-box;
}

.woocommerce-checkout input.input-text:focus,
.woocommerce-checkout select:focus,
.woocommerce-checkout textarea:focus {
  border-color: var(--tc-accent, #c83232);
  outline: none;
  box-shadow: 0 0 0 3px rgba(200, 50, 50, 0.12);
}

.woocommerce-checkout #order_review {
  background: #faf8f5;
  border: 1px solid #eee5d8;
  border-radius: 12px;
  padding: 24px;
}

.woocommerce-checkout #order_review_heading {
  margin-top: 0;
  font-size: 20px;
  font-weight: 700;
  padding-bottom: 12px;
  border-bottom: 1px solid #eee5d8;
}

/* Print Invoice Styling */
@media print {
  .tc-header,
  .tc-footer,
  .tc-floating-whatsapp,
  .tc-back-to-top,
  .tc-modal,
  #tc-search-panel {
    display: none !important;
  }
  body, .site-main, .tc-container {
    background: #fff !important;
    color: #000 !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  .tc-invoice-extra,
  .woocommerce-customer-details--extra-address {
    display: block !important;
    color: #000 !important;
    font-weight: 600 !important;
  }
}


/* =========================================================================
   Try Cotton — الصفحة الرئيسية بتصميم العميل (RTL)   |   prefix: dz-
   ========================================================================= */

/* ---- الهيدر: شفاف فوق الهيرو في الرئيسية فقط (الهيكل والـ JS الحاليين زي ما هم) ---- */
body.home #masthead.tc-header { position: absolute; inset-inline: 0; top: 0; width: 100%; background: transparent; border-bottom: 0; box-shadow: none; }
body.home #masthead .tc-header__inner { padding-block: 16px; }
body.home #masthead .tc-logo img { height: clamp(56px, 6.4vw, 86px); width: auto; }

/* ---- أساسيات ---- */
.dz-home {
	--dz-bg: #f5f1ed; --dz-strip: #e9e3dd; --dz-card: rgba(255, 255, 255, .42);
	--dz-ink: #221e1b; --dz-text: #2e2824; --dz-muted: #756c64; --dz-line: #d9d1c8; --dz-red: #d7261d;
	--dz-serif: 'Cairo', 'Tahoma', sans-serif;
	--dz-sans: 'Cairo', 'Tahoma', sans-serif;
	--dz-script: 'Cairo', 'Tahoma', sans-serif;
	--dz-wrap: 1240px; --dz-pad: clamp(16px, 3.5vw, 48px);
	background: var(--dz-bg); color: var(--dz-text); font-family: var(--dz-sans);
}
.dz-home *, .dz-home *::before, .dz-home *::after { box-sizing: border-box; }
:where(.dz-home) ul { list-style: none; margin: 0; padding: 0; }
:where(.dz-home) a { text-decoration: none; }
.dz-icon, .dz-ficon { display: block; flex: none; }
.dz-home :focus-visible { outline: 2px solid var(--dz-ink); outline-offset: 3px; border-radius: 4px; }

/* ---- الهيرو ---- */
.dz-hero { position: relative; display: flex; align-items: center; min-height: clamp(380px, 40vw, 520px); overflow: hidden; background: #efe9e2; }
.dz-hero__photo {
	position: absolute; inset-block: 0; left: 0; width: min(62%, 900px);
	-webkit-mask-image: linear-gradient(to right, #000 0, #000 52%, transparent 100%);
	mask-image: linear-gradient(to right, #000 0, #000 52%, transparent 100%);
}
.dz-hero__photo i { position: absolute; inset: 0; background: var(--dz-hero) center / cover no-repeat; transform: scaleX(-1); }
.dz-hero__content { position: relative; width: 100%; max-width: var(--dz-wrap); margin-inline: auto; padding: clamp(90px, 10vw, 120px) var(--dz-pad) clamp(44px, 5vw, 68px); }
.dz-hero__text { max-width: 520px; }
/* خاتم الضمان الطبيعي المطور في الهيرو */
.dz-seal {
	display: inline-flex;
	margin-bottom: 22px;
}
.dz-seal__ring {
	position: relative;
	width: clamp(86px, 9vw, 106px);
	height: clamp(86px, 9vw, 106px);
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.88);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border: 1.5px dashed #8c8178;
	box-shadow: 0 6px 18px rgba(45, 35, 25, 0.08), inset 0 0 0 3px rgba(255, 255, 255, 0.95);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 6px;
	color: #3a322d;
	transition: transform 0.3s ease;
}
.dz-seal:hover .dz-seal__ring {
	transform: scale(1.04) rotate(4deg);
}
.dz-seal__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	color: #3a322d;
	margin-bottom: 2px;
}
.dz-seal__icon .dz-ficon {
	width: clamp(24px, 2.8vw, 30px);
	height: clamp(24px, 2.8vw, 30px);
}
.dz-seal__title {
	font-family: 'Cairo', system-ui, sans-serif;
	font-size: clamp(9.5px, 1.1vw, 11px);
	font-weight: 700;
	color: #2b241f;
	line-height: 1.15;
	white-space: nowrap;
}
.dz-seal__val {
	font-family: 'Cairo', system-ui, sans-serif;
	font-size: clamp(9px, 1vw, 10.5px);
	font-weight: 800;
	color: var(--dz-red, #d7261d);
	line-height: 1;
	margin-top: 1px;
}

/* لوجو تراي في المساحة الجانبية فوق القطن */
.dz-hero__side-logo {
	position: absolute;
	left: clamp(20px, 5.5vw, 80px);
	top: 38%;
	transform: translateY(-50%);
	z-index: 3;
	pointer-events: none;
}
.dz-hero__side-logo-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	background: rgba(255, 255, 255, 0.88);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	padding: 10px 14px 8px;
	border-radius: 18px;
	border: 1px solid rgba(255, 255, 255, 0.8);
	box-shadow: 0 10px 30px rgba(45, 35, 25, 0.08), 0 2px 6px rgba(0, 0, 0, 0.04);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	pointer-events: auto;
}
.dz-hero__side-logo-card:hover {
	transform: translateY(-3px) scale(1.02);
	box-shadow: 0 14px 36px rgba(45, 35, 25, 0.12);
}
.dz-hero__side-logo-card img {
	width: clamp(65px, 8.5vw, 92px);
	height: auto;
	display: block;
	object-fit: contain;
}
.dz-hero__side-logo-tag {
	font-family: 'Cairo', system-ui, sans-serif;
	font-size: 10px;
	font-weight: 700;
	color: #6d6259;
	letter-spacing: -0.2px;
	border-top: 1px solid rgba(0, 0, 0, 0.06);
	padding-top: 3px;
	width: 100%;
	text-align: center;
}

.dz-hero h1 { margin: 0 0 18px; font-family: 'Cairo', system-ui, sans-serif; font-weight: 400; font-size: clamp(2.5rem, 5.4vw, 4.6rem); line-height: 1.18; color: var(--dz-ink); }
.dz-hero h1 strong { display: block; font-weight: 800; font-family: 'Cairo', system-ui, sans-serif; }
.dz-hero h1 span,
.dz-hero__headline-sub {
	display: block;
	font-family: 'Cairo', system-ui, sans-serif !important;
	font-style: normal !important;
	font-weight: 700 !important;
	font-size: clamp(1.25rem, 3.2vw, 2.1rem) !important;
	line-height: 1.35 !important;
	color: #3d352f !important;
	margin-top: 10px !important;
	letter-spacing: 0 !important;
}
.dz-hero__sub { margin: 0; font: 300 clamp(1rem, 1.3vw, 1.15rem) / 2 var(--dz-sans); color: var(--dz-text); }
.dz-cta { display: inline-flex; align-items: center; gap: 16px; margin-top: 30px; height: 56px; padding-inline: 30px; background: var(--dz-ink); color: #fff !important; border-radius: 10px; font: 500 1rem var(--dz-sans); transition: background .2s ease; }
.dz-cta:hover { background: #3a322c; }
.dz-icon--arrow { transform: scaleX(-1); transition: transform .2s ease; }
.dz-cta:hover .dz-icon--arrow { transform: scaleX(-1) translateX(3px); }
.dz-hero__tear { position: absolute; inset-inline: 0; bottom: -1px; width: 100%; height: clamp(28px, 3.8vw, 50px); display: block; }
.dz-tear-back { fill: #faf7f4; }
.dz-tear-front { fill: var(--dz-bg); }

/* ---- الأقسام ---- */
.dz-cats {
	max-width: var(--dz-wrap);
	margin-inline: auto;
	padding: clamp(14px, 2vw, 24px) var(--dz-pad) clamp(16px, 2.5vw, 28px);
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: clamp(8px, 2.4vw, 28px);
}
.dz-cat {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: 0;
	color: var(--dz-ink);
	text-decoration: none;
	transition: transform .25s ease;
}
.dz-cat + .dz-cat { border-inline-start: 0; }
.dz-cat:hover { transform: translateY(-3px); }
.dz-cat__media { position: relative; display: block; width: 100%; max-width: clamp(74px, 14vw, 150px); }
.dz-cat__img { display: block; aspect-ratio: 1; border-radius: 50%; overflow: hidden; background: #efe8df; box-shadow: 0 4px 14px rgba(40, 30, 20, .06); transition: transform .3s ease, box-shadow .3s ease; }
.dz-cat__img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.dz-cat:hover .dz-cat__img { transform: scale(1.04); box-shadow: 0 8px 22px rgba(40, 30, 20, .12); }
.dz-cat__num { display: none; }
.dz-cat__name { margin-top: 10px; font: 700 clamp(.9rem, 1.8vw, 1.2rem) / 1.3 var(--dz-sans); color: var(--dz-ink); }
.dz-cat__en { display: none; }
.dz-cat__go { display: none; }

/* ---- شريط المميزات ---- */
.dz-features { max-width: var(--dz-wrap); margin: clamp(26px, 3.5vw, 42px) auto 0; padding-inline: var(--dz-pad); }
.dz-features__bar { display: grid; grid-template-columns: repeat(4, 1fr); background: var(--dz-strip); border-radius: 22px; padding: 20px 8px; }
.dz-feature { display: flex; align-items: center; justify-content: center; gap: 16px; padding: 4px 14px; color: var(--dz-ink); }
.dz-feature + .dz-feature { border-inline-start: 1px solid #d3cbc2; }
.dz-feature__txt { display: flex; flex-direction: column; line-height: 1.5; }
.dz-feature__txt strong { font: 500 .95rem var(--dz-sans); }
.dz-feature__txt span { font: 300 .8rem var(--dz-sans); color: var(--dz-muted); }

/* ---- الأكثر مبيعاً ---- */
.dz-best { position: relative; max-width: var(--dz-wrap); margin-inline: auto; padding: clamp(40px, 6vw, 76px) var(--dz-pad) clamp(50px, 6vw, 84px); }
.dz-best__leaf { position: absolute; left: 0; top: 6%; width: clamp(110px, 14vw, 200px); opacity: .16; filter: blur(2.5px); pointer-events: none; transform: scaleX(-1); }
.dz-best__head { position: relative; text-align: center; margin-bottom: clamp(22px, 3vw, 34px); }
.dz-best__title { display: flex; align-items: center; justify-content: center; gap: clamp(16px, 2.4vw, 30px); margin: 0; font: 400 clamp(1.8rem, 3.2vw, 2.4rem) / 1.3 var(--dz-serif); color: var(--dz-ink); }
.dz-best__title::before, .dz-best__title::after { content: ""; flex: 0 1 clamp(56px, 13vw, 150px); height: 1px; background: var(--dz-line); }
.dz-best__sub { display: inline-flex; align-items: center; gap: 8px; margin: 4px 0 0; font: 400 1.15rem var(--dz-script); color: var(--dz-muted); }
.dz-grid { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(12px, 1.7vw, 22px); }
.dz-card { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 20px 16px 18px; background: var(--dz-card); border-radius: 18px; }
.dz-heart { position: absolute; top: 14px; inset-inline-end: 14px; z-index: 2; display: grid; place-items: center; width: 34px; height: 34px; padding: 0; background: none; border: 0; color: #5b524b; cursor: pointer; }
.dz-heart[aria-pressed="true"] { color: var(--dz-red); }
.dz-heart[aria-pressed="true"] svg { fill: currentColor; }
.dz-card__img { display: block; width: 100%; aspect-ratio: 1 / 1.05; margin-bottom: 12px; }
.dz-card__img img { display: block; width: 100%; height: 100%; object-fit: contain; }
.dz-card__name { margin: 0; font: 400 .98rem / 1.6 var(--dz-sans); color: var(--dz-ink); }
.dz-card__name a { color: inherit; }
.dz-card__price { margin: 6px 0 16px; font: 700 1.05rem var(--dz-sans); color: var(--dz-ink); }
.dz-card__price del { opacity: .5; font-weight: 400; }
.dz-card__price ins { text-decoration: none; }
.dz-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; width: min(100%, 188px); height: 44px; margin-top: auto; background: transparent; border: 1px solid #8c8178; border-radius: 8px; color: var(--dz-ink) !important; font: 500 .88rem var(--dz-sans); cursor: pointer; transition: background .2s ease, color .2s ease, border-color .2s ease; }
.dz-btn:hover { background: var(--dz-ink); border-color: var(--dz-ink); color: #fff !important; }
.dz-btn.loading { opacity: .6; pointer-events: none; }
.dz-btn.added { display: none; }
.dz-card .added_to_cart { display: inline-flex; align-items: center; justify-content: center; width: min(100%, 188px); height: 44px; margin-top: auto; background: var(--dz-ink); color: #fff; border-radius: 8px; font: 500 .88rem var(--dz-sans); }

/* ---- تابلت / موبايل ---- */
@media (max-width: 960px) {
	.dz-cats { grid-template-columns: repeat(4, 1fr) !important; gap: clamp(6px, 2vw, 16px); row-gap: 0; padding-top: 12px; padding-bottom: 16px; }
	.dz-cat + .dz-cat, .dz-cat:nth-child(even) { border-inline-start: 0 !important; }
	.dz-features__bar { grid-template-columns: repeat(4, 1fr); row-gap: 0; }
	.dz-feature + .dz-feature { border-inline-start: 1px solid #d3cbc2; }
	.dz-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
	.dz-hero { min-height: 340px !important; align-items: flex-end; }
	.dz-hero__photo { width: 100%; -webkit-mask-image: none; mask-image: none; }
	.dz-hero::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(to top, var(--dz-bg) 0%, rgba(245, 241, 237, .92) 40%, rgba(245, 241, 237, 0) 72%); }
	.dz-hero__content { z-index: 2; padding-top: 0 !important; padding-bottom: 34px !important; }
	.dz-hero__text { max-width: 100%; }
	.dz-hero h1 { font-size: clamp(1.6rem, 5.5vw, 2.1rem); margin-bottom: 8px; }
	.dz-hero h1 span,
	.dz-hero__headline-sub { font-size: 1.15rem !important; margin-top: 6px !important; }
	.dz-hero__sub { font-size: .88rem; line-height: 1.5; }
	.dz-cta { margin-top: 14px; height: 42px; padding-inline: 20px; font-size: .88rem; }
	.dz-seal { margin-bottom: 12px; }
	.dz-seal__ring { width: 76px; height: 76px; padding: 4px; }
	.dz-seal__icon .dz-ficon { width: 22px; height: 22px; }
	.dz-seal__title { font-size: 8.5px; }
	.dz-seal__val { font-size: 8px; }
	.dz-hero__side-logo { left: 14px; top: 22%; }
	.dz-hero__side-logo-card { padding: 6px 10px 5px; border-radius: 14px; }
	.dz-hero__side-logo-card img { width: 52px; }
	.dz-hero__side-logo-tag { font-size: 8px; }
	.dz-hero__tear { height: 28px !important; }
	.dz-cats { grid-template-columns: repeat(4, 1fr) !important; gap: 6px !important; padding: 10px 10px 14px !important; }
	.dz-cat__media { max-width: 76px !important; }
	.dz-cat__name { font-size: .88rem !important; margin-top: 6px !important; }
	.dz-cat__num { display: none !important; }
	.dz-cat__en { display: none !important; }
	.dz-cat__go { display: none !important; }
	.dz-feature { flex-direction: column; gap: 4px; text-align: center; padding: 4px 2px; }
	.dz-feature__txt { align-items: center; }
	.dz-features__bar { padding: 10px 4px; }
	.dz-card { padding: 16px 10px 14px; }
	.dz-btn { font-size: .8rem; gap: 6px; }
}
@media (prefers-reduced-motion: reduce) { .dz-home *, .dz-home *::before { transition: none !important; } }


/* ---- Try Cotton home: تحسينات (الهيدر مع شريط الأدمن، الظل، اللوجو، صور الأقسام، تلاشي الهيرو) ---- */
body.admin-bar.home #masthead.tc-header { top: 32px; }
@media (max-width: 782px) { body.admin-bar.home #masthead.tc-header { top: 46px; } }
body.home #masthead.tc-header, body.home #masthead.tc-header.is-scrolled { box-shadow: none; border-bottom: 0; background: transparent; }
body.home #masthead .tc-logo img { height: clamp(64px, 7vw, 96px); }
body.home .tc-cart-drawer:not(.is-open):not(.open):not(.active) { box-shadow: none; }
.dz-cat__img img { transform: none; }
.dz-cat:hover .dz-cat__img img { transform: scale(1.05); }
.dz-hero__photo::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 190px; z-index: 1; background: linear-gradient(to bottom, #efe9e2 0%, rgba(239, 233, 226, .85) 35%, rgba(239, 233, 226, 0) 100%); }


/* بحث الهيدر: اللوحة كانت تفضل مقفولة (max-height:0) رغم تغيّر aria-expanded — نفتحها بناءً على نفس الـ attribute */
#masthead:has(#tc-search-toggle[aria-expanded="true"]) .tc-search-panel { max-height: 320px; overflow: visible; border-bottom: 1px solid #e3d9c5; }


/* =========================================================================
   Try Cotton — تأثير بصري + تحويل للسوق الكويتي   |   شريط الإعلانات، الحركة، العروض، الشارات
   ========================================================================= */
:root { --dz-bar-h: 40px; }

/* ---- شريط الإعلانات (كل الصفحات) ---- */
.dz-bar { position: relative; z-index: 120; height: var(--dz-bar-h); background: #221e1b; color: #f5f1ed; overflow: hidden; font: 500 .86rem / 1 'Cairo', 'Tahoma', sans-serif; }
.dz-bar__track { position: relative; height: 100%; max-width: 1240px; margin-inline: auto; }
.dz-bar__msg { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; margin: 0; padding-inline: 16px; text-align: center; color: inherit; text-decoration: none; opacity: 0; animation: dz-bar 12s infinite; }
.dz-bar__msg:nth-child(2) { animation-delay: 4s; }
.dz-bar__msg:nth-child(3) { animation-delay: 8s; }
a.dz-bar__msg { color: #f5f1ed; font-weight: 700; }
a.dz-bar__msg:hover { text-decoration: underline; text-underline-offset: 4px; }
@keyframes dz-bar { 0% { opacity: 0; transform: translateY(70%); } 4%, 30% { opacity: 1; transform: none; } 34%, 100% { opacity: 0; transform: translateY(-70%); } }

/* الهيدر في الرئيسية ينزل تحت الشريط */
body.home #masthead.tc-header { top: var(--dz-bar-h); }
body.admin-bar.home #masthead.tc-header { top: calc(32px + var(--dz-bar-h)); }
@media (max-width: 782px) { body.admin-bar.home #masthead.tc-header { top: calc(46px + var(--dz-bar-h)); } }
@media (max-width: 600px) { :root { --dz-bar-h: 44px; } .dz-bar { font-size: .78rem; } }

/* ---- حركة الدخول والظهور ---- */
@keyframes dz-rise { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }
@keyframes dz-fade { from { opacity: 0; } to { opacity: 1; } }
.dz-hero__text > * { animation: dz-rise .9s cubic-bezier(.2, .7, .2, 1) backwards; }
.dz-hero__text > :nth-child(1) { animation-delay: .05s; }
.dz-hero__text > :nth-child(2) { animation-delay: .18s; }
.dz-hero__text > :nth-child(3) { animation-delay: .32s; }
.dz-hero__text > :nth-child(4) { animation-delay: .46s; }
.dz-hero__photo i { animation: dz-fade 1.4s ease backwards; }
.dz-js .dz-cat:not(.is-in), .dz-js .dz-features__bar:not(.is-in), .dz-js .dz-best__head:not(.is-in), .dz-js .dz-card:not(.is-in), .dz-js .dz-offers__card:not(.is-in) { opacity: 0; transform: translateY(26px); }
.dz-js .is-in { animation: dz-rise .75s cubic-bezier(.2, .7, .2, 1) var(--dz-d, 0ms) backwards; }

/* ---- تفاعل الكروت والأزرار ---- */
.dz-card { transition: transform .35s cubic-bezier(.2, .7, .2, 1), box-shadow .35s ease, background .35s ease; }
.dz-card:hover { transform: translateY(-7px); box-shadow: 0 22px 44px rgba(34, 30, 27, .12); background: rgba(255, 255, 255, .8); }
.dz-card__img img { transition: transform .6s cubic-bezier(.2, .7, .2, 1); }
.dz-card:hover .dz-card__img img { transform: scale(1.06); }
.dz-cta { position: relative; overflow: hidden; }
.dz-cta::after { content: ""; position: absolute; inset-block: 0; inset-inline-start: -60%; width: 40%; background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .28), transparent); transform: skewX(-20deg); transition: inset-inline-start .7s ease; }
.dz-cta:hover::after { inset-inline-start: 130%; }
.dz-cat__img { transition: box-shadow .4s ease; }
.dz-cat:hover .dz-cat__img { box-shadow: 0 0 0 5px #fff, 0 0 0 6px var(--dz-line), 0 18px 34px rgba(34, 30, 27, .14); }

/* ---- شارة الحد الأدنى للطلب على الكروت ---- */
.dz-card__chip { position: absolute; top: 16px; inset-inline-start: 14px; z-index: 2; padding: 5px 11px; border-radius: 999px; background: #221e1b; color: #f5f1ed; font: 500 .74rem / 1.2 var(--dz-sans); letter-spacing: 0; }

/* ---- قسم عروض التوفير ---- */
.dz-offers { max-width: var(--dz-wrap); margin-inline: auto; padding: 0 var(--dz-pad) clamp(50px, 6vw, 90px); background: var(--dz-bg); }
.dz-offers__card { position: relative; display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: clamp(22px, 4vw, 60px); padding: clamp(28px, 5vw, 64px); border-radius: 28px; background: linear-gradient(135deg, #2b2521, #1a1613); color: #f5f1ed; overflow: hidden; }
.dz-offers__card--solo { grid-template-columns: 1fr; }
.dz-offers__card::before { content: ""; position: absolute; inset-inline-start: -90px; top: -110px; width: 340px; height: 340px; border-radius: 50%; background: radial-gradient(circle, rgba(215, 38, 29, .38), transparent 66%); pointer-events: none; }
.dz-offers__body { position: relative; }
.dz-offers__eyebrow { display: inline-block; padding: 6px 16px; border: 1px solid rgba(245, 241, 237, .35); border-radius: 999px; font: 500 .82rem var(--dz-sans); color: #f5f1ed; }
.dz-offers h2 { margin: 16px 0 14px; font: 400 clamp(1.9rem, 3.6vw, 3rem) / 1.28 var(--dz-serif); color: #fff; }
.dz-offers__body p { margin: 0; max-width: 54ch; font: 300 1.05rem / 2 var(--dz-sans); color: rgba(245, 241, 237, .86); }
.dz-offers__points { display: flex; flex-wrap: wrap; gap: 10px 24px; margin: 20px 0 28px !important; }
.dz-offers__points li { display: inline-flex; align-items: center; gap: 8px; font: 500 .92rem var(--dz-sans); color: #f5f1ed; }
.dz-tick { flex: none; color: #e9b8b3; }
.dz-cta--light { background: #f5f1ed; color: #221e1b !important; margin-top: 0; }
.dz-cta--light:hover { background: #fff; }
.dz-offers__media { position: relative; display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.dz-pack { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 14px 12px 16px; border-radius: 20px; background: #f5f1ed; color: #221e1b; transition: transform .4s cubic-bezier(.2, .7, .2, 1); }
.dz-pack:nth-child(1) { transform: rotate(-2.5deg); }
.dz-pack:nth-child(2) { transform: rotate(2deg) translateY(14px); }
.dz-pack:hover { transform: rotate(0) translateY(-6px); }
.dz-pack__img { display: block; width: 100%; aspect-ratio: 1; margin-bottom: 10px; border-radius: 12px; overflow: hidden; background: #ebe4dc; }
.dz-pack__img img { display: block; width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.dz-pack__name { font: 500 .88rem / 1.5 var(--dz-sans); }
.dz-pack__price { margin-top: 4px; font: 700 .95rem var(--dz-sans); color: #b3261e; }
@media (max-width: 860px) { .dz-offers__card { grid-template-columns: 1fr; } .dz-offers__media { max-width: 460px; } }
@media (max-width: 480px) { .dz-offers__media { gap: 10px; } .dz-pack:nth-child(2) { transform: rotate(2deg) translateY(8px); } }

/* ---- تقليل الحركة ---- */
@media (prefers-reduced-motion: reduce) {
	.dz-bar__msg { animation: none; opacity: 0; }
	.dz-bar__msg:first-child { opacity: 1; }
	.dz-hero__text > *, .dz-hero__photo i, .dz-js .is-in { animation: none !important; }
	.dz-js .dz-cat:not(.is-in), .dz-js .dz-features__bar:not(.is-in), .dz-js .dz-best__head:not(.is-in), .dz-js .dz-card:not(.is-in), .dz-js .dz-offers__card:not(.is-in) { opacity: 1; transform: none; }
	.dz-card:hover, .dz-pack:hover { transform: none; }
	.dz-cta::after { display: none; }
}


/* =========================================================================
   Try Cotton — أزرار عائمة (واتساب + اتصال) + فقاعة ترحيب + حركة جذب الانتباه
   ========================================================================= */
.tc-floating-whatsapp { display: none !important; }   /* الزر القديم (الرقم ثابت في footer.php) */

.dz-fab { position: fixed; inset-inline-end: 18px; bottom: 18px; z-index: 95; display: flex; flex-direction: column; align-items: center; gap: 12px; font-family: 'Cairo', 'Tahoma', sans-serif; }
.dz-fab__btn { position: relative; display: grid; place-items: center; width: 58px; height: 58px; border-radius: 50%; color: #fff; text-decoration: none; box-shadow: 0 10px 26px rgba(34, 30, 27, .3); transition: transform .25s cubic-bezier(.2, .7, .2, 1), box-shadow .25s ease; }
.dz-fab__btn svg { width: 28px; height: 28px; fill: currentColor; }
.dz-fab__btn:hover { transform: scale(1.09); box-shadow: 0 14px 32px rgba(34, 30, 27, .36); }
.dz-fab__btn--wa { background: #25d366; }
.dz-fab__btn--call { width: 50px; height: 50px; background: #221e1b; }
.dz-fab__btn--call svg { width: 24px; height: 24px; }

/* نبض حلقات واتساب + رجّة خفيفة كل فترة */
.dz-fab__btn--wa::before, .dz-fab__btn--wa::after { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid #25d366; pointer-events: none; animation: dz-ring 2.4s cubic-bezier(.2, .6, .3, 1) infinite; }
.dz-fab__btn--wa::after { animation-delay: 1.2s; }
@keyframes dz-ring { 0% { transform: scale(1); opacity: .75; } 100% { transform: scale(1.95); opacity: 0; } }
.dz-fab__btn--wa svg { animation: dz-wiggle 9s ease-in-out 3s infinite; }
@keyframes dz-wiggle { 0%, 7%, 100% { transform: none; } 1% { transform: rotate(-14deg) scale(1.12); } 2% { transform: rotate(12deg) scale(1.12); } 3% { transform: rotate(-9deg); } 4% { transform: rotate(7deg); } 5% { transform: rotate(-3deg); } }

/* تلميح اسم الزر عند المرور */
.dz-fab__tip { position: absolute; inset-inline-start: calc(100% + 12px); top: 50%; transform: translateY(-50%); padding: 8px 13px; border-radius: 9px; background: #221e1b; color: #fff; font: 500 .82rem / 1 'Cairo', 'Tahoma', sans-serif; white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity .2s ease; }
.dz-fab__btn:hover .dz-fab__tip, .dz-fab__btn:focus-visible .dz-fab__tip { opacity: 1; }

/* فقاعة الترحيب */
.dz-fab__bubble { position: absolute; bottom: calc(100% + 16px); inset-inline-end: 0; width: min(272px, calc(100vw - 40px)); padding: 16px 18px; border-radius: 18px 18px 18px 4px; background: #fff; color: #221e1b; box-shadow: 0 18px 44px rgba(34, 30, 27, .24); font: 400 .9rem / 1.75 'Cairo', 'Tahoma', sans-serif; transform-origin: bottom left; animation: dz-pop .55s cubic-bezier(.2, .9, .3, 1.25) both; }
.dz-fab__bubble[hidden] { display: none; }
.dz-fab__bubble strong { display: block; margin-bottom: 2px; font-weight: 700; padding-inline-end: 22px; }
.dz-fab__bubble a { display: inline-block; margin-top: 10px; padding: 9px 18px; border-radius: 999px; background: #25d366; color: #fff; font-weight: 700; text-decoration: none; }
.dz-fab__bubble a:hover { background: #1ebe5b; }
.dz-fab__x { position: absolute; top: 8px; inset-inline-end: 10px; padding: 0; background: none; border: 0; font-size: 22px; line-height: 1; color: #8c8178; cursor: pointer; }
@keyframes dz-pop { from { opacity: 0; transform: translateY(14px) scale(.85); } to { opacity: 1; transform: none; } }

/* ---- الرئيسية: زغب القطن، نبض زر التسوق، بارالاكس ---- */
.dz-hero__content { position: relative; z-index: 2; }
.dz-fluff { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 1; }
.dz-fluff i { position: absolute; bottom: -20px; left: var(--x); width: var(--s); height: var(--s); border-radius: 50%; background: radial-gradient(circle at 35% 35%, #fff, rgba(255, 255, 255, .45) 60%, transparent 72%); opacity: 0; filter: blur(.6px); animation: dz-float var(--d) linear var(--t) infinite; }
@keyframes dz-float { 0% { transform: translate(0, 0); opacity: 0; } 10% { opacity: .9; } 90% { opacity: .55; } 100% { transform: translate(var(--dx), -640px); opacity: 0; } }
.dz-hero__text > .dz-cta { animation: dz-rise .9s cubic-bezier(.2, .7, .2, 1) .46s backwards, dz-glow 3.4s ease-out 2.2s infinite; }
@keyframes dz-glow { 0% { box-shadow: 0 0 0 0 rgba(34, 30, 27, .38); } 70%, 100% { box-shadow: 0 0 0 18px rgba(34, 30, 27, 0); } }
.dz-hero__photo { will-change: transform; }

@media (max-width: 600px) {
	.dz-fab { inset-inline-end: 12px; bottom: 12px; gap: 10px; }
	.dz-fab__btn { width: 54px; height: 54px; }
	.dz-fab__btn--call { width: 46px; height: 46px; }
	.dz-fab__tip { display: none; }
}
@media (prefers-reduced-motion: reduce) {
	.dz-fab__btn--wa::before, .dz-fab__btn--wa::after, .dz-fab__btn--wa svg, .dz-fab__bubble, .dz-hero__text > .dz-cta { animation: none; }
	.dz-fluff { display: none; }
}


/* زر "الرجوع للأعلى" كان بيقع فوق أزرار الواتساب والاتصال (نفس الركن) — ننقله للجهة المقابلة */
#tc-back-to-top.tc-back-to-top { inset-inline-end: auto; inset-inline-start: 24px; bottom: 24px; }
@media (max-width: 600px) { #tc-back-to-top.tc-back-to-top { inset-inline-start: 12px; bottom: 12px; } }


/* =========================================================================
   Try Cotton — تحسينات الريسبونسيف (موبايل صغير)
   ========================================================================= */
@media (max-width: 520px) {
	/* شارة الحد الأدنى تنزل فوق الزر بدل ما تغطي قلب المفضلة */
	.dz-card__chip { position: static; order: 4; align-self: center; margin: -2px 0 12px; padding: 4px 10px; font-size: .68rem; }
	.dz-card__img { order: 1; }
	.dz-card__name { order: 2; }
	.dz-card__price { order: 3; margin-bottom: 10px; }
	.dz-btn, .dz-card .added_to_cart { order: 5; }
}
@media (max-width: 600px) {
	/* أزرار عائمة أصغر وأقرب للحافة عشان ما تغطيش المحتوى */
	.dz-fab { inset-inline-end: 10px; bottom: 10px; gap: 8px; }
	.dz-fab__btn { width: 48px; height: 48px; }
	.dz-fab__btn svg { width: 24px; height: 24px; }
	.dz-fab__btn--call { width: 40px; height: 40px; }
	.dz-fab__btn--call svg { width: 20px; height: 20px; }
	#tc-back-to-top.tc-back-to-top { width: 40px; height: 40px; inset-inline-start: 10px; bottom: 10px; }
}


/* شاشات واسعة جداً: الصورة تتحرك مع الحاوية وتتلاشى من الجهتين بدل ما تفضل ملصوقة بحافة الشاشة */
@media (min-width: 1700px) {
	.dz-hero__photo {
		left: calc((100% - 1240px) / 2 - 120px);
		width: 900px;
		-webkit-mask-image: linear-gradient(to right, transparent 0, #000 14%, #000 52%, transparent 100%);
		mask-image: linear-gradient(to right, transparent 0, #000 14%, #000 52%, transparent 100%);
	}
}


/* =========================================================================
   كايرو لكل الحروف العربية في الموقع كله
   الحروف اللاتينية تفضل بخطوط البراند (Playfair / Poppins / Caveat)،
   والعربي بيقع دايماً على كايرو (الخطوط دي مفيهاش حروف عربية).
   ========================================================================= */
:root {
	--tc-font-heading: "Playfair Display", "Cairo", "Tahoma", sans-serif;
	--tc-font-body: "Poppins", "Cairo", "Tahoma", sans-serif;
	--tc-font-ar: "Cairo", "Tahoma", sans-serif;
	--tc-font-script: "Caveat", "Cairo", "Tahoma", sans-serif;
}
/* عناصر الفورم بترجع لخط النظام لو ما وُرّث الخط (نضمن كايرو بدون ما نكسر أي قاعدة موجودة) */
:where(body) :where(button, input, select, textarea, optgroup) { font-family: inherit; }


/* =========================================================================
   Try Cotton — روح: ملمس، دفء، حكاية، وحركة بشخصية
   ========================================================================= */
.dz-home { position: relative; }

/* ---- ملمس ورقي خفيف فوق الصفحة ---- */
.dz-home::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; opacity: .055; mix-blend-mode: multiply;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .35 0 0 0 0 .28 0 0 0 0 .2 0 0 0 .6 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }

/* ---- حافة ورق ممزق قبل الفوتر (نفس لغة تصميم الهيرو) ---- */
.dz-home::after { content: ""; position: absolute; inset-inline: 0; bottom: -1px; height: clamp(28px, 4vw, 54px); pointer-events: none; z-index: 2;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 70' preserveAspectRatio='none'%3E%3Cpath fill='%23342d27' d='M0,70L0,26L28,30L57,36L82,28L112,33L138,45L166,42L194,38L219,37L250,34L280,34L304,33L333,24L357,31L385,27L416,26L448,21L478,23L509,31L534,20L560,36L588,32L614,32L641,32L670,37L701,40L732,43L764,39L790,42L821,41L850,35L876,35L904,24L929,32L961,18L991,22L1016,20L1046,29L1071,26L1095,28L1122,33L1154,29L1186,28L1210,35L1234,30L1262,38L1287,30L1318,34L1349,43L1377,35L1405,36L1433,33L1440,70Z'/%3E%3Cpath fill='%23201c17' d='M0,70L0,37L28,46L56,42L85,39L113,46L143,39L170,38L200,46L225,49L256,43L285,34L309,37L334,31L360,27L387,32L418,32L447,32L477,32L503,40L535,40L564,34L590,35L615,44L642,47L669,49L700,37L726,50L753,51L781,37L810,46L836,35L862,45L892,32L918,30L943,38L968,34L996,28L1026,27L1055,27L1082,29L1108,41L1139,33L1170,34L1197,45L1226,36L1258,39L1284,48L1311,41L1335,38L1364,40L1393,40L1421,47L1440,70Z'/%3E%3C/svg%3E") bottom / 100% 100% no-repeat; }

/* ---- دفء: اللون الأحمر بتاع اللوجو بجرعات صغيرة ---- */
.dz-cta:hover { background: #d7261d; }
.dz-cta--light:hover { background: #fff; color: #d7261d !important; }
.dz-card__name a:hover, .dz-cat:hover .dz-cat__name { color: #d7261d; }
.dz-best__title::before, .dz-best__title::after { background: linear-gradient(90deg, transparent, #d7261d55, transparent); height: 2px; }

/* خط أحمر مرسوم بإيد تحت "اشعر بالفرق" */
.dz-hero h1 span { width: fit-content; position: relative; }
.dz-hero h1 span::after { content: ""; position: absolute; inset-inline: -2%; bottom: .02em; height: .3em; pointer-events: none; clip-path: inset(0 0 0 100%); animation: dz-underline .9s cubic-bezier(.6, .1, .2, 1) 1.1s forwards;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 20' preserveAspectRatio='none'%3E%3Cpath d='M4 12C40 2 70 20 110 10S190 2 230 12 280 16 296 8' fill='none' stroke='%23d7261d' stroke-width='5' stroke-linecap='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") center / 100% 100% no-repeat; }
@keyframes dz-underline { to { clip-path: inset(0 0 0 0); } }

/* ---- توحيد ألوان صور المنتجات (خلفيات رمادية مختلفة) وتنعيم الحواف ---- */
.dz-card__img { border-radius: 14px; overflow: hidden; background: #ebe4dc; }
.dz-card__img img { filter: sepia(.1) saturate(1.06) contrast(1.02); }

/* ---- شريط الكلمات الكبير ---- */
.dz-marquee { position: relative; overflow: hidden; padding: clamp(22px, 3vw, 40px) 0; margin-bottom: clamp(30px, 5vw, 70px); border-block: 1px solid var(--dz-line); direction: ltr; }
.dz-marquee__track { display: flex; width: max-content; animation: dz-marquee 42s linear infinite; }
.dz-marquee:hover .dz-marquee__track { animation-play-state: paused; }
.dz-marquee__set { display: flex; flex: none; align-items: center; gap: clamp(24px, 3vw, 48px); margin: 0; padding: 0; padding-inline-end: clamp(24px, 3vw, 48px); }
.dz-marquee__set li { display: flex; align-items: center; gap: clamp(24px, 3vw, 48px); direction: rtl; white-space: nowrap; font: 800 clamp(1.9rem, 4.2vw, 3.4rem) / 1.25 var(--dz-sans); color: var(--dz-ink); }
.dz-marquee__set li.is-light { font-weight: 300; color: var(--dz-muted); }
.dz-marquee__set .dz-ficon { width: 34px; height: 34px; color: var(--dz-red); }
@keyframes dz-marquee { to { transform: translateX(-50%); } }

/* ---- قسم "قصة تراي" ---- */
.dz-story { max-width: var(--dz-wrap); margin-inline: auto; padding: clamp(10px, 2vw, 30px) var(--dz-pad) clamp(50px, 6vw, 90px); display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: clamp(24px, 5vw, 80px); }
.dz-story__eyebrow { display: inline-flex; align-items: center; gap: 10px; font: 500 .95rem var(--dz-sans); color: #d7261d; }
.dz-story__eyebrow::before { content: ""; width: 28px; height: 2px; background: currentColor; }
.dz-story h2 { margin: 12px 0 16px; font: 800 clamp(2rem, 4vw, 3.2rem) / 1.25 var(--dz-serif); color: var(--dz-ink); }
.dz-story__body > p { margin: 0; max-width: 56ch; font: 300 1.1rem / 2.05 var(--dz-sans); color: var(--dz-text); }
.dz-story__pledges { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin: 26px 0 24px; }
.dz-pledge { display: flex; gap: 14px; align-items: flex-start; padding: 18px 18px 20px; border-radius: 18px; background: rgba(255, 255, 255, .55); border: 1px solid rgba(217, 209, 200, .7); transition: transform .35s cubic-bezier(.2, .7, .2, 1), box-shadow .35s ease; }
.dz-pledge:hover { transform: translateY(-4px); box-shadow: 0 16px 34px rgba(34, 30, 27, .1); }
.dz-pledge .dz-ficon { width: 40px; height: 40px; color: var(--dz-ink); }
.dz-pledge h3 { margin: 0 0 4px; font: 700 1.02rem var(--dz-sans); color: var(--dz-ink); }
.dz-pledge p { margin: 0; font: 300 .9rem / 1.8 var(--dz-sans); color: var(--dz-muted); }
.dz-link { display: inline-flex; align-items: center; gap: 10px; font: 700 1rem var(--dz-sans); color: var(--dz-ink); border-bottom: 2px solid #d7261d; padding-bottom: 3px; transition: gap .25s ease, color .25s ease; }
.dz-link:hover { gap: 16px; color: #d7261d; }
.dz-link .dz-icon--arrow { width: 18px; height: 18px; }
.dz-story__sign { margin-top: 22px !important; font: 300 1.05rem var(--dz-script) !important; color: var(--dz-muted) !important; }
.dz-story__sign::before { content: "●"; margin-inline-end: 10px; color: #d7261d; font-size: .6em; vertical-align: middle; }

.dz-story__art { position: relative; justify-self: center; width: min(100%, 430px); aspect-ratio: 420 / 520; color: var(--dz-ink); }
.dz-story__art::before { content: ""; position: absolute; inset: 6% 4% 2%; border-radius: 50%; background: radial-gradient(circle at 50% 45%, #fff 0, rgba(255, 255, 255, .55) 45%, transparent 72%); }
.dz-branch { position: relative; width: 100%; height: 100%; overflow: visible; }
.dz-branch__sway { transform-box: fill-box; transform-origin: 50% 100%; animation: dz-sway 8s ease-in-out infinite alternate; }
@keyframes dz-sway { from { transform: rotate(-1.6deg); } to { transform: rotate(1.6deg); } }
.dz-draw { stroke-dasharray: 1; stroke-dashoffset: 0; }
.dz-boll { transform-box: fill-box; transform-origin: 50% 100%; }
.dz-js .dz-story__art:not(.is-in) .dz-draw { stroke-dashoffset: 1; }
.dz-js .dz-story__art:not(.is-in) .dz-boll { opacity: 0; scale: .2; }
.dz-story__art.is-in .dz-draw { animation: dz-draw 1.8s cubic-bezier(.5, .1, .2, 1) calc(var(--i, 0) * .35s) backwards; }
.dz-story__art.is-in .dz-boll { animation: dz-bollpop .8s cubic-bezier(.3, 1.5, .5, 1) calc(1.4s + var(--i, 0) * .25s) backwards; }
@keyframes dz-draw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes dz-bollpop { from { opacity: 0; scale: .2; } to { opacity: 1; scale: 1; } }
.dz-js .dz-story__body:not(.is-in), .dz-js .dz-story__art:not(.is-in), .dz-js .dz-marquee:not(.is-in) { opacity: 0; transform: translateY(26px); }

@media (max-width: 860px) {
	.dz-story { grid-template-columns: 1fr; }
	.dz-story__art { order: -1; width: min(70%, 320px); }
	.dz-story__pledges { grid-template-columns: 1fr; }
}

/* ---- تفاعلات صغيرة بشخصية ---- */
.dz-burst { position: absolute; inset: 0; pointer-events: none; }
.dz-burst i { position: absolute; left: 50%; top: 50%; width: 7px; height: 7px; margin: -3.5px; border-radius: 50%; background: #d7261d; animation: dz-burst .7s cubic-bezier(.2, .7, .3, 1) forwards; }
.dz-burst i:nth-child(even) { background: #fff; box-shadow: 0 0 0 1px #e9b8b3; }
@keyframes dz-burst { from { transform: translate(0, 0) scale(1); opacity: 1; } to { transform: translate(var(--tx), var(--ty)) scale(.2); opacity: 0; } }
.dz-bump { animation: dz-bump .5s cubic-bezier(.3, 1.6, .5, 1); }
@keyframes dz-bump { 0% { scale: 1; } 40% { scale: 1.7; } 100% { scale: 1; } }

@media (prefers-reduced-motion: reduce) {
	.dz-hero h1 span::after { animation: none; clip-path: none; }
	.dz-marquee__track { animation: none; width: auto; flex-wrap: wrap; justify-content: center; }
	.dz-marquee__set + .dz-marquee__set { display: none; }
	.dz-branch__sway, .dz-story__art.is-in .dz-draw, .dz-story__art.is-in .dz-boll { animation: none; }
	.dz-js .dz-story__art:not(.is-in) .dz-draw { stroke-dashoffset: 0; }
	.dz-js .dz-story__art:not(.is-in) .dz-boll { opacity: 1; scale: 1; }
	.dz-js .dz-story__body:not(.is-in), .dz-js .dz-story__art:not(.is-in), .dz-js .dz-marquee:not(.is-in) { opacity: 1; transform: none; }
	.dz-burst { display: none; }
	.dz-bump { animation: none; }
}


/* لمسات أخيرة: الخط الأحمر أنزل شوية، وغطاء القطنة بلون قطني دافي */
.dz-hero h1 span::after { bottom: -.1em; }
.dz-boll path:nth-child(2) { fill: #e6cdb0; }


/* =========================================================================
   صفحات المحتوى القانوني (من نحن / سياسة الخصوصية) — مجموعة .dz-legal
   ========================================================================= */
.dz-legal { max-width: 860px; margin-inline: auto; padding-block: 8px 30px; color: #2e2824; }
.dz-legal h2 { display: flex; align-items: center; gap: 12px; margin: 2.3em 0 .7em; font: 800 1.6rem / 1.5 var(--tc-font-ar, 'Cairo', sans-serif); color: #221e1b; }
.dz-legal h2::before { content: ""; flex: none; width: 6px; height: 1.15em; border-radius: 3px; background: #d7261d; }
.dz-legal > h2:first-child { margin-top: 0; }
.dz-legal p { margin: 0 0 1.15em; font-size: 1.05rem; line-height: 2.05; }
.dz-legal strong { font-weight: 700; color: #221e1b; }
.dz-legal ul { list-style: none; margin: 0 0 1.6em; padding: 0; display: grid; gap: 12px; }
.dz-legal li { position: relative; margin: 0; padding: 16px 22px 16px 20px; padding-inline-start: 48px; background: rgba(255, 255, 255, .62); border: 1px solid rgba(217, 209, 200, .75); border-radius: 14px; font-size: 1.02rem; line-height: 2; }
.dz-legal li::before { content: ""; position: absolute; inset-inline-start: 20px; top: 1.45em; width: 10px; height: 10px; border-radius: 50%; background: #d7261d; }
.dz-legal a { color: #221e1b; font-weight: 600; text-decoration: underline; text-decoration-color: #d7261d; text-decoration-thickness: 2px; text-underline-offset: 5px; }
.dz-legal a:hover { color: #d7261d; }
@media (max-width: 600px) {
	.dz-legal h2 { font-size: 1.35rem; }
	.dz-legal p { font-size: 1rem; }
	.dz-legal li { padding: 14px 16px; padding-inline-start: 42px; }
	.dz-legal li::before { inset-inline-start: 16px; }
}


/* قائمة الجانب: العناصر الفرعية (ولادي / بناتي) تحت "أطفال" + مسافة مراسي الصفحات تحت الهيدر */
#tc-nav-panel .tc-primary-menu .sub-menu { list-style: none; margin: 0; padding: 0 0 12px; padding-inline-start: 26px; }
#tc-nav-panel .tc-primary-menu .sub-menu li { border: 0; }
#tc-nav-panel .tc-primary-menu .sub-menu a { position: relative; padding-block: 8px; padding-inline-start: 20px; font-size: .92em; opacity: .78; }
#tc-nav-panel .tc-primary-menu .sub-menu a::before { content: ""; position: absolute; inset-inline-start: 0; top: 50%; width: 9px; height: 2px; background: #d7261d; }
#tc-nav-panel .tc-primary-menu .sub-menu a:hover { opacity: 1; }
.dz-legal h2[id] { scroll-margin-top: 130px; }


/* =========================================================================
   السيرش: لوحة بحث أنيقة (حقل كبير، زر داكن، تصفح سريع، نتايج بحث حي)
   ========================================================================= */
#masthead:has(#tc-search-toggle[aria-expanded="true"]) .tc-search-panel { max-height: 620px; overflow: visible; background: #f5f1ed; border-bottom: 1px solid #e3d9c5; box-shadow: 0 28px 50px -26px rgba(34, 30, 27, .38); }
#masthead:has(#tc-search-toggle[aria-expanded="true"]) .tc-search-panel__inner { animation: dz-rise .5s cubic-bezier(.2, .7, .2, 1) backwards; }
#tc-search-panel .tc-search-panel__inner { max-width: 800px; padding: 30px 20px 26px; }
#tc-search-panel .search-form { display: flex; align-items: center; gap: 12px; margin: 0; width: 100%; }
#tc-search-panel .search-form label { position: relative; flex: 1; display: block; margin: 0; width: auto; }
#tc-search-panel .search-field {
	width: 100%; height: 60px; padding: 0 22px; padding-inline-start: 60px;
	border: 1.5px solid #d9d1c8; border-radius: 999px; background-color: #fff;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%23756c64' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='M16 16l5 5'/%3E%3C/svg%3E");
	background-repeat: no-repeat; background-position: right 22px center;
	font: 500 1.05rem 'Cairo', 'Tahoma', sans-serif; color: #221e1b; transition: border-color .2s ease, box-shadow .2s ease;
}
#tc-search-panel .search-field::placeholder { color: #9a9088; opacity: 1; font-weight: 400; }
#tc-search-panel .search-field:focus { outline: 0; border-color: #221e1b; box-shadow: 0 0 0 5px rgba(215, 38, 29, .12); }
#tc-search-panel .search-submit {
	height: 60px; padding: 0 34px; border: 0; border-radius: 999px; background: #221e1b; color: #fff;
	font: 700 1rem 'Cairo', 'Tahoma', sans-serif; cursor: pointer; transition: background .2s ease, transform .2s ease;
}
#tc-search-panel .search-submit:hover { background: #d7261d; }
#tc-search-panel .search-submit:active { transform: scale(.97); }

/* تصفح سريع (أقسام حقيقية) */
.dz-search-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 18px 6px 0; }
.dz-search-chips > span { font: 500 .88rem 'Cairo', 'Tahoma', sans-serif; color: #756c64; }
.dz-search-chips a { padding: 7px 17px; border: 1px solid #e3d9c5; border-radius: 999px; background: #fff; color: #221e1b; font: 600 .9rem 'Cairo', 'Tahoma', sans-serif; text-decoration: none; transition: background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease; }
.dz-search-chips a:hover { background: #221e1b; border-color: #221e1b; color: #fff; transform: translateY(-2px); }

/* نتايج البحث الحي */
#tc-live-search-results:empty { display: none; margin: 0; }
#tc-live-search-results { width: 100%; margin-top: 16px; }
#tc-live-search-results.tc-live-search-results { background: #fff; border: 1px solid #ebe3d8; border-radius: 22px; box-shadow: 0 22px 44px -20px rgba(34, 30, 27, .28); overflow: hidden; }
#tc-live-search-results .tc-search-items { max-height: 360px; overflow-y: auto; }
#tc-live-search-results .tc-search-item { display: flex; align-items: center; gap: 16px; padding: 12px 18px; border-bottom: 1px solid #f1ece4; color: #221e1b; text-decoration: none; transition: background .2s ease; }
#tc-live-search-results .tc-search-item:last-child { border-bottom: 0; }
#tc-live-search-results .tc-search-item:hover { background: #faf6f0; }
#tc-live-search-results .tc-search-item__img { flex: none; width: 60px; height: 60px; border-radius: 14px; object-fit: cover; background: #ebe4dc; }
#tc-live-search-results .tc-search-item__title { font: 600 .98rem / 1.55 'Cairo', 'Tahoma', sans-serif; }
#tc-live-search-results .tc-search-item__price { margin-top: 2px; font: 700 .92rem 'Cairo', 'Tahoma', sans-serif; color: #d7261d; }

@media (max-width: 560px) {
	#tc-search-panel .tc-search-panel__inner { padding: 22px 14px 20px; }
	#tc-search-panel .search-form { gap: 8px; }
	#tc-search-panel .search-field { height: 52px; padding-inline-start: 50px; font-size: 1rem; background-position: right 17px center; }
	#tc-search-panel .search-submit { height: 52px; padding: 0 20px; }
	#tc-live-search-results .tc-search-item { gap: 12px; padding: 10px 12px; }
	#tc-live-search-results .tc-search-item__img { width: 52px; height: 52px; }
}
@media (prefers-reduced-motion: reduce) {
	#masthead:has(#tc-search-toggle[aria-expanded="true"]) .tc-search-panel__inner { animation: none; }
	.dz-search-chips a:hover { transform: none; }
}


/* السيرش: تثبيت التخطيط (الثيم كان حاطط max-width:420px على الفورم وحاوية اللوحة صف أفقي) */
#tc-search-panel .tc-search-panel__inner { display: flex; flex-direction: column; align-items: stretch; }
#tc-search-panel .search-form { max-width: none; width: 100%; }


/* =========================================================================
   سحر: تفاعل مع المؤشر والتمرير (زغب قطن حي، ضوء، ميلان ثلاثي الأبعاد، خيط مخيّط، كلمات)
   ========================================================================= */
.dz-home { overflow-x: clip; }

/* ---- خيط أحمر مخيّط بيتقدّم مع التمرير (كل الصفحات) ---- */
.dz-thread { position: fixed; top: 0; inset-inline: 0; height: 3px; z-index: 9998; pointer-events: none; }
.dz-thread i { display: block; height: 100%; transform-origin: 100% 50%; transform: scaleX(0); background: repeating-linear-gradient(90deg, #d7261d 0 10px, transparent 10px 15px); filter: drop-shadow(0 0 4px rgba(215, 38, 29, .5)); }

/* ---- الهيرو: زغب حي (Canvas) + ضوء يتبع المؤشر ---- */
.dz-fluff { display: none; }
.dz-fluffcv { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.dz-glow { position: absolute; inset: 0; z-index: 1; pointer-events: none; opacity: 0; transition: opacity .5s ease; mix-blend-mode: soft-light;
	background: radial-gradient(circle 340px at var(--gx, 50%) var(--gy, 50%), rgba(255, 232, 196, .85), rgba(255, 232, 196, 0) 70%); }
.dz-hero.is-hot .dz-glow { opacity: 1; }

/* لمعة نحاسية بتعدّي على "قطن 100%" */
.dz-hero h1 strong { color: transparent; background: linear-gradient(100deg, #221e1b 0%, #221e1b 42%, #c58a4e 50%, #221e1b 58%, #221e1b 100%) 120% 0 / 260% 100% no-repeat; -webkit-background-clip: text; background-clip: text; animation: dz-sheen 7s ease-in-out 2.6s infinite; }
@keyframes dz-sheen { 0%, 55% { background-position: 120% 0; } 100% { background-position: -120% 0; } }

/* ---- عناوين الأقسام بتظهر كلمة كلمة ---- */
.dz-words { display: inline; }
.dz-w { display: inline-block; }
.dz-js .dz-w { opacity: 0; transform: translateY(.55em); }
.dz-js .is-in .dz-w { opacity: 1; transform: none; animation: dz-wordin .8s cubic-bezier(.2, .7, .2, 1) calc(var(--wi, 0) * 90ms + 150ms) backwards; }
@keyframes dz-wordin { from { opacity: 0; transform: translateY(.55em); } to { opacity: 1; transform: none; } }

/* ---- ميلان ثلاثي الأبعاد + لمعة ضوء تحت الإصبع (كروت المنتجات وبطاقات الالتزام) ---- */
.dz-card:hover { transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) translateY(-7px); transition: transform .12s ease-out, box-shadow .35s ease, background .35s ease; }
.dz-pledge { position: relative; }
.dz-pledge:hover { transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) translateY(-4px); transition: transform .12s ease-out, box-shadow .35s ease; }
.dz-card::after, .dz-pledge::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; mix-blend-mode: soft-light; transition: opacity .3s ease;
	background: radial-gradient(circle at var(--mx, 50%) var(--my, 50%), rgba(255, 255, 255, .95), rgba(255, 255, 255, 0) 55%); }
.dz-card:hover::after, .dz-pledge:hover::after { opacity: .85; }

/* ---- بلاطات الأقسام بتطفو بهدوء ---- */
.dz-cat__media { animation: dz-bob 7s ease-in-out infinite; }
.dz-cat:nth-child(2) .dz-cat__media { animation-delay: -1.8s; }
.dz-cat:nth-child(3) .dz-cat__media { animation-delay: -3.6s; }
.dz-cat:nth-child(4) .dz-cat__media { animation-delay: -5.4s; }
.dz-cat:hover .dz-cat__media { animation-play-state: paused; }
@keyframes dz-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
.dz-cat__num { transition: transform .35s cubic-bezier(.3, 1.6, .5, 1), background .25s ease, color .25s ease; }
.dz-cat:hover .dz-cat__num { transform: scale(1.2) rotate(-8deg); background: #d7261d; color: #fff; }

/* ---- زر التسوق مغناطيسي ---- */
.dz-cta { transition: background .2s ease, transform .25s cubic-bezier(.2, .7, .2, 1); }
.dz-cta:hover { transform: translate(var(--tx, 0px), var(--ty, 0px)); }

/* ---- بقع ضوء بتتنفس في الخلفية ---- */
.dz-best, .dz-story { isolation: isolate; }
.dz-story { position: relative; }
.dz-best::before { content: ""; position: absolute; z-index: -1; inset-inline-end: -6%; top: -4%; width: min(520px, 60vw); aspect-ratio: 1; border-radius: 50%; pointer-events: none;
	background: radial-gradient(circle, rgba(215, 38, 29, .075), transparent 66%); animation: dz-drift 16s ease-in-out infinite alternate; }
.dz-story::before { content: ""; position: absolute; z-index: -1; inset-inline-start: -8%; bottom: 4%; width: min(560px, 64vw); aspect-ratio: 1; border-radius: 50%; pointer-events: none;
	background: radial-gradient(circle, rgba(233, 184, 179, .24), transparent 66%); animation: dz-drift 18s ease-in-out infinite alternate-reverse; }
@keyframes dz-drift { from { transform: translate(0, 0) scale(1); } to { transform: translate(-40px, 30px) scale(1.15); } }

@media (prefers-reduced-motion: reduce) {
	.dz-hero h1 strong { animation: none; color: var(--dz-ink, #221e1b); background: none; -webkit-background-clip: border-box; background-clip: border-box; }
	.dz-cat__media, .dz-best::before, .dz-story::before { animation: none; }
	.dz-js .dz-w { opacity: 1; transform: none; }
	.dz-js .is-in .dz-w { animation: none; }
	.dz-card:hover, .dz-pledge:hover { transform: none; }
	.dz-cta:hover { transform: none; }
	.dz-glow, .dz-fluffcv, .dz-thread { display: none; }
}


/* إصلاح اللمعة النحاسية: الحركة كانت بتزحلق الخلفية لبره حدود العنصر فالنص كان بيختفي (120% → -120%).
   دلوقتي الحركة 100% → 0% (جوه نطاق تغطية الخلفية)، ولون النص العادي كبديل لو المتصفح ما بيدعمش background-clip:text. */
.dz-hero h1 strong { color: #221e1b; }
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
	.dz-hero h1 strong { color: transparent; background: linear-gradient(100deg, #221e1b 0%, #221e1b 42%, #c58a4e 50%, #221e1b 58%, #221e1b 100%) 100% 0 / 260% 100% no-repeat; -webkit-background-clip: text; background-clip: text; animation: dz-sheen 7s ease-in-out 2.6s infinite; }
}
@keyframes dz-sheen { 0%, 55% { background-position: 100% 0; } 100% { background-position: 0% 0; } }
@media (prefers-reduced-motion: reduce) { .dz-hero h1 strong { color: #221e1b; background: none; animation: none; } }


/* =========================================================================
   سحر للموبايل والتابلت: لمس، شريط تمرير للأكثر مبيعاً، موجات، وميض، تنفّس
   ========================================================================= */

/* ---- موجة (Ripple) تحت الصباع على الأزرار ---- */
.dz-btn, .dz-cta { position: relative; overflow: hidden; }
.dz-ripple { position: absolute; border-radius: 50%; background: currentColor; opacity: .2; transform: scale(0); pointer-events: none; animation: dz-ripple .65s ease-out forwards; }
@keyframes dz-ripple { to { transform: scale(1); opacity: 0; } }

/* ---- وميض ضوء لما تلمس كارت ---- */
.dz-card.is-touch::after, .dz-pledge.is-touch::after { opacity: .9; }

/* ---- أجهزة اللمس فقط: من غير hover عالق، وضغطة خفيفة، والصورة بتتنفس ---- */
@media (hover: none) {
	.dz-card:hover { transform: scale(var(--cs, 1)); box-shadow: none; background: var(--dz-card); }
	.dz-card:hover .dz-card__img img { transform: none; }
	.dz-pledge:hover { transform: none; box-shadow: none; }
	.dz-card:active { transform: scale(calc(var(--cs, 1) * .975)); transition: transform .12s ease; }
	.dz-cat:active .dz-cat__media { transform: scale(.96); }
	.dz-cta:active { transform: scale(.97); }
	.dz-hero__photo i { animation: dz-fade 1.4s ease backwards, dz-breathe 22s ease-in-out 1.4s infinite alternate; }
}
@keyframes dz-breathe { from { transform: scaleX(-1) scale(1); } to { transform: scaleX(-1) scale(1.07); } }

/* ---- موبايل + تابلت: الأكثر مبيعاً شريط تمرير أفقي (Swipe) ---- */
.dz-dots { display: none; }
@media (max-width: 900px) {
	.dz-grid { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; scrollbar-width: none;
		margin-inline: calc(var(--dz-pad) * -1); padding: 10px var(--dz-pad) 24px; }
	.dz-grid::-webkit-scrollbar { display: none; }
	.dz-card { flex: 0 0 min(72%, 330px); scroll-snap-align: center; transform: scale(var(--cs, 1)); transition: transform .25s ease; }
	.dz-dots { display: flex; justify-content: center; align-items: center; gap: 8px; margin-top: -6px; }
	.dz-dots button { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 999px; background: #cfc6bb; cursor: pointer; transition: width .3s cubic-bezier(.3, 1.4, .5, 1), background .3s ease; }
	.dz-dots button.is-on { width: 26px; background: #d7261d; }
}
@media (min-width: 600px) and (max-width: 900px) {
	.dz-card { flex-basis: min(44%, 300px); }
}

@media (prefers-reduced-motion: reduce) {
	.dz-ripple { display: none; }
	.dz-hero__photo i { animation: none; }
	.dz-dots button { transition: none; }
}


/* شريط الأكثر مبيعاً: حشوة جانبية بحيث أي كارت (حتى الأول والأخير) يقدر يتوسّط الشاشة */
@media (max-width: 900px) {
	.dz-grid { --dz-cw: min(72vw, 330px); padding-inline: calc((100vw - var(--dz-cw)) / 2); }
	.dz-card { flex-basis: var(--dz-cw); }
}
@media (min-width: 600px) and (max-width: 900px) {
	.dz-grid { --dz-cw: min(44vw, 300px); }
}


/* الأقسام أقرب لأعلى الصفحة (تقليل المسافة بعد الهيرو) */
.dz-cats { padding-top: clamp(6px, 1vw, 14px); }
@media (max-width: 600px) { .dz-cats { padding-top: 4px; } }

/* ==========================================================================
   TryCotton — Custom Product Detail Page (PDP)
   Matches Client Mockup: Mobile-First with Desktop & Tablet Adaptation
   ========================================================================== */

.tc-pdp {
	background: #fbf9f5;
	color: #221e1b;
	font-family: var(--dz-sans, 'Cairo', sans-serif);
	min-height: 80vh;
	padding-top: clamp(10px, 2vw, 20px);
	padding-bottom: 95px; /* Space for mobile sticky bottom bar */
}

.tc-pdp__container {
	max-width: 1080px;
	margin-inline: auto;
	padding-inline: clamp(14px, 3vw, 30px);
}

/* Breadcrumb */
.tc-pdp__breadcrumb {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-bottom: 12px;
	font-size: 13px;
	color: #8c827a;
}
.tc-pdp__breadcrumb a {
	color: #8c827a;
	text-decoration: none;
	transition: color .2s ease;
}
.tc-pdp__breadcrumb a:hover {
	color: #1a1a1a;
}
.tc-pdp__sep {
	opacity: .5;
	font-size: 11px;
}

/* Grid Layout */
.tc-pdp__grid {
	display: flex;
	flex-direction: column;
	gap: 18px;
}
@media (min-width: 860px) {
	.tc-pdp__grid {
		display: grid;
		grid-template-columns: 1.05fr 1fr;
		gap: clamp(36px, 4.5vw, 64px);
		align-items: start;
	}
	.tc-pdp__gallery {
		position: sticky;
		top: 90px;
	}
}

/* Gallery */
.tc-pdp__main-photo {
	position: relative;
	width: 100%;
	aspect-ratio: 1;
	background: #fdfbf7;
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
	display: flex;
	align-items: center;
	justify-content: center;
}
.tc-pdp__main-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: opacity .25s ease;
}
.tc-pdp__counter {
	position: absolute;
	bottom: 14px;
	inset-inline-start: 14px;
	background: rgba(255, 255, 255, 0.88);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	padding: 4px 12px;
	border-radius: 20px;
	font-size: 12px;
	font-weight: 700;
	color: #1a1a1a;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
	pointer-events: none;
}
.tc-pdp__thumbs {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 10px;
	margin-top: 10px;
}
.tc-pdp__thumb {
	position: relative;
	aspect-ratio: 1;
	border-radius: 10px;
	overflow: hidden;
	background: #f7f3ee;
	border: 2px solid transparent;
	padding: 0;
	margin: 0;
	cursor: pointer;
	transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.tc-pdp__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.tc-pdp__thumb:hover {
	transform: translateY(-2px);
}
.tc-pdp__thumb.is-active {
	border-color: #1a1a1a !important;
	box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
}

/* Info & Typography */
.tc-pdp__title {
	margin: 0 0 6px;
	font-size: clamp(1.35rem, 2.6vw, 1.85rem);
	font-weight: 700;
	line-height: 1.3;
	color: #1a1a1a;
	font-family: var(--dz-sans, 'Cairo', sans-serif);
}
.tc-pdp__subtitle {
	font-size: 13.5px;
	color: #787068;
	margin-bottom: 8px;
	font-weight: 500;
}
.tc-pdp__price {
	font-size: clamp(1.45rem, 2.8vw, 1.95rem);
	font-weight: 800;
	color: #1a1a1a;
	margin-bottom: 4px;
	display: flex;
	align-items: baseline;
	gap: 8px;
}
.tc-pdp__price del {
	font-size: 0.75em;
	opacity: .5;
	font-weight: 400;
}
.tc-pdp__price ins {
	text-decoration: none;
}
.tc-pdp__color-note {
	font-size: 12.5px;
	color: #8c827a;
	margin-bottom: 20px;
}

/* Hide WooCommerce native clunky wrappers inside PDP */
.tc-pdp .variations_form table.variations,
.tc-pdp .variations_form .single_variation_wrap,
.tc-pdp .variations_form .tc-min-qty-badge,
.tc-pdp .variations_form .tc-size-guide-trigger-wrap,
.tc-pdp .variations_form .quantity,
.tc-pdp .woocommerce-tabs,
.tc-pdp .product_meta,
.tc-pdp .tc-page-header {
	display: none !important;
}

/* Custom Controls */
.tc-pdp__custom-controls {
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.tc-pdp__row-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 8px;
}
.tc-pdp__label {
	font-size: 14.5px;
	font-weight: 700;
	color: #1a1a1a;
}
.tc-pdp__guide-btn {
	background: none;
	border: 0;
	padding: 0;
	font-size: 13px;
	font-weight: 600;
	color: #4a423b;
	text-decoration: underline;
	cursor: pointer;
	font-family: inherit;
	transition: color .2s ease;
}
.tc-pdp__guide-btn:hover {
	color: #d7261d;
}

/* Sizes Row */
.tc-pdp__sizes-row {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}
.tc-pdp__selected-val {
	font-size: 13.5px;
	font-weight: 700;
	color: #24201d;
}
.tc-pdp__size-btn {
	flex: 1;
	min-width: 52px;
	height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #ffffff;
	border: 1.5px solid #ded8cf;
	border-radius: 8px;
	font-size: 14px;
	font-weight: 700;
	color: #24201d;
	cursor: pointer;
	transition: all .2s ease;
	font-family: inherit;
}
.tc-pdp__size-btn:hover {
	border-color: #24201d;
}
.tc-pdp__size-btn.is-active {
	background: #24201d !important;
	color: #ffffff !important;
	border-color: #24201d !important;
	box-shadow: 0 3px 8px rgba(36, 32, 29, 0.18);
}

/* علامة (يجب الاختيار) للمقاس والكمية */
.tc-pdp__req-tag {
	font-size: 0.74rem;
	font-weight: 600;
	color: #b03a2e;
	background: #fdf2f2;
	border: 1px solid #fadbd8;
	padding: 2px 8px;
	border-radius: 6px;
	margin-inline-start: 6px;
	display: inline-block;
	vertical-align: middle;
	letter-spacing: -0.2px;
}

/* تنبيه عند عدم اختيار المقاس */
.tc-pdp__size-section.has-error .tc-pdp__sizes-row {
	border: 1.5px solid #e74c3c !important;
	background: #fff5f5 !important;
	border-radius: 10px;
	padding: 6px;
	animation: tc-pdp-shake 0.45s ease;
}

@keyframes tc-pdp-shake {
	0%, 100% { transform: translateX(0); }
	20%, 60% { transform: translateX(-6px); }
	40%, 80% { transform: translateX(6px); }
}

.tc-pdp__size-msg {
	margin-top: 10px;
	padding: 9px 14px;
	background: #fff5f5;
	border: 1px solid #f5c6cb;
	border-inline-start: 4px solid #e74c3c;
	color: #721c24;
	border-radius: 6px;
	font-size: 0.86rem;
	font-weight: 600;
	line-height: 1.4;
	animation: tc-pdp-fadein 0.25s ease;
}

@keyframes tc-pdp-fadein {
	from { opacity: 0; transform: translateY(-4px); }
	to { opacity: 1; transform: translateY(0); }
}

/* Qty Section */
.tc-pdp__total-pcs-label {
	font-size: 13px;
	color: #787068;
}
.tc-pdp__qty-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.tc-pdp__qty-box {
	display: inline-flex;
	align-items: center;
	background: #ffffff;
	border: 1.5px solid #ded8cf;
	border-radius: 8px;
	height: 44px;
	overflow: hidden;
}
.tc-pdp__qty-btn {
	width: 42px;
	height: 100%;
	display: grid;
	place-items: center;
	background: none;
	border: 0;
	font-size: 20px;
	font-weight: 600;
	color: #24201d;
	cursor: pointer;
	user-select: none;
	transition: background .2s ease;
}
.tc-pdp__qty-btn:hover {
	background: #f5f1eb;
}
.tc-pdp__qty-num {
	min-width: 44px;
	text-align: center;
	font-size: 15px;
	font-weight: 700;
	color: #24201d;
}
.tc-pdp__total-pcs-val {
	font-size: 16px;
	font-weight: 800;
	color: #1a1a1a;
}

/* Free Shipping Pill */
.tc-pdp__shipping-pill {
	background: #ece7e0;
	border-radius: 8px;
	padding: 12px 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	font-size: 14px;
	font-weight: 700;
	color: #2c2520;
}

/* Action Buttons */
.tc-pdp__actions {
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.tc-pdp__action-btn {
	width: 100%;
	height: 48px;
	border-radius: 8px;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: inherit;
	transition: all .2s ease;
}
.tc-pdp__action-btn--primary {
	background: #24201d;
	color: #ffffff;
	border: 0;
}
.tc-pdp__action-btn--primary:hover {
	background: #3b3530;
	box-shadow: 0 4px 12px rgba(36, 32, 29, 0.15);
}
.tc-pdp__action-btn--secondary {
	background: #ffffff;
	color: #24201d;
	border: 1.5px solid #24201d;
}
.tc-pdp__action-btn--secondary:hover {
	background: #24201d;
	color: #ffffff;
}

/* Accordions */
.tc-pdp__accordions {
	margin-top: 16px;
	border-top: 1px solid #ded8cf;
}
.tc-pdp__accordion {
	border-bottom: 1px solid #ded8cf;
}
.tc-pdp__acc-head {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 15px 4px;
	background: none;
	border: 0;
	cursor: pointer;
	font-size: 14.5px;
	font-weight: 700;
	color: #1a1a1a;
	font-family: inherit;
	text-align: right;
}
.tc-pdp__chevron {
	transition: transform .25s ease;
	color: #787068;
}
.tc-pdp__accordion.is-open .tc-pdp__chevron {
	transform: rotate(180deg);
}
.tc-pdp__acc-body {
	display: none;
	padding: 0 4px 16px;
	font-size: 13.5px;
	line-height: 1.7;
	color: #5a524a;
}
.tc-pdp__accordion.is-open .tc-pdp__acc-body {
	display: block;
}

/* Sticky Bottom Bar on Mobile */
.tc-pdp__sticky-bar {
	position: fixed;
	bottom: 0;
	inset-inline: 0;
	background: #ffffff;
	z-index: 999;
	box-shadow: 0 -4px 18px rgba(0, 0, 0, 0.08);
	padding: 10px 16px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-top: 1px solid #ece7e0;
	transition: transform .3s ease;
}
.tc-pdp__sticky-price {
	font-size: 17px;
	font-weight: 800;
	color: #1a1a1a;
}
.tc-pdp__sticky-btn {
	height: 42px;
	padding: 0 24px;
	background: #24201d;
	color: #ffffff;
	border: 0;
	border-radius: 8px;
	font-size: 14px;
	font-weight: 700;
	cursor: pointer;
	font-family: inherit;
	transition: background .2s ease;
}
.tc-pdp__sticky-btn:hover {
	background: #3b3530;
}
@media (min-width: 860px) {
	.tc-pdp__sticky-bar {
		display: none !important;
	}
	.tc-pdp {
		padding-bottom: 40px;
	}
}

/* =========================================================================
   TRY Mobile Off-Canvas Menu Drawer (Right-side panel)
   Exact match to screenshot design
   ========================================================================= */
.tc-nav-panel {
	padding: 0 !important;
	display: flex !important;
	flex-direction: column !important;
	background: #ffffff !important;
	box-shadow: -8px 0 36px rgba(0, 0, 0, 0.16) !important;
	z-index: 99999 !important;
	overflow-x: hidden !important;
	overflow-y: auto !important;
	-webkit-overflow-scrolling: touch;
}

[dir="rtl"] .tc-nav-panel {
	inset: 0 0 0 auto !important;
	width: 330px !important;
	max-width: 82vw !important;
	transform: translateX(105%) !important;
	transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

[dir="rtl"] .tc-nav-panel.is-open {
	transform: translateX(0) !important;
}

[dir="ltr"] .tc-nav-panel {
	inset: 0 auto 0 0 !important;
	width: 330px !important;
	max-width: 82vw !important;
	transform: translateX(-105%) !important;
	transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

[dir="ltr"] .tc-nav-panel.is-open {
	transform: translateX(0) !important;
}

/* Header: Logo on Right, Close on Left in RTL */
.tc-nav-panel__header {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	padding: 24px 22px 18px !important;
	background: #ffffff !important;
	border-bottom: 1px solid #f0f0f0 !important;
	flex-shrink: 0 !important;
}

[dir="rtl"] .tc-nav-panel__brand {
	order: 1;
}
[dir="rtl"] .tc-nav-panel__close {
	order: 2;
	margin-inline-start: 0 !important;
}

[dir="ltr"] .tc-nav-panel__close {
	order: 1;
	margin-inline-start: 0 !important;
}
[dir="ltr"] .tc-nav-panel__brand {
	order: 2;
}

.tc-nav-panel__brand {
	display: inline-flex !important;
	align-items: baseline !important;
	text-decoration: none !important;
	color: #111111 !important;
	font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
	font-weight: 800 !important;
	font-size: 26px !important;
	letter-spacing: 0.14em !important;
	line-height: 1 !important;
	transition: opacity .2s;
}

.tc-nav-panel__brand:hover {
	opacity: 0.85;
}

.tc-nav-panel__reg {
	font-size: 11px !important;
	font-weight: 700 !important;
	vertical-align: super !important;
	margin-inline-start: 2px !important;
	color: #111111 !important;
}

.tc-nav-panel__close {
	background: transparent !important;
	border: none !important;
	padding: 6px !important;
	margin: -6px !important;
	cursor: pointer !important;
	color: #1a1a1a !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	border-radius: 50% !important;
	width: 38px !important;
	height: 38px !important;
	flex-shrink: 0 !important;
	transition: background .2s, opacity .2s !important;
}

.tc-nav-panel__close:hover {
	background: #f5f5f5 !important;
}

.tc-nav-panel__close svg {
	width: 22px !important;
	height: 22px !important;
	stroke: #111111 !important;
	stroke-width: 1.8 !important;
}

/* Body & Menu List */
.tc-nav-panel__body {
	flex: 1 1 auto !important;
	display: flex !important;
	flex-direction: column !important;
	background: #ffffff !important;
}

.tc-nav-menu-list {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

.tc-nav-item-wrapper {
	border-bottom: 1px solid #f0f0f0 !important;
	background: #ffffff !important;
	transition: background .2s;
}

.tc-nav-row {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	width: 100% !important;
	cursor: pointer;
	user-select: none;
}

.tc-nav-row:hover {
	background: #fafafa !important;
}

.tc-nav-link {
	display: flex !important;
	align-items: center !important;
	flex: 1 1 auto !important;
	padding: 17px 22px !important;
	font-family: 'Cairo', sans-serif !important;
	font-size: 16.5px !important;
	font-weight: 500 !important;
	color: #1a1a1a !important;
	text-decoration: none !important;
	text-align: right !important;
	line-height: 1.4 !important;
	transition: color .2s !important;
}

.tc-nav-link:hover {
	color: #000000 !important;
}

.tc-nav-link--shop-all {
	font-weight: 600 !important;
	color: #111111 !important;
}

/* Chevron Button for Expandable Items */
.tc-nav-chevron-btn {
	background: transparent !important;
	border: none !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 48px !important;
	height: 54px !important;
	padding: 0 !important;
	color: #444444 !important;
	cursor: pointer !important;
	flex-shrink: 0 !important;
	transition: color .2s !important;
}

.tc-nav-chevron {
	width: 18px !important;
	height: 18px !important;
	stroke: currentColor !important;
	stroke-width: 2 !important;
	transition: transform .25s cubic-bezier(0.2, 0.8, 0.2, 1) !important;
}

/* In RTL: chevron points left `<`. Rotating -90deg turns it into DOWN `⌵` */
[dir="rtl"] .tc-nav-item-wrapper.is-expanded .tc-nav-chevron {
	transform: rotate(-90deg) !important;
}

[dir="ltr"] .tc-nav-item-wrapper.is-expanded .tc-nav-chevron {
	transform: rotate(90deg) !important;
}

/* Submenu / Accordion */
.tc-nav-sublist {
	list-style: none !important;
	margin: 0 !important;
	padding: 6px 0 !important;
	background: #fbfbfb !important;
	border-top: 1px solid #f0f0f0 !important;
	display: none !important;
}

.tc-nav-item-wrapper.is-expanded > .tc-nav-sublist {
	display: block !important;
	animation: tcNavSubmenuSlide .2s ease-out !important;
}

@keyframes tcNavSubmenuSlide {
	from { opacity: 0; transform: translateY(-4px); }
	to { opacity: 1; transform: translateY(0); }
}

.tc-nav-sublink {
	display: block !important;
	padding: 13px 36px 13px 22px !important;
	font-family: 'Cairo', sans-serif !important;
	font-size: 15px !important;
	font-weight: 500 !important;
	color: #4a4a4a !important;
	text-decoration: none !important;
	text-align: right !important;
	border-bottom: 1px solid rgba(0, 0, 0, 0.03) !important;
	transition: color .2s, background .2s, padding-inline-start .2s !important;
}

.tc-nav-sublink:last-child {
	border-bottom: none !important;
}

.tc-nav-sublink:hover {
	color: #d7261d !important;
	background: #f4f4f4 !important;
	padding-inline-start: 40px !important;
}

/* Section Divider */
.tc-nav-divider {
	height: 8px !important;
	background: #f7f7f7 !important;
	border-top: 1px solid #ebebeb !important;
	border-bottom: 1px solid #ebebeb !important;
	margin: 0 !important;
	flex-shrink: 0 !important;
}

/* Footer / Language Selector */
.tc-nav-panel__footer {
	margin-top: auto !important;
	padding: 22px 22px !important;
	border-top: 1px solid #f0f0f0 !important;
	background: #ffffff !important;
	flex-shrink: 0 !important;
}

.tc-nav-lang-btn {
	display: inline-flex !important;
	align-items: center !important;
	gap: 12px !important;
	color: #1a1a1a !important;
	text-decoration: none !important;
	font-family: 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif !important;
	font-size: 15.5px !important;
	font-weight: 500 !important;
	transition: color .2s !important;
}

.tc-nav-lang-btn:hover {
	color: #d7261d !important;
}

.tc-nav-lang-btn .tc-globe-icon {
	width: 20px !important;
	height: 20px !important;
	stroke: currentColor !important;
	stroke-width: 1.6 !important;
	flex-shrink: 0 !important;
}

/* =========================================================================
   صفحة المتجر والأقسام — Shop Categories Showcase & Quick Filter Tabs
   ========================================================================= */
.tc-shop-cats-section {
	margin-bottom: 30px;
	padding-bottom: 24px;
	border-bottom: 1px solid #ebe5dc;
}

.tc-shop-cats-circles {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: clamp(14px, 3.2vw, 38px);
	max-width: 820px;
	margin-inline: auto;
	padding-inline: 10px;
}

.tc-shop-cat-circle {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	text-decoration: none;
	color: #24201d;
	transition: transform 0.25s ease;
}

.tc-shop-cat-circle:hover {
	transform: translateY(-4px);
}

.tc-shop-cat-circle__media {
	position: relative;
	display: block;
	width: 100%;
	max-width: clamp(90px, 13vw, 140px);
}

.tc-shop-cat-circle__img {
	display: block;
	width: 100%;
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	overflow: hidden;
	background: #efe8df;
	box-shadow: 0 4px 14px rgba(40, 30, 20, 0.08);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.tc-shop-cat-circle__img img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.35s ease;
}

.tc-shop-cat-circle:hover .tc-shop-cat-circle__img {
	transform: scale(1.04);
	box-shadow: 0 8px 22px rgba(40, 30, 20, 0.14);
}

.tc-shop-cat-circle__name {
	margin-top: 10px;
	font-family: 'Cairo', var(--dz-sans), sans-serif;
	font-size: clamp(0.95rem, 1.8vw, 1.2rem);
	font-weight: 700;
	color: #24201d;
	line-height: 1.3;
	transition: color 0.2s ease;
}

.tc-shop-cat-circle:hover .tc-shop-cat-circle__name {
	color: #9c6c4c;
}

/* Quick Tabs Bar */
.tc-shop-tabs-bar {
	display: flex;
	justify-content: center;
	margin-bottom: 28px;
	width: 100%;
}

.tc-shop-tabs-scroll {
	display: flex;
	gap: 10px;
	overflow-x: auto;
	padding: 4px 2px 8px;
	max-width: 100%;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
}

.tc-shop-tabs-scroll::-webkit-scrollbar {
	display: none;
}

.tc-shop-tab {
	display: inline-flex;
	align-items: center;
	padding: 9px 20px;
	background: #ffffff;
	border: 1px solid #ded6cc;
	border-radius: 30px;
	font-family: 'Cairo', sans-serif;
	font-size: 14.5px;
	font-weight: 600;
	color: #4a4036;
	text-decoration: none;
	white-space: nowrap;
	transition: all 0.2s ease;
	cursor: pointer;
}

.tc-shop-tab:hover {
	border-color: #24201d;
	color: #24201d;
	background: #faf7f2;
}

.tc-shop-tab.is-active {
	background: #24201d;
	color: #ffffff;
	border-color: #24201d;
	box-shadow: 0 4px 14px rgba(36, 32, 29, 0.22);
}

.tc-category-banner-note {
	background: #f7f4ee;
	border-radius: 12px;
	padding: 12px 18px;
	margin-bottom: 24px;
	text-align: center;
	font-size: 15px;
	color: #5a5047;
	border: 1px solid #e8e1d5;
}

.tc-category-banner-note strong {
	color: #24201d;
	font-weight: 700;
}

@media (max-width: 768px) {
	.tc-shop-cats-circles {
		grid-template-columns: repeat(2, 1fr) !important;
		gap: 20px 14px !important;
		max-width: 360px;
		margin-inline: auto;
	}
	.tc-shop-cat-circle__media {
		max-width: 110px !important;
	}
	.tc-shop-cat-circle__name {
		font-size: 15.5px !important;
		margin-top: 8px !important;
	}
	.tc-shop-tab {
		padding: 7px 15px;
		font-size: 13.5px;
	}
}

@media (max-width: 420px) {
	.tc-shop-cats-circles {
		max-width: 300px;
		gap: 16px 10px !important;
	}
	.tc-shop-cat-circle__media {
		max-width: 95px !important;
	}
	.tc-shop-cat-circle__name {
		font-size: 14.5px !important;
		margin-top: 6px !important;
	}
}

/* =========================================================================
   تعديل الصفحة الرئيسية: رفع الأكثر مبيعاً ونقل شريط المميزات أسفله
   ========================================================================= */
.dz-best {
	padding-top: clamp(16px, 3vw, 32px) !important;
}

.dz-features {
	margin: 0 auto clamp(20px, 3.5vw, 40px) !important;
}

.dz-features__bar {
	display: grid !important;
	grid-template-columns: repeat(4, 1fr) !important;
	padding: 14px 10px !important;
	border-radius: 18px !important;
}

.dz-feature {
	min-width: 0 !important;
}

.dz-feature__txt strong {
	font-size: 0.88rem;
	font-weight: 600;
}

.dz-feature__txt span {
	font-size: 0.74rem;
}

/* تصغير الخط وعرض المميزات بالعرض في صف واحد أفقي للشاشات الصغيرة */
@media (max-width: 768px) {
	.dz-features {
		padding-inline: 10px !important;
		margin: 0 auto clamp(14px, 2.5vw, 24px) !important;
	}
	.dz-features__bar {
		grid-template-columns: repeat(4, 1fr) !important;
		padding: 10px 4px !important;
		border-radius: 14px !important;
		row-gap: 0 !important;
	}
	.dz-feature {
		flex-direction: column !important;
		align-items: center !important;
		justify-content: flex-start !important;
		text-align: center !important;
		gap: 3px !important;
		padding: 4px 2px !important;
		min-width: 0 !important;
	}
	.dz-feature + .dz-feature {
		border-inline-start: 1px solid #d3cbc2 !important;
	}
	.dz-feature:nth-child(even) {
		border-inline-start: 1px solid #d3cbc2 !important;
	}
	.dz-feature .dz-ficon {
		width: clamp(20px, 5.2vw, 26px) !important;
		height: clamp(20px, 5.2vw, 26px) !important;
	}
	.dz-feature__txt {
		align-items: center !important;
		text-align: center !important;
		width: 100% !important;
	}
	.dz-feature__txt strong {
		font-size: clamp(0.6rem, 2.35vw, 0.75rem) !important;
		font-weight: 600 !important;
		line-height: 1.25 !important;
		display: block !important;
		margin: 0 !important;
	}
	.dz-feature__txt span {
		font-size: clamp(0.48rem, 1.8vw, 0.6rem) !important;
		line-height: 1.15 !important;
		display: block !important;
		color: var(--dz-muted) !important;
		margin-top: 1px !important;
	}
}