/* === Bas-stil för bannern – padding styrs via inline CSS från inställningarna === */

#mk-top-banner {
  width: 100%;
  box-sizing: border-box;
  text-align: center;
  max-height: 80px;
  overflow: hidden;
  opacity: 1;
  position: relative;
  transition: max-height 0.4s ease, opacity 0.4s ease, padding 0.4s ease;
}

#mk-top-banner.is-closed {
  max-height: 0;
  opacity: 0;
  padding-top: 0;
  padding-bottom: 0;
}

.mk-top-banner-inner {
  display: block;
  text-align: center;
  overflow: hidden;
}

/* Budskap – desktop-växling */

.mk-top-banner-text {
  display: none;
  white-space: nowrap;
  text-decoration: none;
}

.mk-top-banner-text.is-active {
  display: inline-block;
}

/* Se till att länkar följer bannerfärgen */
#mk-top-banner a,
#mk-top-banner .mk-mobile-marquee-item {
  color: inherit !important;
}

/* Stäng-knappen (kryss) */

#mk-top-banner-close {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  background-color: inherit;
  border: none;
  color: inherit;
  font-size: 22px;
  line-height: 1;
  font-family: inherit;
  font-weight: inherit;
  cursor: pointer;
  padding: 2px 6px;
  z-index: 999999;
}

#mk-top-banner-close:hover {
  opacity: 0.7;
}

/* === Marquee-animation för mobil === */

@keyframes mk-top-banner-marquee {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); } /* vi har duplicerat innehållet -> -50% ger sömlös loop */
}

@media (max-width: 768px) {

  #mk-top-banner {
    max-height: 90px;
  }

  #mk-top-banner-close {
    right: 8px;
  }

  /* Spår för mobil-loop (alla budskap i rad, klickbara) */
  .mk-mobile-marquee-track {
    display: inline-flex;
    white-space: nowrap;
    animation-name: mk-top-banner-marquee;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
  }

  .mk-mobile-marquee-item {
    display: inline-block;
    white-space: nowrap;
    text-decoration: none;
  }

  /* Dölj desktop-länkarna på mobil (vi bygger egna i JS) */
  .mk-top-banner-text {
    display: none !important;
  }
}