@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');

:root {
    --truckstop-red: #b60207;
    --dat-blue: #164ad6;
    --black: #2c2c2c;
    --gold: #ffc107;
    --gold-dark: #d7a81d;
    --red: #c11818;
    --green: #14a321;
    --border-color: #ededed;
    --font-size: 0.85rem;
    --font-size-small: 0.75rem;
    --sidebar-width: 50px;
    --bs-primary: var(--gold) !important;
    --mud-palette-primary: var(--gold) !important;
    --mud-palette-primary-darken: var(--gold-dark) !important;
    --mud-palette-primary-lighten: #fff3cd !important;

    --mud-palette-surface: #ffffff !important;
    --mud-palette-background: #f8f9fa !important;
    --mud-palette-background-grey: #f5f5f5 !important;

    --mud-palette-text-primary: var(--black) !important;
    --mud-palette-text-secondary: #6c757d !important;
    --mud-palette-text-disabled: #adb5bd !important;

    /* MudBlazor Line Colors */
    --mud-palette-lines-default: var(--border-color) !important;
    --mud-palette-lines-inputs: #dee2e6 !important;

    /* MudBlazor Action Colors */
    --mud-palette-action-hover: rgba(0, 0, 0, 0.04) !important;
    --mud-palette-action-selected: rgba(255, 193, 7, 0.12) !important;
    --mud-palette-action-disabled: rgba(0, 0, 0, 0.26) !important;

    /* MudBlazor Status Colors */
    --mud-palette-success: var(--green) !important;
    --mud-palette-error: var(--red) !important;
    --mud-palette-warning: var(--gold) !important;
    --mud-palette-info: var(--dat-blue) !important;

    /* MudBlazor Additional Colors */
    --mud-palette-secondary: #6c757d !important;
    --mud-palette-tertiary: #6f42c1 !important;
    --mud-palette-dark: var(--black) !important;
    --mud-palette-white: #ffffff !important;

    /* MudBlazor Drawer Colors */
    --mud-palette-drawer-background: var(--mud-palette-surface) !important;
    --mud-palette-drawer-text: var(--mud-palette-text-primary) !important;
    --mud-palette-drawer-icon: var(--mud-palette-text-secondary) !important;

    /* MudBlazor AppBar Colors */
    --mud-palette-appbar-background: var(--mud-palette-primary) !important;
    --mud-palette-appbar-text: var(--black) !important;

    /* MudBlazor Table Colors */
    --mud-palette-table-lines: var(--mud-palette-lines-default) !important;
    --mud-palette-table-striped: rgba(0, 0, 0, 0.02) !important;
    --mud-palette-table-hover: var(--mud-palette-action-hover) !important;

    /* MudBlazor Divider Colors */
    --mud-palette-divider: var(--mud-palette-lines-default) !important;
    --mud-palette-divider-light: rgba(0, 0, 0, 0.06) !important;
}

html, body {
    font-family: 'Inter', Inter, 'Verdana', Verdana, Arial, sans-serif !important;
    color: var(--black);
    letter-spacing: -.01em;
    background-color: #f7f9fc;
    font-size: var(--font-size) !important;
}

.navbar-nav .dropdown-menu {
    position: absolute !important;
}

.modal-body {
    color: var(--black);
}

.required-input:after {
    content: "*";
    color: red;
}

.ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fs-small {
    font-size: var(--font-size-small) !important;
}

.fs-normal {
    font-size: var(--font-size);
}

.hover:hover, .hover:focus {
    opacity: 0.5;
    cursor: pointer;
}

.omit-hover:hover {
    opacity: 1 !important;
    cursor: default;
}

.c-hand {
    cursor: pointer !important;
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }


.border {
    border: 1px solid var(--border-color) !important;
}

.border-b {
    border-bottom: 1px solid var(--border-color) !important;
}

.border-t {
    border-top: 1px solid var(--border-color) !important;
}

.border-l {
    border-left: 1px solid var(--border-color) !important;
}

.border-r {
    border-right: 1px solid var(--border-color) !important;
}

.invalid-input {
    border: 1px solid #c71010 !important;
}

.nav button {
    color: #495057;
}

.warning-card {
    background: #fff9e5;
    border: 1px solid #fddf6f;
    padding: 0.5rem;
}