/* /Components/Landing/AccionesFlotantes.razor.rz.scp.css */
/* ── La columna de botones ──────────────────────────────────────────
   Una sola columna flex en vez de tres botones con su propia distancia
   al borde: si uno no se pinta, los demás suben solos. */
.af-columna[b-i0vd6s6kgi] {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 900;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
}

.af-fab[b-i0vd6s6kgi] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    text-decoration: none;
    transition: transform .18s ease, box-shadow .18s ease, opacity .25s ease;
}

.af-fab:hover[b-i0vd6s6kgi] { transform: scale(1.08); }

.af-fab-wa[b-i0vd6s6kgi] {
    background: #25D366;
    color: #FFF;
    box-shadow: 0 6px 20px rgba(37, 211, 102, .42);
}

.af-fab-mail[b-i0vd6s6kgi] {
    background: linear-gradient(135deg, #E88100, #C46D00);
    color: #FFF;
    box-shadow: 0 6px 20px rgba(232, 129, 0, .38);
}

/* En Unox este botón es blanco translúcido con desenfoque, y sobre una
   página clara no se ve. Aquí va sólido y con borde. */
.af-fab-arriba[b-i0vd6s6kgi] {
    width: 46px;
    height: 46px;
    background: #FFF;
    border: 1px solid #E4DED6;
    color: #6B6560;
    box-shadow: 0 6px 18px rgba(46, 42, 38, .14);
}

.af-fab-arriba:hover[b-i0vd6s6kgi] { color: #E88100; border-color: #E88100; }

/* El script le pone la clase al <html> y desde ahí se esconde mientras no
   haya scroll. Si el script no carga, el botón se queda visible: molesta
   menos que no poder volver arriba. */
html.af-js .af-fab-arriba[b-i0vd6s6kgi] {
    opacity: 0;
    pointer-events: none;
}

html.af-js.af-scroll .af-fab-arriba[b-i0vd6s6kgi] {
    opacity: 1;
    pointer-events: auto;
}

.af-pulso[b-i0vd6s6kgi] {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: rgba(37, 211, 102, .38);
    animation: af-pulso-b-i0vd6s6kgi 2.4s ease-out infinite;
    pointer-events: none;
}

@keyframes af-pulso-b-i0vd6s6kgi {
    0% { transform: scale(1); opacity: .6; }
    100% { transform: scale(1.75); opacity: 0; }
}

@keyframes af-pulso-corto-b-i0vd6s6kgi {
    0% { transform: scale(1); opacity: .55; }
    100% { transform: scale(1.42); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .af-pulso[b-i0vd6s6kgi] { animation: none; opacity: 0; }
    .af-fab:hover[b-i0vd6s6kgi] { transform: none; }
}

/* ── Paneles ─────────────────────────────────────────────────────── */
/* El checkbox no se oculta con display:none: así se puede llegar a él con
   Tab y abrirlo con la barra espaciadora. */
.af-toggle[b-i0vd6s6kgi] {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

#af-mail:focus-visible ~ .af-columna .af-fab-mail[b-i0vd6s6kgi],
#af-wa:focus-visible ~ .af-columna .af-fab-wa[b-i0vd6s6kgi] {
    outline: 3px solid #2E2A26;
    outline-offset: 3px;
}

.af-tapa[b-i0vd6s6kgi] {
    position: fixed;
    inset: 0;
    z-index: 950;
    background: rgba(30, 26, 22, .55);
    opacity: 0;
    visibility: hidden;
    transition: opacity .28s ease, visibility .28s ease;
}

#af-wa:checked + .af-tapa[b-i0vd6s6kgi],
#af-mail:checked + .af-tapa[b-i0vd6s6kgi] {
    opacity: 1;
    visibility: visible;
}

.af-panel[b-i0vd6s6kgi] {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 960;
    width: 420px;
    max-width: 100vw;
    height: 100dvh;
    padding: 30px 28px 40px;
    background: #FFF;
    box-shadow: -10px 0 40px rgba(46, 42, 38, .22);
    overflow-y: auto;
    overscroll-behavior: contain;
    transform: translateX(100%);
    visibility: hidden;
    transition: transform .32s cubic-bezier(.4, 0, .2, 1), visibility .32s;
    box-sizing: border-box;
}

#af-wa:checked + .af-tapa + .af-panel[b-i0vd6s6kgi],
#af-mail:checked + .af-tapa + .af-panel[b-i0vd6s6kgi] {
    transform: translateX(0);
    visibility: visible;
}

.af-cerrar[b-i0vd6s6kgi] {
    position: absolute;
    top: 14px;
    right: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    color: #6B6560;
    font-size: 26px;
    line-height: 1;
    cursor: pointer;
    transition: background .16s ease, color .16s ease;
}

.af-cerrar:hover[b-i0vd6s6kgi] { background: #F4F0EA; color: #2E2A26; }

.af-titulo[b-i0vd6s6kgi] {
    margin: 6px 0 8px;
    padding-right: 40px;
    color: #2E2A26;
    font-size: 1.32rem;
    font-weight: 700;
    letter-spacing: -.01em;
}

.af-lead[b-i0vd6s6kgi] {
    margin: 0 0 22px;
    color: #6B6560;
    font-size: .92rem;
    line-height: 1.6;
}

/* ── Formulario del panel de WhatsApp ── */
.af-campo[b-i0vd6s6kgi] { margin-bottom: 16px; }

.af-campo label[b-i0vd6s6kgi] {
    display: block;
    margin-bottom: 6px;
    color: #2E2A26;
    font-size: .84rem;
    font-weight: 600;
}

.af-campo input[b-i0vd6s6kgi] {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid #E4DED6;
    border-radius: 11px;
    background: #FBF9F6;
    color: #2E2A26;
    font-family: inherit;
    font-size: .95rem;
    box-sizing: border-box;
    transition: border-color .16s ease, box-shadow .16s ease;
}

.af-campo input:focus[b-i0vd6s6kgi] {
    outline: none;
    border-color: #25D366;
    box-shadow: 0 0 0 3px rgba(37, 211, 102, .18);
}

.af-enviar[b-i0vd6s6kgi] {
    display: block;
    width: 100%;
    padding: 14px 20px;
    border: 0;
    border-radius: 12px;
    color: #FFF;
    font-family: inherit;
    font-size: 1rem;
    font-weight: 700;
    cursor: pointer;
    transition: transform .16s ease, box-shadow .16s ease;
}

.af-enviar-wa[b-i0vd6s6kgi] { background: #25D366; }

.af-enviar:hover[b-i0vd6s6kgi] {
    transform: translateY(-1px);
    box-shadow: 0 10px 22px rgba(37, 211, 102, .34);
}

.af-omitir[b-i0vd6s6kgi] {
    display: block;
    margin-top: 16px;
    color: #918A82;
    font-size: .84rem;
    text-align: center;
    text-decoration: underline;
}

.af-omitir:hover[b-i0vd6s6kgi] { color: #2E2A26; }

@media (max-width: 480px) {
    .af-columna[b-i0vd6s6kgi] { right: 16px; bottom: 16px; gap: 12px; }

    /* En un teléfono el halo se salía del borde derecho y quedaba cortado. */
    .af-pulso[b-i0vd6s6kgi] { animation-name: af-pulso-corto-b-i0vd6s6kgi; }
    .af-fab[b-i0vd6s6kgi] { width: 52px; height: 52px; }
    .af-fab-arriba[b-i0vd6s6kgi] { width: 42px; height: 42px; }
    .af-panel[b-i0vd6s6kgi] { width: 100vw; padding: 26px 20px 36px; }
}
/* /Components/Landing/FormularioCotizacion.razor.rz.scp.css */
.fc-form[b-ypl3tqcfud] {
    padding: 28px;
    border-radius: 20px;
    background: #FFF;
    box-shadow: 0 20px 50px rgba(0, 0, 0, .14);
}

/* Dentro del panel deslizante el fondo y la sombra los pone el panel. */
.fc-form.fc-plano[b-ypl3tqcfud] {
    padding: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

/* El panel mide 420 px: en dos columnas los campos quedan tan angostos que el
   texto de ayuda de "País de destino" se corta a media palabra. */
.fc-form.fc-plano .fc-row[b-ypl3tqcfud] {
    grid-template-columns: 1fr;
    gap: 0;
}

.fc-row[b-ypl3tqcfud] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.fc-campo[b-ypl3tqcfud] { margin-bottom: 16px; }

.fc-campo label[b-ypl3tqcfud] {
    display: block;
    margin-bottom: 6px;
    color: #2E2A26;
    font-size: .84rem;
    font-weight: 600;
}

.fc-campo input[b-ypl3tqcfud],
.fc-campo textarea[b-ypl3tqcfud] {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid #E4DED6;
    border-radius: 11px;
    background: #FBF9F6;
    color: #2E2A26;
    font-family: inherit;
    font-size: .95rem;
    box-sizing: border-box;
    transition: border-color .16s ease, box-shadow .16s ease;
}

.fc-campo input:focus[b-ypl3tqcfud],
.fc-campo textarea:focus[b-ypl3tqcfud] {
    outline: none;
    border-color: #E88100;
    box-shadow: 0 0 0 3px rgba(232, 129, 0, .16);
}

.fc-campo textarea[b-ypl3tqcfud] {
    resize: vertical;
    min-height: 88px;
}

.fc-enviar[b-ypl3tqcfud] {
    display: block;
    width: 100%;
    margin-top: 4px;
    padding: 14px 20px;
    border: 0;
    border-radius: 12px;
    background: linear-gradient(135deg, #E88100, #C46D00);
    color: #FFF;
    font-family: inherit;
    font-size: 1rem;
    font-weight: 700;
    cursor: pointer;
    transition: transform .16s ease, box-shadow .16s ease;
}

.fc-enviar:hover[b-ypl3tqcfud] {
    transform: translateY(-1px);
    box-shadow: 0 10px 22px rgba(232, 129, 0, .32);
}

.fc-nota[b-ypl3tqcfud] {
    margin: 14px 0 0;
    color: #918A82;
    font-size: .78rem;
    line-height: 1.5;
    text-align: center;
}

@media (max-width: 640px) {
    .fc-form[b-ypl3tqcfud] { padding: 22px 18px; }
    .fc-row[b-ypl3tqcfud] { grid-template-columns: 1fr; gap: 0; }
}

/* Mientras la solicitud viaja al servidor. El punto que late deja claro que algo
   está pasando; sin él, un botón atenuado se lee como "no funcionó". */
.fc-enviar.fc-enviando[b-ypl3tqcfud] {
    opacity: .72;
    cursor: progress;
}

.fc-enviar.fc-enviando[b-ypl3tqcfud]::after {
    content: "";
    display: inline-block;
    width: 7px;
    height: 7px;
    margin-left: 9px;
    border-radius: 50%;
    background: currentColor;
    vertical-align: middle;
    animation: fc-latido-b-ypl3tqcfud 1s ease-in-out infinite;
}

@keyframes fc-latido-b-ypl3tqcfud {
    0%, 100% { opacity: .25; transform: scale(.75); }
    50%      { opacity: 1;   transform: scale(1); }
}

/* Quien prefiere no ver animaciones igual necesita saber que se está enviando:
   se queda el punto, quieto. */
@media (prefers-reduced-motion: reduce) {
    .fc-enviar.fc-enviando[b-ypl3tqcfud]::after { animation: none; opacity: .9; }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-jzmjfbtqvi] {
    position: relative;
    display: flex;
    flex-direction: column;
}

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

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

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

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

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

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

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

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

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

    .sidebar[b-jzmjfbtqvi] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

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

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

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

#blazor-error-ui[b-jzmjfbtqvi] {
    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-jzmjfbtqvi] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-vlgdijh5xf] {
    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-vlgdijh5xf] {
    background-color: rgba(255, 255, 255, 0.5);
}

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

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

.bi[b-vlgdijh5xf] {
    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-vlgdijh5xf] {
    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-vlgdijh5xf] {
    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-vlgdijh5xf] {
    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-vlgdijh5xf] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

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

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

    .nav-item[b-vlgdijh5xf]  .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-vlgdijh5xf]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

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

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

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

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

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

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

/* ── Firma al fondo del cajón ───────────────────────────────────────────
   No hace falta tocar el cajón: MudBlazor ya pinta .mud-drawer-content como
   columna flexible con alto completo. Basta con que este envoltorio crezca
   dentro de ella y que la firma se empuje con margin-top:auto.

   El primer intento estilaba .mud-navmenu con ::deep desde aquí y no hacía
   nada: el CSS con ámbito de Blazor solo marca los elementos escritos en este
   .razor, no los que pinta MudNavMenu por dentro. De ahí el envoltorio propio.

   min-height:0 no sobra: un elemento flexible no baja de su tamaño de contenido
   salvo que se le diga, y sin esto un menú largo desborda el cajón en vez de
   poder desplazarse. */
.nav-shell[b-vlgdijh5xf] {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}

.nav-firma[b-vlgdijh5xf] {
    margin-top: auto;
    padding: 18px 16px 20px;
    border-top: 1px solid var(--mud-palette-lines-default);
    color: var(--mud-palette-text-disabled);
    font-size: .76rem;
    text-align: center;
    letter-spacing: .01em;
}

.nav-firma strong[b-vlgdijh5xf] {
    color: var(--mud-palette-text-secondary);
    font-weight: 600;
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-eg46rb07as],
.components-reconnect-repeated-attempt-visible[b-eg46rb07as],
.components-reconnect-failed-visible[b-eg46rb07as],
.components-pause-visible[b-eg46rb07as],
.components-resume-failed-visible[b-eg46rb07as],
.components-rejoining-animation[b-eg46rb07as] {
    display: none;
}

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


#components-reconnect-modal[b-eg46rb07as] {
    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-eg46rb07as 0.5s both;
    &[open]

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

}

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

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

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

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

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

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

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

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

@keyframes components-rejoining-animation-b-eg46rb07as {
    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/Dashboard.razor.rz.scp.css */
/* ── Encabezado ──────────────────────────────────────────────────────── */
.tb-encabezado[b-50y47h5h34] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 20px;
}

.tb-migaja[b-50y47h5h34] {
    display: flex;
    align-items: center;
    gap: 7px;
    color: var(--mud-palette-text-secondary);
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.tb-punto[b-50y47h5h34] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #839A29;
}

.tb-titulo[b-50y47h5h34] {
    margin: 6px 0 0;
    font-size: 1.85rem;
    font-weight: 800;
    letter-spacing: -.03em;
    line-height: 1.1;
}

/* Selector de período: un grupo segmentado, no un desplegable. Con seis opciones
   se ven todas y se cambia de una; un desplegable esconde que existen. */
.tb-periodos[b-50y47h5h34] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    padding: 4px;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 8px;
    background: #FFF;
}

.tb-periodo[b-50y47h5h34] {
    padding: 6px 13px;
    border: 0;
    border-radius: 5px;
    background: transparent;
    color: var(--mud-palette-text-secondary);
    font: inherit;
    font-size: .82rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: background .14s ease, color .14s ease;
}

.tb-periodo:hover[b-50y47h5h34] { background: var(--mud-palette-background-gray); }

.tb-periodo-on[b-50y47h5h34] {
    background: #2E2A26;
    color: #FFF;
}

.tb-periodo-on:hover[b-50y47h5h34] { background: #2E2A26; }

/* ── Resumen ejecutivo ───────────────────────────────────────────────── */
.tb-resumen[b-50y47h5h34] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 18px;
    margin-bottom: 22px;
    padding: 18px 20px;
    border: 1px solid var(--mud-palette-lines-default);
    border-left: 4px solid #839A29;
    border-radius: 8px;
    background: #FFF;
}

.tb-resumen-alerta[b-50y47h5h34] { border-left-color: #E88100; }

.tb-resumen-texto[b-50y47h5h34] { flex: 1; min-width: 260px; }

.tb-resumen-rotulo[b-50y47h5h34] {
    margin-bottom: 6px;
    color: #839A29;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.tb-resumen-alerta .tb-resumen-rotulo[b-50y47h5h34] { color: #E88100; }

.tb-resumen-aviso[b-50y47h5h34] { color: #C83E24; }

.tb-resumen-frase[b-50y47h5h34] {
    margin: 0 0 4px;
    font-size: .95rem;
    line-height: 1.55;
}

.tb-resumen-frase:last-child[b-50y47h5h34] { margin-bottom: 0; }

/* Sombra dura, sin desenfoque: es el gesto que separa esta interfaz de
   cualquier panel genérico y encaja con una empresa que fabrica cosas. */
.tb-boton[b-50y47h5h34] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 18px;
    border: 1px solid #C46D00;
    border-radius: 5px;
    background: #E88100;
    color: #FFF;
    font-size: .88rem;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    transition: transform .12s ease, box-shadow .12s ease;
}

.tb-boton:hover[b-50y47h5h34] {
    transform: translate(-1px, -1px);
    box-shadow: 2px 2px 0 #2E2A26;
}

.tb-rotulo-seccion[b-50y47h5h34] {
    color: var(--mud-palette-text-secondary);
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
}

@media (max-width: 599px) {
    .tb-encabezado[b-50y47h5h34] { align-items: stretch; gap: 12px; }
    .tb-titulo[b-50y47h5h34] { font-size: 1.5rem; }
    .tb-periodos[b-50y47h5h34] { overflow-x: auto; flex-wrap: nowrap; }
    .tb-boton[b-50y47h5h34] { width: 100%; justify-content: center; }
}

/* Aclaración de qué mide el margen. Va en la pantalla y no en un manual porque
   quien lee la cifra es quien tiene que saber qué significa. */
.tb-aclaracion[b-50y47h5h34] {
    margin: 6px 0 12px;
    max-width: 72ch;
    color: var(--mud-palette-text-secondary);
    font-size: .8rem;
    line-height: 1.5;
}

/* ── Requiere tu atención ───────────────────────────────────────────────
   Una lista de trabajo, no un gráfico. Cada fila es un enlace entero: el
   vendedor va a pulsar en cualquier parte de la línea, no en un botoncito
   al final. */
.at-panel[b-50y47h5h34] {
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 16px;
    overflow: hidden;
    background: var(--mud-palette-surface);
    margin-bottom: 26px;
}

.at-fila[b-50y47h5h34] {
    display: grid;
    grid-template-columns: 3px 1fr auto;
    align-items: center;
    gap: 0 14px;
    padding: 13px 18px 13px 0;
    border-top: 1px solid var(--mud-palette-lines-default);
    text-decoration: none;
    color: inherit;
    transition: background .12s ease;
}

.at-fila:first-child[b-50y47h5h34] { border-top: 0; }
.at-fila:hover[b-50y47h5h34] { background: var(--mud-palette-action-default-hover); }

/* La barra de color es la que hace que el ojo agrupe por urgencia sin leer. */
.at-marca[b-50y47h5h34] {
    align-self: stretch;
    border-radius: 0 3px 3px 0;
    background: var(--mud-palette-lines-default);
}

.at-seguimientovencido .at-marca[b-50y47h5h34] { background: #C0392B; }
.at-porvencer         .at-marca[b-50y47h5h34] { background: #E88100; }
/* Azul: es lo unico del panel que no habla de una venta por cerrar sino de carga
   que no sale. Distinguirlo de un vistazo ayuda, porque se atiende de otra forma. */
.at-despachodetenido  .at-marca[b-50y47h5h34] { background: #1F6FB2; }
.at-sinrespuesta      .at-marca[b-50y47h5h34] { background: #C9A227; }
.at-clientefrio       .at-marca[b-50y47h5h34] { background: #8A9BA8; }

.at-que[b-50y47h5h34] { min-width: 0; padding-left: 15px; }

.at-tipo[b-50y47h5h34] {
    display: block;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .11em;
    text-transform: uppercase;
    color: var(--mud-palette-text-secondary);
}

.at-seguimientovencido .at-tipo[b-50y47h5h34] { color: #C0392B; }
.at-porvencer         .at-tipo[b-50y47h5h34] { color: #E88100; }
.at-despachodetenido  .at-tipo[b-50y47h5h34] { color: #1F6FB2; }

.at-cliente[b-50y47h5h34] {
    display: block;
    font-weight: 600;
    font-size: .95rem;
    margin-top: 1px;
}

/* Los nombres largos parten la fila en dos y desalinean toda la lista. */
.at-detalle[b-50y47h5h34] {
    display: block;
    font-size: .81rem;
    color: var(--mud-palette-text-secondary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.at-cuando[b-50y47h5h34] {
    text-align: right;
    white-space: nowrap;
}

.at-tiempo[b-50y47h5h34] {
    display: block;
    font-size: .82rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.at-vendedor[b-50y47h5h34] {
    display: block;
    font-size: .74rem;
    color: var(--mud-palette-text-disabled);
}

.at-resto[b-50y47h5h34],
.at-vacio[b-50y47h5h34] {
    padding: 14px 18px;
    font-size: .83rem;
    color: var(--mud-palette-text-secondary);
    border-top: 1px solid var(--mud-palette-lines-default);
}

.at-vacio[b-50y47h5h34] { border-top: 0; }

/* En un teléfono la columna de la derecha no cabe al lado: baja debajo del
   detalle y se alinea a la izquierda con el resto. */
@media (max-width: 599px) {
    .at-fila[b-50y47h5h34] {
        grid-template-columns: 3px 1fr;
        row-gap: 4px;
        padding: 12px 14px 13px 0;
    }

    .at-cuando[b-50y47h5h34] {
        grid-column: 2;
        text-align: left;
        padding-left: 15px;
    }

    .at-vendedor[b-50y47h5h34] { display: inline; margin-left: 8px; }
}
/* /Components/Pages/Forecast.razor.rz.scp.css */
.fc-encabezado[b-91sgo7zlv0] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 20px;
}

.fc-migaja[b-91sgo7zlv0] {
    color: var(--mud-palette-text-secondary);
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.fc-titulo[b-91sgo7zlv0] {
    margin: 6px 0 4px;
    font-size: 1.75rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.fc-bajada[b-91sgo7zlv0] {
    margin: 0;
    max-width: 62ch;
    color: var(--mud-palette-text-secondary);
    font-size: .88rem;
    line-height: 1.55;
}

.fc-anios[b-91sgo7zlv0] {
    display: flex;
    gap: 4px;
    padding: 4px;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 8px;
    background: #FFF;
}

.fc-anio[b-91sgo7zlv0] {
    padding: 6px 14px;
    border: 0;
    border-radius: 5px;
    background: transparent;
    color: var(--mud-palette-text-secondary);
    font: inherit;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    cursor: pointer;
}

.fc-anio:hover[b-91sgo7zlv0] { background: var(--mud-palette-background-gray); }
.fc-anio-on[b-91sgo7zlv0] { background: #2E2A26; color: #FFF; }
.fc-anio-on:hover[b-91sgo7zlv0] { background: #2E2A26; }

/* ── Totales ── */
.fc-totales[b-91sgo7zlv0] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 20px;
}

.fc-total[b-91sgo7zlv0] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 14px 16px;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 8px;
    background: #FFF;
}

.fc-total-rot[b-91sgo7zlv0] {
    color: var(--mud-palette-text-secondary);
    font-size: .66rem;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.fc-total-val[b-91sgo7zlv0] {
    font-size: 1.3rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

/* ── Trimestres y meses ── */
.fc-trimestre[b-91sgo7zlv0] {
    margin-bottom: 18px;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 8px;
    background: #FFF;
    overflow: hidden;
}

.fc-trimestre-cabeza[b-91sgo7zlv0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    padding: 10px 16px;
    border-bottom: 1px solid var(--mud-palette-lines-default);
    background: var(--mud-palette-background-gray);
}

.fc-trimestre-rot[b-91sgo7zlv0] {
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .08em;
}

.fc-trimestre-cifras[b-91sgo7zlv0] {
    color: var(--mud-palette-text-secondary);
    font-size: .8rem;
    font-variant-numeric: tabular-nums;
}

.fc-trimestre-cifras b[b-91sgo7zlv0] { margin-left: 8px; }

/* Una fila por mes. En pantalla ancha es una rejilla alineada; en angosta se
   apila, porque cinco columnas en un teléfono no se leen ni se tocan bien. */
.fc-mes[b-91sgo7zlv0] {
    display: grid;
    grid-template-columns: 8.5rem repeat(2, minmax(0, 1fr)) 9rem 5rem auto;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    border-top: 1px solid var(--mud-palette-lines-default);
}

.fc-trimestre .fc-mes:first-of-type[b-91sgo7zlv0] { border-top: 0; }

.fc-mes-actual[b-91sgo7zlv0] { background: #FFFBF5; }

.fc-mes-nombre[b-91sgo7zlv0] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    text-transform: capitalize;
}

.fc-chip-actual[b-91sgo7zlv0] {
    padding: 1px 7px;
    border-radius: 999px;
    background: #FDF0DC;
    color: #A85E00;
    font-size: .66rem;
    font-weight: 700;
    text-transform: none;
}

.fc-real[b-91sgo7zlv0] {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
}

.fc-real-val[b-91sgo7zlv0] { font-weight: 700; font-variant-numeric: tabular-nums; }

.fc-real-det[b-91sgo7zlv0],
.fc-real-vacio[b-91sgo7zlv0] {
    color: var(--mud-palette-text-secondary);
    font-size: .76rem;
}

.fc-logro[b-91sgo7zlv0] {
    display: flex;
    flex-direction: column;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.fc-logro-nota[b-91sgo7zlv0] {
    color: var(--mud-palette-text-secondary);
    font-size: .66rem;
    font-weight: 500;
}

.fc-bien[b-91sgo7zlv0] { color: #4A5714; }
.fc-mal[b-91sgo7zlv0] { color: #A3341C; }
.fc-neutro[b-91sgo7zlv0] { color: var(--mud-palette-text-primary); }

/* ── Generar desde otro año ── */
.fc-generar[b-91sgo7zlv0] {
    display: grid;
    grid-template-columns: 12rem 14rem auto;
    align-items: start;
    gap: 14px;
}

@media (max-width: 1100px) {
    .fc-mes[b-91sgo7zlv0] { grid-template-columns: 7rem repeat(2, minmax(0, 1fr)) auto; }
    .fc-real[b-91sgo7zlv0], .fc-logro[b-91sgo7zlv0] { grid-column: 2 / -1; flex-direction: row; gap: 10px; align-items: baseline; }
}

@media (max-width: 720px) {
    .fc-totales[b-91sgo7zlv0] { grid-template-columns: repeat(2, 1fr); }
    .fc-generar[b-91sgo7zlv0] { grid-template-columns: 1fr; }
    .fc-encabezado[b-91sgo7zlv0] { flex-direction: column; }
    .fc-anios[b-91sgo7zlv0] { width: 100%; overflow-x: auto; }

    .fc-mes[b-91sgo7zlv0] {
        grid-template-columns: 1fr 1fr;
        row-gap: 10px;
        padding: 14px 14px 16px;
    }

    .fc-mes-nombre[b-91sgo7zlv0] { grid-column: 1 / -1; }
    .fc-real[b-91sgo7zlv0], .fc-logro[b-91sgo7zlv0] { grid-column: auto; }
}
/* /Components/Shared/StatTile.razor.rz.scp.css */
.st[b-tfl2t4jfdx] {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 16px 18px;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 8px;
    background: #FFF;
}

/* En un teléfono, "CONVERSIÓN A FACTURA" ocupa dos líneas y la insignia se sale
   de la tarjeta: lleva white-space:nowrap y sin permiso para encogerse no le
   queda más remedio que desbordar. Con wrap baja a su propia línea cuando no
   cabe al lado, que es lo que uno haría a mano. */
.st-cabeza[b-tfl2t4jfdx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 5px 10px;
    min-height: 20px;
}

.st-rotulo[b-tfl2t4jfdx] {
    /* Un elemento flexible no baja de su ancho de contenido salvo que se le diga.
       Sin esto empuja a la insignia fuera en vez de partirse él. */
    min-width: 0;
    color: var(--mud-palette-text-secondary);
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.st-cifra[b-tfl2t4jfdx] {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin: 10px 0 auto;
    min-width: 0;
}

/* Tabular para que las cifras de varias tarjetas alineen sus dígitos: si cada
   número tiene su propio ancho, la fila de tarjetas se ve descuadrada. */
.st-valor[b-tfl2t4jfdx] {
    font-size: 1.85rem;
    font-weight: 800;
    line-height: 1.05;
    letter-spacing: -.025em;
    font-variant-numeric: tabular-nums;
    overflow-wrap: anywhere;
}

.st-unidad[b-tfl2t4jfdx] {
    color: var(--mud-palette-text-secondary);
    font-size: .78rem;
    font-weight: 600;
    white-space: nowrap;
}

.st-delta[b-tfl2t4jfdx],
.st-insignia[b-tfl2t4jfdx] {
    /* Nunca se aplasta: una insignia a medio leer es peor que una en otra línea. */
    flex: 0 0 auto;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: .72rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.st-insignia[b-tfl2t4jfdx] {
    background: var(--mud-palette-background-gray);
    color: var(--mud-palette-text-secondary);
}

.st-delta.st-bien[b-tfl2t4jfdx] { background: #EEF3DC; color: #4A5714; }
.st-delta.st-mal[b-tfl2t4jfdx] { background: #FBEAE6; color: #A3341C; }
.st-delta.st-neutro[b-tfl2t4jfdx] { background: #F1EDE7; color: #6B6560; }

/* Una línea, no una sombra: el pie se separa del cuerpo como en una ficha
   impresa, que es el registro visual de toda la marca. */
.st-pie[b-tfl2t4jfdx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 14px;
    padding-top: 10px;
    border-top: 1px solid var(--mud-palette-lines-default);
    color: var(--mud-palette-text-secondary);
    font-size: .74rem;
}

.st-pie b[b-tfl2t4jfdx] { font-variant-numeric: tabular-nums; }
.st-pie .st-bien[b-tfl2t4jfdx] { color: #4A5714; }
.st-pie .st-mal[b-tfl2t4jfdx] { color: #A3341C; }
.st-pie .st-neutro[b-tfl2t4jfdx] { color: var(--mud-palette-text-primary); }

/* Urgencia: lo que vence esta semana tiene que saltar sin leer el rótulo. */
.st-urgente[b-tfl2t4jfdx] {
    border-color: #C83E24;
    background: #FFFBFA;
}

.st-urgente .st-rotulo[b-tfl2t4jfdx],
.st-urgente .st-valor[b-tfl2t4jfdx] { color: #C83E24; }

.st-urgente .st-rotulo[b-tfl2t4jfdx]::before {
    content: "● ";
    font-size: .8em;
}

@media (max-width: 599px) {
    .st[b-tfl2t4jfdx] { padding: 14px; }
    .st-valor[b-tfl2t4jfdx] { font-size: 1.55rem; }
}