@import "https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/css/bootstrap.min.css";

:root {
    --dp-primary: #A6896F;
    --dp-secondary: #D9CBBF;
    --dp-attention: #5F848C;
    --dp-attention-accent: #BFD4D9;
    --dp-accent: #A69C94;
    --dp-dark: #0D0D0D;
    --dp-light: #F2F2F2;
}

.navbar {
    background-color: var(--dp-primary);
}

.navbar-brand {
    color: var(--dp-light);
    font-size: 1.5em;
    font-weight: 400;
}

.slogan {
    font-size: 1em;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    display: inline;
}

.navbar-brand:hover {
    color: var(--dp-dark);
}

.nav-link {
    font-size: 1em;
    color: var(--dp-light);
}

.card-body {
    color: var(--dp-dark);
    background-color: var(--dp-secondary);
}

.card-body.rog {
    color: rgb(240, 240, 240);
    background-color: #000000;
}

.bodylift {
    color: var(--dp-dark);
    background-color: var(--dp-secondary);
    border-radius: .5em;
    box-shadow: 2px 2px 3px var(--dp-accent);
}

.bodylift_rog {
    color: rgb(240, 240, 240);
    background-color: #000000;
    border-radius: .5em;
    box-shadow: 2px 2px 3px #C5A95E;
}

.text_rog {
    color: #C5A95E;
}

.bi.rog {
    color: #C5A95E;
}

.bodylift_rog h1 {
    color: white;
}

h4.card-title {
    color: var(--dp-card-bg);
}

body {
    color: var(--dp-dark);
    background-color: var(--dp-light);
    font-family: 'Roboto', sans-serif;
    font-size: 1em;
    font-weight: 400;
}

body.rog {
    color: var(--dp-dark);
    background-color: #050505;
    font-family: 'Roboto', sans-serif;
    font-size: 1em;
    font-weight: 400;
}

.cards {
    box-shadow: 3px 3px 6px var(--dp-accent);
}

.cards.rog {
    box-shadow: 3px 3px 6px #C5A95E;
    border-color: #000000;
}

.btn-primary {
    color: var(--dp-light);
    background-color: var(--dp-attention);
    border: var(--dp-attention);

    &:hover {
        color: var(--dp-dark);
        background-color: var(--dp-attention-accent);
        border: var(--dp-attention);
    }
}

.btn-primary.rog {
    color: white;
    background-color: #C5A95E;
    border: 2px solid black;

    &:hover {
        color: transparent;
        background-color: black;
        border: 2px solid #C5A95E;
        background-image: url("/images/logos/rogr.png");
        background-repeat: no-repeat;
        background-position: center;
        background-size: 95%;
    }
}

.alert.alert-info {
    color: var(--dp-attention);
    background-color: var(--dp-attention-accent);
    border-color: var(--dp-attention);
    padding: .5em;
}

.bi {
    color: var(--dp-attention);
}

.plus {
    color: var(--dp-dark);
    margin-right: .25em;
}

.plus::before {
    content: "\F4FA";
}

.txtpic-p {
    min-width: 50px;
    max-width: 300px;
    max-height: 280px;
}

.txtpic-l {
    min-width: 50px;

}

.soc-link {
    color: var(--dp-attention);
    font-size: 2em;
}

.soc:hover {
    color: var(--dp-dark);
}

.foottext {
    color: var(--dp-primary);
}

.bdark {
    border-bottom: 1px solid var(--dp-dark);
}

.galimg {
    box-shadow: .1rem .1rem .1rem var(--dp-accent);
}

.galvid {
    max-height: 400px;
}

.accordion-button {
    background-color: var(--dp-secondary);
    font-size: .8em;
    background-image: none;
    padding-left: 0;
}

.accordion-button:not(.collapsed) {
    color: black;
    background-color: var(--dp-secondary);
    background-image: none;
}

.accordion-button:not(.collapsed)::before {
    background-image: none;
    /* solid plus */
    font-family: 'Bootstrap-icons';
    content: "\F4F9";
}

.accordion-button:not(.collapsed)::after {
    background-image: none;
}

.accordion-button:focus {
    box-shadow: none;
    background-image: none;
}

.accordion-button::before {
    /* hollow plus */
    font-family: 'Bootstrap-icons';
    content: "\F4FA";
    margin-right: .5em;
}

.accordion-button::after {
    background-image: none;
}

.accordion-header {

    color: var(--dp-dark);
}

.accordion-item {
    color: var(--dp-dark);
    border-color: var(--dp-dark);
    background-color: var(--dp-secondary);
}

.logo {
    max-width: 30%;
    margin: .5em;
}

s.reduce {
    color: rgb(196, 0, 0);
}