/*
 * Sales Assistant AI — Research Final Feedback
 *
 * Responsibility:
 * - final feedback screen layout
 * - readable rating controls
 * - responsive feedback cards
 * - accessible star selection
 * - clear separation from the workspace footer
 */

body[data-research-page="true"]
.research-assistant:has(.research-final-feedback) {
    min-height: 0;
}

body[data-research-page="true"]
.research-final-feedback {
    --feedback-navy: #0b1728;
    --feedback-surface: rgba(16, 32, 54, 0.82);
    --feedback-surface-soft: rgba(25, 47, 76, 0.62);
    --feedback-border: rgba(112, 160, 224, 0.28);
    --feedback-border-strong: rgba(112, 160, 224, 0.58);
    --feedback-text: #f4f7fb;
    --feedback-secondary: #b9c9dd;
    --feedback-muted: #91a5bd;
    --feedback-gold: #e0b84f;
    --feedback-gold-soft: rgba(224, 184, 79, 0.16);
    --feedback-danger: #ff9f9f;
    --feedback-success: #8ce0af;

    width: min(100%, 68rem);
    margin: 0 auto;
    padding:
        clamp(1.5rem, 3vw, 2.8rem)
        0
        clamp(3rem, 6vh, 4.5rem);

    color: var(--feedback-text);
}

body[data-research-page="true"]
.research-final-feedback__panel {
    width: 100%;
    max-width: 64rem;
    margin: 0 auto;
}

body[data-research-page="true"]
.research-final-feedback__hero {
    max-width: 58rem;
    margin: 0 auto 1.7rem;
}

body[data-research-page="true"]
.research-final-feedback__eyebrow {
    margin: 0 0 0.65rem;

    color: var(--feedback-gold);

    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    line-height: 1.4;
    text-transform: uppercase;
}

body[data-research-page="true"]
.research-final-feedback__title {
    max-width: 56rem;
    margin: 0;

    color: var(--feedback-text);

    font-size: clamp(2rem, 4vw, 3.35rem);
    font-weight: 750;
    letter-spacing: -0.035em;
    line-height: 1.08;
}

body[data-research-page="true"]
.research-final-feedback__lead {
    max-width: 52rem;
    margin: 1rem 0 0;

    color: var(--feedback-secondary);

    font-size: clamp(0.98rem, 1.4vw, 1.1rem);
    line-height: 1.65;
}

body[data-research-page="true"]
.research-final-feedback__form {
    display: grid;
    gap: 1rem;
}

body[data-research-page="true"]
.research-final-feedback__rating,
body[data-research-page="true"]
.research-final-feedback__language {
    padding: clamp(1.15rem, 2.2vw, 1.65rem);

    border: 1px solid var(--feedback-border);
    border-radius: 1rem;

    background:
        linear-gradient(
            145deg,
            var(--feedback-surface) 0%,
            rgba(11, 23, 40, 0.74) 100%
        );

    box-shadow:
        0 0.8rem 2rem rgba(0, 0, 0, 0.14);
}

body[data-research-page="true"]
.research-final-feedback__rating-title {
    margin: 0;

    color: var(--feedback-text);

    font-size: clamp(1.15rem, 1.8vw, 1.55rem);
    font-weight: 700;
    letter-spacing: -0.018em;
    line-height: 1.28;
}

body[data-research-page="true"]
.research-final-feedback__stars {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 1rem;
}

body[data-research-page="true"]
.research-final-feedback__star {
    position: relative;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 3.25rem;
    height: 3rem;

    border: 1px solid rgba(145, 165, 189, 0.35);
    border-radius: 0.7rem;

    background: rgba(255, 255, 255, 0.045);

    cursor: pointer;

    transition:
        border-color 160ms ease,
        background-color 160ms ease,
        transform 160ms ease;
}

body[data-research-page="true"]
.research-final-feedback__star:hover {
    border-color: var(--feedback-gold);
    background: var(--feedback-gold-soft);
    transform: translateY(-1px);
}

body[data-research-page="true"]
.research-final-feedback__star-input {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;
    margin: 0;

    opacity: 0;

    cursor: pointer;
}

body[data-research-page="true"]
.research-final-feedback__star-symbol {
    color: rgba(185, 201, 221, 0.62);

    font-size: 1.85rem;
    line-height: 1;

    pointer-events: none;

    transition:
        color 160ms ease,
        text-shadow 160ms ease,
        transform 160ms ease;
}

body[data-research-page="true"]
.research-final-feedback__star:has(
    .research-final-feedback__star-input:checked
) {
    border-color: var(--feedback-gold);
    background: var(--feedback-gold-soft);
}

body[data-research-page="true"]
.research-final-feedback__star:has(
    .research-final-feedback__star-input:checked
)
.research-final-feedback__star-symbol,
body[data-research-page="true"]
.research-final-feedback__star:has(
    ~ .research-final-feedback__star
    .research-final-feedback__star-input:checked
)
.research-final-feedback__star-symbol {
    color: var(--feedback-gold);
    text-shadow: 0 0 0.8rem rgba(224, 184, 79, 0.28);
}

body[data-research-page="true"]
.research-final-feedback__star-input:focus-visible
+ .research-final-feedback__star-symbol {
    outline: 2px solid var(--feedback-gold);
    outline-offset: 0.25rem;
}

body[data-research-page="true"]
.research-final-feedback__scale {
    margin: 0.75rem 0 0;

    color: var(--feedback-muted);

    font-size: 0.86rem;
    line-height: 1.45;
}

body[data-research-page="true"]
.research-final-feedback__language-explanation,
body[data-research-page="true"]
.research-final-feedback__language-instruction {
    max-width: 54rem;
    margin: 0.75rem 0 0;

    color: var(--feedback-secondary);

    font-size: 0.95rem;
    line-height: 1.6;
}

body[data-research-page="true"]
.research-final-feedback__language-instruction {
    color: var(--feedback-muted);
}

body[data-research-page="true"]
.research-final-feedback__language
.research-final-feedback__stars {
    margin-top: 1rem;
}

body[data-research-page="true"]
.research-final-feedback__comment {
    margin-top: 1.25rem;
    padding-top: 1.25rem;

    border-top: 1px solid rgba(112, 160, 224, 0.2);
}

body[data-research-page="true"]
.research-final-feedback__comment-label {
    display: block;
    margin: 0;

    color: var(--feedback-text);

    font-size: 0.96rem;
    font-weight: 700;
    line-height: 1.4;
}

body[data-research-page="true"]
.research-final-feedback__comment-help {
    margin: 0.45rem 0 0;

    color: var(--feedback-muted);

    font-size: 0.86rem;
    line-height: 1.5;
}

body[data-research-page="true"]
.research-final-feedback__textarea {
    display: block;

    width: 100%;
    min-height: 8rem;
    margin-top: 0.8rem;
    padding: 0.85rem 0.95rem;

    border: 1px solid rgba(145, 165, 189, 0.35);
    border-radius: 0.7rem;

    background: rgba(4, 12, 24, 0.72);
    color: var(--feedback-text);

    font: inherit;
    font-size: 0.95rem;
    line-height: 1.55;

    resize: vertical;
}

body[data-research-page="true"]
.research-final-feedback__textarea::placeholder {
    color: rgba(185, 201, 221, 0.5);
}

body[data-research-page="true"]
.research-final-feedback__textarea:focus {
    border-color: var(--feedback-border-strong);

    outline: 2px solid rgba(112, 160, 224, 0.2);
    outline-offset: 1px;
}

body[data-research-page="true"]
.research-final-feedback__status {
    min-height: 1.4rem;
    margin: 0.1rem 0 0;

    color: var(--feedback-secondary);

    font-size: 0.9rem;
    line-height: 1.5;
}

body[data-research-page="true"]
.research-final-feedback__status--error {
    color: var(--feedback-danger);
}

body[data-research-page="true"]
.research-final-feedback__status--success {
    color: var(--feedback-success);
}

body[data-research-page="true"]
.research-final-feedback__actions {
    display: flex;
    justify-content: flex-start;
    margin-top: 0.25rem;
}

body[data-research-page="true"]
.research-final-feedback__submit {
    min-height: 2.35rem;
    padding: 0.45rem 0.9rem;

    border: 1px solid var(--feedback-gold);
    border-radius: 0.7rem;

    background:
        linear-gradient(
            135deg,
            #d9ad43 0%,
            #f0cf72 100%
        );
    color: #101b2b;

    font: inherit;
    font-size: 0.92rem;
    font-weight: 750;
    line-height: 1.2;

    cursor: pointer;

    transition:
        background-color 160ms ease,
        box-shadow 160ms ease,
        transform 160ms ease;
}

body[data-research-page="true"]
.research-final-feedback__submit:hover {
    box-shadow: 0 0.55rem 1.3rem rgba(224, 184, 79, 0.2);
    transform: translateY(-1px);
}

body[data-research-page="true"]
.research-final-feedback__submit:focus-visible {
    outline: 2px solid var(--feedback-gold);
    outline-offset: 0.22rem;
}

body[data-research-page="true"]
.research-final-feedback__submit:disabled {
    cursor: wait;
    opacity: 0.62;
    transform: none;
}

body[data-research-page="true"]
.research-final-feedback--success {
    padding-top: clamp(2rem, 5vh, 4rem);
}

body[data-research-page="true"]
.research-final-feedback--success
.research-final-feedback__panel {
    max-width: 52rem;
    padding: clamp(1.5rem, 4vw, 3rem);

    border: 1px solid var(--feedback-border);
    border-radius: 1.1rem;

    background:
        linear-gradient(
            145deg,
            var(--feedback-surface) 0%,
            rgba(11, 23, 40, 0.78) 100%
        );

    text-align: center;
}

body[data-research-page="true"]
.research-final-feedback__success-mark {
    display: grid;
    place-items: center;

    width: 3.6rem;
    height: 3.6rem;
    margin: 1rem auto 1.15rem;

    border: 1px solid rgba(140, 224, 175, 0.5);
    border-radius: 50%;

    background: rgba(140, 224, 175, 0.12);
    color: var(--feedback-success);

    font-size: 2rem;
    font-weight: 700;
}

body[data-research-page="true"]
.research-final-feedback__success-copy {
    display: grid;
    gap: 0.7rem;
    margin-top: 1.25rem;
}

body[data-research-page="true"]
.research-final-feedback__success-text {
    margin: 0;

    color: var(--feedback-secondary);

    font-size: 0.98rem;
    line-height: 1.65;
}

body[data-research-page="true"]
.research-final-feedback--success
.research-final-feedback__actions {
    justify-content: center;
    margin-top: 1.5rem;
}

@media (max-width: 768px) {
    body[data-research-page="true"]
    .research-final-feedback {
        padding:
            1.25rem
            0
            3rem;
    }

    body[data-research-page="true"]
    .research-final-feedback__title {
        font-size: clamp(1.85rem, 8vw, 2.6rem);
    }

    body[data-research-page="true"]
    .research-final-feedback__lead {
        font-size: 0.95rem;
    }

    body[data-research-page="true"]
    .research-final-feedback__star {
        width: 2.9rem;
        height: 2.8rem;
    }

    body[data-research-page="true"]
    .research-final-feedback__star-symbol {
        font-size: 1.65rem;
    }
}

@media (max-width: 520px) {
    body[data-research-page="true"]
    .research-final-feedback__rating,
    body[data-research-page="true"]
    .research-final-feedback__language {
        padding: 1rem;
        border-radius: 0.85rem;
    }

    body[data-research-page="true"]
    .research-final-feedback__stars {
        gap: 0.35rem;
    }

    body[data-research-page="true"]
    .research-final-feedback__star {
        width: 2.65rem;
        height: 2.6rem;
    }

    body[data-research-page="true"]
    .research-final-feedback__star-symbol {
        font-size: 1.5rem;
    }

    body[data-research-page="true"]
    .research-final-feedback__submit {
        width: 100%;
    }
}

body[data-research-page="true"]
.research-final-feedback__submit[type="submit"],
body[data-research-page="true"]
[data-final-feedback-finish] {
    background: linear-gradient(135deg, #1f8f4e 0%, #39b96c 100%);
    border-color: #39b96c;
    color: #ffffff;
}

body[data-research-page="true"]
[data-final-feedback-back] {
    background: linear-gradient(135deg, #a62929 0%, #d94a4a 100%);
    border-color: #d94a4a;
    color: #ffffff;
}


body[data-research-page="true"]
.research-final-feedback__actions {
    gap: 0.75rem;
}