/* ve-compat.css: the structural subset of Bootstrap 5.1 the hub templates use,
   so the CDN copy can go. Layout and mechanics only; colours and type come from
   ve-tokens.css + ve-bootstrap.css, which load after this file. Add a class here
   only when a template starts using it. */

/* Reboot */
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; font-size: 1rem; line-height: 1.5; -webkit-text-size-adjust: 100%; }
h1, h2, h3, h4, h5, h6, .h3, .h4 { margin: 0 0 .5rem; line-height: 1.2; }
h1 { font-size: calc(1.375rem + 1.5vw); } h2 { font-size: calc(1.325rem + .9vw); }
h3, .h3 { font-size: calc(1.3rem + .6vw); } h4, .h4 { font-size: calc(1.275rem + .3vw); }
h5 { font-size: 1.25rem; } h6 { font-size: 1rem; }
@media (min-width: 1200px) { h1 { font-size: 2.5rem; } h2 { font-size: 2rem; } h3, .h3 { font-size: 1.75rem; } h4, .h4 { font-size: 1.5rem; } }
p, ul, ol, dl, pre { margin-top: 0; margin-bottom: 1rem; }
ul, ol { padding-left: 2rem; }
small, .small { font-size: .875em; }
.lead { font-size: 1.25rem; font-weight: 300; }
hr { margin: 1rem 0; border: 0; border-top: 1px solid; opacity: .25; }
a { text-decoration: underline; }
img, svg { vertical-align: middle; }
table { caption-side: bottom; border-collapse: collapse; }
th { text-align: inherit; }
label { display: inline-block; }
button { border-radius: 0; }
input, button, select, textarea { margin: 0; font-family: inherit; font-size: inherit; line-height: inherit; }
button, select { text-transform: none; }
button, [type=button], [type=submit] { -webkit-appearance: button; }
button:not(:disabled), [type=button]:not(:disabled), [type=submit]:not(:disabled) { cursor: pointer; }
textarea { resize: vertical; }
pre, code { font-size: .875em; }
pre { display: block; overflow: auto; }
[hidden] { display: none !important; }
.visually-hidden, .sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Grid */
.container { width: 100%; padding: 0 .75rem; margin: 0 auto; }
@media (min-width: 576px) { .container { max-width: 540px; } }
@media (min-width: 768px) { .container { max-width: 720px; } }
@media (min-width: 992px) { .container { max-width: 960px; } }
@media (min-width: 1200px) { .container { max-width: 1140px; } }
@media (min-width: 1400px) { .container { max-width: 1320px; } }
.row { --gx: 1.5rem; display: flex; flex-wrap: wrap; margin-top: 0; margin-right: calc(var(--gx) * -.5); margin-left: calc(var(--gx) * -.5); }
.row > * { flex-shrink: 0; width: 100%; max-width: 100%; padding-right: calc(var(--gx) * .5); padding-left: calc(var(--gx) * .5); }
.col-12 { flex: 0 0 auto; width: 100%; }
.col-4 { flex: 0 0 auto; width: 33.33333%; }
@media (min-width: 768px) {
  .col-md-3 { flex: 0 0 auto; width: 25%; } .col-md-4 { flex: 0 0 auto; width: 33.33333%; }
  .col-md-6 { flex: 0 0 auto; width: 50%; } .col-md-8 { flex: 0 0 auto; width: 66.66667%; }
}

/* Utilities */
.d-none { display: none !important; } .d-block { display: block !important; }
.d-flex { display: flex !important; } .d-grid { display: grid !important; }
.flex-wrap { flex-wrap: wrap !important; }
.justify-content-between { justify-content: space-between !important; }
.justify-content-center { justify-content: center !important; }
.justify-content-end { justify-content: flex-end !important; }
.align-items-center { align-items: center !important; } .align-items-start { align-items: flex-start !important; }
.align-middle { vertical-align: middle !important; }
.gap-1 { gap: .25rem !important; } .gap-2 { gap: .5rem !important; } .gap-3 { gap: 1rem !important; }
.float-end { float: right !important; }
.position-relative { position: relative !important; }
.w-100 { width: 100% !important; } .h-100 { height: 100% !important; }
.m-0 { margin: 0 !important; } .mx-auto { margin-right: auto !important; margin-left: auto !important; }
.mt-1 { margin-top: .25rem !important; } .mt-2 { margin-top: .5rem !important; } .mt-3 { margin-top: 1rem !important; } .mt-4 { margin-top: 1.5rem !important; } .mt-5 { margin-top: 3rem !important; }
.mb-0 { margin-bottom: 0 !important; } .mb-1 { margin-bottom: .25rem !important; } .mb-2 { margin-bottom: .5rem !important; } .mb-3 { margin-bottom: 1rem !important; } .mb-4 { margin-bottom: 1.5rem !important; } .mb-5 { margin-bottom: 3rem !important; }
.me-1 { margin-right: .25rem !important; } .me-2 { margin-right: .5rem !important; } .me-3 { margin-right: 1rem !important; }
.ms-1 { margin-left: .25rem !important; } .ms-2 { margin-left: .5rem !important; }
.p-0 { padding: 0 !important; } .p-2 { padding: .5rem !important; } .p-3 { padding: 1rem !important; } .p-4 { padding: 1.5rem !important; }
.py-2 { padding-top: .5rem !important; padding-bottom: .5rem !important; } .py-5 { padding-top: 3rem !important; padding-bottom: 3rem !important; }
.text-center { text-align: center !important; } .text-end { text-align: right !important; } .text-start { text-align: left !important; }
.text-decoration-none { text-decoration: none !important; }
.fs-6 { font-size: 1rem !important; } .fw-bold { font-weight: 700 !important; } .fw-semibold { font-weight: 600 !important; }
.border { border: 1px solid !important; } .border-0 { border: 0 !important; }
.rounded { border-radius: var(--ve-r, .375rem) !important; } .rounded-circle { border-radius: 50% !important; }
.bg-transparent { background-color: transparent !important; }

/* Buttons */
.btn { display: inline-block; font-weight: 400; line-height: 1.5; text-align: center; text-decoration: none; vertical-align: middle; user-select: none; border: 1px solid transparent; padding: .375rem .75rem; font-size: 1rem; border-radius: .25rem; transition: background-color .15s, border-color .15s, color .15s; }
.btn:disabled, .btn.disabled { pointer-events: none; opacity: .65; }
.btn-link { background: none; border-color: transparent; }
.btn-close { box-sizing: content-box; width: 1em; height: 1em; padding: .25em; border: 0; border-radius: .25rem; opacity: .5; background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat; }
.btn-close:hover { opacity: .75; }
:root[data-theme="dark"] .btn-close { filter: invert(1); }

/* Forms */
.form-label { margin-bottom: .5rem; }
.form-text { margin-top: .25rem; font-size: .875em; }
.form-control, .form-select { display: block; width: 100%; padding: .375rem .75rem; font-size: 1rem; line-height: 1.5; border: 1px solid; border-radius: .25rem; appearance: none; }
.form-control:focus, .form-select:focus { outline: 0; }
textarea.form-control { min-height: calc(1.5em + .75rem + 2px); }
.form-control-sm, .form-select-sm { padding: .25rem .5rem; font-size: .875rem; }
.form-select { padding-right: 2.25rem; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23737373' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right .75rem center; background-size: 16px 12px; }
.form-check { display: block; min-height: 1.5rem; padding-left: 1.5em; margin-bottom: .125rem; }
.form-check .form-check-input { float: left; margin-left: -1.5em; }
.form-check-inline { display: inline-block; margin-right: 1rem; }
.form-check-input { width: 1em; height: 1em; margin-top: .25em; vertical-align: top; border: 1px solid; appearance: none; background-repeat: no-repeat; background-position: center; background-size: contain; }
.form-check-input[type=checkbox] { border-radius: .25em; }
.form-check-input[type=radio] { border-radius: 50%; }
.form-check-input:checked[type=checkbox] { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e"); }
.form-check-input:checked[type=radio] { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e"); }
.form-check-input:focus { outline: 2px solid var(--ve-focus); outline-offset: 2px; }

/* Cards */
.card { position: relative; display: flex; flex-direction: column; min-width: 0; word-wrap: break-word; border: 1px solid; }
.card-body { flex: 1 1 auto; padding: 1rem; }
.card-title { margin-bottom: .5rem; }
.card-text:last-child { margin-bottom: 0; }
.card-header { padding: .5rem 1rem; margin-bottom: 0; border-bottom: 1px solid; }
.card-header-tabs { margin: 0 -.5rem -.5rem; border-bottom: 0; }

/* Alerts and badges */
.alert { position: relative; padding: 1rem; margin-bottom: 1rem; border: 1px solid transparent; }
.alert-dismissible { padding-right: 3rem; }
.alert-dismissible .btn-close { position: absolute; top: 0; right: 0; z-index: 2; padding: 1.25rem 1rem; }
.alert-link { font-weight: 700; }
.badge { display: inline-block; padding: .35em .65em; font-size: .75em; line-height: 1; text-align: center; white-space: nowrap; vertical-align: baseline; }
.badge:empty { display: none; }

/* Tables */
.table { width: 100%; margin-bottom: 1rem; vertical-align: top; }
.table > :not(caption) > * > * { padding: .5rem; border-bottom-width: 1px; border-bottom-style: solid; }
.table > tbody { vertical-align: inherit; } .table > thead { vertical-align: bottom; }
.table-sm > :not(caption) > * > * { padding: .25rem; }
.table-striped > tbody > tr:nth-of-type(odd) > * { background-color: var(--bs-table-striped-bg); }
.table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* Nav and tabs */
.nav { display: flex; flex-wrap: wrap; padding-left: 0; margin-bottom: 0; list-style: none; }
.nav-link { display: block; padding: .5rem 1rem; text-decoration: none; background: none; border: 0; }
.nav-tabs { border-bottom: 1px solid; }
.nav-tabs .nav-link { margin-bottom: -1px; border: 1px solid transparent; }
.nav-tabs.card-header-tabs { margin: 0 -.5rem -.5rem; border-bottom: 0; }
.tab-content > .tab-pane { display: none; }
.tab-content > .active { display: block; }

/* Transitions */
.fade { transition: opacity .15s linear; }
.fade:not(.show) { opacity: 0; }
@media (prefers-reduced-motion: reduce) { .fade, .btn { transition: none; } }

/* Dropdowns */
.dropdown { position: relative; }
.dropdown-toggle { white-space: nowrap; }
.dropdown-toggle::after { display: inline-block; margin-left: .255em; vertical-align: .255em; content: ""; border-top: .3em solid; border-right: .3em solid transparent; border-left: .3em solid transparent; }
.dropdown-menu { position: absolute; top: 100%; left: 0; z-index: 1000; display: none; min-width: 10rem; margin: .125rem 0 0; padding: .5rem 0; font-size: 1rem; text-align: left; list-style: none; background-clip: padding-box; }
.dropdown-menu.show { display: block; }
.dropdown-menu-end { right: 0; left: auto; }
.dropdown-item { display: block; width: 100%; padding: .25rem 1rem; clear: both; font-weight: 400; text-align: inherit; text-decoration: none; white-space: nowrap; background: transparent; border: 0; }
.dropdown-header { display: block; padding: .5rem 1rem; margin-bottom: 0; font-size: .875rem; color: var(--ve-muted); white-space: nowrap; }
.dropdown-divider { height: 0; margin: .5rem 0; overflow: hidden; border-top: 1px solid; }

/* Modals */
.modal-open { overflow: hidden; }
.modal { position: fixed; top: 0; left: 0; z-index: 1055; display: none; width: 100%; height: 100%; overflow-x: hidden; overflow-y: auto; outline: 0; }
.modal-dialog { position: relative; width: auto; margin: .5rem; pointer-events: none; }
.modal.fade .modal-dialog { transition: transform .3s ease-out; transform: translate(0, -50px); }
.modal.show .modal-dialog { transform: none; }
.modal-content { position: relative; display: flex; flex-direction: column; width: 100%; pointer-events: auto; background-clip: padding-box; outline: 0; }
.modal-backdrop { position: fixed; top: 0; left: 0; z-index: 1050; width: 100vw; height: 100vh; background-color: #000; }
.modal-backdrop.fade { opacity: 0; } .modal-backdrop.show { opacity: .5; }
.modal-header { display: flex; flex-shrink: 0; align-items: center; justify-content: space-between; padding: 1rem; border-bottom: 1px solid; }
.modal-header .btn-close { padding: .5rem; margin: -.5rem -.5rem -.5rem auto; }
.modal-title { margin-bottom: 0; line-height: 1.5; }
.modal-body { position: relative; flex: 1 1 auto; padding: 1rem; }
.modal-footer { display: flex; flex-wrap: wrap; flex-shrink: 0; align-items: center; justify-content: flex-end; padding: .75rem; border-top: 1px solid; gap: .5rem; }
@media (min-width: 576px) { .modal-dialog { max-width: 500px; margin: 1.75rem auto; } }
@media (min-width: 992px) { .modal-lg { max-width: 800px; } }

/* Spinners */
@keyframes ve-spin { to { transform: rotate(360deg); } }
.spinner-border { display: inline-block; width: 2rem; height: 2rem; vertical-align: -.125em; border: .25em solid currentColor; border-right-color: transparent; border-radius: 50%; animation: .75s linear infinite ve-spin; }
.spinner-border-sm { width: 1rem; height: 1rem; border-width: .2em; }
@media (prefers-reduced-motion: reduce) { .spinner-border { animation-duration: 1.5s; } }
