/* ========================================================== */
/* Stili specifici per la pagina dei Consigli - Consigli.css */
/* ========================================================== */

/* Stile per i titoli con gradiente (unificato) */
.content-block .text-content h2 {
    color: var(--primary-color);
    background-image: linear-gradient(to right, #ADD8E6, #F0FFF0);
    font-size: 1.5rem;
    font-weight: bold;
    padding: 0.5rem 1.5rem;
    border-radius: 5px;
    display: inline-block;
    text-align: left;
    width: auto;
}

/* Stili per il layout testo/immagine (blocco con immagine) */
.content-block.content-with-image {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 2rem;
}

/* Larghezza del contenitore del testo nel blocco con immagine */
.content-block.content-with-image .text-content {
    flex: 1;
    min-width: 300px;
}

/* Larghezza del contenitore dell'immagine */
.content-block.content-with-image .image-wrapper {
    flex-basis: 350px;
    flex-shrink: 0;
    text-align: center;
}

/* Stili per le immagini */
.content-block.content-with-image img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

/* Stile per il blocco senza immagine */
.content-block.content-without-image {
    display: block;
}

/* Stile per il testo all'interno del blocco senza immagine */
.content-block.content-without-image .text-content {
    padding-left: 20px;
}

/* Stili per la lista */
.styled-list {
    list-style-type: none;
    padding-left: 0.8rem;
}

/* ========================================================== */
/* Spaziatura Generale - Funziona su tutti gli schermi */
/* ========================================================== */

.content-block {
    margin-bottom: 2rem;
}

.content-block h2.section-title-gradient,
.content-block h2 {
    margin-top: 0;
    margin-bottom: 1.5rem;
}

.content-block h3.useful-tip {
    margin-top: 1.5rem; /* Ho aggiunto 'rem' qui */
    margin-bottom: 0.5rem;
}

.content-block p {
    margin-bottom: 1rem;
}

/* Elimina il margine inferiore dell'ultimo paragrafo in ogni blocco */
.content-block p:last-of-type {
    margin-bottom: 0;
}
 /* Correzione definitiva per allineare immagine e testo in alto */
.content-block.content-with-image .image-wrapper,
.content-block.content-with-image .text-content {
    align-self: flex-start;
}

.content-block.content-with-image .image-wrapper {
    text-align: center !important;
}

.content-block.content-with-image .text-content h2 {
    margin-top: 0 !important;
}


ul, ol {
    list-style-type: none;
    padding-left: 0;
}