:root{
  /* Paleta guinda — inspirada en el guinda IPN (mantengo los nombres de variables
     --can-yellow* por compatibilidad con todo el CSS y JS existente, solo cambian los valores). */
  --can-yellow:#7A0026; --can-yellow-hover:#5E001D; --can-yellow-tint:#FCE6EC; --can-yellow-border:rgba(122,0,38,.45);
  --tb-gold:#D4AF37;
  /* Verde RUV — pestañas de integración con Registro Único de Vivienda. */
  --ruv-green:#00853E; --ruv-green-hover:#006B33; --ruv-green-tint:#E6F4EC;
  --apple-bg:#F5F5F7; --apple-surface:#fff; --apple-surface-2:#FAFAFC;
  --apple-text:#1D1D1F; --apple-text-2:#424245; --apple-text-3:#6E6E73;
  --apple-separator:#D2D2D7; --apple-separator-2:#E8E8ED; --apple-fill:#F2F2F7;
  --apple-blue:#007AFF; --apple-green:#34C759; --apple-red:#FF3B30;
  --shadow-sm:0 1px 2px rgba(0,0,0,.04),0 2px 6px rgba(0,0,0,.04);
  --radius-sm:8px; --radius-md:12px; --radius-pill:980px;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{
  display:flex;flex-direction:column;
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:15px;letter-spacing:-.01em;color:var(--apple-text);background:var(--apple-bg);
  -webkit-font-smoothing:antialiased;
}

/* Reset global de controles: en macOS/Safari el SO inyecta un estilo "native"
   (fondo translúcido, fuente Helvetica, padding extra, color de texto del sistema)
   en <button>, <input[type=submit|reset|button]> y <select>. Sin este reset,
   clases pensadas para <a> que se reutilizan en <button> rompen el look — porque
   el estilo nativo gana en las propiedades que la clase no override explícitamente.
   Este reset deja el control "limpio" para que cada clase defina lo que quiera. */
button,input[type=submit],input[type=reset],input[type=button]{
  appearance:none;-webkit-appearance:none;
  background:transparent;color:inherit;font:inherit;line-height:inherit;
  border:none;padding:0;margin:0;cursor:pointer;
}
button:disabled,input[type=submit]:disabled,
input[type=reset]:disabled,input[type=button]:disabled{cursor:not-allowed}
/* Select hereda fuente — el resto lo manejan los selectores .ctl/.sidebar select */
select{font-family:inherit}

/* Navbar oscura tipo glass (estilo CANA_Emp) */
.navbar{
  flex-shrink:0;height:60px;display:flex;align-items:center;gap:14px;padding:0 22px;
  background:rgba(29,29,31,.78);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid rgba(255,255,255,.06);box-shadow:0 1px 0 rgba(0,0,0,.04);color:#F5F5F7;
}
.navbar .logo{height:40px;width:auto;filter:drop-shadow(0 1px 2px rgba(0,0,0,.4))}
.navbar .sep{width:1px;height:26px;background:rgba(255,255,255,.18)}
.navbar .subtitle{color:#fff;font-weight:600;font-size:.95rem;letter-spacing:.2px}
.navbar .nav-actions{margin-left:auto;display:flex;align-items:center;gap:8px}
.nav-btn{
  /* Esta clase se aplica tanto a <a> como a <button>. Sin un reset explícito,
     el <button> toma el estilo nativo del SO (fondo blanco, fuente sistema) →
     se pierde el look del navbar. Forzamos todo aquí. */
  appearance:none;-webkit-appearance:none;
  background:transparent;color:#fff;text-decoration:none;
  display:inline-flex;align-items:center;gap:6px;
  border:1px solid rgba(255,255,255,.35);border-radius:var(--radius-sm);
  padding:5px 12px;font-size:.82rem;font-weight:600;
  font-family:inherit;line-height:1.4;cursor:pointer;
  transition:background-color .2s ease;
}
.nav-btn:hover{background:rgba(255,255,255,.14)}
.nav-btn:disabled{opacity:.45;cursor:not-allowed}
.nav-btn:focus-visible{outline:2px solid rgba(255,255,255,.7);outline-offset:2px}

/* Sub-barra clara con icono (estilo CANA_Emp) */
.subbar{
  flex-shrink:0;background:var(--apple-surface);color:var(--apple-text-3);font-weight:500;
  font-size:.78rem;letter-spacing:.3px;padding:6px 22px;display:flex;align-items:center;gap:8px;
  border-bottom:1px solid var(--apple-separator);
}
.subbar i{color:var(--can-yellow)}

/* Contenedor app */
.app-container{flex:1;display:flex;min-height:0}
.sidebar{
  width:340px;flex-shrink:0;background:var(--apple-surface);
  border-right:1px solid var(--apple-separator-2);display:flex;flex-direction:column;overflow-y:auto;
}
#map{flex:1;min-height:0}

/* Bloques del sidebar */
.block{padding:14px 16px;border-bottom:1px solid var(--apple-separator-2);display:flex;flex-direction:column;gap:8px}
.block .label{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:var(--apple-text-3);font-weight:700}
.ctl,.sidebar select,.sidebar input[type=file]{
  width:100%;padding:8px 12px;border:1px solid var(--apple-separator);border-radius:var(--radius-sm);
  background:var(--apple-fill);font-size:.88rem;color:var(--apple-text);font-family:inherit;
}
.ctl:focus,.sidebar select:focus{outline:none;border-color:var(--apple-blue);box-shadow:0 0 0 3px rgba(0,122,255,.15)}
.btn-canadevi{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  background:linear-gradient(180deg,#9D0034 0%,var(--can-yellow) 100%);color:#fff;font-weight:600;
  border:1px solid rgba(0,0,0,.06);border-radius:var(--radius-sm);
  box-shadow:0 1px 2px rgba(122,0,38,.25),inset 0 1px 0 rgba(255,255,255,.4);
  padding:9px 12px;cursor:pointer;font-size:.9rem;font-family:inherit;
}
.btn-canadevi:hover{background:linear-gradient(180deg,#7A0026 0%,#5E001D 100%)}
.btn-sec{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  background:var(--apple-fill);color:var(--apple-text);font-weight:600;border:1px solid var(--apple-separator);
  border-radius:var(--radius-sm);padding:8px 12px;cursor:pointer;font-size:.85rem;font-family:inherit;
}
.btn-sec:hover{background:var(--apple-separator-2)}

/* Lista de capas DWG */
#layerList{list-style:none;padding:0;margin:0}
#layerList>li{padding:4px 0;font-size:.92rem;font-weight:600}
.sublayers{list-style:none;padding:0 0 0 24px;margin:2px 0 0}
.sublayers li{padding:3px 0;font-size:.84rem;color:var(--apple-text-2);font-weight:400}
.note{font-size:.74rem;color:#8a6d00;margin:2px 0 0 24px}
.note.error{color:#b00020}

/* Puntos de interés */
.poi{display:flex;align-items:center;gap:9px;padding:6px 4px;border-radius:var(--radius-sm);font-size:.9rem}
.poi:hover{background:var(--apple-fill)}
.poi .dot{width:18px;height:18px;border-radius:50%;flex-shrink:0;border:2px solid #fff;box-shadow:var(--shadow-sm)}
.poi .count{margin-left:auto;font-size:.74rem;color:var(--apple-text-3);font-weight:600}
.poi-actions{display:flex;gap:8px;align-items:center;margin-top:8px}
.poi-actions .ctl{flex:1}

#status{font-size:.8rem;color:var(--apple-text-2);padding:10px 16px;min-height:20px}

/* Caja de búsqueda sobre el mapa */
.map-search{
  display:flex;align-items:stretch;background:var(--apple-surface);
  border:1px solid var(--apple-separator);border-radius:var(--radius-sm);
  box-shadow:var(--shadow-sm);overflow:hidden;margin-top:8px;
}
.map-search input{
  border:none;outline:none;background:transparent;font-family:inherit;font-size:.88rem;
  color:var(--apple-text);padding:8px 12px;width:min(46vw,280px);
}
.map-search button{
  border:none;border-left:1px solid var(--apple-separator);cursor:pointer;
  background:var(--can-yellow);color:#fff;padding:0 14px;font-size:1rem;
  display:flex;align-items:center;
}
.map-search button:hover{background:var(--can-yellow-hover)}

/* Popups Leaflet */
.leaflet-popup-content{font-family:inherit;font-size:.85rem}

/* Footer CANADEVI */
.footer-canadevi{
  flex-shrink:0;display:flex;align-items:center;gap:14px;
  background:var(--apple-surface);border-top:1px solid var(--apple-separator);
  color:var(--apple-text-3);font-size:.78rem;padding:8px 22px;
}
.footer-canadevi .logo{height:22px;width:auto}
.footer-canadevi .muted{margin-left:auto;color:var(--apple-text-3)}

/* Tabbar — navegación por secciones */
.tabbar{
  flex-shrink:0;display:flex;gap:2px;background:var(--apple-surface);
  border-bottom:1px solid var(--apple-separator);padding:0 16px;overflow-x:auto;
}
.tabbar .tab{
  display:inline-flex;align-items:center;gap:7px;background:transparent;border:none;
  padding:12px 16px;font-family:inherit;font-size:.88rem;font-weight:600;
  color:var(--apple-text-3);cursor:pointer;border-bottom:2px solid transparent;
  white-space:nowrap;transition:color .15s ease,border-color .15s ease;
}
.tabbar .tab i{font-size:1rem}
.tabbar .tab:hover{color:var(--apple-text)}
.tabbar .tab.active{color:var(--apple-text);border-bottom-color:var(--can-yellow)}

/* Paneles */
.tab-panel{flex:1;display:none;min-height:0;flex-direction:column}
.tab-panel.active{display:flex}

/* Placeholder para secciones aún por construir */
.section-placeholder{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;gap:10px;padding:48px 24px;color:var(--apple-text-2);
}
.section-placeholder i{font-size:3rem;color:var(--can-yellow)}
.section-placeholder h2{margin:0;font-size:1.4rem;color:var(--apple-text);font-weight:600}
.section-placeholder p{margin:0;max-width:520px;color:var(--apple-text-3)}

/* Formularios dentro de pestañas (Datos del predio, etc.) */
.form-scroll{flex:1;overflow-y:auto;background:var(--apple-bg)}
.form-wrap{max-width:1080px;margin:0 auto;padding:28px 24px 48px}
.form-card{
  background:var(--apple-surface);border:1px solid var(--apple-separator-2);
  border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:24px 26px;
}
.form-card-head{display:flex;align-items:flex-start;gap:14px;margin-bottom:18px}
.form-card-head i{font-size:1.6rem;color:var(--can-yellow);margin-top:2px}
.form-card-head h3{margin:0;font-size:1.15rem;font-weight:600;color:var(--apple-text)}
.form-card-head p{margin:2px 0 0;color:var(--apple-text-3);font-size:.85rem}

.form-subhead{
  display:flex;align-items:center;gap:8px;margin:22px 0 10px;font-size:.95rem;
  font-weight:600;color:var(--apple-text);padding-top:14px;border-top:1px solid var(--apple-separator-2);
}
.form-subhead i{color:var(--can-yellow)}
.form-hint{margin:0 0 12px;font-size:.82rem;color:var(--apple-text-3)}

.form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 14px}
.form-grid .field.col-2{grid-column:span 2}
.field{display:flex;flex-direction:column;gap:5px}
.field label{font-size:.78rem;font-weight:600;color:var(--apple-text-2);letter-spacing:.01em}
.field .ctl.up{text-transform:uppercase}
.field .ctl[type=file]{padding:6px 8px;font-size:.82rem}

.ine-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 14px;margin-bottom:12px}
.ine-actions{display:flex;align-items:center;gap:12px;margin-top:4px}
.ine-spinner{display:inline-flex;align-items:center;gap:6px;color:var(--apple-text-3);font-size:.85rem}
.ine-spinner i{animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

.ine-result{
  margin-top:16px;border:1px solid var(--apple-separator-2);border-radius:var(--radius-sm);
  background:var(--apple-surface-2);padding:14px 16px;
}
.ine-result-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.badge-ok{
  display:inline-flex;align-items:center;gap:5px;background:rgba(52,199,89,.12);
  color:#1f8a3a;border:1px solid rgba(52,199,89,.3);border-radius:var(--radius-pill);
  padding:3px 10px;font-size:.75rem;font-weight:600;
}
.ine-table{width:100%;border-collapse:collapse;font-size:.85rem;margin-bottom:10px}
.ine-table th{text-align:left;padding:6px 8px;color:var(--apple-text-3);font-weight:600;width:200px}
.ine-table td{padding:6px 8px;color:var(--apple-text);font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.ine-table tr+tr th,.ine-table tr+tr td{border-top:1px solid var(--apple-separator-2)}

.ine-error{
  margin-top:12px;display:flex;align-items:center;gap:8px;
  background:rgba(255,59,48,.08);border:1px solid rgba(255,59,48,.25);
  color:#a3271f;border-radius:var(--radius-sm);padding:9px 12px;font-size:.85rem;
}

.form-actions{
  display:flex;justify-content:flex-end;gap:10px;margin-top:24px;padding-top:16px;
  border-top:1px solid var(--apple-separator-2);
}

@media (max-width: 880px){
  .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .form-grid .field.col-2{grid-column:span 2}
  .ine-grid{grid-template-columns:1fr}
  .ine-table th{width:140px}
}
@media (max-width: 560px){
  .form-grid{grid-template-columns:1fr}
  .form-grid .field.col-2{grid-column:span 1}
}

/* Documentos — grid de tarjetas de subida */
.docs-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;margin-top:6px;
}
.doc-card{
  display:flex;flex-direction:column;gap:10px;padding:14px;
  background:var(--apple-surface-2);border:1px solid var(--apple-separator-2);
  border-radius:var(--radius-md);
}
.doc-head{display:flex;align-items:flex-start;gap:10px}
.doc-head>i{font-size:1.4rem;color:var(--can-yellow);margin-top:2px}
.doc-meta{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}
.doc-name{font-weight:600;color:var(--apple-text);font-size:.92rem;line-height:1.25}
.doc-exts{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.ext-chip{
  display:inline-block;background:rgba(122,0,38,.18);color:#8a5a00;
  border:1px solid var(--can-yellow-border);border-radius:var(--radius-pill);
  font-size:.66rem;font-weight:700;letter-spacing:.04em;padding:2px 8px;
}
.doc-max{font-size:.7rem;color:var(--apple-text-3);margin-left:auto}

.doc-drop{
  display:flex;align-items:center;justify-content:center;gap:8px;
  border:1.5px dashed var(--apple-separator);background:var(--apple-surface);
  border-radius:var(--radius-sm);padding:14px 12px;cursor:pointer;
  color:var(--apple-text-2);font-size:.85rem;font-weight:500;text-align:center;
  transition:border-color .15s ease,background-color .15s ease;
}
.doc-drop:hover{border-color:var(--can-yellow);background:var(--can-yellow-tint)}
.doc-drop i{font-size:1.1rem;color:var(--apple-text-3)}
.doc-drop-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}

.doc-status{
  display:flex;align-items:center;gap:6px;font-size:.78rem;font-weight:600;
  padding:6px 10px;border-radius:var(--radius-sm);
}
.doc-status.ok{background:rgba(52,199,89,.12);color:#1f8a3a;border:1px solid rgba(52,199,89,.3)}
.doc-status.err{background:rgba(255,59,48,.1);color:#a3271f;border:1px solid rgba(255,59,48,.25)}

/* Documentos — existente + acciones por tarjeta */
.doc-existing{
  display:flex;align-items:center;gap:10px;padding:8px 10px;
  background:rgba(0,122,255,.08);border:1px solid rgba(0,122,255,.25);
  border-radius:var(--radius-sm);
}
.doc-link{
  flex:1;display:inline-flex;align-items:center;gap:6px;color:var(--apple-blue);
  text-decoration:none;font-weight:600;font-size:.82rem;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.doc-link:hover{text-decoration:underline}
.doc-link i{flex-shrink:0}
.doc-link-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.btn-link-danger{
  background:transparent;border:none;color:var(--apple-red);font-weight:600;
  font-size:.78rem;cursor:pointer;display:inline-flex;align-items:center;gap:4px;
  padding:4px 6px;border-radius:var(--radius-sm);font-family:inherit;
}
.btn-link-danger:hover{background:rgba(255,59,48,.1)}

.doc-actions{display:flex;justify-content:flex-end}
.doc-actions .btn-canadevi{padding:7px 14px;font-size:.82rem}
.doc-actions .btn-canadevi:disabled{opacity:.5;cursor:not-allowed}

.doc-status.info{
  background:rgba(0,122,255,.08);color:#0050b3;border:1px solid rgba(0,122,255,.25);
}
.doc-status i.spin{animation:spin 1s linear infinite}

/* Login */
.login-shell{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--apple-bg)}
.login-card{background:var(--apple-surface);border:1px solid var(--apple-separator-2);border-radius:var(--radius-md);padding:32px 36px;width:100%;max-width:380px;box-shadow:var(--shadow-sm)}
.login-card h1{margin:0;font-size:1.4rem;color:var(--apple-text)}
.login-sub{margin:4px 0 18px;color:var(--apple-text-3);font-size:.88rem}
.login-card form{display:flex;flex-direction:column;gap:12px}
.login-card .btn-canadevi{margin-top:6px}
.login-error{background:rgba(255,59,48,.1);border:1px solid rgba(255,59,48,.25);color:#a3271f;border-radius:var(--radius-sm);padding:9px 12px;font-size:.85rem}

/* Páginas con tarjetas tipo dashboard */
.user-chip{color:#fff;font-size:.78rem;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:var(--radius-pill);padding:3px 10px;display:inline-flex;align-items:center;gap:5px}
.page-shell{padding:24px 28px;background:var(--apple-bg);min-height:calc(100vh - 60px)}
.page-card{max-width:1180px;margin:0 auto;background:var(--apple-surface);border:1px solid var(--apple-separator-2);border-radius:var(--radius-md);padding:22px 24px;box-shadow:var(--shadow-sm)}
.page-card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.page-card-head h2{margin:0;font-size:1.15rem;color:var(--apple-text)}
.toolbar{display:flex;gap:10px;margin-bottom:12px}
.toolbar .ctl{flex:1}
.data-table{width:100%;border-collapse:collapse;font-size:.9rem}
.data-table th{text-align:left;padding:10px 8px;color:var(--apple-text-3);font-weight:600;border-bottom:1px solid var(--apple-separator-2)}
.data-table td{padding:10px 8px;border-bottom:1px solid var(--apple-separator-2)}
.muted{color:var(--apple-text-3)}
.err{color:#a3271f}
.chip{display:inline-block;padding:2px 9px;border-radius:var(--radius-pill);font-size:.72rem;font-weight:600}
.chip-grey{background:#eee;color:#555}
.chip-blue{background:rgba(0,122,255,.12);color:#0050b3;border:1px solid rgba(0,122,255,.25)}
.chip-green{background:rgba(52,199,89,.12);color:#1f8a3a;border:1px solid rgba(52,199,89,.3)}
.chip-amber{background:rgba(122,0,38,.18);color:#8a5a00;border:1px solid var(--can-yellow-border)}

/* Banner Devuelto + chip Solo lectura */
.banner{display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:var(--radius-sm);margin:14px 24px}
.banner-warn{background:rgba(122,0,38,.15);border:1px solid var(--can-yellow-border);color:#8a5a00}
.banner-warn small{margin-left:auto;font-style:italic}
/* Chip "Solo lectura": pensado para mostrarse sobre el navbar oscuro,
   por eso usa azul claro brillante + borde más visible (estilo macOS dark mode). */
.readonly-chip{display:inline-flex;align-items:center;gap:5px;background:rgba(10,132,255,.22);color:#9ecbff;border:1px solid rgba(158,203,255,.55);border-radius:var(--radius-pill);padding:3px 10px;font-size:.72rem;font-weight:600;margin-left:10px}
.readonly-chip i{color:inherit}

/* Review cards (validador) */
.review-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:14px}
.review-card{background:var(--apple-surface-2);border:1px solid var(--apple-separator-2);border-radius:var(--radius-md);padding:14px;display:flex;flex-direction:column;gap:10px}
.review-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.review-title{font-weight:600;color:var(--apple-text);font-size:.92rem}
.review-preview{font-size:.82rem;color:var(--apple-text-2);background:var(--apple-surface);border:1px solid var(--apple-separator-2);border-radius:var(--radius-sm);padding:8px 10px}
.review-preview a{color:var(--apple-blue);text-decoration:none}
.review-actions{display:flex;gap:8px}
.review-approve{color:#1f8a3a}
.review-reject{color:#a3271f}
.review-comment{font-family:inherit;min-height:60px;padding:8px 10px;border:1px solid var(--apple-separator);border-radius:var(--radius-sm)}

/* Página de inicio: selector Registrar / Validar */
.inicio-shell{
  min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:40px 24px;background:var(--apple-bg);
}
.inicio-head{text-align:center;margin-bottom:36px}
.inicio-head h1{margin:0;font-size:2.2rem;color:var(--apple-text);font-weight:700;letter-spacing:-.02em}
.inicio-sub{margin:6px 0 0;color:var(--apple-text-3);font-size:.95rem;letter-spacing:.3px}

.inicio-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;
  max-width:880px;width:100%;
}
.inicio-card{
  display:flex;flex-direction:column;gap:10px;padding:32px 28px;text-decoration:none;
  background:var(--apple-surface);border:1px solid var(--apple-separator-2);
  border-radius:var(--radius-md);box-shadow:var(--shadow-sm);color:var(--apple-text);
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.inicio-card:hover{
  transform:translateY(-3px);
  box-shadow:0 6px 18px rgba(0,0,0,.08);
  border-color:var(--can-yellow);
}
.inicio-icon{font-size:2.6rem;color:var(--can-yellow);line-height:1}
.inicio-card h2{margin:8px 0 0;font-size:1.3rem;color:var(--apple-text);font-weight:600}
.inicio-card p{margin:0;color:var(--apple-text-2);font-size:.92rem;line-height:1.5;flex:1}
.inicio-cta{
  margin-top:8px;display:inline-flex;align-items:center;gap:6px;
  color:var(--apple-text);font-weight:600;font-size:.9rem;
}
.inicio-card--validar .inicio-icon{color:var(--apple-blue)}
.inicio-card--validar:hover{border-color:var(--apple-blue)}

.inicio-foot{margin-top:32px;text-align:center}
.inicio-foot-link{
  color:var(--apple-text-3);text-decoration:none;font-size:.85rem;
  display:inline-flex;align-items:center;gap:5px;padding:6px 12px;border-radius:var(--radius-pill);
}
.inicio-foot-link:hover{background:var(--apple-fill);color:var(--apple-text-2)}

/* Planos del expediente — sidebar lista */
.exp-list{list-style:none;padding:0;margin:0 0 6px;display:flex;flex-direction:column;gap:4px}
.exp-list .muted{font-size:.78rem;padding:4px 2px}
.exp-row label{display:flex;align-items:flex-start;gap:8px;cursor:pointer;padding:6px 4px;font-size:.82rem;color:var(--apple-text);border-radius:var(--radius-sm)}
.exp-row label:hover{background:var(--apple-fill)}
.exp-row input[type=checkbox]{margin:2px 0 0}
.exp-meta{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.exp-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}
.exp-sec{font-size:.7rem;color:var(--apple-text-3);display:inline-flex;align-items:center;gap:4px}
.exp-sec i{font-size:.78rem;color:var(--can-yellow)}
.exp-ext{font-size:.66rem;font-weight:700;padding:1px 6px;background:rgba(122,0,38,.18);color:#8a5a00;border:1px solid var(--can-yellow-border);border-radius:var(--radius-pill);letter-spacing:.04em}

/* Overlay de herramienta externa embebida (Visor ZCU INFONAVIT) */
.ext-frame{
  position:fixed;inset:0;z-index:9999;display:flex;flex-direction:column;
  background:var(--apple-surface);
}
.ext-frame-bar{
  flex-shrink:0;display:flex;align-items:center;gap:12px;
  padding:10px 16px;background:rgba(29,29,31,.95);color:#F5F5F7;
  border-bottom:1px solid var(--apple-separator);
  backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);
}
.ext-frame-bar .btn-sec{padding:6px 12px;font-size:.82rem}
.ext-frame-title{
  flex:1;text-align:center;font-weight:600;font-size:.92rem;color:#fff;
  display:inline-flex;align-items:center;gap:8px;justify-content:center;
}
.ext-frame-title i{color:var(--can-yellow)}
.ext-frame iframe{flex:1;border:0;width:100%;background:#fff}

.ext-frame-fallback{
  padding:14px 18px;background:rgba(122,0,38,.18);color:#8a5a00;
  border-bottom:1px solid var(--can-yellow-border);font-size:.88rem;
}
.ext-frame-fallback p{margin:2px 0}
.ext-frame-fallback i{color:#b45309}

/* Banner flotante cuando el Visor ZCU está abierto en ventana popup */
.ext-window-banner{
  position:fixed;left:50%;bottom:20px;transform:translateX(-50%);
  z-index:9998;display:flex;align-items:center;gap:12px;
  background:rgba(29,29,31,.95);color:#fff;padding:10px 16px;
  border-radius:var(--radius-pill);box-shadow:0 6px 20px rgba(0,0,0,.18);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  font-size:.85rem;
}
.ext-window-banner i{color:var(--can-yellow);font-size:1.05rem}
.ext-window-banner .btn-sec{padding:5px 10px;font-size:.78rem}

/* Pin de referencia para mediciones */
.pin-ref{
  width:28px;height:32px;display:flex;align-items:flex-start;justify-content:center;
  color:#7A0026;text-shadow:0 1px 3px rgba(0,0,0,.45);font-size:30px;line-height:1;
}
.pin-ref-icon{background:transparent;border:none}

/* Pin: hint con botón copiar coordenadas */
#pinHint{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.pin-coords{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--apple-text-2);font-weight:600}
.copy-pin{
  background:var(--apple-fill);border:1px solid var(--apple-separator);color:var(--apple-text-2);
  padding:2px 6px;border-radius:var(--radius-sm);cursor:pointer;font-size:.78rem;line-height:1;
  display:inline-flex;align-items:center;font-family:inherit;
}
.copy-pin:hover{background:var(--apple-separator-2);color:var(--apple-text)}
.copy-pin.ok{background:rgba(52,199,89,.18);color:#1f8a3a;border-color:rgba(52,199,89,.35)}

/* Admin plantilla */
.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;max-width:1280px;margin:0 auto}
.tpl-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:6px}
.tpl-row{
  display:flex;align-items:center;gap:8px;padding:8px 10px;
  background:var(--apple-surface-2);border:1px solid var(--apple-separator-2);
  border-radius:var(--radius-sm);
}
.tpl-row.sel{outline:2px solid var(--can-yellow);outline-offset:-2px}
.tpl-row .drag{cursor:grab;color:var(--apple-text-3)}
.tpl-row .tpl-name{flex:1;font-weight:600;color:var(--apple-text);cursor:pointer}
.tpl-row .tpl-meta{display:flex;gap:4px;align-items:center}
.icon-btn{background:transparent;border:none;color:var(--apple-text-3);cursor:pointer;padding:4px 6px;border-radius:var(--radius-sm)}
.icon-btn:hover{background:var(--apple-fill);color:var(--apple-text)}
.icon-btn.danger:hover{background:rgba(255,59,48,.1);color:#a3271f}

/* Admin perfiles */
.states-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 16px;margin-top:6px}

.modal-wrap{
  position:fixed;inset:0;background:rgba(0,0,0,.4);
  display:flex;align-items:flex-start;justify-content:center;
  z-index:9999;
  /* scroll del backdrop cuando el contenido excede el viewport — clave dentro
     de iframes con altura limitada (PlanoSimulador embed) */
  overflow-y:auto;
  padding:20px 12px;
  -webkit-overflow-scrolling:touch;
}
.modal-card{
  background:var(--apple-surface);border-radius:var(--radius-md);
  padding:24px;max-width:480px;width:90%;box-shadow:var(--shadow-sm);
  /* margin auto vertical: centra cuando cabe, deja respiro arriba/abajo
     cuando el backdrop ya scrollea */
  margin:auto 0;
}
.modal-card h3{margin:0 0 12px}
/* Header del modal — sticky para que el botón cerrar siempre sea visible
   aunque el contenido sea más alto que la pantalla del iframe */
.modal-card .meta-modal-head{
  position:sticky;top:0;
  background:var(--apple-surface);
  margin:-24px -24px 12px;
  padding:18px 24px 12px;
  border-bottom:1px solid var(--apple-separator-2);
  z-index:1;
}
.profile-pills{display:flex;gap:4px;flex-wrap:wrap;max-width:240px}

/* Modal Verificar meta */
.meta-modal{max-width:560px}
.meta-modal-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.meta-modal-head i{color:var(--can-yellow);font-size:1.3rem}
.meta-modal-head h3{margin:0;flex:1;font-size:1.1rem;color:var(--apple-text)}
.meta-state-row{display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--apple-fill);border-radius:var(--radius-sm);margin-bottom:12px}
.meta-state-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:var(--apple-text-3);font-weight:700}
.meta-state-name{font-weight:600;font-size:1rem;color:var(--apple-text)}
.meta-kpis{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:8px}
.meta-kpi{background:var(--apple-surface-2);border:1px solid var(--apple-separator-2);border-radius:var(--radius-sm);padding:12px 14px;text-align:center}
.meta-kpi-num{font-size:1.4rem;font-weight:700;color:var(--apple-text);font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.meta-kpi-label{font-size:.72rem;color:var(--apple-text-3);margin-top:4px}
.meta-pct{margin:10px 0 0;font-size:.85rem;color:var(--apple-text-2);text-align:center}
.meta-detail{margin-top:14px}
.meta-detail summary{cursor:pointer;font-size:.85rem;font-weight:600;color:var(--apple-text-2);padding:6px 0}
.meta-detail .data-table{margin-top:6px;font-size:.8rem}

/* Modal de alta/edición de campo (admin/plantilla) */
.field-modal h3{margin:0 0 14px;font-size:1.05rem}
.fm-stack{display:flex;flex-direction:column;gap:10px}
.fm-row{display:flex;flex-direction:column;gap:4px;font-size:.85rem}
.fm-row > span{font-weight:600;color:var(--apple-text-2);font-size:.78rem;text-transform:uppercase;letter-spacing:.03em}
.fm-row input[type=text],.fm-row input[type=number],.fm-row select{
  padding:6px 8px;border:1px solid var(--apple-separator-2);border-radius:var(--radius-sm);
  background:var(--apple-surface);font-size:.9rem;width:100%;
}
.fm-row.check{flex-direction:row;align-items:center;gap:8px}
.fm-row.check > span{text-transform:none;letter-spacing:0;font-weight:500;font-size:.9rem;color:var(--apple-text)}
.field-modal fieldset.type-group,.field-modal fieldset.val-group{
  border:1px solid var(--apple-separator-2);border-radius:var(--radius-sm);
  padding:10px 12px;margin:4px 0 0;display:flex;flex-direction:column;gap:10px;
}
.field-modal fieldset.type-group legend,.field-modal fieldset.val-group legend{
  padding:0 6px;font-size:.75rem;font-weight:700;color:var(--apple-text-3);
  text-transform:uppercase;letter-spacing:.04em;
}

/* Card informativa (no se valida) — ubicación geográfica */
.review-card.review-info{background:var(--apple-fill);border-style:dashed}
.review-card.review-info .review-title::before{content:"\F431";font-family:bootstrap-icons;margin-right:6px;color:var(--apple-text-3)}

/* Etiqueta de perfiles validadores bajo cada card */
.review-profiles{
  display:inline-flex;align-items:center;gap:5px;
  font-size:.72rem;color:var(--apple-text-3);
  margin-top:2px;letter-spacing:.01em;
}
.review-profiles i{color:var(--apple-text-3)}

/* Estatus por perfil dentro de cada review-card */
.review-profile-statuses{
  display:flex;flex-wrap:wrap;gap:6px 10px;
  margin-top:6px;padding-top:6px;
  border-top:1px dashed var(--apple-separator-2);
}
.rps-pill{display:inline-flex;align-items:center;gap:5px;font-size:.74rem;color:var(--apple-text-2)}
.rps-pill .rps-label{color:var(--apple-text-3)}
.rps-pill.rps-mine .rps-label{color:var(--apple-text);font-weight:600}
.rps-pill .chip{padding:1px 7px;font-size:.7rem;border-radius:9999px}

/* ─── Chatbot widget ───────────────────────────────────────────────── */
.chatbot-btn{
  position:fixed;right:24px;bottom:24px;width:54px;height:54px;border-radius:50%;
  background:var(--can-yellow);color:#fff;border:none;cursor:pointer;
  box-shadow:0 8px 24px rgba(0,0,0,.18);font-size:1.4rem;z-index:10000;
  display:flex;align-items:center;justify-content:center;transition:transform .15s ease;
}
.chatbot-btn:hover{transform:scale(1.06)}
.chatbot-panel{
  position:fixed;right:24px;bottom:90px;width:380px;max-width:calc(100vw - 32px);
  height:560px;max-height:calc(100vh - 120px);background:var(--apple-surface);
  border:1px solid var(--apple-separator-2);border-radius:16px;
  box-shadow:0 16px 48px rgba(0,0,0,.22);
  display:none;flex-direction:column;overflow:hidden;z-index:10000;
}
.chatbot-panel.open{display:flex}
.chatbot-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 16px;background:var(--apple-fill);
  border-bottom:1px solid var(--apple-separator-2);
}
.chatbot-title{font-weight:600;font-size:.95rem;color:var(--apple-text);display:flex;align-items:center;gap:8px}
.chatbot-title i{color:var(--can-yellow);font-size:1.1rem}
.chatbot-log{flex:1;overflow-y:auto;padding:14px 14px 6px;display:flex;flex-direction:column;gap:8px;background:var(--apple-fill)}
.chat-bubble{
  max-width:85%;padding:10px 12px;border-radius:14px;font-size:.88rem;line-height:1.4;
  word-wrap:break-word;animation:bubblein .18s ease-out;
}
@keyframes bubblein{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.chat-user{background:var(--can-yellow);color:#fff;align-self:flex-end;border-bottom-right-radius:4px}
.chat-bot{background:var(--apple-surface);color:var(--apple-text);align-self:flex-start;border:1px solid var(--apple-separator-2);border-bottom-left-radius:4px}
.chat-thinking{color:var(--apple-text-3);font-size:1.2rem;padding:6px 14px}
.chat-cat{margin-bottom:6px}
.chat-cat .chip{font-size:.65rem;padding:1px 7px}
.chat-link{display:inline-flex;align-items:center;gap:4px;margin-top:6px;font-size:.78rem;color:var(--can-yellow-strong, #c98a14)}
.chat-related{margin:-2px 0 4px;align-self:flex-start;max-width:100%;display:flex;flex-direction:column;gap:4px}
.chat-related small{display:block;margin-bottom:2px}
.chat-related-pill,.chat-sug-pill{
  cursor:pointer;border:none;font-size:.74rem;padding:4px 10px;border-radius:9999px;
  background:var(--apple-fill);color:var(--apple-text-2);transition:background .12s ease;
}
.chat-related-pill:hover,.chat-sug-pill:hover{background:var(--apple-separator-2)}
.chatbot-suggestions{
  display:flex;flex-wrap:wrap;gap:5px;padding:8px 14px;
  border-top:1px solid var(--apple-separator-2);background:var(--apple-fill);
  max-height:96px;overflow-y:auto;
}
.chatbot-form{
  display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--apple-separator-2);
  background:var(--apple-surface);
}
.chatbot-form .ctl{flex:1;padding:8px 10px;font-size:.9rem}
.chatbot-form button{padding:8px 14px}
@media (max-width:520px){
  .chatbot-panel{right:8px;left:8px;bottom:80px;width:auto}
}

/* Pestaña Acta constitutiva — embebe el módulo externo en iframe */
.acta-embed{height:calc(100vh - 140px);display:flex;flex-direction:column;background:var(--apple-fill)}
.acta-embed-bar{
  display:flex;align-items:center;justify-content:space-between;
  padding:8px 14px;background:var(--apple-surface);
  border-bottom:1px solid var(--apple-separator-2);font-weight:600;font-size:.9rem;
}
.acta-embed-bar i{color:var(--can-yellow);margin-right:6px}
.acta-iframe{flex:1;width:100%;border:0;background:var(--apple-surface)}

/* ─── QR de consulta en /predios ──────────────────────────────────────────── */
.qr-col{width:84px;text-align:center}
.qr-thumb{cursor:zoom-in;border:1px solid var(--apple-separator-2);border-radius:6px;
  display:inline-block;background:#fff;padding:2px;transition:transform .12s ease}
.qr-thumb:hover{transform:scale(1.05)}
.qr-modal-card{max-width:380px;text-align:center}
.qr-modal-card canvas{display:block;margin:8px auto 12px;border:1px solid var(--apple-separator-2);background:#fff;border-radius:8px;padding:6px}
.qr-modal-card .small{font-size:.78rem}

/* ─── Control de capas Leaflet (Calles / Satélite / Híbrida) ───────────── */
.leaflet-control-layers{
  border:1px solid var(--apple-separator-2)!important;
  border-radius:var(--radius-sm)!important;
  box-shadow:0 4px 14px rgba(0,0,0,.10)!important;
  background:var(--apple-surface)!important;
  overflow:hidden;
}
.leaflet-control-layers-toggle{
  background-color:var(--apple-surface);
  /* Cambio el ícono nativo "stacked layers" por algo más legible */
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237A0026' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polygon points='12 2 22 8.5 12 15 2 8.5 12 2'/><polyline points='2 15.5 12 22 22 15.5'/><polyline points='2 12 12 18.5 22 12'/></svg>");
  background-size:24px 24px;
  background-position:center;
  background-repeat:no-repeat;
}
.leaflet-control-layers-expanded{padding:10px 12px;font-size:.85rem;color:var(--apple-text)}
.leaflet-control-layers-expanded label{display:flex;align-items:center;gap:6px;padding:3px 0;cursor:pointer}
.leaflet-control-layers-expanded label:hover{color:var(--can-yellow)}
.leaflet-control-layers-base input[type=radio]{accent-color:var(--can-yellow)}

/* ─── Leyenda flotante para overlay de uso de suelo ──────────────────── */
.uso-suelo-legend{
  background:var(--apple-surface);
  border:1px solid var(--apple-separator-2);
  border-radius:var(--radius-sm);
  box-shadow:0 6px 20px rgba(0,0,0,.14);
  font-size:.78rem;color:var(--apple-text);
  max-width:280px;max-height:62vh;display:flex;flex-direction:column;
  overflow:hidden;
}
.uso-suelo-legend header{
  display:flex;align-items:center;gap:8px;padding:8px 10px;
  background:linear-gradient(180deg,#9D0034 0%,var(--can-yellow) 100%);
  color:#fff;
}
.uso-suelo-legend header strong{font-size:.85rem}
.uso-suelo-legend header small{margin-left:0;color:rgba(255,255,255,.78);font-size:.7rem;flex:1}
.uso-suelo-legend .leg-toggle{
  background:rgba(255,255,255,.18);color:#fff;border:none;border-radius:4px;
  width:22px;height:22px;cursor:pointer;font-weight:700;line-height:1;
}
.uso-suelo-legend .leg-toggle:hover{background:rgba(255,255,255,.28)}
.uso-suelo-legend ul.leg-items{
  margin:0;padding:6px 10px 10px;list-style:none;
  overflow-y:auto;flex:1;
}
.uso-suelo-legend ul.leg-items li{
  display:flex;align-items:center;gap:8px;padding:3px 0;
  border-bottom:1px solid var(--apple-separator-2);
}
.uso-suelo-legend ul.leg-items li:last-child{border-bottom:none}
.uso-suelo-legend ul.leg-items img{
  width:20px;height:14px;flex-shrink:0;
  border:1px solid rgba(0,0,0,.12);border-radius:2px;
}
.uso-suelo-legend .leg-loading{
  padding:14px;text-align:center;color:var(--apple-text-3);font-size:.8rem;
}
.uso-suelo-legend .leg-err{color:#b00020}
.spin{display:inline-block;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ─── Popup click-to-identify uso de suelo ─────────────────────────────── */
.usosuelo-popup .leaflet-popup-content-wrapper{
  background:var(--apple-surface);
  border:1px solid var(--apple-separator-2);
  border-radius:var(--radius-sm);
  box-shadow:0 8px 24px rgba(0,0,0,.18);
}
.usosuelo-popup .leaflet-popup-content{margin:0;width:auto!important}
.usosuelo-popup .leaflet-popup-tip{background:var(--apple-surface)}

.us-popup{font-family:inherit;font-size:.85rem;color:var(--apple-text);min-width:200px}
.us-popup header{
  display:flex;align-items:center;gap:7px;
  background:linear-gradient(180deg,#9D0034 0%,var(--can-yellow) 100%);
  color:#fff;font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;
  padding:7px 12px;
}
.us-popup header i{font-size:1rem}
.us-class{
  font-size:1rem;font-weight:600;color:var(--apple-text);
  padding:10px 12px 4px;line-height:1.25;
}
.us-code{padding:0 12px 6px;color:var(--apple-text-2);font-size:.78rem}
.us-code code{
  background:var(--apple-fill);padding:1px 6px;border-radius:4px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.78rem;
  color:var(--can-yellow);font-weight:700;
}
.us-popup .us-coord,.us-popup .us-attr{
  display:block;padding:0 12px;color:var(--apple-text-3);font-size:.7rem;
}
.us-popup .us-attr{padding:4px 12px 10px;font-style:italic}
.us-popup-loading,.us-popup-empty{
  padding:14px 16px;font-size:.85rem;color:var(--apple-text-2);
  display:flex;align-items:center;gap:6px;
}
.us-popup-empty{color:var(--apple-text-3)}

/* ─── Pestañas del Capítulo 3 (carpetas de documentos) ─────────────────
   Color naranja consistente para que se identifiquen visualmente como un
   bloque (3.1-3.4). Los selectores [data-tab^="cap3_"] hacen que cualquier
   tab cuya clave empiece con cap3_ tome el tratamiento. */
:root{ --cap3-orange:#F97316; --cap3-orange-soft:rgba(249,115,22,.12); }

/* "Escritura" (data-tab="datos_escritura") y "Anteproyecto Arquitectónico"
   (data-tab="documentos") viven dentro del grupo Capítulo 3 aunque no
   compartan el prefijo de clave (sus keys se mantienen para no romper
   special-cases iframe ni docs ya cargados). Se les aplica el mismo tratamiento.
   EXCEPCIÓN: cap3_patrimonial usa color guinda (override más abajo). */
.tabbar .tab[data-tab^="cap3_"] i,
.tabbar .tab[data-tab="datos_escritura"] i,
.tabbar .tab[data-tab="documentos"] i{ color:var(--cap3-orange); }
.tabbar .tab[data-tab^="cap3_"]:hover i,
.tabbar .tab[data-tab="datos_escritura"]:hover i,
.tabbar .tab[data-tab="documentos"]:hover i{ color:#EA580C; }
.tabbar .tab[data-tab^="cap3_"].active,
.tabbar .tab[data-tab="datos_escritura"].active,
.tabbar .tab[data-tab="documentos"].active{ border-bottom-color:var(--cap3-orange); }
.tabbar .tab[data-tab^="cap3_"].active i,
.tabbar .tab[data-tab="datos_escritura"].active i,
.tabbar .tab[data-tab="documentos"].active i{ color:#EA580C; }

/* Si se renderizan en una card list (form-card-head, acta-embed-bar) también
   pintamos el ícono en naranja para mantener coherencia visual. */
.form-card-head [data-tab^="cap3_"] i,
.form-card-head [data-tab="datos_escritura"] i,
.form-card-head [data-tab="documentos"] i,
.acta-embed-bar [data-tab^="cap3_"] i,
.acta-embed-bar [data-tab="datos_escritura"] i,
.acta-embed-bar [data-tab="documentos"] i{ color:var(--cap3-orange); }

/* Campos numéricos cortos (CP, viviendas, cajones): ocupan 1 columna del grid,
   no se estiran a todo el ancho aunque el grid colapse a 2 col en tablet. */
.form-grid .field.col-1{ grid-column:span 1; }
.form-grid .field.col-1 input{ max-width:160px; }

@media (max-width:760px){
  .form-grid .field.col-1{ grid-column:span 1; }
  .form-grid .field.col-1 input{ max-width:140px; }
}

/* ─── Fieldset de Dirección estilo Apple/Amazon ──────────────────────────
   CP primero como ancla del autocomplete → Estado · Municipio en pareja →
   Colonia full → Calle ancha + Núm ext + Núm int → Referencias full. */
.address-fieldset{
  border:1px solid var(--apple-separator);
  border-radius:var(--radius-md);
  padding:14px 18px 18px;
  margin:0 0 18px;
  background:var(--apple-surface);
}
.address-fieldset legend{
  padding:0 8px;font-size:.78rem;font-weight:700;color:var(--apple-text-2);
  text-transform:uppercase;letter-spacing:.04em;
  display:inline-flex;align-items:center;gap:6px;
}
.address-fieldset legend i{color:var(--cap3-orange);font-size:.95rem}
.address-hint{
  margin:0 0 14px;font-size:.78rem;color:var(--apple-text-3);
  display:flex;align-items:center;gap:6px;
}
.address-hint::before{
  content:"";display:inline-block;width:14px;height:14px;flex-shrink:0;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='%23F97316' viewBox='0 0 16 16'><path d='M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16zm.93-9.412-1 4.705c-.07.34.029.533.304.533.194 0 .487-.07.686-.246l-.088.416c-.287.346-.92.598-1.465.598-.703 0-1.002-.422-.808-1.319l.738-3.468c.064-.293.006-.399-.287-.47l-.451-.081.082-.381 2.29-.287zM8 5.5a1 1 0 1 1 0-2 1 1 0 0 1 0 2z'/></svg>") no-repeat center/contain;
}

.address-grid{
  display:grid;grid-template-columns:repeat(6,minmax(0,1fr));
  gap:14px 14px;
}
.address-field{display:flex;flex-direction:column;gap:5px}
.address-field label{font-size:.78rem;color:var(--apple-text-2);font-weight:600}
.address-field input,.address-field select{
  /* Reset del padding/font-size para que coincida con el .ctl genérico */
  padding:8px 12px;border:1px solid var(--apple-separator);border-radius:var(--radius-sm);
  background:var(--apple-fill);font-size:.88rem;color:var(--apple-text);font-family:inherit;
  width:100%;
}
.address-field input:focus,.address-field select:focus{
  outline:none;border-color:var(--apple-blue);box-shadow:0 0 0 3px rgba(0,122,255,.15);
}

/* Span por tipo de campo — basado en el patrón de Apple ID address sheet. */
.address-field-cp        { grid-column:span 2 }
.address-field-estado    { grid-column:span 2 }
.address-field-municipio { grid-column:span 2 }
.address-field-colonia   { grid-column:span 6 }
.address-field-calle     { grid-column:span 4 }
.address-field-numext    { grid-column:span 1 }
.address-field-numint    { grid-column:span 1 }
.address-field-referencias { grid-column:span 6 }

/* Tablet: 4 columnas */
@media (max-width:900px){
  .address-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .address-field-cp        { grid-column:span 2 }
  .address-field-estado    { grid-column:span 2 }
  .address-field-municipio { grid-column:span 4 }
  .address-field-colonia   { grid-column:span 4 }
  .address-field-calle     { grid-column:span 2 }
  .address-field-numext    { grid-column:span 1 }
  .address-field-numint    { grid-column:span 1 }
  .address-field-referencias { grid-column:span 4 }
}
/* Móvil: 2 columnas */
@media (max-width:540px){
  .address-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .address-field-cp        { grid-column:span 2 }
  .address-field-estado,
  .address-field-municipio { grid-column:span 2 }
  .address-field-colonia   { grid-column:span 2 }
  .address-field-calle     { grid-column:span 2 }
  .address-field-numext,
  .address-field-numint    { grid-column:span 1 }
  .address-field-referencias { grid-column:span 2 }
}

/* ─── Validador: review-card agrupada (varios fields aprobados en bloque) ─── */
.review-card.review-group .review-title{
  display:flex;align-items:baseline;gap:8px;
}
.review-card.review-group .review-count{
  font-size:.72rem;color:var(--apple-text-3);font-weight:500;
}
.review-group-fields{
  margin:0;padding:0;list-style:none;
  display:flex;flex-direction:column;gap:6px;
  background:var(--apple-fill);border-radius:var(--radius-sm);
  padding:10px 12px;
}
.review-group-field{
  display:grid;grid-template-columns:minmax(120px,38%) 1fr;
  align-items:start;gap:10px;
  padding:4px 0;border-bottom:1px dashed var(--apple-separator-2);
}
.review-group-field:last-child{border-bottom:none}
.group-field-label{
  font-size:.78rem;color:var(--apple-text-2);font-weight:600;
}
.group-field-value{
  font-size:.86rem;color:var(--apple-text);
  word-break:break-word;line-height:1.35;
}
.group-field-value.empty{color:var(--apple-text-3);font-style:italic}

/* ─── Fieldset genérico para grupos de fields (no-dirección) ──────────────
   Hoy lo usan las Pre-factibilidades. Por convención: cada GroupKey produce
   una fila con (status izq) | (constancia der). */
.group-fieldset{
  border:1px solid var(--apple-separator);
  border-radius:var(--radius-md);
  padding:14px 18px 18px;
  margin:18px 0 0;
  background:var(--apple-surface);
}
.group-fieldset legend{
  padding:0 8px;font-size:.78rem;font-weight:700;color:var(--apple-text-2);
  text-transform:uppercase;letter-spacing:.04em;
  display:inline-flex;align-items:center;gap:6px;
}
.group-fieldset legend i{color:var(--cap3-orange);font-size:.95rem}

/* Grid de 2 tarjetas por línea — cada servicio queda apilado:
   header (nombre) → status → constancia. */
.prefac-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px 16px;
  margin-top:6px;
}

/* Cada servicio es una mini-card visualmente individual */
.prefac-row{
  background:var(--apple-fill);
  border:1px solid var(--apple-separator-2);
  border-radius:var(--radius-sm);
  padding:12px 14px;
  display:flex;flex-direction:column;gap:10px;
}

.prefac-row-head{
  display:flex;align-items:center;gap:8px;
  font-size:.88rem;color:var(--apple-text);
}
.prefac-row-head i{color:var(--cap3-orange);font-size:1rem}
.prefac-row-head strong{font-weight:600;line-height:1.25}

/* Layout interno: status arriba, constancia abajo (apilado vertical) */
.prefac-row-grid{
  display:flex;flex-direction:column;gap:10px;
}
.prefac-status,.prefac-doc{display:flex;flex-direction:column;gap:5px}
.prefac-status label{font-size:.78rem;color:var(--apple-text-2);font-weight:600}
.prefac-status .ctl{width:100%}
.prefac-doc-label{
  font-size:.78rem;color:var(--apple-text-2);font-weight:600;
}
/* La docs-grid global usa min-width: 220px → dentro de la tarjeta angosta
   eso desbordaba. Forzamos block para que la card del doc llene el ancho. */
.prefac-doc-grid{
  display:block!important;
}
.prefac-doc-grid .doc-card{width:100%}

/* Tablet pequeña / móvil: una tarjeta por línea */
@media (max-width:720px){
  .prefac-grid{grid-template-columns:1fr}
}

/* ─── Fieldset "Densidad del proyecto" — agrupamiento visual (no validación) ─── */
.densidad-fieldset{
  border:1px solid var(--apple-separator);
  border-radius:var(--radius-md);
  padding:14px 18px 18px;
  margin:18px 0 0;
  background:var(--apple-surface);
}
.densidad-fieldset legend{
  padding:0 8px;font-size:.78rem;font-weight:700;color:var(--apple-text-2);
  text-transform:uppercase;letter-spacing:.04em;
  display:inline-flex;align-items:center;gap:6px;
}
.densidad-fieldset legend i{color:var(--cap3-orange);font-size:.95rem}

/* Nota informativa con fondo amarillo/ámbar (estilo "callout" Apple) */
.densidad-hint{
  display:flex;align-items:flex-start;gap:10px;
  margin:0 0 14px;padding:10px 12px;
  background:#FFF8E6;border-left:3px solid #F5B335;border-radius:6px;
  color:#665500;font-size:.82rem;line-height:1.45;
}
.densidad-hint i{color:#B45309;font-size:1rem;flex-shrink:0;margin-top:1px}
.densidad-hint strong{color:#1D1D1F;font-weight:700}

/* Grid: 2 cajas estrechas lado a lado */
.densidad-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px 16px;
}
.densidad-field{display:flex;flex-direction:column;gap:5px;max-width:240px}
.densidad-field label{font-size:.78rem;color:var(--apple-text-2);font-weight:600}
.densidad-field .ctl{width:100%}

/* Móvil */
@media (max-width:540px){
  .densidad-grid{grid-template-columns:1fr}
}

/* ─── Fieldset "Representante legal / Propietario" ────────────────────── */
.rep-fieldset{
  border:1px solid var(--apple-separator);
  border-radius:var(--radius-md);
  padding:14px 18px 18px;
  margin:18px 0 0;
  background:var(--apple-surface);
}
.rep-fieldset legend{
  padding:0 8px;font-size:.78rem;font-weight:700;color:var(--apple-text-2);
  text-transform:uppercase;letter-spacing:.04em;
  display:inline-flex;align-items:center;gap:6px;
}
.rep-fieldset legend i{color:var(--cap3-orange);font-size:.95rem}

/* Hint informativo encima del bloque */
.rep-hint{
  display:flex;align-items:flex-start;gap:8px;
  margin:0 0 14px;font-size:.78rem;color:var(--apple-text-3);
  line-height:1.45;
}
.rep-hint i{color:var(--apple-text-3);margin-top:1px;flex-shrink:0}
.rep-hint strong{color:var(--apple-text);font-weight:600}

/* Grid de 2 columnas para los inputs */
.rep-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px 16px;
}
.rep-grid-toggle{margin-bottom:14px}
.rep-field{display:flex;flex-direction:column;gap:5px}
.rep-field label{font-size:.78rem;color:var(--apple-text-2);font-weight:600}
.rep-field .ctl{width:100%}
.rep-field-toggle{max-width:280px}

/* Doc anidado dentro del fieldset (CV, INE, etc.) */
.rep-doc-block{margin-top:14px;display:flex;flex-direction:column;gap:6px}
.rep-doc-block .docs-grid{display:block!important}
.rep-doc-block .doc-card{width:100%;max-width:560px}

/* Sub-bloque condicional (Propietario) cuando pa_es_dueno = "No" */
.propietario-condicional{
  margin-top:14px;padding-top:14px;
  border-top:1px dashed var(--apple-separator);
}

/* Móvil: 1 columna */
@media (max-width:540px){
  .rep-grid{grid-template-columns:1fr}
}

/* ─── Widget INE OCR del propietario — layout 2 columnas ─────────────────
   Mitad izquierda: tabla de resultados del OCR (siempre visible).
   Mitad derecha: inputs correo + teléfono del propietario. */
.ine-result-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  margin-top:14px;
  align-items:start;
}
.ine-result-side, .ine-contact-side{
  min-width:0;
}
.ine-result-side .ine-result-head{
  display:flex;align-items:center;gap:8px;margin-bottom:8px;
}
/* Badge "Sin lectura" (estado vacío) — gris discreto */
.badge-pending{
  display:inline-flex;align-items:center;gap:5px;
  background:var(--apple-fill);color:var(--apple-text-3);
  border:1px solid var(--apple-separator);
  border-radius:var(--radius-pill);
  padding:3px 10px;font-size:.72rem;font-weight:600;
}
.ine-contact-side .form-subhead{
  margin:0 0 10px;
}
.ine-contact-side .rep-field{margin-bottom:10px}
.ine-contact-side .rep-field:last-child{margin-bottom:0}
.rep-field-stacked{display:flex;flex-direction:column;gap:5px}
.rep-field-stacked label{font-size:.78rem;color:var(--apple-text-2);font-weight:600}
.rep-field-stacked .ctl{width:100%}

/* Móvil: la tabla y los inputs apilados */
@media (max-width:720px){
  .ine-result-row{grid-template-columns:1fr;gap:14px}
}

/* ─── Ligas a archivos guardados del INE del propietario ─────────────────── */
.ine-saved-files{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  margin-top:12px;padding:8px 12px;
  background:var(--apple-fill);border-radius:var(--radius-sm);
  font-size:.82rem;
}
.ine-saved-files i.bi-file-earmark-check{color:#1F7A3A}
.ine-saved-label{color:var(--apple-text-2);font-weight:600}
.ine-saved-files a{
  display:inline-flex;align-items:center;gap:5px;
  color:var(--can-yellow);text-decoration:none;
  padding:3px 8px;border-radius:4px;
  background:var(--apple-surface);border:1px solid var(--apple-separator);
}
.ine-saved-files a:hover{
  background:var(--can-yellow-tint);border-color:var(--can-yellow-border);
}

/* ─── Resumen JSON (campo *_data en review-group del Validador) ──────────── */
.json-summary{
  display:flex;flex-direction:column;gap:2px;
  font-size:.82rem;line-height:1.35;
}
.json-summary > div{
  padding:2px 0;
}
.json-summary strong{
  color:var(--apple-text-2);font-weight:600;
  text-transform:capitalize;
}

/* ─── Fieldset + Tabla de Costos del proyecto (Anteproyecto Arquitectónico) ─── */
.costos-fieldset{
  border:1px solid var(--apple-separator);
  border-radius:var(--radius-md);
  padding:14px 18px 18px;
  margin:18px 0 0;
  background:var(--apple-surface);
}
.costos-fieldset legend{
  padding:0 8px;font-size:.78rem;font-weight:700;color:var(--apple-text-2);
  text-transform:uppercase;letter-spacing:.04em;
  display:inline-flex;align-items:center;gap:6px;
}
.costos-fieldset legend i{color:var(--cap3-orange);font-size:.95rem}
.costos-hint{
  display:flex;align-items:flex-start;gap:8px;
  margin:0 0 14px;font-size:.78rem;color:var(--apple-text-3);
  line-height:1.45;
}
.costos-hint i{color:var(--apple-text-3);margin-top:1px;flex-shrink:0}
.costos-hint strong{color:var(--apple-text);font-weight:600}

.costos-table-wrap{overflow-x:auto}
.costos-table{
  width:100%;border-collapse:collapse;
  font-size:.85rem;color:var(--apple-text);
}
.cs-col-concepto{ width:50%; }
.cs-col-money   { width:18%; }
.cs-col-pct     { width:14%; }

.costos-table thead th{
  background:var(--apple-fill);
  color:var(--apple-text-2);font-weight:700;font-size:.74rem;
  text-transform:uppercase;letter-spacing:.04em;
  padding:8px 10px;border:1px solid var(--apple-separator);
  text-align:center;
}
.costos-table thead th:first-child{text-align:left}
.costos-table tbody td, .costos-table tbody th{
  padding:7px 10px;border:1px solid var(--apple-separator);
  vertical-align:middle;
}
.costos-table tbody th{ text-align:left;font-weight:600 }
.costos-table .cs-concepto label{
  font-weight:500;color:var(--apple-text);font-size:.85rem;cursor:default;
}

/* Encabezado de sección — fondo gris (como en la captura del usuario) */
.cs-section-header td{
  background:var(--apple-fill);
  font-weight:700;color:var(--apple-text);font-size:.78rem;
  text-transform:uppercase;letter-spacing:.03em;
  padding:8px 10px;
}

/* Fila de subtotal — fondo amarillo guinda muy tenue */
.cs-subtotal th, .cs-subtotal td{
  background:#FCF2D6;font-weight:700;
  border-top:2px solid var(--apple-separator);
}

/* Inputs de la columna Costo Conjunto */
.cs-input{
  width:100%;
  text-align:right;
  font-variant-numeric:tabular-nums;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  padding:6px 8px;
}
.cs-input:focus{
  outline:none;border-color:var(--apple-blue);
  box-shadow:0 0 0 3px rgba(0,122,255,.15);
}

/* Celdas derivadas (sólo lectura) */
.cs-derived, .cs-money, .cs-pct{
  text-align:right;
  font-variant-numeric:tabular-nums;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  color:var(--apple-text-2);
}
.cs-derived{color:var(--apple-text-3)}
.cs-pct{ text-align:center; }

/* Totales generales — fondo guinda tinte */
.costos-table tfoot th, .costos-table tfoot td{
  background:linear-gradient(180deg,#FCE6EC 0%,#F8DEE7 100%);
  padding:10px 12px;border:1px solid var(--apple-separator);
  font-weight:700;
}
.cs-grand-total th{
  text-align:left;color:#7A0026;font-size:.85rem;
}
.cs-grand-total th small{color:var(--apple-text-3);font-weight:500;font-size:.75rem}
.cs-grand-total td{color:#1D1D1F;font-size:.95rem;text-align:right}

/* ─── Totales calculados dentro del review-group del Validador ─────────── */
.review-group-totals{
  margin-top:12px;padding:10px 12px;
  background:var(--apple-fill);
  border-radius:var(--radius-sm);
  border:1px solid var(--apple-separator-2);
  font-size:.82rem;
}
.rg-totals-head{
  display:flex;align-items:center;gap:6px;
  font-weight:700;font-size:.72rem;
  color:var(--apple-text-2);text-transform:uppercase;letter-spacing:.04em;
  margin-bottom:8px;
}
.rg-totals-head i{color:var(--cap3-orange);font-size:.9rem}

.rg-total-row{
  display:flex;justify-content:space-between;align-items:baseline;
  padding:5px 0;gap:12px;
  border-bottom:1px dashed var(--apple-separator-2);
}
.rg-total-row:last-child{border-bottom:none}
.rg-total-row > span:first-child{
  color:var(--apple-text-2);font-weight:500;
}
.rg-total-row .money{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-variant-numeric:tabular-nums;
  color:var(--apple-text);font-weight:600;
  text-align:right;white-space:nowrap;
}
.rg-total-row small{color:var(--apple-text-3);font-weight:400;margin-left:4px;}

.rg-total-row.rg-grand{
  margin-top:4px;padding-top:8px;
  border-top:2px solid var(--apple-separator);
  font-weight:700;
}
.rg-total-row.rg-grand > span:first-child{color:var(--apple-text);font-weight:700}
.rg-total-row.rg-grand .money{color:#7A0026;font-size:.92rem}

/* ─── Toolbar de Excel del fieldset Costos ────────────────────────────── */
.costos-toolbar{
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;
  margin:0 0 14px;padding:8px 10px;
  background:var(--apple-fill);
  border:1px solid var(--apple-separator-2);
  border-radius:var(--radius-sm);
}
.costos-xlsx-btn{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 12px;font-size:.82rem;font-weight:600;
  text-decoration:none;color:var(--apple-text);
  background:var(--apple-surface);
  border:1px solid var(--apple-separator);
  border-radius:var(--radius-sm);
  cursor:pointer;
  transition:background-color .15s ease, border-color .15s ease;
}
.costos-xlsx-btn:hover{
  background:var(--apple-separator-2);
  border-color:var(--apple-separator);
}
.costos-xlsx-btn i{color:#1F7A3A}             /* verde tipo Excel */
.costos-xlsx-upload i{color:var(--can-yellow)} /* upload en guinda */
.costos-xlsx-upload{position:relative}

.costos-xlsx-status{
  margin-left:auto;font-size:.78rem;font-weight:500;
  padding:4px 10px;border-radius:var(--radius-pill);
}
.costos-xlsx-status.is-ok{background:#E0F2E5;color:#1F7A3A}
.costos-xlsx-status.is-err{background:#FBE7E8;color:#B91C1C}

@media (max-width:640px){
  .costos-toolbar{flex-direction:column;align-items:stretch}
  .costos-xlsx-btn{justify-content:center}
  .costos-xlsx-status{margin-left:0;text-align:center}
}

/* ─── Fieldsets de "Registro como proveedor" ──────────────────────────── */
.pv-toggle-fieldset{
  border:1px solid var(--apple-separator);
  border-radius:var(--radius-md);
  padding:14px 18px 18px;
  margin:18px 0 0;
  background:var(--apple-surface);
}
.pv-toggle-fieldset legend{
  padding:0 8px;font-size:.78rem;font-weight:700;color:var(--apple-text-2);
  text-transform:uppercase;letter-spacing:.04em;
  display:inline-flex;align-items:center;gap:6px;
}
.pv-toggle-fieldset legend i{color:var(--cap3-orange);font-size:.95rem}

.pv-section-fieldset{
  border:1px solid var(--apple-separator);
  border-radius:var(--radius-md);
  padding:12px 18px 18px;
  margin:14px 0 0;
  background:var(--apple-surface);
}
.pv-section-fieldset legend{
  padding:0 8px;font-size:.85rem;font-weight:700;color:var(--apple-text);
  display:inline-flex;align-items:center;gap:6px;
}
.pv-section-fieldset legend i{color:var(--cap3-orange);font-size:1rem}

/* Sección condicional Propietario del suelo — discreto divisor visual */
.pv-section-condicional{
  border-top:3px dashed var(--apple-separator);
  margin-top:18px;
}

/* docs-grid dentro de fieldset — respetar el ancho del contenedor */
.pv-docs-grid{
  margin-top:6px;
}

/* ─── Pestaña Patrimonial — color guinda (override del naranja Cap 3) ─── */
.tabbar .tab[data-tab="cap3_patrimonial"] i        { color:var(--can-yellow) !important; }
.tabbar .tab[data-tab="cap3_patrimonial"]:hover i  { color:var(--can-yellow-hover) !important; }
.tabbar .tab[data-tab="cap3_patrimonial"].active   { border-bottom-color:var(--can-yellow) !important; }
.tabbar .tab[data-tab="cap3_patrimonial"].active i { color:var(--can-yellow-hover) !important; }

.form-card-head [data-tab="cap3_patrimonial"] i,
.acta-embed-bar [data-tab="cap3_patrimonial"] i{ color:var(--can-yellow) !important; }

/* Fieldsets de la pestaña Patrimonial */
.pat-section-fieldset{
  border:1px solid var(--apple-separator);
  border-radius:var(--radius-md);
  padding:14px 18px 18px;
  margin:18px 0 0;
  background:var(--apple-surface);
}
.pat-section-fieldset legend{
  padding:0 8px;font-size:.85rem;font-weight:700;color:var(--apple-text);
  display:inline-flex;align-items:center;gap:6px;
}
.pat-principal legend i  { color:var(--can-yellow); font-size:1rem }
.pat-adicionales legend i{ color:var(--can-yellow); font-size:1rem }

/* Adicionales con leve tinte guinda para diferenciar visualmente */
.pat-adicionales{
  background:linear-gradient(180deg, var(--apple-surface) 0%, #FFFAFB 100%);
  border-color:rgba(122,0,38,.18);
}
.pat-docs-grid{ margin-top:6px }

/* ─── Pestaña Escrituración — color guinda (mismo override que Patrimonial) ─── */
.tabbar .tab[data-tab="cap3_escrituracion"] i        { color:var(--can-yellow) !important; }
.tabbar .tab[data-tab="cap3_escrituracion"]:hover i  { color:var(--can-yellow-hover) !important; }
.tabbar .tab[data-tab="cap3_escrituracion"].active   { border-bottom-color:var(--can-yellow) !important; }
.tabbar .tab[data-tab="cap3_escrituracion"].active i { color:var(--can-yellow-hover) !important; }
.form-card-head [data-tab="cap3_escrituracion"] i,
.acta-embed-bar [data-tab="cap3_escrituracion"] i{ color:var(--can-yellow) !important; }

/* Fieldset principal "Documentos del propietario" (contiene el toggle + sub-fieldsets) */
.esc-propietario-fieldset legend i  { color:var(--can-yellow) }
.esc-integracion-fieldset legend i  { color:var(--can-yellow) }

/* Sub-fieldsets de Persona Física / Persona Moral (anidados) */
.esc-sub-fieldset{
  margin-top:14px;
  background:#FFFAFB;
  border-color:rgba(122,0,38,.18);
}
.esc-sub-fieldset legend{
  font-size:.82rem;
}
.esc-sub-fieldset legend i{ color:var(--can-yellow) }

/* Toggle: ancho moderado (no full-width) */
.esc-propietario-fieldset .rep-field-toggle{ max-width:340px }

/* ─── Pestañas RUV (verde) — Constructor-RUV, Oferta-RUV y OV-RUV ─── */
.tabbar .tab[data-tab="datos_constructor"] i,
.tabbar .tab[data-tab="oferta_vivienda"] i,
.tabbar .tab[data-tab="ov_ruv"] i                 { color:var(--ruv-green) !important; }
.tabbar .tab[data-tab="datos_constructor"]:hover i,
.tabbar .tab[data-tab="oferta_vivienda"]:hover i,
.tabbar .tab[data-tab="ov_ruv"]:hover i           { color:var(--ruv-green-hover) !important; }
.tabbar .tab[data-tab="datos_constructor"].active,
.tabbar .tab[data-tab="oferta_vivienda"].active,
.tabbar .tab[data-tab="ov_ruv"].active            { border-bottom-color:var(--ruv-green) !important; }
.tabbar .tab[data-tab="datos_constructor"].active i,
.tabbar .tab[data-tab="oferta_vivienda"].active i,
.tabbar .tab[data-tab="ov_ruv"].active i          { color:var(--ruv-green-hover) !important; }

/* En form-card-head / acta-embed-bar (cuando el ícono aparece en el header del panel) */
.form-card-head [data-tab="datos_constructor"] i,
.form-card-head [data-tab="oferta_vivienda"] i,
.form-card-head [data-tab="ov_ruv"] i,
.acta-embed-bar [data-tab="datos_constructor"] i,
.acta-embed-bar [data-tab="oferta_vivienda"] i,
.acta-embed-bar [data-tab="ov_ruv"] i{ color:var(--ruv-green) !important; }

/* ─── Avances-RUV ─────────────────────────────────────────────────────── */
.avances-toolbar{
  display:flex;align-items:center;gap:10px;
  background:var(--ruv-green-tint);
  border:1px solid rgba(0,133,62,.20);
  border-radius:var(--radius-sm);
  padding:10px 14px;margin-bottom:14px;
}
.avances-select-label{
  display:inline-flex;align-items:center;gap:6px;
  font-size:.78rem;font-weight:700;color:var(--ruv-green-hover);
  text-transform:uppercase;letter-spacing:.04em;
}
.avances-select{
  flex:1;max-width:520px;
  background:#fff;border-color:rgba(0,133,62,.30);
}
.avances-select:focus{
  outline:none;border-color:var(--ruv-green);
  box-shadow:0 0 0 3px rgba(0,133,62,.18);
}
.avances-loading{
  display:inline-flex;align-items:center;gap:5px;
  font-size:.78rem;color:var(--apple-text-2);
}
.avances-loading i{ animation:spin 1s linear infinite }

/* Estado vacío */
.avances-empty{
  display:flex;flex-direction:column;align-items:center;gap:8px;
  padding:40px 20px;color:var(--apple-text-3);
  background:var(--apple-fill);border-radius:var(--radius-md);
  text-align:center;
}
.avances-empty i{ font-size:2.2rem;color:var(--apple-text-3) }
.avances-empty p{ margin:0;font-size:.88rem }

/* Header de la grid (info OV + conteo) */
.avances-grid-wrap{
  background:var(--apple-surface);
  border:1px solid var(--apple-separator);
  border-radius:var(--radius-md);
  overflow:hidden;
}
.avances-grid-head{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  padding:12px 16px;background:var(--apple-fill);
  border-bottom:1px solid var(--apple-separator);
}
.avances-grid-head strong{ font-size:.95rem;color:var(--apple-text);font-weight:700 }
.avances-grid-head small{ font-size:.82rem;color:var(--apple-text-3);margin-left:6px }
.avances-count{
  background:var(--ruv-green-tint);color:var(--ruv-green-hover);
  font-size:.78rem;font-weight:700;
  padding:4px 12px;border-radius:var(--radius-pill);
  border:1px solid rgba(0,133,62,.20);
}

/* Tabla de viviendas */
.avances-table{ width:100%;border-collapse:collapse;font-size:.85rem }
.avances-table thead th{
  background:var(--apple-fill);color:var(--apple-text-2);
  font-weight:700;font-size:.74rem;text-transform:uppercase;letter-spacing:.04em;
  padding:10px 14px;border-bottom:1px solid var(--apple-separator);
  text-align:left;
}
.avances-table thead th.num{ text-align:left }
.avances-table thead th.cen{ text-align:center }
.avances-table tbody td{
  padding:10px 14px;border-bottom:1px solid var(--apple-separator-2);
  vertical-align:middle;
}
.avances-table tbody tr:hover td{ background:#FAFAFC }
.avances-table .cuv{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-variant-numeric:tabular-nums;
  font-weight:600;
}
.avances-table .num{ width:32% }
.avances-table .cen{ text-align:center }

/* Barra de avance */
.avances-bar-wrap{
  position:relative;height:22px;
  background:var(--apple-fill);border-radius:var(--radius-pill);
  overflow:hidden;border:1px solid var(--apple-separator-2);
}
.avances-bar{
  position:absolute;top:0;left:0;bottom:0;
  border-radius:var(--radius-pill);
  transition:width .3s ease;
}
.avances-bar.bar-green{ background:linear-gradient(90deg,#22C55E 0%, var(--ruv-green) 100%) }
.avances-bar.bar-amber{ background:linear-gradient(90deg,#F59E0B 0%,#FB923C 100%) }
.avances-bar.bar-red  { background:linear-gradient(90deg,#EF4444 0%,#F87171 100%) }
.avances-bar-text{
  position:relative;display:block;
  text-align:center;line-height:22px;font-size:.78rem;
  font-weight:700;color:var(--apple-text);
  font-variant-numeric:tabular-nums;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  mix-blend-mode:difference;
  filter:invert(1) grayscale(1) contrast(1.2);
}

/* Chips Sí/No (reusa chip-green/amber existentes pero pequeñas) */
.avances-table .chip{ font-size:.74rem;padding:2px 9px }

/* ─── Catálogo de Conceptos (Form 8.1 INCO) ──────────────────────────── */
.cc-toolbar{ margin-top:14px }
.cc-table .cc-col-codigo   { width:8% }
.cc-table .cc-col-actividad{ width:38% }
.cc-table .cc-col-num      { width:14% }

.cc-table .cc-actividad{
  font-size:.85rem; color:var(--apple-text);
}
/* Indentación por nivel para items de la jerarquía */
.cc-item.lvl-2 .cc-actividad{ padding-left:16px }
.cc-item.lvl-3 .cc-actividad{ padding-left:32px;color:var(--apple-text-2) }

/* Header de sección (1, 2, 3, 4) — gris fuerte */
.cc-table .cs-section-header td{ font-size:.84rem }
.cc-table .cs-subtotal{
  background:#FCF2D6;
}

/* Inputs internos */
.cc-table .cs-input{ padding:6px 8px;font-size:.85rem }
.cc-table .cc-unidad{ text-align:center;max-width:80px;margin:0 auto }
.cc-table .cc-cantidad,
.cc-table .cc-pa{ text-align:right }
.cc-table .cc-importe{
  text-align:right;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-variant-numeric:tabular-nums;
  font-weight:600;
}

@media (max-width:900px){
  .cc-table .cc-col-codigo   { width:12% }
  .cc-table .cc-col-actividad{ width:30% }
}

/* ─── Programa de obra ────────────────────────────────────────────────── */
.form-card-wide{ max-width:none }
.po-table-wrap{
  overflow-x:auto;
  border:1px solid var(--apple-separator);
  border-radius:var(--radius-md);
}
.po-table{
  width:100%; min-width:1400px;
  border-collapse:collapse;
  font-size:.82rem;
}
.po-table thead th{
  background:var(--apple-fill);
  font-weight:700;font-size:.72rem;
  text-transform:uppercase;letter-spacing:.04em;
  color:var(--apple-text-2);
  padding:8px 10px;border:1px solid var(--apple-separator);
  text-align:center;
  white-space:nowrap;
}
.po-table thead th.po-col-concepto{ text-align:left;min-width:280px;position:sticky;left:0;background:var(--apple-fill);z-index:2 }
.po-table thead th.po-col-money  { min-width:120px }
.po-table tbody td, .po-table tbody th{
  padding:6px 8px;border:1px solid var(--apple-separator-2);
  vertical-align:middle;
}
.po-table .po-concepto{
  font-weight:500;color:var(--apple-text);
  position:sticky;left:0;background:var(--apple-surface);z-index:1;
  white-space:nowrap;
}
.po-table .cs-subtotal .po-concepto{ background:#FCF2D6 }
.po-table .po-importe, .po-table .po-mes, .po-table .po-importe-total{
  text-align:right;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-variant-numeric:tabular-nums;
}
.po-table .cs-input{ padding:5px 7px;font-size:.8rem;width:100% }

.po-table tfoot td, .po-table tfoot th{
  padding:8px 10px;border:1px solid var(--apple-separator);
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-variant-numeric:tabular-nums;
  text-align:right;
}
.po-table tfoot th{
  position:sticky;left:0;background:#FCE6EC;z-index:1;
  text-align:left;font-weight:700;
}
.po-row-mes  td, .po-row-mes  th{ background:#FCE6EC;font-weight:700 }
.po-row-acum td, .po-row-acum th{ background:linear-gradient(180deg,#FCE6EC 0%,#F8DEE7 100%);
  font-weight:700;color:#7A0026 }

/* Indentación por nivel (sticky-friendly) */
.po-table .cc-item.lvl-2 .po-concepto{ padding-left:24px }
.po-table .cc-item.lvl-3 .po-concepto{ padding-left:40px;color:var(--apple-text-2) }

/* ─── PlanoSimulador — pin status + botón icono ────────────────────────── */
.pin-status{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  margin-top:8px;padding:6px 10px;
  background:var(--apple-fill);border-radius:var(--radius-sm);
  font-size:.78rem;color:var(--apple-text-2);
}
.pin-status strong{color:var(--apple-text);font-variant-numeric:tabular-nums}
.btn-icon{
  background:transparent;border:none;cursor:pointer;
  color:var(--apple-text-3);padding:4px 6px;border-radius:4px;
  display:inline-flex;align-items:center;
}
.btn-icon:hover{background:var(--apple-separator-2);color:var(--apple-text)}

/* Mapa Leaflet del PlanoSimulador — instancia independiente de la pestaña Ubicación. */
.plano-sim-map{
  flex:1;min-height:400px;
}

/* Toast flotante de operación en curso — se muestra arriba del mapa centrado
   mientras hay consultas Overpass / Nominatim activas. Posición fixed para
   funcionar dentro de iframes con scroll. */
.loading-banner{
  position:fixed;top:14px;left:50%;transform:translateX(-50%);
  z-index:9998;
  display:inline-flex;align-items:center;gap:10px;
  padding:8px 16px 8px 12px;
  background:rgba(255,255,255,.96);
  backdrop-filter:saturate(180%) blur(20px);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  border:1px solid var(--apple-separator);
  border-radius:var(--radius-pill);
  box-shadow:0 4px 24px rgba(0,0,0,.10),0 1px 2px rgba(0,0,0,.06);
  font-size:.84rem;font-weight:500;color:var(--apple-text);
  animation:loadingPop .22s cubic-bezier(.2,.9,.3,1.4);
  pointer-events:none;
  white-space:nowrap;
}
/* `display:inline-flex` ganaba en especificidad sobre el `[hidden] -> display:none`
   del UA → el banner se quedaba siempre visible. Forzar la regla del atributo. */
.loading-banner[hidden]{display:none !important}
.loading-spinner{
  width:16px;height:16px;
  border:2px solid var(--apple-separator);
  border-top-color:var(--can-yellow);
  border-radius:50%;
  animation:loadingSpin .75s linear infinite;
  flex-shrink:0;
}
@keyframes loadingSpin{ to{transform:rotate(360deg)} }
@keyframes loadingPop{
  from{opacity:0;transform:translate(-50%,-10px)}
  to  {opacity:1;transform:translate(-50%,0)}
}

/* Ícono guinda para distinguir la tab PlanoSimulador */
.tabbar .tab[data-tab="plano_simulador"] i        { color:var(--can-yellow) !important; }
.tabbar .tab[data-tab="plano_simulador"]:hover i  { color:var(--can-yellow-hover) !important; }
.tabbar .tab[data-tab="plano_simulador"].active   { border-bottom-color:var(--can-yellow) !important; }
.tabbar .tab[data-tab="plano_simulador"].active i { color:var(--can-yellow-hover) !important; }

/* ─── Página /predios/{id}/areas — selector de área ─────────────────────── */
.areas-page{
  min-height:calc(100vh - 60px);
  background:
    radial-gradient(ellipse 1200px 600px at 90% -10%, #FCE6EC 0%, transparent 50%),
    linear-gradient(180deg, #FFFFFF 0%, #FAFAFC 100%);
  padding:40px 24px 80px;
}
.areas-wrap{ max-width:1180px;margin:0 auto }

.areas-head{ margin-bottom:44px }
.areas-chip{
  display:inline-block;padding:6px 14px;
  background:transparent;color:var(--can-yellow);
  border:1px solid var(--can-yellow);border-radius:var(--radius-pill);
  font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
}
.areas-head h1{
  margin:14px 0 10px;font-size:2.4rem;font-weight:700;
  color:var(--apple-text);letter-spacing:-.025em;line-height:1.15;
}
.areas-sub{ color:var(--apple-text-2);font-size:1rem;max-width:780px;line-height:1.5 }
.areas-sub strong{color:var(--apple-text)}

/* Grid 3 cols → 2 → 1 según ancho. 3 columnas dan tarjetas más generosas
   y mejor legibilidad de la descripción. */
.areas-grid{
  display:grid;grid-template-columns:repeat(3, minmax(0,1fr));
  gap:28px;
}
@media (max-width:980px) { .areas-grid{ grid-template-columns:repeat(2, minmax(0,1fr)) } }
@media (max-width:560px) { .areas-grid{ grid-template-columns:1fr } }

.area-card{
  position:relative;display:flex;flex-direction:column;gap:14px;
  text-decoration:none;color:inherit;
  background:var(--apple-surface);
  border:1px solid var(--apple-separator);
  border-radius:18px;
  padding:32px 28px 26px;
  box-shadow:0 1px 3px rgba(0,0,0,.04), 0 4px 12px rgba(0,0,0,.03);
  transition:transform .18s cubic-bezier(.2,.9,.3,1.2),
             box-shadow .18s ease, border-color .18s ease;
  overflow:hidden;
  min-height:240px;
}
/* Detalle "pestaña" guinda en la esquina superior izquierda — más visible */
.area-card-top{
  position:absolute;top:0;left:24px;
  width:42px;height:10px;
  background:linear-gradient(180deg, #9D0034 0%, #7A0026 100%);
  border-radius:0 0 5px 5px;
}
.area-card:hover{
  transform:translateY(-3px);
  border-color:rgba(122,0,38,.4);
  box-shadow:0 12px 32px rgba(122,0,38,.10),
             0 4px 12px rgba(122,0,38,.05);
}
.area-card:focus-visible{
  outline:none;border-color:var(--apple-blue);
  box-shadow:0 0 0 3px rgba(0,122,255,.18);
}

.area-card-icon{
  width:56px;height:56px;border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg, #FCE6EC 0%, #FFEEF2 100%);
  color:var(--can-yellow);
  font-size:1.65rem;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6);
}
.area-card-title{
  margin:8px 0 0;font-size:1.2rem;font-weight:700;color:var(--apple-text);
  letter-spacing:-.015em;line-height:1.3;
}
.area-card-desc{
  margin:0;color:var(--apple-text-2);font-size:.92rem;line-height:1.55;
  flex:1;
}
.area-card-cta{
  display:inline-flex;align-items:center;gap:7px;
  color:var(--can-yellow);font-weight:600;font-size:.92rem;
  margin-top:6px;
}
.area-card:hover .area-card-cta i{ transform:translateX(4px) }
.area-card-cta i{ transition:transform .18s ease;font-size:.95rem }

/* Chip de área activa en el subbar del Detail */
.area-active-chip{
  margin-left:auto;
  display:inline-flex;align-items:center;gap:5px;
  background:var(--can-yellow-tint);color:var(--can-yellow);
  border:1px solid var(--can-yellow-border);
  border-radius:var(--radius-pill);
  padding:2px 10px;font-size:.72rem;font-weight:600;
}
.area-active-chip strong{font-weight:700}
.area-active-chip i{color:var(--can-yellow)}
