/* ── MBSI Inline Editor stijlen ─────────────────────────────────────────── */

#mbsi-toolbar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 99999;
  height: 50px; background: rgba(11,11,11,.97);
  border-bottom: 1px solid rgba(201,168,76,.35);
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 22px; font-family: 'Lato', sans-serif; font-size: 12px;
  backdrop-filter: blur(10px);
}
body.mbsi-editing-active { padding-top: 50px !important; }

.mbsi-toolbar__left { display: flex; align-items: center; gap: 12px; }
.mbsi-toolbar__logo {
  font-family: 'Cormorant Garamond', serif; font-size: 14px;
  color: #C9A84C; letter-spacing: .12em;
}
.mbsi-toolbar__sep { width: 1px; height: 18px; background: rgba(201,168,76,.2); }
.mbsi-toolbar__user { font-size: 12px; color: #A89880; }
.mbsi-toolbar__role {
  font-size: 10px; letter-spacing: .12em; text-transform: uppercase;
  padding: 2px 8px; border-radius: 20px; margin-left: 6px;
  background: rgba(201,168,76,.12); color: #C9A84C; border: 1px solid rgba(201,168,76,.25);
}
.mbsi-toolbar__status { font-size: 11px; color: #6b6d7d; letter-spacing: .06em; }

.mbsi-toolbar__right { display: flex; align-items: center; gap: 8px; }

.mbsi-tb-btn {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 6px 14px; border-radius: 4px;
  font-family: 'Lato', sans-serif; font-size: 11px; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase; cursor: pointer;
  border: none; transition: all .2s; text-decoration: none;
}
.mbsi-tb-btn--edit   { background: rgba(201,168,76,.12); border: 1px solid rgba(201,168,76,.35); color: #C9A84C; }
.mbsi-tb-btn--edit:hover { background: rgba(201,168,76,.22); }
.mbsi-tb-btn--save   { background: #C9A84C; color: #0b0b0b; }
.mbsi-tb-btn--save:hover { background: #E2C97E; }
.mbsi-tb-btn--save:disabled { opacity: .5; cursor: not-allowed; }
.mbsi-tb-btn--cancel { background: transparent; border: 1px solid rgba(255,255,255,.12); color: #A89880; }
.mbsi-tb-btn--cancel:hover { border-color: rgba(255,255,255,.3); color: #F0EAE0; }
.mbsi-tb-btn--beheer { background: transparent; border: 1px solid rgba(255,255,255,.1); color: #6b6d7d; font-size: 10px; }
.mbsi-tb-btn--beheer:hover { color: #A89880; border-color: rgba(255,255,255,.2); }

/* Bewerkbare elementen */
body.mbsi-editing [data-edit] {
  outline: 1px dashed rgba(201,168,76,.3); outline-offset: 2px;
  border-radius: 2px; cursor: text; transition: outline-color .15s; min-height: 1em;
}
body.mbsi-editing [data-edit]:hover  { outline: 2px solid rgba(201,168,76,.65); background: rgba(201,168,76,.04); }
body.mbsi-editing [data-edit]:focus  { outline: 2px solid #C9A84C; background: rgba(201,168,76,.06); }
[data-edit].mbsi-changed { outline-color: #C9A84C !important; }

/* Foto-overlays */
body.mbsi-editing [data-edit-img] { position: relative; cursor: pointer; }
.mbsi-img-overlay {
  display: none; position: absolute; inset: 0;
  background: rgba(11,11,11,.6); border: 2px dashed rgba(201,168,76,.55);
  border-radius: 4px; align-items: center; justify-content: center;
  flex-direction: column; gap: 8px; cursor: pointer; z-index: 10;
  transition: background .2s;
}
.mbsi-img-overlay:hover { background: rgba(11,11,11,.78); }
body.mbsi-editing [data-edit-img] .mbsi-img-overlay { display: flex; }
.mbsi-img-overlay__icon  { font-size: 26px; line-height: 1; }
.mbsi-img-overlay__label {
  font-family: 'Lato', sans-serif; font-size: 11px; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase; color: #C9A84C;
}

/* Toast */
#mbsi-toast {
  position: fixed; bottom: 28px; left: 50%;
  transform: translateX(-50%) translateY(80px);
  z-index: 999998; background: #1c1a17;
  border: 1px solid rgba(201,168,76,.3); border-radius: 8px;
  padding: 11px 22px; font-family: 'Lato', sans-serif;
  font-size: 13px; color: #C9A84C; transition: transform .3s; white-space: nowrap;
}
#mbsi-toast.mbsi-toast--visible { transform: translateX(-50%) translateY(0); }
#mbsi-toast.mbsi-toast--error   { border-color: rgba(248,113,113,.35); color: #f87171; }
