/**
 * Model feedback — стили блока отзывов/комментариев/вопросов.
 *
 * Часть использованных утилит отсутствует в собранном output.css, а полная
 * пересборка Tailwind затронула бы весь сайт. Поэтому недостающие правила
 * объявлены здесь и ограничены разметкой блока.
 */

.mf-block .flex-row-reverse,
.mf-modal .flex-row-reverse {
    flex-direction: row-reverse;
}

.mf-block .rounded-r-lg,
.mf-modal .rounded-r-lg {
    border-bottom-right-radius: 0.5rem;
    border-top-right-radius: 0.5rem;
}

/* КРИТИЧНО: в собранном output.css темы нет правила .hidden{display:none}
   (как и bg-black/60, z-[2000]). Поэтому оверлей и панели НЕЛЬЗЯ скрывать
   классом hidden — без своих правил оверлей висел прозрачным слоем
   position:fixed;inset:0 поверх страницы и перехватывал все клики. */
#mf-overlay {
    background: rgba(0, 0, 0, .6);
    display: none;
    inset: 0;
    position: fixed;
    z-index: 2000;
}

#mf-overlay:not(.hidden) {
    display: block;
}

/* Модалка */
.mf-modal {
    align-items: center;
    display: none;
    inset: 0;
    justify-content: center;
    padding: 0 1rem;
    position: fixed;
    z-index: 2001;
}

.mf-modal.flex:not(.hidden) {
    display: flex;
}

/* Вкладки и свёрнутые элементы блока */
.mf-block .mf-panel.hidden,
.mf-block .mf-reply-form.hidden,
.mf-block .mf-reply-msg.hidden,
.mf-modal .mf-msg.hidden {
    display: none;
}

.mf-modal > div {
    max-height: 90vh;
    overflow-y: auto;
}

.mf-modal .mf-submit:disabled,
.mf-block .mf-reply-form button:disabled {
    cursor: not-allowed;
    opacity: 0.6;
}

/* Оценка звёздами */
.mf-rating {
    gap: 0.25rem;
}

.mf-rating input {
    height: 1px;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    width: 1px;
}

.mf-rating .mf-star {
    color: #d1d5db;
    cursor: pointer;
    font-size: 26px;
    line-height: 1;
    transition: color 0.12s ease;
}

.mf-rating .mf-star.is-on {
    color: #f3b21b;
}

/* Поле загрузки пруфа */
.mf-modal input[type="file"] {
    font-size: 13px;
}

.mf-modal input[type="file"]::file-selector-button {
    background: #f3f4f6;
    border: 0;
    border-radius: 0.5rem;
    color: #374151;
    cursor: pointer;
    font-size: 13px;
    margin-right: 0.75rem;
    padding: 0.5rem 1rem;
}

.mf-modal input[type="file"]::file-selector-button:hover {
    background: #e5e7eb;
}

/* Горизонтальная лента вкладок на мобильном */
.mf-block .scrollbar-none {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.mf-block .scrollbar-none::-webkit-scrollbar {
    display: none;
}
