@import url("./encprev-premium-darkblue.css?v=20260812");

/* =========================================================
   ENCPREV v38 - Unificación visual global
   Base visual: sidebar del Dashboard.
   Este archivo sobrescribe sidebars duplicados y fondos planos
   sin tocar la lógica PHP ni base de datos.
========================================================= */

:root {
    --encprev-blue-900: #061f49;
    --encprev-blue-800: #0b3b82;
    --encprev-blue-600: #155eef;
    --encprev-line: #e5eaf2;
    --encprev-text: #0f172a;
    --encprev-muted: #64748b;
}

/* Fondo institucional interno */
html,
body {
    min-height: 100%;
}

body {
    background:
        url("../img/brand-background.svg") center top / cover no-repeat fixed,
        linear-gradient(180deg, #f8fbff 0%, #eef4ff 100%) !important;
}

.app-shell,
.dashboard-shell,
.page-shell,
.main-shell {
    background: transparent !important;
}

.content,
.main-content,
.page-content,
.dashboard-content {
    background: transparent !important;
}

/* Layout común */
.layout,
.layout-with-sidebar,
.content-with-sidebar {
    display: grid !important;
    grid-template-columns: 116px minmax(0, 1fr) !important;
    min-height: calc(100vh - 82px) !important;
}

/* Sidebar único tipo dashboard */
.rail,
.sidebar,
.left-sidebar,
aside.sidebar {
    margin: 18px 0 18px 18px !important;
    background: linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(246,249,255,.98) 100%) !important;
    border: 1px solid var(--encprev-line) !important;
    box-shadow: 0 18px 34px rgba(15, 23, 42, 0.08) !important;
    padding: 14px 10px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    border-radius: 28px !important;
    min-height: calc(100vh - 118px) !important;
    position: sticky !important;
    top: 18px !important;
    width: auto !important;
    z-index: 20;
}

.rail-menu,
.sidebar-menu {
    display: grid !important;
    gap: 10px !important;
    align-content: start !important;
}

/* Links del sidebar, aunque vengan de distintas plantillas */
.rail-link,
.sidebar a,
.left-sidebar a,
aside.sidebar a {
    min-height: 70px !important;
    width: auto !important;
    height: auto !important;
    border-radius: 18px !important;
    color: #082b63 !important;
    text-decoration: none !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    padding: 10px 8px !important;
    font-size: 24px !important;
    font-weight: 800 !important;
    background: rgba(255,255,255,.92) !important;
    border: 1px solid #e6edf7 !important;
    transition: .18s ease !important;
    line-height: 1.15 !important;
    text-align: center !important;
}

.rail-link .svg-icon,
.sidebar a .svg-icon,
.left-sidebar a .svg-icon,
aside.sidebar a .svg-icon {
    width: 24px !important;
    height: 24px !important;
    flex: 0 0 auto !important;
}

.rail-link.active,
.rail-link:hover,
.sidebar a.active,
.sidebar a:hover,
.left-sidebar a.active,
.left-sidebar a:hover,
aside.sidebar a.active,
aside.sidebar a:hover {
    background: linear-gradient(135deg, var(--encprev-blue-600), var(--encprev-blue-800)) !important;
    color: white !important;
    box-shadow: 0 12px 24px rgba(21, 94, 239, 0.24) !important;
    border-color: transparent !important;
    transform: translateY(-1px) !important;
}

/* Si el HTML no trae etiqueta, se usa title como etiqueta visual */
.rail-link[title]::after,
.sidebar a[title]::after,
.left-sidebar a[title]::after,
aside.sidebar a[title]::after {
    content: attr(title);
    display: block;
    font-size: 10.5px;
    line-height: 1.15;
    text-align: center;
    letter-spacing: .02em;
    max-width: 88px;
    overflow-wrap: anywhere;
}

.rail-link .rail-text,
.rail-link[title] .rail-text {
    display: none !important;
}

/* Footer / ayuda */
.rail-footer {
    display: grid !important;
    gap: 10px !important;
}

.rail-profile {
    padding: 10px 8px !important;
    border-radius: 18px !important;
    background: #fff !important;
    border: 1px solid #e6edf7 !important;
    text-align: center !important;
    display: grid !important;
    gap: 8px !important;
    justify-items: center !important;
}

.rail-profile-icon {
    width: 40px !important;
    height: 40px !important;
    border-radius: 14px !important;
    background: linear-gradient(135deg, var(--encprev-blue-800), var(--encprev-blue-600)) !important;
    color: #fff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 15px !important;
    font-weight: 900 !important;
}

.rail-profile strong {
    display: block !important;
    font-size: 10.5px !important;
    color: var(--encprev-text) !important;
    line-height: 1.2 !important;
}

.rail-profile span {
    display: block !important;
    font-size: 9.5px !important;
    color: var(--encprev-muted) !important;
    font-weight: 800 !important;
    margin-top: 3px !important;
}

.rail-help {
    min-height: 46px !important;
    width: auto !important;
    height: auto !important;
    border-radius: 16px !important;
    border: 1px solid #d7e1ef !important;
    color: #082b63 !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    text-decoration: none !important;
    background: #fff !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    margin: 0 !important;
}

.rail-help .svg-icon {
    width: 20px !important;
    height: 20px !important;
}

.rail-help[title]::after {
    content: attr(title);
    font-size: 10.5px;
}

/* Evitar doble texto cuando sí existe span */
.rail-help span + * { display: none !important; }

/* Logo superior con contraste */
.brand h1,
.app-brand h1,
.brand span,
.app-brand span {
    display: none !important;
}

.brand-logo,
.app-brand-logo {
    background: rgba(255,255,255,.96) !important;
    border: 1px solid rgba(219, 231, 251, .95) !important;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .12) !important;
    overflow: hidden !important;
}

.brand-logo img,
.app-brand-logo img {
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
}

/* Tarjetas sobre fondo institucional */
.hero-card,
.global-card,
.kpi-card,
.companies-card,
.quick-card,
.section-card,
.modules-card,
.panel,
.card,
.card-modern,
.compliance-card,
.document-card,
.history-card {
    background: rgba(255,255,255,.96) !important;
    backdrop-filter: blur(6px);
}

/* Móvil: barra inferior real, scroll horizontal y etiquetas legibles */
@media (max-width: 860px) {
    body {
        background:
            url("../img/brand-background.svg") center top / cover no-repeat fixed,
            linear-gradient(180deg, #f8fbff 0%, #eef4ff 100%) !important;
        padding-bottom: 88px !important;
    }

    .layout,
    .layout-with-sidebar,
    .content-with-sidebar {
        display: block !important;
        grid-template-columns: 1fr !important;
        min-height: auto !important;
    }

    .rail,
    .sidebar,
    .left-sidebar,
    aside.sidebar {
        position: fixed !important;
        left: 10px !important;
        right: 10px !important;
        bottom: 10px !important;
        top: auto !important;
        z-index: 9999 !important;
        width: auto !important;
        min-height: 0 !important;
        height: 72px !important;
        margin: 0 !important;
        padding: 8px !important;
        border-radius: 24px !important;
        display: flex !important;
        flex-direction: row !important;
        justify-content: flex-start !important;
        align-items: center !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .rail::-webkit-scrollbar,
    .sidebar::-webkit-scrollbar,
    .left-sidebar::-webkit-scrollbar {
        display: none;
    }

    .rail > div:first-child,
    .rail-menu,
    .sidebar-menu {
        display: flex !important;
        flex-direction: row !important;
        gap: 8px !important;
        align-items: center !important;
        min-width: max-content !important;
    }

    .rail-link,
    .sidebar a,
    .left-sidebar a,
    aside.sidebar a {
        min-width: 76px !important;
        width: 76px !important;
        min-height: 54px !important;
        height: 54px !important;
        border-radius: 16px !important;
        padding: 6px 6px !important;
        gap: 4px !important;
        flex: 0 0 auto !important;
    }

    .rail-link .svg-icon,
    .sidebar a .svg-icon,
    .left-sidebar a .svg-icon,
    aside.sidebar a .svg-icon {
        width: 20px !important;
        height: 20px !important;
    }

    .rail-link[title]::after,
    .sidebar a[title]::after,
    .left-sidebar a[title]::after,
    aside.sidebar a[title]::after {
        font-size: 9.5px !important;
        line-height: 1.05 !important;
        max-width: 70px !important;
        white-space: normal !important;
    }

    .rail-footer,
    .rail-profile,
    .rail-help {
        display: none !important;
    }

    .content,
    .main-content,
    .page-content,
    .dashboard-content {
        padding-bottom: 96px !important;
    }
}


/* =========================================================
   ENCPREV v39 - Corrección MIPER + topbar móvil
   Corrige efecto desvanecido y evita montaje de menú superior.
========================================================= */

/* Recuperar contraste en MIPER y evitar apariencia lavada */
body:has(.miper-shell),
body:has(.miper-page),
body:has(.miper-wrap),
body:has(.miper-card),
body:has(.miper-module),
body:has(.miper-container) {
    color: #0f172a !important;
}

.miper-shell,
.miper-page,
.miper-wrap,
.miper-container,
.miper-main,
.miper-content,
.miper-card,
.miper-module,
.miper-option,
.miper-panel,
.miper-step,
.miper-box,
.miper-hero,
.miper-tabs,
.miper-tab,
.miper-section,
.miper-access,
.miper-layout,
.miper-grid,
.miper-card *,
.miper-module *,
.miper-option *,
.miper-panel * {
    opacity: 1 !important;
    filter: none !important;
}

.miper-card,
.miper-module,
.miper-option,
.miper-panel,
.miper-step,
.miper-box,
.miper-hero,
.miper-section,
.miper-access,
.miper-tab,
.miper-tabs > *,
.miper-grid > *,
.miper-layout > * {
    background: rgba(255,255,255,.97) !important;
    color: #0f172a !important;
    border-color: #dbe7fb !important;
}

.miper-card p,
.miper-module p,
.miper-option p,
.miper-panel p,
.miper-step p,
.miper-box p,
.miper-hero p,
.miper-section p,
.miper-card span,
.miper-module span,
.miper-option span,
.miper-panel span,
.miper-step span,
.miper-box span,
.miper-hero span,
.miper-section span {
    color: #475569 !important;
}

.miper-card h1,
.miper-card h2,
.miper-card h3,
.miper-module h1,
.miper-module h2,
.miper-module h3,
.miper-option h1,
.miper-option h2,
.miper-option h3,
.miper-panel h1,
.miper-panel h2,
.miper-panel h3,
.miper-hero h1,
.miper-hero h2,
.miper-hero h3,
.miper-section h1,
.miper-section h2,
.miper-section h3 {
    color: #0f172a !important;
}

/* Evitar que botones activos o disponibles queden apagados */
.miper-card a,
.miper-module a,
.miper-option a,
.miper-panel a,
.miper-card button,
.miper-module button,
.miper-option button,
.miper-panel button,
.miper-hero a,
.miper-hero button {
    opacity: 1 !important;
    filter: none !important;
}

/* Solo mantener realmente apagado lo que esté marcado como disabled */
.miper-card.disabled,
.miper-module.disabled,
.miper-option.disabled,
.miper-panel.disabled,
.miper-card[aria-disabled="true"],
.miper-module[aria-disabled="true"],
.miper-option[aria-disabled="true"],
.miper-panel[aria-disabled="true"] {
    opacity: .58 !important;
}

/* Topbar móvil limpia: logo a la izquierda y acciones como botones circulares */
@media (max-width: 860px) {
    .topbar {
        min-height: 84px !important;
        height: auto !important;
        padding: 14px 18px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 12px !important;
        border-radius: 0 0 24px 24px !important;
        overflow: hidden !important;
    }

    .brand,
    .app-brand {
        margin: 0 !important;
        min-width: 0 !important;
        flex: 0 0 auto !important;
        display: flex !important;
        align-items: center !important;
    }

    .brand-logo,
    .app-brand-logo {
        width: 54px !important;
        height: 54px !important;
        min-width: 54px !important;
        border-radius: 18px !important;
    }

    .topnav {
        margin: 0 !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 8px !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        max-width: calc(100vw - 106px) !important;
        scrollbar-width: none !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .topnav::-webkit-scrollbar {
        display: none !important;
    }

    .topnav-separator {
        display: none !important;
    }

    .topnav a {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        border-radius: 999px !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 0 !important;
        font-size: 0 !important;
        line-height: 0 !important;
        background: rgba(255,255,255,.12) !important;
        border: 1px solid rgba(255,255,255,.20) !important;
        color: #fff !important;
        overflow: hidden !important;
        white-space: nowrap !important;
        flex: 0 0 auto !important;
    }

    .topnav a .svg-icon,
    .topnav a svg {
        width: 22px !important;
        height: 22px !important;
        min-width: 22px !important;
        display: block !important;
    }

    /* En móvil evita textos superiores montados; la navegación principal queda abajo */
    .topnav a:not(:first-child):not(:last-child) {
        display: none !important;
    }

    /* Dashboard móvil: evitar que la barra inferior tape KPIs */
    .kpi-row,
    .summary-grid,
    .companies-grid,
    .company-grid,
    .module-grid,
    .items-grid {
        padding-bottom: 6px !important;
    }

    /* MIPER móvil: cards legibles y no desvanecidas */
    .miper-card,
    .miper-module,
    .miper-option,
    .miper-panel,
    .miper-hero,
    .miper-section,
    .miper-access,
    .miper-grid > *,
    .miper-layout > * {
        opacity: 1 !important;
        filter: none !important;
        background: rgba(255,255,255,.98) !important;
        color: #0f172a !important;
    }

    .miper-card p,
    .miper-module p,
    .miper-option p,
    .miper-panel p,
    .miper-hero p,
    .miper-section p,
    .miper-card span,
    .miper-module span,
    .miper-option span,
    .miper-panel span,
    .miper-hero span,
    .miper-section span {
        color: #475569 !important;
    }
}

/* Fallback para navegadores sin :has(): refuerzo por URL/ruta no disponible desde CSS,
   por eso se atacan clases y estructuras comunes de MIPER. */


/* =========================================================
   ENCPREV v41 - UX móvil
   Corrige logo móvil, topbar, navegación inferior y pantallas pesadas.
========================================================= */

/* Logo visible siempre */
.brand-logo,
.app-brand-logo,
.logo-box,
.logo-wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(255,255,255,.96) !important;
    border: 1px solid rgba(219,231,251,.95) !important;
    box-shadow: 0 10px 24px rgba(15,23,42,.12) !important;
    overflow: hidden !important;
}

.brand-logo img,
.app-brand-logo img,
.logo-box img,
.logo-wrap img {
    display: block !important;
    max-width: 82% !important;
    max-height: 82% !important;
    object-fit: contain !important;
    opacity: 1 !important;
    filter: none !important;
}

/* Si una vista trae logo como background o queda vacío, mantener caja limpia */
.brand-logo:empty,
.app-brand-logo:empty {
    background: rgba(255,255,255,.96) url("../img/logo-encprev-oficial.png") center / 78% auto no-repeat !important;
}

/* Mobile general */
@media (max-width: 860px) {
    body {
        min-width: 0 !important;
        overflow-x: hidden !important;
        padding-bottom: 92px !important;
    }

    .topbar {
        min-height: 76px !important;
        height: auto !important;
        padding: 12px 18px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 12px !important;
        border-radius: 0 0 24px 24px !important;
        overflow: hidden !important;
    }

    .brand,
    .app-brand {
        display: flex !important;
        align-items: center !important;
        gap: 0 !important;
        margin: 0 !important;
        min-width: 0 !important;
        flex: 0 0 auto !important;
    }

    .brand > div:not(.brand-logo),
    .app-brand > div:not(.app-brand-logo),
    .brand h1,
    .brand span,
    .app-brand h1,
    .app-brand span {
        display: none !important;
    }

    .brand-logo,
    .app-brand-logo {
        width: 54px !important;
        height: 54px !important;
        min-width: 54px !important;
        border-radius: 18px !important;
    }

    .topnav {
        margin: 0 !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 8px !important;
        flex-wrap: nowrap !important;
        overflow: hidden !important;
        max-width: calc(100vw - 104px) !important;
    }

    .topnav-separator {
        display: none !important;
    }

    .topnav a {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        border-radius: 999px !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 0 !important;
        font-size: 0 !important;
        line-height: 0 !important;
        background: rgba(255,255,255,.12) !important;
        border: 1px solid rgba(255,255,255,.20) !important;
        color: #fff !important;
        overflow: hidden !important;
        white-space: nowrap !important;
        flex: 0 0 auto !important;
    }

    .topnav a .svg-icon,
    .topnav a svg {
        width: 22px !important;
        height: 22px !important;
        min-width: 22px !important;
        display: block !important;
    }

    .topnav a:not(:first-child):not(:last-child) {
        display: none !important;
    }

    .content,
    .main-content,
    .page-content,
    .dashboard-content {
        padding: 16px 14px 102px !important;
        overflow-x: hidden !important;
    }

    .inner {
        width: 100% !important;
        max-width: 100% !important;
        zoom: 1 !important;
    }

    /* Carruseles móviles para secciones anchas */
    .kpi-row,
    .summary-grid,
    .compliance-stats {
        display: flex !important;
        grid-template-columns: none !important;
        overflow-x: auto !important;
        gap: 12px !important;
        padding: 2px 4px 14px !important;
        scroll-snap-type: x mandatory !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .kpi-row > *,
    .summary-grid > *,
    .compliance-stats > * {
        min-width: 230px !important;
        scroll-snap-align: start !important;
        flex: 0 0 auto !important;
    }

    /* Botonera inferior limpia */
    .rail,
    .sidebar,
    .left-sidebar,
    aside.sidebar {
        height: 74px !important;
        padding: 8px !important;
        border-radius: 24px !important;
        left: 10px !important;
        right: 10px !important;
        bottom: 10px !important;
        background: rgba(255,255,255,.96) !important;
        backdrop-filter: blur(12px) !important;
    }

    .rail-link,
    .sidebar a,
    .left-sidebar a,
    aside.sidebar a {
        min-width: 82px !important;
        width: 82px !important;
        min-height: 56px !important;
        height: 56px !important;
        border-radius: 17px !important;
    }

    .rail-link[title]::after,
    .sidebar a[title]::after,
    .left-sidebar a[title]::after,
    aside.sidebar a[title]::after {
        font-size: 9.5px !important;
        line-height: 1.05 !important;
        max-width: 74px !important;
    }
}

/* Asistente IA móvil: convertir en flujo más liviano */
@media (max-width: 860px) {
    body:has(.mode-grid) .hero-card {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 14px !important;
        padding: 18px !important;
        min-height: 0 !important;
    }

    body:has(.mode-grid) .hero-icon {
        width: 68px !important;
        height: 68px !important;
        border-radius: 22px !important;
        margin: 0 !important;
    }

    body:has(.mode-grid) .hero-icon .svg-icon {
        width: 34px !important;
        height: 34px !important;
    }

    body:has(.mode-grid) .hero-card h2 {
        font-size: 24px !important;
        line-height: 1.15 !important;
    }

    body:has(.mode-grid) .hero-card p {
        font-size: 14px !important;
        line-height: 1.45 !important;
    }

    body:has(.mode-grid) .badge-warning {
        padding: 12px !important;
        font-size: 13px !important;
        line-height: 1.35 !important;
    }

    body:has(.mode-grid) .ai-usage-card {
        padding: 14px !important;
        border-radius: 20px !important;
    }

    body:has(.mode-grid) .mode-grid {
        display: flex !important;
        grid-template-columns: none !important;
        overflow-x: auto !important;
        gap: 12px !important;
        padding: 2px 4px 14px !important;
        -webkit-overflow-scrolling: touch !important;
        scroll-snap-type: x mandatory !important;
    }

    body:has(.mode-grid) .mode-card {
        min-width: 230px !important;
        flex: 0 0 auto !important;
        scroll-snap-align: start !important;
        min-height: 110px !important;
        padding: 16px !important;
    }

    body:has(.mode-grid) .main-grid,
    body:has(.mode-grid) .top-flow-grid,
    body:has(.mode-grid) .form-grid {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }

    body:has(.mode-grid) .panel,
    body:has(.mode-grid) .section-card {
        padding: 16px !important;
        border-radius: 20px !important;
    }
}


/* =========================================================
   ENCPREV v42 - Cierre visual
   Menús MIPER visibles + fondos limpios sin estela blanca.
========================================================= */

/* Evita la "estela blanca" de contenedores amplios detrás de módulos */
.app-shell,
.dashboard-shell,
.page-shell,
.main-shell,
.content,
.main-content,
.page-content,
.dashboard-content,
.inner,
.container,
.wrapper,
.page-wrapper,
.module-wrapper,
.module-container {
    background: transparent !important;
}

/* Mantener solo tarjetas/paneles como superficies blancas, no contenedores gigantes */
.hero-card,
.global-card,
.kpi-card,
.companies-card,
.quick-card,
.section-card,
.modules-card,
.panel,
.card,
.card-modern,
.compliance-card,
.document-card,
.history-card,
.module-card,
.item-card,
.company-card {
    background: rgba(255,255,255,.96) !important;
}

/* Regla especial: los fondos decorativos no deben quedar tapados por overlays planos */
body::before,
body::after,
.app-shell::before,
.app-shell::after,
.content::before,
.content::after,
.inner::before,
.inner::after {
    pointer-events: none !important;
}

/* Topbar notebook: si hay mucho menú, que no desaparezca ni se monte */
@media (min-width: 861px) {
    .topbar {
        overflow: visible !important;
    }

    .topnav {
        overflow: visible !important;
        flex-wrap: nowrap !important;
        white-space: nowrap !important;
    }

    .topnav a {
        white-space: nowrap !important;
    }
}

/* Móvil: corregir montaje de topbar sin eliminar navegación inferior */
@media (max-width: 860px) {
    .topbar {
        overflow: hidden !important;
    }

    .topnav {
        overflow: hidden !important;
        max-width: calc(100vw - 104px) !important;
    }

    .topnav a:not(:first-child):not(:last-child) {
        display: none !important;
    }
}


/* =========================================================
   ENCPREV - Auditoría visual consolidada
   Unifica logo oficial y acceso directo SST.
========================================================= */
.brand-logo,
.app-brand-logo,
.public-logo {
    background: #ffffff !important;
    border: 1px solid rgba(255,255,255,.75) !important;
    box-shadow: 0 8px 18px rgba(0,0,0,.10) !important;
    overflow: hidden !important;
}

.brand-logo .svg-icon,
.app-brand-logo .svg-icon,
.public-logo .svg-icon {
    display: none !important;
}

.encprev-brandmark,
.brand-logo img,
.app-brand-logo img,
.public-logo img {
    display: block !important;
    width: 88% !important;
    height: 88% !important;
    object-fit: contain !important;
}

.rail-link[title="SST"] {
    color: #082b63;
}

.rail-link[title="SST"].active,
.rail-link[title="SST"]:hover {
    background: linear-gradient(135deg, #155eef, #0b3b82) !important;
    color: #ffffff !important;
}



/* V39.1 - Sidebar: usar texto real del enlace, evitar cortes raros */
.rail-link[title]::after,
.sidebar a[title]::after,
.left-sidebar a[title]::after,
aside.sidebar a[title]::after,
.rail-help[title]::after {
    content: none !important;
    display: none !important;
}

.rail-link .rail-text,
.sidebar a .rail-text,
.left-sidebar a .rail-text,
aside.sidebar a .rail-text {
    display: block !important;
    font-size: 11px !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    max-width: 86px !important;
    text-align: center !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
}

.rail-help span {
    display: block !important;
    font-size: 10.5px !important;
    line-height: 1.1 !important;
    font-weight: 800 !important;
}

.rail-help span + * { display: none !important; }