/* V2_DEEP_SPLIT_LEGACY_STYLE_NOTICE: style.css remains legacy shell. New edits should go to static/css/components or static/css/pages. */
        @import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;700;900&display=swap');
        body { background: radial-gradient(circle at 50% 0%, var(--brand-panel) 0%, var(--brand-bg-alt) 58%, var(--brand-bg) 100%); color: var(--brand-text); font-family: 'Cairo', sans-serif; font-size: 14px; line-height: 1.55; min-height: 100vh;}
        .hidden { display: none !important; }
        .card { background: color-mix(in srgb, var(--brand-panel) 60%, transparent); backdrop-filter: blur(8px); border: 1px solid color-mix(in srgb, var(--brand-accent) 16%, transparent); border-radius: 14px; transition: 0.18s ease; box-shadow: 0 8px 18px rgba(2, 6, 23, 0.18); }
        .input-glass { background: color-mix(in srgb, var(--brand-bg-alt) 86%, transparent) !important; border: 1px solid color-mix(in srgb, var(--brand-accent) 16%, transparent) !important; color: var(--brand-text) !important; border-radius: 10px !important; padding: 8px 12px !important; min-height: 42px; outline: none; transition: 0.18s ease; width: 100%; }
        .input-glass:focus { border-color: var(--brand-accent) !important; box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand-accent) 18%, transparent); }
        .btn-primary { background: linear-gradient(135deg, var(--brand-accent), var(--brand-accent-soft)); color: #111827; padding: 9px 18px; border-radius: 10px; font-weight: bold; transition: 0.18s ease; cursor: pointer; border: none; box-shadow: 0 2px 8px rgba(0,0,0,0.14); }
        .btn-primary:hover { box-shadow: 0 4px 12px rgba(0,0,0,0.16); transform: translateY(-1px); }
        .nav-btn { font-weight: bold; color: var(--brand-muted); padding: 10px 18px; border-radius: 10px; transition: 0.18s ease; cursor: pointer; }
        .nav-btn:hover { color: white; background: rgba(255,255,255,0.05); }
        .nav-btn.active { color: var(--brand-text); background: color-mix(in srgb, var(--brand-accent) 14%, var(--brand-panel)); border: 1px solid color-mix(in srgb, var(--brand-accent) 24%, transparent); box-shadow: inset 0 2px 4px rgba(0,0,0,0.2); }
        .tab-btn { background: transparent; color: #64748b; font-weight: bold; padding: 10px 18px; border-radius: 10px; cursor: pointer; transition: 0.18s ease; font-size: 13px; }
        .tab-btn.active { background: color-mix(in srgb, var(--brand-accent) 12%, transparent); color: var(--brand-accent-soft); border: 1px solid color-mix(in srgb, var(--brand-accent) 22%, transparent); }
        
        .device-card { background: linear-gradient(145deg, var(--brand-panel-soft), var(--brand-bg-alt)); border-radius: 14px; padding: 14px; border: 1px solid #1e293b; display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; transition: 0.18s ease; margin-bottom: 10px; box-shadow: 0 4px 6px rgba(0,0,0,0.1); }
        .device-card:hover { border-color: color-mix(in srgb, var(--brand-accent) 35%, transparent); box-shadow: 0 10px 24px color-mix(in srgb, var(--brand-accent) 14%, transparent); transform: translateY(-1px); }
        .badge { padding: 4px 10px; border-radius: 6px; font-size: 11px; font-weight: bold; display: inline-flex; align-items: center; gap: 6px; }
        
        .zt-table { width: 100%; text-align: right; border-collapse: collapse; }
        .zt-table th { padding: 12px; font-size: 13px; font-weight: 900; color: #64748b; border-bottom: 1px solid #1e293b; }
        .zt-table td { padding: 16px 12px; border-bottom: 1px solid #1e293b; font-size: 14px; }
        
        .ip-btn { border: 1px solid #1e293b; background: rgba(15,23,42,0.8); color: #94a3b8; padding: 8px 12px; border-radius: 8px; font-family: monospace; font-size: 13px; cursor: pointer; transition: 0.2s; }
        .ip-btn:hover { border-color: var(--brand-accent); color: var(--brand-text); }
        .device-toolbar { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-bottom:14px; }
        .device-search-wrap { display:flex; align-items:center; gap:10px; flex:1; min-width:260px; background:color-mix(in srgb, var(--brand-bg-alt) 70%, transparent); border:1px solid color-mix(in srgb, var(--brand-accent) 18%, transparent); border-radius:14px; padding:10px 12px; transition: 0.18s ease;}
        .device-search-wrap:focus-within { border-color: var(--brand-accent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand-accent) 16%, transparent); }
        .device-search-icon { color:var(--brand-accent-soft); font-size:16px; }
        .device-search-input { flex:1; background:transparent; border:none; outline:none; color:#e2e8f0; font-size:13px; font-weight:700; }
        .device-search-input::placeholder { color:#64748b; }
        .device-toolbar-meta { color:#64748b; font-size:11px; font-weight:700; }
        .mini-kpi-grid { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) minmax(0,1fr); gap:12px; }
        @media (max-width: 1024px) { .mini-kpi-grid { grid-template-columns:1fr; } }
        .panel-compact { max-width: 1320px; margin: 0 auto; }
        .compact-card { padding: 12px !important; }
        .compact-title { font-size: 22px; line-height: 1.25; }
        .section-title-sm { font-size: 17px; line-height: 1.2; }
        .compact-actions > * { min-height: 40px; }
        .dense-textarea { min-height: 150px !important; }
        .qr-shell { min-height: 148px; border-radius: 12px; }
        .split-compact { display: grid; grid-template-columns: 1.05fr 0.95fr; gap: 14px; }
        .field-label { font-size: 11px; color: #94a3b8; font-weight: 700; margin-bottom: 6px; display: block; }
        .quick-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
        .network-quick-card { display: grid; grid-template-columns: minmax(0, 1fr) 290px; gap: 12px; align-items: stretch; }
        .network-quick-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; align-content: start; }
        .network-quick-item { background: rgba(2,6,23,0.48); border: 1px solid rgba(59,130,246,0.10); border-radius: 12px; padding: 8px 10px; min-height: 0; }
        .network-quick-label { font-size: 10px; color: #94a3b8; font-weight: 700; margin-bottom: 4px; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
        .network-quick-value { color: #e2e8f0; font-weight: 800; font-size: 12px; line-height: 1.2; word-break: break-word; max-width: 100%; min-height: 16px; }
        .network-quick-value.mono { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace; font-size: 11px; direction: ltr; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
        .network-quick-copy { background: color-mix(in srgb, var(--brand-accent) 10%, transparent); color: var(--brand-accent-soft); border: 1px solid color-mix(in srgb, var(--brand-accent) 24%, transparent); border-radius: 8px; padding: 3px 8px; font-size: 10px; font-weight: 800; cursor: pointer; transition: 0.2s; white-space: nowrap; }
        .network-quick-copy:hover { background: var(--brand-accent); color: #101418; }
        .network-quick-qr { background: rgba(255,255,255,0.02); border: 1px dashed rgba(148,163,184,0.20); border-radius: 14px; min-height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 10px; position: relative; overflow: hidden;}
        .network-quick-qr::before {content:''; position:absolute; top: -50%; left: -50%; width: 200%; height: 200%; background: radial-gradient(circle, color-mix(in srgb, var(--brand-accent) 10%, transparent) 0%, transparent 60%); pointer-events: none;}
        .network-quick-qr-box { width: 270px; height: 270px; background: #ffffff; border: 1px solid rgba(148,163,184,0.18); border-radius: 16px; display: flex; align-items: center; justify-content: center; padding: 12px; box-shadow: 0 8px 25px rgba(0,0,0,0.3); overflow: hidden; position: relative; z-index: 10;}
        .network-quick-qr-box img { width: 100% !important; height: 100% !important; image-rendering: pixelated; display: block; }
        .network-quick-qr-box canvas { width: 100% !important; height: 100% !important; image-rendering: pixelated; display: block; }
        .network-quick-note { font-size: 11px; color: #94a3b8; line-height: 1.6; text-align: center; margin-top: 8px; z-index: 10;}
        .network-quick-actions { display: flex; gap: 8px; flex-wrap: wrap; }
        .network-quick-actions .action-btn { border-radius: 10px; padding: 7px 11px; font-size: 12px; font-weight: 800; }
        @media (max-width: 1279px) { .network-quick-card { grid-template-columns: 1fr; } .network-quick-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
        @media (max-width: 768px) { .network-quick-grid { grid-template-columns: 1fr; } .network-quick-qr-box { width: 250px; height: 250px; } }
        @media (max-width: 1279px) { .quick-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .split-compact { grid-template-columns: 1fr; } .network-quick-card { grid-template-columns: 1fr; } }
        @media (max-width: 768px) { .quick-grid { grid-template-columns: 1fr; } .panel-compact { max-width: 100%; } .network-quick-grid { grid-template-columns: 1fr; } }
        .ip-btn.active { background: var(--brand-accent); border-color: var(--brand-accent); color: #101418; font-weight: bold; box-shadow: 0 0 10px color-mix(in srgb, var(--brand-accent) 35%, transparent); }
        
        /* Z-INDEX FOR MODALS SET TO 9999 TO BE ALWAYS ON TOP */
        .toast { position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%); padding: 12px 24px; border-radius: 12px; font-weight: bold; z-index: 10000; transition: 0.18s ease; box-shadow: 0 10px 25px rgba(0,0,0,0.5); border: 1px solid rgba(255,255,255,0.1); }
        .toast.ok { background: rgba(16,185,129,0.9); color: white; }
        .toast.err { background: rgba(220,38,38,0.9); color: white; }
        .toast.warn { background: rgba(245,158,11,0.96); color: #111827; border-color: rgba(251,191,36,.55); }

        .ai-circle { width: 132px; height: 132px; border-radius: 50%; background: conic-gradient(var(--brand-accent) var(--p), #2e414d 0deg); display: flex; align-items: center; justify-content: center; position: relative; box-shadow: 0 0 22px rgba(79,70,229,0.22); }
        .ai-circle::before { content: ""; position: absolute; width: 112px; height: 112px; background: #060b19; border-radius: 50%; }
        .ai-inner { position: relative; text-align: center; }
        .terminal-text { font-family: monospace; color: var(--brand-accent-soft); text-shadow: 0 0 5px rgba(74,222,128,0.35); font-size: 12px; line-height: 1.55; }
        .ai-card-compact { padding: 14px !important; }
        .ai-grid-compact { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 12px; align-items: stretch; }
        .ai-side-compact { padding: 12px; background: rgba(2,6,23,0.54); border-radius: 14px; border: 1px solid rgba(148,163,184,0.10); display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 150px; }
        .ai-terminal-box { background: #020617; border-radius: 14px; border: 1px solid #1e293b; padding: 12px; min-height: 150px; max-height: 150px; overflow-y: auto; position: relative; }
        @media (max-width: 1024px) { .ai-grid-compact { grid-template-columns: 1fr; } .ai-side-compact, .ai-terminal-box { min-height: 160px; max-height: none; } }
        .dashboard-grid-tight { display: grid; gap: 14px; }
        .ping-card { padding: 14px !important; }
        .ping-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
        .ping-input-row { display: grid; grid-template-columns: minmax(0, 1fr) 104px; gap: 8px; align-items: center; }
        .ping-result-box { background: #0f172a; padding: 10px 12px; border-radius: 12px; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace; font-size: 12px; color: #4ade80; min-height: 82px; max-height: 110px; overflow-y: auto; border: 1px solid #1e293b; }
        .ping-input-row button:disabled { opacity: .7; cursor: not-allowed; filter: grayscale(.1); }
        .section-heading-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; flex-wrap: wrap; }
        .section-subtle { color: #64748b; font-size: 11px; font-weight: 700; }
        .qr-shell-clean { background: rgba(255,255,255,0.02); border: 1px solid rgba(148,163,184,0.14); border-radius: 14px; padding: 10px; display: inline-flex; }
        .qr-shell-clean > div { background: #fff; border-radius: 12px; padding: 8px; }
        .qr-shell-clean canvas, .qr-shell-clean img { display: block; }
        @media (max-width: 768px) { .ping-input-row { grid-template-columns: 1fr; } .ping-input-row button { order: 2; } }

    

/* V3 UI Refactor */

#appView.app-shell { display:grid; grid-template-columns: 320px minmax(0,1fr); gap:18px; align-items:start; max-width: 1680px; margin: 0 auto; }
#appView.app-shell > :not(header) { grid-column: 2; }
.app-sidebar { position: sticky; top: 16px; display:flex; flex-direction:column; align-items:stretch; gap:14px; min-height: calc(100vh - 32px); padding: 18px; background: linear-gradient(180deg, color-mix(in srgb, var(--brand-panel) 82%, transparent), color-mix(in srgb, var(--brand-bg-alt) 96%, transparent)); border-color: color-mix(in srgb, var(--brand-accent) 18%, transparent); }
.sidebar-top { display:flex; flex-direction:column; gap:12px; }
.sidebar-brand-card, .sidebar-user-card { background: rgba(2,6,23,.22); border: 1px solid rgba(148,163,184,.08); border-radius: 22px; padding: 14px; }
.sidebar-brand { display:flex; gap:14px; align-items:center; }
.sidebar-brand-copy { min-width: 0; }
.sidebar-kicker { display:inline-flex; align-items:center; padding: 4px 10px; border-radius: 999px; background: color-mix(in srgb, var(--brand-accent) 12%, transparent); border: 1px solid color-mix(in srgb, var(--brand-accent) 18%, transparent); color: var(--brand-accent-soft); font-size: 10px; font-weight: 900; letter-spacing: .18em; text-transform: uppercase; }
.sidebar-tagline { color:#cbd5e1; font-size:12px; font-weight:800; margin:6px 0 0; }
.sidebar-blurb { color:#b7c4d6; font-size:12px; line-height:2; margin:12px 0 0; }
.sidebar-user-head { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:12px; }
.sidebar-user-label { color:#64748b; font-size:11px; font-weight:900; margin-bottom:2px; }
.sidebar-user-name { color:#f8fafc; font-size:16px; font-weight:900; }
.sidebar-mini-grid, .sidebar-status-strip { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:10px; }
.sidebar-mini-tile, .sidebar-status-card { background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(15,23,42,.16)); border: 1px solid rgba(96,165,250,.1); border-radius: 16px; padding: 12px; }
.sidebar-mini-tile span, .sidebar-status-card span { display:block; color:#64748b; font-size:10px; font-weight:900; margin-bottom:5px; letter-spacing:.08em; text-transform:uppercase; }
.sidebar-mini-tile strong, .sidebar-status-card strong { display:block; color:#e2e8f0; font-size:12px; font-weight:900; }
.sidebar-user-action { width:100%; margin-top:12px; min-height:44px; border-radius:16px; border:1px solid rgba(96,165,250,.18); background: linear-gradient(180deg, rgba(37,99,235,.14), rgba(15,23,42,.18)); color:#dbeafe; font-size:13px; font-weight:900; transition:.25s ease; }
.sidebar-user-action:hover { background: linear-gradient(180deg, rgba(37,99,235,.22), rgba(15,23,42,.26)); transform: translateY(-1px); }
.sidebar-nav-wrap { display:flex; flex-direction:column; gap:10px; }
.sidebar-section-title { color:#a9b8cb; font-size:11px; font-weight:900; letter-spacing:.12em; padding-inline: 4px; }
.sidebar-nav { display:flex; flex-direction:column; gap:8px; }
.sidebar-nav .nav-btn { width:100%; display:grid; grid-template-columns: 42px 1fr; gap:12px; align-items:center; text-align:right; padding: 14px 15px; color:#d7e1ee; border:1px solid rgba(148,163,184,.06); background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(2,6,23,.18)); }
.sidebar-nav .nav-btn:hover { background: rgba(255,255,255,.055); border-color: rgba(148,163,184,.16); transform: translateY(-1px); }
.sidebar-nav .nav-btn.active { background: linear-gradient(135deg, rgba(37,99,235,.22), rgba(99,102,241,.20)); border-color: rgba(96,165,250,.34); box-shadow: 0 14px 30px rgba(37,99,235,.14); }
.nav-btn-icon { width:42px; height:42px; display:grid; place-items:center; border-radius: 14px; background: rgba(15,23,42,.78); border: 1px solid rgba(96,165,250,.16); font-size: 18px; box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
.nav-btn-copy { display:flex; flex-direction:column; min-width:0; }
.nav-btn-copy strong { color:#f8fafc; font-size:14px; font-weight:900; }
.nav-btn-copy small { color:#9eb0c6; font-size:11px; font-weight:700; margin-top:3px; }
.sidebar-logout { margin-top:auto; min-height: 52px; border-radius: 18px; border: 1px solid rgba(239,68,68,.24); background: linear-gradient(180deg, rgba(127,29,29,.18), rgba(239,68,68,.08)); color: #fda4af; font-size: 15px; font-weight: 900; transition: .25s ease; }
.sidebar-logout:hover { background: rgba(239,68,68,.16); color:#fecaca; transform: translateY(-1px); }
.sidebar-footnote { display:none; }
.dashboard-grid-tight { display:grid; gap:12px; }
.section-shell { background: rgba(2,6,23,.26); border:1px solid rgba(148,163,184,.08); border-radius: 16px; padding: 14px; }
.network-quick-card.compact > div:first-child > :not(:first-child) { display:none; }
.network-quick-card.compact > div:last-child { display:none; }
.network-quick-card.compact { grid-template-columns: 1fr; }
.network-quick-card.compact > div:first-child .flex.items-center.justify-between { margin-bottom: 0; }
.network-quick-card.compact > div:first-child p { margin-top: 6px; }
.table-shell { overflow-x:auto; border:1px solid rgba(30,41,59,1); border-radius: 14px; }
@media (max-width: 900px) {
    #appView.app-shell { grid-template-columns: 1fr; }
    .app-sidebar { position: static; min-height: auto; }
    #appView.app-shell > :not(header) { grid-column: 1; }
    .sidebar-nav { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:8px; }
    .sidebar-logout { margin-top: 2px; }
}
@media (max-width: 768px) {
    .zt-table.responsive-mobile thead { display:none; }
    .zt-table.responsive-mobile, .zt-table.responsive-mobile tbody, .zt-table.responsive-mobile tr, .zt-table.responsive-mobile td { display:block; width:100%; }
    .zt-table.responsive-mobile tr { background: linear-gradient(145deg, #0f172a, #0b1120); border:1px solid #1e293b; border-radius:14px; padding:10px; margin:0 0 10px; }
    .zt-table.responsive-mobile td { border:none; padding:8px 8px 8px 42%; position:relative; min-height: 34px; }
    .zt-table.responsive-mobile td::before { content: attr(data-label); position:absolute; right:10px; top:8px; width:36%; color:#94a3b8; font-size:11px; font-weight:800; }
    .zt-table.responsive-mobile td.actions-cell { padding-right:10px; padding-left:10px; }
    .zt-table.responsive-mobile td.actions-cell::before { position:static; display:block; width:auto; margin-bottom:8px; }
}


.app-shell { position: relative; }
.analytics-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:14px; flex-wrap:wrap; }
.analytics-chip { display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border-radius:999px; border:1px solid color-mix(in srgb, var(--brand-accent) 18%, transparent); background:color-mix(in srgb, var(--brand-panel) 72%, transparent); color:var(--brand-accent-soft); font-size:11px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }
.chart-shell { position:relative; background:color-mix(in srgb, var(--brand-bg-alt) 42%, transparent); border:1px solid color-mix(in srgb, var(--brand-accent) 12%, transparent); border-radius:16px; padding:14px; }
.chart-shell canvas { width:100% !important; height:100% !important; }
.chart-shell-donut { display:flex; align-items:center; justify-content:center; }
.ai-workspace { min-height: 420px; }
.ai-terminal-shell { background:linear-gradient(180deg, rgba(2,6,23,.92), rgba(2,6,23,.75)); border:1px solid rgba(51,65,85,.85); border-radius:18px; overflow:hidden; box-shadow: none; }
.ai-terminal-toolbar { display:flex; align-items:center; gap:8px; padding:12px 14px; border-bottom:1px solid rgba(30,41,59,.9); background:rgba(15,23,42,.92); }
.ai-dot { width:10px; height:10px; border-radius:999px; display:inline-block; }
.ai-dot.red { background:#ef4444; }
.ai-dot.amber { background:#f59e0b; }
.ai-dot.green { background:#22c55e; }
.ai-live-feed { min-height:360px; max-height:360px; overflow:auto; padding:16px; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, monospace; font-size:12px; line-height:1.65; color:#cbd5e1; }
.ai-feed-line { padding:8px 10px; border:1px solid rgba(30,41,59,.8); border-radius:10px; background:rgba(15,23,42,.55); margin-bottom:8px; }
.ai-feed-line .tag { color:#f0abfc; font-weight:800; margin-inline-end:8px; }
.ai-feed-line.live .tag { color:#67e8f9; }
.ai-feed-line.alert .tag { color:#fca5a5; }
#advancedSettingsGrid.is-collapsed > :not(:first-child) { display:none; }
@media (max-width: 1024px) {
  .dashboard-analytics-grid { gap: 16px; }
}


.login-shell { position: relative; overflow: hidden; isolation: isolate; }
.login-backdrop-grid { position: absolute; inset: 0; background-image: linear-gradient(color-mix(in srgb, var(--brand-accent) 9%, transparent) 1px, transparent 1px), linear-gradient(90deg, color-mix(in srgb, var(--brand-accent) 9%, transparent) 1px, transparent 1px); background-size: 42px 42px; mask-image: radial-gradient(circle at center, black, transparent 80%); pointer-events: none; }
.login-noise { position: absolute; inset: 0; background: radial-gradient(circle at top, rgba(255,255,255,.06), transparent 35%), radial-gradient(circle at bottom left, color-mix(in srgb, var(--brand-accent) 16%, transparent), transparent 32%); opacity: .55; pointer-events: none; }
.login-orb { position: absolute; border-radius: 999px; filter: blur(38px); opacity: .14; pointer-events: none; }
.login-orb-a { width: 260px; height: 260px; background: var(--brand-accent); top: 8%; right: 8%; }
.login-orb-b { width: 300px; height: 300px; background: color-mix(in srgb, var(--brand-panel) 70%, var(--brand-accent-soft)); bottom: 5%; left: 8%; }
.login-frame { position: relative; z-index: 1; align-items: stretch; }
.login-brand-panel, .login-card-pro { min-height: 620px; border-radius: 24px; overflow: hidden; }
.login-brand-panel { background: linear-gradient(155deg, color-mix(in srgb, var(--brand-panel) 96%, transparent), color-mix(in srgb, var(--brand-bg) 92%, transparent)); border-color: color-mix(in srgb, var(--brand-accent) 24%, transparent); box-shadow: 0 14px 30px rgba(2,6,23,.24); position: relative; }
.login-brand-panel::after { content: ''; position: absolute; inset: auto -12% -18% auto; width: 280px; height: 280px; border-radius: 999px; background: radial-gradient(circle, color-mix(in srgb, var(--brand-accent) 18%, transparent), transparent 72%); pointer-events: none; }
.login-card-pro { background: linear-gradient(160deg, rgba(10,16,32,.92), color-mix(in srgb, var(--brand-panel-soft) 88%, transparent), color-mix(in srgb, var(--brand-bg-alt) 94%, transparent)); border-color: color-mix(in srgb, var(--brand-accent) 22%, transparent); box-shadow: 0 14px 30px rgba(2,6,23,.22); position: relative; }
.login-card-pro::before { content:''; position:absolute; inset:0; background: linear-gradient(180deg, rgba(255,255,255,.04), transparent 28%); pointer-events:none; }
.login-brand-top { display:grid; grid-template-columns: minmax(160px, 240px) minmax(0,1fr); gap: 24px; align-items: center; }
.login-brand-copy { position: relative; z-index: 1; }
.login-brand-logo-wrap { display:flex; justify-content:flex-start; }
.login-brand-logo { max-width: 240px; width: 100%; height: auto; border-radius: 28px; box-shadow: 0 12px 26px rgba(0,0,0,.22); border: 1px solid rgba(148,163,184,.14); }
.login-badge { display: inline-flex; align-items: center; gap: 8px; color: var(--brand-accent-soft); background: color-mix(in srgb, var(--brand-accent) 14%, transparent); border: 1px solid color-mix(in srgb, var(--brand-accent) 28%, transparent); border-radius: 999px; padding: 8px 14px; font-size: 12px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.login-overline { color: var(--brand-accent-soft); font-size: 11px; font-weight: 900; letter-spacing: .18em; text-transform: uppercase; margin-bottom: 14px; }
.login-hero-title { color:#f8fafc; font-size: 33px; line-height: 1.35; font-weight: 900; margin: 0 0 12px; }
.login-hero-text { color: #94a3b8; font-size: 14px; line-height: 2; margin: 0; max-width: 58ch; }
.login-hero-stats { display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; }
.login-stat-card { background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(15,23,42,.22)); border: 1px solid rgba(96,165,250,.12); border-radius: 18px; padding: 16px 14px; min-height: 96px; }
.login-stat-card strong { display:block; color:#fff; font-size: 26px; font-weight: 900; margin-bottom: 6px; letter-spacing: -.02em; }
.login-stat-card span { display:block; color:#94a3b8; font-size: 12px; line-height: 1.75; font-weight: 700; }
.login-feature-grid { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.brand-feature { display: grid; grid-template-columns: 36px 1fr; gap: 12px; align-items: start; background: color-mix(in srgb, var(--brand-bg-alt) 46%, transparent); border: 1px solid color-mix(in srgb, var(--brand-accent) 10%, transparent); border-radius: 18px; padding: 16px; }
.brand-feature span { font-size: 22px; line-height: 1.3; }
.brand-feature strong { display: block; color: #f8fafc; font-size: 14px; font-weight: 900; margin-bottom: 3px; }
.brand-feature p { color: var(--brand-muted); font-size: 12px; line-height: 1.8; margin: 0; }
.brand-legal-box { color: var(--brand-text); background: color-mix(in srgb, var(--brand-bg-alt) 60%, transparent); border: 1px dashed color-mix(in srgb, var(--brand-accent) 24%, transparent); border-radius: 18px; padding: 16px; font-size: 12px; line-height: 1.8; }
.login-legal-label { color:#94a3b8; font-size:11px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; margin-bottom:6px; }
.login-form-header { position: relative; z-index: 1; }
.login-icon-wrap { width: 84px; height: 84px; margin-inline: auto; display: grid; place-items: center; border-radius: 26px; background: linear-gradient(145deg, color-mix(in srgb, var(--brand-accent) 20%, transparent), color-mix(in srgb, var(--brand-accent-soft) 12%, var(--brand-panel))); border: 1px solid color-mix(in srgb, var(--brand-accent) 22%, transparent); font-size: 34px; box-shadow: 0 8px 18px rgba(0,0,0,.12); overflow: hidden; }
.login-side-logo { width: 82px; height: 82px; object-fit: contain; border-radius: 22px; box-shadow: 0 8px 16px rgba(0,0,0,.16); background: rgba(15,27,36,.72); padding: 7px; }
.login-form-shell { position: relative; z-index: 1; background: rgba(2,6,23,.26); border: 1px solid rgba(96,165,250,.12); border-radius: 24px; padding: 20px; box-shadow: none; }
.login-field { text-align: right; }
.login-label { display:block; margin-bottom: 8px; color:#cbd5e1; font-size: 12px; font-weight: 900; }
.input-glass.login-input { min-height: 52px; border-radius: 14px !important; padding: 12px 14px !important; font-size: 14px; font-weight: 700; }
.input-glass.login-input::placeholder { color:#64748b; }
.login-submit { display:flex; align-items:center; justify-content:center; gap:10px; min-height:56px; border-radius: 16px; font-size: 18px; font-weight: 900; }
.login-submit small { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; opacity: .78; }
.login-trust-row { display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; position: relative; z-index: 1; }
.login-trust-item { display:grid; grid-template-columns: 28px 1fr; gap:10px; align-items:start; background: rgba(2,6,23,.2); border: 1px solid rgba(148,163,184,.08); border-radius: 16px; padding: 12px; }
.login-trust-item span { font-size: 18px; line-height: 1.3; }
.login-trust-item strong { display:block; color:#e2e8f0; font-size: 12px; font-weight: 900; margin-bottom: 3px; }
.login-trust-item p { margin:0; color:#94a3b8; font-size: 11px; line-height: 1.7; }
.login-hint { color: var(--brand-muted); font-size: 12px; line-height: 1.9; position: relative; z-index: 1; }
.header-shell { background: linear-gradient(145deg, color-mix(in srgb, var(--brand-panel) 78%, transparent), color-mix(in srgb, var(--brand-bg-alt) 94%, transparent)); }
.brand-mark { width: 54px; height: 54px; border-radius: 18px; display: grid; place-items: center; font-weight: 900; font-size: 18px; color: white; background: linear-gradient(135deg, #2563eb, #4f46e5); box-shadow: 0 14px 35px rgba(37,99,235,.24); overflow: hidden; background: rgba(15,23,42,.88); border: 1px solid rgba(96,165,250,.18); }
.brand-mark-img { width: 100%; height: 100%; object-fit: contain; border-radius: 18px; background: rgba(15,27,36,.55); padding: 4px; }
.brand-chip { display: inline-flex; align-items: center; padding: 5px 10px; border-radius: 999px; background: color-mix(in srgb, var(--brand-accent) 12%, transparent); border: 1px solid color-mix(in srgb, var(--brand-accent) 18%, transparent); color: var(--brand-accent-soft); font-size: 11px; font-weight: 800; }
.role-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 86px; padding: 3px 10px; border-radius: 999px; font-size: 11px; font-weight: 900; border: 1px solid rgba(148,163,184,.2); background: rgba(15,23,42,.6); color: #cbd5e1; }
.role-badge[data-role="superadmin"] { color: var(--brand-accent-soft); border-color: color-mix(in srgb, var(--brand-accent) 26%, transparent); background: color-mix(in srgb, var(--brand-accent) 12%, transparent); }
.role-badge[data-role="moderator"] { color: #93c5fd; border-color: rgba(59,130,246,.22); background: rgba(59,130,246,.08); }
.role-badge[data-role="branch_admin"] { color: #86efac; border-color: rgba(34,197,94,.24); background: rgba(34,197,94,.08); }
.role-badge[data-role="support"] { color: #f0abfc; border-color: rgba(217,70,239,.24); background: rgba(217,70,239,.08); }
.role-badge[data-role="viewer"] { color: #cbd5e1; border-color: rgba(148,163,184,.2); background: rgba(148,163,184,.08); }
.app-footer { color: #64748B; font-size: 11px; }
.app-footer-inner { text-align: center; border-top: 1px solid rgba(30,41,59,.7); padding: 10px 6px 2px; }
.copyright-link { color: #64748B; text-decoration: none; font-weight: 800; transition: color .18s ease, opacity .18s ease; cursor: pointer; }
.copyright-link:hover { color: #94a3b8; opacity: .98; text-decoration: underline; }
.footer-link { display: inline-flex; align-items: center; gap: 8px; }
@media (max-width: 1024px) {
  .login-frame { grid-template-columns: 1fr; }
  .login-brand-panel, .login-card-pro { min-height: auto; }
  .login-brand-top { grid-template-columns: 1fr; }
  .login-hero-stats, .login-feature-grid, .login-trust-row { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .login-brand-logo-wrap { justify-content: center; }
  .login-brand-logo { max-width: 210px; }
  .login-hero-title { font-size: 28px; }
  .login-form-shell { padding: 16px; }
}

.theme-kicker { color: var(--brand-accent-soft) !important; }
.theme-accent, .theme-chip { color: var(--brand-accent-soft) !important; }
.text-blue-300, .text-blue-400, .text-cyan-300, .text-indigo-300, .text-indigo-400, .text-amber-300 { color: var(--brand-accent-soft) !important; }
.bg-blue-600 { background-color: var(--brand-accent) !important; color: #111827 !important; }
.hover\:bg-blue-500:hover { background-color: var(--brand-accent-soft) !important; color: #111827 !important; }
.bg-blue-500\/10, .bg-indigo-500\/10 { background-color: color-mix(in srgb, var(--brand-accent) 12%, transparent) !important; }
.border-blue-500\/20, .border-indigo-500\/20, .border-blue-800\/30 { border-color: color-mix(in srgb, var(--brand-accent) 22%, transparent) !important; }
.text-blue-300, .text-blue-400, .text-indigo-300, .text-indigo-400 { color: var(--brand-accent-soft) !important; }
.shadow-blue-500\/20 { box-shadow: 0 8px 22px color-mix(in srgb, var(--brand-accent) 22%, transparent) !important; }
.badge.brand-accent { background: color-mix(in srgb, var(--brand-accent) 12%, transparent); color: var(--brand-accent-soft); border: 1px solid color-mix(in srgb, var(--brand-accent) 22%, transparent); }


/* Patch 4: Arabic commercial finish */
:root { color-scheme: dark; }
body { background-attachment: fixed; letter-spacing: 0; }
#appView.app-shell { max-width: 1780px; gap: 22px; }
#appView.app-shell > :not(header) { display: block; }
.card { border-radius: 22px; box-shadow: 0 18px 46px rgba(2,6,23,.28); }
.card:hover { box-shadow: 0 22px 54px rgba(2,6,23,.34); }
.app-sidebar { border-radius: 30px; padding: 20px; box-shadow: 0 28px 70px rgba(2,6,23,.35); }
.sidebar-brand-card, .sidebar-user-card { border-radius: 24px; background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(2,6,23,.16)); }
.sidebar-nav .nav-btn { border-radius: 18px; min-height: 72px; }
.sidebar-nav .nav-btn.active { box-shadow: 0 14px 34px rgba(37,99,235,.16); }
.nav-btn-icon { border-radius: 16px; }
.sidebar-status-card, .sidebar-mini-tile { border-radius: 18px; }
.sidebar-logout { border-radius: 18px; min-height: 52px; }
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 .card { position: relative; overflow: hidden; padding: 18px !important; border-radius: 22px; background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(15,23,42,.4)); }
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 .card::after { content: ''; position: absolute; inset: auto -10% -35% auto; width: 150px; height: 150px; border-radius: 999px; background: radial-gradient(circle, color-mix(in srgb, var(--brand-accent) 18%, transparent), transparent 68%); opacity: .8; pointer-events: none; }
.compact-card, .ping-card, .section-shell { border-radius: 22px; padding: 14px !important; background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(15,23,42,.28)); }
.analytics-head { margin-bottom: 18px; }
.analytics-chip { border-radius: 999px; padding: 7px 12px; }
.chart-shell { border-radius: 20px; padding: 18px; background: linear-gradient(180deg, rgba(2,6,23,.42), rgba(15,23,42,.22)); }
.ai-terminal-shell, .table-shell { border-radius: 22px; box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
.ai-feed-line { border-radius: 14px; }
.network-list-card { position: relative; overflow: hidden; border-radius: 24px; background: linear-gradient(135deg, rgba(255,255,255,.045), rgba(15,23,42,.32)); }
.network-list-card::before { content:''; position:absolute; inset:0 auto 0 0; width:4px; background: linear-gradient(180deg, var(--brand-accent-soft), transparent); opacity:.9; }
.network-list-card > div { position: relative; }
.network-list-card button { min-width: 102px; border-radius: 14px !important; }
#networksCardsArea { gap: 16px !important; }
.branch-metric-card, .audit-row-card, .alert-row-card { border-radius: 18px; background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(15,23,42,.22)); }
.device-card { border-radius: 24px; padding: 18px; background: linear-gradient(135deg, rgba(255,255,255,.035), rgba(15,23,42,.38)); border-color: rgba(71,85,105,.55); box-shadow: 0 16px 36px rgba(2,6,23,.24); }
.device-card > div { position: relative; }
.device-card .badge { border-radius: 999px; padding: 6px 12px; font-size: 11px; }
.device-card .grid.grid-cols-4 { gap: 8px; }
.device-card button { border-radius: 12px !important; min-height: 34px; }
.network-quick-card { gap: 12px; }
.network-quick-item, .network-quick-qr { border-radius: 18px; background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(2,6,23,.18)); }
.network-quick-qr-box { border-radius: 22px; box-shadow: 0 16px 36px rgba(0,0,0,.34); }
.network-quick-actions .action-btn { border-radius: 12px; min-height: 38px; }
.zt-table { width: 100%; }
.zt-table thead th { background: rgba(255,255,255,.03); color: #94a3b8; font-size: 12px; letter-spacing: 0; }
.zt-table tbody tr { transition: background .2s ease, transform .2s ease; }
.zt-table tbody tr:hover { background: rgba(255,255,255,.02); }
.zt-table td, .zt-table th { white-space: normal; }
#modalBackdrop .card, #modalRemote .card, #modalDiag .card, #modalRouteDiag .card, #modalTokenManager .card { border-radius: 28px; box-shadow: 0 30px 90px rgba(2,6,23,.5); }
#modalBackdrop .card input, #modalBackdrop .card textarea, #modalRemote .card input, #modalRemote .card textarea, #modalDiag .card input, #modalRouteDiag .card input, #modalTokenManager .card input { border-radius: 16px !important; }
.toast { border-radius: 16px; min-width: 220px; text-align: center; }
@media (max-width: 900px) {
  .sidebar-nav { grid-template-columns: 1fr 1fr; }
  .sidebar-nav .nav-btn { min-height: 64px; }
  .sidebar-status-strip, .sidebar-mini-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
  .card, .compact-card, .device-card, .network-list-card, .app-sidebar { border-radius: 20px; }
  .device-card { padding: 14px; }
  .sidebar-nav { grid-template-columns: 1fr; }
}


.login-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;background:rgba(255,255,255,.04);padding:8px;border-radius:18px;border:1px solid rgba(148,163,184,.12)}
.login-tab{border:0;border-radius:14px;padding:12px 10px;background:transparent;color:#94a3b8;font-weight:900;cursor:pointer;transition:.2s}
.login-tab.active{background:linear-gradient(135deg,var(--brand-accent),color-mix(in srgb, var(--brand-accent) 55%, white));color:white;box-shadow:0 10px 28px rgba(2,6,23,.22)}
.login-pane.active{display:block}.login-pane.hidden{display:none}
.password-wrap{position:relative}.password-wrap .login-input{padding-left:84px}.password-toggle{position:absolute;left:10px;top:50%;transform:translateY(-50%);border:1px solid rgba(148,163,184,.16);background:rgba(255,255,255,.05);color:#e2e8f0;border-radius:12px;padding:8px 12px;font-weight:800;font-size:12px;cursor:pointer}
.login-inline-links{display:none}.login-link-btn{background:none;border:0;color:var(--brand-accent-soft);font-weight:800;cursor:pointer;padding:0}
.login-note-card{background:rgba(255,255,255,.04);border:1px solid rgba(148,163,184,.12);color:#cbd5e1;border-radius:16px;padding:14px 16px;line-height:1.9;font-weight:700;font-size:13px}
.login-secondary{background:rgba(255,255,255,.05);border:1px solid rgba(148,163,184,.14);color:#e2e8f0;border-radius:16px;font-weight:900}.login-secondary:hover{background:rgba(255,255,255,.1)}
@media (max-width: 960px){.login-tabs{grid-template-columns:1fr}.login-inline-links{flex-direction:column;align-items:flex-start}.password-wrap .login-input{padding-left:78px}}


.dashboard-toolbar,.networks-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;}
.panel-title{font-size:26px;font-weight:900;color:#fff;line-height:1.2;margin:0;}
.panel-meta{color:#7f8ea3;font-size:12px;font-weight:700;margin-top:4px;}
.dashboard-toolbar-actions,.networks-toolbar-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;}
.toolbar-btn{padding:10px 14px;border-radius:14px;background:rgba(255,255,255,.03);color:#dbe7f4;border:1px solid rgba(148,163,184,.12);}
.toolbar-btn:hover{background:rgba(255,255,255,.06);}
.networks-search-wrap{min-width:260px;max-width:380px;}
.network-list-card{border-radius:20px;position:relative;overflow:hidden;}
.network-list-card::before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:linear-gradient(180deg,var(--brand-accent),transparent);opacity:.9;}
.quick-card-head{position:sticky;top:0;z-index:5;background:linear-gradient(180deg, rgba(11,17,32,.94), rgba(11,17,32,.74));backdrop-filter:blur(6px);padding-bottom:8px;}
.network-quick-actions{row-gap:6px;}
#view-superadmin #saContent .card{border-radius:24px;}
#view-superadmin .input-glass{min-height:48px;}
@media (max-width: 768px){.panel-title{font-size:22px}.networks-search-wrap{min-width:100%;max-width:100%}.dashboard-toolbar-actions,.networks-toolbar-actions{width:100%}.dashboard-toolbar-actions .action-btn,.networks-toolbar-actions .btn-primary{flex:1}}


.network-quick-card{gap:14px;align-items:start;}
.network-quick-actions{display:flex;flex-wrap:wrap;gap:8px;}
.network-quick-actions .action-btn{min-height:40px;padding-inline:12px;border-radius:12px;font-size:13px;}
.network-quick-item{background:rgba(255,255,255,.025);border:1px solid rgba(148,163,184,.08);border-radius:16px;padding:12px;}
.network-quick-value{margin-top:6px;min-height:22px;}
.sa-section-shell{position:relative;overflow:hidden;}
.sa-section-shell::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--brand-accent),transparent);opacity:.7;}
.sa-section-head{display:flex;flex-direction:column;gap:4px;}
.sa-section-kicker{display:inline-flex;align-items:center;width:max-content;padding:4px 10px;border-radius:999px;background:color-mix(in srgb,var(--brand-accent) 12%,transparent);border:1px solid color-mix(in srgb,var(--brand-accent) 18%,transparent);color:var(--brand-accent-soft);font-size:10px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;}
#saContent .input-glass::placeholder{color:#64748b;opacity:1;}
#view-net-details .tab-btn{padding-inline:16px;}
#view-net-details .compact-card h3{letter-spacing:0;}

.net-header-shell { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; padding:14px 16px; border:1px solid color-mix(in srgb, var(--brand-accent) 12%, transparent); border-radius:16px; background:linear-gradient(145deg, rgba(15,23,42,.78), rgba(11,17,32,.54)); }
.net-header-main { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.net-back-btn { color:#93c5fd; font-weight:800; background:rgba(15,23,42,.66); border:1px solid rgba(59,130,246,.16); padding:10px 14px; border-radius:12px; transition:.2s; font-size:13px; }
.net-back-btn:hover { background:rgba(37,99,235,.16); color:#e0f2fe; }
.net-header-kicker { color:var(--brand-accent-soft); font-size:10px; font-weight:900; letter-spacing:.18em; text-transform:uppercase; margin-bottom:3px; }
.net-header-actions { display:flex; gap:8px; flex-wrap:wrap; }
.net-tabs-bar { display:flex; gap:10px; margin-bottom:18px; overflow-x:auto; padding-bottom:6px; }
.network-summary-shell { padding:16px !important; }
.network-summary-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:14px; flex-wrap:wrap; }
.network-summary-actions { display:flex; gap:8px; flex-wrap:wrap; }
.section-chip { display:inline-flex; align-items:center; gap:6px; padding:5px 10px; border-radius:999px; border:1px solid color-mix(in srgb, var(--brand-accent) 16%, transparent); background:color-mix(in srgb, var(--brand-panel) 72%, transparent); color:var(--brand-accent-soft); font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.network-quick-grid-wide { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.network-quick-item-accent { background:linear-gradient(180deg, rgba(37,99,235,.08), rgba(2,6,23,.42)); border-color:rgba(96,165,250,.16); }
.network-quick-item-span { grid-column: span 2; }
.settings-grid-balanced > .settings-stack-card { min-height:100%; }
.settings-stack-card { border-radius:16px; box-shadow:0 12px 26px rgba(2,6,23,.18); }
.settings-stack-card-danger { background:linear-gradient(180deg, rgba(127,29,29,.16), rgba(15,23,42,.88)); }
@media (max-width: 1279px) {
  .network-quick-grid-wide { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .network-quick-item-span { grid-column: span 2; }
}
@media (max-width: 768px) {
  .net-header-shell { padding:12px; }
  .net-header-main { align-items:flex-start; }
  .net-tabs-bar { gap:8px; }
  .network-summary-shell { padding:12px !important; }
  .network-quick-grid-wide { grid-template-columns: 1fr; }
  .network-quick-item-span { grid-column: span 1; }
}

/* Patch 5: premium visual refinement without removing features */
html { scroll-behavior: smooth; }
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 12% 8%, color-mix(in srgb, var(--brand-accent) 10%, transparent), transparent 28%),
    radial-gradient(circle at 88% 14%, rgba(59,130,246,.10), transparent 24%),
    radial-gradient(circle at 50% 100%, rgba(255,255,255,.03), transparent 28%);
  opacity: .9;
}
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, color-mix(in srgb, var(--brand-accent) 46%, transparent), rgba(148,163,184,.24));
  border-radius: 999px;
  border: 2px solid transparent;
  background-clip: padding-box;
}
::-webkit-scrollbar-track { background: rgba(15,23,42,.35); }

.card,
.compact-card,
.section-shell,
.device-card,
.network-list-card,
.settings-stack-card,
.sidebar-brand-card,
.sidebar-user-card,
.brand-legal-box,
.login-form-shell,
.login-brand-panel,
.login-card-pro,
.table-shell,
.ai-terminal-shell {
  backdrop-filter: blur(8px);
}

.card,
.compact-card,
.section-shell,
.device-card,
.network-list-card,
.settings-stack-card,
.app-sidebar,
.login-brand-panel,
.login-card-pro,
.table-shell,
.ai-terminal-shell {
  border: 1px solid rgba(255,255,255,.06);
  box-shadow:
    0 20px 48px rgba(2,6,23,.26),
    inset 0 1px 0 rgba(255,255,255,.04);
}

.card:hover,
.network-list-card:hover,
.device-card:hover,
.settings-stack-card:hover,
.section-shell:hover {
  transform: translateY(-1px);
  box-shadow:
    0 26px 58px rgba(2,6,23,.32),
    inset 0 1px 0 rgba(255,255,255,.05);
}

.input-glass,
.toolbar-btn,
.action-btn,
.tab-btn,
.btn-primary,
.login-secondary,
.sidebar-user-action,
.sidebar-logout,
.net-back-btn,
.network-quick-copy {
  transition: transform .18s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease, color .22s ease;
}

.input-glass {
  min-height: 46px;
  border-radius: 14px !important;
  background: linear-gradient(180deg, rgba(15,23,42,.76), rgba(11,17,32,.86)) !important;
  border-color: rgba(255,255,255,.08) !important;
  box-shadow: none;
}
.input-glass:hover { border-color: color-mix(in srgb, var(--brand-accent) 20%, rgba(255,255,255,.10)) !important; }
.input-glass:focus {
  transform: translateY(-1px);
  box-shadow:
    0 0 0 4px color-mix(in srgb, var(--brand-accent) 16%, transparent),
    0 10px 24px rgba(2,6,23,.18);
}

.btn-primary,
.login-secondary,
.action-btn,
.toolbar-btn,
.sidebar-user-action,
.sidebar-logout,
.net-back-btn,
.tab-btn {
  min-height: 42px;
  border-radius: 14px;
}
.btn-primary {
  box-shadow: 0 10px 28px color-mix(in srgb, var(--brand-accent) 18%, transparent);
}
.btn-primary:hover,
.action-btn:hover,
.toolbar-btn:hover,
.login-secondary:hover,
.sidebar-user-action:hover,
.sidebar-logout:hover,
.net-back-btn:hover,
.network-quick-copy:hover,
.tab-btn:hover {
  transform: translateY(-1px);
}
.action-btn,
.toolbar-btn,
.login-secondary,
.sidebar-user-action,
.net-back-btn,
.tab-btn {
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(2,6,23,.18));
  border: 1px solid rgba(255,255,255,.08);
}
.action-btn:hover,
.toolbar-btn:hover,
.login-secondary:hover,
.sidebar-user-action:hover,
.net-back-btn:hover,
.tab-btn:hover {
  border-color: color-mix(in srgb, var(--brand-accent) 24%, rgba(255,255,255,.10));
  box-shadow: 0 10px 26px rgba(2,6,23,.18);
}
.tab-btn.active,
.login-tab.active,
.sidebar-nav .nav-btn.active {
  box-shadow:
    0 12px 28px color-mix(in srgb, var(--brand-accent) 16%, transparent),
    inset 0 1px 0 rgba(255,255,255,.08);
}

.app-sidebar {
  background:
    linear-gradient(180deg, rgba(15,23,42,.88), rgba(11,17,32,.96)),
    radial-gradient(circle at top, color-mix(in srgb, var(--brand-accent) 10%, transparent), transparent 42%);
}
.sidebar-brand-card,
.sidebar-user-card {
  position: relative;
  overflow: hidden;
}
.sidebar-brand-card::after,
.sidebar-user-card::after,
.section-shell::after,
.settings-stack-card::after,
.network-list-card::after,
.network-summary-shell::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(135deg, rgba(255,255,255,.05), transparent 26%, transparent 70%, rgba(255,255,255,.02));
  opacity: .6;
}
.sidebar-user-name,
.panel-title,
.net-header-main h2,
.network-summary-head h3,
#view-superadmin h3 {
  letter-spacing: -.02em;
}
.sidebar-status-card,
.sidebar-mini-tile {
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(2,6,23,.2));
  border: 1px solid rgba(255,255,255,.06);
}

.dashboard-toolbar,
.networks-toolbar,
.net-header-shell {
  position: relative;
  overflow: hidden;
  background: linear-gradient(145deg, rgba(15,23,42,.82), rgba(11,17,32,.62));
  border: 1px solid rgba(255,255,255,.07);
  box-shadow: 0 16px 40px rgba(2,6,23,.22);
}
.dashboard-toolbar::before,
.networks-toolbar::before,
.net-header-shell::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: linear-gradient(180deg, var(--brand-accent-soft), transparent);
}

#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 .card {
  border-radius: 24px;
  border-color: rgba(255,255,255,.07);
}
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 .card h3 {
  letter-spacing: .08em;
}
.mini-kpi-grid > .card,
.dashboard-analytics-grid > .card,
#view-ai .card,
#view-backup .card,
#view-superadmin .card,
#view-networks .card,
#view-net-details .card {
  background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(15,23,42,.30));
}
.chart-shell,
.ai-terminal-box,
.ai-terminal-shell,
.table-shell {
  background: linear-gradient(180deg, rgba(2,6,23,.52), rgba(15,23,42,.24));
}
.zt-table thead th {
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(15,23,42,.22));
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.zt-table tbody tr + tr td { border-top: 1px solid rgba(255,255,255,.04); }

.network-list-card,
.device-card,
.network-summary-shell,
.settings-stack-card,
.section-shell,
.network-quick-item,
.network-quick-qr,
.branch-metric-card,
.audit-row-card,
.alert-row-card {
  position: relative;
  overflow: hidden;
}
.network-list-card:hover,
.device-card:hover,
.network-quick-item:hover,
.settings-stack-card:hover {
  border-color: color-mix(in srgb, var(--brand-accent) 18%, rgba(255,255,255,.08));
}
.network-quick-item-accent {
  background: linear-gradient(180deg, color-mix(in srgb, var(--brand-accent) 11%, transparent), rgba(2,6,23,.44));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
.network-quick-qr {
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(2,6,23,.26));
}
.network-quick-qr-box {
  background: linear-gradient(180deg, #fff, #f8fafc);
}
.section-chip,
.brand-chip,
.badge,
.role-badge {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}

#view-superadmin .card,
.sa-section-shell {
  border-color: rgba(255,255,255,.07);
}
.settings-stack-card-danger {
  border: 1px solid rgba(248,113,113,.16);
  box-shadow: 0 18px 34px rgba(127,29,29,.14);
}

.login-shell { padding-top: 24px; padding-bottom: 24px; }
.login-brand-panel,
.login-card-pro {
  background:
    linear-gradient(160deg, rgba(10,16,32,.94), rgba(19,40,59,.86), rgba(11,23,38,.94));
}
.login-brand-panel::after,
.login-card-pro::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(135deg, rgba(255,255,255,.045), transparent 24%, transparent 70%, rgba(255,255,255,.02));
  border-radius: inherit;
}
.login-brand-logo,
.login-side-logo {
  box-shadow: 0 16px 34px rgba(0,0,0,.24);
}
.login-form-shell {
  background: linear-gradient(180deg, rgba(2,6,23,.32), rgba(15,23,42,.22));
}
.login-label { color: #eef4fb; }
.login-tab { min-height: 46px; }
.login-tab:not(.active):hover {
  background: rgba(255,255,255,.04);
  color: #dbe6f2;
}

#view-net-details .tab-btn,
#view-superadmin .tab-btn,
#view-dashboard .tab-btn {
  min-height: 40px;
  padding-inline: 16px;
}
#view-net-details .net-tabs-bar,
#view-dashboard .dashboard-toolbar-actions,
#view-networks .networks-toolbar-actions {
  align-items: stretch;
}
#view-net-details .net-header-actions .action-btn,
#view-net-details .network-summary-actions .action-btn {
  min-width: 96px;
}

@media (max-width: 1024px) {
  #appView.app-shell { gap: 16px; }
  .dashboard-toolbar,
  .networks-toolbar,
  .net-header-shell { padding: 12px 14px; }
}
@media (max-width: 768px) {
  .btn-primary,
  .action-btn,
  .toolbar-btn,
  .login-secondary,
  .sidebar-user-action,
  .sidebar-logout,
  .net-back-btn,
  .tab-btn { min-height: 40px; }
  .network-summary-actions,
  .net-header-actions,
  .dashboard-toolbar-actions,
  .networks-toolbar-actions { width: 100%; }
  .network-summary-actions > *,
  .net-header-actions > *,
  .dashboard-toolbar-actions > *,
  .networks-toolbar-actions > * { flex: 1 1 calc(50% - 8px); }
}


/* ===== Premium polish v6: visual only, no feature changes ===== */
html { scroll-behavior: smooth; }
body {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  background-attachment: fixed;
}
::-webkit-scrollbar { width: 12px; height: 12px; }
::-webkit-scrollbar-track { background: rgba(2,6,23,.58); }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, color-mix(in srgb, var(--brand-accent) 82%, #fff 8%), color-mix(in srgb, var(--brand-accent-soft) 65%, transparent));
  border: 2px solid rgba(2,6,23,.58);
  border-radius: 999px;
}
::selection { background: color-mix(in srgb, var(--brand-accent) 28%, transparent); color: #fff; }

.app-shell::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 12% 10%, color-mix(in srgb, var(--brand-accent) 10%, transparent), transparent 22%),
    radial-gradient(circle at 88% 14%, color-mix(in srgb, var(--brand-accent-soft) 8%, transparent), transparent 20%),
    radial-gradient(circle at 50% 100%, rgba(255,255,255,.035), transparent 28%);
  opacity: .9;
}
.card,
.section-shell,
.network-list-card,
.device-card,
.settings-stack-card,
.ai-terminal-shell,
.ai-terminal-box,
.chart-shell,
.table-shell,
.network-summary-shell,
.network-quick-item,
.network-quick-qr,
.branch-metric-card,
.audit-row-card,
.alert-row-card,
.sa-section-shell,
.net-header-shell,
.dashboard-toolbar,
.networks-toolbar {
  box-shadow:
    0 18px 44px rgba(2,6,23,.24),
    inset 0 1px 0 rgba(255,255,255,.045);
}
.card::after,
.section-shell::after,
.network-list-card::after,
.device-card::after,
.settings-stack-card::after,
.sa-section-shell::after,
.net-header-shell::after,
.dashboard-toolbar::after,
.networks-toolbar::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background: linear-gradient(135deg, rgba(255,255,255,.04), transparent 22%, transparent 70%, rgba(255,255,255,.018));
}
.nav-btn,
.tab-btn,
.action-btn,
.btn-primary,
.sidebar-user-action,
.sidebar-logout,
.login-tab,
.password-toggle,
.network-quick-copy,
.ip-btn {
  transition: transform .2s ease, box-shadow .25s ease, border-color .25s ease, background .25s ease, color .25s ease;
}
.nav-btn:hover,
.tab-btn:hover,
.action-btn:hover,
.sidebar-user-action:hover,
.sidebar-logout:hover,
.login-tab:hover,
.password-toggle:hover,
.network-quick-copy:hover,
.ip-btn:hover {
  transform: translateY(-1px);
}
.btn-primary,
.login-tab.active,
#view-net-details .tab-btn.active,
#view-dashboard .tab-btn.active,
#view-superadmin .tab-btn.active {
  color: #16120a !important;
  background: linear-gradient(135deg, color-mix(in srgb, var(--brand-accent) 92%, white 8%), color-mix(in srgb, var(--brand-accent-soft) 78%, white 22%)) !important;
  border-color: color-mix(in srgb, var(--brand-accent) 34%, transparent) !important;
  box-shadow:
    0 14px 32px color-mix(in srgb, var(--brand-accent) 18%, transparent),
    inset 0 1px 0 rgba(255,255,255,.34) !important;
}
.btn-primary:hover {
  box-shadow:
    0 18px 36px color-mix(in srgb, var(--brand-accent) 24%, transparent),
    inset 0 1px 0 rgba(255,255,255,.4);
}
.input-glass,
.device-search-wrap,
.networks-search-wrap {
  background: linear-gradient(180deg, rgba(2,6,23,.46), rgba(15,23,42,.42)) !important;
}
.input-glass:focus,
.device-search-wrap:focus-within {
  background: linear-gradient(180deg, rgba(2,6,23,.56), rgba(15,23,42,.52)) !important;
}
.app-sidebar {
  box-shadow:
    0 26px 62px rgba(2,6,23,.34),
    inset 0 1px 0 rgba(255,255,255,.04);
}
.sidebar-footnote::before {
  content: "IT TOP";
  display: block;
  text-align: center;
  color: color-mix(in srgb, var(--brand-accent-soft) 68%, #fff 12%);
  font-size: 11px;
  letter-spacing: .28em;
  font-weight: 900;
  opacity: .72;
  padding-top: 4px;
}
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 .card {
  min-height: 122px;
}
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 .card p {
  text-shadow: 0 10px 24px rgba(0,0,0,.18);
}
.analytics-head,
.section-heading-row,
.net-summary-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.network-list-card,
.device-card,
.settings-stack-card,
.branch-metric-card,
.audit-row-card,
.alert-row-card {
  border-radius: 20px;
}
.zt-table tbody tr:hover td {
  background: color-mix(in srgb, var(--brand-accent) 6%, transparent);
}
.ai-live-feed,
#aiTerminal,
#pingResult {
  border-radius: 16px;
}
.network-quick-qr-box {
  border-radius: 22px;
  box-shadow: 0 18px 44px rgba(0,0,0,.34), 0 0 0 1px rgba(255,255,255,.48);
}
.network-quick-actions .action-btn,
.dashboard-toolbar-actions .action-btn,
.networks-toolbar-actions .btn-primary,
.net-header-actions .action-btn,
.network-summary-actions .action-btn {
  min-height: 42px;
}
.login-brand-panel,
.login-card-pro,
.login-form-shell,
.brand-legal-box {
  box-shadow:
    0 24px 60px rgba(2,6,23,.3),
    inset 0 1px 0 rgba(255,255,255,.04);
}
.login-brand-logo,
.login-side-logo {
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02));
  border: 1px solid rgba(255,255,255,.08);
}
.login-label,
.field-label,
.panel-meta,
.device-toolbar-meta,
.network-quick-label,
.sidebar-section-title {
  letter-spacing: .03em;
}
.brand-legal-box,
.notice,
.ping-result-box,
.ai-terminal-toolbar,
.ai-live-feed {
  border-color: color-mix(in srgb, var(--brand-accent) 14%, rgba(255,255,255,.08));
}
.section-chip,
.brand-chip,
.role-badge,
.badge {
  backdrop-filter: blur(8px);
}
@media (max-width: 768px) {
  .card,
  .section-shell,
  .dashboard-toolbar,
  .networks-toolbar,
  .net-header-shell,
  .sa-section-shell {
    border-radius: 18px;
  }
  #view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 .card {
    min-height: 108px;
  }
}


/* ===== Premium visual refresh - commercial grade ===== */
body {
  position: relative;
  background:
    radial-gradient(circle at 12% 18%, rgba(200,163,77,0.12), transparent 22%),
    radial-gradient(circle at 88% 12%, rgba(61,102,255,0.12), transparent 24%),
    radial-gradient(circle at 50% 100%, rgba(15,23,42,0.22), transparent 40%),
    linear-gradient(180deg, var(--brand-bg-alt) 0%, var(--brand-bg) 58%, #04070e 100%);
}
body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none;
  background-image: linear-gradient(rgba(255,255,255,0.018) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.018) 1px, transparent 1px);
  background-size: 72px 72px; opacity: .18; mask-image: radial-gradient(circle at center, black 36%, transparent 100%);
}
.card {
  background: linear-gradient(180deg, color-mix(in srgb, var(--brand-panel) 92%, rgba(255,255,255,0.03)), color-mix(in srgb, var(--brand-panel-soft) 96%, rgba(0,0,0,0.12)));
  border: 1px solid color-mix(in srgb, var(--brand-accent) 16%, rgba(255,255,255,0.05));
  box-shadow: 0 18px 50px rgba(2, 8, 20, 0.46), inset 0 1px 0 rgba(255,255,255,0.05);
}
.card:hover { box-shadow: 0 22px 60px rgba(2,8,20,0.52), 0 0 0 1px color-mix(in srgb, var(--brand-accent) 12%, transparent); }
.btn-primary {
  background: linear-gradient(135deg, #d2ab52 0%, #f3d99b 100%);
  color: #121826;
  box-shadow: 0 10px 24px rgba(200,163,77,0.22), inset 0 1px 0 rgba(255,255,255,0.26);
}
.btn-primary:hover { box-shadow: 0 16px 32px rgba(200,163,77,0.28); transform: translateY(-2px); }
.input-glass {
  background: linear-gradient(180deg, rgba(10,16,28,0.88), rgba(7,11,20,0.94)) !important;
  border-color: rgba(143,162,191,0.16) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.03);
}
.nav-btn.active, .tab-btn.active { box-shadow: 0 8px 20px rgba(200,163,77,0.12), inset 0 1px 0 rgba(255,255,255,0.04); }
.sidebar-brand-card, .sidebar-user-card, .app-sidebar {
  background: linear-gradient(180deg, rgba(11,19,33,0.96), rgba(7,11,20,0.98));
}
.sidebar-kicker, .theme-accent, .section-title-sm, .panel-title { color: var(--brand-accent-soft); }
.role-badge { box-shadow: inset 0 1px 0 rgba(255,255,255,0.04), 0 8px 20px rgba(0,0,0,0.22); }
.app-footer-inner { background: rgba(7,11,20,0.72); border: 1px solid rgba(200,163,77,0.12); box-shadow: 0 12px 28px rgba(0,0,0,0.25); }
.login-brand-panel, .login-card-pro, .login-frame .card { box-shadow: 0 22px 55px rgba(0,0,0,0.42), inset 0 1px 0 rgba(255,255,255,0.04); }
.login-premium-badge {
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 14px; border-radius:999px; font-size:11px; font-weight:900;
  color:#f3d99b; background:rgba(200,163,77,0.10); border:1px solid rgba(200,163,77,0.24);
  letter-spacing:.08em; text-transform:uppercase;
}
.login-premium-badge::before { content:'✦'; color:#f3d99b; }
.premium-admin-hero { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; padding:26px 28px; position:relative; overflow:hidden; }
.premium-admin-hero::before { content:''; position:absolute; inset:-20% auto auto -10%; width:280px; height:280px; background:radial-gradient(circle, rgba(200,163,77,0.18) 0%, transparent 65%); pointer-events:none; }
.premium-admin-hero::after { content:''; position:absolute; inset:auto -8% -32% auto; width:320px; height:320px; background:radial-gradient(circle, rgba(70,112,255,0.16) 0%, transparent 68%); pointer-events:none; }
.premium-admin-hero-copy, .premium-admin-hero-badges { position:relative; z-index:1; }
.premium-admin-kicker { display:inline-flex; align-items:center; gap:8px; padding:7px 12px; border-radius:999px; font-size:11px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; color:#f3d99b; background:rgba(200,163,77,0.08); border:1px solid rgba(200,163,77,0.22); }
.premium-admin-title { margin:14px 0 10px; font-size:32px; line-height:1.15; font-weight:900; color:#f8fbff; }
.premium-admin-subtitle { max-width:780px; color:#9fb0ca; font-size:14px; line-height:1.9; margin:0; }
.premium-admin-hero-badges { display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.lux-badge { display:inline-flex; align-items:center; gap:8px; padding:9px 14px; border-radius:999px; font-size:11px; font-weight:900; text-transform:uppercase; letter-spacing:.08em; }
.lux-badge-gold { background:rgba(200,163,77,0.12); color:#f3d99b; border:1px solid rgba(200,163,77,0.26); }
.lux-badge-blue { background:rgba(96,165,250,0.10); color:#93c5fd; border:1px solid rgba(96,165,250,0.20); }
.lux-stat-grid { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:14px; }
.lux-stat-card { padding:18px; min-height:146px; display:flex; flex-direction:column; justify-content:space-between; }
.lux-stat-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; }
.lux-stat-kicker { font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:#8fa2bf; font-weight:800; }
.lux-inline-badge { padding:6px 10px; border-radius:999px; font-size:10px; font-weight:900; letter-spacing:.08em; color:#f8fafc; background:rgba(148,163,184,0.12); border:1px solid rgba(148,163,184,0.18); }
.lux-inline-badge-gold { color:#f3d99b; background:rgba(200,163,77,0.10); border-color:rgba(200,163,77,0.22); }
.lux-inline-badge-green { color:#86efac; background:rgba(34,197,94,0.10); border-color:rgba(34,197,94,0.20); }
.lux-inline-badge-blue { color:#93c5fd; background:rgba(59,130,246,0.10); border-color:rgba(59,130,246,0.18); }
.lux-inline-badge-amber { color:#fcd34d; background:rgba(245,158,11,0.10); border-color:rgba(245,158,11,0.18); }
.lux-stat-value { font-size:26px; line-height:1.2; font-weight:900; color:#f8fbff; }
.lux-stat-value.mono { font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace; font-size:18px; direction:ltr; text-align:left; }
.lux-stat-note { font-size:12px; line-height:1.8; color:#8fa2bf; }
.sa-mini-identity { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:12px; }
.sa-mini-identity-item { background:rgba(2,6,23,0.42); border:1px solid rgba(148,163,184,0.10); border-radius:16px; padding:12px 14px; }
.sa-mini-identity-item span { display:block; font-size:10px; color:#8fa2bf; font-weight:800; margin-bottom:6px; text-transform:uppercase; letter-spacing:.08em; }
.sa-mini-identity-item strong { display:block; font-size:13px; color:#eef2f7; font-weight:800; word-break:break-word; }
#view-superadmin .sa-section-shell { border:1px solid rgba(148,163,184,0.10); box-shadow:0 18px 40px rgba(2,8,20,0.34), inset 0 1px 0 rgba(255,255,255,0.03); }
#view-superadmin .sa-section-kicker { color:#f3d99b; letter-spacing:.08em; text-transform:uppercase; }
.table-shell { border:1px solid rgba(148,163,184,0.08); border-radius:18px; overflow:hidden; background:rgba(7,11,20,0.45); }
@media (max-width: 1100px) { .lux-stat-grid { grid-template-columns:repeat(2, minmax(0,1fr)); } .sa-mini-identity { grid-template-columns:repeat(2, minmax(0,1fr)); } .premium-admin-hero { flex-direction:column; } }
@media (max-width: 680px) { .lux-stat-grid, .sa-mini-identity { grid-template-columns:1fr; } .premium-admin-title { font-size:26px; } }

.license-shell {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at top left, rgba(200,163,77,0.14), transparent 32%),
    radial-gradient(circle at top right, rgba(96,165,250,0.12), transparent 28%),
    linear-gradient(180deg, rgba(12,18,33,0.96), rgba(7,11,20,0.96));
}
.license-hero-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.license-hero-card {
  border: 1px solid rgba(200,163,77,0.18);
  background: linear-gradient(180deg, rgba(11,17,32,0.94), rgba(5,10,20,0.86));
  border-radius: 24px;
  padding: 18px;
  box-shadow: 0 12px 30px rgba(0,0,0,0.24), inset 0 1px 0 rgba(255,255,255,0.03);
}
.license-mini-kicker {
  display:block;
  color: var(--theme-muted, #8fa2bf);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
  margin-bottom: 8px;
}
.license-hero-value {
  display:block;
  color: #f8e6ba;
  font-size: 1.1rem;
  font-weight: 900;
  margin-bottom: 6px;
}
.license-hero-note {
  display:block;
  color: #91a2bd;
  font-size: .85rem;
  line-height: 1.7;
}
.lux-inline-badge-rose {
  background: rgba(244,63,94,0.12);
  color: #fda4af;
  border-color: rgba(244,63,94,0.24);
}
@media (max-width: 980px){
  .license-hero-grid { grid-template-columns: 1fr; }
}


.activation-shell {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 15% 20%, rgba(211, 158, 82, 0.16), transparent 28%),
    radial-gradient(circle at 85% 15%, rgba(56, 189, 248, 0.13), transparent 30%),
    linear-gradient(135deg, #020617 0%, #050d1a 38%, #071322 100%);
}
.activation-backdrop-grid, .activation-noise, .activation-orb { position: absolute; inset: 0; pointer-events: none; }
.activation-backdrop-grid { background-image: linear-gradient(rgba(211,158,82,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(211,158,82,.05) 1px, transparent 1px); background-size: 56px 56px; -webkit-mask-image: radial-gradient(circle at center, black 30%, transparent 85%); mask-image: radial-gradient(circle at center, black 30%, transparent 85%); opacity: .35; }
.activation-noise { background-image: radial-gradient(rgba(255,255,255,.05) 0.7px, transparent 0.7px); background-size: 14px 14px; opacity: .05; mix-blend-mode: soft-light; }
.activation-orb-a { background: radial-gradient(circle at center, rgba(217, 168, 98, 0.26), transparent 62%); transform: translate(-28%, -18%); }
.activation-orb-b { background: radial-gradient(circle at center, rgba(56, 189, 248, 0.20), transparent 65%); transform: translate(48%, 18%); }
.activation-frame { position: relative; z-index: 1; }
.activation-brand-panel, .activation-card-pro { background: linear-gradient(180deg, rgba(9,14,25,.92), rgba(8,12,22,.88)); border: 1px solid rgba(211,158,82,.18); box-shadow: 0 30px 80px rgba(2,6,23,.55), inset 0 1px 0 rgba(255,255,255,.03); backdrop-filter: blur(18px); }
.activation-brand-logo-wrap, .activation-icon-wrap { width: 72px; height: 72px; border-radius: 24px; display: inline-flex; align-items: center; justify-content: center; background: linear-gradient(135deg, rgba(211,158,82,.18), rgba(255,255,255,.05)); border: 1px solid rgba(211,158,82,.24); box-shadow: 0 16px 40px rgba(0,0,0,.35); }
.activation-brand-logo, .activation-side-logo { max-width: 52px; max-height: 52px; object-fit: contain; }
.activation-kicker { display:inline-flex; align-items:center; gap:.4rem; padding:.45rem .8rem; border-radius:999px; font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.22em; color:#f5deb3; background:rgba(211,158,82,.10); border:1px solid rgba(211,158,82,.22); }
.activation-premium-badge { display:inline-flex; align-items:center; justify-content:center; padding:.6rem 1rem; border-radius:999px; font-size:.76rem; letter-spacing:.18em; text-transform:uppercase; font-weight:900; color:#e8edf6; background:linear-gradient(90deg, rgba(217,168,98,.18), rgba(56,189,248,.14)); border:1px solid rgba(217,168,98,.24); }
.activation-info-grid { display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap:1rem; margin-top:1.5rem; }
.activation-info-card { padding:1rem 1rem 1.1rem; border-radius:20px; background:linear-gradient(180deg, rgba(7,12,22,.92), rgba(4,8,15,.84)); border:1px solid rgba(148,163,184,.14); box-shadow: inset 0 1px 0 rgba(255,255,255,.03); display:flex; flex-direction:column; gap:.45rem; }
.activation-info-card span { font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:#94a3b8; font-weight:800; }
.activation-info-card strong { font-size:1.08rem; font-weight:900; color:#f8fafc; word-break: break-word; }
.activation-info-card small { color:#9fb0ba; font-size:.82rem; }
.activation-mini-btn { width:max-content; padding:.45rem .7rem; border-radius:999px; background:rgba(217,168,98,.08); border:1px solid rgba(217,168,98,.22); color:#f5deb3; font-size:.72rem; font-weight:800; }
.activation-legal-box { margin-top:1.5rem; padding:1rem 1.1rem; border-radius:18px; background:rgba(2,6,23,.42); border:1px solid rgba(148,163,184,.12); color:#9fb0ba; }
.activation-status-row { display:flex; gap:.6rem; flex-wrap:wrap; justify-content:center; }
.activation-input { min-height: 180px; line-height: 1.7; }
.activation-actions-grid { display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap:.9rem; }
.activation-success-box { padding:1rem 1.1rem; border-radius:20px; background:linear-gradient(180deg, rgba(34,197,94,.14), rgba(16,185,129,.08)); border:1px solid rgba(52,211,153,.20); color:#d1fae5; }
@media (max-width: 960px){ .activation-info-grid, .activation-actions-grid { grid-template-columns: 1fr; } }


.bridge-panel {
  background: linear-gradient(180deg, rgba(7,16,28,0.96), rgba(5,10,20,0.92));
  box-shadow: 0 18px 40px rgba(2,8,20,0.34), inset 0 1px 0 rgba(255,255,255,0.03);
}
.bridge-control-grid {
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 14px;
}
.bridge-subnet-box {
  border-radius: 18px;
  padding: 14px 16px;
  border: 1px solid rgba(56,189,248,0.18);
  background: linear-gradient(180deg, rgba(8,15,28,0.88), rgba(2,6,23,0.72));
}
.bridge-subnet-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: #8fa2bf;
  margin-bottom: 8px;
  font-weight: 800;
}
.bridge-subnet-value {
  color: #d7ecff;
  font-size: 13px;
  line-height: 1.8;
  word-break: break-all;
}
.bridge-linked-list { display: grid; gap: 12px; }
.bridge-linked-card {
  border-radius: 18px;
  padding: 15px 16px;
  border: 1px solid rgba(148,163,184,0.12);
  background: rgba(2,6,23,0.46);
  display:flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.bridge-linked-meta { display:grid; gap: 4px; }
.bridge-linked-name { color:#eef2f7; font-weight:900; }
.bridge-linked-note { color:#8fa2bf; font-size:12px; }
.bridge-empty {
  padding: 16px;
  border-radius: 18px;
  border: 1px dashed rgba(148,163,184,0.18);
  color: #8fa2bf;
  text-align: center;
  background: rgba(2,6,23,0.28);
}
@media (max-width: 900px){ .bridge-control-grid { grid-template-columns: 1fr; } }


.bridge-admin-card{border:1px solid rgba(148,163,184,0.12);background:linear-gradient(180deg,rgba(15,23,42,0.88),rgba(2,6,23,0.92));border-radius:22px;padding:18px 18px 16px;box-shadow:0 18px 44px rgba(2,8,20,0.24);}
.bridge-admin-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;}
.bridge-admin-title{font-weight:900;color:#f8fafc;font-size:1rem;}
.bridge-admin-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-top:14px;}
.bridge-admin-label{font-size:.72rem;font-weight:800;color:#94a3b8;margin-bottom:6px;}
.bridge-admin-value{padding:10px 12px;border-radius:14px;background:rgba(15,23,42,0.86);border:1px solid rgba(148,163,184,0.10);color:#e2e8f0;word-break:break-word;}
.bridge-admin-note{color:#94a3b8;font-size:.78rem;line-height:1.7;}
.bridge-admin-create-card{border:1px solid rgba(148,163,184,0.12);background:linear-gradient(180deg,rgba(15,23,42,0.78),rgba(2,6,23,0.88));border-radius:22px;padding:18px;box-shadow:0 18px 44px rgba(2,8,20,0.18);}
.bridge-admin-create-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;}



.activation-diagnostics-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.activation-info-card-tight{padding:14px 16px;min-height:auto;}
.activation-info-card-tight strong{font-size:1rem;}
@media (max-width: 768px){.activation-diagnostics-grid{grid-template-columns:1fr;}}


.admin-summary-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.admin-summary-item{border:1px solid rgba(148,163,184,.10);background:rgba(15,23,42,.44);border-radius:16px;padding:14px;display:flex;flex-direction:column;gap:6px;min-height:82px;}
.admin-summary-label{font-size:11px;font-weight:800;color:#94a3b8;}
.admin-summary-value{font-size:14px;font-weight:800;color:#e2e8f0;word-break:break-word;}
.admin-create-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;align-items:end;}
.admin-create-action-wrap{display:flex;align-items:end;}
.admin-card{border:1px solid rgba(148,163,184,.12);background:linear-gradient(180deg, rgba(15,23,42,.82), rgba(2,6,23,.88));border-radius:20px;padding:16px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;}
.admin-card-main{min-width:0;}
.admin-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px;}
.admin-card-identity{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.admin-card-name{font-size:15px;font-weight:900;color:#fff;}
.admin-card-sub{font-size:12px;color:#94a3b8;}
.admin-role-chip{display:inline-flex;align-items:center;padding:5px 10px;border-radius:999px;background:rgba(59,130,246,.12);border:1px solid rgba(59,130,246,.18);color:#bfdbfe;font-size:10px;font-weight:900;}
.admin-current-chip{display:inline-flex;align-items:center;padding:5px 10px;border-radius:999px;background:rgba(16,185,129,.12);border:1px solid rgba(16,185,129,.18);color:#a7f3d0;font-size:10px;font-weight:900;}
.admin-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
.admin-card-actions{display:flex;flex-direction:column;justify-content:center;gap:10px;min-width:150px;}
.admin-action-btn{border-radius:14px;padding:10px 14px;font-size:13px;font-weight:900;transition:.18s ease;text-align:center;}
.admin-action-save{background:rgba(245,158,11,.12);border:1px solid rgba(245,158,11,.24);color:#fcd34d;}
.admin-action-save:hover{background:rgba(245,158,11,.22);color:#fff7d6;}
.admin-action-password{background:rgba(59,130,246,.12);border:1px solid rgba(59,130,246,.24);color:#bfdbfe;}
.admin-action-password:hover{background:rgba(59,130,246,.24);color:#fff;}
.admin-action-delete{background:rgba(239,68,68,.12);border:1px solid rgba(239,68,68,.24);color:#fca5a5;}
.admin-action-delete:hover{background:rgba(239,68,68,.24);color:#fff;}
.admin-action-delete[disabled], .admin-action-save[disabled]{opacity:.45;cursor:not-allowed;}
.admin-empty-state{padding:18px;border-radius:18px;border:1px dashed rgba(148,163,184,.16);color:#94a3b8;text-align:center;background:rgba(15,23,42,.38);}
@media (max-width: 1279px){.admin-create-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.admin-create-action-wrap{grid-column:span 2;}.admin-card{grid-template-columns:1fr;}.admin-card-actions{min-width:0;flex-direction:row;flex-wrap:wrap;}.admin-card-actions .admin-action-btn{flex:1;}.admin-card-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.admin-trial-fields{grid-template-columns:repeat(2,minmax(0,1fr));grid-column:span 2;}}
@media (max-width: 768px){.admin-summary-grid,.admin-card-grid,.admin-create-grid,.admin-trial-fields,.admin-trial-meta{grid-template-columns:1fr;}.admin-create-action-wrap{grid-column:auto;}.admin-card-actions{flex-direction:column;}.admin-card-actions .admin-action-btn{width:100%;}}

.admin-role-guide{
  margin-top:16px;
  padding:16px;
  border:1px solid rgba(148,163,184,.16);
  border-radius:24px;
  background:linear-gradient(180deg, rgba(2,6,23,.84), rgba(15,23,42,.72));
}
.role-guide-intro{display:flex;flex-direction:column;gap:6px;margin-bottom:14px;}
.role-guide-kicker{display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;padding:4px 10px;border-radius:999px;border:1px solid rgba(245,158,11,.18);background:rgba(245,158,11,.08);color:#fcd34d;font-size:10px;font-weight:900;}
.role-guide-intro-title{color:#e2e8f0;font-size:13px;font-weight:700;line-height:1.9;}
.role-guide-grid{display:grid;gap:12px;}
.role-guide-grid-main{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin-bottom:12px;}
.role-guide-grid-mini{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));}
.role-guide-card{border-radius:20px;padding:14px;border:1px solid rgba(59,130,246,.16);background:rgba(2,6,23,.72);box-shadow:inset 0 1px 0 rgba(255,255,255,.03);}
.role-guide-card.compact{padding:12px;}
.role-guide-card.active{border-color:rgba(245,158,11,.35);background:linear-gradient(180deg, rgba(30,41,59,.92), rgba(15,23,42,.92));box-shadow:0 14px 30px rgba(0,0,0,.22), 0 0 0 1px rgba(245,158,11,.08) inset;}
.role-guide-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:8px;}
.role-guide-title{font-size:15px;font-weight:900;color:#fff;}
.role-guide-subtitle{font-size:11px;font-weight:800;color:#93c5fd;margin-top:2px;}
.role-guide-active{display:inline-flex;align-items:center;justify-content:center;padding:4px 8px;border-radius:999px;background:rgba(245,158,11,.12);color:#fcd34d;border:1px solid rgba(245,158,11,.22);font-size:10px;font-weight:900;white-space:nowrap;}
.role-guide-text{font-size:12px;line-height:1.9;color:#cbd5e1;margin:0 0 8px;}
.role-guide-hint{font-size:11px;color:#94a3b8;font-weight:800;margin-bottom:8px;}
.role-guide-bullets{margin:0 0 10px;padding-right:18px;color:#cbd5e1;font-size:11px;line-height:1.8;}
.role-guide-warning{font-size:11px;color:#f8fafc;font-weight:800;padding:8px 10px;border-radius:14px;background:rgba(15,23,42,.7);border:1px dashed rgba(148,163,184,.18);}
.role-current-summary{margin-top:14px;}
.role-current-shell{padding:12px 14px;border-radius:18px;background:rgba(15,23,42,.58);border:1px solid rgba(59,130,246,.16);}
.role-current-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:6px;}
.role-current-title{font-size:14px;font-weight:900;color:#fff;}
.role-current-subtitle{font-size:11px;font-weight:800;color:#93c5fd;}
.role-current-chip{display:inline-flex;align-items:center;justify-content:center;padding:4px 9px;border-radius:999px;background:rgba(59,130,246,.09);border:1px solid rgba(59,130,246,.18);color:#bfdbfe;font-size:10px;font-weight:900;}
.role-current-text{font-size:12px;line-height:1.8;color:#cbd5e1;}
.admin-role-note{margin-top:8px;font-size:11px;line-height:1.8;color:#93c5fd;}
.admin-row-role-hint{margin-top:8px;font-size:11px;line-height:1.8;color:#94a3b8;}
.admin-trial-toggle-card{padding:12px 14px;border:1px solid rgba(168,85,247,.18);border-radius:18px;background:rgba(30,41,59,.42);min-height:100%;}
.admin-trial-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;grid-column:span 3;}
.admin-trial-badge{display:inline-flex;align-items:center;padding:5px 10px;border-radius:999px;background:rgba(168,85,247,.14);border:1px solid rgba(168,85,247,.26);color:#e9d5ff;font-size:10px;font-weight:900;}
.admin-trial-meta{margin-top:10px;padding:12px 14px;border-radius:16px;background:rgba(76,29,149,.10);border:1px solid rgba(168,85,247,.18);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;}
.admin-trial-stat{display:flex;flex-direction:column;gap:4px;}
.admin-trial-stat span{font-size:10px;color:#c4b5fd;font-weight:800;}
.admin-trial-stat strong{font-size:12px;color:#f5f3ff;font-weight:900;}
@media (max-width: 768px){
  .role-guide-head,.role-current-head{flex-direction:column;align-items:flex-start;}
}


.device-toolbar-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.quick-client-shell{position:relative;overflow:hidden;background:linear-gradient(180deg,rgba(3,10,24,.92),rgba(8,15,30,.88));box-shadow:0 18px 54px rgba(2,8,20,.24),0 0 0 1px rgba(34,211,238,.05) inset;}
.quick-client-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-bottom:18px;}
.quick-client-title{font-size:1.08rem;font-weight:900;color:#67e8f9;margin:0 0 6px;}
.quick-client-subtitle{margin:0;color:#94a3b8;font-size:.84rem;line-height:1.8;max-width:640px;}
.quick-client-head-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.quick-client-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(250px,.75fr);gap:18px;align-items:stretch;}
.quick-client-shell.compact .quick-client-grid{display:none;}
.quick-client-shell.compact .quick-client-subtitle{max-width:none;color:#7dd3fc;}
.quick-client-shell.compact{padding-bottom:18px;}
.quick-client-shell.compact .quick-client-head{margin-bottom:0;}
.quick-client-shell.compact::after{content:"القسم مطوي لتقليل المساحة. اضغط فتح القسم لإظهار النموذج وQR.";display:block;margin-top:4px;padding:12px 14px;border-radius:16px;background:rgba(15,23,42,.48);border:1px solid rgba(148,163,184,.12);color:#93c5fd;font-size:.82rem;line-height:1.8;}
.quick-client-form{display:flex;flex-direction:column;gap:16px;min-width:0;}
.quick-client-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
.quick-client-notes-wrap{grid-column:span 2;}
.quick-client-label{display:block;font-size:11px;font-weight:900;color:#94a3b8;margin-bottom:6px;}
.quick-client-output textarea{width:100%;}
.quick-client-qr-panel{border:1px solid rgba(34,211,238,.12);border-radius:22px;padding:16px;background:rgba(2,10,20,.54);display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:14px;}
.quick-client-qr-head{font-size:12px;font-weight:900;color:#f8fafc;letter-spacing:.08em;text-transform:uppercase;}
.quick-client-qr-box-wrap{width:100%;display:flex;justify-content:center;align-items:center;padding:18px;border-radius:20px;background:radial-gradient(circle at top, rgba(34,211,238,.12), rgba(15,23,42,.18));border:1px solid rgba(148,163,184,.16);min-height:360px;}
.quick-client-qr-box{width:304px;min-height:304px;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:22px;padding:16px;box-shadow:0 10px 28px rgba(15,23,42,.22);}
.quick-client-qr-box img,.quick-client-qr-box canvas{width:100% !important;height:100% !important;display:block;image-rendering:pixelated;border-radius:14px;}
.quick-client-note{font-size:.78rem;line-height:1.8;color:#94a3b8;text-align:center;}
@media (max-width: 900px){.quick-client-grid{grid-template-columns:1fr;}.quick-client-form-grid{grid-template-columns:1fr;}.quick-client-notes-wrap{grid-column:auto;}}
.recycle-bin-trigger {
    display:inline-flex; align-items:center; gap:10px; padding:10px 16px; border-radius:12px;
    border:1px solid rgba(34,211,238,.28); background:rgba(8,15,30,.58); color:#d7fbff;
    cursor:pointer; font-weight:800; transition:.22s ease;
    box-shadow:0 0 14px rgba(34,211,238,.08), inset 0 0 14px rgba(255,255,255,.02);
}
.recycle-bin-trigger:hover {
    transform:translateY(-1px); border-color:rgba(34,211,238,.55);
    box-shadow:0 0 18px rgba(34,211,238,.18), inset 0 0 14px rgba(34,211,238,.06);
}
.recycle-bin-modal { position:fixed; inset:0; z-index:10050; direction:rtl; }
.recycle-bin-backdrop { position:absolute; inset:0; background:rgba(2,8,23,.72); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }
.recycle-bin-dialog {
    position:relative; width:min(940px, calc(100% - 24px)); margin:5vh auto 0; border-radius:22px; overflow:hidden;
    background:rgba(7,14,28,.75); border:1px solid rgba(34,211,238,.22);
    backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
    box-shadow:0 0 0 1px rgba(255,255,255,.03) inset, 0 0 26px rgba(34,211,238,.10), 0 20px 60px rgba(0,0,0,.42);
}
.recycle-bin-header {
    display:flex; align-items:center; justify-content:space-between; gap:12px; padding:18px 22px;
    border-bottom:1px solid rgba(34,211,238,.14); background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0));
}
.recycle-bin-title {
    margin:0; font-size:1.25rem; font-weight:900; color:#ff5878;
    text-shadow:0 0 6px rgba(255,77,109,.40), 0 0 14px rgba(255,77,109,.22), 0 0 28px rgba(255,0,76,.14);
}
.recycle-bin-close {
    width:42px; height:42px; border-radius:12px; border:1px solid rgba(255,255,255,.12);
    background:rgba(255,255,255,.04); color:#f8fafc; font-size:18px; cursor:pointer; transition:.2s ease;
}
.recycle-bin-close:hover { color:#ff6b81; border-color:rgba(255,80,120,.42); box-shadow:0 0 14px rgba(255,80,120,.18); }
.recycle-bin-body { padding:20px; }
.recycle-bin-table-wrap { overflow-x:auto; border-radius:16px; border:1px solid rgba(34,211,238,.12); background:rgba(2,10,20,.45); }
.recycle-bin-table { width:100%; border-collapse:collapse; min-width:640px; }
.recycle-bin-table th, .recycle-bin-table td { padding:14px 16px; text-align:right; border-bottom:1px solid rgba(148,163,184,.12); }
.recycle-bin-table th { color:#67e8f9; font-size:.95rem; font-weight:900; background:rgba(34,211,238,.05); }
.recycle-bin-table td { color:#e2e8f0; font-size:.95rem; }
.recycle-bin-table tbody tr:hover { background:rgba(34,211,238,.04); }
.recycle-bin-placeholder { text-align:center !important; color:#94a3b8 !important; padding:26px 16px !important; }
.recycle-bin-actions { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.recycle-btn { padding:7px 12px; border-radius:10px; background:transparent; font-size:.85rem; font-weight:900; cursor:pointer; transition:.22s ease; }
.recycle-btn-restore { color:#22c55e; border:1px solid rgba(34,197,94,.68); box-shadow:inset 0 0 10px rgba(34,197,94,.05); }
.recycle-btn-restore:hover { background:rgba(34,197,94,.12); box-shadow:0 0 14px rgba(34,197,94,.20), inset 0 0 10px rgba(34,197,94,.08); }
.recycle-btn-destroy { color:#ff4d6d; border:1px solid rgba(255,77,109,.68); box-shadow:inset 0 0 10px rgba(255,77,109,.05); }
.recycle-btn-destroy:hover { background:rgba(255,77,109,.12); box-shadow:0 0 14px rgba(255,77,109,.20), inset 0 0 10px rgba(255,77,109,.08); }
.recycle-device-name { font-weight:800; color:#f8fafc; }
.recycle-device-ip { font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace; color:#67e8f9; direction:ltr; text-align:left; display:inline-block; }
@media (max-width: 768px) {
    .recycle-bin-dialog { width:calc(100% - 14px); margin-top:2vh; }
    .recycle-bin-header, .recycle-bin-body { padding:14px; }
    .recycle-bin-table th, .recycle-bin-table td { padding:12px 10px; }
}

.login-info-stack{display:grid;gap:14px}
.login-info-panel{background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(15,23,42,.24));border:1px solid rgba(96,165,250,.12);border-radius:18px;padding:16px 18px;color:#cbd5e1}
.login-info-panel h3{margin:0 0 8px;color:#f8fafc;font-size:15px;font-weight:900}
.login-info-panel p{margin:0;color:#94a3b8;font-size:13px;line-height:1.95}
.login-info-panel ul{margin:0;padding-right:18px;color:#cbd5e1;font-size:13px;line-height:2}
.login-info-meta-panel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.login-info-meta-panel div{background:rgba(2,6,23,.22);border:1px solid rgba(148,163,184,.08);border-radius:14px;padding:12px}
.login-info-meta-panel span{display:block;color:#94a3b8;font-size:11px;font-weight:800;margin-bottom:6px}
.login-info-meta-panel strong{display:block;color:#fff;font-size:14px;font-weight:900}
.login-security-note{color:#f8fafc;background:linear-gradient(180deg,rgba(200,163,77,.12),rgba(15,23,42,.18));border-color:rgba(200,163,77,.18);line-height:2;font-size:12px;font-weight:800}
@media (max-width: 960px){.login-info-meta-panel{grid-template-columns:1fr}}


.login-quick-glance { display:grid; gap:12px; }
.login-glance-item { background: linear-gradient(180deg, rgba(255,255,255,.038), rgba(2,6,23,.18)); border:1px solid rgba(148,163,184,.1); border-radius:16px; padding:14px 16px; }
.login-glance-item span { display:block; color:var(--brand-accent-soft); font-size:11px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; margin-bottom:6px; }
.login-glance-item strong { display:block; color:#e2e8f0; font-size:13px; line-height:1.8; }
.login-inline-message { margin-top:14px; border-radius:14px; padding:12px 14px; font-size:13px; font-weight:800; line-height:1.8; border:1px solid rgba(148,163,184,.14); background:rgba(15,23,42,.44); color:#cbd5e1; }
.login-inline-message.is-error { background:rgba(127,29,29,.16); border-color:rgba(248,113,113,.25); color:#fecaca; }
.login-inline-message.is-success { background:rgba(20,83,45,.18); border-color:rgba(74,222,128,.22); color:#bbf7d0; }
.login-caps-hint { margin-top:10px; color:#fcd34d; font-size:12px; font-weight:800; background:rgba(120,53,15,.18); border:1px solid rgba(251,191,36,.22); border-radius:12px; padding:10px 12px; }
.login-access-hints { margin-top:16px; display:grid; gap:10px; }
.login-access-item { border-radius:14px; padding:12px 14px; background:rgba(2,6,23,.22); border:1px solid rgba(148,163,184,.08); }
.login-access-item strong { display:block; color:#f8fafc; font-size:12px; font-weight:900; margin-bottom:4px; }
.login-access-item span { display:block; color:#94a3b8; font-size:12px; line-height:1.8; font-weight:700; }


.device-status-filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}
.device-status-chip{border:1px solid rgba(71,85,105,.65);background:rgba(2,6,23,.72);color:#cbd5e1;padding:9px 14px;border-radius:999px;font-size:12px;font-weight:900;transition:.2s ease;box-shadow:0 12px 32px rgba(2,6,23,.18)}
.device-status-chip:hover{border-color:rgba(56,189,248,.45);color:#fff;transform:translateY(-1px)}
.device-status-chip.active{background:linear-gradient(135deg,rgba(14,165,233,.18),rgba(59,130,246,.2));border-color:rgba(56,189,248,.55);color:#f8fafc;box-shadow:0 12px 36px rgba(14,165,233,.18)}
.login-inline-message.ok{background:rgba(16,185,129,.12);border-color:rgba(16,185,129,.32);color:#d1fae5}
.login-inline-message.error{background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.32);color:#fee2e2}
.login-lock-countdown{margin-top:10px;padding:10px 14px;border-radius:14px;border:1px solid rgba(245,158,11,.28);background:rgba(120,53,15,.18);color:#fde68a;font-size:12px;font-weight:900;letter-spacing:.01em;text-align:center}

/* === login final cleanup overrides === */
.login-frame{
  grid-template-columns:minmax(420px,0.98fr) minmax(520px,1.02fr);
  align-items:stretch;
}
.login-brand-panel,.login-card-pro{
  min-height:600px;
}
.login-form-header,
.login-tabs,
.login-form-shell{
  width:100%;
  max-width:520px;
  margin-inline:auto;
}
.login-form-shell{
  padding:18px;
  border-radius:22px;
}
.login-brand-panel{padding-inline:34px}
.login-info-stack.compact{gap:12px}
.login-info-stack.compact .login-info-panel{padding:14px 16px}
.login-hero-stats{gap:10px}
.login-stat-card{min-height:86px;padding:14px 14px}
.login-stat-card strong{font-size:24px;margin-bottom:4px}
.login-stat-card span{font-size:12px;line-height:1.65}
.login-hero-text{max-width:46ch;line-height:1.9}
.login-pane{display:block;min-width:0}
.login-pane[hidden],
.login-pane.hidden{display:none !important}
.login-pane.active{display:block}
.password-wrap .login-input{padding-left:72px !important}
.password-toggle{left:10px;padding:7px 11px;font-size:11px;border-radius:11px}
.login-submit{min-height:54px;border-radius:15px;font-size:17px}
.login-submit small{font-size:10px;letter-spacing:.09em}
.login-access-hints.compact{margin-top:14px}
.login-access-hints.compact .login-access-item{padding:10px 12px}
.login-note-card{padding:12px 14px;line-height:1.75;font-size:12px}
.login-secondary{min-height:48px}
.login-inline-message{margin-top:12px}
.login-security-note{font-size:12px;line-height:1.85}
.brand-legal-box{opacity:.92}
@media (max-width: 1180px){
  .login-frame{grid-template-columns:1fr}
  .login-brand-panel,.login-card-pro{min-height:auto}
  .login-brand-panel{order:2}
  .login-card-pro{order:1}
}
@media (max-width: 960px){
  .login-shell{padding-top:18px;padding-bottom:18px}
  .login-brand-panel,.login-card-pro{padding:22px}
  .login-brand-top{grid-template-columns:1fr;gap:18px;text-align:center}
  .login-brand-logo-wrap{justify-content:center}
  .login-hero-stats{grid-template-columns:1fr}
  .login-form-header,.login-tabs,.login-form-shell{max-width:none}
  .login-form-shell{padding:16px}
}


.device-row{display:grid;grid-template-columns:minmax(250px,1.35fr) minmax(270px,1.2fr) minmax(230px,1fr) auto;gap:14px;align-items:center;background:linear-gradient(135deg,rgba(7,15,30,.92),rgba(9,23,44,.82));border:1px solid rgba(77,104,154,.38);border-radius:24px;padding:14px 16px;box-shadow:0 18px 44px rgba(2,6,23,.28), inset 0 1px 0 rgba(255,255,255,.04);margin-bottom:12px;overflow:hidden;position:relative}
.device-row::after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 100% 0%, rgba(34,211,238,.08), transparent 28%), radial-gradient(circle at 0% 100%, rgba(129,140,248,.06), transparent 24%)}
.device-row:hover{border-color:rgba(56,189,248,.46);box-shadow:0 22px 54px rgba(2,6,23,.34), inset 0 1px 0 rgba(255,255,255,.05);transform:translateY(-1px)}
.device-row-cell{min-width:0;position:relative;z-index:1}
.device-main{display:flex;align-items:flex-start;gap:12px;min-width:0}
.device-health-dot{width:11px;height:11px;border-radius:50%;flex:0 0 auto;box-shadow:0 0 0 5px rgba(255,255,255,.03);margin-top:7px}
.device-health-dot.online{background:#22c55e;box-shadow:0 0 0 5px rgba(34,197,94,.14)}
.device-health-dot.offline{background:#ef4444;box-shadow:0 0 0 5px rgba(239,68,68,.14)}
.device-main-text{min-width:0}
.device-title-row{display:flex;align-items:center;gap:10px;justify-content:space-between;min-width:0}
.device-name{font-size:16px;font-weight:900;color:#f8fafc;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.01em}
.device-subtitle{margin-top:4px;font-size:11.5px;line-height:1.7;color:#94a3b8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.device-subline{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:8px}
.mini-tag{display:inline-flex;align-items:center;justify-content:center;padding:4px 9px;border-radius:999px;font-size:10px;font-weight:800;color:#d7e2f1;background:rgba(15,23,42,.62);border:1px solid rgba(148,163,184,.14)}
.cell-network,.cell-status{display:flex;align-items:center}
.device-metric-list,.device-status-card{width:100%;border-radius:18px;background:linear-gradient(180deg,rgba(7,15,30,.62),rgba(15,23,42,.32));border:1px solid rgba(148,163,184,.1);padding:12px 13px;backdrop-filter:blur(6px)}
.device-metric-list.refined,.device-status-card.refined{box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.device-metric-line{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0}
.device-metric-label{flex:0 0 auto;font-size:10px;font-weight:900;color:#8ea4c7;letter-spacing:.06em;text-transform:uppercase}
.metric-value{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;color:#f1f5f9}
.metric-primary{align-items:center;margin-bottom:10px}
.device-metric-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.metric-chip{min-width:0;padding:8px 10px;border-radius:14px;background:rgba(15,23,42,.48);border:1px solid rgba(148,163,184,.08)}
.metric-chip .metric-value{display:block;margin-top:4px;font-size:12px}
.managed-pill{display:inline-flex;align-items:center;gap:7px;min-width:0;max-width:100%;padding:7px 10px;border-radius:14px;background:linear-gradient(135deg,rgba(79,70,229,.24),rgba(139,92,246,.18));border:1px solid rgba(129,140,248,.35)}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}
.latency-pill,.path-pill,.status-quality{display:inline-flex;align-items:center;justify-content:center;min-width:62px;padding:5px 10px;border-radius:999px;font-size:10.5px;font-weight:900;border:1px solid transparent;white-space:nowrap}
.path-pill.subtle{min-width:auto;padding:4px 10px;font-size:10px}
.path-direct{background:rgba(34,197,94,.14);color:#86efac;border-color:rgba(34,197,94,.22)}
.path-relayed{background:rgba(245,158,11,.14);color:#fcd34d;border-color:rgba(245,158,11,.22)}
.path-offline{background:rgba(239,68,68,.14);color:#fca5a5;border-color:rgba(239,68,68,.22)}
.path-pending{background:rgba(59,130,246,.14);color:#93c5fd;border-color:rgba(59,130,246,.22)}
.latency-good,.status-quality.latency-good{background:rgba(34,197,94,.12);color:#86efac;border-color:rgba(34,197,94,.2)}
.latency-warn,.status-quality.latency-warn{background:rgba(250,204,21,.12);color:#fde68a;border-color:rgba(250,204,21,.2)}
.latency-high,.status-quality.latency-high{background:rgba(249,115,22,.12);color:#fdba74;border-color:rgba(249,115,22,.2)}
.latency-unknown,.status-quality.latency-unknown{background:rgba(148,163,184,.12);color:#cbd5e1;border-color:rgba(148,163,184,.18)}
.device-status-top{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.device-status-top.refined{margin-bottom:12px}
.status-summary{font-size:11px;font-weight:800;color:#d9e7ff}
.time-stack{display:flex;flex-direction:column;gap:6px}
.time-stack.compact.refined span{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 9px;border-radius:12px;background:rgba(15,23,42,.42);border:1px solid rgba(148,163,184,.08)}
.time-stack span{font-size:10.5px;color:#94a3b8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.time-stack strong{font-size:10px;color:#8ea4c7;font-weight:900}
.time-stack em{font-style:normal;color:#f1f5f9;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.row-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.row-actions.polished{padding-inline-start:4px}
.row-btn{border:none;border-radius:13px;padding:8px 12px;font-size:11px;font-weight:900;cursor:pointer;transition:.18s ease;min-width:74px;white-space:nowrap;box-shadow:inset 0 1px 0 rgba(255,255,255,.04), 0 10px 18px rgba(2,6,23,.12)}
.row-btn.primary{background:rgba(168,85,247,.15);color:#eedbff}
.row-btn.secondary{background:rgba(20,184,166,.15);color:#99f6e4}
.row-btn.neutral{background:rgba(51,65,85,.72);color:#eef2f7}
.row-btn.ping-icon{background:linear-gradient(135deg,rgba(14,165,233,.22),rgba(34,211,238,.12));color:#bff4ff;border:1px solid rgba(34,211,238,.25);min-width:42px;padding:8px 10px;font-size:14px;line-height:1}
.row-btn.success{background:rgba(34,197,94,.16);color:#9df3b8}
.row-btn.danger{background:rgba(239,68,68,.14);color:#ffb4b4}
.row-btn.ghost{background:rgba(127,29,29,.1);border:1px solid rgba(239,68,68,.16)}
.row-btn:hover{transform:translateY(-1px);filter:brightness(1.08)}
.backup-card-pro{position:relative;overflow:hidden}
.backup-card-note{font-size:12px;line-height:1.8;color:#94a3b8}
.backup-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;border-radius:28px;background:radial-gradient(circle at top right,rgba(59,130,246,.16),transparent 32%),linear-gradient(180deg,rgba(8,15,29,.96),rgba(5,11,23,.9));}
.backup-hero-copy{max-width:760px}
.backup-hero-title{font-size:1.55rem;line-height:1.35;font-weight:900;color:#eff6ff;margin-bottom:8px}
.backup-hero-subtitle{font-size:.92rem;line-height:1.9;color:#cbd5e1}
.backup-hero-actions{display:flex;flex-direction:column;align-items:flex-end;gap:12px;min-width:260px}
.backup-hero-btn{min-width:190px}
.backup-hero-note{font-size:12px;line-height:1.8;color:#93c5fd;text-align:right}
.backup-kpi-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.backup-kpi-card{padding:18px;border-radius:22px;background:linear-gradient(180deg,rgba(15,23,42,.92),rgba(8,16,31,.88));border:1px solid rgba(148,163,184,.11)}
.backup-kpi-label{font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:#7dd3fc;font-weight:900;margin-bottom:10px}
.backup-kpi-value{font-size:1.65rem;line-height:1.2;color:#f8fafc;font-weight:900}
.backup-kpi-value-sm{font-size:1.05rem}
.backup-kpi-note{font-size:12px;line-height:1.8;color:#94a3b8;margin-top:8px}
.backup-card-head,.backup-library-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
.backup-card-kicker{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#7dd3fc;font-weight:900;margin-bottom:6px}
.backup-card-badge{display:inline-flex;align-items:center;padding:8px 12px;border-radius:999px;background:rgba(59,130,246,.14);border:1px solid rgba(96,165,250,.22);color:#bfdbfe;font-size:12px;font-weight:900}
.backup-card-badge-danger{background:rgba(248,113,113,.12);border-color:rgba(248,113,113,.2);color:#fecaca}
.backup-option-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.backup-option-chip{display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:14px;background:rgba(15,23,42,.58);border:1px solid rgba(96,165,250,.16);font-size:12px;font-weight:800;color:#dbeafe}
.backup-option-chip-danger{border-color:rgba(248,113,113,.18);color:#fecaca}
.backup-mini-note{font-size:12px;line-height:1.8;color:#cbd5e1;padding:10px 12px;border-radius:16px;background:rgba(15,23,42,.52);border:1px solid rgba(148,163,184,.1)}
.backup-restore-note-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
.backup-restore-hint{font-size:12px;font-weight:800;color:#fecaca;padding:10px 12px;border-radius:16px;background:rgba(127,29,29,.22);border:1px solid rgba(248,113,113,.18)}
.backup-action-row{display:flex;gap:10px;flex-wrap:wrap}
.backup-secondary-btn{border-radius:14px;padding:11px 14px;font-size:12px;font-weight:900}
.backup-library-card{border-radius:24px}
.backup-name-cell{display:flex;flex-direction:column;gap:6px}
.backup-name-title{font-weight:900;color:#dbeafe;word-break:break-word}
.backup-name-sub{font-size:12px;color:#64748b}
.backup-badge-stack{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap}
.backup-badge{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;background:rgba(30,41,59,.92);border:1px solid rgba(148,163,184,.12);font-size:11px;font-weight:900;color:#e2e8f0}
.backup-badge-db{background:rgba(59,130,246,.12);border-color:rgba(96,165,250,.22);color:#bfdbfe}
.backup-badge-wg{background:rgba(20,184,166,.12);border-color:rgba(45,212,191,.2);color:#99f6e4}
.backup-badge-sys{background:rgba(234,179,8,.12);border-color:rgba(250,204,21,.2);color:#fde68a}
.backup-actions-inline{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap}
.backup-table-btn{display:inline-flex;align-items:center;justify-content:center;padding:8px 12px;border-radius:12px;font-size:12px;font-weight:900;transition:.2s ease;border:1px solid transparent}
.backup-table-btn-download{background:rgba(34,197,94,.12);color:#86efac;border-color:rgba(34,197,94,.18)}
.backup-table-btn-restore{background:rgba(245,158,11,.12);color:#fcd34d;border-color:rgba(245,158,11,.18)}
.backup-table-btn-delete{background:rgba(239,68,68,.12);color:#fda4af;border-color:rgba(239,68,68,.18)}
.backup-table-btn:hover{transform:translateY(-1px);filter:brightness(1.07)}
.backup-table thead th{white-space:nowrap}
@media (max-width: 1480px){.device-row{grid-template-columns:minmax(240px,1.2fr) minmax(250px,1.1fr) minmax(220px,1fr) auto}}
@media (max-width: 1260px){.device-row{grid-template-columns:minmax(220px,1fr) minmax(240px,1fr) minmax(210px,1fr)}.cell-actions{grid-column:1/-1}.row-actions{justify-content:flex-start}.backup-option-grid{grid-template-columns:1fr}.backup-kpi-grid{grid-template-columns:1fr}.backup-hero{flex-direction:column}.backup-hero-actions{align-items:flex-start;min-width:0;width:100%}}
@media (max-width: 980px){.device-title-row{flex-wrap:wrap}.device-metric-grid{grid-template-columns:1fr}.device-subtitle{white-space:normal}.time-stack.compact.refined span{padding:6px 8px}}
@media (max-width: 760px){.device-row{grid-template-columns:1fr;padding:12px}.cell-actions{grid-column:auto}.row-actions{justify-content:stretch}.row-btn{flex:1 1 calc(50% - 8px);min-width:0}.backup-option-grid{grid-template-columns:1fr}.device-status-top{align-items:flex-start}.time-stack.compact.refined span{flex-direction:column;align-items:flex-start}.backup-card-head,.backup-library-head,.backup-restore-note-row{flex-direction:column;align-items:flex-start}.backup-action-row,.backup-actions-inline{width:100%}.backup-action-row > *,.backup-actions-inline > *{flex:1 1 100%}.backup-table-btn{width:100%}}


.quick-client-note{font-size:13px;line-height:1.9;color:#cbd5e1;text-align:center;max-width:320px;}


.quick-client-intro{display:flex;flex-direction:column;gap:8px;min-width:0;}
.quick-client-meta-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px;}
.quick-client-meta-pill{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:rgba(15,23,42,.62);border:1px solid rgba(148,163,184,.14);color:#cbd5e1;font-size:.75rem;font-weight:800;}
.quick-client-meta-pill i{color:#67e8f9;}
.quick-client-head-actions{justify-content:flex-end;}
.quick-client-shell{border-radius:24px;padding:22px;}
.quick-client-title{font-size:1.18rem;letter-spacing:.01em;}
.quick-client-subtitle{font-size:.88rem;max-width:760px;}
.quick-client-grid{grid-template-columns:minmax(0,1.45fr) minmax(300px,.85fr);gap:20px;}
.quick-client-form,.quick-client-qr-panel{position:relative;}
.quick-client-form{padding:18px;border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(15,23,42,.18));border:1px solid rgba(148,163,184,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.04);}
.quick-client-form-grid{gap:16px;}
.quick-client-label{font-size:11px;letter-spacing:.04em;text-transform:uppercase;}
.quick-client-output{display:flex;flex-direction:column;gap:8px;}
.quick-client-output-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;}
.quick-client-file-hint{font-size:.76rem;color:#7dd3fc;font-weight:800;padding:6px 10px;border-radius:999px;background:rgba(34,211,238,.10);border:1px solid rgba(34,211,238,.18);}
.quick-client-qr-panel{padding:18px;gap:16px;background:linear-gradient(180deg,rgba(5,16,28,.76),rgba(2,10,20,.58));box-shadow:inset 0 1px 0 rgba(255,255,255,.04);}
.quick-client-qr-head{font-size:12px;letter-spacing:.12em;color:#e2e8f0;}
.quick-client-qr-box-wrap{padding:22px;min-height:386px;background:radial-gradient(circle at top, rgba(34,211,238,.14), rgba(15,23,42,.14) 48%, rgba(15,23,42,.24));}
.quick-client-qr-box{width:328px;min-height:328px;border-radius:26px;padding:18px;box-shadow:0 20px 45px rgba(2,8,23,.32);}
.quick-client-qr-box img,.quick-client-qr-box canvas{border-radius:16px;}
.quick-client-note{max-width:320px;font-size:.82rem;color:#cbd5e1;line-height:1.9;}
.quick-client-shell.compact::after{content:"القسم مطوي لتوفير المساحة. اضغط إظهار القسم لفتح النموذج وQR.";}
@media (max-width: 900px){
  .quick-client-shell{padding:18px;}
  .quick-client-grid{grid-template-columns:1fr;}
  .quick-client-qr-box-wrap{min-height:330px;}
  .quick-client-qr-box{width:292px;min-height:292px;}
}


/* Patch: network header and summary polish */
.net-header-shell {
  align-items: stretch;
  padding: 18px 20px;
  border-radius: 22px;
  background:
    linear-gradient(160deg, rgba(8,15,32,.92), rgba(14,28,49,.88) 58%, rgba(10,18,34,.92)),
    radial-gradient(circle at 85% 18%, rgba(56,189,248,.08), transparent 28%);
}
.net-header-main {
  flex: 1 1 560px;
  align-items: stretch;
}
.net-header-copy-block {
  display:flex;
  flex-direction:column;
  gap:10px;
  min-width: min(100%, 560px);
}
.net-header-title-row {
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.net-header-inline-pill {
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:0 12px;
  border-radius:999px;
  border:1px solid rgba(45,212,191,.18);
  background:linear-gradient(180deg, rgba(20,184,166,.12), rgba(15,23,42,.2));
  color:#99f6e4;
  font-size:12px;
  font-weight:800;
  letter-spacing:.02em;
}
.net-header-meta-line {
  color:#94a3b8;
  font-size:12px;
  font-weight:700;
}
.net-header-pills {
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.net-header-pill {
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:38px;
  padding:0 12px;
  border-radius:14px;
  border:1px solid rgba(148,163,184,.10);
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(2,6,23,.18));
}
.net-header-pill-label {
  color:#94a3b8;
  font-size:11px;
  font-weight:800;
}
.net-header-pill-value {
  color:#f8fafc;
  font-size:12px;
  font-weight:900;
}
.net-header-actions {
  align-items:flex-start;
  justify-content:flex-end;
  flex: 0 1 360px;
}
.net-header-actions .action-btn {
  min-width:116px;
}
.network-kpi-grid {
  display:grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap:12px;
}
.network-kpi-card {
  position:relative;
  overflow:hidden;
  min-height:84px;
  padding:14px 16px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.06);
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(15,23,42,.30));
  box-shadow:0 14px 34px rgba(2,6,23,.20), inset 0 1px 0 rgba(255,255,255,.04);
}
.network-kpi-card::after {
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:3px;
  background:linear-gradient(180deg, rgba(34,211,238,.85), transparent);
  opacity:.9;
}
.network-kpi-label {
  color:#94a3b8;
  font-size:11px;
  font-weight:800;
  margin-bottom:8px;
}
.network-kpi-value {
  color:#f8fafc;
  font-size:26px;
  line-height:1;
  font-weight:900;
}
.network-kpi-tone-0::after { background:linear-gradient(180deg, #38bdf8, transparent); }
.network-kpi-tone-1::after { background:linear-gradient(180deg, #22c55e, transparent); }
.network-kpi-tone-2::after { background:linear-gradient(180deg, #14b8a6, transparent); }
.network-kpi-tone-3::after { background:linear-gradient(180deg, #a78bfa, transparent); }
.network-kpi-tone-4::after { background:linear-gradient(180deg, #fb7185, transparent); }
.network-kpi-tone-5::after { background:linear-gradient(180deg, #f59e0b, transparent); }
.network-summary-head {
  margin-bottom:16px;
}
.network-summary-actions .action-btn {
  min-width:108px;
}
@media (max-width: 1280px) {
  .network-kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 820px) {
  .net-header-shell { padding:14px; }
  .net-header-main { flex-basis:100%; }
  .net-header-actions { flex-basis:100%; justify-content:stretch; }
  .net-header-actions .action-btn { flex:1 1 calc(50% - 8px); min-width:0; }
  .network-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .net-header-title-row { align-items:flex-start; }
  .net-header-inline-pill { min-height:28px; font-size:11px; }
  .net-header-pill { flex:1 1 calc(50% - 8px); min-width:0; }
  .network-kpi-grid { grid-template-columns: 1fr; }
}

/* settings polish v3 */
.settings-hero-note {
  max-width: 720px;
  color: #94a3b8;
  font-size: 13px;
  line-height: 1.8;
}
.settings-quick-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}
.settings-quick-card {
  padding: 16px 18px;
  border-radius: 20px;
  border: 1px solid rgba(148,163,184,.12);
  background: linear-gradient(180deg, rgba(15,23,42,.86), rgba(2,6,23,.74));
  box-shadow: 0 18px 42px rgba(2,6,23,.18), inset 0 1px 0 rgba(255,255,255,.03);
}
.settings-quick-card strong {
  display:block;
  color:#f8fafc;
  font-size:15px;
  font-weight:900;
  margin-bottom:6px;
}
.settings-quick-card p {
  margin:0;
  color:#94a3b8;
  font-size:12px;
  line-height:1.8;
}
.settings-quick-kicker {
  display:inline-flex;
  align-items:center;
  padding:4px 10px;
  border-radius:999px;
  margin-bottom:10px;
  color:#cbd5e1;
  background:rgba(15,23,42,.7);
  border:1px solid rgba(148,163,184,.14);
  font-size:10px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.settings-quick-card-danger {
  border-color: rgba(239,68,68,.18);
  background: linear-gradient(180deg, rgba(32,12,18,.88), rgba(17,4,9,.78));
}
.settings-stack-card-elevated {
  position: relative;
  overflow: hidden;
  border-radius: 26px;
  border: 1px solid rgba(148,163,184,.12);
  background: linear-gradient(180deg, rgba(11,17,32,.96), rgba(2,6,23,.92));
  box-shadow: 0 22px 52px rgba(2,6,23,.22), inset 0 1px 0 rgba(255,255,255,.03);
}
.settings-stack-card-elevated::after {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: linear-gradient(180deg, rgba(56,189,248,.86), transparent 70%);
  opacity: .85;
}
.settings-stack-card-danger::after {
  background: linear-gradient(180deg, rgba(244,63,94,.9), transparent 72%);
}
.settings-panel-head {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.settings-panel-note {
  color:#94a3b8;
  font-size:12px;
  line-height:1.8;
}
.settings-mini-badge {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.14);
  background:rgba(15,23,42,.72);
  color:#e2e8f0;
  font-size:10px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  white-space:nowrap;
}
.settings-mini-badge-blue { color:#7dd3fc; border-color:rgba(56,189,248,.18); }
.settings-mini-badge-indigo { color:#a5b4fc; border-color:rgba(129,140,248,.18); }
.settings-mini-badge-amber { color:#fcd34d; border-color:rgba(245,158,11,.2); }
.section-chip-danger {
  background: rgba(127,29,29,.45);
  color:#fecaca;
  border-color: rgba(248,113,113,.16);
}
.sa-unlock-shell {
  background: linear-gradient(180deg, rgba(15,23,42,.96), rgba(7,11,22,.92));
  box-shadow: 0 26px 56px rgba(2,6,23,.26), inset 0 1px 0 rgba(255,255,255,.03);
}
@media (max-width: 1280px) {
  .settings-quick-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .settings-quick-strip { grid-template-columns: 1fr; }
  .settings-panel-head { flex-direction: column; }
}

/* === Professional polish for network summary + quick client === */
.network-summary-shell.pro-shell,
.quick-client-shell.pro-shell{
  position:relative;
  overflow:hidden;
  background:linear-gradient(180deg,rgba(4,10,24,.94),rgba(6,14,30,.9));
  border-radius:28px;
}
.network-summary-shell.pro-shell::before,
.quick-client-shell.pro-shell::before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at top right,rgba(34,211,238,.09),transparent 36%), radial-gradient(circle at bottom left,rgba(245,158,11,.06),transparent 30%);
  pointer-events:none;
}
.network-summary-subtitle{
  margin:6px 0 0;
  max-width:760px;
  color:#94a3b8;
  font-size:.88rem;
  line-height:1.8;
}
.network-quick-card.pro-card{
  grid-template-columns:minmax(0,1.45fr) minmax(320px,.9fr);
  gap:18px;
  align-items:stretch;
}
.network-quick-main{display:flex;flex-direction:column;gap:16px;min-width:0;}
.network-hero-panel{
  padding:18px 20px;
  border-radius:22px;
  border:1px solid rgba(125,211,252,.12);
  background:linear-gradient(180deg,rgba(15,23,42,.62),rgba(2,8,23,.38));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.network-hero-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;}
.network-hero-eyebrow{font-size:.72rem;color:#7dd3fc;font-weight:900;letter-spacing:.12em;text-transform:uppercase;}
.network-hero-title{font-size:1.45rem;font-weight:900;color:#f8fafc;line-height:1.25;}
.network-hero-badges{display:flex;flex-wrap:wrap;gap:10px;}
.network-hero-badge{display:inline-flex;flex-direction:column;gap:4px;padding:10px 14px;border-radius:16px;background:rgba(15,23,42,.72);border:1px solid rgba(148,163,184,.12);min-width:118px;}
.network-hero-badge span{font-size:.68rem;color:#94a3b8;font-weight:800;}
.network-hero-badge strong{font-size:.96rem;color:#f8fafc;font-weight:900;}
.network-hero-endpoint{margin-top:14px;display:flex;flex-direction:column;gap:6px;padding:12px 14px;border-radius:18px;background:rgba(3,10,24,.72);border:1px solid rgba(148,163,184,.12);}
.network-hero-endpoint-label{font-size:.72rem;color:#94a3b8;font-weight:800;}
.network-hero-endpoint strong{color:#e2e8f0;font-size:.96rem;word-break:break-word;}
.network-quick-grid-pro{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
.network-bundle-preview{min-height:170px !important;line-height:1.65;resize:vertical;}
.network-quick-qr-pro{padding:18px;justify-content:flex-start;align-items:stretch;gap:14px;border-style:solid;}
.network-quick-qr-top{display:flex;flex-direction:column;gap:8px;z-index:2;position:relative;}
.qr-shell-pro{display:flex;align-items:center;justify-content:center;min-height:360px;padding:22px;border-radius:24px;background:radial-gradient(circle at top,rgba(34,211,238,.12),rgba(15,23,42,.08) 48%,rgba(15,23,42,.26));border:1px solid rgba(148,163,184,.14);}
.qr-hint-text{font-size:.82rem;line-height:1.8;color:#cbd5e1;}
.qr-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;width:100%;height:100%;min-height:250px;padding:18px;text-align:center;color:#cbd5e1;}
.qr-placeholder-icon{width:64px;height:64px;border-radius:18px;display:grid;place-items:center;background:rgba(15,23,42,.8);border:1px solid rgba(148,163,184,.16);font-weight:900;color:#7dd3fc;letter-spacing:.08em;}
.qr-placeholder-text{max-width:240px;font-size:.84rem;line-height:1.8;}
.qr-placeholder-danger .qr-placeholder-icon{color:#fda4af;border-color:rgba(251,113,133,.24);}
.quick-client-grid-pro{grid-template-columns:minmax(0,1.3fr) minmax(320px,.92fr);gap:20px;}
.quick-client-form{min-height:100%;}
.quick-client-output textarea{border-radius:18px;line-height:1.65;}
.quick-client-qr-panel-pro{justify-content:flex-start;align-items:stretch;}
.quick-client-qr-box-wrap-pro{display:flex;align-items:center;justify-content:center;min-height:380px;padding:22px;border-radius:24px;background:radial-gradient(circle at top,rgba(34,211,238,.14),rgba(15,23,42,.12) 52%,rgba(15,23,42,.24));border:1px solid rgba(148,163,184,.14);}
.quick-client-qr-box{position:relative;overflow:hidden;}
.quick-client-note{max-width:none;}
@media (max-width: 1180px){
  .network-quick-card.pro-card,
  .quick-client-grid-pro{grid-template-columns:1fr;}
}
@media (max-width: 720px){
  .network-hero-title{font-size:1.18rem;}
  .network-quick-grid-pro{grid-template-columns:1fr;}
  .network-quick-item-span{grid-column:span 1;}
  .network-hero-badges{width:100%;}
  .network-hero-badge{flex:1 1 140px;}
  .qr-shell-pro,
  .quick-client-qr-box-wrap-pro{min-height:320px;padding:16px;}
}

/* === Focused refinement for network summary + live client preview === */
#netQuickInviteUrlValue,
#netQuickPubValue,
#netQuickEndpointValue {
  white-space: normal;
  overflow: visible;
  text-overflow: initial;
  overflow-wrap: anywhere;
  line-height: 1.65;
}
#netQuickDnsValue,
#netQuickRangeValue {
  font-size: .92rem;
}
.network-bundle-preview {
  background: linear-gradient(180deg, rgba(2,6,23,.86), rgba(3,10,24,.72));
}
.quick-client-output-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
#quickClientConfig {
  background: linear-gradient(180deg, rgba(2,6,23,.92), rgba(3,10,24,.78));
}

.btn-primary.is-busy, .action-btn.is-busy, #bulkImportBtn.is-busy, #applyPolicyBtn.is-busy, #createNetworkBtn.is-busy, #quickClientBtn.is-busy, #netSettingsSaveBtn.is-busy, #netSettingsUpdateBaseBtn.is-busy, #netSettingsAdvancedSaveBtn.is-busy { opacity: .75; cursor: wait; filter: saturate(.85); }


/* QR download-only mode: hide QR image from screen and keep download buttons */
.qr-download-card .qr-shell-pro,
.qr-download-card .quick-client-qr-box-wrap,
.qr-download-card .network-quick-qr-box,
.qr-download-card .quick-client-qr-box{
  display:none !important;
}
.qr-download-panel{
  position:relative;
  z-index:2;
  min-height:250px;
  border-radius:24px;
  border:1px solid rgba(148,163,184,.16);
  background:radial-gradient(circle at top, rgba(34,211,238,.12), rgba(15,23,42,.18) 55%, rgba(2,6,23,.35));
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:14px;
  padding:26px;
  text-align:center;
}
.qr-download-icon{
  width:78px;
  height:78px;
  border-radius:24px;
  display:grid;
  place-items:center;
  background:rgba(15,23,42,.76);
  border:1px solid rgba(148,163,184,.18);
  color:#7dd3fc;
  font-size:30px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04), 0 18px 42px rgba(2,8,23,.26);
}
.qr-download-text{
  max-width:330px;
  color:#cbd5e1;
  font-size:.9rem;
  line-height:1.9;
}
.qr-download-btn{
  width:min(100%, 260px);
  justify-content:center;
  text-align:center;
}
.qr-download-btn:disabled{
  filter:grayscale(.35);
  pointer-events:none;
}
.quick-client-qr-download-panel{min-height:320px;}

/* v62: default-collapsed professional sections */
.network-quick-card.compact{display:none !important;}
.quick-client-shell.compact .quick-client-grid{display:none !important;}
.quick-client-shell.compact .quick-client-meta-row,
.quick-client-shell.compact .quick-client-subtitle,
.quick-client-shell.compact .quick-client-head-actions > :not(#quickClientToggleBtn){display:none !important;}
.quick-client-shell.compact{padding:16px 18px !important;}
.quick-client-shell.compact .quick-client-head{margin-bottom:0 !important;}
.quick-client-shell.compact::after{content:"القسم مطوي لتوفير المساحة. اضغط إظهار القسم لفتح نموذج العميل وQR.";display:block;margin-top:10px;padding:10px 12px;border-radius:14px;background:rgba(15,23,42,.48);border:1px solid rgba(148,163,184,.12);color:#93c5fd;font-size:.82rem;line-height:1.8;}


/* Patch V80: login persistence + virtual device list */
.login-remember-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 14px 0;flex-wrap:wrap;color:#cbd5e1;font-size:13px}
.login-remember-check{display:inline-flex;align-items:center;gap:8px;cursor:pointer;user-select:none}
.login-remember-check input{width:16px;height:16px;accent-color:#38bdf8}
.login-remember-check.muted{color:#94a3b8}
.device-virtual-viewport{position:relative;width:100%;contain:layout paint}
.device-virtual-spacer{position:relative;width:100%;min-height:1px}
.device-row.device-virtual-row{position:absolute;left:0;right:0;margin-bottom:0;will-change:transform}
.device-virtual-note{font-size:12px;color:#94a3b8;margin:0 0 10px 0;text-align:center}

/* V95 Unified Growth Hub */
.growth-hub-view { animation: fadeIn .18s ease-out; }
.growth-hero-card { background: radial-gradient(circle at top right, rgba(211,158,82,.18), transparent 38%), linear-gradient(180deg, rgba(15,23,42,.94), rgba(2,6,23,.96)); }
.growth-tabs .tab-btn { border: 1px solid rgba(148,163,184,.18); background: rgba(15,23,42,.72); color: #cbd5e1; border-radius: 999px; padding: 10px 14px; font-weight: 800; }
.growth-tabs .tab-btn.active { border-color: rgba(211,158,82,.55); color: #fff; background: rgba(211,158,82,.16); box-shadow: 0 10px 32px rgba(211,158,82,.08); }
.growth-table { width: 100%; border-collapse: separate; border-spacing: 0 8px; font-size: 13px; }
.growth-table th { color: #94a3b8; font-size: 11px; text-align: start; padding: 8px 10px; text-transform: uppercase; letter-spacing: .08em; }
.growth-table td { background: rgba(2,6,23,.72); border-top: 1px solid rgba(148,163,184,.12); border-bottom: 1px solid rgba(148,163,184,.12); padding: 10px; color: #dbeafe; }
.growth-table tr td:first-child { border-inline-start: 1px solid rgba(148,163,184,.12); border-radius: 14px 0 0 14px; }
.growth-table tr td:last-child { border-inline-end: 1px solid rgba(148,163,184,.12); border-radius: 0 14px 14px 0; }
[dir="rtl"] .growth-table tr td:first-child { border-radius: 0 14px 14px 0; }
[dir="rtl"] .growth-table tr td:last-child { border-radius: 14px 0 0 14px; }
.growth-stat { min-height: 112px; }
.growth-topology-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; }
.growth-node { border: 1px solid rgba(148,163,184,.16); background: rgba(2,6,23,.75); border-radius: 18px; padding: 14px; color: #f8fafc; box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
.growth-node small { display: block; margin-top: 6px; color: #94a3b8; font-size: 11px; }
.growth-node.server { border-color: rgba(34,197,94,.35); }
.growth-node.network { border-color: rgba(211,158,82,.35); }
.growth-node.router { border-color: rgba(59,130,246,.35); }


/* V97 Networks Command Center */
#view-networks .networks-toolbar {
  border-radius: 28px;
  border: 1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(circle at 8% 0%, color-mix(in srgb, var(--brand-accent) 20%, transparent), transparent 32%),
    linear-gradient(145deg, rgba(15,23,42,.88), rgba(2,6,23,.72));
}
#networksCardsArea {
  display: flex;
  flex-direction: column;
  gap: 18px !important;
}
.networks-command-panel {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 28px;
  padding: 20px;
  background:
    radial-gradient(circle at 10% 0%, color-mix(in srgb, var(--brand-accent) 18%, transparent), transparent 32%),
    linear-gradient(145deg, rgba(15,23,42,.84), rgba(2,6,23,.64));
  box-shadow: 0 24px 60px rgba(2,6,23,.28);
}
.networks-command-panel::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  background: linear-gradient(180deg, var(--brand-accent-soft), transparent);
}
.networks-command-head {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}
.networks-command-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--brand-accent-soft);
  font-size: 11px;
  font-weight: 1000;
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.networks-command-head h2 {
  margin: 0;
  color: #f8fafc;
  font-size: clamp(20px, 2vw, 30px);
  font-weight: 1000;
}
.networks-command-head p {
  color: #94a3b8;
  font-size: 13px;
  margin: 6px 0 0;
}
.networks-refresh-btn {
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 16px;
  background: rgba(255,255,255,.05);
  color: #e2e8f0;
  padding: 11px 16px;
  font-weight: 900;
  cursor: pointer;
}
.networks-refresh-btn:hover { background: rgba(255,255,255,.09); }
.networks-kpi-grid {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 12px;
  margin-bottom: 16px;
}
.networks-kpi-card {
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 20px;
  padding: 14px;
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(2,6,23,.22));
}
.networks-kpi-card span,
.networks-kpi-card small {
  display: block;
  color: #94a3b8;
  font-size: 11px;
  font-weight: 800;
}
.networks-kpi-card strong {
  display: block;
  color: #f8fafc;
  font-size: 26px;
  font-weight: 1000;
  line-height: 1.15;
  margin: 4px 0;
}
.networks-kpi-card.good strong { color: #34d399; }
.networks-kpi-card.warn strong { color: #fbbf24; }
.networks-kpi-card.critical strong { color: #fb7185; }
.networks-filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  position: relative;
}
.networks-filter-chip {
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 999px;
  background: rgba(255,255,255,.045);
  color: #cbd5e1;
  padding: 8px 12px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-weight: 900;
  cursor: pointer;
}
.networks-filter-chip strong {
  color: #f8fafc;
  font-size: 12px;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.07);
}
.networks-filter-chip.active {
  border-color: color-mix(in srgb, var(--brand-accent) 42%, rgba(255,255,255,.14));
  background: color-mix(in srgb, var(--brand-accent) 18%, rgba(255,255,255,.04));
  color: #fff;
}
.networks-filter-chip.good strong { color: #34d399; }
.networks-filter-chip.warn strong { color: #fbbf24; }
.networks-filter-chip.critical strong { color: #fb7185; }
.networks-search-note {
  margin-top: 12px;
  color: #94a3b8;
  font-size: 12px;
  font-weight: 800;
}
.networks-command-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 18px;
}
.network-command-card {
  --net-accent: #f43f5e;
  position: relative;
  overflow: hidden;
  min-height: 260px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 30px;
  padding: 18px;
  cursor: pointer;
  background:
    radial-gradient(circle at 5% 0%, color-mix(in srgb, var(--net-accent) 20%, transparent), transparent 34%),
    linear-gradient(145deg, rgba(15,23,42,.82), rgba(2,6,23,.72));
  box-shadow: 0 22px 54px rgba(2,6,23,.28);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.network-command-card.good { --net-accent: #22c55e; }
.network-command-card.watch { --net-accent: #f59e0b; }
.network-command-card.critical { --net-accent: #f43f5e; }
.network-command-card.empty { --net-accent: #94a3b8; }
.network-command-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  background: linear-gradient(180deg, var(--net-accent), transparent);
}
.network-command-card:hover,
.network-command-card:focus-visible {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--net-accent) 38%, rgba(255,255,255,.12));
  box-shadow: 0 28px 72px rgba(2,6,23,.38);
  outline: none;
}
.network-command-card-main { position: relative; }
.network-command-title-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 16px;
}
.network-name-block {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  min-width: 0;
}
.network-name-block h3 {
  margin: 0;
  color: #f8fafc;
  font-size: 20px;
  font-weight: 1000;
}
.network-name-block p {
  margin: 4px 0 0;
  color: #94a3b8;
  font-size: 12px;
  line-height: 1.6;
  max-width: 42ch;
}
.network-status-dot {
  width: 13px;
  height: 13px;
  border-radius: 999px;
  margin-top: 7px;
  background: var(--net-accent);
  box-shadow: 0 0 0 6px color-mix(in srgb, var(--net-accent) 13%, transparent);
  flex: 0 0 auto;
}
.network-tier-badge {
  border: 1px solid color-mix(in srgb, var(--net-accent) 34%, rgba(255,255,255,.08));
  background: color-mix(in srgb, var(--net-accent) 15%, transparent);
  color: #fff;
  border-radius: 999px;
  padding: 7px 12px;
  font-size: 11px;
  font-weight: 1000;
  white-space: nowrap;
}
.network-card-metrics {
  display: grid;
  grid-template-columns: 108px repeat(3, minmax(0,1fr));
  gap: 10px;
  align-items: stretch;
}
.network-health-ring {
  --ring-bg: rgba(255,255,255,.08);
  width: 96px;
  height: 96px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  margin-inline: auto;
  background: conic-gradient(var(--net-accent) calc(var(--score) * 1%), var(--ring-bg) 0);
  position: relative;
}
.network-health-ring::after {
  content: "";
  position: absolute;
  inset: 9px;
  border-radius: 50%;
  background: #07111f;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
.network-health-ring strong,
.network-health-ring span { position: relative; z-index: 1; display: block; text-align: center; }
.network-health-ring strong { color: #f8fafc; font-size: 25px; font-weight: 1000; line-height: 1; }
.network-health-ring span { color: #94a3b8; font-size: 10px; font-weight: 900; margin-top: 4px; }
.network-metric {
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 18px;
  background: rgba(255,255,255,.035);
  padding: 13px 10px;
  text-align: center;
  display: grid;
  align-content: center;
}
.network-metric span { color: #94a3b8; font-size: 11px; font-weight: 900; }
.network-metric strong { color: #f8fafc; font-size: 24px; font-weight: 1000; }
.network-metric.danger strong { color: #fb7185; }
.network-progress-line {
  height: 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.07);
  overflow: hidden;
  margin: 15px 0;
}
.network-progress-line i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--net-accent), color-mix(in srgb, var(--net-accent) 45%, white));
}
.network-detail-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 9px;
}
.network-detail-grid div {
  border: 1px solid rgba(255,255,255,.06);
  background: rgba(2,6,23,.22);
  border-radius: 14px;
  padding: 10px;
  min-width: 0;
}
.network-detail-grid span { display: block; color: #64748b; font-size: 10px; font-weight: 900; margin-bottom: 4px; }
.network-detail-grid strong { display: block; color: #cbd5e1; font-size: 12px; font-weight: 900; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; direction: ltr; text-align: right; }
.network-card-footer {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 16px;
}
.network-card-note { color: #94a3b8; font-size: 12px; font-weight: 900; }
.network-card-actions { display: flex; gap: 9px; flex-wrap: wrap; justify-content: flex-end; }
.network-card-open,
.network-card-copy {
  border: 0;
  border-radius: 15px;
  min-height: 40px;
  padding: 0 16px;
  font-weight: 1000;
  cursor: pointer;
}
.network-card-open {
  background: linear-gradient(135deg, var(--brand-accent), var(--brand-accent-soft));
  color: #111827;
  box-shadow: 0 14px 28px color-mix(in srgb, var(--brand-accent) 25%, transparent);
}
.network-card-copy {
  border: 1px solid rgba(255,255,255,.09);
  background: rgba(255,255,255,.045);
  color: #e2e8f0;
}
.network-card-copy:hover { background: rgba(255,255,255,.08); }
.networks-empty-state {
  border: 1px dashed rgba(255,255,255,.14);
  border-radius: 24px;
  padding: 32px;
  text-align: center;
  color: #94a3b8;
  background: rgba(255,255,255,.03);
}
.networks-empty-state strong { display: block; color: #f8fafc; font-size: 18px; margin-bottom: 6px; }
.networks-empty-state span { display: block; font-size: 13px; }
@media (max-width: 1180px) {
  .networks-command-grid { grid-template-columns: 1fr; }
}
@media (max-width: 860px) {
  .networks-kpi-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .network-card-metrics { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .network-health-ring { grid-column: 1 / -1; }
  .network-detail-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .network-card-footer, .networks-command-head { align-items: stretch; flex-direction: column; }
  .network-card-actions, .networks-command-actions { justify-content: stretch; }
  .network-card-actions > button, .networks-command-actions > button { flex: 1 1 120px; }
}
@media (max-width: 560px) {
  .networks-kpi-grid, .network-detail-grid { grid-template-columns: 1fr; }
  .network-card-metrics { grid-template-columns: 1fr; }
  .network-command-card, .networks-command-panel { border-radius: 22px; padding: 14px; }
}

/* V98 Combined UI - login enhancements */
.login-trust-strip{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
.login-trust-pill{display:inline-flex;align-items:center;justify-content:center;padding:8px 14px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.09);color:#f8fafc;font-size:12px;font-weight:900;letter-spacing:.02em}
.login-kpi-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.login-kpi-card{padding:16px 16px 15px;border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.login-kpi-card strong{display:block;color:#fff;font-size:16px;font-weight:900;margin-bottom:6px}
.login-kpi-card span{display:block;color:#cbd5e1;font-size:13px;line-height:1.6}
.login-flow-strip{display:grid;gap:10px}
.login-flow-step{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border-radius:18px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.07)}
.login-flow-step>span{display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:32px;border-radius:999px;background:linear-gradient(180deg,#f0d48a,#c9a44d);color:#111827;font-size:13px;font-weight:900;box-shadow:0 8px 18px rgba(201,164,77,.28)}
.login-flow-step strong{display:block;color:#fff;font-size:14px;font-weight:900;margin-bottom:3px}
.login-flow-step p{margin:0;color:#cbd5e1;font-size:12px;line-height:1.6}
.login-actions-hint{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.login-actions-hint-item{padding:12px 14px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);text-align:right}
.login-actions-hint-item strong{display:block;color:#fff;font-size:13px;font-weight:900;margin-bottom:4px}
.login-actions-hint-item span{display:block;color:#cbd5e1;font-size:12px;line-height:1.5}
.login-help-card{padding:16px;border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.025));border:1px solid rgba(255,255,255,.08)}
.login-help-card-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px}
.login-help-card-head strong{color:#fff;font-size:15px;font-weight:900}
.login-help-card-head span{color:#94a3b8;font-size:12px}
.login-mini-list{margin:0;padding:0 18px 0 0;color:#cbd5e1;font-size:13px;line-height:1.9}
.login-mini-list li{margin:0 0 4px}
.login-mini-list strong{color:#fff}
@media (max-width: 1024px){
  .login-kpi-grid,.login-actions-hint{grid-template-columns:1fr}
}
@media (max-width: 640px){
  .login-trust-strip{gap:8px}
  .login-trust-pill{font-size:11px;padding:7px 12px}
  .login-flow-step{padding:12px 14px}
}


/* V99 visible fixes - clean login + forced networks UI */
.login-clean-shell .login-frame,
.login-clean-shell .login-brand-panel,
.login-clean-shell .login-card-pro{display:none!important}
.login-clean-frame{position:relative;z-index:2;width:min(1180px,100%);display:grid;grid-template-columns:1fr 430px;gap:22px;direction:rtl}
.login-clean-brand,.login-clean-card{border:1px solid rgba(240,212,138,.18);background:linear-gradient(145deg,rgba(15,23,42,.92),rgba(2,6,23,.86));box-shadow:0 28px 80px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.05);border-radius:28px;padding:34px;overflow:hidden;position:relative}
.login-clean-brand:before{content:"";position:absolute;inset:auto -80px -90px auto;width:280px;height:280px;border-radius:999px;background:radial-gradient(circle,rgba(240,212,138,.18),transparent 70%)}
.login-clean-logo-card{width:132px;height:132px;border-radius:28px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;margin-bottom:20px;box-shadow:0 18px 45px rgba(0,0,0,.28)}
.login-clean-logo-card img{max-width:92px;max-height:92px;object-fit:contain}
.login-clean-badge{display:inline-flex;padding:8px 14px;border-radius:999px;background:rgba(240,212,138,.12);border:1px solid rgba(240,212,138,.22);color:#f8e6ad;font-size:12px;font-weight:900}
.login-clean-brand h1{margin:18px 0 10px;color:#fff;font-size:48px;line-height:1.1;font-weight:1000}
.login-clean-brand p{max-width:560px;color:#aebbd0;line-height:1.9;font-size:17px;margin:0}
.login-clean-points{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.login-clean-points span{padding:10px 16px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);font-weight:900;color:#f8fafc}
.login-clean-footer{margin-top:34px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.login-clean-footer>div{background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.07);border-radius:18px;padding:16px}
.login-clean-footer span{display:block;color:#7d8ba3;font-size:12px;margin-bottom:5px}
.login-clean-footer strong{display:block;color:#fff;font-size:15px}
.login-clean-card{padding:30px}
.login-clean-card-head{display:flex;align-items:center;gap:14px;margin-bottom:22px;text-align:right}
.login-clean-card-head img{width:58px;height:58px;border-radius:16px;object-fit:contain;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);padding:8px}
.login-clean-card-head h2{margin:0 0 5px;color:#fff;font-size:28px;font-weight:1000}
.login-clean-card-head p{margin:0;color:#94a3b8;font-size:14px}
.login-save-box{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;align-items:center;margin:14px 0 16px}
.login-save-box label{display:flex;align-items:center;justify-content:center;gap:8px;min-height:42px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);color:#dbeafe;font-size:12px;font-weight:900;cursor:pointer}
.login-save-box input{accent-color:#d8b75c}
.login-save-box button{min-height:42px;border-radius:14px;border:1px solid rgba(240,212,138,.28);background:rgba(240,212,138,.14);color:#f8e6ad;font-weight:1000;padding:0 14px;cursor:pointer}
.login-save-box button:hover{background:rgba(240,212,138,.22)}
.login-clean-note{margin:14px 0 0;color:#8fa0b8;text-align:center;font-size:12px;line-height:1.7}
.login-clean-card .login-submit small{display:none}
.login-clean-card .login-submit{font-size:17px}
@media(max-width:1024px){.login-clean-frame{grid-template-columns:1fr}.login-clean-brand h1{font-size:38px}}
@media(max-width:640px){.login-clean-brand,.login-clean-card{padding:22px;border-radius:22px}.login-save-box{grid-template-columns:1fr}.login-clean-footer{grid-template-columns:1fr}.login-clean-brand h1{font-size:31px}}

.networks-legacy-hidden{display:none!important}
.networks-v99-shell{display:grid;gap:18px;direction:rtl}
.networks-v99-top{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:24px;border-radius:28px;background:linear-gradient(135deg,rgba(15,23,42,.95),rgba(30,41,59,.74));border:1px solid rgba(240,212,138,.18);box-shadow:0 22px 60px rgba(0,0,0,.28),inset 4px 0 0 rgba(240,212,138,.65)}
.networks-v99-kicker{display:inline-flex;padding:7px 12px;border-radius:999px;background:rgba(240,212,138,.12);border:1px solid rgba(240,212,138,.2);color:#f4d887;font-size:12px;font-weight:1000}
.networks-v99-top h1{margin:10px 0 4px;color:#f4d887;font-size:42px;font-weight:1000;line-height:1}
.networks-v99-top p{margin:0;color:#94a3b8;font-size:14px}
.networks-v99-tools{display:flex;gap:10px;flex-wrap:wrap}
.networks-v99-create,.networks-v99-refresh{min-height:48px;border-radius:16px;border:0;padding:0 22px;font-weight:1000;cursor:pointer}
.networks-v99-create{background:linear-gradient(180deg,#f0d48a,#d1a84f);color:#111827;box-shadow:0 12px 30px rgba(209,168,79,.22)}
.networks-v99-refresh{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09);color:#e5e7eb}
.networks-v99-search{padding:18px;border-radius:24px;background:rgba(15,23,42,.76);border:1px solid rgba(148,163,184,.12)}
.networks-v99-search input{width:100%;height:52px;border-radius:18px;border:1px solid rgba(148,163,184,.18);background:#060b18;color:#fff;font-weight:900;padding:0 18px;text-align:right;outline:none}
.networks-v99-search input:focus{border-color:rgba(240,212,138,.52);box-shadow:0 0 0 4px rgba(240,212,138,.08)}
.networks-v99-meta{color:#94a3b8;font-size:13px;font-weight:900;text-align:left}
.networks-v99-area{display:grid;gap:18px}
.networks-v99-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.networks-v99-stat{padding:18px;border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));border:1px solid rgba(255,255,255,.08)}
.networks-v99-stat span{display:block;color:#8fa0b8;font-size:12px;font-weight:900;margin-bottom:8px}
.networks-v99-stat strong{display:block;color:#fff;font-size:30px;font-weight:1000}
.networks-v99-stat small{display:block;color:#94a3b8;margin-top:4px}
.networks-v99-filterbar{display:flex;flex-wrap:wrap;gap:9px}
.networks-v99-filterbar button{border-radius:999px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.045);color:#cbd5e1;font-weight:900;padding:10px 14px;cursor:pointer}
.networks-v99-filterbar button.active{background:rgba(240,212,138,.16);border-color:rgba(240,212,138,.35);color:#f8e6ad}
.networks-v99-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.networks-v99-card{position:relative;overflow:hidden;border-radius:26px;background:linear-gradient(145deg,rgba(15,23,42,.94),rgba(2,6,23,.84));border:1px solid rgba(148,163,184,.14);box-shadow:0 18px 48px rgba(0,0,0,.24);padding:22px}
.networks-v99-card:before{content:"";position:absolute;inset:0 auto 0 0;width:5px;background:linear-gradient(180deg,#22c55e,#f0d48a)}
.networks-v99-card.critical:before{background:linear-gradient(180deg,#ef4444,#f59e0b)}
.networks-v99-card.watch:before{background:linear-gradient(180deg,#f59e0b,#f0d48a)}
.networks-v99-card.empty:before{background:linear-gradient(180deg,#64748b,#94a3b8)}
.networks-v99-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:16px}
.networks-v99-name{display:flex;align-items:center;gap:10px}
.networks-v99-dot{width:11px;height:11px;border-radius:999px;background:#22c55e;box-shadow:0 0 0 5px rgba(34,197,94,.1)}
.networks-v99-card.critical .networks-v99-dot{background:#ef4444;box-shadow:0 0 0 5px rgba(239,68,68,.12)}
.networks-v99-card.watch .networks-v99-dot{background:#f59e0b;box-shadow:0 0 0 5px rgba(245,158,11,.12)}
.networks-v99-name h3{margin:0;color:#fff;font-size:24px;font-weight:1000}
.networks-v99-name p{margin:5px 0 0;color:#94a3b8;font-size:13px}
.networks-v99-score{text-align:center;min-width:78px;padding:10px;border-radius:18px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08)}
.networks-v99-score strong{display:block;color:#f8e6ad;font-size:24px;font-weight:1000}
.networks-v99-score span{display:block;color:#94a3b8;font-size:11px;font-weight:900}
.networks-v99-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:14px 0}
.networks-v99-metric{padding:12px;border-radius:17px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);text-align:center}
.networks-v99-metric span{display:block;color:#8fa0b8;font-size:11px;font-weight:900;margin-bottom:5px}
.networks-v99-metric strong{display:block;color:#e5e7eb;font-size:18px;font-weight:1000}
.networks-v99-details{display:grid;gap:8px;margin:14px 0}
.networks-v99-detail{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#94a3b8;font-size:12px;border-bottom:1px solid rgba(255,255,255,.05);padding-bottom:8px}
.networks-v99-detail strong{color:#dbeafe;direction:ltr;unicode-bidi:plaintext;text-align:left}
.networks-v99-actions{display:flex;gap:10px;margin-top:18px}
.networks-v99-open,.networks-v99-copy{min-height:46px;border-radius:15px;border:0;padding:0 18px;font-weight:1000;cursor:pointer}
.networks-v99-open{flex:1;background:linear-gradient(180deg,#f0d48a,#d1a84f);color:#111827}
.networks-v99-copy{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09);color:#e5e7eb}
.networks-v99-empty{padding:30px;border-radius:24px;background:rgba(255,255,255,.04);border:1px dashed rgba(148,163,184,.25);text-align:center;color:#94a3b8}
@media(max-width:980px){.networks-v99-summary,.networks-v99-grid{grid-template-columns:1fr}.networks-v99-top{align-items:stretch;flex-direction:column}.networks-v99-tools{justify-content:stretch}.networks-v99-tools button{flex:1}}
@media(max-width:640px){.networks-v99-metrics{grid-template-columns:1fr}.networks-v99-card-head{flex-direction:column}.networks-v99-score{text-align:right}.networks-v99-actions{flex-direction:column}}


/* V100 - both screens fix */

/* Login desktop fixed width */
.login-v100-shell .login-frame,
.login-v100-shell .login-brand-panel,
.login-v100-shell .login-card-pro{display:none!important}
.login-v100-frame{position:relative;z-index:2;width:min(1240px,96vw);display:grid;grid-template-columns:minmax(0,1.15fr) minmax(460px,.85fr);gap:24px;direction:rtl}
.login-v100-brand,.login-v100-card{border:1px solid rgba(240,212,138,.18);background:linear-gradient(145deg,rgba(15,23,42,.94),rgba(2,6,23,.88));box-shadow:0 28px 80px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.05);border-radius:28px;padding:36px;position:relative;overflow:hidden}
.login-v100-brand:before{content:"";position:absolute;inset:auto -80px -100px auto;width:310px;height:310px;border-radius:999px;background:radial-gradient(circle,rgba(240,212,138,.18),transparent 70%)}
.login-v100-logo{width:132px;height:132px;border-radius:28px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;margin-bottom:20px}
.login-v100-logo img{max-width:94px;max-height:94px;object-fit:contain}
.login-v100-badge{display:inline-flex;padding:8px 14px;border-radius:999px;background:rgba(240,212,138,.12);border:1px solid rgba(240,212,138,.22);color:#f8e6ad;font-size:12px;font-weight:1000}
.login-v100-brand h1{margin:18px 0 10px;color:#fff;font-size:48px;line-height:1.1;font-weight:1000}
.login-v100-brand p{margin:0;color:#aebbd0;font-size:18px;line-height:1.8;max-width:560px}
.login-v100-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.login-v100-tags span{padding:10px 16px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);color:#f8fafc;font-weight:900}
.login-v100-meta{margin-top:34px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.login-v100-meta>div{background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.07);border-radius:18px;padding:16px}
.login-v100-meta span{display:block;color:#8493aa;font-size:12px;margin-bottom:5px}
.login-v100-meta strong{display:block;color:#fff;font-size:15px}
.login-v100-card{padding:34px;align-self:stretch;display:flex;flex-direction:column;justify-content:center}
.login-v100-head{display:flex;align-items:center;gap:14px;margin-bottom:22px;text-align:right}
.login-v100-head img{width:62px;height:62px;border-radius:18px;object-fit:contain;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);padding:8px}
.login-v100-head h2{margin:0 0 5px;color:#fff;font-size:30px;font-weight:1000}
.login-v100-head p{margin:0;color:#94a3b8;font-size:14px}
.login-v100-save{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;align-items:center;margin:14px 0 16px}
.login-v100-save label{display:flex;align-items:center;justify-content:center;gap:8px;min-height:42px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);color:#dbeafe;font-size:12px;font-weight:900;cursor:pointer}
.login-v100-save input{accent-color:#d8b75c}
.login-v100-save button{min-height:42px;border-radius:14px;border:1px solid rgba(240,212,138,.28);background:rgba(240,212,138,.14);color:#f8e6ad;font-weight:1000;padding:0 14px;cursor:pointer}
.login-v100-save button:hover{background:rgba(240,212,138,.22)}
.login-v100-note{margin:14px 0 0;color:#8fa0b8;text-align:center;font-size:12px;line-height:1.7}
.login-v100-card .login-submit small{display:none!important}
.login-v100-card .login-submit{font-size:17px}
@media(max-width:1100px){.login-v100-frame{grid-template-columns:1fr;width:min(760px,96vw)}.login-v100-brand h1{font-size:38px}}
@media(max-width:640px){.login-v100-brand,.login-v100-card{padding:22px;border-radius:22px}.login-v100-save,.login-v100-meta{grid-template-columns:1fr}.login-v100-brand h1{font-size:31px}}

/* Networks forced command center */
.networks-legacy-hidden{display:none!important}
#view-networks > :not(#networksCommandRoot){display:none!important}
.networks-v100-shell{display:grid!important;gap:20px!important;direction:rtl!important;width:100%!important}
.networks-v100-hero{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:20px!important;padding:28px!important;border-radius:30px!important;background:linear-gradient(135deg,rgba(15,23,42,.97),rgba(30,41,59,.78))!important;border:1px solid rgba(240,212,138,.22)!important;box-shadow:0 22px 70px rgba(0,0,0,.30),inset 5px 0 0 rgba(240,212,138,.80)!important}
.networks-v100-title span{display:inline-flex!important;padding:7px 12px!important;border-radius:999px!important;background:rgba(240,212,138,.12)!important;border:1px solid rgba(240,212,138,.2)!important;color:#f4d887!important;font-size:12px!important;font-weight:1000!important}
.networks-v100-title h1{margin:10px 0 5px!important;color:#f4d887!important;font-size:46px!important;font-weight:1000!important;line-height:1!important}
.networks-v100-title p{margin:0!important;color:#94a3b8!important;font-size:14px!important}
.networks-v100-actions{display:flex!important;gap:10px!important;flex-wrap:wrap!important}
.networks-v100-primary,.networks-v100-secondary{min-height:50px!important;border-radius:16px!important;padding:0 22px!important;font-weight:1000!important;cursor:pointer!important}
.networks-v100-primary{border:0!important;background:linear-gradient(180deg,#f0d48a,#d1a84f)!important;color:#111827!important;box-shadow:0 12px 30px rgba(209,168,79,.22)!important}
.networks-v100-secondary{background:rgba(255,255,255,.06)!important;border:1px solid rgba(255,255,255,.09)!important;color:#e5e7eb!important}
.networks-v100-searchbar{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:12px!important;align-items:center!important;padding:18px!important;border-radius:24px!important;background:rgba(15,23,42,.78)!important;border:1px solid rgba(148,163,184,.12)!important}
.networks-v100-searchbar input{width:100%!important;height:54px!important;border-radius:18px!important;border:1px solid rgba(148,163,184,.18)!important;background:#060b18!important;color:#fff!important;font-weight:900!important;padding:0 18px!important;text-align:right!important;outline:none!important}
.networks-v100-searchbar input:focus{border-color:rgba(240,212,138,.55)!important;box-shadow:0 0 0 4px rgba(240,212,138,.08)!important}
#networksMetaV100{color:#94a3b8!important;font-size:13px!important;font-weight:900!important;white-space:nowrap!important}
.networks-v100-area{display:grid!important;gap:18px!important}
.networks-v100-summary{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important}
.networks-v100-summary>div{padding:18px!important;border-radius:22px!important;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025))!important;border:1px solid rgba(255,255,255,.08)!important}
.networks-v100-summary span{display:block!important;color:#8fa0b8!important;font-size:12px!important;font-weight:900!important;margin-bottom:8px!important}
.networks-v100-summary strong{display:block!important;color:#fff!important;font-size:30px!important;font-weight:1000!important}
.networks-v100-summary small{display:block!important;color:#94a3b8!important;margin-top:4px!important}
.networks-v100-filters{display:flex!important;flex-wrap:wrap!important;gap:9px!important}
.networks-v100-filters button{border-radius:999px!important;border:1px solid rgba(255,255,255,.08)!important;background:rgba(255,255,255,.045)!important;color:#cbd5e1!important;font-weight:900!important;padding:10px 14px!important;cursor:pointer!important}
.networks-v100-filters button.active{background:rgba(240,212,138,.16)!important;border-color:rgba(240,212,138,.35)!important;color:#f8e6ad!important}
.networks-v100-filters strong{color:#fff!important;margin-inline-start:6px!important}
.networks-v100-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px!important}
.networks-v100-card{position:relative!important;overflow:hidden!important;border-radius:26px!important;background:linear-gradient(145deg,rgba(15,23,42,.96),rgba(2,6,23,.86))!important;border:1px solid rgba(148,163,184,.14)!important;box-shadow:0 18px 48px rgba(0,0,0,.24)!important;padding:22px!important}
.networks-v100-card:before{content:""!important;position:absolute!important;inset:0 auto 0 0!important;width:5px!important;background:linear-gradient(180deg,#22c55e,#f0d48a)!important}
.networks-v100-card.critical:before{background:linear-gradient(180deg,#ef4444,#f59e0b)!important}
.networks-v100-card.watch:before{background:linear-gradient(180deg,#f59e0b,#f0d48a)!important}
.networks-v100-card.empty:before{background:linear-gradient(180deg,#64748b,#94a3b8)!important}
.networks-v100-card-head{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:16px!important;margin-bottom:16px!important}
.networks-v100-name{display:flex!important;align-items:center!important;gap:10px!important}
.networks-v100-dot{width:11px!important;height:11px!important;border-radius:999px!important;background:#22c55e!important;box-shadow:0 0 0 5px rgba(34,197,94,.1)!important}
.networks-v100-card.critical .networks-v100-dot{background:#ef4444!important;box-shadow:0 0 0 5px rgba(239,68,68,.12)!important}
.networks-v100-card.watch .networks-v100-dot{background:#f59e0b!important;box-shadow:0 0 0 5px rgba(245,158,11,.12)!important}
.networks-v100-name h3{margin:0!important;color:#fff!important;font-size:24px!important;font-weight:1000!important}
.networks-v100-card-head p{margin:5px 0 0!important;color:#94a3b8!important;font-size:13px!important}
.networks-v100-health{text-align:center!important;min-width:82px!important;padding:10px!important;border-radius:18px!important;background:rgba(255,255,255,.05)!important;border:1px solid rgba(255,255,255,.08)!important}
.networks-v100-health strong{display:block!important;color:#f8e6ad!important;font-size:24px!important;font-weight:1000!important}
.networks-v100-health span{display:block!important;color:#94a3b8!important;font-size:11px!important;font-weight:900!important}
.networks-v100-metrics{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px!important;margin:14px 0!important}
.networks-v100-metrics>div{padding:12px!important;border-radius:17px!important;background:rgba(255,255,255,.04)!important;border:1px solid rgba(255,255,255,.07)!important;text-align:center!important}
.networks-v100-metrics span{display:block!important;color:#8fa0b8!important;font-size:11px!important;font-weight:900!important;margin-bottom:5px!important}
.networks-v100-metrics strong{display:block!important;color:#e5e7eb!important;font-size:18px!important;font-weight:1000!important}
.networks-v100-info{display:grid!important;gap:8px!important;margin:14px 0!important}
.networks-v100-info>div{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;color:#94a3b8!important;font-size:12px!important;border-bottom:1px solid rgba(255,255,255,.05)!important;padding-bottom:8px!important}
.networks-v100-info strong{color:#dbeafe!important;direction:ltr!important;unicode-bidi:plaintext!important;text-align:left!important}
.networks-v100-card-actions{display:flex!important;gap:10px!important;margin-top:18px!important}
.networks-v100-open,.networks-v100-copy{min-height:46px!important;border-radius:15px!important;border:0!important;padding:0 18px!important;font-weight:1000!important;cursor:pointer!important}
.networks-v100-open{flex:1!important;background:linear-gradient(180deg,#f0d48a,#d1a84f)!important;color:#111827!important}
.networks-v100-copy{background:rgba(255,255,255,.06)!important;border:1px solid rgba(255,255,255,.09)!important;color:#e5e7eb!important}
.networks-v100-empty{padding:30px!important;border-radius:24px!important;background:rgba(255,255,255,.04)!important;border:1px dashed rgba(148,163,184,.25)!important;text-align:center!important;color:#94a3b8!important}
@media(max-width:980px){.networks-v100-summary,.networks-v100-grid{grid-template-columns:1fr!important}.networks-v100-hero{align-items:stretch!important;flex-direction:column!important}.networks-v100-actions{justify-content:stretch!important}.networks-v100-actions button{flex:1!important}.networks-v100-searchbar{grid-template-columns:1fr!important}}
@media(max-width:640px){.networks-v100-metrics{grid-template-columns:1fr!important}.networks-v100-card-head{flex-direction:column!important}.networks-v100-health{text-align:right!important}.networks-v100-card-actions{flex-direction:column!important}.networks-v100-title h1{font-size:36px!important}}


/* V101 - Restore old networks screen */
.networks-v100-disabled,
#networksCommandRoot.networks-v100-disabled,
#networksCommandRoot.hidden{display:none!important}
#view-networks > :not(#networksCommandRoot){display:revert!important}
#view-networks .networks-legacy-hidden{display:revert!important}
.networks-restored-shell{display:grid;gap:18px;direction:rtl}
.networks-restored-head{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px 26px;border-radius:26px;background:linear-gradient(135deg,rgba(15,23,42,.94),rgba(30,41,59,.72));border:1px solid rgba(240,212,138,.18);box-shadow:0 16px 42px rgba(0,0,0,.24),inset 4px 0 0 rgba(240,212,138,.65)}
.networks-restored-head h1{margin:0;color:#f4d887;font-size:38px;font-weight:1000}
.networks-restored-head p{margin:6px 0 0;color:#94a3b8;font-size:13px;font-weight:900}
.networks-restored-actions button{min-height:48px;border:0;border-radius:16px;padding:0 22px;background:linear-gradient(180deg,#f0d48a,#d1a84f);color:#111827;font-weight:1000;cursor:pointer}
.networks-restored-search{padding:16px;border-radius:22px;background:rgba(15,23,42,.76);border:1px solid rgba(148,163,184,.12)}
.networks-restored-search input{width:100%;height:52px;border-radius:18px;border:1px solid rgba(148,163,184,.18);background:#060b18;color:#fff;font-weight:900;padding:0 18px;text-align:right;outline:none}
.networks-restored-list{display:grid;gap:16px}
.restored-network-card{padding:20px!important;border-radius:24px!important;background:linear-gradient(135deg,rgba(15,23,42,.92),rgba(2,6,23,.82))!important;border:1px solid rgba(148,163,184,.14)!important;box-shadow:0 14px 36px rgba(0,0,0,.22)!important;cursor:pointer!important;transition:.18s ease!important}
.restored-network-card:hover{transform:translateY(-2px);border-color:rgba(240,212,138,.28)!important;background:linear-gradient(135deg,rgba(30,41,59,.95),rgba(15,23,42,.88))!important}
.restored-network-main{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.restored-network-title{display:flex;align-items:center;gap:12px;min-width:260px;flex:1}
.restored-network-dot{width:11px;height:11px;border-radius:999px;background:#22c55e;box-shadow:0 0 0 5px rgba(34,197,94,.10);flex:0 0 auto}
.restored-network-card.watch .restored-network-dot{background:#f59e0b;box-shadow:0 0 0 5px rgba(245,158,11,.12)}
.restored-network-card.critical .restored-network-dot{background:#ef4444;box-shadow:0 0 0 5px rgba(239,68,68,.12)}
.restored-network-title h3{margin:0;color:#fff;font-size:22px;font-weight:1000}
.restored-network-title p{margin:5px 0 0;color:#94a3b8;font-size:13px}
.restored-network-id,.restored-network-count,.restored-network-health{text-align:center;min-width:100px;padding-inline:14px;border-inline-start:1px solid rgba(148,163,184,.12)}
.restored-network-id span,.restored-network-count span,.restored-network-health span{display:block;color:#748198;font-size:11px;font-weight:900;margin-bottom:5px}
.restored-network-id strong,.restored-network-count strong,.restored-network-health strong{display:block;color:#dbeafe;font-size:16px;font-weight:1000;direction:ltr;unicode-bidi:plaintext}
.restored-network-open{min-height:44px;border:0;border-radius:15px;padding:0 28px;background:linear-gradient(180deg,#f0d48a,#d1a84f);color:#111827;font-weight:1000;cursor:pointer}
@media(max-width:768px){.networks-restored-head{flex-direction:column;align-items:stretch}.restored-network-main{align-items:stretch}.restored-network-title{min-width:100%}.restored-network-id,.restored-network-count,.restored-network-health{text-align:right;border:0;padding:0}.restored-network-open{width:100%}}


/* V102 - Enhanced old networks screen */
#networksCommandRoot,
#networksCommandRoot.networks-v100-disabled,
.networks-v100-disabled{display:none!important}
#networksLegacyEnhancedRoot{display:grid!important}
.networks-enhanced-shell{display:grid;gap:18px;direction:rtl;width:100%}
.networks-enhanced-head{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:24px 28px;border-radius:28px;background:linear-gradient(135deg,rgba(15,23,42,.96),rgba(30,41,59,.74));border:1px solid rgba(240,212,138,.20);box-shadow:0 18px 55px rgba(0,0,0,.28),inset 4px 0 0 rgba(240,212,138,.72)}
.networks-enhanced-title span{display:inline-flex;padding:7px 12px;border-radius:999px;background:rgba(240,212,138,.12);border:1px solid rgba(240,212,138,.22);color:#f4d887;font-size:12px;font-weight:1000}
.networks-enhanced-title h1{margin:9px 0 5px;color:#f4d887;font-size:42px;font-weight:1000;line-height:1}
.networks-enhanced-title p{margin:0;color:#94a3b8;font-size:13px;font-weight:900}
.networks-enhanced-actions{display:flex;gap:10px;flex-wrap:wrap}
.networks-enhanced-create,.networks-enhanced-refresh{min-height:48px;border-radius:16px;padding:0 22px;font-weight:1000;cursor:pointer}
.networks-enhanced-create{border:0;background:linear-gradient(180deg,#f0d48a,#d1a84f);color:#111827;box-shadow:0 12px 30px rgba(209,168,79,.22)}
.networks-enhanced-refresh{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09);color:#e5e7eb}
.networks-enhanced-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.networks-enhanced-stat{padding:18px;border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));border:1px solid rgba(255,255,255,.08);box-shadow:0 12px 28px rgba(0,0,0,.18)}
.networks-enhanced-stat span{display:block;color:#8fa0b8;font-size:12px;font-weight:900;margin-bottom:8px}
.networks-enhanced-stat strong{display:block;color:#fff;font-size:28px;font-weight:1000;line-height:1.15}
.networks-enhanced-stat small{display:block;color:#94a3b8;margin-top:5px;font-size:12px}
.networks-enhanced-toolbar{padding:16px;border-radius:22px;background:rgba(15,23,42,.76);border:1px solid rgba(148,163,184,.12)}
.networks-enhanced-toolbar input{width:100%;height:52px;border-radius:18px;border:1px solid rgba(148,163,184,.18);background:#060b18;color:#fff;font-weight:900;padding:0 18px;text-align:right;outline:none}
.networks-enhanced-toolbar input:focus{border-color:rgba(240,212,138,.55);box-shadow:0 0 0 4px rgba(240,212,138,.08)}
.networks-enhanced-filters{display:flex;flex-wrap:wrap;gap:9px}
.networks-enhanced-filters button{border-radius:999px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.045);color:#cbd5e1;font-weight:900;padding:10px 14px;cursor:pointer}
.networks-enhanced-filters button.active{background:rgba(240,212,138,.16);border-color:rgba(240,212,138,.35);color:#f8e6ad}
.networks-enhanced-filters strong{color:#fff;margin-inline-start:6px}
.networks-enhanced-list{display:grid;gap:14px}
.networks-enhanced-card{position:relative;overflow:hidden;border-radius:24px;background:linear-gradient(135deg,rgba(15,23,42,.94),rgba(2,6,23,.84));border:1px solid rgba(148,163,184,.14);box-shadow:0 16px 42px rgba(0,0,0,.22);padding:18px;cursor:pointer;transition:.18s ease}
.networks-enhanced-card:hover{transform:translateY(-2px);border-color:rgba(240,212,138,.30);background:linear-gradient(135deg,rgba(30,41,59,.95),rgba(15,23,42,.88))}
.networks-enhanced-card:before{content:"";position:absolute;inset:0 auto 0 0;width:5px;background:linear-gradient(180deg,#22c55e,#f0d48a)}
.networks-enhanced-card.watch:before{background:linear-gradient(180deg,#f59e0b,#f0d48a)}
.networks-enhanced-card.critical:before{background:linear-gradient(180deg,#ef4444,#f59e0b)}
.networks-enhanced-card.empty:before{background:linear-gradient(180deg,#64748b,#94a3b8)}
.networks-enhanced-card-main{display:grid;grid-template-columns:minmax(240px,1.5fr) 92px 86px 86px 86px minmax(110px,.7fr) auto;gap:12px;align-items:center}
.networks-enhanced-card-title{display:flex;align-items:center;gap:12px;min-width:0}
.networks-enhanced-dot{width:11px;height:11px;border-radius:999px;background:#22c55e;box-shadow:0 0 0 5px rgba(34,197,94,.10);flex:0 0 auto}
.networks-enhanced-card.watch .networks-enhanced-dot{background:#f59e0b;box-shadow:0 0 0 5px rgba(245,158,11,.12)}
.networks-enhanced-card.critical .networks-enhanced-dot{background:#ef4444;box-shadow:0 0 0 5px rgba(239,68,68,.12)}
.networks-enhanced-card-title h3{margin:0;color:#fff;font-size:22px;font-weight:1000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.networks-enhanced-card-title p{margin:4px 0 0;color:#94a3b8;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.networks-enhanced-pill,.networks-enhanced-metric,.networks-enhanced-meta{padding:11px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);text-align:center}
.networks-enhanced-pill strong{display:block;color:#f8e6ad;font-size:20px;font-weight:1000}
.networks-enhanced-pill span,.networks-enhanced-metric span,.networks-enhanced-meta span{display:block;color:#8fa0b8;font-size:11px;font-weight:900;margin-bottom:4px}
.networks-enhanced-metric strong,.networks-enhanced-meta strong{display:block;color:#e5e7eb;font-size:17px;font-weight:1000;direction:ltr;unicode-bidi:plaintext}
.networks-enhanced-actions-card{display:flex;gap:8px;justify-content:flex-end}
.networks-enhanced-open,.networks-enhanced-copy{min-height:42px;border-radius:14px;padding:0 16px;font-weight:1000;cursor:pointer}
.networks-enhanced-open{border:0;background:linear-gradient(180deg,#f0d48a,#d1a84f);color:#111827}
.networks-enhanced-copy{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09);color:#e5e7eb}
.networks-enhanced-card-sub{display:flex;gap:14px;flex-wrap:wrap;margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.06);color:#7f8da3;font-size:12px}
.networks-enhanced-card-sub strong{color:#cbd5e1;direction:ltr;unicode-bidi:plaintext}
.networks-enhanced-empty{padding:30px;border-radius:24px;background:rgba(255,255,255,.04);border:1px dashed rgba(148,163,184,.25);text-align:center;color:#94a3b8}
@media(max-width:1180px){.networks-enhanced-card-main{grid-template-columns:minmax(220px,1fr) repeat(4,80px) auto}.networks-enhanced-meta{display:none}}
@media(max-width:980px){.networks-enhanced-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.networks-enhanced-card-main{grid-template-columns:1fr 1fr 1fr}.networks-enhanced-card-title,.networks-enhanced-actions-card{grid-column:1/-1}.networks-enhanced-actions-card{justify-content:stretch}.networks-enhanced-actions-card button{flex:1}.networks-enhanced-head{align-items:stretch;flex-direction:column}}
@media(max-width:640px){.networks-enhanced-summary{grid-template-columns:1fr}.networks-enhanced-card-main{grid-template-columns:1fr}.networks-enhanced-pill,.networks-enhanced-metric{text-align:right}.networks-enhanced-title h1{font-size:36px}}


/* V103 - Compact networks screen */
#networksCommandRoot,
#networksLegacyEnhancedRoot,
#networksLegacyRestoredRoot{display:none!important}
.networks-compact-shell{display:grid;gap:12px;direction:rtl;width:100%}
.networks-compact-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;border-radius:22px;background:linear-gradient(135deg,rgba(15,23,42,.94),rgba(30,41,59,.72));border:1px solid rgba(240,212,138,.18);box-shadow:0 12px 32px rgba(0,0,0,.22),inset 4px 0 0 rgba(240,212,138,.65)}
.networks-compact-head h1{margin:0;color:#f4d887;font-size:32px;font-weight:1000;line-height:1}
.networks-compact-head p{margin:5px 0 0;color:#94a3b8;font-size:12px;font-weight:900}
.networks-compact-actions{display:flex;gap:8px;flex-wrap:wrap}
.networks-compact-create,.networks-compact-refresh{min-height:42px;border-radius:14px;padding:0 18px;font-weight:1000;cursor:pointer}
.networks-compact-create{border:0;background:linear-gradient(180deg,#f0d48a,#d1a84f);color:#111827;box-shadow:0 8px 22px rgba(209,168,79,.18)}
.networks-compact-refresh{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09);color:#e5e7eb}
.networks-compact-stats{display:flex;flex-wrap:wrap;gap:8px;padding:8px 2px}
.networks-compact-stats span{display:inline-flex;align-items:center;gap:5px;min-height:30px;padding:0 12px;border-radius:999px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.08);color:#94a3b8;font-size:12px;font-weight:900}
.networks-compact-stats strong{color:#fff;font-weight:1000}
.networks-compact-list{display:grid;gap:10px}
.networks-compact-card{position:relative;overflow:hidden;border-radius:18px;background:linear-gradient(135deg,rgba(15,23,42,.94),rgba(2,6,23,.84));border:1px solid rgba(148,163,184,.14);box-shadow:0 10px 28px rgba(0,0,0,.18);padding:13px 14px;cursor:pointer;transition:.16s ease}
.networks-compact-card:hover{transform:translateY(-1px);border-color:rgba(240,212,138,.30);background:linear-gradient(135deg,rgba(30,41,59,.95),rgba(15,23,42,.88))}
.networks-compact-card:before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:#22c55e}
.networks-compact-card.watch:before{background:#f59e0b}
.networks-compact-card.critical:before{background:#ef4444}
.networks-compact-card.empty:before{background:#64748b}
.networks-compact-main{display:grid;grid-template-columns:minmax(180px,1.35fr) minmax(130px,.9fr) 76px 70px 70px auto;gap:10px;align-items:center}
.networks-compact-name{display:flex;align-items:center;gap:10px;min-width:0}
.networks-compact-dot{width:10px;height:10px;border-radius:999px;background:#22c55e;box-shadow:0 0 0 4px rgba(34,197,94,.10);flex:0 0 auto}
.networks-compact-card.watch .networks-compact-dot{background:#f59e0b;box-shadow:0 0 0 4px rgba(245,158,11,.12)}
.networks-compact-card.critical .networks-compact-dot{background:#ef4444;box-shadow:0 0 0 4px rgba(239,68,68,.12)}
.networks-compact-name h3{margin:0;color:#fff;font-size:19px;font-weight:1000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.networks-compact-name p{margin:3px 0 0;color:#94a3b8;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.networks-compact-id,.networks-compact-mini{padding:8px 10px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);text-align:center;min-width:0}
.networks-compact-id span,.networks-compact-mini span{display:block;color:#8fa0b8;font-size:10px;font-weight:900;margin-bottom:3px}
.networks-compact-id strong{display:block;color:#f8e6ad;font-size:13px;font-weight:1000;direction:ltr;unicode-bidi:plaintext;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.networks-compact-mini strong{display:block;color:#e5e7eb;font-size:15px;font-weight:1000}
.networks-compact-buttons{display:flex;gap:7px;justify-content:flex-end}
.networks-compact-copy,.networks-compact-open{min-height:38px;border-radius:13px;padding:0 14px;font-weight:1000;cursor:pointer;white-space:nowrap}
.networks-compact-copy{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09);color:#e5e7eb}
.networks-compact-open{border:0;background:linear-gradient(180deg,#f0d48a,#d1a84f);color:#111827}
.networks-compact-sub{display:flex;gap:12px;flex-wrap:wrap;margin-top:8px;padding-top:8px;border-top:1px solid rgba(255,255,255,.055);color:#7f8da3;font-size:11px;direction:ltr;justify-content:flex-end}
.networks-compact-empty{padding:22px;border-radius:18px;background:rgba(255,255,255,.04);border:1px dashed rgba(148,163,184,.25);text-align:center;color:#94a3b8}
@media(max-width:1180px){.networks-compact-main{grid-template-columns:minmax(180px,1fr) minmax(120px,.7fr) repeat(3,66px) auto}}
@media(max-width:980px){.networks-compact-main{grid-template-columns:1fr 1fr 1fr}.networks-compact-name,.networks-compact-id,.networks-compact-buttons{grid-column:1/-1}.networks-compact-buttons{justify-content:stretch}.networks-compact-buttons button{flex:1}.networks-compact-head{align-items:stretch;flex-direction:column}}
@media(max-width:640px){.networks-compact-main{grid-template-columns:1fr}.networks-compact-mini,.networks-compact-id{text-align:right}.networks-compact-sub{justify-content:flex-start}.networks-compact-head h1{font-size:28px}}


/* V120 - Professional main menu hide/show */
.sidebar-toggle-btn{
    min-height:46px;
    width:100%;
    border:1px solid rgba(234,179,8,.28);
    border-radius:18px;
    background:linear-gradient(135deg,rgba(250,204,21,.20),rgba(15,23,42,.40));
    color:#fde68a;
    font-weight:1000;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    margin-bottom:4px;
    transition:transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 14px 34px rgba(0,0,0,.18);
}
.sidebar-toggle-btn .sidebar-toggle-icon{
    width:26px;
    height:26px;
    display:grid;
    place-items:center;
    border-radius:10px;
    background:rgba(2,6,23,.32);
    border:1px solid rgba(250,204,21,.18);
}
.sidebar-toggle-btn:hover{
    transform:translateY(-1px);
    background:linear-gradient(135deg,rgba(250,204,21,.28),rgba(15,23,42,.48));
    border-color:rgba(250,204,21,.42);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 18px 40px rgba(0,0,0,.24);
}
.sidebar-floating-toggle{
    position:fixed;
    top:18px;
    right:18px;
    z-index:120;
    min-width:94px;
    height:48px;
    padding:0 14px;
    border-radius:18px;
    border:1px solid rgba(234,179,8,.42);
    background:linear-gradient(135deg,#f3d47f,#cfa64d);
    color:#111827;
    box-shadow:0 22px 52px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.35);
    font-size:14px;
    font-weight:1000;
    cursor:pointer;
    display:none;
    align-items:center;
    justify-content:center;
    gap:8px;
    transition:transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.sidebar-floating-toggle:hover{
    transform:translateY(-1px);
    filter:saturate(1.06);
    box-shadow:0 26px 60px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.42);
}
.sidebar-floating-toggle span:first-child{
    width:24px;
    height:24px;
    display:grid;
    place-items:center;
    border-radius:9px;
    background:rgba(17,24,39,.10);
}
#appView.app-shell.sidebar-collapsed,
#appView.app-shell[data-sidebar-collapsed="1"]{
    grid-template-columns:minmax(0,1fr)!important;
    max-width:1920px!important;
}
#appView.app-shell.sidebar-collapsed > :not(header),
#appView.app-shell[data-sidebar-collapsed="1"] > :not(header){
    grid-column:1 / -1!important;
}
#appView.app-shell.sidebar-collapsed .app-sidebar,
#appView.app-shell[data-sidebar-collapsed="1"] .app-sidebar,
.app-sidebar.is-sidebar-hidden{
    display:none!important;
}
body.sidebar-collapsed .sidebar-floating-toggle{
    display:flex;
}
@media(max-width:980px){
    .sidebar-toggle-btn{min-height:42px;border-radius:16px}
    .sidebar-floating-toggle{top:12px;right:12px;min-width:84px;height:44px;border-radius:16px;font-size:13px}
}


/* V116 - Network Detail Clean UI */
#view-net-details.network-clean-active{
    display:block;
}
#view-net-details.network-clean-active > .net-header-shell{
    display:none!important;
}
.network-clean-header{
    margin-bottom:16px;
    border:1px solid rgba(234,179,8,.18);
    border-radius:26px;
    background:
      radial-gradient(circle at 0% 0%, rgba(234,179,8,.12), transparent 32%),
      linear-gradient(145deg, rgba(15,23,42,.96), rgba(2,6,23,.86));
    box-shadow:0 24px 70px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.05);
    padding:20px;
}
.network-clean-titlebar{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    flex-wrap:wrap;
}
.network-clean-title{
    display:flex;
    align-items:center;
    gap:14px;
    min-width:280px;
}
.network-clean-back{
    min-height:42px;
    border-radius:14px;
    padding:0 14px;
    background:rgba(255,255,255,.055);
    border:1px solid rgba(255,255,255,.09);
    color:#dbeafe;
    font-weight:900;
    cursor:pointer;
}
.network-clean-kicker{
    display:inline-flex;
    padding:5px 10px;
    border-radius:999px;
    color:#fde68a;
    background:rgba(234,179,8,.12);
    border:1px solid rgba(234,179,8,.22);
    font-size:10px;
    letter-spacing:.16em;
    text-transform:uppercase;
    font-weight:1000;
}
.network-clean-title h1{
    margin:7px 0 5px;
    color:#fff;
    font-size:32px;
    line-height:1.1;
    font-weight:1000;
}
.network-clean-title p{
    margin:0;
    color:#94a3b8;
    font-size:13px;
}
.network-clean-actions{
    display:flex;
    gap:9px;
    flex-wrap:wrap;
}
.network-clean-primary,
.network-clean-secondary{
    min-height:42px;
    border-radius:14px;
    padding:0 16px;
    font-weight:1000;
    cursor:pointer;
}
.network-clean-primary{
    border:0;
    color:#111827;
    background:linear-gradient(180deg,#f3d47f,#d1a84f);
    box-shadow:0 14px 28px rgba(209,168,79,.18);
}
.network-clean-secondary{
    color:#e5e7eb;
    background:rgba(255,255,255,.055);
    border:1px solid rgba(255,255,255,.09);
}
.network-clean-summary{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:10px;
    margin-top:16px;
}
.network-clean-summary>div{
    border-radius:16px;
    padding:12px;
    background:rgba(255,255,255,.045);
    border:1px solid rgba(255,255,255,.075);
}
.network-clean-summary span{
    display:block;
    color:#8fa0b8;
    font-size:11px;
    font-weight:1000;
    margin-bottom:5px;
    text-transform:uppercase;
}
.network-clean-summary strong{
    color:#fff;
    font-size:24px;
    font-weight:1000;
}
.network-clean-connection{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
    color:#94a3b8;
    font-size:12px;
}
.network-clean-connection span{
    border-radius:999px;
    padding:7px 11px;
    background:rgba(15,23,42,.62);
    border:1px solid rgba(255,255,255,.06);
}
.pending-devices-section,
.active-devices-section{
    margin-bottom:14px;
    border:1px solid rgba(255,255,255,.075);
    background:linear-gradient(180deg,rgba(15,23,42,.72),rgba(2,6,23,.38));
    border-radius:22px;
    padding:14px;
}
.pending-devices-head,
.active-devices-head{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    margin-bottom:12px;
}
.pending-devices-head span,
.active-devices-head span{
    display:block;
    color:#fde68a;
    font-size:10px;
    text-transform:uppercase;
    letter-spacing:.14em;
    font-weight:1000;
    margin-bottom:3px;
}
.pending-devices-head strong,
.active-devices-head strong{
    color:#fff;
    font-size:16px;
    font-weight:1000;
}
.active-devices-head small{
    color:#94a3b8;
    font-weight:900;
}
.pending-devices-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
}
.pending-device-card{
    border-radius:18px;
    padding:14px;
    background:linear-gradient(135deg,rgba(245,158,11,.12),rgba(15,23,42,.64));
    border:1px solid rgba(245,158,11,.20);
    display:grid;
    grid-template-columns:minmax(0,1.1fr) minmax(180px,.9fr) auto;
    gap:12px;
    align-items:center;
}
.pending-device-badge{
    display:inline-flex;
    padding:4px 9px;
    border-radius:999px;
    background:rgba(245,158,11,.14);
    border:1px solid rgba(245,158,11,.25);
    color:#fcd34d;
    font-size:10px;
    font-weight:1000;
}
.pending-device-card h3{
    margin:7px 0 3px;
    color:#fff;
    font-size:16px;
    font-weight:1000;
}
.pending-device-card p{
    margin:0;
    color:#94a3b8;
    font-size:12px;
}
.pending-device-meta{
    display:grid;
    gap:5px;
    color:#94a3b8;
    font-size:12px;
}
.pending-device-meta strong{
    color:#e5e7eb;
}
.pending-device-actions{
    display:flex;
    gap:7px;
    flex-wrap:wrap;
    justify-content:flex-end;
}
#view-net-details .device-virtual-viewport{
    border-radius:18px;
    overflow:hidden;
}
@media(max-width:1100px){
    .network-clean-summary{grid-template-columns:repeat(2,minmax(0,1fr));}
    .pending-devices-grid{grid-template-columns:1fr;}
    .pending-device-card{grid-template-columns:1fr;}
    .pending-device-actions{justify-content:stretch;}
    .pending-device-actions button{flex:1;}
}
@media(max-width:640px){
    .network-clean-header{padding:14px;border-radius:20px;}
    .network-clean-title{align-items:flex-start;flex-direction:column;}
    .network-clean-title h1{font-size:26px;}
    .network-clean-summary{grid-template-columns:1fr;}
    .network-clean-actions button{width:100%;}
}


/* V122 - Device status consistency + compact collapsed menu handle */
.sidebar-floating-toggle{
    top:50%!important;
    right:0!important;
    width:54px!important;
    min-width:54px!important;
    height:56px!important;
    padding:0!important;
    border-radius:18px 0 0 18px!important;
    border-right:0!important;
    background:linear-gradient(135deg,rgba(250,204,21,.96),rgba(202,138,4,.96))!important;
    color:#0f172a!important;
    box-shadow:0 18px 44px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.36)!important;
    transform:translateY(-50%)!important;
    overflow:hidden!important;
}
body.sidebar-collapsed .sidebar-floating-toggle{
    display:grid!important;
    place-items:center!important;
}
.sidebar-floating-toggle:hover{
    transform:translateY(-50%) translateX(-4px)!important;
    filter:saturate(1.08)!important;
}
.sidebar-floating-toggle [data-sidebar-toggle-label]{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    padding:0!important;
    margin:-1px!important;
    overflow:hidden!important;
    clip:rect(0,0,0,0)!important;
    white-space:nowrap!important;
    border:0!important;
}
.sidebar-floating-toggle span:first-child,
.sidebar-floating-toggle [data-sidebar-toggle-icon]{
    width:34px!important;
    height:34px!important;
    border-radius:12px!important;
    background:rgba(15,23,42,.12)!important;
    display:grid!important;
    place-items:center!important;
    font-size:25px!important;
    line-height:1!important;
}
@media(max-width:980px){
    .sidebar-floating-toggle{top:auto!important;bottom:18px!important;right:12px!important;width:52px!important;min-width:52px!important;height:52px!important;border-radius:18px!important;border-right:1px solid rgba(234,179,8,.42)!important;transform:none!important;}
    .sidebar-floating-toggle:hover{transform:translateY(-2px)!important;}
}


/* V126_UI_THEME_I18N_STABILITY_START
   Dark/Light theme layer. The default dark design is preserved; light mode only overrides design tokens and contrast helpers. */
:root,
html[data-it-theme="dark"],
body[data-it-theme="dark"]{
    color-scheme: dark;
    --it-surface-strong: rgba(15,23,42,.92);
    --it-border-soft: rgba(234,179,8,.16);
}
html[data-it-theme="light"],
body[data-it-theme="light"]{
    color-scheme: light;
    --brand-bg:#eef3f8!important;
    --brand-bg-alt:#f7fafc!important;
    --brand-panel:#ffffff!important;
    --brand-panel-soft:#f1f5f9!important;
    --brand-text:#0f172a!important;
    --brand-muted:#475569!important;
    --brand-accent:#b7791f!important;
    --brand-accent-soft:#d69e2e!important;
    --it-surface-strong: rgba(255,255,255,.94);
    --it-border-soft: rgba(183,121,31,.20);
}
html[data-it-theme="light"] body,
body[data-it-theme="light"]{
    background: radial-gradient(circle at 50% 0%, #ffffff 0%, #f7fafc 55%, #e7edf5 100%)!important;
    color: var(--brand-text)!important;
}
body[data-it-theme="light"] .card,
body[data-it-theme="light"] .compact-card,
body[data-it-theme="light"] .device-card,
body[data-it-theme="light"] .network-list-card,
body[data-it-theme="light"] .section-shell,
body[data-it-theme="light"] .app-sidebar,
body[data-it-theme="light"] .sidebar-brand-card,
body[data-it-theme="light"] .sidebar-user-card,
body[data-it-theme="light"] .sidebar-mini-tile,
body[data-it-theme="light"] .sidebar-status-card,
body[data-it-theme="light"] .pending-devices-section,
body[data-it-theme="light"] .active-devices-section,
body[data-it-theme="light"] .network-clean-header{
    background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(241,245,249,.84))!important;
    border-color: rgba(148,163,184,.28)!important;
    box-shadow: 0 18px 44px rgba(15,23,42,.10), inset 0 1px 0 rgba(255,255,255,.72)!important;
}
body[data-it-theme="light"] .text-white,
body[data-it-theme="light"] h1,
body[data-it-theme="light"] h2,
body[data-it-theme="light"] h3,
body[data-it-theme="light"] h4,
body[data-it-theme="light"] .panel-title,
body[data-it-theme="light"] .compact-title,
body[data-it-theme="light"] .device-name,
body[data-it-theme="light"] .sidebar-user-name,
body[data-it-theme="light"] .network-clean-title h1,
body[data-it-theme="light"] .pending-devices-head strong,
body[data-it-theme="light"] .active-devices-head strong{
    color:#0f172a!important;
}
body[data-it-theme="light"] .text-slate-500,
body[data-it-theme="light"] .text-slate-400,
body[data-it-theme="light"] .sidebar-tagline,
body[data-it-theme="light"] .sidebar-blurb,
body[data-it-theme="light"] .device-subtitle,
body[data-it-theme="light"] .settings-panel-note,
body[data-it-theme="light"] .network-clean-title p,
body[data-it-theme="light"] .active-devices-head small{
    color:#475569!important;
}
body[data-it-theme="light"] .input-glass,
body[data-it-theme="light"] .device-search-wrap,
body[data-it-theme="light"] .ip-btn,
body[data-it-theme="light"] .network-quick-item,
body[data-it-theme="light"] .metric-chip,
body[data-it-theme="light"] .device-status-card,
body[data-it-theme="light"] .ai-terminal-box,
body[data-it-theme="light"] .sidebar-nav .nav-btn{
    background: rgba(248,250,252,.92)!important;
    border-color: rgba(148,163,184,.32)!important;
    color:#0f172a!important;
}
body[data-it-theme="light"] .device-search-input,
body[data-it-theme="light"] .network-quick-value,
body[data-it-theme="light"] .metric-value,
body[data-it-theme="light"] .zt-table td,
body[data-it-theme="light"] .managed-pill .mono{
    color:#0f172a!important;
}
body[data-it-theme="light"] .sidebar-nav .nav-btn:hover,
body[data-it-theme="light"] .sidebar-nav .nav-btn.active{
    background: linear-gradient(135deg, rgba(183,121,31,.16), rgba(37,99,235,.08))!important;
    border-color: rgba(183,121,31,.34)!important;
    color:#0f172a!important;
}
body[data-it-theme="light"] .btn-primary,
body[data-it-theme="light"] .network-clean-primary,
body[data-it-theme="light"] .sidebar-floating-toggle{
    color:#111827!important;
}
body[data-it-theme="light"] .zt-table th,
body[data-it-theme="light"] .zt-table td{
    border-color:rgba(148,163,184,.26)!important;
}
body[data-it-theme="light"] .path-offline{background:rgba(239,68,68,.10)!important;color:#b91c1c!important;border-color:rgba(239,68,68,.24)!important;}
body[data-it-theme="light"] .path-direct,
body[data-it-theme="light"] .path-online{background:rgba(34,197,94,.10)!important;color:#047857!important;border-color:rgba(34,197,94,.24)!important;}
body[data-it-theme="light"] .path-pending{background:rgba(245,158,11,.12)!important;color:#92400e!important;border-color:rgba(245,158,11,.28)!important;}
.it-top-appearance-panel{
    margin-top:12px;
    padding:12px;
    border-radius:18px;
    border:1px solid color-mix(in srgb, var(--brand-accent) 18%, transparent);
    background:linear-gradient(180deg, color-mix(in srgb, var(--brand-panel-soft) 62%, transparent), color-mix(in srgb, var(--brand-bg-alt) 34%, transparent));
}
.it-top-appearance-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;}
.it-top-appearance-title{font-size:12px;font-weight:1000;color:var(--brand-text);}
.it-top-appearance-note{font-size:10px;font-weight:900;color:var(--brand-muted);}
.it-top-appearance-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px;}
.it-top-choice-btn{
    min-height:34px;
    border-radius:12px;
    border:1px solid color-mix(in srgb, var(--brand-accent) 16%, transparent);
    background:rgba(255,255,255,.045);
    color:var(--brand-muted);
    font-size:11px;
    font-weight:1000;
    cursor:pointer;
    transition:.18s ease;
}
.it-top-choice-btn:hover{transform:translateY(-1px);border-color:color-mix(in srgb, var(--brand-accent) 38%, transparent);color:var(--brand-text);}
.it-top-choice-btn.active{background:linear-gradient(135deg,var(--brand-accent),var(--brand-accent-soft));color:#111827;border-color:transparent;box-shadow:0 10px 24px color-mix(in srgb, var(--brand-accent) 24%, transparent);}
html[dir="ltr"] body{direction:ltr;text-align:left;}
html[dir="ltr"] .zt-table{text-align:left;}
html[dir="ltr"] .sidebar-nav .nav-btn{text-align:left;}
html[dir="ltr"] .device-row-cell.cell-actions .row-actions{justify-content:flex-end;}
html[dir="ltr"] .input-glass.text-right{text-align:left!important;}
html[dir="ltr"] .sidebar-floating-toggle{right:auto!important;left:0!important;border-radius:0 18px 18px 0!important;border-left:0!important;border-right:1px solid rgba(234,179,8,.42)!important;}
html[dir="ltr"] body.sidebar-collapsed .sidebar-floating-toggle:hover{transform:translateY(-50%) translateX(4px)!important;}
@media(max-width:980px){html[dir="ltr"] .sidebar-floating-toggle{left:12px!important;right:auto!important;border-radius:18px!important;border-left:1px solid rgba(234,179,8,.42)!important;}}
/* V126_UI_THEME_I18N_STABILITY_END */


.dashboard-empty-real-data{
    margin:0 0 14px;
    padding:12px 16px;
    border-radius:16px;
    border:1px dashed color-mix(in srgb, var(--brand-accent) 28%, transparent);
    background:color-mix(in srgb, var(--brand-accent) 8%, transparent);
    color:var(--brand-accent-soft);
    font-weight:1000;
    text-align:center;
}


body[data-it-theme="light"] [class*="bg-slate-900"],
body[data-it-theme="light"] [class*="bg-slate-950"],
body[data-it-theme="light"] [class*="bg-slate-800"]{
    background-color:rgba(248,250,252,.92)!important;
    color:#0f172a!important;
}
body[data-it-theme="light"] [class*="border-slate-700"],
body[data-it-theme="light"] [class*="border-slate-800"],
body[data-it-theme="light"] [class*="border-slate-900"]{
    border-color:rgba(148,163,184,.32)!important;
}
body[data-it-theme="light"] .terminal-text,
body[data-it-theme="light"] .ai-feed-line,
body[data-it-theme="light"] .modal-content,
body[data-it-theme="light"] .quick-client-output,
body[data-it-theme="light"] .qr-download-panel{
    background:rgba(248,250,252,.92)!important;
    color:#0f172a!important;
    border-color:rgba(148,163,184,.32)!important;
}


/* V127_DEVICES_LOGIC_UI_START
   Visual consistency for unified device states: green online, amber warning/pending, red offline, neutral blocked. */
.device-row.device-state-online{border-color:rgba(34,197,94,.34);}
.device-row.device-state-online::after{background:radial-gradient(circle at 100% 0%, rgba(34,197,94,.10), transparent 28%), radial-gradient(circle at 0% 100%, rgba(56,189,248,.05), transparent 24%);}
.device-row.device-state-warning{border-color:rgba(245,158,11,.42);}
.device-row.device-state-warning::after{background:radial-gradient(circle at 100% 0%, rgba(245,158,11,.12), transparent 28%), radial-gradient(circle at 0% 100%, rgba(56,189,248,.05), transparent 24%);}
.device-row.device-state-pending{border-color:rgba(250,204,21,.38);}
.device-row.device-state-offline{border-color:rgba(239,68,68,.36);}
.device-row.device-state-blocked{border-color:rgba(148,163,184,.30);filter:saturate(.88);}
.device-row.device-state-offline .device-health-dot{background:#ef4444;box-shadow:0 0 0 5px rgba(239,68,68,.14);}
.device-row.device-state-pending .device-health-dot,.device-row.device-state-warning .device-health-dot{background:#f59e0b;box-shadow:0 0 0 5px rgba(245,158,11,.16);}
.device-status-label-v127{display:inline-flex;align-items:center;justify-content:center;padding:5px 9px;border-radius:999px;font-size:10px;font-weight:1000;border:1px solid rgba(148,163,184,.16);background:rgba(15,23,42,.58);color:#dbeafe;white-space:nowrap}
.device-state-online:not(.device-state-warning) .device-status-label-v127{background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.22);color:#86efac}
.device-state-warning .device-status-label-v127,.device-state-pending .device-status-label-v127{background:rgba(245,158,11,.13);border-color:rgba(245,158,11,.24);color:#fcd34d}
.device-state-offline .device-status-label-v127{background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.24);color:#fecaca}
.device-state-blocked .device-status-label-v127{background:rgba(148,163,184,.12);border-color:rgba(148,163,184,.2);color:#cbd5e1}
.latency-high,.latency-danger,.status-quality.latency-high,.status-quality.latency-danger{background:rgba(249,115,22,.12);color:#fdba74;border-color:rgba(249,115,22,.2)}
.latency-muted,.status-quality.latency-muted{background:rgba(148,163,184,.12);color:#cbd5e1;border-color:rgba(148,163,184,.18)}
body[data-it-theme="light"] .device-status-label-v127{background:rgba(248,250,252,.9);color:#0f172a;border-color:rgba(148,163,184,.28)}
body[data-it-theme="light"] .device-state-online:not(.device-state-warning) .device-status-label-v127{background:rgba(34,197,94,.10);color:#047857;border-color:rgba(34,197,94,.24)}
body[data-it-theme="light"] .device-state-warning .device-status-label-v127,body[data-it-theme="light"] .device-state-pending .device-status-label-v127{background:rgba(245,158,11,.12);color:#92400e;border-color:rgba(245,158,11,.28)}
body[data-it-theme="light"] .device-state-offline .device-status-label-v127{background:rgba(239,68,68,.10);color:#b91c1c;border-color:rgba(239,68,68,.24)}
/* V127_DEVICES_LOGIC_UI_END */


/* V129_DASHBOARD_SETTINGS_DELIVERY_UI_START
   Final delivery polish for dashboard and settings without changing the IT TOP design identity. */
.dashboard-status-strip-v129{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    flex-wrap:wrap;
    margin:-4px 0 14px;
}
.dashboard-status-chip-v129{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:34px;
    padding:8px 12px;
    border-radius:999px;
    border:1px solid color-mix(in srgb, var(--brand-accent) 18%, transparent);
    background:color-mix(in srgb, var(--brand-panel-soft) 72%, transparent);
    color:var(--brand-muted);
    font-size:11px;
    font-weight:1000;
    letter-spacing:.01em;
}
.dashboard-status-chip-v129.ok{color:#86efac;border-color:rgba(34,197,94,.24);background:rgba(34,197,94,.10);}
.dashboard-status-chip-v129.warn{color:#fcd34d;border-color:rgba(245,158,11,.30);background:rgba(245,158,11,.12);}
.dashboard-stat-card-v129{
    min-height:116px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    border:1px solid color-mix(in srgb, var(--brand-accent) 14%, transparent)!important;
}
.dashboard-stat-card-v129[data-stat="online"]{border-color:rgba(34,197,94,.28)!important;}
.dashboard-stat-card-v129[data-stat="offline"]{border-color:rgba(239,68,68,.20)!important;}
.dashboard-stat-card-v129[data-stat="pending"]{border-color:rgba(245,158,11,.28)!important;}
.dashboard-stat-card-v129[data-stat="blocked"]{border-color:rgba(148,163,184,.24)!important;}
.dashboard-stat-value-v129{line-height:1.05;letter-spacing:-.02em;}
.delivery-empty-card-v129{
    width:100%;
    min-height:56px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:12px 14px;
    border-radius:16px;
    border:1px dashed color-mix(in srgb, var(--brand-accent) 22%, transparent);
    background:color-mix(in srgb, var(--brand-panel-soft) 58%, transparent);
    color:var(--brand-muted);
    font-size:13px;
    font-weight:900;
    text-align:center;
}
.delivery-empty-card-v129.ok{border-color:rgba(34,197,94,.24);background:rgba(34,197,94,.08);color:#86efac;}
.delivery-empty-card-v129.error{border-color:rgba(239,68,68,.28);background:rgba(239,68,68,.08);color:#fecaca;}
.settings-delivery-strip-v129{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    flex-wrap:wrap;
    margin:-2px 0 18px;
    padding:12px 14px;
    border-radius:18px;
    border:1px solid color-mix(in srgb, var(--brand-accent) 18%, transparent);
    background:linear-gradient(135deg, color-mix(in srgb, var(--brand-panel-soft) 70%, transparent), color-mix(in srgb, var(--brand-bg-alt) 38%, transparent));
    color:var(--brand-muted);
    font-size:12px;
    font-weight:900;
}
.settings-delivery-strip-v129 strong{color:var(--brand-accent-soft);font-weight:1000;}
body[data-it-theme="light"] .dashboard-status-chip-v129,
body[data-it-theme="light"] .delivery-empty-card-v129,
body[data-it-theme="light"] .settings-delivery-strip-v129{
    background:rgba(248,250,252,.92)!important;
    color:#334155!important;
    border-color:rgba(148,163,184,.34)!important;
}
body[data-it-theme="light"] .dashboard-status-chip-v129.ok,
body[data-it-theme="light"] .delivery-empty-card-v129.ok{background:rgba(34,197,94,.10)!important;color:#047857!important;border-color:rgba(34,197,94,.24)!important;}
body[data-it-theme="light"] .dashboard-status-chip-v129.warn{background:rgba(245,158,11,.12)!important;color:#92400e!important;border-color:rgba(245,158,11,.28)!important;}
body[data-it-theme="light"] .delivery-empty-card-v129.error{background:rgba(239,68,68,.10)!important;color:#b91c1c!important;border-color:rgba(239,68,68,.24)!important;}
body[data-it-theme="light"] .settings-delivery-strip-v129 strong{color:#92400e!important;}
@media(max-width:768px){
    .dashboard-status-strip-v129{align-items:stretch;}
    .dashboard-status-chip-v129{width:100%;}
    .dashboard-stat-card-v129{min-height:102px;}
    .settings-delivery-strip-v129{align-items:flex-start;flex-direction:column;}
}
/* V129_DASHBOARD_SETTINGS_DELIVERY_UI_END */


/* V130_FINAL_PAGE_REVIEW_START */
.delivery-page-strip-v130,
.delivery-net-tab-strip-v130{
  border:1px solid rgba(148,163,184,.16);
  background:linear-gradient(135deg, rgba(15,23,42,.78), rgba(30,41,59,.52));
  box-shadow:0 16px 36px rgba(2,6,23,.18), inset 0 1px 0 rgba(255,255,255,.035);
  color:var(--theme-text, #eef2f7);
  border-radius:22px;
  padding:14px 16px;
  margin:12px 0 16px;
}
.delivery-page-strip-v130{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;}
.delivery-page-strip-copy-v130{display:flex;flex-direction:column;gap:3px;min-width:220px;}
.delivery-page-strip-copy-v130 span,
.delivery-net-tab-strip-v130 span{font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--brand-accent-soft,#f3d99b);}
.delivery-page-strip-copy-v130 strong,
.delivery-net-tab-strip-v130 strong{font-size:16px;font-weight:950;color:var(--theme-text,#f8fafc);}
.delivery-page-strip-copy-v130 small,
.delivery-net-tab-strip-v130 small{font-size:12px;font-weight:800;color:var(--theme-muted,#94a3b8);}
.delivery-page-strip-chips-v130{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.delivery-page-strip-chips-v130 span{border:1px solid rgba(148,163,184,.16);background:rgba(15,23,42,.55);color:var(--theme-muted,#cbd5e1);border-radius:999px;padding:7px 10px;font-size:11px;font-weight:900;}
.delivery-page-strip-chips-v130 span.ok{border-color:rgba(34,197,94,.22);background:rgba(34,197,94,.10);color:#86efac;}
.delivery-net-tab-strip-v130{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:0;}
.delivery-empty-card-v130.device-empty-v130{display:flex!important;align-items:center;justify-content:center;gap:10px;color:var(--theme-muted,#94a3b8)!important;}
.delivery-table-empty-v130{display:flex;align-items:center;justify-content:center;gap:10px;min-height:72px;color:var(--theme-muted,#94a3b8);font-size:13px;}
html[data-it-theme="light"] .delivery-page-strip-v130,
html[data-it-theme="light"] .delivery-net-tab-strip-v130{
  background:linear-gradient(135deg, rgba(255,255,255,.92), rgba(241,245,249,.86));
  border-color:rgba(15,23,42,.10);
  box-shadow:0 14px 32px rgba(15,23,42,.08), inset 0 1px 0 rgba(255,255,255,.7);
}
html[data-it-theme="light"] .delivery-page-strip-chips-v130 span{background:rgba(241,245,249,.86);border-color:rgba(15,23,42,.10);color:#475569;}
html[data-it-theme="light"] .delivery-page-strip-chips-v130 span.ok{background:rgba(22,163,74,.10);border-color:rgba(22,163,74,.20);color:#15803d;}
html[dir="ltr"] .delivery-page-strip-v130,
html[dir="ltr"] .delivery-net-tab-strip-v130{text-align:left;}
.sidebar-nav .nav-btn:focus-visible,
[data-net-tab]:focus-visible,
.delivery-page-strip-v130 button:focus-visible{outline:3px solid color-mix(in srgb, var(--brand-accent) 70%, white);outline-offset:3px;}
@media (max-width: 768px){
  .delivery-page-strip-v130{align-items:flex-start;}
  .delivery-page-strip-chips-v130{width:100%;}
  .delivery-page-strip-chips-v130 span{flex:1;text-align:center;}
}
/* V130_FINAL_PAGE_REVIEW_END */


/* V132_CONTRAST_I18N_PROFESSIONAL_UI_START
   Professional light-theme contrast pass + compact delivery UI. Dark theme identity is untouched. */
html[data-it-theme="light"],
body[data-it-theme="light"]{
    --it-light-text:#0f172a;
    --it-light-text-strong:#020617;
    --it-light-muted:#475569;
    --it-light-muted-soft:#64748b;
    --it-light-panel:#ffffff;
    --it-light-panel-soft:#f8fafc;
    --it-light-border:rgba(15,23,42,.14);
    --it-light-gold:#92400e;
    --it-light-blue:#1d4ed8;
}
body[data-it-theme="light"]{
    color:var(--it-light-text)!important;
    --tw-ring-color:rgba(37,99,235,.18)!important;
}
body[data-it-theme="light"] :where(.text-white,.text-slate-50,.text-slate-100,.text-slate-200,.text-gray-50,.text-gray-100,.text-gray-200,.text-zinc-50,.text-zinc-100,.text-neutral-50,.text-neutral-100,
.text-slate-300,.text-gray-300,.text-zinc-300,.text-neutral-300,
.panel-title,.compact-title,.network-clean-title h1,.modal-title,.device-name,.sidebar-user-name,.login-label,.it-field label,.activation-form-header h2,.activation-brand-copy h1,
.ai-inner span,.font-black.text-white,.font-bold.text-white,.font-semibold.text-white){
    color:var(--it-light-text-strong)!important;
    --tw-text-opacity:1!important;
}
body[data-it-theme="light"] :where(.text-slate-400,.text-slate-500,.text-gray-400,.text-gray-500,.text-zinc-400,.text-neutral-400,.sidebar-tagline,.sidebar-blurb,.panel-meta,.settings-panel-note,.device-subtitle,.activation-form-header p,.activation-info-card small,.login-hint,.it-note,.role-guide-hint,.admin-row-role-hint,.qr-hint-text,.quick-client-file-hint){
    color:var(--it-light-muted)!important;
    --tw-text-opacity:1!important;
}
body[data-it-theme="light"] :where(.theme-accent,.theme-kicker,.theme-chip,.theme-accent-soft,.sidebar-kicker,.section-title-sm){
    color:var(--it-light-gold)!important;
}
body[data-it-theme="light"] :where(input,textarea,select,.input-glass,.it-input,.device-search-input){
    background:rgba(255,255,255,.96)!important;
    color:var(--it-light-text)!important;
    border-color:rgba(15,23,42,.18)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.8)!important;
}
body[data-it-theme="light"] :where(input,textarea,select,.input-glass,.it-input,.device-search-input)::placeholder{
    color:#64748b!important;
    opacity:1!important;
}
body[data-it-theme="light"] :where(.action-btn,.btn-secondary,.login-secondary,.it-btn-ghost,.it-link-btn,.toolbar-btn,.sidebar-user-action,.activation-mini-btn,.ip-btn,.network-clean-primary){
    color:var(--it-light-text)!important;
    background:rgba(248,250,252,.94)!important;
    border-color:rgba(15,23,42,.16)!important;
}
body[data-it-theme="light"] :where(.action-btn:hover,.btn-secondary:hover,.login-secondary:hover,.it-btn-ghost:hover,.it-link-btn:hover,.toolbar-btn:hover,.sidebar-user-action:hover,.activation-mini-btn:hover,.ip-btn:hover,[class*="hover:text-white"]:hover){
    color:var(--it-light-text-strong)!important;
    background:rgba(226,232,240,.96)!important;
}
body[data-it-theme="light"] :where(.card,.compact-card,.device-card,.network-list-card,.modal-content,.activation-card-pro,.activation-brand-panel,.it-login-panel,.it-login-side,.activation-info-card,.activation-legal-box,.login-help-card,.login-actions-hint-item,.backup-restore-hint,.quick-client-output,.qr-download-panel,.ai-terminal-box,.ai-terminal-shell,.ai-live-feed,.ping-result-box){
    color:var(--it-light-text)!important;
    background:linear-gradient(180deg,rgba(255,255,255,.97),rgba(248,250,252,.91))!important;
    border-color:rgba(15,23,42,.13)!important;
}
body[data-it-theme="light"] :where(.zt-table,.zt-table th,.zt-table td,table,thead,tbody,tr,td,th){
    color:var(--it-light-text)!important;
    border-color:rgba(15,23,42,.13)!important;
}
body[data-it-theme="light"] :where(.terminal-text,.ai-feed-line,.ai-live-feed,.quick-client-output,.ping-result-box,.mono,.font-mono){
    color:#1e293b!important;
}
body[data-it-theme="light"] .terminal-text .text-slate-500,
body[data-it-theme="light"] .ai-terminal-box .text-slate-500{color:#475569!important;}
body[data-it-theme="light"] :where(.lux-inline-badge,.role-badge,.status-badge,.metric-chip,.managed-pill,.route-status-badge,.device-status-label-v127){
    text-shadow:none!important;
}
body[data-it-theme="light"] .text-green-400,
body[data-it-theme="light"] .text-emerald-400,
body[data-it-theme="light"] .text-green-500\/70{color:#047857!important;--tw-text-opacity:1!important;}
body[data-it-theme="light"] .text-red-400,
body[data-it-theme="light"] .text-red-500,
body[data-it-theme="light"] .text-red-500\/70{color:#b91c1c!important;--tw-text-opacity:1!important;}
body[data-it-theme="light"] .text-yellow-500,
body[data-it-theme="light"] .text-yellow-500\/70,
body[data-it-theme="light"] .text-amber-400{color:#92400e!important;--tw-text-opacity:1!important;}
body[data-it-theme="light"] .text-blue-400,
body[data-it-theme="light"] .text-sky-300,
body[data-it-theme="light"] .text-cyan-300{color:#1d4ed8!important;--tw-text-opacity:1!important;}
body[data-it-theme="light"] .text-purple-300,
body[data-it-theme="light"] .text-purple-400,
body[data-it-theme="light"] .text-violet-300,
body[data-it-theme="light"] .text-fuchsia-300,
body[data-it-theme="light"] .text-indigo-400{color:#6d28d9!important;--tw-text-opacity:1!important;}
body[data-it-theme="light"] .bg-slate-800\/80,
body[data-it-theme="light"] .bg-slate-900\/70,
body[data-it-theme="light"] .bg-slate-950\/70,
body[data-it-theme="light"] [class*="bg-slate-"]{
    background-color:rgba(248,250,252,.94)!important;
}
body[data-it-theme="light"] .border-slate-700,
body[data-it-theme="light"] .border-slate-800,
body[data-it-theme="light"] [class*="border-slate-"]{
    border-color:rgba(15,23,42,.14)!important;
}
/* Login and activation pages when the saved Light theme is active. */
body[data-it-theme="light"] .it-login-lux{
    background:radial-gradient(circle at 0% 0%,rgba(234,179,8,.14),transparent 28%),radial-gradient(circle at 100% 100%,rgba(37,99,235,.10),transparent 30%),linear-gradient(145deg,#f8fafc 0%,#eef3f8 52%,#e2e8f0 100%)!important;
    color:var(--it-light-text)!important;
}
body[data-it-theme="light"] .it-login-side h1,
body[data-it-theme="light"] .it-panel-head h2,
body[data-it-theme="light"] .activation-brand-copy h1{color:var(--it-light-text-strong)!important;}
body[data-it-theme="light"] .it-login-side p,
body[data-it-theme="light"] .it-panel-head p,
body[data-it-theme="light"] .it-meta,
body[data-it-theme="light"] .copyright-link{color:var(--it-light-muted)!important;}
body[data-it-theme="light"] .it-check{background:rgba(248,250,252,.94)!important;color:var(--it-light-text)!important;border-color:rgba(15,23,42,.14)!important;}
/* Compact professional text mode: explanatory help stays available but no longer dominates delivery screens. */
body[data-it-ui-density="delivery"] :where(.delivery-page-strip-v130,.delivery-net-tab-strip-v130,.settings-delivery-strip-v129,.dashboard-status-chip-v129){
    padding:7px 10px!important;
    min-height:0!important;
    opacity:.82!important;
}
body[data-it-ui-density="delivery"] .delivery-page-strip-v130 small,
body[data-it-ui-density="delivery"] .delivery-page-strip-chips-v130 span:not(.ok),
body[data-it-ui-density="delivery"] .delivery-net-tab-strip-v130 small{
    display:none!important;
}
body[data-it-ui-density="delivery"] :where(.role-guide-hint,.admin-row-role-hint,.settings-panel-note,.login-hint,.it-note,.qr-hint-text,.activation-legal-box,.backup-restore-hint,.quick-client-file-hint,.login-access-hints,.login-actions-hint,.login-help-card){
    font-size:11px!important;
    line-height:1.45!important;
    opacity:.72!important;
    max-height:42px;
    overflow:hidden;
    transition:max-height .18s ease, opacity .18s ease;
}
body[data-it-ui-density="delivery"] :where(.role-guide-hint,.admin-row-role-hint,.settings-panel-note,.login-hint,.it-note,.qr-hint-text,.activation-legal-box,.backup-restore-hint,.quick-client-file-hint,.login-access-hints,.login-actions-hint,.login-help-card):hover{
    max-height:260px;
    opacity:1!important;
}
body[data-it-theme="light"] body,
body[data-it-theme="light"] .text-white *{text-shadow:none!important;}
/* V132_CONTRAST_I18N_PROFESSIONAL_UI_END */


/* V133_UI_POLISH_FULL_I18N_CONTRAST_START
   Page-by-page UI polish: stronger Light contrast, compact explanatory copy, and RTL/LTR pseudo-text fixes.
   Dark theme identity and existing layout are preserved. */
html[data-it-theme="light"], body[data-it-theme="light"]{
  --it-light-text:#0b1220;
  --it-light-text-strong:#020617;
  --it-light-muted:#334155;
  --it-light-muted-soft:#475569;
  --it-light-panel:#ffffff;
  --it-light-panel-soft:#f8fafc;
  --it-light-border:rgba(15,23,42,.15);
  --it-light-border-strong:rgba(15,23,42,.22);
  --it-light-shadow:0 16px 42px rgba(15,23,42,.09);
}
body[data-it-theme="light"]{
  background:
    radial-gradient(circle at 12% 0%, rgba(214,158,46,.14), transparent 26%),
    radial-gradient(circle at 88% 0%, rgba(37,99,235,.10), transparent 28%),
    linear-gradient(180deg,#f8fafc 0%,#eef3f8 58%,#e2e8f0 100%)!important;
  color:var(--it-light-text)!important;
}
body[data-it-theme="light"] :where(
  .card,.compact-card,.device-card,.device-row,.network-list-card,.modal-content,.modal-card,
  .app-sidebar,.sidebar-brand-card,.sidebar-user-card,.sidebar-status-card,.sidebar-mini-tile,
  .network-clean-header,.net-header-shell,.network-summary-shell,.settings-quick-card,
  .activation-card-pro,.activation-brand-panel,.it-login-panel,.it-login-side,.login-card-pro,.login-brand-panel,
  .quick-client-form,.quick-client-qr-panel,.quick-client-output,.qr-download-panel,
  .ai-terminal-box,.ai-terminal-shell,.ai-live-feed,.ping-result-box,.branch-metric-card,.audit-row-card,
  .networks-compact-head,.networks-compact-card,.network-kpi-card,.network-quick-item,
  .route-card,.backup-card,.backup-library-card,.server-settings-card,.admin-card
){
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.92))!important;
  color:var(--it-light-text)!important;
  border-color:var(--it-light-border)!important;
  box-shadow:var(--it-light-shadow), inset 0 1px 0 rgba(255,255,255,.78)!important;
}
body[data-it-theme="light"] :where(
  .text-white,.text-white *,[class*="text-white"],[class*="text-slate-50"],[class*="text-slate-100"],[class*="text-slate-200"],
  .text-gray-50,.text-gray-100,.text-gray-200,.text-zinc-50,.text-zinc-100,.text-neutral-50,.text-neutral-100,
  h1,h2,h3,h4,h5,h6,.panel-title,.compact-title,.device-name,.network-clean-title h1,.sidebar-user-name,
  .network-kpi-value,.net-header-pill-value,.settings-quick-card strong,.login-flow-step strong,.activation-status-main strong
){
  color:var(--it-light-text-strong)!important;
  --tw-text-opacity:1!important;
  text-shadow:none!important;
}
body[data-it-theme="light"] :where(
  .text-slate-300,.text-slate-400,.text-slate-500,.text-gray-300,.text-gray-400,.text-gray-500,
  .text-zinc-300,.text-zinc-400,.text-neutral-300,.text-neutral-400,
  .sidebar-tagline,.sidebar-blurb,.device-subtitle,.panel-meta,.settings-panel-note,.network-clean-title p,
  .network-kpi-label,.net-header-meta-line,.net-header-pill-label,.quick-client-subtitle,.quick-client-note,
  .login-hint,.activation-form-header p,.activation-info-card small,.it-note,.role-guide-hint,.admin-row-role-hint
){
  color:var(--it-light-muted)!important;
  --tw-text-opacity:1!important;
  text-shadow:none!important;
}
body[data-it-theme="light"] :where(input,textarea,select,.input-glass,.it-input,.device-search-input,.network-bundle-preview){
  background:rgba(255,255,255,.98)!important;
  color:var(--it-light-text)!important;
  border-color:var(--it-light-border-strong)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85)!important;
  caret-color:#1d4ed8!important;
}
body[data-it-theme="light"] :where(input,textarea,select,.input-glass,.it-input,.device-search-input,.network-bundle-preview)::placeholder{
  color:#64748b!important; opacity:1!important;
}
body[data-it-theme="light"] :where(
  [class*="bg-[#020617]"],[class*="bg-[#0f172a]"],[class*="bg-slate-950"],[class*="bg-slate-900"],[class*="bg-slate-800"],
  .terminal-text,.ai-feed-line,.qr-placeholder,.quick-client-qr-box-wrap,.network-quick-qr,.device-search-wrap
){
  background:rgba(248,250,252,.95)!important;
  color:var(--it-light-text)!important;
  border-color:var(--it-light-border)!important;
}
body[data-it-theme="light"] :where([class*="border-slate-"],[class*="border-gray-"],[class*="border-zinc-"]){border-color:var(--it-light-border)!important;}
body[data-it-theme="light"] :where(.font-mono,.mono,.terminal-text,.network-quick-value,.metric-value,.zt-table td){color:#1e293b!important;}
/* keep real colored action buttons readable in Light theme */
body[data-it-theme="light"] :where(
  .bg-blue-600,.bg-indigo-600,.bg-cyan-600,.bg-sky-600,.bg-emerald-600,.bg-green-600,.bg-red-600,.bg-rose-600,.bg-purple-600,
  .hover\:bg-blue-500:hover,.hover\:bg-indigo-500:hover,.btn-primary,.login-submit,.network-clean-primary.it-primary,.it-primary
){
  color:#ffffff!important;
  text-shadow:none!important;
}
body[data-it-theme="light"] :where(.btn-primary,.login-submit){background:linear-gradient(135deg,#1d4ed8,#b7791f)!important;border-color:rgba(15,23,42,.10)!important;}
body[data-it-theme="light"] :where(.text-emerald-300,.text-emerald-400,.text-green-300,.text-green-400){color:#047857!important;}
body[data-it-theme="light"] :where(.text-red-300,.text-red-400,.text-rose-300,.text-rose-400){color:#b91c1c!important;}
body[data-it-theme="light"] :where(.text-amber-300,.text-amber-400,.text-yellow-300,.text-yellow-400){color:#92400e!important;}
body[data-it-theme="light"] :where(.text-cyan-300,.text-cyan-400,.text-sky-300,.text-sky-400,.text-blue-300,.text-blue-400){color:#1d4ed8!important;}
body[data-it-theme="light"] :where(.text-indigo-300,.text-indigo-400,.text-purple-300,.text-purple-400,.text-violet-300,.text-violet-400){color:#6d28d9!important;}
body[data-it-theme="light"] .zt-table th{background:rgba(241,245,249,.96)!important;color:#334155!important;}
body[data-it-theme="light"] .zt-table tr:hover td{background:rgba(226,232,240,.55)!important;}
body[data-it-theme="light"] .toast{box-shadow:0 18px 45px rgba(15,23,42,.16)!important;}
/* Compact delivery copy: keep information available, but stop long help paragraphs dominating the UI. */
body[data-it-ui-density="delivery"] :where(
  .settings-hero-note,.quick-client-subtitle,.quick-client-note,.role-guide-intro,.role-guide-warning,.brand-legal-box,
  .activation-legal-box,.activation-status-note,.backup-restore-hint,.login-help-card,.login-actions-hint,.login-access-hints,
  .network-summary-subtitle,.network-quick-note,.qr-hint-text,.delivery-page-strip-copy-v130 small,.delivery-net-tab-strip-v130 small
){
  font-size:11px!important;
  line-height:1.35!important;
  opacity:.60!important;
  max-height:28px!important;
  overflow:hidden!important;
  margin-block:4px!important;
}
body[data-it-ui-density="delivery"] :where(
  .settings-hero-note,.quick-client-subtitle,.quick-client-note,.role-guide-intro,.role-guide-warning,.brand-legal-box,
  .activation-legal-box,.activation-status-note,.backup-restore-hint,.login-help-card,.login-actions-hint,.login-access-hints,
  .network-summary-subtitle,.network-quick-note,.qr-hint-text,.delivery-page-strip-copy-v130 small,.delivery-net-tab-strip-v130 small
):hover,
body[data-it-ui-density="delivery"] :where(
  .settings-hero-note,.quick-client-subtitle,.quick-client-note,.role-guide-intro,.role-guide-warning,.brand-legal-box,
  .activation-legal-box,.activation-status-note,.backup-restore-hint,.login-help-card,.login-actions-hint,.login-access-hints,
  .network-summary-subtitle,.network-quick-note,.qr-hint-text,.delivery-page-strip-copy-v130 small,.delivery-net-tab-strip-v130 small
):focus-within{
  max-height:220px!important; opacity:1!important;
}
body[data-it-ui-density="delivery"] :where(.delivery-page-strip-v130,.delivery-net-tab-strip-v130,.settings-delivery-strip-v129,.dashboard-status-strip-v129){margin-block:6px 10px!important;}
/* Pseudo text translations for collapsed quick client blocks. */
html[dir="ltr"] .quick-client-shell.compact::after{content:"Section collapsed to save space. Click Show section to open the form and QR."!important;}
html[dir="rtl"] .quick-client-shell.compact::after{content:"القسم مطوي لتوفير المساحة. اضغط إظهار القسم لفتح النموذج وQR."!important;}
/* floating login/activation preference switcher */
.it-v133-pref-switcher{position:fixed;z-index:120;inset-block-start:16px;inset-inline-end:16px;display:flex;gap:6px;align-items:center;padding:7px;border-radius:18px;border:1px solid rgba(148,163,184,.18);background:rgba(15,23,42,.72);backdrop-filter:blur(12px);box-shadow:0 16px 42px rgba(2,6,23,.22)}
.it-v133-pref-switcher button{min-width:42px;min-height:32px;border-radius:12px;border:1px solid rgba(148,163,184,.18);background:rgba(255,255,255,.06);color:#e2e8f0;font-size:11px;font-weight:900;cursor:pointer}
.it-v133-pref-switcher button.active{background:linear-gradient(135deg,var(--brand-accent,#c9a44d),var(--brand-accent-soft,#f0d48a));color:#111827;border-color:transparent}
body[data-it-theme="light"] .it-v133-pref-switcher{background:rgba(255,255,255,.86);border-color:rgba(15,23,42,.13);box-shadow:0 16px 42px rgba(15,23,42,.10)}
body[data-it-theme="light"] .it-v133-pref-switcher button{background:rgba(248,250,252,.92);color:#0f172a;border-color:rgba(15,23,42,.13)}
html[dir="ltr"] .zt-table.responsive-mobile td::before{right:auto;left:10px;text-align:left;}
html[dir="ltr"] .networks-compact-mini, html[dir="ltr"] .networks-compact-id{text-align:left;}
@media(max-width:760px){.it-v133-pref-switcher{inset-block-start:auto;inset-block-end:16px;inset-inline-end:12px}}
/* V133_UI_POLISH_FULL_I18N_CONTRAST_END */


/* V134_PROFESSIONAL_UI_THEME_I18N_REFINEMENT_START */
:root,
html[data-it-theme="dark"],
body[data-it-theme="dark"]{
  color-scheme: dark;
  --brand-bg:#0b1220!important;
  --brand-bg-alt:#111a2c!important;
  --brand-panel:#122033!important;
  --brand-panel-soft:#16273d!important;
  --brand-text:#e7eef8!important;
  --brand-muted:#8ea2bd!important;
  --brand-accent:#2563eb!important;
  --brand-accent-soft:#60a5fa!important;
}
html[data-it-theme="light"],
body[data-it-theme="light"]{
  color-scheme: light;
  --brand-bg:#f4f7fb!important;
  --brand-bg-alt:#ecf2f8!important;
  --brand-panel:#ffffff!important;
  --brand-panel-soft:#f5f8fc!important;
  --brand-text:#0f172a!important;
  --brand-muted:#516176!important;
  --brand-accent:#2563eb!important;
  --brand-accent-soft:#60a5fa!important;
}
html[data-it-theme="dark"] body,
body[data-it-theme="dark"]{
  background:
    radial-gradient(circle at 12% 0%, rgba(96,165,250,.14), transparent 30%),
    radial-gradient(circle at 88% 12%, rgba(37,99,235,.12), transparent 26%),
    linear-gradient(180deg, #0b1220 0%, #0f1728 55%, #0b1220 100%)!important;
  color:var(--brand-text)!important;
}
html[data-it-theme="light"] body,
body[data-it-theme="light"]{
  background:
    radial-gradient(circle at 14% 0%, rgba(96,165,250,.10), transparent 24%),
    radial-gradient(circle at 92% 12%, rgba(37,99,235,.08), transparent 22%),
    linear-gradient(180deg, #f8fbff 0%, #f2f6fb 54%, #edf3f8 100%)!important;
  color:var(--brand-text)!important;
}
body[data-it-theme="dark"] .card,
body[data-it-theme="dark"] .compact-card,
body[data-it-theme="dark"] .device-card,
body[data-it-theme="dark"] .network-list-card,
body[data-it-theme="dark"] .section-shell,
body[data-it-theme="dark"] .app-sidebar,
body[data-it-theme="dark"] .sidebar-brand-card,
body[data-it-theme="dark"] .sidebar-user-card,
body[data-it-theme="dark"] .sidebar-mini-tile,
body[data-it-theme="dark"] .sidebar-status-card,
body[data-it-theme="dark"] .pending-devices-section,
body[data-it-theme="dark"] .active-devices-section,
body[data-it-theme="dark"] .network-clean-header,
body[data-it-theme="dark"] .login-card-pro,
body[data-it-theme="dark"] .login-brand-panel,
body[data-it-theme="dark"] .login-form-shell,
body[data-it-theme="dark"] .network-quick-item,
body[data-it-theme="dark"] .network-quick-qr,
body[data-it-theme="dark"] .table-shell,
body[data-it-theme="dark"] .chart-shell,
body[data-it-theme="dark"] .login-note-card,
body[data-it-theme="dark"] .login-secondary{
  background: linear-gradient(180deg, rgba(18,32,51,.95), rgba(12,23,39,.90))!important;
  border-color: rgba(96,165,250,.16)!important;
  box-shadow: 0 20px 44px rgba(2,8,20,.32), inset 0 1px 0 rgba(255,255,255,.03)!important;
}
body[data-it-theme="dark"] .sidebar-nav .nav-btn,
body[data-it-theme="dark"] .toolbar-btn,
body[data-it-theme="dark"] .device-search-wrap,
body[data-it-theme="dark"] .input-glass,
body[data-it-theme="dark"] .ip-btn,
body[data-it-theme="dark"] .metric-chip,
body[data-it-theme="dark"] .device-status-card,
body[data-it-theme="dark"] .password-toggle{
  background: rgba(15,23,42,.82)!important;
  border-color: rgba(96,165,250,.16)!important;
  color: var(--brand-text)!important;
}
body[data-it-theme="dark"] .sidebar-nav .nav-btn.active,
body[data-it-theme="dark"] .sidebar-nav .nav-btn:hover,
body[data-it-theme="dark"] .toolbar-btn:hover{
  background: linear-gradient(135deg, rgba(37,99,235,.18), rgba(96,165,250,.10))!important;
  border-color: rgba(96,165,250,.34)!important;
  color:#eff6ff!important;
  box-shadow: 0 12px 24px rgba(37,99,235,.14)!important;
}
body[data-it-theme="dark"] .btn-primary,
body[data-it-theme="dark"] .network-clean-primary,
body[data-it-theme="dark"] .sidebar-floating-toggle,
body[data-it-theme="dark"] .it-top-choice-btn.active,
body[data-it-theme="dark"] .login-submit,
body[data-it-theme="dark"] .login-tab.active{
  background: linear-gradient(135deg, #2563eb, #60a5fa)!important;
  color:#eff6ff!important;
  border-color: transparent!important;
  box-shadow: 0 14px 30px rgba(37,99,235,.22)!important;
}
body[data-it-theme="light"] .card,
body[data-it-theme="light"] .compact-card,
body[data-it-theme="light"] .device-card,
body[data-it-theme="light"] .network-list-card,
body[data-it-theme="light"] .section-shell,
body[data-it-theme="light"] .app-sidebar,
body[data-it-theme="light"] .sidebar-brand-card,
body[data-it-theme="light"] .sidebar-user-card,
body[data-it-theme="light"] .sidebar-mini-tile,
body[data-it-theme="light"] .sidebar-status-card,
body[data-it-theme="light"] .pending-devices-section,
body[data-it-theme="light"] .active-devices-section,
body[data-it-theme="light"] .network-clean-header,
body[data-it-theme="light"] .login-card-pro,
body[data-it-theme="light"] .login-brand-panel,
body[data-it-theme="light"] .login-form-shell,
body[data-it-theme="light"] .network-quick-item,
body[data-it-theme="light"] .network-quick-qr,
body[data-it-theme="light"] .table-shell,
body[data-it-theme="light"] .chart-shell,
body[data-it-theme="light"] .login-note-card,
body[data-it-theme="light"] .login-secondary,
body[data-it-theme="light"] .brand-feature,
body[data-it-theme="light"] .brand-legal-box,
body[data-it-theme="light"] .login-stat-card,
body[data-it-theme="light"] .login-trust-item{
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(245,248,252,.92))!important;
  border-color: rgba(148,163,184,.26)!important;
  box-shadow: 0 18px 40px rgba(15,23,42,.08), inset 0 1px 0 rgba(255,255,255,.92)!important;
}
body[data-it-theme="light"] .panel-title,
body[data-it-theme="light"] .compact-title,
body[data-it-theme="light"] .login-hero-title,
body[data-it-theme="light"] .login-brand-panel strong,
body[data-it-theme="light"] .brand-feature strong,
body[data-it-theme="light"] .login-trust-item strong,
body[data-it-theme="light"] .login-stat-card strong,
body[data-it-theme="light"] .field-label,
body[data-it-theme="light"] .login-label,
body[data-it-theme="light"] .device-name,
body[data-it-theme="light"] .sidebar-user-name,
body[data-it-theme="light"] .network-clean-title h1,
body[data-it-theme="light"] .network-quick-value,
body[data-it-theme="light"] .metric-value,
body[data-it-theme="light"] .zt-table td,
body[data-it-theme="light"] .zt-table th,
body[data-it-theme="light"] .login-note-card,
body[data-it-theme="light"] .brand-legal-box,
body[data-it-theme="light"] .brand-feature p,
body[data-it-theme="light"] .login-hint,
body[data-it-theme="light"] .login-hero-text,
body[data-it-theme="light"] .login-stat-card span,
body[data-it-theme="light"] .login-trust-item p,
body[data-it-theme="light"] .panel-meta,
body[data-it-theme="light"] .settings-panel-note,
body[data-it-theme="light"] .network-clean-title p,
body[data-it-theme="light"] .network-quick-note,
body[data-it-theme="light"] .device-toolbar-meta,
body[data-it-theme="light"] .app-footer,
body[data-it-theme="light"] .copyright-link,
body[data-it-theme="light"] .field-caption,
body[data-it-theme="light"] .help-note,
body[data-it-theme="light"] .text-slate-50,
body[data-it-theme="light"] .text-slate-100,
body[data-it-theme="light"] .text-slate-200,
body[data-it-theme="light"] .text-slate-300,
body[data-it-theme="light"] .text-slate-400,
body[data-it-theme="light"] .text-slate-500,
body[data-it-theme="light"] .text-gray-50,
body[data-it-theme="light"] .text-gray-100,
body[data-it-theme="light"] .text-gray-200,
body[data-it-theme="light"] .text-gray-300,
body[data-it-theme="light"] .text-gray-400,
body[data-it-theme="light"] .text-gray-500,
body[data-it-theme="light"] .text-zinc-100,
body[data-it-theme="light"] .text-zinc-200,
body[data-it-theme="light"] .text-zinc-300,
body[data-it-theme="light"] .text-zinc-400,
body[data-it-theme="light"] [class*="text-white"]{
  color:#0f172a!important;
}
body[data-it-theme="light"] .brand-chip,
body[data-it-theme="light"] .sidebar-kicker,
body[data-it-theme="light"] .analytics-chip,
body[data-it-theme="light"] .section-chip,
body[data-it-theme="light"] .section-title-sm,
body[data-it-theme="light"] .theme-kicker,
body[data-it-theme="light"] .theme-accent,
body[data-it-theme="light"] .theme-chip,
body[data-it-theme="light"] .network-quick-copy,
body[data-it-theme="light"] .login-badge,
body[data-it-theme="light"] .login-overline,
body[data-it-theme="light"] .net-header-kicker,
body[data-it-theme="light"] .delivery-page-strip-v130 span,
body[data-it-theme="light"] .settings-delivery-strip-v129 strong{
  color:#1d4ed8!important;
}
body[data-it-theme="light"] .sidebar-nav .nav-btn,
body[data-it-theme="light"] .toolbar-btn,
body[data-it-theme="light"] .device-search-wrap,
body[data-it-theme="light"] .input-glass,
body[data-it-theme="light"] .ip-btn,
body[data-it-theme="light"] .metric-chip,
body[data-it-theme="light"] .device-status-card,
body[data-it-theme="light"] .password-toggle,
body[data-it-theme="light"] .login-tab{
  background: rgba(248,250,252,.96)!important;
  border-color: rgba(148,163,184,.28)!important;
  color:#0f172a!important;
}
body[data-it-theme="light"] .sidebar-nav .nav-btn.active,
body[data-it-theme="light"] .sidebar-nav .nav-btn:hover,
body[data-it-theme="light"] .toolbar-btn:hover,
body[data-it-theme="light"] .login-tab.active{
  background: linear-gradient(135deg, rgba(37,99,235,.16), rgba(96,165,250,.12))!important;
  border-color: rgba(37,99,235,.30)!important;
  color:#0f172a!important;
  box-shadow: 0 12px 24px rgba(37,99,235,.10)!important;
}
body[data-it-theme="light"] .btn-primary,
body[data-it-theme="light"] .network-clean-primary,
body[data-it-theme="light"] .sidebar-floating-toggle,
body[data-it-theme="light"] .it-top-choice-btn.active,
body[data-it-theme="light"] .login-submit{
  background: linear-gradient(135deg, #2563eb, #60a5fa)!important;
  color:#eff6ff!important;
  border-color: transparent!important;
  box-shadow: 0 14px 28px rgba(37,99,235,.18)!important;
}
body[data-it-theme="light"] .password-toggle,
body[data-it-theme="light"] .login-secondary,
body[data-it-theme="light"] .toolbar-btn,
body[data-it-theme="light"] .input-glass,
body[data-it-theme="light"] .ip-btn,
body[data-it-theme="light"] .device-search-wrap{
  color:#0f172a!important;
}
body[data-it-theme="light"] .input-glass::placeholder,
body[data-it-theme="light"] .device-search-input::placeholder,
body[data-it-theme="light"] textarea::placeholder{
  color:#64748b!important;
}
body[data-it-theme="light"] .zt-table th,
body[data-it-theme="light"] .zt-table td,
body[data-it-theme="light"] .device-card,
body[data-it-theme="light"] .network-list-card,
body[data-it-theme="light"] .network-quick-item,
body[data-it-theme="light"] .network-quick-qr,
body[data-it-theme="light"] .metric-chip,
body[data-it-theme="light"] .table-shell,
body[data-it-theme="light"] .chart-shell{
  border-color: rgba(148,163,184,.24)!important;
}
body[data-it-theme="light"] .login-orb-a,
body[data-it-theme="light"] .login-orb-b{
  opacity:.14!important;
}
body[data-it-theme="light"] .brand-mark,
body[data-it-theme="light"] .login-icon-wrap{
  background: linear-gradient(135deg, rgba(37,99,235,.12), rgba(96,165,250,.14))!important;
  border-color: rgba(37,99,235,.18)!important;
}
body[data-it-ui-density="delivery"] .login-note-card,
body[data-it-ui-density="delivery"] .brand-legal-box,
body[data-it-ui-density="delivery"] .brand-feature p,
body[data-it-ui-density="delivery"] .login-hint,
body[data-it-ui-density="delivery"] .login-hero-text,
body[data-it-ui-density="delivery"] .panel-meta,
body[data-it-ui-density="delivery"] .it-top-appearance-note,
body[data-it-ui-density="delivery"] .network-quick-note,
body[data-it-ui-density="delivery"] .settings-panel-note,
body[data-it-ui-density="delivery"] .help-note,
body[data-it-ui-density="delivery"] .form-help,
body[data-it-ui-density="delivery"] .hint-text,
body[data-it-ui-density="delivery"] .muted-help{
  opacity:.78;
  font-size:12px!important;
  line-height:1.7!important;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  max-width:100%;
  transition:opacity .18s ease, max-height .18s ease;
}
body[data-it-ui-density="delivery"] .login-note-card:hover,
body[data-it-ui-density="delivery"] .brand-legal-box:hover,
body[data-it-ui-density="delivery"] .brand-feature:hover p,
body[data-it-ui-density="delivery"] .login-hint:hover,
body[data-it-ui-density="delivery"] .login-hero-text:hover,
body[data-it-ui-density="delivery"] .panel-meta:hover,
body[data-it-ui-density="delivery"] .it-top-appearance-note:hover,
body[data-it-ui-density="delivery"] .network-quick-note:hover,
body[data-it-ui-density="delivery"] .settings-panel-note:hover,
body[data-it-ui-density="delivery"] .help-note:hover,
body[data-it-ui-density="delivery"] .form-help:hover,
body[data-it-ui-density="delivery"] .hint-text:hover,
body[data-it-ui-density="delivery"] .muted-help:hover{
  -webkit-line-clamp:unset;
  overflow:visible;
  opacity:1;
}
/* V134_PROFESSIONAL_UI_THEME_I18N_REFINEMENT_END */


/* V135_EXECUTIVE_VISUAL_POLISH_START */
:root,
html[data-it-visual-level="executive"],
body[data-it-visual-level="executive"]{
  --it-executive-radius: 20px;
  --it-executive-radius-sm: 14px;
  --it-executive-shadow: 0 22px 54px rgba(15,23,42,.16);
  --it-executive-shadow-dark: 0 22px 56px rgba(2,8,20,.34);
}
body[data-it-visual-level="executive"] .card,
body[data-it-visual-level="executive"] .compact-card,
body[data-it-visual-level="executive"] .device-card,
body[data-it-visual-level="executive"] .network-list-card,
body[data-it-visual-level="executive"] .section-shell,
body[data-it-visual-level="executive"] .table-shell,
body[data-it-visual-level="executive"] .chart-shell,
body[data-it-visual-level="executive"] .app-sidebar,
body[data-it-visual-level="executive"] .network-clean-header,
body[data-it-visual-level="executive"] .login-card-pro,
body[data-it-visual-level="executive"] .login-brand-panel,
body[data-it-visual-level="executive"] .login-form-shell,
body[data-it-visual-level="executive"] .network-quick-item,
body[data-it-visual-level="executive"] .network-quick-qr,
body[data-it-visual-level="executive"] .login-note-card,
body[data-it-visual-level="executive"] .brand-feature,
body[data-it-visual-level="executive"] .brand-legal-box,
body[data-it-visual-level="executive"] .login-stat-card,
body[data-it-visual-level="executive"] .login-trust-item{
  border-radius: var(--it-executive-radius)!important;
}
body[data-it-theme="dark"][data-it-visual-level="executive"] .card,
body[data-it-theme="dark"][data-it-visual-level="executive"] .compact-card,
body[data-it-theme="dark"][data-it-visual-level="executive"] .device-card,
body[data-it-theme="dark"][data-it-visual-level="executive"] .network-list-card,
body[data-it-theme="dark"][data-it-visual-level="executive"] .section-shell,
body[data-it-theme="dark"][data-it-visual-level="executive"] .table-shell,
body[data-it-theme="dark"][data-it-visual-level="executive"] .chart-shell,
body[data-it-theme="dark"][data-it-visual-level="executive"] .app-sidebar,
body[data-it-theme="dark"][data-it-visual-level="executive"] .network-clean-header,
body[data-it-theme="dark"][data-it-visual-level="executive"] .login-card-pro,
body[data-it-theme="dark"][data-it-visual-level="executive"] .login-brand-panel,
body[data-it-theme="dark"][data-it-visual-level="executive"] .login-form-shell,
body[data-it-theme="dark"][data-it-visual-level="executive"] .network-quick-item,
body[data-it-theme="dark"][data-it-visual-level="executive"] .network-quick-qr{
  box-shadow: var(--it-executive-shadow-dark)!important;
  border-color: rgba(96,165,250,.18)!important;
}
body[data-it-theme="light"][data-it-visual-level="executive"] .card,
body[data-it-theme="light"][data-it-visual-level="executive"] .compact-card,
body[data-it-theme="light"][data-it-visual-level="executive"] .device-card,
body[data-it-theme="light"][data-it-visual-level="executive"] .network-list-card,
body[data-it-theme="light"][data-it-visual-level="executive"] .section-shell,
body[data-it-theme="light"][data-it-visual-level="executive"] .table-shell,
body[data-it-theme="light"][data-it-visual-level="executive"] .chart-shell,
body[data-it-theme="light"][data-it-visual-level="executive"] .app-sidebar,
body[data-it-theme="light"][data-it-visual-level="executive"] .network-clean-header,
body[data-it-theme="light"][data-it-visual-level="executive"] .login-card-pro,
body[data-it-theme="light"][data-it-visual-level="executive"] .login-brand-panel,
body[data-it-theme="light"][data-it-visual-level="executive"] .login-form-shell,
body[data-it-theme="light"][data-it-visual-level="executive"] .network-quick-item,
body[data-it-theme="light"][data-it-visual-level="executive"] .network-quick-qr{
  box-shadow: var(--it-executive-shadow)!important;
  border-color: rgba(148,163,184,.22)!important;
}
body[data-it-visual-level="executive"] .app-sidebar{
  padding: 22px!important;
}
body[data-it-visual-level="executive"] .sidebar-brand-card,
body[data-it-visual-level="executive"] .sidebar-user-card,
body[data-it-visual-level="executive"] .sidebar-status-card,
body[data-it-visual-level="executive"] .sidebar-mini-tile{
  border-radius: 18px!important;
}
body[data-it-visual-level="executive"] .sidebar-nav{
  gap: 10px!important;
}
body[data-it-visual-level="executive"] .sidebar-nav .nav-btn{
  min-height: 68px!important;
  border-radius: 18px!important;
  padding: 12px 16px!important;
  border: 1px solid transparent;
}
body[data-it-visual-level="executive"] .nav-btn-icon{
  width: 46px!important;
  height: 46px!important;
  border-radius: 15px!important;
}
body[data-it-visual-level="executive"] .sidebar-nav .nav-btn.active,
body[data-it-visual-level="executive"] .sidebar-nav .nav-btn:hover{
  transform: translateY(-1px);
}
body[data-it-visual-level="executive"] .btn-primary,
body[data-it-visual-level="executive"] .toolbar-btn,
body[data-it-visual-level="executive"] .network-clean-primary,
body[data-it-visual-level="executive"] .ip-btn,
body[data-it-visual-level="executive"] .sidebar-floating-toggle,
body[data-it-visual-level="executive"] .network-quick-actions .action-btn,
body[data-it-visual-level="executive"] .login-submit,
body[data-it-visual-level="executive"] .login-secondary,
body[data-it-visual-level="executive"] .login-tab,
body[data-it-visual-level="executive"] .it-top-choice-btn{
  border-radius: 14px!important;
  font-weight: 900!important;
  letter-spacing: .01em;
}
body[data-it-visual-level="executive"] .toolbar-btn,
body[data-it-visual-level="executive"] .ip-btn,
body[data-it-visual-level="executive"] .network-quick-actions .action-btn,
body[data-it-visual-level="executive"] .it-top-choice-btn{
  min-height: 40px!important;
  padding-inline: 14px!important;
}
body[data-it-visual-level="executive"] .panel-title,
body[data-it-visual-level="executive"] .compact-title,
body[data-it-visual-level="executive"] .login-hero-title,
body[data-it-visual-level="executive"] .network-clean-title h1{
  letter-spacing: -.02em;
  font-weight: 1000!important;
}
body[data-it-visual-level="executive"] .panel-meta,
body[data-it-visual-level="executive"] .login-hint,
body[data-it-visual-level="executive"] .network-quick-note,
body[data-it-visual-level="executive"] .settings-panel-note,
body[data-it-visual-level="executive"] .device-toolbar-meta,
body[data-it-visual-level="executive"] .app-footer{
  line-height: 1.8!important;
}
body[data-it-visual-level="executive"] #view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 .card{
  padding: 20px!important;
  overflow: hidden;
}
body[data-it-visual-level="executive"] #view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 .card strong,
body[data-it-visual-level="executive"] #view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 .card .metric-value{
  font-size: 30px!important;
  line-height: 1.1!important;
}
body[data-it-visual-level="executive"] .device-card{
  padding: 18px 18px 16px!important;
  gap: 14px!important;
}
body[data-it-visual-level="executive"] .device-card .badge,
body[data-it-visual-level="executive"] .role-badge,
body[data-it-visual-level="executive"] .analytics-chip,
body[data-it-visual-level="executive"] .brand-chip,
body[data-it-visual-level="executive"] .section-chip,
body[data-it-visual-level="executive"] .sidebar-kicker,
body[data-it-visual-level="executive"] .login-badge{
  border-radius: 999px!important;
  font-weight: 900!important;
}
body[data-it-visual-level="executive"] .zt-table thead th{
  font-size: 12px!important;
  font-weight: 1000!important;
  text-transform: uppercase;
  letter-spacing: .05em;
}
body[data-it-visual-level="executive"] .zt-table tbody tr{
  transition: background .18s ease, transform .18s ease, box-shadow .18s ease;
}
body[data-it-visual-level="executive"] .zt-table tbody tr:hover{
  transform: translateY(-1px);
}
body[data-it-theme="dark"][data-it-visual-level="executive"] .zt-table tbody tr:hover{
  background: rgba(96,165,250,.06)!important;
}
body[data-it-theme="light"][data-it-visual-level="executive"] .zt-table tbody tr:hover{
  background: rgba(37,99,235,.05)!important;
}
body[data-it-visual-level="executive"] .input-glass,
body[data-it-visual-level="executive"] .device-search-wrap,
body[data-it-visual-level="executive"] .password-toggle,
body[data-it-visual-level="executive"] .login-input,
body[data-it-visual-level="executive"] textarea,
body[data-it-visual-level="executive"] select{
  border-radius: 14px!important;
}
body[data-it-visual-level="executive"] .login-brand-logo,
body[data-it-visual-level="executive"] .brand-mark,
body[data-it-visual-level="executive"] .login-icon-wrap,
body[data-it-visual-level="executive"] .login-side-logo{
  border-radius: 20px!important;
}
body[data-it-visual-level="executive"] .login-hero-stats,
body[data-it-visual-level="executive"] .login-feature-grid,
body[data-it-visual-level="executive"] .login-trust-row{
  gap: 14px!important;
}
body[data-it-visual-level="executive"] .network-list-card::before,
body[data-it-visual-level="executive"] .sa-section-shell::before,
body[data-it-visual-level="executive"] .delivery-net-tab-strip-v130,
body[data-it-visual-level="executive"] .delivery-page-strip-v130{
  opacity: .92;
}
body[data-it-theme="dark"][data-it-visual-level="executive"] .network-list-card::before,
body[data-it-theme="dark"][data-it-visual-level="executive"] .sa-section-shell::before{
  background: linear-gradient(180deg, #60a5fa, transparent)!important;
}
body[data-it-theme="light"][data-it-visual-level="executive"] .network-list-card::before,
body[data-it-theme="light"][data-it-visual-level="executive"] .sa-section-shell::before{
  background: linear-gradient(180deg, #2563eb, transparent)!important;
}
body[data-it-ui-density="delivery"][data-it-visual-level="executive"] .login-note-card,
body[data-it-ui-density="delivery"][data-it-visual-level="executive"] .brand-legal-box,
body[data-it-ui-density="delivery"][data-it-visual-level="executive"] .brand-feature p,
body[data-it-ui-density="delivery"][data-it-visual-level="executive"] .login-hint,
body[data-it-ui-density="delivery"][data-it-visual-level="executive"] .login-hero-text,
body[data-it-ui-density="delivery"][data-it-visual-level="executive"] .panel-meta,
body[data-it-ui-density="delivery"][data-it-visual-level="executive"] .network-quick-note,
body[data-it-ui-density="delivery"][data-it-visual-level="executive"] .settings-panel-note,
body[data-it-ui-density="delivery"][data-it-visual-level="executive"] .help-note,
body[data-it-ui-density="delivery"][data-it-visual-level="executive"] .form-help,
body[data-it-ui-density="delivery"][data-it-visual-level="executive"] .hint-text,
body[data-it-ui-density="delivery"][data-it-visual-level="executive"] .muted-help{
  -webkit-line-clamp: 1;
  opacity: .72;
}
body[data-it-ui-density="delivery"][data-it-visual-level="executive"] .login-note-card:hover,
body[data-it-ui-density="delivery"][data-it-visual-level="executive"] .brand-legal-box:hover,
body[data-it-ui-density="delivery"][data-it-visual-level="executive"] .brand-feature:hover p,
body[data-it-ui-density="delivery"][data-it-visual-level="executive"] .login-hint:hover,
body[data-it-ui-density="delivery"][data-it-visual-level="executive"] .login-hero-text:hover,
body[data-it-ui-density="delivery"][data-it-visual-level="executive"] .panel-meta:hover,
body[data-it-ui-density="delivery"][data-it-visual-level="executive"] .network-quick-note:hover,
body[data-it-ui-density="delivery"][data-it-visual-level="executive"] .settings-panel-note:hover,
body[data-it-ui-density="delivery"][data-it-visual-level="executive"] .help-note:hover,
body[data-it-ui-density="delivery"][data-it-visual-level="executive"] .form-help:hover,
body[data-it-ui-density="delivery"][data-it-visual-level="executive"] .hint-text:hover,
body[data-it-ui-density="delivery"][data-it-visual-level="executive"] .muted-help:hover{
  -webkit-line-clamp: unset;
  opacity: 1;
}
@media (max-width: 980px){
  body[data-it-visual-level="executive"] .sidebar-nav .nav-btn{min-height:62px!important;}
  body[data-it-visual-level="executive"] .app-sidebar{padding:18px!important;}
}
/* V135_EXECUTIVE_VISUAL_POLISH_END */


/* V137_WHITE_SCREEN_HOTFIX_SAFE_CLEAN_UI_START */
/* White-screen guard: never let cleanup/polish rules hide the root views. */
html, body { min-height: 100vh; }
#loginView:not(.hidden),
#appView:not(.hidden),
#activationView:not(.hidden),
body[data-login-only="1"] #loginView,
body[data-activation-only="1"] #activationView{
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}
#appView.app-shell:not(.hidden){
  display: grid !important;
}
/* Safe cleanup: hide only review ribbons, never content panels or app roots. */
body[data-it-safe-clean="delivery"] :where(
  .delivery-page-strip-v130,
  .delivery-net-tab-strip-v130,
  .settings-delivery-strip-v129,
  .dashboard-delivery-strip-v129,
  [data-review-strip],
  [data-debug-panel],
  [data-dev-note]
):not(#appView):not(#loginView):not(#activationView){
  display:none!important;
}
body[data-it-safe-clean="delivery"] :where(
  .login-note-card,
  .brand-legal-box,
  .brand-feature p,
  .login-hint,
  .login-hero-text,
  .panel-meta,
  .network-quick-note,
  .settings-panel-note,
  .help-note,
  .form-help,
  .hint-text,
  .muted-help,
  .sidebar-blurb,
  .sidebar-tagline
){
  opacity:.78!important;
  font-size:12px!important;
  line-height:1.65!important;
  max-height:44px!important;
  overflow:hidden!important;
}
body[data-it-safe-clean="delivery"] :where(
  .login-note-card,
  .brand-legal-box,
  .brand-feature p,
  .login-hint,
  .login-hero-text,
  .panel-meta,
  .network-quick-note,
  .settings-panel-note,
  .help-note,
  .form-help,
  .hint-text,
  .muted-help,
  .sidebar-blurb,
  .sidebar-tagline
):hover{
  opacity:1!important;
  max-height:none!important;
  overflow:visible!important;
}
/* Keep important empty-state messages visible; they are useful, not clutter. */
body[data-it-safe-clean="delivery"] .dashboard-empty-real-data,
body[data-it-safe-clean="delivery"] .delivery-empty-card-v130{
  display:block!important;
}
/* V137_WHITE_SCREEN_HOTFIX_SAFE_CLEAN_UI_END */


/* V138_DASHBOARD_LIGHT_I18N_VISUAL_FIX_START */
/* Screenshot hotfix: keep the app clean after login; the floating AR/EN switcher belongs only to Login/Activation. */
body:not([data-login-only="1"]):not([data-activation-only="1"]) #itV133PrefSwitcher,
body:not([data-login-only="1"]):not([data-activation-only="1"]) .it-v133-pref-switcher,
#appView:not(.hidden) ~ #itV133PrefSwitcher{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
/* Stronger, less washed-out light theme. */
body[data-it-theme="light"]{
  background:
    radial-gradient(circle at 18% 0%, rgba(37,99,235,.08), transparent 22%),
    linear-gradient(180deg, #edf4fb 0%, #e9f0f7 52%, #e4ebf3 100%)!important;
}
body[data-it-theme="light"] .app-sidebar,
body[data-it-theme="light"] .card,
body[data-it-theme="light"] .compact-card,
body[data-it-theme="light"] .section-shell,
body[data-it-theme="light"] .chart-shell,
body[data-it-theme="light"] .table-shell,
body[data-it-theme="light"] .device-card,
body[data-it-theme="light"] .network-list-card,
body[data-it-theme="light"] .login-card-pro,
body[data-it-theme="light"] .login-brand-panel,
body[data-it-theme="light"] .network-clean-header{
  background: linear-gradient(180deg, rgba(255,255,255,.99), rgba(246,249,253,.96))!important;
  border-color: rgba(100,116,139,.26)!important;
  box-shadow: 0 14px 34px rgba(15,23,42,.10), inset 0 1px 0 rgba(255,255,255,.94)!important;
}
body[data-it-theme="light"] .sidebar-nav .nav-btn{
  background: linear-gradient(180deg, #f8fafc, #eef4fb)!important;
  border-color: rgba(100,116,139,.22)!important;
  color:#0f172a!important;
}
body[data-it-theme="light"] .sidebar-nav .nav-btn .nav-btn-copy strong,
body[data-it-theme="light"] .sidebar-section-title,
body[data-it-theme="light"] .nav-btn-copy strong,
body[data-it-theme="light"] .sidebar-user-name,
body[data-it-theme="light"] .sidebar-mini-tile strong,
body[data-it-theme="light"] .panel-title,
body[data-it-theme="light"] .compact-title,
body[data-it-theme="light"] .network-clean-title h1{
  color:#0f172a!important;
}
body[data-it-theme="light"] .sidebar-nav .nav-btn.active{
  background: linear-gradient(135deg, rgba(37,99,235,.18), rgba(96,165,250,.12))!important;
  border-color: rgba(37,99,235,.34)!important;
  box-shadow: 0 12px 26px rgba(37,99,235,.12)!important;
}
body[data-it-theme="light"] .sidebar-nav .nav-btn.active .nav-btn-copy strong,
body[data-it-theme="light"] .sidebar-nav .nav-btn:hover .nav-btn-copy strong{
  color:#0b1220!important;
}
body[data-it-theme="light"] .nav-btn-icon{
  background: linear-gradient(180deg, #334155, #1f2937)!important;
  border-color: rgba(15,23,42,.18)!important;
  color:#f8fafc!important;
}
body[data-it-theme="light"] .sidebar-user-action,
body[data-it-theme="light"] .toolbar-btn,
body[data-it-theme="light"] .input-glass,
body[data-it-theme="light"] .device-search-wrap,
body[data-it-theme="light"] .ip-btn,
body[data-it-theme="light"] .network-quick-item,
body[data-it-theme="light"] .metric-chip,
body[data-it-theme="light"] .ai-feed-line,
body[data-it-theme="light"] .login-secondary,
body[data-it-theme="light"] .password-toggle{
  background:#f8fafc!important;
  border-color:rgba(100,116,139,.25)!important;
  color:#0f172a!important;
}
body[data-it-theme="light"] .dashboard-empty-real-data{
  margin:0 0 10px!important;
  padding:8px 14px!important;
  min-height:0!important;
  border-style:solid!important;
  background:rgba(37,99,235,.055)!important;
  border-color:rgba(37,99,235,.18)!important;
  color:#2563eb!important;
  font-size:12px!important;
}
body[data-it-theme="light"] .toast.ok,
body[data-it-theme="light"] .alert-row-card,
body[data-it-theme="light"] .dashboard-empty-real-data + .dashboard-empty-real-data{
  color:#065f46!important;
}
body[data-it-theme="light"] #fleetLineChart,
body[data-it-theme="light"] #fleetStatusChart{
  filter: contrast(1.04) saturate(.96);
}
body[data-it-theme="light"] .app-footer,
body[data-it-theme="light"] .app-footer-inner{
  background:transparent!important;
  color:#475569!important;
  border-top-color:rgba(100,116,139,.22)!important;
}
body[data-it-theme="light"] .copyright-link{color:#334155!important;}
body[data-it-theme="light"] .text-white,
body[data-it-theme="light"] [class*="text-white"],
body[data-it-theme="light"] .text-slate-100,
body[data-it-theme="light"] .text-slate-200,
body[data-it-theme="light"] .text-slate-300,
body[data-it-theme="light"] .text-slate-400,
body[data-it-theme="light"] .text-gray-100,
body[data-it-theme="light"] .text-gray-200,
body[data-it-theme="light"] .text-gray-300,
body[data-it-theme="light"] .text-gray-400{
  color:#0f172a!important;
}
/* Keep root views protected from accidental visual-clean rules. */
#loginView:not(.hidden), #appView:not(.hidden), #activationView:not(.hidden){opacity:1!important;visibility:visible!important;}
#appView.app-shell:not(.hidden){display:grid!important;}
/* V138_DASHBOARD_LIGHT_I18N_VISUAL_FIX_END */


/* V139_UI_REBUILD_LIGHT_I18N_INNER_PAGES_START
   Final top override layer: cleaner professional visual system, stronger Light Theme,
   reduced dashboard clutter, and no unsafe hiding of application roots. */
:root,
html[data-it-theme="dark"], body[data-it-theme="dark"]{
  --it-bg:#0b1220!important;
  --it-bg-2:#101a2b!important;
  --it-card:#121f31!important;
  --it-card-2:#17263a!important;
  --it-text:#e8eef7!important;
  --it-muted:#92a4bb!important;
  --it-border:rgba(96,165,250,.18)!important;
  --it-primary:#2563eb!important;
  --it-primary-2:#60a5fa!important;
  --it-success:#059669!important;
  --it-warning:#d97706!important;
  --it-danger:#dc2626!important;
  --brand-bg:var(--it-bg)!important;
  --brand-bg-alt:var(--it-bg-2)!important;
  --brand-panel:var(--it-card)!important;
  --brand-panel-soft:var(--it-card-2)!important;
  --brand-text:var(--it-text)!important;
  --brand-muted:var(--it-muted)!important;
  --brand-accent:var(--it-primary)!important;
  --brand-accent-soft:var(--it-primary-2)!important;
}
html[data-it-theme="light"], body[data-it-theme="light"]{
  --it-bg:#eef4fb!important;
  --it-bg-2:#f6f9fd!important;
  --it-card:#ffffff!important;
  --it-card-2:#f8fafc!important;
  --it-text:#111827!important;
  --it-muted:#475569!important;
  --it-border:rgba(71,85,105,.20)!important;
  --it-primary:#2563eb!important;
  --it-primary-2:#3b82f6!important;
  --it-success:#047857!important;
  --it-warning:#b45309!important;
  --it-danger:#b91c1c!important;
  --brand-bg:var(--it-bg)!important;
  --brand-bg-alt:var(--it-bg-2)!important;
  --brand-panel:var(--it-card)!important;
  --brand-panel-soft:var(--it-card-2)!important;
  --brand-text:var(--it-text)!important;
  --brand-muted:var(--it-muted)!important;
  --brand-accent:var(--it-primary)!important;
  --brand-accent-soft:var(--it-primary-2)!important;
}
body[data-it-theme="dark"]{
  background: radial-gradient(circle at 20% 0%, rgba(37,99,235,.18), transparent 32%), linear-gradient(180deg,#0b1220,#111827 58%,#0b1220)!important;
  color:var(--it-text)!important;
}
body[data-it-theme="light"]{
  background: radial-gradient(circle at 18% 0%, rgba(37,99,235,.10), transparent 28%), linear-gradient(180deg,#f8fbff,#eef4fb 60%,#e8f0f8)!important;
  color:var(--it-text)!important;
}
body[data-it-theme="light"] *{ text-shadow:none!important; }
body[data-it-theme="light"] .app-footer,
body[data-it-theme="light"] .app-footer-inner{
  background:transparent!important; color:#64748b!important; border-color:rgba(148,163,184,.22)!important;
}
/* Hide old floating switcher inside final product; settings panel remains the source of truth. */
.it-v133-pref-switcher, #itV133PrefSwitcher{ display:none!important; visibility:hidden!important; pointer-events:none!important; }
/* Shell and surfaces */
body .app-shell{ gap:22px!important; max-width:1760px!important; }
body[data-it-theme] .card,
body[data-it-theme] .compact-card,
body[data-it-theme] .device-card,
body[data-it-theme] .network-list-card,
body[data-it-theme] .section-shell,
body[data-it-theme] .table-shell,
body[data-it-theme] .chart-shell,
body[data-it-theme] .app-sidebar,
body[data-it-theme] .network-clean-header,
body[data-it-theme] .login-card-pro,
body[data-it-theme] .login-brand-panel,
body[data-it-theme] .login-form-shell,
body[data-it-theme] .sidebar-brand-card,
body[data-it-theme] .sidebar-user-card,
body[data-it-theme] .sidebar-mini-tile,
body[data-it-theme] .sidebar-status-card,
body[data-it-theme] .network-quick-item,
body[data-it-theme] .network-quick-qr,
body[data-it-theme] .login-note-card,
body[data-it-theme] .brand-feature,
body[data-it-theme] .brand-legal-box,
body[data-it-theme] .login-stat-card,
body[data-it-theme] .login-trust-item,
body[data-it-theme] .dashboard-status-strip-v129,
body[data-it-theme] .settings-delivery-strip-v129,
body[data-it-theme] .delivery-page-strip-v130,
body[data-it-theme] .delivery-net-tab-strip-v130,
body[data-it-theme] .pending-devices-section,
body[data-it-theme] .active-devices-section{
  border-radius:18px!important;
  border:1px solid var(--it-border)!important;
  backdrop-filter:none!important;
}
body[data-it-theme="dark"] .card,
body[data-it-theme="dark"] .compact-card,
body[data-it-theme="dark"] .device-card,
body[data-it-theme="dark"] .network-list-card,
body[data-it-theme="dark"] .section-shell,
body[data-it-theme="dark"] .table-shell,
body[data-it-theme="dark"] .chart-shell,
body[data-it-theme="dark"] .app-sidebar,
body[data-it-theme="dark"] .network-clean-header,
body[data-it-theme="dark"] .login-card-pro,
body[data-it-theme="dark"] .login-brand-panel,
body[data-it-theme="dark"] .login-form-shell,
body[data-it-theme="dark"] .network-quick-item,
body[data-it-theme="dark"] .network-quick-qr{
  background:linear-gradient(180deg,rgba(18,31,49,.96),rgba(13,24,40,.94))!important;
  box-shadow:0 18px 42px rgba(2,8,20,.32)!important;
}
body[data-it-theme="light"] .card,
body[data-it-theme="light"] .compact-card,
body[data-it-theme="light"] .device-card,
body[data-it-theme="light"] .network-list-card,
body[data-it-theme="light"] .section-shell,
body[data-it-theme="light"] .table-shell,
body[data-it-theme="light"] .chart-shell,
body[data-it-theme="light"] .app-sidebar,
body[data-it-theme="light"] .network-clean-header,
body[data-it-theme="light"] .login-card-pro,
body[data-it-theme="light"] .login-brand-panel,
body[data-it-theme="light"] .login-form-shell,
body[data-it-theme="light"] .network-quick-item,
body[data-it-theme="light"] .network-quick-qr,
body[data-it-theme="light"] .sidebar-brand-card,
body[data-it-theme="light"] .sidebar-user-card,
body[data-it-theme="light"] .sidebar-mini-tile,
body[data-it-theme="light"] .sidebar-status-card,
body[data-it-theme="light"] .login-note-card,
body[data-it-theme="light"] .brand-feature,
body[data-it-theme="light"] .brand-legal-box,
body[data-it-theme="light"] .login-stat-card,
body[data-it-theme="light"] .login-trust-item{
  background:linear-gradient(180deg,#ffffff,#f8fafc)!important;
  box-shadow:0 14px 34px rgba(15,23,42,.08)!important;
}
/* Typography: force readable light mode and clean hierarchy */
body[data-it-theme="light"] h1, body[data-it-theme="light"] h2, body[data-it-theme="light"] h3, body[data-it-theme="light"] h4,
body[data-it-theme="light"] .panel-title, body[data-it-theme="light"] .compact-title,
body[data-it-theme="light"] .device-name, body[data-it-theme="light"] .sidebar-user-name,
body[data-it-theme="light"] .network-clean-title h1, body[data-it-theme="light"] .login-hero-title,
body[data-it-theme="light"] .metric-value, body[data-it-theme="light"] .network-quick-value,
body[data-it-theme="light"] .zt-table td, body[data-it-theme="light"] .zt-table th,
body[data-it-theme="light"] .text-white, body[data-it-theme="light"] [class*="text-white"],
body[data-it-theme="light"] .text-slate-50, body[data-it-theme="light"] .text-slate-100, body[data-it-theme="light"] .text-slate-200, body[data-it-theme="light"] .text-slate-300,
body[data-it-theme="light"] .text-gray-50, body[data-it-theme="light"] .text-gray-100, body[data-it-theme="light"] .text-gray-200, body[data-it-theme="light"] .text-gray-300,
body[data-it-theme="light"] .text-zinc-50, body[data-it-theme="light"] .text-zinc-100, body[data-it-theme="light"] .text-zinc-200, body[data-it-theme="light"] .text-zinc-300{
  color:#111827!important;
}
body[data-it-theme="light"] .panel-meta, body[data-it-theme="light"] .login-hero-text,
body[data-it-theme="light"] .login-hint, body[data-it-theme="light"] .network-quick-note,
body[data-it-theme="light"] .settings-panel-note, body[data-it-theme="light"] .device-toolbar-meta,
body[data-it-theme="light"] .text-slate-400, body[data-it-theme="light"] .text-slate-500, body[data-it-theme="light"] .text-slate-600,
body[data-it-theme="light"] .text-gray-400, body[data-it-theme="light"] .text-gray-500, body[data-it-theme="light"] .text-gray-600{
  color:#475569!important;
}
body[data-it-theme="light"] .theme-accent, body[data-it-theme="light"] .theme-kicker,
body[data-it-theme="light"] .sidebar-kicker, body[data-it-theme="light"] .brand-chip,
body[data-it-theme="light"] .analytics-chip, body[data-it-theme="light"] .section-chip,
body[data-it-theme="light"] .login-badge, body[data-it-theme="light"] .login-overline,
body[data-it-theme="light"] .text-blue-300, body[data-it-theme="light"] .text-blue-400,
body[data-it-theme="light"] .text-indigo-300, body[data-it-theme="light"] .text-indigo-400,
body[data-it-theme="light"] .text-cyan-300, body[data-it-theme="light"] .text-amber-300{
  color:#1d4ed8!important;
}
/* Sidebar and buttons */
body[data-it-theme] .sidebar-nav .nav-btn,
body[data-it-theme] .toolbar-btn,
body[data-it-theme] .input-glass,
body[data-it-theme] .device-search-wrap,
body[data-it-theme] .ip-btn,
body[data-it-theme] .login-tab,
body[data-it-theme] .login-secondary,
body[data-it-theme] .password-toggle,
body[data-it-theme] .it-top-choice-btn{
  border-radius:13px!important;
  border:1px solid var(--it-border)!important;
  font-weight:900!important;
}
body[data-it-theme="dark"] .sidebar-nav .nav-btn,
body[data-it-theme="dark"] .toolbar-btn,
body[data-it-theme="dark"] .input-glass,
body[data-it-theme="dark"] .device-search-wrap,
body[data-it-theme="dark"] .ip-btn,
body[data-it-theme="dark"] .login-tab,
body[data-it-theme="dark"] .login-secondary,
body[data-it-theme="dark"] .password-toggle,
body[data-it-theme="dark"] .it-top-choice-btn{
  background:rgba(15,23,42,.78)!important; color:#e8eef7!important;
}
body[data-it-theme="light"] .sidebar-nav .nav-btn,
body[data-it-theme="light"] .toolbar-btn,
body[data-it-theme="light"] .input-glass,
body[data-it-theme="light"] .device-search-wrap,
body[data-it-theme="light"] .ip-btn,
body[data-it-theme="light"] .login-tab,
body[data-it-theme="light"] .login-secondary,
body[data-it-theme="light"] .password-toggle,
body[data-it-theme="light"] .it-top-choice-btn{
  background:#f8fafc!important; color:#111827!important;
}
body[data-it-theme] .sidebar-nav .nav-btn.active,
body[data-it-theme] .sidebar-nav .nav-btn:hover,
body[data-it-theme] .toolbar-btn:hover,
body[data-it-theme] .login-tab.active,
body[data-it-theme] .it-top-choice-btn.active{
  background:linear-gradient(135deg,rgba(37,99,235,.92),rgba(96,165,250,.85))!important;
  color:#ffffff!important;
  border-color:transparent!important;
  box-shadow:0 10px 24px rgba(37,99,235,.18)!important;
}
body[data-it-theme] .btn-primary,
body[data-it-theme] .login-submit,
body[data-it-theme] .network-clean-primary,
body[data-it-theme] .sidebar-floating-toggle,
body[data-it-theme] .bg-blue-600{
  background:linear-gradient(135deg,#2563eb,#60a5fa)!important;
  color:#ffffff!important;
  border-color:transparent!important;
  box-shadow:0 12px 26px rgba(37,99,235,.18)!important;
}
body[data-it-theme="light"] .sidebar-logout{ background:#fff1f2!important; color:#be123c!important; border-color:#fecdd3!important; }
body[data-it-theme="dark"] .sidebar-logout{ background:rgba(127,29,29,.20)!important; color:#fecdd3!important; border-color:rgba(248,113,113,.20)!important; }
/* Charts and status pills */
body[data-it-theme="light"] canvas{ filter:none!important; }
body[data-it-theme="light"] .chart-shell{ background:#ffffff!important; }
body[data-it-theme="light"] .path-online, body[data-it-theme="light"] .path-direct{ background:#ecfdf5!important; color:#047857!important; border-color:#a7f3d0!important; }
body[data-it-theme="light"] .path-offline{ background:#fef2f2!important; color:#b91c1c!important; border-color:#fecaca!important; }
body[data-it-theme="light"] .path-pending{ background:#fffbeb!important; color:#b45309!important; border-color:#fde68a!important; }
/* Delivery clean: reduce non-critical review strips, never hide roots. */
body[data-it-ui-density="delivery"] .dashboard-empty-real-data,
body[data-it-ui-density="delivery"] .dashboard-status-strip-v129,
body[data-it-ui-density="delivery"] .delivery-page-strip-v130,
body[data-it-ui-density="delivery"] .delivery-net-tab-strip-v130,
body[data-it-ui-density="delivery"] .settings-delivery-strip-v129{
  opacity:.84!important;
  max-height:38px!important;
  overflow:hidden!important;
  font-size:11px!important;
}
#appView, #loginView, #activationView, body[data-login-only="1"], body[data-activation-only="1"]{ min-height:100vh!important; }
/* V139_UI_REBUILD_LIGHT_I18N_INNER_PAGES_END */


/* V140_LIGHT_THEME_I18N_FINAL_HOTFIX_START */
html[data-it-theme="light"], body[data-it-theme="light"]{
  --brand-bg:#eef4fb!important;
  --brand-bg-alt:#f6f9fd!important;
  --brand-panel:#ffffff!important;
  --brand-panel-soft:#f8fafc!important;
  --brand-text:#111827!important;
  --brand-muted:#475569!important;
  --brand-accent:#2563eb!important;
  --brand-accent-soft:#3b82f6!important;
}
body[data-it-theme="light"]{
  background:
    radial-gradient(circle at 8% 0%, rgba(37,99,235,.10), transparent 24%),
    radial-gradient(circle at 92% 6%, rgba(14,165,233,.08), transparent 22%),
    linear-gradient(180deg,#f7fbff 0%,#eef4fb 52%,#e7eef7 100%)!important;
}
body[data-it-theme="light"] .card,
body[data-it-theme="light"] .compact-card,
body[data-it-theme="light"] .device-card,
body[data-it-theme="light"] .network-list-card,
body[data-it-theme="light"] .section-shell,
body[data-it-theme="light"] .table-shell,
body[data-it-theme="light"] .chart-shell,
body[data-it-theme="light"] .app-sidebar,
body[data-it-theme="light"] .sidebar-brand-card,
body[data-it-theme="light"] .sidebar-user-card,
body[data-it-theme="light"] .sidebar-status-card,
body[data-it-theme="light"] .sidebar-mini-tile,
body[data-it-theme="light"] .network-clean-header,
body[data-it-theme="light"] .login-card-pro,
body[data-it-theme="light"] .login-brand-panel,
body[data-it-theme="light"] .login-form-shell,
body[data-it-theme="light"] .network-quick-item,
body[data-it-theme="light"] .network-quick-qr,
body[data-it-theme="light"] .login-note-card,
body[data-it-theme="light"] .brand-feature,
body[data-it-theme="light"] .brand-legal-box,
body[data-it-theme="light"] .login-stat-card,
body[data-it-theme="light"] .login-trust-item{
  background:linear-gradient(180deg, rgba(255,255,255,.99), rgba(248,250,252,.96))!important;
  border-color:rgba(148,163,184,.30)!important;
  box-shadow:0 18px 42px rgba(15,23,42,.09), inset 0 1px 0 rgba(255,255,255,.88)!important;
}
body[data-it-theme="light"] .panel-title,
body[data-it-theme="light"] .compact-title,
body[data-it-theme="light"] .login-hero-title,
body[data-it-theme="light"] .network-clean-title h1,
body[data-it-theme="light"] h1,
body[data-it-theme="light"] h2,
body[data-it-theme="light"] h3,
body[data-it-theme="light"] h4,
body[data-it-theme="light"] strong,
body[data-it-theme="light"] b,
body[data-it-theme="light"] .device-name,
body[data-it-theme="light"] .sidebar-user-name,
body[data-it-theme="light"] .zt-table th,
body[data-it-theme="light"] .zt-table td,
body[data-it-theme="light"] .network-quick-value,
body[data-it-theme="light"] .metric-value,
body[data-it-theme="light"] .input-glass,
body[data-it-theme="light"] .device-search-input,
body[data-it-theme="light"] textarea,
body[data-it-theme="light"] select,
body[data-it-theme="light"] input{
  color:#111827!important;
}
body[data-it-theme="light"] .panel-meta,
body[data-it-theme="light"] .login-hint,
body[data-it-theme="light"] .network-quick-note,
body[data-it-theme="light"] .settings-panel-note,
body[data-it-theme="light"] .device-toolbar-meta,
body[data-it-theme="light"] .app-footer,
body[data-it-theme="light"] .copyright-link,
body[data-it-theme="light"] .field-caption,
body[data-it-theme="light"] .help-note,
body[data-it-theme="light"] .muted-help,
body[data-it-theme="light"] .form-help,
body[data-it-theme="light"] .text-slate-300,
body[data-it-theme="light"] .text-slate-400,
body[data-it-theme="light"] .text-slate-500,
body[data-it-theme="light"] .text-gray-300,
body[data-it-theme="light"] .text-gray-400,
body[data-it-theme="light"] .text-gray-500{
  color:#475569!important;
}
body[data-it-theme="light"] [class*="text-white"],
body[data-it-theme="light"] [class*="text-slate-50"],
body[data-it-theme="light"] [class*="text-slate-100"],
body[data-it-theme="light"] [class*="text-slate-200"],
body[data-it-theme="light"] [class*="text-gray-50"],
body[data-it-theme="light"] [class*="text-gray-100"],
body[data-it-theme="light"] [class*="text-gray-200"]{
  color:#111827!important;
}
body[data-it-theme="light"] .theme-accent,
body[data-it-theme="light"] .theme-chip,
body[data-it-theme="light"] .sidebar-kicker,
body[data-it-theme="light"] .section-chip,
body[data-it-theme="light"] .analytics-chip,
body[data-it-theme="light"] .brand-chip,
body[data-it-theme="light"] .login-badge,
body[data-it-theme="light"] .login-overline{
  color:#1d4ed8!important;
  border-color:rgba(37,99,235,.20)!important;
  background:rgba(37,99,235,.07)!important;
}
body[data-it-theme="light"] .btn-primary,
body[data-it-theme="light"] .network-clean-primary,
body[data-it-theme="light"] .login-submit,
body[data-it-theme="light"] .it-top-choice-btn.active,
body[data-it-theme="light"] .sidebar-nav .nav-btn.active{
  background:linear-gradient(135deg,#2563eb,#60a5fa)!important;
  color:#fff!important;
  border-color:transparent!important;
  box-shadow:0 12px 26px rgba(37,99,235,.20)!important;
}
body[data-it-theme="light"] .toolbar-btn,
body[data-it-theme="light"] .ip-btn,
body[data-it-theme="light"] .input-glass,
body[data-it-theme="light"] .device-search-wrap,
body[data-it-theme="light"] .sidebar-nav .nav-btn,
body[data-it-theme="light"] .login-tab,
body[data-it-theme="light"] .login-secondary,
body[data-it-theme="light"] .password-toggle{
  background:rgba(255,255,255,.95)!important;
  border-color:rgba(148,163,184,.32)!important;
  color:#111827!important;
}
body[data-it-theme="light"] .toolbar-btn:hover,
body[data-it-theme="light"] .ip-btn:hover,
body[data-it-theme="light"] .sidebar-nav .nav-btn:hover,
body[data-it-theme="light"] .login-tab:hover{
  background:rgba(37,99,235,.08)!important;
  border-color:rgba(37,99,235,.28)!important;
  color:#0f172a!important;
}
body[data-it-theme="light"] button:disabled,
body[data-it-theme="light"] .disabled,
body[data-it-theme="light"] [aria-disabled="true"]{
  opacity:.72!important;
  color:#64748b!important;
}
html[dir="ltr"] body,
html[dir="ltr"] #appView,
html[dir="ltr"] .card,
html[dir="ltr"] .compact-card,
html[dir="ltr"] .section-shell,
html[dir="ltr"] .network-clean-header,
html[dir="ltr"] .network-clean-title,
html[dir="ltr"] .net-header-title,
html[dir="ltr"] .panel-title,
html[dir="ltr"] .panel-meta,
html[dir="ltr"] .input-glass,
html[dir="ltr"] textarea,
html[dir="ltr"] input,
html[dir="ltr"] select{
  direction:ltr!important;
  text-align:left!important;
}
html[dir="ltr"] .zt-table,
html[dir="ltr"] .zt-table th,
html[dir="ltr"] .zt-table td{
  text-align:left!important;
  direction:ltr!important;
}
html[dir="ltr"] .network-clean-header,
html[dir="ltr"] .dashboard-toolbar,
html[dir="ltr"] .networks-toolbar,
html[dir="ltr"] .device-toolbar{
  direction:ltr!important;
}
html[dir="ltr"] .text-right{ text-align:left!important; }
html[dir="ltr"] .text-left{ text-align:left!important; }
html[dir="ltr"] .justify-end{ justify-content:flex-start!important; }
html[dir="ltr"] .justify-start{ justify-content:flex-start!important; }
#itV133PrefSwitcher,.it-v133-pref-switcher{display:none!important;visibility:hidden!important;pointer-events:none!important;}
body[data-it-ui-density="delivery"] .delivery-page-strip-v130,
body[data-it-ui-density="delivery"] .delivery-net-tab-strip-v130,
body[data-it-ui-density="delivery"] .settings-delivery-strip-v129,
body[data-it-ui-density="delivery"] .dashboard-empty-real-data{
  opacity:.78;
  font-size:12px!important;
}
/* V140_LIGHT_THEME_I18N_FINAL_HOTFIX_END */


/* V141_ARABIC_ONLY_THEME_COLOR_FIX_START */
html,
body{
  direction: rtl!important;
}
html[dir="ltr"],
body[dir="ltr"]{
  direction: rtl!important;
  text-align: right!important;
}
body[data-it-lang="en"],
html[lang="en"] body{
  direction: rtl!important;
}
[data-it-top-lang-choice],
.it-v133-pref-switcher [data-it-top-lang-choice],
#itV133PrefSwitcher [data-it-top-lang-choice]{
  display:none!important;
}
.it-v133-pref-switcher,
#itV133PrefSwitcher{
  display:none!important;
}
.it-top-appearance-row[role="group"][aria-label="Language"],
.it-top-appearance-row:has([data-it-top-lang-choice]){
  display:none!important;
}
.it-top-appearance-panel{
  background:linear-gradient(180deg, rgba(255,255,255,.72), rgba(245,248,252,.64))!important;
}
body[data-it-theme="dark"] .it-top-appearance-panel{
  background:linear-gradient(180deg, rgba(18,32,51,.86), rgba(10,20,36,.74))!important;
}
/* Professional light palette: clearer, less washed-out */
html[data-it-theme="light"],
body[data-it-theme="light"]{
  --brand-bg:#eef4fb!important;
  --brand-bg-alt:#e6eef8!important;
  --brand-panel:#ffffff!important;
  --brand-panel-soft:#f7f9fc!important;
  --brand-text:#101827!important;
  --brand-muted:#4b5f7a!important;
  --brand-accent:#1d4ed8!important;
  --brand-accent-soft:#3b82f6!important;
}
html[data-it-theme="light"] body,
body[data-it-theme="light"]{
  background:
    radial-gradient(circle at 8% 0%, rgba(59,130,246,.12), transparent 26%),
    radial-gradient(circle at 88% 10%, rgba(14,165,233,.08), transparent 22%),
    linear-gradient(180deg,#f8fbff 0%,#eef4fb 52%,#e5edf7 100%)!important;
  color:#101827!important;
}
body[data-it-theme="light"] .card,
body[data-it-theme="light"] .compact-card,
body[data-it-theme="light"] .device-card,
body[data-it-theme="light"] .network-list-card,
body[data-it-theme="light"] .section-shell,
body[data-it-theme="light"] .table-shell,
body[data-it-theme="light"] .chart-shell,
body[data-it-theme="light"] .app-sidebar,
body[data-it-theme="light"] .network-clean-header,
body[data-it-theme="light"] .login-card-pro,
body[data-it-theme="light"] .login-brand-panel,
body[data-it-theme="light"] .login-form-shell,
body[data-it-theme="light"] .network-quick-item,
body[data-it-theme="light"] .network-quick-qr,
body[data-it-theme="light"] .sidebar-brand-card,
body[data-it-theme="light"] .sidebar-user-card,
body[data-it-theme="light"] .sidebar-mini-tile,
body[data-it-theme="light"] .sidebar-status-card,
body[data-it-theme="light"] .login-note-card,
body[data-it-theme="light"] .brand-feature,
body[data-it-theme="light"] .brand-legal-box,
body[data-it-theme="light"] .login-stat-card,
body[data-it-theme="light"] .login-trust-item{
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(246,249,253,.94))!important;
  border-color:rgba(120,139,166,.28)!important;
  box-shadow:0 16px 38px rgba(15,23,42,.09), inset 0 1px 0 rgba(255,255,255,.95)!important;
}
body[data-it-theme="light"] .panel-title,
body[data-it-theme="light"] .compact-title,
body[data-it-theme="light"] h1,
body[data-it-theme="light"] h2,
body[data-it-theme="light"] h3,
body[data-it-theme="light"] h4,
body[data-it-theme="light"] .device-name,
body[data-it-theme="light"] .sidebar-user-name,
body[data-it-theme="light"] .network-clean-title h1,
body[data-it-theme="light"] .login-hero-title,
body[data-it-theme="light"] .brand-feature strong,
body[data-it-theme="light"] .login-trust-item strong,
body[data-it-theme="light"] .login-stat-card strong,
body[data-it-theme="light"] .zt-table td,
body[data-it-theme="light"] .zt-table th,
body[data-it-theme="light"] [class*="text-white"],
body[data-it-theme="light"] [class*="text-slate-"],
body[data-it-theme="light"] [class*="text-gray-"],
body[data-it-theme="light"] [class*="text-zinc-"]{
  color:#101827!important;
}
body[data-it-theme="light"] .panel-meta,
body[data-it-theme="light"] .settings-panel-note,
body[data-it-theme="light"] .network-clean-title p,
body[data-it-theme="light"] .device-toolbar-meta,
body[data-it-theme="light"] .login-hint,
body[data-it-theme="light"] .login-hero-text,
body[data-it-theme="light"] .login-stat-card span,
body[data-it-theme="light"] .login-trust-item p,
body[data-it-theme="light"] .app-footer,
body[data-it-theme="light"] .copyright-link,
body[data-it-theme="light"] .field-caption,
body[data-it-theme="light"] .help-note,
body[data-it-theme="light"] .form-help,
body[data-it-theme="light"] .muted-help{
  color:#4b5f7a!important;
}
body[data-it-theme="light"] .theme-accent,
body[data-it-theme="light"] .theme-kicker,
body[data-it-theme="light"] .theme-chip,
body[data-it-theme="light"] .brand-chip,
body[data-it-theme="light"] .sidebar-kicker,
body[data-it-theme="light"] .analytics-chip,
body[data-it-theme="light"] .section-chip,
body[data-it-theme="light"] .section-title-sm,
body[data-it-theme="light"] .login-badge,
body[data-it-theme="light"] .login-overline,
body[data-it-theme="light"] .net-header-kicker,
body[data-it-theme="light"] .network-quick-copy{
  color:#1d4ed8!important;
  border-color:rgba(29,78,216,.22)!important;
}
body[data-it-theme="light"] .sidebar-nav .nav-btn,
body[data-it-theme="light"] .toolbar-btn,
body[data-it-theme="light"] .device-search-wrap,
body[data-it-theme="light"] .input-glass,
body[data-it-theme="light"] .ip-btn,
body[data-it-theme="light"] .metric-chip,
body[data-it-theme="light"] .device-status-card,
body[data-it-theme="light"] .password-toggle,
body[data-it-theme="light"] .login-tab,
body[data-it-theme="light"] select,
body[data-it-theme="light"] textarea,
body[data-it-theme="light"] input{
  background:#f9fbfe!important;
  border-color:rgba(120,139,166,.32)!important;
  color:#101827!important;
}
body[data-it-theme="light"] .sidebar-nav .nav-btn.active,
body[data-it-theme="light"] .sidebar-nav .nav-btn:hover,
body[data-it-theme="light"] .toolbar-btn:hover,
body[data-it-theme="light"] .login-tab.active{
  background:linear-gradient(135deg,#1d4ed8,#60a5fa)!important;
  border-color:transparent!important;
  color:#ffffff!important;
  box-shadow:0 12px 28px rgba(29,78,216,.20)!important;
}
body[data-it-theme="light"] .sidebar-nav .nav-btn.active *,
body[data-it-theme="light"] .sidebar-nav .nav-btn:hover *,
body[data-it-theme="light"] .toolbar-btn:hover *,
body[data-it-theme="light"] .login-tab.active *{
  color:#ffffff!important;
}
body[data-it-theme="light"] .btn-primary,
body[data-it-theme="light"] .network-clean-primary,
body[data-it-theme="light"] .sidebar-floating-toggle,
body[data-it-theme="light"] .it-top-choice-btn.active,
body[data-it-theme="light"] .login-submit,
body[data-it-theme="light"] .network-quick-actions .action-btn.primary{
  background:linear-gradient(135deg,#1d4ed8,#60a5fa)!important;
  color:#ffffff!important;
  border-color:transparent!important;
  box-shadow:0 14px 28px rgba(29,78,216,.20)!important;
}
body[data-it-theme="light"] .btn-primary *,
body[data-it-theme="light"] .network-clean-primary *,
body[data-it-theme="light"] .it-top-choice-btn.active *,
body[data-it-theme="light"] .login-submit *{
  color:#ffffff!important;
}
body[data-it-theme="light"] .zt-table thead th{
  background:#eef4fb!important;
  color:#334155!important;
}
body[data-it-theme="light"] .zt-table td,
body[data-it-theme="light"] .zt-table th,
body[data-it-theme="light"] .device-card,
body[data-it-theme="light"] .network-list-card,
body[data-it-theme="light"] .network-quick-item,
body[data-it-theme="light"] .table-shell{
  border-color:rgba(120,139,166,.24)!important;
}
body[data-it-theme="light"] .app-footer{
  background:rgba(255,255,255,.62)!important;
  border-top:1px solid rgba(120,139,166,.22)!important;
}
body[data-it-theme="light"] .path-offline{background:rgba(239,68,68,.10)!important;color:#b91c1c!important;border-color:rgba(239,68,68,.24)!important;}
body[data-it-theme="light"] .path-direct,
body[data-it-theme="light"] .path-online{background:rgba(34,197,94,.10)!important;color:#047857!important;border-color:rgba(34,197,94,.24)!important;}
body[data-it-theme="light"] .path-pending{background:rgba(245,158,11,.12)!important;color:#92400e!important;border-color:rgba(245,158,11,.28)!important;}
/* V141_ARABIC_ONLY_THEME_COLOR_FIX_END */


/* V142_ARABIC_UI_CONTRAST_OVERFLOW_FIX_START */
html[data-it-theme="light"],
body[data-it-theme="light"]{
  --brand-bg:#e9f0f8!important;
  --brand-bg-alt:#dde8f4!important;
  --brand-panel:#ffffff!important;
  --brand-panel-soft:#f4f8fc!important;
  --brand-text:#0f172a!important;
  --brand-muted:#526379!important;
  --brand-accent:#2563eb!important;
  --brand-accent-soft:#60a5fa!important;
}
body[data-it-theme="light"]{
  background:
    radial-gradient(circle at 7% 0%, rgba(96,165,250,.11), transparent 26%),
    radial-gradient(circle at 90% 10%, rgba(59,130,246,.08), transparent 20%),
    linear-gradient(180deg,#f5f9fd 0%,#edf3f9 48%,#e7eef6 100%)!important;
  color:#0f172a!important;
}
body[data-it-theme="light"] :where(.card,.compact-card,.device-card,.network-list-card,.section-shell,.table-shell,.chart-shell,.app-sidebar,.network-clean-header,.sidebar-brand-card,.sidebar-user-card,.sidebar-mini-tile,.sidebar-status-card,.network-command-card,.network-quick-item,.network-quick-qr,.networks-compact-head,.networks-compact-card,.network-kpi-card,.pending-devices-section,.active-devices-section){
  background:linear-gradient(180deg, rgba(255,255,255,.985), rgba(244,248,252,.955))!important;
  border-color:rgba(127,145,170,.30)!important;
  box-shadow:0 16px 36px rgba(15,23,42,.10), inset 0 1px 0 rgba(255,255,255,.98)!important;
}
body[data-it-theme="light"] :where(.panel-title,.compact-title,h1,h2,h3,h4,.device-name,.sidebar-user-name,.network-clean-title h1,.networks-compact-head h1,.networks-compact-name h3,.network-command-title-row h3,.network-card-open,.network-card-copy,.networks-compact-open,.networks-compact-copy){
  color:#0f172a!important;
}
body[data-it-theme="light"] :where(.panel-meta,.settings-panel-note,.network-clean-title p,.device-toolbar-meta,.app-footer,.copyright-link,.field-caption,.help-note,.networks-compact-head p,.networks-compact-name p,.network-card-note,.network-detail-grid span,.network-metric span,.networks-compact-id span,.networks-compact-mini span,.sidebar-kicker,.brand-chip){
  color:#5b6b80!important;
}
body[data-it-theme="light"] :where(.toolbar-btn,.ip-btn,.network-quick-actions .action-btn,.network-card-copy,.networks-compact-copy,.login-secondary,.password-toggle,.input-glass,.device-search-wrap,select,textarea,input:not([type="checkbox"]):not([type="radio"]),.it-top-choice-btn){
  background:#f7fbff!important;
  color:#0f172a!important;
  border-color:rgba(127,145,170,.30)!important;
}
body[data-it-theme="light"] :where(.btn-primary,.network-clean-primary,.network-card-open,.networks-compact-open,.login-submit,.sidebar-floating-toggle,.it-top-choice-btn.active,.toolbar-btn.active,.ip-btn.active){
  background:linear-gradient(135deg,#2563eb,#4f8ef7)!important;
  color:#eff6ff!important;
  border-color:transparent!important;
  box-shadow:0 10px 24px rgba(37,99,235,.20)!important;
}
body[data-it-theme="light"] .app-footer{
  background:linear-gradient(180deg, rgba(232,239,247,.82), rgba(224,233,243,.86))!important;
  color:#334155!important;
  border-top:1px solid rgba(127,145,170,.18)!important;
}
body[data-it-theme="light"] .sidebar-nav .nav-btn{
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(244,248,252,.94))!important;
  color:#0f172a!important;
  border-color:rgba(127,145,170,.25)!important;
}
body[data-it-theme="light"] .sidebar-nav .nav-btn.active,
body[data-it-theme="light"] .sidebar-nav .nav-btn:hover{
  background:linear-gradient(135deg,#2f66e9,#6ea6ff)!important;
  color:#eff6ff!important;
  box-shadow:0 12px 26px rgba(37,99,235,.16)!important;
}
body[data-it-theme="light"] .sidebar-nav .nav-btn.active * ,
body[data-it-theme="light"] .sidebar-nav .nav-btn:hover *{
  color:#eff6ff!important;
}
/* networks list overflow fixes */
.networks-compact-main,
.network-command-title-row,
.network-name-block,
.network-card-footer,
.network-card-actions,
.network-detail-grid,
.network-command-card-main,
.networks-compact-buttons,
.networks-compact-id,
.networks-compact-mini{
  min-width:0;
}
.networks-compact-main{
  grid-template-columns:minmax(240px,1.55fr) minmax(118px,.85fr) 72px 72px 72px auto!important;
  align-items:center!important;
}
.networks-compact-name{min-width:0!important; overflow:hidden!important;}
.networks-compact-name > div{min-width:0!important; overflow:hidden!important;}
.networks-compact-name h3,
.networks-compact-name p,
.networks-compact-id strong,
.networks-compact-sub span,
.network-detail-grid strong,
.network-card-note,
.network-name-block h3,
.network-name-block p{
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  max-width:100%!important;
}
.networks-compact-buttons{justify-content:flex-start!important; flex-wrap:wrap!important;}
.networks-compact-copy,.networks-compact-open{padding-inline:12px!important; min-width:88px!important;}
.networks-compact-sub{row-gap:6px!important; column-gap:10px!important; align-items:center!important;}
.network-command-title-row{display:flex!important; align-items:flex-start!important; justify-content:space-between!important; gap:12px!important;}
.network-name-block{display:flex!important; gap:10px!important; min-width:0!important; flex:1 1 auto!important;}
.network-name-block > div{min-width:0!important; flex:1 1 auto!important;}
.network-command-title-row .network-tier-badge{flex:0 0 auto!important; max-width:150px!important; overflow:hidden!important; text-overflow:ellipsis!important;}
.network-detail-grid{display:grid!important; grid-template-columns:repeat(4,minmax(0,1fr))!important; gap:10px!important;}
.network-detail-grid > div{min-width:0!important;}
.network-card-footer{display:flex!important; align-items:center!important; justify-content:space-between!important; gap:12px!important; flex-wrap:wrap!important;}
.network-card-actions{display:flex!important; gap:8px!important; flex-wrap:wrap!important;}
/* repeated character / visual glitch helper classes */
body[data-it-theme="light"] .muted-badge,
body[data-it-theme="light"] .network-tier-badge,
body[data-it-theme="light"] .networks-compact-id,
body[data-it-theme="light"] .networks-compact-mini{
  background:#f4f8fc!important;
  border-color:rgba(127,145,170,.24)!important;
}
@media (max-width:1180px){
  .network-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media (max-width:980px){
  .networks-compact-main{grid-template-columns:1fr 1fr 1fr!important;}
  .networks-compact-name,.networks-compact-id,.networks-compact-buttons{grid-column:1/-1!important;}
  .network-command-title-row{flex-direction:column!important;}
  .network-card-footer{flex-direction:column!important; align-items:stretch!important;}
}
@media (max-width:640px){
  .network-detail-grid{grid-template-columns:1fr!important;}
  .networks-compact-main{grid-template-columns:1fr!important;}
}
/* V142_ARABIC_UI_CONTRAST_OVERFLOW_FIX_END */


/* V143_FINAL_ARABIC_VISUAL_PAGE_REVIEW_START */
/* Final Arabic-only visual polish: clearer light theme, page cards, and safe overflow behavior. */
html, body, #appView { text-rendering: optimizeLegibility; }
html[dir="rtl"] body { direction: rtl; text-align: right; }
body[data-it-theme="light"]{
  --brand-bg:#e8f0f8!important;
  --brand-bg-alt:#dfeaf5!important;
  --brand-panel:#ffffff!important;
  --brand-panel-soft:#f2f6fb!important;
  --brand-text:#0b1220!important;
  --brand-muted:#42546b!important;
  --brand-accent:#1d4ed8!important;
  --brand-accent-soft:#3b82f6!important;
  background:
    radial-gradient(circle at 12% 0%, rgba(37,99,235,.13), transparent 28%),
    radial-gradient(circle at 86% 16%, rgba(56,189,248,.09), transparent 24%),
    linear-gradient(180deg,#f7fbff 0%,#eaf2fa 52%,#e2ebf5 100%)!important;
  color:#0b1220!important;
}
body[data-it-theme="light"] :where(.card,.compact-card,.device-card,.device-row,.network-list-card,.network-command-card,.networks-compact-card,.networks-compact-head,.network-clean-header,.network-kpi-card,.section-shell,.sa-section-shell,.table-shell,.chart-shell,.app-sidebar,.sidebar-brand-card,.sidebar-user-card,.sidebar-status-card,.sidebar-mini-tile,.pending-devices-section,.active-devices-section,.backup-restore-hint,.quick-client-output,.qr-download-panel,.ai-terminal-box,.ai-terminal-shell,.modal-content,.modal-card){
  background:linear-gradient(180deg,rgba(255,255,255,.99),rgba(242,246,251,.965))!important;
  border:1px solid rgba(102,119,146,.28)!important;
  box-shadow:0 18px 42px rgba(15,23,42,.115), inset 0 1px 0 rgba(255,255,255,.98)!important;
}
body[data-it-theme="light"] :where(h1,h2,h3,h4,.panel-title,.compact-title,.network-clean-title h1,.networks-compact-head h1,.networks-compact-name h3,.network-name-block h3,.device-name,.sidebar-user-name,.metric-value,.zt-table td,.zt-table th,.field-label,.login-label,.settings-title,.sa-title){
  color:#0b1220!important;
  text-shadow:none!important;
}
body[data-it-theme="light"] :where(.panel-meta,.network-clean-title p,.networks-compact-head p,.networks-compact-name p,.network-card-note,.network-detail-grid span,.network-metric span,.networks-compact-id span,.networks-compact-mini span,.device-subtitle,.settings-panel-note,.field-caption,.help-note,.muted-help,.form-help,.app-footer,.copyright-link){
  color:#42546b!important;
}
body[data-it-theme="light"] :where(.input-glass,input:not([type="checkbox"]):not([type="radio"]),textarea,select,.device-search-wrap,.ip-btn,.toolbar-btn,.network-card-copy,.networks-compact-copy,.network-quick-actions .action-btn,.it-top-choice-btn,.login-secondary,.password-toggle){
  background:#f8fbff!important;
  border-color:rgba(102,119,146,.30)!important;
  color:#0b1220!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.92)!important;
}
body[data-it-theme="light"] :where(.input-glass:focus,input:focus,textarea:focus,select:focus){
  border-color:rgba(37,99,235,.55)!important;
  box-shadow:0 0 0 4px rgba(37,99,235,.12)!important;
}
body[data-it-theme="light"] :where(.btn-primary,.network-clean-primary,.network-card-open,.networks-compact-open,.login-submit,.it-top-choice-btn.active,.sidebar-floating-toggle,.toolbar-btn.active,.ip-btn.active){
  background:linear-gradient(135deg,#1d4ed8,#3b82f6)!important;
  color:#ffffff!important;
  border-color:transparent!important;
  box-shadow:0 14px 30px rgba(37,99,235,.22)!important;
}
body[data-it-theme="light"] .sidebar-nav .nav-btn{
  background:linear-gradient(180deg,#ffffff,#f3f7fc)!important;
  border:1px solid rgba(102,119,146,.24)!important;
  color:#0b1220!important;
}
body[data-it-theme="light"] .sidebar-nav .nav-btn.active,
body[data-it-theme="light"] .sidebar-nav .nav-btn:hover{
  background:linear-gradient(135deg,#1d4ed8,#60a5fa)!important;
  color:#ffffff!important;
  border-color:transparent!important;
  box-shadow:0 14px 30px rgba(37,99,235,.20)!important;
}
body[data-it-theme="light"] .sidebar-nav .nav-btn.active *,
body[data-it-theme="light"] .sidebar-nav .nav-btn:hover *{ color:#ffffff!important; }
body[data-it-theme="light"] .sidebar-nav .nav-btn .nav-btn-icon{ background:#172033!important; color:#ffffff!important; }
body[data-it-theme="light"] .sidebar-nav .nav-btn.active .nav-btn-icon{ background:rgba(15,23,42,.90)!important; }
body[data-it-theme="light"] .app-footer,
body[data-it-theme="light"] .app-footer-inner{
  background:linear-gradient(180deg,rgba(230,238,247,.88),rgba(219,230,242,.94))!important;
  color:#334155!important;
  border-color:rgba(102,119,146,.18)!important;
}
/* Robust internal page layout guards */
#view-dashboard,#view-networks,#view-backup,#view-settings,#view-logs,.net-tab-panel,.network-clean-layout,.network-clean-main,.sa-section-shell,.backup-section,.operations-log-shell{
  min-width:0!important;
}
:where(.card,.compact-card,.device-card,.network-list-card,.network-command-card,.networks-compact-card,.network-clean-header,.sa-section-shell,.backup-section,.table-shell,.modal-content) *{
  min-width:0;
}
.networks-compact-main{
  display:grid!important;
  grid-template-columns:minmax(260px,1.55fr) minmax(130px,.82fr) minmax(78px,.42fr) minmax(78px,.42fr) minmax(78px,.42fr) minmax(160px,.72fr)!important;
  gap:12px!important;
  align-items:center!important;
}
.networks-compact-name{display:flex!important; align-items:center!important; gap:10px!important; overflow:hidden!important;}
.networks-compact-name > div{overflow:hidden!important; min-width:0!important;}
.networks-compact-name h3,.networks-compact-name p,.network-name-block h3,.network-name-block p,.network-card-note,.network-detail-grid strong,.network-detail-grid span,.networks-compact-id strong,.networks-compact-sub span{
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  max-width:100%!important;
}
.networks-compact-id strong{direction:ltr!important; unicode-bidi:plaintext!important;}
.networks-compact-buttons{display:flex!important; gap:8px!important; flex-wrap:wrap!important; justify-content:flex-start!important;}
.networks-compact-copy,.networks-compact-open,.network-card-copy,.network-card-open{white-space:nowrap!important; min-height:38px!important; min-width:84px!important;}
.network-command-title-row{display:flex!important; align-items:flex-start!important; justify-content:space-between!important; gap:14px!important;}
.network-name-block{display:flex!important; align-items:flex-start!important; gap:10px!important; flex:1 1 auto!important; overflow:hidden!important;}
.network-name-block > div{flex:1 1 auto!important; min-width:0!important; overflow:hidden!important;}
.network-detail-grid{display:grid!important; grid-template-columns:repeat(4,minmax(0,1fr))!important; gap:10px!important;}
.network-detail-grid > div{overflow:hidden!important;}
.network-card-footer{display:flex!important; align-items:center!important; justify-content:space-between!important; gap:12px!important; flex-wrap:wrap!important;}
.network-card-actions{display:flex!important; gap:8px!important; flex-wrap:wrap!important;}
/* Reduce ghost/pale labels */
body[data-it-theme="light"] :where(.opacity-20,.opacity-30,.opacity-40){opacity:.72!important;}
body[data-it-theme="light"] :where(.text-white,.text-slate-50,.text-slate-100,.text-slate-200,.text-slate-300,.text-slate-400,.text-gray-100,.text-gray-200,.text-gray-300,.text-gray-400){color:#0b1220!important;}
/* Footer final Arabic order and softer height */
.app-footer-inner{font-weight:800!important; letter-spacing:0!important;}
@media (max-width:1200px){
  .networks-compact-main{grid-template-columns:minmax(220px,1.4fr) minmax(120px,.8fr) repeat(3,minmax(70px,.45fr))!important;}
  .networks-compact-buttons{grid-column:1/-1!important; justify-content:flex-start!important;}
  .network-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media (max-width:820px){
  .networks-compact-main{grid-template-columns:1fr!important;}
  .network-command-title-row,.network-card-footer{flex-direction:column!important; align-items:stretch!important;}
  .network-detail-grid{grid-template-columns:1fr!important;}
}
/* V143_FINAL_ARABIC_VISUAL_PAGE_REVIEW_END */


/* V144_ARABIC_SCREEN_BY_SCREEN_VISUAL_FIX_START */
/* General Light Theme: stronger contrast, less washed-out, clearer edges */
html[data-it-theme="light"],
body[data-it-theme="light"]{
  --brand-bg:#dfe9f4!important;
  --brand-bg-alt:#d5e1ee!important;
  --brand-panel:#ffffff!important;
  --brand-panel-soft:#eef4fa!important;
  --brand-text:#07111f!important;
  --brand-muted:#33485f!important;
  --brand-accent:#0f4ed8!important;
  --brand-accent-soft:#2f7df4!important;
}
body[data-it-theme="light"]{
  background:
    radial-gradient(circle at 10% -2%, rgba(47,125,244,.16), transparent 24%),
    radial-gradient(circle at 88% 8%, rgba(15,78,216,.10), transparent 22%),
    linear-gradient(180deg,#f4f8fc 0%,#e6eff8 45%,#dce7f2 100%)!important;
  color:#07111f!important;
}
body[data-it-theme="light"] :where(.card,.compact-card,.device-card,.device-row,.network-list-card,.network-command-card,.networks-compact-card,.networks-compact-head,.network-clean-header,.network-kpi-card,.section-shell,.sa-section-shell,.table-shell,.chart-shell,.app-sidebar,.sidebar-brand-card,.sidebar-user-card,.sidebar-status-card,.sidebar-mini-tile,.pending-devices-section,.active-devices-section,.backup-restore-hint,.quick-client-output,.qr-download-panel,.ai-terminal-box,.ai-terminal-shell,.modal-content,.modal-card,.branch-metric-card,.alert-row-card,.audit-row-card,.operations-log-shell){
  background:linear-gradient(180deg,rgba(255,255,255,.995),rgba(238,244,250,.975))!important;
  border:1px solid rgba(78,99,125,.34)!important;
  box-shadow:0 18px 42px rgba(15,23,42,.145), inset 0 1px 0 rgba(255,255,255,1)!important;
}
body[data-it-theme="light"] :where(h1,h2,h3,h4,.panel-title,.compact-title,.network-clean-title h1,.networks-compact-head h1,.networks-compact-name h3,.network-name-block h3,.branch-metric-card h4,.device-name,.sidebar-user-name,.metric-value,.zt-table td,.zt-table th,.field-label,.settings-title,.sa-title,.font-black){
  color:#07111f!important;
  opacity:1!important;
  text-shadow:none!important;
}
body[data-it-theme="light"] :where(.panel-meta,.network-clean-title p,.networks-compact-head p,.networks-compact-name p,.network-card-note,.network-detail-grid span,.network-metric span,.networks-compact-id span,.networks-compact-mini span,.device-subtitle,.settings-panel-note,.field-caption,.help-note,.muted-help,.form-help,.app-footer,.copyright-link,.text-slate-400,.text-slate-500,.text-slate-600){
  color:#33485f!important;
  opacity:1!important;
}
body[data-it-theme="light"] :where(.opacity-10,.opacity-20,.opacity-30,.opacity-40,.opacity-50){opacity:.86!important;}
body[data-it-theme="light"] :where(.input-glass,input:not([type="checkbox"]):not([type="radio"]),textarea,select,.device-search-wrap,.ip-btn,.toolbar-btn,.network-card-copy,.networks-compact-copy,.network-quick-actions .action-btn,.it-top-choice-btn,.login-secondary,.password-toggle){
  background:#f7fbff!important;
  color:#07111f!important;
  border-color:rgba(78,99,125,.36)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95)!important;
}
body[data-it-theme="light"] :where(.btn-primary,.network-clean-primary,.network-card-open,.networks-compact-open,.login-submit,.it-top-choice-btn.active,.sidebar-floating-toggle,.toolbar-btn.active,.ip-btn.active){
  background:linear-gradient(135deg,#0f4ed8,#2f7df4)!important;
  color:#fff!important;
  border-color:transparent!important;
  box-shadow:0 14px 30px rgba(15,78,216,.24)!important;
}
/* Sidebar screen */
body[data-it-theme="light"] .app-sidebar{background:linear-gradient(180deg,#ffffff,#f0f5fa)!important;}
body[data-it-theme="light"] .sidebar-nav .nav-btn{
  background:linear-gradient(180deg,#ffffff,#f1f6fb)!important;
  border:1px solid rgba(78,99,125,.28)!important;
  color:#07111f!important;
}
body[data-it-theme="light"] .sidebar-nav .nav-btn.active,
body[data-it-theme="light"] .sidebar-nav .nav-btn:hover{
  background:linear-gradient(135deg,#0f4ed8,#5d9cff)!important;
  color:#fff!important;
  border-color:transparent!important;
}
body[data-it-theme="light"] .sidebar-nav .nav-btn.active *,
body[data-it-theme="light"] .sidebar-nav .nav-btn:hover *{color:#fff!important;}
body[data-it-theme="light"] .sidebar-nav .nav-btn .nav-btn-icon{background:#172238!important;color:#fff!important;}
/* Dashboard screen: every card keeps its own space */
#view-dashboard .grid,
#branchMetricsArea,
#alertsArea,
#auditArea{min-width:0!important;}
.branch-metric-card{min-width:260px!important; overflow:hidden!important;}
.branch-metric-card > .flex:first-child{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:6px!important;
  align-items:start!important;
  text-align:right!important;
}
.branch-metric-card h4{
  display:block!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  line-height:1.35!important;
}
.branch-metric-card .font-mono{
  display:block!important;
  direction:ltr!important;
  unicode-bidi:plaintext!important;
  text-align:left!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  color:#526379!important;
}
.branch-metric-card .grid{gap:12px!important;}
.branch-metric-card .text-xs{line-height:1.45!important;}
.alert-row-card,.audit-row-card{overflow:hidden!important;}
/* Networks screen */
.networks-compact-main{
  grid-template-columns:minmax(280px,1.65fr) minmax(130px,.8fr) minmax(80px,.42fr) minmax(80px,.42fr) minmax(80px,.42fr) minmax(150px,.7fr)!important;
  gap:12px!important;
  align-items:center!important;
}
.networks-compact-name,.network-name-block{min-width:0!important;overflow:hidden!important;}
.networks-compact-name > div,.network-name-block > div{min-width:0!important;overflow:hidden!important;}
.networks-compact-name h3,.networks-compact-name p,.network-name-block h3,.network-name-block p,.networks-compact-id strong,.networks-compact-sub span,.network-card-note,.network-detail-grid strong,.network-detail-grid span{
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.networks-compact-id strong,.network-detail-grid strong{direction:ltr!important;unicode-bidi:plaintext!important;}
.networks-compact-buttons,.network-card-actions{display:flex!important;gap:8px!important;flex-wrap:wrap!important;justify-content:flex-start!important;}
/* Devices screen */
.device-card,.device-row{overflow:hidden!important;}
.device-card :where(.device-name,.device-subtitle,.mono,.font-mono){overflow:hidden!important;text-overflow:ellipsis!important;}
/* Backup screen */
#view-backup :where(.card,.backup-restore-hint,.table-shell){overflow:hidden!important;}
#view-backup :where(input,select,button,textarea){min-height:42px!important;}
/* Settings screen */
#view-settings :where(.sa-section-shell,.card,.input-glass){overflow:hidden!important;}
#view-settings :where(h1,h2,h3,h4){line-height:1.35!important;}
/* Logs screen */
#view-logs :where(.card,.operations-log-shell,.audit-row-card){overflow:hidden!important;}
/* Footer */
body[data-it-theme="light"] .app-footer,
body[data-it-theme="light"] .app-footer-inner{
  background:linear-gradient(180deg,rgba(222,233,245,.94),rgba(211,225,239,.98))!important;
  color:#1e293b!important;
  border-top:1px solid rgba(78,99,125,.22)!important;
}
@media(max-width:1200px){.networks-compact-main{grid-template-columns:1fr 1fr 1fr!important}.networks-compact-name,.networks-compact-id,.networks-compact-buttons{grid-column:1/-1!important}}
@media(max-width:760px){.networks-compact-main{grid-template-columns:1fr!important}.branch-metric-card{min-width:0!important}}
/* V144_ARABIC_SCREEN_BY_SCREEN_VISUAL_FIX_END */


/* V145_TAILWIND_DARK_MODE_SAFE_UI_LAYER_START
   Safe color architecture layer only. No template text changes and no feature removal. */
html{color-scheme:light;}
html.dark{color-scheme:dark;}
html:not(.dark),
html[data-it-theme="light"]{
  --it-bg:#e8f0f8;
  --it-bg-soft:#f3f7fb;
  --it-card:#ffffff;
  --it-card-2:#f8fbfe;
  --it-text:#0f172a;
  --it-muted:#475569;
  --it-border:#b7c4d4;
  --it-border-soft:#d4dde8;
  --it-primary:#1d4ed8;
  --it-primary-2:#3b82f6;
  --it-success:#047857;
  --it-danger:#b91c1c;
  --it-warning:#a16207;
  --it-shadow:0 14px 34px rgba(15,23,42,.12);
}
html.dark,
html[data-it-theme="dark"]{
  --it-bg:#08101d;
  --it-bg-soft:#0b1424;
  --it-card:#0b1120;
  --it-card-2:#101b2f;
  --it-text:#f8fafc;
  --it-muted:#94a3b8;
  --it-border:#1e3a5f;
  --it-border-soft:rgba(59,130,246,.22);
  --it-primary:#60a5fa;
  --it-primary-2:#38bdf8;
  --it-success:#34d399;
  --it-danger:#f87171;
  --it-warning:#fbbf24;
  --it-shadow:0 18px 46px rgba(0,0,0,.35);
}
html:not(.dark) body,
body[data-it-theme="light"]{
  background:
    radial-gradient(circle at 10% -4%, rgba(59,130,246,.13), transparent 27%),
    radial-gradient(circle at 90% 8%, rgba(14,165,233,.10), transparent 23%),
    linear-gradient(180deg,var(--it-bg-soft) 0%, var(--it-bg) 100%)!important;
  color:var(--it-text)!important;
}
html.dark body,
body[data-it-theme="dark"]{
  background:
    radial-gradient(circle at 10% -4%, rgba(96,165,250,.13), transparent 28%),
    radial-gradient(circle at 90% 8%, rgba(56,189,248,.08), transparent 22%),
    linear-gradient(180deg,#08101d 0%, #0b1424 100%)!important;
  color:var(--it-text)!important;
}
/* Shared component surfaces */
body :where(.card,.compact-card,.device-card,.device-row,.network-list-card,.network-command-card,.networks-compact-card,.networks-compact-head,.network-clean-header,.network-kpi-card,.section-shell,.sa-section-shell,.table-shell,.chart-shell,.app-sidebar,.sidebar-brand-card,.sidebar-user-card,.sidebar-status-card,.sidebar-mini-tile,.pending-devices-section,.active-devices-section,.backup-restore-hint,.quick-client-output,.qr-download-panel,.ai-terminal-box,.ai-terminal-shell,.modal-content,.modal-card,.branch-metric-card,.alert-row-card,.audit-row-card,.operations-log-shell,.login-card-pro,.login-brand-panel,.login-form-shell){
  background:linear-gradient(180deg, color-mix(in srgb, var(--it-card) 98%, transparent), color-mix(in srgb, var(--it-card-2) 96%, transparent))!important;
  border-color:var(--it-border-soft)!important;
  box-shadow:var(--it-shadow)!important;
}
body :where(h1,h2,h3,h4,.panel-title,.compact-title,.network-clean-title h1,.networks-compact-head h1,.networks-compact-name h3,.network-name-block h3,.branch-metric-card h4,.device-name,.sidebar-user-name,.metric-value,.zt-table td,.zt-table th,.field-label,.settings-title,.sa-title,.font-black){
  color:var(--it-text)!important;
  opacity:1!important;
  text-shadow:none!important;
}
body :where(.panel-meta,.network-clean-title p,.networks-compact-head p,.networks-compact-name p,.network-card-note,.network-detail-grid span,.network-metric span,.networks-compact-id span,.networks-compact-mini span,.device-subtitle,.settings-panel-note,.field-caption,.help-note,.muted-help,.form-help,.app-footer,.copyright-link,.text-slate-400,.text-slate-500,.text-slate-600){
  color:var(--it-muted)!important;
  opacity:1!important;
}
body :where(.input-glass,input:not([type="checkbox"]):not([type="radio"]),textarea,select,.device-search-wrap,.ip-btn,.toolbar-btn,.network-card-copy,.networks-compact-copy,.network-quick-actions .action-btn,.it-top-choice-btn,.login-secondary,.password-toggle){
  background:color-mix(in srgb, var(--it-card-2) 92%, var(--it-card))!important;
  color:var(--it-text)!important;
  border-color:var(--it-border)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12)!important;
}
body :where(.btn-primary,.network-clean-primary,.network-card-open,.networks-compact-open,.login-submit,.it-top-choice-btn.active,.sidebar-floating-toggle,.toolbar-btn.active,.ip-btn.active){
  background:linear-gradient(135deg,var(--it-primary),var(--it-primary-2))!important;
  color:#fff!important;
  border-color:transparent!important;
  box-shadow:0 14px 30px color-mix(in srgb, var(--it-primary) 25%, transparent)!important;
}
/* Sidebar */
body .app-sidebar{border-color:var(--it-border-soft)!important;}
body .sidebar-nav .nav-btn{
  background:linear-gradient(180deg, color-mix(in srgb, var(--it-card) 96%, transparent), color-mix(in srgb, var(--it-card-2) 92%, transparent))!important;
  border:1px solid var(--it-border-soft)!important;
  color:var(--it-text)!important;
}
body .sidebar-nav .nav-btn.active,
body .sidebar-nav .nav-btn:hover{
  background:linear-gradient(135deg,var(--it-primary),var(--it-primary-2))!important;
  color:#fff!important;
  border-color:transparent!important;
}
body .sidebar-nav .nav-btn.active *,
body .sidebar-nav .nav-btn:hover *{color:#fff!important;}
body .sidebar-nav .nav-btn .nav-btn-icon{background:#172238!important;color:#fff!important;}
/* Dashboard: branch card gets its own protected structure */
.branch-metric-card{
  min-width:260px!important;
  overflow:hidden!important;
  padding:16px!important;
}
.branch-metric-card .v145-branch-head{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:10px!important;
  align-items:start!important;
  margin-bottom:14px!important;
}
.branch-metric-card .v145-branch-name{
  display:block!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  line-height:1.35!important;
  font-weight:1000!important;
  color:var(--it-text)!important;
}
.branch-metric-card .v145-branch-id{
  display:block!important;
  direction:ltr!important;
  unicode-bidi:plaintext!important;
  text-align:right!important;
  max-width:180px!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  color:var(--it-muted)!important;
  font-size:11px!important;
}
.branch-metric-card .v145-branch-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:10px!important;
  text-align:center!important;
}
.branch-metric-card .v145-branch-grid > div{
  min-width:0!important;
  padding:8px 6px!important;
  border-radius:12px!important;
  background:color-mix(in srgb, var(--it-card-2) 84%, transparent)!important;
  border:1px solid var(--it-border-soft)!important;
}
.branch-metric-card .v145-branch-label{
  font-size:11px!important;
  color:var(--it-muted)!important;
  margin-bottom:4px!important;
  line-height:1.35!important;
}
.branch-metric-card .v145-branch-value{
  font-size:24px!important;
  font-weight:1000!important;
  line-height:1.1!important;
}
/* Networks screen spacing and overflow */
.networks-compact-main{
  grid-template-columns:minmax(290px,1.65fr) minmax(130px,.8fr) minmax(80px,.42fr) minmax(80px,.42fr) minmax(80px,.42fr) minmax(150px,.7fr)!important;
  gap:12px!important;
  align-items:center!important;
}
.networks-compact-name,.network-name-block{min-width:0!important;overflow:hidden!important;}
.networks-compact-name > div,.network-name-block > div{min-width:0!important;overflow:hidden!important;}
.networks-compact-name h3,.networks-compact-name p,.network-name-block h3,.network-name-block p,.networks-compact-id strong,.networks-compact-sub span,.network-card-note,.network-detail-grid strong,.network-detail-grid span{
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.networks-compact-id strong,.network-detail-grid strong{direction:ltr!important;unicode-bidi:plaintext!important;}
.networks-compact-buttons,.network-card-actions{display:flex!important;gap:8px!important;flex-wrap:wrap!important;justify-content:flex-start!important;}
/* Page-level care */
#view-dashboard :where(.grid,#branchMetricsArea,#alertsArea,#auditArea),
#view-networks :where(.grid,.network-detail-grid),
#view-backup :where(.grid,.table-shell),
#view-settings :where(.grid,.sa-section-shell),
#view-logs :where(.grid,.operations-log-shell){min-width:0!important;}
#view-backup :where(.card,.backup-restore-hint,.table-shell),
#view-settings :where(.sa-section-shell,.card,.input-glass),
#view-logs :where(.card,.operations-log-shell,.audit-row-card),
.device-card,.device-row{overflow:hidden!important;}
body .app-footer,
body .app-footer-inner{
  background:linear-gradient(180deg, color-mix(in srgb, var(--it-bg-soft) 85%, var(--it-card)), color-mix(in srgb, var(--it-bg) 90%, var(--it-card)))!important;
  color:var(--it-muted)!important;
  border-top:1px solid var(--it-border-soft)!important;
}
@media(max-width:1200px){.networks-compact-main{grid-template-columns:1fr 1fr 1fr!important}.networks-compact-name,.networks-compact-id,.networks-compact-buttons{grid-column:1/-1!important}}
@media(max-width:760px){.networks-compact-main{grid-template-columns:1fr!important}.branch-metric-card{min-width:0!important}.branch-metric-card .v145-branch-head{grid-template-columns:1fr!important}.branch-metric-card .v145-branch-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
/* V145_TAILWIND_DARK_MODE_SAFE_UI_LAYER_END */


/* V146_PREMIUM_VISUAL_REFRESH_NO_TEXT_CHANGE_START
   Final premium visual layer only. No text/template changes. */
:root,
html:not(.dark),
html[data-it-theme="light"],
body[data-it-theme="light"]{
  --v146-page:#e3ebf5;
  --v146-page-2:#f7fafc;
  --v146-surface:#ffffff;
  --v146-surface-2:#f8fafc;
  --v146-surface-3:#eef4fb;
  --v146-text:#0f172a;
  --v146-muted:#475569;
  --v146-border:#aebdd0;
  --v146-border-soft:#ccd6e3;
  --v146-primary:#1454d8;
  --v146-primary-2:#0ea5e9;
  --v146-primary-dark:#0f2b57;
  --v146-success:#047857;
  --v146-danger:#b91c1c;
  --v146-warning:#a16207;
  --v146-shadow:0 18px 44px rgba(15,23,42,.14);
  --v146-shadow-sm:0 10px 24px rgba(15,23,42,.11);
}
html.dark,
html[data-it-theme="dark"],
body[data-it-theme="dark"]{
  --v146-page:#08101d;
  --v146-page-2:#0b1424;
  --v146-surface:#0c1627;
  --v146-surface-2:#101d32;
  --v146-surface-3:#13243d;
  --v146-text:#f8fafc;
  --v146-muted:#9fb0c6;
  --v146-border:#234569;
  --v146-border-soft:rgba(96,165,250,.22);
  --v146-primary:#60a5fa;
  --v146-primary-2:#22d3ee;
  --v146-primary-dark:#0b1630;
  --v146-success:#34d399;
  --v146-danger:#fb7185;
  --v146-warning:#fbbf24;
  --v146-shadow:0 24px 58px rgba(0,0,0,.38);
  --v146-shadow-sm:0 14px 32px rgba(0,0,0,.30);
}
html:not(.dark) body,
body[data-it-theme="light"]{
  background:
    radial-gradient(circle at 12% 0%, rgba(20,84,216,.14), transparent 24%),
    radial-gradient(circle at 88% 6%, rgba(14,165,233,.12), transparent 22%),
    linear-gradient(180deg,var(--v146-page-2) 0%, var(--v146-page) 58%, #dce7f2 100%)!important;
  color:var(--v146-text)!important;
}
html.dark body,
body[data-it-theme="dark"]{
  background:
    radial-gradient(circle at 12% 0%, rgba(96,165,250,.16), transparent 26%),
    radial-gradient(circle at 90% 8%, rgba(34,211,238,.10), transparent 22%),
    linear-gradient(180deg,#08101d 0%, #0b1424 62%, #07101d 100%)!important;
  color:var(--v146-text)!important;
}
body[data-it-theme] *{box-sizing:border-box;}
body[data-it-theme] :where(.card,.compact-card,.device-card,.device-row,.network-list-card,.network-command-card,.networks-compact-card,.networks-compact-head,.network-clean-header,.network-kpi-card,.section-shell,.sa-section-shell,.table-shell,.chart-shell,.pending-devices-section,.active-devices-section,.backup-restore-hint,.quick-client-output,.qr-download-panel,.ai-terminal-box,.ai-terminal-shell,.modal-content,.modal-card,.branch-metric-card,.alert-row-card,.audit-row-card,.operations-log-shell,.login-card-pro,.login-brand-panel,.login-form-shell,.it-top-appearance-panel){
  background:linear-gradient(180deg,var(--v146-surface) 0%, var(--v146-surface-2) 100%)!important;
  border:1px solid var(--v146-border-soft)!important;
  box-shadow:var(--v146-shadow)!important;
  color:var(--v146-text)!important;
  backdrop-filter:none!important;
}
body[data-it-theme] :where(.card,.compact-card,.device-card,.network-list-card,.network-command-card,.networks-compact-card,.section-shell,.sa-section-shell,.table-shell,.chart-shell,.branch-metric-card){
  border-radius:22px!important;
}
body[data-it-theme] :where(h1,h2,h3,h4,.panel-title,.compact-title,.network-clean-title h1,.networks-compact-head h1,.networks-compact-name h3,.network-name-block h3,.branch-metric-card h4,.device-name,.sidebar-user-name,.metric-value,.network-quick-value,.zt-table td,.zt-table th,.field-label,.settings-title,.sa-title,.font-black,.font-bold){
  color:var(--v146-text)!important;
  opacity:1!important;
  text-shadow:none!important;
}
body[data-it-theme] :where(.panel-meta,.network-clean-title p,.networks-compact-head p,.networks-compact-name p,.network-card-note,.network-detail-grid span,.network-metric span,.networks-compact-id span,.networks-compact-mini span,.device-subtitle,.settings-panel-note,.field-caption,.help-note,.muted-help,.form-help,.app-footer,.copyright-link,.network-quick-note,.login-hint,.text-slate-400,.text-slate-500,.text-slate-600,.text-gray-400,.text-gray-500){
  color:var(--v146-muted)!important;
  opacity:1!important;
}
/* Premium hybrid sidebar: light content + dark brand sidebar gives stronger contrast and identity */
body[data-it-theme="light"] .app-sidebar{
  background:
    radial-gradient(circle at 30% 0%, rgba(14,165,233,.16), transparent 30%),
    linear-gradient(180deg,#0f2b57 0%, #0b1e3b 58%, #08162d 100%)!important;
  border-color:rgba(96,165,250,.26)!important;
  box-shadow:0 24px 60px rgba(15,43,87,.28)!important;
}
body[data-it-theme="light"] .app-sidebar :where(.sidebar-brand-card,.sidebar-user-card,.sidebar-status-card,.sidebar-mini-tile,.it-top-appearance-panel){
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.045))!important;
  border-color:rgba(191,219,254,.18)!important;
  box-shadow:0 12px 28px rgba(0,0,0,.16)!important;
}
body[data-it-theme="light"] .app-sidebar :where(.sidebar-user-name,.sidebar-kicker,.sidebar-tagline,.sidebar-blurb,.it-top-appearance-title,.it-top-appearance-note,.sidebar-status-card *, .sidebar-mini-tile *, .brand-chip){
  color:#eaf4ff!important;
}
body[data-it-theme] .sidebar-nav{gap:10px!important;}
body[data-it-theme] .sidebar-nav .nav-btn{
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.045))!important;
  color:#eaf4ff!important;
  border:1px solid rgba(191,219,254,.16)!important;
  min-height:66px!important;
  border-radius:18px!important;
  box-shadow:none!important;
}
body[data-it-theme] .sidebar-nav .nav-btn *{color:inherit!important;}
body[data-it-theme] .sidebar-nav .nav-btn.active,
body[data-it-theme] .sidebar-nav .nav-btn:hover{
  background:linear-gradient(135deg,var(--v146-primary),var(--v146-primary-2))!important;
  color:#ffffff!important;
  border-color:transparent!important;
  box-shadow:0 14px 32px rgba(14,165,233,.22)!important;
  transform:translateY(-1px);
}
body[data-it-theme] .nav-btn-icon{
  background:rgba(255,255,255,.12)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  color:#fff!important;
}
/* Inputs and controls */
body[data-it-theme] :where(.input-glass,input:not([type="checkbox"]):not([type="radio"]),textarea,select,.device-search-wrap,.ip-btn,.toolbar-btn,.network-card-copy,.networks-compact-copy,.network-quick-actions .action-btn,.it-top-choice-btn,.login-secondary,.password-toggle){
  background:var(--v146-surface)!important;
  color:var(--v146-text)!important;
  border:1px solid var(--v146-border)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.32), var(--v146-shadow-sm)!important;
  border-radius:14px!important;
}
body[data-it-theme] :where(.input-glass:focus,input:focus,textarea:focus,select:focus){
  border-color:var(--v146-primary)!important;
  box-shadow:0 0 0 4px color-mix(in srgb,var(--v146-primary) 18%, transparent)!important;
  outline:none!important;
}
body[data-it-theme] :where(.btn-primary,.network-clean-primary,.network-card-open,.networks-compact-open,.login-submit,.it-top-choice-btn.active,.sidebar-floating-toggle,.toolbar-btn.active,.ip-btn.active){
  background:linear-gradient(135deg,var(--v146-primary) 0%, var(--v146-primary-2) 100%)!important;
  color:#fff!important;
  border-color:transparent!important;
  box-shadow:0 16px 34px color-mix(in srgb,var(--v146-primary) 28%, transparent)!important;
  border-radius:14px!important;
}
body[data-it-theme] :where(.btn-primary,.network-clean-primary,.network-card-open,.networks-compact-open,.toolbar-btn,.ip-btn,.it-top-choice-btn){
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease!important;
}
body[data-it-theme] :where(.btn-primary,.network-clean-primary,.network-card-open,.networks-compact-open,.toolbar-btn,.ip-btn,.it-top-choice-btn):hover{
  transform:translateY(-1px);
}
/* Dashboard KPI/cards */
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 .card,
#view-dashboard .mini-kpi-grid .card,
#view-dashboard .branch-metric-card{
  border-top:4px solid var(--v146-primary)!important;
}
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 .card strong,
#view-dashboard .metric-value,
.branch-metric-card .v145-branch-value{
  font-size:clamp(24px,2.2vw,34px)!important;
  line-height:1.05!important;
  font-weight:1000!important;
}
.branch-metric-card{
  padding:18px!important;
  min-width:280px!important;
}
.branch-metric-card .v145-branch-grid > div{
  background:var(--v146-surface-3)!important;
  border:1px solid var(--v146-border-soft)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.42)!important;
}
body[data-it-theme="dark"] .branch-metric-card .v145-branch-grid > div{box-shadow:none!important;}
.branch-metric-card .v145-branch-name{font-size:16px!important;}
.branch-metric-card .v145-branch-id{color:var(--v146-muted)!important;}
/* Networks screen: richer cards, less washed-out */
.networks-compact-head,
.network-command-card,
.net-header-shell{
  border-top:4px solid var(--v146-primary)!important;
}
.networks-compact-card,
.network-command-card{
  padding:16px!important;
}
.networks-compact-card:hover,
.network-command-card:hover,
.device-card:hover,
.card:hover{
  border-color:color-mix(in srgb,var(--v146-primary) 45%, var(--v146-border))!important;
  box-shadow:0 24px 56px color-mix(in srgb,var(--v146-primary) 14%, rgba(15,23,42,.12))!important;
}
.networks-compact-id,
.networks-compact-mini,
.network-detail-grid > div,
.network-metric{
  background:var(--v146-surface-3)!important;
  border:1px solid var(--v146-border-soft)!important;
  border-radius:14px!important;
}
.networks-compact-id strong,
.network-detail-grid strong{color:var(--v146-primary)!important;}
/* Devices/tables/internal screens */
.device-card,
.device-row,
.audit-row-card,
.alert-row-card{
  border-inline-start:4px solid var(--v146-primary)!important;
}
.zt-table thead th{
  background:var(--v146-surface-3)!important;
  color:var(--v146-text)!important;
  border-bottom:1px solid var(--v146-border)!important;
}
.zt-table td{border-bottom:1px solid var(--v146-border-soft)!important;}
.zt-table tbody tr:hover{background:color-mix(in srgb,var(--v146-primary) 7%, transparent)!important;}
/* Badges and status */
body[data-it-theme] :where(.badge,.role-badge,.analytics-chip,.brand-chip,.section-chip,.network-tier-badge,.path-direct,.path-online,.path-offline,.path-pending){
  border-radius:999px!important;
  font-weight:900!important;
  border:1px solid var(--v146-border-soft)!important;
}
/* Footer */
body[data-it-theme] .app-footer,
body[data-it-theme] .app-footer-inner{
  background:transparent!important;
  color:var(--v146-muted)!important;
  border-color:var(--v146-border-soft)!important;
  box-shadow:none!important;
}
/* Ensure old helper strips do not visually dominate */
body[data-it-ui-density="delivery"] :where(.dashboard-status-strip-v129,.settings-delivery-strip-v129,.delivery-page-strip-v130,.delivery-net-tab-strip-v130){
  opacity:.82!important;
  box-shadow:var(--v146-shadow-sm)!important;
}
@media(max-width:1200px){
  .branch-metric-card{min-width:0!important;}
}
@media(max-width:760px){
  body .app-shell{gap:16px!important;}
  body[data-it-theme] :where(.card,.compact-card,.device-card,.network-list-card,.network-command-card,.networks-compact-card,.section-shell,.sa-section-shell,.table-shell,.chart-shell,.branch-metric-card){border-radius:18px!important;}
}
/* V146_PREMIUM_VISUAL_REFRESH_NO_TEXT_CHANGE_END */


/* V147_PAGE_BY_PAGE_PREMIUM_SKIN_NO_TEXT_CHANGE_START
   Page-by-page premium visual skin. No template text changes. */
:root,
html:not(.dark),
html[data-it-theme="light"],
body[data-it-theme="light"]{
  --v147-page:#dbe7f3;
  --v147-page-top:#f7fafc;
  --v147-card:#ffffff;
  --v147-card-2:#f4f8fc;
  --v147-card-3:#e8f0f8;
  --v147-ink:#0b1220;
  --v147-muted:#334155;
  --v147-soft:#64748b;
  --v147-line:#a7b7cb;
  --v147-line-soft:#c8d4e2;
  --v147-blue:#1557e6;
  --v147-blue-2:#0ea5e9;
  --v147-navy:#0b1b33;
  --v147-navy-2:#102c55;
  --v147-success:#047857;
  --v147-warning:#a16207;
  --v147-danger:#b91c1c;
  --v147-shadow:0 18px 46px rgba(15,23,42,.16);
  --v147-shadow-sm:0 10px 24px rgba(15,23,42,.12);
}
html.dark,
html[data-it-theme="dark"],
body[data-it-theme="dark"]{
  --v147-page:#07101d;
  --v147-page-top:#0b1424;
  --v147-card:#0b1627;
  --v147-card-2:#101f36;
  --v147-card-3:#132943;
  --v147-ink:#f8fafc;
  --v147-muted:#c5d1e0;
  --v147-soft:#93a4bb;
  --v147-line:#244a74;
  --v147-line-soft:rgba(96,165,250,.24);
  --v147-blue:#60a5fa;
  --v147-blue-2:#22d3ee;
  --v147-navy:#08101d;
  --v147-navy-2:#102c55;
  --v147-success:#34d399;
  --v147-warning:#fbbf24;
  --v147-danger:#fb7185;
  --v147-shadow:0 24px 58px rgba(0,0,0,.40);
  --v147-shadow-sm:0 14px 32px rgba(0,0,0,.32);
}
body[data-it-theme="light"], html:not(.dark) body{
  background:
    radial-gradient(circle at 7% 0%, rgba(21,87,230,.16), transparent 24%),
    radial-gradient(circle at 92% 5%, rgba(14,165,233,.13), transparent 22%),
    linear-gradient(180deg,var(--v147-page-top) 0%, #eef4fa 42%, var(--v147-page) 100%)!important;
  color:var(--v147-ink)!important;
}
body[data-it-theme="dark"], html.dark body{
  background:
    radial-gradient(circle at 7% 0%, rgba(96,165,250,.18), transparent 25%),
    radial-gradient(circle at 92% 5%, rgba(34,211,238,.11), transparent 22%),
    linear-gradient(180deg,#07101d 0%, #0b1424 55%, #07101d 100%)!important;
  color:var(--v147-ink)!important;
}
/* global surface reset */
body[data-it-theme] :where(.card,.compact-card,.device-card,.device-row,.network-list-card,.network-command-card,.networks-compact-card,.networks-compact-head,.network-clean-header,.network-kpi-card,.section-shell,.sa-section-shell,.table-shell,.chart-shell,.pending-devices-section,.active-devices-section,.backup-restore-hint,.quick-client-output,.qr-download-panel,.ai-terminal-box,.ai-terminal-shell,.modal-content,.modal-card,.branch-metric-card,.alert-row-card,.audit-row-card,.operations-log-shell,.login-card-pro,.login-brand-panel,.login-form-shell,.it-top-appearance-panel,.network-quick-item,.network-quick-qr){
  background:linear-gradient(180deg,var(--v147-card) 0%, var(--v147-card-2) 100%)!important;
  border:1px solid var(--v147-line-soft)!important;
  box-shadow:var(--v147-shadow)!important;
  color:var(--v147-ink)!important;
  opacity:1!important;
  backdrop-filter:none!important;
}
body[data-it-theme] :where(.card,.compact-card,.device-card,.network-list-card,.network-command-card,.networks-compact-card,.section-shell,.sa-section-shell,.table-shell,.chart-shell,.branch-metric-card,.network-kpi-card){
  border-radius:22px!important;
}
body[data-it-theme] :where(h1,h2,h3,h4,.panel-title,.compact-title,.network-clean-title h1,.networks-compact-head h1,.networks-compact-name h3,.network-name-block h3,.branch-metric-card h4,.device-name,.sidebar-user-name,.metric-value,.network-quick-value,.zt-table td,.zt-table th,.field-label,.settings-title,.sa-title,.font-black,.font-bold,strong){
  color:var(--v147-ink)!important;
  opacity:1!important;
  text-shadow:none!important;
}
body[data-it-theme] :where(.panel-meta,.network-clean-title p,.networks-compact-head p,.networks-compact-name p,.network-card-note,.network-detail-grid span,.network-metric span,.networks-compact-id span,.networks-compact-mini span,.device-subtitle,.settings-panel-note,.field-caption,.help-note,.muted-help,.form-help,.app-footer,.copyright-link,.network-quick-note,.login-hint,.text-slate-400,.text-slate-500,.text-slate-600,.text-gray-400,.text-gray-500,small){
  color:var(--v147-muted)!important;
  opacity:1!important;
}
/* brand sidebar stays premium and readable in both themes */
body[data-it-theme] .app-sidebar{
  background:
    radial-gradient(circle at 35% 0%, rgba(14,165,233,.18), transparent 30%),
    linear-gradient(180deg,var(--v147-navy-2) 0%, var(--v147-navy) 62%, #07101d 100%)!important;
  border-color:rgba(96,165,250,.26)!important;
  box-shadow:0 26px 68px rgba(7,16,29,.34)!important;
  color:#eaf4ff!important;
}
body[data-it-theme] .app-sidebar :where(.sidebar-brand-card,.sidebar-user-card,.sidebar-status-card,.sidebar-mini-tile,.it-top-appearance-panel){
  background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.045))!important;
  border-color:rgba(191,219,254,.20)!important;
  box-shadow:0 14px 34px rgba(0,0,0,.18)!important;
}
body[data-it-theme] .app-sidebar :where(.sidebar-user-name,.sidebar-kicker,.sidebar-tagline,.sidebar-blurb,.it-top-appearance-title,.it-top-appearance-note,.brand-chip,.sidebar-status-card *,.sidebar-mini-tile *){color:#eaf4ff!important;}
body[data-it-theme] .sidebar-nav .nav-btn{
  background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.035))!important;
  color:#eaf4ff!important;
  border:1px solid rgba(191,219,254,.17)!important;
  border-radius:18px!important;
  min-height:66px!important;
}
body[data-it-theme] .sidebar-nav .nav-btn *{color:inherit!important;}
body[data-it-theme] .sidebar-nav .nav-btn.active,
body[data-it-theme] .sidebar-nav .nav-btn:hover{
  background:linear-gradient(135deg,#1557e6,#0ea5e9)!important;
  color:#fff!important;
  border-color:transparent!important;
  box-shadow:0 14px 34px rgba(14,165,233,.26)!important;
  transform:translateY(-1px);
}
body[data-it-theme] .nav-btn-icon{background:rgba(255,255,255,.12)!important;border:1px solid rgba(255,255,255,.14)!important;color:#fff!important;}
/* controls */
body[data-it-theme] :where(.input-glass,input:not([type="checkbox"]):not([type="radio"]),textarea,select,.device-search-wrap,.ip-btn,.toolbar-btn,.network-card-copy,.networks-compact-copy,.network-quick-actions .action-btn,.it-top-choice-btn,.login-secondary,.password-toggle){
  background:var(--v147-card)!important;
  color:var(--v147-ink)!important;
  border:1px solid var(--v147-line)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.34), var(--v147-shadow-sm)!important;
  border-radius:14px!important;
}
body[data-it-theme] :where(.input-glass::placeholder,input::placeholder,textarea::placeholder){color:var(--v147-soft)!important;}
body[data-it-theme] :where(.btn-primary,.network-clean-primary,.network-card-open,.networks-compact-open,.login-submit,.it-top-choice-btn.active,.sidebar-floating-toggle,.toolbar-btn.active,.ip-btn.active){
  background:linear-gradient(135deg,#1557e6 0%, #0ea5e9 100%)!important;
  color:#fff!important;
  border-color:transparent!important;
  box-shadow:0 16px 34px rgba(21,87,230,.26)!important;
  border-radius:14px!important;
}
body[data-it-theme] :where(.btn-primary,.network-clean-primary,.network-card-open,.networks-compact-open,.toolbar-btn,.ip-btn,.it-top-choice-btn):hover{transform:translateY(-1px);}
/* Dashboard */
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 .card,
#view-dashboard .mini-kpi-grid .card,
#view-dashboard .branch-metric-card{
  border-top:5px solid var(--v147-blue)!important;
}
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 .card strong,
#view-dashboard .metric-value,
.branch-metric-card .v145-branch-value{font-size:clamp(25px,2.3vw,36px)!important;line-height:1.05!important;font-weight:1000!important;color:var(--v147-ink)!important;}
.branch-metric-card{padding:20px!important;min-width:300px!important;}
.branch-metric-card .v145-branch-head{gap:14px!important;align-items:flex-start!important;}
.branch-metric-card .v145-branch-name{font-size:17px!important;line-height:1.25!important;}
.branch-metric-card .v145-branch-id{font-size:11px!important;color:var(--v147-muted)!important;max-width:220px!important;}
.branch-metric-card .v145-branch-grid{gap:12px!important;}
.branch-metric-card .v145-branch-grid > div{background:var(--v147-card-3)!important;border:1px solid var(--v147-line-soft)!important;border-radius:15px!important;padding:10px 8px!important;}
.branch-metric-card .v145-branch-label{color:var(--v147-muted)!important;font-size:11px!important;font-weight:900!important;}
/* Networks */
.networks-compact-head,.network-command-card,.net-header-shell{border-top:5px solid var(--v147-blue)!important;}
.networks-compact-card,.network-command-card{padding:18px!important;}
.networks-compact-main{grid-template-columns:minmax(300px,1.7fr) minmax(150px,.85fr) minmax(88px,.45fr) minmax(88px,.45fr) minmax(88px,.45fr) minmax(170px,.72fr)!important;gap:14px!important;align-items:center!important;}
.networks-compact-name,.network-name-block{min-width:0!important;overflow:hidden!important;}
.networks-compact-name > div,.network-name-block > div{min-width:0!important;overflow:hidden!important;}
.networks-compact-name h3,.networks-compact-name p,.network-name-block h3,.network-name-block p,.networks-compact-id strong,.networks-compact-sub span,.network-card-note,.network-detail-grid strong,.network-detail-grid span{max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;}
.networks-compact-id,.networks-compact-mini,.network-detail-grid > div,.network-metric{background:var(--v147-card-3)!important;border:1px solid var(--v147-line-soft)!important;border-radius:15px!important;padding:10px!important;}
.networks-compact-id strong,.network-detail-grid strong{color:var(--v147-blue)!important;}
.networks-compact-buttons,.network-card-actions{display:flex!important;gap:8px!important;flex-wrap:wrap!important;justify-content:flex-start!important;}
.networks-compact-copy,.networks-compact-open{min-width:92px!important;}
.networks-compact-card:hover,.network-command-card:hover,.device-card:hover,.card:hover{border-color:color-mix(in srgb,var(--v147-blue) 46%, var(--v147-line))!important;box-shadow:0 25px 58px color-mix(in srgb,var(--v147-blue) 14%, rgba(15,23,42,.14))!important;}
.network-detail-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important;}
/* Devices and internal pages */
.device-card,.device-row,.audit-row-card,.alert-row-card{border-inline-start:5px solid var(--v147-blue)!important;}
#view-backup :where(.card,.backup-restore-hint,.table-shell),
#view-settings :where(.sa-section-shell,.card),
#view-logs :where(.card,.operations-log-shell,.audit-row-card),
#view-devices :where(.device-card,.device-row){min-width:0!important;overflow:hidden!important;}
.zt-table thead th{background:var(--v147-card-3)!important;color:var(--v147-ink)!important;border-bottom:1px solid var(--v147-line)!important;font-weight:1000!important;}
.zt-table td{border-bottom:1px solid var(--v147-line-soft)!important;}
.zt-table tbody tr:hover{background:color-mix(in srgb,var(--v147-blue) 7%, transparent)!important;}
body[data-it-theme] :where(.badge,.role-badge,.analytics-chip,.brand-chip,.section-chip,.network-tier-badge,.path-direct,.path-online,.path-offline,.path-pending){border-radius:999px!important;font-weight:900!important;border:1px solid var(--v147-line-soft)!important;}
/* page-specific title strips */
#view-dashboard .dashboard-toolbar,
#view-networks .networks-compact-head,
#view-backup .backup-toolbar,
#view-settings .settings-toolbar,
#view-logs .logs-toolbar{min-width:0!important;}
/* footer */
body[data-it-theme] .app-footer,body[data-it-theme] .app-footer-inner{background:transparent!important;color:var(--v147-muted)!important;border-color:var(--v147-line-soft)!important;box-shadow:none!important;}
/* keep old review strips subtle, not dominant */
body[data-it-ui-density="delivery"] :where(.dashboard-status-strip-v129,.settings-delivery-strip-v129,.delivery-page-strip-v130,.delivery-net-tab-strip-v130){opacity:.78!important;box-shadow:var(--v147-shadow-sm)!important;}
@media(max-width:1200px){.networks-compact-main{grid-template-columns:1fr 1fr 1fr!important}.networks-compact-name,.networks-compact-id,.networks-compact-buttons{grid-column:1/-1!important}.branch-metric-card{min-width:0!important}}
@media(max-width:760px){body .app-shell{gap:16px!important}body[data-it-theme] :where(.card,.compact-card,.device-card,.network-list-card,.network-command-card,.networks-compact-card,.section-shell,.sa-section-shell,.table-shell,.chart-shell,.branch-metric-card){border-radius:18px!important}.network-detail-grid{grid-template-columns:1fr!important}.branch-metric-card .v145-branch-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
/* V147_PAGE_BY_PAGE_PREMIUM_SKIN_NO_TEXT_CHANGE_END */


/* V148_DELIVERY_SPACE_LAYOUT_POLISH_NO_TEXT_CHANGE_START
   Delivery layout polish: stronger spacing, better screen utilization, no text/template copy changes. */
:root,
body[data-it-theme],
html[data-it-theme]{
  --v148-gap-xs:8px;
  --v148-gap-sm:12px;
  --v148-gap:18px;
  --v148-gap-lg:24px;
  --v148-radius:20px;
  --v148-radius-lg:26px;
  --v148-sidebar:304px;
  --v148-content-max:1920px;
}
html:not(.dark),
html[data-it-theme="light"],
body[data-it-theme="light"]{
  --v148-bg:#e7eef7;
  --v148-surface:#ffffff;
  --v148-surface-2:#f6f9fc;
  --v148-surface-3:#edf3f9;
  --v148-text:#0b1220;
  --v148-muted:#475569;
  --v148-line:#9fb0c6;
  --v148-line-soft:#c2cfdd;
  --v148-primary:#1557e6;
  --v148-primary-2:#0ea5e9;
  --v148-shadow:0 16px 34px rgba(15,23,42,.13);
  --v148-shadow-sm:0 8px 18px rgba(15,23,42,.10);
}
html.dark,
html[data-it-theme="dark"],
body[data-it-theme="dark"]{
  --v148-bg:#07101d;
  --v148-surface:#0b1627;
  --v148-surface-2:#101f36;
  --v148-surface-3:#132943;
  --v148-text:#f8fafc;
  --v148-muted:#c2cedd;
  --v148-line:#284b72;
  --v148-line-soft:rgba(96,165,250,.24);
  --v148-primary:#60a5fa;
  --v148-primary-2:#22d3ee;
  --v148-shadow:0 20px 44px rgba(0,0,0,.36);
  --v148-shadow-sm:0 10px 24px rgba(0,0,0,.28);
}
body[data-it-layout="v148-delivery"]{
  background:
    radial-gradient(circle at 6% 0%, color-mix(in srgb,var(--v148-primary) 16%, transparent), transparent 25%),
    radial-gradient(circle at 92% 4%, color-mix(in srgb,var(--v148-primary-2) 12%, transparent), transparent 24%),
    linear-gradient(180deg, color-mix(in srgb,var(--v148-surface-2) 72%, var(--v148-bg)) 0%, var(--v148-bg) 100%)!important;
  color:var(--v148-text)!important;
}
/* app canvas / spacing */
#appView.app-shell:not(.hidden){
  width:100%!important;
  max-width:var(--v148-content-max)!important;
  margin-inline:auto!important;
  padding:clamp(12px,1.35vw,24px)!important;
  display:grid!important;
  grid-template-columns:var(--v148-sidebar) minmax(0,1fr)!important;
  gap:var(--v148-gap-lg)!important;
  align-items:start!important;
}
#appView.app-shell > :not(header){
  grid-column:2!important;
  min-width:0!important;
  width:100%!important;
}
#appView.app-shell.sidebar-collapsed,
#appView.app-shell[data-sidebar-collapsed="1"]{
  grid-template-columns:86px minmax(0,1fr)!important;
}
#view-dashboard,
#view-networks,
#view-net-details,
#view-backup,
#view-superadmin,
#view-ai{
  width:100%!important;
  min-width:0!important;
  display:grid;
  gap:var(--v148-gap)!important;
}
#view-dashboard.hidden,
#view-networks.hidden,
#view-net-details.hidden,
#view-backup.hidden,
#view-superadmin.hidden,
#view-ai.hidden{display:none!important;}

body[data-it-top-active-view="dashboard"] #view-networks,
body[data-it-top-active-view="dashboard"] #view-net-details,
body[data-it-top-active-view="dashboard"] #view-backup,
body[data-it-top-active-view="dashboard"] #view-superadmin,
body[data-it-top-active-view="dashboard"] #view-ai,
body[data-it-top-active-view="dashboard"] #view-growth,
body[data-it-top-active-view="networks"] #view-dashboard,
body[data-it-top-active-view="networks"] #view-net-details,
body[data-it-top-active-view="networks"] #view-backup,
body[data-it-top-active-view="networks"] #view-superadmin,
body[data-it-top-active-view="networks"] #view-ai,
body[data-it-top-active-view="networks"] #view-growth,
body[data-it-top-active-view="backup"] #view-dashboard,
body[data-it-top-active-view="backup"] #view-networks,
body[data-it-top-active-view="backup"] #view-net-details,
body[data-it-top-active-view="backup"] #view-superadmin,
body[data-it-top-active-view="backup"] #view-ai,
body[data-it-top-active-view="backup"] #view-growth,
body[data-it-top-active-view="superadmin"] #view-dashboard,
body[data-it-top-active-view="superadmin"] #view-networks,
body[data-it-top-active-view="superadmin"] #view-net-details,
body[data-it-top-active-view="superadmin"] #view-backup,
body[data-it-top-active-view="superadmin"] #view-ai,
body[data-it-top-active-view="superadmin"] #view-growth,
body[data-it-top-active-view="ai"] #view-dashboard,
body[data-it-top-active-view="ai"] #view-networks,
body[data-it-top-active-view="ai"] #view-net-details,
body[data-it-top-active-view="ai"] #view-backup,
body[data-it-top-active-view="ai"] #view-superadmin,
body[data-it-top-active-view="ai"] #view-growth,
body[data-it-top-active-view="growth"] #view-dashboard,
body[data-it-top-active-view="growth"] #view-networks,
body[data-it-top-active-view="growth"] #view-net-details,
body[data-it-top-active-view="growth"] #view-backup,
body[data-it-top-active-view="growth"] #view-superadmin,
body[data-it-top-active-view="growth"] #view-ai{display:none!important;}
body[data-it-top-active-view="dashboard"] #view-dashboard:not(.hidden),
body[data-it-top-active-view="networks"] #view-networks:not(.hidden),
body[data-it-top-active-view="backup"] #view-backup:not(.hidden),
body[data-it-top-active-view="superadmin"] #view-superadmin:not(.hidden),
body[data-it-top-active-view="ai"] #view-ai:not(.hidden),
body[data-it-top-active-view="growth"] #view-growth:not(.hidden){display:block!important;visibility:visible!important;}
body[data-it-layout="v148-delivery"] :where(.card,.compact-card,.device-card,.device-row,.network-command-card,.networks-compact-card,.networks-compact-head,.network-clean-header,.network-kpi-card,.section-shell,.sa-section-shell,.table-shell,.chart-shell,.branch-metric-card,.alert-row-card,.audit-row-card,.backup-card-pro,.backup-library-card,.modal-card,.modal-content,.network-quick-item,.network-quick-qr){
  background:linear-gradient(180deg,var(--v148-surface) 0%, var(--v148-surface-2) 100%)!important;
  border:1px solid var(--v148-line-soft)!important;
  box-shadow:var(--v148-shadow)!important;
  color:var(--v148-text)!important;
  border-radius:var(--v148-radius)!important;
  min-width:0!important;
}
body[data-it-layout="v148-delivery"] :where(.card,.compact-card,.section-shell,.sa-section-shell,.table-shell,.chart-shell,.backup-card-pro,.backup-library-card){
  padding:clamp(16px,1.35vw,24px)!important;
}
body[data-it-layout="v148-delivery"] :where(h1,h2,h3,h4,.panel-title,.compact-title,.settings-title,.sa-title,.device-name,.metric-value,strong,.font-black){
  color:var(--v148-text)!important;
  opacity:1!important;
  letter-spacing:-.01em;
}
body[data-it-layout="v148-delivery"] :where(.panel-meta,.settings-panel-note,.device-toolbar-meta,.network-card-note,.network-detail-grid span,.network-metric span,.field-caption,.help-note,.muted-help,.form-help,small){
  color:var(--v148-muted)!important;
  opacity:1!important;
}
/* sidebar: cleaner, fixed rhythm */
#appView.app-shell .app-sidebar{
  position:sticky!important;
  top:clamp(12px,1.2vw,20px)!important;
  min-height:calc(100vh - 40px)!important;
  max-height:calc(100vh - 32px)!important;
  overflow:auto!important;
  padding:18px!important;
  border-radius:26px!important;
}
#appView.app-shell .sidebar-nav{display:grid!important; gap:10px!important;}
#appView.app-shell .sidebar-nav .nav-btn{
  min-height:62px!important;
  padding:10px 12px!important;
  display:grid!important;
  grid-template-columns:44px minmax(0,1fr)!important;
  align-items:center!important;
  gap:10px!important;
}
#appView.app-shell .nav-btn-copy{min-width:0!important; overflow:hidden!important; text-overflow:ellipsis!important; white-space:nowrap!important;}
#appView.app-shell .nav-btn-icon{width:42px!important;height:42px!important;display:grid!important;place-items:center!important;}
#appView.app-shell .sidebar-brand-card,
#appView.app-shell .sidebar-user-card,
#appView.app-shell .sidebar-status-card,
#appView.app-shell .sidebar-mini-tile,
#appView.app-shell .it-top-appearance-panel{padding:12px!important;}
/* toolbars */
#view-dashboard .dashboard-toolbar,
#view-networks .networks-toolbar,
#view-net-details .net-header-shell{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:var(--v148-gap)!important;
  min-height:76px!important;
}
.dashboard-toolbar-actions,
.networks-toolbar-actions,
.device-toolbar-actions,
.network-card-actions,
.backup-action-row{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  flex-wrap:wrap!important;
}
body[data-it-layout="v148-delivery"] :where(.btn-primary,.toolbar-btn,.action-btn,.network-card-open,.network-card-copy,.networks-compact-open,.networks-compact-copy,.backup-secondary-btn,.row-btn){
  min-height:40px!important;
  padding:9px 14px!important;
  border-radius:13px!important;
  font-weight:900!important;
  white-space:nowrap!important;
}
body[data-it-layout="v148-delivery"] :where(.input-glass,input:not([type="checkbox"]):not([type="radio"]),textarea,select,.device-search-wrap){
  min-height:44px!important;
  border-radius:14px!important;
}
/* dashboard: use space intelligently */
#view-dashboard{grid-template-columns:minmax(0,1fr)!important;}
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(150px,1fr))!important;
  gap:var(--v148-gap)!important;
}
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 > .card{
  min-height:118px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  padding:18px!important;
}
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 > .card h3{font-size:12px!important;margin:0!important;}
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 > .card p{font-size:36px!important;line-height:1!important;margin-top:10px!important;}
#view-dashboard .mini-kpi-grid{
  display:grid!important;
  grid-template-columns:minmax(380px,1.22fr) minmax(280px,.9fr) minmax(280px,.9fr)!important;
  gap:var(--v148-gap)!important;
  align-items:stretch!important;
}
#view-dashboard .mini-kpi-grid > .card{min-height:284px!important;}
#view-dashboard .ai-grid-compact{display:grid!important;grid-template-columns:150px minmax(0,1fr)!important;gap:16px!important;align-items:center!important;}
#view-dashboard .ai-terminal-box{min-height:190px!important;}
#view-dashboard .dashboard-analytics-grid{
  display:grid!important;
  grid-template-columns:minmax(0,2fr) minmax(340px,.9fr)!important;
  gap:var(--v148-gap)!important;
}
#view-dashboard .dashboard-analytics-grid .chart-shell{height:360px!important;}
#view-dashboard > .grid.grid-cols-1.lg\:grid-cols-2.gap-6{
  display:grid!important;
  grid-template-columns:minmax(0,1.25fr) minmax(360px,.75fr)!important;
  gap:var(--v148-gap)!important;
}
#branchMetricsArea{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))!important;gap:14px!important;}
#globalAlertsArea,#auditLogArea{max-height:310px!important;overflow:auto!important;padding-inline-end:2px;}
.branch-metric-card{padding:16px!important;}
.branch-metric-card .v145-branch-head{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:12px!important;align-items:start!important;margin-bottom:12px!important;}
.branch-metric-card .v145-branch-name{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
.branch-metric-card .v145-branch-id{max-width:150px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
.branch-metric-card .v145-branch-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:10px!important;}
.branch-metric-card .v145-branch-grid > div{padding:10px 8px!important;border-radius:14px!important;background:var(--v148-surface-3)!important;border:1px solid var(--v148-line-soft)!important;}
.ping-card .ping-layout{display:grid!important;grid-template-columns:minmax(280px,420px) minmax(0,1fr)!important;gap:12px!important;align-items:stretch!important;}
.ping-card .ping-input-row{display:flex!important;gap:10px!important;align-items:center!important;}
#pingResult{min-height:44px!important;}
/* networks list: clear columns and balanced cards */
#view-networks .networks-toolbar-actions{flex:1 1 auto!important;justify-content:flex-end!important;}
#view-networks .networks-search-wrap{flex:1 1 420px!important;max-width:620px!important;min-width:260px!important;}
#networksCardsArea{display:grid!important;grid-template-columns:1fr!important;gap:14px!important;}
.networks-compact-card,
.network-command-card{padding:18px!important;}
.networks-compact-main{
  display:grid!important;
  grid-template-columns:minmax(300px,1.6fr) minmax(135px,.75fr) 92px 92px 92px minmax(180px,auto)!important;
  gap:12px!important;
}
.networks-compact-name,
.network-name-block{min-width:0!important;}
.networks-compact-name h3,
.networks-compact-name p,
.network-name-block h3,
.network-name-block p,
.networks-compact-id strong,
.network-detail-grid strong{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
.networks-compact-id,.networks-compact-mini,.network-metric,.network-detail-grid > div{padding:10px 12px!important;}
.networks-compact-buttons{display:flex!important;justify-content:flex-start!important;gap:8px!important;flex-wrap:wrap!important;}
.networks-compact-sub{display:flex!important;gap:12px!important;flex-wrap:wrap!important;align-items:center!important;justify-content:flex-start!important;direction:ltr!important;}
.network-command-card{display:grid!important;gap:14px!important;}
.network-card-metrics{display:grid!important;grid-template-columns:120px repeat(3,minmax(84px,1fr))!important;gap:10px!important;}
.network-detail-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:10px!important;}
.network-card-footer{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;flex-wrap:wrap!important;}
/* network details / devices */
#view-net-details .net-header-shell{margin-bottom:var(--v148-gap)!important;}
#view-net-details .net-header-main{display:flex!important;align-items:center!important;gap:14px!important;min-width:0!important;}
#view-net-details .net-header-copy-block{min-width:0!important;}
#view-net-details .net-header-title-row{display:flex!important;align-items:center!important;gap:10px!important;flex-wrap:wrap!important;}
#view-net-details .net-header-pills{display:flex!important;gap:8px!important;flex-wrap:wrap!important;}
#view-net-details [data-net-tab]{min-height:42px!important;padding:10px 15px!important;}
#net-tab-devices .device-toolbar{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;}
#net-tab-devices .device-search-wrap{flex:1 1 420px!important;max-width:680px!important;}
#net-tab-devices .device-toolbar-actions{justify-content:flex-end!important;}
.device-card,.device-row{padding:16px!important;}
.device-card .grid,.device-row{gap:12px!important;}
.row-actions{display:flex!important;gap:8px!important;flex-wrap:wrap!important;}
/* routes/settings */
#net-tab-routes .card,
#net-tab-settings .card{padding:18px!important;}
#net-tab-settings .grid{gap:var(--v148-gap)!important;}
.settings-panel-head{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:12px!important;}
/* backup: give every block its room */
#view-backup{gap:var(--v148-gap-lg)!important;}
#view-backup > .grid{gap:var(--v148-gap)!important;}
.backup-card-pro{padding:22px!important;}
.backup-card-head,.backup-library-head{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:14px!important;}
.backup-option-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(170px,1fr))!important;gap:10px!important;}
.backup-action-row > *{min-width:140px!important;}
.backup-library-card .table-shell{overflow:auto!important;}
/* server settings / logs */
#view-superadmin #saContent{max-width:1520px!important;width:100%!important;}
#view-superadmin .lux-stat-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))!important;gap:var(--v148-gap)!important;}
#view-superadmin .sa-section-shell{padding:22px!important;}
#view-ai > .grid{display:grid!important;grid-template-columns:minmax(0,2fr) minmax(320px,.8fr)!important;gap:var(--v148-gap)!important;}
#view-ai .ai-terminal-shell{min-height:560px!important;}
/* tables: professional rhythm */
.table-shell{overflow:auto!important;}
.zt-table{min-width:720px!important;border-collapse:separate!important;border-spacing:0!important;}
.zt-table th{padding:13px 14px!important;position:sticky;top:0;z-index:2;background:var(--v148-surface-3)!important;}
.zt-table td{padding:13px 14px!important;vertical-align:middle!important;}
.zt-table tbody tr:hover{background:color-mix(in srgb,var(--v148-primary) 7%, transparent)!important;}
/* responsive */
@media(max-width:1420px){
  #appView.app-shell:not(.hidden){grid-template-columns:286px minmax(0,1fr)!important;gap:18px!important;}
  #view-dashboard .mini-kpi-grid{grid-template-columns:1fr 1fr!important;}
  #view-dashboard .mini-kpi-grid > .ai-card-compact{grid-column:1/-1!important;}
  .networks-compact-main{grid-template-columns:minmax(260px,1.5fr) minmax(125px,.7fr) repeat(3,82px) minmax(160px,auto)!important;}
}
@media(max-width:1180px){
  #view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4{grid-template-columns:repeat(3,minmax(150px,1fr))!important;}
  #view-dashboard .dashboard-analytics-grid,
  #view-dashboard > .grid.grid-cols-1.lg\:grid-cols-2.gap-6,
  #view-ai > .grid{grid-template-columns:1fr!important;}
  .network-card-metrics{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .network-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .networks-compact-main{grid-template-columns:minmax(0,1fr) repeat(3,90px)!important;}
  .networks-compact-id,.networks-compact-buttons{grid-column:1/-1!important;}
}
@media(max-width:980px){
  #appView.app-shell:not(.hidden){grid-template-columns:1fr!important;padding:12px!important;}
  #appView.app-shell > :not(header){grid-column:1!important;}
  #appView.app-shell .app-sidebar{position:relative!important;top:auto!important;max-height:none!important;min-height:0!important;}
  #view-dashboard .mini-kpi-grid,
  .ping-card .ping-layout{grid-template-columns:1fr!important;}
  #view-networks .networks-toolbar,
  #view-dashboard .dashboard-toolbar,
  #view-net-details .net-header-shell{align-items:stretch!important;flex-direction:column!important;}
  .networks-toolbar-actions,.dashboard-toolbar-actions,.device-toolbar-actions{justify-content:stretch!important;width:100%!important;}
  .dashboard-toolbar-actions > *, .networks-toolbar-actions > *, .device-toolbar-actions > *{flex:1 1 auto!important;}
}
@media(max-width:720px){
  #view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  #view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 > .card p{font-size:30px!important;}
  .branch-metric-card .v145-branch-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .networks-compact-main{grid-template-columns:1fr!important;}
  .network-card-metrics,.network-detail-grid{grid-template-columns:1fr!important;}
  .zt-table{min-width:640px!important;}
}
/* V148_DELIVERY_SPACE_LAYOUT_POLISH_NO_TEXT_CHANGE_END */


/* V149_PROFESSIONAL_COLLAPSED_SIDEBAR_START */
:root{
  --v149-mini-sidebar:92px;
  --v149-mini-radius:24px;
  --v149-mini-item:58px;
}
/* Keep the sidebar visible when collapsed: mini rail, not hidden */
#appView.app-shell.sidebar-collapsed,
#appView.app-shell[data-sidebar-collapsed="1"]{
  grid-template-columns:var(--v149-mini-sidebar) minmax(0,1fr)!important;
  max-width:var(--v148-content-max,1920px)!important;
}
#appView.app-shell.sidebar-collapsed > :not(header),
#appView.app-shell[data-sidebar-collapsed="1"] > :not(header){
  grid-column:2!important;
}
#appView.app-shell.sidebar-collapsed .app-sidebar,
#appView.app-shell[data-sidebar-collapsed="1"] .app-sidebar,
#appView.app-shell .app-sidebar.is-sidebar-mini{
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  width:var(--v149-mini-sidebar)!important;
  min-width:var(--v149-mini-sidebar)!important;
  max-width:var(--v149-mini-sidebar)!important;
  padding:12px 10px!important;
  align-items:center!important;
  gap:12px!important;
  overflow:visible!important;
  border-radius:var(--v149-mini-radius)!important;
}
#appView.app-shell.sidebar-collapsed .app-sidebar[hidden],
#appView.app-shell[data-sidebar-collapsed="1"] .app-sidebar[hidden]{
  display:flex!important;
}
/* hide noisy cards only in mini state; they return when expanded */
#appView.app-shell.sidebar-collapsed .app-sidebar :where(.sidebar-user-card,.sidebar-status-card,.sidebar-mini-grid,.it-top-appearance-panel,.sidebar-blurb,.sidebar-tagline,.brand-chip),
#appView.app-shell[data-sidebar-collapsed="1"] .app-sidebar :where(.sidebar-user-card,.sidebar-status-card,.sidebar-mini-grid,.it-top-appearance-panel,.sidebar-blurb,.sidebar-tagline,.brand-chip){
  display:none!important;
}
#appView.app-shell.sidebar-collapsed .sidebar-brand-card,
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-brand-card{
  width:64px!important;
  min-height:64px!important;
  padding:8px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:20px!important;
  overflow:hidden!important;
}
#appView.app-shell.sidebar-collapsed .sidebar-brand-card :where(.sidebar-brand-copy,.sidebar-kicker,.sidebar-brand-title,.sidebar-brand-subtitle,.sidebar-brand-meta,.sidebar-brand-text),
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-brand-card :where(.sidebar-brand-copy,.sidebar-kicker,.sidebar-brand-title,.sidebar-brand-subtitle,.sidebar-brand-meta,.sidebar-brand-text){
  display:none!important;
}
#appView.app-shell.sidebar-collapsed .sidebar-brand-card :where(img,.brand-mark,.brand-mark-img,.sidebar-logo,.login-side-logo),
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-brand-card :where(img,.brand-mark,.brand-mark-img,.sidebar-logo,.login-side-logo){
  width:46px!important;
  height:46px!important;
  max-width:46px!important;
  max-height:46px!important;
  object-fit:contain!important;
  border-radius:16px!important;
}
#appView.app-shell.sidebar-collapsed .sidebar-nav-wrap,
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav-wrap{
  width:100%!important;
}
#appView.app-shell.sidebar-collapsed .sidebar-nav,
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav{
  width:100%!important;
  display:flex!important;
  flex-direction:column!important;
  gap:10px!important;
  align-items:center!important;
}
#appView.app-shell.sidebar-collapsed .sidebar-nav .nav-btn,
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn{
  position:relative!important;
  width:var(--v149-mini-item)!important;
  height:var(--v149-mini-item)!important;
  min-width:var(--v149-mini-item)!important;
  min-height:var(--v149-mini-item)!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  grid-template-columns:1fr!important;
  gap:0!important;
  border-radius:18px!important;
  overflow:visible!important;
  isolation:isolate;
}
#appView.app-shell.sidebar-collapsed .sidebar-nav .nav-btn .nav-btn-copy,
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn .nav-btn-copy{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  clip:rect(0 0 0 0)!important;
  white-space:nowrap!important;
}
#appView.app-shell.sidebar-collapsed .sidebar-nav .nav-btn .nav-btn-icon,
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn .nav-btn-icon{
  width:44px!important;
  height:44px!important;
  border-radius:16px!important;
  font-size:20px!important;
  margin:0!important;
  z-index:1;
}
#appView.app-shell.sidebar-collapsed .sidebar-nav .nav-btn.active::before,
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn.active::before{
  content:"";
  position:absolute;
  inset-inline-start:-10px;
  top:14px;
  width:4px;
  height:30px;
  border-radius:999px;
  background:linear-gradient(180deg,#60a5fa,#22d3ee);
  box-shadow:0 0 16px rgba(96,165,250,.55);
}
/* polished mini tooltip */
#appView.app-shell.sidebar-collapsed .sidebar-nav .nav-btn[data-mini-title]::after,
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn[data-mini-title]::after{
  content:attr(data-mini-title);
  position:absolute;
  inset-inline-start:calc(100% + 14px);
  top:50%;
  transform:translateY(-50%) translateX(6px);
  min-width:132px;
  max-width:220px;
  padding:9px 12px;
  border-radius:14px;
  background:rgba(15,23,42,.96);
  color:#fff;
  border:1px solid rgba(96,165,250,.24);
  box-shadow:0 16px 34px rgba(2,6,23,.35);
  font-size:12px;
  font-weight:900;
  text-align:right;
  opacity:0;
  pointer-events:none;
  transition:opacity .14s ease, transform .14s ease;
  z-index:1000;
}
#appView.app-shell.sidebar-collapsed .sidebar-nav .nav-btn[data-mini-title]::before,
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn[data-mini-title]::before{
  z-index:2;
}
#appView.app-shell.sidebar-collapsed .sidebar-nav .nav-btn[data-mini-title]:hover::after,
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn[data-mini-title]:hover::after,
#appView.app-shell.sidebar-collapsed .sidebar-nav .nav-btn[data-mini-title]:focus-visible::after,
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn[data-mini-title]:focus-visible::after{
  opacity:1;
  transform:translateY(-50%) translateX(0);
}
/* the toggle becomes the first premium mini control */
#appView.app-shell.sidebar-collapsed #sidebarToggleBtn,
#appView.app-shell[data-sidebar-collapsed="1"] #sidebarToggleBtn{
  width:58px!important;
  min-width:58px!important;
  height:58px!important;
  min-height:58px!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  border-radius:20px!important;
  margin:0 auto 2px!important;
  background:linear-gradient(135deg,#2563eb,#60a5fa)!important;
  color:#fff!important;
  border:0!important;
  box-shadow:0 12px 28px rgba(37,99,235,.24)!important;
}
#appView.app-shell.sidebar-collapsed #sidebarToggleBtn [data-sidebar-toggle-label],
#appView.app-shell[data-sidebar-collapsed="1"] #sidebarToggleBtn [data-sidebar-toggle-label]{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  clip:rect(0 0 0 0)!important;
}
#appView.app-shell.sidebar-collapsed #sidebarToggleBtn [data-sidebar-toggle-icon],
#appView.app-shell[data-sidebar-collapsed="1"] #sidebarToggleBtn [data-sidebar-toggle-icon]{
  width:38px!important;
  height:38px!important;
  display:grid!important;
  place-items:center!important;
  font-size:24px!important;
  line-height:1!important;
}
/* no floating button needed when the mini rail exists */
body.sidebar-collapsed .sidebar-floating-toggle,
.sidebar-floating-toggle{
  display:none!important;
}
body[data-it-theme="light"] #appView.app-shell.sidebar-collapsed .app-sidebar,
body[data-it-theme="light"] #appView.app-shell[data-sidebar-collapsed="1"] .app-sidebar{
  background:linear-gradient(180deg,#0f172a,#182438)!important;
  border:1px solid rgba(96,165,250,.24)!important;
  box-shadow:0 24px 54px rgba(15,23,42,.22)!important;
}
body[data-it-theme="light"] #appView.app-shell.sidebar-collapsed .sidebar-nav .nav-btn,
body[data-it-theme="light"] #appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn{
  background:rgba(255,255,255,.08)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  color:#eaf4ff!important;
}
body[data-it-theme="light"] #appView.app-shell.sidebar-collapsed .sidebar-nav .nav-btn.active,
body[data-it-theme="light"] #appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn.active,
body[data-it-theme="light"] #appView.app-shell.sidebar-collapsed .sidebar-nav .nav-btn:hover,
body[data-it-theme="light"] #appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn:hover{
  background:linear-gradient(135deg,#2563eb,#60a5fa)!important;
  color:#fff!important;
  border-color:rgba(255,255,255,.18)!important;
}
@media(max-width:980px){
  #appView.app-shell.sidebar-collapsed,
  #appView.app-shell[data-sidebar-collapsed="1"]{grid-template-columns:1fr!important;}
  #appView.app-shell.sidebar-collapsed > :not(header),
  #appView.app-shell[data-sidebar-collapsed="1"] > :not(header){grid-column:1 / -1!important;}
  #appView.app-shell.sidebar-collapsed .app-sidebar,
  #appView.app-shell[data-sidebar-collapsed="1"] .app-sidebar{display:none!important;}
  body.sidebar-collapsed .sidebar-floating-toggle{display:grid!important;}
}
/* V149_PROFESSIONAL_COLLAPSED_SIDEBAR_END */


/* V150_DEVICE_ROW_INVITE_BUTTON_POLISH_START */
/* Devices table: give every element its space, stop clipping, and organize actions professionally. */
.active-devices-section{
  overflow:visible!important;
}
.active-devices-head{
  padding-bottom:14px!important;
  margin-bottom:12px!important;
  border-bottom:1px solid rgba(148,163,184,.14)!important;
}
.device-virtual-viewport,
.device-virtual-spacer{
  overflow:visible!important;
}
.device-row.device-row-pro{
  grid-template-columns:minmax(320px,1.2fr) minmax(290px,.92fr) minmax(285px,.95fr) minmax(330px,.9fr)!important;
  gap:18px!important;
  align-items:stretch!important;
  min-height:218px!important;
  padding:20px!important;
  border-radius:26px!important;
  overflow:hidden!important;
}
.device-row-cell{display:flex!important;min-width:0!important;}
.device-row-cell.cell-identity,
.device-row-cell.cell-network,
.device-row-cell.cell-status,
.device-row-cell.cell-actions{align-items:stretch!important;}
.device-main,
.device-metric-list,
.device-status-card,
.row-actions.polished{width:100%!important;}
.device-main{align-items:center!important;}
.device-main-text{min-width:0!important;flex:1 1 auto!important;}
.device-title-row{justify-content:flex-start!important;gap:8px!important;flex-wrap:wrap!important;}
.device-name{flex:1 1 160px!important;max-width:100%!important;line-height:1.35!important;}
.device-subtitle{white-space:normal!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;min-height:38px;}
.device-subline{gap:8px!important;}
.device-metric-list.refined,
.device-status-card.refined{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  min-height:100%!important;
  padding:16px!important;
}
.device-metric-line.metric-primary{margin-bottom:14px!important;}
.managed-pill{min-height:46px!important;justify-content:space-between!important;gap:10px!important;}
.managed-pill .mono{font-size:15px!important;letter-spacing:.03em!important;}
.latency-pill{min-width:58px!important;}
.device-metric-grid.compact{gap:10px!important;}
.metric-chip{min-height:70px!important;display:flex!important;flex-direction:column!important;justify-content:center!important;}
.metric-chip .metric-value{font-size:13px!important;line-height:1.45!important;}
.device-status-top.refined{margin-bottom:14px!important;}
.status-summary{font-size:13px!important;line-height:1.55!important;}
.time-stack.compact.refined{gap:8px!important;}
.time-stack.compact.refined span{min-height:40px!important;padding:9px 11px!important;}
.time-stack.compact.refined em{max-width:150px!important;text-align:left!important;direction:ltr!important;}
.cell-actions{align-items:center!important;}
.row-actions.polished{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(126px,1fr))!important;
  gap:10px!important;
  justify-content:stretch!important;
  align-content:center!important;
  max-height:none!important;
  overflow:visible!important;
}
.row-actions.polished .row-btn{
  width:100%!important;
  min-width:0!important;
  min-height:44px!important;
  padding:10px 12px!important;
  border-radius:14px!important;
  text-align:center!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  line-height:1.2!important;
  white-space:nowrap!important;
}
.row-actions.polished .row-btn.ping-icon{min-width:0!important;font-size:16px!important;}
.row-actions.polished .row-btn.danger.ghost{border-width:1px!important;}
body[data-it-theme="dark"] .device-row.device-row-pro{
  background:linear-gradient(135deg,rgba(9,18,35,.98),rgba(7,26,46,.92))!important;
  border-color:rgba(77,124,186,.36)!important;
}
body[data-it-theme="light"] .device-row.device-row-pro{
  background:linear-gradient(135deg,#ffffff,#eef5fd)!important;
  border-color:rgba(89,111,140,.28)!important;
  box-shadow:0 18px 42px rgba(15,23,42,.13), inset 0 1px 0 rgba(255,255,255,.98)!important;
}
body[data-it-theme="light"] .device-metric-list.refined,
body[data-it-theme="light"] .device-status-card.refined,
body[data-it-theme="light"] .metric-chip,
body[data-it-theme="light"] .time-stack.compact.refined span,
body[data-it-theme="light"] .managed-pill{
  background:#f8fbff!important;
  color:#0f172a!important;
  border-color:rgba(89,111,140,.24)!important;
}
body[data-it-theme="light"] .device-name,
body[data-it-theme="light"] .status-summary,
body[data-it-theme="light"] .metric-value,
body[data-it-theme="light"] .time-stack em,
body[data-it-theme="light"] .managed-pill .mono{color:#0f172a!important;}
body[data-it-theme="light"] .device-subtitle,
body[data-it-theme="light"] .device-metric-label,
body[data-it-theme="light"] .time-stack strong,
body[data-it-theme="light"] .time-stack span{color:#53667f!important;}
/* Network invite actions: keep Copy Invite visible in header and quick summary. */
.net-header-actions,
.network-summary-actions{
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  gap:10px!important;
  flex-wrap:wrap!important;
  align-items:center!important;
}
.net-header-actions .action-btn,
.network-summary-actions .action-btn{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:42px!important;
  min-width:126px!important;
  border-radius:14px!important;
  font-weight:900!important;
}
.invite-copy-btn,
.net-header-actions .action-btn:first-child{
  background:linear-gradient(135deg,rgba(139,92,246,.20),rgba(99,102,241,.16))!important;
  color:#ede9fe!important;
  border:1px solid rgba(167,139,250,.34)!important;
}
body[data-it-theme="light"] .invite-copy-btn,
body[data-it-theme="light"] .net-header-actions .action-btn:first-child{
  background:linear-gradient(135deg,#6d5dfc,#8b5cf6)!important;
  color:#ffffff!important;
  border-color:transparent!important;
  box-shadow:0 10px 22px rgba(109,93,252,.18)!important;
}
@media(max-width:1360px){
  .device-row.device-row-pro{grid-template-columns:minmax(300px,1fr) minmax(280px,.9fr) minmax(270px,.9fr)!important;min-height:300px!important;}
  .device-row-cell.cell-actions{grid-column:1/-1!important;}
  .row-actions.polished{grid-template-columns:repeat(4,minmax(110px,1fr))!important;}
}
@media(max-width:980px){
  .device-row.device-row-pro{grid-template-columns:1fr!important;min-height:450px!important;padding:16px!important;}
  .device-row-cell.cell-actions{grid-column:auto!important;}
  .row-actions.polished{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .time-stack.compact.refined em{max-width:none!important;}
  .net-header-actions .action-btn,.network-summary-actions .action-btn{flex:1 1 calc(50% - 8px)!important;min-width:0!important;}
}
/* V150_DEVICE_ROW_INVITE_BUTTON_POLISH_END */


/* V151_DEVICE_ROW_COMPACT_PREMIUM_CONTRAST_START
   Scope: Devices screen only. No text or feature removal. Compact containment + stronger light contrast. */
#view-devices .active-devices-section{
  padding:18px!important;
  border-radius:24px!important;
  overflow:visible!important;
}
#view-devices .active-devices-head{
  padding:0 0 12px!important;
  margin:0 0 14px!important;
  min-height:auto!important;
}
#view-devices .device-row.device-row-pro{
  grid-template-columns:minmax(290px,1.1fr) minmax(250px,.84fr) minmax(255px,.84fr) minmax(360px,1fr)!important;
  gap:14px!important;
  align-items:stretch!important;
  min-height:188px!important;
  padding:16px!important;
  border-radius:22px!important;
  overflow:hidden!important;
}
#view-devices .device-row-cell{min-width:0!important;display:flex!important;align-items:stretch!important;}
#view-devices .device-main,
#view-devices .device-metric-list.refined,
#view-devices .device-status-card.refined,
#view-devices .row-actions.polished{width:100%!important;min-width:0!important;}
#view-devices .device-main{gap:12px!important;align-items:center!important;}
#view-devices .device-health-dot{flex:0 0 14px!important;width:14px!important;height:14px!important;}
#view-devices .device-main-text{min-width:0!important;}
#view-devices .device-title-row{gap:7px!important;align-items:center!important;flex-wrap:wrap!important;}
#view-devices .device-name{
  font-size:18px!important;
  line-height:1.25!important;
  min-width:0!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
#view-devices .device-subtitle{
  font-size:12px!important;
  line-height:1.55!important;
  margin-top:5px!important;
  min-height:0!important;
  display:-webkit-box!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
  overflow:hidden!important;
}
#view-devices .device-subline{gap:6px!important;margin-top:9px!important;flex-wrap:wrap!important;}
#view-devices .mini-tag,
#view-devices .path-pill,
#view-devices .device-status-label-v127{
  min-height:28px!important;
  padding:5px 10px!important;
  border-radius:999px!important;
  font-size:11px!important;
  line-height:1!important;
}
#view-devices .device-metric-list.refined,
#view-devices .device-status-card.refined{
  padding:13px!important;
  min-height:100%!important;
  justify-content:center!important;
  border-radius:18px!important;
}
#view-devices .device-metric-line.metric-primary{margin-bottom:10px!important;}
#view-devices .device-metric-label{font-size:11px!important;line-height:1.1!important;}
#view-devices .managed-pill{
  min-height:42px!important;
  padding:8px 10px!important;
  border-radius:16px!important;
  gap:8px!important;
}
#view-devices .managed-pill .mono{font-size:14px!important;letter-spacing:.02em!important;}
#view-devices .latency-pill{min-width:48px!important;min-height:28px!important;padding:5px 10px!important;}
#view-devices .device-metric-grid.compact{gap:8px!important;}
#view-devices .metric-chip{
  min-height:58px!important;
  padding:9px 10px!important;
  border-radius:16px!important;
}
#view-devices .metric-chip .metric-value{
  font-size:12px!important;
  line-height:1.35!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
#view-devices .device-status-top.refined{
  margin-bottom:10px!important;
  gap:8px!important;
  flex-wrap:wrap!important;
}
#view-devices .status-quality{min-height:28px!important;padding:5px 10px!important;font-size:11px!important;}
#view-devices .status-summary{
  font-size:13px!important;
  line-height:1.35!important;
  font-weight:900!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
#view-devices .time-stack.compact.refined{gap:7px!important;}
#view-devices .time-stack.compact.refined span{
  min-height:34px!important;
  padding:7px 9px!important;
  border-radius:14px!important;
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr)!important;
  gap:8px!important;
  align-items:center!important;
}
#view-devices .time-stack.compact.refined strong{font-size:11px!important;white-space:nowrap!important;}
#view-devices .time-stack.compact.refined em{
  max-width:100%!important;
  text-align:left!important;
  direction:ltr!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  font-size:11px!important;
}
#view-devices .cell-actions{align-items:center!important;}
#view-devices .row-actions.polished{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:7px!important;
  align-content:center!important;
  justify-content:stretch!important;
  max-height:none!important;
  overflow:visible!important;
}
#view-devices .row-actions.polished .row-btn{
  min-width:0!important;
  width:100%!important;
  min-height:34px!important;
  padding:7px 8px!important;
  border-radius:12px!important;
  font-size:11px!important;
  line-height:1.1!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  white-space:nowrap!important;
}
#view-devices .row-actions.polished .row-btn.ping-icon{
  font-size:14px!important;
  min-height:34px!important;
}
/* stronger contrast on light mode: remove the washed out feeling */
body[data-it-theme="light"] #view-devices .active-devices-section{
  background:linear-gradient(180deg,#f8fbff 0%,#eef5fd 100%)!important;
  border:1px solid rgba(83,107,139,.34)!important;
  box-shadow:0 18px 42px rgba(15,23,42,.16)!important;
}
body[data-it-theme="light"] #view-devices .device-row.device-row-pro{
  background:linear-gradient(135deg,#ffffff 0%,#edf6ff 100%)!important;
  border:1px solid rgba(69,97,132,.38)!important;
  box-shadow:0 16px 34px rgba(15,23,42,.14), inset 0 1px 0 rgba(255,255,255,1)!important;
}
body[data-it-theme="light"] #view-devices .device-row.device-row-pro::after{
  background:radial-gradient(circle at 96% 0%, rgba(37,99,235,.10), transparent 30%), radial-gradient(circle at 0% 100%, rgba(14,165,233,.08), transparent 24%)!important;
}
body[data-it-theme="light"] #view-devices .device-metric-list.refined,
body[data-it-theme="light"] #view-devices .device-status-card.refined,
body[data-it-theme="light"] #view-devices .metric-chip,
body[data-it-theme="light"] #view-devices .time-stack.compact.refined span,
body[data-it-theme="light"] #view-devices .managed-pill{
  background:#ffffff!important;
  border:1px solid rgba(83,107,139,.28)!important;
  color:#0f172a!important;
  box-shadow:0 8px 20px rgba(15,23,42,.055)!important;
}
body[data-it-theme="light"] #view-devices .device-name,
body[data-it-theme="light"] #view-devices .status-summary,
body[data-it-theme="light"] #view-devices .metric-value,
body[data-it-theme="light"] #view-devices .managed-pill .mono,
body[data-it-theme="light"] #view-devices .device-metric-label,
body[data-it-theme="light"] #view-devices .time-stack.compact.refined strong{
  color:#0f172a!important;
}
body[data-it-theme="light"] #view-devices .device-subtitle,
body[data-it-theme="light"] #view-devices .time-stack.compact.refined em{
  color:#334155!important;
}
body[data-it-theme="light"] #view-devices .row-actions.polished .row-btn.neutral{
  background:#334155!important;
  color:#ffffff!important;
  border:1px solid rgba(15,23,42,.10)!important;
}
body[data-it-theme="light"] #view-devices .row-actions.polished .row-btn.primary{
  background:linear-gradient(135deg,#6d28d9,#7c3aed)!important;
  color:#ffffff!important;
}
body[data-it-theme="light"] #view-devices .row-actions.polished .row-btn.danger{
  background:#fee2e2!important;
  color:#b91c1c!important;
  border:1px solid rgba(220,38,38,.22)!important;
}
body[data-it-theme="light"] #view-devices .row-actions.polished .row-btn.success{
  background:#dcfce7!important;
  color:#047857!important;
  border:1px solid rgba(4,120,87,.20)!important;
}
body[data-it-theme="light"] #view-devices .row-actions.polished .row-btn.ping-icon{
  background:linear-gradient(135deg,#e0f2fe,#cffafe)!important;
  color:#075985!important;
  border:1px solid rgba(14,116,144,.18)!important;
}
@media(max-width:1500px){
  #view-devices .device-row.device-row-pro{
    grid-template-columns:minmax(280px,1fr) minmax(230px,.82fr) minmax(240px,.82fr) minmax(320px,.96fr)!important;
  }
  #view-devices .row-actions.polished{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
}
@media(max-width:1260px){
  #view-devices .device-row.device-row-pro{grid-template-columns:minmax(260px,1fr) minmax(235px,.9fr) minmax(250px,.9fr)!important;min-height:236px!important;}
  #view-devices .device-row-cell.cell-actions{grid-column:1/-1!important;}
  #view-devices .row-actions.polished{grid-template-columns:repeat(4,minmax(0,1fr))!important;}
}
@media(max-width:760px){
  #view-devices .device-row.device-row-pro{grid-template-columns:1fr!important;min-height:420px!important;padding:14px!important;}
  #view-devices .row-actions.polished{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
/* V151_DEVICE_ROW_COMPACT_PREMIUM_CONTRAST_END */


/* V152_DEVICE_ROW_REAL_SELECTOR_FIX_START
   Fixes V151 scope mistake. The real devices container is #net-tab-devices, not #view-devices. */
:where(#net-tab-devices,#view-devices) .active-devices-section{
  padding:18px!important;
  border-radius:24px!important;
  overflow:visible!important;
}
:where(#net-tab-devices,#view-devices) .active-devices-head{
  padding:0 0 12px!important;
  margin:0 0 12px!important;
  min-height:auto!important;
  border-bottom:1px solid rgba(100,116,139,.18)!important;
}
:where(#net-tab-devices,#view-devices) .device-virtual-viewport,
:where(#net-tab-devices,#view-devices) .device-virtual-spacer{
  overflow:visible!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro{
  display:grid!important;
  grid-template-columns:minmax(320px,1.18fr) minmax(235px,.78fr) minmax(230px,.78fr) minmax(210px,.64fr)!important;
  gap:12px!important;
  align-items:stretch!important;
  min-height:174px!important;
  height:auto!important;
  padding:14px!important;
  border-radius:22px!important;
  overflow:hidden!important;
}
:where(#net-tab-devices,#view-devices) .device-row-cell{
  min-width:0!important;
  display:flex!important;
  align-items:stretch!important;
}
:where(#net-tab-devices,#view-devices) .device-main,
:where(#net-tab-devices,#view-devices) .device-metric-list.refined,
:where(#net-tab-devices,#view-devices) .device-status-card.refined,
:where(#net-tab-devices,#view-devices) .row-actions.polished{
  width:100%!important;
  min-width:0!important;
}
:where(#net-tab-devices,#view-devices) .device-main{
  gap:10px!important;
  align-items:center!important;
}
:where(#net-tab-devices,#view-devices) .device-health-dot{
  flex:0 0 12px!important;
  width:12px!important;
  height:12px!important;
}
:where(#net-tab-devices,#view-devices) .device-title-row{
  gap:6px!important;
  flex-wrap:wrap!important;
  align-items:center!important;
}
:where(#net-tab-devices,#view-devices) .device-main-text,
:where(#net-tab-devices,#view-devices) .device-title-row,
:where(#net-tab-devices,#view-devices) .device-subtitle,
:where(#net-tab-devices,#view-devices) .device-subline{
  min-width:0!important;
}
:where(#net-tab-devices,#view-devices) .device-name{
  font-size:16px!important;
  line-height:1.25!important;
  max-width:100%!important;
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
:where(#net-tab-devices,#view-devices) .device-subtitle{
  font-size:11px!important;
  line-height:1.45!important;
  margin-top:4px!important;
  display:-webkit-box!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
  overflow:hidden!important;
  min-height:0!important;
}
:where(#net-tab-devices,#view-devices) .device-subline{
  gap:5px!important;
  margin-top:7px!important;
  flex-wrap:wrap!important;
}
:where(#net-tab-devices,#view-devices) .mini-tag,
:where(#net-tab-devices,#view-devices) .path-pill,
:where(#net-tab-devices,#view-devices) .device-status-label-v127{
  min-height:25px!important;
  padding:5px 9px!important;
  border-radius:999px!important;
  font-size:10px!important;
  line-height:1!important;
}
:where(#net-tab-devices,#view-devices) .device-metric-list.refined,
:where(#net-tab-devices,#view-devices) .device-status-card.refined{
  padding:11px!important;
  min-height:100%!important;
  justify-content:center!important;
  border-radius:18px!important;
}
:where(#net-tab-devices,#view-devices) .device-metric-line.metric-primary{
  margin-bottom:8px!important;
}
:where(#net-tab-devices,#view-devices) .device-metric-label{
  font-size:10px!important;
  line-height:1.1!important;
}
:where(#net-tab-devices,#view-devices) .managed-pill{
  min-height:38px!important;
  padding:7px 9px!important;
  border-radius:15px!important;
  gap:7px!important;
}
:where(#net-tab-devices,#view-devices) .managed-pill .mono{
  font-size:13px!important;
  letter-spacing:.02em!important;
}
:where(#net-tab-devices,#view-devices) .latency-pill{
  min-width:44px!important;
  min-height:25px!important;
  padding:4px 9px!important;
}
:where(#net-tab-devices,#view-devices) .device-metric-grid.compact{
  gap:7px!important;
}
:where(#net-tab-devices,#view-devices) .metric-chip{
  min-height:52px!important;
  padding:8px 9px!important;
  border-radius:15px!important;
}
:where(#net-tab-devices,#view-devices) .metric-chip .metric-value{
  font-size:11px!important;
  line-height:1.25!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
:where(#net-tab-devices,#view-devices) .device-status-top.refined{
  margin-bottom:8px!important;
  gap:7px!important;
  flex-wrap:wrap!important;
}
:where(#net-tab-devices,#view-devices) .status-quality{
  min-height:25px!important;
  padding:4px 9px!important;
  font-size:10px!important;
}
:where(#net-tab-devices,#view-devices) .status-summary{
  font-size:12px!important;
  line-height:1.3!important;
  font-weight:900!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
:where(#net-tab-devices,#view-devices) .time-stack.compact.refined{
  gap:6px!important;
}
:where(#net-tab-devices,#view-devices) .time-stack.compact.refined span{
  min-height:31px!important;
  padding:6px 8px!important;
  border-radius:13px!important;
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr)!important;
  gap:7px!important;
  align-items:center!important;
}
:where(#net-tab-devices,#view-devices) .time-stack.compact.refined strong{
  font-size:10px!important;
  white-space:nowrap!important;
}
:where(#net-tab-devices,#view-devices) .time-stack.compact.refined em{
  font-size:10px!important;
  direction:ltr!important;
  text-align:left!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  max-width:100%!important;
}
:where(#net-tab-devices,#view-devices) .cell-actions{
  align-items:center!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:6px!important;
  align-content:center!important;
  justify-content:stretch!important;
  max-height:none!important;
  overflow:visible!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished .row-btn{
  width:100%!important;
  min-width:0!important;
  min-height:29px!important;
  padding:6px 7px!important;
  border-radius:11px!important;
  font-size:10px!important;
  line-height:1.1!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished .row-btn.ping-icon{
  font-size:13px!important;
  min-height:29px!important;
}
/* Real light-mode contrast for the actual devices screen */
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .active-devices-section{
  background:linear-gradient(180deg,#ffffff 0%,#eef5fd 100%)!important;
  border:1px solid rgba(70,94,124,.38)!important;
  box-shadow:0 18px 42px rgba(15,23,42,.18)!important;
}
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .device-row.device-row-pro{
  background:linear-gradient(135deg,#ffffff 0%,#e7f2ff 100%)!important;
  border:1px solid rgba(52,82,122,.40)!important;
  box-shadow:0 14px 30px rgba(15,23,42,.16), inset 0 1px 0 rgba(255,255,255,1)!important;
}
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .device-metric-list.refined,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .device-status-card.refined,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .metric-chip,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .time-stack.compact.refined span,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .managed-pill{
  background:#ffffff!important;
  border:1px solid rgba(70,94,124,.30)!important;
  color:#0f172a!important;
  box-shadow:0 7px 18px rgba(15,23,42,.07)!important;
}
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .device-name,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .status-summary,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .metric-value,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .managed-pill .mono,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .device-metric-label,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .time-stack.compact.refined strong{
  color:#0f172a!important;
}
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .device-subtitle,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .time-stack.compact.refined em{
  color:#334155!important;
}
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .row-actions.polished .row-btn.neutral{
  background:#475569!important;
  color:#ffffff!important;
  border:1px solid rgba(15,23,42,.10)!important;
}
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .row-actions.polished .row-btn.primary{
  background:linear-gradient(135deg,#5b21b6,#7c3aed)!important;
  color:#ffffff!important;
}
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .row-actions.polished .row-btn.danger{
  background:#fee2e2!important;
  color:#b91c1c!important;
  border:1px solid rgba(220,38,38,.24)!important;
}
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .row-actions.polished .row-btn.success{
  background:#dcfce7!important;
  color:#047857!important;
  border:1px solid rgba(4,120,87,.22)!important;
}
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .row-actions.polished .row-btn.ping-icon{
  background:linear-gradient(135deg,#dff6ff,#ccfbf1)!important;
  color:#075985!important;
  border:1px solid rgba(14,116,144,.20)!important;
}
@media(max-width:1500px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro{
    grid-template-columns:minmax(300px,1.1fr) minmax(220px,.78fr) minmax(220px,.78fr) minmax(205px,.64fr)!important;
  }
}
@media(max-width:1260px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro{
    grid-template-columns:minmax(260px,1fr) minmax(225px,.9fr) minmax(230px,.9fr)!important;
    min-height:230px!important;
  }
  :where(#net-tab-devices,#view-devices) .device-row-cell.cell-actions{grid-column:1/-1!important;}
  :where(#net-tab-devices,#view-devices) .row-actions.polished{grid-template-columns:repeat(4,minmax(0,1fr))!important;}
}
@media(max-width:760px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro{grid-template-columns:1fr!important;min-height:350px!important;padding:13px!important;}
  :where(#net-tab-devices,#view-devices) .row-actions.polished{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
/* V152_DEVICE_ROW_REAL_SELECTOR_FIX_END */


/* V153_DASHBOARD_DELIVERY_COMPACT_RELAYOUT_START
   Dashboard-only compact relayout. No text/content removal; only spacing, sizing, contrast, and grid behavior. */
#view-dashboard.dashboard-grid-tight{
  gap:14px!important;
  max-width:1680px!important;
  margin-inline:auto!important;
  padding-bottom:18px!important;
}
#view-dashboard .dashboard-toolbar{
  min-height:58px!important;
  padding:12px 16px!important;
  border-radius:18px!important;
  align-items:center!important;
}
#view-dashboard .panel-title{
  font-size:clamp(24px,2vw,34px)!important;
  line-height:1.05!important;
  margin:0!important;
}
#view-dashboard .dashboard-toolbar-actions{gap:8px!important;}
#view-dashboard .dashboard-toolbar-actions .action-btn,
#view-dashboard .dashboard-toolbar-actions .toolbar-btn{
  min-height:36px!important;
  padding:7px 12px!important;
  border-radius:12px!important;
  font-size:12px!important;
}
#view-dashboard .dashboard-empty-real-data,
#view-dashboard .dashboard-status-strip-v129,
#view-dashboard .delivery-page-strip-v130{
  min-height:34px!important;
  padding:7px 12px!important;
  border-radius:14px!important;
  font-size:12px!important;
  margin:0!important;
}
/* KPI strip */
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(112px,1fr))!important;
  gap:12px!important;
}
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 > .card{
  min-height:76px!important;
  height:auto!important;
  padding:12px 14px!important;
  border-radius:18px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  overflow:hidden!important;
}
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 > .card h3{
  font-size:11px!important;
  line-height:1.1!important;
  margin:0!important;
  letter-spacing:.04em!important;
}
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 > .card p{
  font-size:clamp(24px,2.4vw,34px)!important;
  line-height:1!important;
  margin:0!important;
}
/* Top operational row */
#view-dashboard .mini-kpi-grid{
  display:grid!important;
  grid-template-columns:minmax(280px,1.05fr) minmax(260px,.9fr) minmax(300px,1fr)!important;
  gap:12px!important;
  align-items:stretch!important;
}
#view-dashboard .mini-kpi-grid > .card{
  min-height:190px!important;
  max-height:230px!important;
  padding:14px!important;
  border-radius:20px!important;
  overflow:hidden!important;
}
#view-dashboard .mini-kpi-grid h3{
  font-size:17px!important;
  margin-bottom:10px!important;
}
#view-dashboard .ai-grid-compact{
  display:grid!important;
  grid-template-columns:112px minmax(0,1fr)!important;
  gap:12px!important;
  align-items:center!important;
}
#view-dashboard .ai-circle{
  width:106px!important;
  height:106px!important;
  box-shadow:0 12px 26px rgba(15,23,42,.18)!important;
}
#view-dashboard .ai-inner span{font-size:18px!important;}
#view-dashboard .ai-inner p{font-size:9px!important;}
#view-dashboard .ai-terminal-box{
  min-height:134px!important;
  max-height:154px!important;
  overflow:auto!important;
  padding:12px!important;
  border-radius:16px!important;
}
#view-dashboard #healthSummaryArea{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:8px!important;
}
#view-dashboard #healthSummaryArea > div{
  padding:9px 7px!important;
  border-radius:14px!important;
  min-height:82px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
}
#view-dashboard #auditLogArea{
  max-height:160px!important;
  overflow:auto!important;
  display:grid!important;
  gap:8px!important;
}
#view-dashboard #auditLogArea .audit-row-card,
#view-dashboard #auditLogArea > div{
  padding:9px 10px!important;
  border-radius:14px!important;
}
/* Analytics row */
#view-dashboard .dashboard-analytics-grid{
  display:grid!important;
  grid-template-columns:minmax(0,2.05fr) minmax(280px,.82fr)!important;
  gap:12px!important;
  align-items:stretch!important;
}
#view-dashboard .dashboard-analytics-grid > .card{
  min-height:260px!important;
  padding:14px!important;
  border-radius:20px!important;
}
#view-dashboard .analytics-head{margin-bottom:10px!important;}
#view-dashboard .analytics-head h3{
  font-size:18px!important;
  margin:0!important;
}
#view-dashboard .dashboard-analytics-grid .chart-shell{
  height:238px!important;
  min-height:0!important;
  padding:10px!important;
  border-radius:16px!important;
}
#view-dashboard .dashboard-analytics-grid .chart-shell-donut{
  height:238px!important;
  display:grid!important;
  place-items:center!important;
}
#view-dashboard .dashboard-analytics-grid canvas{
  max-height:218px!important;
}
/* Branches + alerts row */
#view-dashboard > .grid.grid-cols-1.lg\:grid-cols-2.gap-6{
  display:grid!important;
  grid-template-columns:minmax(0,1.35fr) minmax(300px,.75fr)!important;
  gap:12px!important;
  align-items:stretch!important;
}
#view-dashboard > .grid.grid-cols-1.lg\:grid-cols-2.gap-6 > .card{
  min-height:160px!important;
  padding:14px!important;
  border-radius:20px!important;
}
#view-dashboard > .grid.grid-cols-1.lg\:grid-cols-2.gap-6 > .card h3{
  font-size:18px!important;
  margin-bottom:10px!important;
}
#view-dashboard #branchMetricsArea{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr))!important;
  gap:10px!important;
}
#view-dashboard .branch-metric-card{
  min-width:0!important;
  padding:11px!important;
  border-radius:16px!important;
}
#view-dashboard .branch-metric-card .v145-branch-head{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:8px!important;
  align-items:start!important;
  margin-bottom:8px!important;
}
#view-dashboard .branch-metric-card .v145-branch-name{
  font-size:14px!important;
  line-height:1.2!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
#view-dashboard .branch-metric-card .v145-branch-id{
  max-width:92px!important;
  font-size:9px!important;
  opacity:.8!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
#view-dashboard .branch-metric-card .v145-branch-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:6px!important;
}
#view-dashboard .branch-metric-card .v145-branch-grid > div{
  padding:7px 5px!important;
  border-radius:12px!important;
}
#view-dashboard .branch-metric-card .v145-branch-label{
  font-size:9px!important;
  line-height:1.2!important;
}
#view-dashboard .branch-metric-card .v145-branch-value{
  font-size:clamp(18px,1.5vw,24px)!important;
  line-height:1!important;
}
#view-dashboard #globalAlertsArea{
  max-height:138px!important;
  overflow:auto!important;
}
#view-dashboard #globalAlertsArea .alert-row-card,
#view-dashboard #globalAlertsArea > div{
  padding:9px 10px!important;
  border-radius:14px!important;
  font-size:13px!important;
}
/* Ping compact utility */
#view-dashboard .ping-card{
  padding:12px 14px!important;
  border-radius:20px!important;
  min-height:auto!important;
}
#view-dashboard .ping-card .section-heading-row{
  margin-bottom:8px!important;
}
#view-dashboard .ping-card h3{
  font-size:16px!important;
}
#view-dashboard .ping-layout{
  display:grid!important;
  gap:8px!important;
}
#view-dashboard .ping-input-row{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 96px!important;
  gap:8px!important;
  align-items:center!important;
}
#view-dashboard #pingTarget{
  min-height:38px!important;
  border-radius:13px!important;
}
#view-dashboard #pingBtn{
  min-height:38px!important;
  border-radius:13px!important;
  padding:7px 12px!important;
}
#view-dashboard #pingResult{
  min-height:0!important;
  max-height:96px!important;
  overflow:auto!important;
  border-radius:14px!important;
}
/* stronger dashboard contrast, scoped only */
body[data-it-theme="light"] #view-dashboard :where(.card,.compact-card,.ping-card,.section-shell,.chart-shell){
  background:linear-gradient(180deg,#ffffff,#f6f9fd)!important;
  border-color:rgba(92,114,142,.34)!important;
  box-shadow:0 12px 28px rgba(32,48,72,.12), inset 0 1px 0 rgba(255,255,255,.98)!important;
}
body[data-it-theme="light"] #view-dashboard :where(h1,h2,h3,h4,.panel-title,.compact-title,.analytics-head h3){
  color:#0f172a!important;
}
body[data-it-theme="light"] #view-dashboard :where(.text-slate-400,.text-slate-500,.panel-meta,.v145-branch-label){
  color:#475569!important;
}
body[data-it-theme="dark"] #view-dashboard :where(.card,.compact-card,.ping-card,.section-shell,.chart-shell){
  background:linear-gradient(180deg,rgba(10,18,32,.98),rgba(5,12,24,.94))!important;
  border-color:rgba(96,165,250,.20)!important;
  box-shadow:0 16px 34px rgba(0,0,0,.30)!important;
}
/* responsive */
@media(max-width:1280px){
  #view-dashboard .mini-kpi-grid{grid-template-columns:1fr 1fr!important;}
  #view-dashboard .mini-kpi-grid > .ai-card-compact{grid-column:1/-1!important;}
  #view-dashboard .dashboard-analytics-grid{grid-template-columns:1fr!important;}
  #view-dashboard > .grid.grid-cols-1.lg\:grid-cols-2.gap-6{grid-template-columns:1fr!important;}
}
@media(max-width:860px){
  #view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  #view-dashboard .mini-kpi-grid{grid-template-columns:1fr!important;}
  #view-dashboard #healthSummaryArea{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  #view-dashboard .ping-input-row{grid-template-columns:1fr!important;}
}
/* V153_DASHBOARD_DELIVERY_COMPACT_RELAYOUT_END */


/* V155_DASHBOARD_NO_STATUS_DISTRIBUTION_PRO_POLISH_START
   Dashboard-only cleanup: remove status distribution card from layout, reclaim space, and polish delivery visual hierarchy. */
#view-dashboard.dashboard-grid-tight{
  gap:12px!important;
  max-width:1720px!important;
}
#view-dashboard .dashboard-toolbar{
  min-height:54px!important;
  padding:10px 14px!important;
  border-radius:18px!important;
}
#view-dashboard .panel-title{
  font-size:clamp(23px,1.75vw,30px)!important;
  letter-spacing:-.02em!important;
}
#view-dashboard .dashboard-toolbar-actions .action-btn,
#view-dashboard .dashboard-toolbar-actions .toolbar-btn{
  min-height:34px!important;
  padding:6px 12px!important;
  border-radius:12px!important;
  box-shadow:none!important;
}
#view-dashboard .dashboard-empty-real-data,
#view-dashboard .dashboard-status-strip-v129,
#view-dashboard .delivery-page-strip-v130{
  min-height:32px!important;
  padding:6px 12px!important;
  border-radius:13px!important;
  font-size:11px!important;
}
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4{
  gap:10px!important;
}
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 > .card{
  min-height:68px!important;
  padding:10px 12px!important;
  border-radius:16px!important;
  position:relative!important;
}
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 > .card::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:3px;
  background:linear-gradient(90deg,rgba(37,99,235,.9),rgba(96,165,250,.35));
  opacity:.85;
}
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 > .card h3{
  font-size:10px!important;
  margin:0!important;
}
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 > .card p{
  font-size:clamp(23px,2vw,30px)!important;
  margin:0!important;
}
#view-dashboard .mini-kpi-grid{
  grid-template-columns:minmax(300px,.92fr) minmax(280px,1fr) minmax(300px,1fr)!important;
  gap:10px!important;
}
#view-dashboard .mini-kpi-grid > .card{
  min-height:168px!important;
  max-height:206px!important;
  padding:12px!important;
  border-radius:18px!important;
}
#view-dashboard .mini-kpi-grid h3{
  font-size:16px!important;
  margin-bottom:8px!important;
}
#view-dashboard .ai-grid-compact{
  grid-template-columns:98px minmax(0,1fr)!important;
  gap:10px!important;
}
#view-dashboard .ai-circle{
  width:94px!important;
  height:94px!important;
}
#view-dashboard .ai-terminal-box{
  min-height:116px!important;
  max-height:136px!important;
  padding:10px!important;
  border-radius:14px!important;
}
#view-dashboard #healthSummaryArea{
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:7px!important;
}
#view-dashboard #healthSummaryArea > div{
  min-height:70px!important;
  padding:7px 6px!important;
  border-radius:12px!important;
}
#view-dashboard #auditLogArea{
  max-height:132px!important;
  gap:7px!important;
}
#view-dashboard #auditLogArea .audit-row-card,
#view-dashboard #auditLogArea > div{
  padding:8px 9px!important;
  border-radius:12px!important;
}
/* Analytics: status distribution removed, line chart uses full row */
#view-dashboard .dashboard-analytics-grid,
#view-dashboard .dashboard-analytics-grid-single{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:10px!important;
}
#view-dashboard .dashboard-line-chart-card,
#view-dashboard .dashboard-analytics-grid > .card{
  min-height:258px!important;
  padding:12px!important;
  border-radius:18px!important;
}
#view-dashboard .dashboard-analytics-grid .analytics-head{
  margin-bottom:8px!important;
}
#view-dashboard .dashboard-analytics-grid .analytics-head h3{
  font-size:17px!important;
}
#view-dashboard .dashboard-analytics-grid .chart-shell{
  height:214px!important;
  min-height:0!important;
  padding:8px!important;
  border-radius:14px!important;
}
#view-dashboard .dashboard-analytics-grid .chart-shell-donut,
#view-dashboard #fleetStatusChart{
  display:none!important;
}
#view-dashboard .dashboard-analytics-grid canvas{
  max-height:198px!important;
}
#view-dashboard > .grid.grid-cols-1.lg\:grid-cols-2.gap-6{
  grid-template-columns:minmax(0,1.35fr) minmax(320px,.75fr)!important;
  gap:10px!important;
}
#view-dashboard > .grid.grid-cols-1.lg\:grid-cols-2.gap-6 > .card{
  min-height:142px!important;
  padding:12px!important;
  border-radius:18px!important;
}
#view-dashboard > .grid.grid-cols-1.lg\:grid-cols-2.gap-6 > .card h3{
  font-size:17px!important;
  margin-bottom:8px!important;
}
#view-dashboard #branchMetricsArea{
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr))!important;
  gap:8px!important;
}
#view-dashboard .branch-metric-card{
  padding:9px!important;
  border-radius:14px!important;
}
#view-dashboard .branch-metric-card .v145-branch-grid > div{
  padding:6px 4px!important;
}
#view-dashboard #globalAlertsArea{
  max-height:116px!important;
}
#view-dashboard #globalAlertsArea .alert-row-card,
#view-dashboard #globalAlertsArea > div{
  padding:8px 9px!important;
}
#view-dashboard .ping-card{
  padding:10px 12px!important;
  border-radius:18px!important;
}
#view-dashboard .ping-card h3{
  font-size:15px!important;
}
#view-dashboard .ping-input-row{
  grid-template-columns:minmax(0,1fr) 92px!important;
  gap:7px!important;
}
#view-dashboard #pingTarget,
#view-dashboard #pingBtn{
  min-height:36px!important;
}
/* premium contrast after removing low-value chart */
body[data-it-theme="light"] #view-dashboard :where(.card,.compact-card,.ping-card,.section-shell,.chart-shell){
  background:linear-gradient(180deg,#ffffff 0%,#f3f7fc 100%)!important;
  border-color:rgba(72,94,124,.38)!important;
  box-shadow:0 10px 24px rgba(30,45,70,.13), inset 0 1px 0 rgba(255,255,255,1)!important;
}
body[data-it-theme="light"] #view-dashboard .dashboard-toolbar,
body[data-it-theme="light"] #view-dashboard .dashboard-empty-real-data,
body[data-it-theme="light"] #view-dashboard .dashboard-status-strip-v129,
body[data-it-theme="light"] #view-dashboard .delivery-page-strip-v130{
  background:linear-gradient(180deg,#ffffff,#eef4fb)!important;
  border-color:rgba(72,94,124,.32)!important;
}
body[data-it-theme="dark"] #view-dashboard :where(.card,.compact-card,.ping-card,.section-shell,.chart-shell){
  background:linear-gradient(180deg,rgba(10,18,32,.99),rgba(6,13,25,.96))!important;
  border-color:rgba(96,165,250,.22)!important;
  box-shadow:0 14px 30px rgba(0,0,0,.34)!important;
}
@media(max-width:1280px){
  #view-dashboard .mini-kpi-grid{grid-template-columns:1fr 1fr!important;}
  #view-dashboard .mini-kpi-grid > .ai-card-compact{grid-column:1/-1!important;}
  #view-dashboard > .grid.grid-cols-1.lg\:grid-cols-2.gap-6{grid-template-columns:1fr!important;}
}
@media(max-width:860px){
  #view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  #view-dashboard .mini-kpi-grid{grid-template-columns:1fr!important;}
  #view-dashboard #healthSummaryArea{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  #view-dashboard .ping-input-row{grid-template-columns:1fr!important;}
}
/* V155_DASHBOARD_NO_STATUS_DISTRIBUTION_PRO_POLISH_END */


/* V157_COLLAPSED_SIDEBAR_TOOLTIP_ZINDEX_FIX_START */
/* Keep the collapsed mini rail above the page content and allow labels to escape the sidebar box. */
#appView.app-shell.sidebar-collapsed .app-sidebar,
#appView.app-shell[data-sidebar-collapsed="1"] .app-sidebar,
#appView.app-shell .app-sidebar.is-sidebar-mini{
  position:sticky!important;
  z-index:50000!important;
  overflow:visible!important;
  contain:none!important;
  isolation:isolate!important;
}
#appView.app-shell.sidebar-collapsed .sidebar-nav-wrap,
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav-wrap,
#appView.app-shell.sidebar-collapsed .sidebar-nav,
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav,
#appView.app-shell.sidebar-collapsed .sidebar-nav .nav-btn,
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn{
  overflow:visible!important;
  contain:none!important;
}
#appView.app-shell.sidebar-collapsed .sidebar-nav .nav-btn,
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn{
  z-index:50010!important;
  isolation:auto!important;
}
#appView.app-shell.sidebar-collapsed .sidebar-nav .nav-btn:hover,
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn:hover,
#appView.app-shell.sidebar-collapsed .sidebar-nav .nav-btn:focus-visible,
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn:focus-visible{
  z-index:50020!important;
}
/* Disable the old pseudo tooltip once the safe body-level tooltip is enabled to prevent duplicates/behind-layer labels. */
body[data-v157-mini-tooltip="1"] #appView.app-shell.sidebar-collapsed .sidebar-nav .nav-btn[data-mini-title]::after,
body[data-v157-mini-tooltip="1"] #appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn[data-mini-title]::after{
  display:none!important;
  content:none!important;
}
.it-top-mini-tooltip-v157{
  position:fixed;
  z-index:2147483647;
  min-width:128px;
  max-width:240px;
  padding:10px 13px;
  border-radius:14px;
  background:linear-gradient(135deg, rgba(15,23,42,.98), rgba(30,41,59,.98));
  color:#fff;
  border:1px solid rgba(96,165,250,.34);
  box-shadow:0 18px 44px rgba(2,6,23,.42), 0 0 0 1px rgba(255,255,255,.04) inset;
  font-size:12px;
  font-weight:900;
  line-height:1.45;
  text-align:right;
  pointer-events:none;
  opacity:0;
  transform:translateY(-50%) scale(.98);
  transition:opacity .12s ease, transform .12s ease;
  white-space:normal;
  visibility:hidden;
}
.it-top-mini-tooltip-v157.show{
  opacity:1;
  visibility:visible;
  transform:translateY(-50%) scale(1);
}
.it-top-mini-tooltip-v157::before{
  content:"";
  position:absolute;
  top:50%;
  width:10px;
  height:10px;
  background:rgba(15,23,42,.98);
  border:1px solid rgba(96,165,250,.28);
  transform:translateY(-50%) rotate(45deg);
}
.it-top-mini-tooltip-v157[data-side="left"]::before{
  right:-6px;
  border-left:0;
  border-bottom:0;
}
.it-top-mini-tooltip-v157[data-side="right"]::before{
  left:-6px;
  border-right:0;
  border-top:0;
}
body[data-it-theme="light"] .it-top-mini-tooltip-v157{
  background:linear-gradient(135deg,#0f172a,#1e293b);
  color:#f8fafc;
  border-color:rgba(96,165,250,.40);
  box-shadow:0 18px 44px rgba(15,23,42,.30), 0 0 0 1px rgba(255,255,255,.08) inset;
}
body[data-it-theme="light"] .it-top-mini-tooltip-v157::before{
  background:#0f172a;
  border-color:rgba(96,165,250,.38);
}
@media(max-width:980px){
  .it-top-mini-tooltip-v157{display:none!important;}
}
/* V157_COLLAPSED_SIDEBAR_TOOLTIP_ZINDEX_FIX_END */


/* V158_MOBILE_SIMPLIFIED_UI_REMOVED_V205: legacy mobile/appView responsive layer removed. */


/* V159_MOBILE_FINAL_POLISH_REMOVED_V205: legacy mobile/appView responsive layer removed. */


/* V161_MOBILE_NETWORK_DEVICE_COMPACT_FIX_START
   Mobile only: make Networks and Devices truly compact. Desktop selectors remain untouched. */
@media (max-width: 768px){
  :root{--it-mobile-network-card-pad:8px;--it-mobile-device-row-h:286px;}

  /* Networks: smaller header, denser cards, no wasted secondary rows on mobile */
  #view-networks .networks-compact-shell,
  #networksCardsArea,
  .networks-compact-list{
    gap:6px!important;
  }
  .networks-compact-head{
    padding:9px 10px!important;
    border-radius:14px!important;
    min-height:0!important;
  }
  .networks-compact-head h1{
    font-size:18px!important;
    line-height:1.15!important;
    margin:0!important;
  }
  .networks-compact-head p{
    font-size:9px!important;
    line-height:1.35!important;
    margin-top:2px!important;
    max-height:14px!important;
    overflow:hidden!important;
  }
  .networks-compact-actions{gap:6px!important;}
  .networks-compact-create,.networks-compact-refresh{
    min-height:34px!important;
    border-radius:11px!important;
    padding:0 10px!important;
    font-size:10px!important;
  }
  .networks-compact-stats{
    gap:5px!important;
    padding:3px 0!important;
    overflow-x:auto!important;
    flex-wrap:nowrap!important;
    scrollbar-width:none!important;
  }
  .networks-compact-stats::-webkit-scrollbar{display:none!important;}
  .networks-compact-stats span{
    min-height:24px!important;
    padding:0 8px!important;
    font-size:9px!important;
    flex:0 0 auto!important;
  }
  .network-list-card,.network-command-card,.networks-compact-card{
    padding:var(--it-mobile-network-card-pad)!important;
    border-radius:13px!important;
    min-height:0!important;
    box-shadow:0 8px 16px rgba(15,23,42,.10)!important;
  }
  .networks-compact-card:before,.network-list-card::before,.network-command-card::before{
    width:3px!important;
  }
  .networks-compact-main{
    display:grid!important;
    grid-template-columns:1fr auto!important;
    gap:5px!important;
    align-items:center!important;
  }
  .networks-compact-name{
    grid-column:1 / 2!important;
    gap:7px!important;
    min-width:0!important;
  }
  .networks-compact-dot{width:8px!important;height:8px!important;box-shadow:none!important;}
  .networks-compact-name h3{
    font-size:13px!important;
    line-height:1.2!important;
    margin:0!important;
  }
  .networks-compact-name p{
    font-size:9px!important;
    line-height:1.25!important;
    margin:1px 0 0!important;
    max-height:13px!important;
  }
  .networks-compact-id{
    grid-column:2 / 3!important;
    padding:5px 7px!important;
    border-radius:10px!important;
    max-width:104px!important;
  }
  .networks-compact-id span{font-size:8px!important;margin-bottom:1px!important;}
  .networks-compact-id strong{font-size:10px!important;line-height:1.15!important;max-width:88px!important;}
  .networks-compact-mini{
    padding:5px 6px!important;
    border-radius:10px!important;
    min-width:0!important;
    text-align:center!important;
  }
  .networks-compact-mini span{font-size:8px!important;margin-bottom:1px!important;}
  .networks-compact-mini strong{font-size:11px!important;line-height:1.15!important;}
  .networks-compact-buttons{
    grid-column:1 / -1!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:5px!important;
    margin-top:1px!important;
  }
  .networks-compact-copy,.networks-compact-open,
  .network-card-copy,.network-card-open{
    min-height:31px!important;
    height:31px!important;
    border-radius:10px!important;
    padding:0 7px!important;
    font-size:9px!important;
    min-width:0!important;
    width:100%!important;
  }
  .networks-compact-sub{
    display:none!important; /* secondary network details are still available when opening the network */
  }

  /* Alternate network command card layout */
  .network-command-card-main{gap:7px!important;}
  .network-command-title-row{
    gap:7px!important;
    align-items:flex-start!important;
  }
  .network-name-block{gap:7px!important;}
  .network-name-block h3{font-size:13px!important;line-height:1.2!important;margin:0!important;}
  .network-name-block p{font-size:9px!important;line-height:1.25!important;max-height:13px!important;margin:1px 0 0!important;}
  .network-tier-badge{font-size:8px!important;padding:3px 6px!important;border-radius:999px!important;max-width:82px!important;}
  .network-card-metrics{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:5px!important;
  }
  .network-health-ring{width:52px!important;height:52px!important;min-width:52px!important;margin:auto!important;}
  .network-health-ring strong{font-size:12px!important;}
  .network-health-ring span{font-size:7px!important;}
  .network-metric{padding:5px 6px!important;border-radius:10px!important;}
  .network-metric span{font-size:8px!important;}
  .network-metric strong{font-size:12px!important;}
  .network-progress-line{height:4px!important;margin:2px 0!important;}
  .network-detail-grid{
    display:none!important; /* full details remain in the opened network page */
  }
  .network-card-footer{gap:6px!important;margin-top:4px!important;}
  .network-card-note{font-size:9px!important;line-height:1.25!important;max-height:14px!important;}
  .network-card-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:5px!important;width:100%!important;}

  /* Devices: true compact mobile card; rowHeight is aligned in app.js */
  #net-tab-devices .active-devices-section,
  #net-tab-devices .pending-devices-section{
    padding:8px!important;
    border-radius:14px!important;
  }
  #net-tab-devices .active-devices-head{
    margin-bottom:6px!important;
    gap:6px!important;
  }
  #net-tab-devices .active-devices-head span{font-size:8px!important;}
  #net-tab-devices .active-devices-head strong{font-size:13px!important;}
  #net-tab-devices .active-devices-head small{font-size:9px!important;}
  #net-tab-devices .device-virtual-viewport,
  #net-tab-devices .device-virtual-spacer{
    overflow:visible!important;
  }
  #net-tab-devices .device-row.device-row-pro{
    height:270px!important;
    min-height:270px!important;
    max-height:270px!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    align-content:start!important;
    gap:5px!important;
    padding:8px!important;
    border-radius:13px!important;
    overflow:hidden!important;
    box-shadow:0 8px 18px rgba(15,23,42,.12)!important;
  }
  #net-tab-devices .device-row-cell{
    padding:0!important;
    min-width:0!important;
    width:100%!important;
  }
  #net-tab-devices .device-main{gap:7px!important;align-items:flex-start!important;}
  #net-tab-devices .device-health-dot{width:9px!important;height:9px!important;margin-top:4px!important;box-shadow:none!important;}
  #net-tab-devices .device-title-row{
    gap:4px!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    min-width:0!important;
  }
  #net-tab-devices .device-name{
    font-size:12px!important;
    line-height:1.2!important;
    max-width:42vw!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  #net-tab-devices .path-pill,
  #net-tab-devices .device-status-label-v127,
  #net-tab-devices .mini-tag{
    font-size:8px!important;
    min-height:19px!important;
    padding:2px 6px!important;
    border-radius:999px!important;
    white-space:nowrap!important;
  }
  #net-tab-devices .device-subtitle{
    font-size:9px!important;
    line-height:1.25!important;
    margin-top:2px!important;
    max-height:12px!important;
    overflow:hidden!important;
    white-space:nowrap!important;
    text-overflow:ellipsis!important;
  }
  #net-tab-devices .device-subline{
    gap:4px!important;
    margin-top:3px!important;
    overflow:hidden!important;
    flex-wrap:nowrap!important;
  }
  #net-tab-devices .device-subline .mini-tag:nth-child(n+3){display:none!important;}
  #net-tab-devices .device-metric-list.refined{gap:5px!important;}
  #net-tab-devices .device-metric-line.metric-primary{
    min-height:31px!important;
    padding:5px 7px!important;
    border-radius:10px!important;
  }
  #net-tab-devices .device-metric-label{font-size:8px!important;}
  #net-tab-devices .managed-pill .mono{font-size:10px!important;}
  #net-tab-devices .latency-pill{font-size:8px!important;padding:2px 5px!important;}
  #net-tab-devices .device-metric-grid.compact{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:5px!important;
  }
  #net-tab-devices .metric-chip{
    min-height:30px!important;
    padding:5px 6px!important;
    border-radius:10px!important;
  }
  #net-tab-devices .metric-chip .metric-value{font-size:9px!important;}
  #net-tab-devices .device-status-card.refined{
    min-height:38px!important;
    padding:6px 7px!important;
    border-radius:10px!important;
  }
  #net-tab-devices .device-status-top.refined{gap:5px!important;margin-bottom:4px!important;}
  #net-tab-devices .status-quality,
  #net-tab-devices .status-summary{font-size:9px!important;line-height:1.2!important;}
  #net-tab-devices .time-stack.compact.refined{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:5px!important;
  }
  #net-tab-devices .time-stack.compact.refined span{
    min-height:24px!important;
    padding:3px 5px!important;
    border-radius:8px!important;
  }
  #net-tab-devices .time-stack.compact.refined strong,
  #net-tab-devices .time-stack.compact.refined em{font-size:8px!important;line-height:1.15!important;}
  #net-tab-devices .row-actions.polished,
  #net-tab-devices .device-row-actions,
  #net-tab-devices .row-actions{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:4px!important;
    width:100%!important;
  }
  #net-tab-devices .row-actions.polished .row-btn,
  #net-tab-devices .device-row-actions button,
  #net-tab-devices .row-actions button{
    min-height:27px!important;
    height:27px!important;
    border-radius:9px!important;
    font-size:8.5px!important;
    line-height:1!important;
    padding:0 4px!important;
    min-width:0!important;
    width:100%!important;
    box-shadow:none!important;
  }
  #net-tab-devices .row-actions.polished .row-btn.ping-icon{font-size:12px!important;}
}
/* V161_MOBILE_NETWORK_DEVICE_COMPACT_FIX_END */


/* V162_MOBILE_DELIVERY_COMPACT_QA_REMOVED_V205: legacy mobile/appView responsive layer removed. */


/* V171_PHASE14_DESKTOP_LIGHT_SIDEBAR_FIX_START
   Targeted desktop-only fix for light theme sidebar contrast, hover/active states, collapsed handle, and text overflow.
   Scope: light theme desktop sidebar only. Mobile assets and app.js remain unchanged. */
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .app-sidebar{
    background:
        linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(246,250,255,.94) 52%, rgba(235,242,250,.96) 100%)!important;
    border:1px solid rgba(148,163,184,.34)!important;
    box-shadow:0 26px 64px rgba(15,23,42,.14), inset 0 1px 0 rgba(255,255,255,.86)!important;
    color:#0f172a!important;
    overflow:hidden!important;
}
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-brand-card,
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-user-card{
    background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.92))!important;
    border:1px solid rgba(148,163,184,.30)!important;
    box-shadow:0 12px 28px rgba(15,23,42,.08), inset 0 1px 0 rgba(255,255,255,.78)!important;
}
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-kicker{
    background:rgba(183,121,31,.12)!important;
    border-color:rgba(183,121,31,.28)!important;
    color:#8a4f10!important;
}
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-tagline,
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-blurb,
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-user-label,
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-section-title,
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-mini-tile span,
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-status-card span{
    color:#475569!important;
}
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-user-name,
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-mini-tile strong,
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-status-card strong{
    color:#0f172a!important;
}
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-mini-tile,
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-status-card{
    background:linear-gradient(180deg, rgba(248,250,252,.96), rgba(241,245,249,.90))!important;
    border-color:rgba(148,163,184,.28)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.70)!important;
}
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-nav .nav-btn{
    position:relative!important;
    grid-template-columns:42px minmax(0,1fr)!important;
    background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,250,252,.90))!important;
    border:1px solid rgba(148,163,184,.30)!important;
    color:#0f172a!important;
    box-shadow:0 8px 20px rgba(15,23,42,.06), inset 0 1px 0 rgba(255,255,255,.78)!important;
    overflow:hidden!important;
}
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-nav .nav-btn::before{
    content:"";
    position:absolute;
    inset-block:10px;
    inset-inline-start:0;
    width:4px;
    border-radius:999px;
    background:transparent;
}
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-nav .nav-btn:hover{
    background:linear-gradient(180deg, rgba(255,255,255,1), rgba(241,245,249,.96))!important;
    border-color:rgba(183,121,31,.34)!important;
    transform:translateY(-1px)!important;
    box-shadow:0 12px 26px rgba(15,23,42,.09), inset 0 1px 0 rgba(255,255,255,.82)!important;
}
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-nav .nav-btn.active{
    background:linear-gradient(135deg, rgba(255,248,235,.98), rgba(236,244,255,.96))!important;
    border-color:rgba(183,121,31,.46)!important;
    box-shadow:0 14px 30px rgba(183,121,31,.14), inset 0 1px 0 rgba(255,255,255,.86)!important;
}
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-nav .nav-btn.active::before{
    background:linear-gradient(180deg,#d69e2e,#b7791f)!important;
}
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .nav-btn-icon{
    background:linear-gradient(180deg, rgba(255,251,235,.98), rgba(236,244,255,.92))!important;
    border-color:rgba(183,121,31,.26)!important;
    color:#8a4f10!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.80), 0 8px 18px rgba(15,23,42,.07)!important;
}
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-nav .nav-btn.active .nav-btn-icon{
    background:linear-gradient(135deg,#f3d47f,#cfa64d)!important;
    color:#111827!important;
    border-color:rgba(183,121,31,.36)!important;
}
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .nav-btn-copy{
    min-width:0!important;
}
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .nav-btn-copy strong{
    color:#0f172a!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
}
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .nav-btn-copy small{
    color:#475569!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
}
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-toggle-btn{
    background:linear-gradient(135deg, rgba(255,248,235,.98), rgba(236,244,255,.94))!important;
    color:#8a4f10!important;
    border-color:rgba(183,121,31,.36)!important;
    box-shadow:0 12px 26px rgba(15,23,42,.08), inset 0 1px 0 rgba(255,255,255,.82)!important;
}
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-toggle-btn .sidebar-toggle-icon,
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-toggle-btn [data-sidebar-toggle-icon]{
    background:rgba(183,121,31,.12)!important;
    border-color:rgba(183,121,31,.24)!important;
    color:#8a4f10!important;
}
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-user-action{
    background:linear-gradient(180deg, rgba(236,244,255,.96), rgba(219,234,254,.76))!important;
    border-color:rgba(37,99,235,.22)!important;
    color:#1d4ed8!important;
}
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-user-action:hover{
    background:linear-gradient(180deg, rgba(219,234,254,.98), rgba(191,219,254,.80))!important;
}
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-logout{
    background:linear-gradient(180deg, rgba(254,242,242,.98), rgba(255,228,230,.90))!important;
    color:#b91c1c!important;
    border-color:rgba(239,68,68,.28)!important;
    box-shadow:0 10px 22px rgba(239,68,68,.08), inset 0 1px 0 rgba(255,255,255,.72)!important;
}
:where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-logout:hover{
    background:linear-gradient(180deg, rgba(254,226,226,.98), rgba(254,205,211,.90))!important;
}
:where(html[data-it-theme="light"], body[data-it-theme="light"]) .sidebar-floating-toggle{
    z-index:9999!important;
    background:linear-gradient(135deg,#f8df9b,#c9912e)!important;
    color:#111827!important;
    border-color:rgba(138,79,16,.34)!important;
    box-shadow:0 18px 44px rgba(15,23,42,.24), inset 0 1px 0 rgba(255,255,255,.42)!important;
}
:where(html[data-it-theme="light"], body[data-it-theme="light"]) .sidebar-floating-toggle span:first-child,
:where(html[data-it-theme="light"], body[data-it-theme="light"]) .sidebar-floating-toggle [data-sidebar-toggle-icon]{
    color:#111827!important;
    background:rgba(255,255,255,.24)!important;
}
@media(max-width:900px){
    :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .app-sidebar{
        overflow:visible!important;
    }
}
/* V171_PHASE14_DESKTOP_LIGHT_SIDEBAR_FIX_END */

/* V171_PHASE15_DESKTOP_LIGHT_FULL_VISUAL_QA_FIX_START
   Targeted desktop-only light-theme visual QA layer.
   Scope: desktop light theme surfaces outside the Phase 14 sidebar fix: headers, cards, tables, modals, forms, dynamic JS panels, login/activation contrast.
   Dark theme, static/app.js and all mobile assets remain unchanged. */
@media (min-width: 901px){
  :where(html[data-it-theme="light"], body[data-it-theme="light"]){
    --it-p15-text:#0f172a;
    --it-p15-text-strong:#020617;
    --it-p15-muted:#334155;
    --it-p15-muted-soft:#475569;
    --it-p15-surface:#ffffff;
    --it-p15-surface-soft:#f8fafc;
    --it-p15-surface-warm:#fffaf0;
    --it-p15-border:rgba(15,23,42,.16);
    --it-p15-border-strong:rgba(15,23,42,.24);
    --it-p15-gold:#b7791f;
    --it-p15-blue:#1d4ed8;
    --it-p15-shadow:0 18px 44px rgba(15,23,42,.10), inset 0 1px 0 rgba(255,255,255,.86);
  }
  html[data-it-theme="light"] body,
  body[data-it-theme="light"]{
    background:
      radial-gradient(circle at 16% 0%, rgba(183,121,31,.08), transparent 24%),
      radial-gradient(circle at 88% 12%, rgba(37,99,235,.08), transparent 22%),
      linear-gradient(180deg,#f9fbff 0%,#f3f6fa 52%,#edf3f8 100%)!important;
    color:var(--it-p15-text)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) :where(
    .dashboard-toolbar,.networks-toolbar,.net-header-shell,.network-summary-shell,
    .card,.compact-card,.section-shell,.device-card,.network-list-card,
    .pending-devices-section,.active-devices-section,.network-clean-header,
    .table-shell,.chart-shell,.ai-terminal-shell,.ai-terminal-box,.ai-live-feed,
    .branch-metric-card,.audit-row-card,.alert-row-card,.settings-stack-card,.sa-section-shell,
    .network-quick-item,.network-quick-qr,.quick-client-output,.qr-download-panel,
    .backup-restore-hint,.login-note-card,.brand-feature,.brand-legal-box,.login-trust-item,.login-stat-card,
    .activation-card-pro,.activation-brand-panel,.activation-info-card,.activation-legal-box
  ){
    background:linear-gradient(180deg, rgba(255,255,255,.985), rgba(248,250,252,.94))!important;
    border-color:var(--it-p15-border)!important;
    color:var(--it-p15-text)!important;
    box-shadow:var(--it-p15-shadow)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) :where(
    .dashboard-toolbar,.networks-toolbar,.net-header-shell,.network-summary-shell
  ){
    background:linear-gradient(135deg, rgba(255,255,255,.99), rgba(241,245,249,.94))!important;
    border-color:rgba(183,121,31,.20)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) :where(
    .dashboard-toolbar::before,.networks-toolbar::before,.net-header-shell::before,.network-list-card::before
  ){
    background:linear-gradient(180deg,var(--it-p15-gold),rgba(183,121,31,.22))!important;
    opacity:.95!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) :where(
    h1,h2,h3,h4,.panel-title,.compact-title,.modal-title,.device-name,.network-clean-title h1,
    .net-header-main h2,.network-summary-head h3,.login-hero-title,.activation-brand-copy h1,
    .activation-form-header h2,.login-stat-card strong,.brand-feature strong,.login-trust-item strong
  ){
    color:var(--it-p15-text-strong)!important;
    text-shadow:none!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) :where(
    .text-slate-300,.text-slate-400,.text-slate-500,.text-gray-300,.text-gray-400,.text-gray-500,
    .panel-meta,.settings-panel-note,.device-subtitle,.network-clean-title p,.network-quick-note,
    .device-toolbar-meta,.app-footer,.field-caption,.help-note,.login-hint,.login-hero-text,
    .login-stat-card span,.login-trust-item p,.activation-form-header p,.activation-info-card small,
    .it-note,.qr-hint-text,.quick-client-file-hint,.backup-restore-hint,.terminal-text .tag
  ){
    color:var(--it-p15-muted)!important;
    opacity:1!important;
    text-shadow:none!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) :where(
    .theme-kicker,.theme-accent,.theme-chip,.brand-chip,.section-chip,.analytics-chip,.net-header-kicker,
    .network-quick-copy,.login-badge,.login-overline,.activation-kicker,.activation-mini-btn
  ){
    color:#8a4f10!important;
    background:rgba(183,121,31,.10)!important;
    border-color:rgba(183,121,31,.24)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) :where(
    .input-glass,input,textarea,select,.it-input,.device-search-input,.network-bundle-preview,
    .device-search-wrap,.password-toggle,.login-tab,.ip-btn,.metric-chip,.device-status-card
  ){
    background:linear-gradient(180deg,#ffffff,#f8fafc)!important;
    color:var(--it-p15-text)!important;
    border-color:var(--it-p15-border-strong)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.86),0 4px 12px rgba(15,23,42,.04)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) :where(
    .input-glass,input,textarea,select,.it-input,.device-search-input
  )::placeholder{
    color:#64748b!important;
    opacity:1!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) :where(
    .input-glass:focus,input:focus,textarea:focus,select:focus,.it-input:focus
  ){
    border-color:rgba(183,121,31,.46)!important;
    box-shadow:0 0 0 4px rgba(183,121,31,.14),0 10px 26px rgba(15,23,42,.08)!important;
    outline:none!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) :where(
    [class*="bg-slate-900"],[class*="bg-slate-950"],[class*="bg-slate-800"],[class*="bg-[#020617]"]
  ){
    background-color:#f8fafc!important;
    background-image:linear-gradient(180deg,#ffffff,#f8fafc)!important;
    color:var(--it-p15-text)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) :where(
    [class*="border-slate-700"],[class*="border-slate-800"],[class*="border-slate-900"]
  ){
    border-color:var(--it-p15-border)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) .zt-table{
    color:var(--it-p15-text)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) .zt-table thead th,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) .zt-table th{
    background:linear-gradient(180deg,#f1f5f9,#e8eef6)!important;
    color:#334155!important;
    border-bottom:1px solid var(--it-p15-border-strong)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) .zt-table td{
    color:#1e293b!important;
    border-color:rgba(148,163,184,.26)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) .zt-table tbody tr:hover td{
    background:rgba(226,232,240,.62)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) :where(
    #modalBackdrop,#modalRemote,#modalDiag,#modalRouteDiag,#modalTokenManager,#networkCreateModal
  ){
    background:rgba(15,23,42,.42)!important;
    backdrop-filter:blur(10px)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) :where(
    #modalBackdrop .card,#modalRemote .card,#modalDiag .card,#modalRouteDiag .card,#modalTokenManager .card,
    #networkCreateModal > div,.modal-content,.modal-card
  ){
    background:linear-gradient(180deg,#ffffff,#f8fafc)!important;
    border-color:var(--it-p15-border-strong)!important;
    color:var(--it-p15-text)!important;
    box-shadow:0 34px 90px rgba(15,23,42,.24), inset 0 1px 0 rgba(255,255,255,.88)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) :where(
    .btn-primary,.network-clean-primary,.login-submit,.it-top-choice-btn.active
  ){
    background:linear-gradient(135deg,#1d4ed8,#60a5fa)!important;
    color:#ffffff!important;
    border-color:transparent!important;
    box-shadow:0 14px 30px rgba(29,78,216,.18)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) :where(
    .action-btn,.toolbar-btn,.login-secondary,.tab-btn,.btn-secondary,.it-btn-ghost,.it-link-btn,.net-back-btn,
    #networkCreateModal button:not(#networkCreateSubmitBtn)
  ){
    background:linear-gradient(180deg,#ffffff,#f1f5f9)!important;
    border-color:var(--it-p15-border)!important;
    color:var(--it-p15-text)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) :where(
    .action-btn:hover,.toolbar-btn:hover,.login-secondary:hover,.tab-btn:hover,.btn-secondary:hover,.it-btn-ghost:hover,.it-link-btn:hover,.net-back-btn:hover
  ){
    background:linear-gradient(180deg,#fffaf0,#eff6ff)!important;
    border-color:rgba(183,121,31,.34)!important;
    color:var(--it-p15-text-strong)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) :where(
    .terminal-text,.ai-feed-line,.quick-client-output,.qr-download-panel,.network-bundle-preview,
    .ai-terminal-box,.ai-terminal-shell,pre,code
  ){
    background:linear-gradient(180deg,#f8fafc,#eef3f8)!important;
    color:#0f172a!important;
    border-color:var(--it-p15-border)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) :where(
    .text-emerald-300,.text-emerald-400,.text-green-300,.text-green-400,.text-green-500\/70
  ){
    color:#047857!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) :where(
    .text-red-300,.text-red-400,.text-red-500,.text-rose-300,.text-rose-400,.text-red-500\/70
  ){
    color:#b91c1c!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) :where(
    .text-amber-300,.text-amber-400,.text-yellow-300,.text-yellow-400,.text-yellow-500,.text-yellow-500\/70
  ){
    color:#92400e!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) :where(
    .text-blue-300,.text-blue-400,.text-sky-300,.text-sky-400,.text-cyan-300,.text-cyan-400
  ){
    color:#1d4ed8!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) :where(
    .text-indigo-300,.text-indigo-400,.text-purple-300,.text-purple-400,.text-violet-300,.text-violet-400,.text-fuchsia-300
  ){
    color:#6d28d9!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) :where(
    .badge,.role-badge,.status-badge,.metric-chip,.managed-pill,.route-status-badge,.device-status-label-v127
  ){
    background:#f8fafc!important;
    border-color:var(--it-p15-border)!important;
    color:var(--it-p15-text)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.82)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) .toast{
    border-color:rgba(15,23,42,.14)!important;
    box-shadow:0 18px 45px rgba(15,23,42,.18)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) .toast.ok{background:#047857!important;color:#ffffff!important;}
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) .toast.err{background:#b91c1c!important;color:#ffffff!important;}
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) .toast.warn{background:#d97706!important;color:#111827!important;}
}
/* V171_PHASE15_DESKTOP_LIGHT_FULL_VISUAL_QA_FIX_END */



/* V171_PHASE16_DESKTOP_LIGHT_SIDEBAR_DASHBOARD_FIX_START
   Targeted desktop-only light theme fix requested after Phase 15.
   Scope: open sidebar visibility/scrolling and dashboard contrast in desktop light theme only.
   Dark theme, app.js and all mobile assets remain unchanged. */
@media (min-width: 901px){
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .app-sidebar{
    display:flex!important;
    visibility:visible!important;
    opacity:1!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    max-height:calc(100vh - 32px)!important;
    scrollbar-width:thin;
    scrollbar-color:rgba(183,121,31,.48) rgba(226,232,240,.72);
    background:
      radial-gradient(circle at 50% 0%, rgba(183,121,31,.10), transparent 30%),
      linear-gradient(180deg, rgba(255,255,255,.99) 0%, rgba(247,250,253,.97) 54%, rgba(234,241,249,.98) 100%)!important;
    border-color:rgba(100,116,139,.34)!important;
    color:#0f172a!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .app-sidebar::-webkit-scrollbar{width:8px;}
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .app-sidebar::-webkit-scrollbar-track{background:rgba(226,232,240,.72);border-radius:999px;}
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .app-sidebar::-webkit-scrollbar-thumb{background:rgba(183,121,31,.48);border-radius:999px;}
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-top,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-brand-card,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-user-card,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-nav-wrap,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-nav,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-logout{
    visibility:visible!important;
    opacity:1!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-top{flex:0 0 auto!important;}
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-nav-wrap{display:flex!important;flex:1 1 auto!important;min-height:0!important;overflow:visible!important;}
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-nav{display:flex!important;flex-direction:column!important;gap:10px!important;min-height:auto!important;overflow:visible!important;}
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-logout{display:flex!important;align-items:center!important;justify-content:center!important;flex:0 0 auto!important;margin-top:10px!important;min-height:52px!important;}
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-brand-card,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-user-card{
    overflow:visible!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-brand h1,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-brand .text-white,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .nav-btn-copy strong,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-user-name,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-mini-tile strong,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-status-card strong{
    color:#020617!important;
    opacity:1!important;
    text-shadow:none!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-tagline,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-blurb,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-user-label,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-section-title,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .nav-btn-copy small,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-mini-tile span,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-status-card span{
    color:#334155!important;
    opacity:1!important;
    text-shadow:none!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-nav .nav-btn{
    min-height:60px!important;
    padding:12px 14px!important;
    background:linear-gradient(180deg,#ffffff,#f5f8fc)!important;
    border-color:rgba(100,116,139,.28)!important;
    color:#0f172a!important;
    z-index:1!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-nav .nav-btn:hover,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-nav .nav-btn:focus-visible{
    background:linear-gradient(180deg,#fffaf0,#eff6ff)!important;
    border-color:rgba(183,121,31,.44)!important;
    outline:none!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .sidebar-nav .nav-btn.active{
    background:linear-gradient(135deg,#fff6dd,#eaf2ff)!important;
    border-color:rgba(183,121,31,.54)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .nav-btn-icon{
    color:#7c4a0c!important;
    background:linear-gradient(180deg,#fff7e6,#eaf2ff)!important;
    border-color:rgba(183,121,31,.30)!important;
    opacity:1!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell #meRoleBadge,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell .role-badge{
    background:#eef6ff!important;
    border-color:rgba(37,99,235,.24)!important;
    color:#1d4ed8!important;
    opacity:1!important;
  }

  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #view-dashboard.dashboard-grid-tight{
    color:#0f172a!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #view-dashboard :where(.dashboard-toolbar,.card,.compact-card,.ping-card,.chart-shell,.ai-terminal-box,.ai-terminal-shell,.ai-live-feed,.ping-result-box){
    background:linear-gradient(180deg,#ffffff,#f8fafc)!important;
    border-color:rgba(100,116,139,.22)!important;
    color:#0f172a!important;
    box-shadow:0 16px 38px rgba(15,23,42,.09), inset 0 1px 0 rgba(255,255,255,.88)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #view-dashboard .dashboard-toolbar{
    background:linear-gradient(135deg,#ffffff,#f3f7fb)!important;
    border-color:rgba(183,121,31,.22)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #view-dashboard :where(.panel-title,h2,h3,.text-white,#statTotal,#aiPercent){
    color:#020617!important;
    opacity:1!important;
    text-shadow:none!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #view-dashboard :where(.text-slate-400,.text-slate-500,.terminal-text,.terminal-text div,.app-footer){
    color:#334155!important;
    opacity:1!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #view-dashboard :where(.text-green-400,.text-green-500\/70){color:#047857!important;opacity:1!important;}
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #view-dashboard :where(.text-yellow-500,.text-yellow-500\/70,.text-amber-400){color:#92400e!important;opacity:1!important;}
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #view-dashboard :where(.text-red-500,.text-red-500\/70,.text-red-400){color:#b91c1c!important;opacity:1!important;}
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #view-dashboard :where(.text-blue-400,.text-indigo-400,.text-purple-400,.text-fuchsia-300){color:#1d4ed8!important;opacity:1!important;}
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #view-dashboard .ai-circle{
    background:conic-gradient(#1d4ed8 var(--p), rgba(148,163,184,.28) 0)!important;
    box-shadow:0 12px 30px rgba(15,23,42,.10)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #view-dashboard .ai-inner{
    background:#ffffff!important;
    border-color:rgba(100,116,139,.20)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #view-dashboard .dashboard-toolbar-actions .action-btn,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #view-dashboard .toolbar-btn{
    background:linear-gradient(180deg,#ffffff,#f1f5f9)!important;
    border-color:rgba(100,116,139,.22)!important;
    color:#0f172a!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #view-dashboard .dashboard-toolbar-actions .action-btn:hover,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #view-dashboard .toolbar-btn:hover{
    background:linear-gradient(180deg,#fffaf0,#eff6ff)!important;
    border-color:rgba(183,121,31,.34)!important;
  }
}
/* V171_PHASE16_DESKTOP_LIGHT_SIDEBAR_DASHBOARD_FIX_END */

/* V175_DESIGN_STABILITY_FIXES_START
   Fixes only: light sidebar contrast, collapsed tooltip layer, mobile overflow,
   loading shell stability, and device table visual resilience. Desktop layout is preserved. */
html[data-it-top-v174-boot="1"] body::before,
html[data-it-top-auth-boot="1"] body::before{letter-spacing:0!important}
#appView{isolation:isolate;}
#appView .app-sidebar{z-index:40;overflow:visible!important;}
#appView .sidebar-nav-wrap,
#appView .sidebar-nav{overflow:visible!important;}
#appView.sidebar-collapsed .sidebar-nav .nav-btn,
#appView[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn{position:relative;overflow:visible!important;}
#appView.sidebar-collapsed .sidebar-nav .nav-btn::after,
#appView[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn::after{
    content:attr(data-mini-title);position:absolute;right:calc(100% + 12px);top:50%;transform:translateY(-50%);
    z-index:9999;min-width:150px;max-width:240px;white-space:nowrap;text-align:right;pointer-events:none;opacity:0;
    padding:10px 12px;border-radius:14px;background:#0f172a;color:#f8fafc;border:1px solid rgba(250,204,21,.30);
    box-shadow:0 18px 40px rgba(2,6,23,.35);font-size:12px;font-weight:900;transition:opacity .14s ease, transform .14s ease;
}
#appView.sidebar-collapsed .sidebar-nav .nav-btn:hover::after,
#appView[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn:hover::after{opacity:1;transform:translate(-4px,-50%);}
body[data-it-theme="light"] .app-sidebar,
html[data-it-theme="light"] .app-sidebar{background:linear-gradient(180deg,#fffaf0,#f4ead7)!important;border-color:rgba(146,101,37,.24)!important;color:#1f2937!important;}
body[data-it-theme="light"] .sidebar-brand-card,
body[data-it-theme="light"] .sidebar-user-card,
html[data-it-theme="light"] .sidebar-brand-card,
html[data-it-theme="light"] .sidebar-user-card{background:rgba(255,255,255,.78)!important;border-color:rgba(146,101,37,.18)!important;}
body[data-it-theme="light"] .sidebar-brand-copy h1,
body[data-it-theme="light"] .sidebar-user-name,
body[data-it-theme="light"] .sidebar-mini-tile strong,
body[data-it-theme="light"] .sidebar-status-card strong,
html[data-it-theme="light"] .sidebar-brand-copy h1,
html[data-it-theme="light"] .sidebar-user-name,
html[data-it-theme="light"] .sidebar-mini-tile strong,
html[data-it-theme="light"] .sidebar-status-card strong{color:#1f2937!important;}
body[data-it-theme="light"] .sidebar-tagline,
body[data-it-theme="light"] .sidebar-section-title,
body[data-it-theme="light"] .sidebar-user-label,
body[data-it-theme="light"] .sidebar-mini-tile span,
html[data-it-theme="light"] .sidebar-tagline,
html[data-it-theme="light"] .sidebar-section-title,
html[data-it-theme="light"] .sidebar-user-label,
html[data-it-theme="light"] .sidebar-mini-tile span{color:#5b6472!important;}
body[data-it-theme="light"] .sidebar-nav .nav-btn,
html[data-it-theme="light"] .sidebar-nav .nav-btn{color:#243044!important;background:linear-gradient(180deg,rgba(255,255,255,.86),rgba(241,231,214,.70))!important;border-color:rgba(146,101,37,.15)!important;}
body[data-it-theme="light"] .sidebar-nav .nav-btn.active,
html[data-it-theme="light"] .sidebar-nav .nav-btn.active{background:linear-gradient(135deg,rgba(213,168,78,.28),rgba(255,255,255,.88))!important;border-color:rgba(146,101,37,.32)!important;color:#111827!important;}
body[data-it-theme="light"] .sidebar-nav .nav-btn:hover,
html[data-it-theme="light"] .sidebar-nav .nav-btn:hover{background:#fff!important;color:#111827!important;}
.device-virtual-viewport{position:relative;min-height:260px;contain:layout paint;}
.device-virtual-spacer{position:relative;width:100%;min-height:120px;}
.device-virtual-row{position:absolute;left:0;right:0;will-change:transform;}
#membersCardsArea:empty::before{content:"جاري تحميل الأجهزة...";display:block;text-align:center;padding:28px;color:#94a3b8;background:rgba(15,23,42,.28);border-radius:18px;border:1px solid rgba(148,163,184,.14);}
@media(max-width:760px){
    #appView{overflow-x:hidden;}
    .section-shell,.card,.compact-card{max-width:100%;}
    .device-row-pro,.device-card{max-width:100%;}
    #appView.sidebar-collapsed .sidebar-nav .nav-btn::after,
    #appView[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn::after{display:none!important;}
}
/* V175_DESIGN_STABILITY_FIXES_END */

/* V186_LIGHT_OPEN_SIDEBAR_LOGOUT_VISIBILITY_FIX_START
   Fix only: in desktop light theme, when sidebar is open, the logout button must remain visible.
   V175 tooltip/mobile overflow rules forced overflow:visible on the sidebar, which could push the
   logout button below the viewport in the open light sidebar. This restores internal sidebar scroll
   and pins the logout button at the bottom of the open sidebar without changing desktop layout. */
@media (min-width: 901px){
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .app-sidebar{
    display:flex!important;
    flex-direction:column!important;
    min-height:calc(100vh - 32px)!important;
    max-height:calc(100vh - 32px)!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    padding-bottom:14px!important;
    scrollbar-width:thin!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-nav-wrap{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow:visible!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-logout{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    flex:0 0 52px!important;
    min-height:52px!important;
    margin-top:12px!important;
    position:sticky!important;
    bottom:0!important;
    z-index:60!important;
    background:linear-gradient(180deg,#fff1f2,#ffe4e6)!important;
    color:#be123c!important;
    border:1px solid #fda4af!important;
    box-shadow:0 -8px 22px rgba(255,255,255,.92), 0 12px 26px rgba(190,18,60,.12)!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-logout:hover,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-logout:focus-visible{
    background:linear-gradient(180deg,#ffe4e6,#fecdd3)!important;
    color:#9f1239!important;
    border-color:#fb7185!important;
    outline:none!important;
  }
}
/* V186_LIGHT_OPEN_SIDEBAR_LOGOUT_VISIBILITY_FIX_END */

/* V187_LIGHT_OPEN_SIDEBAR_COMPLETE_VISIBILITY_FIX_START
   Incremental CSS-only safety patch. Keeps the existing desktop design, but makes the open sidebar
   readable and reachable in light theme: nav labels, user cards, status cards, section title,
   and logout action remain visible. Also keeps collapsed tooltips above the page content. */
@media (min-width: 901px){
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .app-sidebar{
    background:linear-gradient(180deg,#ffffff 0%,#f3f7fb 100%)!important;
    border-color:#dbe7f3!important;
    color:#0f172a!important;
    isolation:isolate!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-brand-card,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-user-card,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-mini-tile,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-status-card{
    background:#ffffff!important;
    border-color:#dbe7f3!important;
    color:#0f172a!important;
    box-shadow:0 10px 26px rgba(15,23,42,.06)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-user-name,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-mini-tile strong,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-status-card strong,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-nav .nav-btn .nav-btn-copy strong{
    color:#0f172a!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-tagline,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-blurb,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-mini-tile span,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-status-card span,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-section-title{
    color:#475569!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-nav .nav-btn{
    background:#ffffff!important;
    border-color:#dbe7f3!important;
    color:#0f172a!important;
    opacity:1!important;
    visibility:visible!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-nav .nav-btn .nav-btn-icon{
    background:#172238!important;
    color:#ffffff!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-nav .nav-btn.active,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-nav .nav-btn:hover{
    background:linear-gradient(135deg,#2563eb,#4f46e5)!important;
    border-color:#2563eb!important;
    color:#ffffff!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-nav .nav-btn.active *,
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-nav .nav-btn:hover *{
    color:#ffffff!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-user-action{
    background:#eff6ff!important;
    color:#1d4ed8!important;
    border-color:#bfdbfe!important;
  }
}
#appView.app-shell.sidebar-collapsed .sidebar-nav .nav-btn::after,
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn::after{
  z-index:2147482000!important;
  pointer-events:none!important;
}
/* V187_LIGHT_OPEN_SIDEBAR_COMPLETE_VISIBILITY_FIX_END */

/* V188_LIGHT_OPEN_SIDEBAR_ACTIVE_TEXT_FIX_START
   CSS-only patch after visual QA: in light theme/open sidebar, active blue navigation buttons
   were readable only by background while their labels inherited a dark text paint from older layers.
   Force label paint/fill to white for every active/current pressed sidebar nav item without touching
   dark theme, desktop layout, JavaScript, database or backend logic. */
@media (min-width: 901px){
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-nav :where(
    .nav-btn.active,
    .nav-btn.is-active,
    .nav-btn[aria-current="page"],
    .nav-btn[data-active="1"]
  ){
    background:linear-gradient(135deg,#2563eb 0%,#4f46e5 100%)!important;
    border-color:#2563eb!important;
    color:#ffffff!important;
    text-shadow:0 1px 1px rgba(15,23,42,.22)!important;
    -webkit-text-fill-color:#ffffff!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-nav :where(
    .nav-btn.active,
    .nav-btn.is-active,
    .nav-btn[aria-current="page"],
    .nav-btn[data-active="1"]
  ) :where(span,strong,small,p,div,label,b,i,em,svg,path){
    color:#ffffff!important;
    -webkit-text-fill-color:#ffffff!important;
    fill:currentColor!important;
    stroke:currentColor!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-nav :where(
    .nav-btn.active,
    .nav-btn.is-active,
    .nav-btn[aria-current="page"],
    .nav-btn[data-active="1"]
  ) .nav-btn-icon{
    background:rgba(15,23,42,.88)!important;
    color:#ffffff!important;
    -webkit-text-fill-color:#ffffff!important;
    border-color:rgba(255,255,255,.28)!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-nav :where(
    .nav-btn.active,
    .nav-btn.is-active,
    .nav-btn[aria-current="page"],
    .nav-btn[data-active="1"]
  )::before{
    opacity:.22!important;
  }
}
/* V188_LIGHT_OPEN_SIDEBAR_ACTIVE_TEXT_FIX_END */

/* V189_LIGHT_SIDEBAR_LOGOUT_LAST_FIX_START
   CSS-only patch: keep Logout as the final sidebar action in the open light sidebar.
   Removes the sticky overlay behavior that could make Logout appear in the middle of navigation,
   and forces safe ordering if the button is rendered inside either the sidebar or nav flex containers. */
@media (min-width: 901px){
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .app-sidebar{
    display:flex!important;
    flex-direction:column!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-top{
    order:10!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-nav-wrap{
    order:20!important;
    flex:0 0 auto!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-nav{
    display:flex!important;
    flex-direction:column!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) #navDashboardBtn{order:10!important;}
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) #navNetworksBtn{order:20!important;}
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) #navBackupBtn{order:30!important;}
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) #navSuperadminBtn{order:40!important;}
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) #navAiBtn{order:50!important;}
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-logout{
    order:9999!important;
    position:static!important;
    inset:auto!important;
    bottom:auto!important;
    top:auto!important;
    transform:none!important;
    width:100%!important;
    flex:0 0 auto!important;
    margin-top:12px!important;
    margin-bottom:0!important;
    z-index:auto!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-nav .sidebar-logout{
    order:9999!important;
  }
  :where(html[data-it-theme="light"], body[data-it-theme="light"]) #appView.app-shell:not(.sidebar-collapsed):not([data-sidebar-collapsed="1"]) .sidebar-footnote{
    order:10000!important;
  }
}
/* V189_LIGHT_SIDEBAR_LOGOUT_LAST_FIX_END */

/* V190_SETTINGS_PERMISSIONS_PAGE_REVIEW */
.admin-create-live-hint{display:inline-flex;align-items:center;justify-content:flex-start;gap:8px;border-radius:14px;padding:9px 12px;font-size:12px;font-weight:900;border:1px solid rgba(148,163,184,.16);background:rgba(15,23,42,.52);color:#cbd5e1;line-height:1.6;}
.admin-create-live-hint.ok{border-color:rgba(34,197,94,.28);background:rgba(34,197,94,.10);color:#bbf7d0;}
.admin-create-live-hint.warn{border-color:rgba(245,158,11,.24);background:rgba(245,158,11,.10);color:#fde68a;}
.permission-matrix-wrap{border:1px solid rgba(59,130,246,.16);background:linear-gradient(180deg,rgba(15,23,42,.78),rgba(2,6,23,.88));border-radius:22px;padding:16px;margin-top:14px;box-shadow:0 16px 38px rgba(2,8,20,.22);}
.permission-matrix-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px;}
.permission-matrix-head span{display:block;color:#93c5fd;font-size:10px;font-weight:1000;letter-spacing:.08em;text-transform:uppercase;margin-bottom:4px;}
.permission-matrix-head strong{display:block;color:#f8fafc;font-size:15px;font-weight:1000;}
.permission-matrix-head small{display:inline-flex;align-items:center;border-radius:999px;padding:6px 10px;background:rgba(245,158,11,.10);border:1px solid rgba(245,158,11,.22);color:#fcd34d;font-weight:1000;}
.permission-matrix-scroll{overflow:auto;border-radius:16px;border:1px solid rgba(148,163,184,.10);}
.permission-matrix{width:100%;min-width:720px;border-collapse:collapse;background:rgba(2,6,23,.44);}
.permission-matrix th,.permission-matrix td{padding:10px 12px;border-bottom:1px solid rgba(148,163,184,.08);text-align:center;font-size:12px;font-weight:900;color:#cbd5e1;}
.permission-matrix th:first-child,.permission-matrix td:first-child{text-align:right;color:#e2e8f0;min-width:210px;}
.permission-matrix th.selected,.permission-matrix td.selected{background:rgba(59,130,246,.13);}
.permission-matrix td.ok{color:#86efac;}
.permission-matrix td.no{color:#64748b;}
.admin-list-toolbar{display:grid;grid-template-columns:minmax(180px,1fr) minmax(220px,1.4fr) minmax(150px,.8fr) minmax(150px,.8fr) minmax(150px,.8fr) auto;gap:10px;align-items:center;border:1px solid rgba(148,163,184,.12);background:rgba(2,6,23,.52);border-radius:20px;padding:12px;}
.admin-toolbar-title{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;color:#f8fafc;font-weight:1000;}
.admin-toolbar-title span{display:inline-flex;border-radius:999px;background:rgba(59,130,246,.10);border:1px solid rgba(59,130,246,.22);color:#93c5fd;padding:5px 9px;font-size:11px;font-weight:1000;}
.admin-clear-btn{border:1px solid rgba(148,163,184,.18);background:rgba(15,23,42,.68);color:#e2e8f0;border-radius:13px;padding:10px 14px;font-weight:1000;font-size:12px;transition:.18s ease;}
.admin-clear-btn:hover{background:rgba(59,130,246,.12);border-color:rgba(59,130,246,.28);color:#fff;}
.admin-mini-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:12px 0;}
.admin-mini-stats>div{border:1px solid rgba(148,163,184,.10);background:rgba(15,23,42,.48);border-radius:14px;padding:10px;min-height:64px;display:flex;flex-direction:column;gap:5px;}
.admin-mini-stats span{font-size:10px;font-weight:900;color:#94a3b8;}
.admin-mini-stats strong{font-size:12px;font-weight:1000;color:#f8fafc;word-break:break-word;line-height:1.55;}
.admin-status-chip{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:4px 8px;font-size:10px;font-weight:1000;border:1px solid rgba(148,163,184,.18);background:rgba(148,163,184,.08);color:#e2e8f0;}
.admin-status-active{background:rgba(34,197,94,.10);border-color:rgba(34,197,94,.24);color:#86efac;}
.admin-status-trial{background:rgba(245,158,11,.10);border-color:rgba(245,158,11,.24);color:#fcd34d;}
.admin-status-locked,.admin-status-disabled,.admin-status-expired{background:rgba(244,63,94,.10);border-color:rgba(244,63,94,.24);color:#fecdd3;}
.admin-card-disabled,.admin-card-expired{opacity:.78;}
.admin-state-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;}
.admin-action-unlock{background:rgba(245,158,11,.12);color:#fcd34d;border:1px solid rgba(245,158,11,.24);}
.admin-action-unlock:hover{background:#d97706;color:#fff;}
body[data-it-theme="light"] .permission-matrix-wrap,
body[data-it-theme="light"] .admin-list-toolbar,
body[data-it-theme="light"] .admin-mini-stats>div{background:rgba(255,255,255,.88);border-color:rgba(59,130,246,.16);box-shadow:0 12px 28px rgba(15,23,42,.08);}
body[data-it-theme="light"] .permission-matrix{background:rgba(248,250,252,.88);}
body[data-it-theme="light"] .permission-matrix th,
body[data-it-theme="light"] .permission-matrix td,
body[data-it-theme="light"] .permission-matrix th:first-child,
body[data-it-theme="light"] .permission-matrix td:first-child,
body[data-it-theme="light"] .admin-toolbar-title,
body[data-it-theme="light"] .admin-mini-stats strong{color:#0f172a;}
body[data-it-theme="light"] .admin-clear-btn{background:#fff;color:#0f172a;border-color:rgba(148,163,184,.35);}
body[data-it-theme="light"] .admin-create-live-hint.warn{color:#92400e;background:#fff7ed;}
body[data-it-theme="light"] .admin-create-live-hint.ok{color:#166534;background:#f0fdf4;}
@media (max-width:1279px){.admin-list-toolbar{grid-template-columns:1fr 1fr;}.admin-mini-stats{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:768px){.admin-list-toolbar,.admin-mini-stats{grid-template-columns:1fr;}.permission-matrix-wrap{padding:12px;}.permission-matrix{min-width:640px;}}

/* V192_TRIAL_OPERATIONAL_SCOPE_FIX_START */
body[data-it-top-trial="1"] #navBackupBtn,
body[data-it-top-trial="1"] #navSuperadminBtn,
body[data-it-top-trial="1"] [data-mobile-tab="backup"],
body[data-it-top-trial="1"] [data-mobile-tab="superadmin"] {
  display: none !important;
}
/* V192_TRIAL_OPERATIONAL_SCOPE_FIX_END */

/* V196_MIKROTIK_SCREEN_REAL_FIX_START
   Fixes actual MikroTik route screen problems: backend public key crash is fixed in Python;
   this CSS makes the routing/MikroTik screen readable and prevents fields/scripts from
   collapsing or overlapping on desktop. */
#net-tab-routes.mikrotik-routes-screen-v196{display:block;max-width:100%;overflow:visible;}
#net-tab-routes.mikrotik-routes-screen-v196.hidden{display:none!important;}
#net-tab-routes .routing-add-card-v196,
#net-tab-routes .mikrotik-card-v196,
#net-tab-routes .routes-table-card-v196{overflow:visible!important;position:relative;}
.routing-card-head-v196,
.mikrotik-card-head-v196{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:16px;flex-wrap:wrap;}
.routing-help-v196,
.mikrotik-help-v196{margin:6px 0 0;color:#93a4bb;font-size:12px;font-weight:800;line-height:1.8;}
.routing-form-grid-v196{display:grid;grid-template-columns:minmax(180px,1.1fr) minmax(160px,.9fr) minmax(150px,.85fr) minmax(170px,1fr);gap:12px;align-items:end;}
.route-field-v196 label,
.mikrotik-field-v196 label{display:block;margin-bottom:6px;color:#a7bad4;font-size:11px;font-weight:1000;letter-spacing:.02em;}
.route-field-v196 input,
.mikrotik-field-v196 input,
.mikrotik-field-v196 textarea{min-height:46px!important;border-radius:14px!important;}
.route-field-v196 input[dir="ltr"],
.mikrotik-field-v196 input[dir="ltr"],
.mikrotik-field-v196 textarea[dir="ltr"],
.mikrotik-script-textarea-v196{direction:ltr!important;text-align:left!important;unicode-bidi:plaintext!important;}
.route-add-main-btn-v196,
.mikrotik-add-main-btn-v196{min-width:150px!important;min-height:46px!important;border-radius:15px!important;}
.mikrotik-layout-v196{display:grid;grid-template-columns:minmax(320px,.82fr) minmax(420px,1fr);gap:16px;align-items:start;}
.mikrotik-form-panel-v196,
.mikrotik-output-panel-v196{border:1px solid rgba(148,163,184,.12);background:rgba(2,6,23,.22);border-radius:20px;padding:14px;min-width:0;}
.mikrotik-form-grid-v196{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;}
.mikrotik-field-wide-v196{grid-column:1/-1;}
.mikrotik-field-v196 small{display:block;margin-top:5px;color:#64748b;font-size:11px;font-weight:800;line-height:1.6;}
.mikrotik-field-v196 label span{color:#6ee7b7;font-size:10px;background:rgba(16,185,129,.13);border:1px solid rgba(16,185,129,.18);padding:2px 7px;border-radius:999px;margin-inline-start:5px;}
#mtRoutes{min-height:88px!important;max-height:160px!important;resize:vertical;}
.mikrotik-output-head-v196{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;}
.mikrotik-output-head-v196 strong{display:block;color:#d1fae5;font-size:14px;font-weight:1000;}
.mikrotik-output-head-v196 small{display:block;color:#7f91aa;font-size:11px;font-weight:800;margin-top:3px;}
.mikrotik-copy-btn-v196{border:1px solid rgba(16,185,129,.24);background:rgba(16,185,129,.12);color:#a7f3d0;border-radius:13px;min-height:40px;padding:0 14px;font-weight:1000;white-space:nowrap;}
.mikrotik-copy-btn-v196:hover{background:rgba(16,185,129,.22);color:#fff;}
.mikrotik-script-textarea-v196{min-height:300px!important;max-height:420px!important;overflow:auto!important;font-size:11px!important;line-height:1.75!important;white-space:pre!important;resize:vertical!important;background:#071123!important;}
.mikrotik-status-v196{margin-top:8px;color:#8ea5c4;background:rgba(15,23,42,.54);border:1px solid rgba(148,163,184,.10);border-radius:13px;padding:9px 11px;font-size:11px;font-weight:800;line-height:1.7;}
.mikrotik-bulk-v196{margin-top:14px;border:1px solid rgba(148,163,184,.12);border-radius:18px;background:rgba(15,23,42,.24);overflow:hidden;}
.mikrotik-bulk-v196 summary{cursor:pointer;padding:12px 14px;color:#c4d4e9;font-size:12px;font-weight:1000;}
.mikrotik-bulk-grid-v196{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;padding:0 14px 14px;align-items:end;}
.mikrotik-bulk-grid-v196 textarea{min-height:96px!important;direction:ltr!important;text-align:left!important;}
.mikrotik-bulk-actions-v196{display:flex;gap:8px;flex-wrap:wrap;}
#routeScreenToolbar{margin-top:4px!important;}
body[data-it-theme="light"] .mikrotik-form-panel-v196,
body[data-it-theme="light"] .mikrotik-output-panel-v196,
body[data-it-theme="light"] .mikrotik-bulk-v196{background:#f8fbff!important;border-color:rgba(89,111,140,.20)!important;}
body[data-it-theme="light"] .routing-help-v196,
body[data-it-theme="light"] .mikrotik-help-v196,
body[data-it-theme="light"] .mikrotik-field-v196 small,
body[data-it-theme="light"] .mikrotik-output-head-v196 small{color:#53667f!important;}
body[data-it-theme="light"] .mikrotik-output-head-v196 strong{color:#047857!important;}
body[data-it-theme="light"] .mikrotik-script-textarea-v196{background:#ffffff!important;color:#0f172a!important;}
body[data-it-theme="light"] .mikrotik-status-v196{background:#eef5fd!important;color:#334155!important;border-color:rgba(89,111,140,.18)!important;}
@media(max-width:1280px){
  .mikrotik-layout-v196{grid-template-columns:1fr!important;}
  .routing-form-grid-v196{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media(max-width:760px){
  .routing-card-head-v196,.mikrotik-card-head-v196{display:grid!important;grid-template-columns:1fr!important;}
  .routing-form-grid-v196,.mikrotik-form-grid-v196,.mikrotik-bulk-grid-v196{grid-template-columns:1fr!important;}
  .route-add-main-btn-v196,.mikrotik-add-main-btn-v196{width:100%!important;}
  .mikrotik-script-textarea-v196{min-height:240px!important;}
}
/* V196_MIKROTIK_SCREEN_REAL_FIX_END */


/* V238 MikroTik linking screen visual upgrade only - no linking logic changes */
.mikrotik-pro-card-v238{position:relative;overflow:hidden!important;border-color:rgba(16,185,129,.26)!important;background:linear-gradient(135deg,rgba(6,78,59,.20),rgba(15,23,42,.78) 46%,rgba(2,6,23,.92))!important;box-shadow:0 22px 65px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.04)!important;}
.mikrotik-pro-card-v238:before{content:"";position:absolute;inset:-120px auto auto -120px;width:260px;height:260px;background:radial-gradient(circle,rgba(16,185,129,.28),transparent 65%);pointer-events:none;}
.mikrotik-hero-v238{position:relative;display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:18px;padding:16px;border:1px solid rgba(16,185,129,.16);border-radius:22px;background:rgba(2,6,23,.30);}
.mikrotik-hero-main-v238{min-width:0;flex:1;}
.mikrotik-help-pro-v238{max-width:780px;color:#b7c9de!important;font-size:13px!important;}
.mikrotik-hero-action-v238{display:flex;flex-direction:column;align-items:stretch;gap:10px;min-width:188px;}
.mikrotik-safe-badge-v238{display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(110,231,183,.24);background:rgba(16,185,129,.13);color:#a7f3d0;border-radius:999px;padding:7px 11px;font-size:11px;font-weight:1000;white-space:nowrap;}
.mikrotik-step-strip-v238{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:13px;}
.mikrotik-step-v238{border:1px solid rgba(148,163,184,.13);background:rgba(15,23,42,.42);border-radius:17px;padding:10px 11px;display:grid;grid-template-columns:30px 1fr;column-gap:9px;align-items:center;min-width:0;}
.mikrotik-step-v238 span{grid-row:1/3;width:30px;height:30px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:rgba(16,185,129,.16);border:1px solid rgba(16,185,129,.28);color:#a7f3d0;font-size:12px;font-weight:1000;}
.mikrotik-step-v238 strong{color:#eefdf7;font-size:12px;font-weight:1000;line-height:1.3;}
.mikrotik-step-v238 small{color:#7f95ad;font-size:10.5px;font-weight:800;line-height:1.5;}
.mikrotik-layout-pro-v238{grid-template-columns:minmax(360px,.92fr) minmax(440px,1.08fr)!important;gap:18px!important;}
.mikrotik-form-panel-pro-v238,.mikrotik-output-panel-pro-v238{background:rgba(3,10,24,.54)!important;border-color:rgba(148,163,184,.16)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;}
.mikrotik-panel-title-v238{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid rgba(148,163,184,.12);}
.mikrotik-panel-title-v238 strong{display:block;color:#d1fae5;font-size:14px;font-weight:1000;}
.mikrotik-panel-title-v238 small{display:block;margin-top:4px;color:#7f91aa;font-size:11px;font-weight:800;line-height:1.7;}
.mikrotik-panel-title-v238 span{border:1px solid rgba(59,130,246,.20);background:rgba(59,130,246,.10);color:#bfdbfe;border-radius:999px;padding:5px 9px;font-size:10px;font-weight:1000;white-space:nowrap;}
.mikrotik-form-grid-pro-v238{gap:14px!important;}
.mikrotik-field-required-v238 input{border-color:rgba(16,185,129,.30)!important;box-shadow:0 0 0 1px rgba(16,185,129,.08)!important;}
.mikrotik-publickey-field-v238 input{border-color:rgba(245,158,11,.20)!important;}
.mikrotik-soft-note-v238{display:flex;align-items:flex-start;gap:9px;margin-top:14px;border:1px solid rgba(16,185,129,.18);background:rgba(6,78,59,.18);border-radius:16px;padding:10px 12px;color:#bdd8cc;font-size:11px;font-weight:900;line-height:1.8;}
.mikrotik-soft-note-v238 i{color:#6ee7b7;margin-top:4px;}
.mikrotik-add-main-btn-v238{font-size:13px!important;box-shadow:0 12px 26px rgba(16,185,129,.20)!important;}
.mikrotik-output-head-pro-v238{padding-bottom:12px;border-bottom:1px solid rgba(148,163,184,.12);}
.mikrotik-copy-btn-v238{min-height:42px!important;background:rgba(16,185,129,.16)!important;}
.mikrotik-script-shell-v238{border:1px solid rgba(148,163,184,.14);border-radius:18px;overflow:hidden;background:#06101f;box-shadow:inset 0 1px 0 rgba(255,255,255,.035);}
.mikrotik-script-topbar-v238{display:flex;align-items:center;gap:6px;height:34px;padding:0 12px;border-bottom:1px solid rgba(148,163,184,.12);background:rgba(15,23,42,.78);color:#8fa3bc;font-size:11px;font-weight:1000;}
.mikrotik-script-topbar-v238 span{width:9px;height:9px;border-radius:50%;background:rgba(148,163,184,.45);}
.mikrotik-script-topbar-v238 strong{margin-inline-start:auto;color:#cbd5e1;font-size:10px;letter-spacing:.03em;}
.mikrotik-script-textarea-v238{border:0!important;border-radius:0!important;background:#071123!important;min-height:318px!important;}
.mikrotik-status-pro-v238{border-color:rgba(16,185,129,.16)!important;background:rgba(6,78,59,.15)!important;color:#badbcf!important;}
.mikrotik-checks-v238{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:9px;}
.mikrotik-checks-v238 span{display:inline-flex;align-items:center;gap:6px;border:1px solid rgba(148,163,184,.12);background:rgba(15,23,42,.35);border-radius:999px;padding:6px 9px;color:#9fb2ca;font-size:10.5px;font-weight:1000;}
.mikrotik-checks-v238 i{color:#6ee7b7;}
body[data-it-theme="light"] .mikrotik-pro-card-v238{background:linear-gradient(135deg,#ecfdf5,#f8fbff 48%,#ffffff)!important;border-color:rgba(5,150,105,.22)!important;box-shadow:0 18px 55px rgba(15,23,42,.10)!important;}
body[data-it-theme="light"] .mikrotik-hero-v238,body[data-it-theme="light"] .mikrotik-form-panel-pro-v238,body[data-it-theme="light"] .mikrotik-output-panel-pro-v238{background:rgba(255,255,255,.84)!important;border-color:rgba(89,111,140,.16)!important;}
body[data-it-theme="light"] .mikrotik-step-v238{background:#ffffff!important;border-color:rgba(89,111,140,.14)!important;}
body[data-it-theme="light"] .mikrotik-step-v238 strong,body[data-it-theme="light"] .mikrotik-panel-title-v238 strong{color:#0f3f35!important;}
body[data-it-theme="light"] .mikrotik-step-v238 small,body[data-it-theme="light"] .mikrotik-panel-title-v238 small{color:#53667f!important;}
body[data-it-theme="light"] .mikrotik-soft-note-v238{background:#ecfdf5!important;border-color:rgba(5,150,105,.18)!important;color:#14532d!important;}
body[data-it-theme="light"] .mikrotik-script-shell-v238{background:#fff!important;border-color:rgba(89,111,140,.16)!important;}
body[data-it-theme="light"] .mikrotik-script-topbar-v238{background:#eef5fd!important;border-color:rgba(89,111,140,.12)!important;color:#475569!important;}
body[data-it-theme="light"] .mikrotik-status-pro-v238{background:#ecfdf5!important;color:#166534!important;border-color:rgba(5,150,105,.18)!important;}
body[data-it-theme="light"] .mikrotik-checks-v238 span{background:#ffffff!important;color:#475569!important;border-color:rgba(89,111,140,.14)!important;}
@media(max-width:1100px){.mikrotik-layout-pro-v238{grid-template-columns:1fr!important;}.mikrotik-step-strip-v238{grid-template-columns:1fr!important;}.mikrotik-hero-v238{display:grid!important;grid-template-columns:1fr!important;}.mikrotik-hero-action-v238{min-width:0;width:100%;}.mikrotik-add-main-btn-v238{width:100%!important;}}
@media(max-width:760px){.mikrotik-hero-v238{padding:12px!important;border-radius:18px!important;}.mikrotik-step-v238{padding:9px!important;}.mikrotik-form-panel-pro-v238,.mikrotik-output-panel-pro-v238{padding:12px!important;border-radius:18px!important;}.mikrotik-panel-title-v238{display:grid!important;grid-template-columns:1fr!important;}.mikrotik-script-textarea-v238{min-height:245px!important;font-size:10.5px!important;}.mikrotik-checks-v238 span{font-size:10px!important;}}

/* V238_MIKROTIK_DELETE_DEVICE_VISIBLE_FIX_START
   Keep the device deletion control visible even when MikroTik rows have many safe tools.
   UI-only: no API, invite, client or WireGuard logic changes. */
:where(#net-tab-devices,#view-devices) .row-actions.polished .row-btn.device-delete-action{
  background:linear-gradient(135deg,rgba(185,28,28,.34),rgba(127,29,29,.24))!important;
  border:1px solid rgba(248,113,113,.46)!important;
  color:#fecaca!important;
  box-shadow:0 8px 18px rgba(127,29,29,.16), inset 0 1px 0 rgba(255,255,255,.06)!important;
}
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .row-actions.polished .row-btn.device-delete-action{
  background:linear-gradient(135deg,#fee2e2,#fecaca)!important;
  border:1px solid rgba(185,28,28,.35)!important;
  color:#7f1d1d!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished.is-mikrotik-actions{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  align-content:start!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik{
  min-height:350px!important;
  overflow:visible!important;
}
@media (max-width:1260px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik{min-height:400px!important;}
}
@media (max-width:760px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik{min-height:520px!important;}
  :where(#net-tab-devices,#view-devices) .row-actions.polished.is-mikrotik-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media (max-width:420px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik{min-height:560px!important;}
}
/* V238_MIKROTIK_DELETE_DEVICE_VISIBLE_FIX_END */

/* V238_ROUTER_COMPACT_CARD_UI_START
   UI-only: shrink MikroTik router row and move rarely-used tools into one compact menu.
   No API, invitations, WireGuard logic, client devices, or normal device actions changed. */
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik{
  grid-template-columns:minmax(260px,1.15fr) minmax(220px,.78fr) minmax(210px,.76fr) minmax(310px,.82fr)!important;
  min-height:186px!important;
  padding:12px 14px!important;
  gap:12px!important;
  border-radius:20px!important;
  overflow:visible!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik .device-main,
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik .device-metric-list.refined,
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik .device-status-card.refined{
  min-height:auto!important;
  padding:10px!important;
  border-radius:16px!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik .device-subtitle{
  min-height:0!important;
  -webkit-line-clamp:1!important;
  font-size:11px!important;
  line-height:1.35!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik .device-subline{gap:5px!important;}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik .mini-tag{padding:4px 7px!important;font-size:10px!important;}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik .device-metric-line.metric-primary{margin-bottom:8px!important;}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik .managed-pill{min-height:38px!important;border-radius:14px!important;padding:8px 10px!important;}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik .managed-pill .mono{font-size:13px!important;}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik .device-metric-grid.compact{gap:7px!important;}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik .metric-chip{min-height:50px!important;padding:8px!important;border-radius:14px!important;}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik .metric-chip .metric-value{font-size:11.5px!important;}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik .device-status-top.refined{margin-bottom:8px!important;}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik .status-summary{font-size:12px!important;line-height:1.35!important;}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik .time-stack.compact.refined{gap:6px!important;}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik .time-stack.compact.refined span{min-height:32px!important;padding:7px 8px!important;border-radius:12px!important;font-size:11px!important;}
:where(#net-tab-devices,#view-devices) .row-actions.polished.is-mikrotik-actions.router-compact-actions{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:6px!important;
  align-content:center!important;
  align-items:center!important;
  overflow:visible!important;
  position:relative!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished.is-mikrotik-actions.router-compact-actions .row-btn{
  min-height:34px!important;
  height:34px!important;
  padding:6px 8px!important;
  border-radius:10px!important;
  font-size:10.5px!important;
  line-height:1!important;
  box-shadow:none!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished.is-mikrotik-actions.router-compact-actions .row-btn.ping-icon{
  font-size:13px!important;
  height:34px!important;
}
:where(#net-tab-devices,#view-devices) .router-tools-menu{
  position:relative!important;
  display:block!important;
  min-width:0!important;
}
:where(#net-tab-devices,#view-devices) .router-tools-menu > summary{
  list-style:none!important;
  user-select:none!important;
}
:where(#net-tab-devices,#view-devices) .router-tools-menu > summary::-webkit-details-marker{display:none!important;}
:where(#net-tab-devices,#view-devices) .router-tools-menu[open] > summary{
  background:rgba(14,165,233,.22)!important;
  color:#e0f7ff!important;
}
:where(#net-tab-devices,#view-devices) .router-tools-dropdown{
  position:absolute!important;
  top:calc(100% + 8px)!important;
  inset-inline-end:0!important;
  z-index:80!important;
  min-width:260px!important;
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:6px!important;
  padding:8px!important;
  border-radius:16px!important;
  background:linear-gradient(135deg,rgba(8,18,36,.98),rgba(9,30,50,.98))!important;
  border:1px solid rgba(56,189,248,.24)!important;
  box-shadow:0 22px 50px rgba(2,6,23,.42)!important;
}
:where(#net-tab-devices,#view-devices) .router-tools-dropdown .row-btn{
  min-height:32px!important;
  height:32px!important;
  font-size:10px!important;
  padding:5px 7px!important;
}
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .router-tools-dropdown{
  background:linear-gradient(135deg,#ffffff,#eef6ff)!important;
  border-color:rgba(59,130,246,.20)!important;
  box-shadow:0 18px 40px rgba(15,23,42,.18)!important;
}
@media (max-width:1260px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik{
    grid-template-columns:minmax(245px,1fr) minmax(220px,.9fr) minmax(220px,.9fr)!important;
    min-height:232px!important;
    padding:12px!important;
  }
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik .cell-actions{grid-column:1/-1!important;}
  :where(#net-tab-devices,#view-devices) .row-actions.polished.is-mikrotik-actions.router-compact-actions{grid-template-columns:repeat(6,minmax(0,1fr))!important;}
}
@media (max-width:760px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik{
    grid-template-columns:1fr!important;
    min-height:292px!important;
    padding:11px!important;
    gap:9px!important;
  }
  :where(#net-tab-devices,#view-devices) .row-actions.polished.is-mikrotik-actions.router-compact-actions{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
  :where(#net-tab-devices,#view-devices) .router-tools-dropdown{inset-inline:auto 0!important;min-width:min(300px,92vw)!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media (max-width:420px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik{min-height:322px!important;}
  :where(#net-tab-devices,#view-devices) .row-actions.polished.is-mikrotik-actions.router-compact-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
/* V238_ROUTER_COMPACT_CARD_UI_END */

/* V1_ROUTER_TOOLS_MENU_VISIBILITY_FIX_START
   UI-only: make MikroTik Tools menu float above virtual rows instead of being clipped.
   No WireGuard, invitations, API, router binding, or client-device logic changes. */
:where(#net-tab-devices,#view-devices) .device-virtual-viewport,
:where(#net-tab-devices,#view-devices) .device-virtual-spacer{
  contain:none!important;
  overflow:visible!important;
  isolation:isolate!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-virtual-row{
  overflow:visible!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-virtual-row.router-tools-open,
:where(#net-tab-devices,#view-devices) .device-row.device-virtual-row:has(.router-tools-menu[open]),
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik.router-tools-open,
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik:has(.router-tools-menu[open]){
  z-index:9999!important;
  overflow:visible!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik .cell-actions,
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik .row-actions.polished,
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik .router-tools-menu{
  overflow:visible!important;
  position:relative!important;
  z-index:20!important;
}
:where(#net-tab-devices,#view-devices) .router-tools-menu[open]{z-index:10000!important;}
:where(#net-tab-devices,#view-devices) .router-tools-menu[open] > summary{
  border-color:rgba(56,189,248,.45)!important;
  box-shadow:0 10px 24px rgba(14,165,233,.18)!important;
}
:where(#net-tab-devices,#view-devices) .router-tools-dropdown{
  z-index:10001!important;
  max-height:min(54vh,340px)!important;
  overflow:auto!important;
  overscroll-behavior:contain!important;
  scrollbar-width:thin!important;
}
:where(#net-tab-devices,#view-devices) .router-tools-menu.drop-up .router-tools-dropdown{
  top:auto!important;
  bottom:calc(100% + 8px)!important;
}
:where(#net-tab-devices,#view-devices) .router-tools-dropdown .row-btn{
  width:100%!important;
  min-width:0!important;
  white-space:normal!important;
  line-height:1.25!important;
}
@media (max-width:760px){
  :where(#net-tab-devices,#view-devices) .router-tools-dropdown{
    position:absolute!important;
    inset-inline-end:0!important;
    min-width:min(320px,92vw)!important;
    max-height:min(58vh,360px)!important;
  }
}
/* V1_ROUTER_TOOLS_MENU_VISIBILITY_FIX_END */

/* V1_MIKROTIK_PORT_FALLBACK_UI_START
   UI-only modal for choosing MikroTik endpoint fallback ports. */
.it-modal-backdrop{position:fixed;inset:0;background:rgba(2,6,23,.68);z-index:99999;display:flex;align-items:center;justify-content:center;padding:18px;backdrop-filter:blur(6px)}
.it-modal-backdrop.hidden{display:none!important}.it-modal-card{width:min(760px,96vw);max-height:88vh;overflow:auto;background:linear-gradient(180deg,#0f172a,#111827);border:1px solid rgba(148,163,184,.22);border-radius:18px;box-shadow:0 28px 80px rgba(0,0,0,.45);padding:16px;color:#e5e7eb}.it-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}.it-modal-title{font-size:18px;font-weight:900;color:#f8fafc}.it-modal-subtitle{font-size:12px;color:#94a3b8;margin-top:4px}.mikrotik-port-warning{font-size:12px;line-height:1.8;color:#fde68a;background:rgba(234,179,8,.10);border:1px solid rgba(234,179,8,.22);border-radius:12px;padding:8px 10px;margin-bottom:10px}.mikrotik-port-table-wrap{overflow:auto;border:1px solid rgba(148,163,184,.18);border-radius:14px}.mikrotik-port-table{width:100%;border-collapse:collapse;font-size:12px}.mikrotik-port-table th,.mikrotik-port-table td{padding:9px;border-bottom:1px solid rgba(148,163,184,.14);vertical-align:middle;text-align:right}.mikrotik-port-table th{color:#cbd5e1;background:rgba(15,23,42,.85);font-weight:900}.mikrotik-port-table tr.selected{background:rgba(34,197,94,.10)}.port-current,.port-alt,.port-default{display:inline-flex;border-radius:999px;padding:2px 7px;font-size:10px;font-weight:900;margin-top:4px}.port-current{background:rgba(34,197,94,.15);color:#86efac}.port-alt{background:rgba(59,130,246,.15);color:#93c5fd}.port-default{background:rgba(148,163,184,.14);color:#cbd5e1}.mikrotik-port-manual{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;margin-top:12px}.mikrotik-port-manual label{font-size:12px;font-weight:900;color:#cbd5e1}.mikrotik-port-manual input{height:34px;border-radius:10px;border:1px solid rgba(148,163,184,.26);background:rgba(15,23,42,.85);color:#fff;padding:0 10px;outline:none}.mikrotik-port-result{font-size:12px;color:#bfdbfe;line-height:1.8;margin-top:10px;white-space:pre-wrap}.row-btn.warning{background:rgba(245,158,11,.15)!important;border-color:rgba(245,158,11,.28)!important;color:#fde68a!important}
body.light .it-modal-card{background:linear-gradient(180deg,#fff,#f8fafc);color:#0f172a;border-color:rgba(15,23,42,.14)}body.light .it-modal-title{color:#0f172a}body.light .it-modal-subtitle{color:#475569}body.light .mikrotik-port-table th{background:#f1f5f9;color:#0f172a}body.light .mikrotik-port-table td,body.light .mikrotik-port-table th{border-color:rgba(15,23,42,.10)}body.light .mikrotik-port-manual input{background:#fff;color:#0f172a;border-color:#cbd5e1}
@media(max-width:640px){.it-modal-card{padding:12px;border-radius:14px}.mikrotik-port-manual{grid-template-columns:1fr}.mikrotik-port-table th,.mikrotik-port-table td{padding:7px;font-size:11px}}
/* V1_MIKROTIK_PORT_FALLBACK_UI_END */

/* V1 endpoint port scope selector */
.mikrotik-port-scope{display:grid;grid-template-columns:auto minmax(120px,220px) 1fr;gap:8px;align-items:center;margin:10px 0 12px;padding:9px 10px;border:1px solid rgba(148,163,184,.18);border-radius:12px;background:rgba(15,23,42,.45)}
.mikrotik-port-scope label{font-size:12px;font-weight:900;color:#cbd5e1}.mikrotik-port-scope select{height:34px;border-radius:10px;border:1px solid rgba(148,163,184,.26);background:rgba(15,23,42,.85);color:#fff;padding:0 10px;outline:none}.mikrotik-port-scope-note{font-size:11px;color:#94a3b8;line-height:1.6}@media(max-width:640px){.mikrotik-port-scope{grid-template-columns:1fr}.mikrotik-port-scope select{width:100%}}

/* V1 config QR health badges */
.mini-tag.config-ready{background:rgba(16,185,129,.12)!important;border-color:rgba(16,185,129,.28)!important;color:#a7f3d0!important;}
.mini-tag.config-missing{background:rgba(244,63,94,.12)!important;border-color:rgba(244,63,94,.28)!important;color:#fecdd3!important;}


/* V1_DB_UI_DOUBLE_FIX_START
   Fix device-card overlap and pending-state action confusion.
   UI only: no WireGuard/routes/invites logic is changed. */
:where(#net-tab-devices,#view-devices) .device-virtual-viewport,
:where(#net-tab-devices,#view-devices) .device-virtual-spacer{
  overflow:visible!important;
  contain:none!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro{
  min-height:232px!important;
  height:auto!important;
  overflow:visible!important;
  box-sizing:border-box!important;
  align-items:stretch!important;
  margin:0!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-row-pending{
  min-height:218px!important;
  border-color:rgba(245,158,11,.24)!important;
  background:linear-gradient(135deg,rgba(15,23,42,.92),rgba(245,158,11,.07))!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished.is-pending{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:8px!important;
  align-content:center!important;
  max-height:none!important;
  overflow:visible!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished.is-pending .row-btn{
  min-height:34px!important;
  padding:7px 10px!important;
  font-size:12px!important;
}
:where(#net-tab-devices,#view-devices) .mini-tag.config-pending{
  background:rgba(245,158,11,.15)!important;
  border:1px solid rgba(245,158,11,.30)!important;
  color:#fde68a!important;
}
@media(min-width:1261px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro{min-height:240px!important;}
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-row-pending{min-height:230px!important;}
  :where(#net-tab-devices,#view-devices) .row-actions.polished:not(.is-mikrotik-actions):not(.is-pending){
    grid-template-columns:repeat(2,minmax(96px,1fr))!important;
  }
}
@media(max-width:1260px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro{min-height:290px!important;}
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-row-pending{min-height:270px!important;}
}
@media(max-width:760px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro{min-height:420px!important;}
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-row-pending{min-height:360px!important;}
  :where(#net-tab-devices,#view-devices) .row-actions.polished.is-pending{grid-template-columns:1fr!important;}
}
/* V1_DB_UI_DOUBLE_FIX_END */

/* V1_DEVICE_ULTRA_COMPACT_UI_START
   Devices screen only. Secondary actions are kept inside Tools; no WireGuard/routes/invites logic changed. */
:where(#net-tab-devices,#view-devices) .active-devices-section{
  padding:10px!important;
  border-radius:16px!important;
}
:where(#net-tab-devices,#view-devices) .active-devices-head{
  padding:0 0 8px!important;
  margin:0 0 8px!important;
}
:where(#net-tab-devices,#view-devices) .device-virtual-viewport,
:where(#net-tab-devices,#view-devices) .device-virtual-spacer{
  overflow:visible!important;
  contain:none!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro{
  display:grid!important;
  grid-template-columns:minmax(250px,1.25fr) minmax(190px,.75fr) minmax(190px,.75fr) minmax(190px,.66fr)!important;
  gap:8px!important;
  height:156px!important;
  min-height:156px!important;
  max-height:156px!important;
  padding:8px 10px!important;
  border-radius:15px!important;
  margin:0!important;
  overflow:visible!important;
  align-items:stretch!important;
  box-shadow:0 8px 20px rgba(2,6,23,.18), inset 0 1px 0 rgba(255,255,255,.04)!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik{
  height:168px!important;
  min-height:168px!important;
  max-height:168px!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-row-pending{
  height:142px!important;
  min-height:142px!important;
  max-height:142px!important;
}
:where(#net-tab-devices,#view-devices) .device-row-cell{min-width:0!important;padding:0!important;display:flex!important;align-items:stretch!important;}
:where(#net-tab-devices,#view-devices) .device-main{gap:7px!important;align-items:center!important;}
:where(#net-tab-devices,#view-devices) .device-health-dot{width:9px!important;height:9px!important;flex:0 0 9px!important;box-shadow:none!important;}
:where(#net-tab-devices,#view-devices) .device-name{font-size:13px!important;line-height:1.18!important;max-width:100%!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
:where(#net-tab-devices,#view-devices) .device-title-row{gap:4px!important;flex-wrap:nowrap!important;min-width:0!important;}
:where(#net-tab-devices,#view-devices) .path-pill,
:where(#net-tab-devices,#view-devices) .device-status-label-v127,
:where(#net-tab-devices,#view-devices) .mini-tag{font-size:8.5px!important;min-height:18px!important;padding:2px 6px!important;border-radius:999px!important;line-height:1!important;white-space:nowrap!important;}
:where(#net-tab-devices,#view-devices) .device-subtitle{font-size:9.5px!important;line-height:1.25!important;margin-top:2px!important;max-height:25px!important;overflow:hidden!important;-webkit-line-clamp:2!important;}
:where(#net-tab-devices,#view-devices) .device-subline{gap:3px!important;margin-top:4px!important;flex-wrap:wrap!important;max-height:42px!important;overflow:hidden!important;}
:where(#net-tab-devices,#view-devices) .device-metric-list.refined,
:where(#net-tab-devices,#view-devices) .device-status-card.refined{padding:7px!important;border-radius:11px!important;min-height:0!important;justify-content:center!important;gap:5px!important;}
:where(#net-tab-devices,#view-devices) .device-metric-line.metric-primary{margin-bottom:5px!important;min-height:28px!important;}
:where(#net-tab-devices,#view-devices) .device-metric-label{font-size:8.5px!important;line-height:1!important;}
:where(#net-tab-devices,#view-devices) .managed-pill{min-height:30px!important;padding:5px 7px!important;border-radius:9px!important;gap:5px!important;}
:where(#net-tab-devices,#view-devices) .managed-pill .mono{font-size:10px!important;letter-spacing:0!important;}
:where(#net-tab-devices,#view-devices) .latency-pill{font-size:8px!important;min-height:18px!important;padding:2px 5px!important;min-width:auto!important;}
:where(#net-tab-devices,#view-devices) .device-metric-grid.compact{gap:4px!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;}
:where(#net-tab-devices,#view-devices) .metric-chip{min-height:30px!important;padding:5px 6px!important;border-radius:9px!important;}
:where(#net-tab-devices,#view-devices) .metric-chip .metric-value{font-size:9px!important;line-height:1.15!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
:where(#net-tab-devices,#view-devices) .device-status-top.refined{gap:4px!important;margin-bottom:4px!important;}
:where(#net-tab-devices,#view-devices) .status-quality{font-size:8.5px!important;min-height:18px!important;padding:2px 6px!important;}
:where(#net-tab-devices,#view-devices) .status-summary{font-size:10px!important;line-height:1.2!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
:where(#net-tab-devices,#view-devices) .time-stack.compact.refined{gap:4px!important;display:grid!important;grid-template-columns:1fr!important;}
:where(#net-tab-devices,#view-devices) .time-stack.compact.refined span{min-height:22px!important;padding:3px 5px!important;border-radius:8px!important;display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;gap:5px!important;}
:where(#net-tab-devices,#view-devices) .time-stack.compact.refined strong,
:where(#net-tab-devices,#view-devices) .time-stack.compact.refined em{font-size:8.5px!important;line-height:1.1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
:where(#net-tab-devices,#view-devices) .row-actions.polished{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:4px!important;
  align-content:center!important;
  width:100%!important;
  overflow:visible!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished.is-mikrotik-actions{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
:where(#net-tab-devices,#view-devices) .row-actions.polished .row-btn{
  min-height:26px!important;
  height:26px!important;
  padding:0 5px!important;
  border-radius:8px!important;
  font-size:9px!important;
  line-height:1!important;
  min-width:0!important;
  width:100%!important;
  white-space:nowrap!important;
  box-shadow:none!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished .row-btn.ping-icon{font-size:12px!important;}
:where(#net-tab-devices,#view-devices) .router-tools-dropdown{min-width:250px!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:5px!important;padding:7px!important;max-height:min(52vh,330px)!important;overflow:auto!important;}
:where(#net-tab-devices,#view-devices) .router-tools-dropdown .row-btn{height:27px!important;min-height:27px!important;font-size:8.5px!important;padding:0 5px!important;border-radius:8px!important;}
@media(max-width:1260px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro{grid-template-columns:minmax(230px,1fr) minmax(180px,.75fr) minmax(185px,.75fr)!important;height:190px!important;min-height:190px!important;max-height:190px!important;}
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik{height:208px!important;min-height:208px!important;max-height:208px!important;}
  :where(#net-tab-devices,#view-devices) .device-row-cell.cell-actions{grid-column:1/-1!important;}
  :where(#net-tab-devices,#view-devices) .row-actions.polished{grid-template-columns:repeat(6,minmax(0,1fr))!important;}
}
@media(max-width:760px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro{grid-template-columns:1fr!important;height:285px!important;min-height:285px!important;max-height:285px!important;padding:8px!important;gap:5px!important;}
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik{height:315px!important;min-height:315px!important;max-height:315px!important;}
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-row-pending{height:210px!important;min-height:210px!important;max-height:210px!important;}
  :where(#net-tab-devices,#view-devices) .row-actions.polished{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
}
/* V1_DEVICE_ULTRA_COMPACT_UI_END */


/* V1_ZEROTIER_PANEL_VISIBLE_MAIN_UI_START */
.zt-main-view{width:100%;}
.zt-main-shell{display:flex;flex-direction:column;gap:14px;max-width:1400px;margin:0 auto;padding:6px;}
.zt-main-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;border:1px solid rgba(148,163,184,.18);background:linear-gradient(135deg,rgba(15,23,42,.92),rgba(8,47,73,.74));border-radius:22px;padding:18px;box-shadow:0 18px 45px rgba(0,0,0,.20);}
.zt-main-kicker{display:inline-flex;font-size:12px;font-weight:900;color:#f4d08a;letter-spacing:.04em;margin-bottom:6px;}
.zt-main-head h2{font-size:24px;font-weight:1000;color:#f8fafc;margin:0 0 6px;}
.zt-main-head p{color:#cbd5e1;margin:0;font-size:13px;line-height:1.8;max-width:780px;}
.zt-main-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;}
.zt-main-btn{border:1px solid rgba(148,163,184,.24);background:rgba(15,23,42,.66);color:#e5e7eb;border-radius:12px;padding:9px 12px;font-size:12px;font-weight:900;cursor:pointer;transition:.15s ease;}
.zt-main-btn:hover{transform:translateY(-1px);background:rgba(30,41,59,.85);}
.zt-main-btn.primary{background:linear-gradient(135deg,#0ea5e9,#2563eb);color:white;border-color:rgba(125,211,252,.45);}
.zt-main-btn.danger{background:rgba(239,68,68,.14);color:#fecaca;border-color:rgba(239,68,68,.28);}
.zt-main-btn.tiny{padding:6px 9px;border-radius:9px;font-size:11px;}
.zt-main-status{display:flex;gap:8px;flex-wrap:wrap;align-items:center;border:1px solid rgba(148,163,184,.18);background:rgba(15,23,42,.55);border-radius:18px;padding:12px;color:#e5e7eb;}
.zt-status-pill{display:inline-flex;align-items:center;gap:5px;border:1px solid rgba(148,163,184,.20);background:rgba(255,255,255,.055);border-radius:999px;padding:7px 10px;font-size:12px;}
.zt-status-pill.ok{border-color:rgba(34,197,94,.35);color:#bbf7d0;}
.zt-status-pill.warn{border-color:rgba(245,158,11,.35);color:#fde68a;}
.zt-status-warning{width:100%;border:1px solid rgba(245,158,11,.28);background:rgba(245,158,11,.10);color:#fde68a;border-radius:14px;padding:10px;font-size:12px;line-height:1.7;}
.zt-main-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(220px,.65fr);gap:14px;}
.zt-card{border:1px solid rgba(148,163,184,.18);background:rgba(15,23,42,.60);border-radius:20px;padding:14px;color:#e5e7eb;box-shadow:0 14px 34px rgba(0,0,0,.13);}
.zt-card-title{display:flex;align-items:center;justify-content:space-between;font-size:14px;font-weight:1000;color:#f8fafc;margin-bottom:12px;}
.zt-info-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;}
.zt-info-item{border:1px solid rgba(148,163,184,.16);background:rgba(255,255,255,.045);border-radius:14px;padding:10px;min-height:78px;}
.zt-info-item span{display:block;font-size:11px;color:#94a3b8;margin-bottom:6px;font-weight:900;}
.zt-info-item strong{display:block;font-size:12px;word-break:break-all;color:#f8fafc;line-height:1.55;}
.zt-info-item button{margin-top:6px;border:1px solid rgba(56,189,248,.25);background:rgba(14,165,233,.12);color:#bae6fd;border-radius:9px;padding:5px 9px;font-size:11px;font-weight:900;}
.zt-qr-box{display:flex;min-height:220px;align-items:center;justify-content:center;flex-direction:column;gap:10px;text-align:center;color:#94a3b8;}
.zt-qr-box img{width:180px;max-width:100%;background:#fff;border-radius:16px;padding:10px;border:1px solid rgba(148,163,184,.35);}
.zt-members-box,.zt-routes-box{font-size:12px;line-height:1.75;color:#cbd5e1;}
.zt-members-list{display:flex;flex-direction:column;gap:8px;}
.zt-member-row{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(140px,.8fr) auto;gap:10px;align-items:center;border:1px solid rgba(148,163,184,.16);background:rgba(255,255,255,.045);border-radius:14px;padding:10px;}
.zt-member-row.ok{border-color:rgba(34,197,94,.22);}
.zt-member-row.pending{border-color:rgba(245,158,11,.24);}
.zt-member-row strong,.zt-member-row span,.zt-member-row small{display:block;}
.zt-member-row .mono,.zt-info-item .mono,.zt-routes-box .mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;direction:ltr;text-align:left;unicode-bidi:plaintext;}
.zt-member-actions{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap;}
.zt-route-section{border:1px solid rgba(148,163,184,.14);background:rgba(255,255,255,.035);border-radius:14px;padding:10px;margin-bottom:8px;}
.zt-empty,.zt-error{border:1px dashed rgba(148,163,184,.22);border-radius:14px;padding:16px;text-align:center;color:#94a3b8;}
.zt-error{border-color:rgba(239,68,68,.28);color:#fecaca;background:rgba(239,68,68,.08);}
.zt-main-toast{position:fixed;left:18px;bottom:18px;z-index:2147483600;background:#0f172a;color:#e5e7eb;border:1px solid rgba(148,163,184,.25);border-radius:14px;padding:11px 14px;font-size:12px;font-weight:900;box-shadow:0 18px 44px rgba(0,0,0,.35);}
.zt-main-toast.bad{background:#450a0a;color:#fecaca;border-color:rgba(248,113,113,.35);}
@media(max-width:900px){.zt-main-head{flex-direction:column}.zt-main-grid{grid-template-columns:1fr}.zt-info-grid{grid-template-columns:1fr}.zt-member-row{grid-template-columns:1fr}.zt-member-actions{justify-content:flex-start}}
/* V1_ZEROTIER_PANEL_VISIBLE_MAIN_UI_END */


/* V1_WG_ZT_SAME_NETWORK_UI_START */
.zt-same-network-box{border:1px solid rgba(34,197,94,.22);background:linear-gradient(135deg,rgba(6,78,59,.30),rgba(15,23,42,.72));border-radius:18px;padding:12px;color:#e5e7eb;display:flex;flex-direction:column;gap:8px;}
.zt-same-title{font-weight:1000;color:#bbf7d0;font-size:13px;}
.zt-same-grid{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.zt-same-note{font-size:12px;color:#cbd5e1;line-height:1.7;}
.zt-mini-log{direction:ltr;text-align:left;white-space:pre-wrap;max-height:180px;overflow:auto;background:rgba(2,6,23,.65);border:1px solid rgba(148,163,184,.20);border-radius:12px;padding:10px;font-size:11px;color:#dbeafe;}
.zt-status-pill.ok{background:rgba(34,197,94,.13);border-color:rgba(34,197,94,.30);color:#bbf7d0;}
.zt-status-pill.warn{background:rgba(245,158,11,.13);border-color:rgba(245,158,11,.30);color:#fde68a;}
/* V1_WG_ZT_SAME_NETWORK_UI_END */



/* V1_ZEROTIER_DEEP_INTEGRATION_STYLE_START */
.zt-deep-box{border-color:rgba(34,211,238,.18)!important;background:linear-gradient(180deg,rgba(8,47,73,.32),rgba(15,23,42,.54))!important;}
.zt-deep-title{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.zt-deep-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.zt-deep-panel{border:1px solid rgba(148,163,184,.14);border-radius:16px;background:rgba(2,6,23,.28);padding:12px;min-width:0;}
.zt-deep-panel h4{margin:0 0 5px;color:#f8fafc;font-weight:1000;font-size:14px;}
.zt-deep-panel p{margin:0 0 10px;color:#94a3b8;font-size:11px;line-height:1.7;}
.zt-deep-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:7px;align-items:center;margin-bottom:10px;}
.zt-deep-form.compact{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;margin-bottom:6px;}
.zt-deep-form input{background:rgba(15,23,42,.8);border:1px solid rgba(148,163,184,.20);border-radius:10px;color:#e5e7eb;padding:8px 9px;font-size:12px;outline:none;min-width:0;}
.zt-deep-form input:focus{border-color:rgba(56,189,248,.55);box-shadow:0 0 0 3px rgba(14,165,233,.13);}
.zt-deep-list{display:flex;flex-direction:column;gap:7px;color:#cbd5e1;font-size:12px;}
.zt-route-manage-row,.zt-member-edit-row{border:1px solid rgba(148,163,184,.15);border-radius:12px;background:rgba(255,255,255,.04);padding:9px;}
.zt-route-manage-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.75fr) auto;gap:8px;align-items:center;}
.zt-member-edit-head{display:flex;align-items:center;gap:7px;justify-content:space-between;margin-bottom:7px;}
.zt-member-edit-head strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#e2e8f0;}
.zt-check{display:flex;gap:5px;align-items:center;font-size:11px;color:#cbd5e1;white-space:nowrap;}
.zt-deep-sub{font-size:11px;color:#94a3b8;line-height:1.7;margin-bottom:4px;}
.zt-deep-box .mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;direction:ltr;text-align:left;unicode-bidi:plaintext;}
@media(max-width:1100px){.zt-deep-grid{grid-template-columns:1fr}.zt-deep-form,.zt-deep-form.compact{grid-template-columns:1fr}.zt-route-manage-row{grid-template-columns:1fr}.zt-member-edit-head{align-items:flex-start;flex-direction:column}}
/* V1_ZEROTIER_DEEP_INTEGRATION_STYLE_END */


/* V1_ZEROTIER_WG_FEATURE_PARITY_STYLE_START */
.zt-wg-mirror-box{border-color:rgba(34,197,94,.38)!important;background:linear-gradient(180deg,rgba(5,18,34,.96),rgba(9,22,39,.96))!important}
.zt-mirror-title{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.zt-mirror-actions{display:flex;gap:8px;flex-wrap:wrap}.zt-mirror-note{color:#aac0da;line-height:1.8;margin:8px 0 14px}.zt-mirror-counters{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin-bottom:12px}.zt-counter{background:#071325;border:1px solid #223653;border-radius:14px;padding:10px;display:flex;flex-direction:column;gap:4px}.zt-counter strong{font-size:20px;color:#eef6ff}.zt-counter span{font-size:12px;color:#9fb3ca}.zt-counter.ok strong{color:#86efac}.zt-counter.warn strong{color:#fde68a}.zt-counter.wide{grid-column:span 2}.zt-mirror-features{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 14px}.zt-feature-pill{border:1px solid #334155;background:#0b1729;border-radius:999px;padding:8px 11px;color:#dbeafe;font-weight:700;font-size:13px}.zt-feature-pill.ok{border-color:rgba(34,197,94,.55);color:#bbf7d0}.zt-feature-pill.warn{border-color:rgba(245,158,11,.55);color:#fde68a}.zt-mirror-members{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px}.zt-mirror-member{background:#071325;border:1px solid #223653;border-radius:16px;padding:12px}.zt-mirror-member-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}.zt-mirror-member-head strong{font-size:16px;color:#f8fafc}.zt-mirror-member-meta{display:flex;flex-direction:column;gap:5px;color:#b7c7dc;font-size:13px;line-height:1.55}.zt-mirror-actions-row{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}.zt-main-btn.danger{background:#991b1b!important;color:#fff!important}.zt-mirror-ping-result{margin-top:8px}.mono{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;direction:ltr;unicode-bidi:embed}.zt-mini-log{max-height:150px;overflow:auto;white-space:pre-wrap;background:#020817;border:1px solid #1e293b;border-radius:12px;padding:8px;color:#cbd5e1;direction:ltr;text-align:left}
@media(max-width:700px){.zt-counter.wide{grid-column:span 1}.zt-mirror-members{grid-template-columns:1fr}.zt-mirror-title{align-items:flex-start}.zt-mirror-actions{width:100%}.zt-mirror-actions .zt-main-btn{flex:1 1 140px}}
/* V1_ZEROTIER_WG_FEATURE_PARITY_STYLE_END */


/* V1_DEVICE_ACCESS_CONTROL_STYLE_START */
.ittop-acl-page{padding:18px;direction:rtl}.acl-hero{display:flex;gap:16px;justify-content:space-between;align-items:stretch;background:linear-gradient(135deg,rgba(15,23,42,.95),rgba(30,41,59,.92));border:1px solid rgba(244,208,138,.32);border-radius:22px;padding:18px;margin-bottom:14px;color:#fff}.acl-kicker{display:inline-block;color:#f4d08a;font-weight:900;margin-bottom:4px}.acl-hero h2{margin:0 0 6px;font-size:24px}.acl-hero p{margin:0;color:#dbeafe;max-width:820px}.acl-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.acl-actions.end{justify-content:flex-end;margin-top:10px}.acl-btn{border:1px solid rgba(148,163,184,.35);background:rgba(15,23,42,.08);color:inherit;border-radius:12px;padding:9px 12px;font-weight:800;cursor:pointer}.acl-btn.primary{background:#2563eb;color:#fff;border-color:#60a5fa}.acl-btn.danger{background:#991b1b;color:#fff;border-color:#fca5a5}.acl-warning{border:1px solid rgba(245,158,11,.35);background:rgba(245,158,11,.11);border-radius:14px;padding:10px 12px;margin-bottom:12px;color:#92400e;font-weight:700}.acl-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:12px}.acl-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.acl-card{background:var(--panel,#fff);border:1px solid rgba(148,163,184,.28);border-radius:18px;padding:14px;box-shadow:0 14px 30px rgba(15,23,42,.07);color:var(--text,#0f172a)}.acl-card h3{margin:0 0 10px;font-size:16px}.acl-select,.acl-card textarea{width:100%;border:1px solid rgba(148,163,184,.45);border-radius:12px;padding:10px;background:rgba(248,250,252,.96);color:#0f172a}.acl-meta{font-size:13px;color:#64748b;margin-top:8px;line-height:1.7}.acl-list{max-height:230px;overflow:auto;border:1px dashed rgba(148,163,184,.35);border-radius:12px;padding:8px;background:rgba(248,250,252,.55)}.acl-check,.acl-radio{display:flex;gap:8px;align-items:flex-start;padding:7px 4px;font-weight:700}.acl-check span{font-size:13px}.acl-empty{color:#64748b;padding:8px}.acl-manual{display:grid;grid-template-columns:1fr 1fr;gap:10px}.acl-manual textarea{min-height:92px;direction:ltr;text-align:left}.acl-note{min-height:60px;margin-top:10px}.acl-result{background:#020617;color:#dbeafe;border-radius:16px;padding:12px;min-height:46px;white-space:normal}.acl-log{direction:ltr;text-align:left;white-space:pre-wrap;overflow:auto;background:#020617;color:#dbeafe;border-radius:12px;padding:12px;max-height:420px}.acl-error{color:#fecaca;font-weight:900}.acl-ok{color:#bbf7d0;font-weight:900}@media(max-width:900px){.acl-hero,.acl-grid,.acl-grid.two,.acl-manual{grid-template-columns:1fr;display:grid}.acl-hero{display:block}.acl-actions{margin-top:12px}}
/* V1_DEVICE_ACCESS_CONTROL_STYLE_END */

/* V1_DEVICE_ROUTING_CONTROL_STYLE_START */
.ittop-routing-page .route-hero{border-color:rgba(56,189,248,.38);background:linear-gradient(135deg,rgba(8,20,38,.96),rgba(15,23,42,.94))}.route-warning{border-color:rgba(56,189,248,.35);background:rgba(14,165,233,.10);color:#075985}.route-live-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:0 0 12px}.route-live-card{background:var(--panel,#fff);border:1px solid rgba(56,189,248,.25);border-radius:16px;padding:12px;box-shadow:0 10px 22px rgba(15,23,42,.06);display:flex;flex-direction:column;gap:5px}.route-live-card b{font-size:12px;color:#64748b}.route-live-card span{font-size:18px;font-weight:900;color:var(--text,#0f172a);direction:ltr;text-align:left}.route-path-row{display:grid;grid-template-columns:130px 1fr;gap:8px;align-items:center;margin:10px 0}.route-path-row label{font-weight:800;color:#64748b}.route-suggestions{margin-bottom:12px}.route-suggest-list{display:grid;gap:8px}.route-suggest{border:1px solid rgba(148,163,184,.35);background:rgba(248,250,252,.65);border-radius:12px;padding:9px 10px;color:#334155;font-weight:700;line-height:1.6}@media(max-width:900px){.route-path-row{grid-template-columns:1fr}.route-live-grid{grid-template-columns:1fr 1fr}}@media(max-width:520px){.route-live-grid{grid-template-columns:1fr}}
/* V1_DEVICE_ROUTING_CONTROL_STYLE_END */

/* V1 WG+ZT integrated network page */
#navZeroTierBtn{display:none!important}
.network-zt-panel{direction:rtl}.zt-network-card{border:1px solid rgba(99,102,241,.25);background:rgba(15,23,42,.72);border-radius:22px;padding:18px;box-shadow:0 18px 45px rgba(2,6,23,.24)}.light .zt-network-card{background:rgba(255,255,255,.92);border-color:rgba(99,102,241,.18);box-shadow:0 16px 35px rgba(15,23,42,.08)}.zt-network-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:16px;flex-wrap:wrap}.zt-network-head h3{margin:4px 0;font-size:1.25rem;font-weight:900;color:#dbeafe}.light .zt-network-head h3{color:#1e1b4b}.zt-network-head p{margin:0;color:#94a3b8;font-size:.92rem}.light .zt-network-head p{color:#475569}.zt-kicker{display:inline-flex;border:1px solid rgba(56,189,248,.28);border-radius:999px;padding:4px 10px;color:#7dd3fc;font-weight:800;font-size:.75rem}.light .zt-kicker{color:#0369a1;background:#e0f2fe}.zt-mode-switch,.zt-action-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.zt-mini-btn{border:1px solid rgba(148,163,184,.25);border-radius:999px;padding:7px 12px;background:rgba(15,23,42,.35);color:#e2e8f0;font-weight:800;cursor:pointer}.zt-mini-btn.active{background:#2563eb;color:#fff;border-color:#60a5fa}.light .zt-mini-btn{background:#f8fafc;color:#334155}.light .zt-mini-btn.active{background:#2563eb;color:#fff}.zt-status-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:14px}.zt-status-tile{border:1px solid rgba(148,163,184,.2);border-radius:18px;padding:13px;background:rgba(30,41,59,.44);display:flex;flex-direction:column;gap:7px}.light .zt-status-tile{background:#f8fafc;border-color:#e2e8f0}.zt-status-tile>span:first-child{font-weight:900;color:#e2e8f0}.light .zt-status-tile>span:first-child{color:#0f172a}.zt-status-tile small{color:#94a3b8}.light .zt-status-tile small{color:#475569}.zt-status-badge{display:inline-flex;width:max-content;border-radius:999px;padding:4px 9px;font-size:.78rem;font-weight:900;border:1px solid transparent}.zt-status-badge.ok{background:rgba(34,197,94,.14);color:#86efac;border-color:rgba(34,197,94,.28)}.zt-status-badge.off{background:rgba(148,163,184,.12);color:#cbd5e1;border-color:rgba(148,163,184,.22)}.zt-status-badge.warn{background:rgba(245,158,11,.14);color:#fcd34d;border-color:rgba(245,158,11,.28)}.zt-status-badge.bad{background:rgba(239,68,68,.14);color:#fca5a5;border-color:rgba(239,68,68,.28)}.light .zt-status-badge.off{color:#475569;background:#f1f5f9}.zt-alert{border-radius:14px;padding:10px 12px;margin:8px 0;font-size:.9rem}.zt-alert.ok{background:rgba(34,197,94,.10);color:#bbf7d0;border:1px solid rgba(34,197,94,.22)}.zt-alert.warn{background:rgba(245,158,11,.10);color:#fde68a;border:1px solid rgba(245,158,11,.22)}.light .zt-alert.ok{color:#166534;background:#dcfce7}.light .zt-alert.warn{color:#92400e;background:#fef3c7}.zt-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:14px 0}.zt-form-grid label{font-weight:900;color:#cbd5e1;font-size:.83rem}.light .zt-form-grid label{color:#334155}.zt-form-grid input{width:100%;margin-top:6px;border:1px solid rgba(148,163,184,.28);border-radius:13px;background:rgba(15,23,42,.58);color:#fff;padding:10px 12px}.light .zt-form-grid input{background:#fff;color:#0f172a;border-color:#cbd5e1}.zt-check-row{display:flex;align-items:center;gap:8px;font-weight:900;color:#e2e8f0;margin-bottom:12px}.light .zt-check-row{color:#334155}.zt-job-box,.zt-ping-box,.zt-advanced-box{border:1px solid rgba(148,163,184,.22);border-radius:16px;padding:12px;margin:12px 0;background:rgba(15,23,42,.36)}.light .zt-job-box,.light .zt-ping-box,.light .zt-advanced-box{background:#f8fafc;border-color:#e2e8f0;color:#334155}.zt-ping-title{font-weight:900;margin-bottom:8px}.zt-ping-line{display:grid;grid-template-columns:1fr auto 1.5fr;gap:8px;padding:7px 0;border-bottom:1px dashed rgba(148,163,184,.22)}.zt-ping-line:last-child{border-bottom:0}.zt-ping-line.ok b{color:#22c55e}.zt-ping-line.warn b{color:#f59e0b}.zt-ping-line.bad b{color:#ef4444}.zt-member-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}.zt-member-card{border:1px solid rgba(148,163,184,.2);border-radius:14px;padding:10px}.zt-member-title{font-weight:900;margin-bottom:8px}.zt-member-line{display:flex;justify-content:space-between;gap:10px;font-size:.82rem;color:#94a3b8}.light .zt-member-line{color:#475569}.zt-inline-loading,.zt-inline-empty,.zt-inline-error{padding:14px;border-radius:16px;background:rgba(15,23,42,.35);color:#cbd5e1}.zt-inline-error{color:#fecaca;background:rgba(239,68,68,.12)}.light .zt-inline-loading,.light .zt-inline-empty{background:#f8fafc;color:#475569}.light .zt-inline-error{background:#fee2e2;color:#991b1b}.protocol-tag{font-weight:900}.protocol-wireguard{background:rgba(59,130,246,.12)!important;color:#93c5fd!important}.protocol-zerotier{background:rgba(16,185,129,.12)!important;color:#6ee7b7!important}.protocol-hybrid{background:rgba(245,158,11,.14)!important;color:#fcd34d!important}.light .protocol-wireguard{color:#1d4ed8!important}.light .protocol-zerotier{color:#047857!important}.light .protocol-hybrid{color:#92400e!important}@media(max-width:760px){.zt-status-grid,.zt-form-grid{grid-template-columns:1fr}.zt-ping-line{grid-template-columns:1fr}.zt-network-card{padding:14px}}

/* V1_DEVICE_ZT_ACTIONS_PATCH_START
   Show proper action buttons for ZeroTier rows inside the unified Devices table.
   UI-only: WireGuard/MikroTik actions remain unchanged. */
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-zerotier{
  min-height:190px!important;
  overflow:visible!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished.is-zerotier-actions{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  align-content:center!important;
  gap:6px!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished.is-zerotier-actions .row-btn.warning{
  background:linear-gradient(135deg,rgba(245,158,11,.24),rgba(217,119,6,.18))!important;
  color:#fde68a!important;
  border:1px solid rgba(251,191,36,.28)!important;
}
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .row-actions.polished.is-zerotier-actions .row-btn.warning{
  background:#fef3c7!important;
  color:#92400e!important;
  border:1px solid rgba(217,119,6,.28)!important;
}
@media(max-width:1260px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-zerotier{min-height:218px!important;}
  :where(#net-tab-devices,#view-devices) .row-actions.polished.is-zerotier-actions{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
}
@media(max-width:760px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-zerotier{min-height:310px!important;}
  :where(#net-tab-devices,#view-devices) .row-actions.polished.is-zerotier-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media(max-width:420px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-zerotier{min-height:330px!important;}
}
/* V1_DEVICE_ZT_ACTIONS_PATCH_END */

/* V2_DEVICE_ZT_FULL_ACTIONS_FIX_START
   More visible ZeroTier device actions + correct connected styling. */
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-zerotier{
  min-height:230px!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished.is-zerotier-actions{
  grid-template-columns:repeat(3,minmax(92px,1fr))!important;
  align-content:start!important;
  align-items:stretch!important;
  gap:7px!important;
  max-height:none!important;
  overflow:visible!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished.is-zerotier-actions .row-btn{
  min-height:34px!important;
  padding:8px 9px!important;
  font-size:12px!important;
  white-space:nowrap!important;
}
.path-zerotier{background:rgba(20,184,166,.14)!important;color:#5eead4!important;border-color:rgba(20,184,166,.26)!important;}
body[data-it-theme="light"] .path-zerotier{background:#ccfbf1!important;color:#0f766e!important;border-color:#99f6e4!important;}
:where(#net-tab-devices,#view-devices) .device-kind-zerotier.device-state-online{
  border-color:rgba(20,184,166,.38)!important;
}
:where(#net-tab-devices,#view-devices) .device-kind-zerotier.device-state-online .device-health-dot{
  background:#22c55e!important;
  box-shadow:0 0 0 4px rgba(34,197,94,.14),0 0 18px rgba(34,197,94,.45)!important;
}
@media(max-width:1260px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-zerotier{min-height:265px!important;}
  :where(#net-tab-devices,#view-devices) .row-actions.polished.is-zerotier-actions{grid-template-columns:repeat(3,minmax(86px,1fr))!important;}
}
@media(max-width:760px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-zerotier{min-height:390px!important;}
  :where(#net-tab-devices,#view-devices) .row-actions.polished.is-zerotier-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media(max-width:420px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-zerotier{min-height:430px!important;}
  :where(#net-tab-devices,#view-devices) .row-actions.polished.is-zerotier-actions .row-btn{font-size:11px!important;padding:7px!important;}
}
/* V2_DEVICE_ZT_FULL_ACTIONS_FIX_END */


/* V245_WG_ZT_STATUS_GATEWAY_ACTIONS_FINAL_START
   Final visual overrides for the unified WG+ZT devices table:
   - ZeroTier action buttons never clip.
   - Online ZT rows use green status when ping/controller proves reachability.
   - Virtual list row height is matched in app.js V245. */
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-zerotier{
  height:auto!important;
  min-height:270px!important;
  max-height:none!important;
  overflow:visible!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished.is-zerotier-actions{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(86px,1fr))!important;
  gap:7px!important;
  align-items:stretch!important;
  align-content:start!important;
  overflow:visible!important;
  max-height:none!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished.is-zerotier-actions .row-btn{
  width:100%!important;
  min-width:0!important;
  min-height:34px!important;
  height:auto!important;
  white-space:nowrap!important;
  font-size:12px!important;
  padding:8px 9px!important;
}
:where(#net-tab-devices,#view-devices) .device-kind-zerotier.device-state-online .device-status-label-v127,
:where(#net-tab-devices,#view-devices) .device-kind-zerotier.device-state-online .path-pill{
  background:rgba(34,197,94,.14)!important;
  color:#86efac!important;
  border-color:rgba(34,197,94,.28)!important;
}
@media(max-width:1260px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-zerotier{min-height:310px!important;}
  :where(#net-tab-devices,#view-devices) .row-actions.polished.is-zerotier-actions{grid-template-columns:repeat(3,minmax(78px,1fr))!important;}
}
@media(max-width:760px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-zerotier{min-height:430px!important;}
  :where(#net-tab-devices,#view-devices) .row-actions.polished.is-zerotier-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media(max-width:420px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-zerotier{min-height:460px!important;}
  :where(#net-tab-devices,#view-devices) .row-actions.polished.is-zerotier-actions .row-btn{font-size:11px!important;padding:7px!important;}
}
/* V245_WG_ZT_STATUS_GATEWAY_ACTIONS_FINAL_END */

/* V246_DEVICE_CARD_COMPACT_ACTION_SHEET_START
   تصغير كارت الجهاز وتجميع الأزرار الثانوية في نافذة أوامر واحدة.
   لا يتم حذف أي أمر؛ كل الأزرار موجودة داخل زر "الأوامر". */
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro{
  grid-template-columns:minmax(300px,1.25fr) minmax(210px,.72fr) minmax(205px,.72fr) minmax(205px,.62fr)!important;
  min-height:132px!important;
  max-height:142px!important;
  padding:10px 12px!important;
  gap:9px!important;
  border-radius:18px!important;
  align-items:stretch!important;
  overflow:hidden!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-zerotier,
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik{
  min-height:144px!important;
  max-height:154px!important;
}
:where(#net-tab-devices,#view-devices) .device-main{gap:8px!important;align-items:center!important;}
:where(#net-tab-devices,#view-devices) .device-health-dot{width:10px!important;height:10px!important;flex-basis:10px!important;box-shadow:0 0 0 3px rgba(34,197,94,.10)!important;}
:where(#net-tab-devices,#view-devices) .device-name{font-size:14px!important;line-height:1.15!important;}
:where(#net-tab-devices,#view-devices) .device-subtitle{
  font-size:10px!important;
  line-height:1.25!important;
  margin-top:3px!important;
  -webkit-line-clamp:1!important;
  max-height:16px!important;
}
:where(#net-tab-devices,#view-devices) .device-subline{gap:4px!important;margin-top:5px!important;}
:where(#net-tab-devices,#view-devices) .device-subline .mini-tag:nth-child(n+5){display:none!important;}
:where(#net-tab-devices,#view-devices) .mini-tag,
:where(#net-tab-devices,#view-devices) .path-pill,
:where(#net-tab-devices,#view-devices) .device-status-label-v127{
  min-height:20px!important;
  padding:3px 7px!important;
  font-size:9px!important;
}
:where(#net-tab-devices,#view-devices) .device-metric-list.refined,
:where(#net-tab-devices,#view-devices) .device-status-card.refined{
  padding:8px!important;
  border-radius:14px!important;
  min-height:100%!important;
}
:where(#net-tab-devices,#view-devices) .device-metric-line.metric-primary{margin-bottom:5px!important;}
:where(#net-tab-devices,#view-devices) .managed-pill{
  min-height:31px!important;
  padding:5px 7px!important;
  border-radius:12px!important;
}
:where(#net-tab-devices,#view-devices) .managed-pill .mono{font-size:11px!important;}
:where(#net-tab-devices,#view-devices) .latency-pill{min-height:20px!important;min-width:38px!important;padding:3px 6px!important;font-size:9px!important;}
:where(#net-tab-devices,#view-devices) .device-metric-label{font-size:9px!important;}
:where(#net-tab-devices,#view-devices) .device-metric-grid.compact{grid-template-columns:1fr 1fr!important;gap:5px!important;}
:where(#net-tab-devices,#view-devices) .metric-chip{
  min-height:34px!important;
  padding:5px 7px!important;
  border-radius:12px!important;
}
:where(#net-tab-devices,#view-devices) .metric-chip:nth-child(3){display:none!important;}
:where(#net-tab-devices,#view-devices) .metric-chip .metric-value{font-size:10px!important;line-height:1.15!important;}
:where(#net-tab-devices,#view-devices) .device-status-top.refined{margin-bottom:5px!important;gap:5px!important;}
:where(#net-tab-devices,#view-devices) .status-quality{min-height:20px!important;padding:3px 7px!important;font-size:9px!important;}
:where(#net-tab-devices,#view-devices) .status-summary{font-size:10px!important;line-height:1.2!important;}
:where(#net-tab-devices,#view-devices) .time-stack.compact.refined{gap:4px!important;}
:where(#net-tab-devices,#view-devices) .time-stack.compact.refined span{
  min-height:24px!important;
  padding:4px 6px!important;
  border-radius:10px!important;
  gap:5px!important;
}
:where(#net-tab-devices,#view-devices) .time-stack.compact.refined strong,
:where(#net-tab-devices,#view-devices) .time-stack.compact.refined em{font-size:8.5px!important;}
:where(#net-tab-devices,#view-devices) .row-actions.polished{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:5px!important;
  align-content:center!important;
  max-height:100%!important;
  overflow:hidden!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished .row-btn{
  min-height:27px!important;
  height:27px!important;
  padding:4px 6px!important;
  border-radius:10px!important;
  font-size:9px!important;
  line-height:1!important;
  box-shadow:none!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished .row-btn.ping-icon{font-size:12px!important;}
:where(#net-tab-devices,#view-devices) .row-actions.polished .device-more-actions-btn{
  background:linear-gradient(135deg,rgba(37,99,235,.95),rgba(14,165,233,.90))!important;
  color:#fff!important;
  font-weight:900!important;
}
.device-actions-modal-backdrop{
  position:fixed!important;
  inset:0!important;
  z-index:99999!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:18px!important;
  background:rgba(2,6,23,.62)!important;
  backdrop-filter:blur(10px)!important;
}
.device-actions-modal{
  width:min(760px,96vw)!important;
  max-height:min(82vh,720px)!important;
  overflow:auto!important;
  border-radius:24px!important;
  border:1px solid rgba(96,165,250,.28)!important;
  background:linear-gradient(135deg,rgba(10,20,38,.98),rgba(9,34,57,.96))!important;
  box-shadow:0 30px 90px rgba(0,0,0,.48)!important;
  padding:16px!important;
  direction:rtl!important;
}
.device-actions-modal-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  border-bottom:1px solid rgba(148,163,184,.16)!important;
  padding-bottom:12px!important;
  margin-bottom:12px!important;
}
.device-actions-modal-head span{display:block!important;color:#93c5fd!important;font-size:11px!important;font-weight:900!important;letter-spacing:.03em!important;}
.device-actions-modal-head strong{display:block!important;color:#fff!important;font-size:18px!important;font-weight:1000!important;margin-top:3px!important;}
.device-actions-modal-head small{display:block!important;color:#94a3b8!important;font-size:11px!important;margin-top:3px!important;}
.device-actions-close{
  min-width:92px!important;
  min-height:38px!important;
  border:1px solid rgba(148,163,184,.24)!important;
  border-radius:14px!important;
  background:rgba(15,23,42,.86)!important;
  color:#e2e8f0!important;
  font-weight:900!important;
}
.device-actions-grid.compact-actions-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:8px!important;
}
.device-actions-grid.compact-actions-grid .row-btn{
  width:100%!important;
  min-height:38px!important;
  padding:7px 9px!important;
  border-radius:12px!important;
  font-size:11px!important;
  justify-content:center!important;
  white-space:nowrap!important;
}
body[data-it-theme="light"] .device-actions-modal{
  background:linear-gradient(135deg,#ffffff,#eef6ff)!important;
  border-color:rgba(37,99,235,.20)!important;
  box-shadow:0 28px 80px rgba(15,23,42,.28)!important;
}
body[data-it-theme="light"] .device-actions-modal-head strong{color:#0f172a!important;}
body[data-it-theme="light"] .device-actions-modal-head small{color:#475569!important;}
body[data-it-theme="light"] .device-actions-close{background:#e2e8f0!important;color:#0f172a!important;border-color:rgba(51,65,85,.18)!important;}
@media(max-width:1260px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro{
    grid-template-columns:minmax(260px,1fr) minmax(205px,.82fr) minmax(205px,.82fr)!important;
    min-height:166px!important;
    max-height:176px!important;
  }
  :where(#net-tab-devices,#view-devices) .device-row-cell.cell-actions{grid-column:1/-1!important;}
  :where(#net-tab-devices,#view-devices) .row-actions.polished{grid-template-columns:repeat(4,minmax(0,1fr))!important;}
}
@media(max-width:760px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro{
    grid-template-columns:1fr!important;
    min-height:222px!important;
    max-height:238px!important;
    padding:8px!important;
    gap:5px!important;
  }
  :where(#net-tab-devices,#view-devices) .row-actions.polished{grid-template-columns:repeat(4,minmax(0,1fr))!important;}
  :where(#net-tab-devices,#view-devices) .device-status-card.refined{display:none!important;}
  .device-actions-grid.compact-actions-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .device-actions-modal{padding:12px!important;border-radius:18px!important;}
  .device-actions-modal-head{flex-direction:column!important;align-items:stretch!important;}
  .device-actions-close{width:100%!important;}
}
/* V246_DEVICE_CARD_COMPACT_ACTION_SHEET_END */

/* V247 - smaller device card + essential actions outside */
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro{
  min-height:132px!important;
  height:132px!important;
  max-height:132px!important;
  padding:8px 10px!important;
  gap:8px!important;
  grid-template-columns:minmax(250px,1.28fr) minmax(190px,.82fr) minmax(180px,.72fr) minmax(300px,.9fr)!important;
  align-items:stretch!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-zerotier{min-height:140px!important;height:140px!important;max-height:140px!important;}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik{min-height:146px!important;height:146px!important;max-height:146px!important;}
:where(#net-tab-devices,#view-devices) .device-main,
:where(#net-tab-devices,#view-devices) .device-metric-list.refined,
:where(#net-tab-devices,#view-devices) .device-status-card.refined{padding:9px!important;border-radius:14px!important;min-height:0!important;}
:where(#net-tab-devices,#view-devices) .device-name{font-size:13px!important;line-height:1.25!important;max-width:230px!important;}
:where(#net-tab-devices,#view-devices) .device-subtitle{font-size:10.5px!important;line-height:1.25!important;margin-top:3px!important;}
:where(#net-tab-devices,#view-devices) .device-subline{gap:4px!important;margin-top:5px!important;}
:where(#net-tab-devices,#view-devices) .mini-tag{font-size:9.5px!important;padding:3px 6px!important;border-radius:999px!important;}
:where(#net-tab-devices,#view-devices) .managed-pill{min-height:28px!important;padding:5px 8px!important;border-radius:11px!important;}
:where(#net-tab-devices,#view-devices) .device-metric-grid.compact{gap:5px!important;margin-top:5px!important;}
:where(#net-tab-devices,#view-devices) .metric-chip{min-height:34px!important;padding:5px 7px!important;border-radius:11px!important;}
:where(#net-tab-devices,#view-devices) .metric-chip .metric-value{font-size:10px!important;}
:where(#net-tab-devices,#view-devices) .device-status-top.refined{gap:5px!important;margin-bottom:5px!important;}
:where(#net-tab-devices,#view-devices) .status-quality,
:where(#net-tab-devices,#view-devices) .status-summary{font-size:10.5px!important;line-height:1.25!important;}
:where(#net-tab-devices,#view-devices) .time-stack.compact.refined{gap:4px!important;}
:where(#net-tab-devices,#view-devices) .time-stack.compact.refined span{min-height:24px!important;padding:4px 6px!important;border-radius:9px!important;font-size:9.5px!important;}
:where(#net-tab-devices,#view-devices) .row-actions.polished{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:5px!important;
  align-content:center!important;
  padding:0!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished .row-btn{
  min-height:32px!important;
  padding:6px 7px!important;
  font-size:10.5px!important;
  border-radius:10px!important;
  white-space:nowrap!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished .row-btn.ping-icon{font-size:12px!important;}
:where(#net-tab-devices,#view-devices) .row-actions.polished .device-more-actions-btn{font-weight:1000!important;}
.zt-edit-modal{max-width:min(820px,96vw)!important;width:96vw!important;max-height:90vh!important;overflow:auto!important;}
.zt-edit-grid{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important;margin:12px 0!important;}
.zt-edit-grid.two{grid-template-columns:1fr 1fr!important;}
.zt-edit-grid label{display:flex!important;flex-direction:column!important;gap:6px!important;color:#cbd5e1!important;font-size:12px!important;font-weight:800!important;}
.zt-edit-grid .input{background:#07111f!important;border:1px solid rgba(148,163,184,.28)!important;color:#e5edf8!important;border-radius:12px!important;padding:10px 12px!important;outline:0!important;}
.zt-edit-check{flex-direction:row!important;align-items:center!important;grid-column:1/-1!important;background:rgba(15,23,42,.55)!important;border:1px solid rgba(148,163,184,.18)!important;border-radius:14px!important;padding:10px 12px!important;}
.zt-edit-actions{display:flex!important;gap:8px!important;flex-wrap:wrap!important;margin-top:10px!important;}
.zt-edit-route-box{margin-top:14px!important;background:rgba(15,23,42,.45)!important;border:1px solid rgba(96,165,250,.20)!important;border-radius:16px!important;padding:12px!important;}
.zt-edit-route-box strong{display:block!important;color:#bfdbfe!important;margin-bottom:5px!important;}
.zt-edit-route-box p{margin:0 0 10px!important;color:#94a3b8!important;font-size:12px!important;}
body[data-it-theme="light"] .zt-edit-grid .input{background:#fff!important;color:#0f172a!important;border-color:#cbd5e1!important;}
body[data-it-theme="light"] .zt-edit-route-box,body[data-it-theme="light"] .zt-edit-check{background:#f8fafc!important;border-color:#cbd5e1!important;}
@media(max-width:1260px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro{height:150px!important;min-height:150px!important;max-height:150px!important;grid-template-columns:minmax(230px,1fr) minmax(170px,.74fr) minmax(160px,.7fr)!important;}
  :where(#net-tab-devices,#view-devices) .device-row-cell.cell-actions{grid-column:1/-1!important;}
  :where(#net-tab-devices,#view-devices) .row-actions.polished{grid-template-columns:repeat(5,minmax(0,1fr))!important;}
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-zerotier{height:156px!important;min-height:156px!important;max-height:156px!important;}
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik{height:168px!important;min-height:168px!important;max-height:168px!important;}
}
@media(max-width:760px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro{grid-template-columns:1fr!important;height:204px!important;min-height:204px!important;max-height:204px!important;padding:7px!important;gap:5px!important;}
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-zerotier{height:218px!important;min-height:218px!important;max-height:218px!important;}
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik{height:238px!important;min-height:238px!important;max-height:238px!important;}
  :where(#net-tab-devices,#view-devices) .row-actions.polished{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
  .zt-edit-grid,.zt-edit-grid.two{grid-template-columns:1fr!important;}
}

/* V248_HIDE_DUPLICATE_ACL_ROUTING_PAGES_START */
#view-device-acl,
#view-device-routing,
#navDeviceAclBtn,
#navDeviceRoutingBtn{display:none!important}
/* V248_HIDE_DUPLICATE_ACL_ROUTING_PAGES_END */

/* V252 Hybrid Gateway card inside network ZeroTier tab */
.zt-gateway-card{
  display:grid;
  grid-template-columns:minmax(220px,1.5fr) minmax(180px,.8fr) auto;
  gap:12px;
  align-items:center;
  margin:12px 0;
  padding:14px;
  border:1px solid rgba(148,163,184,.22);
  border-radius:16px;
  background:linear-gradient(135deg,rgba(15,23,42,.78),rgba(30,41,59,.48));
  box-shadow:0 12px 26px rgba(2,6,23,.18);
}
.zt-gateway-card h4{margin:2px 0 4px;font-size:15px;font-weight:900;color:var(--text,#e5edf8)}
.zt-gateway-card p{margin:0;color:var(--muted,#94a3b8);font-size:12px;line-height:1.6}
.zt-gateway-meta{display:flex;flex-direction:column;gap:5px;font-size:12px;color:var(--muted,#94a3b8)}
.zt-gateway-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
@media(max-width:900px){.zt-gateway-card{grid-template-columns:1fr}.zt-gateway-actions{justify-content:flex-start}}

/* V253_UNIFIED_DEVICE_DETAILS_START */
.unified-device-details-card{width:min(980px,96vw);max-height:92vh;overflow:auto}
.unified-device-details-body{display:flex;flex-direction:column;gap:12px}
.unified-device-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:12px;border:1px solid rgba(148,163,184,.18);border-radius:18px;background:rgba(15,23,42,.38)}
.unified-device-title-block{display:flex;align-items:center;gap:12px;min-width:0}
.unified-device-title-block h2{margin:0;font-size:1.15rem;line-height:1.2;color:var(--text,#e5eefc)}
.unified-device-title-block p{margin:4px 0 0;color:rgba(226,232,240,.72);font-size:.78rem;word-break:break-all}
.unified-device-hero-tags{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.unified-device-hero-tags span{border:1px solid rgba(148,163,184,.2);background:rgba(255,255,255,.06);border-radius:999px;padding:5px 9px;font-size:.78rem;color:rgba(226,232,240,.92)}
.unified-device-actions-row{display:flex;gap:7px;flex-wrap:wrap;align-items:center;padding:6px 0}
.unified-device-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.unified-device-grid section,.unified-device-routes{border:1px solid rgba(148,163,184,.16);background:rgba(2,6,23,.22);border-radius:16px;padding:12px;min-width:0}
.unified-device-grid h3,.unified-device-routes h3{margin:0 0 10px;font-size:.94rem;color:var(--text,#e5eefc)}
.unified-device-grid dl{margin:0;display:grid;gap:7px}
.unified-device-grid dl div{display:grid;grid-template-columns:110px minmax(0,1fr);gap:8px;align-items:start}
.unified-device-grid dt{font-size:.76rem;color:rgba(148,163,184,.95)}
.unified-device-grid dd{margin:0;font-size:.82rem;color:rgba(226,232,240,.96);min-width:0;word-break:break-word}
.unified-device-routes table{width:100%;border-collapse:collapse;font-size:.8rem;overflow:hidden;border-radius:12px}
.unified-device-routes th,.unified-device-routes td{padding:8px;border-bottom:1px solid rgba(148,163,184,.14);text-align:right;color:rgba(226,232,240,.92)}
.unified-device-routes th{color:rgba(148,163,184,.98);font-weight:700;background:rgba(15,23,42,.28)}
.device-health-dot.pending{background:#f59e0b;box-shadow:0 0 0 4px rgba(245,158,11,.12)}
@media(max-width:760px){.unified-device-hero{flex-direction:column}.unified-device-hero-tags{justify-content:flex-start}.unified-device-grid{grid-template-columns:1fr}.unified-device-grid dl div{grid-template-columns:92px minmax(0,1fr)}.unified-device-details-card{width:96vw}}
/* V253_UNIFIED_DEVICE_DETAILS_END */

/* V254_PERFORMANCE_STABILITY_START
   Fix lag/flicker on devices screen by reducing expensive repaints and row animations. */
.device-virtual-viewport{
  contain: layout paint style!important;
  content-visibility: auto;
  overflow-anchor: none;
}
.device-virtual-spacer{
  contain: layout paint!important;
  will-change: contents;
}
.device-virtual-row,
.device-row-pro{
  backface-visibility: hidden;
  transform-style: flat!important;
  transition: background .10s ease, border-color .10s ease!important;
}
.active-devices-section,
.pending-devices-section,
.members-cards-area{
  overflow-anchor: none;
}
@media (prefers-reduced-motion: reduce){
  .device-row-pro,.device-virtual-row,.networks-compact-card,.networks-enhanced-card,.card{transition:none!important;animation:none!important;}
}
/* V254_PERFORMANCE_STABILITY_END */

/* V257_DEVICE_GATEWAY_CLEANUP_START
   Final device-page cleanup: stable virtual rows + clear Hybrid Gateway card. */
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro{
  height:152px!important;
  min-height:152px!important;
  max-height:152px!important;
  grid-template-columns:minmax(230px,1.12fr) minmax(170px,.72fr) minmax(175px,.72fr) minmax(300px,.9fr)!important;
  gap:8px!important;
  padding:8px!important;
  overflow:hidden!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-zerotier,
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik,
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-row-pending{
  height:152px!important;
  min-height:152px!important;
  max-height:152px!important;
}
:where(#net-tab-devices,#view-devices) .device-row-cell{min-width:0!important;overflow:hidden!important;}
:where(#net-tab-devices,#view-devices) .device-main,
:where(#net-tab-devices,#view-devices) .device-metric-list.refined,
:where(#net-tab-devices,#view-devices) .device-status-card.refined{
  min-height:0!important;
  height:100%!important;
  padding:7px!important;
  border-radius:13px!important;
}
:where(#net-tab-devices,#view-devices) .device-title-row{gap:5px!important;flex-wrap:wrap!important;}
:where(#net-tab-devices,#view-devices) .device-name{max-width:210px!important;font-size:12.5px!important;}
:where(#net-tab-devices,#view-devices) .device-subtitle{display:-webkit-box!important;-webkit-line-clamp:1!important;-webkit-box-orient:vertical!important;overflow:hidden!important;}
:where(#net-tab-devices,#view-devices) .device-subline{max-height:23px!important;overflow:hidden!important;}
:where(#net-tab-devices,#view-devices) .device-metric-grid.compact{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
:where(#net-tab-devices,#view-devices) .metric-chip{min-height:32px!important;}
:where(#net-tab-devices,#view-devices) .metric-chip .metric-value{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;display:block!important;}
:where(#net-tab-devices,#view-devices) .time-stack.compact.refined span{min-height:23px!important;}
:where(#net-tab-devices,#view-devices) .row-actions.polished{
  display:grid!important;
  grid-template-columns:36px repeat(4,minmax(0,1fr))!important;
  gap:5px!important;
  align-content:center!important;
  align-items:center!important;
  height:100%!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished .row-btn{
  min-height:30px!important;
  height:30px!important;
  padding:5px 6px!important;
  font-size:10.2px!important;
  border-radius:10px!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished .row-btn.ping-icon{width:36px!important;min-width:36px!important;max-width:36px!important;padding:0!important;}
.zt-gateway-card.v257{
  grid-template-columns:minmax(230px,1fr) minmax(190px,.75fr) minmax(240px,1fr) minmax(240px,.9fr)!important;
  align-items:stretch!important;
  gap:10px!important;
  padding:13px!important;
}
.zt-gateway-card.v257 .zt-gateway-main,
.zt-gateway-card.v257 .zt-gateway-meta,
.zt-gateway-card.v257 .zt-gateway-checks,
.zt-gateway-card.v257 .zt-gateway-actions{
  background:rgba(2,6,23,.18)!important;
  border:1px solid rgba(148,163,184,.14)!important;
  border-radius:14px!important;
  padding:10px!important;
}
.zt-gateway-checks{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important;}
.zt-gateway-check{display:grid!important;grid-template-columns:20px 1fr!important;grid-template-rows:auto auto!important;gap:0 6px!important;align-items:center!important;padding:6px 7px!important;border-radius:11px!important;border:1px solid rgba(148,163,184,.16)!important;background:rgba(15,23,42,.35)!important;}
.zt-gateway-check b{grid-row:1/3;text-align:center;font-weight:1000!important;}
.zt-gateway-check.ok b{color:#22c55e!important}.zt-gateway-check.warn b{color:#f59e0b!important}
.zt-gateway-check em{font-style:normal!important;font-size:11px!important;font-weight:900!important;color:var(--text,#e5edf8)!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
.zt-gateway-check small{font-size:10px!important;color:var(--muted,#94a3b8)!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
.zt-gateway-card.v257 .zt-gateway-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;align-content:center!important;}
.zt-gateway-card.v257 .zt-gateway-actions .row-btn{min-height:32px!important;font-size:11px!important;padding:6px 8px!important;}
body[data-it-theme="light"] .zt-gateway-card.v257 .zt-gateway-main,
body[data-it-theme="light"] .zt-gateway-card.v257 .zt-gateway-meta,
body[data-it-theme="light"] .zt-gateway-card.v257 .zt-gateway-checks,
body[data-it-theme="light"] .zt-gateway-card.v257 .zt-gateway-actions{background:#f8fafc!important;border-color:#dbe3ef!important;}
body[data-it-theme="light"] .zt-gateway-check{background:#fff!important;border-color:#dbe3ef!important;}
@media(max-width:1260px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro,
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-zerotier,
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik,
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-row-pending{
    height:178px!important;min-height:178px!important;max-height:178px!important;
    grid-template-columns:minmax(235px,1fr) minmax(165px,.75fr) minmax(165px,.75fr)!important;
  }
  :where(#net-tab-devices,#view-devices) .device-row-cell.cell-actions{grid-column:1/-1!important;}
  :where(#net-tab-devices,#view-devices) .row-actions.polished{grid-template-columns:36px repeat(4,minmax(0,1fr))!important;}
  .zt-gateway-card.v257{grid-template-columns:1fr 1fr!important;}
}
@media(max-width:760px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro,
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-zerotier,
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik,
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-row-pending{
    height:236px!important;min-height:236px!important;max-height:236px!important;
    grid-template-columns:1fr!important;
  }
  :where(#net-tab-devices,#view-devices) .row-actions.polished{grid-template-columns:36px repeat(2,minmax(0,1fr))!important;}
  .zt-gateway-card.v257,.zt-gateway-card.v257 .zt-gateway-actions,.zt-gateway-checks{grid-template-columns:1fr!important;}
}
@media(max-width:420px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro,
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-zerotier,
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik,
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-row-pending{
    height:268px!important;min-height:268px!important;max-height:268px!important;
  }
}
/* V257_DEVICE_GATEWAY_CLEANUP_END */


/* V258_PERFORMANCE_DEVICE_STABILITY_START
   يحافظ على ثبات كروت الأجهزة ويقلل إعادة حساب التخطيط أثناء التحديثات الحية. */
.device-virtual-viewport{overflow-anchor:none;contain:layout paint;}
.device-virtual-spacer{position:relative;min-height:1px;}
.device-virtual-row{will-change:transform;contain:layout paint style;}
@supports (content-visibility:auto){
  .device-virtual-row{content-visibility:auto;contain-intrinsic-size:152px;}
}
@media (max-width:1260px){@supports (content-visibility:auto){.device-virtual-row{contain-intrinsic-size:178px;}}}
@media (max-width:760px){@supports (content-visibility:auto){.device-virtual-row{contain-intrinsic-size:236px;}}}
@media (max-width:420px){@supports (content-visibility:auto){.device-virtual-row{contain-intrinsic-size:268px;}}}
/* V258_PERFORMANCE_DEVICE_STABILITY_END */

/* V259_HEALTH_REPAIR_CENTER_UI_START */
.v259-health-center-card #repairCenterArea{scrollbar-width:thin;}
.v259-health-center-card .row-btn{min-height:30px;padding:6px 10px;border-radius:10px;font-size:12px;}
.v259-health-center-card{contain:layout paint;}
/* V259_HEALTH_REPAIR_CENTER_UI_END */


/* V265_USAGE_REPORTS_UI_START */
.device-head-actions-v265{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.device-head-actions-v265 .network-clean-secondary{font-size:12px;padding:6px 10px}
@media(max-width:700px){.device-head-actions-v265{width:100%}.device-head-actions-v265 .network-clean-secondary{flex:1 1 auto}}
/* V265_USAGE_REPORTS_UI_END */

/* V287_CONNECTION_STATES_COLORS_FIX_START
   Canonical status colors for every device row.
   Online = green, warning = amber, pending = amber, offline = red,
   blocked = slate, deleted = rose. Ping diagnostics never paint ZeroTier online. */
:where(#net-tab-devices,#view-devices) .latency-offline,
:where(#net-tab-devices,#view-devices) .status-quality.latency-offline{
  background:rgba(239,68,68,.14)!important;color:#fecaca!important;border-color:rgba(239,68,68,.30)!important;
}
:where(#net-tab-devices,#view-devices) .latency-pending,
:where(#net-tab-devices,#view-devices) .status-quality.latency-pending{
  background:rgba(245,158,11,.14)!important;color:#fde68a!important;border-color:rgba(245,158,11,.30)!important;
}
:where(#net-tab-devices,#view-devices) .latency-blocked,
:where(#net-tab-devices,#view-devices) .status-quality.latency-blocked{
  background:rgba(100,116,139,.18)!important;color:#cbd5e1!important;border-color:rgba(148,163,184,.28)!important;
}
:where(#net-tab-devices,#view-devices) .latency-deleted,
:where(#net-tab-devices,#view-devices) .status-quality.latency-deleted{
  background:rgba(244,63,94,.14)!important;color:#fecdd3!important;border-color:rgba(244,63,94,.30)!important;
}
:where(#net-tab-devices,#view-devices) .path-blocked{
  background:rgba(100,116,139,.18)!important;color:#cbd5e1!important;border-color:rgba(148,163,184,.28)!important;
}
:where(#net-tab-devices,#view-devices) .path-deleted{
  background:rgba(244,63,94,.14)!important;color:#fecdd3!important;border-color:rgba(244,63,94,.30)!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-state-blocked .device-health-dot{
  background:#64748b!important;box-shadow:0 0 0 4px rgba(100,116,139,.16)!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-state-deleted .device-health-dot{
  background:#f43f5e!important;box-shadow:0 0 0 4px rgba(244,63,94,.16)!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-state-offline .status-quality,
:where(#net-tab-devices,#view-devices) .device-row.device-state-offline .latency-pill{
  background:rgba(239,68,68,.12)!important;color:#fecaca!important;border-color:rgba(239,68,68,.26)!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-state-pending .status-quality,
:where(#net-tab-devices,#view-devices) .device-row.device-state-pending .latency-pill{
  background:rgba(245,158,11,.12)!important;color:#fde68a!important;border-color:rgba(245,158,11,.26)!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-state-blocked .status-quality,
:where(#net-tab-devices,#view-devices) .device-row.device-state-blocked .latency-pill{
  background:rgba(100,116,139,.16)!important;color:#cbd5e1!important;border-color:rgba(148,163,184,.24)!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-state-deleted{
  border-color:rgba(244,63,94,.38)!important;filter:saturate(.92)!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-state-deleted .device-status-label-v127{
  background:rgba(244,63,94,.13)!important;color:#fecdd3!important;border-color:rgba(244,63,94,.26)!important;
}
:where(#net-tab-devices,#view-devices) .device-kind-zerotier.device-state-offline .path-pill,
:where(#net-tab-devices,#view-devices) .device-kind-zerotier.device-state-offline .device-status-label-v127{
  background:rgba(239,68,68,.13)!important;color:#fecaca!important;border-color:rgba(239,68,68,.28)!important;
}
:where(#net-tab-devices,#view-devices) .device-kind-zerotier.device-state-offline .device-health-dot{
  background:#ef4444!important;box-shadow:0 0 0 4px rgba(239,68,68,.16)!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-state-online:not(.device-state-warning) .status-quality{
  background:rgba(34,197,94,.12)!important;color:#86efac!important;border-color:rgba(34,197,94,.24)!important;
}
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .latency-offline,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .status-quality.latency-offline,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .device-row.device-state-offline .status-quality,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .device-row.device-state-offline .latency-pill{
  background:#fef2f2!important;color:#b91c1c!important;border-color:#fecaca!important;
}
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .latency-pending,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .status-quality.latency-pending,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .device-row.device-state-pending .status-quality,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .device-row.device-state-pending .latency-pill{
  background:#fffbeb!important;color:#92400e!important;border-color:#fde68a!important;
}
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .latency-blocked,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .status-quality.latency-blocked,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .path-blocked,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .device-row.device-state-blocked .status-quality,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .device-row.device-state-blocked .latency-pill{
  background:#f1f5f9!important;color:#475569!important;border-color:#cbd5e1!important;
}
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .device-row.device-state-online:not(.device-state-warning) .status-quality{
  background:#ecfdf5!important;color:#047857!important;border-color:#a7f3d0!important;
}
/* V287_CONNECTION_STATES_COLORS_FIX_END */

/* V292_SETTINGS_SCREEN_SAFE_LAYOUT_FIX_START
   تنسيق شاشة إعدادات الشبكة فقط. لا يغير أسماء IDs ولا onclick ولا API. */
#net-tab-settings{
  width:100%!important;
  max-width:1480px!important;
  margin-inline:auto!important;
  padding-bottom:28px!important;
}
#net-tab-settings > .flex.justify-between.items-center{
  align-items:stretch!important;
  padding:18px 20px!important;
  margin-bottom:18px!important;
  border-radius:28px!important;
  border:1px solid rgba(96,165,250,.16)!important;
  background:linear-gradient(135deg,rgba(12,22,42,.94),rgba(5,13,27,.88))!important;
  box-shadow:0 18px 42px rgba(2,6,23,.22), inset 0 1px 0 rgba(255,255,255,.035)!important;
}
#net-tab-settings > .flex.justify-between.items-center > div:first-child{
  min-width:0!important;
  flex:1 1 520px!important;
}
#net-tab-settings #advancedSettingsToggleBtn{
  align-self:center!important;
  min-height:44px!important;
  border-radius:16px!important;
  padding-inline:18px!important;
  white-space:nowrap!important;
}
#net-tab-settings .settings-hero-note{
  max-width:860px!important;
  margin:6px 0 0!important;
  color:#9fb2cb!important;
  font-size:13px!important;
  line-height:1.9!important;
}
#net-tab-settings .settings-quick-strip{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr))!important;
  gap:14px!important;
  margin-bottom:18px!important;
}
#net-tab-settings .settings-quick-card{
  min-height:118px!important;
  padding:16px 18px!important;
  border-radius:22px!important;
  overflow:hidden!important;
}
#net-tab-settings .settings-quick-card strong{
  font-size:14px!important;
  line-height:1.55!important;
  white-space:normal!important;
}
#net-tab-settings .settings-quick-card p{
  font-size:12px!important;
  line-height:1.75!important;
}
#net-tab-settings #advancedSettingsGrid{
  display:grid!important;
  grid-template-columns:repeat(12,minmax(0,1fr))!important;
  align-items:start!important;
  gap:18px!important;
}
#net-tab-settings .settings-stack-card{
  min-width:0!important;
  padding:20px!important;
  border-radius:24px!important;
}
#net-tab-settings .settings-stack-card-elevated::after{
  inset:0 0 0 auto!important;
  width:4px!important;
}
#net-tab-settings .settings-panel-head{
  align-items:flex-start!important;
  padding-bottom:12px!important;
  margin-bottom:14px!important;
  border-bottom:1px solid rgba(148,163,184,.10)!important;
}
#net-tab-settings .settings-panel-head h3{
  line-height:1.4!important;
  margin:0!important;
}
#net-tab-settings .settings-panel-note{
  margin-top:5px!important;
  color:#95a8c3!important;
  line-height:1.85!important;
}
#net-tab-settings .settings-mini-badge,
#net-tab-settings .section-chip{
  flex:0 0 auto!important;
}
#net-tab-settings :where(input,select,textarea).input-glass{
  min-height:46px!important;
  border-radius:14px!important;
  font-size:13px!important;
  line-height:1.55!important;
}
#net-tab-settings textarea.input-glass{
  resize:vertical!important;
}
#net-tab-settings :where(button,.btn-primary,.action-btn){
  min-height:44px!important;
  border-radius:14px!important;
}
#net-tab-settings .mode-btn{
  min-height:42px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
#net-tab-settings #ipGridArea{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:12px!important;
}
#net-tab-settings .ip-preset-group{
  width:100%!important;
  grid-column:1 / -1!important;
  border:1px solid rgba(59,130,246,.14)!important;
  background:rgba(15,23,42,.42)!important;
  border-radius:18px!important;
  padding:10px!important;
}
#net-tab-settings .ip-preset-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:8px!important;
  margin-bottom:8px!important;
  direction:rtl!important;
}
#net-tab-settings .ip-preset-head strong{
  color:#e2e8f0!important;
  font-size:12px!important;
  font-weight:900!important;
}
#net-tab-settings .ip-preset-head small{
  color:#94a3b8!important;
  font-size:10px!important;
  line-height:1.4!important;
}
#net-tab-settings .ip-preset-buttons{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(122px,1fr))!important;
  gap:8px!important;
}
#net-tab-settings #ipGridArea .ip-btn{
  width:100%!important;
  min-height:38px!important;
  text-align:center!important;
}
#net-tab-settings #ipGridArea .ip-btn.is-used{
  opacity:.42!important;
  cursor:not-allowed!important;
}
#net-tab-settings #ipGridArea .ip-btn span{
  display:block!important;
  font-size:9px!important;
  line-height:1.2!important;
  opacity:.85!important;
  margin-top:2px!important;
}
#net-tab-settings .bridge-control-grid{
  display:grid!important;
  grid-template-columns:minmax(260px,1fr) minmax(220px,.85fr)!important;
  gap:12px!important;
}
#net-tab-settings .bridge-subnet-box,
#net-tab-settings #bridgeLinkedList{
  overflow-wrap:anywhere!important;
}
#net-tab-settings .settings-stack-card-danger{
  align-items:stretch!important;
}
#net-tab-settings .settings-stack-card-danger .settings-panel-note,
#net-tab-settings .settings-stack-card-danger p{
  max-width:100%!important;
}
#net-tab-settings #deleteNetworkBtn{
  max-width:360px!important;
  margin-inline:auto!important;
}
body[data-it-theme="light"] #net-tab-settings > .flex.justify-between.items-center{
  background:linear-gradient(135deg,#ffffff,#eef6ff)!important;
  border-color:rgba(37,99,235,.16)!important;
}
body[data-it-theme="light"] #net-tab-settings .settings-hero-note,
body[data-it-theme="light"] #net-tab-settings .settings-panel-note,
body[data-it-theme="light"] #net-tab-settings .settings-quick-card p{
  color:#53667f!important;
}
body[data-it-theme="light"] #net-tab-settings .settings-stack-card-elevated,
body[data-it-theme="light"] #net-tab-settings .settings-quick-card{
  background:linear-gradient(180deg,#ffffff,#f3f7fc)!important;
  border-color:rgba(89,111,140,.18)!important;
}
@media (max-width:1700px) and (min-width:981px){
  #net-tab-settings{max-width:1180px!important;}
  #net-tab-settings #advancedSettingsGrid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  #net-tab-settings #advancedSettingsGrid > .settings-stack-card{
    grid-column:auto!important;
  }
  #net-tab-settings #advancedSettingsGrid > .settings-stack-card:nth-child(1),
  #net-tab-settings #advancedSettingsGrid > .settings-stack-card:nth-child(5){
    grid-column:1 / -1!important;
  }
  #net-tab-settings #advancedSettingsGrid > .settings-stack-card:nth-child(4){
    grid-column:1 / span 1!important;
  }
  #net-tab-settings #advancedSettingsGrid > .settings-stack-card:nth-child(6){
    grid-column:2 / span 1!important;
  }
  #net-tab-settings #advancedSettingsGrid > .settings-stack-card:nth-child(3) .grid.grid-cols-2{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }
}
@media (max-width:1180px){
  #net-tab-settings #advancedSettingsGrid{
    grid-template-columns:1fr!important;
  }
  #net-tab-settings #advancedSettingsGrid > .settings-stack-card{
    grid-column:1 / -1!important;
  }
  #net-tab-settings .bridge-control-grid{
    grid-template-columns:1fr!important;
  }
}
@media (max-width:720px){
  #net-tab-settings > .flex.justify-between.items-center{
    padding:14px!important;
    border-radius:20px!important;
  }
  #net-tab-settings #advancedSettingsToggleBtn{
    width:100%!important;
  }
  #net-tab-settings .settings-stack-card{
    padding:16px!important;
    border-radius:20px!important;
  }
  #net-tab-settings .settings-panel-head{
    flex-direction:column!important;
  }
  #net-tab-settings .settings-quick-strip{
    grid-template-columns:1fr!important;
  }
  #net-tab-settings #ipGridArea{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  #net-tab-settings .flex.gap-2{
    flex-wrap:wrap!important;
  }
  #net-tab-settings .flex.gap-2 > button{
    flex:1 1 120px!important;
  }
}
/* V292_SETTINGS_SCREEN_SAFE_LAYOUT_FIX_END */

/* V298_WG_EDIT_MODAL_COMPACT_FIX_START
   تصغير نافذة تعديل بيانات جهاز WireGuard بدون تغيير أي وظائف أو IDs */
#modalBackdrop{
  align-items:center!important;
  justify-content:center!important;
  padding:16px!important;
}
#modalBackdrop > .card{
  width:min(520px, calc(100vw - 32px))!important;
  max-width:520px!important;
  min-width:0!important;
  max-height:calc(100vh - 36px)!important;
  overflow:auto!important;
  padding:18px!important;
  border-radius:22px!important;
  box-shadow:0 22px 70px rgba(2,6,23,.56)!important;
}
#modalBackdrop > .card::-webkit-scrollbar{width:8px;height:8px;}
#modalBackdrop > .card::-webkit-scrollbar-thumb{background:rgba(96,165,250,.28);border-radius:999px;}
#modalBackdrop #modalTitle{
  font-size:18px!important;
  line-height:1.35!important;
  margin-bottom:12px!important;
  padding-bottom:10px!important;
  padding-inline-start:28px!important;
}
#modalBackdrop #modalInfo{
  gap:10px!important;
}
#modalBackdrop #modalInfo > .rounded-2xl{
  padding:10px!important;
  border-radius:16px!important;
  gap:6px!important;
}
#modalBackdrop #modalInfo label{
  margin-bottom:5px!important;
  font-size:10px!important;
}
#modalBackdrop #modalInfo .input-glass,
#modalBackdrop #modalInfo input,
#modalBackdrop #modalInfo textarea{
  min-height:38px!important;
  padding:9px 12px!important;
  font-size:13px!important;
  border-radius:13px!important;
}
#modalBackdrop #editDescription{
  height:54px!important;
  min-height:54px!important;
  resize:vertical!important;
}
#modalBackdrop #editDeviceIdMeta{
  max-width:290px!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  direction:ltr!important;
  text-align:left!important;
}
#modalBackdrop #wireguardEditHintV297{
  font-size:10.5px!important;
  line-height:1.7!important;
}
#modalBackdrop #mikrotikManageFields{
  padding:12px!important;
  border-radius:16px!important;
  max-height:42vh!important;
  overflow:auto!important;
}
#modalBackdrop #mikrotikManageFields .grid{
  gap:8px!important;
}
#modalBackdrop #wireguardEditDownloadConfigBtn,
#modalBackdrop #deviceInfoSaveBtn{
  min-height:40px!important;
  padding:9px 12px!important;
  border-radius:13px!important;
  font-size:13px!important;
}
#modalBackdrop button[onclick="closeModal()"]{
  top:12px!important;
  right:12px!important;
  width:30px!important;
  height:30px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:10px!important;
  background:rgba(15,23,42,.55)!important;
}
@media (max-width:640px){
  #modalBackdrop{padding:10px!important;}
  #modalBackdrop > .card{
    width:calc(100vw - 20px)!important;
    max-width:calc(100vw - 20px)!important;
    max-height:calc(100vh - 20px)!important;
    padding:14px!important;
    border-radius:18px!important;
  }
  #modalBackdrop #modalTitle{font-size:16px!important;}
  #modalBackdrop #editDeviceIdMeta{max-width:190px!important;}
  #modalBackdrop #modalInfo .grid{grid-template-columns:1fr!important;}
}
/* V298_WG_EDIT_MODAL_COMPACT_FIX_END */

/* V299_DESIGN_POLISH_SAFE_START
   تسليم تصميم آمن: تلميع بصري فقط بدون تغيير APIs أو IDs أو منطق التشغيل. */
html,
body{
  max-width:100%!important;
  overflow-x:hidden!important;
}
body[data-it-theme="dark"],
html[data-it-theme="dark"] body{
  background:
    radial-gradient(circle at 14% 0%, rgba(37,99,235,.18), transparent 31%),
    radial-gradient(circle at 88% 8%, rgba(14,165,233,.10), transparent 27%),
    linear-gradient(180deg,#0b1220 0%,#0f172a 44%,#111827 100%)!important;
  color:#e5edf7!important;
}
body[data-it-theme="light"],
html[data-it-theme="light"] body{
  background:
    radial-gradient(circle at 14% 0%, rgba(37,99,235,.10), transparent 30%),
    radial-gradient(circle at 90% 6%, rgba(183,121,31,.10), transparent 28%),
    linear-gradient(180deg,#f8fbff 0%,#edf4fb 100%)!important;
  color:#0f172a!important;
}
.app-shell{
  width:min(100%, 1740px)!important;
  margin-inline:auto!important;
  gap:18px!important;
}
#appView.app-shell > main{
  min-width:0!important;
}
body[data-it-theme="dark"] :where(.section-shell,.card,.compact-card,.device-card,.device-row,.network-list-card,.network-command-card,.networks-compact-card,.network-clean-header,.network-kpi-card,.table-shell,.chart-shell,.ping-card,.branch-metric-card,.alert-row-card,.audit-row-card,.operations-log-shell,.settings-stack-card){
  background:linear-gradient(180deg,rgba(15,23,42,.96),rgba(9,15,27,.92))!important;
  border-color:rgba(96,165,250,.20)!important;
  box-shadow:0 14px 34px rgba(2,6,23,.34), inset 0 1px 0 rgba(255,255,255,.045)!important;
}
body[data-it-theme="light"] :where(.section-shell,.card,.compact-card,.device-card,.device-row,.network-list-card,.network-command-card,.networks-compact-card,.network-clean-header,.network-kpi-card,.table-shell,.chart-shell,.ping-card,.branch-metric-card,.alert-row-card,.audit-row-card,.operations-log-shell,.settings-stack-card){
  background:linear-gradient(180deg,#ffffff,#f6f9fd)!important;
  border-color:rgba(92,114,142,.28)!important;
  box-shadow:0 12px 28px rgba(30,45,70,.10), inset 0 1px 0 rgba(255,255,255,.95)!important;
}
body[data-it-theme] :where(.section-shell,.card,.compact-card,.device-card,.device-row,.network-list-card,.network-command-card,.networks-compact-card,.network-clean-header,.network-kpi-card,.table-shell,.chart-shell,.ping-card,.branch-metric-card,.alert-row-card,.audit-row-card,.operations-log-shell,.settings-stack-card){
  border-radius:18px!important;
  transition:box-shadow .16s ease,border-color .16s ease,transform .16s ease!important;
}
@media (hover:hover){
  body[data-it-theme] :where(.card,.device-card,.device-row,.network-list-card,.network-command-card,.settings-stack-card):hover{
    transform:translateY(-1px)!important;
  }
}

/* Dashboard polish */
#view-dashboard.dashboard-grid-tight{
  gap:10px!important;
}
#view-dashboard .dashboard-toolbar{
  min-height:52px!important;
  padding:10px 14px!important;
  align-items:center!important;
}
#view-dashboard .dashboard-toolbar .panel-title{
  font-size:clamp(22px,1.65vw,28px)!important;
}
#view-dashboard .dashboard-toolbar-actions{
  gap:8px!important;
}
#view-dashboard .dashboard-toolbar-actions .action-btn,
#view-dashboard .dashboard-toolbar-actions .toolbar-btn{
  min-height:34px!important;
  padding:6px 12px!important;
  border-radius:12px!important;
  white-space:nowrap!important;
}
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4{
  gap:9px!important;
}
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 > .card{
  min-height:62px!important;
  padding:9px 12px!important;
  border-radius:16px!important;
}
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 > .card h3{
  font-size:10px!important;
}
#view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 > .card p{
  font-size:clamp(22px,1.9vw,29px)!important;
}
#view-dashboard .mini-kpi-grid{
  grid-template-columns:minmax(285px,.95fr) minmax(280px,1fr) minmax(280px,1fr)!important;
  gap:9px!important;
}
#view-dashboard .mini-kpi-grid > .card{
  min-height:148px!important;
  max-height:188px!important;
  padding:12px!important;
  border-radius:17px!important;
}
#view-dashboard .mini-kpi-grid h3{
  font-size:15px!important;
  margin-bottom:7px!important;
}
#view-dashboard .ai-grid-compact{
  grid-template-columns:88px minmax(0,1fr)!important;
  gap:9px!important;
}
#view-dashboard .ai-circle{
  width:84px!important;
  height:84px!important;
}
#view-dashboard .ai-terminal-box{
  min-height:104px!important;
  max-height:122px!important;
  border-radius:13px!important;
}
#view-dashboard #healthSummaryArea{
  gap:6px!important;
}
#view-dashboard #healthSummaryArea > div{
  min-height:58px!important;
  padding:6px!important;
  border-radius:12px!important;
}
#view-dashboard .v259-health-center-card .row-btn{
  min-height:30px!important;
  padding:5px 10px!important;
  border-radius:10px!important;
  font-size:11px!important;
}
#view-dashboard #repairCenterArea,
#view-dashboard #auditLogArea{
  max-height:110px!important;
  overflow:auto!important;
}
#view-dashboard .dashboard-line-chart-card,
#view-dashboard .dashboard-analytics-grid > .card{
  min-height:232px!important;
  padding:12px!important;
  border-radius:17px!important;
}
#view-dashboard .dashboard-analytics-grid .chart-shell{
  height:188px!important;
  border-radius:13px!important;
}
#view-dashboard .dashboard-analytics-grid canvas{
  max-height:174px!important;
}
#view-dashboard > .grid.grid-cols-1.lg\:grid-cols-2.gap-6{
  gap:9px!important;
}
#view-dashboard > .grid.grid-cols-1.lg\:grid-cols-2.gap-6 > .card{
  min-height:124px!important;
  padding:12px!important;
}
#view-dashboard #branchMetricsArea,
#view-dashboard #globalAlertsArea{
  max-height:210px!important;
  overflow:auto!important;
}
#view-dashboard #globalAlertsArea:empty::before,
#view-dashboard #auditLogArea:empty::before,
#view-dashboard #branchMetricsArea:empty::before,
#view-dashboard #healthSummaryArea:empty::before,
#view-dashboard #repairCenterArea:empty::before{
  content:"لا توجد بيانات للعرض الآن";
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:54px;
  padding:12px;
  border-radius:14px;
  border:1px dashed rgba(148,163,184,.25);
  color:#94a3b8;
  font-size:12px;
  font-weight:800;
  background:rgba(148,163,184,.055);
}
#view-dashboard #healthSummaryArea:empty::before{
  grid-column:1/-1;
}

/* Network details polish */
#view-net-details .net-header-shell,
#view-net-details .network-summary-shell{
  border-radius:18px!important;
  padding:13px!important;
}
#view-net-details .net-header-actions,
#view-net-details .network-summary-actions,
#view-net-details .network-quick-actions{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:7px!important;
  align-items:center!important;
}
#view-net-details .net-header-actions > button,
#view-net-details .network-summary-actions > button,
#view-net-details .network-quick-actions > button,
#view-net-details .network-quick-actions .action-btn{
  min-height:36px!important;
  border-radius:12px!important;
  padding:7px 12px!important;
  font-size:12px!important;
  white-space:nowrap!important;
}
#view-net-details .net-tabs-bar{
  margin-bottom:12px!important;
  gap:7px!important;
  padding-bottom:4px!important;
}
#view-net-details .tab-btn{
  min-height:36px!important;
  padding:7px 13px!important;
  border-radius:12px!important;
  white-space:nowrap!important;
}
#view-net-details .network-quick-card{
  gap:10px!important;
}
#view-net-details .network-quick-grid,
#view-net-details .network-quick-grid-pro,
#view-net-details .network-quick-grid-wide{
  gap:8px!important;
}
#view-net-details .network-quick-item{
  padding:10px!important;
  border-radius:14px!important;
  min-width:0!important;
}
#view-net-details .network-quick-value{
  min-height:18px!important;
  line-height:1.35!important;
}
#view-net-details .network-quick-value.mono,
#view-net-details .network-hero-badge .mono{
  unicode-bidi:plaintext!important;
  direction:ltr!important;
  text-align:left!important;
}
#view-net-details .network-quick-qr-box{
  width:220px!important;
  height:220px!important;
  border-radius:18px!important;
}
#view-net-details .network-quick-note{
  font-size:10.5px!important;
}
#view-net-details :where(#membersCardsArea,#ztMembersArea,#fleetActivityArea,#routesArea,#ipGridArea):empty::before{
  content:"لا توجد بيانات هنا حتى الآن";
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:68px;
  padding:14px;
  border-radius:16px;
  border:1px dashed rgba(148,163,184,.25);
  color:#94a3b8;
  font-size:12px;
  font-weight:850;
  background:rgba(148,163,184,.055);
}

/* Buttons and forms safety */
.action-btn,
.btn-primary,
.row-btn,
.toolbar-btn,
.network-quick-copy,
.ip-btn{
  -webkit-tap-highlight-color:transparent!important;
  touch-action:manipulation!important;
}
.input-glass,
select,
textarea,
input{
  max-width:100%!important;
}
.table-shell,
.zt-table-wrap,
#view-net-details .overflow-x-auto{
  overflow-x:auto!important;
  -webkit-overflow-scrolling:touch!important;
}
.zt-table th,
.zt-table td{
  vertical-align:middle!important;
}

/* Modal final safety */
#modalBackdrop,
#modalRemote,
#modalDiag,
#modalRouteDiag,
#modalTokenManager{
  overflow:auto!important;
  overscroll-behavior:contain!important;
}
#modalBackdrop > .card,
#modalRemote > .card,
#modalDiag > .card,
#modalRouteDiag > .card,
#modalTokenManager > .card{
  max-width:calc(100vw - 28px)!important;
  max-height:calc(100vh - 28px)!important;
}

@media (max-width:1280px){
  .app-shell{gap:14px!important;}
  #view-dashboard .mini-kpi-grid{grid-template-columns:1fr 1fr!important;}
  #view-dashboard .mini-kpi-grid > .ai-card-compact{grid-column:1/-1!important;}
  #view-dashboard .dashboard-analytics-grid{grid-template-columns:1fr!important;}
}
@media (max-width:900px){
  #view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  #view-dashboard .mini-kpi-grid{grid-template-columns:1fr!important;}
  #view-dashboard #healthSummaryArea{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  #view-dashboard .ping-input-row{grid-template-columns:1fr!important;}
  #view-net-details .network-quick-qr-box{width:190px!important;height:190px!important;}
}
@media (max-width:768px){
  body[data-it-theme],html[data-it-theme] body{overflow-x:hidden!important;}
  .app-shell{padding:10px!important;gap:10px!important;}
  .dashboard-toolbar,
  .networks-toolbar,
  #view-net-details .net-header-shell,
  #view-net-details .network-summary-shell{
    align-items:stretch!important;
  }
  .dashboard-toolbar-actions,
  .networks-toolbar-actions,
  #view-net-details .net-header-actions,
  #view-net-details .network-summary-actions{
    width:100%!important;
  }
  .dashboard-toolbar-actions > *,
  .networks-toolbar-actions > *,
  #view-net-details .net-header-actions > *,
  #view-net-details .network-summary-actions > *{
    flex:1 1 130px!important;
  }
  #view-dashboard > .grid.grid-cols-2.md\:grid-cols-5.gap-4 > .card{
    min-height:58px!important;
  }
  #view-dashboard .dashboard-line-chart-card,
  #view-dashboard .dashboard-analytics-grid > .card{
    min-height:198px!important;
  }
  #view-dashboard .dashboard-analytics-grid .chart-shell{
    height:158px!important;
  }
  #view-net-details .network-quick-grid,
  #view-net-details .network-quick-grid-pro,
  #view-net-details .network-quick-grid-wide{
    grid-template-columns:1fr!important;
  }
  #view-net-details .network-quick-item-span{grid-column:span 1!important;}
  #view-net-details .network-quick-qr-box{width:176px!important;height:176px!important;}
}
/* V299_DESIGN_POLISH_SAFE_END */


/* V342_OPERATION_CENTER_SAFE_START */
.v342-operation-center-card{border-color:rgba(34,211,238,.22)!important;background:linear-gradient(135deg,rgba(8,24,39,.96),rgba(14,23,42,.94))!important;box-shadow:0 18px 50px rgba(8,145,178,.12)}
.v342-op-kpi-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}
@media (min-width:768px){.v342-op-kpi-grid{grid-template-columns:repeat(4,minmax(0,1fr));}}
.v342-op-kpi{border:1px solid rgba(148,163,184,.18);border-radius:16px;padding:.8rem .9rem;background:rgba(15,23,42,.7);display:flex;align-items:center;justify-content:space-between;gap:.8rem;min-height:62px}
.v342-op-kpi span{font-size:.72rem;color:#94a3b8;font-weight:800}.v342-op-kpi strong{font-size:1.25rem;color:#e2e8f0;font-weight:1000;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.v342-op-kpi.ok strong{color:#34d399}.v342-op-kpi.warn strong{color:#fbbf24}.v342-op-kpi.bad strong{color:#fb7185}.v342-op-kpi.info strong{color:#67e8f9}
.v342-op-actions{display:grid;grid-template-columns:1fr;gap:.55rem}.v342-op-action{border-radius:14px;padding:.72rem .85rem;border:1px solid rgba(148,163,184,.18);background:rgba(2,6,23,.42);display:flex;flex-direction:column;gap:.18rem}.v342-op-action strong{font-size:.82rem;color:#f8fafc}.v342-op-action span{font-size:.76rem;color:#cbd5e1}.v342-op-action small{font-size:.7rem;color:#94a3b8;line-height:1.65}.v342-op-action.ok{border-color:rgba(52,211,153,.24);background:rgba(6,78,59,.16)}.v342-op-action.warn{border-color:rgba(251,191,36,.26);background:rgba(120,53,15,.16)}.v342-op-action.bad{border-color:rgba(251,113,133,.28);background:rgba(127,29,29,.16)}.v342-op-action.info{border-color:rgba(103,232,249,.22);background:rgba(22,78,99,.16)}
/* V342_OPERATION_CENTER_SAFE_END */

/* V343_INSTALL_PANEL_ORGANIZED_NO_DELETE_POLISH_START */
.v343-safe-polish-note{border:1px solid rgba(34,211,238,.22);background:rgba(8,47,73,.18);border-radius:16px;padding:.85rem 1rem;color:#dbeafe;line-height:1.8}
.card.compact-card,.card{scroll-margin-top:88px}
.row-btn,.btn,.btn-primary,.btn-secondary{transition:transform .12s ease,filter .12s ease,box-shadow .12s ease}
.row-btn:hover,.btn:hover,.btn-primary:hover,.btn-secondary:hover{transform:translateY(-1px);filter:brightness(1.04)}
.v342-operation-center-card .row-btn{border-radius:12px!important}
.v342-operation-center-card .v342-op-kpi{box-shadow:inset 0 1px rgba(255,255,255,.04)}
.v342-operation-center-card .v342-op-action{box-shadow:0 10px 26px rgba(2,6,23,.12)}
@media (max-width: 768px){
  .card.compact-card{border-radius:16px!important;padding:1rem!important}
  .v342-op-kpi-grid{grid-template-columns:1fr!important}
}
/* V343_INSTALL_PANEL_ORGANIZED_NO_DELETE_POLISH_END */



/* V344_DASHBOARD_DEVICE_POLISH_NO_DELETE_START */
.v344-status-legend{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem;margin-top:.85rem}
@media (min-width:920px){.v344-status-legend{grid-template-columns:repeat(6,minmax(0,1fr));}}
.v344-legend-chip{border:1px solid rgba(148,163,184,.18);border-radius:14px;padding:.62rem .7rem;background:rgba(15,23,42,.58);display:flex;align-items:center;justify-content:space-between;gap:.5rem;min-height:46px;box-shadow:inset 0 1px rgba(255,255,255,.035)}
.v344-legend-chip span{font-size:.7rem;font-weight:900;color:#cbd5e1;white-space:nowrap}.v344-legend-chip strong{font-size:1rem;font-weight:1000;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:#e2e8f0}
.v344-legend-chip.ok{border-color:rgba(52,211,153,.28);background:rgba(6,78,59,.18)}.v344-legend-chip.ok strong{color:#34d399}
.v344-legend-chip.info{border-color:rgba(103,232,249,.22);background:rgba(22,78,99,.18)}.v344-legend-chip.info strong{color:#67e8f9}
.v344-legend-chip.warn{border-color:rgba(251,191,36,.28);background:rgba(120,53,15,.18)}.v344-legend-chip.warn strong{color:#fbbf24}
.v344-legend-chip.bad{border-color:rgba(251,113,133,.30);background:rgba(127,29,29,.18)}.v344-legend-chip.bad strong{color:#fb7185}
.device-diagnosis-chip{font-weight:1000!important;border-width:1px!important}.device-diagnosis-chip.ok{color:#86efac!important;border-color:rgba(34,197,94,.28)!important;background:rgba(22,101,52,.18)!important}.device-diagnosis-chip.info{color:#67e8f9!important;border-color:rgba(14,165,233,.25)!important;background:rgba(12,74,110,.18)!important}.device-diagnosis-chip.warn{color:#fde68a!important;border-color:rgba(245,158,11,.30)!important;background:rgba(120,53,15,.20)!important}.device-diagnosis-chip.bad{color:#fecdd3!important;border-color:rgba(244,63,94,.32)!important;background:rgba(127,29,29,.20)!important}.device-diagnosis-chip.muted{color:#cbd5e1!important;border-color:rgba(148,163,184,.18)!important;background:rgba(51,65,85,.18)!important}
:where(#net-tab-devices,#view-devices) .device-row.device-diagnosis-ping_failed{border-color:rgba(245,158,11,.38)!important;box-shadow:0 16px 38px rgba(120,53,15,.10)!important}
:where(#net-tab-devices,#view-devices) .device-row.device-diagnosis-config_issue,:where(#net-tab-devices,#view-devices) .device-row.device-diagnosis-route_issue{border-color:rgba(244,63,94,.38)!important;box-shadow:0 16px 38px rgba(127,29,29,.12)!important}
body[data-it-theme="light"] .v344-legend-chip{background:rgba(255,255,255,.82);border-color:rgba(15,23,42,.10)}
body[data-it-theme="light"] .v344-legend-chip span{color:#475569}body[data-it-theme="light"] .v344-legend-chip strong{color:#0f172a}
/* V344_DASHBOARD_DEVICE_POLISH_NO_DELETE_END */


/* V345_BACKUP_RESTORE_PREVIEW_POLISH_NO_DELETE */
.backup-preview-panel{border:1px solid rgba(248,113,113,.22);background:linear-gradient(180deg,rgba(30,41,59,.72),rgba(15,23,42,.84));border-radius:22px;padding:16px;box-shadow:0 14px 30px rgba(0,0,0,.18)}
.backup-preview-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.backup-preview-title{font-size:15px;font-weight:900;color:#fee2e2;margin:0}
.backup-preview-badge{display:inline-flex;align-items:center;border-radius:999px;padding:7px 11px;background:rgba(14,165,233,.12);border:1px solid rgba(56,189,248,.22);color:#bae6fd;font-size:12px;font-weight:900}
.backup-preview-body{font-size:12px;color:#cbd5e1;line-height:1.8}
.backup-preview-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:12px}
.backup-preview-item{border:1px solid rgba(148,163,184,.12);background:rgba(2,6,23,.42);border-radius:16px;padding:10px;min-height:70px}
.backup-preview-item span{display:block;color:#94a3b8;font-size:11px;margin-bottom:5px}
.backup-preview-item strong{display:block;color:#f8fafc;font-size:12px;word-break:break-word}
.backup-preview-warnings{border:1px solid rgba(245,158,11,.22);background:rgba(120,53,15,.20);border-radius:16px;padding:12px;color:#fde68a}
.backup-preview-warnings ul{margin:6px 18px 0 0;padding:0}
.backup-preview-ok{border:1px solid rgba(34,197,94,.20);background:rgba(20,83,45,.16);border-radius:16px;padding:12px;color:#bbf7d0}
.backup-table-btn-preview{background:rgba(14,165,233,.12);border-color:rgba(56,189,248,.22);color:#bae6fd}
@media (max-width: 1260px){.backup-preview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width: 760px){.backup-preview-grid{grid-template-columns:1fr}.backup-preview-head{flex-direction:column;align-items:flex-start}}


/* V348 Smart Advisor polish - visual only, no behavior changes */
.smart-advisor-chip-v348,
[data-smart-advisor-v348]{
  border:1px solid rgba(200,163,77,.28);
  background:linear-gradient(135deg,rgba(200,163,77,.14),rgba(15,23,42,.58));
  border-radius:18px;
  padding:10px 12px;
  box-shadow:0 12px 28px rgba(0,0,0,.18);
}
html[data-it-theme="light"] .smart-advisor-chip-v348,
html[data-it-theme="light"] [data-smart-advisor-v348]{
  background:linear-gradient(135deg,rgba(245,158,11,.12),rgba(248,250,252,.92));
  border-color:rgba(146,64,14,.18);
}


/* V350_STATUS_COLORS_FIX_NO_DELETE_START
   Unified color meaning across dashboard:
   Green = confirmed connected. Amber = connected but needs follow-up.
   Red = no confirmed connection. This prevents a network with an online device
   from appearing red just because another device is offline. */
.network-command-card.watch,
.networks-compact-card.watch{border-color:rgba(245,158,11,.34)!important;}
.network-command-card.critical,
.networks-compact-card.critical{border-color:rgba(239,68,68,.38)!important;}
.network-command-card.good,
.networks-compact-card.good{border-color:rgba(34,197,94,.30)!important;}
.network-command-card.watch .network-tier-badge,
.networks-compact-card.watch .network-tier-badge{background:rgba(245,158,11,.13)!important;color:#fcd34d!important;border-color:rgba(245,158,11,.24)!important;}
.network-command-card.good .network-tier-badge,
.networks-compact-card.good .network-tier-badge{background:rgba(34,197,94,.12)!important;color:#86efac!important;border-color:rgba(34,197,94,.22)!important;}
.network-command-card.critical .network-tier-badge,
.networks-compact-card.critical .network-tier-badge{background:rgba(239,68,68,.12)!important;color:#fecaca!important;border-color:rgba(239,68,68,.24)!important;}
.device-row.device-state-online .device-diagnosis-chip.bad,
.device-row.device-state-online .device-diagnosis-chip.warn{background:rgba(245,158,11,.13)!important;border-color:rgba(245,158,11,.24)!important;color:#fcd34d!important;}
.device-row.device-state-online:not(.device-state-warning) .device-health-dot{background:#22c55e!important;box-shadow:0 0 0 5px rgba(34,197,94,.14)!important;}
body[data-it-theme="light"] .network-command-card.watch .network-tier-badge,
body[data-it-theme="light"] .networks-compact-card.watch .network-tier-badge,
body[data-it-theme="light"] .device-row.device-state-online .device-diagnosis-chip.bad,
body[data-it-theme="light"] .device-row.device-state-online .device-diagnosis-chip.warn{background:rgba(245,158,11,.12)!important;color:#92400e!important;border-color:rgba(245,158,11,.28)!important;}
/* V350_STATUS_COLORS_FIX_NO_DELETE_END */

/* V351_STATUS_COLORS_FIX_NO_DELETE_START alias: V350 color CSS retained safely. */
/* V351_STATUS_COLORS_FIX_NO_DELETE_END */


/* V353 HOTFIX: clean dashboard without deleting old tools */
#view-dashboard.dashboard-clean-v353{display:block!important;max-width:1380px;margin-inline:auto;}
#view-dashboard.dashboard-clean-v353 .dashboard-toolbar{border-radius:22px!important;padding:18px 20px!important;margin-bottom:14px!important;background:linear-gradient(135deg,rgba(15,23,42,.92),rgba(17,24,39,.76))!important;border:1px solid rgba(148,163,184,.18)!important;box-shadow:0 14px 34px rgba(2,6,23,.22)!important;}
#view-dashboard.dashboard-clean-v353 .dashboard-toolbar .panel-title{font-size:26px!important;line-height:1.2!important;display:flex;gap:10px;align-items:center;flex-wrap:wrap;}
.dash-clean-subtitle-v353{font-size:12px;font-weight:900;color:#94a3b8;background:rgba(148,163,184,.12);border:1px solid rgba(148,163,184,.18);padding:5px 10px;border-radius:999px;}
#view-dashboard.dashboard-clean-v353 #operationCenterCardV342{margin:0 0 14px!important;padding:18px!important;border-radius:22px!important;background:linear-gradient(135deg,rgba(6,78,59,.18),rgba(15,23,42,.82))!important;border:1px solid rgba(45,212,191,.22)!important;}
#view-dashboard.dashboard-clean-v353 .v342-op-kpi-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(160px,1fr))!important;gap:10px!important;}
#view-dashboard.dashboard-clean-v353 .v342-op-actions{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))!important;gap:10px!important;max-height:none!important;}
#view-dashboard.dashboard-clean-v353 > .grid.grid-cols-2.md\:grid-cols-5.gap-4{display:grid!important;grid-template-columns:repeat(5,minmax(120px,1fr))!important;gap:12px!important;margin:0 0 14px!important;}
#view-dashboard.dashboard-clean-v353 > .grid.grid-cols-2.md\:grid-cols-5.gap-4 > .card{min-height:98px!important;border-radius:18px!important;padding:14px!important;background:rgba(15,23,42,.72)!important;border:1px solid rgba(148,163,184,.15)!important;box-shadow:none!important;}
#view-dashboard.dashboard-clean-v353 > .grid.grid-cols-2.md\:grid-cols-5.gap-4 > .card p{font-size:28px!important;margin-top:8px!important;}
#view-dashboard.dashboard-clean-v353 .ping-card{margin:0 0 14px!important;border-radius:22px!important;padding:18px!important;background:linear-gradient(135deg,rgba(30,64,175,.16),rgba(15,23,42,.78))!important;border:1px solid rgba(96,165,250,.22)!important;}
#view-dashboard.dashboard-clean-v353 .ping-layout{display:grid!important;grid-template-columns:minmax(260px,420px) minmax(0,1fr)!important;gap:12px!important;align-items:start!important;}
#view-dashboard.dashboard-clean-v353 .ping-result-box{min-height:76px!important;max-height:220px!important;overflow:auto!important;white-space:pre-wrap!important;border-radius:16px!important;}
#view-dashboard.dashboard-clean-v353 .ping-result-box.ping-ok-v353{border-color:rgba(34,197,94,.35)!important;background:rgba(34,197,94,.08)!important;color:#bbf7d0!important;}
#view-dashboard.dashboard-clean-v353 .ping-result-box.ping-fail-v353{border-color:rgba(248,113,113,.35)!important;background:rgba(127,29,29,.20)!important;color:#fecaca!important;}
.dashboard-advanced-v353{margin-top:14px;border:1px solid rgba(148,163,184,.16);border-radius:22px;background:rgba(15,23,42,.50);overflow:hidden;}
.dashboard-advanced-v353 > summary{cursor:pointer;padding:16px 18px;font-weight:1000;color:#e2e8f0;background:rgba(148,163,184,.08);list-style:none;}
.dashboard-advanced-v353 > summary::-webkit-details-marker{display:none;}
.dashboard-advanced-v353 > summary:before{content:'▸';display:inline-block;margin-left:8px;transition:.2s transform;}
.dashboard-advanced-v353[open] > summary:before{transform:rotate(90deg);}
.dashboard-advanced-body-v353{display:grid;gap:14px;padding:14px;}
.dashboard-advanced-body-v353 .mini-kpi-grid,.dashboard-advanced-body-v353 .dashboard-analytics-grid,.dashboard-advanced-body-v353 > .grid{margin:0!important;}
.network-zt-qr-mini img,#ztQrBox img,#zeroTierNetworkQrImg{background:#fff!important;border-radius:14px!important;padding:8px!important;box-shadow:0 8px 24px rgba(0,0,0,.18)!important;}
@media (max-width:900px){#view-dashboard.dashboard-clean-v353 > .grid.grid-cols-2.md\:grid-cols-5.gap-4{grid-template-columns:repeat(2,minmax(0,1fr))!important;}#view-dashboard.dashboard-clean-v353 .ping-layout{grid-template-columns:1fr!important;}}

/* V356_UI_SCOPE_ZT_HYBRID_PATCH_START */
html[data-it-top-active-view]:not([data-it-top-active-view="dashboard"]) #view-dashboard,
body[data-it-top-active-view]:not([data-it-top-active-view="dashboard"]) #view-dashboard{
  display:none!important;
  visibility:hidden!important;
}
html[data-it-top-active-view]:not([data-it-top-active-view="dashboard"]) #operationCenterCardV342,
body[data-it-top-active-view]:not([data-it-top-active-view="dashboard"]) #operationCenterCardV342,
html[data-it-top-active-view]:not([data-it-top-active-view="dashboard"]) .v342-operation-center-card,
body[data-it-top-active-view]:not([data-it-top-active-view="dashboard"]) .v342-operation-center-card,
html[data-it-top-active-view]:not([data-it-top-active-view="dashboard"]) #itSmartAdvisorV348Btn,
body[data-it-top-active-view]:not([data-it-top-active-view="dashboard"]) #itSmartAdvisorV348Btn{
  display:none!important;
  visibility:hidden!important;
}
.delivery-page-strip-v130,
.delivery-net-tab-strip-v130{
  display:none!important;
  visibility:hidden!important;
}
body[data-it-top-active-view="net-details"] #view-net-details:not(.hidden){display:block!important;visibility:visible!important;}
body[data-it-top-active-view="net-details"] #net-tab-zerotier:not(.hidden){display:block!important;visibility:visible!important;}
#networkZeroTierPanel .zt-network-card{margin-top:0!important;}
/* V356_UI_SCOPE_ZT_HYBRID_PATCH_END */

/* V365_DEVICE_ROW_HOVER_STACKING_TOOLTIP_FIX_START
   UI-only: stops device cards/actions/tooltips from visually stacking over each other
   when hovering another device row. No install panel/network logic touched. */
:where(#net-tab-devices,#view-devices) .device-virtual-viewport,
:where(#net-tab-devices,#view-devices) .device-virtual-spacer{
  overflow:visible!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-virtual-row{
  transform-origin:center center!important;
  contain:layout paint style!important;
  isolation:isolate!important;
  z-index:1!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-virtual-row:hover,
:where(#net-tab-devices,#view-devices) .device-row.device-virtual-row:focus-within{
  /* The absolute virtual row already uses inline translateY(index*rowHeight).
     Do not add another hover translate, because it can override/visually fight
     the virtual position on some browsers and make rows look stacked. */
  transform:var(--it-top-row-transform, none)!important;
  z-index:3!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-virtual-row .row-btn:hover,
:where(#net-tab-devices,#view-devices) .device-row.device-virtual-row .row-btn:focus-visible{
  transform:none!important;
  position:relative!important;
  z-index:2!important;
}
:where(#net-tab-devices,#view-devices) .router-tools-menu[open],
:where(#net-tab-devices,#view-devices) .device-tools-menu[open]{
  z-index:20!important;
}
:where(#net-tab-devices,#view-devices) .router-tools-dropdown{
  z-index:30!important;
  max-height:min(360px,70vh)!important;
  overflow:auto!important;
}
:where(#net-tab-devices,#view-devices) [data-it-title]{
  -webkit-user-select:auto;
  user-select:auto;
}
@media(max-width:1260px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro{margin-bottom:10px!important;}
}
@media(max-width:760px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro{margin-bottom:12px!important;}
}
/* V365_DEVICE_ROW_HOVER_STACKING_TOOLTIP_FIX_END */

/* V369_SOLID_NETWORK_MODAL_READABILITY_FIX_START
   UI-only: reduce the transparent/glass look in Create Network, network settings,
   and shared modals so fields do not visually blend with the background. */
:root{
  --it-top-solid-panel:#0b1220;
  --it-top-solid-panel-2:#0f172a;
  --it-top-solid-panel-3:#111c2d;
  --it-top-solid-border:rgba(148,163,184,.18);
}

/* Network creation and ZeroTouch result modals */
#networkCreateModal,
#zeroTouchCreatedModalV354{
  background:rgba(2,6,23,.88)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
#networkCreateModal > div,
#zeroTouchCreatedModalV354 > div{
  background:linear-gradient(180deg,var(--it-top-solid-panel),var(--it-top-solid-panel-2))!important;
  border-color:rgba(96,165,250,.28)!important;
  box-shadow:0 28px 90px rgba(0,0,0,.62)!important;
  opacity:1!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
#networkCreateModal input,
#networkCreateModal textarea,
#zeroTouchCreatedModalV354 input,
#zeroTouchCreatedModalV354 textarea{
  background:#08111f!important;
  border-color:rgba(148,163,184,.26)!important;
  color:#f8fafc!important;
  opacity:1!important;
}
#networkCreateModal input:focus,
#networkCreateModal textarea:focus,
#zeroTouchCreatedModalV354 input:focus,
#zeroTouchCreatedModalV354 textarea:focus{
  border-color:rgba(96,165,250,.68)!important;
  box-shadow:0 0 0 4px rgba(59,130,246,.18)!important;
  outline:none!important;
}
#networkCreateModal .bg-slate-900\/60,
#zeroTouchCreatedModalV354 .bg-slate-900\/60,
#networkCreateModal .bg-amber-500\/10,
#zeroTouchCreatedModalV354 .bg-emerald-500\/10{
  background:var(--it-top-solid-panel-3)!important;
}
#networkCreateModal .bg-slate-950\/70,
#networkCreateModal .bg-slate-800,
#networkCreateModal .hover\:bg-slate-700:hover,
#networkBaseSuggestions button{
  background:#111c2d!important;
  border:1px solid rgba(148,163,184,.18)!important;
  color:#f8fafc!important;
}
#newNetworkPreview .rounded-xl{
  background:#08111f!important;
  border-color:rgba(148,163,184,.22)!important;
}

/* Shared edit/diagnostic/route/token modals: keep readable and non-transparent. */
#modalBackdrop,
#modalRemote,
#modalDiag,
#modalRouteDiag,
#modalTokenManager,
#modalGuac{
  background:rgba(2,6,23,.88)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
#modalBackdrop .card,
#modalRemote .card,
#modalDiag .card,
#modalRouteDiag .card,
#modalTokenManager .card,
#modalGuac .card{
  background:linear-gradient(180deg,var(--it-top-solid-panel),var(--it-top-solid-panel-2))!important;
  border-color:var(--it-top-solid-border)!important;
  opacity:1!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}

/* Network screens: stop cards/setting blocks from looking like transparent glass. */
#view-networks .card,
#view-net-details .card,
#view-net-details .network-summary-shell,
#view-net-details .settings-stack-card,
#view-net-details .network-quick-item,
#view-net-details .network-quick-qr,
#view-net-details .network-list-card,
#view-networks .network-list-card,
#view-networks .networks-toolbar,
#view-net-details .net-header-shell,
#view-net-details .dashboard-toolbar,
#view-net-details .networks-toolbar{
  background:linear-gradient(180deg,var(--it-top-solid-panel),var(--it-top-solid-panel-2))!important;
  border-color:var(--it-top-solid-border)!important;
  opacity:1!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
#view-net-details .network-quick-item-accent,
#view-net-details .settings-stack-card-danger{
  background:linear-gradient(180deg,#132033,#0f172a)!important;
}
#view-networks .input-glass,
#view-net-details .input-glass,
#view-networks input,
#view-net-details input,
#view-networks textarea,
#view-net-details textarea,
#view-networks select,
#view-net-details select{
  background:#08111f!important;
  border-color:rgba(148,163,184,.24)!important;
  color:#f8fafc!important;
}
#view-networks .input-glass::placeholder,
#view-net-details .input-glass::placeholder,
#view-networks input::placeholder,
#view-net-details input::placeholder,
#view-networks textarea::placeholder,
#view-net-details textarea::placeholder{
  color:#7f8ea3!important;
  opacity:1!important;
}
#view-networks .quick-card-head,
#view-net-details .quick-card-head{
  background:linear-gradient(180deg,#0b1220,#0f172a)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}

/* Light theme remains readable without glass transparency. */
html[data-it-theme="light"] #networkCreateModal > div,
body[data-it-theme="light"] #networkCreateModal > div,
html[data-it-theme="light"] #zeroTouchCreatedModalV354 > div,
body[data-it-theme="light"] #zeroTouchCreatedModalV354 > div,
html[data-it-theme="light"] #modalBackdrop .card,
body[data-it-theme="light"] #modalBackdrop .card,
html[data-it-theme="light"] #modalRemote .card,
body[data-it-theme="light"] #modalRemote .card,
html[data-it-theme="light"] #modalDiag .card,
body[data-it-theme="light"] #modalDiag .card,
html[data-it-theme="light"] #modalRouteDiag .card,
body[data-it-theme="light"] #modalRouteDiag .card,
html[data-it-theme="light"] #modalTokenManager .card,
body[data-it-theme="light"] #modalTokenManager .card,
html[data-it-theme="light"] #view-networks .card,
body[data-it-theme="light"] #view-networks .card,
html[data-it-theme="light"] #view-net-details .card,
body[data-it-theme="light"] #view-net-details .card,
html[data-it-theme="light"] #view-net-details .network-summary-shell,
body[data-it-theme="light"] #view-net-details .network-summary-shell,
html[data-it-theme="light"] #view-net-details .settings-stack-card,
body[data-it-theme="light"] #view-net-details .settings-stack-card,
html[data-it-theme="light"] #view-net-details .network-quick-item,
body[data-it-theme="light"] #view-net-details .network-quick-item,
html[data-it-theme="light"] #view-networks .network-list-card,
body[data-it-theme="light"] #view-networks .network-list-card{
  background:#ffffff!important;
  color:#0f172a!important;
  border-color:rgba(15,23,42,.14)!important;
  box-shadow:0 20px 48px rgba(15,23,42,.12)!important;
}
html[data-it-theme="light"] #networkCreateModal input,
body[data-it-theme="light"] #networkCreateModal input,
html[data-it-theme="light"] #networkCreateModal textarea,
body[data-it-theme="light"] #networkCreateModal textarea,
html[data-it-theme="light"] #view-networks input,
body[data-it-theme="light"] #view-networks input,
html[data-it-theme="light"] #view-net-details input,
body[data-it-theme="light"] #view-net-details input,
html[data-it-theme="light"] #view-networks textarea,
body[data-it-theme="light"] #view-networks textarea,
html[data-it-theme="light"] #view-net-details textarea,
body[data-it-theme="light"] #view-net-details textarea,
html[data-it-theme="light"] #view-networks select,
body[data-it-theme="light"] #view-networks select,
html[data-it-theme="light"] #view-net-details select,
body[data-it-theme="light"] #view-net-details select{
  background:#f8fafc!important;
  color:#0f172a!important;
  border-color:rgba(15,23,42,.16)!important;
}
/* V369_SOLID_NETWORK_MODAL_READABILITY_FIX_END */

/* V372 - compact create-network modal and clean address-plan UI */
.it-create-modal-backdrop{
  position:fixed!important; inset:0!important; z-index:85!important;
  display:flex!important; align-items:center!important; justify-content:center!important;
  padding:18px!important; background:rgba(2,6,23,.76)!important; backdrop-filter:blur(6px)!important;
}
.it-create-modal-backdrop.hidden{display:none!important;}
.it-create-modal-shell{
  width:min(760px,92vw)!important; max-height:86vh!important; overflow:auto!important;
  border:1px solid rgba(56,189,248,.28)!important; border-radius:22px!important;
  background:#07111f!important; box-shadow:0 26px 80px rgba(0,0,0,.55)!important;
  padding:16px!important; color:#e5edf8!important; text-align:right!important; direction:rtl!important;
}
.it-create-modal-head{display:flex!important; align-items:flex-start!important; justify-content:space-between!important; gap:14px!important; margin-bottom:12px!important;}
.it-create-modal-head h3{margin:0!important; font-size:18px!important; font-weight:1000!important; color:#fff!important; line-height:1.25!important;}
.it-create-modal-head p{margin:4px 0 0!important; color:#9fb0c8!important; font-size:11px!important; line-height:1.55!important; max-width:560px!important;}
.it-create-close{width:32px!important; height:32px!important; display:grid!important; place-items:center!important; border-radius:10px!important; border:1px solid rgba(148,163,184,.25)!important; background:#0f1b2e!important; color:#cbd5e1!important; font-size:20px!important; font-weight:900!important; line-height:1!important;}
.it-create-close:hover{background:#17243a!important; color:#fff!important;}
.it-create-form-grid{display:grid!important; grid-template-columns:1fr 1fr!important; gap:10px!important; align-items:stretch!important;}
.it-create-field{display:flex!important; flex-direction:column!important; gap:5px!important; min-width:0!important;}
.it-create-field span{font-size:11px!important; color:#a8b7cc!important; font-weight:900!important;}
.it-create-field input,.it-create-field textarea{
  width:100%!important; min-height:38px!important; border-radius:12px!important; border:1px solid rgba(71,85,105,.9)!important;
  background:#0a1626!important; color:#e5edf8!important; padding:8px 10px!important; outline:none!important; font-size:12px!important;
}
.it-create-field input:focus,.it-create-field textarea:focus{border-color:#38bdf8!important; box-shadow:0 0 0 3px rgba(56,189,248,.12)!important;}
.it-create-desc{margin-top:9px!important;}
.it-create-desc textarea{resize:vertical!important; min-height:38px!important; max-height:80px!important;}
.it-create-hybrid-toggle{
  display:flex!important; align-items:center!important; justify-content:space-between!important; gap:10px!important;
  border:1px solid rgba(16,185,129,.32)!important; border-radius:14px!important; background:rgba(16,185,129,.08)!important;
  padding:10px 12px!important; min-height:62px!important; color:#d1fae5!important; font-size:12px!important; font-weight:900!important;
}
.it-create-hybrid-toggle input{width:18px!important; height:18px!important; accent-color:#10b981!important;}
.it-create-ranges{display:grid!important; grid-template-columns:1fr 1fr!important; gap:10px!important; margin-top:10px!important;}
.it-create-ranges section{border:1px solid rgba(51,65,85,.9)!important; border-radius:16px!important; background:#0b1728!important; padding:10px!important; min-width:0!important;}
.it-create-ranges header{display:flex!important; align-items:center!important; justify-content:space-between!important; gap:8px!important; margin-bottom:8px!important;}
.it-create-ranges header b{font-size:12px!important; color:#dbeafe!important;}
.it-create-ranges header button{border:1px solid rgba(148,163,184,.22)!important; background:#12213a!important; color:#dbeafe!important; border-radius:9px!important; padding:5px 9px!important; font-size:11px!important; font-weight:900!important;}
.it-create-chip-list{display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:6px!important; direction:ltr!important;}
.it-create-chip{min-height:30px!important; border:1px solid rgba(96,165,250,.24)!important; border-radius:10px!important; background:#101d31!important; color:#f1f5f9!important; padding:5px 7px!important; font-size:11px!important; font-weight:900!important; white-space:nowrap!important; overflow:hidden!important; text-overflow:ellipsis!important;}
.it-create-chip:hover{background:#173154!important; border-color:rgba(96,165,250,.55)!important;}
.it-create-preview-wrap{margin-top:10px!important;}
.it-create-preview{display:grid!important; grid-template-columns:repeat(4,minmax(0,1fr))!important; gap:7px!important;}
.it-create-preview span{border:1px solid rgba(51,65,85,.95)!important; border-radius:12px!important; background:#081323!important; padding:8px!important; min-width:0!important;}
.it-create-preview b{display:block!important; color:#94a3b8!important; font-size:10px!important; margin-bottom:3px!important;}
.it-create-preview em{display:block!important; color:#fff!important; font-style:normal!important; font-weight:900!important; font-size:11px!important; direction:ltr!important; white-space:nowrap!important; overflow:hidden!important; text-overflow:ellipsis!important;}
.it-create-hint{font-size:10px!important; line-height:1.45!important; min-height:14px!important;}
.it-create-hint.ok{color:#86efac!important;}.it-create-hint.bad{color:#fca5a5!important;}
.it-create-note{margin-top:8px!important; border:1px solid rgba(245,158,11,.18)!important; border-radius:13px!important; background:rgba(245,158,11,.06)!important; padding:8px 10px!important; color:#fde68a!important; font-size:11px!important;}
.it-create-note summary{cursor:pointer!important; font-weight:900!important;}
.it-create-note p{margin:6px 0 0!important; color:#fde68a!important; line-height:1.55!important;}
.it-create-footer{position:sticky!important; bottom:-16px!important; display:flex!important; justify-content:flex-start!important; gap:8px!important; margin:12px -16px -16px!important; padding:10px 16px!important; background:#07111f!important; border-top:1px solid rgba(51,65,85,.85)!important;}
.it-create-footer button{border-radius:12px!important; min-height:38px!important; padding:8px 14px!important; font-size:12px!important; font-weight:1000!important;}
.it-create-footer .primary{background:linear-gradient(135deg,#2563eb,#60a5fa)!important; color:#fff!important; min-width:150px!important;}
.it-create-footer .secondary{background:#111d31!important; border:1px solid rgba(148,163,184,.24)!important; color:#dbeafe!important;}
@media(max-width:760px){
  .it-create-modal-shell{width:96vw!important; max-height:88vh!important; padding:13px!important;}
  .it-create-form-grid,.it-create-ranges{grid-template-columns:1fr!important;}
  .it-create-chip-list{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .it-create-preview{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .it-create-footer{bottom:-13px!important; margin:10px -13px -13px!important; padding:9px 13px!important;}
}
body[data-it-theme="light"] .it-create-modal-shell,
body[data-it-theme="light"] .it-create-footer{background:#f8fafc!important;color:#0f172a!important;}
body[data-it-theme="light"] .it-create-field input,
body[data-it-theme="light"] .it-create-field textarea,
body[data-it-theme="light"] .it-create-ranges section,
body[data-it-theme="light"] .it-create-preview span{background:#fff!important;color:#0f172a!important;border-color:#cbd5e1!important;}
body[data-it-theme="light"] .it-create-modal-head h3{color:#0f172a!important;}
body[data-it-theme="light"] .it-create-chip{background:#eef2ff!important;color:#0f172a!important;border-color:#bfdbfe!important;}

/* V394_ACCOUNT_LAYOUT_IMAGE_MATCH_FIX_START
   صفحة الحسابات - إصلاح Layout حسب الصورة المرجعية + إزالة زر الحذف من واجهة NO_DELETE */
.admin-card{
  width:100%;
  box-sizing:border-box;
  overflow:hidden;
  border:1px solid rgba(96,165,250,.18);
  background:
    radial-gradient(circle at 86% 8%, rgba(59,130,246,.10), transparent 34%),
    linear-gradient(145deg, rgba(15,23,42,.92), rgba(2,6,23,.94));
  border-radius:26px;
  padding:22px;
  display:grid;
  grid-template-columns:minmax(0,1fr) clamp(190px,16vw,260px);
  gap:22px;
  align-items:stretch;
  box-shadow:0 24px 70px rgba(2,8,23,.28), inset 0 1px 0 rgba(255,255,255,.035);
}
.admin-card-main{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:16px;
}
.admin-card-head{
  margin:0;
  padding:18px 20px;
  min-height:116px;
  border:1px solid rgba(148,163,184,.12);
  border-radius:22px;
  background:linear-gradient(135deg, rgba(15,23,42,.78), rgba(30,41,59,.36));
  display:flex;
  align-items:center;
  justify-content:flex-end;
  text-align:right;
}
.admin-card-head>div{width:100%;}
.admin-card-identity{
  justify-content:flex-start;
  flex-direction:row-reverse;
  gap:10px;
}
.admin-card-name{
  font-size:20px;
  line-height:1.25;
  letter-spacing:.01em;
}
.admin-card-sub{
  margin-top:8px;
  color:#a7b4c8;
  font-size:12px;
  font-weight:700;
}
.admin-role-note{
  margin-top:12px;
  color:#9ca7ba;
  font-size:12px;
  line-height:1.9;
}
.admin-role-chip,
.admin-current-chip,
.admin-status-chip,
.admin-trial-badge{
  min-height:28px;
  padding:6px 11px;
  border-radius:999px;
  font-size:11px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.admin-status-active{background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.30);color:#74f29c;}
.admin-status-trial{background:rgba(245,158,11,.13);border-color:rgba(245,158,11,.32);color:#ffd46a;}
.admin-trial-badge{background:rgba(124,58,237,.20);border-color:rgba(168,85,247,.36);color:#ead8ff;}
.admin-current-chip{background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.26);color:#bbf7d0;}
.admin-trial-toggle-card.admin-state-row{
  margin:0 !important;
  padding:18px 20px;
  border:1px solid rgba(96,165,250,.13);
  border-radius:22px;
  background:linear-gradient(135deg, rgba(15,23,42,.72), rgba(2,6,23,.54));
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}
.admin-state-checks{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:12px;
}
.admin-checkline{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:34px;
  padding:7px 12px;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.14);
  background:rgba(15,23,42,.54);
  color:#e8eef7;
  font-size:13px;
  font-weight:900;
  cursor:pointer;
}
.admin-checkline input{
  width:17px;
  height:17px;
  accent-color:#22c55e;
  cursor:pointer;
}
.admin-checkline input:disabled{cursor:not-allowed;opacity:.6;}
.admin-state-hint{
  min-width:220px;
  flex:1;
  color:#9ca7ba;
  font-size:12px;
  line-height:1.9;
  text-align:right;
}
.admin-mini-stats{
  margin:0;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
.admin-mini-stats>div{
  position:relative;
  min-height:86px;
  padding:15px 16px;
  border-radius:18px;
  border:1px solid rgba(148,163,184,.12);
  background:linear-gradient(180deg, rgba(15,23,42,.64), rgba(2,6,23,.42));
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:8px;
}
.admin-mini-stats span{
  color:#9aa7ba;
  font-size:12px;
  font-weight:900;
}
.admin-mini-stats strong{
  color:#f8fafc;
  font-size:15px;
  font-weight:1000;
  line-height:1.45;
}
.admin-card-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  align-items:start;
  padding:20px;
  border:1px solid rgba(96,165,250,.13);
  border-radius:22px;
  background:linear-gradient(135deg, rgba(15,23,42,.70), rgba(2,6,23,.46));
}
.admin-card-grid label{
  margin-bottom:9px !important;
  color:#a7b4c8 !important;
  font-size:12px !important;
  font-weight:1000 !important;
}
.admin-card-grid .input-glass,
.admin-card-grid select.input-glass{
  min-height:54px;
  border-radius:16px;
  border-color:rgba(96,165,250,.24);
  background:rgba(2,6,23,.62) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
  font-size:14px;
  font-weight:900;
}
.admin-row-role-hint{
  margin-top:10px;
  min-height:0;
  color:#8793a6;
  font-size:12px;
  line-height:1.8;
  text-align:center;
}
.admin-trial-meta{
  margin-top:0 !important;
  border-radius:20px;
  border-color:rgba(168,85,247,.22);
  background:rgba(76,29,149,.12);
}
.admin-card-actions{
  min-width:0;
  height:100%;
  padding:22px 18px;
  border:1px solid rgba(96,165,250,.16);
  border-radius:22px;
  background:linear-gradient(180deg, rgba(15,23,42,.74), rgba(2,6,23,.64));
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  gap:14px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}
.admin-card-actions::before{
  content:'إجراءات';
  display:block;
  margin:0 0 16px;
  color:#eaf2ff;
  font-size:16px;
  font-weight:1000;
  text-align:center;
}
.admin-action-btn{
  width:100%;
  min-height:58px;
  border-radius:16px;
  padding:12px 14px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  font-size:14px;
  font-weight:1000;
  line-height:1.4;
  white-space:nowrap;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045);
}
.admin-action-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:24px;
  height:24px;
  border-radius:8px;
  background:rgba(255,255,255,.07);
  font-size:15px;
  line-height:1;
}
.admin-action-save{background:linear-gradient(135deg, rgba(245,158,11,.18), rgba(245,158,11,.07));border-color:rgba(245,158,11,.42);color:#fde68a;}
.admin-action-password{background:linear-gradient(135deg, rgba(59,130,246,.20), rgba(37,99,235,.08));border-color:rgba(96,165,250,.34);color:#c9e1ff;}
.admin-action-unlock{background:linear-gradient(135deg, rgba(245,158,11,.18), rgba(245,158,11,.07));border-color:rgba(245,158,11,.38);color:#fedc7c;}
.admin-action-delete{display:none !important;}

@media (max-width: 1500px){
  .admin-card{grid-template-columns:1fr;}
  .admin-card-actions{height:auto;display:grid;grid-template-columns:repeat(2,minmax(180px,1fr));align-items:stretch;}
  .admin-card-actions::before{grid-column:1/-1;margin-bottom:2px;}
}
@media (max-width: 1100px){
  .admin-mini-stats{grid-template-columns:repeat(2,minmax(0,1fr));}
  .admin-card-grid{grid-template-columns:1fr;}
  .admin-trial-toggle-card.admin-state-row{flex-direction:column;align-items:stretch;}
  .admin-state-hint{min-width:0;text-align:right;}
}
@media (max-width: 640px){
  .admin-card{padding:14px;border-radius:20px;gap:14px;}
  .admin-card-head,.admin-card-grid,.admin-trial-toggle-card.admin-state-row,.admin-card-actions{padding:14px;border-radius:18px;}
  .admin-mini-stats,.admin-card-actions{grid-template-columns:1fr;}
  .admin-action-btn{min-height:52px;white-space:normal;}
}
/* V394_ACCOUNT_LAYOUT_IMAGE_MATCH_FIX_END */


/* V395_PRO_ACCOUNT_LAYOUT_PERMISSIONS_NO_DELETE_START
   Professional account management layout + trial permissions guard UI. */
#view-superadmin #saContent{
  width:min(100%, 1320px)!important;
  max-width:1320px!important;
}
.admin-accounts-section{
  border-color:rgba(96,165,250,.16)!important;
  background:linear-gradient(180deg,rgba(15,23,42,.82),rgba(2,6,23,.90))!important;
}
.admin-accounts-section .sa-section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  border-bottom:1px solid rgba(148,163,184,.10);
  padding-bottom:16px;
}
.admin-current-account-card,
.admin-password-card,
.admin-management-card{
  background:linear-gradient(180deg,rgba(15,23,42,.70),rgba(2,6,23,.78))!important;
  border-color:rgba(96,165,250,.13)!important;
  box-shadow:0 18px 44px rgba(2,8,23,.18), inset 0 1px 0 rgba(255,255,255,.03)!important;
}
.admin-summary-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:10px!important;
}
.admin-summary-item{
  border:1px solid rgba(148,163,184,.10);
  background:rgba(2,6,23,.38);
  border-radius:16px;
  padding:12px;
}
.admin-summary-label{display:block;color:#94a3b8;font-size:11px;font-weight:900;margin-bottom:6px;}
.admin-summary-value{display:block;color:#f8fafc;font-size:13px;font-weight:1000;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.admin-management-card{padding:18px!important;}
.admin-management-head{
  padding:0 0 14px!important;
  border-bottom:1px solid rgba(148,163,184,.10);
}
.admin-create-grid{
  display:grid!important;
  grid-template-columns:repeat(12,minmax(0,1fr))!important;
  gap:12px!important;
  align-items:start!important;
  margin-top:14px!important;
}
.admin-create-grid > div:nth-child(1),
.admin-create-grid > div:nth-child(2),
.admin-create-grid > div:nth-child(3),
.admin-create-grid > div:nth-child(4){grid-column:span 3;}
.admin-create-grid > div:nth-child(5){grid-column:span 4;}
.admin-create-grid > .admin-trial-toggle-card{grid-column:span 3; min-height:88px;}
.admin-create-grid > .admin-trial-fields{grid-column:span 3;}
.admin-create-grid > .admin-create-action-wrap{grid-column:span 2; display:flex!important; flex-direction:column; gap:8px; align-self:end;}
.admin-create-grid label{font-size:11px!important;color:#a7b4c8!important;font-weight:1000!important;}
.admin-create-grid .input-glass,
.admin-list-toolbar .input-glass,
.admin-list-toolbar select,
.admin-card-grid .input-glass,
.admin-card-grid select{
  min-height:46px!important;
  border-radius:14px!important;
}
.admin-trial-fields{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px!important;
  padding:10px!important;
  border-radius:16px!important;
  border:1px solid rgba(168,85,247,.18)!important;
  background:rgba(76,29,149,.10)!important;
}
.admin-trial-fields label{font-size:10px!important;margin-bottom:5px!important;}
.admin-trial-fields .input-glass{min-height:38px!important;font-size:12px!important;}
.admin-permissions-details{
  border:1px solid rgba(148,163,184,.12);
  background:rgba(2,6,23,.30);
  border-radius:18px;
  padding:0;
  overflow:hidden;
}
.admin-permissions-details summary{
  cursor:pointer;
  list-style:none;
  padding:12px 14px;
  color:#bfdbfe;
  font-weight:1000;
  font-size:12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.admin-permissions-details summary::-webkit-details-marker{display:none;}
.admin-permissions-details summary::before{content:'+';font-weight:1000;color:#fcd34d;margin-inline-end:8px;}
.admin-permissions-details[open] summary::before{content:'−';}
.admin-permissions-details #permissionMatrixBox{padding:0 12px 12px;}
.permission-matrix-wrap{margin-top:0!important;border-radius:16px!important;padding:12px!important;}
.permission-matrix-note{
  border:1px solid rgba(245,158,11,.24);
  background:rgba(245,158,11,.10);
  color:#fde68a;
  border-radius:14px;
  padding:10px 12px;
  font-size:12px;
  line-height:1.7;
  margin-bottom:10px;
}
.admin-list-toolbar{
  display:grid!important;
  grid-template-columns:minmax(180px,1.2fr) minmax(220px,2fr) minmax(150px,1fr) minmax(150px,1fr) minmax(170px,1fr) auto!important;
  gap:10px!important;
  align-items:center!important;
  padding:12px!important;
  border:1px solid rgba(96,165,250,.12)!important;
  border-radius:18px!important;
  background:rgba(15,23,42,.50)!important;
}
.admin-toolbar-title{display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:#f8fafc;font-size:13px;font-weight:1000;}
.admin-toolbar-title span{color:#93c5fd;background:rgba(59,130,246,.10);border:1px solid rgba(59,130,246,.18);border-radius:999px;padding:5px 9px;font-size:11px;}
.admin-list-pro{display:flex!important;flex-direction:column;gap:12px!important;}
.admin-card{
  width:100%!important;
  grid-template-columns:minmax(0,1fr) 168px!important;
  gap:14px!important;
  padding:16px!important;
  border-radius:22px!important;
  background:linear-gradient(180deg,rgba(15,23,42,.78),rgba(2,6,23,.86))!important;
  border-color:rgba(96,165,250,.14)!important;
  box-shadow:0 16px 38px rgba(2,8,23,.18), inset 0 1px 0 rgba(255,255,255,.03)!important;
}
.admin-card-main{gap:12px!important;}
.admin-card-head{
  min-height:auto!important;
  padding:14px!important;
  border-radius:18px!important;
  align-items:flex-start!important;
}
.admin-card-identity{justify-content:flex-start!important;gap:8px!important;}
.admin-card-name{font-size:17px!important;}
.admin-card-sub{font-size:11px!important;margin-top:6px!important;}
.admin-role-note{font-size:11px!important;line-height:1.7!important;margin-top:8px!important;}
.admin-trial-toggle-card.admin-state-row{
  padding:12px 14px!important;
  border-radius:18px!important;
  gap:10px!important;
}
.admin-checkline{min-height:32px!important;padding:6px 10px!important;font-size:12px!important;}
.admin-state-hint{font-size:11px!important;line-height:1.65!important;}
.admin-mini-stats{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:8px!important;
}
.admin-mini-stats>div{
  min-height:66px!important;
  padding:10px 12px!important;
  border-radius:15px!important;
}
.admin-mini-stats span{font-size:10px!important;}
.admin-mini-stats strong{font-size:12px!important;}
.admin-card-grid{
  grid-template-columns:1.15fr 1fr 1fr!important;
  gap:10px!important;
  padding:14px!important;
  border-radius:18px!important;
}
.admin-card-grid label{font-size:11px!important;margin-bottom:6px!important;}
.admin-row-role-hint{font-size:11px!important;text-align:right!important;margin-top:7px!important;}
.admin-trial-meta{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px!important;
  padding:10px!important;
  border-radius:16px!important;
}
.admin-trial-stat{padding:8px!important;border-radius:12px!important;}
.admin-trial-stat span{font-size:10px!important;}
.admin-trial-stat .input-glass{min-height:36px!important;font-size:12px!important;}
.admin-card-actions{
  width:168px!important;
  height:auto!important;
  min-height:100%!important;
  padding:14px!important;
  border-radius:18px!important;
  gap:10px!important;
  justify-content:center!important;
  position:sticky;
  top:14px;
}
.admin-card-actions::before{font-size:13px!important;margin-bottom:4px!important;}
.admin-action-btn{
  min-height:46px!important;
  border-radius:13px!important;
  font-size:12px!important;
  padding:9px 10px!important;
}
.admin-action-icon{width:20px!important;height:20px!important;font-size:13px!important;}
.admin-action-delete{display:none!important;}
body[data-it-top-trial="1"] #navSuperadminBtn,
body[data-it-top-trial="1"] #navBackupBtn{display:none!important;}
body[data-it-theme="light"] .admin-current-account-card,
body[data-it-theme="light"] .admin-password-card,
body[data-it-theme="light"] .admin-management-card,
body[data-it-theme="light"] .admin-card,
body[data-it-theme="light"] .admin-list-toolbar,
body[data-it-theme="light"] .admin-permissions-details{background:#ffffff!important;color:#0f172a!important;border-color:rgba(15,23,42,.14)!important;}
body[data-it-theme="light"] .admin-summary-value,
body[data-it-theme="light"] .admin-card-name,
body[data-it-theme="light"] .admin-toolbar-title{color:#0f172a!important;}
@media (max-width:1280px){
  .admin-create-grid{grid-template-columns:repeat(6,minmax(0,1fr))!important;}
  .admin-create-grid > div:nth-child(1),.admin-create-grid > div:nth-child(2),.admin-create-grid > div:nth-child(3),.admin-create-grid > div:nth-child(4){grid-column:span 3;}
  .admin-create-grid > div:nth-child(5),.admin-create-grid > .admin-trial-toggle-card,.admin-create-grid > .admin-trial-fields{grid-column:span 3;}
  .admin-create-grid > .admin-create-action-wrap{grid-column:span 6;display:grid!important;grid-template-columns:1fr 1fr;}
  .admin-card{grid-template-columns:1fr!important;}
  .admin-card-actions{position:static;width:100%!important;display:grid!important;grid-template-columns:repeat(2,minmax(160px,1fr))!important;min-height:auto!important;}
  .admin-card-actions::before{grid-column:1/-1;}
  .admin-list-toolbar{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .admin-toolbar-title{grid-column:1/-1;}
}
@media (max-width:860px){
  #view-superadmin .sa-section-shell{padding:16px!important;}
  .admin-accounts-section .sa-section-head{display:block;}
  .admin-summary-grid,.admin-mini-stats,.admin-card-grid,.admin-trial-meta{grid-template-columns:1fr!important;}
  .admin-create-grid{grid-template-columns:1fr!important;}
  .admin-create-grid > div,.admin-create-grid > .admin-trial-fields,.admin-create-grid > .admin-trial-toggle-card,.admin-create-grid > .admin-create-action-wrap{grid-column:auto!important;}
  .admin-create-grid > .admin-create-action-wrap{display:flex!important;}
  .admin-list-toolbar{grid-template-columns:1fr!important;}
  .admin-card{padding:12px!important;border-radius:18px!important;}
  .admin-card-head,.admin-card-grid,.admin-trial-toggle-card.admin-state-row,.admin-card-actions{padding:12px!important;border-radius:16px!important;}
  .admin-card-actions{grid-template-columns:1fr!important;}
}
/* V395_PRO_ACCOUNT_LAYOUT_PERMISSIONS_NO_DELETE_END */

/* V396_COMPACT_COLLAPSIBLE_ADMIN_UI_START
   Smaller superadmin screens, less visual noise, accordion-first workflow. */
#view-superadmin.sa-compact-mode #saContent,
#view-superadmin #saContent{
  width:min(100%,1180px)!important;
  max-width:1180px!important;
}
#view-superadmin.sa-compact-mode{
  --v396-card-pad:14px;
  --v396-gap:10px;
}
#view-superadmin.sa-compact-mode .premium-admin-hero{
  padding:16px 18px!important;
  border-radius:20px!important;
  margin-bottom:12px!important;
}
#view-superadmin.sa-compact-mode .premium-admin-title{font-size:22px!important;margin:8px 0 4px!important;}
#view-superadmin.sa-compact-mode .premium-admin-subtitle{font-size:12px!important;line-height:1.6!important;max-width:680px!important;}
#view-superadmin.sa-compact-mode .premium-admin-kicker{font-size:9px!important;padding:4px 8px!important;}
#view-superadmin.sa-compact-mode .lux-stat-grid{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:10px!important;
  margin-bottom:12px!important;
}
#view-superadmin.sa-compact-mode .lux-stat-card{
  min-height:86px!important;
  padding:12px!important;
  border-radius:18px!important;
}
#view-superadmin.sa-compact-mode .lux-stat-value{font-size:18px!important;line-height:1.2!important;}
#view-superadmin.sa-compact-mode .lux-stat-note{display:none!important;}
#view-superadmin.sa-compact-mode .sa-section-shell{
  padding:14px!important;
  border-radius:18px!important;
  margin-bottom:10px!important;
  box-shadow:0 10px 28px rgba(2,8,23,.18), inset 0 1px 0 rgba(255,255,255,.025)!important;
}
#view-superadmin.sa-compact-mode .sa-accordion-head{
  min-height:48px!important;
  margin:0!important;
  padding:0!important;
  cursor:pointer;
  align-items:center!important;
  border-bottom:0!important;
}
#view-superadmin.sa-compact-mode .sa-accordion-head::before{
  content:'⌄';
  width:28px;height:28px;border-radius:10px;
  display:inline-flex;align-items:center;justify-content:center;
  margin-inline-end:8px;
  color:#93c5fd;
  background:rgba(59,130,246,.10);
  border:1px solid rgba(96,165,250,.16);
  font-weight:1000;
}
#view-superadmin.sa-compact-mode .sa-accordion-shell.is-collapsed .sa-accordion-head::before{content:'›';}
#view-superadmin.sa-compact-mode .sa-accordion-shell.is-collapsed > :not(.sa-accordion-head){display:none!important;}
#view-superadmin.sa-compact-mode .sa-section-head h3,
#view-superadmin.sa-compact-mode h3.text-2xl{
  font-size:17px!important;
  line-height:1.35!important;
}
#view-superadmin.sa-compact-mode .sa-section-kicker{font-size:9px!important;letter-spacing:.05em!important;}
#view-superadmin.sa-compact-mode .settings-panel-note,
#view-superadmin.sa-compact-mode .text-slate-400.mt-1:not(.admin-management-subtitle),
#view-superadmin.sa-compact-mode .text-slate-500.leading-6,
#view-superadmin.sa-compact-mode .text-slate-500.mb-2:not(.admin-edit-hint){
  display:none!important;
}
#view-superadmin.sa-compact-mode .input-glass,
#view-superadmin.sa-compact-mode select.input-glass,
#view-superadmin.sa-compact-mode textarea.input-glass{
  min-height:38px!important;
  border-radius:12px!important;
  font-size:12px!important;
  padding:8px 10px!important;
}
#view-superadmin.sa-compact-mode textarea.input-glass{min-height:74px!important;}
#view-superadmin.sa-compact-mode .action-btn,
#view-superadmin.sa-compact-mode .btn-primary,
#view-superadmin.sa-compact-mode button{
  border-radius:12px;
}
#view-superadmin.sa-compact-mode .rounded-3xl{border-radius:18px!important;}
#view-superadmin.sa-compact-mode .p-5{padding:14px!important;}
#view-superadmin.sa-compact-mode .p-8{padding:14px!important;}
#view-superadmin.sa-compact-mode .gap-6{gap:12px!important;}
#view-superadmin.sa-compact-mode .mb-6{margin-bottom:12px!important;}
#view-superadmin.sa-compact-mode .mb-5{margin-bottom:10px!important;}
#view-superadmin.sa-compact-mode .mb-4{margin-bottom:8px!important;}
#view-superadmin.sa-compact-mode .table-shell table th,
#view-superadmin.sa-compact-mode .table-shell table td,
#view-superadmin.sa-compact-mode .zt-table th,
#view-superadmin.sa-compact-mode .zt-table td{
  padding:7px 9px!important;
  font-size:11px!important;
}

.admin-create-details{
  border:1px solid rgba(96,165,250,.14);
  background:rgba(2,6,23,.36);
  border-radius:16px;
  overflow:hidden;
}
.admin-create-details > summary{
  list-style:none;
  cursor:pointer;
  min-height:48px;
  padding:10px 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  color:#eaf2ff;
  font-weight:1000;
}
.admin-create-details > summary::-webkit-details-marker{display:none;}
.admin-create-details > summary::before{
  content:'+';
  width:26px;height:26px;border-radius:10px;
  display:inline-flex;align-items:center;justify-content:center;
  color:#fcd34d;background:rgba(245,158,11,.10);border:1px solid rgba(245,158,11,.18);
}
.admin-create-details[open] > summary::before{content:'−';}
.admin-create-details > summary small{font-size:10px;color:#93c5fd;font-weight:900;}
.admin-create-details .admin-create-grid{padding:12px!important;margin:0!important;}
.admin-role-guide{margin-top:8px!important;padding:10px!important;border-radius:16px!important;}
.role-guide-compact-head{display:grid;gap:3px;margin-bottom:8px;}
.role-guide-compact-title{font-size:12px;font-weight:1000;color:#fff;}
.role-guide-compact-note{font-size:10px;line-height:1.55;color:#94a3b8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.role-guide-mini-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.role-guide-mini-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 8px;border-radius:999px;background:rgba(15,23,42,.60);border:1px solid rgba(148,163,184,.12);color:#cbd5e1;}
.role-guide-mini-chip strong{font-size:10px;font-weight:1000;color:#eaf2ff;}
.role-guide-mini-chip small{font-size:9px;color:#93c5fd;}
.role-guide-mini-chip.active{background:rgba(245,158,11,.13);border-color:rgba(245,158,11,.28);}
.role-guide-mini-chip.active strong{color:#fde68a;}
.admin-permissions-details{margin:0 12px 12px!important;}

#view-superadmin.sa-compact-mode .admin-accounts-section{padding:14px!important;}
#view-superadmin.sa-compact-mode .admin-accounts-section .sa-section-head{padding-bottom:8px!important;}
#view-superadmin.sa-compact-mode .admin-management-card{padding:12px!important;border-radius:18px!important;}
.admin-management-subtitle{font-size:11px!important;line-height:1.45!important;}
.admin-create-live-hint{font-size:11px!important;padding:7px 10px!important;border-radius:12px!important;}
.admin-list-toolbar{
  grid-template-columns:minmax(120px,.65fr) minmax(180px,1.2fr) minmax(128px,.75fr) minmax(128px,.75fr) minmax(150px,.8fr) auto!important;
  padding:8px!important;
  gap:8px!important;
  border-radius:14px!important;
}
.admin-list-toolbar .input-glass,
.admin-list-toolbar select{min-height:36px!important;font-size:11px!important;}
.admin-toolbar-title{font-size:12px!important;}
.admin-edit-hint{font-size:10px!important;}
.admin-list-pro{gap:8px!important;}

.admin-card{
  display:block!important;
  padding:0!important;
  border-radius:16px!important;
  overflow:hidden!important;
  border:1px solid rgba(96,165,250,.13)!important;
  background:linear-gradient(180deg,rgba(15,23,42,.68),rgba(2,6,23,.82))!important;
  box-shadow:0 8px 22px rgba(2,8,23,.14), inset 0 1px 0 rgba(255,255,255,.025)!important;
}
details.admin-card > summary{list-style:none;}
details.admin-card > summary::-webkit-details-marker{display:none;}
.admin-card-summary{
  min-height:58px;
  padding:10px 12px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto 30px;
  align-items:center;
  gap:10px;
  cursor:pointer;
}
.admin-summary-main{min-width:0;}
.admin-summary-metrics{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end;color:#94a3b8;font-size:10px;font-weight:900;}
.admin-summary-metrics span{padding:5px 7px;border-radius:999px;background:rgba(15,23,42,.60);border:1px solid rgba(148,163,184,.10);white-space:nowrap;}
.admin-summary-metrics b{color:#f8fafc;}
.admin-card-chevron{
  width:28px;height:28px;border-radius:10px;
  display:inline-flex;align-items:center;justify-content:center;
  color:#93c5fd;background:rgba(59,130,246,.10);border:1px solid rgba(96,165,250,.16);
  transition:transform .18s ease;
}
details.admin-card[open] .admin-card-chevron{transform:rotate(180deg);}
.admin-card-body{
  border-top:1px solid rgba(148,163,184,.10);
  padding:10px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 132px;
  gap:10px;
}
.admin-card-body .admin-card-main{min-width:0;}
.admin-card-body .admin-trial-toggle-card.admin-state-row,
.admin-card-body .admin-mini-stats,
.admin-card-body .admin-card-grid,
.admin-card-body .admin-trial-meta,
.admin-card-body .admin-card-actions{
  padding:10px!important;
  border-radius:14px!important;
}
.admin-card-body .admin-state-hint{font-size:10px!important;line-height:1.55!important;}
.admin-card-body .admin-mini-stats{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:6px!important;margin-top:8px!important;}
.admin-card-body .admin-mini-stats > div{min-height:50px!important;padding:8px!important;border-radius:12px!important;}
.admin-card-body .admin-card-grid{grid-template-columns:1fr 1fr 1fr!important;gap:8px!important;margin-top:8px!important;}
.admin-card-body .admin-card-grid .input-glass,
.admin-card-body .admin-card-grid select{min-height:36px!important;font-size:11px!important;border-radius:11px!important;}
.admin-row-role-hint{font-size:10px!important;line-height:1.45!important;max-height:2.9em;overflow:hidden;}
.admin-card-actions{display:flex!important;flex-direction:column!important;gap:8px!important;min-width:0!important;justify-content:flex-start!important;}
.admin-action-btn{min-height:38px!important;padding:8px 10px!important;font-size:12px!important;border-radius:12px!important;}
.admin-action-icon{width:20px!important;height:20px!important;font-size:12px!important;}
.admin-card-sub{font-size:10px!important;margin-top:4px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.admin-card-name{font-size:14px!important;}
.admin-role-chip,.admin-current-chip,.admin-trial-badge,.admin-status-chip{font-size:9px!important;padding:4px 7px!important;}
.admin-trial-meta{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:6px!important;}
.admin-trial-stat span{font-size:9px!important;}
.admin-trial-stat .input-glass{min-height:34px!important;font-size:11px!important;}

@media (max-width:1180px){
  #view-superadmin.sa-compact-mode .lux-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .admin-list-toolbar{grid-template-columns:1fr 1fr!important;}
  .admin-card-summary{grid-template-columns:1fr 30px;}
  .admin-summary-metrics{grid-column:1/-1;justify-content:flex-start;}
  .admin-card-body{grid-template-columns:1fr;}
  .admin-card-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media (max-width:720px){
  #view-superadmin.sa-compact-mode .lux-stat-grid{grid-template-columns:1fr!important;}
  .admin-list-toolbar,.admin-card-body .admin-card-grid,.admin-card-body .admin-mini-stats,.admin-trial-meta{grid-template-columns:1fr!important;}
  .admin-card-actions{grid-template-columns:1fr!important;}
  .role-guide-compact-note{white-space:normal;}
}
/* V396_COMPACT_COLLAPSIBLE_ADMIN_UI_END */


/* V397_ULTRA_COMPACT_ACCOUNT_WORKFLOW_START
   Ultra-compact admin workflow: hide noise, fold aggressively, single-open account editing. */
#view-superadmin.sa-ultra-compact #saContent{
  width:min(100%,1060px)!important;
  max-width:1060px!important;
  display:flex!important;
  flex-direction:column!important;
  gap:8px!important;
}
#view-superadmin.sa-ultra-compact .premium-admin-hero{
  display:none!important;
}
#view-superadmin.sa-ultra-compact .lux-stat-grid{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:8px!important;
  margin-bottom:4px!important;
}
#view-superadmin.sa-ultra-compact .lux-stat-card{
  min-height:58px!important;
  padding:9px 10px!important;
  border-radius:14px!important;
}
#view-superadmin.sa-ultra-compact .lux-stat-head{margin-bottom:4px!important;gap:6px!important;}
#view-superadmin.sa-ultra-compact .lux-stat-kicker{font-size:8px!important;}
#view-superadmin.sa-ultra-compact .lux-inline-badge{font-size:8px!important;padding:3px 6px!important;}
#view-superadmin.sa-ultra-compact .lux-stat-value{font-size:13px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#view-superadmin.sa-ultra-compact .sa-section-shell{
  padding:10px!important;
  border-radius:15px!important;
  margin-bottom:6px!important;
}
#view-superadmin.sa-ultra-compact .sa-accordion-head{
  min-height:38px!important;
}
#view-superadmin.sa-ultra-compact .sa-accordion-head::before{
  width:24px!important;height:24px!important;border-radius:8px!important;font-size:12px!important;
}
#view-superadmin.sa-ultra-compact .sa-section-head h3,
#view-superadmin.sa-ultra-compact h3.text-2xl{font-size:14px!important;}
#view-superadmin.sa-ultra-compact .sa-section-kicker{font-size:8px!important;}
#view-superadmin.sa-ultra-compact .sa-mini-identity,
#view-superadmin.sa-ultra-compact .settings-panel-note,
#view-superadmin.sa-ultra-compact .premium-admin-subtitle,
#view-superadmin.sa-ultra-compact .admin-role-guide,
#view-superadmin.sa-ultra-compact .admin-management-subtitle,
#view-superadmin.sa-ultra-compact .admin-edit-hint,
#view-superadmin.sa-ultra-compact .admin-create-live-hint:not(.warn):not(.ok){
  display:none!important;
}
.sa-quick-fold-bar{
  position:sticky;
  top:8px;
  z-index:40;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:8px 10px;
  border-radius:14px;
  border:1px solid rgba(96,165,250,.16);
  background:linear-gradient(180deg,rgba(15,23,42,.92),rgba(2,6,23,.92));
  box-shadow:0 12px 30px rgba(2,8,23,.22), inset 0 1px 0 rgba(255,255,255,.035);
  backdrop-filter:blur(10px);
}
.sa-quick-fold-title{display:flex;align-items:center;gap:8px;min-width:0;}
.sa-quick-fold-title strong{font-size:12px;font-weight:1000;color:#f8fafc;white-space:nowrap;}
.sa-quick-fold-title span{font-size:10px;color:#93c5fd;white-space:nowrap;}
.sa-quick-fold-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end;}
.sa-quick-fold-actions button{
  min-height:30px;
  padding:5px 9px;
  border-radius:10px;
  border:1px solid rgba(96,165,250,.15);
  background:rgba(59,130,246,.10);
  color:#bfdbfe;
  font-size:10px;
  font-weight:1000;
  transition:.16s ease;
}
.sa-quick-fold-actions button:hover{background:#2563eb;color:white;border-color:#60a5fa;}
#view-superadmin.sa-ultra-compact .admin-accounts-section{
  padding:10px!important;
}
#view-superadmin.sa-ultra-compact .admin-accounts-section .sa-section-head{
  padding-bottom:6px!important;
  align-items:center!important;
}
#view-superadmin.sa-ultra-compact .admin-current-account-card,
#view-superadmin.sa-ultra-compact .admin-password-card,
#view-superadmin.sa-ultra-compact .admin-management-card{
  padding:10px!important;
  border-radius:15px!important;
  margin-bottom:8px!important;
}
#view-superadmin.sa-ultra-compact .admin-summary-grid{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:6px!important;
}
#view-superadmin.sa-ultra-compact .admin-summary-item{padding:8px!important;border-radius:12px!important;}
#view-superadmin.sa-ultra-compact .admin-summary-label{font-size:9px!important;margin-bottom:3px!important;}
#view-superadmin.sa-ultra-compact .admin-summary-value{font-size:11px!important;}
#view-superadmin.sa-ultra-compact .admin-management-head{padding-bottom:8px!important;margin-bottom:8px!important;}
#view-superadmin.sa-ultra-compact .admin-create-details > summary,
#view-superadmin.sa-ultra-compact .admin-permissions-details summary{
  min-height:36px!important;
  padding:7px 10px!important;
  font-size:11px!important;
}
#view-superadmin.sa-ultra-compact .admin-create-details > summary::before,
#view-superadmin.sa-ultra-compact .admin-permissions-details summary::before{
  width:22px!important;height:22px!important;border-radius:8px!important;
}
#view-superadmin.sa-ultra-compact .admin-create-grid{
  gap:8px!important;
  padding:8px!important;
}
#view-superadmin.sa-ultra-compact .admin-create-grid label,
#view-superadmin.sa-ultra-compact .admin-card-grid label{font-size:9px!important;margin-bottom:4px!important;}
#view-superadmin.sa-ultra-compact .admin-create-grid .input-glass,
#view-superadmin.sa-ultra-compact .admin-list-toolbar .input-glass,
#view-superadmin.sa-ultra-compact .admin-list-toolbar select,
#view-superadmin.sa-ultra-compact .admin-card-grid .input-glass,
#view-superadmin.sa-ultra-compact .admin-card-grid select{
  min-height:32px!important;
  font-size:11px!important;
  padding:6px 8px!important;
  border-radius:10px!important;
}
#view-superadmin.sa-ultra-compact .admin-list-toolbar{
  grid-template-columns:minmax(120px,.75fr) minmax(170px,1.4fr) minmax(110px,.75fr) minmax(110px,.75fr) minmax(125px,.75fr) auto!important;
  gap:6px!important;
  padding:6px!important;
  border-radius:12px!important;
}
#view-superadmin.sa-ultra-compact .admin-toolbar-title{font-size:11px!important;gap:5px!important;}
#view-superadmin.sa-ultra-compact .admin-toolbar-title span{font-size:9px!important;padding:3px 6px!important;}
#view-superadmin.sa-ultra-compact .admin-clear-btn{min-height:32px!important;font-size:10px!important;padding:6px 9px!important;border-radius:10px!important;}
#view-superadmin.sa-ultra-compact .admin-list-pro{gap:6px!important;}
#view-superadmin.sa-ultra-compact .admin-card{
  border-radius:13px!important;
  box-shadow:0 6px 16px rgba(2,8,23,.12), inset 0 1px 0 rgba(255,255,255,.02)!important;
}
#view-superadmin.sa-ultra-compact .admin-card-summary{
  min-height:44px!important;
  padding:7px 9px!important;
  grid-template-columns:minmax(0,1fr) auto 24px!important;
  gap:8px!important;
}
#view-superadmin.sa-ultra-compact .admin-card-name{font-size:12px!important;}
#view-superadmin.sa-ultra-compact .admin-card-sub{font-size:9px!important;margin-top:2px!important;}
#view-superadmin.sa-ultra-compact .admin-role-chip,
#view-superadmin.sa-ultra-compact .admin-current-chip,
#view-superadmin.sa-ultra-compact .admin-trial-badge,
#view-superadmin.sa-ultra-compact .admin-status-chip{font-size:8px!important;padding:3px 5px!important;}
#view-superadmin.sa-ultra-compact .admin-summary-metrics{font-size:9px!important;gap:4px!important;}
#view-superadmin.sa-ultra-compact .admin-summary-metrics span{padding:3px 5px!important;}
#view-superadmin.sa-ultra-compact .admin-card-chevron{width:22px!important;height:22px!important;border-radius:8px!important;font-size:11px!important;}
#view-superadmin.sa-ultra-compact .admin-card-body{
  padding:8px!important;
  grid-template-columns:minmax(0,1fr) 112px!important;
  gap:8px!important;
}
#view-superadmin.sa-ultra-compact .admin-card-body .admin-trial-toggle-card.admin-state-row,
#view-superadmin.sa-ultra-compact .admin-card-body .admin-mini-stats,
#view-superadmin.sa-ultra-compact .admin-card-body .admin-card-grid,
#view-superadmin.sa-ultra-compact .admin-card-body .admin-trial-meta,
#view-superadmin.sa-ultra-compact .admin-card-body .admin-card-actions{
  padding:8px!important;
  border-radius:12px!important;
}
#view-superadmin.sa-ultra-compact .admin-checkline{min-height:26px!important;padding:4px 7px!important;font-size:10px!important;border-radius:9px!important;}
#view-superadmin.sa-ultra-compact .admin-state-hint,
#view-superadmin.sa-ultra-compact .admin-row-role-hint{font-size:9px!important;line-height:1.4!important;}
#view-superadmin.sa-ultra-compact .admin-card-body .admin-mini-stats{display:none!important;}
#view-superadmin.sa-ultra-compact .admin-card-body .admin-card-grid{grid-template-columns:1fr 1fr 1fr!important;gap:6px!important;margin-top:6px!important;}
#view-superadmin.sa-ultra-compact .admin-trial-meta{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:5px!important;margin-top:6px!important;}
#view-superadmin.sa-ultra-compact .admin-trial-stat{padding:6px!important;border-radius:10px!important;}
#view-superadmin.sa-ultra-compact .admin-trial-stat span{font-size:8px!important;}
#view-superadmin.sa-ultra-compact .admin-trial-stat .input-glass{min-height:30px!important;font-size:10px!important;}
#view-superadmin.sa-ultra-compact .admin-card-actions{
  width:112px!important;
  gap:6px!important;
}
#view-superadmin.sa-ultra-compact .admin-action-btn{
  min-height:32px!important;
  padding:6px 8px!important;
  font-size:10px!important;
  border-radius:10px!important;
}
#view-superadmin.sa-ultra-compact .admin-action-icon{width:16px!important;height:16px!important;font-size:10px!important;}
#view-superadmin.sa-ultra-compact .permission-matrix-wrap{padding:8px!important;border-radius:12px!important;}
#view-superadmin.sa-ultra-compact .permission-matrix th,
#view-superadmin.sa-ultra-compact .permission-matrix td{padding:6px!important;font-size:10px!important;}
#view-superadmin.sa-ultra-compact .table-shell table th,
#view-superadmin.sa-ultra-compact .table-shell table td{padding:5px 7px!important;font-size:10px!important;}
@media (max-width:1180px){
  #view-superadmin.sa-ultra-compact .lux-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  #view-superadmin.sa-ultra-compact .admin-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  #view-superadmin.sa-ultra-compact .admin-list-toolbar{grid-template-columns:1fr 1fr!important;}
  #view-superadmin.sa-ultra-compact .admin-card-summary{grid-template-columns:1fr 24px!important;}
  #view-superadmin.sa-ultra-compact .admin-summary-metrics{grid-column:1/-1;justify-content:flex-start;}
  #view-superadmin.sa-ultra-compact .admin-card-body{grid-template-columns:1fr!important;}
  #view-superadmin.sa-ultra-compact .admin-card-actions{width:100%!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media (max-width:720px){
  .sa-quick-fold-bar{position:static;align-items:stretch;flex-direction:column;}
  .sa-quick-fold-actions{justify-content:stretch;}
  .sa-quick-fold-actions button{flex:1 1 120px;}
  #view-superadmin.sa-ultra-compact .admin-summary-grid,
  #view-superadmin.sa-ultra-compact .admin-list-toolbar,
  #view-superadmin.sa-ultra-compact .admin-card-body .admin-card-grid,
  #view-superadmin.sa-ultra-compact .admin-trial-meta{grid-template-columns:1fr!important;}
}
/* V397_ULTRA_COMPACT_ACCOUNT_WORKFLOW_END */


/* V398_SERVER_SETTINGS_USABILITY_NO_DELETE_START
   ضغط شاشة إعدادات السيرفر أكثر + إخفاء بطاقة الفتح عند الفتح + طي الحساب الحالي وكلمة المرور والفلاتر. */
#view-superadmin.sa-v398-usability #saContent{
  width:min(100%,1160px)!important;
  max-width:1160px!important;
  gap:6px!important;
}
#view-superadmin.sa-unlocked #saUnlock{display:none!important;}
#view-superadmin.sa-v398-usability .sa-quick-fold-bar{
  top:4px!important;
  min-height:38px!important;
  padding:6px 8px!important;
  border-radius:12px!important;
}
#view-superadmin.sa-v398-usability .sa-quick-fold-title strong{font-size:11px!important;}
#view-superadmin.sa-v398-usability .sa-quick-fold-title span{display:none!important;}
#view-superadmin.sa-v398-usability .sa-quick-fold-actions button{min-height:26px!important;padding:4px 8px!important;font-size:9px!important;border-radius:8px!important;}
#view-superadmin.sa-v398-usability .lux-stat-grid{display:none!important;}
#view-superadmin.sa-v398-usability .sa-section-shell{padding:8px!important;border-radius:13px!important;margin-bottom:5px!important;}
#view-superadmin.sa-v398-usability .sa-accordion-head{min-height:34px!important;}
#view-superadmin.sa-v398-usability .sa-accordion-head::before{width:22px!important;height:22px!important;border-radius:7px!important;font-size:11px!important;}
#view-superadmin.sa-v398-usability .sa-section-head h3,
#view-superadmin.sa-v398-usability h3.text-2xl{font-size:13px!important;line-height:1.25!important;}
#view-superadmin.sa-v398-usability .sa-section-kicker{font-size:7px!important;padding:3px 6px!important;}
#view-superadmin.sa-v398-usability .admin-accounts-section{padding:8px!important;}
#view-superadmin.sa-v398-usability .admin-accounts-section .sa-section-head{padding-bottom:4px!important;margin-bottom:6px!important;}
#view-superadmin.sa-v398-usability .admin-current-account-card,
#view-superadmin.sa-v398-usability .admin-password-card,
#view-superadmin.sa-v398-usability .admin-management-card{padding:8px!important;border-radius:13px!important;margin-bottom:6px!important;}
.v398-mini-details,
.v398-filter-details{
  border:1px solid rgba(96,165,250,.13)!important;
  border-radius:13px!important;
  background:rgba(2,6,23,.42)!important;
  overflow:hidden!important;
  margin-bottom:6px!important;
}
.v398-mini-details>summary,
.v398-filter-details>summary{
  list-style:none!important;
  cursor:pointer!important;
  min-height:34px!important;
  padding:7px 10px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:8px!important;
  color:#eaf2ff!important;
  font-size:11px!important;
  font-weight:1000!important;
}
.v398-mini-details>summary::-webkit-details-marker,
.v398-filter-details>summary::-webkit-details-marker{display:none!important;}
.v398-mini-details>summary::before,
.v398-filter-details>summary::before{
  content:'+'!important;
  width:20px!important;height:20px!important;border-radius:7px!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  color:#fcd34d!important;background:rgba(245,158,11,.10)!important;border:1px solid rgba(245,158,11,.20)!important;
  margin-inline-end:6px!important;
}
.v398-mini-details[open]>summary::before,
.v398-filter-details[open]>summary::before{content:'−'!important;}
.v398-mini-title{white-space:nowrap!important;}
.v398-mini-details>summary small,
.v398-filter-details>summary small{font-size:9px!important;color:#93c5fd!important;font-weight:900!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
.v398-mini-body{padding:7px!important;border-top:1px solid rgba(148,163,184,.08)!important;}
.v398-mini-body>.admin-current-account-card,
.v398-mini-body>.admin-password-card{margin:0!important;box-shadow:none!important;border-radius:11px!important;}
#view-superadmin.sa-v398-usability .admin-summary-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:5px!important;}
#view-superadmin.sa-v398-usability .admin-summary-item{min-height:44px!important;padding:6px 7px!important;border-radius:10px!important;}
#view-superadmin.sa-v398-usability .admin-summary-label{font-size:8px!important;margin-bottom:2px!important;}
#view-superadmin.sa-v398-usability .admin-summary-value{font-size:10px!important;}
#view-superadmin.sa-v398-usability .admin-password-card h4,
#view-superadmin.sa-v398-usability .admin-current-account-card h4{font-size:13px!important;}
#view-superadmin.sa-v398-usability .admin-password-card p,
#view-superadmin.sa-v398-usability .admin-current-account-card p{display:none!important;}
#view-superadmin.sa-v398-usability .admin-password-card .grid{gap:6px!important;}
#view-superadmin.sa-v398-usability .admin-password-card label{font-size:9px!important;margin-bottom:3px!important;}
#view-superadmin.sa-v398-usability .admin-password-card .mt-4{margin-top:7px!important;}
#view-superadmin.sa-v398-usability .admin-password-card button{min-height:30px!important;padding:6px 10px!important;font-size:10px!important;border-radius:9px!important;}
.v398-admin-mini-actions{display:flex!important;align-items:center!important;gap:5px!important;flex-wrap:wrap!important;justify-content:flex-start!important;}
.v398-admin-mini-actions button{min-height:28px!important;padding:4px 8px!important;border-radius:8px!important;border:1px solid rgba(96,165,250,.16)!important;background:rgba(59,130,246,.10)!important;color:#bfdbfe!important;font-size:9px!important;font-weight:1000!important;}
.v398-admin-mini-actions button:hover{background:#2563eb!important;color:white!important;}
#view-superadmin.sa-v398-usability .admin-management-head{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:6px!important;align-items:center!important;padding-bottom:6px!important;margin-bottom:6px!important;}
#view-superadmin.sa-v398-usability .admin-management-head h3{font-size:13px!important;}
#view-superadmin.sa-v398-usability .admin-management-head #adminsCount{font-size:8px!important;padding:3px 6px!important;}
.v398-filter-details .admin-list-toolbar{margin:0!important;border:0!important;border-top:1px solid rgba(148,163,184,.08)!important;border-radius:0!important;background:transparent!important;}
#view-superadmin.sa-v398-usability .admin-list-toolbar{grid-template-columns:minmax(160px,1.2fr) repeat(3,minmax(90px,.65fr)) auto!important;gap:5px!important;padding:6px!important;}
#view-superadmin.sa-v398-usability .admin-toolbar-title{display:none!important;}
#view-superadmin.sa-v398-usability .admin-list-toolbar .input-glass,
#view-superadmin.sa-v398-usability .admin-list-toolbar select{min-height:30px!important;font-size:10px!important;padding:5px 7px!important;border-radius:9px!important;}
#view-superadmin.sa-v398-usability .admin-clear-btn{min-height:30px!important;font-size:9px!important;padding:5px 8px!important;border-radius:9px!important;}
#view-superadmin.sa-v398-usability .admin-list-pro{gap:5px!important;}
#view-superadmin.sa-v398-usability .admin-card-summary{min-height:38px!important;padding:6px 8px!important;grid-template-columns:minmax(0,1fr) auto 22px!important;}
#view-superadmin.sa-v398-usability .admin-card-name{font-size:11px!important;}
#view-superadmin.sa-v398-usability .admin-card-sub{font-size:8px!important;max-width:260px!important;}
#view-superadmin.sa-v398-usability .admin-summary-metrics{font-size:8px!important;gap:3px!important;}
#view-superadmin.sa-v398-usability .admin-summary-metrics span{padding:2px 5px!important;border-radius:8px!important;}
#view-superadmin.sa-v398-usability .admin-card-chevron{width:20px!important;height:20px!important;border-radius:7px!important;font-size:10px!important;}
#view-superadmin.sa-v398-usability .admin-card-body{padding:6px!important;grid-template-columns:minmax(0,1fr) 104px!important;gap:6px!important;}
#view-superadmin.sa-v398-usability .admin-card-body .admin-card-grid{grid-template-columns:1.15fr 1fr 1fr!important;gap:5px!important;margin-top:5px!important;padding:6px!important;}
#view-superadmin.sa-v398-usability .admin-card-body .admin-card-grid .input-glass,
#view-superadmin.sa-v398-usability .admin-card-body .admin-card-grid select{min-height:29px!important;font-size:10px!important;padding:5px 7px!important;border-radius:8px!important;}
#view-superadmin.sa-v398-usability .admin-card-actions{width:104px!important;gap:5px!important;padding:6px!important;border-radius:10px!important;}
#view-superadmin.sa-v398-usability .admin-card-actions::before{display:none!important;}
#view-superadmin.sa-v398-usability .admin-action-btn{min-height:29px!important;padding:5px 6px!important;font-size:9px!important;border-radius:8px!important;}
#view-superadmin.sa-v398-usability .admin-action-icon{display:none!important;}
#view-superadmin.sa-v398-usability .admin-row-role-hint,
#view-superadmin.sa-v398-usability .admin-state-hint{display:none!important;}
#view-superadmin.sa-v398-usability .admin-trial-toggle-card.admin-state-row{padding:6px!important;border-radius:10px!important;}
#view-superadmin.sa-v398-usability .admin-checkline{min-height:24px!important;padding:3px 6px!important;font-size:9px!important;border-radius:8px!important;}
#view-superadmin.sa-v398-usability .admin-trial-meta{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:4px!important;padding:6px!important;}
#view-superadmin.sa-v398-usability .admin-trial-stat{padding:5px!important;border-radius:8px!important;}
#view-superadmin.sa-v398-usability .admin-trial-stat span{font-size:7px!important;}
#view-superadmin.sa-v398-usability .admin-trial-stat .input-glass{min-height:28px!important;font-size:9px!important;}
@media(max-width:1180px){
  #view-superadmin.sa-v398-usability #saContent{max-width:100%!important;}
  #view-superadmin.sa-v398-usability .admin-card-body{grid-template-columns:1fr!important;}
  #view-superadmin.sa-v398-usability .admin-card-actions{width:100%!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  #view-superadmin.sa-v398-usability .admin-list-toolbar{grid-template-columns:1fr 1fr!important;}
}
@media(max-width:720px){
  #view-superadmin.sa-v398-usability .admin-summary-grid,
  #view-superadmin.sa-v398-usability .admin-card-body .admin-card-grid,
  #view-superadmin.sa-v398-usability .admin-trial-meta,
  #view-superadmin.sa-v398-usability .admin-list-toolbar{grid-template-columns:1fr!important;}
  .v398-mini-details>summary small,.v398-filter-details>summary small{display:none!important;}
}
/* V398_SERVER_SETTINGS_USABILITY_NO_DELETE_END */

/* V399_SERVER_SETTINGS_GATE_PASSWORD_PRO_UI_START */
#view-superadmin.sa-v399-gate-locked{
  min-height:calc(100vh - 120px)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:34px 18px!important;
}
#view-superadmin.sa-v399-gate-locked #saContent{display:none!important;}
#view-superadmin.sa-v399-gate-locked #saUnlock{display:flex!important;}
#view-superadmin.sa-v399-gate-open{display:block!important;}
#view-superadmin.sa-v399-gate-open #saUnlock,
#view-superadmin.sa-unlocked #saUnlock{display:none!important;}
.sa-v399-login-wrap{
  width:min(920px,100%)!important;
  margin:0 auto!important;
  direction:rtl!important;
  align-items:center!important;
  justify-content:center!important;
}
.sa-v399-login-card{
  position:relative!important;
  width:100%!important;
  min-height:310px!important;
  border-radius:30px!important;
  padding:34px!important;
  display:grid!important;
  grid-template-columns:minmax(220px,.82fr) minmax(320px,1.18fr)!important;
  gap:30px!important;
  align-items:center!important;
  overflow:hidden!important;
  border:1px solid rgba(96,165,250,.24)!important;
  background:
    radial-gradient(circle at 82% 18%, rgba(59,130,246,.28), transparent 30%),
    radial-gradient(circle at 14% 82%, rgba(16,185,129,.10), transparent 34%),
    linear-gradient(135deg, rgba(15,23,42,.95), rgba(2,6,23,.93))!important;
  box-shadow:0 34px 95px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,255,255,.05)!important;
}
.sa-v399-login-card::before{
  content:''!important;
  position:absolute!important;
  inset:0!important;
  pointer-events:none!important;
  background:linear-gradient(115deg, transparent 0%, rgba(255,255,255,.05) 34%, transparent 56%)!important;
}
.sa-v399-login-card::after{
  content:''!important;
  position:absolute!important;
  inset:14px!important;
  border-radius:24px!important;
  border:1px solid rgba(148,163,184,.10)!important;
  pointer-events:none!important;
}
.sa-v399-lock-visual{
  position:relative!important;
  min-height:210px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  isolation:isolate!important;
}
.sa-v399-lock-ring{
  width:172px!important;
  height:172px!important;
  border-radius:36px!important;
  transform:rotate(45deg)!important;
  border:1px solid rgba(96,165,250,.32)!important;
  background:linear-gradient(135deg, rgba(37,99,235,.20), rgba(15,23,42,.35))!important;
  box-shadow:0 0 0 14px rgba(59,130,246,.055), 0 0 50px rgba(37,99,235,.24), inset 0 0 24px rgba(59,130,246,.16)!important;
}
.sa-v399-lock-icon{
  position:absolute!important;
  width:86px!important;
  height:86px!important;
  border-radius:28px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  color:#dbeafe!important;
  font-size:38px!important;
  font-weight:1000!important;
  background:rgba(15,23,42,.72)!important;
  border:1px solid rgba(147,197,253,.32)!important;
  box-shadow:0 12px 42px rgba(37,99,235,.34)!important;
}
.sa-v399-lock-icon::before{content:'🔒'!important;}
.sa-v399-lock-icon{font-size:0!important;}
.sa-v399-login-copy,.sa-v399-login-form{position:relative!important;z-index:1!important;}
.sa-v399-login-copy{text-align:right!important;}
.sa-v399-secure-chip{
  display:inline-flex!important;
  align-items:center!important;
  gap:8px!important;
  min-height:28px!important;
  padding:5px 10px!important;
  margin-bottom:14px!important;
  border-radius:999px!important;
  border:1px solid rgba(34,197,94,.22)!important;
  background:rgba(34,197,94,.08)!important;
  color:#bbf7d0!important;
  font-size:11px!important;
  font-weight:1000!important;
}
.sa-v399-secure-chip span{
  width:8px!important;height:8px!important;border-radius:999px!important;
  background:#22c55e!important;box-shadow:0 0 14px rgba(34,197,94,.75)!important;
}
.sa-v399-login-copy h2{
  margin:0 0 10px!important;
  color:#f8fafc!important;
  font-size:31px!important;
  line-height:1.18!important;
  font-weight:1000!important;
  letter-spacing:-.02em!important;
}
.sa-v399-login-copy p{
  margin:0!important;
  max-width:560px!important;
  color:#94a3b8!important;
  font-size:14px!important;
  line-height:1.9!important;
  font-weight:700!important;
}
.sa-v399-login-form{
  margin-top:22px!important;
  max-width:520px!important;
}
.sa-v399-login-form label{
  display:block!important;
  color:#dbeafe!important;
  font-size:12px!important;
  font-weight:1000!important;
  margin-bottom:8px!important;
}
.sa-v399-passbox{
  position:relative!important;
  display:grid!important;
  grid-template-columns:42px minmax(0,1fr)!important;
  align-items:center!important;
  gap:8px!important;
}
.sa-v399-passbox input{
  grid-column:1 / -1!important;
  width:100%!important;
  height:48px!important;
  min-height:48px!important;
  padding:0 50px 0 14px!important;
  border-radius:14px!important;
  font-size:15px!important;
  font-weight:900!important;
  color:#f8fafc!important;
  border:1px solid rgba(96,165,250,.26)!important;
  background:rgba(2,6,23,.58)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04)!important;
}
.sa-v399-passbox input:focus{
  border-color:rgba(96,165,250,.72)!important;
  box-shadow:0 0 0 4px rgba(59,130,246,.14), inset 0 1px 0 rgba(255,255,255,.05)!important;
}
.sa-v399-eye{
  position:absolute!important;
  inset-inline-start:8px!important;
  top:7px!important;
  width:34px!important;
  height:34px!important;
  border-radius:10px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid rgba(148,163,184,.16)!important;
  background:rgba(15,23,42,.72)!important;
  color:#93c5fd!important;
  font-size:13px!important;
}
.sa-v399-eye:hover{background:rgba(37,99,235,.24)!important;color:#fff!important;}
.sa-v399-unlock-btn{
  width:100%!important;
  min-height:48px!important;
  margin-top:12px!important;
  border-radius:14px!important;
  border:1px solid rgba(147,197,253,.32)!important;
  background:linear-gradient(135deg,#1d4ed8,#3b82f6)!important;
  color:#fff!important;
  font-size:15px!important;
  font-weight:1000!important;
  box-shadow:0 16px 34px rgba(37,99,235,.28), inset 0 1px 0 rgba(255,255,255,.16)!important;
}
.sa-v399-unlock-btn:hover{filter:brightness(1.07)!important;transform:translateY(-1px)!important;}
.sa-v399-login-hint{
  margin-top:12px!important;
  min-height:20px!important;
  color:#93c5fd!important;
  font-size:11px!important;
  font-weight:800!important;
  text-align:center!important;
}
#view-superadmin.sa-v399-gate-open #saContent{
  animation:saV399ContentIn .22s ease-out!important;
}
@keyframes saV399ContentIn{from{opacity:.35;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
#view-superadmin.sa-v399-gate-open .premium-admin-hero{
  display:none!important;
}
#view-superadmin.sa-v399-gate-open .admin-password-card{
  background:linear-gradient(135deg,rgba(15,23,42,.94),rgba(2,6,23,.86))!important;
  border:1px solid rgba(96,165,250,.16)!important;
  box-shadow:0 14px 36px rgba(2,6,23,.20)!important;
}
#view-superadmin.sa-v399-gate-open .admin-password-card h4::before{
  content:'🔐';
  margin-inline-end:8px;
  font-size:14px;
}
@media(max-width:900px){
  .sa-v399-login-card{grid-template-columns:1fr!important;padding:22px!important;border-radius:24px!important;gap:14px!important;}
  .sa-v399-lock-visual{min-height:130px!important;}
  .sa-v399-lock-ring{width:112px!important;height:112px!important;border-radius:28px!important;}
  .sa-v399-lock-icon{width:62px!important;height:62px!important;border-radius:20px!important;}
  .sa-v399-login-copy h2{font-size:24px!important;}
  .sa-v399-login-copy p{font-size:12px!important;}
}
/* V399_SERVER_SETTINGS_GATE_PASSWORD_PRO_UI_END */


/* V400_SERVER_SETTINGS_GATE_LAYOUT_FIX_START
   إصلاح نهائي لشاشة باسورد إعدادات السيرفر: إلغاء الجريد المكسور، كارت رأسي احترافي، وCache-busting عبر templates_content.py. */
#view-superadmin.sa-v399-gate-locked{
  min-height:calc(100vh - 92px)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:28px clamp(14px,3vw,42px)!important;
  overflow:hidden!important;
}
#view-superadmin.sa-v399-gate-locked #saContent{display:none!important;visibility:hidden!important;}
#view-superadmin.sa-v399-gate-locked #saUnlock,
.sa-v400-gate{
  width:100%!important;
  max-width:620px!important;
  margin-inline:auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  direction:rtl!important;
}
#saUnlock.sa-v400-gate.hidden{display:none!important;}
.sa-v400-gate-card,
#saUnlock .sa-v399-login-card{
  position:relative!important;
  width:100%!important;
  min-height:0!important;
  padding:22px!important;
  border-radius:24px!important;
  display:flex!important;
  flex-direction:column!important;
  grid-template-columns:none!important;
  gap:18px!important;
  align-items:stretch!important;
  overflow:hidden!important;
  border:1px solid rgba(96,165,250,.26)!important;
  background:
    radial-gradient(circle at 84% 0%, rgba(59,130,246,.26), transparent 32%),
    radial-gradient(circle at 10% 100%, rgba(14,165,233,.12), transparent 36%),
    linear-gradient(145deg, rgba(15,23,42,.96), rgba(2,6,23,.94))!important;
  box-shadow:0 24px 74px rgba(0,0,0,.44), inset 0 1px 0 rgba(255,255,255,.055)!important;
}
.sa-v400-gate-card::before,
#saUnlock .sa-v399-login-card::before{
  content:''!important;
  position:absolute!important;
  inset:0!important;
  pointer-events:none!important;
  background:linear-gradient(120deg, transparent 0%, rgba(255,255,255,.045) 38%, transparent 58%)!important;
}
.sa-v400-gate-card::after,
#saUnlock .sa-v399-login-card::after{
  content:''!important;
  position:absolute!important;
  inset:10px!important;
  border-radius:18px!important;
  border:1px solid rgba(148,163,184,.09)!important;
  pointer-events:none!important;
}
.sa-v400-gate-top{
  position:relative!important;
  z-index:1!important;
  display:grid!important;
  grid-template-columns:74px minmax(0,1fr)!important;
  gap:16px!important;
  align-items:center!important;
}
.sa-v400-gate-icon{
  width:74px!important;
  height:74px!important;
  border-radius:22px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:28px!important;
  color:#dbeafe!important;
  border:1px solid rgba(147,197,253,.30)!important;
  background:linear-gradient(145deg,rgba(37,99,235,.26),rgba(15,23,42,.72))!important;
  box-shadow:0 16px 38px rgba(37,99,235,.25), inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.sa-v400-gate-copy{min-width:0!important;text-align:right!important;position:relative!important;z-index:1!important;}
.sa-v400-secure-chip{
  display:inline-flex!important;
  align-items:center!important;
  gap:7px!important;
  min-height:24px!important;
  padding:4px 9px!important;
  margin-bottom:8px!important;
  border-radius:999px!important;
  border:1px solid rgba(34,197,94,.24)!important;
  background:rgba(34,197,94,.08)!important;
  color:#bbf7d0!important;
  font-size:10px!important;
  font-weight:1000!important;
}
.sa-v400-secure-chip span{width:7px!important;height:7px!important;border-radius:999px!important;background:#22c55e!important;box-shadow:0 0 12px rgba(34,197,94,.8)!important;}
.sa-v400-gate-copy h2,
#saUnlock .sa-v399-login-copy h2{
  margin:0 0 6px!important;
  color:#f8fafc!important;
  font-size:clamp(24px,3vw,32px)!important;
  line-height:1.22!important;
  font-weight:1000!important;
  letter-spacing:-.02em!important;
  white-space:normal!important;
  word-break:normal!important;
}
.sa-v400-gate-copy p,
#saUnlock .sa-v399-login-copy p{
  margin:0!important;
  color:#9fb0c8!important;
  font-size:13px!important;
  line-height:1.75!important;
  font-weight:800!important;
  max-width:100%!important;
}
.sa-v400-form{
  position:relative!important;
  z-index:1!important;
  display:grid!important;
  gap:10px!important;
  padding:16px!important;
  border-radius:18px!important;
  border:1px solid rgba(96,165,250,.16)!important;
  background:rgba(2,6,23,.36)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
}
.sa-v400-form label,
#saUnlock .sa-v399-login-form label{
  display:block!important;
  color:#dbeafe!important;
  font-size:12px!important;
  line-height:1.2!important;
  font-weight:1000!important;
  margin:0!important;
  text-align:right!important;
}
.sa-v400-passbox,
#saUnlock .sa-v399-passbox{
  position:relative!important;
  display:block!important;
  width:100%!important;
}
.sa-v400-input,
#saUnlock .sa-v399-passbox input{
  width:100%!important;
  height:46px!important;
  min-height:46px!important;
  padding:0 46px 0 14px!important;
  border-radius:14px!important;
  text-align:right!important;
  font-size:14px!important;
  font-weight:900!important;
  color:#f8fafc!important;
  outline:none!important;
  border:1px solid rgba(96,165,250,.27)!important;
  background:rgba(2,6,23,.68)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045)!important;
}
.sa-v400-input:focus,
#saUnlock .sa-v399-passbox input:focus{
  border-color:rgba(96,165,250,.78)!important;
  box-shadow:0 0 0 4px rgba(59,130,246,.16), inset 0 1px 0 rgba(255,255,255,.05)!important;
}
.sa-v400-eye,
#saUnlock .sa-v399-eye{
  position:absolute!important;
  inset-inline-start:8px!important;
  top:6px!important;
  width:34px!important;
  height:34px!important;
  border-radius:11px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid rgba(148,163,184,.16)!important;
  background:rgba(15,23,42,.78)!important;
  color:#93c5fd!important;
  font-size:13px!important;
  cursor:pointer!important;
}
.sa-v400-unlock-btn,
#saUnlock .sa-v399-unlock-btn{
  width:100%!important;
  min-height:46px!important;
  margin:0!important;
  border-radius:14px!important;
  border:1px solid rgba(147,197,253,.34)!important;
  background:linear-gradient(135deg,#1d4ed8,#3b82f6)!important;
  color:#fff!important;
  font-size:15px!important;
  font-weight:1000!important;
  cursor:pointer!important;
  box-shadow:0 14px 32px rgba(37,99,235,.30), inset 0 1px 0 rgba(255,255,255,.16)!important;
}
.sa-v400-unlock-btn:hover,
#saUnlock .sa-v399-unlock-btn:hover{filter:brightness(1.07)!important;transform:translateY(-1px)!important;}
.sa-v400-hint,
#saUnlock .sa-v399-login-hint{
  min-height:18px!important;
  margin:0!important;
  color:#93c5fd!important;
  font-size:11px!important;
  font-weight:800!important;
  text-align:center!important;
}
/* Hide old V399 decorative grid items if an older generated template is accidentally cached. */
#saUnlock .sa-v399-lock-visual{display:none!important;}
#saUnlock .sa-v399-login-copy{position:relative!important;z-index:1!important;text-align:right!important;}
#saUnlock .sa-v399-login-form{position:relative!important;z-index:1!important;display:grid!important;gap:10px!important;max-width:none!important;margin:0!important;padding:16px!important;border-radius:18px!important;border:1px solid rgba(96,165,250,.16)!important;background:rgba(2,6,23,.36)!important;}
@media(max-width:720px){
  #view-superadmin.sa-v399-gate-locked{padding:18px 12px!important;align-items:flex-start!important;}
  #view-superadmin.sa-v399-gate-locked #saUnlock,.sa-v400-gate{max-width:100%!important;}
  .sa-v400-gate-card,#saUnlock .sa-v399-login-card{padding:18px!important;border-radius:20px!important;gap:14px!important;}
  .sa-v400-gate-top{grid-template-columns:56px minmax(0,1fr)!important;gap:12px!important;}
  .sa-v400-gate-icon{width:56px!important;height:56px!important;border-radius:18px!important;font-size:22px!important;}
  .sa-v400-gate-copy h2,#saUnlock .sa-v399-login-copy h2{font-size:23px!important;}
  .sa-v400-gate-copy p,#saUnlock .sa-v399-login-copy p{font-size:12px!important;line-height:1.65!important;}
}
/* V400_SERVER_SETTINGS_GATE_LAYOUT_FIX_END */

/* V401_SERVER_SETTINGS_GATE_PASSWORD_FINAL_FIX_START
   شاشة باسورد إعدادات السيرفر المعزولة: لا تعتمد على Grid/Classes القديمة حتى لا تتكسر. */
#view-superadmin.sa-v399-gate-locked{
  min-height:calc(100vh - 88px)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:28px clamp(16px,3vw,44px)!important;
  overflow:hidden!important;
}
#view-superadmin.sa-v399-gate-locked #saContent{display:none!important;visibility:hidden!important;pointer-events:none!important;}
#view-superadmin.sa-v399-gate-open #saUnlock,
#view-superadmin.sa-unlocked #saUnlock{display:none!important;visibility:hidden!important;pointer-events:none!important;}
#saUnlock.sa-v401-gate{
  width:100%!important;
  max-width:560px!important;
  margin:0 auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  direction:rtl!important;
  box-sizing:border-box!important;
}
#saUnlock.sa-v401-gate.hidden{display:none!important;}
#saUnlock .sa-v401-card{
  position:relative!important;
  isolation:isolate!important;
  width:100%!important;
  max-width:560px!important;
  min-width:0!important;
  min-height:0!important;
  box-sizing:border-box!important;
  padding:24px!important;
  border-radius:26px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  justify-content:flex-start!important;
  gap:18px!important;
  overflow:hidden!important;
  border:1px solid rgba(96,165,250,.28)!important;
  background:
    radial-gradient(circle at 90% 0%, rgba(59,130,246,.26), transparent 32%),
    radial-gradient(circle at 0% 100%, rgba(14,165,233,.12), transparent 36%),
    linear-gradient(145deg, rgba(15,23,42,.98), rgba(2,6,23,.95))!important;
  box-shadow:0 28px 80px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,255,255,.06)!important;
}
#saUnlock .sa-v401-card::before{
  content:''!important;
  position:absolute!important;
  inset:0!important;
  pointer-events:none!important;
  background:linear-gradient(120deg, transparent 0%, rgba(255,255,255,.045) 38%, transparent 58%)!important;
  z-index:0!important;
}
#saUnlock .sa-v401-card::after{
  content:''!important;
  position:absolute!important;
  inset:10px!important;
  border-radius:20px!important;
  border:1px solid rgba(148,163,184,.09)!important;
  pointer-events:none!important;
  z-index:0!important;
}
#saUnlock .sa-v401-head{
  position:relative!important;
  z-index:1!important;
  display:grid!important;
  grid-template-columns:72px minmax(0,1fr)!important;
  gap:16px!important;
  align-items:center!important;
  width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
}
#saUnlock .sa-v401-lock{
  width:72px!important;
  height:72px!important;
  min-width:72px!important;
  border-radius:23px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:27px!important;
  line-height:1!important;
  color:#dbeafe!important;
  border:1px solid rgba(147,197,253,.32)!important;
  background:linear-gradient(145deg,rgba(37,99,235,.30),rgba(15,23,42,.76))!important;
  box-shadow:0 16px 38px rgba(37,99,235,.25), inset 0 1px 0 rgba(255,255,255,.08)!important;
}
#saUnlock .sa-v401-copy{
  min-width:0!important;
  max-width:100%!important;
  text-align:right!important;
}
#saUnlock .sa-v401-chip{
  display:inline-flex!important;
  align-items:center!important;
  gap:7px!important;
  min-height:24px!important;
  padding:4px 9px!important;
  margin:0 0 8px!important;
  border-radius:999px!important;
  border:1px solid rgba(34,197,94,.24)!important;
  background:rgba(34,197,94,.08)!important;
  color:#bbf7d0!important;
  font-size:10px!important;
  font-weight:1000!important;
  white-space:nowrap!important;
}
#saUnlock .sa-v401-chip span{
  width:7px!important;
  height:7px!important;
  border-radius:999px!important;
  background:#22c55e!important;
  box-shadow:0 0 12px rgba(34,197,94,.8)!important;
}
#saUnlock .sa-v401-copy h2{
  display:block!important;
  margin:0 0 6px!important;
  color:#f8fafc!important;
  font-size:clamp(24px,2.6vw,31px)!important;
  line-height:1.18!important;
  font-weight:1000!important;
  letter-spacing:-.02em!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  word-break:normal!important;
  overflow-wrap:normal!important;
}
#saUnlock .sa-v401-copy p{
  display:block!important;
  margin:0!important;
  color:#9fb0c8!important;
  font-size:13px!important;
  line-height:1.75!important;
  font-weight:800!important;
  max-width:100%!important;
  white-space:normal!important;
}
#saUnlock .sa-v401-form{
  position:relative!important;
  z-index:1!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  gap:10px!important;
  width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
  margin:0!important;
  padding:16px!important;
  border-radius:18px!important;
  border:1px solid rgba(96,165,250,.16)!important;
  background:rgba(2,6,23,.38)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
}
#saUnlock .sa-v401-form label{
  display:block!important;
  margin:0!important;
  color:#dbeafe!important;
  font-size:12px!important;
  line-height:1.2!important;
  font-weight:1000!important;
  text-align:right!important;
}
#saUnlock .sa-v401-passbox{
  position:relative!important;
  display:block!important;
  width:100%!important;
  min-width:0!important;
}
#saUnlock .sa-v401-input{
  display:block!important;
  width:100%!important;
  height:48px!important;
  min-height:48px!important;
  box-sizing:border-box!important;
  padding:0 46px 0 14px!important;
  border-radius:14px!important;
  text-align:right!important;
  font-size:14px!important;
  font-weight:900!important;
  color:#f8fafc!important;
  outline:none!important;
  border:1px solid rgba(96,165,250,.30)!important;
  background:rgba(2,6,23,.70)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045)!important;
}
#saUnlock .sa-v401-input:focus{
  border-color:rgba(96,165,250,.82)!important;
  box-shadow:0 0 0 4px rgba(59,130,246,.16), inset 0 1px 0 rgba(255,255,255,.05)!important;
}
#saUnlock .sa-v401-eye{
  position:absolute!important;
  inset-inline-start:8px!important;
  top:7px!important;
  width:34px!important;
  height:34px!important;
  border-radius:11px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid rgba(148,163,184,.16)!important;
  background:rgba(15,23,42,.80)!important;
  color:#93c5fd!important;
  font-size:13px!important;
  cursor:pointer!important;
}
#saUnlock .sa-v401-eye:hover{background:rgba(37,99,235,.26)!important;color:#fff!important;}
#saUnlock .sa-v401-unlock-btn{
  display:flex!important;
  width:100%!important;
  min-height:48px!important;
  align-items:center!important;
  justify-content:center!important;
  margin:0!important;
  padding:0 16px!important;
  border-radius:14px!important;
  border:1px solid rgba(147,197,253,.36)!important;
  background:linear-gradient(135deg,#1d4ed8,#3b82f6)!important;
  color:#fff!important;
  font-size:15px!important;
  line-height:1!important;
  font-weight:1000!important;
  cursor:pointer!important;
  box-shadow:0 14px 32px rgba(37,99,235,.30), inset 0 1px 0 rgba(255,255,255,.16)!important;
}
#saUnlock .sa-v401-unlock-btn:hover{filter:brightness(1.07)!important;transform:translateY(-1px)!important;}
#saUnlock .sa-v401-hint{
  display:block!important;
  min-height:18px!important;
  margin:0!important;
  color:#93c5fd!important;
  font-size:11px!important;
  font-weight:800!important;
  text-align:center!important;
}
@media(max-width:720px){
  #view-superadmin.sa-v399-gate-locked{align-items:flex-start!important;padding:18px 12px!important;}
  #saUnlock.sa-v401-gate{max-width:100%!important;}
  #saUnlock .sa-v401-card{padding:18px!important;border-radius:21px!important;gap:14px!important;}
  #saUnlock .sa-v401-head{grid-template-columns:56px minmax(0,1fr)!important;gap:12px!important;}
  #saUnlock .sa-v401-lock{width:56px!important;height:56px!important;min-width:56px!important;border-radius:18px!important;font-size:22px!important;}
  #saUnlock .sa-v401-copy h2{font-size:23px!important;}
  #saUnlock .sa-v401-copy p{font-size:12px!important;line-height:1.65!important;}
  #saUnlock .sa-v401-form{padding:14px!important;}
}
/* V401_SERVER_SETTINGS_GATE_PASSWORD_FINAL_FIX_END */


/* V402_DASHBOARD_BEAUTY_POLISH_START
   لمسة جمالية آمنة للوحة: تحسين الهوية البصرية بدون تغيير منطق التشغيل أو الصلاحيات. */
:root{
  --v402-bg-0:#050b18;
  --v402-bg-1:#071326;
  --v402-bg-2:#0b1b32;
  --v402-card:rgba(9, 20, 38, .82);
  --v402-card-soft:rgba(15, 33, 58, .62);
  --v402-line:rgba(96,165,250,.18);
  --v402-line-strong:rgba(96,165,250,.34);
  --v402-glow:rgba(37,99,235,.26);
  --v402-cyan:rgba(14,165,233,.24);
  --v402-text:#f8fafc;
  --v402-muted:#9fb1ca;
  --v402-radius:22px;
}
html{scrollbar-gutter:stable;}
body:not([data-login-only]):not([data-activation-only]){
  background:
    radial-gradient(circle at 10% -10%, rgba(59,130,246,.22), transparent 34%),
    radial-gradient(circle at 88% 12%, rgba(14,165,233,.16), transparent 30%),
    linear-gradient(135deg,var(--v402-bg-1),var(--v402-bg-0) 48%, #08111f)!important;
  color:var(--v402-text)!important;
}
body:not([data-login-only]):not([data-activation-only])::before{
  content:'';
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  background:
    linear-gradient(115deg, rgba(255,255,255,.045) 0 1px, transparent 1px 140px),
    radial-gradient(circle at 50% 100%, rgba(59,130,246,.10), transparent 34%);
  opacity:.48;
}
#appView.app-shell{
  gap:clamp(14px,1.8vw,26px)!important;
}
.card,
.section-shell,
.table-shell,
.sidebar-user-card,
.sidebar-brand-card,
.sidebar-nav-wrap,
.sidebar-footnote,
.modal-card{
  border-color:var(--v402-line)!important;
  background:
    linear-gradient(145deg, rgba(15,23,42,.86), rgba(6,16,31,.78))!important;
  box-shadow:
    0 18px 45px rgba(0,0,0,.26),
    inset 0 1px 0 rgba(255,255,255,.045)!important;
  backdrop-filter:blur(18px) saturate(125%);
}
.card:hover,
.section-shell:hover,
.table-shell:hover{
  border-color:rgba(96,165,250,.28)!important;
}
.app-sidebar{
  background:
    linear-gradient(180deg, rgba(15,30,55,.94), rgba(5,13,27,.92))!important;
  border-color:rgba(96,165,250,.26)!important;
  box-shadow:0 24px 70px rgba(0,0,0,.40), inset 1px 0 0 rgba(255,255,255,.035)!important;
}
.sidebar-brand-card{
  position:relative;
  overflow:hidden;
}
.sidebar-brand-card::after{
  content:'';
  position:absolute;
  inset:auto -20% -60% -20%;
  height:120px;
  background:radial-gradient(circle, rgba(59,130,246,.22), transparent 62%);
  pointer-events:none;
}
.brand-mark{
  box-shadow:0 12px 30px rgba(37,99,235,.26), inset 0 1px 0 rgba(255,255,255,.12)!important;
}
.sidebar-kicker,
.panel-title,
.premium-admin-kicker,
.lux-stat-kicker,
.backup-card-kicker{
  letter-spacing:.01em!important;
}
.nav-btn,
.sidebar-user-action,
.sidebar-logout,
.action-btn,
.row-btn,
.btn-secondary,
button{
  transition:transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease, filter .16s ease!important;
}
.nav-btn{
  min-height:54px!important;
  border-radius:18px!important;
  background:linear-gradient(145deg, rgba(15,23,42,.82), rgba(15,33,58,.58))!important;
  border:1px solid rgba(148,163,184,.12)!important;
}
.nav-btn:hover{
  transform:translateY(-1px)!important;
  border-color:rgba(96,165,250,.32)!important;
  background:linear-gradient(145deg, rgba(30,64,175,.26), rgba(15,33,58,.72))!important;
}
.nav-btn.active,
.nav-btn[aria-current="page"]{
  border-color:rgba(147,197,253,.42)!important;
  background:
    radial-gradient(circle at 12% 20%, rgba(125,211,252,.20), transparent 30%),
    linear-gradient(135deg,#1d4ed8,#0284c7)!important;
  box-shadow:0 16px 36px rgba(37,99,235,.28), inset 0 1px 0 rgba(255,255,255,.16)!important;
}
.nav-btn-icon{
  width:38px!important;
  height:38px!important;
  border-radius:14px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:rgba(2,6,23,.26)!important;
  border:1px solid rgba(255,255,255,.08)!important;
}
.action-btn,
.row-btn,
.btn-secondary,
.sidebar-user-action{
  border-radius:14px!important;
  font-weight:900!important;
}
.action-btn:hover,
.row-btn:hover,
.btn-secondary:hover,
.sidebar-user-action:hover{
  transform:translateY(-1px)!important;
  box-shadow:0 12px 28px rgba(37,99,235,.18)!important;
}
input,select,textarea,
input[type="text"],input[type="password"],input[type="email"],input[type="number"]{
  border-radius:14px!important;
  background:rgba(2,6,23,.58)!important;
  border-color:rgba(96,165,250,.20)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
}
input:focus,select:focus,textarea:focus{
  border-color:rgba(96,165,250,.72)!important;
  box-shadow:0 0 0 4px rgba(59,130,246,.14), inset 0 1px 0 rgba(255,255,255,.05)!important;
}
.table-shell{
  overflow:hidden!important;
  border-radius:20px!important;
}
table thead th,
.zt-table thead th{
  background:linear-gradient(180deg, rgba(30,64,175,.22), rgba(15,23,42,.82))!important;
  color:#cfe5ff!important;
  font-size:12px!important;
  font-weight:1000!important;
}
table tbody tr,
.zt-table tbody tr{
  transition:background .14s ease, transform .14s ease!important;
}
table tbody tr:hover,
.zt-table tbody tr:hover{
  background:rgba(59,130,246,.075)!important;
}
.panel-title,
.premium-admin-title,
.sa-section-title,
h2,h3{
  text-wrap:balance;
}
.premium-admin-hero{
  position:relative!important;
  overflow:hidden!important;
  border-radius:28px!important;
  background:
    radial-gradient(circle at 88% 18%, rgba(59,130,246,.24), transparent 30%),
    linear-gradient(135deg, rgba(15,23,42,.90), rgba(8,22,42,.82))!important;
}
.premium-admin-hero::before{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(120deg, transparent, rgba(255,255,255,.055), transparent 58%);
}
.lux-stat-grid{
  gap:12px!important;
}
.lux-stat-card{
  border-radius:20px!important;
  padding:16px!important;
  min-height:118px!important;
}
.lux-stat-card:hover{
  transform:translateY(-2px)!important;
  box-shadow:0 20px 50px rgba(37,99,235,.16), inset 0 1px 0 rgba(255,255,255,.06)!important;
}
.lux-inline-badge,
.role-badge,
.status-pill,
.lux-badge{
  border-radius:999px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07)!important;
}
.sa-section-shell,
.backup-card-pro,
.backup-library-card{
  border-radius:24px!important;
}
#saContent{
  animation:v402FadeUp .22s ease-out both;
}
@keyframes v402FadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
/* تحسين شاشة دخول إعدادات السيرفر مع الحفاظ على إصلاح V401 */
#view-superadmin.sa-v399-gate-locked{
  background:
    radial-gradient(circle at 45% 38%, rgba(59,130,246,.13), transparent 26%),
    radial-gradient(circle at 62% 72%, rgba(14,165,233,.07), transparent 36%)!important;
}
#saUnlock .sa-v401-card{
  max-width:620px!important;
  padding:28px!important;
  border-radius:30px!important;
  border-color:rgba(125,211,252,.32)!important;
  background:
    radial-gradient(circle at 84% 0%, rgba(59,130,246,.34), transparent 28%),
    radial-gradient(circle at 0% 100%, rgba(14,165,233,.18), transparent 38%),
    linear-gradient(145deg, rgba(15,23,42,.96), rgba(2,8,23,.94))!important;
  box-shadow:0 34px 96px rgba(0,0,0,.54), 0 0 0 1px rgba(96,165,250,.08), inset 0 1px 0 rgba(255,255,255,.075)!important;
}
#saUnlock .sa-v401-head{
  grid-template-columns:86px minmax(0,1fr)!important;
  gap:18px!important;
}
#saUnlock .sa-v401-lock{
  width:86px!important;
  height:86px!important;
  min-width:86px!important;
  border-radius:28px!important;
  background:
    radial-gradient(circle at 35% 20%, rgba(255,255,255,.18), transparent 28%),
    linear-gradient(145deg,rgba(37,99,235,.46),rgba(15,23,42,.80))!important;
}
#saUnlock .sa-v401-copy h2{
  font-size:clamp(27px,2.6vw,36px)!important;
}
#saUnlock .sa-v401-form{
  padding:18px!important;
  border-radius:22px!important;
  background:linear-gradient(145deg, rgba(2,6,23,.52), rgba(15,23,42,.38))!important;
}
#saUnlock .sa-v401-input,
#saUnlock .sa-v401-unlock-btn{
  height:52px!important;
  min-height:52px!important;
}
#saUnlock .sa-v401-unlock-btn{
  background:linear-gradient(135deg,#2563eb,#38bdf8)!important;
  box-shadow:0 18px 40px rgba(37,99,235,.34), inset 0 1px 0 rgba(255,255,255,.18)!important;
}
#saUnlock .sa-v401-hint{
  color:#a9c6e8!important;
}
/* تحسين موبايل/شاشات ضيقة بدون كسر */
@media(max-width:900px){
  #appView.app-shell{gap:12px!important;}
  .card,.section-shell{border-radius:18px!important;}
  #saUnlock .sa-v401-card{max-width:100%!important;padding:18px!important;border-radius:22px!important;}
  #saUnlock .sa-v401-head{grid-template-columns:60px minmax(0,1fr)!important;gap:12px!important;}
  #saUnlock .sa-v401-lock{width:60px!important;height:60px!important;min-width:60px!important;border-radius:20px!important;}
  #saUnlock .sa-v401-copy h2{font-size:24px!important;}
}
/* V402_DASHBOARD_BEAUTY_POLISH_END */


/* V1.0.1 strict view isolation: server settings must never bleed into other screens */
body:not([data-it-top-active-view="superadmin"]) #view-superadmin{display:none!important;visibility:hidden!important;pointer-events:none!important;}
body[data-it-top-active-view="net-details"] #view-superadmin,
body[data-it-top-active-view="networks"] #view-superadmin,
body[data-it-top-active-view="dashboard"] #view-superadmin,
body[data-it-top-active-view="backup"] #view-superadmin,
body[data-it-top-active-view="ai"] #view-superadmin,
body[data-it-top-active-view="growth"] #view-superadmin{display:none!important;visibility:hidden!important;pointer-events:none!important;}
body[data-it-top-active-view="net-details"] #view-net-details:not(.hidden){display:block!important;visibility:visible!important;}


/* V1.0.2 professional WireGuard edit modal */
.device-edit-pro-modal{overflow:hidden!important;border-radius:26px!important;background:linear-gradient(145deg,rgba(7,17,31,.98),rgba(10,28,50,.96))!important;box-shadow:0 32px 100px rgba(0,0,0,.55),0 0 0 1px rgba(96,165,250,.08) inset!important}
.device-edit-pro-head{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px 24px;border-bottom:1px solid rgba(96,165,250,.16);background:radial-gradient(circle at 85% 0%,rgba(59,130,246,.26),transparent 40%),linear-gradient(135deg,rgba(15,23,42,.92),rgba(8,28,53,.78))}
.device-edit-pro-head h3{font-size:24px;font-weight:950;color:#fff;margin:4px 0 3px;letter-spacing:-.02em}
.device-edit-pro-head p{font-size:12px;color:#9fb7d4;line-height:1.8;margin:0}
.device-edit-kicker{display:inline-flex;border:1px solid rgba(59,130,246,.28);background:rgba(59,130,246,.12);color:#93c5fd;border-radius:999px;padding:4px 10px;font-size:10px;font-weight:900;text-transform:uppercase}
.device-edit-head-icon{width:58px;height:58px;border-radius:20px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,rgba(37,99,235,.55),rgba(14,165,233,.28));border:1px solid rgba(147,197,253,.25);box-shadow:0 14px 40px rgba(59,130,246,.22)}
.device-edit-close{position:absolute;top:14px;left:14px;z-index:3;width:34px;height:34px;border-radius:12px;border:1px solid rgba(148,163,184,.18);background:rgba(15,23,42,.72);color:#cbd5e1;font-weight:900}
.device-edit-close:hover{background:rgba(239,68,68,.16);color:#fff;border-color:rgba(248,113,113,.35)}
.device-edit-pro-body{padding:20px 24px 22px;display:flex;flex-direction:column;gap:14px;max-height:min(76vh,760px);overflow:auto}
.device-edit-pro-body .input-glass{min-height:44px;border-radius:14px!important;background:rgba(2,6,23,.64)!important;border:1px solid rgba(96,165,250,.18)!important}
.device-edit-grid{display:grid;grid-template-columns:1fr 210px;gap:12px;align-items:end}
.device-edit-actions{position:sticky;bottom:-22px;margin:6px -24px -22px;padding:14px 24px;display:flex;gap:10px;justify-content:flex-start;background:linear-gradient(180deg,rgba(7,17,31,.72),rgba(7,17,31,.98));border-top:1px solid rgba(96,165,250,.12)}
.device-edit-actions .btn-primary{min-width:180px;min-height:44px;border-radius:14px}
@media(max-width:720px){.device-edit-grid{grid-template-columns:1fr}.device-edit-pro-head{padding:18px}.device-edit-pro-head h3{font-size:20px}.device-edit-head-icon{display:none}.device-edit-pro-body{padding:16px}.device-edit-actions{margin:4px -16px -16px;padding:12px 16px;flex-direction:column}.device-edit-actions .btn-primary{width:100%}}

/* V410_ROUTE_MODAL_ACTIONS_PERFORMANCE_FIX_START
   Scope: Route edit modal + route table action safety only.
   No dashboard redesign, no color identity change, no network logic change. */
.route-edit-modal-v410.hidden{display:none!important;}
.route-edit-modal-v410{
  position:fixed!important;
  inset:0!important;
  z-index:100200!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:clamp(12px,2vw,24px)!important;
  direction:rtl!important;
  background:rgba(2,6,23,.70)!important;
  backdrop-filter:blur(7px)!important;
  -webkit-backdrop-filter:blur(7px)!important;
}
body.route-modal-open-v410{overflow:hidden!important;}
.route-edit-card-v410{
  width:min(720px,calc(100vw - 28px))!important;
  max-height:min(86vh,680px)!important;
  overflow:auto!important;
  border-radius:22px!important;
  border:1px solid rgba(148,163,184,.26)!important;
  background:linear-gradient(145deg,rgba(10,21,38,.98),rgba(15,23,42,.97))!important;
  box-shadow:0 32px 110px rgba(0,0,0,.58),0 0 0 1px rgba(96,165,250,.07) inset!important;
  padding:18px!important;
  color:#e5e7eb!important;
  transform:translateZ(0)!important;
}
.route-edit-head-v410{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  padding-bottom:12px!important;
  margin-bottom:14px!important;
  border-bottom:1px solid rgba(148,163,184,.16)!important;
}
.route-edit-title-v410{margin:0!important;color:#fff!important;font-size:20px!important;font-weight:1000!important;line-height:1.2!important;}
.route-edit-close-v410{
  width:36px!important;height:36px!important;min-width:36px!important;
  border-radius:12px!important;border:1px solid rgba(148,163,184,.22)!important;
  background:rgba(15,23,42,.82)!important;color:#cbd5e1!important;font-size:24px!important;font-weight:900!important;line-height:1!important;
}
.route-edit-close-v410:hover{background:rgba(239,68,68,.16)!important;color:#fff!important;border-color:rgba(248,113,113,.38)!important;}
.route-edit-grid-v410{display:grid!important;grid-template-columns:1fr 1fr!important;gap:12px!important;}
.route-edit-field-v410{display:flex!important;flex-direction:column!important;gap:6px!important;min-width:0!important;}
.route-edit-field-v410 label{font-size:11px!important;font-weight:900!important;color:#b7c4d8!important;line-height:1.4!important;}
.route-edit-input-v410{
  width:100%!important;min-height:44px!important;border-radius:14px!important;
  border:1px solid rgba(96,165,250,.22)!important;background:rgba(2,6,23,.66)!important;
  color:#fff!important;padding:0 12px!important;outline:none!important;font-weight:800!important;
}
.route-edit-input-v410:focus{border-color:rgba(96,165,250,.68)!important;box-shadow:0 0 0 4px rgba(59,130,246,.14)!important;}
.route-edit-actions-v410{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:10px!important;flex-wrap:wrap!important;margin-top:16px!important;padding-top:14px!important;border-top:1px solid rgba(148,163,184,.14)!important;}
.route-edit-btn-v410{min-height:42px!important;border-radius:14px!important;padding:0 16px!important;font-weight:1000!important;font-size:13px!important;border:1px solid transparent!important;color:#fff!important;}
.route-edit-btn-muted-v410{background:rgba(51,65,85,.70)!important;border-color:rgba(148,163,184,.22)!important;color:#e2e8f0!important;}
.route-edit-btn-primary-v410{background:linear-gradient(135deg,#2563eb,#4f46e5)!important;box-shadow:0 14px 34px rgba(37,99,235,.24)!important;}
.route-edit-btn-rsc-v410{background:rgba(8,145,178,.28)!important;border-color:rgba(34,211,238,.28)!important;color:#a5f3fc!important;}
#net-tab-routes .actions-cell{position:relative!important;z-index:2!important;}
#net-tab-routes [data-route-action]{min-height:32px!important;white-space:nowrap!important;touch-action:manipulation!important;}
#net-tab-routes .routes-table-card-v196,
#net-tab-routes .table-shell,
#net-tab-routes table{contain:layout paint!important;}
#routeScreenToolbar{contain:layout paint!important;}
@media(max-width:720px){
  .route-edit-card-v410{padding:14px!important;border-radius:18px!important;}
  .route-edit-grid-v410{grid-template-columns:1fr!important;}
  .route-edit-actions-v410{flex-direction:column!important;align-items:stretch!important;}
  .route-edit-btn-v410{width:100%!important;}
}
body[data-it-theme="light"] .route-edit-card-v410,
html[data-it-theme="light"] .route-edit-card-v410{
  background:linear-gradient(145deg,#ffffff,#f8fafc)!important;
  color:#0f172a!important;border-color:rgba(15,23,42,.14)!important;
}
body[data-it-theme="light"] .route-edit-title-v410,
html[data-it-theme="light"] .route-edit-title-v410{color:#0f172a!important;}
body[data-it-theme="light"] .route-edit-input-v410,
html[data-it-theme="light"] .route-edit-input-v410{background:#fff!important;color:#0f172a!important;border-color:#cbd5e1!important;}
/* V410_ROUTE_MODAL_ACTIONS_PERFORMANCE_FIX_END */

/* V411_NETWORK_CLICK_LAG_FIX_START
   محافظ: لا يغير التصميم؛ فقط يثبت قابلية الضغط ويمنع تضارب الـ pointer events. */
.networks-compact-card[data-network-id],
.network-command-card[role="button"]{
  cursor:pointer!important;
  touch-action:manipulation;
}
.networks-compact-card[data-network-id] :where(button,a,input,select,textarea,label),
.network-command-card[role="button"] :where(button,a,input,select,textarea,label){
  pointer-events:auto;
}
/* V411_NETWORK_CLICK_LAG_FIX_END */

/* V414_SETTINGS_PAGES_SMTP_INLINE_START
   تقسيم إعدادات السيرفر إلى صفحات داخلية. كل القواعد scoped داخل #view-superadmin فقط
   حتى لا تظهر القائمة أو شريط الحفظ فوق باقي الشاشات. */
#view-superadmin #saSettingsPager.sa-settings-pager{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:8px!important;
  padding:10px!important;
  margin:0 0 8px!important;
  border:1px solid rgba(148,163,184,.14)!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,rgba(15,23,42,.78),rgba(2,8,23,.72))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04)!important;
  position:relative!important;
  inset:auto!important;
  z-index:1!important;
}
#view-superadmin #saSettingsPager.sa-settings-pager button{
  min-height:34px!important;
  border-radius:12px!important;
  border:1px solid rgba(148,163,184,.16)!important;
  background:rgba(15,23,42,.74)!important;
  color:#cbd5e1!important;
  font-size:11px!important;
  font-weight:900!important;
  padding:7px 11px!important;
  cursor:pointer!important;
  transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease!important;
}
#view-superadmin #saSettingsPager.sa-settings-pager button:hover{
  transform:translateY(-1px)!important;
  border-color:rgba(56,189,248,.34)!important;
  color:#f8fafc!important;
}
#view-superadmin #saSettingsPager.sa-settings-pager button.active,
#view-superadmin #saSettingsPager.sa-settings-pager button[aria-selected="true"]{
  color:#06111f!important;
  border-color:rgba(251,191,36,.5)!important;
  background:linear-gradient(180deg,#f8dc92,#d8aa4d)!important;
  box-shadow:0 10px 22px rgba(216,170,77,.16)!important;
}
#view-superadmin #saSettingsPager.sa-settings-pager button[data-dirty="1"]::after{
  content:'•';
  display:inline-flex;
  margin-inline-start:5px;
  color:#fbbf24;
  font-size:16px;
  line-height:0;
}
#view-superadmin #saSettingsPager.sa-settings-pager button.active[data-dirty="1"]::after,
#view-superadmin #saSettingsPager.sa-settings-pager button[aria-selected="true"][data-dirty="1"]::after{color:#7c2d12;}
#view-superadmin #saSettingsPageHint.sa-settings-page-hint{
  margin:0 0 12px!important;
  padding:9px 12px!important;
  border-radius:14px!important;
  border:1px solid rgba(56,189,248,.12)!important;
  background:rgba(2,8,23,.54)!important;
  color:#94a3b8!important;
  font-size:11px!important;
  line-height:1.7!important;
  text-align:right!important;
}
#view-superadmin #saContent [data-sa-page].hidden,
#view-superadmin #saContent [data-sa-subpage].hidden{display:none!important;}
#view-superadmin #serverSettingsDirtyBar.sa-dirty-inline{
  position:relative!important;
  inset:auto!important;
  z-index:1!important;
  margin:10px 0 0!important;
  padding:0!important;
}
#view-superadmin #serverSettingsDirtyBar.sa-dirty-inline > div{
  max-width:none!important;
  margin:0!important;
  border-radius:16px!important;
}
body:not([data-it-top-active-view="superadmin"]) #view-superadmin #saSettingsPager,
body:not([data-it-top-active-view="superadmin"]) #view-superadmin #serverSettingsDirtyBar{display:none!important;}
@media (max-width:720px){
  #view-superadmin #saSettingsPager.sa-settings-pager{display:grid!important;grid-template-columns:1fr 1fr!important;gap:7px!important;}
  #view-superadmin #saSettingsPager.sa-settings-pager button{width:100%!important;font-size:10px!important;padding:7px 8px!important;}
}
/* V414_SETTINGS_PAGES_SMTP_INLINE_END */

/* V415_SETTINGS_NAV_REVIEW_ORGANIZER_START
   تنظيم إضافي لإعدادات السيرفر. القواعد محصورة داخل شاشة إعدادات السيرفر فقط.
   لا تستخدم هذه القواعد أي تموضع عائم حتى لا تظهر القائمة فوق باقي الشاشات. */
#view-superadmin #saSettingsPageHeaderV415.sa-settings-page-header-v415{
  display:flex!important;
  align-items:stretch!important;
  justify-content:space-between!important;
  gap:14px!important;
  margin:0 0 12px!important;
  padding:14px!important;
  border:1px solid rgba(56,189,248,.14)!important;
  border-radius:22px!important;
  background:linear-gradient(135deg,rgba(8,18,36,.92),rgba(15,23,42,.68))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 14px 38px rgba(2,8,23,.18)!important;
  position:relative!important;
  inset:auto!important;
  z-index:1!important;
}
#view-superadmin #saSettingsPageHeaderV415 .sa-settings-page-title-v415{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:center!important;
  gap:4px!important;
  min-width:0!important;
  text-align:right!important;
}
#view-superadmin #saSettingsPageHeaderV415 .sa-settings-page-kicker-v415{
  color:#38bdf8!important;
  font-size:10px!important;
  font-weight:900!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}
#view-superadmin #saSettingsPageHeaderV415 h4{
  margin:0!important;
  color:#f8fafc!important;
  font-size:18px!important;
  font-weight:950!important;
  line-height:1.25!important;
}
#view-superadmin #saSettingsPageHeaderV415 p{
  margin:0!important;
  color:#94a3b8!important;
  font-size:11px!important;
  line-height:1.7!important;
}
#view-superadmin #saSettingsPageHeaderV415 .sa-settings-page-tools-v415{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:8px!important;
  flex-wrap:wrap!important;
  flex-shrink:0!important;
}
#view-superadmin #saSettingsPageHeaderV415 .sa-settings-page-index-v415{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:32px!important;
  padding:0 10px!important;
  border-radius:999px!important;
  border:1px solid rgba(148,163,184,.16)!important;
  background:rgba(2,8,23,.56)!important;
  color:#cbd5e1!important;
  font-size:11px!important;
  font-weight:900!important;
  direction:ltr!important;
}
#view-superadmin #saSettingsPageHeaderV415 button{
  min-height:32px!important;
  border-radius:12px!important;
  border:1px solid rgba(56,189,248,.18)!important;
  background:rgba(14,116,144,.14)!important;
  color:#bae6fd!important;
  font-size:11px!important;
  font-weight:900!important;
  padding:7px 10px!important;
  cursor:pointer!important;
}
#view-superadmin #saSettingsPageHeaderV415 button:hover{
  background:rgba(14,116,144,.26)!important;
  color:#f8fafc!important;
}
#view-superadmin #saSettingsPager.sa-settings-pager-v415{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  align-items:stretch!important;
  gap:10px!important;
  padding:12px!important;
  margin:0 0 10px!important;
  border:1px solid rgba(148,163,184,.14)!important;
  border-radius:22px!important;
  background:linear-gradient(180deg,rgba(15,23,42,.76),rgba(2,8,23,.70))!important;
  position:relative!important;
  inset:auto!important;
  z-index:1!important;
}
#view-superadmin #saSettingsPager.sa-settings-pager-v415 .sa-settings-group-v415{
  min-width:0!important;
  border:1px solid rgba(148,163,184,.10)!important;
  border-radius:18px!important;
  background:rgba(2,8,23,.34)!important;
  padding:10px!important;
}
#view-superadmin #saSettingsPager.sa-settings-pager-v415 .sa-settings-group-head-v415{
  display:flex!important;
  flex-direction:column!important;
  gap:3px!important;
  margin:0 0 8px!important;
  text-align:right!important;
}
#view-superadmin #saSettingsPager.sa-settings-pager-v415 .sa-settings-group-head-v415 strong{
  color:#e2e8f0!important;
  font-size:11px!important;
  font-weight:950!important;
}
#view-superadmin #saSettingsPager.sa-settings-pager-v415 .sa-settings-group-head-v415 small{
  color:#64748b!important;
  font-size:10px!important;
  line-height:1.55!important;
}
#view-superadmin #saSettingsPager.sa-settings-pager-v415 .sa-settings-group-buttons-v415{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:7px!important;
}
#view-superadmin #saSettingsPager.sa-settings-pager-v415 button{
  width:100%!important;
  min-height:34px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:7px!important;
  border-radius:13px!important;
  font-size:11px!important;
  padding:7px 9px!important;
  text-align:right!important;
}
#view-superadmin #saSettingsPager.sa-settings-pager-v415 button .sa-page-icon{
  width:22px!important;
  height:22px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:9px!important;
  background:rgba(15,23,42,.78)!important;
  border:1px solid rgba(148,163,184,.12)!important;
  flex:0 0 auto!important;
  font-size:12px!important;
}
#view-superadmin #saSettingsPager.sa-settings-pager-v415 button .sa-page-label{
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
#view-superadmin #saSettingsPager.sa-settings-pager-v415 button.active .sa-page-icon,
#view-superadmin #saSettingsPager.sa-settings-pager-v415 button[aria-selected="true"] .sa-page-icon{
  background:rgba(15,23,42,.18)!important;
  color:#06111f!important;
  border-color:rgba(124,45,18,.18)!important;
}
#view-superadmin #saSettingsEmptyStateV415.sa-settings-empty-v415{
  margin:0 0 12px!important;
  padding:12px!important;
  border-radius:16px!important;
  border:1px dashed rgba(248,113,113,.28)!important;
  background:rgba(127,29,29,.10)!important;
  color:#fecaca!important;
  font-size:12px!important;
  text-align:right!important;
  position:relative!important;
  inset:auto!important;
}
#view-superadmin #saSettingsEmptyStateV415.hidden{display:none!important;}
body:not([data-it-top-active-view="superadmin"]) #view-superadmin #saSettingsPageHeaderV415,
body:not([data-it-top-active-view="superadmin"]) #view-superadmin #saSettingsEmptyStateV415{display:none!important;}
@media (max-width:1180px){
  #view-superadmin #saSettingsPager.sa-settings-pager-v415{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media (max-width:720px){
  #view-superadmin #saSettingsPageHeaderV415.sa-settings-page-header-v415{flex-direction:column!important;}
  #view-superadmin #saSettingsPageHeaderV415 .sa-settings-page-tools-v415{justify-content:flex-start!important;}
  #view-superadmin #saSettingsPager.sa-settings-pager-v415{grid-template-columns:1fr!important;}
}
/* V415_SETTINGS_NAV_REVIEW_ORGANIZER_END */

/* V417_SETTINGS_REQUESTS_RSC_USABILITY_START
   Conservative settings usability layer: scoped only inside server settings. */
#view-superadmin #saContent.v417-settings-clean{
  font-size:15px;
  line-height:1.75;
}
#view-superadmin #saContent.v417-settings-clean .premium-admin-hero,
#view-superadmin #saContent.v417-settings-clean .lux-stat-grid{
  display:none !important;
}
#view-superadmin #saContent.v417-settings-clean .sa-section-shell{
  padding:22px !important;
}
#view-superadmin #saContent.v417-settings-clean .sa-section-head h3,
#view-superadmin #saContent.v417-settings-clean h3{
  font-size:24px !important;
  line-height:1.35 !important;
}
#view-superadmin #saContent.v417-settings-clean h4{
  font-size:19px !important;
  line-height:1.45 !important;
}
#view-superadmin #saContent.v417-settings-clean label,
#view-superadmin #saContent.v417-settings-clean .block.text-xs.font-bold{
  font-size:13px !important;
  color:#cbd5e1 !important;
}
#view-superadmin #saContent.v417-settings-clean .text-\[11px\],
#view-superadmin #saContent.v417-settings-clean .text-xs{
  font-size:13px !important;
}
#view-superadmin #saContent.v417-settings-clean .settings-panel-note,
#view-superadmin #saContent.v417-settings-clean .admin-row-role-hint,
#view-superadmin #saContent.v417-settings-clean .admin-card-sub{
  font-size:14px !important;
  color:#aebbd0 !important;
}
#view-superadmin #saContent.v417-settings-clean .input-glass,
#view-superadmin #saContent.v417-settings-clean select,
#view-superadmin #saContent.v417-settings-clean textarea{
  min-height:46px;
  font-size:14px !important;
}
#view-superadmin #saContent.v417-settings-clean .sa-settings-pager-v415{
  gap:14px !important;
  padding:16px !important;
}
#view-superadmin #saContent.v417-settings-clean .sa-settings-group-v415{
  padding:14px !important;
}
#view-superadmin #saContent.v417-settings-clean .sa-settings-group-head-v415 strong{
  font-size:15px !important;
}
#view-superadmin #saContent.v417-settings-clean .sa-settings-group-head-v415 small{
  font-size:12.5px !important;
}
#view-superadmin #saContent.v417-settings-clean [data-sa-page-button]{
  min-height:42px !important;
  font-size:14px !important;
}
#view-superadmin #saContent.v417-settings-clean .sa-settings-page-header-v415{
  padding:18px 20px !important;
}
#view-superadmin #saContent.v417-settings-clean .sa-settings-page-kicker-v415{
  font-size:12.5px !important;
}
#view-superadmin #saContent.v417-settings-clean #saSettingsPageTitleV415{
  font-size:25px !important;
}
#view-superadmin #saContent.v417-settings-clean #saSettingsPageChecklistV415,
#view-superadmin #saContent.v417-settings-clean #saSettingsPageHint{
  font-size:14px !important;
}
#view-superadmin #saContent.v417-settings-clean .admin-card,
#view-superadmin #saContent.v417-settings-clean .rounded-3xl{
  border-radius:20px !important;
}
#view-superadmin #saContent.v417-settings-clean .access-requests-panel-v413{
  background:linear-gradient(180deg, rgba(15,23,42,.94), rgba(2,6,23,.78)) !important;
  border-color:rgba(59,130,246,.26) !important;
}
.access-requests-filter-v417{
  display:grid;
  grid-template-columns:minmax(240px,1fr) minmax(180px,260px);
  gap:12px;
}
.access-requests-stats-v417{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.access-requests-stats-v417 .ar-stat{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.18);
  background:rgba(15,23,42,.72);
  color:#cbd5e1;
  font-size:13px;
  font-weight:800;
}
.access-requests-stats-v417 .ar-stat b{font-size:15px;color:#fff;}
.access-requests-stats-v417 .ar-stat.wait{border-color:rgba(245,158,11,.25);color:#fcd34d;}
.access-requests-stats-v417 .ar-stat.ok{border-color:rgba(16,185,129,.25);color:#6ee7b7;}
.access-requests-stats-v417 .ar-stat.bad{border-color:rgba(244,63,94,.25);color:#fda4af;}
.access-request-card-v417{
  border-inline-start:4px solid rgba(59,130,246,.55) !important;
}
.access-request-card-v417.wait{border-inline-start-color:rgba(245,158,11,.8)!important;}
.access-request-card-v417.ok{border-inline-start-color:rgba(16,185,129,.8)!important;}
.access-request-card-v417.bad{border-inline-start-color:rgba(244,63,94,.8)!important;}
.access-request-status-chip-v417.wait{background:rgba(245,158,11,.12)!important;color:#fcd34d!important;border-color:rgba(245,158,11,.25)!important;}
.access-request-status-chip-v417.ok{background:rgba(16,185,129,.12)!important;color:#6ee7b7!important;border-color:rgba(16,185,129,.25)!important;}
.access-request-status-chip-v417.bad{background:rgba(244,63,94,.12)!important;color:#fda4af!important;border-color:rgba(244,63,94,.25)!important;}
.access-request-summary-v417{align-items:flex-start!important;}
.access-request-mini-v417{
  display:flex;
  flex-direction:column;
  gap:4px;
  color:#94a3b8;
  font-size:12.5px;
  min-width:210px;
  text-align:right;
}
.access-request-info-grid-v417{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin-bottom:12px;
}
.access-request-info-grid-v417>div{
  border:1px solid rgba(148,163,184,.13);
  background:rgba(2,6,23,.52);
  border-radius:14px;
  padding:10px;
}
.access-request-info-grid-v417 span{
  display:block;
  color:#94a3b8;
  font-size:12.5px;
  margin-bottom:4px;
}
.access-request-info-grid-v417 strong{
  color:#f8fafc;
  font-size:14px;
}
.access-request-decision-grid-v417{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
}
.access-request-reason-v417,
.access-request-decision-v417{
  border:1px solid rgba(148,163,184,.14);
  background:rgba(15,23,42,.62);
  padding:10px 12px;
  border-radius:14px;
}
@media (max-width:900px){
  .access-requests-filter-v417,
  .access-request-info-grid-v417,
  .access-request-decision-grid-v417{grid-template-columns:1fr!important;}
  .access-request-mini-v417{min-width:0;width:100%;}
}
/* V417_SETTINGS_REQUESTS_RSC_USABILITY_END */

/* V418_NETWORK_INVITE_QR_SIDEBAR_SPEED_START
   Conservative UI-only layer: keep the existing design, stabilize the mini sidebar,
   add compact invite/ZeroTier actions, and prevent stale side tooltips from sticking. */
.network-card-name-line-v418,
.network-clean-title-line-v418{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
    min-width:0;
}
.network-card-name-line-v418 h3,
.network-clean-title-line-v418 h1{
    margin-inline-end:0!important;
    min-width:0;
}
.network-card-name-text-v418{min-width:0;}
.network-inline-qr-actions-v418{
    display:inline-flex;
    align-items:center;
    gap:6px;
    flex:0 0 auto;
}
.network-qr-mini-btn-v418{
    min-height:28px;
    padding:0 9px;
    border-radius:999px;
    border:1px solid rgba(96,165,250,.24);
    background:linear-gradient(180deg,rgba(37,99,235,.14),rgba(15,23,42,.34));
    color:#bfdbfe;
    font-size:10px;
    font-weight:1000;
    line-height:1;
    cursor:pointer;
    white-space:nowrap;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.network-qr-mini-btn-v418:hover,
.network-qr-mini-btn-v418:focus-visible{
    background:linear-gradient(180deg,rgba(37,99,235,.28),rgba(14,165,233,.16));
    border-color:rgba(96,165,250,.46);
    color:#ffffff;
    outline:none;
}
.network-qr-mini-btn-v418:disabled{opacity:.62;cursor:wait;}
.network-clean-qr-actions-v418{margin-top:4px;}
.networks-compact-buttons,
.network-card-actions{
    align-items:center;
    gap:8px;
}
.networks-compact-buttons [data-copy-invite],
.network-card-actions [data-copy-invite]{
    border-color:rgba(96,165,250,.30)!important;
    color:#dbeafe!important;
}
.networks-compact-buttons [data-copy-zt],
.network-card-actions [data-copy-zt]{
    border-color:rgba(34,211,238,.22)!important;
    color:#bae6fd!important;
}
#appView.app-shell.sidebar-collapsed .app-sidebar,
#appView.app-shell[data-sidebar-collapsed="1"] .app-sidebar,
#appView.app-shell .app-sidebar.is-sidebar-mini{
    width:92px!important;
    min-width:92px!important;
    max-width:92px!important;
    overflow:hidden!important;
    z-index:1200!important;
}
#appView.app-shell.sidebar-collapsed .sidebar-nav-wrap,
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav-wrap,
#appView.app-shell.sidebar-collapsed .sidebar-nav,
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav{
    overflow:hidden!important;
    contain:layout paint!important;
}
#appView.app-shell.sidebar-collapsed .sidebar-nav .nav-btn,
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn{
    width:58px!important;
    min-width:58px!important;
    max-width:58px!important;
    height:58px!important;
    min-height:58px!important;
    max-height:58px!important;
    overflow:hidden!important;
    display:grid!important;
    place-items:center!important;
}
#appView.app-shell.sidebar-collapsed .sidebar-nav .nav-btn .nav-btn-copy,
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn .nav-btn-copy,
#appView.app-shell.sidebar-collapsed .sidebar-section-title,
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-section-title{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
}
#appView.app-shell.sidebar-collapsed .sidebar-nav .nav-btn::after,
#appView.app-shell[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn::after,
#appView.sidebar-collapsed .sidebar-nav .nav-btn::after,
#appView[data-sidebar-collapsed="1"] .sidebar-nav .nav-btn::after,
.it-top-mini-tooltip-v157{
    display:none!important;
    content:none!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
}
@media(max-width:900px){
    .network-card-name-line-v418,
    .network-clean-title-line-v418{align-items:flex-start;flex-direction:column;}
    .network-inline-qr-actions-v418{width:100%;justify-content:flex-start;}
    .network-qr-mini-btn-v418{min-height:32px;padding-inline:11px;}
    .networks-compact-buttons [data-copy-invite],
    .networks-compact-buttons [data-copy-zt],
    .network-card-actions [data-copy-invite],
    .network-card-actions [data-copy-zt]{flex:1 1 150px;}
}
/* V418_NETWORK_INVITE_QR_SIDEBAR_SPEED_END */

/* V419_WG_TUNNEL_REPORTED_STATUS_START
   WireGuard Handshake موجود لكن ICMP/Ping محجوب: لون متابعة مستقل، لا أخضر كامل ولا أحمر. */
:where(#net-tab-devices,#view-devices) .device-row.device-state-tunnel{
  border-color:rgba(34,211,238,.44)!important;
  box-shadow:0 16px 42px rgba(8,145,178,.12), inset 0 1px 0 rgba(255,255,255,.04)!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-state-tunnel::after{
  background:radial-gradient(circle at 100% 0%, rgba(34,211,238,.14), transparent 30%), radial-gradient(circle at 0% 100%, rgba(59,130,246,.08), transparent 26%)!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-state-tunnel .device-health-dot{
  background:#22d3ee!important;
  box-shadow:0 0 0 5px rgba(34,211,238,.16)!important;
}
:where(#net-tab-devices,#view-devices) .path-tunnel,
:where(#net-tab-devices,#view-devices) .latency-tunnel,
:where(#net-tab-devices,#view-devices) .status-quality.latency-tunnel,
:where(#net-tab-devices,#view-devices) .device-row.device-state-tunnel .device-status-label-v127{
  background:rgba(34,211,238,.12)!important;
  color:#a5f3fc!important;
  border-color:rgba(34,211,238,.28)!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-state-tunnel .device-diagnosis-chip.warn,
:where(#net-tab-devices,#view-devices) .device-row.device-state-tunnel .device-diagnosis-chip.bad{
  background:rgba(34,211,238,.12)!important;
  color:#a5f3fc!important;
  border-color:rgba(34,211,238,.28)!important;
}
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .device-row.device-state-tunnel{
  border-color:rgba(8,145,178,.36)!important;
  box-shadow:0 14px 36px rgba(8,145,178,.10)!important;
}
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .path-tunnel,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .latency-tunnel,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .status-quality.latency-tunnel,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .device-row.device-state-tunnel .device-status-label-v127{
  background:#ecfeff!important;
  color:#0e7490!important;
  border-color:#a5f3fc!important;
}
/* V419_WG_TUNNEL_REPORTED_STATUS_END */


/* V421_REMOVE_BRANCH_POLICY_COMPACT_SETTINGS
   Conservative network-settings cleanup: remove wasted sizing without changing the dashboard identity. */
#net-tab-settings.network-settings-compact-v421{
  --v421-settings-gap: clamp(12px, 1.1vw, 18px);
}
#net-tab-settings.network-settings-compact-v421 > .flex:first-child{
  margin-bottom: 12px !important;
  align-items: flex-start !important;
}
#net-tab-settings.network-settings-compact-v421 .settings-hero-note{
  max-width: 760px !important;
  line-height: 1.65 !important;
  font-size: 13px !important;
}
#net-tab-settings.network-settings-compact-v421 .settings-quick-strip{
  display:grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: var(--v421-settings-gap) !important;
  margin-bottom: 16px !important;
}
#net-tab-settings.network-settings-compact-v421 .settings-quick-card{
  min-height: auto !important;
  padding: 14px 16px !important;
}
#net-tab-settings.network-settings-compact-v421 .settings-quick-card p{
  margin-top: 4px !important;
  font-size: 12px !important;
  line-height: 1.55 !important;
}
#net-tab-settings.network-settings-compact-v421 #advancedSettingsGrid{
  gap: var(--v421-settings-gap) !important;
  align-items:start !important;
}
#net-tab-settings.network-settings-compact-v421 .settings-stack-card{
  padding: clamp(16px, 1.2vw, 22px) !important;
  border-radius: 18px !important;
  min-height: auto !important;
}
#net-tab-settings.network-settings-compact-v421 .settings-panel-head{
  margin-bottom: 12px !important;
  gap: 10px !important;
}
#net-tab-settings.network-settings-compact-v421 .settings-panel-head h3{
  font-size: 16px !important;
  line-height: 1.35 !important;
}
#net-tab-settings.network-settings-compact-v421 .settings-panel-note{
  font-size: 12px !important;
  line-height: 1.55 !important;
}
#net-tab-settings.network-settings-compact-v421 .space-y-4 > :not([hidden]) ~ :not([hidden]){
  margin-top: 12px !important;
}
#net-tab-settings.network-settings-compact-v421 .space-y-3 > :not([hidden]) ~ :not([hidden]){
  margin-top: 10px !important;
}
#net-tab-settings.network-settings-compact-v421 label{
  font-size: 12px !important;
  line-height: 1.5 !important;
}
#net-tab-settings.network-settings-compact-v421 .input-glass,
#net-tab-settings.network-settings-compact-v421 select,
#net-tab-settings.network-settings-compact-v421 textarea{
  min-height: 42px !important;
  font-size: 13px !important;
  border-radius: 12px !important;
}
#net-tab-settings.network-settings-compact-v421 textarea#netPubKeyInput{
  min-height: 68px !important;
}
#net-tab-settings.network-settings-compact-v421 #ipGridArea,
#net-tab-settings.network-settings-compact-v421 #ztIpGridArea{
  max-height: 188px !important;
  overflow:auto !important;
  padding: 2px !important;
}
#net-tab-settings.network-settings-compact-v421 .bridge-panel{
  max-width: 100% !important;
}
#net-tab-settings.network-settings-compact-v421 .bridge-subnet-box{
  padding: 12px 14px !important;
}
@media (max-width: 1100px){
  #net-tab-settings.network-settings-compact-v421 .settings-quick-strip{grid-template-columns:1fr !important;}
}


/* V422_PRO_COMPACT_LAYOUT_TYPOGRAPHY_START
   Professional compact pass: reduce wasted space, clarify typography, and keep the existing identity/colors. */
:root{
  --v422-space-1:4px;
  --v422-space-2:8px;
  --v422-space-3:12px;
  --v422-space-4:16px;
  --v422-space-5:20px;
  --v422-radius-card:16px;
  --v422-radius-field:12px;
}
#appView,
.it-top-shell,
.app-shell{
  font-family:"IBM Plex Sans Arabic","Noto Sans Arabic","Cairo","Tajawal","Segoe UI",system-ui,-apple-system,sans-serif;
  text-rendering:optimizeLegibility;
}
#appView :where(h1,h2,h3,.page-title,.section-title){
  letter-spacing:0 !important;
  line-height:1.25 !important;
}
#appView :where(.section-shell,.card,.compact-card,.network-list-card,.device-card,.settings-stack-card){
  border-radius:var(--v422-radius-card) !important;
}
#appView :where(.section-shell,.card,.compact-card){
  scroll-margin-top:16px;
}

/* Network settings: compact, readable, and structured. */
#net-tab-settings.network-settings-compact-v422{
  max-width:1380px !important;
  margin-inline:auto !important;
  --v422-settings-gap:14px;
  --v422-card-pad:16px;
}
#net-tab-settings.network-settings-compact-v422 > .flex:first-child{
  margin-bottom:12px !important;
  padding:14px 16px !important;
  border:1px solid rgba(71,85,105,.32) !important;
  background:linear-gradient(135deg,rgba(15,23,42,.58),rgba(2,6,23,.38)) !important;
  border-radius:var(--v422-radius-card) !important;
}
#net-tab-settings.network-settings-compact-v422 > .flex:first-child h3{
  font-size:22px !important;
  font-weight:900 !important;
}
#net-tab-settings.network-settings-compact-v422 .settings-hero-note{
  font-size:13.5px !important;
  line-height:1.55 !important;
  margin-top:6px !important;
  max-width:680px !important;
}
#net-tab-settings.network-settings-compact-v422 #advancedSettingsToggleBtn{
  min-height:38px !important;
  padding:0 14px !important;
  font-size:13px !important;
  border-radius:12px !important;
}
#net-tab-settings.network-settings-compact-v422 .settings-quick-strip{
  display:none !important;
}
#net-tab-settings.network-settings-compact-v422 #advancedSettingsGrid{
  display:grid !important;
  grid-template-columns:repeat(12,minmax(0,1fr)) !important;
  gap:var(--v422-settings-gap) !important;
  align-items:start !important;
}
#net-tab-settings.network-settings-compact-v422 #advancedSettingsGrid > .settings-stack-card:nth-child(1){grid-column:span 6 !important;}
#net-tab-settings.network-settings-compact-v422 #advancedSettingsGrid > .settings-stack-card:nth-child(2){grid-column:span 3 !important;}
#net-tab-settings.network-settings-compact-v422 #advancedSettingsGrid > .settings-stack-card:nth-child(3){grid-column:span 3 !important;}
#net-tab-settings.network-settings-compact-v422 #advancedSettingsGrid > .settings-stack-card:nth-child(4){grid-column:span 4 !important;}
#net-tab-settings.network-settings-compact-v422 #advancedSettingsGrid > .settings-stack-card:nth-child(5){grid-column:span 5 !important;}
#net-tab-settings.network-settings-compact-v422 #advancedSettingsGrid > .settings-stack-card:nth-child(6){grid-column:span 3 !important;}
#net-tab-settings.network-settings-compact-v422 .settings-stack-card{
  padding:var(--v422-card-pad) !important;
  min-height:0 !important;
  box-shadow:0 14px 34px rgba(2,6,23,.18) !important;
}
#net-tab-settings.network-settings-compact-v422 .settings-stack-card::after{
  opacity:.45 !important;
}
#net-tab-settings.network-settings-compact-v422 .section-chip{
  margin-bottom:8px !important;
  font-size:11px !important;
  padding:4px 9px !important;
  border-radius:999px !important;
}
#net-tab-settings.network-settings-compact-v422 .settings-panel-head{
  margin-bottom:10px !important;
  gap:10px !important;
  align-items:flex-start !important;
}
#net-tab-settings.network-settings-compact-v422 .settings-panel-head h3{
  font-size:18px !important;
  font-weight:900 !important;
}
#net-tab-settings.network-settings-compact-v422 .settings-panel-note,
#net-tab-settings.network-settings-compact-v422 .text-sm.text-slate-400{
  font-size:12.5px !important;
  line-height:1.55 !important;
}
#net-tab-settings.network-settings-compact-v422 label{
  font-size:12.5px !important;
  font-weight:800 !important;
  color:#9fb1cf !important;
  margin-bottom:5px !important;
}
#net-tab-settings.network-settings-compact-v422 .input-glass,
#net-tab-settings.network-settings-compact-v422 select,
#net-tab-settings.network-settings-compact-v422 textarea{
  min-height:42px !important;
  height:auto !important;
  padding:9px 12px !important;
  font-size:14px !important;
  font-weight:700 !important;
  border-radius:var(--v422-radius-field) !important;
}
#net-tab-settings.network-settings-compact-v422 textarea#netPubKeyInput{
  min-height:58px !important;
  max-height:74px !important;
}
#net-tab-settings.network-settings-compact-v422 .space-y-4 > :not([hidden]) ~ :not([hidden]){margin-top:10px !important;}
#net-tab-settings.network-settings-compact-v422 .space-y-3 > :not([hidden]) ~ :not([hidden]){margin-top:9px !important;}
#net-tab-settings.network-settings-compact-v422 button{
  min-height:38px !important;
  font-size:13.5px !important;
  border-radius:12px !important;
}
#net-tab-settings.network-settings-compact-v422 #ipGridArea,
#net-tab-settings.network-settings-compact-v422 #ztIpGridArea{
  max-height:128px !important;
  overflow:auto !important;
  gap:7px !important;
  padding:2px !important;
  scrollbar-width:thin;
}
#net-tab-settings.network-settings-compact-v422 #ipGridArea :where(button,div,span),
#net-tab-settings.network-settings-compact-v422 #ztIpGridArea :where(button,div,span){
  font-size:11px !important;
  min-height:30px !important;
  padding:5px 8px !important;
  border-radius:10px !important;
}
#net-tab-settings.network-settings-compact-v422 .grid.grid-cols-2.gap-4{
  gap:10px !important;
}
#net-tab-settings.network-settings-compact-v422 .bridge-control-grid{
  gap:10px !important;
}
#net-tab-settings.network-settings-compact-v422 .bridge-subnet-box{
  padding:10px 12px !important;
  border-radius:12px !important;
  margin-bottom:10px !important;
}
#net-tab-settings.network-settings-compact-v422 .bridge-subnet-value{
  font-size:12px !important;
  line-height:1.55 !important;
  max-height:64px !important;
  overflow:auto !important;
}
#net-tab-settings.network-settings-compact-v422 .bridge-linked-list{
  max-height:210px !important;
  overflow:auto !important;
}
#net-tab-settings.network-settings-compact-v422 .settings-stack-card-danger{
  min-height:0 !important;
  align-items:stretch !important;
  justify-content:space-between !important;
  text-align:start !important;
  padding:14px !important;
}
#net-tab-settings.network-settings-compact-v422 .settings-stack-card-danger .section-chip,
#net-tab-settings.network-settings-compact-v422 .settings-stack-card-danger h3,
#net-tab-settings.network-settings-compact-v422 .settings-stack-card-danger p{
  margin-bottom:8px !important;
  max-width:none !important;
  text-align:start !important;
}
#net-tab-settings.network-settings-compact-v422 .settings-stack-card-danger #deleteNetworkBtn{
  width:100% !important;
  min-height:40px !important;
}

/* Devices/network rows: compact without hiding information. */
:where(#view-devices,#net-tab-devices) .device-row{
  grid-template-columns:minmax(260px,1.22fr) minmax(210px,.88fr) minmax(210px,.88fr) minmax(205px,.78fr) !important;
  gap:10px !important;
  padding:10px 12px !important;
  margin-bottom:8px !important;
  border-radius:18px !important;
  min-height:0 !important;
  box-shadow:0 14px 34px rgba(2,6,23,.22), inset 0 1px 0 rgba(255,255,255,.04) !important;
}
:where(#view-devices,#net-tab-devices) .device-main{
  gap:10px !important;
}
:where(#view-devices,#net-tab-devices) .device-name{
  font-size:17px !important;
  line-height:1.28 !important;
  font-weight:950 !important;
}
:where(#view-devices,#net-tab-devices) .device-subtitle{
  margin-top:3px !important;
  font-size:12px !important;
  line-height:1.45 !important;
}
:where(#view-devices,#net-tab-devices) .device-subline{
  margin-top:6px !important;
  gap:5px !important;
}
:where(#view-devices,#net-tab-devices) .mini-tag,
:where(#view-devices,#net-tab-devices) .device-status-label-v127,
:where(#view-devices,#net-tab-devices) .path-pill{
  font-size:10.5px !important;
  padding:4px 8px !important;
}
:where(#view-devices,#net-tab-devices) .device-metric-list,
:where(#view-devices,#net-tab-devices) .device-status-card{
  padding:9px 10px !important;
  border-radius:14px !important;
}
:where(#view-devices,#net-tab-devices) .device-metric-grid{
  gap:6px !important;
  margin-top:8px !important;
}
:where(#view-devices,#net-tab-devices) .metric-chip{
  min-height:34px !important;
  padding:7px 8px !important;
  border-radius:12px !important;
}
:where(#view-devices,#net-tab-devices) .device-metric-label{
  font-size:9.5px !important;
}
:where(#view-devices,#net-tab-devices) .metric-value,
:where(#view-devices,#net-tab-devices) .managed-pill{
  font-size:12px !important;
}
:where(#view-devices,#net-tab-devices) .device-status-top{
  margin-bottom:8px !important;
}
:where(#view-devices,#net-tab-devices) .status-summary{
  font-size:13px !important;
  font-weight:900 !important;
}
:where(#view-devices,#net-tab-devices) .status-quality{
  font-size:11px !important;
  padding:4px 8px !important;
}
:where(#view-devices,#net-tab-devices) .time-stack.compact.refined{
  gap:6px !important;
}
:where(#view-devices,#net-tab-devices) .time-stack.compact.refined span{
  padding:7px 8px !important;
  border-radius:12px !important;
  min-height:34px !important;
}
:where(#view-devices,#net-tab-devices) .time-stack.compact.refined strong{
  font-size:10px !important;
}
:where(#view-devices,#net-tab-devices) .time-stack.compact.refined em{
  font-size:11.5px !important;
}
:where(#view-devices,#net-tab-devices) .row-actions.polished{
  gap:6px !important;
}
:where(#view-devices,#net-tab-devices) .row-btn{
  min-height:32px !important;
  padding:6px 10px !important;
  font-size:12px !important;
  border-radius:10px !important;
}
:where(#view-devices,#net-tab-devices) .row-btn.ping-icon{
  width:34px !important;
  flex:0 0 34px !important;
  padding-inline:0 !important;
}
:where(#view-devices,#net-tab-devices) .device-virtual-viewport{
  padding-bottom:4px !important;
}
@media (max-width: 1320px){
  #net-tab-settings.network-settings-compact-v422 #advancedSettingsGrid > .settings-stack-card:nth-child(1){grid-column:span 12 !important;}
  #net-tab-settings.network-settings-compact-v422 #advancedSettingsGrid > .settings-stack-card:nth-child(2),
  #net-tab-settings.network-settings-compact-v422 #advancedSettingsGrid > .settings-stack-card:nth-child(3),
  #net-tab-settings.network-settings-compact-v422 #advancedSettingsGrid > .settings-stack-card:nth-child(4),
  #net-tab-settings.network-settings-compact-v422 #advancedSettingsGrid > .settings-stack-card:nth-child(5),
  #net-tab-settings.network-settings-compact-v422 #advancedSettingsGrid > .settings-stack-card:nth-child(6){grid-column:span 6 !important;}
  :where(#view-devices,#net-tab-devices) .device-row{grid-template-columns:minmax(240px,1fr) minmax(200px,.9fr) minmax(200px,.9fr) !important;}
  :where(#view-devices,#net-tab-devices) .cell-actions{grid-column:1 / -1 !important;}
}
@media (max-width: 900px){
  #net-tab-settings.network-settings-compact-v422 #advancedSettingsGrid{grid-template-columns:1fr !important;}
  #net-tab-settings.network-settings-compact-v422 #advancedSettingsGrid > .settings-stack-card{grid-column:1 / -1 !important;}
  :where(#view-devices,#net-tab-devices) .device-row{grid-template-columns:1fr !important;}
}
/* V422_PRO_COMPACT_LAYOUT_TYPOGRAPHY_END */

/* V424_WG_TUNNEL_LABELS_CLARITY_START
   Keep the existing design, but make the Handshake-only WireGuard state understandable.
   This state means: tunnel is alive, ICMP/Ping is blocked or not replying. */
:where(#net-tab-devices,#view-devices) .device-row.device-state-tunnel .device-subtitle{
  color:rgba(165,243,252,.92)!important;
  font-size:12.5px!important;
  line-height:1.45!important;
}
:where(#net-tab-devices,#view-devices) .device-row.device-state-tunnel .path-tunnel::before{
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  background:#22d3ee;
  box-shadow:0 0 0 4px rgba(34,211,238,.12);
  display:inline-block;
  margin-inline-end:6px;
  vertical-align:middle;
}
:where(#net-tab-devices,#view-devices) .device-row.device-state-tunnel .metric-chip.muted{
  opacity:.72;
  border-style:dashed!important;
}
:where(#net-tab-devices,#view-devices) .device-metric-grid.is-empty{
  grid-template-columns:1fr!important;
}
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .device-row.device-state-tunnel .device-subtitle{
  color:#0e7490!important;
}
/* V424_WG_TUNNEL_LABELS_CLARITY_END */

/* V426_AUTO_WG_INTERFACE_NETWORK_QR_UI_START */
/* Keep the compact network card professional: no client-id noise, visible QR actions, and clear download/open actions. */
.networks-compact-card .networks-compact-main{
  grid-template-columns:minmax(300px,1.55fr) minmax(170px,.95fr) minmax(92px,.42fr) minmax(92px,.42fr) minmax(92px,.42fr) minmax(260px,1fr)!important;
  align-items:center!important;
}
.networks-compact-qrbox{
  min-width:0!important;
  padding:10px 12px!important;
  border-radius:16px!important;
  background:linear-gradient(135deg,rgba(14,165,233,.12),rgba(59,130,246,.06))!important;
  border:1px solid rgba(56,189,248,.22)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04)!important;
}
.networks-compact-qrbox>span{
  display:block!important;
  color:#9ac7ff!important;
  font-size:11px!important;
  font-weight:900!important;
  margin-bottom:7px!important;
}
.networks-compact-qr-actions{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:6px!important;
}
.network-qr-mini-btn-v426,
.networks-compact-qr-actions .network-qr-mini-btn-v418{
  min-height:32px!important;
  border-radius:11px!important;
  padding:0 10px!important;
  border:1px solid rgba(96,165,250,.35)!important;
  background:rgba(37,99,235,.16)!important;
  color:#dbeafe!important;
  font-weight:950!important;
  font-size:11px!important;
  white-space:nowrap!important;
  cursor:pointer!important;
}
.network-qr-mini-btn-v426:hover,
.networks-compact-qr-actions .network-qr-mini-btn-v418:hover{
  background:rgba(37,99,235,.34)!important;
  border-color:rgba(125,211,252,.62)!important;
}
.networks-compact-buttons{
  justify-content:flex-start!important;
  align-items:center!important;
}
.networks-compact-copy,.networks-compact-open{
  min-height:36px!important;
  min-width:86px!important;
  padding:0 12px!important;
  font-size:12px!important;
  border-radius:12px!important;
}
.networks-compact-open{min-width:70px!important;}
.network-clean-title-line-v418 .network-inline-qr-actions-v418,
.network-card-name-line-v418 .network-inline-qr-actions-v418{
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  gap:7px!important;
  flex-wrap:wrap!important;
  align-items:center!important;
}
.network-clean-title-line-v418 .network-qr-mini-btn-v418,
.network-clean-title-line-v418 .network-qr-mini-btn-v426{
  min-height:34px!important;
  padding:0 12px!important;
  border-radius:12px!important;
  font-size:12px!important;
}
/* Settings readability recovery: keep ZeroTier and WireGuard plans side-by-side with a usable size. */
#net-tab-settings.network-settings-compact-v422 #advancedSettingsGrid > .settings-stack-card:nth-child(2),
#net-tab-settings.network-settings-compact-v422 #advancedSettingsGrid > .settings-stack-card:nth-child(3){
  grid-column:span 6!important;
  min-height:unset!important;
}
#net-tab-settings.network-settings-compact-v422 #ipGridArea,
#net-tab-settings.network-settings-compact-v422 #ztIpGridArea{
  grid-template-columns:repeat(3,minmax(150px,1fr))!important;
  gap:10px!important;
}
#net-tab-settings.network-settings-compact-v422 #ipGridArea .ip-btn,
#net-tab-settings.network-settings-compact-v422 #ztIpGridArea .ip-btn{
  min-height:42px!important;
  font-size:13px!important;
  border-radius:13px!important;
  border-color:rgba(96,165,250,.24)!important;
}
#net-tab-settings.network-settings-compact-v422 #ipGridArea .ip-btn.active,
#net-tab-settings.network-settings-compact-v422 #ztIpGridArea .ip-btn.active,
#net-tab-settings.network-settings-compact-v422 #ipGridArea .ip-btn[aria-pressed="true"],
#net-tab-settings.network-settings-compact-v422 #ztIpGridArea .ip-btn[aria-pressed="true"]{
  background:linear-gradient(180deg,rgba(37,99,235,.95),rgba(14,165,233,.82))!important;
  color:#fff!important;
  border-color:rgba(186,230,253,.85)!important;
  box-shadow:0 0 0 2px rgba(14,165,233,.22),0 12px 32px rgba(37,99,235,.28)!important;
}
@media(max-width:1200px){
  .networks-compact-card .networks-compact-main{grid-template-columns:minmax(0,1fr) minmax(160px,.8fr) repeat(3,86px)!important;}
  .networks-compact-qrbox,.networks-compact-buttons{grid-column:1/-1!important;}
}
@media(max-width:760px){
  .networks-compact-card .networks-compact-main{grid-template-columns:1fr!important;}
  .networks-compact-qr-actions{grid-template-columns:1fr 1fr!important;}
  #net-tab-settings.network-settings-compact-v422 #advancedSettingsGrid > .settings-stack-card:nth-child(2),
  #net-tab-settings.network-settings-compact-v422 #advancedSettingsGrid > .settings-stack-card:nth-child(3){grid-column:1/-1!important;}
  #net-tab-settings.network-settings-compact-v422 #ipGridArea,
  #net-tab-settings.network-settings-compact-v422 #ztIpGridArea{grid-template-columns:1fr!important;}
}
/* V426_AUTO_WG_INTERFACE_NETWORK_QR_UI_END */

/* V427_PRO_SETTINGS_FOUR_PAGES_REDESIGN_START
   إعادة تصميم احترافية محافظة لأربع مجموعات إعدادات السيرفر.
   القواعد scoped داخل #view-superadmin فقط ولا تغيّر منطق التشغيل أو API. */
#view-superadmin.sa-v427-pro-settings{
  --sa-v427-bg:rgba(8,16,32,.74);
  --sa-v427-card:linear-gradient(145deg,rgba(15,27,48,.92),rgba(7,14,29,.86));
  --sa-v427-card-2:linear-gradient(145deg,rgba(20,35,60,.86),rgba(8,16,32,.88));
  --sa-v427-border:rgba(96,165,250,.18);
  --sa-v427-border-soft:rgba(148,163,184,.13);
  --sa-v427-text:#eef6ff;
  --sa-v427-muted:#94a3b8;
  --sa-v427-blue:#3b82f6;
  --sa-v427-gold:#f6d36b;
}
#view-superadmin #saContent.v427-pro-settings{
  max-width:1440px!important;
  width:100%!important;
  margin-inline:0!important;
  padding:14px 16px 24px!important;
  font-size:14px!important;
  line-height:1.55!important;
  color:var(--sa-v427-text)!important;
}
#view-superadmin #saContent.v427-pro-settings #saQuickFoldBar,
#view-superadmin #saContent.v427-pro-settings .premium-admin-hero,
#view-superadmin #saContent.v427-pro-settings .lux-stat-grid,
#view-superadmin #saContent.v427-pro-settings .sa-settings-page-kicker-v415,
#view-superadmin #saContent.v427-pro-settings #saSettingsPageIndexV415{display:none!important;}

/* المجموعات الأربع: واضحة وفاخرة بدون تمدد زائد */
#view-superadmin #saContent.v427-pro-settings #saSettingsPager.sa-settings-pager-v427{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:14px!important;
  padding:16px!important;
  margin:0 0 14px!important;
  border-radius:28px!important;
  border:1px solid rgba(96,165,250,.16)!important;
  background:linear-gradient(135deg,rgba(9,18,36,.88),rgba(4,10,22,.82))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 20px 55px rgba(0,0,0,.18)!important;
}
#view-superadmin #saContent.v427-pro-settings .sa-settings-group-v415{
  min-height:148px!important;
  padding:16px!important;
  border-radius:22px!important;
  background:linear-gradient(160deg,rgba(4,10,22,.76),rgba(13,25,46,.72))!important;
  border:1px solid rgba(148,163,184,.12)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
  transition:border-color .18s ease, background .18s ease, transform .18s ease!important;
}
#view-superadmin #saContent.v427-pro-settings .sa-settings-group-v415.active-group-v427{
  border-color:rgba(96,165,250,.34)!important;
  background:linear-gradient(160deg,rgba(21,40,72,.88),rgba(8,18,38,.92))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 18px 44px rgba(37,99,235,.10)!important;
}
#view-superadmin #saContent.v427-pro-settings .sa-settings-group-head-v415{margin-bottom:12px!important;}
#view-superadmin #saContent.v427-pro-settings .sa-settings-group-head-v415 strong{
  display:block!important;
  color:#f8fafc!important;
  font-size:18px!important;
  line-height:1.25!important;
  font-weight:950!important;
  letter-spacing:-.01em!important;
}
#view-superadmin #saContent.v427-pro-settings .sa-settings-group-head-v415 small{
  color:#8da2bd!important;
  font-size:12px!important;
  line-height:1.55!important;
}
#view-superadmin #saContent.v427-pro-settings .sa-settings-group-buttons-v415{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:9px!important;
}
#view-superadmin #saContent.v427-pro-settings #saSettingsPager button{
  min-height:42px!important;
  padding:9px 12px!important;
  border-radius:15px!important;
  border:1px solid rgba(148,163,184,.16)!important;
  background:linear-gradient(180deg,rgba(16,27,48,.86),rgba(8,16,32,.82))!important;
  color:#d7e3f5!important;
  font-size:14px!important;
  font-weight:900!important;
  justify-content:space-between!important;
}
#view-superadmin #saContent.v427-pro-settings #saSettingsPager button:hover{
  transform:translateY(-1px)!important;
  border-color:rgba(56,189,248,.34)!important;
}
#view-superadmin #saContent.v427-pro-settings #saSettingsPager button.active,
#view-superadmin #saContent.v427-pro-settings #saSettingsPager button[aria-selected="true"]{
  color:#07111e!important;
  background:linear-gradient(135deg,#ffe082,#d9aa4d)!important;
  border-color:rgba(255,224,130,.62)!important;
  box-shadow:0 12px 28px rgba(217,170,77,.18)!important;
}
#view-superadmin #saContent.v427-pro-settings #saSettingsPager .sa-page-icon{
  width:26px!important;height:26px!important;border-radius:11px!important;font-size:13px!important;
  background:rgba(96,165,250,.10)!important;border-color:rgba(96,165,250,.16)!important;
}
#view-superadmin #saContent.v427-pro-settings #saSettingsPager .sa-page-label{
  font-size:14px!important;line-height:1.2!important;
}

/* رأس الصفحة الداخلية: مختصر ومفيد */
#view-superadmin #saContent.v427-pro-settings #saSettingsPageHeaderV415{
  margin:0 0 12px!important;
  padding:13px 16px!important;
  border-radius:18px!important;
  border:1px solid rgba(96,165,250,.14)!important;
  background:linear-gradient(90deg,rgba(7,16,31,.72),rgba(12,23,41,.62))!important;
  box-shadow:none!important;
  align-items:center!important;
}
#view-superadmin #saContent.v427-pro-settings #saSettingsPageTitleV415{
  font-size:20px!important;
  line-height:1.25!important;
  color:#f8fafc!important;
  margin:0!important;
}
#view-superadmin #saContent.v427-pro-settings #saSettingsPageChecklistV415{
  max-width:900px!important;
  font-size:13px!important;
  color:#9fb0c9!important;
  line-height:1.55!important;
}
#view-superadmin #saContent.v427-pro-settings #saSettingsPageHint{
  margin:0 0 14px!important;
  padding:10px 14px!important;
  border-radius:16px!important;
  background:rgba(2,8,23,.44)!important;
  border-color:rgba(96,165,250,.12)!important;
  font-size:13px!important;
}
#view-superadmin #saContent.v427-pro-settings #saSettingsPageHeaderV415 button{
  min-height:36px!important;
  padding:8px 12px!important;
  font-size:12px!important;
}

/* الكروت الداخلية: أقل فراغ، قراءة أوضح */
#view-superadmin #saContent.v427-pro-settings .sa-section-shell{
  padding:16px!important;
  margin:0 0 14px!important;
  border-radius:24px!important;
  border:1px solid rgba(96,165,250,.18)!important;
  background:linear-gradient(145deg,rgba(13,27,48,.82),rgba(5,12,26,.88))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 14px 42px rgba(0,0,0,.10)!important;
}
#view-superadmin #saContent.v427-pro-settings .sa-section-shell.is-collapsed:not([data-sa-page]){max-height:none!important;overflow:visible!important;}
#view-superadmin #saContent.v427-pro-settings .sa-accordion-head{cursor:default!important;}
#view-superadmin #saContent.v427-pro-settings .sa-section-head h3,
#view-superadmin #saContent.v427-pro-settings h3{
  font-size:22px!important;
  line-height:1.25!important;
  font-weight:950!important;
  color:#f8fafc!important;
}
#view-superadmin #saContent.v427-pro-settings h4{
  font-size:17px!important;
  line-height:1.35!important;
  color:#eef6ff!important;
}
#view-superadmin #saContent.v427-pro-settings p,
#view-superadmin #saContent.v427-pro-settings small,
#view-superadmin #saContent.v427-pro-settings .text-slate-400,
#view-superadmin #saContent.v427-pro-settings .admin-card-sub,
#view-superadmin #saContent.v427-pro-settings .admin-row-role-hint{
  color:#9aaec7!important;
}
#view-superadmin #saContent.v427-pro-settings label,
#view-superadmin #saContent.v427-pro-settings .block.text-xs.font-bold{
  font-size:12px!important;
  font-weight:900!important;
  color:#c9d8ee!important;
}
#view-superadmin #saContent.v427-pro-settings .input-glass,
#view-superadmin #saContent.v427-pro-settings input,
#view-superadmin #saContent.v427-pro-settings select,
#view-superadmin #saContent.v427-pro-settings textarea{
  min-height:42px!important;
  border-radius:14px!important;
  font-size:13px!important;
  border-color:rgba(96,165,250,.18)!important;
  background:rgba(3,10,23,.62)!important;
}
#view-superadmin #saContent.v427-pro-settings button,
#view-superadmin #saContent.v427-pro-settings .btn,
#view-superadmin #saContent.v427-pro-settings .premium-action-btn{
  border-radius:14px!important;
  font-weight:900!important;
}

/* الإدارة والصلاحيات */
#view-superadmin #saContent.v427-pro-settings[data-sa-active-group="management"] .v398-mini-details{
  border-radius:18px!important;
  border:1px solid rgba(96,165,250,.14)!important;
  background:rgba(2,8,23,.38)!important;
  margin-bottom:10px!important;
}
#view-superadmin #saContent.v427-pro-settings[data-sa-active-group="management"] .v398-mini-details summary{
  min-height:44px!important;
  padding:10px 13px!important;
  font-size:14px!important;
}
#view-superadmin #saContent.v427-pro-settings .admin-current-account-card,
#view-superadmin #saContent.v427-pro-settings .admin-password-card,
#view-superadmin #saContent.v427-pro-settings .admin-management-card,
#view-superadmin #saContent.v427-pro-settings .access-requests-panel-v413{
  border-radius:22px!important;
  border:1px solid rgba(96,165,250,.16)!important;
  background:linear-gradient(145deg,rgba(14,27,47,.82),rgba(5,12,26,.82))!important;
  padding:16px!important;
}
#view-superadmin #saContent.v427-pro-settings .admin-summary-grid,
#view-superadmin #saContent.v427-pro-settings .admin-card-grid,
#view-superadmin #saContent.v427-pro-settings .admin-create-grid{
  gap:10px!important;
}
#view-superadmin #saContent.v427-pro-settings .admin-management-head{
  margin-bottom:12px!important;
  padding-bottom:10px!important;
}
#view-superadmin #saContent.v427-pro-settings .admin-card{
  border-radius:18px!important;
  padding:12px!important;
  background:rgba(2,8,23,.42)!important;
}
#view-superadmin #saContent.v427-pro-settings .admin-card-summary{gap:10px!important;}
#view-superadmin #saContent.v427-pro-settings .admin-card-name{font-size:15px!important;}
#view-superadmin #saContent.v427-pro-settings .admin-role-chip,
#view-superadmin #saContent.v427-pro-settings .admin-status-chip,
#view-superadmin #saContent.v427-pro-settings .admin-current-chip{
  font-size:10px!important;
  padding:4px 8px!important;
}

/* الاتصال والتنبيهات / التشغيل / الأمان: شكل بطاقات إعدادات واضح */
#view-superadmin #saContent.v427-pro-settings[data-sa-active-group="connectivity"] .rounded-3xl,
#view-superadmin #saContent.v427-pro-settings[data-sa-active-group="operations"] .rounded-3xl,
#view-superadmin #saContent.v427-pro-settings[data-sa-active-group="security"] .rounded-3xl{
  padding:16px!important;
  border-radius:20px!important;
  border:1px solid rgba(96,165,250,.16)!important;
  background:linear-gradient(145deg,rgba(14,27,47,.78),rgba(4,10,22,.78))!important;
}
#view-superadmin #saContent.v427-pro-settings[data-sa-active-page="security"] .sa-section-shell,
#view-superadmin #saContent.v427-pro-settings[data-sa-active-page="mail"] .sa-section-shell,
#view-superadmin #saContent.v427-pro-settings[data-sa-active-page="storage"] .sa-section-shell,
#view-superadmin #saContent.v427-pro-settings[data-sa-active-page="server"] .sa-section-shell{
  max-width:1120px!important;
}
#view-superadmin #saContent.v427-pro-settings #serverSettingsDirtyBar.sa-dirty-inline{
  margin-top:12px!important;
}
#view-superadmin #saContent.v427-pro-settings #serverSettingsDirtyBar.sa-dirty-inline>div{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(220px,360px)!important;
  align-items:center!important;
  gap:14px!important;
  padding:14px!important;
  border-radius:20px!important;
}
#view-superadmin #saContent.v427-pro-settings #serverSettingsDirtyBar button{
  min-height:40px!important;
  font-size:14px!important;
}

@media (max-width:1180px){
  #view-superadmin #saContent.v427-pro-settings #saSettingsPager.sa-settings-pager-v427{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media (max-width:760px){
  #view-superadmin #saContent.v427-pro-settings{padding:10px!important;}
  #view-superadmin #saContent.v427-pro-settings #saSettingsPager.sa-settings-pager-v427{grid-template-columns:1fr!important;padding:12px!important;}
  #view-superadmin #saContent.v427-pro-settings .sa-settings-group-v415{min-height:auto!important;}
  #view-superadmin #saContent.v427-pro-settings #serverSettingsDirtyBar.sa-dirty-inline>div{grid-template-columns:1fr!important;}
}
/* V427_PRO_SETTINGS_FOUR_PAGES_REDESIGN_END */

/* V428_PRO_TWO_SETTINGS_SCREENS_START
   Scoped redesign only for: Network Settings tab + Accounts/Permissions page.
   No sidebar/top-main-nav/global components are touched here. */
#net-tab-settings.network-settings-pro-v428{
  max-width: 1180px !important;
  margin-inline: auto !important;
  padding: 0 4px 28px !important;
  direction: rtl !important;
}
#net-tab-settings.network-settings-pro-v428 > .flex.justify-between.items-center{
  min-height: 94px !important;
  padding: 18px 22px !important;
  margin-bottom: 18px !important;
  border: 1px solid rgba(59,130,246,.22) !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 82% 20%, rgba(37,99,235,.18), transparent 35%),
    linear-gradient(135deg, rgba(15,23,42,.92), rgba(2,6,23,.82)) !important;
  box-shadow: 0 18px 50px rgba(2,6,23,.28), inset 0 1px 0 rgba(255,255,255,.05) !important;
}
#net-tab-settings.network-settings-pro-v428 > .flex.justify-between.items-center h3{
  font-size: 25px !important;
  line-height: 1.25 !important;
  letter-spacing: -.02em !important;
}
#net-tab-settings.network-settings-pro-v428 .settings-hero-note{
  max-width: 760px !important;
  color: rgba(203,213,225,.78) !important;
  font-size: 13px !important;
  line-height: 1.8 !important;
}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsToggleBtn{
  height: 42px !important;
  padding-inline: 18px !important;
  border-radius: 14px !important;
}
#net-tab-settings.network-settings-pro-v428 .settings-quick-strip{
  display: none !important;
}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid{
  display: grid !important;
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  gap: 18px !important;
  align-items: start !important;
}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card{
  grid-column: span 6 !important;
  min-height: 0 !important;
  padding: 18px !important;
  border-radius: 22px !important;
  border: 1px solid rgba(59,130,246,.18) !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(59,130,246,.12), transparent 32%),
    linear-gradient(145deg, rgba(15,23,42,.88), rgba(2,6,23,.82)) !important;
  box-shadow: 0 18px 42px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.04) !important;
}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1){
  grid-column: span 12 !important;
  order: 1 !important;
}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(2){order: 2 !important;}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(3){order: 3 !important;}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(4){grid-column: span 4 !important; order: 4 !important;}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(5){grid-column: span 8 !important; order: 5 !important;}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(6){grid-column: span 12 !important; order: 6 !important;}
#net-tab-settings.network-settings-pro-v428 .settings-panel-head{
  align-items: flex-start !important;
  gap: 12px !important;
  margin-bottom: 14px !important;
}
#net-tab-settings.network-settings-pro-v428 .settings-panel-head h3{
  font-size: 20px !important;
  line-height: 1.25 !important;
  font-weight: 900 !important;
}
#net-tab-settings.network-settings-pro-v428 .settings-panel-note,
#net-tab-settings.network-settings-pro-v428 .text-sm.text-slate-400{
  color: rgba(203,213,225,.72) !important;
  font-size: 12px !important;
  line-height: 1.75 !important;
}
#net-tab-settings.network-settings-pro-v428 label{
  font-size: 12px !important;
  font-weight: 800 !important;
  color: rgba(203,213,225,.74) !important;
}
#net-tab-settings.network-settings-pro-v428 .input-glass,
#net-tab-settings.network-settings-pro-v428 select,
#net-tab-settings.network-settings-pro-v428 textarea{
  min-height: 42px !important;
  height: auto !important;
  border-radius: 14px !important;
  font-size: 13px !important;
  border-color: rgba(59,130,246,.18) !important;
  background: rgba(2,6,23,.48) !important;
}
#net-tab-settings.network-settings-pro-v428 textarea#netPubKeyInput{
  min-height: 58px !important;
  resize: vertical !important;
}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4{
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > div:nth-child(6),
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > button{
  grid-column: span 2 !important;
}
#net-tab-settings.network-settings-pro-v428 #ipGridArea,
#net-tab-settings.network-settings-pro-v428 #ztIpGridArea{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
}
#net-tab-settings.network-settings-pro-v428 #ipGridArea .ip-btn,
#net-tab-settings.network-settings-pro-v428 #ztIpGridArea .ip-btn,
#net-tab-settings.network-settings-pro-v428 #ipGridArea button,
#net-tab-settings.network-settings-pro-v428 #ztIpGridArea button{
  min-height: 42px !important;
  border-radius: 14px !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  justify-content: center !important;
  background: rgba(15,23,42,.72) !important;
  border: 1px solid rgba(148,163,184,.16) !important;
}
#net-tab-settings.network-settings-pro-v428 #ipGridArea .ip-btn.active,
#net-tab-settings.network-settings-pro-v428 #ztIpGridArea .ip-btn.active,
#net-tab-settings.network-settings-pro-v428 #ipGridArea .ip-btn[aria-pressed="true"],
#net-tab-settings.network-settings-pro-v428 #ztIpGridArea .ip-btn[aria-pressed="true"],
#net-tab-settings.network-settings-pro-v428 #ipGridArea button.active,
#net-tab-settings.network-settings-pro-v428 #ztIpGridArea button.active{
  color: #fff !important;
  border-color: rgba(59,130,246,.75) !important;
  background: linear-gradient(135deg, rgba(37,99,235,.95), rgba(6,182,212,.62)) !important;
  box-shadow: 0 0 0 1px rgba(147,197,253,.22) inset, 0 10px 28px rgba(37,99,235,.25) !important;
}
#net-tab-settings.network-settings-pro-v428 .bridge-control-grid{
  display: grid !important;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important;
  gap: 12px !important;
}
#net-tab-settings.network-settings-pro-v428 .bridge-subnet-box,
#net-tab-settings.network-settings-pro-v428 .bridge-linked-list{
  border-radius: 16px !important;
  background: rgba(2,6,23,.38) !important;
}
#net-tab-settings.network-settings-pro-v428 .settings-stack-card-danger{
  min-height: 120px !important;
  display: grid !important;
  grid-template-columns: minmax(0,1fr) 220px !important;
  text-align: right !important;
  align-items: center !important;
  gap: 16px !important;
  border-color: rgba(239,68,68,.22) !important;
  background: linear-gradient(135deg, rgba(127,29,29,.22), rgba(15,23,42,.86)) !important;
}
#net-tab-settings.network-settings-pro-v428 .settings-stack-card-danger .section-chip,
#net-tab-settings.network-settings-pro-v428 .settings-stack-card-danger h3,
#net-tab-settings.network-settings-pro-v428 .settings-stack-card-danger p{
  grid-column: 1 !important;
  justify-self: start !important;
  text-align: right !important;
  margin: 0 !important;
}
#net-tab-settings.network-settings-pro-v428 .settings-stack-card-danger #deleteNetworkBtn{
  grid-column: 2 !important;
  grid-row: 1 / span 3 !important;
  height: 48px !important;
}

#view-superadmin .admin-accounts-section.accounts-redesign-v428{
  max-width: 1180px !important;
  margin-inline: auto !important;
  padding: 22px !important;
  border-radius: 26px !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(37,99,235,.14), transparent 30%),
    linear-gradient(145deg, rgba(15,23,42,.9), rgba(2,6,23,.86)) !important;
  border-color: rgba(59,130,246,.18) !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 > .sa-section-head{
  min-height: 82px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  justify-content: center !important;
  margin-bottom: 18px !important;
  padding-inline: 8px !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 > .sa-section-head h3{
  font-size: 30px !important;
  line-height: 1.2 !important;
  letter-spacing: -.02em !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 > .grid:first-of-type{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  gap: 18px !important;
  margin-bottom: 18px !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-current-account-card,
#view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-password-card,
#view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-management-card,
#view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-create-details,
#view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-permissions-details{
  border-radius: 22px !important;
  border: 1px solid rgba(59,130,246,.18) !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(59,130,246,.11), transparent 30%),
    linear-gradient(145deg, rgba(15,23,42,.86), rgba(2,6,23,.78)) !important;
  box-shadow: 0 18px 42px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.04) !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-password-card{
  grid-column: span 1 !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-current-account-card{
  grid-column: span 1 !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-summary-grid{
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 9px !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-summary-item{
  min-height: 42px !important;
  border-radius: 14px !important;
  background: rgba(2,6,23,.38) !important;
  border: 1px solid rgba(59,130,246,.12) !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-password-card .grid{
  grid-template-columns: 1fr !important;
  gap: 10px !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-password-card .mt-4{
  align-items: stretch !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 #changeMyPasswordBtn{
  width: 100% !important;
  height: 42px !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-management-card{
  padding: 16px !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-management-head{
  margin-bottom: 12px !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-management-head h3{
  font-size: 24px !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-create-details{
  padding: 14px !important;
  margin-bottom: 14px !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-create-details > summary,
#view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-permissions-details > summary{
  min-height: 44px !important;
  border-radius: 16px !important;
  background: rgba(15,23,42,.64) !important;
  border: 1px solid rgba(59,130,246,.15) !important;
  font-size: 14px !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-create-grid{
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0,1fr)) !important;
  gap: 12px !important;
  padding: 12px 2px 2px !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-create-action-wrap{
  grid-column: span 1 !important;
  align-self: end !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-trial-toggle-card,
#view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-trial-fields{
  grid-column: span 2 !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 #permissionMatrixBox{
  margin-top: 12px !important;
  border-radius: 18px !important;
  overflow: hidden !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-list-toolbar{
  display: grid !important;
  grid-template-columns: 1.2fr 2fr repeat(3, minmax(130px,.8fr)) auto !important;
  gap: 10px !important;
  align-items: end !important;
  border-radius: 18px !important;
  padding: 12px !important;
  background: rgba(2,6,23,.28) !important;
  border: 1px solid rgba(59,130,246,.12) !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-toolbar-title{
  align-self: center !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 .input-glass,
#view-superadmin .admin-accounts-section.accounts-redesign-v428 select{
  min-height: 42px !important;
  border-radius: 14px !important;
  font-size: 13px !important;
  border-color: rgba(59,130,246,.18) !important;
  background: rgba(2,6,23,.48) !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 label{
  font-size: 12px !important;
  color: rgba(203,213,225,.74) !important;
}
#view-superadmin .admin-accounts-section.accounts-redesign-v428 #adminsList{
  display: grid !important;
  gap: 10px !important;
}
@media (max-width: 1100px){
  #net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid,
  #view-superadmin .admin-accounts-section.accounts-redesign-v428 > .grid:first-of-type,
  #view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-create-grid{
    grid-template-columns: 1fr !important;
  }
  #net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card,
  #view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-password-card,
  #view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-current-account-card,
  #view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-trial-toggle-card,
  #view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-trial-fields,
  #view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-create-action-wrap{
    grid-column: 1 / -1 !important;
  }
  #net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4,
  #net-tab-settings.network-settings-pro-v428 .bridge-control-grid,
  #view-superadmin .admin-accounts-section.accounts-redesign-v428 .admin-list-toolbar{
    grid-template-columns: 1fr !important;
  }
  #net-tab-settings.network-settings-pro-v428 .settings-stack-card-danger{
    grid-template-columns: 1fr !important;
  }
  #net-tab-settings.network-settings-pro-v428 .settings-stack-card-danger #deleteNetworkBtn{
    grid-column: 1 !important;
    grid-row: auto !important;
  }
}
/* V428_PRO_TWO_SETTINGS_SCREENS_END */


/* V447_FIRST_DESIGN_PRO_UNIFIED_START
   Unified professional layer built on the FIRST uploaded design.
   It restores the original visual identity and adds only scoped polish/layout fixes.
   No global color theme override, no backend/API changes.
*/

/* general clarity built on the original theme variables */
:root{
  --v447-soft-line: color-mix(in srgb, var(--brand-accent, #4e8dd8) 18%, rgba(148,163,184,.22));
  --v447-focus: color-mix(in srgb, var(--brand-accent, #4e8dd8) 24%, transparent);
}
.card,.compact-card,.device-card,.network-list-card,.network-command-card,.networks-compact-card,
.network-clean-header,.network-quick-card,.sa-section-shell,.backup-section,.table-shell{
  border-radius:22px !important;
  border-color:var(--v447-soft-line) !important;
  box-shadow:0 16px 36px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.035) !important;
}
.btn-primary,.action-btn,.row-btn,.network-clean-primary,.network-clean-secondary,
.networks-compact-copy,.networks-compact-open,button[class*='btn']{
  border-radius:14px !important;
  font-weight:850 !important;
  transition:transform .14s ease, box-shadow .14s ease, border-color .14s ease, filter .14s ease !important;
}
.btn-primary:hover,.action-btn:hover,.row-btn:hover,.network-clean-primary:hover,.network-clean-secondary:hover,
.networks-compact-copy:hover,.networks-compact-open:hover{
  transform:translateY(-1px);
  filter:brightness(1.04);
}
.btn-primary:focus-visible,.action-btn:focus-visible,.row-btn:focus-visible,
.network-clean-primary:focus-visible,.network-clean-secondary:focus-visible,
input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:none !important;
  box-shadow:0 0 0 4px var(--v447-focus) !important;
}

/* route add row remains clean without V72 note */
.routing-add-card .routing-form-grid-v196{
  align-items:end !important;
}
.routing-add-card .route-via-help-v433{
  display:none !important;
}

/* WireGuard plan layout fix, scoped and color-neutral */
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434{
  min-height:0 !important;
  height:auto !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 #ipGridArea{
  display:flex !important;
  flex:0 1 auto !important;
  flex-direction:column !important;
  gap:10px !important;
  min-height:0 !important;
  max-height:360px !important;
  overflow:auto !important;
  padding-inline-end:2px !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 .ip-preset-group{
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  padding:10px !important;
  border-radius:16px !important;
  background:linear-gradient(180deg,rgba(15,23,42,.74),rgba(8,14,26,.72)) !important;
  border:1px solid rgba(148,163,184,.18) !important;
  overflow:hidden !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 .ip-preset-head{
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr) !important;
  align-items:center !important;
  gap:8px !important;
  margin:0 0 8px !important;
  direction:rtl !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 .ip-preset-buttons{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:8px !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 #ipGridArea .ip-btn{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  min-height:40px !important;
  height:40px !important;
  padding:8px 10px !important;
  border-radius:14px !important;
  font-size:12px !important;
  font-weight:950 !important;
  direction:ltr !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 #netSettingsUpdateBaseBtn{
  margin-top:14px !important;
  position:static !important;
  width:100% !important;
  min-height:46px !important;
}

/* General settings hub, matching the first design */
.general-settings-hub-v441{
  position:relative !important;
  overflow:hidden !important;
  background:linear-gradient(180deg,rgba(16,27,49,.92),rgba(8,15,30,.92)) !important;
  border:1px solid var(--v447-soft-line) !important;
  border-radius:24px !important;
}
.general-settings-head-v441{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:18px !important;
  margin-bottom:20px !important;
}
.general-settings-head-v441 h3{
  margin:6px 0 8px !important;
  color:var(--brand-text,#eef5ff) !important;
  font-size:30px !important;
  font-weight:950 !important;
}
.general-settings-head-v441 p{
  margin:0 !important;
  max-width:780px !important;
  color:var(--brand-muted,#9db2d0) !important;
  line-height:1.9 !important;
  font-size:13px !important;
}
.general-settings-badges-v441,.general-settings-kpi-v441,.general-settings-grid-v441{
  display:grid !important;
  gap:12px !important;
}
.general-settings-badges-v441{
  display:flex !important;
  flex-wrap:wrap !important;
  justify-content:flex-end !important;
}
.general-settings-badges-v441 span{
  display:inline-flex !important;
  align-items:center !important;
  padding:7px 12px !important;
  border-radius:999px !important;
  border:1px solid rgba(78,141,216,.26) !important;
  background:rgba(78,141,216,.10) !important;
  color:#dbeafe !important;
  font-size:11px !important;
  font-weight:900 !important;
}
.general-settings-kpi-v441{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  margin-bottom:18px !important;
}
.general-settings-kpi-v441 > div,.general-settings-card-v441{
  border:1px solid rgba(148,163,184,.16) !important;
  background:linear-gradient(180deg,rgba(15,23,42,.82),rgba(8,13,25,.82)) !important;
  border-radius:20px !important;
  padding:14px !important;
}
.general-settings-kpi-v441 strong{
  display:block !important;
  color:#93c5fd !important;
  font-size:26px !important;
  font-weight:950 !important;
  line-height:1 !important;
}
.general-settings-grid-v441{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
}
.general-settings-card-v441{
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr) !important;
  align-items:start !important;
  gap:13px !important;
}
.general-card-icon-v441{
  width:44px !important;
  height:44px !important;
  display:grid !important;
  place-items:center !important;
  border-radius:16px !important;
  background:linear-gradient(135deg,rgba(78,141,216,.18),rgba(20,184,166,.08)) !important;
  border:1px solid rgba(78,141,216,.22) !important;
}
.general-settings-card-v441 h4{margin:0 0 6px !important;color:#f8fafc !important;font-weight:950 !important}
.general-settings-card-v441 p{margin:0 !important;color:#aab7ca !important;font-size:12px !important;line-height:1.75 !important}
.general-action-v441{
  grid-column:1 / -1 !important;
  min-height:42px !important;
  border-radius:14px !important;
  padding:9px 14px !important;
  font-weight:900 !important;
  border:1px solid rgba(148,163,184,.22) !important;
}
.general-action-v441.gold,.general-action-v441.blue{
  background:linear-gradient(135deg,#2563eb,#0ea5e9) !important;
  color:#fff !important;
}
.general-action-v441.green{background:linear-gradient(135deg,#2fb67c,#15803d) !important;color:#ecfdf5 !important}
.general-action-v441.teal{background:linear-gradient(135deg,#14b8a6,#0f766e) !important;color:#ecfeff !important}
.general-action-v441.orange{background:linear-gradient(135deg,#f97316,#c2410c) !important;color:#fff7ed !important}
.general-action-v441.gray{background:linear-gradient(135deg,#64748b,#334155) !important;color:#f8fafc !important}
.general-settings-note-v441{
  margin-top:16px !important;
  padding:13px 15px !important;
  border-radius:18px !important;
  border:1px solid rgba(78,141,216,.22) !important;
  background:rgba(78,141,216,.08) !important;
  color:#cbd5e1 !important;
  line-height:1.8 !important;
  font-size:12px !important;
}

/* Network QR: visible image, no duplicate buttons */
.network-qr-duplicate-v442,
.networks-compact-main .network-card-name-line-v418 > .network-inline-qr-actions-v418,
.network-clean-title-line-v418 .network-clean-qr-actions-v418{
  display:none !important;
}
.networks-compact-qrbox-v442{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  gap:9px !important;
  min-width:170px !important;
  max-width:230px !important;
  border:1px solid rgba(78,141,216,.22) !important;
  background:linear-gradient(180deg,rgba(15,23,42,.82),rgba(8,13,25,.86)) !important;
  border-radius:20px !important;
  padding:12px !important;
}
.networks-compact-qrbox-v442 > span{
  color:#dbeafe !important;
  font-size:12px !important;
  font-weight:950 !important;
}
.networks-compact-qr-img-v442{
  display:block !important;
  width:112px !important;
  height:112px !important;
  max-width:100% !important;
  object-fit:contain !important;
  background:#fff !important;
  border-radius:16px !important;
  padding:8px !important;
  border:1px solid rgba(78,141,216,.36) !important;
  box-shadow:0 14px 30px rgba(0,0,0,.30) !important;
}
.networks-compact-qr-actions{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:8px !important;
  width:100% !important;
}
.networks-compact-qrbox-v442 small{
  display:block !important;
  color:#9fb0c7 !important;
  font-size:10px !important;
  line-height:1.55 !important;
  text-align:center !important;
}
@media(max-width:900px){
  .general-settings-head-v441{flex-direction:column !important;}
  .general-settings-kpi-v441,.general-settings-grid-v441{grid-template-columns:1fr !important;}
  .network-summary-actions,.network-clean-actions,.device-toolbar-actions{display:grid !important;grid-template-columns:1fr !important;}
}
@media(max-width:760px){
  #net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 .ip-preset-buttons{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
/* V447_FIRST_DESIGN_PRO_UNIFIED_END */


/* V448_WIREGUARD_VERTICAL_MODE_SWITCH_START
   Make the WireGuard mode switch vertical (top-to-bottom) instead of horizontal.
   UI-only; no logic change.
*/
#net-tab-settings.network-settings-pro-v428 .wg-mode-switch-v448{
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-mode-switch-v448 .mode-btn{
  width:100% !important;
  min-height:50px !important;
  border-radius:0 !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-mode-switch-v448 .mode-btn + .mode-btn{
  border-top:1px solid rgba(148,163,184,.18) !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-mode-switch-v448 #modeEasy{
  order:1 !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-mode-switch-v448 #modeAdv{
  order:2 !important;
}
/* V448_WIREGUARD_VERTICAL_MODE_SWITCH_END */


/* V449_SETTINGS_ROUTES_LAYOUT_RESTORE_START
   Restore the good layout for Network Settings + Routing after V447 restored the first visual theme.
   This is scoped layout polish only; it does not alter APIs, IDs, JS handlers, or backend logic.
*/

/* ===== Network Settings screen: restore balanced grid, not tiny/compressed cards ===== */
#net-tab-settings.network-settings-pro-v428{
  max-width:1280px !important;
  margin-inline:auto !important;
}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid{
  display:grid !important;
  grid-template-columns:repeat(12,minmax(0,1fr)) !important;
  gap:18px !important;
  align-items:start !important;
}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card{
  min-width:0 !important;
  align-self:stretch !important;
  padding:22px !important;
  border-radius:24px !important;
  overflow:hidden !important;
}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1){
  grid-column:span 12 !important;
  order:1 !important;
}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .wg-plan-card-v434{
  grid-column:span 6 !important;
  order:2 !important;
}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .zt-plan-card-v434{
  grid-column:span 6 !important;
  order:3 !important;
}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(4){
  grid-column:span 4 !important;
  order:4 !important;
}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .bridge-panel-v434,
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(5){
  grid-column:span 8 !important;
  order:5 !important;
}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(6){
  grid-column:span 12 !important;
  order:6 !important;
}
#net-tab-settings.network-settings-pro-v428 .settings-panel-head{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:14px !important;
  padding-bottom:12px !important;
  margin-bottom:14px !important;
  border-bottom:1px solid rgba(148,163,184,.10) !important;
}
#net-tab-settings.network-settings-pro-v428 .settings-panel-head h3{
  margin:0 !important;
  line-height:1.35 !important;
}
#net-tab-settings.network-settings-pro-v428 .settings-panel-note{
  margin-top:5px !important;
  line-height:1.8 !important;
}

/* Make main details form readable and avoid weird narrow left/right controls. */
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:14px !important;
}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > div:nth-child(3),
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > div:nth-child(4),
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > div:nth-child(5),
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > div:nth-child(6),
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > button{
  grid-column:span 2 !important;
}
#net-tab-settings.network-settings-pro-v428 .input-glass,
#net-tab-settings.network-settings-pro-v428 select,
#net-tab-settings.network-settings-pro-v428 textarea{
  min-height:46px !important;
  border-radius:14px !important;
}
#net-tab-settings.network-settings-pro-v428 textarea#netPubKeyInput{
  min-height:78px !important;
}

/* WireGuard / ZeroTier address cards: two equal cards with clear internal layout. */
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434,
#net-tab-settings.network-settings-pro-v428 .zt-plan-card-v434{
  display:flex !important;
  flex-direction:column !important;
  min-height:0 !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-mode-switch-v448{
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  border-radius:16px !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-mode-switch-v448 .mode-btn{
  width:100% !important;
  min-height:48px !important;
  border-radius:0 !important;
}
#net-tab-settings.network-settings-pro-v428 #ipGridArea,
#net-tab-settings.network-settings-pro-v428 #ztIpGridArea{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:10px !important;
  min-height:0 !important;
  max-height:420px !important;
  overflow:auto !important;
  padding-inline-end:2px !important;
}
#net-tab-settings.network-settings-pro-v428 .ip-preset-group{
  width:100% !important;
  min-width:0 !important;
  border:1px solid rgba(59,130,246,.14) !important;
  background:rgba(15,23,42,.42) !important;
  border-radius:18px !important;
  padding:10px !important;
  overflow:hidden !important;
}
#net-tab-settings.network-settings-pro-v428 .ip-preset-head{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:10px !important;
  margin-bottom:8px !important;
  direction:rtl !important;
}
#net-tab-settings.network-settings-pro-v428 .ip-preset-head strong{
  color:#e2e8f0 !important;
  font-size:12px !important;
  font-weight:950 !important;
  white-space:nowrap !important;
}
#net-tab-settings.network-settings-pro-v428 .ip-preset-head small{
  color:#94a3b8 !important;
  font-size:10px !important;
  line-height:1.45 !important;
  text-align:left !important;
}
#net-tab-settings.network-settings-pro-v428 .ip-preset-buttons{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:8px !important;
}
#net-tab-settings.network-settings-pro-v428 #ipGridArea .ip-btn,
#net-tab-settings.network-settings-pro-v428 #ztIpGridArea .ip-btn{
  width:100% !important;
  min-width:0 !important;
  min-height:40px !important;
  height:40px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:14px !important;
  font-size:12px !important;
  font-weight:950 !important;
  direction:ltr !important;
  text-align:center !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
#net-tab-settings.network-settings-pro-v428 #netSettingsUpdateBaseBtn,
#net-tab-settings.network-settings-pro-v428 #netSettingsZtSaveBtn{
  margin-top:14px !important;
  width:100% !important;
  min-height:46px !important;
}

/* ===== Routing screen: restore compact professional layout ===== */
#net-tab-routes.mikrotik-routes-screen-v196{
  max-width:1280px !important;
  margin-inline:auto !important;
  overflow:visible !important;
}
#net-tab-routes .routing-add-card-v196{
  padding:18px !important;
  border-radius:24px !important;
}
#net-tab-routes .routing-card-head-v196{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 160px !important;
  align-items:start !important;
  gap:14px !important;
  margin-bottom:15px !important;
}
#net-tab-routes .route-add-main-btn-v196{
  width:100% !important;
  min-height:46px !important;
  border-radius:15px !important;
}
#net-tab-routes .routing-form-grid-v196{
  display:grid !important;
  grid-template-columns:1.1fr .95fr .95fr .85fr 1fr !important;
  gap:10px !important;
  align-items:end !important;
}
#net-tab-routes .route-field-v196{
  min-width:0 !important;
}
#net-tab-routes .route-field-v196 label{
  display:block !important;
  margin-bottom:6px !important;
  color:#a7bad4 !important;
  font-size:11px !important;
  font-weight:1000 !important;
}
#net-tab-routes .route-field-v196 input,
#net-tab-routes .route-field-v196 select{
  width:100% !important;
  min-height:44px !important;
  border-radius:14px !important;
  font-size:13px !important;
}
#net-tab-routes .route-field-picker-v433{
  grid-column:auto !important;
}
#net-tab-routes .route-via-help-v433{
  display:none !important;
}

/* MikroTik card should be balanced: form and script side-by-side on desktop. */
#net-tab-routes .mikrotik-pro-card-v238{
  border-radius:24px !important;
  overflow:hidden !important;
}
#net-tab-routes .mikrotik-hero-v238{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 190px !important;
  gap:16px !important;
  align-items:start !important;
}
#net-tab-routes .mikrotik-step-strip-v238{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:10px !important;
}
#net-tab-routes .mikrotik-layout-pro-v238,
#net-tab-routes .mikrotik-layout-v196{
  display:grid !important;
  grid-template-columns:minmax(360px,.95fr) minmax(430px,1.05fr) !important;
  gap:18px !important;
  align-items:start !important;
}
#net-tab-routes .mikrotik-form-grid-pro-v238,
#net-tab-routes .mikrotik-form-grid-v196{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:13px !important;
}
#net-tab-routes .mikrotik-script-textarea-v196{
  min-height:280px !important;
  max-height:420px !important;
}

/* Route toolbar/table readability */
#net-tab-routes .route-toolbar-v432{
  margin-top:16px !important;
  border-radius:24px !important;
}
#net-tab-routes .route-toolbar-head-v432{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  gap:16px !important;
  align-items:start !important;
}
#net-tab-routes .route-toolbar-actions-v432{
  display:flex !important;
  gap:8px !important;
  flex-wrap:wrap !important;
  justify-content:flex-end !important;
}
#net-tab-routes .route-stats-grid-v432{
  display:grid !important;
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  gap:8px !important;
}
#net-tab-routes .route-filters-v432{
  display:flex !important;
  gap:8px !important;
  flex-wrap:wrap !important;
  justify-content:flex-end !important;
}
#net-tab-routes table{
  width:100% !important;
  table-layout:auto !important;
}
#net-tab-routes th,
#net-tab-routes td{
  white-space:normal !important;
  vertical-align:middle !important;
}

/* Responsive */
@media(max-width:1180px){
  #net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .wg-plan-card-v434,
  #net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .zt-plan-card-v434,
  #net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(4),
  #net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .bridge-panel-v434,
  #net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(5){
    grid-column:span 12 !important;
  }
  #net-tab-routes .routing-form-grid-v196{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
  #net-tab-routes .mikrotik-layout-pro-v238,
  #net-tab-routes .mikrotik-layout-v196{
    grid-template-columns:1fr !important;
  }
}
@media(max-width:760px){
  #net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid{
    grid-template-columns:1fr !important;
  }
  #net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card,
  #net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .wg-plan-card-v434,
  #net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .zt-plan-card-v434{
    grid-column:1 / -1 !important;
  }
  #net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4{
    grid-template-columns:1fr !important;
  }
  #net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > *{
    grid-column:1 / -1 !important;
  }
  #net-tab-settings.network-settings-pro-v428 .ip-preset-buttons{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  #net-tab-routes .routing-card-head-v196,
  #net-tab-routes .mikrotik-hero-v238,
  #net-tab-routes .route-toolbar-head-v432{
    grid-template-columns:1fr !important;
  }
  #net-tab-routes .routing-form-grid-v196,
  #net-tab-routes .mikrotik-form-grid-pro-v238,
  #net-tab-routes .mikrotik-form-grid-v196,
  #net-tab-routes .route-stats-grid-v432{
    grid-template-columns:1fr !important;
  }
}
/* V449_SETTINGS_ROUTES_LAYOUT_RESTORE_END */


/* V450_WIREGUARD_PRO_CARD_AND_CUSTOM_IP_FIX_START
   Professional WireGuard card polish + reliable custom IP mode.
   Scope: WireGuard plan card only. No API/backend/handler changes.
*/
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434{
  position:relative !important;
  grid-column:span 6 !important;
  display:flex !important;
  flex-direction:column !important;
  min-height:0 !important;
  overflow:hidden !important;
  border-radius:26px !important;
  padding:22px !important;
  background:
    radial-gradient(circle at 16% 0%, rgba(59,130,246,.16), transparent 34%),
    linear-gradient(180deg, rgba(15,23,42,.92), rgba(5,11,23,.94)) !important;
  border:1px solid rgba(96,165,250,.22) !important;
  box-shadow:0 18px 48px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.04) !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434::before{
  content:"" !important;
  position:absolute !important;
  inset-inline-start:0 !important;
  top:0 !important;
  bottom:0 !important;
  width:4px !important;
  background:linear-gradient(180deg,#38bdf8,#2563eb,#14b8a6) !important;
  opacity:.95 !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 .section-chip{
  align-self:flex-start !important;
  min-height:30px !important;
  padding-inline:14px !important;
  border-color:rgba(56,189,248,.32) !important;
  background:rgba(14,165,233,.11) !important;
  color:#bfdbfe !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 .settings-panel-head{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  gap:14px !important;
  align-items:start !important;
  padding-bottom:14px !important;
  margin-bottom:16px !important;
  border-bottom:1px solid rgba(148,163,184,.12) !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 .settings-panel-head h3{
  font-size:22px !important;
  color:#eaf4ff !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 .settings-panel-note{
  color:#9fb3cd !important;
  max-width:520px !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 .settings-mini-badge{
  width:46px !important;
  height:46px !important;
  display:grid !important;
  place-items:center !important;
  border-radius:17px !important;
  background:linear-gradient(135deg,rgba(14,165,233,.18),rgba(37,99,235,.12)) !important;
  border:1px solid rgba(96,165,250,.28) !important;
  color:#bfdbfe !important;
}

/* professional top-to-bottom switch */
#net-tab-settings.network-settings-pro-v428 .wg-mode-switch-v448{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:8px !important;
  padding:8px !important;
  border-radius:20px !important;
  border:1px solid rgba(96,165,250,.22) !important;
  background:rgba(2,6,23,.36) !important;
  overflow:visible !important;
  margin-bottom:16px !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-mode-switch-v448 .mode-btn{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  min-height:48px !important;
  border-radius:15px !important;
  border:1px solid rgba(148,163,184,.12) !important;
  background:rgba(15,23,42,.64) !important;
  color:#9fb0c8 !important;
  font-weight:1000 !important;
  cursor:pointer !important;
  transition:.16s ease !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-mode-switch-v448 .mode-btn.active{
  background:linear-gradient(135deg,#2563eb,#38bdf8) !important;
  color:#ffffff !important;
  border-color:rgba(191,219,254,.40) !important;
  box-shadow:0 14px 30px rgba(37,99,235,.24) !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-mode-switch-v448 .mode-btn.inactive:hover{
  color:#e2e8f0 !important;
  border-color:rgba(96,165,250,.26) !important;
  background:rgba(30,41,59,.72) !important;
}

/* prepared ranges: one clean vertical stack; no side overflow */
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 #ipGridArea{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:12px !important;
  width:100% !important;
  max-width:100% !important;
  min-height:0 !important;
  max-height:430px !important;
  overflow:auto !important;
  padding:0 4px 4px 0 !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 #ipGridArea.hidden{
  display:none !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 .ip-preset-group{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  padding:12px !important;
  border-radius:20px !important;
  border:1px solid rgba(96,165,250,.18) !important;
  background:linear-gradient(180deg,rgba(15,23,42,.72),rgba(2,6,23,.34)) !important;
  overflow:hidden !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 .ip-preset-head{
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr) !important;
  gap:10px !important;
  align-items:center !important;
  margin-bottom:10px !important;
  direction:rtl !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 .ip-preset-head strong{
  font-size:12px !important;
  color:#f1f5f9 !important;
  font-weight:1000 !important;
  white-space:nowrap !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 .ip-preset-head small{
  color:#8fa2bc !important;
  font-size:10px !important;
  line-height:1.55 !important;
  white-space:normal !important;
  overflow-wrap:normal !important;
  word-break:normal !important;
  text-align:left !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 .ip-preset-buttons{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:9px !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 #ipGridArea .ip-btn{
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  height:42px !important;
  min-height:42px !important;
  border-radius:15px !important;
  font-size:12px !important;
  font-weight:1000 !important;
  direction:ltr !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 #ipGridArea .ip-btn.active{
  background:linear-gradient(135deg,#2563eb,#0ea5e9) !important;
  color:#ffffff !important;
  border-color:rgba(191,219,254,.46) !important;
}

/* custom IP area reliable and visible */
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 #ipAdvArea{
  width:100% !important;
  margin:0 0 14px !important;
  padding:14px !important;
  border-radius:20px !important;
  border:1px solid rgba(34,197,94,.22) !important;
  background:linear-gradient(180deg,rgba(6,78,59,.16),rgba(15,23,42,.54)) !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 #ipAdvArea.hidden{
  display:none !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 #ipAdvArea:not(.hidden){
  display:block !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 #netBaseIpInput{
  width:100% !important;
  min-height:52px !important;
  border-radius:16px !important;
  font-size:15px !important;
  font-weight:1000 !important;
  text-align:center !important;
  direction:ltr !important;
  color:#86efac !important;
  border-color:rgba(34,197,94,.28) !important;
  background:rgba(2,6,23,.52) !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 #netBaseIpInput:focus{
  border-color:#22c55e !important;
  box-shadow:0 0 0 4px rgba(34,197,94,.14) !important;
}
#net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 #netSettingsUpdateBaseBtn{
  margin-top:auto !important;
  min-height:52px !important;
  border-radius:18px !important;
  font-size:14px !important;
  font-weight:1000 !important;
  background:linear-gradient(135deg,#1d4ed8,#0ea5e9) !important;
  color:#fff !important;
  border:1px solid rgba(191,219,254,.34) !important;
  box-shadow:0 16px 34px rgba(14,165,233,.16) !important;
}

@media(max-width:760px){
  #net-tab-settings.network-settings-pro-v428 .wg-plan-card-v434 .ip-preset-buttons{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
/* V450_WIREGUARD_PRO_CARD_AND_CUSTOM_IP_FIX_END */


/* V451_OVERVIEW_BASICS_AND_RANGE_EXPANSION_START
   Restore the polished Network Overview and Basic Details layouts,
   and keep larger WG/ZT preset ranges visible.
*/

/* === network live overview === */
#net-tab-settings.network-settings-pro-v428 .network-settings-visual-map-v429{
  margin:0 0 18px !important;
  padding:18px 20px !important;
  border-radius:24px !important;
  border:1px solid rgba(14,165,233,.22) !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(14,165,233,.14), transparent 32%),
    radial-gradient(circle at 85% 18%, rgba(16,185,129,.12), transparent 28%),
    linear-gradient(145deg, rgba(15,23,42,.92), rgba(2,6,23,.86)) !important;
  box-shadow:0 20px 52px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.04) !important;
  overflow:hidden !important;
}
#net-tab-settings.network-settings-pro-v428 .network-visual-head-v429{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:14px !important;
  margin-bottom:16px !important;
}
#net-tab-settings.network-settings-pro-v428 .network-visual-kicker-v429{
  display:inline-flex !important;
  align-items:center !important;
  gap:6px !important;
  padding:6px 10px !important;
  border-radius:999px !important;
  border:1px solid rgba(59,130,246,.26) !important;
  background:rgba(37,99,235,.10) !important;
  color:#bfdbfe !important;
  font-size:11px !important;
  font-weight:900 !important;
  margin-bottom:8px !important;
}
#net-tab-settings.network-settings-pro-v428 .network-visual-head-v429 strong{
  display:block !important;
  font-size:22px !important;
  font-weight:950 !important;
  color:#f8fbff !important;
  margin-bottom:6px !important;
}
#net-tab-settings.network-settings-pro-v428 .network-visual-head-v429 p{
  margin:0 !important;
  max-width:760px !important;
  color:#9fb3cd !important;
  line-height:1.85 !important;
  font-size:13px !important;
}
#net-tab-settings.network-settings-pro-v428 .network-visual-actions-v429{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:8px !important;
  justify-content:flex-end !important;
}
#net-tab-settings.network-settings-pro-v428 .network-visual-actions-v429 button{
  min-height:40px !important;
  padding:0 14px !important;
  border-radius:14px !important;
  border:1px solid rgba(148,163,184,.20) !important;
  background:linear-gradient(180deg, rgba(30,41,59,.84), rgba(15,23,42,.88)) !important;
  color:#e5edf8 !important;
  font-weight:900 !important;
  transition:transform .14s ease, border-color .14s ease, filter .14s ease !important;
}
#net-tab-settings.network-settings-pro-v428 .network-visual-actions-v429 button:hover{
  transform:translateY(-1px) !important;
  border-color:rgba(96,165,250,.36) !important;
  filter:brightness(1.05) !important;
}
#net-tab-settings.network-settings-pro-v428 .network-visual-cards-v429{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:12px !important;
  margin-bottom:16px !important;
}
#net-tab-settings.network-settings-pro-v428 .network-visual-card-v429{
  display:grid !important;
  gap:8px !important;
  min-height:116px !important;
  padding:14px !important;
  border-radius:20px !important;
  border:1px solid rgba(148,163,184,.16) !important;
  background:linear-gradient(180deg, rgba(15,23,42,.78), rgba(2,6,23,.78)) !important;
}
#net-tab-settings.network-settings-pro-v428 .network-visual-card-v429 b{
  font-size:11px !important;
  letter-spacing:.06em !important;
  text-transform:uppercase !important;
  color:#93c5fd !important;
}
#net-tab-settings.network-settings-pro-v428 .network-visual-card-v429 strong{
  display:block !important;
  color:#f8fafc !important;
  font-size:22px !important;
  font-weight:950 !important;
  line-height:1.25 !important;
}
#net-tab-settings.network-settings-pro-v428 .network-visual-card-v429 small{
  display:block !important;
  color:#9fb3cd !important;
  line-height:1.7 !important;
  font-size:12px !important;
}
#net-tab-settings.network-settings-pro-v428 .network-visual-card-v429.is-ok{
  border-color:rgba(34,197,94,.24) !important;
  background:linear-gradient(180deg, rgba(6,78,59,.20), rgba(2,6,23,.82)) !important;
}
#net-tab-settings.network-settings-pro-v428 .network-visual-card-v429.is-warn{
  border-color:rgba(245,158,11,.24) !important;
  background:linear-gradient(180deg, rgba(120,53,15,.20), rgba(2,6,23,.82)) !important;
}
#net-tab-settings.network-settings-pro-v428 .network-visual-card-v429.is-bad{
  border-color:rgba(239,68,68,.24) !important;
  background:linear-gradient(180deg, rgba(127,29,29,.22), rgba(2,6,23,.82)) !important;
}
#net-tab-settings.network-settings-pro-v428 .network-visual-card-v429.is-muted{
  opacity:.92 !important;
}
#net-tab-settings.network-settings-pro-v428 .network-visual-tunnels-v429{
  display:grid !important;
  grid-template-columns:auto minmax(90px,1fr) auto minmax(90px,1fr) auto !important;
  align-items:center !important;
  gap:10px !important;
  direction:ltr !important;
}
#net-tab-settings.network-settings-pro-v428 .network-visual-tunnels-v429 .node{
  min-width:82px !important;
  min-height:40px !important;
  padding:0 12px !important;
  display:grid !important;
  place-items:center !important;
  border-radius:999px !important;
  border:1px solid rgba(148,163,184,.22) !important;
  background:rgba(15,23,42,.74) !important;
  color:#cbd5e1 !important;
  font-size:11px !important;
  font-weight:1000 !important;
}
#net-tab-settings.network-settings-pro-v428 .network-visual-tunnels-v429 .line{
  height:4px !important;
  border-radius:999px !important;
  background:linear-gradient(90deg, rgba(51,65,85,.92), rgba(100,116,139,.75)) !important;
  position:relative !important;
  overflow:hidden !important;
}
#net-tab-settings.network-settings-pro-v428 .network-visual-tunnels-v429 .line::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.38), transparent) !important;
  transform:translateX(-100%) !important;
  animation:networkLinePulseV429 2.4s linear infinite !important;
}
#net-tab-settings.network-settings-pro-v428 .network-visual-tunnels-v429 .node.is-ok{border-color:rgba(34,197,94,.40)!important;color:#bbf7d0!important;background:rgba(6,78,59,.35)!important;}
#net-tab-settings.network-settings-pro-v428 .network-visual-tunnels-v429 .line.is-ok{background:linear-gradient(90deg, rgba(22,163,74,.94), rgba(45,212,191,.70)) !important;}
#net-tab-settings.network-settings-pro-v428 .network-visual-tunnels-v429 .node.is-warn{border-color:rgba(245,158,11,.42)!important;color:#fde68a!important;background:rgba(120,53,15,.30)!important;}
#net-tab-settings.network-settings-pro-v428 .network-visual-tunnels-v429 .line.is-warn{background:linear-gradient(90deg, rgba(245,158,11,.92), rgba(251,191,36,.62)) !important;}
#net-tab-settings.network-settings-pro-v428 .network-visual-tunnels-v429 .node.is-bad{border-color:rgba(239,68,68,.42)!important;color:#fecaca!important;background:rgba(127,29,29,.32)!important;}
#net-tab-settings.network-settings-pro-v428 .network-visual-tunnels-v429 .line.is-bad{background:linear-gradient(90deg, rgba(220,38,38,.92), rgba(248,113,113,.62)) !important;}
@keyframes networkLinePulseV429{to{transform:translateX(100%);}}

/* === basic details form === */
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1){
  grid-column:span 12 !important;
}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:14px !important;
}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > div:nth-child(3),
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > div:nth-child(4),
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > div:nth-child(5),
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > div:nth-child(6),
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > button{
  grid-column:1 / -1 !important;
}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > div > label{
  display:block !important;
  margin-bottom:7px !important;
}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > div:nth-child(4) > div,
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > div:nth-child(5) > div,
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > div:nth-child(6) > div{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 70px !important;
  gap:10px !important;
  align-items:start !important;
}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > div:nth-child(4) button,
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > div:nth-child(5) button,
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > div:nth-child(6) button{
  width:70px !important;
  min-width:70px !important;
  min-height:44px !important;
  border-radius:14px !important;
  writing-mode:horizontal-tb !important;
  white-space:nowrap !important;
  word-break:keep-all !important;
  text-align:center !important;
  padding:0 10px !important;
}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > div:nth-child(6) textarea{
  min-height:98px !important;
}
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > button#netSettingsSaveBtn{
  min-height:48px !important;
  margin-top:4px !important;
}

@media (max-width: 1100px){
  #net-tab-settings.network-settings-pro-v428 .network-visual-cards-v429{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  #net-tab-settings.network-settings-pro-v428 .network-visual-head-v429{flex-direction:column !important;align-items:flex-start !important;}
}
@media (max-width: 760px){
  #net-tab-settings.network-settings-pro-v428 .network-visual-cards-v429{grid-template-columns:1fr !important;}
  #net-tab-settings.network-settings-pro-v428 .network-visual-tunnels-v429{grid-template-columns:1fr !important;}
  #net-tab-settings.network-settings-pro-v428 .network-visual-tunnels-v429 .line{height:36px !important;width:5px !important;justify-self:center !important;}
  #net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4{grid-template-columns:1fr !important;}
  #net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > *{grid-column:1 / -1 !important;}
  #net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > div:nth-child(4) > div,
  #net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > div:nth-child(5) > div,
  #net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > div:nth-child(6) > div{
    grid-template-columns:1fr !important;
  }
  #net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > div:nth-child(4) button,
  #net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > div:nth-child(5) button,
  #net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1) .space-y-4 > div:nth-child(6) button{
    width:100% !important;
  }
}
/* V451_OVERVIEW_BASICS_AND_RANGE_EXPANSION_END */


/* V454_FULL_PROJECT_REVIEW_TEST_COMPATIBILITY_START
   Full-project review compatibility layer.
   Earlier visual rollbacks restored the first design theme and newer scoped blocks (V447-V453),
   while legacy regression tests still verify the historical V429/V431/V432 marker names.
   This block preserves those regression anchors without changing runtime behavior.
*/
/* V429_NETWORK_SETTINGS_INTERACTIVE_UI_START */
#net-tab-settings.network-settings-pro-v428 .network-settings-visual-map-v429{--v454-v429-anchor:1;}
#net-tab-settings.network-settings-pro-v428 .network-visual-tunnels-v429{--v454-networkLinePulseV429-anchor:networkLinePulseV429;}
/* networkLinePulseV429 */
/* V429_NETWORK_SETTINGS_INTERACTIVE_UI_END */

/* V431_NETWORK_SETTINGS_VISUAL_LAYOUT_REBUILD_START */
#net-tab-settings.network-settings-pro-v428 #advancedSettingsGrid > .settings-stack-card:nth-child(1){--v454-v431-anchor:1;}
#net-tab-settings.network-settings-pro-v428 .net-validation-v431{--v454-validation-anchor:1;}
#net-tab-settings.network-settings-pro-v428 #netSettingsUpdateBaseBtn,
#net-tab-settings.network-settings-pro-v428 #netSettingsZtSaveBtn,
#net-tab-settings.network-settings-pro-v428 #deleteNetworkBtn{--v454-settings-action-anchor:1;}
/* V431_NETWORK_SETTINGS_VISUAL_LAYOUT_REBUILD_END */

/* V432_ROUTING_MIKROTIK_VISUAL_CLEANUP_START */
#net-tab-routes.mikrotik-routes-screen-v196{--v454-v432-anchor:1;}
#routeScreenToolbar.route-toolbar-v432{--v454-toolbar-anchor:1;}
/* V432_ROUTING_MIKROTIK_VISUAL_CLEANUP_END */
/* V454_FULL_PROJECT_REVIEW_TEST_COMPATIBILITY_END */


/* V456_SERVER_GENERAL_SETTINGS_REDESIGN_START
   Redesign server general settings: remove visual repetition, enlarge text/buttons,
   and make the settings landing page a professional navigation hub.
   UI-only: no API, DB, auth, or save logic changes.
*/
#view-superadmin.sa-v427-pro-settings,
#view-superadmin .v427-pro-settings{
  --v456-text:#f8fbff;
  --v456-muted:#a9b9cf;
  --v456-line:rgba(96,165,250,.20);
  --v456-panel:rgba(15,23,42,.82);
}

/* Bigger internal navigator */
#view-superadmin .sa-settings-page-header-v415{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  gap:18px !important;
  align-items:center !important;
  padding:20px 22px !important;
  border-radius:24px !important;
  border:1px solid rgba(96,165,250,.22) !important;
  background:linear-gradient(135deg,rgba(15,23,42,.92),rgba(2,8,23,.86)) !important;
  margin-bottom:16px !important;
}
#view-superadmin .sa-settings-page-kicker-v415{
  display:inline-flex !important;
  padding:6px 11px !important;
  border-radius:999px !important;
  color:#bfdbfe !important;
  background:rgba(37,99,235,.12) !important;
  border:1px solid rgba(96,165,250,.24) !important;
  font-size:12px !important;
  font-weight:950 !important;
}
#view-superadmin #saSettingsPageTitleV415{
  margin:8px 0 6px !important;
  font-size:30px !important;
  line-height:1.25 !important;
  color:#ffffff !important;
  font-weight:1000 !important;
}
#view-superadmin #saSettingsPageChecklistV415{
  margin:0 !important;
  color:#a9b9cf !important;
  font-size:15px !important;
  line-height:1.8 !important;
}
#view-superadmin .sa-settings-page-tools-v415{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:10px !important;
  justify-content:flex-end !important;
}
#view-superadmin .sa-settings-page-tools-v415 button,
#view-superadmin .sa-settings-page-index-v415{
  min-height:46px !important;
  padding:0 16px !important;
  border-radius:15px !important;
  font-size:14px !important;
  font-weight:950 !important;
}
#view-superadmin .sa-settings-page-tools-v415 button{
  background:linear-gradient(135deg,#1d4ed8,#0ea5e9) !important;
  color:#fff !important;
  border:1px solid rgba(191,219,254,.28) !important;
}

#view-superadmin .sa-settings-pager-v415{
  display:grid !important;
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  gap:12px !important;
  margin:0 0 14px !important;
}
#view-superadmin .sa-settings-group-v415{
  display:flex !important;
  flex-direction:column !important;
  gap:9px !important;
  padding:13px !important;
  border-radius:22px !important;
  border:1px solid rgba(148,163,184,.14) !important;
  background:linear-gradient(180deg,rgba(15,23,42,.78),rgba(2,6,23,.58)) !important;
}
#view-superadmin .sa-settings-group-head-v415 strong{
  display:block !important;
  color:#f8fafc !important;
  font-size:15px !important;
  font-weight:1000 !important;
  margin-bottom:3px !important;
}
#view-superadmin .sa-settings-group-head-v415 small{
  display:block !important;
  color:#9fb3cd !important;
  font-size:12px !important;
  line-height:1.55 !important;
}
#view-superadmin .sa-settings-group-buttons-v415{
  display:grid !important;
  gap:8px !important;
}
#view-superadmin .sa-settings-pager-v415 [data-sa-page-button]{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:10px !important;
  width:100% !important;
  min-height:48px !important;
  padding:0 14px !important;
  border-radius:15px !important;
  font-size:14px !important;
  font-weight:950 !important;
  text-align:right !important;
  color:#e5edf8 !important;
  background:rgba(15,23,42,.72) !important;
  border:1px solid rgba(148,163,184,.16) !important;
}
#view-superadmin .sa-settings-pager-v415 [data-sa-page-button]:hover{
  transform:translateY(-1px) !important;
  border-color:rgba(96,165,250,.34) !important;
  background:rgba(30,41,59,.80) !important;
}
#view-superadmin .sa-settings-pager-v415 [data-sa-page-button].active,
#view-superadmin .sa-settings-pager-v415 [data-sa-page-button].is-active{
  color:#fff !important;
  background:linear-gradient(135deg,#2563eb,#0ea5e9) !important;
  border-color:rgba(191,219,254,.36) !important;
  box-shadow:0 14px 30px rgba(37,99,235,.20) !important;
}
#view-superadmin .sa-page-icon{
  font-size:18px !important;
  line-height:1 !important;
}
#view-superadmin .sa-page-label{
  font-size:14px !important;
}

/* General settings landing page */
#view-superadmin .general-settings-hub-v456{
  padding:26px !important;
  border-radius:28px !important;
  border:1px solid rgba(96,165,250,.22) !important;
  background:
    radial-gradient(circle at 16% 0%,rgba(59,130,246,.16),transparent 32%),
    radial-gradient(circle at 85% 12%,rgba(20,184,166,.12),transparent 28%),
    linear-gradient(180deg,rgba(15,23,42,.90),rgba(2,6,23,.86)) !important;
  box-shadow:0 24px 62px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.04) !important;
}
#view-superadmin .general-settings-head-v456{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  gap:18px !important;
  align-items:start !important;
  margin-bottom:20px !important;
}
#view-superadmin .general-settings-head-v456 h3{
  margin:8px 0 8px !important;
  font-size:36px !important;
  line-height:1.25 !important;
  color:#fff !important;
  font-weight:1000 !important;
}
#view-superadmin .general-settings-head-v456 p{
  max-width:920px !important;
  color:#b5c4d8 !important;
  font-size:16px !important;
  line-height:1.95 !important;
}
#view-superadmin .general-settings-badges-v456{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:8px !important;
  justify-content:flex-end !important;
}
#view-superadmin .general-settings-badges-v456 span{
  min-height:36px !important;
  padding:0 13px !important;
  display:inline-flex !important;
  align-items:center !important;
  border-radius:999px !important;
  font-size:13px !important;
  font-weight:950 !important;
}
#view-superadmin .server-settings-summary-v456{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:12px !important;
  margin-bottom:20px !important;
}
#view-superadmin .server-settings-summary-v456 > div{
  padding:16px !important;
  border-radius:20px !important;
  border:1px solid rgba(96,165,250,.16) !important;
  background:rgba(15,23,42,.64) !important;
}
#view-superadmin .server-settings-summary-v456 strong{
  display:block !important;
  color:#93c5fd !important;
  font-size:32px !important;
  font-weight:1000 !important;
  line-height:1 !important;
}
#view-superadmin .server-settings-summary-v456 span{
  display:block !important;
  color:#cbd5e1 !important;
  margin-top:8px !important;
  font-size:14px !important;
  font-weight:850 !important;
}
#view-superadmin .server-settings-zones-v456{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:16px !important;
  margin-bottom:20px !important;
}
#view-superadmin .server-zone-v456{
  display:grid !important;
  grid-template-columns:58px minmax(0,1fr) !important;
  gap:15px !important;
  padding:18px !important;
  border-radius:24px !important;
  border:1px solid rgba(148,163,184,.16) !important;
  background:linear-gradient(180deg,rgba(15,23,42,.78),rgba(2,6,23,.58)) !important;
}
#view-superadmin .server-zone-v456.identity{border-color:rgba(59,130,246,.22)!important;}
#view-superadmin .server-zone-v456.comms{border-color:rgba(20,184,166,.22)!important;}
#view-superadmin .server-zone-v456.ops{border-color:rgba(245,158,11,.22)!important;}
#view-superadmin .server-zone-v456.governance{border-color:rgba(168,85,247,.22)!important;}
#view-superadmin .server-zone-icon-v456{
  width:58px !important;
  height:58px !important;
  display:grid !important;
  place-items:center !important;
  border-radius:20px !important;
  background:rgba(59,130,246,.12) !important;
  border:1px solid rgba(96,165,250,.22) !important;
  font-size:25px !important;
}
#view-superadmin .server-zone-body-v456 span{
  display:block !important;
  color:#93c5fd !important;
  font-size:13px !important;
  font-weight:1000 !important;
  margin-bottom:5px !important;
}
#view-superadmin .server-zone-body-v456 h4{
  margin:0 0 7px !important;
  color:#fff !important;
  font-size:22px !important;
  line-height:1.35 !important;
  font-weight:1000 !important;
}
#view-superadmin .server-zone-body-v456 p{
  margin:0 0 14px !important;
  color:#a9b9cf !important;
  font-size:15px !important;
  line-height:1.85 !important;
}
#view-superadmin .server-zone-actions-v456{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:9px !important;
}
#view-superadmin .server-zone-actions-v456 button,
#view-superadmin .server-settings-apply-grid-v456 button{
  min-height:48px !important;
  padding:0 16px !important;
  border-radius:15px !important;
  border:1px solid rgba(96,165,250,.22) !important;
  background:linear-gradient(135deg,rgba(37,99,235,.94),rgba(14,165,233,.88)) !important;
  color:#fff !important;
  font-size:14px !important;
  font-weight:1000 !important;
  cursor:pointer !important;
}
#view-superadmin .server-zone-actions-v456 button:hover,
#view-superadmin .server-settings-apply-grid-v456 button:hover{
  transform:translateY(-1px) !important;
  filter:brightness(1.05) !important;
}
#view-superadmin .server-settings-apply-v456{
  padding:18px !important;
  border-radius:24px !important;
  border:1px solid rgba(148,163,184,.16) !important;
  background:rgba(2,6,23,.36) !important;
  margin-bottom:16px !important;
}
#view-superadmin .server-settings-apply-head-v456{
  display:flex !important;
  align-items:flex-end !important;
  justify-content:space-between !important;
  gap:12px !important;
  margin-bottom:14px !important;
}
#view-superadmin .server-settings-apply-head-v456 span{
  color:#93c5fd !important;
  font-size:14px !important;
  font-weight:1000 !important;
}
#view-superadmin .server-settings-apply-head-v456 strong{
  color:#fff !important;
  font-size:20px !important;
  font-weight:1000 !important;
}
#view-superadmin .server-settings-apply-grid-v456{
  display:grid !important;
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  gap:10px !important;
}
#view-superadmin .server-settings-apply-grid-v456 button{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  justify-content:center !important;
  min-height:72px !important;
  text-align:right !important;
  background:rgba(15,23,42,.72) !important;
  border-color:rgba(148,163,184,.16) !important;
}
#view-superadmin .server-settings-apply-grid-v456 button b{
  display:block !important;
  color:#f8fafc !important;
  font-size:15px !important;
  line-height:1.35 !important;
}
#view-superadmin .server-settings-apply-grid-v456 button small{
  display:block !important;
  color:#9fb3cd !important;
  margin-top:5px !important;
  font-size:12px !important;
  line-height:1.4 !important;
}
#view-superadmin .general-settings-note-v456{
  font-size:15px !important;
  line-height:1.9 !important;
  padding:16px 18px !important;
  border-radius:20px !important;
}

/* make actual server settings panels more readable too */
#view-superadmin .sa-section-shell:not(.general-settings-hub-v456) h3,
#view-superadmin .sa-section-shell:not(.general-settings-hub-v456) h4{
  font-size:22px !important;
  line-height:1.4 !important;
}
#view-superadmin .sa-section-shell:not(.general-settings-hub-v456) p,
#view-superadmin .sa-section-shell:not(.general-settings-hub-v456) label,
#view-superadmin .sa-section-shell:not(.general-settings-hub-v456) small{
  font-size:14px !important;
  line-height:1.75 !important;
}
#view-superadmin .sa-section-shell input,
#view-superadmin .sa-section-shell select,
#view-superadmin .sa-section-shell textarea{
  min-height:46px !important;
  font-size:14px !important;
  border-radius:14px !important;
}
#view-superadmin .sa-section-shell button{
  min-height:44px !important;
  font-size:14px !important;
  border-radius:14px !important;
  font-weight:900 !important;
}

@media(max-width:1220px){
  #view-superadmin .sa-settings-pager-v415{grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
  #view-superadmin .server-settings-apply-grid-v456{grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
}
@media(max-width:900px){
  #view-superadmin .sa-settings-page-header-v415,
  #view-superadmin .general-settings-head-v456,
  #view-superadmin .server-settings-apply-head-v456{
    grid-template-columns:1fr !important;
    align-items:stretch !important;
  }
  #view-superadmin .server-settings-zones-v456,
  #view-superadmin .server-settings-summary-v456{
    grid-template-columns:1fr !important;
  }
  #view-superadmin .sa-settings-pager-v415,
  #view-superadmin .server-settings-apply-grid-v456{
    grid-template-columns:1fr !important;
  }
  #view-superadmin .server-zone-v456{
    grid-template-columns:1fr !important;
  }
}
/* V456_SERVER_GENERAL_SETTINGS_REDESIGN_END */

/* V2_WG_EDIT_SAME_AS_ZT_UI_START */
.wg-edit-modal-v2 .wg-edit-summary-v2{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;margin:10px 0 4px!important;}
.wg-edit-modal-v2 .wg-edit-summary-v2 span{background:rgba(15,23,42,.45)!important;border:1px solid rgba(96,165,250,.20)!important;border-radius:12px!important;padding:9px 10px!important;color:#cbd5e1!important;font-size:12px!important;font-weight:800!important;}
.wg-edit-modal-v2 textarea.input{min-height:82px!important;resize:vertical!important;line-height:1.55!important;}
body[data-it-theme="light"] .wg-edit-modal-v2 .wg-edit-summary-v2 span{background:#f8fafc!important;border-color:#cbd5e1!important;color:#0f172a!important;}
@media(max-width:760px){.wg-edit-modal-v2 .wg-edit-summary-v2{grid-template-columns:1fr!important;}}
/* V2_WG_EDIT_SAME_AS_ZT_UI_END */

/* V2_ZT_CARD_NO_QR_POLISH_START
   Remove the big QR block from network/ZeroTier cards and rebalance the card layout. */
.networks-compact-card .networks-compact-main{
  grid-template-columns:minmax(320px,1.45fr) repeat(3,minmax(135px,.55fr)) minmax(300px,1fr)!important;
  gap:26px!important;
  align-items:center!important;
}
.networks-compact-qrbox,
.networks-compact-qrbox-v442,
.network-inline-qr-actions-v418,
.network-clean-qr-actions-v418,
.network-qr-duplicate-v442{
  display:none!important;
}
.networks-compact-card{
  padding:26px 32px!important;
  border-radius:24px!important;
  background:
    radial-gradient(circle at 20% 10%,rgba(37,99,235,.16),transparent 35%),
    linear-gradient(135deg,rgba(11,20,38,.98),rgba(4,10,22,.94))!important;
  border-color:rgba(59,130,246,.26)!important;
  box-shadow:0 22px 55px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.05)!important;
}
.networks-compact-card:before{
  width:5px!important;
  background:linear-gradient(180deg,#22c55e,#14b8a6,#0ea5e9)!important;
  box-shadow:0 0 22px rgba(34,197,94,.55)!important;
}
.networks-compact-name{gap:16px!important;align-items:center!important;}
.networks-compact-name h3{font-size:24px!important;letter-spacing:.2px!important;}
.networks-compact-name p{font-size:13px!important;color:#8fb1da!important;margin-top:8px!important;}
.networks-compact-dot{width:13px!important;height:13px!important;box-shadow:0 0 0 7px rgba(34,197,94,.13),0 0 18px rgba(34,197,94,.55)!important;}
.networks-compact-mini{
  min-height:102px!important;
  padding:19px 20px!important;
  border-radius:21px!important;
  background:linear-gradient(180deg,rgba(15,35,65,.82),rgba(7,14,28,.80))!important;
  border:1px solid rgba(96,165,250,.25)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05)!important;
}
.networks-compact-mini span{font-size:13px!important;color:#a9bdd9!important;font-weight:900!important;}
.networks-compact-mini strong{font-size:26px!important;color:#f8fbff!important;margin-top:8px!important;}
.networks-compact-buttons{
  display:flex!important;
  justify-content:flex-start!important;
  gap:14px!important;
  flex-wrap:wrap!important;
}
.networks-compact-copy,.networks-compact-open{
  min-height:50px!important;
  border-radius:18px!important;
  padding:0 22px!important;
  font-size:14px!important;
  font-weight:950!important;
}
.networks-compact-open{
  background:linear-gradient(135deg,#2563eb,#0ea5e9)!important;
  color:white!important;
  border-color:rgba(125,211,252,.48)!important;
  min-width:92px!important;
  box-shadow:0 18px 36px rgba(14,165,233,.24)!important;
}
.networks-compact-sub{
  margin-top:24px!important;
  padding-top:18px!important;
  border-top:1px solid rgba(96,165,250,.16)!important;
  gap:18px!important;
  color:#a7b8d0!important;
  font-size:13.5px!important;
}
.networks-compact-sub span{display:inline-flex!important;align-items:center!important;gap:8px!important;}
@media(max-width:1250px){
  .networks-compact-card .networks-compact-main{grid-template-columns:minmax(0,1fr) repeat(3,minmax(110px,.45fr))!important;}
  .networks-compact-buttons{grid-column:1/-1!important;}
}
@media(max-width:760px){
  .networks-compact-card{padding:20px!important;}
  .networks-compact-card .networks-compact-main{grid-template-columns:1fr!important;gap:14px!important;}
  .networks-compact-mini{min-height:82px!important;}
  .networks-compact-buttons{display:grid!important;grid-template-columns:1fr!important;}
}
/* V2_ZT_CARD_NO_QR_POLISH_END */

/* V457_CORE_SIDEBAR_PULLMODE_QR_POLISH_START
   Stable desktop sidebar + professional WG/ZT QR cards. */
@media (min-width: 901px){
  #appView.app-shell:not(.hidden){
    display:grid!important;
    grid-template-columns:minmax(280px,310px) minmax(0,1fr)!important;
    align-items:start!important;
    gap:18px!important;
    width:min(100%,1460px)!important;
    max-width:1460px!important;
    min-height:100vh!important;
    overflow:visible!important;
  }
  #appView.app-shell > .app-sidebar{
    grid-column:1!important;
    position:sticky!important;
    top:16px!important;
    width:100%!important;
    min-width:0!important;
    max-width:310px!important;
    min-height:calc(100vh - 32px)!important;
    max-height:calc(100vh - 32px)!important;
    overflow:auto!important;
    overflow-x:hidden!important;
    display:flex!important;
    flex-direction:column!important;
    gap:14px!important;
    padding:16px!important;
    border-radius:28px!important;
    box-sizing:border-box!important;
  }
  #appView.app-shell > :not(.app-sidebar){
    grid-column:2!important;
    min-width:0!important;
    max-width:100%!important;
  }
  #appView.app-shell .sidebar-top,
  #appView.app-shell .sidebar-nav-wrap,
  #appView.app-shell .sidebar-nav{
    min-width:0!important;
    max-width:100%!important;
    overflow:visible!important;
  }
  #appView.app-shell .sidebar-brand,
  #appView.app-shell .sidebar-user-head,
  #appView.app-shell .nav-btn{
    min-width:0!important;
  }
  #appView.app-shell .sidebar-brand-copy,
  #appView.app-shell .sidebar-user-name,
  #appView.app-shell .nav-btn-copy{
    min-width:0!important;
    overflow:hidden!important;
  }
  #appView.app-shell .sidebar-brand-title,
  #appView.app-shell .sidebar-tagline,
  #appView.app-shell .sidebar-user-name,
  #appView.app-shell .nav-btn-copy strong,
  #appView.app-shell .nav-btn-copy small{
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
  #appView.app-shell.sidebar-collapsed,
  #appView.app-shell[data-sidebar-collapsed="1"]{
    grid-template-columns:92px minmax(0,1fr)!important;
  }
  #appView.app-shell.sidebar-collapsed > .app-sidebar,
  #appView.app-shell[data-sidebar-collapsed="1"] > .app-sidebar{
    max-width:92px!important;
  }
}
@media (max-width: 900px){
  #appView.app-shell:not(.hidden){
    display:block!important;
    max-width:100%!important;
    width:100%!important;
    overflow-x:hidden!important;
  }
}
.network-quick-card:not(.compact){
  grid-template-columns:minmax(0,1fr) minmax(320px,380px)!important;
  gap:18px!important;
}
.network-qr-stack-pro{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:14px!important;
  align-content:start!important;
  min-width:0!important;
}
.network-qr-service-card{
  min-height:0!important;
  padding:16px!important;
  border-style:solid!important;
  border-radius:24px!important;
  align-items:stretch!important;
  justify-content:flex-start!important;
  background:linear-gradient(180deg,rgba(8,19,36,.86),rgba(2,8,23,.72))!important;
  border-color:rgba(96,165,250,.18)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 18px 42px rgba(2,8,23,.26)!important;
}
.network-qr-wireguard-card{border-color:rgba(34,211,238,.24)!important;}
.network-qr-zerotier-card{border-color:rgba(124,58,237,.24)!important;}
.network-qr-card-title{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;
  font-size:12px;font-weight:950;color:#f8fafc;letter-spacing:.04em;
}
.network-qr-trust-badge{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:22px;padding:0 9px;border-radius:999px;
  background:rgba(34,197,94,.15);color:#86efac;border:1px solid rgba(34,197,94,.22);
  font-size:10px;font-weight:950;
}
.network-qr-trust-badge.zt{background:rgba(124,58,237,.15);color:#ddd6fe;border-color:rgba(124,58,237,.25);}
.network-service-qr-img{
  width:188px!important;height:188px!important;margin:6px auto 8px!important;border-radius:20px!important;
  background:#fff!important;padding:10px!important;box-shadow:0 14px 30px rgba(0,0,0,.35)!important;
  object-fit:contain!important;image-rendering:pixelated!important;
}
.network-zt-id-line{
  width:100%;min-height:36px;border-radius:14px;padding:9px 10px;margin:0 auto 6px;
  display:flex;align-items:center;justify-content:center;text-align:center;
  background:rgba(15,23,42,.72);border:1px solid rgba(148,163,184,.16);
  color:#e0e7ff;font-size:12px;font-weight:900;word-break:break-all;
}
.network-qr-share-btn{
  margin-top:8px!important;background:rgba(14,165,233,.18)!important;color:#bae6fd!important;border:1px solid rgba(14,165,233,.35)!important;
}
.network-qr-zerotier-card .network-qr-share-btn{background:rgba(124,58,237,.18)!important;color:#ddd6fe!important;border-color:rgba(124,58,237,.35)!important;}
.network-qr-service-card .qr-download-panel{
  display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;
  gap:8px!important;min-height:255px!important;padding:14px!important;border-radius:22px!important;
}
.networks-compact-buttons{align-items:center!important;}
.networks-compact-buttons .networks-compact-copy[data-qr-invite],
.networks-compact-buttons .networks-compact-copy[data-qr-zt]{
  background:linear-gradient(135deg,rgba(14,165,233,.20),rgba(99,102,241,.16))!important;
  border-color:rgba(125,211,252,.28)!important;
  color:#dff7ff!important;
}
.networks-compact-buttons .networks-compact-copy[data-qr-zt]{
  background:linear-gradient(135deg,rgba(124,58,237,.20),rgba(59,130,246,.14))!important;
  border-color:rgba(196,181,253,.28)!important;
  color:#f0e9ff!important;
}
@media (max-width:1279px){
  .network-quick-card:not(.compact){grid-template-columns:1fr!important;}
  .network-qr-stack-pro{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media (max-width:760px){
  .network-qr-stack-pro{grid-template-columns:1fr!important;}
  .network-service-qr-img{width:168px!important;height:168px!important;}
}
/* V457_CORE_SIDEBAR_PULLMODE_QR_POLISH_END */


/* V458_NETWORK_COMPACT_CARD_OVERFLOW_FIX_START
   Fix network list card breakage after adding QR actions.
   Keep five real grid items only: name + three metrics + actions.
   Actions never overflow outside the card, and labels stay readable in RTL/LTR. */
.networks-compact-card{
  max-width:100%!important;
  overflow:hidden!important;
  contain:paint!important;
}
.networks-compact-card .networks-compact-main{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  display:grid!important;
  grid-template-columns:minmax(280px,1.25fr) repeat(3,minmax(118px,.38fr)) minmax(300px,.95fr)!important;
  gap:12px!important;
  align-items:center!important;
}
.networks-compact-card .networks-compact-name,
.networks-compact-card .networks-compact-mini,
.networks-compact-card .networks-compact-buttons{
  min-width:0!important;
  max-width:100%!important;
}
.networks-compact-card .networks-compact-buttons{
  width:100%!important;
  justify-self:stretch!important;
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:7px!important;
  align-items:stretch!important;
  justify-content:stretch!important;
  overflow:hidden!important;
}
.networks-compact-card .networks-compact-copy,
.networks-compact-card .networks-compact-open{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  min-height:38px!important;
  padding:0 10px!important;
  border-radius:13px!important;
  font-size:12px!important;
  line-height:1.15!important;
  white-space:normal!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.networks-compact-card .networks-compact-open{
  grid-column:1 / -1!important;
  max-width:120px!important;
  justify-self:center!important;
}
.networks-compact-card .networks-compact-sub{
  width:100%!important;
  max-width:100%!important;
  overflow:hidden!important;
}
.networks-compact-card .networks-compact-sub span{
  min-width:0!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
@media(max-width:1280px){
  .networks-compact-card .networks-compact-main{
    grid-template-columns:minmax(240px,1.2fr) repeat(3,minmax(104px,.35fr)) minmax(260px,.85fr)!important;
    gap:10px!important;
  }
  .networks-compact-card .networks-compact-copy,
  .networks-compact-card .networks-compact-open{font-size:11px!important;padding-inline:8px!important;}
}
@media(max-width:1080px){
  .networks-compact-card .networks-compact-main{grid-template-columns:1fr repeat(3,minmax(92px,120px))!important;}
  .networks-compact-card .networks-compact-name{grid-column:1 / -1!important;}
  .networks-compact-card .networks-compact-buttons{grid-column:1 / -1!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;}
  .networks-compact-card .networks-compact-open{grid-column:auto!important;max-width:none!important;}
}
@media(max-width:760px){
  .networks-compact-card .networks-compact-main{grid-template-columns:1fr!important;}
  .networks-compact-card .networks-compact-buttons{grid-template-columns:1fr 1fr!important;}
  .networks-compact-card .networks-compact-open{grid-column:1 / -1!important;max-width:140px!important;}
}
@media(max-width:420px){
  .networks-compact-card .networks-compact-buttons{grid-template-columns:1fr!important;}
  .networks-compact-card .networks-compact-open{max-width:none!important;}
}
/* V458_NETWORK_COMPACT_CARD_OVERFLOW_FIX_END */

/* V462: delivery log readability for backup/email notifications */
.notification-history-table th,
.notification-history-table td{
  vertical-align: top;
}
.notification-message-cell{
  max-width: 460px;
  max-height: 4.8rem;
  overflow: hidden;
  white-space: pre-wrap;
  line-height: 1.45;
}
@media (max-width: 900px){
  .notification-history-table .notification-message-cell{
    max-width: 100%;
  }
}

/* V552_ZTNET_RECONNECT_WEB_AUTO_TEST_START */
.zt-reconnect-test-box{border-color:rgba(245,158,11,.28);background:linear-gradient(180deg,rgba(15,23,42,.56),rgba(15,23,42,.34))}
.light .zt-reconnect-test-box{background:#fffaf0;border-color:#f5d49b}
.zt-reconnect-phase{display:flex;flex-direction:column;gap:5px;padding:11px 12px;margin-bottom:10px;border-radius:13px;border:1px solid rgba(148,163,184,.2);background:rgba(30,41,59,.45)}
.zt-reconnect-phase strong{font-weight:950;color:#e2e8f0}
.zt-reconnect-phase span{font-size:.84rem;color:#a9b7ca;line-height:1.7}
.zt-reconnect-phase.ok{border-color:rgba(34,197,94,.3);background:rgba(34,197,94,.09)}
.zt-reconnect-phase.warn{border-color:rgba(245,158,11,.3);background:rgba(245,158,11,.09)}
.zt-reconnect-phase.bad{border-color:rgba(239,68,68,.3);background:rgba(239,68,68,.09)}
.light .zt-reconnect-phase{background:#f8fafc}
.light .zt-reconnect-phase strong{color:#0f172a}
.light .zt-reconnect-phase span{color:#475569}
.zt-reconnect-findings{margin-top:8px}
.zt-reconnect-test-box a.row-btn{text-decoration:none}
@media(max-width:760px){.zt-reconnect-test-box .zt-action-row>*{width:100%;justify-content:center}}
/* V552_ZTNET_RECONNECT_WEB_AUTO_TEST_END */


/* V625_ZEROTIER_ACTION_VISIBILITY_AND_VIRTUAL_HEIGHT_FIX_START
   Fixes the clipped lower action buttons shown in the devices screenshot.
   All secondary actions remain available in the "الأوامر" modal. */
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro,
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-zerotier,
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik,
:where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-row-pending{
  height:152px!important;
  min-height:152px!important;
  max-height:152px!important;
  overflow:hidden!important;
}
:where(#net-tab-devices,#view-devices) .device-row-cell.cell-actions{
  min-width:0!important;
  overflow:visible!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished.is-zerotier-actions{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  grid-auto-rows:30px!important;
  gap:5px!important;
  width:100%!important;
  height:auto!important;
  max-height:none!important;
  overflow:visible!important;
  align-content:center!important;
  align-items:stretch!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished.is-zerotier-actions .row-btn{
  width:100%!important;
  min-width:0!important;
  min-height:30px!important;
  height:30px!important;
  padding:5px 6px!important;
  font-size:10px!important;
  line-height:1!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
:where(#net-tab-devices,#view-devices) .row-actions.polished.is-zerotier-actions .device-more-actions-btn{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
}
@supports (content-visibility:auto){
  :where(#net-tab-devices,#view-devices) .device-virtual-row{contain-intrinsic-size:152px!important;}
}
@media(max-width:1260px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro,
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-zerotier,
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik,
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-row-pending{
    height:178px!important;min-height:178px!important;max-height:178px!important;
  }
  :where(#net-tab-devices,#view-devices) .row-actions.polished.is-zerotier-actions{
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
  }
  @supports (content-visibility:auto){
    :where(#net-tab-devices,#view-devices) .device-virtual-row{contain-intrinsic-size:178px!important;}
  }
}
@media(max-width:760px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro,
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-zerotier,
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik,
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-row-pending{
    height:280px!important;min-height:280px!important;max-height:280px!important;
  }
  :where(#net-tab-devices,#view-devices) .row-actions.polished.is-zerotier-actions{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  @supports (content-visibility:auto){
    :where(#net-tab-devices,#view-devices) .device-virtual-row{contain-intrinsic-size:280px!important;}
  }
}
@media(max-width:420px){
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro,
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-zerotier,
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-kind-mikrotik,
  :where(#net-tab-devices,#view-devices) .device-row.device-row-pro.device-row-pending{
    height:310px!important;min-height:310px!important;max-height:310px!important;
  }
  @supports (content-visibility:auto){
    :where(#net-tab-devices,#view-devices) .device-virtual-row{contain-intrinsic-size:310px!important;}
  }
}
/* V625_ZEROTIER_ACTION_VISIBILITY_AND_VIRTUAL_HEIGHT_FIX_END */

/* V630 ZTNet branch compact actions */
.zt-command-menu{position:relative;display:inline-block}
.zt-command-menu>summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.zt-command-menu>summary::-webkit-details-marker{display:none}
.zt-command-menu-panel{position:absolute;z-index:120;inset-inline-end:0;top:calc(100% + 8px);min-width:230px;padding:10px;display:grid;gap:8px;background:var(--card-bg,#111827);border:1px solid rgba(148,163,184,.28);border-radius:14px;box-shadow:0 18px 45px rgba(0,0,0,.35)}
.zt-command-menu-panel .row-btn{width:100%;justify-content:center}
.zt-action-row-primary{align-items:flex-start}
.zt-action-row button:disabled{opacity:.45;cursor:not-allowed;filter:grayscale(.45)}
.zt-check-label{display:flex!important;align-items:center;gap:8px;min-height:42px}
.zt-check-label input{width:auto!important;margin:0}
@media (max-width:720px){.zt-command-menu{width:100%}.zt-command-menu>summary{width:100%}.zt-command-menu-panel{position:static;margin-top:8px;min-width:0;width:100%}}

/* V632 immediate action and pending config states */
.v632-action-pending{opacity:.72;cursor:progress!important;position:relative}
.v632-action-pending::after{content:'…';margin-inline-start:.35rem}
.v632-card-pending{outline:1px solid rgba(245,158,11,.75);box-shadow:0 0 0 3px rgba(245,158,11,.12)}
[data-config-pending="true"],.config-pending-v632{border-inline-start:4px solid #f59e0b!important}

/* V639_SD_WAN_PERFORMANCE_GUARD_START */
.sdwan-guard-card-v639{
  margin:16px 0;
  border:1px solid rgba(59,130,246,.34);
  border-radius:18px;
  background:linear-gradient(145deg,rgba(7,18,38,.96),rgba(10,31,62,.9));
  box-shadow:0 14px 38px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.05);
  overflow:hidden;
}
.sdwan-guard-card-v639>summary{
  cursor:pointer;
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:15px 18px;
  background:linear-gradient(90deg,rgba(37,99,235,.18),rgba(14,165,233,.05));
}
.sdwan-guard-card-v639>summary::-webkit-details-marker{display:none}
.sdwan-guard-card-v639>summary span{display:flex;flex-direction:column;gap:3px}
.sdwan-guard-card-v639>summary b{font-size:16px;color:#f8fbff}
.sdwan-guard-card-v639>summary small{font-size:11px;color:#9db4d4}
.sdwan-guard-card-v639>summary em{
  font-style:normal;
  font-weight:800;
  color:#dbeafe;
  background:rgba(37,99,235,.3);
  border:1px solid rgba(96,165,250,.35);
  border-radius:999px;
  padding:5px 10px;
}
.sdwan-guard-body-v639{padding:16px 18px 18px}
.sdwan-guard-body-v639>p{margin:0 0 14px;color:#b7c8df;line-height:1.8;font-size:13px}
.sdwan-input-grid-v639{
  display:grid;
  grid-template-columns:repeat(4,minmax(150px,1fr));
  gap:10px;
}
.sdwan-input-grid-v639 label{
  display:flex;
  flex-direction:column;
  gap:7px;
  color:#cbdaf0;
  font-size:11px;
  font-weight:700;
}
.sdwan-input-grid-v639 input{
  width:100%;
  border:1px solid rgba(148,163,184,.24);
  border-radius:10px;
  background:rgba(2,9,22,.74);
  color:#f8fafc;
  padding:10px 11px;
  outline:none;
}
.sdwan-input-grid-v639 input:focus{border-color:rgba(96,165,250,.72);box-shadow:0 0 0 3px rgba(59,130,246,.12)}
.sdwan-actions-v639{margin-top:14px;flex-wrap:wrap}
.sdwan-results-v639{
  margin-top:14px;
  border:1px solid rgba(148,163,184,.18);
  border-radius:14px;
  padding:13px;
  background:rgba(2,8,20,.64);
}
.sdwan-result-head-v639{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;margin-bottom:11px}
.sdwan-result-head-v639.ok{background:rgba(16,185,129,.12);border:1px solid rgba(16,185,129,.25)}
.sdwan-result-head-v639.warn{background:rgba(245,158,11,.12);border:1px solid rgba(245,158,11,.25)}
.sdwan-result-head-v639.bad{background:rgba(239,68,68,.13);border:1px solid rgba(239,68,68,.28)}
.sdwan-result-head-v639 b{color:#f8fafc;font-size:13px}
.sdwan-result-head-v639 small{color:#a9bdd8;font-size:11px}
.sdwan-metric-grid-v639{display:grid;grid-template-columns:repeat(4,minmax(130px,1fr));gap:8px}
.sdwan-metric-grid-v639 span{display:flex;flex-direction:column;gap:5px;min-height:65px;padding:10px;border-radius:10px;background:rgba(15,31,55,.72);border:1px solid rgba(148,163,184,.13)}
.sdwan-metric-grid-v639 small{color:#8ea6c7;font-size:10px}
.sdwan-metric-grid-v639 b{color:#eef6ff;font-size:12px;overflow-wrap:anywhere}
.sdwan-findings-v639{display:grid;gap:7px;margin-top:11px}
.sdwan-verdict-v639{margin-top:11px;padding:11px 12px;border-radius:10px;font-size:12px;font-weight:700;line-height:1.7}
.sdwan-verdict-v639.ok{background:rgba(16,185,129,.1);color:#b8f7df}
.sdwan-verdict-v639.warn{background:rgba(245,158,11,.12);color:#fde7a9}
.sdwan-verdict-v639.bad{background:rgba(239,68,68,.13);color:#fecaca}
.sdwan-safety-v639{margin-top:12px;padding:10px 12px;border-radius:10px;background:rgba(15,23,42,.72);color:#aebfd7;font-size:11px;line-height:1.7}
.sdwan-safety-v639 b{color:#dbeafe}
@media (max-width:1100px){.sdwan-input-grid-v639,.sdwan-metric-grid-v639{grid-template-columns:repeat(2,minmax(140px,1fr))}}
@media (max-width:620px){.sdwan-input-grid-v639,.sdwan-metric-grid-v639{grid-template-columns:1fr}.sdwan-result-head-v639{align-items:flex-start;flex-direction:column}.sdwan-guard-body-v639{padding:13px}.sdwan-guard-card-v639>summary{padding:13px}}
/* V639_SD_WAN_PERFORMANCE_GUARD_END */


/* V641_DEVICE_CONSOLE_FRESH_START
   Device-management-first layout. Existing actions and detailed mode remain available. */
#net-tab-devices .device-toolbar{
  position:sticky!important;top:8px!important;z-index:24!important;
  display:grid!important;grid-template-columns:minmax(280px,1fr) minmax(0,auto)!important;
  gap:10px!important;padding:10px!important;margin-bottom:12px!important;
  border:1px solid rgba(100,116,139,.20)!important;border-radius:18px!important;
  backdrop-filter:blur(14px)!important;
}
#net-tab-devices .device-toolbar-actions-v641{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:7px!important;flex-wrap:wrap!important;}
#net-tab-devices .device-toolbar-select{
  min-height:36px!important;padding:6px 28px 6px 10px!important;border-radius:10px!important;
  border:1px solid rgba(100,116,139,.30)!important;background:rgba(15,23,42,.78)!important;color:#e2e8f0!important;
  font-size:11px!important;font-weight:800!important;outline:none!important;
}
body[data-it-theme="light"] #net-tab-devices .device-toolbar-select{background:#fff!important;color:#0f172a!important;border-color:rgba(71,85,105,.28)!important;}
#net-tab-devices .device-density-switch{display:inline-flex!important;align-items:center!important;padding:3px!important;border-radius:11px!important;background:rgba(100,116,139,.14)!important;border:1px solid rgba(100,116,139,.18)!important;}
#net-tab-devices .device-density-btn{border:0!important;background:transparent!important;color:#94a3b8!important;min-height:29px!important;padding:5px 9px!important;border-radius:8px!important;font-size:10px!important;font-weight:900!important;cursor:pointer!important;}
#net-tab-devices .device-density-btn.active{background:#2563eb!important;color:#fff!important;box-shadow:0 4px 12px rgba(37,99,235,.24)!important;}
#net-tab-devices .device-view-freeze-v647{min-height:36px!important;padding:6px 10px!important;border-radius:10px!important;border:1px solid rgba(245,158,11,.32)!important;background:rgba(245,158,11,.10)!important;color:#fcd34d!important;font-size:11px!important;font-weight:900!important;cursor:pointer!important;white-space:nowrap!important;}
#net-tab-devices .device-view-freeze-v647:not(.active){border-color:rgba(34,197,94,.32)!important;background:rgba(34,197,94,.10)!important;color:#86efac!important;}
#net-tab-devices .device-secondary-tool-v641{margin-top:18px!important;opacity:.93;}
#net-tab-devices .device-list-first-v641{min-height:120px;}
#net-tab-devices .device-load-more-v641{display:flex;justify-content:center;padding:12px 0 2px;}

/* Compact mode: one operational row, no information loss because Details/Commands stay available. */
#net-tab-devices .active-devices-section.device-density-compact{padding:12px!important;border-radius:18px!important;}
#net-tab-devices .device-density-compact .active-devices-head{margin-bottom:6px!important;padding-bottom:7px!important;}
#net-tab-devices .device-density-compact .device-row.device-row-pro{
  grid-template-columns:minmax(280px,1.45fr) minmax(180px,.72fr) minmax(180px,.72fr) minmax(245px,.92fr)!important;
  min-height:92px!important;height:92px!important;padding:8px 10px!important;gap:8px!important;border-radius:14px!important;
}
#net-tab-devices .device-density-compact .device-main{gap:8px!important;align-items:center!important;}
#net-tab-devices .device-density-compact .device-health-dot{width:10px!important;height:10px!important;flex-basis:10px!important;}
#net-tab-devices .device-density-compact .device-name{font-size:14px!important;}
#net-tab-devices .device-density-compact .device-subtitle{display:none!important;}
#net-tab-devices .device-density-compact .device-subline{margin-top:4px!important;gap:4px!important;max-height:24px!important;overflow:hidden!important;}
#net-tab-devices .device-density-compact .device-subline .mini-tag:nth-child(n+4),
#net-tab-devices .device-density-compact .device-diagnosis-chip{display:none!important;}
#net-tab-devices .device-density-compact :where(.mini-tag,.path-pill,.device-status-label-v127){min-height:20px!important;padding:3px 6px!important;font-size:9px!important;}
#net-tab-devices .device-density-compact .device-metric-list.refined,
#net-tab-devices .device-density-compact .device-status-card.refined{padding:7px 8px!important;border-radius:12px!important;min-height:0!important;justify-content:center!important;}
#net-tab-devices .device-density-compact .device-metric-line.metric-primary{margin:0!important;}
#net-tab-devices .device-density-compact .managed-pill{min-height:30px!important;padding:4px 7px!important;border-radius:10px!important;}
#net-tab-devices .device-density-compact .managed-pill .mono{font-size:11px!important;}
#net-tab-devices .device-density-compact .latency-pill{min-width:40px!important;min-height:20px!important;padding:3px 5px!important;font-size:9px!important;}
#net-tab-devices .device-density-compact .device-metric-grid.compact{display:none!important;}
#net-tab-devices .device-density-compact .device-status-top.refined{margin:0 0 4px!important;gap:4px!important;flex-wrap:nowrap!important;}
#net-tab-devices .device-density-compact .status-quality{min-height:20px!important;padding:3px 6px!important;font-size:9px!important;white-space:nowrap!important;}
#net-tab-devices .device-density-compact .status-summary{font-size:10px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
#net-tab-devices .device-density-compact .time-stack.compact.refined{display:block!important;}
#net-tab-devices .device-density-compact .time-stack.compact.refined span{min-height:22px!important;padding:3px 5px!important;border-radius:8px!important;display:flex!important;justify-content:space-between!important;gap:5px!important;}
#net-tab-devices .device-density-compact .time-stack.compact.refined span:nth-child(n+2){display:none!important;}
#net-tab-devices .device-density-compact .time-stack.compact.refined strong,
#net-tab-devices .device-density-compact .time-stack.compact.refined em{font-size:9px!important;}
#net-tab-devices .device-density-compact .row-actions.polished{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:4px!important;}
#net-tab-devices .device-density-compact .row-actions.polished .row-btn{min-height:28px!important;padding:4px 5px!important;border-radius:9px!important;font-size:9px!important;}

@media(max-width:1260px){
  #net-tab-devices .device-toolbar{position:relative!important;top:auto!important;grid-template-columns:1fr!important;}
  #net-tab-devices .device-toolbar-actions-v641{justify-content:flex-start!important;}
  #net-tab-devices .device-density-compact .device-row.device-row-pro{grid-template-columns:minmax(250px,1.3fr) minmax(170px,.8fr) minmax(180px,.8fr)!important;min-height:114px!important;height:114px!important;}
  #net-tab-devices .device-density-compact .device-row-cell.cell-actions{grid-column:1/-1!important;}
}
@media(max-width:760px){
  #net-tab-devices .device-toolbar-actions-v641{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important;}
  #net-tab-devices .device-toolbar-actions-v641>*{width:100%!important;}
  #net-tab-devices .device-density-switch{display:grid!important;grid-template-columns:1fr 1fr!important;}
  #net-tab-devices .device-density-compact .device-row.device-row-pro{grid-template-columns:1fr 1fr!important;min-height:196px!important;height:196px!important;padding:8px!important;}
  #net-tab-devices .device-density-compact .cell-identity{grid-column:1/-1!important;}
  #net-tab-devices .device-density-compact .cell-actions{grid-column:1/-1!important;}
}
@media(max-width:420px){
  #net-tab-devices .device-density-compact .device-row.device-row-pro{grid-template-columns:1fr!important;min-height:226px!important;height:226px!important;}
  #net-tab-devices .device-density-compact .cell-network,#net-tab-devices .device-density-compact .cell-status{min-height:44px!important;}
}
/* V641_DEVICE_CONSOLE_FRESH_END */

/* V642_DEVICE_OPERATIONS_CONSOLE_START
   Operations-first device console: saved views, quick presets, multi-select and bulk tools. */
#net-tab-devices .device-ops-console-v642{
  display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;
  margin:-2px 0 12px;padding:9px 10px;border-radius:15px;
  border:1px solid rgba(100,116,139,.18);background:rgba(15,23,42,.52);backdrop-filter:blur(10px);
}
body[data-it-theme="light"] #net-tab-devices .device-ops-console-v642{background:rgba(248,250,252,.96);border-color:rgba(71,85,105,.18)}
#net-tab-devices .device-quick-views-v642,#net-tab-devices .device-saved-views-v642{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-width:0}
#net-tab-devices .device-ops-label-v642{font-size:10px;font-weight:900;color:#94a3b8;padding-inline:3px}
#net-tab-devices .device-ops-chip-v642{
  appearance:none;border:1px solid rgba(100,116,139,.25);background:rgba(30,41,59,.68);color:#cbd5e1;
  border-radius:999px;min-height:30px;padding:5px 10px;font-size:10px;font-weight:900;cursor:pointer;white-space:nowrap;
}
#net-tab-devices .device-ops-chip-v642:hover{border-color:rgba(59,130,246,.5);color:#fff}
#net-tab-devices .device-ops-chip-v642.active{background:rgba(37,99,235,.92);border-color:rgba(96,165,250,.75);color:#fff;box-shadow:0 5px 14px rgba(37,99,235,.18)}
body[data-it-theme="light"] #net-tab-devices .device-ops-chip-v642{background:#fff;color:#475569;border-color:rgba(71,85,105,.22)}
body[data-it-theme="light"] #net-tab-devices .device-ops-chip-v642.active{background:#2563eb;color:#fff;border-color:#2563eb}
#net-tab-devices .device-last-refresh-v642{font-size:9px;font-weight:800;color:#7f93b0;white-space:nowrap;padding-inline:3px}

#net-tab-devices .device-bulk-bar-v642{
  position:sticky;top:78px;z-index:23;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;
  margin:0 0 12px;padding:10px 12px;border-radius:15px;border:1px solid rgba(59,130,246,.32);
  background:rgba(15,32,58,.94);box-shadow:0 10px 30px rgba(2,6,23,.16);backdrop-filter:blur(14px);
}
#net-tab-devices .device-bulk-bar-v642.hidden{display:none!important}
body[data-it-theme="light"] #net-tab-devices .device-bulk-bar-v642{background:rgba(239,246,255,.97);border-color:rgba(37,99,235,.28)}
#net-tab-devices .device-bulk-summary-v642{display:flex;align-items:baseline;gap:6px;color:#cbd5e1}
#net-tab-devices .device-bulk-summary-v642 strong{font-size:18px;color:#60a5fa}
#net-tab-devices .device-bulk-summary-v642 span{font-size:10px;font-weight:900}
body[data-it-theme="light"] #net-tab-devices .device-bulk-summary-v642{color:#334155}
#net-tab-devices .device-bulk-actions-v642{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
#net-tab-devices .device-bulk-actions-v642 .network-clean-secondary{min-height:31px;padding:5px 9px;font-size:9px}
#net-tab-devices .device-bulk-actions-v642 .network-clean-secondary.success{border-color:rgba(16,185,129,.35);color:#a7f3d0}
#net-tab-devices .device-bulk-actions-v642 .network-clean-secondary.warning{border-color:rgba(245,158,11,.4);color:#fde68a}
#net-tab-devices .device-bulk-actions-v642 .network-clean-secondary.danger{border-color:rgba(239,68,68,.4);color:#fecaca}
body[data-it-theme="light"] #net-tab-devices .device-bulk-actions-v642 .network-clean-secondary.success{color:#047857}
body[data-it-theme="light"] #net-tab-devices .device-bulk-actions-v642 .network-clean-secondary.warning{color:#b45309}
body[data-it-theme="light"] #net-tab-devices .device-bulk-actions-v642 .network-clean-secondary.danger{color:#b91c1c}

#net-tab-devices .device-select-control-v642{display:inline-flex;align-items:center;justify-content:center;flex:0 0 22px;width:22px;height:22px;cursor:pointer}
#net-tab-devices .device-select-control-v642 input{position:absolute;opacity:0;pointer-events:none}
#net-tab-devices .device-select-control-v642 span{width:16px;height:16px;border-radius:5px;border:1px solid rgba(148,163,184,.48);background:rgba(15,23,42,.48);position:relative;transition:.15s ease}
#net-tab-devices .device-select-control-v642 input:checked+span{background:#2563eb;border-color:#60a5fa;box-shadow:0 0 0 3px rgba(37,99,235,.12)}
#net-tab-devices .device-select-control-v642 input:checked+span:after{content:'✓';position:absolute;inset:-1px 0 0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:11px;font-weight:1000}
body[data-it-theme="light"] #net-tab-devices .device-select-control-v642 span{background:#fff;border-color:rgba(71,85,105,.38)}
#net-tab-devices .device-row-selected-v642{border-color:rgba(59,130,246,.58)!important;background:linear-gradient(90deg,rgba(37,99,235,.11),rgba(15,23,42,.18))!important;box-shadow:0 0 0 1px rgba(59,130,246,.12),0 8px 20px rgba(2,6,23,.08)!important}
body[data-it-theme="light"] #net-tab-devices .device-row-selected-v642{background:linear-gradient(90deg,rgba(219,234,254,.85),rgba(255,255,255,.98))!important}

#net-tab-devices .device-copy-ip-v642{appearance:none;border:0;background:transparent;color:#60a5fa;font-size:8px;font-weight:1000;cursor:pointer;padding:2px 3px;border-radius:5px}
#net-tab-devices .device-copy-ip-v642:hover{background:rgba(59,130,246,.14);color:#bfdbfe}
body[data-it-theme="light"] #net-tab-devices .device-copy-ip-v642{color:#2563eb}

#net-tab-devices .device-column-head-v642{
  display:grid;grid-template-columns:minmax(280px,1.45fr) minmax(180px,.72fr) minmax(180px,.72fr) minmax(245px,.92fr);
  gap:8px;padding:0 10px 6px;color:#7087a7;font-size:8px;font-weight:1000;letter-spacing:.06em;text-transform:uppercase;
}
#net-tab-devices .device-column-head-v642 span:last-child{text-align:center}
body[data-it-theme="light"] #net-tab-devices .device-column-head-v642{color:#64748b}

#net-tab-devices .device-auto-refresh-v642{min-width:105px}
#net-tab-devices .managed-pill .device-copy-ip-v642{flex:0 0 auto}

@media(max-width:1260px){
  #net-tab-devices .device-bulk-bar-v642{top:8px}
  #net-tab-devices .device-column-head-v642{display:none}
  #net-tab-devices .device-ops-console-v642{align-items:flex-start;flex-direction:column}
}
@media(max-width:760px){
  #net-tab-devices .device-saved-views-v642{display:grid;grid-template-columns:1fr 1fr;width:100%}
  #net-tab-devices .device-saved-views-v642 .device-last-refresh-v642{grid-column:1/-1}
  #net-tab-devices .device-bulk-actions-v642{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
  #net-tab-devices .device-bulk-actions-v642>*{width:100%}
  #net-tab-devices .device-quick-views-v642{width:100%}
}
/* V642_DEVICE_OPERATIONS_CONSOLE_END */
#net-tab-devices .device-search-clear-v642{appearance:none;border:0;background:rgba(100,116,139,.12);color:#94a3b8;width:24px;height:24px;border-radius:8px;cursor:pointer;font-size:16px;line-height:1;font-weight:700}
#net-tab-devices .device-search-clear-v642:hover{background:rgba(239,68,68,.12);color:#fecaca}
body[data-it-theme="light"] #net-tab-devices .device-search-clear-v642{background:#f1f5f9;color:#64748b}

/* V643_DEVICE_OUTAGE_REPORTING_START */
#view-devices .device-state-duration-v643.is-offline{
    border-color:rgba(244,63,94,.34)!important;
    background:rgba(244,63,94,.085)!important;
}
#view-devices .device-state-duration-v643.is-offline strong{color:#fda4af!important;}
#view-devices .device-state-duration-v643.is-offline em{color:#ffe4e6!important;font-weight:900!important;}
body[data-it-theme="light"] #view-devices .device-state-duration-v643.is-offline{
    border-color:rgba(190,18,60,.25)!important;background:#fff1f2!important;
}
body[data-it-theme="light"] #view-devices .device-state-duration-v643.is-offline strong{color:#be123c!important;}
body[data-it-theme="light"] #view-devices .device-state-duration-v643.is-offline em{color:#881337!important;}
#view-devices .device-report-period-v643{min-width:132px!important;}
/* V643_DEVICE_OUTAGE_REPORTING_END */




/* V645_STAGE3_CLEAR_OFFLINE_DURATION_START
   Keep the current connection/outage duration visible even in compact fleet rows. */
:where(#net-tab-devices,#view-devices) .device-state-duration-v643{
  border-width:1px!important;
  border-style:solid!important;
  font-variant-numeric:tabular-nums;
}
:where(#net-tab-devices,#view-devices) .device-state-duration-v643.is-offline{
  background:rgba(239,68,68,.13)!important;
  border-color:rgba(239,68,68,.30)!important;
  box-shadow:inset 3px 0 0 rgba(239,68,68,.78);
}
:where(#net-tab-devices,#view-devices) .device-state-duration-v643.is-offline strong,
:where(#net-tab-devices,#view-devices) .device-state-duration-v643.is-offline em{
  color:#fecaca!important;
}
:where(#net-tab-devices,#view-devices) .device-state-duration-v643.is-online{
  background:rgba(34,197,94,.11)!important;
  border-color:rgba(34,197,94,.24)!important;
  box-shadow:inset 3px 0 0 rgba(34,197,94,.70);
}
:where(#net-tab-devices,#view-devices) .device-state-duration-v643.is-online strong,
:where(#net-tab-devices,#view-devices) .device-state-duration-v643.is-online em{
  color:#bbf7d0!important;
}
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .device-state-duration-v643.is-offline{
  background:#fff1f2!important;border-color:#fecdd3!important;box-shadow:inset 3px 0 0 #ef4444;
}
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .device-state-duration-v643.is-offline strong,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .device-state-duration-v643.is-offline em{color:#b91c1c!important;}
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .device-state-duration-v643.is-online{
  background:#f0fdf4!important;border-color:#bbf7d0!important;box-shadow:inset 3px 0 0 #22c55e;
}
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .device-state-duration-v643.is-online strong,
body[data-it-theme="light"] :where(#net-tab-devices,#view-devices) .device-state-duration-v643.is-online em{color:#047857!important;}
/* Compact rows intentionally keep only the first clock row.  Stage 3 places the
   live state duration first, so "فاصل منذ / متصل منذ" can never be hidden. */
#net-tab-devices .device-density-compact .time-stack.compact.refined .device-state-duration-v643{
  display:flex!important;
}
#net-tab-devices .device-density-compact .time-stack.compact.refined .device-last-seen-v645{
  display:none!important;
}
/* V645_STAGE3_CLEAR_OFFLINE_DURATION_END */

/* V648 sorting controls: native buttons, visible keyboard focus, RTL safe. */
.device-sort-button-v648 {display:flex;align-items:center;gap:.5rem;border:0;background:transparent;color:inherit;font:inherit;text-align:start;cursor:pointer;padding:.45rem .6rem;border-radius:.35rem;}
.device-sort-button-v648:hover {background:rgba(128,128,128,.15)}
.device-sort-button-v648:focus-visible {outline:2px solid currentColor;outline-offset:2px}
.device-sort-button-v648[aria-pressed="true"] {font-weight:700;text-decoration:underline;text-underline-offset:.25rem}
.device-column-head-v642[aria-busy="true"] {opacity:.65}

#net-tab-devices .device-column-head-v642 .device-sort-button-v648{font-size:12px!important;font-weight:700;min-height:38px;color:var(--text-primary,#e2e8f0);}
#net-tab-devices .device-column-head-v642 .device-sort-button-v648 span{font-size:12px!important;}
body[data-it-theme="light"] #net-tab-devices .device-column-head-v642 .device-sort-button-v648{color:#334155;}