/* The Modal (background overlay) */
.modal {
  font-family: Roboto Condensed, Arial, sans-serif;
  display: none; /* open үед display: flex болгодог байх */
  position: fixed;
  z-index: 1000;

  /* top: 100px;  <-- Үүнийг ав */
  inset: 0;

  background-color: rgba(0, 0, 0, 0.6);

  display: flex;
  justify-content: center;

  /* жижиг дэлгэц дээр төвөөс биш дээрээс эхлүүлж байрлуулах нь тасрахыг болиулна */
  align-items: flex-start;

  padding: 24px;
  overflow: auto;
}

.modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
}

/* Modal Content (the centered box) */
.modal-body {
    background-color: #000;
    width: 100%;
    max-width: 600px;
    padding: 20px;
  border: 1px solid #888;
  border-radius: 12px;

  /* viewport-оос өндөр бол дотроо scroll */
  max-height: calc(100vh - 48px); /* 48px = дээр/доорх padding (24*2) */
  overflow-y: auto;

  /* align-items:flex-start болсон тул бага зэрэг зай */
  margin-top: 24px;
}

/* Close button */
.close {
    color: #aaaaaa;
    font-size: 28px;
    font-weight: bold;
    padding: 10px;
}

.close:hover,
.close:focus {
    color: gray;
    text-decoration: none;
    cursor: pointer;
}