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

.gradient-edge-note {
    background-image: linear-gradient(to right, #fcef6d, #f8f1c0, #ffffff);
    color: black;
    font-size: 14px;
}

.gradient-center-note {
    background-image: linear-gradient(to right, #b0f379, #d0f8c0, #ffffff);
    color: black;
    font-size: 14px;
}

.gradient-control-note {
    background-image: linear-gradient(to right, #fa8888, #f8c0c0, #ffffff);
    color: black;
    font-size: 14px;
}

.gradient-voice-note {
    background-image: linear-gradient(to right, #77c7f3 , #c0eef8, #ffffff);
    color: black;
    font-size: 14px;
}

.gradient-edge-note td:first-child::before {
    background-color: black;
    transform: translateY(-50%);
    height: 2px;
    width: 15px;
    top: 50%;
}

.gradient-center-note td:first-child::before {
    color: #5ac504; /* Color for center frequency */
    content: '\f04b';
    font-family: "FontAwesome";
    font-weight: 900;
    top: 20%;

}

.gradient-control-note td:first-child::before {
    color: #f84a4a; /* Color for control channel */
    content: '\f04b';
    font-family: "FontAwesome";
    font-weight: 900;
    top: 20%;
}

.gradient-voice-note td:first-child::before {
    color: #3b81f1; /* Color for voice channel */
    content: '\f04b';
    font-family: "FontAwesome";
    font-weight: 900;
    top: 20%;
}

.radio-tuner-container {
    position: relative; /* Needed for absolute positioning of the pseudo-element */
}

.radio-tuner-container::before {
    content: '';
    position: absolute;
    left: 9px; /* Adjust based on your layout */
    top: 59px;
    bottom: 18px;
    width: 1px; /* Thickness of the vertical line */
    background-color: black; /* Color of the vertical line */
    z-index: 1;
}

table {
    width: 100%;
    border-collapse: collapse;
    margin-left: 20px; /* Adjust so the table aligns with the vertical line if needed */
}

td {
    padding: 8px;
    position: relative;
}

td:first-child::before {
    content: '';
    position: absolute;
    left: -10px; /* Adjust as needed to position the needle left of the content */
    z-index: 2;
}

.th_med_text {
    font-size: 16px;
}

.form-group .invalid-feedback {
        display: block; /* Always show the error message when it's populated */
    }

.list-group-item {
    /* Example of custom styling */
    background-color: #f8f9fa; /* Light grey background */
    border: 1px solid #e9ecef; /* Light grey border */
}

.status-icon {
    /* Adjust the size of the icons if using Font Awesome */
    font-size: 1.2rem;
}