/* Visual tweaks around Quill so it fits the rest of the admin UI. */

.quill-wrap{ margin-bottom:12px; }
.quill-wrap .ql-toolbar.ql-snow{
    border-radius: 6px 6px 0 0;
    background:#f8f9fa;
    border-color:#dee2e6;
}
.quill-wrap .ql-container.ql-snow{
    border-radius: 0 0 6px 6px;
    border-color:#dee2e6;
    font-family: inherit;
    font-size: 15px;
    background:#fff;
}
.quill-wrap .ql-editor{
    min-height: 320px;
    line-height:1.6;
}
.quill-wrap .ql-editor img{ max-width:100%; height:auto; }

/* Quill scopes these to .ql-editor, but saved content renders outside the editor. */
.ql-align-center{ text-align:center; }
.ql-align-right{ text-align:right; }
.ql-align-justify{ text-align:justify; }
.ql-size-small{ font-size:.75em; }
.ql-size-large{ font-size:1.5em; }
.ql-size-huge{ font-size:2.5em; }

.quill-wrap{ position:relative; }
.quill-wrap .ql-editor img{ cursor:pointer; }

.mm-imgframe{ position:absolute; border:2px solid #34a9f2; pointer-events:none; z-index:5; box-sizing:border-box; }
.mm-imgframe__handle{ position:absolute; right:-7px; bottom:-7px; width:14px; height:14px; border-radius:50%; background:#34a9f2; border:2px solid #fff; cursor:nwse-resize; pointer-events:auto; touch-action:none; }
.mm-imgbar{ position:absolute; display:flex; gap:2px; padding:4px; background:#1f2937; border-radius:8px; box-shadow:0 6px 18px rgba(0,0,0,.25); z-index:6; }
.mm-imgbar[hidden]{ display:none; }
.mm-imgbar__btn{ min-width:32px; height:30px; padding:0 6px; border:0; border-radius:5px; background:transparent; color:#fff; font-size:13px; cursor:pointer; }
.mm-imgbar__btn:hover{ background:#374151; }

.mm-noscroll{ overflow:hidden; }
.mm-modal{ position:fixed; inset:0; z-index:10000; display:flex; align-items:center; justify-content:center; padding:16px; background:rgba(17,24,39,.6); }
.mm-modal__dialog{ display:flex; flex-direction:column; width:100%; max-width:960px; max-height:90vh; background:#fff; border-radius:14px; overflow:hidden; }
.mm-modal__header{ display:flex; align-items:center; gap:12px; padding:14px 18px; border-bottom:1px solid #e5e7eb; }
.mm-modal__title{ margin:0; font-size:18px; font-weight:700; white-space:nowrap; }
.mm-modal__close{ width:36px; height:36px; flex:none; border:0; border-radius:8px; background:#f3f4f6; cursor:pointer; }
.mm-modal__body{ padding:16px 18px; overflow-y:auto; }
.mm-search{ flex:1; min-width:0; height:38px; padding:0 12px; border:1px solid #d1d5db; border-radius:8px; }

.mm-btn{ padding:8px 16px; border:1px solid #d1d5db; border-radius:8px; background:#fff; font-size:14px; cursor:pointer; }
.mm-btn--primary{ border-color:#1d7fc4; background:#1d7fc4; color:#fff; }
.mm-more{ display:block; margin:14px auto 0; }
.mm-more[hidden]{ display:none; }
.mm-dropzone{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:12px; padding:18px; border:2px dashed #cbd5e1; border-radius:10px; background:#f9fafb; }
.mm-dropzone.is-over{ border-color:#1d7fc4; background:#eaf5fd; }
.mm-dropzone__hint{ color:#6b7280; font-size:13px; }
.mm-status{ min-height:20px; margin:10px 0; color:#374151; font-size:13px; }
.mm-status.is-error{ color:#b91c1c; }
.mm-album__count{ margin-top:12px; color:#374151; font-size:14px; font-weight:600; }

.mm-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(130px, 1fr)); gap:10px; }
.mm-tile{ position:relative; border:1px solid #e5e7eb; border-radius:8px; overflow:hidden; background:#f3f4f6; }
.mm-tile__open{ display:block; width:100%; padding:0; border:0; background:none; cursor:pointer; }
.mm-tile__open img{ display:block; width:100%; aspect-ratio:1/1; object-fit:cover; }
.mm-tile__delete{ position:absolute; top:6px; right:6px; width:30px; height:30px; border:0; border-radius:6px; background:rgba(185,28,28,.92); color:#fff; font-size:13px; cursor:pointer; }
.mm-tile__meta{ padding:3px 6px; background:#fff; color:#6b7280; font-size:11px; text-align:right; }

.quill-wrap .ql-toolbar button.ql-codeview{ width:auto; min-width:28px; color:#444; }
.quill-wrap .ql-toolbar button.ql-codeview.is-active{ color:#fff; background:#1d7fc4; border-radius:3px; }
.quill-wrap.is-code .ql-toolbar .ql-formats > *:not(.ql-codeview){ opacity:.35; pointer-events:none; }
.quill-source{ display:block; width:100%; padding:14px; border:1px solid #dee2e6; border-top:0; border-radius:0 0 6px 6px; background:#111827; color:#e5e7eb; font:13px/1.6 Menlo, Consolas, monospace; white-space:pre-wrap; tab-size:2; resize:vertical; }
.quill-source[hidden], .quill-source-hint[hidden]{ display:none; }
.quill-source:focus{ outline:2px solid #34a9f2; outline-offset:-2px; }
.quill-source-hint{ margin-top:6px; color:#6b7280; font-size:13px; }

.mm-preview{ position:fixed; inset:0; z-index:10001; display:flex; align-items:center; justify-content:center; padding:56px 16px; background:rgba(0,0,0,.9); }
.mm-preview__img{ max-width:100%; max-height:100%; object-fit:contain; border-radius:6px; }
.mm-preview__btn{ position:absolute; width:44px; height:44px; border:0; border-radius:50%; background:rgba(255,255,255,.16); color:#fff; font-size:18px; cursor:pointer; }
.mm-preview__btn:hover{ background:rgba(255,255,255,.3); }
.mm-preview__close{ top:12px; right:12px; }
.mm-preview__prev{ top:50%; left:12px; transform:translateY(-50%); }
.mm-preview__next{ top:50%; right:12px; transform:translateY(-50%); }
.mm-preview__counter{ position:absolute; bottom:14px; left:50%; transform:translateX(-50%); padding:3px 12px; border-radius:40px; background:rgba(0,0,0,.5); color:#fff; font-size:13px; }