@layer components{.calendar-page-wrapper{padding:var(--space-6);
height:100vh;
overflow:hidden;
box-sizing:border-box;
background:var(--page-mesh);
max-width:100%;
width:100%;}
.calendar-page{display:flex;
flex-direction:column;
height:100%;
overflow:hidden;
background:var(--glass-bg);
border:1px solid var(--glass-border);
border-radius:var(--radius-lg);
box-shadow:var(--shadow-lg);
backdrop-filter:blur(12px) saturate(150%);
-webkit-backdrop-filter:blur(12px) saturate(150%);
max-width:100%;}
.cal-header{display:flex;
align-items:center;
justify-content:space-between;
flex-wrap:nowrap;
padding:0.75rem var(--space-6);
border-bottom:1px solid var(--border-subtle);
background:var(--glass-bg);
backdrop-filter:blur(16px) saturate(150%);
-webkit-backdrop-filter:blur(16px) saturate(150%);
flex-shrink:0;
gap:var(--space-4);
min-height:52px;
border-radius:var(--radius-lg) var(--radius-lg) 0 0;}
.cal-header-left{display:flex;
align-items:center;
gap:0.625rem;
flex:1;
min-width:0;}
.cal-date-label-wrap{position:relative;
display:inline-flex;
align-items:center;}
.cal-date-label{display:inline-flex;
align-items:center;
gap:0.375rem;
font-size:var(--font-xl);
font-weight:700;
color:var(--text);
white-space:nowrap;
margin-left:0.25rem;
letter-spacing:-0.025em;
line-height:1.2;
background:transparent;
border:none;
cursor:pointer;
padding:0.25rem 0.5rem;
border-radius:var(--radius-sm);
transition:background 0.15s ease, color 0.15s ease;}
.cal-date-label:hover{background:var(--hover-bg);}
.cal-date-label:focus-visible{outline:2px solid var(--brand-primary);
outline-offset:2px;}
.cal-date-chevron{color:var(--text-muted);
transition:transform 0.2s ease;
flex-shrink:0;}
.cal-nav-btn{display:inline-flex;
align-items:center;
justify-content:center;
border:1px solid var(--border-subtle);
background:transparent;
color:var(--text-muted);
border-radius:var(--radius-sm);
cursor:pointer;
transition:background 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.1s ease;
font-size:var(--font-sm);
font-weight:600;}
.cal-nav-btn:focus-visible{outline:2px solid var(--brand-primary);
outline-offset:2px;}
.cal-nav-btn:hover{background:var(--hover-bg);
border-color:color-mix(in oklch, var(--brand-primary) 30%, transparent);
color:var(--text);}
.cal-nav-btn:active{transform:scale(0.95);}
.cal-today-btn{padding:0.375rem 0.875rem;
font-size:var(--font-sm);
font-weight:600;
letter-spacing:0.01em;
border-radius:var(--radius-pill);}
.cal-nav-arrows{display:flex;
gap:2px;}
.cal-arrow-btn{width:32px;
height:32px;
padding:0;
border-radius:var(--radius-sm);}
.cal-view-tabs{display:flex;
background:var(--input-bg);
border:1px solid var(--border-subtle);
padding:3px;
flex-shrink:0;
border-radius:var(--radius-pill);
gap:2px;
position:relative;}
.cal-interval-tabs{display:flex;
background:var(--glass-bg);
padding:2px;
border-radius:var(--radius-sm);
gap:2px;}
.cal-view-tab,
.cal-interval-tab{border:none;
background:transparent;
font-weight:500;
border-radius:var(--radius-pill);
cursor:pointer;
transition:background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
position:relative;
z-index:1;}
.cal-view-tab:focus-visible,
.cal-interval-tab:focus-visible{outline:2px solid var(--brand-primary);
outline-offset:-2px;}
.cal-view-tab{padding:0.375rem 1rem;
color:var(--text-muted);
font-size:var(--font-sm);
white-space:nowrap;}
.cal-interval-tab{flex:1;
padding:0.3rem 0.5rem;
font-size:var(--font-xs);
color:var(--text-muted);
text-align:center;
border-radius:var(--radius-sm);}
.cal-view-tab:hover:not(.active){color:var(--text);
background:var(--hover-bg);}
.cal-interval-tab:hover:not(.active){color:var(--text);
background:color-mix(in oklch, var(--brand-primary) 8%, transparent);}
.cal-view-tab.active{background:var(--brand-primary);
color:var(--brand-text);
font-weight:600;
box-shadow:0 1px 6px color-mix(in oklch, var(--brand-primary) 35%, transparent);}
.cal-interval-tab.active{background:var(--brand-primary);
color:var(--brand-text);
font-weight:600;
box-shadow:0 1px 6px color-mix(in oklch, var(--brand-primary) 35%, transparent);}
.cal-split-mode-tabs{display:flex;
background:var(--hover-bg-subtle);
padding:2px;
border-radius:var(--radius-sm);
gap:2px;}
.cal-split-mode-tab{flex:1;
display:inline-flex;
align-items:center;
justify-content:center;
gap:0.375rem;
padding:0.375rem 0.625rem;
font-size:var(--font-xs);
font-weight:500;
color:var(--text-muted);
background:transparent;
border:none;
border-radius:var(--radius-sm);
cursor:pointer;
transition:background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
white-space:nowrap;}
.cal-split-mode-tab:focus-visible{outline:2px solid var(--brand-primary);
outline-offset:-2px;}
.cal-split-mode-tab:hover:not(.active){color:var(--text);
background:color-mix(in oklch, var(--brand-primary) 8%, transparent);}
.cal-split-mode-tab.active{background:var(--brand-primary);
color:var(--brand-text);
font-weight:600;
box-shadow:0 1px 6px color-mix(in oklch, var(--brand-primary) 35%, transparent);}
.cal-header-right{flex:0 0 auto;
display:flex;
justify-content:flex-end;
flex-shrink:0;}
.cal-find-slot-btn{display:inline-flex;
align-items:center;
gap:0.375rem;
padding:0.375rem 0.75rem;
border-radius:var(--radius-md);
border:1px solid var(--border-subtle);
background:var(--card-bg);
color:var(--text-muted);
font-size:var(--font-sm);
font-weight:500;
cursor:pointer;
transition:all 0.15s ease;
white-space:nowrap;}
.cal-find-slot-btn:hover{color:var(--brand-primary);
border-color:var(--brand-primary);
background:color-mix(in oklch, var(--brand-primary) 8%, var(--card-bg));}
.cal-find-slot-btn svg{width:15px;
height:15px;
flex-shrink:0;}
.find-slot-popover{position:fixed;
z-index:200;
background:var(--popup-glass-bg);
border:1px solid var(--popup-glass-border);
border-radius:1rem;
box-shadow:var(--popup-glass-shadow);
backdrop-filter:blur(var(--popup-glass-blur));
-webkit-backdrop-filter:blur(var(--popup-glass-blur));
padding:1.25rem;
display:flex;
flex-direction:column;
gap:0.875rem;
min-width:300px;
max-width:360px;
animation:fadeInUp 0.2s ease both;}
.find-slot-header{font-size:0.9375rem;
font-weight:700;
color:var(--text);
letter-spacing:-0.01em;}
.find-slot-section{display:flex;
flex-direction:column;
gap:0.5rem;}
.find-slot-label{font-size:var(--font-xs);
font-weight:600;
color:var(--text-muted);
text-transform:uppercase;
letter-spacing:0.04em;}
.find-slot-mode-tabs{display:flex;
gap:0;
border:1px solid var(--border-subtle);
border-radius:var(--radius-md);
overflow:hidden;}
.find-slot-mode-tab{flex:1;
padding:0.4rem 0.5rem;
font-size:var(--font-xs);
font-weight:500;
background:transparent;
color:var(--text-muted);
border:none;
cursor:pointer;
transition:all 0.15s ease;
text-align:center;}
.find-slot-mode-tab + .find-slot-mode-tab{border-left:1px solid var(--border-subtle);}
.find-slot-mode-tab.active{background:var(--brand-primary);
color:var(--brand-text);
font-weight:600;}
.find-slot-select{width:100%;
padding:0.4375rem 0.75rem;
font-size:var(--font-sm);
border-radius:var(--radius-md);
border:1px solid var(--input-border);
background:var(--input-bg);
color:var(--text);
outline:none;
cursor:pointer;
transition:border-color 0.15s ease;}
.find-slot-select:focus{border-color:var(--brand-primary);}
.find-slot-custom-dur{display:flex;
align-items:center;
gap:0.5rem;}
.find-slot-input{width:72px;
padding:0.4375rem 0.5rem;
font-size:var(--font-sm);
border-radius:var(--radius-md);
border:1px solid var(--input-border);
background:var(--input-bg);
color:var(--text);
outline:none;
text-align:center;
transition:border-color 0.15s ease;}
.find-slot-input:focus{border-color:var(--brand-primary);}
.find-slot-unit{font-size:var(--font-sm);
color:var(--text-muted);}
.find-slot-find-btn{display:flex;
align-items:center;
justify-content:center;
gap:0.5rem;
width:100%;
padding:0.5rem 1rem;
border-radius:var(--radius-md);
border:none;
background:var(--brand-primary);
color:var(--brand-text);
font-size:var(--font-sm);
font-weight:600;
cursor:pointer;
transition:all 0.2s ease;}
.find-slot-find-btn:hover:not(:disabled){filter:brightness(1.08);
transform:translateY(-1px);}
.find-slot-find-btn:disabled{opacity:0.5;
cursor:not-allowed;}
.find-slot-find-btn svg{width:16px;
height:16px;
flex-shrink:0;}
.find-slot-result{border-top:1px solid var(--border-subtle);
padding-top:0.75rem;}
.find-slot-result-found{display:flex;
align-items:flex-start;
gap:0.75rem;
margin-bottom:0.75rem;}
.find-slot-result-icon{flex-shrink:0;
width:32px;
height:32px;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
background:var(--state-success-bg);}
.find-slot-result-date{font-size:var(--font-base);
font-weight:600;
color:var(--text);
line-height:1.3;}
.find-slot-result-time{font-size:var(--font-sm);
font-weight:700;
color:var(--brand-primary);
margin-top:0.125rem;}
.find-slot-result-employee{font-size:var(--font-xs);
color:var(--text-muted);
margin-top:0.125rem;}
.find-slot-result-actions{display:flex;
gap:0.5rem;}
.find-slot-action-btn{flex:1;
padding:0.4375rem 0.75rem;
border-radius:var(--radius-md);
font-size:var(--font-xs);
font-weight:600;
cursor:pointer;
transition:all 0.15s ease;
text-align:center;}
.find-slot-action-goto{background:transparent;
border:1px solid var(--border-subtle);
color:var(--text);}
.find-slot-action-goto:hover{border-color:var(--brand-primary);
color:var(--brand-primary);}
.find-slot-action-book{background:var(--brand-primary);
border:1px solid transparent;
color:var(--brand-text);}
.find-slot-action-book:hover{filter:brightness(1.08);}
.find-slot-no-result{text-align:center;
font-size:var(--font-sm);
color:var(--text-muted);
padding:0.5rem 0;}
.find-slot-date-range-toggle{display:flex;
align-items:center;
gap:0.375rem;
padding:0;
border:none;
background:none;
color:var(--text-muted);
font-size:var(--font-xs);
font-weight:600;
text-transform:uppercase;
letter-spacing:0.04em;
cursor:pointer;
transition:color 0.15s ease;}
.find-slot-date-range-toggle:hover{color:var(--brand-primary);}
.find-slot-date-range-toggle svg:first-child{width:14px;
height:14px;
flex-shrink:0;}
.find-slot-date-range-chevron{transition:transform 0.2s ease;
margin-left:auto;}
.find-slot-date-range-chevron.open{transform:rotate(180deg);}
.find-slot-date-range-fields{display:flex;
gap:0.5rem;
margin-top:0.25rem;}
.find-slot-date-field{flex:1;
display:flex;
flex-direction:column;
gap:0.25rem;
min-width:0;}
.find-slot-date-field-label{font-size:var(--font-xs-plus);
font-weight:600;
color:var(--text-muted);
text-transform:uppercase;
letter-spacing:0.04em;}
.find-slot-date-field .picker-trigger{font-size:var(--font-xs);
padding:0.35rem 0.5rem;}
.find-slot-nav{display:flex;
align-items:center;
justify-content:center;
gap:0.625rem;
margin-bottom:0.625rem;}
.find-slot-nav-arrow{display:flex;
align-items:center;
justify-content:center;
width:28px;
height:28px;
border-radius:var(--radius-md);
border:1px solid var(--border-subtle);
background:var(--card-bg);
color:var(--text-muted);
cursor:pointer;
transition:all 0.15s ease;
padding:0;}
.find-slot-nav-arrow:hover:not(:disabled){color:var(--brand-primary);
border-color:var(--brand-primary);
background:color-mix(in oklch, var(--brand-primary) 8%, var(--card-bg));}
.find-slot-nav-arrow:disabled{opacity:0.35;
cursor:not-allowed;}
.find-slot-nav-counter{font-size:var(--font-xs);
font-weight:600;
color:var(--text-muted);
min-width:3rem;
text-align:center;}
.cal-slot-highlight{position:absolute;
left:2px;
right:2px;
border-radius:6px;
background:color-mix(in oklch, var(--brand-primary) 12%, transparent);
border:2px solid var(--brand-primary);
pointer-events:none;
z-index:5;
animation:slotPulse 1.5s ease-in-out 4;}
@keyframes slotPulse{0%, 100%{opacity:1;}
50%{opacity:0.4;}}
.cal-header-filter{min-width:8rem;}
.calendar-body{flex:1;
overflow:hidden;
position:relative;}
.cal-skeleton-pulse{animation:calSkeletonPulse 1.5s ease-in-out infinite;}
@keyframes calSkeletonPulse{0%, 100%{opacity:0.4;}
50%{opacity:1;}}
.cal-time-grid{display:flex;
flex-direction:column;
height:100%;}
.cal-grid-header{display:flex;
border-bottom:1px solid var(--border-subtle);
flex-shrink:0;
background:var(--glass-bg);
backdrop-filter:blur(12px) saturate(150%);
-webkit-backdrop-filter:blur(12px) saturate(150%);
position:sticky;
top:0;
z-index:5;
overflow-x:hidden;
overflow-y:scroll;
scrollbar-gutter:stable;}
.cal-grid-header::-webkit-scrollbar{width:5px;}
.cal-grid-header::-webkit-scrollbar-track,
.cal-grid-header::-webkit-scrollbar-thumb{background:transparent;}
.cal-grid-gutter{width:56px;
flex-shrink:0;
border-right:1px solid var(--border-subtle);}
.cal-grid-day-header{flex:1;
display:flex;
flex-direction:column;
align-items:center;
padding:0.5rem 0 0.625rem;
gap:0.25rem;
border-right:1px solid var(--border-subtle);
min-width:0;
transition:background 0.2s ease;}
.cal-grid-day-header:last-child{border-right:none;}
.cal-day-name{font-size:var(--font-2xs);
font-weight:600;
text-transform:uppercase;
letter-spacing:0.08em;
color:var(--text-muted);
transition:color 0.2s ease;}
.cal-grid-day-header.today .cal-day-name{color:var(--brand-primary);}
.cal-day-number{font-size:var(--font-xl);
font-weight:700;
line-height:1;
color:var(--text);
width:34px;
height:34px;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
transition:background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;}
.cal-day-number.today{background:var(--brand-primary);
color:var(--brand-text);
box-shadow:0 2px 8px color-mix(in oklch, var(--brand-primary) 35%, transparent);}
.cal-grid-scroll{flex:1;
overflow-y:auto;
overflow-x:hidden;
scrollbar-gutter:stable;}
.cal-grid-scroll::-webkit-scrollbar{width:5px;}
.cal-grid-scroll::-webkit-scrollbar-track{background:transparent;}
.cal-grid-scroll::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);
border-radius:3px;
transition:background 0.15s ease;}
.cal-grid-scroll::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-hover);}
.cal-grid-body{display:flex;
position:relative;
min-height:100%;}
.cal-grid-time-col{width:56px;
flex-shrink:0;
border-right:1px solid var(--border-subtle);}
.cal-time-label{display:flex;
align-items:flex-start;
justify-content:flex-end;
padding-right:0.625rem;
position:relative;}
.cal-time-label span{font-size:var(--font-3xs);
font-weight:500;
color:var(--text-muted);
transform:translateY(-0.45em);
line-height:1;
white-space:nowrap;
font-variant-numeric:tabular-nums;
opacity:0.8;}
.cal-grid-day-col{flex:1;
position:relative;
border-right:1px solid var(--border-subtle);
min-width:0;
overflow:hidden;}
.cal-grid-day-col:last-child{border-right:none;}
.cal-grid-day-col.today{background:color-mix(in oklch, var(--brand-primary) 6%, transparent);}
.cal-time-slot{height:48px;
border-bottom:1px solid color-mix(in oklch, var(--border-section) 50%, transparent);
cursor:pointer;
transition:background 0.15s ease;
position:relative;}
.cal-time-slot.hour-start{border-bottom:1px solid var(--border-subtle);}
.cal-time-slot:not(.hour-start){border-bottom:1px dashed color-mix(in oklch, var(--border-section) 35%, transparent);}
.cal-time-slot:hover{background:var(--hover-bg);}
.cal-time-slot--drop-target{background:color-mix(in srgb, var(--brand-primary) 10%, transparent) !important;
box-shadow:inset 0 0 0 2px color-mix(in srgb, var(--brand-primary) 35%, transparent);
border-radius:0.375rem;
transition:all 0.15s ease;}
.cal-slot-hover-label{display:none;
position:absolute;
top:2px;
left:4px;
font-size:var(--font-3xs);
color:var(--text-muted);
pointer-events:none;
opacity:0.7;
white-space:nowrap;
font-variant-numeric:tabular-nums;}
.cal-time-slot:hover .cal-slot-hover-label{display:block;}
.cal-time-slot--off-hours{background:
repeating-linear-gradient(
-45deg,
transparent,
transparent 4px,
oklch(0.55 0.18 15 / 0.14) 4px,
oklch(0.55 0.18 15 / 0.14) 8px
),
oklch(0.55 0.18 15 / 0.07);
cursor:not-allowed;}
:root.light .cal-time-slot--off-hours{background:
repeating-linear-gradient(
-45deg,
transparent,
transparent 4px,
oklch(0.60 0.18 18 / 0.14) 4px,
oklch(0.60 0.18 18 / 0.14) 8px
),
oklch(0.60 0.18 18 / 0.06);}
.cal-time-slot--off-hours .cal-slot-hover-label{display:none !important;}
.cal-time-slot--past{opacity:0.5;}
.cal-event,
.mobile-cal-event{position:absolute;
display:flex;
border-radius:var(--radius-sm);
cursor:pointer;
z-index:2;
box-sizing:border-box;
transition:box-shadow 0.2s ease, transform 0.15s ease;}
.cal-event-color-bar,
.mobile-cal-event-accent{flex-shrink:0;
background:var(--event-color);}
.cal-event-content,
.mobile-cal-event-body{flex:1;
padding:0.25rem 0.5rem;
min-width:0;
display:flex;
flex-direction:column;
gap:0.0625rem;
overflow:hidden;}
.cal-event-title,
.mobile-cal-event-title{font-weight:600;
color:var(--text);
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
line-height:1.3;}
.cal-event-subtitle,
.mobile-cal-event-subtitle{font-weight:400;
color:var(--text-muted);
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
line-height:1.3;}
.cal-event-time,
.mobile-cal-event-time{color:var(--text-muted);
white-space:nowrap;}
.cal-event--past,
.mobile-cal-event.past{opacity:0.45;
filter:grayscale(0.4);
cursor:default;
pointer-events:none;}
.cal-event{overflow:visible;
min-height:1.5rem;
background:color-mix(in srgb, var(--event-color) 22%, var(--glass-bg));
border:1px solid color-mix(in srgb, var(--event-color) 32%, transparent);
box-shadow:0 1px 3px color-mix(in srgb, var(--event-color) 10%, transparent);
border-radius:0.375rem;}
:root.light .cal-event{background:color-mix(in srgb, var(--event-color) 18%, var(--glass-bg));
border:1px solid color-mix(in srgb, var(--event-color) 28%, transparent);
box-shadow:0 1px 3px color-mix(in srgb, var(--event-color) 10%, transparent);}
.cal-event:hover{box-shadow:0 4px 12px color-mix(in srgb, var(--event-color) 18%, transparent),
0 0 0 1px color-mix(in srgb, var(--event-color) 25%, transparent);
transform:scale(1.01);
z-index:3;}
:root.light .cal-event:hover{box-shadow:0 4px 12px color-mix(in srgb, var(--event-color) 18%, transparent),
0 0 0 1px color-mix(in srgb, var(--event-color) 25%, transparent);}
.cal-event:focus-visible{outline:2px solid var(--brand-primary);
outline-offset:1px;}
.cal-event[draggable="true"]{cursor:grab;}
.cal-event[draggable="true"]:active{cursor:grabbing;}
.cal-event--dragging{opacity:0.4;
box-shadow:none;
transform:none;}
.cal-touch-drag-ghost{border-radius:6px;
overflow:hidden;
opacity:0.85;
box-shadow:0 4px 16px rgba(0, 0, 0, 0.25);
transform:scale(1.04);
pointer-events:none;
z-index:var(--z-drag-ghost);
touch-action:none;}
.cal-event--pending{opacity:0.7;
border-style:dashed;}
.cal-event--pending .cal-event-color-bar{animation:tm-pulse 2s ease-in-out infinite;}
.cal-event--cancelled,
.cal-event--no-show{opacity:0.35;
filter:grayscale(0.7);
pointer-events:auto;
cursor:pointer;
border-style:dashed;}
.cal-event--cancelled .cal-event-color-bar,
.cal-event--no-show .cal-event-color-bar{background:var(--text-muted) !important;}
.cal-event--completed{opacity:0.55;
pointer-events:auto;
cursor:pointer;
border-color:var(--state-success-border);}
.cal-event--completed .cal-event-color-bar{background:var(--state-success) !important;}
.cal-event-status-tag{display:inline-block;
font-size:var(--font-3xs);
font-weight:600;
text-transform:uppercase;
letter-spacing:0.04em;
color:var(--text-muted);
margin-left:0.25rem;}
.cal-event-bundle-tag{display:inline-block;
font-size:0.5rem;
font-weight:700;
text-transform:uppercase;
letter-spacing:0.04em;
color:var(--brand-primary);
background:var(--brand-hover);
border-radius:3px;
padding:0 0.25rem;
margin-left:0.25rem;
vertical-align:middle;
line-height:1.4;}
.cal-event-color-bar{width:4px;
border-radius:4px 0 0 4px;
box-shadow:1px 0 6px color-mix(in srgb, var(--event-color) 25%, transparent);}
:root.light .cal-event-color-bar{box-shadow:1px 0 4px color-mix(in srgb, var(--event-color) 18%, transparent);}
.cal-event-title{font-size:var(--font-xs-plus);}
.cal-event-subtitle{font-size:var(--font-xs-plus);}
.cal-event-time{font-size:var(--font-xs-plus);}
.cal-event--compact .cal-event-content{flex-direction:row;
align-items:baseline;
gap:0.375rem;
padding:0.125rem 0.4rem;}
.cal-event--compact .cal-event-title{font-size:var(--font-xs-plus);}
.cal-event--compact .cal-event-subtitle{display:none;}
.cal-event--compact .cal-event-time{font-size:var(--font-xs-plus);
flex-shrink:0;}
.cal-view-tab-short{display:none;}
@media (max-width:767px){.cal-header{flex-wrap:wrap;
gap:0.5rem;
padding:0.625rem var(--space-3);
min-height:auto;
border-radius:var(--radius-md) var(--radius-md) 0 0;}
.cal-header-left{flex:1 1 auto;
gap:0.5rem;
min-width:0;}
.cal-today-btn{padding:0.3rem 0.75rem;
font-size:var(--font-xs);
min-height:34px;}
.cal-arrow-btn{width:34px;
height:34px;}
.cal-date-label{font-size:0.9375rem;
font-weight:700;
padding:0.1875rem 0.25rem;
margin-left:0;}
.cal-view-tabs{order:10;
flex:1 1 100%;
justify-content:center;
padding:2px;}
.cal-view-tab{padding:0.375rem 0;
font-size:var(--font-xs);
flex:1;
justify-content:center;
min-height:32px;}
.cal-view-tab-full{display:none;}
.cal-view-tab-short{display:inline;}
.cal-header-right{flex:0 0 auto;}
.cal-header-right .tm-btn{padding:0.375rem 0.75rem;
font-size:var(--font-xs);
min-height:34px;}}
.cal-now-line{position:absolute;
left:56px;
right:0;
height:2px;
background:var(--state-error);
z-index:4;
pointer-events:none;
box-shadow:0 0 8px color-mix(in oklch, var(--state-error) 50%, transparent),
0 0 2px var(--state-error);}
.cal-now-dot{position:absolute;
left:-4px;
top:-3px;
width:8px;
height:8px;
border-radius:50%;
background:var(--state-error);
box-shadow:0 0 6px color-mix(in oklch, var(--state-error) 50%, transparent);}
.cal-now-label{position:absolute;
left:-50px;
top:-0.5em;
font-size:var(--font-3xs);
font-weight:700;
color:var(--state-error);
line-height:1;
width:44px;
text-align:right;
font-variant-numeric:tabular-nums;}
.cal-time-grid--day .cal-grid-day-col{}
.cal-event--day .cal-event-title{font-size:var(--font-xs);}
.cal-event--day .cal-event-subtitle{font-size:var(--font-xs);}
.cal-event--day .cal-event-time{font-size:var(--font-xs);}
.cal-event-assignee{font-weight:400;
opacity:0.7;}
.cal-event-resource{opacity:0.8;
font-style:italic;}
.cal-split-header{display:flex;
border-bottom:1px solid var(--border-subtle);
flex-shrink:0;
background:var(--glass-bg);
overflow-x:hidden;
overflow-y:scroll;
scrollbar-gutter:stable;}
.cal-split-header::-webkit-scrollbar{width:5px;}
.cal-split-header::-webkit-scrollbar-track,
.cal-split-header::-webkit-scrollbar-thumb{background:transparent;}
.cal-split-header-group{flex:1;
display:flex;
min-width:0;
border-right:1px solid var(--border-subtle);}
.cal-split-header-group:last-child{border-right:none;}
.cal-split-header-cell{flex:1;
display:flex;
align-items:center;
justify-content:center;
padding:0.375rem 0.25rem;
min-width:0;
border-right:1px solid color-mix(in oklch, var(--border-subtle) 40%, transparent);
background:oklch(0.35 0.07 var(--split-hue) / 0.6);
transition:background 0.2s ease;}
:root.light .cal-split-header-cell{background:oklch(0.85 0.07 var(--split-hue) / 0.55);}
.cal-split-header-cell:last-child{border-right:none;}
.cal-split-header-name{font-size:var(--font-xs-plus);
font-weight:600;
color:var(--text);
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;}
.cal-split-header-initials{display:none;
font-size:var(--font-xs-plus);
font-weight:700;
color:var(--text);}
.cal-grid-day-col--split{display:flex;
flex-direction:row;}
.cal-split-col{flex:1;
position:relative;
min-width:0;
border-right:1px solid color-mix(in oklch, var(--border-subtle) 40%, transparent);}
.cal-split-col:last-child{border-right:none;}
.cal-split-col::before{content:"";
position:absolute;
inset:0;
background:oklch(0.35 0.05 var(--split-hue) / 0.25);
pointer-events:none;
z-index:0;}
:root.light .cal-split-col::before{background:oklch(0.80 0.06 var(--split-hue) / 0.3);}
.cal-split-header-cell[data-narrow="true"] .cal-split-header-name{display:none;}
.cal-split-header-cell[data-narrow="true"] .cal-split-header-initials{display:block;}
.cal-month-grid{display:flex;
flex-direction:column;
height:100%;}
.cal-month-header{display:grid;
grid-template-columns:repeat(7, 1fr);
border-bottom:1px solid var(--border-subtle);
background:var(--glass-bg);
backdrop-filter:blur(12px) saturate(150%);
-webkit-backdrop-filter:blur(12px) saturate(150%);
flex-shrink:0;}
.cal-month-day-name{padding:0.5rem;
text-align:center;
font-size:var(--font-2xs);
font-weight:600;
text-transform:uppercase;
letter-spacing:0.08em;
color:var(--text-muted);
border-right:1px solid color-mix(in oklch, var(--border-subtle) 60%, transparent);}
.cal-month-day-name:last-child{border-right:none;}
.cal-month-body{display:grid;
grid-template-columns:repeat(7, 1fr);
grid-template-rows:repeat(6, 1fr);
flex:1;
min-height:0;}
@keyframes monthSlideUp{from{opacity:0;transform:translateY(12px);}
to{opacity:1;transform:translateY(0);}}
@keyframes monthSlideDown{from{opacity:0;transform:translateY(-12px);}
to{opacity:1;transform:translateY(0);}}
.cal-month-slide-up{animation:monthSlideUp 200ms ease forwards;}
.cal-month-slide-down{animation:monthSlideDown 200ms ease forwards;}
.cal-month-cell{position:relative;
border-right:1px solid color-mix(in oklch, var(--border-section) 60%, transparent);
border-bottom:1px solid color-mix(in oklch, var(--border-section) 60%, transparent);
padding:0.375rem 0.375rem 0.25rem;
cursor:pointer;
transition:background 0.15s ease;
overflow:hidden;
display:flex;
flex-direction:column;
min-height:0;}
.cal-month-cell:nth-child(7n){border-right:none;}
.cal-month-cell:hover{background:var(--hover-bg-subtle);}
.cal-month-cell--drop-target{background:color-mix(in srgb, var(--brand-primary) 10%, transparent) !important;
box-shadow:inset 0 0 0 2px color-mix(in srgb, var(--brand-primary) 35%, transparent);}
.cal-month-cell.outside{opacity:0.4;}
.cal-month-cell.today{background:color-mix(in oklch, var(--brand-primary) 6%, transparent);}
.cal-month-date{font-size:var(--font-sm);
font-weight:500;
color:var(--text);
width:26px;
height:26px;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
flex-shrink:0;
margin-bottom:0.1875rem;
transition:background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;}
.cal-month-date.today{background:var(--brand-primary);
color:var(--brand-text);
font-weight:700;
box-shadow:0 2px 6px color-mix(in oklch, var(--brand-primary) 35%, transparent);}
.cal-month-events{display:flex;
flex-direction:column;
gap:0.125rem;
overflow:hidden;
flex:1;
min-height:0;}
.cal-month-event{position:relative;
display:flex;
align-items:center;
gap:0.375rem;
padding:0.1875rem 0.375rem;
border-radius:0.25rem;
font-size:var(--font-xs-plus);
cursor:pointer;
transition:background 0.15s ease, transform 0.1s ease;
background:color-mix(in srgb, var(--event-color) 20%, transparent);
border:1px solid color-mix(in srgb, var(--event-color) 16%, transparent);
min-width:0;}
:root.light .cal-month-event{background:color-mix(in srgb, var(--event-color) 18%, transparent);
border-color:color-mix(in srgb, var(--event-color) 14%, transparent);}
.cal-month-event:hover{background:color-mix(in srgb, var(--event-color) 30%, transparent);
transform:translateX(1px);}
:root.light .cal-month-event:hover{background:color-mix(in srgb, var(--event-color) 28%, transparent);}
.cal-event-popup{position:fixed;
top:0;
left:0;
width:min(280px, 80vw);
padding:var(--space-3) 0.875rem;
border-radius:var(--radius-md);
background:var(--popup-glass-bg);
border:1px solid var(--popup-glass-border);
box-shadow:var(--popup-glass-shadow);
backdrop-filter:blur(var(--popup-glass-blur));
-webkit-backdrop-filter:blur(var(--popup-glass-blur));
color:var(--text);
z-index:9999;
opacity:0;
visibility:hidden;
transform:translateY(6px);
transition:opacity 0.18s ease, transform 0.18s ease;
pointer-events:none;}
.cal-event-popup--portal{pointer-events:auto;}
.cal-event-popup-title-row{display:flex;
align-items:center;
justify-content:space-between;
gap:0.5rem;
margin-bottom:0.375rem;}
.cal-event-popup-title{font-size:var(--font-sm);
font-weight:700;
color:var(--text);
min-width:0;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;}
.cal-event-popup-bundle-tag{display:inline-block;
font-size:var(--font-3xs);
font-weight:700;
text-transform:uppercase;
letter-spacing:0.03em;
color:var(--brand-primary);
background:var(--brand-hover);
border-radius:3px;
padding:0.0625rem 0.3rem;
margin-left:0.375rem;
vertical-align:middle;
line-height:1.4;}
.cal-event-popup-category{display:inline-flex;
align-items:center;
border-radius:999px;
padding:0.125rem 0.45rem;
font-size:var(--font-2xs);
font-weight:700;
color:var(--event-color-contrast, var(--brand-text));
background:color-mix(in srgb, var(--event-color) var(--popup-badge-bg-mix), transparent);
border:1px solid color-mix(in srgb, var(--event-color) var(--popup-badge-border-mix), transparent);
backdrop-filter:blur(calc(var(--popup-glass-blur) * 0.75));
-webkit-backdrop-filter:blur(calc(var(--popup-glass-blur) * 0.75));
flex-shrink:0;}
.cal-event-popup-line{display:grid;
grid-template-columns:54px 1fr;
gap:0.5rem;
align-items:start;
font-size:var(--font-xs-plus);
line-height:1.35;
color:var(--text);
margin-bottom:0.25rem;}
.cal-event-popup-label{color:var(--text-muted);
font-weight:600;}
.cal-event-popup-desc{margin-top:0.35rem;
font-size:var(--font-xs-plus);
color:var(--text-muted);
line-height:1.35;
display:-webkit-box;
line-clamp:2;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
overflow:hidden;}
.cal-event-popup-notes{margin-top:0.35rem;
padding:0.375rem 0.5rem;
border-top:1px solid var(--glass-border);
border-radius:0.375rem;
background:var(--state-warning-bg);
display:flex;
flex-direction:column;
gap:0.25rem;}
.cal-event-popup-note{display:flex;
gap:0.375rem;
font-size:var(--font-xs-plus);
line-height:1.35;
color:var(--text);}
.cal-event-popup-note-label{font-weight:600;
color:var(--state-warning);
white-space:nowrap;
flex-shrink:0;}
.cal-event-popup-note-label::before{content:"📝 ";}
.cal-month-event[draggable="true"]{cursor:grab;}
.cal-month-event[draggable="true"]:active{cursor:grabbing;}
.cal-month-event--dragging{opacity:0.4;}
.cal-month-event--past{opacity:0.4;
filter:grayscale(0.4);
cursor:default;
pointer-events:none;}
.cal-month-event--pending{opacity:0.7;
border-style:dashed;}
.cal-month-event--pending .cal-month-event-dot{animation:tm-pulse 2s ease-in-out infinite;}
.cal-month-event--cancelled,
.cal-month-event--no-show{opacity:0.35;
filter:grayscale(0.7);
border-style:dashed;
pointer-events:auto;
cursor:pointer;}
.cal-month-event--cancelled .cal-month-event-dot,
.cal-month-event--no-show .cal-month-event-dot{background:var(--text-muted);}
.cal-month-cell.past{opacity:0.7;}
.cal-month-event-dot{width:5px;
height:5px;
border-radius:50%;
background:var(--event-color);
flex-shrink:0;
box-shadow:0 0 6px color-mix(in srgb, var(--event-color) 55%, transparent);}
:root.light .cal-month-event-dot{box-shadow:0 0 5px color-mix(in srgb, var(--event-color) 50%, transparent);}
.cal-month-event-title{font-weight:600;
color:var(--text);
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
flex:1;
min-width:0;
font-size:var(--font-xs-plus);}
.cal-month-event-time{font-weight:400;
color:var(--text-muted);
flex-shrink:0;
font-size:var(--font-xs-plus);}
.cal-month-more{font-size:var(--font-3xs);
color:var(--brand-primary);
font-weight:600;
padding:0.125rem 0.375rem;
opacity:0.8;}
.cal-detail-modal{background:var(--popup-glass-bg);
border:1px solid var(--popup-glass-border);
border-radius:var(--radius-xl);
box-shadow:var(--shadow-xl);
backdrop-filter:blur(var(--popup-glass-blur));
-webkit-backdrop-filter:blur(var(--popup-glass-blur));
width:90%;
max-width:460px;
max-height:90vh;
max-height:90dvh;
overflow:hidden;
animation:calModalIn 0.25s cubic-bezier(0.2, 0.6, 0.35, 1);
display:flex;
position:relative;}
.cal-detail-close{position:absolute;
top:0.625rem;
right:0.625rem;
width:44px;
height:44px;
display:flex;
align-items:center;
justify-content:center;
border-radius:var(--radius-sm);
border:none;
background:transparent;
color:var(--text-muted);
cursor:pointer;
transition:all 0.2s ease;
z-index:2;}
.cal-detail-close:focus-visible{outline:2px solid var(--brand-primary);
outline-offset:2px;}
.cal-detail-close:hover{background:var(--hover-bg);
color:var(--text);
transform:scale(1.05);}
.cal-detail-accent{width:4px;
flex-shrink:0;
border-radius:1rem 0 0 1rem;}
.cal-detail-content{flex:1;
min-width:0;
display:flex;
flex-direction:column;
padding:1.25rem 1.5rem 1.125rem;
gap:1rem;
overflow-y:auto;
overflow-x:hidden;
overflow-wrap:anywhere;
word-break:break-word;}
.cal-detail-top{display:flex;
flex-direction:column;
gap:0.5rem;
padding-right:2rem;}
.cal-detail-category{display:inline-flex;
align-items:center;
padding:0.1875rem 0.5rem;
border-radius:9999px;
font-size:var(--font-2xs);
font-weight:600;
letter-spacing:0.04em;
text-transform:uppercase;
background:color-mix(in srgb, var(--event-color) 20%, transparent);
color:var(--event-color);
border:1px solid color-mix(in srgb, var(--event-color) 28%, transparent);
width:fit-content;}
:root.light .cal-detail-category{background:color-mix(in srgb, var(--event-color) 18%, transparent);
border-color:color-mix(in srgb, var(--event-color) 26%, transparent);}
.cal-detail-title{font-size:var(--font-xl);
font-weight:700;
color:var(--text);
margin:0;
line-height:1.3;
letter-spacing:-0.015em;}
.cal-detail-bundle-tag{display:inline-block;
font-size:var(--font-2xs);
font-weight:700;
text-transform:uppercase;
letter-spacing:0.04em;
color:var(--brand-primary);
background:var(--brand-hover);
border-radius:4px;
padding:0.125rem 0.4rem;
margin-left:0.5rem;
vertical-align:middle;
line-height:1.4;}
.cal-detail-info-rows,
.cal-detail-assignee,
.cal-detail-desc{background:var(--hover-bg);
border-radius:var(--radius-md);
border:1px solid var(--border-subtle);}
.cal-detail-info-rows{display:flex;
flex-direction:column;
gap:0.5rem;
padding:0.75rem 0.875rem;}
.cal-detail-info-row{display:flex;
align-items:center;
gap:0.5rem;
font-size:var(--font-sm);
font-weight:500;
color:var(--text);}
.cal-detail-info-row svg{color:var(--text-muted);
flex-shrink:0;}
.cal-detail-duration{font-size:var(--font-xs-plus);
font-weight:600;
color:var(--text-muted);
background:var(--card-bg);
padding:0.125rem 0.4375rem;
border-radius:9999px;
border:1px solid var(--border-subtle);
white-space:nowrap;}
.cal-detail-price-delta{font-size:var(--font-xs-plus);
font-weight:600;
color:var(--state-success);
background:var(--state-success-bg);
padding:0.125rem 0.375rem;
border-radius:9999px;
border:1px solid var(--state-success-border);
margin-left:0.375rem;
white-space:nowrap;}
.cal-detail-section{display:flex;
flex-direction:column;
gap:0.5rem;}
.cal-detail-section-label{font-size:var(--font-xs-plus);
font-weight:600;
text-transform:uppercase;
letter-spacing:0.04em;
color:var(--text-muted);
line-height:1;}
.cal-detail-assignee{display:flex;
align-items:center;
gap:0.75rem;
padding:0.625rem 0.875rem;}
.cal-detail-avatar{width:36px;
height:36px;
border-radius:50%;
background:var(--event-color);
color:var(--brand-text);
display:flex;
align-items:center;
justify-content:center;
font-size:var(--font-xs);
font-weight:700;
flex-shrink:0;
letter-spacing:0.02em;
box-shadow:0 2px 8px color-mix(in srgb, var(--event-color) 40%, transparent),
0 0 14px color-mix(in srgb, var(--event-color) 15%, transparent);}
:root.light .cal-detail-avatar{box-shadow:0 2px 8px color-mix(in srgb, var(--event-color) 35%, transparent);}
.cal-detail-assignee-name{font-size:var(--font-base);
font-weight:500;
color:var(--text);}
.cal-detail-desc{font-size:var(--font-base);
color:var(--text);
line-height:1.65;
margin:0;
opacity:0.8;
padding:0.625rem 0.875rem;}
.cal-detail-notes{display:flex;
flex-direction:column;
gap:0.5rem;}
.cal-detail-note{padding:0.5rem 0.75rem;
border-radius:0.5rem;
border:1px solid var(--state-warning-border);
background:var(--state-warning-bg);}
.cal-detail-note-label{display:block;
font-size:var(--font-xs-plus);
font-weight:600;
text-transform:uppercase;
letter-spacing:0.04em;
color:var(--state-warning);
margin-bottom:0.125rem;}
.cal-detail-note-body{font-size:var(--font-sm);
line-height:1.5;
color:var(--text);
margin:0;}
.cal-detail-addons{display:flex;
flex-wrap:wrap;
gap:0.375rem;}
.cal-detail-addon-chip{display:inline-flex;
align-items:center;
gap:0.375rem;
padding:0.25rem 0.625rem;
border-radius:9999px;
font-size:var(--font-xs);
font-weight:500;
background:var(--hover-bg);
border:1px solid var(--border-subtle);
color:var(--text);}
.cal-detail-addon-price{color:var(--brand-primary);
font-weight:600;
font-size:var(--font-xs-plus);}
.cal-detail-addon-dur{color:var(--text-muted);
font-size:var(--font-xs-plus);}
.cal-detail-footer{display:flex;
justify-content:flex-end;
gap:0.5rem;
padding-top:0.625rem;
margin-top:0.25rem;
border-top:1px solid var(--border-subtle);
flex-wrap:wrap;}
.cal-detail-btn-cancel{background:var(--state-error-bg);
color:var(--state-error);
border:1px solid var(--state-error-border);}
.cal-detail-btn-cancel:hover{background:color-mix(in srgb, var(--state-error) 22%, transparent);}
.cal-detail-btn-noshow{background:var(--state-warning-bg);
color:var(--state-warning);
border:1px solid var(--state-warning-border);}
.cal-detail-btn-noshow:hover{background:color-mix(in srgb, var(--state-warning) 22%, transparent);}
.cal-detail-btn-complete{background:var(--state-success-bg);
color:var(--state-success);
border:1px solid var(--state-success-border);
display:inline-flex;
align-items:center;
gap:0.375rem;}
.cal-detail-btn-complete:hover{background:color-mix(in srgb, var(--state-success) 22%, transparent);}
.cal-detail-btn-complete svg{flex-shrink:0;}
.cal-detail-btn-reschedule{background:var(--hover-bg);
color:var(--text);
border:1px solid var(--border-subtle);
display:inline-flex;
align-items:center;
gap:0.375rem;}
.cal-detail-btn-reschedule:hover{background:var(--brand-hover);
border-color:var(--brand-primary);
color:var(--brand-primary);}
.cal-detail-btn-reschedule svg{flex-shrink:0;}
.cal-reschedule{animation:calRescheduleIn 0.25s ease forwards;}
@keyframes calRescheduleIn{from{opacity:0;transform:translateX(12px);}
to{opacity:1;transform:translateX(0);}}
.cal-reschedule-back{display:inline-flex;
align-items:center;
gap:0.25rem;
background:none;
border:none;
color:var(--brand-primary);
font-size:var(--font-sm);
font-weight:500;
cursor:pointer;
padding:0;
margin-bottom:-0.25rem;
transition:opacity 0.15s ease;}
.cal-reschedule-back:hover{opacity:0.7;}
.cal-reschedule-back:focus-visible{outline:2px solid var(--brand-primary);
outline-offset:2px;
border-radius:4px;}
.cal-reschedule-title{font-size:var(--font-lg);
font-weight:700;
color:var(--text);
margin:0;
line-height:1.3;
letter-spacing:-0.01em;}
.cal-reschedule-event-name{font-size:var(--font-sm);
color:var(--text-muted);
margin:-0.5rem 0 0;
line-height:1.4;}
.cal-reschedule-section{display:flex;
flex-direction:column;
gap:0.5rem;}
.cal-reschedule-label{font-size:var(--font-xs-plus);
font-weight:600;
text-transform:uppercase;
letter-spacing:0.06em;
color:var(--text-muted);}
.cal-reschedule-date-strip{display:flex;
gap:0.375rem;
overflow-x:auto;
padding:0.25rem 0;
scroll-snap-type:x mandatory;
scrollbar-width:none;}
.cal-reschedule-date-strip::-webkit-scrollbar{display:none;}
.cal-reschedule-date-chip{display:flex;
flex-direction:column;
align-items:center;
gap:0.125rem;
min-width:52px;
padding:0.5rem 0.375rem;
border-radius:var(--radius-md);
border:1px solid var(--border-subtle);
background:var(--card-bg);
cursor:pointer;
transition:all 0.15s ease;
scroll-snap-align:center;
flex-shrink:0;}
.cal-reschedule-date-chip:hover:not(:disabled){border-color:var(--brand-primary);
background:var(--brand-hover);}
.cal-reschedule-date-chip.past{opacity:0.35;
cursor:not-allowed;}
.cal-reschedule-date-chip.selected{background:color-mix(in srgb, var(--event-color) 18%, transparent);
border-color:var(--event-color);
box-shadow:0 0 0 1px color-mix(in srgb, var(--event-color) 25%, transparent);}
:root.light .cal-reschedule-date-chip.selected{background:color-mix(in srgb, var(--event-color) 14%, transparent);}
.cal-reschedule-date-dow{font-size:var(--font-2xs);
font-weight:600;
text-transform:uppercase;
letter-spacing:0.04em;
color:var(--text-muted);}
.cal-reschedule-date-chip.selected .cal-reschedule-date-dow{color:var(--event-color);}
.cal-reschedule-date-num{font-size:1rem;
font-weight:700;
color:var(--text);
line-height:1;}
.cal-reschedule-date-chip.selected .cal-reschedule-date-num{color:var(--event-color);}
.cal-reschedule-date-today{font-size:0.5rem;
font-weight:700;
text-transform:uppercase;
letter-spacing:0.05em;
color:var(--brand-primary);
line-height:1;}
.cal-reschedule-time-list{display:flex;
flex-direction:column;
gap:0.125rem;
max-height:220px;
overflow-y:auto;
padding:0.25rem;
border-radius:var(--radius-md);
border:1px solid var(--border-subtle);
background:var(--hover-bg);
scrollbar-width:thin;
scrollbar-color:var(--border-subtle) transparent;}
.cal-reschedule-time-slot{display:flex;
align-items:center;
justify-content:center;
height:44px;
min-height:44px;
padding:0 1rem;
border-radius:var(--radius-sm);
border:1px solid transparent;
background:transparent;
font-size:var(--font-base);
font-weight:500;
color:var(--text);
cursor:pointer;
transition:all 0.15s ease;
flex-shrink:0;}
.cal-reschedule-time-slot:hover{background:var(--card-bg);
border-color:var(--border-subtle);}
.cal-reschedule-time-slot.selected{background:color-mix(in srgb, var(--event-color) 18%, transparent);
border-color:var(--event-color);
color:var(--event-color);
font-weight:700;}
:root.light .cal-reschedule-time-slot.selected{background:color-mix(in srgb, var(--event-color) 14%, transparent);}
.cal-reschedule-summary{display:flex;
gap:1rem;
padding:0.625rem 0.875rem;
border-radius:var(--radius-md);
background:var(--hover-bg);
border:1px solid var(--border-subtle);}
.cal-reschedule-summary-item{display:flex;
flex-direction:column;
gap:0.125rem;
flex:1;}
.cal-reschedule-summary-label{font-size:var(--font-2xs);
font-weight:600;
text-transform:uppercase;
letter-spacing:0.05em;
color:var(--text-muted);}
.cal-reschedule-summary-value{font-size:var(--font-base);
font-weight:600;
color:var(--text);}
.cal-reschedule-spinner{display:inline-block;
width:16px;
height:16px;
border:2px solid color-mix(in srgb, var(--brand-text) 30%, transparent);
border-top-color:var(--brand-text);
border-radius:50%;
animation:calReschedSpin 0.6s linear infinite;}
@keyframes calReschedSpin{to{transform:rotate(360deg);}}
@media (max-width:767px){.cal-detail-content{padding:1rem 1rem 0.875rem;
gap:0.75rem;}
.cal-detail-info-row{min-height:44px;
display:flex;
align-items:center;
gap:0.625rem;}
.cal-detail-footer{position:sticky;
bottom:0;
flex-wrap:wrap;
gap:0.5rem;
padding:0.625rem 0;
padding-bottom:calc(0.625rem + env(safe-area-inset-bottom, 0));
background:transparent;
border-top:1px solid var(--border-subtle);
z-index:1;}
.cal-detail-footer .tm-btn,
.cal-detail-footer .queue-btn{min-height:44px;
flex:1 1 0;}
.cal-reschedule-time-list{max-height:180px;}
.cal-reschedule-date-chip{min-width:48px;
padding:0.375rem 0.25rem;}}
@media (max-width:767px){.cal-multi-chip{padding:0.25rem 0.5rem;
font-size:var(--font-sm);
gap:0.25rem;}
.cal-multi-chip-remove{width:1.5rem;
height:1.5rem;
font-size:1rem;}
.cal-form-note-row{padding:0.375rem 0.5rem;}
.cal-form-note-input{min-height:2rem;
font-size:var(--font-sm);}}
.mobile-cal{display:flex;
flex-direction:column;
height:calc(100dvh - var(--bottomnav-height));
overflow:hidden;
max-width:100vw;
width:100%;}
.mobile-cal-top-bar{display:flex;
align-items:center;
justify-content:space-between;
padding:0.5rem 0.875rem 0.375rem;
flex-shrink:0;}
.mobile-cal-month-btn{display:inline-flex;
align-items:center;
gap:0.375rem;
border:none;
background:transparent;
font-size:var(--font-lg);
font-weight:700;
color:var(--text);
letter-spacing:-0.02em;
cursor:pointer;
padding:0.25rem 0.5rem;
border-radius:var(--radius-md);
transition:background 0.2s ease;}
.mobile-cal-month-btn:active{background:var(--hover-bg);
transform:scale(0.97);}
.mobile-cal-month-btn svg{opacity:0.4;
transition:transform 0.2s ease;}
.mobile-cal-top-actions{display:flex;
align-items:center;
gap:0.5rem;}
.mobile-cal-today-chip{border:1px solid var(--border-subtle);
background:transparent;
color:var(--primary);
font-size:var(--font-2xs);
font-weight:600;
padding:0.3125rem 0.75rem;
border-radius:var(--radius-pill);
cursor:pointer;
transition:all 0.2s ease;
text-transform:uppercase;
letter-spacing:0.04em;}
.mobile-cal-today-chip:active{background:color-mix(in srgb, var(--primary) 10%, transparent);
border-color:var(--primary);
transform:scale(0.95);}
.mobile-cal-add-chip{width:34px;
height:34px;
border-radius:50%;
border:none;
background:var(--primary);
color:var(--brand-text);
display:flex;
align-items:center;
justify-content:center;
cursor:pointer;
transition:transform 0.15s ease, box-shadow 0.2s ease;
box-shadow:0 2px 8px color-mix(in oklch, var(--primary) 35%, transparent);}
.mobile-cal-add-chip:active{transform:scale(0.9);}
.mobile-cal-user-picker{position:relative;
flex:1;
min-width:0;
max-width:160px;}
.mobile-cal-user-chip{display:inline-flex;
align-items:center;
gap:0.25rem;
max-width:100%;
border:1px solid var(--border-subtle);
background:transparent;
color:var(--text-muted);
font-size:var(--font-2xs);
font-weight:500;
padding:0.25rem 0.5rem;
border-radius:var(--radius-pill);
cursor:pointer;
transition:all 0.15s ease;
white-space:nowrap;}
.mobile-cal-user-chip.active{background:var(--brand-bg);
color:var(--brand-text);
border-color:var(--brand-primary);}
.mobile-cal-user-chip:active{transform:scale(0.96);}
.mobile-cal-user-chip-label{overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
max-width:90px;}
.mobile-cal-user-chip-caret{flex-shrink:0;
opacity:0.5;
transition:transform 0.2s ease;}
.mobile-cal-user-dropdown{position:absolute;
top:calc(100% + 6px);
left:0;
right:0;
min-width:160px;
max-height:260px;
overflow-y:auto;
background:var(--popup-glass-bg);
border:1px solid var(--popup-glass-border);
border-radius:var(--radius-md);
box-shadow:var(--popup-glass-shadow);
backdrop-filter:blur(var(--popup-glass-blur));
-webkit-backdrop-filter:blur(var(--popup-glass-blur));
z-index:100;
padding:0.25rem;
animation:fadeInUp 150ms ease forwards;}
.mobile-cal-user-option{display:block;
width:100%;
text-align:left;
padding:0.5rem 0.625rem;
font-size:var(--font-2xs);
font-weight:500;
color:var(--text);
border:none;
background:transparent;
border-radius:var(--radius-sm);
cursor:pointer;
transition:background 0.12s ease;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;}
.mobile-cal-user-option:active{background:var(--hover-bg);}
.mobile-cal-user-option.selected{background:var(--brand-hover);
color:var(--brand-primary);
font-weight:600;}
.mobile-cal-picker{padding:0.25rem 0.75rem 0.5rem;
flex-shrink:0;
border-bottom:1px solid var(--border-subtle);
background:var(--glass-bg);
backdrop-filter:blur(12px) saturate(150%);
-webkit-backdrop-filter:blur(12px) saturate(150%);}
.mobile-cal-picker-nav{display:flex;
align-items:center;
justify-content:space-between;
margin-bottom:0.25rem;}
.mobile-cal-picker-arrow{width:32px;
height:32px;
display:flex;
align-items:center;
justify-content:center;
border:none;
background:transparent;
color:var(--text-muted);
border-radius:50%;
cursor:pointer;
transition:background 0.15s ease, color 0.15s ease;}
.mobile-cal-picker-arrow:active{background:var(--hover-bg);
color:var(--text);}
.mobile-cal-picker-label{font-size:var(--font-base);
font-weight:700;
color:var(--text);}
.mobile-cal-picker-weekdays{display:grid;
grid-template-columns:repeat(7, 1fr);
text-align:center;
margin-bottom:0.125rem;}
.mobile-cal-picker-wd{font-size:var(--font-3xs);
font-weight:600;
color:var(--text-muted);
text-transform:uppercase;
padding:0.25rem 0;
letter-spacing:0.04em;}
.mobile-cal-picker-grid{display:grid;
grid-template-columns:repeat(7, 1fr);
gap:2px;
justify-items:center;}
.mobile-cal-picker-day{position:relative;
width:36px;
height:36px;
display:flex;
align-items:center;
justify-content:center;
font-size:var(--font-sm);
font-weight:500;
color:var(--text);
border:none;
background:transparent;
border-radius:50%;
cursor:pointer;
transition:all 0.15s ease;}
.mobile-cal-picker-day:active{background:var(--hover-bg);}
.mobile-cal-picker-day.outside{color:var(--text-muted);
opacity:0.25;
pointer-events:none;}
.mobile-cal-picker-day.today{background:color-mix(in srgb, var(--primary) 15%, transparent);
color:var(--primary);
font-weight:700;}
.mobile-cal-picker-day.selected{background:var(--primary);
color:var(--brand-text);
font-weight:700;
box-shadow:0 2px 6px color-mix(in oklch, var(--primary) 35%, transparent);}
.mobile-cal-picker-day.selected.today{background:var(--primary);
color:var(--brand-text);}
.mobile-cal-picker-dot{position:absolute;
bottom:2px;
width:4px;
height:4px;
border-radius:50%;
background:var(--primary);
opacity:0.6;}
.mobile-cal-week-nav{display:flex;
align-items:center;
gap:0;
padding:0.25rem 0;
flex-shrink:0;
border-bottom:1px solid var(--border-subtle);}
.mobile-cal-week-arrow{display:flex;
align-items:center;
justify-content:center;
width:36px;
height:48px;
flex-shrink:0;
color:var(--text-muted);
background:transparent;
border:none;
cursor:pointer;
border-radius:var(--radius-sm);
transition:color 0.15s ease, background 0.15s ease;}
.mobile-cal-week-arrow:active{background:var(--hover-bg);
color:var(--text);}
.mobile-cal-week-days{display:flex;
flex:1;
justify-content:space-around;
gap:0;}
.mobile-cal-day{display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
flex:1;
padding:0.25rem 0 0.375rem;
border-radius:var(--radius-lg);
border:none;
background:transparent;
cursor:pointer;
transition:background 0.2s ease, box-shadow 0.2s ease;
gap:0.0625rem;
position:relative;}
.mobile-cal-day:active{transform:scale(0.93);}
.mobile-cal-day.weekend .mobile-cal-day-name{color:color-mix(in srgb, var(--text-muted) 60%, transparent);}
.mobile-cal-day-name{font-size:var(--font-3xs);
font-weight:600;
color:var(--text-muted);
text-transform:uppercase;
letter-spacing:0.04em;
line-height:1;}
.mobile-cal-day-num{font-size:0.9375rem;
font-weight:600;
color:var(--text);
width:32px;
height:32px;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
transition:all 0.2s ease;}
.mobile-cal-day-dot{width:4px;
height:4px;
border-radius:50%;
background:var(--primary);
opacity:0.5;
margin-top:-1px;}
.mobile-cal-day-dot.invisible{visibility:hidden;}
.mobile-cal-day.today .mobile-cal-day-num{color:var(--primary);
font-weight:800;}
.mobile-cal-day.today .mobile-cal-day-name{color:var(--primary);
font-weight:700;}
.mobile-cal-day.selected{background:color-mix(in srgb, var(--primary) 14%, transparent);
z-index:2;
box-shadow:0 1px 4px color-mix(in oklch, var(--primary) 15%, transparent);}
.mobile-cal-day.selected .mobile-cal-day-num{background:transparent;
color:var(--primary);
font-weight:800;
box-shadow:none;}
.mobile-cal-day.selected .mobile-cal-day-name{color:var(--primary);
font-weight:700;}
.mobile-cal-day.selected .mobile-cal-day-dot{background:var(--primary);
opacity:1;
visibility:visible;}
.mobile-cal-agenda{flex:1;
overflow-y:auto;
overflow-x:hidden;
padding:0;}
.mobile-cal-timeline{position:relative;
margin:0 0.75rem;
min-height:100%;
cursor:pointer;}
.mobile-cal-hour-line{position:absolute;
left:0;
right:0;
height:1px;
display:flex;
align-items:flex-start;
pointer-events:none;}
.mobile-cal-hour-line::after{content:"";
position:absolute;
left:50px;
right:0;
top:0;
height:1px;
background:color-mix(in srgb, var(--border-subtle) 70%, transparent);}
.mobile-cal-hour-line.drop-target::after{background:var(--brand-primary);
opacity:0.5;
height:2px;
top:-1px;
transition:opacity 150ms ease;}
.mobile-cal-event.dragging{opacity:0.3;
transition:opacity 150ms ease;}
.mobile-cal-hour-text{position:absolute;
left:0;
top:-0.375rem;
width:44px;
font-size:var(--font-3xs);
font-weight:500;
color:var(--text-muted);
text-align:right;
user-select:none;
white-space:nowrap;
font-variant-numeric:tabular-nums;
opacity:0.8;}
.mobile-cal-event{overflow:hidden;
min-height:1.75rem;
background:color-mix(in srgb, var(--event-color) 20%, var(--glass-bg));
border:1px solid color-mix(in srgb, var(--event-color) 28%, var(--border-subtle));
text-align:left;
padding:0;
box-shadow:0 1px 4px color-mix(in srgb, var(--event-color) 16%, transparent),
0 0 10px color-mix(in srgb, var(--event-color) 6%, transparent);}
:root.light .mobile-cal-event{background:color-mix(in srgb, var(--event-color) 16%, var(--glass-bg));
border:1px solid color-mix(in srgb, var(--event-color) 24%, var(--border-subtle));
box-shadow:0 1px 4px color-mix(in srgb, var(--event-color) 12%, transparent);}
.mobile-cal-event:active{transform:scale(0.97);
z-index:10 !important;
box-shadow:0 4px 16px color-mix(in srgb, var(--event-color) 20%, transparent);}
.mobile-cal-event.overlapping{box-shadow:0 1px 4px rgba(0,0,0,0.06);}
.mobile-cal-event.past{opacity:0.4;}
.mobile-cal-event.pending{opacity:0.7;
border-style:dashed;}
.mobile-cal-event.pending .mobile-cal-event-accent{animation:tm-pulse 2s ease-in-out infinite;}
.mobile-cal-event.cancelled,
.mobile-cal-event.no-show{opacity:0.35;
filter:grayscale(0.7);
border-style:dashed;}
.mobile-cal-event.cancelled .mobile-cal-event-accent,
.mobile-cal-event.no-show .mobile-cal-event-accent{background:var(--text-muted) !important;}
.mobile-cal-event.completed{opacity:0.55;
border-color:var(--state-success-border);}
.mobile-cal-event.completed .mobile-cal-event-accent{background:var(--state-success) !important;}
.mobile-cal-event-accent{width:4px;
border-radius:4px 0 0 4px;
box-shadow:1px 0 6px color-mix(in srgb, var(--event-color) 25%, transparent);}
:root.light .mobile-cal-event-accent{width:3.5px;
box-shadow:1px 0 4px color-mix(in srgb, var(--event-color) 16%, transparent);}
.mobile-cal-event-body{justify-content:center;}
.mobile-cal-event-title{font-size:var(--font-xs-plus);}
.mobile-cal-event-subtitle{font-size:var(--font-xs-plus);
opacity:0.7;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;}
.mobile-cal-event-time{font-size:var(--font-xs-plus);
display:flex;
align-items:center;
gap:0.25rem;
line-height:1.3;}
.mobile-cal-event-dur{font-size:0.5rem;
background:color-mix(in srgb, var(--event-color) 16%, var(--hover-bg));
padding:0 0.25rem;
border-radius:0.1875rem;
font-weight:600;}
:root.light .mobile-cal-event-dur{background:color-mix(in srgb, var(--event-color) 14%, var(--hover-bg));}
.mobile-cal-event.compact .mobile-cal-event-body{flex-direction:row;
align-items:center;
gap:0.375rem;
padding:0.125rem 0.375rem;}
.mobile-cal-event.compact .mobile-cal-event-title{font-size:var(--font-2xs);
flex-shrink:1;
min-width:0;}
.mobile-cal-event.compact .mobile-cal-event-subtitle{display:none;}
.mobile-cal-event.compact .mobile-cal-event-time{font-size:0.5rem;
flex-shrink:0;
opacity:0.7;}
.mobile-cal-event.compact .mobile-cal-event-accent{width:2.5px;}
.mobile-cal-event.tiny{border-radius:0.25rem;}
.mobile-cal-event.tiny .mobile-cal-event-body{padding:0 0.375rem;
justify-content:center;}
.mobile-cal-event.tiny .mobile-cal-event-title{font-size:var(--font-3xs);
font-weight:700;
line-height:1;}
.mobile-cal-event.tiny .mobile-cal-event-accent{width:2px;}
.mobile-cal-half-line{position:absolute;
left:50px;
right:0;
height:0;
border-top:1px dashed color-mix(in srgb, var(--border-subtle) 30%, transparent);
pointer-events:none;
z-index:0;}
.mobile-cal-tap-indicator{position:absolute;
left:50px;
right:0;
height:2px;
border-radius:1px;
background:var(--brand-primary);
pointer-events:none;
z-index:10;
transform-origin:center;
will-change:transform, opacity;
animation:mobileTapFlash 400ms ease forwards;}
@keyframes mobileTapFlash{0%{opacity:0.9;
transform:scaleX(0.3) translateZ(0);}
40%{opacity:0.7;
transform:scaleX(1) translateZ(0);}
100%{opacity:0;
transform:scaleX(1) translateZ(0);}}
.mobile-cal-now-line{position:absolute;
left:40px;
right:0;
height:2px;
background:var(--primary);
z-index:5;
pointer-events:none;
box-shadow:0 0 8px color-mix(in oklch, var(--primary) 45%, transparent),
0 0 2px var(--primary);}
.mobile-cal-now-dot{position:absolute;
left:-4px;
top:-3px;
width:8px;
height:8px;
border-radius:50%;
background:var(--primary);
box-shadow:0 0 6px color-mix(in oklch, var(--primary) 45%, transparent);}
@media (max-width:1024px){.calendar-page-wrapper{height:calc(100dvh - var(--bottomnav-height) - env(safe-area-inset-top, 0) - env(safe-area-inset-bottom, 0));}}
@media (max-width:1400px){.calendar-page-wrapper{padding:var(--space-4);}
.cal-header{flex-wrap:wrap;
padding:0.625rem var(--space-4);
gap:0.625rem;}
.cal-find-slot-label{display:none;}
.cal-find-slot-btn{padding:0.375rem;}
.cal-now-line{left:48px;}
.cal-now-label{left:-42px;
width:38px;}
.cal-header-left{order:1;
flex:0 1 auto;}
.cal-view-tabs{order:3;
width:100%;
justify-content:center;}
.cal-header-right{order:2;
flex:0 0 auto;
margin-left:auto;}
.cal-date-label{font-size:1.0625rem;}
.cal-grid-gutter{width:46px;}
.cal-grid-time-col{width:46px;}}
@media (max-width:640px){.calendar-page-wrapper{padding:0;
height:calc(100dvh - var(--bottomnav-height) - env(safe-area-inset-top, 0) - env(safe-area-inset-bottom, 0));
max-width:100%;
overflow:hidden;}
.calendar-page{border-radius:0;
border:none;
box-shadow:none;
max-width:100%;
overflow:hidden;
backdrop-filter:none;
-webkit-backdrop-filter:none;}
.calendar-body{max-width:100%;
overflow:hidden;}}}
@keyframes calModalIn{from{opacity:0;
transform:translateY(12px) scale(0.97);}
to{opacity:1;
transform:translateY(0) scale(1);}}
@media (prefers-reduced-motion:reduce){.calendar-page,
.cal-header,
.cal-grid-header,
.cal-month-header,
.mobile-cal-picker{backdrop-filter:none;
-webkit-backdrop-filter:none;}
.cal-detail-modal,
.picker-dropdown,
.cal-event-popup{animation:none;}
.cal-event,
.cal-month-event,
.cal-nav-btn,
.cal-view-tab,
.cal-add-btn,
.mobile-cal-day,
.mobile-cal-event,
.datepicker-day,
.timepicker-cell,
.timepicker-preset{transition:none;}}
@layer components{.cal-grid-day-header.blocked{background:var(--state-warning-bg);
border-bottom:2px solid var(--state-warning-border);}
.cal-day-blocked-label{font-size:var(--font-3xs);
font-weight:600;
line-height:1.1;
color:var(--state-warning);
max-width:100%;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
padding:0.125rem 0.375rem;
border-radius:0.25rem;
background:var(--state-warning-bg);
margin-top:0.125rem;}
.cal-grid-day-col--blocked{background:repeating-linear-gradient(
-45deg,
var(--state-warning-bg),
var(--state-warning-bg) 6px,
transparent 6px,
transparent 14px
);
pointer-events:auto;
cursor:not-allowed;}
.cal-grid-day-col--blocked .cal-time-slot{cursor:not-allowed;}
.cal-grid-day-col--blocked .cal-time-slot:hover{background:transparent;}
.cal-grid-day-col--blocked .cal-slot-hover-label{display:none;}
.cal-month-cell.blocked{background:var(--state-warning-bg);
cursor:not-allowed;}
.cal-month-cell.blocked:hover{background:var(--state-warning-bg);}
.cal-month-blocked-label{font-size:var(--font-3xs);
font-weight:600;
line-height:1.1;
color:var(--state-warning);
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
max-width:100%;
padding:0.0625rem 0.25rem;
border-radius:0.1875rem;
background:var(--state-warning-bg);
border:1px solid var(--state-warning-border);
margin-bottom:0.125rem;}
.mobile-cal-day.blocked{border-color:var(--state-warning);}
.mobile-cal-day-dot.blocked{visibility:visible;
width:6px;
height:6px;
border-radius:50%;
background:var(--state-warning);
font-size:0;}
.cal-multi-chips{display:flex;
flex-wrap:wrap;
gap:var(--space-1);
margin-bottom:var(--space-2);}
.cal-multi-chip{display:inline-flex;
align-items:center;
gap:4px;
padding:2px 8px;
font-size:var(--font-xs);
border-radius:var(--radius-sm);
background:var(--glass-bg);
border:1px solid var(--border-subtle);
color:var(--text);
max-width:100%;
overflow:hidden;
text-overflow:ellipsis;}
.cal-multi-chip-remove{all:unset;
cursor:pointer;
display:inline-flex;
align-items:center;
justify-content:center;
width:16px;
height:16px;
border-radius:50%;
font-size:var(--font-base);
line-height:1;
color:var(--text-muted);
transition:color 0.15s, background 0.15s;}
.cal-multi-chip-remove:hover{color:var(--state-error);
background:var(--state-error-bg);}
.aem-svc-picker{display:flex;
flex-direction:column;
gap:0.375rem;}
.aem-svc-label{font-size:var(--font-2xs);
font-weight:700;
text-transform:uppercase;
letter-spacing:0.07em;
color:var(--text-muted);}
.aem-svc-trigger{display:flex;
align-items:center;
gap:0.5rem;
width:100%;
padding:0.625rem 0.75rem;
border-radius:var(--radius-md);
border:1px solid var(--input-border);
background:var(--input-bg);
color:var(--text);
cursor:pointer;
transition:border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
font-size:var(--font-base);}
.aem-svc-trigger:hover{border-color:color-mix(in srgb, var(--brand-primary) 40%, var(--input-border));}
.aem-svc-trigger.open{border-color:var(--brand-primary);
box-shadow:0 0 0 2px color-mix(in srgb, var(--brand-primary) 15%, transparent);}
.aem-svc-trigger:focus-visible{outline:2px solid var(--brand-primary);
outline-offset:2px;}
.aem-svc-trigger-dot{width:10px;
height:10px;
border-radius:50%;
flex-shrink:0;}
.aem-svc-trigger-name{flex:1;
font-weight:550;
text-align:left;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;}
.aem-svc-trigger-dur{font-size:var(--font-xs);
color:var(--text-muted);
flex-shrink:0;}
.aem-svc-trigger-badge{font-size:var(--font-3xs);
font-weight:700;
text-transform:uppercase;
letter-spacing:0.04em;
color:var(--brand-primary);
background:var(--brand-hover);
border-radius:3px;
padding:0.0625rem 0.3rem;
flex-shrink:0;
line-height:1.4;}
.aem-svc-trigger-placeholder{flex:1;
color:var(--text-muted);
text-align:left;
font-weight:400;}
.aem-svc-trigger-chevron{flex-shrink:0;
color:var(--text-muted);
opacity:0.5;
transition:transform 0.25s ease;}
.aem-svc-trigger.open .aem-svc-trigger-chevron{transform:rotate(180deg);}
.aem-svc-panel{border-radius:var(--radius-md);
border:1px solid var(--card-border);
background:var(--card-bg);
box-shadow:var(--card-shadow);
overflow:hidden;
animation:aemPanelIn 0.2s ease both;}
@keyframes aemPanelIn{from{opacity:0;transform:translateY(-4px);}
to{opacity:1;transform:translateY(0);}}
.aem-svc-panel-search{display:flex;
align-items:center;
gap:0.5rem;
padding:0.5rem 0.75rem;
border-bottom:1px solid var(--border-subtle);
color:var(--text-muted);}
.aem-svc-panel-search svg:first-child{flex-shrink:0;
opacity:0.45;}
.aem-svc-panel-search-input{flex:1;
min-width:0;
border:none;
background:transparent;
font-size:var(--font-sm);
color:var(--text);
outline:none;}
.aem-svc-panel-search-input::placeholder{color:var(--text-muted);
opacity:0.55;}
.aem-svc-panel-search-clear{display:flex;
align-items:center;
justify-content:center;
width:20px;
height:20px;
border-radius:50%;
border:none;
background:color-mix(in srgb, var(--text-muted) 12%, transparent);
color:var(--text-muted);
cursor:pointer;
flex-shrink:0;
transition:background 0.15s ease;}
.aem-svc-panel-search-clear:hover{background:color-mix(in srgb, var(--text-muted) 22%, transparent);}
.aem-svc-panel-list{max-height:280px;
overflow-y:auto;
scrollbar-width:thin;
overscroll-behavior:contain;}
.aem-svc-section{}
.aem-svc-section-header{display:flex;
align-items:center;
gap:0.4375rem;
padding:0.4375rem 0.75rem;
position:sticky;
top:0;
z-index:1;
background:var(--card-bg);
border-bottom:1px solid var(--border-subtle);}
.aem-svc-section-dot{width:6px;
height:6px;
border-radius:50%;
flex-shrink:0;}
.aem-svc-section-name{font-size:var(--font-xs-plus);
font-weight:700;
text-transform:uppercase;
letter-spacing:0.06em;
color:var(--text-muted);}
.aem-svc-row{display:flex;
align-items:center;
gap:0.625rem;
width:100%;
padding:0.5625rem 0.75rem;
border:none;
background:transparent;
cursor:pointer;
color:var(--text);
transition:background 0.15s ease;
position:relative;
text-align:left;
font-size:var(--font-sm);}
.aem-svc-row:not(:last-child)::after{content:"";
position:absolute;
bottom:0;
left:2.25rem;
right:0.75rem;
height:1px;
background:var(--border-subtle);
opacity:0.5;}
.aem-svc-row:hover{background:color-mix(in srgb, var(--brand-primary) 6%, transparent);}
.aem-svc-row:focus-visible{outline:2px solid var(--brand-primary);
outline-offset:-2px;}
.aem-svc-row.active{background:color-mix(in srgb, var(--brand-primary) 8%, transparent);}
.aem-svc-row-bar{width:3px;
height:22px;
border-radius:2px;
flex-shrink:0;}
.aem-svc-row-name{flex:1;
font-weight:500;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;}
.aem-svc-row-dur{font-size:var(--font-xs-plus);
color:var(--text-muted);
flex-shrink:0;
font-variant-numeric:tabular-nums;}
.aem-svc-row-badge{font-size:var(--font-3xs);
font-weight:700;
text-transform:uppercase;
letter-spacing:0.04em;
color:var(--brand-primary);
background:var(--brand-hover);
border-radius:3px;
padding:0.0625rem 0.3rem;
flex-shrink:0;
line-height:1.4;}
.aem-svc-section-bundle-icon{color:var(--brand-primary);
flex-shrink:0;}
.aem-svc-row-check{flex-shrink:0;
color:var(--brand-primary);}
.aem-svc-panel-empty{padding:1.5rem 1rem;
text-align:center;}
.aem-svc-panel-empty p{font-size:var(--font-sm);
color:var(--text-muted);}
.aem-divider{display:flex;
align-items:center;
gap:var(--space-3);
margin:var(--space-1) 0;}
.aem-divider::before,
.aem-divider::after{content:"";
flex:1;
height:1px;
background:var(--border-subtle);}
.aem-divider-text{font-size:var(--font-2xs);
font-weight:700;
text-transform:uppercase;
letter-spacing:0.08em;
color:var(--text-muted);
white-space:nowrap;
flex-shrink:0;}
@media (max-width:767px){.aem-svc-trigger{padding:0.5625rem 0.625rem;
font-size:var(--font-sm);}
.aem-svc-panel-list{max-height:240px;}
.aem-svc-row{padding:0.5rem 0.625rem;
font-size:var(--font-sm);}
.aem-divider{margin:0;}
.picker-native-wrap{gap:0.375rem;
padding:0.5rem 0.5rem;
font-size:var(--font-sm);}
.picker-native-input::-webkit-calendar-picker-indicator{width:16px;
height:16px;
padding:0;
margin:0;}}
.cal-recurrence-actions{display:flex;
flex-direction:column;
gap:var(--space-2);
margin-top:var(--space-3);}
.cal-recurrence-actions .tm-btn{width:100%;
justify-content:center;}
.cal-form-hint{margin:var(--space-1) 0 0;
font-size:var(--font-xs);
color:var(--text-muted);}
.cal-form-notes{display:flex;
flex-direction:column;
gap:0.5rem;}
.cal-form-note-row{padding:0.5rem 0.625rem;
border-radius:0.5rem;
border:1px solid var(--state-warning-border);
background:var(--state-warning-bg);}
.cal-form-note-label{display:block;
font-size:var(--font-xs-plus);
font-weight:600;
text-transform:uppercase;
letter-spacing:0.04em;
color:var(--state-warning);
margin-bottom:0.25rem;}
.cal-form-note-input{resize:vertical;
min-height:2.25rem;
font-size:var(--font-sm);
line-height:1.5;}
.cal-detail-recurrence{display:inline-flex;
align-items:center;
gap:4px;
padding:2px 8px;
font-size:var(--font-xs-plus);
font-weight:500;
border-radius:var(--radius-sm);
background:var(--glass-bg);
border:1px solid var(--border-subtle);
color:var(--text-muted);
text-transform:capitalize;}}