/* =============================================================================
   Nashashibi Studio — Canvas (Editing Surface)
   ============================================================================= */

.nb-canvas-stage {
  display: flex;
  justify-content: center;
  padding: 16px 16px 70px;
  min-height: 100%;
}

.nb-device-shell{width:100%;}

.nb-canvas-frame {
  width: 100%;
  max-width: 1320px;
  min-height: 78vh;
  background: var(--nb-surface);
  box-shadow: var(--nb-shadow-lg);
  border-radius: var(--nb-radius-lg);
  overflow: hidden;
  transition: width 0.3s ease;
  position: relative;
}

.nb-canvas-device {
  position: sticky;
  top: 0;
  z-index: 5;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  background: rgba(251, 248, 241, 0.92);
  backdrop-filter: blur(4px);
  border-bottom: 1px solid var(--nb-line);
  font-size: 11px;
  color: var(--nb-muted);
}

.nb-canvas-device .dashicons {
  font-size: 14px;
  color: var(--nb-gold-600);
}

/* ============================= Drop zone =================================== */

#builder-drop-zone {
  min-height: 70vh;
}

.builder-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 80px 24px;
  text-align: center;
  color: var(--nb-muted);
}

.builder-empty .dashicons {
  font-size: 52px;
  width: 52px;
  height: 52px;
  color: var(--nb-line-strong);
}

.builder-empty h2 {
  margin: 6px 0 0;
  font-size: 18px;
  font-weight: 800;
  color: var(--nb-navy-700);
}

.builder-empty p {
  margin: 0;
  font-size: 13px;
}

.builder-empty.is-dragover {
  outline: 2px dashed var(--nb-gold-500);
  outline-offset: -8px;
  border-radius: var(--nb-radius-lg);
  background: rgba(201, 163, 92, 0.06);
}

/* ============================= Sections ==================================== */

.nb-section {
  position: relative;
  margin: 0;
}

.nb-section.editor {
  padding: 10px;
  outline: 1px dashed transparent;
  transition: outline-color 0.15s ease, background 0.15s ease;
}

.nb-section.editor:hover {
  outline-color: rgba(201, 163, 92, 0.65);
  background: rgba(201, 163, 92, 0.03);
}

.nb-section.editor.is-selected {
  outline: 2px solid var(--nb-gold-500);
  outline-offset: 1px;
  background: rgba(201, 163, 92, 0.05);
}

.nb-section-actions {
  position: absolute;
  top: -24px;
  inset-inline-end: 10px;
  z-index: 30;
  display: flex;
  align-items: center;
  gap: 2px;
  height: 24px;
  padding: 0 6px;
  border-radius: var(--nb-radius-sm) var(--nb-radius-sm) 0 0;
  background: var(--nb-gold-600);
  color: #fff;
  font-size: 10.5px;
  font-weight: 700;
  opacity: 0;
  transition: opacity 0.15s ease;
  pointer-events: none;
}

.nb-section.editor:hover .nb-section-actions,
.nb-section.editor.is-selected .nb-section-actions {
  opacity: 1;
  pointer-events: auto;
}

.nb-section-actions button {
  border: none;
  background: transparent;
  color: #fff;
  cursor: pointer;
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 3px;
}

.nb-section-actions button:hover {
  background: rgba(255, 255, 255, 0.22);
}

.nb-section-actions .dashicons {
  font-size: 13px;
  width: 13px;
  height: 13px;
}

.nb-section-columns {
  display: flex;
  align-items: stretch;
  min-height: 40px;
}

/* ============================= Columns ===================================== */

.nb-column {
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  outline: 1px dashed transparent;
  transition: outline-color 0.15s ease;
}

.nb-column.editor:hover {
  outline-color: rgba(95, 122, 166, 0.7);
}

.nb-column.editor.is-selected {
  outline: 2px solid var(--nb-navy-400);
}

.nb-column.editor.is-empty {
  min-height: 70px;
}

.nb-column-width-badge {
  position: absolute;
  top: 6px;
  inset-inline-start: 6px;
  z-index: 25;
  padding: 1px 7px;
  border-radius: 999px;
  background: rgba(11, 20, 38, 0.7);
  color: #fff;
  font-size: 9.5px;
  font-weight: 700;
  opacity: 0;
  transition: opacity 0.15s ease;
  pointer-events: none;
}

.nb-column.editor:hover .nb-column-width-badge,
.nb-column.editor.is-selected .nb-column-width-badge {
  opacity: 1;
}

.nb-column-placeholder {
  display: grid;
  place-items: center;
  min-height: 70px;
  color: var(--nb-faint);
  font-size: 11px;
  outline: 1px dashed var(--nb-line-strong);
  border-radius: var(--nb-radius-sm);
  margin: 4px;
  cursor: copy;
}

.nb-column-placeholder:hover {
  outline-color: var(--nb-gold-500);
  color: var(--nb-gold-600);
  background: rgba(201, 163, 92, 0.05);
}

/* ============================= Elements ==================================== */

.nb-element {
  position: relative;
  outline: 1px dashed transparent;
  transition: outline-color 0.15s ease;
}

.nb-element.editor:hover {
  outline-color: rgba(201, 163, 92, 0.8);
}

.nb-element.editor.is-selected {
  outline: 2px solid var(--nb-gold-500);
  outline-offset: 1px;
}

.nb-element-tools {
  position: absolute;
  top: -24px;
  inset-inline-start: 6px;
  z-index: 35;
  display: flex;
  align-items: center;
  height: 24px;
  padding: 0 4px;
  border-radius: var(--nb-radius-sm);
  background: var(--nb-navy-700);
  box-shadow: var(--nb-shadow-sm);
  opacity: 0;
  transition: opacity 0.15s ease;
  pointer-events: none;
}

.nb-element.editor:hover .nb-element-tools,
.nb-element.editor.is-selected .nb-element-tools {
  opacity: 1;
  pointer-events: auto;
}

.nb-element-tools .nb-et-type {
  padding: 0 6px;
  color: var(--nb-gold-300);
  font-size: 9.5px;
  font-weight: 800;
  white-space: nowrap;
}

.nb-element-tools button {
  border: none;
  background: transparent;
  color: var(--nb-navy-200);
  cursor: pointer;
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 3px;
}

.nb-element-tools button:hover {
  background: rgba(255, 255, 255, 0.16);
  color: #fff;
}

.nb-element-tools .dashicons {
  font-size: 13px;
  width: 13px;
  height: 13px;
}

/* ============================= Drop indicators ============================= */

.nb-drop-before,
.nb-drop-after {
  height: 3px;
  border-radius: 999px;
  background: var(--nb-gold-500);
  box-shadow: 0 0 0 2px rgba(201, 163, 92, 0.25);
  margin: 2px 0;
  position: relative;
  z-index: 40;
  animation: nb-pulse-line 0.8s ease-in-out infinite;
}

.nb-drop-inner {
  position: absolute;
  inset: 0;
  border: 2px solid var(--nb-gold-500);
  border-radius: var(--nb-radius);
  background: rgba(201, 163, 92, 0.08);
  z-index: 42;
  pointer-events: none;
}

.nb-dragging-element {
  position: fixed;
  z-index: 999997;
  pointer-events: none;
  min-width: 140px;
  padding: 9px 14px;
  border-radius: var(--nb-radius);
  background: var(--nb-navy-700);
  color: #fff;
  font-family: var(--nb-font);
  font-size: 12px;
  font-weight: 700;
  box-shadow: var(--nb-shadow-lg);
  display: flex;
  align-items: center;
  gap: 8px;
  transform: translate(-50%, -50%);
}

.nb-dragging-element .dashicons {
  color: var(--nb-gold-400);
  font-size: 15px;
}

/* ============================= Inline editing ============================== */

.nb-element [contenteditable="true"] {
  outline: 1px dashed rgba(201, 163, 92, 0.55);
  outline-offset: 2px;
  border-radius: 3px;
  cursor: text;
  min-width: 30px;
}

.nb-element [contenteditable="true"]:focus {
  outline-color: var(--nb-gold-500);
}

/* ============================= Element visuals ============================= */

.nb-element .nb-button,
.nb-element .nb-heading,
.nb-element .nb-text,
.nb-element .nb-image,
.nb-element .nb-gallery,
.nb-element .nb-slideshow,
.nb-element .nb-divider,
/* Editor-only hit-test shield.  This must never match the standalone Preview:
   forms, tabs, accordions, maps and videos are real interactive content there. */
#builder-drop-zone .nb-element .nb-spacer,
#builder-drop-zone .nb-element .nb-map,
#builder-drop-zone .nb-element .nb-video,
#builder-drop-zone .nb-element .nb-tabs,
#builder-drop-zone .nb-element .nb-accordion,
#builder-drop-zone .nb-element .nb-counter,
#builder-drop-zone .nb-element .nb-hero,
#builder-drop-zone .nb-element .nb-lawyer-card,
#builder-drop-zone .nb-element .nb-practice,
#builder-drop-zone .nb-element .nb-team-grid,
#builder-drop-zone .nb-element .nb-testimonial,
#builder-drop-zone .nb-element .nb-faq,
#builder-drop-zone .nb-element .nb-contact-card,
#builder-drop-zone .nb-element .nb-timeline,
#builder-drop-zone .nb-element .nb-form {
  pointer-events: none;
  user-select: none;
}

/* FINAL 7.5.12 — direct text editing must remain targetable inside editor elements.
   The surrounding visual shell stays click-through, while actual contenteditable
   nodes receive pointer events and text selection. */
.nb-element [contenteditable="true"][data-live],
.nb-element .nb-rich-edit[contenteditable="true"] {
  pointer-events: auto !important;
  user-select: text !important;
  -webkit-user-select: text !important;
  cursor: text;
}

.nb-element .nb-button[data-live="true"] {
  pointer-events: auto;
}

#builder-drop-zone .nb-element .nb-image img {
  pointer-events: none;
}

/* ============================= Canvas toolbar ============================== */

.builder-canvas-toolbar {
  display: none;
}

/* ======================= Premium structural editing ======================= */
.nb-section-label {
  padding: 0 7px;
  color: #fff;
  opacity: .85;
  font-size: 9px;
  white-space: nowrap;
  border-inline-start: 1px solid rgba(255,255,255,.25);
  margin-inline-start: 3px;
}

.nb-column-resize {
  position: absolute;
  inset-inline-end: -4px;
  top: 0;
  bottom: 0;
  width: 9px;
  z-index: 55;
  cursor: col-resize;
  opacity: 0;
  transition: opacity .15s ease, background .15s ease;
}

.nb-column-resize::before {
  content: "";
  position: absolute;
  top: 50%;
  inset-inline-start: 2px;
  width: 4px;
  height: 54px;
  transform: translateY(-50%);
  border-radius: 999px;
  background: var(--nb-gold-500);
  box-shadow: 0 0 0 2px rgba(201,163,92,.18);
}

.nb-column.editor:hover .nb-column-resize,
.nb-column.editor.is-selected .nb-column-resize,
.nb-column-resize:hover {
  opacity: 1;
}

.nb-column-resize:hover {
  background: rgba(201,163,92,.10);
}

.nb-resizing-columns,
.nb-resizing-columns * {
  cursor: col-resize !important;
  user-select: none !important;
}

.nb-resizing-columns .nb-column-resize {
  opacity: 1;
}

.nb-section-actions button[data-section-action="add-before"],
.nb-section-actions button[data-section-action="add-after"] {
  background: rgba(255,255,255,.08);
}

.nb-section-actions button[data-section-action="delete"]:hover {
  background: #a83a3a;
}

@media (max-width: 768px) {
  .nb-column-resize { display: none; }
  .nb-section-actions { transform: scale(.92); transform-origin: top right; }
}

/* ====================== V12 visual editing controls ======================= */
.nb-section-drag { cursor: grab !important; }
.nb-section-drag:active { cursor: grabbing !important; }

.nb-section-insert-rail {
  position: relative;
  height: 12px;
  margin: 0 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 45;
}
.nb-section-insert-rail::before {
  content: "";
  position: absolute;
  left: 5%; right: 5%;
  top: 50%;
  border-top: 1px dashed rgba(201,163,92,.25);
}
.nb-section-insert-rail button {
  position: relative;
  width: 28px; height: 28px;
  border-radius: 50%;
  border: 2px solid #fff;
  background: var(--nb-gold-600);
  color: #fff;
  box-shadow: 0 3px 12px rgba(0,0,0,.18);
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
  opacity: .18;
  transition: opacity .15s ease, transform .15s ease;
}
.nb-section-insert-rail:hover button { opacity: 1; transform: scale(1.08); }

.nb-column-tools {
  position: absolute;
  top: 6px;
  inset-inline-end: 6px;
  z-index: 50;
  display: flex;
  gap: 3px;
  opacity: 0;
  transition: opacity .15s ease;
}
.nb-column.editor:hover .nb-column-tools,
.nb-column.editor.is-selected .nb-column-tools { opacity: 1; }
.nb-column-tools button {
  width: 22px; height: 22px;
  border: 1px solid rgba(11,20,38,.14);
  border-radius: 5px;
  background: rgba(255,255,255,.96);
  color: var(--nb-navy-700);
  cursor: pointer;
  font-weight: 800;
  box-shadow: 0 2px 8px rgba(0,0,0,.08);
}
.nb-column-tools button:hover { background: var(--nb-gold-500); color: #fff; }

.nb-section.editor.nb-dragging-section { opacity: .55; }
.nb-section-drop-target {
  outline: 3px solid var(--nb-gold-500) !important;
  outline-offset: 2px !important;
  background: rgba(201,163,92,.08) !important;
}

/* ======================= V13 — Global Site Chrome ======================= */
.nb-canvas-quick-add {
  display:flex; align-items:center; gap:6px; flex-wrap:wrap;
  padding:7px 12px; background:#fff; border-bottom:1px solid var(--nb-line);
  position:relative; z-index:8; box-shadow:0 2px 8px rgba(15,47,93,.05);
}
.nb-canvas-quick-add .nb-quick-title { font-size:11px; font-weight:800; color:var(--nb-navy-700); margin-inline-end:4px; }
.nb-canvas-quick-add button { border:1px solid var(--nb-line); background:#fbf8f1; color:var(--nb-navy-700); border-radius:6px; padding:5px 9px; cursor:pointer; font-size:11px; }
.nb-canvas-quick-add button:hover { border-color:var(--nb-gold-500); background:#fff; }
.nb-canvas-quick-add .nb-quick-toggle { margin-inline-start:auto; }
.nb-global-chrome { position:relative; border-inline:2px solid rgba(201,163,92,.18); background:#fff; }
.nb-global-bar { min-height:30px; display:flex; align-items:center; gap:7px; padding:5px 10px; background:linear-gradient(90deg,#0f2f5d,#1a3e74); color:#fff; font-size:10px; }
.nb-global-bar .dashicons { font-size:13px; width:13px; height:13px; }
.nb-global-bar strong { flex:1; }
.nb-global-edit { border:1px solid rgba(255,255,255,.45); background:rgba(255,255,255,.1); color:#fff; border-radius:5px; padding:3px 8px; cursor:pointer; font-size:10px; }
.nb-global-edit:hover { background:rgba(255,255,255,.22); }
.nb-global-background { border:1px solid #efd37d; background:#f7df93; color:#142b45; border-radius:5px; padding:4px 10px; cursor:pointer; font-size:10px; font-weight:900; }
.nb-global-background:hover { background:#fff0bb; }
.nb-global-header [data-header-background-editor] { cursor:pointer; }
.nb-global-header [data-header-background-editor]:hover:before { content:"انقر لتغيير صورة الهيدر وضبطها"; position:absolute; z-index:15; top:14px; left:50%; transform:translateX(-50%); padding:9px 15px; border-radius:999px; background:rgba(8,29,49,.9); color:#fff; border:1px solid rgba(237,208,117,.78); box-shadow:0 8px 25px rgba(0,0,0,.28); font-size:11px; font-weight:800; pointer-events:none; }
.nb-global-content { position:relative; min-height:24px; }
.nb-global-chrome,.nb-global-content,.nb-global-content>.nb-section,.nb-global-content>.nb-section>.nb-container,.nb-global-content .nb-column,.nb-global-content .nb-element{width:100%;max-width:none!important;margin-inline:0!important}.nb-global-content>.nb-section,.nb-global-content>.nb-section>.nb-container,.nb-global-content .nb-column,.nb-global-content .nb-element{padding-inline:0!important;border-inline:0!important}.nb-global-footer .nb-global-content{overflow:hidden;background:#071735}.nb-global-footer .nb-element-tools,.nb-global-header .nb-element-tools{display:none!important}
.nlo-preview-header,.nlo-preview-header>.nb-section,.nlo-preview-header>.nb-section>.nb-container,.nlo-preview-header>.nb-section>.nb-container>.nb-section-columns,.nlo-preview-header>.nb-section>.nb-container>.nb-section-columns>.nb-column,.nlo-preview-header .nb-element{width:100%!important;max-width:none!important;margin-inline:0!important}.nlo-preview-header>.nb-section,.nlo-preview-header>.nb-section>.nb-container,.nlo-preview-header>.nb-section>.nb-container>.nb-section-columns>.nb-column{padding-inline:0!important;border-radius:0!important}
.nb-global-empty, .nb-global-loading { padding:18px; text-align:center; color:#94a3b8; font-size:11px; border:1px dashed #dbe2ea; }
.nb-global-header { margin-bottom:0; }
.nb-global-footer { margin-top:0; }

/* FINAL 6.8 — page-header overlay controls stay visible and clickable. */
.nb-global-header .nlo-header-overlay-canvas{pointer-events:auto!important;cursor:default}
.nb-global-header .nlo-header-overlay-canvas>.nb-element{position:relative}
.nb-global-header .nlo-header-overlay-canvas>.nb-element>.nb-element-tools{display:flex!important;opacity:0;visibility:hidden;pointer-events:none!important;z-index:40!important}
.nb-global-header.is-header-overlay-active .nlo-header-overlay-canvas>.nb-element:hover>.nb-element-tools,
.nb-global-header.is-header-overlay-active .nlo-header-overlay-canvas>.nb-element.is-selected>.nb-element-tools,
.nb-global-header.is-header-overlay-active .nlo-header-overlay-canvas>.nb-element:focus-within>.nb-element-tools{opacity:1;visibility:visible;pointer-events:auto!important}
.nb-global-header.is-header-overlay-active .nlo-header-overlay-canvas{outline:2px dashed rgba(76,181,244,.78);outline-offset:-4px;background:rgba(19,120,184,.08)}
.nb-global-header .nlo-header-overlay-canvas>.nb-element.is-header-dragging{opacity:.35}
.nb-global-header .nlo-header-overlay-canvas>.nb-element.is-header-drop-before:before,
.nb-global-header .nlo-header-overlay-canvas>.nb-element.is-header-drop-after:after{content:"";position:absolute;right:0;left:0;height:4px;border-radius:999px;background:#56c2ff;box-shadow:0 0 0 2px rgba(7,35,64,.55);z-index:45}
.nb-global-header .nlo-header-overlay-canvas>.nb-element.is-header-drop-before:before{top:-7px}
.nb-global-header .nlo-header-overlay-canvas>.nb-element.is-header-drop-after:after{bottom:-7px}

/* ===================== V14 Precision Drop UI ===================== */
.nb-drop-before,
.nb-drop-after {
  display:block;
  height:4px;
  margin:5px 8px;
  border-radius:999px;
  background:linear-gradient(90deg,#c9a35c,#0f2f5d,#c9a35c);
  box-shadow:0 0 0 2px rgba(201,163,92,.14),0 3px 12px rgba(15,47,93,.18);
  pointer-events:none;
  position:relative;
  z-index:100;
}
.nb-drop-before::before,
.nb-drop-after::before {
  content:'إفلات هنا';
  position:absolute;
  inset-inline-start:10px;
  top:-9px;
  padding:2px 7px;
  border-radius:999px;
  background:#0f2f5d;
  color:#fff;
  font-size:9px;
  line-height:14px;
  white-space:nowrap;
}
.nb-drop-inner {
  display:block;
  min-height:34px;
  margin:5px;
  border:2px dashed rgba(201,163,92,.9);
  border-radius:8px;
  background:rgba(201,163,92,.10);
  pointer-events:none;
  position:relative;
  z-index:90;
}
.nb-drop-inner::after {
  content:'إضافة العنصر داخل هذا العمود';
  display:grid;
  place-items:center;
  height:30px;
  color:#7a5d28;
  font-size:10px;
  font-weight:700;
}
.nb-column.nb-drop-active {
  outline:2px solid rgba(201,163,92,.8) !important;
  outline-offset:-2px;
  background:rgba(201,163,92,.035);
}
.nb-resizing-columns .nb-column-resize { cursor:col-resize !important; }
.nb-resizing-columns, .nb-resizing-columns * { cursor:col-resize !important; user-select:none !important; }
.nb-section-drag, .nb-et-drag { cursor:grab !important; }
.nb-section-drag:active, .nb-et-drag:active { cursor:grabbing !important; }


/* ======================= V15 Global Part Editor =========================== */
.nb-part-canvas-head {
  position: sticky;
  top: 0;
  z-index: 60;
  min-height: 54px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:8px 18px;
  background:linear-gradient(135deg,#0b1c47,#17366f);
  color:#fff;
  border-bottom:2px solid var(--nb-gold-500,#c9a35c);
  box-shadow:0 5px 18px rgba(11,28,71,.18);
}
.nb-part-canvas-head > div { display:flex; align-items:center; gap:9px; }
.nb-part-canvas-head .dashicons { color:#d8bc70; font-size:20px; }
.nb-part-canvas-head strong { font-size:13px; }
.nb-part-canvas-head small { opacity:.75; font-size:10px; margin-inline-start:5px; }
.nb-part-canvas-live { font-size:9px; font-weight:800; letter-spacing:1.2px; padding:4px 8px; border:1px solid rgba(255,255,255,.3); border-radius:999px; }
.is-global-part-canvas #builder-drop-zone { min-height:55vh; background:linear-gradient(180deg,rgba(11,28,71,.025),transparent); }
.is-global-part-canvas #builder-drop-zone>.nb-section>.nb-container{width:100%;max-width:none!important;padding-inline:0}.is-global-part-canvas #builder-drop-zone>.nb-section>.nb-container>.nb-section-columns>.nb-column{max-width:100%!important}

.nb-global-mode-banner { background:#fff; border-bottom:1px solid #d8dee8; box-shadow:0 2px 8px rgba(11,20,38,.08); position:relative; z-index:100; }
.nb-global-mode-inner { min-height:58px; padding:7px 18px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.nb-global-mode-title { display:flex; align-items:center; gap:10px; color:#0b1c47; }
.nb-global-mode-title .dashicons { color:#bfa647; font-size:22px; }
.nb-global-mode-title strong { display:block; font-size:13px; }
.nb-global-mode-title small { display:block; color:#778196; font-size:10px; margin-top:2px; }
.nb-global-mode-actions { display:flex; gap:6px; flex-wrap:wrap; }
.nb-global-mode-btn { border:1px solid #d7dde6; background:#f7f8fa; color:#243552; border-radius:5px; padding:7px 11px; font-size:11px; font-weight:700; cursor:pointer; }
.nb-global-mode-btn:hover { border-color:#bfa647; background:#fffaf0; }
.nb-global-mode-back { background:#0b1c47; color:#fff; border-color:#0b1c47; }
.nb-global-mode-back:hover { background:#17366f; color:#fff; }

.nlo-global-brand { display:flex; flex-direction:column; padding:18px 24px; color:#0b1c47; }
.nlo-global-brand strong { font-size:22px; }
.nlo-global-brand span { color:#bfa647; font-size:13px; }
.nlo-global-nav { display:flex; gap:20px; align-items:center; justify-content:center; padding:18px 24px; flex-wrap:wrap; }
.nlo-global-nav a { color:#0b1c47; text-decoration:none; font-weight:700; font-size:13px; }
.nlo-global-contact { display:flex; gap:10px; justify-content:center; padding:18px; }
.nlo-global-contact a { padding:9px 15px; border-radius:999px; background:#0b1c47; color:#fff; text-decoration:none; font-weight:700; font-size:12px; }

@media(max-width:760px){
 .nb-global-mode-inner { align-items:flex-start; flex-direction:column; }
 .nb-global-mode-actions { width:100%; }
 .nb-global-mode-btn { flex:1 1 auto; }
 .nb-part-canvas-head small { display:none; }
}

/* NLO V23 image editor visual fidelity */
.nb-image .nb-image-visual{transition:box-shadow .2s ease,transform .2s ease}
.nb-image.is-frame .nb-image-visual{box-shadow:0 0 0 2px #bfa647,0 12px 28px rgba(15,47,93,.12);padding:3px}


/* FINAL 7.2.9 — keep live-site sticky/fixed headers inside the Builder canvas.
   This affects editor rendering only; preview/published pages keep their live behavior. */
#nb-frame .nb-global-header,
#nb-frame .nb-theme-page-shell{position:relative!important;isolation:isolate;z-index:1!important}
#nb-frame .nb-global-header .nb-global-content,
#nb-frame .nb-theme-page-shell.nb-builder-preview-scope{position:relative!important;z-index:1!important}
#nb-frame .nb-builder-flow-lock{
  position:relative!important;
  top:auto!important;right:auto!important;bottom:auto!important;left:auto!important;
  inset:auto!important;
  z-index:auto!important;
}
/* Header dropdowns may remain layered inside the header, but cannot cover Builder chrome. */
#nb-frame .nb-global-header .nb-builder-flow-lock,
#nb-frame .nb-theme-page-shell .nb-builder-flow-lock{max-width:100%!important}
#nb-frame .nb-canvas-quick-add{z-index:90!important}


/* FINAL 7.2.23 — Weebly-style Global Header/Footer edit affordances. */
.nb-global-bar .nb-global-scope-badge{
  display:inline-flex;align-items:center;justify-content:center;min-height:22px;
  padding:2px 7px;border-radius:999px;background:#e7eef4;color:#31536c;
  border:1px solid #c7d6e2;font:800 8px/1 Arial,sans-serif;letter-spacing:.8px;
}
.nb-global-bar .nb-global-builder-edit{background:#0b3152!important;color:#fff!important;border-color:#0b3152!important;font-weight:800!important}
.nb-global-bar .nb-global-builder-edit:hover{background:#0e426e!important;border-color:#0e426e!important}
.nb-global-bar .nb-global-template-edit{background:#fff!important;color:#53636d!important;border-color:#c8d2d9!important}
.nb-global-bar .nb-global-template-edit:hover{color:#0b3152!important;border-color:#8ea7b8!important}
/* Weebly “No Header” = keep global navigation, suppress the visual hero area. */
.nb-canvas-frame[data-page-template="no-header"] .nb-global-header .nlo-legacy-identity,
.nb-canvas-frame[data-page-template="no-header"] .nb-global-header .nlo-legacy-hero,
#nb-frame[data-page-template="no-header"] .nb-global-header .nlo-legacy-identity,
#nb-frame[data-page-template="no-header"] .nb-global-header .nlo-legacy-hero,
.nb-canvas-frame[data-page-template="no-header"] .nb-global-header .nlo-signature-strip,
.nb-canvas-frame[data-page-template="no-header"] .nb-global-header .nlo-heritage-seal,
#nb-frame[data-page-template="no-header"] .nb-global-header .nlo-signature-strip,
#nb-frame[data-page-template="no-header"] .nb-global-header .nlo-heritage-seal{display:none!important}
@media(max-width:760px){.nb-global-bar{flex-wrap:wrap!important}.nb-global-bar strong{min-width:140px}.nb-global-bar .nb-global-scope-badge{order:2}}
/* FINAL 7.3.1 — bilingual global Header/Footer language switch. */
.nb-global-language-switch{display:inline-flex;gap:2px;padding:2px;border:1px solid #d7dde6;border-radius:7px;background:#eef1f5}
.nb-global-language-switch .nb-global-mode-btn{min-width:42px;padding:5px 9px;border-color:transparent;background:transparent}
.nb-global-language-switch .nb-global-mode-btn.is-active{background:#0b1c47;color:#fff;border-color:#0b1c47;box-shadow:0 1px 4px rgba(11,28,71,.18)}


/* FINAL 7.4.3.3 — Weebly-style direct global editing + guaranteed element removal. */
.nb-global-content{position:relative!important}
.nb-global-direct-edit{position:absolute;z-index:2147482000;top:12px;inset-inline-end:12px;display:flex;gap:7px;align-items:center;opacity:0;transform:translateY(-3px);transition:.16s ease;pointer-events:none!important}
.nb-global-chrome:hover .nb-global-direct-edit,.nb-global-chrome:focus-within .nb-global-direct-edit{opacity:1;transform:none;pointer-events:auto!important}
.nb-global-direct-edit button{pointer-events:auto!important;border:1px solid rgba(255,255,255,.88);background:#0b315b;color:#fff;border-radius:7px;padding:8px 11px;font:800 10px Tajawal,Arial,sans-serif;box-shadow:0 8px 24px rgba(4,19,38,.22);cursor:pointer}
.nb-global-direct-edit button.is-gold{background:linear-gradient(135deg,#ead27c,#b38d2d);color:#071a34;border-color:#f7e6a8}
.nb-global-direct-edit button:hover{filter:brightness(1.08)}
.nb-canvas-quick-add .nb-quick-global{background:#0b315b!important;color:#fff!important;border-color:#0b315b!important}

/* Keep element controls INSIDE the element so Search, Embed, forms and media
   can never clip the delete control above the canvas boundary. */
#builder-drop-zone .nb-element{position:relative!important;overflow:visible}
#builder-drop-zone .nb-element>.nb-element-tools{display:flex!important;position:absolute!important;top:6px!important;right:6px!important;left:auto!important;z-index:2147483000!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translateY(-2px);background:rgba(7,26,52,.94)!important;border:1px solid rgba(255,255,255,.2)!important;border-radius:7px!important;padding:3px!important;gap:2px!important;box-shadow:0 7px 22px rgba(0,0,0,.24)!important}
#builder-drop-zone .nb-element:hover>.nb-element-tools,#builder-drop-zone .nb-element.is-selected>.nb-element-tools,#builder-drop-zone .nb-element:focus-within>.nb-element-tools{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:none!important}
#builder-drop-zone .nb-element>.nb-element-tools button{display:flex!important;align-items:center!important;gap:4px!important;min-height:28px!important;padding:4px 7px!important;color:#fff!important;background:transparent!important;border:0!important;border-radius:5px!important;cursor:pointer!important}
#builder-drop-zone .nb-element>.nb-element-tools .nb-et-delete{background:#a62d35!important}
#builder-drop-zone .nb-element>.nb-element-tools .nb-et-delete:hover{background:#c4303a!important}
.nb-tool-delete-label{font:800 10px Tajawal,Arial,sans-serif;color:inherit}

/* In explicit Global Header/Footer Builder mode these are ordinary canvas
   elements: all controls remain visible and all palette elements can be added,
   moved, duplicated and deleted. */
body.nb-global-editing #builder-drop-zone .nb-element>.nb-element-tools{top:8px!important;right:8px!important}

/* 7.5.48 — explicit Hero image editor hotspot. Theme CSS cannot hide this
   control because it is an editor affordance owned by the Builder. */
.nb-global-header .nlo-builder-hero-image-edit,
#builder-drop-zone .nb-element[data-type="nash_header"] .nlo-builder-hero-image-edit{
  position:absolute!important;
  z-index:2147483000!important;
  top:16px!important;
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  min-width:172px!important;
  height:40px!important;
  margin:0!important;
  padding:0 16px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  border:1px solid rgba(237,208,117,.88)!important;
  border-radius:999px!important;
  background:rgba(7,28,49,.94)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  box-shadow:0 8px 26px rgba(0,0,0,.30)!important;
  font:800 12px/1 Tajawal,"Segoe UI",Tahoma,Arial,sans-serif!important;
  cursor:pointer!important;
  pointer-events:auto!important;
  opacity:.92!important;
}
.nb-global-header .nlo-builder-hero-image-edit:hover,
#builder-drop-zone .nb-element[data-type="nash_header"] .nlo-builder-hero-image-edit:hover{
  background:#0b3558!important;
  border-color:#f2d985!important;
  opacity:1!important;
}