/* ~~~~~~~~~~ Site-wide design (all pages; the home page adds css/design/home.css on top) ~~~~~~~~~~ */
/* Principles from the home page:
   - brand blue (#0088c0 band, #0a7fb0 accents) instead of neon green #00FF00 and bright #07C4FF
   - a blue band with the blue-toned doodle pattern only at the top, light page (#f3f5f8) below
   - white cards with a thin border and a soft layered shadow, 16px radius
   - red = buy / order, green = WhatsApp only, dark navy (#14213d) text
   Loaded last (inc/mobilka-sales.php). */


/* ~~~~~~~~~~ Page background: blue band at the top, light below (not on the home page: it has its hero) ~~~~~~~~~~ */

body:not(.home) {
    background: #f3f5f8 !important;
}

body:not(.home) #main {
    position: relative;
    isolation: isolate;
}

/* Band height: set by js/mobilka-sales.js to end ~9rem below the page title, so the first cards overlap it */
body:not(.home) #main::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    z-index: -1;
    height: var(--mobilka-band-height, 18rem);
    background: url("hero-decor.svg") no-repeat 50% 0 / 100% auto, #0088c0;
    pointer-events: none;
}

/* Texts the theme sets white were on the old blue page background; now most of the page is light.
   Dark by default, white only for the page title on the band (class added by js/mobilka-sales.js). */
body:not(.home) #main .text-white:not(.mobilka-on-band),
body:not(.home) #main .hero-section__title:not(.mobilka-on-band) {
    color: #14213d !important;
}

body:not(.home) #main .mobilka-on-band {
    color: #fff !important;
}

body:not(.home) .hero-section {
    color: #fff;
}


/* ~~~~~~~~~~ Cards: white, thin border, soft layered shadow, 16px radius ~~~~~~~~~~ */

body:not(.home) #main .c-shadow {
    border: 1px solid #e6eaf0;
    box-shadow: 0 1px 2px rgba(20, 33, 61, .04), 0 8px 24px rgba(20, 33, 61, .07) !important;
}

body:not(.home) #main .c-shadow.rounded,
body:not(.home) #main .rounded.c-shadow,
body:not(.home) #main .single-row.rounded {
    border-radius: 1rem !important;
    overflow: hidden;
    overflow: clip; /* clips the corners like hidden, but keeps position: sticky working (checkout summary) */
}

/* Full-width white text sections: a card on the light page */
body:not(.home) #main .acf-block-white-background-content {
    background: transparent !important;
}

body:not(.home) #main .acf-block-white-background-content > .container {
    padding: 2.5rem 1.5rem;
    border: 1px solid #e6eaf0;
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 8px 24px rgba(20, 33, 61, .06);
}


/* ~~~~~~~~~~ Buttons and accents: brand blue instead of neon green / bright blue ~~~~~~~~~~ */

/* Filled pill buttons (theme crunch-button): blue fill, white text; on hover the theme empties the fill */
.crunch-button__full-background--primary-color,
.crunch-button__full-background--secondary-color,
.gform_button.crunch-button {
    color: #fff !important;
}

.crunch-button__full-background--primary-color::before,
.crunch-button__full-background--secondary-color::before,
.gform_button.crunch-button::before {
    background-color: #0a7fb0 !important;
}

.crunch-button__full-background--primary-color::after,
.crunch-button__full-background--secondary-color::after,
.gform_button.crunch-button::after {
    border-color: #0a7fb0 !important;
}

.crunch-button__full-background--primary-color:hover,
.crunch-button__full-background--primary-color:focus,
.crunch-button__full-background--secondary-color:hover,
.crunch-button__full-background--secondary-color:focus,
.gform_button.crunch-button:hover,
.gform_button.crunch-button:focus {
    color: #0a7fb0 !important;
}

/* "More" links with a round arrow; accordion and "details" toggles */
.crunch-button__with-arrow::before,
.single-row__button::after {
    background-color: #0a7fb0 !important;
}

.crunch-button__with-arrow::after,
.single-row__button::before {
    filter: brightness(0) invert(1);
}

.crunch-button__with-arrow:hover,
.crunch-button__with-arrow:focus {
    color: #0a7fb0;
}

/* Colored info bar ("Zusätzliches High-Speed Internet ..."): white card with a blue accent */
body:not(.home) #main .acf-coloured-information-bar {
    border: 1px solid #e6eaf0;
    border-left: 4px solid #0a7fb0;
    background: #fff !important;
    color: #14213d !important;
}

body:not(.home) #main .acf-coloured-information-bar * {
    color: inherit !important;
}

/* Links and highlighted text from the editor (inline color #07C4FF) and numbered lists */
#main [style*="07c4ff" i],
#main [style*="7, 196, 255"],
#main [style*="07c4ff" i] * {
    color: #0a7fb0 !important;
}

#main .entry-content ol > li::before,
#main .text-secondary,
.text-hover-secondary:hover,
.text-hover-secondary:focus {
    color: #0a7fb0 !important;
}

/* Required field markers: red, not green */
#main .required,
#main .gfield_required {
    color: #d20e0e !important;
}

body:not(.home) .mobilka-products-note {
    border-left-color: #0a7fb0;
    background: #eef5fa;
}


/* ~~~~~~~~~~ Theme icons (SVG backgrounds) recolored: neon green / bright blue -> brand blue ~~~~~~~~~~ */
/* generated from dist/*.css: same icons, colors replaced (round buttons get a white arrow) */

.acf-block-package .single-row__collapse-row-button:before {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0OS42ODMiIGhlaWdodD0iNDcuNjYxIj48ZGVmcz48ZmlsdGVyIGlkPSJhIiB4PSIwIiB5PSIwIiB3aWR0aD0iNDkuNjgzIiBoZWlnaHQ9IjQ3LjY2MSIgZmlsdGVyVW5pdHM9InVzZXJTcGFjZU9uVXNlIj48ZmVPZmZzZXQgZHk9IjMiLz48ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIzIiByZXN1bHQ9ImIiLz48ZmVGbG9vZCBmbG9vZC1vcGFjaXR5PSIuMTYxIi8+PGZlQ29tcG9zaXRlIG9wZXJhdG9yPSJpbiIgaW4yPSJiIi8+PGZlQ29tcG9zaXRlIGluPSJTb3VyY2VHcmFwaGljIi8+PC9maWx0ZXI+PC9kZWZzPjxnIGZpbHRlcj0idXJsKCNhKSI+PHJlY3Qgd2lkdGg9IjMxLjY4MyIgaGVpZ2h0PSIyOS42NjEiIHJ4PSIxNC44MzEiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDkgNikiIGZpbGw9IiMwYTdmYjAiLz48L2c+PHBhdGggZD0iTTMxLjMwMSAyMC44ODhsLS42MjYtLjY2NmEuMzYzLjM2MyAwIDAgMC0uNTM2IDBsLTQuOSA1LjIxNVYxMy45NTZhLjM5Mi4zOTIgMCAwIDAtLjM3OS0uNGgtLjg4NWEuMzkyLjM5MiAwIDAgMC0uMzc5LjR2MTEuNDgxbC00LjktNS4yMTVhLjM2My4zNjMgMCAwIDAtLjUzNiAwbC0uNjI2LjY2NmEuNDIyLjQyMiAwIDAgMCAwIC41N2w2LjYxNyA3LjA0YS4zNjMuMzYzIDAgMCAwIC41MzYgMGw2LjYxNC03LjA0MmEuNDIyLjQyMiAwIDAgMCAwLS41Njh6IiBmaWxsPSIjZmZmIiBzdHJva2U9InJnYmEoMCwwLDAsMCkiLz48L3N2Zz4=") !important;
}

div.woocommerce .woocommerce-MyAccount-navigation ul li a:before {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMiIgaGVpZ2h0PSIxMS44NiI+PHBhdGggZD0iTTUuODQuMWwtLjUzLjUzYS4zMy4zMyAwIDAgMCAwIC40NWw0LjE2IDQuMTZILjMyYS4zMi4zMiAwIDAgMC0uMzIuMzJ2Ljc1YS4zMi4zMiAwIDAgMCAuMzIuMzJoOS4xNWwtNC4xNiA0LjE1YS4zMy4zMyAwIDAgMCAwIC40NmwuNTMuNTNhLjMyLjMyIDAgMCAwIC40NSAwbDUuNi01LjYxYS4zMi4zMiAwIDAgMCAwLS40NUw2LjMuMWEuMzIuMzIgMCAwIDAtLjQ1IDB6IiBmaWxsPSIjMGE3ZmIwIi8+PC9zdmc+") !important;
}

.main-header .navbar .navbar-nav li.dropdown .dropdown-wrapper .dropdown-menu .dropdown-item:before {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMiIgaGVpZ2h0PSIxMS44NiI+PHBhdGggZD0iTTUuODQuMWwtLjUzLjUzYS4zMy4zMyAwIDAgMCAwIC40NWw0LjE2IDQuMTZILjMyYS4zMi4zMiAwIDAgMC0uMzIuMzJ2Ljc1YS4zMi4zMiAwIDAgMCAuMzIuMzJoOS4xNWwtNC4xNiA0LjE1YS4zMy4zMyAwIDAgMCAwIC40NmwuNTMuNTNhLjMyLjMyIDAgMCAwIC40NSAwbDUuNi01LjYxYS4zMi4zMiAwIDAgMCAwLS40NUw2LjMuMWEuMzIuMzIgMCAwIDAtLjQ1IDB6IiBmaWxsPSIjMGE3ZmIwIi8+PC9zdmc+") !important;
}

.list-styles__tick--primary-color ul li:before {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOC45MSIgaGVpZ2h0PSIxMy40OCI+PHBhdGggZD0iTTE4LjY3IDIuNjdMNy4zMiAxMy4yNmEuODIuODIgMCAwIDEtMS4xMiAwTC4yIDcuNmEuNy43IDAgMCAxIDAtMWwxLjUzLTEuNDVhLjgyLjgyIDAgMCAxIDEuMTIgMGwzLjkzIDMuNzMgOS4zLTguNjdhLjg0Ljg0IDAgMCAxIDEuMTIgMGwxLjQ4IDEuNGEuNzEuNzEgMCAwIDEgLjA1IDFsLS4wNi4wNnoiIGZpbGw9IiMwYTdmYjAiLz48L3N2Zz4=") !important;
}

.list-styles__tick--secondary-color ul li:before {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOC45MSIgaGVpZ2h0PSIxMy40OCI+PHBhdGggZD0iTTE4LjY3IDIuNjdMNy4zMiAxMy4yNmEuODIuODIgMCAwIDEtMS4xMiAwTC4yIDcuNmEuNy43IDAgMCAxIDAtMWwxLjUzLTEuNDVhLjgyLjgyIDAgMCAxIDEuMTIgMGwzLjkzIDMuNzMgOS4zLTguNjdhLjg0Ljg0IDAgMCAxIDEuMTIgMGwxLjQ4IDEuNGEuNzEuNzEgMCAwIDEgLjA1IDFsLS4wNi4wNnoiIGZpbGw9IiMwYTdmYjAiLz48L3N2Zz4=") !important;
}

.list-styles__phone--primary-color ul li:before {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNC45NiIgaGVpZ2h0PSIxNi4xNyI+PHBhdGggZD0iTTkuMSAxMC41Yy0uMi41IDAgMS4xLS44IDEuMS0uNCAwLTEuNC0xLTIuMS0xLjhBMTMuMjkgMTMuMjkgMCAwIDEgNC4zIDdjLjEtLjkuNy0uNiAxLjItLjcuMi0uMS42LTMuMS0yLjMtNi4yYS41LjUgMCAwIDAtLjcuMUE0LjY0IDQuNjQgMCAwIDAgLjIgMy4xYy0uMyAxLjItLjcgMyAyLjUgNy4zLjMuNC43LjkgMS4zIDEuNmwuMy4zYzQgNC4xIDYgNCA3LjIgMy44YTUuMjEgNS4yMSAwIDAgMCAzLjItMS44LjU1LjU1IDAgMCAwIC4yLS43Yy0yLjYtMy4zLTUuNy0zLjMtNS44LTMuMXptLTQuNSAxLjFsLS4zLS4zQTUuOTMgNS45MyAwIDAgMSAzLjIgMTBDLjMgNi42LjYgNSAuOCA0YTQuNjkgNC42OSAwIDAgMSAxLjgtMi42LjQ5LjQ5IDAgMCAxIC42LS4xbC40LjRoLS4xYTUuMjEgNS4yMSAwIDAgMC0xLjggMi42Yy0uMyAxLS42IDIuNiAyIDYuMmE1LjkzIDUuOTMgMCAwIDAgMS4xIDEuMy4yMi4yMiAwIDAgMS0uMi0uMnoiIGZpbGw9IiMwYTdmYjAiLz48L3N2Zz4=") !important;
}

.list-styles__phone--secondary-color ul li:before {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNC45NiIgaGVpZ2h0PSIxNi4xNyI+PHBhdGggZD0iTTkuMSAxMC41Yy0uMi41IDAgMS4xLS44IDEuMS0uNCAwLTEuNC0xLTIuMS0xLjhBMTMuMjkgMTMuMjkgMCAwIDEgNC4zIDdjLjEtLjkuNy0uNiAxLjItLjcuMi0uMS42LTMuMS0yLjMtNi4yYS41LjUgMCAwIDAtLjcuMUE0LjY0IDQuNjQgMCAwIDAgLjIgMy4xYy0uMyAxLjItLjcgMyAyLjUgNy4zLjMuNC43LjkgMS4zIDEuNmwuMy4zYzQgNC4xIDYgNCA3LjIgMy44YTUuMjEgNS4yMSAwIDAgMCAzLjItMS44LjU1LjU1IDAgMCAwIC4yLS43Yy0yLjYtMy4zLTUuNy0zLjMtNS44LTMuMXptLTQuNSAxLjFsLS4zLS4zQTUuOTMgNS45MyAwIDAgMSAzLjIgMTBDLjMgNi42LjYgNSAuOCA0YTQuNjkgNC42OSAwIDAgMSAxLjgtMi42LjQ5LjQ5IDAgMCAxIC42LS4xbC40LjRoLS4xYTUuMjEgNS4yMSAwIDAgMC0xLjggMi42Yy0uMyAxLS42IDIuNiAyIDYuMmE1LjkzIDUuOTMgMCAwIDAgMS4xIDEuMy4yMi4yMiAwIDAgMS0uMi0uMnoiIGZpbGw9IiMwYTdmYjAiLz48L3N2Zz4=") !important;
}


/* ~~~~~~~~~~ Tariff pages: package prices like on the home page (red, decimals smaller) ~~~~~~~~~~ */

body:not(.home) #main .price__wrapper {
    padding: 0 !important;
    border: 0 !important;
    color: #d20e0e;
}

body:not(.home) #main .price__wrapper > div:first-child,
body:not(.home) #main .price__wrapper p {
    font-size: 3rem !important;
    line-height: 1;
}

body:not(.home) #main .price__decimal {
    margin-left: .125rem !important;
    font-size: 1.9rem !important;   /* ~.64 of the price, like everywhere */
    letter-spacing: 0 !important;
}

body:not(.home) #main .price__euro {
    margin-left: .25rem;
    font-size: 1.9rem !important;
}

body:not(.home) #main .price__notice {
    color: #6b7588;
}

/* Package middle column: lighter gray */
body:not(.home) #main .single-row__center-col {
    background: #f7f9fb !important;
}


/* ~~~~~~~~~~ Forms (Gravity Forms: contact) on the light page ~~~~~~~~~~ */

body:not(.home) #main .gform_wrapper,
body:not(.home) #main .gform_wrapper label,
body:not(.home) #main .gform_wrapper .gfield_description,
body:not(.home) #main .gform_wrapper .gfield_consent_label,
body:not(.home) #main .gform_wrapper .gform_required_legend,
body:not(.home) #main .gform_wrapper p {
    color: #4a5568 !important;
}

body:not(.home) #main .gform_wrapper a {
    color: #0a7fb0 !important;
}

body:not(.home) #main .gform_wrapper input[type=text],
body:not(.home) #main .gform_wrapper input[type=email],
body:not(.home) #main .gform_wrapper input[type=tel],
body:not(.home) #main .gform_wrapper textarea {
    border: 1px solid #cfd6e0 !important;
    border-radius: .5rem !important;
    background: #fff !important;
    box-shadow: none !important;
    color: #14213d !important;
}

body:not(.home) #main .gform_wrapper input:focus,
body:not(.home) #main .gform_wrapper textarea:focus {
    border-color: #0a7fb0 !important;
    outline: 0;
    box-shadow: 0 0 0 3px rgba(10, 127, 176, .2) !important;
}

/* Package price: digits on one baseline (the theme raised the decimals) */
body:not(.home) #main .price__wrapper {
    align-items: baseline !important;
}

body:not(.home) #main .price__wrapper > div:first-child p {
    margin: 0;
}

body:not(.home) #main .price__decimal,
body:not(.home) #main .price__euro {
    position: static !important;
    align-self: baseline !important;
    vertical-align: baseline !important;
    transform: none !important;
}

body:not(.home) #main .price__label {
    align-self: flex-start;
    color: #6b7588;
}

body:not(.home) #main .gform_wrapper .gfield_html {
    color: #6b7588 !important;
}

.single-row__collapse-row-button::before {
    color: #0a7fb0 !important;
}


/* ~~~~~~~~~~ Footer contacts: WhatsApp, phone, e-mail in one style (template-parts/components/contact-links.php) ~~~~~~~~~~ */

.mobilka-contacts {
    display: grid;
    gap: .375rem;
    margin: 1rem 0 0 -.5rem;
    padding: 0;
    list-style: none;
}

.mobilka-contacts__item {
    display: flex;
    align-items: center;
    gap: .875rem;
    padding: .375rem .75rem .375rem .5rem;
    border-radius: .875rem;
    color: #fff !important;
    text-decoration: none !important;
    transition: background-color .15s ease;
}

.mobilka-contacts__item:hover,
.mobilka-contacts__item:focus-visible {
    background-color: rgba(255, 255, 255, .07);
}

.mobilka-contacts__icon {
    display: inline-flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: .7rem; /* rounded square, like app icons (variant C, chosen 08.10.2026) */
    background: #0a7fb0;
    color: #fff;
}

.mobilka-contacts__icon svg {
    width: 1.25rem;
    height: 1.25rem;
}

.mobilka-contacts__item--whatsapp .mobilka-contacts__icon {
    background: var(--mobilka-whatsapp, #1e9e4a);
}

.mobilka-contacts__body {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.mobilka-contacts__label {
    color: rgba(255, 255, 255, .6);
    font-size: .75rem;
    line-height: 1.2;
}

.mobilka-contacts__value {
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

/* The WhatsApp mark has the handset inside a bubble: drawn larger so the handset is readable */
.mobilka-contacts__item--whatsapp .mobilka-contacts__icon svg {
    width: 1.5rem;
    height: 1.5rem;
}