/* HelloChretien — Styles personnalisés */

/* ── Palette adoucie (override Tailwind) ────────────────────────────────────── */
:root {
  --cp50:  #f5f0fa; --cp100: #ebe3f4; --cp200: #d9ccea;
  --cp500: #9a78c4; --cp600: #7a58ad; --cp700: #6939a7; --cp800: #5a3088;
  --cb100: #e0ebf8; --cb400: #6a9fd4;
  --cb600: #3b6ec5; --cb700: #305bb0; --cb800: #284a94;
}

/* Backgrounds */
.bg-purple-50  { background-color: var(--cp50)  !important; }
.bg-purple-100 { background-color: var(--cp100) !important; }
.bg-purple-600 { background-color: var(--cp600) !important; }
.bg-purple-700 { background-color: var(--cp700) !important; }
.bg-purple-800 { background-color: var(--cp800) !important; }
.bg-blue-100   { background-color: var(--cb100) !important; }
.bg-blue-600   { background-color: var(--cb600) !important; }
.bg-blue-700   { background-color: var(--cb700) !important; }
.bg-blue-800   { background-color: var(--cb800) !important; }

/* Text */
.text-purple-500 { color: var(--cp500) !important; }
.text-purple-600 { color: var(--cp600) !important; }
.text-purple-700 { color: var(--cp700) !important; }
.text-purple-800 { color: var(--cp800) !important; }
.text-blue-400   { color: var(--cb400) !important; }
.text-blue-600   { color: var(--cb600) !important; }
.text-blue-700   { color: var(--cb700) !important; }
.text-blue-800   { color: var(--cb800) !important; }

/* Borders */
.border-purple-700 { border-color: var(--cp700) !important; }
.border-purple-400 { border-color: var(--cp500) !important; }
.border-blue-400   { border-color: var(--cb400) !important; }
.border-blue-600   { border-color: var(--cb600) !important; }

/* Gradients */
.from-purple-700 { --tw-gradient-from: var(--cp700) !important; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, transparent) !important; }
.to-blue-600     { --tw-gradient-to: var(--cb600) !important; }

/* Hover */
.hover\:bg-purple-50:hover  { background-color: var(--cp50)  !important; }
.hover\:bg-purple-200:hover { background-color: var(--cp200) !important; }
.hover\:bg-purple-700:hover { background-color: var(--cp700) !important; }
.hover\:bg-blue-600:hover   { background-color: var(--cb600) !important; }
.hover\:bg-blue-700:hover   { background-color: var(--cb700) !important; }
.hover\:text-blue-600:hover   { color: var(--cb600) !important; }
.hover\:text-purple-500:hover { color: var(--cp500) !important; }
.hover\:text-purple-600:hover { color: var(--cp600) !important; }
.hover\:border-purple-700:hover { border-color: var(--cp700) !important; }

/* Focus rings */
.focus\:ring-purple-500:focus,
.focus\:ring-purple-500       { --tw-ring-color: rgba(122, 88, 173, 0.4) !important; }
.focus\:border-purple-500:focus { border-color: var(--cp500) !important; }

/* ── Cards & animations ─────────────────────────────────────────────────────── */
.event-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 25px rgba(0,0,0,.08);
}

.parish-card { transition: all 0.3s ease; }
.parish-card:hover { transform: scale(1.03); }

@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
.fade-in { animation: fadeIn 1s ease-in; }

/* ── Auth forms ─────────────────────────────────────────────────────────────── */
.auth-page {
  min-height: calc(100vh - 80px);
  display: flex; align-items: center; justify-content: center;
  padding: 3rem 1rem;
  background: linear-gradient(160deg, var(--cp50) 0%, #eef2f6 50%, #f2f5f8 100%);
}

.auth-card {
  width: 100%; max-width: 28rem;
  background: #fff;
  border-radius: 1.25rem;
  box-shadow: 0 12px 40px rgba(74,64,104,.08);
  padding: 2rem 2rem 1.75rem;
}
.auth-card--wide { max-width: 32rem; }

.auth-title {
  text-align: center; font-size: 1.75rem; font-weight: 800;
  color: var(--cp800); margin-bottom: 1.5rem;
}

.auth-form { display: flex; flex-direction: column; gap: 1rem; }

.auth-input, .auth-select {
  width: 100%; padding: 0.8rem 1rem;
  border: 1px solid #e5e7eb; border-radius: 0.75rem;
  font-size: 0.9375rem; background: #fafafa;
  transition: border-color .2s, box-shadow .2s, background .2s;
}
.auth-input:focus, .auth-select:focus {
  outline: none; background: #fff;
  border-color: var(--cp700);
  box-shadow: 0 0 0 3px rgba(92,80,128,.12);
}

.auth-btn {
  width: 100%; padding: 0.85rem; margin-top: 0.25rem;
  background: linear-gradient(135deg, var(--cp700), var(--cb600));
  color: #fff; font-weight: 600; font-size: 0.9375rem;
  border: none; border-radius: 9999px; cursor: pointer;
  transition: opacity .2s, transform .2s;
}
.auth-btn:hover { opacity: .92; transform: translateY(-1px); }

.auth-alert { padding: .75rem 1rem; border-radius: .75rem; font-size: .875rem; margin-bottom: 1rem; }
.auth-alert--error   { background: #fef2f2; border: 1px solid #fecaca; color: #b91c1c; }
.auth-alert--success { background: #f0fdf4; border: 1px solid #bbf7d0; color: #15803d; }
.auth-alert--warn    { background: #fffbeb; border: 1px solid #fde68a; color: #b45309; }

.auth-box { border: 1px solid #e5e7eb; border-radius: .75rem; padding: 1rem; background: #f9fafb; }

.auth-footer { text-align: center; font-size: .875rem; color: #6b7280; margin-top: 1.25rem; }
.auth-footer a { color: var(--cp700); font-weight: 500; }
.auth-footer a:hover { color: var(--cp800); }

.auth-label { display: block; font-size: .8125rem; font-weight: 500; color: #374151; margin-bottom: .35rem; }

.auth-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 480px) { .auth-row { grid-template-columns: 1fr; } }
