/*
 * Lo que el panel de Filament necesita para el TELÉFONO.
 * ═══════════════════════════════════════════════════════════════════════════
 *
 * 🔴🔴 POR QUÉ EXISTE: 19 campos de «Datos del negocio», 14 de Productos y 3 de
 * Pedidos se dibujaban con letra menor a 16 px. En Safari de iPhone, tocar un
 * campo con letra menor a 16 px hace que **la pantalla haga zoom sola** y se
 * descoloque: el que está cargando su CUIT pierde de vista el formulario en el
 * primer toque.
 *
 * ⚠️ Y hay que decirlo como es: lo MEDIDO acá es el tamaño de letra (14 px). El
 * zoom es la consecuencia conocida de esa regla de Safari, y **no se pudo ver
 * en un iPhone porque no hay ninguno en esta casa**. Que no se lea como
 * verificado, porque no lo está.
 *
 * ⛔ Va en 16 px y no en `1rem`: la regla de Safari mira el tamaño calculado en
 * píxeles. Si algún día el `html` baja de 16, `1rem` deja de alcanzar y esto
 * volvería a fallar sin dar un error.
 *
 * 🔑 Y sólo hasta 40rem. En la computadora la letra chica de Filament está
 * bien: el problema es de un navegador de teléfono, no del tamaño en sí.
 */
@media (max-width: 40rem) {
    .fi-input,
    .fi-select-input,
    input:not([type='checkbox']):not([type='radio']):not([type='range']),
    select,
    textarea {
        font-size: 16px;
    }
}

/*
 * ── LA VUELTA AL SITIO ──────────────────────────────────────────────────
 *
 * 🔴 No existía. Lo levantó Lucas el 31/08/2026: se entraba al panel a cambiar
 * un precio y no había cómo volver a verlo cambiado. Medido: cero enlaces del
 * panel salían al sitio.
 *
 * 🔑 44 px de alto, porque el panel también se usa desde el teléfono — es
 * literalmente lo que promete la barra de cada demostración.
 */
.estudio-ver-sitio {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    min-height: 2.75rem;
    padding: 0 0.9rem;
    margin-inline: 0.5rem;
    border-radius: 0.5rem;
    border: 1px solid rgb(212 212 216);
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1;
    color: rgb(63 63 70);
    text-decoration: none;
    white-space: nowrap;
}

.estudio-ver-sitio:hover {
    background: rgb(244 244 245);
}

/* El panel tiene modo oscuro de fábrica: sin esto el enlace queda ilegible. */
.dark .estudio-ver-sitio {
    border-color: rgb(63 63 70);
    color: rgb(228 228 231);
}

.dark .estudio-ver-sitio:hover {
    background: rgb(39 39 42);
}
