/* Text logo overrides — widget CSS matches meteo.ua; only logo rules differ from SVG. */

.meteo-informer__head,
.meteo-informer__head .meteo-informer__cell-info,
.meteo-informer__head .meteo-informer__info,
.meteo-informer__head .js-meteo-informer-tagline {
  font-family: Arial, Helvetica, sans-serif !important;
}

/* v5: <a class="meteo-informer__logo"> replaces inline SVG */
.meteo-informer a.meteo-informer__logo {
  display: inline-block;
  width: auto;
  height: auto;
  max-width: 60px;
  line-height: 0;
  text-decoration: none;
  vertical-align: middle;
}

.meteo-informer a.meteo-informer__logo:hover {
  text-decoration: none;
}

.meteo-informer span.meteo-informer__logo-mark {
  display: inline-block;
  position: relative;
  vertical-align: middle;
  white-space: nowrap;
  text-decoration: none;
  overflow: visible;
}

.meteo-informer__cell-logo > span.meteo-informer__logo-mark,
a.meteo-informer__cell-logo > span.meteo-informer__logo-mark,
a.meteo-informer__logo > span.meteo-informer__logo-mark {
  display: inline-block;
  vertical-align: middle;
}

/* v1 compact — meteo.ua SVG 20×11 */
.meteo-informer span.meteo-informer__logo-mark--compact {
  max-width: 20px;
  height: 11px;
  line-height: 11px;
}

.meteo-informer span.meteo-informer__logo-mark--compact .meteo-informer__logo-word {
  font-size: 12px;
  letter-spacing: -0.02em;
}

/* v2–v4 wide in header — SVG 48×10 (v2) / 60×13 (v3–v4); cell width constrains */
a.meteo-informer__cell-logo > span.meteo-informer__logo-mark--wide,
.meteo-informer__cell-logo > span.meteo-informer__logo-mark--wide {
  max-width: 100%;
  height: 13px;
  line-height: 13px;
}

/* v5 wide — meteo.ua SVG 60×13 */
a.meteo-informer__logo > span.meteo-informer__logo-mark--wide {
  max-width: 60px;
  height: 13px;
  line-height: 13px;
}

.meteo-informer span.meteo-informer__logo-word {
  display: inline;
  font-weight: 700;
  font-style: normal;
  line-height: 1;
  vertical-align: middle;
  font-family: Arial, Helvetica, sans-serif !important;
}

.meteo-informer span.meteo-informer__logo-mark--wide .meteo-informer__logo-word {
  font-size: 11px;
  letter-spacing: -0.01em;
}

.meteo-informer span.meteo-informer__logo-mark--dark .meteo-informer__logo-word {
  color: #2B2B2B;
}

.meteo-informer span.meteo-informer__logo-mark--light .meteo-informer__logo-word {
  color: #FFFFFF;
}

.meteo-informer span.meteo-informer__logo-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 0;
  left: 100%;
  margin-left: 1px;
  width: 11px;
  height: 11px;
  padding: 0;
  border-radius: 50%;
  background-color: #009639;
  color: #FFFFFF;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 6.5px;
  font-weight: 700;
  font-style: normal;
  line-height: 1;
  letter-spacing: -0.04em;
  transform: translateY(-35%);
  box-sizing: border-box;
}

.meteo-informer span.meteo-informer__logo-mark--wide .meteo-informer__logo-badge {
  width: 12px;
  height: 12px;
  font-size: 7px;
  transform: translateY(-40%);
}

.meteo-informer a:hover .meteo-informer__logo-mark,
.meteo-informer__logo-mark:hover {
  text-decoration: none;
}
