/* NAB MACHINES v9 final controls and professional visuals */
body.modal-open { overflow:hidden !important; }
.header-tool-btn[data-v9-lang], .header-tool-btn[data-v9-search], .header-tool-btn[data-lang-toggle], .header-tool-btn[data-site-search-open] {
  min-height:44px !important; min-width:48px !important; padding:10px 15px !important; border:0 !important; border-radius:999px !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important; gap:8px !important; font-weight:1000 !important; cursor:pointer !important;
  position:relative !important; z-index:120 !important; box-shadow:0 12px 30px rgba(15,97,108,.14) !important;
}
.header-tool-btn[data-lang-toggle] { background:linear-gradient(135deg,var(--teal),#168897) !important; color:#fff !important; }
.header-tool-btn[data-site-search-open] { background:linear-gradient(135deg,var(--gold),#f4dc97) !important; color:#14373d !important; }
.header-tool-btn:hover { transform:translateY(-2px) !important; filter:brightness(1.04) !important; }
.category-card .link-more {
  display:inline-flex !important; align-items:center !important; justify-content:center !important; gap:9px !important;
  margin-top:14px !important; padding:12px 18px !important; width:max-content !important; border-radius:999px !important;
  background:linear-gradient(135deg,var(--teal),#168897) !important; color:#fff !important; font-weight:1000 !important; text-decoration:none !important;
  box-shadow:0 16px 40px rgba(15,97,108,.25) !important; border:1px solid rgba(255,255,255,.25) !important;
}
.category-card .link-more::after { content:'←'; font-weight:1000; }
html[dir="ltr"] .category-card .link-more::after { content:'→'; }
.category-card .link-more:hover { background:linear-gradient(135deg,#0b515b,var(--teal)) !important; transform:translateY(-3px) !important; box-shadow:0 24px 56px rgba(15,97,108,.32) !important; }
.nab-v9-explain-grid { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:26px !important; align-items:stretch !important; }
.nab-v9-explain-card { position:relative !important; overflow:hidden !important; border-radius:28px !important; border:1px solid rgba(15,97,108,.18) !important; background:linear-gradient(180deg,#fff,#f7fcfc) !important; box-shadow:0 20px 62px rgba(15,97,108,.13) !important; transition:.22s ease !important; }
.nab-v9-explain-card:hover { transform:translateY(-6px) !important; border-color:rgba(215,180,112,.8) !important; box-shadow:0 32px 88px rgba(15,97,108,.23) !important; }
.nab-v9-explain-card::before { content:''; position:absolute; inset:0 0 auto 0; height:5px; background:linear-gradient(90deg,var(--teal),var(--gold),#68c0d8); z-index:2; }
.nab-v9-explain-img { width:100% !important; height:clamp(340px,33vw,500px) !important; object-fit:contain !important; object-position:center !important; padding:20px !important; background:linear-gradient(135deg,#f8fdfd,#eef8f7) !important; cursor:zoom-in !important; }
.technical-img .nab-v9-explain-img { height:auto !important; min-height:360px !important; max-height:760px !important; padding:24px !important; }
.nab-v9-explain-card h3 { margin:0 !important; padding:17px 20px !important; border-top:1px solid var(--line) !important; background:#fff !important; font-weight:1000 !important; color:var(--teal) !important; display:flex !important; align-items:center !important; justify-content:space-between !important; gap:10px !important; }
.nab-v9-explain-card h3::after { content:'اضغط للتكبير'; color:var(--gold) !important; font-size:.84rem !important; font-weight:1000 !important; white-space:nowrap !important; }
html[lang="en"] .nab-v9-explain-card h3::after { content:'Click to zoom'; }
.nab-v9-zoom-badge { position:absolute; top:16px; inset-inline-end:16px; z-index:4; width:46px; height:46px; border-radius:50%; background:linear-gradient(135deg,var(--teal),#168897); color:#fff; display:grid; place-items:center; font-size:1.15rem; font-weight:1000; box-shadow:0 15px 36px rgba(15,97,108,.30); pointer-events:none; }
.nab-v9-zoomable { cursor:zoom-in !important; }
.nab-v9-search, .nab-v9-lightbox { position:fixed !important; inset:0 !important; z-index:100000 !important; background:rgba(3,18,21,.78) !important; backdrop-filter:blur(10px) !important; display:none !important; align-items:flex-start !important; justify-content:center !important; padding:24px !important; }
.nab-v9-search.show, .nab-v9-lightbox.show { display:flex !important; }
.nab-v9-search-panel { width:min(980px,100%) !important; margin-top:40px !important; max-height:88vh !important; overflow:hidden !important; border-radius:30px !important; background:#fff !important; border:1px solid rgba(255,255,255,.35) !important; box-shadow:0 36px 110px rgba(0,0,0,.35) !important; }
.nab-v9-search-head { display:flex !important; align-items:flex-start !important; justify-content:space-between !important; gap:16px !important; padding:20px 24px !important; border-bottom:1px solid var(--line) !important; background:linear-gradient(90deg,rgba(15,97,108,.10),rgba(215,180,112,.15)) !important; }
.nab-v9-search-head h3 { margin:0 0 4px !important; color:var(--teal) !important; font-size:1.45rem !important; }
.nab-v9-search-head p { margin:0 !important; color:var(--muted) !important; line-height:1.6 !important; }
.nab-v9-search-close, .nab-v9-close { border:0 !important; border-radius:50% !important; background:var(--teal) !important; color:#fff !important; width:44px !important; height:44px !important; font-size:1.45rem !important; cursor:pointer !important; display:grid !important; place-items:center !important; flex:0 0 auto !important; }
.nab-v9-search-form { display:flex !important; gap:12px !important; padding:18px 24px !important; border-bottom:1px solid var(--line) !important; }
.nab-v9-search-form input { flex:1 !important; border:1px solid var(--line) !important; border-radius:999px !important; padding:15px 20px !important; font-size:1.03rem !important; outline:0 !important; background:#f8fcfc !important; color:var(--ink) !important; }
.nab-v9-search-form input:focus { border-color:var(--teal) !important; background:#fff !important; box-shadow:0 0 0 4px rgba(15,97,108,.08) !important; }
.nab-v9-search-form button { border:0 !important; border-radius:999px !important; padding:14px 24px !important; background:linear-gradient(135deg,var(--teal),#168897) !important; color:#fff !important; font-weight:1000 !important; cursor:pointer !important; }
.nab-v9-search-results { padding:16px 24px 24px !important; display:grid !important; gap:12px !important; max-height:54vh !important; overflow:auto !important; }
.nab-v9-result { display:grid !important; grid-template-columns:108px 1fr !important; gap:16px !important; align-items:center !important; padding:13px !important; border:1px solid var(--line) !important; border-radius:20px !important; background:#fff !important; transition:.18s ease !important; }
.nab-v9-result:hover { transform:translateY(-2px) !important; box-shadow:0 18px 48px rgba(15,97,108,.15) !important; }
.nab-v9-result img { width:108px !important; height:76px !important; object-fit:contain !important; background:#f1faf9 !important; border-radius:14px !important; padding:5px !important; }
.nab-v9-result h4 { margin:0 0 5px !important; direction:ltr !important; text-align:left !important; color:var(--ink) !important; }
.nab-v9-result p { margin:0 0 5px !important; color:var(--muted) !important; font-size:.92rem !important; line-height:1.5 !important; }
.nab-v9-result span { color:var(--teal) !important; font-weight:1000 !important; }
.nab-v9-empty { padding:36px 12px !important; text-align:center !important; color:var(--muted) !important; font-weight:800 !important; }
.nab-v9-lightbox { align-items:center !important; padding:18px !important; }
.nab-v9-lightbox-panel { width:min(1320px,100%) !important; max-height:96vh !important; display:flex !important; flex-direction:column !important; overflow:hidden !important; border-radius:30px !important; background:#fff !important; box-shadow:0 40px 120px rgba(0,0,0,.45) !important; }
.nab-v9-lightbox-top { display:flex !important; align-items:flex-start !important; justify-content:space-between !important; gap:16px !important; padding:16px 20px !important; border-bottom:1px solid var(--line) !important; background:linear-gradient(90deg,rgba(15,97,108,.10),rgba(215,180,112,.15)) !important; }
.nab-v9-lightbox-top h3 { margin:0 !important; color:var(--teal) !important; font-size:clamp(1rem,1.8vw,1.38rem) !important; line-height:1.45 !important; }
.nab-v9-lightbox-top p { margin:5px 0 0 !important; color:var(--muted) !important; font-weight:800 !important; line-height:1.5 !important; }
.nab-v9-zoom-tools { display:flex !important; align-items:center !important; justify-content:flex-end !important; gap:8px !important; flex-wrap:wrap !important; }
.nab-v9-zoom-tools button[data-z] { border:1px solid var(--line) !important; border-radius:999px !important; background:#fff !important; color:var(--teal) !important; padding:9px 12px !important; font-weight:1000 !important; cursor:pointer !important; }
.nab-v9-zoom-tools button[data-z].active, .nab-v9-zoom-tools button[data-z]:hover { background:linear-gradient(135deg,var(--gold),#f4dc97) !important; color:#14373d !important; }
.nab-v9-lightbox-body { position:relative !important; flex:1 !important; min-height:360px !important; display:grid !important; place-items:center !important; overflow:hidden !important; background:linear-gradient(135deg,#f8fdfd,#edf7f6) !important; padding:18px !important; }
.nab-v9-lightbox-body.zoomed { overflow:auto !important; place-items:start center !important; cursor:grab !important; }
.nab-v9-lightbox-body.dragging { cursor:grabbing !important; }
.nab-v9-lightbox-body img { max-width:100% !important; max-height:78vh !important; object-fit:contain !important; border-radius:18px !important; background:#fff !important; box-shadow:0 20px 60px rgba(0,0,0,.18) !important; transition:width .2s ease, max-height .2s ease !important; }
.nab-v9-lightbox-body.zoomed img { margin:48px auto !important; max-width:none !important; max-height:none !important; }
.nab-v9-arrow { position:absolute !important; top:50% !important; transform:translateY(-50%) !important; z-index:5 !important; border:0 !important; border-radius:50% !important; background:rgba(15,97,108,.95) !important; color:#fff !important; width:50px !important; height:50px !important; font-size:1.8rem !important; cursor:pointer !important; box-shadow:0 15px 36px rgba(15,97,108,.25) !important; }
.nab-v9-arrow.prev { inset-inline-start:16px !important; } .nab-v9-arrow.next { inset-inline-end:16px !important; }
.nab-v9-lightbox-cap { padding:13px 20px !important; border-top:1px solid var(--line) !important; color:var(--muted) !important; font-weight:800 !important; line-height:1.6 !important; }
html[data-theme="dark"] .nab-v9-search-panel, html[data-theme="dark"] .nab-v9-lightbox-panel, html[data-theme="dark"] .nab-v9-result, html[data-theme="dark"] .nab-v9-explain-card, html[data-theme="dark"] .nab-v9-explain-card h3 { background:#0b252a !important; color:var(--ink) !important; border-color:var(--line) !important; }
html[data-theme="dark"] .nab-v9-search-form input { background:#102f35 !important; color:var(--ink) !important; }
html[data-theme="dark"] .nab-v9-lightbox-body, html[data-theme="dark"] .nab-v9-explain-img { background:linear-gradient(135deg,#071c20,#0b252a) !important; }
@media (max-width:760px){
  .header-tool-btn .label { display:none !important; }
  .nab-v9-explain-grid { grid-template-columns:1fr !important; gap:18px !important; }
  .nab-v9-explain-img { height:clamp(280px,74vw,420px) !important; padding:14px !important; }
  .technical-img .nab-v9-explain-img { min-height:240px !important; }
  .nab-v9-search, .nab-v9-lightbox { padding:8px !important; }
  .nab-v9-search-panel { margin-top:28px !important; border-radius:22px !important; }
  .nab-v9-search-form { flex-direction:column !important; }
  .nab-v9-result { grid-template-columns:76px 1fr !important; }
  .nab-v9-result img { width:76px !important; height:58px !important; }
  .nab-v9-lightbox-panel { max-height:98vh !important; border-radius:22px !important; }
  .nab-v9-lightbox-top { flex-direction:column !important; padding:12px !important; }
  .nab-v9-zoom-tools { justify-content:center !important; width:100% !important; }
  .nab-v9-lightbox-body { min-height:300px !important; padding:10px !important; }
  .nab-v9-arrow { width:40px !important; height:40px !important; font-size:1.45rem !important; }
  .category-card .link-more { width:100% !important; }
}
