/* Software ESM — capa visual aprobada para Proyectos/Bases y Relevantes.
   No altera Firebase, datos, IDs ni operaciones existentes. */
#modalProyectosPuestos .modal-proyectos-puestos-real,
#modalRelevantesBase .modal-relevantes-base-real{
  width:min(1540px,98vw)!important;height:min(920px,96vh)!important;max-height:96vh!important;
  padding:14px!important;overflow:hidden!important;border-radius:24px!important;
  background:linear-gradient(145deg,rgba(4,19,49,.99),rgba(1,8,28,.995))!important;
}
#modalProyectosPuestos .modal-header-pro,#modalRelevantesBase .modal-header-pro{
  min-height:58px!important;padding:7px 14px!important;margin:0 0 10px!important;
  border:1px solid rgba(56,189,248,.25)!important;border-radius:17px!important;
  background:linear-gradient(135deg,rgba(8,31,72,.98),rgba(3,13,39,.98))!important;
}
#modalProyectosPuestos .modal-header-pro h2,#modalRelevantesBase .modal-header-pro h2{font-size:24px!important;margin:0!important}
#modalProyectosPuestos .esm-projects-header-title{display:flex!important;align-items:center!important;gap:12px!important;min-width:0!important}
#modalProyectosPuestos .esm-projects-header-icon{width:48px!important;height:48px!important;object-fit:contain!important;flex:0 0 48px!important;filter:drop-shadow(0 5px 8px rgba(0,0,0,.42))!important}
#modalProyectosPuestos .modal-header-pro .nota,#modalRelevantesBase .modal-header-pro .nota{margin:2px 0 0!important;font-size:12px!important}
#modalProyectosPuestos .btn-cerrar-pro,#modalRelevantesBase .rel-volver-base{min-width:118px!important;border-radius:12px!important}
#modalProyectosPuestos .pp-grid-real,#modalRelevantesBase .rel-grid-real{display:block!important;height:calc(100% - 88px)!important;margin:0!important}
#modalProyectosPuestos .pp-grid-real>.pp-card-real:nth-child(2),#modalRelevantesBase .rel-grid-real>.pp-card-real:nth-child(2){height:100%!important;padding:14px!important;overflow:hidden!important;border-radius:19px!important;background:rgba(3,15,42,.82)!important}
#modalProyectosPuestos .usuarios-toolbar{display:grid!important;grid-template-columns:minmax(220px,360px) 1fr auto auto!important;gap:9px!important;align-items:center!important;margin-bottom:12px!important}
#modalRelevantesBase .usuarios-toolbar{display:grid!important;grid-template-columns:minmax(180px,320px) 1fr auto!important;gap:9px!important;align-items:center!important;margin-bottom:12px!important}
#modalProyectosPuestos #buscarProyectoPuesto{grid-column:1!important;width:100%!important;min-height:34px!important;height:34px!important;padding:6px 10px!important;font-size:11px!important;border-radius:9px!important}
#modalProyectosPuestos #btnRecargarProyectosPuestos{display:none!important}
#modalRelevantesBase #buscarRelevanteBase{grid-column:1!important;min-height:34px!important;height:34px!important;padding:6px 10px!important;font-size:11px!important;border-radius:9px!important}
.esm-compact-new-btn{grid-column:3;justify-self:end;min-height:36px!important;padding:6px 14px!important;border:1px solid rgba(96,165,250,.55)!important;border-radius:11px!important;color:#fff!important;background:linear-gradient(135deg,#2563eb,#0ea5e9)!important;font-weight:900!important;cursor:pointer!important;box-shadow:0 8px 22px rgba(37,99,235,.22)!important;white-space:nowrap!important}
.esm-compact-counter{grid-column:4;justify-self:end;border:1px solid rgba(245,158,11,.42)!important;border-radius:11px!important;padding:9px 12px!important;color:#fde68a!important;background:rgba(15,23,42,.78)!important;font-size:12px!important;font-weight:850!important;white-space:nowrap!important}

#modalRelevantesBase .esm-compact-new-btn{grid-column:2!important}
#modalRelevantesBase .esm-compact-counter{grid-column:3!important}
#modalProyectosPuestos .pp-list-real,#modalRelevantesBase .pp-list-real{display:grid!important;grid-template-columns:repeat(3,minmax(300px,1fr))!important;align-content:start!important;gap:14px!important;height:calc(100% - 58px)!important;max-height:none!important;overflow:auto!important;padding:2px 5px 12px 2px!important}
#modalProyectosPuestos .pp-item-real,#modalRelevantesBase .pp-item-real{position:relative!important;min-height:190px!important;padding:14px!important;border-radius:16px!important;border:1px solid rgba(56,189,248,.42)!important;background:linear-gradient(145deg,rgba(7,29,68,.97),rgba(2,11,34,.98))!important;box-shadow:0 9px 28px rgba(0,0,0,.2)!important;overflow:hidden!important}
#modalProyectosPuestos .pp-item-real:hover,#modalRelevantesBase .pp-item-real:hover{transform:translateY(-2px)!important;border-color:rgba(56,189,248,.78)!important;box-shadow:0 13px 28px rgba(14,165,233,.13)!important}
#modalProyectosPuestos .pp-item-flex{height:100%!important;gap:14px!important;align-items:flex-start!important}
#modalProyectosPuestos .pp-item-photo,#modalProyectosPuestos .pp-item-photo-fallback{width:124px!important;height:112px!important;border-radius:13px!important;object-fit:cover!important;flex:0 0 124px!important}
#modalProyectosPuestos .pp-item-real header{padding-right:42px!important;margin-bottom:7px!important}
#modalProyectosPuestos .pp-item-real header>div:last-child{position:absolute!important;right:12px!important;top:12px!important;display:flex!important;flex-direction:column!important;gap:7px!important;width:38px!important}
#modalProyectosPuestos .pp-item-real h4,#modalRelevantesBase .pp-item-real h4{font-size:18px!important;line-height:1.1!important;margin:0!important;color:#fff!important}
#modalProyectosPuestos .pp-item-real small,#modalRelevantesBase .pp-item-real small{font-size:11px!important;line-height:1.25!important}
#modalProyectosPuestos .pp-mini-btn{width:38px!important;height:38px!important;padding:0!important;border-radius:9px!important;font-size:0!important;display:grid!important;place-items:center!important}
#modalProyectosPuestos .pp-relevantes-btn{position:relative!important;border-color:rgba(245,158,11,.82)!important;background:linear-gradient(145deg,#a16207,#eab308)!important;color:#111827!important;box-shadow:0 5px 14px rgba(245,158,11,.22)!important}
#modalProyectosPuestos .pp-relevantes-btn:before{content:"👥";font-size:18px!important;filter:saturate(1.25) brightness(1.12)}

#modalProyectosPuestos [data-esm-tooltip]{position:relative!important}
#modalProyectosPuestos [data-esm-tooltip]:hover:after{content:attr(data-esm-tooltip);position:absolute;right:46px;top:50%;transform:translateY(-50%);z-index:80;display:block;padding:6px 9px;border-radius:7px;background:#020617;color:#f8fafc;border:1px solid rgba(148,163,184,.35);font-size:11px!important;font-weight:800!important;line-height:1!important;white-space:nowrap;box-shadow:0 8px 22px rgba(0,0,0,.38);pointer-events:none}
#modalProyectosPuestos .pp-danger:before{content:"🗑";font-size:16px!important}
.esm-project-edit-visual{width:38px!important;height:38px!important;padding:0!important;border-radius:9px!important;border:1px solid rgba(59,130,246,.75)!important;background:linear-gradient(135deg,#2563eb,#1d4ed8)!important;color:#fff!important;display:grid!important;place-items:center!important;font-size:17px!important;cursor:pointer!important;order:-1}
#modalProyectosPuestos .pp-chip-row,#modalRelevantesBase .pp-chip-row{gap:5px!important;margin-top:8px!important}
#modalProyectosPuestos .pp-chip,#modalRelevantesBase .pp-chip{font-size:10px!important;padding:4px 7px!important;border-radius:8px!important}
#modalProyectosPuestos .pp-item-real .nota,#modalRelevantesBase .pp-item-real .nota{font-size:11px!important;margin:7px 0 0!important;line-height:1.25!important}
#modalProyectosPuestos .pp-edit-hint{display:none!important}

/* Relevantes: escudo profesional sin números, datos compactos y acciones laterales. */
#modalRelevantesBase .pp-item-real{min-height:198px!important;padding:14px 58px 14px 176px!important;display:flex!important;flex-direction:column!important;justify-content:center!important}
.esm-relevant-shield{position:absolute;left:7px;top:4px;width:160px;height:190px;border:0!important;border-radius:14px;background:transparent!important;display:grid;place-items:center;box-shadow:none!important;overflow:hidden!important;isolation:isolate}
.esm-relevant-shield-image{position:absolute;inset:0;display:block!important;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;object-fit:contain!important;object-position:center!important;filter:drop-shadow(0 7px 9px rgba(0,0,0,.58));z-index:1}
.esm-relevant-shield-text{position:absolute;z-index:2;left:19%;right:19%;top:25%;bottom:18%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;pointer-events:none;text-transform:uppercase;color:#f8fafc;text-shadow:0 2px 3px #000,0 0 8px rgba(14,165,233,.95);font-family:Inter,Arial,sans-serif;font-weight:1000;line-height:.94;overflow:hidden}
.esm-relevant-shield-name{display:flex;align-items:center;justify-content:center;width:100%;height:46%;padding:0 1px;letter-spacing:.35px;white-space:normal;overflow:hidden;overflow-wrap:anywhere;word-break:normal}
.esm-relevant-shield-number{display:flex;align-items:flex-start;justify-content:center;width:100%;height:46%;padding:1px 0 0;transform:translateY(-12px);font-variant-numeric:tabular-nums;letter-spacing:1px;white-space:nowrap;overflow:hidden}
.esm-relevant-shield-number[hidden]{display:none!important}
.esm-relevant-shield:not(.has-number) .esm-relevant-shield-text{top:24%!important;bottom:18%!important}.esm-relevant-shield:not(.has-number) .esm-relevant-shield-name{height:100%!important;align-items:center!important;justify-content:center!important}
#modalRelevantesBase .pp-item-real header{margin:0 0 8px!important;padding:0!important;display:block!important}
#modalRelevantesBase .pp-item-real header h4{font-size:20px!important}
#modalRelevantesBase .pp-item-real header h4::first-letter{font-size:0}
#modalRelevantesBase .pp-item-real header small{display:none!important}
#modalRelevantesBase .pp-item-real header .pp-danger{position:absolute!important;right:13px!important;bottom:14px!important;width:38px!important;height:38px!important;font-size:0!important;padding:0!important;display:grid!important;place-items:center!important;border-radius:9px!important}
#modalRelevantesBase .pp-item-real header .pp-danger:before{content:"🗑";font-size:16px!important}
#modalRelevantesBase .pp-chip-row{display:flex!important;flex-wrap:wrap!important}
#modalRelevantesBase .pp-chip-row .pp-chip:nth-child(3),#modalRelevantesBase .pp-chip-row .pp-chip:nth-child(4){width:auto!important}
.esm-relevant-edit-visual{position:absolute!important;right:13px!important;top:14px!important;width:38px!important;height:38px!important;border-radius:9px!important;border:1px solid rgba(59,130,246,.7)!important;background:linear-gradient(135deg,#2563eb,#1d4ed8)!important;color:#fff!important;font-size:17px!important;display:grid!important;place-items:center!important;opacity:.55!important;cursor:default!important}
.esm-relevant-edit-visual[title]{pointer-events:none!important}

/* Formularios flotantes conservando campos/botones originales. */
#modalProyectosPuestos .pp-grid-real>.pp-card-real:first-child,#modalRelevantesBase .rel-grid-real>.pp-card-real:first-child{position:absolute!important;z-index:25!important;top:104px!important;right:22px!important;width:min(430px,calc(100% - 44px))!important;max-height:calc(100% - 130px)!important;overflow:auto!important;padding:18px!important;border-radius:18px!important;border:1px solid rgba(56,189,248,.5)!important;background:linear-gradient(155deg,rgba(7,24,57,.995),rgba(2,8,25,.998))!important;box-shadow:0 28px 80px rgba(0,0,0,.66),0 0 0 9999px rgba(1,6,20,.58)!important;transition:opacity .18s ease,transform .18s ease,visibility .18s ease!important}
#modalProyectosPuestos.esm-form-cerrado .pp-grid-real>.pp-card-real:first-child,#modalRelevantesBase.esm-form-cerrado .rel-grid-real>.pp-card-real:first-child{opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translateY(-8px) scale(.985)!important}
.esm-compact-form-close{position:absolute!important;right:12px!important;top:10px!important;width:32px!important;height:32px!important;border-radius:10px!important;border:1px solid rgba(148,163,184,.28)!important;color:#e2e8f0!important;background:rgba(15,23,42,.9)!important;cursor:pointer!important;font-size:18px!important}
#modalProyectosPuestos .pp-form-real,#modalRelevantesBase .pp-form-real{gap:8px!important}
#modalProyectosPuestos .pp-form-real .input-modal,#modalRelevantesBase .pp-form-real .input-modal{min-height:39px!important;padding:8px 10px!important}

@media(max-width:1180px){#modalProyectosPuestos .pp-list-real,#modalRelevantesBase .pp-list-real{grid-template-columns:repeat(2,minmax(290px,1fr))!important}}
@media(max-width:760px){#modalProyectosPuestos #buscarProyectoPuesto,#modalProyectosPuestos #btnRecargarProyectosPuestos,#modalRelevantesBase #buscarRelevanteBase{grid-column:1!important;width:100%!important;min-width:0!important}#modalProyectosPuestos .modal-proyectos-puestos-real,#modalRelevantesBase .modal-relevantes-base-real{width:99vw!important;height:98vh!important;padding:9px!important}#modalProyectosPuestos .usuarios-toolbar,#modalRelevantesBase .usuarios-toolbar{grid-template-columns:1fr!important}#modalProyectosPuestos .esm-compact-new-btn,#modalProyectosPuestos .esm-compact-counter,#modalRelevantesBase .esm-compact-new-btn,#modalRelevantesBase .esm-compact-counter{grid-column:1!important;justify-self:stretch!important;text-align:center!important}#modalProyectosPuestos .pp-list-real,#modalRelevantesBase .pp-list-real{grid-template-columns:1fr!important;height:calc(100% - 140px)!important}#modalProyectosPuestos .pp-grid-real>.pp-card-real:first-child,#modalRelevantesBase .rel-grid-real>.pp-card-real:first-child{top:88px!important;right:10px!important;width:calc(100% - 20px)!important;max-height:calc(100% - 104px)!important}}

/* Conteo visual automático de relevantes por proyecto. */
#modalProyectosPuestos .esm-project-relevant-count{margin-top:9px!important;min-height:52px!important;padding:8px 10px!important;border:1px solid rgba(245,158,11,.46)!important;border-radius:11px!important;background:linear-gradient(135deg,rgba(120,53,15,.22),rgba(15,23,42,.76))!important;display:grid!important;grid-template-columns:30px minmax(0,1fr) auto!important;grid-template-rows:auto auto!important;column-gap:8px!important;align-items:center!important;color:#fff7ed!important}
#modalProyectosPuestos .esm-project-relevant-count-icon{grid-row:1/3!important;font-size:21px!important;line-height:1!important;text-align:center!important}
#modalProyectosPuestos .esm-project-relevant-count-label{font-size:10px!important;line-height:1.15!important;font-weight:850!important;color:#ffedd5!important}
#modalProyectosPuestos .esm-project-relevant-count-number{grid-column:3!important;grid-row:1!important;font-size:23px!important;line-height:1!important;color:#fbbf24!important;text-align:right!important}
#modalProyectosPuestos .esm-project-relevant-count small{grid-column:3!important;grid-row:2!important;font-size:9px!important;color:#fed7aa!important;text-align:right!important}


/* Ajuste visual final solicitado: tarjeta amplia y contador de relevantes con el icono real del módulo. */
#modalProyectosPuestos .pp-list-real{
  grid-template-columns:repeat(2,minmax(520px,1fr))!important;
}
#modalProyectosPuestos .pp-item-real{
  min-height:230px!important;
  padding-bottom:76px!important;
}
#modalProyectosPuestos .esm-project-relevant-count{
  position:absolute!important;
  left:14px!important;
  right:58px!important;
  bottom:14px!important;
  width:auto!important;
  min-height:54px!important;
  margin:0!important;
  padding:8px 12px!important;
  grid-template-columns:34px minmax(0,1fr) auto!important;
  column-gap:10px!important;
}
#modalProyectosPuestos .esm-project-relevant-count-icon{
  font-size:23px!important;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.35))!important;
}
#modalProyectosPuestos .esm-project-relevant-count-label{
  font-size:11px!important;
  white-space:normal!important;
  overflow:visible!important;
}
#modalProyectosPuestos .esm-project-relevant-count-number{
  font-size:25px!important;
  min-width:24px!important;
}
#modalProyectosPuestos .esm-project-relevant-count small{
  font-size:9px!important;
}
@media(max-width:1180px){
  #modalProyectosPuestos .pp-list-real{grid-template-columns:1fr!important}
}
@media(max-width:760px){
  #modalProyectosPuestos .pp-item-real{min-height:250px!important;padding-bottom:78px!important}
  #modalProyectosPuestos .esm-project-relevant-count{left:10px!important;right:52px!important;bottom:10px!important}
}

/* Corrección final solicitada: iconos exactos y contador compacto. */
#modalProyectosPuestos .esm-projects-header-icon{
  width:42px!important;
  height:42px!important;
  flex:0 0 42px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:11px!important;
  border:1px solid rgba(56,189,248,.28)!important;
  background:linear-gradient(145deg,rgba(14,165,233,.16),rgba(15,23,42,.9))!important;
  font-size:27px!important;
  line-height:1!important;
  filter:none!important;
}
#modalProyectosPuestos .pp-list-real{
  grid-template-columns:repeat(3,minmax(300px,1fr))!important;
}
#modalProyectosPuestos .pp-item-real{
  min-height:190px!important;
  padding-bottom:14px!important;
}
#modalProyectosPuestos .esm-project-relevant-count{
  position:static!important;
  width:100%!important;
  max-width:330px!important;
  min-height:42px!important;
  margin:8px 0 0!important;
  padding:5px 8px!important;
  grid-template-columns:27px minmax(0,1fr) auto!important;
  grid-template-rows:1fr 1fr!important;
  column-gap:7px!important;
  border-radius:9px!important;
}
#modalProyectosPuestos .esm-project-relevant-count-icon{
  grid-row:1/3!important;
  font-size:18px!important;
  filter:none!important;
}
#modalProyectosPuestos .esm-project-relevant-count-label{
  grid-column:2!important;
  grid-row:1/3!important;
  align-self:center!important;
  font-size:10px!important;
  line-height:1.08!important;
  white-space:normal!important;
}
#modalProyectosPuestos .esm-project-relevant-count-number{
  grid-column:3!important;
  grid-row:1!important;
  align-self:end!important;
  font-size:19px!important;
  line-height:.9!important;
  min-width:18px!important;
}
#modalProyectosPuestos .esm-project-relevant-count small{
  grid-column:3!important;
  grid-row:2!important;
  align-self:start!important;
  font-size:8px!important;
  line-height:1!important;
}
@media(max-width:1180px){
  #modalProyectosPuestos .pp-list-real{grid-template-columns:repeat(2,minmax(290px,1fr))!important}
}
@media(max-width:760px){
  #modalProyectosPuestos .pp-list-real{grid-template-columns:1fr!important}
  #modalProyectosPuestos .pp-item-real{min-height:190px!important;padding-bottom:14px!important}
  #modalProyectosPuestos .esm-project-relevant-count{position:static!important;width:100%!important;max-width:none!important;margin-top:8px!important}
}

/* Ajuste final solicitado: Base, Marca QR y Relevantes como etiquetas iguales;
   Dirección debajo de la foto, larga y compacta. */
#modalProyectosPuestos .esm-project-relevant-count{display:none!important}
#modalProyectosPuestos .pp-item-real{
  min-height:0!important;
  padding:14px!important;
}
#modalProyectosPuestos .esm-project-info-grid{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  gap:5px!important;
  margin-top:8px!important;
}
#modalProyectosPuestos .esm-project-info-grid .pp-chip{
  display:inline-flex!important;
  align-items:center!important;
  width:auto!important;
  max-width:100%!important;
  margin:0!important;
  font-size:10px!important;
  padding:4px 7px!important;
  border-radius:8px!important;
}
#modalProyectosPuestos .esm-project-info-grid .esm-project-relevant-chip{
  color:inherit!important;
  border-color:rgba(148,163,184,.28)!important;
  background:rgba(15,23,42,.72)!important;
  font-weight:inherit!important;
}
#modalProyectosPuestos .esm-project-address-row{
  display:block!important;
  width:calc(100% - 52px)!important;
  margin:-10px 52px 0 0!important;
}
#modalProyectosPuestos .esm-project-address-chip{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  box-sizing:border-box!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  line-height:1.2!important;
  color:#dbeafe!important;
  border-color:rgba(56,189,248,.32)!important;
  background:rgba(8,31,72,.72)!important;
  font-size:10px!important;
  padding:5px 8px!important;
  border-radius:8px!important;
}
#modalProyectosPuestos .esm-project-original-address-hidden{display:none!important}
@media(max-width:760px){
  #modalProyectosPuestos .esm-project-address-row{
    width:100%!important;
    margin-right:0!important;
  }
}
