:root {
  --tennis-ball: #dfff00;
  --tennis-green: #228b22;
  --tennis-primary: #196b2c;
  --tennis-primary-hover: #125523;
  --tennis-primary-soft: #e8f4e8;
  --tennis-clay: #e2725b;
  --tennis-clay-dark: #963e2c;
  --tennis-background: #f4f6f4;
  --tennis-surface: #ffffff;
  --tennis-surface-translucent: rgb(255 255 255 / 94%);
  --tennis-text: #1a1c1e;
  --tennis-text-muted: #4d5750;
  --tennis-border: #d5ded7;
  --tennis-focus: #0a4a24;
  --tennis-radius-lg: 1.75rem;
  --tennis-radius-md: 0.875rem;
  --tennis-shadow: 0 1.5rem 4.5rem rgb(10 35 20 / 24%);
  --tennis-dashboard-background: #f5f7f4;
  --tennis-dashboard-sidebar: #fbfcfa;
  --tennis-dashboard-card: #ffffff;
  --tennis-dashboard-border: #e4e9e3;
  --tennis-dashboard-shadow: 0 0.5rem 1.8rem rgb(28 56 37 / 8%);
  --tennis-background-image: url("/images/background.jpeg");
  --tennis-dashboard-hero-background:
    linear-gradient(
      90deg,
      rgb(4 16 8 / 75%) 0%,
      rgb(7 20 10 / 50%) 48%,
      rgb(7 14 8 / 65%) 100%
    ),
    var(--tennis-background-image);
}