/* Variables setting for bootstrap */
/* The following vars default to $body-bg in bootstrap, which we don't want */
#seatingplan {
  height: 600px; }

.full-screen-seating .panel-heading {
  display: none; }

.full-screen-seating .panel-body {
  padding: 0;
  height: 100vh;
  box-sizing: border-box; }

.full-screen-seating .panel {
  border: 0;
  margin: 0; }

.full-screen-seating #seatingplan, .full-screen-seating #seatingplan > div, .full-screen-seating #seatingplan > div > div {
  height: 100%; }

.full-screen-seating .has-vouchers .panel-body {
  padding-bottom: 64px; }

.full-screen-seating .voucher-row {
  margin-top: 10px;
  position: absolute;
  bottom: 0;
  height: 64px;
  width: 100%;
  box-sizing: border-box;
  padding: 15px 0; }
  .full-screen-seating .voucher-row .col-xs-9 {
    padding-left: 0; }
  .full-screen-seating .voucher-row .col-xs-3 {
    padding-right: 0; }
  .full-screen-seating .voucher-row .voucher-toggle a {
    line-height: 34px;
    font-size: 18px;
    padding: 0 15px;
    display: block; }

@media (max-width: 800px) {
  .full-screen-seating .panel-body {
    height: auto; }
  .full-screen-seating .has-vouchers .panel-body {
    padding-bottom: 0; }
  .full-screen-seating .voucher-row {
    display: none; }
  #seatingplan {
    height: auto;
    min-height: 200px; } }

pretix-seating-plan,
pretix-seating-cart,
pretix-seating-checkout-button {
  display: block; }

/* pretix-seating-cart */
pretix-seating-cart article {
  margin-top: 1.5em;
  margin-bottom: 1.5em;
  line-height: 1.42857; }
  pretix-seating-cart article .seating-item-name {
    position: relative;
    display: flex;
    justify-content: space-between;
    margin-bottom: 0; }
    pretix-seating-cart article .seating-item-name .fa-ticket {
      margin-left: .5em; }
    pretix-seating-cart article .seating-item-name h4 {
      font-size: 100%;
      font-weight: bold;
      margin: 0;
      line-height: inherit; }
    pretix-seating-cart article .seating-item-name button {
      display: inline;
      padding: 0 .5em;
      color: var(--pretix-brand-danger);
      line-height: 1; }
  pretix-seating-cart article .seating-item-price,
  pretix-seating-cart article .seating-item-seat,
  pretix-seating-cart article .seating-item-description,
  pretix-seating-cart article .seating-item-variation,
  pretix-seating-cart article .seating-item-variation-description {
    color: #737373; }
  pretix-seating-cart article p {
    margin: 0;
    line-height: inherit; }
  pretix-seating-cart article ins {
    color: var(--pretix-brand-success-shade-25);
    font-size: 18px;
    font-weight: bold;
    text-decoration: none; }

pretix-seating-cart article + article {
  border-top: 1px solid #e5e5e5;
  padding-top: 1.5em; }

pretix-seating-cart .seating-cart-hint {
  color: #737373;
  font-style: italic;
  text-align: center;
  padding: 1.5em 0; }

/* pretix styles */
.panel-seating .panel-body {
  padding: 0; }

.seating-wrapper {
  position: relative; }
  .seating-wrapper .seatingplan-loading {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -75px;
    margin-left: -75px;
    -webkit-animation: fa-spin 8s infinite linear;
    animation: fa-spin 8s infinite linear;
    font-size: 150px;
    color: #eee; }
  .seating-wrapper .seating-soldout {
    z-index: 10;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.8); }
  .seating-wrapper .seating-soldout[hidden] {
    display: none; }
  .seating-wrapper .seating-soldout p {
    color: #737373;
    background-color: #fff;
    border: 2px solid #737373;
    border-radius: var(--pretix-border-radius-base);
    font-weight: bold;
    padding: .25em .5em;
    font-size: 125%; }

.seating-is-soldout > *:not(.seating-soldout) {
  pointer-events: none; }

.full-screen-seating .seating-soldout {
  position: fixed; }

body:not(.full-screen-seating) .seating-is-soldout {
  max-height: 16em;
  overflow: hidden; }

#seating-plan-area {
  display: flex;
  flex-direction: column;
  height: 64vh;
  max-height: 90vh; }
  #seating-plan-area pretix-seating-plan {
    flex: 1;
    z-index: 10;
    --brand-danger: var(--pretix-brand-danger);
    --text-muted: #737373;
    --border-radius: var(--pretix-border-radius-base);
    --border-color: rgba(0,0,0,.42); }

.voucher-row-wc {
  padding-bottom: 15px; }
  .voucher-row-wc summary {
    display: inline; }
    .voucher-row-wc summary .btn-link {
      padding: 0; }

/* move scrolling to body.full-screen-seating so mobile browsers do not go havock with browser-chrome changes on scrolling and one-finger-panning */
html:has(.full-screen-seating) {
  height: 100%;
  overflow: hidden; }

.full-screen-seating {
  scroll-behavior: smooth;
  height: 100vh;
  height: 100dvh;
  overflow-y: auto; }
  .full-screen-seating.scroll-snap-mandatory {
    scroll-snap-type: y mandatory; }
    .full-screen-seating.scroll-snap-mandatory #seating-plan-area,
    .full-screen-seating.scroll-snap-mandatory #seating-checkout-area {
      scroll-snap-align: start; }
  .full-screen-seating .seating-wrapper {
    height: auto;
    margin: 0;
    padding: 0; }
  .full-screen-seating #seating-plan-area,
  .full-screen-seating #seating-checkout-area {
    height: 100vh;
    height: 100dvh;
    max-height: none; }
  .full-screen-seating #seating-checkout-area {
    overflow-y: auto; }
    .full-screen-seating #seating-checkout-area #seating-change-link,
    .full-screen-seating #seating-checkout-area pretix-seating-checkout-button {
      background: #fff;
      background: rgba(255, 255, 255, 0.8);
      position: sticky;
      padding: 15px;
      z-index: 10; }
    .full-screen-seating #seating-checkout-area #seating-change-link {
      top: 0;
      background: linear-gradient(180deg, white 0%, white 50%, rgba(255, 255, 255, 0.5) 90%, rgba(255, 255, 255, 0) 100%); }
    .full-screen-seating #seating-checkout-area pretix-seating-checkout-button {
      padding-top: 5em;
      bottom: 0;
      background: linear-gradient(0deg, white 0%, white 50%, rgba(255, 255, 255, 0.5) 90%, rgba(255, 255, 255, 0) 100%); }
    .full-screen-seating #seating-checkout-area pretix-seating-cart {
      padding: 0 15px; }
  .full-screen-seating #seating-options-link {
    padding: 15px;
    margin: 0; }
  .full-screen-seating .voucher-row-wc {
    padding-left: 15px;
    padding-right: 15px; }

body:not(.full-screen-seating) #seating-options-link,
body:not(.full-screen-seating) #seating-change-link {
  display: none; }

/* match break-point in bootstrap */
@media (max-width: 991px) {
  /* on mobile remove panel border around selected seats and move it to plan only */
  .panel-seating:not(:has(.seating-is-soldout)) {
    border: none;
    box-shadow: none; }
    .panel-seating:not(:has(.seating-is-soldout)) pretix-seating-plan {
      border: 1px solid #e5e5e5; }
  #seating-plan-area .voucher-row-wc {
    display: none; }
  .full-screen-seating .panel-seating pretix-seating-plan {
    border: none; }
  .full-screen-seating #seating-checkout-area .voucher-row-wc {
    display: none; }
  .full-screen-seating #seating-plan-area .voucher-row-wc {
    display: block; } }

/* match break-point in bootstrap for .col-md */
@media (min-width: 992px) {
  /* make plan & area two column with button sticky at the bottom and checkout-area scrollable */
  .seating-wrapper {
    display: flex;
    align-items: stretch;
    align-content: stretch;
    height: 64vh;
    max-height: 90vh;
    overflow: hidden;
    transition: max-height .25s; }
  #seating-plan-area {
    width: 66%;
    /* match width with bootstrap 2/3 column + add grid-gap of 15px so shadow of checkout-area can overlay plan */
    width: calc(0.6666667 * (100% - 15px) + 15px); }
  #seating-checkout-area {
    flex: 1;
    padding: 0 15px;
    overflow-y: auto;
    min-height: 100%;
    position: relative;
    box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.5);
    display: flex;
    flex-direction: column; }
    #seating-checkout-area pretix-seating-cart {
      flex: 1; }
    #seating-checkout-area pretix-seating-checkout-button {
      position: absolute;
      position: sticky;
      left: 0;
      bottom: 0;
      width: 100%;
      padding: 2em 0 15px;
      background-color: #fff;
      background-color: rgba(255, 255, 255, 0.8); }
  #seating-options-link,
  #seating-change-link {
    display: none; }
  #seating-plan-area .voucher-row-wc {
    display: none; }
  .full-screen-seating .seating-wrapper {
    height: 100vh;
    height: 100dvh;
    max-height: none; }
  .full-screen-seating #seating-plan-area,
  .full-screen-seating #seating-checkout-area {
    height: 100%;
    max-height: none;
    box-shadow: none; } }
