/* Значок «?» мануал-модалки и её окно (см. agent-rules/manual-modal.md).
   Отдельный файл, а не стили внутри newsletter.css: значки стоят на разных
   разделах, и тащить ради них вёрстку рассылки некуда. Подключён в
   layouts/app.blade.php — значок может появиться на любой странице. */

.manual-hint {
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    margin-left: 6px;
}

.manual-hint__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    padding: 0;
    border: 1px solid #3D5632;
    border-radius: 50%;
    background: transparent;
    color: #3D5632;
    font-family: 'GolosText-SemiBold', sans-serif;
    font-size: 12px;
    line-height: 1;
    cursor: pointer;
    transition: background-color 0.2s, color 0.2s;
}

.manual-hint__btn:hover {
    background-color: #3D5632;
    color: #FFF4E7;
}

/* Пояснение под этот ключ ещё не написано — видит только админ. */
.manual-hint__btn--empty {
    border-color: #9D653F;
    border-style: dashed;
    color: #9D653F;
}

.manual-hint__btn--empty:hover {
    background-color: #9D653F;
    color: #FFF4E7;
}

.manual-modal {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(33, 33, 45, 0.55);
}

.manual-modal__dialog {
    position: relative;
    width: 100%;
    max-width: 640px;
    max-height: 85vh;
    overflow-y: auto;
    padding: 28px 32px;
    border-radius: 12px;
    background: #FFF8EC;
    box-shadow: 0 24px 60px rgba(33, 33, 45, 0.3);
}

.manual-modal__close {
    position: absolute;
    top: 12px;
    right: 16px;
    border: none;
    background: none;
    font-size: 26px;
    line-height: 1;
    color: #5c5851;
    cursor: pointer;
}

.manual-modal__title {
    margin: 0 0 16px;
    padding-right: 28px;
    font-family: 'Oswald-Medium', sans-serif;
    font-size: 22px;
    line-height: 130%;
    color: #3D5632;
}

.manual-modal__loading {
    font-family: 'GolosText-Regular', sans-serif;
    color: #5c5851;
}

.manual-modal__body {
    font-family: 'GolosText-Regular', sans-serif;
    font-size: 15px;
    line-height: 160%;
    color: #2f2b26;
}

.manual-modal__body p { margin: 0 0 12px; }
.manual-modal__body h3 { margin: 18px 0 8px; font-size: 17px; color: #3D5632; }
.manual-modal__body h4 { margin: 14px 0 6px; font-size: 15px; color: #3D5632; }

/* Tailwind preflight сбрасывает маркеры — задаём явно. */
.manual-modal__body ul { margin: 0 0 12px; padding-left: 22px; list-style: disc; }
.manual-modal__body ol { margin: 0 0 12px; padding-left: 22px; list-style: decimal; }
.manual-modal__body li { margin-bottom: 4px; }

.manual-modal__body code {
    padding: 1px 5px;
    border-radius: 4px;
    background: rgba(61, 86, 50, 0.1);
    font-size: 13px;
}

.manual-modal__body a { color: #9D653F; }

.manual-modal__file {
    margin: 16px 0 0;
    font-family: 'GolosText-Regular', sans-serif;
    font-size: 14px;
}

.manual-modal__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin: 18px 0 0;
    padding-top: 12px;
    border-top: 1px solid rgba(61, 86, 50, 0.15);
    font-family: 'GolosText-Regular', sans-serif;
    font-size: 13px;
    color: #5c5851;
}

.manual-modal__meta a { color: #9D653F; }

@media (max-width: 767.98px) {
    .manual-modal__dialog {
        padding: 24px 18px;
    }
}

/* ==========================================================================
   Раздел админки «Пояснения» (/admin/manual)
   ========================================================================== */
.admin-manual {
    font-family: 'GolosText-Regular', sans-serif;
}

.admin-manual__summary {
    margin-bottom: 20px;
    font-size: 15px;
    color: #4a453e;
}

.admin-manual__summary p { margin: 0 0 6px; }
.admin-manual__pending { color: #9D653F; }
.admin-manual__done { color: #3D5632; }

.admin-manual__toolbar {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 22px;
}

/* Глобальный .input тянется на всю ширину — панель фильтра от этого разъезжается. */
.admin-manual__toolbar .input {
    width: 360px;
    max-width: 100%;
}

.admin-manual__only-empty {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    color: #4a453e;
    cursor: pointer;
}

.admin-manual__group {
    margin-bottom: 28px;
}

.admin-manual__group-title {
    margin: 0 0 10px;
    font-family: 'Oswald-Medium', sans-serif;
    font-size: 20px;
    color: #3D5632;
}

.admin-manual__table {
    width: 100%;
    border-collapse: collapse;
    background: #FFF8EC;
    font-size: 14px;
}

.admin-manual__table th,
.admin-manual__table td {
    padding: 10px 12px;
    border-bottom: 1px solid rgba(61, 86, 50, 0.12);
    text-align: left;
    vertical-align: top;
}

.admin-manual__table th {
    font-family: 'GolosText-SemiBold', sans-serif;
    color: #3D5632;
    white-space: nowrap;
}

.admin-manual__table code {
    font-size: 12px;
    color: #5c5851;
}

.admin-manual__empty {
    color: #9D653F;
}

.admin-manual__author {
    font-size: 12px;
    color: #8a857d;
}

.admin-manual__actions {
    display: flex;
    gap: 8px;
    white-space: nowrap;
}

.admin-manual__textarea {
    min-height: 320px;
    font-family: 'GolosText-Regular', monospace;
    line-height: 150%;
    resize: vertical;
}

.admin-manual__nothing {
    color: #5c5851;
}

@media (max-width: 767.98px) {
    .admin-manual__toolbar { flex-direction: column; align-items: flex-start; }
    .admin-manual__table { display: block; overflow-x: auto; }
}