/* Raysor Technologies public form Liquid Glass primitives.
   Shared by public intake and support/payment-adjacent forms. This layer owns
   adaptive field geometry, validation/busy feedback, touch sizing, and
   accessibility fallbacks without changing submission or provider behavior. */

.public-form-surface {
  --form-control-min: 54px;
  --form-control-radius: 18px;
  --form-field-gap: clamp(14px, 2vw, 22px);
  --form-panel-gap: clamp(18px, 2.8vw, 34px);
  --form-edge: rgba(211, 235, 252, .18);
  --form-edge-focus: rgba(213, 239, 255, .62);
  --form-invalid: #ff9b9b;
  --form-success: #9ee8c0;
  --form-surface: rgba(3, 11, 19, .74);
  --form-surface-focus: rgba(5, 16, 27, .90);
}

.public-form-surface :is(.form-shell, .support-grid, .field-grid, .tier-grid) {
  min-width: 0;
}

.public-form-surface :is(.form-panel, .info-panel, .support-card) {
  min-width: 0;
  container-type: inline-size;
}

.public-form-surface .field,
.public-form-surface .amount-entry,
.public-form-surface .check-row,
.public-form-surface .turnstile-slot,
.public-form-surface .form-status {
  min-width: 0;
  max-width: 100%;
}

.public-form-surface .field {
  display: grid;
  gap: 8px;
  align-content: start;
}

.public-form-surface .field-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--form-field-gap);
}

.public-form-surface .field > label {
  width: fit-content;
  max-width: 100%;
  color: #edf8ff;
  font-weight: 650;
  line-height: 1.3;
  letter-spacing: -.012em;
}

.public-form-surface :is(input:not([type="checkbox"]):not([type="hidden"]), select, textarea) {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-inline-size: 0;
  min-height: var(--form-control-min);
  padding: 13px 15px;
  border: 1px solid var(--form-edge);
  border-radius: var(--form-control-radius);
  color: #f5fbff;
  caret-color: #dff3ff;
  background:
    linear-gradient(145deg, rgba(255,255,255,.042), transparent 42%),
    var(--form-surface);
  box-shadow:
    inset 0 1px rgba(255,255,255,.055),
    0 12px 30px rgba(0,0,0,.15);
  transition:
    border-color 170ms ease,
    background 170ms ease,
    box-shadow 190ms ease,
    transform 190ms cubic-bezier(.2,.8,.2,1);
}

.public-form-surface textarea {
  min-height: clamp(150px, 24vh, 240px);
  resize: vertical;
}

.public-form-surface :is(input, select, textarea)::placeholder {
  color: #7990a2;
  opacity: 1;
}

.public-form-surface :is(input:not([type="checkbox"]), select, textarea):focus-visible,
.public-form-surface .amount-entry:focus-within {
  outline: 0;
  border-color: var(--form-edge-focus);
  background: var(--form-surface-focus);
  box-shadow:
    0 0 0 4px rgba(118, 182, 226, .15),
    0 18px 42px rgba(0,0,0,.22),
    inset 0 1px rgba(255,255,255,.085);
}

.public-form-surface :is(input, select, textarea)[aria-invalid="true"] {
  border-color: color-mix(in srgb, var(--form-invalid) 72%, transparent);
  box-shadow:
    0 0 0 4px rgba(255, 117, 117, .11),
    inset 0 1px rgba(255,255,255,.05);
}

.public-form-surface .field-error {
  min-height: 1.15em;
  color: var(--form-invalid);
  font-size: .86rem;
  line-height: 1.35;
}

.public-form-surface .form-status {
  min-height: 1.5em;
  margin: 0;
  padding: 10px 12px;
  border: 1px solid transparent;
  border-radius: 14px;
  color: #b8cada;
  line-height: 1.45;
  transition:border-color 170ms ease,background 170ms ease,color 170ms ease,transform 190ms cubic-bezier(.2,.8,.2,1);
}

.public-form-surface .form-status:empty{padding-block:0;border-color:transparent;background:transparent}
.public-form-surface .form-status[data-state="pending"]{border-color:rgba(144,199,238,.12);background:rgba(111,174,219,.055)}
.public-form-surface .form-status.success,
.public-form-surface .form-status[data-state="success"]{color:var(--form-success);border-color:rgba(105,220,159,.18);background:rgba(62,171,114,.07)}
.public-form-surface .form-status.error,
.public-form-surface .form-status[data-state="error"]{color:var(--form-invalid);border-color:rgba(255,135,135,.2);background:rgba(190,62,62,.075)}
.public-form-surface form[data-form-state="success"] .button[type="submit"]{box-shadow:0 0 0 1px rgba(105,220,159,.16),0 16px 34px rgba(0,0,0,.18)}
.public-form-surface form[data-form-state="error"] .button[type="submit"]{box-shadow:0 0 0 1px rgba(255,135,135,.15),0 16px 34px rgba(0,0,0,.18)}
.public-form-surface form[data-form-state="offline"] .form-status,
.public-form-surface form[data-form-state="verification-required"] .form-status,
.public-form-surface form[data-form-state="configuration-error"] .form-status {
  color: #ffd7a4;
  border-color: rgba(255, 190, 112, .24);
  background:
    linear-gradient(130deg, rgba(255, 208, 143, .075), transparent 58%),
    rgba(85, 52, 16, .16);
  box-shadow: inset 0 1px rgba(255,255,255,.04), 0 12px 30px rgba(0,0,0,.12);
}
.public-form-surface form[data-form-state="offline"] .button[type="submit"],
.public-form-surface form[data-form-state="verification-required"] .button[type="submit"],
.public-form-surface form[data-form-state="configuration-error"] .button[type="submit"] {
  box-shadow: 0 0 0 1px rgba(255,190,112,.17), 0 16px 34px rgba(0,0,0,.18);
}
.public-form-surface form[data-form-state="redirecting"] .button[type="submit"] {
  cursor: progress;
  box-shadow: 0 0 0 1px rgba(105,220,159,.18), 0 18px 38px rgba(0,0,0,.2);
}

.public-form-surface .form-recovery-action {
  box-sizing: border-box;
  width: fit-content;
  max-width: 100%;
  min-height: var(--form-control-min);
  margin-top: 10px;
  padding: 12px 18px;
  border: 1px solid rgba(199, 231, 252, .24);
  border-radius: 999px;
  color: #eef9ff;
  font: inherit;
  font-weight: 720;
  line-height: 1.2;
  letter-spacing: -.01em;
  text-align: center;
  white-space: normal;
  cursor: pointer;
  background:
    linear-gradient(145deg, rgba(255,255,255,.095), transparent 46%),
    rgba(22, 55, 78, .54);
  box-shadow:
    inset 0 1px rgba(255,255,255,.09),
    0 14px 32px rgba(0,0,0,.18);
  backdrop-filter: blur(16px) saturate(1.18);
  -webkit-backdrop-filter: blur(16px) saturate(1.18);
  transition:
    transform 180ms cubic-bezier(.2,.8,.2,1),
    border-color 160ms ease,
    background 160ms ease,
    box-shadow 190ms ease,
    opacity 160ms ease;
}

.public-form-surface .form-recovery-action:hover {
  transform: translateY(-1px);
  border-color: rgba(218, 240, 255, .42);
  background:
    linear-gradient(145deg, rgba(255,255,255,.13), transparent 46%),
    rgba(27, 69, 98, .64);
  box-shadow:
    inset 0 1px rgba(255,255,255,.12),
    0 18px 38px rgba(0,0,0,.22);
}

.public-form-surface .form-recovery-action:active {
  transform: translateY(1px) scale(.985);
}

.public-form-surface .form-recovery-action:focus-visible {
  outline: 3px solid rgba(198, 234, 255, .82);
  outline-offset: 3px;
}

.public-form-surface .form-recovery-action:disabled {
  cursor: progress;
  opacity: .62;
  transform: none;
}

.public-form-surface form[data-form-state="recovering"] .form-recovery-action {
  border-color: rgba(154, 214, 255, .32);
  background:
    linear-gradient(110deg, rgba(255,255,255,.06), rgba(144,206,247,.12), rgba(255,255,255,.04)),
    rgba(20, 57, 82, .62);
  box-shadow:
    inset 0 1px rgba(255,255,255,.10),
    0 16px 36px rgba(0,0,0,.2);
}

.public-form-surface form[aria-busy="true"] :is(input, select, textarea, .tier-button, .check-row) {
  opacity: .72;
}

.public-form-surface form[aria-busy="true"] .button[type="submit"] {
  cursor: progress;
  overflow: hidden;
  position: relative;
}

.public-form-surface form[aria-busy="true"] .button[type="submit"]::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(105deg, transparent 25%, rgba(255,255,255,.16) 47%, transparent 68%);
  transform: translateX(-120%);
  animation: raysor-form-busy 1.15s ease-in-out infinite;
}

.public-form-surface .amount-entry {
  box-sizing: border-box;
  width: 100%;
  min-height: var(--form-control-min);
  display: grid;
  grid-template-columns: auto minmax(0,1fr);
  align-items: center;
  gap: 6px;
  padding-inline: 15px 8px;
  border: 1px solid var(--form-edge);
  border-radius: var(--form-control-radius);
  background: var(--form-surface);
}

.public-form-surface .amount-entry > span {
  color: #d9efff;
  font-weight: 720;
}

.public-form-surface .amount-entry > input {
  min-height: calc(var(--form-control-min) - 2px);
  padding-inline: 4px 10px;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.public-form-surface .amount-entry > input:focus-visible {
  box-shadow: none;
}

.public-form-surface .check-row {
  box-sizing: border-box;
  display: grid;
  grid-template-columns: 22px minmax(0,1fr);
  gap: 12px;
  align-items: start;
  min-height: 52px;
  padding: 13px 14px;
  border: 1px solid rgba(211,235,252,.12);
  border-radius: 17px;
  background: rgba(214, 238, 255, .035);
}

.public-form-surface .check-row input[type="checkbox"] {
  width: 20px;
  height: 20px;
  margin: 1px 0 0;
  accent-color: #b8e4ff;
}

.public-form-surface .check-row:focus-within {
  border-color: var(--form-edge-focus);
  box-shadow: 0 0 0 4px rgba(118, 182, 226, .13);
}

.public-form-surface .tier-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 92px), 1fr));
  gap: 10px;
}

.public-form-surface :is(.button, .tier-button) {
  min-width: 0;
  max-width: 100%;
}

.public-form-surface .button[type="submit"] {
  width: fit-content;
  max-width: 100%;
  min-height: var(--form-control-min);
  padding-inline: clamp(18px, 3vw, 28px);
  text-align: center;
  white-space: normal;
}

.public-form-surface .turnstile-slot {
  overflow: hidden;
  border-radius: 14px;
}
.public-form-surface .turnstile-slot[data-state="verified"]{box-shadow:0 0 0 1px rgba(105,220,159,.13)}
.public-form-surface .turnstile-slot[data-state="error"],
.public-form-surface .turnstile-slot[data-state="expired"]{box-shadow:0 0 0 1px rgba(255,135,135,.14)}

@keyframes raysor-form-busy {
  to { transform: translateX(120%); }
}

@container (max-width: 620px) {
  .public-form-surface .field-grid {
    grid-template-columns: minmax(0,1fr);
  }

  .public-form-surface .button[type="submit"],
  .public-form-surface .form-recovery-action {
    width: 100%;
  }
}

@media (max-width: 720px) {
  .public-form-surface .support-grid {
    grid-template-columns: minmax(0,1fr);
  }
}

@media (hover: none), (pointer: coarse) {
  .public-form-surface {
    --form-control-min: 56px;
  }

  .public-form-surface .check-row,
  .public-form-surface .form-recovery-action {
    min-height: 56px;
  }

  .public-form-surface .form-recovery-action:hover {
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .public-form-surface *,
  .public-form-surface *::before,
  .public-form-surface *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

@media (prefers-reduced-transparency: reduce) {
  .public-form-surface :is(input:not([type="checkbox"]):not([type="hidden"]), select, textarea, .amount-entry, .check-row, .form-recovery-action) {
    background: #09131e;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
  .public-form-surface .form-status[data-state="pending"],.public-form-surface .form-status[data-state="success"],.public-form-surface .form-status[data-state="error"],
  .public-form-surface form[data-form-state="offline"] .form-status,
  .public-form-surface form[data-form-state="verification-required"] .form-status,
  .public-form-surface form[data-form-state="configuration-error"] .form-status{background:#09131e}
}

@media (forced-colors: active) {
  .public-form-surface :is(input:not([type="checkbox"]):not([type="hidden"]), select, textarea, .amount-entry, .check-row, .form-recovery-action) {
    color: CanvasText;
    border: 1px solid CanvasText;
    background: Canvas;
    box-shadow: none;
  }

  .public-form-surface :is(input, select, textarea):focus-visible,
  .public-form-surface .amount-entry:focus-within,
  .public-form-surface .check-row:focus-within,
  .public-form-surface .form-recovery-action:focus-visible {
    outline: 3px solid Highlight;
    outline-offset: 3px;
    box-shadow: none;
  }

  .public-form-surface .field-error,
  .public-form-surface .form-status.error,
  .public-form-surface .form-status[data-state],
  .public-form-surface form[data-form-state="offline"] .form-status,
  .public-form-surface form[data-form-state="verification-required"] .form-status,
  .public-form-surface form[data-form-state="configuration-error"] .form-status {
    color: CanvasText;
    background:Canvas;
    border-color:CanvasText;
  }
}