.elementor-6597 .elementor-element.elementor-element-5a0ba40{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:40px;--padding-bottom:60px;--padding-left:20px;--padding-right:20px;}.elementor-6597 .elementor-element.elementor-element-5a0ba40:not(.elementor-motion-effects-element-type-background), .elementor-6597 .elementor-element.elementor-element-5a0ba40 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:linear-gradient(175deg, var( --e-global-color-primary ) 0%, var( --e-global-color-secondary ) 60%);}.elementor-widget-heading .elementor-heading-title{color:var( --e-global-color-primary );}.elementor-6597 .elementor-element.elementor-element-5e7c108{text-align:center;}.elementor-6597 .elementor-element.elementor-element-5e7c108 .elementor-heading-title{font-family:"Plus Jakarta Sans", Sans-serif;font-weight:500;color:var( --e-global-color-887d99f );}.elementor-6597 .elementor-element.elementor-element-55e626b{text-align:center;}.elementor-6597 .elementor-element.elementor-element-55e626b .elementor-heading-title{font-family:"Plus Jakarta Sans", Sans-serif;font-weight:400;line-height:1.5em;color:var( --e-global-color-887d99f );}.elementor-6597 .elementor-element.elementor-element-a6b5dd1{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:40px;--padding-bottom:60px;--padding-left:20px;--padding-right:20px;}@media(max-width:767px){.elementor-6597 .elementor-element.elementor-element-5a0ba40{--padding-top:20px;--padding-bottom:40px;--padding-left:20px;--padding-right:20px;}.elementor-6597 .elementor-element.elementor-element-5e7c108 .elementor-heading-title{font-size:40px;line-height:1.5em;}.elementor-6597 .elementor-element.elementor-element-a6b5dd1{--padding-top:40px;--padding-bottom:0px;--padding-left:20px;--padding-right:20px;}}/* Start custom CSS for shortcode, class: .elementor-element-e5c51c4 *//* --- WRAPPER --- */
#glossario-wrapper {
    display: flex;
    gap: 40px;
    align-items: flex-start;
}

/* --- SIDEBAR SINISTRA --- */
#glossary_sidebar {
    width: 33%;
    position: sticky;
    top: 100px;
}

/* --- SEARCH --- */
#glossary_search_wrap {
    position: relative;
    margin-bottom: 16px;
}

/* Nasconde la X nativa del browser su type="search" */
#glossary_search::-webkit-search-cancel-button,
#glossary_search::-webkit-search-decoration {
    -webkit-appearance: none;
    appearance: none;
}

/* Icona lente a sinistra */
#glossary_search_icon {
    position: absolute;
    left: 11px;
    top: 50%;
    transform: translateY(-50%);
    color: #aaa;
    pointer-events: none;
    display: flex;
    align-items: center;
}

#glossary_search {
    width: 100%;
    padding: 10px 36px 10px 36px;
    border: 1px solid #8abeab;
    border-radius: 20px;
    font-size: 14px;
    box-sizing: border-box;
    outline: none;
}

#glossary_search:focus {
    border-color: #2196f3;
}

#glossary_search_clear {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    color: #aaa;
    font-size: 13px;
    display: none;
}

#glossary_no_results {
    font-size: 14px;
    color: #999;
    margin: -10px 0 20px 0;
    background: #f9f9f9;
    border: 1px solid #999;
    padding: 20px;
    border-radius: 20px;
}

/* --- SEPARATORE LETTERA ALFABETICA --- */
.glossary-alpha-heading {
    display: block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #2196f3;
    border-bottom: 1px solid #2196f3;
    padding-bottom: 3px;
    margin: 16px 0 8px;
}

.glossary-alpha-heading:first-child {
    margin-top: 0;
}

.glossary-alpha-heading.hidden {
    display: none;
}

/* --- INDICE LINK --- */
#glossary_links {
    background: #F1FBF8;
    border: 1px solid #8abeab;
    padding: 20px;
    border-radius: 20px;
    --glossario-accent: #8abeab;
    height: 100vh;
    overflow-y: auto;
}


#glossary_links a {
    display: block;
    margin-bottom: 8px;
    cursor: pointer;
    color: inherit;
    font-size: 15px;
    text-decoration: none;
    transition: color 0.2s;
}

#glossary_links a::before {
    content: "»";
    padding-right: 6px;
    font-weight: bold;
}

/* Hover con accent color — usa la variabile CSS se impostata nello shortcode,
   altrimenti fallback al default */
#glossary_links a:hover {
    color: var(--glossario-accent, #2196f3);
}

#glossary_links a.hidden {
    display: none;
}

/* --- COLONNA DESTRA --- */
#glossary_items {
    width: 67%;
    height: 100vh;
    overflow-y: auto;
    padding: 12px;
    box-sizing: border-box;
    /* --Sfumatura -- */
    -webkit-mask-image: linear-gradient(
        to bottom, 
        black 0%, 
        black 99%, 
        transparent 100%
    );
    mask-image: linear-gradient(
        to bottom, 
        black 0%, 
        black 99%, 
        transparent 100%
    );
}

/* --- SINGOLO ARTICOLO (card) --- */
#glossary_items article {
    position: relative;
    /* flex per allineare icona in alto a destra */
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 20px 24px;
    margin-bottom: 16px;
    border: 1px solid var(--glossario-accent);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.07), 0 0 1px rgba(0, 0, 0, 0.06);
    transition: box-shadow 0.25s, border 0.3s;
    overflow: hidden;
}

#glossary_items article:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.11), 0 0 1px rgba(0, 0, 0, 0.06);
}

#glossary_items article.hidden {
    display: none;
}

#glossary_items article.selected {
    border: 3px solid var(--glossario-accent, #2196f3);
    background-color: #F1F7FB;
    padding-left: 20px;
}

/* Contenuto testuale della card (h3 + body) */
.glossary-card-content {
    flex: 1;
    min-width: 0;
    padding-right: 12px;
}

.glossary-card-content img{
    display: none;
}

/* --- ICONA LINK ESTERNO — copre tutta la card --- */
.glossary-card-link {
    /* stretch su tutta la card */
    position: absolute;
    inset: 0;
    /* icona posizionata in alto a destra */
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    padding: 16px 16px 0 0;
    color: #2196f3;
    text-decoration: none;
    opacity: 0.5;
    transition: opacity 0.2s, color 0.2s;
    border-radius: 10px;
}

#glossary_items article:hover .glossary-card-link,
.glossary-card-link:hover {
    opacity: 1;
    /* rimane sempre accent color, non cambia */
    color: var(--glossario-accent, #2196f3);
}

/* --- TITOLO H3 --- */
#glossary_items article h3 {
    margin: 0 0 10px 0;
    font-size: 21px;
    font-weight: 700;
}

#glossary_items article h3 a {
    color: inherit;
    text-decoration: none;
}

/* --- MOBILE --- */
@media (max-width: 768px) {
    #glossario-wrapper   { flex-direction: column; }
    #glossary_sidebar,
    #glossary_items      { width: 100%; position: static; }
    #glossary_items      { height: 70vh;
        margin-top:-15px;
        margin-bottom:-40px;
        padding:0;
        /* --Sfumatura -- */
        -webkit-mask-image: linear-gradient(
            to bottom, 
            black 0%, 
            black 95%, 
            transparent 100%
        );
        mask-image: linear-gradient(
            to bottom, 
            black 0%, 
            black 95%, 
            transparent 100%
        );
    }
    #glossary_links{
        height: 35vh;
        overflow-y: auto;
    }
}/* End custom CSS */