/* ============================================================
   HUF — Componente: ContextPath (.hd-context-path)
   ------------------------------------------------------------
   Vehículo: TagHelper <hd-context-path>.

       Global / Empresas

   NO es un breadcrumb y no debe parecerlo. Un breadcrumb bajo el
   navbar es una señal delatora explícita de plantilla administrativa
   (HVL §3.1, fila CoreUI/AdminLTE/Metronic) — por eso el componente
   `Breadcrumbs` del catálogo v2 quedó descartado y este lo sustituye.

   Diferencias deliberadas con un breadcrumb:
   - Máximo 2 niveles. Si hace falta un tercero, la navegación está mal
     planteada, no falta un nivel.
   - Separador "/" plano, nunca "›" ni "→" ni un ícono.
   - Sin íconos en los segmentos.
   - Micro-etiqueta técnica (11px, mayúsculas, tracking) — se lee como
     una coordenada de sistema, no como una miga de pan.
   - No es el título de la pantalla: vive ENCIMA del título, dentro de
     la región A (HVL §8.1), y es visiblemente menor que él.
   ============================================================ */

.hd-context-path {
    display: flex;
    align-items: center;
    gap: var(--hd-space-2);
    font-size: var(--hd-text-micro);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--hd-theme-text-muted);
    margin-bottom: var(--hd-space-2);
}

.hd-context-path__link {
    color: inherit;
    text-decoration: none;
    transition: color var(--hd-motion-standard) var(--hd-ease);
}

.hd-context-path__link:hover,
.hd-context-path__link:focus-visible {
    color: var(--hd-theme-text);
}

.hd-context-path__link:focus-visible {
    outline: var(--hd-focus-ring);
    outline-offset: var(--hd-focus-offset);
    border-radius: var(--hd-radius-sm);
}

.hd-context-path__sep {
    color: var(--hd-color-border-strong);
    user-select: none;
}

/* Segmento final = dónde estás. No es un enlace y no compite con el
   título: mismo tamaño que el resto de la ruta, solo más contrastado. */
.hd-context-path__current {
    color: var(--hd-theme-text);
}
