/* syn.css — SynerHire · identidad visual sobre Metronic (copiada de flow.css de ITCall Flow)
   Los colores vienen del tenant como variables: --tenant (principal), --tenant-2 (secundario), --tenant-riel (menú). */

/* ===== base ===== */
.syn-fondo{ background:#EEF3FA; }
.tenant-text{ color:var(--tenant); }
.kt-btn-primary{ background:var(--tenant)!important; border-color:var(--tenant)!important; color:#fff!important; }
.kt-btn-primary:hover{ filter:brightness(.94); }
.kt-btn-destructive,.kt-btn-destructive:hover{ background:var(--destructive)!important; border-color:var(--destructive)!important; color:#fff!important; box-shadow:none!important; }
.kt-btn-destructive i{ color:#fff!important; }

/* ===== menú lateral (riel) ===== */
.syn-riel{ background:var(--tenant-riel); color:#C9D6EE; transition:width .2s ease;
  background-image:radial-gradient(120% 60% at 0% 100%, color-mix(in srgb,var(--tenant) 28%,transparent), transparent 70%); }
.syn-riel-cab{ display:flex; align-items:center; gap:.5rem; height:72px; padding:0 1rem 0 1.15rem; flex-shrink:0; }
.syn-logo{ display:flex; align-items:center; gap:.55rem; min-width:0; flex-grow:1; text-decoration:none; }
.syn-logo-img{ height:30px; width:auto; }
.syn-logo-iso{ display:none; height:32px; width:auto; }
.syn-logo-txt{ font-weight:700; font-size:.95rem; letter-spacing:.02em; color:#fff;
  padding:.12rem .5rem; border-radius:999px; background:linear-gradient(90deg,var(--tenant),var(--tenant-2)); }
.syn-colapsar{ color:#8EA3C7; font-size:1.1rem; flex-shrink:0; }
.syn-colapsar:hover{ color:#fff; }

.syn-cliente{ display:flex; align-items:center; gap:.55rem; margin:0 .9rem .6rem; padding:.55rem .7rem;
  border-radius:.6rem; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.08);
  color:#E7EEFB; font-size:.8rem; font-weight:600; min-width:0; }
.syn-punto{ width:.55rem; height:.55rem; border-radius:999px; background:var(--tenant-2); flex-shrink:0;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--tenant-2) 30%,transparent); }

.syn-menu{ display:flex; flex-direction:column; gap:2px; padding:.4rem .7rem; }
.syn-lnk{ position:relative; display:flex; align-items:center; gap:.7rem; padding:.62rem .8rem; border-radius:.55rem;
  color:#C9D6EE; font-size:.875rem; font-weight:500; text-decoration:none; transition:background .15s,color .15s; }
.syn-lnk i{ font-size:1.15rem; color:#8EA3C7; transition:color .15s; }
.syn-lnk:hover{ background:rgba(255,255,255,.07); color:#fff; }
.syn-lnk:hover i{ color:#fff; }
.syn-lnk.syn-activo{ background:linear-gradient(90deg,color-mix(in srgb,var(--tenant) 38%,transparent),color-mix(in srgb,var(--tenant) 10%,transparent));
  color:#fff; font-weight:600; }
.syn-lnk.syn-activo i{ color:var(--tenant-2); }
.syn-lnk.syn-activo::before{ content:""; position:absolute; left:-.7rem; top:22%; bottom:22%; width:3px; border-radius:0 3px 3px 0; background:var(--tenant-2); }

.syn-riel-pie{ position:relative; border-top:1px solid rgba(255,255,255,.08); padding:.7rem .9rem; flex-shrink:0; }
.syn-perfil{ display:flex; align-items:center; gap:.6rem; width:100%; text-align:start; padding:.35rem; border-radius:.55rem; color:#E7EEFB; }
.syn-perfil:hover{ background:rgba(255,255,255,.07); }
.syn-avatar{ width:2.1rem; height:2.1rem; border-radius:999px; display:grid; place-items:center; flex-shrink:0;
  background:linear-gradient(135deg,var(--tenant),var(--tenant-2)); color:#fff; font-weight:700; font-size:.85rem; }
.syn-perfil-txt{ display:flex; flex-direction:column; min-width:0; flex-grow:1; line-height:1.2; }
.syn-perfil-txt b{ font-size:.82rem; font-weight:600; }
.syn-perfil-txt small{ font-size:.72rem; color:#8EA3C7; }
i.syn-perfil-txt{ flex-grow:0; font-size:.7rem; color:#8EA3C7; }
.syn-perfil-menu{ position:absolute; left:.9rem; right:.9rem; bottom:4.4rem; z-index:80; background:#fff; color:#0B1B4D;
  border:1px solid #DCE5F2; border-radius:.6rem; box-shadow:0 18px 40px -12px rgba(3,31,83,.35); padding:.3rem; font-size:.85rem; }
.syn-perfil-menu a{ display:flex; align-items:center; gap:.55rem; padding:.55rem .7rem; border-radius:.45rem; color:var(--destructive); }
.syn-perfil-menu a:hover{ background:#F3F6FB; }

/* colapsado: solo íconos */
@media (min-width:1024px){
  #sidebar.mini{ width:76px!important; }
  body:has(#sidebar.mini) #contenido{ margin-inline-start:76px; }
}
#sidebar.mini .syn-logo-img, #sidebar.mini .syn-logo-txt, #sidebar.mini .syn-colapsar,
#sidebar.mini .syn-cliente, #sidebar.mini .syn-lnk span, #sidebar.mini .syn-perfil-txt{ display:none; }
#sidebar.mini .syn-logo-iso{ display:block; }
#sidebar.mini .syn-riel-cab{ justify-content:center; padding:0; }
#sidebar.mini .syn-logo{ flex-grow:0; cursor:pointer; }
#sidebar.mini .syn-lnk{ justify-content:center; padding-inline:0; }
#sidebar.mini .syn-perfil{ justify-content:center; }

/* ===== piezas comunes de las pantallas ===== */
.syn-cabecera{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:1rem; }
.syn-eyebrow{ font-size:.7rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--tenant); }
.syn-kpi{ border:1px solid var(--border); border-radius:.8rem; padding:1rem 1.1rem; background:#fff; position:relative; overflow:hidden; }
.syn-kpi::after{ content:""; position:absolute; left:0; right:0; top:0; height:3px; background:linear-gradient(90deg,var(--tenant),var(--tenant-2)); opacity:.85; }
.syn-kpi-et{ display:flex; align-items:center; gap:.4rem; font-size:.75rem; color:var(--muted-foreground); }
.syn-kpi-val{ font-size:1.65rem; font-weight:700; color:#0B1B4D; letter-spacing:-.02em; margin-top:.15rem; font-variant-numeric:tabular-nums; }
.syn-kpi-sub{ font-size:.72rem; color:var(--muted-foreground); }
.syn-panel{ border:1px solid var(--border); border-radius:.8rem; background:#fff; }
.syn-panel-cab{ display:flex; align-items:center; justify-content:space-between; gap:.75rem; padding:.9rem 1.1rem; border-bottom:1px solid var(--border); }
.syn-panel-cab h2{ font-size:.9rem; font-weight:600; color:#0B1B4D; }
.syn-vacio{ padding:2rem 1rem; text-align:center; color:var(--muted-foreground); font-size:.85rem; }
.syn-vacio i{ display:block; font-size:1.8rem; color:#B7C6DE; margin-bottom:.4rem; }
.syn-estado{ display:inline-flex; align-items:center; gap:.35rem; font-size:.72rem; font-weight:600; padding:.18rem .55rem; border-radius:999px; }
.syn-estado::before{ content:""; width:.45rem; height:.45rem; border-radius:999px; background:currentColor; }
.syn-estado.ok{ color:#0E9454; background:#E8F7EF; }
.syn-estado.warn{ color:#B26A00; background:#FFF4E0; }
.syn-estado.off{ color:#5D6D8A; background:#EEF2F8; }
.syn-estado.vivo::before{ animation:synPulso 1.6s ease-in-out infinite; }
@keyframes synPulso{ 0%,100%{ opacity:1 } 50%{ opacity:.3 } }

/* embudo */
.syn-embudo{ display:flex; flex-direction:column; gap:.55rem; padding:1rem 1.1rem 1.2rem; }
.syn-emb-fila{ display:grid; grid-template-columns:9.5rem 1fr 3.5rem; align-items:center; gap:.75rem; font-size:.8rem; }
.syn-emb-fila span:first-child{ color:var(--secondary-foreground); }
.syn-emb-barra{ height:.85rem; border-radius:.3rem; background:#EEF3FA; overflow:hidden; }
.syn-emb-barra i{ display:block; height:100%; border-radius:.3rem; background:linear-gradient(90deg,var(--tenant-2),var(--tenant)); transition:width .6s ease; }
.syn-emb-fila b{ text-align:right; font-variant-numeric:tabular-nums; color:#0B1B4D; }

.syn-perfil-menu a.syn-perfil-cuenta{ color:#0B1B4D; }

/* ===== submenús ===== */
.syn-grupo-cab{ width:100%; text-align:start; }
.syn-grupo-cab .syn-chev{ margin-inline-start:auto; font-size:.65rem!important; transition:transform .2s; }
.syn-grupo.abierto .syn-chev{ transform:rotate(180deg); }
.syn-grupo-cab.syn-en-grupo{ color:#fff; } .syn-grupo-cab.syn-en-grupo > i:first-child{ color:var(--tenant-2); }
.syn-grupo-cuerpo{ display:none; flex-direction:column; gap:1px; margin:2px 0 4px; padding-inline-start:1.55rem; position:relative; }
.syn-grupo-cuerpo::before{ content:""; position:absolute; left:1.15rem; top:4px; bottom:4px; width:1px; background:rgba(255,255,255,.12); }
.syn-grupo.abierto .syn-grupo-cuerpo{ display:flex; }
.syn-sub{ position:relative; display:flex; align-items:center; gap:.6rem; padding:.48rem .7rem; border-radius:.5rem; color:#A9BBDA; font-size:.82rem; text-decoration:none; }
.syn-sub i{ font-size:.95rem; color:#7F95BC; }
.syn-sub:hover{ background:rgba(255,255,255,.07); color:#fff; }
.syn-sub.syn-activo{ background:color-mix(in srgb,var(--tenant) 30%,transparent); color:#fff; font-weight:600; }
.syn-sub.syn-activo i{ color:var(--tenant-2); }
#sidebar.mini .syn-grupo-cuerpo, #sidebar.mini .syn-chev{ display:none!important; }

/* ===== propio de SynerHire ===== */
.syn-fondo{ background:#EEF3FC; }
.syn-logo-img{ height:28px; }
.syn-etq-int{ font-size:.62rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; padding:.1rem .45rem; border-radius:999px;
  background:color-mix(in srgb,var(--tenant-2) 22%,transparent); color:var(--tenant-2); flex-shrink:0; }
/* primeros pasos de la empresa */
.syn-paso{ width:2rem; height:2rem; border-radius:999px; display:grid; place-items:center; flex-shrink:0; font-size:.85rem; font-weight:700;
  border:2px solid #C9D6EE; color:#55607A; }
.syn-paso.hecho{ border-color:var(--tenant); background:var(--tenant); color:#fff; }
/* ===== piezas de la fase 1: perfiles, vacantes, empresa ===== */
.syn-tarjeta{ transition:box-shadow .2s, transform .2s; }
.syn-tarjeta:hover{ box-shadow:0 16px 34px -22px rgba(11,27,77,.5); transform:translateY(-2px); }
.syn-2lineas{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.syn-chip{ display:inline-flex; align-items:center; gap:.3rem; font-size:.72rem; font-weight:700; padding:.18rem .6rem; border-radius:999px; background:#ECEFF4; color:#47526A; white-space:nowrap; }
.syn-chip-marino{ background:#E6E9F2; color:#0B1B4D; } .syn-chip-azul{ background:#E3ECFF; color:#1D4FCB; }
.syn-chip-verde{ background:#E8F7EF; color:#0E6B3E; } .syn-chip-ambar{ background:#FEF0DC; color:#8A4B00; }
.syn-chip-vale{ background:#0B1B4D; color:#fff; }
.syn-dona{ border-radius:999px; display:grid; place-items:center; flex:none; }
.syn-dona > div{ border-radius:999px; background:#fff; display:grid; place-items:center; }
.syn-dona b{ font-size:1rem; font-weight:700; color:#0B1B4D; }
.syn-ley{ display:grid; grid-template-columns:.7rem minmax(0,1fr) auto; gap:.5rem; align-items:center; font-size:.8rem; color:#2A3350; }
.syn-ley i{ width:.7rem; height:.7rem; border-radius:3px; display:block; } .syn-ley b{ color:#0B1B4D; font-variant-numeric:tabular-nums; }
.syn-vacio-grande{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:.6rem; padding:2.5rem 1.5rem; }
.syn-vacio-grande > i{ font-size:2.4rem; color:var(--tenant); } .syn-vacio-grande b{ font-size:1rem; color:#0B1B4D; }
.syn-vacio-grande span{ font-size:.875rem; color:var(--secondary-foreground); max-width:44ch; }
.syn-agregar{ display:flex; flex-wrap:wrap; align-items:center; gap:.4rem; padding:.7rem; border:1.5px dashed #C9D3E6; border-radius:.8rem; }
.syn-agregar > span{ font-size:.82rem; font-weight:600; color:#0B1B4D; margin-right:.2rem; }
.syn-chip-btn{ font-size:.78rem; font-weight:600; padding:.35rem .75rem; border-radius:999px; background:#EEF3FC; color:var(--tenant); }
.syn-chip-btn:hover{ background:var(--tenant); color:#fff; }
.syn-preg{ display:flex; flex-direction:column; gap:.6rem; padding:.85rem .95rem; border:1px solid #E3E8F2; border-left:4px solid #B7C6DE; border-radius:.75rem; background:#fff; }
.syn-preg-obligatoria{ border-left-color:#0B1B4D; } .syn-preg-deseable{ border-left-color:var(--tenant); } .syn-preg-informativa{ border-left-color:#C9D3E6; }
.syn-preg-num{ width:1.6rem; height:1.6rem; border-radius:999px; display:grid; place-items:center; flex:none; font-size:.75rem; font-weight:700; background:#EEF3FC; color:#0B1B4D; }
.syn-regla{ display:flex; align-items:center; gap:.5rem; font-size:.8rem; color:#2A3350; }
.syn-regla input[type=range]{ accent-color:var(--tenant); width:9rem; }
.syn-op{ display:inline-flex; align-items:center; gap:.3rem; padding:.2rem .55rem; border-radius:.45rem; background:#F5F8FD; font-size:.78rem; }
.syn-perm{ display:flex; gap:.6rem; align-items:flex-start; padding:.6rem .75rem; border-radius:.6rem; background:#F5F8FD; }
.syn-perm i{ color:#0E6B3E; font-size:1rem; margin-top:.1rem; } .syn-perm b{ display:block; font-size:.8rem; color:#0B1B4D; } .syn-perm span{ font-size:.75rem; color:#55607A; }
.syn-wa{ background:var(--tenant-riel); border-radius:1.2rem; padding:.8rem; display:flex; flex-direction:column; gap:.6rem; }
.syn-wa-cab{ display:flex; align-items:center; gap:.6rem; color:#fff; padding:.2rem .3rem; }
.syn-wa-cab b{ display:block; font-size:.82rem; } .syn-wa-cab small{ display:block; font-size:.7rem; color:#A9BBDA; }
.syn-wa-av{ width:2rem; height:2rem; border-radius:999px; display:grid; place-items:center; font-weight:800; font-style:italic; background:linear-gradient(135deg,var(--tenant),var(--tenant-2)); }
.syn-wa-chat{ background:#EAF0FB; border-radius:.9rem; padding:.75rem; display:flex; flex-direction:column; gap:.5rem; min-height:9rem; }
.syn-wa-chat p{ margin:0; max-width:86%; padding:.5rem .75rem; font-size:.8rem; line-height:1.4; border-radius:.75rem; }
.syn-wa-chat p.ia{ align-self:flex-start; background:#fff; border-top-left-radius:.2rem; } .syn-wa-chat p.yo{ align-self:flex-end; background:var(--tenant); color:#fff; border-top-right-radius:.2rem; }
.syn-wa-chat p small{ display:block; margin-top:.25rem; font-size:.7rem; color:#55607A; }
.syn-filtro{ font-size:.8rem; font-weight:600; padding:.4rem .9rem; border-radius:999px; background:#fff; border:1px solid #DCE2EE; color:#0B1B4D; }
.syn-filtro.on{ background:#0B1B4D; border-color:#0B1B4D; color:#fff; }
.syn-titulo-btn{ font-size:1rem; font-weight:700; color:#0B1B4D; text-align:start; }
.syn-titulo-btn:hover{ color:var(--tenant); text-decoration:underline; }
.syn-barra{ height:.5rem; border-radius:999px; background:#EEF3FC; overflow:hidden; }
.syn-barra i{ display:block; height:100%; border-radius:999px; background:var(--tenant); }
.syn-mini{ background:#F5F8FD; border-radius:.6rem; padding:.5rem .25rem; }
.syn-mini b{ display:block; font-size:1.1rem; color:#0B1B4D; font-variant-numeric:tabular-nums; } .syn-mini span{ font-size:.68rem; color:#55607A; }
.syn-txt-verde{ color:#0E6B3E; } .syn-txt-ambar{ color:#8A4B00; } .syn-txt-rojo{ color:#B42318; }
.syn-comision{ background:var(--tenant-riel); color:#fff; border-radius:.8rem; padding:1rem 1.1rem; display:flex; flex-direction:column; gap:.2rem; }
.syn-comision > span{ font-size:.75rem; color:#A9BBDA; } .syn-comision > b{ font-size:1.6rem; font-weight:700; font-variant-numeric:tabular-nums; }
.syn-comision small{ font-size:.75rem; color:#C9D6EE; }
.syn-comision-grande{ padding:1.3rem; gap:.35rem; } .syn-comision-grande > b{ font-size:2.2rem; }
.syn-comision-total{ margin-top:.4rem; padding:.55rem .7rem; border-radius:.55rem; background:rgba(255,255,255,.08); font-size:.8rem; color:#E7EEFB; }
.syn-segmento{ display:inline-flex; flex-wrap:wrap; gap:.35rem; }
.syn-segmento label{ cursor:pointer; } .syn-segmento input{ position:absolute; opacity:0; pointer-events:none; }
.syn-segmento span{ display:inline-block; padding:.45rem .95rem; border-radius:.55rem; border:1px solid #DCE2EE; font-size:.85rem; font-weight:500; color:#2A3350; background:#fff; }
.syn-segmento input:checked + span{ background:#0B1B4D; border-color:#0B1B4D; color:#fff; font-weight:600; }
.syn-segmento input:focus-visible + span{ outline:2px solid var(--tenant); outline-offset:2px; }
.syn-err{ font-size:.75rem; color:var(--destructive); min-height:0; } .syn-err:empty{ display:none; }
.syn-vista-cand{ background:#fff; border:1px solid #DCE2EE; border-radius:1rem; padding:.9rem; display:flex; flex-direction:column; gap:.6rem; }
.syn-vista-cand b{ display:block; font-size:.92rem; color:#0B1B4D; } .syn-vista-cand .min-w-0 > span{ font-size:.72rem; color:#55607A; }
.syn-vista-ini{ width:2.4rem; height:2.4rem; border-radius:.7rem; display:grid; place-items:center; flex:none; font-weight:800; font-size:.8rem; background:#E3ECFF; color:#1D4FCB; }
.syn-vista-dato{ font-size:.75rem; padding:.25rem .55rem; border-radius:.45rem; background:#F5F8FD; color:#2A3350; } .syn-vista-dato.fuerte{ font-weight:700; color:#0B1B4D; }
.syn-aviso-azul{ display:flex; gap:.6rem; align-items:flex-start; padding:.75rem .9rem; border-radius:.65rem; background:#EEF3FC; color:#1D3A8A; font-size:.82rem; }
.syn-aviso-azul i{ font-size:1.1rem; margin-top:.05rem; }
.syn-paso-mini{ width:1.2rem; height:1.2rem; border-radius:999px; display:grid; place-items:center; flex:none; border:2px solid #C9D6EE; font-size:.65rem; color:#fff; }
.syn-paso-mini.hecho{ background:#16A34A; border-color:#16A34A; }
/* cola de prioridad (equipo interno) */
.syn-col{ background:#F5F8FD; border:1px solid #E3E8F2; border-radius:.9rem; padding:.75rem; display:flex; flex-direction:column; gap:.75rem; border-top:4px solid #C9D3E6; }
.syn-col-alta{ border-top-color:#D97706; } .syn-col-media{ border-top-color:var(--tenant); } .syn-col-baja{ border-top-color:#A7B1C0; }
.syn-col-cab{ display:flex; justify-content:space-between; align-items:center; padding:.1rem .2rem; }
.syn-col-cab b{ font-size:.85rem; color:#0B1B4D; } .syn-col-cab span{ font-size:.75rem; font-weight:700; padding:.1rem .55rem; border-radius:999px; background:#fff; color:#0B1B4D; }
/* gráficas de los reportes: barras finas, punta redonda de 4px anclada a la base, 2px de separación, rejilla tenue */
.syn-graf{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:.5rem; }
.syn-graf-eje{ height:var(--alto); display:flex; flex-direction:column; justify-content:space-between; font-size:.68rem; color:#6B7588; text-align:right; font-variant-numeric:tabular-nums; }
.syn-graf-area{ position:relative; }
.syn-graf-rejilla{ position:absolute; left:0; right:0; top:0; height:var(--alto); display:flex; flex-direction:column; justify-content:space-between; pointer-events:none; }
.syn-graf-rejilla i{ display:block; border-top:1px solid #EEF1F6; } .syn-graf-rejilla i:last-child{ border-top-color:#C9D3E6; }
.syn-graf-barras{ position:relative; display:flex; gap:2px; align-items:flex-end; }
.syn-graf-col{ flex:1 1 0; min-width:0; display:flex; flex-direction:column; align-items:stretch; outline:none; }
.syn-graf-col::before{ content:""; height:var(--alto); display:block; order:0; position:absolute; }
.syn-graf-pila{ align-self:stretch; display:flex; flex-direction:column-reverse; gap:2px; margin-top:auto; border-radius:4px 4px 0 0; overflow:hidden; }
.syn-graf-col{ height:calc(var(--alto) + 1.1rem); justify-content:flex-end; }
.syn-graf-pila i{ display:block; min-height:2px; }
.syn-graf-col:hover .syn-graf-pila, .syn-graf-col:focus-visible .syn-graf-pila{ filter:brightness(1.12); }
.syn-graf-col:focus-visible{ box-shadow:0 0 0 2px var(--tenant); border-radius:4px; }
.syn-graf-x{ height:1.1rem; font-size:.62rem; color:#6B7588; text-align:center; white-space:nowrap; overflow:visible; line-height:1.1rem; }
.syn-ley-mini{ display:inline-flex; align-items:center; gap:.35rem; color:#47526A; } .syn-ley-mini i{ width:.6rem; height:.6rem; border-radius:2px; display:inline-block; }
.syn-tip{ position:fixed; z-index:90; pointer-events:none; background:#0B1B4D; color:#fff; font-size:.75rem; font-weight:500; padding:.35rem .6rem; border-radius:.45rem; box-shadow:0 10px 24px -10px rgba(0,0,0,.5); max-width:18rem; }
.syn-datos{ margin-top:.75rem; } .syn-datos summary{ cursor:pointer; font-size:.75rem; color:var(--tenant); font-weight:600; }
.syn-datos .kt-table-wrapper{ max-height:14rem; overflow:auto; margin-top:.5rem; }
.syn-av-mini{ width:2rem; height:2rem; border-radius:999px; display:grid; place-items:center; flex:none; font-size:.8rem; font-weight:700; color:#fff; background:linear-gradient(135deg,var(--tenant),var(--tenant-2)); }
/* imagen de la vacante */
.syn-img-campo{ display:grid; grid-template-columns:11rem minmax(0,1fr); gap:1rem; align-items:start; }
@media (max-width:640px){ .syn-img-campo{ grid-template-columns:1fr; } }
.syn-img-prev{ aspect-ratio:16/9; border-radius:.7rem; border:1.5px dashed #C9D3E6; background:#F5F8FD; display:grid; place-items:center; overflow:hidden; color:#A7B1C0; font-size:1.8rem; }
.syn-img-prev img, .syn-vista-img, .syn-tarjeta-img, .syn-detalle-img{ display:block; width:100%; aspect-ratio:16/9; object-fit:cover; }
.syn-vista-img{ border-radius:.7rem; } .syn-tarjeta-img{ border-radius:.6rem; } .syn-detalle-img{ border-radius:1rem; max-height:280px; }
.sr-only{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* ===== bolsa de vacantes (pública, candidatos) ===== */
.bol-ancho{ max-width:72rem; margin:0 auto; padding-left:max(1rem, env(safe-area-inset-left,0px)); padding-right:max(1rem, env(safe-area-inset-right,0px)); }
.bol-cab{ background:radial-gradient(60% 120% at 90% 0%, color-mix(in srgb,var(--tenant) 55%,transparent), transparent 70%), var(--tenant-riel); padding-block:1.4rem 1.6rem; color:#fff; }
.bol-titulo{ font-size:clamp(1.6rem,5vw,2.2rem); font-weight:800; font-style:italic; line-height:1.1; letter-spacing:-.02em; }
.bol-busca{ display:flex; flex-wrap:wrap; gap:.5rem; }
.bol-campo{ display:flex; align-items:center; gap:.5rem; background:#fff; border-radius:.7rem; padding:0 .8rem; min-height:2.75rem; min-width:14rem; color:#55607A; }
.bol-campo input{ border:0; outline:0; background:transparent; font:inherit; font-size:.92rem; color:#121A33; flex:1; min-width:0; }
.bol-sel{ min-height:2.75rem; width:auto; min-width:10rem; }
.bol-tarjeta{ background:#fff; border:1px solid #DCE2EE; border-radius:1rem; overflow:hidden; transition:box-shadow .2s, transform .2s; }
.bol-tarjeta:hover{ box-shadow:0 18px 36px -22px rgba(11,27,77,.55); transform:translateY(-2px); }
.bol-tarjeta-btn{ display:block; width:100%; text-align:start; }
.bol-tarjeta-btn:focus-visible{ outline:3px solid var(--tenant); outline-offset:-3px; border-radius:1rem; }
.bol-img, .bol-hoja-img{ display:block; width:100%; aspect-ratio:16/9; object-fit:cover; background:#EEF3FC; }
.bol-sin-img{ display:grid; place-items:center; font-size:2.4rem; color:#fff; background:linear-gradient(135deg, var(--tenant-riel), var(--tenant) 60%, var(--tenant-2)); }
.bol-puesto{ display:block; font-size:1.05rem; font-weight:700; color:#0B1B4D; line-height:1.25; }
.bol-empresa{ display:inline-flex; align-items:center; gap:.3rem; font-size:.75rem; color:#0E6B3E; margin-top:.15rem; }
.bol-ir{ color:var(--tenant); font-weight:600; display:inline-flex; align-items:center; gap:.25rem; }
.bol-recomienda{ background:var(--tenant-riel); color:#fff; border-radius:1rem; padding:1rem 1.2rem; display:flex; flex-direction:column; gap:.2rem; }
.bol-recomienda span{ font-size:.82rem; color:#C9D6EE; }
.bol-velo{ position:fixed; inset:0; background:rgba(7,18,58,.55); z-index:60; }
.bol-hoja{ position:fixed; z-index:61; background:#fff; overflow:auto; box-shadow:0 30px 80px -30px rgba(0,0,0,.6);
  left:0; right:0; bottom:0; max-height:92vh; border-radius:1.2rem 1.2rem 0 0; padding-bottom:env(safe-area-inset-bottom,0px); }
@media (min-width:768px){ .bol-hoja{ left:50%; right:auto; bottom:auto; top:4vh; transform:translateX(-50%); width:min(40rem,94vw); max-height:92vh; border-radius:1.2rem; } }
.bol-hoja-cab{ position:sticky; top:0; display:flex; justify-content:flex-end; padding:.5rem; background:linear-gradient(#fff, rgba(255,255,255,0)); z-index:2; margin-bottom:-3.25rem; }
.bol-hoja-cab .kt-btn{ background:#fff; box-shadow:0 4px 14px -6px rgba(0,0,0,.4); }
.bol-trampa{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.bol-listo{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:.5rem; padding:1.4rem 1rem; border-radius:1rem; background:#E8F7EF; color:#0E6B3E; }
.bol-listo i{ font-size:2.4rem; } .bol-listo b{ font-size:1.05rem; } .bol-listo span{ font-size:.85rem; color:#1F5B3A; }
.syn-mini.text-start span{ display:block; } .syn-mini.text-start b{ font-size:1.1rem; }
/* barra superior en celular (el riel se oculta bajo 1024px) */
.syn-movil{ display:none; }
@media (max-width:1023.98px){ .syn-movil{ display:flex; } }
.syn-movil{ align-items:center; justify-content:space-between; gap:.75rem; padding:.7rem 1rem; background:var(--tenant-riel); color:#fff; position:sticky; top:0; z-index:30; }
.syn-movil-menu{ position:relative; }
.syn-movil-menu summary{ list-style:none; cursor:pointer; font-size:1.4rem; color:#fff; }
.syn-movil-menu summary::-webkit-details-marker{ display:none; }
.syn-movil-menu nav{ position:absolute; right:0; top:2.2rem; min-width:13rem; background:#fff; border:1px solid #DCE5F2; border-radius:.6rem; box-shadow:0 18px 40px -12px rgba(11,27,77,.35); padding:.3rem; display:flex; flex-direction:column; }
.syn-movil-menu nav a{ padding:.55rem .7rem; border-radius:.45rem; color:#0B1B4D; font-size:.88rem; }
.syn-movil-menu nav a:hover{ background:#F3F6FB; }

/* Bolsa · cuestionario del candidato (una pregunta por pantalla) */
.bol-prog{ height:.4rem; border-radius:999px; background:#E3E8F2; overflow:hidden; }
.bol-prog > div{ height:100%; border-radius:999px; background:linear-gradient(90deg, var(--tenant), var(--tenant-2)); transition:width .3s; }
.bol-pregunta{ font-size:1.15rem; font-weight:700; color:#0B1B4D; line-height:1.3; }
.bol-opc{ display:block; width:100%; text-align:start; padding:.85rem 1rem; border-radius:.75rem; border:1.5px solid #DCE2EE; background:#fff; font-size:.95rem; font-weight:600; color:#0B1B4D; transition:border-color .15s, background .15s; }
.bol-opc:hover{ border-color:var(--tenant); background:#F5F8FD; }
.bol-opc.on{ border-color:var(--tenant); background:#EEF3FC; }
.bol-opc:focus-visible{ outline:3px solid var(--tenant); outline-offset:2px; }
.bol-num{ display:flex; align-items:center; gap:.6rem; } .bol-num .kt-input{ font-size:1.2rem; max-width:10rem; } .bol-num span{ color:#55607A; font-size:.9rem; }
.bol-vista{ display:flex; flex-direction:column; gap:.5rem; padding:.9rem 1rem; border-radius:.8rem; background:#F5F8FD; border:1px solid #DCE2EE; font-size:.85rem; color:#2A3350; }
.bol-vista ul, .bol-resumen{ display:flex; flex-direction:column; gap:.35rem; }
.bol-vista li, .bol-resumen li{ display:flex; justify-content:space-between; gap:1rem; } .bol-vista li span, .bol-resumen li span{ color:#55607A; }
.bol-vista li b, .bol-resumen li b{ color:#0B1B4D; text-align:end; } .bol-vista p{ white-space:pre-line; max-height:9rem; overflow:auto; }
.bol-resumen{ font-size:.85rem; } .bol-resumen li{ padding:.45rem 0; border-bottom:1px solid #EEF1F6; } .bol-resumen li span{ flex:1 1 0; min-width:0; } .bol-resumen li b{ flex:0 1 auto; max-width:55%; overflow-wrap:break-word; }

/* Filtro y candidatos · ficha */
.syn-chip-rojo{ background:#FDE3E0; color:#B42318; }
.fil-sel{ outline:2px solid var(--tenant); outline-offset:-2px; }
.fil-marca{ display:inline-grid; place-items:center; min-width:1.35rem; height:1.35rem; padding:0 .25rem; border-radius:999px; font-size:.65rem; font-weight:700; flex:none; }
.fil-marca.ok{ background:#16A34A; color:#fff; } .fil-marca.no{ background:#DC2626; color:#fff; } .fil-marca.med{ background:#FEF0DC; color:#8A4B00; } .fil-marca.off{ background:#EEF2F8; color:#5D6D8A; }
.fil-preg{ display:flex; flex-direction:column; gap:.4rem; padding:.75rem .9rem; border-radius:.7rem; border:1px solid #E3E8F2; background:#FBFCFE; }
.fil-cita{ display:block; font-size:.85rem; font-style:italic; color:#2A3350; background:#fff; border-left:3px solid #C9D6EE; padding:.45rem .7rem; border-radius:.4rem; }
.fil-cita::before, .fil-cita::after{ content:'"'; }
/* Candidatos · ficha de la empresa */
.can-bloque{ display:flex; flex-direction:column; gap:.5rem; padding:.85rem 1rem; border-radius:.8rem; border:1px solid #E3E8F2; border-left-width:4px; background:#FBFCFE; }
.can-bloque h3{ font-size:.85rem; font-weight:700; color:#0B1B4D; }
.can-bloque ul{ display:flex; flex-direction:column; gap:.45rem; }
.can-bloque li{ display:flex; flex-direction:column; gap:.15rem; font-size:.85rem; } .can-bloque li > span{ color:#55607A; font-size:.78rem; } .can-bloque li > b{ color:#0B1B4D; }
.can-ok{ border-left-color:#94A3B8; } .can-fuerte{ border-left-color:#16A34A; } .can-revisar{ border-left-color:#F59E0B; background:#FFFBF2; } .can-nota{ border-left-color:var(--tenant); }
.can-ent{ display:flex; align-items:center; gap:.75rem; padding:.7rem .85rem; border-radius:.7rem; background:#0B1B4D; color:#fff; flex-wrap:wrap; }
.can-ent b, .can-ent .text-mono{ color:#fff; } .can-ent .text-secondary-foreground{ color:#C9D6EE; } .can-ent i{ color:var(--tenant-2); }
.can-form{ display:flex; flex-direction:column; gap:.8rem; padding:1rem; border-radius:.8rem; border:1px dashed #C9D6EE; background:#F5F8FD; }
/* Lado del candidato (empleos.synerhire.com.mx): barra, landing, completar perfil y «Mi cuenta» */
.cand-barra{ background:var(--tenant-riel); padding-block:.7rem; position:sticky; top:0; z-index:20; box-shadow:0 6px 18px -12px rgba(0,0,0,.5); }
.cand-lnk{ display:inline-flex; align-items:center; gap:.35rem; padding:.4rem .7rem; border-radius:.55rem; color:#DCE6FA; font-size:.85rem; font-weight:500; }
.cand-lnk:hover{ background:rgba(255,255,255,.1); color:#fff; } .cand-lnk i{ color:var(--tenant-2); }
.epl-hero{ background:radial-gradient(70% 90% at 85% 10%, color-mix(in srgb,var(--tenant) 60%,transparent), transparent 70%),
  radial-gradient(50% 60% at 10% 90%, color-mix(in srgb,var(--tenant-2) 22%,transparent), transparent 70%), var(--tenant-riel); color:#fff; }
.epl-eyebrow{ font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; font-weight:700; color:var(--tenant-2); }
.epl-eyebrow-osc{ color:var(--tenant); }
.epl-titulo{ font-size:clamp(1.9rem,6vw,3.1rem); font-weight:800; font-style:italic; line-height:1.05; letter-spacing:-.02em; }
.epl-sub{ color:#C9D6EE; font-size:1rem; line-height:1.55; max-width:34rem; }
.epl-confianza{ display:flex; flex-wrap:wrap; gap:.5rem; } .epl-confianza li{ display:inline-flex; align-items:center; gap:.35rem; padding:.35rem .75rem; border-radius:999px; background:rgba(255,255,255,.1); font-size:.82rem; color:#EAF1FF; }
.epl-confianza i{ color:var(--tenant-2); }
.epl-tarjeta{ background:#fff; color:#121A33; border-radius:1.1rem; overflow:hidden; box-shadow:0 30px 60px -30px rgba(0,0,0,.65); }
.epl-vac{ border-bottom:1px solid #E3E8F2; } .epl-vac-img{ display:block; width:100%; aspect-ratio:16/7; object-fit:cover; }
.epl-paso{ display:flex; gap:.9rem; padding:1.1rem; border-radius:1rem; background:#fff; border:1px solid #DCE2EE; }
.epl-paso b{ display:grid; place-items:center; width:2.2rem; height:2.2rem; border-radius:.7rem; flex:none; color:#fff; font-weight:800; font-style:italic; background:linear-gradient(135deg,var(--tenant),var(--tenant-2)); }
.epl-paso h2{ font-weight:700; color:#0B1B4D; } .epl-paso p{ font-size:.85rem; color:#55607A; }
.epl-listo{ display:flex; flex-direction:column; align-items:stretch; gap:.8rem; padding:1.6rem 1.4rem; text-align:center; }
.epl-listo > i{ font-size:2.8rem; color:#16A34A; align-self:center; } .epl-listo h2{ font-size:1.35rem; font-weight:800; color:#0B1B4D; } .epl-listo p{ font-size:.92rem; color:#2A3350; }
.cmp-pasos{ display:grid; grid-template-columns:repeat(3,1fr); gap:.5rem; }
.cmp-pasos li{ display:flex; align-items:center; gap:.5rem; padding:.6rem .7rem; border-radius:.7rem; background:#fff; border:1px solid #DCE2EE; font-size:.85rem; color:#55607A; }
.cmp-pasos b{ display:grid; place-items:center; width:1.6rem; height:1.6rem; border-radius:999px; background:#EEF2F8; color:#55607A; font-size:.8rem; flex:none; }
.cmp-pasos li.actual{ border-color:var(--tenant); color:#0B1B4D; font-weight:600; } .cmp-pasos li.actual b{ background:var(--tenant); color:#fff; }
.cmp-pasos li.hecho b{ background:#16A34A; color:#fff; } .cmp-pasos li.hecho{ color:#0E6B3E; }
.cmp-codigo{ font-size:1.7rem; letter-spacing:.5em; text-align:center; font-variant-numeric:tabular-nums; max-width:16rem; }
.mi-avatar{ width:3.2rem; height:3.2rem; font-size:1.3rem; }
.mi-etapas{ display:grid; grid-template-columns:repeat(6,1fr); gap:.25rem; }
.mi-etapas li{ display:flex; flex-direction:column; gap:.3rem; } .mi-etapas li span{ height:.35rem; border-radius:999px; background:#E3E8F2; }
.mi-etapas li small{ font-size:.62rem; color:#7A869E; line-height:1.15; }
.mi-etapas li.hecho span{ background:#16A34A; } .mi-etapas li.actual span{ background:linear-gradient(90deg,var(--tenant),var(--tenant-2)); } .mi-etapas li.actual small{ color:#0B1B4D; font-weight:700; }
.mi-fin{ display:flex; gap:.5rem; align-items:flex-start; padding:.6rem .75rem; border-radius:.6rem; background:#F5F8FD; font-size:.82rem; color:#2A3350; }
.mi-perfil summary::-webkit-details-marker{ display:none; } .mi-perfil summary::after{ content:'+'; float:right; color:var(--tenant); } .mi-perfil[open] summary::after{ content:'−'; }
/* Flujo de candidatos · embudo de un solo color con rótulos directos */
.flu-embudo{ display:flex; flex-direction:column; gap:.85rem; }
.flu-embudo li{ display:flex; flex-direction:column; gap:.3rem; } .flu-embudo small{ font-size:.72rem; color:#7A869E; }
.flu-barra{ height:.75rem; border-radius:4px; background:#EEF2F8; overflow:hidden; }
.flu-barra > div{ height:100%; border-radius:4px; background:#2563EB; transition:width .4s; }
.flu-barra-fina{ height:.45rem; } .flu-barra-fina > div{ background:#16A34A; }
.flu-pasos{ display:inline-flex; gap:.25rem; } .flu-pasos i{ width:.7rem; height:.7rem; border-radius:999px; background:#E3E8F2; display:inline-block; } .flu-pasos i.ok{ background:#16A34A; }