﻿@import url('https://fonts.googleapis.com/css2?family=Geologica:wght,CRSV@100..900,0&display=swap');

/* ============================================================
   ZooZone Theme вЂ” Main Styles
   reset.css is loaded separately before this file
   ============================================================ */

*,
*::before,
*::after {
    box-sizing: border-box;
}

:root {
    /* Colors */
    --color-white: #FFFFFF;
    --color-spring-wood: #F6FBF8;
    --color-everglades: #205330;
    --color-christine: #E8720B;
    --color-black: #232323;
    --color-fuscous-gray: #4D4E4D;
    --color-natural-gray: #8C8F8D;
    --color-timberwolf: #D6DBD8;
    --color-westar: #E1E5E3;
    --color-ebb: #EAEEEC;
    --color-red: #E81E0B;
    --color-green: #2CB862;
    --color-laser-lemon: #ECFF60;

    /* Legacy color variables */
    --color-primary: #E8720B;
    --color-secondary: #205330;
    --color-accent: #2CB862;
    --color-light: #F6FBF8;
    --color-dark: #232323;
    --color-text: #232323;

    /* Typography - Font Families */
    --font-main: "Geologica", sans-serif;

    /* Typography - Headings */
    --h1-size: 36px;
    --h1-weight: 600;
    --h1-line-height: 1.2;

    --h2-size: 28px;
    --h2-weight: 600;
    --h2-line-height: 1.2;

    --h3-size: 24px;
    --h3-weight: 600;
    --h3-line-height: 1.2;

    --h4-size: 20px;
    --h4-weight: 600;
    --h4-line-height: 1.2;

    /* Typography - Body Text Sizes */
    --text-light-12: 12px;
    --text-light-12-weight: 300;
    --text-light-12-line: 1.4;

    --text-medium-14: 14px;
    --text-medium-14-weight: 500;
    --text-medium-14-line: 1.4;

    --text-regular-14: 14px;
    --text-regular-14-weight: 400;
    --text-regular-14-line: 1.4;

    --text-semi-bold-14: 14px;
    --text-semi-bold-14-weight: 600;
    --text-semi-bold-14-line: 1.4;

    --text-medium-16: 16px;
    --text-medium-16-weight: 500;
    --text-medium-16-line: 1.4;

    --text-medium-18: 18px;
    --text-medium-18-weight: 500;

    --spacing-unit: 1rem;
}

html {
    font-size: 16px;
}

body {
    font-family: var(--font-main);
    background-color: #ffffff;
    color: var(--color-text);
    line-height: 1.6;
}

/* ============================================================
   Layout
   ============================================================ */

.container {
    max-width: 1296px;
    width: calc(100% - 80px);
    margin: 0 auto;
}

/* ============================================================
   Header вЂ” Top Bar  (bg #ECFF60, h=36px)
   ============================================================ */

.site-header {
    position: sticky;
    top: -36px;
    /* topbar (36px) scrolls away, header-main sticks at top:0 */
    z-index: 1000;
}

.admin-bar .site-header {
    top: -4px;
    /* 32px admin bar - 36px topbar = -4px */
}

.elementor-element {
    padding: 0;
}

.e-con>.e-con-inner {
    max-width: initial !important;
    padding: 0 !important;
}

.product-card-ifno {
    margin-top: 20px;
}

.breadcrumb {
    height: 48px;
    display: flex;
    align-items: center;
    background-color: #fff;
}

.breadcrumb2 {
    margin-bottom: 30px;
}

.woocommerce-breadcrumb span {
    color: #232323 !important;
    font-size: 17px;
    line-height: 80%;
    font-weight: 300;
}

.woocommerce-notices-wrapper {
    display: none !important;
}

.woocommerce-notices-wrapper:empty {
    display: none;
}

.elementor-element {
    padding: 0 !important;
}

.zoozone-contact-form__notice:empty {
    display: none;
}

.woocommerce nav.woocommerce-pagination ul li {
    border: none !important;
}

.woocommerce nav.woocommerce-pagination ul li a:not(.page-numbers) {
    color: #205330 !important;
}

.woocommerce nav.woocommerce-pagination ul li a:not(.page-numbers):hover {
    background: #EEF1EF !important;
}

.zz-qty-btn.zz-qty-plus svg rect {
    fill: #fff;
}

.zz-qty-btn.zz-qty-minus svg path {
    transition: 0.2s ease;
}

.zz-qty-btn.zz-qty-minus:hover svg path {
    stroke: #fff;
}

.zz-cart-item__remove:hover {
    background: #E81E0B !important;
}

.zz-cart-item__remove svg path {
    transition: 0.2s ease;
}

.zz-cart-item__remove:hover svg path {
    fill: #fff !important;
}

.header__right,
.header__left {
    display: contents;
}

#dpd-parcel-modal {
    padding: 0!important;
}

#dpd-parcel-modal .modal-content {
    height: 90vh!important;
    width: 90vw!important;
    max-width: initial!important;
    position: absolute!important;
    top: 50%!important;
    left: 50%!important;
    transform: translate(-50%, -50%)!important;
}

#dpd-parcel-modal .form-group {
    display: none!important;
}

#dpd-parcel-modal .modal-map {
    height: calc(100% - 20px)!important;
}

@media screen and (max-width: 782px) {
    .admin-bar .site-header {
        top: 10px;
        /* 46px mobile admin bar - 36px topbar = 10px */
    }
}

.header-topbar {
    background-color: var(--color-laser-lemon);
    height: 36px;
}

.header-topbar__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 100%;
}

/* Top-left nav */
.header-topbar__left .topbar-navigation,
.header-topbar__left .menu {
    display: flex;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
}

.header-topbar__left .topbar-navigation li,
.header-topbar__left .menu li {
    margin: 0;
}

.header-topbar__left .topbar-navigation a,
.header-topbar__left .menu a {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 7px 12px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--color-black);
    text-decoration: none;
    white-space: nowrap;
}

.header-topbar__left .topbar-navigation a:hover,
.header-topbar__left .menu a:hover {
    color: var(--color-everglades);
}

/* Topbar вЂ” dropdown for items with children */
.header-topbar__left .topbar-navigation li {
    position: relative;
}

.header-topbar__left .topbar-navigation .menu-item-has-children>a::after {
    content: '';
    display: inline-block;
    width: 10px;
    height: 6px;
    margin-left: 4px;
    flex-shrink: 0;
    background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%23232323' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
    transition: transform 0.2s ease;
}

.header-topbar__left .topbar-navigation li:hover>a::after {
    transform: rotate(180deg);
}

.header-topbar__left .topbar-navigation .sub-menu {
    display: none;
    position: absolute;
    top: calc(100% + 2px);
    left: 0;
    min-width: 180px;
    background: var(--color-white);
    border: 1px solid var(--color-timberwolf);
    border-radius: 8px;
    padding: 4px;
    list-style: none;
    margin: 0;
    z-index: 500;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

.header-topbar__left .topbar-navigation li:hover>.sub-menu,
.header-topbar__left .topbar-navigation li.is-open>.sub-menu {
    display: block;
}

.header-topbar__left .topbar-navigation .sub-menu li {
    position: static;
    margin: 0;
}

.header-topbar__left .topbar-navigation .sub-menu a {
    display: block;
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 400;
    white-space: nowrap;
}

.header-topbar__left .topbar-navigation .sub-menu a:hover {
    background: var(--color-spring-wood);
    color: var(--color-everglades);
}

/* Top-right */
.header-topbar__right {
    display: flex;
    align-items: center;
}

/* Contact links */
.header-contact {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--color-black);
    text-decoration: none;
    white-space: nowrap;
}

.header-contact svg {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
}

/* Language switcher */
.header-lang {
    position: relative;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px;
    cursor: pointer;
    user-select: none;
}

.header-lang svg {
    flex-shrink: 0;
}

.header-lang__current {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 14px;
    font-weight: 400;
    color: var(--color-black);
    white-space: nowrap;
}

.header-lang__dropdown {
    display: none;
    position: absolute;
    top: calc(100% + 2px);
    right: 0;
    background: var(--color-white);
    border: 1px solid var(--color-timberwolf);
    border-radius: 8px;
    padding: 4px;
    list-style: none;
    margin: 0;
    min-width: 72px;
    z-index: 200;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

.header-lang:hover .header-lang__dropdown,
.header-lang.is-open .header-lang__dropdown {
    display: block;
}

.header-lang__dropdown a {
    display: block;
    padding: 6px 12px;
    font-size: 14px;
    font-weight: 400;
    color: var(--color-black);
    text-decoration: none;
    border-radius: 6px;
    white-space: nowrap;
}

.header-lang__dropdown a:hover,
.header-lang__dropdown a[aria-current] {
    background: var(--color-spring-wood);
    color: var(--color-everglades);
}

/* ============================================================
   Header вЂ” Main Nav  (bg #205330, h=80px)
   ============================================================ */

.header-main {
    background-color: var(--color-everglades);
    height: 80px;
    display: flex;
    align-items: center;
}

.header-main__inner {
    display: flex;
    align-items: center;
    height: 100%;
    gap: 60px;
}

/* Logo */
.header-logo {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
}

.header-logo a {
    display: flex;
    align-items: center;
    text-decoration: none;
}

.header-logo img,
.header-logo svg {
    display: block;
    width: 270px;
    height: 30px;
    object-fit: contain;
}

.header-logo__text {
    font-size: 24px;
    font-weight: 700;
    color: var(--color-white);
    text-decoration: none;
    letter-spacing: -0.01em;
}

/* Search */
.header-search {
    flex: 1 1 0;
    display: flex;
    align-items: center;
    gap: 10px;
    height: 48px;
    padding: 12px 20px;
    background-color: var(--color-spring-wood);
    border-radius: 999px;
    border: 2px solid #D6DBD8;
    transition: 0.2s ease;
}

.header-search:hover {
    border-color: #E8720B;
}

.header-search__input {
    flex: 1 1 0;
    min-width: 0;
    border: none;
    background: transparent;
    outline: none;
    font-family: var(--font-main);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--color-black);
}

.header-search__input::placeholder {
    color: var(--color-natural-gray);
}

.header-search__btn {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: none;
    background: transparent;
    cursor: pointer;
    line-height: 0;
}

.header-search__btn svg {
    width: 24px;
    height: 24px;
}

/* ── Live search dropdown ────────────────────────────────────── */

.header-search {
    position: relative;
}

.header-search__dropdown {
    display: none;
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #EAEEEB;
    border-radius: 16px;
    box-shadow: 0 8px 32px rgba(32, 83, 48, 0.10);
    z-index: 1000;
    overflow: hidden;
    max-height: 480px;
    overflow-y: auto;
}

.header-search__dropdown.is-open {
    display: block;
}

/* Section label */
.zz-search-section {
    padding: 4px 0;
}

.zz-search-section+.zz-search-section {
    border-top: 1px solid #EAEEEB;
}

.zz-search-section__label {
    display: block;
    padding: 10px 20px 4px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #8C8F8D;
}

/* Category row */
.zz-search-cat {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 20px;
    text-decoration: none;
    transition: background 0.12s;
}

.zz-search-cat:hover {
    background: #F6FBF7;
}

.zz-search-cat__img {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    object-fit: cover;
    flex-shrink: 0;
    background: #EAEEEB;
}

.zz-search-cat__img--placeholder {
    display: block;
}

.zz-search-cat__name {
    flex: 1;
    font-size: 14px;
    font-weight: 500;
    color: #232323;
}

.zz-search-cat__count {
    font-size: 12px;
    color: #8C8F8D;
}

/* Product row */
.zz-search-product {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 20px;
    text-decoration: none;
    transition: background 0.12s;
}

.zz-search-product:hover {
    background: #F6FBF7;
}

.zz-search-product__img {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    object-fit: cover;
    flex-shrink: 0;
    background: #EAEEEB;
}

.zz-search-product__info {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.zz-search-product__name {
    font-size: 14px;
    font-weight: 500;
    color: #232323;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.zz-search-product__price {
    font-size: 13px;
    color: #205330;
    font-weight: 600;
}

/* No results */
.zz-search-empty {
    padding: 20px;
    font-size: 14px;
    color: #8C8F8D;
    text-align: center;
}

/* "See all results" footer link */
.zz-search-all {
    display: block;
    padding: 12px 20px;
    border-top: 1px solid #EAEEEB;
    font-size: 13px;
    font-weight: 500;
    color: #205330;
    text-decoration: none;
    text-align: center;
    transition: background 0.12s;
}

.zz-search-all:hover {
    background: #F6FBF7;
}

/* Header actions */
.header-actions {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 6px;
}

.header-actions__login {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: transparent;
    border: none;
    cursor: pointer;
    font-family: var(--font-main);
    font-size: 16px;
    font-weight: 600;
    line-height: 1.125;
    color: var(--color-spring-wood);
    text-decoration: none;
    white-space: nowrap;
    border-radius: 100px;
    transition: 0.2s ease;
}

.header-actions__login svg {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
}

.header-actions__cart {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    background: var(--color-spring-wood);
    border-radius: 999px;
    font-family: var(--font-main);
    font-size: 16px;
    font-weight: 600;
    line-height: 1.125;
    color: var(--color-everglades);
    text-decoration: none;
    white-space: nowrap;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
    position: relative;
    border: 2px solid #E1E5E3;
}

.header-actions__cart:hover {
    background-color: #e8720b;
    color: #fff;
    border-color: #e8720b;
}

.header-actions__cart svg {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
}

.header-actions__cart svg path {
    transition: 0.2s ease;
}

.header-actions__cart:hover svg path {
    fill: #fff;
}

.header-actions__cart-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    background: #E80B0B;
    color: #F6FBF8;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    position: absolute;
    left: 23px;
    top: 4px;
    transition: 0.2s ease;
}

.header-actions__cart:hover .header-actions__cart-count {
    background: #205330;
}

/* ============================================================
   Header вЂ” Bottom Nav  (bg #F6FBF8, h=62px)
   ============================================================ */

.header-bottom {
    background-color: var(--color-spring-wood);
    height: 62px;
}

.header-cat-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 62px;
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
    -webkit-mask-image: linear-gradient(to right, transparent 0, #000 32px, #000 calc(100% - 32px), transparent 100%);
    mask-image: linear-gradient(to right, transparent 0, #000 32px, #000 calc(100% - 32px), transparent 100%);
}

.header-cat-nav::-webkit-scrollbar {
    display: none;
}

.header-cat-nav__list {
    display: flex;
    align-items: center;
    gap: 6px;
    list-style: none;
    margin: 0;
    padding: 0 28px;
    flex-wrap: nowrap;
}

.header-cat-nav__item {
    margin: 0;
}

.header-cat-nav__link {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.375;
    color: var(--color-everglades);
    text-decoration: none;
    border-radius: 999px;
    white-space: nowrap;
    transition: background-color 0.2s ease;
}

.header-cat-nav__link:hover {
    background-color: rgba(32, 83, 48, 0.08);
    color: var(--color-everglades);
}

.header-cat-nav__link--special {
    color: var(--color-christine);
}

.header-cat-nav__link--special:hover {
    background-color: rgba(232, 114, 11, 0.08);
    color: var(--color-christine);
}

.header-cat-nav__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 20px;
    height: 20px;
}

.header-cat-nav__icon svg {
    width: 20px;
    height: 20px;
}




a {
    color: var(--color-primary);
    text-decoration: none;
    transition: color 0.3s ease;
}

.header-actions__login:hover {
    background: rgb(255 255 255 / 11%);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 700;
    margin-bottom: calc(var(--spacing-unit) * 0.5);
    color: var(--color-dark);
}

h1 {
    font-size: 2.5rem;
}

h2 {
    font-size: 2rem;
}

h3 {
    font-size: 1.5rem;
}



/* ── Auth modal ────────────────────────────────────────────────── */
@keyframes zzFadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes zzSlideUp {
    from {
        opacity: 0;
        transform: translateY(24px) scale(0.97);
    }

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

/* ── Global checkbox ────────────────────────────────────── */
input[type="checkbox"] {
    -webkit-appearance: none;
    appearance: none;
    width: 22px;
    height: 22px;
    min-width: 22px;
    background: #FFFFFF;
    border: 2px solid #D6DBD8;
    border-radius: 6px;
    cursor: pointer;
    flex-shrink: 0;
    vertical-align: middle;
    transition: border-color 0.15s, background-color 0.15s;
    box-sizing: border-box;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 14px 11px;
}

input[type="checkbox"]:hover {
    border-color: #E8720B;
}

input[type="checkbox"]:checked {
    background-color: #E8720B;
    border-color: #E8720B;
    background-image: url("data:image/svg+xml,%3Csvg width='14' height='11' viewBox='0 0 14 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.2639 0.414249C11.6679 -0.0727602 12.3899 -0.140014 12.8771 0.263858C13.3641 0.6678 13.4313 1.38987 13.0274 1.87698L6.18735 10.127C5.97713 10.3805 5.66793 10.5309 5.33872 10.5406C5.00955 10.5501 4.69235 10.4179 4.46771 10.1771L0.307797 5.71731C-0.123643 5.25454 -0.0984947 4.52951 0.364193 4.09792C0.826914 3.66652 1.55198 3.69177 1.98358 4.15432L5.25457 7.66075L11.2639 0.414249Z' fill='white'/%3E%3C/svg%3E");
}

.zoozone-auth-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 16px;
}

.zoozone-auth-modal.is-open {
    display: flex;
}

.zoozone-auth-modal.is-open .zoozone-auth-modal__overlay {
    animation: zzFadeIn 0.25s ease both;
}

.zoozone-auth-modal.is-open .zoozone-auth-modal__panel {
    animation: zzSlideUp 0.3s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.zoozone-auth-modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(35, 35, 35, 0.6);
}

.zoozone-auth-modal__panel {
    position: relative;
    width: min(520px, 100%);
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.18);
    z-index: 1;
    max-height: calc(100vh - 32px);
    overflow-y: auto;
}

.zoozone-auth-modal__close {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 24px;
    height: 24px;
    border: none;
    background: none;
    padding: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
}

.zoozone-auth-modal__close svg path {
    transition: fill 0.15s;
}

.zoozone-auth-modal__close:hover svg path {
    fill: #E8720B;
}

/* Views (main / forgot-password) */
.zoozone-auth-view {
    display: none;
}

.zoozone-auth-view--active {
    display: block;
    animation: zzSlideUp 0.25s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.zoozone-auth-modal__content {
    padding: 40px 40px 25px;
}

/* Forms */
.zoozone-auth-form {
    display: none;
    flex-direction: column;
    gap: 10px;
}

.zoozone-auth-form--active {
    display: flex;
}

/* Title: 22px/600/26.4px/#232323 */
.zoozone-auth-form__title {
    margin: 0 0 12px;
    font-size: 22px;
    font-weight: 600;
    line-height: 26.4px;
    color: #232323;
    text-align: center;
}

.zoozone-auth-form__row {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.zoozone-auth-form__row--split {
    flex-direction: row;
}

.zoozone-auth-form__row--split>input {
    flex: 1 1 0;
    min-width: 0;
}

/* Inputs: h=60px, bg=#f6fbf7, border 1px #eaeeeb, r=12px, p=0 20px, 16px/300 */
.zoozone-auth-form input[type="text"],
.zoozone-auth-form input[type="email"],
.zoozone-auth-form input[type="password"],
.zoozone-auth-form input[type="tel"] {
    width: 100%;
    height: 60px;
    padding: 0 20px;
    border-radius: 12px;
    border: 1px solid #eaeeeb;
    background: #f6fbf7;
    font-size: 16px;
    font-weight: 300;
    color: #232323;
    outline: none;
    transition: border-color 0.15s;
    box-sizing: border-box;
}

.zoozone-auth-form input[type="text"]:hover,
.zoozone-auth-form input[type="email"]:hover,
.zoozone-auth-form input[type="password"]:hover,
.zoozone-auth-form input[type="tel"]:hover {
    border-color: #205330;
}

.zoozone-auth-form input[type="text"]:focus,
.zoozone-auth-form input[type="email"]:focus,
.zoozone-auth-form input[type="password"]:focus,
.zoozone-auth-form input[type="tel"]:focus {
    border-color: #205330;
}

.zoozone-auth-form input::placeholder {
    color: #8c8f8d;
    font-weight: 300;
}

/* Remember me + Forgot password row */
.zoozone-auth-form__meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.zoozone-auth-form__checkbox {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
    font-weight: 300;
    color: #232323;
    cursor: pointer;
}

.zoozone-auth-form__checkbox input[type="checkbox"] {
    margin: 0;
}

.zoozone-auth-form__forgot {
    color: #205330;
    text-decoration: none;
    font-size: 14px;
    font-weight: 400;
}

.zoozone-auth-form__forgot:hover {
    text-decoration: underline;
}

/* Submit button: full width, 52px, green pill */
.zz-auth-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 52px;
    margin-top: 10px;
    background: #2cb761;
    color: #ffffff;
    font-size: 16px;
    font-weight: 600;
    line-height: 18px;
    border: none;
    border-radius: 1000px;
    cursor: pointer;
    transition: background 0.15s;
}

.zz-auth-btn:hover {
    background: #E8720B;
}

.zoozone-auth-form__notice {
    margin: 0;
    min-height: 16px;
    font-size: 13px;
    font-weight: 400;
    color: #e71d0b;
    text-align: center;
}

.zoozone-auth-form__notice:empty {
    display: none;
}

.zoozone-auth-form__notice.is-success {
    color: #205330;
}

/* Divider: lines + "or continue with" text */
.zoozone-auth-modal__divider {
    position: relative;
    text-align: center;
    margin: 16px 0 6px;
}

.zoozone-auth-modal__divider span {
    position: relative;
    z-index: 1;
    background: #ffffff;
    padding: 0 12px;
    color: #8c8f8d;
    font-size: 14px;
    font-weight: 300;
}

.zoozone-auth-modal__divider::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 1px;
    background: #eaeeeb;
    transform: translateY(-50%);
}

/* Social buttons: white, border #e1e5e3, pill, 48px, 16px/600 */
.zoozone-auth-social-buttons {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.zoozone-auth-social-button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    height: 48px;
    border-radius: 1000px;
    border: 1.5px solid #e1e5e3;
    background: #ffffff;
    color: #232323;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
}

.zoozone-auth-social-button:hover {
    background: #e1e5e3;
    border-color: #e1e5e3;
}

/* Switch link: "Don't have an account? Register" */
.zoozone-auth-form__switch {
    margin: 16px 0 0;
    text-align: center;
    font-size: 14px;
    font-weight: 300;
    color: #8c8f8d;
}

.zoozone-auth-switch-btn {
    background: none;
    border: none;
    padding: 0;
    font-size: 14px;
    font-weight: 400;
    color: #232323;
    cursor: pointer;
}

.zoozone-auth-switch-btn:hover {
    color: #232323;
    text-decoration: underline;
    text-underline-offset: 5px;
}

/* Forgot password subtitle */
.zoozone-auth-forgot-desc {
    margin: -8px 0 4px;
    font-size: 14px;
    font-weight: 300;
    line-height: 20px;
    color: #4d4e4d;
}

@media (max-width: 540px) {
    .zoozone-auth-modal__content {
        padding: 28px 24px 24px;
    }

    .zoozone-auth-form__row--split {
        flex-direction: column;
    }

    .zoozone-auth-social-buttons {
        grid-template-columns: 1fr 1fr;
    }
}


main.site-content {
    min-height: calc(100vh - 260px);
    /* padding: calc(var(--spacing-unit) * 2) 0; */
    background-color: #F6FBF8;
}

/* ============================================================
   Shop Archive
   ============================================================ */

.woocommerce-breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    font-size: 13px !important;
    font-weight: 400;
    line-height: 1.4;
    color: #8C8F8D !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: 4px;
}

.woocommerce-breadcrumb a {
    color: #232323 !important;
    text-decoration: none;
    font-size: inherit;
}

.woocommerce-breadcrumb a:hover {
    color: #205330;
}

.shop-archive-layout {
    display: grid;
    grid-template-columns: 300px minmax(0, 1fr);
    gap: 20px;
    align-items: flex-start;
    padding-bottom: 60px;
}

.shop-sidebar {
    position: sticky;
    top: 130px;
    align-self: start;
    max-height: calc(100vh - 110px);
    overflow-y: auto;
    scrollbar-width: none;
}

.shop-sidebar::-webkit-scrollbar {
    display: none;
}

/* ---- Filter widget cards ---- */
.shop-sidebar .widget {
    background: #EAEEEC;
    border-radius: 12px;
    margin-bottom: 12px;
    overflow: hidden;
}

.shop-sidebar .widget-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px 24px;
    font-size: 17px;
    font-weight: 500;
    line-height: 1.4;
    color: #205330;
    cursor: pointer;
    user-select: none;
    margin: 0;
    transition: border-color 0.15s;
}

.shop-sidebar .widget.is-closed .widget-title {
    border-bottom-color: transparent;
}

.shop-sidebar .widget-title::after {
    content: '−';
    font-size: 20px;
    font-weight: 500;
    color: #205330;
    line-height: 1;
    flex-shrink: 0;
}

.shop-sidebar .widget.is-closed .widget-title::after {
    content: '+';
}

/* Hide widget body when collapsed */
.shop-sidebar .widget.is-closed>*:not(.widget-title) {
    display: none;
}

/* Content padding for all widget bodies */
.shop-sidebar .widget>*:not(.widget-title) {
    padding: 0 18px 18px;
}

/* ---- WooCommerce Layered Nav (attribute filter) ---- */
.woocommerce-widget-layered-nav-list__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.woocommerce-widget-layered-nav-list__item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.woocommerce-widget-layered-nav-list__item a {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    font-weight: 400;
    color: #232323;
    text-decoration: none;
    line-height: 1.4;
    flex: 1;
}

/* Fake checkbox */
.woocommerce-widget-layered-nav-list__item a::before {
    content: '';
    display: inline-flex;
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    border: 1.5px solid #D6DBD8;
    border-radius: 4px;
    background: #fff;
}

.woocommerce-widget-layered-nav-list__item--chosen a::before {
    background: #205330;
    border-color: #205330;
    background-image: url("data:image/svg+xml,%3Csvg width='12' height='9' viewBox='0 0 12 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 4L4.5 7.5L11 1' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
}

.woocommerce-widget-layered-nav-list__item .count {
    font-size: 12px;
    color: #8C8F8D;
    font-weight: 300;
}

/* ---- Active filter chips ---- */
.zz-active-filters {
    margin-bottom: 16px;
}

.zz-active-filters__heading {
    font-size: 14px;
    font-weight: 500;
    color: #232323;
    margin: 0 0 10px;
}

.zz-active-filters__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.zz-clear-all {
    display: inline-flex;
    align-items: center;
    padding: 6px 14px;
    border: 1.5px solid #232323;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 500;
    color: #232323;
    text-decoration: none;
    white-space: nowrap;
    line-height: 1.4;
    transition: background 0.15s, color 0.15s;
}

.zz-clear-all:hover {
    background: #232323;
    color: #fff;
}

.zz-filter-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 8px 5px 12px;
    background: #fff;
    border: 1.5px solid #D6DBD8;
    border-radius: 20px;
    font-size: 13px;
    color: #232323;
    white-space: nowrap;
    line-height: 1.4;
}

.zz-filter-chip__remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #EAEEEC;
    color: #232323;
    text-decoration: none;
    font-size: 15px;
    line-height: 1;
    flex-shrink: 0;
    transition: background 0.15s, color 0.15s;
}

.zz-filter-chip__remove:hover {
    background: #205330;
    color: #fff;
}

/* ---- Custom Price Filter Widget ---- */
.zz-price-widget .zz-price-inputs {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
}

.zz-price-input-box {
    display: flex;
    align-items: center;
    gap: 4px;
    background: #fff;
    border: 1.5px solid #D6DBD8;
    border-radius: 8px;
    padding: 10px 12px;
    flex: 1;
    min-width: 0;
    transition: border-color 0.15s;
}

.zz-price-input-box:focus-within {
    border-color: #205330;
}

.zz-price-prefix {
    font-size: 14px;
    color: #8C8F8D;
    flex-shrink: 0;
    line-height: 1;
}

.zz-price-input-box input[type="number"] {
    border: none;
    background: transparent;
    padding: 0;
    margin: 0;
    font-size: 14px;
    color: #232323;
    width: 100%;
    outline: none;
    font-family: inherit;
    line-height: 1;
    -moz-appearance: textfield;
}

.zz-price-input-box input[type="number"]::-webkit-inner-spin-button,
.zz-price-input-box input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.zz-price-sep {
    font-size: 14px;
    color: #8C8F8D;
    flex-shrink: 0;
    padding: 0 2px;
}

/* Dual-range slider */
.zz-price-slider-track {
    position: relative;
    height: 4px;
    background: #E1E5E3;
    border-radius: 999px;
    margin: 10px 0 6px;
}

.zz-price-slider-range {
    position: absolute;
    height: 100%;
    background: #E8720B;
    border-radius: 999px;
    pointer-events: none;
}

.zz-range-min,
.zz-range-max {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 4px;
    transform: translateY(-50%);
    -webkit-appearance: none;
    appearance: none;
    background: transparent;
    outline: none;
    pointer-events: none;
    margin: 0;
}

.zz-range-min::-webkit-slider-thumb,
.zz-range-max::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid #E8720B;
    cursor: grab;
    pointer-events: all;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.zz-range-min::-moz-range-thumb,
.zz-range-max::-moz-range-thumb {
    appearance: none;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid #E8720B;
    cursor: grab;
    pointer-events: all;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.zz-range-min::-webkit-slider-runnable-track,
.zz-range-max::-webkit-slider-runnable-track {
    background: transparent;
}

.zz-range-min::-moz-range-track,
.zz-range-max::-moz-range-track {
    background: transparent;
}

.zz-range-max {
    z-index: 1;
}

/* ---- Shop archive header ---- */
.shop-archive-header {
    margin-bottom: 30px;
}

.shop-archive-header .page-title {
    font-size: 32px;
    font-weight: 600;
    line-height: 1.2;
    color: #232323;
    margin: 0;
}

/* ---- Controls bar (result count + ordering) ---- */
.shop-archive-controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.shop-archive-controls .woocommerce-result-count {
    font-size: 14px;
    font-weight: 400;
    color: #8C8F8D;
    margin: 0;
}

.shop-archive-controls .woocommerce-ordering {
    margin: 0;
}

.shop-archive-controls .woocommerce-ordering select {
    appearance: none;
    -webkit-appearance: none;
    padding: 8px 36px 8px 14px;
    border: 1px solid #E1E5E3;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 400;
    color: #232323;
    background: #fff url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%23232323' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 14px center;
    cursor: pointer;
    outline: none;
    font-family: inherit;
}

/* ---- Products grid ---- */
.shop-products .products {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.shop-products .products .product {
    display: flex;
}

.shop-products .products .product .zoozone-product-card {
    width: 100%;
}

/* Override WooCommerce default archive button styles on our custom button */
.shop-products .products .product-card-button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 40px !important;
    padding: 10px 26px !important;
    border-radius: 1000px !important;
    background: #2CB862 !important;
    color: #FFFFFF !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    text-decoration: none !important;
    border: none !important;
    box-shadow: none !important;
    margin-top: auto !important;
}

.shop-products .products .product-card-button:hover {
    background: #23a055 !important;
}

.shop-products .products .product-card-button.is-disabled {
    background: #D6DBD8 !important;
    color: #8C8F8D !important;
    cursor: not-allowed !important;
    pointer-events: none !important;
}

/* Hide WooCommerce's injected "View cart" link after AJAX add-to-cart */
.shop-products .products .added_to_cart.wc-forward {
    display: none !important;
}

/* ---- Pagination ---- */
.shop-products .woocommerce-pagination {
    margin-top: 32px;
}

.woocommerce-pagination .page-numbers {
    display: flex !important;
    justify-content: center;
    align-items: center;
    gap: 4px;
    list-style: none;
    padding: 0 !important;
    margin: 0 !important;
    flex-wrap: wrap;
    border: none !important;
}

.woocommerce-pagination .page-numbers li {
    display: flex;
}

.woocommerce-pagination .page-numbers li>a,
.woocommerce-pagination .page-numbers li>span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0 10px;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 400;
    color: #232323;
    text-decoration: none;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
    border-radius: 50%;
    display: flex !important;
    justify-content: center;
    align-items: center;
}

.woocommerce-pagination .page-numbers li>.current {
    background: #205330 !important;
    color: #FFFFFF !important;
    font-weight: 600;
    border: none;
}

.woocommerce-pagination .page-numbers li>a:hover {
    background: #F6FBF8;
    border-color: #205330;
}

.woocommerce-pagination .page-numbers li>.dots {
    border-color: transparent;
    background: none;
    color: #8C8F8D;
}

/* Prev / Next arrow buttons */
.woocommerce-pagination .page-numbers li>a.prev,
.woocommerce-pagination .page-numbers li>a.next {
    width: 44px;
    height: 44px;
    background-color: #EEF1EF;
    font-size: 0;
    flex-shrink: 0;
    transition: background-color 0.15s;
}

.woocommerce-pagination .page-numbers li>a.prev::after,
.woocommerce-pagination .page-numbers li>a.next::after {
    content: '';
    display: block;
    width: 7px;
    height: 12px;
    transition: background-color 0.15s;
}

.woocommerce-pagination .page-numbers li>a.prev::after {
    background-color: #8C8F8D;
    -webkit-mask: url("data:image/svg+xml,<svg width='7' height='12' viewBox='0 0 7 12' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M6 11L1 6L6 1' stroke='black' stroke-width='2' stroke-miterlimit='3.8637' stroke-linecap='round' stroke-linejoin='round'/></svg>") center / contain no-repeat;
    mask: url("data:image/svg+xml,<svg width='7' height='12' viewBox='0 0 7 12' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M6 11L1 6L6 1' stroke='black' stroke-width='2' stroke-miterlimit='3.8637' stroke-linecap='round' stroke-linejoin='round'/></svg>") center / contain no-repeat;
    transform: translateX(-3px);
}

.woocommerce-pagination .page-numbers li>a.next::after {
    background-color: #205330;
    -webkit-mask: url("data:image/svg+xml,<svg width='7' height='12' viewBox='0 0 7 12' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M1 11L6 6L1 1' stroke='black' stroke-width='2' stroke-miterlimit='3.8637' stroke-linecap='round' stroke-linejoin='round'/></svg>") center / contain no-repeat;
    mask: url("data:image/svg+xml,<svg width='7' height='12' viewBox='0 0 7 12' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M1 11L6 6L1 1' stroke='black' stroke-width='2' stroke-miterlimit='3.8637' stroke-linecap='round' stroke-linejoin='round'/></svg>") center / contain no-repeat;
}

.woocommerce-pagination .page-numbers li>a.prev:hover,
.woocommerce-pagination .page-numbers li>a.next:hover {
    background-color: #E8720B;
}

.woocommerce-pagination .page-numbers li>a.prev:hover::after,
.woocommerce-pagination .page-numbers li>a.next:hover::after {
    background-color: #fff;
}

.posts-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: var(--spacing-unit);
    margin-bottom: calc(var(--spacing-unit) * 2);
}

.post-card {
    background: white;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    overflow: hidden;
    transition: transform 0.3s, box-shadow 0.3s;
}

.post-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.post-card-image img {
    width: 100%;
    height: 200px;
    object-fit: cover;
}

.post-card-content {
    padding: var(--spacing-unit);
}

.post-card-title {
    margin: 0 0 0.5rem;
    font-size: 1.3rem;
}

.post-card-meta,
.post-card-excerpt,
.post-card-footer {
    margin-bottom: 0.8rem;
}

.read-more {
    color: var(--color-primary);
    font-weight: 600;
}

/* ============================================================
   Footer
   ============================================================ */

.site-footer {
    background: #FFFFFF;
}

.footer-main {
    padding: 80px 40px;
}

.footer-inner {
    max-width: 1296px;
    margin: 0 auto;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 60px;
}

.footer-col {
    display: flex;
    flex-direction: column;
}

.footer-col--social {
    flex: 0 0 306px;
    padding-right: 40px;
    box-sizing: border-box;
    gap: 20px;
}

.footer-col--cats,
.footer-col--support {
    flex: 1;
    gap: 10px;
}

.footer-col--contact {
    flex: 0 0 306px;
    gap: 30px;
}

.footer-col-title {
    font-size: 18px;
    font-weight: 600;
    color: #232323;
    line-height: 120%;
}

.footer-social-text {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.footer-col-desc {
    font-size: 14px;
    font-weight: 300;
    color: #4D4E4D;
    line-height: 140%;
}

.footer-social-icons {
    display: flex;
    flex-direction: row;
    gap: 8px;
}

.footer-social-btn {
    width: 40px;
    height: 40px;
    background: #EAEEEC;
    border-radius: 1000px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background 0.2s;
}

.footer-social-btn:hover {
    background: #d5dbd8;
}

/* Nav menu ul from wp_nav_menu */
.footer-links,
.footer-links ul {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin: 0;
    padding: 0;
}

.footer-links li a,
.footer-links>li>a {
    font-size: 15px;
    font-weight: 400;
    color: #4D4E4D;
    text-decoration: none;
    line-height: 140%;
}

.footer-links li a:hover {
    color: #205330;
}

.footer-contacts {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.footer-contact-block {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.footer-phone,
.footer-email {
    font-size: 22px;
    font-weight: 600;
    color: #205330;
    text-decoration: none;
    line-height: 120%;
}

.footer-phone:hover,
.footer-email:hover {
    text-decoration: underline;
}

.footer-contact-sub {
    font-size: 14px;
    font-weight: 300;
    color: #4D4E4D;
    line-height: 140%;
}

.footer-company {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.footer-company-name {
    font-size: 16px;
    font-weight: 500;
    color: #1C1C21;
    line-height: 140%;
}

.footer-company-info {
    font-size: 15px;
    font-weight: 300;
    color: #4D4E4D;
    line-height: 140%;
}

.footer-bottom {
    border-top: 1px solid #E1E5E3;
    padding: 20px 40px;
}

.footer-bottom-inner {
    max-width: 1296px;
    margin: 0 auto;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.footer-copyright {
    font-size: 13px;
    font-weight: 300;
    color: #8C8F8D;
    line-height: 140%;
}

.footer-payment {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.footer-payment svg {
    display: block;
}

/* ============================================================
   Brands Widget
   ============================================================ */

.zoozone-brands-section {
    padding: 50px 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 30px;
}

.zoozone-brands-header {
    width: 100%;
    max-width: 1296px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 30px;
}

.zoozone-brands-title {
    font-size: 26px;
    font-weight: 600;
    color: #232323;
}

.zoozone-brands-see-all {
    border: 2px solid #E1E5E3;
    border-radius: 1000px;
    padding: 10px 26px;
    font-size: 14px;
    font-weight: 600;
    color: #232323;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    transition: border-color 0.2s, color 0.2s;
}

.zoozone-brands-see-all:hover {
    border-color: #205330;
    color: #205330;
}

.zoozone-brands-grid {
    width: 100%;
    max-width: 1296px;
    box-sizing: border-box;
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 14px;
}

.zoozone-brand-card {
    aspect-ratio: 180 / 100;
    background: #FFFFFF;
    border-radius: 12px;
    border: 1px solid #E1E5E3;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
    box-sizing: border-box;
    overflow: hidden;
    transition: box-shadow 0.2s;
}

.zoozone-brand-card:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}

.zoozone-brand-card img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* ============================================================
   Fly-to-cart animation
   ============================================================ */

/* Cart icon swing when item lands */
@keyframes zz-cart-pop {
    0% {
        transform: scale(1) rotate(0deg);
    }

    20% {
        transform: scale(1.18) rotate(-12deg);
    }

    45% {
        transform: scale(1.1) rotate(10deg);
    }

    65% {
        transform: scale(1.04) rotate(-5deg);
    }

    80% {
        transform: scale(1.02) rotate(2deg);
    }

    100% {
        transform: scale(1) rotate(0deg);
    }
}

.cart-pop {
    animation: zz-cart-pop 0.65s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
    transform-origin: top center;
}

/* Badge counter bounce */
@keyframes zz-badge-pop {
    0% {
        transform: scale(1);
    }

    40% {
        transform: scale(1.7);
    }

    65% {
        transform: scale(0.85);
    }

    85% {
        transform: scale(1.1);
    }

    100% {
        transform: scale(1);
    }
}

.header-actions__cart-count.cart-count-pop {
    animation: zz-badge-pop 0.65s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
}

/* Hidden state (count = 0) */
.header-actions__cart-count.is-hidden {
    display: none;
}

.no-posts-found,
.error-404 {
    padding: var(--spacing-unit) 0;
}

@media (max-width: 1100px) {
    .shop-archive-layout {
        grid-template-columns: 220px minmax(0, 1fr);
        gap: 24px;
    }

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

@media (max-width: 900px) {
    .shop-archive-layout {
        grid-template-columns: 1fr;
    }

    .shop-sidebar {
        position: static;
        max-height: none;
        overflow: visible;
    }

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

@media (max-width: 768px) {
    h1 {
        font-size: 1.8rem;
    }

    h2 {
        font-size: 1.4rem;
    }

    .posts-grid {
        grid-template-columns: 1fr;
    }

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

@media (max-width: 480px) {
    .shop-products .products {
        grid-template-columns: 1fr;
    }
}

/* ── Mobile filter toggle button — hidden on desktop ── */
.zz-filter-toggle {
    display: none;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
    padding: 12px 16px;
    background: #fff;
    border: 2px solid #E1E5E3;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 600;
    color: #232323;
    cursor: pointer;
    margin: 30px 0 0;
}

.zz-filter-toggle__label {
    display: flex;
    align-items: center;
    gap: 8px;
}

.zz-filter-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 5px;
    border-radius: 50%;
    background: #e7720b;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
}

@media (max-width: 1024px) {

    /* Show filter button, hide desktop sidebar */
    .zz-filter-toggle {
        display: flex;
    }

    .shop-archive-layout {
        grid-template-columns: 1fr;
    }

    aside.shop-sidebar {
        display: none;
    }

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

/* ── Filter drawer ── */
.zz-filter-drawer {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 9500;
}

.zz-filter-drawer.is-visible {
    display: block;
}

.zz-filter-drawer__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    opacity: 0;
    transition: opacity 0.35s ease;
}

.zz-filter-drawer.is-open .zz-filter-drawer__overlay {
    opacity: 1;
}

.zz-filter-drawer__panel {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: min(400px, 100vw);
    background: #fff;
    display: flex;
    flex-direction: column;
    transform: translateX(-100%);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    overflow: hidden;
}

.zz-filter-drawer.is-open .zz-filter-drawer__panel {
    transform: translateX(0);
}

/* Head */
.zz-filter-drawer__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 30px 30px 15px;
    flex-shrink: 0;
}

.zz-filter-drawer__title {
    font-size: 22px;
    font-weight: 600;
    color: #232323;
}

.zz-filter-drawer__close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: none;
    cursor: pointer;
    color: #232323;
    padding: 0;
}

/* Scrollable filter list */
.zz-filter-drawer__scroll {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    padding: 16px;
    width: 100%;
}

/* drawer scroll area reuses .shop-sidebar styles — reset layout-only props */
.zz-filter-drawer__scroll.shop-sidebar {
    position: static;
    top: auto;
    max-height: none;
    overflow-y: auto;
    padding: 15px 30px 30px;
}

/* Closing animation */
.zz-filter-drawer.is-closing .zz-filter-drawer__overlay {
    opacity: 0;
}

/* ============================================================
   Header вЂ” Responsive
   ============================================================ */

@media (max-width: 1200px) {
    .header-main__inner {
        gap: 24px;
    }

    .header-logo img,
    .header-logo svg {
        width: 200px;
    }
}

@media (max-width: 992px) {
    .header-cat-nav__link {
        padding: 8px 12px;
        font-size: 14px;
    }

    .header-cat-nav__icon svg {
        width: 18px;
        height: 18px;
    }
}

@media (max-width: 768px) {

    /* Top bar */
    .header-topbar {
        height: auto;
        min-height: 36px;
    }

    .header-topbar__inner {
        flex-wrap: wrap;
        gap: 4px;
        padding: 4px 0;
    }

    .header-topbar__left {
        width: 100%;
    }

    .header-topbar__right {
        width: 100%;
        justify-content: flex-end;
    }

    .header-search {
        order: 3;
        width: 100%;
        flex: 1 1 100%;
    }

    /* Bottom nav */
    .header-bottom {
        height: auto;
    }

    .header-cat-nav {
        height: auto;
        padding: 8px 0;
        justify-content: flex-start;
    }
}

@media (max-width: 480px) {

    .header-logo img,
    .header-logo svg {
        width: 140px;
        height: 22px;
    }
}


/* =========================================
   CATEGORY PRODUCTS SLIDER  (Figma: Products)
   ========================================= */

.zoozone-category-products-slider {
    padding: 50px 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 30px;
}

/* Header: title + "See all" button */
.zoozone-products-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    max-width: 1296px;
    padding: 0;
    box-sizing: border-box;
    margin-bottom: 30px;
}

.zoozone-products-title {
    margin: 0;
    font-size: 26px;
    font-weight: 600;
    line-height: 1.2;
    color: #232323;
}

.zoozone-products-see-all {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 26px;
    height: 40px;
    border: 2px solid #E1E5E3;
    border-radius: 1000px;
    font-size: 14px;
    font-weight: 600;
    color: #232323;
    text-decoration: none;
    white-space: nowrap;
    transition: border-color 0.2s ease, color 0.2s ease, background-color 0.2s ease;
}

.zoozone-products-see-all:hover {
    border-color: #E8720B;
    color: #fff;
    background-color: #E8720B;
}

/* Track: [←] [swiper] [→] */
.zoozone-products-track {
    display: flex;
    align-items: center;
    gap: 30px;
    width: 100%;
    max-width: 1444px;
    box-sizing: border-box;
    position: relative;
}

.zoozone-products-swiper {
    flex: 1;
    min-width: 0;
    overflow: hidden;
}

/* Arrows */
.zoozone-products-prev,
.zoozone-products-next {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #EAEEEC;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s ease;
    padding: 0;
    position: absolute;
}

.zoozone-products-prev {
    left: -74px;
}

.zoozone-products-next {
    right: -74px;
}

.zoozone-products-prev:hover,
.zoozone-products-next:hover {
    background: #E8720B;
}

.zoozone-products-prev::after,
.zoozone-products-next::after {
    content: '';
    display: block;
    width: 20px;
    height: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    transition: 0.2s ease;
}

.zoozone-products-prev:hover::after,
.zoozone-products-next:hover::after {
    filter: brightness(10);
}

.zoozone-products-prev::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M12.5 15L7.5 10L12.5 5' stroke='%238C8F8D' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.zoozone-products-next::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M7.5 5L12.5 10L7.5 15' stroke='%23205330' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.zoozone-products-prev.swiper-button-disabled,
.zoozone-products-next.swiper-button-disabled {
    opacity: 0.4;
    cursor: default;
}

/* ---- Product card ---- */
.zoozone-products-swiper .swiper-slide {
    height: auto;
}

.zoozone-product-card {
    position: relative;
    background: #FFFFFF;
    border-radius: 16px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: 100%;
    box-sizing: border-box;
    transition: 0.2s ease;
}

.zoozone-product-card:hover {
    box-shadow: 0px 8px 32px 0px #00000026;
}

/* Sale badge */
.product-card-badge {
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 1px 5px;
    border-radius: 100px;
    background: #E81E0B;
    color: #F6FBF8;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.4;
    white-space: nowrap;
}

/* Image */
.product-card-image {
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    border-radius: 8px;
    background: #f7f8f9;
}

.product-card-image a {
    display: block;
    width: 100%;
    height: 100%;
}

.product-card-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

/* Content area */
.product-card-content {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.product-card-brand {
    margin: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    color: #232323;
}

.product-card-title {
    margin: 0;
    font-size: 13px !important;
    font-weight: 300;
    line-height: 1.4;
    color: #232323;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.product-card-title a {
    color: inherit;
    text-decoration: none;
}

.product-card-weight {
    margin: 0;
    font-size: 13px;
    font-weight: 300;
    line-height: 1.4;
    color: #8C8F8D;
}

/* Price — WooCommerce outputs ins/del tags */
.product-card-price {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.product-card-price .woocommerce-Price-amount,
.product-card-price>.amount {
    font-size: 16px;
    font-weight: 600;
    color: #205330;
    line-height: 1.4;
}

.product-card-price ins {
    text-decoration: none;
}

.product-card-price ins .woocommerce-Price-amount {
    color: #205330;
}

.product-card-price del .woocommerce-Price-amount,
.product-card-price del {
    font-size: 13px;
    font-weight: 400;
    color: #8C8F8D;
    text-decoration: line-through;
}

/* Add to cart button — pushed to bottom */
.product-card-button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 40px;
    padding: 10px 26px;
    border-radius: 1000px;
    background: #2CB862;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
    text-decoration: none;
    transition: 0.2s ease;
    margin-top: auto;
    white-space: nowrap;
}

.product-card-button:hover {
    background: #E8720B;
}

/* Responsive */
@media (max-width: 1200px) {

    /* .zoozone-products-header,
    .zoozone-products-track {
        padding: 0 20px;
        gap: 20px;
    } */
}

@media (max-width: 768px) {
    .zoozone-category-products-slider {
        padding: 32px 0;
        gap: 20px;
    }

    .zoozone-products-prev,
    .zoozone-products-next {
        width: 36px;
        height: 36px;
    }
}

/* =========================================
   PRODUCT CATEGORIES GRID  (Figma: Categories)
   ========================================= */

.zoozone-categories-section {
    padding: 50px 0;
}

.zoozone-categories-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    max-width: 1296px;
    width: 100%;
    margin: 0 auto 50px;
}

/* Subcategory grid on archive page — 4 columns */
.zz-subcat-grid {
    grid-template-columns: repeat(4, 1fr);
    margin-top: 32px;
}

@media (max-width: 1100px) {
    .zz-subcat-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 768px) {
    .zz-subcat-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) {
    .zz-subcat-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }
}

/* Card */
.zoozone-cat-card {
    position: relative;
    background: #FFFFFF;
    border-radius: 16px;
    overflow: hidden;
    cursor: pointer;
    transition: box-shadow 0.2s ease;
    min-height: 367px;
    padding: 30px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.zoozone-cat-card:hover .zoozone-cat-card__image {
    scale: 1.05;
}

.zoozone-cat-card__link {
    position: absolute;
    inset: 0;
    z-index: 2;
}

/* Image fills top 68.61% (274 - 86 = 188px → 188/274 ≈ 68.61%) */
.zoozone-cat-card__image {
    /* position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 31.39%; */
    overflow: hidden;
    min-height: 164px;
    display: flex;
    transition: 0.2s ease;
}

.zoozone-cat-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Label area at bottom */
.zoozone-cat-card__label {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}

.zoozone-cat-card__name {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.2;
    color: #232323;
    transition: 0.2s ease;
}

.zoozone-cat-card:hover .zoozone-cat-card__name {
    color: var(--color-everglades);
}

.zoozone-cat-card__count {
    margin: 0;
    font-size: 14px;
    font-weight: 300;
    line-height: 1.4;
    color: #4D4E4D;
}

/* Responsive */
@media (max-width: 1024px) {
    .zoozone-categories-grid {
        grid-template-columns: repeat(2, 1fr);
        margin: 0 0 50px;
    }
}

@media (max-width: 600px) {
    .zoozone-categories-grid {
    }

    .zoozone-cat-card__name {
        font-size: 18px;
    }
}

@media (max-width: 768px) {
    .zoozone-cat-card {
        aspect-ratio: unset;
    }

    .zoozone-cat-card__image {
        height: 180px;
        min-height: unset;
    }

    .zoozone-cat-card__image img {
        height: 100%;
    }

    .zoozone-cat-card__label {
        position: static;
        height: auto;
        padding: 12px 20px;
    }
}

/* =========================================
   ELEMENTOR PRODUCT CATEGORIES WIDGET CARDS
   Figma: landscape 422×274, radius 24px
   ========================================= */

.zz-cat-widget-card {
    position: relative;
    background: #FFFFFF;
    border: 1px solid #E1E5E3;
    border-radius: 24px;
    overflow: hidden;
    cursor: pointer;
    aspect-ratio: 422 / 274;
    transition: box-shadow 0.2s ease;
}

.zz-cat-widget-card:hover {
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.zz-cat-widget-card__link {
    position: absolute;
    inset: 0;
    z-index: 2;
}

/* Image fills top ~68.61% (274 - 86 = 188px → 188/274 ≈ 68.61%) */
.zz-cat-widget-card__image {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 31.39%;
    overflow: hidden;
}

.zz-cat-widget-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.2s ease;
}

.zz-cat-widget-card:hover .zz-cat-widget-card__image img {
    transform: scale(1.05);
}

/* Label at bottom — fixed 86px height */
.zz-cat-widget-card__label {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 86px;
    padding: 20px 24px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
}

.zz-cat-widget-card__name {
    margin: 0;
    font-size: 22px;
    font-weight: 600;
    line-height: 1.2;
    color: #232323;
    transition: color 0.2s ease;
}

.zz-cat-widget-card:hover .zz-cat-widget-card__name {
    color: var(--color-everglades);
}

.zz-cat-widget-card__count {
    margin: 0;
    font-size: 14px;
    font-weight: 300;
    line-height: 1.4;
    color: #4D4E4D;
}

/* Responsive */
@media (max-width: 1024px) {
    .zz-cat-widget-card__name {
        font-size: 18px;
    }
}

@media (max-width: 768px) {
    .zz-cat-widget-card {
        aspect-ratio: unset;
        min-height: 180px;
    }

    .zz-cat-widget-card__label {
    }

    .zz-cat-widget-card__name {
        font-size: 16px;
    }

    .zz-cat-widget-card__count {
        font-size: 13px;
    }
}

@media (max-width: 480px) {
    .zz-cat-widget-card__name {
        font-size: 14px;
    }
}

.zoozone-brands-page-widget {
    padding: 4rem 0;
}

.zoozone-brands-search-block {
    max-width: 760px;
    margin: 0 auto 2.5rem;
    text-align: center;
}

.zoozone-brands-page-title {
    font-size: clamp(2rem, 3vw, 3rem);
    margin-bottom: 1.5rem;
}

.zoozone-brands-search-form {
    display: flex;
    gap: 0.75rem;
    justify-content: center;
    flex-wrap: wrap;
}

.zoozone-brands-search-input {
    width: min(100%, 520px);
    padding: 1rem 1.25rem;
    border-radius: 999px;
    border: 1px solid rgba(0, 0, 0, 0.12);
    outline: none;
    font-size: 1rem;
}

.zoozone-brands-search-button {
    padding: 1rem 1.5rem;
    border-radius: 999px;
    border: none;
    background: var(--color-secondary);
    color: #ffffff;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.25s ease;
}

.zoozone-brands-search-button:hover {
    background: #155d4a;
}

.zoozone-brands-popular-section {
    margin-bottom: 3rem;
}

.zoozone-brands-alphabet-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: 1.75rem;
    justify-content: center;
}

.zoozone-brands-alphabet-nav a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    border-radius: 999px;
    background: #f8fafc;
    color: var(--color-dark);
    text-decoration: none;
    border: 1px solid transparent;
    font-weight: 600;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.zoozone-brands-alphabet-nav a:hover {
    background: var(--color-secondary);
    color: #ffffff;
    border-color: var(--color-secondary);
}

.zoozone-brands-letter-group {
    margin-bottom: 2rem;
}

.zoozone-brands-letter-group h3 {
    margin-bottom: 1rem;
    font-size: 1.15rem;
}

.zoozone-brands-letter-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 0.75rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.zoozone-brands-letter-list li {
    margin: 0;
}

.zoozone-brands-letter-item {
    display: block;
    padding: 1rem 1.1rem;
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 18px;
    color: var(--color-dark);
    text-decoration: none;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.zoozone-brands-letter-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.08);
}

.zoozone-brands-no-results {
    margin-top: 2rem;
    text-align: center;
    color: #5b6670;
    font-size: 1rem;
}

/* ============================================================
   Banner Hero Widget
   ============================================================ */

.zoozone-banner-hero {
    --banner-color-start: #F8FDDD;
    --banner-color-end: #FFEEEF;
    width: 100%;
    background: linear-gradient(90deg, var(--banner-color-start) 0%, var(--banner-color-end) 100%);
    text-align: center;
}

.zoozone-banner-hero__title {
    margin: 0 0 12px;
    font-size: 48px;
    font-weight: 700;
    line-height: 1.2;
    color: #205330 !important;
}

.zoozone-banner-hero__subtitle {
    margin: 0;
    font-size: 16px;
    font-weight: 300;
    line-height: 1.4;
    color: #205330 !important;
}

/* ============================================================
   Contact Form Widget
   ============================================================ */

.zoozone-contact-section {
    padding: 30px 0;
}

.zoozone-contact-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: start;
    background-color: #fff;
    border-radius: 16px;
    padding: 40px;
}

/* ── Left: logo + info list ───────────────────────────────── */

.zoozone-contact-info__logo {
    margin-bottom: 24px;
}

.zoozone-contact-info__logo img {
    display: block;
    max-height: 48px;
    width: auto;
}

.zoozone-contact-info__company {
    margin-bottom: 20px;
}

.zoozone-contact-info__company-name {
    font-family: 'Geologica', sans-serif;
    font-weight: 600;
    font-size: 22px;
    line-height: 120%;
    color: #1C1C21;
    margin: 0 0 4px;
}

.zoozone-contact-info__company-sub {
    font-family: 'Geologica', sans-serif;
    font-weight: 300;
    font-size: 15px;
    line-height: 140%;
    color: #8C8F8D;
    margin: 0;
}

.zoozone-contact-info__list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 0;
    padding: 0;
}

.zoozone-contact-info__row {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.zoozone-contact-info__label {
    font-size: 15px;
    font-weight: 300;
    color: #8C8F8D;
    margin: 0;
}

.zoozone-contact-info__value {
    font-size: 16px;
    font-weight: 400;
    color: #232323;
    margin: 0;
}

.zoozone-contact-info__value a {
    color: inherit;
    text-decoration: none;
}

.zoozone-contact-info__value a:hover {
    color: #205330;
}

/* ── Right: form ──────────────────────────────────────────── */

.zoozone-contact-form__title {
    margin: 0 0 5px;
    font-size: 26px;
    font-weight: 600;
    line-height: 1.2;
    color: #232323;
}

.zoozone-contact-form__desc {
    margin: 0 0 24px;
    font-size: 14px;
    font-weight: 300;
    line-height: 1.4;
    color: #4D4E4D;
}

/* 2-column grid for inputs */
.zoozone-contact-form__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-bottom: 8px;
}

/* All inputs & textarea */
.zoozone-contact-form input[type="text"],
.zoozone-contact-form input[type="email"],
.zoozone-contact-form input[type="tel"],
.zoozone-contact-form textarea {
    width: 100%;
    padding: 14px 18px;
    border: none;
    border-radius: 12px;
    background: #F6FBF8;
    font-family: inherit;
    font-size: 14px;
    color: #232323;
    outline: none;
    transition: background 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
    resize: none;
    display: block;
    border: 1px solid #EAEEEC;
}

.zoozone-contact-form input[type="text"]:hover,
.zoozone-contact-form input[type="email"]:hover,
.zoozone-contact-form input[type="tel"]:hover,
.zoozone-contact-form textarea:hover {
    border-color: #205330;
}

.zoozone-contact-form input::placeholder,
.zoozone-contact-form textarea::placeholder {
    color: #8C8F8D;
}

/* .zoozone-contact-form input:focus,
.zoozone-contact-form textarea:focus {
    background: #E8F2EC;
    box-shadow: 0 0 0 2px rgba(32, 83, 48, 0.15);
} */

.zoozone-contact-form textarea {
    height: 140px;
    margin-bottom: 30px;
}

/* Notice */
.zoozone-contact-form__notice {
    font-size: 13px;
    min-height: 18px;
    margin-bottom: 12px;
    color: transparent;
}

.zoozone-contact-form__notice--error {
    color: #E81E0B;
}

.zoozone-contact-form__notice--success {
    color: #2CB862;
}

/* Privacy policy checkbox */
.zoozone-contact-form__policy {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 30px;
    cursor: pointer;
    font-size: 15px;
    color: #232323;
    user-select: none;
    font-weight: 300;
}

.zoozone-contact-form__policy input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.zoozone-contact-form__policy-check {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    border: 2px solid #D6DBD8;
    border-radius: 6px;
    background: #fff;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 14px 11px;
    transition: border-color 0.15s, background-color 0.15s;
}

.zoozone-contact-form__policy input:checked+.zoozone-contact-form__policy-check {
    background-color: #E8720B;
    border-color: #E8720B;
    background-image: url("data:image/svg+xml,%3Csvg width='14' height='11' viewBox='0 0 14 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.2639 0.414249C11.6679 -0.0727602 12.3899 -0.140014 12.8771 0.263858C13.3641 0.6678 13.4313 1.38987 13.0274 1.87698L6.18735 10.127C5.97713 10.3805 5.66793 10.5309 5.33872 10.5406C5.00955 10.5501 4.69235 10.4179 4.46771 10.1771L0.307797 5.71731C-0.123643 5.25454 -0.0984947 4.52951 0.364193 4.09792C0.826914 3.66652 1.55198 3.69177 1.98358 4.15432L5.25457 7.66075L11.2639 0.414249Z' fill='white'/%3E%3C/svg%3E");
}

.zoozone-contact-form__policy:hover .zoozone-contact-form__policy-check {
    border-color: #E8720B;
}

/* Submit button */
.zoozone-contact-form__btn {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 52px;
    padding: 0 32px;
    background-color: #2CB862;
    color: #FFFFFF;
    font-family: inherit;
    font-size: 15px;
    font-weight: 600;
    border: none;
    border-radius: 1000px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.zoozone-contact-form__btn:hover {
    background-color: #E8720B;
}

.zoozone-contact-form__btn:disabled {
    cursor: not-allowed;
    opacity: 0.7;
}

.zoozone-contact-form__btn-loader {
    display: none;
    position: absolute;
    width: 20px;
    height: 20px;
    border: 2px solid rgba(255, 255, 255, 0.4);
    border-top-color: #fff;
    border-radius: 50%;
    animation: zcf-spin 0.7s linear infinite;
}

@keyframes zcf-spin {
    to {
        transform: rotate(360deg);
    }
}

/* ── Success popup ────────────────────────────────────────── */

.zoozone-contact-popup {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 99999;
    align-items: center;
    justify-content: center;
}

.zoozone-contact-popup.is-open {
    display: flex;
}

.zoozone-contact-popup__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.35);
    animation: zcf-fade-in 0.25s ease;
}

.zoozone-contact-popup__box {
    position: relative;
    z-index: 1;
    background: #FFFFFF;
    border-radius: 20px;
    padding: 52px 48px 48px;
    max-width: 460px;
    width: calc(100% - 40px);
    text-align: center;
    animation: zcf-slide-up 0.32s cubic-bezier(0.34, 1.56, 0.64, 1);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
}

.zoozone-contact-popup__icon {
    margin: 0 auto 20px;
    width: 96px;
    height: 96px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.zoozone-contact-popup__icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.zoozone-contact-popup__icon--check svg {
    width: 56px;
    height: 56px;
}

.zoozone-contact-popup__title {
    margin: 0 0 10px;
    font-size: 22px;
    font-weight: 700;
    color: #232323;
}

.zoozone-contact-popup__text {
    margin: 0 0 28px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.6;
    color: #8C8F8D;
}

.zoozone-contact-popup__btn {
    display: inline-block;
    padding: 14px 40px;
    background: #205330;
    color: #FFFFFF;
    font-family: inherit;
    font-size: 15px;
    font-weight: 600;
    border: none;
    border-radius: 1000px;
    cursor: pointer;
    transition: opacity 0.2s ease;
}

.zoozone-contact-popup__btn:hover {
    opacity: 0.88;
}

@keyframes zcf-fade-in {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes zcf-slide-up {
    from {
        opacity: 0;
        transform: translateY(24px) scale(0.96);
    }

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

/* ── Order success popup extras ──────────────────────────── */

.zz-success-popup__box {
    max-width: 480px;
}

.zoozone-contact-popup__text strong {
    color: #232323;
    font-weight: 600;
}

.zz-success-popup__total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #f6fbf7;
    border-radius: 10px;
    padding: 14px 20px;
    margin: 0 0 28px;
}

.zz-success-popup__total-label {
    font-size: 14px;
    color: #8c8f8d;
    font-weight: 400;
}

.zz-success-popup__total-amount {
    font-size: 18px;
    font-weight: 700;
    color: #205330;
}

/* ============================================================
   CTA Banner Widget
   ============================================================ */

.zoozone-cta-banner {
    width: 100%;
    padding: 0px 0 100px;
}

.zoozone-cta-banner__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border-radius: 24px;
    overflow: hidden;
    min-height: 380px;
}

.zoozone-cta-banner__content {
    background-color: #2CB862;
    padding: 60px 52px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 12px;
}

.zoozone-cta-banner__title {
    margin: 0;
    font-size: 32px;
    font-weight: 600;
    line-height: 1.2;
    color: #FFFFFF !important;
}

.zoozone-cta-banner__text {
    margin: 0;
    font-size: 16px;
    font-weight: 300;
    line-height: 1.4;
    color: #fff !important;
}

.zoozone-cta-banner__btn {
    display: inline-block;
    align-self: flex-start;
    padding: 10px 28px;
    background-color: #FFFFFF !important;
    color: #205330 !important;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
    border-radius: 1000px;
    text-decoration: none;
    transition: 0.2s ease;
    margin-top: 18px;
}

.zoozone-cta-banner__btn:hover {
    background-color: #205330 !important;
    color: #fff !important;
}

.zoozone-cta-banner__image {
    overflow: hidden;
    display: flex;
}

.zoozone-cta-banner__image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ============================================================
   Text + Image Widget
   ============================================================ */

.zoozone-text-image {
    width: 100%;
    padding: 50px 0 !important;
    background: initial !important;
}

.zoozone-text-image__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
}

/* Image on the right (default) — text col first, image col second */
.zoozone-text-image--img-right .zoozone-text-image__content {
    order: 1;
}

.zoozone-text-image--img-right .zoozone-text-image__image {
    order: 2;
}

/* Image on the left — image col first, text col second */
.zoozone-text-image--img-left .zoozone-text-image__image {
    order: 1;
}

.zoozone-text-image--img-left .zoozone-text-image__content {
    order: 2;
}

.zoozone-text-image__image img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 16px !important;
    object-fit: cover;
}

.zoozone-text-image__title {
    margin: 0 0 12px;
    font-size: 32px;
    font-weight: 600;
    line-height: 1.2;
    color: #232323 !important;
}

.zoozone-text-image__text {
    margin: 0;
    font-size: 16px;
    font-weight: 300;
    line-height: 1.4;
    color: #4D4E4D !important;
}

/* ============================================================
   Feature Blocks Widget
   ============================================================ */

.zoozone-feature-blocks-widget {
    width: 100%;
    padding: 50px 0 100px;
}

.zoozone-feature-blocks-grid {
    display: flex;
    gap: 24px;
}

.zoozone-feature-block-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    flex: 1;
    min-width: 0;
}

.zoozone-feature-block-icon {
    position: relative;
    width: 68px;
    height: 68px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.zoozone-feature-block-icon-bg {
    position: absolute;
    inset: 0;
    background: #EAEEEC;
    border-radius: 16px;
    transform: rotate(-10deg);
}

.zoozone-feature-block-icon-img {
    position: relative;
    width: 100%;
    height: 100%;
    object-fit: contain;
    z-index: 1;
}

.zoozone-feature-block-content {
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-self: stretch;
}

.zoozone-feature-block-title {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    line-height: 120%;
    color: #232323;
}

.zoozone-feature-block-text {
    margin: 0;
    font-size: 15px;
    font-weight: 300;
    line-height: 140%;
    color: #4D4E4D;
}

.woocommerce ul.products::after,
.woocommerce ul.products::before,
.woocommerce-page ul.products::after,
.woocommerce-page ul.products::before {
    content: none;
}

.woocommerce ul.products.columns-3 li.product,
.woocommerce-page ul.products.columns-3 li.product {
    width: 100% !important;
    margin: 0;
}

.textBlock {
    margin: 30px 0 100px;
}

@media (max-width: 1024px) {
    .zoozone-feature-blocks-grid {
        flex-wrap: wrap;
        gap: 24px;
    }

    .zoozone-feature-block-card {
        flex: 0 0 calc(50% - 12px);
    }
}

@media (max-width: 600px) {
    .zoozone-feature-block-card {
        flex: 0 0 100%;
    }
}

@media (max-width: 992px) {
    .zoozone-popular-products-slider .zoozone-popular-products-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .zoozone-popular-products-slider .zoozone-popular-products-button {
        width: auto;
    }
}

@media (max-width: 768px) {
    .product-card-image {
        height: 220px;
    }
}


/* =========================================
   HOME BANNER SLIDER  (Figma: Home -> Banners)
   ========================================= */

/* Section: column layout — track row + pagination dots below */
.zoozone-swiper-section {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    padding: 20px 0;
}

/* Track: [ ← ] [ swiper ] [ → ]  — max 1444px = 1296 + 74 + 74 */
.zoozone-swiper-track {
    display: flex;
    align-items: center;
    gap: 30px;
    width: 100%;
    max-width: 1444px;
    padding: 0 0;
    box-sizing: border-box;
    position: relative;
}

/* Swiper takes remaining space */
.zoozone-home-swiper {
    flex: 1;
    min-width: 0;
    position: relative;
    height: auto;
    aspect-ratio: 2 / 1;
    overflow: hidden;
}

.zoozone-home-swiper .swiper-wrapper {
    height: 100%;
}

.zoozone-home-swiper .swiper-slide {
    height: 100%;
    border-radius: 16px;
    overflow: hidden;
    position: relative;
}

.zoozone-home-swiper .slide-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
    display: block;
}

.zoozone-home-swiper .slide-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 50%, rgba(0, 0, 0, 0.22) 100%);
    pointer-events: none;
}

.zoozone-home-swiper .slide-link {
    position: absolute;
    inset: 0;
    z-index: 2;
}

/* --- Arrows (sides of slider) --- */
.zoozone-swiper-prev,
.zoozone-swiper-next {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #EAEEEC;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s ease;
    padding: 0;
    position: absolute;
}

.zoozone-swiper-prev {
    left: -74px;
}

.zoozone-swiper-next {
    right: -74px;
}

.zoozone-swiper-prev:hover,
.zoozone-swiper-next:hover {
    background: #E8720B;
}

.zoozone-swiper-prev::after,
.zoozone-swiper-next::after {
    content: '';
    display: block;
    width: 20px;
    height: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    transition: 0.2s ease;
}

.zoozone-swiper-prev::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M12.5 15L7.5 10L12.5 5' stroke='%238C8F8D' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.zoozone-swiper-next::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M7.5 5L12.5 10L7.5 15' stroke='%23205330' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.zoozone-swiper-prev:hover:after,
.zoozone-swiper-next:hover:after {
    filter: brightness(10);
}

.zoozone-swiper-prev.swiper-button-disabled,
.zoozone-swiper-next.swiper-button-disabled {
    opacity: 0.4;
    cursor: default;
}

/* --- Pagination dots (below slider) --- */
.zoozone-swiper-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 12px;
    margin-top: 30px;
}

.zoozone-swiper-pagination .swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #E1E5E3;
    opacity: 1;
    margin: 0;
    cursor: pointer;
    transition: background 0.2s ease;
}

.zoozone-swiper-pagination .swiper-pagination-bullet-active {
    background: #205330;
}

/* --- Responsive --- */
@media (max-width: 1200px) {
    .zoozone-swiper-track {
        gap: 20px;
    }
}

@media (max-width: 768px) {
    .zoozone-swiper-prev,
    .zoozone-swiper-next {
        width: 36px;
        height: 36px;
    }
}

@media (max-width: 480px) {
    .zoozone-swiper-track {
        padding: 0 12px;
        gap: 12px;
    }

    .zoozone-swiper-prev,
    .zoozone-swiper-next {
        width: 36px;
        height: 36px;
    }

    /* Mobile: let image define height naturally */
    .zoozone-home-swiper {
        aspect-ratio: unset;
        height: auto;
    }
    .zoozone-home-swiper .swiper-wrapper,
    .zoozone-home-swiper .swiper-slide {
        height: auto;
    }
    .zoozone-home-swiper .slide-img {
        position: static;
        width: 100%;
        height: auto;
        object-fit: unset;
    }
}

/* ============================================================
   Stores Map Widget
   ============================================================ */

.zoozone-stores-section {
    margin-top: 30px;
}

/* Map */
.zoozone-stores-map {
    width: 100%;
    background: #e5e3df;
    border-radius: 12px;
}

/* Cards body */
.zoozone-stores-body {
    padding: 30px 0 100px;
}

/* Grid */
.zoozone-stores-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 50px 24px;
}

/* Card */
.zoozone-store-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 30px;
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 1.5px solid transparent;
    transition: 200ms all;
}

.zoozone-store-card:hover {
    border-color: #E8720B;
}

.zoozone-store-card.is-active {
    box-shadow: 0 0 0 2px #2CB862;
}

/* Name */
.zoozone-store-card__name {
    font-size: 22px;
    font-weight: 600;
    color: #1c1c21;
    margin: 0 0 20px;
    line-height: 1.2;
}

/* Info rows */
.zoozone-store-card__info {
    display: flex;
    flex-direction: column;
    gap: 12px;
    flex: 1;
    margin-bottom: 20px;
}

.zoozone-store-card__label {
    font-size: 15px;
    color: #8C8F8D;
    font-weight: 400;
    margin: 0 0 6px;
    line-height: 1.4;
}

.zoozone-store-card__value {
    font-size: 16px;
    color: #232323;
    font-weight: 400;
    margin: 0;
    line-height: 1.4;
}

/* Show on map button */
.zoozone-store-card__btn {
    display: block;
    width: 100%;
    padding: 9px 24px;
    border: 2px solid #E1E5E3;
    border-radius: 1000px;
    background: transparent;
    font-size: 14px;
    font-weight: 600;
    color: #232323;
    cursor: pointer;
    text-align: center;
    font-family: inherit;
    transition: background 0.2s ease, color 0.2s, border-color 0.2s ease;
    margin-top: auto;
}

.zoozone-store-card__btn:hover {
    background: #E8720B;
    color: #ffffff;
    border-color: #E8720B;
}

/* Google Maps InfoWindow override */
.zzm-iw {
    font-family: inherit;
    padding: 4px 2px;
    min-width: 180px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.zzm-iw__name {
    font-size: 14px;
    font-weight: 700;
    color: #232323;
    display: block;
    margin-bottom: 4px;
}

.zzm-iw__addr {
    font-size: 13px;
    color: #555555;
    line-height: 1.45;
}

/* Remove Google's default close button border */
.gm-ui-hover-effect {
    opacity: 0.7 !important;
}

/* Responsive */
@media (max-width: 1024px) {
    .zoozone-stores-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .zoozone-stores-grid {
        grid-template-columns: 1fr;
    }

    .zoozone-stores-body {
        padding: 32px 0 48px;
    }
}

/* ============================================================
   Rich Text Widget
   ============================================================ */

.zoozone-rich-text {
    font-size: 15px;
    line-height: 1.7;
    color: #CFCFCF;
}

/* Headings */
.zoozone-rich-text h1 {
    font-size: 30px;
    font-weight: 600;
    color: #232323;
    line-height: 1.2;
    margin: 0 0 28px;
}

.zoozone-rich-text h2 {
    font-size: 20px;
    font-weight: 400;
    color: #8C8F8D;
    line-height: 1.3;
    margin: 48px 0 14px;
}

.zoozone-rich-text h3 {
    font-size: 18px;
    font-weight: 400;
    color: #8C8F8D;
    line-height: 1.3;
    margin: 36px 0 12px;
}

.zoozone-rich-text h4 {
    font-size: 18px;
    font-weight: 600;
    color: #232323;
    line-height: 1.2;
    margin: 28px 0 10px;
}

.zoozone-rich-text h5 {
    font-size: 17px;
    font-weight: 600;
    color: #232323;
    line-height: 1.2;
    margin: 28px 0 10px;
}

.zoozone-rich-text h6 {
    font-size: 15px;
    font-weight: 600;
    color: #CFCFCF;
    margin: 20px 0 8px;
}

/* Paragraph */
.zoozone-rich-text p {
    margin: 0 0 16px;
    color: #4D4E4D;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 300;
}

/* Links */
.zoozone-rich-text a {
    color: #4A8FE8;
    text-decoration: underline;
    text-underline-offset: 3px;
    transition: color 0.15s ease;
}

.zoozone-rich-text a:hover {
    color: #2CB862;
}

/* Bold / Italic */
.zoozone-rich-text strong,
.zoozone-rich-text b {
    color: #FFFFFF;
    font-weight: 700;
}

.zoozone-rich-text em,
.zoozone-rich-text i {
    font-style: italic;
}

/* Unordered list */
.zoozone-rich-text ul {
    list-style: none;
    margin: 0 0 20px;
    padding: 0;
}

.zoozone-rich-text ul li {
    position: relative;
    padding-left: 20px;
    margin-bottom: 10px;
    color: #4D4E4D;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 300;
}

.zoozone-rich-text ul li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 6px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #374b2b;
}

/* Ordered list */
.zoozone-rich-text ol {
    list-style: none;
    counter-reset: zz-counter;
    margin: 0 0 20px;
    padding: 0;
}

.zoozone-rich-text ol li {
    counter-increment: zz-counter;
    position: relative;
    padding-left: 28px;
    margin-bottom: 10px;
    color: #4D4E4D;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 300;
}

.zoozone-rich-text ol li::before {
    content: counter(zz-counter) '.';
    position: absolute;
    left: 0;
    top: -2px;
    font-weight: 700;
    color: #374b2b;
    font-size: 15px;
    min-width: 22px;
}

/* Nested lists */
.zoozone-rich-text ul ul,
.zoozone-rich-text ol ol,
.zoozone-rich-text ul ol,
.zoozone-rich-text ol ul {
    margin-top: 8px;
    margin-bottom: 0;
}

/* Blockquote */
.zoozone-rich-text blockquote {
    border-left: 3px solid #2CB862;
    margin: 24px 0;
    padding: 12px 20px;
    background: rgba(44, 184, 98, 0.07);
    border-radius: 0 8px 8px 0;
}

.zoozone-rich-text blockquote p {
    margin: 0;
    font-style: italic;
}

/* Horizontal rule */
.zoozone-rich-text hr {
    border: none;
    border-top: 1px solid #2A2A2A;
    margin: 36px 0;
}

/* Remove excess margin on first/last children */
.zoozone-rich-text>*:first-child {
    margin-top: 0;
}

.zoozone-rich-text>*:last-child {
    margin-bottom: 0;
}



/* ============================================================
   SINGLE PRODUCT PAGE — exact Figma tokens (p2cF1tZ0sEvwzvQEo0zByV)
   ============================================================ */

/* Page bg: #f6fbf7 (Spring Wood) */
.zz-single-page {
    background: #f6fbf7;
    /* padding-bottom: 80px; */
}

/* Section wrappers */
.zz-single-product-section {
    padding: 30px 0 50px;
}

.zz-tabs-section {
    padding: 0 0 24px;
}

/* Product Card: white, radius 16px, padding 20px */
.zz-product-card {
    background: #fff;
    border-radius: 16px;
    padding: 20px;
}

/* Layout: equal 2 columns, gap 24px */
.zz-product-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    align-items: start;
}

/* GALLERY */
.zz-gallery {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.zz-gallery__main {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    /* background: #f9f9f9; */
    aspect-ratio: 1 / 1;
}

.zz-gallery__img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain;
    display: block;
}

/* Sale badge: top-left, #e71d0b pill */
.zz-gallery__badge {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 3;
    background: #e71d0b;
    color: #f6fbf7;
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
    padding: 1px 7px;
    border-radius: 100px;
    pointer-events: none;
}

/* Brand logo: top-right, 80x48, white, radius 12px, border #d6dbd8 1.5px */
.zz-gallery__brand {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    height: 48px;
    background: #fff;
    border-radius: 12px;
    border: 1.5px solid #d6dbd8;
    overflow: hidden;
    pointer-events: none;
}

.zz-gallery__brand img {
    max-width: 72px;
    max-height: 40px;
    object-fit: contain;
}

.zz-gallery__brand--text {
    font-size: 12px;
    font-weight: 600;
    color: #232323;
    width: auto;
    padding: 6px 12px;
}

/* Zoom: bottom-right */
.zz-gallery__zoom {
    position: absolute;
    bottom: 10px;
    right: 10px;
    z-index: 3;
    width: 32px;
    height: 32px;
    background: rgba(255, 255, 255, 0.88);
    border: none;
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #205330;
    transition: background 0.2s;
}

.zz-gallery__zoom:hover {
    background: #fff;
}

/* Gallery nav arrows: 40x40, #eaeeeb, radius 100px */
.zz-gallery__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
    width: 40px;
    height: 40px;
    background: #eaeeeb;
    border: none;
    border-radius: 100px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #205330;
    transition: background 0.2s;
}

.zz-gallery__nav--prev {
    left: 10px;
}

.zz-gallery__nav--next {
    right: 10px;
}

.zz-gallery__nav:hover {
    background: #d6dbd8;
}

/* Thumbnails: 60x60, radius 12px, gap 12px, border #d6dbd8; active: #205330 */
.zz-gallery__thumbs {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.zz-gallery__thumb {
    width: 60px;
    height: 60px;
    border-radius: 12px;
    overflow: hidden;
    border: 1.5px solid #d6dbd8;
    background: #f9f9f9;
    cursor: pointer;
    padding: 0;
    transition: border-color 0.2s;
    flex-shrink: 0;
}

.zz-gallery__thumb.is-active,
.zz-gallery__thumb:hover {
    border-color: #205330;
}

.zz-gallery__thumb img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

/* PRODUCT INFO: padding 20px, gap 40px between main and delivery */
.zz-product-info {
    display: flex;
    flex-direction: column;
    gap: 40px;
    padding: 20px;
}

/* Main info block: gap 26px */
.zz-product-info__main {
    display: flex;
    flex-direction: column;
    gap: 26px;
}

/* Meta row: stock badge + SKU, gap 12px */
.zz-product-meta-row {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

/* Stock: pill, 24px h, padding 2px 8px */
.zz-stock {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    border-radius: 100px;
    padding: 2px 8px;
}

.zz-stock--instock {
    background: #eaf8f0;
    color: #2CB862;
}

.zz-stock--onbackorder {
    background: #fef3e2;
    color: #b8860b;
}

.zz-stock--outofstock {
    background: #EAEEEC;
    color: #8C8F8D;
}

/* SKU: 13px/400/#8c8f8d */
.zz-product-sku {
    font-size: 13px;
    font-weight: 400;
    line-height: 18px;
    color: #8c8f8d;
}

/* Title: 22px/600/lh26/#232323 */
.zz-product-title {
    font-size: 22px;
    font-weight: 600;
    line-height: 26px;
    color: #232323;
    margin: 0;
}

/* Short desc: 14px/300/lh20/#4d4e4d */
.zz-product-short-desc {
    font-size: 14px;
    font-weight: 300;
    line-height: 20px;
    color: #4d4e4d;
}

.zz-product-short-desc p {
    margin: 0 0 8px;
}

.zz-product-short-desc p:last-child {
    margin-bottom: 0;
}

/* Product price */
.zz-product-price {
    margin: 4px 0;
}

.zz-product-price .price {
    font-size: 28px;
    font-weight: 700;
    color: #205330;
    line-height: 1.1;
}

.zz-product-price .price del {
    font-size: 18px;
    font-weight: 400;
    color: #8C8F8D;
    text-decoration: line-through;
    margin-right: 6px;
}

.zz-product-price .price ins {
    text-decoration: none;
}

/* WC FORM */
.zz-product-form {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* Price: 26px/500/lh36/#205330 */
.zz-product-form .price {
    font-size: 26px;
    font-weight: 500;
    line-height: 36px;
    color: #205330;
    display: flex;
    align-items: baseline;
    gap: 8px;
    flex-wrap: wrap;
}

.zz-product-form .price del {
    font-size: 16px;
    font-weight: 400;
    color: #8c8f8d;
    text-decoration: line-through;
}

.zz-product-form .price ins {
    text-decoration: none;
}

.zz-product-form .variations td.label,
.zz-product-form .variations th.label {
    display: none;
}

.zz-product-form .variations {
    border: none;
    width: 100%;
}

.zz-product-form .variations tr {
    display: flex;
    flex-direction: column;
    margin-bottom: 10px;
}

/* SWATCHES: pills h=40px, radius 100px, padding 10px 20px */
.zz-swatches {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 10px;
}

.zz-swatches__label {
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    color: #1c1c21;
}

.zz-swatches__pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.zz-swatch-pill {
    height: 40px;
    padding: 10px 20px;
    border: 1.5px solid #d6dbd8;
    border-radius: 100px;
    background: #fff;
    font-size: 14px;
    font-weight: 400;
    color: #232323;
    cursor: pointer;
    transition: border-color 0.2s, background 0.2s, color 0.2s;
    display: inline-flex;
    align-items: center;
    line-height: 1;
}

.zz-swatch-pill:hover {
    border-color: #205330;
    color: #205330;
}

.zz-swatch-pill.is-selected {
    border-color: #205330;
    background: #205330;
    color: #fff;
}

.zz-swatch-pill.is-disabled {
    border-color: #eaeeeb;
    color: #8c8f8d;
    cursor: not-allowed;
}

/* Attribute group (new structure) */
.zz-attr-group {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 16px;
}

.zz-attr-label {
    font-size: 14px;
    color: #232323;
    margin: 0;
}

.zz-attr-label__name {
    font-weight: 600;
}

.zz-attr-label__val {
    font-weight: 400;
    color: #232323;
}

/* Pill with inner text + optional sale badge */
.zz-swatch-pill__text {
    line-height: 1;
}

.zz-swatch-pill__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 6px;
    padding: 2px 5px;
    border-radius: 100px;
    background: #E03232;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
}

.zz-swatch-pill.is-selected .zz-swatch-pill__badge {
    background: #c82a2a;
}

/* Dynamic total price display */
.zz-price-total {
    font-size: 26px;
    font-weight: 500;
    color: #205330;
    margin: 0 0 12px;
}

/* Hide Stripe express checkout (Link) on single product — PHP hook is primary, CSS is fallback */
.single-product #wc-stripe-express-checkout-element,
.single-product #wc-stripe-payment-request-button-wrapper,
.single-product #wc-stripe-payment-request-button-separator,
.single-product .wc-stripe-payment-request-button-section,
.single-product #wcpay-payment-request-button-container,
.single-product .wc-block-components-express-payment {
    display: none !important;
}

/* QTY + ATC ROW: flex, gap 12px */
.zz-product-form form.cart {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

/* Variable product: stack swatches above qty+button row */
.zz-product-form form.variations_form {
    flex-direction: column;
    align-items: stretch;
}

.zz-product-form .single_variation_wrap {
    width: 100%;
}

.zz-product-form .woocommerce-variation.single_variation {
    display: none !important;
}

/* Qty + button row inside variable product form */
.zz-product-form .woocommerce-variation-add-to-cart {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.zz-product-form .reset_variations {
    display: none;
}

/* Qty wrap: #eaeeeb pill, h=52px, padding 8px */
.zz-qty-wrap {
    display: flex;
    align-items: center;
    background: #eaeeeb;
    border-radius: 1000px;
    padding: 8px;
    height: 52px;
    flex-shrink: 0;
    box-sizing: border-box;
}

/* Qty buttons: 36x36, radius 100px; minus=white, plus=#205330 */
.zz-qty-btn {
    width: 36px;
    height: 36px;
    border-radius: 100px;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background 0.15s;
}

.zz-qty-btn.zz-qty-minus {
    background: #fff;
}

.zz-qty-btn.zz-qty-plus {
    background: #205330;
    color: #fff;
}

.zz-qty-btn.zz-qty-minus:hover {
    background: #E8720B;
}

.zz-qty-btn.zz-qty-plus:hover {
    background: #E8720B;
}

/* Qty input: 56px, centered */
.zz-qty-wrap input[type="number"] {
    width: 40px;
    text-align: center;
    border: none;
    background: transparent;
    font-size: 14px;
    font-weight: 500;
    color: #232323;
    padding: 0;
    -moz-appearance: textfield;
    appearance: textfield;
}

.zz-qty-wrap input[type="number"]:focus {
    outline: none;
}

.zz-qty-wrap input[type="number"]::-webkit-inner-spin-button,
.zz-qty-wrap input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    appearance: none;
}

/* ATC button: #2cb761 pill, h=52px, padding 0 30px, 16px/600/white */
.zz-product-form .single_add_to_cart_button,
.zz-product-form button[type="submit"].button {
    flex: 1;
    min-width: 180px;
    height: 52px;
    background: #2cb761 !important;
    color: #fff !important;
    border: none;
    border-radius: 1000px;
    padding: 0 30px;
    font-size: 16px;
    font-weight: 600;
    line-height: 18px;
    cursor: pointer;
    transition: background 0.2s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.zz-product-form .single_add_to_cart_button:hover,
.zz-product-form button[type="submit"].button:hover {
    background: #22a354 !important;
}

.zz-product-form .single_add_to_cart_button.disabled,
.zz-product-form .single_add_to_cart_button:disabled,
.zz-product-form .single_add_to_cart_button.loading {
    background: #8c8f8d !important;
    cursor: not-allowed;
    pointer-events: none;
}

/* all variations OOS: hide qty, keep disabled button, suppress WC "no matching" alert */
form.zz-all-oos .quantity {
    display: none !important;
}

form.zz-all-oos .wc-no-matching-variations {
    display: none !important;
}

/* DELIVERY: gap 12px, icon 24px, title 16px/500, text 14px/300/#232323 */
.zz-delivery {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.zz-delivery__item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.zz-delivery__icon {
    flex-shrink: 0;
    width: 24px;
    display: flex;
    align-items: center;
    margin-top: 2px;
}

.zz-delivery__title {
    display: block;
    font-size: 16px;
    font-weight: 500;
    line-height: 22px;
    color: #232323;
}

.zz-delivery__text {
    margin: 0;
    font-size: 14px;
    font-weight: 300;
    line-height: 20px;
    color: #232323;
}

/* SLIDERS: padding 50px, title 26px/600/#232323 */
.zz-slider-section {
    padding: 50px 0;
}

.zz-slider-section__title {
    font-size: 26px;
    font-weight: 600;
    line-height: 31px;
    color: #232323;
    margin: 0 0 20px;
}

.zz-products-swiper-wrap {
    position: relative;
}

.zz-products-swiper {
    width: 100%;
    overflow: hidden;
}

.zz-products-swiper .swiper-slide {
    height: auto;
}

/* Swiper nav arrows: 40x40, #fff bg, border #d6dbd8 */
.zz-sp-prev,
.zz-sp-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    width: 40px;
    height: 40px;
    border-radius: 100px;
    background: #fff;
    border: 1.5px solid #d6dbd8;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #205330;
    transition: border-color 0.2s, background 0.2s;
}

.zz-sp-prev {
    left: -20px;
}

.zz-sp-next {
    right: -20px;
}

.zz-sp-prev:hover,
.zz-sp-next:hover {
    border-color: #205330;
    background: #f0f5f1;
}

/* MINI CARD: white, radius 16px, padding 16px, gap 16px */
.zz-mini-card {
    position: relative;
    background: #fff;
    border-radius: 16px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: 100%;
    box-sizing: border-box;
}

.zz-mini-card__badge {
    position: absolute;
    top: 26px;
    left: 26px;
    z-index: 2;
    background: #e71d0b;
    color: #f6fbf7;
    font-size: 13px;
    font-weight: 700;
    line-height: 18px;
    padding: 1px 5px;
    border-radius: 100px;
    pointer-events: none;
}

.zz-mini-card__img-wrap {
    display: block;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: #f9f9f9;
    border-radius: 8px;
}

.zz-mini-card__img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    transition: transform 0.3s;
}

.zz-mini-card__img-wrap:hover .zz-mini-card__img {
    transform: scale(1.04);
}

.zz-mini-card__body {
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1;
}

.zz-mini-card__name-wrap {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

/* Brand: 13px/300/lh18/#8c8f8d */
.zz-mini-card__brand {
    font-size: 13px;
    font-weight: 300;
    line-height: 18px;
    color: #8c8f8d;
    text-decoration: none;
}

/* Name: 14px/300/lh20/#232323, 2-line clamp */
.zz-mini-card__name {
    font-size: 14px;
    font-weight: 300;
    line-height: 20px;
    color: #232323;
    text-decoration: none;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.zz-mini-card__name:hover {
    color: #205330;
}

/* Size: 13px/300/lh18/#8c8f8d */
.zz-mini-card__size {
    font-size: 13px;
    font-weight: 300;
    line-height: 18px;
    color: #8c8f8d;
    margin: 0;
}

/* Price row: current 16px/600/#205330, old 13px/400/#8c8f8d strikethrough */
.zz-mini-card__price-row {
    display: flex;
    align-items: baseline;
    gap: 8px;
    flex-wrap: wrap;
}

.zz-mini-card__price {
    font-size: 16px;
    font-weight: 600;
    line-height: 22px;
    color: #205330;
}

.zz-mini-card__price .woocommerce-Price-amount {
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
}

.zz-mini-card__price-old {
    font-size: 13px;
    font-weight: 400;
    line-height: 18px;
    color: #8c8f8d;
    text-decoration: line-through;
}

/* ATC: #2cb761 pill, padding 10px 26px, 14px/600/white */
.zz-mini-card__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #2cb761;
    color: #fff;
    padding: 10px 26px;
    border-radius: 1000px;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    text-decoration: none;
    transition: background 0.2s;
    border: none;
    cursor: pointer;
    width: 100%;
    box-sizing: border-box;
}

.zz-mini-card__btn:hover {
    background: #22a354;
    color: #fff;
}

/* TABS CARD: white, radius 16px */
.zz-tabs-card {
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
}

/* Nav: padding 12px 30px 0, border-bottom #eaeeeb 1.5px */
.zz-tabs__nav {
    display: flex;
    border-bottom: 1.5px solid #eaeeeb;
    padding: 12px 30px 0;
}

/* Tab: 16px/500/lh22, inactive #8c8f8d, active #205330 border */
.zz-tab {
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -1.5px;
    padding: 8px 20px 12px;
    font-size: 16px;
    font-weight: 500;
    line-height: 22px;
    color: #8c8f8d;
    cursor: pointer;
    transition: color 0.2s, border-color 0.2s;
    white-space: nowrap;
}

.zz-tab:hover {
    color: #205330;
}

.zz-tab.is-active {
    color: #205330;
    border-bottom-color: #205330;
}

/* Panel: padding 30px */
.zz-tab-panel {
    display: none;
    padding: 30px;
}

.zz-tab-panel.is-active {
    display: block;
}

.zz-tab-empty {
    font-size: 14px;
    font-weight: 300;
    color: #8c8f8d;
    margin: 0;
}

/* Tab content text: 14px/300/lh20/#4d4e4d */
.zz-tab-content p {
    font-size: 14px;
    font-weight: 300;
    line-height: 20px;
    color: #4d4e4d;
    margin: 0 0 12px;
}

.zz-tab-content p:last-child {
    margin-bottom: 0;
}

.zz-tab-content h2,
.zz-tab-content h3 {
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    color: #232323;
    margin: 0 0 12px;
}

.zz-tab-content ul,
.zz-tab-content ol {
    padding-left: 20px;
    margin: 0 0 12px;
}

.zz-tab-content li {
    font-size: 14px;
    font-weight: 300;
    line-height: 20px;
    color: #4d4e4d;
    margin-bottom: 4px;
}

/* SPECS TABLE */
.zz-specs-table {
    width: 100%;
    border-collapse: collapse;
}

.zz-specs-table tr {
    border-bottom: 1px solid #f0f0f0;
}

.zz-specs-table tr:last-child {
    border-bottom: none;
}

.zz-specs-table td {
    padding: 12px 0;
    font-size: 14px;
    vertical-align: top;
}

.zz-specs-table__name {
    color: #8c8f8d;
    font-weight: 400;
    width: 40%;
    padding-right: 16px;
}

.zz-specs-table__value {
    color: #205330;
    font-weight: 500;
}

/* RESPONSIVE */
@media (max-width: 1100px) {
    .zz-product-layout {
        grid-template-columns: 1fr;
    }

    .zz-gallery__main {
        max-width: 480px;
        margin: 0 auto;
        width: 100%;
    }

    .zz-gallery__thumbs {
        justify-content: center;
    }

    .zz-product-info {
        padding: 0;
    }
}

@media (max-width: 768px) {
    .zz-product-card {
        padding: 30px;
        border-radius: 12px;
    }

    .zz-product-title {
        font-size: 18px;
        line-height: 24px;
    }

    .zz-tabs__nav {
        padding: 8px 16px 0;
        /* overflow-x: auto; */
        -webkit-overflow-scrolling: touch;
    }

    .zz-tab-panel {
        padding: 20px 16px;
    }

    .zz-tabs-card {
        border-radius: 12px;
    }

    .zz-slider-section {
        padding: 30px 0;
    }

    .zz-sp-prev {
        left: 0;
    }

    .zz-sp-next {
        right: 0;
    }

    .zz-product-form form.cart {
        flex-wrap: wrap;
    }

    .zz-product-form .single_add_to_cart_button,
    .zz-product-form button[type="submit"].button {
        min-width: 0;
        width: 100%;
        flex: 1;
    }
}

/* account CSS placeholder */

/* ═══════════════════════════════════════════════════════════════
   404 PAGE — ZooZone
   ═══════════════════════════════════════════════════════════════ */

.zz-404-page {
    padding: 60px 0 80px;
}

.zz-404 {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0;
}

.zz-404__img {
    width: 420px;
    max-width: 80vw;
    height: auto;
    margin-bottom: 32px;
    pointer-events: none;
    user-select: none;
}

.zz-404__title {
    font-size: 32px;
    font-weight: 700;
    color: #232323;
    line-height: 1.25;
    margin: 0 0 16px;
}

.zz-404__desc {
    font-size: 15px;
    font-weight: 400;
    color: #6b6f6d;
    line-height: 1.55;
    max-width: 520px;
    margin: 0 0 36px;
}

.zz-404__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 52px;
    padding: 0 36px;
    border-radius: 100px;
    background: #2CB862;
    color: #ffffff;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.2s;
}

.zz-404__btn:hover {
    background: #e8720b;
}

@media (max-width: 576px) {
    .zz-404-page {
        padding: 100px 0;
    }

    .zz-404__img {
        width: 280px;
        margin-bottom: 24px;
    }

    .zz-404__title {
        font-size: 28px;
    }

    .zz-404__desc {
        font-size: 14px;
        margin-bottom: 28px;
    }

    .zz-404__btn {
        height: 48px;
        padding: 0 28px;
        font-size: 15px;
    }
}

/* ═══════════════════════════════════════════════════════════════
   MY ACCOUNT — ZooZone
   ═══════════════════════════════════════════════════════════════ */

.zz-account-wrap {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 24px;
    align-items: start;
    padding: 40px 0 100px;
}

.zz-account-sidebar {
    position: sticky;
    top: 100px;
}

.zz-account-nav {
    background: #ffffff;
    border-radius: 12px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.zz-account-nav__item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    border-radius: 50px;
    text-decoration: none;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.3;
    color: #205330;
    transition: background 0.15s, color 0.15s;
}

.zz-account-nav__item:hover {
    background: #EAEEEC;
    color: #205330;
}

.zz-account-nav__item.is-active {
    background: #EAEEEC;
    color: #205330;
    font-weight: 600;
}

.zz-account-nav__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    background: none;
    border-radius: 0;
}

.zz-account-content {
    min-width: 0;
}

.zz-account-card {
    background: #ffffff;
    border-radius: 12px;
    padding: 30px;
}

.zz-account-card__title {
    font-size: 22px;
    font-weight: 600;
    line-height: 26px;
    color: #232323;
    margin: 0 0 28px;
}

/* Profile form */
.zz-profile-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.zz-profile-row {
    display: grid;
    grid-template-columns: 160px 1fr;
    gap: 16px;
    align-items: start;
}

.zz-profile-row__label {
    font-size: 15px;
    font-weight: 400;
    color: #8c8f8d;
    padding-top: 14px;
    line-height: 20px;
}

.zz-profile-row__fields {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.zz-profile-row__fields--split {
    flex-direction: row;
}

.zz-profile-row__fields--split .zz-profile-input {
    flex: 1 1 0;
    min-width: 0;
}

.zz-profile-input {
    width: 100%;
    height: 60px;
    padding: 0 16px;
    border-radius: 12px;
    border: 1.5px solid #d6dbd8;
    background: #f6fbf7;
    font-size: 16px;
    font-weight: 400;
    color: #232323;
    outline: none;
    transition: border-color 0.15s;
    box-sizing: border-box;
    appearance: none;
    -webkit-appearance: none;
}

.zz-profile-input:focus {
    border-color: #205330;
}

.zz-profile-input::placeholder {
    color: #8c8f8d;
}

.zz-profile-select {
    background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238c8f8d' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 16px center;
    background-color: #f6fbf7;
    padding-right: 40px;
    cursor: pointer;
}

.zz-profile-address-row {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr;
    gap: 10px;
}

.zz-profile-checkbox {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    font-weight: 400;
    color: #4d4e4d;
    cursor: pointer;
    padding: 4px 0;
}

.zz-profile-checkbox input[type="checkbox"] {
    margin: 0;
}

/* password accordion — CSS grid trick for smooth height animation */
.zz-profile-password-section {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.35s ease;
}

.zz-profile-password-section.is-open {
    grid-template-rows: 1fr;
}

.zz-profile-password-inner {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 20px;
    /* border-top: 1.5px solid #eaeeeb; */
    /* padding/margin only visible when open — use inner padding so grid collapse works */
    padding-top: 0;
    margin-top: 0;
    transition: padding-top 0.35s ease, margin-top 0.35s ease;
}

.zz-profile-password-section.is-open .zz-profile-password-inner {
    padding-top: 20px;
    margin-top: 4px;
}

.zz-profile-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    padding-top: 20px;
}

.zz-profile-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    padding: 0 28px;
    border-radius: 1000px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
    text-decoration: none;
    min-width: 180px;
}

.zz-profile-btn--primary {
    background: #2cb761;
    color: #ffffff;
    border: none;
}

.zz-profile-btn--primary:hover {
    background: #e8720b;
    color: #ffffff;
}

.zz-profile-btn--outline {
    background: #ffffff;
    color: #232323;
    border: 2px solid #d6dbd8;
}

.zz-profile-btn--outline:hover,
.zz-profile-btn--outline.is-active {
    border-color: #e8720b;
    background: #e8720b;
    color: #fff;
}

/* ═══ Orders ═══════════════════════════════════════════════════ */
.zz-orders-list {
    display: flex;
    flex-direction: column;
    gap: 1px;
    background: #eaeeeb;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 24px;
}

.zz-order {
    background: #ffffff;
}

/* ── Header row ────────────────────────────────────────────────── */
.zz-order__header {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 0px;
    min-height: 84px;
    background: none;
    border: none;
    cursor: pointer;
    text-align: left;
    transition: background 0.15s;
    border-bottom: 1px solid #E1E5E3;
}

.zz-order__header:hover,
.zz-order.is-open .zz-order__header {
    /* background: #f6fbf7; */
}

.zz-order.is-open .zz-order__header {
    border: none;
}

/* Left: number + status stacked */
.zz-order__meta {
    display: flex;
    flex-direction: column;
    gap: 5px;
    /* flex: 0 0 auto; */
    min-width: 0;
    flex: 0.3;
}

.zz-order__number {
    font-size: 14px;
    font-weight: 300;
    color: #8C8F8D;
    line-height: 1.2;
}

.zz-order__status {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
}

.zz-order__status--processing { color: #e7720b; }
.zz-order__status--completed  { color: #205330; }
.zz-order__status--cancelled  { color: #8c8f8d; }
.zz-order__status--on-hold    {color: #4d4e4d;font-weight: bold;}
.zz-order__status--pending    { color: #4d4e4d; }
.zz-order__status--refunded   { color: #4d4e4d; }
.zz-order__status--failed     { color: #e71d0b; }

/* Right: date col + total col + chevron */
.zz-order__right {
    display: flex;
    align-items: center;
    gap: 32px;
    flex-shrink: 0;
    flex: 1;
    justify-content: flex-end;
}

.zz-order__col {
    display: flex;
    flex-direction: column;
    gap: 3px;
    text-align: right;
    flex: 1;
}

.zz-order__col-label {
    font-size: 12px;
    font-weight: 400;
    color: #8c8f8d;
    line-height: 1;
    line-height: 1.4;
}

.zz-order__date,
.zz-order__total {
    font-size: 15px;
    font-weight: 500;
    color: #232323;
    line-height: 1.4;
    white-space: nowrap;
}

.zz-order__chevron {
    color: #8c8f8d;
    transition: transform 0.2s ease;
    flex-shrink: 0;
    margin-left: 120px;
}

.zz-order.is-open .zz-order__chevron {
    transform: rotate(180deg);
}

/* ── Expanded body ─────────────────────────────────────────────── */
.zz-order__body {
    animation: zzSlideUp 0.2s ease both;
    margin-top: 10px;
}

.zz-order__content {
    display: flex;
    align-items: stretch;
    gap: 30px;
}

/* Left: items + totals */
.zz-order__left {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.zz-order__items {
    display: flex;
    flex-direction: column;
    padding-bottom: 16px;
}

.zz-order__item {
    display: grid;
    grid-template-columns: 68px 1fr auto;
    gap: 12px;
    align-items: center;
    padding: 15px 0;
    border-bottom: 1px solid #e9e9e9;
}

.zz-order__item:last-of-type {
    border-bottom: none;
}

.zz-order__item-img {
    width: 64px;
    height: 64px;
    border-radius: 10px;
    object-fit: cover;
    flex-shrink: 0;
}

.zz-order__item-img--placeholder {
    background: #eaeeeb;
}

.zz-order__item-info {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.zz-order__item-name {
    font-size: 14px;
    font-weight: 500;
    color: #232323;
    line-height: 1.4;
}

.zz-order__item-meta {
    font-size: 14px;
    font-weight: 300;
    color: #4D4E4D;
    line-height: 1.4;
}

.zz-order__item-total {
    font-size: 15px;
    font-weight: 500;
    color: #232323;
    white-space: nowrap;
    text-align: right;
    line-height: 1.4;
}

/* Totals row below items */
.zz-order__totals {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-top: 40px;
    /* margin-top: auto; */
}

.zz-order__totals-row {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    font-size: 15px;
    font-weight: 400;
    color: #8C8F8D;
}

.zz-order__totals-row--bold {
    font-weight: 600;
}

.woocommerce-Price-amount.amount {
    color: #232323;
}

/* Right: info card */
.zz-order__info-card {
    width: 300px;
    flex-shrink: 0;
    background: #f6fbf7;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 0;
    border-radius: 12px;
}

.zz-order__info-item {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 8px 0;
}

.zz-order__info-item:first-child {
    padding-top: 0;
}

.zz-order__info-label {
    font-size: 14px;
    font-weight: 400;
    color: #8C8F8D;
    line-height: 1.4;
}

.zz-order__info-value {
    font-size: 14px;
    font-weight: 400;
    color: #232323;
    line-height: 1.4;
}

/* Action buttons inside info card */
.zz-order__actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-top: 16px;
    margin-top: auto;
}

.zz-order__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 40px;
    padding: 0 16px;
    border-radius: 100px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.15s, border-color 0.15s, color 0.15s;
    width: 100%;
}

.zz-order__btn--outline {
    background: transparent;
    border: 2px solid #E1E5E3;
    color: #232323;
}

.zz-order__btn--outline:hover {
    border-color: #e8720b;
    color: #fff;
    background: #e8720b;
}

/* Empty state */
.zz-orders-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 60px 20px;
    text-align: center;
    color: #8c8f8d;
    font-size: 14px;
}

/* Pagination */
.zz-orders-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-top: 24px;
}

.zz-orders-pagination__page,
.zz-orders-pagination__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 100px;
    font-size: 14px;
    font-weight: 400;
    color: #232323;
    text-decoration: none;
    transition: background 0.15s, color 0.15s;
}

.zz-orders-pagination__page:hover,
.zz-orders-pagination__btn:hover {
    background: #eaeeeb;
}

.zz-orders-pagination__page.is-active {
    background: #205330;
    color: #ffffff;
    font-weight: 600;
}

.zz-orders-pagination__ellipsis {
    width: 40px;
    text-align: center;
    color: #8c8f8d;
    font-size: 14px;
}

/* Responsive */
@media (max-width: 1024px) {
    .zz-account-wrap {
        grid-template-columns: 1fr;
        gap: 16px;
        padding: 24px 0 100px;
    }

    .zz-account-sidebar {
        position: static;
        min-width: 0;
        width: 100%;
    }

    .zz-account-nav {
        flex-direction: row;
        overflow-x: auto;
        padding: 20px;
    }

    .zz-account-nav__item {
        white-space: nowrap;
        flex-shrink: 0;
        padding: 10px 14px;
    }

    .zz-account-nav__icon {
        display: none;
    }

    /* Orders – tablet */
    .zz-order__content {
        flex-direction: column;
    }

    .zz-order__left {
        border-right: none;
    }

    .zz-order__info-card {
        width: 100%;
    }
}

@media (max-width: 640px) {
    .zz-account-card {
        padding: 20px 16px;
    }

    .zz-profile-row {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .zz-profile-row__label {
        padding-top: 0;
    }

    .zz-profile-row__fields--split {
        flex-direction: column;
    }

    .zz-profile-address-row {
        grid-template-columns: 1fr;
    }

    .zz-profile-actions {
        flex-direction: column-reverse;
    }

    .zz-profile-btn {
        width: 100%;
    }
}

@media (max-width: 576px) {
    /* Orders – mobile */

    /* Header: 2-row layout (meta on top, date+total+chevron on bottom) */
    .zz-order__header {
        flex-direction: column;
        align-items: flex-start;
        padding: 15px 0;
        min-height: auto;
        gap: 12px;
    }

    .zz-order__meta {
        gap: 4px;
    }

    /* Bottom row: date + total spread out, chevron pushed to far right */
    .zz-order__right {
        width: 100%;
        gap: 32px;
    }

    /* Show date column (was hidden) and align left */
    .zz-order__right .zz-order__col:first-child {
        display: flex;
    }

    .zz-order__col {
        text-align: left;
    }

    /* Push chevron to far right */
    .zz-order__chevron {
        margin-left: auto;
    }

    /* 2-column item: image | info+price stacked */
    .zz-order__item {
        grid-template-columns: 56px 1fr;
        grid-template-rows: auto auto;
    }

    .zz-order__item-total {
        grid-column: 2;
        text-align: right;
        font-size: 14px;
    }

    .zz-order__left {
        padding: 15px 0;
    }

    .zz-order__info-card {
        padding: 30px 20px 20px;
    }
}

/* ═══════════════════════════════════════════════════════════════
   CART & CHECKOUT — ZooZone
   ═══════════════════════════════════════════════════════════════ */

/* ── Checkout minimal header (dark green per Figma) ──────────── */
.site-header--checkout {
    background: #205330;
    border-bottom: none;
}

.zz-checkout-header>.container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 80px;
}

.zz-checkout-header__back {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 600;
    color: #fff;
    text-decoration: none;
}

.zz-checkout-header__back:hover {
    opacity: 0.85;
}

.zz-checkout-header__logo {
    display: flex;
    align-items: center;
}

.zz-checkout-header__logo-default,
.zz-checkout-header__logo-mobile {
    display: flex;
    align-items: center;
    text-decoration: none;
}

.zz-checkout-header__logo-mobile {
    display: none;
}

.zz-checkout-header__logo img {
    height: 36px;
    width: auto;
    filter: brightness(0) invert(1);
}

.zz-checkout-header__logo svg {
    height: 36px;
    width: auto;
}

.zz-checkout-header__logo svg path,
.zz-checkout-header__logo svg rect,
.zz-checkout-header__logo svg circle {
    fill: #fff !important;
}

.zz-checkout-header__contacts {
    display: flex;
    align-items: center;
    gap: 20px;
}

.zz-checkout-header__contact {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 16px;
    font-weight: 500;
    color: #fff;
    text-decoration: none;
}

.zz-checkout-header__contact:hover {
    opacity: 0.85;
}

/* ── Cart page layout ────────────────────────────────────────── */
.zz-cart-wrap {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 40px;
    align-items: start;
    max-width: 1296px;
    width: calc(100% - 80px);
    margin: 0 auto;
    padding: 40px 0 80px;
}

.zz-cart-title {
    font-size: 26px;
    font-weight: 600;
    line-height: 31px;
    color: #232323;
    margin: 0 0 24px;
}

/* ── Cart items ──────────────────────────────────────────────── */
.zz-cart-items {
    display: flex;
    flex-direction: column;
    gap: 1px;
    border-radius: 16px;
    overflow: hidden;
}

.zz-cart-item {
    display: grid;
    grid-template-columns: 72px 1fr auto auto auto;
    gap: 16px;
    align-items: center;
    padding: 16px 0px;
    transition: background 0.15s, opacity 0.3s, transform 0.3s;
    background: transparent;
    border-bottom: 1px solid #E9E9E9;
}

.zz-cart-item:last-of-type {
    border-bottom: none;
}

.zz-cart-item.is-removing {
    opacity: 0;
    transform: translateX(20px);
}

.zz-cart-item__img img {
    width: 72px;
    height: 72px;
    object-fit: cover;
    border-radius: 10px;
    border: 1.5px solid #d6dbd8;
    display: block;
}

.zz-cart-item__info {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.zz-cart-item__name {
    font-size: 14px;
    font-weight: 500;
    color: #232323;
    text-decoration: none;
    line-height: 18px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.zz-cart-item__name:hover {
    color: #205330;
}

.zz-cart-item__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.zz-cart-item__attrs,
.zz-cart-item__price {
    font-size: 12px;
    font-weight: 300;
    color: #8c8f8d;
    line-height: 1.4;
}

/* Cart qty in cart page */
.zz-cart-item .zz-qty-wrap {
    height: 40px;
    padding: 6px;
    display: flex;
    align-items: center;
    background: #eaeeeb;
    border-radius: 1000px;
    gap: 0;
}

.zz-cart-item .zz-qty-btn {
    width: 28px;
    height: 28px;
    border-radius: 100px;
    border: none;
    cursor: pointer;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.zz-cart-item .zz-qty-minus {
    background: #fff;
    color: #232323;
}

.zz-cart-item .zz-qty-plus {
    background: #205330;
    color: #fff;
}

.zz-cart-item .zz-qty-input {
    width: 40px;
    border: none;
    background: transparent;
    text-align: center;
    font-size: 14px;
    font-weight: 500;
    color: #232323;
    -moz-appearance: textfield;
}

.zz-cart-item .zz-qty-input::-webkit-outer-spin-button,
.zz-cart-item .zz-qty-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

.zz-cart-item__subtotal {
    font-size: 15px !important;
    font-weight: 400 !important;
    color: #232323;
    white-space: nowrap;
}

.zz-cart-item__remove {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 36px !important;
    height: 36px !important;
    border-radius: 100px;
    background: transparent;
    color: #e71d0b;
    text-decoration: none;
    flex-shrink: 0;
    transition: background 0.15s;
}

.zz-cart-item__remove:hover {
    background: #e71d0b;
    color: #fff;
}

.zz-cart-item__remove-label,
.zz-co-item__remove-label {
    display: none;
}

/* Coupon row */
.zz-cart-coupon {
    display: flex;
    gap: 10px;
    margin-top: 16px;
    align-items: center;
}

.zz-cart-coupon .zz-profile-input {
    max-width: 240px;
    height: 44px;
}

.zz-cart-coupon__btn {
    height: 44px;
    padding: 0 20px;
    background: #205330;
    color: #fff;
    border: none;
    border-radius: 100px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
}

/* ── Order Summary sidebar ───────────────────────────────────── */
.zz-cart-summary {
    position: sticky;
    top: 100px;
}

.zz-cart-summary__card {
    background: #EAEEEC;
    border-radius: 16px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.zz-cart-summary__title {
    font-size: 18px;
    font-weight: 600;
    color: #232323;
    margin: 0;
}

.zz-cart-summary__rows {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.zz-cart-summary__row {
    display: flex;
    justify-content: space-between;
    font-size: 14px !important;
    font-weight: 300 !important;
    color: #6B6C88;
}

.zz-cart-summary__row span span {
    color: #232323 !important;
    font-weight: 500 !important;
}

.zz-cart-summary__row--discount {
    color: #205330;
}

.zz-cart-summary__row--coupon {
    color: #205330;
    font-size: 13px;
}

.zz-cart-summary__total-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 16px;
    border-top: 1.5px solid #E0E0EF;
    font-size: 16px;
    font-weight: 500;
    color: #232323;
}

.zz-cart-summary__total-row span {
    color: #4D4E4D !important;
    font-size: 15px !important;
    font-weight: 300 !important;
}

.zz-cart-summary__total-amount .amount {
    font-size: 18px !important;
    font-weight: 500 !important;
    color: #232323 !important;
}

.zz-cart-summary__checkout-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 52px;
    background: #2cb761;
    color: #ffffff;
    font-size: 16px;
    font-weight: 600;
    border: none;
    border-radius: 1000px;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.15s;
}

.zz-cart-summary__checkout-btn:hover {
    background: #E8720B;
    color: #fff;
}

.zz-cart-summary__legal {
    font-size: 13px;
    font-weight: 300;
    color: #4D4E4D;
    line-height: 16px;
    margin: 0;
    line-height: 1.4;
}

.zz-cart-summary__legal a {
    color: #205330;
    text-decoration: underline;
}

/* ── Checkout layout ─────────────────────────────────────────── */
.zz-checkout-layout {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 40px;
    align-items: start;
    max-width: 1296px;
    width: calc(100% - 80px);
    margin: 0 auto;
    padding: 40px 0 80px;
}

.zz-checkout-title {
    font-size: 26px;
    font-weight: 600;
    color: #232323;
    margin: 0 0 20px;
}

/* ── Checkout section cards ──────────────────────────────────── */
.zz-co-card {
    background: #ffffff;
    border-radius: 12px;
    padding: 30px;
    margin-bottom: 20px;
}

.zz-co-card__title {
    font-size: 18px;
    font-weight: 600;
    color: #232323;
    margin: 0 0 24px;
    padding: 0;
    border: none;
}

/* ── Cart accordion in checkout ──────────────────────────────── */
.zz-co-cart-toggle {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: none;
    border: none;
    font-size: 18px;
    font-weight: 600;
    color: #232323;
    cursor: pointer;
    padding: 0;
    text-align: left;
}

.zz-co-cart-toggle.is-open .zz-co-cart-chevron {
    transform: rotate(180deg);
}

.zz-co-cart-chevron {
    transition: transform 0.2s ease;
    flex-shrink: 0;
    color: #8c8f8d;
}

.zz-co-cart-body {
    display: flex;
    flex-direction: column;
    gap: 1px;
    background: #eaeeeb;
    border-radius: 8px;
    overflow: hidden;
    margin-top: 20px;
    animation: zzSlideUp 0.2s ease both;
}

.zz-co-cart-body[hidden] {
    display: none !important;
}

/* Checkout cart items */
.zz-co-item {
    display: grid;
    grid-template-columns: 68px 1fr 120px 36px;
    gap: 16px;
    align-items: center;
    background: #fff;
    padding: 16px 0;
}

.zz-co-item__img img {
    width: 68px;
    height: 68px;
    border-radius: 4px;
    object-fit: cover;
    display: block;
}

.zz-co-item__info {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.zz-co-item__name {
    font-size: 14px;
    font-weight: 500;
    color: #232323;
    line-height: 20px;
}

.zz-co-item__name:hover {
    color: #205330;
}

.zz-co-item__meta {
    font-size: 13px;
    font-weight: 300;
    color: #8c8f8d;
    line-height: 18px;
}

.zz-co-item__total {
    font-size: 15px;
    font-weight: 400;
    color: #232323;
    white-space: nowrap;
    text-align: right;
}

.zz-co-item__remove {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 36px !important;
    height: 36px !important;
    border-radius: 1000px;
    background: #f6fbf7;
    color: #232323;
    text-decoration: none;
    transition: background 0.15s, color 0.15s;
    flex-shrink: 0;
}

.zz-co-item__remove:hover {
    background: #E81E0B !important;
}

.zz-co-item__remove svg path {
    transition: 0.2s ease;
}

.zz-co-item__remove:hover svg path {
    fill: #fff !important;
}

/* ── Personal info form rows (checkout-scoped overrides) ─────── */
.zz-co-fields .col-1,
.zz-co-fields .col-2 {
    float: none;
    width: 100%;
}

.zz-co-personal-fields {
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* Checkout profile rows: flex layout with 200px label, dividers */
.zz-co-card .zz-profile-row {
    display: flex;
    align-items: center;
    gap: 30px;
    min-height: 60px;
    /* border-bottom: 1px solid #eaeeeb; */
    padding: 10px 0;
    grid-template-columns: unset;
}

.zz-co-card .zz-profile-row:last-child {
    border-bottom: none;
}

.zz-co-card .zz-profile-row__label {
    font-size: 15px;
    font-weight: 300;
    color: #8c8f8d;
    min-width: 200px;
    flex-shrink: 0;
    line-height: 21px;
    padding-top: 0;
}

.zz-co-card .zz-profile-row__fields {
    display: flex;
    flex-direction: row;
    gap: 16px;
    flex: 1;
    min-width: 0;
}

/* Checkout inputs: 60px, no border, spring-green bg */
.zz-co-card .zz-profile-input {
    height: 60px;
    background: #f6fbf7;
    border: none;
    border-radius: 12px;
    padding: 0 20px;
    font-size: 16px;
    font-weight: 500;
    color: #232323;
    width: 100%;
    box-sizing: border-box;
    outline: none;
    transition: border-color 0.2s;
    border: 1px solid #EAEEEC;
}

.zz-co-card .zz-profile-input:focus,
.zz-co-card .zz-profile-input:hover {
    border-color: #205330 !important;
}

.zz-co-card select.zz-profile-input {
    cursor: pointer;
}

/* ── Delivery address row ────────────────────────────────────── */
.zz-co-address-row {
    display: flex;
    align-items: flex-start;
    gap: 30px;
    padding: 16px 0 0;
    margin-top: 16px;
    border-top: 1px solid #eaeeeb;
}

.zz-co-address-row__label {
    font-size: 15px;
    font-weight: 300;
    color: #8c8f8d;
    min-width: 200px;
    flex-shrink: 0;
    padding-top: 18px;
    line-height: 21px;
}

.zz-co-address-fields {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.zz-co-address-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 12px;
}

/* ── Shipping method options ─────────────────────────────────── */
.zz-co-shipping-list {
    display: flex;
    flex-direction: column;
    gap: 1px;
    background: #eaeeeb;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 0;
}

.zz-shipping-option {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 20px 0;
    background: #fff;
    cursor: pointer;
    transition: background 0.15s;
}

.zz-shipping-option.is-selected {
    background: #fff;
}

.zz-shipping-option input[type="radio"] {
    display: none;
}

.zz-shipping-option__radio {
    width: 16px;
    height: 16px;
    border-radius: 100px;
    border: 2px solid #D6DBD8;
    flex-shrink: 0;
    background: #fff;
    transition: border-color 0.15s;
    position: relative;
}

.zz-shipping-option:hover .zz-shipping-option__radio {
    border: 2px solid #D6DBD8;
}

.zz-shipping-option__radio::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 7px;
    height: 7px;
    border-radius: 100px;
    background: #E8720B;
    opacity: 0;
    transition: opacity 0.15s;
}

.zz-shipping-option.is-selected .zz-shipping-option__radio {
    border: 2px solid #E8720B;
}

.zz-shipping-option.is-selected .zz-shipping-option__radio::after {
    opacity: 1;
}

.zz-shipping-option__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}

.zz-shipping-option__info {
    flex: 1;
    min-width: 0;
}

.zz-shipping-option__name {
    font-size: 16px;
    font-weight: 500;
    color: #232323;
    display: block;
    line-height: 22px;
}

.zz-shipping-option__desc {
    font-size: 14px;
    font-weight: 300;
    color: #8c8f8d;
    display: block;
    line-height: 20px;
}

.zz-shipping-option__price-wrap {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
    flex-shrink: 0;
}

.zz-shipping-option__price-orig,
.zz-shipping-option__price-was {
    font-size: 15px;
    font-weight: 400;
    color: #8c8f8d;
    text-decoration: line-through;
}

.zz-shipping-option__price-free,
.zz-shipping-option__price-paid {
    font-size: 16px;
    font-weight: 600;
    color: #232323;
}

/* ── Parcel machine selector ─────────────────────────────────── */

.zz-pickup-container {
    margin: 6px 0 4px;
    border: 1.5px solid #205330;
    border-radius: 12px;
    background: #f7faf8;
    overflow: hidden;
    /* visual connector — top-left corner flattened toward selected option */
    border-top-left-radius: 4px;
}

.zz-pickup-label {
    display: block;
    padding: 14px 16px 0;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #205330;
    margin: 0 0 10px;
}

.zz-pickup-search {
    display: block;
    width: calc(100% - 32px);
    margin: 0 16px 0;
    padding: 9px 13px;
    border: 1.5px solid #d0d8d2;
    border-radius: 8px;
    font-size: 14px;
    color: #232323;
    background: #fff;
    outline: none;
    box-sizing: content-box;
    transition: border-color 0.15s;
}

.zz-pickup-search:focus {
    border-color: #205330;
}

.zz-pickup-list {
    max-height: 230px;
    overflow-y: auto;
    margin-top: 10px;
    border-top: 1.5px solid #d0dfd4;
}

.zz-pickup-list::-webkit-scrollbar {
    width: 4px;
}

.zz-pickup-list::-webkit-scrollbar-track {
    background: transparent;
}

.zz-pickup-list::-webkit-scrollbar-thumb {
    background: #c0ccc4;
    border-radius: 2px;
}

.zz-pickup-city-group {
    border-bottom: 1px solid #eef2ef;
}

.zz-pickup-city-label {
    padding: 6px 16px 4px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #8c8f8d;
    background: #f0f5f2;
    position: sticky;
    top: 0;
}

.zz-pickup-item {
    padding: 9px 16px;
    cursor: pointer;
    border-bottom: 1px solid #eef2ef;
    transition: background 0.1s;
}

.zz-pickup-item:last-child {
    border-bottom: none;
}

.zz-pickup-item:hover {
    background: #edf5ef;
}

.zz-pickup-item.is-selected {
    background: #daeee1;
}

.zz-pickup-item__name {
    display: block;
    font-size: 13.5px;
    font-weight: 500;
    color: #232323;
    line-height: 1.3;
}

.zz-pickup-item__address {
    display: block;
    font-size: 12px;
    color: #8c8f8d;
    margin-top: 2px;
}

.zz-pickup-status {
    padding: 18px 16px;
    text-align: center;
    font-size: 13px;
    color: #8c8f8d;
}

.zz-pickup-selected {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 10px 16px 14px;
    padding: 9px 13px;
    background: #205330;
    border-radius: 8px;
    color: #fff;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.35;
}

.zz-pickup-selected svg {
    flex-shrink: 0;
}

.zz-pickup-selected svg path {
    stroke: #fff;
}

/* ── Payment methods (WooCommerce native, Figma style) ───────── */
#payment {
    background: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
}

#payment ul.payment_methods,
#payment ul.wc_payment_methods {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    border: none !important;
    background: none !important;
}

#payment ul.payment_methods li.wc_payment_method,
#payment ul.wc_payment_methods li.wc_payment_method {
    background: #fff;
    padding: 0;
    margin: 0;
    border-bottom: 1px solid #EAEEEB;
}

#payment ul.payment_methods li.wc_payment_method:last-child,
#payment ul.wc_payment_methods li.wc_payment_method:last-child {
    border-bottom: none;
}

/* Hide the actual radio input — we style the label */
#payment .wc_payment_method>input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

#payment .wc_payment_method>label {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 20px 0;
    cursor: pointer;
    font-size: 16px;
    font-weight: 500;
    color: #232323;
    margin: 0;
    width: 100%;
    box-sizing: border-box;
}

/* Radio span — identical to .zz-shipping-option__radio */
#payment .wc_payment_method>label .zz-pay-radio {
    width: 16px;
    height: 16px;
    border-radius: 100px;
    border: 2px solid #D6DBD8;
    flex-shrink: 0;
    background: #fff;
    transition: border-color 0.15s;
    position: relative;
}

#payment .wc_payment_method>label .zz-pay-radio::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 7px;
    height: 7px;
    border-radius: 100px;
    background: #E8720B;
    opacity: 0;
    transition: opacity 0.15s;
}

#payment .wc_payment_method.is-selected>label .zz-pay-radio {
    border: 2px solid #E8720B;
}

#payment .wc_payment_method.is-selected>label .zz-pay-radio::after {
    opacity: 1;
}

/* Icon injected via woocommerce_gateway_icon filter */
#payment .wc_payment_method>label .zz-pay-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}

#payment .wc_payment_method>label .zz-pay-icon svg {
    display: block;
}

/* Hide any default WC gateway images */
#payment .wc_payment_method>label img {
    display: none;
}

/* Payment method title span */
#payment .wc_payment_method>label .zz-pay-method-title {
    font-size: 16px;
    font-weight: 500;
    color: #232323;
}

.payment_box {
    padding: 16px 24px;
    font-size: 13px;
    color: #4d4e4d;
    background: #f6fbf7 !important;
    border-top: 1px solid #eaeeeb;
    border-radius: 0 !important;
}

/* Hide WC's own submit button and terms — we have them in sidebar */
#payment .form-row.place-order {
    display: none !important;
}

.woocommerce-terms-and-conditions-wrapper {
    display: none !important;
}

.woocommerce-privacy-policy-text {
    display: none !important;
}

/* ── Parcel terminal selector block ─────────────────────────────────────────── */
.zz-shipping-extra {
    padding: 30px;
    overflow: hidden;
    margin: 0px 0;
    border-radius: 12px;
}

/* ── DPD after-shipping card — same visual style as Omniva ─────── */
.zz-after-shipping {
    margin: 8px 0 4px;
    padding: 20px;
    border-radius: 12px;
    border: 1px solid #c8cfc9;
    background: #fff;
}

/* Reset inner containers so there's no double border */
.zz-after-shipping .wc_shipping_dpd_terminals,
.zz-after-shipping .pudo_section,
.zz-after-shipping .dpd-parcelshop-container,
.zz-after-shipping [class*="dpd-terminal"],
.zz-after-shipping [class*="dpd-parcel"],
.zz-after-shipping [class*="pudo-section"],
.zz-after-shipping .custom-dropdown {
    display: block !important;
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
    border-radius: 0 !important;
    margin: 0 !important;
}

/* Inner wrapper div (converted from <td>) — no extra padding */
.zz-after-shipping .pudo_section > div,
.zz-after-shipping .dpd-parcelshop-container > div {
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
}

/* Terminal name text */
.zz-after-shipping p,
.zz-after-shipping span#dpd-selected-parcel,
.zz-after-shipping .dpd-selected-terminal,
.zz-after-shipping [class*="dpd-selected"],
.zz-after-shipping [class*="parcel-machine-selected"],
.zz-after-shipping [class*="dpd-parcel-info"] {
    font-size: 15px !important;
    font-weight: 400 !important;
    color: #232323 !important;
    margin: 0 0 16px !important;
    line-height: 1.4 !important;
    display: block !important;
}

/* Hide terminal name span when empty, and remove <br> */
.zz-after-shipping span#dpd-selected-parcel:empty {
    display: none !important;
    margin: 0 !important;
}

.zz-after-shipping .wc_shipping_dpd_terminals br {
    display: none !important;
}

/* Hide the "Izvēlēties DPD Pickup punktu *" label — show only the terminal name */
.zz-after-shipping p strong,
.zz-after-shipping p abbr.required {
    display: none;
}

/* "Parādīt Pickup punktus" link → green pill button, same as Omniva's Izvēlieties kartē */
.zz-after-shipping a#dpd-show-parcel-modal,
.zz-after-shipping a.dpd-show-parcelshop,
.zz-after-shipping a[class*="dpd-show"],
.zz-after-shipping a[class*="pudo-show"],
.zz-after-shipping a[class*="dpd-parcelshop"],
.zz-after-shipping .dpd-parcelshop-container a,
.zz-after-shipping .pudo_section a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 52px !important;
    padding: 0 20px !important;
    background: #2cb761 !important;
    color: #fff !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    border: none !important;
    border-radius: 1000px !important;
    cursor: pointer !important;
    transition: background 0.15s !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
}

.zz-after-shipping a#dpd-show-parcel-modal:hover,
.zz-after-shipping a.dpd-show-parcelshop:hover,
.zz-after-shipping a[class*="dpd-show"]:hover,
.zz-after-shipping a[class*="pudo-show"]:hover,
.zz-after-shipping a[class*="dpd-parcelshop"]:hover,
.zz-after-shipping .dpd-parcelshop-container a:hover,
.zz-after-shipping .pudo_section a:hover {
    background: #25a355 !important;
    color: #fff !important;
}

/* Structural fallback — catches any DPD container class we don't know about */
.zz-after-shipping > div > a,
.zz-after-shipping > div > div > a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 52px !important;
    padding: 0 20px !important;
    background: #2cb761 !important;
    color: #fff !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    border: none !important;
    border-radius: 1000px !important;
    cursor: pointer !important;
    transition: background 0.15s !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
}

.zz-after-shipping > div > a:hover,
.zz-after-shipping > div > div > a:hover {
    background: #25a355 !important;
    color: #fff !important;
}

/* blockUI requires position:relative on the blocked element */
.zz-co-delivery-extras {
    position: relative;
}

/* Always hide DPD home delivery time slot — never shown in our checkout */
.wc_shipping_dpd_home_delivery {
    display: none !important;
}


.zz-dpd-terminal-selector {
    border: 1px solid #C8D5CB;
    border-radius: 16px;
    background: #F0F5F1;
    padding: 16px 20px 20px;
}

.zz-dpd-terminal-selector__label {
    font-size: 13px;
    font-weight: 600;
    color: #232323;
    margin: 0 0 10px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* Custom dropdown trigger */
.zz-dpd-terminal-selector .custom-dropdown {
    position: relative;
}

.zz-dpd-terminal-selector .selected-option {
    padding: 11px 36px 11px 14px;
    border: 1px solid #C8D5CB;
    border-radius: 10px;
    background: #fff url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23205330' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 14px center;
    font-size: 14px;
    color: #232323;
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: border-color 0.2s;
}

.zz-dpd-terminal-selector .selected-option:hover {
    border-color: #205330;
}

/* Dropdown list */
.zz-dpd-terminal-selector .dropdown-list {
    display: none;
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #C8D5CB;
    border-radius: 12px;
    max-height: 320px;
    overflow-y: auto;
    z-index: 100;
    padding: 0;
    margin: 0;
    list-style: none;
    box-shadow: 0 4px 16px rgba(0,0,0,0.08);
}

.zz-dpd-terminal-selector .dropdown-list.active {
    display: block;
}

/* Search input inside dropdown */
.zz-dpd-terminal-selector .dropdown-list-search-input {
    padding: 8px 12px;
    border-bottom: 1px solid #E1E5E3;
    position: sticky;
    top: 0;
    background: #fff;
    z-index: 1;
}

.zz-dpd-terminal-selector .js--pudo-search {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #D6DBD8;
    border-radius: 8px;
    font-size: 13px;
    outline: none;
    box-sizing: border-box;
}

/* Group headers */
.zz-dpd-terminal-selector .group-pudo {
    padding: 8px 14px 4px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #8C8F8D;
    list-style: none;
}

/* Individual terminal items */
.zz-dpd-terminal-selector .pudo {
    padding: 9px 14px;
    font-size: 13px;
    color: #232323;
    cursor: pointer;
    list-style: none;
    transition: background 0.15s;
}

.zz-dpd-terminal-selector .pudo:hover {
    background: #F0F5F1;
}

/* Load more button */
.zz-dpd-terminal-selector #load-more-btn {
    padding: 10px 14px;
    text-align: center;
}

.zz-dpd-terminal-selector .load-more {
    display: inline-block;
    padding: 8px 20px;
    background: #205330;
    color: #fff;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

.zz-dpd-terminal-selector .hidden {
    display: none !important;
}
.zz-shipping-extra--after {
    border: none;
    background: transparent;
    padding: 0;
    margin: 0;
}

.omnivalt_terminal_container_map {
    padding: 20px!important;
    border-radius: 12px!important;
    border: 1px solid #c8cfc9!important;
}

.tmjs-selected-terminal {
    font-size: 16px;
    font-weight: 500;
    color: #232323;
    margin-bottom: 20px!important;
}

.omnivalt_terminal_container_map .tmjs-open-modal-btn {
    display: flex!important;
    align-items: center!important;
    justify-content: center!important;
    width: 100%!important;
    height: 52px!important;
    background: #2cb761!important;
    color: #fff!important;
    font-size: 16px!important;
    font-weight: 600!important;
    border: none!important;
    border-radius: 1000px!important;
    cursor: pointer!important;
    transition: background 0.15s!important;
}

.omnivalt_terminal_container_map .tmjs-open-modal-btn:hover {
    background: #25a355!important;
}

/* Current terminal display — read-only field with pin icon */
.zz-shipping-extra input[type="text"],
.zz-shipping-extra input[type="search"] {
    width: 100%;
    padding: 11px 14px 11px 40px;
    border: 1px solid #C8D5CB;
    border-radius: 10px;
    background: #fff url("data:image/svg+xml,%3Csvg width='16' height='20' viewBox='0 0 16 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 0C3.589 0 0 3.589 0 8c0 5.25 7.2 11.625 7.5 11.9a.75.75 0 001 0C8.8 19.625 16 13.25 16 8c0-4.411-3.589-8-8-8zm0 11a3 3 0 110-6 3 3 0 010 6z' fill='%23205330'/%3E%3C/svg%3E") no-repeat 14px center / 14px;
    font-size: 14px;
    font-weight: 500;
    color: #232323;
    box-sizing: border-box;
    margin-bottom: 12px;
    outline: none;
    transition: border-color 0.2s;
    cursor: default;
}

.zz-shipping-extra input[type="text"]:focus,
.zz-shipping-extra input[type="search"]:focus {
    border-color: #205330;
    box-shadow: 0 0 0 3px rgba(32, 83, 48, 0.1);
}

/* Select dropdown */
.zz-shipping-extra select {
    width: 100%;
    padding: 11px 36px 11px 14px;
    border: 1px solid #C8D5CB;
    border-radius: 10px;
    background: #fff;
    font-size: 14px;
    color: #232323;
    cursor: pointer;
    box-sizing: border-box;
    margin-bottom: 12px;
    outline: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23205330' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    transition: border-color 0.2s;
}

.zz-shipping-extra select:focus {
    border-color: #205330;
    box-shadow: 0 0 0 3px rgba(32, 83, 48, 0.1);
}

/* "Izvēlieties kartē" button */
.zz-shipping-extra button,
.zz-shipping-extra input[type="button"],
.zz-shipping-extra input[type="submit"] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 13px 20px;
    background: #205330;
    color: #fff;
    border: none;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.01em;
    cursor: pointer;
    text-align: center;
    transition: background 0.2s, transform 0.1s;
    box-sizing: border-box;
}

.zz-shipping-extra button:hover,
.zz-shipping-extra input[type="button"]:hover {
    background: #174225;
}

.zz-shipping-extra button:active,
.zz-shipping-extra input[type="button"]:active {
    transform: scale(0.98);
}

/* Map modal/iframe container */
.zz-shipping-extra iframe {
    width: 100%;
    min-height: 380px;
    border-radius: 12px;
    border: none;
    margin-top: 14px;
    display: block;
}

.zz-shipping-extra .omniva-map-container,
.zz-shipping-extra [id*="omniva_map"],
.zz-shipping-extra [class*="omniva-map"],
.zz-shipping-extra [class*="map-container"] {
    width: 100%;
    border-radius: 12px;
    overflow: hidden;
    margin-top: 14px;
}

/* Label inside block */
.zz-shipping-extra label {
    font-size: 12px;
    font-weight: 500;
    color: #4D4E4D;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 8px;
    display: block;
}

/* Loading state */
.zz-shipping-extra.is-loading {
    pointer-events: none;
    opacity: 0.7;
}

@media (max-width: 480px) {
    .zz-shipping-extra {
        padding: 14px 14px 16px;
    }

    .zz-shipping-extra button,
    .zz-shipping-extra input[type="button"] {
        font-size: 13px;
        padding: 12px 16px;
    }

    .zz-shipping-extra iframe {
        min-height: 300px;
    }
}

.zz-co-no-shipping {
    font-size: 13px;
    color: #8c8f8d;
    padding: 16px;
    text-align: center;
    margin: 0;
}

/* ── Checkout Order Summary sidebar ──────────────────────────── */
.zz-checkout-summary {
    position: sticky;
    top: 74px;
}

.zz-checkout-summary__card {
    background: #eaeeeb;
    border-radius: 12px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.zz-checkout-summary__title {
    font-size: 18px;
    font-weight: 600;
    color: #232323;
    margin: 0;
}

.zz-checkout-summary__rows {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.zz-checkout-summary__row {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.zz-checkout-summary__row-label {
    font-size: 14px;
    font-weight: 300;
    color: #4d4e4d;
}

.zz-checkout-summary__row-value {
    font-size: 14px;
    font-weight: 500;
    color: #232323;
}

.zz-checkout-summary__row--discount .zz-checkout-summary__row-value {
    color: #205330;
}

.zz-checkout-summary__total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 16px;
    border-top: 1px solid #c8cfc9;
}

.zz-checkout-summary__total-label {
    font-size: 15px;
    font-weight: 300;
    color: #4d4e4d;
}

.zz-checkout-summary__total-amount {
    font-size: 18px;
    font-weight: 500;
    color: #232323;
}

.zz-checkout-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 52px;
    background: #2cb761;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    border: none;
    border-radius: 1000px;
    cursor: pointer;
    transition: background 0.15s;
}

.zz-checkout-btn:hover {
    background: #25a355;
}

.zz-checkout-summary__legal {
    font-size: 13px;
    font-weight: 300;
    color: #6b6b88;
    line-height: 18px;
    margin: 0;
}

.zz-checkout-summary__legal a {
    color: #205330;
    text-decoration: underline;
}

/* ── Cart crosssells section ─────────────────────────────────── */
.zz-cart-crosssells {
    padding: 50px 0;
    background: #f6fbf7;
    margin-top: 40px;
}

/* ── Checkout body class overrides ───────────────────────────── */
.zz-is-checkout .header-bottom,
.zz-is-checkout .site-footer {
    display: none;
}

/* ── WooCommerce notices on checkout ─────────────────────────── */
.woocommerce-error,
.woocommerce-message,
.woocommerce-info {
    border-radius: 8px;
    margin-bottom: 16px;
}

/* ── Responsive ──────────────────────────────────────────────── */
@media (max-width: 1024px) {
    .zz-checkout-layout {
        grid-template-columns: 1fr 300px;
        gap: 24px;
    }
}

@media (max-width: 900px) {

    .zz-cart-wrap,
    .zz-checkout-layout {
        grid-template-columns: 1fr;
    }

    .zz-cart-summary,
    .zz-checkout-summary {
        position: static;
    }
}

/* ============================================================
   Brands Page — pixel-perfect Figma match
   ============================================================ */

.zz-brands-page {
    padding-bottom: 80px;
}

/* ── Search ─────────────────────────────────────────────────── */
.zz-brands-search {
    padding: 40px 0 60px;
}

.zz-brands-search__heading {
    font-size: 26px;
    font-weight: 600;
    color: var(--color-black);
    margin: 0 0 20px;
    line-height: 1.2;
}

/* Full-width input, icon pinned to the right (matches Figma) */
.zz-brands-search__wrap {
    position: relative;
    width: 100%;
}

.zz-brands-search__icon {
    position: absolute;
    right: 34px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    flex-shrink: 0;
}

.zz-brands-search__input {
    width: 100%;
    height: 64px;
    padding: 0 64px 0 32px;
    border: 1.5px solid var(--color-timberwolf);
    border-radius: 999px;
    background: #fff;
    font-family: var(--font-main);
    font-size: 16px;
    color: var(--color-black);
    outline: none;
    transition: border-color 0.15s;
    box-sizing: border-box;
}

.zz-brands-search__input:focus,
.zz-brands-search__input:hover {
    border-color: var(--color-everglades);
}

.zz-brands-search__input::placeholder {
    color: var(--color-natural-gray);
}

/* ── Section heading ────────────────────────────────────────── */
.zz-brands-section__heading {
    font-size: 18px;
    font-weight: 600;
    color: var(--color-black);
    margin: 0 0 20px;
}

/* ── Popular brands — 7-column grid (Figma: 180×100 cards) ─── */
.zz-brands-popular {
    padding-bottom: 60px;
}

.zz-brands-popular__grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 6px;
}

.zz-brand-logo-card {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100px;
    background: #fff;
    border: 1px solid transparent;
    border-radius: 16px;
    padding: 12px 16px;
    text-decoration: none;
    transition: border-color 0.15s, box-shadow 0.15s;
    box-sizing: border-box;
    overflow: hidden;
}

.zz-brand-logo-card:hover {
    border-color: var(--color-everglades);
    box-shadow: 0 4px 16px rgba(32, 83, 48, 0.10);
}

.zz-brand-logo-card img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}

.zz-brand-logo-card__text {
    font-size: 13px;
    font-weight: 600;
    color: var(--color-everglades);
    text-align: center;
    line-height: 1.3;
}

/* ── Alphabetical list — 4-column grid (Figma: 306×268 groups) */
.zz-brands-list {
    padding-bottom: 60px;
}

.zz-brands-groups {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px 24px;
}

.zz-brands-group__letter {
    font-size: 22px;
    font-weight: 700;
    color: var(--color-black);
    line-height: 1.2;
    margin-bottom: 20px;
}

.zz-brands-group__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.zz-brands-group__item a {
    display: block;
    height: 37px;
    line-height: 37px;
    font-size: 18px;
    font-weight: 400;
    color: var(--color-black);
    text-decoration: none;
    transition: color 0.12s;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.zz-brands-group__item a:hover {
    color: var(--color-everglades);
}

.zz-brands-no-results {
    font-size: 15px;
    color: var(--color-natural-gray);
    margin-top: 24px;
}

/* ── Responsive ─────────────────────────────────────────────── */

/* Tablet-wide: drop to 5 popular cols, 3 alpha cols */
@media (max-width: 1100px) {
    .zz-brands-popular__grid {
        grid-template-columns: repeat(5, 1fr);
    }

    .zz-brands-groups {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Tablet (≤768px): 4 popular cols, 2 alpha cols (matches Figma tablet) */
@media (max-width: 768px) {
    .zz-brands-search__heading {
        font-size: 26px;
    }

    .zz-brands-popular__grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 8px;
    }

    .zz-brand-logo-card {
        height: 84px;
    }

    .zz-brands-groups {
        grid-template-columns: repeat(2, 1fr);
        gap: 28px 20px;
    }
}

/* Mobile (≤576px): 2 popular cols, 2 alpha cols (matches Figma mobile) */
@media (max-width: 576px) {
    .zz-brands-search {
        padding: 24px 0 32px;
    }

    .zz-brands-search__heading {
        font-size: 22px;
    }

    .zz-brands-search__input {
        height: 56px;
        font-size: 16px;
        padding: 0 34px 0 24px;
    }

    .zz-brands-popular__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 8px;
    }

    .zz-brand-logo-card {
        padding: 8px 12px;
        height: 100px;
    }

    .zz-brands-brand-logo-card img {
        max-height: 52px;
    }

    .zz-brands-groups {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px 16px;
    }

    .zz-brands-group__letter {
        font-size: 20px;
        margin-bottom: 12px;
    }

    .zz-brands-group__item a {
        height: 32px;
        line-height: 32px;
        font-size: 16px;
    }
}

/* ============================================================
   RESPONSIVE — Home page & global
   ============================================================ */

/* Prevent horizontal overflow */
html {
    overflow-x: clip;
}

img,
video,
svg,
iframe {
    max-width: 100%;
    height: auto;
}

/* ── Container padding ── */
@media (max-width: 1280px) {
    .container {
        width: calc(100% - 60px);
    }
}

/* ── Hamburger — hidden by default ── */
.header-hamburger {
    display: none;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    background: #ecff60;
    border: none;
    border-radius: 50%;
    cursor: pointer;
    flex-shrink: 0;
}

/* ── Tablet ≤1024px: compact header ── */
@media (max-width: 1024px) {

    /* Topbar: hide left nav + language, keep contacts centered */
    .header-topbar__left {
        display: none;
    }

    .header-lang {
        display: none;
    }

    .header-topbar__inner {
        justify-content: center;
    }

    .header-topbar__right {
        justify-content: center;
    }

    /* Hide category bottom nav */
    .header-bottom {
        display: none;
    }

    /* Show hamburger */
    .header-hamburger {
        display: flex;
    }

    /* Header main: auto height, row 1 = [hamburger+logo] [actions], row 2 = search */
    /* Desktop .site-header { sticky; top: -36px } already handles this correctly:
       topbar (36px) scrolls away, then header-main sticks at viewport top */
    .header-main {
        height: auto;
    }

    .header-main__inner {
        flex-wrap: wrap;
        align-items: center;
        gap: 0;
        padding: 12px 0;
    }

    /* .header__left: real flex box — hamburger + logo grouped on the left */
    .header__left {
        display: flex !important;
        align-items: center;
        gap: 12px;
        flex-shrink: 0;
    }

    /* .header__right: real flex box — actions pushed to far right */
    .header__right {
        display: flex !important;
        align-items: center;
        margin-left: auto;
    }

    /* Logo size */
    .header-logo img,
    .header-logo svg {
        width: 160px;
        height: auto;
    }

    /* Search: full-width second row */
    .header-search {
        order: 10;
        flex: 0 0 100%;
        width: 100%;
        height: 52px;
        border-radius: 100px;
        overflow: visible;
        margin-top: 12px;
    }

    .header-search__input {
        display: block;
    }

    .zoozone-swiper-next,
    .zoozone-swiper-prev {
        display: none;
    }

    .zoozone-products-next,
    .zoozone-products-prev {
        display: none;
    }

    .shop-archive-header {
        margin-bottom: 30px;
    }
}

/* ── Mobile ≤768px: hide topbar, icon-only actions ── */
@media (max-width: 768px) {

    .header-actions__login-text,
    .header-actions__cart-text {
        display: none;
    }

    .header-actions__login {
        padding: 8px;
        gap: 0;
    }

    .header-actions__cart {
        padding: 10px 10px;
        gap: 0;
    }

    .header-logo img,
    .header-logo svg {
        width: 120px;
    }
}

/* ── Mobile nav drawer ── */
.header-mobile-nav {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 9500;
}

.header-mobile-nav.is-visible {
    display: block;
}

.header-mobile-nav__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    opacity: 0;
    transition: opacity 0.35s ease;
}

.header-mobile-nav.is-open .header-mobile-nav__overlay {
    opacity: 1;
}

/* Panel slides in from LEFT */
.header-mobile-nav__panel {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: min(360px, 100vw);
    background: #fff;
    display: flex;
    flex-direction: column;
    transform: translateX(-100%);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    overflow: hidden;
}

/* Fixed top part — head + auth + lang */
.header-mobile-nav__head,
.header-mobile-nav__auth,
.header-mobile-nav__lang {
    flex-shrink: 0;
}

/* Scrollable bottom part — categories + pages + contacts */
.header-mobile-nav__scroll {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
}

.header-mobile-nav.is-open .header-mobile-nav__panel {
    transform: translateX(0);
}

/* Head: "Menu" title + close button */
.header-mobile-nav__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
    flex-shrink: 0;
}

.header-mobile-nav__title {
    font-size: 22px;
    font-weight: 700;
    color: #232323;
    line-height: 1.2;
}

.header-mobile-nav__close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--color-black, #1a1a1a);
    flex-shrink: 0;
}

.header-mobile-nav__close svg {
    display: block;
}

/* Orange login / account button */
.header-mobile-nav__auth {
    padding: 0 8px 12px;
    flex-shrink: 0;
}

.header-mobile-nav__auth-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    padding: 16px 20px;
    background: #E8720B;
    color: #fff;
    border: none;
    border-radius: 100px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.2s ease;
}

.header-mobile-nav__auth-btn:hover,
.header-mobile-nav__auth-btn:focus {
    background: #ea6c0e;
    color: #fff;
}

/* Language switcher in drawer */
.header-mobile-nav__lang {
    padding: 0 8px 20px;
    flex-shrink: 0;
}

.header-mobile-nav__lang .header-lang {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 12px 20px;
    border: 1px solid var(--color-ebb, #e0d8cf);
    border-radius: 100px;
    cursor: pointer;
    font-size: 15px;
    color: var(--color-black, #1a1a1a);
    background: #fff;
}

.header-mobile-nav__lang .header-lang__current {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
    justify-content: space-between;
}

.header-mobile-nav__lang .header-lang__dropdown {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid var(--color-ebb, #e0d8cf);
    border-radius: 16px;
    list-style: none;
    margin: 0;
    padding: 8px 0;
    z-index: 10;
    display: none;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}

.header-mobile-nav__lang .header-lang.is-open .header-lang__dropdown {
    display: block;
}

.header-mobile-nav__lang .header-lang__dropdown li a {
    display: block;
    padding: 9px 16px;
    font-size: 14px;
    color: var(--color-black, #1a1a1a);
    text-decoration: none;
}

.header-mobile-nav__lang .header-lang__dropdown li a:hover {
    background: var(--color-spring-wood, #f5f0eb);
}

/* Section: category nav + page links */
.header-mobile-nav__section {
    flex-shrink: 0;
    padding: 20px 0;
}

/* Category links with right-pointing chevron */
.header-mobile-nav .header-cat-nav {
    padding: 0;
    width: 100%;
}

.header-mobile-nav .header-cat-nav__list {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    /* override desktop align-items:center */
    gap: 0;
    overflow-x: unset;
    flex-wrap: nowrap !important;
    padding: 0;
    width: 100%;
}

.header-mobile-nav .header-cat-nav__item {
    flex-shrink: unset;
    width: 100%;
}

.header-mobile-nav .header-cat-nav__link {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px;
    padding: 12px 30px 12px 23px;
    border-radius: 0 !important;
    background: transparent;
    font-size: 16px;
    font-weight: 500;
    white-space: normal !important;
    color: var(--color-everglades, #205330);
    text-decoration: none;
    width: 100%;
    box-sizing: border-box;
}

.header-mobile-nav .header-cat-nav__link::after {
    content: '';
    display: block;
    width: 7px;
    height: 7px;
    border-right: 2px solid rgb(63 63 63);
    border-top: 2px solid rgb(63 63 63);
    transform: rotate(45deg);
    margin-left: auto;
    flex-shrink: 0;
    opacity: 0.5;
}

.header-mobile-nav .header-cat-nav__link--special {
    color: var(--color-christine, #f97316);
}

.header-mobile-nav .header-cat-nav__link:hover {
    background: var(--color-spring-wood, #f5f0eb);
}

.header-mobile-nav .header-cat-nav__icon {
    width: 24px;
    height: 24px;
    min-width: 24px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.header-mobile-nav .header-cat-nav__icon svg,
.header-mobile-nav .header-cat-nav__icon img {
    width: 24px;
    height: 24px;
}

/* Page links (topbar menu) */
.header-mobile-nav .topbar-navigation {
    list-style: none;
    margin: 0;
    padding: 0;
}

.header-mobile-nav .topbar-navigation li a {
    display: block;
    padding: 12px 20px;
    font-size: 15px;
    color: var(--color-black, #1a1a1a);
    text-decoration: none;
}

.header-mobile-nav .topbar-navigation li a:hover {
    background: var(--color-spring-wood, #f5f0eb);
}

/* Contacts */
.header-mobile-nav__contacts {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 20px 12px;
    border-top: 1px solid var(--color-ebb, #e0d8cf);
    flex-shrink: 0;
    margin-top: auto;
    margin: 0 8px;
}

.header-mobile-nav__contact-link {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 15px;
    color: var(--color-black, #1a1a1a);
    text-decoration: none;
    padding: 3px 0;
}

.header-mobile-nav__contact-link:hover {
    color: var(--color-primary, #205330);
}

/* Body scroll lock */
body.zz-nav-open {
    overflow: hidden;
}

/* ── Mobile logo ── */
.header-logo__default {
    display: contents;
}

/* Higher specificity (0,2,0) beats .header-logo a (0,1,1) */
.header-logo .header-logo__mobile {
    display: none;
    align-items: center;
    text-decoration: none;
}

.header-logo__mobile img {
    width: auto;
    height: 40px;
    max-width: 160px;
    object-fit: contain;
}

@media (max-width: 1024px) {
    .zz-has-mobile-logo .header-logo__default {
        display: none;
    }

    .zz-has-mobile-logo .header-logo .header-logo__mobile {
        display: flex;
    }
}

/* ── Mobile nav: stagger fade-in (opacity only — no transform to avoid z-order bugs) ── */
.header-mobile-nav__head,
.header-mobile-nav__auth,
.header-mobile-nav__lang,
.header-mobile-nav__section,
.header-mobile-nav__contacts {
    opacity: 0;
    transition: opacity 0.2s ease;
}

.header-mobile-nav.is-open .header-mobile-nav__head {
    opacity: 1;
    transition-delay: 0.15s;
}

.header-mobile-nav.is-open .header-mobile-nav__auth {
    opacity: 1;
    transition-delay: 0.2s;
}

.header-mobile-nav.is-open .header-mobile-nav__lang {
    opacity: 1;
    transition-delay: 0.24s;
}

.header-mobile-nav.is-open .header-mobile-nav__section--cats {
    opacity: 1;
    transition-delay: 0.28s;
}

.header-mobile-nav.is-open .header-mobile-nav__section--pages {
    opacity: 1;
    transition-delay: 0.33s;
}

.header-mobile-nav.is-open .header-mobile-nav__contacts {
    opacity: 1;
    transition-delay: 0.38s;
}

/* Closing: instantly reset content opacity so it fades before panel slides out */
.header-mobile-nav.is-closing .header-mobile-nav__head,
.header-mobile-nav.is-closing .header-mobile-nav__auth,
.header-mobile-nav.is-closing .header-mobile-nav__lang,
.header-mobile-nav.is-closing .header-mobile-nav__section,
.header-mobile-nav.is-closing .header-mobile-nav__contacts {
    opacity: 0 !important;
    transition-delay: 0s !important;
    transition-duration: 0.1s !important;
}

.header-mobile-nav.is-closing .header-mobile-nav__overlay {
    opacity: 0;
}

.zz-checkout-header__back-mob {
    display: none!important;
}

@media(max-width: 1200px) {
    .zz-co-card .zz-profile-row__label {
        min-width: 110px;
    }

    .zz-co-address-row__label {
        min-width: 110px;
    }

    .zz-order__content {
        flex-direction: column;
    }

    .zz-order__info-card {
        width: 100%;
    }
}

/* ── Hero / Home swiper ── */
@media (max-width: 1024px) {
    .zoozone-hero-slide__content {
        padding: 32px 40px;
    }

    .zoozone-hero-slide__title {
        font-size: 28px;
    }

    .zoozone-category-products-slider {
        padding: 40px 0;
    }

    .zoozone-products-track {
        width: calc(100% + 30px);
    }

    .zoozone-products-swiper .swiper-slide {
        width: 248px;
    }

    .zoozone-categories-section {
        padding: 40px 0;
    }

    .zoozone-brands-section {
        padding: 40px 0;
    }

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

    .zoozone-feature-blocks-widget {
        padding: 40px 0 80px;
    }

    .footer-main {
        padding: 70px 30px;
    }

    .footer-inner {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-areas:
            "social social"
            "cats support"
            "contact .";
        grid-gap: 50px 20px;
    }

    .footer-col--social {
        grid-area: social;
    }

    .footer-col--cats {
        grid-area: cats;
    }

    .footer-col--support {
        grid-area: support;
    }

    .footer-col--contact {
        grid-area: contact;
    }

    .footer-bottom {
        padding: 20px 30px;
    }

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

    .site-header {
        top: -45px;
    }

    .header-logo .header-logo__mobile {
        display: flex !important;
    }

    .header-mobile-nav__section--pages {
        margin: 0 8px;
        border-top: 1px solid #E1E5E3;
    }

    .shop-archive-controls {
        display: none !important;
    }

    .zz-product-info__main {
        gap: 10px;
    }

    .zz-price-total {
        margin-bottom: 0;
    }

    .zz-sp-next,
    .zz-sp-prev {
        display: none;
    }

    .zz-products-swiper {
        width: calc(100% + 30px);
    }

    .zz-gallery__nav--next,
    .zz-gallery__nav--prev {
        display: none;
    }

    .zz-gallery__main {
        max-width: initial !important;
    }

    .zz-gallery__thumbs {
        justify-content: flex-start;
    }

    .zz-cart-wrap {
        padding: 30px 0 40px;
        width: calc(100% - 60px);
    }

    .zz-cart-title {
        margin: 0 0 10px;
    }

    .zz-checkout-header__contacts .zz-checkout-header__contact:nth-of-type(1) {
        display: none;
    }

    .zz-checkout-layout {
        padding: 40px 0;
    }

    .zz-co-card .zz-profile-row__label {
        min-width: 180px;
    }

    .zoozone-banner-hero {
        padding: 74px 0!important;
    }

    .zoozone-text-image {
        padding: 30px 0!important;
    }

    .zoozone-text-image__inner {
        grid-template-columns: 1fr;
        grid-gap: 30px;
    }

    .zoozone-text-image--img-right .zoozone-text-image__image {
        order: 0;
    }

    .zoozone-cta-banner__inner {
        grid-template-columns: 1fr;
    }

    .zoozone-cta-banner__image {
        order: -1;
        max-height: 320px;
    }

    .zoozone-cta-banner__content {
        padding: 40px;
    }

    .zoozone-contact-layout {
        grid-template-columns: 1fr;
        grid-gap: 50px;
    }

    .zoozone-stores-body {
        padding-bottom: 80px;
    }

    .zoozone-stores-grid {
        grid-gap: 20px;
    }

    .zz-account-card__title {
        font-size: 18px;
    }

    /* ── Account nav – horizontal swipe strip ─────────────────── */
    .zz-account-sidebar {
        min-width: 0;
        width: 100%;
    }

    .zz-account-nav {
        width: 100%;
        min-width: 0;
        flex-direction: row;
        overflow-x: auto;
        overflow-y: visible;
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding: 20px 16px;
        gap: 4px;
        /* border-radius: 50px; */
    }

    .zz-account-nav::-webkit-scrollbar {
        display: none;
    }

    .zz-account-nav__item {
        flex-shrink: 0;
        white-space: nowrap;
        padding: 10px 16px;
        font-size: 14px;
        border-radius: 50px;
        gap: 8px;
    }

    /* show icons on mobile strip */
    .zz-account-nav__icon {
        display: flex;
        width: 16px;
        height: 16px;
    }

    .zz-account-nav__icon svg {
        width: 16px;
        height: 16px;
    }

    .zz-profile-input {
        flex: initial!important;
    }

    .zz-order__totals {
        padding-top: 20px;
    }

    .zz-order__content {
        gap: 50px;
    }

    .zz-brands-popular__grid {
        grid-template-columns: repeat(4, 1fr);
    }

    .zz-brands-groups {
        grid-template-columns: repeat(2, 1fr);
    }

    .zoozone-cat-card__label {
        margin-top: 30px;
    }

    .zz-cat-widget-card {
        aspect-ratio: initial;
        min-height: 250px;
        display: flex;
        flex-direction: column;
    }

    .zz-cat-widget-card__image {
        position: initial;
        flex: 1;
    }

    .zz-cat-widget-card__label {
        position: initial;
        padding: 20px 24px;
    }

    .zz-cat-widget-card__image img {
        height: 100%!important;
    }
}

@media (max-width: 768px) {
    .zoozone-hero-slide__content {
        padding: 20px 24px;
    }

    .zoozone-hero-slide__title {
        font-size: 20px;
    }

    .zoozone-hero-slide__subtitle {
        font-size: 13px;
    }

    .zoozone-home-swiper {
        aspect-ratio: unset;
        height: auto;
    }
    .zoozone-home-swiper .swiper-wrapper,
    .zoozone-home-swiper .swiper-slide {
        height: auto;
    }
    .zoozone-home-swiper .slide-img {
        position: static;
        width: 100%;
        height: auto;
        object-fit: unset;
    }

    .zz-single-product-section {
        padding: 30px 0 40px;
    }

    .zz-co-card .zz-profile-row__label {
        min-width: 110px;
    }

    .zz-checkout-header__logo.zz-has-mobile-logo .zz-checkout-header__logo-default {
        max-width: 190px;
    }

    .zz-checkout-header__logo-default a {
        display: flex;
    }

    .zz-co-card .zz-profile-row__fields {
        flex-direction: column;
    }

    .zz-co-card .zz-profile-row__fields .zz-profile-input {
        flex: initial;
    }
    
    .zz-co-address-grid {
        grid-template-columns: 1fr;
    }

    .zz-order__chevron {
        margin-left: 30px;
    }

    .zz-brands-popular__grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .zoozone-cat-card {
        min-height: initial;
    }
}

@media (max-width: 576px) {
    .header-contact {
        font-size: 13px;
    }

    .container {
        width: calc(100% - 24px);
    }

    .header-actions__login {
        display: none;
    }

    .header-actions__cart-text {
        display: none;
    }

    .header-actions__cart {
        padding: 10px;
    }

    .header-search {
        height: 48px;
    }

    .zoozone-swiper-pagination {
        gap: 6px;
    }

    .zoozone-products-title {
        font-size: 24px;
    }

    .zoozone-category-products-slider {
        padding: 30px 0;
    }

    .zoozone-categories-grid {
    }

    .zoozone-categories-section {
        padding: 30px 0;
    }

    .zoozone-brands-see-all {
        padding: 7px 26px;
    }

    .zoozone-brands-title {
        font-size: 24px;
    }



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

    .zoozone-feature-blocks-widget {
        padding: 30px 0 60px;
    }

    .zoozone-brands-section {
        padding: 30px 0;
    }

    .zoozone-feature-block-title {
        font-size: 16px;
    }

    .zoozone-feature-block-text {
        font-size: 14px;
    }

    .zoozone-feature-block-icon {
        width: 48px;
        height: 48px;
    }

    .footer-inner {
        grid-template-columns: 1fr;
        grid-template-areas:
            "social"
            "cats"
            "support"
            "contact";
        grid-gap: 30px;
    }

    .footer-main {
        padding: 60px 12px;
    }

    .footer-bottom {
        padding: 20px 12px;
    }

    .footer-bottom-inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }

    .zoozone-products-track {
        width: calc(100% + 12px);
    }

    .shop-archive-header .page-title {
        font-size: 28px;
    }

    .product-card-image {
        height: 150px;
    }

    .product-card-image {
        height: auto;
    }

    .product-card-brand {
        font-size: 13px;
    }

    .product-card-title {
        font-size: 12px !important;
    }

    .product-card-price .woocommerce-Price-amount,
    .product-card-price>.amount {
        font-size: 14px;
    }

    .product-card-weight {
        font-size: 12px;
    }

    .shop-archive-layout {
        padding-bottom: 40px;
    }

    .zz-filter-drawer__head {
        padding: 20px 12px 15px;
    }

    .zz-filter-drawer__scroll.shop-sidebar {
        padding: 15px 12px 12px;
    }

    .zz-product-card {
        padding: 16px;
    }

    .zz-product-short-desc {
        font-size: 13px;
    }

    .zz-price-total {
        font-size: 22px;
    }

    .zz-single-product-section {
        padding: 20px 0 30px;
    }

    .zz-products-swiper {
        width: calc(100% + 12px);
    }

    .zz-delivery__text {
        font-size: 13px;
    }

    .zz-delivery__title {
        font-size: 14px;
    }

    .zz-tab-content p {
        font-size: 13px;
    }

    .zz-specs-table td {
        font-size: 13px;
    }

    /* ── Cart page – mobile ─────────────────────────────────── */
    .zz-cart-wrap {
        grid-template-columns: 1fr;
        width: calc(100% - 32px);
        padding: 20px 0 40px;
        gap: 20px;
    }

    .zz-cart-summary {
        position: static;
    }

    .zz-cart-title {
        font-size: 22px;
        margin-bottom: 16px;
    }

    /* 3-col grid: [72px img] [1fr space] [auto right]
       Row 1: img  + info (col 2–3)
       Row 2: —    + stepper (col 2)  + Total (col 3, right-aligned)
       Row 3: —    + —                + Delete (col 3, right-aligned) */
    .zz-cart-item {
        display: grid;
        grid-template-columns: 72px 1fr auto;
        grid-template-rows: auto auto auto;
        column-gap: 12px;
        row-gap: 10px;
        padding: 16px 0;
    }

    .zz-cart-item__img {
        grid-column: 1;
        grid-row: 1;
    }

    .zz-cart-item__img img {
        width: 72px;
        height: 72px;
    }

    .zz-cart-item__info {
        grid-column: 2 / 4;
        grid-row: 1;
        min-width: 0;
    }

    .zz-cart-item__name {
        -webkit-line-clamp: unset;
        line-clamp: unset;
        font-size: 14px;
    }

    .zz-cart-item__qty {
        grid-column: 2;
        grid-row: 2;
        align-self: center;
    }

    .zz-cart-item__subtotal {
        grid-column: 3;
        grid-row: 2;
        align-self: center;
        text-align: right;
        white-space: nowrap;
        font-size: 15px !important;
        font-weight: 400 !important;
    }

    .zz-cart-item__subtotal::before {
        content: 'Total: ';
    }

    .zz-cart-item__remove {
        grid-column: 3;
        grid-row: 3;
        justify-self: end;
        align-self: center;
        width: auto !important;
        height: auto !important;
        border-radius: 0 !important;
        background: transparent !important;
        padding: 0;
    }

    .zz-cart-item__remove svg {
        display: none;
    }

    .zz-cart-item__remove-label {
        display: inline;
        font-size: 13px;
        font-weight: 400;
        color: #205330;
        text-decoration: underline;
    }

    .zz-cart-item .zz-qty-wrap {
        max-width: 105px;
    }

    .zz-cart-item__qty {
        margin-top: 0;
    }

    .zz-cart-summary__card {
        padding: 20px;
    }

    .zz-cart-summary__title {
        font-size: 16px;
    }

    .zz-cart-summary__row {
        font-size: 13px !important;
    }

    .zz-cart-summary__total-amount .amount {
        font-size: 17px !important;
    }

    .zz-cart-summary__legal {
        font-size: 12px;
    }

    .zz-cart-wrap {
        padding: 20px 0 30px;
    }

    .zz-checkout-header__logo.zz-has-mobile-logo .zz-checkout-header__logo-default {
        display: none;
    }

    .zz-checkout-header__logo.zz-has-mobile-logo .zz-checkout-header__logo-mobile {
        display: flex;
    }

    /* ── Checkout order items – mobile ─────────────────────────────── */
    .zz-co-item {
        display: grid;
        grid-template-columns: 72px 1fr auto;
        grid-template-rows: auto auto auto;
        column-gap: 12px;
        row-gap: 10px;
        padding: 16px 0;
    }

    .zz-co-item__img {
        grid-column: 1;
        grid-row: 1;
    }

    .zz-co-item__img img {
        width: 72px;
        height: 72px;
    }

    .zz-co-item__info {
        grid-column: 2 / 4;
        grid-row: 1;
        min-width: 0;
    }

    .zz-co-item__name {
        font-size: 14px;
    }

    .zz-co-item__total {
        grid-column: 3;
        grid-row: 2;
        align-self: center;
        text-align: right;
        white-space: nowrap;
        font-size: 15px !important;
        font-weight: 400 !important;
    }

    .zz-co-item__remove {
        grid-column: 3;
        grid-row: 3;
        justify-self: end;
        align-self: center;
        width: auto !important;
        height: auto !important;
        border-radius: 0 !important;
        background: transparent !important;
        padding: 0;
    }

    .zz-co-item__remove svg {
        display: none;
    }

    .zz-co-item__remove-label {
        display: inline;
        font-size: 13px;
        font-weight: 400;
        color: #205330;
        text-decoration: underline;
    }

    /* ── Checkout header – mobile ──────────────────────────────── */
    .zz-checkout-header > .container {
        height: 56px;
        position: relative;
    }

    .zz-checkout-header__back {
        font-size: 0;
        gap: 0;
        flex-shrink: 0;
    }

    .zz-checkout-header__logo {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
    }

    .zz-checkout-header__contacts {
        flex-shrink: 0;
    }

    .zz-checkout-header__contact {
        font-size: 0;
        gap: 0;
    }

    .zz-checkout-header__logo img {
        height: 24px;
    }

    .zz-checkout-header__back svg {
        display: none;
    }

    .zz-checkout-header__back-mob {
        display: block!important;
    }

    .zz-checkout-header {
        margin: 0 8px;
    }

    .zz-checkout-title {
        font-size: 24px;
    }

    .zz-checkout-layout {
        padding: 30px 0;
    }

    .zz-checkout-layout {
        width: calc(100% - 24px);
    }

    .zz-co-card {
        padding: 20px;
    }

    .zz-co-cart-toggle {
        font-size: 16px;
    }

    .zz-co-card__title {
        font-size: 16px;
    }

    .zz-co-card .zz-profile-row {
        flex-direction: column;
        padding: 0;
        align-items: flex-start;
        gap: 10px;
    }

    .zz-co-card .zz-profile-row__fields {
        width: 100%;
    }

    .zz-co-personal-fields {
        gap: 16px;
    }

    .zz-co-card .zz-profile-row__label {
        font-size: 13px;
    }

    .zz-co-card .zz-profile-input {
        height: 52px;
        font-size: 16px;
    }

    .zz-co-card__title {
        margin-bottom: 20px;
    }

    .zz-shipping-option__name {
        font-size: 14px;
    }

    .zz-shipping-option__desc {
        font-size: 13px;
    }

    .zz-shipping-option__price-free, .zz-shipping-option__price-paid {
        font-size: 14px;
    }

    #payment .wc_payment_method>label .zz-pay-method-title {
        font-size: 14px;
    }

    .zz-checkout-summary__title {
        font-size: 16px;
    }

    .zz-checkout-summary__row-label {
        font-size: 13px;
    }

    .zz-checkout-summary__row-value {
        font-size: 13px;
    }

    .zz-checkout-summary__total-label {
        font-size: 14px;
    }

    .zz-checkout-summary__total-amount {
        font-size: 17px;
    }

    .zz-checkout-summary__legal {
        font-size: 12px;
    }

    .zz-checkout-summary__card {
        gap: 12px;
    }

    .zz-checkout-summary__title {
        margin-bottom: 8px;
    }

    .zoozone-auth-form input[type="text"], .zoozone-auth-form input[type="email"], .zoozone-auth-form input[type="password"], .zoozone-auth-form input[type="tel"] {
        flex: initial;
        height: 52px;
    }

    .zoozone-banner-hero__title {
        font-size: 36px;
    }

    .zoozone-banner-hero {
        padding: 58px 0 !important;
    }

    .zoozone-banner-hero__subtitle {
        font-size: 15px;
    }

    .zoozone-text-image__title {
        font-size: 28px;
    }

    .zoozone-text-image__text {
        font-size: 15px;
    }

    .zoozone-cta-banner__image {
        min-height: 220px;
        max-width: initial;
    }

    .zoozone-cta-banner__title {
        font-size: 28px;
    }

    .zoozone-cta-banner__text {
        font-size: 15px;
    }

    .zoozone-cta-banner__content {
        padding: 24px 20px 20px;
    }

    .zoozone-cta-banner {
        padding-bottom: 60px;
    }

    .zoozone-contact-layout {
        padding: 20px 16px;
    }

    .zoozone-contact-info__logo {
        margin-bottom: 16px;
        max-width: 230px;
    }

    .zoozone-contact-info__company-name {
        font-size: 20px;
    }

    .zoozone-contact-info__company-sub {
        font-size: 14px;
    }

    .zoozone-contact-info__label {
        font-size: 14px;
    }

    .zoozone-contact-info__value {
        font-size: 15px;
    }

    .zoozone-contact-section {
        padding: 20px 0 30px;
    }

    .zoozone-contact-info__row {
        gap: 4px;
    }

    .zoozone-contact-layout {
        grid-gap: 40px;
    }

    .zoozone-contact-form__title {
        font-size: 24px;
    }

    .zoozone-contact-form__desc {
        font-size: 13px;
    }

    .zoozone-contact-form__grid {
        grid-template-columns: 1fr;
    }

    .zoozone-contact-form__policy {
        font-size: 14px;
    }

    .zoozone-store-card {
        padding: 20px;
    }

    .zoozone-store-card__name {
        font-size: 20px;
        margin-bottom: 16px;
    }

    .zoozone-store-card__label {
        font-size: 14px;
    }

    .zoozone-store-card__value {
        font-size: 15px;
    }

    .zoozone-stores-grid {
        grid-gap: 12px;
    }

    .zoozone-stores-body {
        padding-bottom: 60px;
    }

    .zz-account-card__title {
        font-size: 16px;
        margin-bottom: 16px;
    }

    .zz-profile-row__label {
        font-size: 13px;
    }

    .zz-profile-input {
        height: 52px;
    }

    .zz-profile-actions {
        padding-top: 0;
    }

    .zz-profile-actions {
        flex-direction: column;
    }

    .zz-account-wrap {
        padding-bottom: 60px;
    }

    .zz-order__number {
        font-size: 13px;
    }

    .zz-order__status {
        font-size: 12px;
    }

    .zz-order__date, .zz-order__total {
        font-size: 14px;
    }

    .zz-brands-search__icon {
        right: 20px;
    }

    .zz-brands-section__heading {
        font-size: 16px;
    }

    .zz-brands-popular__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .zz-brands-popular {
        padding-bottom: 40px;
    }

    .shop-archive-header {
        margin-bottom: 20px;
    }

    .zoozone-cat-card {
        padding: 12px;
        border-radius: 12px;
    }

    .zoozone-cat-card__name {
        font-size: 14px;
    }

    .zoozone-cat-card__label {
        margin-top: 16px;
    }

    .zoozone-categories-grid {
        margin-bottom: 40px;
    }

    .zoozone-categories-grid {
        grid-template-columns: 1fr;
    }

    .zz-cat-widget-card__label {
        padding: 20px;
    }
}



@media (max-width: 480px) {
    .zoozone-hero-slide__title {
        font-size: 17px;
    }
}

/* ── Product sliders ── */
@media (max-width: 768px) {
    .zoozone-products-slider .swiper-slide {
        width: 200px;
    }

    .zoozone-section__heading {
        font-size: 22px;
    }
}

@media (max-width: 480px) {
    .zoozone-products-slider .swiper-slide {
        width: 160px;
    }

    .zoozone-section__heading {
        font-size: 20px;
    }

    .zoozone-section__top {
        flex-wrap: wrap;
        gap: 8px;
    }
}

/* ── Footer ── */
@media (max-width: 900px) {
    .footer-col {
        flex: 1 1 calc(50% - 18px);
        min-width: 200px;
    }
}

@media (max-width: 576px) {
    .footer-col {
        flex: none;
        width: 100%;
    }

    .footer-bottom {
        flex-direction: column;
        gap: 12px;
        text-align: center;
    }

    .woocommerce-breadcrumb {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        white-space: nowrap;
        /* Fade out on the right edge */
        -webkit-mask-image: linear-gradient(to right, black 80%, transparent 100%);
        mask-image: linear-gradient(to right, black 80%, transparent 100%);
    }

    .woocommerce-breadcrumb::-webkit-scrollbar {
        display: none;
    }
}

/* ── Section padding ── */
@media (max-width: 768px) {
    .zoozone-section {
        padding-top: 40px;
        padding-bottom: 40px;
    }

    .zoozone-section--sm {
        padding-top: 28px;
        padding-bottom: 28px;
    }
}

@media (max-width: 480px) {
    .zoozone-section {
        padding-top: 28px;
        padding-bottom: 28px;
    }
}

/* ── Benefit cards ── */
@media (max-width: 900px) {
    .zz-benefits-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) {
    .zz-benefits-grid {
        grid-template-columns: 1fr;
    }
}

/* ── Paysera payment section ─────────────────────────────────── */

.payment_method_paysera .payment_box br {
    display: none;
}

#paysera_country,
.payment-country-select {
    width: 100%;
    height: 54px;
    background: #F6FBF8 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23205330' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") no-repeat right 18px center;
    border: 1.5px solid #EAEEEC;
    border-radius: 12px;
    padding: 0 48px 0 20px;
    font-size: 15px;
    font-weight: 500;
    color: #232323;
    -webkit-appearance: none;
    appearance: none;
    cursor: pointer;
    margin-bottom: 16px;
    transition: border-color .18s, box-shadow .18s;
}

#paysera_country:focus,
.payment-country-select:focus {
    border-color: #205330;
    outline: none;
    box-shadow: 0 0 0 3px rgba(32, 83, 48, .1);
}

.payment_method_paysera .payment-group-title {
    font-size: 11px;
    font-weight: 700;
    color: #205330;
    text-transform: uppercase;
    letter-spacing: .08em;
    margin: 16px 0 8px;
    padding-bottom: 6px;
    border-bottom: 1px solid #EAEEEC;
}

.payment_method_paysera .payment-group-wrapper:first-child .payment-group-title {
    margin-top: 0;
}

.payment_method_paysera .paysera-payment-method {
    margin-bottom: 6px;
}

.payment_method_paysera .paysera-payment-method:last-child {
    margin-bottom: 0;
}

.payment_method_paysera .paysera-payment-method-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #fff;
    border: 1.5px solid #EAEEEC;
    border-radius: 12px;
    padding: 10px 16px;
    cursor: pointer;
    gap: 12px;
    min-height: 52px;
    transition: border-color .18s, background .18s, box-shadow .18s;
}

.payment_method_paysera .paysera-payment-method-label:hover {
    border-color: #205330;
    background: #F6FBF8;
    box-shadow: 0 2px 10px rgba(32, 83, 48, .08);
}

.payment_method_paysera .paysera-payment-method-label > div:first-child {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
    position: relative;
    padding-left: 32px;
}

.payment_method_paysera .paysera-payment-method-label input[type="radio"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
    width: 1px;
    height: 1px;
}

.payment_method_paysera .paysera-payment-method-label > div:first-child::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    border: 2px solid #D6DBD8;
    border-radius: 50%;
    background: #fff;
    transition: border-color .18s, background .18s, box-shadow .18s;
    flex-shrink: 0;
}

.payment_method_paysera .paysera-text {
    font-size: 15px;
    font-weight: 500;
    color: #232323;
    line-height: 1.3;
}

.payment_method_paysera .paysera-image {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-shrink: 0;
    width: 72px;
}

.payment_method_paysera .paysera-image img {
    height: 26px;
    width: auto;
    max-width: 72px;
    object-fit: contain;
    display: block;
}

.payment_method_paysera .paysera-payment-method-label:has(input:checked) {
    border-color: #E8720B;
    background: #FFF9F5;
    box-shadow: 0 2px 14px rgba(232, 114, 11, .12);
}

.payment_method_paysera .paysera-payment-method-label:has(input:checked) > div:first-child::before {
    border-color: #E8720B;
    background: #E8720B;
    box-shadow: inset 0 0 0 4px #fff;
}

.payment_method_paysera .paysera-payment-method-label:has(input:checked) .paysera-text {
    color: #E8720B;
    font-weight: 600;
}

@media (max-width: 600px) {
    .payment_method_paysera .paysera-image {
        width: 56px;
    }
    .payment_method_paysera .paysera-image img {
        max-width: 56px;
        height: 22px;
    }
    .payment_method_paysera .paysera-text {
        font-size: 14px;
    }
}

/* ── Venipak pickup selector (card + popup) ─────────────────────── */

/* Override plugin's narrow max-width on the wrapper */
.zz-venipak-wrapper.venipak-pickup-wrapper {
    max-width: 100% !important;
    margin-left: 0 !important;
    padding-top: 0 !important;
}

/* "Izvēlieties kartē" button */
.zz-venipak-open-map {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    width: 100%;
    padding: 12px 20px;
    margin-top: 8px;
    background: #205330;
    color: #fff;
    border: none;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s;
    box-sizing: border-box;
}
.zz-venipak-open-map:hover  { background: #174225; }
.zz-venipak-open-map:active { transform: scale(0.98); }

/* Full-screen overlay */
.zz-venipak-popup {
    position: fixed;
    inset: 0;
    z-index: 99999;
    background: rgba(0, 0, 0, 0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    box-sizing: border-box;
}

/* Popup card */
.zz-venipak-popup-box {
    background: #fff;
    border-radius: 16px;
    width: 100%;
    max-width: 720px;
    max-height: 90vh;
    overflow-y: auto;
    padding: 20px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 14px;
    box-shadow: 0 12px 48px rgba(0, 0, 0, 0.22);
    position: relative;
}

/* Header row: title + X */
.zz-venipak-popup-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-shrink: 0;
    position: relative;
    z-index: 2;
}
.zz-venipak-popup-header strong {
    font-size: 16px;
    font-weight: 700;
    color: #232323;
}

/* Close button — z-index above Google Maps layers */
.zz-venipak-popup-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    min-width: 34px;
    border: none;
    background: #f0f5f2;
    border-radius: 50%;
    cursor: pointer;
    color: #4d4e4d;
    transition: background 0.15s;
    position: relative;
    z-index: 2;
}
.zz-venipak-popup-close:hover { background: #dce9e0; }

/* Selected terminal info (populated by plugin JS after pick) */
.zz-venipak-selected-info {
    font-size: 13px;
    color: #232323;
    background: #eef7f1;
    border: 1px solid #c8e0d0;
    border-radius: 8px;
    padding: 10px 14px;
    display: none;
    flex-shrink: 0;
}
.zz-venipak-selected-info:not(:empty) { display: block; }
.zz-venipak-selected-info b { font-weight: 600; }

/* Select2 search inside popup */
.zz-venipak-select + .select2-container {
    width: 100% !important;
    flex-shrink: 0;
}

/* Map container — plugin JS shows it via .show() (inline style overrides display:none) */
.zz-venipak-map {
    width: 100%;
    height: 400px;
    border-radius: 10px;
    overflow: hidden;
    flex-shrink: 0;
}

/* Select2 dropdown must appear above the popup overlay (default z-index is 1051) */
.select2-container--open .select2-dropdown {
    z-index: 100000 !important;
}

@media (max-width: 767px) {
    .zz-venipak-popup { padding: 0; align-items: flex-end; }
    .zz-venipak-popup-box {
        max-width: 100%;
        border-radius: 20px 20px 0 0;
        max-height: 92vh;
        padding: 16px 16px 24px;
        gap: 12px;
    }
    .zz-venipak-map { height: 300px; }
}

/* ── Order-received page: clean background behind success popup ───── */
.woocommerce-order-received .site-content {
    background: var(--color-spring-wood);
    min-height: 60vh;
}
.zz-order-failed {
    max-width: 640px;
    margin: 60px auto;
    padding: 0 20px;
}
}