/*
 Theme Name:   AI Lab Child Theme
 Theme URI:    https://www.cornell.edu
 Description:  Child theme for the Cornell Branded Theme (CWD CSS Framework). MPS 5900 Special Project • Fall 2025. Contact: ts942@cornell.edu
 Author:       Tomas Šiurna
 Author URI:   https://siurna.lt
 Template:     cwd_base_2024
 Version:      1.2.5b
 Text Domain:  cwd_base_2024
 License:      GPL-2.0-or-later
*/

/* =========================================================
   BASE
   ========================================================= */

html {
    scroll-behavior: smooth;
}

:root {
    --sticky-padding: 1em;
    --sticky-margin: calc(-1 * var(--sticky-padding));
}


/* =========================================================
   GRID + TEMPLATE TWEAKS (DESKTOP ≥768px)
   ========================================================= */

@media (min-width: 769px) {
    ul.wp-block-post-template-is-layout-grid {
        row-gap: var(--wp--preset--spacing--50);
    }

    .page-newsletter-archive article section {
        margin-bottom: 0;
        padding-bottom: 0;
        border-bottom: none;
    }
}


/* =========================================================
   SPACING UTILITIES
   ========================================================= */

.spacing-top {
    margin-top: 3em;
}

.spacing-top-xl {
    margin-top: 7em;
}

.spacing-bottom {
    margin-bottom: 3em;
}

.spacing-bottom-0 {
    margin-bottom: 0;
}


/* =========================================================
   WIDTH + TEXT UTILITIES
   ========================================================= */

.w-100 {
    width: 100%;
}

.text-balance {
    text-wrap: balance;
}

.p-tiny {
    max-width: 350px;
}

/* =========================================================
   HEADER — LOGO
   ========================================================= */

.cu-seal.cu-red .cu-logo a, .cu-seal.cu-black .cu-logo a, .cu-seal.cu-gray .cu-logo a {
  background-image: url("/wp-content/themes/ai_innovation_lab/images/cornell_seal.svg");
}

@media (min-width: 769px) {
    .cu-unit svg {
        width: auto;
        max-height: 80px;
        overflow: visible;
    }

    .has-utility-nav.cu-seal-right #cu-header .cu-brand .cu-unit {
        margin-top: -2.6em;
    }

    .cu-red.cu-seal #cu-header .cu-brand h1{
        margin-top: 0!important;
        margin-bottom: 0!important;
    }
}

/* =========================================================
   HEADER — ACTIVE ITEMS
   ========================================================= */

.current_page_item > a span:not(.fa),
body.single-post    .post-type-post-parent > a span:not(.fa),
body.single-tool    .post-type-tool-parent > a span:not(.fa),
body.single-project .post-type-project-parent > a span:not(.fa) {
    text-decoration: underline;
}

@media (min-width: 992px) {
    #super-header{
        z-index: 30;
        position: relative;
    }
}

/* =========================================================
   HEADER — IMAGE BAND POSITIONING
   ========================================================= */

#super-header.has_header_image #image-band{
    background-position: center;
}


/* =========================================================
   HEADER — BADGE STYLING
   ========================================================= */

.nav-badge {
    padding: 4px 10px !important;
    margin-left: 10px !important;
    background: #ffffff;
    color: #000000;
    line-height: 1;
    text-decoration: none !important;
}


/* =========================================================
   HEADER — DESKTOP FIXES ( ≥992px )
   ========================================================= */

@media (min-width: 992px) {
    .has_header_image #main-navigation {
        backdrop-filter: blur(6px);
    }

    body:not(.mobile) #main-navigation li.menu-item-has-children a {
        padding-right: calc(1.7em + 8px);
    }
}

@media (min-width: 1024px) {
    #main-navigation li.disable-animations{
        display: none!important;
    }
}


/* =========================================================
   HEADER — LARGE DESKTOP FIX ( ≥1080px )
   ========================================================= */

@media (min-width: 1080px) {
    .cu-seal .mobile-button {
        height: 42px;
    }
}


/* =========================================================
   HEADER — UTILITY NAV LAYOUT ( ≥768px )
   ========================================================= */

@media (min-width: 768px) {
    .has-utility-nav.cu-seal-right #cu-header .cu-brand {
        padding-top: 80px;
    }
}


/* =========================================================
   HEADINGS
   ========================================================= */

body.h1-margin-sm h1,
body.single-tool h1 {
    margin-bottom: 0.45em !important;
}

@media (min-width: 992px) {

    body:not(.home) #main-article h1,
    body:not(.home) #main-article .h1 {
        margin-bottom: 1em;
        padding: 0 0 0.5em;
        font-size: 46px;
        border-bottom: 1px solid #ebebeb;
    }
}

@media (min-width: 770px) {
    h1.get_sidebar-filter {
        display: none;
    }
}

h2.more-content-heading{
    margin-bottom: var(--wp--preset--spacing--50);
}

/* =========================================================
   LINKS
   ========================================================= */

.wp-block-post-title a {
    color: var(--wp--preset--color--carnelian);
}

.wp-block-post-title a:hover {
    text-decoration: underline;
}

.is-style-outline--1 a:hover {
    color: var(--wp--preset--color--carnelian);
    border-color: var(--wp--preset--color--carnelian);
}


/* =========================================================
   SELECT ELEMENT
   ========================================================= */

select {
    padding: 10px 12px;
    border: 2px solid #dddddd;
    background: #eeeeee;
    font-family: inherit;
    transition: 0.4s;
}

select::picker-icon {
    color: #999999;
    transition: rotate 0.4s;
}

/* =========================================================
   A11Y — DISABLE ANIMATIONS LINK
   ========================================================= */

.full-bleed .home-hero-blocks,
.home-hero-blocks .acf-innerblocks-container{
  position: relative;
}

.disable-animations-container {
  position: absolute;
  color: white;
  bottom: -100px;
}

.disable-animations-container a,
.disable-animations-container a:hover{
  color: white;
  font-size: 0.8em;
}

.disable-animations-container button{
    color: white;
    outline: none;
    background: none;
    border: none;
    font-family: inherit;
    font-size: 0.8em;
    text-decoration: underline;
}

#get-involved-starpath .disable-animations-container {
    position: absolute;
    bottom: 40px;
    width: 100%;

    text-align: center;
    margin-left: auto;
    margin-right: auto;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
}

@media (max-width: 767px) {
    #get-involved-starpath .disable-animations-container,
    .disable-animations-container a{
        display: none;
    }
}

@media (min-width: 768px) {
    #get-involved-starpath .disable-animations-container,
    .disable-animations-container a{
        font-size: 0.8em;
    }
}


/* =========================================================
   ACCORDION
   ========================================================= */

.wp-block-accordion-heading__toggle-title:hover,
.is-open .wp-block-accordion-heading__toggle-title {
    color: var(--wp--preset--color--carnelian);
}

.wp-block-accordion-panel {
    padding: var(--wp--preset--spacing--40);
}


/* =========================================================
   BUTTONS
   ========================================================= */

.wp-block-button__link:hover,
.wp-block-button__link:focus {
    color: #ffffff;
    text-decoration: underline;
}

.wp-block-button__link,
.wp-element-button {
    border-radius: 0 !important;
}


/* =========================================================
   SIDEBAR
   ========================================================= */

.col-item {
    clear: both;
}

.content-block:empty + .content-block {
    padding-top: 0;
    border-top: none;
}

#sidebar-top::after,
#sidebar-bottom::after,
.single-person #sidebar-top,
.single-person #sidebar-bottom,
.widget_cornell_pattern_widget:empty {
    display: none;
}

#sidebar-bottom > div:last-of-type {
    margin-bottom: 0;
}


/* =========================================================
   CONTENT WRAPPER
   ========================================================= */

@media (min-width: 768px) {
    main,
    #main {
        padding-top: 2em;
    }

    .small-paragraph {
        max-width: 960px;
        text-wrap: balance;
    }
}

.wp-block-post-featured-image img {
    border-radius: 0 !important;
}

figure.is-resized{
    background-color: transparent;;
}

/* =========================================================
   CALLOUT / NOTICE
   ========================================================= */

.cornell-callout h2.wp-block-heading,
.cornell-callout h3.wp-block-heading {
    color: var(--wp--preset--color--link-blue);
}

@media (min-width: 768px) {
    .cornell-callout {
        margin-top: 2em;
        padding-top: 3em;
        padding-bottom: 3em;
    }
}

.cornell-callout {
    max-width: 960px;
    margin: 3em auto 0;
    border-top: 4px solid var(--wp--preset--color--link-blue);
    border-bottom: 4px solid var(--wp--preset--color--link-blue);
    border-left-width: 0;
    border-right-width: 0;
}


/* =========================================================
   WARNING CALLOUT VARIANT
   ========================================================= */

.cornell-callout.callout-warning {
    background: #fff8ef;
    border-top-color: var(--wp--preset--color--orange-dark);
    border-bottom-color: var(--wp--preset--color--orange-dark);
}

/* =========================================================
   QUERY PAGINATION
   ========================================================= */

.wp-block-query-pagination {
    margin-top: 2em;
    font-size: 1.5em;
}

.wp-block-query-pagination-numbers {
    display: flex;
    gap: 0.5em;
}

/* =========================================================
   FILTERS — DESKTOP ( ≥768px )
   ========================================================= */

@media (min-width: 768px) {

    .filter-container {
        gap: var(--wp--preset--spacing--40);
    }

    .wp-block-query-filter {
        min-width: 200px;
    }
}


/* =========================================================
   FILTERS — GENERAL
   ========================================================= */

.wp-block-query-filter {
    max-width: 100%;
}

.filter-container {
    margin-bottom: var(--wp--preset--spacing--50);
}

.wp-block-query-filter__label {
    margin-bottom: var(--wp--preset--spacing--20);
    font-size: 0.9em;
    font-weight: 600;
    text-transform: uppercase;
}

.term-slug-selected-projects,
.news-feed-loop .wp-block-post:not(.type-post) .feed-article-data,
select.wp-block-query-filter-post-type__select option[value="/projects/?query-24-project_cohort=ai-lab-team"],
select.wp-block-query-filter-post-type__select option[value="/projects/?query-24-project_cohort=selected-projects"],
select.wp-block-query-filter-post-type__select option[value="/projects/?query-24-project_cohort=tech-leads"] {
    display: none;
}

/* =========================================================
   ARCHIVE CARD — POSITIONING + IMAGE
   ========================================================= */

.wp-block-post.type-event,
.wp-block-post.type-project,
.wp-block-post.type-tool {
    position: relative;
}

.wp-block-post.type-event .wp-block-post-featured-image,
.wp-block-post.type-project .wp-block-post-featured-image,
.wp-block-post.type-tool .wp-block-post-featured-image {
    margin-top: 0;
    height: 250px;
}

.wp-block-post.type-newsletter .wp-block-post-featured-image img,
.wp-block-post.type-event .wp-block-post-featured-image img,
.wp-block-post.type-project .wp-block-post-featured-image img,
.wp-block-post.type-tool .wp-block-post-featured-image img {
    height: 100%;
    object-fit: cover;
}


/* =========================================================
   ARCHIVE CARD — TITLE / EXCERPT SPACING
   ========================================================= */

.filter-loop .wp-block-post:has(.wp-block-post-excerpt) .wp-block-post-title {
    margin-bottom: 0.3em;
}


/* =========================================================
   ARCHIVE CARD — TAXONOMY BADGE
   ========================================================= */

.taxonomy-event_type,
.taxonomy-tool_type,
.taxonomy-project_cohort {
    position: absolute;
    right: 0;
    z-index: 2;
    width: fit-content;
    padding: 10px 20px;
    background: var(--wp--preset--color--carnelian);
    line-height: 1;

    color: #ffffff;
}

.taxonomy-event_type a,
.taxonomy-tool_type a,
.taxonomy-project_cohort a {
    color: #ffffff;
}

.wp-block-accordion-heading__toggle-title span{
    text-decoration: none !important;
}


/* =========================================================
   FEATURED IMAGE — EDITOR-LIKE PLACEHOLDER
   ========================================================= */

.wp-block-post-featured-image.is-placeholder .components-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    background: #f6f7f7;
    border: 1px dashed #dcdcde;
    border-radius: 4px;
    color: #757575;
}

.wp-block-post-featured-image.is-placeholder svg {
    width: 60px;
    height: 60px;
    stroke: #ccc;
}

/* =========================================================
   NEWSLETTER ARCHIVE — CARD STYLING
   ========================================================= */

.wp-block-post.type-newsletter .wp-block-post-featured-image {
    margin-top: 0;
    height: 350px;
}

.wp-block-post.type-newsletter .wp-block-post-title {
    margin-bottom: 0;
}

.wp-block-post.type-newsletter .wp-block-post-date {
    margin-bottom: 0.45em;
}

/* =========================================================
   EVENT TYPE BADGES
   ========================================================= */

.event_type-in-person .taxonomy-event_type {
    background-color: var(--wp--preset--color--navy);
}

.event_type-hybrid .taxonomy-event_type {
    background-color: var(--wp--preset--color--orange-dark);
}

/* =========================================================
   SINGLE EVENT — HIDE RELATED PROJECTS HEADING IF EMPTY
   ========================================================= */

body.single-event:has(.event-related-projects-query:empty) .event-related-projects-heading {
    display: none;
}

/* =========================================================
   GET INVOLVED — WRAPPER BACKGROUND OVERRIDE
   ========================================================= */

div[role="complementary"]:has(.ai-lab-get-involved-cta) {
    padding: 0;
    background-color: var(--wp--preset--color--carnelian);
}

/* =========================================================
   ARTICLE CARD — FEATURED IMAGE
   ========================================================= */

.article-card .wp-block-post-featured-image img {
    height: 275px;
}


/* =========================================================
   BLOG INTRO
   ========================================================= */

@media (max-width: 768px) {
    .blog-intro-container h2 {
        margin-top: 0.5em;
        margin-bottom: 0.25em;
        font-size: 1.4em;
    }
}

@media (min-width: 920px) {
    .page-blog-articles .blog-intro-container {
        margin-bottom: 3em;
        display: grid;
        grid-template-columns: 2fr 1fr;
    }
}

.single .metadata-set{
    display: none;
}

.single .person-card__title{
    font-size: 1em;
}

.single article > *{
    max-width: 100%;
}

.single #main-article h1{
    margin-bottom: 0.4em!important;
}

/* =========================================================
   BLOG 
   ========================================================= */

h2.wp-block-post-title.has-large-font-size{
    --wp--preset--font-size--large: 28px;
}

h2.wp-block-post-title.has-large-font-size + .wp-block-group{
    margin-bottom: 0.8em;
}

.cwd-component .summary{
    font-size: 18px;
    line-height: 1.45;
}

.cwd-component .summary p + p{
    margin-top: 1em;
}

.cwd-component .summary li{
    margin-bottom: 0;
}

.cwd-component .summary h2{
    margin-bottom: 0.3em;
    margin-top: 1em;
}

.cwd-component .summary hr{
    margin: 2em auto;
}   

.cwd-component .wp-block-code{
    background: rgba(0, 0, 0, 0.07);
}

.cwd-component .wp-block-code code{
    background: transparent;
}

ul.wp-block-post-template li:has(.hide-the-card){
    display: none!important;
}

.read-more-blog-articles h3{
    text-wrap: balance;
}

.read-more-blog-articles li{
    margin-bottom: 2em;
}

@media (max-width: 768px) {
    .read-more-blog-articles li svg{
        display: none;
    }
}

@media (min-width: 768px) {
    .read-more-blog-articles li svg{
        min-width: 65px;
        width: 65px;
        aspect-ratio: 1/1;
    }
}

/* =========================================================
   STICKY POSTS — CARD HIGHLIGHT
   ========================================================= */

.highlight-sticky-posts li.wp-block-post.sticky {
    padding: var(--sticky-padding);
    box-shadow: 0 0 100px -42px gray;
}


/* =========================================================
   STICKY POSTS — FEATURED IMAGE OFFSET
   ========================================================= */

.highlight-sticky-posts li.wp-block-post.sticky .wp-block-post-featured-image {
    margin: var(--sticky-margin) var(--sticky-margin) 1em var(--sticky-margin);
}

/* =========================================================
   PEOPLE LIST — PAGE TITLE
   ========================================================= */

.people-list h1 {
    margin-bottom: 0.5em !important;
}


/* =========================================================
   LAB TEAM GRID — HEADINGS
   ========================================================= */

.lab-team-grid h2,
.lab-team-grid h4 {
    margin-bottom: 0.25em;
}


/* =========================================================
   LAB TEAM GRID — LINK BUTTONS
   ========================================================= */

.lab-team-grid .person-card__links {
    display: flex;
    gap: 0.4em;
}

.lab-team-grid .wp-block-button__link {
    padding: calc(0.367em + 2px) calc(0.733em + 2px) !important;
    line-height: 1.2;
}


/* =========================================================
   STUDENT LAB SECTION — WRAPPER
   ========================================================= */

.student-lab-wrapper {
    display: flex;
    flex-direction: column;
    gap: 3em;
    margin-top: 8em !important;
}

.student-lab-wrapper > div {
    width: 100%;
}


/* =========================================================
   STUDENT LAB SECTION — HEADINGS
   ========================================================= */

h2.lab-team-category,
.student-lab-wrapper h2 {
    margin-bottom: 0.5em;
    padding: 0 0 0.5em;
    font-size: 42px;
    border-bottom: 1px solid #ebebeb;
}


/* =========================================================
   STUDENT LAB SECTION — LIST ROW
   ========================================================= */

.student-lab-wrapper ul {
    display: grid;
    gap: 0.4em 4em;
    grid-template-columns: repeat(5, 1fr);
}

@media (max-width: 768px) {
    .student-lab-wrapper ul {
        grid-template-columns: 1fr 1fr;
    }
}

@media (min-width: 768px) and (max-width: 1200px) {
    .student-lab-wrapper ul {
        grid-template-columns: repeat(4, 1fr);
    }
}


/* =========================================================
   COHORT PERSON LIST — RESET + TYPOGRAPHY
   ========================================================= */

.cohort-block__title {
    margin: 0 0 1rem 0;
    font-size: 1.25rem;
    font-weight: 400;
}

.cohort-block__title strong{
    font-weight: 600;
}

.cohort-block__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.cohort-block__item {
    margin: 0 0 0.35rem 0;
    padding: 0;
}

.cohort-block__name {
    margin: 0;
    padding: 0;
    font-size: 1.25rem;
    line-height: 1.3;
}

.cohort-block__name a {
    text-decoration: none;
}

.cohort-block__name a:hover,
.cohort-block__name a:focus {
    text-decoration: underline;
}

/* =========================================================
   GET INVOLVED — POSITIONING
   ========================================================= */

.ai-lab-get-involved-cta,
.ai-lab-get-involved-cta > div {
    position: relative;
}

.ai-lab-get-involved-cta {
    align-content: center;
}

.ai-lab-get-involved-cta > div:not(#get-involved-starpath) {
    z-index: 2;
}


/* =========================================================
   GET INVOLVED — TYPOGRAPHY + SPACING
   ========================================================= */

.ai-lab-get-involved-cta .wp-block-columns {
    margin-bottom: 0;
}

.ai-lab-get-involved-cta .titles {
    margin-bottom: var(--wp--preset--spacing--60);
}

.ai-lab-get-involved-cta p {
    margin-bottom: 1.4em !important;
    line-height: 1.25;
}


/* =========================================================
   GET INVOLVED — DESKTOP SIZING ( ≥768px )
   ========================================================= */

@media (min-width: 768px) {
    .ai-lab-get-involved-cta {
        min-height: min(800px, 60vh);
    }
}

/* =========================================================
   FOOTER — LOGO SVG
   ========================================================= */

footer svg {
    height: auto;
    max-width: min(250px, calc(100% - 20px));
    margin-bottom: 20px;
}


/* =========================================================
   FOOTER — THREE COLUMN LAYOUT
   ========================================================= */

footer .three-col > div {
    width: 100%;
    padding: 0 !important;
}


/* =========================================================
   FOOTER CONTENT COLUMNS
   ========================================================= */

@media (min-width: 769px) and (max-width: 1024px) {
    footer .footer-content-columns {
        flex-direction: column;                       
    }
}

footer .footer-content-columns svg {
    display: inline-block;
    width: 20px;
    height: 20px;
    min-width: 20px;
    margin-right: 3px;
}


/* =========================================================
   FOOTER — DESKTOP LAYOUT ( ≥992px )
   ========================================================= */

@media (min-width: 992px) {
    body > footer .primary,
    #body-footer .primary {
        width: 75% !important;
    }

    body > footer .secondary,
    #body-footer .secondary {
        width: 25% !important;
    }

    body > footer .main-footer .container-fluid:after,
    #body-footer .main-footer .container-fluid:after {
        left: calc(25% + 15px);
    }
}

/* =========================================================
   A11Y FIXES
   ========================================================= */
fieldset.search-filters,
#cu-search-button.mobile-button{
    color: #fff!important;
}

#skipnav a{
    color: black!important;
}