/* ==========================================================
   PUBLIC FORM PAGES — shared design system
   Used by: /enquiry (Views/Enquiry/DefaultEnquiry.cshtml),
            /review  (Views/Review/DefaultReview.cshtml)
   Pattern and class-naming style follow
   Views/Reservation/DefaultReservation.cshtml (the "pf-" prefix
   here is the equivalent of that page's "rsv-" prefix) so all
   three public form pages read as one consistent system.
   ========================================================== */

.pf-wrap {
    max-width: 980px;
    margin: 0 auto;
    padding: 32px 16px 60px;
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 24px;
    align-items: flex-start;
}
@media (max-width:860px) { .pf-wrap { grid-template-columns:1fr; } }

/* Card */
.pf-card { background:var(--m-surface,#fff); border:1px solid var(--m-border,#e2e8f0); border-radius:14px; box-shadow:0 2px 14px rgba(0,0,0,.07); overflow:hidden; }
.pf-card-head { background:var(--m-text-h,#1e293b); color:#fff; padding:20px 24px 18px; }
.pf-card-head h2 { margin:0; font-size:19px; font-weight:700; letter-spacing:-.3px; color:#fff !important; }
.pf-card-head p  { margin:5px 0 0; font-size:13px; color:rgba(255,255,255,.6); }
.pf-card-body { padding:22px 24px 26px; }

/* 2-col field grid */
.pf-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px 18px; }
.pf-full  { grid-column:1/-1; }
@media (max-width:500px) { .pf-grid { grid-template-columns:1fr; } .pf-full { grid-column:1; } }

/* Section divider */
.pf-divider { display:flex; align-items:center; gap:10px; font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.9px; color:var(--m-text2,#94a3b8); }
.pf-divider::after { content:''; flex:1; height:1px; background:var(--m-border,#e2e8f0); }

/* Fields – font-size 16px prevents iOS zoom on focus */
.pf-field { display:flex; flex-direction:column; gap:5px; }
.pf-field > label { font-size:11px; font-weight:700; color:var(--m-text2,#64748b); text-transform:uppercase; letter-spacing:.55px; margin:0; }
.pf-field input:not([type="hidden"]),
.pf-field select,
.pf-field textarea {
    border:1.5px solid var(--m-border,#e2e8f0) !important; border-radius:9px !important;
    height:48px !important; font-size:16px !important; color:var(--m-text,#1e293b) !important;
    background:var(--m-surface,#fff) !important; padding:0 14px !important;
    box-shadow:none !important; outline:none !important;
    transition:border-color .14s, box-shadow .14s !important;
    width:100% !important; box-sizing:border-box !important; -webkit-appearance:none !important;
}
.pf-field textarea { height:auto !important; min-height:88px !important; padding:12px 14px !important; resize:vertical !important; line-height:1.55 !important; }
.pf-field input:focus, .pf-field select:focus, .pf-field textarea:focus {
    border-color:var(--m-accent,#c9973f) !important; box-shadow:0 0 0 3px rgba(201,151,63,.12) !important; background:#fff !important;
}
.pf-field select {
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important;
    background-repeat:no-repeat !important; background-position:right 12px center !important; padding-right:36px !important;
}
.pf-field .valdation-error { color:#dc2626 !important; font-size:11.5px !important; margin:0 !important; }

/* Alert / captcha message */
.pf-alert { background:#fef2f2; border:1px solid #fecaca; border-left:4px solid #ef4444; border-radius:9px; padding:12px 16px; color:#dc2626; font-size:13.5px; font-weight:500; margin-bottom:18px; }

/* Submit */
.pf-submit { width:100%; padding:14px 24px !important; background:var(--m-accent,#c9973f) !important; color:#fff !important; border:none !important; border-radius:10px !important; font-size:16px !important; font-weight:700 !important; cursor:pointer !important; box-shadow:0 3px 12px rgba(201,151,63,.32) !important; transition:opacity .14s !important; height:auto !important; margin-top:4px !important; touch-action:manipulation; }
.pf-submit:hover  { opacity:.9 !important; }
.pf-submit:active { transform:scale(.99); }

/* Info sidebar (contact details, tips) */
.pf-info { padding:20px; }
.pf-info h3 { font-size:13.5px; font-weight:700; color:var(--m-text-h,#1e293b); margin:0 0 14px; }
.pf-info h3 .fa { color:var(--m-accent,#c9973f); font-size:14px; margin-right:7px; vertical-align:middle; position:relative; top:-1px; }
.pf-tip { display:flex; gap:12px; background:var(--m-surface-alt,#f8fafc); border:1px solid var(--m-border,#e2e8f0); border-radius:9px; padding:11px 13px; margin-bottom:10px; font-size:13px; color:var(--m-text2,#64748b); line-height:1.55; }
.pf-tip:last-child { margin-bottom:0; }
.pf-tip-icon { width:16px; min-width:16px; height:20px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.pf-tip-icon .fa { color:var(--m-accent,#c9973f); font-size:14px; line-height:1; display:block; }

/* Map */
.pf-map { width:100%; height:220px; border-radius:9px; overflow:hidden; border:1px solid var(--m-border,#e2e8f0); }

/* Review list */
.pf-review-list { display:flex; flex-direction:column; gap:14px; }
.pf-review-item { background:var(--m-surface-alt,#f8fafc); border:1px solid var(--m-border,#e2e8f0); border-radius:11px; padding:16px 18px; }
.pf-review-item h3 { margin:0 0 6px; font-size:15px; font-weight:700; color:var(--m-text-h,#1e293b); }
.pf-review-stars { color:var(--m-accent,#c9973f); font-size:15px; letter-spacing:2px; margin-bottom:4px; }
.pf-review-date { font-size:11.5px; color:var(--m-text2,#94a3b8); font-style:normal; display:block; margin-bottom:8px; }
.pf-review-item p { margin:0; font-size:13.5px; color:var(--m-text2,#475569); line-height:1.6; }
.pf-review-empty { padding:24px; text-align:center; color:var(--m-text2,#94a3b8); font-size:13.5px; }

/* Success page */
.pf-success { max-width:520px; margin:60px auto; text-align:center; padding:0 16px; }
.pf-success .fa { font-size:44px; color:#16a34a; margin-bottom:14px; }
.pf-success h2 { margin:0 0 8px; font-size:22px; font-weight:700; color:var(--m-text-h,#1e293b); }
.pf-success h3 { margin:0; font-size:14px; font-weight:500; color:var(--m-text2,#64748b); }