/**
* Kor — atsiskaitymo puslapio išdėstymas.
* Kairė: pirkėjo duomenys. Dešinė: pristatymas, užsakymas, apmokėjimas.
*/
:root {
--kor-green: #449141;
--kor-green-dark: #296227;
--kor-green-soft: #eaf3e8;
--kor-tint: #f6f9f5;
--kor-line: #e0e8de;
--kor-line-strong: #cbd8c8;
--kor-ink: #1d2a1c;
--kor-muted: #6d7a6b;
--kor-radius: 14px;
--kor-radius-sm: 10px;
--kor-shadow: 0 1px 2px rgba(29, 42, 28, .05), 0 8px 24px -16px rgba(29, 42, 28, .25);
--kor-ease: cubic-bezier(.2, .8, .3, 1);
}
/* --------------------------------------------------- lipnus dešinys stulpelis */
/* Trumpesnė pusė lieka matoma slenkant — kaip prekės puslapyje.
Grid'e lipnumo riba yra pati eilutė, todėl stulpelis nenuvažiuoja žemiau. */
@media (min-width: 922px) {
.woocommerce-checkout form.checkout #order_review,
.woocommerce-checkout form.checkout #customer_details {
align-self: start;
}
/* `overflow-x: hidden` ant body paverčia jį slinkties konteineriu ir
`position: sticky` nustoja veikti. `clip` perteklių nukerpa taip pat,
bet konteinerio nesukuria. */
body.woocommerce-cart,
body.woocommerce-checkout {
overflow-x: clip;
}
/* Trumpesnį stulpelį pažymi JS — jis slenka kartu ir sustoja ties savo
srities apačia. */
/* `top` reikšmę apskaičiuoja JS pagal stulpelio aukštį ir ekraną */
.kor-sticky-top {
position: sticky;
top: 100px;
align-self: start;
}
}
/* ------------------------------------------------------- puslapio plotis */
/* Toks pat platesnis konteineris kaip kataloge ir prekės puslapyje */
.woocommerce-cart .site-content > .ast-container,
.woocommerce-checkout .site-content > .ast-container {
max-width: 1520px !important;
width: 100%;
padding-left: 30px;
padding-right: 30px;
}
/* ------------------------------------------------------ pritaikytas kuponas */
.woocommerce tr.cart-discount th,
.woocommerce-checkout tr.cart-discount th {
padding-top: 14px !important;
padding-bottom: 14px !important;
font-weight: 500 !important;
}
.woocommerce tr.cart-discount td,
.woocommerce-checkout tr.cart-discount td {
padding-top: 14px !important;
padding-bottom: 14px !important;
text-align: right;
}
.kor-coupon-chip {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 5px 12px 5px 10px;
border: 1px dashed var(--kor-line-strong);
border-radius: 999px;
background: var(--kor-green-soft);
color: var(--kor-green-dark);
font-size: 12.5px;
font-weight: 700;
letter-spacing: .04em;
line-height: 1.2;
text-transform: uppercase;
vertical-align: middle;
}
/* Etiketės piktograma piešiama CSS — kad nereikėtų leisti SVG per wp_kses */
.kor-coupon-chip::before {
content: "";
flex: 0 0 auto;
width: 13px;
height: 13px;
background: currentColor;
-webkit-mask: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.6 11.4 12.5 3.3A2 2 0 0 0 11.1 3H4a1 1 0 0 0-1 1v7.1c0 .5.2 1 .6 1.4l8.1 8.1a2 2 0 0 0 2.8 0l6.1-6.1a2 2 0 0 0 0-2.8zM7.5 9A1.5 1.5 0 1 1 9 7.5 1.5 1.5 0 0 1 7.5 9z'/%3E%3C/svg%3E") center / contain no-repeat;
mask: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.6 11.4 12.5 3.3A2 2 0 0 0 11.1 3H4a1 1 0 0 0-1 1v7.1c0 .5.2 1 .6 1.4l8.1 8.1a2 2 0 0 0 2.8 0l6.1-6.1a2 2 0 0 0 0-2.8zM7.5 9A1.5 1.5 0 1 1 9 7.5 1.5 1.5 0 0 1 7.5 9z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.kor-coupon-amount {
color: var(--kor-green-dark);
font-weight: 700;
white-space: nowrap;
}
.woocommerce a.woocommerce-remove-coupon,
.woocommerce-checkout a.woocommerce-remove-coupon {
display: inline-flex;
align-items: center;
gap: 5px;
margin-left: 10px;
padding: 4px 10px;
border: 1px solid var(--kor-line);
border-radius: 999px;
background: #fff;
color: var(--kor-muted) !important;
font-size: 11.5px;
font-weight: 600;
line-height: 1.3;
text-decoration: none !important;
vertical-align: middle;
transition: border-color .2s var(--kor-ease), background .2s var(--kor-ease), color .2s var(--kor-ease);
}
.woocommerce a.woocommerce-remove-coupon::before {
content: "×";
font-size: 14px;
line-height: 1;
}
.woocommerce a.woocommerce-remove-coupon:hover,
.woocommerce-checkout a.woocommerce-remove-coupon:hover {
border-color: #f0c9c9;
background: #fdecec;
color: #c0392b !important;
}
/* ---------------------------------------------------------------- maketas */
.woocommerce-checkout form.checkout.woocommerce-checkout {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
grid-template-areas:
"left right"
"left right";
gap: 28px;
align-items: start;
}
.woocommerce-checkout form.checkout #customer_details {
grid-area: left;
display: flex;
flex-direction: column;
gap: 18px;
width: 100%;
float: none;
}
.woocommerce-checkout form.checkout #customer_details .col-1,
.woocommerce-checkout form.checkout #customer_details .col-2 {
width: 100%;
float: none;
padding: 0;
display: flex;
flex-direction: column;
gap: 18px;
}
.woocommerce-checkout form.checkout #customer_details .col-2:empty {
display: none;
}
.woocommerce-checkout form.checkout #order_review_heading {
display: none;
}
/* Dešinė pusė — atskirta labai švelniu žalsvu fonu */
.woocommerce-checkout form.checkout #order_review {
grid-area: right;
width: 100%;
float: none;
background: var(--kor-tint);
border: 1px solid var(--kor-line);
border-radius: var(--kor-radius);
padding: 20px;
display: flex;
flex-direction: column;
gap: 16px;
position: sticky;
top: 24px;
}
/* --------------------------------------------------------------- kortelės */
.kor-card {
background: #fff;
border: 1px solid var(--kor-line);
border-radius: var(--kor-radius-sm);
padding: 20px;
}
#order_review .kor-card {
border-color: var(--kor-line);
box-shadow: 0 1px 2px rgba(29, 42, 28, .04);
}
#customer_details .kor-card {
box-shadow: var(--kor-shadow);
}
.kor-card__head {
display: flex;
align-items: center;
gap: 10px;
margin: 0 0 16px;
padding-bottom: 12px;
border-bottom: 1px solid var(--kor-line);
}
.kor-card__step {
flex: 0 0 auto;
width: 26px;
height: 26px;
border-radius: 50%;
display: grid;
place-items: center;
background: var(--kor-green-soft);
color: var(--kor-green-dark);
font-size: 13px;
font-weight: 700;
line-height: 1;
font-variant-numeric: tabular-nums;
}
.kor-card__title {
margin: 0;
font-size: 16px;
font-weight: 700;
letter-spacing: .01em;
color: var(--kor-ink);
text-transform: none;
}
/* ------------------------------------------------------ pristatymo blokas */
.kor-card--shipping #shipping_method {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 8px;
}
.kor-card--shipping #shipping_method li {
margin: 0;
padding: 12px 14px;
border: 1.5px solid var(--kor-line);
border-radius: var(--kor-radius-sm);
background: #fff;
display: flex;
align-items: center;
gap: 12px;
cursor: pointer;
transition: border-color .22s var(--kor-ease), background-color .22s var(--kor-ease), transform .22s var(--kor-ease), box-shadow .22s var(--kor-ease);
}
.kor-card--shipping #shipping_method li:hover {
border-color: var(--kor-line-strong);
transform: translateY(-1px);
box-shadow: 0 6px 16px -12px rgba(29, 42, 28, .5);
}
.kor-card--shipping #shipping_method li.kor-selected {
border-color: var(--kor-green);
background: var(--kor-green-soft);
}
.kor-card--shipping #shipping_method li label {
display: flex;
align-items: center;
gap: 12px;
flex: 1 1 auto;
min-width: 0;
margin: 0;
cursor: pointer;
font-weight: 500;
line-height: 1.35;
color: var(--kor-ink);
}
/* Pavadinimas užima likusį plotį, logotipas — fiksuotas dešinėje */
.kor-card--shipping #shipping_method li label > * {
min-width: 0;
}
.kor-card--shipping #shipping_method li label img {
flex: 0 0 auto;
max-height: 24px;
max-width: 78px;
width: auto;
object-fit: contain;
order: 9;
margin-left: auto;
}
.kor-card--shipping #shipping_method li .amount {
flex: 0 0 auto;
order: 8;
margin-left: auto;
font-weight: 600;
font-variant-numeric: tabular-nums;
color: var(--kor-green-dark);
white-space: nowrap;
}
/* Kai yra ir kaina, ir logotipas, tarpą palieka kaina */
.kor-card--shipping #shipping_method li label .amount + img,
.kor-card--shipping #shipping_method li label img + .amount {
margin-left: 10px;
}
/* Papildomas metodo paaiškinimas (pvz. atsiėmimo adresas) */
.kor-card--shipping #shipping_method li .kor-method-note {
display: block;
width: 100%;
order: 10;
margin-top: 4px;
font-size: 13px;
font-weight: 400;
line-height: 1.4;
color: var(--kor-muted);
}
/* Atsiėmimo vietos pasirinkimas — po kurjerių sąrašu */
#mp-wc-pickup-point-shipping {
margin: 14px 0 0;
padding: 14px;
border: 1px dashed var(--kor-line-strong);
border-radius: var(--kor-radius-sm);
background: var(--kor-tint);
animation: korFadeIn .32s var(--kor-ease) both;
}
#mp-wc-pickup-point-shipping .form-row {
margin: 0;
padding: 0;
}
#mp-wc-pickup-point-shipping label {
font-weight: 600;
color: var(--kor-ink);
margin-bottom: 8px;
display: block;
}
/* ---------------------------------------------------- užsakymo santrauka */
.kor-card--order .shop_table {
margin: 0;
border: 0;
width: 100%;
}
.kor-card--order .shop_table th,
.kor-card--order .shop_table td {
border: 0;
border-bottom: 1px solid var(--kor-line);
padding: 10px 0;
}
.kor-card--order .shop_table thead th {
font-size: 12px;
letter-spacing: .08em;
text-transform: uppercase;
color: var(--kor-muted);
font-weight: 600;
}
.kor-card--order .shop_table tfoot .order-total th,
.kor-card--order .shop_table tfoot .order-total td {
border-bottom: 0;
padding-top: 14px;
font-size: 18px;
color: var(--kor-ink);
}
.kor-card--order .shop_table tfoot .order-total .amount {
color: var(--kor-green-dark);
font-weight: 700;
}
/* Pristatymo eilutė lentelėje nereikalinga — ji perkelta į savo bloką */
.kor-shipping-moved {
display: none !important;
}
/* -------------------------------------------------------- apmokėjimas */
.kor-card--payment #payment {
background: transparent;
border-radius: 0;
padding: 0;
}
.kor-card--payment #payment ul.payment_methods {
list-style: none;
margin: 0;
padding: 0;
border: 0;
display: flex;
flex-direction: column;
gap: 8px;
}
.kor-card--payment #payment ul.payment_methods li.wc_payment_method {
margin: 0;
padding: 12px 14px;
border: 1.5px solid var(--kor-line);
border-radius: var(--kor-radius-sm);
background: #fff;
transition: border-color .22s var(--kor-ease), background-color .22s var(--kor-ease), box-shadow .22s var(--kor-ease);
}
.kor-card--payment #payment ul.payment_methods li.wc_payment_method:hover {
border-color: var(--kor-line-strong);
}
.kor-card--payment #payment ul.payment_methods li.kor-selected {
border-color: var(--kor-green);
background: var(--kor-green-soft);
}
.kor-card--payment #payment ul.payment_methods li label {
display: flex;
align-items: center;
gap: 10px;
margin: 0;
cursor: pointer;
font-weight: 500;
color: var(--kor-ink);
}
.kor-card--payment #payment .payment_box {
background: var(--kor-tint);
border: 1px solid var(--kor-line);
border-radius: var(--kor-radius-sm);
margin: 12px 0 0;
padding: 12px 14px;
font-size: 14px;
color: var(--kor-muted);
animation: korSlideDown .28s var(--kor-ease) both;
}
.kor-card--payment #payment .payment_box::before {
display: none;
}
.kor-card--payment #payment .place-order {
padding: 16px 0 0;
margin: 0;
}
.kor-card--payment #place_order {
width: 100%;
padding: 15px 20px;
font-size: 16px;
font-weight: 700;
letter-spacing: .04em;
border-radius: var(--kor-radius-sm);
background: var(--kor-green);
border: 0;
color: #fff;
cursor: pointer;
transition: background-color .22s var(--kor-ease), transform .16s var(--kor-ease), box-shadow .22s var(--kor-ease);
}
.kor-card--payment #place_order:hover {
background: var(--kor-green-dark);
transform: translateY(-1px);
box-shadow: 0 10px 22px -12px rgba(41, 98, 39, .8);
}
.kor-card--payment #place_order:active {
transform: translateY(0);
}
/* ------------------------------------------------------------ sutikimai */
.kor-consents {
margin: 16px 0 0;
padding: 16px;
border: 1px solid var(--kor-line);
border-radius: var(--kor-radius-sm);
background: var(--kor-tint);
display: flex;
flex-direction: column;
gap: 10px;
}
.kor-consents__title {
font-size: 12px;
letter-spacing: .08em;
text-transform: uppercase;
color: var(--kor-muted);
font-weight: 700;
margin: 0 0 2px;
}
.kor-consents p,
.kor-consents .form-row,
.kor-consents .woocommerce-privacy-policy-text {
margin: 0;
padding: 0;
}
/* Varnelė kabo kairėje, tekstas laisvai laužosi šalia */
.kor-consents label,
.kor-consents .woocommerce-form__label-for-checkbox {
display: block;
position: relative;
padding-left: 32px;
margin: 0;
line-height: 1.45;
cursor: pointer;
}
.kor-consents label > input[type="checkbox"],
.kor-consents .form-row > input[type="checkbox"] {
position: absolute;
left: 0;
top: 1px;
margin: 0;
}
.kor-consents .form-row {
position: relative;
}
.kor-consents .woocommerce-terms-and-conditions-wrapper > p:first-child,
.kor-consents .woocommerce-privacy-policy-text p {
margin: 0 0 4px;
font-size: 13.5px;
color: var(--kor-muted);
line-height: 1.5;
}
/* --------------------------------------------------------------- laukai */
.woocommerce-checkout .kor-card .form-row {
padding: 0;
margin: 0 0 14px;
}
.woocommerce-checkout .kor-card .form-row:last-child {
margin-bottom: 0;
}
.woocommerce-checkout .kor-card label {
font-weight: 500;
color: var(--kor-ink);
margin-bottom: 6px;
}
.woocommerce-checkout .kor-card input[type="text"],
.woocommerce-checkout .kor-card input[type="tel"],
.woocommerce-checkout .kor-card input[type="email"],
.woocommerce-checkout .kor-card input[type="password"],
.woocommerce-checkout .kor-card textarea,
.woocommerce-checkout .kor-card .select2-container .select2-selection {
border-radius: var(--kor-radius-sm);
border: 1.5px solid var(--kor-line);
transition: border-color .2s var(--kor-ease), box-shadow .2s var(--kor-ease);
}
.woocommerce-checkout .kor-card input[type="text"]:focus,
.woocommerce-checkout .kor-card input[type="tel"]:focus,
.woocommerce-checkout .kor-card input[type="email"]:focus,
.woocommerce-checkout .kor-card input[type="password"]:focus,
.woocommerce-checkout .kor-card textarea:focus {
border-color: var(--kor-green);
box-shadow: 0 0 0 4px rgba(68, 145, 65, .16);
outline: none;
}
/* ------------------------------------------------------------ animacijos */
@keyframes korFadeIn {
from { opacity: 0; transform: translateY(8px); }
to { opacity: 1; transform: none; }
}
@keyframes korSlideDown {
from { opacity: 0; transform: translateY(-6px); }
to { opacity: 1; transform: none; }
}
.kor-card {
animation: korFadeIn .4s var(--kor-ease) both;
}
#customer_details .kor-card:nth-child(1) { animation-delay: .02s; }
#customer_details .kor-card:nth-child(2) { animation-delay: .07s; }
#order_review .kor-card:nth-child(1) { animation-delay: .05s; }
#order_review .kor-card:nth-child(2) { animation-delay: .1s; }
#order_review .kor-card:nth-child(3) { animation-delay: .15s; }
/* Kai WooCommerce perkrauna santrauką */
#order_review.processing {
opacity: .55;
transition: opacity .2s var(--kor-ease);
}
/* --------------------------------------------------------------- mobilus */
@media (max-width: 992px) {
.woocommerce-checkout form.checkout.woocommerce-checkout {
grid-template-columns: minmax(0, 1fr);
grid-template-areas:
"left"
"right";
gap: 20px;
}
.woocommerce-checkout form.checkout #order_review {
position: static;
padding: 16px;
}
}
@media (max-width: 600px) {
.kor-card {
padding: 16px;
}
.kor-card--shipping #shipping_method li,
.kor-card--payment #payment ul.payment_methods li.wc_payment_method {
padding: 14px 12px;
}
.kor-card--shipping #shipping_method li label {
flex-wrap: wrap;
}
.kor-card--shipping #shipping_method li label img {
order: 0;
margin-left: 0;
}
.kor-card--payment #place_order {
padding: 16px 18px;
}
}
@media (prefers-reduced-motion: reduce) {
.kor-card,
#mp-wc-pickup-point-shipping,
.kor-card--payment #payment .payment_box {
animation: none;
}
.kor-card--shipping #shipping_method li,
.kor-card--payment #payment ul.payment_methods li.wc_payment_method,
.kor-card--payment #place_order {
transition: none;
}
}
/* ------------------------------------------------- laukų tinklelis (2 st.) */
.woocommerce-checkout .kor-card .woocommerce-billing-fields__field-wrapper,
.woocommerce-checkout .kor-card .woocommerce-shipping-fields__field-wrapper {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 14px 16px;
}
.woocommerce-checkout .kor-card .woocommerce-billing-fields__field-wrapper > .form-row,
.woocommerce-checkout .kor-card .woocommerce-shipping-fields__field-wrapper > .form-row {
margin: 0;
width: auto;
float: none;
}
.woocommerce-checkout .kor-card .form-row-wide,
.woocommerce-checkout .kor-card #billing_address_1_field,
.woocommerce-checkout .kor-card #billing_country_field {
grid-column: 1 / -1;
}
/* ------------------------------------------- plaukiojančios laukų etiketės */
.woocommerce-checkout .kor-card .form-row.kor-float {
position: relative;
padding-top: 0;
}
.woocommerce-checkout .kor-card .form-row.kor-float > label {
position: absolute;
/* Sutampa su lauko `padding-left`, kad etiketė lygiuotųsi su įvestu tekstu */
left: 14px;
top: 15px;
margin: 0;
padding: 0;
max-width: calc(100% - 28px);
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
font-size: 15px;
font-weight: 400;
line-height: 1.2;
color: var(--kor-muted);
background: transparent;
pointer-events: none;
transform-origin: left top;
transition:
transform .18s var(--kor-ease),
color .18s var(--kor-ease);
z-index: 2;
}
.woocommerce-checkout .kor-card .form-row.kor-float input.input-text,
.woocommerce-checkout .kor-card .form-row.kor-float textarea {
width: 100%;
min-height: 56px;
padding: 24px 14px 8px;
}
.woocommerce-checkout .kor-card .form-row.kor-float textarea {
min-height: 96px;
padding-top: 26px;
}
.woocommerce-checkout .kor-card .form-row.kor-float.kor-float-on > label {
transform: translateY(-8px) scale(.76);
color: var(--kor-green-dark);
font-weight: 600;
}
.woocommerce-checkout .kor-card .form-row.kor-float .required {
color: var(--kor-green-dark);
text-decoration: none;
border: 0;
}
.woocommerce-checkout .kor-card .form-row.kor-float.woocommerce-invalid > label {
color: #c0492c;
}
/* Klaidos pranešimas po lauku */
.woocommerce-checkout .kor-card .form-row .woocommerce-input-wrapper > em,
.woocommerce-checkout .kor-card .form-row small {
display: block;
margin-top: 5px;
font-size: 12.5px;
color: var(--kor-muted);
font-style: normal;
}
/* --------------------------------- santraukos eilutės: kvėpuoja, lygiuoja */
.kor-card--order .shop_table th,
.kor-card--order .shop_table td {
vertical-align: top;
line-height: 1.4;
}
.kor-card--order .shop_table td,
.kor-card--order .shop_table tfoot th + td,
.kor-card--order .shop_table .product-total,
.kor-card--order .shop_table tfoot td {
text-align: right;
white-space: nowrap;
font-variant-numeric: tabular-nums;
}
.kor-card--order .shop_table thead th:last-child {
text-align: right;
}
.kor-card--order .shop_table .product-name {
text-align: left;
white-space: normal;
padding-right: 16px;
font-weight: 500;
color: var(--kor-ink);
}
.kor-card--order .shop_table .product-name .product-quantity {
display: inline-block;
margin-left: 6px;
padding: 1px 7px;
border-radius: 20px;
background: var(--kor-green-soft);
color: var(--kor-green-dark);
font-size: 12px;
font-weight: 700;
font-variant-numeric: tabular-nums;
}
.kor-card--order .shop_table tfoot th {
text-align: left;
font-weight: 500;
color: var(--kor-muted);
white-space: nowrap;
padding-right: 16px;
}
.kor-card--order .shop_table tfoot .order-total th {
font-weight: 700;
color: var(--kor-ink);
}
.kor-card--order .shop_table tbody tr:last-child th,
.kor-card--order .shop_table tbody tr:last-child td {
border-bottom: 1px solid var(--kor-line);
}
.kor-card--order .shop_table .includes_tax,
.kor-card--order .shop_table small {
display: block;
font-size: 12px;
font-weight: 400;
color: var(--kor-muted);
white-space: normal;
}
@media (max-width: 600px) {
.woocommerce-checkout .kor-card .woocommerce-billing-fields__field-wrapper,
.woocommerce-checkout .kor-card .woocommerce-shipping-fields__field-wrapper {
grid-template-columns: minmax(0, 1fr);
}
.woocommerce-checkout .kor-card .form-row-first,
.woocommerce-checkout .kor-card .form-row-last {
grid-column: 1 / -1;
}
}
/* ------------------------------ „siųsti kitu adresu" perjungiklis kortelėje */
.woocommerce-checkout .kor-card #ship-to-different-address {
margin: 18px 0 0;
padding: 14px;
border: 1px solid var(--kor-line);
border-radius: var(--kor-radius-sm);
background: var(--kor-tint);
font-size: 15px;
font-weight: 600;
text-transform: none;
letter-spacing: 0;
color: var(--kor-ink);
}
.woocommerce-checkout .kor-card #ship-to-different-address label {
display: block;
position: relative;
padding-left: 32px;
margin: 0;
font-weight: 600;
cursor: pointer;
}
.woocommerce-checkout .kor-card #ship-to-different-address input[type="checkbox"] {
position: absolute;
left: 0;
top: 0;
margin: 0;
}
.woocommerce-checkout .kor-card .shipping_address {
margin-top: 16px;
}
/* ================================================================
Patikslinimai: WooCommerce ir Astra stiliai kai kur laimi pagal
specifiškumą, todėl čia selektoriai ilgesni.
================================================================ */
/* Pristatymo būdo eilutė — viskas vienoje juostoje, logotipas dešinėje */
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li > label {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 10px;
flex: 1 1 auto;
min-width: 0;
margin: 0;
padding: 0;
font-weight: 500;
line-height: 1.35;
color: var(--kor-ink);
cursor: pointer;
}
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li .multiparcels-carrier-icon-image-holder {
order: 9;
flex: 0 0 auto;
margin: 0 0 0 auto;
padding: 0;
line-height: 0;
display: flex;
align-items: center;
}
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li .multiparcels-carrier-icon-image-holder img {
max-height: 22px;
max-width: 76px;
width: auto;
height: auto;
margin: 0;
object-fit: contain;
}
/* Metodo pavadinimas — likęs plotis, be laužymo per vidurį žodžio */
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li > label > .multiparcels-shipping-method-title,
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li > label > span:not(.kor-method-note):not(.amount) {
flex: 1 1 auto;
min-width: 0;
}
/* Radijo mygtukas eilutėje nesitraukia */
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li > input[type="radio"] {
flex: 0 0 auto;
}
/* Plaukiojanti etiketė ir vietos rezervavimo tekstas nesimuša */
.woocommerce-checkout .kor-card .form-row.kor-float input::placeholder,
.woocommerce-checkout .kor-card .form-row.kor-float textarea::placeholder {
opacity: 0;
transition: opacity .15s linear;
}
.woocommerce-checkout .kor-card .form-row.kor-float.kor-float-on input::placeholder,
.woocommerce-checkout .kor-card .form-row.kor-float.kor-float-on textarea::placeholder {
opacity: 1;
}
/* Sutikimų etiketės — WooCommerce joms uždeda savo display */
.woocommerce-checkout .kor-consents label.checkbox,
.woocommerce-checkout .kor-consents .woocommerce-form__label {
display: block;
position: relative;
padding-left: 32px;
margin: 0;
}
.woocommerce-checkout .kor-consents label.checkbox > input[type="checkbox"],
.woocommerce-checkout .kor-consents .woocommerce-form__label > input[type="checkbox"] {
position: absolute;
left: 0;
top: 1px;
margin: 0;
}
/* Complianz „tvarkyti sutikimą" juostelė neturi gulti ant formos */
.woocommerce-checkout .cmplz-manage-consent-container,
.woocommerce-checkout #cmplz-manage-consent {
position: fixed;
left: 0;
bottom: 0;
top: auto;
z-index: 30;
}
/* ----------------------------------------------------------------------
Pasirinkimo eilutės: radijo mygtukas išimamas iš srauto, eilutė gauna
fiksuotą tarpą kairėje. Taip tekstas niekada neužlipa ant mygtuko,
nesvarbu, ar pavadinimas yra atskiras elementas, ar plikas tekstas.
---------------------------------------------------------------------- */
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li,
.woocommerce-checkout form.checkout .kor-card--payment #payment ul.payment_methods li.wc_payment_method {
display: block;
position: relative;
padding-left: 48px;
}
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li > input[type="radio"],
.woocommerce-checkout form.checkout .kor-card--payment #payment ul.payment_methods li.wc_payment_method > input[type="radio"] {
position: absolute;
left: 14px;
top: 50%;
margin: 0;
transform: translateY(-50%);
}
/* Mokėjimo būdo paaiškinimas lygiuojasi su pavadinimu, o ne su mygtuku */
.woocommerce-checkout form.checkout .kor-card--payment #payment ul.payment_methods li.wc_payment_method .payment_box {
margin-left: -34px;
}
@media (max-width: 600px) {
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li,
.woocommerce-checkout form.checkout .kor-card--payment #payment ul.payment_methods li.wc_payment_method {
padding-left: 44px;
}
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li > input[type="radio"],
.woocommerce-checkout form.checkout .kor-card--payment #payment ul.payment_methods li.wc_payment_method > input[type="radio"] {
left: 12px;
}
.woocommerce-checkout form.checkout .kor-card--payment #payment ul.payment_methods li.wc_payment_method .payment_box {
margin-left: -32px;
}
}
/* ----------------------------------------------------------------------
WooCommerce pristatymo sąrašui taiko `padding-left: 22px` ir
`text-indent: -22px` — tai įtraukia pirmą teksto eilutę po radijo
mygtuku. Mūsų maketui to nereikia, o perrašyti pavyksta tik jėga.
---------------------------------------------------------------------- */
.kor-card--shipping #shipping_method li,
.kor-card--payment #payment ul.payment_methods li.wc_payment_method {
padding: 12px 14px 12px 48px !important;
text-indent: 0 !important;
margin: 0 !important;
}
@media (max-width: 600px) {
.kor-card--shipping #shipping_method li,
.kor-card--payment #payment ul.payment_methods li.wc_payment_method {
padding: 14px 12px 14px 44px !important;
}
}
/* Vienintelis mokėjimo būdas — radijo mygtuko nėra, tarpo irgi nereikia */
.kor-card--payment #payment ul.payment_methods li.wc_payment_method.kor-no-radio {
padding-left: 14px !important;
}
.kor-card--payment #payment ul.payment_methods li.wc_payment_method.kor-no-radio .payment_box {
margin-left: 0;
}
/* ----------------------------------------------------------------------
Astra atsiskaitymo stulpeliams taiko procentinį plotį ir `float`, todėl
tinklelio langeliai lieka neužpildyti. Perrašom jėga.
---------------------------------------------------------------------- */
.woocommerce-checkout form.checkout #customer_details,
.woocommerce-checkout form.checkout #customer_details .col-1,
.woocommerce-checkout form.checkout #customer_details .col-2,
.woocommerce-checkout form.checkout #order_review {
width: 100% !important;
max-width: none !important;
float: none !important;
margin-left: 0 !important;
margin-right: 0 !important;
}
/* --------------------------------------------------- paskutiniai lygiavimai */
/* „Siųsti kitu adresu" — varnelė ir tekstas vienoje linijoje */
.woocommerce-checkout .kor-card #ship-to-different-address,
.woocommerce-checkout .kor-card #ship-to-different-address label {
display: flex;
align-items: center;
gap: 10px;
padding-left: 0;
}
.woocommerce-checkout .kor-card #ship-to-different-address {
display: block;
}
.woocommerce-checkout .kor-card #ship-to-different-address input[type="checkbox"] {
position: static;
margin: 0;
}
/* „Sukurti paskyrą?" ir kitos varnelės kairėje kortelėje */
.woocommerce-checkout .kor-card .woocommerce-form__label-for-checkbox,
.woocommerce-checkout .kor-card label.checkbox {
display: flex;
align-items: flex-start;
gap: 10px;
margin: 0;
line-height: 1.45;
cursor: pointer;
}
.woocommerce-checkout .kor-card .woocommerce-form__label-for-checkbox > input[type="checkbox"],
.woocommerce-checkout .kor-card label.checkbox > input[type="checkbox"] {
margin: 1px 0 0;
}
/* Vienintelio mokėjimo būdo paaiškinimas neturi kyšoti iš kortelės */
.kor-card--payment #payment ul.payment_methods li.wc_payment_method.kor-no-radio .payment_box {
margin-left: 0 !important;
}
/* ======================================================================
Krepšelio pristatymo būdai — tas pats vaizdas kaip atsiskaitant.
====================================================================== */
.woocommerce-cart .woocommerce-shipping-totals td {
padding: 14px 0;
}
.woocommerce-cart #shipping_method {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 8px;
text-align: left;
}
.woocommerce-cart #shipping_method li {
display: block;
position: relative;
margin: 0 !important;
padding: 12px 14px 12px 48px !important;
text-indent: 0 !important;
border: 1.5px solid var(--kor-line);
border-radius: var(--kor-radius-sm);
background: #fff;
transition: border-color .22s var(--kor-ease), background-color .22s var(--kor-ease);
}
.woocommerce-cart #shipping_method li:hover {
border-color: var(--kor-line-strong);
}
.woocommerce-cart #shipping_method li:has(> input[type="radio"]:checked) {
border-color: var(--kor-green);
background: var(--kor-green-soft);
}
.woocommerce-cart #shipping_method li > input[type="radio"] {
position: absolute;
left: 14px;
top: 50%;
margin: 0;
transform: translateY(-50%);
}
.woocommerce-cart #shipping_method li > label {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 10px;
margin: 0;
min-width: 0;
line-height: 1.35;
font-weight: 500;
color: var(--kor-ink);
cursor: pointer;
}
/* Krepšelio stulpelis siauras — logotipas lieka prie pavadinimo kairėje */
.woocommerce-cart #shipping_method li > label {
flex-wrap: nowrap;
}
.woocommerce-cart #shipping_method li .multiparcels-carrier-icon-image-holder {
order: 0;
flex: 0 0 auto;
margin: 0;
line-height: 0;
}
.woocommerce-cart #shipping_method li .multiparcels-carrier-icon-image-holder img {
max-height: 22px;
max-width: 76px;
width: auto;
margin: 0;
object-fit: contain;
}
.woocommerce-cart .cart_totals table th {
vertical-align: top;
white-space: nowrap;
padding-right: 16px;
}
.woocommerce-cart #shipping_method li .multiparcels-shipping-method-title,
.woocommerce-cart #shipping_method li > label > span {
min-width: 0;
}
.woocommerce-cart .cart_totals th {
width: 34%;
}
/* Krepšelyje etiketė irgi turi būti juosta, o ne blokas */
.woocommerce-cart #shipping_method li > label,
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li > label {
display: flex !important;
align-items: center;
}
.woocommerce-cart #shipping_method li > label {
flex-wrap: nowrap !important;
gap: 10px;
}
/* ======================================================================
Patikslinimai po apžiūros
====================================================================== */
/* Dešinės pusės plokštė: Astra jai taiko `padding: 0 32px`, todėl vidinės
kortelės lipdavo prie viršutinio ir apatinio krašto. */
.woocommerce-checkout form.checkout #order_review {
padding: 20px !important;
/* Astra jai duoda 2px pilką rėmelį be viršaus */
border: 1px solid var(--kor-line) !important;
border-radius: var(--kor-radius) !important;
background-color: var(--kor-tint) !important;
}
/* Paslėpti WooCommerce priskyrimo laukai stumdavo kairę kortelę žemyn */
#customer_details .col-1 > wc-order-attribution-inputs,
#customer_details .col-1 > .woocommerce-additional-fields:empty {
display: none !important;
}
/* Kortelės antraštė: viena skiriamoji linija, ne dvi */
.woocommerce-checkout .kor-card .kor-card__head {
align-items: center;
gap: 10px;
}
.woocommerce-checkout .kor-card .kor-card__title {
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
line-height: 1.3;
}
.woocommerce-checkout .kor-card .kor-card__title::before,
.woocommerce-checkout .kor-card .kor-card__title::after {
content: none !important;
display: none !important;
}
/* Laukai kortelėse — apvalinti kampai ir vienodas rėmelis */
.woocommerce-checkout .kor-card input[type="text"],
.woocommerce-checkout .kor-card input[type="tel"],
.woocommerce-checkout .kor-card input[type="email"],
.woocommerce-checkout .kor-card input[type="password"],
.woocommerce-checkout .kor-card textarea {
border-radius: 10px !important;
border: 1.5px solid var(--kor-line) !important;
background-color: #fff !important;
}
.woocommerce-checkout .kor-card input[type="text"]:focus,
.woocommerce-checkout .kor-card input[type="tel"]:focus,
.woocommerce-checkout .kor-card input[type="email"]:focus,
.woocommerce-checkout .kor-card input[type="password"]:focus,
.woocommerce-checkout .kor-card textarea:focus {
border-color: var(--kor-green) !important;
}
.woocommerce-checkout .kor-card textarea {
padding: 26px 14px 12px !important;
}
/* Mokėjimo būdo paaiškinimas — be antro pilko langelio žaliame bloke */
.kor-card--payment #payment .payment_box,
.kor-card--payment #payment li.wc_payment_method .payment_box {
background-color: transparent !important;
background-image: none !important;
border: 0 !important;
margin: 8px 0 0 !important;
padding: 0 !important;
color: var(--kor-muted);
font-size: 14px;
}
.kor-card--payment #payment .payment_box p:last-child {
margin-bottom: 0;
}
/* „Siųsti kitu adresu" — varnelė neprilipusi prie krašto */
.woocommerce-checkout .kor-card #ship-to-different-address {
padding: 14px !important;
}
/* Sutikimų varnelė lygiuojasi su pirmąja teksto eilute */
/* Pirmos teksto eilutės aukštis prilyginamas varnelės aukščiui (22 px),
todėl `top: 0` reiškia tikslų sutapimą — be pikselinių pataisų. */
.woocommerce-checkout .kor-consents label,
.woocommerce-checkout .kor-consents .form-row,
.woocommerce-checkout .kor-card .woocommerce-form__label-for-checkbox,
.woocommerce-checkout .kor-card label.checkbox {
line-height: 22px;
}
.woocommerce-checkout .kor-consents label > input[type="checkbox"],
.woocommerce-checkout .kor-consents .form-row > input[type="checkbox"],
.woocommerce-checkout .kor-card .woocommerce-form__label-for-checkbox > input[type="checkbox"],
.woocommerce-checkout .kor-card label.checkbox > input[type="checkbox"] {
top: 0;
margin-top: 0;
align-self: flex-start;
}
/* Mokėjimo būdo mygtukas lygiuojasi su pavadinimu, o ne su visu bloku */
.woocommerce-checkout form.checkout .kor-card--payment #payment ul.payment_methods li.wc_payment_method > input[type="radio"] {
top: 29px;
}
/* Pristatymo mygtukas lygiuojasi su pavadinimo eilute, o ne su visa eilute
(svarbu tiems metodams, kurie turi antrą paaiškinimo eilutę). */
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li > input[type="radio"],
.woocommerce-cart #shipping_method li > input[type="radio"] {
top: 23px;
transform: translateY(-50%);
}
@media (max-width: 600px) {
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li > input[type="radio"],
.woocommerce-cart #shipping_method li > input[type="radio"] {
top: 25px;
}
}
/* „Sukurti paskyrą?" — WooCommerce etiketei lieka savas eilutės aukštis */
.woocommerce-checkout .kor-card .woocommerce-account-fields label {
line-height: 22px;
align-items: flex-start;
}
.woocommerce-checkout .kor-card .woocommerce-account-fields label > input[type="checkbox"] {
margin-top: -2px;
}
/* ------------------------------------------------- nuolaidos kodo forma */
.woocommerce form.checkout_coupon .form-row-first {
position: relative;
}
.woocommerce form.checkout_coupon input[type="text"] {
border-radius: 10px !important;
border: 1.5px solid var(--kor-line) !important;
min-height: 52px;
padding: 24px 14px 8px !important;
}
.woocommerce form.checkout_coupon input[type="text"]:focus {
border-color: var(--kor-green) !important;
}
.woocommerce form.checkout_coupon button {
min-height: 52px;
padding: 0 26px;
border-radius: 10px;
}
/* Plaukiojanti etiketė ir šiam laukui */
.woocommerce form.checkout_coupon .form-row.kor-float > label,
.woocommerce form.checkout_coupon .form-row-first.kor-float > label {
position: absolute;
left: 14px;
top: 15px;
margin: 0;
padding: 0;
max-width: calc(100% - 28px);
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
font-size: 15px;
font-weight: 400;
line-height: 1.2;
color: var(--kor-muted);
pointer-events: none;
transform-origin: left top;
transition: transform .18s var(--kor-ease), color .18s var(--kor-ease);
z-index: 2;
}
.woocommerce form.checkout_coupon .kor-float.kor-float-on > label {
transform: translateY(-8px) scale(.76);
color: var(--kor-green-dark);
font-weight: 600;
}
.woocommerce form.checkout_coupon .kor-float input::placeholder {
opacity: 0;
}
.woocommerce form.checkout_coupon .kor-float.kor-float-on input::placeholder {
opacity: 1;
}
/* WooCommerce nuolaidos kodo etiketę slepia 1×1 px gudrybe — parodom ją
kaip plaukiojančią etiketę. */
.woocommerce form.checkout_coupon .form-row-first > label {
position: absolute !important;
width: auto !important;
height: auto !important;
margin: 0 !important;
padding: 0 !important;
clip: auto !important;
clip-path: none !important;
overflow: hidden !important;
white-space: nowrap;
text-overflow: ellipsis;
max-width: calc(100% - 28px);
left: 14px;
top: 17px;
font-size: 15px;
font-weight: 400;
line-height: 1.2;
color: var(--kor-muted);
pointer-events: none;
transform-origin: left top;
transition: transform .18s var(--kor-ease), color .18s var(--kor-ease);
z-index: 2;
}
.woocommerce form.checkout_coupon .form-row-first.kor-float-on > label {
transform: translateY(-9px) scale(.76);
color: var(--kor-green-dark);
font-weight: 600;
}
/* Nuolaidos kodo forma neturi tįsti per visą plotį, bet ir nespausti
mygtuko į kitą eilutę */
.woocommerce form.checkout_coupon {
width: 100%;
max-width: 560px;
}
.woocommerce form.checkout_coupon .form-row-first {
flex: 1 1 240px;
max-width: none;
}
/* ======================================================================
KREPŠELIS — tas pats kortelių vaizdas kaip atsiskaitant
====================================================================== */
/* Paieškos valdiklis irgi turi klasę `woocommerce`, todėl tinklelis
rišamas prie krepšelio formos. */
.woocommerce-cart .woocommerce:has(> form.woocommerce-cart-form) {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 420px);
grid-template-areas:
"notices notices"
"items totals";
gap: 24px;
align-items: start;
}
.woocommerce-cart .woocommerce:has(> form.woocommerce-cart-form) > .woocommerce-notices-wrapper {
grid-area: notices;
}
.woocommerce-cart form.woocommerce-cart-form {
grid-area: items;
margin: 0;
padding: 20px;
border: 1px solid var(--kor-line);
border-radius: var(--kor-radius);
background: #fff;
box-shadow: var(--kor-shadow);
}
.woocommerce-cart .cart-collaterals {
grid-area: totals;
width: 100%;
float: none;
}
.woocommerce-cart .cart-collaterals .cart_totals {
width: 100% !important;
float: none !important;
margin: 0;
padding: 20px;
border: 1px solid var(--kor-line) !important;
border-radius: var(--kor-radius) !important;
background: var(--kor-tint) !important;
}
.woocommerce-cart .cart_totals h2 {
margin: 0 0 14px;
padding: 0 0 12px;
border-bottom: 1px solid var(--kor-line);
font-size: 16px;
font-weight: 700;
text-transform: none;
letter-spacing: .01em;
color: var(--kor-ink);
}
/* Prekių lentelė */
.woocommerce-cart table.shop_table.cart {
margin: 0;
border: 0;
border-collapse: collapse;
}
.woocommerce-cart table.shop_table.cart th,
.woocommerce-cart table.shop_table.cart td {
border: 0;
border-bottom: 1px solid var(--kor-line);
padding: 14px 10px;
vertical-align: middle;
}
.woocommerce-cart table.shop_table.cart thead,
.woocommerce-cart table.shop_table.cart thead tr,
.woocommerce-cart table.shop_table.cart thead th {
background: transparent !important;
}
.woocommerce-cart table.shop_table.cart thead th {
font-size: 12px;
letter-spacing: .08em;
text-transform: uppercase;
color: var(--kor-muted);
font-weight: 600;
}
.woocommerce-cart table.shop_table.cart td.product-thumbnail img {
border-radius: 10px;
width: 72px;
}
.woocommerce-cart table.shop_table.cart td.product-name a {
font-weight: 600;
color: var(--kor-ink);
}
.woocommerce-cart table.shop_table.cart td.product-name a:hover {
color: var(--kor-green-dark);
}
.woocommerce-cart table.shop_table.cart td.product-price,
.woocommerce-cart table.shop_table.cart td.product-subtotal {
font-variant-numeric: tabular-nums;
white-space: nowrap;
}
.woocommerce-cart table.shop_table.cart td.product-subtotal {
font-weight: 700;
color: var(--kor-green-dark);
}
.woocommerce-cart td.product-remove a.remove {
color: var(--kor-muted) !important;
font-size: 20px;
transition: color .18s var(--kor-ease), transform .18s var(--kor-ease);
}
.woocommerce-cart td.product-remove a.remove:hover {
color: #c0492c !important;
background: transparent !important;
transform: scale(1.15);
}
/* Kiekio valdiklis */
.woocommerce-cart .quantity {
display: inline-flex;
align-items: center;
/* be `fit-content` dėžutė lieka platesnė už turinį ir už „+" matosi tarpelis */
width: fit-content;
max-width: 100%;
border: 1.5px solid var(--kor-line);
border-radius: 10px;
overflow: hidden;
}
.woocommerce-cart .quantity input[type="number"],
.woocommerce-cart .quantity input.qty {
width: 48px;
min-height: 40px;
border: 0 !important;
border-radius: 0 !important;
text-align: center;
box-shadow: none !important;
font-variant-numeric: tabular-nums;
}
/* Tema mygtukams deda kompensuojančias paraštes (−38 / +38 / +6) — dėl
paskutinės už „+" likdavo baltas tarpelis. */
.woocommerce-cart .quantity .minus,
.woocommerce-cart .quantity .plus,
.woocommerce-cart .quantity button,
.woocommerce-cart .quantity input[type="number"],
.woocommerce-cart .quantity input.qty {
margin: 0 !important;
}
.woocommerce-cart .quantity .minus,
.woocommerce-cart .quantity .plus,
.woocommerce-cart .quantity button {
min-height: 40px;
width: 36px;
border: 0;
border-radius: 0;
background: var(--kor-tint);
color: var(--kor-ink);
font-size: 16px;
line-height: 1;
cursor: pointer;
transition: background-color .18s var(--kor-ease), color .18s var(--kor-ease);
}
.woocommerce-cart .quantity .minus:hover,
.woocommerce-cart .quantity .plus:hover,
.woocommerce-cart .quantity button:hover {
background: var(--kor-green-soft);
color: var(--kor-green-dark);
}
/* Nuolaidos kodo eilutė ir „atnaujinti" */
.woocommerce-cart td.actions {
padding: 18px 10px 4px !important;
border-bottom: 0 !important;
}
.woocommerce-cart td.actions .coupon {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 10px;
float: none;
}
.woocommerce-cart td.actions .coupon label {
display: none;
}
.woocommerce-cart td.actions .coupon input#coupon_code {
flex: 1 1 200px;
max-width: 260px;
min-height: 46px;
margin: 0;
border-radius: 10px !important;
border: 1.5px solid var(--kor-line) !important;
}
.woocommerce-cart td.actions .coupon button,
.woocommerce-cart td.actions > button {
min-height: 46px;
border-radius: 10px;
}
.woocommerce-cart td.actions > button[name="update_cart"] {
float: right;
}
/* Totals lentelė */
.woocommerce-cart .cart_totals table.shop_table {
border: 0;
margin: 0;
}
.woocommerce-cart .cart_totals table th,
.woocommerce-cart .cart_totals table td {
border: 0;
border-bottom: 1px solid var(--kor-line);
padding: 12px 0;
vertical-align: top;
}
.woocommerce-cart .cart_totals table td {
text-align: right;
font-variant-numeric: tabular-nums;
}
.woocommerce-cart .cart_totals tr.order-total th,
.woocommerce-cart .cart_totals tr.order-total td {
border-bottom: 0;
font-size: 18px;
padding-top: 14px;
}
.woocommerce-cart .cart_totals tr.order-total .amount {
color: var(--kor-green-dark);
font-weight: 700;
}
.woocommerce-cart .wc-proceed-to-checkout {
padding: 18px 0 0;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
display: block;
width: 100%;
margin: 0;
padding: 15px 20px;
text-align: center;
border-radius: var(--kor-radius-sm);
font-size: 16px;
font-weight: 700;
}
@media (max-width: 992px) {
.woocommerce-cart .woocommerce:has(> form.woocommerce-cart-form) {
grid-template-columns: minmax(0, 1fr);
grid-template-areas:
"notices"
"items"
"totals";
}
}
@media (max-width: 600px) {
.woocommerce-cart form.woocommerce-cart-form,
.woocommerce-cart .cart-collaterals .cart_totals {
padding: 16px;
}
.woocommerce-cart td.actions .coupon input#coupon_code,
.woocommerce-cart td.actions .coupon button,
.woocommerce-cart td.actions > button[name="update_cart"] {
flex: 1 1 100%;
max-width: none;
width: 100%;
float: none;
}
}
/* ------------------------------------------- šalies laukas kaip kiti laukai */
.woocommerce-checkout .kor-card .form-row.form-row-wide:has(> .woocommerce-input-wrapper > .select2-container),
.woocommerce-checkout .kor-card #billing_country_field,
.woocommerce-checkout .kor-card #shipping_country_field {
position: relative;
}
.woocommerce-checkout .kor-card #billing_country_field > label,
.woocommerce-checkout .kor-card #shipping_country_field > label {
position: absolute;
left: 14px;
top: 7px;
z-index: 2;
margin: 0;
padding: 0;
font-size: 11.4px;
font-weight: 600;
line-height: 1.2;
color: var(--kor-green-dark);
pointer-events: none;
}
.woocommerce-checkout .kor-card .select2-container--default .select2-selection--single {
height: 56px !important;
padding: 0 !important;
border: 1.5px solid var(--kor-line) !important;
border-radius: 10px !important;
}
.woocommerce-checkout .kor-card .select2-container--default .select2-selection--single .select2-selection__rendered {
padding: 24px 30px 8px 14px !important;
line-height: 22px !important;
color: var(--kor-ink);
}
.woocommerce-checkout .kor-card .select2-container--default .select2-selection--single .select2-selection__arrow {
height: 54px !important;
right: 8px;
}
.woocommerce-checkout .kor-card .select2-container--default.select2-container--open .select2-selection--single,
.woocommerce-checkout .kor-card .select2-container--default.select2-container--focus .select2-selection--single {
border-color: var(--kor-green) !important;
}
/* Atsiėmimo vietos laukas — tas pats aukštis */
#mp-wc-pickup-point-shipping .select2-container--default .select2-selection--single {
height: 46px !important;
}
#mp-wc-pickup-point-shipping .select2-container--default .select2-selection--single .select2-selection__rendered {
padding: 0 30px 0 12px !important;
line-height: 42px !important;
}
/* Krepšelio veiksmų eilutė: kuponas kairėje, „atnaujinti" dešinėje */
.woocommerce-cart td.actions {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 10px;
}
.woocommerce-cart td.actions .coupon {
flex: 1 1 auto;
margin: 0;
}
.woocommerce-cart td.actions > button[name="update_cart"] {
float: none;
margin-left: auto;
}
/* Pristatymo būdai krepšelio santraukoje — per visą plotį, o ne siaurame
dešiniame stulpelyje */
.woocommerce-cart .cart_totals tr.woocommerce-shipping-totals {
display: block;
}
.woocommerce-cart .cart_totals tr.woocommerce-shipping-totals th,
.woocommerce-cart .cart_totals tr.woocommerce-shipping-totals td {
display: block;
width: 100%;
text-align: left;
padding-right: 0;
padding-left: 0;
}
.woocommerce-cart .cart_totals tr.woocommerce-shipping-totals th {
border-bottom: 0;
padding-bottom: 6px;
font-size: 12px;
letter-spacing: .08em;
text-transform: uppercase;
color: var(--kor-muted);
}
.woocommerce-cart .cart_totals .woocommerce-shipping-destination,
.woocommerce-cart .cart_totals .shipping-calculator-button {
display: block;
margin-top: 8px;
font-size: 13.5px;
color: var(--kor-muted);
}
/* ---------------------------------------------------- paskutiniai lopai */
/* WooCommerce lentelei palieka 32px paraštę apačioje — kortelėje ji virsta
tuščiu tarpu */
.kor-card--order .shop_table,
.woocommerce-checkout .kor-card--order table.shop_table {
margin: 0 !important;
}
/* Šalies laukas: etiketė virš select2, reikšmė pastumta žemyn */
/* select2 konteineriui uždėtas `z-index: 9999`, todėl etiketė turi būti dar
aukščiau — kitaip ją uždengia baltas reikšmės fonas */
.woocommerce-checkout .kor-card #billing_country_field > label,
.woocommerce-checkout .kor-card #shipping_country_field > label {
z-index: 10000;
}
.woocommerce-checkout .kor-card .select2-container .select2-selection__rendered,
.woocommerce-checkout .kor-card .select2-container--default .select2-selection--single .select2-selection__rendered {
padding: 26px 30px 6px 14px !important;
line-height: 22px !important;
}
.woocommerce-checkout .kor-card .select2-container .select2-selection--single {
height: 56px !important;
}
/* Krepšelio lentelės stulpeliai — pavadinimui palikti plotį */
.woocommerce-cart table.shop_table.cart td.product-remove,
.woocommerce-cart table.shop_table.cart th.product-remove {
width: 44px;
padding-left: 0;
padding-right: 0;
}
.woocommerce-cart table.shop_table.cart td.product-thumbnail,
.woocommerce-cart table.shop_table.cart th.product-thumbnail {
width: 92px;
}
.woocommerce-cart table.shop_table.cart td.product-name,
.woocommerce-cart table.shop_table.cart th.product-name {
width: auto;
min-width: 180px;
text-align: left;
}
.woocommerce-cart table.shop_table.cart td.product-price,
.woocommerce-cart table.shop_table.cart th.product-price,
.woocommerce-cart table.shop_table.cart td.product-subtotal,
.woocommerce-cart table.shop_table.cart th.product-subtotal {
width: 96px;
text-align: right;
}
.woocommerce-cart table.shop_table.cart td.product-quantity,
.woocommerce-cart table.shop_table.cart th.product-quantity {
width: 130px;
text-align: center;
}
/* Kupono laukas ir mygtukas vienoje eilėje */
.woocommerce-cart td.actions .coupon {
display: flex;
flex-wrap: nowrap;
align-items: center;
gap: 10px;
}
.woocommerce-cart td.actions .coupon input#coupon_code {
flex: 1 1 auto;
min-width: 0;
max-width: 260px;
}
.woocommerce-cart td.actions .coupon button {
flex: 0 0 auto;
white-space: nowrap;
}
/* ------------------------------------------- atsiėmimo vietos informacija */
/* Plugin'as po etikete įterpia
, o po pasirinkimo — tuščius blokus */
#mp-wc-pickup-point-shipping br {
display: none;
}
/* ...bet pasirinktos vietos aprašyme
skiria adresą nuo darbo laiko */
#mp-wc-pickup-point-shipping .mp-selected-pickup-point-info br {
display: inline;
}
#mp-wc-pickup-point-shipping .form-row:empty,
#mp-wc-pickup-point-shipping .mp-selected-pickup-point-info:empty,
#mp-wc-pickup-point-shipping .mp-selected-pickup-point-info > div:empty,
#mp-wc-pickup-point-shipping > div:empty {
display: none !important;
}
#mp-wc-pickup-point-shipping .mp-selected-pickup-point-info {
margin-top: 10px;
padding: 10px 12px;
border: 1px solid var(--kor-line);
border-left: 3px solid var(--kor-green);
border-radius: var(--kor-radius-sm);
background: var(--kor-tint);
font-size: 13px;
line-height: 1.6;
color: var(--kor-ink);
}
#mp-wc-pickup-point-shipping .mp-selected-pickup-point-info:empty {
display: none !important;
}
#mp-wc-pickup-point-shipping .mp-selected-pickup-point-info b,
#mp-wc-pickup-point-shipping .mp-selected-pickup-point-info strong {
font-weight: 600;
}
#mp-wc-pickup-point-shipping .mp-selected-pickup-point-info small,
#mp-wc-pickup-point-shipping .mp-selected-pickup-point-info em {
display: block;
margin-top: 4px;
color: var(--kor-muted);
font-style: normal;
}
/* Krepšelio lentelė turi tilpti į kortelę, todėl stulpeliai fiksuoti */
.woocommerce-cart table.shop_table.cart {
width: 100%;
table-layout: fixed;
}
.woocommerce-cart table.shop_table.cart td.product-remove,
.woocommerce-cart table.shop_table.cart th.product-remove {
width: 6%;
}
.woocommerce-cart table.shop_table.cart td.product-thumbnail,
.woocommerce-cart table.shop_table.cart th.product-thumbnail {
width: 12%;
}
.woocommerce-cart table.shop_table.cart td.product-name,
.woocommerce-cart table.shop_table.cart th.product-name {
width: 36%;
min-width: 0;
}
.woocommerce-cart table.shop_table.cart td.product-price,
.woocommerce-cart table.shop_table.cart th.product-price,
.woocommerce-cart table.shop_table.cart td.product-subtotal,
.woocommerce-cart table.shop_table.cart th.product-subtotal {
width: 14%;
}
.woocommerce-cart table.shop_table.cart td.product-quantity,
.woocommerce-cart table.shop_table.cart th.product-quantity {
width: 18%;
}
.woocommerce-cart table.shop_table.cart td.product-thumbnail img {
width: 100%;
max-width: 72px;
height: auto;
}
/* Kupono ir „atnaujinti" eilutė neturi laužtis */
.woocommerce-cart td.actions {
flex-wrap: wrap;
}
.woocommerce-cart td.actions .coupon {
flex: 1 1 320px;
}
/* `display: flex` ant panaikina colspan ir suplukdo eilutę į vieną
stulpelį — veiksmų eilutė lieka lentelės langeliu, o kuponas tvarkomas
viduje. */
.woocommerce-cart td.actions {
display: table-cell !important;
text-align: left;
}
.woocommerce-cart td.actions .coupon {
display: inline-flex !important;
flex-wrap: nowrap;
align-items: center;
gap: 10px;
float: none !important;
width: auto;
max-width: 100%;
vertical-align: middle;
}
.woocommerce-cart td.actions .coupon input#coupon_code {
flex: 0 1 240px;
width: 240px;
max-width: 100%;
}
.woocommerce-cart td.actions > button[name="update_cart"] {
float: right !important;
margin-left: 12px;
}
@media (max-width: 600px) {
.woocommerce-cart td.actions .coupon {
display: flex !important;
width: 100%;
}
.woocommerce-cart td.actions > button[name="update_cart"] {
float: none !important;
width: 100%;
margin: 12px 0 0;
}
}
/* Kuponas: laukas ir mygtukas visada vienoje eilėje (laukas susitraukia) */
.woocommerce-cart td.actions .coupon {
flex-wrap: nowrap !important;
}
.woocommerce-cart td.actions .coupon input#coupon_code {
flex: 0 1 220px !important;
width: 220px;
min-width: 0;
}
/* ======================================================================
Krepšelio smulkmenos
====================================================================== */
/* Kiekio valdiklis — didesnis ir patogesnis */
.woocommerce-cart .quantity input[type="number"],
.woocommerce-cart .quantity input.qty {
width: 56px;
min-height: 46px;
font-size: 15px;
}
.woocommerce-cart .quantity .minus,
.woocommerce-cart .quantity .plus,
.woocommerce-cart .quantity button {
width: 44px;
min-height: 46px;
font-size: 20px;
font-weight: 500;
}
/* Santraukos antraštė ir turinys — su vidiniais tarpais */
.woocommerce-cart .cart-collaterals .cart_totals > h2,
.woocommerce-cart .cart_totals h2 {
padding: 0 0 12px !important;
margin: 0 0 14px !important;
background: transparent !important;
border-bottom: 1px solid var(--kor-line) !important;
}
.woocommerce-cart .cart_totals table.shop_table th,
.woocommerce-cart .cart_totals table.shop_table td {
padding-left: 0 !important;
padding-right: 0 !important;
}
/* Kupono laukas: toks pat kaip atsiskaitant, su plaukiojančia etikete */
.woocommerce-cart .kor-coupon-field {
position: relative;
display: block;
flex: 0 1 260px;
width: 260px;
max-width: 100%;
margin: 0;
padding: 0;
}
/* Ankstesnė taisyklė slėpė kupono etiketę (`display: none`) — dabar ji
naudojama kaip plaukiojanti, tad grąžinama */
.woocommerce-cart .kor-coupon-field > label {
display: block !important;
position: absolute !important;
left: 14px;
top: 17px;
z-index: 2;
width: auto !important;
height: auto !important;
margin: 0 !important;
padding: 0 !important;
clip: auto !important;
clip-path: none !important;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
max-width: calc(100% - 28px);
font-size: 15px;
font-weight: 400;
line-height: 1.2;
color: var(--kor-muted);
pointer-events: none;
transform-origin: left top;
transition: transform .18s var(--kor-ease), color .18s var(--kor-ease);
}
.woocommerce-cart .kor-coupon-field.kor-float-on > label {
transform: translateY(-9px) scale(.76);
color: var(--kor-green-dark);
font-weight: 600;
}
.woocommerce-cart .kor-coupon-field input#coupon_code {
width: 100% !important;
flex: none !important;
min-height: 52px;
padding: 24px 14px 8px !important;
border-radius: 10px !important;
border: 1.5px solid var(--kor-line) !important;
}
.woocommerce-cart .kor-coupon-field.kor-float input::placeholder {
opacity: 0;
}
.woocommerce-cart td.actions .coupon button {
min-height: 52px;
}
/* Klaidos pranešimas nusileidžia į savo eilutę po lauku */
.woocommerce-cart td.actions .coupon:has(.coupon-error-notice),
.woocommerce form.checkout_coupon:has(.coupon-error-notice) {
flex-wrap: wrap !important;
}
.woocommerce-cart td.actions .coupon .coupon-error-notice {
order: 9;
flex: 1 1 100%;
width: 100%;
}
/* ======================================================================
Krepšelio veiksmų eilutė su klaidos pranešimu
====================================================================== */
/* Kupono grupė lieka „inline" dėžute, tad klaida telpa po lauku, o
„atnaujinti" mygtukas nenukrenta žemyn. */
/* `overflow: hidden` sukuria atskirą formavimo kontekstą, todėl kupono
blokas atsistoja šalia dešinėn plaukiančio „atnaujinti" mygtuko, o ne
po juo. */
.woocommerce-cart td.actions .coupon {
display: flex !important;
flex-wrap: wrap !important;
align-items: center;
overflow: hidden;
text-align: left;
}
.woocommerce-cart td.actions .coupon .kor-coupon-field,
.woocommerce-cart td.actions .coupon > button {
order: 1;
}
.woocommerce-cart td.actions .coupon .coupon-error-notice {
order: 9;
flex: 1 1 100%;
width: 100%;
margin-top: 10px;
text-align: left !important;
}
.woocommerce-cart td.actions {
text-align: left !important;
}
.woocommerce-cart td.actions > button[name="update_cart"] {
float: right !important;
margin: 0 0 0 12px;
}
/* Kiekio valdiklis nebeužlipa ant sumos stulpelio */
.woocommerce-cart table.shop_table.cart td.product-name,
.woocommerce-cart table.shop_table.cart th.product-name {
width: 30%;
}
.woocommerce-cart table.shop_table.cart td.product-quantity,
.woocommerce-cart table.shop_table.cart th.product-quantity {
width: 24%;
}
.woocommerce-cart table.shop_table.cart td.product-price,
.woocommerce-cart table.shop_table.cart th.product-price {
width: 13%;
}
.woocommerce-cart table.shop_table.cart td.product-subtotal,
.woocommerce-cart table.shop_table.cart th.product-subtotal {
width: 15%;
padding-left: 10px;
}
.woocommerce-cart .quantity {
max-width: 100%;
}
/* ----------------------------------------------- veiksmų eilutės mygtukai */
/* Abu vienodo aukščio; „pritaikyti" — pagrindinis, „atnaujinti" — antrinis */
.woocommerce-cart td.actions .coupon button,
.woocommerce-cart td.actions > button[name="update_cart"] {
min-height: 52px;
height: 52px;
padding: 0 24px;
border-radius: 10px;
font-size: 14px;
font-weight: 700;
letter-spacing: .04em;
line-height: 1;
}
.woocommerce-cart td.actions .coupon button {
background-color: var(--kor-green) !important;
color: #fff !important;
border: 1.5px solid var(--kor-green) !important;
}
.woocommerce-cart td.actions .coupon button:hover {
background-color: var(--kor-green-dark) !important;
border-color: var(--kor-green-dark) !important;
}
.woocommerce-cart td.actions > button[name="update_cart"] {
background-color: #fff !important;
color: var(--kor-green-dark) !important;
border: 1.5px solid var(--kor-line-strong) !important;
box-shadow: none !important;
}
.woocommerce-cart td.actions > button[name="update_cart"]:hover:not(:disabled) {
border-color: var(--kor-green) !important;
background-color: var(--kor-green-soft) !important;
transform: translateY(-1px);
}
.woocommerce-cart td.actions > button[name="update_cart"]:disabled,
.woocommerce-cart td.actions > button[name="update_cart"][disabled] {
background-color: #fff !important;
color: var(--kor-muted) !important;
border-color: var(--kor-line) !important;
opacity: 1;
cursor: default;
transform: none;
}
/* ======================================================================
KREPŠELIS mobiliajame — lentelė virsta kortelėmis
====================================================================== */
@media (max-width: 768px) {
.woocommerce-cart table.shop_table.cart {
table-layout: auto;
display: block;
}
.woocommerce-cart table.shop_table.cart thead {
display: none;
}
.woocommerce-cart table.shop_table.cart tbody,
.woocommerce-cart table.shop_table.cart tfoot {
display: block;
width: 100%;
}
.woocommerce-cart table.shop_table.cart tbody tr.cart_item {
display: grid;
grid-template-columns: 72px minmax(0, 1fr);
grid-template-areas:
"thumb name"
"thumb price"
"qty qty"
"total total";
gap: 6px 14px;
position: relative;
margin: 0 0 14px;
padding: 14px 40px 14px 0;
border: 1px solid var(--kor-line);
border-radius: var(--kor-radius-sm);
}
.woocommerce-cart table.shop_table.cart tbody tr.cart_item td {
display: block;
width: auto !important;
padding: 0;
border: 0;
text-align: left;
}
.woocommerce-cart table.shop_table.cart td.product-remove {
grid-area: unset;
position: absolute;
top: 8px;
right: 8px;
}
.woocommerce-cart table.shop_table.cart td.product-thumbnail {
grid-area: thumb;
padding-left: 14px !important;
}
.woocommerce-cart table.shop_table.cart td.product-thumbnail img {
width: 72px;
max-width: none;
}
.woocommerce-cart table.shop_table.cart td.product-name {
grid-area: name;
font-weight: 600;
padding-right: 8px !important;
}
.woocommerce-cart table.shop_table.cart td.product-price {
grid-area: price;
color: var(--kor-muted);
}
.woocommerce-cart table.shop_table.cart td.product-quantity {
grid-area: qty;
padding: 6px 14px 0 !important;
}
.woocommerce-cart table.shop_table.cart td.product-subtotal {
grid-area: total;
padding: 0 14px !important;
font-size: 16px;
font-weight: 700;
color: var(--kor-green-dark);
}
/* „Kaina" ir „Suma" gauna paaiškinimą, nes antraštės nebėra */
.woocommerce-cart table.shop_table.cart td.product-price::before,
.woocommerce-cart table.shop_table.cart td.product-subtotal::before {
content: attr(data-title);
margin-right: 6px;
font-size: 12px;
font-weight: 600;
letter-spacing: .06em;
text-transform: uppercase;
color: var(--kor-muted);
}
.woocommerce-cart table.shop_table.cart td.product-subtotal::before {
display: block;
margin-bottom: 2px;
}
/* WooCommerce mobiliajame lygiuoja reikšmes dešinėn ir prideda savo
antraštes prieš kiekvieną langelį — mums to nereikia */
.woocommerce-cart table.shop_table.cart tbody tr.cart_item td {
text-align: left !important;
}
.woocommerce-cart table.shop_table.cart td.product-name::before,
.woocommerce-cart table.shop_table.cart td.product-quantity::before,
.woocommerce-cart table.shop_table.cart td.product-remove::before,
.woocommerce-cart table.shop_table.cart td.product-thumbnail::before {
content: none !important;
display: none !important;
}
/* Veiksmų eilutė */
.woocommerce-cart table.shop_table.cart tr:has(td.actions) {
display: block !important;
width: 100% !important;
}
.woocommerce-cart table.shop_table.cart td.actions {
display: flex !important;
flex-direction: column;
gap: 10px;
width: 100% !important;
padding: 4px 0 0 !important;
border: 0 !important;
}
.woocommerce-cart td.actions .coupon {
order: 1;
}
.woocommerce-cart td.actions > button[name="update_cart"] {
order: 2;
}
.woocommerce-cart td.actions .coupon {
display: flex !important;
flex-wrap: wrap !important;
overflow: visible;
gap: 10px;
width: 100%;
}
.woocommerce-cart td.actions .coupon .kor-coupon-field {
flex: 1 1 100%;
width: 100%;
}
.woocommerce-cart td.actions .coupon button,
.woocommerce-cart td.actions > button[name="update_cart"] {
flex: 1 1 100%;
width: 100%;
float: none !important;
margin: 0 0 10px !important;
}
.woocommerce-cart td.actions > button[name="update_cart"] {
order: 9;
margin: 0 !important;
}
}
/* ----------------------------------------------------------------------
Veiksmų eilutė: laukas ir abu mygtukai — tikslus 52 px aukštis ir
bendra viršutinė riba. `.form-row` klasė laukui atsinešdavo savo
paraštes ir 32 px eilutės aukštį, todėl jis buvo 60 px.
---------------------------------------------------------------------- */
.woocommerce-cart td.actions .coupon {
align-items: flex-start !important;
}
.woocommerce-cart td.actions .kor-coupon-field {
height: 52px;
margin: 0 !important;
padding: 0 !important;
line-height: normal;
}
.woocommerce-cart td.actions .kor-coupon-field input#coupon_code {
height: 52px !important;
min-height: 52px !important;
margin: 0 !important;
padding: 22px 14px 6px !important;
line-height: 20px;
}
.woocommerce-cart td.actions .kor-coupon-field > label {
top: 14px;
}
.woocommerce-cart td.actions .coupon button,
.woocommerce-cart td.actions > button[name="update_cart"] {
align-self: flex-start;
height: 52px !important;
min-height: 52px !important;
margin-top: 0 !important;
margin-bottom: 0 !important;
}
@media (max-width: 768px) {
.woocommerce-cart td.actions .kor-coupon-field,
.woocommerce-cart td.actions .kor-coupon-field input#coupon_code {
width: 100% !important;
}
}
/* Kupono blokas neturi turėti savo aukščio: stulpelio išdėstyme (mobilus)
ankstesnis `flex: 1 1 320px` virsdavo 320 px aukščio tarpu. */
.woocommerce-cart td.actions .coupon {
flex: 0 0 auto !important;
align-content: flex-start;
}
/* ======================================================================
Mobiliojo atsiskaitymo tarpai ir pristatymo eilutės
====================================================================== */
/* Tuščias antrasis stulpelis paliekdavo 36 px tarpą po paskutine kortele */
.woocommerce-checkout form.checkout #customer_details .col-2:not(:has(*)) {
display: none !important;
}
/* Po „Apmokėti" nereikia papildomos paraštės */
.woocommerce-checkout .kor-card--payment #payment .place-order {
padding-bottom: 0 !important;
margin-bottom: 0 !important;
}
.woocommerce-checkout .kor-card--payment #payment {
margin-bottom: 0 !important;
}
@media (max-width: 768px) {
/* Pavadinimas laužiasi, logotipas visada lieka dešinėje toje pačioje
eilutėje — kitaip vienose eilutėse jis inline, kitose nukrenta */
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li > label {
flex-wrap: nowrap !important;
align-items: center;
}
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li .multiparcels-carrier-icon-image-holder {
flex: 0 0 auto;
/* `auto` stumia dėžutę prie dešinio krašto — fiksuota paraštė ją
palikdavo iškart po pavadinimu, todėl eilutės nesutapo */
margin-left: auto !important;
}
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li .multiparcels-carrier-icon-image-holder img {
max-width: 62px;
max-height: 20px;
}
/* Paaiškinimo eilutė vis tiek turi eiti per visą plotį */
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li .kor-method-note {
flex: 1 1 100%;
width: 100%;
}
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li > label:has(.kor-method-note) {
flex-wrap: wrap !important;
}
}
/* ======================================================================
Šalies laukas: etiketė virš lauko, ne ant jo.
select2 pats piešia savo dėžutę su „z-index: 9999" ir savo aukščiu, o
plaukiojanti etiketė ant jos nepatikimai laikėsi (mobiliajame dingdavo).
====================================================================== */
.woocommerce-checkout .kor-card #billing_country_field,
.woocommerce-checkout .kor-card #shipping_country_field {
position: relative;
}
.woocommerce-checkout .kor-card #billing_country_field > label,
.woocommerce-checkout .kor-card #shipping_country_field > label {
position: static !important;
display: block !important;
z-index: auto;
margin: 0 0 6px !important;
padding: 0 !important;
font-size: 12.5px !important;
font-weight: 600 !important;
line-height: 1.3 !important;
color: var(--kor-green-dark) !important;
max-width: none;
overflow: visible;
white-space: normal;
}
.woocommerce-checkout .kor-card .select2-container .select2-selection--single,
.woocommerce-checkout .kor-card .select2-container--default .select2-selection--single {
height: 52px !important;
}
.woocommerce-checkout .kor-card .select2-container .select2-selection__rendered,
.woocommerce-checkout .kor-card .select2-container--default .select2-selection--single .select2-selection__rendered {
padding: 0 32px 0 14px !important;
line-height: 48px !important;
}
.woocommerce-checkout .kor-card .select2-container--default .select2-selection--single .select2-selection__arrow {
height: 50px !important;
}
/* ======================================================================
Mobilaus krepšelio prekės kortelė
====================================================================== */
@media (max-width: 768px) {
.woocommerce-cart table.shop_table.cart tbody tr.cart_item {
grid-template-columns: 76px minmax(0, 1fr);
gap: 4px 16px;
padding: 14px 40px 14px 14px;
align-content: start;
}
.woocommerce-cart table.shop_table.cart td.product-thumbnail {
grid-row: 1 / span 2;
padding: 0 !important;
}
.woocommerce-cart table.shop_table.cart td.product-thumbnail img {
width: 76px;
border-radius: 8px;
}
.woocommerce-cart table.shop_table.cart td.product-name {
padding: 0 !important;
align-self: start;
}
.woocommerce-cart table.shop_table.cart td.product-price {
padding: 0 !important;
align-self: start;
}
.woocommerce-cart table.shop_table.cart td.product-quantity {
padding: 10px 0 0 !important;
}
.woocommerce-cart table.shop_table.cart td.product-subtotal {
padding: 4px 0 0 !important;
}
}
/* Kairysis stulpelis atsinešdavo 18 px vidinę ir 29 px išorinę paraštę,
kurios mobiliajame susidėdavo su tinklelio tarpu į 67 px */
.woocommerce-checkout form.checkout #customer_details {
padding: 0 !important;
margin: 0 !important;
}
.woocommerce-checkout form.checkout #customer_details .col-1,
.woocommerce-checkout form.checkout #customer_details .col-2 {
padding: 0 !important;
margin: 0 !important;
}
/* WooCommerce `.col2-set` turi clearfix pseudo-elementus (`display: table`).
Flex konteineryje jie tampa elementais ir prie kiekvieno prisideda
tarpas — todėl virš ir po stulpeliu atsirasdavo po 18 px. */
.woocommerce-checkout form.checkout #customer_details::before,
.woocommerce-checkout form.checkout #customer_details::after,
.woocommerce-checkout form.checkout #customer_details .col-1::before,
.woocommerce-checkout form.checkout #customer_details .col-1::after,
.woocommerce-checkout form.checkout #customer_details .col-2::before,
.woocommerce-checkout form.checkout #customer_details .col-2::after,
.woocommerce-checkout form.checkout #order_review::before,
.woocommerce-checkout form.checkout #order_review::after {
content: none !important;
display: none !important;
}
/* Vežėjų logotipai — vienodo dydžio dėžutė, kad eilutės atrodytų tvarkingai */
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li .multiparcels-carrier-icon-image-holder,
.woocommerce-cart #shipping_method li .multiparcels-carrier-icon-image-holder {
display: flex !important;
align-items: center;
justify-content: flex-end;
flex: 0 0 auto;
width: 72px;
height: 24px;
}
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li .multiparcels-carrier-icon-image-holder img,
.woocommerce-cart #shipping_method li .multiparcels-carrier-icon-image-holder img {
max-width: 72px;
max-height: 24px;
width: auto;
height: auto;
object-fit: contain;
object-position: right center;
}
@media (max-width: 768px) {
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li > label {
align-items: center !important;
}
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li .multiparcels-carrier-icon-image-holder {
width: 64px;
height: 22px;
}
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li .multiparcels-carrier-icon-image-holder img {
max-width: 64px;
max-height: 22px;
}
}
/* Logotipo dėžutė visada prisispaudžia prie dešinio eilutės krašto */
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li .multiparcels-carrier-icon-image-holder,
.woocommerce-cart #shipping_method li .multiparcels-carrier-icon-image-holder {
margin-left: auto !important;
margin-right: 0 !important;
}
/* Pavadinimas užima likusį plotį, kad tarp jo ir logotipo nebūtų
atsitiktinio tarpo */
.woocommerce-checkout form.checkout .kor-card--shipping #shipping_method li > label {
justify-content: flex-start;
}
/* ======================================================================
Prisijungimo forma atsiskaitymo puslapyje
====================================================================== */
.woocommerce-checkout form.woocommerce-form-login {
display: block;
margin: 0 0 20px;
padding: 22px;
border: 1px solid var(--kor-line);
border-radius: var(--kor-radius);
background: #fff;
box-shadow: var(--kor-shadow);
}
.woocommerce-checkout form.woocommerce-form-login > p:first-child {
margin: 0 0 18px;
font-size: 14.5px;
line-height: 1.5;
color: var(--kor-muted);
}
/* Laukai vienas po kitu, ne šalia */
.woocommerce-checkout form.woocommerce-form-login .form-row-first,
.woocommerce-checkout form.woocommerce-form-login .form-row-last,
.woocommerce-checkout form.woocommerce-form-login .form-row {
width: 100% !important;
max-width: 460px;
float: none !important;
margin: 0 0 14px !important;
padding: 0 !important;
}
/* Plaukiojanti etiketė kaip visame checkout'e */
.woocommerce-checkout form.woocommerce-form-login .form-row.kor-float {
position: relative;
}
.woocommerce-checkout form.woocommerce-form-login .form-row.kor-float > label {
position: absolute;
left: 14px;
top: 17px;
margin: 0;
padding: 0;
max-width: calc(100% - 28px);
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
font-size: 15px;
font-weight: 400;
line-height: 1.2;
color: var(--kor-muted);
pointer-events: none;
transform-origin: left top;
transition: transform .18s var(--kor-ease), color .18s var(--kor-ease);
z-index: 2;
}
.woocommerce-checkout form.woocommerce-form-login .form-row.kor-float.kor-float-on > label {
transform: translateY(-9px) scale(.76);
color: var(--kor-green-dark);
font-weight: 600;
}
.woocommerce-checkout form.woocommerce-form-login .form-row.kor-float input.input-text {
width: 100%;
min-height: 56px;
padding: 24px 14px 8px !important;
border-radius: 10px !important;
border: 1.5px solid var(--kor-line) !important;
}
.woocommerce-checkout form.woocommerce-form-login .form-row.kor-float input::placeholder {
opacity: 0;
}
/* „Prisiminti mane" — varnelė lygiuojasi su tekstu */
.woocommerce-checkout form.woocommerce-form-login .woocommerce-form-login__rememberme {
display: flex !important;
align-items: center;
gap: 10px;
margin: 4px 0 16px !important;
line-height: 22px;
font-weight: 400;
cursor: pointer;
}
.woocommerce-checkout form.woocommerce-form-login .woocommerce-form-login__rememberme input[type="checkbox"] {
margin: 0;
flex: 0 0 auto;
}
.woocommerce-checkout form.woocommerce-form-login .woocommerce-form-login__rememberme span {
line-height: 22px;
}
/* Mygtukas ir „pamiršau slaptažodį" */
.woocommerce-checkout form.woocommerce-form-login button[name="login"] {
min-height: 50px;
padding: 0 28px;
border-radius: 10px;
margin: 0;
}
.woocommerce-checkout form.woocommerce-form-login .lost_password {
margin: 14px 0 0;
font-size: 14px;
}
.woocommerce-checkout form.woocommerce-form-login .lost_password a {
color: var(--kor-green-dark);
text-decoration: underline;
text-underline-offset: 2px;
}
/* Slaptažodžio rodymo mygtukas lauke */
.woocommerce-checkout form.woocommerce-form-login .password-input {
display: block;
position: relative;
width: 100%;
}
.woocommerce-checkout form.woocommerce-form-login .show-password-input {
top: 50% !important;
transform: translateY(-50%);
}
/* ====================================================== PRISTATYMAS Į UŽSIENĮ */
/* Kai pasirenkama ne Lietuva, pristatymo būdų sąrašas lieka tuščias — vietoje
tylos pirkėjas turi gauti aiškų kelią toliau. */
.kor-intl-notice[hidden] {
display: none !important;
}
.kor-intl-notice {
display: flex;
gap: 14px;
align-items: flex-start;
margin: 20px 0 0;
padding: 18px 20px;
background: var(--kor-tint);
border: 1px solid var(--kor-line);
border-left: 4px solid var(--kor-green);
border-radius: var(--kor-radius);
}
.kor-intl-notice__icon {
flex: 0 0 auto;
display: block;
width: 24px;
min-width: 24px;
height: 24px;
margin-top: 1px;
color: var(--kor-green);
}
/* Tema ir įskiepiai kartais primeta savo `fill` visiems SVG — čia to neleidžiam. */
.kor-intl-notice__icon svg {
display: block;
width: 24px;
height: 24px;
}
.kor-intl-notice__icon svg path {
fill: currentColor !important;
stroke: none !important;
}
.kor-intl-notice__body {
min-width: 0;
}
.kor-intl-notice__title {
margin: 0 0 4px;
font-size: 16px;
font-weight: 700;
line-height: 1.3;
color: var(--kor-ink);
}
.kor-intl-notice__text {
margin: 0;
font-size: 14.5px;
line-height: 1.55;
color: var(--kor-muted);
}
.kor-intl-notice__cta {
display: inline-flex;
align-items: center;
gap: 8px;
margin-top: 12px;
padding: 10px 20px;
font-size: 14.5px;
font-weight: 600;
line-height: 1;
color: #fff !important;
text-decoration: none;
background: var(--kor-green);
border-radius: 999px;
transition: background .2s var(--kor-ease), transform .2s var(--kor-ease);
}
.kor-intl-notice__cta::after {
content: "→";
font-size: 15px;
transition: transform .2s var(--kor-ease);
}
.kor-intl-notice__cta:hover,
.kor-intl-notice__cta:focus-visible {
background: var(--kor-green-dark);
transform: translateY(-1px);
}
.kor-intl-notice__cta:hover::after,
.kor-intl-notice__cta:focus-visible::after {
transform: translateX(3px);
}
/* Pristatymo eilutėje (kai būdų nėra) blokas jau yra siaurame stulpelyje. */
.woocommerce-shipping-totals .kor-intl-notice,
.kor-ship-slot .kor-intl-notice {
margin-top: 0;
padding: 16px;
}
@media (max-width: 600px) {
.kor-intl-notice {
flex-direction: column;
gap: 10px;
padding: 16px;
}
.kor-intl-notice__cta {
width: 100%;
justify-content: center;
}
}
@media (prefers-reduced-motion: reduce) {
.kor-intl-notice__cta,
.kor-intl-notice__cta::after {
transition: none;
transform: none !important;
}
}
/* Kai pristatymo į pasirinktą šalį nėra, užsakymo mygtukas atrodo neaktyvus,
bet lieka paspaudžiamas — paspaudus nuvedama prie paaiškinimo. */
.kor-order-blocked {
opacity: .45;
cursor: not-allowed;
filter: grayscale(1);
}
.kor-order-blocked:hover,
.kor-order-blocked:focus-visible {
opacity: .45;
transform: none;
}
.kor-intl-notice--flash {
animation: kor-intl-flash 1.4s var(--kor-ease);
}
@keyframes kor-intl-flash {
0%, 100% { box-shadow: 0 0 0 0 rgba(68, 145, 65, 0); }
25% { box-shadow: 0 0 0 5px rgba(68, 145, 65, .35); }
}
@media (prefers-reduced-motion: reduce) {
.kor-intl-notice--flash {
animation: none;
}
}
/* ----------------------------------------------------------------------
Paysera payment method list.
The plugin paints its block in its own colours (blue, Manrope), and our
shared field and radio rules break its country field and reveal radios
it hides next to the method names. Everything here aligns it with checkout.
---------------------------------------------------------------------- */
/* Full card width instead of being indented under the gateway radio */
.woocommerce-checkout form.checkout .kor-card--payment #payment ul.payment_methods li.payment_method_paysera-smart-checkout-woocommerce .payment_box {
width: calc(100% + 34px) !important;
max-width: none !important;
margin: 12px 0 2px -34px !important;
}
@media (max-width: 600px) {
.woocommerce-checkout form.checkout .kor-card--payment #payment ul.payment_methods li.payment_method_paysera-smart-checkout-woocommerce .payment_box {
width: calc(100% + 32px) !important;
margin-left: -32px !important;
}
}
#paysera-payment-element,
#paysera-payment-element .paysera-payment-country-select,
#paysera-payment-element .paysera-payment-country-select__control {
font-family: inherit !important;
}
#paysera-payment-element .paysera-payment-methods__loading {
color: var(--kor-muted);
font-size: 14px;
}
/* Country selector */
#paysera-payment-element .paysera-payment-country-select__control {
min-height: 44px !important;
padding-left: 12px !important;
border: 1.5px solid var(--kor-line) !important;
border-radius: var(--kor-radius-sm) !important;
background: #fff !important;
box-shadow: none !important;
color: var(--kor-muted) !important;
font-size: 14px !important;
cursor: pointer;
transition: border-color .2s var(--kor-ease), box-shadow .2s var(--kor-ease);
}
#paysera-payment-element .paysera-payment-country-select__control:hover {
border-color: var(--kor-line-strong) !important;
}
#paysera-payment-element .paysera-payment-country-select__control:focus-within {
border-color: var(--kor-green) !important;
box-shadow: 0 0 0 4px rgba(68, 145, 65, .16) !important;
}
#paysera-payment-element .paysera-payment-country-select__control [class*="-singleValue"] {
color: var(--kor-ink) !important;
font-weight: 600;
}
/* Search input: no shared field border, height or padding
(those drew the vertical line between the label and the country) */
.woocommerce-checkout .kor-card #paysera-payment-element input[role="combobox"] {
height: auto !important;
min-height: 0 !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
border-radius: 0 !important;
background: transparent !important;
box-shadow: none !important;
}
#paysera-payment-element .paysera-payment-country-select [class*="-menu"] {
border: 1px solid var(--kor-line);
border-radius: var(--kor-radius-sm) !important;
box-shadow: var(--kor-shadow) !important;
overflow: hidden;
z-index: 30 !important;
}
#paysera-payment-element .paysera-payment-country-select [class*="-option"] {
font-size: 14px !important;
cursor: pointer;
}
#paysera-payment-element .paysera-payment-country-select [class*="-option"]:hover {
background: var(--kor-tint) !important;
color: var(--kor-ink) !important;
}
#paysera-payment-element .paysera-payment-country-select [class*="-option"][aria-selected="true"] {
background: var(--kor-green-soft) !important;
color: var(--kor-green-dark) !important;
font-weight: 600;
}
/* Info icon in the site palette instead of blue */
#paysera-payment-methods-container .paysera-information-hint__trigger {
color: var(--kor-muted) !important;
}
#paysera-payment-methods-container .paysera-information-hint__trigger:hover {
color: var(--kor-green) !important;
background: var(--kor-green-soft) !important;
}
#paysera-payment-methods-container .paysera-information-hint__icon {
fill: currentColor !important;
width: 20px !important;
height: 20px !important;
}
/* Payment method cards */
#paysera-payment-element div.paysera-radio-control {
--pm-border: var(--kor-line);
--pm-border-hover: var(--kor-line-strong);
--pm-border-selected: var(--kor-green);
--pm-text: var(--kor-ink);
--pm-muted: var(--kor-muted);
--pm-bg-hover: var(--kor-tint);
--pm-ring: rgba(68, 145, 65, .22);
--pm-font: inherit;
display: flex;
flex-direction: column;
gap: 8px;
margin-top: 12px;
}
#paysera-payment-element div.paysera-radio-control .radio-control__option {
align-items: center;
gap: 12px;
margin: 0;
padding: 12px 14px;
border: 1.5px solid var(--kor-line);
border-radius: var(--kor-radius-sm);
background: #fff;
}
#paysera-payment-element div.paysera-radio-control .radio-control__option:hover {
border-color: var(--kor-line-strong);
background: var(--kor-tint);
}
#paysera-payment-element div.paysera-radio-control .radio-control__option:has(input[type="radio"]:checked) {
border-color: var(--kor-green);
background: #fff;
box-shadow: 0 0 0 3px rgba(68, 145, 65, .16);
}
#paysera-payment-element div.paysera-radio-control .radio-control__option-layout {
flex: 1 1 auto;
min-width: 0;
}
#paysera-payment-element div.paysera-radio-control .radio-control__option-layout .radio-control__option-group {
grid-template-columns: 36px minmax(0, 1fr);
gap: 12px;
}
#paysera-payment-element div.paysera-radio-control .radio-control__option-layout .radio-control__icon {
block-size: 36px;
inline-size: 36px;
border-color: var(--kor-line);
background: #fff;
overflow: hidden;
}
#paysera-payment-element div.paysera-radio-control .radio-control__option-layout .radio-control__icon img {
block-size: 36px;
inline-size: 36px;
}
#paysera-payment-element div.paysera-radio-control .radio-control__option-layout .radio-control__label {
color: var(--kor-ink);
font-size: 15px;
font-weight: 600;
}
/* Selection radio on the right of the card, not stuck to the method name */
#paysera-payment-element div.paysera-radio-control .radio-control__option input[type="radio"] {
display: grid !important;
position: static !important;
flex: 0 0 auto;
margin: 0 0 0 auto !important;
transform: none !important;
}
/* Paysera service terms below the list */
#paysera-payment-element .paysera-customer-consent {
margin-top: 12px;
}
#paysera-payment-element .paysera-customer-consent__text {
color: var(--kor-muted);
font-size: 13px;
line-height: 1.5;
}
#paysera-payment-element .paysera-customer-consent__text a {
color: var(--kor-green-dark);
}
/* Long method names wrap instead of running under the radio (e.g. "LKU Credit Union") */
#paysera-payment-element div.paysera-radio-control .radio-control__option-layout {
flex: 1 1 0;
overflow: hidden;
}
#paysera-payment-element div.paysera-radio-control .radio-control__option-layout .radio-control__label {
white-space: normal;
overflow: visible;
text-overflow: clip;
overflow-wrap: anywhere;
line-height: 1.25;
}
/* Gateway title stays on one line; on narrow screens the Paysera logo gets its own row
below the title instead of being clipped at the card edge. The plugin stylesheet loads
after the theme with equally specific flex rules, hence !important. */
.woocommerce-checkout #payment li.payment_method_paysera-smart-checkout-woocommerce > label[for="payment_method_paysera-smart-checkout-woocommerce"] {
white-space: nowrap;
}
@media (max-width: 600px) {
.woocommerce-checkout #payment li.payment_method_paysera-smart-checkout-woocommerce > label[for="payment_method_paysera-smart-checkout-woocommerce"] {
flex-wrap: wrap !important;
row-gap: 4px;
}
.woocommerce-checkout #payment li.payment_method_paysera-smart-checkout-woocommerce > label[for="payment_method_paysera-smart-checkout-woocommerce"] img {
flex: 0 0 100% !important;
}
}
|