/* ===================================================================
   FICHEIRO 2: MOBILE - Classes m- (≤767px)
   =================================================================== */

/* ===== MOBILE PLACEHOLDER CLASSES ===== */
/* m- aplicam-se apenas em mobile (até 767px) */

/* Mobile Margins - All sides */
.m-margin-0 { }
.m-margin-3xs { }
.m-margin-2xs { }
.m-margin-xs { }
.m-margin-s { }
.m-margin-m { }
.m-margin-l { }
.m-margin-xl { }
.m-margin-2xl { }
.m-margin-3xl { }

/* Mobile Margins - Individual sides */
.m-margin-top-0 { }
.m-margin-top-3xs { }
.m-margin-top-2xs { }
.m-margin-top-xs { }
.m-margin-top-s { }
.m-margin-top-m { }
.m-margin-top-l { }
.m-margin-top-xl { }
.m-margin-top-2xl { }
.m-margin-top-3xl { }

.m-margin-right-0 { }
.m-margin-right-3xs { }
.m-margin-right-2xs { }
.m-margin-right-xs { }
.m-margin-right-s { }
.m-margin-right-m { }
.m-margin-right-l { }
.m-margin-right-xl { }
.m-margin-right-2xl { }
.m-margin-right-3xl { }

.m-margin-bottom-0 { }
.m-margin-bottom-3xs { }
.m-margin-bottom-2xs { }
.m-margin-bottom-xs { }
.m-margin-bottom-s { }
.m-margin-bottom-m { }
.m-margin-bottom-l { }
.m-margin-bottom-xl { }
.m-margin-bottom-2xl { }
.m-margin-bottom-3xl { }

.m-margin-left-0 { }
.m-margin-left-3xs { }
.m-margin-left-2xs { }
.m-margin-left-xs { }
.m-margin-left-s { }
.m-margin-left-m { }
.m-margin-left-l { }
.m-margin-left-xl { }
.m-margin-left-2xl { }
.m-margin-left-3xl { }

/* Mobile Margins - Inline/Block */
.m-margin-inline-0 { }
.m-margin-inline-3xs { }
.m-margin-inline-2xs { }
.m-margin-inline-xs { }
.m-margin-inline-s { }
.m-margin-inline-m { }
.m-margin-inline-l { }
.m-margin-inline-xl { }
.m-margin-inline-2xl { }
.m-margin-inline-3xl { }

.m-margin-block-0 { }
.m-margin-block-3xs { }
.m-margin-block-2xs { }
.m-margin-block-xs { }
.m-margin-block-s { }
.m-margin-block-m { }
.m-margin-block-l { }
.m-margin-block-xl { }
.m-margin-block-2xl { }
.m-margin-block-3xl { }

/* Mobile Paddings - All sides */
.m-padding-0 { }
.m-padding-3xs { }
.m-padding-2xs { }
.m-padding-xs { }
.m-padding-s { }
.m-padding-m { }
.m-padding-l { }
.m-padding-xl { }
.m-padding-2xl { }
.m-padding-3xl { }

/* Mobile Paddings - Individual sides */
.m-padding-top-0 { }
.m-padding-top-3xs { }
.m-padding-top-2xs { }
.m-padding-top-xs { }
.m-padding-top-s { }
.m-padding-top-m { }
.m-padding-top-l { }
.m-padding-top-xl { }
.m-padding-top-2xl { }
.m-padding-top-3xl { }

.m-padding-right-0 { }
.m-padding-right-3xs { }
.m-padding-right-2xs { }
.m-padding-right-xs { }
.m-padding-right-s { }
.m-padding-right-m { }
.m-padding-right-l { }
.m-padding-right-xl { }
.m-padding-right-2xl { }
.m-padding-right-3xl { }

.m-padding-bottom-0 { }
.m-padding-bottom-3xs { }
.m-padding-bottom-2xs { }
.m-padding-bottom-xs { }
.m-padding-bottom-s { }
.m-padding-bottom-m { }
.m-padding-bottom-l { }
.m-padding-bottom-xl { }
.m-padding-bottom-2xl { }
.m-padding-bottom-3xl { }

.m-padding-left-0 { }
.m-padding-left-3xs { }
.m-padding-left-2xs { }
.m-padding-left-xs { }
.m-padding-left-s { }
.m-padding-left-m { }
.m-padding-left-l { }
.m-padding-left-xl { }
.m-padding-left-2xl { }
.m-padding-left-3xl { }

/* Mobile Paddings - Inline/Block */
.m-padding-inline-0 { }
.m-padding-inline-3xs { }
.m-padding-inline-2xs { }
.m-padding-inline-xs { }
.m-padding-inline-s { }
.m-padding-inline-m { }
.m-padding-inline-l { }
.m-padding-inline-xl { }
.m-padding-inline-2xl { }
.m-padding-inline-3xl { }

.m-padding-block-0 { }
.m-padding-block-3xs { }
.m-padding-block-2xs { }
.m-padding-block-xs { }
.m-padding-block-s { }
.m-padding-block-m { }
.m-padding-block-l { }
.m-padding-block-xl { }
.m-padding-block-2xl { }
.m-padding-block-3xl { }

/* Mobile Border Width - All sides */
.m-border-0 { }
.m-border-1 { }

/* Mobile Border Width - Individual sides */
.m-border-top-0 { }
.m-border-top-1 { }

.m-border-right-0 { }
.m-border-right-1 { }

.m-border-bottom-0 { }
.m-border-bottom-1 { }

.m-border-left-0 { }
.m-border-left-1 { }

/* Mobile Border Width - Inline/Block */
.m-border-inline-0 { }
.m-border-inline-1 { }

.m-border-block-0 { }
.m-border-block-1 { }

/* ===== MOBILE MEDIA QUERY ===== */
@media (max-width: var(--breakpoint-mobile)) {
  /* Mobile Margins - All sides */
  .m-margin-0 { margin: 0 !important; }
  .m-margin-3xs { margin: var(--space-3xs) !important; }
  .m-margin-2xs { margin: var(--space-2xs) !important; }
  .m-margin-xs { margin: var(--space-xs) !important; }
  .m-margin-s { margin: var(--space-s) !important; }
  .m-margin-m { margin: var(--space-m) !important; }
  .m-margin-l { margin: var(--space-l) !important; }
  .m-margin-xl { margin: var(--space-xl) !important; }
  .m-margin-2xl { margin: var(--space-2xl) !important; }
  .m-margin-3xl { margin: var(--space-3xl) !important; }

  /* Mobile Margins - Individual sides */
  .m-margin-top-0 { margin-top: 0 !important; }
  .m-margin-top-3xs { margin-top: var(--space-3xs) !important; }
  .m-margin-top-2xs { margin-top: var(--space-2xs) !important; }
  .m-margin-top-xs { margin-top: var(--space-xs) !important; }
  .m-margin-top-s { margin-top: var(--space-s) !important; }
  .m-margin-top-m { margin-top: var(--space-m) !important; }
  .m-margin-top-l { margin-top: var(--space-l) !important; }
  .m-margin-top-xl { margin-top: var(--space-xl) !important; }
  .m-margin-top-2xl { margin-top: var(--space-2xl) !important; }
  .m-margin-top-3xl { margin-top: var(--space-3xl) !important; }

  .m-margin-right-0 { margin-right: 0 !important; }
  .m-margin-right-3xs { margin-right: var(--space-3xs) !important; }
  .m-margin-right-2xs { margin-right: var(--space-2xs) !important; }
  .m-margin-right-xs { margin-right: var(--space-xs) !important; }
  .m-margin-right-s { margin-right: var(--space-s) !important; }
  .m-margin-right-m { margin-right: var(--space-m) !important; }
  .m-margin-right-l { margin-right: var(--space-l) !important; }
  .m-margin-right-xl { margin-right: var(--space-xl) !important; }
  .m-margin-right-2xl { margin-right: var(--space-2xl) !important; }
  .m-margin-right-3xl { margin-right: var(--space-3xl) !important; }

  .m-margin-bottom-0 { margin-bottom: 0 !important; }
  .m-margin-bottom-3xs { margin-bottom: var(--space-3xs) !important; }
  .m-margin-bottom-2xs { margin-bottom: var(--space-2xs) !important; }
  .m-margin-bottom-xs { margin-bottom: var(--space-xs) !important; }
  .m-margin-bottom-s { margin-bottom: var(--space-s) !important; }
  .m-margin-bottom-m { margin-bottom: var(--space-m) !important; }
  .m-margin-bottom-l { margin-bottom: var(--space-l) !important; }
  .m-margin-bottom-xl { margin-bottom: var(--space-xl) !important; }
  .m-margin-bottom-2xl { margin-bottom: var(--space-2xl) !important; }
  .m-margin-bottom-3xl { margin-bottom: var(--space-3xl) !important; }

  .m-margin-left-0 { margin-left: 0 !important; }
  .m-margin-left-3xs { margin-left: var(--space-3xs) !important; }
  .m-margin-left-2xs { margin-left: var(--space-2xs) !important; }
  .m-margin-left-xs { margin-left: var(--space-xs) !important; }
  .m-margin-left-s { margin-left: var(--space-s) !important; }
  .m-margin-left-m { margin-left: var(--space-m) !important; }
  .m-margin-left-l { margin-left: var(--space-l) !important; }
  .m-margin-left-xl { margin-left: var(--space-xl) !important; }
  .m-margin-left-2xl { margin-left: var(--space-2xl) !important; }
  .m-margin-left-3xl { margin-left: var(--space-3xl) !important; }

  /* Mobile Margins - Inline/Block */
  .m-margin-inline-0 { margin-left: 0 !important; margin-right: 0 !important; }
  .m-margin-inline-3xs { margin-left: var(--space-3xs) !important; margin-right: var(--space-3xs) !important; }
  .m-margin-inline-2xs { margin-left: var(--space-2xs) !important; margin-right: var(--space-2xs) !important; }
  .m-margin-inline-xs { margin-left: var(--space-xs) !important; margin-right: var(--space-xs) !important; }
  .m-margin-inline-s { margin-left: var(--space-s) !important; margin-right: var(--space-s) !important; }
  .m-margin-inline-m { margin-left: var(--space-m) !important; margin-right: var(--space-m) !important; }
  .m-margin-inline-l { margin-left: var(--space-l) !important; margin-right: var(--space-l) !important; }
  .m-margin-inline-xl { margin-left: var(--space-xl) !important; margin-right: var(--space-xl) !important; }
  .m-margin-inline-2xl { margin-left: var(--space-2xl) !important; margin-right: var(--space-2xl) !important; }
  .m-margin-inline-3xl { margin-left: var(--space-3xl) !important; margin-right: var(--space-3xl) !important; }

  .m-margin-block-0 { margin-top: 0 !important; margin-bottom: 0 !important; }
  .m-margin-block-3xs { margin-top: var(--space-3xs) !important; margin-bottom: var(--space-3xs) !important; }
  .m-margin-block-2xs { margin-top: var(--space-2xs) !important; margin-bottom: var(--space-2xs) !important; }
  .m-margin-block-xs { margin-top: var(--space-xs) !important; margin-bottom: var(--space-xs) !important; }
  .m-margin-block-s { margin-top: var(--space-s) !important; margin-bottom: var(--space-s) !important; }
  .m-margin-block-m { margin-top: var(--space-m) !important; margin-bottom: var(--space-m) !important; }
  .m-margin-block-l { margin-top: var(--space-l) !important; margin-bottom: var(--space-l) !important; }
  .m-margin-block-xl { margin-top: var(--space-xl) !important; margin-bottom: var(--space-xl) !important; }
  .m-margin-block-2xl { margin-top: var(--space-2xl) !important; margin-bottom: var(--space-2xl) !important; }
  .m-margin-block-3xl { margin-top: var(--space-3xl) !important; margin-bottom: var(--space-3xl) !important; }

  /* Mobile Paddings - All sides */
  .m-padding-0 { padding: 0 !important; }
  .m-padding-3xs { padding: var(--space-3xs) !important; }
  .m-padding-2xs { padding: var(--space-2xs) !important; }
  .m-padding-xs { padding: var(--space-xs) !important; }
  .m-padding-s { padding: var(--space-s) !important; }
  .m-padding-m { padding: var(--space-m) !important; }
  .m-padding-l { padding: var(--space-l) !important; }
  .m-padding-xl { padding: var(--space-xl) !important; }
  .m-padding-2xl { padding: var(--space-2xl) !important; }
  .m-padding-3xl { padding: var(--space-3xl) !important; }

  /* Mobile Paddings - Individual sides */
  .m-padding-top-0 { padding-top: 0 !important; }
  .m-padding-top-3xs { padding-top: var(--space-3xs) !important; }
  .m-padding-top-2xs { padding-top: var(--space-2xs) !important; }
  .m-padding-top-xs { padding-top: var(--space-xs) !important; }
  .m-padding-top-s { padding-top: var(--space-s) !important; }
  .m-padding-top-m { padding-top: var(--space-m) !important; }
  .m-padding-top-l { padding-top: var(--space-l) !important; }
  .m-padding-top-xl { padding-top: var(--space-xl) !important; }
  .m-padding-top-2xl { padding-top: var(--space-2xl) !important; }
  .m-padding-top-3xl { padding-top: var(--space-3xl) !important; }

  .m-padding-right-0 { padding-right: 0 !important; }
  .m-padding-right-3xs { padding-right: var(--space-3xs) !important; }
  .m-padding-right-2xs { padding-right: var(--space-2xs) !important; }
  .m-padding-right-xs { padding-right: var(--space-xs) !important; }
  .m-padding-right-s { padding-right: var(--space-s) !important; }
  .m-padding-right-m { padding-right: var(--space-m) !important; }
  .m-padding-right-l { padding-right: var(--space-l) !important; }
  .m-padding-right-xl { padding-right: var(--space-xl) !important; }
  .m-padding-right-2xl { padding-right: var(--space-2xl) !important; }
  .m-padding-right-3xl { padding-right: var(--space-3xl) !important; }

  .m-padding-bottom-0 { padding-bottom: 0 !important; }
  .m-padding-bottom-3xs { padding-bottom: var(--space-3xs) !important; }
  .m-padding-bottom-2xs { padding-bottom: var(--space-2xs) !important; }
  .m-padding-bottom-xs { padding-bottom: var(--space-xs) !important; }
  .m-padding-bottom-s { padding-bottom: var(--space-s) !important; }
  .m-padding-bottom-m { padding-bottom: var(--space-m) !important; }
  .m-padding-bottom-l { padding-bottom: var(--space-l) !important; }
  .m-padding-bottom-xl { padding-bottom: var(--space-xl) !important; }
  .m-padding-bottom-2xl { padding-bottom: var(--space-2xl) !important; }
  .m-padding-bottom-3xl { padding-bottom: var(--space-3xl) !important; }

  .m-padding-left-0 { padding-left: 0 !important; }
  .m-padding-left-3xs { padding-left: var(--space-3xs) !important; }
  .m-padding-left-2xs { padding-left: var(--space-2xs) !important; }
  .m-padding-left-xs { padding-left: var(--space-xs) !important; }
  .m-padding-left-s { padding-left: var(--space-s) !important; }
  .m-padding-left-m { padding-left: var(--space-m) !important; }
  .m-padding-left-l { padding-left: var(--space-l) !important; }
  .m-padding-left-xl { padding-left: var(--space-xl) !important; }
  .m-padding-left-2xl { padding-left: var(--space-2xl) !important; }
  .m-padding-left-3xl { padding-left: var(--space-3xl) !important; }

  /* Mobile Paddings - Inline/Block */
  .m-padding-inline-0 { padding-left: 0 !important; padding-right: 0 !important; }
  .m-padding-inline-3xs { padding-left: var(--space-3xs) !important; padding-right: var(--space-3xs) !important; }
  .m-padding-inline-2xs { padding-left: var(--space-2xs) !important; padding-right: var(--space-2xs) !important; }
  .m-padding-inline-xs { padding-left: var(--space-xs) !important; padding-right: var(--space-xs) !important; }
  .m-padding-inline-s { padding-left: var(--space-s) !important; padding-right: var(--space-s) !important; }
  .m-padding-inline-m { padding-left: var(--space-m) !important; padding-right: var(--space-m) !important; }
  .m-padding-inline-l { padding-left: var(--space-l) !important; padding-right: var(--space-l) !important; }
  .m-padding-inline-xl { padding-left: var(--space-xl) !important; padding-right: var(--space-xl) !important; }
  .m-padding-inline-2xl { padding-left: var(--space-2xl) !important; padding-right: var(--space-2xl) !important; }
  .m-padding-inline-3xl { padding-left: var(--space-3xl) !important; padding-right: var(--space-3xl) !important; }

  .m-padding-block-0 { padding-top: 0 !important; padding-bottom: 0 !important; }
  .m-padding-block-3xs { padding-top: var(--space-3xs) !important; padding-bottom: var(--space-3xs) !important; }
  .m-padding-block-2xs { padding-top: var(--space-2xs) !important; padding-bottom: var(--space-2xs) !important; }
  .m-padding-block-xs { padding-top: var(--space-xs) !important; padding-bottom: var(--space-xs) !important; }
  .m-padding-block-s { padding-top: var(--space-s) !important; padding-bottom: var(--space-s) !important; }
  .m-padding-block-m { padding-top: var(--space-m) !important; padding-bottom: var(--space-m) !important; }
  .m-padding-block-l { padding-top: var(--space-l) !important; padding-bottom: var(--space-l) !important; }
  .m-padding-block-xl { padding-top: var(--space-xl) !important; padding-bottom: var(--space-xl) !important; }
  .m-padding-block-2xl { padding-top: var(--space-2xl) !important; padding-bottom: var(--space-2xl) !important; }
  .m-padding-block-3xl { padding-top: var(--space-3xl) !important; padding-bottom: var(--space-3xl) !important; }

  /* Mobile Border Width - All sides */
  .m-border-0 { border-width: var(--border-0) !important; }
  .m-border-1 { border-width: var(--border-1) !important; }

  /* Mobile Border Width - Individual sides */
  .m-border-top-0 { border-top-width: var(--border-0) !important; }
  .m-border-top-1 { border-top-width: var(--border-1) !important; }

  .m-border-right-0 { border-right-width: var(--border-0) !important; }
  .m-border-right-1 { border-right-width: var(--border-1) !important; }

  .m-border-bottom-0 { border-bottom-width: var(--border-0) !important; }
  .m-border-bottom-1 { border-bottom-width: var(--border-1) !important; }

  .m-border-left-0 { border-left-width: var(--border-0) !important; }
  .m-border-left-1 { border-left-width: var(--border-1) !important; }

  /* Mobile Border Width - Inline/Block */
  .m-border-inline-0 { 
    border-left-width: var(--border-0) !important; 
    border-right-width: var(--border-0) !important; 
  }
  .m-border-inline-1 { 
    border-left-width: var(--border-1) !important; 
    border-right-width: var(--border-1) !important; 
  }

  .m-border-block-0 { 
    border-top-width: var(--border-0) !important; 
    border-bottom-width: var(--border-0) !important; 
  }
  .m-border-block-1 { 
    border-top-width: var(--border-1) !important; 
    border-bottom-width: var(--border-1) !important; 
  }

  /* Mobile Display & Visibility */
  .m-hide { display: none !important; }
  .m-show { display: block !important; }
  .m-flex { display: flex !important; }
  .m-inline { display: inline !important; }
  .m-inline-block { display: inline-block !important; }
  
  /* Mobile-specific text alignment */
  .m-text-center { text-align: center !important; }
  .m-text-left { text-align: left !important; }
  .m-text-right { text-align: right !important; }
  
  /* Mobile-specific width controls */
  .m-width-100 { width: 100% !important; }
  .m-width-auto { width: auto !important; }
}