*, *:before, *:after{
box-sizing:border-box;
}

body{
margin:0;
padding:0;
font-family:Arial, sans-serif;
}

:root{
/* Update these to resize all seat/control boxes from one place */
--seat-box-size:16px;
--seat-box-padding:4px;
--seat-box-margin-x:2px;
--seat-box-font-size:10px;
--seat-header-cell-size:calc(var(--seat-box-size) + (var(--seat-box-padding) * 2) + 2px);
--seat-row-header-width:calc((var(--seat-box-size) * 4) + (var(--seat-box-padding) * 4) + 4px);
--seat-col-header-height:calc((var(--seat-box-size) * 4) + (var(--seat-box-padding) * 4) + 4px);
--designer-panel-width:390px;
--designer-panel-bg:#eef2f7;
--designer-canvas-bg:#ffffff;
--designer-form-height:260px;
--design-scrollbar-clearance:18px;
}

.seat-row{
text-align:center;
font-size:0;
line-height:0;
}

.must-show{
display:block !important;
}

.blank-row{
padding-bottom:0;
text-align:right;
font-size:0;
line-height:0;
}

.row-selector, .row-deselector, .col-selector, .col-deselector, .seat-all-toggle, .seat-all-toggled{
font-size:var(--seat-box-font-size);
font-family:Arial, sans-serif;
height:var(--seat-header-cell-size);
width:var(--seat-header-cell-size);
border:1px solid #000;
background:gray;
color:#fff;
display:inline-block;
*display: inline;
zoom: 1;
margin:var(--seat-box-margin-x);
padding:var(--seat-box-padding);
cursor:pointer;
text-align:center;
line-height:var(--seat-box-size);
vertical-align:top;
}

.row-selector,.row-deselector{
float:left;
}

.row-selector, .row-deselector, .seat-all-toggle, .seat-all-toggled{
width:var(--seat-row-header-width);
}

.blank-row .col-selector, .blank-row .col-deselector{
height:var(--seat-col-header-height);
display:inline-flex;
align-items:center;
justify-content:center;
line-height:1;
padding:2px;
}

.blank-row .seat-all-toggle, .blank-row .seat-all-toggled{
height:var(--seat-col-header-height);
display:inline-flex;
align-items:center;
justify-content:center;
line-height:1;
padding:2px;
}

.row-selector.has-custom-title, .row-deselector.has-custom-title, .col-selector.has-custom-title, .col-deselector.has-custom-title{
background:#ead9d9;
color:maroon;
}

.layout-title-text{
display:block;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}

.blank-row .col-selector .layout-title-text, .blank-row .col-deselector .layout-title-text{
display:inline-block;
white-space:nowrap;
overflow:visible;
text-overflow:clip;
transform:rotate(-90deg);
transform-origin:center center;
}

.layout-title-custom{
color:maroon;
font-weight:bold;
}

.layout-title-empty{
color:transparent;
}


.seat, .seatc{
font-size:var(--seat-box-font-size);
font-family:Arial, sans-serif;
height:calc(var(--seat-box-size) + (var(--seat-box-padding) * 2) + 2px);
width:calc(var(--seat-box-size) + (var(--seat-box-padding) * 2) + 2px);
border:1px solid gray;
display:inline-block;
*display: inline;
zoom: 1;
margin:var(--seat-box-margin-x);
padding:var(--seat-box-padding);
cursor:pointer;
background-size: 20px;
vertical-align:top;
}

.seat input{
display:none;
}

.selected{
	background-image:url('images/correct.png') !important;
	background-position: center center;
	background-repeat:no-repeat;
	background-size:20px !important;
}

 .selectable .seat{
border:1px solid #0c70a5;
background-color:gold;
}

 .deselectable .seat{
border:1px solid #0c70a5;
background-color:gold;
}

.seat:hover, .seat-hovered, .all-hovered .seat{
background-color:gold !important;
}

.selected:hover{
border:1px solid #000;
background-color:gold;
}

.seat-input{
width:100%;
overflow:hidden;
bottom:0;
position:fixed;
border-top:1px solid gray;
background:#eee;
z-index: 1;
}

.seat-grid{
/* border:1px solid gray; */
margin:0 auto;
background-image:none;
background-repeat:no-repeat;
background-position:center top;
background-size:contain;
position:relative;
isolation:isolate;
}

.seat-grid-overlay{
position:absolute;
left:0;
top:0;
z-index:0;
pointer-events:none;
}

.seat-grid-overlay-svg{
display:block;
width:100%;
height:100%;
}

.seat-grid > .blank-row,
.seat-grid > .seat-row{
position:relative;
z-index:1;
}

.seat-administration{
overflow-x:auto;
overflow-y:auto;
max-width:100%;
-webkit-overflow-scrolling:touch;
position:relative;
box-sizing:border-box;
padding-left:var(--design-scrollbar-clearance);
padding-top:var(--design-scrollbar-clearance);
padding-right:var(--design-scrollbar-clearance);
padding-bottom:var(--design-scrollbar-clearance);
}

/* perfect-scrollbar always-visible style (from example) */
.seat-administration.always-visible.ps-container > .ps-scrollbar-x-rail,
.seat-administration.always-visible.ps-container > .ps-scrollbar-y-rail {
opacity: 0.6;
}

.seat-spacer{
height:150px;
}

/* designer page pane sizing and independent scroll areas */
#seat-data-poster{
display:flex;
align-items:stretch;
height:100vh;
overflow:hidden;
background:#e8edf4;
}

#seat-data-poster .seat-input{
order:2;
position:relative;
bottom:auto;
width:var(--designer-panel-width);
min-width:340px;
max-width:460px;
height:100vh;
overflow-y:auto;
overflow-x:hidden;
border-top:0;
border-left:1px solid #cfd8e3;
background:var(--designer-panel-bg);
padding:12px;
box-shadow:inset 1px 0 0 #fff;
display:flex;
flex-direction:column;
gap:9px;
scrollbar-gutter:stable;
}

#seat-data-poster .seat-grid{
margin:0;
}

#seat-data-poster .seat-administration{
order:1;
flex:1 1 auto;
min-width:0;
height:100vh;
background:var(--designer-canvas-bg);
}

#seat-data-poster .seat-spacer{
display:none;
}

#seat-data-poster .seat-option-set{
float:none;
width:auto;
padding:12px;
margin:0;
background:#fff;
border:1px solid #d8e0ea;
border-radius:12px;
box-shadow:0 1px 3px rgba(15, 23, 42, 0.08);
}

#seat-data-poster .seat-option-set > p:first-child{
margin:0 0 9px 0;
padding-bottom:7px;
border-bottom:1px solid #e2e8f0;
}

#seat-data-poster .seat-option-set > p:first-child b{
display:block;
font:700 13px Arial, sans-serif;
letter-spacing:0.2px;
}

#seat-data-poster .seat-option-set p{
margin:0 0 7px 0;
}

#seat-data-poster .seat-option-set p:last-child{
margin-bottom:0;
}

#seat-data-poster .seat-option-set b{
color:#1e3247;
}

#seat-data-poster .seat-option-set input[type="text"],
#seat-data-poster .seat-option-set input[type="number"],
#seat-data-poster .seat-option-set input[type="file"],
#seat-data-poster .seat-option-set select{
width:100%;
max-width:none;
height:30px;
padding:0 7px;
border:1px solid #b9c6d6;
border-radius:7px;
font:12px Arial, sans-serif;
background:#fff;
transition:border-color 0.15s ease, box-shadow 0.15s ease;
}

#seat-data-poster .seat-option-set input[type="file"]{
height:auto;
padding:4px;
}

#seat-data-poster .seat-option-set input[type="text"]:focus,
#seat-data-poster .seat-option-set input[type="number"]:focus,
#seat-data-poster .seat-option-set input[type="file"]:focus,
#seat-data-poster .seat-option-set select:focus{
outline:none;
border-color:#3f89cf;
box-shadow:0 0 0 2px rgba(63, 137, 207, 0.16);
}

#seat-data-poster .seat-option-set input[type="button"]{
height:30px;
line-height:30px;
border-radius:7px;
padding:0 11px;
}

#seat-data-poster .seat-option-set input[type="range"]{
width:100%;
}

#seat-data-poster .seat-marker-row,
#seat-data-poster .layout-save-row{
display:flex;
align-items:center;
gap:7px;
}

#seat-data-poster .seat-option-set p.layout-screenshot-row{
margin:14px 0 7px 0;
}

#seat-data-poster .layout-screenshot-row .layout-screenshot-btn{
width:100%;
background:#445669;
}

#seat-data-poster .layout-screenshot-row .layout-screenshot-btn:hover{
background:#364656;
}

#seat-data-poster .seat-marker-row .seat-marker-div{
float:none;
flex:1 1 auto;
min-width:0;
margin-right:0;
}

#seat-data-poster .seat-marker-row .seat-marker-div select{
width:100%;
}

#seat-data-poster .layout-save-row #seat_grid_name{
flex:1 1 auto;
min-width:0;
}

#seat-data-poster .layout-save-row .layout-save-btn{
min-width:92px;
}

#seat-data-poster .layout-save-row .layout-save-loading{
width:30px;
height:30px;
min-width:30px;
min-height:30px;
flex:0 0 30px;
aspect-ratio:1 / 1;
box-sizing:border-box;
border-radius:50%;
border:3px solid #b7d8f1;
border-top-color:#0078bf;
display:block;
animation:seatbook-spin 0.8s linear infinite;
}

#seat-data-poster #select-same-type-btn{
min-width:132px;
}

#seat-data-poster .layout-auto-name-row input[type="button"]{
min-width:96px;
}

#seat-data-poster .seat-preview-item{
background:#f8fbff;
border:1px solid #d9e4f1;
border-radius:8px;
padding:7px;
}

#seat-data-poster .area-dimension-row input[type="button"]{
min-width:96px;
}

#seat-data-poster .layout-auto-name-row select,
#seat-data-poster .layout-auto-name-row input[type="text"]{
flex:1 1 110px;
}

@keyframes seatbook-spin{
from{ transform:rotate(0deg); }
to{ transform:rotate(360deg); }
}

.seat-option-set{
float: left;
  padding: 10px;
  width: 25%;
  box-sizing: border-box;
}

.seat-option-set p{
margin:0 0 5px 0;
padding:0;
}

.seat-option-set b{
font:14px Arial, sans-serif;
}

.seat-option-set input[type="text"], .seat-option-set input[type="number"], .seat-option-set input[type="file"], .seat-option-set select, .floating-box  input[type="text"], .floating-box  input[type="number"], .floating-box  input[type="file"], .floating-box  select{
border:1px solid gray;
padding:5px;
font:11px Arial, sans-serif;
width:200px;
box-sizing: border-box;
}

.seat-bg-preview{
display:block;
max-width:120px;
max-height:120px;
border:1px solid #ccc;
padding:2px;
background:#fff;
}

.layout-background-preview-img{
display:block;
max-width:180px;
max-height:90px;
border:1px solid #ccc;
padding:2px;
background:#fff;
}

.seat-type-live-preview{
margin-top:12px;
padding-top:10px;
border-top:1px solid #ccc;
}

.seat-type-live-preview-card{
display:flex;
align-items:center;
gap:10px;
}

.seat-type-live-preview-card p{
margin:0;
font:12px Arial, sans-serif;
}

#seat-type-preview-seat{
margin:0;
cursor:default;
width:calc(var(--seat-box-size) * 2);
min-height:calc(var(--seat-box-size) * 2);
padding:calc(var(--seat-box-padding) * 2);
}

.seat-type-modal{
margin:0;
padding:14px;
box-sizing:border-box;
height:100%;
display:flex;
flex-direction:column;
background:#f3f7fc;
border-radius:12px;
}

.seat-type-modal .seat-type-tabs{
display:flex;
gap:7px;
padding-bottom:9px;
border-bottom:1px solid #d7e0ea;
}

.seat-type-modal .seat-type-tab{
border:1px solid #c2cfde;
background:#eef3f9;
color:#26425e;
padding:0 12px;
height:32px;
line-height:30px;
cursor:pointer;
font:700 12px Arial, sans-serif;
border-radius:7px;
}

.seat-type-modal .seat-type-tab.is-active{
background:#008cdd;
color:#fff;
border-color:#0078bf;
box-shadow:0 2px 5px rgba(0, 140, 221, 0.25);
}

.seat-type-modal .seat-type-body{
display:flex;
gap:14px;
flex:1;
min-height:0;
background:#fff;
border:1px solid #d7e0ea;
border-radius:10px;
padding:11px;
}

.seat-type-modal .seat-type-main{
flex:1;
min-width:0;
overflow:auto;
padding-right:7px;
}

.seat-type-modal .seat-type-panel{
display:none;
}

.seat-type-modal .seat-type-panel.is-active{
display:block;
}

.seat-type-modal .seat-type-form-grid{
display:grid;
grid-template-columns:repeat(2, minmax(220px, 1fr));
gap:11px;
}

.seat-type-modal .seat-type-section{
background:#f8fbff;
border:1px solid #d7e4f1;
border-radius:9px;
padding:11px;
}

.seat-type-modal .seat-type-section h3{
margin:0 0 9px 0;
font:700 13px Arial, sans-serif;
color:#203a54;
letter-spacing:0.2px;
}

.seat-type-modal .seat-type-field{
display:block;
margin:0 0 9px 0;
}

.seat-type-modal .seat-type-field span{
display:flex;
justify-content:space-between;
align-items:center;
font:12px Arial, sans-serif;
margin-bottom:4px;
color:#2f475f;
}

.seat-type-modal .seat-type-field input[type="text"],
.seat-type-modal .seat-type-field select,
.seat-type-modal .seat-type-field input[type="file"]{
width:100%;
box-sizing:border-box;
height:30px;
padding:0 7px;
border:1px solid #b9c7d7;
border-radius:7px;
background:#fff;
font:12px Arial, sans-serif;
transition:border-color 0.15s ease, box-shadow 0.15s ease;
}

.seat-type-modal .seat-type-field input[type="file"]{
height:auto;
padding:4px;
}

.seat-type-modal .seat-type-field input[type="range"]{
width:100%;
box-sizing:border-box;
}

.seat-type-modal .seat-type-field input[type="color"]{
width:58px;
height:30px;
padding:2px;
border:1px solid #b9c7d7;
border-radius:7px;
background:#fff;
}

.seat-type-modal .seat-type-field input[type="text"]:focus,
.seat-type-modal .seat-type-field select:focus,
.seat-type-modal .seat-type-field input[type="file"]:focus{
outline:none;
border-color:#3f89cf;
box-shadow:0 0 0 2px rgba(63, 137, 207, 0.16);
}

.seat-type-modal .seat-range-value{
font-weight:bold;
color:#1e3248;
}

.seat-type-modal .seat-type-top-actions{
display:flex;
align-items:center;
gap:10px;
margin-bottom:11px;
flex-wrap:nowrap;
padding:9px;
background:#f8fbff;
border:1px solid #d7e4f1;
border-radius:9px;
}

.seat-type-modal .seat-type-top-label{
font:700 12px Arial, sans-serif;
white-space:nowrap;
color:#203a54;
}

.seat-type-modal .seat-marker-div{
float:none;
margin-right:0;
flex:1;
min-width:220px;
}

.seat-type-modal .seat-marker-div select{
width:100%;
}

.seat-type-modal .seat-type-inline-buttons{
display:flex;
gap:7px;
}

.seat-type-modal .seat-type-inline-buttons input[type="button"]{
min-width:100px;
}

.seat-type-modal .seat-type-actions{
margin-top:11px;
text-align:right;
}

.seat-type-modal .seat-type-actions input[type="button"]{
min-width:136px;
}

.seat-type-modal .seat-type-edit-box{
padding:9px;
background:#fff;
border:1px solid #d7e4f1;
border-radius:9px;
min-height:82px;
}

.seat-type-modal .seat-type-preview-side{
width:220px;
border-left:0;
padding-left:0;
box-sizing:border-box;
background:#f8fbff;
border:1px solid #d7e4f1;
border-radius:9px;
padding:11px;
}

.seat-type-modal .seat-type-preview-title{
margin:0 0 7px 0;
padding-bottom:5px;
border-bottom:1px solid #dbe5f0;
}

.seat-type-modal .seat-type-preview-note{
font:11px Arial, sans-serif;
color:#555;
margin:7px 0 0 0;
}

.seat-type-modal .seat-type-live-preview-card{
padding:7px;
background:#fff;
border:1px dashed #c9d6e5;
border-radius:7px;
}

.floating-box .seat-type-modal input[type="button"]{
height:30px;
line-height:28px;
border-radius:7px;
font:bold 12px Arial, sans-serif;
}

@media (max-width: 980px){
.seat-type-modal .seat-type-body{
flex-direction:column;
}
.seat-type-modal .seat-type-preview-side{
width:auto;
border-left:0;
padding:9px;
}
.seat-type-modal .seat-type-form-grid{
grid-template-columns:1fr;
}
.seat-type-modal .seat-type-top-actions{
flex-wrap:wrap;
}
}

#seat-data-poster #seat-rows, #seat-data-poster #seat-cols{
width:6ch;
min-width:6ch;
padding-left:2px;
padding-right:2px;
text-align:center;
}

.area-dimension-row{
display:flex;
align-items:center;
gap:6px;
}

.area-dimension-row .area-multiply{
font-weight:bold;
}

.layout-bg-position-row{
display:flex;
align-items:center;
gap:6px;
}

#seat-data-poster .layout-bg-pos-input{
width:7ch;
min-width:7ch;
padding-left:2px;
padding-right:2px;
text-align:center;
}

.layout-bg-unit{
font:12px Arial, sans-serif;
}

.layout-auto-name-row{
display:flex;
align-items:center;
gap:6px;
flex-wrap:wrap;
}

.layout-auto-name-note{
font:11px Arial, sans-serif;
color:#555;
}

#auto-name-axis, #auto-name-format{
width:auto;
min-width:90px;
}

#auto-name-prefix, #auto-name-postfix{
width:90px;
}

.seat-option-set input[type="range"], .floating-box input[type="range"]{
width:200px;
}

.seat-preview-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:8px 10px;
}

.seat-preview-item{
min-width:0;
}

.seat-preview-grid input[type="range"]{
width:100%;
}

@media (max-width: 960px){
.seat-preview-grid{
grid-template-columns:1fr;
}
}

.seat-option-set input[type="color"], .floating-box input[type="color"]{
border:1px solid gray;
padding:2px;
width:60px;
height:30px;
background:#fff;
}

.seat-option-set input[type="button"], .floating-box input[type="button"], input[onclick="book_tickets()"]{
padding:0 10px;
margin:0;
border:0;
background:#000;
color:#fff;
cursor:pointer;
font:bold 12px/25px Arial, sans-serif;
}

.seat-option-set input[type="button"]:hover, .floating-box input[type="button"]:hover, input[onclick="book_tickets()"]:hover{
background:red;
}

@media (max-width: 1100px){
#seat-data-poster{
flex-direction:column;
height:auto;
min-height:100vh;
}

#seat-data-poster .seat-input{
order:1;
width:100%;
max-width:none;
min-width:0;
height:auto;
border-left:0;
border-bottom:1px solid #cfd8e3;
}

#seat-data-poster .seat-administration{
order:2;
height:62vh;
}
}

.seat-option-set input[type="button"].layout-save-create{
background:#568300;
}

.seat-option-set input[type="button"].layout-save-create:hover{
background:#466b00;
}

.seat-option-set input[type="button"].layout-save-update{
background:#008cdd;
}

.seat-option-set input[type="button"].layout-save-update:hover{
background:#0078bf;
}

.floating-box input[type="button"].seat-type-btn-create{
background:#568300;
}

.floating-box input[type="button"].seat-type-btn-create:hover{
background:#466b00;
}

.floating-box input[type="button"].seat-type-btn-update{
background:#008cdd;
}

.floating-box input[type="button"].seat-type-btn-update:hover{
background:#0078bf;
}

.floating-box input[type="button"].seat-type-btn-delete{
background:#db0000;
}

.floating-box input[type="button"].seat-type-btn-delete:hover{
background:#b40000;
}

.floating-box input[type="button"].seat-type-btn-edit{
background:#444;
}

.floating-box input[type="button"].seat-type-btn-edit:hover{
background:#333;
}

.seat-marker-div{
float:left;
margin-right:5px;
}


/* seat classes */

.no-seats{
border: 1px solid transparent;
  background-color: transparent;
}

.seat-availiable{
border:1px solid #008206;
background-color:#93e100;
}

.seat-disabled{
border:1px solid silver;
background-color:#eee;
}

.seat-booked{
border:1px solid red;
background-color:red;
}

/* end seat classes */

.close-floating-box{
background:url('images/incorrect.png') center center;
width:32px;
height:32px;
cursor:pointer;
float:right;
margin-top:10px;
margin-right:10px;
}

.hide-overflow{
overflow:hidden;
}

.floating-box{
width:90%;
height:90%;
overflow:hidden;
left:5%;
top:5%;
background-color:#fff;
font:11px Arial, sans-serif;
position:absolute;
z-index:2;
border:1px solid #000;
box-shadow:0 0 4px #000, 0 0 20px #000;
}

.floating-box h2{
margin:0 0 10px 0;
font:20px Arial, sans-serif;
}

.floating-box p{
margin:10px 0;
}

.seat-options{
margin:20px;
}

.add-seat{
float:left;
width:47%;
}

#seat-form-data{
display:none;
}

.booking-layout{
display:flex;
align-items:stretch;
min-height:100vh;
min-height:100dvh;
background:#e8eef6;
}

.booking-layout .seat-floater-left{
position:relative;
width:320px;
min-width:280px;
max-width:360px;
height:100vh;
height:100dvh;
overflow-y:auto;
padding:14px 12px 16px;
background:#f3f7fc;
border-right:1px solid #cfdae7;
box-shadow:inset -1px 0 0 #fff;
z-index:2;
overscroll-behavior:contain;
-webkit-overflow-scrolling:touch;
}

.booking-layout .booking-sidebar-head{
margin:0 0 10px 0;
padding:8px 10px;
background:#fff;
border:1px solid #d7e2ee;
border-radius:10px;
}

.booking-layout .seat-floater-left h3{
margin:0 0 6px 0;
text-align:left;
font:700 22px Arial, sans-serif;
color:#1a3853;
}

.booking-layout .booking-run-meta{
margin:0;
font:12px/1.4 Arial, sans-serif;
color:#35526f;
}

.booking-layout .booking-legend-list{
list-style:none;
margin:0;
padding:0;
display:flex;
flex-direction:column;
gap:7px;
}

.booking-layout .seat-floater-left li{
list-style:none;
display:flex;
align-items:center;
min-height:44px;
padding:6px 8px;
background:#fff;
border:1px solid #d7e2ee;
border-radius:8px;
font:13px Arial, sans-serif;
box-shadow:0 1px 2px rgba(17, 50, 81, 0.05);
}

.booking-layout .seat-floater-left li.must-show{
display:flex !important;
}

.booking-layout .seat-floater-left li p{
margin:0;
padding:0;
line-height:1.3;
color:#2c4b67;
}

.booking-layout .seat-floater-left li .seatc{
float:none;
margin:0 10px 0 0;
flex:0 0 auto;
}

.booking-layout .booking-form-box{
margin:12px 0 0 0;
padding:10px;
background:#fff;
border:1px solid #d7e2ee;
border-radius:10px;
}

.booking-selection-summary{
margin:12px 0 0 0;
padding:10px;
background:#fff;
border:1px solid #d7e2ee;
border-radius:10px;
}

.booking-summary-title{
margin:0 0 6px 0;
font:700 14px Arial, sans-serif;
color:#1d3a56;
}

.booking-summary-count{
margin:0 0 8px 0;
font:12px Arial, sans-serif;
color:#3b5b77;
}

.booking-summary-empty{
margin:0;
font:12px Arial, sans-serif;
color:#6b7f92;
}

.booking-summary-list{
display:flex;
flex-direction:column;
gap:7px;
}

.booking-summary-group{
padding:7px 8px;
background:#f5f9fd;
border:1px solid #d7e4f1;
border-radius:7px;
}

.booking-summary-group-title{
margin:0 0 3px 0;
font:12px Arial, sans-serif;
color:#1f3f5d;
}

.booking-summary-group-seats{
margin:0;
font:12px/1.35 Arial, sans-serif;
color:#2f536f;
word-break:break-word;
}

.booking-layout .booking-form-box input[onclick="book_tickets()"]{
width:100%;
height:36px;
line-height:34px;
font:700 13px Arial, sans-serif;
background:#008cdd;
border:1px solid #0078bf;
border-radius:8px;
}

.booking-layout .booking-form-box input[onclick="book_tickets()"]:hover{
background:#0078bf;
}

.booking-layout .booking-form-box input[onclick="book_tickets()"][disabled]{
background:#9fb6cb;
border-color:#8ca4bb;
cursor:not-allowed;
}

.booking-layout .seat-administration{
flex:1 1 auto;
min-width:0;
height:100vh;
height:100dvh;
margin:0;
background:#fff;
overscroll-behavior:contain;
touch-action:pan-x pan-y;
content-visibility:auto;
contain-intrinsic-size:960px 720px;
}

.booking-layout .seat-grid{
margin:0;
}

.booking-layout .seat-administration.always-visible.ps-container > .ps-scrollbar-x-rail,
.booking-layout .seat-administration.always-visible.ps-container > .ps-scrollbar-y-rail{
opacity:0.7;
}

@media (max-width: 980px){
.booking-layout{
flex-direction:column;
height:100vh;
height:100dvh;
min-height:0;
}

.booking-layout .seat-floater-left{
width:100%;
max-width:none;
min-width:0;
height:auto;
max-height:44vh;
max-height:44dvh;
border-right:0;
border-bottom:1px solid #cfdae7;
}

.booking-layout .seat-administration{
height:auto;
flex:1 1 auto;
min-height:0;
}

}

.common-info{
font:13px Arial, sans-serif;
padding:0 40px;
}

.booking-flow-page{
min-height:calc(100vh - 40px);
display:flex;
align-items:center;
justify-content:center;
padding:30px 14px;
background:#eef3f9;
}

.booking-flow-card{
width:100%;
max-width:760px;
margin:0 auto;
padding:18px 18px 16px;
background:#fff;
border:1px solid #d7e2ee;
border-radius:12px;
box-shadow:0 8px 28px rgba(19, 47, 73, 0.08);
text-align:center;
}

.booking-flow-title{
margin:0 0 8px 0;
font:700 25px Arial, sans-serif;
color:#173853;
}

.booking-flow-subtitle{
margin:0 0 14px 0;
font:14px Arial, sans-serif;
color:#4b6278;
}

.booking-flow-message{
margin:8px 0;
font:14px/1.5 Arial, sans-serif;
color:#2c475f;
}

.booking-flow-meta{
margin:8px 0 10px 0;
font:13px Arial, sans-serif;
color:#35526f;
}

.booking-flow-error{
color:#8f2136;
}

.booking-flow-label{
display:block;
margin:16px 0 6px;
font:700 14px Arial, sans-serif;
color:#1f3f5d;
}

.booking-flow-input{
width:100%;
max-width:420px;
height:38px;
margin:0 auto 12px;
padding:7px 10px;
border:1px solid #c2d2e3;
border-radius:8px;
font:14px Arial, sans-serif;
}

.booking-flow-btn{
display:inline-block;
min-width:170px;
height:38px;
line-height:36px;
padding:0 16px;
border:1px solid #0078bf;
border-radius:8px;
background:#008cdd;
color:#fff;
font:700 13px Arial, sans-serif;
cursor:pointer;
}

.booking-flow-btn:hover{
background:#0078bf;
}

.booking-flow-link{
display:inline-block;
margin-top:8px;
padding:7px 12px;
border-radius:7px;
background:#f2f7fd;
border:1px solid #cfe0f0;
color:#0f5f95;
font:700 13px Arial, sans-serif;
text-decoration:none;
}

.booking-flow-link:hover{
background:#e8f2fb;
}

@media (max-width: 980px){
.common-info.booking-flow-page{
padding:14px 10px;
}

.booking-flow-card{
padding:14px 12px 13px;
}

.booking-flow-title{
font-size:22px;
}
}

.common-info .booking-selection-summary{
max-width:900px;
margin:0 0 16px 0;
}

.common-info.booking-flow-page .booking-selection-summary{
max-width:100%;
margin:0 auto 16px;
text-align:left;
}

.common-info h2{
font:20px Arial, sans-serif;
}

.common-info pre{
border:1px solid gray;
background:#eee;
padding:20px;
}

.index-dashboard{
max-width:1200px;
margin:24px auto;
padding:0 14px 20px 14px;
}

.index-dashboard-head{
display:flex;
align-items:flex-end;
justify-content:space-between;
gap:14px;
margin-bottom:14px;
}

.index-dashboard-title h1{
margin:0 0 6px 0;
font:700 26px Arial, sans-serif;
color:#14293d;
}

.index-dashboard-title p{
margin:0;
font:14px Arial, sans-serif;
color:#455a70;
}

.index-alert{
padding:10px 12px;
border-radius:8px;
margin:0 0 14px 0;
font:13px Arial, sans-serif;
}

.index-alert-success{
background:#e5f5d7;
border:1px solid #b3d594;
color:#2a4e0a;
}

.index-alert-error{
background:#ffe6e6;
border:1px solid #efb2b2;
color:#7a1212;
}

.index-alert-info{
background:#e7f3ff;
border:1px solid #b8d6f5;
color:#1c436f;
}

.index-card{
background:#fff;
border:1px solid #d4dce6;
border-radius:12px;
box-shadow:0 2px 6px rgba(0, 0, 0, 0.06);
padding:12px;
margin-bottom:14px;
}

.index-card h2{
margin:0 0 10px 0;
font:700 18px Arial, sans-serif;
color:#1f3650;
}

.index-actions{
white-space:nowrap;
display:flex;
flex-wrap:wrap;
align-items:center;
gap:8px;
}

.index-dashboard .idx-btn{
display:inline-flex;
align-items:center;
justify-content:center;
min-width:100px;
height:34px;
line-height:1;
padding:0 14px;
border-radius:8px;
border:1px solid #b4c2d1;
background:#eff4f9;
background-image:none !important;
color:#1f3a56;
text-decoration:none;
font:700 13px Arial, sans-serif;
margin:0;
box-sizing:border-box;
box-shadow:none;
cursor:pointer;
transition:background-color .16s ease, border-color .16s ease, color .16s ease;
user-select:none;
}

.index-dashboard button.idx-btn{
appearance:none;
-webkit-appearance:none;
}

.index-dashboard .idx-btn:visited{
color:#1f3a56;
}

.index-dashboard .idx-btn:hover{
background:#e2ebf4;
border-color:#9bacbf;
text-decoration:none;
color:#17324f;
}

.index-dashboard .idx-btn:focus{
outline:none;
}

.index-dashboard .idx-btn:focus-visible{
outline:2px solid #57a5ea;
outline-offset:1px;
}

.index-dashboard .idx-btn-primary{
background:#008cdd;
border-color:#007dc5;
color:#fff;
}

.index-dashboard .idx-btn-primary:visited{
color:#fff;
}

.index-dashboard .idx-btn-primary:hover{
background:#0076b9;
border-color:#00659f;
color:#fff;
}

.index-dashboard .idx-btn-danger{
background:#db0000;
border-color:#b80000;
color:#fff;
}

.index-dashboard .idx-btn-danger:visited{
color:#fff;
}

.index-dashboard .idx-btn-danger:hover{
background:#bf0000;
border-color:#9f0000;
color:#fff;
}

.index-dashboard .idx-btn-create{
background:#568300;
border-color:#486f00;
color:#fff;
}

.index-dashboard .idx-btn-create:visited{
color:#fff;
}

.index-dashboard .idx-btn-create:hover{
background:#486f00;
border-color:#3e6100;
color:#fff;
}

.run-status{
display:inline-block;
padding:3px 8px;
border-radius:20px;
font:700 11px Arial, sans-serif;
letter-spacing:0.4px;
}

.run-status.is-open{
background:#d8f2d1;
color:#1f5e13;
border:1px solid #abd79f;
}

.run-status.is-closed{
background:#f4e3ce;
color:#6e4d17;
border:1px solid #dfc79e;
}

.run-status.is-pending{
background:#e7f2ff;
color:#1a4f82;
border:1px solid #b9d5f2;
}

.run-status.is-needs-schedule{
background:#ffe9d9;
color:#7f3b00;
border:1px solid #efc9ab;
}

.run-status.is-cancelled{
background:#f2e8ea;
color:#6b2d3c;
border:1px solid #ddc0c8;
}

.index-modal-backdrop{
position:fixed;
left:0;
top:0;
right:0;
bottom:0;
background:rgba(18, 34, 52, 0.56);
z-index:3000;
display:none;
align-items:center;
justify-content:center;
padding:18px;
box-sizing:border-box;
}

body.index-modal-open{
overflow:hidden;
}

.index-modal{
width:min(740px, 100%);
max-height:92vh;
overflow:auto;
background:#fff;
border:1px solid #ccd7e2;
border-radius:12px;
box-shadow:0 18px 42px rgba(0, 0, 0, 0.25);
padding:14px;
box-sizing:border-box;
}

.index-modal-head{
display:flex;
align-items:center;
justify-content:space-between;
gap:10px;
margin-bottom:10px;
}

.index-modal-head h3{
margin:0;
font:700 18px Arial, sans-serif;
color:#1d3853;
}

.index-modal-grid{
display:grid;
grid-template-columns:repeat(2, minmax(0, 1fr));
gap:10px 12px;
}

.index-modal-field{
display:flex;
flex-direction:column;
gap:4px;
font:13px Arial, sans-serif;
color:#24435f;
}

.index-modal-field span{
font:700 12px Arial, sans-serif;
color:#1f3650;
}

.index-modal-field input[type="text"],
.index-modal-field input[type="number"],
.index-modal-field input[type="datetime-local"],
.index-modal-field select{
height:34px;
line-height:32px;
padding:0 8px;
border:1px solid #b8c6d5;
border-radius:7px;
font:13px Arial, sans-serif;
color:#1f3650;
box-sizing:border-box;
}

.index-modal-field input[disabled]{
background:#eef2f7;
color:#7e8e9f;
}

.index-modal-field label{
display:inline-flex;
align-items:center;
gap:5px;
margin:1px 10px 0 0;
font:13px Arial, sans-serif;
color:#274661;
}

.index-modal-field input[type="radio"]{
margin:0;
}

.index-modal-actions{
display:flex;
justify-content:flex-end;
gap:8px;
margin-top:12px;
}

.index-data-table{
width:100%;
}

.index-dashboard div.dt-container{
font:13px Arial, sans-serif;
color:#1f3650;
}

.index-dashboard div.dt-container div.dt-layout-cell{
padding:6px 0;
}

.index-dashboard div.dt-container .dt-search input,
.index-dashboard div.dt-container .dt-input{
height:32px;
line-height:30px;
border:1px solid #b8c6d5;
border-radius:7px;
padding:0 8px;
background:#fff;
color:#1f3650;
}

.index-dashboard div.dt-container select.dt-input{
padding-right:26px;
}

.index-dashboard div.dt-container .dt-search input:focus,
.index-dashboard div.dt-container .dt-input:focus{
outline:none;
border-color:#3f89cf;
box-shadow:0 0 0 2px rgba(63, 137, 207, 0.16);
}

.index-dashboard div.dt-container .dt-paging .dt-paging-button{
box-sizing:border-box;
display:inline-block;
min-width:34px;
height:30px;
line-height:28px;
padding:0 10px;
margin-left:4px;
text-align:center;
text-decoration:none !important;
cursor:pointer;
color:#1f3a56 !important;
border:1px solid #b9c6d6;
border-radius:6px;
background:#eef2f7;
}

.index-dashboard div.dt-container .dt-paging .dt-paging-button:hover{
color:#17324f !important;
border-color:#9fb0c3;
background:#dfe9f4;
}

.index-dashboard div.dt-container .dt-paging .dt-paging-button.current,
.index-dashboard div.dt-container .dt-paging .dt-paging-button.current:hover{
color:#fff !important;
border-color:#0078bf;
background:#008cdd;
}

.index-dashboard div.dt-container .dt-paging .dt-paging-button.disabled,
.index-dashboard div.dt-container .dt-paging .dt-paging-button.disabled:hover{
opacity:0.5;
cursor:not-allowed;
background:#f3f6fa;
color:#6a7f95 !important;
border-color:#cad4df;
}

.index-dashboard table.dataTable>thead>tr>th,
.index-dashboard table.dataTable>thead>tr>td{
background:#f3f8fd;
color:#1f3650;
border-bottom:1px solid #d5dfea;
font:700 12px Arial, sans-serif;
}

.index-dashboard table.dataTable.display>tbody>tr>*{
border-top:1px solid #e3ebf3;
}

.index-dashboard table.dataTable.display>tbody>tr:nth-child(odd)>*{
box-shadow:none;
background:#fcfdff;
}

.index-dashboard table.dataTable.display>tbody>tr:nth-child(even)>*{
box-shadow:none;
background:#f8fbff;
}

.index-dashboard table.dataTable.display>tbody>tr:hover>*{
box-shadow:none !important;
background:#eef5ff !important;
}

table.dataTable.index-data-table td{
vertical-align:top;
}

@media (max-width: 980px){
.index-dashboard-head{
flex-direction:column;
align-items:flex-start;
}

.index-modal-grid{
grid-template-columns:1fr;
}
}

.seat-pre-links{
margin:20px auto;
padding:20px;
width:500px;
border:1px solid gray;
background:#eee;
}

.seat-pre-links h2 a, .seat-option-set a{
font-family:Arial, sans-serif;
text-decoration:none;
color:gray;
}

.seat-pre-links h2{
font:20px Arial, sans-serif;
color:#000;
}

.seat-pre-links h2 a:hover, .seat-option-set a:hover{
color:#000;
}

.bg-designer-panel .seat-option-set label{
display:block;
margin-bottom:8px;
}

.bg-designer-panel .seat-option-set input[type="number"],
.bg-designer-panel .seat-option-set input[type="text"],
.bg-designer-panel .seat-option-set select{
width:100%;
}

.bg-tool-picker{
display:grid;
grid-template-columns:repeat(4, minmax(0, 1fr));
gap:6px;
margin-bottom:6px;
}

.bg-tool-btn{
display:flex;
align-items:center;
justify-content:center;
gap:4px;
height:34px;
padding:0 6px;
border:1px solid #b8c5d6;
border-radius:8px;
background:#f8fbff;
color:#21354b;
cursor:pointer;
font:700 11px Arial, sans-serif;
}

.bg-tool-btn svg{
width:14px;
height:14px;
stroke:currentColor;
fill:none;
stroke-width:2;
}

.bg-tool-btn svg rect{
fill:none;
}

.bg-tool-btn:hover{
background:#eef4fb;
border-color:#8ca7c3;
}

.bg-tool-btn.is-active{
background:#dfeeff;
border-color:#2f6ea6;
color:#0f3b63;
box-shadow:inset 0 0 0 1px #2f6ea6;
}

.bg-designer-grid{
position:relative;
}

.bg-overlay-layer{
position:absolute;
left:0;
top:0;
z-index:6;
pointer-events:none;
}

.bg-overlay-svg{
display:block;
width:100%;
height:100%;
pointer-events:auto;
cursor:crosshair;
}

.bg-shape{
cursor:pointer;
}

.bg-shape-text{
user-select:none;
dominant-baseline:hanging;
}

.bg-selected-shape{
filter:drop-shadow(0 0 2px rgba(17, 94, 185, 0.9));
}

.bg-rect-handle{
fill:#ffffff;
stroke:#1f6feb;
stroke-width:1;
cursor:pointer;
}

.bg-rect-handle-nw, .bg-rect-handle-se{
cursor:nwse-resize;
}

.bg-rect-handle-ne, .bg-rect-handle-sw{
cursor:nesw-resize;
}

.bg-rect-handle-n, .bg-rect-handle-s{
cursor:ns-resize;
}

.bg-rect-handle-e, .bg-rect-handle-w{
cursor:ew-resize;
}

.bg-designer-form.bg-gridlines-enabled .seat.no-seats{
border-color:#ccc !important;
border-style:solid !important;
border-width:1px !important;
}

.bg-designer-form.bg-hide-axes .blank-row{
visibility:hidden;
pointer-events:none;
}

.bg-designer-form.bg-hide-axes .row-selector,
.bg-designer-form.bg-hide-axes .row-deselector{
visibility:hidden;
pointer-events:none;
}