.catalog-content,
.catalog-content-preview {
  margin-top: 10px;
  justify-content: flex-start;
}

.catalog-content.align-start {
  align-items: flex-start;
}

.catalog-content.align-end {
  align-items: flex-end;
}

.catalog-content.align-center {
  align-items: center;
}

.catalog-image-wrapper img {
  height: 250px;
  position: relative;
 
}
.pages-description{
  height: 280px !important;
}
.catalog-description.hidden{
 visibility: hidden;
 position: absolute;
}
.catalog-description {
  padding: 1.5rem 0;
  width: 100%;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.historic-catalog .catalog-description {
  height: unset; /* CHANGE */
}
.catalog-description p {
  margin-bottom: 0 !important;
}
.catalog-description > button {
  border-radius: 2rem;
  margin-top: 2rem;
  white-space: pre;
  width: unset !important;
}
.catalog-description span {
  margin-bottom: 5px;
  display: block;
  margin-top: 15px;
}
.catalog-image-wrapper {
  cursor: pointer;
  position: relative;
}
.catalog-image-wrapper::before {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  content: '';
  background-color: rgba(0, 0, 0, 0.05);
  z-index: 1;
}
.catalog-image-wrapper,
.catalog-description {
  margin: 0 3rem 1px 1px;
  position: relative;
}
.catalog-wrapper .ais-InfiniteHits-item:nth-child(1) > div,
.catalog-slider-preview > div:nth-child(1) .catalog-content-preview,
.designer-segment-catalogs > .ais-InfiniteHits-item:nth-child(1) > div {
  align-items: flex-start;
}
.catalog-wrapper .ais-InfiniteHits-item:nth-child(2) > div,
.designer-segment-catalogs > .ais-InfiniteHits-item:nth-child(2) > div {
  align-items: flex-start !important;
}
.catalog-slider-preview {
  display: grid;
  grid-template-columns: repeat(5, auto);
}
.catalog-slider-preview > div:nth-child(3) .catalog-content-preview {
  align-items: flex-end;
}
.catalog-slider-preview > div:nth-child(2) .catalog-content-preview,
.catalog-slider-preview > div:nth-child(5) .catalog-content-preview {
  align-items: center;
}
.catalog-slider-preview > div:nth-child(4) .catalog-content-preview {
  align-items: flex-start;
}
.catalog-content-preview {
  justify-content: flex-end;
}
.catalog-content-preview img {
  height: 100%;
}
.catalog-slider-preview.catalog-slider-preview-1 {
  grid-template-columns: repeat(1, auto);
}
.catalog-slider-preview.catalog-slider-preview-2 {
  grid-template-columns: repeat(2, auto);
}
.catalog-slider-preview.catalog-slider-preview-3 {
  grid-template-columns: repeat(3, auto);
}
.catalog-slider-preview.catalog-slider-preview-4 {
  grid-template-columns: repeat(4, auto);
}
.catalog-content-preview img {
  width: auto;
}
.catalog-image-wrapper.shadow-size-1 {
  box-shadow: rgba(200, 200, 200, 0.7) 8px 6px 4px 0px;
}
.catalog-image-wrapper.shadow-size-2 {
  box-shadow: rgba(200, 200, 200, 0.7) 12px 8px 6px 0px;
}
.catalog-image-wrapper.shadow-size-3 {
  box-shadow: rgba(200, 200, 200, 0.7) 16px 8px 8px 0px;
}

.catalog-image-wrapper.shadow-size-4 {
  box-shadow: rgba(200, 200, 200, 0.7) 20px 8px 10px 0px;
}

.catalog-image-wrapper.shadow-size-1 {
  clip-path: polygon(100% 0, calc(100% + 10px) 10px, calc(100% + 10px) calc(100% + 10px), 0 calc(100% + 10px), 0 0);
}
.catalog-image-wrapper.shadow-size-2 {
  clip-path: polygon(100% 0, calc(100% + 15px) 15px, calc(100% + 15px) calc(100% + 10px), 0 calc(100% + 10px), 0 0);
}
.catalog-image-wrapper.shadow-size-3 {
  clip-path: polygon(100% 0, calc(100% + 20px) 20px, calc(100% + 20px) calc(100% + 10px), 0 calc(100% + 10px), 0 0);
}
.catalog-image-wrapper.shadow-size-4 {
  clip-path: polygon(100% 0, calc(100% + 25px) 25px, calc(100% + 25px) calc(100% + 10px), 0 calc(100% + 10px), 0 0);
}
.catalog-image-wrapper.catalog-size-7,
.catalog-content.catalog-size-7 img {
  height: var(--xxl-catalog);
}
.catalog-content.catalog-content.catalog-size-1:before {
  top: var(--xxs-catalog);
}
.catalog-content.catalog-content.catalog-size-2:before {
  top: var(--xs-catalog);
}
.catalog-content.catalog-content.catalog-size-3:before {
  top: var(--s-catalog);
}
.catalog-content.catalog-content.catalog-size-4:before {
  top: var(--m-catalog);
}
.catalog-content.catalog-content.catalog-size-5:before {
  top: var(--l-catalog);
}
.catalog-content.catalog-content.catalog-size-6:before {
  top: var(--xl-catalog);
}
.catalog-content.catalog-content.catalog-size-7:before {
  top: var(--xxl-catalog);
}

.bookmark-pages-wrapper.catalog-size-1 img,
.bookmark-pages-wrapper.catalog-size-1 .wrapper-with-overlay,
.catalog-image-wrapper.catalog-size-1,
.catalog-content.catalog-size-1 img {
  height: var(--xxs-catalog);
}

.messages-catalog.catalog-size-1 .wrapper-with-overlay {
  height: unset;
  max-height: var(--xxs-catalog);
}

.bookmark-pages-wrapper.catalog-size-2 img,
.bookmark-pages-wrapper.catalog-size-2 .wrapper-with-overlay,
.catalog-image-wrapper.catalog-size-2,
.catalog-content.catalog-size-2 img {
  height: var(--xs-catalog);
}

.messages-catalog.catalog-size-2 .wrapper-with-overlay {
  height: unset;
  max-height: var(--xs-catalog);
}
.bookmark-pages-wrapper.catalog-size-3 img,
.bookmark-pages-wrapper.catalog-size-3 .wrapper-with-overlay,
.catalog-image-wrapper.catalog-size-3,
.catalog-content.catalog-size-3 img {
  height: var(--s-catalog);
}

.messages-catalog.catalog-size-3 .wrapper-with-overlay {
  height: unset;
  max-height: var(--s-catalog);
}

.bookmark-pages-wrapper.catalog-size-4 img,
.bookmark-pages-wrapper.catalog-size-4 .wrapper-with-overlay,
.catalog-image-wrapper.catalog-size-4,
.catalog-content.catalog-size-4 img {
  height: var(--m-catalog);
}

.messages-catalog.catalog-size-4 .wrapper-with-overlay {
  height: unset;
  max-height: var(--m-catalog);
}
.bookmark-pages-wrapper.catalog-size-5 img,
.bookmark-pages-wrapper.catalog-size-5 .wrapper-with-overlay,
.catalog-image-wrapper.catalog-size-5,
.catalog-content.catalog-size-5 img {
  height: var(--l-catalog);
}

.messages-catalog.catalog-size-5 .wrapper-with-overlay {
  height: unset;
  max-height: var(--l-catalog);
}
.bookmark-pages-wrapper.catalog-size-6 img,
.bookmark-pages-wrapper.catalog-size-6 .wrapper-with-overlay,
.catalog-image-wrapper.catalog-size-6,
.catalog-content.catalog-size-6 img {
  height: var(--xl-catalog);
}

.messages-catalog.catalog-size-6 .wrapper-with-overlay {
  height: unset;
  max-height: var(--xl-catalog);
}

.ais-InfiniteHits-list.ais-InfiniteHits-list-catalogs .catalog-content img {
  height: unset;
  width: 100%;
}
.ais-InfiniteHits-list.ais-InfiniteHits-list-catalogs .catalog-image-wrapper {
  height: unset;
  margin: 0;
}
.ais-InfiniteHits-list.ais-InfiniteHits-list-catalogs .catalog-description {
  margin: 0;
}
.catalogs-container {
  margin: 0 25px !important;
}
.catalog-wrapper.catalogs-container {
  display: flex;
}
.catalog-slider-preview > div {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.catalog-content-preview .catalog-description {
  width: 100%;
}
.catalog-actions {
  z-index: 3;
  left: 0;
  align-items: center;
}
.catalog-actions > span{
  flex: 1;
  margin: 0 !important;
}
.catalog-actions + .catalog-description {
  padding: 0;
}
.catalog-actions.centered {
  justify-content: center;
}
.historic-catalogs-list-wrapper,
.auction-catalogs-list {
  margin: 2.5rem;
}
.catalog-actions {
  position: static;
  margin-bottom: 1.5rem;
}
.catalog-separator {
  position: absolute;
  height: 1px;
  background-color: var(--primary-color);
  width: 100%;
  visibility: hidden;
}
.designer-images {
  display: grid;
  grid-template-columns: 1.2fr 1.5fr;
  grid-template-rows: auto 1fr;
  gap: 1.5rem;
  height: calc(100vh - var(--header-height));
  width: 100%;
  position: absolute;
  margin-bottom: var(--header-height);
  gap: 5rem 2rem;
  align-items: flex-end;
  z-index: -1;
}
.designer-images img {
  object-fit: contain;
  max-width: 100%;
}
.designer-images img:nth-of-type(1) {
  width: calc(100vw - 10rem);
  grid-column: span 2;
}
.designer-images img:nth-of-type(2) {
  align-self: flex-start;
}
.designer-images img:nth-of-type(3) {
  margin-top: 5rem;
}

.designer-header {
  padding: 0 25px 8.5rem;
}
.designer-header:not(:has(.font-lt)){
  padding: 0 !important;
}
.designer-header.designer-header-sticky {
  position: sticky;
  top: var(--header-height);
  margin-bottom: 100vh;
  min-height: calc(100vh - var(--header-height));
}
.designer-header h1 {
  margin-bottom: 3rem;
}
.designer-content > div.biography {
  column-gap: 5rem;
}
#quickViewModal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(15, 15, 15, 0.92); 
  backdrop-filter: blur(6px);
  display: flex;
  opacity: 0;
  overflow: hidden;
  visibility: hidden;
  pointer-events: none;
  align-items: flex-start;
  justify-content: center;
  z-index: 9999;
  transition: opacity 0.3s ease,visibility 0.3s ease;
  padding: 40px 20px;
}


#quickViewModal.is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.closeModalBtn {
  position: fixed;
  top: 20px;
  right: 30px;
  font-size: 28px; 
  color: white;
  background: transparent;
  border: none; 
  cursor: pointer;
  transition: transform 0.2s ease;
  z-index: 10000;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
#quickViewModal.is-visible ~ .closeModalBtn {
  display: block; 
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}


.catalog-summary{
  margin-bottom:70px !important
}
.catalog-summary b{
  font-size: 1.5rem !important;
}
.catalog-summary p {
  display: -webkit-box;          
  display: box;                     
  -webkit-box-orient: vertical;     
  box-orient: vertical;
  -webkit-line-clamp: 4;           
  line-clamp: 4;                    
  overflow: hidden;
  text-overflow: ellipsis;           
  transition: all 0.3s ease;
  line-height: 1.5;
  font-size: 1.3rem !important;
}


.catalog-summary p.expanded {
  -webkit-line-clamp: unset;
  line-clamp: unset;
  max-height: none;
  overflow: visible;
}
.catalog-summary button{
  background:none;
  border:none;
  cursor:pointer;
  font-size:1.4rem !important;
  margin-top:5px;
  text-decoration: underline;
}

.tags-container{
  margin-top:5px;
}
.tags-container p{
  margin-top: 2px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.tags-quick-view{
   display: inline-block;
   background-color: #ffffff; 
   color: #000000; 
   padding: 3px 10px;
   margin: 0;
   border-radius: 10px; 
   font-size: 0.8rem; 
   font-weight: 600;
   line-height: 1.1;
   letter-spacing: 0.2px;
   text-transform: capitalize;
   transition: all 0.2s ease-in-out;
   border: 1px solid #ffffff; 
   box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}

.quick-view-main-row{
  display: grid;
  gap: 20px;
  margin-bottom: 100px;
  margin-top:50px;
}

.quick-view-top-container {
  padding:0 13px; 
  min-height: 200px;
  display: flex;
  align-items: center;
  justify-content: flex-start;    

 }
 .container-1{
  box-sizing: border-box;

 }
 .container-2 {
  display: flex;
  flex-direction: column;    
  align-items: flex-start;    
  justify-content: flex-end;  
  height: 100%;              
  padding: 1rem;              
  box-sizing: border-box;    
  padding-bottom: 50px; 


}
.container-2 > div {
  margin-bottom: 0.5rem;
}

.container-2 > div:last-child {
  margin-bottom: 1.5rem;
}
.container-3 {
  display: flex;
  flex-direction: column;   
  align-items: flex-start; 
  justify-content: flex-end;
  height: 100%;           
  padding: 1rem;            
  box-sizing: border-box; 


}

.container-3 .catalog-summary > * {
  margin-bottom: 0.5rem;
}

.container-3 .catalog-summary > *:last-child {
  margin-bottom: 0;
}

.catalog-summary p {
  max-height: 100px;      
  overflow: hidden;         
  transition: max-height 0.3s ease;
}

.catalog-summary p.expanded {
  max-height: none;
}
.catalog-summary p.expanded::after {
  display: none;
}

.paragraph-read-more{
  overflow: hidden;
  max-height: 4.5em;
  transition:max-height 0.4s ease-out;
}
.paragraph-read-more.expanded{
  max-height: 1000px;
  transition: max-height 0.6s ease-in;
}

.paragraph-read-more::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right:0;
  height:1.5em;
  background: linear-gradient(to bottom, transparent, rgba(15, 15, 15, 0.92));
}
.catalog-summary{
  height: auto !important;
  overflow: visible !important;
}

.quick-view-main-row,
.quick-view-top-container{
  height:auto !important;
  overflow:visible !important;
}



#quickViewModal::-webkit-scrollbar {
  width: 5px;
}

#quickViewModal::-webkit-scrollbar-track {
  background: #fff; 
}

#quickViewModal::-webkit-scrollbar-thumb {
  background: #000; 
  border-radius: 5px;
}

#quickViewModal::-webkit-scrollbar-thumb:hover {
  background: #000; 
}

.dummy-spacer {

  flex-basis: 280px; 
  height: 0;
  padding: 0;
  margin: 0;
  visibility: hidden;
  border: none;
}


@media (min-width: 1200px) {
    .quick-view-main-row {
       grid-template-columns: 1fr 1fr;
       grid-template-columns: 1fr 1fr;
     }

     .quick-view-left-column {
        display: grid;
        grid-template-columns: 0.7fr 2fr;
        gap: 0px;
     }


}
     
@media (min-width:992px) and (max-width:1199px) {
    .quick-view-main-row{
      grid-template-columns: 1fr 1.3fr;
    }
   
    .quick-view-left-column {
      display: grid;
      grid-template-columns: 0.7fr 1fr;
      gap: 0px;
    }
  


}

@media (min-width:512px) and (max-width:991px) {
    .quick-view-main-row {
      grid-template-columns: 1fr;
    }

    .quick-view-left-column {
      display: grid;
      grid-template-columns: 0.7fr 2fr;
      gap: 0px;
    }
  
}

 @media (max-width: 511px) {
  .quick-view-main-row {
    display: flex;
    flex-direction: column;
    padding: 0;
    margin:0;
  }
  .quick-view-left-column {
    order: 1;
    padding: 0;
    margin:0;
  }
  .container-2{
    margin-top: 20px;
    margin-left:5px;
  }
  .container-2 > div:first-child{
    margin-top: -65px;
    text-align: right;
    padding-right: 15px;
  }
  
  .container-3 {
    order: 2;
    margin:0;
  }


}




@media screen and (min-width: 768px) {
  .ais-InfiniteHits-list.ais-InfiniteHits-list-catalogs .catalog-content img {
    width: auto;
  }
  .ais-InfiniteHits-list.ais-InfiniteHits-list-catalogs .catalog-image-wrapper.catalog-size-1,
  .ais-InfiniteHits-list.ais-InfiniteHits-list-catalogs .catalog-content.catalog-size-1 img {
    height: var(--xxs-catalog);
  }
  .ais-InfiniteHits-list.ais-InfiniteHits-list-catalogs .catalog-image-wrapper.catalog-size-2,
  .ais-InfiniteHits-list.ais-InfiniteHits-list-catalogs .catalog-content.catalog-size-2 img {
    height: var(--xs-catalog);
  }
  .ais-InfiniteHits-list.ais-InfiniteHits-list-catalogs .catalog-image-wrapper.catalog-size-3,
  .ais-InfiniteHits-list.ais-InfiniteHits-list-catalogs .catalog-content.catalog-size-3 img {
    height: var(--s-catalog);
  }
  .ais-InfiniteHits-list.ais-InfiniteHits-list-catalogs .catalog-image-wrapper.catalog-size-4,
  .ais-InfiniteHits-list.ais-InfiniteHits-list-catalogs .catalog-content.catalog-size-4 img {
    height: var(--m-catalog);
  }
  .ais-InfiniteHits-list.ais-InfiniteHits-list-catalogs .catalog-image-wrapper.catalog-size-5,
  .ais-InfiniteHits-list.ais-InfiniteHits-list-catalogs .catalog-content.catalog-size-5 img {
    height: var(--l-catalog);
  }
  .ais-InfiniteHits-list.ais-InfiniteHits-list-catalogs .catalog-image-wrapper.catalog-size-6,
  .ais-InfiniteHits-list.ais-InfiniteHits-list-catalogs .catalog-content.catalog-size-6 img {
    height: var(--xl-catalog);
  }
  .ais-InfiniteHits-list.ais-InfiniteHits-list-catalogs .catalog-image-wrapper.catalog-size-7,
  .ais-InfiniteHits-list.ais-InfiniteHits-list-catalogs .catalog-content.catalog-size-7 img {
    height: var(--xxl-catalog);
  }
  .ais-InfiniteHits-list.ais-InfiniteHits-list-catalogs .catalog-image-wrapper,
  .ais-InfiniteHits-list.ais-InfiniteHits-list-catalogs .catalog-description {
    margin: 0 3rem 1px 1px;
  }
  .designer-images {
    gap: 10rem 5rem;
  }
  .designer-images img:nth-of-type(1) {
    width: calc(100vw - 25rem);
  }
  .designer-images img:nth-of-type(3) {
    margin-top: 10rem;
  }
}

@media screen and (min-width: 992px) {
  .content.active .designer-images{
    width: calc(100% - var(--filter-width));
  }
  .designer-images {
    grid-auto-flow: column;
    grid-template-columns: 4fr 3fr 3fr;
    grid-template-rows: unset;
    align-items: unset;
    gap: 1.5rem;
  }
  .designer-images img {
    width: 100%;
    height: auto !important;
    max-height: calc(100vh - var(--header-height));
  }
  .designer-images img:nth-of-type(1) {
    padding-right: 2.5rem;
    object-position: left;
    grid-column: span 1;
  }
  .designer-images img:nth-of-type(2) {
    justify-self: unset;
    align-self: flex-end;
    padding-top: 0;
  }
  .designer-images img:nth-of-type(3) {
    align-self: center;
    object-position: right;
    margin-top: 0;
  }
  .designer-header {
    padding: 0 2.5em 25rem;
  }
  .designer-content > div.biography {
    margin-left: 20rem;
    display: grid;
    grid-template-columns: 7fr 3fr;
  }
}

@media screen and (min-width: 1500px) {
  .designer-header h1 {
    margin-bottom: 3rem;
  }
  .designer-content > div.biography {
    column-gap: 9rem;
  }
}

@media(max-width:511px) {
  
  ol.mobile-responsive-catalog-item {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 2px !important;
    list-style-type:none !important;
    padding:0 !important;
    margin: 0 !important;
  }

  li.mobile-responsive-catalog-item:nth-child(odd) {
    margin-top: 30px !important;
  }
  li.mobile-responsive-catalog-item .catalog-image-source {
    width: 100% !important;
    height: auto !important;
    display: block !important;
  }
  .catalog-summary{
    margin-bottom: 5px !important;
  }
  .container-3{
    display: block;
  }
}






/* DC isolated view switcher styles - do not touch existing site classes */
.designers-title-row #dc-view-switcher {
  /* outer white rectangle per design - scoped to the catalogs page row */
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  background: #ffffff;
  width: 155px; /* white rectangle width: 155px */
  height: 40px; /* white rectangle height: 40px */
  padding: 1.5px; /* difference white-dark rectangle: 1.5px */
  border-radius: 20px; /* rounded rectangle, not fully circular */
  box-shadow: 0 0 8px rgba(0,0,0,0.15); /* Even shadow on all sides - no offset, just blur */
  position: relative;
  z-index: 1; /* Low z-index so it stays behind header elements during scroll */
}
.dc-vs-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px; /* gap between icon and text */
  height: 37px; /* dark rectangle height: 37px */
  padding: 0;
  min-width: 37px;
  border-radius: 18.5px; /* slightly rounded to match the container */
  border: 0;
  background: transparent;
  color: #898989; /* default icon/text color per design */
  font-weight: bold; /* Font: 14px, bold */
  font-size: 14px; /* Font: 14px, bold */
  line-height: 1; /* ensure text doesn't affect vertical centering */
  cursor: pointer;
  transition: all 200ms ease;
  justify-content: center;
  position: relative;
}
.dc-vs-icon {
  width: 16px; /* Reduced to match actual icon sizes */
  height: 16px; /* Reduced to match actual icon sizes */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0; /* prevent icon from shrinking */
}
.dc-vs-icon svg {
  display: block;
  width: auto; /* let explicit svg size control actual visual size */
  height: auto;
  max-width: 100%;
  max-height: 100%;
  fill: currentColor;
  /* Removed vertical-align: middle as it's not needed with flex centering */
}
/* dark pill visual - active state */
.dc-vs-btn--active { 
  background: #1a1a1a; 
  color: #ffffff; 
  box-shadow: none; 
}
.dc-vs-btn:focus { outline: 3px solid rgba(77,144,254,0.18); outline-offset: 2px; border-radius: 22px; }

/* Catalogs selected state - left button active (114px), right button inactive (37px) */
.dc-view--catalogs .dc-vs-btn[data-dc-view="catalogs"] {
  width: 114px; /* Dark rectangle size: 37 x 114 px */
  background: #1a1a1a;
  color: #ffffff;
  padding: 0 16px;
  order: 0;
}
.dc-view--catalogs .dc-vs-btn[data-dc-view="pages"] {
  width: 37px; /* Inactive button - icon only */
  background: transparent;
  color: #898989; /* Icon 2 (page) color: #898989 */
  padding: 0;
  order: 1;
}

/* Pages selected state - left button inactive (37px), right button active (115px) */
.dc-view--pages .dc-vs-btn[data-dc-view="catalogs"] {
  width: 37px; /* Inactive button - icon only */
  background: transparent;
  color: #898989; /* Icon 1 (book) color: #898989 */
  padding: 0;
  order: 0;
}
.dc-view--pages .dc-vs-btn[data-dc-view="pages"] {
  width: 115px; /* Expanded to fill remaining space (155px - 37px - 3px padding = 115px) */
  background: #1a1a1a;
  color: #ffffff;
  padding: 0 16px;
  order: 1;
}

/* Active state: show both icon and label */
.dc-view--catalogs .dc-vs-btn[data-dc-view="catalogs"] .dc-vs-label,
.dc-view--pages .dc-vs-btn[data-dc-view="pages"] .dc-vs-label {
  display: inline-block;
  color: #ffffff;
  font-weight: bold;
  font-size: 14px;
  line-height: 1;
  margin: 0;
  padding: 0;
}

.dc-view--catalogs .dc-vs-btn[data-dc-view="catalogs"] .dc-vs-icon,
.dc-view--pages .dc-vs-btn[data-dc-view="pages"] .dc-vs-icon {
  display: inline-block;
  color: #ffffff;
}

/* Inactive state: show only icon, hide label */
.dc-view--catalogs .dc-vs-btn[data-dc-view="pages"] .dc-vs-label,
.dc-view--pages .dc-vs-btn[data-dc-view="catalogs"] .dc-vs-label {
  display: none;
}

.dc-view--catalogs .dc-vs-btn[data-dc-view="pages"] .dc-vs-icon,
.dc-view--pages .dc-vs-btn[data-dc-view="catalogs"] .dc-vs-icon {
  display: inline-block;
  color: #898989;
}

/* Inactive buttons: transparent background with grey icons only */
.dc-view--catalogs .dc-vs-btn[data-dc-view="pages"] .dc-vs-icon svg,
.dc-view--pages .dc-vs-btn[data-dc-view="catalogs"] .dc-vs-icon svg {
  fill: #898989 !important;
  color: #898989 !important;
}

/* Icon sizing: book icon larger, page icon smaller for proper visual hierarchy */
.dc-vs-btn[data-dc-view="catalogs"] .dc-vs-icon svg { width: 16px; height: 16px; }
.dc-vs-btn[data-dc-view="pages"] .dc-vs-icon svg { width: 12px; height: 12px; } /* Smaller than book icon */

/* Fine-tune icon alignment for perfect centering */
.dc-vs-btn[data-dc-view="pages"] .dc-vs-icon {
  transform: translateY(1px); /* Slight adjustment for page icon to align with text */
}

.dc-vs-btn[data-dc-view="catalogs"] .dc-vs-icon {
  transform: translateY(0px); /* Keep book icon at natural position */
}

/* Icon color overrides: active -> white, inactive -> black */
/* Use higher specificity to override inline SVG fills or inherited rules */
.dc-view-switcher .dc-vs-btn--active .dc-vs-icon,
.dc-view-switcher .dc-vs-btn--active .dc-vs-icon svg,
.dc-view-switcher .dc-vs-btn--active .dc-vs-icon path,
.dc-view-switcher .dc-vs-btn--active .dc-vs-icon g {
  color: #ffffff !important;
  fill: #ffffff !important;
}

.dc-view-switcher .dc-vs-btn:not(.dc-vs-btn--active) .dc-vs-icon,
.dc-view-switcher .dc-vs-btn:not(.dc-vs-btn--active) .dc-vs-icon svg,
.dc-view-switcher .dc-vs-btn:not(.dc-vs-btn--active) .dc-vs-icon path,
.dc-view-switcher .dc-vs-btn:not(.dc-vs-btn--active) .dc-vs-icon g {
  color: #000000 !important;
  fill: #000000 !important;
}

/* Mobile: Use circular buttons design per specs - White rectangle 40x77px, Dark rectangle 37x37px */
@media (max-width: 480px) {
  .designers-title-row #dc-view-switcher { 
    width: 77px; /* Mobile white rectangle width: 77px */
    height: 40px; /* Mobile white rectangle height: 40px */
    padding: 1.5px; 
    margin-right: 0 !important; /* Remove right margin on mobile */
  }
  
  /* Hide labels on mobile - show icons only */
  .dc-vs-label { display: none !important; }
  
  /* Both buttons are circular (37x37px) on mobile */
  .dc-vs-btn { 
    min-width: 37px; 
    width: 37px;
    height: 37px;
    padding: 0; 
    border-radius: 50%; /* Circular buttons on mobile */
  }
  
  /* Active button: dark circle */
  .dc-vs-btn--active { 
    background: #1a1a1a;
    color: #ffffff;
  }
  
  /* Inactive button: transparent */
  .dc-view--catalogs .dc-vs-btn[data-dc-view="pages"],
  .dc-view--pages .dc-vs-btn[data-dc-view="catalogs"] {
    background: transparent;
    color: #898989;
  }
  
  /* Perfect icon centering on mobile - reset desktop offsets */
  .dc-vs-btn[data-dc-view="pages"] .dc-vs-icon,
  .dc-vs-btn[data-dc-view="catalogs"] .dc-vs-icon {
    transform: translate(0, 0) !important; /* Remove all desktop positioning offsets */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 16px !important;
    height: 16px !important;
  }
}

/* anchored variant - positions the switch relative to the designers-title-wrapper */
.dc-view-switcher--anchored {
  position: absolute;
  right: 0.25rem; /* small offset from right edge of the title wrapper */
  top: 0; /* align with top of the title wrapper */
  transform: translateY(2px); /* fine-tune vertical alignment */
}

/* inline variant: use when .designers-title-wrapper is a flex container and we want
   the switch to be on the same line at the right end (margin-left:auto) */
.dc-view-switcher--inline {
  position: static;
  margin-left: auto;
  float: none;
}



/* row that contains the catalogs count (instantsearch stats) and the switch */
.content .designers-title-row {
  /* match the same horizontal gutter used by .catalogs-container (0 25px)
     scoped to this page so other pages/layouts are not affected */
  display: flex;
  align-items: center;
  gap: 1rem;
  margin: 0 25px; /* Restore left margin for catalog count alignment, keep right margin same as catalogs-container */
}
.content .designers-title-row .designers-title-wrapper {
  margin: 0;
  padding: 0.5rem 0;
  box-sizing: border-box;
  flex: 0 1 auto; /* allow the title area to grow/shrink */
}
.content .designers-title-row .designers-title-wrapper { text-align: left; }
.content .designers-title-row #dc-view-switcher {
  margin-left: auto; /* push the switch to the far right of the row */
  /* remove outer right margin; the row margin aligns the outer edge */
  margin-right: 27px;
  margin-top: 8px; /* Add top margin to prevent cropping */
  margin-bottom: 8px; /* Add bottom margin for consistent spacing */
  box-sizing: border-box;
}

@media screen and (min-width: 992px) {
  .designers-title-row { width: calc(100% - 50px); margin: 0 2.5em; }
  .designers-title-row .designers-title-wrapper { padding-left: 0; }
}

/* fixed variant styling when JS pins the switch to the viewport */
.dc-view-switcher--inline {
  position: static !important;
  right: auto !important;
  top: auto !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.06);
  background: transparent;
}

/* Mobile-friendly styles for pages view - match catalogs view behavior */
@media (max-width: 768px) {
  /* Ensure catalog actions are visible and properly positioned in pages view */
  .bookmark-pages-wrapper .catalog-actions {
    position: absolute !important;
    top: 8px !important;
    right: 8px !important;
    z-index: 3 !important;
    display: flex !important;
    align-items: center;
    gap: 6px;
  }
  
  /* Ensure action buttons are properly sized on mobile */
  .bookmark-pages-wrapper .catalog-actions button {
    width: 2.4rem !important;
    height: 2.4rem !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  
  /* Ensure icons are visible */
  .bookmark-pages-wrapper .catalog-actions svg {
    width: 1rem !important;
    height: 1rem !important;
    fill: var(--matte-red) !important;
  }
  
  /* Fix pages description layout on mobile - reduce excessive height */
  .pages-description {
    width: 100% !important;
    max-width: calc(100vw - 40px) !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    height: auto !important; /* Remove fixed height that creates excessive spacing */
    padding: 10px 0 !important; /* Reduce padding for tighter spacing */
  }
  
  /* Stack pills vertically on mobile - match catalogs view behavior */
  .pages-description .pill-wrapper {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 5px !important;
    max-width: 100% !important;
  }
  
  /* Keep normal pill size - don't make them smaller */
  .pages-description .pill {
    width: fit-content !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  
  /* Fix container positioning and sizing for pages view on mobile */
  .bookmark-pages-wrapper {
    position: relative !important;
    overflow: hidden !important;
  }
  
  /* Match catalog sizes on mobile - ensure pages are same size as catalogs */
  .bookmark-pages-wrapper img,
  .bookmark-pages-wrapper .wrapper-with-overlay {
    max-width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
  }
  
  /* Ensure pages container matches catalog container sizing */
  .bookmark-pages-wrapper .pages-grouped-images {
    max-width: 100% !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
  }
  
  /* Mobile: One page per row layout with adjusted spacing */
  .designcatalogs-pages-wrapper .ais-InfiniteHits-item {
    margin-bottom: 20px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  
  /* Override the default 2-column grid for pages view on mobile */
  .designcatalogs-pages-wrapper .ais-InfiniteHits-list {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
  
  /* Reduce extra spacing for pages without bubbles to create uniform gaps */
  .pages-description:not(:has(.pill-wrapper)) {
    padding-bottom: 5px !important; /* Minimal padding for pages without bubbles */
  }
  
  /* Ensure cover pages with bubbles have consistent bottom spacing */
  .pages-description:has(.pill-wrapper) {
    padding-bottom: 10px !important; /* Small padding for pages with bubbles */
  }
}