/* Portrait Public Panel — mobile-first (brief Phase 2: phones are the
   PRIMARY target for this surface; desktop enhances). Skeleton rows render
   a lock treatment over NOTHING — locked evidence never reaches the page. */

.pp-search, .pp-report { max-width: 100%; font-size: 16px; }

/* search */
.pp-searchbox { position: relative; }
.pp-input {
  width: 100%; padding: 14px 16px; font-size: 16px; border: 2px solid #d5dbe4;
  border-radius: 10px; outline: none; transition: border-color .2s, box-shadow .2s;
  box-sizing: border-box; background: #fff;
}
.pp-input:focus { border-color: #253c58; box-shadow: 0 0 0 3px rgba(37,60,88,.15); }

/* item 7 — the search field is the page's primary call-to-action: a bold
   amber pill, larger and more inviting than a plain input. */
.pp-searchbox .pp-input {
  padding: 18px 26px; font-size: 17px; font-weight: 500;
  border: 3px solid #FFBF00; border-radius: 999px;
  box-shadow: 0 8px 26px rgba(16,24,40,.22);
}
.pp-searchbox .pp-input::placeholder { color: #9aa4b2; font-weight: 400; }
.pp-searchbox .pp-input:focus {
  border-color: #FFBF00;
  box-shadow: 0 0 0 4px rgba(255,191,0,.28), 0 8px 26px rgba(16,24,40,.22);
}
/* Overlay dropdown: absolutely positioned under the input so it floats over
   following content instead of expanding the container / pushing the page
   down. Internal scroll (max-height + overflow-y) preserved. z-index sits
   above page content but well below fixed chat/overlay widgets (z ~9999+). */
/* Some Elementor CTA containers set isolation:isolate, which creates a stacking
   context that trapped the results dropdown BENEATH a fixed footer bar (z:1500).
   Free any container that holds a search widget so the dropdown can rise. */
.e-con:has(.pp-search) { isolation: auto; }
.pp-dropdown {
  /* z sits above page content + the fixed footer bar (1500) but below fixed
     chat/overlay widgets (~9999). */
  position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 2000;
  background: #fff; border: 1px solid #d5dbe4;
  border-radius: 10px; box-shadow: 0 12px 30px rgba(16,24,40,.14);
  /* Outer rounded shell CLIPS its content (incl. the scrollbar's visual
     bounds) to the rounded corners — removes the white sliver a square
     native scrollbar left against the radius. Scroll lives on the inner. */
  overflow: hidden;
}
.pp-dropdown-scroll {
  max-height: 60vh; overflow-y: auto; -webkit-overflow-scrolling: touch;
  /* Neat scrollbar that sits flush (belt-and-braces with the clip above). */
  scrollbar-width: thin; scrollbar-color: #c7cfda transparent;
}
.pp-dropdown-scroll::-webkit-scrollbar { width: 9px; }
.pp-dropdown-scroll::-webkit-scrollbar-track { background: transparent; }
.pp-dropdown-scroll::-webkit-scrollbar-thumb {
  background: #c7cfda; border-radius: 8px; border: 2px solid #fff;
}
@media (max-width: 480px) {
  /* Small screens: keep the overlay within the viewport height. */
  .pp-dropdown-scroll { max-height: 55vh; }
}
.pp-drop-row {
  display: flex; flex-direction: column; gap: 2px; width: 100%; text-align: left;
  padding: 12px 14px; border: 0; border-bottom: 1px solid #eef1f5; background: #fff;
  cursor: pointer; transition: background .15s;
}
.pp-drop-row:hover, .pp-drop-row:focus { background: #f4f7fb; }
.pp-drop-addr { font-weight: 600; color: #1a2233; }
.pp-drop-desc { font-size: 13px; color: #5c6675; }
.pp-drop-empty { padding: 14px; color: #5c6675; font-size: 14px; }
.pp-badge {
  align-self: flex-start; margin-top: 4px; padding: 2px 9px; border-radius: 999px;
  font-size: 12px; font-weight: 600;
}
.pp-badge-saving { background: #e7f7ef; color: #157a4c; }
.pp-badge-neutral { background: #eef1f5; color: #5c6675; }
.pp-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.pp-chip {
  display: inline-flex; align-items: center; gap: 6px; background: #253c58; color: #fff;
  padding: 6px 8px 6px 12px; border-radius: 999px; font-size: 13px;
  animation: pp-pop .25s ease;
}
/* item 5 — the remove (×) glyph flex-centred in its oval. */
.pp-chip-x {
  border: 0; background: rgba(255,255,255,.25); color: #fff; border-radius: 50%;
  width: 20px; height: 20px; padding: 0; line-height: 1; cursor: pointer;
  font-size: 15px; display: inline-flex; align-items: center; justify-content: center;
  flex: 0 0 auto;
}
/* item 6 — give the primary button's amber glow room to fall off softly. */
.pp-actions { margin-top: 14px; padding-bottom: 18px; }
.pp-cap-note { margin-top: 10px; font-size: 13px; color: #8a5b00; background: #fff7e6; border-radius: 8px; padding: 10px 12px; }
.pp-btn {
  border: 0; border-radius: 10px; padding: 14px 22px; font-size: 16px; font-weight: 700;
  cursor: pointer; transition: transform .12s ease, box-shadow .2s; width: 100%;
}
.pp-btn:active { transform: scale(.98); }
.pp-btn-primary { background: #FFC53D; color: #1a2233; box-shadow: 0 6px 24px rgba(255,191,0,.45), 0 2px 8px rgba(255,191,0,.22); }
.pp-btn-primary:hover { box-shadow: 0 10px 32px rgba(255,191,0,.55), 0 3px 10px rgba(255,191,0,.3); }

/* progress */
.pp-progress { height: 4px; border-radius: 4px; background: #eef1f5; overflow: hidden; margin-top: 8px; }
/* item 4 — brand amber loading bar, matching the platform's other
   progress indicators. */
.pp-progress-bar {
  height: 100%; width: 38%; border-radius: 4px; background: linear-gradient(90deg,#FFBF00,#FFD24D);
  animation: pp-indeterminate 1.1s ease-in-out infinite;
}
.pp-loader { padding: 26px 0; }
.pp-loader-title { font-size: 17px; font-weight: 600; color: #1a2233; margin-bottom: 10px; }

/* report cards */
.pp-card {
  background: #fff; border: 1px solid #e4e8ee; border-radius: 14px; padding: 18px;
  margin: 14px 0; box-shadow: 0 2px 10px rgba(16,24,40,.05);
}
.pp-fade { opacity: 0; transform: translateY(10px); animation: pp-in .45s ease forwards; }
.pp-agg-head { font-size: 14px; text-transform: uppercase; letter-spacing: .06em; color: #5c6675; }
.pp-agg-rv { font-size: 22px; font-weight: 800; color: #1a2233; margin: 4px 0 8px; }
.pp-addr { font-size: 19px; margin: 0 0 2px; color: #1a2233; }
.pp-desc { color: #5c6675; font-size: 14px; margin-bottom: 8px; }
.pp-facts { display: flex; flex-wrap: wrap; gap: 14px; font-size: 14px; color: #38404d; margin-bottom: 10px; }
.pp-pill { border-radius: 10px; padding: 10px 14px; font-size: 15px; margin-top: 4px; }
.pp-pill-saving { background: #e7f7ef; color: #11603c; font-weight: 700; }
.pp-pill-cta { background: #eef4ff; color: #24457a; }
.pp-pill-cta a { color: #24457a; font-weight: 700; }
.pp-opps { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 2px; }
.pp-opp { background: #fff2d6; color: #7a5200; border-radius: 999px; padding: 4px 12px; font-size: 13px; font-weight: 600; }
.pp-h3 { font-size: 16px; margin: 18px 0 8px; color: #1a2233; }

/* teaser tables + skeletons */
.pp-tease { overflow-x: auto; }
.pp-table { width: 100%; border-collapse: collapse; font-size: 13px; min-width: 480px; }
.pp-table th {
  text-align: left; padding: 8px; color: #5c6675; font-weight: 600;
  border-bottom: 2px solid #e4e8ee; white-space: nowrap;
}
.pp-table td { padding: 9px 8px; border-bottom: 1px solid #eef1f5; color: #1a2233; }
.pp-row-real { background: #fbfdff; }
/* deliberately-locked rows: static (no animation) so they never read as "loading" */
.pp-row-locked td { padding: 9px 8px; background: #f7f8fa; }
.pp-row-locked { opacity: .8; }
.pp-lock-ico { font-size: 12px; margin-right: 6px; filter: grayscale(1); opacity: .7; vertical-align: middle; }
.pp-locked-bar {
  display: inline-block; vertical-align: middle; width: 68%; height: 9px; border-radius: 5px;
  background: repeating-linear-gradient(45deg,#e4e8ee,#e4e8ee 5px,#eef1f5 5px,#eef1f5 10px);
}
.pp-lock-note { font-size: 13px; color: #5c6675; padding: 8px 2px; font-weight: 600; }

/* comparables */
.pp-comps { display: grid; gap: 8px; }
.pp-comp {
  display: flex; flex-direction: column; gap: 2px; border: 1px solid #eef1f5;
  border-radius: 10px; padding: 10px 12px; font-size: 13px; color: #38404d;
}
.pp-comp b { color: #1a2233; font-size: 14px; }
.pp-comp-rv { font-weight: 700; color: #157a4c; }
.pp-comp-locked { background: #f7f9fc; color: #5c6675; border-style: dashed; }
.pp-map { height: 260px; border-radius: 12px; margin-top: 10px; background: #eef1f5; }

/* lead capture + disclaimer */
.pp-lead-form { display: grid; gap: 10px; margin-top: 8px; }
.pp-consent { display: flex; gap: 8px; align-items: flex-start; font-size: 13px; color: #38404d; }
.pp-consent input { margin-top: 2px; }
.pp-hp { position: absolute !important; left: -9999px !important; height: 0; width: 0; opacity: 0; }
.pp-disclaimer {
  font-size: 12px; color: #7a828e; margin: 18px 0 8px; padding: 12px 14px;
  background: #f7f9fc; border-radius: 10px; line-height: 1.5;
}
.pp-empty { padding: 22px; text-align: center; color: #5c6675; }
.pp-muted { color: #5c6675; font-size: 14px; }
.pp-hidden { display: none !important; }

@keyframes pp-indeterminate { 0% { margin-left: -40%; } 100% { margin-left: 105%; } }
@keyframes pp-in { to { opacity: 1; transform: none; } }
@keyframes pp-pop { from { transform: scale(.85); opacity: 0; } to { transform: none; opacity: 1; } }

/* desktop enhancements */
@media (min-width: 720px) {
  .pp-btn { width: auto; }
  .pp-card { padding: 24px; }
  .pp-addr { font-size: 22px; }
  .pp-comps { grid-template-columns: repeat(2, 1fr); }
  .pp-map { height: 340px; }
  .pp-lead-form { grid-template-columns: 1fr 1fr; }
  .pp-lead-form .pp-consent, .pp-lead-form .pp-btn { grid-column: 1 / -1; }
}

/* Phase 3: upload control */
.pp-file { display: block; width: 100%; padding: 12px; border: 2px dashed #d5dbe4; border-radius: 10px; background: #f9fafc; font-size: 14px; box-sizing: border-box; margin-top: 8px; }
.pp-file:hover { border-color: #253c58; }

/* Phase 4: sign-up form */
.pp-signup-form { display: grid; gap: 10px; margin-top: 12px; }
.pp-field { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: #38404d; font-weight: 600; }
.pp-sig { border: 2px dashed #d5dbe4; border-radius: 10px; background: #fff; width: 100%; touch-action: none; }
.pp-sig-clear { margin-top: 6px; }
.pp-btn-ghost { background: #eef1f5; color: #38404d; box-shadow: none; padding: 8px 14px; font-size: 13px; width: auto; }
@media (min-width: 720px) {
  .pp-signup-form { grid-template-columns: 1fr 1fr; }
  .pp-signup-form .pp-sig-field, .pp-signup-form .pp-consent, .pp-signup-form .pp-btn[type=submit] { grid-column: 1 / -1; }
}

/* Phase 6: share + cross-sell */
.pp-share-row { display: flex; gap: 8px; margin-top: 8px; }
.pp-share-row .pp-input { flex: 1; font-size: 13px; }
.pp-share-row .pp-btn { width: auto; white-space: nowrap; }
.pp-share a { color: #24457a; font-weight: 600; }

/* item 2 — in-page booking (real Bitform id 8) revealed in the routing card */
.pp-booking-embed { margin-top: 12px; }
.pp-route .pp-booking-embed form { max-width: 100%; }

/* Task 1 — Book Survey page: in-page eligibility result (survey/sign-up embed) */
.pp-book-result { margin-top: 4px; }
.pp-signup-embed, .pp-booking-embed { margin-top: 4px; }

/* RV +/- potential pills (green reduction / red rise) + cheapest-in-scheme note */
.pp-potpill{display:inline-block;padding:2px 9px;border-radius:999px;font-weight:600;font-size:.92em;font-variant-numeric:tabular-nums;white-space:nowrap}
.pp-potpill-save{background:#E6F5EC;color:#1B7A43}
.pp-potpill-rise{background:#FBE7EA;color:#B32036}
.pp-potpill-flat{background:#eef0f3;color:#5c6675}
.pp-note{margin:8px 0 4px;padding:10px 12px;border-left:3px solid #FFBF00;background:#FFF8E6;border-radius:6px;font-size:.9em;color:#3a4354;line-height:1.45}

/* #28 locked prefilled address fields + schedule note */
.pp-locked-input { background: #f2f4f7; color: #5c6675; cursor: not-allowed; }
.pp-sched-note { margin: 2px 0 8px; font-size: 12.5px; }

/* Inline CTA search (sits beside the Book Survey button in the bottom CTA) —
   freed from the widget width and sized to match the signed-off button height. */
.elementor-widget-shortcode:has(.pp-search-inline){width:auto!important;max-width:100%!important}
.pp-search-inline{width:380px;max-width:100%}
.pp-search-inline .pp-searchbox .pp-input{height:55px;padding:0 24px;font-size:15px;box-sizing:border-box}
/* Mobile: tighter input padding + slightly smaller font so the full placeholder
   ("Search your address or postcode…") fits the narrow pill (hero + CTA alike). */
@media (max-width:480px){ .pp-searchbox .pp-input{padding-left:16px;padding-right:16px;font-size:15px} }

/* Sign-up: the property picker and the legal-entity help (8 September 2026).
   The visitor no longer types an address; they pick it off the rating list,
   and may add more properties before signing. */
.pp-help {
  margin: -2px 0 12px;
  font-size: 12.5px;
  line-height: 1.45;
  color: #5c6675;
}
.pp-sel-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 8px;
}
.pp-sel-chips:empty { margin-bottom: 0; }
.pp-addprop { position: relative; }
.pp-addprop .pp-dropdown { z-index: 40; }
.pp-field > .pp-sel-chips .pp-chip { font-weight: 500; }

/* Hand-typed address fallback (9 September 2026). Deliberately quieter than the
   rating-list search beside it: this is the exception, not the normal path. */
.pp-manual { margin-top: 4px; }
.pp-manual-toggle {
  background: none; border: 0; padding: 0; cursor: pointer;
  font: inherit; font-size: 13px; color: #4a5a72; text-decoration: underline;
}
.pp-manual-toggle:hover { color: #1a2233; }
.pp-manual-panel {
  margin-top: 10px; padding: 14px 16px 16px;
  border: 1px solid #d8dee8; border-left: 3px solid #c9922f; border-radius: 8px;
  background: #fbfaf7;
}
.pp-manual-warn {
  margin: 0 0 12px; font-size: 13px; line-height: 1.55; color: #4a5a72; max-width: 62ch;
}
.pp-manual-warn strong { color: #1a2233; }
.pp-manual-panel .pp-field { margin-bottom: 10px; }
.pp-manual-msg { min-height: 18px; margin-bottom: 6px; font-size: 13px; color: #b23c3c; }
.pp-chip-manual { border-color: #c9922f; background: #fdf6e8; color: #253c58; }
.pp-chip-manual .pp-chip-x { background: #253c58; color: #fff; }
.pp-chip-tag {
  margin-left: 7px; padding: 1px 6px; border-radius: 3px;
  background: #ffbf00; color: #253c58; font-size: 10px; letter-spacing: .04em;
  text-transform: none; vertical-align: 1px;
}

.pp-upload-list { display: grid; gap: 1rem; margin-block: 1rem; }
.pp-upload-item { min-width: 0; margin: 0; padding: 1rem; border: 1px solid #d5dbe4; border-radius: 12px; display: grid; gap: .75rem; }
.pp-upload-item .pp-file, .pp-upload-item .pp-input { width: 100%; min-width: 0; max-width: 100%; box-sizing: border-box; }
.pp-upload-item button { min-height: 44px; }

.pp-manual-address { margin-block: .75rem; }
.pp-manual-address-form { display: grid; gap: .75rem; }
.pp-manual-address-form[hidden] { display: none; }
.pp-manual-address-form label { display: grid; gap: .35rem; }
.pp-notice { border-left: 3px solid #ffbf00; padding: .75rem; background: #fff9e5; color: #253c58; }

.pp-manual-address > .pp-btn { min-height: 44px; white-space: normal; }

.pp-draft-status { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .5rem; grid-column: 1 / -1; margin-top: .75rem; }
.pp-draft-status > span { flex: 1 1 220px; }
.pp-draft-status > button { min-height: 44px; white-space: normal; }

.pp-upload [hidden] { display: none; }

/* Signup receipt recovery stays usable while the submitted fields are locked. */
.pp-signup-fields { display: grid; gap: 10px; grid-column: 1 / -1; min-width: 0; margin: 0; padding: 0; border: 0; }
.pp-signup-recovery { grid-column: 1 / -1; min-width: 0; padding: 14px; border: 1px solid #d5dbe4; border-radius: 10px; background: #f7f9fc; }
.pp-signup-recovery summary { cursor: pointer; min-height: 32px; color: #253c58; font-weight: 600; }
.pp-signup-recovery .pp-input { width: 100%; min-width: 0; box-sizing: border-box; font-size: 13px; }
.pp-signup-recovery p { overflow-wrap: anywhere; }
.pp-signup-recovery button { min-height: 44px; white-space: normal; }
.pp-signup-receipt .pp-receipt-reference { overflow-wrap: anywhere; }
@media (min-width: 720px) { .pp-signup-fields { grid-template-columns: 1fr 1fr; } }

.pp-signup-fields:disabled button { cursor: not-allowed; box-shadow: none; }
.pp-signup-fields:disabled button[type=submit] { background: #e2e8f0; color: #253c58; }

/* Reviewed multi-party signup. Native controls retain keyboard and touch access. */
.pp-signup-progress{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:0;margin:0 0 24px;counter-reset:signup-step}.pp-signup-progress li{border-top:3px solid #d8e1eb;padding:12px 0;color:#52657a;font-size:13px;counter-increment:signup-step}.pp-signup-progress li::before{content:counter(signup-step) ". ";font-weight:700}.pp-signup-progress li[aria-current=step]{border-color:#ffbf00;color:#253c58;font-weight:700}.pp-signup-step[hidden]{display:none!important}.pp-person-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.pp-step-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}.pp-party-card{min-width:0;border:1px solid #d8e1eb;border-radius:12px;margin:20px 0;padding:20px;background:#f8fafc}.pp-party-card legend{font-weight:700;color:#253c58;padding:0 8px}.pp-party-assignments{margin-top:24px}.pp-pack-error{padding:14px;border-left:4px solid #b45309;background:#fff7ed;color:#7c2d12}.pp-pack-error[hidden]{display:none}.pp-agreement-preview{margin:12px 0;border:1px solid #d8e1eb;border-radius:8px;overflow:hidden}.pp-agreement-preview summary{padding:14px;min-height:48px;cursor:pointer;font-weight:600;overflow-wrap:anywhere}.pp-agreement-preview iframe{width:100%;height:480px;border:0;border-top:1px solid #d8e1eb;background:white;display:block}.pp-signup-step .pp-input{box-sizing:border-box;max-width:100%}.pp-signup-step .pp-btn{min-height:44px;white-space:normal}.pp-signup-step .pp-consent input{flex:none}.pp-signup-step :focus-visible{outline:3px solid #253c58;outline-offset:3px}@media(max-width:540px){.pp-person-grid{grid-template-columns:1fr}.pp-party-card{padding:14px}.pp-signup-progress{gap:5px}.pp-signup-progress li{font-size:12px}.pp-step-actions .pp-btn{flex:1}.pp-agreement-preview iframe{height:420px}}

@font-face{font-family:PortraitSignupInter;src:url('fonts/Inter-Regular.ttf') format('truetype');font-weight:400;font-display:swap}@font-face{font-family:PortraitSignupInter;src:url('fonts/Inter-SemiBold.ttf') format('truetype');font-weight:600 700;font-display:swap}@font-face{font-family:PortraitSignupPoppins;src:url('fonts/Poppins-SemiBold.ttf') format('truetype');font-weight:600 700;font-display:swap}
.pp-pack-form{font:15px/1.55 PortraitSignupInter,Arial,sans-serif;color:#253c58;max-width:1000px;margin:20px auto}.pp-pack-form .pp-h4,.pp-party-card legend{font-family:PortraitSignupPoppins,Arial,sans-serif;font-size:18px;line-height:1.4}.pp-pack-form .pp-signup-fields>.pp-signup-step,.pp-pack-form .pp-signup-progress,.pp-pack-form .pp-pack-error{grid-column:1/-1}.pp-pack-form .pp-field{font-size:14px;margin:0 0 14px;gap:6px}.pp-pack-form .pp-field[hidden]{display:none}.pp-pack-form .pp-consent{font-size:14px;line-height:1.5;margin:16px 0}.pp-pack-form .pp-consent input{width:20px;height:20px;accent-color:#253c58}.pp-pack-form input,.pp-pack-form select,.pp-pack-form button{font-family:inherit}.pp-pack-form .pp-help{font-size:14px;line-height:1.55}.pp-pack-form .pp-party-list{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(min(100%,350px),1fr))}.pp-pack-form .pp-party-card{margin:16px 0}.pp-pack-form .pp-signup-progress{margin-bottom:8px}.pp-pack-form .pp-signup-progress li{line-height:1.5}

.pp-pack-form .pp-sig{height:140px}.pp-route{font-family:PortraitSignupInter,Arial,sans-serif}.pp-route>.pp-h3{font-family:PortraitSignupPoppins,Arial,sans-serif}.pp-pack-form .pp-signup-step>.pp-h4{margin:8px 0 16px}

/* Native property selection keeps phone targets separate and easy to tap. */
@media (max-width: 1023.98px) {
  .pp-chip-x { width: 44px; height: 44px; min-width: 44px; min-height: 44px; }
  .pp-manual-toggle { min-height: 44px; padding-top: 8px; padding-bottom: 8px; }
}

/* Real WordPress containers can be narrower than the viewport. */
.wp-singular .pp-book-result, .wp-singular .pp-route { scroll-margin-top: 110px; }
@media (max-width: 1023.98px) {
  .pp-signup-form { grid-template-columns: minmax(0, 1fr); }
  .pp-signup-form > *, .pp-signup-fields > *, .pp-person-grid > *, .pp-field {
    min-width: 0; max-width: 100%; box-sizing: border-box;
  }
  .pp-chip { max-width: 100%; box-sizing: border-box; overflow-wrap: anywhere; }
  .elementor-5887 .elementor-element-e62ff24:has([data-pp-search]) { padding: 0 !important; }
}

/* Keep the native form controls consistent under Elementor kit defaults. */
.pp-route form.pp-signup-form .pp-field > .pp-input {
  width: 100%; min-height: 48px; padding: 14px 16px; border: 2px solid #d5dbe4;
  border-radius: 10px; box-sizing: border-box; background: #fff; color: #253c58;
  font: inherit; font-size: 16px; line-height: 1.4;
}
.pp-route form.pp-signup-form .pp-field > .pp-input:focus {
  border-color: #253c58; box-shadow: 0 0 0 3px rgba(37,60,88,.15);
}
