/* ---- HEADER ---- */
header .head-top-row img{
    width: auto !important;
    height: 17px !important;
}

header .head-top-row a:hover{
    text-decoration: underline var(--wp--preset--color--accent-2) 2px !important;
}

header .head-top-row a{
    transition: text-decoration 0.3s ease !important;
    text-decoration-color: var(--wp--preset--color--accent-2);
}

:where(.wp-site-blocks *:focus) {
    outline-width: 0px;
    outline-style: solid;
}

:where(.wp-site-blocks *:focus-visible) {
    outline-width: 2px;
    outline-style: solid;
    border-radius: 4px;
} 

/* ----- NAV ------ */
.main-nav {
    max-width: 1200px;
    flex-wrap: nowrap;
    justify-content: space-evenly;
}

.main-nav li{
    width: 100%;
    max-width: 172px;
}

.main-nav li a{
    border-radius: 0px 0px 15px 15px;
    width: 100%;
    height: 100%;
    padding: 1.0rem 0 !important;
    display: flex !important;
    align-items: center;
    justify-content: space-evenly;
    transition: background-color 0.3s ease,
    color 0.3s ease;

}

.main-nav li:not(.current-menu-item) a{
    color: var(--wp--preset--color--contrast-3) !important;
    background-color: var(--wp--preset--color--base-2) !important;
}

.main-nav li.current-menu-item a,
.main-nav li:hover a{
    color: var(--wp--preset--color--base) !important;
    background-color: var(--wp--preset--color--accent) !important;
    text-decoration: none;
}


/* -----INLINE IMG------ */
.inline-img-left,
.inline-img-left a{
    display: flex;
    gap: 0.5em;
    align-items: center;
}


/* --- LOOP CARD --- */

.loop-card {
    position: relative;
}

.loop-card .cover>span {
    display: none;
}

.loop-card .wp-block-cover__inner-container {
    display: flex;
}

.loop-card .cover .cover-static-content {
    display: flex;
    width: 100%;
    position: absolute;
    min-height: 100%;
    top: 0;
}

.loop-card .cover-overlay {
    z-index: 99;
    position: absolute;
    background-color: var(--wp--preset--color--accent-5);
    width: 100%;
    opacity: 0;
    top: 0;
    transition: opacity 0.3s ease;
}

.loop-card .cover:hover .cover-overlay {
    opacity: 1;
}

.loop-card .card-title {
    position: relative;
}

.loop-card .card-title:not(.no-after)::after,
.head-with-after::after {
    content: '';
    height: 9px;
    width: 3.5rem;
    background-color: var(--wp--preset--color--accent-2);
    bottom: 0;
    left: 0;
    position: absolute;
}

.pdf-hover-link {
    color: var(--wp--preset--color--base);
    transition: color 0.3s ease;
}

.download-button {
    transition: color 0.3s ease, background-color 0.3s ease;

}

.download-button:hover {
    color: var(--wp--preset--color--contrast-3) !important;
    background-color: var(--wp--preset--color--base) !important;
}

.download-button:hover .dwnld-button-a {
    color: var(--wp--preset--color--contrast-3) !important
}

/* ---- DIRECTORIES ---- */

.directories-loop{
    gap: 5rem 3rem !important;
}

.directories-loop li{
    position:relative;
}

.loop-card .cover .dir-info-column{
    padding: 2.2em 0 2.2em 1.5rem !important;
}

.loop-card .year{
    margin-top: auto !important;
}
.dir-image-cont{
    position: relative;
    z-index: 10;
}
.dir-image-cont::before{
    content: '';
    width: 1rem;
    height: 100%;
    background: rgba(32, 170, 151, 0.60);
    position: absolute;
    z-index: 20;
}

/* --- VIDEOS PAGE --- */

.presenters .value:has(ul) ul{
    list-style-type: none !important;
    padding-left: 0 !important;
}

.presenters a.term-link{
    pointer-events: none;
    position: relative;
    padding-left: 2rem;
    display: flex !important;
}

.presenters a.term-link::before{
    content: "•";
    left: 0.8rem;
    position: absolute;
}

.slides-download{
    background-color: var(--wp--preset--color--contrast-3);
    border: 1px solid var(--wp--preset--color--contrast-3);
    color: var(--wp--preset--color--base);
    border-radius: 20px;
    padding: 0.4rem 1.6rem;
    display: flex;
    max-width: max-content;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.slides-download:hover{
    background-color: transparent;
    color: var(--wp--preset--color--contrast-3); 
}



/* --- ASPECT RATIOS --- */
.fact-sheets .cover{
    min-height: unset !important;
    aspect-ratio: 279/193;
}

.templates .cover{
    min-height: unset !important;
    aspect-ratio: 368/222;
}

.videos .cover{
    min-height: unset !important;
    aspect-ratio: 368/207;
}


/* --- VIDEOS --- */
iframe{
    width: 100% !important;
    aspect-ratio: 368/207;
    height: 100% !important;
}

/* --- ACCOUNT PAGES --- */
.head-with-after{
    position: relative;
}

#form_change-password .frm_form_field{
    grid-template-columns: 30% auto;
}
#form_change-password .frm_button_submit{
    display: flex;
    gap: 0.5rem;
    font: 600 1rem "Open sans";
    transition: all 0.3s ease;
    margin-top: 1rem;
    border-radius: 30px;
    
}

#field_conf_muxm5_label{
    visibility: visible;
}


.frm_button_submit:hover,
.wp-element-button:hover,
#wp-submit0:hover,
.frm_submit input[type='submit']:hover,
.wp-block-loginout:hover a{
    background-color: var(--wp--preset--color--contrast-3) !important;
    border-color: var(--wp--preset--color--contrast-3) !important;
    color: white !important;
    padding-left: 2rem !important;
    padding-right: 2rem !important;
}

#form_change-password .frm_button_submit::before{
    content: url("/wp-content/uploads/2023/12/mlcoa-padlock-icon.svg");
    width: 15px;
    height: 18px;
}

.wp-block-button__link, .wp-element-button, .frm_button_submit, .wp-block-loginout a{
    transition: 0.3s ease;
    transition-property: background-color, padding-left, padding-right !important;
}


.wp-block-loginout a{
    background-color: transparent;
    border: 2px solid var(--wp--preset--color--contrast-3);
    border-radius: 30px ;
    padding: 0rem 1em;
    color: var(--wp--preset--color--contrast-3);
    display: flex; 
    align-items: center;
    height: 2rem;
	line-height: 1;
}

/* LOGIN PAGE */
#loginform-0{
    max-width: 500px;
}

#wp-submit0,
.frm_submit input[type='submit'],
{
    color: white;
    padding: 0.4em 1.2em !important;
    border-radius: 30px !important;
    box-shadow: none !important;
    background-color: var(--wp--preset--color--accent) !important;
    border-color: var(--wp--preset--color--accent) !important;
    font-family: "Open sans" !important;
    transition: all 0.3s ease !important;
    margin-bottom: 1rem ;
}


.frm_submit button.frm_button_submit{
    margin-top: 1rem !important;
}

.login-remember {
	margin-top: 1rem;
	margin-bottom: 1.25rem !important;
}

/* --- SEARCH RESULTS --- */
.search-results li:not(.type-page) .wp-block-group.cover-static-content{
    display: none;
}

.search-results li:not(.type-directory) .wp-block-columns.cover-static-content{
    display: none;
}

.search-results li.type-page h3{
    text-align: left;
}

button.wp-block-search__button {
	border-radius: 30px !important;
}

/* --- OTHER --- */
.entry-content p a {
	text-decoration: underline;
}


/* --- PAGINATION --- */
/* Pagination container */
nav.wp-block-query-pagination {
  display: flex;
  justify-content: center;
  margin-top: 20px; /* Adjust as needed */
}

/* Previous page link */
.wp-block-query-pagination-previous,
.wp-block-query-pagination-next {
  background-color: var(--wp--preset--color--accent);
  color: #fff;
  padding: 8px 12px;
  border-radius: 4px;
  text-decoration: none;
  margin: 0 5px; /* Adjust as needed */
}

/* Pagination numbers */
.wp-block-query-pagination-numbers {
  display: flex;
  list-style: none;
  padding: 0;
}

.wp-block-query-pagination-numbers .page-numbers {
  background-color: var(--wp--preset--color--accent);
  color: #fff;
  padding: 8px 12px;
  margin-right: 5px;
  border-radius: 4px;
  text-decoration: none;
}

/* Active page */
.wp-block-query-pagination-numbers .page-numbers.current {
  background-color: var(--wp--preset--color--accent-2);
}

/* Hover effect */
.wp-block-query-pagination-numbers .page-numbers:hover,
.wp-block-query-pagination-previous:hover,
.wp-block-query-pagination-next:hover {
  color: #fff;
  background-color: var(--wp--preset--color--accent-2);
}



/* ---- MEDIA QUERIES ---- */

/* -- ABOVE MOBILE --  */
@media screen and (min-width: 1001px){
    .mobile-page-title{
        display: none !important;
    }
}


/* -- MOBILE -- */
@media screen and (max-width: 1000px){

/* HEADER */
    header .head-top-row .wp-block-group{
        gap: 2.5rem;
    }
    header .head-top-row img{
        height: 25px !important;
    }

    header .head-top-row mark{
        display: none; 
    }

    header .button-row strong{
        display: none;
    }


/* NAVIGATION */
    .main-nav.desktop{
        display: none !important;
    }

    #modal-3-content{
        padding-top: 2.75rem;
    }

    .main-nav.mobile button[aria-label="Close menu"]{
        transform: scale(1.5);
        right: 1.5rem;
    }

    ul.main-nav.mobile{
        width: 75vw;
        gap: 0.75rem !important;
    }

    ul.main-nav.mobile a {
        border-radius: 0;
        font-size: 1.3rem;
    }

    .mobile-page-title{
        position: relative;
    }

    .mobile-page-title nav>button{
        position: absolute;
        left: 0;
        transform: scale(1.25);
    }

    .directories-loop .cover {
        max-height: 25vh;
    }

    .directories-loop .wp-block-columns{
        max-height: 100%;
    }

    .directories-loop .dir-image-cont::before{
        top: auto !important;
        bottom: 0 !important
    }

    .dir-info-column .value,
    .dir-info-column p{
        font-size: var(--wp--preset--font-size--large) !important;
    }

    ul.wp-block-post-template {
        gap: 3rem !important;
    }

    .loop-card .loop-title{
        padding-top: 1rem !important;
        padding-bottom: 1.5rem !important;
    }


    .wp-block-query:not(.videos) .loop-card .card-title {
        padding-top: 1rem  !important;
        font-size: 1.2rem !important;
        padding-bottom: 1.2rem !important;
    }

    .templates-intro{
        padding: 1rem 0 2rem !important;
    }

    .videos .loop-card .card-title{
        font-size: var(--wp--preset--font-size--medium) !important;
    }

    .videos .loop-card .is-taxonomy-field{
        padding-bottom: 1rem !important;
    }

    .wp-block-query.videos{
        padding-bottom: 2rem;
    }

    .videos-intro{
        padding-top: 1rem;
        padding-bottom: 2rem !important;

    }


/* ACCOUNT DETAILS */
    .account-details .head-with-after{
        font-size: var(--wp--preset--font-size--large) !important;
        margin-bottom: 1.5rem !important;
    }

    .account-details .wp-block-column:first-child,
    .account-details .password-block{
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }

    .account-details .wp-block-loginout{
        padding-top: 2rem;
    }

    
}