/* BIG ESFIHA PRO V5.4 — experiência mobile do cardápio/checkout */
html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

@media (max-width: 767px) {
    html, body {
        max-width: 100%;
        overflow-x: hidden;
    }

    /* Evita o zoom automático do iOS/Safari ao focar campos menores que 16px. */
    input:not([type="checkbox"]):not([type="radio"]),
    select,
    textarea {
        font-size: 16px !important;
    }

    button,
    a,
    input,
    select,
    textarea,
    [role="button"] {
        touch-action: manipulation;
    }

    /* Hero mais compacto: o cliente chega aos produtos mais rápido. */
    body > .relative.h-64 {
        height: 12.5rem !important;
    }

    body > .relative.h-64 img.rounded-full {
        width: 4.75rem !important;
        height: 4.75rem !important;
    }

    #produtos-container {
        margin-top: 1.25rem !important;
        padding-left: .75rem !important;
        padding-right: .75rem !important;
    }

    .prod-category-section {
        margin-bottom: 1.75rem !important;
    }

    .prod-category-section > .mb-5 {
        margin-bottom: .65rem !important;
        padding-bottom: .55rem !important;
    }

    .prod-category-section h2 {
        font-size: 1rem !important;
        line-height: 1.25rem !important;
    }

    .category-products-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: .625rem !important;
    }

    /* Produtos em lista no mobile. */
    .prod-card {
        display: flex !important;
        flex-direction: row !important;
        align-items: stretch !important;
        min-height: 7.25rem;
        border-radius: 1rem !important;
        overflow: hidden;
        box-shadow: none !important;
    }

    .prod-card-image {
        width: 6.4rem !important;
        min-width: 6.4rem !important;
        height: auto !important;
        min-height: 7.25rem !important;
        flex: 0 0 6.4rem;
    }

    .prod-card-image img {
        height: 100% !important;
        min-height: 7.25rem;
    }

    .prod-card-body {
        padding: .7rem .75rem !important;
        min-width: 0;
    }

    .prod-card-category {
        display: none !important;
    }

    .prod-card-title {
        margin-bottom: .25rem !important;
        font-size: .94rem !important;
        line-height: 1.18rem !important;
    }

    .prod-card-desc {
        margin-bottom: .25rem !important;
        font-size: .73rem !important;
        line-height: 1.05rem !important;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .prod-card-bottom {
        padding-top: .45rem !important;
        border-top: 0 !important;
        gap: .5rem;
    }

    .prod-card-price {
        font-size: .94rem !important;
        line-height: 1.1rem !important;
        white-space: nowrap;
    }

    .prod-card-qty {
        border-radius: .65rem !important;
        flex-shrink: 0;
    }

    .prod-card-qty button {
        width: 2.05rem !important;
        height: 2.05rem !important;
    }

    .prod-card-qty span {
        width: 1.45rem !important;
    }

    /* Busca/categorias mais compactas. */
    #searchInput {
        min-height: 3rem;
        padding-top: .7rem !important;
        padding-bottom: .7rem !important;
    }

    .cat-btn {
        padding: .6rem 1rem !important;
        font-size: .68rem !important;
    }

    /* Botão da sacola usa melhor a largura e respeita a área segura do aparelho. */
    #cart-float {
        bottom: calc(.75rem + env(safe-area-inset-bottom)) !important;
        width: calc(100% - 1rem) !important;
        max-width: none !important;
        padding: .7rem .8rem !important;
        border-radius: 1rem !important;
    }

    #cart-float > div:first-child {
        gap: .65rem !important;
    }

    #cart-float > div:first-child > div:first-child {
        width: 2.75rem !important;
        height: 2.75rem !important;
    }

    #cart-total {
        font-size: 1rem !important;
    }

    .cart-float-action-label {
        font-size: .8rem;
    }

    /* Checkout mobile: tela cheia real e UMA única rolagem. */
    #cart-drawer {
        width: 100% !important;
        max-width: none !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        border-left: 0 !important;
        padding-bottom: env(safe-area-inset-bottom);
        -webkit-overflow-scrolling: touch;
    }

    #cart-drawer .cart-drawer-header {
        position: sticky;
        top: 0;
        z-index: 4;
        padding: calc(.8rem + env(safe-area-inset-top)) .9rem .8rem !important;
        backdrop-filter: blur(16px);
    }

    .mobile-checkout-nav {
        display: grid !important;
        grid-template-columns: 1fr 1fr;
        position: sticky;
        top: calc(3.85rem + env(safe-area-inset-top));
        z-index: 3;
        gap: .4rem;
        padding: .5rem .75rem;
        background: rgba(9, 9, 11, .96);
        border-bottom: 1px solid rgb(39 39 42);
        backdrop-filter: blur(14px);
    }

    .mobile-checkout-nav button {
        min-height: 2.65rem;
        border: 1px solid rgb(63 63 70);
        border-radius: .8rem;
        background: rgb(24 24 27);
        color: rgb(212 212 216);
        font-size: .75rem;
        font-weight: 800;
    }

    .mobile-checkout-nav button:last-child {
        border-color: rgba(255, 176, 0, .45);
        background: rgba(255, 176, 0, .10);
        color: #ffb000;
    }

    #cart-items {
        flex: none !important;
        overflow: visible !important;
        padding: .75rem !important;
        max-height: none !important;
    }

    #cart-items > div {
        border-radius: .9rem !important;
        padding: .75rem !important;
    }

    #cart-items input[type="text"] {
        min-height: 2.8rem;
    }

    #checkout-panel {
        flex: none !important;
        overflow: visible !important;
        max-height: none !important;
        padding: .75rem .75rem calc(1.1rem + env(safe-area-inset-bottom)) !important;
    }

    #checkout-form {
        padding-bottom: 1rem;
    }

    .checkout-section {
        margin: 0 0 .7rem !important;
        padding: .9rem !important;
        border: 1px solid rgb(39 39 42) !important;
        border-radius: 1rem !important;
        background: rgba(24, 24, 27, .72);
    }

    .checkout-section > label:first-child,
    .checkout-section-heading {
        margin-bottom: .7rem !important;
        font-size: .69rem !important;
        letter-spacing: .08em !important;
    }

    #checkout-form input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
    #checkout-form select,
    #checkout-form textarea {
        min-height: 3rem;
        border-radius: .8rem !important;
    }

    #checkout-form textarea {
        min-height: 5.75rem;
    }

    #checkout-form input:focus,
    #checkout-form select:focus,
    #checkout-form textarea:focus {
        scroll-margin-top: 8.5rem;
    }

    #box-troco {
        grid-template-columns: 1fr !important;
    }

    #btn-finalizar-pedido {
        min-height: 3.45rem;
        font-size: 1rem !important;
        margin-top: .7rem !important;
    }

    body.cart-drawer-open {
        overflow: hidden !important;
    }

    /* Modal de produto acompanha a altura dinâmica do celular. */
    #product-details-modal {
        align-items: flex-end !important;
        padding: 0 !important;
    }

    #product-details-modal [data-product-modal-card] {
        max-height: 92dvh !important;
        border-radius: 1.35rem 1.35rem 0 0 !important;
        border-bottom: 0 !important;
    }

    /* WhatsApp não cobre a sacola. */
    body > .fixed.bottom-6.right-6 {
        bottom: 5.4rem !important;
        right: .75rem !important;
    }

    body > .fixed.bottom-6.right-6 a {
        width: 3rem !important;
        height: 3rem !important;
    }
}