/* Responsive Utility Classes
   These classes provide responsive show/hide behavior across breakpoints.
   Use with block style variations in the editor.
*/

/* Hide on mobile (max-width: 1024px) */
@media (max-width: 1024px) {
  .is-style-hide-mobile {
    display: none !important;
  }
}

/* Show only on mobile (max-width: 1024px) - hide on larger screens */
@media (min-width: 1025px) {
  .is-style-show-mobile {
    display: none !important;
  }
}

/* Hide on tablet (min-width: 768px and max-width: 1024px) */
@media (min-width: 768px) and (max-width: 1024px) {
  .is-style-hide-tablet {
    display: none !important;
  }
}

/* Show only on tablet - hide on mobile and desktop */
@media (max-width: 767px), (min-width: 1025px) {
  .is-style-show-tablet {
    display: none !important;
  }
}

/* Hide on desktop (min-width: 1025px) */
@media (min-width: 1025px) {
  .is-style-hide-desktop {
    display: none !important;
  }
}

/* Show only on desktop - hide on smaller screens */
@media (max-width: 1024px) {
  .is-style-show-desktop {
    display: none !important;
  }
}

/* Hide on XL desktop (min-width: 1481px) */
@media (min-width: 1481px) {
  .is-style-hide-xl {
    display: none !important;
  }
}

/* Show only on XL desktop - hide on smaller screens */
@media (max-width: 1480px) {
  .is-style-show-xl {
    display: none !important;
  }
}

/* Reverse mobile stacking for columns */
@media (max-width: 1024px) {
  .wp-block-columns.is-style-reverse-mobile {
    flex-direction: column-reverse !important;
  }
}

/* Additional responsive text utilities */
@media (max-width: 1024px) {
  .is-style-text-center-mobile {
    text-align: center !important;
  }
}

@media (min-width: 1025px) {
  .is-style-text-center-desktop {
    text-align: center !important;
  }
}

/* Note: base mega-menu label/icon styles moved to navigation.css */