/* ===========================================
   MISS OTTER - CSS PERSONALIZZATO
   Tema: Clarity per Hugo
   =========================================== */

/* ----- VARIABILI COLORI ----- */
:root {
  --accent-color: #556b58;
  --link-color: #556b58;
  --heading-color: #556b58;
  --nav-link-color: #556b58;
  --code-bg: #f5f5f0;
  --body-bg: #fefefe;
  --text-color: #333;
}

/* ----- LINK ----- */
a {
  color: var(--link-color);
}

a:hover {
  color: #3d4f40;
}

/* ----- TITOLI ----- */
h1, h2, h3, h4, h5, h6 {
  color: var(--heading-color);
}

/* ----- NAVIGAZIONE ----- */
nav a,
.nav a,
.menu a,
header a {
  color: var(--nav-link-color);
}

nav a:hover,
.nav a:hover,
.menu a:hover,
header a:hover {
  color: #3d4f40;
}

nav a.active,
.nav a.active,
.menu-item.active a {
  border-bottom: 2px solid var(--accent-color);
}

/* ----- BOTTONI ----- */
button,
.button,
.btn,
input[type="submit"] {
  background-color: var(--accent-color);
  border-color: var(--accent-color);
}

button:hover,
.button:hover,
.btn:hover,
input[type="submit"]:hover {
  background-color: #3d4f40;
}

/* ----- ICONE SOCIAL ----- */
svg {
  width: 1em !important;
  height: 1em !important;
  max-width: 20px !important;
  max-height: 20px !important;
}

.social svg,
.social-icons svg,
footer svg,
.share svg {
  width: 16px !important;
  height: 16px !important;
}

/* ----- NASCONDI DATA NELLE PAGINE ----- */
.post_meta,
.post-meta,
article time,
.post_date,
.page time,
article header time,
.post_content time {
  display: none !important;
}

/* ----- NASCONDI TAGS ----- */
article a[href*="/tags/"],
.post a[href*="/tags/"],
.excerpt a[href*="/tags/"],
.post_item a[href*="/tags/"] {
  display: none !important;
}

.tags,
section.tags,
div.tags,
aside .tags,
#tags,
h2 + .tags,
[class*="tag-cloud"],
.widget_tag_cloud,
.taxonomy,
.mt-4.taxonomy,
.tags_nav,
nav.tags_nav {
  display: none !important;
}

/* ----- NASCONDI SHARE ----- */
.share,
.post_share,
.post.share,
article .share,
.post_item .share,
.excerpt .share,
[class*="share-button"],
[class*="social-share"] {
  display: none !important;
}

/* ----- NASCONDI CATEGORIE ----- */
a[href*="/categories/"],
.categories,
.category-list {
  display: none !important;
}

/* ----- TIPOGRAFIA ----- */
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  color: var(--text-color);
  background-color: var(--body-bg);
  line-height: 1.7;
}

code,
pre {
  background-color: var(--code-bg);
  border-radius: 4px;
}

pre {
  padding: 1em;
  overflow-x: auto;
}

/* ----- IMMAGINI GENERICHE ----- */
article img,
.post img,
.content img {
  max-width: 100%;
  height: auto;
  border-radius: 4px;
}

/* ----- BLOCKQUOTE ----- */
blockquote {
  border-left: 4px solid var(--accent-color);
  padding-left: 1em;
  margin-left: 0;
  font-style: italic;
  color: #555;
}

/* ----- FOOTER ----- */
footer {
  border-top: 1px solid #eee;
  padding-top: 2em;
  margin-top: 3em;
  color: #666;
}

/* ----- RESPONSIVE ----- */
@media (max-width: 768px) {
  body {
    font-size: 16px;
  }
  h1 {
    font-size: 1.8em;
  }
  h2 {
    font-size: 1.5em;
  }
}

/* ===========================================
   LAYOUT TRADUZIONI - CARDS
   =========================================== */
.traduzioni-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important;
  gap: 30px !important;
  margin-top: 30px !important;
}

.traduzione-card {
  background: #fff !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  box-shadow: 0 2px 12px rgba(0,0,0,0.08) !important;
  transition: transform 0.2s, box-shadow 0.2s !important;
  border: 1px solid #eee !important;
}

.traduzione-card:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.12) !important;
}

.traduzione-card > img,
.traduzione-card > p > img {
  width: 100% !important;
  height: 180px !important;
  object-fit: cover !important;
  object-position: center 20% !important;
  border-radius: 0 !important;
  margin: 0 !important;
}

.traduzione-card-body {
  padding: 20px !important;
}

.traduzione-card-body h3 {
  color: #556b58 !important;
  margin: 0 0 6px 0 !important;
  font-size: 1.2rem !important;
}

.traduzione-card-body .titolo-pezzo {
  font-style: italic !important;
  color: #888 !important;
  font-size: 0.95rem !important;
  margin: 0 0 12px 0 !important;
  border-bottom: 1px solid #eee !important;
  padding-bottom: 12px !important;
}

.traduzione-card-body .titolo-pezzo a {
  color: #556b58 !important;
  text-decoration: none !important;
}

.traduzione-card-body .titolo-pezzo a:hover {
  text-decoration: underline !important;
}

.traduzione-card-body .descrizione {
  font-size: 0.9rem !important;
  color: #555 !important;
  line-height: 1.5 !important;
  margin: 0 !important;
}

/* ===========================================
   LAYOUT PROPOSTE - GRIGLIA CON HOVER
   =========================================== */
.proposte-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)) !important;
  gap: 30px !important;
  margin-top: 30px !important;
}

.proposta-item {
  display: block !important;
  text-decoration: none !important;
  color: inherit !important;
}

.proposta-cover {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 6px !important;
  box-shadow: 0 4px 15px rgba(0,0,0,0.15) !important;
  aspect-ratio: 2/3 !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  transition: transform 0.3s, box-shadow 0.3s !important;
}

.proposta-item:hover .proposta-cover {
  transform: translateY(-8px) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,0.25) !important;
}

.proposta-overlay {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background: linear-gradient(
    to top,
    rgba(85, 107, 88, 0.95) 0%,
    rgba(85, 107, 88, 0.85) 50%,
    rgba(85, 107, 88, 0.7) 100%
  ) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important;
  padding: 20px 15px !important;
  opacity: 0 !important;
  transition: opacity 0.3s ease !important;
}

.proposta-item:hover .proposta-overlay {
  opacity: 1 !important;
}

.proposta-overlay .descrizione {
  color: rgba(255,255,255,0.95) !important;
  font-size: 0.85rem !important;
  line-height: 1.4 !important;
  margin: 0 !important;
}

.proposta-overlay .download-hint {
  display: block !important;
  margin-top: 12px !important;
  padding-top: 10px !important;
  border-top: 1px solid rgba(255,255,255,0.3) !important;
  color: white !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
}

/* Mobile: overlay sempre visibile */
@media (max-width: 768px) {
  .proposta-overlay {
    opacity: 1 !important;
    background: linear-gradient(
      to top,
      rgba(85, 107, 88, 0.95) 0%,
      rgba(85, 107, 88, 0.6) 60%,
      transparent 100%
    ) !important;
  }
}

/* Nascondi didascalie Clarity */
.proposte-grid figcaption {
  display: none !important;
}

/* ===========================================
   LAYOUT BIBLIOTECA - LISTA SOTTOSEZIONI
   =========================================== */
.biblioteca-sezioni {
  display: flex !important;
  flex-direction: column !important;
  gap: 20px !important;
  margin: 30px 0 !important;
}

.biblioteca-sezione {
  display: flex !important;
  background: #fff !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  box-shadow: 0 2px 12px rgba(0,0,0,0.08) !important;
  transition: transform 0.2s, box-shadow 0.2s !important;
  border: 1px solid #eee !important;
}

.biblioteca-sezione:hover {
  transform: translateX(8px) !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.12) !important;
}

.biblioteca-sezione > img,
.biblioteca-sezione > p > img {
  width: 300px !important;
  min-width: 300px !important;
  height: 120px !important;
  object-fit: cover !important;
  border-radius: 0 !important;
  margin: 0 !important;
}

.biblioteca-sezione-info {
  padding: 20px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}

.biblioteca-sezione-info h3 {
  margin: 0 0 8px 0 !important;
  font-size: 1.2rem !important;
}

.biblioteca-sezione-info h3 a {
  color: #556b58 !important;
  text-decoration: none !important;
}

.biblioteca-sezione-info h3 a:hover {
  text-decoration: underline !important;
}

.biblioteca-sezione-info p {
  margin: 0 !important;
  color: #666 !important;
  font-size: 0.95rem !important;
  line-height: 1.5 !important;
}

@media (max-width: 500px) {
  .biblioteca-sezione {
    flex-direction: column !important;
  }
  .biblioteca-sezione > img,
  .biblioteca-sezione > p > img {
    width: 100% !important;
    height: 150px !important;
  }
}

/* ===========================================
   RIMOZIONE SIDEBAR
   =========================================== */
.sidebar {
  display: none !important;
}

.page-content,
.post-content,
main.content,
.main {
  max-width: 900px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ===========================================
   NASCONDI FIGCAPTION DI CLARITY
   =========================================== */
.traduzioni-grid figcaption,
.proposte-grid figcaption,
.biblioteca-sezioni figcaption {
  display: none !important;
}

/* ===========================================
   TRADUZIONI - FOTO CON BACKGROUND-IMAGE
   =========================================== */
.traduzione-foto {
  width: 100% !important;
  height: 180px !important;
  background-size: cover !important;
  background-position: center 20% !important;
  background-repeat: no-repeat !important;
}

/* ===========================================
   CONTENUTO A LARGHEZZA PIENA (NO SIDEBAR)
   =========================================== */
.grid-inverse,
.grid-reverse,
.wrap {
  display: block !important;
}

article.post_content,
.post_content {
  max-width: 900px !important;
  margin: 0 auto !important;
  width: 100% !important;
}

/* ===========================================
   SEZIONE LIBRI TRADOTTI
   =========================================== */
.sezione-titolo {
  margin-top: 60px !important;
  margin-bottom: 30px !important;
  font-size: 1.5rem !important;
  color: #556b58 !important;
  border-bottom: 2px solid #556b58 !important;
  padding-bottom: 10px !important;
}

.libri-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)) !important;
  gap: 30px !important;
  margin-top: 20px !important;
}

.libro-card {
  display: flex !important;
  flex-direction: column !important;
}

.libro-cover {
  width: 100% !important;
  aspect-ratio: 2/3 !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  border-radius: 4px !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
  transition: transform 0.2s, box-shadow 0.2s !important;
}

.libro-card:hover .libro-cover {
  transform: translateY(-5px) !important;
  box-shadow: 0 8px 20px rgba(0,0,0,0.2) !important;
}

.libro-no-cover {
  background-color: #e0e0e0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Libri - interlinea ridotta */
.libro-info {
  padding: 10px !important;
}

.libro-info p {
  margin: 2px 0 !important;
  line-height: 1.3 !important;
}

.libro-autore {
  font-weight: bold !important;
  color: #556b58 !important;
  font-size: 0.85rem !important;
}

.libro-titolo {
  font-size: 0.9rem !important;
  color: #333 !important;
}

.libro-editore {
  font-size: 0.8rem !important;
  color: #888 !important;
}

/* Libro card cliccabile */
a.libro-card {
  text-decoration: none !important;
  display: block !important;
  transition: transform 0.2s !important;
}

a.libro-card:hover {
  transform: translateY(-3px) !important;
}

a.libro-card:hover .libro-cover {
  box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
}

/* ===========================================
   BIBLIOTECA - FIX IMMAGINI SEZIONI
   =========================================== */
.biblioteca-sezione-img {
  width: 300px !important;
  min-width: 300px !important;
  height: 240px !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

.biblioteca-sezione-solo-testo {
  background: #f9f9f9 !important;
}

.biblioteca-sezione-solo-testo .biblioteca-sezione-info {
  padding: 25px 30px !important;
}

/* Card cliccabili */
a.biblioteca-sezione {
  text-decoration: none !important;
  color: inherit !important;
  cursor: pointer !important;
}

a.biblioteca-sezione:hover {
  transform: translateX(8px) !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.12) !important;
}

a.biblioteca-sezione h3 {
  color: #556b58 !important;
}

/* ===========================================
   BREADCRUMBS - LAYOUT CON SIDEBAR
   =========================================== */
.breadcrumbs-layout {
  display: grid !important;
  grid-template-columns: 1fr 280px !important;
  gap: 40px !important;
  max-width: 1100px !important;
  margin: 0 auto !important;
  padding: 20px !important;
}

/* Main content */
.breadcrumbs-main {
  min-width: 0 !important;
}

.breadcrumbs-main > h1 {
  color: #556b58 !important;
  margin-bottom: 10px !important;
  font-size: 2rem !important;
}

.breadcrumbs-intro {
  color: #666 !important;
  margin-bottom: 30px !important;
  padding-bottom: 20px !important;
  border-bottom: 1px solid #eee !important;
}

/* Articles list */
.articles-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 25px !important;
}

.article-item {
  display: flex !important;
  gap: 20px !important;
  padding-bottom: 25px !important;
  border-bottom: 1px solid #eee !important;
}

.article-item:last-child {
  border-bottom: none !important;
}

.article-image {
  flex-shrink: 0 !important;
  display: block !important;
  overflow: hidden !important;
  border-radius: 6px !important;
  width: 180px !important;
}

.article-image img {
  width: 100% !important;
  height: 120px !important;
  object-fit: cover !important;
  transition: transform 0.3s !important;
}

.article-image:hover img {
  transform: scale(1.05) !important;
}

.article-content {
  flex: 1 !important;
}

.article-content.no-image {
  width: 100% !important;
}

.article-content h2 {
  margin: 0 0 8px 0 !important;
  font-size: 1.2rem !important;
  line-height: 1.3 !important;
  font-weight: 600 !important;
}

.article-content h2 a {
  color: #556b58 !important;
  text-decoration: none !important;
}

.article-content h2 a:hover {
  text-decoration: underline !important;
}

.article-content time {
  color: #999 !important;
  font-size: 0.8rem !important;
  display: block !important;
  margin-bottom: 10px !important;
}

.article-content p {
  color: #555 !important;
  font-size: 0.9rem !important;
  line-height: 1.5 !important;
  margin-bottom: 10px !important;
}

.article-content .read-more {
  color: #556b58 !important;
  text-decoration: none !important;
  font-size: 0.85rem !important;
  font-weight: 500 !important;
}

.article-content .read-more:hover {
  text-decoration: underline !important;
}

.no-articles {
  color: #888 !important;
  font-style: italic !important;
}

/* Sidebar */
.breadcrumbs-sidebar {
  background: #f9f9f7 !important;
  padding: 25px !important;
  border-radius: 8px !important;
  height: fit-content !important;
  position: sticky !important;
  top: 20px !important;
}

.breadcrumbs-sidebar h3 {
  color: #556b58 !important;
  margin: 0 0 20px 0 !important;
  padding-bottom: 10px !important;
  border-bottom: 2px solid #556b58 !important;
  font-size: 1.1rem !important;
}

.notes-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 15px !important;
}

.note-item {
  padding-bottom: 15px !important;
  border-bottom: 1px solid #e0e0e0 !important;
}

.note-item:last-child {
  border-bottom: none !important;
  padding-bottom: 0 !important;
}

.note-item a {
  color: #333 !important;
  text-decoration: none !important;
  font-weight: 500 !important;
  font-size: 0.95rem !important;
  display: block !important;
  margin-bottom: 4px !important;
}

.note-item a:hover {
  color: #556b58 !important;
}

.note-item time {
  color: #999 !important;
  font-size: 0.75rem !important;
}

.no-notes {
  color: #888 !important;
  font-style: italic !important;
  font-size: 0.9rem !important;
}

/* Nascondi elementi Clarity interferenti */
.breadcrumbs-layout .post_meta,
.breadcrumbs-layout .taxonomy,
.breadcrumbs-layout .post_content > .post_item,
.breadcrumbs-main + .post_content,
.breadcrumbs-layout ~ .post_content {
  display: none !important;
}

/* Responsive */
@media (max-width: 800px) {
  .breadcrumbs-layout {
    grid-template-columns: 1fr !important;
  }
  
  .breadcrumbs-sidebar {
    position: static !important;
    order: -1 !important;
  }
  
  .article-item {
    flex-direction: column !important;
  }
  
  .article-image {
    width: 100% !important;
  }
  
  .article-image img {
    height: 180px !important;
  }
}

/* ===========================================
   HOME PAGE - STILE GIORNALE (3 COLONNE)
   =========================================== */
.home-journal {
  max-width: 1100px !important;
  margin: 0 auto !important;
  padding: 20px !important;
}

/* Layout 3 colonne */
.journal-three-col {
  display: grid !important;
  grid-template-columns: 1fr 2fr 1fr !important;
  gap: 30px !important;
}

/* Colonne laterali */
.journal-col-left,
.journal-col-right {
  display: flex !important;
  flex-direction: column !important;
  gap: 25px !important;
}

/* Card laterali */
.journal-side-card {
  padding-bottom: 20px !important;
  border-bottom: 1px solid #eee !important;
}

.journal-side-card:last-child {
  border-bottom: none !important;
}

.journal-side-card h3 {
  margin: 0 0 6px 0 !important;
  font-size: 1rem !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;
}

.journal-side-card h3 a {
  color: #556b58 !important;
  text-decoration: none !important;
}

.journal-side-card h3 a:hover {
  text-decoration: underline !important;
}

.journal-side-card time {
  color: #999 !important;
  font-size: 0.75rem !important;
  display: block !important;
  margin-bottom: 8px !important;
}

.journal-side-card p {
  color: #666 !important;
  font-size: 0.85rem !important;
  line-height: 1.4 !important;
  margin: 0 !important;
}

/* Colonna centrale - post principale */
.journal-col-center {
  border-left: 1px solid #eee !important;
  border-right: 1px solid #eee !important;
  padding: 0 30px !important;
}

.journal-main-card {
  text-align: center !important;
}

.journal-main-image {
  display: block !important;
  margin-bottom: 20px !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}

.journal-main-image img {
  width: 100% !important;
  height: 280px !important;
  object-fit: cover !important;
}

.journal-main-card h2 {
  margin: 0 0 10px 0 !important;
  font-size: 1.6rem !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;
}

.journal-main-card h2 a {
  color: #556b58 !important;
  text-decoration: none !important;
}

.journal-main-card h2 a:hover {
  text-decoration: underline !important;
}

.journal-main-card time {
  color: #888 !important;
  font-size: 0.85rem !important;
  display: block !important;
  margin-bottom: 15px !important;
}

.journal-main-card p {
  color: #555 !important;
  line-height: 1.6 !important;
  margin-bottom: 15px !important;
  text-align: left !important;
}

.journal-main-card .read-more {
  color: #556b58 !important;
  text-decoration: none !important;
  font-weight: 500 !important;
}

.journal-main-card .read-more:hover {
  text-decoration: underline !important;
}

/* Link vedi tutti */
.journal-more {
  text-align: center !important;
  padding-top: 30px !important;
  margin-top: 30px !important;
  border-top: 1px solid #eee !important;
}

.journal-more a {
  color: #556b58 !important;
  padding: 10px 20px !important;
  border: 1px solid #556b58 !important;
  border-radius: 4px !important;
  text-decoration: none !important;
  display: inline-block !important;
}

.journal-more a:hover {
  background: #556b58 !important;
  color: white !important;
}

/* Responsive */
@media (max-width: 800px) {
  .journal-three-col {
    grid-template-columns: 1fr !important;
  }
  
  .journal-col-center {
    border: none !important;
    padding: 0 !important;
    order: -1 !important;
  }
  
  .journal-col-left,
  .journal-col-right {
    flex-direction: row !important;
    flex-wrap: wrap !important;
  }
  
  .journal-side-card {
    flex: 1 1 45% !important;
  }
}

/* ===========================================
   SPAZIO SOPRA CONTENUTO HOME E BREADCRUMBS
   =========================================== */
.home-journal {
  padding-top: 40px !important;
}

.breadcrumbs-layout {
  padding-top: 40px !important;
}

/* ===========================================
   HEADER CON HERO IMAGE
   =========================================== */
/* Nascondi header originale Clarity */
.header.header {
  background: transparent !important;
  position: relative !important;
}

/* Hero banner */
.hero-banner {
  position: relative !important;
  width: 100% !important;
  height: 320px !important;
  overflow: hidden !important;
}

.hero-banner img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center 40% !important;
}

/* Posizione specifica per biblioteca */
.hero-biblioteca img {
  object-position: center 60% !important;
}

.hero-title {
  position: absolute !important;
  bottom: 25px !important;
  left: 40px !important;
  color: white !important;
  font-size: 2.2rem !important;
  font-weight: 600 !important;
  text-shadow: 0 2px 15px rgba(0,0,0,0.6) !important;
  letter-spacing: 1px !important;
}

/* Menu sotto l'immagine */
.nav-menu {
  background: #556b58 !important;
  padding: 0 !important;
}

.nav-menu ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  justify-content: center !important;
  gap: 0 !important;
}

.nav-menu li {
  margin: 0 !important;
}

.nav-menu a {
  display: block !important;
  padding: 15px 25px !important;
  color: white !important;
  text-decoration: none !important;
  font-size: 0.95rem !important;
  transition: background 0.2s !important;
}

.nav-menu a:hover,
.nav-menu a.active {
  background: rgba(255,255,255,0.15) !important;
}

/* Nascondi elementi Clarity che non servono */
.header .logo,
.header .site-name,
.header .main-menu,
.nav-toggle {
  display: none !important;
}

/* Responsive */
@media (max-width: 600px) {
  .hero-banner {
    height: 220px !important;
  }
  
  .hero-title {
    font-size: 1.6rem !important;
    left: 20px !important;
    bottom: 15px !important;
  }
  
  .nav-menu ul {
    flex-wrap: wrap !important;
  }
  
  .nav-menu a {
    padding: 12px 15px !important;
    font-size: 0.85rem !important;
  }
}

/* ===========================================
   SIDEBAR PER POST E SEZIONI
   =========================================== */
.post-with-sidebar,
.section-with-sidebar {
  display: grid !important;
  grid-template-columns: 1fr 280px !important;
  gap: 40px !important;
  max-width: 1100px !important;
  margin: 0 auto !important;
  padding: 40px 20px !important;
}

.post-content,
.section-content {
  min-width: 0 !important;
}

.post-content h1,
.section-content h1 {
  color: #556b58 !important;
  margin-bottom: 10px !important;
}

.post-content time,
.section-content time {
  color: #888 !important;
  font-size: 0.85rem !important;
  display: block !important;
  margin-bottom: 20px !important;
}

.post-content .content {
  line-height: 1.7 !important;
}

.post-content {
  overflow: hidden !important;
}

.post-content img {
  max-width: 100% !important;
  height: auto !important;
}

.post-content .content img {
  max-width: 100% !important;
  height: auto !important;
}

/* Lista post nella sezione */
.posts-list {
  margin-top: 30px !important;
}

.post-item {
  padding: 20px 0 !important;
  border-bottom: 1px solid #eee !important;
}

.post-item h2 {
  margin: 0 0 8px 0 !important;
  font-size: 1.2rem !important;
}

.post-item h2 a {
  color: #556b58 !important;
  text-decoration: none !important;
}

.post-item h2 a:hover {
  text-decoration: underline !important;
}

.post-item time {
  font-size: 0.8rem !important;
  color: #999 !important;
  display: block !important;
  margin-bottom: 8px !important;
}

.post-item p {
  color: #666 !important;
  font-size: 0.9rem !important;
  margin: 0 !important;
}

/* Sidebar comune */
.post-sidebar,
.section-sidebar {
  background: #f9f9f7 !important;
  padding: 25px !important;
  border-radius: 8px !important;
  height: fit-content !important;
  position: sticky !important;
  top: 20px !important;
}

.sidebar-section {
  margin-bottom: 25px !important;
}

.sidebar-section:last-child {
  margin-bottom: 0 !important;
}

.sidebar-section h3 {
  color: #556b58 !important;
  margin: 0 0 15px 0 !important;
  padding-bottom: 8px !important;
  border-bottom: 2px solid #556b58 !important;
  font-size: 1rem !important;
}

.sidebar-item {
  padding: 8px 0 !important;
  border-bottom: 1px solid #e8e8e8 !important;
}

.sidebar-item:last-child {
  border-bottom: none !important;
}

.sidebar-item a {
  color: #333 !important;
  text-decoration: none !important;
  font-size: 0.9rem !important;
}

.sidebar-item a:hover {
  color: #556b58 !important;
}

/* Menu sezioni biblioteca */
.sidebar-menu {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

.sidebar-menu a {
  color: #556b58 !important;
  text-decoration: none !important;
  font-size: 0.9rem !important;
  padding: 6px 0 !important;
}

.sidebar-menu a:hover {
  text-decoration: underline !important;
}

/* Responsive */
@media (max-width: 800px) {
  .post-with-sidebar,
  .section-with-sidebar {
    grid-template-columns: 1fr !important;
  }
  
  .post-sidebar,
  .section-sidebar {
    position: static !important;
  }
}

/* Post item con immagine */
.post-item {
  display: flex !important;
  gap: 20px !important;
}

.post-item-image {
  flex-shrink: 0 !important;
  width: 120px !important;
}

.post-item-image img {
  width: 100% !important;
  height: 80px !important;
  object-fit: cover !important;
  border-radius: 4px !important;
}

.post-item-content {
  flex: 1 !important;
}

@media (max-width: 500px) {
  .post-item {
    flex-direction: column !important;
  }
  .post-item-image {
    width: 100% !important;
  }
  .post-item-image img {
    height: 150px !important;
  }
}

/* Fix immagini larghe in post */
.post-with-sidebar .post-content {
  overflow: hidden !important;
  width: 100% !important;
}

.post-with-sidebar .post-content img,
.post-with-sidebar .post-content .content img {
  max-width: 100% !important;
  width: auto !important;
  height: auto !important;
}

/* ===========================================
   IMMAGINI NELLE LISTE - HOME E BREADCRUMBS
   =========================================== */

/* Home - immagini nelle card laterali */
.journal-side-image {
  display: block !important;
  margin-bottom: 10px !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

.journal-side-image img {
  width: 100% !important;
  height: 100px !important;
  object-fit: cover !important;
}

/* Home - immagine nel post principale */
.journal-main-image {
  display: block !important;
  margin-bottom: 20px !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}

.journal-main-image img {
  width: 100% !important;
  height: 280px !important;
  object-fit: cover !important;
}

/* Breadcrumbs - immagini articoli */
.article-item {
  display: flex !important;
  gap: 20px !important;
}

.article-image {
  flex-shrink: 0 !important;
  display: block !important;
  overflow: hidden !important;
  border-radius: 6px !important;
  width: 180px !important;
}

.article-image img {
  width: 100% !important;
  height: 120px !important;
  object-fit: cover !important;
  transition: transform 0.3s !important;
}

.article-image:hover img {
  transform: scale(1.05) !important;
}

.article-content {
  flex: 1 !important;
}

.article-content.no-image {
  width: 100% !important;
}

/* Responsive */
@media (max-width: 800px) {
  .article-item {
    flex-direction: column !important;
  }
  
  .article-image {
    width: 100% !important;
  }
  
  .article-image img {
    height: 180px !important;
  }
  
  .journal-side-image img {
    height: 120px !important;
  }
}
