body {
    background:
        radial-gradient(circle at top right, rgba(0, 212, 255, 0.10), transparent 28%),
        radial-gradient(circle at top left, rgba(0, 119, 255, 0.10), transparent 24%),
        linear-gradient(180deg, #0a1220 0%, #0f1727 100%);
    color: #e5edf8;
    min-height: 100vh;
}

.navbar {
    background: rgba(10, 18, 32, 0.88) !important;
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(82, 168, 255, 0.18) !important;
}

.navbar .navbar-brand,
.navbar .nav-link,
.navbar .text-secondary {
    color: #eaf2ff !important;
}

.navbar .nav-link:hover,
.navbar .navbar-brand:hover {
    color: #66d9ff !important;
}

.card {
    border-radius: 22px;
    background: linear-gradient(180deg, rgba(21, 31, 50, 0.98) 0%, rgba(15, 23, 39, 0.98) 100%);
    border: 1px solid rgba(92, 182, 255, 0.14) !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.28);
    color: #edf4ff;
}

.card-stat {
    background:
        linear-gradient(135deg, rgba(24, 37, 60, 1) 0%, rgba(12, 24, 45, 1) 100%);
    position: relative;
    overflow: hidden;
}

.card-stat::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent, rgba(102, 217, 255, 0.08), transparent);
    transform: translateX(-100%);
    animation: shine 4.5s linear infinite;
}

@keyframes shine {
    to { transform: translateX(100%); }
}

.table,
.table th,
.table td,
.form-label,
h1, h2, h3, h4, h5,
strong,
label {
    color: #edf4ff !important;
}

.table {
    --bs-table-bg: transparent;
    --bs-table-striped-bg: rgba(255,255,255,0.02);
    --bs-table-border-color: rgba(117, 147, 188, 0.18);
}

.text-secondary,
.small.text-secondary,
div.text-secondary {
    color: #9cb0cc !important;
}

.form-control,
.form-select {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(113, 154, 214, 0.22);
    color: #f7fbff;
    border-radius: 14px;
}

.form-control:focus,
.form-select:focus {
    background: rgba(255, 255, 255, 0.07);
    color: #fff;
    border-color: rgba(102, 217, 255, 0.65);
    box-shadow: 0 0 0 .25rem rgba(0, 217, 255, 0.14);
}

.form-control::placeholder {
    color: #8da4c3;
}

.btn-primary {
    background: linear-gradient(135deg, #00b8ff 0%, #0066ff 100%);
    border: 0;
    border-radius: 14px;
    box-shadow: 0 10px 25px rgba(0, 140, 255, 0.28);
}

.btn-primary:hover {
    background: linear-gradient(135deg, #18c3ff 0%, #1d72ff 100%);
}

.btn-outline-secondary,
.btn-outline-primary,
.btn-outline-danger {
    border-radius: 14px;
}

.alert {
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,0.08);
}

.badge.text-bg-success {
    background: rgba(16, 185, 129, 0.18) !important;
    color: #85ffd0 !important;
    border: 1px solid rgba(16, 185, 129, 0.28);
}

.badge.text-bg-danger {
    background: rgba(239, 68, 68, 0.16) !important;
    color: #ffb4b4 !important;
    border: 1px solid rgba(239, 68, 68, 0.24);
}

.signature-wrapper {
    border: 1px dashed rgba(102, 217, 255, 0.42);
    border-radius: 18px;
    overflow: hidden;
    background: #ffffff;
}

#signature-pad {
    width: 100%;
    height: 220px;
    display: block;
    touch-action: none;
    background: #ffffff;
}

.table > :not(caption) > * > * {
    vertical-align: middle;
}

.login-hero {
    background:
        linear-gradient(135deg, rgba(0, 184, 255, 0.16), rgba(0, 102, 255, 0.12)),
        rgba(255,255,255,0.02);
    border: 1px solid rgba(102, 217, 255, 0.12);
    border-radius: 24px;
    padding: 1rem;
}

.brand-chip {
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    padding: .5rem .9rem;
    border-radius: 999px;
    background: rgba(102, 217, 255, 0.08);
    border: 1px solid rgba(102, 217, 255, 0.18);
    color: #bfefff;
    font-size: .85rem;
    margin-bottom: 1rem;
}

.brand-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00d4ff, #005eff);
    box-shadow: 0 0 16px rgba(0, 212, 255, 0.7);
}

.page-title-accent {
    color: #66d9ff;
}

@media (max-width: 991px) {
    .navbar .text-secondary {
        display: none;
    }
}

/* Hotfix Final: Formulare wieder vollständig bedienbar */
main,
.container,
.row,
.col-12,
.col-md-2,
.col-md-4,
.col-md-6,
.col-md-8,
.col-lg-4,
.col-lg-8,
.card,
.card-body,
form,
label,
input,
select,
textarea,
button,
a.btn {
    position: relative;
    z-index: 2;
}

.navbar {
    z-index: 1030;
}

.navbar::before,
.navbar::after,
.card::before,
.card::after,
.card-stat::before,
.card-stat::after,
.login-hero::before,
.login-hero::after {
    pointer-events: none;
}

.signature-wrapper {
    position: relative;
    z-index: 3;
}

#signature-pad {
    position: relative;
    z-index: 4;
    pointer-events: auto;
    cursor: crosshair;
}

.form-control,
.form-select,
textarea,
button,
.btn,
a.btn {
    pointer-events: auto !important;
}

.card-body {
    overflow: visible;
}

@media (max-width: 991px) {
    .collapse.navbar-collapse {
        background: rgba(10, 18, 32, 0.98);
        border-radius: 16px;
        padding: .75rem;
        margin-top: .75rem;
    }
}

/* PDF / Print */
.pdf-page {
    max-width: 960px;
    margin: 0 auto;
}

.pdf-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    padding-bottom: 1rem;
    margin-bottom: 1.25rem;
    border-bottom: 2px solid rgba(102, 217, 255, 0.25);
}

.pdf-title {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
}

.pdf-subtitle {
    color: #9cb0cc;
    margin-top: .35rem;
}

.pdf-meta {
    text-align: right;
    font-size: .95rem;
    color: #9cb0cc;
}

.pdf-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.pdf-field {
    border: 1px solid rgba(113, 154, 214, 0.22);
    border-radius: 16px;
    padding: 1rem;
    background: rgba(255,255,255,0.03);
}

.pdf-field.full {
    grid-column: 1 / -1;
}

.pdf-label {
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: #9cb0cc;
    margin-bottom: .35rem;
}

.pdf-value {
    font-size: 1rem;
    color: #edf4ff;
    word-break: break-word;
}

.pdf-signature img {
    max-width: 100%;
    max-height: 180px;
    background: white;
    border-radius: 12px;
    border: 1px solid rgba(113, 154, 214, 0.22);
    padding: .5rem;
}

.print-toolbar {
    display: flex;
    justify-content: flex-end;
    gap: .75rem;
    margin-bottom: 1rem;
}

@media (max-width: 767px) {
    .pdf-grid {
        grid-template-columns: 1fr;
    }
}

@media print {
    body {
        background: #ffffff !important;
        color: #000000 !important;
    }

    nav,
    .print-toolbar,
    .btn,
    .navbar,
    .alert {
        display: none !important;
    }

    main,
    .container {
        max-width: 100% !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .card,
    .pdf-field {
        box-shadow: none !important;
        background: #ffffff !important;
        color: #000000 !important;
        border: 1px solid #cfd6df !important;
    }

    .table,
    .table th,
    .table td,
    .pdf-value,
    .pdf-label,
    .pdf-title,
    .pdf-subtitle,
    .pdf-meta,
    h1, h2, h3, h4, h5, p, span, div, strong {
        color: #000000 !important;
    }

    a {
        color: #000000 !important;
        text-decoration: none !important;
    }

    .badge {
        border: 1px solid #999 !important;
        color: #000 !important;
        background: #fff !important;
    }

    .pdf-page {
        max-width: 100%;
    }
}

.navbar-toggler {
    border-color: rgba(255, 255, 255, 0.35) !important;
}

.navbar-toggler:focus {
    box-shadow: 0 0 0 .2rem rgba(255, 255, 255, 0.15) !important;
}

.navbar-toggler-icon {
    filter: brightness(0) invert(1);
}

select[multiple].form-select {
    min-height: 180px;
}

/* Mobile Optimization Final */
html, body {
    overflow-x: hidden;
}

img {
    max-width: 100%;
    height: auto;
}

.table-responsive {
    -webkit-overflow-scrolling: touch;
    border-radius: 14px;
}

.form-control,
.form-select,
.btn {
    min-height: 46px;
}

.form-text {
    font-size: .9rem;
}

.alert,
.card,
.signature-wrapper {
    overflow: hidden;
}

@media (max-width: 991.98px) {
    .navbar-brand {
        font-size: 1rem;
        max-width: calc(100% - 60px);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .navbar .btn-outline-danger.btn-sm {
        width: 100%;
    }

    .collapse.navbar-collapse {
        background: rgba(10, 18, 32, 0.98);
        border: 1px solid rgba(255,255,255,0.08);
        border-radius: 18px;
        padding: .9rem;
        margin-top: .75rem;
    }

    .navbar-nav .nav-link {
        padding: .8rem .2rem;
    }

    main.container,
    .container {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    .display-6 {
        font-size: 1.75rem;
    }

    h1.h3, .h3 {
        font-size: 1.3rem;
    }

    h2.h5, .h5 {
        font-size: 1.05rem;
    }

    .card-body {
        padding: 1rem;
    }

    .btn,
    .btn-sm {
        width: 100%;
    }

    .d-flex.gap-2,
    .d-flex.gap-3 {
        flex-direction: column;
        align-items: stretch !important;
    }

    .d-flex.gap-2 > .btn,
    .d-flex.gap-3 > .btn,
    .d-flex.gap-2 > a.btn,
    .d-flex.gap-3 > a.btn {
        width: 100%;
    }

    .table {
        font-size: .92rem;
    }

    .table th,
    .table td {
        white-space: nowrap;
    }

    select[multiple].form-select {
        min-height: 220px;
    }

    input[readonly],
    .form-control[readonly] {
        opacity: 1;
    }
}

@media (max-width: 767.98px) {
    body {
        font-size: .96rem;
    }

    .container.py-4,
    .container.py-5 {
        padding-top: 1rem !important;
        padding-bottom: 1rem !important;
    }

    .row.g-4,
    .row.g-3 {
        --bs-gutter-y: .9rem;
    }

    .card {
        border-radius: 18px;
    }

    .card-body {
        padding: .95rem;
    }

    .alert {
        padding: .85rem 1rem;
    }

    .badge {
        font-size: .78rem;
    }

    .pdf-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .pdf-meta {
        text-align: left;
    }
}

.comm-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 7px;
    border-radius: 999px;
    background: linear-gradient(135deg, #ff5f6d 0%, #ff2d55 100%);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 6px 18px rgba(255,45,85,.28);
}

.comm-list {
    display: grid;
    gap: 12px;
}

.comm-list-item {
    display: block;
    padding: 14px 16px;
    border-radius: 16px;
    border: 1px solid rgba(113,154,214,.18);
    background: rgba(255,255,255,.03);
    color: inherit;
    transition: transform .15s ease, border-color .15s ease, background .15s ease;
}

.comm-list-item:hover {
    transform: translateY(-1px);
    border-color: rgba(102,217,255,.35);
    background: rgba(255,255,255,.05);
}

.comm-list-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 6px;
}

.comm-messages {
    display: grid;
    gap: 14px;
    max-height: 62vh;
    overflow-y: auto;
    padding-right: 4px;
}

.comm-message {
    border: 1px solid rgba(113,154,214,.18);
    border-radius: 16px;
    padding: 12px 14px;
    background: rgba(255,255,255,.03);
}

.comm-message.own {
    border-color: rgba(102,217,255,.35);
    background: rgba(0,184,255,.08);
}

.comm-message-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 8px;
}

.comm-message-body {
    white-space: pre-wrap;
    word-break: break-word;
    line-height: 1.45;
}

.comm-member-list {
    display: grid;
    gap: 10px;
}

.comm-member-item {
    border: 1px solid rgba(113,154,214,.18);
    border-radius: 14px;
    padding: 12px;
    background: rgba(255,255,255,.03);
}

@media (max-width: 767.98px) {
    .comm-list-top {
        align-items: flex-start;
        flex-direction: column;
    }

    .comm-messages {
        max-height: none;
    }
}

.comm-empty-state {
    border: 1px dashed rgba(113,154,214,.24);
    border-radius: 16px;
    padding: 18px;
    text-align: center;
    color: #9cb0cc;
}

.comm-messages {
    scroll-behavior: smooth;
}

.comm-message textarea {
    resize: vertical;
}

.comm-badge-live[hidden] {
    display: none !important;
}

#notification_status_badge {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
}

.notif-debug-item {
    border: 1px solid rgba(113,154,214,.18);
    border-radius: 14px;
    padding: 12px;
    background: rgba(255,255,255,.03);
    min-height: 72px;
}

.notif-debug-fallback {
    border: 1px dashed rgba(113,154,214,.24);
    border-radius: 12px;
    padding: 12px;
    background: rgba(255,255,255,.02);
    color: #e5edf8;
}

.presence-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
    background: #10b981;
}

.comm-message-footer {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
    font-size: 12px;
    color: #8fa3bf;
}

.comm-message:not(.own) .comm-message-footer {
    justify-content: flex-start;
}

.comm-message-time {
    opacity: .9;
}

.comm-read-receipt {
    font-weight: 700;
    letter-spacing: .02em;
    color: #66d9ff;
}

.comm-read-receipt.group {
    font-weight: 600;
    color: #9cb0cc;
}

.pm-thread {
    padding-top: 4px;
}

.messenger-thread {
    display: flex;
    flex-direction: column;
    gap: 14px;
    max-height: 62vh;
    overflow-y: auto;
    padding-right: 4px;
}

.pm-row {
    display: flex;
    width: 100%;
}

.pm-row.other {
    justify-content: flex-start;
}

.pm-row.own {
    justify-content: flex-end;
}

.pm-bubble {
    max-width: 85%;
    border-radius: 22px;
    padding: 14px 16px;
    border: 1px solid rgba(113,154,214,.18);
    background: rgba(255,255,255,.03);
    box-shadow: 0 10px 24px rgba(0,0,0,.14);
}

.pm-bubble.own {
    background: rgba(0,184,255,.10);
    border-color: rgba(102,217,255,.35);
}

.pm-author {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 8px;
}

.pm-text {
    white-space: pre-wrap;
    word-break: break-word;
    line-height: 1.45;
    font-size: 1rem;
}

.pm-meta {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
    font-size: 12px;
    color: #9cb0cc;
}

.pm-row.other .pm-meta {
    justify-content: flex-start;
}

.pm-receipt {
    color: #66d9ff;
    font-weight: 700;
    letter-spacing: .02em;
    min-width: 18px;
    text-align: right;
}

@media (max-width: 767.98px) {
    .messenger-thread {
        max-height: none;
    }

    .pm-bubble {
        max-width: 92%;
        padding: 13px 14px;
        border-radius: 20px;
    }

    .pm-text {
        font-size: .98rem;
    }
}

/* Messenger Design Pro Final */
.pm-shell {
    overflow: hidden;
}

.pm-shell-body {
    padding: 0;
}

.pm-thread {
    padding: 18px 18px 8px;
}

.messenger-thread {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-height: 62vh;
    overflow-y: auto;
    padding-right: 2px;
}

.pm-row {
    display: flex;
    width: 100%;
}

.pm-row.other {
    justify-content: flex-start;
}

.pm-row.own {
    justify-content: flex-end;
}

.pm-bubble {
    max-width: 82%;
    padding: 12px 14px 10px;
    border-radius: 20px;
    border: 1px solid rgba(113,154,214,.16);
    box-shadow: 0 8px 20px rgba(0,0,0,.14);
    backdrop-filter: blur(4px);
}

.pm-bubble.other {
    background: rgba(255,255,255,.04);
    border-top-left-radius: 8px;
}

.pm-bubble.own {
    background: linear-gradient(180deg, rgba(0,184,255,.14) 0%, rgba(0,132,255,.10) 100%);
    border-color: rgba(102,217,255,.30);
    border-top-right-radius: 8px;
}

.pm-author {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 6px;
    font-size: .96rem;
}

.pm-text {
    white-space: pre-wrap;
    word-break: break-word;
    line-height: 1.42;
    font-size: 1rem;
    color: #eaf3ff;
}

.pm-meta {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
    font-size: 12px;
    color: #9cb0cc;
}

.pm-row.other .pm-meta {
    justify-content: flex-start;
}

.pm-time {
    opacity: .92;
}

.pm-receipt {
    color: #66d9ff;
    font-weight: 700;
    letter-spacing: .02em;
    min-width: 18px;
    text-align: right;
}

.pm-compose {
    position: sticky;
    bottom: 0;
    padding: 14px 18px 18px;
    background: linear-gradient(180deg, rgba(6,14,28,.2) 0%, rgba(6,14,28,.92) 28%);
    backdrop-filter: blur(8px);
}

.pm-compose-box {
    display: flex;
    gap: 10px;
    align-items: flex-end;
}

.pm-textarea {
    min-height: 52px;
    max-height: 140px;
    resize: vertical;
    border-radius: 16px;
}

.pm-send-btn {
    min-width: 110px;
    border-radius: 16px;
}

@media (max-width: 767.98px) {
    .pm-page-header .btn {
        width: 100%;
    }

    .pm-thread {
        padding: 14px 12px 6px;
    }

    .messenger-thread {
        max-height: 58vh;
        gap: 8px;
    }

    .pm-bubble {
        max-width: 90%;
        padding: 11px 12px 9px;
        border-radius: 18px;
    }

    .pm-text {
        font-size: .98rem;
    }

    .pm-compose {
        padding: 12px 12px 14px;
    }

    .pm-compose-box {
        flex-direction: column;
        align-items: stretch;
    }

    .pm-send-btn {
        width: 100%;
        min-width: 0;
    }
}

/* Premium UX Final */
:root {
    --app-safe-bottom: max(12px, env(safe-area-inset-bottom));
}

html.display-standalone body,
body.display-standalone {
    overscroll-behavior-y: contain;
}

body.app-shell {
    padding-bottom: calc(72px + var(--app-safe-bottom));
}

.pwa-install-bar {
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: calc(74px + var(--app-safe-bottom));
    z-index: 1040;
    opacity: 0;
    pointer-events: none;
    transform: translateY(12px);
    transition: opacity .2s ease, transform .2s ease;
}

.pwa-install-bar.show {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

.pwa-install-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border: 1px solid rgba(113,154,214,.18);
    border-radius: 18px;
    padding: 12px 14px;
    background: rgba(7, 18, 36, .96);
    backdrop-filter: blur(10px);
    box-shadow: 0 12px 32px rgba(0,0,0,.24);
}

.mobile-bottom-nav {
    position: fixed;
    left: 10px;
    right: 10px;
    bottom: calc(8px + env(safe-area-inset-bottom));
    z-index: 1035;
    display: none;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
    padding: 8px;
    border: 1px solid rgba(113,154,214,.18);
    border-radius: 20px;
    background: rgba(7, 18, 36, .96);
    backdrop-filter: blur(12px);
    box-shadow: 0 14px 34px rgba(0,0,0,.26);
}

.mobile-bottom-link {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    border-radius: 14px;
    color: #eaf3ff;
    text-decoration: none;
    font-weight: 600;
    font-size: .92rem;
    background: rgba(255,255,255,.03);
}

.mobile-bottom-link:hover,
.mobile-bottom-link:focus {
    color: #fff;
    background: rgba(0,184,255,.12);
}

@media (max-width: 767.98px) {
    .mobile-bottom-nav {
        display: grid;
    }

    .pwa-install-content {
        flex-direction: column;
        align-items: stretch;
    }

    body.app-shell main.container,
    body.app-shell .container {
        padding-bottom: 12px !important;
    }
}

/* PWA Cross-Browser Final */
@supports (padding: max(0px)) {
    .mobile-bottom-nav {
        padding-bottom: max(8px, env(safe-area-inset-bottom));
    }
}

.pwa-install-content strong {
    color: #eef6ff;
}

#pwa_install_helper {
    line-height: 1.35;
}

.display-standalone .pwa-install-bar {
    display: none !important;
}

@media (max-width: 767.98px) {
    .pwa-install-bar {
        left: 10px;
        right: 10px;
    }
}

/* Bottom Nav Hotfix Final */
body.app-shell {
    padding-bottom: calc(96px + var(--app-safe-bottom));
}

.mobile-bottom-nav {
    left: 8px;
    right: 8px;
    bottom: calc(6px + env(safe-area-inset-bottom));
    gap: 6px;
    padding: 6px;
    border-radius: 18px;
    background: rgba(7, 18, 36, 0.78);
    backdrop-filter: blur(10px);
    box-shadow: 0 10px 24px rgba(0,0,0,.20);
}

.mobile-bottom-link {
    min-height: 42px;
    border-radius: 12px;
    font-size: .88rem;
    background: rgba(255,255,255,.025);
}

.mobile-bottom-link:active {
    transform: scale(.98);
}

@media (max-width: 767.98px) {
    .pwa-install-bar {
        bottom: calc(64px + var(--app-safe-bottom));
    }

    .mobile-bottom-nav {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    body.app-shell main.container,
    body.app-shell .container {
        padding-bottom: 88px !important;
    }

    .table-responsive {
        margin-bottom: 6px;
    }
}

/* optional compact mode for very small screens */
@media (max-width: 380px) {
    .mobile-bottom-link {
        font-size: .82rem;
        min-height: 40px;
    }

    .mobile-bottom-nav {
        gap: 4px;
        padding: 5px;
    }
}

/* Premium Clean Navigation REAL Final */
body.app-shell {
    padding-bottom: 24px !important;
}

.mobile-bottom-nav {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

.mobile-bottom-link {
    display: none !important;
}

.pwa-install-bar {
    bottom: calc(12px + var(--app-safe-bottom)) !important;
}

@media (max-width: 767.98px) {
    body.app-shell main.container,
    body.app-shell .container {
        padding-bottom: 18px !important;
    }

    .pwa-install-bar {
        left: 10px;
        right: 10px;
        bottom: calc(10px + var(--app-safe-bottom)) !important;
    }
}

/* App Scroll Hotfix Final */
html,
body {
    height: auto !important;
    min-height: 100%;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
}

html.display-standalone,
html.display-standalone body,
body.display-standalone,
body.app-shell {
    height: auto !important;
    min-height: 100dvh;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior-y: auto !important;
    -webkit-overflow-scrolling: touch;
}

body.app-shell main,
body.app-shell main.container,
body.app-shell .container,
body.app-shell .container-fluid {
    overflow: visible !important;
    max-height: none !important;
}

.card,
.card-body,
.comm-messages,
.messenger-thread,
.pm-thread {
    overflow: visible;
}

.messenger-thread,
.comm-messages {
    max-height: none !important;
}

.pm-shell,
.pm-shell-body {
    overflow: visible !important;
}

.pm-compose {
    position: static !important;
    bottom: auto !important;
}

.pwa-install-bar {
    position: fixed;
    z-index: 1040;
}

@media (max-width: 767.98px) {
    body.app-shell {
        padding-bottom: 18px !important;
    }

    .container,
    main.container {
        padding-bottom: 12px !important;
    }

    .pm-thread {
        padding-bottom: 10px !important;
    }
}

.signature-display-name-box {
    display: flex;
    align-items: center;
    min-height: 72px;
    padding: 16px 20px;
    border-radius: 18px;
    border: 1px solid rgba(113,154,214,.18);
    background: rgba(210, 240, 248, 0.90);
    color: #12485b;
    font-size: 1rem;
    font-weight: 500;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.22);
}

/* Entry Create Hint Removal REAL Final */
.signature-display-name-box {
    min-height: 56px !important;
    padding: 14px 18px !important;
    font-size: 1rem !important;
    line-height: 1.3 !important;
    background: rgba(210, 240, 248, 0.90) !important;
    color: #12485b !important;
}

/* Entry Create Ultra Clean Final */
.entry-create-form .signature-display-name-box,
.entry-create-form .signature-display-section {
    display: none !important;
}

/* PN Self Delete Final */
.pm-page-header form {
    margin: 0;
}


/* Hamburger Menu REAL Final */
.navbar .navbar-toggler {
    width: 56px !important;
    height: 56px !important;
    min-width: 56px !important;
    min-height: 56px !important;
    padding: 0 !important;
    border-radius: 16px !important;
    border: 1px solid rgba(255,255,255,.22) !important;
    background: rgba(255,255,255,.03) !important;
    box-shadow: 0 10px 24px rgba(0,0,0,.18) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: visible !important;
    z-index: 1051;
}

.navbar .navbar-toggler:focus {
    box-shadow: 0 0 0 0.2rem rgba(11,92,255,.18), 0 10px 24px rgba(0,0,0,.18) !important;
}

.custom-navbar-toggler-icon {
    width: 24px;
    height: 18px;
    display: inline-flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}

.custom-navbar-toggler-icon span {
    display: block !important;
    width: 24px !important;
    height: 2.5px !important;
    border-radius: 999px;
    background: rgba(255,255,255,.92) !important;
    box-shadow: 0 1px 0 rgba(0,0,0,.12);
    transition: transform .18s ease, opacity .18s ease, width .18s ease;
}

.navbar-toggler[aria-expanded="true"] .custom-navbar-toggler-icon span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.navbar-toggler[aria-expanded="true"] .custom-navbar-toggler-icon span:nth-child(2) {
    opacity: 0;
}

.navbar-toggler[aria-expanded="true"] .custom-navbar-toggler-icon span:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg);
}

@media (max-width: 767.98px) {
    .navbar .navbar-toggler {
        width: 54px !important;
        height: 54px !important;
        min-width: 54px !important;
        min-height: 54px !important;
        border-radius: 15px !important;
    }
}


.entry-meta-readonly .form-control[readonly] {
    background: rgba(210, 240, 248, 0.90);
    color: #12485b;
    border: 1px solid rgba(113,154,214,.18);
    font-weight: 500;
}


.entry-meta-readonly .form-select,
.entry-meta-readonly .form-control[readonly] {
    background: rgba(210, 240, 248, 0.90);
    color: #12485b;
    border: 1px solid rgba(113,154,214,.18);
    font-weight: 500;
}


/* Admin Panel Final */
.admin-badge {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    padding: 8px 14px;
    border-radius: 999px;
    border: 1px solid rgba(102,217,255,.24);
    background: rgba(0,184,255,.08);
    color: #d9f5ff;
    font-weight: 600;
}

.admin-stat-card,
.admin-card {
    height: 100%;
    border: 1px solid rgba(113,154,214,.18);
    border-radius: 24px;
    background: linear-gradient(180deg, rgba(255,255,255,.04) 0%, rgba(255,255,255,.02) 100%);
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}

.admin-stat-card {
    padding: 18px 18px 16px;
}

.admin-stat-label {
    font-size: .92rem;
    color: #9cb0cc;
    margin-bottom: 10px;
}

.admin-stat-value {
    font-size: 2rem;
    line-height: 1;
    font-weight: 700;
    color: #eef6ff;
}

.admin-card {
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.admin-card-title {
    font-size: 1.2rem;
    font-weight: 700;
    color: #eef6ff;
}

.admin-card-text {
    color: #aabbd3;
    line-height: 1.5;
    flex: 1;
}

.admin-card-btn {
    align-self: flex-start;
    min-width: 180px;
}

.admin-section-note {
    color: #8ea6c5;
    font-size: .95rem;
}

@media (max-width: 767.98px) {
    .admin-card,
    .admin-stat-card {
        border-radius: 20px;
    }

    .admin-card-btn {
        width: 100%;
        min-width: 0;
    }
}


/* Profil Clean Final */
.profile-readonly-field,
.profile-form .form-control[readonly],
.profile-form .form-control:disabled {
    background: rgba(34, 44, 68, 0.88) !important;
    color: #eef6ff !important;
    border: 1px solid rgba(113,154,214,.18) !important;
    opacity: 1 !important;
    box-shadow: none !important;
}

.profile-form .form-control[readonly]::placeholder,
.profile-form .form-control:disabled::placeholder {
    color: rgba(238,246,255,.55) !important;
}


/* Profil Dark Field REAL Final */
.profile-form .form-control[readonly],
.profile-form input[readonly],
.profile-form .form-control:disabled,
.profile-form input:disabled {
    background-color: rgba(34, 44, 68, 0.88) !important;
    background-image: none !important;
    color: #eef6ff !important;
    -webkit-text-fill-color: #eef6ff !important;
    border: 1px solid rgba(113,154,214,.18) !important;
    opacity: 1 !important;
    box-shadow: none !important;
    caret-color: transparent;
}

.profile-form .form-control[readonly]:focus,
.profile-form input[readonly]:focus,
.profile-form .form-control:disabled:focus,
.profile-form input:disabled:focus {
    background-color: rgba(34, 44, 68, 0.88) !important;
    color: #eef6ff !important;
    -webkit-text-fill-color: #eef6ff !important;
    border: 1px solid rgba(113,154,214,.24) !important;
    box-shadow: none !important;
}

.profile-form input[readonly]::-webkit-input-placeholder,
.profile-form input:disabled::-webkit-input-placeholder {
    color: rgba(238,246,255,.55) !important;
}

.profile-form input[readonly]:-webkit-autofill,
.profile-form input[readonly]:-webkit-autofill:hover,
.profile-form input[readonly]:-webkit-autofill:focus,
.profile-form input:disabled:-webkit-autofill,
.profile-form input:disabled:-webkit-autofill:hover,
.profile-form input:disabled:-webkit-autofill:focus {
    -webkit-text-fill-color: #eef6ff !important;
    box-shadow: 0 0 0 1000px rgba(34, 44, 68, 0.88) inset !important;
    -webkit-box-shadow: 0 0 0 1000px rgba(34, 44, 68, 0.88) inset !important;
    transition: background-color 9999s ease-out 0s !important;
    border: 1px solid rgba(113,154,214,.18) !important;
}


.dashboard-info-box-card {
    border-radius: 24px;
}

.dashboard-info-box-textarea {
    min-height: 130px;
    resize: vertical;
}

.dashboard-info-box-form .btn {
    min-width: 210px;
}

@media (max-width: 767.98px) {
    .dashboard-info-box-form .btn {
        width: 100%;
        min-width: 0;
    }
}


.dashboard-infobox-toolbar {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 12px;
}

.dashboard-color-picker {
    width: 48px;
    min-width: 48px;
    padding: 0.2rem !important;
    border-radius: 12px !important;
}

.dashboard-info-box-editor {
    min-height: 180px;
    line-height: 1.55;
    color: #eef6ff !important;
    background: rgba(34, 44, 68, 0.88) !important;
    white-space: pre-wrap;
    overflow-wrap: break-word;
}

.dashboard-info-box-editor:empty:before {
    content: attr(data-placeholder);
    color: rgba(238,246,255,.45);
}

.dashboard-info-box-preview-label {
    margin-top: 18px;
    margin-bottom: 8px;
    color: #9cb0cc;
    font-size: .92rem;
}

.dashboard-info-box-preview {
    min-height: 80px;
    border: 1px solid rgba(113,154,214,.18);
    border-radius: 18px;
    padding: 14px 16px;
    background: rgba(255,255,255,.03);
    color: #eef6ff;
    line-height: 1.55;
}

.dashboard-info-box-preview p,
.dashboard-info-box-preview div {
    margin-bottom: 8px;
}

.dashboard-info-box-preview ul,
.dashboard-info-box-preview ol {
    padding-left: 20px;
}

@media (max-width: 767.98px) {
    .dashboard-info-box-editor {
        min-height: 220px;
    }
}


/* Dashboard Infobox Minimal UI Final */
.dashboard-infobox-toolbar.compact {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 12px;
}

.dashboard-infobox-toolbar.compact .toolbar-btn,
.dashboard-infobox-toolbar.compact .toolbar-color-chip {
    width: 42px;
    min-width: 42px;
    height: 42px;
    min-height: 42px;
    padding: 0 !important;
    border-radius: 12px !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.dashboard-infobox-toolbar.compact .toolbar-btn strong,
.dashboard-infobox-toolbar.compact .toolbar-btn em,
.dashboard-infobox-toolbar.compact .toolbar-btn u {
    font-size: 1rem;
}

.dashboard-infobox-toolbar.compact .toolbar-clear {
    font-size: 1.2rem;
    line-height: 1;
}

.dashboard-color-picker {
    width: 46px !important;
    min-width: 46px !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 4px !important;
    border-radius: 12px !important;
    overflow: hidden;
}

.toolbar-color-chip {
    border: 1px solid rgba(255,255,255,.16) !important;
}

.toolbar-color-chip.chip-red { background: rgba(255,95,109,.18) !important; }
.toolbar-color-chip.chip-yellow { background: rgba(255,209,102,.18) !important; }
.toolbar-color-chip.chip-green { background: rgba(123,216,143,.18) !important; }
.toolbar-color-chip.chip-blue { background: rgba(124,199,255,.18) !important; }

.dashboard-info-box-editor {
    min-height: 220px;
}

.dashboard-info-box-preview,
.dashboard-info-box-preview-label {
    display: none !important;
}

@media (max-width: 767.98px) {
    .dashboard-infobox-toolbar.compact {
        gap: 6px;
    }

    .dashboard-infobox-toolbar.compact .toolbar-btn,
    .dashboard-infobox-toolbar.compact .toolbar-color-chip,
    .dashboard-color-picker {
        width: 40px !important;
        min-width: 40px !important;
        height: 40px !important;
        min-height: 40px !important;
    }
}


/* PDF Monatsbericht UI REAL Final */
.monthly-report-ui-card {
    border-radius: 24px;
}

.monthly-report-ui-note {
    color: #9cb0cc;
    font-size: .95rem;
}

@media (max-width: 767.98px) {
    .monthly-report-ui-card .btn {
        width: 100%;
    }
}


/* Dashboard Live Final */
.dashboard-live-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 8px 12px;
    border-radius: 999px;
    border: 1px solid rgba(123,216,143,.22);
    background: rgba(123,216,143,.08);
    color: #dff7e5;
    font-size: .92rem;
    font-weight: 600;
}

.dashboard-live-badge.is-error {
    border-color: rgba(255,95,109,.22);
    background: rgba(255,95,109,.08);
    color: #ffd7dc;
}

.dashboard-live-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #7bd88f;
    box-shadow: 0 0 0 0 rgba(123,216,143,.55);
    animation: dashboardLivePulse 1.8s infinite;
}

.dashboard-live-badge.is-error .dashboard-live-dot {
    background: #ff5f6d;
    box-shadow: none;
    animation: none;
}

@keyframes dashboardLivePulse {
    0% { box-shadow: 0 0 0 0 rgba(123,216,143,.55); }
    70% { box-shadow: 0 0 0 8px rgba(123,216,143,0); }
    100% { box-shadow: 0 0 0 0 rgba(123,216,143,0); }
}


/* Chat Live Refresh Final */
.comm-message {
    display: flex;
    margin-bottom: 12px;
}

.comm-message-own {
    justify-content: flex-end;
}

.comm-message-card {
    width: min(100%, 760px);
    border: 1px solid rgba(113,154,214,.18);
    border-radius: 18px;
    padding: 14px 16px;
    background: rgba(255,255,255,.03);
}

.comm-message-own .comm-message-card {
    background: rgba(11,99,246,.12);
}

.comm-message-head {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 8px;
    color: #eaf2ff;
}

.comm-message-user,
.comm-message-time {
    color: #9cb0cc;
    font-size: .92rem;
}

.comm-message-body {
    color: #eef6ff;
    line-height: 1.55;
    word-break: break-word;
}


/* Browser Push Benachrichtigungen Final */
.browser-notification-toggle {
    display: flex;
    justify-content: flex-end;
    margin: 8px 0 12px;
}

@media (max-width: 767.98px) {
    .browser-notification-toggle .btn {
        width: 100%;
    }
}



/* Schreibt gerade REAL Final */
.chat-typing-indicator {
    min-height: 24px;
    margin-top: 10px;
    color: #9cb0cc;
    font-size: .92rem;
    opacity: 0;
    transform: translateY(4px);
    transition: opacity .18s ease, transform .18s ease;
}
.chat-typing-indicator.is-visible {
    opacity: 1;
    transform: translateY(0);
}
.comm-conversation-card {
    border-radius: 24px;
}
.comm-conversation-body {
    padding: 18px;
}
#chat_messages.comm-messages,
#chat_messages.chat-messages,
#chat_messages.messenger-thread {
    display: flex;
    flex-direction: column;
    gap: 12px;
}


/* Kommunikation Unified Core REAL Final */
.comm-conversation-shell {
    max-width: 1100px;
    margin: 0 auto;
}
.comm-conversation-card {
    border-radius: 24px;
}
.comm-conversation-body {
    padding: 18px;
}
.comm-conversation-header {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 16px;
}
#chat_messages.comm-messages {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-height: 220px;
}
.comm-compose-form .comm-compose-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 12px;
    align-items: end;
}
.comm-compose-form textarea.form-control {
    min-height: 96px;
    resize: vertical;
}
@media (max-width: 767.98px) {
    .comm-compose-form .comm-compose-row {
        grid-template-columns: 1fr;
    }
    .comm-conversation-body {
        padding: 14px;
    }
}


/* Kommunikation Unified Core v2 REAL Final */
.comm-section-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    min-height: 24px;
    padding: 0 8px;
    margin-left: 8px;
    border-radius: 999px;
    background: rgba(11,99,246,.16);
    color: #b9d6ff;
    border: 1px solid rgba(11,99,246,.28);
    font-size: .78rem;
    font-weight: 700;
    vertical-align: middle;
}


/* Kommunikation WhatsApp UI FINAL */
.whatsapp-chat-shell {
    max-width: 980px;
}

.whatsapp-chat-card {
    border-radius: 28px !important;
    overflow: hidden;
    background:
        radial-gradient(circle at top right, rgba(59,130,246,.08), transparent 28%),
        linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.02)) !important;
}

.whatsapp-chat-body {
    padding: 0 !important;
}

.whatsapp-chat-header {
    position: sticky;
    top: 0;
    z-index: 5;
    padding: 16px 18px;
    margin-bottom: 0 !important;
    border-bottom: 1px solid rgba(113,154,214,.14);
    background: rgba(18,24,38,.92);
    backdrop-filter: blur(10px);
}

.whatsapp-chat-messages {
    padding: 18px 16px 10px;
    min-height: 54vh !important;
    max-height: 62vh;
    overflow-y: auto;
    background:
        radial-gradient(circle at 20% 20%, rgba(255,255,255,.02), transparent 18%),
        radial-gradient(circle at 80% 40%, rgba(255,255,255,.02), transparent 16%),
        linear-gradient(180deg, rgba(8,14,26,.76), rgba(9,15,24,.92));
}

.whatsapp-chat-messages .comm-message {
    margin-bottom: 4px;
}

.whatsapp-chat-messages .comm-message-card {
    width: auto !important;
    max-width: min(82%, 760px);
    border-radius: 18px 18px 18px 6px;
    padding: 10px 12px 8px !important;
    background: rgba(255,255,255,.07) !important;
    border: 1px solid rgba(113,154,214,.12) !important;
    box-shadow: 0 6px 18px rgba(0,0,0,.14);
}

.whatsapp-chat-messages .comm-message-own .comm-message-card {
    border-radius: 18px 18px 6px 18px;
    background: linear-gradient(180deg, rgba(11,99,246,.26), rgba(11,99,246,.18)) !important;
    border-color: rgba(11,99,246,.22) !important;
}

.whatsapp-chat-messages .comm-message-head {
    margin-bottom: 4px !important;
    gap: 6px !important;
}

.whatsapp-chat-messages .comm-message-head strong {
    font-size: .96rem;
}

.whatsapp-chat-messages .comm-message-user {
    font-size: .78rem !important;
    opacity: .9;
}

.whatsapp-chat-messages .comm-message-time {
    margin-left: auto;
    font-size: .72rem !important;
    opacity: .85;
}

.whatsapp-chat-messages .comm-message-body {
    font-size: .96rem;
    line-height: 1.45;
    color: #f6fbff;
}

.whatsapp-receipt {
    min-height: 16px !important;
    padding: 0 !important;
    margin-left: 6px !important;
    border: 0 !important;
    background: transparent !important;
    font-size: .8rem !important;
    font-weight: 800 !important;
}

.whatsapp-receipt.is-sent {
    color: #cbd5e1 !important;
}

.whatsapp-receipt.is-read {
    color: #7dd3fc !important;
}

.whatsapp-compose-form {
    padding: 14px 16px 16px;
    border-top: 1px solid rgba(113,154,214,.12);
    background: rgba(18,24,38,.94);
    backdrop-filter: blur(10px);
}

.whatsapp-compose-row {
    display: grid !important;
    grid-template-columns: 1fr auto;
    gap: 12px;
    align-items: end;
}

.whatsapp-input-shell {
    display: grid;
    grid-template-columns: 28px 1fr;
    align-items: end;
    gap: 8px;
    padding: 10px 12px;
    border-radius: 24px;
    border: 1px solid rgba(113,154,214,.16);
    background: rgba(255,255,255,.05);
}

.whatsapp-input-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    color: #9cb0cc;
    font-size: 1.05rem;
}

.whatsapp-message-input.form-control {
    min-height: 44px !important;
    max-height: 140px;
    padding: 8px 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    resize: none;
}

.whatsapp-message-input.form-control:focus {
    box-shadow: none !important;
}

.whatsapp-send-btn {
    width: 52px;
    min-width: 52px;
    height: 52px;
    border-radius: 50% !important;
    padding: 0 !important;
    font-size: 1.05rem;
    box-shadow: 0 10px 22px rgba(11,99,246,.24);
}

.chat-typing-indicator {
    padding: 0 18px 8px !important;
    margin-top: 0 !important;
    font-size: .86rem !important;
}

@media (max-width: 767.98px) {
    .whatsapp-chat-header {
        padding: 14px 14px;
    }

    .whatsapp-chat-messages {
        padding: 14px 10px 8px;
        min-height: 58vh !important;
        max-height: 66vh;
    }

    .whatsapp-chat-messages .comm-message-card {
        max-width: 90%;
        padding: 9px 11px 8px !important;
    }

    .whatsapp-compose-form {
        padding: 12px 10px 12px;
    }

    .whatsapp-compose-row {
        grid-template-columns: 1fr auto !important;
        gap: 8px !important;
    }

    .whatsapp-send-btn {
        width: 48px;
        min-width: 48px;
        height: 48px;
    }
}


/* Kommunikation WhatsApp REAL v3 FINAL */
.wa-chat-shell {
    max-width: 980px;
    margin: 0 auto;
}

.wa-chat-card {
    border-radius: 26px;
    overflow: hidden;
    background:
        radial-gradient(circle at top right, rgba(59,130,246,.06), transparent 24%),
        linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.015));
    border: 1px solid rgba(113,154,214,.12);
    box-shadow: 0 18px 45px rgba(0,0,0,.18);
}

.wa-chat-header {
    position: sticky;
    top: 0;
    z-index: 4;
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    padding: 14px 16px;
    background: rgba(10,16,28,.92);
    border-bottom: 1px solid rgba(113,154,214,.12);
    backdrop-filter: blur(10px);
}

.wa-chat-title {
    margin: 0;
    font-size: 1.22rem;
    font-weight: 700;
    line-height: 1.15;
}

.wa-chat-subtitle {
    margin-top: 3px;
    color: #9cb0cc;
    font-size: .88rem;
}

.wa-back-btn {
    white-space: nowrap;
}

.wa-chat-messages {
    padding: 14px 12px 8px;
    min-height: 56vh;
    max-height: 66vh;
    overflow-y: auto;
    background:
        radial-gradient(circle at 15% 20%, rgba(255,255,255,.018), transparent 18%),
        radial-gradient(circle at 82% 36%, rgba(255,255,255,.016), transparent 16%),
        linear-gradient(180deg, rgba(6,12,22,.62), rgba(7,12,20,.9));
}

.wa-message {
    display: flex;
    width: 100%;
    margin: 2px 0;
}

.wa-own {
    justify-content: flex-end;
}

.wa-other {
    justify-content: flex-start;
}

.wa-bubble {
    width: auto;
    max-width: 78%;
    min-width: 88px;
    padding: 8px 10px 6px;
    border-radius: 18px;
    box-shadow: 0 8px 20px rgba(0,0,0,.12);
    position: relative;
}

.wa-own .wa-bubble {
    background: linear-gradient(180deg, rgba(11,99,246,.22), rgba(11,99,246,.16));
    border: 1px solid rgba(11,99,246,.18);
    border-bottom-right-radius: 6px;
}

.wa-other .wa-bubble {
    background: rgba(255,255,255,.055);
    border: 1px solid rgba(113,154,214,.12);
    border-bottom-left-radius: 6px;
}

.wa-meta {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    align-items: baseline;
    margin-bottom: 4px;
}

.wa-meta-group .wa-author {
    color: #f2f7ff;
    font-weight: 700;
    font-size: .93rem;
}

.wa-user {
    color: #93a6c4;
    font-size: .78rem;
}

.wa-text {
    color: #f8fbff;
    font-size: .98rem;
    line-height: 1.42;
    white-space: normal;
    word-break: break-word;
}

.wa-tail-meta {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 5px;
    margin-top: 4px;
    min-height: 16px;
}

.wa-time {
    color: #9eb2cf;
    font-size: .72rem;
    line-height: 1;
}

.whatsapp-receipt,
.pm-read-receipt.whatsapp-receipt {
    border: 0 !important;
    background: transparent !important;
    padding: 0 !important;
    min-height: auto !important;
    margin: 0 !important;
    font-size: .78rem !important;
    font-weight: 800 !important;
    line-height: 1 !important;
}

.whatsapp-receipt.is-sent {
    color: #cbd5e1 !important;
}

.whatsapp-receipt.is-read {
    color: #7dd3fc !important;
}

.wa-typing-indicator {
    padding: 2px 14px 8px;
    min-height: 24px;
    color: #9cb0cc;
    font-size: .86rem;
}

.wa-compose-form {
    padding: 12px;
    border-top: 1px solid rgba(113,154,214,.12);
    background: rgba(10,16,28,.92);
}

.wa-compose-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    align-items: end;
}

.wa-input-shell {
    display: grid;
    grid-template-columns: 24px 1fr;
    align-items: end;
    gap: 8px;
    padding: 8px 12px;
    border-radius: 24px;
    border: 1px solid rgba(113,154,214,.15);
    background: rgba(255,255,255,.05);
}

.wa-input-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    color: #9cb0cc;
    font-size: 1rem;
}

.wa-message-input.form-control {
    min-height: 42px !important;
    max-height: 130px;
    padding: 8px 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    resize: none;
}

.wa-message-input.form-control:focus {
    box-shadow: none !important;
}

.wa-send-btn {
    width: 48px;
    min-width: 48px;
    height: 48px;
    border-radius: 50% !important;
    padding: 0 !important;
    font-size: 1rem;
    box-shadow: 0 10px 20px rgba(11,99,246,.2);
}

@media (max-width: 767.98px) {
    .wa-chat-header {
        padding: 12px;
    }

    .wa-chat-title {
        font-size: 1.1rem;
    }

    .wa-chat-subtitle {
        font-size: .82rem;
    }

    .wa-chat-messages {
        padding: 12px 8px 8px;
        min-height: 60vh;
        max-height: 68vh;
    }

    .wa-bubble {
        max-width: 88%;
        padding: 8px 10px 6px;
    }

    .wa-text {
        font-size: .96rem;
    }

    .wa-compose-form {
        padding: 10px 8px;
    }

    .wa-send-btn {
        width: 46px;
        min-width: 46px;
        height: 46px;
    }
}

/* hard neutralize old card-style wrappers */
.wa-chat-shell .comm-message,
.wa-chat-shell .comm-message-own,
.wa-chat-shell .comm-message-card,
.wa-chat-shell #chat_messages .card,
.wa-chat-shell #chat_messages > .card,
.wa-chat-shell #chat_messages > div > .card {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
}


/* Kommunikation WhatsApp REAL v4 FINAL */
.wa-chat-shell {
    max-width: 1000px;
}

.wa-chat-card {
    border-radius: 24px;
}

.wa-chat-header {
    padding: 12px 14px;
    min-height: 78px;
}

.wa-chat-head-left {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    flex: 1 1 auto;
}

.wa-avatar {
    width: 44px;
    min-width: 44px;
    height: 44px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(180deg, rgba(11,99,246,.28), rgba(11,99,246,.14));
    border: 1px solid rgba(11,99,246,.24);
    color: #eef6ff;
    font-size: .9rem;
    font-weight: 800;
    box-shadow: 0 8px 18px rgba(11,99,246,.14);
}

.wa-chat-header-main {
    min-width: 0;
    flex: 1 1 auto;
}

.wa-chat-title {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.15;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.wa-chat-subtitle {
    margin-top: 4px;
    color: #9cb0cc;
    font-size: .8rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.presence-inline-badge {
    margin-left: 0 !important;
    min-height: 18px !important;
    padding: 1px 7px !important;
    font-size: .72rem !important;
}

.wa-back-btn {
    min-width: 48px;
    width: 48px;
    height: 44px;
    border-radius: 16px !important;
    padding: 0 !important;
    font-size: 1.1rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.wa-chat-messages {
    padding: 12px 10px 8px;
    min-height: 58vh;
    max-height: 68vh;
}

.wa-message {
    margin: 1px 0 5px;
}

.wa-bubble {
    max-width: min(76%, 560px);
    min-width: 72px;
    padding: 8px 10px 7px;
}

.wa-text {
    font-size: .98rem;
    line-height: 1.36;
}

.wa-time {
    font-size: .7rem;
}

.wa-compose-form {
    padding: 10px;
}

.wa-compose-row {
    grid-template-columns: 1fr auto;
    gap: 8px;
}

.wa-input-shell {
    grid-template-columns: 20px 1fr;
    padding: 6px 10px;
    min-height: 48px;
}

.wa-input-icon {
    min-height: 34px;
    font-size: .95rem;
}

.wa-message-input.form-control {
    min-height: 34px !important;
    height: 34px;
    max-height: 110px;
    font-size: .97rem;
    line-height: 1.3;
}

.wa-send-btn {
    width: 46px;
    min-width: 46px;
    height: 46px;
    font-size: .95rem;
}

@media (max-width: 767.98px) {
    .wa-chat-header {
        padding: 10px 10px;
        min-height: 72px;
    }

    .wa-avatar {
        width: 38px;
        min-width: 38px;
        height: 38px;
        font-size: .82rem;
    }

    .wa-chat-title {
        font-size: .98rem;
        max-width: 100%;
    }

    .wa-chat-subtitle {
        font-size: .76rem;
    }

    .wa-chat-messages {
        padding: 10px 8px 8px;
        min-height: 61vh;
        max-height: 69vh;
    }

    .wa-bubble {
        max-width: 84%;
        min-width: 64px;
        padding: 8px 10px 7px;
    }

    .wa-text {
        font-size: .97rem;
    }

    .wa-compose-form {
        padding: 8px;
    }

    .wa-input-shell {
        min-height: 44px;
    }

    .wa-send-btn {
        width: 44px;
        min-width: 44px;
        height: 44px;
    }
}


/* Hamburger Counter Sync REAL Final */
.menu-communication-counter {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 7px;
    margin-left: 8px;
    border-radius: 999px;
    background: rgba(11,99,246,.18);
    color: #b9d6ff;
    border: 1px solid rgba(11,99,246,.28);
    font-size: .76rem;
    font-weight: 700;
    vertical-align: middle;
}


/* Kommunikation Rebuild WhatsApp REAL FINAL */
.comm-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.comm-list-item {
    display: block;
    border: 1px solid rgba(113,154,214,.18);
    border-radius: 22px;
    padding: 18px 18px 16px;
    background: rgba(255,255,255,.03);
}
.comm-list-top {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    align-items: flex-start;
    margin-bottom: 8px;
}
.comm-badge,
.comm-section-badge,
.menu-communication-counter {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 22px;
    padding: 0 8px;
    border-radius: 999px;
    background: rgba(11,99,246,.18);
    color: #b9d6ff;
    border: 1px solid rgba(11,99,246,.28);
    font-size: .76rem;
    font-weight: 700;
    vertical-align: middle;
}
.presence-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-left: 6px;
    vertical-align: middle;
    background: #7a8597;
}
.presence-dot.online {
    background: #7bd88f;
}
.presence-dot.offline {
    background: #7a8597;
}
.presence-inline-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 18px;
    padding: 1px 7px;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 700;
}
.presence-inline-badge.online {
    background: rgba(123,216,143,.14);
    color: #bff0c8;
    border: 1px solid rgba(123,216,143,.28);
}
.presence-inline-badge.offline {
    background: rgba(122,133,151,.14);
    color: #c3cad5;
    border: 1px solid rgba(122,133,151,.28);
}
.wa-chat-shell {
    max-width: 1000px;
    margin: 0 auto;
}
.wa-chat-card {
    border-radius: 24px;
    overflow: hidden;
    background:
        radial-gradient(circle at top right, rgba(59,130,246,.06), transparent 24%),
        linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.015));
    border: 1px solid rgba(113,154,214,.12);
    box-shadow: 0 18px 45px rgba(0,0,0,.18);
}
.wa-chat-header {
    position: sticky;
    top: 0;
    z-index: 4;
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    padding: 12px 14px;
    min-height: 78px;
    background: rgba(10,16,28,.92);
    border-bottom: 1px solid rgba(113,154,214,.12);
    backdrop-filter: blur(10px);
}
.wa-chat-head-left {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    flex: 1 1 auto;
}
.wa-avatar {
    width: 44px;
    min-width: 44px;
    height: 44px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(180deg, rgba(11,99,246,.28), rgba(11,99,246,.14));
    border: 1px solid rgba(11,99,246,.24);
    color: #eef6ff;
    font-size: .9rem;
    font-weight: 800;
    box-shadow: 0 8px 18px rgba(11,99,246,.14);
}
.wa-chat-header-main {
    min-width: 0;
    flex: 1 1 auto;
}
.wa-chat-title {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.15;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.wa-chat-subtitle {
    margin-top: 4px;
    color: #9cb0cc;
    font-size: .8rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.wa-back-btn {
    min-width: 48px;
    width: 48px;
    height: 44px;
    border-radius: 16px !important;
    padding: 0 !important;
    font-size: 1.1rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.wa-chat-messages {
    padding: 12px 10px 8px;
    min-height: 58vh;
    max-height: 68vh;
    overflow-y: auto;
    background:
        radial-gradient(circle at 15% 20%, rgba(255,255,255,.018), transparent 18%),
        radial-gradient(circle at 82% 36%, rgba(255,255,255,.016), transparent 16%),
        linear-gradient(180deg, rgba(6,12,22,.62), rgba(7,12,20,.9));
}
.wa-message {
    display: flex;
    width: 100%;
    margin: 1px 0 5px;
}
.wa-own {
    justify-content: flex-end;
}
.wa-other {
    justify-content: flex-start;
}
.wa-bubble {
    max-width: min(76%, 560px);
    min-width: 72px;
    padding: 8px 10px 7px;
    border-radius: 18px;
    box-shadow: 0 8px 20px rgba(0,0,0,.12);
    position: relative;
}
.wa-own .wa-bubble {
    background: linear-gradient(180deg, rgba(11,99,246,.22), rgba(11,99,246,.16));
    border: 1px solid rgba(11,99,246,.18);
    border-bottom-right-radius: 6px;
}
.wa-other .wa-bubble {
    background: rgba(255,255,255,.055);
    border: 1px solid rgba(113,154,214,.12);
    border-bottom-left-radius: 6px;
}
.wa-meta {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    align-items: baseline;
    margin-bottom: 4px;
}
.wa-meta-group .wa-author {
    color: #f2f7ff;
    font-weight: 700;
    font-size: .93rem;
}
.wa-user {
    color: #93a6c4;
    font-size: .78rem;
}
.wa-text {
    color: #f8fbff;
    font-size: .98rem;
    line-height: 1.42;
    word-break: break-word;
}
.wa-tail-meta {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 5px;
    margin-top: 4px;
    min-height: 16px;
}
.wa-time {
    color: #9eb2cf;
    font-size: .72rem;
    line-height: 1;
}
.whatsapp-receipt,
.pm-read-receipt.whatsapp-receipt {
    border: 0 !important;
    background: transparent !important;
    padding: 0 !important;
    min-height: auto !important;
    margin: 0 !important;
    font-size: .78rem !important;
    font-weight: 800 !important;
    line-height: 1 !important;
}
.whatsapp-receipt.is-sent {
    color: #cbd5e1 !important;
}
.whatsapp-receipt.is-read {
    color: #7dd3fc !important;
}
.wa-typing-indicator {
    padding: 2px 14px 8px;
    min-height: 24px;
    color: #9cb0cc;
    font-size: .86rem;
}
.wa-compose-form {
    padding: 10px;
    border-top: 1px solid rgba(113,154,214,.12);
    background: rgba(10,16,28,.92);
}
.wa-compose-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    align-items: end;
}
.wa-input-shell {
    display: grid;
    grid-template-columns: 20px 1fr;
    align-items: end;
    gap: 8px;
    padding: 6px 10px;
    min-height: 48px;
    border-radius: 24px;
    border: 1px solid rgba(113,154,214,.15);
    background: rgba(255,255,255,.05);
}
.wa-input-icon {
    min-height: 34px;
    color: #9cb0cc;
    font-size: .95rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.wa-message-input.form-control {
    min-height: 34px !important;
    height: 34px;
    max-height: 110px;
    padding: 8px 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    resize: none;
    font-size: .97rem;
    line-height: 1.3;
}
.wa-message-input.form-control:focus {
    box-shadow: none !important;
}
.wa-send-btn {
    width: 46px;
    min-width: 46px;
    height: 46px;
    border-radius: 50% !important;
    padding: 0 !important;
    font-size: .95rem;
}
.browser-notification-toggle {
    display: flex;
    justify-content: flex-end;
    margin: 8px 0 12px;
}
@media (max-width: 767.98px) {
    .wa-chat-header {
        padding: 10px;
        min-height: 72px;
    }
    .wa-avatar {
        width: 38px;
        min-width: 38px;
        height: 38px;
        font-size: .82rem;
    }
    .wa-chat-title {
        font-size: .98rem;
    }
    .wa-chat-subtitle {
        font-size: .76rem;
    }
    .wa-chat-messages {
        padding: 10px 8px 8px;
        min-height: 61vh;
        max-height: 69vh;
    }
    .wa-bubble {
        max-width: 84%;
        min-width: 64px;
    }
    .wa-compose-form {
        padding: 8px;
    }
    .wa-send-btn {
        width: 44px;
        min-width: 44px;
        height: 44px;
    }
    .browser-notification-toggle .btn {
        width: 100%;
    }
}


/* Hamburger Menu Live FIX FINAL */
[data-menu-communication-link="1"] .menu-communication-counter,
.menu-communication-counter {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 7px;
    margin-left: 8px;
    border-radius: 999px;
    background: rgba(11,99,246,.18);
    color: #b9d6ff;
    border: 1px solid rgba(11,99,246,.28);
    font-size: .76rem;
    font-weight: 700;
    line-height: 1;
    vertical-align: middle;
    box-shadow: none !important;
}

[data-menu-communication-link="1"] .menu-communication-counter.d-none,
.menu-communication-counter.d-none {
    display: none !important;
}


/* Hamburger Counter SourceFix FINAL */
.offcanvas #commTotalUnreadBadge,
.drawer #commTotalUnreadBadge,
.sidebar #commTotalUnreadBadge,
.mobile-menu #commTotalUnreadBadge,
nav #commTotalUnreadBadge {
    display: none !important;
}

/* Push Background FINAL */
.push-nav-item{display:flex;align-items:center;gap:6px}
@media(max-width:767.98px){.push-nav-item .btn{width:100%;margin-top:4px}}

/* Notification Merge FINAL */
[data-notification],
[data-browser-notification],
.browser-notification-box,
.legacy-notification-box,
.notification-debug,
.notification-status-box {
  display: none !important;
}
.unified-push-control,.push-nav-item{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
@media(max-width:767.98px){.unified-push-control,.push-nav-item{display:block}.unified-push-control .btn,.push-nav-item .btn{width:100%;margin-top:6px}}