/* A six-row canvas bounds the sidebar. Content scrolls inside each card. */
.event-side.widget-sidebar { display:block; min-width:0; }
.widget-sidebar-heading { display:flex; justify-content:space-between; gap:8px; margin:0 0 12px; color:#566477; font-size:10px; font-weight:700; letter-spacing:.08em; }
.widget-sidebar-heading > :last-child { font-weight:400; letter-spacing:0; }
.widget-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:132px; gap:12px; }
.event-widget { position:relative; grid-column:var(--widget-column) / span var(--widget-width); grid-row:var(--widget-row) / span var(--widget-height); min-width:0; min-height:0; border:1px solid #d9dfe8; border-radius:18px; background:#fff; box-shadow:0 3px 12px #14223806; overflow:hidden; }
.widget-content { height:100%; padding:17px 16px; display:flex; flex-direction:column; gap:12px; min-width:0; min-height:0; }
.widget-heading { flex-shrink:0; padding-right:24px; margin:0; font-size:13px; font-weight:700; line-height:1.4; letter-spacing:0; overflow-wrap:anywhere; color:#183765; }
.widget-heading > span { display:block; font-size:10px; color:#637189; font-weight:400; margin-top:3px; }
.widget-settings { position:absolute; z-index:2; top:0; right:0; width:34px; height:34px; padding:0; border:0; cursor:pointer; background:transparent; color:#183765; display:grid; place-items:center; }
.widget-settings::before { content:''; position:absolute; inset:0; background:#dce5f1; border-radius:0; clip-path:polygon(0 0,100% 0,100% 100%,100% 100%); transition:clip-path .18s,background .18s; }
.widget-settings svg { position:relative; width:24px; height:24px; fill:currentColor; opacity:0; transition:opacity .18s; pointer-events:none; }
.widget-settings:hover,.widget-settings:focus-visible { width:44px; height:44px; }
.widget-settings:hover::before,.widget-settings:focus-visible::before { clip-path:polygon(0 0,100% 0,100% 100%,0 100%); border-radius:0 0 0 10px; background:#cbd9ec; }
.widget-settings:hover svg,.widget-settings:focus-visible svg { opacity:1; }
.widget-settings:focus-visible { outline:3px solid #ef8a28; outline-offset:-3px; border-radius:0 0 0 10px; }
.widget-add { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; min-height:46px; margin-top:12px; border:1px dashed #a5b4c9; border-radius:14px; background:#f6f8fb; color:#183765; font-size:13px; font-weight:600; cursor:pointer; }
.widget-add > span { font-size:24px; line-height:1; }
.widget-add:hover { background:#e9eff7; border-color:#183765; }
.widget-add:disabled { cursor:default; opacity:.55; }
.widget-capacity { text-align:center; margin:8px 0 0; font-size:11px; line-height:1.5; color:#566477; }
.widget-empty-sidebar { padding:24px 12px; color:#566477; text-align:center; font-size:13px; }
.widget-list { flex:1; min-height:0; overflow:auto; overscroll-behavior:contain; scrollbar-width:thin; margin:0; padding:0 3px 0 0; list-style:none; }
.widget-list:focus-visible { outline:2px solid #ef8a28; outline-offset:2px; border-radius:5px; }
.widget-list li { font-size:12px; line-height:1.5; overflow-wrap:anywhere; }
.widget-empty { color:#637189; font-size:12px; line-height:1.5; margin:auto 0; }
.widget-empty-icon { display:block; font-size:26px; color:#8299b6; margin:6px 0; }
.widget-item-title { display:block; font-size:13px; line-height:1.45; color:#183765; }
.widget-list time,.widget-byline { display:block; margin-top:6px; font-size:10px; color:#637189; }
.widget-list p { font-size:12px; line-height:1.6; margin:5px 0; white-space:pre-line; }
.widget-members { background:linear-gradient(145deg,#f0f5fc,#fff); }
.widget-people-summary { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.widget-people-summary > strong { font-size:32px; line-height:1; color:#183765; font-variant-numeric:tabular-nums; }
.widget-people-summary > span { width:100%; color:#637189; font-size:11px; }
.widget-avatar-stack { display:flex; padding-left:6px; }
.widget-avatar-stack > span { width:25px; height:25px; border:2px solid #fff; border-radius:50%; display:grid; place-items:center; margin-left:-6px; color:#fff; background:#183765; font-size:10px; }
.widget-avatar-stack > span:nth-child(even) { background:#54759d; }
.widget-people-summary + .widget-people { border-top:1px solid #dfe6ef; padding-top:4px; }
.widget-people > li { display:flex; gap:8px; padding:10px 0; border-bottom:1px solid #e8edf4; }
.widget-people > li > div { min-width:0; }
.widget-avatar { flex-shrink:0; width:28px; height:28px; display:grid; place-items:center; border-radius:9px; background:#e4ecf7; color:#183765; font-weight:700; }
.widget-team-labels { display:flex; flex-wrap:wrap; gap:4px; margin-top:4px; }
.widget-team-labels > span { font-size:10px; line-height:1.5; border-left:3px solid var(--team-color,#a5b4c9); padding-left:5px; color:#566477; }
.widget-countdown { background:#183765; border-color:#183765; color:white; }
.widget-countdown .widget-heading { color:#d2dff1; }
.widget-countdown .widget-settings::before { background:#375783; }
.widget-countdown .widget-settings { color:white; }
.widget-countdown .widget-settings:hover::before,.widget-countdown .widget-settings:focus-visible::before { background:#54759d; }
.widget-countdown-title { font-size:17px; font-weight:600; line-height:1.35; margin:0; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.widget-clock { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:4px; margin:auto 0; }
.widget-clock strong { display:block; font-size:clamp(20px,1.6vw,28px); line-height:1.2; font-variant-numeric:tabular-nums; color:var(--peach); }
.widget-clock span { display:block; font-size:10px; color:#d2dff1; margin-top:4px; }
.widget-countdown-days { display:none; }
.widget-event-date { display:flex; align-items:center; gap:10px; border-top:1px solid #ffffff30; padding-top:12px; }
.widget-date-day { display:grid; place-items:center; flex-shrink:0; width:36px; height:36px; background:#ffffff15; border-radius:9px; font-size:21px; font-weight:600; }
.widget-event-date > div { min-width:0; }
.widget-event-date strong,.widget-event-date div > span { display:block; font-size:11px; overflow-wrap:anywhere; }
.widget-event-date div > span { font-size:10px; color:#d2dff1; }
.widget-countdown-state { font-size:10px; line-height:1.4; color:#d2dff1; margin:0; }
.widget-agenda > li { border-bottom:1px solid #e8edf4; padding:12px 0; }
.widget-agenda > li:first-child { padding-top:0; }
.widget-agenda a { display:flex; gap:10px; color:inherit; }
.widget-agenda a > div:last-child { min-width:0; }
.widget-agenda a:hover .widget-item-title { text-decoration:underline; }
.widget-agenda-date { flex-shrink:0; width:35px; color:#183765; background:#edf2fa; text-align:center; border-radius:9px; padding:6px 3px; align-self:flex-start; }
.widget-agenda-date strong,.widget-agenda-date span { display:block; line-height:1.3; font-size:18px; }
.widget-agenda-date span { font-size:10px; }
.widget-item-type { display:block; font-size:10px; color:#637189; margin-bottom:4px; }
.widget-overdue .widget-item-type { color:#ae342f; }
.widget-overdue .widget-agenda-date { color:#ae342f; background:#fdf0ef; }
.widget-agenda-team { display:block; font-size:10px; color:#637189; margin-top:4px; }
.widget-announcements { background:#fffbf5; }
.widget-compose { align-self:flex-start; padding:4px 8px; border:1px solid #dfd4c4; border-radius:7px; background:#fff; color:#183765; font-size:11px; cursor:pointer; }
.widget-announcements .widget-list > li { padding:12px 0; border-bottom:1px solid #eae1d5; }
.widget-announcements .widget-list > li:first-child { padding-top:0; }
.widget-news-label { display:block; color:#956018; font-size:9px; font-weight:700; letter-spacing:.06em; margin-bottom:6px; }
.widget-activity > li { display:flex; gap:8px; padding:12px 0; border-bottom:1px solid #e8edf4; }
.widget-activity > li:first-child { padding-top:0; }
.widget-activity-dot { flex-shrink:0; width:6px; height:6px; border-radius:50%; margin-top:6px; }
.widget-activity > li > div { min-width:0; }
.widget-size-small .widget-content { padding:13px 12px; gap:8px; }
.widget-size-small .widget-heading { font-size:11px; line-height:1.35; padding-right:12px; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.widget-size-small .widget-heading > span { display:none; }
.widget-size-small .widget-list,.widget-size-medium .widget-list { scrollbar-width:none; }
.widget-size-small .widget-list > li:not(:first-child),.widget-size-medium .widget-list > li:not(:first-child) { display:none; }
.widget-size-small .widget-list > li,.widget-size-medium .widget-list > li { padding:0; border:0; }
.widget-size-small .widget-list p,.widget-size-medium .widget-list p { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.widget-size-small .widget-list time,.widget-size-small .widget-byline,.widget-size-small .widget-news-label,.widget-size-small .widget-item-type,.widget-size-small .widget-agenda-team { display:none; }
.widget-size-small .widget-item-title { font-size:12px; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.widget-size-small .widget-activity > li > div > strong { font-size:10px; }
.widget-size-small .widget-activity p { font-size:11px; }
.widget-size-small .widget-activity-dot { display:none; }
.widget-size-small .widget-people-summary { gap:4px; }
.widget-size-small .widget-avatar-stack,.widget-size-small .widget-people,.widget-size-medium .widget-people { display:none; }
.widget-size-small .widget-people-summary > strong { font-size:30px; }
.widget-size-small .widget-people-summary > span { font-size:10px; }
.widget-size-medium .widget-people-summary { flex:1; gap:14px; }
.widget-size-medium .widget-people-summary > span { width:auto; }
.widget-size-small.widget-members .widget-people-summary,.widget-size-medium.widget-members .widget-people-summary { display:none; }
.widget-size-small .widget-people,.widget-size-medium .widget-people { display:block; border-top:0; padding-top:0; }
.widget-size-small .widget-people > li,.widget-size-medium .widget-people > li { padding:0; }
.widget-size-small .widget-people .widget-avatar { display:none; }
.widget-size-small .widget-people strong { display:block; font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.widget-size-small .widget-team-labels { max-height:30px; overflow:hidden; }
.widget-size-small.widget-countdown .widget-heading { font-size:10px; }
.widget-size-small .widget-countdown-days { display:flex; flex-direction:column; gap:2px; }
.widget-countdown-days strong { font-size:34px; line-height:1; font-weight:700; color:var(--peach); font-variant-numeric:tabular-nums; }
.widget-countdown-days > span { font-size:10px; color:#d2dff1; }
.widget-size-small .widget-clock,.widget-size-small .widget-countdown-title,.widget-size-small .widget-event-date { display:none; }
.widget-size-small .widget-countdown-state { font-size:9px; }
.widget-size-medium .widget-countdown-title,.widget-size-medium .widget-event-date,.widget-size-medium .widget-countdown-state { display:none; }
.widget-size-medium .widget-clock { margin:auto 0 0; }
.widget-size-small .widget-agenda-date { display:none; }
.widget-size-small .widget-compose { font-size:10px; padding:2px 4px; }
.widget-size-small.widget-announcements .widget-content { gap:5px; }
.widget-size-small .widget-announcements p { display:none; }
.widget-size-medium.widget-announcements .widget-content { position:relative; }
.widget-size-medium .widget-compose { position:absolute; right:35px; top:12px; }
.widget-size-medium.widget-announcements .widget-heading { padding-right:100px; }
.widget-size-medium .widget-announcements p { -webkit-line-clamp:1; }
.widget-size-medium .widget-news-label,.widget-size-medium .widget-byline { display:none; }
.widget-size-small .widget-empty,.widget-size-medium .widget-empty { font-size:11px; }
.widget-size-small .widget-empty-icon,.widget-size-medium .widget-empty-icon { display:none; }
.widget-size-medium .widget-activity { padding-top:0; }
.widget-size-medium.widget-feed .widget-heading > span { display:inline; margin-left:6px; }
/* The settings surface stays outside the bounded canvas. */
.widget-editor { width:min(560px,calc(100vw - 32px)); max-width:none; max-height:90dvh; overflow:auto; border:1px solid #d9dfe8; border-radius:20px; padding:0; color:#172236; box-shadow:0 24px 90px #14223838; background:#fff; }
.widget-editor::backdrop { background:#14223899; backdrop-filter:blur(3px); }
.widget-editor-header { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; padding:22px 24px 18px; border-bottom:1px solid #e7ebf1; }
.widget-editor-header h2 { margin:4px 0 0; font-size:21px; }
.widget-editor-header .eyebrow { margin:0; font-size:10px; color:#637189; }
.widget-close { border:0; border-radius:50%; width:32px; height:32px; background:#edf2f8; color:#183765; font-size:24px; cursor:pointer; line-height:1; flex-shrink:0; }
.widget-editor-body { padding:20px 24px; }
.widget-size-picker { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; border:0; padding:0; margin:0; min-width:0; }
.widget-size-picker legend { font-size:14px; font-weight:600; margin-bottom:10px; }
.widget-size-picker label { position:relative; min-width:0; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; gap:6px; min-height:110px; border:1px solid #d9dfe8; border-radius:12px; padding:12px 5px; cursor:pointer; }
.widget-size-picker input { position:absolute; width:1px; height:1px; min-height:0; opacity:0; }
.widget-size-picker label:has(input:checked) { background:#edf3fd; border-color:#183765; box-shadow:inset 0 0 0 1px #183765; }
.widget-size-picker label:has(input:disabled) { opacity:.35; cursor:default; }
.widget-size-picker label:has(input:focus-visible) { outline:3px solid #ef8a28; outline-offset:2px; }
.widget-size-picker strong { font-size:12px; }
.widget-size-picker small { font-size:10px; color:#637189; }
.widget-size-icon { display:block; border:2px solid #54759d; border-radius:4px; background:#dce6f5; }
.icon-small { width:20px; height:20px; }
.icon-medium { width:40px; height:20px; }
.icon-large { width:40px; height:40px; }
.icon-tall { width:40px; height:54px; }
.widget-preview-stage { display:flex; align-items:center; flex-direction:column; gap:10px; background:#f1f4f9; border-radius:14px; padding:18px; }
.widget-preview-stage > span { font-size:10px; color:#637189; }
.widget-preview { width:250px; max-width:100%; transition:height .15s,width .15s; }
.widget-preview .event-widget { height:100%; }
.widget-preview[data-size=small] { width:119px; height:132px; }
.widget-preview[data-size=medium] { height:132px; }
.widget-preview[data-size=large] { height:276px; }
.widget-preview[data-size=tall] { height:420px; }
.widget-preview .widget-content { pointer-events:none; }
.widget-fit-message { font-size:13px; color:#ae342f; min-height:20px; margin:10px 0; }
.widget-order { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.widget-order > span { font-size:12px; color:#637189; margin-right:auto; }
.widget-editor-actions { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:16px 24px; margin:0; background:#f8fafc; border-top:1px solid #e7ebf1; }
.widget-editor-actions > div { display:flex; gap:8px; }
.widget-editor-actions .button { font-size:13px; min-height:40px; padding:10px 14px; }
.widget-remove { border:0; padding:8px 0; background:none; color:#ae342f; font-size:12px; cursor:pointer; }
.widget-editor [hidden] { display:none!important; }
@media(max-width:1199px) { .event-side.widget-sidebar { max-width:360px; width:100%; justify-self:end; } }
@media(max-width:760px) { .event-side.widget-sidebar { max-width:none; } .widget-content { padding:18px; } .widget-clock strong { font-size:28px; } .widget-editor-header,.widget-editor-body { padding:18px; } .widget-editor-actions { padding:14px 18px; flex-wrap:wrap; } }
@media(hover:none) { .widget-settings { width:44px; height:44px; } .widget-settings svg { opacity:1; } .widget-settings::before { clip-path:polygon(0 0,100% 0,100% 100%,0 100%); border-radius:0 0 0 10px; } }
@media(prefers-reduced-motion:reduce) { .widget-settings::before,.widget-settings svg,.widget-preview { transition:none; } }
