/* West Coast Nautic Academy – global layout guard
   Keeps forms, cards, grids and admin controls inside their own frames. */

html,
body,
.app,
.main,
.view,
.card,
.mini,
form,
fieldset,
.v362-shell,
.v362-grid,
.v362-form,
.config-list,
.config-row {
  min-width: 0;
  max-width: 100%;
}

.main,
.view {
  width: 100%;
  overflow-x: clip;
}

.card,
.mini,
.v362-item,
.v362-lesson-editor,
.config-row {
  overflow-wrap: anywhere;
}

.v362-shell > *,
.v362-grid > *,
.v362-form > *,
.config-row > *,
.admin-grid > *,
.form-grid > *,
.tools > *,
.media-manager-row > * {
  min-width: 0;
  max-width: 100%;
}

label,
input,
select,
textarea,
button {
  min-width: 0;
  max-width: 100%;
}

input,
select,
textarea {
  width: 100%;
}

.v362-shell {
  width: 100%;
  grid-template-columns: minmax(250px, 0.72fr) minmax(0, 1.28fr);
}

.v362-grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.v362-grid.three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.config-row {
  width: 100%;
  grid-template-columns: minmax(120px, 0.9fr) minmax(160px, 1.25fr) minmax(110px, 0.75fr) minmax(0, auto);
  gap: 12px;
}

.config-actions,
.v362-actions,
.tools,
.media-manager-actions {
  min-width: 0;
  max-width: 100%;
  flex-wrap: wrap;
}

.config-actions button,
.v362-actions button,
.tools button,
.media-manager-actions button {
  flex: 0 1 auto;
}

@media (max-width: 1280px) {
  .config-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: end;
  }

  .config-actions {
    grid-column: 1 / -1;
    justify-content: flex-end;
  }
}

@media (max-width: 1100px) {
  .v362-shell {
    grid-template-columns: 1fr;
  }

  .v362-grid.three {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .config-row,
  .v362-grid.two,
  .v362-grid.three,
  .admin-grid,
  .form-grid.two {
    grid-template-columns: 1fr !important;
  }

  .config-actions,
  .v362-actions,
  .tools,
  .media-manager-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .config-actions button,
  .v362-actions button {
    flex: 1 1 auto;
  }
}