/* iPhone 14 Pro and other modern devices fixes */

/* Fix for iPhone 14 Pro and other devices with notches */
@media screen and (device-width: 390px) and (device-height: 844px),
       screen and (device-width: 393px) and (device-height: 852px),
       screen and (device-width: 428px) and (device-height: 926px),
       screen and (device-width: 430px) and (device-height: 932px),
       screen and (max-width: 430px) {

    /* Prevent horizontal overflow */
    body, html {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
    }

    /* Adjust container width */
    .container {
        width: 100%;
        max-width: 100%;
        padding-left: 10px;
        padding-right: 10px;
    }

    /* Fix for checkout page */
    .checkout-page {
        width: 100%;
        max-width: 100%;
        overflow: hidden;
    }

    /* Adjust footer for iPhone 14 Pro */
    .main-footer {
        width: 100%;
        max-width: 100vw;
        overflow: hidden;
    }

    /* Ensure back-to-top button is properly positioned */
    .back-to-top {
        right: 10px;
        bottom: 80px;
        z-index: 1050;
    }

    /* Fix bottom toolbar */
    .mobile-toolbar {
        width: 100%;
        max-width: 100%;
        overflow: hidden;
        left: 0;
        right: 0;
        padding-left: env(safe-area-inset-left);
        padding-right: env(safe-area-inset-right);
        padding-bottom: env(safe-area-inset-bottom);
    }

    /* Fix for iPhone notch */
    .mobile-toolbar-item {
        font-size: 11px;
    }

    /* Fix for iPhone notch - smaller icons */
    .mobile-toolbar-icon {
        transform: scale(0.9);
    }

    /* Fix for iPhone notch - smaller text */
    .mobile-toolbar-label {
        font-size: 10px;
    }

    /* Fix for iPhone notch - cart counter */
    .cart-counter {
        transform: scale(0.8);
        right: -5px;
        top: -5px;
    }
}

/* Fix for iPhone 14 Pro Max and other large devices */
@media screen and (device-width: 428px) and (device-height: 926px),
       screen and (device-width: 430px) and (device-height: 932px) {

    /* Slightly larger text for larger devices */
    .mobile-toolbar-label {
        font-size: 11px;
    }
}

/* Fix for iPhone SE and other small devices */
@media screen and (max-width: 375px) {
    .mobile-toolbar-label {
        font-size: 9px;
    }

    .mobile-toolbar-icon {
        transform: scale(0.8);
    }
}

/* Fix for iOS devices with bottom toolbar */
@supports (-webkit-touch-callout: none) {
    .mobile-toolbar {
        padding-bottom: max(10px, env(safe-area-inset-bottom));
    }

    .back-to-top {
        bottom: calc(80px + env(safe-area-inset-bottom));
    }
}

/* Hide duplicate back-to-top button */
.scroll-top-btn {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}