/* Savonia – product page (Savonia_ProductPage, 2026-11-02): one column, benefit cards.
   Rails and cards: savonia-rail.css. */
/* ---------- benefit cards ---------- */
.sv-benefits { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 28px 0 8px; }
.sv-benefit {
    display: flex; align-items: flex-start; gap: 12px; padding: 16px;
    background: #fff; border-top: 4px solid var(--sv-green); border-radius: var(--sv-radius); box-shadow: var(--sv-shadow);
}
.sv-benefit svg {
    flex: 0 0 44px; width: 44px; height: 44px; padding: 10px; border-radius: 50%; background: var(--sv-green-soft);
    fill: none; stroke: var(--sv-green-dark); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round;
}
.sv-benefit strong { display: block; margin: 2px 0 3px; color: var(--sv-text); font-size: 15px; font-weight: 700; line-height: 1.3; }
.sv-benefit span { display: block; color: var(--sv-muted); font-size: 13px; line-height: 1.45; }
@media (max-width: 991px) { .sv-benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 559px) {
    .sv-benefits { grid-template-columns: 1fr; gap: 10px; margin-top: 20px; }
    .sv-benefit { padding: 12px 14px; }
}

/* ---------- product page layout (one column) ---------- */
.savonia-pp .product-view .product-collateral { margin-top: 36px; }
.savonia-pp .product-tabs { border: 0; }
.savonia-pp .product-tabs > dt,
.savonia-pp .product-tabs .tab-title { font-size: 15px; }

/* PRP explanation bubble on the product itself, in the Savonia card style */
.savonia-pp .product-shop .tooltipprp { border-bottom: 1px dotted var(--sv-green-dark); outline: 0; }
.savonia-pp .product-shop .tooltipprp .tooltiptextprp {
    left: -10px; bottom: calc(100% + 12px); width: 260px; max-width: calc(100vw - 40px); margin-left: 0; padding: 12px 14px;
    background: #fff; border-top: 4px solid var(--sv-green); border-radius: var(--sv-radius); box-shadow: 0 6px 22px rgba(0, 0, 0, .14);
    color: var(--sv-text); font-size: 13px; font-weight: 400; line-height: 1.45; text-align: left; white-space: normal;
    opacity: 0; transform: translateY(4px); transition: opacity .15s, transform .15s, visibility .15s;
}
.savonia-pp .product-shop .tooltipprp .tooltiptextprp::after {
    left: 22px; margin-left: 0; border-width: 7px; border-color: #fff transparent transparent transparent;
    filter: drop-shadow(0 2px 1px rgba(0, 0, 0, .06));
}
.savonia-pp .product-shop .tooltipprp:hover .tooltiptextprp,
.savonia-pp .product-shop .tooltipprp:focus .tooltiptextprp { visibility: visible; opacity: 1; transform: none; }

/* ---------- buy box: [- 1 +] [Adaugă în coș] [heart] ---------- */
.savonia-pp .add-to-box { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 14px 0 6px; }
.savonia-pp .add-to-box > .loyalty-points { flex: 0 0 100%; margin: 0; } /* J2T points text: own row above the buy row */
.savonia-pp .add-to-box .add-to-cart.sv-buy { display: flex; flex: 1 1 0; min-width: 0; align-items: center; gap: 12px; margin: 0; float: none; }
.sv-qty { display: inline-flex; flex: 0 0 auto; align-items: center; height: 50px; border: 1.5px solid #d9d9d9; border-radius: 25px; background: #fff; }
.sv-qty__btn {
    width: 42px; height: 46px; padding: 0; border: 0; background: none; color: var(--sv-text);
    font-size: 22px; font-weight: 600; line-height: 1; cursor: pointer;
}
.sv-qty__btn:first-child { border-radius: 25px 0 0 25px; }
.sv-qty__btn:last-child { border-radius: 0 25px 25px 0; }
.sv-qty__btn:hover { color: var(--sv-green-dark); }
.sv-qty input.qty {
    width: 44px !important; height: 46px; margin: 0; padding: 0; border: 0 !important; background: transparent; box-shadow: none;
    color: var(--sv-text); font-size: 17px; font-weight: 700; text-align: center;
}
.savonia-pp .sv-buy .btn-cart.sv-buy__btn, .savonia-pp .sticky-product .btn-cart {
    display: inline-flex; flex: 1 1 auto; align-items: center; justify-content: center; min-height: 50px; margin: 0; padding: 0 28px;
    border: 0; border-radius: 25px; background: var(--sv-orange); color: #fff; box-shadow: 0 4px 12px rgba(220, 132, 48, .28);
    font-size: 17px; font-weight: 700; line-height: 1.2; text-transform: none; transition: background-color .2s, transform .1s;
}
.savonia-pp .sticky-product .btn-cart { flex: 0 0 auto; min-height: 44px; background: var(--sv-green); box-shadow: none; font-size: 15px; } /* orange: only the big button */
.savonia-pp .sv-buy .btn-cart.sv-buy__btn:hover { background: var(--sv-orange-dark); }
.savonia-pp .sticky-product .btn-cart:hover { background: var(--sv-green-dark); }
.savonia-pp .sv-buy .btn-cart.sv-buy__btn:active { transform: scale(.98); }
.savonia-pp .sv-buy .btn-cart span, .savonia-pp .sticky-product .btn-cart span { display: inline-flex; align-items: center; gap: 10px; padding: 0; background: none; color: #fff; font-size: inherit; }
.savonia-pp .sv-buy .btn-cart svg { width: 22px; height: 22px; fill: none; stroke: #fff; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.savonia-pp .sticky-product .btn-cart i { display: none; }
.savonia-pp .add-to-box .add-to-links { display: flex; margin: 0; padding: 0; list-style: none; }
.savonia-pp .add-to-box .add-to-links .link-wishlist {
    display: inline-flex; align-items: center; justify-content: center; width: 50px; height: 50px; border: 1.5px solid #cfe3a0; border-radius: 50%;
    background: #fff; color: var(--sv-green-dark); font-size: 20px; text-decoration: none;
}
.savonia-pp .add-to-box .add-to-links .link-wishlist:hover { background: var(--sv-green-soft); }
@media (max-width: 479px) {
    .savonia-pp .add-to-box, .savonia-pp .add-to-box .add-to-cart.sv-buy { gap: 8px; }
    .savonia-pp .sv-buy .btn-cart.sv-buy__btn { min-width: 0; padding: 0 10px; font-size: 15px; }
    .sv-qty__btn { width: 34px; }
    .sv-qty input.qty { width: 34px !important; }
    .savonia-pp .add-to-box .add-to-links .link-wishlist { width: 46px; height: 46px; }
}
@media (max-width: 399px) { .savonia-pp .sv-buy .btn-cart svg { display: none; } }


/* the buy row uses the full width of the product column (it shrank to its content, ~350px) */
.savonia-pp .product-shop .add-to-box { width: 100%; flex: 1 1 100%; box-sizing: border-box; }

/* ---------- product gallery (savonia/productpage/media.phtml + js/savonia-pp.js), replaces etalage ---------- */
.savonia-pp .product-img-box { height: auto !important; }
.sv-gal { position: relative; }
.sv-gal__stage { position: relative; overflow: hidden; border: 1px solid var(--sv-line); border-radius: var(--sv-radius); background: #fff; }
.sv-gal__track {
    display: flex; aspect-ratio: 1 / 1; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scroll-behavior: smooth;
    overscroll-behavior-x: contain; scrollbar-width: none;
}
.sv-gal__track::-webkit-scrollbar { display: none; }
.sv-gal__track.is-drag { scroll-snap-type: none; scroll-behavior: auto; cursor: grabbing; user-select: none; }
.sv-gal__slide {
    display: flex; flex: 0 0 100%; align-items: center; justify-content: center; margin: 0;
    scroll-snap-align: start; scroll-snap-stop: always; cursor: zoom-in;
}
.sv-gal__slide img { display: block; width: 100%; height: 100%; object-fit: contain; -webkit-user-drag: none; user-select: none; }
.sv-gal__btn {
    position: absolute; z-index: 2; display: flex; align-items: center; justify-content: center; width: 42px; min-width: 0; height: 42px;
    margin: 0; padding: 0; border: 1px solid #e5e5e5; border-radius: 50%; background: rgba(255, 255, 255, .94); color: var(--sv-green-dark);
    box-shadow: 0 2px 8px rgba(0, 0, 0, .08); cursor: pointer; transition: opacity .15s, border-color .15s, box-shadow .15s;
}
.sv-gal__btn:hover, .sv-gal__btn:focus { border-color: var(--sv-green); background: #fff; box-shadow: 0 2px 10px rgba(0, 0, 0, .14); }
.sv-gal__btn:focus-visible { outline: 2px solid var(--sv-green-dark); outline-offset: 2px; }
.sv-gal__btn:disabled { opacity: 0; pointer-events: none; }
.sv-gal__btn svg { display: block; width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.sv-gal__prev { top: 50%; left: 12px; transform: translateY(-50%); }
.sv-gal__next { top: 50%; right: 12px; transform: translateY(-50%); }
.sv-gal__zoom { top: 12px; right: 12px; }
.sv-gal__dots { display: none; align-items: center; justify-content: center; gap: 8px; margin: 12px 0 0; }
.sv-gal__dot { width: 8px; min-width: 0; height: 8px; margin: 0; padding: 0; border: 0; border-radius: 4px; background: #d6d6d6; cursor: pointer; transition: width .2s, background-color .2s; }
.sv-gal__dot[aria-current="true"] { width: 22px; background: var(--sv-green); }
.sv-gal__count { display: none; margin: 10px 0 0; color: var(--sv-muted); font-size: 14px; text-align: center; }
.sv-gal__thumbs { display: flex; gap: 10px; margin: 14px 0 0; padding: 2px; overflow-x: auto; scrollbar-width: thin; }
.sv-gal__thumb {
    flex: 0 0 84px; width: 84px; min-width: 0; height: 84px; margin: 0; padding: 4px; border: 1px solid var(--sv-line); border-radius: 10px;
    background: #fff; cursor: pointer; transition: border-color .15s, box-shadow .15s;
}
.sv-gal__thumb img { display: block; width: 100%; height: 100%; object-fit: contain; border-radius: 6px; }
.sv-gal__thumb:hover { border-color: #bdbdbd; }
.sv-gal__thumb[aria-current="true"] { border-color: var(--sv-green); box-shadow: inset 0 0 0 1px var(--sv-green); }
@media (max-width: 767px) {
    .sv-gal__prev, .sv-gal__next { display: none; }
    .sv-gal__dots { display: flex; }
    .sv-gal[data-many] .sv-gal__dots { display: none; }
    .sv-gal[data-many] .sv-gal__count { display: block; }
    .sv-gal__thumbs { display: none; }
}

/* full-screen viewer */
html.sv-lb-open, html.sv-lb-open body { overflow: hidden; }
.sv-lb { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 30000; display: flex; flex-direction: column; background: #fff; }
.sv-lb__bar { display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between; padding: 12px 16px; }
.sv-lb__count { color: var(--sv-muted); font-size: 15px; font-weight: 600; }
.sv-lb .sv-lb__close { position: static; }
.sv-lb__body { position: relative; display: flex; flex: 1 1 auto; min-height: 0; }
.sv-lb__track {
    display: flex; flex: 1 1 auto; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scroll-behavior: smooth;
    overscroll-behavior: contain; scrollbar-width: none;
}
.sv-lb__track::-webkit-scrollbar { display: none; }
.sv-lb__track.is-drag { scroll-snap-type: none; scroll-behavior: auto; cursor: grabbing; user-select: none; }
.sv-lb__track.is-zoomed { overflow: hidden; touch-action: none; }
.sv-lb__slide {
    display: flex; flex: 0 0 100%; align-items: center; justify-content: center; box-sizing: border-box; padding: 0 16px 16px; overflow: hidden;
    scroll-snap-align: start; scroll-snap-stop: always; touch-action: pan-x;
}
.sv-lb__pan { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; cursor: zoom-in; transition: transform .25s ease; }
.sv-lb__pan.is-zoomed { cursor: grab; transition: none; }
.sv-lb__pan img { display: block; max-width: 100%; max-height: 100%; object-fit: contain; -webkit-user-drag: none; user-select: none; }
.sv-lb .sv-gal__prev { left: 16px; }
.sv-lb .sv-gal__next { right: 16px; }
@media (max-width: 767px) {
    .sv-lb__slide { padding: 0 0 12px; }
    .sv-lb .sv-gal__prev { left: 8px; }
    .sv-lb .sv-gal__next { right: 8px; }
}
@media (prefers-reduced-motion: reduce) {
    .sv-gal__track, .sv-lb__track { scroll-behavior: auto; }
    .sv-lb__pan { transition: none; }
}

/* ---------- r17 (2026-11-02): buy button text centred on iPhone SE, readable description and tabs, rating line ---------- */
/* Porto (local.css 1382, responsive.css 1126) gives ".add-to-cart button.button span" min-width 155px, height 38px and padding-right 5px:
   on a 375px screen the span is wider than the button and its text starts at the left edge. */
.savonia-pp .sv-buy .btn-cart span, .savonia-pp .sticky-product .btn-cart span {
    flex: 0 1 auto; justify-content: center; min-width: 0; max-width: 100%; height: auto; padding: 0; line-height: inherit; text-align: center;
}

/* description (short description under the name) and tab content: Porto has Open Sans 300, #777 (4.48:1), 13-14px */
.savonia-pp .product-shop .short-description .std,
.savonia-pp .product-tabs .tab-content { color: var(--sv-text); font-size: 15px; font-weight: 400; line-height: 1.6; }
.savonia-pp .product-shop .short-description .std p,
.savonia-pp .product-shop .short-description .std li,
.savonia-pp .product-tabs .tab-content p,
.savonia-pp .product-tabs .tab-content li { color: var(--sv-text); font-size: inherit; font-weight: 400; line-height: 1.6; }
.savonia-pp .product-shop .short-description .std p,
.savonia-pp .product-tabs .tab-content p { margin: 0 0 12px; }
/* bold only for the labels ("Proprietăți:", "Continut:"); a <strong> inside a <strong> (the ingredient list) is normal text */
.savonia-pp .product-shop .short-description .std strong, .savonia-pp .product-shop .short-description .std b,
.savonia-pp .product-tabs .tab-content strong, .savonia-pp .product-tabs .tab-content b { color: var(--sv-text); font-weight: 600; }
.savonia-pp .product-shop .short-description .std strong strong,
.savonia-pp .product-tabs .tab-content strong strong { font-weight: 400; }
/* the "Livrarea produselor" static block carries inline color #777 / 13px / line-height 1.4 */
.savonia-pp .product-tabs .tab-content [style] { color: var(--sv-text) !important; font-size: inherit !important; line-height: 1.6 !important; }

/* tab titles: one size, readable green (Porto #a9cf45 is 1.9:1 on white), active = dark text with green underline */
.savonia-pp .product-tabs > ul li a { color: #5f7d1c; font-size: 15px; font-weight: 600; }
.savonia-pp .product-tabs > ul li.active a { color: var(--sv-text); }
/* "Caracteristici generale" table */
.savonia-pp .product-tabs #product-attribute-specs-table th,
.savonia-pp .product-tabs #product-attribute-specs-table td { color: var(--sv-text); font-size: 15px; line-height: 1.5; }
.savonia-pp .product-tabs #product-attribute-specs-table th { font-weight: 600; }
/* reviews: title = level below the tab title, author/date secondary */
.savonia-pp #product-customer-reviews li { color: var(--sv-text); font-size: 15px; line-height: 1.6; }
.savonia-pp #product-customer-reviews .review-title { color: var(--sv-text); font-size: 16px; font-weight: 600; line-height: 1.4; }
.savonia-pp #product-customer-reviews .review-by,
.savonia-pp #product-customer-reviews .rating-item .label { color: #555; font-size: 14px; }
.savonia-pp #product-customer-reviews .review-area p { color: var(--sv-text); font-size: inherit; line-height: 1.6; }
@media (max-width: 767px) {
    .savonia-pp .product-shop .short-description .std,
    .savonia-pp .product-tabs .tab-content,
    .savonia-pp #product-customer-reviews li { font-size: 16px; }
}

/* rating line under the name: orange stars (= cart button), "★★★★★ (6 recenzii)", no "| Spune-ti parerea" (the form stays in the Recenzii tab) */
.savonia-pp .product-shop .ratings .rating-box .rating:before,
.savonia-pp #product-customer-reviews .rating-box .rating:before { color: var(--sv-orange); }
.savonia-pp .product-shop .ratings .rating-links .separator,
.savonia-pp .product-shop .ratings .rating-links a[href*="#review-form"] { display: none; }
.savonia-pp .product-shop .ratings .rating-links a:first-child { color: var(--sv-muted); text-transform: lowercase; }
.savonia-pp .product-shop .ratings .rating-links a:first-child:before { content: "("; }
.savonia-pp .product-shop .ratings .rating-links a:first-child:after { content: ")"; }

/* no lines around the price: above it (end of the description) and under "Disponibilitate" */
.savonia-pp .product-shop .short-description,
.savonia-pp .product-shop .product-info { border-bottom: 0; }
.savonia-pp .product-shop .short-description .std > p:last-child { margin-bottom: 0; }

/* PRP (grey) on its own line above the big price */
.savonia-pp .product-shop .price-box .old-price { display: block; margin: 0 0 2px; }
.savonia-pp .product-shop .price-box .special-price { display: block; margin: 0; }
/* desktop: the same line is the border of the .clearer after .product-info (Porto local.css 1480, .col1-layout ...) */
.savonia-pp .product-view .product-shop .product-info + div.clearer { border: 0; }

/* availability: "(pulsing dot) Disponibilitate [box icon: în stoc]". The "Disponibilitate:" text node is hidden (font-size: 0),
   the label comes from ::after, so it also survives a Lesti FPC refresh. Badges in the rails (.sv-stock) stay as they are. */
.savonia-pp .product-shop .availability {
    display: inline-flex; align-items: center; gap: 10px; margin: 8px 0; padding: 0; border-radius: 0; background: none;
    color: var(--sv-text); font-size: 0; font-weight: 400; line-height: 1.4;
}
.savonia-pp .product-shop .availability:before {
    content: ""; order: 0; flex: 0 0 10px; width: 10px; height: 10px; border-radius: 50%; background: #5ba51f;
    animation: sv-stock-pulse 1.7s ease infinite;
}
.savonia-pp .product-shop .availability:after { content: "Disponibilitate"; order: 1; font-size: 15px; }
.savonia-pp .product-shop .availability span {
    display: inline-flex; order: 2; align-items: center; gap: 6px; margin: 0; padding: 4px 12px 4px 10px;
    border: 1px solid #d5e8a6; border-radius: 8px; background: var(--sv-green-soft);
    color: #5f7d1c; font-size: 14px; font-weight: 600; line-height: 1.4; text-transform: lowercase;
}
.savonia-pp .product-shop .availability.in-stock span:before,
.savonia-pp .product-shop .availability span:before {
    content: ""; display: inline-block; width: 16px; height: 16px; margin: 0; border-radius: 0; box-shadow: none; background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 8l-9-5-9 5v8l9 5 9-5z'/%3E%3Cpath d='M3 8l9 5 9-5M12 13v8M7.5 5.5l9 5'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 8l-9-5-9 5v8l9 5 9-5z'/%3E%3Cpath d='M3 8l9 5 9-5M12 13v8M7.5 5.5l9 5'/%3E%3C/svg%3E") center / contain no-repeat;
}
.savonia-pp .product-shop .availability.out-of-stock { background: none; }
.savonia-pp .product-shop .availability.out-of-stock:before { background: #bbb; animation: none; }
.savonia-pp .product-shop .availability.out-of-stock span { border-color: #e2e2e2; background: #f4f4f4; color: var(--sv-muted); }
@keyframes sv-stock-pulse {
    0% { transform: scale(.95); box-shadow: 0 0 0 0 rgba(91, 165, 31, .7); }
    40% { transform: scale(1); box-shadow: 0 0 0 8px rgba(91, 165, 31, 0); }
    100% { transform: scale(.95); box-shadow: 0 0 0 0 rgba(91, 165, 31, 0); }
}
@media (prefers-reduced-motion: reduce) { .savonia-pp .product-shop .availability:before { animation: none; box-shadow: 0 0 0 3px rgba(91, 165, 31, .18); } }

/* gallery: campaign / "new" label at the top left of the image (savonia/productpage/media.phtml, same rule as the cards) */
.sv-gal__label {
    position: absolute; top: 20px; left: 12px; z-index: 2; padding: 5px 11px; /* centred on the 42px zoom button line (top 12px) */ border-radius: 12px; pointer-events: none;
    background: #000; color: #fff; font-size: 12px; font-weight: 700; line-height: 1.3; letter-spacing: .02em; text-transform: uppercase;
}

/* ---------- r18 (2026-11-02): open sections instead of the tabs (savonia/productpage/sections.phtml, reviews.phtml, review-form.phtml) ---------- */
.sv-sr-only { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.sv-secs { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; color: var(--sv-text); }
/* jump links: they replace the tab titles, everything below is open */
.sv-secs__nav { display: flex; gap: 8px; margin: 0 -10px; padding: 2px 10px 6px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.sv-secs__nav::-webkit-scrollbar { display: none; }
.sv-secs__nav a {
    display: inline-flex; flex: 0 0 auto; align-items: center; gap: 6px; min-height: 40px; padding: 0 16px;
    border: 1px solid var(--sv-line); border-radius: 999px; background: #fff;
    color: var(--sv-text); font-size: 14px; font-weight: 600; line-height: 1; text-decoration: none; white-space: nowrap;
}
.sv-secs__nav a:hover, .sv-secs__nav a:focus-visible { border-color: var(--sv-green); background: var(--sv-green-soft); color: var(--sv-text); text-decoration: none; }
.sv-secs__count { min-width: 22px; padding: 3px 6px; border-radius: 999px; background: var(--sv-orange); color: #fff; font-size: 12px; text-align: center; }
/* one card per section (the site card: white, green top border, soft shadow) */
.sv-sec {
    min-width: 0; padding: 20px 18px; scroll-margin-top: 16px;
    background: #fff; border-top: 4px solid var(--sv-green); border-radius: var(--sv-radius); box-shadow: var(--sv-shadow);
}
.savonia-pp .sv-sec .sv-sec__title {
    display: flex; align-items: center; gap: 10px; margin: 0 0 14px; padding: 0; border: 0;
    color: var(--sv-text); font-size: 20px; font-weight: 700; line-height: 1.3; text-transform: none; letter-spacing: 0;
}
.sv-sec__title svg {
    flex: 0 0 36px; width: 36px; height: 36px; padding: 8px; border-radius: 50%; background: var(--sv-green-soft);
    fill: none; stroke: var(--sv-green-dark); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
}
.sv-sec__body { color: var(--sv-text); font-size: 15px; font-weight: 400; line-height: 1.6; overflow-wrap: break-word; }
.sv-sec__body p, .sv-sec__body li { color: var(--sv-text); font-size: inherit; font-weight: 400; line-height: 1.6; }
.sv-sec__body p { margin: 0 0 12px; }
.sv-sec__body strong, .sv-sec__body b { color: var(--sv-text); font-weight: 600; }
.sv-sec__body strong strong { font-weight: 400; }
.sv-sec__body [style] { color: var(--sv-text) !important; font-size: inherit !important; line-height: 1.6 !important; }
.sv-sec__body img { max-width: 100%; height: auto; }
/* description.phtml starts with its own "Detalii" heading: the section title says it */
.sv-sec--desc .sv-sec__body > h2:first-child { display: none; }
/* long description: clamped by savonia-pp.js, the button opens it */
.sv-sec--desc.is-clamped .sv-sec__body { position: relative; max-height: 440px; overflow: hidden; }
.sv-sec--desc.is-clamped .sv-sec__body:after {
    content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 110px; background: linear-gradient(rgba(255, 255, 255, 0), #fff 85%); pointer-events: none;
}
.sv-sec__more {
    display: inline-flex; align-items: center; gap: 6px; min-height: 44px; margin-top: 4px; padding: 0 2px;
    border: 0; background: none; color: #5f7d1c; font-size: 15px; font-weight: 700; cursor: pointer;
}
.sv-sec__more svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s; }
.sv-sec--desc.is-open .sv-sec__more svg { transform: rotate(180deg); }
.sv-sec__more:hover { color: var(--sv-text); }

/* "Caracteristici generale": label / value rows instead of the table */
.sv-specs { margin: 0; }
.sv-specs__row { display: grid; grid-template-columns: minmax(96px, 42%) minmax(0, 1fr); gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--sv-line); }
.sv-specs__row:first-child { padding-top: 2px; }
.sv-specs__row:last-child { border-bottom: 0; padding-bottom: 0; }
.sv-specs dt { margin: 0; color: var(--sv-muted); font-size: 14px; font-weight: 400; line-height: 1.45; }
.sv-specs dd { margin: 0; color: var(--sv-text); font-size: 15px; font-weight: 600; line-height: 1.45; overflow-wrap: anywhere; }

/* "Livrarea produselor" (CMS block saconia_livrare_custom_tab, classes sv-ship*) */
.sv-ship__note { margin: 0 0 14px !important; color: var(--sv-muted) !important; font-size: 14px !important; }
.sv-ship__list { margin: 0 !important; padding: 0 !important; list-style: none; }
.sv-ship__item { position: relative; margin: 0 0 12px; padding: 0 0 12px 54px !important; min-height: 40px; border-bottom: 1px solid var(--sv-line); list-style: none; }
.sv-ship__item:last-child { margin-bottom: 0; padding-bottom: 0 !important; border-bottom: 0; }
.sv-ship__item:before {
    content: ""; position: absolute; left: 0; top: 0; width: 40px; height: 40px; border-radius: 50%;
    background: var(--sv-green-soft) var(--sv-ship-icon) center / 22px no-repeat;
}
.sv-ship__item strong { display: block; margin: 1px 0 2px; font-size: 15px; font-weight: 700 !important; line-height: 1.35; }
.sv-ship__item span { display: block; color: var(--sv-muted); font-size: 14px; line-height: 1.5; }
.sv-ship__item--free { --sv-ship-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237fa12a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 10h16v10H4zM3 7h18v3H3zM12 7v13M12 7c-1.5-3.5-5.5-3.5-5.5-1S10 7 12 7zm0 0c1.5-3.5 5.5-3.5 5.5-1S14 7 12 7z'/%3E%3C/svg%3E"); }
.sv-ship__item--courier { --sv-ship-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237fa12a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h11v10H3zM14 9h4l3 3.5V16h-7'/%3E%3Ccircle cx='7' cy='17.5' r='1.8'/%3E%3Ccircle cx='17' cy='17.5' r='1.8'/%3E%3C/svg%3E"); }
.sv-ship__item--pickup { --sv-ship-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237fa12a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-6.5-6.1-6.5-11a6.5 6.5 0 0 1 13 0c0 4.9-6.5 11-6.5 11z'/%3E%3Ccircle cx='12' cy='10' r='2.4'/%3E%3C/svg%3E"); }

/* ---------- Recenzii ---------- */
.sv-stars { position: relative; display: inline-block; flex: 0 0 auto; line-height: 0; white-space: nowrap; vertical-align: middle; --sv-star: 16px; }
.sv-stars svg { width: var(--sv-star); height: var(--sv-star); margin-right: 2px; }
.sv-stars__bg svg { fill: #e2e2e2; }
.sv-stars__fg { position: absolute; left: 0; top: 0; overflow: hidden; white-space: nowrap; }
.sv-stars__fg svg { fill: var(--sv-orange); }
.sv-stars--lg { --sv-star: 22px; }
.sv-stars--sm { --sv-star: 13px; }

.sv-rev { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; }
.sv-rev__summary { min-width: 0; }
.sv-rev__score { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; }
.sv-rev__avg { color: var(--sv-text); font-size: 48px; font-weight: 700; line-height: 1; letter-spacing: -1px; }
.sv-rev__total { display: block; margin-top: 4px; color: var(--sv-muted); font-size: 14px; }
.sv-rev__bars { margin: 0 0 14px; padding: 0; list-style: none; }
.sv-rev__bars li { margin: 0; list-style: none; }
.sv-rev__bar {
    display: grid; grid-template-columns: 34px minmax(0, 1fr) 30px; align-items: center; gap: 10px; width: 100%; min-height: 32px; margin: 0; padding: 2px 6px;
    border: 1px solid transparent; border-radius: 8px; background: none; color: var(--sv-text); font-size: 14px; font-weight: 600; text-align: left; cursor: pointer;
}
.sv-rev__bar:hover:not([disabled]), .sv-rev__bar:focus-visible { background: var(--sv-green-soft); }
.sv-rev__bar[aria-pressed="true"] { border-color: var(--sv-green); background: var(--sv-green-soft); }
.sv-rev__bar[disabled] { cursor: default; color: #9a9a9a; }
.sv-rev__bar-label { display: inline-flex; align-items: center; gap: 3px; }
.sv-rev__bar-label svg { width: 13px; height: 13px; fill: var(--sv-orange); }
.sv-rev__bar[disabled] .sv-rev__bar-label svg { fill: #d0d0d0; }
.sv-rev__bar-track { display: block; height: 8px; border-radius: 4px; background: #eee; overflow: hidden; }
.sv-rev__bar-track span { display: block; height: 100%; border-radius: 4px; background: var(--sv-orange); }
.sv-rev__bar-n { color: var(--sv-muted); font-weight: 400; text-align: right; }
.sv-rev__aspects { margin: 0 0 14px; padding: 12px 0 0; border-top: 1px solid var(--sv-line); }
.sv-rev__aspects div { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 3px 0; }
.sv-rev__aspects dt { margin: 0; color: var(--sv-text); font-size: 14px; font-weight: 400; }
.sv-rev__aspects dd { display: inline-flex; align-items: center; gap: 6px; margin: 0; }
.sv-rev__aspects b { min-width: 24px; font-size: 14px; font-weight: 600; line-height: 1; text-align: right; }
.sv-rev__trust { display: flex; align-items: flex-start; gap: 8px; margin: 0 0 14px; color: #5f7d1c; font-size: 14px; font-weight: 600; line-height: 1.4; }
.sv-rev__trust svg { flex: 0 0 20px; width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.sv-rev__none { margin-bottom: 14px; }
.sv-rev__none p { margin: 10px 0 0; color: var(--sv-muted); font-size: 15px; line-height: 1.5; }
.sv-rev__none strong { display: block; margin-bottom: 2px; color: var(--sv-text); font-weight: 600; }
.sv-rev__write {
    display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 48px; padding: 0 18px;
    border: 2px solid var(--sv-green); border-radius: 8px; background: #fff; color: #5f7d1c; font-size: 16px; font-weight: 700; cursor: pointer;
    transition: background-color .2s;
}
.sv-rev__write:hover, .sv-rev__write[aria-expanded="true"] { background: var(--sv-green-soft); }
.sv-rev__write svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }

.sv-rev__main { min-width: 0; }
.sv-rev__filter { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 0 0 6px; color: var(--sv-muted); font-size: 14px; }
.sv-rev__filter[hidden] { display: none; }
.sv-rev__filter-clear { min-height: 36px; padding: 0 12px; border: 1px solid var(--sv-line); border-radius: 999px; background: #fff; color: var(--sv-text); font-size: 14px; font-weight: 600; cursor: pointer; }
.sv-rev__list { margin: 0; padding: 0; list-style: none; }
.sv-rev__item { margin: 0; padding: 16px 0; border-bottom: 1px solid var(--sv-line); list-style: none; }
.sv-rev__item:first-child { padding-top: 4px; }
.sv-rev__item:last-child { border-bottom: 0; }
.sv-rev__item[hidden] { display: none; }
.sv-rev__head { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
.sv-rev__avatar {
    display: inline-flex; flex: 0 0 40px; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%;
    background: var(--sv-green-soft); color: #5f7d1c; font-size: 17px; font-weight: 700;
}
.sv-rev__who { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 10px; min-width: 0; line-height: 1.3; }
.sv-rev__who strong { color: var(--sv-text); font-size: 15px; font-weight: 700; overflow-wrap: anywhere; }
.sv-rev__who time { flex-basis: 100%; color: var(--sv-muted); font-size: 13px; }
.sv-rev__verified { display: inline-flex; align-items: center; gap: 3px; padding: 2px 8px 2px 5px; border-radius: 999px; background: var(--sv-green-soft); color: #5f7d1c; font-size: 12px; font-weight: 600; }
.sv-rev__verified svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.sv-rev__rating { margin-bottom: 6px; }
.savonia-pp .sv-rev .sv-rev__title { margin: 0 0 4px; padding: 0; color: var(--sv-text); font-size: 16px; font-weight: 700; line-height: 1.4; text-transform: none; }
.sv-rev__text { margin: 0; color: var(--sv-text); font-size: 15px; line-height: 1.6; overflow-wrap: break-word; }
.sv-rev__pager { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 14px; }
.sv-rev__pager[hidden] { display: none; }
.sv-rev__pager button {
    min-width: 40px; min-height: 40px; padding: 0 12px; border: 1px solid var(--sv-line); border-radius: 8px; background: #fff;
    color: var(--sv-text); font-size: 14px; font-weight: 600; cursor: pointer;
}
.sv-rev__pager button:hover { border-color: var(--sv-green); background: var(--sv-green-soft); }
.sv-rev__pager button[aria-current="page"] { border-color: var(--sv-green); background: var(--sv-green); color: #fff; }
.sv-rev__pager .sv-rev__more { width: 100%; min-height: 46px; }

/* review form: closed until "Scrie o recenzie" (only when savonia-pp.js runs) */
.sv-rev.is-js .sv-rev__form { display: none; }
.sv-rev.is-js .sv-rev__form.is-open { display: block; }
.sv-rev__form { margin-bottom: 18px; }
.sv-rf { padding: 18px; border: 1px solid var(--sv-line); border-radius: var(--sv-radius); background: #fbfcf8; }
.savonia-pp .sv-rf .sv-rf__title { margin: 0 0 12px; padding: 0; color: var(--sv-text); font-size: 18px; font-weight: 700; text-transform: none; }
.sv-rf__ratings { display: flex; flex-wrap: wrap; gap: 6px 28px; margin-bottom: 8px; }
.sv-rf__rating { margin: 0; padding: 0; border: 0; min-width: 0; }
/* Magento base CSS hides every legend */
.savonia-pp .sv-rf .sv-rf__rating legend { display: block; width: auto; margin: 0 0 2px; padding: 0; border: 0; color: var(--sv-text); font-size: 15px; font-weight: 600; line-height: 1.4; }
.sv-rf__rating legend em, .sv-rf__fields label em { color: #c0392b; font-style: normal; }
.sv-rf__stars { position: relative; display: flex; flex-wrap: wrap; align-items: center; min-height: 44px; }
.sv-rf__stars input { position: absolute; left: 0; top: 0; opacity: 0; width: 1px; height: 1px; margin: 0; }
.sv-rf__stars label { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin: 0; cursor: pointer; }
.sv-rf__stars label svg { width: 32px; height: 32px; fill: #dcdcdc; transition: fill .15s, transform .15s; }
.sv-rf__stars input:checked + label svg { fill: var(--sv-orange); }
.sv-rf__stars input:focus-visible + label { outline: 2px solid var(--sv-green); outline-offset: -4px; border-radius: 8px; }
.sv-rf__stars[data-v="1"] label:nth-of-type(-n+1) svg, .sv-rf__stars[data-v="2"] label:nth-of-type(-n+2) svg,
.sv-rf__stars[data-v="3"] label:nth-of-type(-n+3) svg, .sv-rf__stars[data-v="4"] label:nth-of-type(-n+4) svg,
.sv-rf__stars[data-v="5"] label svg { fill: var(--sv-orange); }
.sv-rf__stars label:hover svg { transform: scale(1.08); }
.sv-rf__hint { margin-left: 6px; color: var(--sv-muted); font-size: 14px; white-space: nowrap; }
.savonia-pp .sv-rf .sv-rf__fields { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; margin: 6px 0 14px; padding: 0; }
.savonia-pp .sv-rf .sv-rf__fields li { margin: 0; padding: 0; list-style: none; }
.savonia-pp .sv-rf .sv-rf__fields label { display: block; margin: 0 0 4px; color: var(--sv-text); font-size: 14px; font-weight: 600; }
.savonia-pp .sv-rf .sv-rf__fields .input-text, .savonia-pp .sv-rf .sv-rf__fields textarea {
    width: 100%; max-width: none; min-height: 46px; padding: 10px 12px; border: 1px solid #d6d6d6; border-radius: 8px; background: #fff;
    color: var(--sv-text); font-size: 16px; line-height: 1.4; box-shadow: none;
}
.savonia-pp .sv-rf .sv-rf__fields textarea { min-height: 120px; resize: vertical; }
.savonia-pp .sv-rf .sv-rf__fields .input-text:focus, .savonia-pp .sv-rf .sv-rf__fields textarea:focus { border-color: var(--sv-green-dark); outline: 2px solid var(--sv-green-soft); }
.sv-rf__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin: 0; padding: 0; border: 0; }
.savonia-pp .sv-rf .sv-rf__submit { float: none; min-height: 48px; margin: 0; padding: 0 26px; border: 0; border-radius: 8px; background: #5f7d1c; color: #fff; font-size: 16px; font-weight: 700; }
.savonia-pp .sv-rf .sv-rf__submit:hover { background: #4d6716; }
.savonia-pp .sv-rf .sv-rf__submit span { display: inline; float: none; height: auto; padding: 0; background: none; color: inherit; font: inherit; line-height: 48px; }
.sv-rf__note { margin: 0; color: var(--sv-muted); font-size: 13px; }
.sv-rf .validation-advice { margin-top: 4px; color: #c0392b; font-size: 13px; }

@media (max-width: 767px) {
    .sv-sec__body, .sv-rev__text { font-size: 16px; }
    .sv-sec { padding: 18px 16px; }
}
@media (min-width: 768px) {
    /* the fixed header + Porto sticky add-to-cart bar end at ~135px when scrolled */
    .sv-sec { padding: 24px 26px; scroll-margin-top: 150px; }
    .sv-rev { grid-template-columns: 300px minmax(0, 1fr); gap: 36px; align-items: start; }
    .sv-rev__summary { position: sticky; top: 150px; }
    .savonia-pp .sv-rf .sv-rf__fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .savonia-pp .sv-rf .sv-rf__fields .sv-rf__wide { grid-column: 1 / -1; }
    /* no review yet: the form fills the empty list column, no extra click */
    .sv-rev--empty.is-js .sv-rev__form { display: block; margin-bottom: 0; }
    .sv-rev--empty .sv-rev__write { display: none; }
}
/* desktop: description with Caracteristici + Livrare beside it, Recenzii full width */
@media (min-width: 992px) {
    .sv-secs { grid-template-columns: minmax(0, 1fr) 380px; grid-template-areas: "nav nav" "desc specs" "desc ship" "rev rev"; gap: 24px; align-items: start; }
    .sv-secs--nodesc { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-areas: "nav nav" "specs ship" "rev rev"; }
    .sv-secs__nav { grid-area: nav; }
    .sv-sec { grid-column: 1 / -1; }
    .sv-sec--desc { grid-area: desc; }
    .sv-sec--specs { grid-area: specs; }
    .sv-sec--aside { grid-area: ship; }
    .sv-sec--review { grid-area: rev; }
    .sv-sec--desc .sv-sec__body { max-width: 860px; }
    .sv-sec--desc.is-clamped .sv-sec__body { max-height: 520px; }
}
@media (prefers-reduced-motion: reduce) {
    .sv-sec__more svg, .sv-rf__stars label svg { transition: none; }
}

/* ---------- r19 (2026-11-02): one star colour (--sv-star, savonia-rail.css) and the compact sticky bar ---------- */
.savonia-pp .product-shop .ratings .rating-box .rating:before,
.savonia-pp #product-customer-reviews .rating-box .rating:before { color: var(--sv-star-color); }
.sv-stars__fg svg, .sv-rev__bar-label svg, .sv-rf__stars input:checked + label svg,
.sv-rf__stars[data-v="1"] label:nth-of-type(-n+1) svg, .sv-rf__stars[data-v="2"] label:nth-of-type(-n+2) svg,
.sv-rf__stars[data-v="3"] label:nth-of-type(-n+3) svg, .sv-rf__stars[data-v="4"] label:nth-of-type(-n+4) svg,
.sv-rf__stars[data-v="5"] label svg { fill: var(--sv-star-color); }
.sv-rev__bar-track span { background: var(--sv-star-color); }

/* sticky bar: under the fixed header on desktop (top set by view.phtml), at the bottom on phones; slides in only while
   the buy block is out of view. Porto's own padding/positions (local.css 3615–3624) are replaced. */
.savonia-pp .sticky-product.sv-sticky {
    top: 48px; left: 0; right: 0; width: auto; padding: 0; background: #fff;
    border-bottom: 1px solid var(--sv-line); box-shadow: 0 6px 18px rgba(0, 0, 0, .08);
    transform: translateY(-100%); opacity: 0; visibility: hidden;
    transition: transform .25s ease, opacity .2s ease, visibility 0s linear .25s;
}
.savonia-pp .sticky-product.sv-sticky.is-on { transform: none; opacity: 1; visibility: visible; transition: transform .25s ease, opacity .2s ease; }
.savonia-pp .sv-sticky .sv-sticky__in {
    display: grid; grid-template-columns: 56px minmax(0, 1fr) auto auto; grid-template-areas: "img name price buy" "img meta price buy";
    align-items: center; column-gap: 14px; row-gap: 2px; padding-top: 8px; padding-bottom: 8px;
}
.savonia-pp .sv-sticky .sv-sticky__in:before, .savonia-pp .sv-sticky .sv-sticky__in:after { display: none; }
.sv-sticky__img {
    grid-area: img; display: block; width: 56px; height: 56px; padding: 3px; overflow: hidden;
    border: 1px solid var(--sv-line); border-radius: 10px; background: #fff;
}
.sv-sticky__img img { display: block; width: 100%; height: 100%; object-fit: contain; border-radius: 7px; }
.sv-sticky__name {
    grid-area: name; align-self: end; margin: 0; overflow: hidden; color: var(--sv-text);
    font-size: 15px; font-weight: 600; line-height: 1.3; white-space: nowrap; text-overflow: ellipsis;
}
.sv-sticky__meta { grid-area: meta; align-self: start; display: flex; align-items: center; flex-wrap: wrap; gap: 4px 12px; min-width: 0; }
.sv-sticky__rating { display: inline-flex; align-items: center; gap: 5px; }
.sv-sticky__count { color: var(--sv-muted); font-size: 13px; line-height: 1; }
.savonia-pp .sticky-product .sv-stock.sv-sticky__stock { margin: 0; padding: 2px 10px 2px 8px; font-size: 12px; }
.sv-sticky__price { grid-area: price; text-align: right; white-space: nowrap; }
.savonia-pp .sv-sticky__price .price-box { margin: 0; }
.savonia-pp .sv-sticky__price .price-box p { display: block; margin: 0; }
.savonia-pp .sv-sticky__price .price-label { display: none; }
.savonia-pp .sv-sticky__price .old-price { color: var(--sv-muted); font-size: 12px; line-height: 1.3; }
.savonia-pp .sv-sticky__price .price { font-size: 20px; font-weight: 700; line-height: 1.2; }
.sv-sticky__buy { grid-area: buy; }
.savonia-pp .sv-sticky .btn-cart { min-height: 44px; padding: 0 24px; }
@media (min-width: 768px) {
    /* the bar keeps the page width but is not wider than needed for one product */
    .savonia-pp .sv-sticky .sv-sticky__in { min-height: 72px; }
}
@media (max-width: 767px) {
    /* Porto hides the bar on phones (responsive.css 1112, display:none !important): here it is a compact bottom bar */
    .savonia-pp .sticky-product.sv-sticky {
        display: block !important; top: auto !important; bottom: 0; z-index: 120;
        border-top: 1px solid var(--sv-line); border-bottom: 0; box-shadow: 0 -4px 16px rgba(0, 0, 0, .1);
        transform: translateY(100%); padding-bottom: env(safe-area-inset-bottom);
    }
    .savonia-pp .sv-sticky .sv-sticky__in {
        grid-template-columns: 44px minmax(0, 1fr) auto; grid-template-areas: "img name buy" "img price buy" "img meta buy";
        column-gap: 10px; row-gap: 1px; padding: 8px 12px;
    }
    .sv-sticky__img { width: 44px; height: 44px; padding: 2px; border-radius: 8px; }
    .sv-sticky__name { font-size: 13px; }
    .sv-sticky__price { display: flex; text-align: left; }
    .savonia-pp .sv-sticky__price .price-box { display: flex; flex-direction: row-reverse; justify-content: flex-end; align-items: baseline; gap: 8px; }
    .savonia-pp .sv-sticky__price .old-price { font-size: 11px; }
    .savonia-pp .sv-sticky__price .price { font-size: 16px; }
    .sv-sticky__meta { gap: 2px 8px; }
    .sv-sticky .sv-stars--sm { --sv-star: 11px; }
    .sv-sticky__count { font-size: 11px; }
    .savonia-pp .sticky-product .sv-stock.sv-sticky__stock { padding: 0 8px 0 6px; font-size: 11px; }
    .savonia-pp .sv-sticky .btn-cart { padding: 0 14px; font-size: 14px; }
    /* the "back to top" button moves above the bar */
    #totop { transition: bottom .25s ease; }
    body.sv-sticky-on #totop { bottom: calc(var(--sv-sticky-h, 72px) + 10px); }
}
@media (prefers-reduced-motion: reduce) {
    .savonia-pp .sticky-product.sv-sticky, .savonia-pp .sticky-product.sv-sticky.is-on, #totop { transition: none; }
}

/* ---------- r21 (2026-11-03): phones – the short description under the name is clamped, "Citește mai mult" opens it (savonia-pp.js) ---------- */
@media (max-width: 767px) {
    .savonia-pp .product-shop .short-description.is-clamped .std { position: relative; max-height: 132px; overflow: hidden; }
    .savonia-pp .product-shop .short-description.is-clamped .std:after {
        content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 64px; background: linear-gradient(rgba(255, 255, 255, 0), #fff 90%); pointer-events: none;
    }
    .savonia-pp .product-shop .short-description .sv-sec__more { margin-top: 0; }
    .savonia-pp .product-shop .short-description.is-open .sv-sec__more svg { transform: rotate(180deg); }
}
@media (min-width: 768px) {
    .savonia-pp .product-shop .short-description .sv-sec__more { display: none; }
}

/* ---------- r23 (2026-11-03): desktop grid 5/7 (image / details), 50px under the gallery ---------- */
/* Porto porto_settings/product_view/product_image_size = 6 writes col-sm-6 / col-sm-6 (view.phtml); on desktop 5 + 7 here,
   tablets (768-991px) stay 6 / 6. Porto's 150px under the gallery (≥768px) is 50px; phones keep their 30px. */
@media (min-width: 992px) {
    .savonia-pp .product-view .product-img-box.col-sm-6 { width: 41.66666667%; }
    .savonia-pp .product-view .product-shop.col-sm-6 { width: 58.33333333%; }
}
@media (min-width: 768px) { .savonia-pp .product-view .product-img-box { margin-bottom: 50px; } }

/* ---------- r24 (2026-11-03): thumbnails at the bottom of the full-screen viewer (js/savonia-pp.js) ---------- */
.sv-lb__thumbs {
    position: relative; display: flex; flex: 0 0 auto; gap: 10px; padding: 10px 16px 16px; overflow-x: auto; overflow-y: hidden;
    overscroll-behavior-x: contain; scrollbar-width: thin;
}
.sv-lb__thumbs .sv-gal__thumb:first-child { margin-left: auto; } /* centred, but scrollable from the first one when too many */
.sv-lb__thumbs .sv-gal__thumb:last-child { margin-right: auto; }
.sv-lb__thumbs .sv-gal__thumb { flex: 0 0 72px; width: 72px; height: 72px; }
@media (max-width: 767px) {
    .sv-lb__thumbs { gap: 8px; padding: 8px 12px max(12px, env(safe-area-inset-bottom)); }
    .sv-lb__thumbs .sv-gal__thumb { flex-basis: 56px; width: 56px; height: 56px; padding: 3px; border-radius: 8px; }
}
/* the "Cineva din ... a cumparat" notice (#growls, z-index 50000) would cover the viewer's thumbnails */
html.sv-lb-open #growls { display: none; }

/* ---------- r25 (2026-11-03): 50px under the product details column too (≥768px), like under the gallery (r23) ---------- */
@media (min-width: 768px) { .savonia-pp .product-view .product-shop { margin-bottom: 50px; } }

/* ---------- r26 (2026-11-03): "Grabeste-te, mai avem N în stoc" (p.availability-only) as a small card with the footer's
   scalloped edge (.footer::before: radial-gradient scallops), soft orange = the cart button's family, hourglass icon ---------- */
.savonia-pp .product-shop .availability-only {
    position: relative; display: flex; align-items: center; gap: 10px; width: fit-content; max-width: 100%; box-sizing: border-box;
    margin: 18px 0 8px; padding: 9px 16px 9px 9px; border-radius: 0 0 12px 12px; background: #fdf0e2;
    color: var(--sv-text); font-size: 14px; line-height: 1.4;
}
.savonia-pp .product-shop .availability-only:before {
    content: ""; position: absolute; left: 0; right: 0; top: -8px; height: 8px;
    background: radial-gradient(circle at 50% 100%, #fdf0e2 0, #fdf0e2 7.5px, transparent 8px) 0 0 / 16px 8px;
    background-repeat: round no-repeat; /* whole scallops only, whatever the card width */
}
.savonia-pp .product-shop .availability-only span {
    position: relative; display: block; min-height: 30px; padding: 5px 0 5px 40px; box-sizing: border-box; border: 0;
    color: var(--sv-text); font-size: 14px; font-weight: 600; cursor: default; /* block, not flex: the spaces around the number stay */
}
.savonia-pp .product-shop .availability-only span:before {
    content: ""; position: absolute; left: 0; top: 50%; width: 30px; height: 30px; margin-top: -15px; border-radius: 50%;
    box-shadow: 0 1px 3px rgba(220, 132, 48, .25);
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c26a1c' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h12M6 21h12M7 3v3.5a5 5 0 0 0 2.2 4.1L12 12l2.8-1.4A5 5 0 0 0 17 6.5V3M7 21v-3.5a5 5 0 0 1 2.2-4.1L12 12l2.8 1.4a5 5 0 0 1 2.2 4.1V21'/%3E%3Cpath d='M9.5 18.5h5'/%3E%3C/svg%3E") center / 18px no-repeat;
}
.savonia-pp .product-shop .availability-only strong { color: #a5520f; font-size: 16px; font-weight: 800; }

/* no review yet: no "Fii primul care evalueaza acest produs." line under the name (the form stays in the Recenzii section) */
.savonia-pp .product-shop .no-rating { display: none; }

/* ---- Savonia 2026-11-03: rich long product description (.sv-d), termek-ghid ---- */
/* Savonia – rich long product description (.sv-d …), product page "Descriere" section (.sv-sec__body).
   Tokens come from savonia-rail.css (--sv-*); fallbacks keep it readable without them.
   Only .sv-d classes are targeted, so the rules are inert on descriptions that do not use them. */
.sv-d { color: var(--sv-text, #2f2f2f); }
.sv-d__lead {
    margin: 0 0 18px; padding: 14px 16px; border-left: 4px solid var(--sv-green, #a9cf45);
    border-radius: 0 var(--sv-radius, 10px) var(--sv-radius, 10px) 0; background: var(--sv-green-soft, #f3f8e6);
    font-size: 16px; line-height: 1.65;
}
.sv-d .sv-d__h {
    display: flex; align-items: center; gap: 8px; margin: 22px 0 10px; padding: 0;
    color: var(--sv-text, #2f2f2f); font-size: 17px; font-weight: 600; line-height: 1.3; text-transform: none; letter-spacing: 0;
}
.sv-d .sv-d__h:before { content: ""; flex: 0 0 8px; height: 8px; border-radius: 50%; background: var(--sv-green, #a9cf45); }
.sv-d .sv-d__keys {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px;
    margin: 0 0 14px; padding: 0; list-style: none;
}
.sv-d .sv-d__keys li {
    margin: 0; padding: 12px 14px; border: 1px solid var(--sv-line, #ececec); border-radius: var(--sv-radius, 10px);
    background: #fff; list-style: none;
}
.sv-d .sv-d__keys li:before { content: none; }
.sv-d .sv-d__k { display: block; margin: 0 0 4px; color: #4a6214; font-size: 15px; font-weight: 600; line-height: 1.35; }
.sv-d .sv-d__tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 14px; padding: 0; list-style: none; }
.sv-d .sv-d__tags li {
    margin: 0; padding: 5px 12px; border-radius: 999px; background: var(--sv-green-soft, #f3f8e6);
    color: #4a6214; font-size: 14px; line-height: 1.4; list-style: none;
}
.sv-d .sv-d__tags li:before { content: none; }
.sv-d .sv-d__steps { margin: 0 0 14px; padding-left: 22px; }
.sv-d .sv-d__steps li { margin: 0 0 6px; }
.sv-d .sv-d__facts {
    margin: 0 0 14px; padding: 2px 14px; border: 1px solid var(--sv-line, #ececec); border-radius: var(--sv-radius, 10px); background: #fff;
}
.sv-d .sv-d__facts > div {
    display: grid; grid-template-columns: minmax(110px, 32%) minmax(0, 1fr); gap: 12px;
    padding: 10px 0; border-bottom: 1px solid var(--sv-line, #ececec);
}
.sv-d .sv-d__facts > div:last-child { border-bottom: 0; }
.sv-d .sv-d__facts dt { margin: 0; color: var(--sv-muted, #6b6b6b); font-size: 14px; font-weight: 400; line-height: 1.45; }
.sv-d .sv-d__facts dd { margin: 0; color: var(--sv-text, #2f2f2f); font-size: 15px; line-height: 1.5; overflow-wrap: anywhere; }
.sv-d .sv-d__facts dd.sv-d__inci { color: var(--sv-muted, #6b6b6b); font-size: 13px; letter-spacing: .01em; }
.sv-d .sv-d__note {
    margin: 0 0 14px; padding: 12px 14px; border: 1px solid #f3d9b8; border-radius: var(--sv-radius, 10px);
    background: #fff7ec; font-size: 14px; line-height: 1.55;
}
@media (max-width: 600px) {
    .sv-d .sv-d__facts > div { grid-template-columns: 1fr; gap: 2px; }
    .sv-d__lead { padding: 12px 14px; }
}

/* ---------- r27 (2026-11-03): product name: text colour; on desktop its top in line with the image top ---------- */
.savonia-pp .product-shop .product-name h1 { color: var(--sv-text); }
@media (min-width: 768px) { .savonia-pp .product-shop .product-name h1 { margin: 0 0 20px 0; } }

/* ---------- r28 (2026-11-03): price without discount red like the special price; a line between description and price ---------- */
.savonia-pp .product-shop .price-box .regular-price .price { color: #ee3124; }
.savonia-pp .product-shop .short-description { margin-bottom: 16px; padding-bottom: 18px; border-bottom: 1px solid var(--sv-line); }
/* no line under the buy row (phones: .add-to-box border-bottom) */
.savonia-pp .product-view .product-shop .add-to-box { border-bottom: 0; }

/* ---------- r29 (2026-11-03): points box under the description line (js moves p.loyalty-points), "în stoc" on one line,
   the stock dot also "breathes" when the system asks for reduced motion (opacity only, no movement) ---------- */
.savonia-pp .product-shop .loyalty-points.sv-pts {
    box-sizing: border-box; max-width: 50%; margin: -16px 0 0; padding: 8px 14px 9px 36px; /* hangs from the line (sd margin-bottom 16px) */
    border-radius: 0 0 10px 10px; background: #f2f2f0; color: #555; font-size: 13px; line-height: 1.45; text-align: left;
}
@media (min-width: 768px) { /* out of the flow at its own place (top: auto), so the price stays right under the line */
    .savonia-pp .product-shop .loyalty-points.sv-pts { position: absolute; right: 15px; z-index: 1; }
}
.savonia-pp .product-shop .loyalty-points.sv-pts:before { /* small coin icon */
    content: ""; position: absolute; left: 12px; top: 9px; width: 16px; height: 16px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237fa12a' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7.5l1.4 2.9 3.1.4-2.3 2.2.6 3.1-2.8-1.5-2.8 1.5.6-3.1-2.3-2.2 3.1-.4z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.savonia-pp .product-shop .loyalty-points.sv-pts img { display: none; }
.savonia-pp .product-shop .loyalty-points.sv-pts .point-equivalence { color: #555; }
.savonia-pp .product-shop .loyalty-points.sv-pts a.about-point-scheme { color: #5f7d1c; font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.savonia-pp .product-shop .loyalty-points.sv-pts a.about-point-scheme:hover { color: #4a6214; }
@media (max-width: 767px) {
    .savonia-pp .product-shop .loyalty-points.sv-pts { position: relative; display: block; width: fit-content; max-width: 88%; margin: -16px 0 14px auto; }
}

.savonia-pp .product-shop .availability span { white-space: nowrap; }
.savonia-pp .product-shop .availability { flex-wrap: nowrap; }
@keyframes sv-stock-breathe { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@media (prefers-reduced-motion: reduce) {
    .savonia-pp .product-shop .availability:before { animation: sv-stock-breathe 2.4s ease-in-out infinite; }
    .savonia-pp .product-shop .availability.out-of-stock:before { animation: none; }
}

/* ---------- r30 (2026-11-03): points text right under the add-to-cart row (js), plain grey centred text:
   no box, no outline, no icon ---------- */
.savonia-pp .product-shop .loyalty-points.sv-pts { /* after the r29 rules (same specificity), so it wins at every width */
    position: static; display: block; clear: both; width: auto; max-width: none; margin: 12px 0 0; padding: 0;
    text-align: center; background: none; border: 0; border-radius: 0; color: #777;
}
.savonia-pp .product-shop .loyalty-points.sv-pts .point-equivalence { color: #777; }
.savonia-pp .product-shop .loyalty-points.sv-pts:before { content: none; display: none; }

/* r30: the stock dot keeps the ring pulse also when the system asks for reduced motion (owner's request; replaces the r29 "breathe") */
@media (prefers-reduced-motion: reduce) {
    .savonia-pp .product-shop .availability:before { animation: sv-stock-pulse 1.7s ease infinite; box-shadow: none; }
    .savonia-pp .product-shop .availability.out-of-stock:before { animation: none; }
}
/* 2026-11-05 (Szabolcs): "Adaugă în coș" label on the product page bold, like the "Cumpără mai multe" button
   (the inner spans got font-weight 400 from the inherited theme button rule) */
.savonia-pp .sv-buy .btn-cart.sv-buy__btn span { font-weight: 700; }