/**
 * Fisarmonica delle FAQ: pagina FAQ (faqlist-content.tpl) e blocco in fondo alla
 * pagina categoria (hook/ez-faq-category.tpl). Le due pagine non compaiono mai
 * insieme.
 *
 * Tutto e' agganciato a .faq_no_tabs: qualsiasi contenitore con quella classe si
 * comporta da fisarmonica, senza altro codice.
 *
 * Il foglio sta nel tema e non fra i file del modulo per due motivi: e' grafica
 * del tema, e i CSS sotto modules/ets_faq/ vengono tolti da ezperfassets su ogni
 * pagina che non si chiami cms o faq, categoria compresa - ed e' proprio li' che
 * la fisarmonica compare oltre che sulla pagina FAQ.
 *
 * Lo registra Ets_faqOverride::ezRegisterAccordionCss().
 */

.faq_no_tabs .faq_groups {
    float: left;
    width: 100%;
}

.faq_no_tabs .faq_group_block {
    border-bottom: 1px solid #dfdfdf;
    float: left;
    width: 100%;
}

.faq_no_tabs .faq_group_block:first-child {
    border-top: 1px solid #dfdfdf;
}

.faq_no_tabs .faq_group_title {
    color: #000;
    cursor: pointer;
    font-size: 18px;
    font-weight: 600;
    margin: 0;
    outline: none;
    padding: 15px 0 15px 30px;
    position: relative;
    text-transform: uppercase;
}

.faq_no_tabs .faq_group_title:hover,
.faq_no_tabs .faq_group_title:focus {
    color: #000;
    text-decoration: underline;
}

/* Indicatore del gruppo: + quando e' chiuso, - quando e' aperto. Scritti come
   escape CSS (\002B, \2212) invece che come caratteri, cosi' il file resta ASCII
   e non dipende dall'encoding con cui viene servito. */
.faq_no_tabs .faq_group_title::after {
    color: #000;
    content: "\002B";
    font-size: 24px;
    font-weight: 400;
    line-height: 1;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}

.faq_no_tabs .faq_group_title.open::after {
    content: "\2212";
}

/* Stesso indicatore sulle domande, in una colonna a sinistra larga 25px
   (15 di glifo piu' 10 di stacco). La riga e' una flexbox: se la domanda va
   a capo, il testo resta rientrato sotto se' stesso invece di infilarsi
   sotto il +.

   Le misure sono ripetute qui e non lasciate a faq-front.css perche' la
   fisarmonica compare anche in pagina categoria, dove ezperfassets toglie
   il CSS del modulo. */
.faq_no_tabs .faq_question_name {
    align-items: flex-end;
    cursor: pointer;
    display: flex;
    padding: 10px 15px;
}

.faq_no_tabs .faq_question_name::before {
    border: 0;
    color: #000;
    content: "\002B";
    flex: 0 0 auto;
    font-family: inherit;
    font-size: 20px;
    font-weight: 400;
    height: auto;
    line-height: 20px;
    margin: 0 10px 0 0;
    text-align: center;
    transform: none;
    -webkit-transform: none;
    -ms-transform: none;
    -o-transform: none;
    width: 15px;
}

.faq_no_tabs .faq_question_name.open::before {
    content: "\2212";
}

/* 15 di padding della riga piu' i 25 della colonna icona: la risposta si
   allinea al testo della domanda, non al +. */
.faq_no_tabs .faq_answer {
    padding: 10px 15px 10px 40px;
}

.faq_no_tabs .faq_group_questions {
    display: none;
    float: left;
    width: 100%;
}

.faq_no_tabs .faq_group_questions.open {
    display: block;
}

.faq_no_tabs .faq_group_questions > .front_question_ul {
    list-style: none;
    margin: 0;
    padding: 0 0 5px;
}

.faq_no_tabs .faq_question_name,
.faq_no_tabs .faq_answer,
.faq_no_tabs .faq_answer p {
    color: #000;
}

.faq_on_category {
    clear: both;
    float: left;
    margin-top: 30px;
    width: 100%;
}
