.personal-calendar-page { --fc-border-color:#dce3e0; --fc-today-bg-color:#f0f8f6; --fc-page-bg-color:#fff; --fc-now-indicator-color:#c73532; }
.calendar-content { padding:18px 24px 12px; max-width:1600px; margin:auto; height:calc(100dvh - 76px - var(--nav-height) - env(safe-area-inset-bottom)); min-height:600px; display:flex; flex-direction:column; }
.calendar-toolbar { display:grid; gap:10px; margin-bottom:8px; }
.calendar-toolbar-top,.calendar-toolbar-bottom,.calendar-date-navigation { display:flex; align-items:center; gap:8px; min-width:0; }
.calendar-toolbar-top h2 { flex:1; margin:0 12px; font-size:22px; font-weight:700; line-height:1.25; overflow-wrap:anywhere; }
.calendar-icon-button { display:inline-grid; place-items:center; width:40px; height:40px; padding:8px; flex:none; background:transparent; border:0; border-radius:6px; color:var(--navigation-color); cursor:pointer; }
.calendar-icon-button svg { width:24px; height:24px; }
.calendar-icon-button:hover { background:#e9f2ef; }
.calendar-today,.calendar-secondary { min-height:40px; padding:8px 14px; border:1px solid #c5d2cd; border-radius:6px; background:#fff; color:#35463f; font:inherit; font-weight:650; cursor:pointer; }
.calendar-primary { min-height:42px; padding:10px 18px; border:0; border-radius:6px; background:var(--navigation-color); color:var(--navigation-foreground); display:inline-flex; align-items:center; justify-content:center; gap:8px; font:inherit; font-weight:700; cursor:pointer; }
.calendar-primary svg { width:21px; height:21px; }
.calendar-view-switch { display:flex; gap:2px; padding:3px; border:1px solid #cdd8d3; border-radius:6px; margin-left:auto; }
.calendar-view-switch button { min-height:34px; padding:6px 16px; border:0; border-radius:4px; background:transparent; color:#44554c; font:inherit; cursor:pointer; }
.calendar-view-switch button[aria-pressed="true"] { background:var(--navigation-color); color:var(--navigation-foreground); font-weight:700; }
#calendar-date { border:1px solid #cdd8d3; border-radius:5px; padding:7px 9px; min-height:40px; width:150px; max-width:100%; color:#35463f; background:#fff; font:inherit; }
#calendar-timezone-dialog { width:460px; max-width:calc(100vw - 24px); }
.calendar-message { min-height:18px; margin:6px 0; font-size:13px; line-height:1.4; color:#69736d; overflow-wrap:anywhere; }
.calendar-message[data-error="true"] { color:#b32b2b; }
.calendar-scroll { overflow-x:auto; background:#fff; flex:1; min-height:400px; }
.calendar-board { height:100%; }
.personal-calendar-page .fc { height:100%; font-family:Arial,sans-serif; font-size:14px; }
.personal-calendar-page .fc a { color:inherit; text-decoration:none; }
.personal-calendar-page .fc .fc-col-header-cell-cushion { padding:9px 2px; font-size:12px; font-weight:600; text-transform:uppercase; }
.personal-calendar-page .fc .fc-daygrid-day-number { display:grid; place-items:center; min-width:27px; height:27px; padding:3px; margin:3px; font-size:13px; }
.personal-calendar-page .fc .fc-day-today .fc-daygrid-day-number { background:var(--navigation-color); color:var(--navigation-foreground); border-radius:50%; }
.personal-calendar-page .fc .fc-daygrid-event { border-radius:4px; padding:2px 4px; font-size:12px; cursor:pointer; }
.personal-calendar-page .fc .fc-event-title { overflow:hidden; text-overflow:ellipsis; }
.personal-calendar-page .fc .fc-timegrid-event { border-radius:4px; cursor:pointer; padding:2px; }
.personal-calendar-page .fc .fc-timegrid-slot { height:28px; }
.personal-calendar-page .fc .fc-timegrid-axis-cushion,.personal-calendar-page .fc .fc-timegrid-slot-label-cushion { font-size:11px; }
.personal-calendar-page .fc .fc-highlight { background:#b8ddd4; }
.personal-calendar-page .fc .fc-more-link { font-size:11px; font-weight:700; }
.calendar-dialog { width:min(560px,calc(100% - 24px)); max-height:90dvh; overflow:auto; padding:24px; border:0; border-radius:8px; background:#fff; color:#35463f; box-shadow:0 14px 60px #0004; }
.calendar-dialog::backdrop { background:#0007; }
.calendar-dialog form { display:grid; gap:14px; }
.calendar-dialog h2 { font-size:21px; margin:0; overflow-wrap:anywhere; }
.calendar-dialog-header { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.calendar-field { display:grid; gap:6px; min-width:0; font-size:14px; font-weight:600; }
.calendar-field input,.calendar-field textarea,.calendar-field select { width:100%; min-width:0; padding:10px; min-height:42px; border:1px solid #c5d2cd; border-radius:5px; font:inherit; font-weight:400; color:#25392f; background:#fff; }
.company-calendar-credentials { border:0; border-top:1px solid #cedad7; margin:0; padding:18px 0; min-width:0; }
.company-calendar-credentials legend { font-weight:600; padding-right:8px; }
.company-calendar-credential-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(210px,100%),1fr)); gap:14px; }
.company-calendar-credential-grid label { display:flex; align-items:center; gap:10px; min-width:0; overflow-wrap:anywhere; }
.company-calendar-credential-grid input { width:20px; height:20px; flex:none; accent-color:var(--navigation-color); }
.calendar-field textarea { resize:vertical; }
.calendar-check { display:flex; align-items:center; gap:10px; font-size:14px; }
.calendar-check input { width:20px; height:20px; margin:0; accent-color:var(--navigation-color); }
.calendar-form-dates { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.calendar-colors { padding:0; margin:0; border:0; min-width:0; }
.calendar-colors legend { font-size:14px; font-weight:600; margin-bottom:8px; }
#calendar-event-colors { display:flex; gap:12px; flex-wrap:wrap; }
.calendar-color { position:relative; display:grid; place-items:center; width:30px; height:30px; cursor:pointer; }
.calendar-color input { position:absolute; inset:0; margin:0; opacity:0; width:100%; height:100%; cursor:pointer; }
.calendar-color span { width:24px; height:24px; border-radius:50%; background:var(--event-color); border:1px solid #9ca3af; box-sizing:border-box; }
#calendar-event-form:has(#calendar-event-outline:checked) .calendar-color span {background:#fff;border:3px solid var(--event-color);box-shadow:0 0 0 1px #9ca3af;}
#personal-calendar .fc-h-event,#personal-calendar .fc-v-event {border-width:2px;}
.calendar-color input:checked + span { outline:2px solid #233e30; outline-offset:3px; }
.calendar-color input:focus-visible + span { outline:3px solid #2864cc; outline-offset:3px; }
.calendar-dialog-actions { display:flex; justify-content:flex-end; align-items:center; gap:10px; padding-top:8px; position:sticky; bottom:-24px; padding-bottom:12px; background:#fff; }
#calendar-event-delete { margin-right:auto; }
.calendar-icon-button.calendar-danger { color:#b52f2b; }
.calendar-primary.calendar-danger { background:#b52f2b; color:white; }
.calendar-delete-dialog { width:min(440px,calc(100% - 24px)); }
#calendar-delete-name { font-weight:700; overflow-wrap:anywhere; }
.calendar-dialog button:disabled,.calendar-toolbar button:disabled { opacity:.5; cursor:wait; }
.calendar-dialog [hidden] { display:none; }
.personal-calendar-page button:focus-visible,.calendar-dialog button:focus-visible { outline:3px solid #2864cc; outline-offset:2px; }
.calendar-sidebar { position:fixed; inset:0 auto 0 0; margin:0; width:min(360px,90vw); height:100dvh; max-height:100dvh; border-radius:0; padding:20px; overscroll-behavior:contain; background:var(--navigation-color); color:var(--navigation-foreground); }
.calendar-sidebar h3 { font-size:14px; margin:22px 0 8px; color:inherit; }
.calendar-sidebar .calendar-dialog-header { padding-bottom:14px; border-bottom:1px solid color-mix(in srgb,var(--navigation-foreground) 35%,transparent); margin-bottom:12px; }
.calendar-sidebar .calendar-icon-button,.calendar-sidebar .calendar-message { color:inherit; }
.calendar-sidebar .calendar-icon-button:hover { background:color-mix(in srgb,var(--navigation-foreground) 15%,transparent); }
.calendar-sidebar .calendar-message[data-error="true"]:not(:empty) { color:#9e201c; background:#fff1ef; border-radius:4px; padding:8px; }
.calendar-sidebar :is(button,input,summary):focus-visible { outline:2px solid var(--navigation-foreground); outline-offset:3px; }
.calendar-source { display:flex; align-items:center; gap:12px; padding:10px 0; min-height:44px; font-size:14px; line-height:1.4; cursor:pointer; }
.calendar-source input { width:20px; height:20px; margin:0; flex:none; cursor:pointer; }
.calendar-source span { min-width:0; overflow-wrap:anywhere; }
.calendar-source:has(input:disabled) { opacity:.6; }
#calendar-colleagues { margin-top:12px; }
#calendar-colleagues details { border-bottom:1px solid color-mix(in srgb,var(--navigation-foreground) 25%,transparent); }
#calendar-colleagues summary { padding:12px 8px; margin:4px 0; border:1px solid transparent; border-radius:4px; cursor:pointer; font-size:14px; line-height:1.5; overflow-wrap:anywhere; }
#calendar-colleagues details[data-following="true"] > summary { background:color-mix(in srgb,var(--navigation-color) 24%,#fff); color:#17201f; border-color:color-mix(in srgb,var(--navigation-foreground) 40%,transparent); }
#calendar-colleagues .calendar-source { padding-left:18px; }
.calendar-sources-footer { display:flex; align-items:center; gap:6px; padding:12px 0 max(12px,env(safe-area-inset-bottom)); }
.calendar-sources-footer p { flex:1; }
.calendar-readonly { display:flex; align-items:center; gap:8px; color:#68756e; font-size:13px; margin:16px 0; }
.calendar-readonly svg { width:17px; height:17px; }
.calendar-shift-details { display:grid; grid-template-columns:1fr; gap:6px; margin:0; }
.calendar-shift-details dt { font-size:12px; color:#68756e; margin-top:10px; }
.calendar-shift-details dd { margin:0; font-size:15px; overflow-wrap:anywhere; }
.personal-calendar-page .calendar-shift .fc-event-time { display:none; }
@media(max-width:700px) {
 .calendar-content { padding:12px 8px 10px; min-height:640px; }
 .calendar-toolbar-top h2 { font-size:18px; margin:0 4px; }
 .calendar-date-navigation { gap:0; }
 .calendar-today { padding:8px 10px; }
 .calendar-toolbar-bottom { flex-wrap:wrap; gap:6px; }
 #calendar-date { width:132px; padding:7px 6px; font-size:12px; }
 #calendar-timezone-open { width:34px; padding:5px; }
 .calendar-view-switch button { padding:6px 10px; }
 .calendar-board[data-view="timeGridWeek"] { min-width:700px; }
 .calendar-scroll { min-height:380px; }
 .personal-calendar-page .fc .fc-daygrid-event { padding:1px 2px; font-size:10px; }
 .personal-calendar-page .fc .fc-daygrid-event .fc-event-time { display:none; }
 .personal-calendar-page .fc .fc-col-header-cell-cushion { font-size:10px; }
 .calendar-dialog { padding:18px; }
 .calendar-dialog-actions { bottom:-18px; }
}
@media(max-width:520px) {
 .calendar-content { height:calc(100dvh - 66px - var(--nav-height) - env(safe-area-inset-bottom)); }
}
