/* ================================
   RESPONSIVE SITE STARTS
   ================================ */
   
   /* Custom Media Queries */

@media (min-width: 576px) {
  .container { max-width: var(--container-width-sm); }
}

@media (min-width: 768px) {
  .container { max-width: var(--container-width-md); }
   .col-md-12 { width: 100%; }
            .col-md-10 { width: calc(83.333% - (var(--grid-gap) * (2/12))); }
            .col-md-9  { width: calc(75% - (var(--grid-gap) * 0.25)); }
            .col-md-8  { width: calc(66.666% - (var(--grid-gap) * (4/12))); }
            .col-md-6  { width: calc(50% - (var(--grid-gap) * 0.5)); }
            .col-md-4  { width: calc(33.333% - (var(--grid-gap) * (2/3))); }
            .col-md-3  { width: calc(25% - (var(--grid-gap) * 0.75)); }
            .col-md-2  { width: calc(16.666% - (var(--grid-gap) * (10/12))); }
            
            .col-md-auto { flex: 0 0 auto; width: auto; }
            
}

@media (min-width: 992px) {
  .container { max-width: var(--container-width-lg); }
  .col-lg-6  { width: calc(50% - (var(--grid-gap) * 0.5)); }
            .col-lg-4  { width: calc(33.333% - (var(--grid-gap) * (2/3))); }
            .col-lg-3  { width: calc(25% - (var(--grid-gap) * 0.75)); }
            .col-lg-2  { width: calc(16.666% - (var(--grid-gap) * (10/12))); }
}

@media (min-width: 1200px) {
  .container { max-width: var(--container-width-xl); }
   .col-xl-3  { width: calc(25% - (var(--grid-gap) * 0.75)); }
}

@media (min-width: 1400px) {
  .container { max-width: var(--container-width-xxl); }
}
@media screen and (max-width: 1200px) {
   .sps-events-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
   }
}

@media screen and (max-width: 740px) {
  .sps-events-grid { grid-template-columns: 1fr; }
}

@media (max-width: 900px){
  .sps-team-grid{ grid-template-columns: 1fr; }
  .sps-team-search-row{ flex-direction: column; align-items: stretch; }
  .sps-team-search-btn,
  .sps-team-filter-toggle-btn,
  .sps-team-clear-top{ width: 100%; }
  .sps-team-select{ width: 100%; min-width: 0; }
  
 .sps-team-search-btn,
.sps-team-filter-toggle-btn {
  width: fit-content;
  padding: var(--pad-sm) var(--pad-md);
}

}

/* Custom Media Queries Ends */


/* Tablet Starts */

@media screen and (max-width: 980px) {
    
    .gap-2xl {
    --grid-gap: calc(var(--space-lg) * 2);
  }
    
  .container,
  .container-fluid {
  padding-right: 0;
  padding-left:0;
 
  }
/* ===== CONTAINERS END ===== */
  .mobile-header { display: flex; padding:var( --pad-md) var( --pad-xl)  }
  .site-wrapper { display: block; padding-top: 92px; }
  .side-menu {
    position: fixed;
    left: 0;
    top: 0;
    transform: translateX(-100%);
    height: 100vh;
    z-index: 100;
    box-shadow: 2px 0 10px rgba(0,0,0,0.1);
  }
  :root{
      
  --text-xs: 0.65rem;
  --text-sm: 0.775rem;
  --text-base: 0.9rem;
  --text-lg: 1rem;
  --text-xl: 0.9rem;
  --text-2xl: 1.1rem;
  --text-3xl: 1.3rem;
  --text-4xl: 1.7rem;
  --text-5xl: 2rem;
  --sidebar-width: 85%;
  }
  .sps-date-widget .dw-day-long,
  .sps-date-widget .dw-month-long{display:none;}
  .sps-date-widget .dw-day-short,
  .sps-date-widget .dw-month-short{display:block;}
  .mobile-brand {
      max-width: 115px;
  }
  
  .content-area {
      margin-left: 0;
  }
  .side-menu.open { transform: translateX(0); }
  .content-area { width: 100%; }
  .date-widget{
        display: flex;
    align-items: center;
    gap: var(--gap-xs);
  }
  
  .sps-team-inline-meta{
  flex-wrap: wrap;
  }


/* Tablet End */

/* Mobile Start */

@media screen and (max-width: 767px)  {
    
     :root{
      
  --text-xs: 0.6rem;
  --text-sm: 0.675rem;
  --text-base: 0.8rem;
  --text-lg: 0.9rem;
  --text-xl: 0.8rem;
  --text-2xl: 0.9rem;
  --text-3xl: 1rem;
  --text-4xl: 1.4rem;
  --text-5xl: 1.6rem;
  }
    
    .sps-upcoming-list {
        gap: var(--space-md);
    }
    
    
    .sps-post-card {
    padding: var(--pad-md);
        
    }
    
  
    .sps-composer {
        padding: var(--pad-md);
    }
    

    }
    .content-area {
        padding: var(--pad-md);
    }
    
     .gap-2xl {
    --grid-gap: calc(var(--space-md) * 2);
    }
    
    .mobile-brand {
        max-width: 90px!important;
    }
    
    .mobile-header { padding:var(--pad-md); }
    .site-wrapper {
        padding-top: 71px;
    }
    
    .sps-team-results {
        margin-top: var(--space-lg);
    }
    
    .sps-team-grid {
            gap: var(--space-md);
    }
    
    .sps-team-page {
        padding-bottom:0;
    }
    
    .sps-upcoming-wrap {
        margin-bottom: var(--space-md);
    }
    
    .card {
        padding: 20px;
    }
}


/* Mobile End */


/* ================================
   RESPONSIVE SITE ENDS
   ================================ */
