:root {
    --c-ml-purple: #9E00C4;
    --c-ml-fuschia: #C40088;
    --c-ml-blue: #0088C4;
    --c-ml-light-purple: #F5E6F9;
    --c-ml-turquoise: #00C4A3;
    --c-ml-rank-1: #C9B037;
    --c-ml-rank-2: #B4B4B4;
    --c-ml-rank-3: #AD8A56;
}

.fs-p6em {
    font-size: 0.6em;
}

.fs-p7em {
    font-size: 0.7em;
}

.fs-p8em {
    font-size: 0.8em;
}

.ws-pre-wrap {
    white-space: pre-wrap;
}

.bg-fuschia {
    background-color: var(--c-ml-fuschia) !important;
}

.text-fuschia {
    color: var(--c-ml-fuschia) !important;
}

.text-blue {
    color: var(--c-ml-blue) !important;
}

.bg-light-purple {
    background-color: var(--c-ml-light-purple) !important;
}

.bg-purple {
    background-color: var(--c-ml-purple) !important;
}

.bg-hover-purple:hover {
    background-color: var(--c-ml-purple) !important;
}

.border-purple {
    border-color: var(--c-ml-purple) !important;
}

.text-purple {
    color: var(--c-ml-purple) !important;
}

.text-hover-white:hover {
    color: white !important;
}

.bg-turquoise {
    background-color: var(--c-ml-turquoise) !important;
}

.border-turquoise {
    border-color: var(--c-ml-turquoise) !important;
}

.text-turquoise {
    color: var(--c-ml-turquoise) !important;
}

.htmx-indicator:not(.persistent):not(.htmx-request) {
    display: none;
}

.htmx-indicator.persistent:not(.htmx-request) {
    opacity: 0;
    transition-delay: 3s;
}

.htmx-indicator.persistent.htmx-request {
    opacity: 1;
    transition-delay: 0s;
    transition-duration: 0s;
    /*transition-duration: 1s;*/
    /*transition-property: opacity;*/
}

nav {
    z-index: 999999;
}

.safe-bottom {
    padding-bottom: env(safe-area-inset-bottom) !important;
}

.pointer:hover {
    cursor: pointer;
}

.rank-1 {
    border-color: var(--c-ml-rank-1);
    color: var(--c-ml-rank-1);
}

.rank-2 {
    border-color: var(--c-ml-rank-2);
    color: var(--c-ml-rank-2);
}

.rank-3 {
    border-color: var(--c-ml-rank-3);
    color: var(--c-ml-rank-3);
}

#current-leagues .card .card-footer.outstanding {
    background-color: var(--c-ml-light-purple) !important;
    color: var(--c-ml-purple) !important;
}

body {
    font-family: 'Poppins', sans-serif !important;
}

.ad {
    width: auto;
    box-sizing: content-box;
    margin: 0 10px;
}

.ad-content {
    margin: 10px auto;
}

.container.has-ads #main {
    padding: 0 180px;
}

@media (max-width: 992px) {
    .container.has-ads #main {
        --bs-gutter-x: 1.5rem;

        padding: 0 calc(var(--bs-gutter-x)* .5);
    }
}

@media (min-width: 992px) {
    .ad-content {
        display: none;
    }
}