* {

    padding: 0;

    margin: 0

}



:root {

    --base-color: 19, 41, 61;

    --light : #fff;

    --thBg: #ccc;

    --tr_odd : #eee;

    --tr_even : #fff;

    --menuBg : rgba(var(--base-color), 1);

    --menuColor : var(--light);

}

body,

html {

    font-family: arial;

    font-size: 12px;

    height: 100%

}

.bg {

    background-image: url(../images/EE_Word_Cloud.png);

    background-size: cover;

    background-repeat: no-repeat;

    background-attachment: fixed;

}

table.list {

    width: 100%

}

table tr th {

    text-align: left;

    font-weight: bold;

    background-color: rgba(var(--base-color), 0.7);

    color: #fff;

}



table tr.list0 {

    background-color: rgba(var(--base-color), 0.1);

    border-bottom: 1px solid rgba(var(--base-color), 0.075);



}

table{

    border-collapse: collapse;

}



table tr.list1 {

    background-color: var(--light);

    border-bottom: 1px solid rgba(var(--base-color), 0.075);

}

table th{

    padding: 8px 10px;

    border: 1px solid var(--light);

}



table tr.list1 td, table tr.list0 td{

    padding: 8px 4px;

}

table tr.listspace {

    background-color: #ddd

}



.selectedTr{

    background-color: rgba(var(--base-color), 0.4)

}

table.dataTable tbody tr.list0 {

    background-color: var(--tr_even)

}



table.dataTable tbody tr.list1 {

    background-color: rgba(var(--base-color), 0.2)

}

table.dataTable>thead>tr>th, table.dataTable>thead>tr>td{

    border-bottom: 1px solid rgba(var(--base-color), 1);

}





fieldset {

    width: 520px;

    height: auto;

    display: block;

}



h1,

h2 {

    margin-bottom: 20px

}



div#menu {

    float: left;

    width: 220px;

    background-color: rgba(var(--base-color), 1);

    border-right: 1px solid rgba(var(--base-color), 1);

    font-family: arial;

    font-size: 12px;

    line-height: normal;

}



div#menu a {

    color: var(--menuColor);

    text-decoration: none;

    font-weight: bold

}



div#menu a:hover {

    color: var(--light);

    text-decoration: underline

}



div#menu ul {

    list-style: none;

    margin-left: 20px;

    margin-bottom: 10px;

    padding-left: 0;

}



div#menu div {

    height: 22px;

    padding-top: 10px;

    color: goldenrod;

    font-size: 14px;

    font-weight: bold;

    padding-left: 40px;

    background-repeat: no-repeat;

    margin-bottom: 2px

}



div#menu div.accounts {

    background-image: url(../images/icon_accounts.gif);

    height: 100%;

}



div#menu div.concierge {

    background-image: url(../images/icon_concierge.gif);

    height: auto;

}



div#menu div.application {

    background-image: url(../images/icon_application.gif)

}



div#menu div.wholesale {

    background-image: url(../images/icon_wholesale.gif)

}



div#menu div.submenu {

    height: 22px;

    padding-top: 2px;

    font-size: 14px;

    font-weight: bold;

    padding-left: 20px;

    background-repeat: no-repeat;

    margin-bottom: 0px

}



div#page {

    margin-left: 10px;

    float: left;

    width: calc(100% - 260px) !important;

}



#page .h2,

#page h2 {

    margin-bottom: 10px;

    font-size: 1.5em;

    font-family: arial;

    font-weight: bold;

}



.error {

    color: red;

    font-weight: bold

}



.msg {

    color: green;

    font-weight: bold

}



h3.error,

h3.msg {

    font-size: 1.17rem;

}



table.formTable {

    width: 100% !important;

}



.icon-sm {

    width: auto;

    height: 16px;

    object-fit: contain;

    object-position: center;

}



.btn-theme-ee,

.btn-theme,

.btn-danger {

    color: var(--light);

    border: none;

    padding: 0.5rem 1rem;

    border-radius: 4px;

    cursor: pointer;

}



.btn-theme-ee,

.btn-theme {

    background: rgba(var(--base-color), 1);

}



.btn-theme-ee:hover,

.btn-theme:hover {

    background: rgba(var(--base-color), 1);

}



.btn-danger {

    background: red;

}



.btn-danger:hover {

    background: rgb(219, 36, 36);

}



.loading-state {

    display: none;

}



.loading-state.load {

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background-color: rgba(var(--base-color), 0.5);

    z-index: 9999;

    display: flex;

    justify-content: center;

    align-items: center;

}



.loading {

    width: 80px;

    height: 80px;

    border-radius: 50%;

    border: 10px solid #dadada;

    border-top-color: rgba(var(--base-color), 1);

    animation: loading 1s linear infinite;

}



form input,

form select,

form textarea,

button {

    font-family: arial;

}



input:disabled,

textarea:disabled,

select:disabled {

    color: #000 !important;

    opacity: 1 !important;

    /* Ensures full opacity for better visibility */

    -webkit-text-fill-color: #000 !important;

    /* Fix for iOS devices */

}



.accordion-toggle {

    position: relative;

    border-bottom: 1px solid var(--light) !important;

}



@keyframes loading {

    to {

        transform: rotate(360deg);

    }

}



@media screen and (max-width: 680px) {

    .img-fluid {

        width: 100%;

    }



    .formTable {

        width: 100%;

    }



    table.list {

        width: 100%;

    }



    .saveButtonDiv {

        width: 100% !important;

    }



    #menu {

        width: 30% !important;

    }



    #page {

        width: 60% !important;

    }

}



.themeBg {

    background-color: rgba(var(--base-color), 0.7);

    color: var(--light);

}

td.themeBg{

    padding-left: 10px;

}



.accordion-toggle {

    background-color: rgba(var(--base-color), 0.7);

    color: var(--light);

    padding: 10px 16px;

    border: none;

    text-align: left;

    width: 100%;

    cursor: pointer;

    outline: none;

    transition: background-color 0.4s ease;

}



.accordion-toggle:hover {

    background-color: rgba(var(--base-color), 0.8);

}



.accordion-content {

    max-height: 0;

    overflow: hidden;

    transition: max-height 0.2s ease-out;

}



.active .accordion-content {

    max-height: 5000px;

}



.accordion-toggle {

    position: relative;

    border-bottom: 0.75px solid var(--light);

}



.accordion-toggle::after {

    content: "\276F";

    position: absolute;

    width: 16px;

    height: 16px;

    top: 10px;

    right: 20px;

    color: var;

    -ms-transform: rotate(90deg);

    -webkit-transform: rotate(90deg);

    transform: rotate(90deg);

    transition: 0.3s ease-in-out;

    display: flex;

    align-content: center;

    justify-content: center;

}



.accordion-toggle.active::after {

    -ms-transform: rotate(-90deg);

    -webkit-transform: rotate(-90deg);

    transform: rotate(-90deg);

    transition: 0.3s ease-in-out;

}

.formTable.cus_formTable, 

.accordion-content .formTable{

    width: 60%;

    border: none;

    border-collapse: collapse;

}

.formTable.cus_formTable tr td:nth-child(1), 

.accordion-content .formTable tr td:nth-child(1){

    width: 300px;

    background-color: var(--tr_odd);

    padding: 4px 2px;

    border-bottom: 1px solid #cacaca;

}

.formTable.cus_formTable tr td:nth-child(1) textarea, 

.accordion-content .formTable tr td:nth-child(1) textarea{

    width: 300px !important;

    background-color: var(--tr_even); 

    padding: 4px 2px;  

    border: none; 

    border-bottom: 1px solid #cacaca; 

}

.formTable.cus_formTable tr td:nth-child(2), 

.accordion-content .formTable tr td:nth-child(2){

    width: 100%;

    display: flex;

    align-items: center;

    gap: 10px;

    border-bottom: 1px solid #cacaca; 

}

.formTable.cus_formTable tr td input, 

.formTable.cus_formTable tr td textarea,

.accordion-content .formTable tr td input,

.accordion-content .formTable tr td textarea{

    width: 100%;

    min-height : 24px;

    padding: 13px 5px;

    border: none;

    border-bottom: 1px solid var(--light);

    resize: vertical;

}

.formTable.cus_formTable tr td select, 

.accordion-content .formTable tr td select{

    min-height : 24px;

    padding: 13px 5px;

    border: none;

    border-bottom: 1px solid var(--light);

    resize: vertical;

    width: auto;

}

.formTable.custum_DeMinimus tr td:nth-child(1) {

    width: 200px;

    padding: 4px 2px;

    background-color:rgba(var(--base-color), 0.5);

    border: 2px solid var(--light);

}

.formTable.custum_DeMinimus tr td:nth-child(2) {

    width: 60%;

    display: flex;

    align-items: center;

    gap: 10px;

    border: 2px solid var(--light);

}

.formTable.custum_DeMinimus tr td input, .formTable.custum_DeMinimus tr td select, .formTable.custum_DeMinimus tr td textarea {

    width: 100%;

    min-height: 24px;

}

.formTable.custum_DeMinimus tr td textarea{

    resize: vertical;

    padding: 0 2px;

}



.formTable.cus_formTable tr td:nth-child(1) textarea,

.accordion-content .formTable tr td:nth-child(1) textarea{

    border: 1px solid #cacaca;

}

.formTable.cus_formTable tr td input:disabled,

.formTable.cus_formTable tr td textarea:disabled,

.formTable.cus_formTable tr td select:disabled,

.accordion-content .formTable tr td input:disabled,

.accordion-content .formTable tr td textarea:disabled,

.accordion-content .formTable tr td select:disabled {

    cursor: not-allowed; 

    background-color: var(--tr_even); 

}

.d-flex{

    display: flex;

}

.flex-column{

    flex-direction: column;

}

.file-upload{

    gap: 10px;

}

.file-upload input{

    padding: 4px 8px;

    border: 1px solid rgba(var(--base-color), 0.7);

}

.file-upload textarea{

    padding: 4px 8px;

    font-family: arial;

    font-size: 14px;

    border: 1px solid rgba(var(--base-color), 0.7);

}

.modal .close{

    background: #dadada;

    font-size: 16px;

    width: 15px;

    display: inline-block;

    height: 16px;

    text-align: center;

    margin-bottom: 10px;

    cursor: pointer;

}

.gallery-items{

    list-style: none;

     display: flex;

    flex-wrap: wrap;

    gap: 16px;

    max-height: 750px;

    overflow-y: auto;

}

.gallery-items li{

    display: flex;

    gap: 16px;

    width: calc(50% - 20px);

    border: 1px solid var(--tr_even);

    padding: 5px;

}

.imgDetails li{

    border: none;

}

.imgDetails li a{

    display: flex;

    gap: 3px;

    text-decoration: none;

    color: #000;

}

.imgDetails li a svg{

    width: auto;

    height: 14px;

    object-fit: contain;

}

.gallery-item li .imgDiv{

    width: 100px;

    height: 100px;

}

.gallery{

    display: flex;

    flex-direction: column;

    gap: 10px;

    padding: 10px;

}

.inProcesstable{

    max-width: 100% !important;

}

.inProcesstable table, .inProcesstable form{

    width: 100%;

}



.modal {

    display: none; /* Hidden by default */

    position: fixed; /* Stay in place */

    z-index: 1; /* Sit on top */

    left: 0;

    top: 0;

    width: 100%; /* Full width */

    height: 100%; /* Full height */

    overflow: auto; /* Enable scroll if needed */

    background-color: rgb(0,0,0); /* Fallback color */

    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */

}



.modal-content {

    background-color: #fefefe;

    margin: 15% auto; /* 15% from the top and centered */

    padding: 20px;

    border: 1px solid #888;

    width: 400px; /* Could be more or less, depending on screen size */

}



@media screen and (max-width: 991px) {

    .img-fluid {

        width: 100%;

    }

    .formTable {

        width: 100%;

    }

    table.list, .accordion-toggle {

        width: 100%;

    }

    .accordin-toggle{

        padding: 10px 10px;

    }

    .accordion-toggle::after{

        right: 8px;

    }

    .saveButtonDiv {

        width: 100% !important;

    }

    #menu {

        width: 30% !important;

    }

    #page {

        width: 60% !important;

    }

    .formTable tr {

        display: flex;

        flex-direction: column;

    }

    .formTable tr td:nth-child(1) {

        width: 100%;

        display: block;

    }

    .formTable tr td:nth-child(2) {

        gap: 4px;

    } 

    .gallery-items li{

        width: 100%;

        flex-direction: column;

        align-items: center;

        text-align: center;

    }

}

.alert.alert-error{

    max-width: 100% !important;

    background: rgba(var(--base-color), 0.1) !important;

    padding: 10px;

    color: red;

    font-weight: 600;

}

.alert-error{

    padding: 10px;

}

#page .h2, #page h2{

	margin-bottom: 10px;

    font-size: 1.5em;

    font-family: arial;

    font-weight: bold;

}



.form-check-input.shared_check:checked{

    background-color: rgba(var(--base-color), 1) !important;

    border-color: rgba(var(--base-color), 1) !important;

}

.form-check-input.shared_check:focus {

    border-color: rgba(var(--base-color), 1);

    outline: 0;

    box-shadow: 0 0 0 .25rem rgba(var(--base-color), 0.25);

}

.form-check-input.allDay_check:checked{

    background-color: rgba(var(--base-color), 1) !important;

    border-color: rgba(var(--base-color), 1) !important;

}

.form-check-input.allDay_check:focus {

    border-color: rgba(var(--base-color), 1);

    outline: 0;

    box-shadow: 0 0 0 .25rem rgba(var(--base-color), 0.25);

}

.form-switch .form-check-input:focus:not(:checked) {

    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23777777'/%3e%3c/svg%3e") !important;

}

.fileInputsContainer {

    display: flex;

    flex-wrap: wrap;

}



.fileInputsContainer .file-upload-group input, .fileInputsContainer .file-upload-group textarea {

    margin: 0.25rem;

    width: calc(100% - 30px);

    min-height: 28px;

}

.fileInputsContainer .file-upload-group {

    width: calc(50% - 2rem);

    padding: 1rem;

}

.td-title{

    padding: 8px 2px;

}

.brandLogo{

    height: auto;

    width: 100%;

    object-fit: contain;

}

.hederNav{

    display: flex;

    align-items: center;

    column-gap: 100px;

    row-gap: 20px;

}

.hederNav .col-md-5{

    width: 380px;

}

.hederNav .col-md-7{

    width: 600px;

}

.hederNav .col-md-7 h2{

    margin-bottom: 0;

    text-align: center;

    font-family: arial;

    color: #850f0f;

    font-size: 28px;

    font-weight: 600;

}

.tableFilter select{

    margin-right: 15px;

}

#clients{

    display: flex;

}

.dataTables_length{

    margin-bottom: 10px;

}

table.categogyTable{

    width: 600px;

}

table.categogyTable input{

    width: 98%;

}

table.categogyTable input[type=submit],

table.categogyTable input[type=Button]{

    width: auto;

}

input[type=date]{

    letter-spacing: -1px;

}

.dataTables_length{

    margin-bottom: 15px;

    margin-top: 15px;

}

fieldset{

    padding: 5px;

}

fieldset legend{

    padding: 0 5px;

}

.list{

    margin-top: 10px;

}

.inProcessDeminus .inProcesstable:nth-child(odd) table tr{

    background: rgba(var(--base-color), 0.1);

}

.inProcessDeminus .inProcesstable table input,

.inProcessDeminus .inProcesstable table textarea{

    background: transparent;

}

.update-btn{

    background: rgba(var(--base-color), 1);

    border: 1px solid rgba(var(--base-color), 1);

}

.update-btn:hover{

    background-color: transparent;

    color: #333;

    border: 1px solid #333;

}



.deMinimusAction{

    text-align: right; 

    max-width:calc(60% + 90px);

    padding: 15px 0;

}

table.newquotesTable th{

    padding: 4px 4px;

}

table.newquotesTable select{

    min-width: 60%;

}

table.newquotesTable input{

    min-width: 59%;

}

table.newquotesTable input[type="submit"]{

    min-width: auto;

}

.mainLogo{

    height: 150px;

    object-fit: contain;

    width: auto;

}