/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-wwl35s1quv] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-wwl35s1quv] {
    flex: 1;
}

.sidebar[b-wwl35s1quv] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-wwl35s1quv] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-wwl35s1quv]  a, .top-row[b-wwl35s1quv]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-wwl35s1quv]  a:hover, .top-row[b-wwl35s1quv]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-wwl35s1quv]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-wwl35s1quv] {
        justify-content: space-between;
    }

    .top-row[b-wwl35s1quv]  a, .top-row[b-wwl35s1quv]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-wwl35s1quv] {
        flex-direction: row;
    }

    /* -----------------------------------------------------------------
       EL MENU LATERAL Y LOS ARTEFACTOS DE REPINTADO

       Reportado el 09/09/2026: en pantallas largas aparecian restos del
       menu y de la tabla pintados fuera de su sitio, como si hubiera dos
       copias de la pagina superpuestas y desplazadas.

       Habia un conflicto real de layout debajo. `.page` es un flex row,
       asi que el sidebar recibia `align-self: stretch` —querer medir lo
       que mide el contenedor, que en Tesoreria son 4.844px— Y ADEMAS
       `height: 100vh`. Dos reglas que se contradicen: gana la altura,
       pero el navegador tiene que reconciliarlas en cada relayout, y eso
       con un `position: sticky` encima es donde aparecen los restos de
       composicion.

       Las tres lineas de abajo lo dejan inequivoco:

         align-self  el item ya no intenta estirarse; su altura es la que
                     dice y punto.
         contain     nada de este subarbol se pinta fuera de su caja, asi
                     que un resto no puede acabar sobre el contenido.
         will-change el sidebar tiene su propia capa de composicion de
                     forma estable, en vez de que el navegador decida
                     promoverla y despromoverla al hacer scroll.

       `contain: paint` es seguro aqui porque el menu no tiene nada que
       deba salirse de su caja —ni desplegables ni tooltips propios—. Si
       alguna vez se le añade uno, esta linea es la primera sospechosa.
       ----------------------------------------------------------------- */
    .sidebar[b-wwl35s1quv] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
        align-self: flex-start;
        contain: paint;
        will-change: transform;
    }

    .top-row[b-wwl35s1quv] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-wwl35s1quv]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-wwl35s1quv], article[b-wwl35s1quv] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-wwl35s1quv] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-wwl35s1quv] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-4a62hvq9ae] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked[b-4a62hvq9ae] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-4a62hvq9ae] {
    min-height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-4a62hvq9ae] {
    font-size: 1.1rem;
}

.bi[b-4a62hvq9ae] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-4a62hvq9ae] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-4a62hvq9ae] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-4a62hvq9ae] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-4a62hvq9ae] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-4a62hvq9ae] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-4a62hvq9ae] {
        padding-bottom: 1rem;
    }

    .nav-item[b-4a62hvq9ae]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        width: 100%;
    }

.nav-item[b-4a62hvq9ae]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-4a62hvq9ae]  .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-scrollable[b-4a62hvq9ae] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-4a62hvq9ae] {
    display: block;
}

@media (min-width: 641px) {
    .navbar-toggler[b-4a62hvq9ae] {
        display: none;
    }

    .nav-scrollable[b-4a62hvq9ae] {
        /* Never collapse the sidebar for wide screens */
        display: block;

        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;

        /* Al llegar al final del menu, el scroll NO sigue en la pagina.
           Sin esto, quien recorre los modulos con la rueda se encuentra
           de pronto bajando la tabla de tesoreria sin haber salido del
           menu; y es ademas el encadenamiento de scrolls anidados el que
           dispara los repintados que se veian como restos. */
        overscroll-behavior: contain;
    }
}

/* =====================================================================
   EL ÁRBOL DEL MENÚ
   ---------------------------------------------------------------------
   Manuel, 15/09/2026: «quiero que el menú de la izquierda vaya en estilo
   árbol para que no haya un menú lateral kilométrico».

   Es `<details>` NATIVO: esta aplicación no tiene ni una línea de
   JavaScript propio, y el plegado del navegador funciona antes de que el
   circuito de Blazor conecte. La rama que contiene la pantalla actual
   nace abierta, así que nunca se está mirando algo que el menú esconde.
   ===================================================================== */

.nav-rama[b-4a62hvq9ae] {
    margin-top: .25rem;
}

/* El marcador por defecto de `summary` es un triángulo negro pegado al
   borde. Se sustituye por uno propio, alineado con la sangría de las
   entradas que cuelgan debajo. */
.nav-rama-titulo[b-4a62hvq9ae] {
    list-style: none;
    cursor: pointer;
    padding: .35rem 1rem .35rem 1.75rem;
    font-size: .8125rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .55);
    position: relative;
    user-select: none;
}

.nav-rama-titulo[b-4a62hvq9ae]::-webkit-details-marker { display: none; }

.nav-rama-titulo[b-4a62hvq9ae]::before {
    content: "▸";
    position: absolute;
    left: .75rem;
    transition: transform .12s ease-in-out;
    display: inline-block;
}

.nav-rama[open] > .nav-rama-titulo[b-4a62hvq9ae]::before {
    transform: rotate(90deg);
}

.nav-rama-titulo:hover[b-4a62hvq9ae] {
    color: #fff;
    background: rgba(255, 255, 255, .06);
}
/* /Components/Layout/PanelFeedback.razor.rz.scp.css */
/* =====================================================================
   «SUGERENCIAS Y PROBLEMAS»

   DÓNDE VA EL BOTÓN, Y POR QUÉ AHÍ
   ---------------------------------------------------------------------
   Abajo a la IZQUIERDA, sobre la franja del menú lateral (250 px), y no
   flotando sobre el contenido.

   El sitio natural —abajo a la derecha— cae justo encima del Gantt,
   donde el cronograma se maneja con dos clics encadenados sobre las
   filas (§Z). Un botón flotante ahí roba clics y rompe lo que más se
   usa, y eso no da ningún error: da una fila que no responde.

   Sobre el menú no tapa nunca nada del área de trabajo. En pantallas
   estrechas el menú deja de ser una columna, así que el botón se encoge
   a un icono en la misma esquina.
   ===================================================================== */

.eden-fb-boton[b-f5kve7huse] {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 250px;
    z-index: 1040; /* por debajo del modal de reconexión de Blazor */

    border: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.25);
    background-color: rgba(0, 0, 0, 0.25);
    color: #fff;

    font-size: 0.8rem;
    padding: 0.55rem 0.75rem;
    text-align: left;
    cursor: pointer;
}

.eden-fb-boton:hover[b-f5kve7huse] {
    background-color: rgba(255, 255, 255, 0.15);
}

.eden-fb-boton:focus-visible[b-f5kve7huse] {
    outline: 2px solid #fff;
    outline-offset: -2px;
}

/* El menú lateral sólo es columna a partir de 641px (MainLayout.razor.css).
   Por debajo, el botón ancho de 250px se comería la esquina de la
   pantalla sobre el contenido. */
@media (max-width: 640.98px) {
    .eden-fb-boton[b-f5kve7huse] {
        width: auto;
        border-radius: 0 0.5rem 0 0;
        background-color: rgba(5, 39, 103, 0.92);
    }
}

/* ---------------------------------------------------------------------
   LA VENTANA

   Va FIJA y arrastrable. No es un modal de Bootstrap a propósito: un
   modal pone un velo sobre la página y bloquea el desplazamiento, y lo
   que se pidió es justo lo contrario —poder apartarla y seguir mirando
   lo que se está describiendo—.
   --------------------------------------------------------------------- */
.eden-fb-panel[b-f5kve7huse] {
    position: fixed;
    right: 1.25rem;
    bottom: 1.25rem;
    width: 26rem;
    max-width: calc(100vw - 2rem);
    max-height: calc(100vh - 2rem);

    display: flex;
    flex-direction: column;

    z-index: 1045;
    background: #fff;
    border: 1px solid #c9c9c9;
    border-radius: 0.5rem;
    box-shadow: 0 0.75rem 2rem rgba(0, 0, 0, 0.3);
}

.eden-fb-asa[b-f5kve7huse] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;

    padding: 0.5rem 0.75rem;
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
    color: #fff;
    font-size: 0.85rem;
    border-radius: 0.5rem 0.5rem 0 0;

    cursor: grab;
    /* Sin esto, arrastrar selecciona el título y el cursor se queda en
       modo texto a mitad del gesto. */
    user-select: none;
}

.eden-fb-cuerpo[b-f5kve7huse] {
    padding: 0.75rem;
    overflow-y: auto;
}

.eden-fb-vista-caja[b-f5kve7huse] {
    border: 1px solid #e3e3e3;
    border-radius: 0.35rem;
    padding: 0.5rem;
    background: #fafafa;
}

#eden-fb-vista[b-f5kve7huse] {
    width: 100%;
    max-height: 9rem;
    object-fit: contain;
    object-position: top left;
    border: 1px solid #ddd;
    background: #fff;
}

.eden-fb-acuse[b-f5kve7huse] {
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    top: 0.75rem;
    z-index: 1050;
    max-width: 32rem;
    box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.2);
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-vvvcxzw5lt],
.components-reconnect-repeated-attempt-visible[b-vvvcxzw5lt],
.components-reconnect-failed-visible[b-vvvcxzw5lt],
.components-pause-visible[b-vvvcxzw5lt],
.components-resume-failed-visible[b-vvvcxzw5lt],
.components-rejoining-animation[b-vvvcxzw5lt] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-vvvcxzw5lt],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-vvvcxzw5lt],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-vvvcxzw5lt],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-vvvcxzw5lt],
#components-reconnect-modal.components-reconnect-retrying[b-vvvcxzw5lt],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-vvvcxzw5lt],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-vvvcxzw5lt],
#components-reconnect-modal.components-reconnect-failed[b-vvvcxzw5lt],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-vvvcxzw5lt] {
    display: block;
}


#components-reconnect-modal[b-vvvcxzw5lt] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-vvvcxzw5lt 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-vvvcxzw5lt 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-vvvcxzw5lt 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-vvvcxzw5lt]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-vvvcxzw5lt 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-vvvcxzw5lt {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-vvvcxzw5lt {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-vvvcxzw5lt {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-vvvcxzw5lt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-vvvcxzw5lt] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-vvvcxzw5lt] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-vvvcxzw5lt] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-vvvcxzw5lt] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-vvvcxzw5lt] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-vvvcxzw5lt] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-vvvcxzw5lt 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-vvvcxzw5lt] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-vvvcxzw5lt {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/AsuntoDetalle.razor.rz.scp.css */
/* =====================================================================
   LA REJILLA DEL ASUNTO

   El reparto anterior era `col-lg-7 / col-lg-5` de Bootstrap: 58 % para
   todo el contenido —pliego, ofertas, matriz, resoluciones, contrato y
   notas— y 42 % para una sola tarjeta, el dictamen. En 1920 eso son
   672 px para algo que usa 400, y media pantalla en blanco a partir de
   la primera tabla.

   Aquí el panel tiene ancho FIJO y todo lo demás es del contenido, que
   es lo que crece cuando la pantalla crece. Los tres pasos los elige la
   persona (SelectorVista) y se guardan en su perfil (migración 0074).
   ===================================================================== */

.asunto-grid[b-smdy9sksj0] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--rail);
    gap: 1.5rem;
    align-items: start;
}

/* `minmax(0, 1fr)` y no `1fr`: sin el mínimo en cero, una tabla ancha
   estira su columna e ignora el `overflow-x` del contenedor. Es la causa
   habitual de que una tabla se salga de la pantalla en CSS Grid. */

.asunto-grid.vista-panel[b-smdy9sksj0]  { --rail: 380px; }
.asunto-grid.vista-ancho[b-smdy9sksj0]  { --rail: 300px; }

/* Sin panel: el dictamen no desaparece, baja al final. Esconderlo sería
   otra cosa —el dictamen es la razón de ser de la pantalla— y aquí sólo
   se está pidiendo sitio para leer una tabla. */
.asunto-grid.vista-maximo[b-smdy9sksj0] {
    grid-template-columns: minmax(0, 1fr);
}

.asunto-rail[b-smdy9sksj0] {
    position: sticky;
    top: 1rem;
}

.asunto-grid.vista-maximo .asunto-rail[b-smdy9sksj0] {
    position: static;
}

/* Cualquier tabla que no quepa scrollea dentro de su tarjeta, nunca
   empujando la página entera: el scroll horizontal del documento hace
   desaparecer el menú lateral y desorienta. */
.asunto-main[b-smdy9sksj0]  .table-responsive,
.asunto-rail[b-smdy9sksj0]  .table-responsive {
    overflow-x: auto;
}

/* Por debajo de 1200 px no hay dos columnas que repartir. */
@media (max-width: 1199.98px) {
    .asunto-grid[b-smdy9sksj0],
    .asunto-grid.vista-panel[b-smdy9sksj0],
    .asunto-grid.vista-ancho[b-smdy9sksj0] {
        grid-template-columns: minmax(0, 1fr);
    }

    .asunto-rail[b-smdy9sksj0] { position: static; }
}
/* /Components/Pages/Cronograma.razor.rz.scp.css */
/* =====================================================================
   EL GANTT
   ---------------------------------------------------------------------
   Una rejilla de dos columnas por fila: etiqueta fija a la izquierda y
   pista con las barras a la derecha. La pista tiene ancho conocido
   (--gantt-ancho, que calcula el componente) y cada barra se posiciona
   en píxeles absolutos dentro de ella.

   La etiqueta es `sticky` sobre el eje horizontal: al desplazar meses,
   los nombres de tarea se quedan. Sin eso, un cronograma de dos años es
   una tira de barras anónimas.
   ===================================================================== */

/* EL SCROLL TIENE QUE OCURRIR AQUÍ DENTRO, y para eso este bloque NO
   puede crecer con su contenido.
   ---------------------------------------------------------------------
   `width: 0` + `min-width: 100%` parece un contrasentido y es el remedio
   exacto. Sin ello, `overflow-x: auto` NO produce barra de
   desplazamiento: el propio contenedor se estira hasta el ancho del
   Gantt, así que nunca hay nada que desbordar.

   Medido el 14/09/2026 con la escala «Mes» y el cronograma de trabajo:
   `.gantt-scroll` medía 2376 px con un viewport de 1385, y
   `scrollWidth === clientWidth` —o sea, sin scroll—. El Gantt se salía y
   un ancestro lo recortaba: **la mitad derecha del cronograma no se
   podía ver de ninguna manera**, ni desplazándose. Se veía como una
   leyenda cortada a media palabra, que es un síntoma que no señala a
   nada.

   La causa de fondo es que `main` es un elemento flexible del layout y
   su `min-width` por defecto es `auto` —«no me encojas por debajo de mi
   contenido»—, así que un hijo ancho manda sobre él. `max-width: 100%`
   NO lo arregla: ese 100 % se resuelve contra un padre que ya ha
   crecido. Con `width: 0` este bloque deja de tener ancho intrínseco y
   el `min-width` lo devuelve al ancho real del padre ya calculado.

   El mismo remedio está en `PlanMacro.razor.css`, donde el síntoma fue
   el contrario —allí crecía la página entera— porque lo que recorta
   depende de qué ancestro tenga overflow. La enfermedad es la misma. */
.gantt-scroll[b-57y818ofqw] {
    overflow-x: auto;
    overflow-y: visible;
    width: 0;
    min-width: 100%;
}

.gantt[b-57y818ofqw] {
    min-width: 100%;
    font-size: .8125rem;
}

.gantt-fila[b-57y818ofqw] {
    display: flex;
    align-items: stretch;
    min-height: 26px;
    border-bottom: 1px solid var(--bs-border-color-translucent, #e9ecef);
}

.gantt-fila:last-child[b-57y818ofqw] { border-bottom: 0; }

.gantt-fila:hover .gantt-etiqueta[b-57y818ofqw],
.gantt-fila:hover .gantt-pista[b-57y818ofqw] {
    background: var(--bs-tertiary-bg, #f8f9fa);
}

/* --- Columna izquierda --- */

.gantt-etiqueta[b-57y818ofqw] {
    position: sticky;
    left: 0;
    z-index: 3;
    flex: 0 0 320px;
    width: 320px;
    padding: 4px 8px;
    background: var(--bs-body-bg, #fff);
    border-right: 1px solid var(--bs-border-color, #dee2e6);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gantt-fila-resumen .gantt-etiqueta[b-57y818ofqw] { font-weight: 600; }

/* --- Pista de barras --- */

.gantt-pista[b-57y818ofqw] {
    position: relative;
    flex: 0 0 var(--gantt-ancho);
    width: var(--gantt-ancho);
    min-height: 26px;
}

/* --- Cabecera de meses --- */

.gantt-cabecera[b-57y818ofqw] {
    position: sticky;
    top: 0;
    z-index: 4;
    background: var(--bs-tertiary-bg, #f8f9fa);
    border-bottom: 2px solid var(--bs-border-color, #dee2e6);
    font-weight: 600;
}

.gantt-cabecera .gantt-etiqueta[b-57y818ofqw] { background: var(--bs-tertiary-bg, #f8f9fa); }

.gantt-mes[b-57y818ofqw] {
    position: absolute;
    top: 0;
    height: 100%;
    padding: 4px 4px;
    border-left: 1px solid var(--bs-border-color, #dee2e6);
    font-size: .75rem;
    white-space: nowrap;
    overflow: hidden;
    color: var(--bs-secondary-color, #6c757d);
}

/* --- Barras --- */

.gantt-barra[b-57y818ofqw] {
    position: absolute;
    top: 5px;
    height: 16px;
    border-radius: 3px;
    overflow: hidden;
    cursor: default;
}

.gantt-normal[b-57y818ofqw]  { background: #0d6efd; }
.gantt-critica[b-57y818ofqw] { background: #dc3545; }

/* Una etapa no es una tarea: se dibuja como un corchete, no como un
   bloque macizo. Así se distingue de un vistazo lo que es trabajo real
   de lo que es sólo un agrupador. */
.gantt-resumen[b-57y818ofqw] {
    background: #495057;
    height: 8px;
    top: 9px;
    border-radius: 1px;
}

.gantt-avance[b-57y818ofqw] {
    height: 100%;
    background: rgba(0, 0, 0, .35);
}

.gantt-texto[b-57y818ofqw] {
    position: absolute;
    top: 0;
    left: 6px;
    right: 4px;
    line-height: 16px;
    font-size: .6875rem;
    color: #fff;
    white-space: nowrap;
    overflow: hidden;
    pointer-events: none;
}

.gantt-hito[b-57y818ofqw] {
    position: absolute;
    top: 2px;
    margin-left: -6px;
    font-size: 14px;
    line-height: 20px;
    color: #6f42c1;
    cursor: default;
}

/* --- La línea de hoy --- */
/* Va dentro de cada fila y no como una sola barra absoluta sobre el
   contenedor: así no se descoloca al hacer scroll vertical. */

.gantt-hoy[b-57y818ofqw] {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 1px;
    background: #fd7e14;
    z-index: 2;
    pointer-events: none;
}

.gantt-cabecera .gantt-hoy[b-57y818ofqw] { display: none; }

/* --- Muestras de la leyenda --- */

.gantt-muestra[b-57y818ofqw] {
    display: inline-block;
    width: 16px;
    height: 8px;
    border-radius: 2px;
    vertical-align: middle;
    margin-right: 2px;
}

/* --- Pantalla estrecha --- */

@media (max-width: 768px) {
    .gantt-etiqueta[b-57y818ofqw] { flex-basis: 180px; width: 180px; }
}

/* --- Buscar en el árbol: tres estados --- */
/*
   NO SE USA `opacity` SOBRE LA FILA, y no es un capricho de estilo.
   Un valor de opacidad menor que 1 crea un contexto de apilamiento
   nuevo, y estas filas llevan dentro la etiqueta `sticky` con z-index 3
   y conviven con la cabecera de meses, que es `sticky` a z-index 4.
   Atenuando la fila entera, las etiquetas de las filas posteriores
   dejarían de poder quedar por debajo de la cabecera y se le montarían
   encima al desplazar. Se ve como una cabecera que desaparece bajo los
   nombres de tarea, y no hay nada en el código de la cabecera que lo
   explique.

   Así que se atenúa lo que no participa del apilamiento: el color del
   texto de la etiqueta, y las barras y los hitos, que son absolutos
   dentro de su pista.
*/

.gantt-casa .gantt-etiqueta[b-57y818ofqw],
.gantt-casa .gantt-pista[b-57y818ofqw] {
    background: #cfe2ff;
}

/* La marca va en la etiqueta, que es la parte que siempre se ve: la
   pista puede estar desplazada meses a la derecha. */
.gantt-casa .gantt-etiqueta[b-57y818ofqw] {
    box-shadow: inset 3px 0 0 0 #0d6efd;
    font-weight: 600;
}

.gantt-apagada .gantt-etiqueta[b-57y818ofqw] {
    color: var(--bs-secondary-color, #6c757d);
}

.gantt-apagada .gantt-barra[b-57y818ofqw],
.gantt-apagada .gantt-hito[b-57y818ofqw] {
    opacity: .2;
}

/* --- Modo edición --- */

.gantt-editable[b-57y818ofqw] { cursor: pointer; }
.gantt-editable:hover[b-57y818ofqw] { text-decoration: underline; }

.gantt-fila-sel .gantt-etiqueta[b-57y818ofqw],
.gantt-fila-sel .gantt-pista[b-57y818ofqw] { background: #fff3cd; }

/* La pista de la tarea seleccionada invita a pulsarla: es el sustituto
   del arrastre, y sin señal visual nadie descubre que se puede. */
.gantt-pista-sel[b-57y818ofqw] { cursor: crosshair; }

/* =====================================================================
   TRES VISTAS DEL MISMO CRONOGRAMA (migración 0168)
   ---------------------------------------------------------------------
   Planificación original (línea base) · obra real · las dos a la vez.

   REGISTRADO Y PROYECTADO NO SE MEZCLAN, que es la regla de la sección N
   aplicada a un dibujo. En la vista de obra real, una partida que aún no
   tiene fechas reales sigue teniendo que aparecer —si no, la obra se
   vería medio vacía— pero NO puede parecer un hecho: va rayada, que se
   lee como «esto todavía es previsión».

   Con las dos barras macizas, un Gantt de obra a medias sería
   indistinguible de uno terminado.
   ===================================================================== */

/* La barra de la línea base: lo pactado. Va detrás y algo más alta que
   la real, de modo que ésta se dibuja dentro de ella y la desviación se
   lee como un desbordamiento.

   NACIÓ HUECA —transparente, borde de 1 px y `opacity: .75`— para que se
   leyera como «una referencia y no como trabajo», y a tamaño real casi
   no se distinguía del fondo: Manuel lo señaló el 14/09/2026 marcándolo
   en rojo sobre una captura. Es el mismo fallo que el Gantt del plan del
   proyecto, donde la barra hueca hubo que hacerla maciza.

   La lección: un contorno de 1 px sin relleno no es «discreto», es
   invisible. Lo que hace que esto se lea como referencia y no como
   trabajo NO es la ausencia de relleno — es el color NEUTRO frente al
   rojo y el azul que sí significan algo, y que la barra real se dibuje
   dentro. Así que relleno gris y contorno definido: se ve, y sigue sin
   competir. */
.gantt-barra-base[b-57y818ofqw] {
    background: #ced4da;
    border: 1px solid #495057;
}

/* Lo que todavía no ha pasado. El rayado es la señal de «previsto»: no
   depende del color, así que sigue funcionando en la barra crítica
   (roja) y en la normal (azul). */
.gantt-prevista[b-57y818ofqw] {
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255, 255, 255, .45) 0 4px,
        transparent 4px 8px);
}

/* --- Vista comparada: dos barras en la misma fila --- */
/* Se suben las dos y se estrechan en vez de crecer la fila: un
   cronograma de doscientas partidas con filas de 40 px deja de caber en
   una pantalla, y entonces la comparación no se puede hacer de un
   vistazo, que es justo lo que se venía a ganar. */

.gantt-doble .gantt-fila[b-57y818ofqw],
.gantt-doble .gantt-pista[b-57y818ofqw] { min-height: 34px; }

.gantt-doble .gantt-barra-base[b-57y818ofqw] {
    top: 4px;
    height: 10px;
}

.gantt-doble .gantt-barra-actual[b-57y818ofqw] {
    top: 17px;
    height: 12px;
}

.gantt-doble .gantt-hito[b-57y818ofqw] { top: 8px; }

/* --- Modo «fijar fechas reales» --- */
/* Cursor distinto del de reprogramar: ahí se mueve una previsión, aquí
   se registra un hecho. Que se parezcan invita a confundirlos. */

.gantt-pista-real[b-57y818ofqw] { cursor: cell; }

/* El día que se acaba de fijar, mientras se espera el segundo clic. Sin
   esta marca, quien pulsa el inicio no tiene forma de saber que el clic
   entró hasta que pulsa el fin. */
.gantt-marca-real[b-57y818ofqw] {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 2px;
    background: #198754;
    z-index: 2;
    pointer-events: none;
}

/* El lápiz que abre el editor de una partida. Se mantiene apagado hasta
   que el ratón pasa por la fila: en una lista de cien partidas, cien
   iconos a plena tinta compiten con los nombres, que es lo que se viene
   a leer. Al enfocar con teclado sí aparece, o dejaría de existir para
   quien no usa ratón. */
.gantt-lapiz[b-57y818ofqw] {
    opacity: .25;
    text-decoration: none;
}
.gantt-fila:hover .gantt-lapiz[b-57y818ofqw],
.gantt-lapiz:focus-visible[b-57y818ofqw] {
    opacity: 1;
}

/* --- El panel flotante de fechas ---
   Fijo y centrado arriba, no anclado a su fila: el Gantt vive dentro de
   un contenedor con desplazamiento horizontal que recortaria cualquier
   cosa posicionada dentro de la fila, y ese recorte no da ningun error
   —solo un panel medio invisible—. La misma familia que el `overflow-x`
   que no producia scroll. */
.eden-flotante-fondo[b-57y818ofqw] {
    position: fixed;
    inset: 0;
    z-index: 1050;
    background: rgba(0, 0, 0, .25);
}

.eden-flotante[b-57y818ofqw] {
    position: fixed;
    z-index: 1051;
    top: 12vh;
    left: 50%;
    transform: translateX(-50%);
    width: min(460px, calc(100vw - 32px));
    max-height: 76vh;
    overflow-y: auto;
}
/* /Components/Pages/CronogramaPlanificado.razor.rz.scp.css */
/* =====================================================================
   EL GANTT DEL CRONOGRAMA PLANIFICADO
   ---------------------------------------------------------------------
   Tercer hermano de `Cronograma.razor.css` y `PlanMacro.razor.css`, y a
   propósito se le parece: son tres dibujos de la misma clase de cosa, y
   verlos distintos obligaría a releerlos cada vez.

   NO comparten fichero porque el CSS de Blazor es *scoped* por
   componente. Es una copia de PRESENTACIÓN, no de criterio: lo que se
   pinta lo decide `v_planificado` en la base, en un solo sitio.

   Las clases van prefijadas `cpl-` para que las tres hojas no se pisen.

   LO QUE ESTE GANTT NO TIENE, y por eso no se copian sus reglas:
     · Ninguna barra «real» ni de avance — el planificado es teórico y no
       se ajusta con lo que pasa. Comparar es el trabajo de la CURVA.
     · Camino crítico, holguras y reprogramar arrastrando: aquí no hay
       CPM, las fechas se teclean.
   Copiar esos estilos «por si acaso» dejaría reglas que nadie usa y que
   el siguiente tendría que descifrar.
   ===================================================================== */

/* EL SCROLL HORIZONTAL VA DENTRO DE LA TARJETA, NO EN LA PÁGINA.
   ---------------------------------------------------------------------
   `width: 0` + `min-width: 100%` parece un contrasentido y es el remedio
   exacto: `main` es un elemento flexible cuyo `min-width` por defecto es
   `auto` —«no me encojas por debajo de mi contenido»— así que un hijo
   ancho estira la página entera y deja el menú fuera de la pantalla.
   `max-width: 100%` NO lo arregla: ese 100 % se resuelve contra un padre
   que ya ha crecido. Está medido en `PlanMacro.razor.css`. */
.cpl-scroll[b-kxo1mz8b8m] {
    overflow-x: auto;
    overflow-y: visible;
    width: 0;
    min-width: 100%;
}

.cpl-gantt[b-kxo1mz8b8m] {
    min-width: 100%;
    font-size: .8125rem;
}

.cpl-fila[b-kxo1mz8b8m] {
    display: flex;
    align-items: stretch;
    min-height: 32px;
    border-bottom: 1px solid var(--bs-border-color-translucent, #e9ecef);
}

.cpl-fila:last-child[b-kxo1mz8b8m] { border-bottom: 0; }

.cpl-fila:hover .cpl-etiqueta[b-kxo1mz8b8m],
.cpl-fila:hover .cpl-pista[b-kxo1mz8b8m] {
    background: var(--bs-tertiary-bg, #f8f9fa);
}

/* La fila en edición se marca con un fondo, NO con `opacity` sobre las
   demás: una opacidad menor que 1 crea contexto de apilamiento y la
   etiqueta `sticky` se montaría sobre la cabecera de meses al desplazar
   (§V). */
.cpl-fila-sel .cpl-etiqueta[b-kxo1mz8b8m],
.cpl-fila-sel .cpl-pista[b-kxo1mz8b8m] {
    background: var(--bs-primary-bg-subtle, #cfe2ff);
}

/* --- Columna izquierda --- */
/* `sticky` sobre el eje horizontal: al desplazar meses los nombres se
   quedan. Sin eso, una proyección de dos años es una tira de barras
   anónimas. */

.cpl-etiqueta[b-kxo1mz8b8m] {
    position: sticky;
    left: 0;
    z-index: 3;
    flex: 0 0 300px;
    width: 300px;
    padding: 5px 8px;
    background: var(--bs-body-bg, #fff);
    border-right: 1px solid var(--bs-border-color, #dee2e6);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
}

.cpl-etiqueta:hover[b-kxo1mz8b8m] { text-decoration: underline; }

.cpl-pista[b-kxo1mz8b8m] {
    position: relative;
    flex: 0 0 var(--cpl-ancho);
    width: var(--cpl-ancho);
    min-height: 32px;
}

/* --- Cabecera de meses --- */

.cpl-cabecera[b-kxo1mz8b8m] {
    position: sticky;
    top: 0;
    z-index: 4;
    background: var(--bs-tertiary-bg, #f8f9fa);
    border-bottom: 2px solid var(--bs-border-color, #dee2e6);
    font-weight: 600;
    min-height: 26px;
}

.cpl-cabecera .cpl-etiqueta[b-kxo1mz8b8m] {
    background: var(--bs-tertiary-bg, #f8f9fa);
    cursor: default;
}
.cpl-cabecera .cpl-etiqueta:hover[b-kxo1mz8b8m] { text-decoration: none; }
.cpl-cabecera .cpl-pista[b-kxo1mz8b8m] { min-height: 26px; }

.cpl-mes[b-kxo1mz8b8m] {
    position: absolute;
    top: 0;
    height: 100%;
    padding: 4px;
    border-left: 1px solid var(--bs-border-color, #dee2e6);
    font-size: .75rem;
    white-space: nowrap;
    overflow: hidden;
    color: var(--bs-secondary-color, #6c757d);
}

/* --- Las barras --- */
/* UNA SOLA barra por fila, y morada como la de gestión del plan del
   proyecto: esto es previsión pura, del mismo mundo teórico. El verde de
   «lo que pasó» no aparece aquí a propósito — mezclar en este dibujo lo
   previsto con lo real sería justo lo que la curva existe para hacer, y
   hacerlo en dos sitios daría dos respuestas que pueden discrepar. */

.cpl-barra[b-kxo1mz8b8m] {
    position: absolute;
    top: 6px;
    height: 15px;
    border-radius: 3px;
    background: #6f42c1;
}

/* Una etapa no pesa: sólo agrupa. Se dibuja más fina y traslúcida para
   que no compita con las actividades que sí cuentan. */
.cpl-etapa[b-kxo1mz8b8m] {
    top: 11px;
    height: 6px;
    background: #6f42c1;
    opacity: .45;
    border-radius: 2px;
}

.cpl-sin-fechas[b-kxo1mz8b8m] {
    position: absolute;
    left: 6px;
    top: 7px;
    font-size: .75rem;
    color: var(--bs-warning-text-emphasis, #997404);
    white-space: nowrap;
}

/* La línea de hoy. Va en cada fila, no una sola absoluta sobre el
   contenedor: así no se descoloca al hacer scroll vertical. */
.cpl-hoy[b-kxo1mz8b8m] {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 0;
    border-left: 2px solid #fd7e14;
    z-index: 2;
}

.cpl-muestra[b-kxo1mz8b8m] {
    display: inline-block;
    width: 14px;
    height: 8px;
    border-radius: 2px;
    vertical-align: middle;
}

/* El lapiz y el panel flotante, iguales que en el cronograma de obra:
   dos pantallas que hacen lo mismo no pueden pedirlo de dos maneras. */
.cpl-lapiz[b-kxo1mz8b8m] {
    opacity: .25;
    text-decoration: none;
}
.cpl-fila:hover .cpl-lapiz[b-kxo1mz8b8m],
.cpl-lapiz:focus-visible[b-kxo1mz8b8m] {
    opacity: 1;
}

.eden-flotante-fondo[b-kxo1mz8b8m] {
    position: fixed;
    inset: 0;
    z-index: 1050;
    background: rgba(0, 0, 0, .25);
}

.eden-flotante[b-kxo1mz8b8m] {
    position: fixed;
    z-index: 1051;
    top: 14vh;
    left: 50%;
    transform: translateX(-50%);
    width: min(420px, calc(100vw - 32px));
}
/* /Components/Pages/PlanMacro.razor.rz.scp.css */
/* =====================================================================
   EL GANTT DEL PLAN DEL PROYECTO
   ---------------------------------------------------------------------
   Hermano del de `Cronograma.razor.css`, y a propósito se le parece: son
   dos dibujos de la misma clase de cosa y verlos distintos obligaría a
   releerlos cada vez.

   NO comparten fichero porque el CSS de Blazor es *scoped* por
   componente — `Cronograma.razor.css` sólo alcanza a `Cronograma.razor`.
   Si algún día se cambia la estética de uno, hay que mirar el otro; es
   la única copia que queda, y es de presentación, no de criterio: lo que
   se pinta lo decide `v_macro` en la base, en un solo sitio.

   Las clases van prefijadas `plan-` para que las dos hojas no se pisen
   si alguna acaba siendo global.

   Lo que este Gantt NO tiene, y el otro sí: jerarquía (aquí todas las
   actividades son del mismo nivel), búsqueda en árbol con ancestros, y
   modo de reprogramar arrastrando. Copiar esas reglas «por si acaso»
   dejaría estilos que nadie usa y que el siguiente tendría que descifrar.
   ===================================================================== */

/* EL SCROLL HORIZONTAL VA DENTRO DE LA TARJETA, NO EN LA PÁGINA.
   ---------------------------------------------------------------------
   `width: 0` + `min-width: 100%` parece un contrasentido y es el remedio
   exacto. Medido con la escala «Mes»: `main` pasaba a 2414 px con un
   viewport de 1385, y se estiraba TODO —el título, el formulario de
   añadir, la tarjeta de partidas—, con el menú lateral fuera de la
   pantalla.

   La causa es que `main` es un elemento flexible del layout y su
   `min-width` por defecto es `auto`, o sea «no me encojas por debajo de
   mi contenido». Un hijo con ancho intrínseco grande lo empuja entero.
   `max-width: 100%` NO lo arregla: ese 100 % se resuelve contra un padre
   que ya ha crecido.

   Con `width: 0` este bloque deja de tener ancho intrínseco —no empuja a
   nadie— y `min-width: 100%` lo devuelve al ancho real del padre ya
   calculado. El arreglo de fondo sería `min-width: 0` en el flex item
   del layout, pero eso es territorio compartido con todas las pantallas
   y no se toca desde aquí. */
.plan-scroll[b-wvtar7z84j] {
    overflow-x: auto;
    overflow-y: visible;
    width: 0;
    min-width: 100%;
}

.plan-gantt[b-wvtar7z84j] {
    min-width: 100%;
    font-size: .8125rem;
}

.plan-fila[b-wvtar7z84j] {
    display: flex;
    align-items: stretch;
    min-height: 34px;
    border-bottom: 1px solid var(--bs-border-color-translucent, #e9ecef);
}

.plan-fila:last-child[b-wvtar7z84j] { border-bottom: 0; }

.plan-fila:hover .plan-etiqueta[b-wvtar7z84j],
.plan-fila:hover .plan-pista[b-wvtar7z84j] {
    background: var(--bs-tertiary-bg, #f8f9fa);
}

/* --- Columna izquierda --- */
/* `sticky` sobre el eje horizontal: al desplazar meses los nombres se
   quedan. Sin eso, un plan de dos años es una tira de barras anónimas. */

.plan-etiqueta[b-wvtar7z84j] {
    position: sticky;
    left: 0;
    z-index: 3;
    flex: 0 0 300px;
    width: 300px;
    padding: 5px 8px;
    background: var(--bs-body-bg, #fff);
    border-right: 1px solid var(--bs-border-color, #dee2e6);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
}

.plan-etiqueta:hover[b-wvtar7z84j] { text-decoration: underline; }

.plan-pista[b-wvtar7z84j] {
    position: relative;
    flex: 0 0 var(--plan-ancho);
    width: var(--plan-ancho);
    min-height: 34px;
}

/* --- Cabecera de meses --- */

.plan-cabecera[b-wvtar7z84j] {
    position: sticky;
    top: 0;
    z-index: 4;
    background: var(--bs-tertiary-bg, #f8f9fa);
    border-bottom: 2px solid var(--bs-border-color, #dee2e6);
    font-weight: 600;
    min-height: 26px;
}

.plan-cabecera .plan-etiqueta[b-wvtar7z84j] {
    background: var(--bs-tertiary-bg, #f8f9fa);
    cursor: default;
}
.plan-cabecera .plan-etiqueta:hover[b-wvtar7z84j] { text-decoration: none; }
.plan-cabecera .plan-pista[b-wvtar7z84j] { min-height: 26px; }

.plan-mes[b-wvtar7z84j] {
    position: absolute;
    top: 0;
    height: 100%;
    padding: 4px;
    border-left: 1px solid var(--bs-border-color, #dee2e6);
    font-size: .75rem;
    white-space: nowrap;
    overflow: hidden;
    color: var(--bs-secondary-color, #6c757d);
}

/* --- Las barras --- */
/*
   DOS BARRAS EN LA MISMA FILA, y no un conmutador de vistas como en el
   cronograma de obra: un plan tiene decenas de actividades, no
   doscientas, así que caben las dos y la desviación se lee sin cambiar
   de pantalla — que es justo para lo que existe este plan.

   Arriba lo PREVISTO (hueco, una referencia), abajo lo REAL (macizo, un
   hecho). Si lo real se sale de lo previsto, se ve como un
   desbordamiento.
*/

.plan-barra[b-wvtar7z84j] {
    position: absolute;
    border-radius: 3px;
    overflow: hidden;
}

/* LA BARRA DEL PLAN ES MACIZA, como en el Gantt de obra. Nació hueca
   —para leerse como «una referencia»— y a tamaño real no se veía: en un
   dibujo que existe para mirarse de lejos, un contorno de 1 px no dice
   nada. Lo hueco se reserva para lo que de verdad es una referencia
   inmóvil (una línea base), y esto no lo es: es el plan vigente. */
.plan-prevista[b-wvtar7z84j] {
    top: 5px;
    height: 14px;
    background: #6f42c1;   /* gestión: permisos, notario, financiación */
}

/* La derivada se distingue por COLOR y no sólo por una etiqueta: es la
   diferencia que gobierna todo el plan —lo que se ajusta solo frente a
   lo que alguien mantiene a mano— y tiene que verse desde lejos. El azul
   es el mismo que usa el cronograma de obra para una partida normal,
   porque es exactamente eso lo que hay debajo. */
.plan-prevista-derivada[b-wvtar7z84j] { background: #0d6efd; }

/* Lo que pasó de verdad: una barra FINA debajo, no otra del mismo grosor.
   Son dos cosas de distinta naturaleza —una previsión y un hecho— y con
   el mismo peso visual compiten en vez de compararse. */
.plan-real[b-wvtar7z84j] {
    top: 21px;
    height: 7px;
    background: #198754;
}

/* Lo que todavía no ha terminado. El rayado es la señal de «esto sigue
   abierto»: registrado y proyectado no se mezclan, tampoco en un dibujo
   (§N, §Z). Sin él, un plan a medias se ve igual que uno terminado, y no
   depende del color, así que funciona en las dos clases de barra. */
.plan-en-marcha[b-wvtar7z84j] {
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255, 255, 255, .5) 0 4px,
        transparent 4px 8px);
}

/* El avance, DENTRO de la barra: es lo que convierte «va del 1 al 30» en
   «va del 1 al 30 y lleva el 53 %». Oscurece en vez de colorear, así que
   no hay que inventar un color por cada clase de barra. */
.plan-avance[b-wvtar7z84j] {
    position: absolute;
    top: 5px;
    height: 14px;
    background: rgba(0, 0, 0, .35);
    border-radius: 3px 0 0 3px;
}

/* El texto va DENTRO de la barra, como los «8 j» del Gantt de obra: la
   cifra pegada a lo que describe se lee sin recorrer la fila. */
.plan-texto[b-wvtar7z84j] {
    position: absolute;
    top: 5px;
    line-height: 14px;
    font-size: .6875rem;
    color: #fff;
    padding: 0 5px;
    white-space: nowrap;
    overflow: hidden;
    pointer-events: none;
    z-index: 1;
}

/* Una actividad sin fechas NO se esconde: se dice que no se puede
   dibujar. Quitarla de la lista la haría desaparecer del plan sin que
   nadie decidiera quitarla. */
.plan-sin-fechas[b-wvtar7z84j] {
    position: absolute;
    top: 9px;
    left: 4px;
    font-size: .6875rem;
    color: var(--bs-secondary-color, #6c757d);
    font-style: italic;
}

/* --- La línea de hoy --- */
/* Va dentro de cada fila y no como una barra absoluta sobre el
   contenedor: así no se descoloca al hacer scroll vertical. */

.plan-hoy[b-wvtar7z84j] {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 1px;
    background: #fd7e14;
    z-index: 2;
    pointer-events: none;
}

.plan-cabecera .plan-hoy[b-wvtar7z84j] { display: none; }

/* --- Selección --- */

.plan-fila-sel .plan-etiqueta[b-wvtar7z84j],
.plan-fila-sel .plan-pista[b-wvtar7z84j] { background: #fff3cd; }

/* --- Leyenda --- */

.plan-muestra[b-wvtar7z84j] {
    display: inline-block;
    width: 16px;
    height: 8px;
    border-radius: 2px;
    vertical-align: middle;
    margin-right: 3px;
}

.plan-muestra-hueca[b-wvtar7z84j] {
    background: transparent;
    border: 1px solid #6c757d;
}

/* --- Pantalla estrecha --- */

@media (max-width: 768px) {
    .plan-etiqueta[b-wvtar7z84j] { flex-basis: 170px; width: 170px; }
}
/* /Components/Pages/Tesoreria.razor.rz.scp.css */
/* La curva ocupa el ancho disponible y mantiene proporción. Sin alto
   fijo en píxeles: en un portátil de 13" y en un monitor grande tiene
   que leerse igual de bien. */
.curva-caja[b-8owfdn5emi] {
    width: 100%;
    height: auto;
    max-height: 260px;
    display: block;
}
/* /Components/Pages/Ventas.razor.rz.scp.css */
.aguja[b-js4yavplbc]      { width: 100%; height: auto; max-width: 280px; display: block; margin: 0 auto; }
.absorcion[b-js4yavplbc]  { width: 100%; height: auto; max-height: 220px; display: block; }

.muestra[b-js4yavplbc] {
    display: inline-block; width: 18px; height: 3px;
    vertical-align: middle; margin-right: 3px;
}
/* El previsto punteado y el real sólido: es un plan frente a un hecho, y
   la línea lo dice sin necesidad de leyenda. */
.muestra-obj[b-js4yavplbc]  { background: repeating-linear-gradient(90deg,#6c757d 0 5px,transparent 5px 9px); }
.muestra-real[b-js4yavplbc] { background: #0d6efd; }