:root{
   --height-card-hero: 190px;   
}





.is-tiered .seating-guide-buy-tickets .card{
    height: 138px;
  }
  .is-tiered .seating-guide-buy-tickets .card h2:after{
      content: "100% Buyer Guarantee";
      font-size: 15px;
      position: absolute;
      top: 28px;
      left: 0;
      width: 176px;
  }
  
  
  .is-tiered .seating-guide-buy-tickets img{
    height: 108px !important;
  }
  .is-tiered .seating-guide-upload-rate{
    height: 125px !important;
  }
  
  .is-tiered .seating-guide-explore{
    height: 119px !important;
  }
  
  .is-tiered .sc-holder, .is-tiered .cropped-chart{
    height: 68px !important;
  }
  
  .is-tiered .seating-guide-upload-rate{
    padding-top: 5px !important;
  }
  
  .is-tiered .seating-guide-upload-rate span.eighteen{
    line-height:24px !important;
  }
  

  #preview-seating-container{position:absolute;top:430px;width:630px;background:rgba(255,255,255,0.9) none;z-index:5;left:-15px; box-shadow: 0 -3px 4px 0px rgba(0,0,0,0.15);border-bottom:1px solid #DDD;border-top:1px solid #DDD;}
#preview-seating-container .interior{width:600px;padding:10px 15px;box-shadow: 0 3px 4px 0px rgba(0,0,0,0.15);z-index:6;overflow:auto;}
.preview-seating-select.active em{display:none;}
.venue-header.marbottom{margin-bottom:0 !important;} /*super-hack with cover photo*/
.cover-photo{width:100%; background-repeat:no-repeat;background-position:50% 35%;background-size:100%;}
.cover-photo-interior{padding-top:20px;width:1000px;margin:0px auto; overflow:auto;}
.cover-photo-interior h1,.cover-photo-interior h2{text-align:center;}
.cover-photo .card{-moz-box-shadow:6px 6px 5px #000;-webkit-box-shadow:6px 6px 5px #000;box-shadow:6px 6px 5px #000;position:relative;background:white;border:1px solid #CCC;}
.cover-photo .card h2{color:black !important;text-shadow:none !important;font-size:18px;font-weight:normal !important;text-align:left;}
.cover-photo .card h2:hover{text-decoration:underline;}
.cover-photo .card:hover{border-color:black;}
.cover-photo ul.navigation-onpage{border-top:1px solid #333;}
.cover-photo ul.navigation-onpage li{font-weight:bold;color:#AEAEAE;font-size:14px;padding:20px 30px;position:relative;}
.cover-photo ul.navigation-onpage img.arrow-active{display:none;position:absolute;bottom:0;left:50%;margin-left:-7px;}
.cover-photo ul.navigation-onpage li.active{color:white;}
.cover-photo ul.navigation-onpage li.active img.arrow-active{display:block;}
.cover-photo ul.navigation-onpage li:hover{color:white;cursor:pointer;}
.cover-photo-interior{padding-bottom:0 !important;} /*if we have inpage navigation*/
a.item-location{border-left:16px solid #D1D1D1;padding-left:10px;}
#section-rows-description div{background:#E1E1E1;border-radius:4px;min-width:16px;text-align:center;font-size:11px;color:#333;height:16px;line-height:16px;float:left;margin-right:10px;font-weight:bold;}
#section-rows-description span{line-height:16px;float:left;font-weight:bold;color:#999;font-size:11px; margin-right:20px;}
#section-rows-description span.last{margin-right:0;}
ul.page-contents li{color:black !important;font-size:12px;line-height:26px;}
table.table-staff-picks{color:#666;}
table.table-staff-picks th{color:#666;font-weight:bold;text-align:left;border-bottom:1px solid #CCC;padding:10px}
table.table-staff-picks th:first-child, table.table-staff-picks td:first-child{padding-left:0;}
table.table-staff-picks td{padding:10px;border-top:1px solid #F1F1F1;}
table.table-staff-picks tr.continuous td:first-child{border-top:none;}
table.table-staff-picks td li{font-size:12px;margin-bottom:0;}
.custom-event-box,.custom-event-box .bg-black-transparent-dark{border-radius:10px;}
.article-body p.callout-inline{margin-left:-15px;-moz-box-shadow:1px 2px 2px 0px #666;-webkit-box-shadow:1px 2px 2px 0px #666;box-shadow:1px 2px 2px 0px #666;background:#333;color:white;padding:10px;}
.article-body p.callout-inline a{color:white;text-decoration:underline;}











.thumbnail-container{overflow:auto;}
.thumbnail-container img{
   width: 100%;
   border-radius: 4px;
   object-fit: cover;
   height: 100%;   
}

.thumbnail-container .thumbnail-holder{
   float:left;margin-right:10px; width:calc(20% - 10px);max-width: 90px;
   height: 15vw;
   max-height: 90px;
   border-radius: 4px;
   box-sizing: border-box;
}

.thumbnail-container .thumbnail-holder .caption{padding:3px 5px;position:absolute;bottom:0;left:0;color:white !important;background:rgba(0,0,0,0.85) none;width: 100%;box-sizing: border-box;
font-size: --fsize-d-xsmall;
}

.thumbnail-holder.link-holder{   
   background: black;
   color: white;
   display: flex;
   justify-content: center;
   align-items: center;
   text-align: center;
   font-weight: 500;  
}




.mobile #seating_overview section:first-child{margin-top:0px;}
/*MOBILE EVENT LIST STYLING*/
.mobile #mobile-ajax-event-list{margin:10px;margin-bottom:20px;border:1px solid #E5E5E5;}
.mobile #mobile-ajax-event-list ul.simple-event-list{border-top:none;}
.mobile #mobile-ajax-event-list h2.list-header{border-bottom:1px solid #E5E5E5;border-top:none;background:#FFF;color:#666;font-size:18px;padding:15px;}
.mobile #seating_overview{padding-top:20px;}

ul.header-navigation{padding:15px;background:white;border-top:1px solid #CCC;border-bottom:1px solid #CCC;}
ul.header-navigation.navigation-scroll{overflow-y:hidden;overflow-x:scroll;white-space: nowrap;}
.header-navigation li{border-radius:3px;border:1px solid #0067CE;color:#0067CE;text-align:center;padding:7px 0;width:90px;margin-right:15px;display:inline-block;text-transform:uppercase;font-size:11px;position:relative;}



#trending-events{background:white;border-bottom:1px solid #CCC;}

/*Test default has sticky header at the top*/
#sticky-event-teaser{position:fixed;top:auto;bottom:0;width:100%;-moz-box-shadow:1px -2px 2px 0px #CCC;-webkit-box-shadow:1px -2px 2px 0px #CCC;box-shadow:1px -2px 2px 0px #CCC;z-index:1000000;left:0;}


/**
 * The default mobile event list has a date block, event block and button
 * [ ][      ][  ]
 *
 * The default button text is "Tickets"
 *
*/
.mobile .list-events-style-default li.event{background:white;position:relative;border-bottom:1px solid #F1F1F1; overflow:auto;font-size:12px;color:black;padding:10px 0;}

.mobile .list-events-style-default li.event .date-block{float:left;width:30px;line-height:1;padding:0 15px;margin-top:-2px;}
.mobile .list-events-style-default li.event .date-block span{display:block;text-align:center;}
.mobile .list-events-style-default li.event .date-block .day-of-month{font-size:22px;margin-bottom:3px;}
.mobile .list-events-style-default li.event .date-block .month{text-transform:uppercase;}
.mobile .list-events-style-default li.event .event-block{float:left;width:calc(100% - 60px - 72px - 22px);-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;line-height:1;}
.mobile .list-events-style-default li.event .event-block .event-name{margin-bottom:2px;font-size:14px;color:#0067CE;font-weight:500;}
.mobile .list-events-style-default li.event .event-block .event-location,.list-events-style-default li.event .event-block .event-time{text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}
.mobile .list-events-style-default li.event .event-block .event-location{margin-bottom:2px;}
.mobile .list-events-style-default li.event button{position:absolute;right:15px;width:72px;font-size:14px;height:32px;padding:0;line-height:32px;top:10px;}


  
/**
 * Styles for event overlay popup
 */
 
#list-overlay-popup-events{max-height:calc(100% - 270px);}
#list-overlay-popup-events li{margin-bottom:15px;text-align:center;color:white;position:relative;padding:10px;height:60px;background:black;cursor:pointer;}
#list-overlay-popup-events li:last-child{margin-bottom:0;}
#list-overlay-popup-events li:active{opacity:0.85}
#list-overlay-popup-events li .abbreviation{left:0px;width:60px;top:0;text-align:center;font-size:24px;line-height:60px;height:60px;position:absolute;font-weight:bold;}
#list-overlay-popup-events .event-name{line-height:24px;font-weight:bold;font-size:20px;width:calc(100% - 60px);margin-left:30px;position:relative;z-index:2;}
#list-overlay-popup-events .event-name.has-abbrev{width:calc(100% - 120px);margin-left:60px;}
#list-overlay-popup-events .event-details{line-height:16px;}
#list-overlay-popup-events li .image-performer{position:absolute;right:0;top:0;height:60px;width:90px;z-index:1;}  
  
  
  
  
  
  section figure img{height:300px;width:100%;object-fit:cover;} 
  
@media screen and (max-width: 599px)
{
  section figure img{height:200px;} 
}

section .article.article-best-seats{max-height:150px;overflow:hidden;margin-bottom:20px;}
section .article.article-best-seats{}
section.section-expanded .article.article-best-seats{max-height:unset;margin-bottom:0;}
section.section-expanded .mask-article{background:none;position:relative;padding:0;}  
section .mask-article{position:absolute;bottom:0;width:100%;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;background-image: linear-gradient(rgba(255,255,255,0), rgba(255,255,255,1));left:0;width:100%;padding:15px;padding-top:155px;text-transform:uppercase;font-weight:bold;margin-top:10px;}
  .section-collapsed:not(.section-expanded):hover{cursor:pointer;border-color:#CCC !important;webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);}
  section .mask-article  span.fakeLink:before{content:"Continue Reading";}
  section.section-expanded .mask-article span.fakeLink:before{content:"Show Less";}

  
  
  li.item-avatar{border:none;padding-top:0;padding-left:56px !important;} 

   #city-events ul{
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
      gap: 16px;
      list-style-type: none;
      padding: 0;
      margin: 0;
   }

   #city-events li{
      font-size: clamp(13px, 2vw, 14px);
   }
   #city-events li a{
      color: #222;      
   }


.pseudo-section{
   padding: 10px;
}


.slider .item-card .details{
   
}

.slider .item-card .footer button{
    background-color: black;
    color: white;
    border: none;
    cursor: pointer;
    line-height: 32px;
   height: 32px;
   width: 50%;
   position: absolute;
   right: 0;
   bottom: 0;
}



#contentZoneModalXXX section{
   margin-bottom: 40px;
}

#contentZoneModalXXX section.hero{
   margin-bottom: 20px;
}

#contentZoneModalXXX img{
   max-height: 300px;
   width: 100%;
   height: 100%;
   min-height: 120px;
   aspect-ratio: 13 / 7;
   filter: brightness(0.8);
   object-fit: cover;
   border-radius: 1rem;   
}

#contentZoneModalXXX hgroup h1{
   margin-bottom: 0;
}


section.is-section{
   padding: 10px;
}

section.is-section .footer{
   padding-top: 20px;
}

section.is-section .footer .secondary-message{
   color: #666;
   float: right;
}




/* Move the cover photo to centered */
.billboard-transparent .billboard-bg img{
   object-position: center;
}

[data-pattern='card'][data-variant='shaded']{
   transition: all 0.5s ease;
}
[data-pattern='card'][data-variant='shaded']:hover{

}

[data-pattern='card'] [data-slot='cta-text']:not([data-is="btn"]):hover,
[data-pattern='card'] [data-slot='title']:hover{
   text-decoration: underline;
}

[data-pattern='card'][data-card='content']{
   
   /* force heights to match */
   height: 100%;

   /* Helps dense cards breathe */
   min-height: 160px;
}

[data-pattern='card'][data-card='content'] [data-slot='media']{
   overflow: hidden;
}

[data-pattern='card'][data-card='content'] img{
   transition: transform 0.4s ease;
   filter: brightness(0.9);
}

[data-pattern='card'][data-card='content']:hover img{
   transform: scale(1.06);
   filter: brightness(1);
}

[data-pattern='card']:not([data-variant='event']) > [data-slot='footer'][data-variant='cta']{
   color: var(--color-primary);
}

[data-pattern='card'][data-card='content']:hover{
   cursor: pointer;
}

[data-pattern='card'] [data-slot='footer'] [data-slot='cta-text']{
   font-size: 15px;
}


[data-slot='media-badge']{
   filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.35));
}

[data-slot='media-badge'] [data-role='price']{
   font-size: x-small;
   font-weight: normal;
   line-height: 1.2;
}

[data-slot='media-badge'] [data-role='price'] strong{
   display: block;
   font-size: 16px;
}

[data-pattern='card'][data-card='content'] [data-slot='media'] [data-slot='media-badge']{
   background: rgb(0 36 72 / 75%);
   color: white;
   line-height: 12px;
   padding: 6px 12px;
   top: 4px;
   left: 4px;
   border-radius: 6px;  
}
[data-pattern="card"][data-card="vignette"] [data-slot='media']::after,
[data-pattern="card"][data-card="vignette"] [data-slot='media'] img,
[data-pattern="card"][data-card="vignette"]{
   transition: transform 0.4s ease;
   transition: all 0.4s ease;
}
[data-pattern="card"][data-card="vignette"]:hover [data-slot='media'] img{
   scale:  1.06;
}

[data-pattern="card"][data-card="vignette"]:hover [data-slot='media']::after{
   background: rgba(var(--billboard-bg-rgb), 0.6);
}


a.rys-slide.view-all-events {
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   text-decoration: none !important;
}


.cmodal main{
   display: flex;
   flex-direction: column;
}


#modal-tickets{
   margin-top: auto;
}

#modal-tickets rys-slider{
   margin-bottom: 12px;
}


#modal-tickets .is-body{
   padding-left: var(--gutter-size);
   padding-top: 16px;
   padding-bottom: 24px;
   border-top: 1px solid #0067ce17;
   background: linear-gradient(to bottom, rgb(194 213 233 / 20%) 0%, rgba(255, 255, 255, 1) 80%);
   margin-left: calc(clamp(1rem, 3vw, 1.5rem) * -1);
   margin-right: calc(clamp(1rem, 3vw, 1.5rem) * -1);
   margin-bottom: calc(var(--scene-gap) * -0.75);
   max-width: none;   
}

#modal-tickets .slider-footer{

   display: flex;
   gap: 0.5rem;
   color: var(--color-60);
   white-space: nowrap;
   overflow: hidden;
   height: 20px;   
   margin: 0px auto;
}

#modal-tickets .slider-footer li{
   display: flex;
   align-items: center;
   gap: 0.25rem;
   font-size: var(--size-content-detail);
   height: 20px;
   line-height: 20px;
   white-space: nowrap;
   flex-shrink: 0;   
}

#modal-tickets .slider-footer li:not(:first-child)::before {
   content: "•";
   margin-right: 0.5rem;
}

#modal-tickets .slider-footer i[data-icon="shield-check-outline"] {
   color: #008000;
}

#modal-tickets .is-body{
   display: flex;
   flex-direction: column;
   gap: 12px;
}

#modal-tickets .is-body .slider-footer-button [data-is='btn']{
   width: calc(100% - 16px);
}




/* Force the rail to overlap */
@media (min-width: 960px) {
   [data-layout='rail'] {
      margin-top: -100px;
      z-index: 5;
   }      
}



 .video-container{
   position: relative;
   padding-bottom: 56.25%;
   height: 0;
   overflow: hidden;
   max-width: 100%;
   border-radius: 6px;    
 }


 [data-id='meta']{
   padding: 16px;
   border-radius: 8px;
   background: #fdfdfd;
   border: 1px solid #E5E5E5;
   display: flex;
   flex-direction: column;
   gap: calc(var(--scene-gap) * 0.75);
   flex-wrap: wrap;    
 }


 @media (max-width: 959px) {
   [data-id='meta']{
      display: none;
   }
}




/* ─── Seating Areas Table ───────────────────────────────── */
.rys-container {
   max-width: 1000px;
   margin: 0 auto;
   background: var(--bg-color);
   border: 1px solid #e5e5e5;
   border-radius: 8px;
   box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}

.rys-table-head {
   display: flex;
   justify-content: space-between;
   padding: 12px 16px;
   border-bottom: 2px solid #e5e5e5;
   font-size: 13px;
   text-transform: uppercase;
   letter-spacing: 0.05em;
   font-weight: 600;
}
.th-mid {
   display: none;
}

/* ─── Row ───────────────────────────────────────────────── */
.rys-row {
   border-bottom: 1px solid #e5e5e5;
}
.rys-row:last-child {
   border-bottom: none;
}

.rys-row-header {
   display: grid;
   grid-template-columns: 1fr auto;
   grid-template-areas: "title price" "details price";
   align-items: center;
   padding: 16px;
   cursor: pointer;
   transition: background-color 0.2s ease;
   gap: 4px 16px;
}
.rys-row-header:hover {
   background-color: #f8fafc;
}

.rys-col-left {
   grid-area: title;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   gap: 4px;
}
.rys-col-mid {
   grid-area: details;
   font-size: 13px;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
}
.rys-col-right {
   grid-area: price;
   display: flex;
   align-items: center;
   justify-content: flex-end;
   gap: 8px;
   font-weight: 500;
   min-width: 80px;
}

/* ─── Row Body / Drawer ─────────────────────────────────── */
.rys-row-body {
   display: none;
   background-color: #f8fafc;
   border-top: 1px solid #f1f5f9;
}
.rys-row.is-expanded .rys-row-body {
   display: block;
}
.rys-drawer-content {
   padding: 16px;
}

/* ─── Chevron ───────────────────────────────────────────── */
.rys-chevron {
   width: 24px;
   height: 24px;
   display: flex;
   align-items: center;
   justify-content: center;
   border: 1px solid #e5e5e5;
   border-radius: 50%;
   transition: transform 0.3s;
   flex-shrink: 0;
}
.rys-row.is-expanded .rys-chevron {
   transform: rotate(180deg);
}

/* ─── Typography ────────────────────────────────────────── */
.rys-section-title {
   font-size: 16px;
   font-weight: bold;
}
.rys-price {
   font-size: 15px;
   font-weight: 600;
}

/* ─── Badges ────────────────────────────────────────────── */
.rys-badge {
   font-size: 11px;
   font-weight: 600;
   padding: 3px 8px;
   border-radius: 12px;
   display: inline-flex;
   align-items: center;
   gap: 4px;
}

.rys-badge [data-is='icon']{
   height: 12px;
   width: 12px;
}

.badge-marquee {
   background: var(--badge-marquee-bg);
   color: var(--badge-marquee-text);
}
.badge-rating {
   background: var(--badge-rating-bg);
   color: var(--badge-rating-text);
}
.badge-cool {
   background: var(--badge-cool-bg);
   color: var(--badge-cool-text);
}
.badge-deal {
   background: var(--badge-deal-bg);
   color: var(--badge-deal-text);
}

/* ─── Chips ─────────────────────────────────────────────── */
.rys-drawer-prompt {
   margin: 0 0 12px 0;
   font-size: 14px;
   font-weight: 600;
}
.rys-chip-scroll {
   display: flex;
   gap: 8px;
   overflow-x: auto;
   padding-bottom: 8px;
   scrollbar-width: none;
}
.rys-chip-scroll::-webkit-scrollbar {
   display: none;
}
.rys-chip {
   flex: 0 0 auto;
   background: #ffffff;
   border: 1px solid #e5e5e5;
   padding: 32px 16px;
   border-radius: 6px;
   font-size: 14px;
   font-weight: 500;
   cursor: pointer;
}
.rys-chip:hover {
   border-color: var(--blue-primary);
   color: var(--blue-primary);
}

/* ─── Skeleton ──────────────────────────────────────────── */
.skeleton {
   background: linear-gradient(90deg, #f3f4f6 25%, #e5e7eb 50%, #f3f4f6 75%);
   background-size: 200% 100%;
   animation: ui-skeleton-loading 1.5s infinite;
   border-radius: 4px;
}
.skeleton-price {
   width: 60px;
}
@keyframes ui-skeleton-loading {
   0%   { background-position: 200% 0; }
   100% { background-position: -200% 0; }
}

/* ─── Table Header ──────────────────────────────────────── */
.rys-table-head {
   display: flex;
   justify-content: space-between;
   padding: 12px 16px;
   border-bottom: 2px solid #e5e5e5;
   font-size: 13px;
   text-transform: uppercase;
   letter-spacing: 0.05em;
   font-weight: 600;
}
.th-mid {
   display: none;
}

/* ─── Row Header ────────────────────────────────────────── */
.rys-row-header {
   display: grid;
   grid-template-columns: 1fr auto;
   grid-template-areas: "title price" "details price";
   align-items: center;
   padding: 16px;
   cursor: pointer;
   transition: background-color 0.2s ease;
   gap: 4px 16px;
}
.rys-row-header:hover {
   background-color: #f8fafc;
}

/* ─── Columns ───────────────────────────────────────────── */
.rys-col-left {
   grid-area: title;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   gap: 4px;
   min-width: 0;
   padding-right: 12px;
}
.rys-section-title {
   font-size: 15px;
   font-weight: bold;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   width: 100%;
}

/* Details: mobile sits under title in grid-area "details" */
.rys-col-mid {
   grid-area: details;
   font-size: 13px;
   color: var(--color-80);
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   min-width: 0;
}

.rys-col-right {
   grid-area: price;
   display: flex;
   align-items: center;
   justify-content: flex-end;
   gap: 10px;
   flex-shrink: 0;
}

/* ─── Price ─────────────────────────────────────────────── */
.rys-price {
   font-size: 13px;
   font-weight: 600;
   white-space: nowrap;
}
.rys-price-unknown {
   font-size: 16px;
   line-height: 1;
}

/* ─── Chevron ───────────────────────────────────────────── */
.rys-chevron {
   width: 28px;
   height: 28px;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 50%;
   transition: transform 0.3s;
   flex-shrink: 0;
   border: 1px solid var(--color-primary);
}
.rys-row.is-expanded .rys-chevron {
   transform: rotate(180deg);
}

/* ─── Desktop ───────────────────────────────────────────── */
@media (min-width: 768px) {
   .rys-table-head {
       justify-content: flex-start;
       gap: 16px;
   }
   .th-mobile-only { display: none; }
   .th-left  { flex: 0 0 200px; }
   .th-mid   { 
       display: block; 
       flex: 1;
       padding-left: 2px;
   }
   .th-right { flex: 0 0 120px; text-align: right; }

   .rys-row-header {
       display: flex;
       align-items: center;
       gap: 16px;
   }
   .rys-col-left {
       flex: 0 0 200px;
       padding-right: 0;
   }
   .rys-col-mid {
       flex: 1;
       font-size: 13px;
       white-space: nowrap;
       overflow: hidden;
       text-overflow: ellipsis;
   }
   .rys-col-right {
       flex: 0 0 120px;
       justify-content: flex-end;
   }
}


:root {
   --badge-marquee-bg:  #f3e8ff;
   --badge-marquee-text: #7e22ce;

   --badge-rating-bg:  #ffe8d6;
   --badge-rating-text: #ff6600;

   --badge-cool-bg:    #d6eaff;
   --badge-cool-text:  #0067ce;

   --badge-deal-bg:    #dcfce7;
   --badge-deal-text:  #15803d;
}

/* ─── Event Rows (Bottom Sheet) ─────────────────────────── */
.rys-event-row {
   display: flex;
   justify-content: space-between;
   align-items: center;
   padding: 16px 20px;
   border-bottom: 1px solid var(--border-color);
   cursor: pointer;
   transition: background 0.2s;
}
.rys-event-row:last-child {
   border-bottom: none;
}
.rys-event-row:hover {
   background: #f8fafc;
}

.rys-event-info {
   display: flex;
   flex-direction: column;
   gap: 4px;
}
.rys-event-date {
   font-size: 13px;
   font-weight: 500;
}
.rys-event-name {
   font-size: 15px;
   font-weight: bold;
}

.rys-event-buy {
   display: flex;
   flex-direction: column;
   align-items: flex-end;
   gap: 2px;
   flex-shrink: 0;
   padding-left: 16px;
}
.rys-event-available {
   font-size: 14px;
   font-weight: 600;
}
.rys-event-cta {
   font-size: 12px;
}

/* ─── Group Children List ───────────────────────────────── */
.rys-group-list {
   display: flex;
   flex-direction: column;
}

.rys-group-item {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 12px 16px;
   border-bottom: 1px solid var(--border-color);
   cursor: pointer;
   transition: background 0.2s;
   gap: 12px;
}
.rys-group-item:last-child {
   border-bottom: none;
}
.rys-group-item:hover {
   background: #f8fafc;
}

.rys-group-item-left {
   display: flex;
   flex-direction: column;
   gap: 3px;
   min-width: 0;
}
.rys-group-item-left .rys-section-title {
   font-size: 14px;
}
.rys-group-item-details {
   font-size: 12px;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
}

.rys-group-item-right {
   display: flex;
   align-items: center;
   gap: 8px;
   flex-shrink: 0;
}
.rys-chevron-sm {
   display: flex;
   align-items: center;
   color: var(--color-60);
}

/* ─── Event type label ──────────────────────────────────── */
.rys-event-type-label {
   font-size: 11px;
   font-weight: 500;
}

/* Group summary text inside drawer */
.rys-group-summary {
   font-size: 13px;
   line-height: 1.5;
   padding: 4px 0 8px;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
}

/* Child rows slide in below their group — subtle indent */
.rys-row-child {
   border-left: 3px solid var(--border-color);
}

.rys-row.is-expanded > .rys-row-header {
   background: #f8fafc;
   border-left: 3px solid var(--color-primary);
}

.rys-row.is-expanded > .rys-row-body {
   border-left: 3px solid var(--color-primary);
}

.billboard-transparent{
   overflow: unset;
}
 /* =============================================================================
   SPOTLIGHT PATTERN
   data-pattern="spotlight"

   Slots:
     [data-slot="avatar"]     Icon container, top-aligned left
     [data-slot="body"]       Stacked title + details
     [data-slot="title"]      Bold headline
     [data-slot="details"]    Supporting copy
     [data-slot="cta"]        Button/link, right-anchored (optional)
     [data-slot="cta-footer"] Inline text CTA below body (alternative to cta slot)
   ============================================================================= */

[data-pattern="spotlight"] {
   display: flex;
   align-items: flex-start;
   gap: 16px;
   padding: 18px 24px 18px 20px;
   background: rgb(230, 249, 254);
   border-radius: 8px;
}

[data-pattern="spotlight"] [data-slot="avatar"] {
   flex-shrink: 0;
   width: 44px;
   height: 44px;
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   color: #0067CE;
}

[data-pattern="spotlight"] [data-slot="avatar"] [data-is="icon"] {
   height: 32px;
   width: 32px;
}

[data-pattern="spotlight"] [data-slot="body"] {
   flex: 1;
   min-width: 0;
   display: flex;
   flex-direction: column;
   gap: 3px;
}

[data-pattern="spotlight"] [data-slot="title"] {
   font-size: var(--size-title);
   font-weight: 700;
   margin: 0;
}

[data-pattern="spotlight"] [data-slot="details"] {
   color: var(--color-80);
   margin: 0;
}

[data-pattern="spotlight"] [data-slot="cta-footer"] {
   margin-top: 6px;
   font-size: 13px;
   font-weight: 600;
   color: #0067CE;
}

[data-pattern="spotlight"] [data-slot="cta-footer"] a,
[data-pattern="spotlight"] [data-slot="cta-footer"] button {
   color: inherit;
   background: none;
   border: none;
   padding: 0;
   cursor: pointer;
   font: inherit;
   text-decoration: none;
}

[data-pattern="spotlight"] [data-slot="cta-footer"] a:hover,
[data-pattern="spotlight"] [data-slot="cta-footer"] button:hover {
   text-decoration: underline;
}

[data-pattern="spotlight"] [data-slot="cta"] {
   flex-shrink: 0;
   align-self: center;
}

@media (max-width: 600px) {
   [data-pattern="spotlight"] {
       flex-wrap: wrap;
       gap: 12px;
   }

   [data-pattern="spotlight"] [data-slot="cta"] {
       width: 100%;
       align-self: unset;
   }

   [data-pattern="spotlight"] [data-slot="cta"] [data-is="btn"] {
       width: 100%;
       justify-content: center;
   }
}

/* Spotlight — deal variant */
.spotlight-deal [data-slot="avatar"] { color: #2a7a2a; }
.spotlight-deal [data-slot="title"]  { color: #2a7a2a; }

.spotlight-deal .btn-cta,
.spotlight-deal [data-slot="cta-footer"] button,
.spotlight-deal [data-slot="cta-footer"] a {
   background: #2a7a2a;
   color: #fff;
}

.spotlight-deal .btn-cta:hover,
.spotlight-deal [data-slot="cta-footer"] button:hover,
.spotlight-deal [data-slot="cta-footer"] a:hover {
   background: #235e23;
   text-decoration: none;
}

/* =============================================================================
   SPOTLIGHT PATTERN
   data-pattern="spotlight"
   ============================================================================= */

   [data-pattern="spotlight"] {
      display: flex;
      align-items: flex-start;
      gap: 16px;
      padding: 18px 24px 18px 20px;
      background: rgb(230, 249, 254);
      border-radius: 8px;
  }
  
  [data-pattern="spotlight"] [data-slot="avatar"] {
      flex-shrink: 0;
      width: 44px;
      height: 44px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #0067CE;
  }
  
  [data-pattern="spotlight"] [data-slot="avatar"] [data-is="icon"] {
      height: 32px;
      width: 32px;
  }
  
  [data-pattern="spotlight"] [data-slot="body"] {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 3px;
  }
  
  [data-pattern="spotlight"] [data-slot="title"] {
      font-size: var(--size-title);
      font-weight: 700;
      margin: 0;
  }
  
  [data-pattern="spotlight"] [data-slot="details"] {
      color: var(--color-80);
      margin: 0;
  }
  
  [data-pattern="spotlight"] [data-slot="cta-footer"] {
      margin-top: 6px;
      font-size: 13px;
      font-weight: 600;
      color: #0067CE;
  }
  
  [data-pattern="spotlight"] [data-slot="cta-footer"] a,
  [data-pattern="spotlight"] [data-slot="cta-footer"] button {
      color: inherit;
      background: none;
      border: none;
      padding: 0;
      cursor: pointer;
      font: inherit;
      text-decoration: none;
  }
  
  [data-pattern="spotlight"] [data-slot="cta-footer"] a:hover,
  [data-pattern="spotlight"] [data-slot="cta-footer"] button:hover {
      text-decoration: underline;
  }
  
  [data-pattern="spotlight"] [data-slot="cta"] {
      flex-shrink: 0;
      align-self: center;
  }
  
  @media (max-width: 600px) {
      [data-pattern="spotlight"] { flex-wrap: wrap; gap: 12px; }
      [data-pattern="spotlight"] [data-slot="cta"] { width: 100%; align-self: unset; }
      [data-pattern="spotlight"] [data-slot="cta"] [data-is="btn"] { width: 100%; justify-content: center; }
  }
  
  /* Spotlight — deal variant */
  .spotlight-deal [data-slot="avatar"] { color: #2a7a2a; }
  .spotlight-deal [data-slot="title"]  { color: #2a7a2a; }
  
  .spotlight-deal .btn-cta,
  .spotlight-deal [data-slot="cta-footer"] button,
  .spotlight-deal [data-slot="cta-footer"] a {
      background: #2a7a2a;
      color: #fff;
  }
  
  .spotlight-deal .btn-cta:hover,
  .spotlight-deal [data-slot="cta-footer"] button:hover,
  .spotlight-deal [data-slot="cta-footer"] a:hover {
      background: #235e23;
      text-decoration: none;
  }
  
  
  /* =============================================================================
     VENUE EVENT PANELS (vep)
     ============================================================================= */
  
  .vep {
      margin: 20px 0 24px;
  }
  
  /* --- Loaded wrapper ----------------------------------------------------------- */
  
  .vep__loaded {
      border: 1px solid #E5E5E5;
      border-radius: 8px;
      overflow: hidden;
      animation: vepFadeIn 0.2s ease both;
  }
  
  /* --- Header ------------------------------------------------------------------- */
  
  .vep__loaded-header {
      padding: 14px 18px 12px;
      border-bottom: 1px solid #E5E5E5;
  }
  
  /* Theme backgrounds */
  .vep__loaded--seats .vep__loaded-header { background: rgb(230, 249, 254); }
  .vep__loaded--deals .vep__loaded-header { background: #edf7ed; }
  
  .vep__loaded-title-row {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 4px;
  }
  
  .vep__loaded-icon {
      flex-shrink: 0;
      display: flex;
      align-items: center;
      color: #0067CE;
  }
  
  .vep__loaded--deals .vep__loaded-icon {
      color: #2a7a2a;
  }
  
  .vep__loaded-icon [data-is="icon"] {
      width: 20px;
      height: 20px;
  }
  
  .vep__loaded-label {
      font-size: var(--size-title);
      font-weight: 700;
      color: #0067CE;
      margin: 0;
      line-height: 1.2;
  }
  
  .vep__loaded--deals .vep__loaded-label {
      color: #2a7a2a;
  }
  
  .vep__loaded-event-meta {
      color: var(--color-80, #5a6a7a);
      line-height: 2;
      font-weight: 500;
  }
  
  /* --- Bucket label row (seats only) ------------------------------------------- */
  
  .vep__bucket-header {
      display: grid;
      grid-template-columns: 56px 1fr 80px auto 120px;
      gap: 12px;
      align-items: center;
      padding: 6px 18px;
      background: #F7F7F7;
      border-bottom: 1px solid #EBEBEB;
      font-size: 11px;
      font-weight: 600;
      color: var(--color-80, #888);
      text-transform: none;
      letter-spa3ing: 0;
  }
  
  /* --- Table rows --------------------------------------------------------------- */
  
  .vep__table {
      display: flex;
      flex-direction: column;
  }
  
  /*
   * Grid: photo | location | [score+price group] | cta
   * Score and price are siblings inside .vep__row-right so they
   * always align regardless of content width.
   */
  .vep__row {
      display: grid;
      grid-template-columns: 56px 35% auto 120px;
      column-gap: 16px;
      align-items: center;
      padding: 16px 18px;
      border-bottom: 1px solid #F0F0F0;
      cursor: pointer;
      transition: background 0.12s ease;
  }
  
  .vep__row:last-child {
      border-bottom: none;
  }
  
  .vep__row:hover {
      background: #FAFAFA;
  }
  
  /* Photo thumbnail */
  .vep__row-photo {
      width: 56px;
      height: 42px;
      border-radius: 4px;
      overflow: hidden;
      background: #F0F0F0;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
  }
  
  .vep__row-photo img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
  }
  
  .vep__row-photo--empty {
      color: #ccc;
      font-size: 18px;
  }
  
  /* Location block */
  .vep__row-location {
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 3px;
  }
  
  .vep__row-section {
      font-size: 15px;
      font-weight: 600;
      
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
  }
  
  .vep__row-sub {
      font-size: 13px;
      color: var(--color-80, #5a6a7a);
  }

  .vep__row-sub [data-is='icon']{
     height: 14px; width:14px;
  }
  
  .vep__row-attrs {
      display: flex;
      flex-wrap: wrap;
      gap: 4px;
      margin-top: 2px;
  }
  
  /* Badges */
  .vep__badge {
      display: inline-block;
      font-size: 11px;
      font-weight: 600;
      padding: 2px 7px;
      border-radius: 4px;
      white-space: nowrap;
  }
  
  .vep__badge--view {
      background: #EEF5FC;
      color: #0067CE;
  }
  
  .vep__badge--deal {
      background: #edf7ed;
      color: #1e5c1e;
  }
  
  /*
   * Score + price wrapper — keeps them as a paired unit so they
   * always align in the same column regardless of value widths.
   */
  .vep__row-right {
      display: flex;
      align-items: center;
      gap: 20px;
      justify-content: flex-end;
  }
  
  /* Score block */
  .vep__row-score {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 2px;
      white-space: nowrap;
      min-width: 80px;
  }
  
  .vep__row-score-val {
      font-size: 14px;
      font-weight: 700;
      
  }
  
  .vep__row-score-label {
      font-size: 11px;
      color: var(--color-80, #5a6a7a);
  }
  
  /* Price */
  .vep__row-price {
      font-size: 16px;
      font-weight: 700;
      white-space: nowrap;
      text-align: right;
      min-width: 52px;
      margin-left: auto;
  }
  
  /* CTA pill button — seats (blue) */
  .vep__row-cta {
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      height: 40px;
      padding: 0 16px;
      font-size: 13px;
      font-weight: 600;
      border-radius: 999px;
      border: none;
      background: #e6f9fe;
      color: #0067CE;
      cursor: pointer;
      white-space: nowrap;
      transition: background 0.12s ease, color 0.12s ease;
  }
  
  .vep__row-cta:hover {
      background: #cceefa;
      color: #0056b0;
  }
  
  /* CTA pill button — deals (green) */
  .vep--deals .vep__row-cta {
      background: #e6f7e6;
      color: #2a7a2a;
  }
  
  .vep--deals .vep__row-cta:hover {
      background: #c8eec8;
      color: #1e5c1e;
  }
  
  /* --- Footer ------------------------------------------------------------------- */
  
  .vep__loaded-footer {
      padding: 11px 18px;
      border-top: 1px solid #F0F0F0;
      display: flex;
      align-items: center;
      justify-content: space-between;
      background: #fff;
  }
  
  .vep__view-all {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      font-size: 13px;
      font-weight: 600;
      color: #0067CE;
      text-decoration: none;
  }
  
  .vep__view-all:hover {
      text-decoration: underline;
      color: #0056b0;
  }
  
  .vep__fee-note {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      font-size: 11px;
      color: var(--color-80, #888);
  }
  
  .vep__fee-note [data-is="icon"] {
      width: 12px;
      height: 12px;
      opacity: 0.6;
  }
  
  /* --- Animation ---------------------------------------------------------------- */
  
  @keyframes vepFadeIn {
      from { opacity: 0; transform: translateY(4px); }
      to   { opacity: 1; transform: translateY(0); }
  }
  
  /* --- Responsive --------------------------------------------------------------- */
  
  @media (max-width: 640px) {
      /*
       * Mobile grid: photo | [location+score stacked] | price | cta
       * Two rows: location top, score inline below it.
       * Price and CTA stay in their own columns, aligned to row 1 + spanning.
       */
      .vep__row {
          grid-template-columns: 48px 1fr auto 96px;
          grid-template-rows: auto auto;
          column-gap: 12px;
          row-gap: 4px;
          align-items: start;
      }
  
      /* Photo spans both rows */
      .vep__row-photo {
          width: 48px;
          height: 36px;
          grid-column: 1;
          grid-row: 1 / 3;
          align-self: center;
      }

      .vep__row {
         grid-template-columns: 1fr auto 96px;
     }
     .vep__row-photo {
         display: none;
     }      

     
  
      /* Location: row 1, col 2 */
      .vep__row-location {
          grid-column: 2;
          grid-row: 1;
      }
  
      /*
       * Score: row 2, col 2 — inline (row) directly under location text.
       * Pull .vep__row-right apart on mobile so score sits under location.
       */
      .vep__row-right {
          display: contents; /* dissolve the wrapper on mobile */
      }
  
      .vep__row-score {
          grid-column: 2;
          grid-row: 2;
          flex-direction: row;
          align-items: baseline;
          gap: 4px;
          min-width: 0;
      }
  
      .vep__row-score-val  { font-size: 12px; }
      .vep__row-score-label { font-size: 11px; }
  
      /* Price: col 3, row 1, aligned right */
      .vep__row-price {
          grid-column: 3;
          grid-row: 1;
          font-size: 14px;
          align-self: center;
          text-align: right;
      }
  
      /* CTA: col 4, spans both rows, centered */
      .vep__row-cta {
          grid-column: 4;
          grid-row: 1 / 3;
          height: 36px;
          padding: 0 10px;
          font-size: 12px;
          align-self: center;
      }
  
      .vep__bucket-header { display: none; }



      .vep__row {
         grid-template-columns: 1fr auto 96px;
     }
     .vep__row-photo { display: none; }
     .vep__row-location { grid-column: 1; }  /* reset to col 1 */
     .vep__row-score    { grid-column: 1; }  /* same */
     .vep__row-price    { grid-column: 2; margin-top: 20px;}
     .vep__row-cta      { grid-column: 3; }

  }