@import "tailwindcss";

@theme {
  --color-brand-primary: #ef4923;
  --color-brand-secondary: #f58220;
  --color-brand-background: #fcfaf7;
  --color-brand-surface: #ffffff;
  --color-text-main: #2a2a2a;
  --color-text-muted: #707070;
  
  --color-status-success: #2e7d32;
  --color-status-warning: #ed6c02;
  --color-status-error: #d32f2f;
}

:root {
  --background: #fcfaf7;
  --foreground: #2a2a2a;
}

body {
  background-color: var(--background);
  color: var(--foreground);
  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
  margin: 0;
  padding: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: #f1f1f1;
}
::-webkit-scrollbar-thumb {
  background: #c1c1c1;
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
  background: #a8a8a8;
}

/* Base Accessibility Touch Target Class */
.touch-target {
  min-height: 48px;
  min-width: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Soft Cards */
.gs-card {
  background: #ffffff;
  border: 1px solid #e5e5e5;
  border-radius: 12px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.02);
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}
.gs-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  border-color: #ef492333;
}

/* Animations */
@keyframes slideIn {
  from {
    transform: translateX(-100%);
  }
  to {
    transform: translateX(0);
  }
}
.animate-slide-in {
  animation: slideIn 0.25s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}