/* Natural Fresh v30.0.4 — shared responsive layer for every public plugin page. */
html, body {
    max-width: 100%;
    overflow-x: hidden;
}

*, *::before, *::after {
    box-sizing: border-box;
}

img, video, iframe, svg, canvas {
    max-width: 100%;
}

.nf-admin-portal,
.nf-account-page,
.nf-store-orders-page,
.nf-order-tracking-page,
.nf-shop-page,
.nf-homepage {
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
}

.nf-admin-shell,
.nf-account-shell,
.nf-orders-shell,
.nf-shop-shell,
.nf-home-shell {
    width: min(100% - 32px, 1440px);
    max-width: 100%;
    margin-inline: auto;
}

.nf-admin-portal input,
.nf-admin-portal select,
.nf-admin-portal textarea,
.nf-admin-portal button,
.nf-account-page input,
.nf-account-page select,
.nf-account-page textarea,
.nf-account-page button,
.nf-store-orders-page input,
.nf-store-orders-page select,
.nf-store-orders-page textarea,
.nf-store-orders-page button,
.nf-shop-page input,
.nf-shop-page select,
.nf-shop-page textarea,
.nf-shop-page button {
    max-width: 100%;
    min-width: 0;
}

.nf-admin-portal table,
.nf-store-orders-page table,
.woocommerce table.shop_table {
    width: 100%;
}

.nf-admin-table-wrap,
.nf-orders-table-wrap,
.woocommerce-cart-form,
.woocommerce-checkout-review-order {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

@media (max-width: 1024px) {
    .nf-admin-shell,
    .nf-account-shell,
    .nf-orders-shell,
    .nf-shop-shell,
    .nf-home-shell {
        width: min(100% - 28px, 1000px);
    }

    .nf-admin-grid,
    .nf-products-grid,
    .nf-shop-grid,
    .nf-orders-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .nf-admin-toolbar,
    .nf-shop-toolbar,
    .nf-orders-toolbar {
        flex-wrap: wrap;
        gap: 12px;
    }
}

@media (max-width: 767px) {
    html {
        -webkit-text-size-adjust: 100%;
    }

    body {
        min-width: 0 !important;
    }

    .nf-admin-shell,
    .nf-account-shell,
    .nf-orders-shell,
    .nf-shop-shell,
    .nf-home-shell {
        width: calc(100% - 24px);
    }

    .nf-admin-portal,
    .nf-account-page,
    .nf-store-orders-page,
    .nf-order-tracking-page,
    .nf-shop-page {
        padding-inline: 0 !important;
    }

    .nf-admin-grid,
    .nf-products-grid,
    .nf-shop-grid,
    .nf-orders-grid,
    .nf-account-two,
    .nf-account-three,
    .nf-form-grid,
    .nf-product-form-grid,
    .nf-order-details-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .nf-admin-card,
    .nf-account-card,
    .nf-order-card,
    .nf-shop-card,
    .nf-product-card {
        width: 100%;
        max-width: 100%;
        border-radius: 18px !important;
    }

    .nf-admin-toolbar,
    .nf-shop-toolbar,
    .nf-orders-toolbar,
    .nf-admin-actions,
    .nf-order-actions,
    .nf-product-actions {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        width: 100%;
    }

    .nf-admin-toolbar > *,
    .nf-shop-toolbar > *,
    .nf-orders-toolbar > *,
    .nf-admin-actions > *,
    .nf-order-actions > *,
    .nf-product-actions > * {
        width: 100% !important;
        max-width: 100% !important;
    }

    .nf-admin-portal input,
    .nf-admin-portal select,
    .nf-admin-portal textarea,
    .nf-account-page input,
    .nf-account-page select,
    .nf-account-page textarea,
    .nf-store-orders-page input,
    .nf-store-orders-page select,
    .nf-store-orders-page textarea,
    .nf-shop-page input,
    .nf-shop-page select,
    .nf-shop-page textarea,
    .woocommerce input.input-text,
    .woocommerce select,
    .woocommerce textarea {
        width: 100% !important;
        min-height: 48px;
        font-size: 16px !important;
    }

    .nf-admin-portal button,
    .nf-account-page button,
    .nf-store-orders-page button,
    .nf-shop-page button,
    .woocommerce a.button,
    .woocommerce button.button,
    .woocommerce input.button {
        min-height: 46px;
        white-space: normal;
    }

    .nf-admin-profile-dropdown {
        position: fixed !important;
        inset-inline: 12px !important;
        top: auto !important;
        bottom: 12px !important;
        width: auto !important;
        max-width: none !important;
        max-height: calc(100dvh - 24px);
        overflow-y: auto;
    }

    .nf-account-card header h1,
    .nf-admin-portal h1,
    .nf-store-orders-page h1,
    .nf-shop-page h1 {
        font-size: clamp(24px, 7vw, 34px) !important;
        line-height: 1.25;
    }

    .nf-account-tabs {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
    }

    .nf-account-tabs button {
        width: 100%;
    }

    .nf-product-gallery,
    .nf-preview-gallery {
        grid-template-columns: 1fr !important;
    }

    .nf-product-card img,
    .nf-shop-card img {
        width: 100%;
        height: auto;
        object-fit: cover;
    }

    .woocommerce .col2-set .col-1,
    .woocommerce .col2-set .col-2,
    .woocommerce-page .col2-set .col-1,
    .woocommerce-page .col2-set .col-2 {
        float: none;
        width: 100%;
    }
}

@media (max-width: 420px) {
    .nf-admin-shell,
    .nf-account-shell,
    .nf-orders-shell,
    .nf-shop-shell,
    .nf-home-shell {
        width: calc(100% - 16px);
    }

    .nf-admin-card,
    .nf-account-card,
    .nf-order-card,
    .nf-shop-card,
    .nf-product-card {
        border-radius: 14px !important;
    }
}