/* Mobilus Miestas – senos parduotuvės atitikties (parity) stiliai: prekės puslapis. 2026-10-21.
   ATSKIRAS failas: mm.css ir mm-ux.css neliečiami. Įtraukiamas layout/header.tpl iškart po mm-ux.css (oxstyle, ?filemtime).
   Spalvos ir dydžiai – tik per CSS kintamuosius (tokens). Norint atšaukti – pašalinti eilutę iš layout/header.tpl. */

:root {
  --mm-pd-saving-color: var(--mm-green);
  --mm-pd-saving-size: 15px;
  --mm-pd-price-gap: 22px;
  --mm-card-old-size: 13px;
}

/* Sutaupymo indikatorius (kiaulė-taupyklė + suma) – kaip senoje, tik telefone (≤ 700 px). */
.mm-pd__saving { display: none; }
@media (max-width: 700px) {
  .mm-pd__pricebox { display: flex; flex-wrap: wrap; align-items: center; column-gap: 14px; row-gap: 4px; margin: 0 0 var(--mm-pd-price-gap); }
  .mm-pd__pricebox .mm-pd__price { margin: 0; }
  .mm-pd__pricebox .mm-pd__saving { display: inline-flex; align-items: center; gap: 6px; margin: 0; font-size: var(--mm-pd-saving-size); color: var(--mm-pd-saving-color); }
  .mm-pd__pricebox .mm-pd__saving svg { flex: none; }
}

/* „Užsakyti“ (tik užklausa, OXCANBUY = 0) – nuoroda atrodo kaip pirkimo mygtukas. */
a.mm-pd__inquiry { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
a.mm-pd__inquiry:hover, a.mm-pd__inquiry:focus { text-decoration: none; }

/* Priedų kortelės: perbraukta sena kaina šalia kainos (kaip senoje). */
.mm-card__price del { margin-left: 6px; font-size: var(--mm-card-old-size); font-weight: 400; color: var(--mm-muted); }

/* ==========================================================================
   UX partija „front“ (2026-10-21): prekės puslapis, pirkimo juosta, SB lizingas, „į krepšelį“ pranešimas.
   Visi dydžiai, spalvos ir laikai – tokenai žemiau (mm.js laikus skaito iš čia per getComputedStyle).
   ========================================================================== */
:root {
  --mm-uxf-toast-time: 5s;          /* „Įdėta į krepšelį“ pranešimas matomas (sustoja, kol pelė / fokusas jame) */
  --mm-uxf-toast-out: .25s;         /* išnykimo trukmė prieš pašalinimą (mm.css .mm-toast transition .2s) */
  --mm-uxf-sb-max: 580px;           /* SB lizingo skaičiuoklės plotis kaip senoje parduotuvėje */
  --mm-uxf-sb-natural: 380px;       /* SB iframe natūralus plotis siaurame ekrane (mm.js sumažina iki konteinerio) */
  --mm-uxf-bar-dur: .18s;           /* pirkimo juostos išvažiavimas (kaip --mm-sticky-dur) */
  --mm-uxf-bar-pad: 10px;           /* pirkimo juostos vidinė paraštė (kaip mm.css .mm-cartbar) */
  --mm-uxf-bar-sum-size: 17px;      /* kaina juostoje */
  --mm-uxf-bar-from-size: 12px;     /* „nuo“ juostoje */
  --mm-uxf-var-gap: 10px;           /* variantų tarpas (kaip mm.css .mm-pd__variants gap) */
  /* UX likučiai (2026-10-21): pirkimo juosta be mm-cartbar klasės, kol paslėpta – tos pačios vertės kaip mm.css .mm-cartbar */
  --mm-uxf-bar-z: 1050;
  --mm-uxf-bar-gap: 12px;
  --mm-uxf-bar-bg: #fff;
  --mm-uxf-bar-shadow: 0 -4px 16px rgba(15,23,42,.1);
  --mm-uxf-bar-btn-h: 48px;
  --mm-uxf-bar-btn-fs: 15px;
  --mm-uxf-toast-close: 32px;       /* pranešimo „ד paspaudimo plotas (≥ 24 px, WCAG 2.5.8; buvo 13 × 20 px) */
}

/* 5.5 Variantai – nav + sąrašas (buvo div su nuorodomis); išvaizda ta pati. */
.mm-pd__variants .mm-pd__varlist { display: flex; flex-direction: column; gap: var(--mm-uxf-var-gap); list-style: none; margin: 0; padding: 0; }
.mm-pd__variants .mm-pd__varlist > li { margin: 0; padding: 0; }

/* 5.4 Savybių grupės antraštė h3 po paslėptos skydelio H2: pirmos grupės viršutinė paraštė – kaip anksčiau (mm-ux.css :first-child). */
#attributes > h2.sr-only + .mm-attr__group { margin-top: 0; }

/* 4.8 SB lizingo skaičiuoklė: plotis – tokenas (aukštis – nustatymas sMmSbLeasingHeight, inline). */
.mm-pd__sb { max-width: var(--mm-uxf-sb-max); overflow: hidden; }
.mm-pd__sb .mm-pd__sbframe { display: block; width: 100%; max-width: var(--mm-uxf-sb-max); border: 0; }
@media (max-width: 575px) {
  .mm-pd__sb .mm-pd__sbframe { width: var(--mm-uxf-sb-natural); max-width: none; transform-origin: 0 0; }
}

/* 4.5 Pirkimo juosta telefone (#mmPdBar). ≥768 px – niekada nerodoma (mm.css rodo .mm-cartbar iki 900 px).
   Klasė mm-cartbar (mmassist lift() pagal ją pakelia pokalbio mygtuką) – tik kol juosta rodoma (mm.js kartu su is-on),
   todėl visa išvaizda čia aprašyta be jos (.mm-pdbar), o .mm-cartbar.mm-pdbar – tik specifiškumui prieš mm.css. */
.mm-pdbar, .mm-cartbar.mm-pdbar { display: none; }
@media (max-width: 767px) {
  .mm-pdbar, .mm-cartbar.mm-pdbar { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: var(--mm-uxf-bar-z); align-items: center; gap: var(--mm-uxf-bar-gap);
    max-width: 100vw; box-sizing: border-box; background: var(--mm-uxf-bar-bg); border-top: 1px solid var(--mm-border); box-shadow: var(--mm-uxf-bar-shadow);
    padding: var(--mm-uxf-bar-pad) var(--mm-uxf-bar-pad) calc(var(--mm-uxf-bar-pad) + env(safe-area-inset-bottom));
    transform: translateY(110%); visibility: hidden; transition: transform var(--mm-uxf-bar-dur) ease-out, visibility 0s linear var(--mm-uxf-bar-dur); }
  .mm-pdbar.is-on { transform: translateY(0); visibility: visible; transition: transform var(--mm-uxf-bar-dur) ease-out, visibility 0s; }
  .mm-pdbar .mm-btn--cta { flex: 1; height: var(--mm-uxf-bar-btn-h); font-size: var(--mm-uxf-bar-btn-fs); }
  .mm-pdbar .mm-pdbar__sum { margin: 0; min-width: 0; }
  .mm-pdbar .mm-pdbar__sum b { font-size: var(--mm-uxf-bar-sum-size); white-space: nowrap; color: var(--mm-price); }
  .mm-pdbar .mm-pdbar__sum small { display: inline; font-size: var(--mm-uxf-bar-from-size); font-weight: 400; color: var(--mm-muted); }
  .mm-pdbar .mm-pdbar__btn { flex: 1 1 auto; min-width: 0; justify-content: center; text-align: center; }
  .mm-pdbar .mm-pdbar__btn[disabled] { background: var(--mm-disabled-bg); color: var(--mm-muted); cursor: not-allowed; transform: none; }
  html.mm-search-open .mm-pdbar { visibility: hidden; }
}

/* 4.11 „Įdėta į krepšelį“ – mygtukų tekstas nelūžta (abu mygtukai vienoje eilutėje ir 375, ir 1366 px). */
.mm-toast .mm-toast__actions .mm-btn { white-space: nowrap; }
/* „ד – bent --mm-uxf-toast-close kvadratas (simbolis centre, vaizdas tas pats) */
.mm-toast .mm-toast__close { display: inline-flex; align-items: center; justify-content: center; min-width: var(--mm-uxf-toast-close); min-height: var(--mm-uxf-toast-close); padding: 0; }