assets/custom.css

/* Left panel background */
.dash-bootstrap .dbc-col:first-child,
.dash-bootstrap .dbc-col:nth-child(1),
.dash-bootstrap .dbc-row > .col-3,
.dash-bootstrap .dbc-row > [class*="col-3"] {
    background-color: #F5F5F5 !important;
}

/* Left panel text: bold, left-aligned, no underline */
.dash-bootstrap .dbc-col:first-child,
.dash-bootstrap .dbc-col:nth-child(1),
.dash-bootstrap .dbc-row > .col-3,
.dash-bootstrap .dbc-row > [class*="col-3"] {
    font-weight: bold !important;
    text-align: left !important;
}

.dash-bootstrap .dbc-col:first-child a,
.dash-bootstrap .dbc-col:nth-child(1) a,
.dash-bootstrap .dbc-row > .col-3 a,
.dash-bootstrap .dbc-row > [class*="col-3"] a {
    text-decoration: none !important;
    font-weight: bold !important;
    color: inherit !important;
    text-align: left !important;
}

/* Remove underline from all left panel clickable items */
.custom-button,
.custom-button a {
    text-decoration: none !important;
    font-weight: bold !important;
    color: inherit !important;
    background: transparent !important;
    border: none !important;
    text-align: left !important;
    box-shadow: none !important;
    width: 100% !important;
    display: block !important;
    cursor: pointer;
    outline: none !important;
    transition: background 0.2s;
}

/* Light color on hover for left panel clickable items */
.custom-button:hover,
.custom-button:focus,
.custom-button:active {
    background-color: #E0E0E0 !important;
    color: inherit !important;
    text-decoration: none !important;
}

/* Remove underline from all links in left panel */
.dash-bootstrap .dbc-col:first-child a,
.dash-bootstrap .dbc-col:nth-child(1) a,
.dash-bootstrap .dbc-row > .col-3 a,
.dash-bootstrap .dbc-row > [class*="col-3"] a {
    text-decoration: none !important;
}

/* Button color rules */
.btn-primary {
    background-color: #1C304A;
    border-color: #1C304A;
}
.btn-primary:hover {
    background-color: #116F70;
    border-color: #116F70;
}
.btn-secondary {
    background-color: #116F70;
    border-color: #116F70;
}
.btn-secondary:hover {
    background-color: #00AEAF;
    border-color: #00AEAF;
}
.btn-tertiary {
    background-color: #E0E0E0;
    border-color: #E0E0E0;
    color: #1C304A;
}
.btn-tertiary:hover {
    background-color: #DEF4F4;
    border-color: #DEF4F4;
    color: #1C304A;
}

/* Ensure word wrap for any text boxes */
textarea,
input[type="text"],
input[type="search"] {
    white-space: pre-wrap !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
}