.calendar-heading, .calendar-schedule-head, .calendar-mini-head, .calendar-room-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.calendar-heading { margin-bottom: 28px; }
.calendar-heading h1 { margin-bottom: 2px; }
.calendar-heading p { margin: 4px 0; }
.calendar-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 18px; }
.calendar-actions button { max-width: 100%; }
.calendar-layout { display: grid; grid-template-columns: minmax(0, 1fr) 292px; gap: 24px; align-items: start; }
.calendar-schedule { min-width: 0; }
.calendar-schedule-head h2 { font-size: 1.65rem; font-weight: 400; text-transform: capitalize; margin: 0; }
.calendar-day-nav { display: flex; gap: 5px; }
.calendar-date-label { display: flex; align-items: center; gap: 18px; margin: 28px 0 20px; }
.calendar-date-label::before, .calendar-date-label::after { content: ''; height: 1px; background: var(--orero-line); flex: 1; }
.calendar-date-label h3 { margin: 0; font-size: .92rem; font-weight: 500; background: #e3ead7; color: #435238; padding: 7px 16px; border-radius: 24px; text-transform: capitalize; }
.calendar-event-list { min-width: 0; }
.calendar-empty { position: relative; isolation: isolate; overflow: hidden; min-height: 410px; margin: 0; padding: 322px 24px 28px; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 8px; text-align: center; border-radius: 18px; background: radial-gradient(ellipse at 50% 40%, #fffdf6a6, #f3f2ea00 72%); }
.calendar-empty::before { content: ''; position: absolute; z-index: -1; inset: 0; background: url('/assets/calendar-sad-khinkali.png') center 0 / 340px 340px no-repeat; opacity: .42; pointer-events: none; }
.calendar-empty-title { color: #4b593e; font-family: Georgia, 'Times New Roman', serif; font-size: 1.4rem; font-weight: 400; }
.calendar-empty-caption { color: #6c7462; font-size: .9rem; line-height: 1.5; }
.calendar-empty[hidden] { display: none; }
#calendar-view .calendar-event-row { width: 100%; background: transparent; color: #394333; border: 0; border-bottom: 1px solid var(--orero-line); border-radius: 0; display: grid; grid-template-columns: 120px 26px minmax(0, 1fr) 18px; gap: 12px; align-items: start; text-align: left; padding: 24px 20px; font-weight: 400; }
#calendar-view .calendar-event-row:hover { background: #f4f6eb; }
#calendar-view .calendar-event-row { cursor: pointer; }
.calendar-event-time { font-size: .84rem; color: var(--orero-muted); padding-top: 3px; }
.calendar-event-symbol { color: #6e8350; font-size: 1.2rem; }
.calendar-event-summary { display: grid; gap: 7px; min-width: 0; overflow-wrap: anywhere; }
.calendar-event-summary strong { font-weight: 500; font-size: 1rem; }
.calendar-event-summary > span { font-size: .81rem; color: var(--orero-muted); }
.calendar-event-arrow { color: var(--orero-muted); font-size: 1.3rem; }

/* The agenda keeps time, event and people in the same columns for every day. */
.calendar-toolbar { display:flex; justify-content:flex-start; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:18px; }
html:root #calendar-view .calendar-actions { margin:0; gap:8px; }
.calendar-view-options { display:inline-flex; padding:4px; gap:2px; border:1px solid var(--orero-line); border-radius:12px; background:var(--orero-paper); }
html:root #calendar-view .calendar-view-options button { border:0; border-radius:8px; background:transparent; color:var(--text-secondary); box-shadow:none; min-height:36px; padding:7px 16px; }
html:root #calendar-view .calendar-view-options button[aria-pressed="true"] { background:var(--accent-soft); color:var(--accent); }
.calendar-view-feedback { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:14px; }
.calendar-view-feedback[hidden] { display:none; }
.calendar-view-feedback p { margin:0; font-size:.85rem; color:var(--text-secondary); }
html:root #calendar-view .calendar-layout { gap:18px; grid-template-columns:minmax(0,1fr) 260px; }
html:root #calendar-view .calendar-schedule { border:1px solid var(--orero-line); border-radius:16px; background:var(--orero-paper); }
html:root #calendar-view .calendar-schedule-head { padding:20px 22px; border:0; border-bottom:1px solid var(--orero-line); border-radius:16px 16px 0 0; background:transparent; flex-direction:row; flex-wrap:wrap; align-items:center; }
.calendar-period-heading { min-width:0; }
html:root #calendar-view #calendar-month-title { font-size:1.5rem; font-weight:400; padding-inline:0; border-inline-width:0; text-align:left; }
.calendar-period-heading p { margin:5px 0 0; }
html:root #calendar-view #calendar-zone { padding:0; border:0; border-radius:0; background:transparent; color:var(--text-secondary); font-size:.72rem; }
html:root #calendar-view .calendar-day-nav button { min-width:34px; min-height:36px; padding:5px 9px; border:0; background:transparent; box-shadow:none; color:var(--text-secondary); }
html:root #calendar-view .calendar-day-nav button:hover { background:var(--theme-hover); }
html:root #calendar-view .calendar-event-list { padding:4px 18px 20px; }
html:root #calendar-view .calendar-date-label { gap:12px; margin:18px 0 14px; }
html:root #calendar-view .calendar-date-label h3 { padding:4px 13px; border:0; font-size:.82rem; font-weight:500; background:var(--accent-soft); color:var(--text-secondary); text-transform:none; }
.calendar-agenda-rows { border:1px solid var(--orero-line); border-radius:12px; background:var(--surface); }
html:root #calendar-view .calendar-event-row { grid-template-columns:110px 10px minmax(0,1fr) auto; gap:14px; align-items:center; padding:16px 14px; min-height:70px; }
html:root #calendar-view .calendar-event-row:first-child { border-radius:11px 11px 0 0; }
html:root #calendar-view .calendar-event-row:last-child { border-bottom:0; border-radius:0 0 11px 11px; }
html:root #calendar-view .calendar-event-row:only-child { border-radius:11px; }
html:root #calendar-view .calendar-event-row.calendar-publication { border-left:0; background:transparent; }
html:root #calendar-view .calendar-event-row:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.calendar-event-row .calendar-event-symbol { width:9px; height:9px; border-radius:2px; background:var(--theme-success); }
.calendar-event-row.calendar-publication .calendar-event-symbol { background:var(--accent); }
html:root #calendar-view .calendar-event-time { display:grid; gap:3px; padding:0; font-size:.82rem; color:var(--text-secondary); white-space:nowrap; }
.calendar-event-time small { font-size:.7rem; color:var(--text-secondary); }
html:root #calendar-view .calendar-event-summary { display:block; line-height:1.5; }
html:root #calendar-view .calendar-event-summary strong { font-size:.94rem; color:var(--accent); font-weight:500; }
html:root #calendar-view .calendar-event-location { margin-left:4px; color:var(--text-secondary); font-size:.83rem; }
.calendar-agenda-people { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; min-width:0; gap:2px; }
.calendar-agenda-people .meeting-avatar-item { position:relative; }
html:root #calendar-view .calendar-agenda-people .meeting-avatar-button { width:30px; min-width:30px; height:30px; min-height:30px; padding:0; border:0; border-radius:50%; background:transparent; box-shadow:none; }
html:root #calendar-view .calendar-agenda-people .person-avatar { width:28px; height:28px; }
html:root #calendar-view .calendar-agenda-all { padding:4px; border:0; background:transparent; box-shadow:none; color:var(--text-secondary); font-size:.75rem; white-space:nowrap; min-height:30px; }
html:root #calendar-view .calendar-agenda-people .meeting-avatar-tooltip { left:auto; right:0; max-width:min(230px,65vw); }
html:root #calendar-view #calendar-status:not(.calendar-empty):not([hidden]) { margin:18px 22px; }
html:root #calendar-view .calendar-day.in-period:not([aria-pressed="true"]) { background:var(--accent-soft); color:var(--accent); }
@media (max-width:1100px) {
  html:root #calendar-view .calendar-layout { grid-template-columns:minmax(0,1fr) 230px; gap:12px; }
  html:root #calendar-view .calendar-event-row { grid-template-columns:96px 9px minmax(0,1fr); gap:10px; }
  .calendar-agenda-people { grid-column:3; justify-content:flex-start; }
}
@media (max-width:760px) {
  html:root #calendar-view .calendar-layout { grid-template-columns:minmax(0,1fr); }
  html:root #calendar-view .calendar-sidebar { grid-row:auto; }
  html:root #calendar-view .calendar-toolbar { gap:10px; }
  html:root #calendar-view .calendar-actions { flex:1 1 100%; }
  html:root #calendar-view .calendar-actions button { flex:1 1 auto; font-size:.82rem; }
  html:root #calendar-view .calendar-schedule-head { padding:16px 14px; gap:12px; }
  html:root #calendar-view .calendar-schedule-head h2 { font-size:1.3rem; }
  html:root #calendar-view .calendar-event-list { padding:2px 10px 14px; }
  html:root #calendar-view .calendar-event-row { grid-template-columns:9px minmax(0,1fr); gap:7px 10px; padding:13px 12px; }
  html:root #calendar-view .calendar-event-time { grid-column:2; grid-row:1; white-space:normal; }
  html:root #calendar-view .calendar-event-symbol { grid-column:1; grid-row:2; align-self:start; margin-top:6px; }
  html:root #calendar-view .calendar-event-summary { grid-column:2; grid-row:2; }
  html:root #calendar-view .calendar-agenda-people { grid-column:2; grid-row:3; }
  html:root #calendar-view .calendar-agenda-people .meeting-avatar-button, html:root #calendar-view .calendar-agenda-all { min-height:40px; }
}
@media (min-width:761px) and (max-width:1000px) {
  html:root #calendar-view .calendar-layout { grid-template-columns:minmax(0,1fr); }
  html:root #calendar-view .calendar-sidebar { grid-row:auto; max-width:320px; }
}
.calendar-sidebar { display: grid; gap: 18px; }
.calendar-mini { padding: 18px; }
.calendar-mini-head { gap: 4px; margin-bottom: 16px; }
.calendar-mini-head h3 { font-size: .86rem; font-weight: 500; margin: 0; text-transform: capitalize; text-align: center; }
.calendar-weekdays, .calendar-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 2px; text-align: center; }
.calendar-weekdays { font-size: .74rem; color: var(--orero-muted); margin-bottom: 10px; }
#calendar-view .calendar-day { border: 0; border-radius: 50%; background: transparent; color: #4f5848; min-width: 0; padding: 0; min-height: 36px; font-size: .83rem; font-weight: 400; position: relative; }
#calendar-view .calendar-day:hover { background: #edf0e3; }
#calendar-view .calendar-day.outside { color: #b3b7aa; }
#calendar-view .calendar-day.today { box-shadow: inset 0 0 0 1px #9aa97e; }
#calendar-view .calendar-day[aria-pressed="true"] { background: #526443; color: #fff; }
.calendar-day.has-events::after { content: ''; position: absolute; width: 3px; height: 3px; border-radius: 50%; bottom: 4px; left: calc(50% - 1.5px); background: currentColor; }
#calendar-room-manager { overflow-y: auto; min-height: 0; padding: 22px 28px; }
.calendar-room-toolbar { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }
#calendar-rooms-status { margin-bottom: 12px; }
.calendar-room-row { padding: 14px 0; border-top: 1px solid var(--orero-line); align-items: start; gap: 6px; }
.calendar-room-row > div { display: grid; gap: 4px; overflow-wrap: anywhere; min-width: 0; }
.calendar-room-row strong { font-size: .88rem; font-weight: 500; }
#calendar-room-manager .calendar-room-row button { padding: 8px 12px; min-height: 44px; flex-shrink: 0; }
#calendar-event-dialog { width: min(1120px, calc(100vw - 40px)); max-width: none; padding: 0; }
#calendar-event-dialog > .employee-dialog-head { padding: 22px 28px; border-bottom: 1px solid var(--orero-line); margin: 0; }
#calendar-event-dialog > .employee-dialog-head, #calendar-room-dialog > .employee-dialog-head { flex-shrink: 0; }
#calendar-event-form, #calendar-event-details, #calendar-room-form { overflow-y: auto; min-height: 0; }
#calendar-event-form > .calendar-form-footer { position: sticky; bottom: 0; background: var(--orero-paper); z-index: 1; }
#calendar-room-form { padding: 22px 28px; }
.calendar-form-grid { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(260px, 1fr); }
.calendar-form-main { padding: 26px 28px; min-width: 0; }
.calendar-form-side { padding: 26px; background: var(--theme-soft); border-left: 1px solid var(--orero-line); min-width: 0; }
.calendar-form-main label, .calendar-form-side label, #calendar-room-form > label { display: grid; gap: 7px; margin-bottom: 18px; font-size: .87rem; font-weight: 500; }
.calendar-form-main input, .calendar-form-main textarea, .calendar-form-side input, #calendar-room-form input { width: 100%; min-width: 0; }
.calendar-form-main textarea { font: inherit; font-weight: 400; padding: 14px; border: 1px solid var(--theme-input-border); border-radius: 9px; resize: vertical; }
#calendar-event-title { font-size: 1.2rem; font-weight: 500; }
.calendar-time-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.calendar-time-fields label { margin-bottom: 4px; }
.calendar-form-zone { margin-bottom: 24px; }
.calendar-people { max-height: 210px; overflow: auto; border: 1px solid var(--orero-line); border-radius: 9px; padding: 7px; }
.calendar-people label.calendar-person { display: flex; gap: 10px; align-items: center; margin: 0; padding: 10px 8px; font-weight: 400; border-radius: 5px; }
.calendar-people label:hover { background: #edf1e4; }
.calendar-people label[hidden] { display: none; }
.calendar-people input, .calendar-room-choice input { width: 18px; height: 18px; margin: 0; flex-shrink: 0; accent-color: var(--theme-accent); }
.calendar-room-choices { max-height: 340px; overflow: auto; margin: 14px 0 24px; }
.calendar-form-side label.calendar-room-choice { display: flex; gap: 11px; align-items: start; padding: 14px 12px; background: var(--orero-paper); border: 1px solid var(--orero-line); border-radius: 9px; margin-bottom: 9px; cursor: pointer; }
.calendar-room-choice > span { display: grid; gap: 4px; min-width: 0; overflow-wrap: anywhere; }
.calendar-room-choice strong { font-size: .91rem; font-weight: 500; }
.calendar-room-choice span span, .calendar-room-choice small { font-size: .77rem; font-weight: 400; }
.calendar-form-side label.calendar-room-choice:has(input:checked) { border-color: var(--theme-accent); background: var(--theme-soft); }
.calendar-form-side label.calendar-room-choice.occupied { background: var(--theme-danger-bg); }
.calendar-free { color: #587342; } .calendar-occupied { color: #a0523b; }
.calendar-form-footer { padding: 20px 28px; border-top: 1px solid var(--orero-line); display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.calendar-form-footer > span { margin-left: auto; font-size: .76rem; }
#calendar-event-feedback { margin: 0 28px 20px; }
#calendar-event-feedback:not([hidden]) { flex-shrink: 0; max-height: 100px; overflow-y: auto; padding-top: 10px; }
#calendar-event-details { padding: 26px 28px; }
.calendar-description { white-space: pre-wrap; overflow-wrap: anywhere; padding: 20px 0; }
.calendar-event-badge { display: inline-block; background: #e9efdc; border-radius: 20px; padding: 5px 14px; font-size: .85rem; }
.calendar-publication-badge { display:inline-flex; align-items:center; vertical-align:middle; margin-left:8px; padding:2px 8px; border:1px solid var(--border); border-radius:99px; background:var(--accent-soft); color:var(--accent); font-size:.65rem; font-weight:700; line-height:1.5; letter-spacing:.07em; }
#calendar-view .calendar-event-row.calendar-publication { border-left:3px solid var(--accent); background:color-mix(in srgb,var(--accent-soft) 65%,var(--surface)); }
.calendar-participant-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 24px; }
.calendar-participant-tags span { border: 1px solid #dce3ce; background: #f5f7ef; border-radius: 18px; padding: 6px 12px; font-size: .85rem; }
#calendar-room-dialog { width: min(560px, calc(100vw - 32px)); }
#calendar-room-form .calendar-form-footer { padding: 20px 0 0; }
.calendar-cancel-confirm { padding: 16px; border: 1px solid #d7beaf; border-radius: 8px; }
.calendar-cancel-confirm button { margin-right: 8px; }
@media (max-width: 1100px) {
  .calendar-layout { grid-template-columns: minmax(0,1fr) 260px; gap: 16px; }
  .calendar-schedule-head { align-items: start; flex-direction: column; }
  #calendar-view .calendar-event-row { grid-template-columns: 95px 20px minmax(0,1fr); gap: 8px; padding: 20px 12px; }
  .calendar-event-arrow { display: none; }
}
@media (max-width: 760px) {
  .calendar-empty { min-height: 345px; padding: 252px 16px 24px; }
  .calendar-empty::before { background-size: 270px 270px; }
  .calendar-empty-title { font-size: 1.25rem; }
  .calendar-heading { flex-direction: column; align-items: stretch; gap: 12px; }
  .calendar-layout, .calendar-form-grid { grid-template-columns: 1fr; }
  .calendar-sidebar { grid-row: 1; grid-template-columns: 1fr; }
  #calendar-view .calendar-day { min-height: 42px; }
  .calendar-actions { gap: 8px; }
  .calendar-actions button { flex: 1 1 240px; min-height: 44px; }
  #calendar-room-manager { padding: 18px; }
  .calendar-schedule-head { flex-direction: row; align-items: center; gap: 8px; }
  .calendar-schedule-head h2 { font-size: 1.2rem; }
  #calendar-event-dialog, #calendar-room-dialog { inset: 8px; width: calc(100vw - 16px); height: calc(100dvh - 16px); max-height: calc(100dvh - 16px); transform: none; border-radius: 10px; }
  #calendar-event-dialog > .employee-dialog-head, .calendar-form-main, .calendar-form-side, #calendar-event-details { padding: 18px; }
  .calendar-form-side { border-left: 0; border-top: 1px solid var(--orero-line); }
  .calendar-form-footer { padding: 18px; }
  .calendar-form-footer > span { margin-left: 0; }
  .calendar-time-fields { grid-template-columns: 1fr; gap: 14px; }
  .calendar-form-main label, .calendar-form-side label { font-size: .9rem; }
  .calendar-dialog button, .calendar-room-dialog button, .calendar-day-nav button { min-height: 42px; }
}
@media (max-width: 420px) {
  #calendar-room-dialog > .employee-dialog-head { flex-direction: column; align-items: stretch; gap: 10px; }
  #calendar-room-title { order: 1; }
  #calendar-room-dialog .window-head-actions { align-self: flex-end; }
  html:root[data-theme="macos"] #calendar-room-dialog .window-head-actions { align-self: flex-start; }
}
.calendar-period-trigger { text-transform:capitalize; }
html:root button.calendar-period-trigger { width:auto; min-width:0; padding:7px 10px; border:1px solid transparent; background:transparent; color:var(--text-primary); font:inherit; text-transform:capitalize; box-shadow:none; }
html:root button.calendar-period-trigger:hover { background:var(--theme-soft); border-color:var(--border); }
