@font-face{font-family:"Cantarell";src:url("../fonts/Cantarell-VF.otf") format("opentype");font-weight:100 900;font-style:normal;font-display:block}
/* BastionGuard WebUI font policy: Cantarell only.
   The Debian package must depend on fonts-cantarell.
   No remote fonts and no CSS fallback families are used. */
html,body,button,input,select,textarea,table,.btn,.form-control,.form-select,.dropdown-menu,.modal,.tooltip,.popover,pre,code,kbd,samp{font-family:"Cantarell" !important}
*{font-family:"Cantarell" !important}
/* BastionGuard WebUI theme
 * Palette ported from the BastionGuard GTK light/dark CSS files.
 * The original GTK selectors are not loaded directly because the WebUI uses HTML/Bootstrap.
 */
:root{
  --bg:#f4f6f8;
  --surface:#ffffff;
  --surface-2:#f1f3f5;
  --surface-3:#e2e6ea;
  --text:#212529;
  --muted:#6c757d;
  --muted-2:#495057;
  --border:#dee2e6;
  --border-strong:#3a6ea5;
  --shadow:0 1px 3px rgba(0,0,0,.10),0 12px 30px rgba(33,37,41,.06);
  --sidebar-bg:#3a6ea5;
  --sidebar-bg-hover:#2c5d8a;
  --sidebar-bg-active:rgba(255,255,255,.20);
  --sidebar-text:#ffffff;
  --sidebar-muted:rgba(255,255,255,.82);
  --sidebar-border:rgba(255,255,255,.12);
  --primary:#0d6efd;
  --primary-hover:#0b5ed7;
  --primary-active:#0a58ca;
  --success:#28a745;
  --success-hover:#218838;
  --danger:#dc3545;
  --danger-hover:#c82333;
  --warning:#e0952a;
  --warning-hover:#c47d1a;
  --info-bg:#e3f2fd;
  --info-text:#0277bd;
  --info-border:#81d4fa;
  --warning-bg:#fff8e1;
  --warning-text:#856404;
  --warning-border:#ffc107;
  --success-bg:#e8f5e9;
  --success-text:#2e7d32;
  --success-border:#81c784;
  --code-bg:#f8f9fa;
  --log-bg:#f8f9fa;
  --log-text:#495057;
  --input-bg:#ffffff;
  --input-focus:#eef2ff;
  --input-text:#212529;
  --scroll-thumb:#3a6ea5;
  --progress-track:#e9ecef;
  --progress-start:#28a745;
  --progress-end:#34ce57;
}
html[data-theme="dark"]{
  --bg:#1a1d23;
  --surface:#242830;
  --surface-2:#2a2f3b;
  --surface-3:#2e333e;
  --text:#e4e7eb;
  --muted:#b0b8c5;
  --muted-2:#c9cdd4;
  --border:#3a3f4b;
  --border-strong:#4d8fe0;
  --shadow:0 1px 3px rgba(0,0,0,.40),0 16px 38px rgba(0,0,0,.28);
  --sidebar-bg:#1e3352;
  --sidebar-bg-hover:#1e3a56;
  --sidebar-bg-active:rgba(255,255,255,.20);
  --sidebar-text:#ffffff;
  --sidebar-muted:#d0d9e8;
  --sidebar-border:rgba(255,255,255,.12);
  --primary:#0d6efd;
  --primary-hover:#0b5ed7;
  --primary-active:#0a58ca;
  --success:#28a745;
  --success-hover:#218838;
  --danger:#dc3545;
  --danger-hover:#c82333;
  --warning:#e0952a;
  --warning-hover:#c47d1a;
  --info-bg:#0a2833;
  --info-text:#6dcfe0;
  --info-border:#1a4a56;
  --warning-bg:#332b00;
  --warning-text:#f0c040;
  --warning-border:#5a4800;
  --success-bg:#0d2b12;
  --success-text:#4dbb6a;
  --success-border:#1a5c28;
  --code-bg:#0f1117;
  --log-bg:#0f1117;
  --log-text:#c9cdd4;
  --input-bg:#1e2229;
  --input-focus:#1a2030;
  --input-text:#e4e7eb;
  --scroll-thumb:#1e3352;
  --progress-track:#1a1f28;
  --progress-start:#28a745;
  --progress-end:#34ce57;
}
@media (prefers-color-scheme: dark){
  html[data-theme="system"]{
    --bg:#1a1d23;--surface:#242830;--surface-2:#2a2f3b;--surface-3:#2e333e;--text:#e4e7eb;--muted:#b0b8c5;--muted-2:#c9cdd4;--border:#3a3f4b;--border-strong:#4d8fe0;--shadow:0 1px 3px rgba(0,0,0,.40),0 16px 38px rgba(0,0,0,.28);--sidebar-bg:#1e3352;--sidebar-bg-hover:#1e3a56;--sidebar-bg-active:rgba(255,255,255,.20);--sidebar-text:#ffffff;--sidebar-muted:#d0d9e8;--sidebar-border:rgba(255,255,255,.12);--primary:#0d6efd;--primary-hover:#0b5ed7;--primary-active:#0a58ca;--success:#28a745;--success-hover:#218838;--danger:#dc3545;--danger-hover:#c82333;--warning:#e0952a;--warning-hover:#c47d1a;--info-bg:#0a2833;--info-text:#6dcfe0;--info-border:#1a4a56;--warning-bg:#332b00;--warning-text:#f0c040;--warning-border:#5a4800;--success-bg:#0d2b12;--success-text:#4dbb6a;--success-border:#1a5c28;--code-bg:#0f1117;--log-bg:#0f1117;--log-text:#c9cdd4;--input-bg:#1e2229;--input-focus:#1a2030;--input-text:#e4e7eb;--scroll-thumb:#1e3352;--progress-track:#1a1f28;--progress-start:#28a745;--progress-end:#34ce57;
  }
}
html,body{min-height:100%;margin:0}
body{background:var(--bg);color:var(--text);font-family:"Cantarell";direction:ltr;font-size:14px}
a{color:var(--primary)}a:hover{color:var(--primary-hover)}
.app-shell{display:grid;grid-template-columns:282px minmax(0,1fr);min-height:100vh;width:100%;direction:ltr}
.sidebar{grid-column:1;grid-row:1;width:282px;background:var(--sidebar-bg);color:var(--sidebar-text);position:sticky;top:0;left:0;right:auto;height:100vh;max-height:100vh;overflow-y:auto;padding:18px 14px;z-index:1000;border-bottom-left-radius:12px;box-shadow:8px 0 28px rgba(0,0,0,.08)}
.brand{display:flex;align-items:center;gap:12px;padding:10px 8px 18px;border-bottom:1px solid var(--sidebar-border);margin-bottom:12px}.brand strong{color:#fff;font-size:15px}.brand small{display:block;color:var(--sidebar-muted);font-size:.78rem}.brand-mark{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:rgba(255,255,255,.08)}
.sidebar-nav .nav-link{display:flex;align-items:center;gap:10px;color:var(--sidebar-text);border-radius:8px;padding:8px 12px;margin:0 0 6px;text-decoration:none;font-weight:500;transition:background-color .16s ease,color .16s ease,transform .16s ease}.sidebar-nav .nav-link:hover{background:rgba(255,255,255,.12);color:#fff;transform:translateX(1px)}.sidebar-nav .nav-link.active{background:var(--sidebar-bg-active);color:#fff;font-weight:600}.sidebar-nav .nav-link.text-danger{color:#ffe1e5!important}.sidebar-nav .nav-link.text-danger:hover{background:rgba(220,53,69,.32)}
.nav-group{margin:8px 0}.nav-section-toggle{width:100%;border:0;background:transparent;color:var(--sidebar-muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;margin:10px 0 4px;padding:8px 10px;border-radius:8px;display:flex;align-items:center;justify-content:space-between;text-align:left;font-weight:600}.nav-section-toggle:hover{background:rgba(255,255,255,.12);color:#fff}.nav-section-toggle span{display:flex;align-items:center;gap:8px}.nav-chevron{transition:transform .18s ease}.nav-section-toggle:not(.collapsed) .nav-chevron{transform:rotate(180deg)}.nav-group-collapse{padding-left:4px}
.sidebar-preferences{margin-top:14px;padding:12px 10px;border-top:1px solid var(--sidebar-border);color:var(--sidebar-text)}.sidebar-pref-title{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--sidebar-muted);margin-bottom:8px}.sidebar-preferences .btn-outline-light{--bs-btn-color:var(--sidebar-text);--bs-btn-border-color:rgba(255,255,255,.18);--bs-btn-hover-bg:rgba(255,255,255,.12);--bs-btn-hover-border-color:rgba(255,255,255,.35)}
.main-content{grid-column:2;grid-row:1;min-width:0;margin-left:0;overflow-x:hidden}.content-inner{padding:30px;max-width:1560px;margin:0 auto}.content{background:var(--bg);padding:20px}.page-title{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:22px}.page-title h1{font-size:1.7rem;margin:0;font-weight:750;color:var(--text)}.page-title p{margin:.3rem 0 0;color:var(--muted)}.small-muted,.form-hint,.text-muted{color:var(--muted)!important}.copy-muted{white-space:pre-wrap}
.card{background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow);overflow:hidden}.card-body{padding:18px}.card h5,.card h6{font-weight:700;color:var(--text)}.section-card h5{font-weight:700}.metric{min-height:116px}.metric .icon{width:48px;height:48px;border-radius:12px;display:grid;place-items:center;background:rgba(13,110,253,.12);color:var(--primary);flex:0 0 48px;font-size:1.25rem}
.card .btn,.card button.btn,.page-title .btn,.sidebar-preferences .btn{border-radius:6px;font-weight:500;padding:6px 12px}.card .btn{box-shadow:0 1px 2px rgba(0,0,0,.08)}.card .btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.12)}.card .btn:active{transform:none;box-shadow:0 1px 2px rgba(0,0,0,.08)}
.btn-primary{--bs-btn-bg:var(--primary);--bs-btn-border-color:var(--primary);--bs-btn-hover-bg:var(--primary-hover);--bs-btn-hover-border-color:var(--primary-hover);--bs-btn-active-bg:var(--primary-active);--bs-btn-active-border-color:var(--primary-active);--bs-btn-color:#fff;--bs-btn-hover-color:#fff;--bs-btn-active-color:#fff}.btn-success{--bs-btn-bg:var(--success);--bs-btn-border-color:var(--success);--bs-btn-hover-bg:var(--success-hover);--bs-btn-hover-border-color:var(--success-hover);--bs-btn-color:#fff;--bs-btn-hover-color:#fff}.btn-danger{--bs-btn-bg:var(--danger);--bs-btn-border-color:var(--danger);--bs-btn-hover-bg:var(--danger-hover);--bs-btn-hover-border-color:var(--danger-hover);--bs-btn-color:#fff;--bs-btn-hover-color:#fff}.btn-warning{--bs-btn-bg:var(--warning);--bs-btn-border-color:var(--warning);--bs-btn-hover-bg:var(--warning-hover);--bs-btn-hover-border-color:var(--warning-hover);--bs-btn-color:#fff;--bs-btn-hover-color:#fff}
.btn-outline-primary{--bs-btn-color:var(--primary);--bs-btn-border-color:var(--primary);--bs-btn-hover-bg:var(--primary);--bs-btn-hover-border-color:var(--primary);--bs-btn-hover-color:#fff}.btn-outline-danger{--bs-btn-color:var(--danger);--bs-btn-border-color:var(--danger);--bs-btn-hover-bg:var(--danger);--bs-btn-hover-border-color:var(--danger);--bs-btn-hover-color:#fff}.btn-outline-warning{--bs-btn-color:var(--warning);--bs-btn-border-color:var(--warning);--bs-btn-hover-bg:var(--warning);--bs-btn-hover-border-color:var(--warning);--bs-btn-hover-color:#fff}.btn-outline-secondary{--bs-btn-color:var(--muted-2);--bs-btn-border-color:var(--border);--bs-btn-hover-bg:var(--surface-3);--bs-btn-hover-border-color:var(--border);--bs-btn-hover-color:var(--text)}.btn-light{--bs-btn-bg:var(--surface-2);--bs-btn-border-color:var(--border);--bs-btn-color:var(--text);--bs-btn-hover-bg:var(--surface-3);--bs-btn-hover-color:var(--text)}.btn:disabled,.btn.disabled{background:var(--surface-3)!important;border-color:var(--border)!important;color:var(--muted)!important;box-shadow:none!important}
.action-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:12px}.action-card .btn{align-self:flex-start}.card-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.card-actions .btn{min-width:120px}.input-group .btn{box-shadow:none}.input-group .btn:hover{transform:none}
.list-group-item{background:var(--surface);color:var(--text);border-color:var(--border)}.list-group-flush>.list-group-item{background:transparent}.table{--bs-table-bg:transparent;--bs-table-color:var(--text);--bs-table-border-color:var(--border);--bs-table-hover-bg:var(--surface-2)}.table td,.table th{vertical-align:middle;color:var(--text);border-color:var(--border)}.table thead th{color:var(--muted-2);font-size:.82rem;text-transform:uppercase;letter-spacing:.04em}.table-service-status tbody tr{border-top:1px solid var(--border)}
.form-control,.form-select,textarea.form-control{background-color:var(--input-bg);color:var(--input-text);border-color:var(--border);border-radius:10px}.form-control:focus,.form-select:focus,textarea.form-control:focus{background-color:var(--input-focus);color:var(--input-text);border-color:var(--border-strong);box-shadow:0 0 0 .18rem rgba(13,110,253,.16)}.form-control::placeholder{color:var(--muted)}.form-check-input{background-color:var(--input-bg);border-color:var(--border)}.form-check-input:checked{background-color:var(--primary);border-color:var(--primary)}.form-label,.form-check-label{color:var(--text)}
.nav-tabs{border-bottom:1px solid var(--border)}.nav-tabs .nav-link{background:var(--surface);border:1px solid var(--border);border-bottom:0;color:var(--muted-2);border-top-left-radius:6px;border-top-right-radius:6px;margin-right:4px}.nav-tabs .nav-link:hover{background:var(--surface-2);color:var(--text)}.nav-tabs .nav-link.active{background:var(--surface-3);color:var(--text);border-color:var(--border);border-bottom:2px solid var(--border-strong)}.tab-pane{padding-top:18px}
.alert{border-radius:8px}.alert-light{background:var(--surface-2);color:var(--text);border-color:var(--border)}.alert-info{background:var(--info-bg);color:var(--info-text);border-color:var(--info-border)}.alert-warning{background:var(--warning-bg);color:var(--warning-text);border-color:var(--warning-border)}.alert-success,.success-label{background:var(--success-bg);color:var(--success-text);border-color:var(--success-border)}.danger-zone{border:1px dashed var(--danger)}
.log-box{background:var(--log-bg);color:var(--log-text);border:1px solid var(--border);border-radius:6px;padding:16px;min-height:180px;max-height:520px;overflow:auto;white-space:pre-wrap;font-family:"Cantarell";font-size:.86rem}.code-box,pre.code-box{background:var(--code-bg);border:1px solid var(--border);border-radius:10px;padding:12px;color:var(--text);font-family:"Cantarell"}.list-scroll,.import-preview{max-height:360px;overflow:auto}
.badge-soft{background:rgba(13,110,253,.12);color:var(--primary);border:1px solid rgba(13,110,253,.22)}.password-cell,.service-name,.samba-share{font-family:"Cantarell"}.password-mask{letter-spacing:.15em;color:var(--muted)}.service-meta{font-size:.82rem;color:var(--muted)}.state-dot{display:inline-block;width:.6rem;height:.6rem;border-radius:999px;margin-right:.35rem;background:#9ca3af}.state-dot.active{background:#16a34a}.state-dot.failed{background:#dc2626}.state-dot.activating{background:#f59e0b}.pm-file-ok{color:#16a34a}.pm-file-missing{color:#f59e0b}
.brand-logo{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px}.brand-logo svg{width:34px;height:34px;max-width:34px;max-height:34px;display:block}.brand-logo.fallback{font-size:22px}.about-logo{display:inline-flex;align-items:center;justify-content:center;width:72px;height:72px}.about-logo svg{width:72px;height:72px;max-width:72px;max-height:72px}
.progress,.progress-BastionGuard{background:var(--progress-track);border-radius:10px;min-height:14px}.progress-bar,.progress-BastionGuard progress{background-image:linear-gradient(90deg,var(--progress-start),var(--progress-end))}.spinner-border{color:var(--primary)}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:rgba(58,110,165,.08);border-radius:8px}::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border-radius:8px}::-webkit-scrollbar-thumb:hover{background:var(--sidebar-bg-hover)}
@media(max-width:980px){.app-shell{display:block}.sidebar{position:relative;width:100%;height:auto;max-height:none;border-radius:0}.main-content{margin-left:0}.content-inner{padding:18px;max-width:none}.page-title{display:block}.page-title .d-flex{margin-top:12px}.card-actions .btn{min-width:auto;width:100%}}

/* ===========================
 *  AUTH / SETUP SPLIT WEBPANEL
 *  v15 - BastionGuard WebPanel login and setup
 *  =========================== */
body.auth-page{
  min-height:100vh;
  overflow:auto;
  background:#f5f8fc;
  color:#1f2937;
}
.auth-shell{
  min-height:100vh;
  display:grid;
  grid-template-columns:minmax(420px,56vw) minmax(420px,44vw);
  background:#f5f8fc;
}
.auth-brand-panel{
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:center;
  padding:clamp(44px,7vw,110px) clamp(38px,8vw,160px);
  background:
    radial-gradient(circle at 78% 0%, rgba(30,83,132,.72) 0 0, rgba(30,83,132,.72) 14%, transparent 14.3%),
    radial-gradient(circle at 52% 104%, rgba(24,80,130,.38) 0 0, rgba(24,80,130,.38) 18%, transparent 18.4%),
    linear-gradient(135deg,#062844 0%,#061f36 48%,#082b4c 100%);
  color:#fff;
  isolation:isolate;
}
.auth-brand-panel:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(255,255,255,.035) 0 0) 68% 0/1px 100% no-repeat,
    linear-gradient(180deg,rgba(255,255,255,.035) 0 0) 0 38%/100% 1px no-repeat,
    linear-gradient(135deg,transparent 0 59%,rgba(28,95,150,.28) 59.2% 72%,transparent 72.2%) 62% 38%/32% 40% no-repeat,
    linear-gradient(135deg,rgba(4,20,38,.05),rgba(30,97,154,.28));
  z-index:-2;
}
.auth-brand-panel:after{
  content:"";
  position:absolute;
  width:34vw;
  height:34vw;
  min-width:360px;
  min-height:360px;
  border-radius:50%;
  left:30%;
  bottom:-22%;
  background:radial-gradient(circle,transparent 0 42%,rgba(14,74,126,.34) 42.3% 70%,transparent 70.4%);
  z-index:-1;
}
.auth-brand-content{
  position:relative;
  z-index:3;
  max-width:720px;
}
.auth-kicker{
  margin:0 0 18px;
  font-size:clamp(1.1rem,1.6vw,1.55rem);
  color:rgba(255,255,255,.86);
  font-weight:400;
}
.auth-brand-content h1{
  margin:0;
  color:#fff;
  font-weight:850;
  letter-spacing:-.055em;
  line-height:.98;
  font-size:clamp(3.4rem,6.1vw,6.7rem);
  text-shadow:0 4px 22px rgba(0,0,0,.22);
}
.auth-brand-lockup{
  margin-top:42px;
  display:flex;
  align-items:center;
  gap:18px;
}
.auth-brand-logo{
  width:72px;
  height:72px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  filter:drop-shadow(0 10px 22px rgba(0,0,0,.35));
}
.auth-brand-logo svg{
  width:72px;
  height:72px;
  max-width:72px;
  max-height:72px;
  display:block;
}
.auth-brand-logo.fallback{font-size:54px;color:#fff}
.auth-brand-lockup strong{
  display:block;
  color:#fff;
  font-size:clamp(1.8rem,2.9vw,3rem);
  font-weight:800;
  letter-spacing:-.035em;
}
.auth-brand-lockup span{
  display:block;
  margin-top:2px;
  color:#32b8ff;
  font-size:.88rem;
  text-transform:uppercase;
  font-weight:800;
  letter-spacing:.065em;
}
.auth-shape{
  position:absolute;
  pointer-events:none;
  z-index:0;
}
.auth-shape-one{
  right:9%;
  top:37%;
  width:27vw;
  height:27vw;
  min-width:320px;
  min-height:320px;
  background:linear-gradient(135deg,rgba(23,87,145,.28),rgba(2,22,39,.18));
  border-radius:2px;
}
.auth-shape-two{
  right:-5%;
  bottom:12%;
  width:23vw;
  height:23vw;
  min-width:260px;
  min-height:260px;
  background:linear-gradient(135deg,transparent 0 49%,rgba(30,104,170,.45) 50% 100%);
  border-radius:2px;
}
.auth-dot-grid{
  position:absolute;
  right:8.2%;
  top:42%;
  width:230px;
  height:260px;
  background-image:radial-gradient(circle,rgba(43,150,226,.52) 0 12px,transparent 13px);
  background-size:72px 72px;
  opacity:.68;
  z-index:1;
}
.auth-form-panel{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:48px;
  background:linear-gradient(135deg,#f9fbfe 0%,#eef3f9 100%);
}
.auth-card-wrap{
  position:relative;
  width:min(430px,100%);
}
.setup-card-wrap{width:min(520px,100%)}
.auth-floating-logo{
  position:absolute;
  top:-48px;
  left:50%;
  transform:translateX(-50%);
  width:96px;
  height:96px;
  border-radius:22px;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 14px 32px rgba(15,45,80,.14),0 3px 12px rgba(15,45,80,.08);
  z-index:2;
}
.auth-floating-logo-mark,
.auth-floating-logo-mark svg{
  width:66px;
  height:66px;
  max-width:66px;
  max-height:66px;
  display:block;
}
.auth-floating-logo-mark.fallback{font-size:48px}
.auth-card{
  position:relative;
  background:#fff;
  border:1px solid rgba(215,223,232,.92);
  border-radius:22px;
  padding:78px 36px 34px;
  box-shadow:0 30px 80px rgba(14,37,65,.15),0 10px 24px rgba(14,37,65,.08);
  color:#1f2937;
}
.setup-card{padding-top:76px}
.auth-card-header{text-align:center;margin-bottom:28px}
.auth-card-header h2{
  margin:0;
  font-size:1.62rem;
  color:#1f2937;
  font-weight:800;
  letter-spacing:-.025em;
}
.auth-card-header p{
  margin:.45rem 0 0;
  color:#8491a3;
  font-size:1rem;
}
.auth-card .form-label{
  color:#374151;
  font-weight:600;
  margin-bottom:.55rem;
}
.auth-input,
.auth-card .form-control,
.auth-card .form-select{
  height:52px;
  border-radius:11px;
  background:#fff;
  color:#1f2937;
  border:1px solid #d8e1eb;
  box-shadow:inset 0 1px 1px rgba(17,24,39,.02);
}
.auth-card .form-control:focus,
.auth-card .form-select:focus{
  background:#fff;
  color:#1f2937;
  border-color:#8fc4f5;
  box-shadow:0 0 0 .22rem rgba(13,110,253,.12);
}
.auth-password-field{position:relative}
.auth-password-field .form-control{padding-right:52px}
.auth-eye{
  position:absolute;
  right:12px;
  top:50%;
  transform:translateY(-50%);
  border:0;
  background:transparent;
  color:#7b8797;
  width:34px;
  height:34px;
  border-radius:9px;
  display:grid;
  place-items:center;
  font-size:18px;
  line-height:1;
}
.auth-eye:hover{background:#f0f5fb;color:#0b4a6d}
.auth-submit{
  height:56px;
  border-radius:11px!important;
  background:linear-gradient(135deg,#0b4a6d,#062f5f)!important;
  border-color:#06355a!important;
  box-shadow:0 10px 22px rgba(6,47,95,.22)!important;
  font-size:1.05rem;
  font-weight:800;
}
.auth-submit:hover{background:linear-gradient(135deg,#0a4262,#052a55)!important;transform:translateY(-1px)}
.auth-version{
  position:absolute;
  right:22px;
  bottom:18px;
  color:#a8b2c1;
  font-size:.78rem;
}
.auth-info-note{
  border:1px solid #9bd0ff;
  background:#edf7ff;
  color:#1166b1;
  border-radius:10px;
  padding:12px 14px;
  font-weight:600;
  font-size:.9rem;
}
.setup-card .form-hint{font-size:.82rem;color:#7b8797!important;margin-top:.35rem}
.setup-card .alert{border-radius:12px}
@media(max-width:1100px){
  .auth-shell{grid-template-columns:1fr;}
  .auth-brand-panel{min-height:44vh;padding:52px 34px;}
  .auth-form-panel{min-height:56vh;padding:72px 24px 44px;}
  .auth-brand-content h1{font-size:clamp(3.2rem,10vw,5.8rem)}
  .auth-dot-grid{right:5%;top:35%}
}
@media(max-width:560px){
  .auth-brand-panel{padding:44px 24px;min-height:42vh}
  .auth-brand-content h1{font-size:3rem}
  .auth-brand-lockup{margin-top:26px}
  .auth-brand-logo,.auth-brand-logo svg{width:56px;height:56px;max-width:56px;max-height:56px}
  .auth-brand-lockup strong{font-size:1.7rem}
  .auth-brand-lockup span{font-size:.68rem}
  .auth-form-panel{padding:72px 16px 32px}
  .auth-card{padding:70px 22px 32px;border-radius:18px}
  .auth-floating-logo{width:84px;height:84px;top:-42px;border-radius:20px}
  .auth-floating-logo-mark,.auth-floating-logo-mark svg{width:58px;height:58px;max-width:58px;max-height:58px}
}

/* v16 - WebPanel users setup shortcut */
.sidebar-user-setup {
  margin: .75rem 0 .65rem 0;
  padding-top: .65rem;
  border-top: 1px solid rgba(255,255,255,.12);
}
.sidebar-user-setup .nav-link {
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.08);
}
.sidebar-user-setup .nav-link:hover,
.sidebar-user-setup .nav-link.active {
  background: rgba(255,255,255,.18);
}

/* v17 - auth i18n and quick theme/language controls */
.auth-preferences{
  position:fixed;
  top:18px;
  right:20px;
  z-index:20;
  display:flex;
  align-items:center;
  gap:6px;
  padding:6px;
  border-radius:999px;
  background:rgba(255,255,255,.82);
  border:1px solid rgba(209,217,229,.75);
  box-shadow:0 10px 24px rgba(15,23,42,.08);
  backdrop-filter:blur(12px);
}
.auth-preferences a{
  min-width:38px;
  text-align:center;
  text-decoration:none;
  color:#5f6b7a;
  border-radius:999px;
  padding:6px 10px;
  font-size:.78rem;
  font-weight:800;
  line-height:1;
}
.auth-preferences a:hover{background:#eef5fb;color:#06355a}
.auth-preferences a.active{background:#0b4a6d;color:#fff}
.auth-preferences span{width:1px;height:18px;background:#d9e0ea;margin:0 2px}
[data-theme="dark"] .auth-preferences{
  background:rgba(30,34,41,.86);
  border-color:rgba(58,63,75,.9);
  box-shadow:0 10px 24px rgba(0,0,0,.28);
}
[data-theme="dark"] .auth-preferences a{color:#c9d2df}
[data-theme="dark"] .auth-preferences a:hover{background:#2a2f3b;color:#fff}
[data-theme="dark"] .auth-preferences a.active{background:#4d8fe0;color:#fff}
[data-theme="dark"] .auth-preferences span{background:#3a3f4b}
[data-theme="dark"] .auth-form-panel{background:#1a1d23}
[data-theme="dark"] .auth-card{background:#242830;border-color:#3a3f4b;color:#e4e7eb}
[data-theme="dark"] .auth-card-header h2{color:#f2f4f7}
[data-theme="dark"] .auth-card-header p,
[data-theme="dark"] .auth-card .form-label,
[data-theme="dark"] .setup-card .form-hint{color:#c9d2df!important}
[data-theme="dark"] .auth-input{background:#1e2229;border-color:#3a3f4b;color:#e4e7eb}
[data-theme="dark"] .auth-input:focus{background:#1e2229;color:#fff;border-color:#4d8fe0;box-shadow:0 0 0 .22rem rgba(77,143,224,.18)}
[data-theme="dark"] .auth-eye:hover{background:#2a2f3b;color:#fff}
[data-theme="dark"] .auth-info-note{background:#0a2833;border-color:#1a4a56;color:#6dcfe0}
@media(max-width:560px){.auth-preferences{left:14px;right:14px;justify-content:center}}


/* v18 - initial wizard aligned with setup/login split screen */
.wizard-auth-page .wizard-form-panel{align-items:flex-start;padding-top:96px;padding-bottom:56px;}
.wizard-card-wrap{width:min(760px,100%)}
.wizard-card{padding-bottom:44px;}
.wizard-status-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;}
.wizard-status-item{border:1px solid #d8e1eb;border-radius:12px;padding:11px 12px;background:#f8fbff;min-width:0;}
.wizard-status-item span{display:block;color:#7b8797;font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;}
.wizard-status-item strong{display:block;color:#1f2937;font-weight:800;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.wizard-section-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px;}
.wizard-section-title h3{font-size:1rem;font-weight:850;color:#1f2937;margin:0;}
.wizard-service-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
.wizard-choice-card{display:flex;align-items:flex-start;gap:10px;border:1px solid #d8e1eb;border-radius:13px;background:#fff;padding:12px;cursor:pointer;transition:background .15s ease,border-color .15s ease,transform .15s ease;}
.wizard-choice-card:hover{background:#f8fbff;border-color:#8fc4f5;transform:translateY(-1px);}
.wizard-choice-card input{margin-top:4px;flex:0 0 auto;}
.wizard-choice-card span{display:block;min-width:0;}
.wizard-choice-card strong{display:block;color:#1f2937;font-weight:800;margin-bottom:2px;}
.wizard-choice-card small{display:block;color:#7b8797;line-height:1.32;}
.wizard-choice-card code{display:block;margin-top:6px;font-size:.72rem;color:#0b4a6d;background:#eef6ff;border:1px solid #cde5fb;border-radius:6px;padding:2px 5px;white-space:normal;word-break:break-word;}
.wizard-actions{display:grid;grid-template-columns:140px 1fr;gap:12px;align-items:center;}
.wizard-details{border:1px solid #d8e1eb;border-radius:12px;padding:10px 12px;background:#f8fbff;}
.wizard-details summary{font-weight:800;color:#1f2937;cursor:pointer;margin-bottom:8px;}
.wizard-card .log-box{max-height:260px;min-height:120px;}
[data-theme="dark"] .wizard-status-item,
[data-theme="dark"] .wizard-choice-card,
[data-theme="dark"] .wizard-details{background:#1e2229;border-color:#3a3f4b;}
[data-theme="dark"] .wizard-status-item strong,
[data-theme="dark"] .wizard-section-title h3,
[data-theme="dark"] .wizard-choice-card strong,
[data-theme="dark"] .wizard-details summary{color:#f2f4f7;}
[data-theme="dark"] .wizard-status-item span,
[data-theme="dark"] .wizard-choice-card small{color:#c9d2df;}
[data-theme="dark"] .wizard-choice-card:hover{background:#2a2f3b;border-color:#4d8fe0;}
[data-theme="dark"] .wizard-choice-card code{background:#0a2833;border-color:#1a4a56;color:#6dcfe0;}
@media(max-width:760px){.wizard-status-grid,.wizard-service-grid{grid-template-columns:1fr}.wizard-actions{grid-template-columns:1fr}.wizard-card-wrap{width:100%}}

/* v19 - coherent WebPanel users setup */
.section-eyebrow{display:inline-flex;align-items:center;gap:.45rem;margin-bottom:.45rem;color:var(--muted);font-size:.74rem;font-weight:750;letter-spacing:.09em;text-transform:uppercase}.web-users-hero{background:linear-gradient(135deg,rgba(13,110,253,.09),rgba(40,167,69,.05)),var(--surface)}.hero-icon{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;background:rgba(13,110,253,.12);color:var(--primary);font-size:1.55rem;flex:0 0 56px}.web-user-form-card,.web-users-list-card{border-radius:16px}.role-picker{display:grid;gap:10px}.role-card{display:flex;align-items:flex-start;gap:10px;border:1px solid var(--border);border-radius:13px;background:var(--surface-2);padding:12px;cursor:pointer;transition:border-color .15s ease,background .15s ease,transform .15s ease}.role-card:hover{border-color:var(--border-strong);transform:translateY(-1px)}.role-card.selected{border-color:var(--primary);background:rgba(13,110,253,.10)}.role-card input{margin-top:4px;flex:0 0 auto}.role-card span{display:block;min-width:0}.role-card strong{display:block;color:var(--text);font-size:.96rem}.role-card small{display:block;color:var(--muted);line-height:1.35;margin-top:2px}.web-users-table-wrap{border:1px solid var(--border);border-radius:14px;overflow:hidden}.web-users-table{margin-bottom:0}.web-users-table thead th{background:var(--surface-2);padding:.8rem .7rem}.web-users-table tbody td{padding:.85rem .7rem}.user-cell{display:flex;align-items:center;gap:10px}.user-avatar{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:rgba(13,110,253,.12);color:var(--primary);font-weight:800}.sidebar-user-setup{border-top:1px solid var(--sidebar-border);margin-top:12px;padding-top:12px}.sidebar-user-setup .nav-link{display:flex;align-items:center;gap:10px;color:var(--sidebar-text);border-radius:8px;padding:8px 12px;text-decoration:none;font-weight:600}.sidebar-user-setup .nav-link:hover,.sidebar-user-setup .nav-link.active{background:var(--sidebar-bg-active);color:#fff}@media(max-width:980px){.web-users-title .d-flex{justify-content:flex-start!important}.web-users-table .btn{width:100%}}

/* WebPanel malware/ransomware toast notifications.
 * Native JavaScript implementation: positioned without Bootstrap utilities so it
 * also works with the local lightweight Bootstrap-compatible subset.
 */
.bg-toast-container{
  position:fixed !important;
  top:16px !important;
  right:16px !important;
  bottom:auto !important;
  left:auto !important;
  z-index:2147483000 !important;
  width:min(440px, calc(100vw - 32px));
  max-width:440px;
  display:flex;
  flex-direction:column;
  gap:12px;
  pointer-events:none;
}
.bg-alert-toast{
  pointer-events:auto;
  overflow:hidden;
  border-radius:14px;
  background:var(--surface);
  color:var(--text);
  border:1px solid var(--border);
  box-shadow:0 18px 45px rgba(0,0,0,.26), 0 2px 8px rgba(0,0,0,.12);
  animation:bgToastIn .22s ease-out both;
}
.bg-alert-toast-leaving{animation:bgToastOut .18s ease-in both;}
.bg-alert-toast-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px 14px;
  border-bottom:1px solid var(--border);
  background:linear-gradient(90deg, rgba(220,53,69,.14), rgba(13,110,253,.06));
}
.bg-alert-toast-title{
  display:flex;
  align-items:center;
  gap:9px;
  min-width:0;
  font-weight:800;
}
.bg-alert-toast-title i{color:var(--danger);font-size:1.15rem;}
.bg-alert-toast-meta{display:flex;align-items:center;gap:8px;color:var(--muted);white-space:nowrap;}
.bg-toast-close{
  border:0;
  background:transparent;
  color:var(--muted);
  width:28px;
  height:28px;
  border-radius:8px;
  line-height:1;
  font-size:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.bg-toast-close:hover{background:var(--surface-3);color:var(--text);}
.bg-alert-toast-body{padding:12px 14px 14px;}
.bg-alert-toast-family{font-weight:800;margin-bottom:4px;word-break:break-word;}
.bg-alert-toast-path{font-size:.86rem;color:var(--muted);word-break:break-all;margin-bottom:12px;}
.bg-alert-toast-actions{display:flex;gap:8px;flex-wrap:wrap;}
.bg-alert-toast-ransomware{border-color:rgba(220,53,69,.55);}
.bg-alert-toast-malware{border-color:rgba(220,53,69,.38);}
.bg-alert-toast-warning .bg-alert-toast-header{background:var(--warning-bg);color:var(--warning-text);}
.bg-alert-toast-warning .bg-alert-toast-title i{color:var(--warning-text);}
@keyframes bgToastIn{from{opacity:0;transform:translate3d(22px,-10px,0) scale(.985);}to{opacity:1;transform:none;}}
@keyframes bgToastOut{from{opacity:1;transform:none;}to{opacity:0;transform:translate3d(22px,-10px,0) scale(.985);}}
@media (max-width: 576px){
  .bg-toast-container{left:12px !important;right:12px !important;top:12px !important;width:auto;max-width:none;}
}

/* v31: mobile off-canvas navigation */
.mobile-topbar{display:none;position:sticky;top:0;z-index:1200;height:58px;padding:10px 14px;background:var(--sidebar-bg);color:var(--sidebar-text);border-bottom:1px solid var(--sidebar-border);align-items:center;gap:12px;box-shadow:0 8px 22px rgba(0,0,0,.12)}
.mobile-menu-btn{width:40px;height:40px;border:1px solid rgba(255,255,255,.18);border-radius:11px;background:rgba(255,255,255,.08);color:#fff;display:grid;place-items:center;font-size:1.25rem}
.mobile-menu-btn:hover{background:rgba(255,255,255,.16)}
.mobile-brand{display:flex;align-items:center;gap:10px;font-weight:800;color:#fff;min-width:0}.mobile-brand-mark{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.08);flex:0 0 34px}.mobile-brand-mark img,.mobile-brand-mark svg{width:24px;height:24px}
.sidebar-close{display:none;position:absolute;top:12px;right:12px;width:38px;height:38px;border:1px solid rgba(255,255,255,.18);border-radius:11px;background:rgba(255,255,255,.08);color:#fff;place-items:center;font-size:1rem;z-index:2}.sidebar-close:hover{background:rgba(255,255,255,.16)}
.sidebar-scrim{position:fixed;inset:0;background:rgba(0,0,0,.48);z-index:1240;opacity:0;transition:opacity .18s ease}.sidebar-scrim.is-visible{opacity:1}body.sidebar-open{overflow:hidden}
@media(max-width:980px){
  .mobile-topbar{display:flex}
  .app-shell{display:block;min-height:calc(100vh - 58px);width:100%;overflow-x:hidden}
  .sidebar{position:fixed!important;top:0!important;left:0!important;bottom:0!important;width:min(86vw,322px)!important;height:100vh!important;max-height:100vh!important;border-radius:0!important;transform:translateX(-105%);transition:transform .22s ease;z-index:1250;padding-top:62px!important;box-shadow:18px 0 42px rgba(0,0,0,.36)!important}
  .sidebar.is-open{transform:translateX(0)}
  .sidebar-close{display:grid}
  .main-content{display:block;width:100%;min-width:0;margin-left:0!important;overflow-x:hidden}
  .content-inner{padding:18px!important;max-width:none!important;width:100%}
  .page-title{display:block;margin-bottom:16px}.page-title h1{font-size:1.55rem;line-height:1.22}.page-title p{font-size:.95rem}
  .row{--bs-gutter-x:1rem}.card{max-width:100%}.card-body{padding:1rem}.table-responsive,.log-box,pre{max-width:100%;overflow-x:auto}
  .btn-group.w-100>.btn{min-width:0;white-space:nowrap}
}
@media(max-width:420px){.content-inner{padding:14px!important}.page-title h1{font-size:1.35rem}.sidebar{width:88vw!important}.card-body{padding:.9rem}.mobile-brand span:last-child{font-size:.95rem}}


/* v33: stronger mobile/tablet offcanvas navigation.
 * Uses a larger breakpoint because the WebPanel can be embedded in narrow
 * frames even when the browser viewport is wider than a phone.
 */
@media (max-width:1280px){
  body:not(.auth-page){padding-top:58px;}
  .mobile-topbar{display:flex!important;position:fixed!important;top:0!important;left:0!important;right:0!important;z-index:1300!important;}
  .app-shell{display:block!important;min-height:calc(100vh - 58px)!important;width:100%!important;overflow-x:hidden!important;}
  .sidebar{position:fixed!important;top:0!important;left:0!important;bottom:0!important;width:min(86vw,322px)!important;height:100vh!important;max-height:100vh!important;border-radius:0!important;transform:translate3d(-110%,0,0)!important;transition:transform .22s ease!important;z-index:1320!important;padding-top:66px!important;box-shadow:18px 0 42px rgba(0,0,0,.38)!important;will-change:transform;}
  .sidebar.is-open{transform:translate3d(0,0,0)!important;}
  .sidebar-close{display:grid!important;}
  .sidebar-scrim{z-index:1310!important;}
  .main-content{display:block!important;width:100%!important;min-width:0!important;margin-left:0!important;overflow-x:hidden!important;}
  .content-inner{padding:18px!important;max-width:none!important;width:100%!important;}
  .page-title{display:block!important;margin-bottom:16px!important;}
  .page-title h1{font-size:1.55rem!important;line-height:1.22!important;}
  .page-title p{font-size:.95rem!important;}
  .card,.card-body,.table-responsive,.log-box,pre{max-width:100%!important;}
  .table-responsive,.log-box,pre{overflow-x:auto!important;}
  .row{--bs-gutter-x:1rem!important;}
}
@media (min-width:1281px){
  body:not(.auth-page){padding-top:0!important;}
  .mobile-topbar{display:none!important;}
  .sidebar{transform:none!important;}
}

/* v37 - real step-by-step wizard with desktop-config lock */
.wizard-stepper{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:8px;margin:16px 0 18px;}
.wizard-stepper-item{display:flex;align-items:center;justify-content:flex-start;gap:8px;border:1px solid #d8e1eb;border-radius:12px;background:#fff;color:#526070;font-weight:800;padding:10px 8px;cursor:pointer;transition:background .15s ease,border-color .15s ease,color .15s ease,transform .15s ease;text-align:left;}
.wizard-stepper-item span{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#eef6ff;color:#0b4a6d;font-size:.8rem;}
.wizard-stepper-item:hover{border-color:#8fc4f5;transform:translateY(-1px);}
.wizard-stepper-item.active{background:#0d6efd;color:#fff;border-color:#0d6efd;}
.wizard-stepper-item.active span{background:rgba(255,255,255,.22);color:#fff;}
.wizard-stepper-item.done{background:#eef6ff;border-color:#b6daf8;color:#0b4a6d;}
.wizard-step-pane{display:none;}
.wizard-step-pane.active{display:block;}
.wizard-step-pane>h3{font-size:1.05rem;font-weight:850;color:#1f2937;margin:0 0 8px;}
[data-theme="dark"] .wizard-stepper-item{background:#1e2229;border-color:#3a3f4b;color:#c9d2df;}
[data-theme="dark"] .wizard-stepper-item span{background:#0a2833;color:#6dcfe0;}
[data-theme="dark"] .wizard-stepper-item:hover{background:#2a2f3b;border-color:#4d8fe0;}
[data-theme="dark"] .wizard-stepper-item.active{background:#4d8fe0;border-color:#4d8fe0;color:#fff;}
[data-theme="dark"] .wizard-stepper-item.active span{background:rgba(255,255,255,.18);color:#fff;}
[data-theme="dark"] .wizard-stepper-item.done{background:#0a2833;border-color:#1a4a56;color:#6dcfe0;}
[data-theme="dark"] .wizard-step-pane>h3{color:#f2f4f7;}
@media(max-width:760px){.wizard-stepper{grid-template-columns:1fr 1fr}.wizard-stepper-item{justify-content:flex-start}}
@media(max-width:460px){.wizard-stepper{grid-template-columns:1fr}}

.wizard-review-list h4{font-size:.92rem;font-weight:850;margin:12px 0 6px;color:#1f2937}.wizard-review-list ul{margin:0 0 8px 18px;padding:0}.wizard-review-list li{margin:2px 0;color:#526070}[data-theme="dark"] .wizard-review-list h4{color:#f2f4f7}[data-theme="dark"] .wizard-review-list li{color:#c9d2df}