/* Light theme by default */
:root {
  --foreground-rgb: 17, 24, 39;
  --background-start-rgb: 249, 250, 251;
  --background-end-rgb: 255, 255, 255;
  --sider-bg: #ffffff;
  --menu-text: #4b5563;
  --menu-text-hover: #111827;
  --menu-bg-selected: rgba(59, 130, 246, 0.1);
  --card-bg: #ffffff;
  --card-border: #e5e7eb;
  --text-primary: #111827;
  --text-secondary: #4b5563;
}

/* Dark theme overrides */
.dark {
  --foreground-rgb: 255, 255, 255;
  --background-start-rgb: 17, 24, 39;
  --background-end-rgb: 31, 41, 55;
  --sider-bg: #1f2937;
  --menu-text: #e5e7eb;
  --menu-text-hover: #ffffff;
  --menu-bg-selected: rgba(59, 130, 246, 0.2);
  --card-bg: #1f2937;
  --card-border: #374151;
  --text-primary: #f9fafb;
  --text-secondary: #d1d5db;
}

/* Base styles */
body {
  color: rgb(var(--foreground-rgb));
  background: linear-gradient(
    to bottom,
    rgb(var(--background-start-rgb)),
    rgb(var(--background-end-rgb))
  );
  transition: background-color 0.3s, color 0.3s;
  margin: 0;
  padding: 0;
  min-height: 100vh;
}

/* Smooth transitions for theme changes */
* {
  transition: 
    background-color 0.2s ease, 
    border-color 0.2s ease,
    color 0.2s ease;
}

/* Ant Design overrides */
.ant-layout-sider {
  background: var(--sider-bg) !important;
}

.ant-menu {
  background: transparent !important;
}

.ant-menu-item {
  color: var(--menu-text) !important;
}

.ant-menu-item:hover {
  color: var(--menu-text-hover) !important;
}

.ant-menu-item-selected {
  color: var(--menu-text-hover) !important;
  background-color: var(--menu-bg-selected) !important;
}

/* Card styles */
.ant-card {
  background: var(--card-bg);
  border-color: var(--card-border);
}

.ant-card-head {
  color: var(--text-primary);
  border-color: var(--card-border);
}

.ant-card-body {
  color: var(--text-secondary);
}

/* Table styles */
.ant-table {
  background: var(--card-bg);
  color: var(--text-secondary);
}

.ant-table-thead > tr > th {
  background: var(--sider-bg);
  color: var(--text-primary);
  border-color: var(--card-border);
}

.ant-table-tbody > tr > td {
  border-color: var(--card-border);
}

.ant-table-tbody > tr:hover > td {
  background: var(--menu-bg-selected);
}

/* Form styles */
.ant-form-item-label > label {
  color: var(--text-primary);
}

.ant-input, 
.ant-input-password,
.ant-select-selector,
.ant-picker,
.ant-input-number,
.ant-input-textarea {
  background: var(--card-bg) !important;
  color: var(--text-primary) !important;
  border-color: var(--card-border) !important;
}

.ant-input::placeholder {
  color: var(--text-secondary) !important;
  opacity: 0.7;
}

/* Button styles */
.ant-btn-default {
  background: var(--card-bg);
  border-color: var(--card-border);
  color: var(--text-primary);
}

/* Scrollbar styles */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: var(--sider-bg);
}

::-webkit-scrollbar-thumb {
  background: var(--menu-text);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--menu-text-hover);
}