/* Core layout inspired by existing blue style */
.sc-cal .sc-button {
  appearance:none;
  min-height:40px;
  padding:8px 14px;
  background:#414dd5;
  color:#fff;
  border:none;
  border-radius:20px;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  font:600 14px/1.2 system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  letter-spacing:0;
  white-space:nowrap;
  text-align:center;
}
.sc-cal .sc-button:hover { background:#066aab; }
.sc-cal { border:1px solid #ddd; border-radius:8px; background:#fff; box-shadow:0 1px 2px rgba(0,0,0,.04); overflow:hidden; position:relative; isolation:isolate; z-index:0; }
.sc-cal-page-header {
  padding:18px 18px 8px;
  background:#fff;
}
.sc-cal-page-header h1 {
  margin:0;
  color:#1f2933;
  font-size:clamp(32px, 4vw, 56px);
  line-height:1.05;
  font-weight:500;
  letter-spacing:0;
}
.sc-cal-page-header p {
  margin:6px 0 0;
  color:#51606d;
  font-size:16px;
  line-height:1.4;
  max-width:760px;
}
.sc-cal-topbar { display:grid; grid-template-columns:auto minmax(160px, 1fr) auto; gap:10px; align-items:center; padding:12px 14px; border-bottom:1px solid #e5e5e5; background:#f7f7fb; }
.sc-cal-left, .sc-cal-right { display:flex; gap:8px; align-items:center; min-width:0; }
.sc-cal-center { display:flex; align-items:center; justify-content:center; min-width:0; }
.sc-cal-title { font-weight:700; font-size:16px; line-height:1.25; text-align:center; overflow-wrap:anywhere; }
.sc-cal-tabs { display:flex; flex-wrap:wrap; gap:8px; padding:8px 10px; border-bottom:1px solid #eee; }
.sc-tab.active { box-shadow:inset 0 -2px 0 #414dd5; }
#sc-cal-prev,
#sc-cal-next,
#sc-cal-refresh,
#sc-cal-settings {
  width:40px;
  min-width:40px;
  padding:0;
  border-radius:999px;
}

.sc-cal-grid { overflow:auto; height:600px; background:#fff; position:relative; }
.sc-week-grid { display:grid; grid-template-columns: 60px repeat(7, 1fr); border-top:1px solid #eee; }
.sc-week-header { position:sticky; top:0; background:#fff; z-index:5; display:grid; grid-template-columns:60px repeat(7, 1fr); }
.sc-week-header div { padding:10px 8px; border-bottom:1px solid #eee; border-right:1px solid #f2f2f2; font-weight:600; font-size:12px; text-align:center; background:#fff; }
.sc-week-header .sc-weekday,
.sc-week-header .sc-weekdate {
  display:block;
  white-space:nowrap;
  line-height:1.25;
}
.sc-week-header .sc-weekday { text-transform:capitalize; }
.sc-week-header .sc-weekdate { margin-top:3px; }
.sc-time-col { background:#fafafa; border-right:1px solid #eee; }
.sc-time-slot { height:40px; border-bottom:1px dashed #f0f0f0; font-size:10px; color:#777; display:flex; align-items:flex-start; justify-content:flex-end; padding-right:6px; }
.sc-day-col { position:relative; border-right:1px solid #f7f7f7; }
.sc-slot-cell { height:40px; border-bottom:1px solid #fafafa; cursor:pointer; }
.sc-slot-cell:hover { background:#f7fbff; }

.sc-event { position:absolute; left:3px; right:3px; background:#414dd5; color:#fff; border-radius:6px; padding:4px 6px; font-size:11px; box-shadow:0 2px 4px rgba(0,0,0,.1); cursor:grab; user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; z-index:2; }
.sc-event.sc-event--ai { background:#f57c00; }
.sc-event:active { cursor:grabbing; }
.sc-event.dragging { opacity:.85; pointer-events:none; }
.sc-ghost { position:absolute; background:rgba(65,77,213,.18); border:2px dashed #414dd5; border-radius:6px; z-index:4; pointer-events:none; box-shadow:0 2px 6px rgba(0,0,0,.12); }
.sc-event .sc-resize-handle { position:absolute; left:0; right:0; bottom:0; height:6px; cursor:ns-resize; background:rgba(255,255,255,.6); border-bottom-left-radius:6px; border-bottom-right-radius:6px; }
.sc-event.resizing { opacity:.9; }
.sc-overflow-pill { position:absolute; right:6px; background:#fff; color:#414dd5; border:1px solid #414dd5; border-radius:10px; padding:0 6px; font-size:10px; height:16px; line-height:16px; cursor:pointer; z-index:3; box-shadow:0 1px 3px rgba(0,0,0,.1); }
.sc-overflow-popup { position:absolute; background:#fff; border:1px solid #ddd; border-radius:8px; padding:8px; box-shadow:0 10px 30px rgba(0,0,0,.2); z-index:6; min-width:240px; }
.sc-overflow-popup h4 { margin:0 0 6px 0; font-size:12px; color:#333; }
.sc-overflow-popup .sc-overflow-item { padding:6px; border-radius:6px; font-size:12px; cursor:pointer; display:flex; justify-content:space-between; }
.sc-overflow-popup .sc-overflow-item:hover { background:#f7f7fb; }

/* Modal */
.sc-cal-modal { position:fixed; inset:0; background:rgba(0,0,0,.35); display:flex; align-items:center; justify-content:center; z-index:10000; }
.sc-cal-modal[hidden] { display:none; }
.sc-cal-modal-content { background:#fff; width:620px; max-width:95vw; border-radius:10px; overflow:hidden; box-shadow:0 10px 30px rgba(0,0,0,.2); z-index:10001; }
.sc-cal-modal-header { display:flex; justify-content:space-between; align-items:center; padding:12px 16px; background:#f7f7fb; border-bottom:1px solid #eee; }
.sc-cal-modal-title { font-weight:600; }
.sc-cal-modal-body { padding:16px; display:flex; flex-direction:column; gap:12px; }
.sc-cal-modal-body label { display:flex; flex-direction:column; font-size:12px; gap:6px; }
.sc-row { display:flex; gap:12px; }
.sc-fieldset { border:1px solid #eee; border-radius:8px; padding:10px; }
.sc-cal-modal-footer { padding:12px 16px; display:flex; gap:10px; justify-content:flex-end; border-top:1px solid #eee; }
.sc-cal-modal-close { background:transparent; border:none; font-size:20px; cursor:pointer; }

/* Month view */
.sc-month-grid { padding:8px; }
.sc-month-header { display:grid; grid-template-columns: repeat(7, 1fr); gap:6px; margin-bottom:6px; }
.sc-month-header > div { text-align:center; font-weight:600; color:#555; }
.sc-month-row { display:grid; grid-template-columns: repeat(7, 1fr); gap:6px; margin-bottom:6px; }
.sc-month-cell { border:1px solid #eee; border-radius:8px; min-height:120px; background:#fff; display:flex; flex-direction:column; }
.sc-month-cell.sc-other { background:#fafafa; color:#999; }
.sc-month-cell-head { padding:6px 8px; font-size:12px; border-bottom:1px solid #f2f2f2; }
.sc-month-cell-body { padding:6px; display:flex; flex-direction:column; gap:4px; }
.sc-chip { background:#414dd5; color:#fff; border-radius:12px; padding:3px 8px; font-size:11px; cursor:grab; }
.sc-chip.sc-chip--ai { background:#f57c00; }
.sc-overflow-item--ai { color:#f57c00; }
.sc-chip:active { cursor:grabbing; }

@media (max-width: 760px) {
  .sc-cal-page-header {
    padding:16px 14px 8px;
  }
  .sc-cal-page-header h1 {
    font-size:34px;
  }
  .sc-cal-page-header p {
    font-size:14px;
  }
  .sc-cal-topbar {
    grid-template-columns:1fr auto;
    grid-template-areas:
      "nav actions"
      "title title";
    align-items:center;
    padding:10px;
  }
  .sc-cal-left { grid-area:nav; justify-content:flex-start; flex-wrap:wrap; }
  .sc-cal-right { grid-area:actions; justify-content:flex-end; flex-wrap:wrap; }
  .sc-cal-center { grid-area:title; justify-content:flex-start; padding-top:2px; }
  .sc-cal-title { text-align:left; font-size:15px; }
  .sc-cal .sc-button { min-height:38px; padding:7px 12px; font-size:13px; }
  #sc-cal-prev,
  #sc-cal-next,
  #sc-cal-refresh,
  #sc-cal-settings {
    width:38px;
    min-width:38px;
  }
}

@media (max-width: 520px) {
  .sc-cal-topbar {
    grid-template-columns:1fr;
    grid-template-areas:
      "title"
      "nav"
      "actions";
  }
  .sc-cal-left,
  .sc-cal-right {
    justify-content:flex-start;
  }
  .sc-cal-right #sc-cal-new {
    flex:1 1 auto;
    max-width:180px;
  }
  .sc-cal-tabs .sc-button {
    flex:0 0 auto;
  }
  .sc-week-grid,
  .sc-week-header {
    grid-template-columns:54px repeat(7, minmax(78px, 1fr));
  }
}
