/* ReviewFlows public review form ([reviewflows_review_form]) and the Google ask card. Loaded on the form page only. */

/* 13. The public review form ([reviewflows_review_form]) ----------------------------------------------- */
.rvf-view--form{max-width:720px}
.rvf-form__heading{font-size:24px;font-weight:700;color:var(--rvf-rev-ink);margin:0 0 6px}
.rvf-form__intro{margin:0 0 18px;color:var(--rvf-rev-muted)}
.rvf-form{display:grid;gap:16px}
.rvf-form fieldset{border:0;margin:0;padding:0;min-width:0}
.rvf-form__label{display:block;font-size:14px;font-weight:600;color:var(--rvf-rev-ink);margin:0 0 6px}
.rvf-form__hint{display:block;font-size:12.5px;color:var(--rvf-rev-muted);margin-top:4px}
.rvf-form__field{min-width:0}
.rvf-form__row{display:grid;gap:16px}
@container (min-width:560px){.rvf-form__row{grid-template-columns:1fr 1fr}}
.rvf-form input[type=text],.rvf-form input[type=email],.rvf-form textarea{width:100%;box-sizing:border-box;font:inherit;color:var(--rvf-rev-ink);background:var(--rvf-rev-paper);border:1.5px solid var(--rvf-rev-line);border-radius:12px;padding:12px 14px;min-height:48px}
.rvf-form textarea{min-height:140px;resize:vertical}
.rvf-form input:focus-visible,.rvf-form textarea:focus-visible{outline:2px solid var(--rvf-rev-accent);outline-offset:2px;border-color:var(--rvf-rev-accent)}
.rvf-form .is-invalid input,.rvf-form .is-invalid textarea{border-color:#E0362C}
.rvf-form__error{display:block;font-size:13px;color:#B3261E;margin-top:4px}
.rvf-form input[type=file]{font-size:14px}
.rvf-form__starrow{display:flex;gap:6px}
.rvf-form__star-input{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.rvf-form__star{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:12px;background:var(--rvf-rev-tint);cursor:pointer;transition:transform .12s ease,background .12s ease}
.rvf-form__star .rvf-stars--one{--rvf-star-size:28px;width:28px}
.rvf-form__star .rvf-stars__fill{width:0}
/* 1.6.0: the script's is-lit class is the one rule (hover, the picked star on change, the picked star on load). A ~ rule can only reach the labels AFTER the checked input, which lit the wrong side on the live site. */
.rvf-form__star.is-lit .rvf-stars__fill{width:100%}
.rvf-form__star:hover{transform:scale(1.06)}
.rvf-form__star-input:focus-visible + .rvf-form__star{outline:2px solid var(--rvf-rev-accent);outline-offset:2px}
.rvf-form__word{min-height:1.4em;margin:6px 0 0;font-size:14px;font-weight:600;color:var(--rvf-rev-muted)}
.rvf-form__check{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;line-height:1.45;color:var(--rvf-rev-text)}
.rvf-form__check input{margin-top:3px;width:18px;height:18px;accent-color:var(--rvf-rev-accent)}
.rvf-form__hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
/* The form sits inside a .rvf-view wrapper, and the hub sheet resets every `.rvf-view button` (0,1,1) to plain
   text; the pill needs the heavier selector (0,2,1) or it renders as a bare "Send my review" line (live, 2026-09-17). */
.rvf-form button.rvf-form__submit{justify-self:start;min-height:52px;padding:14px 28px;border:0;border-radius:999px;background:var(--rvf-rev-btn);color:#fff;font-weight:700;font-size:16px;line-height:1.2;cursor:pointer;appearance:none;-webkit-appearance:none;transition:filter .15s}
.rvf-form button.rvf-form__submit:hover{filter:brightness(1.06)}
.rvf-form button.rvf-form__submit:disabled{opacity:.6;cursor:default}
.rvf-form__msg{margin:0;font-size:15px;color:var(--rvf-rev-muted)}
.rvf-form__msg:not(:empty){margin-top:12px}
.rvf-form__msg.is-ok{color:var(--rvf-rev-ok);font-weight:600}
.rvf-form__msg.is-error{color:#B3261E}
.rvf-form.is-done>*:not(.rvf-form__msg):not(.rvf-form__next-wrap){display:none}
.rvf-form .cf-turnstile{margin:0 0 14px}

/* 14. After an accepted good review: the Google ask (settings form_google_*). The script builds it only once the server
   said the review is in. The whole card sits in the feedback page's spinning promo ring (the high-impact CTA), the
   button is the solid green pill, the words get an even frame of space. ------------------------------------------ */
@property --rvf-angle{syntax:"<angle>";inherits:false;initial-value:0deg}
.rvf-form__next-wrap{--rvf-spin-w:2px;--rvf-spin-t:3.2s;position:relative;display:block;margin:22px 0 0;padding:var(--rvf-spin-w);border-radius:calc(var(--rvf-rev-radius) + var(--rvf-spin-w));background:conic-gradient(from var(--rvf-angle),#0B8A4B 0deg,#22C55E 110deg,#DCFCE7 165deg,#FFFFFF 185deg,#DCFCE7 205deg,#22C55E 260deg,#0B8A4B 360deg);animation:rvf-spin var(--rvf-spin-t) linear infinite;animation-name:rvf-next-in,rvf-spin;animation-duration:.35s,var(--rvf-spin-t);animation-timing-function:ease-out,linear;animation-iteration-count:1,infinite}
.rvf-form__next-wrap::before{content:"";position:absolute;inset:0;border-radius:inherit;background:inherit;filter:blur(14px);opacity:.4;z-index:-1;pointer-events:none;animation:rvf-spin var(--rvf-spin-t) linear infinite}
@keyframes rvf-spin{to{--rvf-angle:360deg}}
@keyframes rvf-next-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.rvf-form__next{position:relative;z-index:1;margin:0;padding:30px 32px 32px;border-radius:var(--rvf-rev-radius);background:var(--rvf-rev-paper)}
.rvf-view .rvf-form__next-h{margin:0 0 14px;font-size:22px;line-height:1.25;color:var(--rvf-rev-ink)}
.rvf-view .rvf-form__next-p{margin:0 0 30px;font-size:16px;line-height:1.55;color:var(--rvf-rev-text)}
.rvf-form__next-row{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px}
.rvf-form__next-go{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 28px;border-radius:999px;background:linear-gradient(180deg,#12A35A,#0B8A4B);color:#fff!important;font-weight:700;font-size:16px;text-decoration:none!important;box-shadow:0 1px 2px rgba(11,138,75,.25),0 12px 26px -12px rgba(11,138,75,.75);transition:transform .15s ease,box-shadow .15s ease}
.rvf-form__next-go::after{content:"\2197";font-size:.85em;opacity:.9}
.rvf-form__next-go:hover{transform:translateY(-1px);background:linear-gradient(180deg,#16B364,#0C9350);box-shadow:0 2px 4px rgba(11,138,75,.25),0 16px 30px -12px rgba(11,138,75,.8)}
.rvf-form__next-go:focus-visible{outline:3px solid #0B8A4B;outline-offset:4px}
.rvf-form__next-note{color:var(--rvf-rev-muted);font-size:15px}
@container (max-width:480px){.rvf-form__next{padding:24px 20px 26px}.rvf-form__next-row{flex-direction:column;align-items:stretch;text-align:center}.rvf-form__next-go{width:100%}}
@media (prefers-reduced-motion:reduce){.rvf-form__next-wrap,.rvf-form__next-wrap::before{animation:none}}
