/* Shared public-facing visual system: ticketing, status, payments and rentals. */
.shop-page,
.auth-page {
  min-height: 100vh;
  background:
    radial-gradient(circle at 6% 5%, rgba(200, 70, 63, .12), transparent 30rem),
    radial-gradient(circle at 95% 12%, rgba(92, 137, 132, .1), transparent 32rem),
    linear-gradient(145deg, #f8f5f4 0%, #eef2f1 52%, #f4eeee 100%) !important;
  background-attachment: fixed !important;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.shop-header {
  top: 12px !important;
  width: calc(100% - 28px);
  min-height: 68px !important;
  margin: 12px auto 0;
  padding: 9px 14px !important;
  border: 1px solid rgba(255, 255, 255, .72) !important;
  border-radius: 18px;
  background: rgba(255, 255, 255, .74) !important;
  box-shadow: 0 18px 46px rgba(57, 41, 44, .09);
  backdrop-filter: blur(22px) saturate(140%);
}

.shop-brand img {
  width: 44px !important;
  height: 44px !important;
  padding: 2px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .8);
}

.shop-main,
.occupancy-main,
.rental-request-main {
  width: calc(100% - 28px) !important;
  max-width: none !important;
  padding: 36px 18px 64px !important;
}

.shop-intro,
.occupancy-head,
.rental-request-head {
  padding: 8px 4px 22px;
  border-bottom: 1px solid rgba(72, 55, 55, .1);
}

.shop-intro {
  max-width: 900px !important;
}

.shop-intro h1,
.occupancy-head h1,
.rental-request-head h1 {
  letter-spacing: -.04em !important;
}

.shop-event-list {
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .72) !important;
  border-radius: 16px;
  background: rgba(255, 255, 255, .64);
  box-shadow: 0 14px 34px rgba(57, 41, 44, .065);
}

.shop-event-row {
  min-height: 96px !important;
  padding: 10px 18px;
  border-bottom-color: rgba(72, 55, 55, .09) !important;
}

.shop-event-row:hover {
  background: rgba(255, 255, 255, .92) !important;
}

.shop-event-row time strong {
  font-size: 1.65rem !important;
}

.shop-event-detail {
  grid-template-columns: minmax(300px, .68fr) minmax(520px, 1.32fr) !important;
  gap: clamp(28px, 4vw, 64px) !important;
  max-width: 1600px;
}

.shop-event-detail.is-info-only {
  display: block;
  width: 100%;
  max-width: 1100px;
  margin-inline: auto;
}

.shop-event-detail.is-info-only .shop-event-summary {
  position: static;
}

.shop-event-summary {
  top: 100px !important;
}

.shop-order-panel,
.order-status-card,
.payment-summary,
.payment-widget-panel {
  border-color: rgba(255, 255, 255, .74) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, .72) !important;
  box-shadow: 0 18px 44px rgba(57, 41, 44, .085) !important;
  backdrop-filter: blur(18px) saturate(125%);
}

.shop-order-panel input,
.shop-order-panel select,
.shop-order-panel textarea,
.rental-request-form input,
.rental-request-form select,
.rental-request-form textarea {
  min-height: 46px;
  border-color: rgba(72, 55, 55, .14) !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, .84) !important;
}

.shop-order-choice label,
.shop-ticket-categories,
.shop-ticket-categories label,
.seat-picker {
  border-color: rgba(72, 55, 55, .1) !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, .6) !important;
}

.shop-submit,
.order-primary-action {
  min-height: 48px;
  border-radius: 10px !important;
  box-shadow: 0 10px 24px rgba(200, 70, 63, .18);
}

.order-status-page,
.payment-main {
  width: min(920px, calc(100% - 28px)) !important;
  max-width: none !important;
  padding-top: 40px !important;
}

.payment-main {
  gap: 18px !important;
}

.rental-request-head {
  grid-template-columns: minmax(0, 1.6fr) minmax(280px, .6fr) !important;
}

.rental-request-head aside,
.rental-request-form > section,
.rental-request-submit,
.rental-request-success {
  border-color: rgba(255, 255, 255, .74) !important;
  border-radius: 17px !important;
  background: rgba(255, 255, 255, .7) !important;
  box-shadow: 0 14px 34px rgba(57, 41, 44, .065) !important;
  backdrop-filter: blur(17px) saturate(125%);
}

.rental-request-form > section {
  grid-template-columns: minmax(220px, 260px) minmax(0, 1fr) !important;
  gap: clamp(24px, 3vw, 48px) !important;
  padding: clamp(22px, 2.5vw, 36px) !important;
}

.rental-request-form section > header {
  position: sticky;
  top: 98px;
  height: max-content;
}

.rental-request-submit {
  position: sticky;
  z-index: 10;
  bottom: 10px;
  padding: 13px 16px !important;
}

.public-calendar-nav,
.month-toolbar,
.occupancy-calendar {
  border-color: rgba(255, 255, 255, .72) !important;
  border-radius: 15px !important;
  background-color: rgba(255, 255, 255, .68) !important;
  box-shadow: 0 12px 30px rgba(57, 41, 44, .065) !important;
  backdrop-filter: blur(16px) saturate(125%);
}

.occupancy-day {
  background: rgba(255, 255, 255, .72) !important;
}

.occupancy-day.outside {
  background: rgba(247, 245, 245, .68) !important;
}

.auth-card {
  border: 1px solid rgba(255, 255, 255, .76) !important;
  border-radius: 20px !important;
  background: rgba(255, 255, 255, .78) !important;
  box-shadow: 0 24px 64px rgba(57, 41, 44, .12) !important;
  backdrop-filter: blur(22px) saturate(135%);
}

.auth-card input,
.auth-card select {
  border-radius: 10px !important;
}

@media (max-width: 900px) {
  .shop-event-detail,
  .rental-request-head,
  .rental-request-form > section {
    grid-template-columns: 1fr !important;
  }

  .shop-event-summary,
  .rental-request-form section > header {
    position: static;
  }
}

@media (max-width: 650px) {
  .shop-header,
  .shop-main,
  .occupancy-main,
  .rental-request-main {
    width: calc(100% - 20px) !important;
  }

  .shop-header {
    top: 8px !important;
    margin-top: 8px;
  }

  .shop-main,
  .occupancy-main,
  .rental-request-main {
    padding: 26px 0 48px !important;
  }

  .shop-event-row {
    padding: 12px;
  }

  .rental-request-submit {
    position: static;
  }
}

/* Mobile public journey */
.shop-order-submit-bar{margin-top:20px}.shop-order-submit-bar .shop-order-total,.shop-order-submit-bar .shop-submit{margin-top:0}.shop-order-submit-bar .shop-submit{margin-top:14px}
.shop-page :is(a,button,input,select,textarea,summary):focus-visible{outline:3px solid rgba(200,70,63,.32);outline-offset:2px}
@media(max-width:720px){
  html,body{max-width:100%;overflow-x:clip}
  .shop-page{background-attachment:scroll!important}
  .shop-header{position:relative;top:auto!important;align-items:stretch;flex-direction:column;gap:8px;width:calc(100% - 16px)!important;min-height:0!important;margin-top:8px;padding:9px!important}
  .shop-brand{min-width:0;gap:9px;padding-inline:3px}.shop-brand img{width:38px!important;height:38px!important;flex:0 0 38px}.shop-brand span{min-width:0}.shop-brand small{overflow:hidden;max-width:none;font-size:.72rem;text-overflow:ellipsis;white-space:nowrap}
  .public-calendar-nav{width:100%;padding:3px;box-shadow:none!important}.public-calendar-nav a{display:grid;min-height:42px;padding:9px 8px;place-items:center}
  .shop-main,.occupancy-main,.rental-request-main,.order-status-page{width:calc(100% - 16px)!important;padding-top:20px!important;padding-bottom:40px!important}
  .shop-intro{margin-bottom:14px;padding:4px 4px 16px}.shop-intro h1,.occupancy-head h1,.rental-request-head h1{font-size:clamp(1.85rem,9vw,2.5rem);line-height:1.02}
  .shop-event-list{border-radius:13px}
  .shop-event-row,.shop-event-row.has-image{grid-template-columns:52px minmax(0,1fr);gap:10px 12px;min-height:0!important;padding:14px 12px}
  .shop-event-row.has-image .shop-event-thumb{grid-column:1;grid-row:1/span 2;width:52px;aspect-ratio:3/4}
  .shop-event-row.has-image time{grid-column:2;grid-row:1;grid-template-columns:auto 1fr;align-items:baseline;justify-self:start;gap:5px;text-align:left}
  .shop-event-row:not(.has-image) time{grid-column:1;grid-row:1/span 2}.shop-event-row time strong,.shop-event-row.has-image time strong{font-size:1.35rem!important}
  .shop-event-row-main,.shop-event-row.has-image .shop-event-row-main{grid-column:2;min-width:0}.shop-event-row-main strong{overflow-wrap:anywhere;font-size:1.05rem;line-height:1.2}.shop-event-row-main small{line-height:1.35}
  .shop-event-action,.shop-event-row.has-image .shop-event-action{grid-column:2;justify-self:start;font-size:.78rem}
  .shop-back{display:inline-flex;min-height:42px;align-items:center}.shop-event-detail{width:100%;min-width:0;grid-template-columns:minmax(0,1fr)!important;gap:18px!important;margin-top:8px}.shop-event-detail>*{min-width:0;max-width:100%}.shop-event-hero{margin-bottom:16px}.shop-event-hero img{max-height:min(68vh,600px)}
  .shop-event-summary h1{max-width:100%;font-size:clamp(1.8rem,9vw,2.35rem);overflow-wrap:anywhere;word-break:normal}.shop-event-date{margin-top:16px}.shop-description{max-width:100%;margin:18px 0;overflow-wrap:anywhere;line-height:1.58}
  .shop-order-panel,.order-status-card,.payment-summary,.payment-widget-panel{width:100%;min-width:0;max-width:100%;padding:18px 14px!important;border-radius:14px!important}
  .shop-order-panel input,.shop-order-panel select,.shop-order-panel textarea,.reservation-self-service input,.rental-request-form input,.rental-request-form select,.rental-request-form textarea{min-height:48px;font-size:16px}
  .shop-ticket-categories{padding:9px}.shop-ticket-categories>div{display:grid;gap:3px}.shop-ticket-categories label{grid-template-columns:minmax(0,1fr) 70px;min-height:64px;padding:9px 10px}.shop-ticket-categories label span{min-width:0}
  .seat-picker-head{align-items:stretch;flex-direction:column;gap:7px}.seat-picker-head>span{display:grid;min-height:38px;place-items:center}.seat-picker-head>strong{line-height:1.35}
  .seat-picker-graphic{display:grid!important;width:100%;min-width:0;max-width:100%;max-height:none;grid-template-columns:28px max-content!important;padding:12px 8px 14px!important;overflow-x:auto;overflow-y:visible;justify-content:start;contain:inline-size;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:rgba(92,112,110,.35) transparent;touch-action:pan-x pan-y}
  .seat-picker-graphic .seat-row>strong{position:sticky;z-index:2;left:0;display:grid;width:28px;min-height:40px;place-items:center;border-radius:7px;color:#657277;background:rgba(248,250,249,.96)}
  .seat-row>div{gap:5px}.seat-row .seat-option,.seat-row .seat-option span{width:34px}.seat-row .seat-option{flex-basis:34px}.seat-row .seat-option span{min-height:40px;height:40px;border-radius:8px;font-size:.78rem;font-weight:800;box-shadow:0 2px 5px rgba(41,58,60,.04)}.seat-aisle{width:11px;flex-basis:11px}
  .seat-picker-head strong.mismatch{color:#93611b!important}.seat-picker-head strong:not(.mismatch){color:#2f6b5d}
  .shop-code-box{padding:12px}.shop-code-box>div{align-items:stretch;flex-direction:column}.shop-code-box button{min-height:46px}.shop-order-choice label{min-height:62px}.shop-order-choice input{width:22px;height:22px;flex:0 0 22px}
  .shop-order-submit-bar{position:sticky;z-index:12;bottom:max(8px,env(safe-area-inset-bottom));margin:20px -6px -8px;padding:10px;border:1px solid rgba(72,55,55,.12);border-radius:13px;background:rgba(255,255,255,.94);box-shadow:0 14px 32px rgba(57,41,44,.16);backdrop-filter:blur(18px) saturate(130%)}
  .shop-order-submit-bar .shop-order-total{padding-top:0;border-top:0}.shop-order-submit-bar .shop-order-total>span{min-width:0}.shop-order-submit-bar .shop-order-total>strong{flex:0 0 auto;font-size:1.25rem}.shop-order-submit-bar .shop-submit{min-height:50px;margin-top:9px}
  .order-status-card{text-align:left}.order-event-meta{justify-content:flex-start}.order-summary-lines div{align-items:flex-start}.order-summary-lines div>*{min-width:0}.order-summary-lines div>strong{max-width:66%;overflow-wrap:anywhere;text-align:right}
  .order-primary-action,.reservation-self-service .primary-button,.reservation-self-service .danger-button{display:grid;min-height:48px;width:100%;place-items:center;text-align:center}.reservation-self-service summary{min-height:48px;padding-block:13px}
  .payment-main{width:calc(100% - 16px);margin:20px auto 40px}
  .occupancy-head{gap:18px;margin-bottom:18px}.occupancy-head-actions{gap:12px}.occupancy-head-actions .primary-button{display:grid;min-height:48px;place-items:center}.occupancy-legend{gap:8px}.occupancy-legend span{font-size:.72rem}
  .month-toolbar{position:sticky;z-index:8;top:8px}.month-toolbar>a,.month-toolbar>.month-nav-disabled{height:52px}.occupancy-day{grid-template-columns:50px minmax(0,1fr)}.room-statuses{gap:6px}.room-status{min-height:48px;justify-content:center}
}
@media(max-width:390px){
  .shop-event-row,.shop-event-row.has-image{grid-template-columns:46px minmax(0,1fr);padding-inline:10px}.shop-event-row.has-image .shop-event-thumb{width:46px}
  .shop-order-panel,.order-status-card,.payment-summary,.payment-widget-panel{padding-inline:12px!important}.shop-order-total{align-items:flex-start;gap:8px}.shop-order-total b{font-size:.8rem}.occupancy-legend{justify-content:flex-start!important;flex-wrap:wrap}
}
