/*
 * Zartab design-system bridge.
 *
 * Elementor owns placement and WooCommerce owns commerce markup. This file is
 * intentionally small and loaded last so shared tokens and accessibility
 * rules stay consistent without replacing either system's templates.
 */
:root {
    --zt-font: "YekanBakh", Vazirmatn, Tahoma, Arial, sans-serif;
    --zt-space-1: 4px;
    --zt-space-2: 8px;
    --zt-space-3: 12px;
    --zt-space-4: 16px;
    --zt-space-5: 24px;
    --zt-space-6: 32px;
    --zt-radius-sm: 10px;
    --zt-radius-md: 14px;
    --zt-radius-lg: 18px;
    --zt-radius-xl: 22px;
    --zt-shadow-sm: 0 6px 20px rgba(63, 64, 100, .06);
    --zt-shadow-md: 0 12px 32px rgba(63, 64, 100, .09);
    --zt-content-max: 1328px;
    --zt-focus-ring: 0 0 0 4px rgba(25, 191, 211, .18);
}

html {
    scroll-padding-top: 96px;
}

body {
    overflow-x: clip;
    font-family: var(--zt-font);
}

body :where(button, input, select, textarea, .elementor-button, .button) {
    font-family: inherit;
}

body :where(a, button, input, select, textarea, summary, .elementor-button, .button):focus-visible {
    outline: 2px solid var(--zt-cyan);
    outline-offset: 3px;
    box-shadow: var(--zt-focus-ring);
}

body :where(input, select, textarea) {
    accent-color: var(--zt-red);
}

body :where(.zartab-container, .z-et-shell, .z-et-archive-head, .z-et-archive-filter, .z-et-archive-products, .z-et-product-breadcrumb, .z-et-product-tabs, .z-et-product-related) {
    max-width: var(--zt-content-max);
}

body :where(.z-page-card, .z-loop-card, .zartab-wishlist-card, .zartab-footer-trust, .zartab-footer-benefits) {
    border-radius: var(--zt-radius-lg);
}

body :where(.z-button, .zartab-filter-toggle, .zartab-filter-actions button, .zartab-wishlist-control__button, .zartab-wishlist-card__actions .button, .zartab-wishlist-card__actions button, .woocommerce button.button, .woocommerce a.button, .woocommerce .button) {
    min-height: 44px;
    border-radius: var(--zt-radius-sm);
}

body :where(.z-page-card, .z-loop-card, .zartab-wishlist-card, .zartab-footer-trust, .zartab-footer-benefits) {
    box-shadow: var(--zt-shadow-sm);
}

body :where(.z-page-card, .z-loop-card, .zartab-wishlist-card, .zartab-footer-trust, .zartab-footer-benefits) {
    transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}

@media (min-width: 768px) and (max-width: 1024px) {
    body :where(.zartab-container, .z-et-shell, .z-et-archive-head, .z-et-archive-filter, .z-et-archive-products, .z-et-product-breadcrumb, .z-et-product-tabs, .z-et-product-related) {
        width: min(calc(100% - 32px), 960px);
        margin-inline: auto;
    }

    .zartab-home-quick-links,
    .zartab-category-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .zartab-footer-benefits {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .woocommerce ul.products {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .z-et-product-main {
        gap: 24px;
    }
}

/* The account shortcode can inherit a narrow Elementor content column. Keep
 * the dashboard aligned with the same content rail as the rest of the shop. */
@media (min-width: 768px) {
    body.woocommerce-account .zartab-page {
        display: block;
        width: min(calc(100% - 32px), var(--zt-content-max)) !important;
        max-width: none !important;
        margin-inline: auto !important;
    }

    body.woocommerce-account .zartab-page > article,
    body.woocommerce-account .zartab-page .woocommerce {
        display: block;
        width: 100% !important;
        max-width: none !important;
    }
}

@media (max-width: 767px) {
    html {
        scroll-padding-top: 72px;
    }

    body {
        padding-bottom: max(68px, calc(68px + env(safe-area-inset-bottom)));
    }

    body :where(.z-page-card, .z-loop-card, .zartab-wishlist-card, .zartab-footer-trust, .zartab-footer-benefits) {
        box-shadow: var(--zt-shadow-sm);
    }

    body :where(.z-page-actions, .zartab-contact-actions, .zartab-contact-action, .zartab-contact-action small, .zartab-footer-trust__heading, .zartab-trust-slot) {
        min-width: 0;
    }

    body :where(.z-page, .zartab-wishlist-page, .woocommerce, .woocommerce-page) {
        max-width: 100%;
    }

    body :where(.woocommerce-tabs, .woocommerce-MyAccount-content, .z-page-section, .z-page-card) {
        overflow-wrap: anywhere;
    }
}

@media (prefers-reduced-motion: reduce) {
    body :where(.z-page-card, .z-loop-card, .zartab-wishlist-card, .zartab-footer-trust, .zartab-footer-benefits) {
        transition: none;
    }
}

/* UI/UX audit 2026-10-23: compact entry points and a clear heading hierarchy. */
body .z-et-header { gap: 0; padding: 0; }
body .z-et-header-main { padding-block: 0; }
body .z-et-header-main > .e-con-inner { min-height: 76px; padding-block: 8px !important; }
body .z-et-header-nav-row { padding: 0; }
body .z-et-brand-wrap .z-et-brand-name h2.elementor-heading-title { color: var(--zt-ink); }
body .zartab-home-quick-links .zartab-quick-link .zartab-quick-link__icon { background: #f2f2f6; color: var(--zt-ink); }
body .zartab-home-quick-links .zartab-quick-link:last-child .zartab-quick-link__icon { background: #fff0f2; color: var(--zt-red); }
body .z-et-home-hero { min-height: 0; margin-top: 12px; padding: 0; }
body .z-et-home-hero > .e-con-inner { gap: 0; padding: 0; }
body .z-et-home-hero-copy { gap: 12px; padding: 26px 32px; }
body .z-et-home-hero-copy > .e-con-inner { gap: 12px; padding: 0; }
body .z-et-home-hero-copy h1.elementor-heading-title { color: var(--zt-ink); font-size: clamp(28px, 3vw, 40px); line-height: 1.4; }
body .z-et-home-hero-copy h4.elementor-heading-title { color: #55576a; font-size: 16px; line-height: 1.7; font-weight: 600; }
body .z-et-home-hero-copy p { margin: 0; color: #55576a; font-size: 14px; }
body .z-et-home-hero-image { padding: 0; }
body .z-et-home-hero-image img { height: 270px; }
body.home .z-et-section { padding-block: 20px; }
body .z-et-section-title h2.elementor-heading-title { color: var(--zt-ink); }
body .z-et-amazing .z-et-section-title h2.elementor-heading-title { color: #fff; }

/* A collapsible filter region on desktop, a modal drawer on mobile. */
body .z-jsf-toggle, body .z-jsf-close { display: block; }
body .z-jsf-toggle-button, body .z-jsf-close-button {
    min-height: 44px; padding: 8px 16px; border: 1px solid var(--zt-line);
    border-radius: var(--zt-radius-sm); background: #fff; color: var(--zt-ink); cursor: pointer;
}
body .z-jsf-panel:not(.is-open) { display: none !important; }
body .z-et-archive-filter { padding-block: 8px; }
body .z-et-archive-filter > .e-con-inner { gap: 10px; padding-block: 0; }
body .z-et-archive-products { padding-top: 10px; }
.zartab-archive-toolbar > .e-con-inner { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 12px; padding: 0; }
.zartab-archive-toolbar .elementor-widget { width: auto !important; }
.zartab-archive-status { margin: 0; color: var(--zt-ink); font-size: 14px; }
.zartab-archive-sorting .jet-sorting { gap: 8px; align-items: center; }
.zartab-archive-sorting .jet-sorting-select { max-width: 100%; min-height: 44px; padding: 8px 12px; border: 1px solid var(--zt-line); border-radius: var(--zt-radius-sm); background: #fff; color: var(--zt-ink); }
.zartab-archive-active .jet-active-filters__list { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.zartab-archive-active .jet-active-filter { display: inline-flex; align-items: center; margin: 0; padding: 4px 10px; border: 1px solid #e4bbc1; border-radius: 12px; background: #fff3f4; color: var(--zt-ink); }
.zartab-archive-active .jet-active-filter__remove { display: grid; place-items: center; min-width: 44px; min-height: 44px; cursor: pointer; font-size: 22px; }
/* Restore native checkbox semantics; Jet's default display:none hides inputs from AT. */
body .z-jsf-panel .jet-checkboxes-list__item { position: relative; }
body .z-jsf-panel .jet-checkboxes-list__item .jet-checkboxes-list__input {
    display: block; visibility: visible; position: absolute; width: 1px; height: 1px;
    opacity: 0; overflow: hidden; clip-path: inset(50%);
}
body .z-jsf-panel .jet-checkboxes-list__input:focus-visible + .jet-checkboxes-list__button { outline: 2px solid var(--zt-ink); outline-offset: 3px; }
body.zartab-filter-modal-open .zartab-faq-chatbot { display: none; }
.zartab-size-help { margin: 8px 0 16px; font-size: 13px; line-height: 1.9; }
.zartab-size-help a { color: var(--zt-ink); text-decoration: underline; text-underline-offset: 4px; }
.zartab-size-help small { display: block; margin-top: 6px; color: #55576a; }
.zartab-product-demo-note { color: #55576a; font-size: 12px; line-height: 1.9; }

/* Shared WooCommerce forms, including the guest account and cart. */
body :is(.woocommerce-account, .woocommerce-cart, .woocommerce-checkout) { color: var(--zt-ink); }
body.woocommerce-account .woocommerce :is(button.button, a.button),
body.woocommerce-cart .woocommerce :is(button.button, a.button),
body.woocommerce-checkout .woocommerce :is(button.button, a.button) {
    display: inline-flex; align-items: center; justify-content: center; min-height: 44px;
    padding: 10px 20px; border: 0; border-radius: var(--zt-radius-sm);
    background: var(--zt-red); color: #fff; font-weight: 700;
}
body:is(.woocommerce-account, .woocommerce-cart, .woocommerce-checkout) .woocommerce :is(button.button, a.button):hover { background: var(--zt-red-dark); color: #fff; }
body:is(.woocommerce-account, .woocommerce-cart, .woocommerce-checkout) .woocommerce :is(input.input-text, select, textarea) {
    min-height: 44px; padding: 10px 12px; border: 1px solid #c6c8d0; border-radius: var(--zt-radius-sm); background: #fff; color: var(--zt-ink);
}
body.woocommerce-account .woocommerce :is(form.login, form.register) { border-radius: var(--zt-radius-lg); background: #fff; }
/* Cart/Checkout use WooCommerce Blocks rather than the classic .woocommerce form. */
body .zartab-page .entry-content > :is(.wp-block-woocommerce-cart, .wp-block-woocommerce-checkout).alignwide { width: 100%; max-width: 100%; margin-inline: 0; }
body :is(.wp-block-woocommerce-cart .wc-block-cart__submit-button, .wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button) {
    min-height: 44px; border: 0; border-radius: var(--zt-radius-sm); background: var(--zt-red); color: #fff; font-weight: 700;
}
body :is(.wp-block-woocommerce-cart .wc-block-cart__submit-button, .wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button):hover { background: var(--zt-red-dark); color: #fff; }
body :is(.wp-block-woocommerce-cart, .wp-block-woocommerce-checkout) .wc-block-components-text-input input { border-color: #c6c8d0; border-radius: var(--zt-radius-sm); }

@media (max-width: 767px) {
    body .z-et-header { position: relative; }
    body .z-et-header-main { min-height: 66px; }
    body .z-et-header-main > .e-con-inner { height: 66px; min-height: 66px !important; padding-block: 7px !important; }
    body .z-et-header-nav-row { display: none !important; }
    body .z-et-header-search { margin: 4px auto 8px !important; }
    body .z-et-home-hero > .e-con-inner { flex-direction: column !important; }
    body .z-et-home-hero-copy { padding: 18px; }
    body .z-et-home-hero-copy h1.elementor-heading-title { font-size: 26px; }
    body .z-et-home-hero-copy h4.elementor-heading-title { font-size: 14px; }
    body .z-et-home-hero-copy p { font-size: 12px; }
    body .z-et-home-hero-image img { height: 120px; }
    body.home .z-et-section { padding-block: 12px; }
    body .zartab-archive-toolbar > .e-con-inner { gap: 8px; }
    body .zartab-archive-sorting .jet-sorting-select { width: 100%; }
    body.single-product { padding-bottom: calc(96px + env(safe-area-inset-bottom)); }
    body.single-product .zartab-mobile-nav { display: none !important; }
    body.single-product .zartab-mobile-buybar { bottom: 0; min-height: calc(80px + env(safe-area-inset-bottom)); }
    body.single-product .zartab-faq-chatbot { bottom: calc(92px + env(safe-area-inset-bottom)); }
    body.single-product .zartab-faq-chatbot__panel { max-height: calc(100dvh - 170px - env(safe-area-inset-bottom)); }
    body:not(.single-product) .zartab-faq-chatbot { bottom: calc(80px + env(safe-area-inset-bottom)); }
}

/* Responsive review 2026-10-26: shared, readable action and secondary colors. */
body,
body[class*="elementor-kit-"] {
    --zt-red: #c72e45;
    --zt-red-dark: #ac2036;
    --zt-muted: #62666d;
    --e-global-color-primary: #c72e45;
}
body :is(.z-et-topbar, .zartab-topbar) {
    background: linear-gradient(90deg, #ac2036, #c72e45);
}
body :is(.z-loop-card__rating, .z-loop-card__demo) { color: #795500; }
body .z-et-footer-column .elementor-heading-title { color: var(--zt-ink) !important; }
body :where(a, button, input, select, textarea, summary, [role="button"]):focus-visible {
    outline-color: #0c7887;
}

/* Enlarge the hit area without changing WooCommerce/Elementor behavior. */
body :is(.elementor-button, .z-loop-card__cart .button) {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 44px !important;
}
body .zartab-search input { min-width: 0; }
body :where(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]), select, textarea) {
    min-height: 44px;
}
body .zartab-search button { flex: 0 0 44px; width: 44px; min-height: 44px; padding-inline: 0; }
body .wc-block-components-panel__button { min-height: 44px; align-items: center; }
body .wc-block-components-address-form__address_2-toggle {
    display: inline-flex; align-items: center; min-height: 44px;
}
body .wc-block-components-address-card__edit {
    display: inline-flex; align-items: center; min-height: 44px;
}
body .wc-block-components-quantity-selector { min-width: 134px; }
body .wc-block-components-quantity-selector .wc-block-components-quantity-selector__button {
    flex: 0 0 44px; width: 44px; min-width: 44px; min-height: 44px;
}
body .wc-block-cart-item__remove-link { min-width: 44px; min-height: 44px; }
body .wc-block-components-checkbox label { min-height: 44px; align-items: center; }
body.single-product .woocommerce-product-gallery__trigger {
    width: 44px !important; height: 44px !important; line-height: 44px !important;
}
body .woocommerce .password-input button.show-password-input {
    display: grid; place-items: center; width: 44px; height: 44px; padding: 0;
    top: 50%; inset-inline-end: 2px; inset-inline-start: auto; transform: translateY(-50%);
}
body .woocommerce .password-input input { padding-inline-end: 54px; }
body .z-jsf-close-button { min-width: 44px; }
body .z-jsf-panel :is(.jet-checkboxes-list__button, .jet-range__inputs__group input) {
    min-height: 44px;
}
body :is(.zartab-campaign-card__code button, .zartab-loyalty-reward button) {
    min-height: 44px;
}
body .zartab-loyalty-reward button { background: var(--zt-red); }

@media (max-width: 767px) {
    body .wc-block-cart table.wc-block-cart-items .wc-block-cart-items__row {
        grid-template-columns: 64px minmax(0, 1fr);
        width: 100%;
    }
    body .wc-block-cart table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__product {
        grid-column: 2; grid-row: 1; min-width: 0;
    }
    body .wc-block-cart table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__total {
        grid-column: 2; grid-row: 2; justify-content: flex-start; margin-top: 8px;
    }
    body .z-et-footer-column .elementor-heading-title { min-height: 44px; }
    body .z-et-footer-column:not(.is-open) > .elementor-element:not(.elementor-widget-heading),
    body .z-et-footer-column:not(.is-open) > .e-con-inner > .elementor-element:not(.elementor-widget-heading) {
        display: none !important;
    }
    body.single-product .zartab-product-insights__item strong { font-size: 12px; }
    body.single-product .zartab-product-insights__item small { font-size: 11px; color: var(--zt-muted); }
    body.single-product .zartab-product-loyalty strong { font-size: 13px; }
    body.single-product .zartab-product-loyalty :is(p, a) { font-size: 12px; color: var(--zt-muted); }
}
