/* =============================================================
   YARD LOGIC ROBOTICS — Zoho Commerce Theme v3
   Built from actual rendered DOM — shop.yardlogicrobotics.com
   Apply: Zoho Commerce > Design > Customize > Custom CSS
   ============================================================= */

/* --- Brand Tokens --- */
:root {
  --ylr-green:        #82bd4d;
  --ylr-green-dark:   #678e43;
  --ylr-charcoal:     #303030;
  --ylr-gray:         #556757;
  --ylr-white:        #ffffff;
  --ylr-text:         #e0e0e0;
  --ylr-text-muted:   rgba(255,255,255,0.65);
  --ylr-card-bg:      rgba(48, 48, 48, 0.85);
  --ylr-overlay:      rgba(48, 48, 48, 0.6);
  --ylr-border:       rgba(130, 189, 77, 0.25);
  --ylr-border-med:   rgba(130, 189, 77, 0.4);
}

/* =============================================================
   BODY & PAGE BACKGROUND
   The gradient must show through all transparent containers.
   ============================================================= */
body {
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
  background: linear-gradient(135deg, #556757 0%, #303030 100%) !important;
  background-attachment: fixed !important;
  color: var(--ylr-white) !important;
}

/* All major Zoho wrappers must be transparent */
.zpheader-style-01,
.theme-content-area,
.theme-content-container,
.theme-content-area-inner,
.zpcontent-container,
.page-container,
.zpcontainer,
.zprow,
[class^="zpcol"],
[class*=" zpcol"] {
  background: transparent !important;
}

/* =============================================================
   OVERRIDE zplight-section (white bg used on hero slides, etc.)
   This is the main culprit for white/grey sections.
   ============================================================= */
.zplight-section,
.zplight-section-bg,
.zphero-slide.zplight-section,
.zphero-slide.zplight-section-bg {
  background-color: transparent !important;
}

/* The hero slide background-image is set inline — override it */
.zpslider-img {
  background-image: none !important;
  background-color: transparent !important;
}

/* Dark sections should use our dark overlay, not the theme default */
.zpdark-section,
.zpdark-section-bg {
  background: rgba(40, 40, 40, 0.8) !important;
}

/* =============================================================
   TOPBAR
   .theme-header-topbar — contains contact info + social icons
   ============================================================= */
.theme-header-topbar {
  background: rgba(35, 35, 35, 0.95) !important;
  border-bottom: 1px solid var(--ylr-border) !important;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
}

.theme-header-topbar .theme-topbar-contact-info ul .theme-topbar-info a {
  color: var(--ylr-text) !important;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
}

.theme-header-topbar .theme-topbar-contact-info ul .theme-topbar-info a:hover {
  color: var(--ylr-green) !important;
}

.theme-header-topbar .theme-topbar-contact-info ul .theme-topbar-info .theme-topbar-info-icon svg {
  fill: var(--ylr-text) !important;
}

/* Social icons in topbar */
.theme-header-topbar .theme-socialicon-parent ul li a svg.zpsocialprofile {
  fill: var(--ylr-text) !important;
  transition: fill 0.3s ease !important;
}

.theme-header-topbar .theme-socialicon-parent ul li a:hover svg.zpsocialprofile {
  fill: var(--ylr-green) !important;
}

/* =============================================================
   MAIN HEADER
   .theme-header inside .zpheader-style-01
   ============================================================= */
.theme-header {
  background: rgba(48, 48, 48, 0.88) !important;
  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;
  box-shadow: 0 2px 10px rgba(0,0,0,0.35) !important;
  border-bottom: none !important;
}

/* Site name text */
.theme-branding-info .theme-site-name {
  color: var(--ylr-white) !important;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
}

/* Logo container */
.theme-branding-info .theme-logo-parent {
  background: var(--ylr-gray) !important;
  padding: 4px 10px !important;
  border-radius: 8px !important;
}

/* =============================================================
   NAVIGATION MENU
   ============================================================= */
.theme-navigation-and-icons .theme-menu-area .theme-menu ul li a,
.theme-navigation-and-icons .theme-menu-area .theme-menu ul[data-zs-menu-container] > li > a {
  color: var(--ylr-white) !important;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
  font-weight: 500 !important;
  transition: color 0.3s ease, text-shadow 0.3s ease !important;
}

.theme-navigation-and-icons .theme-menu-area .theme-menu ul li a:hover,
.theme-navigation-and-icons .theme-menu-area .theme-menu ul li.theme-menu-selected > a {
  color: var(--ylr-green) !important;
  text-shadow: 0 0 8px rgba(130, 189, 77, 0.5) !important;
}

/* Submenu dropdown */
.theme-navigation-and-icons .theme-menu-area .theme-menu ul li .theme-sub-menu {
  background: rgba(40, 40, 40, 0.98) !important;
  border: 1px solid var(--ylr-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.5) !important;
}

.theme-navigation-and-icons .theme-menu-area .theme-menu ul li .theme-sub-menu li a {
  color: var(--ylr-text) !important;
}

.theme-navigation-and-icons .theme-menu-area .theme-menu ul li .theme-sub-menu li a:hover {
  background: rgba(130, 189, 77, 0.08) !important;
  color: var(--ylr-green) !important;
}

/* Submenu arrow icons */
.theme-navigation-and-icons .theme-menu-area .theme-menu .theme-sub-li-menu::after {
  border-color: var(--ylr-text) transparent transparent transparent !important;
}

/* "More" dropdown — same treatment */
li[data-zp-more-menu] > a {
  color: var(--ylr-white) !important;
}

/* Search icon */
.theme-navigation-and-icons .theme-search-and-mini-cart-group .theme-search .theme-search-icon svg {
  fill: var(--ylr-white) !important;
}

.theme-navigation-and-icons .theme-search-and-mini-cart-group .theme-search .theme-search-icon:hover svg {
  fill: var(--ylr-green) !important;
}

/* Search input field */
.theme-search-field-container input[type="text"],
.theme-search-field-container input[type="search"] {
  background: rgba(85, 103, 87, 0.4) !important;
  border: 1px solid var(--ylr-border-med) !important;
  color: var(--ylr-white) !important;
  border-radius: 8px !important;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
}

.theme-search-field-container input[type="text"]::placeholder,
.theme-search-field-container input[type="search"]::placeholder {
  color: rgba(255,255,255,0.4) !important;
}

/* Cart icon */
.theme-mini-cart .theme-minicart-icon svg {
  fill: var(--ylr-white) !important;
}

.theme-mini-cart:hover .theme-minicart-icon svg {
  fill: var(--ylr-green) !important;
}

/* Cart count badge */
.theme-mini-cart-count {
  background: var(--ylr-green) !important;
  color: var(--ylr-charcoal) !important;
  font-weight: 700 !important;
}

/* Wishlist icon */
.theme-wishlist-icon svg {
  fill: var(--ylr-white) !important;
  stroke: none !important;
}

/* Mobile burger icon */
.theme-burger-icon,
.theme-burger-icon::before,
.theme-burger-icon::after {
  background: var(--ylr-white) !important;
}

/* Mobile responsive menu */
.theme-responsive-menu-area .theme-menu-area .theme-menu {
  background: rgba(35, 35, 35, 0.99) !important;
}

/* =============================================================
   HERO BANNER
   .zphero > .zphero-slides > .zphero-slide
   The slide has an inline background-image — we override the
   whole slide background to use our dark gradient instead.
   ============================================================= */
.zphero {
  background: transparent !important;
}

.zphero-slide {
  background: linear-gradient(135deg, #4b5f3a 0%, #303030 100%) !important;
}

/* The .zpslider-img div carries the inline bg-image */
.zphero-slide .zpslider-img {
  background-image: none !important;
  background-color: transparent !important;
  opacity: 0.15 !important; /* keep subtle texture if image is set, but don't dominate */
}

/* Hero content container */
.zphero-slider-container,
.zshero-banner-style-05 {
  background: transparent !important;
}

/* Hero headings inside slides */
.zphero-slide h1,
.zphero-slide h2,
.zphero-slide h3,
.zphero-slide .zpelem-heading {
  color: var(--ylr-green) !important;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
  text-shadow: 2px 2px 4px rgba(0,0,0,0.5) !important;
}

.zphero-slide p,
.zphero-slide .zpelem-text,
.zphero-slide h5 {
  color: var(--ylr-text) !important;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
}

/* Hero boxed container */
.theme-banner.zphero-boxed {
  background: transparent !important;
}

/* =============================================================
   PAGE SECTIONS (all zpsection content blocks)
   ============================================================= */
.zpsection {
  background: transparent !important;
}

/* Alternating section backgrounds — mimic main site */
.zpsection:nth-child(even) {
  background: rgba(48, 48, 48, 0.45) !important;
}

/* All section headings */
.zpsection h1, .zpsection h2, .zpsection h3,
.zpsection .zpelem-heading,
.theme-section-heading {
  color: var(--ylr-green) !important;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
  text-shadow: 1px 1px 3px rgba(0,0,0,0.4) !important;
}

/* All section body text */
.zpsection p,
.zpsection .zpelem-text,
.zpsection li,
.zpsection span:not(.theme-menu-name):not(.theme-mini-cart-count) {
  color: var(--ylr-text) !important;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
}

/* Feature/icon cards (the "Free Shipping / Quality Products" row) */
.zpsection .zpshadow-box,
.zpsection [class*="feature"],
.zpsection [class*="icon-box"] {
  background: var(--ylr-card-bg) !important;
  border: 1px solid var(--ylr-border) !important;
  border-radius: 12px !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}

.zpsection .zpshadow-box:hover,
.zpsection [class*="feature"]:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,0.4) !important;
  border-color: var(--ylr-green) !important;
}

/* =============================================================
   BREADCRUMB
   ============================================================= */
.theme-breadcrumb-container {
  background: transparent !important;
}

.theme-porduct-breadcrumb,
.theme-porduct-breadcrumb a,
.theme-porduct-breadcrumb span {
  color: var(--ylr-text-muted) !important;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
}

.theme-porduct-breadcrumb a:hover {
  color: var(--ylr-green) !important;
}

/* =============================================================
   PRODUCT CARDS
   .theme-prod-box.theme-product-list-style-08
   ============================================================= */
.theme-prod-box {
  background: var(--ylr-card-bg) !important;
  border: 2px solid var(--ylr-border) !important;
  border-radius: 15px !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease !important;
  overflow: hidden !important;
}

.theme-prod-box:hover {
  transform: translateY(-8px) !important;
  box-shadow: 0 15px 40px rgba(0,0,0,0.55) !important;
  border-color: var(--ylr-green) !important;
}

/* Remove the default grey ruled borders between grid tiles */
.theme-product-ratio .theme-prod-box.theme-product-list-style-08 {
  border-inline-end: none !important;
  border-block-start: none !important;
}

.theme-prod-box .theme-product-box-content {
  background: transparent !important;
}

.theme-prod-box .theme-product-box-content .theme-product-image-area {
  background: transparent !important;
}

.theme-prod-box .theme-product-box-content .theme-product-image-area img {
  border-radius: 10px !important;
  filter: drop-shadow(0 4px 8px rgba(0,0,0,0.3)) !important;
}

/* Product name */
.theme-prod-box .theme-product-box-content .theme-product-details-area .theme-product-name a {
  color: var(--ylr-green) !important;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
  font-weight: 600 !important;
  font-size: 1.1rem !important;
}

.theme-prod-box .theme-product-box-content .theme-product-details-area .theme-product-name a:hover {
  color: var(--ylr-green-dark) !important;
}

/* Product description */
.theme-prod-box .theme-product-box-content .theme-product-details-area p {
  color: var(--ylr-text) !important;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
}

/* Selling price */
.theme-prod-box .theme-product-box-content .theme-product-details-area .theme-selling-price,
.theme-prod-box .theme-product-box-content .theme-product-details-area .item-price {
  color: var(--ylr-green) !important;
  font-weight: 700 !important;
  font-size: 1.25rem !important;
}

/* Strike-through original price */
.theme-prod-box .theme-product-box-content .theme-product-details-area .theme-label-price {
  color: rgba(255,255,255,0.4) !important;
  text-decoration: line-through !important;
}

/* Add to cart / View Details button */
.theme-prod-box .theme-product-box-content .theme-product-details-area .theme-product-button-area .zpbutton,
.theme-prod-box .theme-product-box-content .theme-product-details-area .theme-product-button-area button {
  background: var(--ylr-green) !important;
  color: var(--ylr-charcoal) !important;
  border: none !important;
  border-radius: 10px !important;
  font-weight: 600 !important;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
  width: 100% !important;
  transition: all 0.3s ease !important;
}

.theme-prod-box .theme-product-box-content .theme-product-details-area .theme-product-button-area .zpbutton:hover,
.theme-prod-box .theme-product-box-content .theme-product-details-area .theme-product-button-area button:hover {
  background: var(--ylr-green-dark) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 20px rgba(130, 189, 77, 0.4) !important;
}

/* =============================================================
   ALL zpbutton INSTANCES (global)
   zpbutton-type-primary = green, zpbutton-outline = bordered
   ============================================================= */
.zpbutton {
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
  font-weight: 600 !important;
  border-radius: 10px !important;
  transition: all 0.3s ease !important;
}

.zpbutton.zpbutton-type-primary {
  background: var(--ylr-green) !important;
  color: var(--ylr-charcoal) !important;
  border: none !important;
}

.zpbutton.zpbutton-type-primary:hover {
  background: var(--ylr-green-dark) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 20px rgba(130, 189, 77, 0.35) !important;
}

.zpbutton.zpbutton-outline,
.zpbutton.zpbutton-type-primary.zpbutton-outline {
  background: transparent !important;
  color: var(--ylr-white) !important;
  border: 2px solid var(--ylr-green) !important;
}

.zpbutton.zpbutton-outline:hover {
  background: var(--ylr-green) !important;
  color: var(--ylr-charcoal) !important;
}

/* "View Cart" and "Close" in add-to-cart success toast */
.theme-cart-add-success-message {
  background: rgba(40, 40, 40, 0.97) !important;
  border: 1px solid var(--ylr-border-med) !important;
  border-radius: 10px !important;
  color: var(--ylr-white) !important;
}

.theme-cart-add-success-message svg {
  fill: var(--ylr-green) !important;
}

.theme-cart-success-message-links.zpdark-section {
  background: transparent !important;
}

/* Error/failure toast */
.theme-cart-add-failure-message.zpdark-section {
  background: rgba(40, 40, 40, 0.97) !important;
  border: 1px solid rgba(255, 80, 80, 0.3) !important;
  border-radius: 10px !important;
}

/* =============================================================
   CART PAGE
   ============================================================= */
.theme-cart-area-container {
  color: var(--ylr-white) !important;
}

.theme-shopping-cart-table-container .theme-cart-table-row {
  border-block-end: 1px solid var(--ylr-border) !important;
}

.theme-shopping-cart-table-container .theme-cart-table-row .theme-cart-table-data .theme-cart-item-info ul li,
.theme-shopping-cart-table-container .theme-cart-table-row .theme-cart-table-data .theme-cart-item-info ul li span {
  color: var(--ylr-text) !important;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
}

.theme-cart-selling-price {
  color: var(--ylr-green) !important;
  font-weight: 700 !important;
}

.theme-cart-label-price {
  color: rgba(255,255,255,0.4) !important;
}

/* Qty controls */
.theme-quantity-field-button .theme-product-list-quantity {
  background: rgba(85, 103, 87, 0.3) !important;
  border: 1px solid var(--ylr-border-med) !important;
  border-radius: 6px !important;
}

.theme-product-list-quantity-field,
.theme-shopping-cart-table-container input[type=text] {
  background: transparent !important;
  color: var(--ylr-white) !important;
  border: none !important;
}

.theme-product-list-quantity-decrease svg,
.theme-product-list-quantity-increase svg {
  fill: var(--ylr-white) !important;
}

/* Cart summary */
.theme-cart-body .theme-cart-details-container {
  border-inline-end: 1px solid var(--ylr-border) !important;
}

.theme-cart-summary-details p span {
  color: var(--ylr-green) !important;
}

.theme-cart-summary-details p em {
  color: var(--ylr-text) !important;
}

.theme-cart-mobile-summary-container {
  background: rgba(38, 38, 38, 0.98) !important;
  border-top: 1px solid var(--ylr-border) !important;
}

.theme-cart-mobile-summary-container p,
.theme-cart-mobile-summary-container span {
  color: var(--ylr-white) !important;
}

/* Checkout button in cart */
.theme-checkout-button {
  background: var(--ylr-green) !important;
  color: var(--ylr-charcoal) !important;
  border: none !important;
  border-radius: 10px !important;
  font-weight: 600 !important;
}

.theme-checkout-button:hover {
  background: var(--ylr-green-dark) !important;
  transform: translateY(-2px) !important;
}

/* Continue shopping */
.theme-continue-shopping-button {
  color: var(--ylr-white) !important;
  border-color: var(--ylr-green) !important;
  border-radius: 10px !important;
}

.theme-continue-shopping-button:hover {
  background: var(--ylr-green) !important;
  color: var(--ylr-charcoal) !important;
}

/* =============================================================
   CHECKOUT
   ============================================================= */
.theme-checkout-container .theme-checkout-tab {
  background: rgba(55, 65, 55, 0.7) !important;
  border: 1px solid var(--ylr-border) !important;
  color: var(--ylr-white) !important;
  border-radius: 10px !important;
}

.theme-checkout-container .theme-checkout-tab.theme-checkout-tab-selected {
  background: rgba(85, 103, 87, 0.5) !important;
  border-color: var(--ylr-green) !important;
}

.theme-checkout-container .theme-checkout-tab .theme-checkout-steps-count-label {
  background: var(--ylr-green) !important;
  color: var(--ylr-charcoal) !important;
  border: none !important;
  font-weight: 700 !important;
}

.theme-checkout-container .theme-checkout-tab .theme-checkout-tab-change-button {
  background: rgba(130, 189, 77, 0.12) !important;
  border: 1px solid var(--ylr-border-med) !important;
  color: var(--ylr-green) !important;
  border-radius: 6px !important;
}

.theme-checkout-container .theme-checkout-tab-content {
  background: var(--ylr-card-bg) !important;
  border: 1px solid var(--ylr-border) !important;
  color: var(--ylr-white) !important;
  border-radius: 10px !important;
}

/* Checkout form inputs */
.theme-checkout-container .theme-checkout-tab-content input[type=text],
.theme-checkout-container .theme-checkout-tab-content input[type=address],
.theme-checkout-container .theme-checkout-tab-content input[type=number],
.theme-checkout-container .theme-checkout-tab-content input[type=email],
.theme-checkout-container .theme-checkout-tab-content input[type=tel],
.theme-checkout-container .theme-checkout-tab-content textarea,
.theme-checkout-container .theme-checkout-tab-content select {
  background: rgba(85, 103, 87, 0.3) !important;
  border: 1px solid var(--ylr-border-med) !important;
  color: var(--ylr-white) !important;
  border-radius: 8px !important;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
}

.theme-checkout-container .theme-checkout-tab-content label {
  color: var(--ylr-text) !important;
}

/* Order summary box */
.theme-checkout-order-summary-container .theme-chekout-ordersummar {
  background: var(--ylr-card-bg) !important;
  border: 1px solid var(--ylr-border) !important;
  border-radius: 10px !important;
  color: var(--ylr-white) !important;
}

.theme-checkout-order-summary-container .theme-chekout-ordersummar .theme-order-summary-head {
  color: var(--ylr-green) !important;
  border-block-end: 1px dashed var(--ylr-border) !important;
}

.theme-checkout-order-summary-container .theme-chekout-ordersummar .theme-order-summary-footer .price-label,
.theme-checkout-container .theme-checkout-tab-content.order-review .theme-checkout-order-summary-container .theme-order-summary-footer .price-label {
  color: var(--ylr-green) !important;
}

/* Shipping method boxes */
.theme-checkout-container .theme-checkout-tab-content.shipping-methods .shipping-method-box-container .shipping-method-box {
  background: rgba(60, 72, 60, 0.5) !important;
  border: 1px solid var(--ylr-border) !important;
  border-radius: 8px !important;
  color: var(--ylr-white) !important;
}

.theme-checkout-container .theme-checkout-tab-content.shipping-methods .shipping-method-box-container .shipping-method-box .shipping-price {
  color: var(--ylr-green) !important;
  border-block-start: 1px solid var(--ylr-border) !important;
}

/* Address boxes */
.theme-checkout-container .theme-checkout-tab-content.address .theme-checkout-user-address-box-container .theme-user-address-box .theme-checkout-user-address-box {
  background: rgba(60, 72, 60, 0.5) !important;
  border: 1px solid var(--ylr-border) !important;
  border-radius: 8px !important;
  color: var(--ylr-white) !important;
}

/* Checkout primary/secondary buttons */
.theme-checkout-primary-btn {
  background: var(--ylr-green) !important;
  color: var(--ylr-charcoal) !important;
  border: none !important;
  border-radius: 10px !important;
}

.theme-checkout-primary-btn:hover {
  background: var(--ylr-green-dark) !important;
  transform: translateY(-2px) !important;
}

.theme-checkout-secondary-btn {
  background: rgba(85, 103, 87, 0.6) !important;
  color: var(--ylr-white) !important;
  border: none !important;
  border-radius: 10px !important;
}

/* Order confirmation */
.theme-order-confirmation-msg-container {
  background: var(--ylr-card-bg) !important;
  border: 1px solid var(--ylr-border) !important;
  border-radius: 15px !important;
  color: var(--ylr-white) !important;
}

.theme-order-confirmation-msg-container .order-success-icon svg {
  fill: var(--ylr-green) !important;
}

/* =============================================================
   PRODUCT DETAIL PAGE
   .theme-product-details-style-03
   ============================================================= */
.theme-product-details-style-03 .theme-prod-details-container {
  background: var(--ylr-card-bg) !important;
  border: 2px solid var(--ylr-border) !important;
  border-radius: 15px !important;
  padding: 2rem !important;
  color: var(--ylr-white) !important;
}

.theme-product-details-style-03 .theme-prod-details-container h1,
.theme-product-details-style-03 .theme-prod-details-container .theme-product-name {
  color: var(--ylr-green) !important;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
}

.theme-product-details-style-03 .theme-prod-details-container .theme-selling-price,
.theme-product-details-style-03 .theme-prod-details-container .item-price {
  color: var(--ylr-green) !important;
  font-size: 2rem !important;
  font-weight: 700 !important;
}

.theme-product-details-style-03 .theme-prod-details-container .theme-label-price {
  color: rgba(255,255,255,0.4) !important;
  text-decoration: line-through !important;
}

.theme-product-details-style-03 .theme-prod-details-container p,
.theme-product-details-style-03 .theme-prod-details-container li,
.theme-product-details-style-03 .theme-prod-details-container span:not(.theme-mini-cart-count) {
  color: var(--ylr-text) !important;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
}

/* Variant selects */
.theme-product-details-style-03 .theme-prod-details-container select,
.theme-product-details-style-03 .theme-prod-details-container .theme-variant-select-container {
  background: rgba(85, 103, 87, 0.4) !important;
  border: 1px solid var(--ylr-border-med) !important;
  color: var(--ylr-white) !important;
  border-radius: 8px !important;
}

/* Qty field */
.theme-product-details-style-03 .theme-product-list-quantity {
  background: rgba(85, 103, 87, 0.3) !important;
  border: 1px solid var(--ylr-border-med) !important;
  border-radius: 8px !important;
}

.theme-product-details-style-03 .theme-product-list-quantity-field {
  background: transparent !important;
  color: var(--ylr-white) !important;
  border: none !important;
}

.theme-product-details-style-03 .theme-product-list-quantity-decrease svg,
.theme-product-details-style-03 .theme-product-list-quantity-increase svg {
  fill: var(--ylr-white) !important;
}

/* Add to cart button on detail page */
.theme-product-details-style-03 .theme-prod-details-container .zpbutton.zpbutton-type-primary,
.theme-product-details-style-03 .theme-prod-details-container button[type="submit"] {
  background: var(--ylr-green) !important;
  color: var(--ylr-charcoal) !important;
  border: none !important;
  border-radius: 10px !important;
  font-weight: 600 !important;
  font-size: 1rem !important;
}

.theme-product-details-style-03 .theme-prod-details-container .zpbutton.zpbutton-type-primary:hover,
.theme-product-details-style-03 .theme-prod-details-container button[type="submit"]:hover {
  background: var(--ylr-green-dark) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 20px rgba(130, 189, 77, 0.4) !important;
}

/* Quick view modal */
.theme-quick-view-container .theme-quick-view-inner-container {
  background: rgba(38, 38, 38, 0.99) !important;
  border: 1px solid var(--ylr-border) !important;
  border-radius: 15px !important;
  color: var(--ylr-white) !important;
}

/* =============================================================
   COLLECTION / CATEGORY PAGE
   ============================================================= */
.theme-collection-sortby-row {
  background: var(--ylr-overlay) !important;
  border-radius: 10px !important;
  border: 1px solid var(--ylr-border) !important;
  color: var(--ylr-text) !important;
  margin-bottom: 1.5rem !important;
}

.theme-collection-sort-inner,
.theme-collection-sort-inner select {
  background: rgba(85, 103, 87, 0.4) !important;
  color: var(--ylr-white) !important;
  border: 1px solid var(--ylr-border-med) !important;
  border-radius: 6px !important;
}

/* Filter panel */
.theme-produt-filter-row {
  background: rgba(38, 38, 38, 0.97) !important;
  border-right: 1px solid var(--ylr-border) !important;
  color: var(--ylr-text) !important;
}

.theme-produt-filter-row h3,
.theme-produt-filter-row h4,
.theme-produt-filter-row label,
.theme-produt-filter-row a {
  color: var(--ylr-text) !important;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
}

.theme-produt-filter-row a:hover {
  color: var(--ylr-green) !important;
}

/* =============================================================
   FOOTER AREA
   .theme-footer-area.zpdark-section — Zoho's native footer wrapper
   Your custom .ylr-footer is injected inside this.
   ============================================================= */
.theme-footer-area {
  background: rgba(40, 40, 40, 0.88) !important;
  backdrop-filter: blur(10px) !important;
  border-top: 1px solid var(--ylr-border-med) !important;
}

/* Fix the social icon image placeholders in the custom footer */
.ylr-social-icon[src="YOUR_ZOHO_FACEBOOK_ICON_URL"],
.ylr-social-icon[src="YOUR_ZOHO_INSTAGRAM_ICON_URL"] {
  display: none !important; /* hide broken images */
}

/* Show the SVG fallbacks when images are broken */
.ylr-social-link .ylr-social-svg {
  display: block !important;
}

/* =============================================================
   PAYMENT STATUS PAGE
   ============================================================= */
.theme-payment-content-area .zpcontainer {
  color: var(--ylr-white) !important;
}

.theme-payment-content-area .zpcontainer .theme-payment-success-message h3 {
  color: var(--ylr-green) !important;
}

.theme-payment-content-area .zpcontainer .theme-payment-success-message .theme-payment-message-box {
  background: var(--ylr-card-bg) !important;
  border: 1px solid var(--ylr-border) !important;
  border-radius: 10px !important;
  color: var(--ylr-text) !important;
}

.theme-payment-content-area .zpcontainer .theme-payment-info {
  background: var(--ylr-overlay) !important;
  border-radius: 10px !important;
  color: var(--ylr-text) !important;
}

/* =============================================================
   SEARCH RESULTS
   ============================================================= */
.theme-searchresult-heading h4 {
  color: var(--ylr-green) !important;
}

.theme-searchresult p,
.theme-searchresult-url {
  color: var(--ylr-text) !important;
}

.theme-searchresult-pagination a {
  background: var(--ylr-overlay) !important;
  border: 1px solid var(--ylr-border) !important;
  color: var(--ylr-white) !important;
  border-radius: 6px !important;
}

.theme-searchresult-pagination a:hover {
  background: var(--ylr-green) !important;
  color: var(--ylr-charcoal) !important;
  border-color: var(--ylr-green) !important;
}

/* =============================================================
   GLOBAL FORM INPUTS (catch-all)
   ============================================================= */
input[type="text"]:not(.theme-product-list-quantity-field):not([data-search-input]),
input[type="email"],
input[type="tel"],
input[type="password"],
input[type="number"],
textarea,
select {
  background: rgba(85, 103, 87, 0.3) !important;
  border: 1px solid var(--ylr-border-med) !important;
  color: var(--ylr-white) !important;
  border-radius: 8px !important;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
  outline: none !important;
  border-color: var(--ylr-green) !important;
  box-shadow: 0 0 0 3px rgba(130, 189, 77, 0.15) !important;
}

input::placeholder,
textarea::placeholder {
  color: rgba(255,255,255,0.35) !important;
}

label {
  color: var(--ylr-text) !important;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
}

/* =============================================================
   MEGA MENU BACKDROP
   ============================================================= */
.zpmm-backdrop {
  background: rgba(20, 20, 20, 0.6) !important;
}

/* =============================================================
   RESPONSIVE — MOBILE
   ============================================================= */
@media (max-width: 991px) {
  .theme-responsive-menu-area .theme-menu-area .theme-menu {
    background: rgba(35, 35, 35, 0.99) !important;
  }

  .theme-responsive-menu-area .theme-menu-area .theme-menu ul li a {
    color: var(--ylr-white) !important;
    border-bottom: 1px solid var(--ylr-border) !important;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
  }

  .theme-responsive-menu-area .theme-menu-area .theme-menu ul li a:hover {
    color: var(--ylr-green) !important;
    background: rgba(130, 189, 77, 0.07) !important;
  }

  .theme-hide-res-topbar-checkout {
    background: rgba(35, 35, 35, 0.95) !important;
  }
}

@media (max-width: 768px) {
  .zphero-slide h1,
  .zphero-slide .zpelem-heading {
    font-size: 1.8rem !important;
  }
}