/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/* ============================================
   DESIGN SYSTEM - COLOR PALETTE & VARIABLES
   ============================================ */
:root {
  --primary: #3338A0;
  --primary-dark: #272B80;
  --primary-light: #4A4FBD;
  --secondary: #C59560;
  --secondary-light: #D4AD80;
  --accent: #FCC61D;
  --accent-dark: #E5B310;
  --bg-light: #F7F7F7;
  --bg-white: #FFFFFF;
  --text-dark: #222222;
  --text-body: #555555;
  --text-light: #888888;
  --border: #E5E5E5;
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, .06);
  --shadow-md: 0 4px 20px rgba(0, 0, 0, .1);
  --shadow-lg: 0 8px 40px rgba(0, 0, 0, .12);
  --radius: 8px;
  --radius-lg: 16px;
  --radius-pill: 50px;
  --transition: .3s cubic-bezier(.4, 0, .2, 1);
  --font-heading: 'Be Vietnam Pro', sans-serif;
  --font-body: 'Be Vietnam Pro', sans-serif;
}

/* ============================================
   GLOBAL OVERRIDES
   ============================================ */
body.home-template {
  font-family: var(--font-body);
  color: var(--text-body);
  overflow-x: hidden;
}

/* ============================================
   TOP ANNOUNCEMENT BAR
   ============================================ */
.hp-announcement {
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
  color: #fff;
  text-align: center;
  padding: 10px 0;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: .3px;
  position: relative;
  z-index: 100;
}

.hp-announcement a {
  color: var(--accent);
  text-decoration: underline;
  font-weight: 700;
}

.hp-announcement a:hover {
  color: #fff;
}

/* ============================================
   USP / TRUST BAR
   ============================================ */
.hp-usp-bar {
  background: var(--bg-white);
  border-bottom: 1px solid var(--border);
  padding: 16px 0;
}

.hp-usp-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

.hp-usp-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 0;
}

.hp-usp-icon {
  width: 44px;
  height: 44px;
  background: var(--bg-light);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary);
  font-size: 20px;
  flex-shrink: 0;
  transition: var(--transition);
}

.hp-usp-item:hover .hp-usp-icon {
  background: var(--primary);
  color: #fff;
  transform: scale(1.1);
}

.hp-usp-text strong {
  display: block;
  font-size: 13px;
  color: var(--text-dark);
  font-weight: 700;
}

.hp-usp-text span {
  font-size: 12px;
  color: var(--text-light);
}

/* ============================================
   HERO SLIDER
   ============================================ */
.hp-hero {
  position: relative;
  overflow: hidden;
  max-width: 1200px;
  margin: 24px auto;
  padding: 0 20px;
}

.hp-hero-slider {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  aspect-ratio: 2.5 / 1;
}

.hp-hero-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity .8s ease;
  background-size: cover;
  background-position: center;
}

.hp-hero-slide.active {
  opacity: 1;
}

.hp-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(51, 56, 160, .75) 0%, rgba(51, 56, 160, .2) 100%);
  display: flex;
  align-items: center;
  padding: 0 60px;
}

.hp-hero-content {
  max-width: 520px;
  color: #fff;
}

.hp-hero-badge {
  display: inline-block;
  background: var(--accent);
  color: var(--text-dark);
  padding: 6px 16px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  margin-bottom: 16px;
  letter-spacing: 1px;
}

.hp-hero-content h1 {
  font-size: 42px;
  font-weight: 800;
  line-height: 1.15;
  margin-bottom: 16px;
  font-family: var(--font-heading);
}

.hp-hero-content p {
  font-size: 16px;
  opacity: .9;
  margin-bottom: 24px;
  line-height: 1.6;
}

.hp-hero-btn {
  display: inline-block;
  background: var(--accent);
  color: var(--text-dark);
  padding: 14px 36px;
  border-radius: var(--radius-pill);
  font-weight: 700;
  font-size: 15px;
  text-decoration: none;
  transition: var(--transition);
  box-shadow: 0 4px 15px rgba(252, 198, 29, .4);
}

.hp-hero-btn:hover {
  background: #fff;
  color: var(--primary);
  transform: translateY(-2px);
  box-shadow: 0 6px 25px rgba(0, 0, 0, .15);
}

.hp-hero-dots {
  display: flex;
  gap: 8px;
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 5;
}

.hp-hero-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .5);
  cursor: pointer;
  transition: var(--transition);
  border: none;
}

.hp-hero-dot.active {
  background: var(--accent);
  width: 28px;
  border-radius: 5px;
}

/* ============================================
   SECTION COMMON
   ============================================ */
.hp-section {
  max-width: 1200px;
  margin: 0 auto;
  padding: 50px 20px;
}

.hp-section-header {
  text-align: center;
  margin-bottom: 36px;
}

.hp-section-header h2 {
  font-size: 28px;
  font-weight: 800;
  color: var(--text-dark);
  font-family: var(--font-heading);
  margin-bottom: 8px;
  position: relative;
  display: inline-block;
}

.hp-section-header h2::after {
  content: '';
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translateX(-50%);
  width: 50px;
  height: 3px;
  background: linear-gradient(90deg, var(--primary), var(--accent));
  border-radius: 2px;
}

.hp-section-header p {
  color: var(--text-light);
  font-size: 15px;
  margin-top: 16px;
}

.hp-section-bg {
  background: var(--bg-light);
}

.hp-section-bg .hp-section {
  padding: 50px 20px;
}

/* ============================================
   CATEGORY GRID (4-col)
   ============================================ */
.hp-categories {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.hp-cat-card {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  aspect-ratio: 3/4;
  cursor: pointer;
  text-decoration: none;
}

/* Shared <img> fill for card / banner thumbnails */
.hp-cat-card img,
.hp-product-img img,
.hp-promo-card img,
.hp-blog-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
}

.hp-cat-card img,
.hp-promo-card img {
  transition-duration: .6s;
}

.hp-cat-card:hover img {
  transform: scale(1.08);
}

.hp-cat-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0, 0, 0, .6) 0%, transparent 60%);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 24px;
  transition: var(--transition);
}

.hp-cat-card:hover .hp-cat-overlay {
  background: linear-gradient(to top, rgba(51, 56, 160, .8) 0%, transparent 70%);
}

.hp-cat-overlay h3 {
  color: #fff;
  font-size: 22px;
  font-weight: 800;
  font-family: var(--font-heading);
  margin-bottom: 4px;
}

.hp-cat-overlay span {
  color: rgba(255, 255, 255, .8);
  font-size: 13px;
}

.hp-cat-overlay .hp-cat-btn {
  display: inline-block;
  margin-top: 12px;
  background: var(--accent);
  color: var(--text-dark);
  padding: 8px 20px;
  border-radius: var(--radius-pill);
  font-size: 13px;
  font-weight: 700;
  opacity: 0;
  transform: translateY(10px);
  transition: var(--transition);
}

.hp-cat-card:hover .hp-cat-btn {
  opacity: 1;
  transform: translateY(0);
}

/* ============================================
   PRODUCT TABS
   ============================================ */
.hp-tabs {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-bottom: 30px;
  flex-wrap: wrap;
}

.hp-tab {
  padding: 10px 24px;
  border-radius: var(--radius-pill);
  border: 2px solid var(--border);
  background: transparent;
  color: var(--text-body);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: var(--transition);
}

.hp-tab:hover {
  border-color: var(--primary);
  color: var(--primary);
}

.hp-tab.active {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
}

/* ============================================
   PRODUCT GRID
   ============================================ */
.hp-products {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.hp-product-card,
.hp-blog-card {
  background: var(--bg-white);
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  transition: var(--transition);
  text-decoration: none;
  color: inherit;
  display: block;
}

.hp-product-card:hover,
.hp-blog-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
}

.hp-product-img {
  position: relative;
  overflow: hidden;
  aspect-ratio: 1;
  background: var(--bg-light);
}

.hp-product-card:hover .hp-product-img img {
  transform: scale(1.06);
}

.hp-product-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  background: #E53935;
  color: #fff;
  padding: 4px 10px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 700;
}

.hp-product-badge.new {
  background: var(--primary);
}

.hp-product-badge.hot {
  background: var(--accent);
  color: var(--text-dark);
}




.hp-product-info {
  padding: 14px;
}

.hp-product-name {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-dark);
  margin-bottom: 8px;
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.hp-product-price {
  display: flex;
  align-items: center;
  gap: 8px;
}

.hp-price-current {
  font-size: 15px;
  font-weight: 800;
  color: #E53935;
}

.hp-price-original {
  font-size: 12px;
  color: var(--text-light);
  text-decoration: line-through;
}

.hp-price-discount {
  font-size: 11px;
  background: #FFF3E0;
  color: #E65100;
  padding: 2px 6px;
  border-radius: 3px;
  font-weight: 700;
}

/* ============================================
   VIEW ALL BUTTON
   ============================================ */
.hp-view-all {
  text-align: center;
  margin-top: 32px;
}

.hp-view-all a {
  display: inline-block;
  padding: 12px 40px;
  border: 2px solid var(--primary);
  color: var(--primary);
  border-radius: var(--radius-pill);
  font-weight: 700;
  font-size: 14px;
  text-decoration: none;
  transition: var(--transition);
}

.hp-view-all a:hover {
  background: var(--primary);
  color: #fff;
}

/* ============================================
   PROMO BANNERS
   ============================================ */
.hp-promo-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px 50px;
}

.hp-promo-card {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  aspect-ratio: 2/1;
  display: block;
  text-decoration: none;
}

.hp-promo-card:hover img {
  transform: scale(1.05);
}

.hp-promo-content {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 30px;
}

.hp-promo-card.dark .hp-promo-content {
  background: linear-gradient(135deg, rgba(51, 56, 160, .85), rgba(51, 56, 160, .3));
  color: #fff;
}

.hp-promo-card.gold .hp-promo-content {
  background: linear-gradient(135deg, rgba(197, 149, 96, .85), rgba(197, 149, 96, .3));
  color: #fff;
}

.hp-promo-content h3 {
  font-size: 24px;
  font-weight: 800;
  margin-bottom: 8px;
  font-family: var(--font-heading);
}

.hp-promo-content p {
  font-size: 14px;
  opacity: .9;
  margin-bottom: 16px;
}

.hp-promo-cta {
  display: inline-block;
  background: var(--accent);
  color: var(--text-dark);
  padding: 10px 24px;
  border-radius: var(--radius-pill);
  font-size: 13px;
  font-weight: 700;
  width: fit-content;
  transition: var(--transition);
}

.hp-promo-card:hover .hp-promo-cta {
  background: #fff;
  color: var(--primary);
}

/* Full-width banner */
.hp-banner-full {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px 50px;
}

.hp-banner-full a {
  display: block;
  border-radius: var(--radius-lg);
  overflow: hidden;
  position: relative;
}

.hp-banner-full img {
  width: 100%;
  display: block;
  transition: transform .6s ease;
}

.hp-banner-full a:hover img {
  transform: scale(1.03);
}

/* ============================================
   BLOG / NEWS
   ============================================ */
.hp-blogs {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.hp-blog-img {
  aspect-ratio: 16/10;
  overflow: hidden;
}

.hp-blog-card:hover .hp-blog-img img {
  transform: scale(1.06);
}

.hp-blog-info {
  padding: 16px;
}

.hp-blog-date {
  font-size: 12px;
  color: var(--primary);
  font-weight: 600;
  margin-bottom: 8px;
}

.hp-blog-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--text-dark);
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ============================================
   TESTIMONIALS
   ============================================ */
.hp-testimonial-section {
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
  color: #fff;
  padding: 60px 0;
}

.hp-testimonial-inner {
  max-width: 800px;
  margin: 0 auto;
  text-align: center;
  padding: 0 20px;
}

.hp-testimonial-inner h2 {
  font-size: 28px;
  font-weight: 800;
  margin-bottom: 12px;
}

.hp-testimonial-inner>p {
  opacity: .8;
  font-size: 15px;
  line-height: 1.7;
  margin-bottom: 30px;
}

.hp-testimonial-cta {
  display: inline-block;
  background: var(--accent);
  color: var(--text-dark);
  padding: 12px 32px;
  border-radius: var(--radius-pill);
  font-weight: 700;
  font-size: 14px;
  text-decoration: none;
  transition: var(--transition);
}

.hp-testimonial-cta:hover {
  background: #fff;
  color: var(--primary);
  transform: translateY(-2px);
}

/* ============================================
   NEWSLETTER
   ============================================ */
.hp-newsletter {
  background: var(--bg-light);
  padding: 50px 0;
}

.hp-newsletter-inner {
  max-width: 600px;
  margin: 0 auto;
  text-align: center;
  padding: 0 20px;
}

.hp-newsletter-inner h2 {
  font-size: 24px;
  font-weight: 800;
  color: var(--text-dark);
  margin-bottom: 10px;
}

.hp-newsletter-inner p {
  color: var(--text-light);
  font-size: 14px;
  margin-bottom: 24px;
}

.hp-newsletter-form {
  display: flex;
  gap: 10px;
  max-width: 480px;
  margin: 0 auto;
}

.hp-newsletter-form input {
  flex: 1;
  padding: 14px 20px;
  border: 2px solid var(--border);
  border-radius: var(--radius-pill);
  font-size: 14px;
  outline: none;
  transition: var(--transition);
}

.hp-newsletter-form input:focus {
  border-color: var(--primary);
}

.hp-newsletter-form button {
  background: var(--primary);
  color: #fff;
  padding: 14px 30px;
  border: none;
  border-radius: var(--radius-pill);
  font-weight: 700;
  font-size: 14px;
  cursor: pointer;
  transition: var(--transition);
  white-space: nowrap;
}

.hp-newsletter-form button:hover {
  background: var(--primary-dark);
}

/* ============================================
   PRODUCT PAGE - QUANTITY INPUT FIX
   ============================================ */
/* Align quantity with cart buttons on the same row */
.single-product div.product form.cart {
  display: flex !important;
  align-items: center !important;
  gap: 12px;
  flex-wrap: nowrap;
}

/* Make the quantity wrapper compact */
.single-product div.product form.cart .quantity.buttons_added {
  width: auto !important;
  min-width: unset !important;
  max-width: 120px !important;
  display: flex !important;
  align-items: center !important;
  flex-shrink: 0;
  margin-bottom: 0 !important;
  border: 1px solid #ddd;
  border-radius: 6px;
  overflow: hidden;
  background: #fff;
}

/* +/- buttons: no circular background, visible text */
.single-product .quantity.buttons_added .ux-quantity__button,
.single-product .quantity.buttons_added input.minus.is-form,
.single-product .quantity.buttons_added input.plus.is-form {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  width: 34px !important;
  height: 36px !important;
  min-width: unset !important;
  min-height: unset !important;
  font-size: 18px !important;
  font-weight: 600;
  color: #333 !important;
  cursor: pointer;
  padding: 0 !important;
  margin: 0 !important;
  line-height: 36px !important;
  text-align: center;
  -webkit-appearance: none;
  appearance: none;
}

.single-product .quantity.buttons_added .ux-quantity__button:hover {
  color: var(--primary, #3338A0) !important;
  background: rgba(0, 0, 0, 0.04) !important;
}

/* Number input: compact */
.single-product .quantity.buttons_added input.qty {
  width: 40px !important;
  min-width: 40px !important;
  max-width: 40px !important;
  height: 36px !important;
  text-align: center !important;
  padding: 0 !important;
  margin: 0 !important;
  font-size: 15px !important;
  font-weight: 600;
  border: none !important;
  border-left: 1px solid #eee !important;
  border-right: 1px solid #eee !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: #fff !important;
  -moz-appearance: textfield;
}

.single-product .quantity.buttons_added input.qty::-webkit-outer-spin-button,
.single-product .quantity.buttons_added input.qty::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* ============================================
   PRODUCT PAGE - STICKY IMAGE ON SCROLL
   ============================================ */
.single-product .product-gallery {
  position: sticky;
  top: 100px;
  /* offset for header */
  align-self: flex-start;
}

/* ============================================
   SALE RIBBON BADGE (Global - Shop + Product)
   ============================================ */
/* Hide Flatsome default badge */
.badge-container {
  display: none !important;
}

.sp4-sale-ribbon {
  position: absolute;
  top: 0;
  right: 14px;
  z-index: 10;
  background: #27AE60;
  color: #fff;
  padding: 6px 10px 10px;
  text-align: center;
  border-radius: 0 0 4px 4px;
  box-shadow: 0 3px 10px rgba(39, 174, 96, .35);
  min-width: 40px;
}

.sp4-sale-ribbon::after {
  content: '';
  position: absolute;
  bottom: -7px;
  left: 0;
  right: 0;
  width: 0;
  height: 0;
  margin: 0 auto;
  border-left: 20px solid transparent;
  border-right: 20px solid transparent;
  border-top: 7px solid #27AE60;
}

.sp4-sale-ribbon::before {
  content: '';
  position: absolute;
  top: 0;
  left: -3px;
  width: 3px;
  height: 5px;
  background: #1E8C4D;
  border-radius: 3px 0 0 0;
}

.sp4-ribbon-text {
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .5px;
  line-height: 1.2;
  display: block;
  font-family: 'Be Vietnam Pro', sans-serif;
}

/* Smaller variant for shop loop cards */
.sp4-sale-ribbon--loop {
  right: 10px;
  padding: 5px 8px 8px;
  min-width: 36px;
}

.sp4-sale-ribbon--loop .sp4-ribbon-text {
  font-size: 11px;
}

.sp4-sale-ribbon--loop::after {
  border-left-width: 18px;
  border-right-width: 18px;
  border-top-width: 6px;
  bottom: -6px;
}

/* ============================================
   CHECKOUT COUPON CARDS
   ============================================ */
.return-to-shop .button {
  background-color: var(--accent) !important;
  color: white !important;
}

.return-to-shop .button:hover {
  background: #ffe066 !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 24px rgba(252, 198, 29, .45) !important;
}

.aotheu-coupon-section {
  margin-bottom: 24px;
  max-width: 900px;
}

.aotheu-coupon-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--text-dark);
  margin-bottom: 10px;
  font-family: var(--font-heading);
}

.aotheu-coupon-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.aotheu-coupon-card {
  display: flex;
  align-items: stretch;
  background: #FFF5F5;
  border: 1.5px dashed #E57373;
  border-radius: 8px;
  overflow: hidden;
  flex: 1 1 calc(33.33% - 7px);
  min-width: 240px;
  max-width: calc(33.33% - 7px);
  transition: var(--transition);
}

.aotheu-coupon-card:hover {
  box-shadow: 0 3px 12px rgba(229, 115, 115, .12);
  transform: translateY(-1px);
}

.aotheu-coupon-card.applied {
  opacity: .55;
  border-color: #ccc;
  background: #f9f9f9;
}

/* Left icon — compact */
.aotheu-coupon-left {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  min-width: 40px;
  background: linear-gradient(135deg, #E53935, #FF6F61);
  position: relative;
}

.aotheu-coupon-left::after {
  content: '';
  position: absolute;
  right: -6px;
  top: 50%;
  transform: translateY(-50%);
  width: 12px;
  height: 12px;
  background: #FFF5F5;
  border-radius: 50%;
  border: 1.5px dashed #E57373;
}

.aotheu-coupon-icon {
  font-size: 16px;
}

/* Center content — tight */
.aotheu-coupon-center {
  flex: 1;
  padding: 8px 10px 8px 16px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
}

.aotheu-coupon-discount {
  font-size: 14px;
  font-weight: 800;
  color: #E53935;
  font-family: var(--font-heading);
}

.aotheu-coupon-min {
  font-size: 11px;
  color: var(--text-body);
  font-weight: 500;
}

.aotheu-coupon-remain {
  color: var(--text-light);
  font-weight: 400;
  margin-left: 4px;
  font-size: 10px;
}

.aotheu-coupon-meta {
  display: flex;
  flex-direction: column;
  gap: 3px;
  font-size: 10px;
  color: var(--text-light);
  margin-top: 1px;
}

.aotheu-coupon-scope {
  background: #FFF3E0;
  color: #E65100;
  padding: 1px 6px;
  border-radius: 3px;
  font-weight: 600;
  font-size: 10px;
}

.aotheu-coupon-expiry {
  font-weight: 500;
  font-size: 10px;
}

/* Right action — compact */
.aotheu-coupon-right {
  display: flex;
  align-items: center;
  padding: 0 10px;
  border-left: 1px dashed #E57373;
}

.aotheu-coupon-apply {
  background: transparent;
  border: 1.5px solid #E53935;
  color: #E53935;
  padding: 5px 12px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
  transition: var(--transition);
  white-space: nowrap;
}

.aotheu-coupon-apply:hover {
  background: #E53935;
  color: #fff;
}

.aotheu-coupon-apply.applied {
  background: #4CAF50;
  border-color: #4CAF50;
  color: #fff;
  cursor: default;
}

.aotheu-coupon-applied-text {
  color: #4CAF50;
  font-weight: 700;
  font-size: 11px;
  white-space: nowrap;
}

@media (max-width: 768px) {
  .aotheu-coupon-card {
    flex: 1 1 100%;
    max-width: 100%;
    min-width: 0;
  }
}

/* ============================================
   APPLIED COUPON TAGS (Block Checkout)
   ============================================ */
.wc-block-components-chip,
.wc-block-components-chip.wc-block-components-chip--radius-large {
  background: #27AE60 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 8px 12px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: .3px;
  box-shadow: 0 2px 6px rgba(39, 174, 96, .2);
  transition: all .2s ease;
  gap: 6px !important;
}

.wc-block-components-chip:hover {
  background: #219653 !important;
  box-shadow: 0 3px 10px rgba(39, 174, 96, .3) !important;
}

/* Add ticket icon before coupon text */
.wc-block-components-chip .wc-block-components-chip__text::before {
  content: '';
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-right: 5px;
  vertical-align: middle;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18' fill='none'%3E%3Cpath d='M12.7927 9.43128C10.9867 9.47448 10.9837 12.1217 12.7891 12.1697C14.5951 12.1259 14.5975 9.47988 12.7927 9.43128ZM12.3217 10.8023C12.3223 10.1879 13.2565 10.1855 13.2601 10.7999C13.2577 11.4125 12.3265 11.4149 12.3217 10.8023ZM9.19213 8.56848C10.9975 8.52288 10.9975 5.87568 9.19213 5.83008C7.38613 5.87628 7.38733 8.52168 9.19213 8.56848ZM9.19213 6.73068C9.80593 6.73308 9.80593 7.66668 9.19213 7.66908C8.57833 7.66608 8.57893 6.73428 9.19213 6.73068ZM13.9141 6.08268C13.8296 5.99796 13.7149 5.95024 13.5952 5.95002C13.4755 5.94979 13.3606 5.99707 13.2757 6.08148L8.06173 11.2709C8.01866 11.3123 7.98427 11.3619 7.96057 11.4167C7.93687 11.4716 7.92432 11.5306 7.92366 11.5903C7.92301 11.6501 7.93426 11.7093 7.95675 11.7647C7.97925 11.82 8.01254 11.8703 8.05469 11.9127C8.09684 11.955 8.147 11.9886 8.20224 12.0113C8.25748 12.0341 8.3167 12.0456 8.37645 12.0452C8.4362 12.0449 8.49527 12.0326 8.55022 12.0092C8.60518 11.9857 8.65491 11.9515 8.69653 11.9087L13.9111 6.71988C13.9532 6.67827 13.9867 6.62877 14.0097 6.57421C14.0326 6.51965 14.0446 6.46109 14.0448 6.4019C14.0451 6.34271 14.0337 6.28405 14.0113 6.22927C13.9889 6.17449 13.9558 6.12468 13.9141 6.08268ZM5.31133 6.32208C5.19198 6.32208 5.07752 6.36949 4.99313 6.45388C4.90874 6.53827 4.86133 6.65273 4.86133 6.77208V7.92588C4.86133 8.04523 4.90874 8.15968 4.99313 8.24408C5.07752 8.32847 5.19198 8.37588 5.31133 8.37588C5.43068 8.37588 5.54513 8.32847 5.62953 8.24408C5.71392 8.15968 5.76133 8.04523 5.76133 7.92588V6.77208C5.76133 6.65273 5.71392 6.53827 5.62953 6.45388C5.54513 6.36949 5.43068 6.32208 5.31133 6.32208ZM5.31133 9.62448C5.19198 9.62448 5.07752 9.67189 4.99313 9.75628C4.90874 9.84067 4.86133 9.95513 4.86133 10.0745V11.2277C4.86133 11.347 4.90874 11.4615 4.99313 11.5459C5.07752 11.6303 5.19198 11.6777 5.31133 11.6777C5.43068 11.6777 5.54513 11.6303 5.62953 11.5459C5.71392 11.4615 5.76133 11.347 5.76133 11.2277V10.0745C5.76133 9.95513 5.71392 9.84067 5.62953 9.75628C5.54513 9.67189 5.43068 9.62448 5.31133 9.62448Z' fill='white'/%3E%3Cpath d='M17.0278 7.51293C17.2772 7.37916 17.4855 7.18006 17.6304 6.93697C17.7753 6.69387 17.8514 6.41594 17.8504 6.13293V4.58973C17.8499 4.17343 17.6843 3.77432 17.39 3.47996C17.0956 3.18559 16.6965 3.02001 16.2802 3.01953H1.7206C1.30431 3.02001 0.905198 3.18559 0.610831 3.47996C0.316465 3.77432 0.15088 4.17343 0.150404 4.58973V6.13173C0.149446 6.41474 0.225493 6.69267 0.370398 6.93577C0.515304 7.17886 0.72361 7.37796 0.973004 7.51173C1.24217 7.65586 1.46719 7.87032 1.62406 8.13226C1.78093 8.39421 1.86378 8.69381 1.86378 8.99913C1.86378 9.30446 1.78093 9.60406 1.62406 9.866C1.46719 10.1279 1.24217 10.3424 0.973004 10.4865C0.72343 10.6204 0.515006 10.8197 0.370089 11.063C0.225171 11.3063 0.149228 11.5845 0.150404 11.8677V13.4097C0.15088 13.826 0.316465 14.2251 0.610831 14.5195C0.905198 14.8139 1.30431 14.9795 1.7206 14.9799H16.2802C16.6965 14.9795 17.0956 14.8139 17.39 14.5195C17.6843 14.2251 17.8499 13.826 17.8504 13.4097V11.8677C17.8514 11.5847 17.7753 11.3068 17.6304 11.0637C17.4855 10.8206 17.2772 10.6215 17.0278 10.4877C15.8494 9.89793 15.8584 8.10273 17.0278 7.51293ZM15.5458 10.2201C15.7865 10.6696 16.1547 11.0379 16.6042 11.2785C16.8196 11.3949 16.9528 11.6205 16.9504 11.8653V13.4073C16.9502 13.585 16.8796 13.7554 16.7539 13.8811C16.6283 14.0067 16.4579 14.0774 16.2802 14.0775H5.7604C5.73581 13.6875 5.91521 12.9411 5.3104 12.9261C4.705 12.9405 4.885 13.6905 4.8604 14.0799H1.7206C1.5429 14.0798 1.37253 14.0091 1.24688 13.8835C1.12122 13.7578 1.05056 13.5874 1.0504 13.4097V11.8677C1.04922 11.7477 1.08084 11.6296 1.14185 11.5262C1.20286 11.4227 1.29094 11.338 1.3966 11.2809C1.80911 11.0599 2.15393 10.7312 2.39433 10.3296C2.63473 9.92812 2.76169 9.46891 2.76169 9.00093C2.76169 8.53295 2.63473 8.07374 2.39433 7.67222C2.15393 7.27071 1.80911 6.94193 1.3966 6.72093C1.29094 6.66391 1.20286 6.57912 1.14185 6.47571C1.08084 6.3723 1.04922 6.25419 1.0504 6.13413V4.58973C1.051 4.21953 1.3504 3.92013 1.7206 3.91953H4.8604C4.885 4.31013 4.7044 5.05833 5.3104 5.07333C5.9158 5.05893 5.73581 4.30893 5.7604 3.91953H16.2802C16.6504 3.92013 16.9498 4.21953 16.9504 4.58973V6.13173C16.9528 6.37653 16.8196 6.60213 16.6042 6.71853C16.3047 6.87889 16.0398 7.09668 15.8245 7.35947C15.6092 7.62225 15.4478 7.92488 15.3495 8.25005C15.2513 8.57523 15.218 8.91658 15.2517 9.25462C15.2854 9.59265 15.3853 9.92074 15.5458 10.2201Z' fill='white'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
}

.wc-block-components-chip .wc-block-components-chip__text {
  color: #fff !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  font-size: 12px !important;
}

/* Remove button — clean arrow style */
.wc-block-components-chip .wc-block-components-chip__remove {
  background: transparent !important;
  color: rgba(255, 255, 255, .7) !important;
  border: none !important;
  border-radius: 0 !important;
  border-left: 1px solid rgba(255, 255, 255, .25) !important;
  width: auto !important;
  height: auto !important;
  min-width: unset !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  margin-left: 4px !important;
  padding: 0 0 0 8px !important;
  transition: all .2s ease;
}

.wc-block-components-chip .wc-block-components-chip__remove:hover {
  color: #fff !important;
}

.wc-block-components-chip .wc-block-components-chip__remove svg {
  fill: currentColor !important;
  width: 10px !important;
  height: 10px !important;
}

/* Discount row styling */
.wc-block-components-totals-discount .wc-block-components-totals-item__value {
  color: #27AE60 !important;
  font-weight: 700 !important;
}

/* Discount label row */
.wc-block-components-totals-discount .wc-block-components-totals-item__label {
  font-weight: 600 !important;
}

/* ============================================
   HIDE DEFAULT WC ADD-TO-CART NOTICES
   ============================================ */
.woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-message {
  display: none !important;
}

/* ============================================
   ADD TO CART POPUP
   ============================================ */
.aotheu-atc-popup {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 99999;
}

.aotheu-atc-overlay {
  display: none;
}

.aotheu-atc-modal {
  position: relative;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, .18);
  width: 320px;
  max-width: 90vw;
  animation: aotheuSlideUp .3s ease;
  overflow: hidden;
}

@keyframes aotheuSlideUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.aotheu-atc-header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--border);
}

.aotheu-atc-check {
  font-size: 18px;
}

.aotheu-atc-title {
  flex: 1;
  font-size: 15px;
  font-weight: 700;
  color: var(--text-dark);
  font-family: var(--font-heading);
}

.aotheu-atc-close {
  background: none;
  border: none;
  font-size: 22px;
  color: var(--text-light);
  cursor: pointer;
  padding: 0;
  line-height: 1;
  transition: color .2s;
}

.aotheu-atc-close:hover {
  color: var(--text-dark);
}

.aotheu-atc-body {
  display: flex;
  gap: 14px;
  padding: 16px;
}

.aotheu-atc-img {
  width: 80px;
  height: 80px;
  border-radius: 10px;
  overflow: hidden;
  flex-shrink: 0;
  border: 1px solid var(--border);
}

.aotheu-atc-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.aotheu-atc-info {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
}

.aotheu-atc-name {
  font-size: 14px;
  font-weight: 700;
  color: var(--text-dark);
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.aotheu-atc-variant {
  font-size: 12px;
  color: var(--text-light);
}

.aotheu-atc-variant:empty {
  display: none;
}

.aotheu-atc-price {
  font-size: 15px;
  font-weight: 800;
  color: #E53935;
}

.aotheu-atc-price del {
  font-size: 12px;
  color: var(--text-light);
  font-weight: 400;
}

.aotheu-atc-price ins {
  text-decoration: none;
}

.aotheu-atc-footer {
  padding: 0 16px 16px;
}

.aotheu-atc-viewcart {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  padding: 12px;
  background: var(--bg-light);
  color: var(--text-dark) !important;
  border: 1.5px solid var(--border);
  border-radius: 10px;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none !important;
  transition: all .2s;
}

.aotheu-atc-viewcart:hover {
  background: var(--primary);
  color: #fff !important;
  border-color: var(--primary);
}

/* ============================================
   PLACE ORDER BUTTON (Block Checkout)
   ============================================ */
.wc-block-components-checkout-place-order-button,
.wc-block-checkout__actions_row .wc-block-components-button {
  background: var(--primary) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 12px !important;
  padding: 16px 40px !important;
  font-size: 17px !important;
  font-weight: 800 !important;
  font-family: var(--font-heading), 'Inter', sans-serif !important;
  letter-spacing: .5px;
  width: 100% !important;
  min-height: 56px !important;
  box-shadow: 0 4px 15px rgba(51, 56, 160, .3);
  transition: all .25s ease;
  cursor: pointer;
}

.wc-block-components-checkout-place-order-button:hover,
.wc-block-checkout__actions_row .wc-block-components-button:hover {
  background: var(--primary-dark) !important;
  box-shadow: 0 6px 20px rgba(51, 56, 160, .4);
  transform: translateY(-1px);
}

.wc-block-components-checkout-place-order-button:active,
.wc-block-checkout__actions_row .wc-block-components-button:active {
  transform: translateY(0);
  box-shadow: 0 2px 8px rgba(51, 56, 160, .3);
}

/* ============================================
   MODERN HEADER & NAVIGATION REDESIGN
   ============================================ */

/* ---- Global Header Wrapper ---- */
.header-wrapper {
  background: var(--bg-white) !important;
  box-shadow: 0 2px 20px rgba(51, 56, 160, .08) !important;
  z-index: 999;
  font-family: var(--font-heading);
  transition: all .35s ease;
}

/* Sticky header effect */
.header-wrapper.stuck {
  box-shadow: 0 4px 30px rgba(51, 56, 160, .12) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* Sticky — compact main header */
.header-wrapper.stuck .header-main .flex-col {
  padding-top: 6px !important;
  padding-bottom: 6px !important;
}

/* Sticky — compact nav links */
.header-wrapper.stuck .header-bottom .nav>li>a,
.header-wrapper.stuck .header-nav>li>a,
.header-wrapper.stuck .header-bottom .header-nav>li>a {
  padding: 0px 16px !important;
  font-size: 12px !important;
}

/* Sticky — remove accent border to save space */
.header-wrapper.stuck .header-bottom {
  border-bottom-width: 2px !important;
}

/* Sticky — keep nav centered */
.header-wrapper.stuck .header-bottom .flex-col {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* ---- Top Bar (if present) ---- */
.header-top {
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%) !important;
  color: #fff !important;
  border-bottom: none !important;
  font-size: 13px;
  letter-spacing: .3px;
}

.header-top .flex-col {
  padding-top: 6px !important;
  padding-bottom: 6px !important;
}

.header-top a,
.header-top .nav>li>a {
  color: rgba(255, 255, 255, .85) !important;
  font-weight: 500;
  transition: color .25s ease;
}

.header-top a:hover,
.header-top .nav>li>a:hover {
  color: var(--accent) !important;
}

/* ---- Main Header (Logo + Search + Cart) ---- */
.header-main {
  background: var(--bg-white) !important;
  border-bottom: 1px solid rgba(51, 56, 160, .06) !important;
  padding: 0 !important;
}

.header-main .flex-col {
  padding-top: 12px !important;
  padding-bottom: 12px !important;
}

/* Logo styling */
.header-main .logo a,
.header-main .logo img {
  transition: transform .3s ease;
}

.header-main .logo a:hover img {
  transform: scale(1.04);
}

/* ---- Search Bar Redesign ---- */
.header-search-form,
.header-main .searchform,
.header-search .searchform {
  position: relative;
}

.header-search-form input[type="search"],
.header-main .search-field,
.header-search .search-field,
.searchform .search-field {
  border: 2px solid var(--border) !important;
  border-radius: var(--radius-pill) !important;
  padding: 10px 50px 10px 22px !important;
  font-size: 14px !important;
  font-family: var(--font-body) !important;
  background: var(--bg-light) !important;
  color: var(--text-dark) !important;
  transition: all .3s ease !important;
  height: auto !important;
  min-height: 44px;
}

.header-search-form input[type="search"]:focus,
.header-main .search-field:focus,
.header-search .search-field:focus,
.searchform .search-field:focus {
  border-color: var(--primary) !important;
  background: #fff !important;
  box-shadow: 0 0 0 4px rgba(51, 56, 160, .08) !important;
  outline: none !important;
}

.header-search-form input[type="search"]::placeholder,
.header-main .search-field::placeholder,
.searchform .search-field::placeholder {
  color: var(--text-light) !important;
  font-weight: 400;
}

/* Search submit button */
.header-search-form .ux-search-submit,
.searchform .ux-search-submit,
.header-search button[type="submit"],
.searchform button[type="submit"] {
  background: var(--primary) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--radius-pill) !important;
  width: 42px !important;
  height: 42px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  position: absolute !important;
  right: 2px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  transition: all .25s ease !important;
  cursor: pointer;
  padding: 0 !important;
}

.header-search-form .ux-search-submit:hover,
.searchform .ux-search-submit:hover,
.header-search button[type="submit"]:hover,
.searchform button[type="submit"]:hover {
  background: var(--primary-dark) !important;
  transform: translateY(-50%) scale(1.06) !important;
}

.searchform .ux-search-submit .icon-search,
.header-search button[type="submit"] i {
  color: #fff !important;
  font-size: 16px;
}

/* Search dropdown live results */
.search-results-dropdown,
.header-search .live-search-results,
.live-search-results {
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
  box-shadow: var(--shadow-lg) !important;
  overflow: hidden;
  margin-top: 6px !important;
}

/* ---- Bottom Navigation Bar ---- */
.header-bottom {
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%) !important;
  border-top: none !important;
  border-bottom: 3px solid var(--accent) !important;
}

.header-bottom::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .15), transparent);
}

.header-bottom .flex-col {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* ---- Main Navigation Links ---- */
.header-nav,
.header-bottom-nav,
.header-bottom .nav,
.header-bottom .header-nav {
  display: flex !important;
  align-items: center;
  gap: 0;
}

/* Individual nav items */
.header-nav>li,
.header-bottom .nav>li,
.header-bottom-nav>li {
  position: relative;
}

/* Nav links */
.header-nav>li>a,
.header-bottom .nav>li>a,
.header-bottom .header-nav>li>a {
  color: rgba(255, 255, 255, .88) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  padding: 6px 10px !important;
  display: flex !important;
  align-items: center;
  gap: 6px;
  position: relative;
  transition: all .3s ease !important;
  font-family: var(--font-heading) !important;
  white-space: nowrap;
}

/* Hover underline indicator */
.header-nav>li>a::after,
.header-bottom .nav>li>a::after,
.header-bottom .header-nav>li>a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 0;
  height: 3px;
  background: var(--accent);
  border-radius: 3px 3px 0 0;
  transition: all .3s cubic-bezier(.4, 0, .2, 1);
  transform: translateX(-50%);
}

/* Hover state */
.header-nav>li>a:hover,
.header-nav>li.active>a,
.header-nav>li.current-menu-item>a,
.header-nav>li.current_page_item>a,
.header-bottom .nav>li>a:hover,
.header-bottom .nav>li.active>a,
.header-bottom .nav>li.current-menu-item>a,
.header-bottom .header-nav>li>a:hover,
.header-bottom .header-nav>li.active>a,
.header-bottom .header-nav>li.current-menu-item>a {
  color: #fff !important;
  background: rgba(255, 255, 255, .08) !important;
}

.header-nav>li>a:hover::after,
.header-nav>li.active>a::after,
.header-nav>li.current-menu-item>a::after,
.header-nav>li.current_page_item>a::after,
.header-bottom .nav>li>a:hover::after,
.header-bottom .nav>li.active>a::after,
.header-bottom .nav>li.current-menu-item>a::after,
.header-bottom .header-nav>li>a:hover::after,
.header-bottom .header-nav>li.active>a::after,
.header-bottom .header-nav>li.current-menu-item>a::after {
  width: 70%;
}

/* ---- Dropdown Menus ---- */
.header-nav .nav-dropdown,
.header-bottom .nav .nav-dropdown,
.nav-dropdown {
  background: #fff !important;
  border: 1px solid rgba(51, 56, 160, .06) !important;
  border-radius: 12px !important;
  box-shadow: 0 12px 40px rgba(51, 56, 160, .12) !important;
  padding: 8px 0 !important;
  min-width: 220px !important;
  margin-top: 0 !important;
  animation: aotheuDropIn .25s ease;
  overflow: hidden;
}

@keyframes aotheuDropIn {
  from {
    opacity: 0;
    transform: translateY(8px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Dropdown items */
.nav-dropdown li a,
.header-nav .nav-dropdown li a {
  color: var(--text-body) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  padding: 10px 20px !important;
  display: block !important;
  transition: all .2s ease !important;
  letter-spacing: .2px !important;
  text-transform: none !important;
  border-left: 3px solid transparent !important;
}

.nav-dropdown li a:hover,
.header-nav .nav-dropdown li a:hover {
  color: var(--primary) !important;
  background: rgba(51, 56, 160, .04) !important;
  border-left-color: var(--primary) !important;
  padding-left: 24px !important;
}

/* Dropdown separator */
.nav-dropdown li.menu-item-has-children>a {
  border-bottom: 1px solid var(--border);
}

/* ---- Account & Cart Icons (Main Header) ---- */
.header-main .account-item a,
.header-main .cart-item a,
.header-main .header-nav>li>a,
.header-main .nav>li>a {
  color: var(--text-dark) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  transition: all .25s ease !important;
  font-family: var(--font-heading) !important;
  display: flex !important;
  align-items: center;
  gap: 6px;
}

.header-main .account-item a:hover,
.header-main .cart-item a:hover,
.header-main .header-nav>li>a:hover,
.header-main .nav>li>a:hover {
  color: var(--primary) !important;
}

/* Cart count badge */
.header-main .cart-icon .cart-count,
.cart-icon .cart-count,
.header .cart-icon strong {
  background: var(--primary) !important;
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  min-width: 20px;
  height: 20px;
  line-height: 20px;
  border-radius: 50% !important;
  text-align: center;
  border: 2px solid #fff !important;
  box-shadow: 0 2px 6px rgba(51, 56, 160, .25);
}

/* Header icons */
.header-main .icon-shopping-bag,
.header-main .icon-shopping-cart,
.header-main .icon-user,
.header-main .icon-search {
  font-size: 20px !important;
  color: var(--text-dark);
  transition: color .25s ease;
}

.header-main a:hover .icon-shopping-bag,
.header-main a:hover .icon-shopping-cart,
.header-main a:hover .icon-user,
.header-main a:hover .icon-search {
  color: var(--primary) !important;
}

/* Cart total price */
.header-main .cart-price,
.header-main .header-cart-price {
  font-weight: 700 !important;
  color: var(--primary) !important;
  font-size: 14px !important;
}

/* ---- Mobile Menu Trigger ---- */
.header .menu-icon,
.header .nav-icon,
.off-canvas-toggle {
  color: var(--text-dark) !important;
  transition: color .25s ease;
}

.header .menu-icon:hover,
.header .nav-icon:hover,
.off-canvas-toggle:hover {
  color: var(--primary) !important;
}

/* ---- Mobile Off-Canvas / Sidebar Menu ---- */

.mfp-content .sidebar-menu,
.mobile-sidebar-menu {
  background: #fff !important;
}

.off-canvas-left,
.off-canvas-right {
  background: rgba(0, 0, 0, .45) !important;
}

.off-canvas-left .nav-sidebar>li>a,
.off-canvas-right .nav-sidebar>li>a,
.sidebar-menu .nav-sidebar>li>a,
.mobile-sidebar-menu .nav>li>a {
  color: var(--text-dark) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  padding: 14px 20px !important;
  border-bottom: 1px solid var(--border) !important;
  transition: all .25s ease !important;
  font-family: var(--font-heading) !important;
}

.off-canvas-left .nav-sidebar>li>a:hover,
.off-canvas-right .nav-sidebar>li>a:hover,
.sidebar-menu .nav-sidebar>li>a:hover,
.mobile-sidebar-menu .nav>li>a:hover {
  color: var(--primary) !important;
  background: rgba(51, 56, 160, .04) !important;
  padding-left: 26px !important;
}

/* Mobile sidebar active state */
.nav-sidebar>li.active>a,
.nav-sidebar>li.current-menu-item>a {
  color: var(--primary) !important;
  border-left: 3px solid var(--primary) !important;
  font-weight: 700 !important;
}

/* ---- Mega Menu (if used) ---- */
.header-nav .nav-dropdown-default.nav-dropdown,
.mega-menu {
  border-radius: 0 0 12px 12px !important;
  box-shadow: 0 16px 48px rgba(51, 56, 160, .12) !important;
}

/* ============================================
   MINI CART DROPDOWN — PREMIUM REDESIGN
   ============================================ */

/* ---- Dropdown Container ---- */
body li.cart-item>ul.nav-dropdown {
  background: #ffffff !important;
  border-radius: 16px !important;
  box-shadow: 0 20px 60px rgba(51, 56, 160, .18),
    0 0 0 1px rgba(51, 56, 160, .06) !important;
  border: none !important;
  padding: 0 !important;
  min-width: 340px !important;
  max-width: 380px !important;
  overflow: hidden !important;
  animation: aotheuDropIn .28s cubic-bezier(.4, 0, .2, 1) both;
}

/* Reset wrapper LI inside dropdown */
body li.cart-item>.nav-dropdown>li.html.widget_shopping_cart {
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border-left: none !important;
}

/* ---- Product List ---- */
.widget_shopping_cart_content>ul.woocommerce-mini-cart.cart_list {
  overflow-y: auto !important;
  padding: 8px 0 !important;
  margin: 0 !important;
  list-style: none !important;
  scrollbar-width: thin;
  scrollbar-color: rgba(51, 56, 160, .12) transparent;
}

body .woocommerce-mini-cart.cart_list::-webkit-scrollbar {
  width: 3px;
}

body .woocommerce-mini-cart.cart_list::-webkit-scrollbar-thumb {
  background: rgba(51, 56, 160, .12);
  border-radius: 3px;
}

/* ---- Individual Cart Item ---- */
body .woocommerce-mini-cart>li.mini_cart_item,
#cart-popup .woocommerce-mini-cart>li.mini_cart_item {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 2px 35px 0px 7px !important;
  margin: 0 !important;
  border-bottom: 1px solid #f0f1f5 !important;
  border-left: none !important;
  position: relative !important;
  transition: background .2s ease !important;
  list-style: none !important;
  background: #fff !important;
}

body .woocommerce-mini-cart>li.mini_cart_item:last-child {
  border-bottom: none !important;
}

body .woocommerce-mini-cart>li.mini_cart_item:hover {
  background: #f8f8ff !important;
}

/* ---- Product Image ---- */
body li.mini_cart_item a:not(.remove)>img,
#cart-popup li.mini_cart_item a:not(.remove)>img {
  position: static !important;
  top: auto !important;
  left: auto !important;
  flex: 0 0 54px !important;
  width: 54px !important;
  height: 54px !important;
  min-width: 54px !important;
  max-width: 54px !important;
  border-radius: 8px !important;
  object-fit: cover !important;
  border: 1.5px solid #edeef3 !important;
  margin: 0 !important;
  padding: 3px !important;
  background: #fff !important;
  transition: border-color .2s ease !important;
}

body li.mini_cart_item:hover a:not(.remove)>img {
  border-color: #b0b3d6 !important;
}

/* ---- Product Name Link (contains img + span) ---- */
body li.mini_cart_item>a:not(.remove),
#cart-popup li.mini_cart_item>a:not(.remove) {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 10px !important;
  flex: 1 !important;
  min-width: 0 !important;
  text-decoration: none !important;
  border-left: none !important;
  padding: 0 !important;
  background: none !important;
  overflow: hidden !important;
}

/* ---- Product Name Text ---- */
body li.mini_cart_item .minicart-product-name,
#cart-popup li.mini_cart_item .minicart-product-name {
  flex: 1 1 0% !important;
  min-width: 0 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  word-break: break-word !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  color: #2d2d3a !important;
  transition: color .2s ease !important;
}

body li.mini_cart_item>a:not(.remove):hover .minicart-product-name {
  color: #3338A0 !important;
}

/* ---- Quantity & Price ---- */
body li.mini_cart_item .quantity {
  display: block !important;
  font-size: 11px !important;
  color: #888 !important;
  font-weight: 500 !important;
  margin-top: 2px !important;
}

body li.mini_cart_item .quantity .woocommerce-Price-amount {
  color: #3338A0 !important;
  font-weight: 700 !important;
  font-size: 12px !important;
}

/* ---- Remove Button (×) ---- */
body li.mini_cart_item>a.remove.remove_from_cart_button {
  position: absolute !important;
  top: 8px !important;
  right: 8px !important;
  left: auto !important;
  bottom: auto !important;
  transform: none !important;
  width: 20px !important;
  height: 20px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #f3f4f6 !important;
  color: #aaa !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 50% !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  text-indent: 0 !important;
  cursor: pointer !important;
  transition: all .25s ease !important;
  z-index: 5 !important;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
}

body li.mini_cart_item>a.remove.remove_from_cart_button:hover {
  background: #fee2e2 !important;
  color: #dc2626 !important;
  border-color: #fca5a5 !important;
  transform: rotate(90deg) scale(1.1) !important;
  box-shadow: 0 2px 6px rgba(220, 38, 38, .15) !important;
}

/* ---- Subtotal Row ---- */
body p.woocommerce-mini-cart__total.total {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin: 0 !important;
  padding: 14px 16px !important;
  border-top: 1.5px solid #edeef3 !important;
  background: #f9fafb !important;
}

body p.woocommerce-mini-cart__total.total strong {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #555 !important;
  letter-spacing: .2px !important;
}

body p.woocommerce-mini-cart__total .woocommerce-Price-amount {
  font-size: 18px !important;
  font-weight: 800 !important;
  color: #3338A0 !important;
}

/* ---- Action Buttons ---- */
body p.woocommerce-mini-cart__buttons.buttons {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 12px 16px 16px !important;
  background: #f9fafb !important;
}

/* View Cart */
body p.woocommerce-mini-cart__buttons a.button.wc-forward:not(.checkout) {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  padding: 4px 16px !important;
  background: #fff !important;
  color: #3338A0 !important;
  border: 1.5px solid #3338A0 !important;
  border-radius: 10px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: .4px !important;
  text-decoration: none !important;
  transition: all .2s ease !important;
  cursor: pointer !important;
  box-shadow: none !important;
  margin: 0 !important;
}

body p.woocommerce-mini-cart__buttons a.button.wc-forward:not(.checkout):hover {
  background: rgba(51, 56, 160, .06) !important;
  border-color: #272B80 !important;
  transform: translateY(-1px) !important;
}

/* Checkout */
body p.woocommerce-mini-cart__buttons a.button.checkout.wc-forward {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  padding: 4px 16px !important;
  background: linear-gradient(135deg, #3338A0, #272B80) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 10px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: .4px !important;
  text-decoration: none !important;
  box-shadow: 0 4px 12px rgba(51, 56, 160, .3) !important;
  transition: all .2s ease !important;
  cursor: pointer !important;
  margin: 0 !important;
}

body p.woocommerce-mini-cart__buttons a.button.checkout.wc-forward:hover {
  background: linear-gradient(135deg, #272B80, #1E2266) !important;
  box-shadow: 0 6px 18px rgba(51, 56, 160, .4) !important;
  transform: translateY(-1px) !important;
}

/* ---- Empty Cart ---- */
body .widget_shopping_cart_content .woocommerce-mini-cart__empty-message {
  text-align: center !important;
  padding: 30px 20px !important;
  color: #999 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}


/* ============================================
   RESPONSIVE
   ============================================ */
@media only screen and (max-width: 64em) {
  .hp-hero-content h1 {
    font-size: 32px;
  }

  .hp-products {
    grid-template-columns: repeat(4, 1fr);
  }

  .hp-categories {
    grid-template-columns: repeat(2, 1fr);
  }

  .hp-usp-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Header responsive - tablet */
  .header-nav>li>a,
  .header-bottom .nav>li>a,
  .header-bottom .header-nav>li>a {
    padding: 6px 10px !important;
    font-size: 12px !important;
    letter-spacing: .5px !important;
  }
}

@media only screen and (max-width: 48em) {
  .hp-hero-slider {
    aspect-ratio: 16/9;
  }

  .hp-hero-content h1 {
    font-size: 24px;
  }

  .hp-hero-overlay {
    padding: 0 30px;
  }

  .hp-products {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }

  .hp-promo-grid {
    grid-template-columns: 1fr;
  }

  .hp-blogs {
    grid-template-columns: repeat(2, 1fr);
  }

  .hp-section-header h2 {
    font-size: 22px;
  }

  .hp-newsletter-form {
    flex-direction: column;
  }

  .hp-usp-grid {
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }

  .hp-tabs {
    gap: 6px;
  }

  .hp-tab {
    padding: 8px 16px;
    font-size: 12px;
  }

  /* Header responsive - mobile */
  .header-main .flex-col {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }

  .header-search-form input[type="search"],
  .header-main .search-field,
  .searchform .search-field {
    min-height: 40px;
    font-size: 13px !important;
    padding: 8px 44px 8px 16px !important;
  }

  .header-search-form .ux-search-submit,
  .searchform .ux-search-submit,
  .searchform button[type="submit"] {
    width: 36px !important;
    height: 36px !important;
  }
}

@media only screen and (max-width: 36em) {
  .hp-categories {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }

  .hp-usp-grid {
    grid-template-columns: 1fr;
  }

  .hp-hero-content h1 {
    font-size: 20px;
  }

  .hp-hero-btn {
    padding: 10px 24px;
    font-size: 13px;
  }

  .hp-blogs {
    grid-template-columns: 1fr;
  }
}

/* ============================================
   MINI CART — RESPONSIVE LAYOUT (≤ 768px)
   Dual selectors: universal + #cart-popup for off-canvas (ID-level specificity).
   Each rule lists BOTH forms — desktop dropdown matches universal,
   off-canvas matches #cart-popup, cascade picks the higher-specificity one.
   ============================================ */
.inner-padding {
  padding: 7px !important;
}

@media only screen and (max-width: 48em) {

  /* Popup container: shrink to viewport (only applies to dropdown context) */
  body li.cart-item>ul.nav-dropdown {
    min-width: 0 !important;
    max-width: calc(100vw - 24px) !important;
  }

  /* LI: flex row with wrap so qty drops to next row */
  ul.product_list_widget>li.woocommerce-mini-cart-item.mini_cart_item,
  #cart-popup ul.product_list_widget>li.woocommerce-mini-cart-item.mini_cart_item {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 0px 12px !important;
    padding: 12px 36px 12px 14px !important;
    position: relative !important;
  }


  /* <a> wrapper (image + name): flex row, left-aligned */
  ul.product_list_widget>li.mini_cart_item>a:not(.remove),
  #cart-popup ul.product_list_widget>li.mini_cart_item>a:not(.remove) {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 5px !important;
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    padding: 0 !important;
    text-decoration: none !important;
  }

  /* Image: force visible 54×54 — beat Flatsome's position:absolute / width:0 */
  html body ul.product_list_widget>li.mini_cart_item>a:not(.remove)>img,
  #cart-popup ul.product_list_widget>li.mini_cart_item>a:not(.remove)>img {
    position: static !important;
    top: auto !important;
    left: auto !important;
    flex: 0 0 54px !important;
    width: 54px !important;
    height: 54px !important;
    min-width: 54px !important;
    max-width: 54px !important;
    margin: 0 !important;
    padding: 3px !important;
    border: 1.5px solid #edeef3 !important;
    border-radius: 8px !important;
    object-fit: cover !important;
    background: #fff !important;
    display: block !important;
    visibility: visible !important;
    float: none !important;
  }

  /* Name: force visible 2-line clamp */
  html body ul.product_list_widget>li.mini_cart_item .minicart-product-name,
  #cart-popup ul.product_list_widget>li.mini_cart_item .minicart-product-name {
    flex: 1 1 0% !important;
    min-width: 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 4 !important;
    line-clamp: 4 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    visibility: visible !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #2d2d3a !important;
    line-height: 1.35 !important;
  }

  /* Qty: full-width second row, indent to align under name */
  html body ul.product_list_widget>li.mini_cart_item>.ux-mini-cart-qty,
  #cart-popup ul.product_list_widget>li.mini_cart_item>.ux-mini-cart-qty {
    position: static !important;
    float: none !important;
    flex: 1 0 100% !important;
    width: 100% !important;
    padding-left: 64px !important;
    margin: 0 !important;
    text-align: left !important;
  }

  /* Remove button stays absolute top-right */
  html body ul.product_list_widget>li.mini_cart_item>a.remove,
  #cart-popup ul.product_list_widget>li.mini_cart_item>a.remove {
    position: absolute !important;
    top: 8px !important;
    right: 8px !important;
    left: auto !important;
  }

  /* Tighter padding for total/buttons rows */
  body p.woocommerce-mini-cart__total.total,
  body p.woocommerce-mini-cart__buttons.buttons {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
}

/* ============================================
   MINI CART — PHONE (≤ 480px)
   Layout: stack vertically — [IMG] / [Name] / [qty], left-aligned
   ============================================ */
@media only screen and (max-width: 30em) {

  html body ul.product_list_widget>li.woocommerce-mini-cart-item.mini_cart_item,
  #cart-popup ul.product_list_widget>li.woocommerce-mini-cart-item.mini_cart_item {
    flex-direction: column !important;
    align-items: flex-start !important;
    padding: 0px 0px 6px 0px !important;
  }

  html body ul.product_list_widget>li.mini_cart_item>a:not(.remove),
  #cart-popup ul.product_list_widget>li.mini_cart_item>a:not(.remove) {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 3px !important;
    width: 100% !important;
  }

  html body ul.product_list_widget>li.mini_cart_item>a:not(.remove)>img,
  #cart-popup ul.product_list_widget>li.mini_cart_item>a:not(.remove)>img {
    flex: 0 0 80px !important;
    width: 80px !important;
    height: 80px !important;
    min-width: 80px !important;
    max-width: 80px !important;
  }

  html body ul.product_list_widget>li.mini_cart_item>.ux-mini-cart-qty,
  #cart-popup ul.product_list_widget>li.mini_cart_item>.ux-mini-cart-qty {
    flex: 1 0 100% !important;
    padding-left: 0 !important;
  }
}