/* ===========================
   JPP Booking Request Form CSS
   Fully scoped under .jppbr-wrap (and further isolated by unique #id per instance)
   =========================== */

.jppbr-wrap, .jppbr-wrap *{ box-sizing:border-box; }

.jppbr-wrap{
  /* isolate from theme CSS as much as possible */
  all: initial;
  display:block;
  font-family: system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}

.jppbr-wrap *{
  all: unset;
  box-sizing:border-box;
  font-family: inherit;
}

.jppbr-wrap .jppbr-card{
  display:block;
  background:#ffffff;
  border:1px solid rgba(0,0,0,.12);
  border-radius:16px;
  padding:20px;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 10px 26px rgba(0,0,0,.08);
}

.jppbr-wrap .jppbr-title{
  display:block;
  font-size:22px;
  font-weight:700;
  color:#111827;
  margin-bottom:6px;
}

.jppbr-wrap .jppbr-sub{
  display:block;
  color:#4b5563;
  font-size:14px;
  margin-bottom:16px;
  line-height:1.35;
}

.jppbr-wrap .jppbr-form{
  display:block;
}

.jppbr-wrap .jppbr-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:14px;
}

.jppbr-wrap .jppbr-field{
  display:block;
}

.jppbr-wrap .jppbr-span-2{
  grid-column: span 2;
}

.jppbr-wrap label{
  display:block;
  font-size:13px;
  color:#111827;
  margin: 0 0 6px 2px;
  font-weight:600;
}

.jppbr-wrap input,
.jppbr-wrap select,
.jppbr-wrap textarea{
  display:block;
  width:100%;
  background:#ffffff;
  color:#111827;
  border:1px solid rgba(0,0,0,.18);
  border-radius:12px;
  padding:10px 12px;
  font-size:14px;
  line-height:1.2;
}

.jppbr-wrap textarea{
  min-height:110px;
  resize:vertical;
}

.jppbr-wrap input:focus,
.jppbr-wrap select:focus,
.jppbr-wrap textarea:focus{
  outline: 2px solid rgba(59,130,246,.55);
  outline-offset: 2px;
  border-color: rgba(59,130,246,.55);
}

/* Fix for select looking "invisible": ensure native appearance + arrow space */
.jppbr-wrap select{
  -webkit-appearance: menulist;
  appearance: menulist;
  padding-right: 36px;
}

/* Contact radios */
.jppbr-wrap .jppbr-contact-row{
  display:flex;
  gap:12px;
  align-items:center;
  margin: 2px 0 8px;
  flex-wrap:wrap;
}

.jppbr-wrap .jppbr-radio{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:14px;
  color:#111827;
  padding:8px 10px;
  border:1px solid rgba(0,0,0,.12);
  border-radius:999px;
  background:#f9fafb;
  cursor:pointer;
}

.jppbr-wrap input[type="radio"]{
  display:inline-block;
  width:16px;
  height:16px;
  border-radius:999px;
  border:1px solid rgba(0,0,0,.22);
}

.jppbr-wrap input[type="radio"]:checked{
  box-shadow: inset 0 0 0 5px rgba(59,130,246,.9);
  border-color: rgba(59,130,246,.9);
}

.jppbr-wrap .jppbr-hint{
  display:block;
  font-size:12px;
  color:#6b7280;
  margin-top:6px;
  padding-left:2px;
}

.jppbr-wrap .jppbr-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:100%;
  margin-top:16px;
  border-radius:12px;
  padding:12px 14px;
  background:#111827;
  color:#ffffff;
  font-weight:700;
  cursor:pointer;
}

.jppbr-wrap .jppbr-btn:disabled{
  opacity:.65;
  cursor:not-allowed;
}

.jppbr-wrap .jppbr-msg{
  display:block;
  margin-top:12px;
  font-size:14px;
  line-height:1.35;
  color:#111827;
}

@media (max-width: 720px){
  .jppbr-wrap .jppbr-grid{ grid-template-columns: 1fr; }
  .jppbr-wrap .jppbr-span-2{ grid-column: auto; }
}


/* Required star */
.jppbr-wrap .jppbr-required{ color:#ff0000 !important; font-weight:800; }

.jppbr-wrap .jppbr-terms-label{ display:flex; align-items:flex-start; gap:10px; font-size:14px; color:#111827; line-height:1.35; }
 .jppbr-wrap .jppbr-terms-label input[type="checkbox"]{ width:16px; height:16px; border-radius:3px; border:1px solid rgba(0,0,0,.35); margin-top:2px; -webkit-appearance: checkbox; appearance: checkbox; background:#fff; }