/* Site CliniQ - Feedback Survey */
.sct-fb-video { position: relative; aspect-ratio: 16 / 9; border-radius: 1rem; overflow: hidden; background: #000; box-shadow: var(--shadow-xl); }
.sct-fb-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.sct-fb-video-note { text-align: center; color: var(--color-dark-500); margin: 1rem 0 2.5rem; }

.sct-fb-progress { height: 6px; background: var(--color-dark-200); border-radius: 999px; overflow: hidden; }
.sct-fb-progress span { display: block; height: 100%; width: 20%; background: var(--gradient-primary); transition: width .3s; }
.sct-fb-count { font-size: .8125rem; color: var(--color-dark-400); margin: .5rem 0 2rem; }
.sct-fb-title { margin-bottom: .5rem; }
.sct-fb-intro { color: var(--color-dark-500); margin-bottom: 2rem; }
.sct-fb-step[hidden], .sct-fb-nav [hidden] { display: none !important; }

.sct-fb-q { border: 0; padding: 0; margin: 0 0 2rem; min-width: 0; }
.sct-fb-q legend { padding: 0; margin-bottom: .5rem; }
.sct-fb-help { font-size: .8125rem; color: var(--color-dark-400); margin: 0 0 .5rem; }

.sct-fb-options { display: grid; gap: .5rem; }
.sct-fb-option { display: flex; align-items: center; gap: .75rem; padding: .75rem 1rem; border: 1px solid var(--color-dark-200); border-radius: .75rem; cursor: pointer; transition: all .15s; }
.sct-fb-option:hover { border-color: var(--color-primary); }
.sct-fb-option:has(input:checked) { border-color: var(--color-primary); background: var(--color-primary-light); }

.sct-fb-scale { display: flex; gap: .5rem; }
.sct-fb-scale label { flex: 1; cursor: pointer; }
.sct-fb-scale input { position: absolute; opacity: 0; pointer-events: none; }
.sct-fb-scale span { display: block; text-align: center; padding: .75rem 0; border: 1px solid var(--color-dark-200); border-radius: .75rem; font-weight: 700; transition: all .15s; }
.sct-fb-scale label:hover span { border-color: var(--color-primary); }
.sct-fb-scale input:checked + span { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.sct-fb-scale input:focus-visible + span { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.sct-fb-scale-hint { display: flex; justify-content: space-between; font-size: .75rem; color: var(--color-dark-400); margin-top: .375rem; }

.sct-fb-nav { display: flex; justify-content: space-between; gap: 1rem; margin-top: 1rem; }
.sct-fb-nav #sct-fb-next, .sct-fb-nav #sct-fb-submit { margin-left: auto; }