/* ==========================================================================
   Centerly — Prayer request form, public front-end styles
   --------------------------------------------------------------------------
   An island scoped under `.centerly-prayer`. Mobile-first and calm — most of
   these are submitted on a phone at a hard moment. Colors are PublicBrand
   `--c-*` tokens with the same accessible fallbacks the People directory uses
   (measured through the honest gate). Font sizes in rem (the 3d rule).
   ========================================================================== */

.centerly-prayer, .centerly-prayer *, .centerly-prayer *::before, .centerly-prayer *::after { box-sizing: border-box; }

.c-pray {
	color: var(--c-ink, #1A1C22);
	background: var(--c-bg, #FFFFFF);
	line-height: 1.6;
}
.c-pray__inner {
	max-width: 34rem;
	margin-inline: auto;
	padding: clamp(1.5rem, 5vw, 3rem) clamp(1rem, 5vw, 1.5rem);
}
.c-pray__inner :where(a, button, input, textarea, select):focus-visible {
	outline: 2px solid var(--c-primary, #4338CA); outline-offset: 2px; border-radius: 4px;
}

.c-pray__title { font-size: clamp(1.5rem, 5vw, 2rem); line-height: 1.15; margin: 0; color: var(--c-ink, #1A1C22); }
.c-pray__lede { font-size: 1.0625rem; color: var(--c-ink-secondary, #3B404A); margin: 0.5rem 0 1.5rem; }

.c-pray__form { display: flex; flex-direction: column; gap: 1.1rem; }
.c-pray__field { display: flex; flex-direction: column; gap: 0.35rem; }
.c-pray__label { font-weight: 600; font-size: 0.9375rem; color: var(--c-ink, #1A1C22); }
.c-pray__help { font-size: 0.875rem; color: var(--c-ink-muted, #565C68); margin: 0; }

.c-pray__input, .c-pray__textarea, .c-pray__select {
	width: 100%;
	font: inherit;
	color: var(--c-ink, #1A1C22);
	background: var(--c-surface, #FFFFFF);
	border: 1px solid var(--c-border-strong, #C9CCD6);
	border-radius: 10px;
	padding: 0.7rem 0.8rem;
}
.c-pray__textarea { resize: vertical; min-height: 6rem; }
.c-pray__input::placeholder, .c-pray__textarea::placeholder { color: var(--c-ink-muted, #565C68); }

.c-pray__row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 460px) { .c-pray__row { grid-template-columns: 1fr; } }

/* Honeypot — visually gone, still reachable to bots. */
.c-pray__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.c-pray__share { border: 1px solid var(--c-border, #E2E4E9); border-radius: 12px; padding: 1rem; display: flex; flex-direction: column; gap: 0.6rem; }
.c-pray__share legend { padding: 0 0.4rem; }
.c-pray__radio { display: flex; align-items: flex-start; gap: 0.6rem; font-size: 0.9375rem; color: var(--c-ink-secondary, #3B404A); cursor: pointer; }
.c-pray__radio input { margin-top: 0.2rem; flex: 0 0 auto; }

.c-pray__submit, .c-pray__withdrawbtn {
	font: inherit; font-weight: 600; cursor: pointer;
	border-radius: 12px; padding: 0.85rem 1.4rem; border: 1px solid transparent;
}
.c-pray__submit {
	color: var(--c-on-primary, #FFFFFF); background: var(--c-primary, #4338CA);
	border-color: var(--c-primary, #4338CA);
}
.c-pray__submit:hover { filter: brightness(1.06); }

/* Confirmation + manage views. */
.c-pray__confirm { text-align: left; }
.c-pray__manage { margin-top: 1.25rem; display: flex; flex-direction: column; gap: 0.5rem; }
.c-pray__body {
	border-left: 3px solid var(--c-border-strong, #C9CCD6); margin: 1rem 0;
	padding: 0.5rem 0 0.5rem 1rem; color: var(--c-ink-secondary, #3B404A);
}
.c-pray__withdraw { margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid var(--c-border, #E2E4E9); }
.c-pray__withdrawbtn {
	color: var(--c-primary, #4338CA); background: transparent; border-color: var(--c-border-strong, #C9CCD6);
}
.c-pray__withdrawbtn:hover { border-color: var(--c-primary, #4338CA); }
.c-pray__back { margin-top: 1.5rem; }
.c-pray__back a { color: var(--c-primary, #4338CA); text-decoration: none; font-weight: 600; }
.c-pray__back a:hover { text-decoration: underline; }
