/**
 * @file
 * Styles for Views
*/
/**********************************************\
1.  GLOBALS
\**********************************************/
.views-element-container:not(.alignwide):not(.alignfull){
    max-width: 80%;
    margin-left: auto;
    margin-right: auto;
}
.views-element-container{
    margin-bottom: var(--spacing-40);
}
/*=== VIEW LINK ===*/
.view-content .views-row article:not(.shared-vision-teaser){
    cursor: pointer;
    position: relative;
    max-width: 100%;
}
.view-content .views-row article:not(.shared-vision-teaser) a:after{
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
}
/* Link style handling */
.view-content a{
    color: inherit;
    text-decoration: none; 
}
.view-content a:focus{
    outline: var(--focus-outline);
    outline-offset: var(--focus-outline-offset);
}
/* Expand links over the entire card */
.views-view-responsive-grid__item{
	position: relative;
}
.views-view-responsive-grid__item a:after{
	content: '';
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
}
/**********************************************\
1.  GRIDS
\**********************************************/
/*=== FLUID GRID ===*/
.view-content{
    display: flex;
    align-items: normal;
    gap: var(--spacing-30);
    flex-wrap: wrap;
}
.view-content .fluid-grid-view{
    flex: 1 1 0px;
    -webkit-box-flex: 1;
}
@media screen and (min-width:1250px){
    .view-content .fluid-grid-view{
        min-width: calc(25% - var(--spacing-30));
    }
}
@media screen and (max-width:1250px) and (min-width:1000px){
    .view-content .fluid-grid-view{
        min-width: calc(33.33% - var(--spacing-30));
    } 
}
@media screen and (max-width:1000px) and (min-width:700px){
    .view-content .fluid-grid-view{
        min-width: calc(50% - var(--spacing-30));
    } 
}
@media screen and (max-width:700px){
    .view-content .fluid-grid-view{
        min-width: 100%;
    }
} 
/* Handling Groups with backgrounds in the node teasers */
.view-content .fluid-grid-view.row-has-background-color article,
.view-content .fluid-grid-view.row-has-background-color article .node__content{
    height: 100%;
}
.view-content .fluid-grid-view .node__content  > .wp-block-group.has-background{
    margin-top: 0;
    margin-bottom: 0;
    padding: var(--spacing-20);
    height: 100%;
}
.view-content .fluid-grid-view .node__content  > .wp-block-group.has-background .wp-block-group__inner-container{
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
}
/*=== WEIGHTED GRID & FLEX GRID FOR TAXONOMIES ===*/
.weighted-grid .view-content, .path-taxonomy .flex-grid .view-content, .shared-vision-grid .view-content{
    flex-direction: row;
    flex-wrap: wrap;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
    gap: var(--spacing-20);
}
.weighted-grid .view-content .views-row.full-width-teaser{
    width: 100%;
}
.path-taxonomy .flex-grid:not(.taxonomy-term-archive) .view-content .views-row:first-child{
    width: 100%;
}
@media screen and (min-width: 1350px){
    .shared-vision-grid .view-content .views-row{
        width: calc(25% - var(--spacing-20)); 
    }
}
@media screen and (max-width: 1350px) and (min-width: 1000px){
    .shared-vision-grid .view-content .views-row{
        width: calc(33.33333% - var(--spacing-20)); 
    }
}
@media screen and (min-width:1000px){
    .weighted-grid .view-content .views-row.two-thirds-teaser{
        width: calc(66.66667% - var(--spacing-20));
    }
    .weighted-grid .view-content .views-row:not(.full-width-teaser):not(.two-thirds-teaser), 
    .path-taxonomy .flex-grid:not(.taxonomy-term-archive) .view-content .views-row:not(:first-child), .flex-grid.taxonomy-term-archive .view-content .views-row{
        width: calc(33.33333% - var(--spacing-20)); 
    }
}
@media screen and (max-width:1000px) and (min-width:850px){
    .weighted-grid .view-content .views-row:not(.full-width-teaser), .path-taxonomy .flex-grid:not(.taxonomy-term-archive) .view-content .views-row:not(:first-child), .flex-grid.taxonomy-term-archive .view-content .views-row, .shared-vision-grid .view-content .views-row{
        width: calc(50% - var(--spacing-20));
    }  
}
@media screen and (max-width:850px){
    .weighted-grid .view-content .views-row, .path-taxonomy .flex-grid .view-content .views-row, .shared-vision-grid .view-content .views-row{
        width: 100%;
    }  
}
/*=== DRUPAL RESPONSIVE GRID ===*/
main .views-view-responsive-grid--horizontal{
    --views-responsive-grid--total-gap-width: var(--spacing-20);
    gap: var(--spacing-20);
}
@media screen and (max-width: 1000px) and (min-width:850px){
    main .views-view-responsive-grid--horizontal{
        --views-responsive-grid--column-count: 2 !important;
    }
}
@media screen and (max-width:850px){
    main .views-view-responsive-grid--horizontal{
        --views-responsive-grid--column-count: 1 !important;
    } 
}
/*=== HORIZONTAL SCROLL ===*/
.views-element-container.alignfull #draghorizontal{
    padding-left: 4vw; /*1.5vw*/
    padding-right: 4vw; /*1.5vw*/
}
#draghorizontal{ /*.horizontal-scroll-view .view-content*/
	display: flex;
    flex-wrap: nowrap;
	position: sticky;
	top: 9rem; /* 3rem */
	overflow-x: scroll;
	-webkit-overflow-scrolling: touch;
}
#draghorizontal::-webkit-scrollbar{
	display: none;
}
#draghorizontal > .views-row{
    scroll-snap-align: start;
	overflow-y: hidden;
    min-width: 33vw;
    width: 33vw;
}
@media screen and (max-width: 800px){
    #draghorizontal > .views-row{
        min-width: 85%;
        width: 85%;
    }
}
@media screen and (max-width: 700px){
    #draghorizontal > .views-row{
        min-width: 85%;
        width: 85%;
    }
}
/**********************************************\
1.  VIEW-ROW CONTENT
\**********************************************/
/*=== FEAT IMAGE ===*/
.views-element-container .field--name-field-media-image > .field__item,
.views-element-container .exhibition-hero .feat-image,
.view-content .exhibition-hero .feat-image,
.view-content .feat-image .field__item{
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
}
.views-element-container .field--name-field-media-image img,
.view-content .feat-image img{
    max-width: 100%;
    width: 100%;
    object-fit: cover;
}
.views-element-container .field--name-field-media-image img,
.views-view-responsive-grid__item .feat-image img /*,
.view-content .feat-image .field__item */ {
    max-height: 350px;
    height: 350px;
}
.view-content .feat-image .field__item{
    margin-bottom: 0.5rem;
}
.views-element-container .exhibition-hero .feat-image img,
.views-row .exhibition-hero .feat-image img{
    max-height: var(--teaser-img-height);
    height: var(--teaser-img-height);
}
/* Placeholder Image */
.views-element-container .exhibition-hero .placeholder-feat-image,
.views-row .exhibition-hero .placeholder-feat-image{
    display: flex;
    align-items: center;
    justify-content: center;
    max-height: var(--teaser-img-height);
    height: var(--teaser-img-height);
    background: var(--sage);
}
.views-element-container .shared-vision-grid .exhibition-hero .placeholder-feat-image, .shared-vision-grid .views-content .exhibition-hero .placeholder-feat-image{
    display: flex;
    align-items: center;
    justify-content: center;
    max-height: 300px;
    height: 300px;
    background: var(--sage);
}
.views-element-container .exhibition-hero .placeholder-feat-image .fa-image,
.views-row .exhibition-hero .placeholder-feat-image .fa-image,
.views-row .exhibition-hero .placeholder-feat-image .fa-image-slash{
    font-size: var(--main-title-font-size);
    color: var(--white);
}
/* Hover and focus states */
.view-content .views-row .field--name-field-media-image img,
.views-element-container .exhibition-hero .feat-image img,
.view-content .feat-image img,
.views-element-container .exhibition-hero .placeholder-feat-image .fa-image,
.views-row .exhibition-hero .placeholder-feat-image .fa-image,
.views-row .exhibition-hero .placeholder-feat-image .fa-image-slash{
    transition: var(--six-sec-trans);
}
.view-content .views-row:hover .field--name-field-media-image img, .view-content .views-row:focus .field--name-field-media-image img,
.views-element-container .views-row:hover .exhibition-hero .feat-image img, .views-element-container .views-row:focus .exhibition-hero .feat-image img,
.views-row:hover .exhibition-hero .feat-image img, .views-row:focus .exhibition-hero .feat-image img, 
.views-view-responsive-grid__item:hover .feat-image img, .views-view-responsive-grid__item:focus .feat-image img, 
.views-element-container .views-row:hover .exhibition-hero .placeholder-feat-image .fa-image, .views-element-container .views-row:focus .exhibition-hero .placeholder-feat-image .fa-image,
.views-row:hover .exhibition-hero .placeholder-feat-image .fa-image, .views-row:focus .exhibition-hero .placeholder-feat-image .fa-image,
.views-row:hover .exhibition-hero .placeholder-feat-image .fa-image-slash, .views-row:focus .exhibition-hero .placeholder-feat-image .fa-image-slash{
    transform: scale(1.2);
}
/*=== TEASER TAGS ===*/
/* Programs/Classes/Workshops/Events */
.teaser-tag{
    position: absolute;
    z-index: 2;
    top: 0;
    right: 0;
    padding: 0 0.5rem 0.2rem 1rem;
    /* padding: 0.2rem 1rem 0 0.5rem; */
}
/* Text tag */
span.text-tag{
    margin-top: 0.5rem;
}
/* Pill tag on RSS and Teasers at bottom */
.teaser-pill-tag{
    padding: 0.2rem 0.5rem;
    background: var(--ore);
    color: var(--white);
    border-radius: 4px;
}
/*=== Remove body html markup in summary excerpts ===*/
.past-exhibition-view .node__content .exhibition-detail-wrap > p,
.press-archive .node__content .exhibition-detail-wrap > p{
    font-weight: var(--light-weight);
    font-size: var(--small-font-size);
}
/*=== Press Archive ===*/
.press-archive .exhibition-hero.is-layout-flex figure.feat-image img{
    max-width: 100%;
    width: 100%;
    min-width: auto;
}
.views-element-container .press-archive .exhibition-hero .feat-image img{
    /* max-height: 200px; */
    height: auto;
}
.views-element-container .press-archive .placeholder-feat-image{
    max-height: 70vh;
    height: 100%;
}
@media screen and (min-width:800px){
    .press-archive .exhibition-hero.is-layout-flex figure.feat-image {
        max-width: 25%;
    }
    .views-element-container .press-archive .placeholder-feat-image{
        max-width: 25%;
        min-height: 350px;
    }
}
@media screen and (max-width:800px){
    .views-element-container .press-archive .placeholder-feat-image{
        min-height: 150px;
        width: 100%;
    }
}
/*=== Past Exhibitions ===*/
.past-exhibition-view .view-content{
    flex-direction: column;
}
.past-exhibition-view:not(.related-exhibition) .exhibition-hero figure.feat-image,
.views-element-container .past-exhibition-view .exhibition-hero .placeholder-feat-image{
    max-height: 200px;
    width: 35rem;
}
.past-exhibition-view .exhibition-hero.is-layout-flex figure.feat-image img{
    max-width: 35rem;
}
.views-element-container .past-exhibition-view:not(.related-exhibition) .exhibition-hero .feat-image img{
    max-height: 200px;
    height: 200px;
}
.past-exhibition-view .exhibition-hero.is-layout-flex figure.feat-image img{
    width: 100%;
}
/* Related Exhibitions Image sizing */
.related-exhibition .exhibition-hero figure.feat-image{
    width: 35rem;
}
.related-exhibition .exhibition-hero figure.feat-image,
.related-exhibition .exhibition-hero .feat-image img{
    max-height: 350px;
}
/*=== Online Exhibitions ===*/
.grid-exhibition-view.view-online-exhibitions .view-content{

}
@media screen and (min-width:950px){
    .grid-exhibition-view.view-online-exhibitions .view-content{
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
.grid-exhibition-view.view-online-exhibitions .view-content .views-row .exhibition-hero{
    flex-direction: column;
    gap: 0.5rem;
}
/*=== Fluid Grid using Fields ===*/
.collection-archive .fluid-grid-view, .related-items-view-grid .fluid-grid-view{
    display: flex;
    flex-wrap: wrap;
}
.collection-archive .fluid-grid-view{
    justify-content: space-between;
}
.related-items-view-grid .fluid-grid-view{
    justify-content: flex-start;
}
.collection-archive .views-field-field-featured-image, .related-items-view-grid .views-field-field-featured-image{
    min-width: 100%;
}
.collection-archive .views-field-type{
    margin-right: var(--spacing-10);
}
.related-items-view-grid .views-field-field-subtitle{
    margin-left: var(--spacing-10);
}
.collection-archive h3, .related-items-view-grid h3{
    margin-bottom: 0;
    line-height: var(--reg-line-height);
}
/*=== COLLECTION ARCHIVE ===*/
/* Version using weighted-grid */
.collection-teaser .wp-block-group.collection-titles{
    margin-top: 0.5rem;
    margin-bottom: var(--spacing-10);
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}
/*=== Feat Img Field ===*/
.views-row .field--name-field-media-image{
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
    height: 350px;
}
/*=== Education Resource Hover State ===*/
.exhibition-teaser .node__content > .wp-block-group.has-smoke-background-color{
    transition: var(--three-sec-trans);
}
.exhibition-teaser:hover .node__content > .wp-block-group.has-smoke-background-color,
.exhibition-teaser:focus .node__content > .wp-block-group.has-smoke-background-color{
    outline: 4px solid var(--ore);
} 
/*=== Shop Archive ===*/
@media screen and (min-width: 900px){
    .archive-shop.weighted-grid .full-width-teaser .exhibition-hero{
        flex-direction: row;
        gap: var(--spacing-20);
        padding: var(--spacing-20) 0;
        border-top: 2px solid var(--pigeon);
        border-bottom: 2px solid var(--pigeon);
    }
}
.archive-shop .exhibition-teaser .exhibition-detail-wrap .cost{
    margin-top: var(--spacing-10);
    margin-bottom: var(--spacing-10);
}
.archive-shop .exhibition-teaser .cost.wp-block-group .field--name-field-cost{
    font-size: var(--med-font-size);
}
/*=== timed-rss class (used for Events and Classes & Workshops RSS displays ===*/
.timed-rss{
    height: 100%;
    margin-bottom: var(--spacing-20);
}
.timed-rss .node__content{
    padding: var(--spacing-10) var(--spacing-20);
    background-color: var(--pigeon);
    height: calc(100% - var(--spacing-20));
}
.timed-rss .node__content, .view-latest-news-highlight .views-row{
    transition: var(--three-sec-trans);
}
.timed-rss:hover .node__content, .timed-rss:focus .node__content,
.view-latest-news-highlight .views-row:hover, .view-latest-news-highlight .views-row:focus{
    outline: 4px solid var(--ore);
}
.view-latest-news-highlight .views-row:hover, .view-latest-news-highlight .views-row:focus{
    outline-offset: var(--focus-outline-offset);
}
.timed-rss .wp-block-group.exhibition-hero{
    margin-top: 0;
    margin-bottom: 0;
}
.timed-rss .exhibition-detail-wrap{
    gap: 0.5rem;
}
.timed-rss .exhibition-detail-wrap h3{
    margin-bottom: 0;   
}
/*=== Shared Visions Teaser ===*/
.shared-vision-grid .sv-date-span{
    box-sizing: border-box;
    padding: 0.3rem var(--spacing-10);
    margin-bottom: 0.5rem;
}
.shared-vision-grid .sv-date-span .date-wrapper{
    justify-content: center;
    font-weight: var(--med-weight);   
}
.shared-vision-grid .sv-location{
    margin: var(--spacing-10) 0;
}
.views-element-container .shared-vision-grid .exhibition-hero .feat-image img,
.shared-vision-grid .views-row .exhibition-hero .feat-image img{
    object-fit: contain;
    object-position: left;
    height: 300px;
    max-height: 300px;
}
/*=== Taxonomy Default View ===*/
.taxonomy-term-archive article .node__content > .wp-block-group.has-background{
    margin-top: 0;
    margin-bottom: 0;
}
.taxonomy-term-archive article, .taxonomy-term-archive .node__content, .taxonomy-term-archive .node__content > .wp-block-group.has-background{
    height: 100%;
}
.view-content .views-row article .node__content > .wp-block-group.has-background{
    padding: var(--spacing-20);
}
.view-content .views-row article .node__content > .wp-block-group.has-background > *:not(.alignfull):not(.alignwide){
    max-width: 100%;
}
/*=== SEARCH PAGE ===*/
body.path-search form.search-form{
    background-color: var(--smoke);
    margin-bottom: var(--spacing-20);
    padding: var(--spacing-10) 0 0.5rem;
}   
body.path-search form.search-form > *,
body.path-search h2{
    max-width: 92vw;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}
body.path-search .search-help-link{
    display: none;
}
/* Search list */
.search-results.alignwide{
    padding-inline-start: 0;
}
/* Search Results */
.search-results li{
    cursor: pointer;
    position: relative;
    padding: var(--spacing-20) 0 var(--spacing-10);
    transition: var(--three-sec-trans);
}
.search-results li:not(:last-child){
    border-bottom: 2px solid var(--pigeon);
}
.search-results li h3{
    transition: var(--three-sec-trans);
    text-underline-offset: var(--underline-offset);
    text-decoration-thickness: var(--underline-thickness);
}
.search-results li:hover h3, .search-results li:focus h3{
    color: var(--red);
    text-decoration: underline;
    text-decoration-style: dotted;
}
.search-results h3.search-result__title a{
    text-decoration: none;
}
.search-results h3.search-result__title a:before{
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
}
.search-results .search-result__snippet strong{
    background-color: yellow;
}