:root {
  --color-bg: #0f1115;
  --color-surface: #1a1d24;
  --color-surface-alt: #20242d;
  --color-accent: #ff7a3d;
  --color-accent-2: #2575fc;
  --color-text: #f5f7ff;
  --color-text-muted: #a6aebe;
  --sidebar-width: 260px;
  --topbar-height: 64px;
  --border-radius: 14px;
  --transition: 180ms ease;
  font-size: 16px;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: 'Poppins', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background: linear-gradient(135deg, rgba(16,18,25,1) 0%, rgba(12,14,20,1) 100%);
  color: var(--color-text);
  min-height: 100vh;
  overflow-x: hidden;
  max-width: 100vw;
}

/* Custom Scrollbars - Dark Theme with Orange Accent */
::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

::-webkit-scrollbar-track {
  background: rgba(15, 17, 21, 0.5);
  border-radius: 6px;
}

::-webkit-scrollbar-thumb {
  background: linear-gradient(135deg, 
    rgba(255, 122, 61, 0.6) 0%, 
    rgba(255, 122, 61, 0.4) 100%);
  border-radius: 6px;
  border: 2px solid rgba(15, 17, 21, 0.5);
  transition: background 0.2s ease;
}

::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(135deg, 
    rgba(255, 122, 61, 0.8) 0%, 
    rgba(255, 122, 61, 0.6) 100%);
}

::-webkit-scrollbar-thumb:active {
  background: linear-gradient(135deg, 
    rgba(255, 122, 61, 1) 0%, 
    rgba(255, 122, 61, 0.8) 100%);
}

/* Firefox scrollbar styling */
* {
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 122, 61, 0.5) rgba(15, 17, 21, 0.5);
}

a {
  color: inherit;
  text-decoration: none;
}

p {
  line-height: 1.6;
}

button {
  font: inherit;
  cursor: pointer;
}

main {
  min-height: calc(100vh - var(--topbar-height));
}

.hidden {
  display: none !important;
}

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

.card {
  background: var(--color-surface);
  border-radius: var(--border-radius);
  padding: 1.5rem;
  box-shadow: 0 20px 50px -25px rgba(0, 0, 0, 0.6);
  transition: transform var(--transition), box-shadow var(--transition);
}

.card:hover {
  transform: translateY(-3px);
  box-shadow: 0 28px 60px -30px rgba(10, 15, 35, 0.65);
}

.grid {
  display: grid;
  gap: 1.5rem;
}

.section-title {
  margin: 0 0 1.5rem;
  font-size: 1.8rem;
  font-weight: 600;
}

.action-button--outline {
  background: transparent;
  border: 1px solid rgba(255, 122, 61, 0.6);
}

.action-button--outline:hover {
  background: rgba(255, 122, 61, 0.16);
  color: var(--color-text);
}
.action-button--outline-green {
  background: transparent;
  border: 1px solid rgba(46, 204, 113, 0.7);
  color: #2ecc71;
}

.action-button--outline-green:hover {
  background: rgba(46, 204, 113, 0.14);
  color: #b2ffd4;
}

.action-button--outline-blue {
  background: transparent;
  border: 1px solid rgba(37, 117, 252, 0.7);
  color: #5aa0ff;
}

.action-button--outline-blue:hover {
  background: rgba(37, 117, 252, 0.14);
  color: #d3e4ff;
}

.action-button--outline-green {
  background: transparent !important;
  border: 1.5px solid rgba(46, 204, 113, 0.85) !important;
  color: #2ecc71 !important;
}

.action-button--outline-green:hover {
  background: rgba(46, 204, 113, 0.18) !important;
  color: #b2ffd4 !important;
}

.action-button--outline-blue {
  background: transparent !important;
  border: 1.5px solid rgba(37, 117, 252, 0.85) !important;
  color: #5aa0ff !important;
}

.action-button--outline-blue:hover {
  background: rgba(37, 117, 252, 0.18) !important;
  color: #d3e4ff !important;
}