﻿/* Cyber Security Dark
   Built-in theme pack. Loaded dynamically from /themes/cyber-security-dark/theme.css after /assets/css/app.css.
   Customers can copy this folder, adjust manifest.json, and upload/select the result as a custom theme. */
html[data-theme="cyber-security-dark"] {
  --bg:#02070b;
  --bg2:#061522;
  --panel:#091721;
  --panel2:#0e2230;
  --text:#f3f8fb;
  --muted:#a9bfcc;
  --border:rgba(144,188,214,.20);
  --brand:#f58220;
  --brand2:#ff9f1c;
  --accent:#0f7fb3;
  --accent2:#113f67;
  --success:#75d6ff;
  --shadow:0 24px 70px color-mix(in srgb, var(--bg) 70%, black 30%);
}
html[data-theme="cyber-security-dark"] body {
  background:url('/themes/cyber-security-dark/images/backgrounds/honeycomb-background.webp') center top/cover fixed no-repeat;
  color:var(--text);
}
html[data-theme="cyber-security-dark"] body:before {
  background:
    radial-gradient(circle at 18% 8%, color-mix(in srgb, var(--brand) 18%, transparent), transparent 24rem),
    radial-gradient(circle at 82% 2%, color-mix(in srgb, var(--accent) 18%, transparent), transparent 30rem),
    linear-gradient(180deg, color-mix(in srgb, var(--bg) 32%, transparent), color-mix(in srgb, var(--bg) 92%, transparent) 52%, var(--bg));
}
html[data-theme="cyber-security-dark"] .site-header {
  background:color-mix(in srgb, var(--bg) 82%, transparent);
  border-bottom-color:var(--border);
}
html[data-theme="cyber-security-dark"] body:not([data-panopt-route="profile"]) .hero-card,
html[data-theme="cyber-security-dark"] body:not([data-panopt-route="profile"]) .panel,
html[data-theme="cyber-security-dark"] body:not([data-panopt-route="profile"]) .card {
  background:linear-gradient(180deg, color-mix(in srgb, var(--panel) 94%, white 6%), color-mix(in srgb, var(--panel2) 90%, black 10%));
  border-color:var(--border);
}
html[data-theme="cyber-security-dark"] body:not([data-panopt-route="profile"]) .btn,
html[data-theme="cyber-security-dark"] body:not([data-panopt-route="profile"]) button:not(.ghost):not(.secondary):not(.danger) {
  background:linear-gradient(135deg,var(--brand),var(--brand2));
}
html[data-theme="cyber-security-dark"] body:not([data-panopt-route="profile"]) .btn.ghost,
html[data-theme="cyber-security-dark"] body:not([data-panopt-route="profile"]) button.ghost,
html[data-theme="cyber-security-dark"] body:not([data-panopt-route="profile"]) button.secondary {
  background:color-mix(in srgb, var(--panel) 72%, transparent);
  color:var(--text);
  border:1px solid var(--border);
}
html[data-theme="cyber-security-dark"] body:not([data-panopt-route="profile"]) .eyebrow,
html[data-theme="cyber-security-dark"] body:not([data-panopt-route="profile"]) .page-kicker,
html[data-theme="cyber-security-dark"] body:not([data-panopt-route="profile"]) .card-cta {
  color:color-mix(in srgb, var(--brand) 74%, white 26%);
}
html[data-theme="cyber-security-dark"] body:not([data-panopt-route="profile"]) input,
html[data-theme="cyber-security-dark"] body:not([data-panopt-route="profile"]) textarea,
html[data-theme="cyber-security-dark"] body:not([data-panopt-route="profile"]) select {
  background:color-mix(in srgb, var(--panel) 78%, transparent);
  border-color:var(--border);
  color:var(--text);
}
