/*
 * KNDev Booking Request
 * Minimal fallback styling.
 * Theme styling should live in kndev-global.css.
 *
 * License: OSL-3.0
 */

:root{
  --knd-accent: #0f766e;
  --knd-danger: #b91c1c;
  --knd-overlay: rgba(0,0,0,.55);
  --knd-radius: 16px;
}

html.knd-modal-open,
html.knd-modal-open body{
  overflow:hidden;
  height:100%;
}

.knd-modal{
  position:fixed;
  inset:0;
  width:100vw;
  height:100vh;
  z-index:99999;
  display:none;
  padding:12px;
}

.knd-modal.knd-modal--open{
  display:flex;
  align-items:center;
  justify-content:center;
}

.knd-modal__overlay{
  position:absolute;
  inset:0;
  background:var(--knd-overlay);
}

.knd-modal__card{
  position:relative;
  width:min(760px, calc(100vw - 24px));
  margin:0 auto;
  max-height:calc(100dvh - 24px);
  display:flex;
  flex-direction:column;
  background:#fff;
  border-radius:var(--knd-radius);
  box-shadow:0 20px 60px rgba(0,0,0,.25);
  overflow:hidden;
}

.knd-modal__body{
  flex:1;
  min-height:0;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
}

.knd-modal__footer{
  position:sticky;
  bottom:0;
  padding:12px 16px 16px;
  background:#fff;
  border-top:1px solid rgba(0,0,0,.08);
}

.knd-modal__header{
  padding:16px 16px 8px;
}

.knd-modal__close{
  position:absolute;
  top:10px;
  right:12px;
  z-index:2;
  border:0;
  background:transparent;
  font-size:28px;
  line-height:1;
  cursor:pointer;
}

.knd-modal__kicker{
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
  opacity:.75;
  margin-bottom:6px;
}

.knd-modal__product{
  display:flex;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:12px;
}

.knd-modal__product-name{font-weight:700}
.knd-modal__product-price{opacity:.85}

.knd-form{padding:8px 16px 16px}

.knd-grid{display:grid;gap:10px}
.knd-grid--2{grid-template-columns:1fr 1fr}
.knd-grid--3{grid-template-columns:1fr 1fr 1fr}

.knd-field label{display:block;font-weight:600;margin-bottom:6px}

.knd-section{margin:1rem 0 .5rem;padding:1rem 0 0;border-top:1px solid rgba(0,0,0,.08)}
.knd-section__title{font-weight:700;margin-bottom:10px}

.knd-actions{margin-top:14px;display:flex;justify-content:flex-end}

.knd-toast{
  margin-top:12px;
  padding:12px 12px;
  border-radius:12px;
  border:1px solid rgba(0,0,0,.1);
}

.knd-toast--ok{border-color:color-mix(in srgb, var(--knd-accent) 35%, transparent)}
.knd-toast--err{border-color:color-mix(in srgb, var(--knd-danger) 35%, transparent)}

.knd-toast--page{
  position:fixed;
  left:16px;
  bottom:16px;
  z-index:99999;
  max-width:min(560px, calc(100vw - 32px));
  box-shadow:0 10px 30px rgba(0,0,0,.18);
  background:var(--knd-accent);
  color:#fff;
}

.knd-toast--page.knd-toast--err{background:var(--knd-danger)}

.knd-toast__title{font-weight:700;margin-bottom:4px}

textarea.form-control{resize:vertical;min-height:100px}

@media (max-width: 720px){
  .knd-modal.knd-modal--open{align-items:flex-start}
  .knd-modal{padding:calc(12px + env(safe-area-inset-top)) 12px calc(12px + env(safe-area-inset-bottom))}
  .knd-grid--2,.knd-grid--3{grid-template-columns:1fr}
}

@media (min-width: 721px){
  /*
   * Defensive centering: some themes override flex alignment.
   */
  .knd-modal.knd-modal--open{
    justify-content:center !important;
    align-items:center !important;
  }
}
