/**
 * Frontend-only styles for Quantum Theme
 * These styles will only be loaded on the frontend, not in the editor
 */

/* Responsive Hide Classes
--------------------------------------------- */

/* Extra large screens (1200px and up) */
@media (min-width: 1200px) {
    .hide-xl {
        display: none !important;
    }
}

/* Large screens (1024px to 1199px) */
@media (min-width: 1024px) and (max-width: 1199.98px) {
    .hide-lg {
        display: none !important;
    }
}

/* Medium screens (768px to 1023px) */
@media (min-width: 768px) and (max-width: 1023.98px) {
    .hide-md {
        display: none !important;
    }
}

/* Small screens (less than 768px) */
@media (min-width: 576px) and (max-width: 767px) {
    .hide-sm {
        display: none !important;
    }
}

/* Extra small screens (less than 576px) */
@media (max-width: 575.98px) {
    .hide-xs {
        display: none !important;
    }
}