/* Form-field visibility fix.
   Radix Themes' default "surface" text fields / selects render as a muddy low-contrast fill on
   our warm "sand" gray palette, so inputs looked disabled and placeholders were hard to read.
   Force a clean white field with a clear border, a coral focus ring, and readable placeholder. */

.rt-TextFieldRoot,
.rt-TextAreaRoot,
.rt-SelectTrigger {
  background-color: #FFFFFF !important;
  box-shadow: inset 0 0 0 1px #C7BFB0 !important;
}

.rt-TextFieldRoot:focus-within,
.rt-TextAreaRoot:focus-within,
.rt-SelectTrigger:focus-visible,
.rt-SelectTrigger[data-state="open"] {
  box-shadow: inset 0 0 0 1.5px #E07856 !important;
}

.rt-TextFieldInput,
.rt-TextAreaInput,
.rt-SelectTrigger {
  color: #2C2A27 !important;
}

.rt-TextFieldInput::placeholder,
.rt-TextAreaInput::placeholder {
  color: #6F6A60 !important;   /* >=4.5:1 on the white field (was #948D81 ~3.4:1, below WCAG AA) */
  opacity: 1 !important;
}

/* the inner <input> sits on top of the white root, keep it transparent so the root shows */
.rt-TextFieldInput,
.rt-TextAreaInput {
  background-color: transparent !important;
}

/* Radix renders dialogs and dropdowns in a PORTAL on document.body, which escapes the forced-light
   theme and can inherit the OS dark mode, leaving our dark text on a dark surface (unreadable).
   Force every portaled surface to the light card background with dark text. */
.rt-BaseDialogContent,
.rt-DialogContent,
.rt-AlertDialogContent,
.rt-SelectContent,
.rt-PopoverContent,
.rt-HoverCardContent,
.rt-DropdownMenuContent {
  background-color: #FFFFFF !important;
  color: #2C2A27 !important;
}
.rt-SelectItem,
.rt-DropdownMenuItem {
  color: #2C2A27 !important;
}

/* Reveal animation for the e-card / gift-claim "moment" (the screenshot-worthy emotional payload).
   Respects reduced-motion. */
@keyframes giftloop-reveal {
  0% { opacity: 0; transform: translateY(10px) scale(0.96); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}
.gl-reveal { animation: giftloop-reveal 620ms cubic-bezier(0.22, 1, 0.36, 1) both; }
.gl-pop { animation: giftloop-reveal 520ms cubic-bezier(0.34, 1.56, 0.64, 1) both; }
.gl-reveal-2 { animation: giftloop-reveal 620ms cubic-bezier(0.22, 1, 0.36, 1) 120ms both; }
.gl-reveal-3 { animation: giftloop-reveal 620ms cubic-bezier(0.22, 1, 0.36, 1) 240ms both; }
@media (prefers-reduced-motion: reduce) {
  .gl-reveal, .gl-pop, .gl-reveal-2, .gl-reveal-3 { animation: none; }
}

/* Secondary gray buttons (Cancel, "Not now", "Download my data", "Log in", the edit/delete/logout
   icons) render too faint on the warm "sand" palette and can vanish into the cream background.
   Darken their text and give soft/outline a clearer surface so every control stays readable. */
.rt-Button[data-accent-color="gray"],
.rt-IconButton[data-accent-color="gray"] {
  color: #3D3A34 !important;
}
.rt-variant-soft[data-accent-color="gray"] {
  background-color: #E7E0D5 !important;
}
.rt-variant-outline[data-accent-color="gray"] {
  box-shadow: inset 0 0 0 1px #AEA593 !important;
}