/*
 * Application-wide styles. Custom classes used by Devise and layout
 * (Tailwind build does not include these; they are defined in tailwind/application.css
 * but the compiler only outputs utilities).
 */

/* Фон страниц авторизации: градиент светло-голубой → светло-серый */
.auth-page-gradient {
  background: linear-gradient(to bottom right, #e4edf8 0%, #f9fafc 50%, #f8fafc 100%);
}

/* Шапка: glass */
.glass {
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

/* Зелёная кнопка: объём + мягкая тень */
.btn-primary-green {
  background: linear-gradient(to bottom right, #34d399 0%, #10b981 50%, #059669 100%);
  box-shadow: 0 4px 14px 0 rgba(5, 150, 105, 0.25);
}
.btn-primary-green:hover {
  box-shadow: 0 6px 20px 0 rgba(5, 150, 105, 0.35);
}

/* Shimmer на кнопке */
.btn-shine {
  position: relative;
  overflow: hidden;
}
.btn-shine::after {
  content: "";
  position: absolute;
  inset: 0;
  left: -100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
  animation: btn-shine-shimmer 3s infinite;
}
@keyframes btn-shine-shimmer {
  0% { transform: translateX(0); }
  100% { transform: translateX(200%); }
}

/* Design system tokens — fallback (Tailwind build может не включать @theme кастом) */
:root {
  --color-primary-50: #e6f0ff;
  --color-primary-100: #b3d1ff;
  --color-primary-500: #005bff;
  --color-primary-600: #0047cc;
  --color-accent-500: #10b981;
  --color-accent-600: #059669;
  --color-background: #ffffff;
  --color-surface: #f8fafc;
  --color-surface-alt: #f1f5f9;
  --color-text-primary: #111827;
  --color-text-secondary: #4b5563;
  --color-text-muted: #6b7280;
  --color-border: #e5e7eb;
  --color-border-light: #f3f4f6;
  --color-error: #ef4444;
}

.bg-primary-500 { background-color: #005bff; }
.bg-primary-600 { background-color: #0047cc; }
.hover\:bg-primary-600:hover { background-color: #0047cc; }
.hover\:bg-primary-50:hover { background-color: #e6f0ff; }
.text-primary-500 { color: #005bff; }
.text-primary-600 { color: #0047cc; }
.text-primary-700 { color: #003399; }
.border-primary-500 { border-color: #005bff; }
.focus\:border-primary-500:focus { border-color: #005bff; }
.focus\:ring-primary-500\/20:focus { --tw-ring-color: rgba(0, 91, 255, 0.2); box-shadow: 0 0 0 2px var(--tw-ring-color); }
.ring-primary-500 { --tw-ring-color: #005bff; }

.bg-accent-50 { background-color: #ecfdf5; }
.bg-accent-100 { background-color: #d1fae5; }
.bg-accent-500 { background-color: #10b981; }
.bg-accent-600 { background-color: #059669; }
.text-accent-600 { color: #059669; }
.text-accent-700 { color: #047857; }
.border-accent-200 { border-color: #a7f3d0; }
.border-accent-500 { border-color: #10b981; }

.bg-background { background-color: #ffffff; }
.bg-surface { background-color: #f8fafc; }
.bg-surface-alt { background-color: #f1f5f9; }
.hover\:bg-surface-alt:hover { background-color: #f1f5f9; }
.hover\:bg-slate-100:hover { background-color: #f1f5f9; }

.text-text-primary { color: #111827; }
.text-text-secondary { color: #4b5563; }
.text-text-muted { color: #6b7280; }
.text-text-subtle { color: #9ca3af; }

.border-border { border-color: #e5e7eb; }
.border-border-light { border-color: #f3f4f6; }
.bg-border { background-color: #e5e7eb; }
.hover\:text-primary-600:hover { color: #0047cc; }
.hover\:text-primary-700:hover { color: #003399; }
.focus\:ring-primary-500:focus { --tw-ring-color: #005bff; box-shadow: 0 0 0 2px #005bff; }
.focus\:ring-offset-2:focus { box-shadow: 0 0 0 2px #005bff, 0 0 0 4px white; }

.bg-error-bg { background-color: #fef2f2; }
.text-error { color: #ef4444; }
.border-error { border-color: #ef4444; }
.focus\:ring-error\/20:focus { --tw-ring-color: rgba(239, 68, 68, 0.2); }

/* ozon/mint (legacy) */
.bg-ozon-500 { background-color: #005bff; }
.bg-ozon-600 { background-color: #0047cc; }
.text-ozon-500 { color: #005bff; }
.shadow-ozon-500\/30 { box-shadow: 0 10px 15px -3px rgba(0, 91, 255, 0.3); }
.bg-mint-500 { background-color: #10b981; }
.bg-mint-600 { background-color: #059669; }
.from-mint-500 { --tw-gradient-from: #10b981; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.to-mint-600 { --tw-gradient-to: #059669; }
.from-ozon-500 { --tw-gradient-from: #005bff; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.to-ozon-600 { --tw-gradient-to: #0047cc; }
.border-ozon-500 { border-color: #005bff; }
.ring-ozon-500\/20 { --tw-ring-color: rgba(0, 91, 255, 0.2); }
.focus\:border-ozon-500:focus { border-color: #005bff; }
.focus\:ring-ozon-500:focus { --tw-ring-color: #10b981; }
.ring-mint-500 { --tw-ring-color: #10b981; }
.border-accent-200 { border-color: #a7f3d0; }
.border-error { border-color: #ef4444; }

/* Убрать стрелки вверх/вниз у number input */
.input-no-spinner::-webkit-inner-spin-button,
.input-no-spinner::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.input-no-spinner {
  -moz-appearance: textfield;
}
