/* ==========================================================
   Block — Ultimi articoli
   ========================================================== */

.mv-latest-articles-widget {
   display: grid;

   width: 100%;
   max-width: none;

   box-sizing: border-box;

   gap: 8px;
}

/* ==========================================================
   Header
   ========================================================== */

.mv-latest-articles-header {
   padding-bottom: 8px;

   border-bottom: 1px solid var(--mv-border);
}

.mv-latest-articles-header h3 {
   margin: 0;

   color: var(--mv-text);

   font-size: 14px;
   font-weight: 800;
   line-height: 1.3;
   letter-spacing: -.015em;
}

/* ==========================================================
   Lista
   ========================================================== */

.mv-latest-articles-list {
   display: grid;

   gap: 0;

   margin: 0;
   padding: 0;

   list-style: none;
}

.mv-latest-articles-list li {
   min-width: 0;
}

.mv-latest-articles-list li + li {
   border-top: 1px solid var(--mv-border);
}

/* ==========================================================
   Articolo
   ========================================================== */

.mv-latest-articles-item {
   display: grid;
   grid-template-columns: 36px minmax(0, 1fr) auto;
   align-items: center;

   gap: 9px;

   padding: 8px 0;

   border: 0;
   border-radius: 0;

   color: var(--mv-text);

   text-decoration: none;

   transition:
      background-color .15s ease,
      color .15s ease;
}

.mv-latest-articles-item:hover {
   background: #fffaf7;
   color: var(--mv-primary);
}

/* ==========================================================
   Thumbnail
   ========================================================== */

.mv-latest-articles-thumb {
   display: grid;
   place-items: center;

   width: 36px;
   height: 36px;

   overflow: hidden;

   border: 1px solid var(--mv-border);
   border-radius: 0;

   background: #fffaf7;

   flex-shrink: 0;
}

.mv-latest-articles-thumb img {
   display: block;

   width: 100%;
   height: 100%;

   object-fit: cover;

   border-radius: 0;
}

.mv-latest-articles-icon {
   display: grid;
   place-items: center;

   width: 100%;
   height: 100%;

   color: var(--mv-primary);

   font-size: 14px;
}

/* ==========================================================
   Testo
   ========================================================== */

.mv-latest-articles-body {
   display: grid;

   min-width: 0;

   gap: 3px;
}

.mv-latest-articles-title {
   display: -webkit-box;

   overflow: hidden;

   color: inherit;

   font-size: 12px;
   font-weight: 700;
   line-height: 1.32;

   word-break: break-word;

   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2;
}

.mv-latest-articles-date {
   color: var(--mv-muted);

   font-size: 9px;
   font-weight: 600;
   line-height: 1.25;
}

/* ==========================================================
   Freccia
   ========================================================== */

.mv-latest-articles-item > i:last-child {
   justify-self: end;

   color: var(--mv-muted);

   font-size: 7px;

   opacity: .35;

   transition:
      color .15s ease,
      opacity .15s ease,
      transform .15s ease;
}

.mv-latest-articles-item:hover > i:last-child {
   color: var(--mv-primary);

   opacity: 1;

   transform: translateX(2px);
}

/* ==========================================================
   Accento Social
   ========================================================== */

.mv-latest-articles-widget::before {
   content: "";

   display: block;

   width: 34px;
   height: 2px;

   margin-bottom: 1px;

   background: var(--mv-primary);
}

/* ==========================================================
   Stato vuoto
   ========================================================== */

.mv-latest-articles-empty {
   margin: 0;
   padding: 12px;

   border: 1px dashed var(--mv-border);
   border-radius: 0;

   background: #fffaf7;
   color: var(--mv-muted);

   font-size: 12px;
   line-height: 1.5;
   text-align: center;
}