/* Portal de clientes · Editorial funcional.
   Contornos permanentes: los límites no dependen del hover ni de la sombra. */
body:has(.nav-portal) #tessa,
.nav-tessa.nav-portal {
    --fuente: 'DM Sans', 'Segoe UI', sans-serif;
    --portal-titulos: var(--fuente);
    --tx: #172536;
    --tx-2: #485c70;
    --tx-3: #596f82;
    --bg: #fff;
    --panel: #fff;
    --panel-2: #f0f5fa;
    --linea: #b5c5d3;
    --linea-2: #96aabd;
    --acento: #b52b46;
    --acento-osc: #8f1e37;
    --acento-luz: #fff0f3;
    --acento-bor: #dfa6b2;
    --azul: var(--acento);
    --azul-osc: var(--acento-osc);
    --azul-luz: var(--acento-luz);
    --azul-bor: var(--acento-bor);
    --portal-borde: #859cb1;
    --portal-sombra: 0 2px 0 #18374f13, 0 7px 18px #18374f16;
    --r: 12px;
}
body:has(.nav-portal) #tessa { background: #fff; font-family: var(--fuente); }
#tessa.portal { max-width: 1440px; padding-bottom: 55px; font-size: 15px; line-height: 1.65; }
#tessa.portal h1 { font-family: var(--fuente); font-size: clamp(29px, 3vw, 38px); font-weight: 700; line-height: 1.2; letter-spacing: -1px; margin-bottom: 12px; }
#tessa.portal h2 { font-family: var(--fuente); font-size: 22px; font-weight: 700; letter-spacing: -.4px; }
#tessa.portal h3 { font-family: var(--fuente); font-size: 18px; font-weight: 650; }
#tessa.portal .pagina-cab { padding-bottom: 24px; margin-bottom: 26px; border-color: #c0ceda; align-items: center; }
#tessa.portal .titulo-sub { font-size: 16px; line-height: 1.65; color: var(--tx-2); }
#tessa.portal .portal-kicker { font-size: 12px; font-weight: 750; color: var(--acento-osc); letter-spacing: 1px; margin-bottom: 12px; }
#tessa.portal .nota, #tessa.portal small, #tessa.portal .ayuda { line-height: 1.65; }
#tessa.portal .boton, #tessa.portal .btn-primario, #tessa.portal .btn-sutil, #tessa.portal .btn-aprobar, #tessa.portal .btn-peligro { border-radius: 8px; font-weight: 650; }
#tessa.portal .btn-sutil { border-color: #8ea4b7; color: #233f55; }
#tessa.portal .btn-sutil:hover { border-color: #5d7f99; background: #edf3f9; }
#tessa.portal .btn-primario { background: var(--acento); border-color: var(--acento); color: #fff; }
#tessa.portal .btn-primario:hover { background: var(--acento-osc); border-color: var(--acento-osc); }
#tessa.portal .etiqueta { font-size: 12px; font-weight: 650; border-width: 1px; }

/* Widgets principales: borde firme + elevación corta, siempre visibles. */
body:has(.nav-portal) #tessa .tarjeta,
body:has(.nav-portal) #tessa .bloque {
    border: 1.5px solid var(--portal-borde);
    border-radius: 12px;
    background: #fff;
    box-shadow: var(--portal-sombra);
    margin-bottom: 26px;
}
body:has(.nav-portal) #tessa .tarjeta-cab {
    background: #edf3f9;
    border-bottom: 1.5px solid #afc1d0;
    padding: 18px 22px;
    gap: 16px;
}
body:has(.nav-portal) #tessa .tarjeta-cab h2,
body:has(.nav-portal) #tessa .tarjeta-cab h3 {
    font-family: var(--fuente);
    font-size: 18px;
    font-weight: 750;
    line-height: 1.4;
    letter-spacing: -.25px;
    color: #18344b;
}
body:has(.nav-portal) #tessa .tarjeta-cab small { font-size: 14px; line-height: 1.6; color: #425c72; }
body:has(.nav-portal) #tessa .tarjeta-cuerpo { padding: 23px; }
body:has(.nav-portal) #tessa .tarjeta-pie { background: #f2f6fb; border-top: 1px solid #b9c9d6; padding: 17px 22px; }
body:has(.nav-portal) #tessa .tarjeta.destacada { border-color: #ba6579; border-left: 4px solid var(--acento); }
body:has(.nav-portal) #tessa .tarjeta.destacada > .tarjeta-cab { background: #fff1f4; border-bottom-color: #d39aa8; }
body:has(.nav-portal) #tessa .tarjeta-cuerpo .tarjeta,
body:has(.nav-portal) #tessa .tarjeta-cuerpo .bloque { box-shadow: none; border-color: #b4c4d2; border-width: 1px; }
#tessa.portal .aprobacion { background: #fff; border: 1px solid #b2c3d1; border-left: 3px solid #b52b46; border-radius: 9px; padding: 22px; }
#tessa.portal .aprobacion h3 { font-size: 18px; }
#tessa.portal .vacio { border-radius: 10px; background: #fff; font-size: 15px; line-height: 1.7; }
#tessa.portal .vacio strong { font-family: var(--fuente); font-size: 20px; font-weight: 650; }

/* Resumen: tres áreas que también se reconocen como unidades independientes. */
#tessa.portal .portal-overview { gap: 18px; border: 0; margin-bottom: 30px; }
#tessa.portal .portal-overview > *,
#tessa.portal .portal-overview > :first-child,
#tessa.portal .portal-overview > :last-child { padding: 19px 22px; border: 1.5px solid var(--portal-borde); border-radius: 12px; box-shadow: var(--portal-sombra); background: #fff; }
#tessa.portal .portal-overview-label { font-size: 14px; font-weight: 700; color: #314c63; }
#tessa.portal .portal-overview strong { font-family: var(--fuente); font-weight: 700; font-size: 31px; line-height: 1.5; color: #18344b; }
#tessa.portal .portal-overview-note { font-size: 13px; color: #4a6379; }
#tessa.portal .portal-section-heading h2 { font-family: var(--fuente); font-size: 25px; font-weight: 700; letter-spacing: -.65px; }
#tessa.portal .portal-section-heading { margin-bottom: 20px; }
#tessa.portal .portal-projects-section { margin: 32px 0; }
#tessa.portal .portal-project-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
#tessa.portal .portal-project-card,
#tessa.portal .rejilla .portal-project-card { border: 1.5px solid #859cb1; border-top: 3px solid #b52b46; background: #fff; margin: 0; box-shadow: var(--portal-sombra); }
#tessa.portal .portal-project-card:hover,
#tessa.portal .rejilla .portal-project-card:hover { border-color: #6c879e; border-top-color: #8f1e37; background: #fff; box-shadow: 0 3px 0 #18374f16, 0 10px 24px #18374f20; }
#tessa.portal .portal-project-card-top { background: #edf3f9; border-bottom: 1px solid #b6c8d7; padding: 15px 22px; }
#tessa.portal .portal-project-kind { color: #304f68; font-size: 13px; font-weight: 650; }
#tessa.portal .portal-project-index { font-family: var(--fuente); font-size: 14px; color: #526c81; font-weight: 650; }
#tessa.portal .portal-project-card h3 { font-family: var(--fuente); font-size: 23px; font-weight: 700; line-height: 1.3; letter-spacing: -.55px; color: #18344b; }
#tessa.portal .portal-project-card .tarjeta-cuerpo { padding: 22px; }
#tessa.portal .portal-project-card-bottom { margin: 0; padding: 17px 22px; border-top: 1px solid #b9c9d6; background: #f7faff; }
#tessa.portal .portal-project-date > span { font-size: 12px; }
#tessa.portal .portal-project-open { font-size: 14px; font-weight: 700; color: var(--acento-osc); }
#tessa.portal .portal-home-secondary { border: 0; padding-top: 0; gap: 24px; }
#tessa.portal .ficha-cab { border: 1.5px solid var(--portal-borde); border-left: 4px solid var(--acento); border-radius: 12px; padding: 25px; box-shadow: var(--portal-sombra); }
#tessa.portal .portal-project-progress { margin-top: 22px; border-top-color: #b3c5d4; }
#tessa.portal .portal-project-percent strong { font-family: var(--fuente); font-size: 33px; font-weight: 700; color: #18344b; }
#tessa.portal .portal-project-percent > span { font-size: 12px; }
#tessa.portal .progreso-barra { height: 7px; background: #e0e9f2; }
#tessa.portal .progreso-barra > span { background: #b52b46; }
#tessa.portal .gap-tarjeta { border: 1.5px solid #afc0cf; border-radius: 10px; box-shadow: none; }
#tessa.portal .gap-tarjeta-titulo, #tessa.portal .hito-cab h3 { font-family: var(--fuente); font-size: 20px; font-weight: 700; letter-spacing: -.3px; }
#tessa.portal .gap-recurso { border: 1.5px solid #a7bbcb; background: #f7faff; border-radius: 10px; }
#tessa.portal .gap-recurso-cta { background: #b52b46; }
#tessa.portal .cad-intro h2 { font-family: var(--fuente); font-size: 27px; font-weight: 700; }
#tessa.portal .hito-cuerpo { border-color: #b0c3d2; background: #fff; }
#tessa.portal th { background: #edf3f9; color: #2d4b63; font-size: 13px; font-weight: 700; border-bottom-color: #a9bdcd; }
#tessa.portal td { border-color: #c4d2de; font-size: 14px; }
#tessa.portal .doc-meta { font-size: 13px; }

/* Identidad y navegación. La versión interna de Tessa conserva su propio menú. */
.nav-tessa.nav-portal { box-sizing: border-box; font-family: var(--fuente); border-color: #aabfce; background: #fff; }
.nav-tessa.nav-portal .nav-marca-icono { background: #b52b46; color: #fff; border-color: #b52b46; border-radius: 9px; width: 35px; height: 35px; font-size: 26px; box-shadow: none; }
.nav-tessa.nav-portal .nav-marca-txt { color: #172536; font-family: var(--fuente); font-size: 25px; font-weight: 750; letter-spacing: -.8px; }
.nav-tessa.nav-portal .nav-marca.activo .nav-marca-txt { color: #172536; }
.nav-tessa.nav-portal .nav-marca-sub { color: #4e6377; font-size: 11px; }
.nav-tessa.nav-portal .nav-menu > a { font-weight: 600; color: #425c72; }
.nav-tessa.nav-portal .nav-menu > a:hover { color: #8f1e37; background: #f4f7fb; }
.nav-tessa.nav-portal .nav-menu > a.activo { color: #9e223d; background: #fff0f3; }
.nav-tessa.nav-portal .nav-menu > a.activo::after { background: #b52b46; }
.nav-tessa.nav-portal .portal-nav-item-icon { width: 19px; height: 19px; flex-shrink: 0; }
.nav-tessa.nav-portal .nav-avatar { border-color: #b6c6d4; background: #edf3f9; color: #284b66; }
.nav-tessa.nav-portal .nav-badge { background: #b52b46; }
.nav-tessa.nav-portal .nav-modal-opciones a.activo { background: #fff0f3; color: #9e223d; border-left: 3px solid #b52b46; }
.nav-tessa.nav-portal .nav-desplegable { border: 1.5px solid #a6bacb; box-shadow: 0 5px 0 #18374f0e, 0 10px 28px #18374f26; }
.nav-tessa.nav-portal a:focus-visible, .nav-tessa.nav-portal button:focus-visible, .nav-tessa.nav-portal summary:focus-visible,
body:has(.nav-portal) #tessa a:focus-visible, body:has(.nav-portal) #tessa button:focus-visible, body:has(.nav-portal) #tessa summary:focus-visible { outline: 3px solid #476fd5; outline-offset: 3px; }
.portal-footer { border-top-color: #b6c7d5; background: #fff; }
.portal-footer strong { font-family: 'DM Sans', 'Segoe UI', sans-serif; font-size: 22px; font-weight: 700; color: #172536; }
.portal-footer-interior { max-width: 1440px; padding-top: 25px; padding-bottom: 28px; }

/* Mensajes: mismo límite de widget, sin cambiar su presentación móvil completa. */
body:has(.nav-portal) #tessa .chat-modulo { --chat-azul: #9e223d; --chat-linea: #adbfce; color: #172536; }
body:has(.nav-portal) #tessa .chat-distribucion { border: 1.5px solid #859cb1; border-radius: 12px; box-shadow: var(--portal-sombra); }
body:has(.nav-portal) #tessa .chat-conversacion-cab { background: #edf3f9; border-bottom: 1.5px solid #afc1d0; }
body:has(.nav-portal) #tessa .chat-bandeja { border-right: 1.5px solid #afc1d0; background: #f5f8fc; }
body:has(.nav-portal) #tessa .chat-ficha.seleccionada { border-color: #a8bacb; background: #fff; box-shadow: 0 2px 5px #18374f12; }
body:has(.nav-portal) #tessa .chat-nuevo { border: 1.5px solid #859cb1; box-shadow: var(--portal-sombra); }

@media(min-width:1024px) {
    .nav-tessa.nav-portal { position: fixed; inset: 0 auto 0 0; width: 232px; height: 100dvh; border-right: 1.5px solid #b5c6d4; border-bottom: 0; z-index: 50; }
    .nav-tessa.nav-portal .nav-tessa-interior { height: 100%; min-height: 0; width: 100%; padding: 28px 17px 22px; display: flex; flex-direction: column; align-items: stretch; gap: 28px; }
    .nav-tessa.nav-portal .nav-marca { padding: 0 4px; gap: 10px; }
    .nav-tessa.nav-portal .nav-menu { display: flex; flex-direction: column; align-items: stretch; flex: 1; gap: 7px; overflow-y: auto; min-height: 0; }
    .nav-tessa.nav-portal .nav-menu > a { display: flex; align-items: center; gap: 11px; padding: 12px; height: auto; min-height: 46px; white-space: normal; border: 1px solid transparent; border-radius: 9px; font-size: 14px; }
    .nav-tessa.nav-portal .nav-menu > a.activo { border-color: #e0a6b4; }
    .nav-tessa.nav-portal .nav-menu > a.activo::after { display: none; }
    .nav-tessa.nav-portal .nav-lado { display: flex; justify-content: space-between; flex-shrink: 0; width: 100%; margin: 0; padding-top: 18px; border-top: 1px solid #b9cbd9; }
    .nav-tessa.nav-portal .nav-cuenta .nav-nombre { display: none; }
    .nav-tessa.nav-portal .nav-desplegable { top: auto; bottom: calc(100% + 12px); left: auto; right: 0; min-width: 215px; max-width: calc(100vw - 30px); }
    .nav-tessa.nav-portal .nav-hamburguesa { display: none; }
    body:has(.nav-portal) #tessa { max-width: 1440px; margin: 0 auto 0 232px; padding: 32px 36px 55px; }
    .portal-footer { margin-left: 232px; }
    .portal-footer-interior { padding-left: 36px; padding-right: 36px; }
}
@media(min-width:1800px) { body:has(.nav-portal) #tessa { margin-left: calc(232px + (100vw - 1672px) / 2); } }
@media(max-width:1023px) {
    .nav-tessa.nav-portal .nav-tessa-interior { min-height: 74px; padding: 0 24px; gap: 16px; }
    .nav-tessa.nav-portal .nav-menu { display: none; }
    .nav-tessa.nav-portal .nav-hamburguesa { display: flex; }
    #tessa.portal { padding-left: 24px; padding-right: 24px; }
}
@media(max-width:800px) {
    #tessa.portal .portal-project-grid { grid-template-columns: 1fr; }
    #tessa.portal .portal-overview { gap: 12px; }
    #tessa.portal .portal-overview > *, #tessa.portal .portal-overview > :first-child, #tessa.portal .portal-overview > :last-child { padding: 17px; }
    #tessa.portal .portal-overview-label { font-size: 13px; }
    #tessa.portal .portal-section-heading h2 { font-size: 23px; }
}
@media(max-width:620px) {
    #tessa.portal { padding-left: 17px; padding-right: 17px; }
    #tessa.portal h1 { font-size: 30px; letter-spacing: -.7px; }
    #tessa.portal .portal-overview { grid-template-columns: 1fr; gap: 14px; }
    #tessa.portal .portal-overview > *, #tessa.portal .portal-overview > :first-child, #tessa.portal .portal-overview > :last-child { padding: 17px 19px; }
    #tessa.portal .portal-overview strong { font-size: 29px; }
    #tessa.portal .portal-overview-note { font-size: 13px; }
    body:has(.nav-portal) #tessa .tarjeta-cab { padding: 16px 18px; }
    body:has(.nav-portal) #tessa .tarjeta-cuerpo { padding: 19px; }
    #tessa.portal .portal-project-card h3 { font-size: 22px; }
    #tessa.portal .ficha-cab { padding: 21px; }
    #tessa.portal .tabla-envoltorio tbody tr { border: 1px solid #a6bbcc; border-radius: 9px; margin: 12px; background: #fff; }
    .nav-tessa.nav-portal .nav-tessa-interior { min-height: 69px; padding: 0 17px; gap: 9px; }
    .nav-tessa.nav-portal .nav-marca-sub { font-size: 10px; }
    .nav-tessa.nav-portal .nav-marca-txt { font-size: 22px; }
    body:has(.nav-portal) #tessa .chat-bandeja { border-right: 0; border-bottom: 1.5px solid #afc1d0; }
}
@media(max-width:850px) {
    body.tessa-chat-abierto:has(.nav-portal) #tessa .chat-distribucion { border: 0; border-radius: 0; box-shadow: none; }
    body.tessa-chat-abierto:has(.nav-portal) #tessa .chat-conversacion-cab { background: #fff; }
}
@media print {
    body:has(.nav-portal) #tessa { margin: 0; padding: 0; max-width: none; }
    .nav-tessa.nav-portal { display: none; }
    .portal-footer { margin: 0; }
    body:has(.nav-portal) #tessa .tarjeta { box-shadow: none; border-color: #586c7c; }
}
