﻿/*
 * ExFoods - Modal Top Positioning
 * 
 * Purpose:
 * - When opening a product, the modal slides down the screen.
 * - This forces the modal to stop near the top (20-25px from top) 
 *   instead of going far down the viewport.
 * - Also adds extra breathing room at the bottom after the Add to Cart button
 *   so it doesn't feel cramped before the modal allows scrolling.
 * 
 * How to use:
 * - Drop this file into your exfoods-overrides/css/ folder.
 * - The auto-enqueue helper will load it automatically after the plugin styles.
 */

.ex_modal .modal-content,
#food_modal .modal-content,
.exwf-md-modern.modal-content {
    margin-top: 20px !important;
    top: 20px !important;
    transform: none !important;                    /* disable any centering transform */
    max-height: calc(100vh - 65px) !important;     /* a bit more room at bottom */
    overflow: auto;                                /* allow scrolling inside the modal if needed */
    padding-bottom: 40px !important;               /* extra white space after Add to Cart */
}

/* Make the close button easier to tap when the modal is high up */
.ex_modal .ex_close,
.exwf-md-modern .ex_close {
    top: 8px !important;
    right: 10px !important;
}
