/* ============================================================
   Farmind v2 — application styles
   Loaded after Tailwind. Holds:
   - CSS custom property tokens (for JS / non-Tailwind use)
   - Custom utilities not covered by Tailwind
   - Print + a11y refinements
   ============================================================ */

:root {
  /* Brand */
  --color-primary-50:  #f0fdf2;
  --color-primary-100: #dcfce4;
  --color-primary-200: #bbf7c8;
  --color-primary-300: #86efa1;
  --color-primary-400: #6ee97a; /* brand */
  --color-primary-500: #4dd66b;
  --color-primary-600: #3bbe5a;
  --color-primary-700: #2ea448;
  --color-primary-800: #22833a;
  --color-primary-900: #1a6a30;

  /* Status (from highlights palette) */
  --color-info:     #70d1eb;
  --color-success:  #a1dea6;
  --color-progress: #c2e87f;
  --color-warning:  #f0f260;

  /* Accent + danger */
  --color-accent: #f7931e;
  --color-danger: #ef4444;

  /* Neutrals */
  --color-ink:        #000000;
  --color-ink-soft:   #606060;
  --color-ink-muted:  #b3b3b3;
  --color-surface:    #ffffff;
  --color-surface-alt:#e8e8e8;

  /* Layout */
  --header-h:     56px;
  --sidebar-w:    240px;
  --sidebar-w-sm: 64px;
  --tabbar-h:     64px;

  /* Motion */
  --t-fast: 120ms;
  --t-base: 200ms;
}

/* Self-hosted Inter font (weights used in templates: 400, 600, 700) */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/inter-v13-latin-400.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/inter-v13-latin-600.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/inter-v13-latin-700.woff2') format('woff2');
}

/* Base */
html { -webkit-text-size-adjust: 100%; }
body { font-family: 'Inter', system-ui, -apple-system, sans-serif; }

/* Brand gradient utility */
.gradient-brand {
  background: linear-gradient(120deg, #70d1eb 0%, #a1dea6 33%, #c2e87f 66%, #f0f260 100%);
}
.gradient-brand-soft {
  background: linear-gradient(120deg, rgba(112,209,235,.12) 0%, rgba(161,222,166,.12) 33%, rgba(194,232,127,.12) 66%, rgba(240,242,96,.12) 100%);
}

/* Focus ring */
.ring-brand:focus,
.ring-brand:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(110, 233, 122, 0.35);
}

/* Hide scrollbars for tab strips while keeping scroll */
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
.no-scrollbar::-webkit-scrollbar { display: none; }

/* Fade-right mask for horizontal scroll affordance */
.mask-fade-right {
  mask-image: linear-gradient(to right, black 85%, transparent 100%);
  -webkit-mask-image: linear-gradient(to right, black 85%, transparent 100%);
}

/* Skip link for a11y */
.skip-link {
  position: absolute; top: -40px; left: 0;
  background: var(--color-ink); color: white; padding: 8px 16px; z-index: 100;
}
.skip-link:focus { top: 0; }

/* Reduce motion */
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
  .toast { transition: none !important; }
}

/* Print */
@media print {
  .no-print { display: none !important; }
  body { background: white; }
}