/* Ticket Hall: boards, tickets, backlog, dashboards, reports and admin styles (light workspace) */
.block { display:block; }
.grow { flex:1;min-width:200px; }
.stack { display:flex;flex-direction:column;gap:8px; }
.inline { display:inline; }
.truncate { overflow:hidden;white-space:nowrap;text-overflow:ellipsis;max-width:280px; }
.input-sm { padding:7px 10px;font-size:.8rem;width:auto;min-width:0; }
.num-input { width:90px; }
.color-input { width:46px;height:38px;padding:3px;flex:0 0 46px;min-width:0 !important; }
.link-btn { background:none;border:0;color:#2368c4;font:600 .8rem var(--font);cursor:pointer;padding:4px 6px;border-radius:6px; }
.link-btn:hover { background:#eaf2fe; }
.inline-form { display:flex;gap:10px;align-items:center;flex-wrap:wrap; }
.inline-form .input { flex:1;min-width:150px; }
.plain-list { list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px; }
.empty-state { margin:0;padding:22px;border:1px dashed #cddff4;border-radius:14px;text-align:center;color:#637c99;font-size:.88rem; }
.page-heading { display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:16px;margin-bottom:22px; }
.page-heading h1 { margin:4px 0 6px; }
.page-heading p { margin:0; }
.workspace-content .flash { margin:0 0 18px; }
.workspace-content .flash-warn { color:#7a5200;background:#fff6e5;border-color:#f3cf87; }
.workspace-content .flash a { color:inherit;font-weight:700;text-decoration:underline; }
.workspace-content .btn.disabled,.workspace-content .btn[disabled] { opacity:.55;cursor:not-allowed; }
.btn.is-busy { opacity:.6;cursor:progress; }
.notice-panel { display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:14px 18px;margin-bottom:18px;border-radius:14px;background:#f1f4f8;border:1px solid #d5dde8;color:#45607d; }
.workspace-content .panel { margin-bottom:20px; }
.workspace-content .panel > summary { cursor:pointer;color:#17457b; }
.workspace-content details.panel[open] > summary { margin-bottom:16px; }
.workspace-content .stat { color:#153253;border-color:#d9e4f2;box-shadow:0 10px 26px -22px #143b6b66; }
.stat-grid.compact { grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin-bottom:22px; }
.stat-grid.compact .stat { padding:18px; }
.stat-grid.compact .stat b { font-size:1.7rem; }

/* Header extras */
.header-actions { display:flex;align-items:center;gap:10px; }
.bell { position:relative;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#ffffff10;border:1px solid var(--border);font-size:1.1rem; }
.bell:hover { background:#ffffff22; }
.count-badge { position:absolute;top:-4px;right:-4px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:#ff3b5c;color:#fff;font:700 .68rem/20px var(--font);text-align:center; }
.rail-count { min-width:18px;padding:1px 5px;border-radius:9px;background:#ff3b5c;color:#fff;font:700 .62rem/1.4 var(--font); }
.timer-chip { display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:20px;background:#22d39b22;border:1px solid #22d39b66;color:#c8ffe9;font-size:.8rem;white-space:nowrap; }
.timer-chip b { font-variant-numeric:tabular-nums; }

/* Toasts */
.toast-stack { position:fixed;right:20px;bottom:20px;z-index:10002;display:flex;flex-direction:column;gap:10px;width:min(360px,calc(100vw - 40px)); }
.toast { display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:14px;background:#0b2852;color:#eef5ff;border:1px solid #2c6fc2;box-shadow:0 18px 40px -18px #000a;animation:slideDown .3s ease;font-size:.86rem; }
.toast b { display:block;margin-bottom:2px; }
.toast .toast-body { flex:1;min-width:0;overflow-wrap:anywhere;color:inherit; }
.toast button { background:none;border:0;color:#b9cde8;cursor:pointer;font-size:1.1rem;line-height:1; }
.toast-error { background:#5d1a2c;border-color:#c8486a; }
.toast-success { background:#0f4a34;border-color:#2fa678; }
.toast-warn { background:#5a4205;border-color:#e0a530; }
.toast-security { border-color:#ffc24b; }

/* Badges: status, priority, type, tags, labels */
.status { display:inline-block;padding:3px 9px;border-radius:6px;font:700 .68rem/1.4 var(--font);letter-spacing:.4px;text-transform:uppercase;white-space:nowrap; }
.status-todo { background:#e6ebf2;color:#43566e; }
.status-in_progress { background:#dcebff;color:#1d58a6; }
.status-done { background:#d5f3e5;color:#16623f; }
.status-btn.status-done-btn { background:#e2f6ec;color:#16623f;border-color:#b5e3cc; }
.status-btn.status-in_progress-btn { background:#e5effc;color:#1d58a6; }
.prio { display:inline-flex;align-items:center;gap:3px;font-size:.78rem;font-weight:700;white-space:nowrap; }
.prio-critical { color:#c62828; }
.prio-high { color:#e65100; }
.prio-medium { color:#c79100; }
.prio-low { color:#2e7d6f; }
.type-icon { display:inline-grid;place-items:center;width:20px;height:20px;border-radius:5px;color:#fff;font:800 .64rem var(--font);vertical-align:middle;flex-shrink:0; }
.ticket-key { font:700 .8rem var(--font);color:#2368c4;white-space:nowrap; }
.ticket-key.archived { color:#8a9bb0;text-decoration:line-through; }
.summary-link { color:#153253;font-weight:500; }
.summary-link:hover,.ticket-key:hover { text-decoration:underline; }
.tag { display:inline-block;padding:2px 9px;border-radius:8px;background:#eaf2fe;color:#235a9c;font:700 .68rem/1.5 var(--font);text-transform:uppercase;letter-spacing:.4px;white-space:nowrap; }
.tag-pending,.tag-planned { background:#fff2d6;color:#7a5200; }
.tag-approved,.tag-active,.tag-completed,.tag-sent { background:#d5f3e5;color:#16623f; }
.tag-rejected,.tag-failed { background:#ffe3e9;color:#9b1f3c; }
.tag-archived,.tag-cancelled,.tag-closed,.tag-skipped,.tag-inactive { background:#eceff3;color:#5d6b7c; }
.tag-internal { background:#fdf0dc;color:#8a4b00;text-transform:none; }
.label-chip { display:inline-block;padding:2px 8px;margin:1px 2px 1px 0;border-radius:10px;background:#eef1fb;color:#4a4f9c;font-size:.7rem;font-weight:600; }
.label-chip:hover { background:#dfe4fa; }
.epic-chip { display:inline-block;padding:2px 8px;border-radius:6px;background:#efe4fb;color:#5e2d91;font-size:.7rem;font-weight:700;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle; }
.flag,.flag-badge { color:#c62828;font-weight:700; }
.flag-badge { font-size:.78rem; }
.points-pill { display:inline-grid;place-items:center;min-width:24px;height:20px;padding:0 6px;border-radius:10px;background:#e6ebf2;color:#43566e;font:700 .7rem var(--font); }
.person { display:inline-flex;align-items:center;gap:7px;white-space:nowrap;font-size:.84rem; }
.person .avatar,.card-meta .avatar,.mini-row .avatar,.comment .avatar,.activity-feed .avatar { width:26px;height:26px;font-size:.62rem; }
.avatar.empty { background:#d5dde8;color:#6a7d93;padding:0;border:0;border-radius:50%; }
.due { white-space:nowrap; }
.due.soon { color:#b26a00;font-weight:600; }
.due.overdue,.overdue-text { color:#c62828;font-weight:700; }
.dot { display:inline-block;width:8px;height:8px;border-radius:50%;background:#287eef;flex-shrink:0;margin-top:7px; }
.dot.red { background:#e0435f; }

/* Tables */
.ticket-tbl td { padding:11px 14px; }
.ticket-tbl .col-summary { min-width:220px; }
.ticket-tbl tr.is-overdue td:first-child { box-shadow:inset 3px 0 #e0435f; }
.check-col { width:36px; }
.check-col input { width:16px;height:16px;accent-color:#287eef; }
.pager { display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:12px 4px;font-size:.82rem;color:#526c88; }
.pager span { margin-right:auto; }
.row-actions { display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end; }
.row-actions form { display:inline; }

/* Tabs, filters, menus */
.workspace-content .tabs { border-color:#d9e4f2; }
.workspace-content .tab { color:#526c88; }
.workspace-content .tab.active { color:#17457b; }
.link-tabs { gap:4px;margin-bottom:18px; }
.link-tabs .tab { display:inline-block;padding:10px 14px;font-size:.86rem;font-weight:600;border-bottom:3px solid transparent;white-space:nowrap; }
.link-tabs .tab.active { border-bottom-color:#287eef; }
.link-tabs.light .tab small { color:#8aa0b9;font-weight:400; }
.report-tabs { flex-wrap:nowrap; }
.filter-bar { display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:18px; }
.filter-bar .input { width:auto;min-width:130px;max-width:240px;padding:9px 12px;font-size:.84rem; }
.filter-bar input[type=search] { min-width:200px; }
.segmented { display:inline-flex;border:1px solid #cddff4;border-radius:10px;overflow:hidden;background:#fff; }
.segmented a { padding:8px 14px;font-size:.82rem;font-weight:600;color:#17457b; }
.segmented a + a { border-left:1px solid #cddff4; }
.segmented a.active { background:var(--grad);color:#fff; }
.bulk-bar { display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:10px 14px;margin-bottom:16px;border:1px solid #d9e4f2;border-radius:12px;background:#f6f9fe; }
.bulk-bar .input { width:auto;padding:8px 12px;font-size:.84rem; }
details.menu { position:relative;display:inline-block; }
details.menu > summary { list-style:none; }
details.menu > summary::-webkit-details-marker { display:none; }
.menu-panel { position:absolute;right:0;top:calc(100% + 6px);z-index:40;min-width:220px;padding:6px;background:#fff;border:1px solid #cddff4;border-radius:12px;box-shadow:0 18px 40px -18px #143b6b88;display:flex;flex-direction:column;gap:2px; }
.menu-panel.wide { min-width:280px;padding:14px; }
.menu-item { display:block;width:100%;text-align:left;padding:9px 12px;border:0;border-radius:8px;background:none;color:#17457b;font:500 .85rem var(--font);cursor:pointer; }
.menu-item:hover { background:#eef5ff; }
.menu-item.danger { color:#b62346; }
.menu-panel form { display:block; }
.menu-form { display:flex !important;flex-direction:column;gap:6px;padding:6px;border-top:1px solid #edf2f9; }
.menu-form .input { padding:7px 10px;font-size:.82rem; }
.crumbs a { color:inherit; }
.crumbs a:hover { text-decoration:underline; }

/* Board */
.board-page .workspace-content { padding-right:clamp(12px,2vw,30px); }
.board-heading h1 { margin-bottom:4px; }
.sprint-line { margin:2px 0;font-size:.86rem; }
.board-filters .board-count { margin-left:auto; }
.board { --cols:4;overflow-x:auto;padding-bottom:10px; }
.board-row { display:grid;grid-template-columns:repeat(var(--cols),minmax(230px,1fr));gap:12px;min-width:calc(var(--cols) * 242px); }
.board-head { position:sticky;top:0;z-index:5; }
.board-col-head { display:flex;align-items:center;gap:6px;padding:10px 12px;border-radius:12px 12px 0 0;background:#dfe9f6;color:#244564;font-size:.78rem;text-transform:uppercase;letter-spacing:.6px; }
.board-col-head .col-count { margin-left:auto;padding:1px 8px;border-radius:9px;background:#fff;font-weight:700; }
.board-col-head .wip { font-size:.7rem;text-transform:none;letter-spacing:0;color:#5f7590; }
.board-col-head.over-wip { background:#ffe3e9;color:#9b1f3c; }
.board-col-head.over-wip .wip { color:#9b1f3c;font-weight:700; }
.lane-title { margin:14px 0 6px;padding:6px 4px;font-weight:700;color:#17457b;border-bottom:1px solid #d9e4f2; }
.board-col { display:flex;flex-direction:column;gap:10px;min-height:140px;padding:10px;background:#e8eff8;border-radius:0 0 12px 12px;transition:background .15s,box-shadow .15s; }
.board-row + .board-row .board-col,.lane-title + .board-row .board-col { border-radius:12px; }
.board.dragging .drop-lane .board-col { box-shadow:inset 0 0 0 2px #b7d2f3; }
.board-col.drop-target { background:#d6e7fc;box-shadow:inset 0 0 0 2px #287eef !important; }
.card { position:relative;display:flex;flex-direction:column;gap:7px;padding:12px 12px 10px;background:#fff;border:1px solid #d9e4f2;border-left:4px solid #9fb3cb;border-radius:10px;box-shadow:0 4px 12px -10px #143b6b88;cursor:grab;transition:transform .12s,box-shadow .12s,opacity .12s; }
.card:hover { box-shadow:0 10px 22px -14px #143b6b99; }
.card:focus-visible { outline:3px solid #287eef;outline-offset:2px; }
.card.is-dragging { opacity:.4;transform:rotate(1.5deg); }
.card.is-saving { opacity:.65;pointer-events:none; }
.card.is-saving::after { content:'';position:absolute;top:10px;right:10px;width:14px;height:14px;border:2px solid #287eef;border-right-color:transparent;border-radius:50%;animation:spin .8s linear infinite; }
.card.is-overdue { background:#fff7f8;border-color:#f2bac8; }
.card.is-flagged { background:#fffaf0; }
.card.is-done .card-summary { color:#6a83a0; }
.prio-border-critical { border-left-color:#c62828; }
.prio-border-high { border-left-color:#ef6c00; }
.prio-border-medium { border-left-color:#f2b705; }
.prio-border-low { border-left-color:#2e9d8a; }
.card-top { display:flex;align-items:center;gap:6px; }
.card-prio { margin-left:auto; }
.card-summary { color:#153253;font-size:.88rem;line-height:1.35;overflow-wrap:anywhere; }
.card-labels { display:flex;flex-wrap:wrap; }
.card-meta { display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:.74rem;color:#526c88; }
.card-status { margin-left:auto;font-size:.6rem; }
.card-due.overdue-text { color:#c62828; }
.card-move { display:flex;gap:6px;margin-top:2px; }
.card-move .input { flex:1;padding:5px 8px;font-size:.74rem; }
.card-move .btn { padding:4px 10px;font-size:.72rem; }
/* With JavaScript, the menu is only shown when the card has keyboard focus. */
.board .card-move { display:none; }
.board .card:focus-within .card-move,.no-js .board .card-move { display:flex; }
.board .card-move button { display:none; }
.board-help { margin-top:10px; }
.board-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;margin-bottom:24px; }
.board-card { display:flex;flex-direction:column;gap:6px;padding:20px;background:#fff;border:1px solid #d9e4f2;border-radius:16px;color:#153253;box-shadow:0 6px 0 #e1eaf7;transition:transform .15s; }
.board-card:hover { transform:translateY(-3px); }
.board-card.my { background:linear-gradient(135deg,#eaf3ff,#fff);border-color:#b9d6f7; }
.board-kind { font:700 .68rem var(--font);letter-spacing:1px;text-transform:uppercase;color:#2c68ae; }
@keyframes spin { to { transform:rotate(360deg); } }

/* Backlog and sprints */
.sprint-block .widget-head { align-items:flex-start; }
.sprint-block h2 { display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:1.15rem; }
.sprint-active { border-color:#9cc4f3;box-shadow:inset 4px 0 #287eef; }
.sprint-goal { margin:4px 0 0;font-size:.86rem;color:#244564; }
.backlog-list { list-style:none;margin:0;padding:6px;min-height:52px;border:1px dashed transparent;border-radius:12px;transition:background .15s,border-color .15s; }
.backlog-list.drop-target { background:#eef5ff;border-color:#287eef; }
.backlog-item { display:flex;align-items:center;gap:10px;padding:9px 10px;border-bottom:1px solid #edf2f9;background:#fff;font-size:.86rem; }
.backlog-item[draggable=true] { cursor:grab; }
.backlog-item:hover { background:#f6f9fe; }
.backlog-item.is-dragging { opacity:.4; }
.backlog-item.is-saving { opacity:.6; }
.backlog-item.is-overdue { box-shadow:inset 3px 0 #e0435f; }
.backlog-item input[type=checkbox] { width:16px;height:16px;accent-color:#287eef; }
.backlog-summary { flex:1;min-width:0;color:#153253;overflow:hidden;white-space:nowrap;text-overflow:ellipsis; }
.backlog-assignee { width:150px;overflow:hidden; }
.backlog-empty { padding:16px;text-align:center;color:#7a90aa;font-size:.84rem; }
.sprint-cards { display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px; }
.sprint-card { display:flex;flex-direction:column;gap:6px;color:#153253;margin-bottom:0 !important;transition:transform .15s; }
.sprint-card:hover { transform:translateY(-3px); }
.sprint-card small { color:#2c68ae;font-weight:700;font-size:.72rem;text-transform:uppercase;letter-spacing:.6px; }
.sprint-card b { font-size:1.05rem; }
.progress { height:8px;margin:6px 0 2px;border-radius:5px;background:#e3eaf3;overflow:hidden; }
.progress span { display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,#22b07d,#3ccf95); }
.burndown { width:100%;height:auto;max-height:320px; }
.burndown line { stroke:#e1eaf5; }
.burndown text { fill:#6a83a0;font-size:10px;font-family:var(--font); }
.burndown .ideal { stroke:#9fb3cb;stroke-dasharray:5 4;fill:none;stroke-width:2; }
.burndown .actual { stroke:#287eef;fill:none;stroke-width:3; }
.legend { display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;font-size:.8rem;color:#526c88; }
.legend span,.legend-c,.legend-r { display:inline-block;width:14px;height:4px;border-radius:2px;margin-right:4px;vertical-align:middle; }
.ideal-key { background:#9fb3cb; }
.actual-key { background:#287eef; }
.created-key,.legend-c { background:#287eef;height:10px !important; }
.resolved-key,.legend-r { background:#22b07d;height:10px !important; }
.grid-2 { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:start; }

/* Dashboards and widgets */
.dash-section { margin-bottom:24px; }
.dash-section > h2 { margin:0 0 12px; }
.dash-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px;align-items:start;margin-bottom:24px; }
.dash-grid .panel { margin-bottom:0; }
.widget { padding:20px; }
.widget.wide { grid-column:1 / -1; }
.widget-head { display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px; }
.widget-head h2,.widget-head h3 { margin:0;font-size:1.05rem; }
.widget-head a { font-size:.82rem;font-weight:600;color:#2368c4; }
.mini-row { display:flex;gap:10px;align-items:flex-start;padding:9px 0;border-bottom:1px solid #edf2f9;font-size:.86rem; }
.mini-row:last-child { border-bottom:0; }
.mini-row > span:not(.avatar):not(.dot):not(.ticket-key) { flex:1;min-width:0;overflow-wrap:anywhere; }
.mini-row small { display:block;color:#6a83a0;font-size:.76rem; }
.activity-feed { list-style:none;margin:0;padding:0;display:flex;flex-direction:column; }
.activity-feed li { padding:9px 0;border-bottom:1px solid #edf2f9;font-size:.85rem;overflow-wrap:anywhere; }
.activity-feed li:last-child { border-bottom:0; }
.activity-feed.full li { display:flex;gap:12px;align-items:flex-start; }
.activity-feed del { color:#8a9bb0; }
.stat-card { display:flex;flex-direction:column;gap:4px;padding:18px;background:#fff;border:1px solid #d9e4f2;border-radius:14px;color:#153253;box-shadow:0 10px 26px -22px #143b6b66; }
.stat-card span { font-size:.8rem;color:#526c88; }
.stat-card b { font:700 1.6rem var(--font-d); }
.stat-card small { color:#6a83a0; }
.stat-card.warn { border-left:4px solid #ef6c00; }
.stat-card.good { border-left:4px solid #22b07d; }
a.stat-card:hover { border-color:#9cc4f3; }
.bars { display:flex;flex-direction:column;gap:9px; }
.bar-row { display:grid;grid-template-columns:minmax(90px,170px) 1fr minmax(40px,auto);gap:10px;align-items:center;font-size:.84rem; }
.bar-label { overflow:hidden;white-space:nowrap;text-overflow:ellipsis; }
.bar-track { height:12px;border-radius:6px;background:#e8eff8;overflow:hidden; }
.bar-fill { display:block;height:100%;border-radius:6px;background:var(--grad);min-width:2px; }
.bar-row b { text-align:right; }
.trend { display:block; }
.trend-chart { display:flex;align-items:flex-end;gap:3px;height:200px;padding:8px 0;border-bottom:1px solid #d9e4f2;overflow-x:auto; }
.trend-day,.trend-col { flex:1 0 10px;display:flex;align-items:flex-end;gap:1px;height:100%; }
.trend-c,.trend-r,.t-created,.t-resolved { flex:1;min-height:1px;border-radius:3px 3px 0 0; }
.trend-c,.t-created { background:#287eef; }
.trend-r,.t-resolved { background:#22b07d; }
.pm-card { display:flex;flex-direction:column;gap:8px; }
.epic-row { display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:10px 0;border-bottom:1px solid #edf2f9; }
.epic-row .progress { flex:1 1 100%; }

/* Projects */
.project-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:18px; }
.project-card { display:flex;flex-direction:column;gap:8px;padding:22px;background:#fff;border:1px solid #d9e4f2;border-radius:16px;color:#153253;box-shadow:0 6px 0 #e1eaf7;transition:transform .15s; }
.project-card:hover { transform:translateY(-3px); }
.project-card h3 { margin:0;font-size:1.1rem; }
.project-card-head { display:flex;align-items:center;gap:8px;flex-wrap:wrap; }
.project-key { display:inline-block;padding:3px 9px;border-radius:7px;background:var(--grad);color:#fff;font:800 .72rem var(--font);letter-spacing:.6px; }
.project-meta { display:flex;flex-wrap:wrap;gap:6px 14px;font-size:.8rem;color:#526c88; }

/* Ticket page */
.ticket-head { margin-bottom:14px; }
.ticket-head h1 { display:flex;gap:10px;align-items:flex-start;margin:6px 0 10px;font-size:1.7rem;overflow-wrap:anywhere; }
.ticket-head h1 .type-icon { width:28px;height:28px;font-size:.8rem;margin-top:6px; }
.ticket-head.is-archived h1 { color:#6a83a0; }
.ticket-badges { display:flex;flex-wrap:wrap;gap:10px;align-items:center;font-size:.86rem; }
.ticket-actions { display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 0;margin-bottom:18px;border-bottom:1px solid #d9e4f2; }
.ticket-actions form.inline,.transition-bar form { display:inline; }
.transition-bar { display:flex;flex-wrap:wrap;gap:8px; }
.ticket-layout { display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:22px;align-items:start; }
.ticket-main { min-width:0; }
.ticket-side { position:sticky;top:16px;display:flex;flex-direction:column;gap:0; }
.ticket-side .panel { padding:20px; }
.side-details dl,.time-dl,.details-dl { display:grid;grid-template-columns:max-content 1fr;gap:9px 16px;margin:0;font-size:.86rem; }
.side-details dt,.time-dl dt,.details-dl dt { color:#6a83a0;font-weight:600; }
.side-details dd,.time-dl dd,.details-dl dd { margin:0;min-width:0;overflow-wrap:anywhere; }
.ticket-description .rich-text { font-size:.95rem; }
.rich-text { line-height:1.6;overflow-wrap:anywhere; }
.rich-text p { margin:0 0 .7em; }
.rich-text pre { padding:12px;border-radius:10px;background:#0f2442;color:#dbe8fb;overflow-x:auto;font-size:.82rem; }
.rich-text a { color:#2368c4;text-decoration:underline; }
.rich-text blockquote { margin:0 0 .7em;padding-left:12px;border-left:3px solid #cddff4;color:#526c88; }
.attachment-list { list-style:none;margin:0 0 12px;padding:0;display:flex;flex-direction:column;gap:6px; }
.attachment-list li { display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:8px 12px;border:1px solid #e1eaf5;border-radius:10px;background:#f9fbfe;font-size:.86rem; }
.attachment-list form { display:inline;margin-left:auto; }
.workspace-content .panel .toolbar { justify-content:flex-start;margin:12px 0 0;gap:8px; }
.workspace-content .panel form.toolbar { display:flex;flex-wrap:wrap; }
.subtask-form { display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:14px;padding-top:14px;border-top:1px solid #edf2f9; }
.subtask-form .input { width:auto;padding:8px 10px;font-size:.84rem; }
.subtask-form .input[name=summary] { flex:1 1 240px; }
.link-list li { display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:.86rem; }
.link-list form { display:inline;margin-left:auto; }
.approval-row { display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:12px;padding:12px 0;border-bottom:1px solid #edf2f9; }
.approval-row:last-child { border-bottom:0; }
.approval-row small { display:block;margin-top:3px; }
.approval-row .toolbar { margin:0 !important; }
.approval-row .toolbar .input { min-width:160px; }
.approval-pending { box-shadow:inset 3px 0 #ef6c00;padding-left:12px; }
.edit-panel summary small { display:block;margin-top:4px;font-weight:400; }
.time-summary { display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px; }
.time-summary div { padding:14px;border-radius:12px;background:#f3f7fd;border:1px solid #e1eaf5; }
.time-summary span { display:block;font-size:.76rem;color:#6a83a0; }
.time-summary b { font:700 1.3rem var(--font-d); }
.worklog-form { margin-bottom:16px; }

/* Comments */
.comment-list { display:flex;flex-direction:column;gap:12px;margin-bottom:18px; }
.comment { padding:14px 16px;border:1px solid #e1eaf5;border-radius:14px;background:#fff; }
.comment.reply { margin-left:36px;background:#f9fbfe; }
.comment.internal { background:#fffaf0;border-color:#f3dcae; }
.comment header { display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px; }
.comment-actions { display:flex;flex-wrap:wrap;gap:6px;align-items:flex-start;margin-top:6px; }
.comment-actions form { display:inline; }
.inline-details > summary { list-style:none;display:inline-block; }
.inline-details > summary::-webkit-details-marker { display:none; }
.inline-details[open] { flex-basis:100%; }
.comment-form { display:flex;flex-direction:column;gap:8px;margin-top:8px; }
.comment-form .btn { align-self:flex-start; }
.new-comment { padding-top:14px;border-top:1px solid #edf2f9; }
.revision { margin-top:8px;padding:10px;border-radius:10px;background:#f3f6fa; }

/* Rich-text editor */
.editor { position:relative; }
.editor-toolbar { display:flex;flex-wrap:wrap;gap:4px;padding:6px;border:1px solid #d9e4f2;border-bottom:0;border-radius:12px 12px 0 0;background:#f6f9fe; }
.editor-toolbar.hidden { display:none; }
.editor-toolbar button { min-width:32px;padding:5px 9px;border-radius:7px;border:1px solid #d9e4f2;background:#fff;color:#17457b;cursor:pointer;font:600 .8rem var(--font); }
.editor-toolbar button:hover { background:#d6e7fc; }
.editor-toolbar:not(.hidden) + .editor-source + .editor-area,.editor-toolbar:not(.hidden) ~ .editor-area { border-radius:0 0 12px 12px; }
.editor-area { min-height:150px;max-height:55vh;overflow:auto;cursor:text;line-height:1.55; }
.editor.compact .editor-area { min-height:80px; }
.editor-area.is-empty::before { content:attr(data-placeholder);color:#9fb3cb;pointer-events:none; }
.editor-area:focus { outline:none;border-color:var(--primary);box-shadow:0 0 0 4px rgba(57,140,255,.2); }
.editor-area pre { padding:10px;border-radius:8px;background:#0f2442;color:#dbe8fb; }
.editor-area a { color:#2368c4;text-decoration:underline; }
.mention-menu { position:absolute;left:12px;bottom:calc(100% - 40px);z-index:50;list-style:none;margin:0;padding:6px;min-width:240px;max-height:260px;overflow:auto;background:#fff;border:1px solid #cddff4;border-radius:12px;box-shadow:0 18px 40px -18px #143b6b88; }
.mention-menu li { display:flex;flex-direction:column;padding:7px 10px;border-radius:8px;cursor:pointer;font-size:.85rem; }
.mention-menu li small { color:#6a83a0; }
.mention-menu li.active,.mention-menu li:hover { background:#e5effc; }

/* Search */
.search-form .inline-form { margin-bottom:12px; }
.search-form details summary { cursor:pointer;font-weight:600;color:#2368c4;font-size:.86rem; }
.search-form .form-grid { grid-template-columns:repeat(auto-fill,minmax(210px,1fr));margin-top:14px; }
.search-form select[multiple] { min-height:96px; }
.date-range { display:flex;gap:6px; }
.date-range .input { min-width:0; }
.saved-filters { display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:16px; }
.saved-chip { display:inline-flex;align-items:center;gap:4px;padding:4px 6px 4px 12px;border-radius:16px;background:#fff;border:1px solid #d9e4f2;font-size:.82rem; }
.saved-chip a { color:#17457b;font-weight:600; }
.saved-chip form { display:inline; }
.sort-links a { padding:2px 6px;border-radius:6px;color:#2368c4; }
.sort-links a.active { background:#e5effc;font-weight:700; }

/* Notifications */
.notif-list { display:flex;flex-direction:column;gap:8px; }
.notif { display:flex;gap:12px;align-items:flex-start;padding:14px 16px;background:#fff;border:1px solid #d9e4f2;border-radius:14px; }
.notif.unread { border-left:4px solid #287eef;background:#fbfdff; }
.notif input[type=checkbox] { width:16px;height:16px;margin-top:4px;accent-color:#287eef; }
.notif-icon { font-size:1.2rem; }
.notif-body { flex:1;min-width:0;overflow-wrap:anywhere; }
.notif-body a { color:#153253;font-weight:600; }
.notif.unread .notif-body a { font-weight:800; }
.notif-body p { margin:3px 0 0;color:#526c88;font-size:.85rem; }
.notif time,.notif .muted { font-size:.76rem;white-space:nowrap; }
.unread-dot { display:inline-block;width:9px;height:9px;border-radius:50%;background:#287eef;margin-top:6px; }

/* Settings, timesheet and admin */
.two-col { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;align-items:start; }
.profile-head { display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin-bottom:18px; }
.profile-head h2 { margin:0; }
.pref-table td,.pref-table th { text-align:center; }
.pref-table td:first-child,.pref-table th:first-child { text-align:left; }
.pref-table input { width:17px;height:17px;accent-color:#287eef; }
.timer-panel { display:flex;flex-wrap:wrap;gap:10px;align-items:center;background:#effbf6 !important;border-color:#b5e3cc; }
.timer-panel form { display:inline;margin-left:auto; }
.timesheet-grid td,.timesheet-grid th { text-align:center;white-space:nowrap; }
.timesheet-grid td:first-child,.timesheet-grid th:first-child { text-align:left;white-space:normal;min-width:220px; }
.timesheet-grid th.today,.timesheet-grid td.today { background:#eaf3ff !important; }
.timesheet-grid tfoot td { font-weight:700;background:#f6f9fe; }
.form-actions { display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:8px; }
.sub-panel { padding:18px;margin-top:16px;border:1px solid #e1eaf5;border-radius:14px;background:#f9fbfe; }
.status-admin { display:flex;flex-direction:column;gap:8px;margin-bottom:22px; }
.status-row .input { flex:1 1 140px; }
.status-row select.input { flex:0 1 150px; }
.perm-matrix th,.perm-matrix td { text-align:center;font-size:.8rem; }
.perm-matrix th:first-child,.perm-matrix td:first-child { text-align:left;white-space:nowrap; }
.perm-matrix select.input { padding:5px 6px;font-size:.76rem;width:auto; }
.perm-matrix input[type=checkbox] { width:16px;height:16px;accent-color:#287eef; }
.danger-zone { margin-top:22px;padding:16px;border:1px solid #f5c5ce !important;border-radius:14px;background:#fff8f9 !important; }
.check-col + td { white-space:nowrap; }

/* Landing page board preview */
.hv-board { display:grid;grid-template-columns:repeat(3,1fr);gap:10px; }
.hv-col { display:flex;flex-direction:column;gap:8px;padding:10px;border-radius:12px;background:#ffffff0d; }
.hv-col small { font:700 .62rem var(--font);letter-spacing:1px;color:#b5cbe6; }
.hv-col i { display:block;padding:9px;border-radius:9px;background:#ffffff14;border-left:3px solid #8fc9ff;font-style:normal;font-size:.74rem; }
.hv-col i.hot { border-left-color:#ffb347;background:#ffb34722; }
.hv-col i.done { border-left-color:#4ff0b8;opacity:.75;text-decoration:line-through; }

@media(max-width:1100px) {
    .ticket-layout { grid-template-columns:minmax(0,1fr); }
    .ticket-side { position:static; }
    .grid-2,.two-col { grid-template-columns:minmax(0,1fr); }
}
@media(max-width:760px) {
    .header-actions { gap:6px; }
    .bell { width:36px;height:36px; }
    .timer-chip span { display:none; }
    .workspace-content h1 { font-size:1.55rem; }
    .ticket-head h1 { font-size:1.35rem; }
    .page-heading,.ticket-actions { flex-direction:column;align-items:stretch; }
    .filter-bar .input,.filter-bar input[type=search] { flex:1 1 140px;max-width:none;min-width:0; }
    .board-filters .board-count { margin-left:0; }
    .board-row { grid-template-columns:repeat(var(--cols),minmax(78vw,1fr));min-width:0; }
    .board { scroll-snap-type:x mandatory; }
    .board-col,.board-col-head { scroll-snap-align:start; }
    .board .card-move { display:flex; }
    .backlog-item { flex-wrap:wrap; }
    .backlog-summary { flex-basis:100%;order:3;white-space:normal; }
    .backlog-assignee { width:auto; }
    .dash-grid { grid-template-columns:minmax(0,1fr); }
    .time-summary { grid-template-columns:1fr; }
    .comment.reply { margin-left:14px; }
    .bar-row { grid-template-columns:minmax(70px,110px) 1fr auto; }
    .menu-panel { right:auto;left:0; }
    .toast-stack { right:10px;left:10px;bottom:10px;width:auto; }
}
