/* Listing price presentation for the price-range feature.
   Everything is scoped to .product-miniature so the product page keeps its own price styling. */

/* Current price. Two class levels are needed throughout this file: the theme editor emits
   single-class rules (.product-price, .btn-product-list) that would otherwise win on source
   order, and reaching for !important instead would make these impossible to override later. */
.product-miniature .product-price {
    color: #2e7d32;          /* ~5.1:1 on white -- WCAG AA for normal text */
    font-weight: 600;
    white-space: nowrap;     /* never break "122 - 165 lei" across lines: it is one value */
}

/* Prior price, struck through, when a reduction is advertised.
   It gets its own line because it is a RANGE too whenever the current price is, and
   "35,76 - 56,09 lei 45,76 - 66,09 lei" side by side reads as number soup. Stacked and
   muted, the eye takes the current price first and the prior price as a footnote. */
.product-miniature .regular-price {
    display: block;
    margin-top: 0.15rem;
    color: #8a8a8a;
    font-size: 0.8125rem;
    font-weight: 400;
    line-height: 1.3;
    text-decoration: line-through;
    white-space: nowrap;
}

/* The "Detalii" button.
   The theme editor ships `.btn-product-list { background: #bababa }` (grey, orange on hover),
   which the old add-to-cart <button> overrode via a class an <a> does not inherit. At equal
   specificity that grey rule also beats `.btn-primary`, so two class levels are needed to win.
   The colours are the theme's own primary/hover pair -- keep them in step if the palette is
   changed under Design > Theme editor, since CSS cannot read that value directly. */
.product-miniature .btn-product-details {
    background: #131a65;
    border-color: #131a65;
    color: #ffffff;
}

.product-miniature .btn-product-details:hover,
.product-miniature .btn-product-details:focus {
    background: #000000;
    border-color: #000000;
    color: #ffffff;
}

/* ---------------------------------------------------------------------------
   Product page: quantity-tier cards (product-discounts.tpl).
   Products carry 2-5 tiers; flex-wrap shows all of them, extra cards wrap to
   a new row rather than scrolling off-screen. */

.steag-qty-tiers {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.steag-qty-tier-card {
    flex: 0 1 10rem;
    min-width: 8rem;
    padding: 0.75rem 1rem;
    border: 1px solid #e5e5e5;
    border-radius: 8px;
    background: #ffffff;
    text-align: center;
}

.steag-qty-tier-qty {
    font-size: 0.875rem;
    font-weight: 600;
    color: #333333;
}

.steag-qty-tier-price {
    margin: 0.25rem 0;
    color: #2e7d32;           /* same green as the listing prices */
    font-size: 1.125rem;
    font-weight: 700;
    white-space: nowrap;      /* a price is one value; never break it */
}

.steag-qty-tier-badge {
    display: inline-block;
    padding: 0.1rem 0.5rem;
    border-radius: 4px;
    background: #e6f4ea;
    color: #1e7e34;
    font-size: 0.8125rem;
    font-weight: 600;
}

.steag-qty-tiers-note {
    margin: 0.5rem 0 0;
    font-size: 0.8125rem;
    color: #777777;
}