/* Coming up: birthdays, work anniversaries, new joiners and public holidays on the home page (celebrations.php). Theme tokens carry dark mode. */
.cw-cel{ --cel-bday:#e0508a; --cel-anni:#6c4ef5; --cel-join:#14a37f; --cel-hol:#d98a00; margin:0; padding:20px 22px; border:1px solid var(--line,rgba(19,20,48,.1)); border-radius:var(--radius,16px); background:var(--card,#fff); color:var(--ink,#131430); min-width:0; }
.jx-dash > .cw-cel{ margin:0; }
.cw-cel__head{ position:relative; display:flex; align-items:center; gap:14px; }
.cw-cel__ico{ display:grid; place-items:center; flex:none; width:44px; height:44px; border:1px solid var(--line,rgba(19,20,48,.1)); border-radius:12px; color:var(--cel-bday); }
.cw-cel__ico .cw-ico{ width:20px; height:20px; }
.cw-cel__titles{ flex:1; min-width:0; }
.cw-cel__head h2{ margin:0; font-size:19px; }
.cw-cel__head p{ margin:2px 0 0; color:var(--muted,#5d5f72); font-size:14px; }
.cw-cel__empty{ margin:14px 0 0; color:var(--muted,#5d5f72); }

.cw-cel__menu{ position:relative; flex:none; align-self:flex-start; }
.cw-cel__menu > summary{ display:grid; place-items:center; width:36px; height:36px; border-radius:10px; cursor:pointer; list-style:none; color:var(--muted,#5d5f72); }
.cw-cel__menu > summary::-webkit-details-marker{ display:none; }
.cw-cel__menu > summary:hover, .cw-cel__menu[open] > summary{ background:var(--soft,rgba(19,20,48,.05)); color:var(--ink,#131430); }
.cw-cel__menu .cw-ico{ width:18px; height:18px; }
.cw-cel__pop{ position:absolute; z-index:20; right:0; top:calc(100% + 6px); display:grid; gap:10px; width:min(300px, calc(100vw - 48px)); padding:14px; border:1px solid var(--line,rgba(19,20,48,.12)); border-radius:14px; background:var(--card,#fff); color:var(--ink,#131430); box-shadow:0 18px 40px rgba(19,20,48,.16); }
.cw-cel__pop-h{ margin:0; font-size:13px; font-weight:600; color:var(--muted,#5d5f72); }
.cw-cel__pop label:not(.cw-cel__pop-h){ display:flex; gap:10px; align-items:flex-start; font-size:14px; line-height:1.35; }
.cw-cel__pop input[type="checkbox"]{ margin-top:2px; accent-color:var(--accent,#6c4ef5); }
.cw-cel__pop textarea{ width:100%; box-sizing:border-box; padding:10px 12px; border:1px solid var(--line,rgba(19,20,48,.15)); border-radius:10px; background:transparent; color:inherit; font:inherit; font-size:14px; resize:vertical; }
.cw-cel__pop button{ justify-self:start; min-height:36px; padding:0 18px; border:0; border-radius:999px; background:var(--accent-strong,#6c4ef5); color:#fff; font:inherit; font-size:14px; font-weight:600; cursor:pointer; }
.cw-cel__pop button:hover{ filter:brightness(1.08); }

.cw-cel__groups{ display:grid; gap:6px 28px; margin-top:14px; }
@media (min-width: 1100px){
	/* Columns flow top to bottom, so a short "Today" never leaves a hole under it. */
	.cw-cel__groups{ display:block; columns:2 260px; column-gap:28px; }
	.cw-cel__group{ break-inside:avoid; margin-bottom:6px; }
}
.cw-cel__group{ min-width:0; }
.cw-cel__group h3{ margin:8px 0 2px; font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--muted,#5d5f72); }
.cw-cel__group--today h3{ color:var(--cel-bday); }
.cw-cel__list{ margin:0; padding:0; list-style:none; }
.cw-cel__item{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 12px; padding:10px 0; border-top:1px solid var(--line,rgba(19,20,48,.1)); }
.cw-cel__group h3 + .cw-cel__list .cw-cel__item:first-child{ border-top:0; }
.cw-cel__pic{ position:relative; flex:none; width:40px; height:40px; }
.cw-cel__avatar{ display:grid; place-items:center; width:40px; height:40px; border-radius:50%; background:color-mix(in srgb,var(--accent,#6c4ef5) 14%,transparent) center/cover no-repeat; color:var(--accent,#6c4ef5); font-weight:700; font-size:15px; }
.cw-cel__avatar.is-holiday{ border-radius:12px; background:color-mix(in srgb,var(--cel-hol) 16%,transparent); color:var(--cel-hol); }
.cw-cel__avatar .cw-ico{ width:20px; height:20px; }
.cw-cel__kind{ position:absolute; right:-4px; bottom:-4px; display:grid; place-items:center; width:20px; height:20px; border:2px solid var(--card,#fff); border-radius:50%; color:#fff; background:var(--cel-anni); }
.cw-cel__kind .cw-ico{ width:11px; height:11px; stroke-width:2.4; }
.is-birthday .cw-cel__kind{ background:var(--cel-bday); }
.is-joiner .cw-cel__kind{ background:var(--cel-join); }
.is-holiday .cw-cel__kind{ display:none; }
.cw-cel__text{ display:grid; flex:1 1 140px; min-width:0; line-height:1.3; }
.cw-cel__text strong{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:15px; }
.cw-cel__text strong a{ color:inherit; text-decoration:none; }
.cw-cel__text strong a:hover{ text-decoration:underline; }
.cw-cel__what{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--muted,#5d5f72); font-size:13px; }
.cw-cel__date{ flex:none; color:var(--muted,#5d5f72); font-size:13px; font-variant-numeric:tabular-nums; }
.cw-cel__wish{ position:relative; flex:none; }
.cw-cel__btn{ display:inline-flex; align-items:center; min-height:34px; padding:0 14px; border:1px solid var(--ink,#131430); border-radius:999px; color:var(--ink,#131430); font-size:13px; font-weight:600; cursor:pointer; list-style:none; white-space:nowrap; }
.cw-cel__wish[open]{ flex-basis:100%; display:grid; gap:8px; }
.cw-cel__wish[open] > .cw-cel__btn{ justify-self:end; }
.cw-cel__wish .cw-cel__pop{ position:static; width:100%; box-sizing:border-box; box-shadow:none; background:var(--soft,rgba(19,20,48,.04)); }
.cw-cel__btn::-webkit-details-marker{ display:none; }
.cw-cel__btn:hover, .cw-cel__wish[open] > .cw-cel__btn{ background:var(--ink,#131430); color:var(--bg,#fff); }
.cw-cel__btn:focus-visible, .cw-cel__menu > summary:focus-visible{ outline:2px solid var(--accent,#6c4ef5); outline-offset:2px; }

/* Phones: the date and button drop under the name, aligned with the text. */
@media (max-width: 520px){
	.cw-cel{ padding:16px; }
	.cw-cel__text{ flex-basis:calc(100% - 52px); }
	.cw-cel__date{ margin-left:52px; }
	.cw-cel__wish{ margin-left:auto; }
}

[data-theme="dark"] .cw-cel{ --cel-bday:#ff7aae; --cel-anni:#9d87ff; --cel-join:#3fd3a8; --cel-hol:#ffb84d; }
[data-theme="dark"] .cw-cel__pop{ background:#1d1230; box-shadow:0 18px 40px rgba(0,0,0,.5); }
[data-theme="dark"] .cw-cel__wish .cw-cel__pop{ background:rgba(255,255,255,.04); }
[data-theme="dark"] .cw-cel__kind{ color:#111; }

/* Profile: "Hide my birthday". */
.cw-profile__grid .cw-field.cw-field--check{ grid-column:span 2; display:grid; gap:4px; align-content:end; padding-bottom:4px; }
.cw-profile__grid .cw-field.cw-field--check label{ display:flex; flex-direction:row; gap:8px; align-items:center; margin:0; font-size:14px; font-weight:600; letter-spacing:0; text-transform:none; color:var(--ink,#131430); }
.cw-profile__grid .cw-field.cw-field--check input{ width:18px; height:18px; margin:0; accent-color:var(--accent,#6c4ef5); }
.cw-profile__grid .cw-field.cw-field--check .cw-muted{ font-size:13px; }
@media (max-width: 720px){ .cw-profile__grid .cw-field.cw-field--check{ grid-column:auto; } }

/* What you missed: a third column on wide screens */
@media (min-width: 1100px){ .cw-cel__groups{ columns:3 240px; } }
.cw-cel__group--past h3{ color:var(--muted,#5d5f72); }
.cw-cel__group--past .cw-cel__avatar{ filter:grayscale(.4); } /* Full-strength text for contrast; only the avatars fade. */
.cw-cel__more{ display:inline-block; margin:6px 0 4px; color:var(--accent,#6c4ef5); font-size:13px; font-weight:600; text-decoration:none; }
.cw-cel__more:hover{ text-decoration:underline; }

/* What you missed page */
.cw-missed__bar{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; margin:0 0 16px; }
.cw-missed__chips{ display:flex; flex-wrap:wrap; gap:8px; }
.cw-missed__chip{ display:inline-flex; align-items:center; gap:6px; min-height:34px; padding:0 14px; border:1px solid var(--line,rgba(19,20,48,.14)); border-radius:999px; color:var(--ink,#131430); font-size:13px; font-weight:600; text-decoration:none; }
.cw-missed__chip b{ color:var(--muted,#5d5f72); font-weight:600; }
.cw-missed__chip:hover{ border-color:var(--ink,#131430); }
.cw-missed__chip.is-on{ border-color:var(--accent-strong,#6c4ef5); background:var(--accent-strong,#6c4ef5); color:#fff; }
.cw-missed__chip.is-on b{ color:rgba(255,255,255,.8); }
.cw-missed__form{ display:flex; flex-wrap:wrap; gap:8px; }
.cw-missed__form input[type="search"], .cw-missed__form select{ min-height:36px; padding:0 12px; border:1px solid var(--line,rgba(19,20,48,.15)); border-radius:10px; background:var(--card,#fff); color:inherit; font:inherit; font-size:14px; }
.cw-missed__form input[type="search"]{ width:min(220px, 100%) !important; }
.cw-missed__form select{ width:auto !important; }
.cw-missed__form{ flex-wrap:nowrap; }
@media (max-width:600px){ .cw-missed__form{ flex-wrap:wrap; width:100%; } .cw-missed__form input[type="search"]{ flex:1; width:auto !important; } }
.cw-missed .cw-cel__group + .cw-cel__group{ margin-top:10px; }
.cw-missed__pages{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:16px; padding-top:14px; border-top:1px solid var(--line,rgba(19,20,48,.1)); font-size:14px; }
.cw-events__tabs{ margin:0 0 16px; }
.cw-events__tabs .cw-ui-tabs{ border-bottom:1px solid var(--line,rgba(19,20,48,.12)); }
.cw-events__tabs .cw-ui-tabs a.is-on{ border-color:var(--accent,#6c4ef5); }

/* Design review 2026-10-22: Events toolbar controls match, the inactive tab is quieter, Send wishes lines up. */
.cw-missed__form :is(input[type=search],select,.btn){height:40px;min-height:40px;padding-block:0;border-radius:10px;background:var(--card,#fff)}
.cw-events__tabs .cw-ui-tabs a:not(.is-on){color:var(--muted,#5d5f72)}
.cw-events__tabs .cw-ui-tabs a.is-on{font-weight:600}
.jx-dash .cw-cel__wish:not([open]){margin-left:52px}
