/* ==========================================================================
   MACFAAAST PREMIUM BLOG DESIGN SYSTEM - SEPARATE STYLESHEET (blog.css)
   ========================================================================== */

/* --- 1. PAGINAZIONE MODERNA (PAGINATION) --- */
.ts-pagination {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    margin: 50px 0 20px 0 !important;
    clear: both !important;
}

.ts-pagination ul.page-numbers {
    display: inline-flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 10px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.ts-pagination ul.page-numbers li {
    display: inline-block !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.ts-pagination ul.page-numbers li .page-numbers {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 40px !important;
    width: auto !important; /* Permette alla capsula di espandersi per il testo del Next/Prev */
    height: 40px !important;
    padding: 0 14px !important;
    border-radius: 50px !important; /* Totalmente stondato / Cerchio */
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    border: 1px solid #e2e2e7 !important;
    background: #f5f5f7 !important;
    color: #53627B !important; /* Coerente Slate Blue */
    text-decoration: none !important;
    box-sizing: border-box !important;
}

/* Hover state per i numeri cliccabili */
.ts-pagination ul.page-numbers li a.page-numbers:hover {
    background: #1AABE2 !important; /* Azzurro Cyan brand */
    border-color: #1AABE2 !important;
    color: #ffffff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(26, 171, 226, 0.3) !important;
}

/* Pagina corrente attiva */
.ts-pagination ul.page-numbers li .page-numbers.current {
    background: #1AABE2 !important;
    border-color: #1AABE2 !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(26, 171, 226, 0.3) !important;
    cursor: default !important;
}

/* I puntini di sospensione (dots) */
.ts-pagination ul.page-numbers li .dots {
    border: none !important;
    background: transparent !important;
    color: #86868b !important;
    cursor: default !important;
}

/* Frecce Avanti/Indietro (Next / Prev) */
.ts-pagination ul.page-numbers li a.next,
.ts-pagination ul.page-numbers li a.prev {
    font-size: 11px !important;
    font-weight: 800 !important;
    padding: 0 22px !important; /* Più spazio per la capsula del Next/Prev */
    background: #53627B !important; /* Sfondo scuro elegante */
    border-color: #53627B !important;
    color: #ffffff !important;
}

.ts-pagination ul.page-numbers li a.next:hover,
.ts-pagination ul.page-numbers li a.prev:hover {
    background: #1AABE2 !important;
    border-color: #1AABE2 !important;
    color: #ffffff !important;
}

/* Nasconde completamente l'icona freccia nativa (::before) per lasciare spazio solo al testo pulito */
.ts-pagination ul.page-numbers li a.next::before,
.ts-pagination ul.page-numbers li a.prev::before {
    display: none !important;
    content: "" !important;
}


/* --- 2. IMAPGINAZIONE BLOG - PREMIUM MINIMALIST REDESIGN --- */
.mf-blog-container,
.single-post .entry-content {
    font-family: 'Poppins', sans-serif !important;
    color: #1d1d1f !important; /* Apple Charcoal */
    line-height: 1.75 !important;
    margin: 0 auto !important;
}

.mf-blog-title,
.mf-blog-container h1.entry-title {
    color: #53627b !important; /* Blu lavagna coerente */
    font-size: 28px !important;
    font-weight: 700 !important;
    text-transform: none !important; /* Molto più elegante e leggibile del tutto maiuscolo */
    line-height: 1.25 !important;
    margin-bottom: 20px !important;
    letter-spacing: -0.5px !important;
}

.mf-blog-subtitle {
    color: #86868b !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 1.5 !important;
    margin-bottom: 30px !important;
    border-left: 3px solid #1AABE2 !important; /* Linea azzurra brand cyan più sottile */
    padding-left: 18px !important;
}

.mf-blog-section-title,
.mf-blog-container h2,
.single-post .entry-content h2,
.mf-blog-container h3,
.single-post .entry-content h3 {
    color: #53627b !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    margin-top: 35px !important;
    margin-bottom: 15px !important;
    letter-spacing: -0.3px !important;
    line-height: 1.3 !important;
}

.mf-blog-container h3,
.single-post .entry-content h3 {
    font-size: 17px !important;
    margin-top: 25px !important;
}

.mf-blog-card {
    background: #ffffff !important;
    border-radius: 12px !important;
    padding: 24px !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.03) !important;
    border: 1px solid #e2e2e7 !important;
    margin: 24px 0 !important;
    position: relative !important;
    overflow: hidden !important;
}

.mf-blog-card::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 4px !important;
    height: 100% !important;
    background: #1AABE2 !important; /* Azzurro Cyan brand */
}

.mf-blog-btn {
    display: inline-block !important;
    background: linear-gradient(135deg, #1AABE2 0%, #0071E3 100%) !important; /* Gradiente Acquista Ora dello shop */
    color: #ffffff !important;
    padding: 10px 24px !important;
    border-radius: 50px !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    text-transform: none !important;
    font-size: 13px !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    letter-spacing: 0.2px !important;
    border: none !important;
    margin-top: 15px !important;
}

.mf-blog-btn:hover {
    transform: translateY(-1.5px) !important;
    box-shadow: 0 4px 12px rgba(26, 171, 226, 0.3) !important;
}

.mf-blog-btn:active {
    transform: translateY(-0.5px) !important;
}

.mf-grid-2 {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
    gap: 20px !important;
    margin: 24px 0 !important;
}

.mf-blog-container p,
.single-post .entry-content p {
    margin-bottom: 20px !important;
    font-size: 15px !important;
    color: #1d1d1f !important;
    line-height: 1.75 !important;
}

.mf-blog-container strong,
.single-post .entry-content strong {
    color: #53627b !important;
    font-weight: 700 !important;
}

.mf-blog-container ul,
.single-post .entry-content ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 20px 0 !important;
}

.mf-blog-container ul li,
.single-post .entry-content ul li {
    padding-left: 24px !important;
    position: relative !important;
    margin-bottom: 12px !important;
    font-size: 15px !important;
    color: #1d1d1f !important;
    line-height: 1.6 !important;
}

.mf-blog-container ul li::before,
.single-post .entry-content ul li::before {
    content: '\f058' !important;
    font-family: 'Font Awesome 5 Free' !important;
    font-weight: 900 !important;
    position: absolute !important;
    left: 0 !important;
    font-size: 14px !important;
    color: #1AABE2 !important; /* Azzurro Cyan brand */
}


/* --- 3. BLOG WIDGETS (CATEGORIES & ARCHIVE) PREMIUM APPLE-STYLE CHEVRONS & UNIFORMITY --- */

/* 1. Reset standard icons or margins on blog lists */
.ts-sidebar .widget_categories ul,
.ts-sidebar .widget_archive ul {
    margin: 5px 0 !important;
    padding: 0 !important;
}

/* 2. Style links in blog categories & archive widget to match product categories */
.ts-sidebar .widget_categories li a,
.ts-sidebar .widget_archive li a {
    display: flex !important;
    align-items: center !important;
    padding: 10px 14px 10px 32px !important;
    border-radius: 10px !important;
    margin: 3px 0 !important;
    transition: all 0.25s ease !important;
    color: #4a4a4a !important;
    font-size: 0.95rem !important;
    text-decoration: none !important;
    border: 1px solid transparent !important;
    cursor: pointer !important;
    flex: 1 !important;
    min-height: 42px !important;
    position: relative !important;
}

/* 3. Chevron indicator on the left of each category link */
.ts-sidebar .widget_categories li a::before,
.ts-sidebar .widget_archive li a::before {
    content: "\f105" !important; /* FontAwesome right angle icon */
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    position: absolute !important;
    left: 14px !important;
    color: #a0a0a0 !important;
    font-size: 0.85rem !important;
    transition: all 0.2s ease !important;
    display: inline-block !important;
}

/* 4. Micro-animations and hover transitions */
.ts-sidebar .widget_categories li a:hover,
.ts-sidebar .widget_archive li a:hover {
    background: #f8f9fb !important;
    color: #1AABE2 !important;
}

.ts-sidebar .widget_categories li a:hover::before,
.ts-sidebar .widget_archive li a:hover::before {
    color: #1AABE2 !important;
    transform: translateX(2px) !important;
}

/* 5. Active category styling (Cyan background, bold text, cyan indicator) */
.ts-sidebar .widget_categories li.current-cat > a,
.ts-sidebar .widget_archive li.current-cat > a {
    background: #eef6fc !important;
    color: #1AABE2 !important;
    font-weight: 800 !important;
    border-radius: 10px !important;
}

.ts-sidebar .widget_categories li.current-cat > a::before,
.ts-sidebar .widget_archive li.current-cat > a::before {
    color: #1AABE2 !important;
    transform: translateX(2px) !important;
}

/* 6. Active state for the new count badge */
.ts-sidebar .widget_categories li.current-cat > a span.count,
.ts-sidebar .widget_archive li.current-cat > a span.count {
    background: #1AABE2 !important;
    color: #ffffff !important;
}


/* --- 4. UNIFIED PREMIUM APPLE-STYLE SIDEBAR FOR BLOG (STANDARD & GUTENBERG WIDGETS) --- */

/* 1. Contenitore Widget Esterno */
body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container,
body:not(.woocommerce):not(.woocommerce-page) .widget-area .widget,
body:not(.woocommerce):not(.woocommerce-page) #secondary .widget {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 20px 0 0 0 !important;
}

/* 2. Intestazione del Widget (Titolo Blocco con background grigio e bordo azzurro) */
body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container h2.widget-title,
body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container h2.wp-block-heading,
body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container h3.widget-title,
body:not(.woocommerce):not(.woocommerce-page) .widget-area .widget h2.widget-title,
body:not(.woocommerce):not(.woocommerce-page) #secondary .widget h2.widget-title {
    margin: 0 !important;
    margin-bottom: 0 !important;
    padding: 16px 20px !important;
    border-left: 4px solid #1AABE2 !important;
    background: #f4f5f7 !important;
    border-radius: 8px 8px 0 0 !important;
    display: block !important;
    line-height: 1.2 !important;
    font-size: 1.05rem !important;
    font-weight: 800 !important;
    color: #1d1d1f !important;
    text-transform: uppercase !important;
    letter-spacing: 0.8px !important;
    box-sizing: border-box !important;
}

/* 2.1 Rimozione pseudo-elementi sui titoli widget della sidebar */
body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container h2.widget-title::before,
body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container h2.wp-block-heading::before,
body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container h3.widget-title::before,
body:not(.woocommerce):not(.woocommerce-page) .widget-area .widget h2.widget-title::before,
body:not(.woocommerce):not(.woocommerce-page) #secondary .widget h2.widget-title::before,
body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container h2.widget-title::after,
body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container h2.wp-block-heading::after,
body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container h3.widget-title::after,
body:not(.woocommerce):not(.woocommerce-page) .widget-area .widget h2.widget-title::after,
body:not(.woocommerce):not(.woocommerce-page) #secondary .widget h2.widget-title::after {
    display: none !important;
    content: none !important;
}

/* 3. Area Contenuto (Sotto il Titolo, con sfondo bianco, bordi e ombra soffice) */
body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container h2.widget-title + *,
body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container h2.wp-block-heading + *,
body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container h3.widget-title + *,
body:not(.woocommerce):not(.woocommerce-page) .widget-area .widget h2.widget-title + *,
body:not(.woocommerce):not(.woocommerce-page) #secondary .widget h2.widget-title + * {
    margin-top: 0 !important;
    background: #ffffff !important;
    padding: 15px 15px !important;
    border-radius: 0 0 8px 8px !important;
    border: 1px solid #f0f0f4 !important;
    border-top: none !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02) !important;
    box-sizing: border-box !important;
    display: block !important;
}

/* 4. Lista e Elementi della Lista */
body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container ul,
body:not(.woocommerce):not(.woocommerce-page) .widget-area .widget ul {
    margin: 5px 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container li,
body:not(.woocommerce):not(.woocommerce-page) .widget-area .widget li {
    position: relative !important;
    padding: 0 !important;
    border-bottom: none !important;
    list-style: none !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    width: 100% !important;
}

/* 5. Link e Label Interni */
body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container li a,
body:not(.woocommerce):not(.woocommerce-page) .widget-area .widget li a {
    display: flex !important;
    align-items: center !important;
    padding: 10px 14px 10px 32px !important;
    border-radius: 10px !important;
    margin: 3px 0 !important;
    transition: all 0.25s ease !important;
    color: #4a4a4a !important;
    font-size: 0.95rem !important;
    text-decoration: none !important;
    border: 1px solid transparent !important;
    cursor: pointer !important;
    flex: 1 !important;
    min-height: 42px !important;
    position: relative !important;
    box-sizing: border-box !important;
}

/* 6. Chevron a Sinistra con Micro-Animazione */
body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container li a::before,
body:not(.woocommerce):not(.woocommerce-page) .widget-area .widget li a::before {
    content: "\f105" !important; /* FontAwesome right angle icon */
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    position: absolute !important;
    left: 14px !important;
    color: #a0a0a0 !important;
    font-size: 0.85rem !important;
    transition: all 0.25s ease !important;
    display: inline-block !important;
}

/* 7. Hover Effect */
body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container li a:hover,
body:not(.woocommerce):not(.woocommerce-page) .widget-area .widget li a:hover {
    background: #f8f9fb !important;
    color: #1AABE2 !important;
}

body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container li a:hover::before,
body:not(.woocommerce):not(.woocommerce-page) .widget-area .widget li a:hover::before {
    color: #1AABE2 !important;
    transform: translateX(2px) !important;
}

/* 8. Stato Categoria Attiva (Azzurro Chiaro, Testo Cyan, Chevron Cyan) */
body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container li.current-cat > a,
body:not(.woocommerce):not(.woocommerce-page) .widget-area .widget li.current-cat > a {
    background: #eef6fc !important;
    color: #1AABE2 !important;
    font-weight: 800 !important;
    border-radius: 10px !important;
}

body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container li.current-cat > a::before,
body:not(.woocommerce):not(.woocommerce-page) .widget-area .widget li.current-cat > a::before {
    color: #1AABE2 !important;
    transform: translateX(2px) !important;
}

/* 9. Pillola del Contatore Articoli (Grigio di Base) */
body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container span.count,
body:not(.woocommerce):not(.woocommerce-page) .widget-area .widget span.count {
    font-size: 0.75rem !important;
    background: #f4f5f7 !important;
    color: #666 !important;
    padding: 3px 9px !important;
    border-radius: 12px !important;
    font-weight: 700 !important;
    min-width: 30px !important;
    text-align: center !important;
    transition: all 0.2s ease !important;
    display: inline-block !important;
    border: 1px solid transparent !important;
    margin-left: auto !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
}

/* Hover Contatore */
body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container li a:hover span.count,
body:not(.woocommerce):not(.woocommerce-page) .widget-area .widget li a:hover span.count {
    background: #e0e2e6 !important;
}

/* Contatore dello Stato Attivo (Azzurro Solido con Testo Bianco) */
body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container li.current-cat > a span.count,
body:not(.woocommerce):not(.woocommerce-page) .widget-area .widget li.current-cat > a span.count {
    background: #1AABE2 !important;
    color: #ffffff !important;
}



/* --- 5. MODERN EDITORIAL BLOG LAYOUT: TITLE ABOVE FEATURED IMAGE --- */
article.post-item {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    margin-bottom: 35px !important;
    padding: 35px !important;
    border-radius: 16px !important;
    border: 1px solid #e2e2e7 !important;
    box-sizing: border-box !important;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

/* Alternanza di sfondo delle card (Zebra striping Bianco / Grigio) */
article.post-item:nth-of-type(odd) {
    background: #ffffff !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02) !important;
}

article.post-item:nth-of-type(even) {
    background: #f5f5f7 !important; /* Grigio chiaro istituzionale Apple */
    box-shadow: none !important;
}

/* Hover effect sulle card */
article.post-item:hover {
    transform: translateY(-3px) !important;
    border-color: #d2d2d7 !important;
}

article.post-item:nth-of-type(odd):hover {
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.06) !important;
}

article.post-item:nth-of-type(even):hover {
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.04) !important;
}

article.post-item:last-child {
    margin-bottom: 0 !important;
}

article.post-item .entry-header-above {
    order: 1 !important;
    margin-bottom: 5px !important;
    padding: 0 !important;
    display: block !important;
}

article.post-item .entry-header-above h2.entry-title {
    font-size: 1.65rem !important;
    font-weight: 800 !important;
    color: #1d1d1f !important;
    line-height: 1.35 !important;
    letter-spacing: -0.5px !important;
    margin: 0 !important;
    text-transform: none !important;
}

article.post-item .entry-header-above h2.entry-title a.post-title {
    color: #53627B !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

article.post-item .entry-header-above h2.entry-title a.post-title:hover {
    color: #1AABE2 !important;
}

article.post-item .entry-format {
    order: 2 !important; /* Sposta la foto sotto il titolo */
    margin: 0 !important;
}

article.post-item .entry-content {
    order: 3 !important; /* Sposta il testo sotto la foto */
    padding: 0 !important;
}

/* --- 6. SINGLE POST LAYOUT: ELEGANT & COHERENT WITH ARCHIVE --- */
article.single-post .entry-header-above {
    margin-bottom: 25px !important;
    padding: 0 !important;
    display: block !important;
}

article.single-post .entry-header-above h1.entry-title {
    font-size: 2.3rem !important;
    font-weight: 800 !important;
    color: #53627B !important;
    line-height: 1.25 !important;
    letter-spacing: -0.8px !important;
    margin: 15px 0 0 0 !important;
    text-transform: none !important;
}

article.single-post .entry-format {
    margin-bottom: 35px !important;
    margin-top: 0 !important;
}

article.single-post .entry-content {
    margin-top: 20px !important;
    padding: 0 !important;
}


/* Responsive adjustment per mobile - Massimizza lo spazio di lettura ed elimina spazi bianchi superflui */
@media only screen and (max-width: 767px) {
    /* 1. Riduciamo lo spazio bianco esterno e laterale dei contenitori principali del blog */
    .page-container,
    .container-post,
    .mf-blog-container,
    #content,
    #main-content {
        padding-left: 10px !important;
        padding-right: 10px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* 2. Riduciamo il padding interno delle card post (da 35px a 20px/14px) per allargare l'area di testo */
    article.post-item {
        padding: 20px 14px !important; /* Massimo spazio al testo della notizia */
        margin-bottom: 24px !important;
        border-radius: 12px !important;
        gap: 16px !important;
    }

    /* Riduzione titolo dei post nella lista */
    article.post-item .entry-header-above h2.entry-title {
        font-size: 1.35rem !important;
    }

    /* 3. Incorniciatura immagine più compatta (da 16px a 8px) per ingrandire la foto dell'articolo */
    article.post-item .entry-format {
        padding: 8px !important;
        border-radius: 10px !important;
    }

    /* 4. Ottimizzazioni per l'articolo singolo (Single Post) */
    article.single-post {
        padding: 0 4px !important; /* Il testo respira fino al bordo su mobile */
    }

    article.single-post .entry-header-above h1.entry-title {
        font-size: 1.65rem !important; /* Più leggibile ed elegante su cellulare */
        line-height: 1.3 !important;
    }

    article.single-post .entry-format {
        margin-bottom: 24px !important;
    }

    article.single-post .entry-content {
        padding: 0 !important;
    }
}


/* --- 7. PREMIUM META BADGES & TYPOGRAPHY FOR MODERN EDITORIAL LAYOUT --- */
.entry-meta-above {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin-bottom: 12px !important;
}

/* Badge "Nuovo Post" - Design Soft-Glassmorphic con Micro-Animazione */
.entry-meta-above .new-post-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 24px !important; /* Altezza fissa matematica */
    gap: 6px !important;
    background: rgba(26, 171, 226, 0.08) !important; /* Tinta azzurra soft */
    color: #1AABE2 !important; /* Azzurro brand */
    font-size: 11px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    padding: 0 12px 0 10px !important; /* Bilanciato per il dot */
    border-radius: 20px !important;
    line-height: 24px !important;
    border: 1px solid rgba(26, 171, 226, 0.18) !important;
    user-select: none !important;
    box-sizing: border-box !important;
}

/* Pulsing dot prima del testo */
.entry-meta-above .new-post-badge::before {
    content: "" !important;
    display: inline-block !important;
    width: 6px !important;
    height: 6px !important;
    background-color: #1AABE2 !important;
    border-radius: 50% !important;
    animation: mf-pulse-dot 2s infinite ease-in-out !important;
    flex-shrink: 0 !important;
}

@keyframes mf-pulse-dot {
    0% {
        transform: scale(0.85);
        opacity: 0.5;
        box-shadow: 0 0 0 0 rgba(26, 171, 226, 0.4);
    }
    50% {
        transform: scale(1.15);
        opacity: 1;
        box-shadow: 0 0 6px 2px rgba(26, 171, 226, 0.35);
    }
    100% {
        transform: scale(0.85);
        opacity: 0.5;
        box-shadow: 0 0 0 0 rgba(26, 171, 226, 0);
    }
}


/* Badge "Ultimo Post" - Variante Arancione Apple premium per il post più recente in assoluto */
.entry-meta-above .latest-post-badge {
    background: rgba(255, 149, 0, 0.08) !important; /* Tinta arancione soft */
    color: #FF9500 !important; /* Arancione Apple */
    border: 1px solid rgba(255, 149, 0, 0.22) !important;
}

/* Pulsing dot arancione per l'ultimo post */
.entry-meta-above .latest-post-badge::before {
    background-color: #FF9500 !important;
    animation: mf-pulse-dot-orange 2s infinite ease-in-out !important;
}

@keyframes mf-pulse-dot-orange {
    0% {
        transform: scale(0.85);
        opacity: 0.5;
        box-shadow: 0 0 0 0 rgba(255, 149, 0, 0.4);
    }
    50% {
        transform: scale(1.15);
        opacity: 1;
        box-shadow: 0 0 6px 2px rgba(255, 149, 0, 0.35);
    }
    100% {
        transform: scale(0.85);
        opacity: 0.5;
        box-shadow: 0 0 0 0 rgba(255, 149, 0, 0);
    }
}


/* Category Badge style (Slate Grey-Blue match) */
.entry-meta-above .cats-link-badge a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 24px !important; /* Stessa altezza fissa matematica */
    background: #f0f3f6 !important;
    color: #53627B !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    padding: 0 10px !important; /* Stesso padding orizzontale */
    border-radius: 20px !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    line-height: 24px !important;
    box-shadow: inset 0 0 0 1px rgba(83, 98, 123, 0.08) !important;
    box-sizing: border-box !important;
}

.entry-meta-above .cats-link-badge a:hover {
    background: #53627B !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 10px rgba(83, 98, 123, 0.2) !important;
}

/* Date and Separator styling */
.entry-meta-above .date-time-bullet {
    color: #d2d2d7 !important;
    font-size: 14px !important;
    user-select: none !important;
    margin: 0 4px !important;
}

.entry-meta-above .date-time-text {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #86868b !important;
    letter-spacing: 0.2px !important;
    text-transform: none !important;
}

/* Rimuovi eventuali vecchi overlay di data sulle immagini in evidenza per pulizia grafica */
article.post-item .entry-format span.date-time {
    display: none !important;
}


/* --- 8. PREMIUM EMBEDDED IMAGE CONTAINER --- */
article.post-item .entry-format {
    order: 2 !important;
    position: relative !important;
    overflow: hidden !important;
    border-radius: 14px !important;
    border: 1px solid #e2e2e7 !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.02) !important;
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
    margin: 0 !important;
    padding: 16px !important; /* Incornicia elegantemente la foto all'interno */
    box-sizing: border-box !important;
}

/* Incastonatura e sfondo dell'immagine alternata in base al colore della card */
article.post-item:nth-of-type(odd) .entry-format {
    background: #f5f5f7 !important; /* Sfondo grigio su card bianca */
}

article.post-item:nth-of-type(even) .entry-format {
    background: #ffffff !important; /* Sfondo bianco su card grigia */
}

/* Make sure the figure and image inside fill the container correctly */
article.post-item .entry-format figure {
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    border-radius: 8px !important;
}

article.post-item .entry-format img.thumbnail-blog,
article.post-item .entry-format img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1) !important;
    object-fit: cover !important;
    border-radius: 8px !important; /* Stonda la foto incastonata */
}

/* Hover effects on the container */
article.post-item:hover .entry-format {
    transform: translateY(-2px) !important;
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.08) !important;
    border-color: #d2d2d7 !important;
}

/* Zoom animation on the image when hovering over the post card */
article.post-item:hover .entry-format img {
    transform: scale(1.03) !important;
}

/* Applica lo stesso splendido contenitore all'immagine anche nella pagina del singolo articolo */
article.single-post .entry-format {
    position: relative !important;
    overflow: hidden !important;
    border-radius: 16px !important;
    border: 1px solid #e2e2e7 !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05) !important;
}

article.single-post .entry-format img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
}


/* --- 9. PREMIUM READ MORE BUTTON (LEGGI TUTTO) --- */
article.post-item .entry-meta-bottom {
    margin-top: 18px !important;
    display: block !important;
}

article.post-item a.button-readmore {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: linear-gradient(135deg, #1AABE2 0%, #0071E3 100%) !important; /* Gradiente ufficiale del brand */
    color: #ffffff !important; /* Testo bianco ad alto contrasto */
    font-size: 11px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 1.2px !important;
    padding: 10px 24px !important; /* Proporzioni simmetriche perfette */
    border-radius: 30px !important;
    text-decoration: none !important;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
    box-shadow: 0 4px 14px rgba(26, 171, 226, 0.22) !important;
    border: none !important;
    position: relative !important;
}

/* Rimuove qualsiasi icona ::before generata dal tema padre */
article.post-item a.button-readmore::before {
    display: none !important;
    content: none !important;
}

/* RESET TOTALE del posizionamento assoluto ed ereditarietà del tema padre su ::after */
article.post-item a.button-readmore::after {
    content: "\2192" !important; /* Unicode Thin Arrow Right */
    position: static !important; /* RIPORTA nel flusso normale, annullando position:absolute! */
    display: inline-block !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    border-bottom: none !important; /* Rimuove la sottolineatura ereditata */
    font-size: 15px !important;
    line-height: 1 !important;
    margin-left: 8px !important;
    color: #ffffff !important; /* Freccia bianca coordinata */
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

article.post-item a.button-readmore:hover {
    background: linear-gradient(135deg, #0071E3 0%, #0059B3 100%) !important; /* Transizione su blu Apple profondo */
    color: #ffffff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(0, 113, 227, 0.35) !important;
}

/* Micro-animazione della freccia all'hover */
article.post-item a.button-readmore:hover::after {
    color: #ffffff !important;
    transform: translateX(4px) !important;
}

article.post-item a.button-readmore:active {
    transform: translateY(-0.5px) scale(0.97) !important;
    box-shadow: 0 3px 10px rgba(0, 113, 227, 0.2) !important;
}


/* --- 10. PREMIUM ROUNDED TAGS CLOUD (APPLE PILL STYLE) --- */
.tagcloud, 
.widget_tag_cloud .tagcloud,
.wp-block-tag-cloud {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin-top: 10px !important;
}

/* Base style for tag links */
.tagcloud a, 
.widget_tag_cloud .tagcloud a,
.wp-block-tag-cloud a,
.tags-link a,
.entry-meta-bottom .tags-link a {
    display: inline-block !important;
    font-size: 11px !important; /* Forza tag di dimensione uniforme e ordinata */
    font-weight: 700 !important;
    color: #53627B !important; /* Blu lavagna coerente */
    background: #f5f5f7 !important;
    border: 1px solid #e2e2e7 !important;
    padding: 6px 14px !important;
    border-radius: 50px !important; /* Stondati / Capsule style */
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    text-decoration: none !important;
    line-height: 1.2 !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    margin: 0 !important; /* Annulla i margini disordinati di default */
}

/* Hover style (Site Brand Hover Color) */
.tagcloud a:hover, 
.widget_tag_cloud .tagcloud a:hover,
.wp-block-tag-cloud a:hover,
.tags-link a:hover,
.entry-meta-bottom .tags-link a:hover {
    background: #1AABE2 !important; /* Azzurro Cyan di hover del sito */
    border-color: #1AABE2 !important;
    color: #ffffff !important;
    transform: translateY(-1.5px) !important;
    box-shadow: 0 4px 12px rgba(26, 171, 226, 0.3) !important;
}

/* Active/Focus state */
.tagcloud a:active,
.tags-link a:active {
    transform: translateY(-0.5px) !important;
}


/* --- 11. PREMIUM ROUNDED SIDEBAR SEARCH BAR (APPLE PILL STYLE) --- */
.widget_search .search-table,
.widget_product_search .search-table,
.ts-sidebar .search-table {
    display: flex !important;
    align-items: center !important;
    background: #f5f5f7 !important; /* Grigio chiaro istituzionale */
    border: 1px solid #e2e2e7 !important;
    border-radius: 50px !important; /* Totalmente stondata / Capsula */
    padding: 3px 4px 3px 16px !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    box-sizing: border-box !important;
    width: 100% !important;
    height: 48px !important;
    margin: 0 !important;
    float: none !important;
}

.widget_search .search-table:focus-within,
.widget_product_search .search-table:focus-within,
.ts-sidebar .search-table:focus-within {
    background: #ffffff !important;
    border-color: #1AABE2 !important; /* Azzurro Cyan di hover */
    box-shadow: 0 0 0 3px rgba(26, 171, 226, 0.15) !important;
}

/* Input text container inside flex */
.widget_search .search-table .search-field,
.widget_product_search .search-table .search-field,
.ts-sidebar .search-table .search-field {
    display: block !important;
    flex: 1 !important;
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    height: 100% !important;
}

/* Input field style */
.widget_search .search-table .search-field input[type="text"],
.widget_product_search .search-table .search-field input[type="text"],
.ts-sidebar .search-table .search-field input[type="text"] {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    border: none !important;
    background: transparent !important;
    color: #1d1d1f !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    padding: 0 10px 0 0 !important;
    outline: none !important;
    box-shadow: none !important;
}

/* Placeholder color */
.widget_search .search-table .search-field input[type="text"]::placeholder,
.widget_product_search .search-table .search-field input[type="text"]::placeholder,
.ts-sidebar .search-table .search-field input[type="text"]::placeholder {
    color: #86868b !important;
    opacity: 1 !important;
}

/* Button container inside flex */
.widget_search .search-table .search-button,
.widget_product_search .search-table .search-button,
.ts-sidebar .search-table .search-button {
    position: static !important; /* Rimuove il posizionamento assoluto del tema genitore */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    height: 100% !important;
    width: auto !important; /* Forza larghezza fluida e adattiva */
}

/* Impedisce al parent theme di iniettare icone fontawesome/icon-font che rompono il layout */
.widget_search .search-table .search-button::before,
.widget_product_search .search-table .search-button::before,
.ts-sidebar .search-table .search-button::before,
.widget_search .search-table .search-button::after,
.widget_product_search .search-table .search-button::after,
.ts-sidebar .search-table .search-button::after {
    display: none !important;
    content: "" !important;
}

/* Search Submit Button styling */
.widget_search .search-table .search-button input[type="submit"],
.widget_product_search .search-table .search-button input[type="submit"],
.ts-sidebar .search-table .search-button input[type="submit"] {
    position: static !important; /* Rimuove il posizionamento assoluto del tema genitore per tenerlo dentro il flex */
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important; /* Larghezza adattiva */
    min-width: 85px !important; /* Evita il troncamento del testo in italiano (CERCA) */
    height: 38px !important; /* Perfettamente centrato verticalmente rispetto ai 48px del padre */
    line-height: 38px !important;
    background: #53627B !important; /* Blu lavagna coerente */
    color: #ffffff !important;
    border: none !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    padding: 0 16px !important;
    border-radius: 50px !important; /* Bottone a capsula all'interno */
    cursor: pointer !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    margin: 0 !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    align-self: center !important;
}

/* Hover state per il bottone di ricerca */
.widget_search .search-table .search-button input[type="submit"]:hover,
.widget_product_search .search-table .search-button input[type="submit"]:hover,
.ts-sidebar .search-table .search-button input[type="submit"]:hover {
    background: #1AABE2 !important; /* Azzurro Cyan di hover */
    color: #ffffff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 10px rgba(26, 171, 226, 0.25) !important;
}

.widget_search .search-table .search-button input[type="submit"]:active,
.widget_product_search .search-table .search-button input[type="submit"]:active,
.ts-sidebar .search-table .search-button input[type="submit"]:active {
    transform: translateY(0px) !important;
}


/* --- 12. RESPONSIVE SIDEBAR & WIDGET OPTIMIZATIONS FOR MOBILE DEVICES --- */
@media only screen and (max-width: 767px) {
    /* 1. Spaziatura elegante e allineamento perfetto per la sidebar su cellulare */
    body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar,
    body:not(.woocommerce):not(.woocommerce-page) #left-sidebar,
    body:not(.woocommerce):not(.woocommerce-page) #right-sidebar,
    body:not(.woocommerce):not(.woocommerce-page) #secondary {
        width: 100% !important;
        padding: 0 15px !important; /* Margine di sicurezza dai bordi del telefono */
        box-sizing: border-box !important;
        float: none !important;
        margin-top: 40px !important; /* Separa elegantemente i widget dai post soprastanti */
    }

    /* 2. Riduzione delle intestazioni dei widget per schermi piccoli per non sprecare spazio */
    body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container h2.widget-title,
    body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container h2.wp-block-heading,
    body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container h3.widget-title,
    body:not(.woocommerce):not(.woocommerce-page) .widget-area .widget h2.widget-title,
    body:not(.woocommerce):not(.woocommerce-page) #secondary .widget h2.widget-title {
        font-size: 0.95rem !important;
        padding: 14px 18px !important;
    }

    /* 3. Area contenuto interna del widget leggermente più compatta su mobile */
    body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container h2.widget-title + *,
    body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container h2.wp-block-heading + *,
    body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container h3.widget-title + *,
    body:not(.woocommerce):not(.woocommerce-page) .widget-area .widget h2.widget-title + *,
    body:not(.woocommerce):not(.woocommerce-page) #secondary .widget h2.widget-title + * {
        padding: 12px 12px !important;
    }

    /* 4. Touch target più comodi per i link delle categorie e archivi su cellulare */
    body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container li a,
    body:not(.woocommerce):not(.woocommerce-page) .widget-area .widget li a {
        padding: 12px 14px 12px 30px !important; /* Più spazio verticale per il tocco delle dita */
        font-size: 0.9rem !important;
    }

    /* Posizionamento freccette allineato */
    body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .widget-container li a::before,
    body:not(.woocommerce):not(.woocommerce-page) .widget-area .widget li a::before {
        left: 12px !important;
    }

    /* 5. Ottimizzazione della barra di ricerca della sidebar su schermi ultra-piccoli */
    body:not(.woocommerce):not(.woocommerce-page) .widget_search .search-table,
    body:not(.woocommerce):not(.woocommerce-page) .widget_product_search .search-table,
    body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .search-table {
        height: 44px !important; /* Leggermente più basso per mobile */
        padding: 3px 3px 3px 12px !important;
    }

    body:not(.woocommerce):not(.woocommerce-page) .widget_search .search-table .search-field input[type="text"],
    body:not(.woocommerce):not(.woocommerce-page) .widget_product_search .search-table .search-field input[type="text"],
    body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .search-table .search-field input[type="text"] {
        font-size: 12px !important;
    }

    body:not(.woocommerce):not(.woocommerce-page) .widget_search .search-table .search-button input[type="submit"],
    body:not(.woocommerce):not(.woocommerce-page) .widget_product_search .search-table .search-button input[type="submit"],
    body:not(.woocommerce):not(.woocommerce-page) .ts-sidebar .search-table .search-button input[type="submit"] {
        height: 36px !important;
        min-width: 75px !important;
        padding: 0 12px !important;
        font-size: 10px !important;
    }
}