/* ============================================================
   Slovo — Госуслуги (ЕСИА) (задача 5.8, v2.35+)
   Селекторы — с префиксом body.slovo-lms-body (фронт) и
   .slovo-esia-admin (админка). Стили с !important.
   Блоки: кнопка входа, ошибка, админ-страница, настройки,
   режим-переключатель, статус, инструкция (.is-visible).
   ============================================================ */

/* ---------- 1. Кнопка «Войти через Госуслуги» ---------- */
body.slovo-lms-body .slovo-esia-button-wrap {
    margin: 18px 0 !important;
    text-align: center !important;
}

body.slovo-lms-body .slovo-esia-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 12px 22px !important;
    background: #0d4cd3 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: background .2s ease !important;
    width: 100% !important;
    max-width: 400px !important;
    justify-content: center !important;
}

body.slovo-lms-body .slovo-esia-btn:hover {
    background: #0a3ea8 !important;
}

body.slovo-lms-body .slovo-esia-btn:disabled {
    opacity: .65 !important;
    cursor: default !important;
}

body.slovo-lms-body .slovo-esia-btn-logo {
    font-size: 18px !important;
}

body.slovo-lms-body .slovo-esia-btn-note {
    margin: 8px 0 0 !important;
    font-size: 12px !important;
    color: #6b7280 !important;
}

/* ---------- 2. Ошибка входа ---------- */
body.slovo-lms-body .slovo-esia-error,
.slovo-esia-admin .slovo-esia-error {
    margin: 12px 0 !important;
    padding: 10px 14px !important;
    background: #fdecea !important;
    border: 1px solid #f5c2c0 !important;
    border-radius: 6px !important;
    color: #b3261e !important;
    font-size: 14px !important;
}

/* ---------- 3. Админ-страница ---------- */
.slovo-esia-admin {
    max-width: 900px !important;
}

.slovo-esia-intro {
    margin: 16px 0 !important;
    padding: 14px 16px !important;
    background: #f6f7f7 !important;
    border-left: 4px solid #0d4cd3 !important;
    border-radius: 4px !important;
}

.slovo-esia-intro code {
    background: #fff !important;
    padding: 1px 5px !important;
    border-radius: 3px !important;
}

/* ---------- 4. Настройки ---------- */
.slovo-esia-settings {
    background: #fff !important;
    border: 1px solid #dcdcde !important;
    border-radius: 6px !important;
    padding: 20px !important;
    margin: 16px 0 !important;
}

.slovo-esia-field {
    margin-bottom: 18px !important;
}

.slovo-esia-field > label {
    display: block !important;
    font-weight: 600 !important;
    margin-bottom: 6px !important;
}

.slovo-esia-field input[type="text"],
.slovo-esia-field input[type="password"] {
    width: 100% !important;
    max-width: 460px !important;
    padding: 7px 10px !important;
    border: 1px solid #8c8f94 !important;
    border-radius: 4px !important;
    font-size: 14px !important;
}

.slovo-esia-help {
    margin: 6px 0 0 !important;
    font-size: 12px !important;
    color: #646970 !important;
}

.slovo-esia-secret-row {
    display: flex !important;
    gap: 8px !important;
    align-items: center !important;
    max-width: 460px !important;
}

.slovo-esia-secret-toggle {
    padding: 6px 10px !important;
    border: 1px solid #8c8f94 !important;
    border-radius: 4px !important;
    background: #f6f7f7 !important;
    cursor: pointer !important;
}

/* ---------- 5. Переключатель режима ---------- */
.slovo-esia-switch {
    display: inline-flex !important;
    border: 1px solid #8c8f94 !important;
    border-radius: 6px !important;
    overflow: hidden !important;
    margin-bottom: 6px !important;
}

.slovo-esia-mode-btn {
    padding: 8px 20px !important;
    border: none !important;
    background: #f6f7f7 !important;
    cursor: pointer !important;
    font-weight: 600 !important;
    color: #50575e !important;
}

.slovo-esia-mode-btn.is-active {
    background: #0d4cd3 !important;
    color: #fff !important;
}

/* ---------- 6. Статус ---------- */
.slovo-esia-status {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 8px 14px !important;
    border-radius: 20px !important;
    font-weight: 600 !important;
    margin-bottom: 16px !important;
    background: #f0f0f1 !important;
    color: #50575e !important;
}

.slovo-esia-status.is-connected {
    background: #e6f4ea !important;
    color: #1e7e34 !important;
}

.slovo-esia-status.is-disconnected {
    background: #f0f0f1 !important;
    color: #646970 !important;
}

.slovo-esia-status-dot {
    width: 10px !important;
    height: 10px !important;
    border-radius: 50% !important;
    background: #c3c4c7 !important;
}

.slovo-esia-status.is-connected .slovo-esia-status-dot {
    background: #1e7e34 !important;
}

/* ---------- 7. Действия и статус сохранения ---------- */
.slovo-esia-actions {
    display: flex !important;
    gap: 10px !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    margin-top: 8px !important;
}

.slovo-esia-save-status {
    font-size: 13px !important;
    font-weight: 600 !important;
}

.slovo-esia-save-status.is-saving { color: #646970 !important; }
.slovo-esia-save-status.is-ok     { color: #1e7e34 !important; }
.slovo-esia-save-status.is-error  { color: #b3261e !important; }

/* ---------- 8. Инструкция ---------- */
.slovo-esia-instructions {
    display: none !important;
    margin: 16px 0 !important;
    padding: 20px !important;
    background: #fff !important;
    border: 1px solid #dcdcde !important;
    border-radius: 6px !important;
}

.slovo-esia-instructions.is-visible {
    display: block !important;
}

.slovo-esia-instructions h2 {
    margin-top: 0 !important;
}

.slovo-esia-instructions h3 {
    margin: 18px 0 6px !important;
    font-size: 14px !important;
}

.slovo-esia-instructions code {
    background: #f0f0f1 !important;
    padding: 1px 6px !important;
    border-radius: 3px !important;
}