/*
 * Vortex Hosting - Main Stylesheet
 * Applies to both frontend and admin views.
 */

:root {
  --vortex-bg: #0f172a;           /* dark navy background */
  --vortex-surface: #1e293b;      /* slightly lighter surface */
  --vortex-accent: #22d3ee;       /* cyan/blue highlight */
  --vortex-green: #10b981;        /* neon green */
  --vortex-text: #f1f5f9;         /* light text */
}

body, .wrap {
  background: var(--vortex-bg);
  color: var(--vortex-text);
  font-family: 'Inter', 'Segoe UI', sans-serif;
}

h1, h2, h3 {
  color: var(--vortex-accent);
  margin-bottom: 0.5em;
}

a.button,
button.button,
.button-primary {
  background-color: var(--vortex-accent);
  color: #fff !important;
  border: none;
  border-radius: 8px;
  padding: 8px 14px;
  transition: background 0.2s;
}

a.button:hover,
button.button:hover,
.button-primary:hover {
  background-color: var(--vortex-green);
  cursor: pointer;
}

.vortex-card {
  background: var(--vortex-surface);
  border-radius: 12px;
  padding: 20px;
  margin: 20px 0;
  box-shadow: 0 2px 8px rgba(0,0,0,0.4);
}

.vortex-template {
  max-width: 900px;
  margin: 40px auto;
  background: var(--vortex-surface);
  padding: 30px;
  border-radius: 16px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.5);
}

.vortex-links {
  display: flex;
  gap: 12px;
  margin-top: 20px;
}

table.widefat {
  background: var(--vortex-surface);
  color: var(--vortex-text);
}

table.widefat th {
  background: rgba(255,255,255,0.05);
}

.vortex-afk-template {
  text-align: center;
}

.vortex-afk-template #afk-display {
  font-size: 1.2em;
  margin-top: 20px;
}