/* Vidro global dos diálogos, igual ao popup da Central de Atualizações. */
.modal-overlay,
.editor-modal-overlay,
.attachment-preview-modal {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    transition: none !important;
}

:is(.modal-card,.editor-modal-card,.attachment-preview-dialog) {
    border-color: rgba(15, 23, 42, .16) !important;
    background: rgba(246, 248, 252, .38) !important;
    background-image: none !important;
    box-shadow: 0 0 0 100vmax rgba(15, 23, 42, .50), inset 0 1px 0 rgba(255, 255, 255, .42) !important;
    backdrop-filter: blur(20px) saturate(145%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(145%) !important;
    transform: none !important;
    transition: none !important;
    will-change: auto;
}

[data-theme="dark"] :is(.modal-card,.editor-modal-card,.attachment-preview-dialog) {
    border-color: rgba(255, 255, 255, .14) !important;
    background: rgba(17, 19, 24, .38) !important;
    background-image: none !important;
    box-shadow: 0 0 0 100vmax rgba(0, 0, 0, .50), inset 0 1px 0 rgba(255, 255, 255, .08) !important;
    backdrop-filter: blur(20px) saturate(145%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(145%) !important;
}

.modal-overlay.visible .modal-card,
.editor-modal-overlay.visible .editor-modal-card,
.attachment-preview-modal.visible .attachment-preview-dialog {
    transform: none !important;
}

/* Superfícies estruturais devem deixar o vidro principal visível. */
:is(
    .modal-header,
    .modal-footer,
    .editor-modal-header,
    .editor-modal-footer,
    .editor-modal-actions,
    .attachment-preview-dialog > header,
    .attachment-preview-dialog > footer
) {
    background-color: transparent !important;
    background-image: none !important;
}

:is(.users-form-section,.updates-popup-option,.category-modal-info,.department-modal-info) {
    background: rgba(246, 248, 252, .24) !important;
    background-image: none !important;
    backdrop-filter: blur(10px) saturate(125%);
    -webkit-backdrop-filter: blur(10px) saturate(125%);
}

[data-theme="dark"] :is(.users-form-section,.updates-popup-option,.category-modal-info,.department-modal-info) {
    background: rgba(17, 19, 24, .22) !important;
    background-image: none !important;
}

.attachment-preview-body {
    background: rgba(246, 248, 252, .25) !important;
    background-image: none !important;
}

[data-theme="dark"] .attachment-preview-body {
    background: rgba(17, 19, 24, .24) !important;
}

/* Campos e botões continuam legíveis sem formar blocos opacos sobre o modal. */
:is(.modal-card,.editor-modal-card) :is(.form-control,input:not([type="checkbox"]):not([type="radio"]),textarea,select) {
    background-color: rgba(246, 248, 252, .46) !important;
    backdrop-filter: blur(12px) saturate(130%);
    -webkit-backdrop-filter: blur(12px) saturate(130%);
}

[data-theme="dark"] :is(.modal-card,.editor-modal-card) :is(.form-control,input:not([type="checkbox"]):not([type="radio"]),textarea,select) {
    background-color: rgba(17, 19, 24, .46) !important;
}

@media (prefers-reduced-transparency: reduce) {
    :is(.modal-card,.editor-modal-card,.attachment-preview-dialog) {
        background: var(--bg-card-right) !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }
}

/* Modal de redefinição de senha no mesmo vidro do popup de atualizações. */
#forgotModal .modal-card {
    border: 1px solid rgba(15, 23, 42, .25) !important;
    border-radius: 28px !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: 0 20px 52px rgba(15, 23, 42, .12), inset 0 1px 0 rgba(255, 255, 255, .46), inset 0 -1px 0 rgba(255, 255, 255, .08) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
}

[data-theme="dark"] #forgotModal .modal-card {
    border-color: rgba(255, 255, 255, .08) !important;
    background: transparent !important;
    box-shadow: 0 24px 60px rgba(0, 0, 0, .30), inset 0 1px 0 rgba(255, 255, 255, .16), inset 0 -1px 0 rgba(255, 255, 255, .03) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
}

#forgotModal .modal-close {
    top: 13px !important;
    right: 13px !important;
    width: 32px !important;
    height: 32px !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, .24) !important;
    border-color: rgba(255, 255, 255, .22) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .45) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
}

[data-theme="dark"] #forgotModal .modal-close {
    background: rgba(255, 255, 255, .10) !important;
    border-color: rgba(255, 255, 255, .09) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18) !important;
}

#forgotModal .modal-header,
#forgotModal .modal-footer {
    background: transparent !important;
    background-image: none !important;
}

#forgotModal .input-icon-wrap,
#forgotModal .input-field {
    border-color: rgba(15, 23, 42, .14) !important;
    background: rgba(246, 248, 252, .16) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
}

[data-theme="dark"] #forgotModal .input-icon-wrap,
[data-theme="dark"] #forgotModal .input-field {
    border-color: rgba(255, 255, 255, .10) !important;
    background: rgba(17, 19, 24, .18) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
}

/* O botão permanece fixo ao passar o mouse; apenas o visual muda. */
#forgotModal .btn-submit,
#forgotModal .btn-submit:hover,
#forgotModal .btn-submit:focus,
#forgotModal .btn-submit:focus-visible,
#forgotModal .modal-close,
#forgotModal .modal-close:hover,
#forgotModal .modal-close:focus,
#forgotModal .modal-close:focus-visible {
    transform: none !important;
}
