/* ==========================================================================
   TILTO — krepšelis, apmokėjimas, paskyra

   Šablonų neperrašinėjam: WooCommerce savo markup'ą keičia su kiekviena
   versija, ir perrašyti šablonai lūžta tyliai. Stilizuojam tai, ką jis
   pats išveda.
   ========================================================================== */

.woocommerce-cart .t-page,
.woocommerce-checkout .t-page,
.woocommerce-account .t-page { padding-block: var(--t-s6) var(--t-s8); }

/* --- pranešimai -------------------------------------------------------------- */

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--t-s3);
  margin: 0 0 var(--t-s5);
  padding: var(--t-s4);
  border: 1px solid var(--t-line);
  border-inline-start: 3px solid var(--t-ink);
  background: var(--t-surface);
  list-style: none;
  font-size: var(--t-fs-sm);
}

.woocommerce-message { border-inline-start-color: var(--t-ok); }
.woocommerce-info    { border-inline-start-color: var(--t-navy); }
.woocommerce-error   { border-inline-start-color: var(--t-bad); }

.woocommerce-message .button,
.woocommerce-info .button { margin-inline-start: auto; }

/* --- krepšelio lentelė ------------------------------------------------------- */

.woocommerce-cart-form { margin-bottom: var(--t-s6); }

.shop_table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--t-fs-sm);
  background: var(--t-surface);
  border: 1px solid var(--t-line);
}

.shop_table th {
  text-align: left;
  padding: var(--t-s3) var(--t-s4);
  border-bottom: 1px solid var(--t-line);
  background: var(--t-paper);
  font-family: var(--t-font-ui);
  font-size: var(--t-fs-tag);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--t-ls-label);
  color: var(--t-ink-soft);
}

.shop_table td {
  padding: var(--t-s4);
  border-bottom: 1px solid var(--t-line);
  vertical-align: middle;
}

/* `table-layout: fixed` yra būtinas: automatiniame režime naršyklė laisvą
   plotį dalija proporcingai ir pirmas stulpelis (šalinimo mygtukas) išsipučia
   per pusę lentelės, nors jam nurodyti 56px. Fiksuotame režime pločiai imami
   iš pirmos eilutės, o likutį atiduoda pavadinimo stulpeliui. */
.woocommerce-cart-form .shop_table { table-layout: fixed; }

/* Pločiai procentais, ne pikseliais: fiksuoti px sudaro lentelei minimalų
   plotį, kurio ji negali sumažinti, ir tada visas tinklelis išsipučia už
   ekrano ribų. Procentai visada telpa į turimą stulpelį. */
.woocommerce-cart-form .shop_table .product-remove { width: 6%; text-align: center; padding-inline: var(--t-s2); }
.woocommerce-cart-form .shop_table .product-thumbnail { width: 10%; }
.woocommerce-cart-form .shop_table .product-price { width: 17%; }
.woocommerce-cart-form .shop_table .product-quantity { width: 12%; }
.woocommerce-cart-form .shop_table .product-subtotal { width: 16%; text-align: right; }
.woocommerce-cart-form .shop_table th.product-subtotal { text-align: right; }

/* Ilgi pavadinimai fiksuotoje lentelėje turi laužtis, o ne išeiti už krašto. */
.woocommerce-cart-form .shop_table .product-name { overflow-wrap: anywhere; }

.shop_table .product-thumbnail img {
  display: block;
  width: 72px;
  height: 90px;
  object-fit: contain;
  background: #fff;
  border: 1px solid var(--t-line);
}

.shop_table .product-name a,
.shop_table .product-name a:visited { color: var(--t-ink); font-family: var(--t-font-ui); font-weight: 600; }
.shop_table .product-name a:hover { color: var(--t-signal); }

/* Variacijos duomenys — spalva, dydis, kiekio nuolaida. */
.shop_table .variation {
  margin: var(--t-s2) 0 0;
  font-size: var(--t-fs-xs);
  color: var(--t-ink-soft);
}

.shop_table .variation dt { float: left; margin-inline-end: 4px; font-weight: 400; }
.shop_table .variation dd { margin: 0 0 2px; }

.shop_table .product-price,
.shop_table .product-subtotal,
.shop_table .product-total { font-variant-numeric: tabular-nums; white-space: nowrap; }

.shop_table .product-subtotal,
.shop_table .product-total { font-family: var(--t-font-ui); font-weight: 700; }

.shop_table del { color: var(--t-ink-soft); font-weight: 400; }
.shop_table ins { text-decoration: none; }

.shop_table .product-remove a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border: 1px solid var(--t-line);
  border-radius: var(--t-radius);
  color: var(--t-ink-soft);
  font-size: 16px;
  line-height: 1;
  text-decoration: none;
}

.shop_table .product-remove a:hover { border-color: var(--t-bad); color: var(--t-bad); }

/* Kiekio laukas */
.quantity input[type="number"] {
  width: 72px;
  height: 40px;
  padding: 0 var(--t-s2);
  border: 1px solid var(--t-line-strong);
  border-radius: var(--t-radius);
  background: var(--t-surface);
  color: var(--t-ink);
  font: inherit;
  font-family: var(--t-font-ui);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  text-align: center;
}

/* Krepšelio kiekio laukas — rėmelį nuimam tik pelės fokusui. */
.quantity input[type="number"]:focus { border-color: var(--t-ink); }
.quantity input[type="number"]:focus:not(:focus-visible) { outline: none; }

/* Kuponas ir atnaujinimas */
.shop_table .actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--t-s3);
  align-items: center;
  padding: var(--t-s4);
}

.coupon { display: flex; gap: var(--t-s2); flex: 1 1 auto; max-width: 520px; }

.coupon input[type="text"] {
  /* `flex: 1` be `min-width` susitraukia iki naršyklės numatytojo `size`
     atributo — laukelis lieka vos 140px. */
  flex: 1 1 auto;
  min-width: 220px;
  width: 100%;
  height: var(--t-control-h);
  padding-inline: var(--t-s4);
  border: 1px solid var(--t-line-strong);
  border-radius: var(--t-radius);
  background: var(--t-surface);
  font: inherit;
  font-size: var(--t-fs-sm);
}

/* Mygtukų tekstas neturi laužtis į dvi eilutes. */
.shop_table .actions .button,
.shop_table .actions button { white-space: nowrap; flex: none; }

/* „Atnaujinti krepšelį“ — dešinėje, atskirtas nuo kupono. */
.shop_table .actions button[name="update_cart"] { margin-inline-start: auto; }

/* --- WooCommerce mygtukai temos stiliumi -------------------------------------- */

.woocommerce .button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button,
.woocommerce #respond input#submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: var(--t-control-h);
  padding-inline: var(--t-s5);
  border: 1px solid var(--t-ink);
  border-radius: var(--t-radius);
  background: var(--t-ink);
  color: #fff;
  font-family: var(--t-font-ui);
  font-size: var(--t-fs-sm);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
  line-height: 1;
  cursor: pointer;
  transition: background-color var(--t-fast) var(--t-ease), border-color var(--t-fast) var(--t-ease);
}

.woocommerce .button:hover,
.woocommerce button.button:hover,
.woocommerce a.button:hover { background: var(--t-navy); border-color: var(--t-navy); color: #fff; }

.woocommerce .button:disabled,
.woocommerce .button.disabled { opacity: .45; cursor: not-allowed; }

/* Pagrindiniai veiksmai — signalinė spalva.
   Selektoriai su žymos vardu tyčia: WooCommerce savo violetinį `a.button.alt`
   aprašo tokia pat specifika, ir be žymos laimėtų vėliau įkeltas jo CSS. */
.woocommerce a.checkout-button,
.woocommerce a.checkout-button.button,
.woocommerce button#place_order,
.woocommerce input#place_order,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: auto;
  min-height: var(--t-control-h);
  padding: var(--t-s3) var(--t-s5);
  /* Pagrindiniai WooCommerce CTA su baltu tekstu — tamsintas fonas dėl 4,5:1. */
  background: var(--t-signal-dark);
  border-color: var(--t-signal-dark);
  color: #fff;
  line-height: var(--t-lh-snug);
  text-align: center;
  /* Siaurame blokelyje ilgas žodis turi laužtis, o ne išeiti už mygtuko. */
  white-space: normal;
  overflow-wrap: anywhere;
  letter-spacing: .02em;
}

.woocommerce a.checkout-button:hover,
.woocommerce button#place_order:hover,
.woocommerce input#place_order:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover {
  /* Bazė jau tamsinta, todėl hover'ui reikia dar vienos pakopos — kitaip
     būsenos pokytis būtų nematomas. */
  background: var(--t-signal-deep);
  border-color: var(--t-signal-deep);
  color: #fff;
}

/* Sumų blokelio mygtukas — per visą plotį po lentele. */
.cart_totals .wc-proceed-to-checkout { margin-top: var(--t-s4); padding: 0; }

/* Antraeiliai — kontūriniai. */
.woocommerce button[name="update_cart"],
.woocommerce .coupon .button {
  background: transparent;
  border-color: var(--t-line-strong);
  color: var(--t-ink);
}

.woocommerce button[name="update_cart"]:hover,
.woocommerce .coupon .button:hover {
  background: transparent;
  border-color: var(--t-ink);
  color: var(--t-ink);
}

/* --- sumos ------------------------------------------------------------------- */

.cart-collaterals { display: grid; gap: var(--t-s6); align-content: start; }

/* WooCommerce savo konteineriams prikabina clearfix'ą
   (`content: " "; display: table`). Float'ų laikais tai buvo nekalta, bet
   tinklelyje tie pseudoelementai tampa pilnaverčiais elementais: užima
   langelius, stumia sumų blokelį į netinkamą stulpelį ir prideda tarpų.
   Grid ir flex clearfix'o nereikia — išjungiam. */
.woocommerce-cart .t-page .woocommerce::before,
.woocommerce-cart .t-page .woocommerce::after,
.woocommerce-cart .cart-collaterals::before,
.woocommerce-cart .cart-collaterals::after,
.woocommerce-cart .woocommerce-cart-form::before,
.woocommerce-cart .woocommerce-cart-form::after { content: none; display: none; }

/* Lentelė kairėje, sumos dešinėje ir „lipnios“ — ilgame krepšelyje mygtukas
   „Apmokėti“ neturi nuslinkti kažkur žemyn už ekrano ribų. Vietas nurodom
   tiksliai, nes tarp elementų dar būna WooCommerce pranešimų blokas. */
@media (min-width: 1000px) {
  .woocommerce-cart .t-page .woocommerce {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    column-gap: var(--t-s6);
    row-gap: var(--t-s5);
    align-items: start;
  }

  /* Visos taisyklės vienodos specifikos. Anksčiau konkrečios buvo silpnesnės
     už `> *`, todėl lentelė ir sumos atsidurdavo tame pačiame langelyje. */
  .woocommerce-cart .t-page .woocommerce > * { grid-column: 1 / -1; }

  .woocommerce-cart .t-page .woocommerce > .woocommerce-cart-form {
    grid-column: 1;
    grid-row: 2;
    margin-bottom: 0;
  }

  .woocommerce-cart .t-page .woocommerce > .cart-collaterals {
    grid-column: 2;
    grid-row: 2;
    /* Be `min-width: 0` tinklelio elementas plečiasi iki savo turinio
       minimalaus pločio ir išlipa už stulpelio — sumų lentelė su nedalomomis
       kainomis kaip tik toks atvejis. */
    min-width: 0;
    /* `stretch` (numatytasis) tyčia: dėžutė turi būti tokio pat aukščio kaip
       krepšelio lentelė — tada ji tampa riba viduje esančiam `sticky`. */
    align-self: stretch;
  }

  /* Slenka `.cart_totals`, o ne visas `.cart-collaterals`. Tinklelio elemento
     `sticky` riba naršyklėse elgiasi nenuspėjamai ir blokelis nuslysdavo iki
     puslapio apačios ant kitų sekcijų. Vidinis elementas ribojamas savo tėvo,
     todėl sustoja tiksliai ties lentelės apačia. */
  .woocommerce-cart .t-page .woocommerce > .cart-collaterals > .cart_totals {
    position: sticky;
    top: calc(var(--t-header-h, 72px) + var(--t-s4));
  }

  .woocommerce-cart .t-page .woocommerce > .t-cart-extra { grid-row: 3; }

  /* Kuponas ir „atnaujinti“ siauresnėje lentelėje turi tilpti į vieną eilutę. */
  .woocommerce-cart .shop_table td.actions { flex-wrap: nowrap; }
  .woocommerce-cart .coupon { max-width: none; }
}

.cart_totals h2,
.woocommerce-checkout-review-order h3,
#order_review_heading {
  font-size: var(--t-fs-h3);
  text-transform: uppercase;
  margin-bottom: var(--t-s4);
}

.cart_totals table,
.woocommerce-checkout-review-order-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--t-surface);
  border: 1px solid var(--t-line);
  font-size: var(--t-fs-sm);
}

.cart_totals th,
.cart_totals td,
.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
  padding: var(--t-s3) var(--t-s4);
  border-bottom: 1px solid var(--t-line);
  text-align: left;
  font-variant-numeric: tabular-nums;
}

.cart_totals td,
.woocommerce-checkout-review-order-table td { text-align: right; }

.cart_totals th,
.woocommerce-checkout-review-order-table th { color: var(--t-ink-soft); font-weight: 400; }

/* Prekės pavadinimas — kairėje, kaip ir dera sąrašui. */
.woocommerce-checkout-review-order-table th.product-name,
.woocommerce-checkout-review-order-table td.product-name {
  text-align: left;
  color: var(--t-ink);
  font-family: var(--t-font-ui);
  font-weight: 600;
}

/* Variacijų duomenys: WooCommerce `dt` plukdo į kairę, todėl „Kiekio
   nuolaida:“ atsiduria lentelės krašte, o reikšmė — visai kitoje pusėje. */
.woocommerce-checkout-review-order-table .variation {
  margin: 4px 0 0;
  font-family: var(--t-font-body);
  font-size: var(--t-fs-xs);
  font-weight: 400;
  color: var(--t-ink-soft);
}

.woocommerce-checkout-review-order-table .variation dt,
.woocommerce-checkout-review-order-table .variation dd {
  float: none;
  display: inline;
  margin: 0;
}

.woocommerce-checkout-review-order-table .variation dd::after {
  content: "";
  display: block;
}

.woocommerce-checkout-review-order-table .product-quantity {
  font-weight: 700;
  white-space: nowrap;
}

.cart_totals .order-total th,
.cart_totals .order-total td,
.woocommerce-checkout-review-order-table .order-total th,
.woocommerce-checkout-review-order-table .order-total td {
  font-family: var(--t-font-ui);
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--t-ink);
  border-bottom: 0;
}

.wc-proceed-to-checkout { margin-top: var(--t-s4); }
.wc-proceed-to-checkout .checkout-button { width: 100%; }

/* --- apmokėjimas -------------------------------------------------------------- */

/* WooCommerce `.col-1`/`.col-2` yra float'ai su `width: 48%`. Kai pristatymo
   adreso blokas išjungtas, lieka vienas stulpelis, o 48 % paverčia formą
   siaura juosta puslapio viduryje. Nuimam ir float'ą, ir plotį. */
.woocommerce-checkout .col2-set { display: grid; gap: var(--t-s6); }
.woocommerce-checkout .col2-set::before,
.woocommerce-checkout .col2-set::after,
.woocommerce-checkout form.checkout::before,
.woocommerce-checkout form.checkout::after { content: none; display: none; }

.woocommerce-checkout .col2-set .col-1,
.woocommerce-checkout .col2-set .col-2 { float: none; width: 100%; }

/* Vienas stulpelis, nors WooCommerce blokus vadina „col-1“ ir „col-2“.
   Šalia adreso laukų „Papildoma informacija“ atrodė kaip antra, lygiavertė
   forma, nors joje yra vienas nebūtinas pastabų laukelis — ir dėl to
   dešinė puslapio pusė likdavo tuščia per visą ekraną. Dabar pastabos
   guli po adresu, kaip paskutinis, mažiausiai svarbus žingsnis. */
.woocommerce-checkout .col2-set .col-2 { margin-top: var(--t-s2); }

.woocommerce-checkout .col2-set .col-2 h3 {
  font-size: var(--t-fs-h3);
  text-transform: uppercase;
  letter-spacing: var(--t-ls-display);
  margin-bottom: var(--t-s4);
}

/* Duomenys kairėje, užsakymo suvestinė dešinėje. Vietas nurodom tiksliai —
   auto-išdėstymas su WooCommerce pranešimų blokais nenuspėjamas. */
@media (min-width: 1000px) {
  .woocommerce-checkout form.checkout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 380px;
    column-gap: var(--t-s6);
    row-gap: var(--t-s5);
    align-items: start;
  }

  .woocommerce-checkout form.checkout > * { grid-column: 1; }

  .woocommerce-checkout form.checkout > #customer_details {
    grid-column: 1;
    grid-row: 1 / span 2;
  }

  .woocommerce-checkout form.checkout > #order_review_heading {
    grid-column: 2;
    grid-row: 1;
    margin-top: 0;
  }

  .woocommerce-checkout form.checkout > #order_review {
    grid-column: 2;
    grid-row: 2;
    min-width: 0;
    align-self: start;
  }
}

.woocommerce-checkout h3 {
  font-size: var(--t-fs-h3);
  text-transform: uppercase;
  margin-bottom: var(--t-s4);
}

.woocommerce form .form-row {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0 0 var(--t-s4);
  padding: 0;
}

.woocommerce form .form-row label {
  font-family: var(--t-font-ui);
  font-size: var(--t-fs-xs);
  font-weight: 600;
  color: var(--t-ink-soft);
}

.woocommerce form .form-row .required { color: var(--t-signal); text-decoration: none; }

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.select2-container .select2-selection--single {
  width: 100%;
  height: var(--t-control-h);
  padding: 0 var(--t-s4);
  border: 1px solid var(--t-line-strong);
  border-radius: var(--t-radius);
  background: var(--t-surface);
  color: var(--t-ink);
  font: inherit;
  font-size: var(--t-fs-sm);
}

/* Pastabų laukas turi atrodyti kaip tos pačios formos dalis, o ne kaip
   svetimas elementas: WooCommerce jam prideda savo `rows` ir inline
   aukštį, o naršyklė — savo šriftą ir rėmelį. Kartojam tas pačias
   reikšmes, ką ir įprastiems laukams, tik su didesniu aukščiu. */
.woocommerce form .form-row textarea,
.woocommerce-checkout textarea#order_comments {
  height: auto;
  min-height: 120px;
  padding: var(--t-s3) var(--t-s4);
  border: 1px solid var(--t-line-strong);
  border-radius: var(--t-radius);
  background: var(--t-surface);
  color: var(--t-ink);
  font-family: var(--t-font-body);
  font-size: var(--t-fs-sm);
  line-height: var(--t-lh-base);
  resize: vertical;
  /* Be šito naršyklė textarea laiko `inline` elementu ir po juo palieka
     kelių pikselių tarpą, dėl kurio laukas atrodo nelygiuotas su kitais. */
  display: block;
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
/* Užsakymo forma — ilgiausias klaviatūros kelias visoje temoje, todėl
   `:focus-visible` rėmelis čia būtinas. */
.woocommerce form .form-row select:focus { border-color: var(--t-ink); }
.woocommerce form .form-row select:focus:not(:focus-visible) { outline: none; }

.woocommerce form .form-row.woocommerce-invalid input.input-text { border-color: var(--t-bad); }

/* Select2 (šalies pasirinkimas) — kad neatrodytų iš kito pasaulio. */
.select2-container .select2-selection--single {
  display: flex;
  align-items: center;
}

.select2-container--default .select2-selection--single .select2-selection__arrow { height: 100%; }
.select2-dropdown { border-color: var(--t-line-strong); border-radius: var(--t-radius); }

/* Apmokėjimo būdai */
.woocommerce-checkout #payment {
  background: var(--t-surface);
  border: 1px solid var(--t-line);
  padding: var(--t-s5);
  margin-top: var(--t-s4);
}

.woocommerce-checkout #payment ul.payment_methods {
  list-style: none;
  margin: 0 0 var(--t-s4);
  padding: 0;
  border-bottom: 1px solid var(--t-line);
}

.woocommerce-checkout #payment ul.payment_methods li { padding-block: var(--t-s3); }

.woocommerce-checkout #payment div.payment_box {
  margin-top: var(--t-s2);
  padding: var(--t-s3);
  background: var(--t-paper);
  font-size: var(--t-fs-xs);
  color: var(--t-ink-soft);
}

.woocommerce-checkout #payment .place-order { margin: 0; }
.woocommerce-checkout #place_order { width: 100%; height: 52px; }

/* --- tuščias krepšelis --------------------------------------------------------- */

.cart-empty {
  font-family: var(--t-font-ui);
  font-size: var(--t-fs-h3);
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: var(--t-s4);
}

.return-to-shop { margin-top: var(--t-s4); }

/* --- paskyra -------------------------------------------------------------------- */

.woocommerce-MyAccount-navigation ul {
  list-style: none;
  margin: 0 0 var(--t-s5);
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--t-s2);
}

.woocommerce-MyAccount-navigation a {
  display: inline-flex;
  align-items: center;
  height: 38px;
  padding-inline: var(--t-s4);
  border: 1px solid var(--t-line);
  border-radius: var(--t-radius);
  background: var(--t-surface);
  font-size: var(--t-fs-sm);
  color: var(--t-ink);
}

.woocommerce-MyAccount-navigation .is-active a {
  background: var(--t-ink);
  border-color: var(--t-ink);
  color: #fff;
}

/* --- mobile: lentelė virsta kortelėmis ------------------------------------------- */

@media (max-width: 720px) {
  .woocommerce-cart-form .shop_table thead { display: none; }

  .woocommerce-cart-form .shop_table,
  .woocommerce-cart-form .shop_table tbody,
  .woocommerce-cart-form .shop_table tr,
  .woocommerce-cart-form .shop_table td { display: block; width: 100%; }

  .woocommerce-cart-form .shop_table tr {
    position: relative;
    border-bottom: 1px solid var(--t-line);
    padding: var(--t-s4);
  }

  .woocommerce-cart-form .shop_table td {
    border: 0;
    padding: 2px 0;
    text-align: left !important;
  }

  .woocommerce-cart-form .shop_table td::before {
    content: attr(data-title) ": ";
    font-size: var(--t-fs-xs);
    color: var(--t-ink-soft);
  }

  .woocommerce-cart-form .shop_table td.product-thumbnail::before,
  .woocommerce-cart-form .shop_table td.product-remove::before { content: none; }

  .woocommerce-cart-form .shop_table td.product-remove {
    position: absolute;
    top: var(--t-s3);
    inset-inline-end: var(--t-s3);
    width: auto;
  }

  .shop_table .actions { flex-direction: column; align-items: stretch; }
  .coupon { max-width: none; }
}

/* --- sutaupymas ir nuolaidos užuomina ---------------------------------------- */

.t-cart-savings th { color: var(--t-ok); }
.t-cart-savings td { color: var(--t-ok); font-family: var(--t-font-ui); font-weight: 700; }
.t-cart-savings__pct { font-weight: 400; font-size: var(--t-fs-xs); }

/* Užuomina apie kitą pakopą — vienintelė vieta, kur pirkėjas dar gali
   apsigalvoti ir užsakyti daugiau pigiau. */
.t-cart-nudge {
  margin: 0 0 var(--t-s4);
  padding: var(--t-s3) var(--t-s4);
  background: var(--t-paper);
  border-inline-start: 3px solid var(--t-signal);
  font-size: var(--t-fs-sm);
}

.t-cart-nudge strong { font-family: var(--t-font-ui); }

/* --- po krepšeliu ------------------------------------------------------------ */

.t-cart-extra {
  display: grid;
  gap: var(--t-s6);
  margin-top: var(--t-s8);
  padding-top: var(--t-s7);
  border-top: 1px solid var(--t-line);
}

@media (min-width: 900px) {
  .t-cart-extra { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .t-cart-steps { grid-column: 1 / -1; }
}

.t-cart-extra__title {
  font-size: var(--t-fs-h3);
  text-transform: uppercase;
  letter-spacing: .02em;
  margin-bottom: var(--t-s4);
}

.t-cart-steps .t-steps {
  display: grid;
  gap: var(--t-s4);
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  list-style: none;
  margin: 0;
  padding: 0;
  counter-reset: none;
}

.t-cart-steps .t-steps__item {
  padding: var(--t-s4);
  background: var(--t-surface);
  border: 1px solid var(--t-line);
}

.t-cart-steps .t-steps__num {
  display: block;
  font-family: var(--t-font-ui);
  font-size: var(--t-fs-tag);
  font-weight: 700;
  letter-spacing: var(--t-ls-label);
  color: var(--t-signal);
  margin-bottom: var(--t-s2);
}

.t-cart-steps .t-steps__item h3 {
  font-size: var(--t-fs-base);
  text-transform: none;
  margin-bottom: 4px;
}

.t-cart-steps .t-steps__item p {
  margin: 0;
  color: var(--t-ink-soft);
  font-size: var(--t-fs-sm);
  line-height: var(--t-lh-base);
}

/* Akordeonas persikėlė į `components.css`: tokių pačių blokų reikia ir
   produkto puslapyje, o `shop.css` ten nekraunamas. */

.t-cart-help {
  padding: var(--t-s5);
  background: var(--t-paper);
  border: 1px solid var(--t-line);
}

.t-cart-help p { color: var(--t-ink-soft); font-size: var(--t-fs-sm); line-height: var(--t-lh-base); }

.t-cart-help__contact {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--t-s3);
  margin-top: var(--t-s4);
}

.t-cart-help__contact a {
  font-family: var(--t-font-ui);
  font-size: var(--t-fs-base);
  font-weight: 700;
  color: var(--t-ink);
}

.t-cart-help__contact a:hover { color: var(--t-signal); }
.t-cart-help__contact span { font-size: var(--t-fs-xs); }

.t-cart-help__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--t-s3);
  margin-top: var(--t-s5);
}

/* --- tuščias krepšelis -------------------------------------------------------- */

.t-cart-empty {
  padding: var(--t-s8) var(--t-s5);
  text-align: center;
  background: var(--t-surface);
  border: 1px solid var(--t-line);
}

.t-cart-empty h2 { font-size: var(--t-fs-h2); text-transform: uppercase; }

.t-cart-empty p {
  max-width: 46ch;
  margin: var(--t-s3) auto var(--t-s5);
  color: var(--t-ink-soft);
}

/* WooCommerce savo tuščio krepšelio tekstą slepiam — turim savo. */
.woocommerce-cart .cart-empty,
.woocommerce-cart .return-to-shop { display: none; }

/* --- krepšelio lentelės smulkmenos ------------------------------------------- */

/* Antraštės eilutė turi būti vienoje linijoje su turiniu. */
.woocommerce-cart-form .shop_table th.product-name { padding-inline-start: var(--t-s4); }

.woocommerce-cart-form .shop_table tr:last-child td { border-bottom: none; }

/* Kuponas ir „atnaujinti“ — atskirta juosta lentelės apačioje. */
.woocommerce-cart-form .shop_table td.actions {
  padding: var(--t-s4);
  background: var(--t-paper);
  border-top: 1px solid var(--t-line);
}

/* WooCommerce sumų blokelį vis dar plukdo į dešinę ir riboja 48 % pločio
   (`.woocommerce .cart-collaterals .cart_totals`). Tinklelyje float'as nieko
   nedaro, bet 48 % lieka — iš to ir susispaudęs blokelis. Perrašom tokios
   pat specifikos selektoriumi. */
.woocommerce .cart-collaterals .cart_totals,
.woocommerce-page .cart-collaterals .cart_totals,
.woocommerce .cart-collaterals .cross-sells,
.woocommerce-page .cart-collaterals .cross-sells {
  float: none;
  width: 100%;
}

/* Sumų blokelis */
.cart_totals {
  background: var(--t-surface);
  border: 1px solid var(--t-line);
  padding: var(--t-s5);
}

/* Sumų eilutės — ne lentelė, o flex. Dviejų stulpelių lentelėje ilgas
   žodis „SUTAUPOTE“ ir nedaloma suma nuolat kovoja dėl pločio: arba antraštė
   lipa ant sumos, arba „€“ nukrenta į kitą eilutę. Flex tokios problemos
   neturi — antraštė užima tiek, kiek reikia, suma prisiglaudžia dešinėje. */
.cart_totals table,
.cart_totals tbody,
.cart_totals tr,
.cart_totals th,
.cart_totals td { display: block; border: none; }

.cart_totals tr {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--t-s3);
  padding-block: var(--t-s3);
  border-bottom: 1px solid var(--t-line);
}

.cart_totals th {
  flex: 0 1 auto;
  padding: 0;
  background: none;
  white-space: nowrap;
}

.cart_totals td {
  flex: 1 1 auto;
  padding: 0;
  text-align: right;
  overflow-wrap: anywhere;
}
.cart_totals tr:last-child { border-bottom: none; padding-bottom: 0; }

.cart_totals .order-total th,
.cart_totals .order-total td {
  font-size: var(--t-fs-base);
  font-family: var(--t-font-ui);
  font-weight: 700;
  text-transform: uppercase;
}

/* Suma su PVM — po sumomis, kad nekiltų klausimų prie apmokėjimo. */
.cart_totals::after {
  content: "Kainos nurodytos su PVM.";
  display: block;
  margin-top: var(--t-s3);
  color: var(--t-ink-soft);
  font-size: var(--t-fs-xs);
}

/* --- paskyros puslapis: antraštė, skirtukai, pranešimai ---------------------- */

/* Antraštė buvo prilipusi prie meniu — paskyros puslapyje virš jos nėra
   nei breadcrumb'ų, nei jokio kito tarpiklio. */
.woocommerce-account .t-page { padding-block: var(--t-s7) var(--t-s8); }
.woocommerce-account .t-section__head { margin-bottom: var(--t-s6); }

/* Skirtukai — viena eilutė su horizontaliu slinkimu, o ne kelios eilės
   mygtukų. Prie septynių punktų dviem eilėmis jie atrodė kaip klaviatūra. */
.woocommerce-MyAccount-navigation ul {
  flex-wrap: nowrap;
  overflow-x: auto;
  gap: 0;
  border-bottom: 1px solid var(--t-line);
  scrollbar-width: thin;
}

.woocommerce-MyAccount-navigation li { flex: none; }

.woocommerce-MyAccount-navigation a {
  height: 44px;
  border: none;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  background: transparent;
  font-family: var(--t-font-ui);
  font-weight: 600;
  white-space: nowrap;
  color: var(--t-ink-soft);
}

.woocommerce-MyAccount-navigation a:hover { color: var(--t-ink); }

.woocommerce-MyAccount-navigation .is-active a {
  background: transparent;
  color: var(--t-ink);
  border-bottom-color: var(--t-signal);
}

/* WooCommerce ant `.woocommerce` kabina seną clearfix'ą
   (`::before`/`::after` su `display: table`). Kol konteineris buvo blokas,
   jis nieko nedarė — bet gardelėje kiekvienas pseudoelementas tampa
   PILNAVERČIU gardelės nariu: `::before` užima pirmą 220 px langelį,
   meniu nustumiamas į turinio stulpelį, o turinys — į trečią eilę.
   Tas pats buvo nutikę ir krepšelio puslapyje. */
.woocommerce-account .woocommerce::before,
.woocommerce-account .woocommerce::after {
  content: none !important;
  display: none !important;
}

@media (min-width: 900px) {
  /* Plačiame ekrane turinys ir meniu greta — taip nereikia slinkti.
     Gardelė taikoma TIK tam `.woocommerce`, kuris iš tikrųjų turi meniu:
     paskyros puslapyje WooCommerce išveda du įdėtus `.woocommerce`
     konteinerius, ir uždėjus gardelę abiem, išorinis su vieninteliu vaiku
     jį įgrūsdavo į 220 px stulpelį. */
  .woocommerce-account .woocommerce:has(> .woocommerce-MyAccount-navigation) {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    gap: var(--t-s6);
    align-items: start;
  }

  .woocommerce-MyAccount-navigation ul {
    flex-direction: column;
    overflow: visible;
    border-bottom: none;
    border-inline-start: 1px solid var(--t-line);
  }

  .woocommerce-MyAccount-navigation a {
    height: auto;
    padding: var(--t-s2) var(--t-s4);
    border-bottom: none;
    border-inline-start: 2px solid transparent;
    margin-inline-start: -1px;
  }

  .woocommerce-MyAccount-navigation .is-active a {
    border-inline-start-color: var(--t-signal);
  }

  /* Senesnės naršyklės be `:has()` gardelės negauna ir lieka su vienu
     stulpeliu: meniu virš turinio. Ne taip erdvu, bet tvarkinga —
     priešingai nei sugriuvusi gardelė. */
  @supports not selector(:has(*)) {
    .woocommerce-MyAccount-navigation { margin-bottom: var(--t-s5); }
  }
}

/* WooCommerce pranešimuose piešia ikoną per `::before` savo šriftu, kurio
   tema nekrauna — vietoj ikonos likdavo mėlynas kvadratėlis, dar ir su
   `float`, dėl kurio tekstas su mygtuku susikeisdavo vietomis. */
.woocommerce-info::before,
.woocommerce-message::before,
.woocommerce-error::before { content: none !important; display: none !important; }

/* Pranešimo mygtukas — dešinėje, o ne teksto viduryje. */
.woocommerce-info .button,
.woocommerce-message .button { order: 2; margin-inline-start: auto; }
.woocommerce-info > *:first-child { order: 1; }

/* --- paskyra: adresų kortelės ------------------------------------------------
 * WooCommerce čia vis dar naudoja `float: left; width: 48%` ir clearfix'ą,
 * o antraštę su nuoroda palieka be jokio išdėstymo — todėl „Pridėti“
 * nusileisdavo po antrašte kaip paprasta nuoroda, o adreso tekstas
 * likdavo kursyvu (`<address>` naršyklės numatytasis stilius). */

.woocommerce-account .woocommerce-Addresses {
  display: grid;
  gap: var(--t-s5);
  margin-top: var(--t-s4);
}

@media (min-width: 720px) {
  .woocommerce-account .woocommerce-Addresses { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Tie patys clearfix'o pseudoelementai, kurie griovė ir patį paskyros
   išdėstymą — gardelėje jie tampa nariais ir sukuria tuščią stulpelį. */
.woocommerce-account .woocommerce-Addresses::before,
.woocommerce-account .woocommerce-Addresses::after {
  content: none !important;
  display: none !important;
}

.woocommerce-account .woocommerce-Addresses .col-1,
.woocommerce-account .woocommerce-Addresses .col-2 {
  float: none;
  width: 100%;
  margin: 0;
}

.woocommerce-account .woocommerce-Address {
  display: flex;
  flex-direction: column;
  gap: var(--t-s3);
  height: 100%;
  padding: var(--t-s5);
  border: 1px solid var(--t-line);
  background: var(--t-surface);
}

.woocommerce-account .woocommerce-Address-title {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--t-s3);
}

.woocommerce-account .woocommerce-Address-title h2,
.woocommerce-account .woocommerce-Address-title h3 {
  margin: 0;
  font-size: var(--t-fs-h3);
  text-transform: uppercase;
  letter-spacing: var(--t-ls-display);
}

/* Nuoroda „Pridėti“ / „Redaguoti“ yra veiksmas, ne tekstas — todėl atrodo
   kaip mygtukas. Kortelėje ji yra vienintelis dalykas, kurį galima
   paspausti, ir turi būti akivaizdi. */
.woocommerce-account .woocommerce-Address-title .edit {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding-inline: var(--t-s4);
  border: 1px solid var(--t-ink);
  background: transparent;
  color: var(--t-ink);
  font-family: var(--t-font-ui);
  font-size: var(--t-fs-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--t-ls-label);
  text-decoration: none;
  white-space: nowrap;
  transition: background var(--t-fast) var(--t-ease), color var(--t-fast) var(--t-ease);
}

.woocommerce-account .woocommerce-Address-title .edit:hover {
  background: var(--t-ink);
  color: #fff;
}

.woocommerce-account .woocommerce-Address address {
  margin: 0;
  font-style: normal;
  line-height: var(--t-lh-body);
  color: var(--t-ink-soft);
}

/* Įžanginis sakinys virš kortelių. */
.woocommerce-account .my_account_addresses ~ p,
.woocommerce-account .woocommerce-Addresses + p { color: var(--t-ink-soft); }

/* --- paštomato pasirinkimas apmokėjime ---------------------------------------
 * Rodomas po pasirinktu pristatymo būdu, todėl turi atrodyti kaip jo dalis,
 * o ne kaip atskiras laukas puslapio apačioje. */

.t-terminal {
  margin-top: var(--t-s3);
  padding: var(--t-s3) 0 0;
  border-top: 1px solid var(--t-line);
}

.t-terminal label {
  display: block;
  margin-bottom: var(--t-s2);
  font-family: var(--t-font-ui);
  font-size: var(--t-fs-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--t-ls-label);
  color: var(--t-ink-soft);
}

/* Sąraše šimtai įrašų, todėl jis turi būti kuo platesnis — sutrumpintas
   paštomato adresas pirkėjui nieko nesako. */
.t-terminal__select {
  width: 100%;
  max-width: 100%;
  padding: var(--t-s3);
  border: 1px solid var(--t-line-strong);
  background: var(--t-surface);
  font-size: var(--t-fs-sm);
}

.t-terminal__select:focus-visible { outline: 2px solid var(--t-ink); outline-offset: -2px; }

.t-terminal__empty {
  margin-top: var(--t-s3);
  font-size: var(--t-fs-sm);
  color: var(--t-signal);
}