/* css/refined/product.css -- owner R1-RF-CORE3 (REFINE-COMMON). Every rule is scoped under body.rf.
   The product page, same blocks in the same order: the price block (the one large figure on the site), the verdict as a
   quiet check with its one line of basis, the small 30-day chart (_rf_chart.html), the chains as compact rows, the proof
   one tap away. Lining tabular figures for every price; the euro sign smaller than the figure. */

/* The price block */
body.rf .pdp-price .price{font-variant-numeric:lining-nums tabular-nums;letter-spacing:-.01em}
body.rf .pdp-price .price--lg .price__e{font-size:3.25rem;letter-spacing:-.035em}
body.rf .pdp-price .price--lg .price__c{font-size:1.45rem}
body.rf .pdp-price .price--lg .price__cur{font-size:1.05rem;margin-left:4px;opacity:.86}
@media (min-width:960px){body.rf .pdp-price .price--lg .price__e{font-size:3.75rem}body.rf .pdp-price .price--lg .price__c{font-size:1.7rem}}
body.rf .receipt__unit,body.rf .receipt__at,body.rf .receipt__stats{font-variant-numeric:lining-nums tabular-nums}

/* "Akcija je prava." -- the check and its one line of basis; green only when earned */
body.rf .layout-product .verdict{align-items:flex-start;gap:10px;padding:12px 14px;border-radius:var(--radius-13);
  border:1px solid color-mix(in srgb,var(--v) 28%,var(--line));background:color-mix(in srgb,var(--v) 7%,var(--surface));box-shadow:none}
body.rf .layout-product .verdict__text{font-size:.9rem;line-height:1.45;font-variant-numeric:lining-nums tabular-nums}
body.rf .layout-product .verdict__link{display:inline-block;padding-block:6px}

/* The small 30-day chart: steps, the 30-day low dashed, today's dot, the two end dates */
body.rf .rf-chart{margin:0}
body.rf .rf-chart__title{margin:0 0 12px;font-size:.82rem;font-weight:var(--fw-semi);color:var(--muted)}
body.rf .rf-chart__plot{position:relative;height:88px}
body.rf .rf-chart__svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
body.rf .rf-chart__line{fill:none;stroke:var(--chart-line);stroke-width:2;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
body.rf .rf-chart__low{stroke:var(--muted);stroke-width:1;stroke-dasharray:3 4;vector-effect:non-scaling-stroke}
body.rf .rf-chart__lab{display:flex;align-items:center;gap:8px;margin:8px 0 0;font-size:.75rem;color:var(--muted);
  font-variant-numeric:lining-nums tabular-nums}
body.rf .rf-chart__lab i{flex:0 0 18px;border-top:1px dashed var(--muted)}
body.rf .rf-chart__dot{position:absolute;width:9px;height:9px;border-radius:50%;background:var(--save);box-shadow:0 0 0 3px var(--surface);
  transform:translate(-50%,-50%)}
body.rf .rf-chart__axis{display:flex;justify-content:space-between;margin-top:8px;padding-top:6px;border-top:1px solid var(--line-2);
  font-size:.75rem;color:var(--muted);font-variant-numeric:lining-nums tabular-nums}
@media (forced-colors:active){body.rf .rf-chart__dot{forced-color-adjust:none}}

/* The chains: compact rows, hairline between them */
body.rf .layout-product .chain-row{min-height:48px;padding:8px 0;gap:10px}
body.rf .layout-product .chain-row__name{font-size:.95rem}
body.rf .layout-product .chain-row__price{font-size:.98rem;font-variant-numeric:lining-nums tabular-nums}
body.rf .layout-product .chain-row__unit{font-size:.76rem;font-variant-numeric:lining-nums tabular-nums}
body.rf .layout-product .chain-row .rf-cur{font-size:.8em;margin-left:1px}

