/* Keep the media-save confirmation below the fixed page header. */
#toast44.toast-top {
    top: calc(94px + env(safe-area-inset-top, 0px)) !important;
    z-index: 110;
}
#toast44.toast-top:not(.show) { transform: translate(-50%, -12px); }

.voicer-media-editor-modal { padding: 12px !important; }
.voicer-media-editor-modal .modal-dialog { width: min(520px, calc(100vw - 24px)); max-width: none; margin: 1.75rem auto; }
.voicer-media-editor-modal .voicer-media-editor { overflow: hidden; border: 1px solid #dce7f5; border-radius: 18px; background: #fff; color: #203a59; box-shadow: 0 24px 60px rgba(9, 37, 78, .24); }
.voicer-media-editor .modal-header { display: flex; align-items: flex-start; gap: 12px; margin: 0; padding: 19px 21px 17px; border-bottom: 1px solid #e9eff7; }
.voicer-media-editor__heading-icon { display: grid; flex: none; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: #e8f2ff; color: #1c64c8; }
.voicer-media-editor__heading-icon::before { display: block; width: 19px; height: 19px; background: currentColor; content: ''; -webkit-mask: url('/icons/outline-edit.svg') center / contain no-repeat; mask: url('/icons/outline-edit.svg') center / contain no-repeat; }
.voicer-media-editor__heading { flex: 1; min-width: 0; }
.voicer-media-editor__heading h2 { margin: 0; color: #193352; font-size: 20px; font-weight: 780; line-height: 1.2; }
.voicer-media-editor__heading p { margin: 5px 0 0; color: #6b7e96; font-size: 12px; line-height: 1.4; }
.voicer-media-editor__close { display: grid; flex: none; place-items: center; width: 32px; height: 32px; margin: 0 0 0 auto; padding: 0; border: 0; border-radius: 9px; background: #f0f5fb; color: #5c7796; cursor: pointer; }
.voicer-media-editor__close::before { display: block; width: 18px; height: 18px; background: currentColor; content: ''; -webkit-mask: url('/icons/outline-close.svg') center / contain no-repeat; mask: url('/icons/outline-close.svg') center / contain no-repeat; }
.voicer-media-editor__close:hover { background: #e3eefb; color: #1d5db0; }
.voicer-media-editor .modal-body { max-height: calc(100dvh - 190px); margin: 0; padding: 19px 21px 21px; overflow-y: auto; }
.voicer-media-editor__visibility { min-width: 0; margin: 0 0 20px; padding: 0; border: 0; }
.voicer-media-editor__visibility legend, .voicer-media-editor__field label { display: block; width: 100%; margin: 0 0 8px; color: #294360; font-size: 12px; font-weight: 750; line-height: 1.3; }
.voicer-media-editor__visibility-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.voicer-media-editor__visibility-options label { display: flex; align-items: center; justify-content: center; gap: 7px; min-width: 0; min-height: 41px; margin: 0; padding: 8px; border: 1px solid #d6e2f1; border-radius: 10px; background: #fff; color: #365574; font-size: 12px; font-weight: 700; white-space: nowrap; cursor: pointer; }
.voicer-media-editor__visibility-options label:has(input:checked) { border-color: #86b5f2; background: #eaf3ff; color: #175bbe; }
.voicer-media-editor__visibility-options input { flex: none; width: 15px; height: 15px; margin: 0; accent-color: #2165ce; }
.voicer-media-editor__field { margin: 0 0 18px; }
.voicer-media-editor__field:last-of-type { margin-bottom: 0; }
.voicer-media-editor__field .form-control { width: 100%; min-height: 43px; margin: 0; padding: 10px 12px; border: 1px solid #cfdbeb; border-radius: 10px; background: #fff; color: #193352; font-size: 14px; line-height: 1.4; box-shadow: none; }
.voicer-media-editor__field textarea.form-control { min-height: 116px; resize: vertical; }
.voicer-media-editor__field .form-control:focus { border-color: #82b3f0; outline: 0; box-shadow: 0 0 0 3px rgba(25, 95, 230, .1); }
.voicer-media-editor__field small { display: block; margin-top: 7px; color: #71859b; font-size: 11px; }
.voicer-media-editor__error { margin: 0 0 2px; padding: 10px 12px; border-radius: 9px; background: #fff1f2; color: #aa3040; font-size: 12px; line-height: 1.4; }
.voicer-media-editor__error[hidden] { display: none !important; }
.voicer-media-editor .modal-footer { display: flex; justify-content: flex-end; gap: 9px; margin: 0; padding: 14px 21px 18px; border-top: 1px solid #e9eff7; }
.voicer-media-editor__cancel, .voicer-media-editor__save { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; margin: 0; padding: 9px 15px; border: 0; border-radius: 10px; font-size: 13px; font-weight: 750; line-height: 1.2; cursor: pointer; }
.voicer-media-editor__cancel { background: #eff4fb; color: #355574; }
.voicer-media-editor__cancel:hover { background: #e3eefb; }
.voicer-media-editor__save { min-width: 120px; background: #1e63c8; color: #fff; }
.voicer-media-editor__save:hover { background: #1752aa; color: #fff; }
.voicer-media-editor__save:disabled { opacity: .6; cursor: wait; }
.voicer-media-editor :is(button, input, textarea):focus-visible, .voicer-media-editor__visibility-options label:has(input:focus-visible) { outline: 2px solid #80b9fa; outline-offset: 2px; }

body.theme-dark .voicer-media-editor-modal .voicer-media-editor { border-color: #354a65; background: #1d2b40; color: #edf5ff; }
body.theme-dark .voicer-media-editor :is(.modal-header, .modal-footer) { border-color: #354a65; }
body.theme-dark .voicer-media-editor__heading h2, body.theme-dark .voicer-media-editor__visibility legend, body.theme-dark .voicer-media-editor__field label { color: #edf5ff; }
body.theme-dark .voicer-media-editor__heading p, body.theme-dark .voicer-media-editor__field small { color: #a8bad3; }
body.theme-dark .voicer-media-editor__heading-icon { background: #2c4d73; color: #a9d0ff; }
body.theme-dark .voicer-media-editor__close, body.theme-dark .voicer-media-editor__cancel { background: #314761; color: #e3efff; }
body.theme-dark .voicer-media-editor__visibility-options label, body.theme-dark .voicer-media-editor__field .form-control { border-color: #45607f; background: #243750; color: #edf5ff; }
body.theme-dark .voicer-media-editor__visibility-options label:has(input:checked) { border-color: #79aaf0; background: #2b4c73; color: #d6e9ff; }
body.theme-dark .voicer-media-editor__field .form-control::placeholder { color: #9db1ca; }
body.theme-dark .voicer-media-editor__error { background: #4a2d39; color: #ffbac5; }

@media (max-width: 480px) {
    .voicer-media-editor-modal .modal-dialog { margin: 12px auto; }
    .voicer-media-editor .modal-header { padding: 16px; }
    .voicer-media-editor .modal-body { max-height: calc(100dvh - 165px); padding: 16px; }
    .voicer-media-editor .modal-footer { padding: 12px 16px 16px; }
    .voicer-media-editor__visibility-options { gap: 6px; }
    .voicer-media-editor__visibility-options label { gap: 5px; padding: 7px 4px; font-size: 11px; }
}

.voicer-delete-media-modal { padding: 12px !important; }
.voicer-delete-media-modal .modal-dialog { width: min(430px, calc(100vw - 24px)); max-width: none; margin: 1.75rem auto; }
.voicer-delete-media-modal .voicer-delete-media { overflow: hidden; border: 1px solid #dce7f5; border-radius: 18px; background: #fff; color: #203a59; box-shadow: 0 24px 60px rgba(9, 37, 78, .24); }
.voicer-delete-media .modal-header { display: flex; align-items: flex-start; gap: 12px; margin: 0; padding: 20px 21px 16px; border-bottom: 1px solid #e9eff7; }
.voicer-delete-media__icon { display: grid; flex: none; place-items: center; width: 39px; height: 39px; border-radius: 11px; background: #fff0ef; color: #b33b37; }
.voicer-delete-media__icon::before { display: block; width: 20px; height: 20px; background: currentColor; content: ''; -webkit-mask: url('/icons/outline-trash.svg') center / contain no-repeat; mask: url('/icons/outline-trash.svg') center / contain no-repeat; }
.voicer-delete-media .modal-header > div { flex: 1; min-width: 0; }
.voicer-delete-media .modal-header h2 { margin: 0; color: #193352; font-size: 19px; font-weight: 780; line-height: 1.25; }
.voicer-delete-media .modal-header p { margin: 5px 0 0; color: #7a899a; font-size: 12px; line-height: 1.4; }
.voicer-delete-media__close { display: grid; flex: none; place-items: center; width: 32px; height: 32px; margin-left: auto; padding: 0; border: 0; border-radius: 9px; background: #f0f5fb; color: #5c7796; cursor: pointer; }
.voicer-delete-media__close::before { display: block; width: 18px; height: 18px; background: currentColor; content: ''; -webkit-mask: url('/icons/outline-close.svg') center / contain no-repeat; mask: url('/icons/outline-close.svg') center / contain no-repeat; }
.voicer-delete-media__close:hover { background: #e3eefb; color: #1d5db0; }
.voicer-delete-media .modal-body { margin: 0; padding: 19px 21px 20px; }
.voicer-delete-media .modal-body > p { margin: 0; color: #516982; font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
.voicer-delete-media .modal-body > .voicer-delete-media__error { margin-top: 13px; padding: 10px 12px; border-radius: 9px; background: #fff1f2; color: #aa3040; font-size: 12px; }
.voicer-delete-media__error[hidden] { display: none !important; }
.voicer-delete-media .modal-footer { display: flex; justify-content: flex-end; gap: 9px; margin: 0; padding: 14px 21px 18px; border-top: 1px solid #e9eff7; }
.voicer-delete-media__cancel, .voicer-delete-media__confirm { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; margin: 0; padding: 9px 15px; border: 0; border-radius: 10px; font-size: 13px; font-weight: 750; line-height: 1.2; cursor: pointer; }
.voicer-delete-media__cancel { background: #eff4fb; color: #355574; }
.voicer-delete-media__cancel:hover { background: #e3eefb; }
.voicer-delete-media__confirm { min-width: 120px; background: #ba3f39; color: #fff; }
.voicer-delete-media__confirm:hover { background: #a23430; color: #fff; }
.voicer-delete-media__confirm:disabled { opacity: .6; cursor: wait; }
.voicer-delete-media :is(button):focus-visible { outline: 2px solid #80b9fa; outline-offset: 2px; }
body.theme-dark .voicer-delete-media-modal .voicer-delete-media { border-color: #354a65; background: #1d2b40; color: #edf5ff; }
body.theme-dark .voicer-delete-media :is(.modal-header, .modal-footer) { border-color: #354a65; }
body.theme-dark .voicer-delete-media .modal-header h2 { color: #edf5ff; }
body.theme-dark .voicer-delete-media .modal-header p, body.theme-dark .voicer-delete-media .modal-body > p { color: #b6c7dd; }
body.theme-dark .voicer-delete-media__icon { background: #56343d; color: #ffb2b0; }
body.theme-dark .voicer-delete-media__close, body.theme-dark .voicer-delete-media__cancel { background: #314761; color: #e3efff; }
body.theme-dark .voicer-delete-media .modal-body > .voicer-delete-media__error { background: #4a2d39; color: #ffbac5; }
@media (max-width: 480px) {
    .voicer-delete-media-modal .modal-dialog { margin: 12px auto; }
    .voicer-delete-media .modal-header, .voicer-delete-media .modal-body { padding: 16px; }
    .voicer-delete-media .modal-footer { padding: 12px 16px 16px; }
}