/* ── OCR Settings Tab ──────────────────────────────────────────────────────── */

.ocr-settings {
    max-width: 680px;
    padding: 28px 0 40px;
}

.ocr-settings__title {
    font-size: 1.25rem;
    font-weight: 700;
    margin: 0 0 6px;
}

.ocr-settings__desc {
    color: var(--ocr-text-muted, #6b7280);
    margin: 0 0 24px;
    font-size: 0.9rem;
}

/* Notices */
.ocr-notice {
    border-radius: 6px;
    padding: 10px 16px;
    margin-bottom: 20px;
    font-size: 0.9rem;
    font-weight: 500;
}
.ocr-notice--success {
    background: #d1fae5;
    color: #065f46;
    border: 1px solid #6ee7b7;
}
.ocr-notice--error {
    background: #fee2e2;
    color: #991b1b;
    border: 1px solid #fca5a5;
}

/* Fieldsets */
.ocr-settings__fieldset {
    border: 1px solid var(--ocr-border, #e5e7eb);
    border-radius: 8px;
    padding: 20px 24px;
    margin-bottom: 20px;
}

.ocr-settings__legend {
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--ocr-text-muted, #6b7280);
    padding: 0 8px;
}

/* Rows */
.ocr-settings__row {
    display: flex;
    flex-direction: column;
    margin-bottom: 14px;
}
.ocr-settings__row:last-child {
    margin-bottom: 0;
}
.ocr-settings__row--half {
    flex-direction: row;
    gap: 16px;
}
.ocr-settings__row--half > div {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.ocr-settings__row label,
.ocr-settings__row--half > div label {
    font-size: 0.85rem;
    font-weight: 600;
    margin-bottom: 6px;
    color: var(--ocr-text, #111827);
}

.ocr-settings__row input[type="text"],
.ocr-settings__row input[type="email"],
.ocr-settings__row input[type="password"],
.ocr-settings__row input[type="number"],
.ocr-settings__row select,
.ocr-settings__row--half input[type="number"],
.ocr-settings__row--half select {
    border: 1px solid var(--ocr-border, #d1d5db);
    border-radius: 6px;
    padding: 8px 12px;
    font-size: 0.9rem;
    width: 100%;
    box-sizing: border-box;
    background: #fff;
    transition: border-color .15s;
}
.ocr-settings__row input:focus,
.ocr-settings__row select:focus,
.ocr-settings__row--half input:focus,
.ocr-settings__row--half select:focus {
    outline: none;
    border-color: var(--ocr-primary, #2563eb);
    box-shadow: 0 0 0 3px rgba(37,99,235,.12);
}

/* Password wrap */
.ocr-settings__password-wrap {
    position: relative;
    display: flex;
}
.ocr-settings__password-wrap input {
    flex: 1;
    padding-right: 44px;
}
.ocr-settings__toggle-pw {
    position: absolute;
    right: 4px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1rem;
    padding: 4px 8px;
    line-height: 1;
    color: var(--ocr-text-muted, #6b7280);
}

.ocr-settings__hint {
    margin: 6px 0 0;
    font-size: 0.78rem;
    color: var(--ocr-text-muted, #6b7280);
}

/* Actions */
.ocr-settings__actions {
    display: flex;
    gap: 12px;
    margin-top: 4px;
    flex-wrap: wrap;
}

/* Reference table */
.ocr-settings__ref {
    margin-top: 32px;
    border: 1px solid var(--ocr-border, #e5e7eb);
    border-radius: 8px;
    padding: 0;
    overflow: hidden;
}
.ocr-settings__ref summary {
    cursor: pointer;
    padding: 14px 20px;
    font-weight: 600;
    font-size: 0.875rem;
    background: var(--ocr-surface, #f9fafb);
    user-select: none;
}
.ocr-settings__ref-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.82rem;
}
.ocr-settings__ref-table th,
.ocr-settings__ref-table td {
    padding: 9px 16px;
    text-align: left;
    border-top: 1px solid var(--ocr-border, #e5e7eb);
}
.ocr-settings__ref-table thead th {
    background: var(--ocr-surface, #f9fafb);
    font-weight: 600;
    color: var(--ocr-text-muted, #6b7280);
}

/* Responsive */
@media (max-width: 540px) {
    .ocr-settings__row--half {
        flex-direction: column;
    }
    .ocr-settings__actions {
        flex-direction: column;
    }
    .ocr-settings__actions .ocr-btn {
        width: 100%;
        text-align: center;
    }
}

/* ── Email Tab ──────────────────────────────────────────────────────────────── */

.ocr-email {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 180px);
    min-height: 400px;
}

.ocr-email__title {
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0;
}

.ocr-email__split {
    display: flex;
    flex: 1;
    gap: 0;
    border: 1px solid var(--ocr-border, #e5e7eb);
    border-radius: 8px;
    overflow: hidden;
    margin-top: 12px;
}

/* Message list pane */
.ocr-email__list-pane {
    width: 320px;
    min-width: 220px;
    border-right: 1px solid var(--ocr-border, #e5e7eb);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

#ocr-inbox-list {
    flex: 1;
    overflow-y: auto;
}

.ocr-inbox-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.ocr-inbox-msg {
    padding: 12px 16px;
    cursor: pointer;
    border-bottom: 1px solid var(--ocr-border, #e5e7eb);
    transition: background .1s;
}
.ocr-inbox-msg:hover,
.ocr-inbox-msg--active {
    background: var(--ocr-surface, #f9fafb);
}
.ocr-inbox-msg--unread .ocr-inbox-msg__from,
.ocr-inbox-msg--unread .ocr-inbox-msg__subject {
    font-weight: 700;
}
.ocr-inbox-msg__from {
    font-size: 0.8rem;
    color: var(--ocr-text-muted, #6b7280);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ocr-inbox-msg__subject {
    font-size: 0.875rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin: 2px 0;
}
.ocr-inbox-msg__date {
    font-size: 0.75rem;
    color: var(--ocr-text-muted, #6b7280);
}

.ocr-email__pagination {
    padding: 8px 12px;
    border-top: 1px solid var(--ocr-border, #e5e7eb);
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
}

/* Read pane */
.ocr-email__read-pane {
    flex: 1;
    overflow-y: auto;
    padding: 0;
}

.ocr-email__read-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: var(--ocr-text-muted, #9ca3af);
    font-size: 0.9rem;
    gap: 8px;
}

.ocr-email__read {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.ocr-email__read-header {
    padding: 20px 24px 16px;
    border-bottom: 1px solid var(--ocr-border, #e5e7eb);
    background: var(--ocr-surface, #f9fafb);
}

.ocr-email__read-subject {
    font-size: 1rem;
    font-weight: 700;
    margin: 0 0 6px;
}

.ocr-email__read-meta {
    display: flex;
    gap: 16px;
    font-size: 0.8rem;
    color: var(--ocr-text-muted, #6b7280);
    flex-wrap: wrap;
}

.ocr-email__read-body {
    padding: 20px 24px;
    flex: 1;
    font-size: 0.9rem;
    line-height: 1.6;
    overflow-y: auto;
}

.ocr-email__empty-state {
    text-align: center;
    padding: 60px 20px;
    color: var(--ocr-text-muted, #6b7280);
}
.ocr-email__empty-icon { font-size: 3rem; margin-bottom: 16px; }
.ocr-email__empty { padding: 32px; text-align: center; color: var(--ocr-text-muted, #9ca3af); }
.ocr-email__error { padding: 16px 20px; color: #dc2626; font-size: 0.875rem; }

/* Compose modal */
.ocr-modal__box--compose {
    width: 640px;
    max-width: 96vw;
}

.ocr-compose-form__field {
    display: flex;
    flex-direction: column;
    margin-bottom: 12px;
}

.ocr-compose-form__field label {
    font-size: 0.82rem;
    font-weight: 600;
    margin-bottom: 4px;
}

.ocr-compose-form__field--body textarea {
    resize: vertical;
}

.ocr-modal__footer {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-top: 12px;
    flex-wrap: wrap;
}

/* Settings additions */
.ocr-settings__section-heading {
    font-size: 1rem;
    font-weight: 700;
    margin: 28px 0 16px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.ocr-settings__section-icon { font-size: 1.1rem; }
.ocr-settings__divider {
    border: none;
    border-top: 1px solid var(--ocr-border, #e5e7eb);
    margin: 28px 0 0;
}

/* Icon button */
.ocr-btn--icon {
    background: none;
    border: 1px solid var(--ocr-border, #d1d5db);
    border-radius: 6px;
    cursor: pointer;
    font-size: 1rem;
    padding: 4px 10px;
    line-height: 1.4;
    transition: background .1s;
}
.ocr-btn--icon:hover { background: var(--ocr-surface, #f3f4f6); }

.ocr-toolbar__left {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Responsive */
@media (max-width: 640px) {
    .ocr-email__split { flex-direction: column; }
    .ocr-email__list-pane { width: 100%; min-width: 0; border-right: none; border-bottom: 1px solid var(--ocr-border, #e5e7eb); max-height: 240px; }
}