.scheduler-page {
  height: calc(100vh - 76px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.scheduler-header {
  flex: none;
}

.scheduler-header-controls {
  display: flex;
  align-items: flex-end;
  gap: 10px;
}

.scheduler-ai-button {
  min-height: 48px;
  border-color: #6f5bea;
  color: #c8c0ff;
}

.scheduler-date-picker {
  display: grid;
  gap: 4px;
  color: #82919f;
  font-size: 9px;
}

.scheduler-date-picker input {
  width: 165px;
  height: 48px;
  padding: 0 11px;
  border: 1px solid #35434f;
  border-radius: 8px;
  background: #17212a;
  color: #e3eaf0;
}

.scheduler-account-picker {
  position: relative;
  min-width: 250px;
}

#scheduler-account-toggle {
  width: 100%;
  height: auto;
  display: grid;
  gap: 3px;
  padding: 9px 12px;
  min-height: 48px;
  text-align: left;
}

#scheduler-account-toggle span {
  color: #82919f;
  font-size: 9px;
}

#scheduler-account-toggle strong {
  color: #e3eaf0;
  font-size: 11px;
}

.scheduler-account-menu {
  position: absolute;
  z-index: 40;
  top: calc(100% + 6px);
  right: 0;
  width: min(340px, 90vw);
  max-height: 270px;
  overflow: auto;
  padding: 7px;
  border: 1px solid #3a4854;
  border-radius: 9px;
  background: #172029;
  box-shadow: 0 18px 45px #0009;
}

.scheduler-account-menu label {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 9px;
  border-radius: 6px;
  color: #c4d0db;
  font-size: 11px;
  cursor: pointer;
}

.scheduler-account-menu label:hover {
  background: #222e38;
}

.scheduler-toolbar {
  flex: none;
}

.scheduler-layout {
  min-height: 0;
  flex: 1;
  overflow: hidden;
}

.scheduler-sources {
  height: 100%;
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 0;
}

.scheduler-sources > header,
.scheduler-source-filters {
  flex: none;
}

.scheduler-source-filters {
  display: grid;
  gap: 7px;
  padding: 10px;
  border-bottom: 1px solid #293641;
}

.scheduler-source-filters input,
.scheduler-source-filters select {
  width: 100%;
  height: 35px;
  margin: 0;
  padding: 0 10px;
  border: 1px solid #34414d;
  border-radius: 7px;
  background: #0d141a;
  color: #dce5ed;
  font-size: 11px;
}

#scheduler-source-list {
  min-height: 0;
  flex: 1;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.scheduler-source-heading,
.scheduler-source-details {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 7px;
}

.scheduler-source-heading strong,
.scheduler-source-details small {
  min-width: 0;
}

.scheduler-source-heading strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.scheduler-source.is-scheduled {
  border-color: #296749;
  background: #14271f;
}

.scheduler-source-mark {
  flex: none;
  padding: 3px 5px;
  border-radius: 99px;
  background: #1d4934;
  color: #72dca0;
  font-size: 7px;
  font-weight: 800;
  text-transform: uppercase;
}

.scheduler-source-reference {
  flex: none;
  color: #a99fff !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 9px;
  font-weight: 700;
}

.scheduler-layout main {
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  overscroll-behavior: contain;
}

.scheduler-month-title {
  flex: none;
  margin-bottom: 7px;
  padding: 8px 12px;
  border: 1px solid #2c3944;
  border-radius: 7px;
  background: #111820;
  color: #edf3f8;
  font-size: 17px;
  font-weight: 800;
  text-align: center;
}

.scheduler-calendar-viewport {
  min-height: 0;
  flex: 1;
  overflow: auto;
  scrollbar-gutter: stable;
  overscroll-behavior: contain;
}

.scheduler-weekdays {
  position: sticky;
  z-index: 3;
  top: 0;
  display: grid;
  grid-template-columns: repeat(7, minmax(105px, 1fr));
  gap: 7px;
  margin-bottom: 7px;
}

.scheduler-weekdays > span {
  padding: 7px 9px;
  border-radius: 6px;
  background: #17212a;
  color: #8fa0af;
  font-size: 9px;
  font-weight: 700;
  text-align: center;
  text-transform: uppercase;
}

.scheduler-calendar {
  grid-template-columns: repeat(7, minmax(105px, 1fr));
  gap: 7px;
  align-content: start;
}

.scheduler-day {
  min-height: 115px;
}

.scheduler-day.outside-month {
  opacity: 0.45;
  background: #0d141a;
}

.scheduler-day .scheduler-drop-hint {
  padding: 7px;
}

.scheduler-ai-slot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 5px;
  padding: 6px 7px;
  border: 1px dashed #6958c9;
  border-radius: 6px;
  background: #211d3a;
  color: #bdb4ff;
  font-size: 8px;
}

.scheduler-ai-slot.drag-over {
  border-style: solid;
  border-color: #a392ff;
  background: #30275a;
  box-shadow: 0 0 0 2px #806cff30;
}

.scheduler-ai-slot strong {
  font-size: 9px;
}

.timing-dialog {
  width: min(650px, 100%);
}

.timing-step,
.timing-review,
.timing-history {
  padding: 18px;
}

.timing-step {
  display: grid;
  gap: 14px;
}

.timing-step .timing-next,
.timing-step .timing-generate {
  justify-self: end;
}

.timing-platform-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 10px;
}

.timing-platform-row .timing-next {
  height: 36px;
}

.timing-error {
  margin: 0;
  color: #ff9e99;
  font-size: 11px;
}

.timing-review {
  display: grid;
  gap: 14px;
}

.timing-review .timing-week {
  display: grid;
  gap: 7px;
}

.timing-review .timing-weekday {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding: 8px 10px;
  border: 1px solid #2d3a46;
  border-radius: 8px;
  background: #101820;
}

.timing-review .timing-weekday > span {
  color: #a99dff;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.timing-review .timing-weekday > div {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.timing-review .timing-weekday strong {
  padding: 6px 9px;
  border: 1px solid #55499d;
  border-radius: 7px;
  background: #211d3a;
  color: #d5cfff;
  font-size: 11px;
}

.timing-review .timing-weekday em {
  color: #ff9e99;
  font-size: 10px;
  font-style: normal;
}

.timing-review p {
  margin: 0;
  color: #9aa8b5;
  font-size: 12px;
  line-height: 1.6;
}

.timing-review small {
  color: #7f909f;
}

.timing-slots,
.timing-history-times {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.timing-slots strong,
.timing-history-times span {
  padding: 7px 10px;
  border: 1px solid #55499d;
  border-radius: 7px;
  background: #211d3a;
  color: #c9c2ff;
  font-size: 11px;
}

.timing-history {
  border-top: 1px solid #2b3741;
}

.timing-history h3 {
  margin: 0 0 10px;
  font-size: 12px;
}

.timing-history article {
  display: block;
  padding: 14px;
  border: 1px solid #2c3944;
  border-radius: 10px;
  background: #10171e;
}

.timing-history article + article {
  margin-top: 10px;
}

.timing-history-card > header,
.timing-history-card > footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.timing-history-card > header {
  padding-bottom: 11px;
  border-bottom: 1px solid #27333d;
}

.timing-history-card > footer {
  padding-top: 11px;
  border-top: 1px solid #27333d;
  color: #70808f;
  font-size: 9px;
}

.timing-history-card .timing-week {
  display: block;
  margin: 10px 0;
}

.timing-table-scroll {
  width: 100%;
  overflow-x: auto;
  border: 1px solid #2c3944;
  border-radius: 8px;
}

.timing-table {
  width: 100%;
  min-width: 520px;
  border-collapse: collapse;
  table-layout: fixed;
}

.timing-table th,
.timing-table td {
  padding: 8px 10px;
  border-right: 1px solid #27333d;
  border-bottom: 1px solid #27333d;
  text-align: left;
  white-space: nowrap;
}

.timing-table tr > :last-child {
  border-right: 0;
}

.timing-table tbody tr:last-child > * {
  border-bottom: 0;
}

.timing-table thead th {
  background: #151e27;
  color: #718292;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .55px;
  text-transform: uppercase;
}

.timing-table thead th:first-child,
.timing-table tbody th {
  width: 105px;
}

.timing-table tbody th {
  background: #131b23;
  color: #c9d3dd;
  font-size: 10px;
  font-weight: 700;
}

.timing-table tbody td {
  background: #0f161d;
}

.timing-table tbody tr:hover th,
.timing-table tbody tr:hover td {
  background: #171f2a;
}

.timing-table td strong {
  color: #c8beff;
  font-size: 10px;
}

.timing-table td em {
  color: #61717f;
  font-size: 10px;
  font-style: normal;
}

.timing-history-status {
  padding: 4px 7px;
  border-radius: 999px;
  background: #40351d;
  color: #e5bd64;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .5px;
}

.timing-history-status.approved {
  background: #173b2a;
  color: #73d59c;
}

.timing-history-status.rejected {
  background: #432629;
  color: #ffaaa5;
}

.timing-history article strong,
.timing-history article small {
  display: block;
}

.timing-history article small {
  margin-top: 4px;
  color: #7f909f;
  font-size: 9px;
}

.timing-approved {
  color: #6ed99b;
  font-size: 10px;
  font-weight: 800;
}

.timing-history-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
}

.timing-history-actions .button {
  padding: 7px 10px;
  font-size: 10px;
}

@media (max-width: 560px) {
  .timing-history-card > footer {
    align-items: flex-start;
    flex-direction: column;
  }
}

.recurrence-weekdays > div {
  display: grid;
  grid-template-columns: repeat(7, minmax(70px, 1fr));
  gap: 7px;
}

.recurrence-weekdays > div > label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 38px;
  padding: 7px 9px;
  border: 1px solid #303d48;
  border-radius: 7px;
  color: #aebbc7;
  font-size: 10px;
  cursor: pointer;
}

.recurrence-weekdays input {
  width: auto;
  height: auto;
  margin: 0;
}

@media (max-width: 900px) {
  .scheduler-page {
    height: auto;
    min-height: calc(100vh - 76px);
    overflow: visible;
  }

  .scheduler-layout {
    overflow: visible;
  }

  .scheduler-sources {
    height: 420px;
    position: static;
  }

  .scheduler-header,
  .scheduler-header-controls {
    align-items: stretch;
    flex-direction: column;
  }

  .scheduler-date-picker input,
  .scheduler-account-picker {
    width: 100%;
  }

  .scheduler-weekdays,
  .scheduler-calendar {
    min-width: 780px;
    grid-template-columns: repeat(7, minmax(105px, 1fr));
  }

  .recurrence-weekdays > div {
    grid-template-columns: repeat(4, minmax(70px, 1fr));
  }
}

@media (max-width: 560px) {
  .recurrence-weekdays > div {
    grid-template-columns: repeat(2, minmax(80px, 1fr));
  }
}
.scheduler-datetime-control{position:relative;cursor:pointer}.scheduler-datetime-control>input{width:100%;padding-right:44px;cursor:pointer;color-scheme:dark}.scheduler-datetime-control>input::-webkit-calendar-picker-indicator{width:34px;margin:0;opacity:0;cursor:pointer}.scheduler-datetime-picker{position:absolute;z-index:2;right:4px;top:50%;width:34px;height:28px;display:grid;place-items:center;transform:translateY(-50%);border:0;border-left:1px solid #303d48;background:#0e151b;color:#9f92ff;cursor:pointer}.scheduler-datetime-picker:hover{color:#d1caff;background:#171f2a}.scheduler-datetime-picker svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.scheduler-datetime-control:focus-within .scheduler-datetime-picker{color:#c4baff}