/**
Theme Name: Quixote
Author: ModOp
Author URI: https://www.modop.com
Description: A custom child theme developed by Mod Op to extend and personalize the functionality and design of the parent theme while maintaining best practices and performance.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: quixote
Template: astra
*/

html {
    /*
	--e-global-color-ac933eb: #0693E4; // Light Blue
    --e-global-color-05d76d9: #0079BF; // Light Blue 2
    --e-global-color-9f3f3fe: #002147; // Dark Blue
    --e-global-color-4a96b91: #001630; // Dark Blue 2
    --e-global-color-c45df5a: #002C5E; // Dark Blue 3
    --e-global-color-d334187: #FFFFFF; // White
    --e-global-color-a2b6bd1: #FAFAFA; // Light Gray
    --e-global-color-69128c3: #EEEEEE; // Light Gray 2
    --e-global-color-4c11b5a: #A7A7A7; // Light Gray 3
    --e-global-color-3ef7188: #757575; // Medium Gray
    --e-global-color-8ca4187: #545454; // Dark Gray
    --e-global-color-36564d0: #282828; // Extra Dark Gray
	*/

    /* asigning legible names to the color variables created by elementor */
    --color-light-blue: var(--e-global-color-ac933eb); // Light Blue
    --color-light-blue-2: var(--e-global-color-05d76d9); // Light Blue 2
    --color-dark-blue: var(--e-global-color-9f3f3fe); // Dark Blue
    --color-dark-blue-2: var(--e-global-color-4a96b91); // Dark Blue 2
    --color-dark-blue-3: var(--e-global-color-c45df5a); // Dark Blue 3
    --color-white: var(--e-global-color-d334187); // White
    --color-light-gray: var(--e-global-color-a2b6bd1); // LightGray
    --color-light-gray-2: var(--e-global-color-69128c3); // LightGray 2
    --color-light-gray-3: var(--e-global-color-4c11b5a); // LightGray 3
    --color-medium-gray: var(--e-global-color-3ef7188); // Medium Gray
    --color-dark-gray: var(--e-global-color-8ca4187); // Dark Gray
    --color-extra-dark-gray: var(--e-global-color-36564d0); // Extra Dark Gray
}

body {
    max-width: initial !important;
}

@media (max-height: 900px) {
    #adminmenuwrap {
        overflow-y: auto !important;
        max-height: 100vh !important;
    }
}

/* Disable astra container padding */
.ast-container {
    max-width: initial;
    padding: 0;
}

p:last-child {
    margin-bottom: 0 !important;
}

/* BUTTONS (Elementor doesn't support active/focus states */
.btn-primary {
    .elementor-button {
        border: 1px solid transparent;
        transition-duration: 350ms;

        &:active {
            background-color: var(--e-global-color-9f3f3fe) !important;
        }
        &:focus {
            border: 1px solid var(--e-global-color-9f3f3fe) !important;
        }
    }
    &.bg-dark {
        .elementor-button {
            &:active {
                background-color: var(--e-global-color-d334187) !important;
                color: var(--e-global-color-ac933eb) !important;
            }
        }
    }
}

.btn-secondary {
    .elementor-button {
        border: 1px solid transparent;
        transition-duration: 350ms;

        /* ARROWW ICON ANIMATION */
        svg {
            transition: all 0.3s ease-in-out;
        }

        &:hover {
            svg {
                transform: translateX(3px);
            }
        }

        &:active {
            color: var(--e-global-color-9f3f3fe) !important;
            border: 1px solid var(--e-global-color-9f3f3fe) !important;
            svg {
                fill: var(--e-global-color-9f3f3fe) !important;
            }
        }
        &:focus {
            color: var(--e-global-color-c45df5a) !important;
            border: 1px solid var(--e-global-color-c45df5a) !important;
            svg {
                fill: var(--e-global-color-c45df5a) !important;
            }
        }
    }
    &.bg-dark {
        .elementor-button {
            &:active,
            &:focus {
                color: var(--e-global-color-d334187) !important;
                border: 1px solid var(--e-global-color-d334187) !important;
                svg {
                    fill: var(--e-global-color-d334187) !important;
                }
            }
        }
        &.no-left {
            .elementor-button {
                border-top: 0 !important;
                border-right: 0 !important;
                border-left: 0 !important;
                padding-left: 0;
            }
        }
    }
    &.no-left {
        .elementor-button {
            border-top: 0 !important;
            border-right: 0 !important;
            border-left: 0 !important;
            padding-left: 0;
        }
    }
}

/* disable blue separator for footer landing */
.home {
    footer .elementor-shape {
        display: none;
    }
}

/* fonts */
.font-light-blue {
    color: var(--e-global-color-ac933eb);
}
.font-bold {
    font-weight: 700;
}

/* ACCORDION */
.quixote-accordion {
    a {
        color: var(--e-global-color-ac933eb); /* light blue */
        font-weight: bold;

        &:hover {
            color: var(--color-dark-blue); /* dark blue */
        }
    }

    details {
        summary {
            background-color: var(--e-global-color-a2b6bd1); /* light grey */
        }
        > div {
            background-color: var(--e-global-color-a2b6bd1);
            padding: 0 24px 12px;
        }
    }

    &.alt {
        details {
            h4 {
                font-size: 16px;
                font-weight: 700;
                line-height: 120%;
            }
            summary {
                background-color: var(--e-global-color-69128c3); /* light grey 2 */
            }
            > div {
                background-color: var(--e-global-color-69128c3);
                padding: 0 48px 32px;
            }
        }
    }
}

/*
@media screen and (min-width: 1024px) {
    .quixote-accordion {
        details { 
            summary { 
            }
            > div {
            }
        }
    }
}
*/

/* BREADCRUMBS */
.quixote-breadcrumb {
    #breadcrumbs span {
        display: flex;
        gap: 10px;
        font-size: 20px;

        a {
            font-weight: 400;
        }

        a,
        .breadcrumb_last {
            font-size: 16px;
        }
        .breadcrumb_last {
            font-weight: 700;
        }
    }
}

/* STUDIOS CAROUSEL */
.quixote-studios-carousel {
    .e-n-carousel.swiper {
        padding-bottom: 0;
    }
    .arrow-dot-container {
        position: relative;

        margin: 0 auto;
        top: -45px;
        margin-top: -45px;

        display: flex;
        justify-content: center;
        width: fit-content;

        z-index: 10;
    }

    .swiper-pagination {
        position: relative;
        top: auto;
        left: auto;
        right: auto;
        bottom: auto;
        margin: auto;
        transform: initial;
    }

    .swiper-pagination-bullet {
        height: 24px;
        width: 24px;
        background-color: transparent !important;
        background-image: url("/wp-content/uploads/2025/10/carousel-pagination-dot-white.svg");
        background-size: contain;
        background-repeat: no-repeat;
        opacity: 1;
        transition-duration: 350ms;
    }

    .swiper-pagination-bullet:hover,
    .swiper-pagination-bullet-active {
        background-image: url("/wp-content/uploads/2025/10/carousel-pagination-dot-blue.svg");
    }

    .swiper-pagination-bullet:hover {
        transform: scale(1.3);
    }
    .arrow {
        cursor: pointer;

        height: 28px;
        width: 28px;

        margin-left: 12px;
        margin-right: 12px;
        background-color: transparent;
        background-size: contain;
        background-repeat: no-repeat;
        transition-duration: 350ms;

        &.left {
            background-image: url("/wp-content/uploads/2025/10/carousel-arrow-left.svg");
        }
        &.right {
            background-image: url("/wp-content/uploads/2025/10/carousel-arrow-right.svg");
        }
        &:hover {
            transform: scale(1.3);
        }
    }
}

@media screen and (min-width: 1024px) {
    .quixote-studios-carousel {
        .arrow-dot-container {
            top: -40px;
            margin-top: -50px;
        }
        .arrow {
            height: 34px;
            width: 34px;
            margin-left: 24px;
            margin-right: 24px;
        }
    }
}

/* VERTICAL TITLES (for the heros)  */
.vertical-titles {
    border-bottom: 2px solid var(--e-global-color-ac933eb);
    width: 100%;
}

@media screen and (min-width: 1200px) {
    .vertical-titles {
        writing-mode: vertical-rl;
        transform: rotate(180deg);
        border-bottom: 0;
        border-left: 2px solid var(--e-global-color-ac933eb);
        width: auto;
    }
}

/* WIDE BLUE BUTTONS CONTAINER */
@media screen and (min-width: 1024px) {
    .blue-buttons-container-wide {
        display: flex;
        align-items: stretch;
        margin-top: 10px;

        .elementor-button {
            flex: 1 1 auto;
            text-align: center;
        }

        .elementor-button {
            min-width: max(60%, 300px);
        }
    }
}


/* COOKIEYES - CONSENT OVERRIDES*/
.cky-consent-container,
.cky-modal {
    font-family: "Inter", Sans-serif;
    border-radius: 0 !important;

    .cky-title,
    .cky-preference-title {
        text-transform: uppercase;
    }
    .cky-notice-des p,
    .cky-preference-body-wrapper p {
        font-size: 16px;
    }
    .cky-consent-bar {
        border-radius: 0 !important;
    }
    .cky-notice-btn-wrapper {
        gap: 16px;
    }
    .cky-btn {
        background-color: #002147;
        border: 0 !important;
        font-family: "Inter", Sans-serif;
        font-size: 16px;
        transition-duration: 350ms !important;
        padding: 12px 24px !important;

        &.cky-btn-preferences,
        &.cky-btn-customize,
        &.cky-btn-reject {
            color: #002147 !important;

            &:hover {
                color: #002C5E !important;
            }
        }
        &.ky-btn-accept:hover {
            background-color: #002147 !important;
        }
    }

    .cky-preference-header .cky-btn-close img {
        height: 24px;
        width: 24px;

        svg path {
            fill: darkblue;
        }
    }
    .cky-accordion-btn,
    .cky-show-desc-btn,
    .cky-always-active {
        text-transform: uppercase !important;
    }
}

/* ASTRA - SCROLL TO TOP ICON */
#ast-scroll-top {
    background-color: #0693e4;
    border-radius: 100px;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.3);
    transition-duration: 350ms;

    &:hover {
        background-color: #0079bf;
        box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.5);
    }
}

/* Hide ScrollToTop button on desktop */
@media screen and (min-width: 1024px) {
    #ast-scroll-top {
        display: none !important;
    }
}

/* COOKIEYES - ROUND FLOATING BUTTON */
.cky-btn-revisit-wrapper {
    background-color: #0693e4 !important;
    transition-duration: 350ms;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.3);

    &:hover {
        background-color: #0079bf !important;
        box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.5);
    }
}

/* USERWAY OVERRIDE */
body .uwy .userway_buttons_wrapper {
    /*right: auto !important;*/
    top: auto !important;
    bottom: 13px !important;
}

/* PDP Forced Hero image */
#content > .ast-container > [data-elementor-type="wp-post"] {
	 
	> [data-element_type="container"]:first-child {
		min-height: 250px !important;
	} 
	@media screen and (min-width: 1024px) {
		> [data-element_type="container"]:first-child {
			min-height: 425px !important;
		} 
	}
	
	> .elementor-element {
    background-size: contain !important;
    background-position: center !important;
    background-repeat: no-repeat !important;		
	}
}

/* PRODUCT GRID ALIGNMENTS */
.quixote-lb-product-container .e-con-inner {
    display: grid;
    align-items: end !important;
    grid-auto-columns: auto;
}

/* MORE INFO */
.more-info-accordion {
    ul {
        margin-left: 12px;
        
        li {
            font-family: var(--e-global-typography-02f8bb0-font-family), Sans-serif;
            font-style: normal;
            font-weight: 400;
            font-size: 16px;
            line-height: 24px;
            color: var(--e-global-color-36564d0);
        }
    }
}


/* POPUPS CENTERING */
.dialog-widget .dialog-message .elementor-location-popup .elementor-widget-container {
	display: grid;
    align-items: center;
    justify-content: center;
    align-content: center;
}