/**
 * Custom CSS for MiCAVS
 * This file contains custom styles to enhance the appearance and usability of the MiCAVS application.
 */

/* General styles for the main content area */
/* Override enum badges to make them all the same */
span.badge.text-shadow.shadow-sm:not(.badge-info):not(.badge-primary):not(.badge-warning):not(.badge-success):not(.badge-danger):not(.badge-dark):not(.badge-light):not(.badge-black):not(.badge-white) {
    background-color: var(--micavs-secondary) !important;
    color: #FFF !important;
}
span.badge.text-shadow.shadow-sm {
    text-shadow: none;
}

/* date picker: cells with prior days have too low of contrast */
.datepicker table tr td.new, .datepicker table tr td.old {
    color: #747474 !important;
}

/* Improve color contrast on Error pages when code is displayed */
p code {
    color: #d1377e;
}

/* Remove redundant bottom margin on related list elements, given that the iFrames already have bottom margin */
.main-content .content div.mb-4:not(.card):not(:first-of-type) {
    margin-bottom: 0 !important;
}

/* Reduce the top padding on card bodies (detail views) */
.main-content .content div.card div.card-body {
    padding-top: .25rem;
}

/* Reduce the top margin of show section fields on detail views */
.detail-view-detail-inner h5.font-weight-bold.mt-4 {
    margin-top: .75rem !important;
}

/* Override the default Bootstrap primary color to match MiCAVS branding */
/* State of Michigan Digital Guidelines - Colors see https://digitalguidelines.michigan.gov/docs/foundations/colors#color-brand-colors */
:root {
    --micavs-primary: #277C78;
    --mivcavs-primary-light: #61C8AF;
    --micavs-secondary: #142D3E;
    --micavs-success: #0D8252;
    --micavs-success-bg: #EAFBEB;
    --micavs-warning: #E5A612;
    --micavs-warning-bg: #FFEFCA;
    --micavs-warning-text: #AE5400;
    --micavs-error: #B30518;
    --micavs-error-bg: #FFE8E3;
    --micavs-info: #0077A7;
    --micavs-info-bg: #E3F7FF;
    --micavs-heading-copy: #161618;
    --micavs-body-copy: #353535;
    --micavs-caption: #707070;
    --micavs-border: #D0D0D0;
    --micavs-alt-bg: #F7F7F7;
    --micavs-smoke: #EAF1F4;
}

.bg-primary {
    background-color: var(--micavs-primary) !important;
}

.micavs-primary-bg {
    background-color: var(--micavs-primary);
}

.micavs-secondary-bg {
    background-color: var(--micavs-secondary);
}

/* Styling for MiCAVS badges */
.micavs-badge {
    color: var(--dark);
    border: 1.5px solid var(--dark);
}

.micavs-badge-primary {
    color: var(--light);
    background-color: var(--micavs-primary);
    border-color: var(--micavs-primary);
}

.micavs-badge-secondary {
    color: var(--light);
    background-color: var(--micavs-secondary);
    border-color: var(--micavs-secondary);
}

.micavs-badge-success {
    color: var(--micavs-success);
    background-color: var(--micavs-success-bg);
    border-color: var(--micavs-success);
}

.micavs-badge-warning {
    color: var(--micavs-warning-text);
    background-color: var(--micavs-warning-bg);
    border-color: var(--micavs-warning);
}

.micavs-badge-error {
    background-color: var(--micavs-error-bg);
    border-color: var(--micavs-error);
}

.micavs-info-bg {
    background-color: var(--micavs-info-bg);
}

.micavs-info-border {
    border: 2px solid var(--micavs-info);
}

.micavs-info-link {
    color: var(--micavs-info);
}

.micavs-info-card {
    background-color: var(--micavs-info-bg);
    border: 2px solid var(--micavs-info);
    color: var(--micavs-caption);
    border-radius: 0.35rem;
}

.micavs-action-card {
    background-color: var(--micavs-alt-bg);
    border: 1px solid var(--micavs-border);
    border-radius: 0.35rem;
    transition: 0.5s;
    margin-bottom: 0.5rem;
    position: relative;
    width: 100%;
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 10%)
}

.micavs-success-border {
    border: 1px solid var(--micavs-success);
}

.micavs-warning-border {
    border: 1px solid var(--micavs-warning);
}

.micavs-alt-bg {
    background-color: var(--micavs-alt-bg);
}

.micavs-text-caption {
    color: var(--micavs-caption);
}

/* Headings, Body and Captions */
h1, h2, h3, h4, h5, h6 {
    color: var(--micavs-heading-copy);
}
body {
    color: var(--micavs-body-copy);
}

/* CSS for hiding rich text editor in form view on disabled fields. Example for document_description field */
#document_description_div .ql-toolbar {
    display: none;
}

div#id_document_description_quill {
    border-top-left-radius: 5px !important;
    border-top-right-radius: 5px !important;
    border: 2px solid #0077A7;
}

div#id_document_description_quill .ql-editor {
    background-color: #E3F7FF;
}

/* Fixes to override hard-coded colors that do not adhere to theme/brand colors */
.btn-primary {
    background-color: var(--micavs-primary) !important;
    border-color: var(--micavs-primary) !important;
}

.btn-secondary {
    color: #FFF !important;
    background-color: var(--micavs-secondary) !important;
    border-color: var(--micavs-secondary) !important;
}

.btn-primary:hover,
.btn-secondary:hover {
    color: var(--micavs-secondary) !important;
    background-color: var(--mivcavs-primary-light) !important;
    border-color: var(--mivcavs-primary-light) !important;
}

.btn-primary.disabled {
    background-color: var(--micavs-caption) !important;
    border-color: var(--micavs-caption) !important;
}

.btn-outline-secondary:not(.dt-button-active) {
    color: var(--micavs-secondary) !important;
    background-color: #FFF;
    border-color: var(--micavs-secondary) !important;
}

.btn-outline-secondary:hover,
.btn-outline-secondary:not(:disabled):not(.disabled).active,
.enum-label.btn-secondary {
    color: var(--mivcavs-primary-light) !important;
    background-color: var(--micavs-secondary) !important;
    border-color: var(--micavs-secondary) !important;
}

.page-link:not(.page-item.active .page-link):not(.page-item.disabled .page-link),
.page-link:hover:not(.page-item.active .page-link):not(.page-item.disabled .page-link) {
    color: var(--micavs-primary) !important;
}
.page-link:hover {
    background-color: var(--micavs-alt-bg) !important;
}

/* Override for the d-none class to prevent hiding elements that should always be visible */
.d-none.d-none-override {
    display: revert !important;
}