:root {
    --yellow-primary: #F6CC20;
    --yellow-secondary: #FFE666;
    --black: #1A1B1A;
    --white: #ffffff;
    --font-main: "Inter", sans-serif;
}

#contenitoreReclami { font-family: var(--font-main); margin: 0 auto; margin-top: -2.5svw; font-optical-sizing: auto; }
#contenitoreReclami *{ font-family: var(--font-main); font-optical-sizing: auto; }
#formReclami > section > div { display: flex; width: 100%; justify-content: space-between; gap: 2svw; }
#formReclami > section > div > div { width: 100%; }
#contenitoreReclami section { margin-bottom: 3rem; }
#contenitoreReclami h1 { font-size: 2.5rem; color: var(--yellow-primary); font-weight: 800; margin-bottom: 1rem; }
#contenitoreReclami h2 { font-size: 1.6rem; font-weight: 700; text-transform: none; }
#contenitoreReclami p { font-size: 1.1rem; color: #333; line-height: 1.5; }
img.barra + section > div { display: flex; justify-content: space-between; padding: 0svw 2svw 0svw 2svw; margin-left: auto; margin-right: auto; }
#contenitoreReclami .freccia { width: 4svw; height: auto; margin-right: 0.5rem; vertical-align: middle; }
#contenitoreReclami form { display: grid; grid-template-columns: 1.5fr 1fr; gap: 3rem; align-items: flex-start; margin-left: auto; margin-right: auto; padding: 0svw 10svw 0svw 10svw; }
#contenitoreReclami form section { background: var(--yellow-primary); padding: 2rem; border-radius: 1svw; display: flex; flex-direction: column; gap: 1.5rem; }
#contenitoreReclami label { font-weight: 300; margin-bottom: 0.25rem; display: block; font-size: 0.8rem; }
#contenitoreReclami input[type="text"], #contenitoreReclami input[type="email"], #contenitoreReclami input[type="tel"], #contenitoreReclami textarea, #contenitoreReclami select { width: 100%; padding: 0.75rem; border: none; border-radius: 50px; font-size: 1rem; box-sizing: border-box; }
#contenitoreReclami textarea { min-height: 6rem; resize: vertical; border-radius: 1rem; }
#contenitoreReclami select { background-color: var(--white); }
#contenitoreReclami input[type="file"] { margin-top: 0.5rem; }
#contenitoreReclami .barra { max-width: 25svw; height: auto; }
#contenitoreReclami .barra.ruotata { transform: rotate(180deg); display: block; margin-left: auto; }
#contenitoreReclami img.barra + section > div a:last-child { color: var(--yellow-primary); font-weight: bold; }

#contenitoreReclami .contenitore-pulsante{ justify-content: flex-end; gap: 0; }
#contenitoreReclami .contenitore-pulsante button { background: var(--black); color: var(--yellow-primary); font-weight: bold; padding: 0.75rem 1.5rem; border: none; cursor: pointer; display: flex; align-items: center; white-space: nowrap; border-radius: 0 5px 5px 0; clip-path: polygon(0% 0%, 100% 0%, 86% 100%, 0% 100%); padding-right: 2.5rem; text-transform: revert; }
#contenitoreReclami .contenitore-pulsante .freccia-nera { background: var(--black); clip-path: polygon(35% 0, 100% 0, 65% 100%, 0 100%); padding: 0.75rem 0rem; border-radius: 0px 6px 0px 6px !important; width: auto !important; min-width: 5svw; }

#contenitoreReclami .contenitore-pulsante:hover button{ background-color: var(--yellow-primary); color: var(--black); }
#contenitoreReclami .contenitore-pulsante:hover .freccia-nera{ background-color: var(--yellow-primary); }

#contenitoreReclami section.contenitore{ background-color: transparent; padding: 0; margin-bottom: 6rem; }
#contenitoreReclami section.contenitore > section{ margin-bottom: 2rem; padding-bottom: 3.5rem; }
#contenitoreReclami section.contenitore > section > div { display: flex; gap: 2svw; }

.custom-select { position: relative; }
.custom-select select { display: none; }
.select-selected { background-color: var(--white); }
.select-selected:after { position: absolute; content: ""; top: 14px; right: 10px; width: 0; height: 0; border: 6px solid transparent; border-color: #fff transparent transparent transparent; }
.select-selected.select-arrow-active:after { border-color: transparent transparent #fff transparent; top: 7px; }
.select-items div, .select-selected { border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent; cursor: pointer; width: 100%; padding: 0.75rem; border : none; border-radius: 50px; font-size: 1rem; box-sizing: border-box; }
.select-items { position: absolute; top: 100%; left: 0; right: 0; z-index: 99; background-color: var(--white); border-radius: 25px; }
.select-hide { display: none; }
.select-items div:hover, .same-as-selected {background-color: var(--yellow-primary); }

input[type=text] { text-transform: capitalize; }

@media (max-width: 768px) {
    #contenitoreReclami form { grid-template-columns: 1fr; }
}
@media(max-width: 550px){
    #formReclami > section > div, #contenitoreReclami section.contenitore > section > div { flex-direction: column; }
    #contenitoreReclami .contenitore-pulsante { flex-direction : row !important; }
    #contenitoreReclami .contenitore-pulsante .freccia-nera{ min-width: 20svw; }
    #contenitoreReclami .contenitore-pulsante button { min-width: 4svw; }
    #contenitoreReclami .barra{ max-width: 43svw; }
    #contenitoreReclami img.barra + section > div a { display: none; }
    #contenitoreReclami img.barra + section > div{ margin-top: 4svw; }
}