/*Josh below*/
.table-clickable tbody tr {
    cursor: pointer;
}

.hoverTable td {
    padding: 2px;
}

.inputs {
    font-size: 15px; /*0.8rem;*/
    padding: 3px 3px;
}

.inputs_read_only {
    /*background: #E6E6E6;*/
    background-color: #f0f0f0;
    font-size: 15px; /*0.8rem;*/
    padding: 3px 3px;
    color: #555;
    border: 1px solid #ccc;
    cursor: not-allowed;
}
.sticky_top th {
    background: lightgrey;
    position: sticky;
    top: 0;
    box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.4);
    border-collapse: collapse;
}
button#gobutton_login {
    cursor: pointer; /*forces the cursor to change to a hand when the button is hovered*/
    padding: 5px 25px; /*add some padding to the inside of the button*/
    background: rgb(10, 94, 178); /*the colour of the button*/
    -webkit-border-radius: 10px;
    border-radius: 10px;
    border: rgb(8, 81, 155); /*required or the default border for the browser will appear*/
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, .75);
    -moz-box-shadow: 0 0 4px rgba(0, 0, 0, .75);
    box-shadow: 0 0 4px rgba(0, 0, 0, .75);
    color: #f3f3f3;
    font-size: 0.8em;
}

button#gobuttonyellow {
    cursor: pointer; /*forces the cursor to change to a hand when the button is hovered*/
    padding: 5px 25px; /*add some padding to the inside of the button*/
    background: #f0ff03; /*the colour of the button*/
    border: 1px solid #d2e103; /*required or the default border for the browser will appear*/
    /*give the button curved corners, alter the size as required*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    /*give the button a drop shadow*/
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, .75);
    -moz-box-shadow: 0 0 4px rgba(0, 0, 0, .75);
    box-shadow: 0 0 4px rgba(0, 0, 0, .75);
    /*style the text*/
    color: #616161;
    font-size: 0.8em;

    float: right;
    top: 20px;
    right: 20px;
    padding: 10px;
    /*border: 1px solid #ccc;*/
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    z-index: 1000;
}
#loginContainer {
    float: right;
    top: 20px;
    right: 20px;
    background: #f9f9f9;
    padding: 10px;
    /*border: 1px solid #ccc;*/
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    z-index: 1000;
}

.custom-multiselect {
    position: relative;
    width: 240px; /* Adjust this value as needed */
    font-family: sans-serif;
}

.selectBox {
    position: relative;
    cursor: pointer;
    width: 100%;
}

.selectBox select {
    width: 100%;
}

#locationCheckboxes {
    display: none;
    border: 1px #dadada solid;
    position: absolute;
    background-color: palegoldenrod;
    max-height: 300px;
    overflow-y: auto;
    width: 100%;
    white-space: nowrap; /* Prevent line breaks */
    z-index: 1000;
}

#locationCheckboxes label {
    /*  display: block;
      padding: 5px 10px;*/
}

#equipmentCheckboxes label {
    /*display: block;
    // padding: 5px 10px;*/
    //white-space: nowrap; /* Prevent wrapping */
}

#equipmentCheckboxes {
    display: none;
    border: 1px #dadada solid;
    position: absolute;
    background-color: palegoldenrod;
    max-height: 300px;
    overflow-y: auto;
    width: 100%;
    white-space: nowrap; /* Prevent line breaks */
    z-index: 1000;
}

#requestorCheckboxes label {
    /*display: block;
    // padding: 5px 10px;*/
    white-space: nowrap; /* Prevent wrapping */
}

#requestorCheckboxes {
    display: none;
    border: 1px #dadada solid;
    position: absolute;
    background-color: palegoldenrod;
    max-height: 300px;
    overflow-y: auto;
    width: 100%;
    white-space: nowrap; /* Prevent line breaks */
    z-index: 1000;
}

#planningCheckboxes label {
    /*display: block;
    // padding: 5px 10px;*/
    white-space: nowrap; /* Prevent wrapping */
}

#planningCheckboxes {
    display: none;
    border: 1px #dadada solid;
    position: absolute;
    background-color: palegoldenrod;
    max-height: 300px;
    overflow-y: auto;
    width: 100%;
    white-space: nowrap; /* Prevent line breaks */
    z-index: 1000;
}

#msaCheckboxes label {
    /*display: block;
    // padding: 5px 10px;*/
    white-space: nowrap; /* Prevent wrapping */
}

#msaCheckboxes {
    display: none;
    border: 1px #dadada solid;
    position: absolute;
    background-color: palegoldenrod;
    max-height: 300px;
    overflow-y: auto;
    width: 100%;
    white-space: nowrap; /* Prevent line breaks */
    z-index: 1000;
}

#statusFacCheckboxes label {
    /*display: block;
    // padding: 5px 10px;*/
    white-space: nowrap; /* Prevent wrapping */
}

#statusFacCheckboxes {
    display: none;
    border: 1px #dadada solid;
    position: absolute;
    background-color: palegoldenrod;
    max-height: 300px;
    overflow-y: auto;
    width: 100%;
    white-space: nowrap; /* Prevent line breaks */
    z-index: 1000;
}

#statusAccCheckboxes label {
    /*display: block;
    // padding: 5px 10px;*/
    white-space: nowrap; /* Prevent wrapping */
}

#statusAccCheckboxes {
    display: none;
    border: 1px #dadada solid;
    position: absolute;
    background-color: palegoldenrod;
    max-height: 300px;
    overflow-y: auto;
    width: 100%;
    white-space: nowrap; /* Prevent line breaks */
    z-index: 1000;
}

#adCheckboxes label {
    /*display: block;
    // padding: 5px 10px;*/
    white-space: nowrap; /* Prevent wrapping */
}

#adCheckboxes {
    display: none;
    border: 1px #dadada solid;
    position: absolute;
    background-color: palegoldenrod;
    max-height: 300px;
    overflow-y: auto;
    width: 100%;
    white-space: nowrap; /* Prevent line breaks */
    z-index: 1000;
}

#rdCheckboxes label {
    /*display: block;
    // padding: 5px 10px;*/
    white-space: nowrap; /* Prevent wrapping */
}

#rdCheckboxes {
    display: none;
    border: 1px #dadada solid;
    position: absolute;
    background-color: palegoldenrod;
    max-height: 300px;
    overflow-y: auto;
    width: 100%;
    white-space: nowrap; /* Prevent line breaks */
    z-index: 1000;
}

input#gobutton_gig, button#gobutton_gig {
    cursor: pointer; /*forces the cursor to change to a hand when the button is hovered*/
    padding: 5px 25px; /*add some padding to the inside of the button*/
    background: rgb(10, 94, 178); /*the colour of the button*/
    border: rgb(8, 81, 155); /*required or the default border for the browser will appear*/
    /*give the button curved corners, alter the size as required*/
    /*-moz-border-radius: 10px;*/
    /*-webkit-border-radius: 10px;*/
    /*border-radius: 10px;*/
    /*give the button a drop shadow*/
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, .75);
    -moz-box-shadow: 0 0 4px rgba(0, 0, 0, .75);
    box-shadow: 0 0 4px rgba(0, 0, 0, .75);
    /*style the text*/
    color: #f3f3f3;
    font-size: 1.1em;
}

input#gobutton_gig:hover, input#gobutton_gig:focus, button#gobutton_gig:hover, button#gobutton_gig:focus {
    background-color: rgb(14, 131, 248); /*make the background a little darker*/
    /*reduce the drop shadow size to give a pushed button effect*/
    -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, .75);
    -moz-box-shadow: 0 0 1px rgba(0, 0, 0, .75);
    box-shadow: 0 0 1px rgba(0, 0, 0, .75);
}

input#gobutton_gig:disabled, button#gobutton_gig:disabled {
    cursor: pointer; /*forces the cursor to change to a hand when the button is hovered*/
    padding: 5px 25px; /*add some padding to the inside of the button*/
    background: grey; /*the colour of the button*/
    border: rgb(8, 81, 155); /*required or the default border for the browser will appear*/
    /*give the button curved corners, alter the size as required*/
    /*-moz-border-radius: 10px;*/
    /*-webkit-border-radius: 10px;*/
    /*border-radius: 10px;*/
    /*give the button a drop shadow*/
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, .75);
    -moz-box-shadow: 0 0 4px rgba(0, 0, 0, .75);
    box-shadow: 0 0 4px rgba(0, 0, 0, .75);
    /*style the text*/
    color: #f3f3f3;
    font-size: 1.1em;
}

/***FIRST STYLE THE BUTTON***/
input#gobutton_save, button#gobutton_save {
    cursor: pointer; /*forces the cursor to change to a hand when the button is hovered*/
    padding: 5px 25px; /*add some padding to the inside of the button*/
    background: rgb(10, 94, 178); /*the colour of the button*/
    border: rgb(8, 81, 155); /*required or the default border for the browser will appear*/
    /*give the button curved corners, alter the size as required*/
    /*-moz-border-radius: 10px;*/
    /*-webkit-border-radius: 10px;*/
    /*border-radius: 10px;*/
    /*give the button a drop shadow*/
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, .75);
    -moz-box-shadow: 0 0 4px rgba(0, 0, 0, .75);
    box-shadow: 0 0 4px rgba(0, 0, 0, .75);
    /*style the text*/
    color: #f3f3f3;
    font-size: 1.1em;
}

/***NOW STYLE THE BUTTON'S HOVER AND FOCUS STATES***/
input#gobutton_save:hover, input#gobutton_save:focus, button#gobutton_save:hover, button#gobutton_save:focus {
    background-color: rgb(14, 131, 248); /*make the background a little darker*/
    /*reduce the drop shadow size to give a pushed button effect*/
    -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, .75);
    -moz-box-shadow: 0 0 1px rgba(0, 0, 0, .75);
    box-shadow: 0 0 1px rgba(0, 0, 0, .75);
}
/* ================================
   Normalized Filter Dropdown Styles
   ================================ */

.filterbar1 {
    width: 100%;
    text-align: left;
    background-color: #ddd;
    padding: 5px;
    margin-bottom: 2px;
    border-radius: 2px;
    box-sizing: border-box;
}

details {
    width: 220px;
    position: relative;
    display: inline-block;
    margin-right: 5px;
    vertical-align: top;
}

summary {
    border: 1px solid #ccc;
    cursor: pointer;
    user-select: none;
    list-style: none;
    background: #E6E6E6;
    font-size: 14px;
    border-radius: 3px;
    padding: 7px 10px;
    box-shadow: inset 0px 2px 3px rgba(0,0,0,0.1);
    position: relative;
    font-weight: normal;
    transition: background-color 0.2s, color 0.2s;
}

/* ✅ remove browser’s default left arrow */
summary::-webkit-details-marker { display: none; }
summary::marker { display: none; }

/* ✅ custom right-side arrow */
details summary::after {
    content: "";
    border: solid transparent;
    border-width: 6px 6px 0 6px;
    border-top-color: #555;
    position: absolute;
    right: 10px;
    top: 35%;
    transform: translateY(-50%) rotate(0deg);
    transition: transform .2s;
}

details[open] summary::after {
    transform: translateY(-50%) rotate(180deg);
}

/* ✨ hover & focus states */
summary:hover,
summary:focus {
    background: #d9d9d9;   /* slightly darker gray */
    color: #000;           /* make text darker on hover */
}

/* dropdown content */
.checkbox-list {
    border: 1px solid #ccc;
    border-top: none;
    background: #fff;
    padding: 8px 12px;
    max-height: 180px;
    overflow-y: auto;
    width: 100%;
    box-sizing: border-box;
}

.checkbox-list label {
    display: block;
    margin-bottom: 4px;
    font-size: 0.9rem;
    white-space: nowrap;
}