/**
 * Hide PWA on Desktop
 * 
 * This CSS hides the PWA call to action banner on desktop devices
 * while keeping it visible on tablet and mobile devices.
 * Specifically targets only the hyper-pwa-notification-bar class.
 */

/* 
 * Target only the specific hyper-pwa-notification-bar class
 */
@media screen and (min-width: 1200px) {
    /* Hide PWA banner on desktop (screen width >= 1200px) */
    .hyper-pwa-notification-bar {
        display: none !important;
    }
}

/* 
 * Ensure visibility on mobile and tablet devices 
 */
@media screen and (max-width: 1199px) {
    /* Show PWA banner on mobile/tablet and smaller screens */
    .hyper-pwa-notification-bar {
        display: block !important;
    }
}