/* =====================================================================
   PUEBLER — Parches (planes colectivos)
   Secciones a ancho completo separadas por líneas, sin tarjetas flotantes.
   ===================================================================== */
.pa-back { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: .86rem; color: var(--puebler-text-muted); }
.pa-back:hover { color: var(--puebler-blue); }
.pa-count { display: inline-flex; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px; background: var(--puebler-surface-2); border: 1px solid var(--puebler-border); font-size: .72rem; align-items: center; justify-content: center; color: var(--puebler-text-muted); }
.pa-count-alert { background: var(--puebler-coral); border-color: var(--puebler-coral); color: #fff; }
.pa-head-cta { max-width: 320px; text-align: right; }
.pa-tabs { background: var(--puebler-surface); border-bottom: 1px solid var(--puebler-border); }
.pa-tabs-sticky { position: sticky; top: var(--topbar-h); z-index: 20; padding: 0 12px; }
.pa-pane[hidden] { display: none !important; }
.pa-map-note { font-size: .78rem; color: var(--puebler-text-muted); margin: 8px 0 0; display: flex; gap: 6px; align-items: flex-start; }

/* ---- Explorar ------------------------------------------------------ */
.pa-filters { background: var(--puebler-surface); border-bottom: 1px solid var(--puebler-border); }
.pa-filter-q input { max-width: 170px; }
.pa-explore { display: grid; grid-template-columns: minmax(0, 1fr) 420px; align-items: start; }
.pa-list { border-right: 1px solid var(--puebler-border); min-height: 50vh; background: var(--puebler-surface); }
.pa-list-bar { display: flex; justify-content: space-between; align-items: center; padding: 10px 20px; border-bottom: 1px solid var(--puebler-border-soft); }
.pa-row { display: grid; grid-template-columns: 112px minmax(0, 1fr) auto; gap: 16px; padding: 16px 20px; border-bottom: 1px solid var(--puebler-border); color: var(--puebler-text); align-items: center; }
.pa-row:hover { background: var(--puebler-surface-2); color: var(--puebler-text); }
.pa-row-thumb { position: relative; width: 112px; height: 84px; border-radius: 12px; overflow: hidden; background: var(--puebler-surface-2); display: block; }
.pa-row-thumb img, .pa-row-thumb .pb-cover-ph { width: 100%; height: 100%; object-fit: cover; }
.pa-row-date { position: absolute; left: 6px; top: 6px; background: var(--puebler-surface); color: var(--puebler-text); border-radius: 8px; padding: 2px 7px; text-align: center; font-size: .62rem; font-weight: 800; line-height: 1.1; letter-spacing: .04em; }
.pa-row-date b { display: block; font-size: 1rem; }
.pa-row-main { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.pa-row-kicker { font-size: .74rem; font-weight: 800; color: var(--puebler-blue-dark); text-transform: uppercase; letter-spacing: .06em; }
.pa-row-title { font-family: var(--font-heading); font-size: 1.04rem; line-height: 1.25; }
.pa-row-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: .82rem; color: var(--puebler-text-muted); }
.pa-row-host { display: flex; align-items: center; gap: 6px; font-size: .82rem; font-weight: 600; }
.pa-row-side { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.pa-seats { display: inline-flex; flex-direction: column; gap: 4px; min-width: 96px; }
.pa-seats small { font-size: .74rem; color: var(--puebler-text-muted); font-weight: 700; }
.pa-seats-bar { display: block; height: 6px; border-radius: 3px; background: var(--puebler-border); overflow: hidden; }
.pa-seats-bar > span { display: block; height: 100%; background: var(--puebler-blue); }
.pa-mapwrap { position: sticky; top: var(--topbar-h); padding: 14px; }
.pa-map { height: calc(100vh - var(--topbar-h) - 70px); min-height: 360px; border-radius: 14px; border: 1px solid var(--puebler-border); }
.pa-simple-list { background: var(--puebler-surface); max-width: 900px; margin: 0 auto; border-left: 1px solid var(--puebler-border); border-right: 1px solid var(--puebler-border); min-height: 40vh; }
.pa-simple { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 16px 22px; border-bottom: 1px solid var(--puebler-border); color: var(--puebler-text); }
.pa-simple:hover { background: var(--puebler-surface-2); color: var(--puebler-text); }
.pa-simple-main { display: flex; flex-direction: column; min-width: 0; }
.pa-simple-main small { color: var(--puebler-text-muted); }

/* ---- Convocatoria en el feed --------------------------------------- */
.pa-card { border-top: 1px solid var(--puebler-border-soft); border-bottom: 1px solid var(--puebler-border-soft); padding: 12px 0; margin: 10px 0 4px; }
.pa-card-facts { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: .86rem; }
.pa-card-facts i { color: var(--puebler-blue); }
.pa-card-foot { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 10px; }
.pa-card-actions { margin-left: auto; display: inline-flex; gap: 6px; flex-wrap: wrap; align-items: center; }

/* ---- Página del parche --------------------------------------------- */
.pa-hero { display: grid; grid-template-columns: 340px minmax(0, 1fr); background: var(--puebler-surface); border-bottom: 1px solid var(--puebler-border); }
.pa-hero-media { position: relative; min-height: 260px; background: var(--puebler-surface-2); }
.pa-hero-media img, .pa-hero-media .pb-cover-ph { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pa-hero-body { padding: 22px 26px; min-width: 0; }
.pa-title { font-family: var(--font-heading); font-size: 1.7rem; font-weight: 800; letter-spacing: -.4px; margin: 0 0 10px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.pa-title .pb-status { font-size: .74rem; letter-spacing: 0; }
.pa-host { display: flex; gap: 10px; align-items: center; margin-bottom: 14px; }
.pa-rep { font-size: .82rem; color: var(--puebler-text-muted); }
.pa-rep .pb-stars { color: var(--puebler-gold); }
.pa-facts { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0; border-top: 1px solid var(--puebler-border-soft); border-bottom: 1px solid var(--puebler-border-soft); margin-bottom: 14px; }
.pa-facts > span { display: grid; grid-template-columns: 26px 1fr; column-gap: 6px; padding: 10px 8px 10px 0; align-items: start; }
.pa-facts > span > i, .pa-facts > span > svg { grid-row: span 2; color: var(--puebler-blue); font-size: 1.15rem; margin-top: 2px; }
.pa-facts b { font-size: .9rem; }
.pa-facts small { color: var(--puebler-text-muted); font-size: .78rem; overflow-wrap: anywhere; }
.pa-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.js-pa-save.is-on { color: var(--puebler-blue); border-color: var(--puebler-blue); }
.pa-banner { display: flex; gap: 12px; align-items: center; padding: 14px 24px; border-bottom: 1px solid var(--puebler-border); background: var(--puebler-blue-light); }
.pa-banner > i { font-size: 1.3rem; color: var(--puebler-blue-dark); }
.pa-banner > div { flex: 1; }
.pa-banner-bad { background: #FDECEC; color: #7A1C14; }
.pa-banner-bad > i { color: #B42318; }
.pa-banner-wait { background: #FFF6E0; }
.pa-banner-wait > i { color: #9A6B00; }

.pa-cols { display: grid; grid-template-columns: minmax(0, 1fr) 380px; align-items: start; background: var(--puebler-surface); min-height: 40vh; }
.pa-col-main { border-right: 1px solid var(--puebler-border); min-width: 0; }
.pa-col-side { min-width: 0; position: sticky; top: calc(var(--topbar-h) + 50px); }
.pa-block { padding: 20px 24px; border-bottom: 1px solid var(--puebler-border); }
.pa-pane > .pa-block { background: var(--puebler-surface); }
.pa-h { font-family: var(--font-heading); font-size: 1.05rem; font-weight: 800; margin: 0 0 12px; display: flex; align-items: center; gap: 8px; }
.pa-h > i { color: var(--puebler-blue); }
.pa-h3 { font-size: .86rem; font-weight: 800; margin: 14px 0 6px; display: flex; gap: 6px; align-items: center; }
.pa-text { line-height: 1.6; overflow-wrap: anywhere; }
.pa-text ul, ul.pa-text { padding-left: 18px; }
.pa-locked { display: grid; grid-template-columns: 28px 1fr; gap: 8px; background: var(--puebler-surface-2); }
.pa-locked > i { font-size: 1.3rem; color: var(--puebler-blue); }
.pa-locked > *:not(i) { grid-column: 2; }
.pa-exp { display: flex; align-items: center; gap: 12px; margin-top: 14px; padding: 12px 0; border-top: 1px dashed var(--puebler-border); color: var(--puebler-text); }
.pa-exp > i:first-child { font-size: 1.4rem; color: var(--puebler-coral); }
.pa-exp > span { flex: 1; display: flex; flex-direction: column; }
.pa-exp small { color: var(--puebler-text-muted); }
.pa-announce { display: grid; grid-template-columns: 28px 1fr auto auto; gap: 8px; padding: 10px 0; border-bottom: 1px dashed var(--puebler-border); align-items: start; }
.pa-announce:last-child { border-bottom: 0; }
.pa-announce > i { color: var(--puebler-coral); font-size: 1.15rem; }
.pa-announce small { color: var(--puebler-text-muted); font-weight: 700; font-size: .74rem; text-transform: uppercase; letter-spacing: .05em; }
.pa-announce p { margin: 2px 0 0; overflow-wrap: anywhere; }
.pa-inline-form .pb-field { margin-bottom: 12px; }
.pa-inline-form label { font-weight: 700; font-size: .84rem; margin-bottom: 4px; }
.pa-grid-form { display: grid; grid-template-columns: 250px 1fr; gap: 10px; }
.pa-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.pa-grid-3 { display: grid; grid-template-columns: 1fr 1.4fr 1fr; gap: 0 14px; }

/* Itinerario */
.pa-stops { list-style: none; padding: 0; margin: 0; position: relative; }
.pa-stop { display: grid; grid-template-columns: 34px 1fr; gap: 12px; position: relative; padding-bottom: 16px; }
.pa-stop::before { content: ''; position: absolute; left: 16px; top: 34px; bottom: 0; width: 2px; background: var(--puebler-border); }
.pa-stop:last-child::before { display: none; }
.pa-stop-dot { width: 34px; height: 34px; border-radius: 50%; background: var(--stop, var(--puebler-blue)); color: #fff; display: flex; align-items: center; justify-content: center; font-size: .9rem; }
.pa-stop-top { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }
.pa-stop-time { font-size: .78rem; font-weight: 800; color: var(--puebler-blue-dark); background: var(--puebler-blue-light); padding: 1px 8px; border-radius: 10px; }
.pa-stop-body small { display: block; }
.pa-stop-tools { display: flex; gap: 2px; margin-top: 4px; }
.pa-routemap { height: 380px; border-bottom: 1px solid var(--puebler-border); }
.pa-col-side > .pa-map-note { padding: 0 16px 14px; }
.pa-pickmap { height: 260px; border-radius: 12px; border: 1px solid var(--puebler-border); }

/* Chat */
.pa-chat { background: var(--puebler-surface); max-width: 900px; margin: 0 auto; border-left: 1px solid var(--puebler-border); border-right: 1px solid var(--puebler-border); display: flex; flex-direction: column; height: calc(100vh - var(--topbar-h) - 52px); min-height: 420px; }
.pa-chat-list { flex: 1; overflow-y: auto; padding: 16px 18px; display: flex; flex-direction: column; gap: 10px; }
.pa-msg { display: flex; gap: 8px; align-items: flex-end; max-width: 82%; }
.pa-msg.is-mine { align-self: flex-end; flex-direction: row-reverse; }
.pa-msg-bubble { background: var(--puebler-surface-2); border: 1px solid var(--puebler-border); border-radius: 16px 16px 16px 4px; padding: 8px 12px; min-width: 0; }
.pa-msg.is-mine .pa-msg-bubble { background: var(--puebler-blue); border-color: var(--puebler-blue); color: #fff; border-radius: 16px 16px 4px 16px; }
.pa-msg.is-announce .pa-msg-bubble { border-color: var(--puebler-coral); border-width: 2px; }
.pa-msg-bubble p { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.pa-msg-bubble small { font-size: .7rem; opacity: .7; }
.pa-msg-name { font-size: .78rem; font-weight: 800; display: block; color: var(--puebler-text); }
.pa-msg-tag { display: inline-flex; gap: 4px; font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--puebler-coral); }
.pa-msg.is-mine .pa-msg-tag { color: #fff; }
.pa-msg-menu { opacity: .55; }
.pa-msg:hover .pa-msg-menu, .pa-msg-menu:focus-within { opacity: 1; }
.pa-msg-sys { align-self: center; font-size: .78rem; color: var(--puebler-text-muted); background: var(--puebler-surface-2); padding: 4px 12px; border-radius: 12px; text-align: center; max-width: 92%; }
.pa-chat-form { display: flex; gap: 8px; padding: 12px 16px; border-top: 1px solid var(--puebler-border); align-items: flex-end; }
.pa-chat-form textarea { resize: none; max-height: 140px; }

/* Gastos */
.pa-money { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--puebler-border); border-radius: 12px; margin-bottom: 14px; }
.pa-money > div { padding: 12px 14px; border-right: 1px solid var(--puebler-border); display: flex; flex-direction: column; }
.pa-money > div:last-child { border-right: 0; }
.pa-money small { color: var(--puebler-text-muted); font-size: .76rem; font-weight: 700; }
.pa-money strong { font-family: var(--font-heading); font-size: 1.2rem; }
.pa-expenses, .pa-pay, .pa-people, .pa-emergency { list-style: none; padding: 0; margin: 0; }
.pa-expenses li { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px dashed var(--puebler-border); }
.pa-expenses li > span { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.pa-expenses small { color: var(--puebler-text-muted); font-size: .76rem; }
.pa-pay li { display: flex; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px dashed var(--puebler-border); }
.pa-pay li > span { flex: 1; font-size: .9rem; min-width: 0; }
.pa-switch { display: inline-flex; align-items: center; gap: 6px; font-size: .78rem; font-weight: 700; color: var(--puebler-text-muted); margin: 0; }
.pa-switch input { width: 18px; height: 18px; accent-color: var(--puebler-green); }

/* Encuestas */
.pa-opt { position: relative; display: grid; grid-template-columns: 1fr auto; width: 100%; text-align: left; border: 1px solid var(--puebler-border); background: var(--puebler-surface); color: var(--puebler-text); border-radius: 10px; padding: 10px 12px; margin-bottom: 8px; overflow: hidden; }
.pa-opt:disabled { cursor: default; }
.pa-opt.is-mine { border-color: var(--puebler-blue); }
.pa-opt-bar { position: absolute; left: 0; top: 0; bottom: 0; background: var(--puebler-blue-light); z-index: 0; }
.pa-opt > span, .pa-opt > small { position: relative; z-index: 1; }
.pa-opt-label i { color: var(--puebler-blue); }
.pa-opt-n { font-weight: 800; font-size: .84rem; }
.pa-opt-who { grid-column: 1 / -1; color: var(--puebler-text-muted); font-size: .74rem; }

/* Integrantes, solicitudes y propuestas */
.pa-person, .pa-request, .pa-proposal, .pa-rating { display: flex; gap: 12px; align-items: center; padding: 12px 0; border-bottom: 1px dashed var(--puebler-border); }
.pa-person:last-child, .pa-request:last-child, .pa-proposal:last-child, .pa-rating:last-child { border-bottom: 0; }
.pa-proposal, .pa-rating { align-items: flex-start; }
.pa-person-main { flex: 1; min-width: 0; }
.pa-request > .flex-grow-1 { flex: 1 1 180px; min-width: 0; }
.pa-grid-form select { min-width: 0; }
.pa-person-tools { display: flex; gap: 6px; align-items: center; }
.pa-att { width: auto; padding: 6px 30px 6px 10px; font-size: .82rem; }
.pa-response { color: var(--puebler-text-muted); }
.pa-wait-n { width: 24px; height: 24px; border-radius: 50%; background: var(--puebler-surface-2); border: 1px solid var(--puebler-border); display: inline-flex; align-items: center; justify-content: center; font-size: .74rem; font-weight: 800; }
.pa-scores { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: .78rem; color: var(--puebler-text-muted); }
.pa-scores .pb-stars, .pa-rating .pb-stars { color: var(--puebler-gold); font-size: .74rem; }
.pa-starpick { display: inline-flex; flex-direction: row-reverse; gap: 2px; }
.pa-starpick input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.pa-starpick label { cursor: pointer; font-size: 1.35rem; color: var(--puebler-border); margin: 0; }
.pa-starpick label:has(input:checked), .pa-starpick label:has(input:checked) ~ label, .pa-starpick label:hover, .pa-starpick label:hover ~ label { color: var(--puebler-gold); }
.pa-starpick label:has(input:focus-visible) { outline: 2px solid var(--puebler-blue); border-radius: 4px; }

/* Recuerdos */
.pa-memories { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 0; }
.pa-memory { margin: 0; border-right: 1px solid var(--puebler-border); border-bottom: 1px solid var(--puebler-border); }
.pa-memory > img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.pa-memory figcaption { padding: 10px 12px; }

/* Seguridad */
.pa-emergency li { display: flex; align-items: center; gap: 12px; padding: 8px 0; border-bottom: 1px dashed var(--puebler-border); }
.pa-tel { font-family: var(--font-heading); font-weight: 800; font-size: 1.1rem; min-width: 64px; color: var(--puebler-coral); }
.pa-share-row { display: flex; gap: 8px; }
.pa-share-row input { font-size: .82rem; }

/* Gestión */
.pa-stats { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); background: var(--puebler-surface); border-bottom: 1px solid var(--puebler-border); }
.pa-stats > div { padding: 14px 16px; border-right: 1px solid var(--puebler-border); display: flex; flex-direction: column; }
.pa-stats > div:last-child { border-right: 0; }
.pa-stats strong { font-family: var(--font-heading); font-size: 1.35rem; }
.pa-stats span { font-size: .74rem; color: var(--puebler-text-muted); font-weight: 700; }
.pa-actions-col { display: flex; flex-direction: column; gap: 8px; }
.pa-actions-col .pb-btn { justify-content: flex-start; }

/* Formulario */
.pa-form { max-width: 860px; margin: 0 auto; background: var(--puebler-surface); border-left: 1px solid var(--puebler-border); border-right: 1px solid var(--puebler-border); }
.pa-fs { border: 0; border-bottom: 1px solid var(--puebler-border); padding: 22px 26px 8px; margin: 0; min-width: 0; }
.pa-fs legend { font-family: var(--font-heading); font-size: 1.05rem; font-weight: 800; display: flex; align-items: center; gap: 10px; float: none; width: auto; margin-bottom: 14px; }
.pa-fs legend span { width: 28px; height: 28px; border-radius: 50%; background: var(--puebler-blue); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: .85rem; }
.pa-fs label { font-weight: 700; font-size: .86rem; margin-bottom: 5px; }
.pa-form-actions { display: flex; justify-content: flex-end; gap: 10px; padding: 18px 26px; }

/* Viaje compartido */
.pa-trip { background: var(--puebler-surface); padding-top: 28px; padding-bottom: 28px; }
.pa-trip-kv { display: grid; grid-template-columns: 170px 1fr; margin: 20px 0 0; border-top: 1px solid var(--puebler-border); }
.pa-trip-kv dt, .pa-trip-kv dd { padding: 10px 0; border-bottom: 1px solid var(--puebler-border); margin: 0; }
.pa-trip-kv dt { color: var(--puebler-text-muted); font-weight: 700; font-size: .86rem; }

/* ---- Responsive ----------------------------------------------------- */
@media (max-width: 1199px) {
  .pa-explore { grid-template-columns: minmax(0, 1fr) 340px; }
  .pa-cols { grid-template-columns: minmax(0, 1fr) 320px; }
  .pa-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .pa-stats > div:nth-child(4n) { border-right: 0; }
  .pa-stats > div:nth-child(-n+4) { border-bottom: 1px solid var(--puebler-border); }
}
@media (max-width: 991px) {
  .pa-explore { grid-template-columns: 1fr; }
  .pa-list { border-right: 0; }
  .pa-mapwrap { display: none; position: static; padding: 0; border-bottom: 1px solid var(--puebler-border); }
  .pa-mapwrap.is-open { display: block; }
  .pa-map { height: 55vh; border-radius: 0; border: 0; }
  .pa-mapwrap .pa-map-note { padding: 8px 16px; }
  .pa-explore .pa-mapwrap.is-open { order: -1; }
  .pa-hero { grid-template-columns: 1fr; }
  .pa-hero-media { min-height: 170px; }
  .pa-cols { grid-template-columns: 1fr; }
  .pa-col-main { border-right: 0; }
  .pa-col-side { position: static; border-top: 1px solid var(--puebler-border); }
  .pa-head-cta { text-align: left; max-width: none; }
}
@media (max-width: 575px) {
  /* Filtros en una sola fila deslizable para no ocupar toda la pantalla */
  .pa-filters { flex-wrap: nowrap; overflow-x: auto; padding: 10px 16px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .pa-filters::-webkit-scrollbar { display: none; }
  .pa-filters > * { flex: 0 0 auto; }
  .pa-filters .pb-btn-primary { position: sticky; right: 0; box-shadow: -8px 0 0 var(--puebler-surface); }
  .pa-row { grid-template-columns: 84px minmax(0, 1fr); gap: 12px; padding: 14px 16px; }
  .pa-row-thumb { width: 84px; height: 84px; }
  .pa-row-side { grid-column: 2; flex-direction: row; align-items: center; justify-content: space-between; }
  .pa-hero-body { padding: 16px; }
  .pa-title { font-size: 1.35rem; }
  .pa-block { padding: 16px; }
  .pa-grid-2, .pa-grid-3, .pa-grid-form { grid-template-columns: 1fr; }
  .pa-fs { padding: 18px 16px 6px; }
  .pa-form-actions { padding: 16px; }
  .pa-money strong { font-size: 1rem; }
  .pa-msg { max-width: 94%; }
  .pa-chat { height: calc(100vh - var(--topbar-h) - var(--bottom-nav-h) - 52px); border: 0; }
  .pa-trip-kv { grid-template-columns: 1fr; }
  .pa-trip-kv dt { border-bottom: 0; padding-bottom: 0; }
  .pa-person { flex-wrap: wrap; }
  .pa-person-tools { width: 100%; justify-content: flex-end; }
  .pa-request { flex-wrap: wrap; }
  .pa-share-row { flex-direction: column; }
  .pa-stats > div { padding: 10px; }
  .pa-stats strong { font-size: 1.1rem; }
  .pa-filter-q input { max-width: 120px; }
}