/* Mobile calendar layout: use toolbar arrows as month picker, page scrolls. */
@media (max-width: 620px) {
  [data-tab-content="fleet.root.vehicle.rent.calendar"] {
    height: auto !important;
    overflow: visible !important;
  }

  [data-view-id="fleet.root.vehicle.rent.calendar"] {
    height: auto !important;
    overflow: visible !important;
  }

  [data-view-id="fleet.root.vehicle.rent.calendar"] [class*="_wrapper_"] {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px;
    align-items: stretch;
    flex: 0 0 auto !important;
    overflow: visible !important;
  }

  [data-view-id="fleet.root.vehicle.rent.calendar"] [class*="_scheduler_"] {
    order: 1 !important;
    min-width: 0;
    position: static !important;
    flex: 0 0 auto !important;
    overflow: visible !important;
  }

  [data-view-id="fleet.root.vehicle.rent.calendar"] [class*="_scheduler_"] > div {
    height: auto !important;
  }

  [data-view-id="fleet.root.vehicle.rent.calendar"] [class*="_sidebar_"] {
    display: none !important;
  }

  [data-view-id="fleet.root.vehicle.rent.calendar"] [class*="_toolbar_"] {
    display: grid !important;
    grid-template-columns: auto 1fr auto;
    grid-template-rows: auto auto auto;
    gap: 8px !important;
    align-items: center !important;
    height: auto !important;
    min-height: 3rem;
  }

  [data-view-id="fleet.root.vehicle.rent.calendar"] [class*="_toolbar_"] > [class*="_bar_"]:not([class*="_pageActions_"]):not([class*="_viewSwitch_"]):not([class*="_farItems_"]) {
    grid-row: 1;
    grid-column: 1 / -1;
    width: 100%;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
  }

  [data-view-id="fleet.root.vehicle.rent.calendar"] [class*="_toolbar_"] > [class*="_pageActions_"] {
    grid-row: 2;
    grid-column: 1 / -1;
    display: contents !important;
  }

  [data-view-id="fleet.root.vehicle.rent.calendar"] [class*="_toolbar_"] > [class*="_pageInfo_"] {
    grid-row: 2;
    grid-column: 2;
    display: block !important;
    text-align: center;
    pointer-events: none;
  }

  [data-view-id="fleet.root.vehicle.rent.calendar"] [class*="_toolbar_"] > [class*="_viewSwitch_"],
  [data-view-id="fleet.root.vehicle.rent.calendar"] [class*="_toolbar_"] > [class*="_farItems_"] {
    grid-row: 3;
    grid-column: 1 / -1;
    width: 100%;
    justify-content: center;
  }

  [data-tab-container-size="xs"] [data-view-id="fleet.root.vehicle.rent.calendar"] [class*="_pageInfo_"] {
    display: block !important;
  }

  [data-tab-container-size="xs"] [data-view-id="fleet.root.vehicle.rent.calendar"] [class*="_pageActions_"] {
    display: contents !important;
  }

  [data-view-id="fleet.root.vehicle.rent.calendar"] [class*="_pageActions_"] > [class*="_itemWrapper_"]:first-child {
    grid-row: 2;
    grid-column: 1;
    justify-self: start;
  }

  [data-view-id="fleet.root.vehicle.rent.calendar"] [class*="_pageActions_"] > [class*="_itemWrapper_"]:last-child {
    grid-row: 2;
    grid-column: 3;
    justify-self: end;
  }

  [data-view-id="fleet.root.vehicle.rent.calendar"] .fc .fc-daygrid-day-number {
    font-size: 12px;
  }

  [data-view-id="fleet.root.vehicle.rent.calendar"] .fc .fc-daygrid-event {
    font-size: 11px;
  }

  [data-view-id="fleet.root.vehicle.rent.calendar"] [class*="_container_"],
  [data-view-id="fleet.root.vehicle.rent.calendar"] [class*="_wrapper_"],
  [data-view-id="fleet.root.vehicle.rent.calendar"] [class*="_scheduler_"] {
    height: auto !important;
    overflow: visible !important;
  }

  [data-view-id="fleet.root.vehicle.rent.calendar"] .fc {
    height: auto !important;
  }

  [data-view-id="fleet.root.vehicle.rent.calendar"] .fc .fc-view-harness,
  [data-view-id="fleet.root.vehicle.rent.calendar"] .fc .fc-view-harness-active,
  [data-view-id="fleet.root.vehicle.rent.calendar"] .fc .fc-scrollgrid,
  [data-view-id="fleet.root.vehicle.rent.calendar"] .fc .fc-scrollgrid-section,
  [data-view-id="fleet.root.vehicle.rent.calendar"] .fc .fc-daygrid-body,
  [data-view-id="fleet.root.vehicle.rent.calendar"] .fc .fc-daygrid-body-unbalanced,
  [data-view-id="fleet.root.vehicle.rent.calendar"] .fc .fc-scrollgrid-sync-table {
    height: auto !important;
    max-height: none !important;
  }

  [data-view-id="fleet.root.vehicle.rent.calendar"] .fc .fc-scroller,
  [data-view-id="fleet.root.vehicle.rent.calendar"] .fc .fc-scroller-harness,
  [data-view-id="fleet.root.vehicle.rent.calendar"] .fc .fc-scroller-harness-liquid {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  [data-view-id="fleet.root.vehicle.rent.calendar"] .fc .fc-scroller-liquid-absolute {
    position: static !important;
    overflow: visible !important;
    height: auto !important;
  }
}