/* Marco web: la app se presenta como columna centrada tipo móvil.
   Todo el look & feel interno viene de _content/Nido.UI/css/nido.css. */

html, body {
    margin: 0;
    padding: 0;
    background: #DDD7CC;
    min-height: 100vh;
}

.web-phone-frame {
    max-width: 430px;
    min-height: 100vh;
    min-height: 100dvh;
    margin: 0 auto;
    background: var(--crema, #F3EFE8);
    box-shadow: 0 0 40px rgba(95, 91, 87, 0.25);
    position: relative;
    overflow-x: hidden;
}

/* Los elementos position:fixed toman como referencia el viewport, no el
   marco centrado. Se limitan al ancho de la aplicación en escritorio y
   conservan el ancho completo en teléfonos. */
.web-phone-frame .bottom-nav {
    left: 50%;
    right: auto;
    width: min(100vw, 430px);
    transform: translateX(-50%);
}

.web-phone-frame .app-fab {
    right: max(22px, calc((100vw - 430px) / 2 + 22px));
}

#blazor-error-ui {
    display: none;
}