/* Shared date-selection popups. Calendar pages and the clock dialog are unchanged. */
body {
    --dp-paper:#fff;
    --dp-soft:#f2f7fc;
    --dp-line:#d6e5f0;
    --dp-ink:#203e59;
    --dp-muted:#627c92;
    --dp-range:#e0f3fa;
    --dp-tile:#f5f9fd;
}
body.sky-dark {
    --dp-paper:#122b40;
    --dp-soft:#17354d;
    --dp-line:#34566f;
    --dp-ink:#e4f2fc;
    --dp-muted:#a7c2d7;
    --dp-range:#20516b;
    --dp-tile:#19394f;
}
html body .flatpickr-calendar:not(.sky-clock-calendar),
html body .datepicker-dropdown,
html body .daterangepicker {
    padding:10px;
    border:1px solid var(--dp-line)!important;
    border-radius:23px!important;
    background:var(--dp-paper)!important;
    color:var(--dp-ink);
    box-shadow:0 26px 65px #0c2f5640,0 5px 16px #12476a12,inset 0 1px 0 #ffffff80!important;
}
/* Preserve Flatpickr's measured multi-month width and seven equal columns. */
html body .flatpickr-calendar:not(.sky-clock-calendar):not(.multiMonth){width:352px!important;max-width:calc(100vw - 20px);box-sizing:border-box}
html body .flatpickr-calendar:not(.sky-clock-calendar).multiMonth{box-sizing:content-box!important}
html body .flatpickr-calendar:not(.sky-clock-calendar):not(.multiMonth) :is(.flatpickr-innerContainer,.flatpickr-rContainer,.flatpickr-weekdays,.flatpickr-days,.dayContainer){width:100%!important;min-width:0!important;max-width:100%!important}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-months,
html body .datepicker-picker .datepicker-header {
    position:relative;
    isolation:isolate;
    padding:16px 3px;
    border:1px solid #367da2;
    border-radius:17px;
    background:radial-gradient(ellipse at 100% 0,#36c6d466,transparent 62%),linear-gradient(115deg,#102f55,#16668e)!important;
    box-shadow:0 7px 18px #12557a20,inset 0 1px 0 #bdefff30;
    color:#fff!important;
}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-months::before,
html body .datepicker-picker .datepicker-header::before {
    content:"";position:absolute;z-index:-1;inset:0;border-radius:inherit;pointer-events:none;
    background:repeating-linear-gradient(135deg,transparent 0 30px,#c3f4ff09 31px 32px),radial-gradient(circle at 88% 110%,transparent 34px,#a9efff1a 35px 36px,transparent 37px 53px,#a9efff12 54px 55px,transparent 56px);
}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-month {height:36px;background:transparent!important;color:#fff!important;fill:#fff!important}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-current-month {padding:7px 0 0;font-size:15px;font-weight:750;color:#fff!important}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-current-month :is(select,input,.cur-month){min-height:0!important;height:26px!important;padding:0 3px!important;margin:0;border:0!important;border-radius:5px;background:transparent!important;box-shadow:none!important;color:#fff!important;font:inherit!important;opacity:1}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-current-month select{width:auto!important;appearance:auto!important;cursor:pointer}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-current-month option{background:var(--dp-paper)!important;color:var(--dp-ink)!important}
html body .flatpickr-calendar:not(.sky-clock-calendar) .numInputWrapper{border-radius:6px}
html body .flatpickr-calendar:not(.sky-clock-calendar) .numInputWrapper:hover{background:#b9eaff20}
html body .flatpickr-calendar:not(.sky-clock-calendar) .numInputWrapper span{border-color:#b7defa30}
html body .flatpickr-calendar:not(.sky-clock-calendar) .numInputWrapper .arrowUp:after{border-bottom-color:#fff}
html body .flatpickr-calendar:not(.sky-clock-calendar) .numInputWrapper .arrowDown:after{border-top-color:#fff}
html body .flatpickr-calendar:not(.sky-clock-calendar) :is(.flatpickr-prev-month,.flatpickr-next-month){top:16px;width:34px;height:34px;padding:10px;border:1px solid #c2e9fa3d;border-radius:11px;background:#c2e9fa14;color:#fff!important;fill:#fff!important}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-prev-month{left:8px}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-next-month{right:8px}
html body .flatpickr-calendar:not(.sky-clock-calendar) :is(.flatpickr-prev-month,.flatpickr-next-month):hover{background:#c2e9fa30}
html body .flatpickr-calendar:not(.sky-clock-calendar) :is(.flatpickr-prev-month,.flatpickr-next-month) svg{fill:#fff!important}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-weekdays{height:35px;margin-top:8px;border-bottom:1px solid var(--dp-line);background:transparent!important}
html body .flatpickr-calendar:not(.sky-clock-calendar) span.flatpickr-weekday{background:transparent!important;color:var(--dp-muted)!important;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.035em}
html body .flatpickr-calendar:not(.sky-clock-calendar) .dayContainer{padding:7px 0 2px}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-day{
    position:relative;height:42px;line-height:38px;margin:0;border:2px solid var(--dp-paper);border-radius:13px;
    background:var(--dp-tile)!important;color:var(--dp-ink)!important;font-size:12px;font-weight:700;box-shadow:inset 0 -1px 0 #46749b0d;
}
html body .flatpickr-calendar:not(.sky-clock-calendar):not(.multiMonth) .flatpickr-day{width:14.285714%;max-width:none;flex-basis:14.285714%}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-day:is(:hover,:focus-visible):not(.flatpickr-disabled){background:var(--dp-range)!important;box-shadow:inset 0 0 0 1px #298cbf;color:var(--dp-ink)!important}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-day.today{background:var(--dp-range)!important;box-shadow:inset 0 0 0 1px #20a6a5;color:var(--dp-ink)!important}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-day.today::after{content:"";position:absolute;bottom:4px;left:calc(50% - 2px);width:4px;height:4px;border-radius:50%;background:#169c9b}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-day:is(.prevMonthDay,.nextMonthDay){background:transparent!important;color:var(--dp-muted)!important;font-weight:400}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-day.flatpickr-disabled{background:transparent!important;color:var(--dp-muted)!important;opacity:.42;box-shadow:none;cursor:not-allowed}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-day.inRange{border-radius:0;background:var(--dp-range)!important;border-color:var(--dp-range)!important;box-shadow:none!important;color:var(--dp-ink)!important}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-day:is(.selected,.startRange,.endRange):not(.flatpickr-disabled){border:2px solid var(--dp-paper)!important;border-radius:13px;background:linear-gradient(145deg,#246bba,#177f9b)!important;box-shadow:inset 0 1px 0 #d4f6ff4d,0 3px 8px #17658b26!important;color:#fff!important;font-weight:800}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-day.selected.today::after{background:#fff}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-monthSelect-month{border-radius:11px;border:2px solid var(--dp-paper);background:var(--dp-tile);color:var(--dp-ink);font-size:12px;font-weight:700}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-monthSelect-month:is(:hover,:focus){background:var(--dp-range);color:var(--dp-ink)}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-monthSelect-month.selected{background:linear-gradient(145deg,#246bba,#177f9b)!important;color:#fff!important}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-monthSelect-month.disabled{opacity:.4;cursor:not-allowed}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-time{margin:5px -10px -10px;background:var(--dp-soft);border-color:var(--dp-line)!important}
html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-time :is(input,.flatpickr-am-pm){color:var(--dp-ink)!important}
html body .datepicker-picker{border:0;background:var(--dp-paper)!important;color:var(--dp-ink);box-shadow:none!important}
html body .datepicker-picker .datepicker-controls .button{border:0;border-radius:10px;min-height:34px;background:#c2e9fa14!important;color:#fff!important;box-shadow:none;font-weight:750}
html body .datepicker-picker .datepicker-controls .button:hover{background:#c2e9fa30!important}
html body .datepicker-picker .datepicker-footer{margin-top:8px;padding:6px;border-radius:12px;background:var(--dp-soft)}
html body .datepicker-picker .datepicker-footer .button{background:var(--dp-range)!important;color:var(--dp-ink)!important}
html body .datepicker-picker .datepicker-main{padding:10px 0 0}
html body .datepicker-picker .dow{color:var(--dp-muted);font-size:10px;font-weight:800}
html body .datepicker-picker .datepicker-cell{border:2px solid var(--dp-paper);border-radius:11px;background:var(--dp-tile);color:var(--dp-ink);font-size:12px;font-weight:650}
html body .datepicker-picker .datepicker-cell:not(.disabled):hover{background:var(--dp-range)}
html body .datepicker-picker .datepicker-cell.today{box-shadow:inset 0 0 0 1px #20a6a5;background:var(--dp-range)}
html body .datepicker-picker .datepicker-cell:is(.selected,.range-start,.range-end){background:linear-gradient(145deg,#246bba,#177f9b)!important;color:#fff!important}
html body .datepicker-picker .datepicker-cell.range{background:var(--dp-range);border-radius:0}
html body .datepicker-picker .datepicker-cell:is(.disabled,.prev,.next){background:transparent;color:var(--dp-muted);opacity:.5}
html body .daterangepicker .calendar-table{border:0;background:var(--dp-paper)}
html body .daterangepicker .calendar-table thead tr:first-child{background:linear-gradient(115deg,#102f55,#16668e);color:#fff}
html body .daterangepicker .calendar-table thead th{color:var(--dp-ink);font-weight:750}
html body .daterangepicker .calendar-table thead tr:first-child th{height:44px;color:#fff}
html body .daterangepicker .calendar-table :is(.prev,.next) span{border-color:#fff}
html body .daterangepicker td{border:2px solid var(--dp-paper);border-radius:9px;background:var(--dp-tile);color:var(--dp-ink)}
html body .daterangepicker td.in-range{background:var(--dp-range);color:var(--dp-ink)}
html body .daterangepicker td.active{background:linear-gradient(145deg,#246bba,#177f9b)!important;color:#fff!important}
html body .daterangepicker td:is(.off,.disabled){background:transparent;color:var(--dp-muted);opacity:.5}
html body .daterangepicker .drp-buttons{border-color:var(--dp-line);color:var(--dp-ink)}
@media(max-width:575px){
    html body .flatpickr-calendar:not(.sky-clock-calendar){padding:8px;border-radius:20px!important}
    html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-months{padding:12px 2px}
    html body .flatpickr-calendar:not(.sky-clock-calendar) :is(.flatpickr-prev-month,.flatpickr-next-month){top:12px}
    html body .flatpickr-calendar:not(.sky-clock-calendar) .flatpickr-day{height:39px;line-height:35px;font-size:12px}
}
@media(prefers-reduced-motion:no-preference){
    html body .flatpickr-calendar:not(.sky-clock-calendar).open{animation:sky-date-reveal .18s ease-out}
    @keyframes sky-date-reveal{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
}

/* Month/year navigation uses accessible buttons and graphical option grids. */
html body .sky-date-enhanced.open{max-height:calc(100dvh - 16px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--dp-line) var(--dp-paper)}
html body .sky-date-enhanced .flatpickr-current-month{display:none!important}
html body .sky-date-enhanced .sky-date-titles{display:flex;align-items:center;justify-content:center;gap:5px;height:36px;padding:0 32px}
html body .sky-date-enhanced .sky-date-titles button{padding:7px 5px;border:1px solid #bdefff26;border-radius:8px;background:#d2f4ff10;color:#fff!important;font-family:inherit;font-size:13px;font-weight:750;line-height:1.2;white-space:nowrap;cursor:pointer}
html body .sky-date-enhanced .sky-date-titles button:hover,html body .sky-date-enhanced .sky-date-titles button[aria-expanded="true"]{background:#d2f4ff2b!important;border-color:#bdefff66!important;color:#fff!important}
html body .sky-date-enhanced .sky-date-panel[hidden]{display:none!important}
html body .sky-date-enhanced.sky-date-panel-open :is(.flatpickr-innerContainer,.flatpickr-monthSelect-months){display:none!important}
html body .sky-date-enhanced.sky-date-panel-open :is(.flatpickr-prev-month,.flatpickr-next-month){visibility:hidden}
html body .sky-date-enhanced .sky-date-panel{padding:14px 2px 4px;color:var(--dp-ink)}
html body .sky-date-enhanced .sky-date-panel-head{display:flex;align-items:center;justify-content:center;gap:16px;margin-bottom:12px;min-height:34px}
html body .sky-date-enhanced .sky-date-panel-head strong{flex:1;text-align:center;font-size:14px;color:var(--dp-ink)!important}
html body .sky-date-enhanced .sky-date-panel-head button{width:34px;min-height:34px;padding:2px;font-size:23px;line-height:1}
html body .sky-date-enhanced .sky-date-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
html body .sky-date-enhanced .sky-date-choice{min-width:0;padding:12px 5px;border:1px solid var(--dp-line);border-radius:11px;background:var(--dp-tile);color:var(--dp-ink)!important;font-family:inherit;font-size:12px;line-height:1.3;font-weight:700;box-shadow:inset 0 1px 0 #ffffff18;cursor:pointer}
html body .sky-date-enhanced .sky-date-choice:hover:not(:disabled){background:var(--dp-range);border-color:#298cbf}
html body .sky-date-enhanced .sky-date-choice[aria-pressed="true"]{border-color:#237ea7;background:linear-gradient(145deg,#246bba,#177f9b);color:#fff!important;box-shadow:0 4px 12px #17658b26}
html body .sky-date-enhanced .sky-date-choice[aria-pressed="true"]:hover{background:linear-gradient(145deg,#205d9f,#146d85);color:#fff!important}
html body .sky-date-enhanced .sky-date-choice:disabled{opacity:.35;cursor:not-allowed;box-shadow:none}
html body .sky-date-enhanced button:focus-visible{outline:2px solid #24b2bb;outline-offset:2px}
/* Mobile fields use the operating system picker directly. */
html body .flatpickr-calendar.sky-date-mobile-calendar{display:none!important}
html body .sky-date-device-fields{display:grid;gap:8px;min-width:0;max-width:100%;width:100%}
html body .sky-date-device-range{grid-template-columns:repeat(2,minmax(0,1fr))}
html body .sky-date-device-field{display:block;min-width:0;margin:0;font-size:12px;font-weight:650;color:var(--dp-ink)}
html body .sky-date-device-field>span{display:block;margin-bottom:5px}
html body .sky-date-device-input{box-sizing:border-box;display:block;width:100%;max-width:100%;min-width:0;min-height:44px;padding:10px 12px;border:1px solid var(--dp-line);border-radius:10px;background:var(--dp-paper);color:var(--dp-ink);font:inherit;font-size:16px;appearance:auto}
html body.sky-dark .sky-date-device-input{color-scheme:dark}
html body .sky-date-device-error{grid-column:1/-1;color:#ae364d;font-size:12px;line-height:1.5}
html body .sky-date-device-error:empty{display:none}
html body.sky-dark .sky-date-device-error{color:#ffb8c5}
html body .sky-date-device-apply{grid-column:1/-1;min-height:40px;padding:8px 12px;border:1px solid #237ea7;border-radius:10px;background:linear-gradient(145deg,#246bba,#177f9b);color:#fff!important;font:inherit;font-weight:650;cursor:pointer}
html body .sky-date-device-apply:disabled{opacity:.5;cursor:not-allowed}