/* PHX Buyers Shortcode - scoped styles */
.phx-buyers-app{
  --bg:#f3f4f6;
  --white:#fff;
  --text:#111827;
  --muted:#6b7280;
  --border:#e5e7eb;
  --red:#b91c1c;
  --shadow: 0 20px 50px rgba(0,0,0,.10);
  --radius: 14px;
  --max: 1200px;
  /* Consistent vertical rhythm */
  --field-gap: 14px;
  --col-gap: 12px;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
  color:var(--text);
}

/* Normalize spacing/metrics across browsers (Chrome vs Firefox) */
.phx-buyers-app, .phx-buyers-app *{ box-sizing:border-box; }
.phx-buyers-app input, .phx-buyers-app select, .phx-buyers-app button{ font: inherit; line-height:1.25; }
.phx-buyers-app label{ line-height:1.25; }

/* Make select height/padding consistent in Chrome */
.phx-buyers-app select{
  -webkit-appearance: none;
  appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, #6b7280 50%),
    linear-gradient(135deg, #6b7280 50%, transparent 50%);
  background-position:
    calc(100% - 18px) 50%,
    calc(100% - 13px) 50%;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  padding-right: 40px;
}

/* Prevent Chrome autofill from visually "changing" field heights */
.phx-buyers-app input:-webkit-autofill,
.phx-buyers-app select:-webkit-autofill{
  -webkit-box-shadow: 0 0 0px 1000px #fff inset;
  transition: background-color 9999s ease-in-out 0s;
}
.phx-buyers-app .wrap{max-width:var(--max);margin:0 auto;padding:22px 14px 44px;}
.phx-buyers-app .hero{background:var(--white);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:28px;text-align:center;}
.phx-buyers-app h1{margin:0 0 6px;font-size:clamp(28px,3.2vw,40px);letter-spacing:-.02em; text-align:center !important;}
.phx-buyers-app .sub{margin:0 auto 18px;color:var(--muted);font-size:1.05rem;max-width:72ch;display:block;width:100%;text-align:center !important;}
.phx-buyers-app .hero > *{text-align:inherit;}

/* Keep the form + preview content left-aligned while headline/subtext stay centered */
.phx-buyers-app form,
.phx-buyers-app .preview{
  text-align:left;
}

/* Chrome/theme overrides: keep form labels left-aligned even if parent container is centered */
.phx-buyers-app .phx-buyers-form,
.phx-buyers-app .phx-buyers-form .field,
.phx-buyers-app .phx-buyers-form label{
  text-align:left !important;
}
.phx-buyers-app form{margin-top:14px;background:#f9fafb;border:1px solid var(--border);border-radius:14px;padding:16px;}
.phx-buyers-app .grid{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--col-gap);row-gap:var(--field-gap);}
.phx-buyers-app .field{margin:0;}
.phx-buyers-app label{display:block;font-weight:800;font-size:.9rem;margin-bottom:6px;}
.phx-buyers-app input,.phx-buyers-app select{
  width:100%;border:1px solid var(--border);border-radius:10px;padding:10px 12px;outline:none;background:#fff;
}
.phx-buyers-app input:focus,.phx-buyers-app select:focus{border-color:rgba(185,28,28,.45);box-shadow:0 0 0 4px rgba(185,28,28,.12);}
.phx-buyers-app input.invalid,.phx-buyers-app select.invalid{border-color:rgba(185,28,28,.75)!important;box-shadow:0 0 0 4px rgba(185,28,28,.10);}
.phx-buyers-app .field-error{margin-top:6px;font-size:.88rem;font-weight:800;color:var(--red);display:none;}
.phx-buyers-app .field-error.show{display:block;}
.phx-buyers-app .help{margin-top:6px;color:var(--muted);font-size:.9rem;}
.phx-buyers-app .check{display:flex;gap:10px;align-items:flex-start;color:var(--muted);margin:12px 0 2px;font-size:.92rem;}
.phx-buyers-app .check input{width:18px;height:18px;margin-top:2px;}
.phx-buyers-app .btn{display:inline-flex;justify-content:center;align-items:center;border:1px solid var(--border);border-radius:10px;padding:12px 14px;font-weight:900;cursor:pointer;background:#fff;text-decoration:none;}
.phx-buyers-app .btn.solid{background:var(--red);border-color:var(--red);color:#fff;}
.phx-buyers-app .btn.solid:hover{filter:brightness(1.05);}
.phx-buyers-app .btn.full{width:100%;}
.phx-buyers-app .preview{margin-top:18px;}
.phx-buyers-app .preview h2{margin:18px 0 12px;font-size:1.15rem;letter-spacing:-.01em;}
.phx-buyers-app .cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;}
.phx-buyers-app .card-link{display:block;color:inherit;text-decoration:none;}
.phx-buyers-app .card{border:1px solid var(--border);border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 10px 30px rgba(0,0,0,.06);transition:transform .12s ease, box-shadow .12s ease;}
.phx-buyers-app .card-link:hover .card{transform:translateY(-2px);box-shadow:0 14px 40px rgba(0,0,0,.10);}
.phx-buyers-app .img{height:170px;background-size:cover;background-position:center;}
.phx-buyers-app .card-body{padding:14px;}
.phx-buyers-app .price-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.phx-buyers-app .price{font-size:1.35rem;font-weight:900;color:var(--red);}
.phx-buyers-app .pill{font-size:.82rem;padding:6px 10px;border-radius:999px;background:#111827;color:#fff;font-weight:900;}
.phx-buyers-app .pill.outline{background:#fff;color:#111827;border:1px solid var(--border);}
.phx-buyers-app .addr{margin-top:10px;font-weight:900;text-transform:uppercase;font-size:.95rem;}
.phx-buyers-app .meta{margin-top:6px;color:var(--muted);font-size:.92rem;}
.phx-buyers-app .debug{margin-top:12px;white-space:pre-wrap;background:#fff;border:1px dashed var(--border);padding:12px;border-radius:12px;color:#111827;}
/* Modal */
.phx-buyers-app .modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.45);display:none;align-items:center;justify-content:center;z-index:99999;padding:20px;}
.phx-buyers-app .modal{background:#fff;border-radius:16px;max-width:520px;width:100%;border:1px solid var(--border);box-shadow:0 30px 80px rgba(0,0,0,.22);padding:18px 18px 14px;}
.phx-buyers-app .modal h3{margin:0 0 6px;font-size:1.1rem;}
.phx-buyers-app .modal p{margin:0;color:var(--muted);line-height:1.5;}
.phx-buyers-app .modal .row{display:flex;gap:10px;justify-content:flex-end;margin-top:14px;}
.phx-buyers-app .modal .btn{padding:10px 12px;}
@media (max-width:860px){
  .phx-buyers-app .grid{grid-template-columns:1fr;}
  .phx-buyers-app .cards{grid-template-columns:1fr;}
  .phx-buyers-app .hero{padding:18px;}
}

/* FORCE even spacing in the buyers form (WP/theme override-proof) */
.phx-buyers-app .phx-buyers-form {
  display: flex !important;
  flex-direction: column !important;
  gap: var(--field-gap) !important;
}

/* Remove any weird margins that collapse spacing */
.phx-buyers-app .phx-buyers-form .field,
.phx-buyers-app .phx-buyers-form .grid,
.phx-buyers-app .phx-buyers-form .check {
  margin: 0 !important;
}

/* Ensure every block has consistent separation */
.phx-buyers-app .phx-buyers-form > * {
  margin: 0 !important;
}

/* Give consistent spacing between label and input */
.phx-buyers-app .phx-buyers-form label {
  margin: 0 0 8px !important;
}

/* Make checkbox row breathe */
.phx-buyers-app .phx-buyers-form .check {
  padding: 6px 0 !important;
}

/* Ensure button has room above it */
.phx-buyers-app .phx-buyers-form .btn.full {
  margin-top: 6px !important;
}
