/*--------------------------------------------------------------
## Layout
--------------------------------------------------------------*/

.site-main {
    padding-top: calc(var(--regular-padding) * 1.5);
    position: relative;
}

.page-title {
    margin-bottom: 0;
}

.course-preview:not(:last-child) {
    margin-bottom: 2em;
}

.archive-description img {
    display: block;
    margin-bottom: 1.5em;
}

@media (max-width: 767px) {
    .site-main {
        position: relative;
    }
    .page-title {
        padding-left: 1.5em;
    }
    .archive-description img {
        position: absolute;
        left: 1rem;
        top: 1.5rem;
        height: 2.4em;
        width: 2.4em;
    }
}

@media (min-width: 768px) {
    .archive-description {
        font-size: 0.9em;
    }
    .archive-content {
        gap: 2em;
        display: grid;
        grid-template-columns: 26fr 74fr;
        grid-template-rows: auto 1fr;
    }
    .has-description .search-filters {
        grid-column: 1 / 2;
        grid-row: 2 / 3;
    }
    .has-description .search-results {
        grid-column: 2 / 3;
        grid-row: 1 / 3;
    }
    .has-sessions-table {
        gap: 2em;
        display: grid;
        grid-template-columns: 26fr 74fr;
        grid-template-rows: auto auto 1fr;
    }
    .has-sessions-table .page-title {
        grid-column: 1 / 3;
        grid-row: 1 / 2;
        padding-left: 0;
        padding-right: 0;
    }
    .has-sessions-table .archive-description {
        font-size: 0.9em;
        grid-column: 1 / 2;
        grid-row: 2 / 3;
    }
    .has-sessions-table .course-table {
        font-size: 0.9em;
        grid-column: 2 / 3;
        grid-row: 2 / 3;
        padding-top: 0.8em;
    }
    .has-sessions-table .archive-content > .social-share,
    .has-sessions-table.site-main > .social-share {
        font-size: 0.9em;
        position: absolute;
        top: 1.5rem;
        right: var(--regular-padding);
        margin-top: 0;
        width: auto;
    }
    .has-sessions-table .archive-content {
        grid-column: 1 / 3;
        grid-row: 3 / 4;
        padding-top: 0;
    }
}

@media (min-width: 1280px) {
    .has-sessions-table {
        column-gap: 2.5em;
    }
}

/** Read more link **/

@media (max-width: 767px) {
    .archive-description.open #read-more,
    .archive-description:not(.open)>p:not(:first-of-type),
    .archive-description:not(.open) #show-less {
        display: none;
    }
}

@media (min-width: 768px) {
    .archive-description #read-more,
    .archive-description #show-less {
        display: none;
    }
}

/*--------------------------------------------------------------
# Taxonomy specific CSS
--------------------------------------------------------------*/

.tax-ta_courses_category .archive-description img {
    height: 120px;
    width: auto;
}

@media (max-width: 767px) {
  .tax-ta_courses_category .archive-description img {
    height: 2.5em;
  }
}

.tax-ta_courses_audience .archive-description img,
.tax-ta_courses_topic .archive-description img {
	margin: 0 auto 1.5em;
	max-width: 19em;
}

/*--------------------------------------------------------------
# Search and Filter
--------------------------------------------------------------*/

.search-filters h2 {
    margin-bottom: 0.25em;
}

.search-filter-field:not(:first-of-type) {
    border-top: 1px solid var(--wp--preset--color--light);
    margin-top: 0.5em;
    padding-top: 0.5em;
}

.search-filter-label {
    font-size: 1em;
    font-weight: 600;
    line-height: 1.2;
}

.search-filter-label[aria-expanded="false"] {
    margin-bottom: 0;
}

.search-filter-description {
    font-size: 0.9em;
    font-weight: 400;
}

.search-filter-label[aria-expanded="false"] + .search-filter-description {
    display: none;
}

.search-filter-input-group {
    --search-filter-scale-base: 14;
}

.search-filter-input-checkbox {
	display: block;
	position: relative;
	padding-bottom: calc(var(--search-filter-scale-base-unit-calc)*.15);
	padding-top: calc(var(--search-filter-scale-base-unit-calc)*.15);
}

.search-filter-input-checkbox__label {
    padding-left: 0.25em;
}

.locations-filter .search-filter-input-group:not(.search-filter-field__input--hidden) {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 0.5em;
}

.format-filter .search-filter-input-checkbox[data-option-value="2"],
.format-filter .search-filter-input-checkbox[data-option-value="3"],
.format-filter .search-filter-input-checkbox[data-option-value="4"] {
    display: none;
}

.format-filter .search-filter-input-checkbox[data-option-value="5"] .search-filter-input-checkbox__label::before {
    content: "3-Day-Course or ";
}

.filters-group-heading {
    color: var(--wp--preset--color--accent);
    font-size: 0.9em;
    font-weight: 600;
    margin-bottom: 8px;
    margin-top: 1em;
    text-transform: uppercase;
}

.filter-group-last {
    border-bottom: 1px solid var(--wp--preset--color--light);
    margin-bottom: 0.75em;
    padding-bottom: 0.5em;
}

@media (max-width: 767px) {
    .search-filters {
        display: none;
    }
    .search-filters.visible {
        background-color: #fff;
        display: grid;
        grid-template-columns: 1fr;
        height: 100vh;
        max-height: 100vh;
        overflow-x: hidden;
        overflow-y: auto;
        padding: 1em;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        top: 0;
        width: 100vw;
        z-index: 99999;
    }
    .site-main:has(.search-filters.visible) .search-form {
        margin-bottom: 0;
    }
    .searchandfilter {
        height: 100%;
        overflow-y: auto;
    }
    .search-filters h2 {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .show-results {
        background-color: #fff;
        border-top: 1px solid #aaa;
        height: 4.7em;
        padding: 1em;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
    }
    .show-results button {
        width: 100%;
    }
}

@media (min-width: 768px) {
    .search-filter-input-checkbox__label {
        font-size: 0.9em;
    }
}

@media (min-width: 1280px) {
    .archive-content {
        column-gap: 2.5em;
    }
}

/** Toggle Filters **/

.show-fewer-filters,
.show-more-filters,
.toggle-filters {
    color: var(--wp--preset--color--link-hover);
    text-decoration: underline;
}

.show-fewer-filters:hover,
.show-more-filters:hover,
.toggle-filters span:hover {
    cursor: pointer;
}

@media (max-width: 767px) {
    .toggle-filters {
        background-color: #fff;
        border-bottom: 1px solid #aaa;
        display: flex;
        align-items: center;
        column-gap: 0.5em;
        margin-left: calc(var(--regular-padding) * -1);
        margin-bottom: 0;
        padding: 0.5em var(--regular-padding);
        position: sticky;
        top: 86px;
        width: calc(100% + (2 * var(--regular-padding)));
        z-index: 10;
    }
    .close-filters {
        display: block;
    }
}

@media (min-width: 768px) {
    .toggle-filters,
    .close-filters {
        display: none;
    }
}
