/* Layout follows the space inside the app, not whether it is a browser tab or
   an installed PWA. Keep controls in document flow and preserve full values. */
.calendar-planner-view {
  container-name: lifecentral-calendar;
  container-type: inline-size;
}
.calendar-planner-view .calendar-planner-toolbar {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
}
.calendar-planner-view .calendar-planner-toolbar__primary {
  grid-column: 1;
  grid-row: 1;
  min-width: 0;
  padding-right: 0;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 15px;
}
.calendar-planner-view .calendar-date-navigation { flex: 0 0 auto; }
.calendar-planner-view .calendar-planner-toolbar__primary h2 {
  flex: 1 1 13rem;
  width: auto;
  max-width: 100%;
  overflow: visible;
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.3;
}
.calendar-planner-view .calendar-planner-toolbar__actions {
  position: static;
  grid-column: 2;
  grid-row: 1;
  width: auto;
  max-width: 100%;
  justify-self: end;
  flex-wrap: wrap;
}
.calendar-planner-view .calendar-planner-toolbar__actions > .button {
  flex: 0 1 auto;
  min-width: 0;
  white-space: normal;
}
.calendar-planner-view .calendar-view-options {
  display: flex;
  grid-column: 1 / -1;
  grid-row: 2;
  justify-self: start;
  flex-wrap: wrap;
}
.calendar-planner-view .calendar-view-select {
  display: none;
  grid-column: 1 / -1;
  grid-row: 2;
}
.calendar-planner-view .calendar-view-select select {
  min-width: 0;
  max-width: 100%;
  flex: 1 1 8.5rem;
}
.calendar-planner-view .calendar-filter-options {
  display: flex;
  grid-column: 1 / -1;
  grid-row: 3;
  max-width: 100%;
  justify-self: start;
  justify-content: flex-start;
  flex-wrap: wrap;
}
.calendar-planner-view .calendar-filter-options button {
  flex: 0 0 auto;
  min-width: 0;
  max-width: 100%;
  white-space: normal;
}
.calendar-planner-view .calendar-filter-options button > svg,
.calendar-planner-view .calendar-filter-options button > span { flex: 0 0 auto; }
@container lifecentral-calendar (max-width: 720px) {
  .calendar-planner-view .calendar-planner-toolbar { grid-template-columns: minmax(0, 1fr); }
  .calendar-planner-view .calendar-planner-toolbar__actions {
    grid-column: 1;
    grid-row: 2;
    justify-self: start;
    justify-content: flex-start;
  }
  .calendar-planner-view .calendar-view-options,
  .calendar-planner-view .calendar-view-select { grid-row: 3; }
  .calendar-planner-view .calendar-filter-options { grid-row: 4; }
}
@container lifecentral-calendar (max-width: 480px) {
  .calendar-planner-view .calendar-view-options { display: none; }
  .calendar-planner-view .calendar-view-select { display: flex; align-items: center; gap: 8px; }
}
/* Safe single-column fallback on browsers without size-container queries. */
@supports not (container-type: inline-size) {
  @media (max-width: 1100px) {
    .calendar-planner-view .calendar-planner-toolbar { grid-template-columns: minmax(0, 1fr); }
    .calendar-planner-view .calendar-planner-toolbar__actions { grid-column: 1; grid-row: 2; justify-self: start; }
    .calendar-planner-view .calendar-view-options,
    .calendar-planner-view .calendar-view-select { grid-row: 3; }
    .calendar-planner-view .calendar-filter-options { grid-row: 4; }
  }
}
.dashboard-weather {
  container-name: lifecentral-weather;
  container-type: inline-size;
}
.dashboard-weather .dashboard-weather__summary {
  min-width: 0;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: 'identity temperature' 'today today' 'actions actions';
  gap: 14px 18px;
}
.dashboard-weather .dashboard-weather__summary > *,
.dashboard-weather .dashboard-weather__identity > div { min-width: 0; }
.dashboard-weather .dashboard-weather__identity { grid-area: identity; }
.dashboard-weather .dashboard-weather__identity h2,
.dashboard-weather .dashboard-weather__identity p { overflow-wrap: anywhere; }
.dashboard-weather .dashboard-weather__temperature { grid-area: temperature; }
.dashboard-weather .dashboard-weather__today {
  grid-area: today;
  min-width: 0;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 7.5rem), 1fr));
  gap: 1px;
  background: var(--line);
}
.dashboard-weather .dashboard-weather__today > div {
  min-width: 0;
  border: 0;
  background: var(--surface-solid);
}
.dashboard-weather .dashboard-weather__today strong,
.dashboard-weather .dashboard-weather__today small {
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.4;
}
.dashboard-weather .dashboard-weather__actions {
  grid-area: actions;
  min-width: 0;
  max-width: 100%;
  flex-wrap: wrap;
}
.dashboard-weather .dashboard-weather__actions > .button { min-width: 0; white-space: normal; }
.dashboard-weather .dashboard-weather__signal { min-width: 0; flex-wrap: wrap; }
.dashboard-weather .dashboard-weather__signal > * { min-width: 0; overflow-wrap: anywhere; }
@container lifecentral-weather (min-width: 760px) {
  .dashboard-weather .dashboard-weather__summary { grid-template-areas: 'identity temperature' 'today actions'; }
}
@container lifecentral-weather (min-width: 1100px) {
  .dashboard-weather .dashboard-weather__summary {
    grid-template-columns: minmax(180px, 1fr) auto minmax(350px, 1.4fr) auto;
    grid-template-areas: 'identity temperature today actions';
  }
}
@container lifecentral-weather (max-width: 380px) {
  .dashboard-weather .dashboard-weather__summary {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: 'identity' 'temperature' 'today' 'actions';
  }
  .dashboard-weather .dashboard-weather__temperature { justify-items: start; }
  .dashboard-weather .dashboard-weather__actions { justify-content: flex-start; }
}