/* =========================================
   BESCHWERDE-LAUFBAND – TABLET
========================================= */

@media (max-width: 900px) {

    .public-complaints-banner {

        margin: 8px 0;

    }


    .public-complaint-item {

        margin-right: 30px;

        padding: 9px 14px;

    }

}


/* =========================================
   BESCHWERDE-LAUFBAND – MOBILE
========================================= */

@media (max-width: 700px) {

    .public-complaints-banner {

        margin: 6px 0;

    }


    .public-complaints-label {

        padding: 8px 10px;

        font-size: 0.85rem;

    }


    .public-complaint-item {

        padding: 8px 14px;

        margin-right: 20px;

        font-size: 0.9rem;

    }


    .public-complaint-title {

        max-width: 220px;

        overflow: hidden;

        text-overflow: ellipsis;

    }


    .public-complaint-location {

        max-width: 140px;

        overflow: hidden;

        text-overflow: ellipsis;

    }


    .public-complaint-support,
    .complaint-support {

        align-items: stretch;

        flex-direction: column;

    }


    .support-button {

        width: 100%;

        min-width: 0;

    }


    .complaint-meta {

        flex-direction: column;

        gap: 5px;

    }


    .my-complaint-card,
    .public-complaint-detail {

        padding: 14px;

    }

}


/* =========================================
   SEHR KLEIN
========================================= */

@media (max-width: 450px) {

    .public-complaints-label {

        font-size: 0.78rem;

        padding: 7px 8px;

    }


    .public-complaint-item {

        font-size: 0.82rem;

        gap: 6px;

        margin-right: 12px;

    }


    .content-card {

        padding: 14px;

    }

}

/* =========================================
   PHASE 6.4 – ADMIN RESPONSIVE
========================================= */

@media (max-width: 900px) {

    #content .admin-complaint-search-row,
    #content .admin-complaint-location-filter,
    #content .admin-dashboard-actions,
    #content .admin-filter-buttons,
    #content .complaint-admin-actions {
        gap: 6px !important;
    }

    #content #admin-complaint-search-input {
        flex: 1 1 320px;
    }

    body #content .admin-complaints-toolbar .complaint-button,
    body #content .admin-complaint-card .complaint-admin-actions .complaint-button {
        min-width: 0 !important;
    }
}


@media (max-width: 700px) {

    #content .admin-complaints-toolbar,
    #content .admin-complaint-card,
    #content .admin-user-report-card,
    #content .admin-audit-card {
        padding: 12px !important;
    }

    #content .admin-complaint-search-row,
    #content .admin-complaint-location-filter {
        align-items: stretch !important;
    }

    #content #admin-complaint-search-input,
    #content #admin-complaint-city-filter,
    #content #admin-complaint-postal-filter {
        width: 100% !important;
        max-width: none !important;
        flex: 1 1 100%;
    }

    #content .admin-complaint-location-filter label {
        width: 100%;
        margin-top: 3px;
    }

    body #content .admin-complaints-toolbar .complaint-button,
    body #content .admin-dashboard-actions .complaint-button,
    body #content .admin-filter-buttons .complaint-button,
    body #content .admin-complaint-card .complaint-admin-actions .complaint-button,
    #admin-sync-public-profiles,
    #admin-audit-log-button,
    #admin-emergency-plan-button {
        width: 100% !important;
        min-width: 0 !important;
        margin-right: 0 !important;
        justify-content: center !important;
    }

    #content .admin-dashboard-actions,
    #content .admin-filter-buttons,
    #content .complaint-admin-actions {
        flex-direction: column;
        align-items: stretch;
    }

    #content #admin-complaints-visible-count {
        width: fit-content;
        margin-left: 0 !important;
    }

    #content .admin-audit-meta {
        flex-direction: column;
        gap: 3px;
    }
}


@media (max-width: 450px) {

    #content .admin-complaints-toolbar h1 {
        font-size: 1.08rem !important;
    }

    #content .admin-complaint-card h2 {
        font-size: 0.98rem;
    }

    #content .admin-complaints-toolbar,
    #content .admin-complaint-card,
    #content .admin-user-report-card,
    #content .admin-audit-card {
        border-radius: 8px;
    }
}


/* =========================================
   PHASE 6.5 – NACHRICHTEN RESPONSIVE
========================================= */

@media (max-width: 700px) {

    .message-inbox-row {
        align-items: stretch;
        flex-direction: column;
        gap: 10px;
    }

    .message-inbox-main {
        min-width: 0;
        width: 100%;
    }

    .message-inbox-meta {
        flex-direction: column;
        align-items: flex-start;
        gap: 5px;
    }

    .message-inbox-card [data-open-conversation] {
        width: 100%;
    }

    .private-messages-list {
        padding: 12px;
    }

    .private-message-bubble {
        max-width: 92%;
        padding: 12px 13px;
    }

    .private-message-bubble-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }

    .private-message-compose-card,
    .private-message-safety-card,
    .conversation-header-card {
        padding: 14px;
    }

    #private-message-send-button,
    #messages-back-button,
    .private-message-safety-card .complaint-button {
        width: 100%;
        margin-right: 0;
    }
}

@media (max-width: 450px) {

    .private-message-bubble {
        max-width: 96%;
    }

    .messages-page-header,
    .message-inbox-card {
        padding: 13px 14px;
    }
}


/* =========================================
   PHASE 6.5 FIX – ADMIN-BESCHWERDE RESPONSIVE
========================================= */

@media (max-width: 1100px) {
    #content .admin-review-status-card {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    #content .admin-review-user-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    #content .admin-review-user-action {
        grid-column: 1 / -1;
    }

    #content .admin-review-complaint-meta,
    #content .admin-review-moderation-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    #content .admin-review-moderation-grid > div:nth-child(3) {
        border-left: 0;
        padding-left: 0;
        margin-top: 10px;
    }

    #content .admin-review-moderation-grid > div:nth-child(4) {
        margin-top: 10px;
    }
}

@media (max-width: 700px) {
    #content .admin-review-header {
        align-items: stretch;
        flex-direction: column;
        gap: 9px;
    }

    #content .admin-review-header h1 {
        font-size: 1.3rem;
    }

    #content .admin-review-header #admin-complaint-back {
        width: 100%;
    }

    #content .admin-review-status-card,
    #content .admin-review-user-grid,
    #content .admin-review-complaint-meta,
    #content .admin-review-moderation-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    #content .admin-review-moderation-grid > div,
    #content .admin-review-moderation-grid > div:nth-child(3) {
        padding: 0 0 9px;
        margin: 0;
        border-left: 0;
        border-bottom: 1px solid #e2e6ea;
    }

    #content .admin-review-moderation-grid > div:last-child {
        padding-bottom: 0;
        border-bottom: 0;
    }

    #content .admin-review-user-action .complaint-button,
    body #content .admin-review-actions .complaint-button {
        width: 100% !important;
        min-width: 0 !important;
    }

    body #content .admin-review-actions .admin-action-delete {
        margin-left: 0 !important;
    }
}

/* =========================================
   PHASE 6.6 – FORMULARE RESPONSIVE
========================================= */

@media (max-width: 700px) {
    #content #complaint-form,
    #content .city-selector-card {
        max-width: none;
        width: 100%;
    }

    #content input[type="text"],
    #content input[type="email"],
    #content input[type="password"],
    #content input[type="search"],
    #content input[type="number"],
    #content textarea,
    #content select {
        font-size: 16px;
        min-height: 44px;
    }

    #content textarea,
    #content .private-message-textarea {
        min-height: 115px;
    }

    #content .city-selector-card #postal-code {
        max-width: none;
    }

    #content #complaint-form .complaint-submit-button,
    #content .city-selector-card .complaint-button,
    #content #profile-save-button {
        width: 100%;
        min-height: 44px;
    }

    #register-modal {
        padding: 10px !important;
    }

    #register-modal-box {
        width: min(100%, 520px) !important;
        max-height: 94vh !important;
        padding: 20px 16px 16px !important;
        border-radius: 12px !important;
    }

    #register-modal-box > div[style*="grid-template-columns:1fr 1fr"] {
        grid-template-columns: 1fr !important;
    }

    #register-modal-box input[type="text"],
    #register-modal-box input[type="email"],
    #register-modal-box input[type="password"] {
        font-size: 16px;
        min-height: 44px;
    }

    .email-login-area {
        width: min(100%, 420px);
    }

    .email-login-area input[type="email"],
    .email-login-area input[type="password"] {
        width: 100%;
        min-height: 42px;
        font-size: 16px;
    }
}

@media (max-width: 450px) {
    #content .form-group {
        margin-bottom: 13px;
    }

    #content .complaint-notice {
        padding: 10px 11px;
    }

    #register-modal-box {
        padding-left: 13px !important;
        padding-right: 13px !important;
    }
}

/* =========================================
   PHASE 6.7 – RESPONSIVE GESAMT-FEINSCHLIFF
   Ergänzende Regeln; keine Funktionslogik.
========================================= */

html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

img,
video,
canvas {
    max-width: 100%;
}

#content,
#content * {
    box-sizing: border-box;
}

#content p,
#content li,
#content td,
#content th,
#content .complaint-description,
#content .private-message-text,
#content .admin-review-description {
    overflow-wrap: anywhere;
    word-break: normal;
}

/* Kleinere Desktopbreiten: Header darf geordnet umbrechen. */
@media (max-width: 1250px) and (min-width: 901px) {
    .site-header {
        flex-wrap: wrap;
        row-gap: 7px;
    }

    .header-actions {
        flex: 1 1 720px;
        flex-wrap: wrap;
    }

    #login-area,
    .user-area {
        flex-wrap: wrap;
    }

    #global-search-input {
        min-width: 170px;
        max-width: 280px;
    }
}

/* Tablet: Header, Suche und Benutzeraktionen sauber umbrechen. */
@media (max-width: 900px) {
    .site-header {
        flex-wrap: wrap;
        align-items: center;
    }

    .header-brand {
        flex: 0 0 auto;
    }

    .header-actions {
        flex: 1 1 100%;
        width: 100%;
        margin-left: 0;
        flex-wrap: wrap;
        justify-content: flex-start;
        align-items: center;
    }

    #city-area {
        flex: 1 1 220px;
        max-width: 100%;
    }

    #current-city {
        max-width: 100%;
    }

    #login-area,
    .user-area {
        flex: 1 1 auto;
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    #global-search-input {
        flex: 1 1 220px;
        width: auto;
        min-width: 160px;
        max-width: none;
    }

    .content-area {
        min-width: 0;
    }

    #content,
    .home-page,
    .welcome,
    .content-card {
        max-width: none;
    }

    .content-card,
    .public-complaint-detail,
    .my-complaint-card,
    .admin-review-card,
    .conversation-header-card,
    .private-message-compose-card,
    .private-message-safety-card {
        width: 100%;
    }

    table {
        max-width: 100%;
    }
}

/* Handy: Bedienflächen auf volle Breite, aber kompakt halten. */
@media (max-width: 650px) {
    .site-header {
        align-items: stretch;
    }

    .header-brand,
    .header-actions,
    #city-area,
    #login-area,
    .user-area {
        width: 100%;
        max-width: none;
    }

    .header-actions {
        display: grid;
        grid-template-columns: 1fr;
        gap: 7px;
    }

    #city-area,
    #login-area,
    .user-area {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
    }

    #current-city {
        flex: 1 1 180px;
    }

    #global-search-input {
        width: 100%;
        min-width: 0;
        max-width: none;
    }

    #login-area button,
    .login-button,
    #google-login-button,
    #logout-button,
    #admin-button,
    .user-area button {
        flex: 1 1 auto;
        min-height: 36px;
    }

    .mobile-navigation-bar {
        position: sticky;
        top: 0;
        z-index: 180;
    }

    .content-area {
        padding: 10px;
    }

    #content h1 {
        font-size: clamp(1.3rem, 7vw, 1.65rem);
        line-height: 1.2;
    }

    #content h2 {
        font-size: clamp(1.08rem, 5.5vw, 1.3rem);
        line-height: 1.25;
    }

    #content .complaint-button,
    #content button,
    #content input[type="submit"] {
        max-width: 100%;
    }

    #content .admin-review-actions,
    #content .complaint-actions,
    #content .profile-actions,
    #content .search-actions {
        flex-wrap: wrap;
    }

    #content .admin-review-actions > *,
    #content .complaint-actions > *,
    #content .profile-actions > *,
    #content .search-actions > * {
        min-width: 0;
    }

    #register-modal-box {
        overflow-y: auto;
        overscroll-behavior: contain;
    }

    #register-modal-box label {
        max-width: 100%;
        overflow-wrap: anywhere;
    }
}

/* Sehr kleine Geräte. */
@media (max-width: 420px) {
    .logo {
        font-size: 18px;
    }

    .mobile-navigation-bar {
        gap: 6px;
        padding-left: 8px;
        padding-right: 8px;
    }

    .mobile-navigation-button {
        padding-left: 8px;
        padding-right: 8px;
        font-size: 12px;
    }

    .content-area {
        padding: 8px;
    }

    .content-card,
    .my-complaint-card,
    .public-complaint-detail,
    .admin-complaint-card,
    .message-inbox-card,
    .conversation-header-card,
    .private-message-compose-card,
    .private-message-safety-card {
        padding: 11px !important;
        border-radius: 8px;
    }

    .private-message-bubble {
        max-width: 98%;
    }
}

/* =========================================
   PHASE 7.1 – UNGELESENE NACHRICHTEN
========================================= */

@media (max-width: 900px) {
    .messages-unread-badge,
    .conversation-unread-badge {
        min-width: 19px;
        height: 19px;
        padding: 0 5px;
        font-size: 0.68rem;
    }
}

@media (max-width: 520px) {
    #messages-button .messages-unread-badge {
        top: -5px;
        right: -5px;
    }

    .conversation-unread-badge {
        margin-left: 4px;
    }
}


/* =========================================
   PHASE 7.3 – BENACHRICHTIGUNGEN RESPONSIVE
========================================= */

@media (max-width: 1100px) {
    #notifications-button .notifications-button-label {
        display: none;
    }
}

@media (max-width: 760px) {
    .notifications-header-row {
        align-items: stretch;
        flex-direction: column;
    }

    .notification-read-all-button {
        width: 100%;
    }

    .notification-card {
        grid-template-columns: 40px minmax(0, 1fr);
        gap: 10px;
        padding: 14px;
    }

    .notification-icon {
        width: 38px;
        height: 38px;
        border-radius: 10px;
        font-size: 1.15rem;
    }

    .notification-actions {
        grid-column: 1 / -1;
        justify-content: stretch;
    }

    .notification-actions .complaint-button {
        flex: 1 1 150px;
    }
}

@media (max-width: 480px) {
    .notifications-header-card h1 {
        font-size: 1.25rem;
    }

    .notification-card {
        grid-template-columns: 1fr;
    }

    .notification-icon {
        display: none;
    }

    .notification-actions {
        grid-column: auto;
        flex-direction: column;
    }

    .notification-actions .complaint-button {
        width: 100%;
    }
}

/* =========================================
   PHASE 7.3 FIX – DESKTOP KOMPAKT / ADMIN-BESCHWERDE
   Liegt absichtlich in responsive.css, weil diese Datei
   nach cards.css geladen wird und dadurch sicher gewinnt.
========================================= */

/* Header rechts: kleine Bedienelemente */
body #login-area button,
body #login-area .login-button,
body #login-area #profile-button,
body #login-area #my-complaints-button,
body #login-area #messages-button,
body #login-area #notifications-button,
body #login-area #admin-button,
body #login-area #logout-button {
    width: auto !important;
    min-width: 0 !important;
    min-height: 24px !important;
    height: 24px !important;
    padding: 2px 7px !important;
    border-radius: 5px !important;
    font-size: 11px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

body #login-area .user-area {
    gap: 4px !important;
}

/* Admin-Beschwerde: äußerer Abstand */
body #content .admin-review-header,
body #content .admin-review-status-card,
body #content .admin-review-user-card,
body #content .admin-review-complaint-card,
body #content .admin-review-moderation-card,
body #content .admin-review-actions-card {
    border-radius: 8px !important;
    margin-bottom: 6px !important;
}

/* Kopf "Beschwerde prüfen" */
body #content .admin-review-header {
    gap: 9px !important;
    padding: 7px 10px !important;
}

body #content .admin-review-header h1 {
    margin: 0 !important;
    font-size: 18px !important;
    line-height: 1.1 !important;
}

body #content .admin-review-header #admin-complaint-back {
    width: auto !important;
    min-width: 0 !important;
    min-height: 26px !important;
    height: 26px !important;
    padding: 3px 8px !important;
    font-size: 11px !important;
    line-height: 1 !important;
}

/* Status / ID / Datum / Unterstützung */
body #content .admin-review-status-card {
    gap: 8px !important;
    padding: 7px 10px !important;
}

body #content .admin-review-label {
    margin-bottom: 2px !important;
    font-size: 10px !important;
    line-height: 1.1 !important;
}

body #content .admin-review-status-item,
body #content .admin-review-status-item span,
body #content .admin-review-status-item strong {
    font-size: 12px !important;
    line-height: 1.15 !important;
}

body #content .admin-review-status-card .my-complaint-status,
body #content .admin-review-status-card .complaint-status-open,
body #content .admin-review-status-card .complaint-status-check,
body #content .admin-review-status-card .complaint-status-published,
body #content .admin-review-status-card .complaint-status-rejected,
body #content .admin-review-status-card .public-complaint-status {
    margin: 1px 0 0 !important;
    padding: 2px 6px !important;
    font-size: 11px !important;
    line-height: 1.05 !important;
}

/* Benutzerkarte */
body #content .admin-review-user-card,
body #content .admin-review-complaint-card,
body #content .admin-review-moderation-card,
body #content .admin-review-actions-card {
    padding: 7px 10px !important;
}

body #content .admin-review-user-card h2,
body #content .admin-review-moderation-card h2 {
    margin: 0 0 6px !important;
    font-size: 15px !important;
    line-height: 1.1 !important;
}

body #content .admin-review-user-grid {
    gap: 6px 10px !important;
}

body #content .admin-review-user-grid span:not(.admin-review-label),
body #content .admin-review-user-grid strong,
body #content .admin-review-complaint-meta span:not(.admin-review-label),
body #content .admin-review-complaint-meta strong,
body #content .admin-review-moderation-grid span:not(.admin-review-label),
body #content .admin-review-moderation-grid strong {
    font-size: 12px !important;
    line-height: 1.18 !important;
}

/* Nachricht an Benutzer */
body #content .admin-review-user-action .complaint-button {
    width: auto !important;
    min-width: 0 !important;
    min-height: 26px !important;
    height: 26px !important;
    padding: 3px 8px !important;
    font-size: 11px !important;
    line-height: 1 !important;
}

/* Beschwerde-Inhalt */
body #content .admin-review-complaint-meta {
    gap: 6px 12px !important;
}

body #content .admin-review-description {
    margin-top: 5px !important;
    padding-top: 5px !important;
}

body #content .admin-review-description p {
    margin: 2px 0 0 !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
}

/* Automatische Vorprüfung */
body #content .admin-review-moderation-grid {
    margin-bottom: 6px !important;
}

body #content .admin-review-moderation-grid > div {
    padding: 0 8px !important;
}

body #content .admin-review-moderation-grid > div:first-child {
    padding-left: 0 !important;
}

body #content .admin-review-reports {
    margin-top: 5px !important;
    padding: 6px !important;
}

body #content .admin-review-reports h3 {
    margin: 0 0 4px !important;
    font-size: 12px !important;
}

/* Untere Admin-Aktionsbuttons */
body #content .admin-review-actions {
    gap: 5px !important;
}

body #content .admin-review-actions .complaint-button {
    width: auto !important;
    min-width: 0 !important;
    min-height: 26px !important;
    height: 26px !important;
    padding: 3px 8px !important;
    font-size: 11px !important;
    line-height: 1 !important;
}

/* Auf kleinen Displays nicht auf 24px quetschen */
@media (max-width: 650px) {
    body #login-area button,
    body #login-area .login-button,
    body #login-area #profile-button,
    body #login-area #my-complaints-button,
    body #login-area #messages-button,
    body #login-area #notifications-button,
    body #login-area #admin-button,
    body #login-area #logout-button {
        min-height: 32px !important;
        height: auto !important;
        padding: 5px 8px !important;
        font-size: 11px !important;
    }
}



/* =========================================
   PHASE 7.4 – BENACHRICHTIGUNGSEINSTELLUNGEN
========================================= */

@media (max-width: 650px) {
    .notifications-header-row,
    .notification-settings-head,
    .notification-setting-row {
        align-items: flex-start;
    }

    .notifications-header-actions {
        width: 100%;
        justify-content: flex-start;
    }

    .notification-settings-head {
        flex-direction: column;
    }

    .notification-setting-row {
        gap: 12px;
    }

    body #content .notification-settings-card .complaint-button,
    body #content .notifications-header-actions .complaint-button {
        min-height: 30px !important;
        height: 30px !important;
        font-size: 11px !important;
    }
}


/* =========================================
   PHASE 7.5 – ABSCHLUSS / RESPONSIVE / FOKUS
========================================= */

body #content .complaint-button:focus-visible,
body #login-area button:focus-visible,
body #content input:focus-visible,
body #content select:focus-visible,
body #content textarea:focus-visible {
    outline: 2px solid currentColor !important;
    outline-offset: 2px !important;
}

@media (max-width: 520px) {
    .notification-card {
        grid-template-columns: 34px minmax(0, 1fr) !important;
        gap: 8px !important;
        padding: 10px !important;
    }

    .notification-icon {
        width: 32px !important;
        height: 32px !important;
        font-size: 1rem !important;
        border-radius: 8px !important;
    }

    .notification-actions {
        grid-column: 1 / -1;
        justify-content: flex-start !important;
    }

    .notification-title-row h2 {
        font-size: 0.9rem !important;
    }

    .notification-text {
        font-size: 0.8rem !important;
        line-height: 1.35 !important;
    }
}


/* PHASE 8.5 – RECHTLICH RESPONSIVE */
@media (max-width: 650px) {
    .site-footer { padding: 10px 12px; }
    .legal-footer-nav { gap: 5px 9px; }
    .legal-page-head { align-items: flex-start; flex-direction: column; }
    .legal-document { font-size: 12px; line-height: 1.5; }
}


/* PHASE 9.2 – NEWS-ADMIN RESPONSIVE */
@media (max-width: 760px) {
    .news-admin-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .news-admin-filterbar,
    .news-admin-form {
        grid-template-columns: 1fr;
    }

    .news-admin-form-wide,
    .news-admin-form-actions {
        grid-column: auto;
    }

    .news-admin-card-top {
        align-items: flex-start;
    }
}


/* PHASE 9.3 – FIRESTORE NEWS-ADMIN RESPONSIVE */
@media (max-width: 760px) {
    .news-admin-header-actions {
        width: 100%;
        justify-content: flex-start;
    }
}


/* PHASE 9.4 – NEWS VORSCHAU */
@media (max-width: 650px) {
    .news-admin-preview {
        padding: 10px;
    }

    .news-admin-preview-image {
        max-height: 230px;
    }

    .news-admin-preview h2 {
        font-size: 16px;
    }

    .news-admin-image-preview,
    .news-admin-image-preview-empty {
        height: 140px;
    }
}


/* =========================================
   PHASE 9.5 – NEWS RESPONSIVE ABSCHLUSS
========================================= */

@media (max-width: 900px) {
    .news-admin-filterbar {
        grid-template-columns: 1fr 1fr;
    }

    .news-admin-search {
        grid-column: 1 / -1;
    }
}

@media (max-width: 650px) {
    .news-admin-page {
        gap: 8px;
    }

    .news-admin-filterbar {
        grid-template-columns: 1fr;
    }

    .news-admin-search {
        grid-column: auto;
    }

    .news-admin-card {
        padding: 9px;
    }

    .news-admin-card-top {
        flex-direction: column;
        gap: 6px;
    }

    .news-admin-meta {
        gap: 4px 8px;
    }

    .news-admin-actions {
        gap: 5px;
    }

    .news-admin-actions .complaint-button,
    .news-admin-header .complaint-button,
    .news-admin-form-actions .complaint-button,
    .news-admin-output .complaint-button,
    .admin-news-button {
        min-height: 27px;
        padding: 4px 7px;
        font-size: 10px;
    }

    .news-admin-preview-content {
        overflow-wrap: anywhere;
    }
}