/* ==========================================================================
   Sundar Marriage Services — Enquiry modal (new, AJAX-driven)
   Uses the same design tokens defined in css/style.css so it matches the
   rest of the site exactly. Kept in its own file so the original mirrored
   CSS is never touched.
   ========================================================================== */

/* Compact by design: every layout below is sized to fit the viewport, so the
   panel never needs a scrollbar. Field errors sit in the row gap (absolutely
   positioned) so showing them never changes the panel height. */

.enq-modal{
  position:fixed; inset:0; z-index:1000;
  display:flex; align-items:center; justify-content:center;
  padding:16px;
  opacity:0; visibility:hidden;
  transition:opacity .3s var(--ease,ease), visibility .3s;
}
.enq-modal.is-open{ opacity:1; visibility:visible; }

.enq-modal__backdrop{
  position:absolute; inset:0;
  background:rgba(22,21,26,.62);
  backdrop-filter:blur(2px);
}

.enq-modal__panel{
  position:relative;
  width:100%; max-width:460px;
  max-height:calc(100vh - 32px); max-height:calc(100dvh - 32px);
  /* last-resort safety net for freakishly small screens: still reachable, never a visible scrollbar */
  overflow-y:auto; overscroll-behavior:contain;
  scrollbar-width:none; -ms-overflow-style:none;
  background:var(--cream-2,#fff);
  border-radius:20px;
  padding:26px 26px 22px;
  box-shadow:var(--shadow-lg,0 22px 48px rgba(0,0,0,.25));
  transform:translateY(24px) scale(.98);
  transition:transform .35s var(--ease,ease);
}
.enq-modal__panel::-webkit-scrollbar{ display:none; }
.enq-modal__panel::before{
  content:""; position:absolute; inset:0 0 auto; height:4px;
  background:linear-gradient(90deg,var(--maroon,#8E1043),var(--pink,#D21C72) 55%,var(--gold-400,#E3B15C));
}
.enq-modal.is-open .enq-modal__panel{ transform:translateY(0) scale(1); }

.enq-modal__close{
  position:absolute; top:14px; right:14px; z-index:1;
  width:34px; height:34px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:var(--peach,#FAE2D2); color:var(--maroon,#8E1043);
  font-size:15px; cursor:pointer; border:0;
  transition:background .25s ease, transform .35s var(--ease,ease);
}
.enq-modal__close:hover{ background:var(--gold-300,#F0CE7E); transform:rotate(90deg); }

.enq-modal__head{ text-align:center; margin-bottom:16px; }
.enq-modal__eyebrow{ font-size:11.5px; letter-spacing:2.6px; gap:14px; margin-bottom:3px; }
.enq-modal__head h3{
  font-family:var(--ff-serif,serif);
  font-size:22px; line-height:1.2; margin:0 0 4px; color:var(--ink,#16151A);
}
.enq-modal__sub{ color:var(--body,#5E5C63); font-size:13px; line-height:1.5; }

.enq-form__honeypot{ position:absolute !important; left:-9999px !important; top:-9999px !important; }

/* ---------- fields (floating labels) ---------- */
.enq-form__grid{
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 12px;
}
.enq-field{ position:relative; min-width:0; }
.enq-field--wide{ grid-column:1 / -1; }

.enq-field__input{
  display:block; width:100%; height:50px; margin:0;
  font-family:var(--ff-sans,inherit); font-size:14px; line-height:1.3;
  padding:20px 12px 5px 40px; border-radius:12px;
  border:1.5px solid rgba(94,92,99,.2);
  background:#fff; color:var(--ink,#16151A);
  transition:border-color .25s ease, box-shadow .25s ease;
}
.enq-field__input::placeholder{ color:transparent; transition:color .2s ease; }
.enq-field__input:focus::placeholder{ color:#B5B1BA; }
.enq-field__input:hover{ border-color:rgba(142,16,67,.35); }
.enq-field__input:focus{
  outline:none; border-color:var(--maroon,#8E1043);
  box-shadow:0 0 0 3px rgba(142,16,67,.12);
}
.enq-field__input[type="date"]{ min-width:0; }
.enq-field__input[type="date"]::-webkit-date-and-time-value{ text-align:left; }
.enq-field__input[type="date"]::-webkit-calendar-picker-indicator{ opacity:.55; cursor:pointer; }
textarea.enq-field__input{
  height:76px; resize:none; padding-top:22px;
  scrollbar-width:none; -ms-overflow-style:none;
}
textarea.enq-field__input::-webkit-scrollbar{ display:none; }

.enq-field__label{
  position:absolute; left:40px; right:10px; top:15px;
  font-size:13.5px; line-height:20px; font-weight:500; color:#8C8992;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  pointer-events:none;
  transition:top .2s ease, font-size .2s ease, line-height .2s ease, color .2s ease, letter-spacing .2s ease;
}
.enq-field__label span{ color:var(--pink,#D21C72); }
.enq-field__input:focus + .enq-field__label,
.enq-field__input:not(:placeholder-shown) + .enq-field__label{
  top:6px; font-size:10.5px; line-height:14px; font-weight:600; letter-spacing:.4px;
  text-transform:uppercase; color:var(--body,#5E5C63);
}
.enq-field__input:focus + .enq-field__label{ color:var(--maroon,#8E1043); }

.enq-field__icon{
  position:absolute; left:14px; top:17px;
  width:16px; text-align:center; font-size:14px; line-height:16px;
  color:var(--gold-600,#B9762E); pointer-events:none; transition:color .25s ease;
}
.enq-field__input:focus ~ .enq-field__icon{ color:var(--maroon,#8E1043); }

.enq-form__error{
  position:absolute; left:12px; right:4px; top:100%; margin-top:2px;
  font-size:11px; line-height:14px; color:#C0263A;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.enq-field:has(.enq-form__error:not(:empty)) .enq-field__input{ border-color:#C0263A; }
.enq-field:has(.enq-form__error:not(:empty)) .enq-field__icon{ color:#C0263A; }

/* ---------- submit + status ---------- */
.enq-form__submit{ width:100%; height:48px; padding-block:0; justify-content:center; margin-top:18px; }
.enq-form__submit[disabled]{ opacity:.65; cursor:progress; }

.enq-form__status{
  margin:10px 0 0; font-size:13px; line-height:1.4; text-align:center;
}
.enq-form__status:empty{ display:none; }
.enq-form__status.is-success{ color:#1C7C3C; font-weight:600; }
.enq-form__status.is-error{ color:#C0263A; font-weight:600; }

/* ---------- phones: phone & email get full rows ---------- */
@media (max-width:520px){
  .enq-modal{ padding:12px; }
  .enq-modal__panel{
    max-height:calc(100vh - 24px); max-height:calc(100dvh - 24px);
    padding:24px 18px 18px; border-radius:18px;
  }
  .enq-modal__head{ margin-bottom:14px; }
  .enq-modal__eyebrow{ font-size:11px; letter-spacing:2.2px; }
  .enq-modal__head h3{ font-size:20px; }
  .enq-modal__sub{ font-size:12.5px; }
  .enq-form__grid{ gap:16px 10px; }
  .enq-field--stack{ grid-column:1 / -1; }
  /* half-width date: the native picker icon is enough, give the value the room */
  .enq-field--date .enq-field__icon{ display:none; }
  .enq-field--date .enq-field__input{ padding-left:12px; padding-right:8px; font-size:13.5px; }
  .enq-field--date .enq-field__label{ left:12px; }
  textarea.enq-field__input{ height:64px; }
  .enq-form__submit{ height:46px; margin-top:16px; }
}

/* ---------- short screens (landscape phones, small laptops at high zoom) ---------- */
@media (max-height:640px){
  .enq-modal{ padding:10px; }
  .enq-modal__panel{
    max-height:calc(100vh - 20px); max-height:calc(100dvh - 20px);
    padding:18px 20px 16px;
  }
  .enq-modal__close{ top:12px; right:12px; width:30px; height:30px; font-size:13px; }
  .enq-modal__head{ text-align:left; padding-right:40px; margin-bottom:12px; }
  .enq-modal__eyebrow,
  .enq-modal__sub{ display:none; }
  .enq-modal__head h3{ font-size:19px; margin:0; }

  .enq-form__grid{ gap:16px 10px; }
  .enq-field__input,
  textarea.enq-field__input{ height:44px; padding-top:17px; padding-bottom:3px; }
  .enq-field__label{ top:12px; }
  .enq-field__input:focus + .enq-field__label,
  .enq-field__input:not(:placeholder-shown) + .enq-field__label{ top:4px; }
  .enq-field__icon{ top:14px; }
  .enq-form__submit{ height:44px; margin-top:16px; }
  .enq-form__status{ margin-top:8px; }
}
@media (max-height:640px) and (min-width:521px){
  /* wide enough: flow everything into two columns (name|phone, email|date, service|message) */
  .enq-modal__panel{ max-width:600px; }
  .enq-field--wide{ grid-column:auto; }
}
@media (max-height:380px){
  .enq-modal__panel{ padding:14px 18px 12px; }
  .enq-modal__head{ margin-bottom:10px; }
  .enq-modal__head h3{ font-size:17px; }
  .enq-form__grid{ gap:14px 10px; }
  .enq-form__error{ margin-top:0; }
  .enq-field__input,
  textarea.enq-field__input{ height:42px; }
  .enq-form__submit{ height:42px; margin-top:14px; }
}

/* prevent background scroll while modal is open */
body.enq-lock{ overflow:hidden; }

/* ==========================================================================
   Static content pages (About Us / Privacy Policy / Terms & Conditions) —
   basic typography for the admin's rich-text (Quill) HTML output.
   ========================================================================== */
.static-page-content{ padding:20px 0 60px; color:var(--body,#5E5C63); font-size:15.5px; line-height:1.8; }
.static-page-content h2{
  font-family:var(--ff-serif,serif); color:var(--ink,#16151A); font-size:24px;
  margin:34px 0 12px;
}
.static-page-content h2:first-child{ margin-top:0; }
.static-page-content h3{ font-family:var(--ff-serif,serif); color:var(--ink,#16151A); font-size:19px; margin:24px 0 10px; }
.static-page-content p{ margin:0 0 16px; }
.static-page-content ul, .static-page-content ol{ margin:0 0 16px; padding-left:22px; }
.static-page-content li{ margin-bottom:8px; }
.static-page-content a{ color:var(--maroon,#8E1043); text-decoration:underline; }
.static-page-content strong{ color:var(--ink,#16151A); }
.static-page-content blockquote{
  margin:20px 0; padding:14px 20px; border-left:3px solid var(--gold,#D9A441);
  background:var(--cream,#FBF6EF); border-radius:0 10px 10px 0; font-style:italic;
}
.static-page-content img{ max-width:100%; border-radius:12px; margin:16px 0; }
