/* ECP CSS */

body {
    background-color: #ffffff;
    font-family: 'Roboto', Helvetica, sans-serif;
    margin: 0;
}

h1, h2, h3 {
    font-family: 'Bebas Neue', Helvetica, cursive;
}

h1 {
    font-size: 48px;
    text-transform: uppercase;
    padding: 1% 2%;
    letter-spacing: 6px;
}

h5, h6 {
    font-family: 'Roboto', Helvetica, sans-serif;
    color: #fff;
    text-transform: uppercase;
}

h5 {
    font-size: 20px;
}

h6 {
    font-size: 24px;
}

#header #logo img {
    width: 50%;
}

#header #logo {
    margin: 2% 0;
    /* width: 40%; */
}

#header h2 {
    text-transform: uppercase;
    margin: 10px;
    font-size: 3em;
    line-height: .75em;
}

#header h3 {
    text-transform: uppercase;
    font-size: 2.5em;
    color: #5a5c5c;
    margin: 10px 0 0 0;
}

#header {
    width: 90%;
    display:flex;
    margin:auto;
}

#header #title {
    margin: auto 0;
    width: 100%;
}

#header #nav {
    display:flex;
    margin: auto 2%;
}

#title-wrap {
    display: flex;
    margin: auto;
}

#report-page h2 {
    text-align: center !important;
    font-weight: normal !important;
}

/* Media Queries were here */


/* Media Queries were here */



#nav-bar {
    margin: auto;
}

#logo-title {
    display: flex;
    margin: auto;
}

/* @media (max-width: 600px) {
}

@media (min-width: 601px) {
    
} */

#header-wrap {
    display: flex;
    width: 100%;
}

#page-header {
    background-color: #FFCD03;
    width: inherit;
}

#page-header h2 {
    color: #231F20;
    font-size: 3em;
    font-weight: 400;
    padding: 1% 3% 0 3%;
    margin: 1% 0 0 0;
    text-align: left;
}

#report-page #page-header {
    width: 100%;
}

#download-button {
    background-color: #5a5c5c;
    padding: 2%;
    margin-left: 2%;
}

#download-button h6, #download-button i {
    margin:auto;
}

#download-button i {
    color:#FFCD03;
}

#download-button a {
    display:flex;
    text-decoration: none;
    padding-top: 2%;
}

#report-dates #download-button {
    margin: auto 1%;
    background-color: #ffcd03;
}

#report-dates i {
    color: #fff;
}

#report-dates {
    background-color: #A7A9A9;
    padding: 3% 1% 2% 1%;
    margin-bottom: 3%;
}

.form-input {
    margin: 0 auto;
}

.form-submit {
    margin: 0 auto;
    padding: 10% 0 3% 0;
}

input[type=text], input[type=date], .item-select, .textarea {
    width: 100%;
    padding: 12px;
    margin: 8px 0;
    box-sizing: border-box;
    border: 1px solid #adafab;
    border-radius: 8px;
    font-size: 18px;
    font-family: 'Roboto', Helvetica, sans-serif;
}

input[type=submit] {
    background-color: #FFCD03;
    border: 1px solid #FFCD03;
    color: #fff;
    font-size: 32px;
    font-weight: bold;
    padding: 24px 60px;
    text-transform: uppercase;
    cursor: pointer;
  }

/* #report-dates input[type=date] {
    width: 20%;
} */

label {
    float: left;
    font-weight: 600;
    padding: 15px 0 5px 0;
}

.input-row label {
    float: left;
    padding: 0;
}

.input-row {
    display:flex;
}

.date-input {
    display: block;
    margin: auto;
}

.textarea {
    height: 160px;
}

.textarea.notes {
    height: 80px;
}

#wo-header-column, #wo-form-column {
    width: 41%;
    margin: 0 auto;
    padding: 3%;
}

#wo-header-column {
    background-color: #FFCD03;
    height: fit-content;
}

#wo-form-column {
    background-color: #adafab;
}

#wo-header {
    font-size: 3em;
    padding-top: 3%;
    display: flex;
}

#wo-header h2, #wo-header i {
    margin: auto;
}

#wo-form-body {
    width: 90%;
    margin: 3% auto;
    display: flex;
}

li {
    font-size: 20px;
    padding: 10px;
}

.individual-item {
    font-size: 14px;
}

#main {
    text-align: center;
    margin: 0 auto;
}

#available-header {
    background-color: #FFCD03;
}

#available-header.with-sections {
    border-bottom: 5px #000 solid;;
}

#available-ecp-header {
    background-color: #FFCD03;
    display: flex;
    justify-content: center;
    align-items: baseline;
}

#repair-cal-header {
    background-color: #5a5c5c;
}

#checked-out-header, #available-header, #repair-cal-header, #available-ecp-header {
    padding: 1% 0;
    margin-bottom: 1%;
}

#available-header h2, #checked-out-header h2, #repair-cal-header h2, #available-ecp-header h2{
    font-size: 3em;
    font-weight: 400;
    margin: 0;
    padding-top: 3%;
}

#repair-cal-header h2, #repair-cal-header i, #available-ecp-header h2, #available-ecp-header i {
    color: #000;
    font-size: 2.5em;
}

#out-repair-list {
    width: 40%;
    display: block;
    margin: 0 1%;
}

#out-repair-list-2 {
    width: 85%;
    display: block;
    margin: 0 auto;
}

#repair-list {
    background-color: #A7A9A9;
    padding-bottom: 5%;
}

#checked-out-list {
    padding-bottom: 5%;
}
      
#available-list {
    width: 40%;
    background-color: #feefc7;
    padding-bottom: 5%;
    margin: 0 1%;
}

#available-list-2 {
    width: 85%;
    background-color: #feefc7;
    padding-bottom: 5%;
    /* margin: 0 1%; */
}

#available-list .space-style {
    background-color: none;
}

#available-list .ecp-gear {
    background-color: #feefc7;
}

/* .ecp-hq is likely an orphaned class */
.ecp-hq #available-list{
    background-color: #feefc7 !important;
}

.ecp-gear {
    padding-bottom: 10%;
}

#checked-out-list hr, #available-list hr, #repair-list hr {
    width: 40%;
    margin-top: 10px;
    border: 0;
    border-top: 1px solid #5a5c5c;
}

#available-list hr{
    border: 0;
    border-top: 1px solid #ffcd03;
}

#repair-list hr  {
    border: 0;
    border-top: 1px solid #231F20;
}

#repair-list .item-name, #repair-list .item-epc, #repair-list .part-name, #repair-list .part-epc {
    color:#fff;
}

.item-name {
    font-size: 18px;
    font-weight: 600;
    padding-top: 10px;
}

.item-epc {
    font-size: 14px;
    font-style: italic;
    padding-bottom: 5px;
}

.part-name {
    font-size: 12px;
    font-weight: 500;
    display: flex;
    justify-content: center;
}

.part-epc {
    font-size: 12px;
    font-style: italic;
}

.parent-row {
    display:flex;
    font-size: 18px;
    font-weight: bold;
}

.sub-row {
    display:flex;
    font-size: 18px;
    font-weight: bold;
    padding: 3% 0 1% 2%;
    color: #231F20;
}

.child-row {
    display:flex;
    padding: 1% 0 0 5%;
    font-size: 16px;
    font-style: italic;
    color: #5a5c5c;
}

.desc-col {padding-right: 2%;}

.epc-col {}

.id-col {width: 3%;}

.date-col {width: 25%;}

.status-col {width: 22%;}

.antenna-col {width: 20%;}

.ant-sig-col {width: 10%;}

.reader-col {width: 20%;}

#db-records, #db-records-raw, #list-wrapper  {
    text-align: left;
    margin: 0 auto;
    width: 70%;
    padding-bottom: 5%;
}

/* #db-records-raw {
    text-align: left;
    margin: 0 auto;
    width: 50%;
} */



.item-header {
    display:flex;
    font-size: 16px;
    font-weight: bold;
    padding: 2% 0;
}

#list-wrapper .form-row .input-column {
    padding: 1%;
    margin: 0;
    width: 25%;
}    

#list-wrapper .desc-col {width: 45%;}

#list-wrapper .id-col {width: 5%;}

#list-warpper .cost-col {width: 15%;}

#db-records-raw .desc-col {width: 28%;}

#db-records-raw .epc-col {width: 14%;}

#db-records-raw .id-col {width: 5%;}

#db-records-raw .date-col {width: 20%;}

#db-records-raw .status-col {width: 15%;}

#db-records-raw .antenna-col {width: 11%;}

#db-records-raw .ant-sig-col {width: 7%;}

#db-records-raw .reader-col {width: 15%;}

#db-records-remove {
    text-align: left;
    margin: 0 auto;
    width: 95%;
}

#db-records-remove .parent-remove-row {display: flex;}

#db-records-remove .sub-remove-row {display: flex; padding-left: 3%;}

#db-records-remove .rem-box-col {width: 3%;}

#db-records-remove .rem-epc-col {width: 13%;}

#db-records-remove .rem-name-col {width: 40%;}

#db-records-remove .rem-date-col {width: 20%;}

#db-records-remove .rem-status-col {width: 15%;}

#db-records-remove .rem-id-col {width: 5%;}

.rental-row {
    display:flex;
    font-size: 16px;
    font-style: italic;
    padding: 1% 0;
    border-top: 1px #bebebe solid;
    color: #5a5c5c;
}

.item-row {
    /* display:flex; */
    font-size: 14px;
}

.item-row {
    display:flex;
    font-size: 16px;
    font-style: italic;
    color: #5a5c5c;
    padding-top: 2px;
    padding: 1% 0;
}

#report-page {
    width:90%;
    margin: 0 auto;
}

#rental-records {
    text-align: left;
    margin-bottom: 5%;
}

#rental-records .epc-col-rental, #rental-records .desc-col-rental, #rental-records .start-status-col, #rental-records .end-status-col, #rental-records .cur-days-col, #rental-records .num-days-col {
    margin: auto;
}

#rental-records .desc-col-rental {width: 25%;}

#rental-records .desc-col-item {width: 24%; padding-left: 1%;}

#rental-records .epc-col-rental {width: 8%;}

#rental-records .epc-col-item {width: 7%; padding-left: 1%;}

#rental-records .id-col {width: 4%;}

#rental-records .start-status-col {width: 15%;}

#rental-records .end-status-col {width: 15%;}

#rental-records .antenna-col {width: 7%;}

#rental-records .num-days-col {width: 10%;}

#rental-records .cur-days-col {width: 10%;}

.calibration-header {
    display: flex;
    font-size: 18px;
    font-weight: bold;
    /* border-bottom: 1px #000000 solid; */
    margin: 4% 0 0 0;
}

.cal-date-col {width: 15%;}

.cal-due-date-col {width: 15%;}

#update-col {width: 6%; text-align: center;}

#update-col a {
    color:#FFCD03;
}

#date-update-form {
    display: flex;
}

.form-row .input-column {
    padding: 1%;
    margin: auto;
    width: 25%;
}

.form-row .input-column-save {
    padding: 1%;
    margin: auto;
    width: 15%;
}

.form-row input[type=text] {
    height: 50px;

}

#cal-save-button a {
    color:#fff;
    display: flex;
    text-decoration: none;
}

#cal-save-button {
    background-color: #5a5c5c;
    padding: 10%;
    margin-top: 25%;
}

#cal-save-button h5, #cal-save-button i {
    margin: auto;
}

#cal-save-button i {
    color: #FFCD03;
}

#ecp-footer {
    display: flex;
    justify-content: center;
    padding: 3% 0;
    background-color: #5a5c5c;
    width: 100%;
}

.footer-logo {
    text-align: center;
}

.footer-logo img {
    width: 45%;
}

.footer-copyright {
    color: #fff;
    text-align: center;
    background-color: #5a5c5c;
    padding: 2% 0;
    font-size: 1.2em;
    font-weight: 500;
}

.footer-contact {
    text-align: center;
    color: #FFCD03;
    line-height: 1.25;
    font-size: 1.25em;
    font-weight: 500;
    padding-top: 2%;
}

.footer-contact h2 {
    color: #FFCD03;
    font-size: 2.25em;
    margin: 0;
    font-weight: 400;
}

.footer-contact a.footer-phone {
    color: #fff;
    text-decoration:none;
    line-height: 1.5;
    font-size: 1.5em;
    font-weight: 500;
}

.footer-contact a.footer-contact-link {
    color: #FFCD03;
}

.list-wrapper {
    display: flex;
    justify-content: center;
    margin: 3% 0;
}

#data-links {
    display: flex;
    justify-content: center;
    margin: 10px 0;
}

#data-links a {
    border: 1px #c7c8c7 solid;
    border-radius: 5px;
    padding: 12px 50px;
    margin: 0 10px;
    background-color: #c7c8c7;
    color: #4a4a4a;
    font-size: 14px;
    text-decoration: none;
    cursor: pointer;
}

#header #nav a {
    color:#5a5c5c;
    text-decoration: none;
    padding: 10px;
    font-size: 18px;
    font-weight: 500;
    margin: auto;
}

#header #nav a.refresh{
    border: 1px #5a5c5c solid;
    border-radius: 0;
    padding: 12px 24px;
    margin: auto;
    background-color: #5a5c5c;
    color: #fff;
    font-size: 18px;
    text-decoration: none;
    cursor: pointer;
    text-transform: uppercase;
}

#remove-header-row {
    display:flex;
    margin: auto;
}

#db-records-remove a.button{
    border: 1px #c7c8c7 solid;
    border-radius: 5px;
    padding: 22px 24px;
    margin: 0 10px;
    background-color: #c7c8c7;
    color: #4a4a4a;
    text-decoration: none;
    cursor: pointer;
}

#top-bar {
    background-color: #5a5c5c;
    display: block;
    text-align: right;
    padding: 1% 5% 1% 0;
}

#tb-info a {
    color: #fff;
    text-decoration: none;
    font-size: 1.15em;
    font-weight: 500;
}

#tb-info {
    color: #fff;
}

#budget-summary-inputs {
    display:none;
}


/* Small devices (landscape phones, 576px and up) */
@media (max-width: 576px) {     
    .form-input {width: 85%;    }
    #work-order-page hr {width: 85%;}
    #header #nav {display: grid;}
} 

/* Medium devices (tablets, 768px and up) */
@media (max-width: 768px) and (min-width: 577px) {
    .form-input {width: 95%;}
    #work-order-page hr {width: 60%;}
    
}

/* Large devices (desktops, 992px and up) */
@media (max-width: 992px) and (min-width: 769px) {  
    /* #header #logo {display: none;}
    #header {display:block;} */
    /* #header #title {width:100%; margin-top: 3%;} */
    #header h2 {font-size: 3em;}
    #header h3 {font-size: 2.5em;}
    #report-dates .input-row #download-button h6 {font-size:14px;}
    #report-dates #download-button {margin: auto 1%;}
}

/* Extra large devices (large desktops, 1200px and up) */
@media (max-width: 1200px) and (min-width: 993px) { 
    #header #logo img {width: 55%;}
    #header h2 {font-size: 2.25em;}
    #header h3 {font-size: 1.75em;}
    #report-dates .input-row #download-button h6 {font-size:18px;}
}


@media (max-width: 768px) {
    #available-list, #out-repair-list {width:80%; margin: 1% auto;}
    .list-wrapper {display: block;}
    #report-dates .input-row {display:block;}
    #report-dates .input-row #download-button {margin:1% auto; width: 75%;}
}

@media (max-width: 992px) {  
    #header #logo {display: none;}
    #header {display:block;}
    #header #title {width:100%; margin-top: 3%;}
    #wo-form-body {display: block;}
    #wo-header-column, #wo-form-column {width: 80%;}
}


/* ================================
   ECP v2 — Single-column grouped UI
   (All-new classes, no collisions)
=================================== */

.ecp2-area {
    margin-bottom: 2rem;
  }
  
  .ecp2-area__header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 0.75rem;
  }
  
  .ecp2-area__title {
    font-size: 1.25rem;
    font-weight: 700;
  }
  
  .ecp2-area__body {
    display: grid;
    grid-template-columns: 1fr; /* single column */
    gap: 0.75rem;
  }
  
  /* Type blocks (Equipment_Type groups) */
  .ecp2-type {
    border: 1px solid #e6e6e6;
    border-radius: 0.75rem;
    background: #fff;
    padding: 0.75rem;
  }
  
  .ecp2-type__header {
    margin-bottom: 0.5rem;
  }
  
  .ecp2-type__title {
    font-size: 1.0625rem;
    font-weight: 600;
  }
  
  /* Cards list inside each type */
  .ecp2-type__list {
    display: grid;
    grid-template-columns: 1fr; /* single column */
    gap: 0.5rem;
  }
  
  /* Item card */
  .ecp2-card {
    border: 1px solid #ededed;
    border-radius: 0.5rem;
    background: #fafafa;
    padding: 0.5rem 0.75rem;
  }
  
  .ecp2-card__row {
    display: flex;
    gap: 0.25rem;
    line-height: 1.3;
  }
  
  .ecp2-card__label {
    font-weight: 600;
  }
  
  /* Optional: subtle separator between types within an area */
  .ecp2-type + .ecp2-type {
    margin-top: 0.5rem;
  }
  
  /* ===== ECP Houston v2 layout (scoped) ===== */
  
  /* make this page's wrapper flow vertically without changing .list-wrapper systemwide */
  .ecp2-wrapper {
    display: block;
  }
  
  /* single-column main column for this page only */
  .ecp2-column {
    width: 100%;
    margin: 0 auto;
  }
  
  /* hide the right-side column for this phase only (checked-out is also hidden in JS) */
  .ecp2-hidden {
    display: none;
  }
  
  /* ensure each room renders as a single column and uses the new card layout */
  .ecp2-room .ecp2-area__body {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.75rem;
  }
  
  /* widen horizontal rules within the single column (local only) */
  .ecp2-wrapper #available-list hr {
    width: 100%;
  }
  
  /* ===== ECP v2 — collapsible type groups + 3-up layout (scoped) ===== */
  
  /* 3 columns of TYPE BLOCKS per area */
  .ecp2-room .ecp2-area__body {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
  }
  
  /* Responsive downshifts */
  @media (max-width: 1100px) {
    .ecp2-room .ecp2-area__body {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }
  @media (max-width: 700px) {
    .ecp2-room .ecp2-area__body {
      grid-template-columns: 1fr;
    }
  }
  
  /* Type card container */
  .ecp2-type {
    border: 1px solid #e6e6e6;
    border-radius: 0.75rem;
    background: #fff;
    overflow: hidden;
  }
  
  /* Clickable header bar */
  .ecp2-type__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.625rem 0.75rem;
    cursor: pointer;
    user-select: none;
  }
  
  .ecp2-type__title {
    font-size: 1.0625rem;
    font-weight: 600;
    margin: 0;
  }
  
  /* Chevron */
  .ecp2-type__chevron {
    display: inline-block;
    transition: transform 0.2s ease-in-out;
  }
  .ecp2-type--expanded .ecp2-type__chevron {
    transform: rotate(90deg);
  }
  
  /* Items list inside a type (single column) */
  .ecp2-type__list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem 0.75rem;
  }
  
  /* Collapsed state hides the list */
  .ecp2-type--collapsed .ecp2-type__list {
    display: none;
  }
  
  /* Item card */
  .ecp2-card {
    border: 1px solid #ededed;
    border-radius: 0.5rem;
    background: #fafafa;
    padding: 0.5rem 0.75rem;
  }
  
  .ecp2-card__row {
    display: flex;
    gap: 0.25rem;
    line-height: 1.3;
  }
  
  .ecp2-card__label {
    font-weight: 600;
  }
  
  /* ===== ECP v2 — checked-out toggle + section (scoped) ===== */
  .ecp2-toggle-row {
    display: flex;
    justify-content: center;
    margin: 1.25rem 0 0.5rem;
  }
  .ecp2-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
    cursor: pointer;
    user-select: none;
  }
  .ecp2-toggle input[type="checkbox"] {
    transform: scale(1.2);
  }
  
  /* Section visibility helper */
  .ecp2-hidden { display: none !important; }
  
  /* Checked-out section body = 3 columns of TYPE blocks, same as rooms */
  .ecp2-co-section .ecp2-co-body {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    padding: 0 1rem 1.25rem;
  }
  @media (max-width: 1100px) {
    .ecp2-co-section .ecp2-co-body {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }
  @media (max-width: 700px) {
    .ecp2-co-section .ecp2-co-body {
      grid-template-columns: 1fr;
    }
  }
  
  /* Red text for items that are at the wrong branch (checked-in only) */
  .ecp2-card--mismatch { color: #c62828; }
  
  /* Make the type header red if any child is mismatched */
  .ecp2-type--has-mismatch .ecp2-type__title { color: #c62828; }
  
  .ecp2-type__count { font-weight: 500; opacity: 0.75; }
  
  .ecp2-card__owner {
    font-size: 0.9em;   /* slightly smaller than the EPC line */
    opacity: 0.9;       /* subtle de-emphasis */
  }
  
  /* ===== Accessories inside card ===== */
  .ecp2-card--has-acc { padding-bottom: 0; }
  
  .ecp2-card__accHdr {
    margin-top: 0.5rem;
    padding: 0.5rem 0.25rem;
    border-top: 1px solid #e8e8e8;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    user-select: none;
  }
  .ecp2-card__accCount { font-weight: 600; font-size: 0.95em; }
  .ecp2-card__chev { transition: transform .2s ease-in-out; }
  
  .ecp2-accList {
    display: none;
    padding: 0.5rem 0.25rem 0.75rem;
    border-top: 1px dashed #e8e8e8;
  }
  .ecp2-card--acc-open .ecp2-accList { display: block; }
  .ecp2-card--acc-open .ecp2-card__chev { transform: rotate(90deg); }
  
  .ecp2-accItem {
    border: 1px solid #ededed;
    border-radius: 0.375rem;
    background: #f7f7f7;
    padding: 0.5rem 0.5rem;
    margin-top: 0.5rem;
  }
  .ecp2-accItem--mismatch { color: #c62828; }
  
  /* Slightly smaller owner line already defined for parent; reuse */
  .ecp2-accItem .ecp2-card__owner { font-size: 0.9em; opacity: 0.9; }
  
  /* Model row with inline chevron + count */
  .ecp2-card__top {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  
  .ecp2-card__accToggle {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    cursor: pointer;
  }
  
  .ecp2-card__accToggle .fa-chevron-right {
    transition: transform 0.2s ease-in-out;
  }
  
  /* Rotate chevron down when open */
  .ecp2-card--acc-open .ecp2-card__accToggle .fa-chevron-right {
    transform: rotate(90deg);
  }
  
  /* Hide acc list by default; show when open */
  .ecp2-accList { display: none; }
  .ecp2-card--acc-open .ecp2-accList { display: block; }
  
  .ecp2-gps-links a {
    margin-left: 0.5rem;
    color: #333;
  }
  .ecp2-gps-links a:hover {
    color: #FFCD03;
  }
  
  .ecp2-gps-links { margin-left: .5rem; display: inline-flex; gap: .5rem; }
  

  /* Checked-out section using unified body class */
.ecp2-co-section .ecp2-area__body {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  padding: 0 1rem 1.25rem;
}
@media (max-width: 1100px) {
  .ecp2-co-section .ecp2-area__body { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .ecp2-co-section .ecp2-area__body { grid-template-columns: 1fr; }
}



/* ============================
   Item Lookup (add to main.css)
============================ */

#lookup-wrap {
  width: 90%;
  margin: 5% auto;
  text-align: left;
}

#lookup-form {
  max-width: 760px;
}

#lookup-form .lookup-input-row {
  display: flex;
  gap: 12px;
  align-items: stretch;
}

#lookup-form label {
  float: none;
}

#lookup-form #epc-input {
  flex: 1;
}

#lookup-form .button-like {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 20px;
  border-radius: 8px;
  text-decoration: none;
  background-color: #FFCD03;
  border: 1px solid #FFCD03;
  color: #fff;
  font-weight: 700;
  text-transform: uppercase;
}

#lookup-form .button-like:hover {
  filter: brightness(0.95);
}

#lookup-form #lookup-help {
  font-size: 14px;
  color: #5a5c5c;
  margin-top: 6px;
}

#lookup-results {
  margin-top: 24px;
}

.lookup-note {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  border-radius: 8px;
  background-color: #feefc7;
  border: 1px solid #ffcd03;
  color: #231F20;
  font-size: 16px;
}

.lookup-note.error {
  background-color: #fde8e8;
  border-color: #d9534f;
  color: #8a2323;
}

.lookup-card {
  border: 1px solid #c7c8c7;
  border-radius: 12px;
  background-color: #ffffff;
  box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}

.lookup-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #FFCD03;
  padding: 16px 20px;
}

.lookup-card-header h3 {
  margin: 0;
  font-weight: 400;
  font-size: 2em;
}

.lookup-actions .button-like.small {
  padding: 8px 12px;
  font-size: 14px;
  text-transform: none;
  background-color: #5a5c5c;
  border-color: #5a5c5c;
}

.lookup-card-body {
  padding: 18px 20px 8px 20px;
}

.lookup-card-footer {
  padding: 12px 20px 18px 20px;
  border-top: 1px solid #e6e6e6;
}

.coming-soon {
  color: #5a5c5c;
  font-style: italic;
}

.detail-section {
  margin-bottom: 18px;
  background-color: #fafafa;
  border: 1px solid #ededed;
  border-radius: 8px;
  padding: 12px 14px;
}

.detail-section-title {
  font-family: 'Bebas Neue', Helvetica, cursive;
  font-size: 1.5em;
  letter-spacing: 1px;
  color: #231F20;
  margin: 0 0 8px 0;
}

.detail-row {
  display: flex;
  padding: 8px 0;
  border-top: 1px solid #f0f0f0;
}

.detail-row:first-of-type {
  border-top: 0;
}

.detail-label {
  width: 200px;
  font-weight: 600;
  color: #231F20;
}

.detail-value {
  flex: 1;
  color: #5a5c5c;
  word-break: break-word;
}

.detail-value.epc-value {
  font-family: monospace;
  font-size: 15px;
  color: #000;
}

.muted {
  color: #a7a9a9;
}

.copied-notice {
  display: inline-block;
  margin-left: 10px;
  color: green;
  opacity: 0;
  transition: opacity 0.3s;
}

.copied-notice.visible {
  opacity: 1;
}

/* Responsive */
@media (max-width: 576px) {
  .detail-row { display: block; }
  .detail-label { width: auto; margin-bottom: 4px; }
  #lookup-form .lookup-input-row { display: block; }
  #lookup-form .button-like { margin-top: 8px; width: 100%; }
}

/* ============================
   Scan Table
============================ */
.scan-section-title {
  font-family: 'Bebas Neue', Helvetica, cursive;
  font-size: 1.4em;
  margin: 12px 0;
  color: #231F20;
}

.scan-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}

.scan-table th {
  background-color: #FFCD03;
  color: #231F20;
  padding: 8px;
  text-align: left;
  font-weight: 600;
}

.scan-table td {
  padding: 6px 8px;
  border-top: 1px solid #e6e6e6;
  color: #5a5c5c;
  word-break: break-word;
}

.scan-loading {
  color: #5a5c5c;
  font-style: italic;
  padding: 10px 0;
}

/* Inline action icons next to values (GPS links) */
.value-actions {
  display: inline-flex;
  margin-left: 10px; /* spacing between value and icon */
}

.value-actions .icon-link {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  color: #5a5c5c;
  font-size: 16px;
}

.value-actions .icon-link + .icon-link {
  margin-left: 8px; /* spacing if both icons ever appear */
}

.value-actions .icon-link:hover {
  color: #231F20;
}

.lookup-actions .button-like.small {
  padding: 8px 12px;
  font-size: 14px;
  text-transform: none;
  background-color: #5a5c5c;
  border-color: #5a5c5c;
  color: #FFCD03; /* set link text color */
}

.lookup-actions .button-like.small:hover {
  color: #fff; /* optional hover contrast */
}

/* ===== Master List column widths (match Shermco) ===== */
#db-records-raw .owner-col { width: 10%; }
#db-records-raw .manu-col { width: 12%; }
#db-records-raw .model-col { width: 10%; }
#db-records-raw .serial-col { width: 10%; }
#db-records-raw .equip-type-col { width: 18%; }
#db-records-raw .altid-col { width: 10%; }

/* Reuse existing ones; ensure these match the Shermco view */
#db-records-raw .id-col { width: 5%;  }
#db-records-raw .epc-col { width: 10%; }
#db-records-raw .desc-col { width: 15%; }

/* Header + row */
.item-header { display:flex; font-size:16px; font-weight:bold; padding: 2% 0; }
.item-row    { display:flex; font-size:16px; font-style: italic; color:#5a5c5c; padding: 1% 0; }

/* Left expand/collapse column */
.update-col { width: 4%; text-align: center; }

/* Hidden edit block under each row */
.edit-row { display: none; padding: 8px 0 0 0; }
.edit-row label { padding: 8px 0 4px 0; }

/* Toast (errors / notices) */
.toast {
  position: fixed;
  top: 20px;
  right: 20px;
  background-color: #ff3333;
  color: #fff;
  padding: 10px 20px;
  border-radius: 5px;
  z-index: 9999;
  display: none;
}

/* “NEW” pill for new rows */
.new-pill {
  display: inline-block;
  background: #FFCD03;
  color: #231F20;
  padding: 2px 8px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 700;
}

/* Read-only ID input */
.id-readonly,
input[readonly][id^="id-"] {
  background-color: #f5f5f5;
  color: #666;
  cursor: not-allowed;
}

/* Inline edit rows layout */
.master-list-update-row { display: flex; }
.edit-row .master-list-update-row .input-column {
  margin: 0;
  padding: 8px 1%;
}

/* Save / Cancel buttons inside edit row (match REFRESH look) */
.btn-col { display: flex; align-items: center; }
a.btn-save, a.btn-cancel {
  padding: 12px 24px;
  border: 1px #5a5c5c solid;
  border-radius: 0;
  background-color: #5a5c5c;
  color: #fff;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  text-transform: uppercase;
  font-size: 18px;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  margin-right: 8px;
}
a.btn-save i, a.btn-cancel i { color: #FFCD03; font-size: 1em; line-height: 1; }
a.btn-save h5, a.btn-cancel h5 { margin:0; display:inline; font-size:inherit; line-height:1; }

/* Top area: Filters + Add/Search (same spacing/look) */
#filter-row {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 8px 0 6px 0;
}
#filter-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  align-items: center;
}
#filter-wrap .item-select {
  width: auto;
  min-width: 180px;
  max-width: 240px;
}
#filters-helpers a#filters-clear {
  font-size: 14px;
  color: #5a5c5c;
  text-decoration: none;
}
#filters-helpers a#filters-clear:hover { text-decoration: underline; }

#actions-row {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 16px;
  margin: 6px 0 12px 0;
}

#add-search-bar {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0;
}

/* Make the Add Item button match the REFRESH button */
#add-item-button { background: transparent; padding: 0; margin: 12px 0; display: inline-block; }
#add-item-button a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 24px;
  background-color: #5a5c5c;
  color: #fff;
  border: 1px #5a5c5c solid;
  border-radius: 0;
  text-decoration: none;
  text-transform: uppercase;
  font-size: 18px;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
}
#add-item-button h6 { margin:0; display:inline; font-size:inherit; font-family:inherit; text-transform:inherit; color:inherit; }
#add-item-button i  { color:#FFCD03; font-size:1em; line-height:1; }

/* EPC search input + Find/Clear */
#search-wrap { display:flex; align-items:center; gap:8px; }
#search-wrap input#epc-search-input {
  width: 260px;
  padding: 12px;
  border: 1px solid #adafab;
  border-radius: 8px;
  font-size: 18px;
  font-family: 'Roboto', Helvetica, sans-serif;
}
#search-wrap a#search-button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 24px;
  background-color: #5a5c5c;
  color: #fff;
  border: 1px #5a5c5c solid;
  border-radius: 0;
  text-decoration: none;
  text-transform: uppercase;
  font-size: 18px;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
}
#search-wrap a.link-clear { font-size: 14px; color:#5a5c5c; text-decoration: none; }
#search-wrap a.link-clear:hover { text-decoration: underline; }

/* Responsive tweaks */
@media (max-width: 768px) {
  #filter-row { flex-direction: column; align-items: stretch; gap: 10px; }
  #actions-row { flex-direction: column; align-items: stretch; gap: 10px; }
  #search-wrap input#epc-search-input { width: 100%; max-width: 100%; }
}

/* New columns */
#db-records-raw .netsuite-col { width: 10%; }
#db-records-raw .inactive-col { width: 7%;  }
#db-records-raw .gps-serial-col { width: 12%; }
#db-records-raw .gps-beacon-col { width: 12%; }

/* Reuse gray look for any read-only inputs (ID + netsuite_id) */
.readonly-input,
input[readonly].readonly-input {
  background-color: #f5f5f5;
  color: #666;
  cursor: not-allowed;
}



/* ************************* */
/* Code for gauge*/
/* ************************* */



/* ************************* */
/* Code for gauge*/
/* ************************* */



/* ************************* */
/* Code for ecpsoluitons site*/
/* ************************* */
#work-order-confirm p {
    font-size: 16px;
}
.confirm-label {
    font-size: 18px;
    font-weight: bold;
	padding-top: 10px;
}
#job-number, #equipment, #notes, #tech-branch {
    /*display: flex;*/
}
.disable-fields {
	pointer-events: none;
}
.disable-fields input[type=text] {
	color: #888888;
}

/* ************************* */
/* Code for ecpsoluitons site*/
/* ************************* */