/* ══════════════════════════════════════════
   PUGAIPPADAM PHOTOGRAPHY — Booking Form
   Brand palette from logo:
   #E8897A  Salmon (film strip primary)
   #C96B5A  Dark salmon
   #F4AFA6  Light salmon / blush
   #FDF4F2  Cream background
   #1A1A1A  Ink / text
══════════════════════════════════════════ */

.pugai-booking-wrap {
  --p      : #E8897A;
  --pd     : #C96B5A;
  --pl     : #F4AFA6;
  --pdim   : rgba(232,137,122,.12);
  --cream  : #FDF4F2;
  --white  : #FFFFFF;
  --ink    : #1A1A1A;
  --ink2   : #3D3632;
  --gray   : #6B6460;
  --gray2  : #9A9490;
  --border : #EDE5E2;
  --border2: #D9CFCB;
  --green  : #3D9E6A;
  --blue   : #4175B5;
  --red    : #C94040;
  font-family: 'Segoe UI', -apple-system, Roboto, sans-serif;
  color: var(--ink);
  background: var(--cream);
  min-height: 100vh;
}
.pugai-booking-wrap * { box-sizing: border-box; margin: 0; padding: 0; }

/* ── Studio header ── */
.pugai-bk-header {
  background: linear-gradient(150deg, #0E0C0B 0%, #2A1F1A 100%);
  padding: 40px 24px 32px;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.pugai-bk-header::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 50% -10%, rgba(232,137,122,.2), transparent 60%);
}
.pugai-bk-logo-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-bottom: 12px;
  position: relative;
}
.pugai-bk-logo {
  height: 64px;
  object-fit: contain;
  filter: drop-shadow(0 2px 8px rgba(0,0,0,.4));
}
.pugai-bk-studio-name {
  font-size: 26px;
  font-weight: 800;
  color: var(--pl);
  letter-spacing: .5px;
  line-height: 1.1;
}
.pugai-bk-tagline {
  font-size: 11px;
  color: rgba(240,237,232,.4);
  letter-spacing: 3px;
  text-transform: uppercase;
  margin-top: 4px;
}
.pugai-bk-subtitle {
  font-size: 15px;
  color: rgba(240,237,232,.55);
  position: relative;
}

/* ── Layout ── */
.pugai-bk-layout {
  max-width: 1040px;
  margin: 0 auto;
  padding: 28px 16px 48px;
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 22px;
  align-items: start;
}
@media (max-width: 768px) {
  .pugai-bk-layout { grid-template-columns: 1fr; padding: 16px; }
  .pugai-bk-right { position: static !important; }
}

/* ── Section titles ── */
.pugai-bk-section-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--ink);
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.pugai-bk-section-title::before {
  content: '';
  display: block;
  width: 4px;
  height: 20px;
  background: var(--p);
  border-radius: 2px;
}

/* ── Service cards ── */
.pugai-bk-svc-err {
  background: rgba(201,64,64,.08);
  border: 1px solid rgba(201,64,64,.25);
  border-radius: 7px;
  padding: 10px 14px;
  font-size: 13px;
  color: var(--red);
  margin-bottom: 12px;
}
.pugai-bk-svc-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 14px;
  box-shadow: 0 1px 4px rgba(0,0,0,.05);
}
.pugai-bk-cat-hdr {
  padding: 9px 18px;
  background: #FAF6F3;
  border-bottom: 1px solid var(--border);
  font-size: 10px;
  font-weight: 700;
  color: #9A8472;
  text-transform: uppercase;
  letter-spacing: 2.5px;
}
.pugai-bk-svc-item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 14px 18px;
  border-bottom: 1px solid #F7F2EF;
  cursor: pointer;
  transition: background .12s;
  user-select: none;
}
.pugai-bk-svc-item:last-child { border-bottom: none; }
.pugai-bk-svc-item:hover { background: #FEF9F7; }
.pugai-bk-svc-item.selected { background: rgba(232,137,122,.06); }

.pugai-bk-chk {
  width: 22px;
  height: 22px;
  border-radius: 6px;
  border: 2px solid var(--border2);
  flex-shrink: 0;
  margin-top: 1px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .15s;
  background: var(--white);
}
.pugai-bk-chk.checked {
  background: var(--p);
  border-color: var(--p);
  box-shadow: 0 2px 8px rgba(232,137,122,.4);
}

.pugai-bk-svc-info { flex: 1; min-width: 0; }
.pugai-bk-svc-name { font-size: 14px; color: var(--ink); font-weight: 600; margin-bottom: 3px; line-height: 1.3; }
.pugai-bk-svc-desc { font-size: 11px; color: var(--gray2); line-height: 1.5; }
.pugai-bk-svc-price { font-size: 15px; font-weight: 800; color: var(--p); margin-left: auto; flex-shrink: 0; padding-top: 1px; white-space: nowrap; }

/* ── Client details form ── */
.pugai-bk-form-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 1px 4px rgba(0,0,0,.05);
}
.pugai-bk-form-hdr {
  padding: 13px 18px;
  border-bottom: 1px solid var(--border);
  font-size: 13px;
  font-weight: 700;
  color: var(--ink);
  background: #FAF6F3;
}
.pugai-bk-form-body { padding: 18px; }
.pugai-bk-form-err {
  background: rgba(201,64,64,.06);
  border: 1px solid rgba(201,64,64,.2);
  border-radius: 7px;
  padding: 10px 13px;
  font-size: 12px;
  color: var(--red);
  margin-bottom: 13px;
}
.pugai-bk-fg { margin-bottom: 13px; }
.pugai-bk-fl {
  display: block;
  font-size: 11px;
  color: var(--gray);
  margin-bottom: 4px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .4px;
}
.pugai-bk-fi {
  width: 100%;
  padding: 10px 13px;
  background: #FAF6F3;
  border: 1px solid var(--border2);
  border-radius: 7px;
  color: var(--ink);
  font-family: inherit;
  font-size: 13px;
  outline: none;
  transition: all .15s;
}
.pugai-bk-fi:focus { border-color: var(--p); background: var(--white); box-shadow: 0 0 0 3px rgba(232,137,122,.1); }
.pugai-bk-fi::placeholder { color: var(--gray2); }
select.pugai-bk-fi option { background: var(--white); }
textarea.pugai-bk-fi { resize: vertical; min-height: 80px; }
.pugai-bk-fi.err { border-color: var(--red) !important; }
.pugai-bk-fr2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 480px) { .pugai-bk-fr2 { grid-template-columns: 1fr; } }

/* ── Pincode / travel ── */
.pugai-pin-badge-chennai { background: rgba(61,158,106,.12); color: var(--green); border: 1px solid rgba(61,158,106,.25); padding: 4px 12px; border-radius: 20px; font-size: 12px; font-weight: 600; }
.pugai-pin-badge-travel  { background: var(--pdim); color: var(--pd); border: 1px solid rgba(232,137,122,.3); padding: 4px 12px; border-radius: 20px; font-size: 12px; font-weight: 600; }
.pugai-bk-travel-notice {
  background: rgba(65,117,181,.07);
  border: 1px solid rgba(65,117,181,.22);
  border-radius: 7px;
  padding: 10px 13px;
  font-size: 12px;
  color: var(--blue);
  margin-top: 8px;
  line-height: 1.6;
}

/* ── Right sticky panel ── */
.pugai-bk-right { position: sticky; top: 20px; }
.pugai-summary-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 16px rgba(0,0,0,.07);
}
.pugai-summary-hdr {
  padding: 16px 18px;
  background: linear-gradient(135deg, #1A0F0B, #2E1C14);
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  font-weight: 700;
  color: var(--pl);
}
.pugai-summary-logo { height: 32px; object-fit: contain; }
.pugai-summary-body { padding: 16px 18px; }
.pugai-sum-empty { font-size: 13px; color: var(--gray2); text-align: center; padding: 16px 0; line-height: 1.5; }

/* Summary item rows */
.pugai-sum-item { display: flex; justify-content: space-between; align-items: flex-start; font-size: 13px; color: var(--gray); margin-bottom: 7px; gap: 10px; line-height: 1.3; }
.pugai-sum-item span:last-child { color: var(--pd); font-weight: 700; flex-shrink: 0; }
.pugai-sum-divider { height: 1px; background: var(--border); margin: 12px 0; }
.pugai-sum-row { display: flex; justify-content: space-between; font-size: 12px; color: var(--gray2); margin-bottom: 5px; }
.pugai-sum-travel { display: flex; justify-content: space-between; font-size: 12px; color: var(--blue); margin-bottom: 5px; }
.pugai-sum-grand { display: flex; justify-content: space-between; font-size: 17px; font-weight: 800; color: var(--ink); border-top: 2px solid var(--border); margin-top: 8px; padding-top: 10px; }
.pugai-sum-grand span:last-child { color: var(--p); }
.pugai-sum-advance { font-size: 11px; color: var(--green); text-align: right; margin-top: 5px; }

/* Submit */
.pugai-submit-btn {
  width: 100%;
  padding: 13px;
  background: linear-gradient(135deg, var(--p), var(--pd));
  color: var(--white);
  border: none;
  border-radius: 8px;
  font-family: inherit;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition: all .2s;
  margin-top: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  letter-spacing: .3px;
  box-shadow: 0 3px 12px rgba(232,137,122,.35);
}
.pugai-submit-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(232,137,122,.45); }
.pugai-submit-btn:active { transform: translateY(0); }
.pugai-submit-btn:disabled { opacity: .6; cursor: not-allowed; transform: none; box-shadow: none; }
.pugai-submit-note { font-size: 11px; color: var(--gray2); text-align: center; margin-top: 10px; line-height: 1.6; }

/* ── Success screen ── */
.pugai-success-screen { display: flex; align-items: center; justify-content: center; min-height: 60vh; padding: 40px 20px; }
.pugai-success-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 44px 36px;
  text-align: center;
  max-width: 520px;
  width: 100%;
  box-shadow: 0 6px 30px rgba(0,0,0,.08);
}
.pugai-success-checkmark {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--p), var(--pd));
  color: var(--white);
  font-size: 28px;
  font-weight: 900;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
  box-shadow: 0 4px 20px rgba(232,137,122,.4);
}
.pugai-success-title { font-size: 26px; font-weight: 800; color: var(--ink); margin-bottom: 10px; }
.pugai-success-msg   { font-size: 14px; color: var(--gray); line-height: 1.7; margin-bottom: 22px; }
.pugai-success-summary {
  background: var(--cream);
  border: 1px solid var(--border);
  border-radius: 9px;
  padding: 16px;
  text-align: left;
  margin-bottom: 22px;
  font-size: 13px;
}
.pugai-success-summary-row { display: flex; justify-content: space-between; margin-bottom: 6px; color: var(--gray); }
.pugai-success-summary-row strong { color: var(--p); }
.pugai-success-divider { height: 1px; background: var(--border); margin: 10px 0; }
.pugai-success-total { display: flex; justify-content: space-between; font-weight: 800; font-size: 15px; color: var(--ink); }
.pugai-success-total span:last-child { color: var(--p); }
.pugai-wa-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 24px;
  background: #25D366;
  color: var(--white);
  border-radius: 8px;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  transition: all .15s;
  box-shadow: 0 2px 10px rgba(37,211,102,.3);
}
.pugai-wa-btn:hover { background: #20B358; transform: translateY(-1px); }

/* ── Loading spinner ── */
.pugai-spinner { display: inline-block; width: 16px; height: 16px; border: 2px solid rgba(255,255,255,.4); border-top-color: #fff; border-radius: 50%; animation: spin .7s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
