:root{
  --cream:#F5F0E3;
  --paper:#FFFDF7;
  --paper-2:#FFFFFF;
  --ink:#221F18;
  --ink-soft:#6E6857;
  --line:#E5DDC9;
  --clay:#B5654A;
  --clay-dark:#8F4934;
  --clay-tint:#F3E1D8;
  --pine:#3E6C64;
  --pine-dark:#2C4C46;
  --pine-tint:#DEEAE6;
  --moss:#293823;
  --warn:#9A6B1E;
  --warn-tint:#F5E7CE;
  --danger:#A6402F;
  --shadow: 0 8px 24px rgba(42,40,32,0.09);
  --radius: 10px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --cream:#1E1C16; --paper:#26241C; --paper-2:#2C2A21; --ink:#EFE9D8; --ink-soft:#B4AC93;
    --line:#3E3A2C; --clay:#D98A6C; --clay-dark:#E8A385; --clay-tint:#3A2A22;
    --pine:#7FB0A5; --pine-dark:#9BC7BC; --pine-tint:#243330; --moss:#141A11;
    --warn:#D9A84E; --warn-tint:#3A2F16; --danger:#E28372; --shadow: 0 10px 30px rgba(0,0,0,0.4);
  }
}
:root[data-theme="dark"]{
  --cream:#1E1C16; --paper:#26241C; --paper-2:#2C2A21; --ink:#EFE9D8; --ink-soft:#B4AC93;
  --line:#3E3A2C; --clay:#D98A6C; --clay-dark:#E8A385; --clay-tint:#3A2A22;
  --pine:#7FB0A5; --pine-dark:#9BC7BC; --pine-tint:#243330; --moss:#141A11;
  --warn:#D9A84E; --warn-tint:#3A2F16; --danger:#E28372; --shadow: 0 10px 30px rgba(0,0,0,0.4);
}
/*
   El atributo hidden lo aplica el navegador con display:none, pero cualquier
   regla propia con display (por ejemplo .modal-body{display:flex}) le gana por
   especificidad y el elemento se sigue viendo. Esto lo hacía visible el
   formulario de contraseña encima del panel ya abierto.
*/
[hidden]{ display:none !important; }

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:'Inter', sans-serif;
  background: var(--cream);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  line-height:1.5;
}
h1,h2,h3{ font-family:'Fraunces', serif; font-weight:600; text-wrap:balance; margin:0; }
p{ margin:0; }
button, input, select, textarea{ font-family: inherit; font-size: 15px; color: inherit; }
button{ cursor:pointer; }
a{ color: var(--pine-dark); }

.shell{ max-width: 1140px; margin: 0 auto; padding: 0 22px; }

/* ---------------- cabecera ---------------- */

.topbar{
  background: var(--moss); color: #F3EEDF;
  position: sticky; top: 0; z-index: 40;
  box-shadow: 0 1px 0 rgba(255,255,255,0.06), 0 8px 24px rgba(0,0,0,0.10);
}
.topbar-inner{ max-width:1140px; margin:0 auto; padding: 13px 22px; display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; }
.brand{ display:flex; align-items:center; gap:11px; text-decoration:none; color:inherit; }
.brand-mark{
  width:38px; height:38px; border-radius:9px; flex-shrink:0;
  background: linear-gradient(145deg, var(--clay), var(--clay-dark));
  color:#fff; font-family:'Fraunces',serif; font-weight:700; font-size:15px; letter-spacing:0.5px;
  display:flex; align-items:center; justify-content:center;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.25);
}
.brand-text{ display:flex; flex-direction:column; line-height:1.15; }
.brand .mark{ font-family:'Fraunces', serif; font-weight:700; font-size:20px; color:#F8F3E4; }
.brand .tag{ font-size:11.5px; color:#A9B79F; margin-top:2px; }
.topbar-actions{ display:flex; align-items:center; gap:16px; }
.topbar-link{ color:#CBD6C2; font-size:14px; font-weight:600; text-decoration:none; }
.topbar-link:hover{ color:#F3EEDF; }

/* ---------------- botones ---------------- */

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  border-radius: 8px; border: 1px solid transparent; padding: 10px 18px;
  font-weight:600; font-size:14.5px; white-space:nowrap; text-decoration:none;
  transition: transform .12s ease, background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.btn:active{ transform: translateY(1px); }
.btn-lg{ padding:14px 26px; font-size:15.5px; border-radius:9px; }
.btn-clay{ background: var(--clay); color:#fff; box-shadow: 0 2px 8px rgba(181,101,74,0.30); }
.btn-clay:hover{ background: var(--clay-dark); box-shadow: 0 4px 14px rgba(181,101,74,0.38); }
.btn-ghost{ background:transparent; border-color: rgba(255,255,255,0.35); color:#F3EEDF; }
.btn-ghost:hover{ background: rgba(255,255,255,0.1); }
.btn-line{ background: var(--paper); border-color: var(--line); color: var(--ink); }
.btn-line:hover{ border-color: var(--clay); color: var(--clay-dark); }
.btn-pine{ background: var(--pine); color:#fff; }
.btn-pine:hover{ background: var(--pine-dark); }
.btn-danger{ background: transparent; border-color: var(--line); color: var(--danger); }
.btn-danger:hover{ border-color: var(--danger); background: rgba(166,64,47,0.08); }
.btn-sm{ padding: 7px 12px; font-size: 13px; }
.btn:disabled{ opacity:0.55; cursor:not-allowed; }

/* ---------------- portada ---------------- */

.hero{
  background:
    radial-gradient(1100px 420px at 12% -10%, rgba(94,149,140,0.16), transparent 65%),
    radial-gradient(900px 400px at 88% 0%, rgba(181,101,74,0.13), transparent 60%),
    var(--cream);
  border-bottom: 1px solid var(--line);
  padding: 56px 0 44px;
}
.hero-inner{ display:flex; flex-direction:column; }
.hero-eyebrow{
  font-size:12px; font-weight:700; letter-spacing:2.4px; text-transform:uppercase;
  color: var(--clay-dark); margin-bottom:14px;
}
.hero h1{ font-size: clamp(30px, 4.4vw, 46px); line-height:1.08; max-width: 780px; letter-spacing:-0.5px; }
.hero-sub{ color: var(--ink-soft); max-width: 620px; font-size:16.5px; line-height:1.65; margin-top:14px; }

.hero-search{
  position:relative; margin-top:28px; max-width:620px; width:100%;
}
.hero-search-ico{
  position:absolute; left:16px; top:50%; transform:translateY(-50%);
  width:20px; height:20px; color: var(--ink-soft); pointer-events:none;
}
.hero-search input{
  width:100%; border:1px solid var(--line); background: var(--paper-2);
  border-radius: 10px; padding: 15px 16px 15px 46px; font-size:15.5px; color:var(--ink);
  box-shadow: 0 4px 16px rgba(42,40,32,0.07);
}
.hero-search input:focus{ outline:2px solid var(--pine); outline-offset:-1px; border-color:transparent; }

.hero-trust{ list-style:none; padding:0; margin:26px 0 0; display:flex; flex-wrap:wrap; gap:10px 26px; }
.hero-trust li{ display:flex; align-items:center; gap:9px; font-size:13.5px; color: var(--ink-soft); }
.hero-trust svg{ width:19px; height:19px; color: var(--pine); flex-shrink:0; }

/* ---------------- filtros ---------------- */

.controls{ padding: 26px 0 4px; }
.controls-row{ display:flex; flex-wrap:wrap; gap:12px; align-items:center; justify-content:space-between; }
.controls-selects{ display:flex; gap:8px; flex-wrap:wrap; }
.pillgroup{ display:flex; gap:7px; flex-wrap:wrap; }
.pill{
  border:1px solid var(--line); background: var(--paper); color: var(--ink-soft);
  border-radius: 999px; padding: 8px 16px; font-size: 13.5px; font-weight:600;
  transition: all .14s ease;
}
.pill:hover{ border-color: var(--pine); color: var(--pine-dark); }
.pill[aria-pressed="true"]{ background: var(--pine); border-color: var(--pine); color:#fff; }
.search-input{ flex:1 1 200px; min-width:160px; border:1px solid var(--line); background: var(--paper); border-radius:8px; padding:10px 13px; }
select.field{ border:1px solid var(--line); background: var(--paper); border-radius:8px; padding:10px 13px; color: var(--ink); font-size:14px; }
.results-count{ font-size:13px; color: var(--ink-soft); padding: 16px 0 0; font-weight:500; }

/* ---------------- tarjetas ---------------- */

.grid{ display:grid; grid-template-columns: repeat(auto-fill, minmax(260px,1fr)); gap: 22px; padding: 20px 0 56px; }
.card{
  background: var(--paper-2); border:1px solid var(--line); border-radius: 14px;
  overflow:hidden; display:flex; flex-direction:column;
  box-shadow: 0 1px 2px rgba(42,40,32,0.05), 0 8px 24px rgba(42,40,32,0.07);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.card:hover{
  transform: translateY(-4px);
  box-shadow: 0 4px 8px rgba(42,40,32,0.07), 0 18px 40px rgba(42,40,32,0.13);
  border-color: var(--clay);
}
.card-photo{ position:relative; aspect-ratio: 4/3; background: var(--line); overflow:hidden; }
.card-photo img{ width:100%; height:100%; object-fit:cover; display:block; transition: transform .4s ease; }
.card:hover .card-photo img{ transform: scale(1.05); }
.card-photo .noimg{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  height:100%; color: var(--ink-soft); font-size:12.5px;
  background: repeating-linear-gradient(45deg, var(--line) 0 10px, transparent 10px 20px);
}
.badges{ position:absolute; top:10px; left:10px; display:flex; gap:6px; flex-wrap:wrap; }
.badge{
  font-size:10.5px; font-weight:700; letter-spacing:0.4px; text-transform:uppercase;
  padding:5px 9px; border-radius:6px; backdrop-filter: blur(4px);
}
.badge-type{ background: rgba(34,46,30,0.86); color:#F3EEDF; }
.badge-escritura{ background: rgba(62,108,100,0.92); color:#fff; }
.badge-proindiviso{ background: rgba(154,107,30,0.92); color:#fff; }
.badge-otro{ background: rgba(90,85,70,0.88); color:#fff; }
.badge-nuevo{ background: rgba(181,101,74,0.95); color:#fff; }

/* Cuántas fotos trae el anuncio: sin esto parecía que solo tenía las visibles. */
.card-media{
  position:absolute; right:10px; bottom:10px; display:flex; align-items:center; gap:6px;
  background: rgba(20,18,12,0.72); color:#fff; font-size:11.5px; font-weight:600;
  padding:5px 9px; border-radius:6px; backdrop-filter: blur(4px);
}
.card-media svg{ width:13px; height:13px; }

.card-body{ padding: 15px 16px 17px; display:flex; flex-direction:column; gap:5px; flex:1; }
.card-title{ font-size:17px; font-weight:600; font-family:'Fraunces', serif; line-height:1.28; }
.card-loc{ font-size:13px; color: var(--ink-soft); }
.card-price{ font-family:'Fraunces', serif; font-weight:700; font-size:21px; color: var(--clay-dark); margin-top:4px; font-variant-numeric: tabular-nums; }
.card-actions{ margin-top:auto; padding-top:13px; display:flex; gap:8px; }
.card-actions .btn{ flex:1; }

.empty-state{ text-align:center; padding: 70px 20px; color: var(--ink-soft); }
.empty-state h3{ margin-bottom:8px; color: var(--ink); font-size:19px; }

/* ---------------- cómo funciona ---------------- */

.pasos{ background: var(--paper); border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding: 58px 0 62px; }
.pasos h2{ font-size:28px; }
.pasos-sub{ color: var(--ink-soft); font-size:15.5px; margin-top:8px; max-width:560px; }
.pasos-lista{ list-style:none; padding:0; margin:34px 0 0; display:grid; grid-template-columns:repeat(auto-fit, minmax(250px,1fr)); gap:26px; }
.pasos-lista li{ position:relative; padding-top:6px; }
.paso-num{
  display:flex; align-items:center; justify-content:center;
  width:38px; height:38px; border-radius:50%; margin-bottom:14px;
  background: var(--pine-tint); color: var(--pine-dark);
  font-family:'Fraunces',serif; font-weight:700; font-size:17px;
  border:1px solid var(--pine);
}
.pasos-lista h3{ font-size:18px; margin-bottom:6px; }
.pasos-lista p{ font-size:14.5px; color: var(--ink-soft); line-height:1.65; }
.pasos-cta{ margin-top:38px; display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.pasos-cta span{ font-size:13.5px; color: var(--ink-soft); }

/* ---------------- aviso legal ---------------- */

.aviso-legal{ background: var(--cream); padding: 40px 0; }
.aviso-inner{ display:flex; gap:16px; align-items:flex-start; }
.aviso-inner > svg{ width:30px; height:30px; color: var(--clay-dark); flex-shrink:0; margin-top:2px; }
.aviso-inner h3{ font-size:17px; margin-bottom:6px; }
.aviso-inner p{ font-size:14px; color: var(--ink-soft); line-height:1.7; max-width:760px; }

/* ---------------- pie ---------------- */

footer{ background: var(--moss); color:#D8DACB; padding: 40px 0 30px; }
footer .shell{ display:flex; flex-direction:column; gap:22px; }
.foot-top{ display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:20px; }
.foot-brand{ display:flex; gap:12px; align-items:center; }
.foot-brand span#site-name-2{ font-family:'Fraunces',serif; font-weight:600; font-size:18px; color:#F3EEDF; }
.foot-brand p{ font-size:12.5px; color:#9BA78F; margin-top:2px; }
.foot-links{ display:flex; align-items:center; gap:18px; }
.foot-links a{ color:#B9C4AE; font-size:13px; text-decoration:none; }
.foot-links a:hover{ color:#F3EEDF; }
.foot-legal{ font-size:12px; color:#8D9781; max-width:700px; line-height:1.65; border-top:1px solid rgba(255,255,255,0.10); padding-top:18px; }
.admin-link{ background:none; border:none; color:#8E9682; font-size:12.5px; text-decoration:underline; padding:4px; }
.admin-link:hover{ color:#C9D2BE; }

@media (max-width:700px){
  .hero{ padding: 38px 0 34px; }
  .hero-trust{ flex-direction:column; gap:9px; }
  .topbar-link{ display:none; }
  .controls-row{ flex-direction:column; align-items:stretch; }
  .foot-top{ flex-direction:column; }
}

.overlay{ position:fixed; inset:0; background: rgba(20,18,12,0.55); display:flex; align-items:flex-start; justify-content:center; padding: 24px 14px; overflow-y:auto; z-index:100; }
.overlay[hidden]{ display:none; }
.modal{ background: var(--paper-2); border-radius: 12px; width:100%; max-width:560px; margin:20px auto; box-shadow: 0 30px 70px rgba(0,0,0,0.35); border:1px solid var(--line); }
.modal.modal-wide{ max-width: 760px; }
.modal-head{ display:flex; align-items:center; justify-content:space-between; padding: 18px 22px; border-bottom:1px solid var(--line); }
.modal-head h2{ font-size:20px; }
.modal-close{ background:none; border:none; font-size:22px; line-height:1; color: var(--ink-soft); padding:4px 8px; border-radius:6px; }
.modal-close:hover{ background: var(--cream); color: var(--ink); }
.modal-body{ padding: 20px 22px 22px; display:flex; flex-direction:column; gap:16px; max-height: 74vh; overflow-y:auto; }

.field-group{ display:flex; flex-direction:column; gap:5px; }
.field-group label{ font-size:13px; font-weight:600; color: var(--ink-soft); }
.field-group .hint{ font-size:12px; color: var(--ink-soft); font-weight:400; }
.field-group input[type="text"], .field-group input[type="number"], .field-group input[type="tel"],
.field-group input[type="password"],
.field-group select, .field-group textarea{ border:1px solid var(--line); background: var(--paper); border-radius:7px; padding:10px 12px; width:100%; }
.field-group textarea{ min-height:96px; resize:vertical; }
.field-row{ display:flex; gap:12px; flex-wrap:wrap; }
.field-row .field-group{ flex:1 1 160px; }
.checkline{ display:flex; align-items:center; gap:8px; font-size:13.5px; color: var(--ink-soft); }

.photo-input-wrap{ border:1.5px dashed var(--line); border-radius:9px; padding:14px; text-align:center; }
.photo-input-wrap p{ font-size:12.5px; color: var(--ink-soft); margin-top:6px; }
.thumbs{ display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; }
.thumb{ position:relative; width:64px; height:64px; border-radius:6px; overflow:hidden; border:1px solid var(--line); }
.thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.thumb button{ position:absolute; top:1px; right:1px; background:rgba(0,0,0,0.6); color:#fff; border:none; width:18px; height:18px; border-radius:50%; font-size:11px; line-height:1; }

.form-msg{ font-size:13.5px; padding:10px 12px; border-radius:7px; }
.form-msg.error{ background: rgba(166,64,47,0.1); color: var(--danger); border:1px solid rgba(166,64,47,0.25); }
.form-msg.ok{ background: var(--pine-tint); color: var(--pine-dark); border:1px solid var(--pine); }

.detail-photos{ display:grid; grid-template-columns: 1fr 1fr; gap:8px; }
.detail-photos img{ width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:7px; display:block; }
.detail-desc{ font-size:14.5px; color: var(--ink); line-height:1.7; white-space:pre-wrap; }
.detail-meta{ display:flex; gap:8px; flex-wrap:wrap; }

.admin-tabs{ display:flex; gap:6px; border-bottom:1px solid var(--line); padding: 0 22px; }
.admin-tab{ background:none; border:none; padding:10px 4px; margin-right:14px; font-weight:600; font-size:13.5px; color: var(--ink-soft); border-bottom:2px solid transparent; }
.admin-tab[aria-selected="true"]{ color: var(--clay-dark); border-color: var(--clay); }
.admin-stats{ display:flex; gap:10px; flex-wrap:wrap; padding: 4px 0 4px; }
.stat-chip{ background: var(--cream); border:1px solid var(--line); border-radius:8px; padding:8px 12px; font-size:12.5px; color: var(--ink-soft); }
.stat-chip b{ color: var(--ink); font-family:'Fraunces', serif; font-size:15px; display:block; font-variant-numeric: tabular-nums; }
/*
   Las acciones iban en una columna angosta al lado derecho. Con ocho botones
   apilados de 143px, todos iguales, el que se buscaba era imposible de
   encontrar. Ahora van en una fila horizontal debajo de los datos, separadas
   por una línea, donde cada botón conserva su ancho natural y se lee.
*/
.admin-row{ display:flex; flex-wrap:wrap; gap:12px; padding:12px; border:1px solid var(--line); border-radius:9px; align-items:flex-start; background: var(--paper); }
.admin-row + .admin-row{ margin-top:10px; }
.admin-thumb{ width:56px; height:56px; border-radius:6px; object-fit:cover; flex-shrink:0; background:var(--line); }
.admin-row-info{ flex:1 1 260px; min-width:0; }
.admin-row-info .t{ font-weight:600; font-size:14.5px; }
.admin-row-info .s{ font-size:12.5px; color: var(--ink-soft); margin-top:2px; }
.admin-row-actions{
  display:flex; gap:7px; flex-flow:row wrap; align-items:center;
  flex:1 1 100%; margin-top:4px; padding-top:11px; border-top:1px solid var(--line);
}
.status-pill{ font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:0.3px; padding:3px 7px; border-radius:5px; display:inline-block; }
.status-pendiente{ background: var(--warn-tint); color: var(--warn); }
.status-activo{ background: var(--pine-tint); color: var(--pine-dark); }
.status-archivado{ background: var(--line); color: var(--ink-soft); }
.status-rechazado{ background: var(--line); color: var(--ink-soft); }

.login-wrap{ display:flex; flex-direction:column; gap:12px; align-items:flex-start; }

.toast{ position:fixed; bottom:20px; left:50%; transform:translateX(-50%); background: var(--moss); color:#F3EEDF; padding:12px 20px; border-radius:8px; font-size:14px; box-shadow: 0 10px 30px rgba(0,0,0,0.3); z-index:200; max-width:90vw; text-align:center; }
.toast[hidden]{ display:none; }

@media (max-width:600px){
  .hero h1{ font-size:25px; }
  .modal{ margin: 8px auto; }
  .field-row{ flex-direction:column; }
}

/* ================================================================== */
/* carteles: tira pública en la portada                               */
/* ================================================================== */

.posters{ padding: 6px 0 30px; }
.posters-head{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:14px; }
.posters-head h2{ font-size:22px; }
.posters-head p{ font-size:13.5px; color:var(--ink-soft); }
.posters-row{ display:grid; grid-template-columns:repeat(auto-fill, minmax(220px,1fr)); gap:14px; }
.poster-card{
  display:block; text-decoration:none; color:inherit; background:var(--paper-2);
  border:1px solid var(--line); border-radius:var(--radius); overflow:hidden;
  box-shadow:var(--shadow); transition:transform .15s ease;
}
.poster-card:hover{ transform:translateY(-2px); }
.poster-card .pc-photo{ aspect-ratio:4/3; background:var(--line); }
.poster-card .pc-photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.poster-card .pc-body{ padding:12px 13px 14px; }
.poster-card .pc-t{ font-family:'Fraunces',serif; font-weight:600; font-size:15.5px; line-height:1.25; }
.poster-card .pc-s{ font-size:12.5px; color:var(--ink-soft); margin-top:4px; }
.poster-card .pc-p{ font-family:'Fraunces',serif; font-weight:700; font-size:16px; color:var(--clay-dark); margin-top:6px; font-variant-numeric:tabular-nums; }

/* ================================================================== */
/* carteles: lista dentro del panel de administración                 */
/* ================================================================== */

.posters-toolbar{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-bottom:4px; }
.posters-toolbar select{ border:1px solid var(--line); background:var(--paper); border-radius:7px; padding:9px 12px; max-width:260px; }
.poster-row{ display:flex; gap:12px; padding:12px; border:1px solid var(--line); border-radius:9px; align-items:center; background:var(--paper); }
.poster-row + .poster-row{ margin-top:10px; }
.poster-row .pr-thumb{ width:74px; height:56px; border-radius:6px; object-fit:cover; flex-shrink:0; background:var(--line); }
.poster-row .pr-info{ flex:1; min-width:0; }
.poster-row .pr-t{ font-weight:600; font-size:14.5px; }
.poster-row .pr-s{ font-size:12.5px; color:var(--ink-soft); margin-top:2px; }
.poster-row .pr-actions{ display:flex; gap:6px; flex-shrink:0; }
.status-publicado{ background:var(--pine-tint); color:var(--pine-dark); }
.status-borrador{ background:var(--warn-tint); color:var(--warn); }

/* ================================================================== */
/* editor de carteles                                                 */
/* ================================================================== */

.pe-overlay{ position:fixed; inset:0; z-index:300; background:var(--cream); display:flex; flex-direction:column; }
.pe-overlay[hidden]{ display:none; }

.pe-head{
  flex-shrink:0; background:var(--moss); color:#F3EEDF;
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:11px 18px; flex-wrap:wrap;
}
.pe-head-left{ display:flex; align-items:center; gap:14px; min-width:0; }
.pe-back{ background:transparent; border:1px solid rgba(255,255,255,0.3); color:#F3EEDF; border-radius:7px; padding:7px 12px; font-size:13.5px; font-weight:600; }
.pe-back:hover{ background:rgba(255,255,255,0.12); }
.pe-title{ font-family:'Fraunces',serif; font-weight:600; font-size:16.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:38vw; }
.pe-sub{ font-size:11.5px; color:#B9C4AE; margin-top:1px; }
.pe-head-right{ display:flex; gap:7px; flex-wrap:wrap; }
.pe-head-right .btn-line{ background:transparent; border-color:rgba(255,255,255,0.3); color:#F3EEDF; }
.pe-head-right .btn-line:hover{ background:rgba(255,255,255,0.12); border-color:rgba(255,255,255,0.5); }

.pe-main{ flex:1; display:flex; min-height:0; }

.pe-form{
  width:390px; flex-shrink:0; overflow-y:auto; background:var(--paper-2);
  border-right:1px solid var(--line); padding:16px 16px 70px;
}
.pe-group{ border-bottom:1px solid var(--line); padding-bottom:16px; margin-bottom:16px; }
.pe-group:last-child{ border-bottom:none; }
.pe-group-t{ font-family:'Inter',sans-serif; font-size:11.5px; font-weight:700; letter-spacing:1.8px; text-transform:uppercase; color:var(--ink-soft); margin-bottom:12px; }

.pe-tpls{ display:flex; flex-direction:column; gap:8px; }
.pe-tpl{
  text-align:left; border:1.5px solid var(--line); background:var(--paper); border-radius:9px;
  padding:11px 13px; display:flex; flex-direction:column; gap:2px;
}
.pe-tpl:hover{ border-color:var(--clay); }
.pe-tpl[aria-pressed="true"]{ border-color:var(--clay); background:var(--clay-tint); }
.pe-tpl .n{ font-weight:700; font-size:14px; color:var(--ink); }
.pe-tpl .r{ font-size:11px; color:var(--clay-dark); font-weight:600; }
.pe-tpl .d{ font-size:12px; color:var(--ink-soft); line-height:1.45; }

.pe-palettes{ display:flex; gap:8px; flex-wrap:wrap; }
.pe-palette{
  border:1.5px solid var(--line); background:var(--paper); border-radius:8px; padding:7px 9px 6px;
  display:flex; flex-direction:column; align-items:center; gap:5px; font-size:11px; color:var(--ink-soft); font-weight:600;
}
.pe-palette:hover{ border-color:var(--pine); }
.pe-palette[aria-pressed="true"]{ border-color:var(--pine); background:var(--pine-tint); color:var(--pine-dark); }
.pe-palette .sw{ display:flex; border-radius:4px; overflow:hidden; border:1px solid rgba(0,0,0,0.12); }
.pe-palette .sw i{ width:14px; height:18px; display:block; }

.pe-field{ display:flex; flex-direction:column; gap:5px; margin-bottom:13px; }
.pe-field > label{ font-size:12.5px; font-weight:600; color:var(--ink-soft); }
.pe-hint{ font-size:11.5px; color:var(--ink-soft); line-height:1.45; }
.pe-input{
  border:1px solid var(--line); background:var(--paper); border-radius:7px;
  padding:9px 11px; width:100%; font-size:14px; color:var(--ink);
}
.pe-input:focus{ outline:2px solid var(--pine); outline-offset:-1px; border-color:transparent; }
textarea.pe-input{ resize:vertical; line-height:1.55; }

.pe-image{ border:1.5px dashed var(--line); border-radius:9px; padding:9px; display:flex; gap:10px; align-items:center; }
.pe-image.has{ border-style:solid; }
.pe-image img{ width:92px; height:66px; object-fit:cover; border-radius:6px; flex-shrink:0; display:block; }
.pe-image-empty{
  width:92px; height:66px; border-radius:6px; flex-shrink:0; background:var(--cream);
  display:flex; align-items:center; justify-content:center; font-size:11.5px; color:var(--ink-soft);
}
.pe-image-actions{ display:flex; flex-direction:column; gap:6px; }

.pe-mini{
  border:1px solid var(--line); background:var(--paper); border-radius:6px;
  padding:6px 10px; font-size:12.5px; font-weight:600; color:var(--ink); white-space:nowrap;
}
.pe-mini:hover{ border-color:var(--clay); }
.pe-mini.danger{ color:var(--danger); }
.pe-mini.danger:hover{ border-color:var(--danger); }
.pe-mini.add{ width:100%; border-style:dashed; color:var(--ink-soft); }

.pe-list{ display:flex; flex-direction:column; gap:7px; }
.pe-list-item{ display:flex; gap:6px; align-items:flex-start; }
.pe-list-inputs{ flex:1; display:flex; gap:6px; min-width:0; }
.pe-list-inputs .pe-input{ flex:1; min-width:0; padding:7px 9px; font-size:13px; }
.pe-list-inputs .pe-input.xs{ flex:0 0 46px; text-align:center; }
.pe-list-item > .pe-mini{ padding:7px 9px; line-height:1; }

.pe-stage{ flex:1; display:flex; flex-direction:column; min-width:0; }
.pe-toolbar{
  flex-shrink:0; display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:9px 16px; border-bottom:1px solid var(--line); background:var(--paper-2);
  font-size:12.5px; color:var(--ink-soft); font-weight:600;
}
.pe-zoom{ display:flex; gap:4px; }
.pe-zoom button{
  border:1px solid var(--line); background:var(--paper); border-radius:6px;
  padding:5px 10px; font-size:12px; font-weight:600; color:var(--ink-soft);
}
.pe-zoom button[aria-pressed="true"]{ background:var(--pine); border-color:var(--pine); color:#fff; }
.pe-scroll{ flex:1; overflow:auto; padding:20px; display:flex; justify-content:center; align-items:flex-start; }
.pe-canvas{ position:relative; flex-shrink:0; }
.pe-scaler{ position:absolute; top:0; left:0; width:900px; transform-origin:top left; box-shadow:0 18px 44px rgba(0,0,0,0.20); }

@media (max-width:900px){
  .pe-main{ flex-direction:column; }
  .pe-form{ width:100%; border-right:none; border-bottom:1px solid var(--line); max-height:46vh; padding-bottom:20px; }
  .pe-stage{ min-height:44vh; }
  .pe-title{ max-width:60vw; }
  .pe-head-right{ width:100%; }
  .pe-head-right .btn{ flex:1; }
}

/* ================================================================== */
/* visor de fotos a pantalla completa                                 */
/* ================================================================== */

.lb-overlay{
  position:fixed; inset:0; z-index:400; background:rgba(12,11,8,0.94);
  display:flex; align-items:center; justify-content:center; gap:6px; padding:16px;
}
.lb-overlay[hidden]{ display:none; }
.lb-escenario{ flex:1; height:100%; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.lb-img{
  max-width:100%; max-height:100%; object-fit:contain; display:block;
  cursor:zoom-in; transition:transform .18s ease; touch-action:none; user-select:none;
}
.lb-img.acercado{ cursor:grab; transition:none; }
.lb-img.acercado:active{ cursor:grabbing; }
.lb-cerrar{
  position:absolute; top:14px; right:16px; z-index:2;
  background:rgba(255,255,255,0.12); border:1px solid rgba(255,255,255,0.28); color:#fff;
  width:40px; height:40px; border-radius:50%; font-size:24px; line-height:1;
}
.lb-cerrar:hover{ background:rgba(255,255,255,0.24); }
.lb-nav{
  flex-shrink:0; background:rgba(255,255,255,0.12); border:1px solid rgba(255,255,255,0.28); color:#fff;
  width:46px; height:64px; border-radius:8px; font-size:30px; line-height:1;
}
.lb-nav:hover{ background:rgba(255,255,255,0.24); }
.lb-nav[hidden]{ display:none; }
.lb-pie{
  position:absolute; bottom:14px; left:0; right:0; display:flex; flex-direction:column;
  align-items:center; gap:3px; color:rgba(255,255,255,0.75); font-size:13px; pointer-events:none;
}
.lb-ayuda{ font-size:11.5px; color:rgba(255,255,255,0.45); }

@media (max-width:600px){
  .lb-overlay{ padding:8px; }
  .lb-nav{ width:36px; height:52px; font-size:24px; }
}

/* ================================================================== */
/* página pública de un anuncio                                       */
/* ================================================================== */

.an-cargando{ padding:60px 0; color:var(--ink-soft); }
.an-cabeza{ padding:28px 0 18px; }
.an-cabeza h1{ font-size:29px; margin-top:10px; max-width:760px; }
.an-loc{ font-size:15px; color:var(--ink-soft); margin-top:8px; }

.an-galeria{ display:grid; grid-template-columns:1fr 190px; gap:10px; margin-bottom:26px; }
.an-foto-pri{
  position:relative; padding:0; border:none; background:var(--line);
  border-radius:var(--radius); overflow:hidden; aspect-ratio:16/10; cursor:zoom-in;
}
.an-foto-pri img{ width:100%; height:100%; object-fit:cover; display:block; }
.an-lupa{
  position:absolute; bottom:12px; right:12px; background:rgba(20,18,12,0.72); color:#fff;
  font-size:12.5px; font-weight:600; padding:7px 12px; border-radius:6px; letter-spacing:0.3px;
}
/*
   Las miniaturas se reparten exactamente el alto de la foto principal.
   Con flex-basis 0 y min-height 0 no aportan alto propio, así que la fila la
   define la foto grande y no queda hueco debajo de ella.
*/
.an-tiras{ display:flex; flex-direction:column; gap:10px; min-height:0; }
.an-foto-min{
  padding:0; border:none; background:var(--line); border-radius:8px; overflow:hidden;
  cursor:zoom-in; flex:1 1 0; min-height:0;
}
.an-foto-min img{ width:100%; height:100%; object-fit:cover; display:block; }
.an-foto-min:hover, .an-foto-pri:hover{ outline:2px solid var(--clay); outline-offset:2px; }

.an-cuerpo{ display:grid; grid-template-columns:1fr 300px; gap:32px; padding-bottom:50px; align-items:start; }
.an-principal h2{ font-size:20px; margin-bottom:10px; }
.an-ficha{ margin-top:24px; border-top:1px solid var(--line); }
.an-ficha > div{ display:flex; justify-content:space-between; gap:16px; padding:11px 0; border-bottom:1px solid var(--line); }
.an-ficha dt{ font-size:13px; color:var(--ink-soft); font-weight:600; }
.an-ficha dd{ font-size:14.5px; margin:0; text-align:right; }

.an-lateral{ position:sticky; top:20px; }
.an-precio-card{ border:1px solid var(--line); background:var(--paper); border-radius:var(--radius); padding:22px 20px; box-shadow:var(--shadow); }
.an-precio-card .plabel{ font-size:11.5px; letter-spacing:2px; text-transform:uppercase; color:var(--ink-soft); font-weight:700; }
.an-precio-card .pval{ font-family:'Fraunces',serif; font-size:29px; font-weight:700; color:var(--clay-dark); margin-top:5px; font-variant-numeric:tabular-nums; }

@media (max-width:820px){
  .an-galeria{ grid-template-columns:1fr; }
  .an-tiras{ flex-direction:row; }
  .an-foto-min{ aspect-ratio:1/1; }
  .an-cuerpo{ grid-template-columns:1fr; gap:24px; }
  .an-lateral{ position:static; }
  .an-cabeza h1{ font-size:24px; }
}

/* ================================================================== */
/* datos privados: solo los ve el administrador                       */
/* ================================================================== */

.privado{
  border:1.5px solid var(--warn); background:var(--warn-tint);
  border-radius:9px; padding:14px 16px 16px; margin:4px 0 0;
}
.privado legend{
  font-size:11.5px; font-weight:700; letter-spacing:1.4px; text-transform:uppercase;
  color:var(--warn); padding:0 8px;
}
.privado-nota{ font-size:12.5px; color:var(--ink-soft); line-height:1.55; margin-bottom:12px; }
.privado .field-row{ margin-bottom:10px; }
.privado .checkline{ margin:2px 0 10px; }
.privado #owner-fields[hidden]{ display:none; }

.ref-chip{
  display:inline-block; font-family:ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size:11.5px; font-weight:700; letter-spacing:0.6px;
  background:var(--pine); color:#fff; padding:2px 7px; border-radius:5px;
  vertical-align:middle;
}
.privado-linea{ background:var(--warn-tint); border-radius:6px; padding:5px 8px; margin-top:5px !important; }
.privado-linea b{ color:var(--ink); }
.tenue{ color:var(--ink-soft); font-style:italic; }

#admin-search{ width:100%; margin-bottom:2px; }

/* ================================================================== */
/* fotos y video en el formulario                                     */
/* ================================================================== */

.contador-campo{
  font-weight:600; font-size:11.5px; color:var(--pine-dark);
  background:var(--pine-tint); border-radius:20px; padding:2px 9px; margin-left:6px;
}
.thumb{ position:relative; width:72px; height:72px; border-radius:7px; overflow:hidden; border:1px solid var(--line); }
.thumb.portada{ border:2px solid var(--clay); }
.thumb-tag{
  position:absolute; left:0; right:0; bottom:0; background:rgba(181,101,74,0.92); color:#fff;
  font-size:9.5px; font-weight:700; text-transform:uppercase; letter-spacing:0.4px; text-align:center; padding:2px 0;
}
.video-chip{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  margin-top:10px; padding:9px 12px; border-radius:8px;
  background:var(--pine-tint); border:1px solid var(--pine); font-size:13px; font-weight:600; color:var(--pine-dark);
}

/* ================================================================== */
/* galería del anuncio                                                */
/* ================================================================== */

.an-galeria-pie{
  display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
  margin:-16px 0 26px; font-size:13.5px; color:var(--ink-soft); font-weight:500;
}
.an-vertodas{
  background:none; border:none; color:var(--clay-dark); font-size:13.5px; font-weight:600;
  text-decoration:underline; padding:0;
}
.an-mas{
  position:absolute; inset:0; background:rgba(20,18,12,0.62); color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-family:'Fraunces',serif; font-weight:600; font-size:20px;
}
.an-foto-min{ position:relative; }
.an-sinfoto{
  border:1.5px dashed var(--line); border-radius:var(--radius); padding:44px 20px;
  text-align:center; color:var(--ink-soft); font-size:14px; margin-bottom:26px;
}
/*
   El video vive en la columna lateral, debajo del precio. Ahí aprovecha el
   espacio que quedaba vacío y deja que la ficha de datos suba, en vez de
   empujarla media pantalla hacia abajo.
   margin:auto no centra un <video> con width:auto, porque su ancho lo define el
   propio archivo; por eso la caja es flex.
*/
.an-video{ margin-top:14px; display:flex; flex-direction:column; align-items:center; }
.an-video h2{ align-self:flex-start; font-size:15px; margin-bottom:8px; }
.an-video h2{ font-size:20px; margin-bottom:12px; }
/*
   width:auto deja que el video conserve su forma: los de celular son verticales
   y a ancho completo quedaban con franjas negras enormes a los lados.
*/
.an-video video{
  width:auto; max-width:100%; max-height:420px; display:block;
  border-radius:var(--radius); background:#000; box-shadow:var(--shadow);
}
@media (max-width:820px){
  /* En móvil hay ancho de sobra, así que el video puede crecer. */
  .an-video video{ max-height:520px; }
}

/* ================================================================== */
/* panel: aviso al vendedor y estado vendido                          */
/* ================================================================== */

.aviso-link{ color:var(--pine-dark); font-weight:600; white-space:nowrap; }
.status-vendido{ background:var(--clay-tint); color:var(--clay-dark); }
.admin-row-actions .btn{ width:auto; }

/* ================================================================== */
/* bloques del formulario, GPS, compartir y confirmación              */
/* ================================================================== */

.bloque{
  border:1px solid var(--line); border-radius:9px; padding:14px 16px 6px; margin:4px 0 0;
  background:var(--paper);
}
.bloque legend{
  font-size:11.5px; font-weight:700; letter-spacing:1.4px; text-transform:uppercase;
  color:var(--ink-soft); padding:0 8px;
}
.bloque .field-row{ margin-bottom:10px; }

.gps-row{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.gps-row .btn{ flex-shrink:0; }
.gps-row input{
  flex:1 1 110px; min-width:100px; border:1px solid var(--line); background:var(--paper-2);
  border-radius:7px; padding:9px 11px; font-size:14px; color:var(--ink);
}
#gps-estado:empty{ display:none; }

.compartir{ margin-top:22px; border-top:1px solid var(--line); padding-top:18px; }
.compartir-t{ font-size:13px; font-weight:700; letter-spacing:1.2px; text-transform:uppercase; color:var(--ink-soft); margin-bottom:10px; }
.compartir-nota{ font-size:12.5px; color:var(--ink-soft); line-height:1.55; margin-top:10px; }
.compartir-botones{ display:flex; gap:8px; flex-wrap:wrap; }
.compartir-btn{
  display:inline-flex; align-items:center; justify-content:center;
  border:1px solid var(--line); background:var(--paper-2); color:var(--ink);
  border-radius:8px; padding:9px 14px; font-size:13.5px; font-weight:600;
  text-decoration:none; cursor:pointer;
}
.compartir-btn:hover{ border-color:var(--clay); color:var(--clay-dark); }
.compartir-btn.wa{ background:#25632F; border-color:#25632F; color:#fff; }
.compartir-btn.wa:hover{ background:#1C4E25; color:#fff; }
.compartir-btn.fb{ background:#2B4A87; border-color:#2B4A87; color:#fff; }
.compartir-btn.fb:hover{ background:#213A6C; color:#fff; }

.admin-row .compartir{ margin-top:12px; border-top:none; padding-top:10px; }
.admin-row .compartir-botones{ gap:6px; }
.admin-row .compartir-btn{ padding:6px 10px; font-size:12.5px; }

.exito{ text-align:center; padding:10px 0 6px; }
.exito-ico{
  width:52px; height:52px; border-radius:50%; margin:0 auto 14px;
  background:var(--pine-tint); color:var(--pine-dark);
  display:flex; align-items:center; justify-content:center; font-size:26px; font-weight:700;
  border:1px solid var(--pine);
}
.exito h3{ font-size:21px; margin-bottom:8px; }
.exito > p{ font-size:14.5px; color:var(--ink-soft); }
.exito-enlace{
  margin:16px auto 0; max-width:100%; overflow-wrap:anywhere;
  background:var(--cream); border:1px solid var(--line); border-radius:8px;
  padding:11px 14px; font-size:13px; color:var(--ink-soft);
  font-family:ui-monospace, SFMono-Regular, Menlo, monospace;
}
.exito .compartir{ text-align:left; }

/* Cómo llegar: las dos apps de navegación, una al lado de la otra. */
.mapa-acciones{ margin-top:14px; padding-top:14px; border-top:1px solid var(--line); }
.mapa-t{ font-size:11.5px; font-weight:700; letter-spacing:1.6px; text-transform:uppercase; color:var(--ink-soft); margin-bottom:8px; }
.mapa-acciones .btn{ width:calc(50% - 4px); }
.mapa-acciones .btn + .btn{ margin-left:6px; }

/* type="search" trae adornos propios de cada navegador; se normalizan para que
   se vea igual que el resto de campos. */
input[type="search"]{ -webkit-appearance:none; appearance:none; }
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button{ -webkit-appearance:none; }

/* ================================================================== */
/* aviso para instalar la app                                         */
/* ================================================================== */

.instalar-app{
  position:fixed; left:50%; transform:translateX(-50%); bottom:18px; z-index:250;
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  background:var(--paper-2); border:1px solid var(--line); border-radius:14px;
  padding:14px 18px; box-shadow:0 18px 44px rgba(42,40,32,0.22);
  width:min(560px, calc(100vw - 28px));
}
.instalar-app[hidden]{ display:none; }
.instalar-app img{ width:44px; height:44px; border-radius:10px; flex-shrink:0; }
.instalar-txt{ flex:1; min-width:150px; display:flex; flex-direction:column; }
.instalar-txt b{ font-size:14.5px; }
.instalar-txt span{ font-size:12.5px; color:var(--ink-soft); margin-top:2px; }
.instalar-btns{ display:flex; gap:7px; }

@media (max-width:520px){
  .instalar-app{ bottom:12px; padding:12px 14px; }
  .instalar-btns{ width:100%; }
  .instalar-btns .btn{ flex:1; }
}

/* ================================================================== */
/* anuncios destacados                                                */
/* ================================================================== */

.badge-destacado{ background:rgba(154,107,30,0.95); color:#fff; }
.card-destacada{ border-color:var(--warn); box-shadow:0 1px 2px rgba(42,40,32,0.05), 0 10px 28px rgba(154,107,30,0.18); }
.card-destacada:hover{ border-color:var(--warn); box-shadow:0 4px 8px rgba(42,40,32,0.07), 0 20px 44px rgba(154,107,30,0.26); }

/* ================================================================== */
/* generador de imagen para redes                                     */
/* ================================================================== */

.ir-formatos{ display:flex; gap:8px; flex-wrap:wrap; }
.ir-formato{
  flex:1 1 150px; text-align:left; border:1.5px solid var(--line); background:var(--paper);
  border-radius:9px; padding:11px 13px; display:flex; flex-direction:column; gap:2px;
}
.ir-formato:hover{ border-color:var(--clay); }
.ir-formato[aria-pressed="true"]{ border-color:var(--clay); background:var(--clay-tint); }
.ir-formato b{ font-size:14px; color:var(--ink); }
.ir-formato span{ font-size:12px; color:var(--ink-soft); }

.ir-vista{
  display:flex; justify-content:center; align-items:flex-start;
  background:var(--cream); border:1px solid var(--line); border-radius:10px;
  padding:16px; max-height:52vh; overflow:auto;
}
.ir-vista canvas{
  max-width:100%; max-height:calc(52vh - 32px); height:auto; width:auto;
  border-radius:6px; box-shadow:0 10px 30px rgba(42,40,32,0.22); display:block;
}

.ir-pie{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.ir-pie span{ font-size:12.5px; color:var(--ink-soft); font-variant-numeric:tabular-nums; }

.ir-grupo{ display:flex; flex-direction:column; gap:7px; }
.ir-rotulo{ font-size:11.5px; font-weight:700; letter-spacing:1.4px; text-transform:uppercase; color:var(--ink-soft); }

/* ================================================================== */
/* editor de publicaciones                                            */
/* ================================================================== */

.pe2-scroll{ align-items:center; }
#pe2-canvas{
  max-width:100%; max-height:calc(100vh - 190px); width:auto; height:auto;
  border-radius:6px; box-shadow:0 18px 44px rgba(0,0,0,0.28); display:block;
}
.pe2-fotos{ display:flex; gap:8px; flex-wrap:wrap; }
.pe2-foto{
  position:relative; width:66px; height:66px; padding:0; overflow:hidden;
  border:2px solid var(--line); border-radius:8px; background:var(--line); opacity:0.5;
}
.pe2-foto img{ width:100%; height:100%; object-fit:cover; display:block; }
.pe2-foto.puesta{ opacity:1; border-color:var(--clay); }
.pe2-foto span{
  position:absolute; top:3px; left:3px; width:19px; height:19px; border-radius:50%;
  background:var(--clay); color:#fff; font-size:11px; font-weight:700;
  display:flex; align-items:center; justify-content:center;
}

.pe-select{ appearance:auto; cursor:pointer; }

/* ---- compartir el cartel como imagen ---- */

.compartir-cartel{
  margin-top:12px; padding-top:12px; border-top:1px solid var(--line);
}
.compartir-cartel .btn{ width:100%; }
.compartir-cartel .compartir-nota{ margin-top:6px; }

/* ---- barra de retoque del cartel ---- */

.pe-add-txt{
  margin-left:auto; margin-right:10px;
  padding:6px 12px; border:1px solid var(--line); border-radius:8px;
  background:var(--paper); color:var(--ink); font:inherit; font-size:13px;
  font-weight:600; cursor:pointer;
}
.pe-add-txt:hover{ border-color:var(--pine); color:var(--pine); }

.pe-retoque{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  padding:8px 14px; background:var(--pine); color:#fff;
}
.pe-ret-t{ font-size:12px; font-weight:700; letter-spacing:1px; text-transform:uppercase; opacity:0.85; }
.pe-retoque button{
  padding:5px 10px; border:1px solid rgba(255,255,255,0.35); border-radius:7px;
  background:rgba(255,255,255,0.12); color:#fff; font:inherit; font-size:13px;
  font-weight:600; cursor:pointer; line-height:1.2;
}
.pe-retoque button:hover{ background:rgba(255,255,255,0.24); }
.pe-ret-grupo{ display:inline-flex; align-items:center; gap:6px; }
.pe-ret-tam{ min-width:34px; text-align:center; font-size:13px; font-weight:700; }
.pe-ret-input{
  flex:1 1 180px; min-width:120px;
  padding:6px 10px; border:1px solid rgba(255,255,255,0.35); border-radius:7px;
  background:rgba(255,255,255,0.14); color:#fff; font:inherit; font-size:13px;
}
.pe-ret-input::placeholder{ color:rgba(255,255,255,0.6); }
.pe-ret-color{ display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:600; cursor:pointer; }
.pe-ret-color input{ width:30px; height:26px; padding:0; border:1px solid rgba(255,255,255,0.35); border-radius:6px; background:none; cursor:pointer; }
.pe-ret-x{ background:rgba(0,0,0,0.25) !important; }
.pe-ret-cerrar{ margin-left:auto; padding:4px 10px !important; font-size:16px !important; }

/* lo elegido se marca en la vista previa, nunca en el cartel exportado */
#pe-scaler .pe-elegido{ outline:2px dashed var(--clay); outline-offset:3px; }
#pe-scaler .tc-extra{ pointer-events:auto; cursor:move; }
#pe-scaler .tc-poster{ cursor:default; }

/* ---- programar visita: calendario y formulario ---- */

.visita-caja .modal-body{ gap:14px; }
.visita-intro{ font-size:13px; color:var(--ink-soft); }
.visita-pista{ font-size:13px; color:var(--ink-soft); text-align:center; padding:6px 0; }
.visita-error{ font-size:14px; color:var(--danger); }
.visita-cargando{ font-size:14px; color:var(--ink-soft); }

.vc{ border:1px solid var(--line); border-radius:12px; padding:12px; background:var(--paper); }
.vc-cabeza{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; }
.vc-cabeza strong{ font-size:15px; text-transform:capitalize; }
.vc-nav{
  width:30px; height:30px; border:1px solid var(--line); border-radius:8px;
  background:var(--paper-2); color:var(--ink); font-size:17px; line-height:1; cursor:pointer;
}
.vc-nav:disabled{ opacity:0.35; cursor:default; }
.vc-semana, .vc-rejilla{ display:grid; grid-template-columns:repeat(7, 1fr); gap:4px; }
.vc-semana span{
  text-align:center; font-size:11px; font-weight:700; letter-spacing:0.5px;
  text-transform:uppercase; color:var(--ink-soft); padding-bottom:4px;
}
.vc-hueco{ display:block; }
.vc-dia{
  position:relative; display:flex; align-items:center; justify-content:center;
  aspect-ratio:1/1; min-height:36px; border-radius:9px; border:1px solid transparent;
  background:var(--paper-2); color:var(--ink); font:inherit; font-size:14px; font-weight:600;
  cursor:pointer;
}
.vc-dia i{
  position:absolute; bottom:5px; width:4px; height:4px; border-radius:50%;
  background:var(--pine);
}
.vc-dia:hover{ border-color:var(--pine); }
.vc-dia.es{ background:var(--pine); color:#fff; }
.vc-dia.es i{ background:#fff; }
/* Día sin cupo: se ve, pero apagado y sin invitar a tocarlo. */
.vc-no{ background:none; color:var(--ink-soft); opacity:0.4; cursor:default; font-weight:400; }
.vc-no:hover{ border-color:transparent; }

.vh-t{ font-size:13px; font-weight:600; margin-bottom:8px; }
.vh-lista{ display:flex; flex-wrap:wrap; gap:8px; }
.vh-hora{
  padding:8px 13px; border:1px solid var(--line); border-radius:999px;
  background:var(--paper-2); color:var(--ink); font:inherit; font-size:13px; font-weight:600;
  cursor:pointer;
}
.vh-hora:hover{ border-color:var(--pine); color:var(--pine); }
.vh-hora.es{ background:var(--pine); border-color:var(--pine); color:#fff; }

.visita-form{ display:flex; flex-direction:column; gap:12px; }
.visita-form[hidden]{ display:none; }
.visita-form label{ display:flex; flex-direction:column; gap:5px; font-size:13px; font-weight:600; }
.visita-form input, .visita-form textarea{
  padding:10px 12px; border:1px solid var(--line); border-radius:9px;
  background:var(--paper); color:var(--ink); font:inherit; font-size:14px; font-weight:400;
}
.visita-opc{ font-weight:400; color:var(--ink-soft); }
.visita-elegido{
  padding:10px 14px; border-radius:9px; background:var(--pine-tint);
  color:var(--pine-dark); font-size:14px; text-transform:capitalize;
}
.visita-nota{ font-size:12px; color:var(--ink-soft); text-align:center; }

.visita-ok{ text-align:center; padding:10px 0 4px; }
.visita-ok-i{
  width:56px; height:56px; margin:0 auto 14px; border-radius:50%;
  background:var(--pine); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:30px;
}
.visita-ok h3{ font-size:21px; margin-bottom:8px; }
.visita-ok p{ font-size:14px; margin-bottom:6px; }
.visita-ok-sub{ color:var(--ink-soft); }
.visita-ok-ref{ font-size:12px !important; color:var(--ink-soft); margin:12px 0 16px !important; }

/* ---- panel: visitas programadas ---- */

.visitas-t{ font-size:15px; margin:20px 0 10px; }
.visita-fila{
  display:grid; grid-template-columns:150px 1fr auto; gap:14px; align-items:start;
  padding:12px 14px; margin-bottom:8px;
  border:1px solid var(--line); border-left:4px solid var(--pine); border-radius:10px;
  background:var(--paper);
}
.visita-fila.estado-cancelada{ border-left-color:var(--danger); opacity:0.6; }
.visita-fila.estado-confirmada{ border-left-color:var(--clay); }
.visita-fila.estado-hecha{ border-left-color:var(--ink-soft); opacity:0.75; }
.visita-cuando b{ display:block; font-size:13.5px; text-transform:capitalize; }
.visita-cuando span{ font-size:18px; font-weight:700; color:var(--pine-dark); }
.visita-quien b{ font-size:14px; }
.visita-datos{ font-size:13px; margin-top:2px; }
.visita-datos a{ color:var(--pine-dark); }
.visita-prop{ font-size:12.5px; color:var(--ink-soft); margin-top:3px; }
.visita-nota-adm{ font-size:12.5px; color:var(--ink-soft); font-style:italic; margin-top:4px; }
.visita-acciones{ display:flex; flex-direction:column; align-items:flex-end; gap:6px; }
.visita-estado{
  font-size:11px; font-weight:700; letter-spacing:0.5px; text-transform:uppercase;
  color:var(--ink-soft);
}
.visita-acciones select{
  padding:5px 8px; border:1px solid var(--line); border-radius:7px;
  background:var(--paper-2); font:inherit; font-size:13px;
}

.agenda-cfg{
  padding:16px; border:1px solid var(--line); border-radius:12px;
  background:var(--paper-2); display:flex; flex-direction:column; gap:12px;
}
.agenda-pista{ font-size:12.5px; color:var(--ink-soft); margin-top:-6px; }
.agenda-dias{ display:flex; flex-wrap:wrap; gap:12px; }
.agenda-dia{ display:inline-flex; align-items:center; gap:5px; font-size:13.5px; text-transform:capitalize; }
.agenda-horas{ display:flex; flex-wrap:wrap; gap:14px; }
.agenda-horas label, .agenda-aviso{
  display:flex; flex-direction:column; gap:4px; font-size:12.5px; font-weight:600; color:var(--ink-soft);
}
.agenda-horas input, .agenda-horas select, .agenda-aviso input, .agenda-aviso textarea{
  padding:8px 10px; border:1px solid var(--line); border-radius:8px;
  background:var(--paper); color:var(--ink); font:inherit; font-size:14px; font-weight:400;
}
.agenda-opc{ font-weight:400; }
.agenda-cfg .btn{ align-self:flex-start; }

@media (max-width: 700px){
  .visita-fila{ grid-template-columns:1fr; }
  .visita-acciones{ align-items:flex-start; flex-direction:row; flex-wrap:wrap; }
}

/* ---- mapa para marcar el punto de la propiedad ---- */

.mp-caja{ margin-top:10px; }
.mp-barra{ display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.mp-t{ font-size:13px; font-weight:600; color:var(--ink-soft); }
.mp-mapa{
  height:340px; margin-top:10px;
  border:1px solid var(--line); border-radius:12px; overflow:hidden;
  background:var(--cream);
}
.mp-mapa[hidden]{ display:none; }
.mp-pista{ margin-top:6px; }

/* Marcador propio: no depende de las imágenes que trae Leaflet. */
.mp-pin{ background:none; border:none; }
.mp-pin-cuerpo{
  display:block; width:22px; height:22px; margin:0 auto;
  background:var(--clay); border:3px solid #fff; border-radius:50% 50% 50% 0;
  transform:rotate(-45deg);
  box-shadow:0 3px 10px rgba(0,0,0,0.4);
}
.leaflet-container{ font: inherit; }

/* ---- orden de las ventanas superpuestas ---- */

/*
 * El formulario se abre DESDE el panel de administración, así que tiene que
 * quedar por encima. Los dos son .overlay con el mismo z-index, y como el
 * panel va después en el HTML terminaba tapando al formulario: al pulsar
 * Editar el formulario abría, pero detrás, y parecía que el botón no servía.
 */
#publish-overlay{ z-index:150; }
