:root {
    --cds-blue: #105882;
    --cds-red: #cd2b2b;
    --cds-yellow: #ffba55;
    --cds-light-gray: #ededed;
    --panel-bg: var(--cds-blue);
    --color-primary: 16,88,130;
    --tw-ring-color: var(--cds-blue);
}

* {
    border-radius: 0 !important;
}

.text-blue-600 {
    color: var(--cds-blue)
}

.bg-gray-100 {
    background-color: var(--cds-light-gray);
}

.bg-red-500 {
    background-color: var(--cds-red)
}

.bg-yellow-100\/50 {
    background-color: var(--cds-yellow)
}

[multiple]:focus, [type=date]:focus, [type=datetime-local]:focus, [type=email]:focus, [type=month]:focus, [type=number]:focus, [type=password]:focus, [type=search]:focus, [type=tel]:focus, [type=text]:focus, [type=time]:focus, [type=url]:focus, [type=week]:focus, input:where(:not([type])):focus, select:focus, textarea:focus {
    border-color: var(--cds-blue)
}

.row-title div[class*=_mine]:before {
    background-color: var(--cds-red);
}

.alert-error .alert-icon span {
    border-color: #dc26260d;
    background-color: var(--cds-red);
}

input::-moz-placeholder, textarea::-moz-placeholder {
    color: var(--cds-blue);
}

#page-header {
    background: linear-gradient(45deg, black, #ffffff);

    a:hover {
        color: white !important;
        text-decoration: underline solid white !important;
    }

    .header-image {
        mix-blend-mode: multiply;
    }

    .leading-relaxed {

        @media screen and (width <= 767px) {
            background-color: rgba(var(--color-primary), 0.75);
            margin-bottom: -1.15rem;
            padding-top: 0.5rem;
            padding-bottom: 0.5rem;

        }
    }
    @media screen and (width >= 768px) {
        h1 {
            max-width: 75%;
            font-size: 2.5rem;
            line-height: 3rem;
        }
    }
}

.card {
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.20);
    .card-title {
        border: 0;
    }
}

.card:not(.post):has(.card-title) {
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
}

.dropdown-item {
    &:hover {
        background-color: initial;
        text-decoration: underline solid var(--cds-blue);
        text-underline-offset: 2px;
    }
}

#user-menu {
    >li#username_logged_in {
        max-width: 25px;
        max-height: 25px;
    }

    >li#username_logged_in > a > div.h-8 {
        height: inherit;
        width: inherit;
    }

}

#user-menu > li > * > a:hover,
#user-menu > li > a:hover {
    outline: 1px solid var(--cds-blue);
}

#username_logged_in > a {
    padding: 0;
    border-radius: 100% !important;
}

a {
    &:hover {
        text-decoration: underline solid var(--cds-blue);
        text-underline-offset: 2px;
    }
}

#nav-main > li > a {
    border: 0;
    border-bottom: solid 2px transparent;

    &:hover {
        background-color: transparent;
        text-decoration: none;
        border-bottom: solid 2px var(--cds-blue);
    }
}

nav > a.active, .btn-primary-outline:hover, .btn-primary-outline {
    background-color: transparent;
    text-decoration: none;
    border: 0;
    border-bottom: solid 2px var(--cds-blue);

}

main {
    nav {
        > a {
            border: 0;
            border-bottom: solid 2px transparent;

            &:hover {
                background-color: transparent;
                text-decoration: none;
                border-bottom: solid 2px var(--cds-blue);
            }

        }

    }
    a.dropdown-item {
        border: 0;
        border-bottom: solid 2px transparent;

        &:hover {
            background-color: transparent;
            text-decoration: none;
            border-bottom: solid 2px var(--cds-blue);
        }

    }
}


#page-footer > div > div:nth-child(2) {
    max-width: 100%;
    background-color: var(--cds-blue);

    > div {
        color: white;
        max-width: 72rem;
        margin: auto;

        a:hover {
            color: white;
            text-decoration: underline solid white;
        }

    }
}