/* Custom PC Republic — child of LuCI Bootstrap (OpenWrt 23.05 / 24.10 / 25.12).
   mediaurlbase=/luci-static/cpr
   Requires luci-theme-bootstrap. Does not restyle radios or firewall. */

@import url("../bootstrap/cascade.css");

:root,
:root[data-darkmode="true"] {
  --background-color-delta-l-sign: 1;
  --background-color-h: 226;
  --background-color-s: 22%;
  --background-color-l: 5%;
  --text-color-delta-l-sign: -1;
  --text-color-h: 220;
  --text-color-s: 18%;
  --text-color-l: 94%;
  --border-color-delta-l-sign: 1;
  --border-color-h: 222;
  --border-color-s: 18%;
  --primary-color-high: #8b5cf6;
  --primary-color-medium: #6d46d6;
  --primary-color-low: #3d8bfd;
  --on-primary-color: #f4f7fb;
  --warn-color-high: #e0a15a;
  --warn-color-medium: #c4894a;
  --warn-color-low: #a8743e;
  --on-warn-color: #1a140c;
  color-scheme: dark;
  --font-sans: "Segoe UI", sans-serif;
}

body {
  background-color: #07080c;
  background-image:
    repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.035) 0 1px, transparent 1px 7px),
    repeating-linear-gradient(-45deg, rgba(0, 0, 0, 0.45) 0 1px, transparent 1px 7px);
  color: #e8edf5;
}

header {
  background-color: #10131a !important;
  background-image:
    linear-gradient(90deg, rgba(139, 92, 246, 0.35), rgba(61, 139, 253, 0.35)) bottom / 100% 1px no-repeat,
    repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.04) 0 1px, transparent 1px 6px),
    repeating-linear-gradient(-45deg, rgba(0, 0, 0, 0.4) 0 1px, transparent 1px 6px) !important;
  border-bottom: 0 !important;
}

header .brand {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
}

.cpr-logo {
  width: 28px;
  height: 32px;
  display: block;
}

.cpr-host {
  font-weight: 600;
  letter-spacing: 0.01em;
}

#mainmenu .nav > li.active > a,
#mainmenu .nav > li > a:hover {
  color: #e8edf5 !important;
}

a {
  color: #3d8bfd;
}

.cbi-button-apply,
.cbi-button-save,
.cbi-button-positive,
.cbi-button-action,
.btn.primary,
.btn.cbi-button-apply,
.btn.cbi-button-save,
.btn.cbi-button-positive,
button.cbi-button-positive,
input[type="submit"].cbi-button-apply {
  border: 1px solid #7c6cf0 !important;
  border-radius: 999px !important;
  color: #e8edf5 !important;
  background-color: #141820 !important;
  background-image:
    linear-gradient(180deg, rgba(255, 255, 255, 0.22), transparent 46%),
    repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.22) 0 2px, rgba(8, 10, 16, 0.2) 2px 4px),
    repeating-linear-gradient(-45deg, rgba(255, 255, 255, 0.1) 0 2px, rgba(0, 0, 0, 0.35) 2px 4px),
    linear-gradient(100deg, rgba(139, 92, 246, 0.55), rgba(61, 139, 253, 0.4)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.28), 0 0 14px rgba(61, 139, 253, 0.28);
  text-shadow: none !important;
}

.cbi-button-remove,
.cbi-button-reset,
.cbi-button-neutral {
  border-radius: 999px !important;
  border-color: #2a3344 !important;
  color: #8b97ab !important;
  background-image: none !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

input,
select,
textarea {
  background: #07080c !important;
  color: #e8edf5 !important;
  border-color: #2a3344 !important;
  border-radius: 8px !important;
}

.alert-message.warning {
  background: #1a140c !important;
  color: #e0a15a !important;
  border: 1px solid #e0a15a !important;
}

footer {
  border-top: 1px solid #2a3344;
}