:root {
      --itn-amarillo: #ffc400;
      --itn-amarillo-claro: #fff3b3;
      --itn-rojo: #b51f2e;
      --itn-rojo-oscuro: #881722;
      --itn-negro: #151515;
      --itn-carbon: #242424;
      --itn-gris: #5f6670;
      --itn-fondo: #f6f6f4;
      --blanco: #ffffff;
      --borde: #dedede;
      --verde: #166534;
      --verde-fondo: #dcfce7;
      --rojo-error: #991b1b;
      --rojo-error-fondo: #fee2e2;
    }

    * {
      box-sizing: border-box;
    }

    html {
      scroll-behavior: smooth;
    }

    body {
      margin: 0;
      min-height: 100vh;
      font-family: Arial, Helvetica, sans-serif;
      color: var(--itn-negro);
      background:
        radial-gradient(circle at 14% 18%, rgba(255, 196, 0, 0.08), transparent 30%),
        linear-gradient(135deg, #151515 0%, #21191b 55%, #341b20 100%);
    }

    button,
    input,
    select,
    textarea {
      font: inherit;
    }

    button {
      touch-action: manipulation;
    }

    .pagina {
      min-height: 100vh;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 28px 18px;
    }

    .portal {
      width: 100%;
      max-width: 1160px;
      overflow: hidden;
      border: 1px solid rgba(255, 255, 255, 0.16);
      border-radius: 24px;
      background: var(--blanco);
      box-shadow: 0 30px 80px rgba(0, 0, 0, 0.42);
    }

    .zona-acceso {
      display: grid;
      grid-template-columns: minmax(320px, 0.86fr) minmax(440px, 1.24fr);
      min-height: 690px;
    }

    .panel-marca {
      position: relative;
      display: flex;
      flex-direction: column;
      justify-content: center;
      overflow: hidden;
      padding: 46px 40px;
      color: var(--blanco);
      background:
        linear-gradient(160deg, rgba(181, 31, 46, 0.98), rgba(126, 18, 30, 0.98));
    }

    .panel-marca::before {
      content: "";
      position: absolute;
      width: 330px;
      height: 330px;
      top: -170px;
      right: -140px;
      border: 45px solid rgba(255, 196, 0, 0.16);
      border-radius: 50%;
    }

    .panel-marca::after {
      content: "";
      position: absolute;
      width: 280px;
      height: 280px;
      bottom: -160px;
      left: -130px;
      border: 36px solid rgba(255, 255, 255, 0.08);
      border-radius: 50%;
    }

    .marca-contenido {
      position: relative;
      z-index: 1;
      text-align: center;
    }

    .logo-principal {
      width: min(220px, 75%);
      height: auto;
      display: block;
      margin: 0 auto 24px;
      filter: drop-shadow(0 13px 18px rgba(0, 0, 0, 0.28));
    }

    .marca-contenido h1 {
      margin: 0;
      font-size: clamp(30px, 4vw, 45px);
      line-height: 1.05;
    }

    .marca-contenido .institucion {
      margin: 13px 0 0;
      color: var(--itn-amarillo);
      font-size: 18px;
      font-weight: 800;
      letter-spacing: 0.6px;
      text-transform: uppercase;
    }

    .marca-contenido .descripcion {
      max-width: 390px;
      margin: 20px auto 0;
      color: rgba(255, 255, 255, 0.88);
      line-height: 1.65;
    }

    .franja-amarilla {
      width: 84px;
      height: 6px;
      margin: 24px auto 0;
      border-radius: 999px;
      background: var(--itn-amarillo);
    }

    .panel-formulario {
      background: var(--itn-fondo);
    }

    .encabezado-movil {
      display: none;
      padding: 18px;
      text-align: center;
      color: var(--blanco);
      background: var(--itn-rojo);
    }

    .encabezado-movil img {
      width: 90px;
      height: auto;
      vertical-align: middle;
    }

    .pestanas {
      display: flex;
      border-bottom: 1px solid var(--borde);
      background: var(--blanco);
    }

    .pestana {
      flex: 1;
      min-height: 65px;
      padding: 15px 18px;
      border: 0;
      border-bottom: 5px solid transparent;
      background: transparent;
      color: var(--itn-gris);
      font-weight: 800;
      cursor: pointer;
      transition: background 0.2s, color 0.2s, border-color 0.2s;
    }

    .pestana:hover {
      background: #fff8df;
      color: var(--itn-rojo);
    }

    .pestana.activa {
      color: var(--itn-rojo);
      border-bottom-color: var(--itn-amarillo);
      background: var(--blanco);
    }

    .seccion {
      display: none;
      padding: 38px 42px 42px;
    }

    .seccion.activa {
      display: block;
    }

    .titulo-seccion {
      margin: 0;
      color: var(--itn-rojo);
      font-size: 29px;
    }

    .descripcion-seccion {
      margin: 8px 0 28px;
      color: var(--itn-gris);
      line-height: 1.5;
    }

    .formulario-login {
      max-width: 480px;
    }

    .rejilla {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 17px;
    }

    .campo {
      display: flex;
      flex-direction: column;
      gap: 7px;
    }

    .campo-completo {
      grid-column: 1 / -1;
    }

    label {
      color: #333333;
      font-size: 14px;
      font-weight: 800;
    }

    input,
    select,
    textarea {
      width: 100%;
      padding: 13px 14px;
      border: 1px solid #cfcfcf;
      border-radius: 10px;
      background: var(--blanco);
      color: var(--itn-negro);
      transition: border-color 0.2s, box-shadow 0.2s;
    }

    input:focus,
    select:focus,
    textarea:focus {
      outline: none;
      border-color: var(--itn-rojo);
      box-shadow: 0 0 0 3px rgba(181, 31, 46, 0.13);
    }

    textarea {
      min-height: 105px;
      resize: vertical;
    }

    .grupo-contrasena {
      position: relative;
    }

    .grupo-contrasena input {
      padding-right: 50px;
    }

    .mostrar-contrasena {
      position: absolute;
      top: 50%;
      right: 8px;
      width: 36px;
      height: 36px;
      padding: 0;
      border: 0;
      border-radius: 8px;
      transform: translateY(-50%);
      background: transparent;
      color: var(--itn-rojo);
      cursor: pointer;
    }

    .mostrar-contrasena:hover {
      background: var(--itn-amarillo-claro);
    }

    .boton-principal {
      width: 100%;
      min-height: 49px;
      margin-top: 22px;
      padding: 13px 20px;
      border: 0;
      border-radius: 10px;
      background:
        linear-gradient(135deg, var(--itn-rojo), var(--itn-rojo-oscuro));
      color: var(--blanco);
      font-weight: 900;
      cursor: pointer;
      box-shadow: 0 9px 18px rgba(181, 31, 46, 0.22);
      transition: transform 0.2s, box-shadow 0.2s;
    }

    .boton-principal:hover {
      transform: translateY(-1px);
      box-shadow: 0 12px 24px rgba(181, 31, 46, 0.28);
    }

    .boton-principal:disabled {
      opacity: 0.62;
      cursor: not-allowed;
      transform: none;
    }

    .boton-secundario {
      min-height: 44px;
      padding: 11px 19px;
      border: 2px solid var(--itn-rojo);
      border-radius: 10px;
      background: var(--blanco);
      color: var(--itn-rojo);
      font-weight: 900;
      cursor: pointer;
    }

    .boton-secundario:hover {
      background: #fff1f2;
    }

    .nota {
      margin-top: 18px;
      padding: 14px;
      border-left: 5px solid var(--itn-amarillo);
      border-radius: 7px;
      background: #fff8d9;
      color: #5a4a00;
      font-size: 14px;
      line-height: 1.5;
    }

    .nota-privacidad {
      border-left-color: var(--itn-rojo);
      background: #fff0f1;
      color: #6e1c25;
    }

    .mensaje {
      display: none;
      margin-top: 18px;
      padding: 13px;
      border-radius: 9px;
      text-align: center;
      line-height: 1.4;
    }

    .mensaje.error {
      display: block;
      background: var(--rojo-error-fondo);
      color: var(--rojo-error);
    }

    .mensaje.correcto {
      display: block;
      background: var(--verde-fondo);
      color: var(--verde);
    }

    .panel-usuario {
      display: none;
      min-height: 690px;
      background: var(--itn-fondo);
    }

    .panel-usuario.activo {
      display: block;
    }

    .barra-panel {
      position: relative;
      display: flex;
      align-items: center;
      gap: 18px;
      padding: 20px 30px;
      color: var(--blanco);
      background:
        linear-gradient(135deg, var(--itn-rojo), var(--itn-rojo-oscuro));
      border-bottom: 7px solid var(--itn-amarillo);
    }

    .logo-panel {
      width: 76px;
      height: 76px;
      object-fit: contain;
      flex: 0 0 auto;
    }

    .barra-panel h2 {
      margin: 0;
      font-size: 25px;
    }

    .barra-panel p {
      margin: 5px 0 0;
      color: rgba(255, 255, 255, 0.84);
    }

    .contenido-panel {
      padding: 32px;
    }

    .encabezado-panel {
      text-align: center;
    }

    .encabezado-panel h3 {
      margin: 0;
      color: var(--itn-rojo);
      font-size: 28px;
    }

    .insignia {
      display: inline-block;
      margin-top: 13px;
      padding: 8px 16px;
      border-radius: 999px;
      background: var(--itn-amarillo);
      color: var(--itn-negro);
      font-weight: 900;
    }

    .datos-usuario {
      max-width: 720px;
      margin: 25px auto 0;
      padding: 23px;
      border: 1px solid var(--borde);
      border-top: 6px solid var(--itn-amarillo);
      border-radius: 14px;
      background: var(--blanco);
      box-shadow: 0 10px 24px rgba(0, 0, 0, 0.06);
    }

    .dato {
      display: flex;
      gap: 10px;
      margin: 11px 0;
      padding-bottom: 11px;
      border-bottom: 1px solid #ececec;
    }

    .dato:last-child {
      padding-bottom: 0;
      border-bottom: 0;
    }

    .dato strong {
      min-width: 190px;
      color: var(--itn-rojo);
    }

    .modulos {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 16px;
      max-width: 800px;
      margin: 28px auto 0;
    }

    .modulo {
      position: relative;
      overflow: hidden;
      padding: 21px;
      border: 1px solid var(--borde);
      border-radius: 14px;
      background: var(--blanco);
      text-align: left;
      cursor: pointer;
      box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05);
      transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s;
    }

    .modulo::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 7px;
      height: 100%;
      background: var(--itn-amarillo);
    }

    .modulo:hover {
      transform: translateY(-2px);
      border-color: var(--itn-rojo);
      box-shadow: 0 12px 26px rgba(181, 31, 46, 0.12);
    }

    .modulo h4 {
      margin: 0 0 8px;
      color: var(--itn-rojo);
      font-size: 18px;
    }

    .modulo p {
      margin: 0;
      color: var(--itn-gris);
      line-height: 1.45;
    }

    .acciones-panel {
      display: flex;
      justify-content: center;
      margin-top: 28px;
    }

    .cargando {
      display: none;
      position: fixed;
      inset: 0;
      z-index: 9999;
      align-items: center;
      justify-content: center;
      padding: 20px;
      background: rgba(18, 18, 18, 0.78);
    }

    .cargando.activo {
      display: flex;
    }

    .cuadro-cargando {
      min-width: 230px;
      padding: 25px;
      border-top: 6px solid var(--itn-amarillo);
      border-radius: 14px;
      background: var(--blanco);
      text-align: center;
      box-shadow: 0 22px 55px rgba(0, 0, 0, 0.32);
    }

    .spinner {
      width: 44px;
      height: 44px;
      margin: 0 auto 14px;
      border: 5px solid #ececec;
      border-top-color: var(--itn-rojo);
      border-radius: 50%;
      animation: girar 0.8s linear infinite;
    }

    @keyframes girar {
      to {
        transform: rotate(360deg);
      }
    }


    .acciones-usuario-tabla {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      align-items: center;
    }

    .panel-eliminar-usuario {
      margin-top: 18px;
      padding: 18px;
      border: 1px solid #fecaca;
      border-left: 7px solid #991b1b;
      border-radius: 14px;
      background: #fff1f2;
      color: #6b1119;
    }

    .panel-eliminar-usuario h3 {
      margin: 0 0 8px;
      color: #991b1b;
    }

    .panel-eliminar-usuario p {
      margin: 6px 0;
      line-height: 1.5;
    }

    .acciones-eliminar-usuario {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin-top: 15px;
    }

    .oculto {
      display: none !important;
    }


    .solo-administrador.oculto-rol,
    .solo-personal.oculto-rol,
    .solo-estudiante.oculto-rol,
    .solo-delegado.oculto-rol,
    .solo-docente.oculto-rol { display: none !important; }

    .panel-gestion-roles {
      padding: clamp(28px, 5vw, 64px) clamp(20px, 7vw, 110px);
      background: #ffffff;
    }

    .tarjeta-alta-usuario {
      max-width: 920px;
      margin: 0 auto;
      padding: 28px;
      border: 1px solid #e1dadd;
      border-top: 7px solid var(--itn-amarillo);
      border-radius: 18px;
      background: #ffffff;
      box-shadow: 0 16px 36px rgba(42, 24, 29, 0.08);
    }

    .selector-rol-manual {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 10px;
      margin-bottom: 22px;
    }

    .selector-rol-manual button {
      min-height: 46px;
      border: 1px solid #d8cfd2;
      border-radius: 10px;
      background: #fff;
      color: #7f1723;
      font-weight: 900;
      cursor: pointer;
    }

    .nota-formulario-personal {
      margin: 0 0 16px;
      padding: 12px 14px;
      border-left: 5px solid var(--itn-amarillo);
      border-radius: 10px;
      background: #fff8df;
      color: #5f4500;
      font-size: 13px;
      font-weight: 700;
      line-height: 1.45;
    }

    .selector-rol-manual button.activo {
      border-color: var(--itn-rojo);
      background: var(--itn-rojo);
      color: #fff;
    }


    /* =========================================================
       INSCRIPCIONES Y GESTIÓN DE GRUPOS
       ========================================================= */

    .bloque-inscripcion {
      display: grid;
      gap: 22px;
    }

    .resumen-inscripcion {
      padding: 24px;
      border: 1px solid #e2dcde;
      border-top: 7px solid var(--itn-amarillo);
      border-radius: 17px;
      background: #ffffff;
      box-shadow: 0 12px 28px rgba(42, 24, 29, 0.06);
    }

    .resumen-inscripcion h3 {
      margin: 0 0 8px;
      color: #8d1724;
      font-size: 23px;
    }

    .resumen-inscripcion p {
      margin: 0;
      color: #716a6d;
      line-height: 1.55;
    }

    .datos-inscripcion {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
      margin-top: 18px;
    }

    .dato-inscripcion {
      padding: 13px;
      border: 1px solid #ece5e8;
      border-radius: 12px;
      background: #faf8f7;
    }

    .dato-inscripcion strong {
      display: block;
      margin-bottom: 5px;
      color: #8d1724;
      font-size: 13px;
    }

    .dato-inscripcion span {
      color: #34282b;
      line-height: 1.35;
    }

    .grid-actividades-dinamicas,
    .grid-grupos-gestion {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 18px;
    }

    .tarjeta-actividad-dinamica,
    .tarjeta-grupo-gestion {
      overflow: hidden;
      border: 1px solid #e2dcde;
      border-radius: 17px;
      background: #ffffff;
      box-shadow: 0 12px 28px rgba(42, 24, 29, 0.06);
    }

    .tarjeta-actividad-dinamica header,
    .tarjeta-grupo-gestion header {
      padding: 20px;
      color: #ffffff;
      background: linear-gradient(135deg, #831522, #bd2738);
    }

    .tarjeta-actividad-dinamica header span,
    .tarjeta-grupo-gestion header span {
      display: block;
      margin-bottom: 6px;
      color: rgba(255, 255, 255, 0.78);
      font-size: 12px;
      font-weight: 900;
      letter-spacing: 0.8px;
      text-transform: uppercase;
    }

    .tarjeta-actividad-dinamica h3,
    .tarjeta-grupo-gestion h3 {
      margin: 0;
      font-size: 22px;
    }

    .cuerpo-actividad-dinamica,
    .cuerpo-grupo-gestion {
      padding: 20px;
    }

    .cuerpo-actividad-dinamica p,
    .cuerpo-grupo-gestion p {
      margin: 0 0 14px;
      color: #716a6d;
      line-height: 1.5;
    }

    .lista-grupos-dinamicos {
      display: grid;
      gap: 12px;
    }

    .grupo-opcion {
      padding: 15px;
      border: 1px solid #e7dfe2;
      border-radius: 13px;
      background: #faf8f7;
    }

    .grupo-opcion strong {
      display: block;
      color: #8d1724;
      font-size: 16px;
    }

    .grupo-opcion .detalle-grupo {
      display: block;
      margin-top: 5px;
      color: #655c60;
      font-size: 13px;
      line-height: 1.45;
    }

    .acciones-grupo {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      margin-top: 13px;
    }

    .insignia-estado {
      display: inline-flex;
      align-items: center;
      min-height: 27px;
      padding: 4px 10px;
      border-radius: 999px;
      background: #fff1b7;
      color: #5a3d00;
      font-size: 12px;
      font-weight: 900;
      white-space: nowrap;
    }

    .insignia-estado.inscrito {
      background: var(--verde-fondo);
      color: var(--verde);
    }

    .insignia-estado.espera {
      background: #fff7cc;
      color: #7a5800;
    }

    .insignia-estado.cancelado {
      background: var(--rojo-error-fondo);
      color: var(--rojo-error);
    }

    .boton-mini {
      min-height: 36px;
      padding: 8px 12px;
      border: 0;
      border-radius: 9px;
      background: var(--itn-rojo);
      color: #ffffff;
      font-size: 13px;
      font-weight: 900;
      cursor: pointer;
    }

    .boton-mini:hover {
      background: var(--itn-rojo-oscuro);
    }

    .boton-mini:disabled {
      opacity: 0.58;
      cursor: not-allowed;
    }

    .boton-mini.secundario {
      border: 1px solid var(--itn-rojo);
      background: #ffffff;
      color: var(--itn-rojo);
    }

    .boton-mini.peligro {
      background: #991b1b;
    }

    .control-cupo {
      display: flex;
      gap: 10px;
      margin-top: 14px;
    }

    .control-cupo input {
      max-width: 120px;
    }

    .tabla-responsive {
      overflow-x: auto;
      border: 1px solid #e2dcde;
      border-radius: 14px;
      background: #ffffff;
      box-shadow: 0 12px 28px rgba(42, 24, 29, 0.06);
    }

    .tabla-gestion {
      width: 100%;
      min-width: 950px;
      border-collapse: collapse;
    }

    .tabla-gestion th,
    .tabla-gestion td {
      padding: 12px;
      border-bottom: 1px solid #ece5e8;
      text-align: left;
      vertical-align: top;
      font-size: 13px;
    }

    .tabla-gestion th {
      color: #8d1724;
      background: #fff7dc;
      font-size: 12px;
      text-transform: uppercase;
    }

    .tabla-gestion tr:last-child td {
      border-bottom: 0;
    }



    /* =========================================================
       AVISOS POR ACTIVIDAD Y GRUPO
       ========================================================= */

    .cabecera-avisos {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 18px;
      margin-bottom: 22px;
    }

    .resumen-destino-aviso {
      display: inline-flex;
      align-items: center;
      min-height: 34px;
      padding: 7px 12px;
      border-radius: 999px;
      background: #fff4c7;
      color: #664700;
      font-size: 13px;
      font-weight: 900;
    }

    .grid-avisos {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 18px;
    }

    .tarjeta-aviso {
      position: relative;
      overflow: hidden;
      padding: 22px;
      border: 1px solid #e5dde0;
      border-radius: 16px;
      background: #ffffff;
      box-shadow: 0 12px 28px rgba(42, 24, 29, 0.06);
    }

    .tarjeta-aviso::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 7px;
      height: 100%;
      background: var(--itn-amarillo);
    }

    .tarjeta-aviso h4 {
      margin: 0 0 9px;
      color: var(--itn-rojo);
      font-size: 19px;
    }

    .tarjeta-aviso p {
      margin: 0;
      color: #62595c;
      line-height: 1.55;
      white-space: pre-wrap;
    }

    .meta-aviso {
      display: flex;
      flex-wrap: wrap;
      gap: 7px;
      margin-top: 16px;
    }

    .meta-aviso span {
      padding: 5px 9px;
      border-radius: 999px;
      background: #f3efef;
      color: #584d50;
      font-size: 11px;
      font-weight: 800;
    }

    .formulario-aviso {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 15px;
      margin-bottom: 25px;
      padding: 22px;
      border: 1px solid #e5dde0;
      border-top: 6px solid var(--itn-amarillo);
      border-radius: 16px;
      background: #ffffff;
      box-shadow: 0 12px 28px rgba(42, 24, 29, 0.06);
    }

    .formulario-aviso .campo-completo {
      grid-column: 1 / -1;
    }


    /* =========================================================
       ADMINISTRACIÓN COMPLETA DE PERSONAL Y SOLICITUDES
       ========================================================= */

    .formulario-completo-personal {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 15px;
    }

    .formulario-completo-personal .campo-completo {
      grid-column: 1 / -1;
    }

    .panel-administracion-extra {
      margin-top: 28px;
      padding: 24px;
      border: 1px solid #363636;
      border-top: 6px solid var(--itn-amarillo);
      border-radius: 16px;
      background: #151515;
    }

    .panel-administracion-extra h3 {
      margin-top: 0;
      color: #ffffff;
    }

    .tabla-usuarios-completa {
      width: 100%;
      min-width: 1200px;
      border-collapse: collapse;
    }

    .tabla-usuarios-completa th,
    .tabla-usuarios-completa td {
      padding: 10px;
      border-bottom: 1px solid #333333;
      color: #f4f4f4;
      text-align: left;
      font-size: 12px;
    }

    .tabla-usuarios-completa th {
      background: #221719;
      color: var(--itn-amarillo);
    }

    .editor-usuario {
      display: none;
      margin-top: 20px;
      padding: 20px;
      border: 1px solid #3d3d3d;
      border-radius: 14px;
      background: #111111;
    }

    .editor-usuario.activo {
      display: block;
    }

    .grid-solicitudes {
      display: grid;
      gap: 14px;
    }

    .tarjeta-solicitud {
      padding: 18px;
      border: 1px solid #3a3a3a;
      border-left: 6px solid var(--itn-amarillo);
      border-radius: 13px;
      background: #171717;
      color: #f3f3f3;
    }

    .acciones-solicitud {
      display: flex;
      flex-wrap: wrap;
      gap: 9px;
      margin-top: 14px;
    }

    @media (max-width: 900px) {
      .formulario-completo-personal {
        grid-template-columns: 1fr;
      }

      .formulario-completo-personal .campo-completo {
        grid-column: auto;
      }
    }

    @media (max-width: 760px) {
      .grid-avisos,
      .formulario-aviso {
        grid-template-columns: 1fr;
      }

      .formulario-aviso .campo-completo {
        grid-column: auto;
      }

      .cabecera-avisos {
        display: block;
      }

      .resumen-destino-aviso {
        margin-top: 12px;
      }
    }

    @media (max-width: 760px) {
      .selector-rol-manual { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    }

    @media (max-width: 860px) {
      .zona-acceso {
        grid-template-columns: 1fr;
      }

      .panel-marca {
        display: none;
      }

      .encabezado-movil {
        display: block;
      }
    }

    @media (max-width: 650px) {
      .pagina {
        align-items: flex-start;
        padding: 10px;
      }

      .portal {
        border-radius: 15px;
      }

      .seccion,
      .contenido-panel {
        padding: 25px 17px;
      }

      .rejilla,
      .modulos {
        grid-template-columns: 1fr;
      }

      .campo-completo {
        grid-column: auto;
      }

      .barra-panel {
        align-items: flex-start;
        padding: 17px;
      }

      .logo-panel {
        width: 62px;
        height: 62px;
      }

      .dato {
        display: block;
      }

      .dato strong {
        display: block;
        min-width: 0;
        margin-bottom: 5px;
      }
    }


    /* =========================================================
       INICIO INTERNO A PANTALLA COMPLETA
       ========================================================= */

    body.sesion-activa {
      background: #f4f2ee;
    }

    body.sesion-activa .pagina {
      min-height: 100vh;
      display: block;
      padding: 0;
      background: #f4f2ee;
    }

    body.sesion-activa .portal {
      width: 100%;
      max-width: none;
      min-height: 100vh;
      border: 0;
      border-radius: 0;
      background: #f4f2ee;
      box-shadow: none;
    }

    .app-interna {
      min-height: 100vh;
      background: #f4f2ee;
    }

    .cabecera-app {
      position: sticky;
      top: 0;
      z-index: 2000;
      display: grid;
      grid-template-columns: auto 1fr auto;
      align-items: center;
      gap: 24px;
      min-height: 82px;
      padding: 12px clamp(18px, 4vw, 64px);
      color: #ffffff;
      background: linear-gradient(110deg, #911725 0%, #b51f2e 56%, #7b111e 100%);
      border-bottom: 6px solid var(--itn-amarillo);
      box-shadow: 0 8px 24px rgba(33, 16, 19, 0.18);
    }

    .marca-app {
      display: flex;
      align-items: center;
      gap: 13px;
      min-width: max-content;
      color: #ffffff;
      text-decoration: none;
      cursor: pointer;
    }

    .marca-app img {
      width: 57px;
      height: 57px;
      object-fit: contain;
      filter: drop-shadow(0 5px 7px rgba(0, 0, 0, 0.25));
    }

    .marca-app strong {
      display: block;
      font-size: 18px;
      line-height: 1.05;
    }

    .marca-app span {
      display: block;
      margin-top: 4px;
      color: var(--itn-amarillo);
      font-size: 12px;
      font-weight: 800;
      letter-spacing: 0.65px;
      text-transform: uppercase;
    }

    .menu-principal {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 4px;
    }

    .menu-principal button {
      min-height: 42px;
      padding: 10px 13px;
      border: 0;
      border-radius: 9px;
      background: transparent;
      color: rgba(255, 255, 255, 0.9);
      font-size: 14px;
      font-weight: 800;
      cursor: pointer;
      transition: background 0.2s, color 0.2s;
    }

    .menu-principal button:hover,
    .menu-principal button.activo {
      color: #1b1718;
      background: var(--itn-amarillo);
    }

    .usuario-cabecera {
      display: flex;
      align-items: center;
      gap: 12px;
      min-width: max-content;
    }

    .usuario-cabecera-info {
      text-align: right;
    }

    .usuario-cabecera-info strong {
      display: block;
      max-width: 190px;
      overflow: hidden;
      font-size: 13px;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .usuario-cabecera-info span {
      display: inline-block;
      margin-top: 4px;
      padding: 3px 9px;
      border-radius: 999px;
      background: var(--itn-amarillo);
      color: #171313;
      font-size: 10px;
      font-weight: 900;
    }

    .cerrar-cabecera {
      min-height: 39px;
      padding: 8px 13px;
      border: 1px solid rgba(255, 255, 255, 0.65);
      border-radius: 9px;
      background: transparent;
      color: #ffffff;
      font-weight: 800;
      cursor: pointer;
    }

    .cerrar-cabecera:hover {
      background: rgba(255, 255, 255, 0.12);
    }

    /* =========================================================
       V43 - Menú superior limpio y botón cerrar sesión visible
       ========================================================= */
    .cabecera-app {
      grid-template-columns: auto minmax(0, 1fr) auto;
      gap: 12px;
    }

    .menu-principal {
      min-width: 0;
      justify-content: flex-start;
      overflow-x: auto;
      scrollbar-width: none;
    }

    .menu-principal::-webkit-scrollbar {
      display: none;
    }

    .menu-principal button {
      flex: 0 0 auto;
      padding: 9px 11px;
      font-size: 13px;
      white-space: nowrap;
    }

    .usuario-cabecera {
      justify-self: end;
      gap: 8px;
    }

    .cerrar-cabecera {
      min-width: 122px;
      background: rgba(255, 255, 255, 0.08);
    }

    /* Estos módulos ya aparecen como tarjetas en Acciones rápidas.
       Se ocultan del menú superior para que no se amontone. */
    .menu-principal button[data-seccion="proximas"],
    .menu-principal button[data-seccion="organigramaExtraescolar"],
    .menu-principal button[data-seccion="comentariosAlumnos"],
    .menu-principal button[data-seccion="importarAlumnosExcel"],
    .menu-principal button[data-seccion="gestionRoles"],
    #botonAdministracionGlobal,
    .menu-principal button.solo-delegado {
      display: none !important;
    }

    @media (max-width: 1500px) {
      .marca-app span {
        display: none;
      }

      .marca-app strong {
        font-size: 16px;
      }

      .usuario-cabecera-info strong {
        max-width: 125px;
      }
    }

    @media (max-width: 760px) {
      .usuario-cabecera-info {
        display: none;
      }

      .cerrar-cabecera {
        min-width: auto;
        padding-inline: 10px;
      }
    }


    .boton-menu-movil {
      display: none;
      width: 44px;
      height: 44px;
      border: 1px solid rgba(255, 255, 255, 0.55);
      border-radius: 9px;
      background: transparent;
      color: #ffffff;
      font-size: 22px;
      cursor: pointer;
    }

    .contenido-inicio {
      min-height: calc(100vh - 82px);
      background: #f4f2ee;
    }

    .hero-inicio {
      position: relative;
      overflow: hidden;
      display: grid;
      grid-template-columns: minmax(0, 1.25fr) minmax(280px, 0.75fr);
      align-items: center;
      gap: clamp(30px, 6vw, 80px);
      min-height: 500px;
      padding: clamp(56px, 8vw, 105px) clamp(22px, 7vw, 110px);
      color: #ffffff;
      background:
        radial-gradient(circle at 82% 18%, rgba(255, 196, 0, 0.26), transparent 24%),
        linear-gradient(120deg, #171516 0%, #2d1c20 44%, #7f1723 100%);
    }

    .hero-inicio::before {
      content: "";
      position: absolute;
      width: 420px;
      height: 420px;
      top: -210px;
      right: -70px;
      border: 58px solid rgba(255, 196, 0, 0.11);
      border-radius: 50%;
    }

    .hero-inicio::after {
      content: "";
      position: absolute;
      width: 290px;
      height: 290px;
      left: -145px;
      bottom: -180px;
      border: 42px solid rgba(255, 255, 255, 0.06);
      border-radius: 50%;
    }

    .hero-contenido,
    .hero-logo {
      position: relative;
      z-index: 1;
    }

    .etiqueta-hero {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 18px;
      padding: 8px 13px;
      border: 1px solid rgba(255, 196, 0, 0.56);
      border-radius: 999px;
      background: rgba(255, 196, 0, 0.12);
      color: #ffe37f;
      font-size: 12px;
      font-weight: 900;
      letter-spacing: 0.7px;
      text-transform: uppercase;
    }

    .hero-contenido h1 {
      max-width: 780px;
      margin: 0;
      font-size: clamp(40px, 6vw, 76px);
      line-height: 0.98;
      letter-spacing: -1.8px;
    }

    .hero-contenido h1 span {
      color: var(--itn-amarillo);
    }

    .hero-contenido p {
      max-width: 720px;
      margin: 24px 0 0;
      color: rgba(255, 255, 255, 0.84);
      font-size: clamp(16px, 1.5vw, 20px);
      line-height: 1.65;
    }

    .acciones-hero {
      display: flex;
      flex-wrap: wrap;
      gap: 13px;
      margin-top: 30px;
    }

    .boton-hero-principal,
    .boton-hero-secundario {
      min-height: 49px;
      padding: 13px 21px;
      border-radius: 10px;
      font-weight: 900;
      cursor: pointer;
    }

    .boton-hero-principal {
      border: 0;
      background: var(--itn-amarillo);
      color: #181313;
      box-shadow: 0 10px 24px rgba(255, 196, 0, 0.18);
    }

    .boton-hero-secundario {
      border: 1px solid rgba(255, 255, 255, 0.58);
      background: rgba(255, 255, 255, 0.06);
      color: #ffffff;
    }

    .hero-logo {
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .hero-logo-marco {
      position: relative;
      display: grid;
      place-items: center;
      width: min(360px, 76vw);
      aspect-ratio: 1;
      border: 1px solid rgba(255, 255, 255, 0.16);
      border-radius: 50%;
      background: rgba(255, 255, 255, 0.06);
      box-shadow: inset 0 0 0 26px rgba(255, 196, 0, 0.05), 0 28px 55px rgba(0, 0, 0, 0.24);
      backdrop-filter: blur(6px);
    }

    .hero-logo-marco img {
      width: 72%;
      height: 72%;
      object-fit: contain;
      filter: drop-shadow(0 16px 18px rgba(0, 0, 0, 0.34));
    }

    .seccion-inicio {
      padding: clamp(52px, 7vw, 88px) clamp(20px, 7vw, 110px);
    }

    .seccion-inicio.blanca {
      background: #ffffff;
    }

    .seccion-inicio.suave {
      background: #f4f2ee;
    }

    .cabecera-seccion-inicio {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      gap: 20px;
      margin-bottom: 28px;
    }

    .cabecera-seccion-inicio .sobrelinea {
      display: block;
      margin-bottom: 8px;
      color: var(--itn-rojo);
      font-size: 12px;
      font-weight: 900;
      letter-spacing: 1px;
      text-transform: uppercase;
    }

    .cabecera-seccion-inicio h2 {
      margin: 0;
      color: #24191b;
      font-size: clamp(28px, 3.3vw, 44px);
      line-height: 1.08;
    }

    .cabecera-seccion-inicio p {
      max-width: 600px;
      margin: 10px 0 0;
      color: #676064;
      line-height: 1.6;
    }

    .grid-acciones-inicio {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 16px;
    }

    .accion-inicio {
      position: relative;
      overflow: hidden;
      min-height: 190px;
      padding: 24px;
      border: 1px solid #e1dadd;
      border-radius: 16px;
      background: #ffffff;
      text-align: left;
      cursor: pointer;
      box-shadow: 0 12px 28px rgba(44, 24, 29, 0.06);
      transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
    }

    .accion-inicio::after {
      content: "";
      position: absolute;
      width: 82px;
      height: 82px;
      top: -34px;
      right: -30px;
      border-radius: 50%;
      background: rgba(255, 196, 0, 0.16);
    }

    .accion-inicio:hover {
      transform: translateY(-4px);
      border-color: rgba(181, 31, 46, 0.55);
      box-shadow: 0 18px 34px rgba(181, 31, 46, 0.12);
    }

    .accion-icono {
      display: grid;
      place-items: center;
      width: 48px;
      height: 48px;
      margin-bottom: 20px;
      border-radius: 13px;
      background: #fff1b7;
      color: #8d1724;
      font-size: 22px;
      font-weight: 900;
    }

    .accion-inicio h3 {
      margin: 0 0 8px;
      color: #8d1724;
      font-size: 18px;
    }

    .accion-inicio p {
      margin: 0;
      color: #696064;
      line-height: 1.5;
    }

    .grid-categorias {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 20px;
    }

    .categoria-inicio {
      position: relative;
      overflow: hidden;
      min-height: 290px;
      padding: 28px;
      border-radius: 18px;
      color: #ffffff;
      box-shadow: 0 18px 36px rgba(28, 18, 20, 0.14);
    }

    .categoria-inicio.deportiva {
      background: linear-gradient(145deg, #831522, #bd2738);
    }

    .categoria-inicio.cultural {
      background: linear-gradient(145deg, #1f1d1e, #3e3033);
    }

    .categoria-inicio.civica {
      color: #211718;
      background: linear-gradient(145deg, #f4b900, #ffd84e);
    }

    .categoria-numero {
      display: block;
      margin-bottom: 55px;
      font-size: 13px;
      font-weight: 900;
      letter-spacing: 1px;
      opacity: 0.8;
    }

    .categoria-inicio h3 {
      margin: 0 0 10px;
      font-size: 31px;
    }

    .categoria-inicio p {
      max-width: 380px;
      margin: 0;
      line-height: 1.58;
      opacity: 0.86;
    }

    .categoria-inicio button {
      margin-top: 23px;
      padding: 10px 15px;
      border: 1px solid currentColor;
      border-radius: 9px;
      background: transparent;
      color: inherit;
      font-weight: 900;
      cursor: pointer;
    }

    .categoria-decoracion {
      position: absolute;
      width: 175px;
      height: 175px;
      top: -74px;
      right: -62px;
      border: 28px solid rgba(255, 255, 255, 0.11);
      border-radius: 50%;
    }

    .categoria-inicio.civica .categoria-decoracion {
      border-color: rgba(111, 69, 0, 0.13);
    }

    /* =========================================================
       CATÁLOGO DE ACTIVIDADES
       ========================================================= */

    .catalogo-actividades {
      display: grid;
      gap: 24px;
    }

    .grupo-actividad {
      overflow: hidden;
      border: 1px solid #e1dadd;
      border-radius: 20px;
      background: #ffffff;
      box-shadow: 0 16px 36px rgba(42, 24, 29, 0.08);
    }

    .grupo-actividad-encabezado {
      position: relative;
      overflow: hidden;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 22px;
      padding: 28px 30px;
      color: #ffffff;
    }

    .grupo-actividad.deportiva .grupo-actividad-encabezado {
      background: linear-gradient(135deg, #831522, #bd2738);
    }

    .grupo-actividad.cultural .grupo-actividad-encabezado {
      background: linear-gradient(135deg, #1f1d1e, #49383c);
    }

    .grupo-actividad.civica .grupo-actividad-encabezado {
      color: #24191b;
      background: linear-gradient(135deg, #f1b600, #ffd852);
    }

    .grupo-actividad-encabezado::after {
      content: "";
      position: absolute;
      width: 180px;
      height: 180px;
      top: -92px;
      right: -55px;
      border: 30px solid rgba(255, 255, 255, 0.12);
      border-radius: 50%;
    }

    .grupo-actividad.civica .grupo-actividad-encabezado::after {
      border-color: rgba(89, 53, 0, 0.11);
    }

    .grupo-actividad-titulo {
      position: relative;
      z-index: 1;
    }

    .grupo-actividad-titulo span {
      display: block;
      margin-bottom: 7px;
      font-size: 12px;
      font-weight: 900;
      letter-spacing: 1px;
      opacity: 0.82;
      text-transform: uppercase;
    }

    .grupo-actividad-titulo h3 {
      margin: 0;
      font-size: clamp(27px, 3vw, 38px);
    }

    .grupo-actividad-contador {
      position: relative;
      z-index: 1;
      flex: 0 0 auto;
      display: grid;
      place-items: center;
      min-width: 76px;
      min-height: 76px;
      padding: 10px;
      border: 1px solid rgba(255, 255, 255, 0.34);
      border-radius: 50%;
      background: rgba(255, 255, 255, 0.10);
      font-size: 23px;
      font-weight: 900;
    }

    .grupo-actividad.civica .grupo-actividad-contador {
      border-color: rgba(66, 40, 0, 0.24);
      background: rgba(255, 255, 255, 0.22);
    }

    .lista-actividades {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 13px;
      padding: 24px;
    }

    .actividad-item {
      position: relative;
      overflow: hidden;
      min-height: 96px;
      padding: 17px 17px 17px 20px;
      border: 1px solid #e4dde0;
      border-radius: 13px;
      background: #ffffff;
      color: #2d2225;
      text-align: left;
      cursor: pointer;
      box-shadow: 0 7px 17px rgba(42, 24, 29, 0.045);
      transition:
        transform 0.2s,
        border-color 0.2s,
        box-shadow 0.2s,
        background 0.2s;
    }

    .actividad-item::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 6px;
      height: 100%;
      background: #b51f2e;
    }

    .grupo-actividad.cultural .actividad-item::before {
      background: #2f282a;
    }

    .grupo-actividad.civica .actividad-item::before {
      background: #efb700;
    }

    .actividad-item:hover {
      transform: translateY(-3px);
      border-color: rgba(181, 31, 46, 0.55);
      background: #fffdfb;
      box-shadow: 0 13px 25px rgba(181, 31, 46, 0.11);
    }

    .actividad-item strong {
      position: relative;
      display: block;
      margin-bottom: 7px;
      color: #8d1724;
      font-size: 16px;
      line-height: 1.25;
    }

    .grupo-actividad.cultural .actividad-item strong {
      color: #302628;
    }

    .grupo-actividad.civica .actividad-item strong {
      color: #6b4d00;
    }

    .actividad-item span {
      position: relative;
      display: block;
      color: #756d70;
      font-size: 13px;
      line-height: 1.4;
    }

    @media (max-width: 1050px) {
      .lista-actividades {
        grid-template-columns: repeat(3, minmax(0, 1fr));
      }
    }

    @media (max-width: 760px) {
      .grupo-actividad-encabezado {
        padding: 23px 20px;
      }

      .grupo-actividad-contador {
        min-width: 62px;
        min-height: 62px;
        font-size: 19px;
      }

      .lista-actividades {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        padding: 17px;
      }
    }

    @media (max-width: 480px) {
      .lista-actividades {
        grid-template-columns: 1fr;
      }

      .actividad-item {
        min-height: 82px;
      }
    }

    .grid-dos-columnas {
      display: grid;
      grid-template-columns: 1.15fr 0.85fr;
      gap: 24px;
    }

    .panel-informacion {
      min-height: 300px;
      padding: 28px;
      border: 1px solid #e2dcde;
      border-radius: 17px;
      background: #ffffff;
      box-shadow: 0 12px 28px rgba(42, 24, 29, 0.06);
    }

    .panel-informacion h3 {
      margin: 0;
      color: #8d1724;
      font-size: 22px;
    }

    .panel-informacion .subtexto {
      margin: 8px 0 22px;
      color: #716a6d;
      line-height: 1.5;
    }

    .estado-vacio {
      display: grid;
      place-items: center;
      min-height: 180px;
      padding: 24px;
      border: 2px dashed #ded5d8;
      border-radius: 13px;
      background: #faf8f7;
      color: #746d70;
      text-align: center;
      line-height: 1.6;
    }

    .estado-vacio strong {
      display: block;
      margin-bottom: 5px;
      color: #3c2d31;
    }

    .perfil-inicio {
      display: grid;
      grid-template-columns: 0.75fr 1.25fr;
      gap: 28px;
      align-items: stretch;
    }

    .perfil-presentacion {
      position: relative;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 12px;
      min-height: 430px;
      padding: 34px;
      border-radius: 18px;
      color: #ffffff;
      background: linear-gradient(145deg, #8b1724, #3b1d22);
      text-align: center;
    }

    .perfil-presentacion::before {
      content: "";
      position: absolute;
      width: 250px;
      height: 250px;
      top: -130px;
      right: -90px;
      border: 40px solid rgba(255, 196, 0, 0.16);
      border-radius: 50%;
    }

    .perfil-presentacion img {
      position: relative;
      z-index: 1;
      width: min(335px, 76vw);
      height: min(335px, 76vw);
      object-fit: contain;
      filter: drop-shadow(0 12px 15px rgba(0, 0, 0, 0.28));
    }

    .perfil-presentacion img.foto-perfil-alumno {
      border: 9px solid rgba(255, 196, 0, 0.98);
      border-radius: 50%;
      background: #ffffff;
      object-fit: cover;
      box-shadow: 0 16px 34px rgba(0, 0, 0, 0.28);
    }

    .perfil-estado-foto {
      position: relative;
      z-index: 2;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      max-width: 220px;
      padding: 7px 13px;
      border-radius: 999px;
      background: rgba(255, 196, 0, 0.96);
      color: #201113;
      font-size: 11px;
      font-weight: 900;
      text-transform: uppercase;
    }

    .perfil-presentacion h3 {
      position: relative;
      margin: 0 0 8px;
      font-size: 29px;
    }

    .perfil-presentacion p {
      position: relative;
      margin: 0;
      color: rgba(255, 255, 255, 0.8);
    }

    .datos-perfil-inicio {
      padding: 30px;
      border: 1px solid #e0dadd;
      border-top: 7px solid var(--itn-amarillo);
      border-radius: 18px;
      background: #ffffff;
      box-shadow: 0 14px 32px rgba(42, 24, 29, 0.07);
    }

    .dato-perfil {
      display: grid;
      grid-template-columns: minmax(150px, 0.42fr) 1fr;
      gap: 18px;
      padding: 16px 0;
      border-bottom: 1px solid #eee8ea;
    }

    .dato-perfil:last-child {
      border-bottom: 0;
    }

    .dato-perfil strong {
      color: #8d1724;
    }

    .datos-perfil-inicio h3 {
      margin: 0 0 16px;
      color: #8d1724;
      font-size: 21px;
    }

    .datos-perfil-seccion {
      margin-top: 24px;
      padding-top: 18px;
      border-top: 1px solid #eee8ea;
    }

    .datos-perfil-seccion:first-child {
      margin-top: 0;
      padding-top: 0;
      border-top: 0;
    }

    .datos-perfil-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0 28px;
    }

    .dato-perfil span {
      color: #261c1f;
      word-break: break-word;
    }

    .dato-perfil span.sin-dato {
      color: #81777a;
      font-style: italic;
    }
    .boton-perfil-editar {
      position: relative;
      z-index: 2;
      margin-top: 8px;
      padding: 11px 18px;
      border: 0;
      border-radius: 999px;
      background: var(--itn-amarillo);
      color: #221719;
      font-weight: 900;
      cursor: pointer;
      box-shadow: 0 10px 22px rgba(0, 0, 0, 0.18);
    }

    .boton-perfil-editar:hover {
      transform: translateY(-1px);
    }

    .acciones-perfil-datos {
      display: flex;
      justify-content: flex-end;
      margin: 18px 0 4px;
    }

    .editor-mi-perfil {
      margin-top: 24px;
      padding: 24px;
      border: 1px solid #eadfe2;
      border-top: 7px solid var(--itn-rojo);
      border-radius: 16px;
      background: #fffaf6;
    }

    .editor-mi-perfil h3 {
      margin: 0 0 8px;
      color: var(--itn-rojo);
      font-size: 22px;
    }

    .editor-mi-perfil p {
      margin: 0 0 20px;
      color: #685f62;
      line-height: 1.5;
    }

    .formulario-perfil-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 16px;
    }

    .acciones-perfil-editor {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
      margin-top: 22px;
    }

    .nota-perfil-bloqueado {
      margin: 10px 0 0;
      color: #73676b;
      font-size: 13px;
      line-height: 1.45;
    }


    .pie-app {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
      padding: 28px clamp(20px, 7vw, 110px);
      color: rgba(255, 255, 255, 0.76);
      background: #181516;
      border-top: 6px solid var(--itn-amarillo);
    }

    .pie-app strong {
      color: #ffffff;
    }

    .solo-delegado.oculto-rol,
    .solo-estudiante.oculto-rol {
      display: none !important;
    }

    @media (max-width: 1120px) {
      .cabecera-app {
        grid-template-columns: auto auto 1fr;
      }

      .boton-menu-movil {
        display: block;
      }

      .menu-principal {
        position: absolute;
        top: calc(100% + 1px);
        left: 0;
        right: 0;
        display: none;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        padding: 10px clamp(18px, 4vw, 64px) 16px;
        background: #831522;
        box-shadow: 0 14px 24px rgba(0, 0, 0, 0.2);
      }

      .menu-principal.abierto {
        display: flex;
      }

      .menu-principal button {
        width: 100%;
        text-align: left;
      }

      .usuario-cabecera {
        justify-self: end;
      }

      .grid-acciones-inicio {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

    @media (max-width: 900px) {
      .hero-inicio {
        grid-template-columns: 1fr;
        min-height: auto;
      }

      .hero-logo {
        order: -1;
      }

      .hero-logo-marco {
        width: min(270px, 70vw);
      }

      .grid-categorias,
      .grid-dos-columnas,
      .perfil-inicio,
      .datos-perfil-grid,
      .formulario-perfil-grid,
      .grid-actividades-dinamicas,
      .grid-grupos-gestion,
      .datos-inscripcion {
        grid-template-columns: 1fr;
      }
    }

    @media (max-width: 650px) {
      .cabecera-app {
        grid-template-columns: 1fr auto;
        gap: 12px;
        min-height: 74px;
        padding: 10px 14px;
      }

      .marca-app img {
        width: 49px;
        height: 49px;
      }

      .marca-app strong {
        font-size: 15px;
      }

      .marca-app span {
        font-size: 10px;
      }

      .boton-menu-movil {
        grid-column: 2;
        grid-row: 1;
      }

      .usuario-cabecera {
        grid-column: 1 / -1;
        justify-content: space-between;
        width: 100%;
        padding-top: 8px;
        border-top: 1px solid rgba(255, 255, 255, 0.2);
      }

      .usuario-cabecera-info {
        text-align: left;
      }

      .menu-principal {
        top: 100%;
        padding-left: 14px;
        padding-right: 14px;
      }

      .hero-inicio {
        padding: 48px 19px 58px;
      }

      .hero-contenido h1 {
        font-size: 42px;
        letter-spacing: -1px;
      }

      .acciones-hero {
        flex-direction: column;
      }

      .boton-hero-principal,
      .boton-hero-secundario {
        width: 100%;
      }

      .seccion-inicio {
        padding: 52px 17px;
      }

      .cabecera-seccion-inicio {
        align-items: flex-start;
        flex-direction: column;
      }

      .grid-acciones-inicio {
        grid-template-columns: 1fr;
      }

      .dato-perfil {
        grid-template-columns: 1fr;
        gap: 5px;
      }

      .pie-app {
        align-items: flex-start;
        flex-direction: column;
        padding: 26px 17px;
      }
    }


    /* =========================================================
       MODAL FLOTANTE DE INSCRIPCIÓN
       ========================================================= */

    .modal-inscripcion {
      position: fixed;
      inset: 0;
      z-index: 5000;
      display: none;
      align-items: center;
      justify-content: center;
      padding: 22px;
      background: rgba(18, 18, 18, 0.72);
      backdrop-filter: blur(3px);
    }

    .modal-inscripcion.activo {
      display: flex;
    }

    .modal-inscripcion-contenido {
      width: min(1080px, 100%);
      max-height: 90vh;
      overflow: hidden;
      border-radius: 22px;
      background: #ffffff;
      box-shadow: 0 28px 70px rgba(0, 0, 0, 0.35);
      display: flex;
      flex-direction: column;
    }

    .modal-inscripcion-encabezado {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 18px;
      padding: 24px 28px 20px;
      color: #ffffff;
      background: linear-gradient(120deg, #911725 0%, #b51f2e 56%, #7b111e 100%);
      border-bottom: 6px solid var(--itn-amarillo);
    }

    .modal-inscripcion-encabezado .sobrelinea {
      display: block;
      margin-bottom: 8px;
      color: #ffe37f;
      font-size: 12px;
      font-weight: 900;
      letter-spacing: 1px;
      text-transform: uppercase;
    }

    .modal-inscripcion-encabezado h2 {
      margin: 0;
      font-size: clamp(28px, 4vw, 42px);
      line-height: 1.05;
    }

    .modal-inscripcion-encabezado p {
      margin: 10px 0 0;
      max-width: 760px;
      color: rgba(255, 255, 255, 0.88);
      line-height: 1.55;
    }

    .boton-cerrar-modal {
      flex: 0 0 auto;
      width: 46px;
      height: 46px;
      border: 1px solid rgba(255, 255, 255, 0.55);
      border-radius: 12px;
      background: rgba(255, 255, 255, 0.08);
      color: #ffffff;
      font-size: 24px;
      font-weight: 900;
      cursor: pointer;
    }

    .boton-cerrar-modal:hover {
      background: rgba(255, 255, 255, 0.16);
    }

    .modal-inscripcion-cuerpo {
      padding: 24px 28px 28px;
      overflow: auto;
      background: #f7f4f1;
    }

    .estado-inscripcion-modal {
      margin-bottom: 22px;
      padding: 18px 20px;
      border: 1px solid #eaded6;
      border-left: 6px solid var(--itn-amarillo);
      border-radius: 16px;
      background: #ffffff;
    }

    .estado-inscripcion-modal h3 {
      margin: 0 0 10px;
      color: #8d1724;
      font-size: 24px;
    }

    .estado-inscripcion-modal p {
      margin: 0;
      color: #625a5f;
      line-height: 1.6;
    }

    .estado-inscripcion-modal.activa {
      border-left-color: #15803d;
      background: #f0fdf4;
    }

    .estado-inscripcion-modal.espera {
      border-left-color: #d97706;
      background: #fff7ed;
    }

    .tarjeta-actividad-modal {
      overflow: hidden;
      border: 1px solid #e4d9dd;
      border-radius: 18px;
      background: #ffffff;
      box-shadow: 0 12px 30px rgba(28, 16, 18, 0.07);
    }

    .tarjeta-actividad-modal-encabezado {
      padding: 22px 22px 18px;
      color: #ffffff;
      background: linear-gradient(145deg, #8f1724, #c72338);
    }

    .tarjeta-actividad-modal-encabezado .categoria {
      display: block;
      margin-bottom: 8px;
      color: #ffe38b;
      font-size: 12px;
      font-weight: 900;
      letter-spacing: 1px;
      text-transform: uppercase;
    }

    .tarjeta-actividad-modal-encabezado h4 {
      margin: 0;
      font-size: clamp(28px, 4vw, 36px);
    }

    .tarjeta-actividad-modal-cuerpo {
      padding: 22px;
    }

    .tarjeta-actividad-modal-cuerpo p {
      margin: 0 0 14px;
      color: #625a5f;
      line-height: 1.6;
    }

    .requisitos-modal {
      margin-bottom: 18px;
      font-weight: 700;
      color: #342628;
    }

    .grid-grupos-modal {
      display: grid;
      grid-template-columns: 1fr;
      gap: 15px;
    }

    .grupo-modal {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
      padding: 18px;
      border: 1px solid #e6dde0;
      border-radius: 16px;
      background: #fcfbfb;
    }

    .grupo-modal-info h5 {
      margin: 0 0 7px;
      color: #8d1724;
      font-size: 22px;
    }

    .grupo-modal-info .datos {
      color: #625a5f;
      line-height: 1.55;
    }

    .etiquetas-grupo {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-top: 12px;
    }

    .etiqueta-grupo {
      display: inline-flex;
      align-items: center;
      min-height: 30px;
      padding: 6px 12px;
      border-radius: 999px;
      background: #eef8ef;
      color: #166534;
      font-size: 14px;
      font-weight: 800;
    }

    .etiqueta-grupo.lleno {
      background: #fff1f2;
      color: #9f1239;
    }

    .etiqueta-grupo.espera {
      background: #fff7ed;
      color: #b45309;
    }

    .acciones-grupo-modal {
      flex: 0 0 auto;
      display: flex;
      align-items: center;
    }

    .boton-inscribirse-modal {
      min-width: 145px;
      min-height: 46px;
      padding: 12px 18px;
      border: 0;
      border-radius: 10px;
      background: linear-gradient(135deg, var(--itn-rojo), var(--itn-rojo-oscuro));
      color: #ffffff;
      font-weight: 900;
      cursor: pointer;
      box-shadow: 0 8px 18px rgba(181, 31, 46, 0.18);
    }

    .boton-inscribirse-modal:hover {
      transform: translateY(-1px);
    }

    .boton-inscribirse-modal:disabled {
      opacity: 0.55;
      cursor: not-allowed;
      transform: none;
    }

    .sin-grupos-modal {
      padding: 34px 20px;
      border: 2px dashed #ddd1d5;
      border-radius: 16px;
      text-align: center;
      color: #6a6267;
      background: #fff;
    }

    .modal-actividad-no-configurada {
      padding: 34px 22px;
      border: 2px dashed #ddd1d5;
      border-radius: 18px;
      background: #ffffff;
      color: #625a5f;
      text-align: center;
      line-height: 1.6;
    }

    .modal-actividad-no-configurada strong {
      display: block;
      margin-bottom: 8px;
      color: #8d1724;
      font-size: 22px;
    }

    @media (max-width: 860px) {
      .grupo-modal {
        flex-direction: column;
        align-items: stretch;
      }

      .acciones-grupo-modal {
        width: 100%;
      }

      .boton-inscribirse-modal {
        width: 100%;
      }
    }

    @media (max-width: 640px) {
      .modal-inscripcion {
        padding: 10px;
      }

      .modal-inscripcion-encabezado,
      .modal-inscripcion-cuerpo {
        padding: 18px;
      }
    }


    /* =========================================================
       MODAL PREMIUM: IMAGEN, DELEGADO Y GRUPOS
       ========================================================= */

    .modal-inscripcion-contenido {
      width: min(1180px, 100%);
      border: 1px solid rgba(255, 255, 255, 0.16);
    }

    .modal-inscripcion-cuerpo {
      background:
        radial-gradient(circle at 9% 0%, rgba(255, 196, 0, 0.15), transparent 32%),
        linear-gradient(135deg, #f9f5ef 0%, #fff 54%, #f7f1f3 100%);
    }

    .tarjeta-premium-modal {
      border: 0;
      background: transparent;
      box-shadow: none;
    }

    .actividad-premium-grid {
      display: grid;
      grid-template-columns: minmax(0, 1.45fr) minmax(300px, 0.55fr);
      gap: 22px;
      align-items: start;
    }

    .actividad-premium-principal,
    .actividad-premium-lateral {
      display: grid;
      gap: 18px;
    }

    .actividad-premium-principal {
      overflow: hidden;
      border: 1px solid #e4d9dd;
      border-radius: 22px;
      background: #ffffff;
      box-shadow: 0 18px 42px rgba(42, 24, 29, 0.11);
    }

    .tarjeta-premium-modal .tarjeta-actividad-modal-encabezado {
      position: relative;
      overflow: hidden;
      min-height: 155px;
      padding: 28px 30px;
      background:
        radial-gradient(circle at 88% 12%, rgba(255, 196, 0, 0.30), transparent 24%),
        linear-gradient(120deg, #7d1320 0%, #b51f2e 54%, #cf2b3e 100%);
    }

    .tarjeta-premium-modal .tarjeta-actividad-modal-encabezado::after {
      content: "";
      position: absolute;
      width: 190px;
      height: 190px;
      right: -72px;
      top: -82px;
      border: 34px solid rgba(255, 255, 255, 0.11);
      border-radius: 50%;
    }

    .tarjeta-premium-modal .tarjeta-actividad-modal-encabezado .categoria,
    .tarjeta-premium-modal .tarjeta-actividad-modal-encabezado h4 {
      position: relative;
      z-index: 1;
    }

    .tarjeta-premium-modal .tarjeta-actividad-modal-cuerpo {
      padding: 26px 30px 30px;
    }

    .modal-badges-premium {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin: 18px 0 20px;
    }

    .badge-premium {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      min-height: 34px;
      padding: 7px 13px;
      border-radius: 999px;
      background: #fff7d6;
      color: #7a4b00;
      font-size: 13px;
      font-weight: 900;
    }

    .badge-premium.rojo {
      background: #fff1f2;
      color: #9f1239;
    }

    .recursos-actividad-premium {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin-bottom: 22px;
    }

    .boton-recurso-premium,
    .boton-contacto-delegado {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 39px;
      padding: 9px 13px;
      border: 1px solid #d7cbd0;
      border-radius: 10px;
      background: #ffffff;
      color: #8d1724;
      font-size: 13px;
      font-weight: 900;
      text-decoration: none;
      cursor: pointer;
    }

    .boton-recurso-premium:hover,
    .boton-contacto-delegado:hover {
      border-color: #b51f2e;
      background: #fff1f2;
    }

    .subtitulo-grupos-modal {
      margin: 4px 0 14px;
      color: #24191b;
      font-size: 22px;
    }

    .actividad-imagen-premium {
      position: relative;
      overflow: hidden;
      min-height: 260px;
      border-radius: 22px;
      background:
        radial-gradient(circle at 80% 10%, rgba(255, 196, 0, 0.25), transparent 28%),
        linear-gradient(145deg, #1f1d1e, #7d1320);
      box-shadow: 0 18px 42px rgba(42, 24, 29, 0.14);
    }

    .actividad-imagen-premium img {
      width: 100%;
      height: 100%;
      min-height: 260px;
      display: block;
      object-fit: cover;
    }

    .actividad-imagen-premium.sin-imagen {
      display: grid;
      place-items: center;
      padding: 24px;
      color: #ffffff;
      text-align: center;
    }

    .actividad-imagen-premium.sin-imagen strong {
      display: block;
      margin-bottom: 8px;
      color: #ffc400;
      font-size: 26px;
    }

    .actividad-imagen-etiqueta {
      position: absolute;
      left: 18px;
      bottom: 18px;
      max-width: calc(100% - 36px);
      padding: 9px 13px;
      border-radius: 999px;
      background: rgba(20, 18, 19, 0.82);
      color: #ffffff;
      font-size: 13px;
      font-weight: 900;
      backdrop-filter: blur(4px);
    }

    .delegado-premium {
      overflow: hidden;
      border: 1px solid #e4d9dd;
      border-radius: 22px;
      background: #ffffff;
      box-shadow: 0 18px 42px rgba(42, 24, 29, 0.10);
    }

    .delegado-premium-encabezado {
      padding: 18px 20px;
      color: #ffffff;
      background: linear-gradient(135deg, #21191b, #5b1b24);
    }

    .delegado-premium-encabezado span {
      display: block;
      color: #ffc400;
      font-size: 11px;
      font-weight: 900;
      letter-spacing: 1px;
      text-transform: uppercase;
    }

    .delegado-premium-encabezado h5 {
      margin: 6px 0 0;
      font-size: 21px;
    }

    .delegado-premium-cuerpo {
      display: grid;
      gap: 14px;
      padding: 18px 20px 20px;
    }

    .delegado-identidad {
      display: flex;
      gap: 13px;
      align-items: center;
    }

    .delegado-foto-premium {
      flex: 0 0 auto;
      width: 74px;
      height: 74px;
      overflow: hidden;
      border: 3px solid #ffc400;
      border-radius: 18px;
      background: #8d1724;
      color: #ffffff;
      display: grid;
      place-items: center;
      font-size: 22px;
      font-weight: 900;
    }

    .delegado-foto-premium img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }

    .delegado-datos strong {
      display: block;
      color: #8d1724;
      font-size: 17px;
    }

    .delegado-datos span {
      display: block;
      margin-top: 4px;
      color: #625a5f;
      font-size: 13px;
      line-height: 1.35;
    }

    .delegado-descripcion {
      margin: 0;
      color: #625a5f;
      line-height: 1.55;
    }

    .delegado-contacto {
      display: grid;
      grid-template-columns: 1fr;
      gap: 8px;
    }

    .delegado-vacio .delegado-premium-cuerpo {
      color: #625a5f;
      line-height: 1.55;
    }


    .galeria-actividad-premium {
      overflow: hidden;
      border: 1px solid #e4d9dd;
      border-radius: 22px;
      background: #ffffff;
      box-shadow: 0 18px 42px rgba(42, 24, 29, 0.10);
    }

    .galeria-actividad-encabezado {
      padding: 18px 20px;
      color: #ffffff;
      background: linear-gradient(135deg, #21191b, #5b1b24);
    }

    .galeria-actividad-encabezado span {
      display: block;
      color: #ffc400;
      font-size: 11px;
      font-weight: 900;
      letter-spacing: 1px;
      text-transform: uppercase;
    }

    .galeria-actividad-encabezado h5 {
      margin: 6px 0 0;
      font-size: 22px;
    }

    .galeria-actividad-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
      padding: 14px;
    }

    .galeria-foto-item {
      position: relative;
      overflow: hidden;
      min-height: 118px;
      border: 1px solid #eadfe3;
      border-radius: 16px;
      background:
        radial-gradient(circle at 82% 12%, rgba(255, 196, 0, 0.28), transparent 28%),
        linear-gradient(145deg, #25191c, #8d1724);
    }

    .galeria-foto-item img {
      width: 100%;
      height: 100%;
      min-height: 118px;
      display: block;
      object-fit: cover;
    }

    .galeria-foto-item.sin-foto {
      display: grid;
      place-items: center;
      padding: 12px;
      color: rgba(255, 255, 255, 0.88);
      text-align: center;
      font-size: 12px;
      font-weight: 800;
      line-height: 1.35;
    }

    .grupo-modal.seleccionable {
      position: relative;
      align-items: stretch;
      cursor: pointer;
      transition: border-color 0.2s, box-shadow 0.2s, transform 0.2s;
    }

    .grupo-modal.seleccionable:hover {
      border-color: rgba(181, 31, 46, 0.45);
      box-shadow: 0 14px 30px rgba(181, 31, 46, 0.10);
      transform: translateY(-1px);
    }

    .grupo-modal.seleccionado {
      border-color: var(--itn-rojo);
      box-shadow: 0 0 0 3px rgba(181, 31, 46, 0.12), 0 14px 30px rgba(181, 31, 46, 0.12);
    }

    .grupo-radio-modal {
      position: absolute;
      opacity: 0;
      pointer-events: none;
    }

    .selector-circulo-modal {
      flex: 0 0 auto;
      width: 26px;
      height: 26px;
      margin-top: 4px;
      border: 3px solid #d7cbd0;
      border-radius: 50%;
      background: #ffffff;
    }

    .grupo-modal.seleccionado .selector-circulo-modal {
      border-color: var(--itn-rojo);
      box-shadow: inset 0 0 0 5px #ffffff;
      background: var(--itn-rojo);
    }

    .confirmacion-grupo-modal {
      position: sticky;
      bottom: -30px;
      z-index: 3;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      margin-top: 22px;
      padding: 16px;
      border: 1px solid #e4d9dd;
      border-radius: 18px;
      background: rgba(255, 255, 255, 0.94);
      box-shadow: 0 -8px 28px rgba(42, 24, 29, 0.10);
      backdrop-filter: blur(8px);
    }

    .ayuda-confirmacion-modal {
      margin: 0;
      color: #625a5f;
      font-size: 13px;
      line-height: 1.45;
    }

    .boton-confirmar-grupo-modal {
      min-width: 230px;
      min-height: 48px;
      padding: 12px 18px;
      border: 0;
      border-radius: 12px;
      background: linear-gradient(135deg, var(--itn-rojo), var(--itn-rojo-oscuro));
      color: #ffffff;
      font-weight: 900;
      cursor: pointer;
      box-shadow: 0 10px 22px rgba(181, 31, 46, 0.20);
    }

    .boton-confirmar-grupo-modal:disabled {
      opacity: 0.56;
      cursor: not-allowed;
      box-shadow: none;
    }

    .boton-confirmar-grupo-modal.espera {
      background: linear-gradient(135deg, #b45309, #92400e);
    }

    @media (max-width: 760px) {
      .galeria-actividad-grid {
        grid-template-columns: 1fr;
      }

      .confirmacion-grupo-modal {
        align-items: stretch;
        flex-direction: column;
      }

      .boton-confirmar-grupo-modal {
        width: 100%;
      }
    }

    .grupo-modal {
      border-radius: 18px;
      background: linear-gradient(180deg, #ffffff 0%, #fffafa 100%);
      box-shadow: 0 10px 24px rgba(42, 24, 29, 0.05);
    }

    @media (max-width: 980px) {
      .actividad-premium-grid {
        grid-template-columns: 1fr;
      }

      .actividad-premium-lateral {
        grid-template-columns: 1fr;
      }
    }


    /* =========================================================
       AJUSTES MODAL GRANDE + FOTOS AMPLIAS
       ========================================================= */

    .modal-inscripcion {
      padding: 10px;
    }

    .modal-inscripcion-contenido {
      width: min(1680px, calc(100vw - 20px));
      max-height: 96vh;
      border-radius: 26px;
    }

    .modal-inscripcion-encabezado {
      padding: 30px 38px 26px;
    }

    .modal-inscripcion-encabezado h2 {
      font-size: clamp(34px, 4.2vw, 56px);
    }

    .modal-inscripcion-cuerpo {
      padding: 32px 38px 38px;
    }

    .actividad-premium-grid {
      grid-template-columns: minmax(0, 1.18fr) minmax(420px, 0.82fr);
      gap: 28px;
    }

    .actividad-premium-lateral {
      gap: 22px;
    }

    .actividad-imagen-premium,
    .delegado-foto-premium {
      width: 100%;
      min-height: clamp(320px, 34vh, 460px);
      height: clamp(320px, 34vh, 460px);
      border-radius: 24px;
    }

    .delegado-foto-premium {
      border: 0;
      box-shadow: 0 18px 42px rgba(42, 24, 29, 0.14);
      font-size: 54px;
    }

    .actividad-imagen-premium img,
    .delegado-foto-premium img {
      width: 100%;
      height: 100%;
      min-height: clamp(320px, 34vh, 460px);
      object-fit: cover;
    }

    .delegado-identidad {
      display: grid;
      gap: 16px;
      align-items: stretch;
    }

    .delegado-datos {
      padding: 0 4px;
    }

    .delegado-datos strong {
      font-size: 24px;
    }

    .delegado-datos span {
      font-size: 15px;
    }

    .delegado-premium-encabezado {
      padding: 22px 24px;
    }

    .delegado-premium-encabezado h5 {
      font-size: 26px;
    }

    .delegado-premium-cuerpo {
      padding: 22px 24px 24px;
      gap: 18px;
    }

    .delegado-descripcion {
      font-size: 15px;
    }

    .grupo-modal {
      padding: 20px;
    }

    @media (max-width: 1180px) {
      .actividad-premium-grid {
        grid-template-columns: 1fr;
      }

      .actividad-imagen-premium,
      .delegado-foto-premium {
        min-height: 300px;
        height: 300px;
      }

      .actividad-imagen-premium img,
      .delegado-foto-premium img {
        min-height: 300px;
      }
    }

    @media (max-width: 640px) {
      .modal-inscripcion-contenido {
        width: calc(100vw - 12px);
        max-height: 97vh;
        border-radius: 18px;
      }

      .modal-inscripcion-encabezado,
      .modal-inscripcion-cuerpo {
        padding: 18px;
      }

      .actividad-imagen-premium,
      .delegado-foto-premium {
        min-height: 230px;
        height: 230px;
      }

      .actividad-imagen-premium img,
      .delegado-foto-premium img {
        min-height: 230px;
      }
    }

  
    .centro-profesional{margin-top:28px;padding:26px;border:1px solid #ddd;border-top:7px solid var(--itn-amarillo);border-radius:18px;background:#fff;box-shadow:0 16px 36px rgba(0,0,0,.08)}
    .centro-profesional h3{margin:0 0 8px;color:var(--itn-rojo)}
    .grid-profesional{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:18px}
    .tarjeta-profesional{padding:18px;border:1px solid #e5dfe1;border-radius:14px;background:#fafafa}
    .tarjeta-profesional h4{margin:0 0 12px;color:var(--itn-rojo)}
    .tabla-profesional{width:100%;min-width:1100px;border-collapse:collapse}.tabla-profesional th,.tabla-profesional td{padding:10px;border-bottom:1px solid #eee;text-align:left;font-size:12px}.tabla-profesional th{background:#fff4c7;color:#7f1723}
    @media(max-width:900px){.grid-profesional{grid-template-columns:1fr}}

  
    .consola-maestra{margin-top:24px;padding:24px;border:1px solid #dedede;border-top:7px solid var(--itn-amarillo);border-radius:18px;background:#fff;box-shadow:0 14px 34px rgba(0,0,0,.08)}
    .consola-menu{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}.consola-menu button{padding:10px 13px;border:1px solid #d7ced1;border-radius:10px;background:#fff;color:var(--itn-rojo);font-weight:800;cursor:pointer}.consola-menu button.activo{background:var(--itn-rojo);color:#fff}
    .editor-maestro{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin-top:18px;padding:18px;border-radius:14px;background:#f7f5f5}.editor-maestro .campo-completo{grid-column:1/-1}.acciones-editor{display:flex;flex-wrap:wrap;gap:9px;grid-column:1/-1}.tabla-maestra td,.tabla-maestra th{font-size:12px;vertical-align:top}
    @media(max-width:900px){.editor-maestro{grid-template-columns:1fr}.editor-maestro .campo-completo,.acciones-editor{grid-column:auto}}


    .centro-profesional {
      width: 100%;
      padding: clamp(24px, 4vw, 54px);
      background: #f6f6f4;
    }

    .centro-profesional.activa {
      display: block !important;
    }

    .consola-maestra {
      margin-top: 24px;
      padding: 24px;
      border: 1px solid #dedede;
      border-top: 7px solid var(--itn-amarillo);
      border-radius: 18px;
      background: #ffffff;
      box-shadow: 0 16px 36px rgba(0, 0, 0, 0.08);
    }

    .consola-menu {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin: 18px 0;
    }

    .consola-menu button {
      padding: 10px 14px;
      border: 1px solid #d7cfd1;
      border-radius: 10px;
      background: #ffffff;
      color: var(--itn-rojo);
      font-weight: 900;
      cursor: pointer;
    }

    .consola-menu button.activo {
      background: var(--itn-rojo);
      color: #ffffff;
    }

    .editor-maestro {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 14px;
      margin-top: 20px;
      padding: 20px;
      border-radius: 14px;
      background: #f8f5f6;
    }

    @media (max-width: 900px) {
      .editor-maestro {
        grid-template-columns: 1fr;
      }
    }

  

/* PATCH V3 - Panel de gestión por rol */
.panel-gestion-actividad-v3{display:grid;gap:18px}
.barra-rol-actividad{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:15px 17px;border:1px solid #ead6da;border-radius:15px;background:#fff8da;color:#4b121a}
.barra-rol-actividad strong{color:var(--itn-rojo)}
.pestanas-actividad-v3{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 0}
.pestanas-actividad-v3 button{min-height:39px;border:1px solid #d8c0c5;border-radius:999px;background:#fff;color:#7f1723;font-weight:900;cursor:pointer;padding:8px 14px}
.pestanas-actividad-v3 button.activo{background:var(--itn-rojo);color:#fff;border-color:var(--itn-rojo)}
.panel-tab-actividad-v3{display:none;padding:18px;border:1px solid #eadde0;border-radius:16px;background:#fff;box-shadow:0 10px 24px rgba(42,24,29,.06)}
.panel-tab-actividad-v3.activo{display:block}
.form-grid-v3{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.form-grid-v3 .campo-completo{grid-column:1/-1}
.acciones-v3{display:flex;flex-wrap:wrap;gap:10px;margin-top:15px}
.tabla-v3{width:100%;border-collapse:collapse;min-width:760px}
.tabla-v3 th,.tabla-v3 td{padding:10px;border-bottom:1px solid #eee;text-align:left;font-size:13px;vertical-align:top}
.tabla-v3 th{color:#8d1724;background:#fff7dc;text-transform:uppercase;font-size:12px}
.estado-v3{display:inline-flex;padding:4px 9px;border-radius:999px;background:#f3efef;font-size:11px;font-weight:900;color:#5d5155}
.estado-v3.pendiente{background:#fff4c7;color:#664700}.estado-v3.aprobada{background:#dcfce7;color:#166534}.estado-v3.rechazada{background:#fee2e2;color:#991b1b}
.resumen-actividad-lectura-v3{display:grid;grid-template-columns:minmax(0,1fr) minmax(290px,.72fr);gap:18px}
.solo-lectura-v3{padding:14px;border-left:5px solid var(--itn-amarillo);border-radius:10px;background:#fff8da;color:#594608;line-height:1.5}
@media(max-width:850px){.form-grid-v3,.resumen-actividad-lectura-v3{grid-template-columns:1fr}.panel-tab-actividad-v3{padding:14px}}



/* PATCH V11 - panel promotor, representativos y avisos */
.resumen-delegado-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:12px 0 18px}
.resumen-delegado-card{border:1px solid #e3d7da;border-radius:14px;background:#fff;padding:15px;box-shadow:0 10px 24px rgba(44,24,29,.06)}
.resumen-delegado-card strong{display:block;color:#911725;font-size:24px;line-height:1}.resumen-delegado-card span{display:block;margin-top:6px;color:#676064;font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:.4px}
.barra-filtros-delegado{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:14px 0}.barra-filtros-delegado input,.barra-filtros-delegado select{max-width:260px}
.badge-representativo{display:inline-flex;align-items:center;gap:5px;padding:4px 9px;border-radius:999px;background:#fff3b3;color:#4d3500;font-size:11px;font-weight:900;text-transform:uppercase}.badge-normal{display:inline-flex;padding:4px 9px;border-radius:999px;background:#f1f1f1;color:#555;font-size:11px;font-weight:800}.check-representativo{width:20px;height:20px;accent-color:#b51f2e;cursor:pointer}.lista-representativos{margin-top:18px;padding:18px;border:1px solid #e3d7da;border-radius:16px;background:#fff}.lista-representativos h3{margin:0 0 10px;color:#911725}.acciones-aviso{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.tarjeta-aviso.eliminando{opacity:.55;pointer-events:none}
@media (max-width:900px){.resumen-delegado-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:560px){.resumen-delegado-grid{grid-template-columns:1fr}.barra-filtros-delegado input,.barra-filtros-delegado select{max-width:100%}}

  
    /* ===== INTERFAZ COMPACTA POR PESTAÑAS ===== */
    .pestanas-modulo {
      display:flex; flex-wrap:wrap; gap:8px; margin:18px 0 22px;
      padding:8px; border:1px solid #3a3435; border-radius:14px; background:#151515;
    }
    .pestanas-modulo button {
      min-height:42px; padding:10px 16px; border:1px solid #4a4143; border-radius:10px;
      background:#222; color:#fff; font-weight:900; cursor:pointer;
    }
    .pestanas-modulo button:hover,.pestanas-modulo button.activa {
      background:var(--itn-rojo); border-color:var(--itn-rojo); color:#fff;
    }
    .panel-pestana-modulo { display:none; animation:aparecerPanel .18s ease; }
    .panel-pestana-modulo.activo { display:block; }
    @keyframes aparecerPanel { from{opacity:.25;transform:translateY(4px)} to{opacity:1;transform:none} }
    .tarjeta-formulario-compacta {
      padding:22px; border:1px solid #ddd; border-top:6px solid var(--itn-amarillo);
      border-radius:16px; background:#fff; box-shadow:0 10px 25px rgba(0,0,0,.06);
    }
    .apartado-colapsable { margin:14px 0; border:1px solid #3b3536; border-radius:14px; overflow:hidden; background:#171717; }
    .apartado-colapsable-titulo {
      width:100%; display:flex; justify-content:space-between; align-items:center; gap:12px;
      padding:16px 18px; border:0; background:#201d1e; color:#fff; font-weight:900; cursor:pointer; text-align:left;
    }
    .apartado-colapsable-titulo:hover { background:#2b2426; }
    .apartado-colapsable-titulo::after { content:'＋'; color:var(--itn-amarillo); font-size:20px; }
    .apartado-colapsable.abierto > .apartado-colapsable-titulo::after { content:'−'; }
    .apartado-colapsable-contenido { display:none; padding:18px; }
    .apartado-colapsable.abierto > .apartado-colapsable-contenido { display:block; }


    /* V24 - Administración general en viñetas colapsables */
    #centroProfesional .grid-profesional {
      display: block;
    }
    #centroProfesional .apartado-colapsable {
      width: 100%;
      margin: 14px 0;
    }
    #centroProfesional .apartado-colapsable-contenido {
      background: #ffffff;
    }
    #centroProfesional .apartado-colapsable-contenido > .tarjeta-profesional,
    #centroProfesional .apartado-colapsable-contenido > .consola-maestra {
      margin-top: 0 !important;
      border: 0;
      box-shadow: none;
    }
    #centroProfesional .apartado-colapsable-contenido > .consola-maestra {
      border-top: 0;
      padding: 0;
      background: transparent;
    }

  

/* PATCH V16 - fotos visibles en todos los apartados */
.imagen-actividad-card,
.imagen-grupo-card {
  width: 100%;
  min-height: 170px;
  background: linear-gradient(135deg, #2b1117, #7f1723);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-weight: 900;
  letter-spacing: .4px;
  overflow: hidden;
}
.imagen-actividad-card img,
.imagen-grupo-card img {
  width: 100%;
  height: 100%;
  min-height: 170px;
  object-fit: cover;
  display: block;
}
.imagen-grupo-card { min-height: 120px; }
.imagen-grupo-card img { min-height: 120px; }
.imagen-actividad-card.sin-imagen,
.imagen-grupo-card.sin-imagen {
  padding: 24px;
  background: linear-gradient(135deg, #4b1119, #b51f2e);
}
.alumno-identidad-mini,
.aviso-identidad-mini {
  display: flex;
  align-items: center;
  gap: 10px;
}
.avatar-alumno-mini,
.avatar-aviso-mini {
  width: 52px;
  height: 52px;
  flex: 0 0 52px;
  border-radius: 50%;
  overflow: hidden;
  background: #fff3b3;
  color: #5a3d00;
  border: 2px solid #ffc400;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 11px;
  font-weight: 900;
}
.avatar-alumno-mini img,
.avatar-aviso-mini img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.avatar-aviso-mini {
  width: 44px;
  height: 44px;
  flex-basis: 44px;
}
.tarjeta-aviso-cabecera {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 8px;
}
.tarjeta-aviso-cabecera h4 {
  margin-top: 0;
}

  

    /* =========================================================
       PATCH V35 - TEXTO LEGIBLE EN CONSULTAR Y MODIFICAR
       ========================================================= */
    .panel-administracion-extra .tabla-responsive {
      background: #ffffff;
    }

    .tabla-usuarios-completa tbody tr,
    .tabla-usuarios-completa tbody td {
      background: #ffffff !important;
      color: #111111 !important;
    }

    .tabla-usuarios-completa tbody td *:not(button) {
      color: #111111 !important;
    }

    .editor-usuario {
      background: #ffffff !important;
      color: #111111 !important;
      border-color: #e2dcde !important;
    }

    .editor-usuario h3,
    .editor-usuario label,
    .editor-usuario p,
    .editor-usuario span,
    .editor-usuario strong,
    .editor-usuario .campo label {
      color: #111111 !important;
    }

    .editor-usuario input,
    .editor-usuario select,
    .editor-usuario textarea {
      background: #ffffff !important;
      color: #111111 !important;
      border-color: #cfcfcf !important;
    }

    .editor-usuario input::placeholder,
    .editor-usuario textarea::placeholder {
      color: #6b7280 !important;
    }



    /* V36 - Comentarios, chat flotante e importación */
    .seccion-v36 { margin-top: 22px; }
    .grid-v36 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
    .tarjeta-v36 { border: 1px solid #e7d5d8; border-radius: 18px; background: #fff; padding: 18px; box-shadow: 0 10px 26px rgba(36, 18, 22, .08); }
    .tarjeta-v36 h3 { margin: 0 0 8px; color: #111; }
    .tarjeta-v36 p, .tarjeta-v36 small, .tarjeta-v36 label { color: #111; }
    .lista-comentarios-v36 { display: grid; gap: 12px; }
    .comentario-v36 { border: 1px solid #e7e0e0; border-radius: 14px; padding: 14px; background: #fff; color: #111; }
    .comentario-v36 strong { color: #111; }
    .comentario-v36 .meta { color: #4b5563; font-size: .9rem; margin-bottom: 8px; }
    .comentario-v36.resuelto { border-left: 6px solid #166534; }
    .comentario-v36.pendiente { border-left: 6px solid #b51f2e; }
    .acciones-comentario-v36 { display: grid; gap: 8px; margin-top: 10px; }
    .tabla-importacion-v36 { max-height: 280px; overflow: auto; border: 1px solid #e2e2e2; border-radius: 14px; background: #fff; }
    .tabla-importacion-v36 table { width: 100%; border-collapse: collapse; color: #111; }
    .tabla-importacion-v36 th, .tabla-importacion-v36 td { padding: 9px 10px; border-bottom: 1px solid #e8e8e8; text-align: left; font-size: .88rem; }
    .tabla-importacion-v36 th { background: #23191c; color: #ffc400; position: sticky; top: 0; }
    .chat-flotante-v36 { position: fixed; right: 22px; bottom: 22px; z-index: 9999; font-family: Arial, Helvetica, sans-serif; }
    .boton-chat-v36 { border: none; border-radius: 999px; padding: 14px 18px; background: #b51f2e; color: #fff; font-weight: 800; box-shadow: 0 18px 38px rgba(0,0,0,.28); cursor: pointer; }
    .ventana-chat-v36 { display: none; width: min(390px, calc(100vw - 34px)); height: min(590px, calc(100vh - 110px)); background: #fff; border: 1px solid #d6d6d6; border-radius: 18px; overflow: hidden; box-shadow: 0 25px 70px rgba(0,0,0,.38); }
    .chat-flotante-v36.abierto .ventana-chat-v36 { display: grid; grid-template-rows: auto auto 1fr auto; }
    .chat-flotante-v36.abierto .boton-chat-v36 { display: none; }
    .chat-header-v36 { background: #23191c; color: #fff; padding: 12px 14px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
    .chat-header-v36 strong { display: block; }
    .chat-header-v36 small { color: #ffc400; }
    .chat-header-v36 button { border: 1px solid rgba(255,255,255,.35); background: transparent; color: #fff; border-radius: 10px; padding: 5px 8px; cursor: pointer; }
    .chat-conversaciones-v36 { padding: 10px; border-bottom: 1px solid #e5e5e5; }
    .chat-conversaciones-v36 select { width: 100%; color: #111; }
    .chat-mensajes-v36 { padding: 12px; overflow: auto; background: #f7f7f7; display: flex; flex-direction: column; gap: 10px; }
    .burbuja-v36 { max-width: 82%; padding: 10px 12px; border-radius: 15px; background: #fff; border: 1px solid #e5e5e5; color: #111; align-self: flex-start; }
    .burbuja-v36.mio { background: #fff1f2; border-color: #fecdd3; align-self: flex-end; }
    .burbuja-v36 .autor { display: block; font-size: .76rem; color: #555; margin-bottom: 4px; font-weight: 700; }
    .chat-form-v36 { border-top: 1px solid #e5e5e5; padding: 10px; display: grid; gap: 8px; background: #fff; }
    .chat-form-v36 textarea { width: 100%; min-height: 54px; resize: vertical; color: #111; }
    .chat-form-v36 button { width: 100%; }
    @media (max-width: 780px) { .grid-v36 { grid-template-columns: 1fr; } .chat-flotante-v36 { right: 12px; bottom: 12px; } }

  

    /* V38 - Organigrama y asignaciones ordenadas */
    .organigrama-v38 { display: grid; gap: 18px; margin-top: 18px; }
    .organigrama-resumen-v38 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
    .organigrama-metrica-v38 { border: 1px solid #e4d8db; border-radius: 16px; background: #fff; padding: 16px; box-shadow: 0 10px 24px rgba(36,18,22,.07); }
    .organigrama-metrica-v38 strong { display: block; color: #8d1724; font-size: 26px; line-height: 1; }
    .organigrama-metrica-v38 span { display: block; margin-top: 6px; color: #33282b; font-size: 12px; font-weight: 900; text-transform: uppercase; letter-spacing: .5px; }
    .grid-organigrama-v38 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
    .area-organigrama-v38 { overflow: hidden; border: 1px solid #e3d7da; border-radius: 18px; background: #fff; box-shadow: 0 12px 28px rgba(36,18,22,.08); }
    .area-organigrama-v38 header { padding: 16px 18px; background: linear-gradient(135deg, #21191b, #8d1724); color: #fff; border-bottom: 5px solid #ffc400; }
    .area-organigrama-v38 header span { display: block; color: #ffc400; font-size: 12px; font-weight: 900; text-transform: uppercase; letter-spacing: .7px; }
    .area-organigrama-v38 header h3 { margin: 4px 0 0; color: #fff; }
    .area-organigrama-v38 header p { margin: 5px 0 0; color: rgba(255,255,255,.86); }
    .lista-promotores-v38 { display: grid; gap: 10px; padding: 16px; }
    .promotor-organigrama-v38 { border: 1px solid #eee1e4; border-radius: 14px; padding: 13px; background: #fff; color: #111; }
    .promotor-organigrama-v38.pendiente { background: #fff8d9; border-color: #f5d45d; }
    .promotor-organigrama-v38 strong { color: #111; display: block; margin-bottom: 8px; }
    .chips-actividad-v38 { display: flex; flex-wrap: wrap; gap: 6px; }
    .chip-actividad-v38 { display: inline-flex; padding: 5px 9px; border-radius: 999px; background: #f2eeee; color: #34282b; font-size: 12px; font-weight: 800; }
    .chip-actividad-v38.pendiente { background: #fff1b7; color: #5a3d00; }
    .tabla-organigrama-v38 { overflow-x: auto; border: 1px solid #e3d7da; border-radius: 16px; background: #fff; }
    .tabla-organigrama-v38 table { width: 100%; min-width: 900px; border-collapse: collapse; }
    .tabla-organigrama-v38 th, .tabla-organigrama-v38 td { padding: 11px 12px; border-bottom: 1px solid #eee; text-align: left; color: #111; font-size: 13px; }
    .tabla-organigrama-v38 th { background: #21191b; color: #ffc400; text-transform: uppercase; font-size: 12px; }
    .ayuda-asignacion-v38 { margin-top: 14px; padding: 14px; border: 1px solid #eed5d8; border-left: 6px solid #b51f2e; border-radius: 12px; background: #fff7f7; color: #111; }
    .ayuda-asignacion-v38 h4 { margin: 0 0 8px; color: #8d1724; }
    .ayuda-asignacion-v38 p { margin: 0 0 10px; color: #111; }
    .sugerencia-asignacion-v38 { display: grid; gap: 8px; margin-top: 10px; color: #111; }
    .fila-sugerencia-v38 { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 9px 10px; border-radius: 10px; background: #fff; border: 1px solid #eadfe2; }
    .fila-sugerencia-v38 strong { color: #111; min-width: 145px; }
    @media (max-width: 900px) { .organigrama-resumen-v38, .grid-organigrama-v38 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
    @media (max-width: 620px) { .organigrama-resumen-v38, .grid-organigrama-v38 { grid-template-columns: 1fr; } }




    /* V42 - horarios seleccionables para alumnos */
    .aviso-horario-v42 {
      margin: 0 0 16px;
      padding: 14px 16px;
      border-left: 6px solid var(--itn-amarillo);
      border-radius: 12px;
      background: #fff8dc;
      color: #3a2a00;
      font-weight: 800;
      line-height: 1.45;
    }

    .horario-destacado-v42 {
      margin: 10px 0 8px;
      padding: 12px 14px;
      border: 1px solid #f2d45f;
      border-radius: 12px;
      background: #fff8d9;
      color: #402b00;
      font-weight: 900;
    }

    .horario-destacado-v42 span {
      display: block;
      margin-bottom: 4px;
      color: #8d1724;
      font-size: 12px;
      letter-spacing: 0.5px;
      text-transform: uppercase;
    }

    .seleccionar-horario-v42 {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      margin-top: 12px;
      padding: 8px 12px;
      border-radius: 999px;
      background: #b51f2e;
      color: #ffffff;
      font-size: 12px;
      font-weight: 900;
    }

    .grupo-modal.seleccionado .seleccionar-horario-v42 {
      background: #166534;
    }



    /* =========================================================
       V44 - Apartados juntos en viñetas colapsables
       ========================================================= */
    .herramientas-internas-v44 {
      padding: 44px clamp(18px, 5vw, 78px);
      background: #f4f2ee;
      border-top: 7px solid var(--itn-amarillo);
    }

    .herramientas-internas-v44 > .cabecera-seccion-inicio {
      margin-bottom: 18px;
    }

    .lista-vinetas-v44 {
      display: grid;
      gap: 14px;
    }

    .herramientas-internas-v44 .seccion-vineta-v44,
    .herramientas-internas-v44 #centroProfesional,
    .herramientas-internas-v44 #gestionRoles,
    .herramientas-internas-v44 #comentariosAlumnos,
    .herramientas-internas-v44 #importarAlumnosExcel,
    .herramientas-internas-v44 #organigramaExtraescolar {
      padding: 0 !important;
      margin: 0 !important;
      background: transparent !important;
      box-shadow: none !important;
      border: 0 !important;
    }

    .vineta-panel-v44 {
      margin: 0 !important;
      overflow: hidden;
      border: 1px solid #3a3033;
      border-radius: 14px;
      background: #ffffff;
      box-shadow: 0 12px 24px rgba(35, 25, 28, 0.08);
    }

    .vineta-titulo-v44 {
      width: 100%;
      min-height: 58px;
      padding: 15px 18px;
      border: 0;
      background: #21191b;
      color: #ffffff;
      text-align: left;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
    }

    .vineta-titulo-v44 strong {
      display: block;
      color: #ffffff;
      font-size: 17px;
      line-height: 1.1;
    }

    .vineta-titulo-v44 small {
      display: block;
      margin-top: 4px;
      color: rgba(255, 255, 255, 0.78);
      font-size: 12px;
      font-weight: 700;
      line-height: 1.35;
    }

    .vineta-titulo-v44::after {
      content: '＋';
      color: var(--itn-amarillo);
      font-size: 21px;
      font-weight: 900;
      flex: 0 0 auto;
    }

    .vineta-panel-v44.abierto > .vineta-titulo-v44::after {
      content: '−';
    }

    .vineta-contenido-v44 {
      display: none;
      padding: 20px;
      background: #ffffff;
      color: #111111;
    }

    .vineta-panel-v44.abierto > .vineta-contenido-v44 {
      display: block;
    }

    .vineta-contenido-v44 .cabecera-seccion-inicio {
      margin-bottom: 18px;
    }

    .vineta-contenido-v44 .cabecera-seccion-inicio h2,
    .vineta-contenido-v44 .cabecera-seccion-inicio h3,
    .vineta-contenido-v44 h2,
    .vineta-contenido-v44 h3,
    .vineta-contenido-v44 h4,
    .vineta-contenido-v44 p,
    .vineta-contenido-v44 label,
    .vineta-contenido-v44 span:not(.sobrelinea):not(.chip-actividad-v38):not(.accion-icono) {
      color: #111111;
    }

    .vineta-contenido-v44 .sobrelinea {
      color: var(--itn-rojo);
    }

    @media (max-width: 760px) {
      .herramientas-internas-v44 {
        padding: 28px 14px;
      }
      .vineta-contenido-v44 {
        padding: 14px;
      }
    }



    /* V49 - Modal bonito para confirmar eliminación de flyers */
    .modal-flyer-v49 {
      position: fixed;
      inset: 0;
      z-index: 10050;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 20px;
      background: rgba(15, 10, 12, 0.68);
      backdrop-filter: blur(5px);
    }

    .modal-flyer-v49.oculto {
      display: none !important;
    }

    .tarjeta-modal-flyer-v49 {
      width: min(480px, 94vw);
      overflow: hidden;
      border: 1px solid rgba(255, 196, 0, 0.42);
      border-radius: 22px;
      background: #ffffff;
      box-shadow: 0 28px 75px rgba(0, 0, 0, 0.38);
      animation: aparecerModalFlyerV49 0.18s ease-out;
    }

    @keyframes aparecerModalFlyerV49 {
      from { transform: translateY(12px) scale(0.98); opacity: 0; }
      to { transform: translateY(0) scale(1); opacity: 1; }
    }

    .encabezado-modal-flyer-v49 {
      padding: 22px 24px;
      color: #ffffff;
      background: linear-gradient(135deg, var(--itn-rojo), var(--itn-rojo-oscuro));
      border-bottom: 5px solid var(--itn-amarillo);
    }

    .encabezado-modal-flyer-v49 span {
      display: inline-block;
      margin-bottom: 6px;
      color: var(--itn-amarillo);
      font-size: 12px;
      font-weight: 900;
      letter-spacing: 0.8px;
      text-transform: uppercase;
    }

    .encabezado-modal-flyer-v49 h3 {
      margin: 0;
      font-size: 26px;
    }

    .cuerpo-modal-flyer-v49 {
      padding: 24px;
      color: #2a1b20;
      line-height: 1.55;
    }

    .aviso-modal-flyer-v49 {
      margin: 16px 0 0;
      padding: 14px;
      border-left: 5px solid var(--itn-amarillo);
      border-radius: 12px;
      background: #fff8dc;
      color: #5f4100;
      font-weight: 700;
    }

    .acciones-modal-flyer-v49 {
      display: flex;
      justify-content: flex-end;
      gap: 12px;
      padding: 0 24px 24px;
    }

    .acciones-modal-flyer-v49 button {
      min-height: 44px;
      padding: 11px 18px;
      border-radius: 12px;
      font-weight: 900;
      cursor: pointer;
    }

    .boton-cancelar-modal-flyer-v49 {
      border: 2px solid #b51f2e;
      background: #ffffff;
      color: #b51f2e;
    }

    .boton-eliminar-modal-flyer-v49 {
      border: 0;
      background: #991b1b;
      color: #ffffff;
      box-shadow: 0 10px 22px rgba(153, 27, 27, 0.22);
    }

    .item-gestion-flyer-v45 .boton-mini.peligro {
      white-space: nowrap;
    }



    /* V53 - Registrar alumnos solo para administrador y coordinador */
    #gestionRoles.modo-coordinador-registra-alumnos-v53 [data-rol-manual]:not([data-rol-manual="ESTUDIANTE"]),
    #gestionRoles.modo-coordinador-registra-alumnos-v53 .panel-administracion-extra {
      display: none !important;
    }

    #gestionRoles.modo-coordinador-registra-alumnos-v53 .selector-rol-manual {
      grid-template-columns: minmax(0, 1fr);
    }

    #gestionRoles.modo-coordinador-registra-alumnos-v53 .tarjeta-alta-usuario {
      max-width: 920px;
    }

    #gestionRoles.modo-coordinador-registra-alumnos-v53 #notaAltaManual::after {
      content: " Los coordinadores solo pueden registrar alumnos.";
      font-weight: 900;
    }

  

/* =========================================================
   V54 - limpieza visual, panel de actividad uniforme y fotos centradas
   ========================================================= */
.v54-oculto{display:none!important;}
.slide-flyer-v45 img,
.item-gestion-flyer-v45 img,
.actividad-imagen-premium img,
.imagen-actividad-card img,
.galeria-foto-item img,
.delegado-foto-premium img{
  width:100%;height:100%;object-fit:contain!important;object-position:center center!important;background:#161012;
}
.flyers-marco-v45,.carrusel-flyers-v45,.slides-flyers-v45{overflow:hidden;}
.v54-panel-actividad{display:grid;gap:18px;}
.v54-actividad-superior{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(260px,.7fr);gap:18px;align-items:stretch;}
.v54-card{border:1px solid #eadde0;border-radius:18px;background:#fff;box-shadow:0 12px 28px rgba(42,24,29,.07);overflow:hidden;}
.v54-card-header{padding:16px 18px;background:linear-gradient(135deg,#21191b,#8d1724);border-bottom:5px solid #ffc400;color:#fff;}
.v54-card-header span{display:block;color:#ffc400;font-size:12px;font-weight:900;letter-spacing:.8px;text-transform:uppercase;}
.v54-card-header h4,.v54-card-header h5{margin:5px 0 0;color:#fff;font-size:22px;}
.v54-card-body{padding:18px;color:#251c1f;}
.v54-imagen-principal{height:360px;display:flex;align-items:center;justify-content:center;background:#1a1114;border-radius:0;overflow:hidden;}
.v54-imagen-principal img{max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain;object-position:center;background:#1a1114;}
.v54-imagen-placeholder{display:flex;align-items:center;justify-content:center;min-height:360px;color:#fff;font-weight:900;text-align:center;background:linear-gradient(135deg,#2b1a1e,#5e121c);}
.v54-promotor{height:100%;display:flex;flex-direction:column;text-align:center;}
.v54-promotor .v54-card-body{display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;gap:13px;}
.v54-promotor-foto{width:170px;height:170px;border-radius:28px;overflow:hidden;background:#24191d;border:5px solid #ffc400;display:flex;align-items:center;justify-content:center;color:#ffc400;font-size:36px;font-weight:900;}
.v54-promotor-foto img{width:100%;height:100%;object-fit:contain;object-position:center;background:#24191d;}
.v54-promotor-nombre{font-size:22px;font-weight:900;color:#8d1724;text-align:center;}
.v54-promotor-correo{display:inline-flex;justify-content:center;align-items:center;min-height:38px;padding:8px 12px;border-radius:999px;background:#fff7dc;color:#6d111b;font-weight:800;text-decoration:none;word-break:break-word;}
.v54-grupos-bajo{display:grid;gap:14px;}
.v54-subtitulo{margin:0;color:#8d1724;font-size:22px;}
.v54-editor-toggle{display:flex;justify-content:flex-end;margin-top:4px;}
.v54-editor-info{margin-top:12px;padding:18px;border:1px dashed #d7bfc4;border-radius:16px;background:#fffaf0;}
.v54-editor-info.oculto{display:none!important;}
.v54-solo-rol{padding:14px 16px;border-radius:14px;background:#fff7dc;color:#4b121a;border-left:5px solid #ffc400;line-height:1.45;}
.v54-toolbar-inscripciones{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin:0 0 14px;}
.v54-buscador{max-width:420px;min-width:260px;}
.v54-tabs-limpias button[data-panel-grupo="panelCrearGrupo"],
.v54-tabs-limpias button[data-panel-grupo="panelCambiosActividad"],
.v54-tabs-limpias button[data-panel-grupo="panelAprobarGrupo"]{display:none!important;}
body.rol-admin-v54 .v54-tabs-limpias button[data-panel-grupo="panelCrearGrupo"],
body.rol-admin-v54 .v54-tabs-limpias button[data-panel-grupo="panelCambiosActividad"],
body.rol-admin-v54 .v54-tabs-limpias button[data-panel-grupo="panelAprobarGrupo"],
body.rol-coordinador-v54 .v54-tabs-limpias button[data-panel-grupo="panelCrearGrupo"],
body.rol-coordinador-v54 .v54-tabs-limpias button[data-panel-grupo="panelCambiosActividad"],
body.rol-coordinador-v54 .v54-tabs-limpias button[data-panel-grupo="panelAprobarGrupo"]{display:inline-flex!important;}
body.rol-promotor-v54 #panelCrearGrupo,body.rol-promotor-v54 #panelCambiosActividad,body.rol-promotor-v54 #panelAprobarGrupo{display:none!important;}

@media(max-width:900px){.v54-actividad-superior{grid-template-columns:1fr}.v54-imagen-principal,.v54-imagen-placeholder{height:300px}.v54-promotor-foto{width:140px;height:140px}}



/* V57 - imágenes centradas y controles del promotor */
.actividad-imagen-premium,
.actividad-imagen-premium img,
.imagen-actividad-card,
.imagen-actividad-card img,
.galeria-foto-item,
.galeria-foto-item img,
.delegado-foto-premium,
.delegado-foto-premium img,
.v54-imagen-principal,
.v54-imagen-principal img,
.v54-promotor-foto,
.v54-promotor-foto img {
  object-fit: contain !important;
  object-position: center center !important;
  background: #170f12 !important;
}
.delegado-foto-premium,
.v54-promotor-foto {
  width: 220px !important;
  height: 220px !important;
  margin: 0 auto 14px !important;
}
.delegado-contacto,
.boton-contacto-delegado,
.v54-promotor-correo {
  user-select: none !important;
  pointer-events: none !important;
  cursor: default !important;
  text-decoration: none !important;
}
.grupo-solo-vista-v57 { cursor: default !important; }
.solo-vista-v57 { background: #f8f8f8 !important; color: #444 !important; pointer-events: none; }
.acciones-inscripcion-v57 { display: flex; flex-wrap: wrap; gap: 7px; }
.barra-filtros-delegado input { min-width: 330px; }
@media (max-width: 700px) {
  .delegado-foto-premium,.v54-promotor-foto { width: 170px !important; height: 170px !important; }
  .barra-filtros-delegado input { min-width: 100%; }
}


/* V61 - imágenes centradas y sin recorte en actividad */
.v54-imagen-principal,
.galeria-imagen,
.imagen-actividad-card {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  background: linear-gradient(135deg, #251014, #5d131d) !important;
}
.v54-imagen-principal img,
.galeria-imagen img,
.imagen-actividad-card img,
.foto-galeria-actividad img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  display: block !important;
}
.delegado-foto-premium,
.v54-promotor-foto {
  width: 190px !important;
  height: 190px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  overflow: hidden !important;
  border-radius: 22px !important;
}
.delegado-foto-premium img,
.v54-promotor-foto img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
}
.boton-contacto-delegado,
.correo-solo-vista-v58,
.v54-promotor-correo {
  user-select: none !important;
  -webkit-user-select: none !important;
  pointer-events: none !important;
  cursor: default !important;
}





    /* V45 - Flyers en inicio */
    .contenedor-flyers-v45 {
      display: block;
    }

    .seccion-flyers-inicio-v46 > .cabecera-seccion-inicio {
      display: none !important;
    }

    .flyers-marco-v45 {
      overflow: hidden;
      border: 1px solid #ead7dc;
      border-radius: 20px;
      background: #ffffff;
      box-shadow: 0 18px 42px rgba(42, 24, 29, 0.08);
    }

    .flyers-cabecera-v45 {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 20px;
      padding: 26px;
      border-bottom: 6px solid var(--itn-amarillo);
      color: #ffffff;
      background: linear-gradient(135deg, #821522, #b51f2e);
    }

    .flyers-cabecera-v45 h3 {
      margin: 6px 0 8px;
      color: #ffffff;
      font-size: clamp(26px, 4vw, 42px);
    }

    .flyers-cabecera-v45 p {
      max-width: 760px;
      margin: 0;
      color: rgba(255,255,255,0.88);
      line-height: 1.5;
    }

    .flyers-contador-v45 {
      flex: 0 0 auto;
      min-width: 80px;
      padding: 12px 14px;
      border: 1px solid rgba(255,255,255,0.32);
      border-radius: 14px;
      color: var(--itn-amarillo);
      text-align: center;
      font-weight: 900;
      background: rgba(255,255,255,0.08);
    }

    .flyers-acciones-v46 {
      display: flex;
      flex-direction: column;
      align-items: flex-end;
      gap: 10px;
      flex: 0 0 auto;
    }

    .boton-editar-flyers-v46 {
      min-height: 42px;
      padding: 10px 18px;
      border: 2px solid rgba(255,255,255,0.72);
      border-radius: 12px;
      background: #ffffff;
      color: var(--itn-rojo);
      font-weight: 900;
      cursor: pointer;
      box-shadow: 0 12px 22px rgba(0,0,0,0.16);
    }

    .boton-editar-flyers-v46:hover {
      background: #fff8df;
    }

    .carrusel-flyers-v45 {
      position: relative;
      min-height: min(58vw, 540px);
      background: #151515;
    }

    .slides-flyers-v45 {
      position: relative;
      width: 100%;
      min-height: min(58vw, 540px);
    }

    .slide-flyer-v45 {
      position: absolute;
      inset: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      opacity: 0;
      pointer-events: none;
      transition: opacity .45s ease;
      background: #151515;
    }

    .slide-flyer-v45.activo {
      opacity: 1;
      pointer-events: auto;
    }

    .slide-flyer-v45 img {
      width: 100%;
      height: min(58vw, 540px);
      object-fit: contain;
      display: block;
      background: #151515;
    }

    .pie-flyer-v45 {
      position: absolute;
      left: 22px;
      right: 22px;
      bottom: 18px;
      padding: 12px 16px;
      border-radius: 999px;
      color: #ffffff;
      font-weight: 900;
      background: rgba(0,0,0,0.58);
      backdrop-filter: blur(6px);
    }

    .flecha-flyer-v45 {
      position: absolute;
      top: 50%;
      z-index: 3;
      width: 46px;
      height: 46px;
      border: 0;
      border-radius: 999px;
      transform: translateY(-50%);
      background: rgba(255,255,255,0.88);
      color: var(--itn-rojo);
      font-size: 34px;
      font-weight: 900;
      cursor: pointer;
      box-shadow: 0 10px 24px rgba(0,0,0,0.22);
    }

    .flecha-flyer-v45.izquierda { left: 18px; }
    .flecha-flyer-v45.derecha { right: 18px; }

    .puntos-flyers-v45 {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 16px 20px;
      background: #fff8df;
    }

    .punto-flyer-v45 {
      width: 11px;
      height: 11px;
      padding: 0;
      border: 0;
      border-radius: 50%;
      background: #d5c2c6;
      cursor: pointer;
    }

    .punto-flyer-v45.activo {
      width: 30px;
      border-radius: 999px;
      background: var(--itn-rojo);
    }

    .estado-flyers-v45 {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      min-height: min(58vw, 540px);
      padding: 34px;
      color: #ffffff;
      text-align: center;
      background: linear-gradient(135deg, #191316, #3b141b);
    }

    .estado-flyers-v45 strong {
      font-size: 26px;
      margin-bottom: 8px;
    }

    .estado-flyers-v45 span {
      color: rgba(255,255,255,0.78);
    }

    .gestion-flyers-v45 {
      display: grid;
      grid-template-columns: minmax(280px, .9fr) minmax(280px, 1.1fr);
      gap: 20px;
      padding: 24px;
      border-top: 1px solid #ead7dc;
      background: #fffdf8;
    }

    .gestion-flyers-form-v45 {
      display: grid;
      grid-template-columns: 1fr 130px;
      gap: 14px;
      align-content: start;
    }

    .acciones-flyer-v45 .boton-principal {
      max-width: 260px;
      margin-top: 4px;
    }

    .lista-gestion-flyers-v45 {
      display: grid;
      gap: 10px;
      max-height: 360px;
      overflow: auto;
      padding-right: 4px;
    }

    .item-gestion-flyer-v45 {
      display: grid;
      grid-template-columns: 78px 1fr auto;
      align-items: center;
      gap: 12px;
      padding: 10px;
      border: 1px solid #ead7dc;
      border-radius: 14px;
      background: #ffffff;
    }

    .item-gestion-flyer-v45 img {
      width: 78px;
      height: 54px;
      object-fit: cover;
      border-radius: 10px;
      background: #151515;
    }

    .item-gestion-flyer-v45 strong,
    .item-gestion-flyer-v45 span {
      display: block;
    }

    .item-gestion-flyer-v45 span {
      margin-top: 4px;
      color: #6f6266;
      font-size: 12px;
    }

    .estado-vacio-mini-v45 {
      padding: 16px;
      border: 1px dashed #d9c7cc;
      border-radius: 12px;
      color: #5f5458;
      text-align: center;
      background: #ffffff;
    }

    @media (max-width: 760px) {
      .flyers-cabecera-v45,
      .gestion-flyers-v45,
      .gestion-flyers-form-v45,
      .item-gestion-flyer-v45 {
        grid-template-columns: 1fr;
      }

      .flyers-cabecera-v45 {
        display: block;
      }

      .flyers-acciones-v46 {
        align-items: flex-start;
        margin-top: 16px;
      }

      .flyers-contador-v45 {
        display: inline-block;
      }

      .flecha-flyer-v45 {
        width: 38px;
        height: 38px;
        font-size: 27px;
      }
    }

  

/* =========================================================
   V54 - limpieza visual, panel de actividad uniforme y fotos centradas
   ========================================================= */
.v54-oculto{display:none!important;}
.slide-flyer-v45 img,
.item-gestion-flyer-v45 img,
.actividad-imagen-premium img,
.imagen-actividad-card img,
.galeria-foto-item img,
.delegado-foto-premium img{
  width:100%;height:100%;object-fit:contain!important;object-position:center center!important;background:#161012;
}
.flyers-marco-v45,.carrusel-flyers-v45,.slides-flyers-v45{overflow:hidden;}
.v54-panel-actividad{display:grid;gap:18px;}
.v54-actividad-superior{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(260px,.7fr);gap:18px;align-items:stretch;}
.v54-card{border:1px solid #eadde0;border-radius:18px;background:#fff;box-shadow:0 12px 28px rgba(42,24,29,.07);overflow:hidden;}
.v54-card-header{padding:16px 18px;background:linear-gradient(135deg,#21191b,#8d1724);border-bottom:5px solid #ffc400;color:#fff;}
.v54-card-header span{display:block;color:#ffc400;font-size:12px;font-weight:900;letter-spacing:.8px;text-transform:uppercase;}
.v54-card-header h4,.v54-card-header h5{margin:5px 0 0;color:#fff;font-size:22px;}
.v54-card-body{padding:18px;color:#251c1f;}
.v54-imagen-principal{height:360px;display:flex;align-items:center;justify-content:center;background:#1a1114;border-radius:0;overflow:hidden;}
.v54-imagen-principal img{max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain;object-position:center;background:#1a1114;}
.v54-imagen-placeholder{display:flex;align-items:center;justify-content:center;min-height:360px;color:#fff;font-weight:900;text-align:center;background:linear-gradient(135deg,#2b1a1e,#5e121c);}
.v54-promotor{height:100%;display:flex;flex-direction:column;text-align:center;}
.v54-promotor .v54-card-body{display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;gap:13px;}
.v54-promotor-foto{width:170px;height:170px;border-radius:28px;overflow:hidden;background:#24191d;border:5px solid #ffc400;display:flex;align-items:center;justify-content:center;color:#ffc400;font-size:36px;font-weight:900;}
.v54-promotor-foto img{width:100%;height:100%;object-fit:contain;object-position:center;background:#24191d;}
.v54-promotor-nombre{font-size:22px;font-weight:900;color:#8d1724;text-align:center;}
.v54-promotor-correo{display:inline-flex;justify-content:center;align-items:center;min-height:38px;padding:8px 12px;border-radius:999px;background:#fff7dc;color:#6d111b;font-weight:800;text-decoration:none;word-break:break-word;}
.v54-grupos-bajo{display:grid;gap:14px;}
.v54-subtitulo{margin:0;color:#8d1724;font-size:22px;}
.v54-editor-toggle{display:flex;justify-content:flex-end;margin-top:4px;}
.v54-editor-info{margin-top:12px;padding:18px;border:1px dashed #d7bfc4;border-radius:16px;background:#fffaf0;}
.v54-editor-info.oculto{display:none!important;}
.v54-solo-rol{padding:14px 16px;border-radius:14px;background:#fff7dc;color:#4b121a;border-left:5px solid #ffc400;line-height:1.45;}
.v54-toolbar-inscripciones{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin:0 0 14px;}
.v54-buscador{max-width:420px;min-width:260px;}
.v54-tabs-limpias button[data-panel-grupo="panelCrearGrupo"],
.v54-tabs-limpias button[data-panel-grupo="panelCambiosActividad"],
.v54-tabs-limpias button[data-panel-grupo="panelAprobarGrupo"]{display:none!important;}
body.rol-admin-v54 .v54-tabs-limpias button[data-panel-grupo="panelCrearGrupo"],
body.rol-admin-v54 .v54-tabs-limpias button[data-panel-grupo="panelCambiosActividad"],
body.rol-admin-v54 .v54-tabs-limpias button[data-panel-grupo="panelAprobarGrupo"],
body.rol-coordinador-v54 .v54-tabs-limpias button[data-panel-grupo="panelCrearGrupo"],
body.rol-coordinador-v54 .v54-tabs-limpias button[data-panel-grupo="panelCambiosActividad"],
body.rol-coordinador-v54 .v54-tabs-limpias button[data-panel-grupo="panelAprobarGrupo"]{display:inline-flex!important;}
body.rol-promotor-v54 #panelCrearGrupo,body.rol-promotor-v54 #panelCambiosActividad,body.rol-promotor-v54 #panelAprobarGrupo{display:none!important;}

@media(max-width:900px){.v54-actividad-superior{grid-template-columns:1fr}.v54-imagen-principal,.v54-imagen-placeholder{height:300px}.v54-promotor-foto{width:140px;height:140px}}




/* V55 - Ajustes visuales finales */
.acciones-listas-v55{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.acciones-listas-v55 .boton-principal,.acciones-listas-v55 .boton-secundario{width:auto;min-width:220px}.flyer-slide img,.flyer-imagen img,.v54-imagen-principal img,.galeria-foto-item img,.v54-promotor-foto img,.delegado-foto-premium img{object-fit:contain!important;object-position:center!important}.v54-imagen-principal,.galeria-foto-item,.v54-promotor-foto,.delegado-foto-premium{display:flex;align-items:center;justify-content:center;background:#1a1114}.v54-promotor-nombre,.delegado-datos strong{text-align:center!important}.v54-promotor-correo,.delegado-contacto{justify-content:center!important;text-align:center!important}.organigrama-v38 .tabla-organigrama-v38{display:none}.rol-administrador-v54 .organigrama-v38 .tabla-organigrama-v38,.rol-encargado-v54 .organigrama-v38 .tabla-organigrama-v38{display:block}



/* V56 - ajustes visuales de panel de actividad y promotor */
.delegado-foto-premium,
.v54-promotor-foto {
  width: 240px !important;
  height: 240px !important;
  border-radius: 34px !important;
}
.delegado-foto-premium img,
.v54-promotor-foto img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
}
.delegado-contacto,
.boton-contacto-delegado,
.v54-promotor-correo {
  user-select: none !important;
  -webkit-user-select: none !important;
  pointer-events: none !important;
  cursor: default !important;
  text-decoration: none !important;
}
.boton-contacto-delegado {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 38px;
  padding: 8px 12px;
  border-radius: 999px;
  background: #fff7dc;
  color: #6d111b;
  font-weight: 900;
}
body:not(.rol-estudiante-v56) .boton-inscribirse-modal,
body:not(.rol-estudiante-v56) .boton-confirmar-grupo-modal,
body:not(.rol-estudiante-v56) .lista-grupos-dinamicos .boton-mini {
  display: none !important;
}
body:not(.rol-estudiante-v56) .confirmacion-grupo-modal::after {
  content: "Solo los estudiantes pueden inscribirse. Este perfil solo puede consultar o gestionar la actividad.";
  display: block;
  padding: 12px 14px;
  border-radius: 12px;
  background: #fff7dc;
  color: #6d111b;
  font-weight: 900;
  text-align: center;
}
@media(max-width:900px){
  .delegado-foto-premium,.v54-promotor-foto{width:180px!important;height:180px!important;}
}



  .modal-actividad img,
  .v54-imagen-principal img,
  .galeria-foto-item img,
  .imagen-grupo-card img,
  .imagen-actividad-card img,
  .flyer-slide img { object-fit: contain !important; object-position: center center !important; width:100% !important; height:100% !important; }
  .v54-imagen-principal,
  .galeria-foto-item,
  .imagen-grupo-card,
  .imagen-actividad-card { display:flex !important; align-items:center !important; justify-content:center !important; background:#12090d !important; }
  .delegado-foto-premium,
  .v54-promotor-foto { width: 230px !important; height: 230px !important; min-width:230px !important; min-height:230px !important; margin: 0 auto 14px !important; border-radius: 28px !important; display:flex !important; align-items:center !important; justify-content:center !important; overflow:hidden !important; background:#170c10 !important; color:#fff !important; font-size:44px !important; }
  .delegado-foto-premium img,
  .v54-promotor-foto img { object-fit:contain !important; object-position:center !important; width:100% !important; height:100% !important; }
  .delegado-identidad { justify-items:center !important; text-align:center !important; }
  .delegado-datos strong,
  .v54-promotor-nombre { display:block !important; text-align:center !important; color:#111 !important; }
  .delegado-premium .delegado-datos strong { color:#111 !important; }
  .delegado-contacto,
  .v54-promotor-correo { justify-content:center !important; text-align:center !important; user-select:none !important; -webkit-user-select:none !important; pointer-events:none !important; cursor:default !important; }
  .correo-solo-vista-v58 { user-select:none !important; -webkit-user-select:none !important; pointer-events:none !important; cursor:default !important; }
  .modal-actividad .boton-contacto-delegado { color:#8d1724 !important; background:#fff4c7 !important; }
  .modal-actividad label,
  .modal-actividad input,
  .modal-actividad select,
  .modal-actividad textarea,
  #gestionInscripciones label,
  #gestionInscripciones input,
  #gestionInscripciones select,
  #gestionInscripciones textarea { color:#111 !important; }
  .modal-actividad .delegado-premium-encabezado,
  .modal-actividad .v54-card-header,
  .tarjeta-grupo-gestion header { color:#fff !important; }
  .select-bloqueado-promotor-v58 { background:#f4f4f4 !important; color:#333 !important; pointer-events:none; }
  .acciones-inscripcion-v57 { display:flex !important; gap:8px !important; flex-wrap:wrap !important; }
  .barra-filtros-delegado input { color:#111 !important; background:#fff !important; }



  /* V62: galería de actividades más grande, centrada y sin recorte */
  .galeria-actividad-premium {
    margin-top: 22px !important;
  }
  .galeria-actividad-grid {
    grid-template-columns: repeat(2, minmax(320px, 1fr)) !important;
    gap: 18px !important;
    padding: 20px !important;
  }
  .galeria-foto-item {
    min-height: 280px !important;
    height: clamp(260px, 26vw, 390px) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #13090d !important;
    border-radius: 18px !important;
  }
  .galeria-foto-item img {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    display: block !important;
    object-fit: contain !important;
    object-position: center center !important;
    padding: 6px !important;
    background: #13090d !important;
  }
  .galeria-foto-item.sin-foto {
    min-height: 280px !important;
    height: clamp(260px, 26vw, 390px) !important;
    display: grid !important;
    place-items: center !important;
  }
  .v54-imagen-principal,
  .imagen-principal-modal,
  .actividad-imagen-principal,
  .imagen-actividad-card {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  .v54-imagen-principal img,
  .imagen-principal-modal img,
  .actividad-imagen-principal img,
  .imagen-actividad-card img {
    object-fit: contain !important;
    object-position: center center !important;
  }
  @media (max-width: 760px) {
    .galeria-actividad-grid {
      grid-template-columns: 1fr !important;
    }
    .galeria-foto-item,
    .galeria-foto-item.sin-foto {
      height: 280px !important;
    }
  }



  .galeria-foto-item {
    min-height: 360px !important;
    height: 360px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    background: #12070b !important;
  }
  .galeria-foto-item img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    background: #12070b !important;
  }
  .v54-imagen-principal,
  .actividad-imagen-premium,
  .imagen-principal-modal,
  .actividad-imagen-principal {
    min-height: 430px !important;
    height: 430px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    background: #12070b !important;
  }
  .v54-imagen-principal img,
  .actividad-imagen-premium img,
  .imagen-principal-modal img,
  .actividad-imagen-principal img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    background: #12070b !important;
  }
  @media (max-width: 900px) {
    .galeria-foto-item { height: 260px !important; min-height: 260px !important; }
    .v54-imagen-principal,
    .actividad-imagen-premium,
    .imagen-principal-modal,
    .actividad-imagen-principal { height: 300px !important; min-height: 300px !important; }
  }



  .galeria-foto-item {
    min-height: 420px !important;
    height: 420px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    background: #12070b !important;
    border-radius: 14px !important;
  }
  .galeria-foto-item img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center center !important;
    background: #12070b !important;
    display: block !important;
  }
  .v54-imagen-principal,
  .actividad-imagen-premium,
  .imagen-principal-modal,
  .actividad-imagen-principal {
    min-height: 470px !important;
    height: 470px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    background: #12070b !important;
  }
  .v54-imagen-principal img,
  .actividad-imagen-premium img,
  .imagen-principal-modal img,
  .actividad-imagen-principal img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center center !important;
    background: #12070b !important;
    display: block !important;
  }
  @media (max-width: 900px) {
    .galeria-foto-item { height: 280px !important; min-height: 280px !important; }
    .v54-imagen-principal,
    .actividad-imagen-premium,
    .imagen-principal-modal,
    .actividad-imagen-principal { height: 320px !important; min-height: 320px !important; }
  }



  /* V71 - grupos, horarios y organigrama para alumno */
  .grupo-rama-v71 {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 5px 10px;
    margin-bottom: 9px;
    border-radius: 999px;
    background: #fff3b3;
    color: #6a4a00;
    font-size: 12px;
    font-weight: 900;
  }

  .detalle-grupo-v71 {
    display: grid;
    gap: 7px;
    margin-top: 10px;
    color: #554b4e;
    line-height: 1.45;
  }

  .detalle-grupo-v71 strong {
    color: #8d1724;
  }

  body.rol-estudiante-v54 #organigramaExtraescolar {
    display: block !important;
  }

  body.rol-estudiante-v54 #organigramaExtraescolar.v54-oculto,
  body.rol-estudiante-v54 #organigramaExtraescolar.oculto,
  body.rol-estudiante-v54 #organigramaExtraescolar.oculto-rol {
    display: block !important;
  }

  body.rol-estudiante-v54 #organigramaExtraescolar .vineta-contenido-v44 button,
  body.rol-estudiante-v54 #organigramaExtraescolar .vineta-contenido-v44 input,
  body.rol-estudiante-v54 #organigramaExtraescolar .vineta-contenido-v44 select,
  body.rol-estudiante-v54 #organigramaExtraescolar .vineta-contenido-v44 textarea {
    display: none !important;
  }

  .organigrama-solo-consulta-v71 .vineta-titulo-v44 small::after {
    content: " · Solo consulta";
    color: #ffc400;
    font-weight: 900;
  }

  .grupo-modal.seleccionable .grupo-radio-modal:checked ~ .grupo-modal-info {
    border-color: #b51f2e;
  }

  @media (max-width: 720px) {
    .datos-inscripcion {
      grid-template-columns: 1fr;
    }
  }



  /* Pestañas de Grupos e inscripciones: una sola fuente de verdad. */
  #gestionInscripciones .panel-pestana-modulo { display:none !important; }
  #gestionInscripciones .panel-pestana-modulo.v75-panel-activo {
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
    height:auto !important;
    max-height:none !important;
    overflow:visible !important;
  }
  #pestanasGestionGrupos button.v75-tab-activa {
    background:var(--itn-rojo) !important;
    border-color:var(--itn-rojo) !important;
    color:#fff !important;
  }
  .barra-cerrar-panel-v75 { display:flex; justify-content:flex-end; margin:0 0 12px; }
  .cerrar-panel-v75 {
    min-height:36px; padding:8px 13px; border:1px solid var(--itn-rojo);
    border-radius:9px; background:#fff; color:var(--itn-rojo); font-weight:900; cursor:pointer;
  }
  .cerrar-panel-v75:hover { background:#fff1f2; }

  /* Cupo escrito manualmente. */
  #crearGrupoCupo { max-width:100%; }

  /* Asignación de responsables. */
  .asignacion-actual-v75 {
    margin:14px 0 0; padding:12px 14px; border-left:5px solid var(--itn-amarillo);
    border-radius:10px; background:#fff8df; color:#4c3a00; line-height:1.45;
  }
  .asignacion-actual-v75 strong { color:#7f1723; }
  .estado-asignacion-v75 { margin-top:8px; font-size:13px; color:#665b5e; }

  /* Grupos del alumno. */
  .encabezado-grupos-alumno-v75 {
    grid-column:1 / -1; padding:18px 20px; border:1px solid #e6dadd;
    border-left:7px solid var(--itn-amarillo); border-radius:15px; background:#fff;
    box-shadow:0 10px 24px rgba(42,24,29,.06);
  }
  .encabezado-grupos-alumno-v75 h3 { margin:0; color:#8d1724; font-size:22px; }
  .encabezado-grupos-alumno-v75 p { margin:7px 0 0; color:#655c60; line-height:1.5; }
  .titulo-grupos-actividad-v75 { margin:16px 0 10px; color:#281d20; font-size:16px; }
  .grupo-opcion-v75 {
    display:grid; gap:10px; padding:16px; border:1px solid #e6dadd; border-radius:14px;
    background:#fff; box-shadow:0 8px 20px rgba(42,24,29,.05);
  }
  .grupo-cabecera-v75 { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; }
  .grupo-cabecera-v75 strong { color:#8d1724; font-size:17px; }
  .rama-badge-v75 {
    display:inline-flex; align-items:center; min-height:28px; padding:5px 10px;
    border-radius:999px; background:#fff3b3; color:#4f3900; font-size:12px; font-weight:900;
  }
  .grupo-datos-v75 { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 14px; color:#5f565a; font-size:13px; }
  .grupo-datos-v75 strong { color:#2d2225; }
  .acciones-grupo-v75 { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; }
  .boton-inscribir-v75 { min-width:205px; }

  @media(max-width:720px){
    .grupo-datos-v75{grid-template-columns:1fr;}
    .acciones-grupo-v75{align-items:stretch;}
    .boton-inscribir-v75{width:100%;}
  }



  .vineta-titulo-v44[data-v76-estable="1"]{user-select:none;-webkit-user-select:none;}
  .diagnostico-v76{margin-top:18px;padding:18px;border:1px solid #e4d8db;border-left:6px solid var(--itn-amarillo);border-radius:14px;background:#fff;}
  .diagnostico-v76 h4{margin:0 0 7px;color:var(--itn-rojo);}
  .diagnostico-v76 p{margin:0 0 12px;color:#5f5558;line-height:1.45;}
  .acciones-diagnostico-v76{display:flex;flex-wrap:wrap;gap:10px;}
  .resultado-diagnostico-v76{margin-top:12px;padding:12px;border-radius:10px;background:#f8f6f5;color:#281f21;font-size:13px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere;}



  #gestionRoles .apartado-colapsable-titulo[data-v77="1"],
  .vineta-titulo-v44[data-v77="1"]{cursor:pointer;user-select:none;-webkit-user-select:none;}
  #gestionRoles .panel-administracion-extra[data-permiso="ASIGNAR_DELEGADO"] label{color:#f8f5f6!important;font-weight:900!important;}
  #gestionRoles .panel-administracion-extra[data-permiso="ASIGNAR_DELEGADO"] h3{color:#fff!important;}
  .estado-asignacion-v77{margin:0 0 14px;padding:12px 14px;border:1px solid #4b3c40;border-left:5px solid #ffc400;border-radius:10px;background:#21191b;color:#fff;line-height:1.45;}
  .estado-asignacion-v77.error{border-left-color:#ef4444;background:#3b171b;color:#fee2e2;}
  .estado-asignacion-v77.ok{border-left-color:#22c55e;background:#15301f;color:#dcfce7;}
  .acciones-asignacion-v77{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 14px;}
  .acciones-asignacion-v77 button{margin:0!important;}
  .asignacion-actual-v77{margin:12px 0 0;padding:12px 14px;border-radius:10px;background:#fff8dc;color:#4a3500;line-height:1.5;}
  #pestanasGestionGrupos[data-v77="1"] button{pointer-events:auto!important;}
  .barra-cerrar-panel-v77{display:flex;justify-content:flex-end;margin:0 0 12px;}
  .cerrar-panel-v77{border:1px solid #b51f2e;border-radius:9px;background:#fff;color:#8d1724;padding:8px 12px;font-weight:900;cursor:pointer;}
  #mensajeAltaManual.v77-fijo{display:block;min-height:0;}