/*
Theme Name: Ecomall Child
Theme URI: https://demo.theme-sky.com/ecomall/
Author: Theme Sky Team
Author URI: http://theme-sky.com/
Description: A Premium and Responsive WordPress theme, designed for E-Commerce websites
Template: ecomall
Version: 1.0.0
License: GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Tags: two-columns, left-sidebar, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-images, microformats, post-formats, rtl-language-support, sticky-post, threaded-comments, translation-ready
Text Domain: ecomall-child
*/

/* ── Category nav — vibrant gradient cards ───────────────────────────────── */

/* Section strip */
.header-cat-nav.header-bottom {
    background: #f4f6f9 !important;
    border-top: none !important;
    border-bottom: none !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
}

.header-cat-nav.header-bottom > .container {
    display: block !important;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
    gap: 0 !important;
}

/* Grid: 6-per-row → wraps to 2 rows for 13 items */
.header-cat-nav .cat-nav-boxes {
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;
    gap: 8px !important;
    width: 100%;
    list-style: none;
    margin: 0;
    padding: 0;
}

/* ── Per-category color variables ── */
.header-cat-nav .cat-nav-box[data-cat="geschirrspuler"]     { --c1:#3B82F6; --c2:#2563EB; --glow:rgba(59,130,246,0.35); }
.header-cat-nav .cat-nav-box[data-cat="heisluftfritteusen"] { --c1:#FB923C; --c2:#DC2626; --glow:rgba(249,115,22,0.35); }
.header-cat-nav .cat-nav-box[data-cat="heizgerate"]         { --c1:#F87171; --c2:#B91C1C; --glow:rgba(239,68,68,0.35); }
.header-cat-nav .cat-nav-box[data-cat="kaffeemaschinen"]    { --c1:#B45309; --c2:#78350F; --glow:rgba(146,64,14,0.35); }
.header-cat-nav .cat-nav-box[data-cat="kuchenmaschinen"]    { --c1:#A855F7; --c2:#6D28D9; --glow:rgba(124,58,237,0.35); }
.header-cat-nav .cat-nav-box[data-cat="kuhlschranke"]       { --c1:#38BDF8; --c2:#0284C7; --glow:rgba(14,165,233,0.35); }
.header-cat-nav .cat-nav-box[data-cat="luftentfeuchter"]    { --c1:#22D3EE; --c2:#0E7490; --glow:rgba(8,145,178,0.35); }
.header-cat-nav .cat-nav-box[data-cat="luftreiniger"]       { --c1:#34D399; --c2:#059669; --glow:rgba(16,185,129,0.35); }
.header-cat-nav .cat-nav-box[data-cat="mikrowellen"]        { --c1:#FCD34D; --c2:#D97706; --glow:rgba(217,119,6,0.35); }
.header-cat-nav .cat-nav-box[data-cat="standmixer"]         { --c1:#F472B6; --c2:#DB2777; --glow:rgba(236,72,153,0.35); }
.header-cat-nav .cat-nav-box[data-cat="staubsauger"]        { --c1:#94A3B8; --c2:#475569; --glow:rgba(71,85,105,0.35); }
.header-cat-nav .cat-nav-box[data-cat="wasserkocher"]       { --c1:#4ADE80; --c2:#15803D; --glow:rgba(22,163,74,0.35); }
.header-cat-nav .cat-nav-box[data-cat="haartrockner"]       { --c1:#F9A8D4; --c2:#BE185D; --glow:rgba(219,39,119,0.35); }
.header-cat-nav .cat-nav-box[data-cat="kitchenaid"]         { --c1:#F97316; --c2:#9A3412; --glow:rgba(249,115,22,0.35); }

/* ── Base card ── */
.header-cat-nav .cat-nav-box {
    --c1: #94A3B8;
    --c2: #475569;
    --glow: rgba(71,85,105,0.35);
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 14px 6px 12px !important;
    border-radius: 14px !important;
    border: none !important;
    background: linear-gradient(145deg, var(--c1) 0%, var(--c2) 100%) !important;
    text-decoration: none !important;
    color: #ffffff !important;
    box-shadow: 0 2px 8px var(--glow) !important;
    overflow: hidden !important;
    transition: transform 0.2s cubic-bezier(.34,1.56,.64,1), box-shadow 0.2s ease !important;
    cursor: pointer;
    min-width: 0;
    box-sizing: border-box;
}

/* Glossy top-shine pseudo-element */
.header-cat-nav .cat-nav-box::before {
    content: '' !important;
    position: absolute !important;
    inset: 0 0 50% 0 !important;
    background: linear-gradient(180deg, rgba(255,255,255,0.22) 0%, rgba(255,255,255,0) 100%) !important;
    border-radius: 14px 14px 0 0 !important;
    pointer-events: none !important;
}

.header-cat-nav .cat-nav-box:hover {
    transform: translateY(-4px) scale(1.04) !important;
    box-shadow: 0 8px 22px var(--glow) !important;
    color: #ffffff !important;
}

/* ── Icon bubble ── */
.header-cat-nav .cat-nav-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 46px !important;
    height: 46px !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,0.22) !important;
    backdrop-filter: blur(4px) !important;
    flex-shrink: 0 !important;
    transition: background 0.2s, transform 0.2s !important;
    box-shadow: 0 1px 4px rgba(0,0,0,0.12) inset !important;
}

.header-cat-nav .cat-nav-box:hover .cat-nav-icon {
    background: rgba(255,255,255,0.32) !important;
    transform: scale(1.1) !important;
}

/* ── SVG ── */
.header-cat-nav .cat-nav-icon svg {
    width: 24px !important;
    height: 24px !important;
    color: #ffffff !important;
    display: block !important;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,0.2)) !important;
    overflow: visible;
}

.header-cat-nav .cat-nav-box:hover .cat-nav-icon svg {
    color: #ffffff !important;
}

/* ── Label ── */
.header-cat-nav .cat-nav-label {
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    text-align: center !important;
    text-transform: none !important;
    letter-spacing: 0.1px !important;
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    color: rgba(255,255,255,0.95) !important;
    text-shadow: 0 1px 3px rgba(0,0,0,0.25) !important;
    word-break: break-word;
}

/* ── Tablet: 5 columns ── */
@media (max-width: 900px) {
    .header-cat-nav .cat-nav-boxes {
        grid-template-columns: repeat(5, 1fr) !important;
        gap: 6px !important;
    }
}

/* ── Small tablet: 4 columns ── */
@media (max-width: 640px) {
    .header-cat-nav .cat-nav-boxes {
        grid-template-columns: repeat(4, 1fr) !important;
        gap: 5px !important;
    }
    .header-cat-nav.header-bottom > .container {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
}

/* ── Mobile: 3 columns ── */
@media (max-width: 420px) {
    .header-cat-nav .cat-nav-boxes {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 5px !important;
    }
    .header-cat-nav .cat-nav-box {
        padding: 10px 4px 9px !important;
        gap: 6px !important;
    }
    .header-cat-nav .cat-nav-icon {
        width: 38px !important;
        height: 38px !important;
    }
    .header-cat-nav .cat-nav-icon svg {
        width: 20px !important;
        height: 20px !important;
    }
    .header-cat-nav .cat-nav-label {
        font-size: 10px !important;
    }
}

/* ── Top navigation bar ─────────────────────────────────────────────────── */
.shop123-top-nav-bar {
    background: #ffffff !important;
    border-bottom: 1px solid #ebebeb !important;
}

.shop123-top-nav-bar > .container {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    padding-top: 5px !important;
    padding-bottom: 5px !important;
    gap: 0 !important;
}

/* Top-level list */
ul.shop123-top-nav {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 40px !important;
    font-family: 'Mulish', sans-serif !important;
    letter-spacing: 0.05em !important;
}

/* All list items */
ul.shop123-top-nav li {
    position: relative !important;
    list-style: none !important;
    display: flex !important;
    align-items: center !important;
}

/* Cancel the theme reset.css rule that zeroes first/last li padding */
ul.shop123-top-nav li:first-child,
ul.shop123-top-nav li:last-child {
    padding-top: unset !important;
    padding-bottom: unset !important;
}

/* Top-level links */
ul.shop123-top-nav > li > a {
    display: flex !important;
    align-items: center !important;
    padding: 13px 0 !important;
    color: #000000 !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    letter-spacing: 0.05em !important;
    white-space: nowrap !important;
    transition: color 0.15s !important;
    line-height: 1 !important;
}

ul.shop123-top-nav > li > a:hover,
ul.shop123-top-nav > li:hover > a {
    color: #d0112b !important;
    background: none !important;
}

/* "Shop Policies" arrow indicator */
ul.shop123-top-nav > li.menu-item-has-children > a::after {
    content: ' ▾' !important;
    font-size: 11px !important;
    opacity: 0.6 !important;
}

/* Dropdown sub-menu */
ul.shop123-top-nav .sub-menu {
    display: none !important;
    position: absolute !important;
    top: 100% !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    min-width: 220px !important;
    background: #ffffff !important;
    border: 1px solid #e4e4e4 !important;
    border-top: 3px solid #d0112b !important;
    border-radius: 0 0 8px 8px !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.10) !important;
    z-index: 9999 !important;
    list-style: none !important;
    padding: 6px 0 !important;
    margin: 0 !important;
}

ul.shop123-top-nav li:hover > .sub-menu {
    display: block !important;
}

ul.shop123-top-nav .sub-menu li a {
    display: block !important;
    padding: 10px 20px !important;
    color: #333333 !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    letter-spacing: 0.03em !important;
    transition: color 0.12s, background 0.12s !important;
}

ul.shop123-top-nav .sub-menu li a:hover {
    color: #d0112b !important;
    background: #fdf2f4 !important;
}

/* ── Text / policy pages layout fix ─────────────────────────────────────── */
/*
 * Target only the specific policy/info pages by their WordPress body class
 * (page-id-N). Using a broad body.page selector would also match the
 * Elementor-built homepage and other wide-layout pages.
 *
 * Page IDs:
 *   855  = Terms and Conditions
 *   3    = Privacy Policy
 *   13304 = Cookie Policy
 *   13305 = Shipping Policy
 *   9    = Return Policy
 *   13307 = Accepted Payment Methods
 *   7194 = Contacts
 *   479  = Order Tracking
 */
body:is(
    .page-id-855,
    .page-id-3,
    .page-id-13304,
    .page-id-13305,
    .page-id-9,
    .page-id-13307,
    .page-id-7194,
    .page-id-479
) #main > .page-container {
    box-sizing: border-box !important;
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    padding-top: 30px !important;
    padding-bottom: 120px !important;
}

/* ── Top bar support email ───────────────────────────────────────────────── */
.header-top .header-support-email {
    font-size: 12px;
    color: inherit;
    text-decoration: none;
    opacity: 0.9;
    transition: opacity 0.15s;
}
.header-top .header-support-email:hover {
    opacity: 1;
    text-decoration: underline;
}

/* ── Trending Products section — blue background ────────────────────────── */
.elementor-element-37ae7b2 {
    background-color: #0068c8 !important;
}

/* Heading / title white */
.elementor-element-37ae7b2 .shortcode-heading-wrapper h3,
.elementor-element-37ae7b2 .shortcode-heading-wrapper .title,
.elementor-element-37ae7b2 h3.title,
.elementor-element-37ae7b2 header h3 {
    color: #ffffff !important;
}

/* Product images max 80% width */
.elementor-element-37ae7b2 .product-thumbnail img {
    max-width: 80% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    display: block !important;
}

/* Swiper pagination dots — inactive */
.elementor-element-37ae7b2 .swiper-pagination-bullet {
    background: rgba(255,255,255,0.45) !important;
    opacity: 1 !important;
}

/* Swiper pagination dots — active */
.elementor-element-37ae7b2 .swiper-pagination-bullet-active {
    background: #ffffff !important;
    opacity: 1 !important;
}

/* ── Trust / feature blocks ─────────────────────────────────────────────── */
.trust-blocks-section {
    background: #f5f7fa !important;
    border-top: 1px solid #e8eaed !important;
    border-bottom: 1px solid #e8eaed !important;
}

/* Force 2×2 grid inside the boxed inner container */
.trust-blocks-section > .e-con-inner {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 24px !important;
    box-sizing: border-box !important;
}

.trust-block {
    width: 100% !important;
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #e4e8ee !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.06) !important;
    transition: box-shadow 0.2s, transform 0.2s, border-color 0.2s !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    padding: 28px !important;
    box-sizing: border-box !important;
}

.trust-block:hover {
    box-shadow: 0 6px 24px rgba(208,17,43,0.10) !important;
    border-color: #d0112b !important;
    transform: translateY(-3px) !important;
}

/* Icon sits on top */
.trust-block .elementor-icon-box-icon {
    flex-shrink: 0 !important;
    margin: 0 0 30px 0 !important;
}

.trust-block .elementor-icon-box-icon .elementor-icon {
    width: 60px !important;
    height: 60px !important;
    background: #fff0f2 !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: background 0.2s !important;
}

.trust-block:hover .elementor-icon-box-icon .elementor-icon {
    background: #d0112b !important;
}

.trust-block .elementor-icon-box-icon .elementor-icon i {
    font-size: 26px !important;
    color: #d0112b !important;
    transition: color 0.2s !important;
}

.trust-block:hover .elementor-icon-box-icon .elementor-icon i {
    color: #ffffff !important;
}

/* Text block beside the icon */
.trust-block .elementor-icon-box-content {
    flex: 1 !important;
    min-width: 0 !important;
}

/* Title */
.trust-block .elementor-icon-box-title {
    font-size: 14px !important;
    font-weight: 800 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    color: #1a1a2e !important;
    margin-bottom: 8px !important;
    text-align: left !important;
    display: block !important;
}

/* Description */
.trust-block .elementor-icon-box-description {
    font-size: 13px !important;
    line-height: 1.65 !important;
    color: #6b7280 !important;
    text-align: left !important;
    margin: 0 !important;
}

@media (max-width: 768px) {
    .trust-blocks-section > .e-con-inner {
        grid-template-columns: 1fr !important;
    }
}
/* ── Contact form ────────────────────────────────────────────────────────── */
.shop123-contact-form {
    font-family: inherit;
}

.shop123-contact-form .scf-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.shop123-contact-form .scf-field {
    display: flex;
    flex-direction: column;
    margin-bottom: 20px;
}

.shop123-contact-form label {
    font-size: 13px;
    font-weight: 600;
    color: #374151;
    margin-bottom: 7px;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.shop123-contact-form label span {
    color: #d0112b;
}

.shop123-contact-form input,
.shop123-contact-form textarea {
    border: 1.5px solid #d1d5db;
    border-radius: 8px;
    padding: 12px 14px;
    font-size: 14px;
    color: #111827;
    background: #fff;
    transition: border-color 0.2s, box-shadow 0.2s;
    outline: none;
    font-family: inherit;
    width: 100%;
    box-sizing: border-box;
}

.shop123-contact-form input:focus,
.shop123-contact-form textarea:focus {
    border-color: #0068c8;
    box-shadow: 0 0 0 3px rgba(0,104,200,0.12);
}

.shop123-contact-form textarea {
    resize: vertical;
    min-height: 130px;
}

.scf-btn {
    display: inline-block;
    background: #0068c8;
    color: #fff !important;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding: 14px 36px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.2s, transform 0.15s;
    margin-top: 4px;
}

.scf-btn:hover {
    background: #005bb5;
    transform: translateY(-1px);
}

.scf-btn:disabled {
    opacity: 0.65;
    cursor: not-allowed;
    transform: none;
}

#scf-notice {
    padding: 12px 16px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 16px;
    display: none;
}

#scf-notice.scf-success {
    display: block;
    background: #ecfdf5;
    color: #065f46;
    border: 1px solid #6ee7b7;
}

#scf-notice.scf-error {
    display: block;
    background: #fef2f2;
    color: #991b1b;
    border: 1px solid #fca5a5;
}

@media (max-width: 600px) {
    .shop123-contact-form .scf-row {
        grid-template-columns: 1fr;
        gap: 0;
    }
}

/* ── Product rating & review count – smaller grey text ── */
.single-product .woocommerce-product-rating .average-rating,
.single-product .woocommerce-product-rating .review-count {
    font-size: 12px;
    color: #9ca3af;
    font-weight: 400;
}

/* ── Corporate font: Inter ─────────────────────────────────────────────────── */
:root {
    --ts-pr-font-family: 'Inter', sans-serif;
    --ts-heading-font-family: 'Inter', sans-serif;
    --ts-btn-font-family: 'Inter', sans-serif;
    --ts-menu-font-family: 'Inter', sans-serif;
    --ts-v-menu-font-family: 'Inter', sans-serif;
}

body,
input, textarea, select, button,
.woocommerce, .woocommerce-page,
h1, h2, h3, h4, h5, h6,
p, a, span, li, td, th, label,
.product_title,
.woocommerce-product-details__short-description,
.price, .amount,
.button, .wp-element-button {
    font-family: 'Inter', sans-serif !important;
}

/* Lighter base weight for body text */
body {
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    letter-spacing: -0.01em;
}

/* Headings – semibold instead of heavy */
h1, h2, h3, h4, h5, h6,
.product_title,
.entry-title,
.woocommerce-loop-product__title {
    font-weight: 600 !important;
    letter-spacing: -0.02em;
}

/* Navigation – medium weight */
.ts-header nav > ul.menu > li > a,
.mobile-menu-wrapper nav > ul > li > a {
    font-weight: 500 !important;
    letter-spacing: -0.01em;
}

/* Buttons – medium weight */
.button, .btn, input[type="submit"],
.wp-element-button, .add_to_cart_button,
.single_add_to_cart_button {
    font-weight: 500 !important;
    letter-spacing: 0.01em;
}

/* Prices */
.price, .woocommerce-Price-amount {
    font-weight: 600 !important;
    letter-spacing: -0.01em;
}

/* ── Colorful text logo ─────────────────────────────────────────── */
.mh-text-logo a {
    font-family: 'Inter', sans-serif !important;
    font-size: 26px !important;
    font-weight: 800 !important;
    letter-spacing: -0.05em !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: flex-start !important;
    gap: 0 !important;
    line-height: 1 !important;
}
.mh-logo-inner {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 2px !important;
    line-height: 1 !important;
}
.mh-logo-letters {
    display: inline-flex !important;
    align-items: center !important;
}
.mh-logo-letters span {
    display: inline-block;
    transition: transform 0.18s cubic-bezier(.34,1.56,.64,1);
}
.mh-text-logo a:hover .mh-logo-letters span {
    transform: translateY(-3px);
}
.mh-text-logo a:hover .mh-logo-letters span:nth-child(odd) {
    transform: translateY(-3px) rotate(-4deg);
}
.mh-text-logo a:hover .mh-logo-letters span:nth-child(even) {
    transform: translateY(-3px) rotate(4deg);
}
.mh-logo-slogan {
    font-family: 'Inter', sans-serif !important;
    font-size: 10px !important;
    font-weight: 400 !important;
    letter-spacing: 0.01em !important;
    color: #9ca3af !important;
    white-space: nowrap !important;
    line-height: 1 !important;
    padding-left: 1px !important;
}

/* ── Mobile menu: 2nd-level sub-menu items left padding ─────────────────── */
@media only screen and (max-width: 767px) {
    .mobile-menu-wrapper nav ul.sub-menu li:not(.ts-normal-menu):not(.ts-megamenu) {
        padding-left: 20px !important;
    }
}