/* Shared parent modal for avatar and top-image editing. */
#imageModel .modal-content { overflow: hidden; border: 1px solid #dce7f5; border-radius: 16px; }
#imageModel .responsive-iframe { position: relative; }
#imageModel .voicer-image-crop-loading { position: absolute; inset: 0; z-index: 2; display: none; flex-direction: column; align-items: center; justify-content: center; gap: 14px; background: #f5f8fd; color: #284563; font-size: 14px; font-weight: 700; }
#imageModel.is-loading .voicer-image-crop-loading { display: flex; }
#imageModel.is-loading #photoIframe { visibility: hidden; }
#imageModel .voicer-image-crop-loading__spinner { width: 38px; height: 38px; border: 4px solid #c9def8; border-top-color: #2872d6; border-radius: 50%; animation: voicer-image-crop-spin .8s linear infinite; }
@keyframes voicer-image-crop-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { #imageModel .voicer-image-crop-loading__spinner { animation-duration: 2s; } }
body.theme-dark #imageModel .modal-content,
body.theme-dark #imageModel .modal-footer { border-color: #344b67; background: #17263b !important; }
body.theme-dark #imageModel .voicer-image-crop-loading { background: #17263b; color: #e5effb; }
body.theme-dark #imageModel .voicer-image-crop-loading__spinner { border-color: #405e83; border-top-color: #9ac8ff; }

/* The crop editor is rendered in a same-origin iframe and follows its parent theme. */
body.theme-dark .voicer-image-crop-page { background: #111b2a !important; }
body.theme-dark .voicer-image-crop-page .card { border: 1px solid #344b67; background: #1d2b40 !important; color: #e5effb; }
body.theme-dark .voicer-image-crop-page h3 { color: #f2f7ff !important; }
body.theme-dark .voicer-image-crop-page .color-highlight { color: #add2ff !important; }
body.theme-dark .voicer-image-crop-page .btn-close { filter: invert(1) grayscale(1); opacity: .85; }
body.theme-dark .voicer-image-crop-page #avatar-choose-btn i { color: #d3e4f8 !important; }
body.theme-dark .voicer-image-crop-page .cr-boundary { background: #102036; }
body.theme-dark .voicer-image-crop-page .cr-slider::-webkit-slider-runnable-track { background: #7793b4; }
body.theme-dark .voicer-image-crop-page .cr-slider::-moz-range-track { background: #7793b4; }
body.theme-dark .voicer-image-crop-page .cr-slider::-webkit-slider-thumb { background: #9ac8ff; }
body.theme-dark .voicer-image-crop-page .cr-slider::-moz-range-thumb { background: #9ac8ff; }
body.theme-dark .voicer-image-crop-page .cr-slider:focus-visible { outline: 2px solid #9ac8ff; outline-offset: 4px; }