src/app/globals.css - master - mirsud/casectrl

src/app/globals.css
187 строк4 KB
94StarKing94
ав
28 июл 2026, 13:44
28 июл 2026, 13:44fd21e96
@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  :root {
    --background: 210 40% 98%;
    --foreground: 222 47% 11%;

    --card: 0 0% 100%;
    --card-foreground: 222 47% 11%;

    --popover: 0 0% 100%;
    --popover-foreground: 222 47% 11%;

    --primary: 215 60% 22%;
    --primary-foreground: 45 65% 92%;

    --secondary: 214 32% 91%;
    --secondary-foreground: 215 60% 22%;

    --muted: 214 32% 95%;
    --muted-foreground: 215 16% 47%;

    --accent: 38 70% 50%;
    --accent-foreground: 215 60% 12%;

    --destructive: 0 72% 45%;
    --destructive-foreground: 0 0% 98%;

    --success: 142 60% 35%;
    --success-foreground: 0 0% 98%;

    --warning: 32 95% 44%;
    --warning-foreground: 0 0% 98%;

    --info: 200 80% 45%;
    --info-foreground: 0 0% 98%;

    --border: 214 32% 88%;
    --input: 214 32% 88%;
    --ring: 215 60% 30%;

    --radius: 0.625rem;

    --chart-1: 215 60% 30%;
    --chart-2: 38 70% 50%;
    --chart-3: 142 60% 35%;
    --chart-4: 200 80% 45%;
    --chart-5: 280 50% 45%;

    --sidebar-background: 215 60% 14%;
    --sidebar-foreground: 210 40% 96%;
    --sidebar-primary: 38 70% 55%;
    --sidebar-primary-foreground: 215 60% 12%;
    --sidebar-accent: 215 50% 22%;
    --sidebar-accent-foreground: 210 40% 96%;
    --sidebar-border: 215 40% 22%;
    --sidebar-ring: 38 70% 55%;
  }

  .dark {
    --background: 222 47% 6%;
    --foreground: 210 40% 96%;

    --card: 222 47% 9%;
    --card-foreground: 210 40% 96%;

    --popover: 222 47% 8%;
    --popover-foreground: 210 40% 96%;

    --primary: 38 70% 55%;
    --primary-foreground: 222 47% 8%;

    --secondary: 215 35% 18%;
    --secondary-foreground: 210 40% 96%;

    --muted: 215 35% 14%;
    --muted-foreground: 215 20% 65%;

    --accent: 38 70% 55%;
    --accent-foreground: 222 47% 8%;

    --destructive: 0 65% 45%;
    --destructive-foreground: 210 40% 98%;

    --success: 142 55% 45%;
    --success-foreground: 222 47% 8%;

    --warning: 32 90% 55%;
    --warning-foreground: 222 47% 8%;

    --info: 200 75% 55%;
    --info-foreground: 222 47% 8%;

    --border: 215 35% 18%;
    --input: 215 35% 18%;
    --ring: 38 70% 55%;

    --chart-1: 38 70% 55%;
    --chart-2: 200 75% 55%;
    --chart-3: 142 55% 50%;
    --chart-4: 280 60% 65%;
    --chart-5: 0 70% 60%;

    --sidebar-background: 222 47% 5%;
    --sidebar-foreground: 210 40% 96%;
    --sidebar-primary: 38 70% 55%;
    --sidebar-primary-foreground: 222 47% 8%;
    --sidebar-accent: 215 35% 14%;
    --sidebar-accent-foreground: 210 40% 96%;
    --sidebar-border: 215 35% 14%;
    --sidebar-ring: 38 70% 55%;
  }
}

@layer base {
  * {
    @apply border-border;
  }
  body {
    @apply bg-background text-foreground;
    font-feature-settings: "rlig" 1, "calt" 1;
  }
}

@layer utilities {
  .court-gradient {
    background-image: linear-gradient(
      135deg,
      hsl(215 60% 22%) 0%,
      hsl(215 55% 16%) 60%,
      hsl(222 47% 9%) 100%
    );
  }
  .court-gradient-light {
    background-image: linear-gradient(
      135deg,
      hsl(215 60% 22%) 0%,
      hsl(215 55% 30%) 100%
    );
  }
  .gold-text {
    background: linear-gradient(
      135deg,
      hsl(38 90% 60%) 0%,
      hsl(45 95% 70%) 50%,
      hsl(38 90% 55%) 100%
    );
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .pulse-dot {
    position: relative;
  }
  .pulse-dot::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: currentColor;
    opacity: 0.6;
    animation: pulse 2s ease-out infinite;
  }
  @keyframes pulse {
    0% {
      transform: scale(1);
      opacity: 0.6;
    }
    100% {
      transform: scale(2.4);
      opacity: 0;
    }
  }
  .scrollbar-thin::-webkit-scrollbar {
    width: 6px;
    height: 6px;
  }
  .scrollbar-thin::-webkit-scrollbar-thumb {
    background: hsl(var(--border));
    border-radius: 3px;
  }
  .scrollbar-thin::-webkit-scrollbar-thumb:hover {
    background: hsl(var(--muted-foreground) / 0.5);
  }
}