/* pannello: posizione e aggancio NON si toccano */
.disclaimer-panel {
  display: flex;
  flex-direction: column;
  height: 100%;           /* o quello che già usi */
}

/* area contenuto */
.disclaimer-panel .inner {
  flex: 1 1 auto;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch; /* iOS fluido */
  padding: 16px 20px 18px;
}

.metar-info-panel {
  display: flex;
  flex-direction: column;
  max-height: 72vh;      /* già ce l’hai, va bene */
  overflow: hidden;     /* il pannello NON scrolla */
}

/* 👇 SOLO IL CORPO SCROLLA */
.metar-body {
  flex: 1 1 auto;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding-right: 2px;   /* evita testo sotto scrollbar */
}


.disclaimer-panel .inner {
  position: relative; /* necessario per la X */
}

.disclaimer-close-btn {
  position: absolute;
  top: 6px;
  right: 8px;
  background: transparent;
  border: 0;
  color: var(--muted);
  font-size: 22px;
  opacity: 0.8;
  cursor: pointer;
  z-index: 5;
}

.disclaimer-close-btn:hover {
  color: #fff;
}


/* smartphone edge */
@media (max-width: 480px) {
  .disclaimer-panel .inner {
    padding-left: 22px;
    padding-right: 22px;
  }
}
@media (max-height: 700px) {
  .metar-info-panel {
    max-height: 66vh;
  }
}