.lane-colour-settings { display: flex; align-items: center; gap: 0; margin-left: auto; padding: 3px 8px; border: 1px solid #dfe3eb; border-radius: 7px; background: #f8faff; }.lane-colour-settings input[type="color"] { width: 26px; height: 26px; padding: 0; border: none; border-radius: 50%; background: transparent; cursor: pointer; }.lane-colour-settings input[type="color"]::-webkit-color-swatch-wrapper { padding: 0; }.lane-colour-settings input[type="color"]::-webkit-color-swatch { border: 1px solid rgba(23,43,77,.18); border-radius: 50%; }.lane-colour-settings input[type="color"]::-moz-color-swatch { border: 1px solid rgba(23,43,77,.18); border-radius: 50%; }.lane-colour-settings select { width: 96px; margin-left: 8px; padding: 2px 4px; border: none; border-left: 1px solid #e3e7ef; border-radius: 0; background: transparent; color: #52627a; font-size: .8rem; cursor: pointer; }.lane-colour-settings select:focus { outline: none; box-shadow: none; }.lane-opacity { width: 80px; margin-left: 8px; padding-left: 8px; border-left: 1px solid #e3e7ef; accent-color: #1769e0; }
body { background: #f8f9fa; }
/* the CMS pins/compensates elements by JS (scale-mode fixed, slides, fades)
   — the browser's scroll anchoring fights those corrections and STALLS
   scrolling mid-page (Firefox). The CMS is the anchor. */
html, body { overflow-anchor: none; }
[v-cloak] { display: none; }
.hero-section { background: linear-gradient(135deg, #0d6efd 0%, #6610f2 100%); color: white; }
.ui-accordion .ui-accordion-header { background: #e9ecef; border: 1px solid #dee2e6; }
.ui-tabs .ui-tabs-nav { background: #f8f9fa; }

.admin-shell { min-height: calc(100vh - 72px); display: flex; background: #f6f7fb; color: #172b4d; }
.admin-sidebar { width: 248px; flex: 0 0 248px; display: flex; flex-direction: column; background: #172b4d; color: #dfe7f3; padding: 24px 14px 18px; }
.admin-brand { display: flex; gap: 12px; align-items: center; padding: 0 12px 28px; border-bottom: 1px solid rgba(255,255,255,.12); }
.admin-brand-mark { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 8px; background: #4c8dff; color: #fff; }
.admin-brand strong, .admin-brand small { display: block; }
.admin-brand strong { color: #fff; font-size: .9rem; }
.admin-brand small { color: #aebbd0; font-size: .72rem; margin-top: 3px; }
.admin-nav { display: grid; gap: 4px; padding-top: 22px; }
.admin-nav-item { position: relative; display: flex; align-items: center; gap: 12px; width: 100%; border: 0; border-radius: 6px; background: transparent; color: #b8c6d9; padding: 11px 12px; text-align: left; font-size: .9rem; }
.admin-nav-item:hover { background: rgba(255,255,255,.08); color: #fff; }
.admin-nav-item.active { background: #2e4d78; color: #fff; box-shadow: inset 3px 0 #67a3ff; }
.admin-nav-item i:first-child { width: 18px; text-align: center; }
.admin-nav-indicator { margin-left: auto; color: #ffb44c; font-size: 1.4rem; }
.admin-sidebar-footer { display: flex; gap: 8px; align-items: center; margin-top: auto; padding: 15px 12px 0; border-top: 1px solid rgba(255,255,255,.12); color: #aebbd0; font-size: .75rem; }
.status-dot { width: 8px; height: 8px; border-radius: 50%; background: #36b37e; box-shadow: 0 0 0 3px rgba(54,179,126,.16); }
.admin-main { min-width: 0; flex: 1; padding: 38px clamp(20px, 4vw, 56px) 64px; }
.admin-header { display: flex; justify-content: space-between; gap: 20px; align-items: flex-start; margin-bottom: 30px; }
.admin-header h1 { margin: 0; font-size: clamp(1.65rem, 2.5vw, 2.15rem); font-weight: 650; letter-spacing: -.02em; }
.admin-eyebrow, .admin-kicker { color: #6b778c; font-size: .72rem; font-weight: 700; letter-spacing: .09em; margin: 0 0 7px; text-transform: uppercase; }
.admin-description, .admin-muted { color: #6b778c; font-size: .88rem; }
.admin-description { margin: 8px 0 0; }
.admin-section { animation: admin-fade .18s ease-out; }
.admin-stat-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-bottom: 22px; }
.admin-stat, .admin-card { background: #fff; border: 1px solid #e4e8f0; border-radius: 8px; box-shadow: 0 2px 7px rgba(23,43,77,.04); }
.admin-stat { display: flex; gap: 14px; align-items: center; padding: 20px; }
.admin-stat-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 8px; font-size: 1.1rem; }
.admin-stat-icon.blue { background: #e8f1ff; color: #1769e0; }.admin-stat-icon.violet { background: #f0ebff; color: #6554c0; }.admin-stat-icon.green { background: #e7f8f0; color: #178557; }.admin-stat-icon.orange { background: #fff3df; color: #b86b00; }
.admin-stat strong, .admin-stat span { display: block; }.admin-stat strong { font-size: 1.55rem; line-height: 1.1; }.admin-stat div span { color: #6b778c; font-size: .78rem; margin-top: 5px; }
.admin-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.admin-card { padding: 24px; }.admin-card-heading { display: flex; justify-content: space-between; gap: 14px; align-items: flex-start; margin-bottom: 20px; }.admin-card h2, .admin-subheading { font-size: 1.08rem; margin: 0; font-weight: 650; }.admin-card-heading p { margin-bottom: 5px; }
.admin-details { margin: 0; }.admin-details div { display: flex; justify-content: space-between; gap: 20px; padding: 13px 0; border-bottom: 1px solid #edf0f5; }.admin-details div:last-child { border-bottom: 0; }.admin-details dt { color: #6b778c; font-size: .82rem; }.admin-details dd { margin: 0; text-align: right; font-size: .86rem; font-weight: 600; }
.admin-toolbar { display: flex; justify-content: space-between; gap: 16px; align-items: center; margin-bottom: 18px; }.admin-search { display: flex; align-items: center; gap: 9px; width: min(420px, 100%); background: #fff; border: 1px solid #dfe3eb; border-radius: 6px; padding: 0 12px; color: #6b778c; }.admin-search input { width: 100%; border: 0; outline: 0; padding: 10px 0; }.admin-create-form { margin-bottom: 18px; }
.admin-table { margin: -4px 0; }.admin-table th { border-bottom: 1px solid #dfe3eb; color: #6b778c; font-size: .72rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; white-space: nowrap; }.admin-table td { border-color: #edf0f5; font-size: .86rem; }.user-cell { display: flex; align-items: center; gap: 10px; }.user-cell strong, .user-cell small { display: block; }.user-cell small { color: #6b778c; margin-top: 3px; }.user-avatar { width: 32px; height: 32px; display: inline-grid; place-items: center; border-radius: 50%; background: #deebff; color: #1558b0; font-size: .72rem; font-weight: 700; }.user-avatar.small { width: 27px; height: 27px; margin-right: -5px; border: 2px solid #fff; }.status-label { display: inline-flex; align-items: center; gap: 7px; font-size: .8rem; }.status-label span { width: 7px; height: 7px; border-radius: 50%; }.status-label.active { color: #168356; }.status-label.active span { background: #36b37e; }.status-label.inactive { color: #b86b00; }.status-label.inactive span { background: #ffab00; }.edit-row td { background: #f8faff; }.empty-state { color: #6b778c; padding: 35px !important; text-align: center; }
.group-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }.group-card { min-height: 190px; }.group-card-top { display: flex; justify-content: space-between; align-items: flex-start; }.group-icon, .menu-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 7px; background: #e8f1ff; color: #1769e0; }.group-card h3 { margin: 22px 0 4px; font-size: 1.05rem; }.group-card p { color: #6b778c; font-size: .83rem; margin-bottom: 18px; }.avatar-stack { display: flex; margin-bottom: 16px; }
.form-switch { display: inline-flex; align-items: center; gap: 8px; color: #42526e; font-size: .82rem; white-space: nowrap; }.form-switch input { width: 2em; height: 1em; accent-color: #1769e0; }
.menu-list { display: grid; gap: 8px; }.menu-row { display: grid; grid-template-columns: 20px 34px minmax(150px, 1fr) minmax(150px, 220px) auto minmax(150px, 220px) auto; gap: 12px; align-items: center; padding: 11px 0; border-bottom: 1px solid #edf0f5; }.menu-row:last-child { border-bottom: 0; }.menu-drag { color: #97a4b8; cursor: grab; }.menu-drag:active { cursor: grabbing; }.menu-fields { display: flex; align-items: center; gap: 12px; }.menu-fields .form-control { max-width: 220px; }.menu-icon-editor .input-group-text { color: #1769e0; background: #f5f8ff; }.menu-groups { min-height: 36px; }
.board-toolbar { display: flex; justify-content: space-between; gap: 18px; align-items: flex-start; margin-bottom: 18px; }.board-lanes { display: grid; grid-template-columns: repeat(5, minmax(205px, 1fr)); gap: 12px; overflow-x: auto; padding-bottom: 8px; }.board-lane { min-height: 410px; border: 1px solid #e0e5ed; border-radius: 8px; background: #fff; padding: 10px; }.board-lane-header { display: flex; justify-content: space-between; align-items: center; padding: 3px 4px 11px; }.board-lane-header > div { display: flex; align-items: center; gap: 8px; }.lane-dot { width: 8px; height: 8px; border-radius: 50%; background: #97a4b8; }.lane-dot.in_progress { background: #4c8dff; }.lane-dot.review { background: #ffab00; }.lane-dot.done { background: #36b37e; }.lane-count { min-width: 20px; padding: 1px 6px; border-radius: 10px; background: #dfe4ec; color: #52627a; font-size: .72rem; text-align: center; }
.board-lanes.board-layout-rows { grid-template-columns: 1fr; }.board-lanes.board-layout-rows .board-lane { min-height: auto; display: flex; flex-direction: column; }.board-lanes.board-layout-rows .board-cards { display: flex; flex-wrap: wrap; gap: 9px; }
.board-lanes.board-layout-compact { grid-template-columns: 1fr; gap: 8px; }.board-lanes.board-layout-compact .board-lane { min-height: auto; padding: 8px 10px; background: #fff; }.board-lanes.board-layout-compact .board-lane-header { padding: 0 0 8px; }.board-lanes.board-layout-compact .board-cards { display: flex; flex-direction: column; gap: 6px; }.board-lanes.board-layout-compact .ticket-card { padding: 8px 30px 8px 10px; }.board-lanes.board-layout-compact .ticket-card h3 { margin: 6px 0 4px; }.board-lanes.board-layout-compact .ticket-card p { margin-bottom: 6px; }.board-cards { display: grid; gap: 9px; }.ticket-card { cursor: pointer; border: 1px solid #e0e5ed; border-radius: 7px; background: #fff; padding: 12px 32px 12px 12px; box-shadow: 0 2px 4px rgba(23,43,77,.06); position: relative; }.ticket-card:hover { border-color: #8bb6ff; box-shadow: 0 4px 10px rgba(23,43,77,.1); }.ticket-card:active { cursor: grabbing; }.ticket-card-top, .ticket-card-bottom { display: flex; justify-content: space-between; gap: 8px; align-items: center; }
.ticket-card .ticket-compact-toggle { position: absolute; top: 6px; right: 6px; width: 22px; height: 22px; display: grid; place-items: center; border: 0; border-radius: 5px; background: transparent; color: #97a4b8; opacity: 0; transition: opacity .15s ease, background .15s ease; }
.ticket-card:hover .ticket-compact-toggle { opacity: 1; }
.ticket-card .ticket-compact-toggle:hover { background: #f0f3f9; color: #1769e0; }
.ticket-card.is-compact { padding: 8px 30px 8px 10px; }
.ticket-card.is-compact .ticket-card-top { margin-bottom: 0; }
.ticket-card.is-compact h3 { margin: 0; font-size: .8rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ticket-card.is-compact p { display: none; }
.ticket-card.is-compact .ticket-card-bottom { display: none; }
.ticket-card.is-compact .priority-chip { font-size: .6rem; padding: 2px 4px; }
.ticket-card.is-compact .ticket-key { display: flex; align-items: center; gap: 6px; }
.ticket-card.is-compact .ticket-assignee { margin-left: 8px; }
.ticket-group-card { border-left: 4px solid #6554c0; background: #f9f8ff; }
.ticket-group-card .ticket-key { color: #6554c0; }
.ticket-group-badge { display: inline-flex; align-items: center; gap: 4px; border-radius: 4px; padding: 3px 6px; background: #e9e5ff; color: #6554c0; font-size: .64rem; font-weight: 700; }
.ticket-group-children { display: grid; gap: 8px; padding-left: 18px; border-left: 2px dashed #d4d8e3; margin: -4px 0 10px 8px; }
.ticket-child-card { box-shadow: none; background: #fcfcfd; }
.board-global-compact { display: flex; gap: 6px; }.ticket-key { color: #1769e0; font-size: .72rem; font-weight: 700; }.ticket-key i { margin-right: 5px; }.ticket-card h3 { margin: 12px 0 8px; color: #172b4d; font-size: .9rem; line-height: 1.35; }.ticket-card p { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; color: #6b778c; font-size: .76rem; line-height: 1.4; margin-bottom: 14px; }.priority-chip { display: inline-flex; align-items: center; gap: 4px; border-radius: 4px; padding: 3px 5px; font-size: .64rem; }.priority-chip.lowest, .priority-chip.low { background: #e7f8f0; color: #168356; }.priority-chip.medium { background: #fff3df; color: #9b6500; }.priority-chip.high, .priority-chip.highest { background: #ffebe7; color: #c9372c; }.estimate-badge { border: 1px solid #dfe3eb; border-radius: 4px; color: #52627a; font-size: .67rem; font-weight: 700; padding: 2px 5px; }.ticket-assignee { display: grid; place-items: center; width: 23px; height: 23px; margin-left: auto; border-radius: 50%; background: #deebff; color: #1558b0; font-size: .6rem; font-weight: 700; }.ticket-links { color: #6b778c; font-size: .72rem; }.empty-lane { min-height: 70px; border: 1px dashed #c6cfdd; border-radius: 6px; background: transparent; color: #6b778c; font-size: .78rem; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; cursor: pointer; }.empty-lane:hover { border-color: #4c8dff; color: #1769e0; }.empty-lane i { font-size: 1.2rem; opacity: .7; }.ticket-editor { margin-bottom: 18px; }.ticket-editor-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 20px; }.ticket-links-panel { margin-top: 18px; }.ticket-link-list { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }.ticket-link-list .btn-close { width: .5em; height: .5em; margin-left: 5px; }
.board-page { width: 100%; max-width: none; padding: 24px clamp(16px, 3vw, 42px) 48px; background: #f6f7fb; }.board-titlebar { display: flex; align-items: center; gap: 12px; }.board-titlebar h1 { margin: 0; color: #172b4d; font-size: 1.2rem; font-weight: 650; }.board-titlebar p { margin: 2px 0 0; color: #6b778c; font-size: .76rem; }.board-settings-button { display: grid; place-items: center; width: 30px; height: 30px; margin-left: 4px; border: 1px solid #dfe3eb; border-radius: 6px; background: #fff; color: #52627a; }.board-settings-button:hover { color: #1769e0; border-color: #8bb6ff; }.permissions-overlay { position: fixed; inset: 0; z-index: 1060; display: grid; place-items: center; padding: 20px; background: rgba(23,43,77,.42); overflow-y: auto; }.permissions-dialog { width: min(700px, 100%); max-height: calc(100vh - 40px); overflow-y: auto; }.ticket-overlay { position: fixed; inset: 0; z-index: 1050; display: flex; flex-direction: column; gap: 12px; align-items: stretch; overflow-y: auto; padding: 32px max(16px, 4vw); background: rgba(23,43,77,.48); }.ticket-overlay .ticket-editor, .ticket-overlay .ticket-attachments-panel, .ticket-overlay .ticket-links-panel, .ticket-overlay .ticket-history-panel { width: min(1000px, 100%); margin: 0 auto; }.ticket-overlay .ticket-editor { max-height: none; overflow: visible; }.ticket-overlay .ticket-attachments-panel, .ticket-overlay .ticket-links-panel { flex: 0 0 auto; }
.board-actions { display: flex; gap: 8px; align-items: center; }.board-actions .form-select { min-width: 210px; }.board-create-form { margin-bottom: 18px; }.board-meta { display: flex; justify-content: space-between; gap: 24px; align-items: flex-start; margin-bottom: 18px; }.board-meta strong, .board-meta p { display: block; }.board-project-key { display: inline-block; margin-right: 9px; color: #1769e0; font-size: .75rem; font-weight: 700; }.board-meta strong { font-size: 1rem; }.board-meta p { margin: 6px 0 0; color: #6b778c; font-size: .82rem; }.board-access-editor { width: min(260px, 100%); }.editor-toolbar { display: flex; gap: 4px; padding: 6px; border: 1px solid #dfe3eb; border-bottom: 0; border-radius: 6px 6px 0 0; background: #f8faff; }.ticket-description-editor { min-height: 105px; overflow: auto; border-radius: 0 0 6px 6px; }.ticket-description-editor:empty:before { color: #97a4b8; content: attr(data-placeholder); }
.ticket-attachments-panel { margin-bottom: 18px; }.ticket-attachment-list { display: flex; flex-wrap: wrap; gap: 8px; }.ticket-attachment-item { display: flex; align-items: center; gap: 4px; padding: 4px 8px; border: 1px solid #e3e7ef; border-radius: 6px; background: #fff; }.ticket-attachment-item a { color: #1769e0; text-decoration: none; }.ticket-attachment-item button { padding: 0 2px; line-height: 1; }.ticket-link-list { display: flex; flex-direction: column; gap: 6px; margin-top: 12px; }.ticket-link-item { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 14px; border-radius: 8px !important; border: 1px solid #e3e7ef !important; background: #fff; }.ticket-link-item:hover { background: #f8f9fc; }.ticket-link-target { color: #172b4d; text-decoration: none; display: flex; align-items: center; gap: 8px; }.ticket-link-target:hover { text-decoration: underline; }
.ticket-link-row { flex: 1 1 auto; min-width: 0; }
.ticket-link-type { border-radius: 4px; font-weight: 600; font-size: .68rem; }
.ticket-link-key { display: inline-block; min-width: 10ch; }
.ticket-link-title { white-space: normal; word-break: break-word; }
.ticket-link-locked { cursor: not-allowed; }
.icon-picker { display: grid; grid-template-columns: repeat(8, 42px); gap: 8px; padding: 6px; border: 1px solid #dfe3eb; border-radius: 6px; background: #f8faff; width: fit-content; max-width: 100%; }.icon-option { flex: 0 0 42px; width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid #dfe3eb; border-radius: 6px; background: #fff; color: #52627a; font-size: 1.25rem; }.icon-option:hover { border-color: #8bb6ff; color: #1769e0; }.icon-option.active { border-color: #1769e0; background: #e8f1ff; color: #1769e0; }
.highlight-picker { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; padding: 6px; border: 1px solid #dfe3eb; border-radius: 6px; background: #f8faff; }.highlight-option { flex: 0 0 32px; width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid #dfe3eb; border-radius: 50%; background: #fff; color: #97a4b8; font-size: 1rem; box-shadow: inset 0 0 0 2px #fff; }.highlight-option:hover { transform: scale(1.08); }.highlight-option.active { border-color: #172b4d; box-shadow: inset 0 0 0 2px #fff, 0 0 0 2px #172b4d; }.highlight-option i { font-size: 1.1rem; }.highlight-custom { width: 42px; height: 32px; padding: 2px; border: 1px solid #dfe3eb; border-radius: 6px; background: #fff; cursor: pointer; }
.lane-editor-list { display: flex; flex-direction: column; gap: 6px; margin-bottom: 10px; padding: 0; list-style: none; }.lane-editor-item { display: flex; align-items: center; gap: 8px; padding: 8px; border: 1px solid #e3e7ef; border-radius: 7px; background: #fff; }.lane-drag-handle { color: #97a4b8; font-size: 1.1rem; cursor: grab; }.lane-drag-handle:active { cursor: grabbing; }.lane-editor-item .lane-id-input { max-width: 110px; }
.ticket-editor-panels { display: block; }
.ticket-editor-panels .ticket-attachments-panel, .ticket-editor-panels .ticket-links-panel, .ticket-editor-panels .ticket-comments-panel, .ticket-editor-panels .ticket-history-panel { width: 100%; margin: 0; }
.ticket-tabs { border: 1px solid #dfe3eb; border-radius: 8px; background: #fff; overflow: hidden; }
.ticket-tabs-wide { margin-top: 18px; }
.ticket-tabs-nav { display: flex; gap: 0; border-bottom: 1px solid #dfe3eb; background: #f8faff; }
.ticket-tab-button { flex: 1 1 auto; display: inline-flex; align-items: center; justify-content: center; gap: 4px; padding: 10px 14px; border: 0; border-bottom: 2px solid transparent; background: transparent; color: #52627a; font-size: .82rem; font-weight: 600; cursor: pointer; transition: background .15s ease, color .15s ease, border-color .15s ease; }
.ticket-tab-button:hover { background: rgba(23,105,224,.06); color: #1769e0; }
.ticket-tab-button.active { background: #fff; color: #1769e0; border-bottom-color: #1769e0; }
.ticket-tab-count { color: #6b778c; font-weight: 500; }
.ticket-tab-button.active .ticket-tab-count { color: #1769e0; }
.ticket-tab-pane { padding: 14px; }
.ticket-tab-pane .ticket-description-editor { border: 1px solid #dfe3eb; border-radius: 0 0 6px 6px; }
.ticket-tab-pane .editor-toolbar { border-radius: 6px 6px 0 0; }
.ticket-tab-pane .ticket-description-rendered { border-radius: 6px; min-height: 105px; }
.ticket-description-preview { margin-top: 12px; }
.ticket-description-box { border: 1px solid #dfe3eb; border-radius: 8px; background: #fff; overflow: hidden; }
.ticket-description-header { display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; border-bottom: 1px solid #dfe3eb; background: #f8faff; }
.ticket-description-label { color: #52627a; font-size: .82rem; font-weight: 600; }
.ticket-description-edit { padding: 2px 7px; color: #52627a; }
.ticket-description-edit:hover { color: #1769e0; background: #e8f1ff; border-color: #8bb6ff; }
.ticket-description-box .ticket-description-rendered { border: 0; border-radius: 0; min-height: 105px; background: #fff; }
.ticket-description-editor-wrap { padding: 0; }
.ticket-description-editor-wrap .editor-toolbar { border: 0; border-bottom: 1px solid #dfe3eb; border-radius: 0; }
.ticket-description-editor-wrap .ticket-description-editor { border: 0; border-radius: 0; min-height: 105px; }
.ticket-description-rendered { min-height: 60px; background: #f8faff; color: #172b4d; font-size: .86rem; }
.ticket-description-rendered > *:last-child { margin-bottom: 0; }
.ticket-key-link { color: #1769e0; font-weight: 700; text-decoration: none; border-bottom: 1px dashed #8bb6ff; }
.ticket-key-link:hover { text-decoration: none; border-bottom-style: solid; }
.ticket-comments-panel { margin-top: 18px; }.ticket-comment-list { display: flex; flex-direction: column; gap: 12px; margin-bottom: 16px; }.ticket-comment-item { padding: 12px 14px; border: 1px solid #e3e7ef; border-radius: 8px; background: #fff; }.ticket-comment-meta { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; font-size: .78rem; }.ticket-comment-meta strong { color: #172b4d; }.ticket-comment-body { color: #172b4d; font-size: .85rem; line-height: 1.45; word-break: break-word; }.ticket-comment-input textarea { resize: vertical; }
.ticket-groups-panel { margin-top: 18px; }.ticket-group-list { display: flex; flex-direction: column; gap: 6px; margin-top: 12px; }
.ticket-hover-card { position: fixed; z-index: 1070; width: 260px; padding: 12px; border: 1px solid #e0e5ed; border-radius: 8px; background: #fff; box-shadow: 0 8px 24px rgba(23,43,77,.16); pointer-events: none; }
.ticket-hover-card .ticket-card { box-shadow: none; border: 1px solid #e3e7ef; }
@media (max-width: 900px) { .ticket-editor-panels { grid-template-columns: 1fr; } }
.ticket-history-panel { margin-top: 12px; }.ticket-history-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }.ticket-history-list li { display: grid; gap: 2px; padding: 10px 12px; border: 1px solid #e3e7ef; border-radius: 7px; background: #fff; }.history-field { font-size: .72rem; font-weight: 700; color: #1769e0; text-transform: uppercase; }.history-meta { font-size: .72rem; color: #6b778c; }.history-change { font-size: .83rem; color: #172b4d; }
@keyframes admin-fade { from { opacity: .4; transform: translateY(3px); } to { opacity: 1; transform: translateY(0); } }
.yaml-form { max-width: 760px; margin: 0 auto 32px; padding: 28px; border: 1px solid #e0e5ed; border-radius: 8px; background: #fff; box-shadow: 0 4px 14px rgba(23,43,77,.06); }.yaml-form h2 { margin-bottom: 8px; }.yaml-form-description { color: #6b778c; }.yaml-form-field { margin-top: 18px; }.yaml-form-error { min-height: 1.2em; margin-top: 5px; color: #b42318; font-size: .8rem; }.yaml-form-wysiwyg { min-height: 130px; overflow: auto; }.yaml-form-wysiwyg:empty:before { color: #97a4b8; content: attr(data-placeholder); }.yaml-form-header { margin: 28px 0 0; font-size: 1rem; }.yaml-form-panel { margin-top: 18px; padding: 12px 14px; border-left: 3px solid #1769e0; background: #f5f8ff; }.yaml-form-panel p { margin: 4px 0 0; color: #6b778c; }.yaml-form-slider-value { display: inline-block; min-width: 24px; margin-left: 8px; color: #52627a; font-size: .85rem; }
.yaml-form-wide { max-width: none; }
.yaml-form-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 0 18px; }.yaml-form-grid h2, .yaml-form-grid .yaml-form-description, .yaml-form-grid .yaml-form-header, .yaml-form-grid .yaml-form-status, .yaml-form-grid > button { grid-column: 1 / -1; }.yaml-form-grid .yaml-form-field { grid-column: span 12; }.yaml-form-grid .yaml-form-col-1 { grid-column: span 1; }.yaml-form-grid .yaml-form-col-2 { grid-column: span 2; }.yaml-form-grid .yaml-form-col-3 { grid-column: span 3; }.yaml-form-grid .yaml-form-col-4 { grid-column: span 4; }.yaml-form-grid .yaml-form-col-5 { grid-column: span 5; }.yaml-form-grid .yaml-form-col-6 { grid-column: span 6; }.yaml-form-grid .yaml-form-col-7 { grid-column: span 7; }.yaml-form-grid .yaml-form-col-8 { grid-column: span 8; }.yaml-form-grid .yaml-form-col-9 { grid-column: span 9; }.yaml-form-grid .yaml-form-col-10 { grid-column: span 10; }.yaml-form-grid .yaml-form-col-11 { grid-column: span 11; }.yaml-form-grid .yaml-form-col-12 { grid-column: span 12; }
@media (max-width: 900px) { .admin-sidebar { width: 205px; flex-basis: 205px; }.admin-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.admin-columns { grid-template-columns: 1fr; }.menu-row { grid-template-columns: 20px 34px 1fr auto; }.menu-row .menu-icon-editor, .menu-row .menu-groups { grid-column: 3 / 4; }.menu-row > .btn { grid-column: 4; grid-row: 1 / span 3; }.board-lanes { grid-template-columns: repeat(5, 230px); }.board-lanes.board-layout-rows, .board-lanes.board-layout-compact { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .admin-shell { display: block; }.admin-sidebar { width: 100%; padding: 12px; }.admin-brand { padding-bottom: 12px; }.admin-nav { display: flex; overflow-x: auto; padding-top: 12px; }.admin-nav-item { min-width: 105px; justify-content: center; }.admin-sidebar-footer { display: none; }.admin-main { padding: 25px 14px 45px; }.admin-header, .admin-toolbar { align-items: stretch; flex-direction: column; }.admin-stat-grid { gap: 10px; }.admin-stat { padding: 14px; }.admin-stat-icon { width: 34px; height: 34px; }.admin-card { padding: 17px; }.menu-row { grid-template-columns: 20px 34px 1fr; }.menu-row .menu-icon-editor, .menu-row .form-switch, .menu-row .menu-groups, .menu-row > .btn { grid-column: 3; grid-row: auto; }.menu-fields { display: block; }.menu-fields .admin-muted { display: block; margin-top: 4px; } }
@media (max-width: 640px) { .yaml-form-grid .yaml-form-field { grid-column: 1 / -1 !important; } }

/* Many-to-many group frames */
.board-group-row-title {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 2px 4px 12px;
}
.board-group-row-title.is-compact {
  margin-bottom: 0;
  padding-bottom: 10px;
}
.board-group-title-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  border-radius: 999px;
  font-size: .82rem;
  font-weight: 700;
}
.board-group-title-text {
  cursor: text;
  border-bottom: 1px dashed transparent;
}
.board-group-title-text:hover {
  border-bottom-color: currentColor;
}
.board-group-rename-input {
  width: 220px;
  padding: 2px 6px;
  font-size: .82rem;
  font-weight: 700;
  line-height: 1.2;
}
.board-group-action {
  padding: 2px 6px;
  color: #6b778c;
  opacity: 0;
  transition: opacity .15s ease, color .15s ease;
}
.board-group-row-title:hover .board-group-action {
  opacity: 1;
}
.board-group-action:hover {
  color: #172b4d;
}
.board-group-action.text-danger:hover {
  color: #c9372c;
}
.board-group-key {
  color: #6b778c;
  font-size: .72rem;
  font-weight: 600;
}
.board-group-count {
  min-width: 20px;
  padding: 1px 6px;
  border-radius: 10px;
  background: #dfe4ec;
  color: #52627a;
  font-size: .72rem;
  text-align: center;
}
.board-group-lane {
  display: flex;
  flex-direction: column;
}

.board-group-lane-compact {
  min-height: auto;
}
.board-group-frame {
  flex: 1;
  width: 100%;
  min-height: 80px;
  padding: 2px;
  background: transparent;
}
.board-group-frame-compact {
  min-height: 36px;
  padding: 6px 8px;
  display: flex;
  align-items: center;
}
.board-group-frame-empty {
  min-height: 70px;
  display: grid;
  place-items: center;
  background: #f8f9fb;
}
.board-group-frame > .board-cards {
  gap: 7px;
}
.board-group-lane-summary {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: .72rem;
  color: #6b778c;
}
.empty-group-lane {
  min-height: 50px;
  border-color: transparent;
  background: transparent;
  color: #97a4b8;
  font-size: .72rem;
}
.board-group-title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  font-size: .82rem;
  font-weight: 700;
  color: #172b4d;
}
.board-group-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
}
.board-lanes.board-layout-rows .board-group-frame,
.board-lanes.board-layout-compact .board-group-frame {
  width: 100%;
  margin-bottom: 8px;
  padding: 8px 10px;
  background: #fff;
}
.board-lanes.board-layout-rows .board-group-frame > .board-cards {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.board-lanes.board-layout-compact .board-group-frame > .board-cards {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.board-search { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.board-search .input-group { flex: 1; }
.board-search .input-group .form-control { border-left: 0; }
.board-search-count { color: #6b778c; font-size: .8rem; white-space: nowrap; }

/* Board lane containers (white cards holding lanes/groups) */
.board-lanes.board-layout-columns { grid-template-columns: minmax(0, 1fr); overflow-x: visible; padding-bottom: 0; }
.board-lane-group { grid-column: 1 / -1; min-width: 0; background: #fff; border: 1px solid #e4e8f0; border-radius: 10px; box-shadow: 0 2px 7px rgba(23,43,77,.04); padding: 14px; }
.board-lane-group-grid { display: grid; grid-template-columns: repeat(5, minmax(205px, 1fr)); gap: 12px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: none; -ms-overflow-style: none; }
.board-lane-group-grid::-webkit-scrollbar { display: none; }
.board-lanes { scrollbar-width: none; -ms-overflow-style: none; }
.board-lanes::-webkit-scrollbar { display: none; }

/* Due date badge on ticket cards */
.ticket-card-flags { display: inline-flex; align-items: center; gap: 5px; }
.due-badge { display: inline-flex; align-items: center; gap: 3px; border-radius: 4px; padding: 3px 5px; font-size: .64rem; font-weight: 600; white-space: nowrap; }
.due-badge.overdue { background: #ffebe7; color: #c9372c; }
.due-badge.due-today { background: #fff3df; color: #9b6500; }
.due-badge.due-soon { background: #fff3df; color: #9b6500; }
.due-badge.due-future { background: #eef1f6; color: #52627a; }
.ticket-card.is-compact .due-badge { font-size: .6rem; padding: 2px 4px; }

.automation-dialog { width: min(1400px, calc(100vw - 40px)); height: min(880px, calc(100vh - 40px)); overflow: hidden; display: flex; flex-direction: column; }
.automation-dialog .automation-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; }
.automation-body { display: block; }
.automation-overview-bar { display: flex; gap: 8px; align-items: center; margin-bottom: 14px; flex-wrap: wrap; }
.automation-overview-bar .automation-search { max-width: 340px; }
.automation-overview-bar .automation-filter { width: 130px; }
.automation-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; }
.automation-tile { border: 1px solid #c3d3ec; border-radius: 8px; padding: 12px 14px; cursor: pointer; background: #fff; transition: border-color .15s ease, box-shadow .15s ease; }
.automation-tile:hover { border-color: #8fb0e6; box-shadow: 0 4px 12px rgba(23,43,77,.08); }
.automation-tile.active { border-color: #1769e0; }
.automation-tile .automation-item-head strong { color: #1769e0; }
.automation-crumb { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.automation-crumb-path { font-size: 1.05rem; font-weight: 650; color: #172b4d; }
.automation-crumb-path strong { color: #1769e0; }
.automation-sidebar { border-right: 1px solid #e7eaf0; padding-right: 1rem; }
.automation-list { display: flex; flex-direction: column; gap: .5rem; margin-bottom: .75rem; list-style: none; padding-left: 0; }
.automation-item { border: 1px solid #e7eaf0; border-radius: 8px; padding: .5rem .75rem; cursor: pointer; }
.automation-item.active { border-color: #0d6efd; background: #f4f8ff; }
.automation-item-head { display: flex; align-items: center; gap: .5rem; }
.automation-item-head .form-check-input { margin-top: 0; }
.automation-item-meta { display: flex; align-items: center; gap: .5rem; font-size: .75rem; color: #6c7a8f; }
.automation-main { min-width: 0; }
.automation-editor { padding: 0 8px; }
.automation-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.automation-dot.ok { background: #1f9d55; }
.automation-dot.err { background: #c9372c; }
.automation-dot.none { background: #c4ccd8; }
.automation-tabs-nav { display: flex; gap: .25rem; border-bottom: 1px solid #e7eaf0; margin-bottom: 1rem; }
.automation-badge { font-size: .7rem; background: #eef1f6; color: #52627a; border-radius: 10px; padding: 2px 8px; }
.automation-badge-off { background: #6b778c; color: #fff; }
.automation-step-disabled { opacity: .5; }
.automation-badge.err { background: #fdecea; color: #c9372c; }
.automation-badge.warn { background: #fff7e6; color: #b26a00; }
.automation-badge.muted { background: #e9ecef; color: #6c757d; }
.automation-steps { display: flex; flex-direction: column; gap: .5rem; }
.automation-step { border: 1px solid #e7eaf0; border-left: 3px solid #0d6efd; border-radius: 8px; padding: .5rem .75rem; background: #fff; }
.automation-step-head { display: flex; align-items: center; gap: .5rem; }
.automation-step-type { font-size: .75rem; font-weight: 600; text-transform: uppercase; color: #52627a; }
.automation-step-actions { display: flex; align-items: center; }
.automation-step-children { margin: .5rem 0 .25rem 1rem; padding-left: .75rem; border-left: 2px dashed #dbe1ea; display: flex; flex-direction: column; gap: .5rem; }
.automation-add-step { display: flex; gap: .5rem; align-items: center; margin-top: .5rem; }
.automation-code { width: 100%; min-height: 320px; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .85rem; background: #14161a; color: #d7dce4; border: 1px solid #2a2e36; border-radius: 8px; padding: .75rem; }
.automation-code-small { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .82rem; }
.automation-log { background: #f6f7f9; border: 1px solid #e7eaf0; border-radius: 8px; padding: .75rem; max-height: 300px; overflow: auto; font-size: .8rem; white-space: pre-wrap; }
.automation-var-entry { margin-bottom: 10px; }
.automation-var-key { display: inline-block; margin-bottom: 4px; font-size: .78rem; color: #52627a; background: #eef1f6; border-radius: 4px; padding: 1px 6px; }
.automation-var-filter { max-width: 260px; margin-bottom: 6px; }
.automation-table-wrap { max-height: 320px; overflow: auto; border: 1px solid #e3e7ef; border-radius: 8px; }
.automation-data-table { font-size: .8rem; }
.automation-data-table thead th { position: sticky; top: 0; background: #f4f6fa; z-index: 1; }
/* markdown pipe tables rendered inside ticket descriptions/comments */
.ticket-desc-table { border-collapse: collapse; margin: 8px 0; font-size: .85rem; max-width: 100%; }
.ticket-desc-table th, .ticket-desc-table td { border: 1px solid #dfe3eb; padding: 4px 10px; text-align: left; }
.ticket-desc-table thead th { background: #f4f6fa; font-weight: 650; }
/* interactive table widget in the ticket editor: search + per-column filters */
.desc-table-widget { margin: 8px 0; }
.desc-table-bar { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; }
.desc-table-search { max-width: 240px; }
.desc-table-filters th { padding: 2px 4px !important; background: #fafbfd !important; }
.desc-table-filters .form-select { font-size: .75rem; padding: 1px 22px 1px 6px; min-width: 70px; }
.table-scroll { overflow: auto; }
/* board cards: table previews are clamped so the action buttons stay visible … */
.board-lane-group .ticket-card.has-table { max-height: none; }
.board-lane-group.ticket-height-min .ticket-card-table { display: none; }
.ticket-card-table { position: relative; display: flex; flex-direction: column; margin: 2px 0 10px; border: 1px solid #e3e7ef; border-radius: 6px; background: #fff; }
.ticket-card-table .card-table-content { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.ticket-card-table .table-scroll { flex: 1 1 auto; min-height: 0; max-height: 96px; }
/* pinned (user-dragged or persisted) height: the scroll area fills it */
.ticket-card-table.pinned .table-scroll { max-height: none; height: 100%; }
.ticket-card-table .ticket-desc-table { margin: 0; font-size: .74rem; }
.ticket-card.is-compact .ticket-card-table { display: none; }
/* … unless the user pinned a height (same mechanics as the image thumbnail) */
.ticket-table-handle { position: absolute; right: 4px; bottom: 4px; width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center; font-size: 11px; color: #5a6b85; background: rgba(255,255,255,.92); border: 1px solid #cfd6e4; border-radius: 4px; cursor: ns-resize; opacity: 0; transition: opacity .15s ease; z-index: 2; }
.ticket-card:hover .ticket-table-handle { opacity: 1; }
.ticket-table-handle:hover { background: #fff; border-color: #8fa3c2; }
/* 2 s pressed flash on board card buttons so every click is visible */
.ticket-card-action.clicked { animation: card-btn-click 2s ease-out; }
@keyframes card-btn-click {
    0% { background: #deebff; border-color: #1769e0; box-shadow: 0 0 0 3px rgba(23,105,224,.4); }
    100% { background: transparent; box-shadow: 0 0 0 0 rgba(23,105,224,0); }
}
.automation-runs-table { font-size: .85rem; }
.automation-var-select { max-width: 220px; }
.automation-field-list { display: flex; flex-direction: column; gap: .4rem; }
.automation-vars { background: #f0f4ff; border-color: #d5e0f5; }
.ticket-appearance-box { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1px; border: 1px solid #dfe3eb; border-radius: 8px; background: #dfe3eb; }
.ticket-appearance-row { display: flex; flex-direction: column; justify-content: center; min-width: 0; padding: 10px 12px; background: #fff; }
/* compact variant that lives between the editor's top action buttons */
.ticket-appearance-inline { display: flex; align-items: flex-end; gap: 16px; margin: 0 auto; padding: 0 10px; }
.ticket-appearance-inline-item { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ticket-appearance-inline-item > .form-label { font-size: .7rem; color: #97a4b8; white-space: nowrap; }
.ticket-appearance-inline .combo-select-toggle { height: 30px; }
.ticket-appearance-inline .combo-select { width: 74px; }
.ticket-appearance-inline .highlight-custom { width: 28px; height: 30px; padding: 2px; }
/* ticket custom-field groups: values flow and wrap, switches/buttons wrap in their own rows */
.ticket-custom-fields { display: flex; flex-direction: column; gap: 10px; }
.ticket-cf-flow { display: flex; flex-wrap: wrap; gap: 16px; }
.ticket-cf-item { flex: 1 1 200px; min-width: 180px; max-width: 340px; display: flex; flex-direction: column; }
.ticket-cf-switches { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; }
/* checkbox groups must read exactly like the standard ticket fields */
.ticket-cf-switches .form-check { font-size: 1rem; }
.ticket-cf-switches .form-check-label { font-size: 1rem; color: #212529; }
.ticket-cf-switches .form-switch .form-check-input { width: 2.4em; height: 1.25em; margin-top: .1em; }
.ticket-cf-buttons { display: flex; flex-wrap: wrap; gap: 8px; }
.combo-select { position: relative; }
.combo-select-toggle { position: relative; z-index: 1081; display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; padding: 4px 8px 4px 4px; border: 1px solid #dfe3eb; border-radius: 6px; background: #fff; }
.combo-select-toggle:hover { border-color: #8bb6ff; }
.combo-chevron { color: #97a4b8; font-size: .8rem; }
.combo-backdrop { position: fixed; inset: 0; z-index: 1070; }
.combo-select-menu { position: absolute; top: calc(100% + 4px); left: 0; z-index: 1090; background: #fff; border: 1px solid #dfe3eb; border-radius: 8px; box-shadow: 0 10px 28px rgba(23,43,77,.22); padding: 8px; }
.combo-menu-icons { display: grid; grid-template-columns: repeat(8, 38px); gap: 6px; max-height: 228px; overflow-y: auto; }
.combo-menu-icons .icon-option { flex: none; width: 38px; height: 38px; }
.combo-menu-colors { display: flex; gap: 8px; flex-wrap: wrap; max-width: 260px; }
.ticket-fields-sep { margin: 16px 0 12px; opacity: .6; }
.icon-preview, .highlight-preview { flex: 0 0 38px; width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid #dfe3eb; background: #fff; }
.icon-preview { border-radius: 6px; color: #52627a; font-size: 1.15rem; }
.highlight-preview { border-radius: 50%; color: #97a4b8; }
.ticket-editor-actions-top { margin-top: 0; margin-bottom: 14px; }

/* Uniform ticket card heights across lanes */
.ticket-card h3 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; min-height: 2.7em; }
.ticket-card p { min-height: 2.8em; }
.ticket-key { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; flex-shrink: 1; }
.ticket-card-flags { flex-shrink: 0; }

/* Uniform card width in rows layout (cards would otherwise size to content) */
.board-lanes.board-layout-rows .ticket-card { flex: 0 1 250px; width: 250px; max-width: 100%; min-width: 0; }

/* Flags flush right, symmetric with the ticket icon's left indentation; hover toggle moves to bottom-right */
.ticket-card { padding-right: 12px; min-width: 0; }
.ticket-card .ticket-compact-toggle { top: auto; bottom: 6px; right: 6px; }
.ticket-card-bottom { padding-right: 26px; }
.board-lanes.board-layout-compact .ticket-card { padding-right: 10px; }

/* Compact cards: keep the title on one line; the -webkit-box display from the
   uniform-height rule must not apply here or the min-content width blows up. */
.ticket-card.is-compact h3 { display: block; min-height: 0; margin: 0; font-size: .8rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Compact-card hover tooltip: full text next to the cursor after 2 s */
.compact-tip { position: fixed; z-index: 1300; display: flex; flex-direction: column; width: 360px; max-width: calc(100vw - 16px); max-height: min(440px, calc(100vh - 16px)); background: #fff; color: #172b4d; border: 1px solid #dfe3eb; border-radius: 10px; box-shadow: 0 14px 36px rgba(23,43,77,.18), 0 2px 6px rgba(23,43,77,.08); overflow: hidden; pointer-events: auto; font-size: .83rem; line-height: 1.5; text-align: left; }
.compact-tip-head { display: flex; align-items: center; padding: 10px 14px 0; }
.compact-tip-key { color: #1769e0; font-size: .72rem; font-weight: 700; }
.compact-tip-key i { margin-right: 5px; }
.compact-tip-title { padding: 4px 14px 10px; font-weight: 700; border-bottom: 1px solid #edf0f5; }
.compact-tip-desc { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 10px 14px; color: #52627a; word-break: break-word; overscroll-behavior: contain; }
.compact-tip-desc > :last-child { margin-bottom: 0; }
.compact-tip-desc img { max-width: 100%; height: auto; border-radius: 6px; }
.compact-tip-hint { flex: 0 0 auto; display: flex; align-items: center; gap: 6px; padding: 6px 14px; border-top: 1px solid #edf0f5; background: #f8faff; color: #97a4b8; font-size: .68rem; }

.ticket-drop-separator { height: 4px; margin: -2px 0; border-radius: 2px; background: #4c8dff; box-shadow: 0 0 0 1px rgba(76,141,255,.35); pointer-events: none; }

.permissions-dialog-wide { width: min(980px, 100%); }
.links-dialog { width: min(1400px, 100%); height: min(880px, calc(100vh - 40px)); display: flex; flex-direction: column; overflow: hidden; }
.links-dialog .links-scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; }
.links-secret-dropdown { position: absolute; right: 0; top: calc(100% + 4px); z-index: 20; width: 400px; max-width: 90vw; background: #fff; border: 1px solid #dfe3eb; border-radius: 8px; box-shadow: 0 8px 24px rgba(23,43,77,.18); padding: 10px; }
.links-status-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.links-drop-active { outline: 2px dashed #1769e0; outline-offset: -2px; background: #eef4ff; }
.links-agent-chip { font-size: .8rem; padding: .35em .6em; }
.links-row-bad { background: #fff5f5; border-color: #f1aeb5; }
.links-row-warn { background: #fffaf0; border-color: #f0d493; }
.links-chip { display: inline-flex; align-items: center; border-radius: 999px; padding: 3px 10px; font-size: .74rem; font-weight: 600; }
.links-chip-ok { background: #e7f8f0; color: #168356; border: 1px solid #b9e6cf; }
.links-chip-warn { background: #fff3df; color: #9b6500; border: 1px solid #f0d493; }
.links-chip-bad { background: #ffebe7; color: #c9372c; border: 1px solid #f1aeb5; }
.links-log-panel { max-height: 260px; overflow-y: auto; background: #f8f9fa; border: 1px solid #e9ecef; border-radius: 6px; padding: 8px 10px; font-family: SFMono-Regular, Menlo, Consolas, monospace; font-size: .78rem; white-space: pre-wrap; word-break: break-word; overflow-wrap: anywhere; }
.links-code { min-height: 320px; }
.links-code-editor { border: 1px solid #dfe3eb; border-radius: 6px; overflow: hidden; }
.links-code-editor .CodeMirror { height: 480px; font-size: .84rem; font-family: Consolas, "Courier New", Menlo, Monaco, monospace; }
.ticket-card-top { justify-content: flex-start; }
.ticket-card-top .ticket-card-flags { margin-left: auto; }
.ticket-card-actions { display: flex; flex-direction: column; gap: 4px; margin-top: 6px; }
.ticket-card-buttons { display: flex; flex-wrap: wrap; gap: 4px; }
.ticket-card-action { border: 1px solid #8bb6ff; color: #1769e0; background: #fff; border-radius: 4px; padding: 1px 7px; font-size: .68rem; font-weight: 600; line-height: 1.5; }
.ticket-card-action:hover { background: #eef4ff; }
.ticket-card-action.running { opacity: .55; }
.ticket-estimate-inline { margin-left: 4px; flex-shrink: 0; }
.ticket-assignee-inline { margin-left: 4px; width: auto; min-width: 26px; height: 19px; padding: 0 5px; font-size: .58rem; border-radius: 4px; flex-shrink: 0; letter-spacing: .02em; }
.markup-image { max-width: 100%; height: auto; border: 1px solid #dfe3eb; border-radius: 6px; margin: 4px 0; display: block; }
.ticket-description-rendered .markup-image, .ticket-comment-body .markup-image { max-width: 420px; }
.links-snippet-table th { font-size: .72rem; text-transform: uppercase; letter-spacing: .03em; color: #6b778c; user-select: none; white-space: nowrap; }
.links-snippet-table td { vertical-align: middle; font-size: .82rem; }
.group-editor-row { display: flex; align-items: center; gap: 8px; padding: 8px; border: 1px solid #e3e7ef; border-radius: 7px; background: #fff; }
.group-editor-row .group-color-input { width: 110px; }
.board-group-desc { color: #6b778c; font-size: .78rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 340px; flex: 0 1 auto; min-width: 48px; cursor: help; }
.group-desc-tip { width: 320px; max-height: min(280px, calc(100vh - 16px)); }
.group-desc-tip .compact-tip-desc { white-space: pre-wrap; }
.board-delete-button:hover { color: #c92a2a; border-color: #f3c2c2; }

.settings-section { padding: 18px 20px; margin-bottom: 16px; border: 1px solid #e6eaf1; border-radius: 10px; background: #fbfcfe; }
.settings-section > header { display: flex; gap: 12px; align-items: center; margin-bottom: 14px; }
.settings-section > header > i { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 8px; background: #e8f1ff; color: #1769e0; font-size: 1rem; }
.settings-section > header h3 { margin: 0; font-size: .95rem; font-weight: 650; color: #172b4d; }
.settings-section > header p { margin: 0; font-size: .74rem; color: #6b778c; }

/* Per-group max ticket height (columns layout): the group block carries
   --ticket-max-height and --ticket-desc-lines; cards clip at that height.
   A card with a user-resized image (custom_height) is the explicit
   exception — it must never clip, or the resize handle and the compact
   toggle at the card bottom become unreachable. */
.board-lane-group .ticket-card { max-height: var(--ticket-max-height, none); overflow: hidden; }
.board-lane-group .ticket-card.has-custom-height { max-height: none; }
.board-lane-group.ticket-height-min .ticket-card.has-custom-height .ticket-card-image { display: flex; }
.board-lane-group .ticket-card p { -webkit-line-clamp: var(--ticket-desc-lines, 2); min-height: 0; }
.board-lane-group .ticket-card h3 { min-height: 0; }
.board-lane-group.ticket-height-min .ticket-card p { display: none; }

/* Image-only descriptions: the thumbnail fills the same height the text
   block would use (slider-controlled description lines); compacted cards
   show a small fixed thumbnail. */
.ticket-card-image { position: relative; height: calc(var(--ticket-desc-lines, 2) * 17px); margin: 2px 0 10px; display: flex; align-items: center; justify-content: center; overflow: hidden; border-radius: 6px; background: #f4f5f7; }
.ticket-card-image img { width: 100%; height: 100%; object-fit: contain; }
.ticket-height-handle { position: absolute; right: 30px; bottom: 4px; width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center; font-size: 11px; color: #5a6b85; background: rgba(255,255,255,.92); border: 1px solid #cfd6e4; border-radius: 4px; cursor: ns-resize; opacity: 0; transition: opacity .15s ease; z-index: 2; }
.ticket-card:hover .ticket-height-handle { opacity: 1; }
.ticket-height-handle:hover { background: #fff; border-color: #8fa3c2; }
.ticket-card.is-compact .ticket-card-image { height: 44px !important; margin-bottom: 6px; }
.board-lane-group.ticket-height-min .ticket-card-image { display: none; }
.board-lanes.board-layout-compact .ticket-card-image { height: 44px !important; margin-bottom: 6px; }
/* Images inside mixed text+image descriptions scale with the same
   slider-controlled height so the card never clips a full-size photo. */
.ticket-card p img { max-width: 100%; max-height: calc(var(--ticket-desc-lines, 2) * 17px); width: auto; height: auto; border-radius: 6px; }
.board-lane-group.ticket-height-min .ticket-card p img { display: none; }
.ticket-card.is-compact p img, .board-lanes.board-layout-compact .ticket-card p img { max-height: 44px; }
.ticket-description-rendered img, .ticket-description-editor img { max-width: 100%; border-radius: 6px; }

/* Tiles layout: free-form grid canvas (50 px cells), tickets as absolutely
   positioned tiles that can be dragged and resized along the grid. */
.board-tiles { position: relative; z-index: 0; grid-column: 1 / -1; min-height: 520px; border: 1px solid #e0e5ed; border-radius: 8px; background-color: #fff; background-image: linear-gradient(to right, #edf0f6 1px, transparent 1px), linear-gradient(to bottom, #edf0f6 1px, transparent 1px); background-size: 25px 25px; }
.board-tile { position: absolute; display: flex; flex-direction: column; margin: 0; padding: 10px 12px; overflow: hidden; cursor: grab; user-select: none; }
.board-tile:active { cursor: grabbing; }
.board-tile.tile-dragging { z-index: 6; opacity: .96; box-shadow: 0 12px 28px rgba(23,43,77,.2); }
.board-tile h3 { flex: 0 0 auto; }
.board-tile .ticket-card-top { flex: 0 0 auto; }
.board-tile .ticket-card-bottom { flex: 0 0 auto; margin-top: auto; }
.board-tile-image { flex: 1 1 auto; min-height: 0; height: auto; margin: 2px 0 6px; }
.board-tile-desc { flex: 1 1 auto; min-height: 0; display: block; -webkit-line-clamp: unset; overflow: hidden; overflow-y: auto; }
.board-tile .ticket-card-actions { flex: 0 0 auto; }
.tile-resize-handle { position: absolute; right: 2px; bottom: 2px; width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center; font-size: 11px; color: #5a6b85; background: rgba(255,255,255,.92); border: 1px solid #cfd6e4; border-radius: 4px; cursor: nwse-resize; opacity: 0; transition: opacity .15s ease; z-index: 2; }
.board-tile:hover .tile-resize-handle { opacity: 1; }
.tile-resize-handle:hover { background: #fff; border-color: #8fa3c2; }
.board-tiles-empty { position: absolute; inset: 10px; }
.board-tile-layouts { display: inline-flex; gap: 4px; }
.board-tile-layouts .btn { display: inline-flex; align-items: center; justify-content: center; }
.tile-shape { display: inline-block; border: 1.5px solid currentColor; border-radius: 2px; }
.tile-shape-portrait { width: 10px; height: 14px; }
.tile-shape-square { width: 12px; height: 12px; }
.tile-shape-landscape { width: 14px; height: 10px; }

/* Board permission view (lock icon): left all-groups table, right assigned */
.board-access-dialog { width: min(860px, 100%); }
.board-perm-table { border: 1px solid #e3e7ef; border-radius: 8px; overflow: hidden; }
.board-perm-table tr { cursor: grab; }
.board-perm-table td { padding: 6px 10px; }
.board-perm-assigned { min-height: 120px; border: 1px dashed #c6cfdd; border-radius: 8px; padding: 6px; display: flex; flex-direction: column; gap: 4px; }
.board-perm-row { display: flex; align-items: center; gap: 8px; padding: 4px 8px; border: 1px solid #e3e7ef; border-radius: 6px; background: #fff; }
.board-perm-name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.board-perm-role { width: 110px; flex: 0 0 auto; }
.board-readonly-banner { align-self: center; }
.menu-row-hidden { opacity: .55; }
/* buttons a reader/writer may not press stay visible but clearly unusable */
.ticket-trigger-button:disabled, .ticket-card-action:disabled { opacity: .5; cursor: not-allowed; filter: grayscale(.5); }
/* pages "allowed groups" chips + floating group picker (positioned inside the cell so it never blocks the table) */
.page-groups-cell { position: relative; min-width: 260px; }
.page-groups-chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.page-group-chip { display: inline-flex; align-items: center; gap: 4px; padding: 2px 4px 2px 8px; border: 1px solid #dfe3eb; border-radius: 12px; background: #f4f7ff; font-size: .8rem; }
.page-group-chip-x { border: 0; background: transparent; color: #97a4b8; padding: 0 4px; font-size: .7rem; }
.page-group-chip-x:hover { color: #c9372c; }
.page-groups-add { padding: 0 8px; line-height: 1.4; }
.page-group-panel { position: absolute; right: 0; top: calc(100% + 4px); z-index: 20; width: 300px; padding: 8px; border: 1px solid #dfe3eb; border-radius: 8px; background: #fff; box-shadow: 0 10px 30px rgba(23,43,77,.16); }
.page-group-panel-list { max-height: 220px; overflow-y: auto; }
.page-group-panel-row { display: flex; align-items: center; padding: 4px 6px; border-radius: 5px; cursor: grab; font-size: .85rem; }
.page-group-panel-row:hover { background: #f0f4ff; }
/* users group picker: fixed panel opening next to the "+", draggable header */
.user-groups-cell { position: relative; min-width: 220px; }
.user-group-panel { position: fixed; z-index: 1300; width: 300px; padding: 8px; border: 1px solid #dfe3eb; border-radius: 8px; background: #fff; box-shadow: 0 12px 34px rgba(23,43,77,.2); }
.user-group-panel .picker-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 2px 2px 8px; margin-bottom: 6px; border-bottom: 1px solid #eef1f6; cursor: grab; user-select: none; }
.user-group-panel .picker-head:active { cursor: grabbing; }
/* admin menu editor: icon dropdown with preview, aliases column, deactivated switch */
.menu-icon-menu { width: 260px; max-height: 280px; overflow-y: auto; padding: 6px; display: flex; flex-direction: column; gap: 2px; }
.menu-icon-option { display: flex; align-items: center; gap: 10px; padding: 5px 8px; border: 0; border-radius: 5px; background: transparent; font-size: .82rem; color: #172b4d; text-align: left; }
.menu-icon-option:hover { background: #f0f4ff; }
.menu-icon-option.active { background: #deebff; color: #1558b0; font-weight: 600; }
.menu-icon-option i { font-size: 1rem; width: 20px; text-align: center; }
.menu-icon-name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .82rem; }
.menu-aliases { flex: 1 1 220px; min-width: 180px; }
.menu-deactivated { margin-left: 4px; white-space: nowrap; }

.board-height-control { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; padding-left: 10px; color: #97a4b8; }
.board-height-control:hover { color: #1769e0; }
.board-height-slider { width: 120px; height: 14px; cursor: pointer; accent-color: #1769e0; }

.board-changes-badge { display: inline-flex; align-items: center; gap: 4px; border: 0; border-radius: 999px; padding: 2px 9px; background: #fff3df; color: #9b6500; font-size: .72rem; font-weight: 700; }
.board-changes-badge:hover { background: #ffe6b8; color: #7a4f00; }

.board-changes-backdrop { position: fixed; inset: 0; z-index: 1250; }
.board-changes-popover { position: fixed; z-index: 1251; width: 360px; max-width: calc(100vw - 16px); max-height: 280px; overflow-y: auto; background: #fff; border: 1px solid #dfe3eb; border-radius: 10px; box-shadow: 0 14px 36px rgba(23,43,77,.18); font-size: .82rem; padding: 10px 14px; text-align: left; }
.board-changes-popover-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.board-changes-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.board-changes-list li { display: flex; align-items: baseline; gap: 8px; }
.board-changes-icon { flex-shrink: 0; }
.board-changes-main { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.board-changes-detail { flex-shrink: 0; color: #6b778c; font-size: .72rem; }

/* --- feedback requests (automation module "request_feedback") --- */
.ticket-card-feedback { display: flex; align-items: center; gap: 4px; padding-top: 4px; margin-top: 2px; border-top: 1px dashed rgba(23,43,77,.14); }
.ticket-feedback-dot { display: inline-grid; place-items: center; width: 18px; height: 18px; padding: 0; border: none; border-radius: 50%; background: #ff5630; color: #fff; font-size: .72rem; font-weight: 700; line-height: 1; cursor: pointer; box-shadow: 0 1px 2px rgba(23,43,77,.25); }
.ticket-feedback-dot:hover { background: #e14e2d; transform: scale(1.1); }
.ticket-feedback-more { font-size: .68rem; font-weight: 700; color: #ff5630; }
/* the strip must never be clipped by the per-group max-height slider;
   it may extend the card height by at most ~15px */
.board-lane-group .ticket-card { max-height: calc(var(--ticket-max-height, 100000px) + 15px); }

/* ticket editor: pending feedback banner */
.ticket-feedback-banner { display: flex; flex-direction: column; gap: 6px; margin: 0 0 12px; padding: 10px 12px; border: 1px solid #ffe3a6; border-radius: 8px; background: #fff8e6; }
.ticket-feedback-request { display: flex; align-items: center; gap: 10px; min-width: 0; }
.ticket-feedback-question { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* feedback answer dialog */
.ticket-feedback-options { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 14px; }

.links-terminal { position: fixed; z-index: 4000; width: 640px; height: 440px; background: #101418; border: 1px solid #2b333d; border-radius: 8px; box-shadow: 0 12px 40px rgba(0,0,0,.5); display: flex; flex-direction: column; }
.links-terminal-max { left: 2vw !important; top: 2vh !important; width: 96vw; height: 92vh; }
.links-terminal-min { width: 320px; }
.links-terminal-head { display: flex; align-items: center; gap: 4px; padding: 6px 10px; background: #1b222b; color: #dfe6ee; border-bottom: 1px solid #2b333d; border-radius: 8px 8px 0 0; cursor: move; user-select: none; }
.links-terminal-body { display: flex; flex-direction: column; flex: 1; min-height: 0; overflow: hidden; }
.links-terminal-max .links-terminal-body { flex: 1; min-height: 0; }
.links-terminal-out { flex: 1; margin: 0; padding: 10px; overflow: auto; background: #101418; color: #b7f0c0; font-family: monospace; font-size: .8rem; white-space: pre-wrap; word-break: break-all; }
.links-terminal-input { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-top: 1px solid #2b333d; background: #1b222b; border-radius: 0 0 8px 8px; }
.links-terminal { resize: both; overflow: hidden; min-width: 380px; min-height: 220px; }
.links-terminal-max { resize: none; }
.links-terminal-xterm { width: 100%; height: 100%; min-height: 120px; overflow: hidden; padding: 0; }

/* lane resize handle (columns layout, board admins): thin strip on the lane's
   right edge, fades in on lane hover, live-width via laneGridStyle() */
.board-lane { position: relative; }
.lane-resize-handle { position: absolute; right: -3px; top: 0; bottom: 0; width: 7px; cursor: col-resize; z-index: 6; opacity: 0; transition: opacity .15s ease; border-radius: 0 8px 8px 0; }
.board-lane:hover .lane-resize-handle { opacity: 1; }
.lane-resize-handle:hover { background: rgba(23,105,224,.25); }

/* --- Apps page (remote app streaming) -------------------------------------- */
.apps-page { max-width: 1400px; margin: 0 auto; padding: 22px clamp(16px, 3vw, 42px) 48px; }
.apps-toolbar { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; flex-wrap: wrap; }
.apps-toolbar h1 { font-size: 1.25rem; margin: 0; color: #172b4d; }
.apps-subtitle { margin: 2px 0 0; color: #6b778c; font-size: .85rem; }
.apps-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.apps-tile { border: 1px solid #e0e5ed; border-radius: 10px; background: #fff; padding: 14px 16px; display: flex; flex-direction: column; gap: 8px; }
.apps-tile-head { display: flex; align-items: center; gap: 8px; }
.apps-tile-head strong { color: #172b4d; font-size: .95rem; }
.apps-tile-meta { font-size: .82rem; color: #52627a; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.apps-tile-path { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: SFMono-Regular, Menlo, Consolas, monospace; font-size: .74rem; }
.apps-tile-actions { display: flex; gap: 6px; margin-top: auto; }
.apps-state { text-transform: capitalize; }
.apps-state-running { background: #e7f8f0; color: #168356; }
.apps-state-starting { background: #fff3df; color: #9b6500; }
.apps-state-stopped { background: #eef1f6; color: #52627a; }
.apps-state-error { background: #ffebe7; color: #c9372c; }
.app-viewer { position: fixed; z-index: 4000; width: min(960px, 92vw); background: #101418; border: 1px solid #2b333d; border-radius: 8px; box-shadow: 0 12px 40px rgba(0,0,0,.5); display: flex; flex-direction: column; resize: both; overflow: hidden; min-width: 380px; min-height: 260px; }
.app-viewer-max { left: 2vw !important; top: 2vh !important; width: 96vw; height: 92vh; resize: none; }
.app-viewer-min { width: 320px; resize: none; }
.app-viewer-min .app-viewer-body { display: none; }
.app-viewer-head { display: flex; align-items: center; gap: 8px; padding: 6px 10px; background: #1b222b; color: #dfe6ee; border-bottom: 1px solid #2b333d; border-radius: 8px 8px 0 0; cursor: move; user-select: none; }
.app-viewer-head .apps-state { font-size: .66rem; }
.app-viewer-detail { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1 1 auto; min-width: 0; }
.app-viewer-winbtn { color: #97a4b8; line-height: 1; }
.app-viewer-winbtn:hover { color: #dfe6ee; }
.app-viewer-close { flex: 0 0 auto; filter: invert(1); }
.app-viewer-body { flex: 1; min-height: 0; display: flex; background: #000; }
.app-viewer-screen { flex: 1; min-height: 0; display: flex; align-items: center; justify-content: center; outline: none; overflow: hidden; }
.app-viewer-screen:focus { box-shadow: inset 0 0 0 2px rgba(76,141,255,.6); }
.app-viewer-img { width: 100%; height: 100%; object-fit: contain; user-select: none; }
.app-viewer-placeholder { color: #8b96a8; padding: 30px; text-align: center; }

.app-viewer-canvas { display: block; max-width: 100%; max-height: 100%; width: auto; height: auto; margin: auto; }  /* keep the stream aspect ratio - 100%/100% stretched and overflowed the overlay */

/* tile z-layer controls (tiles layout) */
.tile-z-controls { display: inline-flex; gap: 2px; margin-left: 4px; vertical-align: middle; }
.tile-z-btn { border: 0; background: rgba(23,43,77,.07); border-radius: 4px; padding: 0 4px; font-size: .68rem; line-height: 1.5; color: #52627a; cursor: pointer; }
.tile-z-btn:hover { background: #1769e0; color: #fff; }
/* navbar submenus: children = dropdown (caret down via BS), grandchildren drop RIGHT */
.dropdown-submenu { position: relative; }
.dropdown-submenu > .dropdown-menu.submenu { position: absolute; top: 0; left: 100%; margin-top: -1px; display: none; }
.dropdown-submenu:hover > .dropdown-menu.submenu,
.dropdown-submenu:focus-within > .dropdown-menu.submenu { display: block; }
.dropdown-submenu > .dropdown-item.dropdown-toggle::after { transform: rotate(-90deg); margin-left: .6em; }
/* admin menu tree editor */
.menu-tree-row { position: relative; }
.menu-tree-row .menu-dropstrip { position: absolute; top: -3px; left: 0; right: 0; height: 6px; cursor: copy; z-index: 2; }
.menu-tree-row .menu-dropstrip:hover { background: rgba(23,105,224,.35); }
.menu-tree-child { margin-left: 34px; }
.menu-tree-alias { max-width: 220px; }
.menu-tree-badge { white-space: nowrap; }
/* builder view element */
.bctl-view .bctl-view-content { transition: opacity .2s ease; min-height: 40px; }
/* admin menu tree editor: aligned columns */
.menu-tree-row { display: grid !important; grid-template-columns: 24px 30px minmax(240px, 1fr) minmax(150px, 220px) auto 36px; gap: 10px; align-items: center; padding: 6px 10px; border: 1px solid transparent; border-radius: 9px; margin-bottom: 2px; }
.menu-tree-row:hover { background: rgba(23,105,224,.06); border-color: rgba(23,105,224,.18); }
.menu-tree-row .menu-fields { display: flex; align-items: center; gap: 10px; }
.menu-tree-row .menu-fields .admin-muted { white-space: nowrap; }
.menu-tree-row .menu-tree-alias { max-width: none; width: 100%; }
.menu-tree-badge { justify-self: start; }
@media (max-width: 900px) { .menu-tree-row { grid-template-columns: 24px 30px 1fr 36px; } .menu-tree-row .menu-tree-alias { grid-column: 3; } .menu-tree-badge { display: none; } }
/* menu editor: top-level drop zone */
.menu-toplevel-zone { border: 1px dashed rgba(23,105,224,.45); border-radius: 9px; padding: 7px 12px; margin-bottom: 8px; color: #1769e0; font-size: .82rem; cursor: copy; background: rgba(23,105,224,.05); }
.menu-toplevel-zone:hover { background: rgba(23,105,224,.12); }
/* menu entries without a route: inert (no hover-cursor change semantics) */
.menu-inert { cursor: default; opacity: .92; }

/* Collapsed navbar (hamburger) layout: up to 3 items per row,
   with level-2 dropdowns as full-width centered overlays below the parent. */
@media (max-width: 991.98px) {
  #navbarNav.navbar-collapse.show {
    padding: 0.5rem;
    background: #212529;
    border-radius: 0 0 0.5rem 0.5rem;
  }
  #navbarNav.navbar-collapse.show .navbar-nav {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.5rem;
    position: relative;
    width: 100%;
  }
  #navbarNav.navbar-collapse.show .nav-item {
    width: 100%;
    text-align: center;
  }
  #navbarNav.navbar-collapse.show .nav-item.dropdown {
    display: contents;
  }
  #navbarNav.navbar-collapse.show .nav-link,
  #navbarNav.navbar-collapse.show .dropdown-item,
  #navbarNav.navbar-collapse.show .menu-inert {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 0.5rem;
    border-radius: 0.375rem;
    color: rgba(255,255,255,0.85) !important;
    background: transparent;
  }
  #navbarNav.navbar-collapse.show .nav-link:hover,
  #navbarNav.navbar-collapse.show .dropdown-item:hover,
  #navbarNav.navbar-collapse.show .menu-inert:hover {
    background: rgba(255,255,255,0.1);
    color: #fff !important;
  }
  #navbarNav.navbar-collapse.show .nav-link.active,
  #navbarNav.navbar-collapse.show .dropdown-item.active {
    background: rgba(255,255,255,0.15);
    color: #fff !important;
  }
  /* Full-width dropdown overlay below the parent row, centered to menu width */
  #navbarNav.navbar-collapse.show .dropdown-menu {
    position: absolute;
    grid-column: 1 / -1;
    top: auto;
    left: 0;
    right: 0;
    width: 100%;
    margin: 0;
    padding: 0.5rem;
    text-align: center;
    background: #2b3035;
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 0 0 0.375rem 0.375rem;
    box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.3);
    z-index: 1030;
  }
  #navbarNav.navbar-collapse.show .dropdown-menu .dropdown-item {
    display: block;
    padding: 0.5rem;
    color: rgba(255,255,255,0.85);
  }
  /* Nested submenus in collapsed mode also stack full-width below parent */
  #navbarNav.navbar-collapse.show .dropdown-submenu {
    position: static;
  }
  #navbarNav.navbar-collapse.show .dropdown-submenu > .dropdown-menu.submenu {
    position: static;
    display: none;
    width: 100%;
    margin: 0.25rem 0 0 0;
    padding: 0.25rem 0;
    background: #373d44;
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 0.25rem;
  }
  #navbarNav.navbar-collapse.show .dropdown-submenu.show > .dropdown-menu.submenu,
  #navbarNav.navbar-collapse.show .dropdown-submenu:hover > .dropdown-menu.submenu,
  #navbarNav.navbar-collapse.show .dropdown-submenu:focus-within > .dropdown-menu.submenu {
    display: block;
  }
  #navbarNav.navbar-collapse.show .dropdown-submenu > .dropdown-item.dropdown-toggle::after {
    transform: none;
    margin-left: 0.6em;
  }
  .navbar-toggler { margin-left: auto; }
}