/* === UTILITY VISIBILITÀ === */
.meteomag-widget-mobile .desktop-only {
  display: none;
}

/* === STILE MOBILE - CONTAINER PRINCIPALE === */
.meteomag-widget-mobile {
  font-family: 'Inter', sans-serif;
  width: 100%;
  margin: 0 auto;
  padding: 0;
  text-align: center;
  background: transparent;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
}

/* === INTESTAZIONE SEZIONE (MOBILE) — coerente con desktop, una riga === */
.meteomag-widget-mobile .meteo-titolo-sezione.meteo-header-mobile{
  background-color:#205790;
  color:#ffffff;
  padding:12px 14px;
  font-size:16px;              /* coerenza con desktop, leggermente ridotto sopra i 360px */
  font-weight:bold;
  border-top-left-radius:12px;
  border-top-right-radius:12px;

  /* chiave per non andare a capo e non rompere il layout */
  display:flex;
  align-items:center;
  gap:.5rem;
  white-space:nowrap;
  overflow:hidden;
  line-height:1.2;
  width:100%;
  box-sizing:border-box;
  text-align:left;
  position:relative;
}

/* Titolo: occupa lo spazio e tronca con ellissi se necessario */
.meteomag-widget-mobile .meteo-header-mobile .meteo-title{
  margin:0;
  display:inline-block;
  flex:1 1 auto;
  min-width:0;                 /* necessario per ellissi in flex */
  overflow:hidden;
  text-overflow:ellipsis;
}

/* Data: resta intera, mai a capo */
.meteomag-widget-mobile .meteo-header-mobile .meteo-aggiornate{
  margin:0;
  display:inline-block;
  flex:0 0 auto;
  white-space:nowrap;
  font-size:13px;
  opacity:.95;
}

/* Sottolineatura decorativa come su desktop */
.meteomag-widget-mobile .meteo-titolo-sezione.meteo-header-mobile::after{
  content:"";
  position:absolute;
  left:14px; right:14px;
  bottom:6px;
  height:1px;
  background-color:#c5c5c5;
  opacity:.7;
}

/* Micro-tuning su schermi molto piccoli */
@media (max-width: 360px){
  .meteomag-widget-mobile .meteo-titolo-sezione.meteo-header-mobile{ padding:10px 12px; }
  .meteomag-widget-mobile .meteo-header-mobile .meteo-title{ font-size:14px; }
  .meteomag-widget-mobile .meteo-header-mobile .meteo-aggiornate{ font-size:12px; }
}

/* Se il mobile è dentro tabelle/box stretti, protegge dall'overflow duro */
.meteomag-widget-mobile .meteo-header-mobile time{ white-space:nowrap; }

/* === METEO CORRENTE MOBILE === */
.meteomag-widget-mobile .meteo-current-box {
  display: flex;
  flex-direction: column;
  gap: 10px;
  background-color: #205790;
  color: #ffffff;
  padding: 12px;
  width: 100%;
  box-sizing: border-box;
}

/* RIGA 1: METEO LIVE + ICONA */
.meteomag-widget-mobile .meteo-current-box .riga-live {
  display: flex;
  justify-content: flex-start;
  align-items: stretch;
  margin: 0;
  padding: 0;
}

.meteomag-widget-mobile .meteo-current-box .riga-live .col.titolo {
  flex: 1 1 50%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 6px;
  padding: 0;
  text-align: center;
}

.meteomag-widget-mobile .meteo-current-box .riga-live .col.titolo .titolo-riga {
  font-size: 17px;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  white-space: nowrap;
}

.meteomag-widget-mobile .meteo-current-box .riga-live .col.titolo .condizione {
  font-size: 15px;
  white-space: normal;
  word-break: break-word;
  text-align: center;
}

.meteomag-widget-mobile .meteo-current-box .riga-live .col.icona {
  flex: 1 1 50%;
  min-width: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0;
}

.meteomag-widget-mobile .meteo-current-box .riga-live .col.icona img {
  width: 60px;
  height: 60px;
  object-fit: contain;
  display: block;
}

/* LED ANIMATO */
.meteomag-widget-mobile .meteo-current-box .live-dot {
  width: 10px;
  height: 10px;
  background-color: #00ff00;
  border-radius: 50%;
  animation: blink 1s infinite;
}

@keyframes blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.3; }
}

/* RIGA 2: TEMPERATURA + PERCEPITA */
.meteomag-widget-mobile .meteo-current-box .riga-temp {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  flex-wrap: wrap;
}

.meteomag-widget-mobile .meteo-current-box .riga-temp .col.temperatura,
.meteomag-widget-mobile .meteo-current-box .riga-temp .col.percepita {
  flex: 1;
  min-width: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  white-space: nowrap;
  padding: 4px 0;
}

.meteomag-widget-mobile .meteo-current-box .riga-temp .col.temperatura {
  font-weight: bold;
}

.meteomag-widget-mobile .meteo-current-box .riga-temp .col.percepita {
  font-weight: normal;
}

/* RIGA 3: INDICE UV + QUALITÀ ARIA (MOBILE) */
.meteomag-widget-mobile .meteo-current-box .riga-uv-aria {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  flex-wrap: wrap;
}

.meteomag-widget-mobile .meteo-current-box .riga-uv-aria .col.uv,
.meteomag-widget-mobile .meteo-current-box .riga-uv-aria .col.qualita-aria {
  flex: 1;
  min-width: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-size: 13px;
  white-space: nowrap;
  padding: 4px 0;
  gap: 6px;
  color: #fff;
}

.meteomag-widget-mobile .meteo-current-box .riga-uv-aria .col.uv img.icona-uv,
.meteomag-widget-mobile .meteo-current-box .riga-uv-aria .col.qualita-aria img.icona-aria {
  width: 22px;
  height: 22px;
  object-fit: contain;
}

/* RIGA 4: NUVOLOSITÀ + PRECIPITAZIONI */
.meteomag-widget-mobile .meteo-current-box .riga-nuvole {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  flex-wrap: wrap;
}

.meteomag-widget-mobile .meteo-current-box .riga-nuvole .col.nuvolosita,
.meteomag-widget-mobile .meteo-current-box .riga-nuvole .col.precipitazioni {
  flex: 1;
  min-width: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-size: 13px;
  white-space: nowrap;
  padding: 4px 0;
}

/* RIGA 5: VENTO + UMIDITÀ */
.meteomag-widget-mobile .meteo-current-box .riga-vento-umidita {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  flex-wrap: wrap;
}

.meteomag-widget-mobile .meteo-current-box .riga-vento-umidita .col.vento,
.meteomag-widget-mobile .meteo-current-box .riga-vento-umidita .col.umidita {
  flex: 1;
  min-width: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-size: 13px;
  white-space: nowrap;
  padding: 4px 0;
}

/* RIGA 6: VISIBILITÀ + PRESSIONE */
.meteomag-widget-mobile .meteo-current-box .riga-visibilita-pressione {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  flex-wrap: wrap;
}

.meteomag-widget-mobile .meteo-current-box .riga-visibilita-pressione .col.visibilita,
.meteomag-widget-mobile .meteo-current-box .riga-visibilita-pressione .col.pressione {
  flex: 1;
  min-width: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-size: 13px;
  white-space: nowrap;
  padding: 4px 0;
}

/* === BOX GIORNALIERE MOBILE === */
.meteomag-widget-mobile .meteo-daily-box {
  margin: 0;
  display: flex;
  flex-direction: column;
  border-radius: 0 0 10px 10px;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(0,0,0,0.05);
  background-color: #205790;
  color: #ffffff;
}

/* === TITOLI GIORNALIERE MOBILE === */
.meteomag-widget-mobile .meteo-daily-box .daily-row.intestazione {
  background: #18497a;
  font-weight: bold;
  cursor: default;
  border-top: 1px solid #c5c5c5;
  padding: 8px 10px;
  font-size: 10px;
  box-sizing: border-box;
  color: #fff;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}

.meteomag-widget-mobile .meteo-daily-box .daily-row.intestazione .col {
  font-size: 10px
  text-align: center;
  font-weight: bold;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
  padding: 0 2px;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1.1;
}

/* Larghezze colonne titoli mobile */
.meteomag-widget-mobile .meteo-daily-box .daily-row.intestazione .data       { flex: 0 0 50px; }
.meteomag-widget-mobile .meteo-daily-box .daily-row.intestazione .icona      { flex: 0 0 40px; }
.meteomag-widget-mobile .meteo-daily-box .daily-row.intestazione .condizione { flex: 0 0 100px; }
.meteomag-widget-mobile .meteo-daily-box .daily-row.intestazione .prec       { flex: 0 0 50px; }
.meteomag-widget-mobile .meteo-daily-box .daily-row.intestazione .temp       { flex: 0 0 65px; }
.meteomag-widget-mobile .meteo-daily-box .daily-row.intestazione .vento      { flex: 0 0 40px; }


/* === PREVISIONI GIORNALIERE – RIGHE DATI === */
.meteomag-widget-mobile .meteo-daily-box .daily-row {
  border-bottom: 1px solid #c5c5c5;
  display: flex;
  width: 100%;
  min-height: 70px; /* O il valore che preferisci */
  align-items: center; /* Centrare verticalmente il contenuto */
}

.meteomag-widget-mobile .meteo-daily-box .daily-row .col {
  display: flex;
  align-items: center;
  box-sizing: border-box;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #ffffff;
  min-width: 0;
}

/* DATA */
.meteomag-widget-mobile .meteo-daily-box .daily-row .col.data {
  flex: 1 1 60px;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding-left: 7px;
  text-align: left;
}

/* ICONA */
.meteomag-widget-mobile .meteo-daily-box .daily-row .col.icona {
  flex: 0 0 50px;
  justify-content: center;
}

.meteomag-widget-mobile .meteo-daily-box .daily-row .col.icona img {
  width: 40px;
  height: 40px;
  object-fit: contain;
  display: block;
}

/* CONDIZIONE */
.meteomag-widget-mobile .meteo-daily-box .daily-row .col.condizione {
  flex: 2 1 90px;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  line-height: 1.2;
  white-space: normal;
  text-align: left;
}

.meteomag-widget-mobile .meteo-daily-box .daily-row .col.condizione .riga-1 {
  font-weight: normal;
  font-size: 14px;
  color: #ffffff;
}

.meteomag-widget-mobile .meteo-daily-box .daily-row .col.condizione .riga-2 {
  font-size: 14px;
  color: #eee;
}

/* PRECIPITAZIONI */
.meteomag-widget-mobile .meteo-daily-box .daily-row .col.prec {
  flex: 0 1 40px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-size: 16px;
  color: #ffffff;
  line-height: 1.1;
  white-space: nowrap;
  gap: 3px; /* ← spazio tra i due valori */
}

.meteomag-widget-mobile .meteo-daily-box .daily-row .col.prec .riga-1 {
  font-weight: bold;
}

.meteomag-widget-mobile .meteo-daily-box .daily-row .col.prec .riga-2 {
  font-size: 14px;
  opacity: 0.9;
}

/* TEMPERATURA */
.meteomag-widget-mobile .meteo-daily-box .daily-row .col.temp {
  flex: 0 1 60px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  color: #ffffff;
  line-height: 1.1;
  white-space: nowrap;
  gap: 6px; /* ← spazio tra i due valori */
}

.meteomag-widget-mobile .meteo-daily-box .daily-row .col.temp .riga-1,
.meteomag-widget-mobile .meteo-daily-box .daily-row .col.temp .riga-2 {
  display: block;
}

/* VENTO */
.meteomag-widget-mobile .meteo-daily-box .daily-row .col.vento {
  flex: 0 1 40px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding-right: 7px;
  text-align: center;
  font-size: 16px;
  color: #ffffff;
  line-height: 1.1;
  white-space: nowrap;
  gap: 6px; /* spazio tra velocità e direzione */
}

/* Riga 1: velocità (es. 23) */
.meteomag-widget-mobile .meteo-daily-box .daily-row .col.vento .riga-1 {
  font-weight: bold;
}

/* Riga 2: direzione (es. NO) */
.meteomag-widget-mobile .meteo-daily-box .daily-row .col.vento .riga-2 {
  font-size: 16px;
  opacity: 0.9;
}

/* === BOX ORARIE MOBILE === */
.meteomag-widget-mobile .meteo-hourly-box {
  margin: 0;
  display: flex;
  flex-direction: column;
  border-radius: 0 0 10px 10px;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(0,0,0,0.05);
  background-color: #205790;
  color: #ffffff;
  box-sizing: border-box;
  position: relative;
}

/* === INTESTAZIONE ORARIE === */
.meteomag-widget-mobile .meteo-hourly-box .daily-row.intestazione {
  font-size: 10px;
  text-align: center;
  padding: 6px 0;
  border-top: 1px solid #c5c5c5;
  border-bottom: 1px solid #c5c5c5;
  color: #ffffff;
  background-color: #18497a;
}

.meteomag-widget-mobile .meteo-hourly-box .daily-row.intestazione .col {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  line-height: 1.2;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* === RIGHE DATI ORARIE === */
.meteomag-widget-mobile .meteo-hourly-box .daily-row {
  border-bottom: 1px solid #c5c5c5;
  display: flex;
  width: 100%;
  min-height: 70px;
  align-items: center;
}

/* === COLONNE === */
.meteomag-widget-mobile .meteo-hourly-box .daily-row .col {
  display: flex;
  align-items: center;
  box-sizing: border-box;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #ffffff;
  min-width: 0;
}

/* ORA */
.meteomag-widget-mobile .meteo-hourly-box .daily-row .col.data {
  flex: 1 1 60px;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding-left: 7px;
  text-align: left;
}

/* ICONA */
.meteomag-widget-mobile .meteo-hourly-box .daily-row .col.icona {
  flex: 0 0 50px;
  justify-content: center;
}

.meteomag-widget-mobile .meteo-hourly-box .daily-row .col.icona img {
  width: 40px;
  height: 40px;
  object-fit: contain;
  display: block;
}

/* CONDIZIONE */
.meteomag-widget-mobile .meteo-hourly-box .daily-row .col.condizione {
  flex: 2 1 90px;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  line-height: 1.2;
  white-space: normal;
  text-align: left;
}

.meteomag-widget-mobile .meteo-hourly-box .daily-row .col.condizione .riga-1 {
  font-weight: normal;
  font-size: 14px;
  color: #ffffff;
}

.meteomag-widget-mobile .meteo-hourly-box .daily-row .col.condizione .riga-2 {
  font-size: 14px;
  color: #eee;
}

/* PRECIPITAZIONI */
.meteomag-widget-mobile .meteo-hourly-box .daily-row .col.prec {
  flex: 0 1 40px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-size: 16px;
  color: #ffffff;
  line-height: 1.1;
  white-space: nowrap;
  gap: 3px;
}

.meteomag-widget-mobile .meteo-hourly-box .daily-row .col.prec .riga-1 {
  font-weight: bold;
}

.meteomag-widget-mobile .meteo-hourly-box .daily-row .col.prec .riga-2 {
  font-size: 14px;
  opacity: 0.9;
}

/* TEMPERATURA */
.meteomag-widget-mobile .meteo-hourly-box .daily-row .col.temp {
  flex: 0 1 60px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  color: #ffffff;
  line-height: 1.1;
  white-space: nowrap;
  gap: 6px;
}

.meteomag-widget-mobile .meteo-hourly-box .daily-row .col.temp .riga-1,
.meteomag-widget-mobile .meteo-hourly-box .daily-row .col.temp .riga-2 {
  display: block;
}

/* VENTO */
.meteomag-widget-mobile .meteo-hourly-box .daily-row .col.vento {
  flex: 0 1 40px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding-right: 7px;
  text-align: center;
  font-size: 16px;
  color: #ffffff;
  line-height: 1.1;
  white-space: nowrap;
  gap: 6px;
}

.meteomag-widget-mobile .meteo-hourly-box .daily-row .col.vento .riga-1 {
  font-weight: bold;
}

.meteomag-widget-mobile .meteo-hourly-box .daily-row .col.vento .riga-2 {
  font-size: 16px;
  opacity: 0.9;
}

/* === CONTENITORE PULSANTE TORNA === */
.meteomag-widget-mobile .meteo-hourly-box .meteo-torna-box {
  background-color: #205790;
  padding: 10px 12px;
  text-align: left;
  border-top: 1px solid #c5c5c5;
  box-sizing: border-box;
}

/* === PULSANTE "TORNA ALLE PREVISIONI GIORNALIERE" === */
.meteomag-widget-mobile .meteo-hourly-box .torna-giornaliera {
  font-size: 14px;
  padding: 6px 10px;
  margin: 0;
  background: #ffffff;
  color: #2a2a2a;
  border: none;
  border-radius: 6px;
  font-weight: bold;
  cursor: pointer;
  transition: background 0.3s ease;
  width: auto;
  display: inline-block;
}

.meteomag-widget-mobile .meteo-hourly-box .torna-giornaliera:hover {
  background: #f0f0f0;
}

/* === CREDITI METEOBLUE MOBILE – FISSO IN BASSO === */
.meteomag-widget-mobile .meteo-crediti-box {
  border-top: 0.5px solid #c5c5c5;
  padding: 6px 8px;
  background: #205790;
  border-radius: 0 0 10px 10px;
  box-sizing: border-box;
}

.meteomag-widget-mobile .meteo-crediti-box .crediti-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  flex-wrap: wrap;
  text-align: center;
  min-width: 0;
}

.meteomag-widget-mobile .meteo-crediti-box .crediti-testo {
  font-size: 12px;
  color: #ffffff;
  line-height: 1.2;
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  /* white-space: nowrap; */ /* Commentata per permettere il testo a capo su mobile */
  word-break: break-word;
}

/* Colore e stile del link testuale dei crediti */
.meteomag-widget-mobile .meteo-crediti-box .crediti-testo a {
  color: #fff !important;
  text-decoration: underline;
}

.meteomag-widget-mobile .meteo-crediti-box .crediti-testo a:hover {
  color: #bee2ff !important;
}

.meteomag-widget-mobile .meteo-crediti-box .logo-meteoblue {
  width: 80px;
  height: auto;
  margin: 0;
  flex-shrink: 0;
}

/* === DARK MODE MOBILE === */

body.jnews-dark-mode .meteomag-widget-mobile .meteo-daily-box .daily-row {
  background-color: #1a1a1a;
  border-bottom: 1px solid #333;
}

body.jnews-dark-mode .meteomag-widget-mobile .meteo-daily-box .daily-row .col {
  color: #ddd;
}

body.jnews-dark-mode .meteomag-widget-mobile .meteo-daily-box .daily-row .col.prec {
  color: #00bfff;
}

body.jnews-dark-mode .meteomag-widget-mobile .meteo-daily-box .daily-row .col.condizione .riga-2 {
  color: #aaa;
}

body.jnews-dark-mode .meteomag-widget-mobile .meteo-hourly-box .meteo-torna-box {
  background-color: #1a1a1a;
  border-top: 1px solid #333;
}

body.jnews-dark-mode .meteomag-widget-mobile .meteo-daily-box .daily-row.crediti-row {
  background-color: #1c1c1c;
  border-top: 1px solid #444;
}

body.jnews-dark-mode .meteomag-widget-mobile .meteo-daily-box .daily-row.crediti-row .crediti-testo {
  color: #ccc;
}

/* === ALERT MANCANZA DATI (CHIARO) === */
.meteomag-widget-mobile .alert-previsioni {
  background-color: #fff3cd;
  color: #856404;
  border: 1px solid #ffeeba;
  padding: 12px;
  border-radius: 8px;
  font-size: 16px;
  text-align: center;
  margin-top: 20px;
  margin-bottom: 20px;
  max-width: 100%;
}

/* === ALERT MANCANZA DATI (SCURO) === */
body.jnews-dark-mode .meteomag-widget-mobile .alert-previsioni {
  background-color: #332f00;
  color: #f5e17b;
  border-color: #8f7f00;
}