/* IIC – Admin CMS Styles */

/* Toggle button */
#admin-toggle {
  position: fixed; bottom: 28px; right: 28px; z-index: 9999;
  width: 56px; height: 56px; border-radius: 50%;
  border: 2px solid rgba(201,168,76,0.4);
  background: linear-gradient(135deg, #0f2044, #162d5e);
  color: #fff; font-size: 1.4rem; cursor: pointer;
  box-shadow: 0 6px 28px rgba(0,0,0,0.5), 0 0 20px rgba(201,168,76,0.15);
  transition: all 0.3s ease;
  display: flex; align-items: center; justify-content: center;
}
#admin-toggle:hover {
  transform: scale(1.1);
  border-color: rgba(201,168,76,0.7);
  box-shadow: 0 8px 36px rgba(0,0,0,0.5), 0 0 30px rgba(201,168,76,0.3);
}

/* Toolbar */
#admin-toolbar {
  position: fixed; top: -72px; left: 0; right: 0; z-index: 10000;
  background: linear-gradient(135deg, #0a1628 0%, #162d5e 100%);
  border-bottom: 2px solid rgba(201,168,76,0.35);
  box-shadow: 0 4px 30px rgba(0,0,0,0.6);
  padding: 0 24px;
  transition: top 0.4s cubic-bezier(0.4,0,0.2,1);
}
#admin-toolbar.visible { top: 0; }
.edit-mode .navbar { top: 70px !important; }

.atb-inner {
  max-width: 1300px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  height: 70px; gap: 16px;
}
.atb-left { display: flex; align-items: center; gap: 16px; }
.atb-badge { font-family:'Outfit',sans-serif; font-weight:700; font-size:0.9rem; color:#C9A84C; }
.atb-hint { font-size:0.75rem; color:#8fa3bb; font-style:italic; }
.atb-right { display:flex; align-items:center; gap:8px; }

/* Admin buttons */
.abtn {
  font-family:'Outfit',sans-serif; font-weight:600; font-size:0.8rem;
  padding: 8px 14px; border-radius:8px;
  border: 1px solid rgba(255,255,255,0.12);
  cursor:pointer; transition: all 0.2s ease; white-space:nowrap;
}
.abtn-gold { background: linear-gradient(135deg,#a88832,#e8c56a); color:#0a1628; border-color:transparent; }
.abtn-gold:hover { box-shadow: 0 4px 16px rgba(201,168,76,0.4); transform:translateY(-1px); }
.abtn-secondary { background: rgba(255,255,255,0.07); color:#b8c4d4; }
.abtn-secondary:hover { background:rgba(201,168,76,0.12); color:#e8c56a; border-color:rgba(201,168,76,0.3); }
.abtn-danger { background: rgba(255,255,255,0.07); color:#b8c4d4; }
.abtn-danger:hover { background:rgba(255,80,80,0.15); color:#ff6b6b; border-color:rgba(255,80,80,0.3); }
.abtn-close { background:rgba(255,255,255,0.06); color:#8fa3bb; width:36px;height:36px;padding:0;display:flex;align-items:center;justify-content:center;font-size:1rem; }
.abtn-close:hover { background:rgba(255,80,80,0.2); color:#ff6b6b; }

/* Editable text */
.edit-mode .editable {
  outline: 1px dashed rgba(201,168,76,0.35);
  outline-offset: 3px; cursor:text; border-radius:4px;
  transition: outline-color 0.2s, background 0.2s;
}
.edit-mode .editable:hover { outline-color:rgba(201,168,76,0.65); background:rgba(201,168,76,0.05); }
.edit-mode .editable.editing { outline: 2px solid #C9A84C; background:rgba(201,168,76,0.08); box-shadow:0 0 16px rgba(201,168,76,0.12); }

/* Add row buttons */
.adm-add-row {
  display: flex; justify-content:center;
  padding: 16px 0 8px;
}
.adm-add-btn {
  font-family:'Outfit',sans-serif; font-weight:600; font-size:0.85rem;
  padding:10px 24px; border-radius:8px;
  background: rgba(201,168,76,0.08);
  border: 1.5px dashed rgba(201,168,76,0.35);
  color:#C9A84C; cursor:pointer;
  transition: all 0.2s ease;
}
.adm-add-btn:hover { background:rgba(201,168,76,0.15); border-color:#C9A84C; }

/* Item controls (delete/duplicate) */
.item-ctrl {
  position:absolute; top:8px; right:8px;
  display:none; gap:4px; z-index:10;
}
.edit-mode .service-card .item-ctrl,
.edit-mode .area-item .item-ctrl,
.edit-mode .team-card .item-ctrl { display:flex; opacity:0.45; transition: opacity 0.2s; }
.edit-mode .service-card:hover .item-ctrl,
.edit-mode .area-item:hover .item-ctrl,
.edit-mode .team-card:hover .item-ctrl { opacity:1; }
.edit-mode #nav-menu li:hover .item-ctrl { display:flex; }

.ic-btn {
  width:26px; height:26px; border-radius:6px;
  border:none; cursor:pointer; font-size:0.75rem;
  display:flex; align-items:center; justify-content:center;
  transition: all 0.2s;
}
.ic-dup { background:rgba(201,168,76,0.2); color:#e8c56a; }
.ic-dup:hover { background:rgba(201,168,76,0.4); }
.ic-del { background:rgba(255,80,80,0.2); color:#ff6b6b; }
.ic-del:hover { background:rgba(255,80,80,0.4); }

/* Nav list item needs relative positioning */
.edit-mode #nav-menu li { position:relative; }
.edit-mode #nav-menu li .item-ctrl { top:50%; transform:translateY(-50%); right:0; }

/* ── Panel (Sections / Menu) ── */
#admin-panel {
  position:fixed; inset:0; z-index:20000;
  display:flex; align-items:center; justify-content:center;
}
.ap-backdrop {
  position:absolute; inset:0;
  background:rgba(6,13,26,0.75);
  backdrop-filter:blur(6px);
}
.ap-box {
  position:relative; z-index:1;
  background: linear-gradient(145deg, #0f2044, #0a1628);
  border:1px solid rgba(201,168,76,0.25);
  border-radius:16px;
  width:min(560px, 92vw);
  max-height:80vh; overflow:hidden;
  display:flex; flex-direction:column;
  box-shadow: 0 24px 60px rgba(0,0,0,0.6);
}
.ap-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:20px 24px;
  border-bottom:1px solid rgba(201,168,76,0.15);
}
.ap-header h3 { font-family:'Outfit',sans-serif; font-size:1.1rem; font-weight:700; color:#fff; }
.ap-close {
  background:rgba(255,255,255,0.07); border:none; color:#8fa3bb;
  width:32px;height:32px;border-radius:8px;cursor:pointer;font-size:1rem;
  display:flex;align-items:center;justify-content:center;transition:all 0.2s;
}
.ap-close:hover { background:rgba(255,80,80,0.2); color:#ff6b6b; }
.ap-body { padding:20px 24px; overflow-y:auto; }
.ap-desc { font-size:0.85rem; color:#8fa3bb; margin-bottom:16px; }

/* Section panel */
.sp-list { display:flex; flex-direction:column; gap:10px; }
.sp-row {
  display:flex; align-items:center; justify-content:space-between;
  background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.08);
  border-radius:10px; padding:12px 16px;
  transition: border-color 0.2s;
}
.sp-row:hover { border-color:rgba(201,168,76,0.2); }
.sp-label { font-family:'Outfit',sans-serif; font-size:0.9rem; color:#e0e8f0; flex:1; }
.sp-actions { display:flex; align-items:center; gap:10px; }
.sp-del {
  width:32px; height:32px; border-radius:8px; flex-shrink:0;
  font-size:0.85rem;
}
.sp-toggle { position:relative; display:inline-block; width:44px; height:24px; }
.sp-toggle input { opacity:0; width:0; height:0; }
.sp-slider {
  position:absolute; inset:0; background:#1e3a78; border-radius:24px; cursor:pointer;
  transition:0.3s;
}
.sp-slider::before {
  content:''; position:absolute; width:18px;height:18px;
  left:3px; bottom:3px; background:#8fa3bb; border-radius:50%;
  transition:0.3s;
}
.sp-toggle input:checked + .sp-slider { background:rgba(201,168,76,0.3); border:1px solid #C9A84C; }
.sp-toggle input:checked + .sp-slider::before { transform:translateX(20px); background:#C9A84C; }

/* Menu panel */
.mp-row {
  display:flex; align-items:center; gap:8px; margin-bottom:10px;
  background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.07);
  border-radius:10px; padding:10px 12px;
  transition: border-color 0.2s;
}
.mp-row:hover { border-color:rgba(201,168,76,0.2); }
.mp-order { display:flex; flex-direction:column; gap:3px; flex-shrink:0; }
.mp-up, .mp-dn {
  width:24px; height:24px; border-radius:5px;
  background:rgba(255,255,255,0.07); border:1px solid rgba(255,255,255,0.1);
  color:#8fa3bb; font-size:0.7rem; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition: all 0.2s;
}
.mp-up:hover:not([disabled]), .mp-dn:hover:not([disabled]) {
  background:rgba(201,168,76,0.15); color:#e8c56a; border-color:rgba(201,168,76,0.3);
}
.mp-up[disabled], .mp-dn[disabled] { opacity:0.3; cursor:default; }
.mp-text,.mp-href {
  flex:1; background:rgba(15,32,68,0.7);
  border:1.5px solid rgba(201,168,76,0.15); border-radius:8px;
  padding:10px 12px; color:#fff; font-size:0.88rem; outline:none;
  transition:border-color 0.2s;
}
.mp-text:focus,.mp-href:focus { border-color:#C9A84C; }
.mp-href { flex:1.2; }
.mp-del { flex-shrink:0; width:32px;height:32px; }

/* Panel actions footer */
.ap-actions {
  display:flex; gap:10px; margin-top:20px;
  padding-top:16px; border-top:1px solid rgba(255,255,255,0.08);
}
.ap-empty {
  text-align:center; color:#8fa3bb; font-size:0.88rem;
  padding:24px 0; font-style:italic;
}

/* Toast */
.admin-toast {
  position:fixed; bottom:32px; left:50%;
  transform:translateX(-50%) translateY(16px);
  background:linear-gradient(135deg,#162d5e,#0f2044);
  color:#e8c56a; font-family:'Outfit',sans-serif;
  font-weight:600; font-size:0.9rem;
  padding:12px 28px; border-radius:12px;
  border:1px solid rgba(201,168,76,0.35);
  box-shadow:0 8px 32px rgba(0,0,0,0.5);
  opacity:0; pointer-events:none;
  transition:all 0.35s cubic-bezier(0.4,0,0.2,1);
  z-index:99999;
}
.admin-toast.visible { opacity:1; transform:translateX(-50%) translateY(0); }

/* Responsive */
@media(max-width:768px){
  .atb-inner { flex-direction:column; height:auto; padding:10px 0; gap:8px; }
  .atb-right { flex-wrap:wrap; justify-content:center; }
  .atb-hint { display:none; }
  .edit-mode .navbar { top:110px !important; }
}