.is-hidden {
    z-index: -100 !important;
}

/* drag/drop file upload.
   The button in index.php uses Bulma's theme-adaptive .is-soft modifier,
   so Bulma itself supplies the adaptive colors, including hover and the
   is-success/is-danger states toggled by gui.js (colorDropArea). Only the
   drop-target geometry is styled here; var(--bulma-border) keeps the
   dotted frame theme-adaptive as well. */

#drop-area {
    border: 4px dotted var(--bulma-border, #d6d9e0);
    border-radius: 1rem;
    padding: 0 25px;
}

#drop-area.highlight {
    border-color: var(--bulma-link-on-scheme, #2942ff);
}

/* Bulma has no theme-adaptive "soft" modifier for notifications (only the
   literal light/dark colors, which stay pale in dark mode), so this one
   box needs a small scheme-adaptive override using Bulma variables.
   #message_2 in index.php uses a plain .notification instead, which is
   theme-adaptive without any CSS help. The var() fallback is the static
   color Bulma 1.0.4 resolves to in light mode; it keeps the box readable
   if a future Bulma renames or drops the variable. */
#message_1.notification.is-light.is-warning {
    background-color: var(--bulma-warning-soft, #fff0cc);
    color: var(--bulma-warning-soft-invert, #664700);
}

/* special image format with optional label (see regiForm image)  */
.imgDiv {
    width: 100%;
    text-align: center;
}

.imgDiv span,
.imgDiv img
{
    display: inline-block;
    vertical-align: middle;
}

.rgHeader {
  width: 100%;
  text-align: center;
  color: #888888;
  font-size: 130%;
  margin: 1rem 0 2rem 0;
  border-top: 1px solid #888888;
  border-bottom: 1px solid #888888;
}

/* verification result page (verify.php) */

/* plain key/value tables without Bulma's row lines and background */
.rgResultTable {
  background-color: transparent;
}

.rgResultTable td {
  background-color: transparent;
  border: none;
  padding: 0.25rem 0.5rem;
  vertical-align: top;
}

.rgResultTable td:first-child {
  white-space: nowrap;
}

/* hashcode blocks without Bulma's <pre> background */
.rgHashcode {
  background-color: transparent;
  padding: 0;
}

/* validation result shield image (shield_good.png / shield_bad.png),
   floating at original size over the upper right corner of the table */
.rgResultBox {
  position: relative;
}

.rgShield {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  z-index: 1;
}

/* print styles: the verification report must fit on a single page.
   If the page has to fragment, browsers push the whole report box
   (absolutely positioned shield, flex level, box-shadow) to the next
   page and the Bulma footer (3rem/6rem padding) onto a third one. */
@media print {
  /* compact vertical spacing */
  #MainBody {
    margin: 0 auto;
  }

  .imgDiv img {
    width: 4rem;
  }

  .imgDiv span {
    font-size: 2rem;
  }

  .rgHeader {
    margin: 0.25rem 0 0.5rem 0;
  }

  .box {
    padding: 0.75rem;
    box-shadow: none; /* box shadows paint wrong when sliced across pages */
  }

  #MainBody .mb-4 {
    margin-bottom: 0.5rem !important;
  }

  #MainBody .mt-5 {
    margin-top: 1rem !important;
  }

  #MainBody .mb-3 {
    margin-bottom: 0.5rem !important;
  }

  #MainBody .title {
    margin: 0.5rem 0;
  }

  .rgResultTable {
    margin-bottom: 0.5rem;
  }

  #MainBody hr {
    margin: 0.5rem 0;
  }

  .footer {
    padding: 0.5rem;
  }

  /* hide interactive-only elements */
  .rgBack, #printReport {
    display: none;
  }

  /* never split report rows or hashcode blocks across pages */
  .rgResultTable tr,
  .rgHashcode {
    break-inside: avoid;
  }

  .rgShield {
    width: 6rem;
  }
}