html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem rgba(196, 98, 25, .55); /* brand-primary-dark */
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}

/* ROE entry form: each section heading on a very light band; a red asterisk marks a mandatory field. */
.roe-entry .roe-section-title { float: none; width: 100%; margin: 0 0 .75rem; padding: .4rem .65rem; font-size: 1rem; font-weight: 600; color: #1f2933; background-color: #F4EBD8; border-radius: .25rem; }
.roe-entry label.required::after { content: " *"; color: #b02a37; font-weight: bold; }
.roe-required-note { font-size: .875rem; color: #474747; }
.roe-star { color: #b02a37; font-weight: bold; }

/* ROE review: a print preview laid out like the Record of Employment form. */
.roe-form { max-width: 980px; border: 2px solid #000; background: #fff; color: #000; font-size: .85rem; }
.roe-title { display: flex; justify-content: space-between; padding: .35rem .6rem; font-weight: bold; border-bottom: 2px solid #000; }
.roe-row { display: grid; grid-template-columns: 1fr; border-bottom: 1px solid #000; }
.roe-row:last-child { border-bottom: 0; }
.roe-row.cols-2 { grid-template-columns: 1.2fr 1fr; }
.roe-row.cols-3 { grid-template-columns: 1fr 1.3fr 1.4fr; }
.roe-row > * { border-right: 1px solid #000; }
.roe-row > *:last-child { border-right: 0; }
.roe-stack > .roe-block { border-bottom: 1px solid #000; }
.roe-stack > .roe-block:last-child { border-bottom: 0; }
.roe-block { position: relative; min-height: 3.2rem; padding: .3rem .5rem .4rem 3rem; }
.roe-no { position: absolute; left: 0; top: 0; min-width: 2.5rem; padding: .1rem .25rem; background: #000; color: #fff; font-weight: bold; text-align: center; }
.roe-label { display: block; font-size: .68rem; text-transform: uppercase; letter-spacing: .02em; }
.roe-value { font-family: "Courier New", Courier, monospace; font-weight: bold; font-size: .95rem; min-height: 1.2rem; overflow-wrap: anywhere; }
.roe-note { font-size: .72rem; color: #474747; }
.roe-pp-grid { display: grid; grid-template-columns: repeat(3, 1fr); margin: .35rem 0 0 -2.5rem; border-top: 1px solid #000; border-left: 1px solid #000; }
.roe-pp { display: flex; border-right: 1px solid #000; border-bottom: 1px solid #000; }
.roe-pp-no { flex: 0 0 2rem; padding: .15rem; border-right: 1px solid #000; font-size: .7rem; text-align: center; }
.roe-pp-amt { flex: 1; min-height: 1.5rem; padding: .1rem .35rem; font-family: "Courier New", Courier, monospace; font-weight: bold; text-align: right; }

@media (max-width: 767.98px) {
  .roe-row.cols-2, .roe-row.cols-3 { grid-template-columns: 1fr; }
  .roe-row > * { border-right: 0; border-bottom: 1px solid #000; }
  .roe-row > *:last-child { border-bottom: 0; }
}

@media print {
  header, footer, .no-print { display: none !important; }
  .roe-form { max-width: none; }
}
/* Technical details window (Help menu, technical team only): long version texts wrap inside their column. */
.technical-details dd { overflow-wrap: anywhere; }

/* Field descriptions as an (i) icon: see site.js. */
.field-help-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.1rem;
    height: 1.1rem;
    margin-left: .35rem;
    padding: 0;
    border: 1px solid var(--bs-secondary-color, #6c757d);
    border-radius: 50%;
    background: transparent;
    color: var(--bs-secondary-color, #6c757d);
    font: italic 700 .7rem/1 Georgia, serif;
    vertical-align: .1em;
    cursor: help;
}
.field-help-icon:hover, .field-help-icon:focus-visible {
    border-color: var(--bs-primary, #0d6efd);
    color: var(--bs-primary, #0d6efd);
    outline: none;
}
.field-help-popover { max-width: 22rem; font-size: .85rem; }

/* Manage > Personal Data (default Identity page): the Download form sat directly on the Delete button. */
#download-data {
  margin-bottom: 1rem;
}