/**
* Theme Name: Acuasafe Child
* Description: This is a child theme of Acuasafe, generated by Merlin WP.
* Author: <a href="https://themeforest.net/user/template_path">template_path</a>
* Template: acuasafe
* Version: 1.31
*/
/* Category description shown below the products. */
.mr_shop .term-description {
    margin-top: 50px;
}

/* Workplace page (/workplace/), built from blocks with wcs-* classes. */
.wcs-workplace-hero,
.wcs-workplace-offer,
.wcs-workplace-quote {
    background: #eefbff;
    border-radius: 20px;
    padding: 50px 30px;
    margin-bottom: 30px;
}
.wcs-workplace-offer {
    background: #172746;
}
.wcs-workplace-offer h2,
.wcs-workplace-offer p {
    color: #ffffff;
}
.wcs-eyebrow {
    color: #00d1f9;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 5px;
}
.wcs-workplace-offer .wcs-eyebrow {
    color: #00d1f9;
}
.wcs-small {
    font-size: 14px;
}
.wcs-workplace-features {
    margin: 50px 0 20px;
    gap: 30px;
}
.wcs-workplace-features .wp-block-column {
    background: #ffffff;
    border-bottom: 3px solid #00d1f9;
    border-radius: 10px;
    box-shadow: 0 10px 30px rgba(23, 39, 70, 0.08);
    padding: 30px 25px;
}
.wcs-workplace-features h4 {
    font-size: 20px;
    margin-bottom: 10px;
}
.wp-style .wcs-section-title {
    margin-top: 80px;
    margin-bottom: 10px;
}
.wp-style .wcs-range-title {
    margin-top: 40px;
}
.blog-modern-content > .woocommerce {
    margin: 20px 0 10px;
}
.wcs-checklist {
    max-width: 700px;
    margin: 20px auto;
    padding: 0;
    list-style: none;
}
.wcs-checklist li {
    color: #808080;
    font-family: 'Open Sans', sans-serif;
    font-size: 15px;
    padding: 8px 0 8px 32px;
    position: relative;
}
.wcs-checklist li::before {
    color: #00d1f9;
    content: "\2713";
    font-weight: 700;
    left: 0;
    position: absolute;
}
.wcs-placeholder {
    font-style: italic;
}
.wcs-workplace-quote {
    margin-top: 60px;
}
.wcs-workplace-quote h3 {
    margin: 30px 0 25px;
}

/* Shared content-page blocks (e.g. Servicing): panels, cards, price cards, FAQ. */
.wcs-panel {
    background: #eefbff;
    border-radius: 20px;
    margin: 0 0 30px;
    padding: 50px 30px;
}
.wcs-panel-dark {
    background: #172746;
    margin-top: 80px;
}
.wcs-panel-dark h2,
.wcs-panel-dark p {
    color: #ffffff;
}
.wcs-panel-dark a:not(.theme-btn) {
    color: #00d1f9;
}
.wcs-cards {
    gap: 30px;
    margin: 30px 0;
}
.wcs-cards .wp-block-column {
    background: #ffffff;
    border-bottom: 3px solid #00d1f9;
    border-radius: 10px;
    box-shadow: 0 10px 30px rgba(23, 39, 70, 0.08);
    padding: 30px 25px;
}
.wcs-cards h4 {
    font-size: 20px;
    margin-bottom: 10px;
}
.wcs-price-cards .wp-block-column {
    text-align: center;
}
.wcs-price-cards h3 {
    font-size: 22px;
}
.wcs-price {
    color: #172746;
    font-size: 32px;
    font-weight: 700;
    margin: 15px 0 5px;
}
.wcs-price span {
    color: #707070;
    font-size: 14px;
    font-weight: 400;
}
.wcs-price-cards .wcs-checklist {
    display: inline-block;
    text-align: left;
}
.wcs-faq {
    background: #ffffff;
    border: 1px solid #e5eef5;
    border-radius: 10px;
    margin: 0 auto 15px;
    max-width: 900px;
    padding: 18px 25px;
}
.wcs-faq summary {
    color: #172746;
    font-family: 'Open Sans', sans-serif;
    cursor: pointer;
    font-size: 18px;
    font-weight: 600;
}
.wcs-faq[open] summary {
    color: #00d1f9;
    margin-bottom: 10px;
}
.wcs-faq .wcs-checklist {
    margin: 10px 0;
    max-width: none;
}

.wcs-faq + .wcs-panel {
    margin-top: 60px;
}

/* Theme "Choose Us" section used inside a normal page (e.g. Servicing: what's included). */
.wp-style .wcs-chooseus {
    margin: 60px calc(50% - 50vw);
    text-align: left;
}
.wcs-chooseus .sec-title p {
    color: #ffffff;
    margin-top: 15px;
    opacity: 0.85;
}
.wcs-chooseus .single-item h4,
.wcs-chooseus .single-item p {
    text-align: left;
}
.wcs-chooseus .single-item p {
    color: rgba(255, 255, 255, 0.85);
}
.wcs-chooseus .icon-box i {
    color: #ffffff;
    font-size: 26px;
}
/* Product cut-out in the Choose Us frame: theme's 15px white border, light-blue water background inside. */
.wcs-chooseus .image-box .wcs-chooseus-product {
    background: radial-gradient(circle at 50% 45%, #ffffff 0%, #d4f3fd 45%, #8fdcf6 100%);
    padding: 30px 20px;
    text-align: center;
}
.wcs-chooseus .wcs-chooseus-product img {
    display: inline-block;
    filter: drop-shadow(0 15px 20px rgba(23, 39, 70, 0.25));
    max-height: 480px;
    width: auto;
}
/* Product photo at the top of each servicing plan card. */
.wcs-price-cards .wp-block-column {
    padding-top: 40px;
}
.wcs-price-cards .wcs-plan-image {
    align-items: center;
    display: flex;
    height: 200px;
    justify-content: center;
    margin: 0 0 25px;
    overflow: hidden;
}
.wcs-price-cards .wcs-plan-image img {
    max-height: 200px;
    object-fit: contain;
    width: auto;
}

/* Theme "Elements" blocks (CTA, About, Service) used inside a normal page (e.g. Switch). */
.wp-style .wcs-elements-block {
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    text-align: left;
}
.wp-style .wcs-elements-block.centred {
    text-align: center;
}
.wp-style .wcs-switch-hero {
    margin-top: -40px;
}
.wcs-switch-hero .btn-box {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 25px;
}
.wcs-text-link {
    color: #00d1f9;
    font-weight: 600;
}
.wcs-text-link:hover {
    color: #ffffff;
}
.wcs-switch-steps .service-block-two h4 {
    color: #172746;
}
.wcs-note {
    background: #fff8e6;
    border-left: 4px solid #00d1f9;
    border-radius: 6px;
    margin: 10px auto 60px;
    max-width: 900px;
    padding: 18px 25px;
}
.wcs-switch-form {
    margin-top: 40px;
}
.wcs-switch-form h3 {
    margin-top: 30px;
}
.wp-style .wcs-switch-range {
    margin-top: 80px;
}
/* Product photos with a white background (JPG) inside a coloured frame: blend the white away. */
.wcs-chooseus .wcs-blend-white img {
    filter: none;
    mix-blend-mode: multiply;
}

/* "Request Information" menu item (opens the popup). The theme shows its header button from 1600px, so hide the item there. */
.main-menu .navigation > li.wcs-menu-request-info > a,
.mobile-menu .navigation > li.wcs-menu-request-info > a {
    color: #00d1f9;
}
@media only screen and (min-width: 1600px) {
    .main-header .main-menu .navigation > li.wcs-menu-request-info {
        display: none;
    }
}

/* Lists in normal page content use the theme body font (the theme leaves them on the browser default). */
.wp-style .wp-block-list li {
    color: #808080;
    font-family: 'Open Sans', sans-serif;
    font-size: 15px;
    line-height: 26px;
    margin-bottom: 6px;
}
.wp-style .wp-block-list li strong {
    color: #172746;
}

/* Servicing page: theme pricing block (one tab per plan) with a product photo in each card. */
.wcs-servicing-pricing .wcs-pricing-product {
    margin: 25px 0 5px;
    text-align: center;
}
.wcs-servicing-pricing .wcs-pricing-product img {
    display: inline-block;
    max-height: 170px;
    width: auto;
}
/* Three plan toggles on one row (the theme sizes the toggle for two). */
.wcs-servicing-pricing .tab-btn-box .tab-btns {
    display: flex;
    max-width: 420px;
}
.wcs-servicing-pricing .tab-btn-box .tab-btns li {
    flex: 1 1 0;
    float: none;
    padding: 12.5px 10px;
    white-space: nowrap;
    width: auto;
}
.wcs-servicing-pricing .tab-btn-box .tab-btns li + li {
    margin-left: -2px;
}
/* Services grid used for reasons: no buttons, intro under the title. */
.wcs-servicing-why .sec-title p {
    margin: 15px auto 0;
    max-width: 900px;
}
.wcs-servicing-why .row {
    display: flex;
    flex-wrap: wrap;
}
.wcs-servicing-why .service-block {
    display: flex;
}
.wcs-servicing-why .service-block-two,
.wcs-servicing-why .service-block-two .inner-box {
    width: 100%;
}
.wcs-servicing-why .service-block-two .inner-box {
    height: calc(100% - 30px);
}
/* Placeholder reviews have no customer photo, so drop the space reserved for it. */
.wcs-servicing-reviews .testimonial-block-one .inner-box {
    padding-left: 40px;
}
.wcs-servicing-pricing .wcs-plan-lead {
    font-size: 14px;
    line-height: 22px;
    margin-bottom: 10px;
}
.wcs-servicing-pricing .wcs-plan-includes {
    color: #172746;
    font-weight: 600;
    margin-bottom: 5px;
}
.wcs-servicing-why .sec-title p + p {
    margin-top: 10px;
}
/* Full plan names ("Water Cooler Servicing Plan") fit the card header on two lines. */
.wcs-servicing-pricing .pr-content .pr-tab.active-tab .pricing-block-one .pricing-table .title h3 {
    font-size: 19px;
    line-height: 25px;
}
.wcs-servicing-pricing .pr-content .pr-tab .pricing-block-one .pricing-table .title h3 {
    font-size: 15px;
    line-height: 20px;
}
@media only screen and (max-width: 480px) {
    .wcs-servicing-pricing .tab-btn-box .tab-btns li {
        font-size: 14px;
        padding: 10px 6px;
    }
}

/* Site logo (Water Cooler Shop, 600x237 transparent PNG; white version on the dark mobile menu and footer):
   sized by height so it keeps its proportions.
   Header keeps the theme's height: 76px logo + 19px padding = the old 56px logo + 29px padding. */
.main-header .logo-box {
    padding: 19px 0;
}
.main-header .logo-box .logo,
.sticky-header .logo-box .logo {
    max-width: none;
}
.main-header .logo-box .logo img {
    height: 76px;
    width: auto;
}
.sticky-header .logo-box .logo img {
    height: 54px;
    width: auto;
}
.mobile-menu .nav-logo img {
    height: 60px;
    width: auto;
}
/* Footer (navy) uses the white version of the logo. */
.main-footer .footer-logo img {
    height: 76px;
    width: auto;
}
@media only screen and (max-width: 767px) {
    .main-header .logo-box .logo img {
        height: 58px;
    }
}
/* Long footer contact details (e.g. info@watercoolershop.co.nz) fit the narrow column instead of being cut off. */
.main-footer .contact-widget .info-list li {
    overflow-wrap: anywhere;
}
.main-footer .contact-widget .info-list li a[href^="mailto:"] {
    font-size: 12.5px;
    letter-spacing: -0.2px;
}

/* Request a Quote page: two-step quote form on a navy panel (theme navy #172746, blue #00d1f9). */
.wcs-quote {
    background: #172746;
    border-radius: 20px;
    color: #ffffff;
    margin: 0 auto 50px;
    max-width: 1100px;
    padding: 45px 50px 40px;
}
.wcs-quote__intro {
    margin-bottom: 35px;
    text-align: center;
}
.wcs-quote__intro h2 {
    color: #ffffff;
    font-size: 30px;
    margin-bottom: 8px;
    text-transform: uppercase;
}
.wcs-quote__intro p {
    color: rgba(255, 255, 255, 0.85);
    margin: 0;
}
.wcs-quote__intro a {
    color: #00d1f9;
    font-weight: 600;
}
.wcs-quote-step {
    padding: 0 35px;
}
.wcs-quote-step--contact {
    border-left: 1px solid rgba(255, 255, 255, 0.25);
}
.wcs-quote-step h3 {
    color: #ffffff;
    font-size: 22px;
    line-height: 30px;
    margin-bottom: 20px;
}
.wcs-quote-step h3 span {
    color: #00d1f9;
    font-size: 28px;
}
.wcs-quote .wcs-quote-label {
    color: #ffffff;
    font-weight: 600;
    margin-bottom: 10px;
}
.wcs-quote .form-group {
    margin-bottom: 15px;
}
.wcs-quote .default-form .form-group input[type='text'],
.wcs-quote .default-form .form-group input[type='email'],
.wcs-quote .default-form .form-group input[type='tel'],
.wcs-quote .default-form .form-group textarea {
    background: #ffffff;
    border-color: #ffffff;
    border-radius: 6px;
    height: 50px;
}
.wcs-quote .default-form .form-group textarea {
    height: 130px;
}
.wcs-quote .wpcf7-radio .wpcf7-list-item {
    margin: 0 22px 10px 0;
}
.wcs-quote .wpcf7-list-item label {
    align-items: center;
    color: #ffffff;
    cursor: pointer;
    display: inline-flex;
    gap: 8px;
}
.wcs-quote .wpcf7-acceptance .wpcf7-list-item,
.wcs-quote .wpcf7-checkbox .wpcf7-list-item {
    margin: 0;
}
.wcs-quote .wpcf7-acceptance .wpcf7-list-item label {
    align-items: flex-start;
}
.wcs-quote .wpcf7-acceptance .wpcf7-list-item-label,
.wcs-quote .wpcf7-checkbox .wpcf7-list-item-label {
    color: rgba(255, 255, 255, 0.85);
    font-size: 13px;
    line-height: 20px;
}
.wcs-quote .wpcf7-acceptance input,
.wcs-quote .wpcf7-checkbox input {
    margin-top: 3px;
}
.wcs-quote .wpcf7-acceptance a {
    color: #00d1f9;
}
.wcs-quote .wpcf7-response-output {
    color: #ffffff;
}
/* Product strip under the form (in place of Culligan's photo), blue top line as on their page. */
.wcs-quote-range {
    background: #ffffff;
    border-top: 5px solid #00d1f9;
    border-radius: 0 0 20px 20px;
    box-shadow: 0 10px 30px rgba(23, 39, 70, 0.08);
    margin: 0 auto 30px;
    max-width: 1100px;
    padding: 30px 20px;
}
.wp-style .wcs-quote-range__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    list-style: none;
    margin: 0;
    padding: 0;
}
.wp-style .wcs-quote-range__list li {
    margin: 10px;
    text-align: center;
    width: 170px;
}
.wcs-quote-range__list img {
    display: block;
    height: 160px;
    margin: 0 auto 12px;
    object-fit: contain;
    width: auto;
}
.wcs-quote-range__list span {
    color: #172746;
    display: block;
    font-weight: 600;
}
@media only screen and (max-width: 991px) {
    .wcs-quote {
        padding: 35px 20px 30px;
    }
    .wcs-quote-step {
        padding: 0 15px;
    }
    .wcs-quote-step--contact {
        border-left: 0;
        border-top: 1px solid rgba(255, 255, 255, 0.25);
        margin-top: 20px;
        padding-top: 25px;
    }
}

/* Shop search (cooler finder) button: brand blue like the theme buttons, navy on hover. */
.mr-search-box-form button,
.mr-search-box-form button:hover,
.mr-search-box-form button:focus {
    border-radius: 30px;
    color: #ffffff;
    padding: 15px 30px;
}
.mr-search-box-form button {
    background: #00d1f9;
    border-color: #00d1f9;
}
.mr-search-box-form button:hover,
.mr-search-box-form button:focus {
    background: #172746;
    border-color: #172746;
}

/* Home slider photos (P3-18, P3-21, P3-22): the theme pins every slide image by its right edge;
   ours are narrower than the theme's images, so they sat too far right. Shift each so its centre
   lines up with the other slides. The slider image is hidden at 1200px and below. */
@media (min-width: 1201px) {
    .banner-style-two .image-box .image img[src*="slide-2-slider"],
    .banner-style-two .image-box .image img[src$="/slide-1.png"],
    .banner-style-two .image-box .image img[src*="slider-3-slider"] {
        position: relative;
    }
    /* Slide 1: two people with a cooler. */
    .banner-style-two .image-box .image img[src*="slide-2-slider"] {
        left: -190px;
    }
    /* Slide 2: cooler and drinking fountain — shorter than the photos (and the theme places this
       slide's image higher), so it also moves down to sit on the wave like the others. */
    .banner-style-two .image-box .image img[src$="/slide-1.png"] {
        left: -80px;
        top: 140px;
    }
    /* Slide 3: technician with fountains. */
    .banner-style-two .image-box .image img[src*="slider-3-slider"] {
        left: -135px;
    }
}
/* Narrower desktops: slides 2 and 3 are the widest images, so make them a little smaller there to
   keep them on screen. */
@media (min-width: 1201px) and (max-width: 1399px) {
    .banner-style-two .image-box .image img[src$="/slide-1.png"],
    .banner-style-two .image-box .image img[src*="slider-3-slider"] {
        left: -160px;
        width: 620px;
        height: auto;
    }
}
@media (min-width: 1201px) and (max-width: 1299px) {
    .banner-style-two .image-box .image img[src$="/slide-1.png"],
    .banner-style-two .image-box .image img[src*="slider-3-slider"] {
        left: -185px;
        width: 580px;
    }
}
