/*
Theme Name: Cardrona Doctors
Theme URI: 
Author: Kasper Villemoes Hald
Author URI: https://www.linkedin.com/in/kasper-villemoes-hald/
Description: Child theme for Cardrona doctors made by Cre8ive Marketing
Requires at least: 6.9
Tested up to: 6.9
Requires PHP: 5.7
Version: 
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Template: twentytwentyfive
Text Domain: cardrona-doctors
Tags: 
*/
strong{
    font-weight: 600;
}
.wp-block-social-links .Fb-button.wp-social-link svg {
    height: 40px;
    width: 40px;
}
:where(.wp-block-social-links:not(.is-style-logos-only)) .wp-social-link-facebook{
    background-color: var(--wp--preset--color--custom-text-color);
}

:where(.wp-site-blocks *:focus) {
    outline: none;
}

:where(.wp-site-blocks *:focus-visible) {
    outline: 2px solid var(--wp--preset--color--accent-1); /* Use your brand green/blue */
    outline-offset: 2px; /* Gives it some breathing room */
    box-shadow: 0 0 5px rgba(0,0,0,0.2); /* Optional glow */
}

.footer_info a{
    font-size: var(--wp--preset--font-size--small) !important;
}

.grecaptcha-badge{
    display: none;
}

h1 { font-size: clamp(2.0rem,   3vw + 1rem,    3.0rem);    } /* 32px -> 48px */
h2 { font-size: clamp(1.75rem,  2vw + 1rem,    2.25rem);   } /* 28px -> 36px */
h3 { font-size: clamp(1.5rem,   1.5vw + 1rem,  1.875rem);  } /* 24px -> 30px */
h4 { font-size: clamp(1.25rem,  1vw + 1rem,    1.5625rem); } /* 20px -> 25px */
h5 { font-size: clamp(1.125rem, 0.75vw + 1rem, 1.375rem);  } /* 18px -> 22px */
h6 { font-size: clamp(1.0rem,   0.5vw + 1rem,  1.125rem);  } /* 16px -> 18px */



header.wp-block-template-part {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    z-index: 1000;
    background-color: transparent;
    color: rgb(255, 255, 255);
    padding-bottom: 30px;
    box-shadow: none;
    transition: background-color 0.6s, padding-top 0.6s, padding-bottom 0.6s, box-shadow 0.6s, color 0.6s;
}
p + h1,
p + h2,
p + h3,
p + h4,
p + h5,
p + h6 {
    margin-top: var(--wp--preset--spacing--50);
}

main a:where(:not(.wp-element-button)) {
    font-weight: 600;
}

.wp-block-table tr th {
    font-weight: 300;
    background-color: var(--wp--preset--color--custom-light-grey);
}
.wp-block-table thead {
    border-bottom: 1px;
}
.wp-block-table tfoot{
    border-top: 1px;
}

header.wp-block-template-part .main-menu{
    background-color: transparent !important;
    transition: background-color 0.6s, padding-top 0.6s, padding-bottom 0.6s, box-shadow 0.6s, color 0.6s;
}
header.wp-block-template-part .main-menu .wp-block-site-logo img{
    transition: all 0.6s;
    width: 150px;
}
header.wp-block-template-part.is-scrolled .main-menu .wp-block-site-logo img{
    width: 110px;
}


header.wp-block-template-part.is-scrolled .main-menu.has-accent-1-background-color{
    background-color: var(--wp--preset--color--accent-1) !important;
}
header.wp-block-template-part.is-scrolled .main-menu.has-accent-2-background-color{
    background-color: var(--wp--preset--color--accent-2) !important;
}
header.wp-block-template-part.is-scrolled .main-menu.has-accent-3-background-color{
    background-color: var(--wp--preset--color--accent-3) !important;
}
header.wp-block-template-part.is-scrolled .main-menu.has-accent-4-background-color{
    background-color: var(--wp--preset--color--accent-4) !important;
}
header.wp-block-template-part.is-scrolled .main-menu.has-accent-5-background-color{
    background-color: var(--wp--preset--color--accent-5) !important;
}
header.wp-block-template-part.is-scrolled .main-menu.has-accent-6-background-color{
    background-color: var(--wp--preset--color--accent-6) !important;
}



.wp-block-navigation .wp-block-navigation-item.hide_desktop {
    display: none;
}
header nav .wp-block-navigation .wp-block-navigation-item .wp-block-navigation-item__content{
    transition: all 0.6s;
}
:root header nav  :where(.wp-block-navigation a:where(:not(.wp-element-button)):hover){
    text-decoration: none;
    color: var(--wp--preset--color--accent-1) !important;
}
a.wp-block-navigation-item__content[aria-current="page"] {
    color: var(--wp--preset--color--accent-1) !important;
}


.Footer.nav a.wp-block-navigation-item__content[aria-current="page"]{
    color: inherit !important;
}


:root header nav :where(.wp-block-navigation .wp-block-navigation__submenu-container a:where(:not(.wp-element-button)):hover),
:root header nav :where(.wp-block-navigation a:where(:not(.wp-element-button)):hover),
.wp-block-navigation__submenu-container a.wp-block-navigation-item__content[aria-current="page"],
a.wp-block-navigation-item__content[aria-current="page"] {
    color: var(--wp--preset--color--custom-text-color) !important;
}

.current-menu-ancestor .wp-block-navigation-submenu__toggle,
.wp-block-navigation .current-menu-ancestor .wp-block-navigation__submenu-icon{
    color: var(--wp--preset--color--custom-text-color) !important;
}

ul.wp-block-list + h1,  p + h1,     .wp-block-columns + h1, .privacy .wp-block-group > h1,
ul.wp-block-list + h2,  p + h2,     .wp-block-columns + h2, .privacy .wp-block-group > h2,
ul.wp-block-list + h3,  p + h3,     .wp-block-columns + h3, .privacy .wp-block-group > h3,
ul.wp-block-list + h4,  p + h4,     .wp-block-columns + h4, .privacy .wp-block-group > h4,
ul.wp-block-list + h5,  p + h5,     .wp-block-columns + h5, .privacy .wp-block-group > h5,
ul.wp-block-list + h6,  p + h6,     .wp-block-columns + h6, .privacy .wp-block-group > h6 {
    margin-top: 50px !important;
}



@media (max-width: 1350px) {
    header .wp-block-navigation__container {
        display: none !important;
    }

    .wp-block-navigation__responsive-container-open {
        display: flex !important;
    }

    .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
        display: flex !important; /* Bring links back inside the open menu */
        flex-direction: column;   /* Stack them vertically */
        align-items: center;      /* Center align */
    }

    .wp-block-navigation__responsive-container.is-menu-open {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 10000;
        padding: 40px;
    }

    .menu-spacer, .wp-block-buttons.header_btns{
        display:none;
    }
    header.wp-block-template-part .menu-items nav {
        justify-content: end;
    }
    .wp-block-navigation__responsive-container-close svg, .wp-block-navigation__responsive-container-open svg {
        height: 40px;
        width: 40px;
    }
    .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open{
        background-color: var(--wp--preset--color--accent-3) !important;
    }
    .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item__content {
        display: block;
        padding: 8px 0;
        text-align: left;
        text-decoration: none;
        font-weight: 600;
        color: var(--wp--preset--color--white);
    }
    .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item{
        position: relative;
    }
    .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__submenu-icon {
        display: block;
        position: absolute;
        right: 10px;
        top: 15px;
    }
    .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .current-menu-item .wp-block-navigation-item__content {
        color: var(--wp--preset--color--custom-text-color) !important;
    }
 
    .important_left_align .has-text-align-right,
    .important_left_align .has-text-align-center {
        text-align: left;
    }
    .important_right_align .has-text-align-left,
    .important_left_align .has-text-align-center  {
        text-align: right;
    }
    .important_center_align .has-text-align-right,
    .important_left_align .has-text-align-left  {
        text-align: center;
    }

    /* --- 1. SETUP THE SUBMENU (Hidden by Default) --- */
    /* We look for the submenu container inside the mobile menu */
    .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
        max-height: 0;
        opacity: 0;
        overflow: hidden;
        visibility: hidden;
        display: none;
        
        /* Smooth Transition for the "Unfold" effect */
        transition: max-height 0.4s ease-out, opacity 0.3s ease, margin 0.3s ease;
        
        /* Reset spacing so it collapses fully */
        margin-top: 0 !important;
        padding: 0 !important;
        border: none;
    }

    /* --- 2. THE TRIGGER (Show when Button is Expanded) --- */
    /* This uses the 'aria-expanded' attribute that WP toggles automatically */
    /* The ~ symbol selects the sibling UL that comes after the button */
    .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle[aria-expanded="true"] ~ .wp-block-navigation__submenu-container {
        max-height: 1000px; /* Large enough to fit any menu */
        opacity: 1;
        display: block;
        visibility: visible;
        margin-top: 15px !important; /* Space between parent and children */
    }

    /* --- 3. CUSTOM PLUS ICON --- */
    /* First, hide the default chevron SVG */
    .wp-block-navigation__submenu-icon svg {
        display: none !important;
    }

    /* Create the Horizontal Line of the Plus */
    .wp-block-navigation__submenu-icon::before {
        content: '';
        display: block;
        width: 12px;
        height: 2px;
        background-color: currentColor; /* Matches text color */
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        transition: transform 0.3s ease;
    }

    /* Create the Vertical Line of the Plus */
    .wp-block-navigation__submenu-icon::after {
        content: '';
        display: block;
        width: 2px;
        height: 12px;
        background-color: currentColor;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        transition: transform 0.3s ease;
    }

    /* Set up the container for our new icon */
    .wp-block-navigation__submenu-icon {
        position: relative;
        width: 20px;
        height: 20px;
        display: inline-block;
        margin-left: 10px; /* Space from text */
    }

    /* --- 4. ANIMATE ICON (Plus to Minus) --- */
    /* When expanded, rotate the Vertical line 90deg to hide it (or rotate whole icon) */
    .wp-block-navigation-submenu__toggle[aria-expanded="true"] + .wp-block-navigation__submenu-icon::after {
        transform: translate(-50%, -50%) rotate(90deg);
    }
    
    /* Optional: Rotate the whole thing for flair */
    .wp-block-navigation-submenu__toggle[aria-expanded="true"] + .wp-block-navigation__submenu-icon {
        transform: rotate(180deg);
    }



}







:root :where(.is-style-fill a.wp-element-button, a.wp-block-button__link){
    transition: all 0.3s ease;
}

:root :where(.is-style-fill .wp-element-button:hover, .wp-block-button__link:hover){
    background-color:var(--wp--preset--color--white);
    color:var(--wp--preset--color--accent-3);
    border-color:var(--wp--preset--color--accent-3);
}



@media (max-width: 1100px) {
    .medium_screen_order_1{order:1;}
    .medium_screen_order_2{order:2;}
    .medium_screen_order_3{order:3;}
    .medium_screen_order_4{order:4;}
    .medium_screen_order_5{order:5;}
    .medium_screen_order_6{order:6;}
    .medium_screen_order_7{order:7;}
}

@media (max-width: 700px) {
    .top_banner .wp-block-cover {
        min-height: 200px !important;
    }
    
}

@media (max-width: 781px) {
    .reverse_cols{
        flex-direction: column-reverse;
    }
}
@media (max-width: 600px) {
    .small_screen_order_1{order:1;}
    .small_screen_order_2{order:2;}
    .small_screen_order_3{order:3;}
    .small_screen_order_4{order:4;}
    .small_screen_order_5{order:5;}
    .small_screen_order_6{order:6;}
    .small_screen_order_7{order:7;}

    .Footer.nav{
        gap:0;
    }
    .Footer.nav nav {
        width: 100%;
    }

    header.wp-block-template-part .main-menu .wp-block-site-logo img{
        width: 110px;
    }

}



#contact_form {
    width: 100%;
}
#contact_form .wp-block-columns {
    margin-bottom: 15px;
}
#contact_form input, #contact_form textarea {
    width: 100%;
    box-sizing: border-box;
    padding: 15px 15px;
    font-size: 1.24rem;
    border: 1px solid rgba(0, 0, 0, .3);
    color: rgba(0, 0, 0, .7);
}
#contact_form input[type=submit] {
    width: auto;
    background-color: var(--wp--preset--color--accent-3);
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
    border-bottom-left-radius: 2px;
    border-bottom-right-radius: 2px;
    border-top-color: var(--wp--preset--color--accent-3);
    border-top-width: 2px;
    border-top-style: solid;
    border-right-color: var(--wp--preset--color--accent-3);
    border-right-width: 2px;
    border-right-style: solid;
    border-bottom-color: var(--wp--preset--color--accent-3);
    border-bottom-width: 2px;
    border-bottom-style: solid;
    border-left-color: var(--wp--preset--color--accent-3);
    border-left-width: 2px;
    border-left-style: solid;
    color: var(--wp--preset--color--base);
    padding-top: var(--wp--preset--spacing--20);
    padding-right: var(--wp--preset--spacing--30);
    padding-bottom: var(--wp--preset--spacing--20);
    padding-left: var(--wp--preset--spacing--30);
    text-transform: uppercase;
    font-family: inherit;
    font-size: var(--wp--preset--font-size--medium);
    font-style: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
    line-height: inherit;
    transition: all 0.3s ease;
    cursor: pointer;
}
#contact_form input[type=submit]:hover{
    background-color: var(--wp--preset--color--white);
    color: var(--wp--preset--color--accent-3);
    border-color: var(--wp--preset--color--accent-3);
}