/* ============================================================
   CUT N CARE — Booking Modal Styles
   ============================================================ */

/* Overlay */
.bm-overlay {
  display:none; position:fixed; inset:0; z-index:10000;
  background:rgba(0,0,0,0.84); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  align-items:center; justify-content:center; padding:20px; overflow-y:auto;
}
.bm-overlay.open { display:flex; animation:bmFadeIn 0.22s ease; }
@keyframes bmFadeIn { from { opacity:0 } to { opacity:1 } }

/* Panel */
.bm-panel {
  background:#111111; border:1px solid rgba(201,168,76,0.38); border-radius:4px;
  width:100%; max-width:700px; position:relative;
  box-shadow:0 32px 80px rgba(0,0,0,0.85), 0 0 0 1px rgba(201,168,76,0.07);
  animation:bmSlideUp 0.35s cubic-bezier(0.22,1,0.36,1);
}
@keyframes bmSlideUp {
  from { opacity:0; transform:translateY(30px) scale(0.97) }
  to   { opacity:1; transform:translateY(0)   scale(1)    }
}

/* Close */
.bm-close {
  position:absolute; top:16px; right:16px;
  width:34px; height:34px; border-radius:50%;
  background:none; border:none; cursor:pointer;
  color:rgba(255,255,255,0.3); font-size:0.9rem;
  display:flex; align-items:center; justify-content:center;
  transition:color 0.2s, background 0.2s;
}
.bm-close:hover { color:var(--gold); background:rgba(201,168,76,0.1); }

/* Header */
.bm-header {
  padding:36px 36px 24px; border-bottom:1px solid rgba(255,255,255,0.05);
}
.bm-eyebrow {
  font-size:0.58rem; letter-spacing:4px; text-transform:uppercase; font-weight:600;
  color:var(--gold); display:block; margin-bottom:10px; font-family:'Montserrat',sans-serif;
}
.bm-title {
  font-family:'Cormorant Garamond', Georgia, serif;
  font-size:clamp(1.9rem,4vw,2.6rem); color:#fff; font-weight:400; line-height:1.1;
}
.bm-title em { font-style:italic; color:var(--gold); }
.bm-rule { width:42px; height:1.5px; background:var(--gold); margin-top:14px; }

/* Body */
.bm-body { padding:28px 36px 36px; display:flex; flex-direction:column; gap:18px; }
.bm-row { display:flex; gap:18px; }
.bm-row-2 > .bm-field { flex:1 1 0; min-width:0; }

/* Fields */
.bm-field { display:flex; flex-direction:column; gap:7px; }
.bm-field label {
  font-size:0.62rem; letter-spacing:1.5px; text-transform:uppercase;
  font-weight:600; color:rgba(255,255,255,0.42); font-family:'Montserrat',sans-serif;
}
.bm-field label .bm-req { color:var(--gold); }
.bm-field label .bm-opt { color:rgba(255,255,255,0.2); font-weight:400; text-transform:none; letter-spacing:0; }

.bm-field input,
.bm-field select,
.bm-field textarea {
  background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.1);
  border-radius:2px; color:#fff; font-family:'Montserrat',sans-serif; font-size:0.82rem;
  padding:12px 14px; transition:border-color 0.2s, box-shadow 0.2s; outline:none; width:100%;
  -webkit-appearance:none;
}
.bm-field input::placeholder,
.bm-field textarea::placeholder { color:rgba(255,255,255,0.18); }
.bm-field select {
  cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='7' viewBox='0 0 12 7'%3E%3Cpath fill='none' stroke='%23c9a84c' stroke-width='1.5' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center; padding-right:36px;
}
.bm-field select option,
.bm-field select optgroup { background:#1a1a1a; color:#fff; }
.bm-field input:focus,
.bm-field select:focus,
.bm-field textarea:focus { border-color:rgba(201,168,76,0.65); box-shadow:0 0 0 3px rgba(201,168,76,0.1); }
.bm-field input[type="date"]::-webkit-calendar-picker-indicator { filter:invert(0.6) sepia(1) hue-rotate(10deg); cursor:pointer; }
.bm-field textarea { resize:vertical; min-height:80px; }

/* Note */
.bm-note {
  font-size:0.72rem; color:rgba(255,255,255,0.28); line-height:1.65;
  background:rgba(255,255,255,0.02); border-left:2px solid rgba(201,168,76,0.35);
  padding:10px 14px; border-radius:0 2px 2px 0; display:flex; align-items:flex-start; gap:8px;
}
.bm-note i { color:var(--wa); font-size:1rem; flex-shrink:0; margin-top:1px; }
.bm-note strong { color:rgba(255,255,255,0.45); }

/* Submit */
.bm-submit {
  display:flex; align-items:center; justify-content:center; gap:10px;
  background:var(--wa); color:#fff; border:none; border-radius:2px; cursor:pointer;
  font-family:'Montserrat',sans-serif; font-size:0.72rem; font-weight:700;
  letter-spacing:2.5px; text-transform:uppercase; padding:16px 32px;
  transition:background 0.25s ease, transform 0.2s ease, box-shadow 0.25s ease;
  width:100%; margin-top:4px;
}
.bm-submit:hover {
  background:#1ebe5b; transform:translateY(-2px);
  box-shadow:0 8px 28px rgba(37,211,102,0.4);
}
.bm-submit i { font-size:1.1rem; }

/* Error shake */
@keyframes bmShake {
  0%,100% { transform:translateX(0) }
  20%,60%  { transform:translateX(-6px) }
  40%,80%  { transform:translateX( 6px) }
}
.bm-field.bm-error input,
.bm-field.bm-error select,
.bm-field.bm-error textarea {
  border-color:#e05050; box-shadow:0 0 0 3px rgba(224,80,80,0.15);
  animation:bmShake 0.4s ease;
}

/* Responsive */
@media (max-width:560px) {
  .bm-header { padding:24px 20px 18px; }
  .bm-body   { padding:20px 20px 24px; gap:14px; }
  .bm-row-2  { flex-direction:column; }
  .bm-title  { font-size:1.75rem; }
}
