/* ============================================================
   PORTAL GRUPO DEPORTIVA · Sistema de diseño
   Tipografía única: Montserrat
   ============================================================ */

/* ---------------------------------------------- Montserrat */
@font-face{font-family:'Montserrat';src:url('Montserrat-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Montserrat';src:url('Montserrat-Medium.ttf') format('truetype');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Montserrat';src:url('Montserrat-SemiBold.ttf') format('truetype');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Montserrat';src:url('Montserrat-Bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Montserrat';src:url('Montserrat-ExtraBold.ttf') format('truetype');font-weight:800;font-style:normal;font-display:swap}

/* ---------------------------------------------- Variables */
:root{
  --navy:#0E1B33;
  --navy-2:#16264A;
  --azul:#14417F;
  --azul-claro:#2E6BD4;
  --azul-suave:#EAF0FA;
  --bronce:#C08A3E;
  --negro:#111823;
  --gris:#6B7789;
  --gris-linea:#E3E8F1;
  --gris-fondo:#F5F7FB;
  --blanco:#FFFFFF;
  --ok:#1E8E5A;
  --alerta:#C9821B;
  --error:#C0392B;

  --r-lg:18px;
  --r-md:12px;
  --r-sm:9px;
  --sombra:0 10px 30px rgba(8,18,38,.16);
  --sombra-sm:0 3px 12px rgba(8,18,38,.10);
  --barra-h:64px;
  --pie-h:62px;
}

*,*::before,*::after{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:'Montserrat',-apple-system,'Segoe UI',Arial,sans-serif;
  font-weight:400;
  color:var(--negro);
  background:var(--navy);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

/* ------------------------------- FONDO FIJO (no se mueve) */
.gd-fondo{
  position:fixed;
  inset:0;
  z-index:-2;
  background-color:#0A1327;
  background-image:url('FONDO-HD-1920X1080.webp');
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
}
.gd-fondo::after{
  content:'';
  position:absolute;inset:0;
  background:linear-gradient(160deg,rgba(6,12,26,.55) 0%,rgba(9,20,44,.30) 45%,rgba(6,12,26,.60) 100%);
}
/* Tamaños según pantalla */
@media (min-width:1921px){ .gd-fondo{background-image:url('FONDO-2K.webp')} }
@media (max-width:1024px) and (orientation:landscape){ .gd-fondo{background-image:url('FONDO-4-3-1200x900.webp')} }
@media (max-width:1024px) and (orientation:portrait){ .gd-fondo{background-image:url('FONDO-1-1-1200x1200.webp')} }
@media (max-width:640px){ .gd-fondo{background-image:url('FONDO-4-5-1080x1350.webp')} }

/* ------------------------------------ Barra superior */
.gd-barra{
  position:sticky;top:0;z-index:60;
  height:var(--barra-h);
  display:flex;align-items:center;gap:18px;
  padding:0 20px;
  background:rgba(11,21,42,.88);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(255,255,255,.09);
}
.gd-barra__marca{display:flex;align-items:center;gap:12px;text-decoration:none;flex-shrink:0}
.gd-barra__marca img{height:24px;width:auto;max-width:210px;object-fit:contain;display:block}
@media (max-width:900px){ .gd-barra__marca img{max-width:130px} }
@media (max-width:560px){ .gd-barra__marca img{max-width:96px} .gd-barra{gap:10px;padding:0 12px} }
.gd-barra__sub{color:#7FA8EC;font-size:8.5px;font-weight:700;letter-spacing:.22em;margin-top:3px}
.gd-barra__crece{flex:1}

/* ------------------------------------ Menú por grupos */
.gd-barra__menu{display:flex;gap:2px;align-items:center}

.gd-nav__item{
  display:inline-flex;align-items:center;gap:5px;
  color:#C8D6EE;text-decoration:none;font-family:inherit;font-size:12.5px;font-weight:600;
  padding:8px 12px;border-radius:8px;white-space:nowrap;transition:.16s;
  background:none;border:0;cursor:pointer;
}
.gd-nav__item:hover{background:rgba(255,255,255,.10);color:#fff}
.gd-nav__item.activo{background:var(--azul-claro);color:#fff}
.gd-nav__item:focus-visible{outline:2px solid #7FA8EC;outline-offset:2px}

.gd-nav__btn svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2.4;
  stroke-linecap:round;stroke-linejoin:round;transition:transform .18s}

.gd-nav__grupo{position:relative}
.gd-nav__grupo.activo > .gd-nav__btn{background:var(--azul-claro);color:#fff}
.gd-nav__grupo.abierto > .gd-nav__btn{background:rgba(255,255,255,.14);color:#fff}
.gd-nav__grupo.abierto > .gd-nav__btn svg{transform:rotate(180deg)}

.gd-nav__caja{
  position:absolute;top:calc(100% + 9px);left:0;min-width:264px;
  background:#fff;border-radius:var(--r-md);box-shadow:var(--sombra);
  padding:6px;display:none;z-index:90;
}
/* Puente invisible entre el botón y la caja: sin esto, al bajar el mouse
   se pasa por un hueco de 9 px, el menú cree que salió y se cierra solo. */
.gd-nav__caja::before{
  content:'';position:absolute;left:0;right:0;top:-11px;height:12px;
}
.gd-nav__grupo.abierto > .gd-nav__caja{display:block}
.gd-nav__caja a{
  display:block;padding:9px 12px;border-radius:9px;text-decoration:none;transition:.14s;
}
.gd-nav__caja a strong{display:block;color:var(--negro);font-size:13px;font-weight:700}
.gd-nav__caja a span{display:block;color:#6B7789;font-size:11.5px;margin-top:1px;line-height:1.35}
.gd-nav__caja a:hover{background:var(--azul-suave)}
.gd-nav__caja a.activo{background:var(--azul-suave)}
.gd-nav__caja a.activo strong{color:var(--azul)}

/* ------------------------------------ Botón de las tres rayas */
.gd-hamb{
  display:none;flex-direction:column;justify-content:center;gap:4px;
  width:38px;height:38px;padding:0 8px;flex-shrink:0;
  background:rgba(255,255,255,.10);border:0;border-radius:10px;cursor:pointer;
}
.gd-hamb span{display:block;height:2px;background:#DCE6F7;border-radius:2px;transition:.18s}
.gd-hamb[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.gd-hamb[aria-expanded="true"] span:nth-child(2){opacity:0}
.gd-hamb[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* ------------------------------------ Menú del teléfono */
.gd-movil{position:fixed;inset:0;z-index:120}
.gd-movil[hidden]{display:none}
.gd-movil__fondo{position:absolute;inset:0;background:rgba(6,13,28,.62);backdrop-filter:blur(2px)}
.gd-movil__panel{
  position:absolute;top:0;left:0;bottom:0;width:min(310px,86vw);
  background:#fff;box-shadow:0 0 46px rgba(6,13,28,.4);
  padding:14px 12px 28px;overflow-y:auto;
  animation:gdEntra .18s ease-out;
}
@keyframes gdEntra{from{transform:translateX(-100%)}to{transform:none}}
.gd-movil__cab{display:flex;align-items:center;justify-content:space-between;
  padding:4px 8px 12px;border-bottom:1px solid var(--gris-linea);margin-bottom:8px}
.gd-movil__cab span{font-weight:800;color:var(--negro);letter-spacing:.04em}
.gd-movil__x{border:0;background:none;font-size:26px;line-height:1;color:#6B7789;cursor:pointer;padding:0 4px}
.gd-movil__titulo{
  padding:14px 12px 5px;font-size:10.5px;font-weight:800;letter-spacing:.14em;
  text-transform:uppercase;color:#8A97AD;
}
.gd-movil__link{
  display:block;padding:10px 12px;border-radius:10px;text-decoration:none;
  color:var(--negro);font-size:14px;font-weight:600;
}
.gd-movil__link em{display:block;font-style:normal;font-size:11.5px;font-weight:500;color:#6B7789;margin-top:1px}
.gd-movil__link:hover{background:var(--azul-suave)}
.gd-movil__link.activo{background:var(--azul-claro);color:#fff}
.gd-movil__link.activo em{color:rgba(255,255,255,.8)}
.gd-movil__link--salir{color:#B02A2A}

@media (max-width:1180px){
  .gd-barra__menu{display:none}
  .gd-hamb{display:flex}
}

/* ------------------------------------ Buscador predictivo */
.gd-buscador{position:relative;flex-shrink:0;width:290px}
.gd-buscador input{
  width:100%;height:38px;border-radius:19px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.10);
  color:#fff;font-family:inherit;font-size:13px;
  padding:0 38px 0 16px;outline:none;transition:.18s;
}
.gd-buscador input::placeholder{color:#93A6C4}
.gd-buscador input:focus{background:#fff;color:var(--negro);border-color:var(--azul-claro);box-shadow:0 0 0 3px rgba(46,107,212,.28)}
.gd-buscador input:focus::placeholder{color:#9AA6B8}
.gd-buscador__ico{
  position:absolute;right:13px;top:50%;transform:translateY(-50%);
  width:16px;height:16px;stroke:#93A6C4;fill:none;stroke-width:2;pointer-events:none;
}
.gd-buscador input:focus ~ .gd-buscador__ico{stroke:var(--azul)}
.gd-buscador__lista{
  position:absolute;top:46px;right:0;width:380px;max-width:88vw;
  background:#fff;border-radius:var(--r-md);box-shadow:var(--sombra);
  overflow:hidden;display:none;max-height:60vh;overflow-y:auto;z-index:80;
}
.gd-buscador__lista.abierta{display:block}
.gd-buscador__item{
  display:flex;align-items:center;gap:11px;padding:10px 14px;
  text-decoration:none;color:var(--negro);border-bottom:1px solid var(--gris-linea);
}
.gd-buscador__item:last-child{border-bottom:none}
.gd-buscador__item:hover,.gd-buscador__item.sel{background:var(--azul-suave)}
.gd-buscador__ava{
  width:34px;height:34px;border-radius:50%;flex-shrink:0;
  background:var(--azul);color:#fff;display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:700;overflow:hidden;
}
.gd-buscador__ava img{width:100%;height:100%;object-fit:cover}
.gd-buscador__nom{display:block;font-size:13px;font-weight:600;line-height:1.35}
.gd-buscador__meta{
  display:block;font-size:11px;color:var(--gris);margin-top:3px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.gd-buscador__vacio{padding:16px;text-align:center;color:var(--gris);font-size:12.5px}
.gd-buscador__marca{font-size:10px;font-weight:700;color:var(--azul);letter-spacing:.04em;text-transform:uppercase}

/* ------------------------------------ Contenedor */
.gd-lienzo{
  min-height:calc(100vh - var(--barra-h));
  padding:26px 20px calc(var(--pie-h) + 26px);
}
.gd-ancho{max-width:1280px;margin:0 auto}
.gd-ancho--angosto{max-width:760px;margin:0 auto}

/* ------------------------------------ Encabezado de página */
.gd-titulo{margin:0 0 20px}
.gd-titulo h1{
  margin:0;color:#fff;font-size:25px;font-weight:800;letter-spacing:-.01em;
  text-shadow:0 2px 14px rgba(0,0,0,.45);
}
.gd-titulo p{margin:6px 0 0;color:#B9CAE6;font-size:13px;font-weight:500}

/* ------------------------------------ TARJETAS BLANCAS */
.gd-tarjeta{
  background:var(--blanco);
  border-radius:var(--r-lg);
  box-shadow:var(--sombra);
  padding:24px;
  margin-bottom:20px;
  color:var(--negro);
}
.gd-tarjeta--plana{box-shadow:var(--sombra-sm)}
.gd-tarjeta__cab{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding-bottom:14px;margin-bottom:18px;border-bottom:2px solid var(--gris-linea);flex-wrap:wrap;
}
.gd-tarjeta__cab h2{margin:0;font-size:16px;font-weight:800;color:var(--azul);letter-spacing:-.01em}
.gd-tarjeta__cab p{margin:4px 0 0;font-size:12px;color:var(--gris);font-weight:500}

/* ------------------------------------ Rejillas */
.gd-rejilla{display:grid;gap:18px}
.gd-rejilla--2{grid-template-columns:repeat(2,1fr)}
.gd-rejilla--3{grid-template-columns:repeat(3,1fr)}
.gd-rejilla--4{grid-template-columns:repeat(4,1fr)}
@media (max-width:900px){.gd-rejilla--3,.gd-rejilla--4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.gd-rejilla--2,.gd-rejilla--3,.gd-rejilla--4{grid-template-columns:1fr}}

/* ------------------------------------ Métricas */
.gd-metrica{
  background:#fff;border-radius:var(--r-lg);box-shadow:var(--sombra);
  padding:20px;position:relative;overflow:hidden;
}
.gd-metrica::before{content:'';position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--azul-claro)}
.gd-metrica.b::before{background:var(--bronce)}
.gd-metrica.v::before{background:var(--ok)}
.gd-metrica.r::before{background:var(--error)}
.gd-metrica__val{font-size:31px;font-weight:800;color:var(--navy);line-height:1}
.gd-metrica__eti{font-size:11.5px;font-weight:700;color:var(--gris);text-transform:uppercase;letter-spacing:.09em;margin-top:8px}

/* ------------------------------------ Formularios */
.gd-campo{margin-bottom:16px}
.gd-campo label{
  display:block;font-size:11.5px;font-weight:700;color:var(--azul);
  text-transform:uppercase;letter-spacing:.07em;margin-bottom:7px;
}
.gd-campo .req{color:var(--error)}
.gd-campo input[type=text],.gd-campo input[type=email],.gd-campo input[type=password],
.gd-campo input[type=number],.gd-campo input[type=date],.gd-campo input[type=tel],
.gd-campo input[type=time],.gd-campo select,.gd-campo textarea{
  width:100%;padding:11px 14px;font-family:inherit;font-size:14px;color:var(--negro);
  background:var(--gris-fondo);border:1.5px solid var(--gris-linea);border-radius:var(--r-sm);
  outline:none;transition:.16s;
}
.gd-campo textarea{min-height:96px;resize:vertical}
.gd-campo select{cursor:pointer;appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B7789' stroke-width='2.4' stroke-linecap='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat:no-repeat;background-position:right 12px center;background-size:16px;padding-right:38px}
.gd-campo input:focus,.gd-campo select:focus,.gd-campo textarea:focus{
  background:#fff;border-color:var(--azul-claro);box-shadow:0 0 0 3px rgba(46,107,212,.15);
}
.gd-campo input[type=color]{width:56px;height:40px;padding:3px;border:1.5px solid var(--gris-linea);border-radius:var(--r-sm);background:#fff;cursor:pointer}
.gd-ayuda{font-size:11.5px;color:var(--gris);margin-top:6px;font-weight:500}

/* Contraseña con ojito */
.gd-pass{position:relative}
.gd-pass input{padding-right:46px !important}
.gd-pass__ojo{
  position:absolute;right:6px;top:50%;transform:translateY(-50%);
  width:34px;height:34px;border:none;background:transparent;cursor:pointer;
  display:flex;align-items:center;justify-content:center;border-radius:8px;color:var(--gris);
}
.gd-pass__ojo:hover{background:var(--azul-suave);color:var(--azul)}
.gd-pass__ojo svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.9}

/* Checkbox */
.gd-check{display:flex;align-items:center;gap:9px;cursor:pointer;user-select:none}
.gd-check input{width:17px;height:17px;accent-color:var(--azul-claro);cursor:pointer;margin:0}
.gd-check span{font-size:13px;color:var(--negro);font-weight:500}

/* ------------------------------------ Botones */
.gd-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:12px 22px;border:none;border-radius:var(--r-sm);
  font-family:inherit;font-size:13.5px;font-weight:700;letter-spacing:.02em;
  cursor:pointer;text-decoration:none;transition:.16s;line-height:1.2;
}
.gd-btn--primario{background:var(--azul);color:#fff}
.gd-btn--primario:hover{background:#0F3468;transform:translateY(-1px);box-shadow:0 6px 18px rgba(20,65,127,.35)}
.gd-btn--claro{background:var(--azul-suave);color:var(--azul)}
.gd-btn--claro:hover{background:#DCE7F8}
.gd-btn--borde{background:#fff;color:var(--azul);border:1.5px solid var(--gris-linea)}
.gd-btn--borde:hover{border-color:var(--azul-claro);background:var(--azul-suave)}
.gd-btn--peligro{background:#FDECEA;color:var(--error)}
.gd-btn--peligro:hover{background:#F9D9D5}
.gd-btn--bloque{width:100%}
.gd-btn--sm{padding:8px 14px;font-size:12px}
.gd-btn:disabled{opacity:.55;cursor:not-allowed;transform:none}

/* ------------------------------------ Tablas */
.gd-tabla-env{overflow-x:auto;margin:0 -4px}
table.gd-tabla{width:100%;border-collapse:collapse;font-size:13.5px}
table.gd-tabla th{
  text-align:left;padding:11px 12px;font-size:10.5px;font-weight:800;
  color:var(--azul);text-transform:uppercase;letter-spacing:.09em;
  border-bottom:2px solid var(--gris-linea);white-space:nowrap;
}
table.gd-tabla td{padding:13px 12px;border-bottom:1px solid var(--gris-linea);color:var(--negro);vertical-align:middle}
table.gd-tabla tbody tr:hover{background:var(--gris-fondo)}
table.gd-tabla tbody tr:last-child td{border-bottom:none}
.gd-tabla__acc{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap}

/* ------------------------------------ Etiquetas de estado */
.gd-eti{
  display:inline-flex;align-items:center;gap:5px;
  padding:4px 11px;border-radius:20px;font-size:11px;font-weight:700;
  letter-spacing:.03em;white-space:nowrap;
}
.gd-eti--ok{background:#E4F4EC;color:var(--ok)}
.gd-eti--off{background:#EEF0F4;color:var(--gris)}
.gd-eti--azul{background:var(--azul-suave);color:var(--azul)}
.gd-eti--bronce{background:#F8EFE1;color:var(--bronce)}
.gd-eti--rojo{background:#FDECEA;color:var(--error)}
.gd-eti--alerta{background:#FDF3E2;color:var(--alerta)}

/* ------------------------------------ Avisos */
.gd-aviso{
  display:block;
  padding:13px 16px;border-radius:var(--r-sm);
  font-size:13px;font-weight:600;margin-bottom:16px;line-height:1.55;
}
.gd-aviso code{background:rgba(0,0,0,.07);padding:1px 6px;border-radius:5px;font-size:12px}
.gd-aviso--ok{background:#E4F4EC;color:#12603B;border-left:4px solid var(--ok)}
.gd-aviso--error{background:#FDECEA;color:#8E2A1F;border-left:4px solid var(--error)}
.gd-aviso--info{background:var(--azul-suave);color:var(--azul);border-left:4px solid var(--azul-claro)}
.gd-aviso--alerta{background:#FDF3E2;color:#8A5A11;border-left:4px solid var(--alerta)}

/* ------------------------------------ Vacío */
.gd-vacio{text-align:center;padding:48px 20px;color:var(--gris)}
.gd-vacio svg{width:52px;height:52px;stroke:var(--gris-linea);fill:none;stroke-width:1.5;margin-bottom:14px}
.gd-vacio h3{margin:0 0 6px;font-size:15px;color:var(--negro);font-weight:700}
.gd-vacio p{margin:0 0 18px;font-size:13px}

/* ------------------------------------ Interruptor */
.gd-switch{position:relative;display:inline-block;width:46px;height:25px;flex-shrink:0}
.gd-switch input{opacity:0;width:0;height:0}
.gd-switch__pista{
  position:absolute;inset:0;background:#CBD3E0;border-radius:25px;
  cursor:pointer;transition:.22s;
}
.gd-switch__pista::before{
  content:'';position:absolute;height:19px;width:19px;left:3px;bottom:3px;
  background:#fff;border-radius:50%;transition:.22s;box-shadow:0 1px 4px rgba(0,0,0,.28);
}
.gd-switch input:checked + .gd-switch__pista{background:var(--ok)}
.gd-switch input:checked + .gd-switch__pista::before{transform:translateX(21px)}

/* ------------------------------------ Campana de avisos */
.gd-avisos{position:relative;flex-shrink:0}
.gd-avisos__btn{
  width:38px;height:38px;border-radius:50%;position:relative;cursor:pointer;
  background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.16);
  display:flex;align-items:center;justify-content:center;transition:.16s;
}
.gd-avisos__btn:hover{background:rgba(255,255,255,.18)}
.gd-avisos__btn svg{width:18px;height:18px;stroke:#fff;fill:none;stroke-width:1.9}
.gd-avisos__punto{
  position:absolute;top:-4px;right:-4px;min-width:18px;height:18px;padding:0 5px;
  border-radius:9px;background:#C0392B;color:#fff;font-size:10.5px;font-weight:800;
  display:flex;align-items:center;justify-content:center;border:2px solid #101F3C;
}
.gd-avisos__menu{
  position:absolute;top:46px;right:0;width:340px;max-width:88vw;background:#fff;
  border-radius:var(--r-md);box-shadow:var(--sombra);overflow:hidden;display:none;
  z-index:80;max-height:70vh;overflow-y:auto;
}
.gd-avisos__menu.abierto{display:block}
.gd-avisos__cab{
  padding:12px 16px;font-size:11px;font-weight:800;color:var(--azul);
  text-transform:uppercase;letter-spacing:.08em;border-bottom:2px solid var(--gris-linea);
}
.gd-avisos__item{
  display:block;padding:13px 16px;text-decoration:none;border-bottom:1px solid var(--gris-linea);
}
.gd-avisos__item:last-child{border-bottom:none}
.gd-avisos__item:hover{background:var(--azul-suave)}
.gd-avisos__tit{display:block;font-size:13px;font-weight:700;color:var(--negro);line-height:1.35}
.gd-avisos__det{display:block;font-size:12px;color:var(--gris);margin-top:3px;line-height:1.4}
.gd-avisos__fec{display:block;font-size:10.5px;color:#9AA6B8;margin-top:5px}

/* ------------------------------------ Expediente */
.gd-progreso{height:8px;border-radius:5px;background:var(--gris-linea);overflow:hidden}
.gd-progreso i{display:block;height:100%;border-radius:5px;background:var(--ok);transition:width .4s}
.gd-progreso.medio i{background:var(--alerta)}
.gd-progreso.bajo  i{background:var(--error)}

.gd-req{
  display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:10px;
  border:1.5px solid var(--gris-linea);margin-bottom:9px;background:#fff;
}
.gd-req--ok{border-color:#9FDCC0;background:#F4FBF7}
.gd-req--pend{border-color:#F0D9A8;background:#FEF9F0}
.gd-req--falta{border-color:#F3BDB5;background:#FDF4F3}
.gd-req__ico{
  width:32px;height:32px;border-radius:9px;flex-shrink:0;display:flex;align-items:center;
  justify-content:center;font-size:14px;font-weight:800;color:#fff;background:var(--gris);
}
.gd-req--ok    .gd-req__ico{background:var(--ok)}
.gd-req--pend  .gd-req__ico{background:var(--alerta)}
.gd-req--falta .gd-req__ico{background:var(--error)}
.gd-req__txt{flex:1;min-width:0}
.gd-req__tit{font-size:13.5px;font-weight:700;color:var(--negro);line-height:1.3}
.gd-req--falta .gd-req__tit{color:var(--error)}
.gd-req__sub{font-size:11.5px;color:var(--gris);margin-top:3px}
.gd-req__acc{display:flex;gap:6px;flex-shrink:0;flex-wrap:wrap;justify-content:flex-end}

.gd-etapas{display:flex;gap:0;flex-wrap:wrap;margin-bottom:4px}
.gd-etapa{display:flex;align-items:center;gap:7px;padding:6px 0;flex:1;min-width:130px;position:relative}
.gd-etapa__pin{
  width:22px;height:22px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;
  justify-content:center;font-size:11px;font-weight:800;background:var(--gris-linea);color:var(--gris);
}
.gd-etapa.hecha .gd-etapa__pin{background:var(--ok);color:#fff}
.gd-etapa.actual .gd-etapa__pin{background:var(--azul);color:#fff;
  box-shadow:0 0 0 4px rgba(20,65,127,.16)}
.gd-etapa__txt{font-size:11.5px;font-weight:600;color:var(--gris);line-height:1.25}
.gd-etapa.hecha .gd-etapa__txt,.gd-etapa.actual .gd-etapa__txt{color:var(--negro);font-weight:700}

.gd-linea-tiempo{position:relative;padding-left:22px}
.gd-linea-tiempo::before{
  content:'';position:absolute;left:6px;top:6px;bottom:6px;width:2px;background:var(--gris-linea);
}
.gd-hito{position:relative;padding:0 0 16px}
.gd-hito::before{
  content:'';position:absolute;left:-20px;top:5px;width:10px;height:10px;border-radius:50%;
  background:var(--azul-claro);border:2px solid #fff;box-shadow:0 0 0 2px var(--azul-suave);
}
.gd-hito__tit{font-size:13px;font-weight:700;color:var(--negro);line-height:1.4}
.gd-hito__det{font-size:12px;color:var(--gris);margin-top:2px;line-height:1.45}
.gd-hito__fec{font-size:11px;color:#9AA6B8;margin-top:3px}

.gd-ficha{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.gd-ficha__foto{
  width:84px;height:84px;border-radius:50%;object-fit:cover;flex-shrink:0;
  border:3px solid #fff;box-shadow:0 4px 14px rgba(8,18,38,.18);
}
.gd-ficha__ini{
  width:84px;height:84px;border-radius:50%;background:var(--azul);color:#fff;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;font-size:27px;font-weight:800;
}

/* ------------------------------------ Usuario en la barra */
.gd-yo{display:flex;align-items:center;gap:9px;flex-shrink:0;position:relative}
.gd-yo__btn{
  display:flex;align-items:center;gap:9px;background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.16);border-radius:22px;padding:5px 12px 5px 5px;
  cursor:pointer;color:#fff;font-family:inherit;transition:.16s;
}
.gd-yo__btn:hover{background:rgba(255,255,255,.18)}
.gd-yo__ini{
  width:30px;height:30px;border-radius:50%;background:var(--azul-claro);
  display:flex;align-items:center;justify-content:center;font-size:11.5px;font-weight:800;flex-shrink:0;
}
.gd-yo__txt{text-align:left;line-height:1.25}
.gd-yo__nom{font-size:12.5px;font-weight:700}
.gd-yo__rol{font-size:9.5px;color:#8FB0E4;font-weight:600;letter-spacing:.05em;text-transform:uppercase}
.gd-yo__menu{
  position:absolute;top:46px;right:0;min-width:210px;background:#fff;
  border-radius:var(--r-md);box-shadow:var(--sombra);overflow:hidden;display:none;z-index:80;
}
.gd-yo__menu.abierto{display:block}
.gd-yo__menu a{
  display:block;padding:12px 16px;color:var(--negro);text-decoration:none;
  font-size:13px;font-weight:600;border-bottom:1px solid var(--gris-linea);
}
.gd-yo__menu a:last-child{border-bottom:none}
.gd-yo__menu a:hover{background:var(--azul-suave);color:var(--azul)}
.gd-yo__menu a.salir{color:var(--error)}

/* ------------------------------------ PIE CON LOGOS (siempre visible) */
.gd-pie{
  position:fixed;left:0;right:0;bottom:0;z-index:50;
  height:var(--pie-h);
  display:flex;align-items:center;gap:18px;
  padding:0 22px;
  background:rgba(9,18,36,.90);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-top:1px solid rgba(255,255,255,.09);
}
.gd-pie__gd{display:flex;flex-direction:column;flex-shrink:0}
.gd-pie__gd strong{
  color:#fff;font-size:12.5px;font-weight:800;letter-spacing:.16em;line-height:1;
}
.gd-pie__gd span{color:#5D8AD8;font-size:7.5px;font-weight:700;letter-spacing:.2em;margin-top:4px}
.gd-pie__sep{width:1px;height:26px;background:rgba(255,255,255,.16);flex-shrink:0}
.gd-pie__marcas{
  display:flex;align-items:center;gap:30px;flex:1;
  overflow-x:auto;scrollbar-width:none;
}
.gd-pie__marcas::-webkit-scrollbar{display:none}
/* Todas las marcas se normalizan dentro de una misma caja para que ninguna
   se vea más grande que otra, sin importar la proporción de su archivo. */
.gd-pie__marcas img{
  height:24px;width:auto;max-width:118px;object-fit:contain;
  opacity:.75;flex-shrink:0;transition:.2s;filter:brightness(0) invert(1);
}
.gd-pie__marcas img:hover{opacity:1}
.gd-pie__marcas .txt{
  color:#fff;opacity:.75;font-size:12.5px;font-weight:800;letter-spacing:.13em;flex-shrink:0;
}
@media (max-width:760px){
  .gd-pie{gap:12px;padding:0 14px}
  .gd-pie__gd span{display:none}
  .gd-pie__marcas{gap:18px}
  .gd-pie__marcas img{height:17px;max-width:68px}
  .gd-pie__marcas .txt{font-size:10px}
}

/* ============================================================
   PANTALLA DE ACCESO (login / recuperar)
   ============================================================ */
.gd-acceso{
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  padding:32px 18px calc(var(--pie-h) + 32px);
}
.gd-acceso__caja{width:100%;max-width:430px}
.gd-acceso__logo{text-align:center;margin-bottom:26px}
.gd-acceso__logo img{
  width:min(320px,76%);height:auto;display:block;margin:0 auto;
  filter:drop-shadow(0 4px 16px rgba(0,0,0,.5));
}
.gd-acceso__logo p{
  margin:12px 0 0;color:#9CBBEA;font-size:9.5px;font-weight:700;letter-spacing:.28em;
}
.gd-acceso__tarjeta{
  background:#fff;border-radius:22px;box-shadow:0 24px 60px rgba(3,10,24,.45);
  padding:34px 32px;
}
.gd-acceso__tarjeta h1{
  margin:0 0 4px;font-size:21px;font-weight:800;color:var(--navy);letter-spacing:-.02em;
}
.gd-acceso__tarjeta .sub{margin:0 0 24px;font-size:13px;color:var(--gris);font-weight:500}
.gd-acceso__fila{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:4px 0 22px;flex-wrap:wrap}
.gd-acceso__fila .gd-check span{font-size:12.5px}
.gd-acceso__enlace{color:var(--azul-claro);font-size:12.5px;font-weight:700;text-decoration:none}
.gd-acceso__enlace:hover{text-decoration:underline}
.gd-acceso__pie{
  text-align:center;margin-top:22px;color:#93A6C4;font-size:11px;font-weight:500;line-height:1.6;
}

/* ------------------------------------ Utilidades */
.mb0{margin-bottom:0}.mt0{margin-top:0}
.mt8{margin-top:8px}.mt16{margin-top:16px}.mt24{margin-top:24px}
.mb8{margin-bottom:8px}.mb16{margin-bottom:16px}.mb24{margin-bottom:24px}
.txt-c{text-align:center}.txt-d{text-align:right}
.flex{display:flex}.flex-c{align-items:center}.flex-e{justify-content:space-between}
.gap8{gap:8px}.gap12{gap:12px}.gap16{gap:16px}
.crece{flex:1}
.envolver{flex-wrap:wrap}
.azul{color:var(--azul)}.gris{color:var(--gris)}.negro{color:var(--negro)}
.peque{font-size:12px}
.fuerte{font-weight:700}
.oculto{display:none !important}
.nowrap{white-space:nowrap}
hr.gd-linea{border:none;border-top:1px solid var(--gris-linea);margin:22px 0}

/* Impresión */
@media print{
  .gd-fondo,.gd-barra,.gd-pie{display:none !important}
  .gd-lienzo{padding:0}
  .gd-tarjeta{box-shadow:none;border:1px solid #ddd}
  body{background:#fff}
}

/* ============================================================
   Novedades de ingreso en el panel de RRHH
   Gente que firmó la oferta o llenó el formulario y está
   esperando el siguiente paso. No se apaga al verlo: se quita
   cuando RRHH hace lo que falta.
   ============================================================ */
.gd-nuevos{display:grid;gap:14px}
.gd-nuevos__caja{
  background:#fff;border-radius:var(--r-lg);box-shadow:var(--sombra);
  overflow:hidden;border-left:5px solid var(--azul-claro);
}
.gd-nuevos--formulario{border-left-color:var(--ok)}
.gd-nuevos--oferta{border-left-color:var(--bronce)}

.gd-nuevos__cab{display:flex;gap:13px;align-items:flex-start;padding:16px 18px 13px}
/* Ojo: el selector va contra el div del texto, NO contra cualquier span del
   encabezado. Si no, también le cae al círculo del icono y lo desarma. */
.gd-nuevos__cab > div strong{display:block;font-size:14.5px;color:var(--azul);line-height:1.4}
.gd-nuevos__cab > div span{display:block;font-size:12.5px;color:var(--gris);margin-top:3px}

.gd-nuevos__ico{
  flex:0 0 34px;width:34px;height:34px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:16px;font-weight:700;line-height:1;
  background:var(--azul-suave);color:var(--azul);
}
.gd-nuevos--formulario .gd-nuevos__ico{background:#E4F4EC;color:#12603B}
.gd-nuevos--oferta .gd-nuevos__ico{background:#FDF3E2;color:#8A5A11}

.gd-nuevos__lista{list-style:none;margin:0;padding:0;border-top:1px solid var(--gris-linea)}
.gd-nuevos__lista li{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:11px 18px;border-bottom:1px solid var(--gris-linea);
}
.gd-nuevos__lista li:last-child{border-bottom:0}
.gd-nuevos__quien strong{display:block;font-size:13.5px;color:var(--tinta,#101828);line-height:1.35}
.gd-nuevos__quien span{display:block;font-size:11.5px;color:var(--gris);margin-top:2px}
.gd-nuevos__lista .gd-btn{flex:0 0 auto;white-space:nowrap}

@media (max-width:640px){
  .gd-nuevos__lista li{flex-direction:column;align-items:stretch;gap:9px}
  .gd-nuevos__lista .gd-btn{width:100%;text-align:center}
}

/* Pedir permiso para ver un dato reservado */
.gd-pedir{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin-top:11px}
.gd-pedir label{flex:1 1 280px;font-size:11px;font-weight:700;
  text-transform:uppercase;letter-spacing:.05em;color:inherit}
.gd-pedir input[type=text]{
  display:block;width:100%;margin-top:5px;padding:8px 11px;font:inherit;font-size:13px;
  text-transform:none;letter-spacing:0;font-weight:500;
  border:1px solid var(--gris-linea);border-radius:8px;background:#fff;
}
.gd-pedir input[type=text]:focus{outline:none;border-color:var(--azul-claro)}

.gd-reservado{
  display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:999px;
  background:var(--gris-fondo);border:1px dashed var(--gris-linea);
  font-size:11px;font-weight:600;color:var(--gris);
}

/* ============================================================
   PORTAL GRUPO DEPORTIVA · Parte pública (móvil primero)
   Firma de oferta y formulario de ingreso
   ============================================================ */

.pb{min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:20px 14px 40px}
.pb__caja{width:100%;max-width:640px}

.pb__logo{text-align:center;margin:8px 0 20px}
.pb__logo img{width:min(240px,66%);height:auto;display:block;margin:0 auto;
  filter:drop-shadow(0 4px 16px rgba(0,0,0,.5))}
.pb__logo p{margin:10px 0 0;color:#9CBBEA;font-size:8.5px;font-weight:700;letter-spacing:.26em}

.pb__tarjeta{
  background:#fff;border-radius:20px;box-shadow:0 20px 50px rgba(3,10,24,.42);
  padding:24px 20px;margin-bottom:16px;
}
@media (min-width:560px){ .pb__tarjeta{padding:30px 28px} }

.pb__h1{margin:0 0 6px;font-size:20px;font-weight:800;color:var(--navy);letter-spacing:-.02em;line-height:1.25}
.pb__sub{margin:0 0 20px;font-size:13.5px;color:var(--gris);font-weight:500;line-height:1.55}
.pb__h2{margin:0 0 4px;font-size:15px;font-weight:800;color:var(--azul)}

/* ------------------------------------------- Barra de progreso */
.pb__prog{margin-bottom:18px}
.pb__prog__barra{height:7px;background:rgba(255,255,255,.20);border-radius:5px;overflow:hidden}
.pb__prog__barra i{display:block;height:100%;background:linear-gradient(90deg,#2E6BD4,#5B93EC);
  border-radius:5px;transition:width .35s ease}
.pb__prog__txt{display:flex;justify-content:space-between;margin-top:8px;
  color:#B9CAE6;font-size:11.5px;font-weight:600}

/* ------------------------------------------- Campos */
.pb-campo{margin-bottom:16px}
.pb-campo label{display:block;font-size:11.5px;font-weight:700;color:var(--azul);
  text-transform:uppercase;letter-spacing:.06em;margin-bottom:7px}
.pb-campo .req{color:var(--error)}
/* Aclaración chiquita al lado de la etiqueta: "(al mes)", "(por hora)" */
.pb__nota{font-weight:600;color:var(--gris);text-transform:none;letter-spacing:0}
.pb-campo input[type=text],.pb-campo input[type=email],.pb-campo input[type=tel],
.pb-campo input[type=date],.pb-campo input[type=number],.pb-campo select,.pb-campo textarea{
  width:100%;padding:13px 14px;font-family:inherit;font-size:16px;color:var(--negro);
  background:var(--gris-fondo);border:1.5px solid var(--gris-linea);border-radius:10px;
  outline:none;transition:.16s;-webkit-appearance:none;appearance:none;
}
.pb-campo select{cursor:pointer;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B7789' stroke-width='2.4' stroke-linecap='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat:no-repeat;background-position:right 12px center;background-size:17px;padding-right:40px}
.pb-campo textarea{min-height:92px;resize:vertical}
.pb-campo input:focus,.pb-campo select:focus,.pb-campo textarea:focus{
  background:#fff;border-color:var(--azul-claro);box-shadow:0 0 0 3px rgba(46,107,212,.16)}
.pb-ayuda{font-size:12px;color:var(--gris);margin-top:6px;line-height:1.5}

.pb-fila{display:grid;gap:14px;grid-template-columns:1fr 1fr}
.pb-fila--3{grid-template-columns:repeat(3,1fr)}
@media (max-width:520px){ .pb-fila,.pb-fila--3{grid-template-columns:1fr} }

/* Opciones tipo botón (sexo, sí/no, nivel) */
.pb-ops{display:flex;gap:8px;flex-wrap:wrap}
.pb-ops label{flex:1;min-width:88px;margin:0}
.pb-ops input{position:absolute;opacity:0;pointer-events:none}
.pb-ops span{
  display:block;text-align:center;padding:12px 10px;border-radius:10px;
  border:1.5px solid var(--gris-linea);background:var(--gris-fondo);
  font-size:13.5px;font-weight:600;color:var(--negro);cursor:pointer;transition:.15s;
  text-transform:none;letter-spacing:0;
}
.pb-ops input:checked + span{background:var(--azul);border-color:var(--azul);color:#fff}
.pb-ops label:active span{transform:scale(.98)}

/* ------------------------------------------- Botones */
.pb-btn{
  display:flex;align-items:center;justify-content:center;gap:8px;width:100%;
  padding:16px 20px;border:none;border-radius:12px;font-family:inherit;
  font-size:15px;font-weight:700;cursor:pointer;text-decoration:none;transition:.16s;
}
.pb-btn--primario{background:var(--azul);color:#fff}
.pb-btn--primario:hover{background:#0F3468}
.pb-btn--primario:active{transform:scale(.99)}
.pb-btn--claro{background:var(--azul-suave);color:var(--azul)}
.pb-btn--borde{background:#fff;color:var(--gris);border:1.5px solid var(--gris-linea)}
.pb-btn--verde{background:#1E8E5A;color:#fff}
.pb-btn:disabled{opacity:.5;cursor:not-allowed}
.pb-btns{display:flex;gap:10px;margin-top:22px}
.pb-btns .pb-btn{flex:1}
.pb-btns .pb-btn--borde{flex:0 0 34%}

/* ------------------------------------------- Cámara */
.cam{
  position:relative;width:100%;background:#0B1425;border-radius:14px;overflow:hidden;
  aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;
}
.cam video,.cam canvas.vista{width:100%;height:100%;object-fit:cover;display:block}
.cam__guia{position:absolute;inset:0;pointer-events:none}
.cam__marco{
  position:absolute;border:2.5px dashed rgba(255,255,255,.85);border-radius:12px;
  box-shadow:0 0 0 2000px rgba(4,10,22,.45);transition:border-color .2s;
}
.cam__marco.ok{border-color:#37D98A;border-style:solid}
.cam__estado{
  position:absolute;left:0;right:0;bottom:0;padding:10px 14px;
  background:linear-gradient(transparent,rgba(4,10,22,.85));
  color:#fff;font-size:12.5px;font-weight:600;text-align:center;line-height:1.4;
}
.cam__estado.ok{color:#8FF0C2}
.cam__cuenta{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  font-size:64px;font-weight:900;color:#fff;text-shadow:0 4px 24px rgba(0,0,0,.7);
}
.cam__aviso{
  padding:26px 20px;text-align:center;color:#C8D6EE;font-size:13.5px;line-height:1.6;
}
.cam-acciones{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.cam-acciones .pb-btn{flex:1;min-width:130px;padding:13px 14px;font-size:14px}

.previa{position:relative;border-radius:14px;overflow:hidden;background:#EEF1F6}
.previa img{width:100%;display:block}
.previa__ok{
  position:absolute;top:10px;right:10px;background:#1E8E5A;color:#fff;
  border-radius:20px;padding:5px 12px;font-size:11.5px;font-weight:700;
}

/* ------------------------------------------- Subida de archivos */
.subir{
  border:2px dashed var(--gris-linea);border-radius:14px;padding:20px 16px;text-align:center;
  background:var(--gris-fondo);transition:.16s;cursor:pointer;display:block;
}
.subir:hover{border-color:var(--azul-claro);background:var(--azul-suave)}
.subir input{display:none}
.subir svg{width:30px;height:30px;stroke:var(--azul);fill:none;stroke-width:1.7;margin-bottom:8px}
.subir b{display:block;font-size:14px;color:var(--navy);margin-bottom:4px}
.subir small{font-size:12px;color:var(--gris)}

.doc-item{
  display:flex;align-items:center;gap:12px;padding:14px;border-radius:12px;
  border:1.5px solid var(--gris-linea);margin-bottom:12px;background:#fff;
}
.doc-item.listo{border-color:#9FDCC0;background:#F2FBF6}
.doc-item.pend{border-color:#F0D9A8;background:#FEF9F0}
.doc-item__ico{
  width:38px;height:38px;border-radius:10px;flex-shrink:0;display:flex;
  align-items:center;justify-content:center;font-size:15px;font-weight:800;color:#fff;background:var(--gris);
}
.doc-item.listo .doc-item__ico{background:#1E8E5A}
.doc-item.pend  .doc-item__ico{background:#C9821B}
.doc-item__txt{flex:1;min-width:0}
.doc-item__tit{font-size:14px;font-weight:700;color:var(--navy);line-height:1.3}
.doc-item__sub{font-size:12px;color:var(--gris);margin-top:3px}

/* ------------------------------------------- Firma */
.firma-caja{
  border:2px solid var(--gris-linea);border-radius:14px;background:#fff;
  position:relative;overflow:hidden;touch-action:none;
}
.firma-caja canvas{width:100%;height:190px;display:block;touch-action:none;cursor:crosshair}
.firma-caja__linea{
  position:absolute;left:22px;right:22px;bottom:44px;border-top:1.5px dashed #C7D0DE;pointer-events:none;
}
.firma-caja__txt{
  position:absolute;left:0;right:0;bottom:20px;text-align:center;
  color:#A9B4C4;font-size:12px;font-weight:600;pointer-events:none;
}
.firma-caja.escrita .firma-caja__txt,.firma-caja.escrita .firma-caja__linea{opacity:0}

/* ------------------------------------------- Filas repetibles */
.rep{border:1.5px solid var(--gris-linea);border-radius:12px;padding:14px;margin-bottom:12px;background:var(--gris-fondo)}
.rep__cab{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.rep__num{font-size:11px;font-weight:800;color:var(--azul);text-transform:uppercase;letter-spacing:.07em}
.rep__quitar{background:none;border:none;color:var(--error);font-size:12px;font-weight:700;cursor:pointer;padding:4px 8px}
.rep-add{
  width:100%;padding:13px;border:1.5px dashed var(--azul-claro);border-radius:12px;
  background:var(--azul-suave);color:var(--azul);font-family:inherit;font-size:13.5px;
  font-weight:700;cursor:pointer;transition:.15s;
}
.rep-add:hover{background:#DCE7F8}
.rep .pb-campo{margin-bottom:10px}
.rep .pb-campo label{font-size:10.5px}
.rep .pb-campo input,.rep .pb-campo select{padding:11px 12px;font-size:15px;background:#fff}

/* ------------------------------------------- Varios */
.pb-aviso{
  padding:14px 16px;border-radius:11px;font-size:13px;font-weight:600;
  margin-bottom:16px;line-height:1.55;
}
.pb-aviso--ok{background:#E4F4EC;color:#12603B;border-left:4px solid #1E8E5A}
.pb-aviso--error{background:#FDECEA;color:#8E2A1F;border-left:4px solid #C0392B}
.pb-aviso--info{background:var(--azul-suave);color:var(--azul);border-left:4px solid var(--azul-claro)}
.pb-aviso--alerta{background:#FDF3E2;color:#8A5A11;border-left:4px solid #C9821B}

.pb-lista{margin:0;padding-left:20px;font-size:13.5px;color:var(--negro);line-height:2}
.pb-lista li::marker{color:var(--azul-claro)}

.pb-datos{border-top:1px solid var(--gris-linea);margin-top:16px}
.pb-datos div{display:flex;justify-content:space-between;gap:14px;padding:11px 0;
  border-bottom:1px solid var(--gris-linea);font-size:13.5px}
.pb-datos dt{color:var(--gris);font-weight:600;margin:0}
.pb-datos dd{margin:0;font-weight:700;color:var(--navy);text-align:right}

.pb-pie{text-align:center;margin-top:6px;color:#93A6C4;font-size:11px;line-height:1.7}

.pb-doc{width:100%;height:min(64vh,620px);border:1.5px solid var(--gris-linea);
  border-radius:12px;background:#EEF1F6}

.pb-check{display:flex;gap:11px;align-items:flex-start;cursor:pointer;
  padding:14px;border-radius:11px;background:var(--gris-fondo);border:1.5px solid var(--gris-linea)}
.pb-check input{width:20px;height:20px;accent-color:var(--azul-claro);margin:2px 0 0;flex-shrink:0}
.pb-check span{font-size:13.5px;color:var(--negro);font-weight:600;line-height:1.5}

.pb-exito{text-align:center;padding:14px 0}
.pb-exito__ico{width:74px;height:74px;border-radius:50%;background:#E4F4EC;color:#1E8E5A;
  display:flex;align-items:center;justify-content:center;font-size:38px;margin:0 auto 18px}

.cargando{opacity:.55;pointer-events:none}
.hilo{display:inline-block;width:15px;height:15px;border:2.5px solid rgba(255,255,255,.4);
  border-top-color:#fff;border-radius:50%;animation:gira .7s linear infinite}
@keyframes gira{to{transform:rotate(360deg)}}

/* ============================================================
   PULSO 3.3.0 · lo nuevo, con el mismo sistema de diseño del portal
   ============================================================ */
[hidden]{display:none !important}
a{color:var(--azul-claro)}
.gd-toasts{position:fixed;right:18px;bottom:calc(var(--pie-h) + 18px);z-index:200;display:flex;flex-direction:column;gap:8px;max-width:min(380px,90vw)}
.gd-toast{background:var(--navy);color:#fff;padding:13px 16px;border-radius:12px;box-shadow:var(--sombra);font-size:13px;font-weight:600;line-height:1.45;border-left:4px solid var(--azul-claro);animation:gdSube .18s ease-out}
.gd-toast.err{border-left-color:var(--error)}
@keyframes gdSube{from{transform:translateY(8px);opacity:0}to{transform:none;opacity:1}}
.gd-cargando{text-align:center;color:#C8D6EE;padding:50px 0;font-weight:600;font-size:13.5px}
.gd-cargando .hilo{margin-right:8px;vertical-align:-3px}

/* ---------- tarjetas de inicio (accesos) */
.gd-accesos{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.gd-acceso-t{display:flex;gap:14px;align-items:flex-start;background:#fff;border-radius:var(--r-lg);box-shadow:var(--sombra);padding:18px;text-decoration:none;color:var(--negro);transition:.16s;border:0;font-family:inherit;text-align:left;cursor:pointer}
.gd-acceso-t:hover{transform:translateY(-2px);box-shadow:0 16px 36px rgba(8,18,38,.24)}
.gd-acceso-t__ico{flex:0 0 42px;height:42px;border-radius:12px;background:var(--azul-suave);display:flex;align-items:center;justify-content:center}
.gd-acceso-t__ico svg{width:22px;height:22px;stroke:var(--azul);fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.gd-acceso-t strong{display:block;font-size:14px;font-weight:800;color:var(--navy)}
.gd-acceso-t span{display:block;font-size:12px;color:var(--gris);margin-top:3px;line-height:1.4;font-weight:500}
.gd-acceso-t .gd-eti{margin-top:7px}

/* ---------- ficha del colaborador */
.gd-ficha__ini{width:58px;height:58px;border-radius:50%;background:linear-gradient(135deg,var(--azul),var(--azul-claro));color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:800;flex-shrink:0}
.gd-ficha h2{margin:0;font-size:19px;font-weight:800;color:var(--navy)}
.gd-ficha p{margin:3px 0 0;font-size:13px;color:var(--gris);font-weight:500}
.gd-datos{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:0 22px;margin:0}
.gd-datos div{padding:11px 0;border-bottom:1px solid var(--gris-linea)}
.gd-datos dt{font-size:10.5px;font-weight:800;color:var(--azul);text-transform:uppercase;letter-spacing:.08em}
.gd-datos dd{margin:4px 0 0;font-size:14px;font-weight:600;color:var(--negro);word-break:break-word}
.gd-lista{list-style:none;margin:0;padding:0}
.gd-lista li{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 0;border-bottom:1px solid var(--gris-linea);flex-wrap:wrap}
.gd-lista li:last-child{border-bottom:0}
.gd-lista strong{display:block;font-size:14px;color:var(--navy)}
.gd-lista small{display:block;font-size:12px;color:var(--gris);margin-top:2px;font-weight:500}
.gd-semana{width:100%;border-collapse:collapse}
.gd-semana th{text-align:left;padding:11px 10px;font-size:12.5px;color:var(--gris);font-weight:700;width:42%;border-bottom:1px solid var(--gris-linea)}
.gd-semana td{padding:11px 10px;font-weight:700;color:var(--navy);border-bottom:1px solid var(--gris-linea)}
.gd-memo{white-space:pre-wrap;background:var(--gris-fondo);border-radius:var(--r-md);padding:16px;font-size:14px;line-height:1.65;color:var(--negro)}
.gd-opciones{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));margin-bottom:6px}
.gd-opcion{display:block;padding:14px;border-radius:var(--r-md);border:1.5px solid var(--gris-linea);background:var(--gris-fondo);cursor:pointer;transition:.15s;text-align:left;font-family:inherit}
.gd-opcion:hover{border-color:var(--azul-claro);background:var(--azul-suave)}
.gd-opcion.activo{border-color:var(--azul);background:var(--azul-suave);box-shadow:0 0 0 3px rgba(46,107,212,.15)}
.gd-opcion strong{display:block;font-size:13.5px;color:var(--navy)}
.gd-opcion span{display:block;font-size:11.5px;color:var(--gris);margin-top:3px;line-height:1.4}
.gd-acciones{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:6px}
.gd-pass-reglas{font-size:11.5px;color:var(--gris);margin:-6px 0 14px}
.gd-sinlogin{text-align:center;margin-top:14px}
.gd-sinlogin a{color:#C8D6EE;font-size:12.5px;font-weight:600;text-decoration:none}
.gd-sinlogin a:hover{color:#fff;text-decoration:underline}
.gd-acceso__alterno{display:block;text-align:center;margin-top:16px;font-size:12.5px;color:var(--gris)}
.firma-caja canvas{background:#fff}
.mt12{margin-top:12px}

/* ---------- ventanas (diálogos) */
.modal-bd{position:fixed;inset:0;z-index:150;background:rgba(6,13,28,.62);backdrop-filter:blur(2px);display:flex;align-items:flex-start;justify-content:center;padding:6vh 14px 24px;overflow-y:auto}
.modal{background:#fff;border-radius:var(--r-lg);box-shadow:0 24px 60px rgba(3,10,24,.45);width:min(620px,96vw);outline:none;color:var(--negro);animation:gdSube .18s ease-out}
.modal-h{display:flex;align-items:center;gap:10px;padding:18px 22px;border-bottom:2px solid var(--gris-linea)}
.modal-h h3{margin:0;font-size:16px;font-weight:800;color:var(--azul)}
.modal-b{padding:20px 22px 22px}
.hbtn{border:0;background:var(--azul-suave);color:var(--azul);width:34px;height:34px;border-radius:9px;font-size:20px;cursor:pointer;line-height:1}

/* ============================================================
   portal. (RRHH y gerentes): las pantallas de RRHH se pintan con el mismo
   sistema del portal (tarjetas blancas, títulos sobre el fondo, etiquetas).
   ============================================================ */
.gd-app .page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:0 0 20px}
.gd-app .page-head h1{margin:0;color:#fff;font-size:25px;font-weight:800;letter-spacing:-.01em;text-shadow:0 2px 14px rgba(0,0,0,.45)}
.gd-app .page-head p{margin:6px 0 0;color:#B9CAE6;font-size:13px;font-weight:500;max-width:760px}
.gd-app .page-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.gd-app .card{background:#fff;border-radius:var(--r-lg);box-shadow:var(--sombra);padding:22px 24px;margin-bottom:20px;color:var(--negro)}
.gd-app .card-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding-bottom:12px;margin-bottom:16px;border-bottom:2px solid var(--gris-linea)}
.gd-app .card-h h3{margin:0;font-size:15.5px;font-weight:800;color:var(--azul)}
.gd-app .card-h .sub{font-size:12px;color:var(--gris)}
.gd-app h4{color:var(--azul);font-size:13px;text-transform:uppercase;letter-spacing:.06em;margin:16px 0 8px}
.gd-app .btn,.modal .btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:10px 18px;border:1.5px solid var(--gris-linea);border-radius:var(--r-sm);background:#fff;color:var(--azul);font-family:inherit;font-size:13px;font-weight:700;cursor:pointer;text-decoration:none;transition:.16s;line-height:1.2;white-space:nowrap}
.gd-app .btn:hover,.modal .btn:hover{border-color:var(--azul-claro);background:var(--azul-suave)}
.gd-app .btn.pri,.modal .btn.pri{background:var(--azul);border-color:var(--azul);color:#fff}
.gd-app .btn.pri:hover,.modal .btn.pri:hover{background:#0F3468}
.gd-app .btn.sm,.modal .btn.sm{padding:7px 12px;font-size:12px}
.gd-app .btn:disabled,.modal .btn:disabled{opacity:.55;cursor:not-allowed}
.gd-app .page-head .btn{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.22);color:#fff}
.gd-app .page-head .btn:hover{background:rgba(255,255,255,.2)}
.gd-app .page-head .btn.pri{background:var(--azul-claro);border-color:var(--azul-claro)}
.gd-app .page-head select.inp{background:#fff}
.gd-app .inp,.modal .inp{padding:10px 13px;font-family:inherit;font-size:14px;color:var(--negro);background:var(--gris-fondo);border:1.5px solid var(--gris-linea);border-radius:var(--r-sm);outline:none;transition:.16s;max-width:100%}
.gd-app .inp:focus,.modal .inp:focus{background:#fff;border-color:var(--azul-claro);box-shadow:0 0 0 3px rgba(46,107,212,.15)}
.gd-app textarea.inp,.modal textarea.inp{width:100%;resize:vertical;min-height:90px;line-height:1.5}
.gd-app .rr-form .rr-c,.modal .rr-form .rr-c{font-size:11px;font-weight:700;color:var(--azul);text-transform:uppercase;letter-spacing:.06em}
.gd-app .rr-form .rr-c .inp,.modal .rr-form .rr-c .inp{text-transform:none;letter-spacing:0;font-weight:500}
.gd-app .rr-k,.modal .rr-k{color:var(--negro);font-size:13px;font-weight:500}
.gd-app .sf-row,.modal .sf-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.gd-app .sf-row.between{justify-content:space-between}
.gd-app .sf-stack,.modal .sf-stack{display:flex;flex-direction:column;gap:12px}
.gd-app .sf-grid.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
@media (max-width:900px){ .gd-app .sf-grid.two{grid-template-columns:1fr} }
.gd-app .sf-search{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.gd-app .sf-search .inp{flex:1 1 180px}
.gd-app .sf-sub,.modal .sf-sub{font-size:12px;color:var(--gris);font-weight:500}
.gd-app .sf-note,.modal .sf-note{background:var(--azul-suave);color:var(--azul);border-left:4px solid var(--azul-claro);padding:12px 14px;border-radius:10px;font-size:12.5px;font-weight:600;line-height:1.5;margin:8px 0}
.gd-app .sf-note.sf-error{background:#FDECEA;color:#8E2A1F;border-left-color:var(--error)}
.gd-app .sf-scroll,.modal .sf-scroll{overflow-x:auto;margin:0 -4px}
.gd-app .sf-table,.modal .sf-table{width:100%;border-collapse:collapse;font-size:13px}
.gd-app .sf-table th,.modal .sf-table th{text-align:left;padding:10px 12px;font-size:10.5px;font-weight:800;color:var(--azul);text-transform:uppercase;letter-spacing:.09em;border-bottom:2px solid var(--gris-linea);white-space:nowrap}
.gd-app .sf-table td,.modal .sf-table td{padding:12px;border-bottom:1px solid var(--gris-linea);vertical-align:middle}
.gd-app .sf-table tbody tr:hover{background:var(--gris-fondo)}
.gd-app .sf-table a:not(.btn){color:var(--azul);font-weight:700;text-decoration:none}
.gd-app .sf-data,.modal .sf-data{display:grid;grid-template-columns:minmax(120px,38%) 1fr;gap:0;margin:0}
.gd-app .sf-data dt,.modal .sf-data dt{padding:9px 0;border-bottom:1px solid var(--gris-linea);font-size:11px;font-weight:800;color:var(--azul);text-transform:uppercase;letter-spacing:.06em}
.gd-app .sf-data dd,.modal .sf-data dd{padding:9px 0;margin:0;border-bottom:1px solid var(--gris-linea);font-size:13.5px;font-weight:600}
.gd-app .empty{text-align:center;padding:30px 16px;color:var(--gris)}
.gd-app .empty h4{margin:0 0 4px;color:var(--navy);text-transform:none;letter-spacing:0;font-size:14px}
.gd-app .empty p{margin:0;font-size:12.5px}
.chip{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:20px;font-size:11px;font-weight:700;letter-spacing:.02em;white-space:nowrap;background:#EEF0F4;color:var(--gris)}
.chip.ok{background:#E4F4EC;color:var(--ok)}
.chip.warn{background:#FDF3E2;color:var(--alerta)}
.chip.err{background:#FDECEA;color:var(--error)}
.chip.azul{background:var(--azul-suave);color:var(--azul)}
.gd-app .rr-kpi .card{text-decoration:none;position:relative;overflow:hidden}
.gd-app .rr-kpi b{color:var(--navy) !important;font-size:30px;font-weight:800}
.gd-app .rr-kpi .card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--azul-claro)}
.gd-app .rr-steps span.si{color:var(--ok);border-color:#9FDCC0}
.gd-app .rr-steps span.ya{background:var(--azul);color:#fff}
.gd-app .rr-ev,.gd-app .rr-mono{color:var(--gris)}
.gd-app details.rr-d summary{color:var(--azul);font-weight:700}
.gd-app .rr-grid input{border:1.5px solid var(--gris-linea);border-radius:7px;background:var(--gris-fondo)}
.gd-titulo--fila{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;flex-wrap:wrap}
.pb{padding-bottom:calc(var(--pie-h) + 40px)}
.gd-acceso-t span.gd-eti{display:inline-flex;margin-top:7px}
@media (max-width:640px){
  .gd-rejilla--4{grid-template-columns:repeat(2,1fr);gap:12px}
  .gd-metrica{padding:14px 16px}
  .gd-metrica__val{font-size:24px}
  .gd-metrica__eti{font-size:10px;letter-spacing:.06em}
  .gd-titulo h1{font-size:21px}
  .gd-tarjeta{padding:18px 16px}
  .gd-accesos{grid-template-columns:1fr 1fr;gap:10px}
  .gd-acceso-t{flex-direction:column;gap:10px;padding:14px}
  .gd-acceso-t strong{font-size:13px}
}
.gd-campo label.subir{text-transform:none;letter-spacing:0;color:inherit;font-weight:500}
.gd-campo label.subir b{font-size:14px}
/* guía del colaborador */
.guia{position:relative}
.guia__n{position:absolute;top:-14px;left:20px;width:34px;height:34px;border-radius:50%;background:var(--azul-claro);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;box-shadow:0 6px 16px rgba(46,107,212,.4)}
.guia .pb__h1{margin-top:8px}
.guia__txt{font-size:14px;line-height:1.65;color:var(--negro)}
.guia__txt p{margin:0 0 10px}
.guia__fig{margin:16px auto 0;max-width:340px;border-radius:22px;overflow:hidden;border:6px solid #0E1B33;box-shadow:0 16px 40px rgba(3,10,24,.35);background:#0E1B33}
.guia__fig img{width:100%;display:block}
.pb-btn + .pb-btn{margin-top:12px}
@media (max-width:640px){
  .gd-opciones{grid-template-columns:1fr 1fr;gap:8px}
  .gd-opcion{padding:11px 12px}
  .gd-opcion strong{font-size:12.5px}
  .gd-opcion span{font-size:10.5px}
}
.pb-campo input[type=password]{width:100%;padding:13px 14px;font-family:inherit;font-size:16px;color:var(--negro);background:var(--gris-fondo);border:1.5px solid var(--gris-linea);border-radius:10px;outline:none;transition:.16s;-webkit-appearance:none;appearance:none}
.pb-campo input[type=password]:focus{background:#fff;border-color:var(--azul-claro);box-shadow:0 0 0 3px rgba(46,107,212,.16)}
.gd-app .rr-lote td{padding:8px 6px}
.gd-app .rr-lote td:nth-child(2){min-width:150px}
.gd-app .rr-lote .inp{padding:7px 8px;font-size:12.5px;width:100%;min-width:70px}
.gd-app .rr-lote select.inp{min-width:96px}
.gd-app .rr-lote input[data-k=cargo]{min-width:100px}
.gd-app .rr-lote input[type=date]{min-width:128px}
.gd-app .rr-lote input[data-k=salario]{min-width:84px;font-weight:700}
.gd-app .mt12{margin-top:12px}