/* ==========================================================================
   Legacy PrimaThemes Grid (Flexbox Resurrection)
   Purpose: Preserve old shortcode markup without content migration
   ========================================================================== */

.ps-column {
  display: flex;
  flex-wrap: wrap;
  width: 100%;

  /* Gutter compensation */
  margin-left: -1rem;
  margin-right: -1rem;

  row-gap: 1rem;
  margin-bottom: 2.5rem;
}

/* Base column */
.ps-column-col {
  box-sizing: border-box;
  min-width: 0;

  /* Horizontal gutters */
  padding-left: 1rem;
  padding-right: 1rem;
}

/* --------------------------------------------------------------------------
   Column Widths
   -------------------------------------------------------------------------- */

/* Two columns */
.twocol-one {
  flex: 0 0 50%;
  max-width: 50%;
}

/* Three columns */
.threecol-one {
  flex: 0 0 33.3333%;
  max-width: 33.3333%;
}

.threecol-two {
  flex: 0 0 66.6666%;
  max-width: 66.6666%;
}

/* Four columns */
.fourcol-one {
  flex: 0 0 25%;
  max-width: 25%;
}

.fourcol-two {
  flex: 0 0 50%;
  max-width: 50%;
}

.fourcol-three {
  flex: 0 0 75%;
  max-width: 75%;
}

/* Five columns */
.fivecol-one {
  flex: 0 0 20%;
  max-width: 20%;
}

.fivecol-two {
  flex: 0 0 40%;
  max-width: 40%;
}

.fivecol-three {
  flex: 0 0 60%;
  max-width: 60%;
}

.fivecol-four {
  flex: 0 0 80%;
  max-width: 80%;
}

/* Six columns */
.sixcol-one {
  flex: 0 0 16.6666%;
  max-width: 16.6666%;
}

.sixcol-two {
  flex: 0 0 33.3333%;
  max-width: 33.3333%;
}

.sixcol-three {
  flex: 0 0 50%;
  max-width: 50%;
}

.sixcol-four {
  flex: 0 0 66.6666%;
  max-width: 66.6666%;
}

.sixcol-five {
  flex: 0 0 83.3333%;
  max-width: 83.3333%;
}

/* --------------------------------------------------------------------------
   Legacy cleanup
   -------------------------------------------------------------------------- */

.ps-column-col.last {
  margin-right: 0;
  clear: none;
}

/* --------------------------------------------------------------------------
   Responsive: Stack on tablet + mobile
   -------------------------------------------------------------------------- */

@media (max-width: 768px) {
  .ps-column {
    margin-left: 0;
    margin-right: 0;
  }

  .ps-column-col {
    flex: 0 0 100%;
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
  }
}
