/* Calendar layout isolated from other GenIA pages. */
body.calendar-page { --cal-bg:var(--discord-bg); --cal-surface:var(--discord-surface); --cal-soft:var(--discord-surface-soft); --cal-ink:var(--discord-text); --cal-muted:var(--discord-muted); --cal-line:var(--discord-border); --cal-accent:var(--discord-accent); --cal-tint:color-mix(in srgb,var(--discord-accent) 10%,var(--discord-surface)); --cal-accent-ink:var(--discord-accent); --cal-danger:var(--discord-danger); --cal-shadow:none; margin:0; padding:0; min-height:100dvh; height:auto; overflow:auto; background:var(--cal-bg) !important; color:var(--cal-ink) !important; font-family:Inter,"Segoe UI",Arial,sans-serif; font-size:16px; line-height:1.5; -webkit-text-size-adjust:100%; }

body.calendar-page *,body.calendar-page *::before,body.calendar-page *::after { box-sizing:border-box; }
body.calendar-page [hidden] { display:none !important; }
body.calendar-page h1,body.calendar-page h2,body.calendar-page h3,body.calendar-page strong { color:var(--cal-ink) !important; }
body.calendar-page p,body.calendar-page label,body.calendar-page small { color:var(--cal-muted); }
body.calendar-page .calendar-shell { height:auto; min-height:100dvh; width:min(1500px,100%); display:block; margin:0 auto; padding:28px 32px 40px; border:0; border-radius:0 !important; background:transparent !important; box-shadow:none !important; }
body.calendar-page .calendar-header { display:flex; flex-wrap:wrap; align-items:center; gap:24px; padding:0; margin-bottom:26px; color:var(--cal-ink) !important; }
body.calendar-page .calendar-header > div:first-child { flex:1 1 320px; min-width:0; }
body.calendar-page .calendar-header h1 { margin:4px 0 10px; font-size:clamp(1.7rem,3vw,2.35rem); line-height:1.18; letter-spacing:-.025em; }
body.calendar-page .eyebrow { color:var(--cal-accent-ink) !important; font-size:.76rem; text-transform:uppercase; letter-spacing:0 !important; font-weight:800; margin:0 0 6px; }
body.calendar-page .eyebrow span { padding:0 6px; opacity:.6; }
body.calendar-page .calendar-account { display:flex; align-items:baseline; gap:8px; font-size:.85rem; font-weight:500; overflow-wrap:anywhere; color:var(--cal-muted) !important; }
body.calendar-page .calendar-header-actions { display:flex; flex-wrap:wrap; align-items:center; gap:10px; }
body.calendar-page .calendar-intro { font-size:.95rem; margin:0 0 18px; color:var(--cal-muted) !important; }
body.calendar-page button,body.calendar-page a.secondary-button { touch-action:manipulation; -webkit-tap-highlight-color:transparent; min-height:50px; width:auto; max-width:100%; height:auto; padding:12px 18px; border:1px solid var(--cal-line) !important; border-radius:4px !important; background:var(--cal-surface) !important; color:var(--cal-ink) !important; box-shadow:none !important; font:650 .92rem/1.4 Inter,"Segoe UI",Arial,sans-serif; text-decoration:none; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; gap:8px; white-space:normal; word-break:normal; overflow-wrap:normal; margin:0; }
body.calendar-page button.primary-button { background:var(--cal-accent) !important; border-color:var(--cal-accent) !important; color:#fff !important; }
html[data-genia-theme=dark] body.calendar-page button.primary-button,body.calendar-page.genia-dark-theme button.primary-button { color:#ffffff !important; }
body.calendar-page button:hover:not(:disabled),body.calendar-page a.secondary-button:hover { border-color:var(--cal-accent) !important; filter:brightness(.98); }
body.calendar-page button:disabled { opacity:.5; cursor:default; }
body.calendar-page button:active:not(:disabled) { transform:translateY(1px); }
body.calendar-page :focus-visible { outline:3px solid var(--cal-accent) !important; outline-offset:3px; }
body.calendar-page .calendar-workspace { display:block; height:auto; min-height:0; border:0; background:transparent; box-shadow:none; }
body.calendar-page .calendar-main { display:block; width:100%; min-width:0; height:auto; padding:26px; border:1px solid var(--cal-line); border-radius:8px !important; background:var(--cal-surface) !important; color:var(--cal-ink) !important; box-shadow:var(--cal-shadow) !important; }
body.calendar-page .calendar-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:20px; min-height:56px; }
body.calendar-page .calendar-month-navigation { display:flex; gap:8px; align-items:center; }
body.calendar-page button.calendar-icon-button { display:inline-flex; align-items:center; justify-content:center; padding:8px; width:52px; height:52px; min-width:52px; flex:0 0 52px; font-size:1.65rem; line-height:1; font-weight:500; color:var(--cal-accent-ink) !important; background:var(--cal-soft) !important; }
body.calendar-page #todayButton { min-height:52px; padding:12px 20px; }
body.calendar-page .calendar-toolbar h2 { flex:1; min-width:160px; margin:0; font-size:clamp(1.35rem,2.7vw,1.8rem); font-weight:750; text-transform:capitalize; letter-spacing:-.025em; order:0; width:auto; }
body.calendar-page #newEvent { min-height:56px; padding:14px 24px; font-size:1rem; margin-left:auto; }
body.calendar-page #newEvent > span { font-size:1.4rem; line-height:1; }
body.calendar-page .calendar-day-filter { display:flex; flex-wrap:wrap; align-items:center; gap:14px; margin:24px 0 0; padding:20px 0; border-top:1px solid var(--cal-line); border-bottom:1px solid var(--cal-line); }
body.calendar-page .calendar-day-filter label { font-size:.85rem; font-weight:650; width:auto; color:var(--cal-muted) !important; }
body.calendar-page input,body.calendar-page textarea { display:block; min-height:54px; width:100%; min-width:0; max-width:100%; font:400 16px/1.5 Inter,"Segoe UI",Arial,sans-serif; border:1px solid var(--cal-line) !important; border-radius:4px !important; color:var(--cal-ink) !important; background:var(--cal-soft) !important; padding:12px 14px; box-shadow:none !important; resize:vertical; }
body.calendar-page input::placeholder,body.calendar-page textarea::placeholder { color:var(--cal-muted) !important; opacity:.8; }
body.calendar-page input:focus,body.calendar-page textarea:focus { border-color:var(--cal-accent) !important; }
body.calendar-page #selectedDate { width:220px; flex:0 1 220px; padding:12px 14px; }
body.calendar-page #showMonthButton { margin-left:auto; background:var(--cal-soft) !important; }
body.calendar-page .calendar-status { min-height:24px; margin:20px 0 16px; font-size:.85rem; font-weight:550; line-height:1.6; color:var(--cal-muted) !important; }
body.calendar-page .calendar-status.is-error { padding:14px; border:1px solid var(--cal-danger); border-radius:8px; color:var(--cal-danger) !important; }
body.calendar-page .calendar-event-list { display:grid; height:auto; max-height:none; min-height:0; overflow:visible; gap:14px; align-content:start; padding:0; }
body.calendar-page button.calendar-event { display:grid; grid-template-columns:144px minmax(0,1fr) auto; align-items:start; gap:22px; width:100%; min-height:122px; padding:22px; text-align:left; background:var(--cal-soft) !important; border-color:var(--cal-line) !important; border-left:4px solid var(--cal-accent) !important; border-radius:8px !important; color:var(--cal-ink) !important; font-weight:400; }
body.calendar-page .calendar-event time { display:grid; gap:6px; min-width:0; color:var(--cal-muted) !important; font-size:.8rem; line-height:1.5; text-transform:capitalize; }
body.calendar-page .calendar-event time strong { font-size:1.03rem; font-weight:750; white-space:normal; }
body.calendar-page .calendar-event time small { font-size:.74rem; }
body.calendar-page .calendar-event-content { display:grid; gap:10px; min-width:0; border-left:1px solid var(--cal-line); padding-left:22px; }
body.calendar-page .calendar-event-content > strong { font-size:1rem; line-height:1.6; font-weight:650; white-space:normal; overflow-wrap:anywhere; }
body.calendar-page .calendar-event-content small { font-size:.85rem; color:var(--cal-muted) !important; white-space:normal; overflow:visible; text-overflow:clip; line-height:1.6; overflow-wrap:anywhere; }
body.calendar-page .calendar-event-action { display:inline-flex; gap:8px; white-space:nowrap; align-items:center; align-self:center; color:var(--cal-accent-ink) !important; font-size:.76rem; font-weight:650; }
body.calendar-page .calendar-event-action > span { display:inline; }
body.calendar-page .calendar-empty { padding:52px 24px; background:var(--cal-soft); border:1px dashed var(--cal-line); border-radius:8px; color:var(--cal-muted); font-size:1rem; }
body.calendar-page .calendar-editor-backdrop { position:fixed; inset:0; z-index:100; background:#11172588; backdrop-filter:blur(5px); }
body.calendar-page .calendar-editor { position:fixed; inset:50% auto auto 50%; transform:translate(-50%,-50%); z-index:101; display:none; width:min(780px,calc(100vw - 48px)); max-width:100%; height:auto; max-height:calc(100dvh - 48px); min-height:0; overflow:auto; overscroll-behavior:contain; padding:28px; background:var(--cal-surface) !important; color:var(--cal-ink) !important; border:1px solid var(--cal-line); border-radius:8px; box-shadow:0 20px 80px #00000033; }
body.calendar-page .calendar-editor.is-open { display:block; }
body.calendar-page.calendar-editor-open { overflow:hidden; }
body.calendar-page .calendar-editor form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
body.calendar-page .calendar-editor-heading { grid-column:1 / -1; display:flex; justify-content:space-between; align-items:center; gap:18px; margin-bottom:6px; }
body.calendar-page .calendar-editor-heading h2 { font-size:1.5rem; margin:0; line-height:1.3; }
body.calendar-page .calendar-editor label { display:grid; align-content:start; gap:9px; font-size:.86rem; line-height:1.4; font-weight:650; color:var(--cal-ink) !important; }
body.calendar-page .calendar-wide-field { grid-column:1 / -1; }
body.calendar-page .calendar-editor-status { grid-column:1 / -1; margin:0; font-size:.9rem; color:var(--cal-danger) !important; }
body.calendar-page .calendar-editor-status:empty { display:none; }
body.calendar-page .calendar-editor-actions { grid-column:1 / -1; display:flex; flex-wrap:wrap; align-items:center; gap:12px; padding:18px 0 4px; border-top:1px solid var(--cal-line); background:var(--cal-surface); position:sticky; bottom:-28px; margin:0; }
body.calendar-page .calendar-editor-actions .primary-button { min-width:170px; min-height:54px; }
body.calendar-page #cancelEditor { margin-left:auto; }
body.calendar-page .calendar-danger-button { background:transparent !important; color:var(--cal-danger) !important; border-color:transparent !important; }
@media (max-width:1000px) {
  body.calendar-page .calendar-shell { padding:24px; }
  body.calendar-page .calendar-header { gap:18px; }
  body.calendar-page .calendar-header-actions { margin-left:auto; }
  body.calendar-page .calendar-main { padding:22px; }
  body.calendar-page .calendar-toolbar { gap:14px; }
  body.calendar-page button.calendar-event { grid-template-columns:116px minmax(0,1fr); padding:20px; gap:18px; }
  body.calendar-page .calendar-event-action { display:none; }
  body.calendar-page .calendar-event-content { padding-left:18px; }
}
@media (max-width:700px) {
  body.calendar-page .calendar-shell { padding:20px 14px 28px; }
  body.calendar-page .calendar-header { display:flex; gap:18px; }
  body.calendar-page .calendar-header-actions { margin:0; width:100%; gap:8px; }
  body.calendar-page .calendar-header-actions > * { flex:1 1 auto; font-size:.82rem; padding:12px; }
  body.calendar-page .calendar-intro { font-size:.86rem; margin-bottom:16px; }
  body.calendar-page .calendar-main { padding:18px; border-radius:8px !important; }
  body.calendar-page .calendar-toolbar { display:grid; grid-template-columns:1fr auto; gap:16px 10px; }
  body.calendar-page .calendar-toolbar h2 { order:0; grid-column:1 / -1; grid-row:1; width:auto; min-width:0; font-size:1.4rem; }
  body.calendar-page .calendar-month-navigation { grid-row:2; grid-column:1; gap:6px; }
  body.calendar-page #newEvent { grid-row:2; grid-column:2; margin:0; padding:12px; min-height:52px; font-size:.83rem; }
  body.calendar-page #newEvent > span { display:none; }
  body.calendar-page button.calendar-icon-button { width:48px; min-width:48px; height:50px; flex-basis:48px; }
  body.calendar-page #todayButton { padding:12px; min-height:50px; }
  body.calendar-page .calendar-day-filter { gap:10px; margin-top:20px; padding:18px 0; }
  body.calendar-page .calendar-day-filter label { width:100%; }
  body.calendar-page #selectedDate { width:100%; flex:1 1 160px; }
  body.calendar-page #showMonthButton { flex:1 1 120px; margin:0; padding:12px; }
  body.calendar-page button.calendar-event { grid-template-columns:1fr; gap:14px; padding:18px; border-left-width:3px !important; }
  body.calendar-page .calendar-event time { display:flex; flex-wrap:wrap; align-items:center; gap:6px 12px; padding-bottom:14px; border-bottom:1px solid var(--cal-line); font-size:.76rem; }
  body.calendar-page .calendar-event time strong { font-size:.9rem; margin-left:auto; }
  body.calendar-page .calendar-event time small { font-size:.7rem; }
  body.calendar-page .calendar-event-content { border:0; padding:0; gap:8px; }
  body.calendar-page .calendar-event-content > strong { font-size:.94rem; }
  body.calendar-page .calendar-event-content small { font-size:.81rem; }
  body.calendar-page .calendar-editor { width:calc(100vw - 20px); max-height:calc(100dvh - 20px); padding:20px; border-radius:8px; }
  body.calendar-page .calendar-editor form { grid-template-columns:1fr; gap:18px; }
  body.calendar-page .calendar-editor-actions { bottom:-20px; gap:8px; }
  body.calendar-page .calendar-editor-actions .primary-button { min-width:0; flex:1 1 150px; }
  body.calendar-page #cancelEditor { flex:1 1 100px; margin:0; }
  body.calendar-page #deleteEvent { flex:1 0 100%; min-height:44px; }
}
@media (prefers-reduced-motion:no-preference) { body.calendar-page button,body.calendar-page a { transition:background .15s,border-color .15s; } }

/* Shared GenIA appearance: same tokens and panel geometry as other pages. */
body.calendar-page .calendar-shell { width:100%; max-width:none; padding:0 0 32px; }
body.calendar-page .calendar-header { padding:20px max(24px,calc((100vw - 1440px)/2)); margin:0 0 24px; background:var(--cal-surface); border-bottom:1px solid var(--cal-line); }
body.calendar-page .calendar-workspace { width:min(1440px,calc(100% - 48px)); margin:0 auto; }
body.calendar-page .calendar-main { box-shadow:none !important; }
body.calendar-page .calendar-editor { border-radius:8px; }
body.calendar-page input,body.calendar-page textarea { background:var(--discord-input) !important; }
body.calendar-page .calendar-event-action,body.calendar-page button.calendar-icon-button { color:var(--cal-ink) !important; }
@media(max-width:700px) { body.calendar-page .calendar-shell { padding:0 0 24px; } body.calendar-page .calendar-header { padding:20px 16px; margin-bottom:18px; } body.calendar-page .calendar-workspace { width:calc(100% - 24px); } }

/* Outlook category names and preset colors, read from the connected mailbox. */
body.calendar-page button.calendar-event { border-left-color:var(--event-category-color,var(--cal-line)) !important; }
body.calendar-page .calendar-categories { display:flex; flex-wrap:wrap; gap:8px; align-items:center; min-width:0; }
body.calendar-page .calendar-category { display:inline-flex; align-items:center; gap:7px; max-width:100%; padding:5px 9px; border:1px solid var(--cal-line); border-radius:4px; font-size:.7rem; font-weight:650; line-height:1.5; color:var(--cal-ink) !important; background:var(--cal-surface); white-space:normal; overflow-wrap:anywhere; }
body.calendar-page .calendar-category.has-color { background:color-mix(in srgb,var(--category-color) 12%,var(--cal-surface)); border-color:color-mix(in srgb,var(--category-color) 45%,var(--cal-line)); }
body.calendar-page .calendar-category-dot { display:inline-block; width:9px; height:9px; flex:0 0 9px; border-radius:50%; background:var(--category-color,var(--cal-muted)); box-shadow:0 0 0 1px color-mix(in srgb,var(--cal-ink) 15%,transparent); }
body.calendar-page #editorCategories { grid-column:1 / -1; }

body.calendar-page .calendar-category-picker { border:1px solid var(--cal-line); border-radius:8px; padding:16px; margin:0; min-width:0; }
body.calendar-page .calendar-category-picker legend { padding:0 6px; font-size:.9rem; font-weight:700; color:var(--cal-ink); }
body.calendar-page .calendar-category-help { font-size:.83rem; line-height:1.6; color:var(--cal-muted); margin:0 0 12px; }
body.calendar-page .calendar-search-label { font-size:.78rem; }
body.calendar-page .calendar-category-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); max-height:220px; overflow:auto; overscroll-behavior:contain; gap:8px; padding:4px; margin:12px 0; }
body.calendar-page label.calendar-category-option { display:flex; align-items:center; gap:10px; min-height:50px; padding:10px; border:1px solid var(--cal-line); border-radius:4px; cursor:pointer; }
body.calendar-page .calendar-category-option:has(input:checked) { border-color:var(--cal-accent); background:var(--cal-tint); }
body.calendar-page .calendar-category-option input[type=checkbox] { width:24px; min-width:24px; height:24px; min-height:24px; padding:0; margin:0; flex:0 0 24px; accent-color:var(--cal-accent); }
body.calendar-page .calendar-category-option > span { min-width:0; }
body.calendar-page .calendar-category-option .calendar-category { border:0; padding:0; background:transparent; }
body.calendar-page select { min-height:50px; width:100%; min-width:0; max-width:100%; border:1px solid var(--cal-line) !important; border-radius:4px !important; font:400 16px/1.5 Inter,"Segoe UI",Arial,sans-serif; padding:12px; color:var(--cal-ink) !important; background:var(--discord-input) !important; }
body.calendar-page .calendar-category-manager > .calendar-editor-heading { margin-bottom:14px; }
body.calendar-page .calendar-category-manager .calendar-editor-status { padding:10px 0; }
body.calendar-page .calendar-create-category { display:grid; grid-template-columns:minmax(0,1fr) minmax(130px,180px); gap:14px; border:1px solid var(--cal-line); padding:16px; margin:18px 0 24px; }
body.calendar-page .calendar-create-category h3 { grid-column:1/-1; margin:0; font-size:1rem; }
body.calendar-page .calendar-create-category button { grid-column:1/-1; justify-self:start; }
body.calendar-page .calendar-catalog-title { margin:20px 0 14px; font-size:1rem; }
body.calendar-page .calendar-category-manager-list { display:grid; gap:14px; }
body.calendar-page .calendar-category-manager-row { display:grid; grid-template-columns:1fr 1fr; align-items:end; gap:12px; padding:16px; border:1px solid var(--cal-line); border-radius:8px; }
body.calendar-page .calendar-category-manager-row > div { grid-column:1/-1; display:grid; gap:8px; min-width:0; overflow-wrap:anywhere; }
body.calendar-page .calendar-category-manager-row > div strong { font-size:.9rem; }
body.calendar-page .calendar-category-manager-row > label { grid-column:1/-1; }
body.calendar-page .calendar-category-manager-row button { min-height:48px; }
@media(max-width:600px) {
 body.calendar-page .calendar-category-options { grid-template-columns:1fr; max-height:240px; }
 body.calendar-page .calendar-create-category { grid-template-columns:1fr; }
 body.calendar-page .calendar-category-manager-row { padding:12px; }
}