/* doc-project | projet/assets/css/admin-order-messages.css | feuille de style dediee au contenu de messagerie admin par dossier avec header, badge reponse attendue explicite, fil de discussion client atelier texte et images, formulaire de reponse multipart, preview upload presse-papiers, bouton repondre plus tard et compteur de caracteres pour styliser proprement la vue partielle injectee dans la modal admin */

.admin-order-messages {
    display: grid;
    gap: 1rem;
    margin-top: 0;
}

.admin-order-messages__image-zone {
    display: grid;
    gap: 0.65rem;
    padding: 0.85rem;
    border-radius: 1rem;
    border: 1px dashed rgba(15, 23, 42, 0.16);
    background: #ffffff;
}

.admin-order-messages__image-zone:focus-within,
.admin-order-messages__image-zone:focus-visible {
    outline: 2px solid rgba(59, 130, 246, 0.24);
    outline-offset: 2px;
}

.admin-order-messages__image-controls {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: end;
}

.admin-order-messages__image-controls label {
    flex: 1 1 240px;
}

.admin-order-messages__image-help {
    margin: 0;
    font-size: 0.9rem;
}

.admin-order-messages__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.admin-order-messages__header h3 {
    margin: 0;
}

.admin-order-messages__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin: 0.4rem 0 0;
}

.admin-order-messages__thread {
    display: block;
}

.admin-order-messages__list {
    display: grid;
    gap: 0.9rem;
}

.admin-order-messages__item {
    padding: 1rem 1rem 0.95rem;
    border-radius: 1rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: #ffffff;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.04);
}

.admin-order-messages__item.is-admin {
    border-color: rgba(59, 130, 246, 0.2);
    background: linear-gradient(180deg, rgba(239, 246, 255, 0.95) 0%, #ffffff 100%);
}

.admin-order-messages__item.is-client {
    border-color: rgba(16, 185, 129, 0.16);
    background: linear-gradient(180deg, rgba(240, 253, 244, 0.92) 0%, #ffffff 100%);
}

.admin-order-messages__item-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.6rem;
}

.admin-order-messages__item-body {
    color: #0f172a;
    line-height: 1.6;
    word-break: break-word;
}

.admin-order-messages__attachments,
.admin-order-messages__preview {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin-top: 0.75rem;
}

.admin-order-messages__attachment img,
.admin-order-messages__preview img {
    display: block;
    width: min(230px, 46vw);
    height: 150px;
    object-fit: cover;
    border-radius: 0.85rem;
    border: 1px solid rgba(15, 23, 42, 0.1);
    background: #ffffff;
}

.admin-order-messages__reply {
    display: grid;
    gap: 0.75rem;
    padding: 1rem;
    border-radius: 1rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(248, 250, 252, 0.9);
}

.admin-order-messages__reply label {
    display: grid;
    gap: 0.4rem;
    font-weight: 700;
    color: #0f172a;
}

.admin-order-messages__reply textarea {
    width: 100%;
    min-height: 8.5rem;
    resize: vertical;
}

.admin-order-messages__counter {
    margin: -0.15rem 0 0;
    text-align: right;
    font-size: 0.92rem;
}

.admin-order-messages__reply-later.is-active {
    border-color: rgba(199, 58, 58, 0.45);
    background: #c73a3a;
    color: #ffffff;
}

.admin-order-message-state {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.35rem 0.65rem;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.06);
    color: #0f172a;
    font-weight: 600;
}

.admin-order-message-state[hidden] {
    display: none !important;
}

.admin-order-message-state.is-alert {
    background: #c73a3a;
    color: #ffffff;
}

@media (max-width: 767px) {
    .admin-order-messages__item-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .admin-order-messages__meta {
        flex-direction: column;
        gap: 0.45rem;
    }
}