*[data-theme="admin"], html:where(:has(body.mce-content-body)) {--primary:#0d6efd;--primary-fg:#FFFFFF;--primary-shadow:rgba(49,131,253,0.5);--primary-hover:#0B5DD7;--primary-hover-border:#0A58CA;--primary-active:#0A58CA;--primary-active-border:#0952BD;--secondary:#6c757d;--secondary-shadow:rgba(130,137,144,0.5);--secondary-fg:#FFFFFF;--secondary-hover:#5B636A;--secondary-hover-border:#565D64;--secondary-active:#565D64;--secondary-active-border:#51575D;--success:#198754;--success-fg:#FFFFFF;--success-shadow:rgba(59,153,109,0.5);--success-hover:#157247;--success-hover-border:#146C43;--success-active:#146C43;--success-active-border:#12653F;--info:#0dcaf0;--info-shadow:rgba(11,171,204,0.5);--info-fg:#000000;--info-hover:#31D1F2;--info-hover-border:#25CFF1;--info-active:#3DD4F3;--info-active-border:#25CFF1;--warning:#ffc107;--warning-shadow:rgba(216,164,5,0.5);--warning-fg:#000000;--warning-hover:#FFCA2C;--warning-hover-border:#FFC71F;--warning-active:#FFCD38;--warning-active-border:#FFC71F;--danger:#dc3545;--danger-shadow:rgba(225,83,96,0.5);--danger-fg:#FFFFFF;--danger-hover:#BB2D3A;--danger-hover-border:#B02A37;--danger-active:#B02A37;--danger-active-border:#A52733;--light:#f8f9fa;--light-shadow:rgba(210,211,212,0.5);--light-fg:#000000;--light-hover:#F9F9FA;--light-hover-border:#F8F9FA;--light-active:#F9FAFB;--light-active-border:#F8F9FA;--dark:#212529;--dark-shadow:rgba(66,69,73,0.5);--dark-fg:#FFFFFF;--dark-hover:#1C1F22;--dark-hover-border:#1A1D20;--dark-active:#1A1D20;--dark-active-border:#181B1E;--font-mono:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--font:"OpenSans","Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";}*[data-theme="main"], html:where(:has(body.mce-content-body)) {--primary:#0d6efd;--primary-fg:#FFFFFF;--primary-shadow:rgba(49,131,253,0.5);--primary-hover:#0B5DD7;--primary-hover-border:#0A58CA;--primary-active:#0A58CA;--primary-active-border:#0952BD;--secondary:#6c757d;--secondary-shadow:rgba(130,137,144,0.5);--secondary-fg:#FFFFFF;--secondary-hover:#5B636A;--secondary-hover-border:#565D64;--secondary-active:#565D64;--secondary-active-border:#51575D;--success:#198754;--success-fg:#FFFFFF;--success-shadow:rgba(59,153,109,0.5);--success-hover:#157247;--success-hover-border:#146C43;--success-active:#146C43;--success-active-border:#12653F;--info:#0dcaf0;--info-shadow:rgba(11,171,204,0.5);--info-fg:#000000;--info-hover:#31D1F2;--info-hover-border:#25CFF1;--info-active:#3DD4F3;--info-active-border:#25CFF1;--warning:#ffc107;--warning-shadow:rgba(216,164,5,0.5);--warning-fg:#000000;--warning-hover:#FFCA2C;--warning-hover-border:#FFC71F;--warning-active:#FFCD38;--warning-active-border:#FFC71F;--danger:#dc3545;--danger-shadow:rgba(225,83,96,0.5);--danger-fg:#FFFFFF;--danger-hover:#BB2D3A;--danger-hover-border:#B02A37;--danger-active:#B02A37;--danger-active-border:#A52733;--light:#f8f9fa;--light-shadow:rgba(210,211,212,0.5);--light-fg:#000000;--light-hover:#F9F9FA;--light-hover-border:#F8F9FA;--light-active:#F9FAFB;--light-active-border:#F8F9FA;--dark:#212529;--dark-shadow:rgba(66,69,73,0.5);--dark-fg:#FFFFFF;--dark-hover:#1C1F22;--dark-hover-border:#1A1D20;--dark-active:#1A1D20;--dark-active-border:#181B1E;--font-mono:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--font:"OpenSans","Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";}:root {
}
:root {
--max-width: 85rem;
}
:root {
--field-sm-font-weight: 400;
--field-md-font-weight: 400;
}
:root {
}
:root {
--bs-blue: #0d6efd;
--bs-indigo: #6610f2;
--bs-purple: #6f42c1;
--bs-pink: #d63384;
--bs-red: #dc3545;
--bs-orange: #fd7e14;
--bs-yellow: #ffc107;
--bs-green: #198754;
--bs-teal: #20c997;
--bs-cyan: #0dcaf0;
--bs-white: #fff;
--bs-gray: #6c757d;
--bs-gray-dark: #343a40;
--bs-gray-100: #f8f9fa;
--bs-gray-200: #e9ecef;
--bs-gray-300: #dee2e6;
--bs-gray-400: #ced4da;
--bs-gray-500: #adb5bd;
--bs-gray-600: #6c757d;
--bs-gray-700: #495057;
--bs-gray-800: #343a40;
--bs-gray-900: #212529;
--bs-primary: #0d6efd;
--bs-secondary: #6c757d;
--bs-success: #198754;
--bs-info: #0dcaf0;
--bs-warning: #ffc107;
--bs-danger: #dc3545;
--bs-light: #f8f9fa;
--bs-dark: #212529;
--bs-primary-rgb: 13, 110, 253;
--bs-secondary-rgb: 108, 117, 125;
--bs-success-rgb: 25, 135, 84;
--bs-info-rgb: 13, 202, 240;
--bs-warning-rgb: 255, 193, 7;
--bs-danger-rgb: 220, 53, 69;
--bs-light-rgb: 248, 249, 250;
--bs-dark-rgb: 33, 37, 41;
--bs-white-rgb: 255, 255, 255;
--bs-black-rgb: 0, 0, 0;
--bs-body-color-rgb: 33, 37, 41;
--bs-body-bg-rgb: 255, 255, 255;
--bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
--bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
--bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
--bs-body-font-family: var(--bs-font-sans-serif);
--bs-body-font-size: 1rem;
--bs-body-font-weight: 400;
--bs-body-line-height: 1.5;
--bs-body-color: #212529;
--bs-body-bg: #fff;
}
*,
*::before,
*::after {
box-sizing: border-box;
}
@media (prefers-reduced-motion: no-preference) {
:root:not(:has(body.mce-content-body)) {
scroll-behavior: smooth;
}
}
body:not(.mce-content-body) {
margin: 0;
}
body {
font-family: var(--bs-body-font-family);
font-size: var(--bs-body-font-size);
font-weight: var(--bs-body-font-weight);
line-height: var(--bs-body-line-height);
color: var(--bs-body-color);
text-align: var(--bs-body-text-align);
background-color: var(--bs-body-bg);
-webkit-text-size-adjust: 100%;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
hr {
margin: 1rem 0;
color: inherit;
background-color: currentColor;
border: 0;
opacity: 0.25;
}
hr:not([size]) {
height: 1px;
}
h6, h5, h4, h3, h2, h1 {
margin-top: 0;
margin-bottom: 0.5rem;
font-weight: 500;
line-height: 1.2;
}
h1 {
font-size: calc(1.375rem + 1.5vw);
}
@media (min-width: 1200px) {
h1 {
font-size: 2.5rem;
}
}
h2 {
font-size: calc(1.325rem + 0.9vw);
}
@media (min-width: 1200px) {
h2 {
font-size: 2rem;
}
}
h3 {
font-size: calc(1.3rem + 0.6vw);
}
@media (min-width: 1200px) {
h3 {
font-size: 1.75rem;
}
}
h4 {
font-size: calc(1.275rem + 0.3vw);
}
@media (min-width: 1200px) {
h4 {
font-size: 1.5rem;
}
}
h5 {
font-size: 1.25rem;
}
h6 {
font-size: 1rem;
}
p {
margin-top: 0;
margin-bottom: 1rem;
}
abbr[title],
abbr[data-bs-original-title] {
text-decoration: underline dotted;
cursor: help;
text-decoration-skip-ink: none;
}
address {
margin-bottom: 1rem;
font-style: normal;
line-height: inherit;
}
ol,
ul {
padding-left: 2rem;
}
ol,
ul,
dl {
margin-top: 0;
margin-bottom: 1rem;
}
ol ol,
ul ul,
ol ul,
ul ol {
margin-bottom: 0;
}
dt {
font-weight: 700;
}
dd {
margin-bottom: 0.5rem;
margin-left: 0;
}
blockquote {
margin: 0 0 1rem;
}
b,
strong {
font-weight: bolder;
}
small {
font-size: 0.875em;
}
mark {
padding: 0.2em;
background-color: #fcf8e3;
}
sub,
sup {
position: relative;
font-size: 0.75em;
line-height: 0;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
a {
color: #0d6efd;
text-decoration: underline;
}
a:hover {
color: rgb(4.0784313725%, 34.5098039216%, 79.3725490196%);
}
a:not([href]):not([class]), a:not([href]):not([class]):hover {
color: inherit;
text-decoration: none;
}
pre,
code,
kbd,
samp {
font-family: var(--bs-font-monospace);
font-size: 1em;
direction: ltr ;
unicode-bidi: bidi-override;
}
pre {
display: block;
margin-top: 0;
margin-bottom: 1rem;
overflow: auto;
font-size: 0.875em;
}
pre code {
font-size: inherit;
color: inherit;
word-break: normal;
}
code {
font-size: 0.875em;
color: #d63384;
word-wrap: break-word;
}
a > code {
color: inherit;
}
kbd {
padding: 0.2rem 0.4rem;
font-size: 0.875em;
color: #fff;
background-color: #212529;
border-radius: 0.0125rem 0.0125rem 0.0125rem 0.0125rem;
}
kbd kbd {
padding: 0;
font-size: 1em;
font-weight: 700;
}
figure {
margin: 0 0 1rem;
}
img,
svg {
vertical-align: middle;
}
table {
caption-side: bottom;
border-collapse: collapse;
}
caption {
padding-top: 0.5rem;
padding-bottom: 0.5rem;
color: #6c757d;
text-align: left;
}
th {
text-align: inherit;
text-align: -webkit-match-parent;
}
thead,
tbody,
tfoot,
tr,
td,
th {
border-color: inherit;
border-style: solid;
border-width: 0;
}
label {
display: inline-block;
}
button {
border-radius: 0;
}
button:focus:not(:focus-visible) {
outline: 0;
}
input,
button,
select,
optgroup,
textarea {
margin: 0;
font-family: inherit;
font-size: inherit;
line-height: inherit;
}
button,
select {
text-transform: none;
}
[role=button] {
cursor: pointer;
}
select {
word-wrap: normal;
}
select:disabled {
opacity: 1;
}
[list]::-webkit-calendar-picker-indicator {
display: none;
}
button,
[type=button],
[type=reset],
[type=submit] {
-webkit-appearance: button;
}
button:not(:disabled),
[type=button]:not(:disabled),
[type=reset]:not(:disabled),
[type=submit]:not(:disabled) {
cursor: pointer;
}
::-moz-focus-inner {
padding: 0;
border-style: none;
}
textarea {
resize: vertical;
}
fieldset {
min-width: 0;
padding: 0;
margin: 0;
border: 0;
}
legend {
float: left;
width: 100%;
padding: 0;
margin-bottom: 0.5rem;
line-height: inherit;
font-size: calc(1.275rem + 0.3vw);
}
@media (min-width: 1200px) {
legend {
font-size: 1.5rem;
}
}
legend + * {
clear: left;
}
::-webkit-datetime-edit-fields-wrapper,
::-webkit-datetime-edit-text,
::-webkit-datetime-edit-minute,
::-webkit-datetime-edit-hour-field,
::-webkit-datetime-edit-day-field,
::-webkit-datetime-edit-month-field,
::-webkit-datetime-edit-year-field {
padding: 0;
}
::-webkit-inner-spin-button {
height: auto;
}
[type=search] {
outline-offset: -2px;
-webkit-appearance: textfield;
}
::-webkit-search-decoration {
-webkit-appearance: none;
}
::-webkit-color-swatch-wrapper {
padding: 0;
}
::file-selector-button {
font: inherit;
}
::-webkit-file-upload-button {
font: inherit;
-webkit-appearance: button;
}
output {
display: inline-block;
}
iframe {
border: 0;
}
summary {
display: list-item;
cursor: pointer;
}
progress {
vertical-align: baseline;
}
[hidden] {
display: none !important;
}
.h6, .h5, .h4, .h3, .h2, .h1 {
margin-top: 0;
margin-bottom: 0.5rem;
font-weight: 500;
line-height: 1.2;
}
.h1 {
font-size: calc(1.375rem + 1.5vw);
}
@media (min-width: 1200px) {
.h1 {
font-size: 2.5rem;
}
}
.h2 {
font-size: calc(1.325rem + 0.9vw);
}
@media (min-width: 1200px) {
.h2 {
font-size: 2rem;
}
}
.h3 {
font-size: calc(1.3rem + 0.6vw);
}
@media (min-width: 1200px) {
.h3 {
font-size: 1.75rem;
}
}
.h6 {
font-size: 1rem;
}
.display-1 {
font-weight: 300;
line-height: 1.2;
font-size: calc(1.625rem + 4.5vw);
}
@media (min-width: 1200px) {
.display-1 {
font-size: 5rem;
}
}
.display-2 {
font-weight: 300;
line-height: 1.2;
font-size: calc(1.575rem + 3.9vw);
}
@media (min-width: 1200px) {
.display-2 {
font-size: 4.5rem;
}
}
.display-4 {
font-weight: 300;
line-height: 1.2;
font-size: calc(1.475rem + 2.7vw);
}
@media (min-width: 1200px) {
.display-4 {
font-size: 3.5rem;
}
}
.small {
font-size: 0.875em;
}
.mark {
padding: 0.2em;
background-color: #fcf8e3;
}
.figure {
display: inline-block;
}
.row {
--bs-gutter-x: 1.5rem;
--bs-gutter-y: 0;
display: flex;
flex-wrap: wrap;
margin-top: calc(-1 * var(--bs-gutter-y));
margin-right: calc(-0.5 * var(--bs-gutter-x));
margin-left: calc(-0.5 * var(--bs-gutter-x));
}
.row > * {
flex-shrink: 0;
width: 100%;
max-width: 100%;
padding-right: calc(var(--bs-gutter-x) * 0.5);
padding-left: calc(var(--bs-gutter-x) * 0.5);
margin-top: var(--bs-gutter-y);
}
.offset-1 {
margin-left: 8.33333333%;
}
.offset-2 {
margin-left: 16.66666667%;
}
.offset-4 {
margin-left: 33.33333333%;
}
.g-1,
.gx-1 {
--bs-gutter-x: 0.25rem;
}
.g-1,
.gy-1 {
--bs-gutter-y: 0.25rem;
}
.g-2,
.gx-2 {
--bs-gutter-x: 0.5rem;
}
.g-2,
.gy-2 {
--bs-gutter-y: 0.5rem;
}
.g-4,
.gx-4 {
--bs-gutter-x: 1.5rem;
}
.g-4,
.gy-4 {
--bs-gutter-y: 1.5rem;
}
html {
font-size: 100%;
}
html h1, html h2, html h3, html h4, html h5, html h6,
html .h1, html .h2, html .h3, html .h4, html .h5, html .h6 {
font-family: var(--title-font);
}
.table {
--bs-table-bg: transparent;
--bs-table-accent-bg: transparent;
--bs-table-striped-color: #212529;
--bs-table-striped-bg: rgba(0, 0, 0, 0.05);
--bs-table-active-color: #212529;
--bs-table-active-bg: rgba(0, 0, 0, 0.1);
--bs-table-hover-color: #212529;
--bs-table-hover-bg: rgba(0, 0, 0, 0.075);
width: 100%;
margin-bottom: 1rem;
color: #212529;
vertical-align: top;
border-color: #dee2e6;
}
.table > :not(caption) > * > * {
padding: 0.5rem 0.5rem;
background-color: var(--bs-table-bg);
border-bottom-width: 1px;
box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg);
}
.table > tbody {
vertical-align: inherit;
}
.table > thead {
vertical-align: bottom;
}
.table > :not(:first-child) {
border-top: 2px solid currentColor;
}
[data-clamp],
[data-clamp-xs],
[data-clamp-sm],
[data-clamp-md],
[data-clamp-lg],
[data-clamp-xl] {
display: -webkit-box;
-webkit-box-orient: vertical;
text-overflow: ellipsis;
overflow: hidden;
}
[data-clamp].hidden,
[data-clamp-xs].hidden,
[data-clamp-sm].hidden,
[data-clamp-md].hidden,
[data-clamp-lg].hidden,
[data-clamp-xl].hidden {
display: none !important;
}
[data-clamp="1"] {
white-space: nowrap;
display: block;
}
[data-clamp="2"] {
line-clamp: 2;
-webkit-line-clamp: 2;
}
[data-clamp="3"] {
line-clamp: 3;
-webkit-line-clamp: 3;
}
[data-clamp="4"] {
line-clamp: 4;
-webkit-line-clamp: 4;
}
[data-clamp="5"] {
line-clamp: 5;
-webkit-line-clamp: 5;
}
[data-clamp="6"] {
line-clamp: 6;
-webkit-line-clamp: 6;
}
@media only screen and (max-width: 575px) {
[data-clamp-xs="0"] {
display: block;
-webkit-box-orient: inline-axis;
text-overflow: clip;
overflow: visible;
white-space: normal;
}
[data-clamp-xs="0"][data-clamp-display=inline-block] {
display: inline-block;
}
[data-clamp-xs="0"][data-clamp-display=inline-flex] {
display: inline-flex;
}
[data-clamp-xs="0"][data-clamp-display=flex] {
display: flex;
}
[data-clamp-xs="1"] {
white-space: nowrap;
display: block;
}
[data-clamp-xs="2"] {
line-clamp: 2;
-webkit-line-clamp: 2;
}
[data-clamp-xs="3"] {
line-clamp: 3;
-webkit-line-clamp: 3;
}
[data-clamp-xs="4"] {
line-clamp: 4;
-webkit-line-clamp: 4;
}
[data-clamp-xs="5"] {
line-clamp: 5;
-webkit-line-clamp: 5;
}
[data-clamp-xs="6"] {
line-clamp: 6;
-webkit-line-clamp: 6;
}
}
@media only screen and (min-width: 576px) {
[data-clamp-sm="0"] {
display: block;
-webkit-box-orient: inline-axis;
text-overflow: clip;
overflow: visible;
white-space: normal;
}
[data-clamp-sm="0"][data-clamp-display=inline-block] {
display: inline-block;
}
[data-clamp-sm="0"][data-clamp-display=inline-flex] {
display: inline-flex;
}
[data-clamp-sm="0"][data-clamp-display=flex] {
display: flex;
}
[data-clamp-sm="1"] {
white-space: nowrap;
display: block;
}
[data-clamp-sm="2"] {
line-clamp: 2;
-webkit-line-clamp: 2;
}
[data-clamp-sm="3"] {
line-clamp: 3;
-webkit-line-clamp: 3;
}
[data-clamp-sm="4"] {
line-clamp: 4;
-webkit-line-clamp: 4;
}
[data-clamp-sm="5"] {
line-clamp: 5;
-webkit-line-clamp: 5;
}
[data-clamp-sm="6"] {
line-clamp: 6;
-webkit-line-clamp: 6;
}
}
@media only screen and (min-width: 768px) {
[data-clamp-md="0"] {
display: block;
-webkit-box-orient: inline-axis;
text-overflow: clip;
overflow: visible;
white-space: normal;
}
[data-clamp-md="0"][data-clamp-display=inline-block] {
display: inline-block;
}
[data-clamp-md="0"][data-clamp-display=inline-flex] {
display: inline-flex;
}
[data-clamp-md="0"][data-clamp-display=flex] {
display: flex;
}
[data-clamp-md="1"] {
white-space: nowrap;
display: block;
}
[data-clamp-md="2"] {
line-clamp: 2;
-webkit-line-clamp: 2;
}
[data-clamp-md="3"] {
line-clamp: 3;
-webkit-line-clamp: 3;
}
[data-clamp-md="4"] {
line-clamp: 4;
-webkit-line-clamp: 4;
}
[data-clamp-md="5"] {
line-clamp: 5;
-webkit-line-clamp: 5;
}
[data-clamp-md="6"] {
line-clamp: 6;
-webkit-line-clamp: 6;
}
}
@media only screen and (min-width: 992px) {
[data-clamp-lg="0"] {
display: block;
-webkit-box-orient: inline-axis;
text-overflow: clip;
overflow: visible;
white-space: normal;
}
[data-clamp-lg="0"][data-clamp-display=inline-block] {
display: inline-block;
}
[data-clamp-lg="0"][data-clamp-display=inline-flex] {
display: inline-flex;
}
[data-clamp-lg="0"][data-clamp-display=flex] {
display: flex;
}
[data-clamp-lg="1"] {
white-space: nowrap;
display: block;
}
[data-clamp-lg="2"] {
line-clamp: 2;
-webkit-line-clamp: 2;
}
[data-clamp-lg="3"] {
line-clamp: 3;
-webkit-line-clamp: 3;
}
[data-clamp-lg="4"] {
line-clamp: 4;
-webkit-line-clamp: 4;
}
[data-clamp-lg="5"] {
line-clamp: 5;
-webkit-line-clamp: 5;
}
[data-clamp-lg="6"] {
line-clamp: 6;
-webkit-line-clamp: 6;
}
}
@media only screen and (min-width: 1200px) {
[data-clamp-xl="0"] {
display: block;
-webkit-box-orient: inline-axis;
text-overflow: clip;
overflow: visible;
white-space: normal;
}
[data-clamp-xl="0"][data-clamp-display=inline-block] {
display: inline-block;
}
[data-clamp-xl="0"][data-clamp-display=inline-flex] {
display: inline-flex;
}
[data-clamp-xl="0"][data-clamp-display=flex] {
display: flex;
}
[data-clamp-xl="1"] {
white-space: nowrap;
display: block;
}
[data-clamp-xl="2"] {
line-clamp: 2;
-webkit-line-clamp: 2;
}
[data-clamp-xl="3"] {
line-clamp: 3;
-webkit-line-clamp: 3;
}
[data-clamp-xl="4"] {
line-clamp: 4;
-webkit-line-clamp: 4;
}
[data-clamp-xl="5"] {
line-clamp: 5;
-webkit-line-clamp: 5;
}
[data-clamp-xl="6"] {
line-clamp: 6;
-webkit-line-clamp: 6;
}
}
.badge {
display: inline-block;
padding: 0.35em 0.65em;
font-size: 0.75em;
font-weight: 700;
line-height: 1;
color: #fff;
text-align: center;
white-space: nowrap;
vertical-align: baseline;
border-radius: 0.25rem;
}
.badge > :is(i, .ui-icon) {
margin-right: 0.25rem;
}
.badge:empty {
display: none;
}
.btn .badge {
position: relative;
top: -1px;
}
.breadcrumb {
display: flex;
flex-wrap: wrap;
padding: 0 0;
margin-bottom: 1rem;
list-style: none;
}
.form-check {
display: block;
min-height: 1.5rem;
padding-left: 1.5em;
margin-bottom: 0.125rem;
}
.form-check .form-check-input {
float: left;
margin-left: -1.5em;
}
.form-check-input {
width: 1em;
height: 1em;
margin-top: 0.25em;
vertical-align: top;
background-color: #fff;
background-repeat: no-repeat;
background-position: center;
background-size: contain;
border: 1px solid rgba(0, 0, 0, 0.25);
appearance: none;
color-adjust: exact;
}
.form-check-input[type=checkbox] {
border-radius: 0.015625rem 0.015625rem 0.015625rem 0.015625rem;
}
.form-check-input[type=radio] {
border-radius: 50%;
}
.form-check-input:active {
filter: brightness(90%);
}
.form-check-input:focus {
border-color: rgb(52.5490196078%, 71.568627451%, 99.6078431373%);
outline: 0;
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}
.form-check-input:checked {
background-color: #0d6efd;
border-color: #0d6efd;
}
.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[type=checkbox]:indeterminate {
background-color: #0d6efd;
border-color: #0d6efd;
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 10h8'/%3e%3c/svg%3e");
}
.form-check-input:disabled {
pointer-events: none;
filter: none;
opacity: 0.5;
}
.form-check-input[disabled] ~ .form-check-label, .form-check-input:disabled ~ .form-check-label {
opacity: 0.5;
}
.form-switch {
padding-left: 2.5em;
}
.form-switch .form-check-input {
width: 2em;
margin-left: -2.5em;
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e");
background-position: left center;
border-radius: 0.125rem 0.125rem 0.125rem 0.125rem;
transition: background-position 0.15s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
.form-switch .form-check-input {
transition: none;
}
}
.form-switch .form-check-input:focus {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgb%2852.5490196078%, 71.568627451%, 99.6078431373%%29'/%3e%3c/svg%3e");
}
.form-switch .form-check-input:checked {
background-position: right center;
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
}
.btn-check {
position: absolute;
clip: rect(0, 0, 0, 0);
pointer-events: none;
}
.btn-check[disabled] + .btn, .btn-check:disabled + .btn {
pointer-events: none;
filter: none;
opacity: 0.65;
}
.form-control {
display: block;
width: 100%;
padding: 0.375rem 0.75rem;
font-size: 1rem;
font-weight: 400;
line-height: 1.5;
color: #212529;
background-color: #fff;
background-clip: padding-box;
border: 1px solid #ced4da;
appearance: none;
border-radius: 0.25rem;
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
.form-control {
transition: none;
}
}
.form-control[type=file] {
overflow: hidden;
}
.form-control[type=file]:not(:disabled):not([readonly]) {
cursor: pointer;
}
.form-control:focus {
color: #212529;
background-color: #fff;
border-color: rgb(52.5490196078%, 71.568627451%, 99.6078431373%);
outline: 0;
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}
.form-control::-webkit-date-and-time-value {
height: 1.5em;
}
.form-control::placeholder {
color: #6c757d;
opacity: 1;
}
.form-control:disabled, .form-control[readonly] {
background-color: #e9ecef;
opacity: 1;
}
.form-control::file-selector-button {
padding: 0.375rem 0.75rem;
margin: -0.375rem -0.75rem;
margin-inline-end: 0.75rem;
color: #212529;
background-color: #e9ecef;
pointer-events: none;
border-color: inherit;
border-style: solid;
border-width: 0;
border-inline-end-width: 1px;
border-radius: 0;
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
.form-control::file-selector-button {
transition: none;
}
}
.form-control:hover:not(:disabled):not([readonly])::file-selector-button {
background-color: rgb(86.8039215686%, 87.9215686275%, 89.0392156863%);
}
.form-control::-webkit-file-upload-button {
padding: 0.375rem 0.75rem;
margin: -0.375rem -0.75rem;
margin-inline-end: 0.75rem;
color: #212529;
background-color: #e9ecef;
pointer-events: none;
border-color: inherit;
border-style: solid;
border-width: 0;
border-inline-end-width: 1px;
border-radius: 0;
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
.form-control::-webkit-file-upload-button {
transition: none;
}
}
.form-control:hover:not(:disabled):not([readonly])::-webkit-file-upload-button {
background-color: rgb(86.8039215686%, 87.9215686275%, 89.0392156863%);
}
textarea.form-control {
min-height: calc(1.5em + 0.75rem + 2px);
}
.form-select {
display: block;
width: 100%;
padding: 0.375rem 2.25rem 0.375rem 0.75rem;
-moz-padding-start: calc(0.75rem - 3px);
font-weight: 400;
line-height: 1.5;
color: #212529;
background-color: #fff;
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='%23343a40' 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 0.75rem center;
background-size: 16px 12px;
border: 1px solid #ced4da;
appearance: none;
font-size: 1rem;
border-radius: 0.015625rem 0rem 0.015625rem 0.015625rem;
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
.form-select {
transition: none;
}
}
.form-select:focus {
border-color: rgb(52.5490196078%, 71.568627451%, 99.6078431373%);
outline: 0;
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}
.form-select[multiple], .form-select[size]:not([size="1"]) {
padding-right: 0.75rem;
background-image: none;
}
.form-select:disabled {
background-color: #e9ecef;
}
.form-select:-moz-focusring {
color: transparent;
text-shadow: 0 0 0 #212529;
}
.form-text {
margin-top: 0.25rem;
font-size: 0.875em;
color: #6c757d;
}
.input-group {
position: relative;
display: flex;
flex-wrap: wrap;
align-items: stretch;
width: 100%;
}
.input-group > .form-control,
.input-group > .form-select {
position: relative;
flex: 1 1 auto;
width: 1%;
min-width: 0;
}
.input-group > .form-control:focus,
.input-group > .form-select:focus {
z-index: 3;
}
.input-group .btn {
position: relative;
z-index: 2;
}
.input-group .btn:focus {
z-index: 3;
}
.input-group-text {
display: flex;
align-items: center;
padding: 0.375rem 0.75rem;
font-size: 1rem;
font-weight: 400;
line-height: 1.5;
color: #212529;
text-align: center;
white-space: nowrap;
background-color: #e9ecef;
border: 1px solid #ced4da;
border-radius: 0.015625rem 0.015625rem 0.015625rem 0.015625rem;
}
.input-group:not(.has-validation) > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu),
.input-group:not(.has-validation) > .dropdown-toggle:nth-last-child(n+3) {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
margin-left: -1px;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.was-validated .form-control:invalid, .form-control.is-invalid {
border-color: #dc3545;
padding-right: calc(1.5em + 0.75rem);
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
background-repeat: no-repeat;
background-position: right calc(0.375em + 0.1875rem) center;
background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}
.was-validated .form-control:invalid:focus, .form-control.is-invalid:focus {
border-color: #dc3545;
box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.25);
}
.was-validated textarea.form-control:invalid, textarea.form-control.is-invalid {
padding-right: calc(1.5em + 0.75rem);
background-position: top calc(0.375em + 0.1875rem) right calc(0.375em + 0.1875rem);
}
.was-validated .form-select:invalid, .form-select.is-invalid {
border-color: #dc3545;
}
.was-validated .form-select:invalid:not([multiple]):not([size]), .was-validated .form-select:invalid:not([multiple])[size="1"], .form-select.is-invalid:not([multiple]):not([size]), .form-select.is-invalid:not([multiple])[size="1"] {
padding-right: 4.125rem;
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='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"), url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
background-position: right 0.75rem center, center right 2.25rem;
background-size: 16px 12px, calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}
.was-validated .form-select:invalid:focus, .form-select.is-invalid:focus {
border-color: #dc3545;
box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.25);
}
.was-validated .form-check-input:invalid, .form-check-input.is-invalid {
border-color: #dc3545;
}
.was-validated .form-check-input:invalid:checked, .form-check-input.is-invalid:checked {
background-color: #dc3545;
}
.was-validated .form-check-input:invalid:focus, .form-check-input.is-invalid:focus {
box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.25);
}
.was-validated .form-check-input:invalid ~ .form-check-label, .form-check-input.is-invalid ~ .form-check-label {
color: #dc3545;
}
.was-validated .input-group .form-control:invalid, .input-group .form-control.is-invalid,
.was-validated .input-group .form-select:invalid,
.input-group .form-select.is-invalid {
z-index: 2;
}
.was-validated .input-group .form-control:invalid:focus, .input-group .form-control.is-invalid:focus,
.was-validated .input-group .form-select:invalid:focus,
.input-group .form-select.is-invalid:focus {
z-index: 3;
}
html body {
-webkit-text-size-adjust: 100%;
}
html:not(.admin), html.admin.fullscreen-preview {
}
html b, html strong {
font-weight: 700;
}
html .container {
max-width: var(--max-width);
}
#react-root > #wrapper > #content + footer {
margin-top: 2.5rem;
}
#react-root > #wrapper > #content > main:not(:has(> .container:first-child)) {
padding: 0 1.25rem;
}
.form-check .form-check-input {
height: 1.5rem;
margin-top: 0;
}
.form-check .form-check-label {
margin: 0;
font-weight: normal;
}
.form-check:not(.form-switch) {
padding-left: 2.125rem;
}
.form-check:not(.form-switch) .form-check-input {
margin-left: -2.125rem;
width: 1.5rem;
}
.form-check:not(.form-switch) .form-check-input.form-check-input--solid:checked {
background-image: none;
}
.form-check.form-switch {
padding-left: 3.625rem;
}
.form-check.form-switch .form-check-input {
margin-left: -3.625rem;
width: 3rem;
}
input[type=file][id] {
width: 0.1px;
height: 0.1px;
opacity: 0;
overflow: hidden;
position: absolute;
z-index: -1;
}
input[type=file][id]:focus + label {
cursor: pointer;
box-shadow: 0 0 0 0.2rem var(--secondary-shadow);
}
.btn {
display: inline-block;
font-weight: 400;
line-height: 1.5;
color: #212529;
text-align: center;
text-decoration: none;
vertical-align: middle;
cursor: pointer;
user-select: none;
background-color: transparent;
border: 1px solid transparent;
padding: 0.375rem 0.75rem;
font-size: 1rem;
border-radius: 0.015625rem 0rem 0.015625rem 0.015625rem;
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
.btn {
transition: none;
}
}
.btn:hover {
color: #212529;
}
.btn-check:focus + .btn, .btn:focus {
outline: 0;
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}
.btn:disabled, .btn.disabled, fieldset:disabled .btn {
pointer-events: none;
opacity: 0.65;
}
.btn-primary {
color: #fff;
background-color: #0d6efd;
border-color: #0d6efd;
}
.btn-primary:hover {
color: #fff;
background-color: rgb(4.3333333333%, 36.6666666667%, 84.3333333333%);
border-color: rgb(4.0784313725%, 34.5098039216%, 79.3725490196%);
}
.btn-check:focus + .btn-primary, .btn-primary:focus {
color: #fff;
background-color: rgb(4.3333333333%, 36.6666666667%, 84.3333333333%);
border-color: rgb(4.0784313725%, 34.5098039216%, 79.3725490196%);
box-shadow: 0 0 0 0.25rem rgba(19.3333333333%, 51.6666666667%, 99.3333333333%, 0.5);
}
.btn-check:checked + .btn-primary, .btn-check:active + .btn-primary, .btn-primary:active, .btn-primary.active, .show > .btn-primary.dropdown-toggle {
color: #fff;
background-color: rgb(4.0784313725%, 34.5098039216%, 79.3725490196%);
border-color: rgb(3.8235294118%, 32.3529411765%, 74.4117647059%);
}
.btn-check:checked + .btn-primary:focus, .btn-check:active + .btn-primary:focus, .btn-primary:active:focus, .btn-primary.active:focus, .show > .btn-primary.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(19.3333333333%, 51.6666666667%, 99.3333333333%, 0.5);
}
.btn-primary:disabled, .btn-primary.disabled {
color: #fff;
background-color: #0d6efd;
border-color: #0d6efd;
}
.btn-secondary {
color: #fff;
background-color: #6c757d;
border-color: #6c757d;
}
.btn-secondary:hover {
color: #fff;
background-color: rgb(36%, 39%, 41.6666666667%);
border-color: rgb(33.8823529412%, 36.7058823529%, 39.2156862745%);
}
.btn-check:focus + .btn-secondary, .btn-secondary:focus {
color: #fff;
background-color: rgb(36%, 39%, 41.6666666667%);
border-color: rgb(33.8823529412%, 36.7058823529%, 39.2156862745%);
box-shadow: 0 0 0 0.25rem rgba(51%, 54%, 56.6666666667%, 0.5);
}
.btn-check:checked + .btn-secondary, .btn-check:active + .btn-secondary, .btn-secondary:active, .btn-secondary.active, .show > .btn-secondary.dropdown-toggle {
color: #fff;
background-color: rgb(33.8823529412%, 36.7058823529%, 39.2156862745%);
border-color: rgb(31.7647058824%, 34.4117647059%, 36.7647058824%);
}
.btn-check:checked + .btn-secondary:focus, .btn-check:active + .btn-secondary:focus, .btn-secondary:active:focus, .btn-secondary.active:focus, .show > .btn-secondary.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(51%, 54%, 56.6666666667%, 0.5);
}
.btn-secondary:disabled, .btn-secondary.disabled {
color: #fff;
background-color: #6c757d;
border-color: #6c757d;
}
.btn-success {
color: #fff;
background-color: #198754;
border-color: #198754;
}
.btn-success:hover {
color: #fff;
background-color: rgb(8.3333333333%, 45%, 28%);
border-color: rgb(7.8431372549%, 42.3529411765%, 26.3529411765%);
}
.btn-check:focus + .btn-success, .btn-success:focus {
color: #fff;
background-color: rgb(8.3333333333%, 45%, 28%);
border-color: rgb(7.8431372549%, 42.3529411765%, 26.3529411765%);
box-shadow: 0 0 0 0.25rem rgba(23.3333333333%, 60%, 43%, 0.5);
}
.btn-check:checked + .btn-success, .btn-check:active + .btn-success, .btn-success:active, .btn-success.active, .show > .btn-success.dropdown-toggle {
color: #fff;
background-color: rgb(7.8431372549%, 42.3529411765%, 26.3529411765%);
border-color: rgb(7.3529411765%, 39.7058823529%, 24.7058823529%);
}
.btn-check:checked + .btn-success:focus, .btn-check:active + .btn-success:focus, .btn-success:active:focus, .btn-success.active:focus, .show > .btn-success.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(23.3333333333%, 60%, 43%, 0.5);
}
.btn-success:disabled, .btn-success.disabled {
color: #fff;
background-color: #198754;
border-color: #198754;
}
.btn-info {
color: #000;
background-color: #0dcaf0;
border-color: #0dcaf0;
}
.btn-info:hover {
color: #000;
background-color: rgb(19.3333333333%, 82.3333333333%, 95%);
border-color: rgb(14.5882352941%, 81.2941176471%, 94.7058823529%);
}
.btn-check:focus + .btn-info, .btn-info:focus {
color: #000;
background-color: rgb(19.3333333333%, 82.3333333333%, 95%);
border-color: rgb(14.5882352941%, 81.2941176471%, 94.7058823529%);
box-shadow: 0 0 0 0.25rem rgba(4.3333333333%, 67.3333333333%, 80%, 0.5);
}
.btn-check:checked + .btn-info, .btn-check:active + .btn-info, .btn-info:active, .btn-info.active, .show > .btn-info.dropdown-toggle {
color: #000;
background-color: rgb(24.0784313725%, 83.3725490196%, 95.2941176471%);
border-color: rgb(14.5882352941%, 81.2941176471%, 94.7058823529%);
}
.btn-check:checked + .btn-info:focus, .btn-check:active + .btn-info:focus, .btn-info:active:focus, .btn-info.active:focus, .show > .btn-info.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(4.3333333333%, 67.3333333333%, 80%, 0.5);
}
.btn-info:disabled, .btn-info.disabled {
color: #000;
background-color: #0dcaf0;
border-color: #0dcaf0;
}
.btn-warning {
color: #000;
background-color: #ffc107;
border-color: #ffc107;
}
.btn-warning:hover {
color: #000;
background-color: rgb(100%, 79.3333333333%, 17.3333333333%);
border-color: rgb(100%, 78.1176470588%, 12.4705882353%);
}
.btn-check:focus + .btn-warning, .btn-warning:focus {
color: #000;
background-color: rgb(100%, 79.3333333333%, 17.3333333333%);
border-color: rgb(100%, 78.1176470588%, 12.4705882353%);
box-shadow: 0 0 0 0.25rem rgba(85%, 64.3333333333%, 2.3333333333%, 0.5);
}
.btn-check:checked + .btn-warning, .btn-check:active + .btn-warning, .btn-warning:active, .btn-warning.active, .show > .btn-warning.dropdown-toggle {
color: #000;
background-color: rgb(100%, 80.5490196078%, 22.1960784314%);
border-color: rgb(100%, 78.1176470588%, 12.4705882353%);
}
.btn-check:checked + .btn-warning:focus, .btn-check:active + .btn-warning:focus, .btn-warning:active:focus, .btn-warning.active:focus, .show > .btn-warning.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(85%, 64.3333333333%, 2.3333333333%, 0.5);
}
.btn-warning:disabled, .btn-warning.disabled {
color: #000;
background-color: #ffc107;
border-color: #ffc107;
}
.btn-danger {
color: #fff;
background-color: #dc3545;
border-color: #dc3545;
}
.btn-danger:hover {
color: #fff;
background-color: rgb(73.3333333333%, 17.6666666667%, 23%);
border-color: rgb(69.0196078431%, 16.6274509804%, 21.6470588235%);
}
.btn-check:focus + .btn-danger, .btn-danger:focus {
color: #fff;
background-color: rgb(73.3333333333%, 17.6666666667%, 23%);
border-color: rgb(69.0196078431%, 16.6274509804%, 21.6470588235%);
box-shadow: 0 0 0 0.25rem rgba(88.3333333333%, 32.6666666667%, 38%, 0.5);
}
.btn-check:checked + .btn-danger, .btn-check:active + .btn-danger, .btn-danger:active, .btn-danger.active, .show > .btn-danger.dropdown-toggle {
color: #fff;
background-color: rgb(69.0196078431%, 16.6274509804%, 21.6470588235%);
border-color: rgb(64.7058823529%, 15.5882352941%, 20.2941176471%);
}
.btn-check:checked + .btn-danger:focus, .btn-check:active + .btn-danger:focus, .btn-danger:active:focus, .btn-danger.active:focus, .show > .btn-danger.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(88.3333333333%, 32.6666666667%, 38%, 0.5);
}
.btn-danger:disabled, .btn-danger.disabled {
color: #fff;
background-color: #dc3545;
border-color: #dc3545;
}
.btn-dark {
color: #fff;
background-color: #212529;
border-color: #212529;
}
.btn-dark:hover {
color: #fff;
background-color: rgb(11%, 12.3333333333%, 13.6666666667%);
border-color: rgb(10.3529411765%, 11.6078431373%, 12.862745098%);
}
.btn-check:focus + .btn-dark, .btn-dark:focus {
color: #fff;
background-color: rgb(11%, 12.3333333333%, 13.6666666667%);
border-color: rgb(10.3529411765%, 11.6078431373%, 12.862745098%);
box-shadow: 0 0 0 0.25rem rgba(26%, 27.3333333333%, 28.6666666667%, 0.5);
}
.btn-check:checked + .btn-dark, .btn-check:active + .btn-dark, .btn-dark:active, .btn-dark.active, .show > .btn-dark.dropdown-toggle {
color: #fff;
background-color: rgb(10.3529411765%, 11.6078431373%, 12.862745098%);
border-color: rgb(9.7058823529%, 10.8823529412%, 12.0588235294%);
}
.btn-check:checked + .btn-dark:focus, .btn-check:active + .btn-dark:focus, .btn-dark:active:focus, .btn-dark.active:focus, .show > .btn-dark.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(26%, 27.3333333333%, 28.6666666667%, 0.5);
}
.btn-dark:disabled, .btn-dark.disabled {
color: #fff;
background-color: #212529;
border-color: #212529;
}
.btn-outline-primary {
color: #0d6efd;
border-color: #0d6efd;
}
.btn-outline-primary:hover {
color: #fff;
background-color: #0d6efd;
border-color: #0d6efd;
}
.btn-check:focus + .btn-outline-primary, .btn-outline-primary:focus {
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.5);
}
.btn-check:checked + .btn-outline-primary, .btn-check:active + .btn-outline-primary, .btn-outline-primary:active, .btn-outline-primary.active, .btn-outline-primary.dropdown-toggle.show {
color: #fff;
background-color: #0d6efd;
border-color: #0d6efd;
}
.btn-check:checked + .btn-outline-primary:focus, .btn-check:active + .btn-outline-primary:focus, .btn-outline-primary:active:focus, .btn-outline-primary.active:focus, .btn-outline-primary.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.5);
}
.btn-outline-primary:disabled, .btn-outline-primary.disabled {
color: #0d6efd;
background-color: transparent;
}
.btn-outline-secondary {
color: #6c757d;
border-color: #6c757d;
}
.btn-outline-secondary:hover {
color: #fff;
background-color: #6c757d;
border-color: #6c757d;
}
.btn-check:focus + .btn-outline-secondary, .btn-outline-secondary:focus {
box-shadow: 0 0 0 0.25rem rgba(108, 117, 125, 0.5);
}
.btn-check:checked + .btn-outline-secondary, .btn-check:active + .btn-outline-secondary, .btn-outline-secondary:active, .btn-outline-secondary.active, .btn-outline-secondary.dropdown-toggle.show {
color: #fff;
background-color: #6c757d;
border-color: #6c757d;
}
.btn-check:checked + .btn-outline-secondary:focus, .btn-check:active + .btn-outline-secondary:focus, .btn-outline-secondary:active:focus, .btn-outline-secondary.active:focus, .btn-outline-secondary.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(108, 117, 125, 0.5);
}
.btn-outline-secondary:disabled, .btn-outline-secondary.disabled {
color: #6c757d;
background-color: transparent;
}
.btn-outline-success {
color: #198754;
border-color: #198754;
}
.btn-outline-success:hover {
color: #fff;
background-color: #198754;
border-color: #198754;
}
.btn-check:focus + .btn-outline-success, .btn-outline-success:focus {
box-shadow: 0 0 0 0.25rem rgba(25, 135, 84, 0.5);
}
.btn-check:checked + .btn-outline-success, .btn-check:active + .btn-outline-success, .btn-outline-success:active, .btn-outline-success.active, .btn-outline-success.dropdown-toggle.show {
color: #fff;
background-color: #198754;
border-color: #198754;
}
.btn-check:checked + .btn-outline-success:focus, .btn-check:active + .btn-outline-success:focus, .btn-outline-success:active:focus, .btn-outline-success.active:focus, .btn-outline-success.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(25, 135, 84, 0.5);
}
.btn-outline-success:disabled, .btn-outline-success.disabled {
color: #198754;
background-color: transparent;
}
.btn-outline-info {
color: #0dcaf0;
border-color: #0dcaf0;
}
.btn-outline-info:hover {
color: #000;
background-color: #0dcaf0;
border-color: #0dcaf0;
}
.btn-check:focus + .btn-outline-info, .btn-outline-info:focus {
box-shadow: 0 0 0 0.25rem rgba(13, 202, 240, 0.5);
}
.btn-check:checked + .btn-outline-info, .btn-check:active + .btn-outline-info, .btn-outline-info:active, .btn-outline-info.active, .btn-outline-info.dropdown-toggle.show {
color: #000;
background-color: #0dcaf0;
border-color: #0dcaf0;
}
.btn-check:checked + .btn-outline-info:focus, .btn-check:active + .btn-outline-info:focus, .btn-outline-info:active:focus, .btn-outline-info.active:focus, .btn-outline-info.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(13, 202, 240, 0.5);
}
.btn-outline-info:disabled, .btn-outline-info.disabled {
color: #0dcaf0;
background-color: transparent;
}
.btn-outline-warning {
color: #ffc107;
border-color: #ffc107;
}
.btn-outline-warning:hover {
color: #000;
background-color: #ffc107;
border-color: #ffc107;
}
.btn-check:focus + .btn-outline-warning, .btn-outline-warning:focus {
box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.5);
}
.btn-check:checked + .btn-outline-warning, .btn-check:active + .btn-outline-warning, .btn-outline-warning:active, .btn-outline-warning.active, .btn-outline-warning.dropdown-toggle.show {
color: #000;
background-color: #ffc107;
border-color: #ffc107;
}
.btn-check:checked + .btn-outline-warning:focus, .btn-check:active + .btn-outline-warning:focus, .btn-outline-warning:active:focus, .btn-outline-warning.active:focus, .btn-outline-warning.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.5);
}
.btn-outline-warning:disabled, .btn-outline-warning.disabled {
color: #ffc107;
background-color: transparent;
}
.btn-outline-danger {
color: #dc3545;
border-color: #dc3545;
}
.btn-outline-danger:hover {
color: #fff;
background-color: #dc3545;
border-color: #dc3545;
}
.btn-check:focus + .btn-outline-danger, .btn-outline-danger:focus {
box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.5);
}
.btn-check:checked + .btn-outline-danger, .btn-check:active + .btn-outline-danger, .btn-outline-danger:active, .btn-outline-danger.active, .btn-outline-danger.dropdown-toggle.show {
color: #fff;
background-color: #dc3545;
border-color: #dc3545;
}
.btn-check:checked + .btn-outline-danger:focus, .btn-check:active + .btn-outline-danger:focus, .btn-outline-danger:active:focus, .btn-outline-danger.active:focus, .btn-outline-danger.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.5);
}
.btn-outline-danger:disabled, .btn-outline-danger.disabled {
color: #dc3545;
background-color: transparent;
}
.btn-outline-dark {
color: #212529;
border-color: #212529;
}
.btn-outline-dark:hover {
color: #fff;
background-color: #212529;
border-color: #212529;
}
.btn-check:focus + .btn-outline-dark, .btn-outline-dark:focus {
box-shadow: 0 0 0 0.25rem rgba(33, 37, 41, 0.5);
}
.btn-check:checked + .btn-outline-dark, .btn-check:active + .btn-outline-dark, .btn-outline-dark:active, .btn-outline-dark.active, .btn-outline-dark.dropdown-toggle.show {
color: #fff;
background-color: #212529;
border-color: #212529;
}
.btn-check:checked + .btn-outline-dark:focus, .btn-check:active + .btn-outline-dark:focus, .btn-outline-dark:active:focus, .btn-outline-dark.active:focus, .btn-outline-dark.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(33, 37, 41, 0.5);
}
.btn-outline-dark:disabled, .btn-outline-dark.disabled {
color: #212529;
background-color: transparent;
}
.btn-link {
font-weight: 400;
color: #0d6efd;
text-decoration: underline;
}
.btn-link:hover {
color: rgb(4.0784313725%, 34.5098039216%, 79.3725490196%);
}
.btn-link:disabled, .btn-link.disabled {
color: #6c757d;
}
.btn-lg, .btn-group-lg > .btn {
padding: 0.5rem 1rem;
font-size: 1.25rem;
border-radius: 0.01875rem 0rem 0.01875rem 0.01875rem;
}
.btn-sm, .btn-group-sm > .btn {
padding: 0.25rem 0.5rem;
font-size: 0.875rem;
border-radius: 0.0125rem 0rem 0.0125rem 0.0125rem;
}
.btn-group,
.btn-group-vertical {
position: relative;
display: inline-flex;
vertical-align: middle;
}
.btn-group > .btn,
.btn-group-vertical > .btn {
position: relative;
flex: 1 1 auto;
}
.btn-group > .btn-check:checked + .btn,
.btn-group > .btn-check:focus + .btn,
.btn-group > .btn:hover,
.btn-group > .btn:focus,
.btn-group > .btn:active,
.btn-group > .btn.active,
.btn-group-vertical > .btn-check:checked + .btn,
.btn-group-vertical > .btn-check:focus + .btn,
.btn-group-vertical > .btn:hover,
.btn-group-vertical > .btn:focus,
.btn-group-vertical > .btn:active,
.btn-group-vertical > .btn.active {
z-index: 1;
}
.btn-toolbar {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
}
.btn-toolbar .input-group {
width: auto;
}
.btn-group {
border-radius: 0.015625rem 0.015625rem 0.015625rem 0.015625rem;
}
.btn-group > :not(.btn-check:first-child) + .btn,
.btn-group > .btn-group:not(:first-child) {
margin-left: calc(1px * -1);
}
.btn-group > .btn:not(:last-child):not(.dropdown-toggle),
.btn-group > .btn.dropdown-toggle-split:first-child,
.btn-group > .btn-group:not(:last-child) > .btn {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.btn-group > .btn:nth-child(n+3),
.btn-group > :not(.btn-check) + .btn,
.btn-group > .btn-group:not(:first-child) > .btn {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.dropdown-toggle-split {
padding-right: 0.5625rem;
padding-left: 0.5625rem;
}
.dropdown-toggle-split::after, .dropup .dropdown-toggle-split::after, .dropend .dropdown-toggle-split::after {
margin-left: 0;
}
.btn-sm + .dropdown-toggle-split, .btn-group-sm > .btn + .dropdown-toggle-split {
padding-right: 0.375rem;
padding-left: 0.375rem;
}
.btn-lg + .dropdown-toggle-split, .btn-group-lg > .btn + .dropdown-toggle-split {
padding-right: 0.75rem;
padding-left: 0.75rem;
}
.placeholder {
display: inline-block;
min-height: 1em;
vertical-align: middle;
cursor: wait;
background-color: currentColor;
opacity: 0.5;
}
.placeholder.btn::before {
display: inline-block;
content: "";
}
@keyframes placeholder-glow {
50% {
opacity: 0.2;
}
}
@keyframes placeholder-wave {
100% {
mask-position: -200% 0%;
}
}
:root {
--btn-min-height: var(--btn-md-min-height, 45);
--btn-padding: var(--btn-md-padding, 20);
--btn-font-size: var(--btn-md-font-size, 15);
--btn-font-weight: var(--btn-md-font-weight, 700);
--btn-border-radius: var(--btn-md-border-radius, 5);
--btn-icon: var(--btn-md-icon, 20);
--btn-gap: var(--btn-md-gap, 10);
}
.btn {
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
white-space: nowrap;
}
.btn.btn--wrapped {
white-space: normal;
}
.btn:disabled, .btn.disabled, .btn[inert] {
opacity: 0.5;
cursor: not-allowed;
}
.btn-xs, .btn--xs {
--btn-min-height: var(--btn-xs-min-height, 35);
--btn-padding: var(--btn-xs-padding, 10);
--btn-font-size: var(--btn-xs-font-size, 13);
--btn-font-weight: var(--btn-xs-font-weight, 400);
--btn-border-radius: var(--btn-xs-border-radius, 5);
--btn-icon: var(--btn-xs-icon, 10);
--btn-gap: var(--btn-xs-gap, 10);
}
.btn-sm, .btn--sm {
--btn-min-height: var(--btn-sm-min-height, 40);
--btn-padding: var(--btn-sm-padding, 20);
--btn-font-size: var(--btn-sm-font-size, 14);
--btn-font-weight: var(--btn-sm-font-weight, 700);
--btn-border-radius: var(--btn-sm-border-radius, 5);
--btn-icon: var(--btn-sm-icon, 16);
--btn-gap: var(--btn-sm-gap, 10);
}
.btn-md, .btn--md {
--btn-min-height: var(--btn-md-min-height, 45);
--btn-padding: var(--btn-md-padding, 20);
--btn-font-size: var(--btn-md-font-size, 15);
--btn-font-weight: var(--btn-md-font-weight, 700);
--btn-border-radius: var(--btn-md-border-radius, 5);
--btn-icon: var(--btn-md-icon, 20);
--btn-gap: var(--btn-md-gap, 10);
}
.btn-md.btn--close, .btn--md.btn--close {
width: var(--btn-md-min-height, 45);
height: var(--btn-md-min-height, 45);
}
.btn-lg, .btn--lg {
--btn-min-height: var(--btn-lg-min-height, 55);
--btn-padding: var(--btn-lg-padding, 25);
--btn-font-size: var(--btn-lg-font-size, 18);
--btn-font-weight: var(--btn-lg-font-weight, 700);
--btn-border-radius: var(--btn-lg-border-radius, 5);
--btn-icon: var(--btn-lg-icon, 22);
--btn-gap: var(--btn-lg-gap, 10);
}
.btn-xl, .btn--xl {
--btn-min-height: var(--btn-xl-min-height, 65);
--btn-padding: var(--btn-xl-padding, 25);
--btn-font-size: var(--btn-xl-font-size, 23);
--btn-font-weight: var(--btn-xl-font-weight, 700);
--btn-border-radius: var(--btn-xl-border-radius, 5);
--btn-icon: var(--btn-xl-icon, 24);
--btn-gap: var(--btn-xl-gap, 10);
}
a.btn {
display: inline-flex;
line-height: normal;
}
fieldset:disabled .btn {
opacity: 0.5;
}
.btn:where(.ui-btn) {
min-height: calc(1rem * var(--btn-min-height) / 16);
padding: 0 calc(1rem * var(--btn-padding) / 16);
font-size: calc(1rem * var(--btn-font-size) / 16);
font-weight: var(--btn-font-weight);
border-radius: calc(1rem * var(--btn-border-radius) / 16);
gap: calc(1rem * var(--btn-gap) / 16);
}
.btn:where(.ui-btn).btn--close {
width: calc(1rem * var(--btn-min-height) / 16);
height: calc(1rem * var(--btn-min-height) / 16);
padding: 0;
}
.btn:where(.ui-btn) > svg {
max-width: calc(1rem * var(--btn-icon) / 16);
height: calc(1rem * var(--btn-icon) / 16);
flex-shrink: 0;
}
.btn:where(.ui-btn) > :is(i, .ui-icon) {
flex-shrink: 0;
}
.btn:where(.ui-btn).btn-primary {
background-color: var(--primary);
border-color: var(--primary);
color: var(--primary-fg);
}
.btn:where(.ui-btn).btn-primary:hover {
background-color: var(--primary-hover);
border-color: var(--primary-hover-border);
color: var(--primary-fg);
}
.btn-check:focus + .btn:where(.ui-btn).btn-primary, .btn:where(.ui-btn).btn-primary:focus {
box-shadow: none;
}
.btn-check:focus-visible + .btn:where(.ui-btn).btn-primary, .btn:where(.ui-btn).btn-primary:focus-visible {
background-color: var(--primary-hover);
border-color: var(--primary-hover-border);
color: var(--primary-fg);
box-shadow: 0 0 0 0.25rem var(--primary-shadow);
}
.btn-check:checked + .btn:where(.ui-btn).btn-primary, .btn-check:active + .btn:where(.ui-btn).btn-primary, .btn:where(.ui-btn).btn-primary:active, .btn:where(.ui-btn).btn-primary.active, .show > .btn:where(.ui-btn).btn-primary.dropdown-toggle {
background-color: var(--primary-active);
border-color: var(--primary-active-border);
color: var(--primary-fg);
}
.btn-check:checked + .btn:where(.ui-btn).btn-primary:focus, .btn-check:active + .btn:where(.ui-btn).btn-primary:focus, .btn:where(.ui-btn).btn-primary:active:focus, .btn:where(.ui-btn).btn-primary.active:focus, .show > .btn:where(.ui-btn).btn-primary.dropdown-toggle:focus {
box-shadow: none;
}
.btn-check:checked + .btn:where(.ui-btn).btn-primary:focus-visible, .btn-check:active + .btn:where(.ui-btn).btn-primary:focus-visible, .btn:where(.ui-btn).btn-primary:active:focus-visible, .btn:where(.ui-btn).btn-primary.active:focus-visible, .show > .btn:where(.ui-btn).btn-primary.dropdown-toggle:focus-visible {
box-shadow: 0 0 0 0.25rem var(--primary-shadow);
}
.btn:where(.ui-btn).btn-primary:disabled, .btn:where(.ui-btn).btn-primary.disabled {
opacity: 0.5;
}
.btn:where(.ui-btn).btn-outline-primary {
border-color: var(--primary);
color: var(--primary);
}
.btn:where(.ui-btn).btn-outline-primary:hover {
background-color: var(--primary);
color: var(--primary-fg);
}
.btn-check:focus + .btn:where(.ui-btn).btn-outline-primary, .btn:where(.ui-btn).btn-outline-primary:focus {
box-shadow: none;
}
.btn-check:focus-visible + .btn:where(.ui-btn).btn-outline-primary, .btn:where(.ui-btn).btn-outline-primary:focus-visible {
box-shadow: 0 0 0 0.25rem var(--primary-shadow);
}
.btn-check:checked + .btn:where(.ui-btn).btn-outline-primary, .btn-check:active + .btn:where(.ui-btn).btn-outline-primary, .btn:where(.ui-btn).btn-outline-primary:active, .btn:where(.ui-btn).btn-outline-primary.active, .btn:where(.ui-btn).btn-outline-primary.dropdown-toggle.show {
background-color: var(--primary);
color: var(--primary-fg);
border-color: var(--primary);
}
.btn-check:checked + .btn:where(.ui-btn).btn-outline-primary:focus, .btn-check:active + .btn:where(.ui-btn).btn-outline-primary:focus, .btn:where(.ui-btn).btn-outline-primary:active:focus, .btn:where(.ui-btn).btn-outline-primary.active:focus, .btn:where(.ui-btn).btn-outline-primary.dropdown-toggle.show:focus {
box-shadow: none;
}
.btn-check:checked + .btn:where(.ui-btn).btn-outline-primary:focus-visible, .btn-check:active + .btn:where(.ui-btn).btn-outline-primary:focus-visible, .btn:where(.ui-btn).btn-outline-primary:active:focus-visible, .btn:where(.ui-btn).btn-outline-primary.active:focus-visible, .btn:where(.ui-btn).btn-outline-primary.dropdown-toggle.show:focus-visible {
box-shadow: 0 0 0 0.25rem var(--primary-shadow);
}
.btn:where(.ui-btn).btn-secondary {
background-color: var(--secondary);
border-color: var(--secondary);
color: var(--secondary-fg);
}
.btn:where(.ui-btn).btn-secondary:hover {
background-color: var(--secondary-hover);
border-color: var(--secondary-hover-border);
color: var(--secondary-fg);
}
.btn-check:focus + .btn:where(.ui-btn).btn-secondary, .btn:where(.ui-btn).btn-secondary:focus {
box-shadow: none;
}
.btn-check:focus-visible + .btn:where(.ui-btn).btn-secondary, .btn:where(.ui-btn).btn-secondary:focus-visible {
background-color: var(--secondary-hover);
border-color: var(--secondary-hover-border);
color: var(--secondary-fg);
box-shadow: 0 0 0 0.25rem var(--secondary-shadow);
}
.btn-check:checked + .btn:where(.ui-btn).btn-secondary, .btn-check:active + .btn:where(.ui-btn).btn-secondary, .btn:where(.ui-btn).btn-secondary:active, .btn:where(.ui-btn).btn-secondary.active, .show > .btn:where(.ui-btn).btn-secondary.dropdown-toggle {
background-color: var(--secondary-active);
border-color: var(--secondary-active-border);
color: var(--secondary-fg);
}
.btn-check:checked + .btn:where(.ui-btn).btn-secondary:focus, .btn-check:active + .btn:where(.ui-btn).btn-secondary:focus, .btn:where(.ui-btn).btn-secondary:active:focus, .btn:where(.ui-btn).btn-secondary.active:focus, .show > .btn:where(.ui-btn).btn-secondary.dropdown-toggle:focus {
box-shadow: none;
}
.btn-check:checked + .btn:where(.ui-btn).btn-secondary:focus-visible, .btn-check:active + .btn:where(.ui-btn).btn-secondary:focus-visible, .btn:where(.ui-btn).btn-secondary:active:focus-visible, .btn:where(.ui-btn).btn-secondary.active:focus-visible, .show > .btn:where(.ui-btn).btn-secondary.dropdown-toggle:focus-visible {
box-shadow: 0 0 0 0.25rem var(--secondary-shadow);
}
.btn:where(.ui-btn).btn-secondary:disabled, .btn:where(.ui-btn).btn-secondary.disabled {
opacity: 0.5;
}
.btn:where(.ui-btn).btn-outline-secondary {
border-color: var(--secondary);
color: var(--secondary);
}
.btn:where(.ui-btn).btn-outline-secondary:hover {
background-color: var(--secondary);
color: var(--secondary-fg);
}
.btn-check:focus + .btn:where(.ui-btn).btn-outline-secondary, .btn:where(.ui-btn).btn-outline-secondary:focus {
box-shadow: none;
}
.btn-check:focus-visible + .btn:where(.ui-btn).btn-outline-secondary, .btn:where(.ui-btn).btn-outline-secondary:focus-visible {
box-shadow: 0 0 0 0.25rem var(--secondary-shadow);
}
.btn-check:checked + .btn:where(.ui-btn).btn-outline-secondary, .btn-check:active + .btn:where(.ui-btn).btn-outline-secondary, .btn:where(.ui-btn).btn-outline-secondary:active, .btn:where(.ui-btn).btn-outline-secondary.active, .btn:where(.ui-btn).btn-outline-secondary.dropdown-toggle.show {
background-color: var(--secondary);
color: var(--secondary-fg);
border-color: var(--secondary);
}
.btn-check:checked + .btn:where(.ui-btn).btn-outline-secondary:focus, .btn-check:active + .btn:where(.ui-btn).btn-outline-secondary:focus, .btn:where(.ui-btn).btn-outline-secondary:active:focus, .btn:where(.ui-btn).btn-outline-secondary.active:focus, .btn:where(.ui-btn).btn-outline-secondary.dropdown-toggle.show:focus {
box-shadow: none;
}
.btn-check:checked + .btn:where(.ui-btn).btn-outline-secondary:focus-visible, .btn-check:active + .btn:where(.ui-btn).btn-outline-secondary:focus-visible, .btn:where(.ui-btn).btn-outline-secondary:active:focus-visible, .btn:where(.ui-btn).btn-outline-secondary.active:focus-visible, .btn:where(.ui-btn).btn-outline-secondary.dropdown-toggle.show:focus-visible {
box-shadow: 0 0 0 0.25rem var(--secondary-shadow);
}
.btn:where(.ui-btn).btn-success {
background-color: var(--success);
border-color: var(--success);
color: var(--success-fg);
}
.btn:where(.ui-btn).btn-success:hover {
background-color: var(--success-hover);
border-color: var(--success-hover-border);
color: var(--success-fg);
}
.btn-check:focus + .btn:where(.ui-btn).btn-success, .btn:where(.ui-btn).btn-success:focus {
box-shadow: none;
}
.btn-check:focus-visible + .btn:where(.ui-btn).btn-success, .btn:where(.ui-btn).btn-success:focus-visible {
background-color: var(--success-hover);
border-color: var(--success-hover-border);
color: var(--success-fg);
box-shadow: 0 0 0 0.25rem var(--success-shadow);
}
.btn-check:checked + .btn:where(.ui-btn).btn-success, .btn-check:active + .btn:where(.ui-btn).btn-success, .btn:where(.ui-btn).btn-success:active, .btn:where(.ui-btn).btn-success.active, .show > .btn:where(.ui-btn).btn-success.dropdown-toggle {
background-color: var(--success-active);
border-color: var(--success-active-border);
color: var(--success-fg);
}
.btn-check:checked + .btn:where(.ui-btn).btn-success:focus, .btn-check:active + .btn:where(.ui-btn).btn-success:focus, .btn:where(.ui-btn).btn-success:active:focus, .btn:where(.ui-btn).btn-success.active:focus, .show > .btn:where(.ui-btn).btn-success.dropdown-toggle:focus {
box-shadow: none;
}
.btn-check:checked + .btn:where(.ui-btn).btn-success:focus-visible, .btn-check:active + .btn:where(.ui-btn).btn-success:focus-visible, .btn:where(.ui-btn).btn-success:active:focus-visible, .btn:where(.ui-btn).btn-success.active:focus-visible, .show > .btn:where(.ui-btn).btn-success.dropdown-toggle:focus-visible {
box-shadow: 0 0 0 0.25rem var(--success-shadow);
}
.btn:where(.ui-btn).btn-success:disabled, .btn:where(.ui-btn).btn-success.disabled {
opacity: 0.5;
}
.btn:where(.ui-btn).btn-outline-success {
border-color: var(--success);
color: var(--success);
}
.btn:where(.ui-btn).btn-outline-success:hover {
background-color: var(--success);
color: var(--success-fg);
}
.btn-check:focus + .btn:where(.ui-btn).btn-outline-success, .btn:where(.ui-btn).btn-outline-success:focus {
box-shadow: none;
}
.btn-check:focus-visible + .btn:where(.ui-btn).btn-outline-success, .btn:where(.ui-btn).btn-outline-success:focus-visible {
box-shadow: 0 0 0 0.25rem var(--success-shadow);
}
.btn-check:checked + .btn:where(.ui-btn).btn-outline-success, .btn-check:active + .btn:where(.ui-btn).btn-outline-success, .btn:where(.ui-btn).btn-outline-success:active, .btn:where(.ui-btn).btn-outline-success.active, .btn:where(.ui-btn).btn-outline-success.dropdown-toggle.show {
background-color: var(--success);
color: var(--success-fg);
border-color: var(--success);
}
.btn-check:checked + .btn:where(.ui-btn).btn-outline-success:focus, .btn-check:active + .btn:where(.ui-btn).btn-outline-success:focus, .btn:where(.ui-btn).btn-outline-success:active:focus, .btn:where(.ui-btn).btn-outline-success.active:focus, .btn:where(.ui-btn).btn-outline-success.dropdown-toggle.show:focus {
box-shadow: none;
}
.btn-check:checked + .btn:where(.ui-btn).btn-outline-success:focus-visible, .btn-check:active + .btn:where(.ui-btn).btn-outline-success:focus-visible, .btn:where(.ui-btn).btn-outline-success:active:focus-visible, .btn:where(.ui-btn).btn-outline-success.active:focus-visible, .btn:where(.ui-btn).btn-outline-success.dropdown-toggle.show:focus-visible {
box-shadow: 0 0 0 0.25rem var(--success-shadow);
}
.btn:where(.ui-btn).btn-danger {
background-color: var(--danger);
border-color: var(--danger);
color: var(--danger-fg);
}
.btn:where(.ui-btn).btn-danger:hover {
background-color: var(--danger-hover);
border-color: var(--danger-hover-border);
color: var(--danger-fg);
}
.btn-check:focus + .btn:where(.ui-btn).btn-danger, .btn:where(.ui-btn).btn-danger:focus {
box-shadow: none;
}
.btn-check:focus-visible + .btn:where(.ui-btn).btn-danger, .btn:where(.ui-btn).btn-danger:focus-visible {
background-color: var(--danger-hover);
border-color: var(--danger-hover-border);
color: var(--danger-fg);
box-shadow: 0 0 0 0.25rem var(--danger-shadow);
}
.btn-check:checked + .btn:where(.ui-btn).btn-danger, .btn-check:active + .btn:where(.ui-btn).btn-danger, .btn:where(.ui-btn).btn-danger:active, .btn:where(.ui-btn).btn-danger.active, .show > .btn:where(.ui-btn).btn-danger.dropdown-toggle {
background-color: var(--danger-active);
border-color: var(--danger-active-border);
color: var(--danger-fg);
}
.btn-check:checked + .btn:where(.ui-btn).btn-danger:focus, .btn-check:active + .btn:where(.ui-btn).btn-danger:focus, .btn:where(.ui-btn).btn-danger:active:focus, .btn:where(.ui-btn).btn-danger.active:focus, .show > .btn:where(.ui-btn).btn-danger.dropdown-toggle:focus {
box-shadow: none;
}
.btn-check:checked + .btn:where(.ui-btn).btn-danger:focus-visible, .btn-check:active + .btn:where(.ui-btn).btn-danger:focus-visible, .btn:where(.ui-btn).btn-danger:active:focus-visible, .btn:where(.ui-btn).btn-danger.active:focus-visible, .show > .btn:where(.ui-btn).btn-danger.dropdown-toggle:focus-visible {
box-shadow: 0 0 0 0.25rem var(--danger-shadow);
}
.btn:where(.ui-btn).btn-danger:disabled, .btn:where(.ui-btn).btn-danger.disabled {
opacity: 0.5;
}
.btn:where(.ui-btn).btn-outline-danger {
border-color: var(--danger);
color: var(--danger);
}
.btn:where(.ui-btn).btn-outline-danger:hover {
background-color: var(--danger);
color: var(--danger-fg);
}
.btn-check:focus + .btn:where(.ui-btn).btn-outline-danger, .btn:where(.ui-btn).btn-outline-danger:focus {
box-shadow: none;
}
.btn-check:focus-visible + .btn:where(.ui-btn).btn-outline-danger, .btn:where(.ui-btn).btn-outline-danger:focus-visible {
box-shadow: 0 0 0 0.25rem var(--danger-shadow);
}
.btn-check:checked + .btn:where(.ui-btn).btn-outline-danger, .btn-check:active + .btn:where(.ui-btn).btn-outline-danger, .btn:where(.ui-btn).btn-outline-danger:active, .btn:where(.ui-btn).btn-outline-danger.active, .btn:where(.ui-btn).btn-outline-danger.dropdown-toggle.show {
background-color: var(--danger);
color: var(--danger-fg);
border-color: var(--danger);
}
.btn-check:checked + .btn:where(.ui-btn).btn-outline-danger:focus, .btn-check:active + .btn:where(.ui-btn).btn-outline-danger:focus, .btn:where(.ui-btn).btn-outline-danger:active:focus, .btn:where(.ui-btn).btn-outline-danger.active:focus, .btn:where(.ui-btn).btn-outline-danger.dropdown-toggle.show:focus {
box-shadow: none;
}
.btn-check:checked + .btn:where(.ui-btn).btn-outline-danger:focus-visible, .btn-check:active + .btn:where(.ui-btn).btn-outline-danger:focus-visible, .btn:where(.ui-btn).btn-outline-danger:active:focus-visible, .btn:where(.ui-btn).btn-outline-danger.active:focus-visible, .btn:where(.ui-btn).btn-outline-danger.dropdown-toggle.show:focus-visible {
box-shadow: 0 0 0 0.25rem var(--danger-shadow);
}
.btn:where(.ui-btn).btn-warning {
background-color: var(--warning);
border-color: var(--warning);
color: var(--warning-fg);
}
.btn:where(.ui-btn).btn-warning:hover {
background-color: var(--warning-hover);
border-color: var(--warning-hover-border);
color: var(--warning-fg);
}
.btn-check:focus + .btn:where(.ui-btn).btn-warning, .btn:where(.ui-btn).btn-warning:focus {
box-shadow: none;
}
.btn-check:focus-visible + .btn:where(.ui-btn).btn-warning, .btn:where(.ui-btn).btn-warning:focus-visible {
background-color: var(--warning-hover);
border-color: var(--warning-hover-border);
color: var(--warning-fg);
box-shadow: 0 0 0 0.25rem var(--warning-shadow);
}
.btn-check:checked + .btn:where(.ui-btn).btn-warning, .btn-check:active + .btn:where(.ui-btn).btn-warning, .btn:where(.ui-btn).btn-warning:active, .btn:where(.ui-btn).btn-warning.active, .show > .btn:where(.ui-btn).btn-warning.dropdown-toggle {
background-color: var(--warning-active);
border-color: var(--warning-active-border);
color: var(--warning-fg);
}
.btn-check:checked + .btn:where(.ui-btn).btn-warning:focus, .btn-check:active + .btn:where(.ui-btn).btn-warning:focus, .btn:where(.ui-btn).btn-warning:active:focus, .btn:where(.ui-btn).btn-warning.active:focus, .show > .btn:where(.ui-btn).btn-warning.dropdown-toggle:focus {
box-shadow: none;
}
.btn-check:checked + .btn:where(.ui-btn).btn-warning:focus-visible, .btn-check:active + .btn:where(.ui-btn).btn-warning:focus-visible, .btn:where(.ui-btn).btn-warning:active:focus-visible, .btn:where(.ui-btn).btn-warning.active:focus-visible, .show > .btn:where(.ui-btn).btn-warning.dropdown-toggle:focus-visible {
box-shadow: 0 0 0 0.25rem var(--warning-shadow);
}
.btn:where(.ui-btn).btn-warning:disabled, .btn:where(.ui-btn).btn-warning.disabled {
opacity: 0.5;
}
.btn:where(.ui-btn).btn-outline-warning {
border-color: var(--warning);
color: var(--warning);
}
.btn:where(.ui-btn).btn-outline-warning:hover {
background-color: var(--warning);
color: var(--warning-fg);
}
.btn-check:focus + .btn:where(.ui-btn).btn-outline-warning, .btn:where(.ui-btn).btn-outline-warning:focus {
box-shadow: none;
}
.btn-check:focus-visible + .btn:where(.ui-btn).btn-outline-warning, .btn:where(.ui-btn).btn-outline-warning:focus-visible {
box-shadow: 0 0 0 0.25rem var(--warning-shadow);
}
.btn-check:checked + .btn:where(.ui-btn).btn-outline-warning, .btn-check:active + .btn:where(.ui-btn).btn-outline-warning, .btn:where(.ui-btn).btn-outline-warning:active, .btn:where(.ui-btn).btn-outline-warning.active, .btn:where(.ui-btn).btn-outline-warning.dropdown-toggle.show {
background-color: var(--warning);
color: var(--warning-fg);
border-color: var(--warning);
}
.btn-check:checked + .btn:where(.ui-btn).btn-outline-warning:focus, .btn-check:active + .btn:where(.ui-btn).btn-outline-warning:focus, .btn:where(.ui-btn).btn-outline-warning:active:focus, .btn:where(.ui-btn).btn-outline-warning.active:focus, .btn:where(.ui-btn).btn-outline-warning.dropdown-toggle.show:focus {
box-shadow: none;
}
.btn-check:checked + .btn:where(.ui-btn).btn-outline-warning:focus-visible, .btn-check:active + .btn:where(.ui-btn).btn-outline-warning:focus-visible, .btn:where(.ui-btn).btn-outline-warning:active:focus-visible, .btn:where(.ui-btn).btn-outline-warning.active:focus-visible, .btn:where(.ui-btn).btn-outline-warning.dropdown-toggle.show:focus-visible {
box-shadow: 0 0 0 0.25rem var(--warning-shadow);
}
.btn:where(.ui-btn).btn-info {
background-color: var(--info);
border-color: var(--info);
color: var(--info-fg);
}
.btn:where(.ui-btn).btn-info:hover {
background-color: var(--info-hover);
border-color: var(--info-hover-border);
color: var(--info-fg);
}
.btn-check:focus + .btn:where(.ui-btn).btn-info, .btn:where(.ui-btn).btn-info:focus {
box-shadow: none;
}
.btn-check:focus-visible + .btn:where(.ui-btn).btn-info, .btn:where(.ui-btn).btn-info:focus-visible {
background-color: var(--info-hover);
border-color: var(--info-hover-border);
color: var(--info-fg);
box-shadow: 0 0 0 0.25rem var(--info-shadow);
}
.btn-check:checked + .btn:where(.ui-btn).btn-info, .btn-check:active + .btn:where(.ui-btn).btn-info, .btn:where(.ui-btn).btn-info:active, .btn:where(.ui-btn).btn-info.active, .show > .btn:where(.ui-btn).btn-info.dropdown-toggle {
background-color: var(--info-active);
border-color: var(--info-active-border);
color: var(--info-fg);
}
.btn-check:checked + .btn:where(.ui-btn).btn-info:focus, .btn-check:active + .btn:where(.ui-btn).btn-info:focus, .btn:where(.ui-btn).btn-info:active:focus, .btn:where(.ui-btn).btn-info.active:focus, .show > .btn:where(.ui-btn).btn-info.dropdown-toggle:focus {
box-shadow: none;
}
.btn-check:checked + .btn:where(.ui-btn).btn-info:focus-visible, .btn-check:active + .btn:where(.ui-btn).btn-info:focus-visible, .btn:where(.ui-btn).btn-info:active:focus-visible, .btn:where(.ui-btn).btn-info.active:focus-visible, .show > .btn:where(.ui-btn).btn-info.dropdown-toggle:focus-visible {
box-shadow: 0 0 0 0.25rem var(--info-shadow);
}
.btn:where(.ui-btn).btn-info:disabled, .btn:where(.ui-btn).btn-info.disabled {
opacity: 0.5;
}
.btn:where(.ui-btn).btn-outline-info {
border-color: var(--info);
color: var(--info);
}
.btn:where(.ui-btn).btn-outline-info:hover {
background-color: var(--info);
color: var(--info-fg);
}
.btn-check:focus + .btn:where(.ui-btn).btn-outline-info, .btn:where(.ui-btn).btn-outline-info:focus {
box-shadow: none;
}
.btn-check:focus-visible + .btn:where(.ui-btn).btn-outline-info, .btn:where(.ui-btn).btn-outline-info:focus-visible {
box-shadow: 0 0 0 0.25rem var(--info-shadow);
}
.btn-check:checked + .btn:where(.ui-btn).btn-outline-info, .btn-check:active + .btn:where(.ui-btn).btn-outline-info, .btn:where(.ui-btn).btn-outline-info:active, .btn:where(.ui-btn).btn-outline-info.active, .btn:where(.ui-btn).btn-outline-info.dropdown-toggle.show {
background-color: var(--info);
color: var(--info-fg);
border-color: var(--info);
}
.btn-check:checked + .btn:where(.ui-btn).btn-outline-info:focus, .btn-check:active + .btn:where(.ui-btn).btn-outline-info:focus, .btn:where(.ui-btn).btn-outline-info:active:focus, .btn:where(.ui-btn).btn-outline-info.active:focus, .btn:where(.ui-btn).btn-outline-info.dropdown-toggle.show:focus {
box-shadow: none;
}
.btn-check:checked + .btn:where(.ui-btn).btn-outline-info:focus-visible, .btn-check:active + .btn:where(.ui-btn).btn-outline-info:focus-visible, .btn:where(.ui-btn).btn-outline-info:active:focus-visible, .btn:where(.ui-btn).btn-outline-info.active:focus-visible, .btn:where(.ui-btn).btn-outline-info.dropdown-toggle.show:focus-visible {
box-shadow: 0 0 0 0.25rem var(--info-shadow);
}
.btn:where(.ui-btn).btn-dark {
background-color: var(--dark);
border-color: var(--dark);
color: var(--dark-fg);
}
.btn:where(.ui-btn).btn-dark:hover {
background-color: var(--dark-hover);
border-color: var(--dark-hover-border);
color: var(--dark-fg);
}
.btn-check:focus + .btn:where(.ui-btn).btn-dark, .btn:where(.ui-btn).btn-dark:focus {
box-shadow: none;
}
.btn-check:focus-visible + .btn:where(.ui-btn).btn-dark, .btn:where(.ui-btn).btn-dark:focus-visible {
background-color: var(--dark-hover);
border-color: var(--dark-hover-border);
color: var(--dark-fg);
box-shadow: 0 0 0 0.25rem var(--dark-shadow);
}
.btn-check:checked + .btn:where(.ui-btn).btn-dark, .btn-check:active + .btn:where(.ui-btn).btn-dark, .btn:where(.ui-btn).btn-dark:active, .btn:where(.ui-btn).btn-dark.active, .show > .btn:where(.ui-btn).btn-dark.dropdown-toggle {
background-color: var(--dark-active);
border-color: var(--dark-active-border);
color: var(--dark-fg);
}
.btn-check:checked + .btn:where(.ui-btn).btn-dark:focus, .btn-check:active + .btn:where(.ui-btn).btn-dark:focus, .btn:where(.ui-btn).btn-dark:active:focus, .btn:where(.ui-btn).btn-dark.active:focus, .show > .btn:where(.ui-btn).btn-dark.dropdown-toggle:focus {
box-shadow: none;
}
.btn-check:checked + .btn:where(.ui-btn).btn-dark:focus-visible, .btn-check:active + .btn:where(.ui-btn).btn-dark:focus-visible, .btn:where(.ui-btn).btn-dark:active:focus-visible, .btn:where(.ui-btn).btn-dark.active:focus-visible, .show > .btn:where(.ui-btn).btn-dark.dropdown-toggle:focus-visible {
box-shadow: 0 0 0 0.25rem var(--dark-shadow);
}
.btn:where(.ui-btn).btn-dark:disabled, .btn:where(.ui-btn).btn-dark.disabled {
opacity: 0.5;
}
.btn:where(.ui-btn).btn-outline-dark {
border-color: var(--dark);
color: var(--dark);
}
.btn:where(.ui-btn).btn-outline-dark:hover {
background-color: var(--dark);
color: var(--dark-fg);
}
.btn-check:focus + .btn:where(.ui-btn).btn-outline-dark, .btn:where(.ui-btn).btn-outline-dark:focus {
box-shadow: none;
}
.btn-check:focus-visible + .btn:where(.ui-btn).btn-outline-dark, .btn:where(.ui-btn).btn-outline-dark:focus-visible {
box-shadow: 0 0 0 0.25rem var(--dark-shadow);
}
.btn-check:checked + .btn:where(.ui-btn).btn-outline-dark, .btn-check:active + .btn:where(.ui-btn).btn-outline-dark, .btn:where(.ui-btn).btn-outline-dark:active, .btn:where(.ui-btn).btn-outline-dark.active, .btn:where(.ui-btn).btn-outline-dark.dropdown-toggle.show {
background-color: var(--dark);
color: var(--dark-fg);
border-color: var(--dark);
}
.btn-check:checked + .btn:where(.ui-btn).btn-outline-dark:focus, .btn-check:active + .btn:where(.ui-btn).btn-outline-dark:focus, .btn:where(.ui-btn).btn-outline-dark:active:focus, .btn:where(.ui-btn).btn-outline-dark.active:focus, .btn:where(.ui-btn).btn-outline-dark.dropdown-toggle.show:focus {
box-shadow: none;
}
.btn-check:checked + .btn:where(.ui-btn).btn-outline-dark:focus-visible, .btn-check:active + .btn:where(.ui-btn).btn-outline-dark:focus-visible, .btn:where(.ui-btn).btn-outline-dark:active:focus-visible, .btn:where(.ui-btn).btn-outline-dark.active:focus-visible, .btn:where(.ui-btn).btn-outline-dark.dropdown-toggle.show:focus-visible {
box-shadow: 0 0 0 0.25rem var(--dark-shadow);
}
.btn:where(.ui-btn).btn-link {
--btn-min-height: 0;
--btn-padding: 0;
--btn-font-weight: normal;
--btn-border-radius: 0;
text-decoration: none;
color: var(--ui-link-color, var(--primary));
font-size: calc(1rem * var(--btn-font-size) / 16) !important;
}
.btn:where(.ui-btn).btn-link:focus {
box-shadow: none;
}
.btn:where(.ui-btn).btn-link:focus-visible {
outline: 1px dotted currentColor;
}
.btn:where(.ui-btn).btn-link:not(:has(*)), .btn:where(.ui-btn).btn-link:has(> :last-child:nth-child(1)) {
text-decoration: var(--ui-link-text-decoration, none);
}
.btn:where(.ui-btn).btn-link:not(:has(*)):hover, .btn:where(.ui-btn).btn-link:has(> :last-child:nth-child(1)):hover {
text-decoration: var(--ui-link-text-decoration-hover, underline);
color: var(--ui-link-hover, var(--primary-hover));
}
.btn:where(.ui-btn).btn-link:has(:nth-child(2)):not(:has(span)) {
text-decoration: var(--ui-link-text-decoration, none);
}
.btn:where(.ui-btn).btn-link:has(:nth-child(2)):not(:has(span)):hover {
text-decoration: var(--ui-link-text-decoration-hover, underline);
color: var(--ui-link-hover, var(--primary-hover));
}
.btn:where(.ui-btn).btn-link:has(:nth-child(2)):has(span) {
text-decoration: none;
}
.btn:where(.ui-btn).btn-link:has(:nth-child(2)):has(span) > span {
text-decoration: var(--ui-link-text-decoration, none);
}
.btn:where(.ui-btn).btn-link:has(:nth-child(2)):has(span):hover > span {
text-decoration: var(--ui-link-text-decoration-hover, underline);
color: var(--ui-link-hover, var(--primary-hover));
}
:root {
--page-scroll-y: 0px;
--primary-light: var(--primary);
--secondary-light: var(--secondary);
--success-light: var(--success);
--danger-light: var(--danger);
--warning-light: var(--warning);
--info-light: var(--info);
--light-fg: #212529;
--grey-light: #f2f2f2;
--grey-mid: #999;
--grey-dark: #444;
--site-width: 72rem;
--site-gutter: 1.5rem;
}
@media (max-width: 575.98px) {
:root {
--site-gutter: 1rem;
}
}
@supports (color: rgb(from red r g b)) {
:root {
--light-opacity: 0.125;
--primary-light: rgb(from var(--primary) r g b / var(--light-opacity));
--secondary-light: rgb(from var(--secondary) r g b / var(--light-opacity));
--success-light: rgb(from var(--success) r g b / var(--light-opacity));
--danger-light: rgb(from var(--danger) r g b / var(--light-opacity));
--warning-light: rgb(from var(--warning) r g b / var(--light-opacity));
--info-light: rgb(from var(--info) r g b / var(--light-opacity));
}
}
#react-view, #react-root, #content-root, #content-page, #react-loading {
height: 100%;
width: 100%;
margin: 0;
touch-action: manipulation;
}
#react-root {
height: auto;
min-height: 100%;
}
#react-root > #wrapper {
min-height: 100vh;
}
:where(.site-content) > :where(:not(.ui-component--full-width, .template-slot)) {
box-sizing: border-box;
max-width: calc(var(--site-width, 72rem) + 2 * var(--site-gutter, 1.5rem));
margin-inline: auto;
padding-inline: var(--site-gutter, 1.5rem);
}
html:not(:has(body.mce-content-body)) {
height: 100%;
width: 100%;
margin: 0;
touch-action: manipulation;
overflow-x: hidden;
}
html:not(:has(body.mce-content-body)) body, html:not(:has(body.mce-content-body)) #react-view, html:not(:has(body.mce-content-body)) #react-root, html:not(:has(body.mce-content-body)) #content-root, html:not(:has(body.mce-content-body)) #content-page, html:not(:has(body.mce-content-body)) #react-loading {
font-family: var(--font);
}
html:not(:has(body.mce-content-body)) body {
height: 100%;
width: 100%;
margin: 0;
touch-action: manipulation;
-webkit-text-size-adjust: 100%;
}
html > body {
color: var(--site-fg, #000);
background: var(--site-bg, #fff);
}
.loader {
position: absolute;
display: inline-block;
border: 4px solid #eeeeee;
border-radius: 50%;
border-top: 4px solid white;
width: 60px;
height: 60px;
margin-left: -30px;
margin-top: -30px;
-webkit-animation: spin 2s linear infinite;
animation: spin 2s linear infinite;
}
#react-loading {
position: absolute;
top: 0;
}
#react-loading-message {
color: white;
text-align: center;
font-size: 2em;
position: absolute;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
}
.order-1 {
order: 1 !important;
}
.order-2 {
order: 2 !important;
}
.order-4 {
order: 4 !important;
}
.m-1 {
margin: 0.25rem !important;
}
.m-2 {
margin: 0.5rem !important;
}
.m-4 {
margin: 1.5rem !important;
}
.my-1 {
margin-top: 0.25rem !important;
margin-bottom: 0.25rem !important;
}
.my-2 {
margin-top: 0.5rem !important;
margin-bottom: 0.5rem !important;
}
.my-4 {
margin-top: 1.5rem !important;
margin-bottom: 1.5rem !important;
}
.me-1 {
margin-right: 0.25rem !important;
}
.me-2 {
margin-right: 0.5rem !important;
}
.me-4 {
margin-right: 1.5rem !important;
}
.mb-3 {
margin-bottom: 1rem !important;
}
.p-1 {
padding: 0.25rem !important;
}
.p-2 {
padding: 0.5rem !important;
}
.p-4 {
padding: 1.5rem !important;
}
.px-1 {
padding-right: 0.25rem !important;
padding-left: 0.25rem !important;
}
.px-2 {
padding-right: 0.5rem !important;
padding-left: 0.5rem !important;
}
.px-4 {
padding-right: 1.5rem !important;
padding-left: 1.5rem !important;
}
.text-white {
--bs-text-opacity: 1;
color: rgba(var(--bs-white-rgb), var(--bs-text-opacity)) !important;
}
.rounded {
border-radius: 0.25rem !important;
}
.rounded-1 {
border-radius: 0.2rem !important;
}
.rounded-2 {
border-radius: 0.25rem !important;
}
.visible {
visibility: visible !important;
}
@font-face {
font-family: "Minimo";
font-weight: 400;
font-style: normal;
font-display: swap;
src: url("/pack/static/fourroads/static/fonts/minimo-regular.woff2") format("woff2");
}
@font-face {
font-family: "Minimo";
font-weight: 700;
font-style: normal;
font-display: swap;
src: url("/pack/static/fourroads/static/fonts/minimo-bold.woff2") format("woff2");
}
@font-face {
font-family: "Pathways Script";
font-weight: 400;
font-style: normal;
font-display: swap;
src: url("/pack/static/fourroads/static/fonts/pathways-script.woff2") format("woff2");
}
:root {
--fr-page: #f6f6f6;
--fr-surface: #ffffff;
--fr-ink: #071d2b;
--fr-text: #000000;
--fr-accent: #44af91;
--fr-accent-ink: #2a7a63;
--fr-accent-wash: #edf7f4;
--fr-bg: var(--fr-page);
--fr-fg: var(--fr-text);
--fr-accent-on-bg: var(--fr-accent-ink);
--fr-gutter: 80px;
--fr-measure: 1120px;
--fr-space-1: 8px;
--fr-space-2: 16px;
--fr-space-3: 24px;
--fr-space-4: 40px;
--fr-space-5: 64px;
--fr-space-6: 96px;
--fr-space-7: 140px;
--fr-radius: 12px;
--fr-radius-sm: 6px;
--fr-display: "Pathways Script", "Minimo", "Helvetica Neue", Arial, sans-serif;
--fr-body: "Minimo", Roboto, "Helvetica Neue", Arial, sans-serif;
--fr-display-xl: clamp(40px, 5vw, 64px);
--fr-display-lg: clamp(32px, 3.6vw, 46px);
--fr-display-md: clamp(26px, 2.6vw, 34px);
--fr-body-size: 16px;
--fr-body-line: 1.6;
--fr-small: 14px;
}
:root[data-theme] {
--font: var(--fr-body);
--title-font: var(--fr-display);
--primary: var(--fr-accent-ink);
--primary-fg: #ffffff;
--primary-hover: #226450;
--primary-hover-border: #226450;
--primary-active: #1b5243;
--primary-active-border: #1b5243;
--primary-shadow: rgba(42, 122, 99, .35);
--btn-border-radius: 0;
}
.fr-site {
background: var(--fr-page);
}
.fr-section {
background: transparent;
color: var(--fr-fg);
padding-block: var(--fr-space-6);
}
.fr-section--ink, .fr-section--surface {
background: var(--fr-bg);
}
.fr-section--ink {
--fr-bg: var(--fr-ink);
--fr-fg: #ffffff;
--fr-accent-on-bg: var(--fr-accent);
}
.fr-section--surface {
--fr-bg: var(--fr-surface);
}
.fr-section--tight {
padding-block: var(--fr-space-5);
}
.fr-hold {
max-width: calc(var(--fr-measure) + var(--fr-gutter) * 2);
margin-inline: auto;
padding-inline: var(--fr-gutter);
}
@media (max-width: 767px) {
.fr-hold {
--fr-gutter: 24px;
}
}
.fr-display {
font-family: var(--fr-display);
font-weight: 400;
text-transform: none;
line-height: 1.02;
letter-spacing: 0.01em;
margin: 0;
}
.fr-display em {
font-style: normal;
color: var(--fr-accent-on-bg);
}
.fr-display--xl {
font-size: var(--fr-display-xl);
}
.fr-display--lg {
font-size: var(--fr-display-lg);
}
.fr-display--md {
font-size: var(--fr-display-md);
}
.fr-eyebrow {
font-family: var(--fr-body);
font-size: var(--fr-small);
color: var(--fr-accent-on-bg);
margin: 0 0 var(--fr-space-2);
}
.fr-prose {
font-family: var(--fr-body);
font-size: var(--fr-body-size);
line-height: var(--fr-body-line);
max-width: 58ch;
}
.fr-prose p {
margin: 0 0 var(--fr-space-3);
}
.fr-prose p:last-child {
margin-bottom: 0;
}
.fr-button {
display: inline-block;
font-family: var(--fr-body);
font-weight: 700;
font-size: var(--fr-small);
padding: 12px 22px;
border: 1px solid currentColor;
color: var(--fr-accent-on-bg);
background: var(--fr-bg);
text-decoration: none;
cursor: pointer;
transition: background-color 0.15s ease, color 0.15s ease;
}
.fr-button:hover, .fr-button:focus-visible {
background: var(--fr-accent-on-bg);
color: var(--fr-bg);
}
.fr-pill {
display: inline-block;
font-family: var(--fr-body);
font-size: 12px;
line-height: 1;
padding: 8px 14px;
border-radius: 999px;
background: var(--fr-accent-wash);
color: #17402f;
white-space: nowrap;
}
body {
background: var(--fr-page);
color: var(--fr-text);
font-family: var(--fr-body);
font-size: var(--fr-body-size);
line-height: var(--fr-body-line);
}
.fr-hero--centred .fr-eyebrow,
.fr-hero--centred .fr-hero__heading {
width: fit-content;
margin-inline: auto;
}
.fr-hero--centred .fr-eyebrow,
.fr-hero--centred .fr-hero__heading,
.fr-hero--centred .fr-hero__intro,
.fr-section-head__text,
.fr-text-image__text > * {
position: relative;
}
.fr-hero--centred .fr-eyebrow::before,
.fr-hero--centred .fr-hero__heading::before,
.fr-hero--centred .fr-hero__intro::before,
.fr-section-head__text::before,
.fr-text-image__text > *::before {
content: "";
position: absolute;
inset: -1.25rem -2rem;
z-index: -1;
background: var(--fr-bg);
--fr-fade: linear-gradient(transparent, #000 1.25rem, #000 calc(100% - 1.25rem), transparent);
-webkit-mask: var(--fr-fade), linear-gradient(90deg, transparent, #000 2rem, #000 calc(100% - 2rem), transparent);
-webkit-mask-composite: source-in;
mask: var(--fr-fade), linear-gradient(90deg, transparent, #000 2rem, #000 calc(100% - 2rem), transparent);
mask-composite: intersect;
pointer-events: none;
}
@media (max-width: 900px) {
.fr-hero--centred .fr-eyebrow::before,
.fr-hero--centred .fr-hero__heading::before,
.fr-hero--centred .fr-hero__intro::before,
.fr-section-head__text::before,
.fr-text-image__text > *::before {
display: none;
}
}
@-webkit-keyframes spin {
0% {
-webkit-transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
}
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
.hidden {
display: none !important;
}
.clear {
clear: both;
}
* {
-webkit-tap-highlight-color: rgba(255, 255, 255, 0) !important;
-webkit-focus-ring-color: rgba(255, 255, 255, 0) !important;
outline: none;
}
body {
font-family: var(--font);
color: var(--color);
}
a {
color: var(--primary);
}
a:hover {
color: var(--primary-hover-border);
}
code,
kbd,
pre,
samp {
font-family: var(--font-mono);
}
kbd {
background-color: var(--dark);
}
caption {
color: var(--secondary);
}
.table {
--table-striped-color: var(--dark);
--table-active-color: var(--dark);
--table-hover-color: var(--dark);
color: var(--dark);
}
.table > :not(caption) > * > * {
background-color: var(--table-bg);
box-shadow: inset 0 0 0 9999px var(--table-accent-bg);
}
.form-text {
color: var(--secondary);
font-size: 1rem;
}
.form-control {
color: var(--dark);
font-size: 16px;
}
.form-control:focus {
color: var(--dark);
}
.form-control::-moz-placeholder {
color: var(--secondary);
}
.form-control::placeholder {
color: var(--secondary);
}
.form-control::file-selector-button {
color: var(--dark);
}
.form-control::-webkit-file-upload-button {
color: var(--dark);
}
.form-select {
color: var(--dark);
}
.form-select:-moz-focusring {
text-shadow: 0 0 0 var(--dark);
}
.form-check-input:checked {
background-color: var(--primary);
border-color: var(--primary);
}
.form-check-input[type=checkbox]:indeterminate {
background-color: var(--primary);
border-color: var(--primary);
}
.input-group-text {
color: var(--dark);
}
.form-control.is-invalid,
.was-validated .form-control:invalid {
border-color: var(--danger);
}
.form-control.is-invalid:focus,
.was-validated .form-control:invalid:focus {
border-color: var(--danger);
}
.form-select.is-invalid,
.was-validated .form-select:invalid {
border-color: var(--danger);
}
.form-select.is-invalid:focus,
.was-validated .form-select:invalid:focus {
border-color: var(--danger);
}
.form-check-input.is-invalid,
.was-validated .form-check-input:invalid {
border-color: var(--danger);
}
.form-check-input.is-invalid:checked,
.was-validated .form-check-input:invalid:checked {
background-color: var(--danger);
}
.form-check-input.is-invalid ~ .form-check-label,
.was-validated .form-check-input:invalid ~ .form-check-label {
color: var(--danger);
}
.fr-article {
background: var(--fr-surface);
color: var(--fr-text);
border-radius: var(--fr-radius);
padding: clamp(24px, 5vw, var(--fr-space-5));
--fr-bg: var(--fr-surface);
--fr-fg: var(--fr-text);
--fr-accent-on-bg: var(--fr-accent-ink);
}
.fr-features {
list-style: none;
margin: 0;
padding: 0;
display: grid;
grid-template-columns: repeat(var(--fr-features-columns, 3), minmax(0, 1fr));
gap: var(--fr-space-3);
}
.fr-features__item {
background: var(--fr-surface);
color: var(--fr-text);
border-radius: var(--fr-radius);
padding: var(--fr-space-4) var(--fr-space-3);
}
.fr-features__heading {
font-family: var(--fr-display);
font-weight: 400;
font-size: 24px;
line-height: 1.1;
margin: 0 0 var(--fr-space-2);
}
.fr-features__body {
margin: 0;
font-size: var(--fr-body-size);
line-height: var(--fr-body-line);
}
@media (max-width: 900px) {
.fr-features {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (max-width: 560px) {
.fr-features {
grid-template-columns: 1fr;
}
}
.fr-footer {
padding-bottom: var(--fr-space-3);
}
.fr-footer__hold {
display: flex;
justify-content: space-between;
gap: var(--fr-space-5);
flex-wrap: wrap;
}
.fr-footer__mark {
display: inline-block;
line-height: 1;
}
.fr-footer__mark img {
height: 36px;
width: auto;
display: block;
}
.fr-footer__mark {
font-family: var(--fr-display);
font-weight: 400;
font-size: 28px;
color: var(--fr-accent-on-bg);
margin: 0 0 var(--fr-space-3);
}
.fr-footer__block {
margin: 0 0 var(--fr-space-3);
font-size: var(--fr-small);
display: flex;
flex-direction: column;
gap: 2px;
}
.fr-footer__block a {
color: var(--fr-accent-on-bg);
text-decoration: none;
}
.fr-footer__block a:hover, .fr-footer__block a:focus-visible {
text-decoration: underline;
}
.fr-footer__label {
font-weight: 700;
color: var(--fr-fg);
}
.fr-footer__line {
color: var(--fr-accent-on-bg);
}
.fr-footer__badges {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--fr-space-3);
}
.fr-footer__badges img {
max-height: 40px;
width: auto;
display: block;
}
.fr-footer__social, .fr-footer__legal {
list-style: none;
margin: 0;
padding: 0;
display: flex;
gap: var(--fr-space-3);
font-size: 12px;
}
.fr-footer__social a, .fr-footer__legal a {
color: var(--fr-fg);
text-decoration: none;
}
.fr-footer__social a:hover, .fr-footer__social a:focus-visible, .fr-footer__legal a:hover, .fr-footer__legal a:focus-visible {
color: var(--fr-accent-on-bg);
}
.fr-footer__foot {
display: flex;
align-items: center;
justify-content: space-between;
gap: var(--fr-space-3);
flex-wrap: wrap;
border-top: 1px solid rgba(0, 0, 0, 0.08);
margin-top: var(--fr-space-4);
padding-top: var(--fr-space-3);
}
.fr-footer__copyright {
margin: 0;
font-size: 12px;
}
.fr-footer address {
font-style: normal;
}
.fr-header {
position: relative;
z-index: 10;
background: transparent;
padding-block: var(--fr-space-3);
}
.fr-header--dark {
background: var(--fr-ink);
--fr-fg: #ffffff;
--fr-accent-on-bg: var(--fr-accent);
}
.fr-header--dark .fr-header__link {
color: #ffffff;
}
.fr-header__hold {
display: flex;
align-items: center;
justify-content: space-between;
gap: var(--fr-space-4);
}
.fr-header__mark {
display: inline-block;
line-height: 1;
}
.fr-header__mark img {
height: 28px;
width: auto;
display: block;
}
.fr-header__mark {
font-family: var(--fr-display);
font-weight: 400;
font-size: 24px;
letter-spacing: 0.02em;
color: var(--fr-accent-on-bg);
text-decoration: none;
}
.fr-header__nav {
display: flex;
gap: var(--fr-space-4);
flex-wrap: wrap;
}
.fr-header__search {
display: flex;
align-items: center;
gap: var(--fr-space-1);
}
.fr-header__search-label {
position: absolute;
width: 1px;
height: 1px;
overflow: hidden;
clip-path: inset(50%);
white-space: nowrap;
}
.fr-header__search-input {
font-family: var(--fr-body);
font-size: var(--fr-small);
padding: 8px 12px;
border: 1px solid rgba(0, 0, 0, 0.2);
background: var(--fr-bg);
color: var(--fr-fg);
min-width: 9rem;
}
.fr-header__search-input:focus-visible {
outline: 2px solid var(--fr-accent-on-bg);
outline-offset: 1px;
}
.fr-header--dark .fr-header__search-input {
border-color: rgba(255, 255, 255, 0.35);
}
.fr-header__link {
font-size: var(--fr-small);
font-weight: 700;
color: var(--fr-fg);
text-decoration: none;
}
.fr-header__link:hover, .fr-header__link:focus-visible {
color: var(--fr-accent-on-bg);
}
.fr-header__menu {
display: none;
}
.fr-header__burger {
list-style: none;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
width: 44px;
height: 44px;
margin-right: -10px;
color: var(--fr-fg);
}
.fr-header__burger::-webkit-details-marker {
display: none;
}
.fr-header__burger:focus-visible {
outline: 2px solid var(--fr-accent-on-bg);
outline-offset: 2px;
}
.fr-header__burger-lines {
position: relative;
width: 22px;
height: 14px;
}
.fr-header__burger-lines span {
position: absolute;
left: 0;
width: 100%;
height: 2px;
background: currentColor;
transition: transform 0.2s ease, opacity 0.2s ease;
}
.fr-header__burger-lines span:nth-child(1) {
top: 0;
}
.fr-header__burger-lines span:nth-child(2) {
top: 6px;
}
.fr-header__burger-lines span:nth-child(3) {
top: 12px;
}
.fr-header__menu[open] .fr-header__burger-lines span:nth-child(1) {
transform: translateY(6px) rotate(45deg);
}
.fr-header__menu[open] .fr-header__burger-lines span:nth-child(2) {
opacity: 0;
}
.fr-header__menu[open] .fr-header__burger-lines span:nth-child(3) {
transform: translateY(-6px) rotate(-45deg);
}
.fr-header__panel {
position: absolute;
left: 0;
right: 0;
top: 100%;
background: var(--fr-page);
border-top: 1px solid rgba(0, 0, 0, 0.1);
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
padding: var(--fr-space-3) var(--fr-gutter, 20px) var(--fr-space-4);
display: grid;
gap: var(--fr-space-3);
}
.fr-header--dark .fr-header__panel {
background: var(--fr-ink);
border-color: rgba(255, 255, 255, 0.15);
}
.fr-header__panel-nav {
display: grid;
}
.fr-header__panel-nav .fr-header__link {
font-size: var(--fr-body-size);
padding-block: 12px;
border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
.fr-header__panel-search .fr-header__search-input {
width: 100%;
min-height: 44px;
font-size: var(--fr-body-size);
}
@media (max-width: 760px) {
.fr-header {
padding-block: var(--fr-space-2);
}
.fr-header__wide {
display: none;
}
.fr-header__menu {
display: block;
}
.fr-header__mark img {
height: 24px;
}
}
@media (prefers-reduced-motion: reduce) {
.fr-header__burger-lines span {
transition: none;
}
}
.fr-hero {
position: relative;
overflow: hidden;
padding-block: var(--fr-space-7) var(--fr-space-6);
}
.fr-hero__hold {
position: relative;
z-index: 1;
}
.fr-hero__intro {
margin-top: var(--fr-space-3);
}
.fr-hero__actions {
display: flex;
flex-wrap: wrap;
gap: var(--fr-space-2);
margin: var(--fr-space-4) 0 0;
}
.fr-hero--centred {
text-align: center;
}
.fr-hero--centred .fr-hero__heading {
max-width: 22ch;
margin-inline: auto;
}
.fr-hero--centred .fr-hero__intro {
max-width: 60ch;
margin-inline: auto;
}
.fr-hero--centred .fr-hero__actions {
justify-content: center;
}
.fr-hero--cover {
display: flex;
align-items: flex-end;
min-height: clamp(420px, 62vh, 640px);
padding-block: var(--fr-space-7) var(--fr-space-5);
}
.fr-hero--cover .fr-hero__hold {
width: 100%;
}
.fr-hero--cover .fr-hero__words {
max-width: 760px;
}
.fr-hero--cover .fr-hero__intro {
max-width: 56ch;
}
.fr-hero__media {
position: absolute;
inset: 0;
z-index: 0;
}
.fr-hero__media picture, .fr-hero__media img {
width: 100%;
height: 100%;
display: block;
object-fit: cover;
}
.fr-hero__media::after {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(90deg, rgba(14, 21, 28, 0.92) 0%, rgba(14, 21, 28, 0.72) 34%, rgba(14, 21, 28, 0.22) 76%), linear-gradient(0deg, rgba(14, 21, 28, 0.74), rgba(14, 21, 28, 0) 45%);
}
.fr-hero__squiggle {
position: absolute;
inset-block: -8%;
right: -2%;
width: min(34%, 380px);
pointer-events: none;
}
.fr-hero__squiggle svg {
width: 100%;
height: 100%;
display: block;
}
@media (max-width: 900px) {
.fr-hero__squiggle {
display: none;
}
}
.fr-hero--cover .fr-button:not(:hover):not(:focus-visible) {
background: none;
}
.fr-site {
position: relative;
z-index: 0;
}
.fr-squiggle {
position: absolute;
inset: 0;
pointer-events: none;
z-index: -1;
overflow: hidden;
}
.fr-squiggle--left {
transform: scaleX(-1);
}
.fr-squiggle svg {
width: 100%;
height: auto;
display: block;
}
.fr-squiggle path {
fill: none;
stroke: var(--fr-squiggle-colour);
stroke-width: 2px;
stroke-linecap: round;
vector-effect: non-scaling-stroke;
}
.fr-squiggle--green {
--fr-squiggle-colour: #44af91;
}
.fr-squiggle--white {
--fr-squiggle-colour: #f6f6f6;
}
@media (max-width: 900px) {
.fr-squiggle {
display: none;
}
}
.fr-person__hold {
text-align: center;
}
.fr-person__card {
background: var(--fr-surface);
color: var(--fr-text);
border-radius: var(--fr-radius);
padding: clamp(32px, 6vw, var(--fr-space-6)) var(--fr-space-3);
--fr-bg: var(--fr-surface);
--fr-fg: var(--fr-text);
--fr-accent-on-bg: var(--fr-accent-ink);
}
.fr-person__heading {
margin: 0 auto;
max-width: 20ch;
}
.fr-person__intro {
margin: var(--fr-space-3) auto 0;
max-width: 50ch;
font-size: var(--fr-small);
}
.fr-person__photo {
width: 104px;
height: 104px;
margin: var(--fr-space-5) auto var(--fr-space-3);
border-radius: 50%;
overflow: hidden;
border: 2px solid var(--fr-accent);
}
.fr-person__photo img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.fr-person__line {
margin: 0;
font-size: var(--fr-small);
font-weight: 700;
color: var(--fr-accent-on-bg);
}
.fr-person__actions {
margin: var(--fr-space-4) 0 0;
}
.fr-price__hold {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: var(--fr-space-3);
}
.fr-price__amount {
margin: 0;
}
.fr-price__note {
margin: var(--fr-space-2) 0 0;
font-size: var(--fr-small);
}
.fr-price__action {
margin: 0;
}
.fr-section-head {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: var(--fr-space-4);
flex-wrap: wrap;
margin-bottom: var(--fr-space-5);
}
.fr-section-head__intro {
margin-top: var(--fr-space-3);
}
.fr-section-head__link {
flex: none;
}
.fr-split {
display: grid;
grid-template-columns: 1fr 1fr;
--fr-bg: var(--fr-ink);
--fr-fg: #ffffff;
--fr-accent-on-bg: var(--fr-accent);
}
@media (max-width: 820px) {
.fr-split {
grid-template-columns: 1fr;
}
}
.fr-text-image {
display: grid;
grid-template-columns: 1fr 1fr;
gap: var(--fr-space-5);
align-items: center;
}
.fr-text-image--flip .fr-text-image__text {
order: 2;
}
.fr-text-image--flip .fr-text-image__media {
order: 1;
}
.fr-text-image--solo {
grid-template-columns: minmax(0, 68ch);
}
.fr-text-image--long {
align-items: start;
}
.fr-text-image--long .fr-text-image__media {
position: sticky;
top: var(--fr-space-4);
}
.fr-text-image__prose {
margin-top: var(--fr-space-3);
}
.fr-text-image__points {
margin: var(--fr-space-3) 0 0;
padding-left: 1.1em;
font-size: var(--fr-body-size);
line-height: var(--fr-body-line);
}
.fr-text-image__points li {
margin-bottom: var(--fr-space-1);
}
.fr-text-image__points li::marker {
color: var(--fr-accent-on-bg);
}
.fr-text-image__points em {
font-style: normal;
font-weight: 700;
color: var(--fr-accent-on-bg);
}
.fr-text-image__media img {
width: 100%;
height: auto;
display: block;
border-radius: var(--fr-radius);
}
@media (max-width: 820px) {
.fr-text-image {
grid-template-columns: 1fr;
gap: var(--fr-space-4);
}
.fr-text-image--long .fr-text-image__media {
position: static;
}
.fr-text-image--flip .fr-text-image__text {
order: 1;
}
.fr-text-image--flip .fr-text-image__media {
order: 2;
}
}
.fr-cards {
display: flex;
flex-direction: column;
gap: var(--fr-space-4);
}
.fr-cards__empty {
font-size: var(--fr-small);
opacity: 0.75;
}
.fr-cards--stack {
display: grid;
grid-template-columns: repeat(var(--fr-cards-columns, 3), 1fr);
gap: var(--fr-space-3);
}
.fr-cards--stack .fr-card {
grid-template-columns: 1fr;
}
.fr-cards--stack .fr-card__media {
aspect-ratio: var(--fr-cards-ratio, 16/10);
}
@media (max-width: 900px) {
.fr-cards--stack {
grid-template-columns: 1fr;
}
}
.fr-card {
display: grid;
grid-template-columns: 5fr 6fr;
background: var(--fr-surface);
color: var(--fr-text);
--fr-bg: var(--fr-surface);
--fr-fg: var(--fr-text);
--fr-accent-on-bg: var(--fr-accent-ink);
position: relative;
border-radius: var(--fr-radius);
overflow: hidden;
}
.fr-card__media {
overflow: hidden;
}
.fr-card__media img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.fr-card__media--panel {
background: var(--fr-accent-wash);
}
.fr-card__body {
padding: var(--fr-space-4);
display: flex;
flex-direction: column;
align-items: flex-start;
gap: var(--fr-space-2);
}
.fr-card__tags {
display: flex;
flex-wrap: wrap;
gap: var(--fr-space-1);
margin: 0;
}
.fr-card__title {
font-family: var(--fr-display);
font-size: 24px;
line-height: 1.1;
margin: 0;
font-weight: 400;
}
.fr-card__title a {
color: inherit;
text-decoration: none;
}
.fr-card__title a::after {
content: "";
position: absolute;
inset: 0;
}
.fr-card__summary {
margin: 0;
font-size: var(--fr-small);
line-height: 1.6;
}
.fr-card__actions {
margin: auto 0 0;
}
.fr-card:hover .fr-button, .fr-card:focus-within .fr-button {
background: var(--fr-accent-ink);
color: var(--fr-surface);
}
@media (max-width: 820px) {
.fr-card {
grid-template-columns: 1fr;
}
}
html.admin #admin-trigger {
display: none;
}
html:not(.admin) #admin-trigger {
position: fixed;
left: var(--admin-trigger-left, auto);
right: var(--admin-trigger-right, 1rem);
bottom: var(--admin-trigger-bottom, 1rem);
top: var(--admin-trigger-top, auto);
z-index: 2147483647;
}
html:not(.admin) #admin-trigger .dropdown-toggle {
border-radius: 50%;
background: var(--dark);
color: var(--dark-fg);
border: 1px solid var(--dark-fg);
display: flex;
align-items: center;
justify-content: center;
width: 2rem;
height: 2rem;
transform-origin: 50% 50%;
transition: all 0.3s ease;
padding: 0.25rem 0.5rem !important;
min-height: 0;
}
html:not(.admin) #admin-trigger .dropdown__label :is(i, .ui-icon):first-child {
margin: 0;
}
html:not(.admin) #admin-trigger .dropdown__arrow {
display: none;
}
html:not(.admin) #admin-trigger .dropdown-menu {
line-height: 1.5 !important;
margin: 0 !important;
color: inherit !important;
}
html:not(.admin) #admin-trigger .dropdown-menu > li > .btn {
font-size: 0.875rem;
display: flex;
justify-content: flex-start;
gap: 0.5rem;
}
html:not(.admin) #admin-trigger .dropdown-menu hr {
margin: 0.5rem 0 !important;
}
html:not(.admin) #admin-trigger:hover .dropdown:not(:has(.dropdown-toggle[aria-expanded=true])) .dropdown-toggle {
transform: scale(1.25);
box-shadow: 0 0 9px 2px black;
}
html:not(.admin) #admin-trigger:hover .dropdown:not(:has(.dropdown-toggle[aria-expanded=true])) + .ui-icon {
left: -0.375rem;
top: -0.375rem;
transform: rotate(-30deg) scale(1.25);
}
html:not(.admin) #admin-trigger > .ui-icon {
position: absolute;
color: var(--dark-fg);
left: -0.25rem;
top: -0.25rem;
transform: rotate(-30deg);
filter: drop-shadow(2px 2px 4px black);
pointer-events: none;
transform-origin: 100% 100%;
transition: all 0.3s ease;
}
html:not(.admin) #admin-menu {
position: absolute;
left: var(--admin-menu-left, auto);
right: var(--admin-menu-right, 1rem);
bottom: var(--admin-menu-bottom, auto);
top: var(--admin-menu-top, 3.5rem);
z-index: 2147483647;
list-style: none;
padding: 0;
margin: 0;
font-size: 0.875rem;
border-radius: 0.25rem;
}
html:not(.admin)[data-env=stage] #admin-trigger .dropdown-toggle {
background: var(--warning);
color: var(--warning-fg);
}
html:not(.admin)[data-env=uat] #admin-trigger .dropdown-toggle {
background: var(--warning);
color: var(--warning-fg);
}
html:not(.admin)[data-env=prod] #admin-trigger .dropdown-toggle {
background: var(--danger);
color: var(--danger-fg);
}
.alert {
position: relative;
padding: 1rem 1rem;
margin-bottom: 1rem;
border: 1px solid transparent;
border-radius: 0.015625rem 0.015625rem 0.015625rem 0.015625rem;
}
.alert-heading {
color: inherit;
}
.alert-link {
font-weight: 700;
}
.alert-primary {
color: rgb(3.0588235294%, 25.8823529412%, 59.5294117647%);
background-color: rgb(81.0196078431%, 88.6274509804%, 99.8431372549%);
border-color: rgb(71.5294117647%, 82.9411764706%, 99.7647058824%);
}
.alert-primary .alert-link {
color: rgb(2.4470588235%, 20.7058823529%, 47.6235294118%);
}
.alert-secondary {
color: rgb(25.4117647059%, 27.5294117647%, 29.4117647059%);
background-color: rgb(88.4705882353%, 89.1764705882%, 89.8039215686%);
border-color: rgb(82.7058823529%, 83.7647058824%, 84.7058823529%);
}
.alert-secondary .alert-link {
color: rgb(20.3294117647%, 22.0235294118%, 23.5294117647%);
}
.alert-success {
color: rgb(5.8823529412%, 31.7647058824%, 19.7647058824%);
background-color: rgb(81.9607843137%, 90.5882352941%, 86.5882352941%);
border-color: rgb(72.9411764706%, 85.8823529412%, 79.8823529412%);
}
.alert-success .alert-link {
color: rgb(4.7058823529%, 25.4117647059%, 15.8117647059%);
}
.alert-info {
color: rgb(2.0392156863%, 31.6862745098%, 37.6470588235%);
background-color: rgb(81.0196078431%, 95.8431372549%, 98.8235294118%);
border-color: rgb(71.5294117647%, 93.7647058824%, 98.2352941176%);
}
.alert-info .alert-link {
color: rgb(1.631372549%, 25.3490196078%, 30.1176470588%);
}
.alert-warning {
color: rgb(40%, 30.2745098039%, 1.0980392157%);
background-color: rgb(100%, 95.137254902%, 80.5490196078%);
border-color: rgb(100%, 92.7058823529%, 70.8235294118%);
}
.alert-warning .alert-link {
color: rgb(32%, 24.2196078431%, 0.8784313725%);
}
.alert-danger {
color: rgb(51.7647058824%, 12.4705882353%, 16.2352941176%);
background-color: rgb(97.2549019608%, 84.1568627451%, 85.4117647059%);
border-color: rgb(95.8823529412%, 76.2352941176%, 78.1176470588%);
}
.alert-danger .alert-link {
color: rgb(41.4117647059%, 9.9764705882%, 12.9882352941%);
}
.alert-dark {
color: rgb(7.7647058824%, 8.7058823529%, 9.6470588235%);
background-color: rgb(82.5882352941%, 82.9019607843%, 83.2156862745%);
border-color: rgb(73.8823529412%, 74.3529411765%, 74.8235294118%);
}
.alert-dark .alert-link {
color: rgb(6.2117647059%, 6.9647058824%, 7.7176470588%);
}
.alert__internal {
display: flex;
align-items: center;
gap: 0.5rem;
}
.alert__content {
min-width: calc(100% - 3rem);
}
.alert__content p:last-of-type {
margin-bottom: 0;
}
.alert-dismissable .btn-close {
float: right;
}
.alert-dismissable .alert__content {
margin-inline-end: 2rem;
}
.alert {
}
.btn-close {
box-sizing: content-box;
width: 1em;
height: 1em;
padding: 0.25em 0.25em;
color: #000;
background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%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;
border: 0;
border-radius: 0rem 0rem 0rem 0rem;
opacity: 0.5;
}
.btn-close:hover {
color: #000;
text-decoration: none;
opacity: 0.75;
}
.btn-close:focus {
outline: 0;
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
opacity: 1;
}
.btn-close:disabled, .btn-close.disabled {
pointer-events: none;
user-select: none;
opacity: 0.25;
}
.btn-close-white {
filter: invert(1) grayscale(100%) brightness(200%);
}
.btn-close--sm {
width: 0.75em;
height: 0.75em;
background-size: 0.75em;
}
.container,
.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl,
.container-xxl {
width: 100%;
padding-right: var(--gutter-x, 0.75rem);
padding-left: var(--gutter-x, 0.75rem);
margin-right: auto;
margin-left: auto;
}
@media (min-width: 576px) {
.container,
.container-sm {
max-width: 540px;
}
}
@media (min-width: 768px) {
.container,
.container-md,
.container-sm {
max-width: 720px;
}
}
@media (min-width: 992px) {
.container,
.container-lg,
.container-md,
.container-sm {
max-width: 960px;
}
}
@media (min-width: 1200px) {
.container,
.container-lg,
.container-md,
.container-sm,
.container-xl {
max-width: 1140px;
}
}
@media (min-width: 1400px) {
.container,
.container-lg,
.container-md,
.container-sm,
.container-xl,
.container-xxl {
max-width: 1320px;
}
}
.container,
.container-fluid,
.container-xxl,
.container-xl,
.container-lg,
.container-md,
.container-sm {
width: 100%;
padding-right: var(--bs-gutter-x, 0.75rem);
padding-left: var(--bs-gutter-x, 0.75rem);
margin-right: auto;
margin-left: auto;
}
@media (min-width: 576px) {
.container-sm, .container {
max-width: 540px;
}
}
@media (min-width: 768px) {
.container-md, .container-sm, .container {
max-width: 720px;
}
}
@media (min-width: 992px) {
.container-lg, .container-md, .container-sm, .container {
max-width: 960px;
}
}
@media (min-width: 1200px) {
.container-xl, .container-lg, .container-md, .container-sm, .container {
max-width: 1140px;
}
}
.container-xl, .container-lg, .container-md, .container-sm, .container {
max-width: 1320px;
}
.cookie-consent {
position: fixed;
inset-inline: 0;
bottom: 0;
z-index: 1050;
max-height: 100vh;
max-height: 100dvh;
overflow-y: auto;
background: var(--cookie-consent-bg, Canvas);
color: var(--cookie-consent-fg, CanvasText);
box-shadow: 0 -0.25rem 1.5rem rgba(0, 0, 0, 0.15);
font-size: 0.9375rem;
}
.cookie-consent__inner {
max-width: 60rem;
margin: 0 auto;
padding: 1rem;
}
.cookie-consent__title {
font-size: 1.125rem;
margin: 0 0 0.25rem;
}
.cookie-consent__title:focus {
outline: none;
}
.cookie-consent__title:focus-visible {
outline: 2px solid currentColor;
outline-offset: 2px;
}
.cookie-consent__text {
margin: 0 0 0.75rem;
}
.cookie-consent__categories {
display: grid;
gap: 0.75rem;
margin-bottom: 0.75rem;
}
.cookie-consent__switch {
display: inline-flex;
align-items: center;
gap: 0.5rem;
font-weight: 600;
cursor: pointer;
}
.cookie-consent__switch input {
width: 1.125rem;
height: 1.125rem;
}
.cookie-consent__description {
margin: 0.125rem 0 0 1.625rem;
}
.cookie-consent__details {
margin: 0.25rem 0 0 1.625rem;
}
.cookie-consent__details ul {
margin: 0.25rem 0 0;
padding-inline-start: 1rem;
}
.cookie-consent__details li {
margin-bottom: 0.25rem;
}
.cookie-consent__meta {
opacity: 0.75;
}
.cookie-consent__purpose {
display: block;
}
.cookie-consent__actions {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
justify-content: flex-end;
}
.cookie-settings-link {
padding: 0;
border: 0;
background: none;
color: inherit;
font: inherit;
text-decoration: underline;
cursor: pointer;
}
:root {
--ui-dialog-open-speed: .5s;
--ui-dialog-close-speed: .2s;
}
.ui-dialog__title {
font-size: 1.25rem;
font-weight: 500;
margin: 0;
}
.dropup,
.dropend,
.dropdown,
.dropstart {
position: relative;
}
.dropdown-toggle {
white-space: nowrap;
}
.dropdown-toggle::after {
display: inline-block;
margin-left: 0.255em;
vertical-align: 0.255em;
content: "";
border-top: 0.3em solid;
border-right: 0.3em solid transparent;
border-bottom: 0;
border-left: 0.3em solid transparent;
}
.dropdown-toggle:empty::after {
margin-left: 0;
}
.dropdown-menu {
position: absolute;
z-index: 1000;
min-width: 10rem;
padding: 0.5rem 0;
margin: 0;
font-size: 1rem;
color: #212529;
text-align: left;
list-style: none;
background-color: #fff;
background-clip: padding-box;
border: 1px solid rgba(0, 0, 0, 0.15);
border-radius: 0.015625rem 0.015625rem 0.015625rem 0.015625rem;
}
.dropdown-menu[data-bs-popper] {
top: 100%;
left: 0;
margin-top: 0.125rem;
}
.dropdown-divider {
height: 0;
margin: 0.5rem 0;
overflow: hidden;
border-top: 1px solid rgba(0, 0, 0, 0.15);
}
.dropdown-item {
display: block;
width: 100%;
padding: 0.25rem 1rem;
clear: both;
font-weight: 400;
color: #212529;
text-align: inherit;
text-decoration: none;
white-space: nowrap;
background-color: transparent;
border: 0;
}
.dropdown-item:hover, .dropdown-item:focus {
color: rgb(11.6470588235%, 13.0588235294%, 14.4705882353%);
background-color: #e9ecef;
}
.dropdown-item.active, .dropdown-item:active {
color: #fff;
text-decoration: none;
background-color: #0d6efd;
}
.dropdown-item.disabled, .dropdown-item:disabled {
color: #adb5bd;
pointer-events: none;
background-color: transparent;
}
.dropdown-menu.show {
display: block;
}
.dropdown-menu.dropdown-menu--no-minwidth {
min-width: 0;
}
.dropdown-header {
display: block;
padding: 0.5rem 1rem;
margin-bottom: 0;
font-size: 0.875rem;
color: #6c757d;
white-space: nowrap;
}
.dropdown {
position: relative;
}
.dropdown > .btn.btn-link {
color: currentColor;
}
.dropdown--split .btn:not(.dropdown-toggle) {
flex: 1 0 auto;
}
.dropdown--split .btn.dropdown-toggle {
flex: 0 0 0%;
}
.dropdown--split .dropdown-toggle {
height: auto;
}
.dropdown--split .dropdown-menu {
top: 100%;
}
.dropdown-toggle {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: space-between;
}
.dropdown-toggle::after {
content: none;
}
.dropdown-toggle > * {
pointer-events: none;
}
.dropdown-toggle-split .dropdown__arrow {
margin-inline-start: 0;
}
.dropdown__label i:first-child {
margin-inline-end: 0.5rem;
}
.dropdown__label, .dropdown__arrow {
display: flex;
align-items: center;
}
.dropdown__arrow {
flex: 1 0 auto;
justify-content: flex-end;
margin-inline-start: 1.5rem;
}
.dropdown__chevron {
width: 0.8125rem;
}
.dropdown-menu {
display: block;
position: absolute;
margin: 0;
top: auto;
bottom: auto;
left: auto;
right: auto;
}
.dropdown-menu > li > .btn {
text-align: left;
}
.dropdown--align-left .dropdown-menu {
left: 0;
}
.dropdown--align-right .dropdown-menu {
right: 0;
}
.dropdown--align-top .dropdown-menu {
top: 0;
}
.dropdown--align-bottom .dropdown-menu {
bottom: 0;
}
.dropdown--position-left .dropdown__chevron {
transform: rotate(90deg);
}
.dropdown--position-left .dropdown__arrow {
margin-inline-start: auto;
margin-inline-end: 1.5rem;
}
.dropdown--position-left .dropdown-menu {
right: 100%;
}
.dropdown--position-right .dropdown__chevron {
transform: rotate(-90deg);
}
.dropdown--position-right .dropdown-menu {
left: 100%;
}
.dropdown--position-top .dropdown__chevron {
transform: rotate(180deg);
}
.dropdown--position-top .dropdown-menu {
top: auto;
bottom: 100%;
}
.dropdown-item.active, .dropdown-item:active {
color: var(--primary-fg);
background-color: var(--primary);
}
.file-selector {
margin-bottom: 2rem;
}
.file-selector__tags {
padding: 0;
margin: 0;
list-style: none;
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
width: 100%;
}
.file-selector__tags:empty {
display: none;
}
.file-selector__grid {
display: flex;
flex-wrap: wrap;
gap: 8px;
list-style: none;
margin: 0;
flex: 1 1 auto;
min-height: 0;
overflow-y: auto;
height: 100%;
padding: 1rem;
}
.file-selector__grid > .loop-item {
flex: 0 0 200px;
max-width: 200px;
}
.file-selector__item {
--btn-font-weight: normal;
padding: 0;
width: 100%;
height: 100%;
margin-bottom: 8px;
border-radius: 0;
flex-direction: column;
background-color: transparent !important;
color: currentColor !important;
border: 0;
}
.file-selector__item img {
width: 100%;
height: 100%;
object-fit: contain;
}
.file-selector__preview {
width: 100%;
aspect-ratio: 1/1;
border: 1px solid #eee;
border-radius: 3px;
overflow: hidden;
margin-bottom: 4px;
display: flex;
align-items: center;
justify-content: center;
padding: 10px;
background-image: conic-gradient(#e6e6e6 0 25%, #f5f5f5 0 50%, #e6e6e6 0 75%, #f5f5f5 0);
background-size: 1rem 1rem;
}
.file-selector__preview--auto img {
width: auto;
height: auto;
}
.file-selector__name {
font-size: 12px;
word-break: break-all;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
line-clamp: 1;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.file-selector__options {
display: flex;
margin-top: 0.75rem;
}
.file-selector__select {
margin-right: 0.5rem;
}
.file-selector__select.dropdown > .btn {
background-image: none !important;
background: var(--primary);
color: var(--primary-fg);
}
.file-selector__select.dropdown > .btn:hover {
background: var(--primary-hover);
}
.file-selector__link.btn {
margin-right: 0.5rem;
background-image: none !important;
background: var(--primary);
color: var(--primary-fg);
}
.file-selector__link.btn:hover {
background: var(--primary-hover);
}
.file-selector .image-select-dialog {
display: grid !important;
grid-template-columns: auto;
grid-template-rows: auto 1fr auto;
}
.file-selector .image-select-dialog__filters {
width: 100%;
}
.file-selector .image-select-dialog__filters .admin-page__search {
margin-bottom: 0.75rem;
}
.file-selector .image-select-dialog__filters .ui-form-select {
max-width: none;
min-width: 0;
width: 100%;
flex-shrink: 0;
}
.file-selector .image i {
font-size: 32px;
}
@media only screen and (min-width: 37.5rem) {
.file-selector .image-select-dialog__filters {
display: flex;
align-items: center;
gap: 1rem;
}
.file-selector .image-select-dialog__filters .admin-page__search {
margin-bottom: 0;
}
.file-selector .image-select-dialog__filters .ui-form-select {
width: auto;
}
}
:root {
--label-color: currentColor;
--label-font-size: var(--label-md-font-size, 15);
--label-font-weight: var(--label-md-font-weight, 700);
--field-background: #fff;
--field-color: currentColor;
--field-border: 1px solid #ced4da;
--field-select-background: #fff;
--field-select-color: currentColor;
--field-select-border: 1px solid #ced4da;
--field-select-option-background: #fff;
--field-select-icon--dark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 9' fill='none'%3E%3Cpath d='M15.8 1.66a.69.69 0 000-.96.66.66 0 00-.94 0L8.94 6.74a1.31 1.31 0 01-1.88 0L1.13.7A.66.66 0 00.2.7a.7.7 0 000 .97L6.12 7.7a2.62 2.62 0 003.77 0l5.93-6.04h-.02z' fill='currentColor'/%3E%3C/svg%3E");
--field-select-icon--light: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 9' fill='none'%3E%3Cpath d='M15.8 1.66a.69.69 0 000-.96.66.66 0 00-.94 0L8.94 6.74a1.31 1.31 0 01-1.88 0L1.13.7A.66.66 0 00.2.7a.7.7 0 000 .97L6.12 7.7a2.62 2.62 0 003.77 0l5.93-6.04h-.02z' fill='%23fff'/%3E%3C/svg%3E");
--field-select-icon: var(--field-select-icon--dark);
--field-placeholder-color: currentColor;
--field-placeholder-font-style: italic;
--field-placeholder-opacity: 0.6;
--field-readonly-background: #e8e8e8;
--field-disabled-background: #fff;
--field-disabled-opacity: 0.6;
--field-text-color: #6c757d;
--field-min-height: var(--field-md-min-height, 45);
--field-padding: var(--field-md-padding, 20);
--field-font-size: var(--field-md-font-size, 16);
--field-font-weight: var(--field-md-font-weight, 400);
--field-border-radius: var(--field-md-border-radius, 5);
--field-placeholder-font-size: var(--field-md-placeholder-font-size, 16);
--field-placeholder-font-weight: var(--field-md-placeholder-font-weight, 400);
--field-text-font-size: var(--field-md-text-font-size, 14);
--field-select-icon-width: var(--field-md-select-icon-width, 16);
--field-select-icon-height: var(--field-md-select-icon-height, 8);
}
fieldset:where(.fieldset--xs) {
--form-check-font-size: var(--form-xs-font-size, 12);
--form-check-size: var(--form-xs-check-size, 16);
--form-check-gap: var(--form-xs-check-gap, 6);
--form-check-border-radius: var(--form-xs-check-border-radius, 2);
--form-check-background-size: var(--form-xs-check-background-size, 8);
--form-switch-width: var(--form-xs-switch-width, 32);
--form-switch-height: var(--form-xs-switch-height, 20);
--form-switch-dot: var(--form-xs-switch-dot, 14);
--form-switch-gap: var(--form-xs-switch-gap, 6);
--form-switch-border-radius: var(--form-xs-switch-border-radius, 10);
--label-font-size: var(--label-xs-font-size, 13);
--label-font-weight: var(--label-xs-font-weight, 700);
--field-min-height: var(--field-xs-min-height, 35);
--field-padding: var(--field-xs-padding, 10);
--field-font-size: var(--field-xs-font-size, 13);
--field-font-weight: var(--field-xs-font-weight, 400);
--field-border-radius: var(--field-xs-border-radius, 5);
--field-placeholder-font-size: var(--field-xs-placeholder-font-size, 13);
--field-placeholder-font-weight: var(--field-xs-placeholder-font-weight, 400);
--field-text-font-size: var(--field-xs-text-font-size, 11);
--field-select-icon-width: var(--field-xs-select-icon-width, 13);
--field-select-icon-height: var(--field-xs-select-icon-height, 6);
}
fieldset:where(.fieldset--sm) {
--form-check-font-size: var(--form-sm-font-size, 13);
--form-check-size: var(--form-sm-check-size, 20);
--form-check-gap: var(--form-sm-check-gap, 8);
--form-check-border-radius: var(--form-sm-check-border-radius, 3);
--form-check-background-size: var(--form-sm-check-background-size, 10);
--form-switch-width: var(--form-sm-switch-width, 40);
--form-switch-height: var(--form-sm-switch-height, 20);
--form-switch-dot: var(--form-sm-switch-dot, 16);
--form-switch-gap: var(--form-sm-switch-gap, 8);
--form-switch-border-radius: var(--form-sm-switch-border-radius, 10);
--label-font-size: var(--label-sm-font-size, 14);
--label-font-weight: var(--label-sm-font-weight, 700);
--field-min-height: var(--field-sm-min-height, 40);
--field-padding: var(--field-sm-padding, 20);
--field-font-size: var(--field-sm-font-size, 14);
--field-font-weight: var(--field-sm-font-weight, 400);
--field-border-radius: var(--field-sm-border-radius, 5);
--field-placeholder-font-size: var(--field-sm-placeholder-font-size, 14);
--field-placeholder-font-weight: var(--field-sm-placeholder-font-weight, 400);
--field-text-font-size: var(--field-sm-text-font-size, 12);
--field-select-icon-width: var(--field-sm-select-icon-width, 14);
--field-select-icon-height: var(--field-sm-select-icon-height, 7);
}
fieldset:where(.fieldset--md) {
--form-check-font-size: var(--form-md-font-size, 15);
--form-check-size: var(--form-md-check-size, 24);
--form-check-gap: var(--form-md-check-gap, 10);
--form-check-border-radius: var(--form-md-check-border-radius, 3);
--form-check-background-size: var(--form-md-check-background-size, 10);
--form-switch-width: var(--form-md-switch-width, 48);
--form-switch-height: var(--form-md-switch-height, 24);
--form-switch-dot: var(--form-md-switch-dot, 18);
--form-switch-gap: var(--form-md-switch-gap, 10);
--form-switch-border-radius: var(--form-md-switch-border-radius, 12);
--label-font-size: var(--label-md-font-size, 15);
--label-font-weight: var(--label-md-font-weight, 700);
--field-min-height: var(--field-md-min-height, 45);
--field-padding: var(--field-md-padding, 20);
--field-font-size: var(--field-md-font-size, 16);
--field-font-weight: var(--field-md-font-weight, 400);
--field-border-radius: var(--field-md-border-radius, 5);
--field-placeholder-font-size: var(--field-md-placeholder-font-size, 16);
--field-placeholder-font-weight: var(--field-md-placeholder-font-weight, 400);
--field-text-font-size: var(--field-md-text-font-size, 14);
--field-select-icon-width: var(--field-md-select-icon-width, 16);
--field-select-icon-height: var(--field-md-select-icon-height, 8);
}
fieldset:where(.fieldset--lg) {
--form-check-font-size: var(--form-lg-font-size, 16);
--form-check-size: var(--form-lg-check-size, 28);
--form-check-gap: var(--form-lg-check-gap, 12);
--form-check-border-radius: var(--form-lg-check-border-radius, 4);
--form-check-background-size: var(--form-lg-check-background-size, 12);
--form-switch-width: var(--form-lg-switch-width, 56);
--form-switch-height: var(--form-lg-switch-height, 28);
--form-switch-dot: var(--form-lg-switch-dot, 22);
--form-switch-gap: var(--form-lg-switch-gap, 12);
--form-switch-border-radius: var(--form-lg-switch-border-radius, 14);
--label-font-size: var(--label-lg-font-size, 18);
--label-font-weight: var(--label-lg-font-weight, 700);
--field-min-height: var(--field-lg-min-height, 55);
--field-padding: var(--field-lg-padding, 20);
--field-font-size: var(--field-lg-font-size, 18);
--field-font-weight: var(--field-lg-font-weight, 400);
--field-border-radius: var(--field-lg-border-radius, 5);
--field-placeholder-font-size: var(--field-lg-placeholder-font-size, 18);
--field-placeholder-font-weight: var(--field-lg-placeholder-font-weight, 400);
--field-text-font-size: var(--field-lg-text-font-size, 16);
--field-select-icon-width: var(--field-lg-select-icon-width, 18);
--field-select-icon-height: var(--field-lg-select-icon-height, 9);
}
fieldset:where(.fieldset--xl) {
--form-check-font-size: var(--form-xl-font-size, 18);
--form-check-size: var(--form-xl-check-size, 32);
--form-check-gap: var(--form-xl-check-gap, 12);
--form-check-border-radius: var(--form-xl-check-border-radius, 6);
--form-check-background-size: var(--form-xl-check-background-size, 14);
--form-switch-width: var(--form-xl-switch-width, 64);
--form-switch-height: var(--form-xl-switch-height, 32);
--form-switch-dot: var(--form-xl-switch-dot, 24);
--form-switch-gap: var(--form-xl-switch-gap, 12);
--form-switch-border-radius: var(--form-xl-switch-border-radius, 16);
--label-font-size: var(--label-xl-font-size, 23);
--label-font-weight: var(--label-xl-font-weight, 700);
--field-min-height: var(--field-xl-min-height, 65);
--field-padding: var(--field-xl-padding, 25);
--field-font-size: var(--field-xl-font-size, 23);
--field-font-weight: var(--field-xl-font-weight, 400);
--field-border-radius: var(--field-xl-border-radius, 5);
--field-placeholder-font-size: var(--field-xl-placeholder-font-size, 23);
--field-placeholder-font-weight: var(--field-xl-placeholder-font-weight, 400);
--field-text-font-size: var(--field-xl-text-font-size, 20);
--field-select-icon-width: var(--field-xl-select-icon-width, 23);
--field-select-icon-height: var(--field-xl-select-icon-height, 12);
}
.ui-form-control:where(.ui-form-control--xs) {
--form-check-font-size: var(--form-xs-font-size, 12);
--form-check-size: var(--form-xs-check-size, 16);
--form-check-gap: var(--form-xs-check-gap, 6);
--form-check-border-radius: var(--form-xs-check-border-radius, 2);
--form-check-background-size: var(--form-xs-check-background-size, 8);
--form-switch-width: var(--form-xs-switch-width, 32);
--form-switch-height: var(--form-xs-switch-height, 20);
--form-switch-dot: var(--form-xs-switch-dot, 14);
--form-switch-gap: var(--form-xs-switch-gap, 6);
--form-switch-border-radius: var(--form-xs-switch-border-radius, 10);
--label-font-size: var(--label-xs-font-size, 13);
--label-font-weight: var(--label-xs-font-weight, 700);
--field-min-height: var(--field-xs-min-height, 35);
--field-padding: var(--field-xs-padding, 10);
--field-font-size: var(--field-xs-font-size, 13);
--field-font-weight: var(--field-xs-font-weight, 400);
--field-border-radius: var(--field-xs-border-radius, 5);
--field-placeholder-font-size: var(--field-xs-placeholder-font-size, 13);
--field-placeholder-font-weight: var(--field-xs-placeholder-font-weight, 400);
--field-text-font-size: var(--field-xs-text-font-size, 11);
--field-select-icon-width: var(--field-xs-select-icon-width, 13);
--field-select-icon-height: var(--field-xs-select-icon-height, 6);
}
.ui-form-control:where(.ui-form-control--sm) {
--form-check-font-size: var(--form-sm-font-size, 13);
--form-check-size: var(--form-sm-check-size, 20);
--form-check-gap: var(--form-sm-check-gap, 8);
--form-check-border-radius: var(--form-sm-check-border-radius, 3);
--form-check-background-size: var(--form-sm-check-background-size, 10);
--form-switch-width: var(--form-sm-switch-width, 40);
--form-switch-height: var(--form-sm-switch-height, 20);
--form-switch-dot: var(--form-sm-switch-dot, 16);
--form-switch-gap: var(--form-sm-switch-gap, 8);
--form-switch-border-radius: var(--form-sm-switch-border-radius, 10);
--label-font-size: var(--label-sm-font-size, 14);
--label-font-weight: var(--label-sm-font-weight, 700);
--field-min-height: var(--field-sm-min-height, 40);
--field-padding: var(--field-sm-padding, 20);
--field-font-size: var(--field-sm-font-size, 14);
--field-font-weight: var(--field-sm-font-weight, 400);
--field-border-radius: var(--field-sm-border-radius, 5);
--field-placeholder-font-size: var(--field-sm-placeholder-font-size, 14);
--field-placeholder-font-weight: var(--field-sm-placeholder-font-weight, 400);
--field-text-font-size: var(--field-sm-text-font-size, 12);
--field-select-icon-width: var(--field-sm-select-icon-width, 14);
--field-select-icon-height: var(--field-sm-select-icon-height, 7);
}
.ui-form-control:where(.ui-form-control--md) {
--form-check-font-size: var(--form-md-font-size, 15);
--form-check-size: var(--form-md-check-size, 24);
--form-check-gap: var(--form-md-check-gap, 10);
--form-check-border-radius: var(--form-md-check-border-radius, 3);
--form-check-background-size: var(--form-md-check-background-size, 10);
--form-switch-width: var(--form-md-switch-width, 48);
--form-switch-height: var(--form-md-switch-height, 24);
--form-switch-dot: var(--form-md-switch-dot, 18);
--form-switch-gap: var(--form-md-switch-gap, 10);
--form-switch-border-radius: var(--form-md-switch-border-radius, 12);
--label-font-size: var(--label-md-font-size, 15);
--label-font-weight: var(--label-md-font-weight, 700);
--field-min-height: var(--field-md-min-height, 45);
--field-padding: var(--field-md-padding, 20);
--field-font-size: var(--field-md-font-size, 16);
--field-font-weight: var(--field-md-font-weight, 400);
--field-border-radius: var(--field-md-border-radius, 5);
--field-placeholder-font-size: var(--field-md-placeholder-font-size, 16);
--field-placeholder-font-weight: var(--field-md-placeholder-font-weight, 400);
--field-text-font-size: var(--field-md-text-font-size, 14);
--field-select-icon-width: var(--field-md-select-icon-width, 16);
--field-select-icon-height: var(--field-md-select-icon-height, 8);
}
.ui-form-control:where(.ui-form-control--lg) {
--form-check-font-size: var(--form-lg-font-size, 16);
--form-check-size: var(--form-lg-check-size, 28);
--form-check-gap: var(--form-lg-check-gap, 12);
--form-check-border-radius: var(--form-lg-check-border-radius, 4);
--form-check-background-size: var(--form-lg-check-background-size, 12);
--form-switch-width: var(--form-lg-switch-width, 56);
--form-switch-height: var(--form-lg-switch-height, 28);
--form-switch-dot: var(--form-lg-switch-dot, 22);
--form-switch-gap: var(--form-lg-switch-gap, 12);
--form-switch-border-radius: var(--form-lg-switch-border-radius, 14);
--label-font-size: var(--label-lg-font-size, 18);
--label-font-weight: var(--label-lg-font-weight, 700);
--field-min-height: var(--field-lg-min-height, 55);
--field-padding: var(--field-lg-padding, 20);
--field-font-size: var(--field-lg-font-size, 18);
--field-font-weight: var(--field-lg-font-weight, 400);
--field-border-radius: var(--field-lg-border-radius, 5);
--field-placeholder-font-size: var(--field-lg-placeholder-font-size, 18);
--field-placeholder-font-weight: var(--field-lg-placeholder-font-weight, 400);
--field-text-font-size: var(--field-lg-text-font-size, 16);
--field-select-icon-width: var(--field-lg-select-icon-width, 18);
--field-select-icon-height: var(--field-lg-select-icon-height, 9);
}
.ui-form-control:where(.ui-form-control--xl) {
--form-check-font-size: var(--form-xl-font-size, 18);
--form-check-size: var(--form-xl-check-size, 32);
--form-check-gap: var(--form-xl-check-gap, 12);
--form-check-border-radius: var(--form-xl-check-border-radius, 6);
--form-check-background-size: var(--form-xl-check-background-size, 14);
--form-switch-width: var(--form-xl-switch-width, 64);
--form-switch-height: var(--form-xl-switch-height, 32);
--form-switch-dot: var(--form-xl-switch-dot, 24);
--form-switch-gap: var(--form-xl-switch-gap, 12);
--form-switch-border-radius: var(--form-xl-switch-border-radius, 16);
--label-font-size: var(--label-xl-font-size, 23);
--label-font-weight: var(--label-xl-font-weight, 700);
--field-min-height: var(--field-xl-min-height, 65);
--field-padding: var(--field-xl-padding, 25);
--field-font-size: var(--field-xl-font-size, 23);
--field-font-weight: var(--field-xl-font-weight, 400);
--field-border-radius: var(--field-xl-border-radius, 5);
--field-placeholder-font-size: var(--field-xl-placeholder-font-size, 23);
--field-placeholder-font-weight: var(--field-xl-placeholder-font-weight, 400);
--field-text-font-size: var(--field-xl-text-font-size, 20);
--field-select-icon-width: var(--field-xl-select-icon-width, 23);
--field-select-icon-height: var(--field-xl-select-icon-height, 12);
}
.ui-form-select:where(.ui-form-select--xs) {
--form-check-font-size: var(--form-xs-font-size, 12);
--form-check-size: var(--form-xs-check-size, 16);
--form-check-gap: var(--form-xs-check-gap, 6);
--form-check-border-radius: var(--form-xs-check-border-radius, 2);
--form-check-background-size: var(--form-xs-check-background-size, 8);
--form-switch-width: var(--form-xs-switch-width, 32);
--form-switch-height: var(--form-xs-switch-height, 20);
--form-switch-dot: var(--form-xs-switch-dot, 14);
--form-switch-gap: var(--form-xs-switch-gap, 6);
--form-switch-border-radius: var(--form-xs-switch-border-radius, 10);
--label-font-size: var(--label-xs-font-size, 13);
--label-font-weight: var(--label-xs-font-weight, 700);
--field-min-height: var(--field-xs-min-height, 35);
--field-padding: var(--field-xs-padding, 10);
--field-font-size: var(--field-xs-font-size, 13);
--field-font-weight: var(--field-xs-font-weight, 400);
--field-border-radius: var(--field-xs-border-radius, 5);
--field-placeholder-font-size: var(--field-xs-placeholder-font-size, 13);
--field-placeholder-font-weight: var(--field-xs-placeholder-font-weight, 400);
--field-text-font-size: var(--field-xs-text-font-size, 11);
--field-select-icon-width: var(--field-xs-select-icon-width, 13);
--field-select-icon-height: var(--field-xs-select-icon-height, 6);
}
.ui-form-select:where(.ui-form-select--sm) {
--form-check-font-size: var(--form-sm-font-size, 13);
--form-check-size: var(--form-sm-check-size, 20);
--form-check-gap: var(--form-sm-check-gap, 8);
--form-check-border-radius: var(--form-sm-check-border-radius, 3);
--form-check-background-size: var(--form-sm-check-background-size, 10);
--form-switch-width: var(--form-sm-switch-width, 40);
--form-switch-height: var(--form-sm-switch-height, 20);
--form-switch-dot: var(--form-sm-switch-dot, 16);
--form-switch-gap: var(--form-sm-switch-gap, 8);
--form-switch-border-radius: var(--form-sm-switch-border-radius, 10);
--label-font-size: var(--label-sm-font-size, 14);
--label-font-weight: var(--label-sm-font-weight, 700);
--field-min-height: var(--field-sm-min-height, 40);
--field-padding: var(--field-sm-padding, 20);
--field-font-size: var(--field-sm-font-size, 14);
--field-font-weight: var(--field-sm-font-weight, 400);
--field-border-radius: var(--field-sm-border-radius, 5);
--field-placeholder-font-size: var(--field-sm-placeholder-font-size, 14);
--field-placeholder-font-weight: var(--field-sm-placeholder-font-weight, 400);
--field-text-font-size: var(--field-sm-text-font-size, 12);
--field-select-icon-width: var(--field-sm-select-icon-width, 14);
--field-select-icon-height: var(--field-sm-select-icon-height, 7);
}
.ui-form-select:where(.ui-form-select--md) {
--form-check-font-size: var(--form-md-font-size, 15);
--form-check-size: var(--form-md-check-size, 24);
--form-check-gap: var(--form-md-check-gap, 10);
--form-check-border-radius: var(--form-md-check-border-radius, 3);
--form-check-background-size: var(--form-md-check-background-size, 10);
--form-switch-width: var(--form-md-switch-width, 48);
--form-switch-height: var(--form-md-switch-height, 24);
--form-switch-dot: var(--form-md-switch-dot, 18);
--form-switch-gap: var(--form-md-switch-gap, 10);
--form-switch-border-radius: var(--form-md-switch-border-radius, 12);
--label-font-size: var(--label-md-font-size, 15);
--label-font-weight: var(--label-md-font-weight, 700);
--field-min-height: var(--field-md-min-height, 45);
--field-padding: var(--field-md-padding, 20);
--field-font-size: var(--field-md-font-size, 16);
--field-font-weight: var(--field-md-font-weight, 400);
--field-border-radius: var(--field-md-border-radius, 5);
--field-placeholder-font-size: var(--field-md-placeholder-font-size, 16);
--field-placeholder-font-weight: var(--field-md-placeholder-font-weight, 400);
--field-text-font-size: var(--field-md-text-font-size, 14);
--field-select-icon-width: var(--field-md-select-icon-width, 16);
--field-select-icon-height: var(--field-md-select-icon-height, 8);
}
.ui-form-select:where(.ui-form-select--lg) {
--form-check-font-size: var(--form-lg-font-size, 16);
--form-check-size: var(--form-lg-check-size, 28);
--form-check-gap: var(--form-lg-check-gap, 12);
--form-check-border-radius: var(--form-lg-check-border-radius, 4);
--form-check-background-size: var(--form-lg-check-background-size, 12);
--form-switch-width: var(--form-lg-switch-width, 56);
--form-switch-height: var(--form-lg-switch-height, 28);
--form-switch-dot: var(--form-lg-switch-dot, 22);
--form-switch-gap: var(--form-lg-switch-gap, 12);
--form-switch-border-radius: var(--form-lg-switch-border-radius, 14);
--label-font-size: var(--label-lg-font-size, 18);
--label-font-weight: var(--label-lg-font-weight, 700);
--field-min-height: var(--field-lg-min-height, 55);
--field-padding: var(--field-lg-padding, 20);
--field-font-size: var(--field-lg-font-size, 18);
--field-font-weight: var(--field-lg-font-weight, 400);
--field-border-radius: var(--field-lg-border-radius, 5);
--field-placeholder-font-size: var(--field-lg-placeholder-font-size, 18);
--field-placeholder-font-weight: var(--field-lg-placeholder-font-weight, 400);
--field-text-font-size: var(--field-lg-text-font-size, 16);
--field-select-icon-width: var(--field-lg-select-icon-width, 18);
--field-select-icon-height: var(--field-lg-select-icon-height, 9);
}
.ui-form-select:where(.ui-form-select--xl) {
--form-check-font-size: var(--form-xl-font-size, 18);
--form-check-size: var(--form-xl-check-size, 32);
--form-check-gap: var(--form-xl-check-gap, 12);
--form-check-border-radius: var(--form-xl-check-border-radius, 6);
--form-check-background-size: var(--form-xl-check-background-size, 14);
--form-switch-width: var(--form-xl-switch-width, 64);
--form-switch-height: var(--form-xl-switch-height, 32);
--form-switch-dot: var(--form-xl-switch-dot, 24);
--form-switch-gap: var(--form-xl-switch-gap, 12);
--form-switch-border-radius: var(--form-xl-switch-border-radius, 16);
--label-font-size: var(--label-xl-font-size, 23);
--label-font-weight: var(--label-xl-font-weight, 700);
--field-min-height: var(--field-xl-min-height, 65);
--field-padding: var(--field-xl-padding, 25);
--field-font-size: var(--field-xl-font-size, 23);
--field-font-weight: var(--field-xl-font-weight, 400);
--field-border-radius: var(--field-xl-border-radius, 5);
--field-placeholder-font-size: var(--field-xl-placeholder-font-size, 23);
--field-placeholder-font-weight: var(--field-xl-placeholder-font-weight, 400);
--field-text-font-size: var(--field-xl-text-font-size, 20);
--field-select-icon-width: var(--field-xl-select-icon-width, 23);
--field-select-icon-height: var(--field-xl-select-icon-height, 12);
}
.form-control.ui-form-control {
color: var(--field-color);
background: var(--field-background);
border: var(--field-border);
border-radius: calc(1rem * var(--field-border-radius) / 16);
min-height: calc(1rem * var(--field-min-height) / 16);
font-size: calc(1rem * var(--field-font-size) / 16);
font-weight: var(--field-font-weight);
padding: 0 calc(1rem * var(--field-padding) / 16);
}
.form-control.ui-form-control::placeholder {
font-size: calc(1rem * var(--field-placeholder-font-size) / 16);
font-weight: var(--field-placeholder-font-weight);
font-style: var(--field-placeholder-font-style);
color: var(--field-placeholder-color);
opacity: var(--field-placeholder-opacity);
}
.form-control.ui-form-control[readonly] {
background: var(--field-readonly-background);
}
.form-control.ui-form-control[disabled] {
background: var(--field-disabled-background);
opacity: var(--field-disabled-opacity);
cursor: not-allowed;
}
textarea.form-control.ui-form-control {
padding-top: calc(1rem * var(--field-padding) / 2 / 16);
}
.form-select.ui-form-select {
position: relative;
width: auto;
color: var(--field-color);
background-color: var(--field-select-background);
background-image: var(--field-select-icon);
background-repeat: no-repeat;
background-size: calc(1rem * var(--field-select-icon-width) / 16) calc(1rem * var(--field-select-icon-height) / 16);
background-position: right calc(1rem * var(--field-padding) / 16) center;
border: var(--field-border);
border-radius: calc(1rem * var(--field-border-radius) / 16);
min-height: calc(1rem * var(--field-min-height) / 16);
font-size: calc(1rem * var(--field-font-size) / 16);
font-weight: var(--field-font-weight);
padding: 0 calc(1rem * var(--field-padding) / 16);
padding-right: calc(1rem * (var(--field-padding) * 2 + var(--field-select-icon-width)) / 16);
}
.form-select.ui-form-select:has(option:checked[value=""]) {
font-size: calc(1rem * var(--field-placeholder-font-size) / 16);
font-weight: var(--field-placeholder-font-weight);
font-style: var(--field-placeholder-font-style);
color: var(--field-placeholder-color);
}
.form-select.ui-form-select[disabled] {
background: var(--field-disabled-background);
opacity: var(--field-disabled-opacity);
cursor: not-allowed;
}
.form-select.ui-form-select optgroup, .form-select.ui-form-select option {
font-size: calc(1rem * var(--field-font-size) / 16);
font-weight: normal;
font-style: normal;
color: var(--field-color);
}
.form-select.ui-form-select optgroup {
font-weight: 700;
}
.form-select.ui-form-select option {
background: var(--field-select-dropdown-background);
}
.form-select.ui-form-select option[selected] {
font-weight: var(--field-font-weight);
}
.fragment {
position: relative;
}
html.admin .fragment {
border: 1px solid var(--ui-border-color, #b6c2d9);
border-radius: 6px;
margin: 8px 0;
background: rgba(108, 117, 125, 0.04);
}
.ui-icon {
display: inline-block;
flex-shrink: 0;
width: 1em;
height: 1em;
vertical-align: -0.125em;
overflow: visible;
}
.ui-icon.ui-icon--2xs {
font-size: 0.625em;
}
.ui-icon.ui-icon--xs {
font-size: 0.75em;
}
.ui-icon.ui-icon--sm {
font-size: 0.875em;
}
.ui-icon.ui-icon--lg {
font-size: 1.25em;
}
.ui-icon.ui-icon--xl {
font-size: 1.5em;
}
.ui-icon.ui-icon--2xl, .ui-icon.ui-icon--2x {
font-size: 2em;
}
.ui-icon.ui-icon--3x {
font-size: 3em;
}
.ui-icon.ui-icon--4x {
font-size: 4em;
}
.ui-icon.ui-icon--5x {
font-size: 5em;
}
.ui-icon.ui-icon--6x {
font-size: 6em;
}
.ui-icon.ui-icon--7x {
font-size: 7em;
}
.ui-icon.ui-icon--8x {
font-size: 8em;
}
.ui-icon.ui-icon--9x {
font-size: 9em;
}
.ui-icon.ui-icon--10x {
font-size: 10em;
}
.ui-icon.ui-icon--fw {
width: 1.25em;
}
.ui-icon.ui-icon--spin {
animation: ui-icon-spin 2s linear infinite;
}
.ui-icon.ui-icon--flip {
transform: scaleX(-1);
}
@keyframes ui-icon-spin {
to {
transform: rotate(360deg);
}
}
.ui-image {
position: relative;
}
.ui-image::before {
content: "";
position: absolute;
inset: 0;
background: var(--ui-image-background, #ccc);
}
.ui-image::after {
content: "";
position: absolute;
inset: 0;
background-image: var(--ui-image-background-image, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='2' x2='22' y1='2' y2='22'/%3E%3Cpath d='M7 7H4a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h16'/%3E%3Cpath d='M9.5 4h5L17 7h3a2 2 0 0 1 2 2v7.5'/%3E%3Cpath d='M14.121 15.121A3 3 0 1 1 9.88 10.88'/%3E%3C/svg%3E"));
background-repeat: no-repeat;
background-size: var(--ui-image-background-size, min(50%, 10em));
background-position: 50%;
opacity: var(--ui-image-background-opacity, 0.35);
}
.ui-image--wide {
display: block;
width: 100%;
}
.ui-image--wide img {
width: 100%;
height: auto;
}
.ui-image--left {
float: left;
margin: 0.5rem 0.5rem 0.5rem 0;
}
.ui-image--right {
float: right;
margin: 0.5rem 0 0.5rem 0.5rem;
}
.ui-image--center {
display: block;
margin-left: auto;
margin-right: auto;
}
html.admin:has(.ui-impersonation-banner) {
--impersonation-banner-height: 2.8125rem;
}
:root {
--form-check-font-size: var(--form-md-font-size, 15);
--form-check-size: var(--form-md-check-size, 24);
--form-check-gap: var(--form-md-check-gap, 10);
--form-check-border-radius: var(--form-md-check-border-radius, 3);
--form-check-background-size: var(--form-md-check-background-size, 10);
--form-switch-width: var(--form-md-switch-width, 48);
--form-switch-height: var(--form-md-switch-height, 24);
--form-switch-dot: var(--form-md-switch-dot, 18);
--form-switch-gap: var(--form-md-switch-gap, 10);
--form-switch-border-radius: var(--form-md-switch-border-radius, 12);
--form-check-color: var(--secondary);
--form-check-color--checked: var(--secondary);
--form-check-color--hover: var(--primary);
}
.form-check.ui-check {
display: flex;
align-items: center;
margin-bottom: 0;
padding-left: 0;
}
.form-check.ui-check:not(.form-switch) {
gap: calc(1rem * var(--form-check-gap) / 16);
min-height: calc(1rem * var(--form-check-size) / 16);
}
.form-check.ui-check.form-check--flipped {
flex-direction: row-reverse;
}
.form-check.ui-check:where(.form-check--xs) {
--form-check-font-size: var(--form-xs-font-size, 12);
--form-check-size: var(--form-xs-check-size, 16);
--form-check-gap: var(--form-xs-check-gap, 6);
--form-check-border-radius: var(--form-xs-check-border-radius, 2);
--form-check-background-size: var(--form-xs-check-background-size, 8);
--form-switch-width: var(--form-xs-switch-width, 32);
--form-switch-height: var(--form-xs-switch-height, 20);
--form-switch-dot: var(--form-xs-switch-dot, 14);
--form-switch-gap: var(--form-xs-switch-gap, 6);
--form-switch-border-radius: var(--form-xs-switch-border-radius, 10);
}
.form-check.ui-check:where(.form-check--sm) {
--form-check-font-size: var(--form-sm-font-size, 13);
--form-check-size: var(--form-sm-check-size, 20);
--form-check-gap: var(--form-sm-check-gap, 8);
--form-check-border-radius: var(--form-sm-check-border-radius, 3);
--form-check-background-size: var(--form-sm-check-background-size, 10);
--form-switch-width: var(--form-sm-switch-width, 40);
--form-switch-height: var(--form-sm-switch-height, 20);
--form-switch-dot: var(--form-sm-switch-dot, 16);
--form-switch-gap: var(--form-sm-switch-gap, 8);
--form-switch-border-radius: var(--form-sm-switch-border-radius, 10);
}
.form-check.ui-check:where(.form-check--md) {
--form-check-font-size: var(--form-md-font-size, 15);
--form-check-size: var(--form-md-check-size, 24);
--form-check-gap: var(--form-md-check-gap, 10);
--form-check-border-radius: var(--form-md-check-border-radius, 3);
--form-check-background-size: var(--form-md-check-background-size, 10);
--form-switch-width: var(--form-md-switch-width, 48);
--form-switch-height: var(--form-md-switch-height, 24);
--form-switch-dot: var(--form-md-switch-dot, 18);
--form-switch-gap: var(--form-md-switch-gap, 10);
--form-switch-border-radius: var(--form-md-switch-border-radius, 12);
}
.form-check.ui-check:where(.form-check--lg) {
--form-check-font-size: var(--form-lg-font-size, 16);
--form-check-size: var(--form-lg-check-size, 28);
--form-check-gap: var(--form-lg-check-gap, 12);
--form-check-border-radius: var(--form-lg-check-border-radius, 4);
--form-check-background-size: var(--form-lg-check-background-size, 12);
--form-switch-width: var(--form-lg-switch-width, 56);
--form-switch-height: var(--form-lg-switch-height, 28);
--form-switch-dot: var(--form-lg-switch-dot, 22);
--form-switch-gap: var(--form-lg-switch-gap, 12);
--form-switch-border-radius: var(--form-lg-switch-border-radius, 14);
}
.form-check.ui-check:where(.form-check--xl) {
--form-check-font-size: var(--form-xl-font-size, 18);
--form-check-size: var(--form-xl-check-size, 32);
--form-check-gap: var(--form-xl-check-gap, 12);
--form-check-border-radius: var(--form-xl-check-border-radius, 6);
--form-check-background-size: var(--form-xl-check-background-size, 14);
--form-switch-width: var(--form-xl-switch-width, 64);
--form-switch-height: var(--form-xl-switch-height, 32);
--form-switch-dot: var(--form-xl-switch-dot, 24);
--form-switch-gap: var(--form-xl-switch-gap, 12);
--form-switch-border-radius: var(--form-xl-switch-border-radius, 16);
}
.form-check.ui-check .form-check-input {
margin-left: 0;
}
.form-check.ui-check .form-check-label {
user-select: none;
font-size: calc(1rem * var(--form-check-font-size) / 16);
}
.form-check.ui-check .form-check-input[type=checkbox] {
flex-shrink: 0;
width: calc(1rem * var(--form-check-size) / 16);
height: calc(1rem * var(--form-check-size) / 16);
border: var(--form-check-border, 1px solid var(--primary));
border-radius: calc(1rem * var(--form-check-border-radius) / 16);
float: none;
}
.form-check.ui-check .form-check-input[type=checkbox]:checked {
background-image: var(--form-check-background-image, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2.49 2.49'%3E%3Cpath d='M.88 2.14a.23.23 0 01-.1-.03 10.69 10.69 0 01-.74-.75.2.2 0 01-.03-.12v-.08a.2.2 0 01.1-.1.19.19 0 01.1-.03.2.2 0 01.13.04l.3.28.27.28.61-.62.64-.63a.26.26 0 01.07-.04h.1a.2.2 0 01.15.14V.6l-.04.07A201.5 201.5 0 01.97 2.13a.24.24 0 01-.1.01z' fill='%23fff'/%3E%3C/svg%3E"));
background-size: calc(1rem * var(--form-check-background-size) / 16);
}
.form-check.ui-check .form-check-input[type=checkbox]:checked ~ .form-check-label {
font-weight: var(--form-check-font-weight--checked, 400);
color: var(--form-check-color--checked, var(--primary));
}
.form-check.ui-check .form-check-input[type=checkbox]:focus-visible {
border-color: var(--form-check-border-color--focus, var(--primary));
box-shadow: var(--form-check-box-shadow--focus, 0 0 0 0.25rem var(--primary-shadow));
}
.form-check.ui-check .form-check-input[type=checkbox] ~ .form-check-label {
font-weight: var(--form-check-font-weight, 400);
color: var(--form-check-color, var(--primary));
}
.form-check.ui-check:hover:not(:disabled) .form-check-label {
color: var(--form-check-color--hover, var(--primary)) !important;
}
.form-check.ui-check.form-switch {
gap: calc(1rem * var(--form-switch-gap) / 16);
min-height: calc(1rem * var(--form-switch-height) / 16);
margin-bottom: 0;
}
.form-check.ui-check.form-switch .form-check-input {
width: calc(1rem * var(--form-switch-width) / 16);
height: calc(1rem * var(--form-switch-height) / 16);
background-image: none;
border: var(--form-switch-border, 1px solid transparent);
background-color: var(--form-switch-background-color, #d3d3d3);
border-radius: calc(1rem * var(--form-switch-border-radius) / 16);
float: none;
position: relative;
flex-shrink: 0;
}
.form-check.ui-check.form-switch .form-check-input:focus-visible {
border: var(--form-switch-border--focus, 1px solid transparent);
box-shadow: var(--form-switch-box-shadow--focus, 0 0 0 0.25rem var(--primary-shadow));
}
.form-check.ui-check.form-switch .form-check-input ~ .form-check-label {
font-weight: var(--form-switch-font-weight, 400);
color: var(--form-switch-color, var(--primary));
}
.form-check.ui-check.form-switch .form-check-input::before {
content: "";
position: absolute;
inset-inline-start: calc((calc(1rem * var(--form-switch-height) / 16) - calc(1rem * var(--form-switch-dot) / 16)) / 2);
inset-block-start: calc((calc(1rem * var(--form-switch-height) / 16) - 0.125rem - calc(1rem * var(--form-switch-dot) / 16)) / 2);
display: block;
width: calc(1rem * var(--form-switch-dot) / 16);
height: calc(1rem * var(--form-switch-dot) / 16);
background: var(--form-switch-dot-color, #fff);
border-radius: 50%;
transition-property: transform, background;
transition-duration: 0.15s;
transition-timing-function: ease-in-out;
}
.form-check.ui-check.form-switch .form-check-input:checked {
background: var(--form-switch-background-color--checked, var(--primary));
}
.form-check.ui-check.form-switch .form-check-input:checked ~ .form-check-label {
font-weight: var(--form-switch-font-weight--checked, 400);
color: var(--form-switch-color--checked, var(--primary));
}
.form-check.ui-check.form-switch .form-check-input:checked::before {
transform: translateX(calc(calc(1rem * var(--form-switch-width) / 16) - 0.125rem - calc(1rem * var(--form-switch-height) / 16)));
background: var(--form-switch-dot-color--checked, var(--primary-fg));
}
input[type=checkbox].form-control {
width: initial;
}
.form-control.ui-form-control[type=date] {
appearance: none;
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNSIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBmaWxsPSJXaW5kb3dUZXh0IiBkPSJNMjAgM2gtMVYxaC0ydjJIN1YxSDV2Mkg0Yy0xLjEgMC0yIC45LTIgMnYxNmMwIDEuMS45IDIgMiAyaDE2YzEuMSAwIDItLjkgMi0yVjVjMC0xLjEtLjktMi0yLTJ6bTAgMThINFY4aDE2djEzeiIvPjxwYXRoIGZpbGw9Im5vbmUiIGQ9Ik0wIDBoMjR2MjRIMHoiLz48L3N2Zz4=");
background-repeat: no-repeat;
background-position: calc(100% - 1.375rem) center;
background-size: 0.75rem;
}
.form-control.ui-form-control[type=date]::-webkit-calendar-picker-indicator {
display: none;
-webkit-appearance: none;
}
.form-control.ui-form-control[type=datetime-local] {
appearance: none;
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNSIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBmaWxsPSJXaW5kb3dUZXh0IiBkPSJNMjAgM2gtMVYxaC0ydjJIN1YxSDV2Mkg0Yy0xLjEgMC0yIC45LTIgMnYxNmMwIDEuMS45IDIgMiAyaDE2YzEuMSAwIDItLjkgMi0yVjVjMC0xLjEtLjktMi0yLTJ6bTAgMThINFY4aDE2djEzeiIvPjxwYXRoIGZpbGw9Im5vbmUiIGQ9Ik0wIDBoMjR2MjRIMHoiLz48L3N2Zz4=");
background-repeat: no-repeat;
background-position: calc(100% - 1.375rem) center;
background-size: 0.75rem;
}
.form-control.ui-form-control[type=datetime-local]::-webkit-calendar-picker-indicator {
display: none;
-webkit-appearance: none;
}
.clickable:hover {
cursor: pointer;
}
.form-label,
.form-control,
.form-select {
font-size: 14px;
}
.form-select {
background-size: calc(0.75em + 0.375rem);
background-position: right 1em top 50%;
}
textarea.form-control {
min-height: calc(1.5em * 4 + 0.75rem + 2px);
}
.input-wrapper.color-input .transparent-label {
margin-right: 8px;
}
:root {
--form-radio-background-size: var(--form-md-radio-background-size, 10);
}
.form-check.ui-check:has(input[type=radio]).form-check--xs {
--form-radio-background-size: var(--form-xs-radio-background-size, 8);
}
.form-check.ui-check:has(input[type=radio]).form-check--sm {
--form-radio-background-size: var(--form-sm-radio-background-size, 10);
}
.form-check.ui-check:has(input[type=radio]).form-check--md {
--form-radio-background-size: var(--form-md-radio-background-size, 10);
}
.form-check.ui-check:has(input[type=radio]).form-check--lg {
--form-radio-background-size: var(--form-lg-radio-background-size, 12);
}
.form-check.ui-check:has(input[type=radio]).form-check--xl {
--form-radio-background-size: var(--form-xl-radio-background-size, 14);
}
.form-check.ui-check .form-check-input[type=radio] {
flex-shrink: 0;
width: calc(1rem * var(--form-check-size) / 16);
height: calc(1rem * var(--form-check-size) / 16);
border: var(--form-check-border, 1px solid var(--primary));
float: none;
}
.form-check.ui-check .form-check-input[type=radio]:checked {
background-image: var(--form-radio-background-image, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2.49 2.49'%3E%3Cpath d='M.88 2.14a.23.23 0 01-.1-.03 10.69 10.69 0 01-.74-.75.2.2 0 01-.03-.12v-.08a.2.2 0 01.1-.1.19.19 0 01.1-.03.2.2 0 01.13.04l.3.28.27.28.61-.62.64-.63a.26.26 0 01.07-.04h.1a.2.2 0 01.15.14V.6l-.04.07A201.5 201.5 0 01.97 2.13a.24.24 0 01-.1.01z' fill='%23fff'/%3E%3C/svg%3E"));
background-size: calc(1rem * var(--form-radio-background-size) / 16);
}
.form-check.ui-check .form-check-input[type=radio]:checked ~ .form-check-label {
font-weight: var(--form-check-font-weight--checked, 400);
color: var(--form-check-color--checked, var(--primary));
}
.form-check.ui-check .form-check-input[type=radio]:focus-visible {
border-color: var(--form-check-border-color--focus, var(--primary));
box-shadow: var(--form-check-box-shadow--focus, 0 0 0 0.25rem var(--primary-shadow));
}
.form-check.ui-check .form-check-input[type=radio] ~ .form-check-label {
font-weight: var(--form-check-font-weight, 400);
color: var(--form-check-color, var(--primary));
}
.form-check.ui-check:hover:not(:disabled) .form-check-label {
color: var(--form-check-color--hover, var(--primary)) !important;
}
:root {
--range-track-height: 0.75rem;
--range-track-background: #fff;
--range-track-fill: var(--primary);
--range-track-border: 1px solid #ced4da;
--range-track-border-radius: 0.25rem;
--range-thumb-size: 1.5rem;
--range-thumb-background: var(--primary);
--percentage: 0%;
}
input[type=range] {
-webkit-appearance: none;
appearance: none;
background: transparent;
cursor: pointer;
background-image: linear-gradient(90deg, var(--range-track-fill) var(--percentage), transparent var(--percentage));
}
input[type=range]:focus-visible {
outline: none;
}
input[type=range]:focus-visible::-webkit-slider-thumb {
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}
input[type=range]:focus-visible::-moz-range-thumb {
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}
input[type=range]::-webkit-slider-runnable-track {
border-radius: var(--range-track-border-radius);
background: var(--range-track-background);
border: var(--range-track-border);
height: var(--range-track-height);
}
input[type=range]::-moz-range-track {
border-radius: var(--range-track-border-radius);
background: var(--range-track-background);
border: var(--range-track-border);
height: var(--range-track-height);
}
input[type=range]::-webkit-slider-thumb {
-webkit-appearance: none;
appearance: none;
margin-top: calc(var(--range-track-height) / 2 - var(--range-thumb-size) / 2);
background: var(--range-thumb-background);
border: 0;
width: var(--range-thumb-size);
height: var(--range-thumb-size);
border-radius: 50%;
}
input[type=range]::-moz-range-thumb {
background: var(--range-thumb-background);
border: 0;
border-radius: 50%;
width: var(--range-thumb-size);
height: var(--range-thumb-size);
}
.price-editor {
display: flex;
align-items: stretch;
gap: 0.5rem;
width: 100%;
min-width: 0;
--price-symbol-bg: rgba(0, 0, 0, 0.05);
--price-symbol-border: 1px solid rgba(0, 0, 0, 0.12);
--price-symbol-radius: 6px;
--price-symbol-font-size: 0.95rem;
}
.price-editor .currency-symbol {
display: flex;
align-items: center;
justify-content: center;
padding: 0 0.65rem;
background: var(--price-symbol-bg);
border: var(--price-symbol-border);
border-radius: var(--price-symbol-radius);
font-weight: 600;
font-size: var(--price-symbol-font-size);
color: #333;
user-select: none;
flex: 0 0 auto;
aspect-ratio: 1;
box-sizing: border-box;
border-top-right-radius: 0px;
border-bottom-right-radius: 0px;
}
.price-editor .price-field {
flex: 1 1 auto;
min-width: 0;
display: block;
position: relative;
left: -10px;
width: 100%;
}
.price-editor .price-field .mb-3 {
min-width: 400px;
margin-bottom: 0 !important;
}
.price-editor .price-field :where(input) {
height: 100%;
width: 100%;
min-width: 0;
box-sizing: border-box;
margin: 0;
padding-top: 0;
padding-bottom: 0;
border-top-left-radius: 0px;
border-bottom-left-radius: 0px;
}
.price-editor:focus-within .currency-symbol {
border-color: rgba(0, 115, 255, 0.35);
box-shadow: 0 0 0 3px rgba(0, 115, 255, 0.12);
}
.price-editor:has(input[disabled]), .price-editor.disabled {
opacity: 0.6;
pointer-events: none;
}
.price-editor.small {
--price-symbol-font-size: 0.85rem;
gap: 0.35rem;
}
.price-editor.small .currency-symbol {
padding: 0 0.5rem;
}
[dir=rtl] .price-editor,
.price-editor.rtl {
direction: rtl;
}
[dir=rtl] .price-editor .currency-symbol,
.price-editor.rtl .currency-symbol {
order: 2;
}
[dir=rtl] .price-editor .price-field,
.price-editor.rtl .price-field {
order: 1;
}
[data-ui-needs~=visually-hidden] .sr-only,
[data-ui-needs~=visually-hidden] .visually-hidden {
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;
}
[data-ui-needs~=base] .hidden,
[data-ui-needs~=base] .hidden-by-modal {
display: none !important;
}
[data-ui-needs~=dropdown] .ui-dropdown {
position: relative;
}
[data-ui-needs~=dropdown] .ui-dropdown__menu {
position: absolute;
top: 100%;
left: 0;
z-index: 1000;
min-width: 10rem;
margin: 0;
padding: 0.25rem 0;
list-style: none;
background-color: var(--ui-surface, #fff);
border: 1px solid var(--ui-border-color, rgba(0, 0, 0, 0.15));
}
[data-ui-needs~=grid] .ui-container {
width: 100%;
margin-right: auto;
margin-left: auto;
padding-right: 0.75rem;
padding-left: 0.75rem;
}
:root {
--ui-link-font-size: var(--ui-link-md-font-size, 16);
--ui-link-font-weight: var(--ui-link-md-font-weight, 700);
--ui-link-icon: var(--ui-link-md-icon, 22);
--ui-link-gap: var(--ui-link-md-gap, 10);
}
.ui-link--nowrap {
white-space: nowrap;
}
.ui-link-xs, .ui-link--xs {
--ui-link-font-size: var(--ui-link-xs-font-size, 13);
--ui-link-font-weight: var(--ui-link-xs-font-weight, 400);
--ui-link-icon: var(--ui-link-xs-icon, 10);
--ui-link-gap: var(--ui-link-xs-gap, 10);
}
.ui-link-sm, .ui-link--sm {
--ui-link-font-size: var(--ui-link-sm-font-size, 15);
--ui-link-font-weight: var(--ui-link-sm-font-weight, 400);
--ui-link-icon: var(--ui-link-sm-icon, 20);
--ui-link-gap: var(--ui-link-sm-gap, 10);
}
.ui-link-md, .ui-link--md {
--ui-link-font-size: var(--ui-link-md-font-size, 16);
--ui-link-font-weight: var(--ui-link-md-font-weight, 700);
--ui-link-icon: var(--ui-link-md-icon, 22);
--ui-link-gap: var(--ui-link-md-gap, 10);
}
.ui-link-lg, .ui-link--lg {
--ui-link-font-size: var(--ui-link-lg-font-size, 18);
--ui-link-font-weight: var(--ui-link-lg-font-weight, 700);
--ui-link-icon: var(--ui-link-lg-icon, 24);
--ui-link-gap: var(--ui-link-lg-gap, 10);
}
.ui-link-xl, .ui-link--xl {
--ui-link-font-size: var(--ui-link-xl-font-size, 20);
--ui-link-font-weight: var(--ui-link-xl-font-weight, 700);
--ui-link-icon: var(--ui-link-xl-icon, 26);
--ui-link-gap: var(--ui-link-xl-gap, 12);
}
a:where(.ui-link),
button:where(.ui-link),
input[type=button]:where(.ui-link),
input[type=submit]:where(.ui-link),
input[type=reset]:where(.ui-link) {
cursor: pointer;
display: inline-flex;
align-items: center;
color: var(--ui-link-color, var(--primary));
white-space: normal;
font-size: calc(1rem * var(--ui-link-font-size) / 16);
font-weight: var(--ui-link-font-weight);
gap: calc(1rem * var(--ui-link-gap) / 16);
}
a:where(.ui-link):not(:has(*)), a:where(.ui-link):has(> :last-child:nth-child(1)),
button:where(.ui-link):not(:has(*)),
button:where(.ui-link):has(> :last-child:nth-child(1)),
input[type=button]:where(.ui-link):not(:has(*)),
input[type=button]:where(.ui-link):has(> :last-child:nth-child(1)),
input[type=submit]:where(.ui-link):not(:has(*)),
input[type=submit]:where(.ui-link):has(> :last-child:nth-child(1)),
input[type=reset]:where(.ui-link):not(:has(*)),
input[type=reset]:where(.ui-link):has(> :last-child:nth-child(1)) {
text-decoration: var(--ui-link-text-decoration, none);
}
a:where(.ui-link):not(:has(*)):hover, a:where(.ui-link):has(> :last-child:nth-child(1)):hover,
button:where(.ui-link):not(:has(*)):hover,
button:where(.ui-link):has(> :last-child:nth-child(1)):hover,
input[type=button]:where(.ui-link):not(:has(*)):hover,
input[type=button]:where(.ui-link):has(> :last-child:nth-child(1)):hover,
input[type=submit]:where(.ui-link):not(:has(*)):hover,
input[type=submit]:where(.ui-link):has(> :last-child:nth-child(1)):hover,
input[type=reset]:where(.ui-link):not(:has(*)):hover,
input[type=reset]:where(.ui-link):has(> :last-child:nth-child(1)):hover {
text-decoration: var(--ui-link-text-decoration-hover, underline);
}
a:where(.ui-link):has(:nth-child(2)):not(:has(span)),
button:where(.ui-link):has(:nth-child(2)):not(:has(span)),
input[type=button]:where(.ui-link):has(:nth-child(2)):not(:has(span)),
input[type=submit]:where(.ui-link):has(:nth-child(2)):not(:has(span)),
input[type=reset]:where(.ui-link):has(:nth-child(2)):not(:has(span)) {
text-decoration: var(--ui-link-text-decoration, none);
}
a:where(.ui-link):has(:nth-child(2)):not(:has(span)):hover,
button:where(.ui-link):has(:nth-child(2)):not(:has(span)):hover,
input[type=button]:where(.ui-link):has(:nth-child(2)):not(:has(span)):hover,
input[type=submit]:where(.ui-link):has(:nth-child(2)):not(:has(span)):hover,
input[type=reset]:where(.ui-link):has(:nth-child(2)):not(:has(span)):hover {
text-decoration: var(--ui-link-text-decoration-hover, underline);
}
a:where(.ui-link):has(:nth-child(2)):has(span),
button:where(.ui-link):has(:nth-child(2)):has(span),
input[type=button]:where(.ui-link):has(:nth-child(2)):has(span),
input[type=submit]:where(.ui-link):has(:nth-child(2)):has(span),
input[type=reset]:where(.ui-link):has(:nth-child(2)):has(span) {
text-decoration: none;
}
a:where(.ui-link):has(:nth-child(2)):has(span) > span,
button:where(.ui-link):has(:nth-child(2)):has(span) > span,
input[type=button]:where(.ui-link):has(:nth-child(2)):has(span) > span,
input[type=submit]:where(.ui-link):has(:nth-child(2)):has(span) > span,
input[type=reset]:where(.ui-link):has(:nth-child(2)):has(span) > span {
text-decoration: var(--ui-link-text-decoration, none);
}
a:where(.ui-link):has(:nth-child(2)):has(span):hover > span,
button:where(.ui-link):has(:nth-child(2)):has(span):hover > span,
input[type=button]:where(.ui-link):has(:nth-child(2)):has(span):hover > span,
input[type=submit]:where(.ui-link):has(:nth-child(2)):has(span):hover > span,
input[type=reset]:where(.ui-link):has(:nth-child(2)):has(span):hover > span {
text-decoration: var(--ui-link-text-decoration-hover, underline);
}
a:where(.ui-link) > svg,
button:where(.ui-link) > svg,
input[type=button]:where(.ui-link) > svg,
input[type=submit]:where(.ui-link) > svg,
input[type=reset]:where(.ui-link) > svg {
max-width: calc(1rem * var(--ui-link-icon) / 16);
height: calc(1rem * var(--ui-link-icon) / 16);
flex-shrink: 0;
text-decoration: none !important;
}
a:where(.ui-link) > :is(i, .ui-icon),
button:where(.ui-link) > :is(i, .ui-icon),
input[type=button]:where(.ui-link) > :is(i, .ui-icon),
input[type=submit]:where(.ui-link) > :is(i, .ui-icon),
input[type=reset]:where(.ui-link) > :is(i, .ui-icon) {
flex-shrink: 0;
text-decoration: none !important;
}
a:where(.ui-link):hover,
button:where(.ui-link):hover,
input[type=button]:where(.ui-link):hover,
input[type=submit]:where(.ui-link):hover,
input[type=reset]:where(.ui-link):hover {
color: var(--ui-link-hover, var(--primary-hover));
}
a:where(.ui-link):focus-visible,
button:where(.ui-link):focus-visible,
input[type=button]:where(.ui-link):focus-visible,
input[type=submit]:where(.ui-link):focus-visible,
input[type=reset]:where(.ui-link):focus-visible {
outline: 1px dotted currentColor;
}
a:where(.ui-link)[inert],
button:where(.ui-link)[inert],
input[type=button]:where(.ui-link)[inert],
input[type=submit]:where(.ui-link)[inert],
input[type=reset]:where(.ui-link)[inert] {
opacity: 0.5;
}
.loading {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
justify-content: center;
align-items: center;
gap: 0.5rem;
height: 100%;
font-size: 0.875rem;
font-weight: 700;
}
@keyframes loading_rotation {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(270deg);
}
}
@keyframes loading_text {
0% {
opacity: 0;
}
100% {
opacity: 100;
}
}
@keyframes loading_colours {
0% {
stroke: #9E40B5;
}
50% {
stroke: #350EE5;
}
100% {
stroke: #100862;
}
}
@keyframes loading_dash {
0% {
stroke-dashoffset: 207;
}
50% {
stroke-dashoffset: 51.75;
transform: rotate(135deg);
}
100% {
stroke-dashoffset: 207;
transform: rotate(450deg);
}
}
:root {
--paginator-background: var(--site-bg, #fff);
}
.shopping-cart {
display: flex;
flex-direction: column;
gap: 1.25rem;
}
.shopping-cart {
}
@media only screen and (min-width: 800px) {
.shopping-cart {
}
}
@media only screen and (min-width: 1360px) {
.shopping-cart {
}
}
#sp-container {
min-height: 180px !important;
}
#sp-container #payment-iframe {
min-height: 180px !important;
}
body[data-scroll-fixed=true] {
position: fixed;
top: calc(-1 * var(--page-scroll-y));
width: 100%;
}
:root {
--carousel-preview-size: 17.4375rem;
--carousel-thumbnail-size: 4.75rem;
--carousel-thumbnail-background: #fff;
--carousel-thumbnail-border-radius: 0.625rem;
--carousel-thumbnail-border: 3px solid transparent;
--carousel-thumbnail-border--active: 3px solid #0E58B5;
--carousel-thumbnail-label-background: #999;
--carousel-thumbnail-gradient: linear-gradient(225deg, rgba(255, 255, 255, 0) 0%, rgba(74, 74, 73, 0.10) 100%);
--carousel-lightbox-background: rgba(0,0,0, .8);
}
body:has(.ui-product-images__slide[open]) {
overflow: hidden;
}
body:has(.ui-product-view__price-info) #react-root {
padding-bottom: 8.4375rem;
}
@media only screen and (min-width: 600px) {
body:has(.ui-product-view__price-info) #react-root {
padding-bottom: 0;
}
}
.search {
position: relative;
}
.search .suggestions {
position: absolute;
width: 100%;
background: #fff;
border: 1px solid #ccc;
z-index: 3000;
max-height: 15.625rem;
overflow-y: auto;
}
.textarea--tinymce {
display: none;
}
.uploader {
--uploader-width: 16rem;
--uploader-compact-width: 6.25rem;
--uploader-icon-width: 6rem;
--focal-target-color: #fff;
--focal-target-size: 3rem;
--focal-target-size-half: -1.5rem;
--focal-target-size-quarter: 0.75rem;
--focal-target-border-width: 0.125rem;
}