/* common.css */

:root {
    /* Colors */
    --color-primary: rgba(43, 175, 213, 1);
    --color-primary-light: rgba(117, 199, 221, 1);
    --color-primary-lighter: rgba(176, 222, 219, 1);
    --color-secondary: rgba(40, 164, 94, 1);
    --color-secondary-light: rgba(160, 208, 129, 1);
    --color-secondary-lighter: rgba(207, 227, 154, 1);
    --color-tertiary: rgba(247, 146, 29, 1);
    /* Font sizes */
    --font-size-small: 0.875rem;
    --font-size-medium: 1rem;
    --font-size-large: 1.25rem;
    /* Spacing */
    --spacing-small: 8px;
    --spacing-medium: 16px;
    --spacing-large: 24px;
}


/* dropdown */


/*  */

.card {
    margin: 5px;
    border-radius: 0px !important;
}

main h2 {
    color: var(--color-primary);
}

.btn-danger {
    background-color: #dc3545;
    border-color: #dc3545;
}

.btn-danger:hover {
    background-color: white;
    color: #dc3545;
    border-color: #dc3545;
}

.text-primary {
    color: var(--color-primary) !important;
}

.btn-primary {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}

.btn-info {
    background-color: var(--color-primary-light);
    border-color: var(--color-primary-light);
    color: white;
}

.btn-info:hover {
    background-color: white;
    border-color: var(--color-primary-light);
    color: var(--color-primary-light);
}

.btn-warning {
    background-color: var(--color-tertiary);
    border-color: var(--color-tertiary);
    color: white;
}

.btn-warning:hover {
    background-color: white;
    border-color: var(--color-tertiary);
    color: var(--color-tertiary);
}

.btn-primary:hover {
    background-color: white;
    color: var(--color-primary);
    border-color: var(--color-primary);
}

.border-primary {
    border-color: var(--color-primary);
}

.border-primary-2 {
    border-color: var(--color-primary-light) !important;
}

.bg-primary {
    background-color: var(--color-primary) !important;
}

.bg-tertiary {
    background-color: var(--color-tertiary) !important;
}

.bg-info {
    background-color: var(--color-primary-lighter) !important;
}

.text-success {
    color: var(--color-secondary) !important;
}

.text-secondary {
    color: var(--color-secondary) !important;
}

.bg-secondary {
    background-color: var(--color-secondary) !important;
}

.border-secondary {
    border-color: var(--color-secondary);
}

.btn-secondary {
    background-color: var(--color-secondary);
    border-color: var(--color-secondary);
}

.btn-secondary:hover {
    background-color: white;
    color: var(--color-secondary);
    border-color: var(--color-secondary);
}

.bg-secondary-light {
    background-color: var(--color-secondary-light) !important;
}

.letter-spacing-1 {
    letter-spacing: 2px;
}

#breadcrumb a {
    text-decoration: none;
}

.rqrd {
    font-size: 12px;
    color: red;
}