
/* Krabi Magyarul — TEST-only availability checker V3
   Visual target: approved gold-glow mockup */
.km-room-availability-shell{
  --km-green:#075f49;
  --km-green-dark:#064b3a;
  --km-gold:#ffc928;
  --km-gold-soft:rgba(255,201,40,.34);
  position:relative;
  isolation:isolate;
  width:min(1160px,calc(100% - 44px));
  margin:58px auto 18px;
  padding:0;
}

.km-room-availability-card{
  position:relative;
  z-index:2;
  overflow:visible;
  padding:28px 38px 34px;
  border-radius:34px;
  background:
    radial-gradient(circle at 50% -15%,rgba(255,255,255,.96),rgba(255,252,244,.96) 45%,rgba(255,249,234,.98) 100%);
  border:1px solid rgba(255,202,40,.42);
  box-shadow:
    0 14px 34px rgba(94,67,8,.10),
    0 0 0 7px rgba(255,222,105,.13),
    0 0 34px rgba(255,200,24,.36),
    0 0 70px rgba(255,213,76,.22);
}

.km-room-availability-card::before,
.km-room-availability-card::after{
  content:"✦";
  position:absolute;
  color:#ffd84a;
  font-size:18px;
  filter:drop-shadow(0 0 7px rgba(255,196,20,.78));
  animation:kmAvailSparkle 2.2s ease-in-out infinite;
  pointer-events:none;
}
.km-room-availability-card::before{left:18%;bottom:-28px;}
.km-room-availability-card::after{right:16%;top:-30px;animation-delay:1s;}

.km-room-availability-kicker{
  margin:0 0 18px;
  text-align:center;
  color:#b48217;
  font-size:13px;
  line-height:1;
  font-weight:1000;
  letter-spacing:.08em;
}

.km-room-availability-card h3{
  margin:0 0 22px;
  text-align:center;
  color:var(--km-green-dark);
  font-size:clamp(34px,4.4vw,58px);
  line-height:1.03;
  font-weight:950;
  letter-spacing:-.028em;
}

.km-room-availability-instruction{
  margin:0 0 30px;
  text-align:center;
  color:var(--km-green);
  font-size:clamp(17px,2vw,26px);
  line-height:1.15;
  font-weight:1000;
  letter-spacing:.015em;
  text-shadow:0 1px 0 #fff,0 0 13px rgba(255,203,35,.16);
}

.km-room-availability-form{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.12fr) minmax(210px,.9fr);
  gap:16px;
  align-items:end;
  width:100%;
  margin:0 auto;
}

.km-room-availability-form label{
  display:grid;
  gap:9px;
  min-width:0;
  color:#0a4e3d;
  font-size:15px;
  font-weight:950;
}

.km-room-availability-form input,
.km-room-availability-form select{
  width:100%;
  min-width:0;
  min-height:58px;
  padding:12px 16px;
  box-sizing:border-box;
  border:1.8px solid #178167;
  border-radius:14px;
  background:#fff;
  color:#24473e;
  font:inherit;
  font-size:16px;
  box-shadow:0 6px 16px rgba(7,95,73,.05);
  outline:none;
}
.km-room-availability-form input:focus,
.km-room-availability-form select:focus{
  border-color:#0a6d55;
  box-shadow:0 0 0 4px rgba(255,205,47,.18),0 7px 18px rgba(7,95,73,.08);
}

.km-room-availability-form button{
  position:relative;
  overflow:hidden;
  min-height:58px;
  padding:0 24px;
  border-radius:14px;
  border:0;
  background:#078b78;
  color:#fff;
  font:inherit;
  font-size:17px;
  line-height:1.1;
  font-weight:1000;
  cursor:pointer;
  box-shadow:0 8px 18px rgba(7,139,120,.18);
  transition:transform .18s ease,filter .18s ease,box-shadow .18s ease;
}
.km-room-availability-form button::after{
  content:"";
  position:absolute;
  top:-30%;
  left:-36%;
  width:24%;
  height:160%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.34),transparent);
  transform:skewX(-18deg);
  animation:kmAvailSweep 4.8s linear infinite;
  pointer-events:none;
}
.km-room-availability-form button:hover,
.km-room-availability-form button:focus-visible{
  transform:translateY(-1px);
  filter:brightness(1.04);
  box-shadow:0 10px 22px rgba(7,139,120,.22);
}
.km-room-availability-form button:disabled{
  opacity:.65;
  cursor:wait;
  transform:none;
}

.km-room-availability-status{
  min-height:24px;
  margin:18px 0 0;
  text-align:center;
  color:#536660;
  font-weight:800;
}
.km-room-availability-status.is-error{color:#a43c33;}

.km-room-availability-results{
  display:flex;
  justify-content:center;
  margin:16px 0 0;
}
.km-room-availability-result{
  min-width:min(440px,100%);
  padding:14px 20px;
  border-radius:999px;
  text-align:center;
  font-weight:1000;
  border:1px solid transparent;
}
.km-room-availability-result.is-available{
  background:#eaf8f2;
  color:#09604a;
  border-color:#b7dccf;
}
.km-room-availability-result.is-unavailable{
  background:#f8f1ed;
  color:#805b50;
  border-color:#e2d2ca;
}
.km-room-availability-privacy{display:none!important;}

/* 2 + 2 inward arrows */
.km-room-availability-arrow{
  position:absolute;
  z-index:4;
  width:72px;
  height:54px;
  pointer-events:none;
  filter:
    drop-shadow(0 0 3px #fff)
    drop-shadow(0 0 8px rgba(255,193,0,.96))
    drop-shadow(0 0 16px rgba(255,193,0,.66));
}
.km-room-availability-arrow::before{
  content:"";
  position:absolute;
  inset:0;
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
}
.km-room-availability-arrow-left-top{left:-74px;top:14%;transform:rotate(24deg);}
.km-room-availability-arrow-left-bottom{left:-74px;bottom:14%;top:auto;transform:rotate(-24deg);}
.km-room-availability-arrow-right-top{right:-74px;top:14%;transform:rotate(-24deg);}
.km-room-availability-arrow-right-bottom{right:-74px;bottom:14%;top:auto;transform:rotate(24deg);}

.km-room-availability-arrow-left-top::before,
.km-room-availability-arrow-left-bottom::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 92 54'%3E%3Cg fill='none' stroke='%23ffc400' stroke-width='8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 27h68'/%3E%3Cpath d='M57 9l19 18-19 18'/%3E%3C/g%3E%3C/svg%3E");
  animation:kmAvailArrowLeft 1.25s ease-in-out infinite;
}
.km-room-availability-arrow-right-top::before,
.km-room-availability-arrow-right-bottom::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 92 54'%3E%3Cg fill='none' stroke='%23ffc400' stroke-width='8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M85 27H17'/%3E%3Cpath d='M35 9L16 27l19 18'/%3E%3C/g%3E%3C/svg%3E");
  animation:kmAvailArrowRight 1.25s ease-in-out infinite;
}

@keyframes kmAvailArrowLeft{
  0%,100%{transform:translateX(0) scale(.94);opacity:.75}
  50%{transform:translateX(8px) scale(1.06);opacity:1}
}
@keyframes kmAvailArrowRight{
  0%,100%{transform:translateX(0) scale(.94);opacity:.75}
  50%{transform:translateX(-8px) scale(1.06);opacity:1}
}
@keyframes kmAvailButtonPulse{
  0%,100%{box-shadow:0 9px 22px rgba(7,81,58,.20),0 0 0 5px rgba(255,211,62,.16),0 0 22px rgba(255,197,20,.42)}
  50%{box-shadow:0 10px 24px rgba(7,81,58,.24),0 0 0 8px rgba(255,211,62,.26),0 0 34px rgba(255,190,0,.66)}
}
@keyframes kmAvailSweep{
  0%{left:-36%}
  58%,100%{left:122%}
}
@keyframes kmAvailSparkle{
  0%,100%{opacity:.25;transform:scale(.9)}
  50%{opacity:1;transform:scale(1.12)}
}

@media(max-width:1100px){
  .km-room-availability-shell{width:min(1040px,calc(100% - 150px));}
  .km-room-availability-form{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .km-room-availability-form button{min-height:58px;}
  .km-room-availability-arrow-left-top,
  .km-room-availability-arrow-left-bottom{left:-68px;}
  .km-room-availability-arrow-right-top,
  .km-room-availability-arrow-right-bottom{right:-68px;}
}

@media(max-width:760px){
  .km-room-availability-shell{
    width:calc(100% - 22px);
    margin:42px auto 14px;
  }
  .km-room-availability-card{
    padding:22px 14px 24px;
    border-radius:24px;
  }
  .km-room-availability-card h3{
    margin-bottom:16px;
    font-size:clamp(29px,8vw,40px);
  }
  .km-room-availability-instruction{
    margin-bottom:22px;
    font-size:16px;
    line-height:1.25;
  }
  .km-room-availability-form{
    grid-template-columns:1fr;
    gap:12px;
  }
  .km-room-availability-form input,
  .km-room-availability-form select,
  .km-room-availability-form button{
    min-height:56px;
  }
  .km-room-availability-arrow{display:none!important;}
}

@media(prefers-reduced-motion:reduce){
  .km-room-availability-form button,
  .km-room-availability-form button::after,
  .km-room-availability-arrow::before,
  .km-room-availability-card::before,
  .km-room-availability-card::after{
    animation:none!important;
  }
}


/* =========================================================
   V10 — slower pulse, restored dark-green button
   ========================================================= */

#room-availability-checker #km-room-availability-form button[type="submit"]{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  min-height:58px;
  padding:0 24px;
  border:0;
  border-radius:14px;
  background:linear-gradient(105deg,#054b37 0%,#0a6b4d 50%,#054b37 100%);
  color:#fff;
  font:inherit;
  font-size:17px;
  line-height:1.1;
  font-weight:1000;
  cursor:pointer;
  text-shadow:0 1px 1px rgba(0,0,0,.12);
  transform-origin:center center;
  box-shadow:
    0 9px 20px rgba(4,67,49,.24),
    inset 0 1px 0 rgba(255,255,255,.10);
  animation:kmAvailPulseV10 3.4s ease-in-out infinite;
  will-change:transform,box-shadow;
}

#room-availability-checker #km-room-availability-form button[type="submit"]::before{
  content:"";
  position:absolute;
  inset:-7px;
  border-radius:18px;
  pointer-events:none;
  z-index:0;
  opacity:.05;
  background:radial-gradient(circle at center,
    rgba(255,255,255,.24) 0%,
    rgba(255,255,255,.08) 44%,
    rgba(255,255,255,0) 72%);
  animation:kmAvailHaloV10 3.4s ease-in-out infinite;
}

#room-availability-checker #km-room-availability-form button[type="submit"]::after{
  content:"";
  position:absolute;
  top:-42%;
  left:-38%;
  width:24%;
  height:190%;
  pointer-events:none;
  z-index:1;
  opacity:0;
  transform:skewX(-20deg);
  background:linear-gradient(90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.12) 18%,
    rgba(255,255,255,.78) 50%,
    rgba(255,255,255,.12) 82%,
    rgba(255,255,255,0) 100%);
  animation:kmAvailSweepV10 4.8s ease-in-out infinite;
  will-change:left,opacity;
}

#room-availability-checker #km-room-availability-form button[type="submit"]:hover,
#room-availability-checker #km-room-availability-form button[type="submit"]:focus-visible{
  background:linear-gradient(105deg,#044431 0%,#096247 50%,#044431 100%);
}

#room-availability-checker #km-room-availability-form button[type="submit"]:disabled{
  animation:none;
  opacity:.68;
  cursor:wait;
}

#room-availability-checker #km-room-availability-form button[type="submit"]:disabled::before,
#room-availability-checker #km-room-availability-form button[type="submit"]:disabled::after{
  animation:none;
  display:none;
}

@keyframes kmAvailPulseV10{
  0%,100%{
    transform:scale(1);
    box-shadow:
      0 9px 20px rgba(4,67,49,.24),
      0 0 0 0 rgba(255,255,255,0),
      inset 0 1px 0 rgba(255,255,255,.10);
  }
  50%{
    transform:scale(1.035);
    box-shadow:
      0 13px 27px rgba(4,67,49,.31),
      0 0 0 5px rgba(255,255,255,.07),
      inset 0 1px 0 rgba(255,255,255,.17);
  }
}

@keyframes kmAvailHaloV10{
  0%,100%{opacity:.04;transform:scale(.99);}
  50%{opacity:.22;transform:scale(1.06);}
}

@keyframes kmAvailSweepV10{
  0%{left:-38%;opacity:0;}
  10%{opacity:.9;}
  58%{left:112%;opacity:.9;}
  70%,100%{left:112%;opacity:0;}
}


/* =========================================================
   V11 — lock CTA to dark green while preserving pulse/sweep
   ========================================================= */

#room-availability-checker #km-room-availability-form button[type="submit"]{
  background:#075b46 !important;
  background-image:linear-gradient(105deg,#064c3a 0%,#08705a 50%,#064c3a 100%) !important;
  color:#ffffff !important;
  border-color:rgba(5,86,66,.42) !important;
  filter:none !important;
}

#room-availability-checker #km-room-availability-form button[type="submit"]:hover,
#room-availability-checker #km-room-availability-form button[type="submit"]:focus-visible{
  background:#06513e !important;
  background-image:linear-gradient(105deg,#054333 0%,#06644e 50%,#054333 100%) !important;
  filter:none !important;
}

#room-availability-checker #km-room-availability-form button[type="submit"]:disabled{
  background:#075b46 !important;
  background-image:linear-gradient(105deg,#064c3a 0%,#08705a 50%,#064c3a 100%) !important;
}

/* Sweep remains white, but narrow enough not to recolor the whole button */
#room-availability-checker #km-room-availability-form button[type="submit"]::after{
  width:18%;
  background:linear-gradient(90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.08) 20%,
    rgba(255,255,255,.60) 50%,
    rgba(255,255,255,.08) 80%,
    rgba(255,255,255,0) 100%);
}



.km-room-availability-debug-title{
  margin-bottom:6px;
  font-weight:1000;
  color:#8b6210;
  font-size:12px;
  letter-spacing:.06em;
}
.km-room-availability-debug pre{
  margin:0;
  white-space:pre-wrap;
  word-break:break-word;
  font:12px/1.45 Consolas,Monaco,monospace;
}


/* Persistent availability result */
#room-availability-checker .km-room-availability-results{
  display:flex !important;
  justify-content:center;
  align-items:center;
  margin-top:16px;
  min-height:54px;
}

#room-availability-checker .km-room-availability-result{
  display:flex !important;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-width:min(460px,100%);
  padding:14px 20px;
  border-radius:999px;
  font-weight:1000;
  font-size:16px;
  line-height:1.2;
  opacity:1 !important;
  visibility:visible !important;
}

#room-availability-checker .km-room-availability-result.is-available{
  background:#eaf8f2 !important;
  color:#075b46 !important;
  border:1px solid #b9decf !important;
  box-shadow:0 7px 16px rgba(7,91,70,.09);
}

#room-availability-checker .km-room-availability-result.is-unavailable{
  background:#fff1ee !important;
  color:#9a352e !important;
  border:1px solid #e8c0bb !important;
  box-shadow:0 7px 16px rgba(154,53,46,.08);
}

#room-availability-checker .km-room-availability-result .km-result-icon{
  font-size:20px;
  line-height:1;
}

@media(max-width:760px){
  #room-availability-checker .km-room-availability-result{
    min-width:0;
    width:100%;
    border-radius:18px;
  }
}


/* V2 position refinement: a little more air before bungalow cards */
#room-availability-checker{
  margin-bottom:34px !important;
}

@media(max-width:760px){
  #room-availability-checker{
    margin-bottom:24px !important;
  }
}


/* =========================================================
   MOBILE FIT FIX — iPhone date/select controls stay inside card
   ========================================================= */
@media(max-width:760px){
  #room-availability-checker{
    width:calc(100% - 24px) !important;
    max-width:calc(100% - 24px) !important;
    margin-left:auto !important;
    margin-right:auto !important;
    box-sizing:border-box !important;
  }

  #room-availability-checker .km-room-availability-card{
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
    overflow:hidden !important;
    padding-left:14px !important;
    padding-right:14px !important;
  }

  #room-availability-checker .km-room-availability-form,
  #room-availability-checker .km-room-availability-form label{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }

  #room-availability-checker .km-room-availability-form input,
  #room-availability-checker .km-room-availability-form select{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    inline-size:100% !important;
    max-inline-size:100% !important;
    min-inline-size:0 !important;
    box-sizing:border-box !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }

  #room-availability-checker .km-room-availability-form input[type="date"]{
    -webkit-appearance:none;
    appearance:none;
  }
}
