/*
Project : Libra Professional Platform
Path    : /assets/css/surveys/
File    : survey-base.css
Purpose : Base layout for Research & Insights surveys
*/

:root {
    --ri-red: #c92727;
    --ri-red-soft: rgba(201,39,39,.28);
    --ri-dark: #060707;
    --ri-panel: rgba(10,11,12,.94);
    --ri-line: rgba(220,225,228,.18);
    --ri-inox: rgba(220,225,228,.42);
    --ri-text: #ffffff;
    --ri-muted: rgba(255,255,255,.68);
}

html {
    min-height: 100%;
}

body.ri-survey-body {
    min-height: 100vh !important;
    margin: 0 !important;
    color: var(--ri-text) !important;
    background: var(--ri-dark) !important;
    overflow-x: hidden;
}

body.ri-survey-body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -2;
    background:
        linear-gradient(rgba(0,0,0,.18), rgba(0,0,0,.72)),
        url('/assets/img/bg-dark-industrial.jpeg?v=30') center center / cover no-repeat;
}

body.ri-survey-body::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    background:
        radial-gradient(circle at 12% 12%, rgba(150,20,25,.28), transparent 34%),
        radial-gradient(circle at 88% 18%, rgba(255,255,255,.04), transparent 26%);
    pointer-events: none;
}

.ri-survey-shell {
    width: min(1680px, calc(100% - 28px));
    min-height: 100vh;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 26px 0;
}

.ri-survey-form {
    width: 100%;
}

.survey-screen,
.ri-step-panel {
    display: none;
}

.survey-screen.is-active,
.ri-step-panel.is-active {
    display: block;
    animation: riFade .22s ease both;
}

@keyframes riFade {
    from {
        opacity: 0;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 900px) {
    .ri-survey-shell {
        width: min(100% - 18px, 1680px);
        align-items: flex-start;
        padding: 12px 0;
    }
}