.worker-identity{
  position:fixed;
  top:14px;
  left:14px;
  z-index:3200;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  width:min(560px, calc(100vw - 28px));
  padding:8px 9px 8px 14px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  background:rgba(17,17,17,.9);
  color:#fff;
  box-shadow:0 12px 34px rgba(0,0,0,.28);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  font-family:Arial,sans-serif;
  font-size:13px;
  line-height:1;
  transition:width .22s ease,padding .22s ease,transform .22s ease,box-shadow .22s ease;
}
.worker-identity-data{display:flex;align-items:center;gap:8px;min-width:0;border:0;background:transparent;color:inherit;padding:0;font:inherit;text-align:left}
.worker-identity-dot{width:8px;height:8px;flex:0 0 8px;border-radius:50%;background:#ffb347;box-shadow:0 0 0 4px rgba(255,179,71,.14)}
.worker-identity-role{color:#ffca72;font-weight:800;white-space:nowrap}
.worker-identity-separator{color:rgba(255,255,255,.42)}
.worker-identity-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:700}
.worker-identity-logout{display:inline-flex;align-items:center;justify-content:center;gap:7px;flex:0 0 auto;min-height:34px;padding:0 13px;border:1px solid rgba(255,255,255,.11);border-radius:999px;background:rgba(255,255,255,.07);color:#fff;text-decoration:none;font-size:12px;font-weight:800;transition:transform .18s ease,background .18s ease,border-color .18s ease}
.worker-identity-logout svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.worker-identity-logout:hover,.worker-identity-logout:focus-visible{background:rgba(239,68,68,.16);border-color:rgba(248,113,113,.42);transform:translateY(-1px);outline:none}

@media(min-width:769px){
  .worker-identity.is-scrolled{
    width:auto;
    max-width:240px;
    padding:9px 15px;
    gap:0;
    box-shadow:0 8px 22px rgba(0,0,0,.22);
  }
  .worker-identity.is-scrolled .worker-identity-separator,
  .worker-identity.is-scrolled .worker-identity-name,
  .worker-identity.is-scrolled .worker-identity-logout{display:none}
}

@media(max-width:768px){
  .worker-identity{
    top:8px;
    left:54px;
    right:auto;
    width:auto;
    max-width:calc(100vw - 205px);
    gap:7px;
    padding:6px 6px 6px 10px;
    font-size:11.5px;
    overflow:hidden;
  }
  .worker-identity-data{
    flex:0 1 auto;
    gap:6px;
    min-width:0;
    cursor:pointer;
    overflow:hidden;
  }
  .worker-identity-role{
    flex:0 1 auto;
    max-width:105px;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .worker-identity-separator,
  .worker-identity-name{display:none}
  .worker-identity-logout{min-height:32px;width:34px;padding:0;border-radius:50%}
  .worker-identity-logout span{display:none}
  .worker-identity-logout svg{width:18px;height:18px}

  .worker-identity.is-expanded{
    max-width:calc(100vw - 66px);
    padding-right:7px;
  }
  .worker-identity.is-expanded .worker-identity-data{flex:1 1 auto}
  .worker-identity.is-expanded .worker-identity-role{flex:0 0 auto;max-width:105px}
  .worker-identity.is-expanded .worker-identity-separator{display:inline;color:rgba(255,255,255,.42)}
  .worker-identity.is-expanded .worker-identity-name{
    display:inline;
    flex:1 1 auto;
    min-width:42px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
}

@media(max-width:390px){
  .worker-identity{font-size:11px;padding-left:9px}
  .worker-identity-role{max-width:82px}
  .worker-identity-dot{width:7px;height:7px;flex-basis:7px}
}


/* Etapa 22: en móviles queda solo en la parte superior inicial */
@media(max-width:768px){
  .worker-identity{
    position:absolute !important;
    top:8px !important;
    transform:none !important;
  }
}

/* Etapa 98: cabecera compacta tipo app solo en el catálogo móvil */
@media(max-width:768px){
  body.catalogo-page .worker-identity{
    z-index:3260;
    height:38px;
    min-height:38px;
    max-width:calc(100vw - 151px);
    padding:0 10px;
    overflow:visible;
    border-radius:13px;
  }
  body.catalogo-page .worker-identity-data{
    height:100%;
    overflow:hidden;
  }
  body.catalogo-page .worker-identity-role{
    max-width:100%;
    text-overflow:ellipsis;
  }
  body.catalogo-page .worker-identity-separator,
  body.catalogo-page .worker-identity-name{
    display:none!important;
  }
  body.catalogo-page .worker-identity-logout{
    position:absolute;
    top:calc(100% + 9px);
    left:0;
    width:min(246px,calc(100vw - 66px));
    min-height:42px;
    display:flex;
    gap:8px;
    padding:0 14px;
    border:1px solid rgba(248,113,113,.28);
    border-radius:13px;
    background:rgba(31,17,17,.98);
    color:#fecaca;
    box-shadow:0 18px 48px rgba(0,0,0,.48);
    opacity:0;
    visibility:hidden;
    transform:translateY(-7px) scale(.98);
    transform-origin:top left;
    pointer-events:none;
    transition:opacity .18s ease,transform .18s ease,visibility .18s;
  }
  body.catalogo-page .worker-identity-logout span{display:inline}
  body.catalogo-page .worker-identity.is-expanded .worker-identity-logout{
    opacity:1;
    visibility:visible;
    transform:none;
    pointer-events:auto;
  }
  body.catalogo-page .worker-identity.is-expanded{
    max-width:calc(100vw - 151px)!important;
  }
}
@media(max-width:768px){
  body.catalogo-page .worker-identity-logout::before{
    content:"Sesión laboral · " attr(data-worker-name);
  }
  body.catalogo-page .worker-identity-logout{flex-wrap:wrap}
}
@media(max-width:768px){
  body.catalogo-page .worker-identity.is-expanded::after{
    content:"Trabajador: " attr(data-worker-name);
    position:absolute;
    top:calc(100% + 9px);
    left:0;
    width:min(246px,calc(100vw - 66px));
    min-height:78px;
    box-sizing:border-box;
    padding:13px 14px 49px;
    border:1px solid rgba(255,255,255,.13);
    border-radius:16px;
    background:rgba(17,17,17,.98);
    color:#ffd27a;
    box-shadow:0 18px 48px rgba(0,0,0,.48);
    font-size:12px;
    font-weight:800;
    line-height:1.35;
    z-index:-1;
  }
  body.catalogo-page .worker-identity-logout{
    top:calc(100% + 48px);
    left:8px;
    width:min(230px,calc(100vw - 82px));
    min-height:36px;
    z-index:1;
  }
  body.catalogo-page .worker-identity-logout::before{content:none}
}

/* Etapa 103: identidad laboral compacta y separada en la portada. */
body.home-page.has-worker-session .worker-identity{
  width:auto;
  max-width:min(430px,calc(100vw - 96px));
}
@media(min-width:901px){
  body.home-page.has-worker-session .worker-identity{
    left:66px;
    top:14px;
  }
}
@media(max-width:900px){
  body.home-page.has-worker-session .worker-identity{
    display:none!important;
  }
}


/* Etapa 109: sesión laboral como franja superior intencional y coordinada. */
@media(min-width:901px){
  body.home-page.has-worker-session .worker-identity,
  body.catalogo-page.has-worker-session .worker-identity{
    position:fixed!important;top:0!important;left:0!important;right:0!important;
    width:100%!important;max-width:none!important;min-height:50px;box-sizing:border-box;
    padding:7px 18px 7px 70px;border-width:0 0 1px;border-radius:0;
    background:rgba(13,13,13,.96);box-shadow:0 8px 24px rgba(0,0,0,.22);
    z-index:4200;transform:none!important;
  }
  body.home-page.has-worker-session .worker-identity-data,
  body.catalogo-page.has-worker-session .worker-identity-data{max-width:min(520px,55vw)}
  body.home-page.has-worker-session .worker-identity-logout,
  body.catalogo-page.has-worker-session .worker-identity-logout{margin-left:auto}
  body.home-page.has-worker-session .worker-identity.is-scrolled,
  body.catalogo-page.has-worker-session .worker-identity.is-scrolled{
    width:100%!important;max-width:none!important;padding:7px 18px 7px 70px;gap:18px;
  }
  body.home-page.has-worker-session .worker-identity.is-scrolled .worker-identity-separator,
  body.home-page.has-worker-session .worker-identity.is-scrolled .worker-identity-name,
  body.home-page.has-worker-session .worker-identity.is-scrolled .worker-identity-logout,
  body.catalogo-page.has-worker-session .worker-identity.is-scrolled .worker-identity-separator,
  body.catalogo-page.has-worker-session .worker-identity.is-scrolled .worker-identity-name,
  body.catalogo-page.has-worker-session .worker-identity.is-scrolled .worker-identity-logout{display:inline-flex}
}


/* Etapa 110: en escritorio los datos laborales viven dentro del menú hamburguesa. */
@media(min-width:901px){
  body.catalogo-page.has-worker-session .worker-identity{display:none!important}
}