/* FyxInn Maintenance — Dark / Neon Theme */

/* ── All Round Gothic Font ──────────────────────────────── */
@font-face {
  font-family: 'All Round Gothic';
  src: url('/src/assets/fonts/AllRoundGothic-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'All Round Gothic';
  src: url('/src/assets/fonts/AllRoundGothic-Semibold.otf') format('opentype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'All Round Gothic';
  src: url('/src/assets/fonts/AllRoundGothic-Bold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* ── Custom Scrollbar ───────────────────────────────────── */
.custom-scrollbar::-webkit-scrollbar {
  width: 4px;
}
.custom-scrollbar::-webkit-scrollbar-track {
  background: transparent;
}
.custom-scrollbar::-webkit-scrollbar-thumb {
  background: rgba(0, 212, 200, 0.25);
  border-radius: 4px;
}
.custom-scrollbar::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 212, 200, 0.5);
}

/* ── Neon Glow Utilities ────────────────────────────────── */
.neon-text-teal {
  color: #00d4c8;
  text-shadow: 0 0 8px rgba(0, 212, 200, 0.6), 0 0 20px rgba(0, 212, 200, 0.3);
}
.neon-text-blue {
  color: #00b4d8;
  text-shadow: 0 0 8px rgba(0, 180, 216, 0.6), 0 0 20px rgba(0, 180, 216, 0.3);
}
.neon-border-teal {
  border-color: #00d4c8;
  box-shadow: 0 0 8px rgba(0, 212, 200, 0.3), inset 0 0 8px rgba(0, 212, 200, 0.05);
}
.neon-bg-teal {
  background: linear-gradient(135deg, #00d4c8 0%, #00b4d8 100%);
  box-shadow: 0 0 20px rgba(0, 212, 200, 0.4), 0 4px 15px rgba(0, 212, 200, 0.2);
}
.neon-ring:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px #0d1117, 0 0 0 4px #00d4c8, 0 0 12px rgba(0, 212, 200, 0.4);
}

/* ── Dark Input Resets ──────────────────────────────────── */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
  -webkit-text-fill-color: #c9d1d9;
  -webkit-box-shadow: 0 0 0px 1000px #161b22 inset;
  caret-color: #00d4c8;
}

/* ── Subtle grid background for main container ──────────── */
.bg-grid {
  background-image:
    linear-gradient(rgba(0, 212, 200, 0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 212, 200, 0.03) 1px, transparent 1px);
  background-size: 32px 32px;
}

/* ── Animated neon pulse for active indicators ──────────── */
@keyframes neon-pulse {
  0%, 100% { box-shadow: 0 0 6px rgba(0, 212, 200, 0.4); }
  50%       { box-shadow: 0 0 16px rgba(0, 212, 200, 0.8), 0 0 30px rgba(0, 212, 200, 0.3); }
}
.neon-pulse {
  animation: neon-pulse 2.5s ease-in-out infinite;
}

/* ── Sidebar active item gradient bar ───────────────────── */
.nav-active::before {
  content: '';
  position: absolute;
  left: 0;
  top: 20%;
  height: 60%;
  width: 3px;
  background: linear-gradient(180deg, #00d4c8, #00b4d8);
  border-radius: 0 3px 3px 0;
  box-shadow: 0 0 8px rgba(0, 212, 200, 0.7);
}