:root {
    --mizan-green-950: #071b17;
    --mizan-green-900: #0b2721;
    --mizan-green-800: #12382f;
    --mizan-green-700: #1c4c40;
    --mizan-green-100: #e5eeea;

    --mizan-gold-700: #96723c;
    --mizan-gold-600: #aa8549;
    --mizan-gold-500: #c4a363;
    --mizan-gold-200: #eadbbb;

    --mizan-cream-50: #fdfcf8;
    --mizan-cream-100: #f8f5ed;
    --mizan-cream-200: #eee8dc;

    --mizan-white: #ffffff;
    --mizan-text: #18231f;
    --mizan-muted: #6a756f;
    --mizan-border: #dedfd9;

    --mizan-success: #247453;
    --mizan-success-soft: #e3f3eb;
    --mizan-warning: #9a6a1d;
    --mizan-warning-soft: #f8eed7;
    --mizan-danger: #a43e3e;
    --mizan-danger-soft: #f7e5e5;

    --shadow-sm:
        0 6px 20px rgba(7, 27, 23, 0.06);

    --shadow-md:
        0 18px 55px rgba(7, 27, 23, 0.11);

    --radius-sm: 10px;
    --radius-md: 16px;
    --radius-lg: 24px;

    --sidebar-width: 272px;
    --topbar-height: 76px;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    min-height: 100%;
    background: var(--mizan-cream-100);
}

body {
    min-height: 100vh;
    margin: 0;
    color: var(--mizan-text);
    background: var(--mizan-cream-100);
    font-family:
        Inter,
        ui-sans-serif,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;
    font-size: 15px;
    line-height: 1.55;
}

button,
input,
select,
textarea {
    font: inherit;
}

button,
a {
    -webkit-tap-highlight-color: transparent;
}

a {
    color: inherit;
    text-decoration: none;
}

img {
    max-width: 100%;
}

h1,
h2,
h3,
p {
    margin-top: 0;
}

h1,
h2,
h3 {
    color: var(--mizan-green-950);
    font-family:
        Georgia,
        "Times New Roman",
        serif;
    line-height: 1.18;
}

h1 {
    margin-bottom: 12px;
    font-size: clamp(30px, 4vw, 48px);
    font-weight: 600;
}

h2 {
    margin-bottom: 8px;
    font-size: 27px;
    font-weight: 600;
}

h3 {
    margin-bottom: 8px;
    font-size: 21px;
    font-weight: 600;
}

p {
    color: var(--mizan-muted);
}

.app-shell {
    min-height: 100vh;
}

.topbar {
    position: fixed;
    z-index: 50;
    top: 0;
    right: 0;
    left: 0;
    display: flex;
    height: var(--topbar-height);
    align-items: center;
    justify-content: space-between;
    padding: 0 28px;
    border-bottom: 1px solid rgba(222, 223, 217, 0.8);
    background: rgba(253, 252, 248, 0.94);
    backdrop-filter: blur(16px);
}

.topbar__actions {
    display: flex;
    align-items: center;
    gap: 24px;
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: 12px;
}

.brand__mark {
    display: inline-flex;
    width: 43px;
    height: 43px;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--mizan-gold-500);
    border-radius: 50%;
    color: var(--mizan-gold-600);
    background: var(--mizan-cream-50);
    font-family: Georgia, serif;
    font-size: 22px;
    font-weight: 700;
}

.brand__text {
    display: flex;
    flex-direction: column;
    line-height: 1.05;
}

.brand__text strong {
    color: var(--mizan-green-950);
    font-family: Georgia, serif;
    font-size: 21px;
    letter-spacing: 0.09em;
}

.brand__text small {
    margin-top: 5px;
    color: var(--mizan-muted);
    font-size: 10px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.brand--light .brand__mark {
    color: var(--mizan-gold-200);
    border-color: rgba(234, 219, 187, 0.7);
    background: rgba(255, 255, 255, 0.07);
}

.brand--light .brand__text strong,
.brand--light .brand__text small {
    color: var(--mizan-white);
}

.active-profile {
    display: flex;
    flex-direction: column;
    text-align: right;
}

.active-profile__label {
    color: var(--mizan-muted);
    font-size: 11px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.active-profile strong {
    color: var(--mizan-green-900);
    font-size: 14px;
}

.workspace {
    display: grid;
    min-height: 100vh;
    padding-top: var(--topbar-height);
    grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
}

.sidebar {
    position: fixed;
    top: var(--topbar-height);
    bottom: 0;
    left: 0;
    display: flex;
    width: var(--sidebar-width);
    flex-direction: column;
    justify-content: space-between;
    padding: 25px 17px 20px;
    overflow-y: auto;
    border-right: 1px solid rgba(255, 255, 255, 0.06);
    background:
        linear-gradient(
            180deg,
            var(--mizan-green-950),
            var(--mizan-green-900)
        );
}

.sidebar-nav {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.sidebar-link {
    display: flex;
    min-height: 46px;
    align-items: center;
    gap: 13px;
    padding: 10px 13px;
    border-radius: var(--radius-sm);
    color: rgba(255, 255, 255, 0.73);
    font-size: 14px;
    font-weight: 540;
    transition:
        color 160ms ease,
        background 160ms ease,
        transform 160ms ease;
}

.sidebar-link:hover {
    color: var(--mizan-white);
    background: rgba(255, 255, 255, 0.06);
}

.sidebar-link--active {
    color: var(--mizan-white);
    background: rgba(196, 163, 99, 0.17);
    box-shadow: inset 3px 0 0 var(--mizan-gold-500);
}

.sidebar-link--disabled {
    cursor: default;
    opacity: 0.42;
}

.sidebar-link--disabled:hover {
    color: rgba(255, 255, 255, 0.73);
    background: transparent;
}

.sidebar-link__icon {
    display: inline-flex;
    width: 25px;
    height: 25px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    color: var(--mizan-gold-200);
    font-family: Georgia, serif;
    font-size: 13px;
}

.sidebar-heading {
    margin: 25px 13px 7px;
    color: rgba(255, 255, 255, 0.38);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.sidebar-footer {
    display: flex;
    flex-direction: column;
    padding: 16px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: var(--radius-md);
    color: rgba(255, 255, 255, 0.8);
    background: rgba(255, 255, 255, 0.04);
}

.sidebar-footer__label {
    margin-bottom: 4px;
    color: var(--mizan-gold-200);
    font-size: 10px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.sidebar-footer strong {
    font-size: 12px;
}

.sidebar-footer__version {
    margin-top: 8px;
    color: rgba(255, 255, 255, 0.4);
    font-size: 10px;
}

.main-content {
    min-width: 0;
    padding: 38px;
    grid-column: 2;
}

.guest-content {
    min-height: 100vh;
}

.page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 31px;
}

.page-header p {
    max-width: 760px;
    margin-bottom: 0;
    font-size: 16px;
}

.eyebrow,
.card-label {
    display: inline-block;
    margin-bottom: 9px;
    color: var(--mizan-gold-700);
    font-size: 11px;
    font-weight: 750;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.eyebrow--light {
    color: var(--mizan-gold-200);
}

.button {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 9px 17px;
    border: 1px solid transparent;
    border-radius: 9px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 650;
    line-height: 1;
    transition:
        transform 150ms ease,
        background 150ms ease,
        border-color 150ms ease,
        box-shadow 150ms ease;
}

.button:hover:not(.button--disabled) {
    transform: translateY(-1px);
}

.button--primary {
    color: var(--mizan-white);
    border-color: var(--mizan-green-900);
    background: var(--mizan-green-900);
    box-shadow:
        0 8px 18px rgba(11, 39, 33, 0.15);
}

.button--primary:hover {
    background: var(--mizan-green-800);
}

.button--secondary {
    color: var(--mizan-green-900);
    border-color: var(--mizan-border);
    background: var(--mizan-white);
}

.button--secondary:hover {
    border-color: var(--mizan-gold-500);
}

.button--ghost {
    color: var(--mizan-green-800);
    border-color: transparent;
    background: transparent;
}

.button--ghost:hover {
    background: var(--mizan-green-100);
}

.button--large {
    min-height: 50px;
    padding: 13px 23px;
}

.button--small {
    min-height: 34px;
    padding: 7px 12px;
    font-size: 12px;
}

.button--full {
    width: 100%;
}

.button--disabled {
    cursor: not-allowed;
    opacity: 0.45;
}

.alert {
    margin-bottom: 22px;
    padding: 14px 17px;
    border: 1px solid;
    border-radius: var(--radius-sm);
}

.alert ul {
    margin: 8px 0 0;
    padding-left: 20px;
}

.alert--success {
    color: var(--mizan-success);
    border-color: rgba(36, 116, 83, 0.24);
    background: var(--mizan-success-soft);
}

.alert--danger {
    color: var(--mizan-danger);
    border-color: rgba(164, 62, 62, 0.22);
    background: var(--mizan-danger-soft);
}

.auth-alert {
    position: fixed;
    z-index: 100;
    top: 20px;
    left: 50%;
    width: min(650px, calc(100% - 32px));
    transform: translateX(-50%);
    box-shadow: var(--shadow-md);
}

.auth-page {
    overflow-x: hidden;
}

.auth-layout {
    display: grid;
    min-height: 100vh;
    grid-template-columns: minmax(380px, 0.9fr) minmax(520px, 1.1fr);
}

.auth-visual {
    position: relative;
    min-height: 100vh;
    overflow: hidden;
    color: var(--mizan-white);
    background:
        radial-gradient(
            circle at 20% 20%,
            rgba(196, 163, 99, 0.18),
            transparent 32%
        ),
        linear-gradient(
            145deg,
            var(--mizan-green-800),
            var(--mizan-green-950)
        );
}

.auth-visual::after {
    position: absolute;
    right: -160px;
    bottom: -160px;
    width: 430px;
    height: 430px;
    border: 1px solid rgba(234, 219, 187, 0.16);
    border-radius: 50%;
    content: "";
}

.auth-visual__overlay {
    position: absolute;
    inset: 0;
    opacity: 0.22;
    background-image:
        linear-gradient(
            rgba(255, 255, 255, 0.025) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, 0.025) 1px,
            transparent 1px
        );
    background-size: 44px 44px;
}

.auth-visual__content {
    position: relative;
    z-index: 1;
    display: flex;
    min-height: 100vh;
    flex-direction: column;
    justify-content: space-between;
    padding: 48px;
}

.auth-visual__message {
    max-width: 580px;
    margin: 100px 0;
}

.auth-visual__message h1 {
    margin-bottom: 23px;
    color: var(--mizan-white);
    font-size: clamp(39px, 5vw, 68px);
}

.auth-visual__message p {
    max-width: 520px;
    color: rgba(255, 255, 255, 0.73);
    font-size: 17px;
    line-height: 1.75;
}

.auth-visual__footer {
    color: rgba(255, 255, 255, 0.42);
    font-size: 12px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.auth-panel {
    display: flex;
    min-height: 100vh;
    align-items: center;
    justify-content: center;
    padding: 45px;
    background: var(--mizan-cream-100);
}

.auth-panel--wide .auth-card {
    max-width: 720px;
}

.auth-card {
    width: 100%;
    max-width: 510px;
    padding: 44px;
    border: 1px solid rgba(222, 223, 217, 0.9);
    border-radius: var(--radius-lg);
    background: var(--mizan-white);
    box-shadow: var(--shadow-md);
}

.auth-card__header {
    margin-bottom: 30px;
}

.auth-card__header p {
    margin-bottom: 0;
}

.auth-card__divider {
    position: relative;
    margin: 26px 0;
    text-align: center;
}

.auth-card__divider::before {
    position: absolute;
    top: 50%;
    right: 0;
    left: 0;
    height: 1px;
    background: var(--mizan-border);
    content: "";
}

.auth-card__divider span {
    position: relative;
    z-index: 1;
    padding: 0 12px;
    color: var(--mizan-muted);
    background: var(--mizan-white);
    font-size: 12px;
}

.auth-card__register {
    margin-bottom: 0;
    text-align: center;
}

.auth-card__register a {
    color: var(--mizan-green-700);
    font-weight: 700;
}

.security-note {
    display: flex;
    gap: 13px;
    margin-top: 28px;
    padding: 16px;
    border: 1px solid var(--mizan-gold-200);
    border-radius: var(--radius-sm);
    background: var(--mizan-cream-50);
}

.security-note__icon {
    color: var(--mizan-gold-600);
}

.security-note p {
    margin: 0;
    font-size: 12px;
}

.form-stack {
    display: flex;
    flex-direction: column;
    gap: 19px;
}

.form-grid {
    display: grid;
    gap: 17px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.form-group {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.form-group label,
.form-label-row label {
    color: var(--mizan-green-950);
    font-size: 13px;
    font-weight: 680;
}

.form-label-row {
    display: flex;
    justify-content: space-between;
}

input,
select,
textarea {
    width: 100%;
    border: 1px solid var(--mizan-border);
    border-radius: 9px;
    outline: none;
    color: var(--mizan-text);
    background: var(--mizan-white);
    transition:
        border-color 140ms ease,
        box-shadow 140ms ease;
}

input,
select {
    min-height: 47px;
    padding: 10px 13px;
}

textarea {
    padding: 12px 13px;
    resize: vertical;
}

input:focus,
select:focus,
textarea:focus {
    border-color: var(--mizan-gold-500);
    box-shadow:
        0 0 0 4px rgba(196, 163, 99, 0.13);
}

.form-help {
    color: var(--mizan-muted);
    font-size: 11px;
}

.checkbox-row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    cursor: pointer;
    color: var(--mizan-muted);
    font-size: 13px;
}

.checkbox-row--top {
    margin-top: 2px;
}

.checkbox-row input {
    width: 17px;
    height: 17px;
    min-height: 0;
    margin-top: 2px;
    accent-color: var(--mizan-green-800);
}

.password-rules {
    display: grid;
    gap: 7px 15px;
    padding: 14px 16px;
    border-radius: var(--radius-sm);
    color: var(--mizan-muted);
    background: var(--mizan-cream-100);
    font-size: 11px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.password-rules strong {
    color: var(--mizan-green-900);
    grid-column: 1 / -1;
}

.metrics-grid {
    display: grid;
    gap: 17px;
    margin-bottom: 24px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.metric-card,
.panel,
.dashboard-card {
    border: 1px solid rgba(222, 223, 217, 0.9);
    border-radius: var(--radius-md);
    background: var(--mizan-white);
    box-shadow: var(--shadow-sm);
}

.metric-card {
    display: flex;
    min-height: 160px;
    flex-direction: column;
    justify-content: space-between;
    padding: 22px;
}

.metric-card--warning {
    border-top: 3px solid var(--mizan-warning);
}

.metric-card--success {
    border-top: 3px solid var(--mizan-success);
}

.metric-card__label {
    color: var(--mizan-muted);
    font-size: 12px;
    font-weight: 650;
}

.metric-card__value {
    color: var(--mizan-green-950);
    font-family: Georgia, serif;
    font-size: 43px;
    line-height: 1;
}

.metric-card__hint,
.metric-card__link {
    color: var(--mizan-muted);
    font-size: 12px;
}

.metric-card__link {
    color: var(--mizan-green-700);
    font-weight: 700;
}

.content-grid {
    display: grid;
    align-items: start;
    gap: 22px;
    grid-template-columns: minmax(0, 1.8fr) minmax(310px, 0.8fr);
}

.panel {
    padding: 24px;
}

.panel--wide {
    min-width: 0;
}

.panel--danger {
    color: var(--mizan-danger);
    border-color: rgba(164, 62, 62, 0.25);
    background: var(--mizan-danger-soft);
}

.panel__header,
.dashboard-card__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 21px;
}

.panel__header h2,
.dashboard-card__header h2 {
    margin-bottom: 0;
}

.dashboard-grid {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dashboard-card {
    padding: 25px;
}

.dashboard-card--large {
    grid-column: 1 / -1;
}

.text-link,
.back-link {
    color: var(--mizan-green-700);
    font-weight: 700;
}

.text-link {
    border: 0;
    cursor: pointer;
    background: transparent;
}

.back-link {
    display: block;
    margin-bottom: 18px;
    font-size: 13px;
}

.table-wrapper {
    width: 100%;
    overflow-x: auto;
}

.data-table {
    width: 100%;
    border-collapse: collapse;
    white-space: nowrap;
}

.data-table th {
    padding: 12px 14px;
    border-bottom: 1px solid var(--mizan-border);
    color: var(--mizan-muted);
    font-size: 10px;
    font-weight: 750;
    letter-spacing: 0.09em;
    text-align: left;
    text-transform: uppercase;
}

.data-table td {
    padding: 15px 14px;
    border-bottom: 1px solid #eceeea;
    vertical-align: middle;
}

.data-table tbody tr:hover {
    background: var(--mizan-cream-50);
}

.data-table tbody tr:last-child td {
    border-bottom: 0;
}

.table-actions {
    text-align: right;
}

.table-empty {
    padding: 45px !important;
    color: var(--mizan-muted);
    text-align: center;
}

.table-user {
    display: flex;
    align-items: center;
    gap: 11px;
}

.table-user__avatar,
.profile-avatar {
    display: inline-flex;
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: var(--mizan-gold-700);
    background: var(--mizan-cream-200);
    font-family: Georgia, serif;
    font-size: 16px;
    font-weight: 700;
}

.table-user > div {
    display: flex;
    flex-direction: column;
}

.table-user small {
    color: var(--mizan-muted);
    font-size: 11px;
}

.tag-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.tag {
    display: inline-flex;
    padding: 4px 8px;
    border-radius: 999px;
    color: var(--mizan-green-800);
    background: var(--mizan-green-100);
    font-size: 10px;
    font-weight: 650;
}

.tag--gold {
    color: var(--mizan-gold-700);
    background: var(--mizan-cream-200);
}

.status-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 750;
}

.status-badge--approved,
.status-badge--success {
    color: var(--mizan-success);
    background: var(--mizan-success-soft);
}

.status-badge--pending {
    color: var(--mizan-warning);
    background: var(--mizan-warning-soft);
}

.status-badge--rejected,
.status-badge--suspended,
.status-badge--danger {
    color: var(--mizan-danger);
    background: var(--mizan-danger-soft);
}

.filter-bar {
    display: grid;
    align-items: center;
    gap: 12px;
    margin-bottom: 22px;
    grid-template-columns: minmax(260px, 1fr) 220px auto auto;
}

.pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 22px;
    padding-top: 20px;
    border-top: 1px solid var(--mizan-border);
    color: var(--mizan-muted);
    font-size: 12px;
}

.pagination__actions {
    display: flex;
    gap: 9px;
}

.activity-list {
    display: flex;
    flex-direction: column;
}

.activity-item {
    position: relative;
    display: flex;
    gap: 12px;
    padding: 0 0 20px;
}

.activity-item:not(:last-child)::before {
    position: absolute;
    top: 14px;
    bottom: 0;
    left: 5px;
    width: 1px;
    background: var(--mizan-border);
    content: "";
}

.activity-item__dot {
    position: relative;
    z-index: 1;
    width: 11px;
    height: 11px;
    flex: 0 0 auto;
    margin-top: 5px;
    border: 2px solid var(--mizan-gold-500);
    border-radius: 50%;
    background: var(--mizan-white);
}

.activity-item__content {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.activity-item__content strong {
    font-size: 12px;
}

.activity-item__content span,
.activity-item__content small {
    overflow: hidden;
    color: var(--mizan-muted);
    font-size: 10px;
    text-overflow: ellipsis;
}

.empty-state {
    display: flex;
    min-height: 285px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 35px;
    text-align: center;
}

.empty-state--compact {
    min-height: 210px;
}

.empty-state__symbol {
    display: flex;
    width: 60px;
    height: 60px;
    align-items: center;
    justify-content: center;
    margin-bottom: 17px;
    border: 1px solid var(--mizan-gold-200);
    border-radius: 50%;
    color: var(--mizan-gold-600);
    background: var(--mizan-cream-50);
    font-family: Georgia, serif;
    font-size: 22px;
}

.empty-state p {
    max-width: 540px;
    margin-bottom: 0;
}

.profile-list,
.profile-cards {
    display: flex;
    flex-direction: column;
    gap: 11px;
}

.profile-list__item,
.profile-card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-sm);
    background: var(--mizan-cream-50);
}

.profile-list__item > div,
.profile-card > div {
    display: flex;
    flex-direction: column;
}

.profile-list__item small,
.profile-card span,
.profile-card small {
    color: var(--mizan-muted);
    font-size: 11px;
}

.status-page {
    display: flex;
    min-height: calc(100vh - var(--topbar-height) - 76px);
    align-items: center;
    justify-content: center;
    padding: 30px;
}

.status-card {
    width: 100%;
    max-width: 650px;
    padding: 50px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-lg);
    text-align: center;
    background: var(--mizan-white);
    box-shadow: var(--shadow-md);
}

.status-symbol {
    display: inline-flex;
    min-width: 72px;
    height: 72px;
    align-items: center;
    justify-content: center;
    margin-bottom: 23px;
    padding: 0 14px;
    border-radius: 50%;
    font-family: Georgia, serif;
    font-size: 27px;
    font-weight: 700;
}

.status-symbol--pending {
    color: var(--mizan-warning);
    background: var(--mizan-warning-soft);
}

.status-symbol--danger {
    color: var(--mizan-danger);
    background: var(--mizan-danger-soft);
}

.status-symbol--success {
    color: var(--mizan-success);
    background: var(--mizan-success-soft);
}

.status-information {
    display: grid;
    gap: 1px;
    margin: 28px 0;
    overflow: hidden;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-sm);
    background: var(--mizan-border);
    text-align: left;
}

.status-information > div {
    display: flex;
    justify-content: space-between;
    gap: 30px;
    padding: 13px 16px;
    background: var(--mizan-cream-50);
}

.status-information span {
    color: var(--mizan-muted);
    font-size: 12px;
}

.information-box {
    padding: 15px 17px;
    border: 1px solid var(--mizan-gold-200);
    border-radius: var(--radius-sm);
    color: var(--mizan-muted);
    background: var(--mizan-cream-50);
    font-size: 12px;
}

.information-box--danger {
    color: var(--mizan-danger);
    border-color: rgba(164, 62, 62, 0.2);
    background: var(--mizan-danger-soft);
}

.status-logout {
    margin-top: 25px;
}

.user-detail-grid {
    display: grid;
    align-items: start;
    gap: 22px;
    grid-template-columns: minmax(0, 1.6fr) minmax(310px, 0.75fr);
}

.user-detail-main,
.user-detail-sidebar {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.detail-list {
    display: grid;
    gap: 0;
    margin: 0;
}

.detail-list > div {
    display: grid;
    gap: 20px;
    padding: 13px 0;
    border-bottom: 1px solid var(--mizan-border);
    grid-template-columns: 180px minmax(0, 1fr);
}

.detail-list > div:last-child {
    border-bottom: 0;
}

.detail-list dt {
    color: var(--mizan-muted);
    font-size: 12px;
}

.detail-list dd {
    margin: 0;
    overflow-wrap: anywhere;
    color: var(--mizan-green-950);
    font-size: 13px;
    font-weight: 650;
}

.organization-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 17px;
    padding: 14px 0;
    border-bottom: 1px solid var(--mizan-border);
}

.organization-row > div {
    display: flex;
    flex-direction: column;
}

.organization-row span {
    color: var(--mizan-muted);
    font-size: 11px;
}

.role-option {
    display: flex;
    gap: 12px;
    padding: 14px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-sm);
    cursor: pointer;
    background: var(--mizan-cream-50);
}

.role-option input {
    width: 17px;
    height: 17px;
    min-height: 0;
    margin-top: 2px;
    accent-color: var(--mizan-green-800);
}

.role-option span {
    display: flex;
    flex-direction: column;
}

.role-option small {
    margin-top: 3px;
    color: var(--mizan-muted);
    font-size: 11px;
}

.protected-role {
    display: flex;
    gap: 13px;
    margin-bottom: 17px;
    padding: 15px;
    border: 1px solid var(--mizan-gold-200);
    border-radius: var(--radius-sm);
    background: var(--mizan-cream-50);
}

.protected-role__icon {
    color: var(--mizan-gold-600);
}

.protected-role p {
    margin: 4px 0 0;
    font-size: 11px;
}

.muted {
    color: var(--mizan-muted);
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    white-space: nowrap;
}

/* ── Mobile Navigation Toggle ── */
.sidebar-toggle {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 36px;
    height: 36px;
    padding: 7px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-sm);
    background: var(--mizan-white);
    cursor: pointer;
}

.sidebar-toggle span {
    display: block;
    width: 100%;
    height: 2px;
    border-radius: 2px;
    background: var(--mizan-green-800);
    transition: transform 0.2s, opacity 0.2s;
}

.sidebar-toggle:hover {
    background: var(--mizan-cream-100);
}

.sidebar-overlay {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 60;
    background: rgba(0, 0, 0, 0.4);
    opacity: 0;
    transition: opacity 0.25s;
}

.sidebar-overlay--visible {
    display: block;
    opacity: 1;
}

.sidebar--open {
    transform: translateX(0) !important;
}

/* ── Portal Mobile Navigation Toggle ── */
.portal-sidebar-toggle {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 36px;
    height: 36px;
    padding: 7px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-sm);
    background: var(--mizan-white);
    cursor: pointer;
}

.portal-sidebar-toggle span {
    display: block;
    width: 100%;
    height: 2px;
    border-radius: 2px;
    background: var(--mizan-green-800);
    transition: transform 0.2s, opacity 0.2s;
}

.portal-sidebar-toggle:hover {
    background: var(--mizan-cream-100);
}

.portal-sidebar-overlay {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 60;
    background: rgba(0, 0, 0, 0.4);
    opacity: 0;
    transition: opacity 0.25s;
}

.portal-sidebar-overlay--visible {
    display: block;
    opacity: 1;
}

.portal-sidebar--open {
    transform: translateX(0) !important;
}

@media (max-width: 900px) {
    .sidebar-toggle {
        display: flex;
    }

    .topbar__brand {
        margin-left: 8px;
    }

    .sidebar {
        z-index: 70;
        transform: translateX(-100%);
        transition: transform 0.25s ease;
        display: flex;
    }

    .sidebar-overlay--visible {
        display: block;
    }

    .portal-sidebar-toggle {
        display: flex;
    }

    .portal-sidebar {
        z-index: 70;
        transform: translateX(-100%);
        transition: transform 0.25s ease;
        display: flex;
    }

    .portal-sidebar-overlay--visible {
        display: block;
    }
}

@media (max-width: 1180px) {
    .metrics-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .content-grid,
    .user-detail-grid {
        grid-template-columns: 1fr;
    }

    .auth-layout {
        grid-template-columns: minmax(340px, 0.8fr) minmax(470px, 1.2fr);
    }
}

@media (max-width: 900px) {
    :root {
        --sidebar-width: 0px;
    }

    .sidebar {
        display: none;
    }

    .workspace {
        display: block;
    }

    .main-content {
        padding: 28px 20px;
    }

    .auth-layout {
        display: block;
    }

    .auth-visual {
        min-height: 360px;
    }

    .auth-visual__content {
        min-height: 360px;
        padding: 30px;
    }

    .auth-visual__message {
        margin: 50px 0 10px;
    }

    .auth-visual__message h1 {
        font-size: 39px;
    }

    .auth-panel {
        min-height: auto;
        padding: 30px 18px 50px;
    }

    .filter-bar {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 650px) {
    .topbar {
        padding: 0 15px;
    }

    .active-profile {
        display: none;
    }

    .brand__text small {
        display: none;
    }

    .page-header {
        flex-direction: column;
    }

    .metrics-grid,
    .dashboard-grid,
    .form-grid,
    .password-rules,
    .filter-bar {
        grid-template-columns: 1fr;
    }

    .auth-card,
    .status-card {
        padding: 28px 21px;
    }

    .auth-visual__content {
        padding: 25px 21px;
    }

    .auth-visual__message h1 {
        font-size: 33px;
    }

    .auth-visual__message p {
        font-size: 14px;
    }

    .main-content {
        padding: 24px 14px;
    }

    .panel,
    .dashboard-card {
        padding: 18px;
    }

    .detail-list > div {
        gap: 4px;
        grid-template-columns: 1fr;
    }

    .status-information > div {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }

    .pagination {
        align-items: stretch;
        flex-direction: column;
    }

    .pagination__actions {
        justify-content: space-between;
    }
}

[dir="rtl"] .sidebar {
    right: 0;
    left: auto;
    border-right: 0;
    border-left: 1px solid rgba(255, 255, 255, 0.06);
}

[dir="rtl"] .sidebar-link--active {
    box-shadow: inset -3px 0 0 var(--mizan-gold-500);
}

[dir="rtl"] .active-profile {
    text-align: left;
}

[dir="rtl"] .data-table th {
    text-align: right;
}

[dir="rtl"] .table-actions {
    text-align: left;
}

[dir="rtl"] .activity-item:not(:last-child)::before {
    right: 5px;
    left: auto;
}

/* ---- MIZAN Mastercode CSS-Erweiterung ---- */

.header-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.metrics-grid--four {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.setup-page {
    display: flex;
    min-height: calc(100vh - var(--topbar-height) - 80px);
    align-items: center;
    justify-content: center;
    padding: 30px;
}

.setup-card {
    width: 100%;
    max-width: 760px;
    padding: 42px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-lg);
    background: var(--mizan-white);
    box-shadow: var(--shadow-md);
}

.setup-card__intro {
    margin-bottom: 28px;
}

.setup-card__intro p {
    max-width: 620px;
}

.setup-steps {
    display: grid;
    gap: 1px;
    margin-bottom: 30px;
    overflow: hidden;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-sm);
    background: var(--mizan-border);
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.setup-step {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 13px;
    color: var(--mizan-muted);
    background: var(--mizan-cream-50);
    font-size: 12px;
}

.setup-step span {
    display: inline-flex;
    width: 25px;
    height: 25px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--mizan-cream-200);
}

.setup-step--active {
    color: var(--mizan-green-900);
    background: var(--mizan-green-100);
}

.setup-step--active span {
    color: var(--mizan-white);
    background: var(--mizan-green-800);
}

.record-list {
    display: flex;
    flex-direction: column;
}

.record-row,
.review-row,
.dossier-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 15px 0;
    border-bottom: 1px solid var(--mizan-border);
    transition:
        background 150ms ease,
        padding 150ms ease;
}

.record-row:last-child,
.review-row:last-child,
.dossier-row:last-child {
    border-bottom: 0;
}

.record-row:hover,
.review-row:hover,
.dossier-row:hover {
    padding-right: 10px;
    padding-left: 10px;
    background: var(--mizan-cream-50);
}

.record-row__main,
.record-row__meta,
.dossier-row > div,
.dossier-row__meta,
.review-row > div {
    display: flex;
    flex-direction: column;
}

.record-row__main span,
.review-row span,
.dossier-row span,
.record-row__meta small,
.dossier-row__meta small,
.review-row time {
    color: var(--mizan-muted);
    font-size: 11px;
}

.record-row__meta,
.dossier-row__meta {
    align-items: flex-end;
    gap: 5px;
}

.empty-inline {
    padding: 20px 0;
    color: var(--mizan-muted);
    font-size: 13px;
}

.editor-grid {
    display: grid;
    align-items: start;
    gap: 22px;
    grid-template-columns: minmax(0, 1.7fr) minmax(300px, 0.72fr);
}

.editor-main,
.editor-sidebar {
    min-width: 0;
}

.editor-sidebar {
    position: sticky;
    top: calc(var(--topbar-height) + 22px);
}

.lead-summary {
    margin-bottom: 23px;
    padding: 19px;
    border-left: 3px solid var(--mizan-gold-500);
    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
    color: var(--mizan-text);
    background: var(--mizan-cream-50);
    white-space: pre-line;
}

.detail-list--compact > div {
    padding: 10px 0;
}

.timeline {
    display: flex;
    flex-direction: column;
}

.timeline-item {
    position: relative;
    display: flex;
    gap: 14px;
    padding-bottom: 23px;
}

.timeline-item:not(:last-child)::before {
    position: absolute;
    top: 13px;
    bottom: 0;
    left: 6px;
    width: 1px;
    background: var(--mizan-border);
    content: "";
}

.timeline-item__marker {
    position: relative;
    z-index: 1;
    width: 13px;
    height: 13px;
    flex: 0 0 auto;
    margin-top: 4px;
    border: 2px solid var(--mizan-gold-500);
    border-radius: 50%;
    background: var(--mizan-white);
}

.timeline-item__body {
    display: flex;
    flex-direction: column;
}

.timeline-item__body p {
    margin: 4px 0;
    color: var(--mizan-text);
    white-space: pre-line;
}

.timeline-item__body small {
    color: var(--mizan-muted);
    font-size: 10px;
}

.conflict-check {
    margin-bottom: 15px;
    padding: 16px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-sm);
    background: var(--mizan-cream-50);
}

.conflict-check:last-child {
    margin-bottom: 0;
}

.conflict-check__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 15px;
}

.conflict-check__header > div {
    display: flex;
    flex-direction: column;
}

.conflict-check__header small {
    color: var(--mizan-muted);
    font-size: 11px;
}

.match-list {
    margin-top: 13px;
    border-top: 1px solid var(--mizan-border);
}

.match-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 11px 0;
    border-bottom: 1px solid var(--mizan-border);
}

.match-row:last-child {
    border-bottom: 0;
}

.match-row > div {
    display: flex;
    flex-direction: column;
}

.match-row small {
    color: var(--mizan-muted);
    font-size: 10px;
}

.match-row > span {
    color: var(--mizan-warning);
    font-size: 12px;
    font-weight: 750;
}

.urgency {
    display: inline-flex;
    padding: 4px 8px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
}

.urgency--normal {
    color: var(--mizan-success);
    background: var(--mizan-success-soft);
}

.urgency--important {
    color: var(--mizan-warning);
    background: var(--mizan-warning-soft);
}

.urgency--urgent,
.urgency--critical {
    color: var(--mizan-danger);
    background: var(--mizan-danger-soft);
}

.stacked-value {
    display: flex;
    flex-direction: column;
}

.stacked-value small {
    color: var(--mizan-muted);
    font-size: 10px;
}

.count-badge {
    display: inline-flex;
    min-width: 28px;
    height: 28px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: var(--mizan-green-800);
    background: var(--mizan-green-100);
    font-size: 11px;
    font-weight: 750;
}

.tag--large {
    padding: 8px 13px;
    font-size: 11px;
}

.internal-note {
    margin-top: 22px;
    padding: 17px;
    border: 1px solid var(--mizan-gold-200);
    border-radius: var(--radius-sm);
    background: var(--mizan-cream-50);
}

.internal-note p {
    margin: 8px 0 0;
    color: var(--mizan-text);
    white-space: pre-line;
}

.date-danger {
    color: var(--mizan-danger);
    font-weight: 750;
}

.dossier-header__status {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.dossier-kpi-grid {
    display: grid;
    gap: 1px;
    margin-bottom: 22px;
    overflow: hidden;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-md);
    background: var(--mizan-border);
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.dossier-kpi-grid article {
    display: flex;
    min-height: 92px;
    flex-direction: column;
    justify-content: center;
    padding: 17px;
    background: var(--mizan-white);
}

.dossier-kpi-grid span {
    margin-bottom: 5px;
    color: var(--mizan-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.dossier-kpi-grid strong,
.dossier-kpi-grid a {
    color: var(--mizan-green-900);
    font-size: 13px;
    font-weight: 750;
}

.dossier-layout {
    display: grid;
    align-items: start;
    gap: 22px;
    grid-template-columns: minmax(0, 1.7fr) minmax(310px, 0.72fr);
}

.dossier-main,
.dossier-sidebar {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 22px;
}

.dossier-sidebar {
    position: sticky;
    top: calc(var(--topbar-height) + 22px);
}

.participant-list {
    display: grid;
    gap: 10px;
}

.participant-card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-sm);
    background: var(--mizan-cream-50);
}

.participant-card__body {
    display: flex;
    min-width: 0;
    flex: 1;
    flex-direction: column;
}

.participant-card__body span,
.participant-card__body small {
    overflow: hidden;
    color: var(--mizan-muted);
    font-size: 10px;
    text-overflow: ellipsis;
}

.icon-button {
    display: inline-flex;
    width: 31px;
    height: 31px;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    background: transparent;
    font-size: 18px;
}

.icon-button--danger {
    color: var(--mizan-danger);
}

.icon-button--danger:hover {
    background: var(--mizan-danger-soft);
}

.note-list {
    display: flex;
    flex-direction: column;
    gap: 11px;
}

.note-card {
    padding: 15px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-sm);
    background: var(--mizan-cream-50);
}

.note-card__header,
.review-card__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 15px;
}

.note-card p,
.review-card p {
    margin: 12px 0;
    color: var(--mizan-text);
    white-space: pre-line;
}

.note-card small,
.review-card small {
    color: var(--mizan-muted);
    font-size: 10px;
}

.review-card {
    margin-bottom: 13px;
    padding: 16px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-sm);
    background: var(--mizan-cream-50);
}

.review-card:last-child {
    margin-bottom: 0;
}

.review-card__header > div {
    display: flex;
    flex-direction: column;
}

.review-checks {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 14px;
}

.review-checks span {
    padding: 5px 9px;
    border-radius: 999px;
    color: var(--mizan-muted);
    background: var(--mizan-cream-200);
    font-size: 10px;
}

.review-checks .review-check--done {
    color: var(--mizan-success);
    background: var(--mizan-success-soft);
}

.filter-bar--simple {
    grid-template-columns: minmax(260px, 1fr) auto auto;
}

.form-grid--single-mobile {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 1300px) {
    .metrics-grid--four {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dossier-kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1050px) {
    .editor-grid,
    .dossier-layout {
        grid-template-columns: 1fr;
    }

    .editor-sidebar,
    .dossier-sidebar {
        position: static;
    }
}

@media (max-width: 700px) {
    .setup-card {
        padding: 26px 20px;
    }

    .setup-steps {
        grid-template-columns: 1fr;
    }

    .metrics-grid--four,
    .dossier-kpi-grid {
        grid-template-columns: 1fr;
    }

    .dossier-header__status {
        justify-content: flex-start;
    }

    .record-row,
    .review-row,
    .dossier-row {
        align-items: flex-start;
        flex-direction: column;
    }

    .record-row__meta,
    .dossier-row__meta {
        align-items: flex-start;
    }

    .form-grid--single-mobile {
        grid-template-columns: 1fr;
    }
}

/* ---- MIZAN Mastercode CSS-Erweiterung ---- */

.portal-page {
    background: var(--mizan-cream-100);
}

.portal-topbar {
    position: fixed;
    z-index: 60;
    top: 0;
    right: 0;
    left: 0;
    display: flex;
    height: var(--topbar-height);
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 0 28px;
    border-bottom: 1px solid var(--mizan-border);
    background: rgba(253, 252, 248, 0.96);
    backdrop-filter: blur(16px);
}

.portal-topbar__actions {
    display: flex;
    align-items: center;
    gap: 18px;
}

.portal-topbar__actions select {
    min-width: 240px;
}

.portal-shell {
    display: grid;
    min-height: 100vh;
    padding-top: var(--topbar-height);
    grid-template-columns: 250px minmax(0, 1fr);
}

.portal-sidebar {
    position: fixed;
    top: var(--topbar-height);
    bottom: 0;
    left: 0;
    display: flex;
    width: 250px;
    flex-direction: column;
    padding: 22px 15px;
    overflow-y: auto;
    border-right: 1px solid var(--mizan-border);
    background: var(--mizan-white);
}

.portal-client-card {
    display: flex;
    flex-direction: column;
    margin-bottom: 24px;
    padding: 17px;
    border: 1px solid var(--mizan-gold-200);
    border-radius: var(--radius-md);
    background: var(--mizan-cream-50);
}

.portal-client-card__label {
    margin-bottom: 6px;
    color: var(--mizan-gold-700);
    font-size: 9px;
    font-weight: 750;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.portal-client-card strong {
    color: var(--mizan-green-950);
}

.portal-client-card small {
    color: var(--mizan-muted);
}

.portal-nav {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 6px;
}

.portal-nav__link {
    padding: 12px 14px;
    border-radius: var(--radius-sm);
    color: var(--mizan-muted);
    font-weight: 650;
}

.portal-nav__link:hover {
    color: var(--mizan-green-900);
    background: var(--mizan-green-100);
}

.portal-nav__link--active {
    color: var(--mizan-green-900);
    background: var(--mizan-green-100);
    box-shadow: inset 3px 0 0 var(--mizan-gold-500);
}

.portal-security-note {
    margin-top: 25px;
    padding: 13px;
    border-radius: var(--radius-sm);
    color: var(--mizan-muted);
    background: var(--mizan-cream-100);
    font-size: 10px;
    text-align: center;
}

.portal-content {
    min-width: 0;
    padding: 38px;
    grid-column: 2;
}

.portal-metrics {
    display: grid;
    gap: 16px;
    margin-bottom: 22px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.portal-metric-card {
    display: flex;
    min-height: 150px;
    flex-direction: column;
    justify-content: space-between;
    padding: 21px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-md);
    background: var(--mizan-white);
    box-shadow: var(--shadow-sm);
}

.portal-metric-card span {
    color: var(--mizan-muted);
    font-size: 12px;
    font-weight: 650;
}

.portal-metric-card strong {
    color: var(--mizan-green-950);
    font-family: Georgia, serif;
    font-size: 39px;
}

.portal-metric-card small {
    color: var(--mizan-green-700);
    font-weight: 700;
}

.portal-dashboard-grid {
    display: grid;
    align-items: start;
    gap: 22px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.portal-request-row,
.portal-conversation-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 14px 0;
    border-bottom: 1px solid var(--mizan-border);
}

.portal-request-row:last-child,
.portal-conversation-row:last-child {
    border-bottom: 0;
}

.portal-request-row > div,
.portal-conversation-row > div {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.portal-request-row span,
.portal-conversation-row span,
.portal-request-row time,
.portal-conversation-row small {
    overflow: hidden;
    color: var(--mizan-muted);
    font-size: 10px;
    text-overflow: ellipsis;
}

.portal-message-layout {
    display: grid;
    align-items: start;
    gap: 22px;
    grid-template-columns:
        minmax(0, 1.55fr)
        minmax(300px, 0.75fr);
}

.portal-conversation-list {
    display: flex;
    flex-direction: column;
}

.portal-conversation-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 15px 0;
    border-bottom: 1px solid var(--mizan-border);
}

.portal-conversation-card:last-child {
    border-bottom: 0;
}

.portal-conversation-card > div {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.portal-conversation-card span,
.portal-conversation-card small,
.portal-conversation-card time {
    overflow: hidden;
    color: var(--mizan-muted);
    font-size: 10px;
    text-overflow: ellipsis;
}

.portal-chat-panel {
    padding: 23px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-md);
    background: var(--mizan-white);
    box-shadow: var(--shadow-sm);
}

.portal-chat-messages {
    display: flex;
    min-height: 300px;
    flex-direction: column;
    gap: 14px;
    margin-bottom: 20px;
}

.portal-chat-message {
    width: min(78%, 720px);
    padding: 14px 16px;
    border-radius: 16px;
}

.portal-chat-message--own {
    align-self: flex-end;
    border-bottom-right-radius: 4px;
    background: var(--mizan-green-100);
}

.portal-chat-message--office,
.portal-chat-message--client {
    align-self: flex-start;
    border-bottom-left-radius: 4px;
    background: var(--mizan-cream-100);
}

.portal-chat-message__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 6px;
}

.portal-chat-message__header time {
    color: var(--mizan-muted);
    font-size: 9px;
}

.portal-chat-message p {
    margin: 0;
    color: var(--mizan-text);
    white-space: pre-wrap;
}

.portal-chat-form {
    display: grid;
    align-items: end;
    gap: 12px;
    padding-top: 18px;
    border-top: 1px solid var(--mizan-border);
    grid-template-columns: minmax(0, 1fr) auto;
}

.portal-chat-form textarea {
    min-height: 100px;
}

.portal-close-form {
    margin-top: 12px;
    text-align: right;
}

.portal-document-sections {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.portal-document-request-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.portal-document-request {
    padding: 17px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-sm);
    background: var(--mizan-cream-50);
}

.portal-document-request__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 13px;
}

.portal-document-request__header > div {
    display: flex;
    flex-direction: column;
}

.portal-document-request__header span {
    color: var(--mizan-muted);
    font-size: 10px;
}

.portal-appointment-card {
    margin-bottom: 14px;
    padding: 17px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-sm);
    background: var(--mizan-cream-50);
}

.portal-appointment-card:last-child {
    margin-bottom: 0;
}

.portal-appointment-card__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}

.portal-appointment-card__header > div {
    display: flex;
    flex-direction: column;
}

.portal-appointment-card__header span {
    color: var(--mizan-muted);
    font-size: 10px;
}

.portal-time-options,
.portal-confirmed-time {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 13px;
}

.portal-time-options span {
    padding: 6px 10px;
    border-radius: 999px;
    color: var(--mizan-green-800);
    background: var(--mizan-green-100);
    font-size: 10px;
}

.portal-confirmed-time {
    flex-direction: column;
    padding: 13px;
    border-radius: var(--radius-sm);
    color: var(--mizan-success);
    background: var(--mizan-success-soft);
}

.portal-review-form {
    display: grid;
    gap: 10px;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--mizan-border);
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.portal-review-form textarea,
.portal-review-form button {
    grid-column: 1 / -1;
}

.portal-invitation-page {
    display: flex;
    min-height: 100vh;
    align-items: center;
    justify-content: center;
    padding: 30px 18px;
    background:
        radial-gradient(
            circle at top left,
            rgba(196, 163, 99, 0.16),
            transparent 32%
        ),
        var(--mizan-cream-100);
}

.portal-invitation-card {
    width: 100%;
    max-width: 720px;
    padding: 40px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-lg);
    background: var(--mizan-white);
    box-shadow: var(--shadow-md);
}

.portal-invitation-card__content {
    margin-top: 40px;
}

@media (max-width: 1180px) {
    .portal-metrics {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .portal-dashboard-grid,
    .portal-message-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .portal-shell {
        display: block;
    }

    .portal-sidebar {
        z-index: 70;
        transform: translateX(-100%);
        transition: transform 0.25s ease;
    }

    .portal-content {
        padding: 28px 20px;
    }

    .portal-topbar {
        padding: 0 16px;
    }

    .portal-topbar__actions select {
        min-width: 160px;
        max-width: 220px;
    }
}

@media (max-width: 650px) {
    .portal-metrics {
        grid-template-columns: 1fr;
    }

    .portal-content {
        padding: 22px 14px;
    }

    .portal-topbar__actions select,
    .portal-topbar .active-profile {
        display: none;
    }

    .portal-chat-message {
        width: 92%;
    }

    .portal-chat-form {
        grid-template-columns: 1fr;
    }

    .portal-document-request__header,
    .portal-appointment-card__header,
    .portal-conversation-card,
    .portal-request-row,
    .portal-conversation-row {
        align-items: flex-start;
        flex-direction: column;
    }

    .portal-review-form {
        grid-template-columns: 1fr;
    }

    .portal-review-form textarea,
    .portal-review-form button {
        grid-column: auto;
    }

    .portal-invitation-card {
        padding: 27px 20px;
    }
}

/* ---- MIZAN Mastercode CSS-Erweiterung ---- */

.global-search {
    position: relative;
    display: flex;
    width: min(520px, 42vw);
    align-items: center;
    gap: 9px;
}

.global-search__icon {
    position: absolute;
    left: 13px;
    z-index: 2;
    color: var(--mizan-muted);
    pointer-events: none;
}

.global-search input {
    width: 100%;
    height: 42px;
    padding: 0 68px 0 38px;
    border: 1px solid var(--mizan-border);
    border-radius: 999px;
    background: var(--mizan-cream-50);
}

.global-search input:focus {
    border-color: var(--mizan-gold-500);
    background: var(--mizan-white);
    box-shadow:
        0 0 0 3px
        rgba(196, 163, 99, 0.13);
}

.global-search kbd {
    position: absolute;
    right: 12px;
    padding: 3px 6px;
    border: 1px solid var(--mizan-border);
    border-radius: 5px;
    color: var(--mizan-muted);
    background: var(--mizan-white);
    font-family: inherit;
    font-size: 9px;
}

.global-search-suggestions {
    position: absolute;
    z-index: 100;
    top: calc(100% + 9px);
    right: 0;
    left: 0;
    overflow: hidden;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-md);
    background: var(--mizan-white);
    box-shadow: var(--shadow-md);
}

.global-search-suggestion {
    display: grid;
    align-items: center;
    gap: 11px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--mizan-border);
    grid-template-columns:
        34px
        minmax(0, 1fr)
        auto;
}

.global-search-suggestion:last-child {
    border-bottom: 0;
}

.global-search-suggestion:hover {
    background: var(--mizan-cream-50);
}

.global-search-suggestion__icon {
    display: inline-flex;
    width: 32px;
    height: 32px;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    color: var(--mizan-green-900);
    background: var(--mizan-green-100);
}

.global-search-suggestion__body {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.global-search-suggestion__body strong,
.global-search-suggestion__body small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.global-search-suggestion__body small {
    color: var(--mizan-muted);
    font-size: 9px;
}

.global-search-suggestions__empty {
    padding: 18px;
    color: var(--mizan-muted);
    text-align: center;
}

.search-page {
    display: grid;
    align-items: start;
    gap: 22px;
    grid-template-columns:
        minmax(0, 1.6fr)
        minmax(290px, 0.55fr);
}

.search-page__sidebar {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.search-page-form {
    display: grid;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
    grid-template-columns:
        minmax(0, 1fr)
        190px
        auto;
}

.search-page-form__query {
    position: relative;
}

.search-page-form__query span {
    position: absolute;
    top: 50%;
    left: 14px;
    color: var(--mizan-muted);
    transform: translateY(-50%);
}

.search-page-form__query input {
    width: 100%;
    padding-left: 40px;
}

.search-result-summary {
    display: flex;
    gap: 7px;
    margin-bottom: 15px;
    color: var(--mizan-muted);
}

.search-result-summary strong {
    color: var(--mizan-green-950);
}

.search-result-list {
    display: flex;
    flex-direction: column;
}

.search-result-card {
    position: relative;
    display: flex;
    align-items: stretch;
    border-bottom: 1px solid var(--mizan-border);
}

.search-result-card:last-child {
    border-bottom: 0;
}

.search-result-card__link {
    display: grid;
    min-width: 0;
    flex: 1;
    align-items: center;
    gap: 14px;
    padding: 15px 50px 15px 0;
    grid-template-columns:
        42px
        minmax(0, 1fr)
        auto;
}

.search-result-card__link:hover
.search-result-card__body > strong {
    color: var(--mizan-gold-700);
}

.search-result-card__icon {
    display: inline-flex;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    color: var(--mizan-green-900);
    background: var(--mizan-green-100);
    font-size: 17px;
}

.search-result-card__body {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.search-result-card__type {
    margin-bottom: 3px;
    color: var(--mizan-gold-700);
    font-size: 8px;
    font-weight: 750;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.search-result-card__body strong,
.search-result-card__body small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.search-result-card__body small {
    color: var(--mizan-muted);
    font-size: 10px;
}

.search-result-card__favorite {
    position: absolute;
    top: 50%;
    right: 5px;
    transform: translateY(-50%);
}

.search-result-card__favorite button {
    display: inline-flex;
    width: 36px;
    height: 36px;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 50%;
    color: var(--mizan-gold-700);
    background: transparent;
    font-size: 21px;
    cursor: pointer;
}

.search-result-card__favorite button:hover {
    background: var(--mizan-cream-100);
}

.recent-search-list {
    display: flex;
    flex-direction: column;
}

.recent-search-row {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 10px 0;
    border-bottom: 1px solid var(--mizan-border);
}

.recent-search-row:last-child {
    border-bottom: 0;
}

.recent-search-row > span {
    color: var(--mizan-gold-700);
}

.recent-search-row > div {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.recent-search-row strong,
.recent-search-row small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.recent-search-row small {
    color: var(--mizan-muted);
    font-size: 9px;
}

.workspace-grid {
    display: grid;
    align-items: start;
    gap: 22px;
    margin-bottom: 22px;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
}

.workspace-grid--compact {
    gap: 14px;
}

.workspace-grid--compact
.workspace-item,
.workspace-grid--compact
.saved-view-row,
.workspace-grid--compact
.recent-search-row {
    padding-top: 8px;
    padding-bottom: 8px;
}

.workspace-widget {
    min-width: 0;
}

.workspace-item-list {
    display: flex;
    flex-direction: column;
}

.workspace-item {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 12px 0;
    border-bottom: 1px solid var(--mizan-border);
}

.workspace-item:last-child {
    border-bottom: 0;
}

.workspace-item--link {
    display: grid;
    grid-template-columns:
        36px
        minmax(0, 1fr)
        auto;
}

.workspace-item__link {
    display: grid;
    min-width: 0;
    flex: 1;
    align-items: center;
    gap: 11px;
    grid-template-columns:
        36px
        minmax(0, 1fr);
}

.workspace-item__icon {
    display: inline-flex;
    width: 34px;
    height: 34px;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    color: var(--mizan-green-900);
    background: var(--mizan-green-100);
}

.workspace-item__body {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.workspace-item__body strong,
.workspace-item__body small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.workspace-item__body small,
.workspace-item__meta {
    color: var(--mizan-muted);
    font-size: 9px;
}

.workspace-item__remove {
    border: 0;
    color: var(--mizan-muted);
    background: transparent;
    font-size: 20px;
    cursor: pointer;
}

.saved-view-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 13px;
    padding: 11px 0;
    border-bottom: 1px solid var(--mizan-border);
}

.saved-view-row:last-child {
    border-bottom: 0;
}

.saved-view-row__link {
    display: flex;
    min-width: 0;
    flex: 1;
    align-items: center;
    gap: 10px;
}

.saved-view-row__link > span {
    color: var(--mizan-gold-700);
}

.saved-view-row__link > div {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.saved-view-row__link small {
    color: var(--mizan-muted);
    font-size: 9px;
}

.saved-view-row__actions {
    display: flex;
    gap: 5px;
}

.workspace-settings {
    margin-top: 22px;
}

.workspace-settings-form {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.workspace-order-list {
    display: grid;
    gap: 10px;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
}

.workspace-order-row {
    display: grid;
    align-items: center;
    gap: 10px;
    padding: 12px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-sm);
    background: var(--mizan-cream-50);
    grid-template-columns:
        auto
        minmax(0, 1fr)
        auto;
}

@media (max-width: 1100px) {
    .search-page {
        grid-template-columns: 1fr;
    }

    .workspace-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 850px) {
    .global-search {
        width: min(360px, 40vw);
    }

    .global-search kbd {
        display: none;
    }

    .global-search input {
        padding-right: 15px;
    }

    .search-page-form {
        grid-template-columns: 1fr;
    }

    .workspace-order-list {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 650px) {
    .global-search {
        display: none;
    }

    .search-result-card__link {
        align-items: flex-start;
        grid-template-columns:
            40px
            minmax(0, 1fr);
    }

    .search-result-card__link
    > .status-badge {
        grid-column: 2;
        justify-self: start;
    }

    .workspace-item--link {
        align-items: flex-start;
        grid-template-columns:
            34px
            minmax(0, 1fr);
    }

    .workspace-item__meta {
        grid-column: 2;
    }

    .saved-view-row {
        align-items: flex-start;
        flex-direction: column;
    }

    .workspace-order-row {
        grid-template-columns:
            auto
            minmax(0, 1fr);
    }

    .workspace-order-row
    > .checkbox-row {
        grid-column: 2;
    }
}


/* ---- MIZAN Mastercode CSS-Zusatzblock 197 ---- */

.filter-bar--tasks {
    grid-template-columns:
        minmax(260px, 1fr)
        minmax(160px, 210px)
        minmax(160px, 210px)
        auto
        auto;
}

.task-board {
    display: flex;
    flex-direction: column;
}

.task-row {
    display: grid;
    align-items: center;
    gap: 16px;
    padding: 15px 4px;
    border-bottom: 1px solid var(--mizan-border);
    grid-template-columns:
        92px
        minmax(220px, 1fr)
        minmax(160px, 230px)
        auto;
}

.task-row:hover {
    background: var(--mizan-cream-50);
}

.task-row__body,
.task-row__assignee {
    display: flex;
    flex-direction: column;
}

.task-row__body span,
.task-row__assignee span,
.task-row__assignee small {
    color: var(--mizan-muted);
    font-size: 11px;
}

.task-priority {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 5px 9px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 750;
}

.task-priority--low,
.task-priority--normal {
    color: var(--mizan-success);
    background: var(--mizan-success-soft);
}

.task-priority--high {
    color: var(--mizan-warning);
    background: var(--mizan-warning-soft);
}

.task-priority--urgent,
.task-priority--critical {
    color: var(--mizan-danger);
    background: var(--mizan-danger-soft);
}

.calendar-filter {
    display: grid;
    align-items: center;
    gap: 12px;
    grid-template-columns:
        160px
        160px
        minmax(190px, 1fr)
        auto
        auto;
}

.calendar-agenda {
    display: flex;
    flex-direction: column;
    gap: 19px;
    margin-top: 20px;
}

.agenda-day {
    overflow: hidden;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-md);
    background: var(--mizan-white);
    box-shadow: var(--shadow-sm);
}

.agenda-day__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px 19px;
    border-bottom: 1px solid var(--mizan-border);
    background: var(--mizan-cream-50);
}

.agenda-day__header span {
    color: var(--mizan-muted);
    font-size: 11px;
}

.agenda-day__events {
    display: flex;
    flex-direction: column;
}

.calendar-event {
    display: grid;
    align-items: center;
    gap: 18px;
    padding: 16px 19px;
    border-bottom: 1px solid var(--mizan-border);
    border-left: 4px solid var(--mizan-green-700);
    grid-template-columns: 125px minmax(0, 1fr) auto;
}

.calendar-event:last-child {
    border-bottom: 0;
}

.calendar-event:hover {
    background: var(--mizan-cream-50);
}

.calendar-event > div {
    display: flex;
    flex-direction: column;
}

.calendar-event time {
    color: var(--mizan-green-900);
    font-weight: 750;
}

.calendar-event span,
.calendar-event small {
    color: var(--mizan-muted);
    font-size: 11px;
}

.calendar-event--court_hearing {
    border-left-color: var(--mizan-danger);
}

.calendar-event--client_meeting {
    border-left-color: var(--mizan-gold-600);
}

.calendar-event--travel,
.calendar-event--ride,
.calendar-event--stay {
    border-left-color: #4274a8;
}

.escalation-row {
    display: grid;
    align-items: center;
    gap: 15px;
    padding: 12px 0;
    border-bottom: 1px solid var(--mizan-border);
    grid-template-columns: 130px minmax(0, 1fr) auto;
}

.escalation-row:last-child {
    border-bottom: 0;
}

@media (max-width: 1050px) {
    .filter-bar--tasks,
    .calendar-filter {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .task-row {
        grid-template-columns: 90px minmax(0, 1fr);
    }

    .task-row__assignee {
        grid-column: 2;
    }
}

@media (max-width: 700px) {
    .filter-bar--tasks,
    .calendar-filter {
        grid-template-columns: 1fr;
    }

    .task-row {
        align-items: flex-start;
        grid-template-columns: 1fr;
    }

    .task-row__assignee {
        grid-column: auto;
    }

    .calendar-event {
        align-items: flex-start;
        grid-template-columns: 1fr;
    }

    .escalation-row {
        grid-template-columns: 1fr;
    }
}


/* ---- MIZAN Mastercode CSS-Zusatzblock 398 ---- */

.finance-metrics {
    display: grid;
    gap: 15px;
    margin-bottom: 22px;
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.finance-metric {
    display: flex;
    min-height: 135px;
    flex-direction: column;
    justify-content: space-between;
    padding: 20px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-md);
    background: var(--mizan-white);
    box-shadow: var(--shadow-sm);
}

.finance-metric span {
    color: var(--mizan-muted);
    font-size: 11px;
    font-weight: 650;
}

.finance-metric strong {
    color: var(--mizan-green-950);
    font-family: Georgia, serif;
    font-size: 24px;
}

.finance-metric--danger strong {
    color: var(--mizan-danger);
}

.finance-dashboard-grid {
    display: grid;
    align-items: start;
    gap: 22px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.finance-record-row {
    display: grid;
    align-items: center;
    gap: 16px;
    padding: 14px 0;
    border-bottom: 1px solid var(--mizan-border);
    grid-template-columns:
        minmax(0, 1fr)
        auto
        auto;
}

.finance-record-row:last-child {
    border-bottom: 0;
}

.finance-record-row > div {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.finance-record-row span,
.finance-record-row small {
    color: var(--mizan-muted);
    font-size: 10px;
}

.finance-filter {
    display: grid;
    align-items: center;
    gap: 12px;
    margin-bottom: 22px;
    grid-template-columns:
        minmax(260px, 1fr)
        minmax(190px, 0.6fr)
        170px
        auto;
}

.invoice-activity-selection {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.invoice-activity-option {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    padding: 15px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-sm);
    background: var(--mizan-cream-50);
    cursor: pointer;
}

.invoice-activity-option:has(input:checked) {
    border-color: var(--mizan-gold-500);
    background: var(--mizan-green-100);
}

.invoice-activity-option > div {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.invoice-activity-option span,
.invoice-activity-option small {
    color: var(--mizan-muted);
    font-size: 10px;
}

.invoice-detail-grid {
    display: grid;
    align-items: start;
    gap: 22px;
    grid-template-columns:
        minmax(0, 1.7fr)
        minmax(290px, 0.6fr);
}

.invoice-detail-main,
.invoice-detail-sidebar {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 22px;
}

.invoice-detail-sidebar {
    position: sticky;
    top: calc(var(--topbar-height) + 22px);
}

.invoice-parties {
    display: grid;
    gap: 25px;
    margin-bottom: 28px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.invoice-parties > div {
    padding: 17px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-sm);
    background: var(--mizan-cream-50);
}

.invoice-parties p {
    margin-bottom: 0;
    color: var(--mizan-muted);
    white-space: pre-line;
}

.invoice-totals {
    width: min(100%, 450px);
    margin-top: 25px;
    margin-left: auto;
}

.invoice-totals > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 9px 0;
    border-bottom: 1px solid var(--mizan-border);
}

.invoice-totals__grand {
    color: var(--mizan-green-950);
    font-size: 16px;
}

.invoice-totals__open {
    color: var(--mizan-gold-700);
    font-size: 17px;
}

.portal-invoice-list {
    display: flex;
    flex-direction: column;
}

.portal-invoice-card {
    display: grid;
    align-items: center;
    gap: 18px;
    padding: 16px 0;
    border-bottom: 1px solid var(--mizan-border);
    grid-template-columns:
        minmax(0, 1fr)
        auto
        auto;
}

.portal-invoice-card:last-child {
    border-bottom: 0;
}

.portal-invoice-card > div {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.portal-invoice-card span,
.portal-invoice-card small {
    color: var(--mizan-muted);
    font-size: 10px;
}

@media (max-width: 1250px) {
    .finance-metrics {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 1050px) {
    .finance-dashboard-grid,
    .invoice-detail-grid {
        grid-template-columns: 1fr;
    }

    .invoice-detail-sidebar {
        position: static;
    }

    .finance-filter {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 750px) {
    .finance-metrics {
        grid-template-columns: 1fr;
    }

    .finance-filter {
        grid-template-columns: 1fr;
    }

    .finance-record-row,
    .portal-invoice-card {
        align-items: flex-start;
        grid-template-columns: 1fr;
    }

    .invoice-parties {
        grid-template-columns: 1fr;
    }
}


/* ---- MIZAN Mastercode CSS-Zusatzblock 501 ---- */

.notification-nav-badge {
    display: inline-flex;
    min-width: 21px;
    height: 21px;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    padding: 0 6px;
    border-radius: 999px;
    color: #ffffff;
    background: var(--mizan-gold-700);
    font-size: 9px;
    font-weight: 750;
}

.notification-nav-badge--critical {
    background: var(--mizan-danger);
}

.topbar-notification-button {
    position: relative;
    display: inline-flex;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--mizan-border);
    border-radius: 50%;
    color: var(--mizan-green-900);
    background: var(--mizan-white);
    font-size: 17px;
}

.topbar-notification-button strong {
    position: absolute;
    top: -4px;
    right: -5px;
    display: inline-flex;
    min-width: 18px;
    height: 18px;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    border: 2px solid var(--mizan-white);
    border-radius: 999px;
    color: #ffffff;
    background: var(--mizan-danger);
    font-size: 8px;
}

.notification-statistics {
    display: grid;
    gap: 15px;
    margin-bottom: 22px;
    grid-template-columns:
        repeat(2, minmax(0, 240px));
}

.notification-statistics article {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 18px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-md);
    background: var(--mizan-white);
    box-shadow: var(--shadow-sm);
}

.notification-statistics span {
    color: var(--mizan-muted);
    font-size: 10px;
    font-weight: 650;
}

.notification-statistics strong {
    color: var(--mizan-green-950);
    font-family: Georgia, serif;
    font-size: 27px;
}

.notification-statistic--critical strong {
    color: var(--mizan-danger);
}

.notification-filter {
    display: grid;
    align-items: center;
    gap: 12px;
    margin-bottom: 22px;
    grid-template-columns:
        repeat(3, minmax(150px, 1fr))
        auto;
}

.notification-list {
    display: flex;
    flex-direction: column;
}

.notification-card {
    display: grid;
    align-items: flex-start;
    gap: 16px;
    padding: 19px 0;
    border-bottom: 1px solid var(--mizan-border);
    grid-template-columns:
        46px
        minmax(0, 1fr)
        auto;
}

.notification-card:last-child {
    border-bottom: 0;
}

.notification-card--unread {
    padding-right: 15px;
    padding-left: 15px;
    border-radius: var(--radius-sm);
    background: var(--mizan-cream-50);
}

.notification-card--critical {
    border-left: 4px solid var(--mizan-danger);
    padding-left: 15px;
}

.notification-card__icon {
    display: inline-flex;
    width: 44px;
    height: 44px;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    color: var(--mizan-green-900);
    background: var(--mizan-green-100);
    font-size: 18px;
}

.notification-card--critical
.notification-card__icon {
    color: var(--mizan-danger);
    background: rgba(165, 49, 49, 0.1);
}

.notification-card__body h2 {
    margin: 5px 0 8px;
    font-family: Georgia, serif;
    font-size: 18px;
}

.notification-card__body p {
    margin: 0 0 9px;
    color: var(--mizan-muted);
    line-height: 1.65;
    white-space: pre-line;
}

.notification-card__body small {
    color: var(--mizan-muted);
}

.notification-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.notification-card__meta span {
    padding: 4px 7px;
    border-radius: 999px;
    color: var(--mizan-muted);
    background: var(--mizan-cream-100);
    font-size: 8px;
    font-weight: 650;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.notification-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
}

.notification-preference-grid {
    display: grid;
    gap: 18px;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
}

.notification-preference-card__header {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 20px;
}

.notification-preference-card__header > span {
    display: inline-flex;
    width: 43px;
    height: 43px;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    color: var(--mizan-green-900);
    background: var(--mizan-green-100);
    font-size: 18px;
}

.notification-preference-card__header h2 {
    margin: 0;
}

.notification-preference-card__header small {
    color: var(--mizan-muted);
}

.notification-channel-options {
    display: grid;
    gap: 8px;
    margin-bottom: 18px;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
}

.sticky-form-actions {
    position: sticky;
    z-index: 20;
    bottom: 15px;
    display: flex;
    justify-content: flex-end;
    margin-top: 22px;
    padding: 15px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.94);
    box-shadow: var(--shadow-md);
    backdrop-filter: blur(10px);
}

.notification-admin-grid {
    display: grid;
    align-items: start;
    gap: 22px;
    grid-template-columns:
        minmax(0, 1.6fr)
        minmax(310px, 0.65fr);
}

.notification-admin-main {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.escalation-rule-row,
.delivery-failure-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 17px;
    padding: 14px 0;
    border-bottom: 1px solid var(--mizan-border);
}

.escalation-rule-row:last-child,
.delivery-failure-row:last-child {
    border-bottom: 0;
}

.escalation-rule-row > div,
.delivery-failure-row > div {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.escalation-rule-row > div:last-child {
    align-items: flex-end;
    gap: 7px;
}

.escalation-rule-row span,
.escalation-rule-row small,
.delivery-failure-row span,
.delivery-failure-row small {
    color: var(--mizan-muted);
    font-size: 10px;
}

.delivery-failure-row small {
    overflow: hidden;
    max-width: 650px;
    color: var(--mizan-danger);
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .notification-admin-grid {
        grid-template-columns: 1fr;
    }

    .notification-preference-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 800px) {
    .notification-filter {
        grid-template-columns: 1fr;
    }

    .notification-channel-options {
        grid-template-columns: 1fr;
    }

    .notification-card {
        grid-template-columns:
            44px
            minmax(0, 1fr);
    }

    .notification-card__state {
        grid-column: 2;
    }
}

@media (max-width: 600px) {
    .notification-statistics {
        grid-template-columns: 1fr;
    }

    .escalation-rule-row,
    .delivery-failure-row {
        align-items: flex-start;
        flex-direction: column;
    }
}


/* ---- MIZAN Mastercode CSS-Zusatzblock 570 ---- */

.language-switcher {
    position: relative;
}

.language-switcher__button {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    gap: 8px;
    padding: 0 12px;
    border: 1px solid var(--mizan-border);
    border-radius: 999px;
    color: var(--mizan-green-950);
    background: var(--mizan-white);
    cursor: pointer;
}

.language-switcher__code {
    display: inline-flex;
    min-width: 27px;
    height: 27px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: var(--mizan-white);
    background: var(--mizan-green-800);
    font-size: 8px;
    font-weight: 800;
}

.language-switcher__menu {
    position: absolute;
    z-index: 150;
    top: calc(100% + 8px);
    right: 0;
    overflow: hidden;
    width: 220px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-md);
    background: var(--mizan-white);
    box-shadow: var(--shadow-md);
}

[dir="rtl"] .language-switcher__menu {
    right: auto;
    left: 0;
}

.language-switcher__menu form {
    margin: 0;
}

.language-switcher__option {
    display: grid;
    width: 100%;
    align-items: center;
    gap: 11px;
    padding: 12px 14px;
    border: 0;
    border-bottom: 1px solid var(--mizan-border);
    color: var(--mizan-green-950);
    background: transparent;
    text-align: start;
    cursor: pointer;
    grid-template-columns: 35px minmax(0, 1fr);
}

.language-switcher__option:hover,
.language-switcher__option--active {
    background: var(--mizan-cream-100);
}

.language-switcher__option > span {
    color: var(--mizan-gold-700);
    font-size: 9px;
    font-weight: 800;
}

.localization-settings-grid {
    display: grid;
    align-items: start;
    gap: 22px;
    grid-template-columns:
        minmax(0, 1.4fr)
        minmax(300px, 0.6fr);
}

.locale-checkbox-grid {
    display: grid;
    gap: 11px;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
}

.locale-checkbox {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-sm);
    background: var(--mizan-cream-50);
}

.locale-checkbox > span {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.locale-checkbox small {
    color: var(--mizan-muted);
    font-size: 9px;
}

.translation-filter {
    display: grid;
    gap: 12px;
    margin-bottom: 22px;
    grid-template-columns:
        minmax(250px, 1fr)
        180px
        auto;
}

.translation-list {
    display: flex;
    flex-direction: column;
}

.translation-row {
    display: grid;
    align-items: flex-start;
    gap: 15px;
    padding: 16px 0;
    border-bottom: 1px solid var(--mizan-border);
    grid-template-columns:
        48px
        minmax(0, 1fr)
        auto;
}

.translation-row:last-child {
    border-bottom: 0;
}

.translation-row__locale {
    display: inline-flex;
    width: 45px;
    height: 45px;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    color: var(--mizan-white);
    background: var(--mizan-green-800);
    font-size: 9px;
}

.translation-row__body {
    min-width: 0;
}

.translation-row__body code {
    display: inline-block;
    margin-bottom: 8px;
    padding: 4px 7px;
    border-radius: 5px;
    color: var(--mizan-gold-700);
    background: var(--mizan-cream-100);
    font-size: 10px;
}

.translation-row__body p {
    margin: 0 0 5px;
    white-space: pre-line;
}

.translation-row__body small {
    color: var(--mizan-muted);
}

.translation-row__actions {
    display: flex;
    align-items: center;
    gap: 7px;
}

/* RTL-Grundstruktur */

[dir="rtl"] body {
    text-align: right;
}

[dir="rtl"] .sidebar {
    right: 0;
    left: auto;
}

[dir="rtl"] .main-content {
    margin-right: var(--sidebar-width);
    margin-left: 0;
}

[dir="rtl"] .sidebar-link__icon {
    margin-right: 0;
    margin-left: 8px;
}

[dir="rtl"] .notification-nav-badge {
    margin-right: auto;
    margin-left: 0;
}

[dir="rtl"] .back-link {
    direction: rtl;
}

[dir="rtl"] input,
[dir="rtl"] textarea,
[dir="rtl"] select {
    text-align: right;
}

[dir="rtl"] input[type="email"],
[dir="rtl"] input[type="url"],
[dir="rtl"] input[type="tel"],
[dir="rtl"] input[type="number"],
[dir="rtl"] code {
    direction: ltr;
    text-align: left;
}

[dir="rtl"] .global-search__icon {
    right: 13px;
    left: auto;
}

[dir="rtl"] .global-search input {
    padding-right: 38px;
    padding-left: 68px;
}

[dir="rtl"] .global-search kbd {
    right: auto;
    left: 12px;
}

[dir="rtl"] .search-result-card__favorite {
    right: auto;
    left: 5px;
}

[dir="rtl"] .search-result-card__link {
    padding-right: 0;
    padding-left: 50px;
}

[dir="rtl"] .notification-card--critical {
    padding-right: 15px;
    padding-left: 0;
    border-right: 4px solid var(--mizan-danger);
    border-left: 0;
}

[dir="rtl"] .invoice-totals {
    margin-right: auto;
    margin-left: 0;
}

[dir="rtl"] .role-layout__sidebar,
[dir="rtl"] .invoice-detail-sidebar {
    direction: rtl;
}

[dir="rtl"] .data-table th,
[dir="rtl"] .data-table td {
    text-align: right;
}

[dir="rtl"] .amount,
[dir="rtl"] .invoice-items-table td:last-child {
    direction: ltr;
}

@media (max-width: 1050px) {
    .localization-settings-grid {
        grid-template-columns: 1fr;
    }

    [dir="rtl"] .main-content {
        margin-right: 0;
    }
}

@media (max-width: 700px) {
    .locale-checkbox-grid,
    .translation-filter {
        grid-template-columns: 1fr;
    }

    .translation-row {
        grid-template-columns:
            45px
            minmax(0, 1fr);
    }

    .translation-row__actions {
        grid-column: 2;
        flex-wrap: wrap;
    }
}


/* ---- MIZAN Mastercode CSS-Zusatzblock 630 ---- */

.control-center-metrics {
    display: grid;
    gap: 15px;
    margin-bottom: 22px;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));
}

.control-center-metrics article {
    display: flex;
    min-height: 125px;
    flex-direction: column;
    justify-content: space-between;
    padding: 19px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-md);
    background: var(--mizan-white);
    box-shadow: var(--shadow-sm);
}

.control-center-metrics span {
    color: var(--mizan-muted);
    font-size: 10px;
    font-weight: 650;
}

.control-center-metrics strong {
    color: var(--mizan-green-950);
    font-family: Georgia, serif;
    font-size: 27px;
}

.control-center-metric--warning strong {
    color: var(--mizan-gold-700);
}

.control-center-metric--danger strong {
    color: var(--mizan-danger);
}

.control-center-grid {
    display: grid;
    align-items: start;
    gap: 22px;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
}

.control-center-row {
    display: grid;
    min-width: 0;
    align-items: center;
    gap: 15px;
    padding: 13px 0;
    border-bottom: 1px solid var(--mizan-border);
    grid-template-columns:
        minmax(0, 1fr)
        auto
        auto;
}

.control-center-row:last-child {
    border-bottom: 0;
}

.control-center-row > div:first-child {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.control-center-row span,
.control-center-row small {
    color: var(--mizan-muted);
    font-size: 9px;
}

.control-center-filter {
    display: grid;
    align-items: center;
    gap: 12px;
    margin-bottom: 22px;
    grid-template-columns:
        minmax(260px, 1fr)
        minmax(180px, 0.45fr)
        minmax(190px, 0.5fr)
        auto;
}

.control-center-detail-grid {
    display: grid;
    align-items: start;
    gap: 22px;
    grid-template-columns:
        minmax(0, 1.6fr)
        minmax(310px, 0.6fr);
}

.control-center-detail-main,
.control-center-detail-sidebar {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 22px;
}

.control-center-detail-sidebar {
    position: sticky;
    top: calc(var(--topbar-height) + 22px);
}

.platform-note {
    padding: 15px 0;
    border-bottom: 1px solid var(--mizan-border);
}

.platform-note > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.platform-note span {
    color: var(--mizan-muted);
    font-size: 9px;
}

.platform-note p {
    margin: 9px 0 0;
    line-height: 1.65;
    white-space: pre-line;
}

.security-notice {
    padding: 15px;
    border: 1px solid rgba(159, 119, 42, 0.3);
    border-radius: var(--radius-sm);
    color: var(--mizan-gold-700);
    background: rgba(196, 163, 99, 0.1);
    line-height: 1.6;
}

.support-session-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 22px;
    padding: 17px 20px;
    border: 1px solid rgba(42, 121, 93, 0.3);
    border-radius: var(--radius-md);
    color: var(--mizan-green-950);
    background: var(--mizan-green-100);
}

.support-session-banner > div {
    display: flex;
    flex-direction: column;
}

.support-session-banner span {
    margin-top: 4px;
    color: var(--mizan-muted);
    font-size: 10px;
}

.audit-filter {
    display: grid;
    align-items: center;
    gap: 10px;
    margin-bottom: 22px;
    grid-template-columns:
        minmax(220px, 1fr)
        minmax(170px, 0.6fr)
        minmax(190px, 0.6fr)
        150px
        150px
        auto;
}

.audit-log-list {
    display: flex;
    flex-direction: column;
}

.audit-log-row {
    display: grid;
    align-items: flex-start;
    gap: 16px;
    padding: 16px 0;
    border-bottom: 1px solid var(--mizan-border);
    grid-template-columns:
        105px
        minmax(0, 1fr)
        190px;
}

.audit-log-row:last-child {
    border-bottom: 0;
}

.audit-log-row__time,
.audit-log-row__body,
.audit-log-row__actor {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.audit-log-row span {
    color: var(--mizan-muted);
    font-size: 9px;
}

.audit-log-row pre {
    overflow: auto;
    max-height: 240px;
    margin: 9px 0 0;
    padding: 12px;
    border-radius: var(--radius-sm);
    color: var(--mizan-green-950);
    background: var(--mizan-cream-100);
    font-size: 10px;
    white-space: pre-wrap;
    word-break: break-word;
}

@media (max-width: 1200px) {
    .control-center-metrics {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .audit-filter {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1000px) {
    .control-center-grid,
    .control-center-detail-grid {
        grid-template-columns: 1fr;
    }

    .control-center-detail-sidebar {
        position: static;
    }

    .control-center-filter {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .control-center-metrics,
    .control-center-filter,
    .audit-filter {
        grid-template-columns: 1fr;
    }

    .control-center-row {
        align-items: flex-start;
        grid-template-columns: 1fr;
    }

    .support-session-banner {
        align-items: flex-start;
        flex-direction: column;
    }

    .audit-log-row {
        grid-template-columns: 1fr;
    }
}


/* ---- MIZAN Mastercode CSS-Zusatzblock 866 ---- */

.communication-filter {
    display: grid;
    align-items: center;
    gap: 12px;
    margin-bottom: 22px;
    grid-template-columns:
        minmax(260px, 1fr)
        minmax(170px, 0.45fr)
        minmax(160px, 0.4fr)
        auto;
}

.communication-thread-list {
    display: flex;
    flex-direction: column;
}

.communication-thread-row {
    display: grid;
    align-items: center;
    gap: 15px;
    padding: 17px 0;
    border-bottom: 1px solid var(--mizan-border);
    color: inherit;
    text-decoration: none;
    grid-template-columns:
        46px
        minmax(0, 1fr)
        auto;
}

.communication-thread-row:last-child {
    border-bottom: 0;
}

.communication-thread-row:hover
.communication-thread-row__body strong {
    color: var(--mizan-gold-700);
}

.communication-thread-row__channel {
    display: flex;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    color: var(--mizan-white);
    background: var(--mizan-green-800);
    font-size: 18px;
}

.communication-thread-row__body {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.communication-thread-row__body strong,
.communication-thread-row__body span,
.communication-thread-row__body small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.communication-thread-row__body span,
.communication-thread-row__body small {
    color: var(--mizan-muted);
    font-size: 9px;
}

.communication-thread-row__meta {
    display: flex;
    align-items: flex-end;
    flex-direction: column;
    gap: 7px;
}

.communication-thread-row__meta small {
    color: var(--mizan-muted);
    font-size: 8px;
}

.communication-compose-grid {
    display: grid;
    align-items: start;
    gap: 22px;
    grid-template-columns:
        minmax(0, 1.5fr)
        minmax(330px, 0.6fr);
}

.communication-compose-sidebar,
.communication-detail-sidebar {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.communication-document-picker {
    display: flex;
    max-height: 330px;
    flex-direction: column;
    gap: 7px;
    overflow-y: auto;
}

.communication-document-option {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    padding: 10px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-sm);
    background: var(--mizan-cream-50);
    cursor: pointer;
}

.communication-document-option:hover {
    border-color: var(--mizan-gold-500);
}

.communication-document-option > span {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.communication-document-option small {
    color: var(--mizan-muted);
    font-size: 8px;
}

.communication-detail-grid {
    display: grid;
    align-items: start;
    gap: 22px;
    grid-template-columns:
        minmax(0, 1.45fr)
        minmax(350px, 0.65fr);
}

.communication-detail-sidebar {
    position: sticky;
    top: calc(var(--topbar-height) + 22px);
}

.communication-timeline {
    display: flex;
    flex-direction: column;
    gap: 17px;
}

.communication-message {
    padding: 20px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-md);
    background: var(--mizan-white);
    box-shadow: var(--shadow-sm);
}

.communication-message--outbound {
    border-left: 4px solid var(--mizan-green-700);
}

.communication-message--inbound {
    border-left: 4px solid var(--mizan-gold-600);
}

.communication-message--internal {
    border-left: 4px solid #77756d;
    background: var(--mizan-cream-50);
}

.communication-message__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 13px;
}

.communication-message__header > div:first-child {
    display: flex;
    flex-direction: column;
}

.communication-message__header span,
.communication-message__header small {
    color: var(--mizan-muted);
    font-size: 9px;
}

.communication-message__status {
    display: flex;
    align-items: flex-end;
    flex-direction: column;
    gap: 6px;
}

.communication-message__subject {
    margin-bottom: 12px;
    color: var(--mizan-green-950);
    font-weight: 750;
}

.communication-recipient-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 13px;
}

.communication-recipient-list span {
    padding: 4px 7px;
    border-radius: 999px;
    color: var(--mizan-muted);
    background: var(--mizan-cream-100);
    font-size: 8px;
}

.communication-message__body {
    line-height: 1.7;
    word-break: break-word;
}

.communication-attachment-list {
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin-top: 15px;
    padding: 12px;
    border-radius: var(--radius-sm);
    background: var(--mizan-cream-50);
}

.communication-attachment-list span {
    color: var(--mizan-muted);
    font-size: 9px;
}

.communication-error {
    margin-top: 14px;
    padding: 11px;
    border: 1px solid rgba(177, 55, 55, 0.28);
    border-radius: var(--radius-sm);
    color: var(--mizan-danger);
    background: rgba(177, 55, 55, 0.06);
    white-space: pre-line;
}

.communication-attempts {
    margin-top: 14px;
}

.communication-attempts summary {
    color: var(--mizan-muted);
    font-size: 9px;
    cursor: pointer;
}

.communication-attempts > div {
    display: grid;
    gap: 8px;
    padding: 9px 0;
    border-bottom: 1px solid var(--mizan-border);
    grid-template-columns:
        minmax(100px, 0.3fr)
        minmax(180px, 0.5fr)
        auto;
}

.communication-attempts span,
.communication-attempts small {
    color: var(--mizan-muted);
    font-size: 8px;
}

.communication-message__action {
    display: inline-flex;
    margin-top: 12px;
    margin-right: 6px;
}

.communication-suppression-grid {
    display: grid;
    align-items: start;
    gap: 22px;
    grid-template-columns:
        minmax(0, 1.5fr)
        minmax(320px, 0.55fr);
}

@media (max-width: 1050px) {
    .communication-compose-grid,
    .communication-detail-grid,
    .communication-suppression-grid {
        grid-template-columns: 1fr;
    }

    .communication-detail-sidebar {
        position: static;
    }
}

@media (max-width: 750px) {
    .communication-filter {
        grid-template-columns: 1fr;
    }

    .communication-thread-row {
        align-items: flex-start;
        grid-template-columns:
            42px
            minmax(0, 1fr);
    }

    .communication-thread-row__meta {
        align-items: flex-start;
        grid-column: 2;
    }

    .communication-message__header {
        flex-direction: column;
    }

    .communication-message__status {
        align-items: flex-start;
    }

    .communication-attempts > div {
        grid-template-columns: 1fr;
    }
}


/* ---- MIZAN Mastercode CSS-Zusatzblock 1010 ---- */

.security-metrics {
    display: grid;
    gap: 15px;
    margin-bottom: 22px;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
}

.security-metrics article {
    display: flex;
    min-height: 115px;
    flex-direction: column;
    justify-content: space-between;
    padding: 18px;
    border: 1px solid var(--mizan-border);
    border-radius: var(--radius-md);
    background: var(--mizan-white);
    box-shadow: var(--shadow-sm);
}

.security-metrics span {
    color: var(--mizan-muted);
    font-size: 10px;
}

.security-metrics strong {
    color: var(--mizan-green-950);
    font-family: Georgia, serif;
    font-size: 25px;
}

.security-center-grid {
    display: grid;
    align-items: start;
    gap: 22px;
    grid-template-columns:
        minmax(0, 1.4fr)
        minmax(330px, 0.6fr);
}

.security-center-main {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 22px;
}

.security-device-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 0;
    border-bottom: 1px solid var(--mizan-border);
}

.security-device-row:last-child {
    border-bottom: 0;
}

.security-device-row > div {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.security-device-row span,
.security-device-row small {
    color: var(--mizan-muted);
    font-size: 9px;
}

.security-revoke-form {
    display: flex;
    align-items: flex-end;
    gap: 12px;
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid var(--mizan-border);
}

.security-revoke-form .form-group {
    flex: 1;
    margin: 0;
}

.security-event-list {
    display: flex;
    max-height: 850px;
    flex-direction: column;
    gap: 9px;
    overflow-y: auto;
}

.security-event {
    padding: 11px;
    border: 1px solid var(--mizan-border);
    border-left: 4px solid var(--mizan-green-700);
    border-radius: var(--radius-sm);
    background: var(--mizan-cream-50);
}

.security-event--warning {
    border-left-color: var(--mizan-gold-600);
}

.security-event--high,
.security-event--critical {
    border-left-color: var(--mizan-danger);
}

.security-event strong,
.security-event span,
.security-event small {
    display: block;
}

.security-event span,
.security-event small {
    color: var(--mizan-muted);
    font-size: 8px;
}

.security-event p {
    margin: 7px 0;
    font-size: 9px;
}

.security-two-factor-grid {
    display: grid;
    align-items: start;
    gap: 22px;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
}

.security-secret {
    margin: 18px 0;
    padding: 16px;
    border: 1px dashed var(--mizan-gold-600);
    border-radius: var(--radius-sm);
    color: var(--mizan-green-950);
    background: var(--mizan-cream-50);
    font-family: monospace;
    font-size: 17px;
    letter-spacing: 2px;
    text-align: center;
    word-break: break-all;
}

.security-secondary-form {
    margin-top: 25px;
    padding-top: 20px;
    border-top: 1px solid var(--mizan-border);
}

.security-recovery-panel {
    margin-bottom: 22px;
    padding: 22px;
    border: 1px solid var(--mizan-gold-600);
    border-radius: var(--radius-md);
    background: rgba(167, 131, 62, 0.09);
}

.security-recovery-codes {
    display: grid;
    gap: 9px;
    margin-top: 18px;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
}

.security-recovery-codes code {
    padding: 10px;
    border-radius: 6px;
    color: var(--mizan-green-950);
    background: var(--mizan-white);
    font-size: 14px;
    text-align: center;
}

.backup-layout {
    display: grid;
    align-items: start;
    gap: 22px;
    grid-template-columns:
        minmax(0, 1.55fr)
        minmax(330px, 0.55fr);
}

.security-event-filter {
    display: grid;
    align-items: center;
    gap: 12px;
    margin-bottom: 22px;
    grid-template-columns:
        minmax(200px, 0.5fr)
        minmax(220px, 0.55fr)
        auto;
}

.security-event-table {
    display: flex;
    flex-direction: column;
}

.security-event-row {
    display: grid;
    align-items: flex-start;
    gap: 15px;
    padding: 16px 0;
    border-bottom: 1px solid var(--mizan-border);
    grid-template-columns:
        110px
        minmax(0, 1fr)
        auto;
}

.security-event-row--warning {
    border-left: 3px solid var(--mizan-gold-600);
    padding-left: 12px;
}

.security-event-row--high,
.security-event-row--critical {
    border-left: 3px solid var(--mizan-danger);
    padding-left: 12px;
}

.security-event-row > div:nth-child(2) {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.security-event-row span,
.security-event-row small {
    color: var(--mizan-muted);
    font-size: 9px;
}

.security-event-row p {
    margin: 8px 0;
    line-height: 1.55;
}

.table-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}

@media (max-width: 1100px) {
    .security-center-grid,
    .backup-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 800px) {
    .security-metrics,
    .security-two-factor-grid {
        grid-template-columns: 1fr;
    }

    .security-event-filter {
        grid-template-columns: 1fr;
    }

    .security-event-row {
        grid-template-columns: 1fr;
    }

    .security-revoke-form {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 550px) {
    .security-recovery-codes {
        grid-template-columns: 1fr;
    }

    .security-device-row {
        align-items: flex-start;
        flex-direction: column;
    }
}


/* ---- MIZAN Mastercode CSS-Zusatzblock 1086 ---- */

.integration-two-column {
    display: grid;
    align-items: start;
    gap: 22px;
    grid-template-columns:
        minmax(0, 1.5fr)
        minmax(330px, 0.58fr);
}

.integration-secret-panel {
    margin-bottom: 22px;
    padding: 20px;
    border: 1px solid var(--mizan-gold-600);
    border-radius: var(--radius-md);
    background: rgba(167, 131, 62, 0.09);
}

.integration-secret-panel strong,
.integration-secret-panel p {
    display: block;
}

.integration-secret-panel textarea {
    width: 100%;
    margin-top: 12px;
    font-family: monospace;
    word-break: break-all;
}

.integration-endpoint-card {
    display: grid;
    align-items: center;
    gap: 15px;
    padding: 16px 0;
    border-bottom: 1px solid var(--mizan-border);
    grid-template-columns:
        minmax(0, 1fr)
        auto;
}

.integration-endpoint-card > div:first-child {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.integration-endpoint-card span,
.integration-endpoint-card small {
    overflow: hidden;
    color: var(--mizan-muted);
    font-size: 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.integration-endpoint-card__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.integration-log-row {
    display: grid;
    gap: 14px;
    padding: 15px 0;
    border-bottom: 1px solid var(--mizan-border);
    grid-template-columns:
        100px
        minmax(0, 1fr)
        150px;
}

.integration-log-row--warning {
    border-left: 3px solid var(--mizan-gold-600);
    padding-left: 12px;
}

.integration-log-row--error,
.integration-log-row--critical {
    border-left: 3px solid var(--mizan-danger);
    padding-left: 12px;
}

@media (max-width: 1050px) {
    .integration-two-column {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .integration-endpoint-card {
        align-items: flex-start;
        grid-template-columns: 1fr;
    }

    .integration-endpoint-card__actions {
        justify-content: flex-start;
    }

    .integration-log-row {
        grid-template-columns: 1fr;
    }
}

.brand-logo {
    height: 36px;
    width: auto;
    display: inline-block;
    vertical-align: middle;
    margin-right: 6px;
}

.site-footer {
    text-align: center;
    padding: 2rem 1rem;
    color: var(--muted, #667085);
    font-size: 0.85rem;
    border-top: 1px solid var(--line, #e8decc);
    margin-top: 2rem;
}
