/* ============================================================
   VIT-FIX-W1 — 1. heti QA javítások (CSS)
   Dátum: 2026-05-02
   Mit javítunk:
     · VIT-FIX-01  Termékkártya keret-konzisztencia
     · VIT-FIX-03  Mobil "Fogyasztóbarát" plecsni reposition
     · VIT-FIX-04  Bottom nav aktív állapot + label méret
     · VIT-FIX-16  PDP stock badge brand-szín
     · VIT-FIX-19  Kosár error warm-tone
     · VIT-FIX-22  Checkout termék-név tördelés
     · VIT-FIX-23  Payment-box width-collapse fix
   ============================================================ */

/* ─────────────────────────────────────────────────────────
   VIT-FIX-16 — PDP stock badge brand-szín
   ───────────────────────────────────────────────────────── */
.vitano-stock,
.vitano-pdp .stock {
    display: inline-block;
    padding: 4px 12px;
    margin: 0 0 var(--sp-2) 0 !important;
    background: var(--vitano-sage);
    color: var(--vitano-white);
    font-family: var(--font-body);
    font-size: var(--fs-tiny);
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    border-radius: var(--radius-pill);
    line-height: 1.4;
}
.vitano-stock--in   { background: var(--vitano-sage); color: var(--vitano-white); }
.vitano-stock--low  { background: var(--vitano-coral); color: var(--vitano-white); }
.vitano-stock--out  { background: var(--vitano-charcoal-3); color: var(--vitano-white); }

/* ─────────────────────────────────────────────────────────
   VIT-FIX-19 — Kosár oldal: error warm-tone
   ───────────────────────────────────────────────────────── */
.woocommerce-cart .woocommerce-error,
.woocommerce-cart .woocommerce-message,
.woocommerce-cart .woocommerce-notices-wrapper > * {
    background: rgba(184, 73, 58, 0.08) !important;
    border: 1px solid var(--status-error) !important;
    border-left: 4px solid var(--status-error) !important;
    border-radius: var(--radius) !important;
    color: var(--vitano-charcoal) !important;
    padding: var(--sp-3) var(--sp-4) !important;
    font-family: var(--font-body) !important;
    font-size: var(--fs-body-sm) !important;
    list-style: none !important;
    margin: 0 0 var(--sp-4) 0 !important;
    box-shadow: none !important;
}
.woocommerce-cart .woocommerce-error::before,
.woocommerce-cart .woocommerce-message::before {
    color: var(--status-error) !important;
}
/* WC default piros felső border eltávolítása */
.woocommerce-cart table.shop_table {
    border-color: var(--vitano-line) !important;
}

/* ─────────────────────────────────────────────────────────
   VIT-FIX-22 — Checkout termék-név tördelés
   ───────────────────────────────────────────────────────── */
.woocommerce-checkout .woocommerce-checkout-review-order-table,
.woocommerce-checkout #order_review_table,
.woocommerce-checkout table.shop_table {
    table-layout: auto !important;
}
.woocommerce-checkout #order_review_table .product-name,
.woocommerce-checkout table.shop_table .product-name {
    min-width: 180px !important;
    max-width: 100%;
    word-break: normal !important;
    overflow-wrap: break-word !important;
    hyphens: auto;
    font-family: var(--font-body) !important;
    font-size: var(--fs-body-sm) !important;
    line-height: var(--lh-snug) !important;
    color: var(--vitano-charcoal) !important;
}
.woocommerce-checkout #order_review_table .product-quantity {
    color: var(--vitano-charcoal-3);
    margin-left: 4px;
}
.woocommerce-checkout #order_review_table .product-total {
    white-space: nowrap;
    font-family: var(--font-display);
    font-weight: 600;
    color: var(--vitano-terracotta);
}

/* Editorial cím + eyebrow a rendelés tartalma blokknak */
.woocommerce-checkout #order_review_heading {
    position: relative;
}
.woocommerce-checkout #order_review_heading::before {
    content: 'ÖSSZEGZÉS';
    display: block;
    color: var(--vitano-terracotta);
    font-family: var(--font-body);
    font-size: var(--fs-tiny);
    font-weight: 600;
    letter-spacing: var(--tracking-eyebrow);
    text-transform: uppercase;
    margin-bottom: var(--sp-2);
}
.woocommerce-checkout #order_review_heading {
    font-family: var(--font-display) !important;
    font-size: var(--fs-h3) !important;
    font-weight: 600 !important;
    color: var(--vitano-charcoal) !important;
}

/* ─────────────────────────────────────────────────────────
   VIT-FIX-23 — Payment-box width collapse fix
   ───────────────────────────────────────────────────────── */
.woocommerce-checkout #payment ul.payment_methods,
.woocommerce-checkout-payment ul.payment_methods {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: var(--sp-3);
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
    list-style: none !important;
}
.woocommerce-checkout #payment ul.payment_methods li,
.woocommerce-checkout-payment ul.payment_methods li {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    display: block !important;
    padding: var(--sp-4) !important;
    background: var(--vitano-white) !important;
    border: 1.5px solid var(--vitano-line) !important;
    border-radius: var(--radius) !important;
    margin: 0 !important;
    list-style: none !important;
}
.woocommerce-checkout #payment ul.payment_methods li:has(input:checked),
.woocommerce-checkout-payment ul.payment_methods li:has(input:checked) {
    border-color: var(--vitano-terracotta) !important;
    background: rgba(196, 98, 45, 0.04) !important;
}
.woocommerce-checkout #payment ul.payment_methods li label,
.woocommerce-checkout-payment ul.payment_methods li label {
    display: flex !important;
    align-items: center !important;
    gap: var(--sp-3) !important;
    width: 100% !important;
    margin: 0 !important;
    cursor: pointer;
    font-family: var(--font-body) !important;
    font-size: var(--fs-body) !important;
    color: var(--vitano-charcoal) !important;
}
.woocommerce-checkout #payment ul.payment_methods li label img {
    max-height: 24px;
    width: auto;
    margin-left: auto;
}
/* Payment box description (a "Utald át..." szöveg) — szélesség és NORMÁL tördelés */
.woocommerce-checkout #payment .payment_box {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    padding: var(--sp-4) !important;
    margin: var(--sp-3) 0 0 0 !important;
    background: var(--vitano-cream) !important;
    border: 1px solid var(--vitano-line-2) !important;
    border-radius: var(--radius) !important;
    color: var(--vitano-charcoal-2) !important;
    font-family: var(--font-body) !important;
    font-size: var(--fs-body-sm) !important;
    line-height: var(--lh-body) !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    white-space: normal !important;
    hyphens: none !important;
}
.woocommerce-checkout #payment .payment_box::before {
    display: none !important;
}
.woocommerce-checkout #payment .payment_box p {
    margin: 0 !important;
    font-size: var(--fs-body-sm) !important;
    line-height: var(--lh-body) !important;
}

/* "Megrendelés véglegesítése" gomb átnevezése (CSS-en keresztül NEM lehet — csak attr-szövegen) */
/* A változtatás a JS-ben kerül megoldásra (lásd qa-fixes-w1.js). */

/* ─────────────────────────────────────────────────────────
   VIT-FIX-03 — Mobil Fogyasztóbarát plecsni reposition
   A widget egy fixen pozicionált <div id="fbarat"> vagy hasonló
   ───────────────────────────────────────────────────────── */
@media (max-width: 768px) {
    #fbarat,
    [id^="fbarat-"],
    .fbarat-widget,
    .fogyasztobarat-widget,
    div[data-fbarat] {
        bottom: calc(64px + var(--sp-3) + env(safe-area-inset-bottom, 0)) !important;
        z-index: 998 !important;
    }
}
@media (max-width: 480px) {
    /* Kis mobil: a plecsni jobb-alsóra (kosár ikontól balra), kisebb */
    #fbarat,
    [id^="fbarat-"] {
        right: 8px !important;
        left: auto !important;
        transform: scale(0.85);
        transform-origin: right bottom;
    }
}

/* ─────────────────────────────────────────────────────────
   VIT-FIX-04 — Bottom nav aktív állapot + felső csík
   ───────────────────────────────────────────────────────── */
@media (max-width: 768px) {
    /* Aktív tab — ikon stroke-width 2.5 */
    .vitano-bottomnav-tab.is-active .vitano-bottomnav-icon {
        stroke-width: 2.5 !important;
    }
    /* Aktív tab felett 3px csík */
    .vitano-bottomnav-tab {
        position: relative;
    }
    .vitano-bottomnav-tab.is-active::before {
        content: '';
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 32px;
        height: 3px;
        background: var(--vitano-terracotta);
        border-radius: 0 0 var(--radius-sm) var(--radius-sm);
    }
    /* Label tipográfia frissítés */
    .vitano-bottomnav-label {
        font-family: var(--font-body);
        font-weight: 500;
        font-size: 11px;
        line-height: 1.2;
    }
}

/* ─────────────────────────────────────────────────────────
   VIT-FIX-01 — Termékkártya keret-konzisztencia
   ───────────────────────────────────────────────────────── */
.woocommerce ul.products li.product.vitano-card .vitano-card-img-wrap,
.vitano-card-img-wrap {
    background: radial-gradient(circle at 50% 60%, var(--vitano-cream) 0%, var(--vitano-cream-2) 70%) !important;
    padding: var(--sp-5) !important;
    aspect-ratio: 1 / 1 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid var(--vitano-line);
    overflow: hidden;
}
.woocommerce ul.products li.product.vitano-card .vitano-card-img,
.vitano-card-img-wrap img,
.vitano-card-img {
    width: auto !important;
    height: auto !important;
    max-width: 80% !important;
    max-height: 80% !important;
    object-fit: contain !important;
    object-position: center !important;
    margin: 0 auto !important;
}
/* Cím: 2 sor min-height (Fraunces 18px × 1.3 line-height × 2 ≈ 47px) */
.woocommerce ul.products li.product.vitano-card .vitano-card-title {
    min-height: calc(2 * 1.3em);
}
/* Grid: minden kártya azonos magasságú */
.woocommerce ul.products,
ul.products,
.vh-faves-rail .products {
    grid-auto-rows: 1fr !important;
    align-items: stretch !important;
}
.woocommerce ul.products li.product.vitano-card,
ul.products li.product.vitano-card {
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
}
.woocommerce ul.products li.product.vitano-card .vitano-card-link {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
}
.woocommerce ul.products li.product.vitano-card .vitano-card-body {
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
}
.woocommerce ul.products li.product.vitano-card .vitano-card-price {
    margin-top: auto !important;
}
/* Add-to-cart gomb: mindig látható (NEM hover-only) — felülírja a product-card.css desktop hover-szabályát */
@media (min-width: 1024px) and (hover: hover) {
    .vitano-card-add {
        opacity: 1 !important;
        transform: none !important;
    }
}

/* ─────────────────────────────────────────────────────────
   VIT-FIX-21 — Kosár "Tovább a pénztárhoz" gomb solid
   ───────────────────────────────────────────────────────── */
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
.woocommerce-cart .checkout-button {
    background: var(--vitano-coral) !important;
    color: var(--vitano-white) !important;
    border: none !important;
    border-radius: var(--radius-pill) !important;
    font-family: var(--font-body) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    padding: 16px var(--sp-6) !important;
    min-height: 56px !important;
    width: 100% !important;
    display: block !important;
    text-align: center !important;
    text-decoration: none !important;
    transition: background var(--dur-fast) var(--ease-soft), transform var(--dur-fast) var(--ease-soft);
}
.woocommerce-cart .checkout-button:hover {
    background: var(--vitano-coral-dk) !important;
    transform: translateY(-1px);
}