/* Accessibilita Sagra - specifiche Adobe XD del 5 agosto 2026. */
:root {
    --sagra-green: #487629;
    --sagra-yellow-light: #FFE185;
    --sagra-control-border: #6B6B6B;
    --sagra-quiz-inactive: #B8B2AC;
}

/*
 * Torna all'inizio: tondo verde pieno, traccia e freccia bianche.
 * L'hover e il focus da tastiera invertono i colori.
 */
.scroll-top {
    box-sizing: border-box !important;
    border: 3px solid #fff !important;
    border-radius: 50% !important;
    background: var(--sagra-green) !important;
    color: #fff !important;
    cursor: pointer;
    opacity: 1 !important;
    transition: background-color .2s ease, border-color .2s ease, color .2s ease !important;
}

.scroll-top img {
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
}

.scroll-top::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 21px;
    height: 29px;
    background-color: currentColor;
    transform: translate(-50%, -50%);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 32'%3E%3Cpath d='M12 29V4M3 13l9-9 9 9' fill='none' stroke='black' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 32'%3E%3Cpath d='M12 29V4M3 13l9-9 9 9' fill='none' stroke='black' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

.scroll-top:hover,
.scroll-top:focus-visible {
    border-color: var(--sagra-green) !important;
    background: #fff !important;
    color: var(--sagra-green) !important;
    opacity: 1 !important;
}

/* Form contatti: bordi indicati nel layout XD. */
.page-id-5665038 #nf-field-1:not(:focus),
.page-id-5665038 #nf-field-2:not(:focus),
.page-id-5665038 #nf-field-3:not(:focus) {
    border-color: var(--sagra-control-border) !important;
}

.page-id-5665038 #nf-label-field-5::after {
    border-color: var(--sagra-control-border) !important;
}

/* Storie Sagra e CTA condivise: hover/focus verde con testo bianco. */
.page-id-5665060 .sf-level-0 label,
a.btn:not(.btn-link):not(.btn-white),
a.button,
.vc_btn3,
.wp-block-button__link,
input[type="submit"]:not(:disabled) {
    transition: background-color .2s ease, border-color .2s ease, color .2s ease !important;
}

.page-id-5665060 .sf-level-0 label:hover,
.page-id-5665060 .sf-input-radio:focus-visible + label,
a.btn:not(.btn-link):not(.btn-white):hover,
a.btn:not(.btn-link):not(.btn-white):focus-visible,
a.button:hover,
a.button:focus-visible,
.vc_btn3:hover,
.vc_btn3:focus-visible,
.wp-block-button__link:hover,
.wp-block-button__link:focus-visible,
input[type="submit"]:not(:disabled):hover,
input[type="submit"]:not(:disabled):focus-visible {
    border-color: var(--sagra-green) !important;
    background-color: var(--sagra-green) !important;
    color: #fff !important;
}

/* L'ID Ninja Forms ha una specificita maggiore delle regole condivise. */
.page-id-5665038 #nf-field-4:not(:disabled):hover,
.page-id-5665038 #nf-field-4:not(:disabled):focus-visible {
    border-color: var(--sagra-green) !important;
    background: var(--sagra-green) !important;
    color: #fff !important;
}

.page-id-5665060 .sf-level-0 label:hover *,
.page-id-5665060 .sf-input-radio:focus-visible + label *,
a.btn:not(.btn-link):not(.btn-white):hover *,
a.btn:not(.btn-link):not(.btn-white):focus-visible *,
a.button:hover *,
a.button:focus-visible *,
.vc_btn3:hover *,
.vc_btn3:focus-visible *,
.wp-block-button__link:hover *,
.wp-block-button__link:focus-visible * {
    color: inherit !important;
}

/* Quiz Il mondo dell'olio: barre non attive piu leggibili. */
.page-id-5665554 .barra-domanda:not(.active) {
    background-color: var(--sagra-quiz-inactive) !important;
}

@media (forced-colors: active) {
    .scroll-top,
    .scroll-top:hover,
    .scroll-top:focus-visible {
        border-color: ButtonText !important;
        background: ButtonFace !important;
        color: ButtonText !important;
        forced-color-adjust: auto;
    }
}