/* ==========================================================================
   Žaislų Dėžė V3 — komponentai
   Receptai iš IMPLEMENTATION-HANDOFF §5. Rėmai — background-image, ne border-image.
   Tekstas NIEKADA neįkeptas į paveikslėlį.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Assetų keliai. url() sprendžiamas reliatyviai šio CSS failo, todėl temos
   URI nereikia. Vienintelė vieta, kur assetų vardai minimi — čia.
   -------------------------------------------------------------------------- */
:root {
  --zd-plaque-url:        url(../img/ui/primary-plaque-frame.svg);
  --zd-ticket-url:        url(../img/ui/secondary-ticket-frame.svg);
  --zd-atc-url:           url(../img/ui/add-to-cart-ticket-frame.svg);
  /* UI V4: koncentriniai žiedai su auksine žvaigžde. Senasis rėmas liko
     assets/img/ui/icon-medallion-frame.svg — grąžinama pakeitus šią eilutę. */
  --zd-medallion-url:     url(../img/ui/frames/nav-medallion.svg);
  --zd-thread-url:        url(../img/ui/tertiary-thread-underline.svg);
  --zd-qty-url:           url(../img/ui/quantity-control-frame.svg);
  --zd-vitrine-a-url:     url(../img/ui/product-vitrine-a.svg);
  --zd-vitrine-b-url:     url(../img/ui/product-vitrine-b.svg);
  --zd-door-url:          url(../img/ui/category-stage-door.svg);
  --zd-badge-new-url:     url(../img/ui/badge-new.svg);
  --zd-badge-sale-url:    url(../img/ui/badge-sale.svg);
  --zd-badge-popular-url: url(../img/ui/badge-popular.svg);
  --zd-badge-out-url:     url(../img/ui/badge-out.svg);
  --zd-chevron-url:       url(../img/ui/icons/chevron-down.svg);
  --zd-grain-url:         url(../img/decorative/cel-grain.webp);
}

/* ==========================================================================
   1. MYGTUKAI
   ========================================================================== */
.zd-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  min-height: var(--control-h);
  min-width: var(--cta-min-w);
  max-width: var(--cta-max-w);
  padding: 0 24px 4px;              /* 4px apačioje — tekstas sėdi ant plokštelės */
  border: 0;
  background: transparent;
  font: 800 15px/1 var(--font-ui);
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  position: relative;
  transition: transform var(--d-fast) var(--ease-press),
              filter var(--d-fast) var(--ease-press);
}
.zd-btn:disabled, .zd-btn[aria-disabled="true"] { pointer-events: none; }

/* 1.1 Primary — Crimson Stage Plaque */
.zd-btn--primary {
  background: var(--zd-plaque-url) center / 100% 100% no-repeat;
  color: var(--paper-050);
}
.zd-btn--primary:hover  { color: var(--paper-050); transform: translateY(var(--lift-button)); filter: brightness(1.06); }
.zd-btn--primary:active { transform: translateY(2px); filter: brightness(.98); }
.zd-btn--primary:disabled {
  background: var(--paper-200);
  color: color-mix(in srgb, var(--ink-950) 45%, transparent);
  border-radius: var(--r-badge);
}

/* 1.2 Secondary — Parchment Ticket */
.zd-btn--secondary {
  background: var(--zd-ticket-url) center / 100% 100% no-repeat;
  color: var(--ink-950);
}
.zd-btn--secondary:hover  { color: var(--ink-950); transform: translateY(-1px) rotate(-.5deg); }
.zd-btn--secondary:active { transform: translateY(1px) rotate(0); }

/* 1.3 Tertiary — Ink Thread Link */
.zd-btn--tertiary {
  min-height: var(--tap-min);
  padding: 0 4px;
  color: var(--text-strong);
  background: none;
  font-weight: 700;
  text-decoration: none;
}
.zd-btn--tertiary::after {
  content: "";
  position: absolute; left: 4px; right: 4px; bottom: 8px; height: 8px;
  background: var(--zd-thread-url) left center / 100% 100% no-repeat;
  transform: scaleX(0); transform-origin: left;
  transition: transform 180ms var(--ease-reveal);
}
.zd-btn--tertiary:hover::after, .zd-btn--tertiary:focus-visible::after { transform: scaleX(1); }

/* 1.4 Icon — Keyhole Medallion */
.zd-medallion {
  display: inline-grid;
  place-items: center;
  width: var(--tap-min); height: var(--tap-min);
  border: 0;
  border-radius: var(--r-medallion);
  background: var(--zd-medallion-url) center / 100% 100% no-repeat;
  color: var(--paper-050);
  cursor: pointer;
  position: relative;
  transition: transform var(--d-fast) var(--ease-press);
}
.zd-medallion:hover  { transform: translateY(var(--lift-button)); }
.zd-medallion:active { transform: translateY(1px); }
.zd-medallion .zd-icon { width: 21px; height: 21px; }

/*
 * Skaitliukas — vaškinis antspaudas (UI V4).
 *
 * Buvo auksinė etiketė su tamsiu tekstu; ji atrodė kaip nuolaidos ženkliukas ir
 * konkuravo su medaliono auksu. Antspaudas vyšninis, tad skaičius matomas iš
 * karto ir nesusilieja su rėmu. Skaičių ir toliau rašo PHP — SVG jo neturi.
 */
.zd-count {
  position: absolute; top: -6px; right: -8px;
  width: 28px; height: 24px;
  display: grid; place-items: center;
  background: url(../img/ui/frames/cart-count-seal.svg) center / 100% 100% no-repeat;
  color: var(--paper-050);
  font: 800 11px/1 var(--font-ui);
  font-variant-numeric: tabular-nums;
}

/* 1.5 Add to cart — Long Ticket */
.zd-btn--atc {
  width: 100%;
  max-width: none;
  min-height: 54px;
  background: var(--zd-atc-url) center / 100% 100% no-repeat;
  color: var(--paper-050);
}
.zd-btn--atc:hover { color: var(--paper-050); transform: translateY(var(--lift-button)); filter: brightness(1.06); }
.zd-btn--atc .zd-icon { width: 20px; height: 20px; }
.zd-btn--atc.is-loading { pointer-events: none; }
.zd-btn--atc.is-loading .zd-btn__label { opacity: .45; }
.zd-btn--atc.is-done .zd-icon { transform: rotate(90deg); transition: transform var(--d-ui) var(--ease-press); }

/* ==========================================================================
   2. PRODUKTO KORTELĖ — Display Cabinet
   ========================================================================== */
.zd-card {
  position: relative;
  display: flex;
  flex-direction: column;
  background: var(--paper-050);
  border: var(--bw-ui) solid var(--ink-950);
  border-radius: var(--r-card-a);
  transition: transform var(--d-ui) var(--ease-ui);
}
/* A/B kaita: klasė yra pirminė (veikia ir kai kortelė yra vienintelis
   savo tėvo vaikas, pvz. WooCommerce li.product viduje), :nth-child —
   atsarginė senesniam žymėjimui. */
.zd-card--b,
.zd-card:nth-child(even) { border-radius: var(--r-card-b); }
.zd-card:hover { transform: translateY(var(--lift-card)); }

.zd-card__stage {
  position: relative;
  display: block;          /* <a> pagal nutylėjimą yra inline — be to vitrinos fonas subyra */
  aspect-ratio: 1;
  margin: 8px 8px 0;
  background: var(--zd-vitrine-a-url) center / 100% 100% no-repeat;
  text-decoration: none;
  color: inherit;
}
.zd-card--b .zd-card__stage,
.zd-card:nth-child(even) .zd-card__stage { background-image: var(--zd-vitrine-b-url); }

/*
 * DĖMESIO: čia PLOTIS ir AUKŠTIS, ne `right`/`bottom`.
 *
 * Absoliučiai pozicionuotam PAKEIČIAMAM elementui (img) su `width: auto`
 * naršyklė ima ne rėmelio, o savo TIKRĄJĮ dydį — `right` ir `bottom` tiesiog
 * ignoruojami. Gyvai tai atrodė taip: 600 px nuotrauka išlipdavo iš kortelės,
 * uždengdavo pavadinimą ir kaimynines korteles. Su `auto` tai nepataisoma —
 * reikia aiškių procentų, kurie atitinka tuos pačius kraštus.
 *
 *   15 % + 70 % + 15 % = 100 %      17 % + 59 % + 24 % = 100 %
 */
.zd-card__img {
  position: absolute;
  left: 15%; top: 17%;
  width: 70%; height: 59%;
  object-fit: contain;
  object-position: center bottom;
  border-radius: 50% 50% 5px 5px / 26% 26% 2% 2%;
  transition: transform var(--d-ui) var(--ease-ui);
}
.zd-card:hover .zd-card__img { transform: scale(1.035); }

/* Nekvadratinei nuotraukai — letterbox, kad arka neapkirptų turinio.
   8 % + 84 % + 8 % = 100 %      24 % + 52 % + 24 % = 100 % */
.zd-card__img--wide {
  left: 8%; top: 24%;
  width: 84%; height: 52%;
  border-radius: 10px;
}

.zd-card__body {
  display: flex; flex-direction: column; gap: var(--space-2);
  padding: var(--space-4);
  flex: 1;
}
.zd-card__title {
  font: 700 15px/1.32 var(--font-ui);
  color: var(--text-strong);
  margin: 0;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
}
.zd-card__foot { margin-top: auto; padding-top: var(--space-3); }

/* Sandėlio eilutė — taškas + tekstas, niekada tik spalva */
.zd-stock { display: inline-flex; align-items: center; gap: 7px; font: 600 13px/1.2 var(--font-ui); }
.zd-stock::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: currentColor; flex: none; }
.zd-stock--in   { color: var(--success-600); }
.zd-stock--low  { color: var(--danger-600); }
.zd-stock--out  { color: var(--text-muted); }

/* ==========================================================================
   3. KATEGORIJOS DURYS — Stage Door
   ========================================================================== */
.zd-door {
  display: block;
  text-decoration: none;
  color: var(--text-strong);
  transition: transform var(--d-ui) var(--ease-ui);
}
.zd-door:hover { transform: translateY(var(--lift-card)); color: var(--text-strong); }
.zd-door__frame {
  position: relative;
  aspect-ratio: 620 / 520;
  background: var(--zd-door-url) center / 100% 100% no-repeat;
}
.zd-door__img {
  position: absolute;
  left: 13%; right: 13%; top: 21%; bottom: 24%;
  width: auto; height: auto;
  object-fit: cover;
  border-radius: var(--r-arch);
  box-shadow: 0 0 0 2px var(--zd-accent, var(--accent-1));
}
/*
 * Piešta kategorijos iliustracija.
 *
 * Skiriasi nuo .zd-door__img tuo, kad joje arka jau nupiešta — todėl dedamas
 * nupieštas rėmas (--zd-door-url) išjungiamas ir paveikslėlis užima visą
 * kortelę. Santykis 1:1, kaip ir failai, kad niekas nebūtų apkerpama.
 */
.zd-door__frame--art { aspect-ratio: 1; background: none; }
.zd-door__art {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  border-radius: var(--r-arch);
  box-shadow: 0 0 0 2px var(--zd-accent, var(--accent-1));
}

/* Nėra nuotraukos — firminis fallback, ne atsitiktinio žaislo ikona */
.zd-door__fallback {
  position: absolute; inset: 21% 13% 24%;
  display: grid; place-items: center;
  border-radius: var(--r-arch);
  background: var(--plum-800);
  color: var(--gold-500);
}
.zd-door__fallback .zd-icon { width: 42%; height: auto; }
.zd-door__meta { padding-top: var(--space-3); text-align: center; }
.zd-door__name { font: 650 clamp(1.0625rem,.95rem + .4vw,1.375rem)/1.15 var(--font-display); margin: 0; }
.zd-door__count { font: 600 13px/1.3 var(--font-ui); color: var(--text-muted); }

/* ==========================================================================
   4. BADGE — popierinės etiketės
   ========================================================================== */
.zd-badge {
  display: inline-grid; place-items: center;
  height: 30px;
  padding: 0 12px 2px;
  font: 800 11px/1 var(--font-ui);
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--paper-050);
  background: center / 100% 100% no-repeat;
}
.zd-badge--new     { background-image: var(--zd-badge-new-url); color: var(--paper-050); }
.zd-badge--sale    { background-image: var(--zd-badge-sale-url); }
.zd-badge--popular { background-image: var(--zd-badge-popular-url); color: var(--ink-950); }
.zd-badge--out     { background-image: var(--zd-badge-out-url); color: var(--ink-950); }
.zd-badge--float   { position: absolute; top: 6%; left: 4%; z-index: 2; }

/* ==========================================================================
   5. LAUKAI IR SELECT
   ========================================================================== */
.zd-field { display: flex; flex-direction: column; gap: var(--space-2); }
.zd-field > label { font: 700 var(--fs-ui)/1.2 var(--font-ui); color: var(--text-strong); }

.zd-input, .zd-select, textarea,
input[type="text"], input[type="email"], input[type="tel"],
input[type="number"], input[type="search"], input[type="password"], select {
  min-height: var(--control-h);
  width: 100%;
  padding: 0 var(--space-4);
  border: var(--bw-ui) solid var(--line);
  border-radius: var(--r-field);
  background: var(--paper-050);
  color: var(--text-strong);
  transition: border-color var(--d-fast) var(--ease-ui);
}
textarea { padding: var(--space-3) var(--space-4); min-height: 140px; line-height: var(--lh-body); }
.zd-input::placeholder { color: var(--text-muted); }
.zd-input:focus, select:focus, textarea:focus { border-color: var(--ink-950); }

.zd-select {
  appearance: none;
  background-image: var(--zd-chevron-url);
  background-repeat: no-repeat;
  background-position: right var(--space-4) center;
  background-size: 16px 16px;
  padding-right: calc(var(--space-4) * 2 + 16px);
}

.zd-field.has-error .zd-input,
.zd-field.has-error textarea,
.zd-field.has-error select { border-color: var(--danger-600); border-width: 2px; }
.zd-field__error {
  display: flex; align-items: center; gap: 6px;
  font: 600 13px/1.35 var(--font-ui);
  color: var(--danger-600);
}
.zd-field__error .zd-icon { width: 16px; height: 16px; flex: none; }

/* Kiekio keitiklis — viena forma, ne trys kapsulės */
.zd-qty {
  display: inline-grid;
  grid-template-columns: 48px 48px 48px;
  align-items: center;
  height: 52px;
  background: var(--zd-qty-url) center / 100% 100% no-repeat;
}
.zd-qty button { border: 0; background: none; height: 100%; cursor: pointer; color: var(--text-strong); }
.zd-qty input { border: 0; background: none; text-align: center; min-height: 0; padding: 0; font-weight: 800; }
.zd-qty input:focus { border: 0; }

/* ==========================================================================
   6. DRAWER (mini krepšelis, filtrai) + MODAL
   ========================================================================== */
.zd-drawer {
  position: fixed; inset: 0 0 0 auto;
  width: min(420px, 100vw);
  display: flex; flex-direction: column;
  background: var(--paper-050);
  box-shadow: var(--shadow-drawer);
  z-index: 200;
  transform: translateX(100%);
  transition: transform var(--d-drawer) var(--ease-reveal);
}
.zd-drawer[data-open="true"] { transform: none; }
.zd-drawer__head {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-4);
  background: var(--bg-brand);
  color: var(--paper-050);
}
.zd-drawer__head h2 { margin: 0; font-size: var(--fs-h3); color: var(--paper-050); }
.zd-drawer__body { flex: 1; overflow-y: auto; padding: var(--space-4); }
.zd-drawer__foot { padding: var(--space-4); border-top: var(--bw-ui) solid var(--line); }

.zd-backdrop {
  position: fixed; inset: 0;
  background: var(--backdrop);
  opacity: 0; pointer-events: none;
  z-index: 199;
  transition: opacity var(--d-ui) var(--ease-ui);
}
.zd-backdrop[data-open="true"] { opacity: 1; pointer-events: auto; }

/* Mobile filtrai — bottom sheet */
@media (max-width: 767px) {
  .zd-drawer--filters {
    inset: auto 0 0 0;
    width: 100%;
    max-height: 88vh;
    border-radius: var(--r-panel);
    transform: translateY(100%);
  }
  .zd-drawer--filters[data-open="true"] { transform: none; }
}

/* ==========================================================================
   7. TOAST — scenos lapelis
   ========================================================================== */
.zd-toasts {
  position: fixed; z-index: 400;
  display: flex; flex-direction: column; gap: var(--space-3);
  pointer-events: none;
  top: var(--space-4); right: var(--space-4);
}
@media (max-width: 767px) { .zd-toasts { top: auto; bottom: var(--space-4); left: var(--space-4); right: var(--space-4); } }

.zd-toast {
  display: flex; align-items: center; gap: var(--space-3);
  max-width: 360px;
  padding: var(--space-3) var(--space-4);
  background: var(--paper-050);
  border: var(--bw-ui) solid var(--ink-950);
  border-radius: var(--r-panel);
  font: 600 14px/1.4 var(--font-ui);
  color: var(--text-strong);
  pointer-events: auto;
  animation: zd-toast-in var(--d-ui) var(--ease-reveal);
}
.zd-toast img { width: 40px; height: 40px; object-fit: contain; flex: none; }
.zd-toast--success .zd-icon { color: var(--success-600); }
.zd-toast--error   .zd-icon { color: var(--danger-600); }
.zd-toast.is-out { animation: zd-toast-out var(--d-fast) var(--ease-ui) forwards; }
@keyframes zd-toast-in  { from { opacity: 0; transform: translateY(-10px); } }
@keyframes zd-toast-out { to   { opacity: 0; transform: translateY(-6px); } }

/* ==========================================================================
   8. TRUST juosta
   ========================================================================== */
/*
 * UI V4: keturios tamsios plokštelės su auksiniais medalionais.
 *
 * Buvo balti stačiakampiai su plona linija — pigiausias įmanomas „pasitikėjimo
 * juostos“ variantas, toks pats kaip bet kurioje šablono parduotuvėje. Plokštelė
 * su iškirptu šonu ir medalionu yra tos pačios kalbos dalis kaip kategorijų durys
 * ir hero scena, tad juosta nustoja atrodyti kaip iš kito puslapio atklydusi.
 *
 * Fonas ir rėmas — SVG (trust-badge-backplate.svg), nes iškirpti šonai
 * grynu CSS neišeina; preserveAspectRatio="none" leidžia jam tempti į bet kokį
 * plotį nesudarkant kraštų storio.
 */
.zd-trust {
  list-style: none; margin: 0; padding: 0;
  display: grid; gap: var(--space-3);
  grid-template-columns: 1fr;
}
@media (min-width: 680px)  { .zd-trust { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); } }
@media (min-width: 1180px) { .zd-trust { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.zd-trust__item {
  display: grid;
  grid-template-columns: 66px minmax(0, 1fr);
  align-items: center;
  gap: var(--space-2);
  min-height: 88px;
  padding: 8px 18px 8px 8px;
  background: url(../img/ui/frames/trust-badge-backplate.svg) center / 100% 100% no-repeat;
}
.zd-trust__icon { display: grid; place-items: center; }
.zd-trust__icon img { width: 58px; height: 58px; display: block; }
@media (min-width: 1180px) {
  .zd-trust__item { grid-template-columns: 72px minmax(0, 1fr); padding-right: var(--space-5); }
  .zd-trust__icon img { width: 64px; height: 64px; }
}

.zd-trust__copy { display: grid; gap: 3px; min-width: 0; }
.zd-trust__eyebrow {
  font: 800 10px/1 var(--font-ui);
  letter-spacing: .11em;
  text-transform: uppercase;
  color: var(--gold-300);
}
/*
 * Tekstas ant tamsios plokštelės, nors sekcija šviesi — todėl spalva imama
 * tiesiogiai, o ne iš --text-strong, kuris čia duotų beveik juodą ant juodo.
 */
.zd-trust__title {
  font: 700 14px/1.25 var(--font-ui);
  color: var(--paper-050);
}

/* Ornamentinis skirtukas virš juostos, šviesiame plote. */
.zd-section--trust { padding-top: var(--space-6); }
.zd-trust-divider {
  height: 18px;
  margin-bottom: var(--space-6);
  background: url(../img/decorative/dividers/trust-strip-divider.svg) center / 100% 18px no-repeat;
}

/* ==========================================================================
   9. Nemokamo pristatymo progresas — auksinis siūlas
   ========================================================================== */
.zd-ship { margin-bottom: var(--space-4); }
.zd-ship__label { font: 700 13px/1.3 var(--font-ui); color: var(--text-strong); margin: 0 0 6px; }
.zd-ship__track { height: 6px; border-radius: 999px; background: var(--paper-200); overflow: hidden; }
.zd-ship__bar {
  height: 100%; width: 0;
  background: linear-gradient(90deg, var(--gold-700), var(--gold-300));
  transition: width var(--d-reveal) var(--ease-reveal);
}
.zd-ship.is-done .zd-ship__bar { background: var(--success-600); }

/* ==========================================================================
   10. Chip'ai / filtrai
   ========================================================================== */
.zd-chip {
  display: inline-flex; align-items: center; gap: 6px;
  min-height: 40px;
  padding: 0 var(--space-3);
  border: var(--bw-ui) solid var(--line);
  border-radius: var(--r-chip);
  background: var(--paper-050);
  font: 700 13px/1 var(--font-ui);
  color: var(--text-strong);
  cursor: pointer;
}
.zd-chip[aria-pressed="true"] { background: var(--ink-900); color: var(--paper-050); border-color: var(--ink-950); }
.zd-chip[aria-pressed="true"]::after { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--gold-500); }

/* ==========================================================================
   11. Būsenų ekranai
   ========================================================================== */
.zd-state { text-align: center; max-width: 62ch; margin-inline: auto; padding-block: var(--space-16); }
.zd-state__scene { max-width: 460px; margin: 0 auto var(--space-6); }
.zd-state__scene img { width: 100%; height: auto; }

/*
 * Būsenos iliustracija (zd_scene()).
 *
 * Paveikslėliai tamsūs, o puslapis šviesus, tad be užapvalinimo jie atrodo kaip
 * įklijuotas stačiakampis. Arkos forma ta pati, kaip kategorijų duryse ir hero
 * scenoje — tai vienintelis dalykas, kuris visą šitą rinkinį laiko kartu.
 */
.zd-scene {
  display: block;
  width: 100%;
  height: auto;
  margin-inline: auto;
  border-radius: var(--r-arch);
  box-shadow: 0 10px 30px rgba(21, 22, 34, .18);
}
.zd-state h1 { margin-bottom: var(--space-3); }
.zd-state__actions { display: flex; flex-direction: column; align-items: center; gap: var(--space-3); margin-top: var(--space-6); }

/* Idle judesys tik viewport'e, 7–9 s, labai subtiliai */
.zd-state__scene[data-zd-idle] { animation: zd-idle var(--d-idle) var(--ease-swing) infinite; }
@keyframes zd-idle { 0%, 88%, 100% { transform: none; } 94% { transform: translateY(-6px) rotate(-.6deg); } }

/* ==========================================================================
   12. Sticky add-to-cart (mobile PDP)
   ========================================================================== */
.zd-sticky-atc {
  position: fixed; left: 0; right: 0; bottom: 0;
  display: none; align-items: center; gap: var(--space-3);
  padding: var(--space-3) var(--gutter-mobile);
  padding-bottom: calc(var(--space-3) + env(safe-area-inset-bottom));
  background: var(--paper-050);
  border-top: var(--bw-ui) solid var(--line);
  z-index: 100;
  transform: translateY(110%);
  transition: transform var(--d-drawer) var(--ease-reveal);
}
.zd-sticky-atc[data-visible="true"] { transform: none; }
.zd-sticky-atc .zd-btn { flex: 1; }
@media (max-width: 767px) { body.single-product .zd-sticky-atc { display: flex; } }

/* ==========================================================================
   13. Ikonos
   ========================================================================== */
.zd-icon { display: inline-block; width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 2; }

/* ==========================================================================
   14. Skeleton
   ========================================================================== */
.zd-skeleton { background: var(--paper-100); border-radius: var(--r-field); position: relative; overflow: hidden; }
.zd-skeleton::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent, var(--paper-050), transparent);
  transform: translateX(-100%);
  animation: zd-shimmer 1.4s var(--ease-ui) infinite;
}
@keyframes zd-shimmer { to { transform: translateX(100%); } }

/* ==========================================================================
   15. Print — teatro dekoro nepaveldi (sąskaitos, užsakymai)
   ========================================================================== */
@media print {
  .zd-grain, .zd-toasts, .zd-drawer, .zd-backdrop, .zd-sticky-atc,
  .zd-divider, [aria-hidden="true"] { display: none !important; }
  body { background: #fff; color: #000; font-family: var(--font-ui); }
  .zd-btn, .zd-medallion { background: none !important; border: 1px solid #000; color: #000 !important; }
  .zd-ink { background: #fff !important; color: #000 !important; }
  a::after { content: " (" attr(href) ")"; font-size: 11px; }
}