
.service-billings .tableParent{
    min-width: 100%;
    height: auto;
}
.service-billings .confirmOrder-btn{
    background: var(--colorButtonSave);
    color: var(--whiteColor);
    width: 20%;
    border-radius: 100px;
}
.service-billings .addNewOrder-btn,
.visit-notes .createNotesTemplate-btn{
    background-color: var(--colorBackgroundChangePass);
    color: var(--colorShowAllLink);
    border-radius: 100px;
}

/*Add new order "this is modal"*/
.service-billings .modal-content,
.visit-notes .modal-content{
    border-radius: 16px;
}
.service-billings .modal .modal-body .form-select,
.service-billings .modal .modal-body input,
.visit-notes .modal .modal-body input{
    border-radius: 500px;
    height: 50px;
}
.service-billings .iteam:invalid,
.service-billings .modal .modal-body input::placeholder {
  color: var(--colorPlaceHolderSelected) !important; /* placeholder color */
}
.service-billings .modal .modal-body textarea,
.visit-notes .modal .modal-body textarea{
    height: 150px;
    max-height: 150px;
    width: 100% !important;
    border-radius: 24px;
    resize: none;
}
.service-billings .modal .modal-body .form-select,
.service-billings .modal .modal-body input,
.service-billings .modal .modal-body textarea,
.visit-notes .modal .modal-body textarea,
.visit-notes .template-section textarea{
  border: none;
  background-color: var(--colorBackgroundInput);
}
.service-billings .modal .modal-header,
.visit-notes .modal .modal-header{
    border: none;
}
.service-billings .modal .modal-header h4{
    font-weight: var(--fontWeight700);
}
.service-billings .modal .btn-close,
.visit-notes .modal .btn-close{
  position: relative;
  background-color: var(--colorCloseBtn); 
  border-radius: 50%;
  width: 24px;
  height: 24px;
  padding: 0;
  opacity: 1;
  background-image: none; /* Hide the original icon */
}
.service-billings .modal .btn-close::before,
.visit-notes .modal  .btn-close::before{
  content: "";
  position: absolute;
  inset: 0;
  background-image: var(--bs-btn-close-bg); /* Original icon from Bootstrap */
  background-repeat: no-repeat;
  background-position: center;
  background-size: 10px;
  filter: invert(1) brightness(2); /* Change the icon color to white */
}

.service-billings .iteam option {
  color: black; /* Regular select options color */
}

@media screen and (max-width:990px){

    .service-billings .addOrder-section{
        display: flex;
        flex-direction: column;
    }
    .service-billings .modal-dialog{
        padding: 0 !important;
    }
    .modal-content{
        border-radius: 0 !important;
    }
    .service-billings .confirmOrder-btn{
        width: 100%;  
    }
}

@media screen and (max-width:870px){
    .service-billings .container-modal{
        width: 100% !important;
        margin: auto;
        height: 100%;
    }

}
/* Service Billings: allow table columns to stretch to full container width */
.service-billings .tableParent table {
    width: 100% !important;
    table-layout: fixed; /* or 'auto' if you prefer content-based widths */
}


.service-billings .tableParent th,
.service-billings .tableParent td {
    width: 25% !important;
    max-width: none !important;
}