/* KxEx Control Center — Navy / Blue / Purple */

:root {
  --kxex-blue: #3946FF;
  --kxex-purple: #8025FF;
  --kxex-cyan: #7DD3FC;
  --kxex-bg: #0B1020;
  --kxex-card: #151D32;
  --kxex-border: rgba(125, 211, 252, 0.18);
}

/* Main page backgrounds */
html,
body,
body > div,
#page_container {
  background-color: var(--kxex-bg) !important;
}

body {
  background-image:
    radial-gradient(ellipse at 0% 0%, rgba(57,70,255,.17), transparent 42%),
    radial-gradient(ellipse at 100% 0%, rgba(128,37,255,.13), transparent 42%) !important;
  background-attachment: fixed !important;
}

/* Homepage content containers */
#page_container,
#inner_container,
#information-widgets,
#services,
#bookmarks {
  background-color: transparent !important;
}

/* Cards and widgets */
.service-card,
.service,
.bookmark,
.bookmark-list,
.widget,
.information-widget,
section {
  border-radius: 12px !important;
}

/* Service cards */
.service-card,
.service > a,
.bookmark,
.bookmark-list > li {
  border: 1px solid var(--kxex-border) !important;
  transition: transform .18s ease, box-shadow .18s ease !important;
}

.service-card:hover,
.service > a:hover,
.bookmark:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 22px rgba(57,70,255,.20) !important;
}

/* Search and inputs */
input,
select {
  border-radius: 9px !important;
}

/* Links */
a {
  transition: color .15s ease;
}

a:hover {
  color: var(--kxex-cyan) !important;
}

/* Subtle separators */
hr,
header,
nav {
  border-color: var(--kxex-border) !important;
}

/* ===== KxEx visual refinement ===== */

/* Clearer group headings */
h2, h3 {
  color: #E5E9FF !important;
  letter-spacing: .2px;
}

/* Brighter service cards */
.service-card,
.service > a {
  background: linear-gradient(
    135deg,
    rgba(30, 43, 72, .96),
    rgba(24, 30, 55, .96)
  ) !important;
  border: 1px solid rgba(87, 105, 255, .25) !important;
  border-radius: 13px !important;
  box-shadow: 0 4px 14px rgba(4, 8, 25, .12);
}

/* Purple-blue hover glow */
.service-card:hover,
.service > a:hover {
  border-color: rgba(128, 37, 255, .75) !important;
  box-shadow:
    0 0 0 1px rgba(57, 70, 255, .18),
    0 8px 24px rgba(57, 70, 255, .20) !important;
}

/* Cleaner description text */
.service-description,
.service-card p {
  color: #B8C5E2 !important;
}

/* More visible search field */
input[type="text"],
input[type="search"] {
  background: #151D32 !important;
  border: 1px solid rgba(125, 211, 252, .25) !important;
  color: #F4F6FF !important;
}

/* Consistent subtle borders */
.widget,
.bookmark,
.bookmark-list > li {
  border-color: rgba(125, 211, 252, .16) !important;
  border-radius: 12px !important;
}

/* Keep transitions smooth */
.service-card,
.service > a,
.bookmark,
input {
  transition: all .18s ease !important;
}