/* style.css front end*/

body {
  font-family: font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji" !important;
  min-height: 100vh; display: flex; flex-direction: column; font-weight: 300;
}

.navbar {
  --bs-navbar-padding-y: 1.5rem;
  --bs-navbar-padding-x: 1.5rem;
}

main { flex: 1; }
.sticky-top { border-bottom: 4px solid rgba(255, 255, 255, 0.9); }

.text-accent { color: #0288d1 !important; } //celeste

.color-2 { color: #4caf50; } 
.color-3 { color: pink; }

.bg-accent { background-color: #0288d1 !important; } //celeste
.bg-2 { background-color: #1b3a5b; } // blu

.nav-link { color: white !important; } 
.navbar-dark .navbar-nav .nav-link { color: #fff; padding: 0.5rem 1rem; transition: background-color 0.3s ease; }
.navbar-dark .navbar-nav .nav-link:hover { background-color: #495057; border-radius: 0.25rem; color: #fff; }

/* Mobile: login-logout come nav-link */
@media (max-width: 767px) {
  #login-btn, #logout-btn { background: none !important; border: none !important; padding: 0.5rem 1rem !important; width: 100%; text-align: left; display: block; color: rgba(255,255,255,1) !important; font-size: 1rem; }
  #login-btn:hover, #logout-btn:hover { background-color: #495057 !important; border-radius: 0.25rem; color: #fff !important; }
  #login-btn i, #logout-btn i { display: none !important; }
}

footer .nav-link { color: white; padding: 0.5rem 1rem; text-decoration: none; }

.logo { max-width: 151px; }

.title { position: relative; padding-bottom: 12px; }
.title::before { content: ""; position: absolute; bottom: 0; left: 0; height: 2px; width: 20%; /* lunghezza parte celeste */ background-color: #0288d1; /* celeste */ z-index: 2; }
.title::after { content: ""; position: absolute; bottom: 0; left: 0; height: 2px; width: 100%; background-color: #f1f3f5; /* #e9ecef #f8f9fa grigio chiaro */ z-index: 1; }

.section-title-border::after { content: ""; position: absolute; height: 100%; width: 25%; background: #86c33a; border-radius: 10px; right: -100%; top: 0; }
.section-title-border::before { content: ""; position: absolute; height: 100%; width: 50%; background: #86c33a; border-radius: 10px; right: -60%; top: 0; }

.def-link { text-decoration: none; color: #6c757d; }
.def-link:hover { color: #0288d1;}



/* cerca e paginazione */
.cerca-filtra { padding: 20px 20px 25px 20px; margin-bottom: 30px; }
.paginazione { padding: 15px 0 15px 0; }
.paginazione .page-link.active { background-color: #0288d1 !important; }


/* pagina campionati */
/* transizione visiva tra skeleton e contenuto reale, subito opacity 1 per uso dello skeleton */
#campionatiList { opacity: 1; transition: opacity 0.3s ease; }
#campionatiList.fade-out { opacity: 0.4; }

.card-hover:hover { background-color: #f0f8ff !important; transition: background-color 0.3s ease; }
/*.spin { animation: spin 0.8s linear infinite; }
@keyframes spin { 100% { transform: rotate(360deg); }} non ricordo per cosa*/

button.auto-disabled[aria-disabled="true"] { opacity: 0.65; cursor: default !important; }
button.auto-disabled[aria-disabled="true"] .bi-search::before { cursor: default !important; }
button.auto-disabled[aria-disabled="true"]:hover { background-color: #6c757d !important; border-color: #6c757d !important; color: #fff !important; box-shadow: none !important; } /* colore base di btn-secondary  e testo bianco */
button.auto-disabled[aria-disabled="true"]:hover .bi-search::before { content: "\f12f"; font-family: bootstrap-icons; } /* freccia sinistra */

/* pagina regolamenti, stesso grigio di text-secondary */
.link-hover:hover i { color: #6c757d !important; }

/* pagina club maps */
#map { height: 70vh; width: 100%; border: 1px solid #ccc; }
.popup-content { font-size: 0.9rem; }
.popup-content a { color: #007bff; text-decoration: underline; }

/* pagina categorie */
.card-regolamento { min-height: 160px; }
.badge-nsr { background-color: #dc3545; }
.badge-slotit { background-color: #ffc107; }
.badge-thunder { background-color: #0d8c8c; }
.badge-sideways { background-color: #0288d1; }
.badge-policar { background-color: #34c2f5; }
.badge-scaleauto { background-color: #ff8d00; }
.badge-brm { background-color: #4a4444; }
.badge-revoslot { background-color: #5f64a8; }
.badge-ninco { background-color: #df4755; }
.badge-open { background-color: #009246; }
.cat-icon-box {width:64px; height:64px;}
.cat-icon-box i {transition:color .25s ease-in-out;}
.card a:hover .cat-icon-box i { color: #444 !important; }

/* pagine pilota, club e campionati */
.no-results { font-size: 1rem; }
.no-results::before { content: "\F31D"; /* bi-emoji-frown */ font-family: "Bootstrap-icons"; display: block; font-size: 2.5rem; color: #0288d1; width: 3rem; height: 3rem; line-height: 3rem; 
  margin: 0 auto 1rem; text-align: center;}


.reset-icon { font-size: 1.2rem; color: #0288d1; cursor: pointer; margin-left: 0.5rem; display: inline-block;}
.reset-icon.clicked { animation: spinOnceFw 0.5s ease-out; }
@keyframes spinOnceFw { from { transform: rotate(360deg); } to { transform: rotate(0deg); } }

.reset-icon-inside { position: absolute; top: 50%; right: 0.75rem; transform: translateY(-50%); font-size: 1.2rem; color: #6c757d; cursor: pointer; transition: transform 0.4s ease; }
.reset-icon-inside.clicked { animation: spinOnceIns 0.5s ease-out; }
@keyframes spinOnceIns { from { transform: translateY(-50%) rotate(360deg); } to { transform: translateY(-50%) rotate(0deg); } }


/* card pilota, club e campionati */
.card-pilota, .card-club, .card-campionato { position: relative !important; overflow: hidden; border: none !important; background-color: #f8f9fa !important; overflow: hidden; }
.fw-600 { font-weight: 600; }

/* card pilota */
.card-pilota-sinistra { position: relative; width: 120px; min-width: 120px; display: flex; align-items: flex-end; justify-content: center; padding-bottom: 16px; }
.card-pilota-sfondo { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #0288d1; clip-path: polygon(0 0, 80% 0, 100% 100%, 0% 100%); z-index: 1; }
.card-pilota-image { position: relative; width: 80px; height: 80px; object-fit: cover; border-radius: 50%; z-index: 2; } /* box-shadow: 0 0 4px rgba(0,0,0,0.2); */
.card-pilota-destra { padding: 1rem; }
.card-pilota-col-barcode { position: relative; min-width: 14px; height: 100%; background-color: #adb5bd; }
.barcode { position: absolute; top: 20px; left: 4px; right: 4px; bottom: 20px; cursor: pointer;
    background-image: linear-gradient(to bottom, #000 0px, #000 2px, #fff 2px, #fff 4px, #000 4px, #000 6px,#fff 6px, #fff 8px,#000 8px, #000 11px, #fff 11px, #fff 13px, #000 13px, #000 14px, #fff 14px, #fff 17px,#000 17px, #000 20px, 
    #fff 20px, #fff 22px, #000 22px, #000 26px, #fff 26px, #fff 28px, #000 28px, #000 30px, #fff 30px, #fff 32px, #000 32px, #000 35px, #fff 35px, #fff 37px, #000 37px, #000 40px, #fff 40px, #fff 42px, #000 42px, #000 45px, #fff 45px, 
    #fff 47px, #000 47px, #000 50px, #fff 50px, #fff 52px, #000 52px, #000 55px, #fff 55px, #fff 57px, #000 57px, #000 60px, #fff 60px, #fff 62px, #000 62px, #000 65px, #fff 65px, #fff 67px, #000 67px, #000 70px, #fff 70px, #fff 72px, 
    #000 72px, #000 75px, #fff 75px, #fff 77px, #000 77px, #000 80px, #fff 80px, #fff 82px, #000 82px, #000 85px, #fff 85px, #fff 87px, #000 87px, #000 90px, #fff 90px, #fff 92px, #000 92px, #000 95px, #fff 95px, #fff 97px, #000 97px, #000 100px);
}
.card-pilota-retro { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #46484aed; color: white; visibility: hidden; opacity: 0; transform: translateX(100%); transition: transform 0.4s ease, opacity 0.4s ease, visibility 0.4s; padding: 1rem; display: flex; justify-content: center; align-items: center; text-align: center; z-index: 200; }
.card-pilota-retro.attiva { visibility: visible; opacity: 1; transform: translateX(0%); }
.card-pilota-retro-content { max-width: 98%; }
.card-pilota-retro-content button { position: relative; z-index: 201; }
.barcode-img { max-width: 100%; height: auto; display: block; margin: 0 auto; object-fit: contain; }
.overlay-globale { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: transparent; visibility: hidden; opacity: 0; transition: visibility 0.4s, opacity 0.4s; z-index: 100; pointer-events: auto; }
.overlay-globale.attiva { visibility: visible; opacity: 1; }

/* card regolamenti */
.card-body.regolamenti i { color: #0288d1; }

/* card club */
.card-club-sinistra { position: relative; min-width:40px; border-right: 4px #c0c0c0 solid;  } /* doppio bordo bianco e grigio argento box-shadow: inset -2px 0 0 white; */
.card-club-sinistra::after { position: absolute; content: "";  top: 18px; right: 6px; width: 22px; height: 22px; background-color: white; border-radius: 50%; }
.card-club-image { position: relative; width: 60px; height: 60px; object-fit: cover; border-radius: 50%; box-shadow: 0 0 4px rgba(0,0,0,0.2); z-index: 2; }
.card-club-centrale { min-height: 236px; display: flex; flex-direction: column; justify-content: flex-start;}
.card-body i { color: #8b9293; }
.link-truncate { display: inline-block; max-width: calc(100% - 1.5rem); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; }
.no-underline { text-decoration: none; }
.cursor-pointer { cursor: pointer; }
.club-note-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10; display: flex; align-items: center; justify-content: center; background-color: rgba(70, 72, 74,0.95); overflow: hidden; }
.club-note-box { position: relative; background-color: #f8f9fa; border-radius: 0.5rem; padding: 1rem; max-width: 90%; min-width: 300px; max-height: 80%; min-height: 150px; 
  overflow-y: auto; box-shadow: 0 0 10px rgba(0,0,0,0.2); transform: translateX(-100%); opacity: 0; transition: transform 0.4s ease, opacity 0.4s ease; }
.club-note-overlay.show .club-note-box { transform: translateX(0); opacity: 1; }
.club-note-header { border-bottom: 1px solid #dee2e6; padding-bottom: 0.5rem; }
.club-note-content { font-size: 0.9rem; line-height: 1.4; }

/* card campionato */
.card-campionato-sinistra { position: relative; min-width:16px; border-right: 4px #c0c0c0 solid; } /* doppio bordo bianco e grigio argento box-shadow: inset -2px 0 0 white; */
.gare-svolte { width:54px; height:54px; border-radius:50%; display:flex; flex-direction:column; align-items:center; justify-content:center; color:white; font-weight:bold; font-size:0.75rem; }
.gare-svolte > div:last-child { font-size: 0.65rem; }

/* una sorta di auto-skeleton usato per clubs, meno a mano ma sempre aggiustate van date */
[data-skeleton="true"] .skeletonize {
  position: relative; display: inline-block; color: transparent !important; background-color: transparent !important; pointer-events: none; user-select: none; white-space: nowrap;
}
[data-skeleton="true"] .skeletonize::before {
  content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 4px; background: linear-gradient(90deg, #e0e0e0 25%, #f0f0f0 50%, #e0e0e0 75%);
  background-size: 200% 100%; animation: shimmer 1.2s infinite; z-index: 1;
}

/* skeleton cards per evitare reflow visivo, usato per piloti e campionati, piu a mano */
.skeleton-card { background-color: #f8f9fa; }
.skeleton-card .skeleton-line, .skeleton-line { height: 16px; background: linear-gradient(90deg, #e0e0e0 25%, #f0f0f0 50%, #e0e0e0 75%); background-size: 200% 100%; animation: shimmer 1.2s infinite; border-radius: 4px; }
@keyframes shimmer { 0% { background-position: -200% 0; } 100% { background-position: 200% 0; } }

/* usato al momento solo nella pagina singolo campionato */
.tooltip-secondary { --bs-tooltip-bg: rgba(70, 72, 74,0.98) !important; } /* grigio scuro usato anche sulle info card-club */
.w-5 { width: 5% !important; }

/* Layout stacked attivo solo se la tabella ha la classe stacked-layout */
/* Layout stacked attivabile via JS */
.table-responsive-stack.stacked-layout {
  width: 100%; max-width: 100%; border-spacing: 0; border-collapse: collapse;
  overflow-x: hidden; /* evita scroll orizzontale */
}

/* Nasconde l'intestazione solo per stacked */
.table-responsive-stack.stacked-layout thead { display: none; }

/* Trasforma ogni riga in 3 o 4 celle per riga x 2 righe a seconda del valore di data-cols (6 od 8)*/
.table-responsive-stack.stacked-layout tbody tr {
  display: grid; grid-template-rows: auto auto; gap: 0; width: 100%;
  border: 1px solid #dee2e6; border-radius: 0.5rem; margin-bottom: 1rem; background-color: #fff;
}
.table-responsive-stack.stacked-layout[data-cols="8"] tbody tr {
  grid-template-columns: repeat(4, 1fr);
}
.table-responsive-stack.stacked-layout[data-cols="6"] tbody tr {
  grid-template-columns: repeat(3, 1fr);
}

/* Celle */
.table-responsive-stack.stacked-layout td { padding: 0.25rem; box-sizing: border-box; border: none; }

/* Riga 1 */
.table-responsive-stack.stacked-layout td.row1 { background-color: #f8f9fa; }
.table-responsive-stack.stacked-layout td.col1.row1 { grid-column: 1; grid-row: 1; text-align: left !important; border-top-left-radius: 0.5rem; font-weight: 600;}
.table-responsive-stack.stacked-layout td.col2.row1 { grid-column: 2; grid-row: 1; text-align: left !important; }
.table-responsive-stack.stacked-layout td.col3.row1 { grid-column: 3; grid-row: 1; text-align: right !important; }
.table-responsive-stack.stacked-layout td.col4.row1 { grid-column: 4; grid-row: 1; text-align: right !important; border-top-right-radius: 0.5rem; }

/* Riga 2 */
.table-responsive-stack.stacked-layout td.col1.row2 { grid-column: 1; grid-row: 2; text-align: left !important; }
.table-responsive-stack.stacked-layout td.col2.row2 { grid-column: 2; grid-row: 2; text-align: left !important; }
.table-responsive-stack.stacked-layout td.col3.row2 { grid-column: 3; grid-row: 2; text-align: right !important; }
.table-responsive-stack.stacked-layout td.col4.row2 { grid-column: 4; grid-row: 2; text-align: right !important; }

/* Data-label solo per row1 */
.table-responsive-stack.stacked-layout td.row1::before { content: attr(data-label) ":"; margin-right: 0.25rem; }

/* Data-label solo per row2 se presente */
.table-responsive-stack.stacked-layout td.row2[data-label]:not([data-label=""])::before { content: attr(data-label) "\A"; display: block; white-space: pre; }

/* Allineamento verticale riga2 */
.table-responsive-stack.stacked-layout td.row2 { align-self: center; }

/* Nasconde la cella solo in modalità stacke */
.table-responsive-stack.stacked-layout td.stacked-hide { display: none !important; }

/* Per TG al momento in home */
.telegram-bg { background-image: url('../assets/images/tg-bg-style.jpg'); background-size: cover; background-position: center; padding: 1rem; border-radius: 0.5rem; filter: brightness(1.2); }
.telegram-msg { background-color: #ffffff; border: 1px solid #cfdde8; border-radius: 0.75rem; padding: 0.75rem 1rem; margin-bottom: 0.75rem; font-size: 0.95rem; line-height: 1.4; }

/* Pagina/Scheda Pilota */
.col-pilota-left { background-color: #f8f9fa; text-align: center; padding-top: 1rem;}
.col-pilota-image-wrapper { display: inline-block;  padding: 4px; background-color: #0288d1; border-radius: 50%; margin-top: 1rem;}
.col-pilota-image { width: 150px; height: 150px; border-radius:50%; border: 2px white solid; object-fit: cover;}
.col-pilota-info { background-color: #0288d1; margin-left: 2rem; margin-right: 2rem; border-radius: 5px; color: white; margin-top: -50px; padding-top: 50px;}
.list-stat .list-group-item { padding-left: 1.9rem !important; }
.ps-1-9 { padding-left: 1.9rem !important; }

/* Per evidenziare nella pagina campionato la gara se hash pilota */
[id^="gara-"] { scroll-margin-top: 92px; } /* altezza dello sticky header */
tr.highlight-pilot > td { background-color: #cff4fc !important; }
tr.highlight-pilot { background-color: #cff4fc !important; }

/* Pagina login */
.login-body { min-height: 100vh; display: flex; align-items: center; justify-content: center; }
.login-overlay { position: fixed; inset: 0; background: #0288d1; backdrop-filter: blur(6px); z-index: 1; }
.login-container { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; }
.login-logo { width: 160px; margin-bottom: 1.2rem; }
.login-card { width: 100%; max-width: 500px; background: #fff; border-radius: 1rem; box-shadow: 0 0 30px rgba(0, 0, 0, 0.3); padding: 2rem; transition: all 0.4s ease; color: #212529; text-align: left; }
.login-card label { font-weight: 500; color: #333; }
.switch-buttons { position: relative; z-index: 2; margin-top: 1rem; display: flex; justify-content: center; gap: 1rem; }
.hidden { display: none; }
.title-fw { position: relative; text-align: center; font-weight: 500; margin-bottom: 1rem; padding-bottom: 1rem;}
.title-fw::before { content: ""; position: absolute; bottom: 0; left: 0; height: 2px; width: 100%; background-color: #0288d1; z-index: 2; }
@media (min-width: 768px) {.w-md-25 {width: 25% !important;}} /* su Pc va al 25% su cell normale, si adatta al contenuto */

/* Pagina Area Pilota */
.list-ap {margin-left: 2rem; margin-right: 2rem; padding-top: 2rem; padding-bottom: 2rem;}
.list-ap .list-group-item {background-color: transparent; transition: background-color 0.2s ease;}
.list-ap .list-group-item:hover { background-color: rgba(108, 117, 125, 0.2);  } /*#dee2e6; #e9ecef; #adb5bd*/
.list-ap .list-group-item.active { background-color: #9ca2a8; border-color: #9ca2a8; } /* #9ca2a8 --> come grigio ima default user */

.pilota-image-wrapper {position:relative; display: block; width: fit-content; margin: 2rem auto; padding: 4px; background-color: #0288d1; border-radius: 50%; } /*grigio come img default */
.pilota-image {width: 150px; height: 150px; border-radius: 50%; border: 2px white solid; object-fit: cover;}
.pilota-image-info { text-align: center; background-color: #0288d1; margin-left: 2rem; margin-right: 2rem; border-radius: 5px; color: white; margin-top: -82px; padding-top: 50px;}

/* Pagina Calendario */
#calendar { width: 100%; }  /*background: #fff;padding: 20px;border-radius: 1rem;box-shadow: 0 4px 10px rgba(0,0,0,0.1);*/
.fc-toolbar-title {text-transform: capitalize;}
.fc .fc-toolbar.fc-header-toolbar {padding: 1.5rem;background-color: #f8f9fa;}
/* colore sfondo e testo dei pulsanti */
#calendar .fc-toolbar .fc-button { color: #fff; background-color: #6c757d; border-color: #6c757d; }  /* #6c757d grigio */
/* hover e focus */
#calendar .fc-toolbar .fc-button:hover, #calendar .fc-toolbar .fc-button:focus { color: #fff; background-color: #5a6268; border-color: #5a6268;} /* #5a6268 grigio un po’ più scuro */
/* pulsante attivo */
#calendar .fc-toolbar .fc-button.fc-button-active {color: #fff; background-color: #495057; border-color: #495057; }
/* per non avere evento su riga singola */
.fc-daygrid-event { white-space: normal !important; }
.fc .fc-daygrid-day { background-color: #f8f9fa; }
/*.fc .fc-daygrid-day.fc-day-today { background-color: #f0f8ff; }*/
/* rimuove la sottolineatura dai nomi dei giorni nella vista mensile */
.fc .fc-col-header-cell-cushion { color: #212529; font-Weight: 600; text-decoration: none !important; }
/* numero del giorno nella vista Mese */
.fc .fc-daygrid-day-number { text-decoration: none; font-weight: 600; color: #212529;
 /* background-color: #0288d1; color: white; font-weight: 600; width: 28px; height: 28px; line-height: 28px; text-align: center;
  border-radius: 50%; text-decoration: none; display: flex; align-items: center; justify-content: center; margin: 0.25rem;*/ }
/* link +1 altro / +n altri*/
.fc .fc-daygrid-more-link {text-decoration:none; color:#0288d1; font-weight:600;}

/* vista lista: rimuove underline dai link giorno e data */
.fc .fc-list-day-cushion a { color: #212529; font-Weight: 600; text-decoration: none !important; }
/* vista lista: background color del th */
.fc .fc-list-day-cushion.fc-cell-shaded { background-color: #f8f9fa !important; }
/* vista lista: nasconde completamente la cella "all-day" */
.fc-list-event-time { display: none !important; }

/* Altezza fissa delle celle solo su desktop */
@media (min-width: 768px) { .fc-daygrid-day-frame { height: 150px !important; } }

/* Altezza solo per eventi multi-day */ 
.fc-daygrid-event-harness.fc-daygrid-event-harness-abs .fc-daygrid-event {min-height: 45px !important; display: flex; align-items: center; justify-content: center;} 

/* Rimuove la sottolineatura dai link della lista eventi */
.fc-list-event-link, .fc-list-event-link:hover {
  text-decoration: none !important;
}

/* Filtro sopra al calendario per mobile*/
@media (max-width: 768px) { .fc-header-toolbar { flex-wrap: wrap; text-align: center; }
  .fc-header-toolbar .fc-toolbar-chunk:nth-child(2) { order: 1; flex: 1 0 100%; display: flex; justify-content: center; margin-bottom: 0.5rem; }
  .fc-header-toolbar .fc-toolbar-chunk:nth-child(1), .fc-header-toolbar .fc-toolbar-chunk:nth-child(3) { order: 2; display: inline-flex; justify-content: center; margin: 0 0.25rem; }
  .fc-header-toolbar .fc-toolbar-chunk:nth-child(1), .fc-header-toolbar .fc-toolbar-chunk:nth-child(3) { flex: 0 0 auto; }
  .fc-header-toolbar .fc-today-button { order: 2; margin: 0 auto; }
}

/* Nasconde testo dei pulsanti month/list e mostra solo icona */
.fc-dayGridMonth-button, .fc-listMonth-button { font-size: 0 !important; padding: 6px 12px !important; min-height: 41px !important;}
.fc-dayGridMonth-button i, .fc-listMonth-button i { font-size: 1.2rem !important; margin: 0 !important; line-height: 1;}
.fc-button-group .fc-dayGridMonth-button:first-child, .fc-button-group .fc-listMonth-button:first-child { border-top-left-radius: 4px !important; border-bottom-left-radius: 4px !important;}
.fc-button-group .fc-dayGridMonth-button:last-child, .fc-button-group .fc-listMonth-button:last-child { border-top-right-radius: 4px !important; border-bottom-right-radius: 4px !important;}

/* Evita riapparizione testo invisibile */
.fc-dayGridMonth-button::after, .fc-listMonth-button::after { display: none !important;}

/* Badge eventi */
.badge-calendar {
  display: inline-block;
  width: 132px;
  text-align: center;
}
.badge-club {background-color: #6c757d; }
.badge-zone {background-color: #02bcd1; color: #212529; } 
.badge-ita {background-color: #0288d1; }

@media (max-width: 768px) {
  .badges-row .col-auto {
    flex: 0 0 calc(33.333% - 10px); /* 1/3 meno margine */
    max-width: calc(33.333% - 10px);
    padding: 0 5px; /* spazio laterale */
  }

  .badge-calendar {
    width: 100%; /* ora si allarga alla colonna */
  }
}

/* Stili specifici per WP */
body.home, body.blog, body.archive, body.category, body.search, body.tag, body.author { background-color: #f8f9fa !important; }

body.home.blog a {text-decoration: none !important;}
body.single a {text-decoration: none !important;}
body.single-post a.comment-reply-login, body.single-post a.comment-reply-link, a#cancel-comment-reply { color: #0288d1 !important; }
body.archive a {text-decoration: none !important;}
body.category a {text-decoration: none !important;}
body.search a {text-decoration: none !important;}

#comments .form-submit { text-align: right; }
#cancel-comment-reply { display:inline-block; margin-top:0.5rem; }

#sidebarOffcanvas .widget  { padding: 0.5rem; margin-bottom: 0.75rem; }
#sidebarOffcanvas .widget ul { list-style: none;  padding-left: 0; }
#sidebarOffcanvas .widget ul li { padding-top: .5rem; padding-right: 1rem; padding-bottom: .5rem; padding-left: 0;  border-bottom: 1px solid #dee2e6;}
#sidebarOffcanvas .widget ul li a { color:#333; }
#sidebarOffcanvas .list-group-item { background-color: transparent !important; }

.wp-block-tag-cloud.is-style-outline {display:flex;flex-wrap:wrap;gap:.5rem;margin:2rem 0}
.wp-block-tag-cloud.is-style-outline a {position:relative;display:inline-flex;align-items:center;justify-content:center;height:28px;line-height:28px;font-size:14px!important;padding:0 12px 0 28px;background:#636363;color:#fff;border-radius:999px;text-decoration:none!important}
.wp-block-tag-cloud.is-style-outline a:hover {background-color:#0288d1;color:#fff}
.wp-block-tag-cloud.is-style-outline a::before {content:"";position:absolute;left:10px;top:50%;width:8px;height:8px;transform:translateY(-50%);background:#fff;border-radius:50%}
.wp-block-tag-cloud.is-style-outline a::after {display:none!important}.wp-block-tag-cloud a{margin-right:.5rem}.widget-area .widget-wrapper a{color:#333}

/* Masonry */
.masonry-item { break-inside: avoid; margin-bottom: 1.5rem; display: block;}
.masonry-wrapper { display: block !important;}
.masonry { column-count: 1; column-gap: 1.5rem;}
@media (min-width: 576px) { .masonry { column-count: 2; }}
@media (min-width: 992px) { .masonry { column-count: 3; }}
.masonry-item { break-inside: avoid; margin-bottom: 1.5rem; display: block; border-color: transparent !important;}

.card-footer { border-top-color: #e9ecef !important;  background-color:transparent !important;}
.read-more { color: #0288d1; display: inline-block; margin-top: 0.5rem;}

article.card .card-title a { color: #333 !important; text-decoration: none; font-weight: 600; }
article.card .card-title a:hover { color: #006c9e !important; }
.post-image { max-width: 100%; height: auto; display: block; border-radius: 0.25rem; }