/* Flexbox helper utilities */

.flex {
  display: flex;
  gap: var(--gap);
}

.inline-flex {
  display: inline-flex;
  gap: var(--gap);
}

.flex-column {
  flex-direction: column;
}

.flex-row {
  flex-direction: row;
}

.flex-wrap {
  flex-wrap: wrap;
}

.flex-nowrap {
  flex-wrap: nowrap;
}

.flex-center {
  align-items: center;
  justify-content: center;
}

.flex-justify-start {
  justify-content: flex-start;
}

.flex-justify-center {
  justify-content: center;
}

.flex-justify-end {
  justify-content: flex-end;
}

.flex-justify-between {
  justify-content: space-between;
}

.flex-justify-around {
  justify-content: space-around;
}

.flex-align-start {
  align-items: flex-start;
}

.flex-align-center {
  align-items: center;
}

.flex-align-end {
  align-items: flex-end;
}

.flex-align-stretch {
  align-items: stretch;
}

.flex-align-baseline {
  align-items: baseline;
}

.flex-gap-none {
  gap: 0;
}

.flex-gap-tight {
  gap: var(--gap9);
}

.flex-gap-loose {
  gap: var(--gap48);
}

/* Gap spacing helpers */
.gap {
  gap: var(--gap);
}

.gap-6 {
  gap: var(--gap6);
}

.gap-9 {
  gap: var(--gap9);
}

.gap-10 {
  gap: var(--gap10);
}

.gap-12 {
  gap: var(--gap12);
}

.gap-18 {
  gap: var(--gap18);
}

.gap-24 {
  gap: var(--gap24);
}

.gap-48 {
  gap: var(--gap48);
}

.gap-72 {
  gap: var(--gap72);
}

.gap-108 {
  gap: var(--gap108);
}

/* Padding helpers */
.pad-none {
  padding: 0;
}

.pad {
  padding: var(--gap);
}

.pad-6 {
  padding: var(--gap6);
}

.pad-9 {
  padding: var(--gap9);
}

.pad-10 {
  padding: var(--gap10);
}

.pad-12 {
  padding: var(--gap12);
}

.pad-18 {
  padding: var(--gap18);
}

.pad-24 {
  padding: var(--gap24);
}

.pad-48 {
  padding: var(--gap48);
}

.pad-72 {
  padding: var(--gap72);
}

.pad-108 {
  padding: var(--gap108);
}

.pad-block-none {
  padding-block: 0;
}

.pad-block {
  padding-block: var(--gap);
}

.pad-block-6 {
  padding-block: var(--gap6);
}

.pad-block-9 {
  padding-block: var(--gap9);
}

.pad-block-10 {
  padding-block: var(--gap10);
}

.pad-block-12 {
  padding-block: var(--gap12);
}

.pad-block-18 {
  padding-block: var(--gap18);
}

.pad-block-24 {
  padding-block: var(--gap24);
}

.pad-block-48 {
  padding-block: var(--gap48);
}

.pad-block-72 {
  padding-block: var(--gap72);
}

.pad-block-108 {
  padding-block: var(--gap108);
}

.pad-inline-none {
  padding-inline: 0;
}

.pad-inline {
  padding-inline: var(--gap);
}

.pad-inline-6 {
  padding-inline: var(--gap6);
}

.pad-inline-9 {
  padding-inline: var(--gap9);
}

.pad-inline-10 {
  padding-inline: var(--gap10);
}

.pad-inline-12 {
  padding-inline: var(--gap12);
}

.pad-inline-18 {
  padding-inline: var(--gap18);
}

.pad-inline-24 {
  padding-inline: var(--gap24);
}

.pad-inline-48 {
  padding-inline: var(--gap48);
}

.pad-inline-72 {
  padding-inline: var(--gap72);
}

.pad-inline-108 {
  padding-inline: var(--gap108);
}

/* Directional padding helpers */
.pad-top {
  padding-top: var(--gap);
}

.pad-top-6 {
  padding-top: var(--gap6);
}

.pad-top-9 {
  padding-top: var(--gap9);
}

.pad-top-10 {
  padding-top: var(--gap10);
}

.pad-top-12 {
  padding-top: var(--gap12);
}

.pad-top-18 {
  padding-top: var(--gap18);
}

.pad-top-24 {
  padding-top: var(--gap24);
}

.pad-top-48 {
  padding-top: var(--gap48);
}

.pad-top-72 {
  padding-top: var(--gap72);
}

.pad-top-108 {
  padding-top: var(--gap108);
}

.pad-bottom {
  padding-bottom: var(--gap);
}

.pad-bottom-6 {
  padding-bottom: var(--gap6);
}

.pad-bottom-9 {
  padding-bottom: var(--gap9);
}

.pad-bottom-10 {
  padding-bottom: var(--gap10);
}

.pad-bottom-12 {
  padding-bottom: var(--gap12);
}

.pad-bottom-18 {
  padding-bottom: var(--gap18);
}

.pad-bottom-24 {
  padding-bottom: var(--gap24);
}

.pad-bottom-48 {
  padding-bottom: var(--gap48);
}

.pad-bottom-72 {
  padding-bottom: var(--gap72);
}

.pad-bottom-108 {
  padding-bottom: var(--gap108);
}

.pad-left {
  padding-left: var(--gap);
}

.pad-left-6 {
  padding-left: var(--gap6);
}

.pad-left-9 {
  padding-left: var(--gap9);
}

.pad-left-10 {
  padding-left: var(--gap10);
}

.pad-left-12 {
  padding-left: var(--gap12);
}

.pad-left-18 {
  padding-left: var(--gap18);
}

.pad-left-24 {
  padding-left: var(--gap24);
}

.pad-left-48 {
  padding-left: var(--gap48);
}

.pad-left-72 {
  padding-left: var(--gap72);
}

.pad-left-108 {
  padding-left: var(--gap108);
}

.pad-right {
  padding-right: var(--gap);
}

.pad-right-6 {
  padding-right: var(--gap6);
}

.pad-right-9 {
  padding-right: var(--gap9);
}

.pad-right-10 {
  padding-right: var(--gap10);
}

.pad-right-12 {
  padding-right: var(--gap12);
}

.pad-right-18 {
  padding-right: var(--gap18);
}

.pad-right-24 {
  padding-right: var(--gap24);
}

.pad-right-48 {
  padding-right: var(--gap48);
}

.pad-right-72 {
  padding-right: var(--gap72);
}

.pad-right-108 {
  padding-right: var(--gap108);
}

.pad-top-bottom {
  padding-block: var(--gap);
}

.pad-top-bottom-6 {
  padding-block: var(--gap6);
}

.pad-top-bottom-9 {
  padding-block: var(--gap9);
}

.pad-top-bottom-10 {
  padding-block: var(--gap10);
}

.pad-top-bottom-12 {
  padding-block: var(--gap12);
}

.pad-top-bottom-18 {
  padding-block: var(--gap18);
}

.pad-top-bottom-24 {
  padding-block: var(--gap24);
}

.pad-top-bottom-48 {
  padding-block: var(--gap48);
}

.pad-top-bottom-72 {
  padding-block: var(--gap72);
}

.pad-top-bottom-108 {
  padding-block: var(--gap108);
}

.pad-left-right {
  padding-inline: var(--gap);
}

.pad-left-right-6 {
  padding-inline: var(--gap6);
}

.pad-left-right-9 {
  padding-inline: var(--gap9);
}

.pad-left-right-10 {
  padding-inline: var(--gap10);
}

.pad-left-right-12 {
  padding-inline: var(--gap12);
}

.pad-left-right-18 {
  padding-inline: var(--gap18);
}

.pad-left-right-24 {
  padding-inline: var(--gap24);
}

.pad-left-right-48 {
  padding-inline: var(--gap48);
}

.pad-left-right-72 {
  padding-inline: var(--gap72);
}

.pad-left-right-108 {
  padding-inline: var(--gap108);
}

.medium-width {
    max-width: var(--medium-width);
}