/* MB Editor. The theme styles every bare <button> (#cc3366 outline, fill on
   hover), so every button here resets background/border/colour with
   !important, hover and focus included. */
.mbe-fab, .mbe-btn { font-family: 'Source Sans 3', -apple-system, sans-serif !important; cursor: pointer; }

.mbe-fab {
    position: fixed !important; right: 22px; bottom: 22px; z-index: 9990;
    padding: 0.75rem 1.2rem !important;
    border: none !important; border-radius: 999px !important;
    background: #1a365d !important; color: #fff !important;
    font-size: 1rem !important; font-weight: 600 !important; line-height: 1.2 !important;
    box-shadow: 0 6px 20px rgba(26, 54, 93, 0.28) !important;
}
.mbe-fab:hover, .mbe-fab:focus { background: #24518c !important; color: #fff !important; border: none !important; }
.mbe-fab--quiet { background: #fff !important; color: #1a365d !important; border: 1px solid #cbd5e0 !important; box-shadow: 0 2px 8px rgba(26,54,93,.12) !important; }
.mbe-fab--quiet:hover, .mbe-fab--quiet:focus { background: #f7fafc !important; color: #1a365d !important; }
.mbe-open .mbe-fab { display: none !important; }

.mbe-open, .mbe-open body { overflow: hidden !important; }
.mbe-overlay {
    position: fixed; inset: 0; z-index: 99999;
    background: rgba(18, 38, 63, 0.55);
    display: flex; align-items: stretch; justify-content: center;
    padding: 24px;
}
.mbe-panel {
    width: 100%; max-width: 1000px;
    background: #fff; border-radius: 14px; border-top: 3px solid #b8860b;
    display: flex; flex-direction: column; overflow: hidden;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25);
    font-family: 'Source Sans 3', -apple-system, sans-serif;
}
.mbe-head {
    display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
    padding: 1rem 1.25rem; border-bottom: 1px solid #e2e8f0;
}
.mbe-title { display: flex; align-items: baseline; gap: 0.5rem; flex: 1 1 360px; min-width: 0; }
.mbe-prefix, .mbe-dash { font-family: 'Crimson Pro', Georgia, serif; font-size: 1.6rem; font-weight: 600; color: #1a365d; white-space: nowrap; }
.mbe-dash { color: #a0aec0; font-weight: 400; }
.mbe-label {
    flex: 1 1 auto; min-width: 0;
    font-family: 'Crimson Pro', Georgia, serif !important; font-size: 1.6rem !important; font-weight: 600 !important;
    color: #1a365d !important; border: none !important; border-bottom: 1px dashed #cbd5e0 !important;
    border-radius: 0 !important; padding: 0 0 2px !important; background: transparent !important; box-shadow: none !important;
}
.mbe-label:focus { outline: none; border-bottom-color: #1a365d !important; }

.mbe-actions { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.mbe-btn {
    padding: 0.6rem 1.15rem !important; border-radius: 8px !important;
    font-size: 0.98rem !important; font-weight: 600 !important; line-height: 1.2 !important;
    box-shadow: none !important;
}
.mbe-btn--primary, .mbe-btn--primary:hover, .mbe-btn--primary:focus { background: #1a365d !important; color: #fff !important; border: 1px solid #1a365d !important; }
.mbe-btn--primary:hover { background: #24518c !important; }
.mbe-btn--outline, .mbe-btn--outline:hover, .mbe-btn--outline:focus { background: #fff !important; color: #2d3748 !important; border: 1px solid #cbd5e0 !important; }
.mbe-btn--outline:hover { background: #f7fafc !important; }
.mbe-btn--ghost, .mbe-btn--ghost:hover, .mbe-btn--ghost:focus { background: transparent !important; color: #718096 !important; border: 1px solid transparent !important; text-decoration: underline; text-underline-offset: 3px; }
.mbe-btn--ghost:hover { color: #1a365d !important; }
.mbe-btn[disabled] { opacity: 0.55; cursor: wait; }
.mbe-btn:focus-visible, .mbe-fab:focus-visible { outline: 2px solid #b8860b !important; outline-offset: 2px; }

.mbe-help { margin: 0; padding: 0.7rem 1.25rem; background: #faf8f5; border-bottom: 1px solid #e2e8f0; color: #4a5568; font-size: 0.95rem; }
.mbe-panel .mce-tinymce { border: none !important; box-shadow: none !important; flex: 1 1 auto; }
.mbe-panel .mce-top-part::before { box-shadow: none !important; }
.mbe-panel .mce-toolbar-grp { background: #fff !important; border-bottom: 1px solid #e2e8f0 !important; padding: 4px 12px !important; }
/* The toolbar buttons are bare <button>s too — the theme would outline them pink and fill them on hover. */
.mbe-panel .mce-btn button,
.mbe-panel .mce-btn button:hover,
.mbe-panel .mce-btn button:focus {
    padding: 6px 8px !important; background: transparent !important; border: none !important;
    box-shadow: none !important; color: #333 !important; border-radius: 0 !important; line-height: 1 !important;
}
.mbe-panel .mce-btn:hover { background: #edf2f7 !important; border-color: transparent !important; }
.mbe-panel .mce-btn.mce-active, .mbe-panel .mce-btn.mce-active:hover { background: #1a365d !important; border-color: #1a365d !important; }
.mbe-panel .mce-btn.mce-active button, .mbe-panel .mce-btn.mce-active i { color: #fff !important; }
.mbe-panel .mce-ico { color: inherit !important; }

.mbe-foot {
    display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
    padding: 0.65rem 1.25rem; border-top: 1px solid #e2e8f0; font-size: 0.88rem; color: #718096;
}
.mbe-status { color: #1a365d; font-weight: 600; }
.mbe-who a { color: #718096; }

.mbe-toast {
    position: fixed; left: 50%; bottom: 28px; transform: translateX(-50%); z-index: 99999;
    background: #1a365d; color: #fff; padding: 0.7rem 1.2rem; border-radius: 999px;
    font-family: 'Source Sans 3', -apple-system, sans-serif; font-weight: 600; font-size: 0.98rem;
    box-shadow: 0 6px 20px rgba(26,54,93,.3); transition: opacity .5s ease;
}
.mbe-toast.is-gone { opacity: 0; }

@media (max-width: 640px) {
    .mbe-overlay { padding: 0; }
    .mbe-panel { border-radius: 0; }
    .mbe-prefix, .mbe-dash, .mbe-label { font-size: 1.3rem !important; }
    .mbe-fab { right: 14px; bottom: 14px; }
}
@media print { .mbe-fab, .mbe-overlay, .mbe-toast { display: none !important; } }
