/*
 * UniFi OS Color Theme
 * Only colors, no layout changes
 */

:root {
  --unifi-bg: #111827;
  --unifi-bg-light: #1f2937;
  --unifi-accent: #0ea5e9;
  --unifi-accent-hover: #38bdf8;
  --unifi-text: #f9fafb;
  --unifi-text-muted: #9ca3af;
  --unifi-border: #374151;
}

/* Base backgrounds */
html, body {
  background-color: var(--unifi-bg);
}

.lm-animated-bg {
  display: none;
}

/* Main container */
.page-content {
  background: linear-gradient(135deg, #1e3a5f, #0ea5e9);
}

/* Preloader */
.preloader {
  background: var(--unifi-bg);
}

.preloader-spinner {
  background-color: var(--unifi-accent);
}

/* Content sections */
.animated-section,
.single-page-content {
  background-color: var(--unifi-bg);
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
  color: var(--unifi-text);
}

p, .info-list .value {
  color: var(--unifi-text-muted);
}

/* Accent color replacements (orange -> blue) */
.page-title h2 span,
.block-title h3 span,
.info-list .title,
.timeline-second-style .item-period,
.lm-info-block i,
.certi-id,
.info-block-w-icon i {
  color: var(--unifi-accent);
}

/* Timeline */
.timeline-second-style .divider {
  background-color: var(--unifi-border);
}

.timeline-second-style .divider:before {
  background-color: var(--unifi-accent);
}

.timeline-second-style .divider:after {
  background-color: var(--unifi-bg);
  border-color: var(--unifi-accent);
}

.timeline-second-style .item-title {
  color: var(--unifi-text);
}

.timeline-second-style .item-company {
  color: var(--unifi-text-muted);
}

/* Skills tags */
.knowledges li {
  background-color: var(--unifi-accent);
}

/* Certificates */
.certificate-item {
  background-color: var(--unifi-bg-light);
  border-color: var(--unifi-border);
}

.certi-logo {
  background-color: var(--unifi-bg);
}

.certi-title h4 {
  color: var(--unifi-text);
}

.certi-date {
  color: var(--unifi-text-muted);
}

/* Contact blocks */
.lm-info-block {
  background-color: var(--unifi-bg-light);
  border-color: var(--unifi-border);
}

.lm-info-block h4 {
  color: var(--unifi-text);
}

/* Navigation menu */
ul.main-menu {
  background-color: var(--unifi-bg-light);
  border: 1px solid var(--unifi-border);
}

ul.main-menu a {
  color: var(--unifi-text-muted);
}

ul.main-menu a.active,
ul.main-menu a:hover {
  color: var(--unifi-accent);
}

ul.main-menu .link-text {
  background-color: var(--unifi-accent);
}

/* Arrow navigation */
.lmpixels-arrows-nav {
  background-color: var(--unifi-bg-light);
  border: 1px solid var(--unifi-border);
}

.lmpixels-arrows-nav div {
  color: var(--unifi-text-muted);
}

.lmpixels-arrows-nav div:hover {
  color: var(--unifi-accent);
}

/* Buttons */
.btn-primary,
button,
input[type="submit"] {
  background-color: var(--unifi-accent);
  border-color: var(--unifi-accent);
  color: #fff;
}

.btn-primary:hover,
button:hover,
input[type="submit"]:hover {
  background-color: var(--unifi-accent-hover);
  border-color: var(--unifi-accent-hover);
  color: #fff;
}

.header-buttons .btn-primary {
  background-color: transparent;
  border-color: #fff;
  color: #fff;
}

.header-buttons .btn-primary:hover {
  background-color: var(--unifi-accent);
  border-color: var(--unifi-accent);
}

/* Dots pattern (orange -> blue) */
.page-title:after,
.block-title:after,
.header-photo:after {
  background-image: radial-gradient(var(--unifi-accent) 1px, transparent 1px);
}

/* Scrollbar */
.ps:hover > .ps__scrollbar-y-rail:hover > .ps__scrollbar-y {
  background-color: var(--unifi-accent);
}

/* Mobile menu */
@media only screen and (max-width: 1024px) {
  .header {
    background-color: var(--unifi-accent);
  }

  .menu-toggle {
    background-color: var(--unifi-accent);
  }

  .lmpixels-arrows-nav {
    border-color: var(--unifi-accent);
  }
}

/* Links */
a {
  color: var(--unifi-accent);
}

a:hover {
  color: var(--unifi-accent-hover);
}

/* Social links in header stay white */
.social-links ul li a {
  color: #fff;
}

/* Home page title */
.title-block h2 {
  color: var(--unifi-text);
}

.title-block .sp-subtitle {
  color: var(--unifi-text-muted);
}