/* Group booking planner (/rooms/group-bookings/). Colours match the site theme. */
.gb-panel{border:1px solid rgba(0,0,0,.1);background:#f4f4f4;padding:16px;}
.gb-fields{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;}
.gb-field{grid-column:span 2;min-width:0;}
.gb-field--date{grid-column:span 4;}
.gb-field label,.gb-field .gb-label{display:block;margin-bottom:4px;font-size:13px;font-weight:700;line-height:1.3;color:#5f5f5f;}
.gb-field input,.gb-field select{width:100%;height:42px;padding:6px 8px;border:1px solid rgba(0,0,0,.2);border-radius:4px;background:#fff;color:#29662b;font:inherit;font-size:16px;font-weight:700;line-height:1.2;}
.gb-field select{cursor:pointer;}
.gb-step{display:flex;height:42px;border:1px solid rgba(0,0,0,.2);border-radius:4px;background:#fff;overflow:hidden;}
.gb-step button{flex:0 0 34%;border:0;background:#29662b;color:#fff;font:inherit;font-size:20px;font-weight:700;line-height:1;cursor:pointer;}
.gb-step button:hover{background:#255b26;}
.gb-step button:disabled{background:#c9d3c7;cursor:default;}
.gb-step button:focus-visible{outline:2px solid #69995d;outline-offset:-2px;}
.gb-step output{flex:1;display:flex;align-items:center;justify-content:center;color:#29662b;font-size:16px;font-weight:700;}
.gb-field input:focus-visible,.gb-field select:focus-visible,.gb-card-head:focus-visible,.gb-fp-tab:focus-visible{outline:2px solid #69995d;outline-offset:2px;}
.gb-check{grid-column:1/-1;display:flex;align-items:center;gap:8px;font-size:14px;line-height:1.4;cursor:pointer;}
.gb-check input{width:18px;height:18px;flex-shrink:0;accent-color:#29662b;cursor:pointer;}
.gb-field--return{grid-column:1/-1;}
.gb-field--return[hidden]{display:none;}
.gb-total{margin-top:12px;font-weight:700;color:#29662b;}
.gb-status{margin-top:4px;font-size:14px;line-height:1.4;color:rgba(95,95,95,.85);}
.gb-status .gb-live{color:#29662b;}
.gb-warn{color:#9a4a00;}

.gb-floorplan-wrap{margin-top:14px;}
.gb-fp-tabs{display:flex;gap:6px;margin-bottom:8px;}
.gb-fp-tabs[hidden]{display:none;}
.gb-fp-tab{padding:4px 12px;border:1px solid #29662b;border-radius:999px;background:#fff;color:#29662b;font:inherit;font-size:13px;font-weight:700;cursor:pointer;}
.gb-fp-tab.is-active{background:#29662b;color:#fff;}
.gb-floorplan{position:relative;width:100%;aspect-ratio:1017.952/629.962;background:#fff;border:1px solid rgba(0,0,0,.1);overflow:hidden;}
.gb-fp-layer{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .4s ease;}
.gb-fp-base{opacity:1;}
.gb-fp-people{position:absolute;inset:0;width:100%;height:100%;fill:#000;pointer-events:none;}
/* Seen from above, so falling into bed is shrinking onto it, then a bounce. */
.gb-fig-in,.gb-fig-out,.gb-fig-drop,.gb-fig-shift{transform-box:fill-box;transform-origin:center;}
/* Dropping from the top bunk to the bottom one: from where they lay (--dx,--dy), a little nearer the eye. */
.gb-fig-drop{animation:gb-fig-drop .45s cubic-bezier(.4,0,.6,1) both;}
.gb-fig-shift{animation:gb-fig-shift .35s ease both;}
@keyframes gb-fig-drop{0%{transform:translate(var(--dx),var(--dy)) scale(1.11);}55%{transform:translate(0,0) scale(.93);}78%{transform:scale(1.04);}100%{transform:scale(1);}}
@keyframes gb-fig-shift{0%{transform:translate(var(--dx),var(--dy));}100%{transform:translate(0,0);}}
.gb-fig-in{animation:gb-fig-in .6s cubic-bezier(.3,.7,.4,1) both;}
.gb-fig-out{animation:gb-fig-out .5s cubic-bezier(.5,0,.8,.4) both;}
.gb-fig-out--star{animation-name:gb-fig-out-star;}
@keyframes gb-fig-in{0%{opacity:0;transform:scale(2.2) rotate(-14deg);}45%{opacity:1;transform:scale(.86) rotate(0);}65%{transform:scale(1.1);}82%{transform:scale(.96);}100%{transform:scale(1);}}
/* Feet first: the standing figure's feet are down its own y axis, the spread-out one's along x. */
@keyframes gb-fig-out{0%{opacity:1;transform:translateY(0);}70%{opacity:1;}100%{opacity:0;transform:translateY(120%);}}
@keyframes gb-fig-out-star{0%{opacity:1;transform:translateX(0);}70%{opacity:1;}100%{opacity:0;transform:translateX(120%);}}
/* The part of a bottom-bunk sleeper that is under the Queen Bunk Room's top bunk. */
.gb-under{opacity:.3;animation:gb-under .45s ease backwards;}
.gb-under.is-on{animation:none;}
@keyframes gb-under{from{opacity:1;}}
@media (prefers-reduced-motion:reduce){.gb-under{animation:none;}.gb-fig-in,.gb-fig-drop,.gb-fig-shift{animation:none;}.gb-fig-out{display:none;}}
/* Hatched cover for a room someone else has booked. Positions are the room
   rectangles in Base.svg as a percentage of its viewBox. */
.gb-booked{position:absolute;display:flex;align-items:center;justify-content:center;
  background:repeating-linear-gradient(135deg,rgba(60,60,60,.82) 0 8px,rgba(60,60,60,.68) 8px 16px);}
.gb-booked[hidden]{display:none;}
.gb-booked span{white-space:nowrap;padding:2px 8px;border-radius:3px;background:#fff;color:#444;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;line-height:1.5;}
.gb-booked.is-partial{background:none;align-items:flex-end;justify-content:flex-start;padding:4px;}
.gb-booked.is-partial span{background:#9a4a00;color:#fff;}
/* Netflix badge floating in front of each TV in Base.svg. */
.gb-nf{position:absolute;width:3.6%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:18%;background:#000;box-shadow:0 2px 5px rgba(0,0,0,.45);}
.gb-nf img{display:block;width:100%;height:100%;padding:16%;object-fit:contain;}
/* Open doorway through the wall between R5 and R4, for the Family & Group Room. */
.gb-join{position:absolute;left:30.6%;top:62.5%;width:2.1%;height:12%;display:flex;align-items:center;justify-content:center;
  background:#dfe4ec;border-top:2px solid #555;border-bottom:2px solid #555;}
.gb-join[hidden]{display:none;}
.gb-join span{flex:none;white-space:nowrap;padding:0 13px;background:#29662b;color:#fff;font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;line-height:24px;
  clip-path:polygon(0 50%,10px 0,10px 18%,calc(100% - 10px) 18%,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,calc(100% - 10px) 82%,10px 82%,10px 100%);}
#gbBooked-r6{left:1.7%;top:2.7%;width:29.1%;height:47.3%;}
#gbBooked-r5{left:1.7%;top:52.9%;width:29.1%;height:44.4%;}
#gbBooked-r3{left:32.5%;top:2.7%;width:29.1%;height:47.3%;}
#gbBooked-r4{left:32.5%;top:52.9%;width:29.1%;height:44.4%;}
#gbBooked-r1{left:63.3%;top:2.7%;width:35.1%;height:47.3%;}
#gbBooked-r2{left:63.3%;top:52.9%;width:35%;height:44.4%;}

.gb-empty{padding:16px;border:1px dashed rgba(0,0,0,.2);color:rgba(95,95,95,.85);}
.gb-card{border:1px solid rgba(0,0,0,.15);background:#fff;}
.gb-card + .gb-card{margin-top:10px;}
.gb-card.is-picked{border-color:#255b26;box-shadow:0 0 0 1px #255b26;}
.gb-card-head{display:grid;grid-template-columns:1fr auto;column-gap:12px;width:100%;padding:12px 14px;border:none;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer;}
.gb-card.is-picked .gb-card-head{background:#255b26;color:#fff;}
.gb-card-title{font-size:18px;font-weight:700;line-height:1.3;color:#29662b;}
.gb-card.is-picked .gb-card-title{color:#fff;}
.gb-card-price{grid-row:span 2;text-align:right;font-size:24px;font-weight:700;line-height:1.1;color:#29662b;font-variant-numeric:tabular-nums;}
.gb-card.is-picked .gb-card-price{color:#fff;}
.gb-card-price small{display:block;font-size:12px;font-weight:400;opacity:.85;}
.gb-card-pp{font-size:15px;font-weight:700;line-height:1.4;}
.gb-card-blurb{grid-column:1/-1;margin-top:4px;font-size:14px;line-height:1.4;opacity:.9;}
.gb-card-body{padding:4px 14px 12px;}
.gb-stay{margin-top:10px;font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#29662b;}
.gb-rooms{list-style:none;margin:0;padding:0;}
.gb-rooms li{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid rgba(0,0,0,.08);}
.gb-rooms li:last-child{border-bottom:none;}
.gb-rooms img{width:44px;height:44px;flex-shrink:0;object-fit:cover;border-radius:4px;}
.gb-room-text{flex:1;min-width:0;font-size:14px;line-height:1.35;}
.gb-room-text a{display:block;font-size:16px;font-weight:700;color:#29662b;text-decoration:none;}
.gb-room-text a:hover{text-decoration:underline;}
.gb-room-price{flex-shrink:0;font-weight:700;color:#5f5f5f;font-variant-numeric:tabular-nums;}
.gb-fp-caption{margin-top:6px;font-size:13px;line-height:1.4;color:rgba(95,95,95,.85);}
.gb-fp-caption a{color:#29662b;text-decoration:underline;}
.gb-note{margin-top:8px;font-size:14px;line-height:1.45;}
.gb-note a{color:#29662b;text-decoration:underline;}
@media (min-width:480px){
  .gb-panel{padding:20px;}
  .gb-field,.gb-field--date{grid-column:span 2;}
  .gb-field--date{grid-column:span 4;}
}
