/* 

#: Imports
#: Universal
    #: Resets
    #: Classes
#: Navigation
#: Main Content
#: Footer

*/

@import 'css/blog.css';
@import 'css/buttons.css';
@import 'css/footer.css';
@import 'css/forms.css';
@import 'css/hero.css';
@import 'css/navbar.css';
@import 'css/queue.css';
@import 'css/screen-sizing.css';
@import 'css/sheetmetal.css';
@import 'css/universals.css';
@import 'css/user-msg.css';

@import url('https://fonts.googleapis.com/css2?family=Monda:wght@400..700&display=swap');

/* === UNIVERSAL : RESETS === */

.print-header {
    display: none;
}

#print-title {
    display: none;
}

.print-created-by {
    display: none;
}

.print-hr {
    display: none;
}

.print-footer {
    display: none;
}

:root {
    /* Universals */
    --main-bg-color: #242424;
    --nav-bg-color: #111;
    --footer-bg-color: black;
    --main-text-color: rgb(163, 163, 163);
    --nav-link-color: white;
    --nav-active-link-bg-color: black;
    font-family: "Monda", sans-serif;
}

/* === UNIVERSAL : CLASSES === */

/* === LOGIN FORM === */

/* === MAIN CONTENT === */

/* === INDEX JOBS CONTAINER & MISC === */
.active-jobs-container {
    margin-top: 25px;
    padding: 10px 0px;
}

.active-job-card {
    border-radius: 10px;
    background-color: var(--nav-bg-color);
    margin: 10px 0px;
    padding: 15px;
}

.active-job-ul {
    padding: 0px 20px;
}

.flexbox-li {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 5px;
}

.job-card-title {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
}

.scope-title-container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.dashboard-header-container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: stretch;
}

.production-job-container {
    display: flex;
    flex: row;
    justify-content: space-between;
}

.queue-list-item-contents {
    border-radius: 5px;
}

.queue-notes-div {
    display: flex;
    flex-direction: column;
    padding: 10px 15px;
    min-height: 2rem;
}


.parts-container {
  padding: 0px 15px;
}

.header-wrapper {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

#output-temp {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.price-total-div {
    display: flex;
    flex-direction: row;
    
}

/* ============================================ */
.temp-format-div {
    /* border: 1px solid red; */
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-bottom: 25px;
}

.WO-date-div {
    /* border: 1px solid blue; */
    width: 25%;
}

.row-1 {
    /* width: 35%;     */
}

.col-1 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    /* border: 1px solid green; */
    margin-bottom: 10px;
}

.work-order-no-div {
    width: 100%;
    text-align: center;
    display: none;
}

.WO-title-div {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.WO-desc-div {
    margin: 20px 0px;
}

.WO-box {
    background: var(--nav-bg-color);
    /* margin: 10px 0px; */
    padding: 10px;
    border-radius: 5px;
}

.WO-desc-box {
    min-height: 20vh;
}

.sign-div {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
.print-cust {
    display: none;
}

.status-div {
    margin: auto;
    width: fit-content;
    padding: 15px;
    display: flex;
}

.status-div > select {
    padding: 5px 20px;
    border-radius: 5px;
    cursor: pointer;
}

/* Styling the select when it is open */
.status-div > select:open {
  border-color: #000;
  border-radius: 5px;
  cursor: pointer;
}

.status-div > select > option {
  border-color: #000;
  border-radius: 5px;
  cursor: pointer;
}

.billing-div {
    width: fit-content;
    margin: auto;
}