html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

a, .btn-link {
    color: #006bb7;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
    margin-bottom: 1.5rem;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.content {
    padding-top: 1.5rem;
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}

.statistics-page {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.statistics-toolbar__header,
.statistics-toolbar__footer,
.statistics-section-header,
.statistics-meta {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 1rem;
}

.statistics-toolbar__header h2,
.statistics-section-header h2 {
    margin-bottom: 0.25rem;
}

.statistics-toolbar__header p,
.statistics-section-header p {
    margin-bottom: 0;
    color: #64748b;
}

.statistics-toolbar__actions,
.statistics-toolbar__footer-actions {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.statistics-filter-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1rem;
    margin-top: 1.5rem;
}

.statistics-filter-grid__checks {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.75rem;
}

.statistics-import {
    min-width: 260px;
}

.statistics-meta__item {
    min-width: 180px;
    padding: 0.75rem 1rem;
    background: #f8fafc;
    border-radius: 0.75rem;
    border: 1px solid #e2e8f0;
}

.statistics-meta__label {
    display: block;
    font-size: 0.8rem;
    color: #64748b;
    margin-bottom: 0.25rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.statistics-kpis {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: stretch;
}

.statistics-kpi-card {
    background: linear-gradient(135deg, #eff6ff, #ffffff);
    border: 1px solid #dbeafe;
    border-radius: 1rem;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    flex: 1 1 160px;
    min-width: 160px;
    max-width: 100%;
}

.statistics-kpi-card span {
    color: #475569;
    font-size: 0.9rem;
}

.statistics-kpi-card strong {
    font-size: 1.6rem;
    color: #0f172a;
    white-space: nowrap;
}

.statistics-kpi-card--amount {
    flex-basis: max-content;
}

.statistics-kpi-card--warning {
    background: linear-gradient(135deg, #fff7ed, #ffffff);
    border-color: #fdba74;
}

.statistics-charts,
.statistics-tables {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 1rem;
}

.statistics-chart-surface {
    min-height: 280px;
}

.statistics-chart-title {
    font-size: 0.9rem;
    color: #64748b;
    margin-bottom: 1rem;
}

.statistics-chart-empty {
    min-height: 240px;
    display: grid;
    place-items: center;
    color: #94a3b8;
    border: 1px dashed #cbd5e1;
    border-radius: 0.75rem;
}

.statistics-bar-chart {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.statistics-bar-chart__row {
    display: grid;
    grid-template-columns: minmax(90px, 1.2fr) 3fr auto;
    gap: 0.75rem;
    align-items: center;
}

.statistics-bar-chart__label,
.statistics-bar-chart__value {
    font-size: 0.9rem;
    color: #334155;
}

.statistics-bar-chart__track {
    height: 16px;
    background: #e2e8f0;
    border-radius: 999px;
    overflow: hidden;
}

.statistics-bar-chart__bar {
    height: 100%;
    border-radius: 999px;
}

.statistics-pie-chart {
    display: grid;
    grid-template-columns: minmax(180px, 220px) 1fr;
    gap: 1rem;
    align-items: center;
}

.statistics-pie-chart__ring {
    position: relative;
    width: 200px;
    aspect-ratio: 1;
    border-radius: 50%;
    justify-self: center;
}

.statistics-pie-chart__center {
    position: absolute;
    inset: 25%;
    border-radius: 50%;
    background: white;
    display: grid;
    place-items: center;
    text-align: center;
    color: #0f172a;
}

.statistics-pie-chart__center span {
    color: #64748b;
    font-size: 0.85rem;
}

.statistics-pie-chart__legend {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.statistics-pie-chart__legend-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #334155;
}

.statistics-pie-chart__swatch {
    width: 0.85rem;
    height: 0.85rem;
    border-radius: 999px;
    flex-shrink: 0;
}

.statistics-name-cell {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.statistics-project-progress {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.statistics-project-progress__labels {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    font-size: 0.8rem;
    color: #64748b;
}

.statistics-project-progress__track {
    height: 0.5rem;
    border-radius: 999px;
    background: #e2e8f0;
    overflow: hidden;
}

.statistics-project-progress__bar {
    height: 100%;
    border-radius: 999px;
}

.statistics-project-progress__bar--healthy {
    background: linear-gradient(90deg, #22c55e, #16a34a);
}

.statistics-project-progress__bar--warning {
    background: linear-gradient(90deg, #f59e0b, #d97706);
}

.statistics-project-progress__bar--critical {
    background: linear-gradient(90deg, #f97316, #ea580c);
}

.statistics-detail-table {
    max-height: 480px;
}

.statistics-detail-grid th {
    white-space: nowrap;
    position: sticky;
    top: 0;
    background: #f8fafc;
    z-index: 1;
}

.statistics-detail-cell {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
}

.statistics-detail-cell strong {
    color: #0f172a;
    font-weight: 600;
}

.statistics-detail-cell span {
    color: #64748b;
    font-size: 0.78rem;
    line-height: 1.3;
}

.statistics-detail-cell--primary {
    gap: 0.35rem;
}

.statistics-detail-cell--primary .badge,
.statistics-detail-cell--numeric {
    align-self: flex-start;
}

.statistics-detail-cell--numeric {
    align-items: flex-end;
}

.statistics-detail-text--danger {
    color: #b91c1c !important;
}

.statistics-detail-text--success {
    color: #15803d !important;
}

.statistics-detail-text--muted {
    color: #64748b !important;
}

.docs-page-title {
    margin: 0;
}

.docs-page-title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1.5rem;
}

.docs-page {
    display: grid;
    grid-template-columns: minmax(250px, 320px) minmax(0, 1fr);
    gap: 1.5rem;
    align-items: start;
}

.docs-sidebar,
.docs-outline {
    position: sticky;
    top: 1.5rem;
}

.docs-sidebar .card-body,
.docs-hero .card-body,
.docs-article .card-body,
.docs-outline .card-body {
    padding: 1.5rem;
}

.docs-sidebar__intro {
    margin-bottom: 1.5rem;
}

.docs-kicker {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #2563eb;
    margin-bottom: 0.75rem;
}

.docs-sidebar__intro p,
.docs-hero p {
    color: #64748b;
    margin-bottom: 0;
}

.docs-nav,
.docs-outline__nav {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.docs-nav__link,
.docs-outline__link {
    text-decoration: none;
}

.docs-nav__link {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0.9rem 1rem;
    border-radius: 0.9rem;
    border: 1px solid transparent;
    color: #0f172a;
    background: #f8fafc;
    transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.docs-nav__link:hover {
    background: #eff6ff;
    border-color: #bfdbfe;
    transform: translateY(-1px);
}

.docs-nav__link--active {
    background: linear-gradient(135deg, #dbeafe, #eff6ff);
    border-color: #93c5fd;
    box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.08);
}

.docs-nav__link small {
    color: #64748b;
    line-height: 1.4;
}

.docs-content {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    min-width: 0;
}

.docs-hero {
    background: linear-gradient(135deg, #eff6ff, #ffffff 60%);
}

.docs-hero h2,
.docs-outline h2 {
    margin-bottom: 0.75rem;
}

.docs-meta {
    margin-top: 1rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    color: #475569;
}

.docs-meta code {
    padding: 0.2rem 0.45rem;
    background: rgba(15, 23, 42, 0.06);
    border-radius: 0.45rem;
}

.docs-content-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 260px);
    gap: 1.5rem;
    align-items: start;
}

.docs-markdown {
    color: #1e293b;
    line-height: 1.7;
}

.docs-markdown > :first-child {
    margin-top: 0;
}

.docs-markdown h1,
.docs-markdown h2,
.docs-markdown h3,
.docs-markdown h4,
.docs-markdown h5,
.docs-markdown h6 {
    color: #0f172a;
    margin-top: 2rem;
    margin-bottom: 0.85rem;
    scroll-margin-top: 1.5rem;
}

.docs-markdown p,
.docs-markdown ul,
.docs-markdown ol,
.docs-markdown blockquote,
.docs-table-wrapper {
    margin-bottom: 1rem;
}

.docs-list {
    padding-left: 1.5rem;
}

.docs-markdown code {
    padding: 0.15rem 0.4rem;
    background: #eff6ff;
    border-radius: 0.35rem;
    color: #1d4ed8;
}

/* Ticket archive, performance review, and detail workspace */
.tickets-summary__item--success {
    border-color: #a7f3d0;
    background: linear-gradient(135deg, #ecfdf5, #f0fdfa);
}

.ticket-performance {
    display: grid;
    grid-template-columns: minmax(220px, 1.4fr) repeat(4, minmax(130px, 1fr));
    gap: 1rem;
    padding: 1.2rem;
    color: #e2e8f0;
    background: linear-gradient(120deg, #0f172a, #172554 58%, #312e81);
    border-radius: 14px;
    box-shadow: 0 16px 34px rgba(15, 23, 42, 0.16);
}

.ticket-performance__intro h2,
.ticket-performance__intro p { margin: 0; }
.ticket-performance__intro h2 { color: #fff; font-size: 1.3rem; margin-top: 0.2rem; }
.ticket-performance__intro p { color: #cbd5e1; font-size: 0.85rem; margin-top: 0.4rem; }
.ticket-performance__eyebrow { color: #a5b4fc; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; }
.ticket-performance__metric { display: flex; flex-direction: column; justify-content: center; gap: 0.3rem; padding-left: 1rem; border-left: 1px solid rgba(203, 213, 225, 0.24); }
.ticket-performance__metric span { color: #cbd5e1; font-size: 0.78rem; }
.ticket-performance__metric strong { color: #fff; font-size: 1.15rem; }

.tickets-time-cell { display: flex; flex-direction: column; gap: 0.15rem; }
.tickets-time-cell span { color: #64748b; font-size: 0.74rem; }

.ticket-detail-panel {
    padding: 1.4rem;
    border-radius: 14px;
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.09);
}

.ticket-detail-overview {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem;
    margin-top: 1.1rem;
}

.ticket-detail-overview__item {
    display: flex;
    flex-direction: column;
    gap: 0.22rem;
    min-width: 0;
    padding: 0.85rem;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #f8fafc;
}

.ticket-detail-overview__item span,
.ticket-detail-overview__item small { color: #64748b; overflow: hidden; text-overflow: ellipsis; }
.ticket-detail-overview__item span { font-size: 0.72rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.06em; }
.ticket-detail-overview__item strong { color: #0f172a; }
.ticket-detail-overview__item--accent { border-color: #c7d2fe; background: linear-gradient(135deg, #eef2ff, #eff6ff); }

.ticket-lifecycle {
    display: grid;
    grid-template-columns: auto minmax(40px, 1fr) auto minmax(40px, 1fr) auto;
    align-items: center;
    gap: 0.65rem;
    margin-top: 1rem;
    padding: 0.9rem 1rem;
    border-radius: 10px;
    background: #f8fafc;
}

.ticket-lifecycle__step { display: flex; align-items: center; gap: 0.5rem; color: #94a3b8; }
.ticket-lifecycle__step > div { display: flex; flex-direction: column; }
.ticket-lifecycle__step small { font-size: 0.72rem; }
.ticket-lifecycle__dot { width: 0.7rem; height: 0.7rem; border: 2px solid #cbd5e1; border-radius: 50%; background: #fff; }
.ticket-lifecycle__line { height: 2px; background: #e2e8f0; }
.ticket-lifecycle__step--complete { color: #0f172a; }
.ticket-lifecycle__step--complete .ticket-lifecycle__dot,
.ticket-lifecycle__line--complete { border-color: #4f46e5; background: #4f46e5; }

.ticket-content-card { padding: 1rem; border: 1px solid #e2e8f0; border-radius: 10px; background: #fff; }
.ticket-content-card--primary { border-left: 4px solid #4f46e5; background: #fafaff; }
.ticket-content-card--resolution { border-color: #a7f3d0; background: #ecfdf5; }

@media (max-width: 980px) {
    .ticket-performance { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ticket-performance__intro { grid-column: 1 / -1; }
    .ticket-detail-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
    .ticket-performance,
    .ticket-detail-overview { grid-template-columns: 1fr; }
    .ticket-performance__metric { border-left: 0; border-top: 1px solid rgba(203, 213, 225, 0.24); padding: 0.7rem 0 0; }
    .ticket-lifecycle { grid-template-columns: 1fr; }
    .ticket-lifecycle__line { width: 2px; height: 22px; margin-left: 0.35rem; }
}

.docs-code-block {
    max-width: 100%;
    margin: 0 0 1rem;
    padding: 1rem;
    overflow-x: auto;
    border: 1px solid #dbe4ee;
    border-radius: 6px;
    background: #111827;
    color: #f8fafc;
    line-height: 1.55;
    white-space: pre;
}

.docs-code-block code {
    padding: 0;
    background: transparent;
    border-radius: 0;
    color: inherit;
    font-size: 0.875rem;
}

.docs-blockquote {
    margin-left: 0;
    padding: 0.85rem 1rem;
    border-left: 4px solid #93c5fd;
    background: #eff6ff;
    border-radius: 0 0.75rem 0.75rem 0;
}

.docs-table-wrapper {
    overflow-x: auto;
}

.docs-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 420px;
}

.docs-table th,
.docs-table td {
    padding: 0.85rem 1rem;
    border-bottom: 1px solid #e2e8f0;
    text-align: left;
    vertical-align: top;
}

.docs-table th {
    background: #f8fafc;
    color: #0f172a;
    font-weight: 600;
}

.docs-outline__link {
    color: #475569;
    padding: 0.35rem 0;
}

.docs-outline__link:hover {
    color: #1d4ed8;
}

.docs-outline__link--level-2 {
    padding-left: 0.75rem;
}

.docs-outline__link--level-3 {
    padding-left: 1.5rem;
    font-size: 0.95rem;
}

.tickets-page {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: hidden;
}

.tickets-page__header,
.tickets-page__actions,
.tickets-summary,
.ticket-detail-panel__header,
.ticket-detail-panel__meta,
.ticket-admin-panel__actions,
.report-issue-dialog__actions {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
    align-items: center;
}

.tickets-page__header,
.ticket-detail-panel__header,
.ticket-admin-panel__actions,
.report-issue-dialog__actions {
    justify-content: space-between;
}

.tickets-page__header h1 {
    margin: 0;
}

.tickets-page__scope {
    color: #64748b;
    font-weight: 600;
    margin-top: 0.25rem;
}

.tickets-summary__item {
    flex: 1 1 150px;
    border: 1px solid #dbe2ea;
    border-radius: 8px;
    background: #f8fafc;
    padding: 0.85rem 1rem;
}

.tickets-grid-shell {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    border: 1px solid #dbe2ea;
    border-radius: 8px;
    background: #fff;
}

.tickets-grid-shell .rz-data-grid {
    border: 0;
}

.tickets-summary__item span {
    display: block;
    color: #64748b;
    font-size: 0.84rem;
    margin-bottom: 0.2rem;
}

.tickets-summary__item strong {
    color: #0f172a;
    font-size: 1.45rem;
}

.tickets-empty-state {
    min-height: 180px;
    display: grid;
    place-items: center;
    border: 1px dashed #cbd5e1;
    border-radius: 8px;
    color: #64748b;
    background: #f8fafc;
}

.tickets-link-button {
    border: 0;
    padding: 0;
    background: transparent;
    color: #1d4ed8;
    font-weight: 600;
    text-align: left;
    max-width: 100%;
    white-space: normal;
}

.tickets-link-button:hover {
    color: #1e40af;
    text-decoration: underline;
}

.tickets-reporter-cell,
.ticket-detail-panel__content,
.ticket-detail-panel__content section,
.report-issue-dialog__field {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.tickets-reporter-cell span {
    color: #64748b;
    font-size: 0.82rem;
}

.ticket-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.75rem;
    border-radius: 999px;
    padding: 0.25rem 0.65rem;
    font-size: 0.8rem;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    border: 1px solid transparent;
}

.ticket-pill--open {
    color: #1d4ed8;
    background: #dbeafe;
    border-color: #bfdbfe;
}

.ticket-pill--progress {
    color: #6d28d9;
    background: #ede9fe;
    border-color: #ddd6fe;
}

.ticket-pill--waiting {
    color: #92400e;
    background: #fef3c7;
    border-color: #fde68a;
}

.ticket-pill--resolved {
    color: #047857;
    background: #d1fae5;
    border-color: #a7f3d0;
}

.ticket-pill--closed,
.ticket-pill--low {
    color: #475569;
    background: #e2e8f0;
    border-color: #cbd5e1;
}

.ticket-pill--medium {
    color: #0369a1;
    background: #e0f2fe;
    border-color: #bae6fd;
}

.ticket-pill--high {
    color: #b45309;
    background: #ffedd5;
    border-color: #fed7aa;
}

.ticket-pill--urgent {
    color: #b91c1c;
    background: #fee2e2;
    border-color: #fecaca;
}

.ticket-detail-panel,
.ticket-admin-panel {
    border: 1px solid #dbe2ea;
    border-radius: 8px;
    background: #fff;
}

.ticket-detail-panel {
    padding: 1.25rem;
    min-width: 0;
    overflow-wrap: anywhere;
}

.ticket-detail-panel__number {
    color: #64748b;
    font-weight: 700;
}

.ticket-detail-panel__header h2 {
    margin: 0.2rem 0 0;
    font-size: 1.35rem;
    color: #0f172a;
}

.ticket-detail-panel__meta {
    margin-top: 1rem;
}

.ticket-detail-panel__meta > span:not(.ticket-pill) {
    color: #475569;
    font-weight: 600;
}

.ticket-detail-panel__content {
    margin-top: 1.25rem;
    gap: 1rem;
}

.ticket-detail-panel__content h3 {
    margin: 0;
    color: #334155;
    font-size: 0.92rem;
}

.ticket-detail-panel__content p {
    margin: 0;
    color: #0f172a;
    white-space: pre-wrap;
}

.ticket-detail-panel__split,
.ticket-admin-panel__grid,
.report-issue-dialog__grid {
    display: grid;
    gap: 1rem;
}

.ticket-detail-panel__split {
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.ticket-admin-panel {
    margin-top: 1.25rem;
    padding: 1rem;
    background: #f8fafc;
}

.ticket-admin-panel__grid,
.report-issue-dialog__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ticket-admin-panel__wide,
.report-issue-dialog__field--wide {
    grid-column: 1 / -1;
}

.ticket-admin-panel__actions,
.report-issue-dialog__actions {
    margin-top: 1rem;
}

.report-issue-dialog {
    width: 100%;
    max-width: 100%;
}

.report-issue-dialog .rz-textarea {
    resize: vertical;
    line-height: 1.45;
}

.report-issue-dialog .rz-textbox,
.report-issue-dialog .rz-dropdown,
.report-issue-dialog .rz-textarea {
    border-radius: 8px;
}

.notification-settings-page {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: hidden;
}

.notification-settings-page__header,
.notification-settings-detail__header,
.notification-settings-detail__actions,
.notification-settings-section-header,
.notification-settings-recipient-form__actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.notification-settings-page__header h1,
.notification-settings-detail__header h2,
.notification-settings-section-header h3 {
    margin: 0;
}

.notification-settings-page__meta,
.notification-settings-detail__header span {
    color: #64748b;
    font-weight: 600;
    margin-top: 0.25rem;
}

.notification-settings-layout {
    display: grid;
    grid-template-columns: minmax(300px, 0.9fr) minmax(0, 1.6fr);
    gap: 1rem;
    align-items: start;
    min-width: 0;
}

.notification-settings-rules,
.notification-provider-settings,
.notification-settings-detail,
.notification-settings-grid-shell,
.notification-settings-empty {
    border: 1px solid #dbe2ea;
    border-radius: 8px;
    background: #fff;
}

.notification-settings-rules {
    min-width: 0;
    overflow: hidden;
}

.notification-provider-settings {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1rem;
    min-width: 0;
}

.notification-settings-detail {
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
    padding: 1rem;
    min-width: 0;
}

.notification-settings-rule-button {
    width: 100%;
    border: 0;
    background: transparent;
    padding: 0.35rem 0;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    text-align: left;
    color: #0f172a;
}

.notification-settings-rule-button strong {
    font-size: 0.95rem;
}

.notification-settings-rule-button span,
.notification-settings-target span {
    color: #64748b;
    font-size: 0.82rem;
    line-height: 1.35;
}

.notification-settings-form-grid,
.notification-settings-provider-grid,
.notification-settings-recipient-form {
    display: grid;
    gap: 0.9rem;
}

.notification-settings-form-grid {
    grid-template-columns: minmax(140px, 180px) minmax(0, 1fr);
}

.notification-settings-provider-grid {
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    align-items: end;
}

.notification-settings-recipient-form {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    align-items: end;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 1rem;
    background: #f8fafc;
}

.notification-settings-field {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-width: 0;
}

.notification-settings-field span {
    color: #334155;
    font-size: 0.82rem;
    font-weight: 700;
}

.notification-settings-field--inline {
    justify-content: center;
}

.notification-settings-field--wide {
    grid-column: 1 / -1;
}

.notification-settings-input {
    width: 100%;
    min-height: 2.5rem;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    padding: 0.45rem 0.75rem;
    background: #fff;
    color: #0f172a;
    font: inherit;
}

.notification-settings-input:disabled {
    background: #f1f5f9;
    color: #64748b;
}

.notification-settings-secret-field {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.55rem;
    min-width: 0;
}

.notification-settings-grid-shell {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
}

.notification-settings-grid-shell .rz-data-grid,
.notification-settings-rules .rz-data-grid {
    border: 0;
}

.notification-settings-target {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
    overflow-wrap: anywhere;
}

.notification-settings-wrap-cell {
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    line-height: 1.35;
}

.notification-settings-delivery-time {
    color: #475569;
    font-size: 0.82rem;
    line-height: 1.35;
    white-space: normal;
}

.notification-settings-checkbox {
    width: 1rem;
    height: 1rem;
    accent-color: #2563eb;
}

.notification-settings-checkbox-placeholder {
    color: #94a3b8;
    display: inline-flex;
    justify-content: center;
    width: 1rem;
}

.notification-settings-pill,
.notification-settings-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.6rem;
    border-radius: 999px;
    padding: 0.2rem 0.6rem;
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    border: 1px solid #cbd5e1;
    background: #f8fafc;
    color: #334155;
}

.notification-settings-status--enabled,
.notification-settings-status--sent {
    color: #047857;
    background: #d1fae5;
    border-color: #a7f3d0;
}

.notification-settings-status--failed {
    color: #b91c1c;
    background: #fee2e2;
    border-color: #fecaca;
}

.notification-settings-status--muted {
    color: #475569;
    background: #e2e8f0;
    border-color: #cbd5e1;
}

.notification-settings-empty {
    min-height: 180px;
    display: grid;
    place-items: center;
    color: #64748b;
    background: #f8fafc;
    padding: 1rem;
}

.notification-settings-empty--compact {
    min-height: 96px;
}

@media (max-width: 768px) {
    .statistics-pie-chart {
        grid-template-columns: 1fr;
    }

    .statistics-pie-chart__ring {
        width: 180px;
    }

    .statistics-bar-chart__row {
        grid-template-columns: 1fr;
    }

    .statistics-detail-grid th,
    .statistics-detail-grid td {
        white-space: nowrap;
    }

    .docs-page,
    .docs-content-grid {
        grid-template-columns: 1fr;
    }

    .docs-sidebar,
    .docs-outline {
        position: static;
    }

    .ticket-admin-panel__grid,
    .report-issue-dialog__grid {
        grid-template-columns: 1fr;
    }

    .notification-settings-layout,
    .notification-settings-provider-grid,
    .notification-settings-form-grid {
        grid-template-columns: 1fr;
    }

    .notification-settings-secret-field {
        grid-template-columns: 1fr;
        align-items: stretch;
    }
}

body .ticket-detail-panel {
    padding: 1.4rem;
    border-radius: 14px;
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.09);
}