.mx-auto.my-4 {
    max-width: 720px;
}

/* Karta zgłoszenia */
.card {
    background: rgba(28, 28, 28, 0.52);
    color: rgba(237, 237, 237, 0.58);
}

.card-body .row.mb-2 {
    font-size: 1.07em;
}

.card-body .row.mb-2 .col-sm-6.text-start {
    text-align: start;
}

.card-body .row.mb-2 .col-sm-6.text-end {
    text-align: end;
}

.card-body .row.mb-2:last-child {
    font-size: 1.03em;
}

/* Czat messenger */
.chat-container {
    background: rgba(28, 28, 28, 0.52);
    padding: 22px 12px 20px 12px;
    border-radius: 15px;
    min-height: 210px;
    margin-bottom: 15px;
    display: flex;
    flex-direction: column;
    gap: 13px;
}

/* Bąbelki wiadomości */
.bubble-user, .bubble-player {
    max-width: 65%;
    background: #383b48;
    border-radius: 10px 16px 3px 16px;
    padding: 13px 15px;
    margin-bottom: 0;
    text-align: left;
    box-shadow: 0 2px 8px #0002;
    
    word-wrap: break-word;
    overflow-wrap: break-word;
    color: #e0e0e0;  /* tekst */
}

.bubble-admin {
    max-width: 65%;
    background: #e6c47218;
    border-radius: 16px 10px 16px 3px;
    padding: 13px 15px;
    margin-bottom: 0;
    text-align: right;
    box-shadow: 0 2px 8px #0002;
    
    word-wrap: break-word;
    overflow-wrap: break-word;
    color: #fbeee3; /* tekst */
}

.bubble-header-user, .bubble-header-player {
    font-size: 0.96em;
    color: #b6caed; /* nazwa gracza */
    margin-bottom: 4px;
}

.bubble-header-admin {
    font-size: 0.96em;
    color: #efb92c; /* nazwa admina */
    margin-bottom: 4px;
}

.bubble-header-time {
    color: #999;
    font-size: 0.92em;
    margin-left: 4px;
}

.message-row-left {
    display: flex;
    justify-content: flex-start;
}

.message-row-right {
    display: flex;
    justify-content: flex-end;
}


/* Formularz odpowiedzi */
form.reply-form {
    margin-top: 18px;
}

.reply-textarea {
    background: #232634;
    color: #ececec;
    border-radius: 12px;
    font-size: 1.08em;
    resize: vertical;
    padding: 13px;
}

.reply-error {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    margin-bottom: 0.5rem;
}

    .form-control_support {
        display: block;
        width: 100%;
        padding: 0.375rem 0.75rem;
        font-size: 1rem;
        font-weight: 400;
        line-height: 1.5;
        color:rgb(196, 197, 197);
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        background-color: rgba(28, 28, 28, 0.52);
        background-clip: padding-box;
        border: var(--bs-border-width) solid #1d2730;
        border-radius: var(--bs-border-radius);
        transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    }
    .form-select_support {
        --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1…d' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
        display: block;
        width: 100%;
        padding: 0.375rem 2.25rem 0.375rem 0.75rem;
        font-size: 1rem;
        font-weight: 400;
        line-height: 1.5;
        color:rgb(196, 197, 197);
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        background-color: rgba(28, 28, 28, 0.52);
        background-image: var(--bs-form-select-bg-img), var(--bs-form-select-bg-icon, none);
        background-repeat: no-repeat;
        background-position: right 0.75rem center;
        background-size: 16px 12px;
        border: var(--bs-border-width) solid #1d2730;
        border-radius: var(--bs-border-radius);
        transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    }