/*
 Theme Name:   Carers in Bedfordshire Theme
 Author:       Silvertoad
 Author URI:   https://silvertoad.co.uk/
 Template:     hello-elementor
 Version:      1.0.0
 Text Domain:  silvertoad-child
*/

/* Add your custom CSS below */

/** MT 04/03/2025 */
.elementor-widget-wp-widget-nav_menu {
    flex: 1 0 auto;

    .menu-main-menu-container {
        height: 100%;
    }
}

#menu-main-menu {
    list-style: none;
    display: flex;
    flex-direction: row;
    height: 100%;

    li {
        position: relative;
        
        a {
            color: inherit;      
        }

       &.menu-item-has-children > a {
            &::after {
                font-size: 1.5em;
                content: '+';
            }
            
            display: flex;
            flex-direction: row;
            justify-content: space-between;
        } 

        &:hover {
            color: var(--e-global-color-accent);
        }

        &:hover {
            > ul {
                opacity: 1;
                pointer-events: initial;
                translate: 0 0;
            }
        }

        ul {
            display: flex;
            flex-direction: column;
            position: absolute;
            top: 0;
            left: 100%;
            background: white;
            padding: 1em;
            list-style: none;
            width: max-content;
            border-radius: 1em;
            z-index: 10;
            opacity: 0;
            pointer-events: none;
            box-shadow: 0 0 8px #00000040;
            transition: all 0.5s;
            translate: 0 10px;

            li {
                padding: 0.5em;
                color: var(--e-global-color-text);
            }

        }
    }
    
    > li {
        flex: 1 0 auto;
        z-index: 10;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        padding: 0 0.5em;
        border-bottom: 3px solid transparent;
        color: white;

        > a {    
            gap: 0.5em;
        }
        
        > ul {
            top: calc(50% + 1em);
            left: 0;
        }

        &:hover {
            border-bottom-color: currentColor;
        }
    }
}


.cib-event-filter {
    display: flex;
    flex-direction: row;
    gap: 1em;
    margin: 2em 0;
    align-items: stretch;

    > label {
        display: flex;
        flex-direction: row;
        gap: 1em;
        flex: 1 1 auto;
        align-items: center;

        > span {
            flex: 0 1 max-content;
        }

        > input, > select {
            flex: 1 1 max-content;
            align-self: stretch;
        }
    }
      

}

.cib-event-date {
    display: flex;
    flex-direction: column;
    color: white;
    gap: 0.5em;
    text-transform: uppercase;
    font-weight: bold;
    text-align: center;
    
    > .month {
        font-size: 12px;
    }

    > .day {
        font-size: 24px;
    }
}