/* ~~~~~~~~~~ "Buy SIM" + WhatsApp buttons ~~~~~~~~~~ */
/* Plain CSS, loaded by inc/mobilka-sales.php (not part of the webpack build) */

:root {
    --mobilka-buy: #d20e0e;
    --mobilka-buy-hover: #b00b0b;
    --mobilka-whatsapp: #1e9e4a;
    --mobilka-whatsapp-hover: #178a3f;
}

.mobilka-cta {
    margin-top: 2rem;
}

.mobilka-cta__price {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: .25rem .75rem;
    margin-bottom: 1rem;
}

.mobilka-cta__price-value {
    font-size: 2rem;
    font-weight: 900;
    line-height: 1;
    color: var(--mobilka-buy);
}

/* Prices with small decimals (mobilka_price_small_decimals): one ratio everywhere, decimals = .64 of the price */
.mobilka-price__decimals {
    font-size: .64em;
}

.mobilka-cta__price-note {
    font-size: .9375rem;
    font-weight: 700;
}

.mobilka-cta__buttons {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
}

/* Small link under the buttons (hero: "Tariffs by country"), styled like "Prices by country" of the Calling Cards */
.mobilka-cta__link {
    margin: .75rem 0 0;
    font-size: .875rem;
    line-height: 1.35;
    text-align: center;
}

.mobilka-cta__link a {
    color: #0a7fb0;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.mobilka-cta__link a::after {
    content: " ↗";
}

.mobilka-cta__button {
    flex: 1 1 10rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    min-height: 3rem;
    padding: .625rem 1rem;
    border-radius: .5rem;
    font-size: 1.0625rem;
    font-weight: 700;
    line-height: 1.2;
    color: #fff;
    text-decoration: none;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .15);
    transition: background-color .15s ease, transform .15s ease;
}

.mobilka-cta__button:hover,
.mobilka-cta__button:focus {
    color: #fff;
    text-decoration: none;
}

.mobilka-cta__button:focus-visible {
    outline: 3px solid #07C4FF;
    outline-offset: 2px;
}

.mobilka-cta__button:active {
    transform: translateY(1px);
}

.mobilka-cta__button--buy {
    background-color: var(--mobilka-buy);
}

.mobilka-cta__button--buy:hover,
.mobilka-cta__button--buy:focus {
    background-color: var(--mobilka-buy-hover);
}

.mobilka-cta__button--whatsapp {
    background-color: var(--mobilka-whatsapp);
}

.mobilka-cta__button--whatsapp:hover,
.mobilka-cta__button--whatsapp:focus {
    background-color: var(--mobilka-whatsapp-hover);
}

.mobilka-cta__icon {
    flex: none;
    width: 1.375rem;
    height: 1.375rem;
}


/* ~~~~~~~~~~ Sticky WhatsApp bar ~~~~~~~~~~ */
/* Mobile: full-width bar at the bottom; desktop: compact button bottom left (Tawk chat is bottom right).
   Hidden until the visitor scrolled (body.mobilka-sticky-visible, js/mobilka-sales.js).

   The cookie settings button of Usercentrics/eRecht24 (fingerprint) is fixed bottom left as well:
   mobile 44px at 24px from the edges, desktop 64px at 40px (set in the Usercentrics admin, not here).
   The bar leaves room for it: on mobile it sits inside the white bar on the left,
   on desktop the WhatsApp button stands right next to it, vertically centered. */

:root {
    --mobilka-privacy-size: 44px;
    --mobilka-privacy-offset: 24px;
}

@media (min-width: 768px) {
    :root {
        --mobilka-privacy-size: 64px;
        --mobilka-privacy-offset: 40px;
    }
}

.mobilka-sticky-cta {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1030;
    /* bottom padding puts the button's center at the height of the cookie button's center */
    padding: .625rem 1rem calc(var(--mobilka-privacy-offset) + var(--mobilka-privacy-size) / 2 - 1.375rem) calc(var(--mobilka-privacy-offset) + var(--mobilka-privacy-size) + .75rem);
    background-color: #fff;
    box-shadow: 0 -2px 10px rgba(0, 0, 0, .12);
    transform: translateY(110%);
    visibility: hidden;
    transition: transform .2s ease, visibility .2s;
}

body.mobilka-sticky-visible .mobilka-sticky-cta {
    transform: none;
    visibility: visible;
}

.mobilka-cta--compact {
    margin-top: 0;
}

.mobilka-cta--compact .mobilka-cta__buttons {
    flex-wrap: nowrap;
    gap: .5rem;
}

.mobilka-cta--compact .mobilka-cta__button {
    flex: 1 1 0;
    min-width: 0;
    min-height: 2.75rem;
    padding: .5rem .75rem;
    font-size: 1rem;
}

@media (min-width: 768px) {
    /* right of the cookie button, centered on it (button height 2.75rem) */
    .mobilka-sticky-cta {
        left: calc(var(--mobilka-privacy-offset) + var(--mobilka-privacy-size) + 1rem);
        right: auto;
        bottom: calc(var(--mobilka-privacy-offset) + var(--mobilka-privacy-size) / 2 - 1.375rem);
        padding: 0;
        background: transparent;
        box-shadow: none;
        transform: translateY(150%);
    }

    .mobilka-sticky-cta .mobilka-cta__button {
        padding: .625rem 1.25rem;
        border-radius: 999px;
        box-shadow: 0 6px 20px rgba(0, 0, 0, .25);
    }
}

/* Room for the bar at the end of the page: on the footer (padding on <body> showed the blue page background) */
@media (max-width: 767.98px) {
    body.has-sticky-cta .main-footer {
        padding-bottom: calc(5.5rem + env(safe-area-inset-bottom)) !important;
    }
}

/* Light WhatsApp button (hero card): secondary to the red "Buy SIM" */
.mobilka-cta__button--whatsapp-light,
.mobilka-cta__button--whatsapp-light:hover,
.mobilka-cta__button--whatsapp-light:focus {
    border: 2px solid #1e9e4a;
    background-color: #eaf7ee;
    color: #157a38;
    box-shadow: none;
}

.mobilka-cta__button--whatsapp-light:hover,
.mobilka-cta__button--whatsapp-light:focus {
    background-color: #d8f0df;
    color: #157a38;
}


/* ~~~~~~~~~~ Product cards in categories (SIM card, Calling Cards) ~~~~~~~~~~ */

.mobilka-products {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin: 0;
    padding: 1rem;
}

@media (min-width: 992px) {
    .mobilka-products {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 1.5rem;
        padding: 2rem;
    }
}

/* Delivery note shared by all products of the category (shown once) */
.mobilka-products-note {
    margin: 1rem 1rem 0;
    padding: .75rem 1rem;
    border-left: 4px solid #07C4FF;
    border-radius: .375rem;
    background: #eef9fe;
    font-size: .9375rem;
    line-height: 1.45;
}

.mobilka-products-note p:last-child {
    margin-bottom: 0;
}

@media (min-width: 992px) {
    .mobilka-products-note {
        margin: 2rem 2rem 0;
    }
}


/* ~~~~~~~~~~ Cart bar (template-parts/components/cart-bar.php) ~~~~~~~~~~ */
/* Phones: in the bottom bar, right of the WhatsApp button (icon only then); desktop: pill bottom right. */

.mobilka-cartbar {
    position: fixed;
    right: 1rem;
    bottom: calc(.625rem + env(safe-area-inset-bottom, 0px));
    left: calc(1rem + 2.75rem + .5rem);
    z-index: 1031;
}

.mobilka-cartbar[hidden] {
    display: none;
}

.mobilka-cartbar__link {
    display: flex;
    align-items: center;
    gap: .625rem;
    min-height: 2.75rem;
    padding: .25rem .875rem .25rem .625rem;
    border-radius: .5rem;
    background: var(--mobilka-buy);
    color: #fff;
    text-decoration: none;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .15);
    transition: background-color .15s ease;
}

.mobilka-cartbar__link:hover,
.mobilka-cartbar__link:focus {
    background: var(--mobilka-buy-hover);
    color: #fff;
    text-decoration: none;
}

.mobilka-cartbar__link:focus-visible {
    outline: 3px solid #07C4FF;
    outline-offset: 2px;
}

.mobilka-cartbar__icon {
    position: relative;
    flex: none;
    width: 1.5rem;
    height: 1.5rem;
}

.mobilka-cartbar__icon svg {
    width: 100%;
    height: 100%;
}

.mobilka-cartbar__count {
    position: absolute;
    top: -.375rem;
    right: -.5rem;
    min-width: 1.125rem;
    height: 1.125rem;
    padding: 0 .25rem;
    border-radius: 999px;
    background: #fff;
    color: var(--mobilka-buy);
    font-size: .6875rem;
    font-weight: 900;
    line-height: 1.125rem;
    text-align: center;
}

.mobilka-cartbar__text {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-width: 0;
    line-height: 1.15;
}

.mobilka-cartbar__label {
    font-size: .75rem;
    opacity: .85;
}

.mobilka-cartbar__total {
    font-size: 1rem;
    font-weight: 900;
    white-space: nowrap;
    transition: opacity .2s ease;
}

/* count already updated on "Add to cart", the total follows with the response (js/mobilka-sales.js) */
.mobilka-cartbar.is-updating .mobilka-cartbar__total {
    opacity: .4;
}

.mobilka-cartbar__go {
    flex: none;
    font-size: 1rem;
    font-weight: 700;
    white-space: nowrap;
}

/* short pulse after "Add to cart" */
.mobilka-cartbar.is-bumped .mobilka-cartbar__link {
    animation: mobilka-cartbar-bump .45s ease;
}

@keyframes mobilka-cartbar-bump {
    40% { transform: scale(1.04); }
}

@media (prefers-reduced-motion: reduce) {
    .mobilka-cartbar.is-bumped .mobilka-cartbar__link {
        animation: none;
    }
}

/* Phones: with items in the cart the bottom bar is always shown, WhatsApp as a square icon on the left */
@media (max-width: 767.98px) {
    body.mobilka-has-cart .mobilka-sticky-cta {
        transform: none;
        visibility: visible;
    }

    body.mobilka-has-cart .mobilka-sticky-cta .mobilka-cta__buttons {
        justify-content: flex-start;
    }

    body.mobilka-has-cart .mobilka-sticky-cta .mobilka-cta__button {
        flex: none;
        width: 2.75rem;
        padding: 0;
    }

    body.mobilka-has-cart .mobilka-sticky-cta .mobilka-cta__button span {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
    }
}

@media (min-width: 768px) {
    .mobilka-cartbar {
        right: 1.5rem;
        bottom: 1.5rem;
        left: auto;
    }

    .mobilka-cartbar__link {
        gap: .875rem;
        min-height: 3.25rem;
        padding: .375rem 1.25rem .375rem 1rem;
        border-radius: 999px;
        box-shadow: 0 6px 20px rgba(0, 0, 0, .25);
    }

    .mobilka-cartbar__go {
        padding-left: .875rem;
        border-left: 1px solid rgba(255, 255, 255, .35);
    }
}


/* ~~~~~~~~~~ Tariff pages ~~~~~~~~~~ */

.mobilka-whatsapp-activate {
    width: 100%;
    max-width: 22rem;
    margin-top: 1.5rem;
}

.mobilka-sim-strip {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem 2rem;
    margin: 0 0 4rem;
    padding: 1.5rem;
    border-radius: .75rem;
    background: #fff;
    box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
}

.mobilka-sim-strip__text {
    display: flex;
    flex: 1 1 18rem;
    flex-direction: column;
    gap: .25rem;
    font-size: 1rem;
}

.mobilka-sim-strip__text strong {
    font-size: 1.375rem;
    font-weight: 900;
}

.mobilka-cta.mobilka-sim-strip__cta {
    flex: 1 1 20rem;
    margin-top: 0;
}


/* ~~~~~~~~~~ Checkout ~~~~~~~~~~ */
/* Order: summary -> payment -> express -> customer fields -> order table + checkbox + button (woocommerce/checkout/form-checkout.php).
   The look of the client mockup (10/2026) is in css/design/checkout.css. */

.mobilka-checkout {
    font-size: .9375rem;
}

.mobilka-checkout h3,
.mobilka-checkout #order_payment_heading {
    margin: 1.5rem 0 .75rem !important;
    font-size: 1.125rem !important;
    font-weight: 900;
    line-height: 1.3;
}

/* Checkout and cart: position: sticky is disabled by overflow: hidden on ancestors: the theme's <main>, <body> and
   <html class="mm-wrapper"> (mobile menu). "clip" still clips but is not a scroll container.
   Only on checkout and only while the mobile menu is closed; old browsers keep "hidden" (no sticky). */
body.woocommerce-checkout main,
body.woocommerce-cart main {
    overflow: clip !important;
}

html:has(body.woocommerce-checkout):not(.mm-wrapper_opened),
html:has(body.woocommerce-cart):not(.mm-wrapper_opened),
html:not(.mm-wrapper_opened) body.woocommerce-checkout,
html:not(.mm-wrapper_opened) body.woocommerce-cart {
    overflow-x: clip !important;
    overflow-y: visible !important;
}

@media (min-width: 992px) {
    .mobilka-checkout-summary {
        position: sticky;
        /* below the fixed site header; the real height is set by js/mobilka-sales.js */
        top: var(--mobilka-header-offset, 9.5rem);
        margin-top: 1.5rem;
    }
}

/* Order tables (summary + the one Germanized prints right before the button) */
.mobilka-checkout table.woocommerce-checkout-review-order-table {
    width: 100%;
    margin: 0 !important;
    border: 0 !important;
    font-size: .875rem;
}

.mobilka-checkout table.woocommerce-checkout-review-order-table th,
.mobilka-checkout table.woocommerce-checkout-review-order-table td {
    padding: .4rem 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    vertical-align: top;
    font-size: .875rem !important;
}

.mobilka-checkout table.woocommerce-checkout-review-order-table thead {
    display: none;
}

.mobilka-checkout table.woocommerce-checkout-review-order-table td:last-child,
.mobilka-checkout table.woocommerce-checkout-review-order-table th + td {
    text-align: right;
    white-space: nowrap;
}

.mobilka-checkout table.woocommerce-checkout-review-order-table .order-total th,
.mobilka-checkout table.woocommerce-checkout-review-order-table .order-total td {
    font-size: 1rem !important;
    font-weight: 900;
}

.mobilka-checkout .woocommerce-shipping-methods {
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Germanized prints the order table right before the button (German "Button-Lösung":
   items and total must be visible directly above it). The old theme CSS hid it. */
.mobilka-checkout #order_review > table.woocommerce-checkout-review-order-table {
    display: table !important;
    margin-top: 1rem !important;
    padding: .5rem 1rem;
    border-radius: .5rem;
    background: #fafafa;
}

/* Payment methods: compact list */
.mobilka-checkout #payment.woocommerce-checkout-payment {
    margin: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

.mobilka-checkout #payment ul.payment_methods {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    margin: 0;
    padding: 0 !important;
    border: 0 !important;
}

.mobilka-checkout #payment ul.payment_methods li {
    margin: 0;
    padding: 0 !important;
    border: 1px solid #ccc;
    border-radius: .5rem;
    background: #fff;
    line-height: 1.3;
    list-style: none;
}

.mobilka-checkout #payment ul.payment_methods li:has(input:checked) {
    border-color: #1a1a1a;
    box-shadow: 0 0 0 1px #1a1a1a;
}

.mobilka-checkout #payment ul.payment_methods li:hover {
    border-color: #1a1a1a;
}

/* The label covers the whole row, so a click anywhere in the frame selects the method */
.mobilka-checkout #payment ul.payment_methods li > label {
    position: relative;
    display: flex !important;
    align-items: center;
    gap: .5rem;
    width: 100%;
    margin: 0 !important;
    padding: .75rem .75rem .75rem 2.5rem !important;
    font-size: 1rem !important;
    font-weight: 700;
    cursor: pointer;
}

.mobilka-checkout #payment ul.payment_methods li img {
    max-height: 1.5rem;
    width: auto;
    margin: 0 !important;
}

.mobilka-checkout #payment ul.payment_methods li > label::before {
    left: .875rem !important;
    top: 50% !important;
    width: 1.125rem !important;
    height: 1.125rem !important;
    margin: 0 !important;
    border: 1.5px solid #8a8a8a !important;
    border-radius: 50% !important;
    background: #fff !important;
    transform: translateY(-50%) !important;
}

.mobilka-checkout #payment ul.payment_methods li > label::after {
    left: calc(.875rem + .3125rem) !important;
    top: 50% !important;
    width: .5rem !important;
    height: .5rem !important;
    margin: 0 !important;
    border-radius: 50% !important;
    background: #1a1a1a !important;
    transform: translateY(-50%) !important;
}

.mobilka-checkout #payment ul.payment_methods li > input:checked + label::before {
    border-color: #1a1a1a !important;
}

.mobilka-checkout #payment .payment_box {
    width: auto !important;
    margin: 0 .75rem .75rem !important;
    padding: .5rem .75rem !important;
    border-radius: .375rem;
    font-size: .8125rem !important;
    line-height: 1.4;
}

.mobilka-checkout #payment .payment_box::before {
    display: none !important;
}

.mobilka-checkout #payment .payment_box p {
    margin: 0;
}

/* WC's own button inside #payment is replaced by Germanized's below the checkboxes */
.mobilka-checkout #payment .form-row.place-order {
    margin: 0;
    padding: 0 !important;
}

/* Customer fields: compact */
.mobilka-checkout-details .woocommerce-billing-fields__field-wrapper,
.mobilka-checkout-details .woocommerce-shipping-fields__field-wrapper,
.mobilka-checkout-details .woocommerce-additional-fields__field-wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.mobilka-checkout-details .form-row {
    width: 100%;
    margin: 0 0 .75rem !important;
    padding: 0 !important;
}

.mobilka-checkout-details .form-row-first,
.mobilka-checkout-details .form-row-last {
    width: calc(50% - .375rem) !important;
    float: none !important;
}

.mobilka-checkout-details .form-row label {
    display: block;
    margin: 0 0 .25rem !important;
    font-size: .8125rem !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
}

/* 16px font in fields: iOS does not zoom in on focus */
.mobilka-checkout-details .form-row input.input-text,
.mobilka-checkout-details .form-row textarea {
    width: 100%;
    height: 2.75rem;
    padding: .5rem .75rem !important;
    border: 1px solid #b5b5b5 !important;
    border-radius: .375rem !important;
    font-size: 1rem !important;
    line-height: 1.3;
}

.mobilka-checkout-details .form-row textarea {
    height: 5rem;
}

.mobilka-checkout-details .form-row input.input-text:focus,
.mobilka-checkout-details .form-row textarea:focus {
    border-color: #07C4FF !important;
    outline: 0;
    box-shadow: 0 0 0 3px rgba(7, 196, 255, .25);
}

.mobilka-checkout-details .form-row.woocommerce-invalid input.input-text {
    border-color: #d20e0e !important;
}

/* Only one country is allowed (Germany): the row only shows its name */
.mobilka-checkout-details #billing_country_field,
.mobilka-checkout-details #shipping_country_field {
    display: none !important;
}

.mobilka-checkout-details .woocommerce-account-fields,
.mobilka-checkout-details #ship-to-different-address,
.mobilka-checkout-details .create-account {
    margin: 0 0 .5rem !important;
    padding: 0 !important;
    font-size: .875rem !important;
}

.mobilka-checkout-details #ship-to-different-address label,
.mobilka-checkout-details .woocommerce-account-fields label {
    font-size: .875rem !important;
    font-weight: 700 !important;
}

/* Legal checkbox and order button */
.mobilka-checkout .wc-gzd-checkbox-placeholder,
.mobilka-checkout .form-row.checkbox-legal,
.mobilka-checkout .wc-gzd-checkbox-placeholder label {
    font-size: .8125rem !important;
    line-height: 1.45 !important;
}

/* Theme crunch-button draws its green background with pseudo elements */
.mobilka-checkout .wc-gzd-order-submit #place_order::before,
.mobilka-checkout .wc-gzd-order-submit #place_order::after {
    display: none !important;
}

.mobilka-checkout .wc-gzd-order-submit #place_order {
    display: block;
    border: 0 !important;
    width: 100%;
    min-height: 3.25rem;
    margin-top: 1rem;
    border-radius: .5rem !important;
    background-color: #d20e0e !important;
    color: #fff !important;
    font-size: 1.125rem !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .15);
}

.mobilka-checkout .wc-gzd-order-submit #place_order:hover,
.mobilka-checkout .wc-gzd-order-submit #place_order:focus {
    background-color: #b00b0b !important;
}

/* The theme makes the phone required (modify_checkout_phone_field), but the field editor marks it
   "thwcfd-optional" and hides its asterisk: show it for every required field */
.mobilka-checkout-details .form-row.validate-required label .required {
    display: inline !important;
    visibility: visible !important;
}

/* Desktop: checkbox + button live in the sticky summary column (moved by js/mobilka-sales.js),
   the duplicate order table under the form is not needed there */
.mobilka-checkout-summary__actions:empty {
    display: none;
}

@media (min-width: 992px) {
    .mobilka-checkout #order_review > table.woocommerce-checkout-review-order-table {
        display: none !important;
    }

    .mobilka-checkout-summary__actions {
        padding: .25rem 1rem 1rem;
        border-top: 1px solid #e1e1e1;
    }

    .mobilka-checkout-summary__actions .wc-gzd-order-submit {
        margin-top: .75rem !important;
    }

    .mobilka-checkout-summary__actions .wc-gzd-order-submit #place_order {
        margin-top: 0;
    }
}

/* Checkboxes: small native-looking box instead of the theme's 30px square */
.mobilka-checkout label.woocommerce-form__label-for-checkbox {
    display: inline-flex !important;
    align-items: flex-start;
    margin: 0 !important;
    padding: 0 !important;
    cursor: pointer;
}

.mobilka-checkout label.woocommerce-form__label-for-checkbox > span:not(.required) {
    position: relative !important;
    display: inline-block !important;
    margin: 0 !important; /* the theme leaves room for its big box */
    padding-left: 1.75rem !important;
    font-size: .875rem !important;
    font-weight: 400 !important;
    line-height: 1.45 !important;
}

.mobilka-checkout label.woocommerce-form__label-for-checkbox > span:not(.required)::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: .125rem !important;
    width: 1.125rem !important;
    height: 1.125rem !important;
    margin: 0 !important;
    border: 1.5px solid #8a8a8a !important;
    border-radius: .25rem !important;
    background: #fff !important;
    transform: none !important;
    transition: background-color .15s ease, border-color .15s ease;
}

.mobilka-checkout label.woocommerce-form__label-for-checkbox > span:not(.required)::after {
    content: "" !important;
    position: absolute !important;
    left: .4rem !important;
    top: .3rem !important;
    width: .35rem !important;
    height: .6rem !important;
    margin: 0 !important;
    border: solid #fff !important;
    border-width: 0 2px 2px 0 !important;
    background: transparent !important;
    transform: rotate(45deg) !important;
    opacity: 0 !important;
}

.mobilka-checkout label.woocommerce-form__label-for-checkbox:hover > span:not(.required)::before {
    border-color: #1a1a1a !important;
}

.mobilka-checkout label.woocommerce-form__label-for-checkbox > input[type=checkbox]:checked + span:not(.required)::before {
    border-color: #1a1a1a !important;
    background: #1a1a1a !important;
}

.mobilka-checkout label.woocommerce-form__label-for-checkbox > input[type=checkbox]:checked + span:not(.required)::after {
    opacity: 1 !important;
}

.mobilka-checkout label.woocommerce-form__label-for-checkbox > input[type=checkbox]:focus-visible + span:not(.required)::before {
    outline: 3px solid rgba(7, 196, 255, .5);
    outline-offset: 1px;
}

.mobilka-checkout .form-row.checkbox-legal {
    margin: 1rem 0 0 !important;
    padding: 0 !important;
}

/* The asterisk of a checkbox became a separate flex column far right; Germanized shows an error anyway */
.mobilka-checkout label.woocommerce-form__label-for-checkbox > .required {
    display: none !important;
}

.mobilka-checkout .form-row.checkbox-legal label.woocommerce-form__label-for-checkbox > span:not(.required) {
    font-size: .8125rem !important;
}


/* ~~~~~~~~~~ Cart: items list + sticky totals (woocommerce/cart/cart.php) ~~~~~~~~~~ */

.mobilka-cart-form {
    margin: 0;
}

.mobilka-cart-items {
    margin: 0 !important;
    border: 0 !important;
}

.mobilka-cart-item {
    display: grid;
    grid-template-columns: 4.5rem minmax(0, 1fr) auto auto 2rem;
    grid-template-areas: "image info quantity subtotal remove";
    align-items: center;
    gap: .5rem 1rem;
    padding: 1rem 0;
    border-bottom: 1px solid #e6e6e6;
}

.mobilka-cart-item:first-child {
    padding-top: 0;
}

.mobilka-cart-item__image {
    grid-area: image;
}

.mobilka-cart-item__image img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: .25rem;
}

.mobilka-cart-item__info {
    grid-area: info;
    min-width: 0;
}

.mobilka-cart-item__name {
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.3;
}

.mobilka-cart-item__price {
    margin-top: .125rem;
    font-size: .8125rem;
    color: #666;
}

.mobilka-cart-item__quantity {
    grid-area: quantity;
    display: flex;
    align-items: stretch;
}

.mobilka-cart-item__quantity .quantity {
    margin: 0 !important;
}

.mobilka-cart-item__quantity input.qty {
    width: 2.75rem !important;
    height: 2.25rem !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid #ccc !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-radius: 0 !important;
    font-size: 1rem !important;
    font-weight: 700;
    text-align: center;
    -moz-appearance: textfield;
}

.mobilka-cart-item__quantity input.qty::-webkit-outer-spin-button,
.mobilka-cart-item__quantity input.qty::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.mobilka-qty-button {
    width: 2.25rem;
    border: 1px solid #ccc;
    background: #f2f2f2;
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
}

.mobilka-qty-button:first-child {
    border-radius: .375rem 0 0 .375rem;
}

.mobilka-qty-button:last-child {
    border-radius: 0 .375rem .375rem 0;
}

.mobilka-cart-item__subtotal {
    grid-area: subtotal;
    min-width: 4.5rem;
    font-size: 1.0625rem;
    font-weight: 900;
    text-align: right;
    white-space: nowrap;
}

.mobilka-cart-item__remove {
    grid-area: remove;
    text-align: center;
}

.mobilka-cart-item__remove a.remove {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 2rem !important;
    height: 2rem !important;
    border-radius: 50%;
    color: #999 !important;
    font-size: 1.375rem !important;
    line-height: 1 !important;
    text-decoration: none;
}

.mobilka-cart-item__remove a.remove:hover {
    background: #f2f2f2 !important;
    color: #d20e0e !important;
}

/* Hidden: quantity changes submit the cart automatically (js/mobilka-sales.js) */
.mobilka-cart-actions {
    padding: 0 !important;
    border: 0 !important;
}

.mobilka-cart-update {
    position: absolute !important;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

/* Mobile: image + name on top, quantity / sum / remove below */
@media (max-width: 575.98px) {
    .mobilka-cart-item {
        grid-template-columns: 3.5rem minmax(0, 1fr) auto 2rem;
        grid-template-areas:
            "image info info remove"
            "image quantity subtotal subtotal";
        gap: .5rem .75rem;
    }

    .mobilka-cart-item__image {
        align-self: start;
    }

    .mobilka-cart-item__quantity {
        justify-self: start;
    }
}

/* Totals */
.mobilka-cart-side {
    margin-top: 1.5rem;
}

@media (min-width: 992px) {
    .mobilka-cart-side {
        position: sticky;
        top: var(--mobilka-header-offset, 9.5rem);
        margin-top: 0;
    }
}

.mobilka-cart-side .cart-collaterals,
.mobilka-cart-side .cart_totals {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
}

.mobilka-cart-side .cart_totals {
    padding: 1rem;
    border: 1px solid #e1e1e1;
    border-radius: .5rem;
    background: #fafafa;
}

.mobilka-cart-totals__title {
    margin-bottom: .5rem;
    font-size: 1.125rem;
    font-weight: 900;
}

.mobilka-cart-totals__table {
    width: 100%;
    margin: 0 !important;
    border: 0 !important;
}

.mobilka-cart-totals__table th,
.mobilka-cart-totals__table td {
    padding: .4rem 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    background: transparent !important;
    font-size: .875rem !important;
    vertical-align: top;
}

.mobilka-cart-totals__table td {
    text-align: right !important;
}

.mobilka-cart-totals__table td::before {
    display: none !important;
}

.mobilka-cart-totals__table .order-total th,
.mobilka-cart-totals__table .order-total td {
    font-size: 1.125rem !important;
    font-weight: 900;
}

.mobilka-cart-totals__table .woocommerce-shipping-methods {
    margin: 0;
    padding: 0;
    list-style: none;
}

/* "Shipping options will be updated during checkout": shipping is free, the note only adds noise */
.mobilka-cart-totals__table .woocommerce-shipping-destination,
.mobilka-cart-totals__table .woocommerce-shipping-calculator {
    display: none;
}

.mobilka-cart-side .wc-proceed-to-checkout {
    margin-top: 1rem;
    padding: 0 !important;
}

/* WooCommerce's .checkout-button adds its own padding and font size */
.mobilka-cart-side a.checkout-button.mobilka-cart-checkout {
    display: flex;
    width: 100%;
    min-height: 3.25rem;
    margin: 0 !important;
    padding: .75rem 1rem !important;
    font-size: 1.125rem !important;
}

.mobilka-cart-totals__table tr,
.mobilka-cart-totals__table tbody {
    background: transparent !important;
}


/* Compact order table right before the button (mobile): items, total and a short tax/shipping note.
   The full table stays in the summary at the top. */
.mobilka-checkout table.woocommerce-checkout-review-order-table .mobilka-order-note {
    display: none;
}

.mobilka-checkout #order_review > table.woocommerce-checkout-review-order-table .mobilka-order-note {
    display: table-row;
}

.mobilka-checkout #order_review > table.woocommerce-checkout-review-order-table .mobilka-order-note td {
    padding-top: 0 !important;
    border-top: 0 !important;
    color: #666;
    font-size: .75rem !important;
    text-align: right;
}

.mobilka-checkout #order_review > table.woocommerce-checkout-review-order-table .cart-subtotal,
.mobilka-checkout #order_review > table.woocommerce-checkout-review-order-table .woocommerce-shipping-totals,
.mobilka-checkout #order_review > table.woocommerce-checkout-review-order-table .order-tax,
.mobilka-checkout #order_review > table.woocommerce-checkout-review-order-table .tax-rate,
.mobilka-checkout #order_review > table.woocommerce-checkout-review-order-table .tax-total,
.mobilka-checkout #order_review > table.woocommerce-checkout-review-order-table .order-total .includes_tax {
    display: none;
}

.mobilka-checkout #order_review > table.woocommerce-checkout-review-order-table .product-name {
    font-weight: 400;
}

.mobilka-checkout #order_review > table.woocommerce-checkout-review-order-table .order-total th,
.mobilka-checkout #order_review > table.woocommerce-checkout-review-order-table .order-total td {
    padding-bottom: .125rem !important;
}

/* The table header is hidden, so the first item row needs no separator line above it */
.mobilka-checkout table.woocommerce-checkout-review-order-table tbody tr:first-child th,
.mobilka-checkout table.woocommerce-checkout-review-order-table tbody tr:first-child td {
    border-top: 0 !important;
}


/* ~~~~~~~~~~ Cart / checkout: smaller gap between the site header and the page title ~~~~~~~~~~ */
/* The gap is the first Spacer block of the page content (size 10 / 9); overridden here to keep it in code */

body.woocommerce-checkout main > .wp-bootstrap-blocks-container:first-child > .acf-block-spacer:first-child,
body.woocommerce-cart main > .wp-bootstrap-blocks-container:first-child > .acf-block-spacer:first-child {
    padding-top: 1.5rem !important;
}

@media (min-width: 992px) {
    body.woocommerce-checkout main > .wp-bootstrap-blocks-container:first-child > .acf-block-spacer:first-child,
    body.woocommerce-cart main > .wp-bootstrap-blocks-container:first-child > .acf-block-spacer:first-child {
        padding-top: 2.5rem !important;
    }
}


/* ~~~~~~~~~~ Dialogs (tariff 'Activate', package details): all pages ~~~~~~~~~~ */

/* "Order" dialog: centered card on desktop, bottom sheet on phones */
.mobilka-dialog {
    width: min(26rem, calc(100% - 2rem));
    max-width: none;
    padding: 1.5rem;
    border: 0;
    border-radius: 1rem;
    color: #14213d;
    box-shadow: 0 20px 60px rgba(20, 33, 61, .3);
}

.mobilka-dialog::backdrop {
    background: rgba(20, 33, 61, .45);
}

.mobilka-dialog__close-form {
    position: absolute;
    top: .5rem;
    right: .5rem;
    margin: 0;
}

.mobilka-dialog__close {
    width: 2.25rem;
    height: 2.25rem;
    border: 0;
    border-radius: 50%;
    background: #f3f5f8;
    color: #14213d;
    font-size: 1.375rem;
    line-height: 1;
    cursor: pointer;
}

.mobilka-dialog__title {
    margin: 0 2.5rem 1rem 0 !important;
    font-size: 1.375rem;
    font-weight: 900;
}

.mobilka-dialog__step + .mobilka-dialog__step {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #eef1f5;
}

.mobilka-dialog__label {
    margin: 0 0 .375rem;
    color: #4a5568;
    font-size: .9375rem;
    line-height: 1.4;
}

.mobilka-dialog__sms {
    margin: 0;
    padding: .75rem 1rem;
    border-radius: .625rem;
    background: #f3f5f8;
    font-size: 1.25rem;
    font-weight: 900;
    letter-spacing: .02em;
}

.mobilka-dialog .mobilka-cta__button {
    width: 100%;
    margin-top: .25rem;
}

@media (max-width: 575.98px) {
    .mobilka-dialog {
        width: 100%;
        margin: auto 0 0;
        border-radius: 1rem 1rem 0 0;
        padding-bottom: calc(1.5rem + env(safe-area-inset-bottom));
    }
}


/* The Stripe card form copies its label style from the first ".woocommerce-checkout .form-row label",
   which is the (hidden) login form: same size as the checkout field labels */
.woocommerce-checkout .woocommerce-form-login .form-row label {
    font-size: .8125rem !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
}

/* Wallet buttons side by side (the plugin mounts one element per wallet; only shown ones take a column) */
#wc-stripe-express-checkout-element.mobilka-express__buttons:not([style*="none"]) {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
    gap: .5rem;
}

#wc-stripe-express-checkout-element.mobilka-express__buttons > [style*="none"] {
    display: none !important;
}

/* Order button: 48px like the other site buttons (was 56px, 18px text) */
.mobilka-checkout #place_order {
    min-height: 3rem;
    padding: .625rem 1.5rem !important;
    font-size: 1rem !important;
    line-height: 1.25 !important;
}

#wc-stripe-express-checkout-element.mobilka-express__buttons > .StripeElement,
#wc-stripe-express-checkout-element.mobilka-express__buttons .__PrivateStripeElement {
    min-width: 0 !important;
    max-width: 100% !important;
}

.mobilka-checkout .wc-gzd-order-submit #place_order.crunch-button {
    min-height: 3rem !important;
    padding: .625rem 1.5rem !important;
    font-size: 1rem !important;
    line-height: 1.25 !important;
}

/* No Usercentrics fingerprint button any more (cookie settings are in the footer): the sticky WhatsApp bar
   does not need the room on the left */
.mobilka-sticky-cta {
    padding: .625rem 1rem calc(.625rem + env(safe-area-inset-bottom, 0px));
}

@media (min-width: 768px) {
    .mobilka-sticky-cta {
        left: 1.5rem;
        bottom: 1.5rem;
        padding: 0;
    }
}

/* Desktop: "back to top" sits above the cart bar (both bottom right) */
@media (min-width: 768px) {
    body.mobilka-has-cart .return-to-top {
        bottom: 5.75rem !important;
    }
}

/* Only one shipping method (hidden input, nothing to choose): no fake radio circle from the old theme CSS */
.woocommerce-shipping-methods li input[type=hidden] + label {
    padding-left: 0 !important;
    cursor: default;
}

.woocommerce-shipping-methods li input[type=hidden] + label::before,
.woocommerce-shipping-methods li input[type=hidden] + label::after {
    display: none !important;
}