/* =====================================================================
   Eras Staff Tools — dropdown + Mine forslag + Rapportér modaler
   ===================================================================== */

/* ─── Dropdown trigger + menu ─────────────────────────────────────── */
.eras-staff-wrap{
  position:relative;
  display:none; /* toggled by JS based on role */
}
.eras-staff-wrap.is-visible{ display:inline-block; }

#erasStaffBtn{
  background:transparent;
  border:1px solid rgba(192,163,112,.45);
  color:#c0a370;
  padding:6px 12px;
  border-radius:7px;
  font-family:'IM Fell English SC', serif;
  font-size:11px;
  letter-spacing:.08em;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:6px;
  transition:all .15s;
}
#erasStaffBtn:hover{
  background:rgba(192,163,112,.12);
  color:#e8d9b8;
}
#erasStaffBtn .est-badge{
  background:#a23028;
  color:#fff;
  font-size:9px;
  font-weight:700;
  padding:1px 6px;
  border-radius:9px;
  margin-left:4px;
  display:none;
}
#erasStaffBtn .est-badge.has-news{ display:inline-block; }
#erasStaffBtn .est-chev{ font-size:9px; opacity:.7; margin-left:3px; }

.eras-staff-menu{
  display:none;
  position:absolute;
  top:calc(100% + 6px);
  right:0;
  background:rgba(28,22,15,.96);
  border:1px solid rgba(180,140,90,.4);
  border-radius:8px;
  box-shadow:0 8px 24px rgba(0,0,0,.5);
  min-width:220px;
  z-index:1000;
  overflow:hidden;
  backdrop-filter:blur(6px);
}
.eras-staff-menu.is-open{ display:block; }
body[data-theme="parchment"] .eras-staff-menu,
body[data-theme="atlas"]     .eras-staff-menu{
  background:rgba(245,230,195,.96);
  border-color:rgba(120,90,50,.4);
}

.eras-staff-item{
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
  padding:11px 14px;
  background:transparent;
  border:0;
  border-bottom:1px solid rgba(180,140,90,.15);
  color:#e8d9b8;
  font-family:'IM Fell English SC', serif;
  font-size:12px;
  letter-spacing:.08em;
  cursor:pointer;
  text-align:left;
  position:relative;
  transition:background .12s;
}
body[data-theme="parchment"] .eras-staff-item,
body[data-theme="atlas"]     .eras-staff-item{
  color:#3a2810;
  border-bottom-color:rgba(120,90,50,.15);
}
.eras-staff-item:last-child{ border-bottom:0; }
.eras-staff-item:hover{ background:rgba(192,163,112,.12); }
.eras-staff-item-ico{ font-size:14px; width:18px; text-align:center; }
.eras-staff-item-lbl{ flex:1; }
.eras-staff-item-dot{
  width:8px; height:8px;
  border-radius:50%;
  background:#3a7a3a;
  display:none;
}
.eras-staff-item-dot.has-news{ display:inline-block; }
.eras-staff-item-badge{
  background:#a23028;
  color:#fff;
  font-size:9px;
  font-weight:700;
  padding:1px 6px;
  border-radius:9px;
  display:none;
}
.eras-staff-item-badge.has-pending{ display:inline-block; }

/* ─── Generel modal-skal (Mine forslag + Rapportér) ───────────────── */
.est-overlay{
  position:fixed; inset:0;
  z-index:10500;
  background:rgba(20,12,4,.65);
  backdrop-filter:blur(4px);
  display:flex; align-items:center; justify-content:center;
  padding:20px;
  animation:estFadeIn .2s ease-out;
}
@keyframes estFadeIn{ from{opacity:0} to{opacity:1} }

.est-modal{
  background:#f8f1e0;
  color:#3a2810;
  width:min(720px, 95vw);
  max-height:90vh;
  display:flex; flex-direction:column;
  border:2px solid #c0a370;
  border-radius:14px;
  box-shadow:0 20px 60px rgba(0,0,0,.4);
  overflow:hidden;
  font-family:'Spectral', serif;
}
.est-head{
  display:flex; justify-content:space-between; align-items:center;
  padding:18px 22px 14px;
  border-bottom:1px solid rgba(180,140,90,.3);
  background:linear-gradient(to bottom, rgba(192,163,112,.12), transparent);
}
.est-head-l{ display:flex; gap:12px; align-items:center; }
.est-head-ico{ font-size:26px; }
.est-head-title{
  font-family:'IM Fell English SC', serif;
  font-size:18px;
  letter-spacing:.06em;
  color:#5a3a18;
}
.est-head-sub{
  font-size:11px;
  color:#7a5a3a;
  margin-top:2px;
  letter-spacing:.05em;
}
.est-close{
  background:transparent; border:0;
  font-size:22px; cursor:pointer;
  color:#7a5a3a;
  width:30px; height:30px;
  display:flex; align-items:center; justify-content:center;
  border-radius:50%;
  transition:background .15s;
}
.est-close:hover{ background:rgba(192,163,112,.2); color:#3a2810; }

.est-body{
  flex:1; overflow-y:auto;
  padding:18px 22px;
}

.est-foot{
  display:flex; justify-content:flex-end; gap:10px;
  padding:14px 22px;
  border-top:1px solid rgba(180,140,90,.3);
  background:rgba(248,241,224,.8);
}
.est-btn{
  font:inherit; font-size:12.5px; font-weight:600;
  padding:8px 16px;
  background:#fff;
  border:1px solid rgba(180,140,90,.5);
  color:#5a3a18;
  border-radius:6px;
  cursor:pointer;
  letter-spacing:.04em;
}
.est-btn:hover{ background:rgba(192,163,112,.15); }
.est-btn--primary{
  background:#a23028; color:#fff;
  border-color:#a23028;
}
.est-btn--primary:hover{ background:#8a2520; border-color:#8a2520; }
.est-btn[disabled]{ opacity:.5; cursor:not-allowed; }

/* ─── Mine forslag — liste-elementer ──────────────────────────────── */
.est-empty{
  text-align:center;
  padding:30px 20px;
  color:#7a5a3a;
  font-style:italic;
}
.est-row{
  display:flex; align-items:center; gap:12px;
  padding:11px 13px;
  background:#fff;
  border:1px solid rgba(180,140,90,.3);
  border-radius:8px;
  margin-bottom:8px;
  cursor:pointer;
  transition:all .15s;
}
.est-row:hover{
  border-color:#c0a370;
  background:rgba(248,241,224,.6);
}
.est-row-ico{ font-size:22px; flex-shrink:0; }
.est-row-mid{ flex:1; min-width:0; }
.est-row-title{
  font-weight:600;
  color:#3a2810;
  font-size:13.5px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.est-row-meta{
  font-size:11px;
  color:#7a5a3a;
  margin-top:2px;
}
.est-row-status{
  flex-shrink:0;
  padding:3px 10px;
  border-radius:999px;
  font-size:11px;
  font-weight:600;
  letter-spacing:.04em;
}
.est-status-pending{   background:#f0d68c; color:#5a3a18; }
.est-status-approved{  background:#3a7a3a; color:#fff;    }
.est-status-rejected{  background:#c44;    color:#fff;    }
.est-status-open{      background:#7aa3c9; color:#fff;    }
.est-status-resolved{  background:#3a7a3a; color:#fff;    }

/* Detalje-view (in-modal) */
.est-detail{
  padding:14px;
  background:rgba(248,241,224,.6);
  border:1px solid rgba(180,140,90,.3);
  border-radius:8px;
}
.est-detail-back{
  background:transparent; border:0;
  color:#5a3a18;
  font-family:'IM Fell English SC', serif;
  font-size:12px;
  cursor:pointer;
  padding:0;
  margin-bottom:12px;
}
.est-detail-back:hover{ text-decoration:underline; }
.est-detail-label{
  font-size:11px;
  font-weight:600;
  color:#5a3a18;
  letter-spacing:.05em;
  margin:10px 0 4px;
}
.est-detail-value{
  background:#fff;
  border:1px solid rgba(180,140,90,.2);
  border-radius:6px;
  padding:10px 12px;
  font-size:13px;
  color:#3a2810;
  white-space:pre-wrap;
}
.est-detail-note{
  background:rgba(196,68,68,.08);
  border-left:3px solid #c44;
  padding:10px 12px;
  margin-top:8px;
  border-radius:0 6px 6px 0;
  font-size:12.5px;
  color:#3a2810;
}

/* ─── Rapportér problem — form ────────────────────────────────────── */
.est-form-row{ margin-bottom:14px; }
.est-form-label{
  display:block;
  font-size:11px;
  font-weight:600;
  color:#5a3a18;
  letter-spacing:.05em;
  margin-bottom:5px;
}
.est-form-input,
.est-form-select,
.est-form-textarea{
  width:100%;
  font:inherit;
  font-family:'Spectral', serif;
  font-size:13px;
  padding:8px 10px;
  background:#fff;
  border:1px solid rgba(180,140,90,.4);
  color:#3a2810;
  border-radius:6px;
}
.est-form-textarea{ resize:vertical; min-height:80px; }
.est-form-input:focus,
.est-form-select:focus,
.est-form-textarea:focus{
  outline:0;
  border-color:#c0a370;
  box-shadow:0 0 0 2px rgba(192,163,112,.25);
}
.est-form-context{
  font-size:12px;
  color:#7a5a3a;
  padding:8px 12px;
  background:rgba(192,163,112,.1);
  border-radius:6px;
  margin-bottom:14px;
}

/* ─── Toast ───────────────────────────────────────────────────────── */
.est-toast{
  position:fixed; bottom:30px; left:50%;
  transform:translateX(-50%) translateY(20px);
  background:#3a2810; color:#f8f1e0;
  padding:12px 22px;
  border-radius:8px;
  font-family:'IM Fell English SC', serif;
  font-size:13px; letter-spacing:.06em;
  box-shadow:0 8px 24px rgba(0,0,0,.4);
  opacity:0;
  transition:all .25s;
  z-index:11000;
}
.est-toast.on{ opacity:1; transform:translateX(-50%) translateY(0); }

/* ─── Theme-overrides — pergament/atlas synlighed ──────────────────── */
body[data-theme="parchment"] #erasStaffBtn,
body[data-theme="atlas"]     #erasStaffBtn{
  color: #5a3a18;
  border-color: rgba(120,90,50,.55);
  background: rgba(255,255,255,.5);
}
body[data-theme="parchment"] #erasStaffBtn:hover,
body[data-theme="atlas"]     #erasStaffBtn:hover{
  background: rgba(192,163,112,.3);
  color: #3a2810;
}

/* ─── Status-faner ─────────────────────────────────────────────────── */
.est-tabs{
  display:flex;
  gap:6px;
  margin-bottom:14px;
  padding-bottom:12px;
  border-bottom:1px solid rgba(180,140,90,.2);
  flex-wrap:wrap;
}
.est-tab{
  background:transparent;
  border:1px solid rgba(180,140,90,.35);
  color:#5a3a18;
  padding:6px 12px;
  border-radius:5px;
  font-family:'Spectral', serif;
  font-size:12px;
  font-weight:600;
  cursor:pointer;
  letter-spacing:.04em;
  display:inline-flex;
  align-items:center;
  gap:6px;
  transition:all .15s;
}
.est-tab:hover{ background:rgba(192,163,112,.15); }
.est-tab.is-active{
  background:#c0a370;
  color:#fff;
  border-color:#c0a370;
}
.est-tab-badge{
  background:rgba(192,163,112,.2);
  color:inherit;
  padding:1px 7px;
  border-radius:9px;
  font-size:10px;
  font-weight:700;
  min-width:18px;
  text-align:center;
}
.est-tab.is-active .est-tab-badge{
  background:rgba(255,255,255,.25);
}

/* ─── Moderation modal — admin review ──────────────────────────────── */
.est-mod-meta{
  font-size:11.5px;
  color:#7a5a3a;
  margin-bottom:14px;
  padding:10px 14px;
  background:rgba(192,163,112,.1);
  border-radius:6px;
  line-height:1.5;
}
.est-mod-detail-section{
  margin-top:14px;
  padding-top:14px;
  border-top:1px solid rgba(180,140,90,.25);
}
.est-mod-actions{
  display:flex;
  gap:10px;
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid rgba(180,140,90,.3);
}
.est-mod-reject-input{
  margin-top:10px;
  display:none;
}
.est-mod-reject-input.is-open{ display:block; }
.est-mod-reject-input textarea{
  width:100%;
  font:inherit; font-family:'Spectral', serif;
  font-size:12.5px;
  padding:8px 10px;
  background:#fff;
  border:1px solid rgba(180,140,90,.4);
  border-radius:6px;
  resize:vertical;
  min-height:60px;
}
.est-btn--approve{
  background:#3a7a3a;
  color:#fff;
  border-color:#3a7a3a;
}
.est-btn--approve:hover{ background:#2d5e2d; border-color:#2d5e2d; }
.est-btn--reject{
  background:#c44;
  color:#fff;
  border-color:#c44;
}
.est-btn--reject:hover{ background:#a33; border-color:#a33; }
