/*
 Theme Name:   Gadby
 Theme URI:    https://www.zonkey.co.uk
 Description:  Child theme for Zonkey
 Author:       Zonkey Solutions Ltd
 Author URI:   https://www.zonkey.co.uk
 Template:     zonkey
 Version:      1.9.12
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  zonkey-child
*/

/* ==========================================================================
   Child Theme Custom Styles
   ========================================================================== */

/* Add your custom styles below this line */

/* ==========================================================================
   Typography Overrides
   ========================================================================== */

/* Body text - matches design ratio of 30px/36px (1.2 line-height) */
body {
    font-size: clamp(1rem, 1.5vw, 1.25rem); /* 16px to 20px */
    line-height: 1.2;
}

/* Paragraph text */
p,
.wp-block-paragraph {
    font-size: clamp(1.0625rem, 1.75vw, 1.25rem); /* 17px to 20px */
    line-height: 1.2;
    margin-bottom: 1.5em;
}

/* Ensure consistent typography in content areas */
.entry-content p,
.wp-block-group p,
.site-content p {
    font-size: clamp(1.0625rem, 1.75vw, 1.25rem);
    line-height: 1.2;
}

/* ==========================================================================
   Testimonials Carousel - Force pagination dots visible
   ========================================================================== */

/* Override Splide v4 default that hides pagination when slides don't overflow */
.splide:not(.is-overflow) .splide__pagination {
    display: flex;
}

/* Testimonials carousel arrows - icon only, no background */
.zonkey-testimonials-display .splide__arrow,
.zonkey-testimonials-carousel .splide__arrow,
.zonkey-testimonials-display .zonkey-testimonials-carousel .splide__arrow {
    position: static !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    width: 100px !important;
    height: 100px !important;
    border-radius: 0;
    overflow: visible;
    pointer-events: auto;
}

.zonkey-testimonials-display .splide__arrow:hover,
.zonkey-testimonials-carousel .splide__arrow:hover {
    background: transparent !important;
    box-shadow: none !important;
    transform: none;
    opacity: 0.7;
}

.zonkey-testimonials-display .zonkey-testimonials-carousel .splide__arrow svg,
.zonkey-testimonials-display .splide__arrow svg,
.zonkey-testimonials-carousel .splide__arrow svg {
    width: 100px !important;
    height: 100px !important;
    color: rgba(255, 255, 255, 0.3);
}

@media (max-width: 768px) {
    .zonkey-testimonials-display .zonkey-testimonials-carousel .splide__arrow svg,
    .zonkey-testimonials-display .splide__arrow svg,
    .zonkey-testimonials-carousel .splide__arrow svg {
        width: 80px !important;
        height: 80px !important;
    }
}

/* Position arrows vertically centered on text, not full carousel including pagination */
.zonkey-testimonials-display .splide__arrows,
.zonkey-testimonials-carousel .splide__arrows {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    pointer-events: none;
    z-index: 10;
    /* Exclude pagination area from centering calculation */
    padding-bottom: 4rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transform: none;
}

/* Testimonials carousel pagination dots */
.zonkey-testimonials-display .splide__pagination,
.zonkey-testimonials-carousel .splide__pagination {
    gap: 12px;
    padding: 1.5rem 0 0;
}

.zonkey-testimonials-display .splide__pagination__page,
.zonkey-testimonials-carousel .splide__pagination__page {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.4);
    border: none;
    opacity: 1;
    transition: background 0.3s ease, transform 0.3s ease;
    padding: 0;
    margin: 0;
}

.zonkey-testimonials-display .splide__pagination__page.is-active,
.zonkey-testimonials-carousel .splide__pagination__page.is-active {
    background: #1a2b4a;
}

.zonkey-testimonials-display .splide__pagination__page:hover,
.zonkey-testimonials-carousel .splide__pagination__page:hover {
    background: rgba(255, 255, 255, 0.7);
}

.zonkey-testimonials-display .splide__pagination__page.is-active:hover,
.zonkey-testimonials-carousel .splide__pagination__page.is-active:hover {
    background: #1a2b4a;
}

/* Utility Classes - Border helpers for Zonkey containers and core blocks */
.border-bottom-primary .zonkey-container-inner,
.wp-block-columns.border-bottom-primary,
.wp-block-group.border-bottom-primary {
    border-bottom: 1px solid var(--primary-color, #000000);
}

.border-top-primary .zonkey-container-inner,
.wp-block-columns.border-top-primary,
.wp-block-group.border-top-primary {
    border-top: 1px solid var(--primary-color, #000000);
}

.border-bottom-secondary .zonkey-container-inner,
.wp-block-columns.border-bottom-secondary,
.wp-block-group.border-bottom-secondary {
    border-bottom: 1px solid var(--secondary-color, #000000);
}

.border-top-secondary .zonkey-container-inner,
.wp-block-columns.border-top-secondary,
.wp-block-group.border-top-secondary {
    border-top: 1px solid var(--secondary-color, #000000);
}

/* Split top borders — each column gets its own top border */
.wp-block-columns.split-border-top > .wp-block-column {
    border-top: 1px solid var(--primary-color, #1a2b4a);
    padding-top: 1.5rem;
}

.wp-block-columns.split-border-bottom > .wp-block-column {
    border-bottom: 1px solid var(--primary-color, #1a2b4a);
    padding-bottom: 1.5rem;
}

/* Secondary color variants */
.wp-block-columns.split-border-top-secondary > .wp-block-column {
    border-top: 1px solid var(--secondary-color, #3f81c3);
    padding-top: 1.5rem;
}

/* ==========================================================================
   Footer Customization
   ========================================================================== */

/* Footer 2 - Ensure background color applies to full-width parent */
.site-footer .footer-section.footer-2 {
    background-color: var(--footer2-bg-color, #f9fafb);
}

/* Footer 2 - Constrain inner content and center */
.footer-section.footer-2 .container {
    max-width: 860px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 20px;
    padding-right: 20px;
}

/* Footer widget titles - Larger size and tertiary color */
.footer-column .widget-title {
    font-family: var(--font-heading);
    font-size: 1.45rem;
    font-weight: 400;
    margin-bottom: 1rem;
    color: var(--color-tertiary) !important;
}

/* Footer column widths - Center column narrower to align under icon */
.footer-section.footer-2 .footer-widgets {
    display: flex;
    justify-content: space-between;
}

.footer-section.footer-2 .footer-widgets > .footer-column:nth-child(1) {
    flex: 0 0 38.666% !important;
    max-width: 38.666%;
}

.footer-section.footer-2 .footer-widgets > .footer-column:nth-child(2) {
    flex: 0 0 24.666% !important;
    max-width: 24.666%;
}

.footer-section.footer-2 .footer-widgets > .footer-column:nth-child(3) {
    flex: 0 0 36.668% !important;
    max-width: 36.668%;
}

/* Bottom footer - Match container width to footer-2 */
.site-footer .bottom-footer .container {
    max-width: 860px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 20px;
    padding-right: 20px;
}

.bottom-footer-right {
     width: 204px;
}

/* Footer responsive - Stack and center on mobile */
@media (max-width: 768px) {
    .footer-section.footer-2 .footer-widgets {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .footer-section.footer-2 .footer-widgets > .footer-column:nth-child(1),
    .footer-section.footer-2 .footer-widgets > .footer-column:nth-child(2),
    .footer-section.footer-2 .footer-widgets > .footer-column:nth-child(3) {
        flex: 0 0 100% !important;
        max-width: 100%;
        margin-bottom: 2rem;
    }

    .footer-section.footer-2 .footer-widgets > .footer-column:last-child {
        margin-bottom: 0;
    }

    /* Remove any borders/separators in footer on mobile */
    .footer-column,
    .footer-column .widget,
    .footer-column .widget-title,
    .footer-section,
    .bottom-footer {
        border: none !important;
    }

    /* Footer containers - match parent background to prevent bleed-through */
    .site-footer .footer-section .container {
        max-width: 100% !important;
        padding-left: 2rem;
        padding-right: 2rem;
    }

    /* Remove gaps between footer sections */
    .site-footer .footer-section {
        margin: 0 !important;
    }
}