/* Season event form/table refinements.
   Keep Place before Address for in-person events and make Duration comfortable. */

/* Add event / recurring event modal: make Duration wider. */
.season-event-modal .season-duration {
  min-width: 150px !important;
  grid-template-columns: minmax(96px, 1fr) auto !important;
  gap: 8px !important;
}

.season-event-modal .season-duration input {
  min-width: 96px !important;
  width: 100% !important;
}

/* In-person modal fields are rendered as Address control + Place input.
   Reorder visually so Place name comes first and Address second. */
.season-event-modal .season-recurring-location {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 7px !important;
}

.season-event-modal .season-recurring-location > input[type="text"] {
  order: 1;
}

.season-event-modal .season-recurring-location > .season-place-control {
  order: 2;
}

.season-event-modal .season-recurring-location > small {
  order: 3;
}

/* Keep the visible label consistent with the field order: Location first, Address second. */
.season-event-modal .season-recurring-location > span:first-child {
  font-size: 0 !important;
}

.season-event-modal .season-recurring-location > span:first-child::before {
  content: "Location / address";
  font-size: 0.9rem;
}

.season-event-modal .season-recurring-location:has(> input[type="text"]) > span:first-child::after {
  content: " (optional)";
  font-size: 0.9rem;
}

/* Setting table: place-name input first, Google address/location second. */
.class-setting-panel .season-location-inline {
  display: grid !important;
  grid-template-columns: minmax(110px, 0.65fr) minmax(180px, 1.35fr) !important;
  gap: 6px !important;
  align-items: center !important;
}

.class-setting-panel .season-location-inline > input[type="text"] {
  grid-column: 1;
  grid-row: 1;
}

.class-setting-panel .season-location-inline > .season-place-control {
  grid-column: 2;
  grid-row: 1;
}

/* Table header follows the same Location -> Address order. */
.class-setting-panel .season-events-table th:nth-child(5) {
  font-size: 0 !important;
}

.class-setting-panel .season-events-table th:nth-child(5)::before {
  content: "Location / address";
  font-size: 0.9rem;
}

/* Keep duration comfortable in the Setting table as well. */
.class-setting-panel .season-duration {
  min-width: 112px !important;
  grid-template-columns: 76px auto !important;
  gap: 5px !important;
}

.class-setting-panel .season-duration input {
  min-width: 76px !important;
}

@media (max-width: 760px) {
  .season-event-modal .season-duration {
    min-width: 132px !important;
    grid-template-columns: minmax(84px, 1fr) auto !important;
  }

  .class-setting-panel .season-location-inline {
    grid-template-columns: minmax(100px, 0.7fr) minmax(160px, 1.3fr) !important;
  }
}