/* =========================================================
   Identidad visual — Gestión Inmobiliaria
   Navy + dorado sobrio. Capa sobre Bootstrap 5.
   ========================================================= */
:root {
  --navy:    #1F3A5F;
  --navy-700:#182E4B;
  --navy-900:#12233A;
  --gold:    #C9A227;
  --gold-600:#B08E1E;
  --ink:     #1A1F29;
  --muted:   #6B7280;
  --line:    #E4E7EC;
  --bg:      #F4F6F9;
  --card:    #FFFFFF;
  --radius:  12px;
}

* { box-sizing: border-box; }
body { font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; color: var(--ink); }

.btn-brand {
  background: var(--navy);
  border-color: var(--navy);
  color: #fff;
  font-weight: 600;
  padding: .6rem 1rem;
}
.btn-brand:hover { background: var(--navy-700); border-color: var(--navy-700); color: #fff; }
.btn-brand:focus-visible { outline: 3px solid rgba(201,162,39,.5); outline-offset: 2px; }

/* ---------- AUTH ---------- */
.auth-body {
  min-height: 100vh;
  margin: 0;
  display: flex; align-items: center; justify-content: center;
  background:
    radial-gradient(1200px 600px at 100% -10%, rgba(201,162,39,.10), transparent 60%),
    linear-gradient(160deg, var(--navy-900), var(--navy) 70%);
  padding: 1.5rem;
}
.auth-wrap { width: 100%; max-width: 400px; }
.auth-card {
  background: var(--card);
  border-radius: var(--radius);
  padding: 2rem 1.75rem;
  box-shadow: 0 20px 50px rgba(0,0,0,.25);
}
.auth-brand { display:flex; align-items:center; gap:.5rem; margin-bottom:1.5rem; }
.auth-brand__mark { color: var(--gold); font-size:1.4rem; line-height:1; }
.auth-brand__name { font-weight:700; letter-spacing:.02em; color: var(--navy); }
.auth-title { font-size:1.4rem; font-weight:700; margin:0 0 .25rem; }
.auth-sub { color: var(--muted); font-size:.925rem; margin-bottom:1.25rem; }
.auth-links { margin-top:1rem; text-align:center; font-size:.9rem; }
.auth-links a { color: var(--navy); text-decoration:none; }
.auth-links a:hover { text-decoration:underline; }
.auth-foot { text-align:center; color: rgba(255,255,255,.7); font-size:.8rem; margin-top:1rem; }
.form-control:focus { border-color: var(--navy); box-shadow: 0 0 0 .2rem rgba(31,58,95,.15); }

/* ---------- SHELL ---------- */
.g-body { background: var(--bg); margin:0; }
.g-shell { display:flex; min-height:100vh; }

.g-side {
  width: 250px; flex-shrink:0;
  background: var(--navy-900);
  color: #cfd8e3;
  display:flex; flex-direction:column;
  position: sticky; top:0; height:100vh;
}
.g-side__brand {
  display:flex; flex-direction:column; align-items:center; gap:.5rem;
  padding:1.15rem 1.25rem;
  border-bottom:1px solid rgba(255,255,255,.08);
  text-align:center;
}
.g-side__logo { max-width:150px; max-height:52px; width:auto; height:auto; object-fit:contain; }
.g-side__mark { color: var(--gold); font-size:1.8rem; line-height:1; }
.g-side__name { color:#fff; font-weight:700; letter-spacing:.02em; font-size:.9rem; }

.g-nav { padding:.75rem .6rem; overflow-y:auto; }
.g-nav__label {
  font-size:.68rem; text-transform:uppercase; letter-spacing:.08em;
  color: rgba(255,255,255,.38); padding:.9rem .7rem .3rem;
}
.g-nav__link {
  display:flex; align-items:center; gap:.7rem;
  padding:.6rem .7rem; border-radius:8px;
  color:#cfd8e3; text-decoration:none; font-size:.925rem;
  transition: background .15s, color .15s;
}
.g-nav__link:hover { background: rgba(255,255,255,.06); color:#fff; }
.g-nav__link.is-active { background: var(--navy); color:#fff; }
.g-nav__link.is-active i { color: var(--gold); }
.g-nav__link i { font-size:1.05rem; width:1.2rem; text-align:center; }

.g-main { flex:1; display:flex; flex-direction:column; min-width:0; }
.g-top {
  display:flex; align-items:center; gap:1rem;
  background:#fff; border-bottom:1px solid var(--line);
  padding:.75rem 1.25rem; position:sticky; top:0; z-index:20;
}
.g-top__title { font-size:1.1rem; font-weight:700; margin:0; flex:1; }
.g-burger { display:none; background:none; border:0; font-size:1.4rem; color:var(--ink); }

.g-user { display:flex; align-items:center; gap:.55rem; background:none; border:0; cursor:pointer; }
.g-user__avatar {
  width:34px; height:34px; border-radius:50%;
  background: var(--navy); color:#fff;
  display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.9rem;
}
.g-user__name { font-weight:600; font-size:.9rem; }

.g-content { padding:1.5rem; flex:1; }

/* ---------- CARDS ---------- */
.g-cards {
  display:grid; gap:1rem;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
}
.g-card {
  background: var(--card); border:1px solid var(--line); border-radius: var(--radius);
  padding:1.1rem; display:flex; gap:.9rem; align-items:center;
}
.g-card__icon {
  width:46px; height:46px; border-radius:10px; flex-shrink:0;
  background: rgba(31,58,95,.08); color: var(--navy);
  display:flex; align-items:center; justify-content:center; font-size:1.3rem;
}
.g-card__value { font-size:1.6rem; font-weight:700; line-height:1; }
.g-card__label { font-weight:600; font-size:.9rem; margin-top:.15rem; }
.g-card__hint { color: var(--muted); font-size:.78rem; }

.g-panel { background:var(--card); border:1px solid var(--line); border-radius:var(--radius); }
.g-panel__head { padding:1rem 1.25rem; border-bottom:1px solid var(--line); }
.g-panel__title { font-size:1.05rem; font-weight:700; margin:0; }
.g-panel__body { padding:1.25rem; }

/* ---------- RESPONSIVE ---------- */
@media (max-width: 900px) {
  .g-side {
    position:fixed; left:0; top:0; z-index:60;
    transform: translateX(-100%); transition: transform .2s ease;
    box-shadow: 4px 0 24px rgba(0,0,0,.25);
  }
  .g-side.is-open { transform: translateX(0); }
  .g-burger { display:block; }
}
@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; }
}

/* ---------- ETAPA 3: tablas, thumbs, galería ---------- */
.g-table thead th {
  font-size:.75rem; text-transform:uppercase; letter-spacing:.04em;
  color: var(--muted); border-bottom:2px solid var(--line);
}
.g-thumb {
  width:56px; height:42px; object-fit:cover; border-radius:6px;
  border:1px solid var(--line); background:var(--bg);
}
.btn-xs { padding:.15rem .4rem; font-size:.75rem; line-height:1; }

.g-gallery { display:grid; gap:.6rem; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); }
.g-gallery__item {
  position:relative; border-radius:8px; overflow:hidden;
  border:2px solid var(--line); aspect-ratio:4/3; background:var(--bg);
}
.g-gallery__item.is-cover { border-color: var(--gold); }
.g-gallery__item img { width:100%; height:100%; object-fit:cover; display:block; }
.g-gallery__badge {
  position:absolute; top:4px; left:4px; background:var(--gold); color:#1a1a1a;
  font-size:.65rem; font-weight:700; padding:.1rem .35rem; border-radius:4px;
}
.g-gallery__actions {
  position:absolute; bottom:4px; right:4px; display:flex; gap:.25rem;
  opacity:0; transition:opacity .15s;
}
.g-gallery__item:hover .g-gallery__actions { opacity:1; }

/* ---------- ETAPA 4: CRM, timeline, IA ---------- */
/* Botón IA */
.btn-ia {
  background:linear-gradient(135deg,#7C3AED,#C026D3); color:#fff; border:0;
  font-size:.72rem; font-weight:600; padding:.12rem .5rem; border-radius:6px;
  cursor:pointer; margin-left:.4rem; vertical-align:middle;
}
.btn-ia:hover { opacity:.9; }
.btn-ia:disabled { opacity:.6; cursor:wait; }
.btn-ia--sm { padding:.1rem .4rem; }

/* Kanban */
/* ===== Kanban de leads: horizontal en desktop, apilado en mobile ===== */
.kanban { display:flex; align-items:flex-start; gap:.85rem;
  overflow-x:auto; overflow-y:hidden; padding-bottom:1rem;
  -webkit-overflow-scrolling:touch; }
.kanban__col { flex:0 0 280px; width:280px; background:var(--bg);
  border-radius:10px; display:flex; flex-direction:column;
  max-height:calc(100vh - 220px); overflow:hidden; }
.kanban__head { flex:0 0 auto; display:flex; justify-content:space-between;
  align-items:center; padding:.6rem .75rem; background:#fff;
  border-radius:10px 10px 0 0; border:1px solid var(--line); }
.kanban__title { font-weight:600; font-size:.85rem; }
.kanban__count { background:var(--bg); border-radius:12px; padding:0 .5rem;
  font-size:.75rem; font-weight:700; color:var(--muted); }
.kanban__body { flex:1 1 auto; padding:.6rem; overflow-y:auto;
  display:flex; flex-direction:column; gap:.5rem; min-height:50px; }
.kanban__empty { text-align:center; color:var(--muted); font-size:.85rem; padding:.75rem 0; }
/* flecha/chevron del acordeón, oculta en desktop */
.kanban__toggle { display:none; }

/* --- En tablet y celular: columnas apiladas de ancho completo (acordeón) --- */
@media (max-width: 991px) {
  .kanban { flex-direction:column; align-items:stretch;
    overflow-x:visible; overflow-y:visible; gap:.6rem; padding-bottom:.5rem; }
  .kanban__col { flex:1 1 auto; width:100%; max-height:none; overflow:visible; }
  .kanban__head { border-radius:10px; cursor:pointer; user-select:none; }
  .kanban__toggle { display:inline-block; color:var(--muted);
    transition:transform .2s; margin-left:.5rem; }
  .kanban__col.is-collapsed .kanban__toggle { transform:rotate(-90deg); }
  .kanban__col.is-collapsed .kanban__body { display:none; }
  .kanban__body { max-height:none; overflow:visible; }
}

.lcard { display:block; text-decoration:none; color:inherit; background:#fff; border:1px solid var(--line); border-radius:8px; padding:.6rem .7rem; transition:box-shadow .15s; }
.lcard:hover { box-shadow:0 4px 12px rgba(18,35,58,.1); }
.lcard__name { font-weight:600; font-size:.9rem; }
.lcard__prop { color:var(--navy); font-size:.78rem; margin-top:.2rem; }
.lcard__meta { display:flex; flex-direction:column; gap:.1rem; color:var(--muted); font-size:.75rem; margin-top:.35rem; }
.lcard__meta span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.lcard__foot { display:flex; justify-content:space-between; align-items:center; margin-top:.45rem; }
.lcard__date { color:var(--muted); font-size:.72rem; }

/* Detalle lead */
.lead-dl { display:grid; grid-template-columns:auto 1fr; gap:.35rem .85rem; margin:0; }
.lead-dl dt { color:var(--muted); font-size:.82rem; font-weight:500; }
.lead-dl dd { margin:0; font-size:.88rem; }
.lead-msg { margin-top:.9rem; padding:.75rem; background:var(--bg); border-radius:8px; font-size:.9rem; }

/* Timeline */
.timeline { list-style:none; margin:0; padding:0; }
.timeline__item { display:flex; gap:.75rem; padding-bottom:1rem; position:relative; }
.timeline__item:not(:last-child)::before { content:""; position:absolute; left:15px; top:32px; bottom:0; width:2px; background:var(--line); }
.timeline__icon { width:32px; height:32px; border-radius:50%; background:var(--bg); border:1px solid var(--line); display:flex; align-items:center; justify-content:center; flex-shrink:0; color:var(--navy); font-size:.85rem; z-index:1; }
.timeline__text { font-size:.9rem; }
.timeline__meta { color:var(--muted); font-size:.75rem; margin-top:.15rem; }

/* ---------- ETAPA 5: estado de cuenta ---------- */
.ec-row { display:flex; justify-content:space-between; align-items:center; padding:.25rem 0; font-size:.9rem; }
.ec-row span { color:var(--muted); }

/* ---------- ETAPA 6: tickets ---------- */
.tk-msg { border-left:3px solid var(--line); padding:.5rem .75rem; margin-bottom:.75rem; background:#fff; }
.tk-msg--interno { border-left-color:var(--gold); background:#FFFBEB; }
.tk-msg__head { display:flex; align-items:center; gap:.5rem; font-size:.85rem; margin-bottom:.25rem; }
.tk-msg__date { color:var(--muted); font-size:.75rem; margin-left:auto; }
.tk-msg__body { font-size:.9rem; }
.tk-item { border-bottom:1px solid var(--line); padding:.6rem 0; }
.tk-item:last-child { border-bottom:0; }

/* ---------- ETAPA 7: reportes + permisos ---------- */
/* KPIs */
.rep-kpis { display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:.75rem; }
.rep-kpi { background:#fff; border:1px solid var(--line); border-radius:10px; padding:.9rem 1rem; }
.rep-kpi__v { font-size:1.6rem; font-weight:700; color:var(--navy); line-height:1; }
.rep-kpi__t { font-size:.9rem; color:var(--muted); font-weight:400; }
.rep-kpi__l { font-size:.78rem; color:var(--muted); margin-top:.35rem; }
.rep-kpi--alert { border-color:#DC3545; }
.rep-kpi--alert .rep-kpi__v { color:#DC3545; }
.rep-kpi--warn { border-color:var(--gold); }

/* Barras horizontales */
.bar-row { display:flex; align-items:center; gap:.6rem; margin-bottom:.5rem; }
.bar-row__label { flex:0 0 40%; font-size:.82rem; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bar-row__track { flex:1; height:16px; background:var(--bg); border-radius:8px; overflow:hidden; }
.bar-row__fill { height:100%; background:var(--navy); border-radius:8px; transition:width .3s; min-width:2px; }
.bar-row__val { flex:0 0 auto; font-size:.82rem; font-weight:600; min-width:28px; text-align:right; }

/* Columnas */
.cols-chart { display:flex; align-items:flex-end; gap:.5rem; height:170px; padding-top:1rem; }
.cols-chart__col { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; height:100%; }
.cols-chart__bar { width:70%; background:linear-gradient(180deg,var(--navy),#4B6584); border-radius:6px 6px 0 0; min-height:4px; }
.cols-chart__lbl { font-size:.72rem; color:var(--muted); margin-top:.35rem; }

/* Matriz de permisos */
.perm-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:1rem; }
.perm-mod { border:1px solid var(--line); border-radius:8px; padding:.75rem; }
.perm-mod__head { display:flex; justify-content:space-between; align-items:center; margin-bottom:.5rem; padding-bottom:.4rem; border-bottom:1px solid var(--line); }
.perm-all { color:var(--muted); cursor:pointer; }

/* ---------- ETAPA 8: ERP financiero ---------- */
/* Sub-navegación de finanzas */
.fin-nav { display:flex; flex-wrap:wrap; gap:.4rem; border-bottom:1px solid var(--line); padding-bottom:.6rem; }
.fin-nav__item { font-size:.85rem; padding:.35rem .7rem; border-radius:6px; text-decoration:none; color:var(--muted); white-space:nowrap; }
.fin-nav__item:hover { background:var(--bg); color:var(--navy); }
.fin-nav__item.is-active { background:var(--navy); color:#fff; }

/* Flujo de caja (barras dobles) */
.flow-chart { display:flex; align-items:flex-end; gap:.75rem; height:160px; padding-top:1rem; }
.flow-col { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; height:100%; }
.flow-bars { display:flex; align-items:flex-end; gap:3px; height:100%; }
.flow-bar { width:14px; border-radius:4px 4px 0 0; min-height:2px; }
.flow-bar--in { background:#198754; }
.flow-bar--out { background:#DC3545; }
.flow-lbl { font-size:.72rem; color:var(--muted); margin-top:.35rem; }
.flow-key { display:inline-block; width:10px; height:10px; border-radius:2px; vertical-align:middle; margin-right:.2rem; }
.flow-key--in { background:#198754; }
.flow-key--out { background:#DC3545; }

/* ---------- ETAPA 10: mapa, fotos, comodidades ---------- */
/* Selector de mapa */
.mapa-canvas { height:380px; border-radius:8px; border:1px solid var(--line); background:var(--bg); }
.mapa-results { border:1px solid var(--line); border-radius:8px; max-height:190px; overflow-y:auto; margin-bottom:.5rem; background:#fff; }
.mapa-results__item { display:block; width:100%; text-align:left; border:0; background:none; padding:.5rem .7rem;
  font-size:.82rem; border-bottom:1px solid var(--line); cursor:pointer; line-height:1.35; }
.mapa-results__item:last-child { border-bottom:0; }
.mapa-results__item:hover { background:var(--bg); }
.mapa-results__item i { color:var(--gold); margin-right:.25rem; }

/* Preview de fotos antes de subir (miniaturas reordenables) */
.foto-preview__info { display:flex; justify-content:space-between; align-items:center;
  flex-wrap:wrap; gap:.5rem; font-size:.78rem; margin-bottom:.5rem; }
.foto-preview__grid { display:flex; flex-wrap:wrap; gap:.5rem; }

.fp-item { position:relative; width:96px; height:96px; border-radius:8px; overflow:hidden;
  border:2px solid var(--line); background:var(--bg); cursor:grab; flex:0 0 auto;
  transition:border-color .15s, transform .15s, opacity .15s; }
.fp-item:hover { border-color:var(--navy); }
.fp-item:active { cursor:grabbing; }
.fp-item img { width:100% !important; height:100% !important; max-width:100% !important;
  object-fit:cover !important; display:block; pointer-events:none; }
.fp-item.is-portada { border-color:var(--gold); }
.fp-item.is-arrastrando { opacity:.4; transform:scale(.94); }
.fp-item.is-destino { border-color:var(--navy); border-style:dashed; transform:scale(1.04); }

.fp-item__badge { position:absolute; left:4px; bottom:4px; background:rgba(18,35,58,.85);
  color:#fff; font-size:.65rem; font-weight:700; padding:.1rem .35rem; border-radius:4px;
  line-height:1.4; pointer-events:none; }
.fp-item.is-portada .fp-item__badge { background:var(--gold); color:#12233A; }

.fp-item__quitar { position:absolute; top:3px; right:3px; width:20px; height:20px; padding:0;
  border:0; border-radius:50%; background:rgba(18,35,58,.75); color:#fff; font-size:.8rem;
  line-height:1; display:flex; align-items:center; justify-content:center; cursor:pointer;
  opacity:0; transition:opacity .15s; }
.fp-item:hover .fp-item__quitar { opacity:1; }
.fp-item__quitar:hover { background:#DC3545; }

@media (max-width:576px) {
  .fp-item { width:78px; height:78px; }
  .fp-item__quitar { opacity:1; }
}

/* Grupos de comodidades */
.car-group { margin-bottom:.9rem; }
.car-group__head { font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em;
  color:var(--muted); padding-bottom:.25rem; margin-bottom:.35rem; border-bottom:1px solid var(--line); }

/* ---------- ETAPA 11: aviso de reCAPTCHA ---------- */
.recaptcha-aviso { font-size:.74rem; color:var(--muted); text-align:center; margin:.9rem 0 0; line-height:1.5; }
.recaptcha-aviso i { color:#198754; margin-right:.2rem; }
.recaptcha-aviso a { color:inherit; text-decoration:underline; }
.recaptcha-aviso a:hover { color:var(--navy); }
/* Oculta el distintivo flotante de Google (el aviso legal lo reemplaza) */
.grecaptcha-badge { visibility:hidden !important; }

/* ---------- Enlaces de ayuda en Configuración ---------- */
.cfg-help { display:inline-flex; align-items:center; gap:.3rem; font-size:.78rem; font-weight:600;
  color:var(--navy); text-decoration:none; margin-top:.15rem; }
.cfg-help:hover { color:var(--gold); text-decoration:underline; }
.cfg-help i { font-size:.72rem; }
.cfg-help__extra { font-size:.75rem; color:var(--muted); }

/* ---------- Asistente de contenido con IA ---------- */
.ia-panel { border-color:#C9A227; }
.ia-panel .g-panel__head { background:linear-gradient(90deg, rgba(201,162,39,.10), transparent); }
.ia-campos { display:flex; flex-wrap:wrap; gap:.35rem 1.1rem; }

.btn-ia-full { background:linear-gradient(135deg,#1F3A5F,#2E5484); color:#fff; border:0;
  font-weight:600; padding:.55rem 1.4rem; border-radius:8px; }
.btn-ia-full:hover:not(:disabled) { background:linear-gradient(135deg,#12233A,#1F3A5F); color:#fff; }
.btn-ia-full:disabled { opacity:.7; }

.ia-resultado { border-top:1px solid var(--line); padding-top:.9rem; }
.ia-item { border:1px solid var(--line); border-radius:8px; padding:.7rem .85rem; margin-bottom:.6rem; background:var(--bg); }
.ia-item__head { display:flex; justify-content:space-between; align-items:center; gap:.5rem; margin-bottom:.35rem; }
.ia-item__label { font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.03em; color:var(--navy); }
.ia-item__texto { font-size:.86rem; line-height:1.55; color:var(--ink); white-space:normal; }
.ia-item__btn.is-aplicado { background:#198754; border-color:#198754; color:#fff; }

/* Resalta el campo recién completado */
.ia-aplicado { animation:iaFlash 1.6s ease-out; }
@keyframes iaFlash {
  0%   { background:#FFF4CC; border-color:#C9A227; }
  100% { background:#fff; }
}

/* ---------- Galería de fotos guardadas: reordenar arrastrando ---------- */
.g-gallery__item { cursor:grab; transition:border-color .15s, transform .15s, opacity .15s; }
.g-gallery__item:active { cursor:grabbing; }
.g-gallery__item.is-arrastrando { opacity:.4; transform:scale(.94); }
.g-gallery__item.is-destino { border-color:var(--navy); border-style:dashed; transform:scale(1.04); }
.g-gallery.is-guardando { opacity:.6; pointer-events:none; }

/* ---------- Recuadro de credenciales generadas ---------- */
.cred-box { border:2px solid var(--gold); border-radius:10px; overflow:hidden; background:#FFFDF5; }
.cred-box__head { background:var(--gold); color:#12233A; font-weight:700; font-size:.85rem;
  padding:.5rem .8rem; }
.cred-box__body { padding:.8rem; }
.cred-row { display:flex; align-items:center; gap:.6rem; padding:.3rem 0; }
.cred-row__lbl { font-size:.75rem; color:var(--muted); min-width:78px; }
.cred-row code { background:#fff; border:1px solid var(--line); border-radius:5px;
  padding:.25rem .55rem; font-size:.9rem; font-weight:700; color:var(--navy);
  user-select:all; letter-spacing:.02em; }

/* ---------- Comisiones y privacidad en el formulario ---------- */
.vis-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:.15rem .6rem; }

/* ---------- Panel del propietario: tarjetas de propiedad ---------- */
.prop-card { display:flex; gap:1rem; padding:1rem 0; border-bottom:1px solid var(--line); }
.prop-card:last-child { border-bottom:0; }
.prop-card__foto { flex:0 0 110px; height:82px; border-radius:8px; overflow:hidden;
  background:var(--bg); display:flex; align-items:center; justify-content:center; }
.prop-card__foto img { width:100%; height:100%; object-fit:cover; }
.prop-card__sinfoto { color:var(--muted); font-size:1.5rem; }
.prop-card__info { flex:1; min-width:0; }
.prop-card__titulo { font-weight:600; color:var(--ink); }
.prop-card__meta { font-size:.8rem; color:var(--muted); }
.prop-card__badges { display:flex; gap:.35rem; flex-wrap:wrap; margin:.4rem 0; }
.prop-card__seccion { display:block; font-size:.7rem; font-weight:700; text-transform:uppercase;
  letter-spacing:.04em; color:var(--muted); margin-bottom:.25rem; }
.prop-card__comisiones { margin-top:.6rem; padding-top:.5rem; border-top:1px dashed var(--line); }
.comis-grid { display:flex; gap:1.2rem; flex-wrap:wrap; }
.comis-item { display:flex; flex-direction:column; }
.comis-item__lbl { font-size:.72rem; color:var(--muted); }
.comis-item__val { font-size:1rem; font-weight:700; color:var(--navy); }
.prop-card__contrato { margin-top:.6rem; padding-top:.5rem; border-top:1px dashed var(--line); }
.inq-datos { margin-top:.5rem; background:var(--bg); border-radius:8px; padding:.6rem .75rem; }
.inq-datos__lbl { display:block; font-size:.7rem; font-weight:700; text-transform:uppercase;
  letter-spacing:.04em; color:var(--muted); margin-bottom:.3rem; }
.inq-datos__item { font-size:.85rem; padding:.12rem 0; }
.inq-datos__item i { color:var(--gold); width:16px; }
.inq-datos__k { color:var(--muted); }
.inq-datos__v { font-weight:600; }
@media (max-width:576px) {
  .prop-card { flex-direction:column; }
  .prop-card__foto { flex:0 0 auto; width:100%; height:150px; }
}

/* ---------- Interés por mora ---------- */
.mora-val { color:#DC3545; font-weight:700; font-size:.88rem; }
.mora-dias { font-size:.7rem; color:var(--muted); }

/* Simulador de intereses */
.sim-box { background:var(--bg); border:1px solid var(--line); border-radius:8px; padding:.8rem 1rem; }
.sim-fila { display:flex; justify-content:space-between; align-items:baseline;
  padding:.25rem 0; font-size:.88rem; }
.sim-fila--dest { color:#DC3545; border-top:1px dashed var(--line); margin-top:.25rem; padding-top:.5rem; }
.sim-fila--total { border-top:2px solid var(--navy); margin-top:.35rem; padding-top:.5rem;
  font-size:1rem; font-weight:700; color:var(--navy); }
.sim-nota { margin-top:.6rem; padding-top:.5rem; border-top:1px solid var(--line);
  font-size:.76rem; color:var(--muted); }
.sim-nota i { color:var(--gold); }

/* ---------- Acuerdos de comisión por propiedad ---------- */
.est-box { background:linear-gradient(90deg, rgba(201,162,39,.08), transparent);
  border:1px solid var(--gold); border-radius:10px; padding:.8rem 1rem; }
.est-box__lbl { font-size:.72rem; font-weight:700; text-transform:uppercase;
  letter-spacing:.04em; color:var(--muted); margin-bottom:.5rem; }
.est-box__items { display:flex; gap:1.8rem; flex-wrap:wrap; }
.est-item { display:flex; flex-direction:column; }
.est-item__pct { font-size:1.35rem; font-weight:800; color:var(--navy); line-height:1; }
.est-item__lbl { font-size:.82rem; font-weight:600; color:var(--ink); }
.est-item__nota { font-size:.7rem; color:var(--muted); }
.est-box__pie { font-size:.75rem; color:var(--muted); margin:.6rem 0 0; }

.acuerdo { border:1px solid var(--line); border-radius:10px; margin-bottom:.75rem; overflow:hidden; }
.acuerdo__head { display:flex; gap:.8rem; align-items:center; padding:.7rem .85rem; background:#fff; }
.acuerdo__foto { flex:0 0 62px; height:48px; border-radius:6px; overflow:hidden; background:var(--bg);
  display:flex; align-items:center; justify-content:center; color:var(--muted); }
.acuerdo__foto img { width:100%; height:100%; object-fit:cover; }
.acuerdo__datos { flex:1; min-width:0; }
.acuerdo__titulo { font-weight:600; font-size:.92rem; }
.acuerdo__titulo a { color:var(--ink); text-decoration:none; }
.acuerdo__titulo a:hover { color:var(--navy); text-decoration:underline; }
.acuerdo__meta { font-size:.75rem; color:var(--muted); }
.acuerdo__resumen { display:flex; gap:.35rem; flex-wrap:wrap; margin-top:.35rem; }
.res-pill { font-size:.72rem; background:var(--bg); border:1px solid var(--line);
  border-radius:12px; padding:.1rem .5rem; color:var(--muted); }
.res-pill b { color:var(--navy); }
.res-pill.is-propio { border-color:var(--gold); background:#FFFBEF; }
.acuerdo__toggle { flex:0 0 auto; }
.acuerdo__form { padding:.85rem; border-top:1px solid var(--line); background:var(--bg); }

.com-fila { display:flex; align-items:center; gap:.75rem; margin-bottom:.5rem; }
.com-fila__lbl { flex:1; font-size:.85rem; }
.com-fila__nota { display:block; font-size:.7rem; color:var(--muted); }
.com-fila__campo { flex:0 0 130px; }
.vis-lista { background:#fff; border:1px solid var(--line); border-radius:8px; padding:.6rem .75rem; }

/* ---------- Newsletter (gestión) ---------- */
.vars-lista { display:flex; flex-wrap:wrap; gap:.3rem; }
.var-btn { font-family:monospace; font-size:.75rem; padding:.2rem .5rem; border:1px solid var(--line);
  border-radius:5px; background:var(--bg); color:var(--navy); cursor:pointer; }
.var-btn:hover { background:var(--navy); color:#fff; border-color:var(--navy); }
.props-lista { max-height:260px; overflow-y:auto; border:1px solid var(--line); border-radius:8px; padding:.6rem .75rem; }

/* ---------- Pasos de configuración de SES ---------- */
.pasos-ses li { padding-bottom:.35rem; border-bottom:1px dashed var(--line); }
.pasos-ses li:last-child { border-bottom:0; }
.pasos-ses strong { color:var(--navy); }

/* ---------- Aviso destacado para crear la cuenta de SES ---------- */
.ses-aviso { display:flex; align-items:center; gap:1rem; flex-wrap:wrap;
  background:linear-gradient(135deg, #FFF9E6, #FFFDF5);
  border:2px solid var(--gold); border-radius:12px; padding:1rem 1.2rem; }
.ses-aviso__icono { flex:0 0 auto; width:46px; height:46px; border-radius:50%;
  background:var(--gold); color:#12233A; display:flex; align-items:center;
  justify-content:center; font-size:1.4rem; }
.ses-aviso__texto { flex:1 1 320px; min-width:0; }
.ses-aviso__texto strong { display:block; color:var(--navy); font-size:.95rem; margin-bottom:.15rem; }
.ses-aviso__texto span { font-size:.82rem; color:var(--muted); line-height:1.5; }
.ses-aviso__acciones { flex:0 0 auto; display:flex; gap:.5rem; flex-wrap:wrap; }
@media (max-width:640px) {
  .ses-aviso { flex-direction:column; align-items:flex-start; }
  .ses-aviso__acciones { width:100%; }
  .ses-aviso__acciones .btn { flex:1; }
}

/* ---------- Contratos por año ---------- */
.anio-fila { border:1px solid var(--line); border-radius:8px; padding:.6rem .7rem; margin-bottom:.5rem;
  background:var(--bg); }
.anio-fila__cab { display:flex; justify-content:space-between; align-items:baseline;
  margin-bottom:.35rem; gap:.5rem; flex-wrap:wrap; }
.anio-fila__num { font-size:.78rem; font-weight:700; color:var(--navy); }
.anio-fila__rango { font-size:.7rem; color:var(--muted); }

/* ---------- Renovaciones ---------- */
.renov-datos > div { display:flex; justify-content:space-between; gap:1rem;
  padding:.35rem 0; border-bottom:1px dashed var(--line); font-size:.88rem; }
.renov-datos > div:last-child { border-bottom:0; }
.renov-datos span { color:var(--muted); }
.renov-texto { background:var(--bg); border:1px solid var(--line); border-radius:8px;
  padding:.9rem; font-size:.82rem; white-space:pre-wrap; font-family:inherit;
  max-height:420px; overflow-y:auto; margin:0; }

/* Años ya transcurridos en la carga de contratos históricos */
.anio-fila.is-pasado { background:#F0F4F8; border-color:#C9CFDA; }
.anio-fila.is-pasado .anio-fila__rango { color:#198754; font-weight:600; }

/* ---------- Buscador de íconos ---------- */
.ico-vista { min-width:44px; justify-content:center; background:var(--bg); }
.ico-vista i { font-size:1.05rem; color:var(--navy); }

.ico-grupo { margin-bottom:1.1rem; }
.ico-grupo__titulo { font-size:.72rem; font-weight:700; text-transform:uppercase;
  letter-spacing:.04em; color:var(--muted); padding-bottom:.3rem;
  border-bottom:1px solid var(--line); margin-bottom:.6rem; }

.ico-grilla { display:grid; grid-template-columns:repeat(auto-fill, minmax(96px, 1fr)); gap:.45rem; }
.ico-item { display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:.3rem; padding:.7rem .35rem; border:1px solid var(--line); border-radius:8px;
  background:#fff; cursor:pointer; transition:border-color .12s, background .12s, transform .12s; }
.ico-item i { font-size:1.5rem; color:var(--navy); }
.ico-item span { font-size:.68rem; color:var(--muted); text-align:center; line-height:1.25;
  overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.ico-item:hover { border-color:var(--gold); background:#FFFCF4; transform:translateY(-2px); }
.ico-item:hover i { color:var(--gold); }

@media (max-width:576px) {
  .ico-grilla { grid-template-columns:repeat(auto-fill, minmax(78px, 1fr)); }
  .ico-item i { font-size:1.3rem; }
}

/* ---------- Centro de cobranzas ---------- */
.fila-vencida { background:#FFF8F8; }
.rep-kpi--dan .rep-kpi__v { color:#DC3545; }

.deudor { display:block; padding:.6rem .85rem; border-bottom:1px solid var(--line);
  text-decoration:none; color:inherit; transition:background .12s; }
.deudor:last-child { border-bottom:0; }
.deudor:hover { background:var(--bg); }
.deudor__nom { font-size:.85rem; font-weight:600; color:var(--ink); }
.deudor__det { display:flex; justify-content:space-between; align-items:center;
  gap:.5rem; margin-top:.15rem; }
.deudor__monto { font-size:.85rem; font-weight:700; color:#DC3545; }

/* Ventana de cobro */
.cb-resumen { background:var(--bg); border-radius:8px; padding:.75rem .9rem; }
.cb-resumen > div { display:flex; justify-content:space-between; gap:1rem;
  padding:.25rem 0; font-size:.86rem; }
.cb-resumen span { color:var(--muted); }
.cb-resumen__total { border-top:1px solid var(--line); margin-top:.3rem; padding-top:.45rem !important; }
.cb-resumen__total strong { font-size:1.1rem; color:var(--navy); }

.cb-metodos { display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:.4rem; }
.cb-metodo { position:relative; cursor:pointer; }
.cb-metodo input { position:absolute; opacity:0; }
.cb-metodo span { display:flex; align-items:center; gap:.35rem; padding:.5rem .6rem;
  border:1px solid var(--line); border-radius:7px; font-size:.8rem; background:#fff;
  transition:border-color .12s, background .12s; }
.cb-metodo input:checked + span { border-color:var(--navy); background:#EEF3F9;
  font-weight:600; color:var(--navy); }
.cb-metodo span i { font-size:.95rem; }

/* ---------- Días de mora editables y factura legal ---------- */
.cb-dias { align-items:center; }
.cb-dias__campo { display:flex; gap:.3rem; align-items:center; }
.cb-dias__campo input { width:78px; text-align:center; font-weight:700; }
.cb-dias__campo input.is-manual { border-color:var(--gold); background:#FFFCF4; }

.cb-legal { background:#F8F9FB; border:1px solid var(--line); border-radius:8px;
  padding:.7rem .8rem; }
.cb-legal__tit { font-size:.78rem; font-weight:700; color:var(--navy);
  margin-bottom:.5rem; display:flex; align-items:center; gap:.35rem; }
.cb-legal__tit span { font-weight:400; font-size:.7rem; color:var(--muted);
  background:#fff; border:1px solid var(--line); border-radius:10px; padding:0 .4rem; }

/* ---------- Detalle de pagos (paneles de cliente) ---------- */
.liq-item { border:1px solid var(--line); border-radius:10px; padding:.9rem 1rem;
  margin-bottom:.7rem; background:#fff; }
.liq-item.is-pagada { border-left:3px solid #198754; }
.liq-item.is-vencida { border-left:3px solid #DC3545; background:#FFF8F8; }
.liq-item__cab { display:flex; justify-content:space-between; align-items:flex-start;
  gap:1rem; flex-wrap:wrap; }
.liq-item__tit { font-weight:600; font-size:.95rem; color:var(--ink); }
.liq-item__sub { font-size:.78rem; color:var(--muted); margin-top:.1rem; }
.liq-item__monto { font-size:1.1rem; font-weight:700; color:var(--navy); }

.liq-item__desglose { margin-top:.7rem; padding-top:.6rem; border-top:1px dashed var(--line); }
.liq-item__desglose > div { display:flex; justify-content:space-between; gap:1rem;
  padding:.2rem 0; font-size:.84rem; }
.liq-item__desglose span { color:var(--muted); }
.liq-item__desglose .is-resta strong { color:#DC3545; }
.liq-item__desglose .is-total { border-top:1px solid var(--line); margin-top:.3rem;
  padding-top:.4rem; }
.liq-item__desglose .is-total strong { font-size:1rem; color:var(--navy); }

.liq-item__pago { margin-top:.7rem; padding:.65rem .8rem; background:#F2F9F4;
  border-radius:8px; border:1px solid #CFE8D8; }
.liq-item__pago-tit { font-size:.76rem; font-weight:700; color:#198754; margin-bottom:.4rem; }
.liq-item__pago-datos { display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr));
  gap:.3rem .9rem; }
.liq-item__pago-datos > div { display:flex; flex-direction:column; font-size:.8rem; }
.liq-item__pago-datos span { color:var(--muted); font-size:.7rem; }

.liq-item__aviso { margin-top:.6rem; font-size:.78rem; color:var(--muted);
  padding-top:.5rem; border-top:1px dashed var(--line); }
.liq-item__aviso i { color:var(--gold); }

/* ---------- Cuentas donde pagar (panel del cliente) ---------- */
.pago-cuentas { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:.7rem; }
.pago-cuenta { border:1px solid var(--line); border-radius:10px; padding:.8rem .9rem;
  background:var(--bg); }
.pago-cuenta__banco { font-weight:700; color:var(--navy); font-size:.9rem;
  margin-bottom:.5rem; display:flex; align-items:center; gap:.35rem; }
.pago-cuenta__datos > div { display:flex; flex-direction:column; padding:.15rem 0; }
.pago-cuenta__datos span { font-size:.68rem; color:var(--muted); }
.pago-cuenta__datos strong { font-size:.85rem; }

/* ---------- Tarjetas de resumen en los paneles de cliente ---------- */
.res-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:.8rem; }
.res-card { background:#fff; border:1px solid var(--line); border-radius:12px;
  padding:.9rem 1rem; }
.res-card__lbl { font-size:.72rem; color:var(--muted); text-transform:uppercase;
  letter-spacing:.03em; font-weight:600; }
.res-card__val { font-size:1.35rem; font-weight:800; color:var(--navy); line-height:1.2;
  margin-top:.15rem; }
.res-card__nota { font-size:.72rem; color:var(--muted); margin-top:.1rem; }
.res-card--deuda { border-left:4px solid #DC3545; }
.res-card--deuda .res-card__val { color:#DC3545; }
.res-card--ok { border-left:4px solid #198754; }
.res-card--ok .res-card__val { color:#198754; }

/* Facturas de interés en el panel del cliente */
.liq-item.is-interes { border-left:3px solid var(--gold); }

/* Pestañas */
.nav-tabs .nav-link { color:var(--muted); font-size:.9rem; font-weight:600; border:0;
  border-bottom:2px solid transparent; }
.nav-tabs .nav-link:hover { color:var(--navy); border-bottom-color:var(--line); }
.nav-tabs .nav-link.active { color:var(--navy); background:transparent;
  border-bottom-color:var(--navy); }

/* ---------- Unidades de una propiedad ---------- */
.unidades-lista { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:.5rem; }
.unidad-item { display:block; border:1px solid var(--line); border-radius:8px; padding:.6rem .7rem;
  text-decoration:none; color:inherit; background:#fff; transition:border-color .12s, background .12s; }
.unidad-item:hover { border-color:var(--navy); background:var(--bg); }
.unidad-item.is-actual { border-color:var(--gold); background:#FFFCF4; }
.unidad-item__nom { font-weight:700; font-size:.95rem; color:var(--navy);
  display:flex; align-items:center; gap:.35rem; flex-wrap:wrap; }
.unidad-item__nom .badge { font-size:.6rem; font-weight:500; }
.unidad-item__det { display:flex; justify-content:space-between; align-items:center;
  gap:.4rem; margin-top:.25rem; font-size:.78rem; flex-wrap:wrap; }
.unidad-item__inq { font-size:.72rem; color:var(--muted); margin-top:.2rem; }
.unidad-item__pub { font-size:.68rem; color:var(--muted); margin-top:.2rem; }

/* ---------- Personas que viven en la casa ---------- */
.ocupantes-lista { display:grid; gap:.5rem; }
.ocupante-card { border:1px solid var(--line); border-radius:8px; padding:.6rem .75rem;
  background:#fff; }
.ocupante-card.is-contacto { border-left:3px solid var(--gold); background:#FFFCF4; }
.ocupante-card__cab { display:flex; justify-content:space-between; align-items:center;
  gap:.5rem; flex-wrap:wrap; }
.ocupante-card__nom { font-weight:600; font-size:.9rem; color:var(--ink); }
.ocupante-card__cab .badge { font-size:.62rem; font-weight:500; }
.ocupante-card__acc { display:flex; gap:.25rem; align-items:center; }
.ocupante-card__datos { display:flex; gap:.9rem; flex-wrap:wrap; margin-top:.3rem;
  font-size:.76rem; color:var(--muted); }
.ocupante-card__notas { margin-top:.3rem; font-size:.74rem; color:var(--muted);
  font-style:italic; }

.ocupante-form { border:1px dashed var(--line); border-radius:8px; padding:.8rem .9rem;
  background:var(--bg); }
.ocupante-form__tit { font-size:.82rem; font-weight:700; color:var(--navy);
  margin-bottom:.6rem; }

/* ---------- Datos de servicios ---------- */
.serv-bloque { border:1px solid var(--line); border-radius:8px; padding:.7rem .8rem;
  background:var(--bg); }
.serv-bloque__tit { font-size:.78rem; font-weight:700; color:var(--navy);
  margin-bottom:.5rem; }

.serv-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:.6rem; }
.serv-card { display:flex; gap:.65rem; align-items:flex-start; border:1px solid var(--line);
  border-radius:10px; padding:.7rem .8rem; background:#fff; }
.serv-card__ico { flex:0 0 auto; width:34px; height:34px; border-radius:8px;
  background:var(--bg); color:var(--navy); display:flex; align-items:center;
  justify-content:center; font-size:1rem; }
.serv-card__body { min-width:0; flex:1; }
.serv-card__lbl { font-size:.68rem; color:var(--muted); text-transform:uppercase;
  letter-spacing:.03em; font-weight:600; }
.serv-card__val { font-size:1rem; font-weight:700; color:var(--navy);
  word-break:break-all; line-height:1.3; }
.serv-card__extra { font-size:.74rem; color:var(--muted); margin-top:.15rem; }

/* ---------- Garantes del contrato ---------- */
.garantes-lista { display:grid; gap:.6rem; }
.garante-card { border:1px solid var(--line); border-radius:10px; padding:.75rem .9rem;
  background:#fff; border-left:3px solid var(--navy); }
.garante-card__cab { display:flex; justify-content:space-between; align-items:center;
  gap:.5rem; flex-wrap:wrap; margin-bottom:.4rem; }
.garante-card__nom { font-weight:700; font-size:.95rem; color:var(--navy); }
.garante-card__cab .badge { font-size:.65rem; font-weight:500; }
.garante-card__acc { display:flex; gap:.25rem; align-items:center; }
.garante-card__datos { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
  gap:.3rem .9rem; }
.garante-card__datos > div { display:flex; flex-direction:column; }
.garante-card__datos span { font-size:.68rem; color:var(--muted); }
.garante-card__datos strong { font-size:.85rem; }
.garante-card__dir { margin-top:.4rem; font-size:.78rem; color:var(--muted); }
.garante-card__notas { margin-top:.35rem; font-size:.75rem; color:var(--muted);
  font-style:italic; padding-top:.35rem; border-top:1px dashed var(--line); }

.garante-form { border:1px dashed var(--line); border-radius:8px; padding:.85rem .95rem;
  background:var(--bg); }
.garante-form__tit { font-size:.82rem; font-weight:700; color:var(--navy);
  margin-bottom:.6rem; }

/* ================= Conector ClasInmuebles ================= */
.cip-benes { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:.6rem;
  margin-top:.4rem; }
.cip-bene { display:flex; align-items:center; gap:.6rem; background:var(--bg); border:1px solid var(--line);
  border-radius:10px; padding:.6rem .8rem; font-size:.86rem; font-weight:500; }
.cip-bene i { color:var(--gold); font-size:1.1rem; }

.cip-pasos { display:flex; flex-direction:column; gap:.85rem; }
.cip-paso { display:flex; gap:.85rem; align-items:flex-start; }
.cip-paso__n { flex:0 0 auto; width:34px; height:34px; border-radius:50%; background:var(--navy);
  color:#fff; font-weight:700; display:flex; align-items:center; justify-content:center; font-size:.95rem; }
.cip-paso__txt { display:flex; flex-direction:column; gap:.1rem; padding-top:.15rem; }
.cip-paso__txt strong { color:var(--navy); font-size:.95rem; }
.cip-paso__txt span { font-size:.85rem; color:var(--muted); }
.cip-paso__txt code { background:var(--bg); border:1px solid var(--line); border-radius:5px;
  padding:.05rem .35rem; font-size:.82rem; color:var(--navy); }

.cip-lista { list-style:none; padding:0; margin:0; }
.cip-lista li { display:flex; align-items:center; gap:.5rem; padding:.35rem 0; font-size:.88rem;
  border-bottom:1px dashed var(--line); }
.cip-lista li:last-child { border-bottom:0; }
.cip-lista i { color:#16A34A; }

.cip-generar { text-align:center; padding:1rem .5rem; }
.cip-generar__ico { width:64px; height:64px; border-radius:50%; margin:0 auto 1rem;
  background:linear-gradient(135deg, var(--navy), #2C5282); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:1.6rem; }
.cip-generar .form-check { display:inline-block; max-width:440px; }
