/* Keep the Unfold brand centered while preserving the logo proportions. */
a:has(img[src*="core/images/logo.svg"]) {
    justify-content: center;
    width: 100%;
}

img[src*="core/images/logo.svg"] {
    display: block;
    width: auto !important;
    height: 44px !important;
    max-height: 44px !important;
    margin-inline: auto;
    object-fit: contain;
    transition: filter 150ms ease;
}

.dark img[src*="core/images/logo.svg"] {
    filter: brightness(0) invert(1);
}

.login-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
}

.login-logo img {
    width: auto !important;
    height: 84px !important;
    max-width: 100%;
    max-height: 84px !important;
    object-fit: contain;
}

/* El pie del sidebar —donde vive "Cerrar sesión"— sin tener que desplazar.

   Unfold fija el panel con `top:0 / bottom:0` y le da a la columna de adentro
   `min-height: 100vh`. En el teléfono ninguna de las dos medidas descuenta la
   barra del navegador, así que el panel termina más alto que lo que se ve y su
   último bloque —el del usuario— cae bajo el pliegue.

   Acá se ata el panel al alto que de verdad hay (`dvh`, con `vh` de respaldo)
   y la columna se ata al panel en vez de al viewport. Lo que se desplaza pasa
   a ser `#nav-sidebar-apps`, que ya trae su propio scroll. */
#nav-sidebar {
    top: 0;
    bottom: auto;
    height: 100vh;
    height: 100dvh;
    max-height: 100vh;
    max-height: 100dvh;
}

#nav-sidebar-inner {
    min-height: 0;
    height: 100%;
}

/* Enlaces del changelist: Unfold los deja iguales al texto plano (#1350).
   Se marcan para que se distingan de las celdas que no abren nada. */
#result_list tbody a:not(.admin-view-link) {
    color: var(--color-primary-600, #4f46e5);
    font-weight: 500;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 0.18em;
    text-decoration-color: color-mix(in srgb, currentColor 40%, transparent);
}

#result_list tbody a:not(.admin-view-link):hover {
    text-decoration-color: currentColor;
}

.dark #result_list tbody a:not(.admin-view-link) {
    color: var(--color-primary-400, #818cf8);
}

/* Columna "Ver": botón explícito al detalle, sin depender del hover. */
.admin-view-link {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    padding: 0.3rem 0.55rem;
    border-radius: 0.375rem;
    border: 1px solid var(--color-base-200, #e5e7eb);
    background: var(--color-white, #fff);
    color: var(--color-primary-700, #4338ca) !important;
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none !important;
    white-space: nowrap;
    box-shadow: 0 1px 2px rgb(0 0 0 / 4%);
}

.admin-view-link:hover {
    background: var(--color-base-50, #f9fafb);
    border-color: var(--color-primary-300, #a5b4fc);
}

.admin-view-link .material-symbols-outlined {
    font-size: 1.05rem;
    line-height: 1;
}

.dark .admin-view-link {
    background: transparent;
    border-color: var(--color-base-700, #374151);
    color: var(--color-primary-400, #818cf8) !important;
}

.dark .admin-view-link:hover {
    background: rgb(255 255 255 / 4%);
    border-color: var(--color-primary-500, #6366f1);
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}