@font-face {
    font-family: 'Roboto';
    src: url('../fonts/roboto-v47-latin-regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Roboto';
    src: url('../fonts/roboto-v47-latin-700.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

html {
    font-size: 16px;
}

:root {
    --bs-font-size-base: 16px;
}

body {
    font-family: 'Roboto', sans-serif;
}

.sidebar-wrapper .metismenu {
    display: flex;
    flex-direction: column;
    min-height: calc(100vh - 70px);
}

.sidebar-wrapper .metismenu li:nth-last-child(-n+2) {
    margin-top: auto !important;
}

.sidebar-wrapper .metismenu li:nth-last-child(-n+2) {
    margin-top: auto !important;
}


/* Only dim and grayscale the stat preview blocks */
.preview-stat {
    opacity: 0.6;
}

.preview-stat i,
.preview-stat .fs-4,
.preview-stat div {
    color: #fff !important;
    filter: grayscale(100%);
}

/* Soft, clear chart preview note */
.chart-preview-note {
    text-align: center;
    color: #999;
    font-size: 0.9rem;
    margin-top: 1rem;
}

.chart-preview {
    filter: grayscale(100%) brightness(1.2);
    opacity: 0.7;
    pointer-events: none;
    /* disables hover */
}

.donut-preview-wrapper {
    filter: grayscale(1);
    opacity: 0.7;
}

/* Responsive adjustments for toggle switches */
@media (max-width: 991px) {

    /* Add spacing between label and toggle on mobile */
    .col-md-6 .d-flex.justify-content-between.align-items-center {
        flex-direction: row;
        gap: 1rem;
    }

    .col-md-6 label.fs-5 {
        flex-grow: 1;
        margin-right: 1rem;
    }

    .col-md-6 .toggle-switch {
        flex-shrink: 0;
        margin-left: 0;
    }
}

/* For even smaller screens, adjust the layout */
@media (max-width: 576px) {
    .col-md-6 .d-flex.justify-content-between.align-items-center {
        width: 100%;
        padding: 0.5rem 0;
    }

    /* Ensure consistent spacing for all custom field rows */
    .col-md-6.md-2 {
        margin-bottom: 1rem;
    }
}

.form-control::placeholder {
    color: #e2e2e2 !important;
    opacity: 1;
}

/* moved color identity styles to b_ui/css/color_select.css */