/**
 * Main Styles
 * Core styles loaded on all pages (public and admin)
 */

/* ==========================================================================
   Base Styles
   ========================================================================== */

/* Remove outline on contenteditable elements */
[contenteditable]:focus {
  outline: none;
}

/* ==========================================================================
   Grid Layout - Responsive Column Spans
   ========================================================================== */

/* Responsive grid span classes - clamps to available columns */
.grid-span-1 {
  grid-column: span 1;
}

.grid-span-2 {
  grid-column: span 1; /* Mobile: 1 col available */
}

.grid-span-3 {
  grid-column: span 1; /* Mobile: 1 col available */
}

@media (min-width: 768px) {
  .grid-span-2 {
    grid-column: span 2; /* md: 2 cols available */
  }
  .grid-span-3 {
    grid-column: span 2; /* md: clamp to 2 cols */
  }
}

@media (min-width: 1024px) {
  .grid-span-3 {
    grid-column: span 3; /* lg: all 3 cols available */
  }
}