﻿/*over-ride the autocomplete list ui*/
.ui-autocomplete {
    max-height: 250px;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
    max-width: 500px;
}

.RedButton {
    background: #9A0506;
    color: #FFFFFF;
}

.headerDTL img {
    margin: 0 auto;
    width: 100%;
}

.RedButtonLg {
    background: #9A0506;
    color: #FFFFFF;
    height: 60px;
    font-size: larger;
}

.GreenBtn {
    background: #065505;
    color: #FFFFFF;
    height: 35px;
}

    .GreenBtn:hover {
        background: #065505;
        color: #ffd800;
        height: 35px;
    }

.GreenBtnLg {
    background: #065505;
    color: #FFFFFF;
    height: 60px;
    font-size: larger;
}

.padding-right-0 {
    padding-right: 0 !important;
    margin-right: 0 !important;
}

.padding-left-0 {
    padding-left: 0 !important;
    margin-left: 0 !important;
}

.GreenBorderBtn {
    border-color: #065505;
    background: #d5d9d6;
    color: #065505;
    height: 35px;
    font-size: larger;
}


.GreenBorderBtnLg {
    border-color: #065505;
    background: #d5d9d6;
    color: #065505;
    height: 60px;
    font-size: larger;
}

.GreenBtnLg:hover {
    background: #065505;
    color: #ffd800;
    height: 60px;
    font-size: larger;
}

.GreenBorderBtnLg:hover {
    border-color: #065505;
    background: #FFFFFF;
    color: #065505;
    height: 60px;
    font-size: larger;
}

.CheckLg {
    -webkit-transform: scale(1.6,1.6);
    -moz-transform: scale(1.6,1.6);
    -o-transform: scale(1.6,1.6);
}

.buttonmargin {
    margin-top: -27px;
    width: 50%;
}

.buttonmargin1 {
    margin-top: -103px;
    width: 50%;
    margin-left: 182px;
}

.buttonmargin3 {
    margin-top: -61px;
    width: 183%;
    margin-left: 182px;
}

.buttonmargin2 {
    margin-top: -35px;
    width: 50%;
    margin-left: 182px;
}

.lbl {
    margin-left: -196px;
}

.lbl1 {
    margin-left: -394px;
}

.se {
    margin-left: 580px;
    margin-top: -84px;
}

.se1 {
    margin-left: 1000px;
    margin-top: -84px;
}

.se2 {
    margin-left: 808px;
    margin-top: -165px;
}

.se3 {
    margin-left: -6px;
}

.b {
    margin-right: -500px;
}

.b1 {
    margin-right: -505px;
}

.b3 {
    margin-right: -515px;
}

.GridPager a, .GridPager span {
    display: block;
    height: 15px;
    width: 15px;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
}

.GridPager a {
    background-color: #f5f5f5;
    color: #969696;
    border: 1px solid #969696;
}

.GridPager span {
    background-color: #A1DCF2;
    color: #000;
    border: 1px solid #3AC0F2;
}

hr {
    -moz-border-bottom-colors: none !important;
    -moz-border-image: none !important;
    -moz-border-left-colors: none !important;
    -moz-border-right-colors: none !important;
    -moz-border-top-colors: none !important;
    border-color: #EEEEEE -moz-use-text-color #FFFFFF !important;
    border-style: solid none !important;
    border-width: 4px 0 !important;
    margin: 18px 0 !important;
}

.grid {
    cursor: pointer !important;
    /*white-space: nowrap;*/
    overflow: hidden !important;
    text-overflow: ellipsis;
    /*cursor: pointer !important;*/
}

.button-42 {
    background-image: linear-gradient(-180deg, #FF7E31, #E62C03);
    box-shadow: rgba(0, 0, 0, 0.1) 0 2px 4px;
    color: #FFFFFF;
    line-height: 0.428571;
    cursor: pointer;
    outline: 0;
    height: 35px;
    overflow: hidden;
    padding: 1rem 1.25rem;
    transition: box-shadow .2s;
}

.button-76 {
    background-image: linear-gradient(to bottom right, #fcd34d, #ef4444, #ec4899);
    border: 0;
    height: 35px;
    color: #fff;
    line-height: 0.428571;
    padding: 1rem 1.25rem;
}

.button-91 {
    color: #fff;
    padding: 1rem 1.25rem;
    background-color: #38D2D2;
    background-image: radial-gradient(93% 87% at 87% 89%, rgba(0, 0, 0, 0.23) 0%, transparent 86.18%), radial-gradient(66% 66% at 26% 20%, rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0) 69.79%, rgba(255, 255, 255, 0) 100%);
    box-shadow: inset -3px -3px 9px rgba(255, 255, 255, 0.25), inset 0px 3px 9px rgba(255, 255, 255, 0.3), inset 0px 1px 1px rgba(255, 255, 255, 0.6), inset 0px -8px 36px rgba(0, 0, 0, 0.3), inset 0px 1px 5px rgba(255, 255, 255, 0.6), 2px 19px 31px rgba(0, 0, 0, 0.2);
    border-radius: 6px;
    border: 0;
    height: 35px;
    text-align: center;
    cursor: pointer;
    line-height: 0.428571;
}

.button-63 {
    align-items: center;
    background-image: linear-gradient(144deg,#AF40FF, #5B42F3 50%,#00DDEB);
    height: 35px;
    box-shadow: rgba(151, 65, 252, 0.2) 0 15px 30px -5px;
    color: #FFFFFF;
    display: flex;
    justify-content: center;
    line-height: 0.428571;
    padding: 1rem 1.25rem;
}

.button-5 {
    background-clip: padding-box;
    background-color: #fa6400;
    height: 35px;
    box-shadow: rgba(0, 0, 0, 0.02) 0 1px 3px 0;
    color: #fff;
    padding: 1rem 1.25rem;
    margin: 0;
    transition: all 250ms;
    line-height: 0.428571;
}

.button-57 {
    height: 35px;
    overflow: hidden;
    border: 1px solid #18181a;
    color: #18181a;
    font-size: 15px;
    line-height: 15px;
    background: #fff;
}

.btnga {
    min-width: 100px; /* Adjust as needed */
    text-align: center;
    height: 50px;
}

.button-container {
    display: flex;
    justify-content: space-between;
    width: 100%; /* Ensure the container takes full width */
}

.form-approval-buttons-container {
    display: flex; /* Enables Flexbox layout for the container */
    justify-content: space-between; /* Distributes space evenly between items, pushing first to start and last to end */
    width: 100%; /* Ensures the container takes up the full available width */
    margin-top: 20px; /* Add some top margin for spacing */
    /* Remove any default padding from the container if it affects the layout */
}

.approval-button,
.action-button {
    padding: 10px 15px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    color: white; /* Default text color for most buttons */
    flex-grow: 1; /* Allows buttons to grow and fill available space */
    margin: 0 5px; /* Adds a small margin between buttons for visual separation */
    text-align: center;
    white-space: nowrap; /* Prevents text from wrapping inside buttons */
}

/* Color classes based on your image */
.green {
    background-color: #4CAF50; /* Green color for 'All' and 'Done' */
}

.orange {
    background-color: #FFA500; /* Orange color for 'Pending' */
}

.blue-dark {
    background-color: #007BFF; /* Darker blue for 'Ready' */
}

.blue-light {
    background-color: #5BC0DE; /* Lighter blue for 'No Sub-Sample' and 'Export to Excel' */
}

.gray-light {
    background-color: #E0E0E0; /* Light gray for 'Refresh' */
    color: #333; /* Darker text for the light gray button */
}

.btnga.button-63 {
    white-space: normal;
}

.round {
    border-radius: 50px;
}

.swal2-html-container table {
    text-align: left !important;
    margin: 0 auto; /* keeps it centered horizontally */
}

.swal2-html-container th,
.swal2-html-container td {
    text-align: left !important;
    white-space: nowrap; /* optional: keeps headers aligned */
}

.badge {
    display: inline-block;
    padding: .25em .4em;
    font-size: 100%;
    font-weight: 700;
    line-height: 2;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25rem;
}

.badge-success {
    background-color: #5cb85c !important; /* Bootstrap 3 green */
    color: white !important;
}

.badge-warning {
    background-color: yellow !important; /* Bootstrap 3 yellow/orange */
    color: black !important;
}

/*.badge-danger {
    background-color: red !important;*/ /* Bootstrap 3 red */
    /*color: black !important;
}
.badge-primary {
    background-color: blueviolet !important;*/ /* Bootstrap 3 blue */
    /*color: black !important;
}
.badge- {
    background-color: #f0ad4e !important;*/ /* Bootstrap 3 yellow/orange */
    /*color: black !important;
}*/

