/* ============================================================================
   PAGE FAMILY: catalog categories + group-by pages (B9) — STRUCTURE tier — from the 3 global files, original order
   Migrated 2026-07-05. Scope: every rule scoped to a *-categories-page or
   *-groupby-page class (the 4 categories + 4 group-by templates).
   PHASE-A FIDELITY: verbatim relocation (incl. legacy !important); tokenization
   is a recorded follow-up. Do not edit without re-running the harness diff.
   ============================================================================ */
.search_sec.catalog-groupby-page #groupby-selector {
	display: inline-block;
	width: auto;
	margin-left: 5px;
}

.search_sec.catalog-groupby-page .no-data {
	text-align: center;
	padding: 50px;
	font-size: 18px;
}

.search_sec.catalog-groupby-page .alert-warning {
	margin: 20px 0;
}

.search_sec.catalog-categories-page .custom_search > .row > [class*="col-"],
.search_sec.artwork-categories-page .custom_search > .row > [class*="col-"] {
    margin-bottom: 28px;
}

.search_sec.catalog-groupby-page .showMainResulsImage p.catalog-card-meta-description,
.search_sec.article-groupby-page .showMainResulsImage p.catalog-card-meta-description {
    display: block;
    -webkit-line-clamp: unset;
    line-clamp: unset;
    -webkit-box-orient: unset;
    overflow: visible;
    text-overflow: unset;
    max-height: none;
}

/* -- GROUPBY SEARCH CHROME SWEEP (2026-07-06): bare inner classes of the 4 group_by templates (showResultsItems, showMainResuls*, sortABC, sidebar rail, labels, numeric slider container, custom cols) - verbatim, original order -- */

.showMainResulsImage p a {
    color: #ffffff;
}

h3.sidebar_box_title {
    margin: 0;
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    color: #3E342A;
    margin-bottom: 15px;
}

h3.sidebar_box_title a {
    color: #3E342A;
}

p.sidebar_box_description {
    margin: 0;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
    color: #3E342A;
}

.showMainResuls {
	margin-bottom: 20px;
}

.showMainResulsTitle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.showMainResulsTitle h3 {
    display: flex;
    color: #3E342A;
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    gap: 10px;
    margin: 0;
	align-items: center;
}

.showMainResulsTitle h3 span {
	display: flex;
	min-width: 32px;
	height: 32px;
	padding: 0 12px; /* horizontal padding for rectangle body */
	align-items: center;
	justify-content: center;
	border-radius: 9999px; /* ensures fully rounded ends */
	background: #E4DDC7;
	color: #875D2A;
	font-size: 14px;
	line-height: 20px;
	width: fit-content;
}

.showMainResulsTitle a,.showMainResulsTitle button.catalog-nav-btn {
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    color: #875D2A;
}

.showMainResulsBox {
    background: #E4DDC7;
    min-height: 400px;
}

.showMainResulsImage {
    position: relative;
    height: 100%;
	min-height: 400px;
	overflow: hidden;
}

.showMainResulsImage img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.showMainResulsImage h3 {
    position: absolute;
    top: 20px;
    left: 20px;
    margin: 0;
    background: #3E342AB2;
    padding: 8px;
    color: #EDE9DE;
    font-size: 16px;
    line-height: 24px;
    font-weight: 500;
}

.showMainResulsImage h3 a {

    color: #EDE9DE;

}

.showMainResulsImage p {
    font-weight: 400;
    font-style: Italic;
    font-size: 16px;
    line-height: 24px;
    color: #ffffff;
    margin: 0;
    position: absolute;
    bottom: 20px;
    left: 20px;
}

.showResultsItems .row.align-items-center {
	margin-bottom: 20px;
}

.showMainResulsBox .col-md-8.col-md-82 {
    padding-top: 30px;
    padding-bottom: 30px;
    padding-right: 30px;
}

.showResultsItems img {
    max-width: 100%;
}

.showResultsItems h3 a,.showResultsItems h3 {
    font-weight: 500;
    font-size: 14px;
    line-height: 130%;
    text-transform: uppercase;
    color: #B23333;
	margin:0;
}

.artwork_list_additional_values h3 {
    font-weight: 500;
    font-size: 14px;
    line-height: 130%;
    color: #3E342A;
    margin: 0;
    display: inline-block;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
}

.artwork_list_additional_values h3 a {
    color: #3E342A;
}

.showResultsItems h4,.showResultsItems p.article-keywords,.showResultsItems p {
    font-size: 14px;
    line-height: 14px;
    color: #3E342A;
    margin: 0;
    display: inline-block;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
}

.showResultsItems h4 a,.showResultsItems p.article-keywords a,.showResultsItems p a {
    color: #3E342A;
}

.showResultsItems h4 button.catalog-nav-btn,.showResultsItems p.article-keywords button.catalog-nav-btn,.showResultsItems p.article-tone-style button.catalog-nav-btn,.showResultsItems p button.catalog-nav-btn {
    color: #3E342A;
}

.slider-container {
    width: 100%;
    margin: auto;
    position: relative;
    margin-bottom: 20px;
}

.labels {
    display: flex;
    justify-content: space-between;
    margin-top: 10px;
    font-size: 14px;
    color: #555;
}

.sortABC {
    width: 100%;
    display: flex;
    justify-content: space-between;
    font-size: 16px;
    line-height: 20px;
    font-weight: 400;
    color: #3E342A;
}

.sortABC a {
    color: #3E342A;
}

.sortABC span {
    opacity: 0.5;
    cursor: pointer;
}

.sortABC span.active {
    opacity: 1;
    position: relative;
}

.sortABC span.active:after {
    content: ".";
    position: absolute;
    bottom: -7px;
    left: 35%;
    font-weight: bold;
    font-size: 20px;
}

.sortABC span.disabled {
    opacity: 0.4;
    cursor: none;
}

@media (min-width: 768px) {
  .col-md-4.col-md-42 {
		width: 33.33333333%;
		max-width: 33.33333333%;
	}

  .col-md-8.col-md-82 {
		width: 66.66666667%;
	}

}
@media (max-width: 768px) {
  .showResultsItems h3 a,.showResultsItems h3 {
    margin-top: 12px;
}

  .showResultsItems img {
    width: 100%;
}

  .showMainResulsBox .col-md-8.col-md-82 {
    	width: 100%;
    	padding-left: 30px;
	}

}
@media only screen and (min-width: 680px) and (max-width: 1200px) {
  .showMainResulsBox .showResultsItems .col-md-6 {
    flex: 0 0 auto;
    width: 100%;
}

}
@media only screen and (max-width: 1024px) {
  .showResultsItems h3 a,.showResultsItems h3 {
    font-weight: 500;
    font-size: 15px;

}

}
@media only screen and (max-width: 768px) {
  .responsive-adjust-for-museum-list {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

}
