html body {
    font-size: 0.750rem !important;
}

.content.pt-\[66px\] {
    padding-top: 45px;
}

.\[\&\.top-bar--active\]\:mt-3\.5.top-bar--active {
    margin-top: 0.300rem;
}

.waveform .side-menu__link {
    padding: 0.500rem 0.500rem;
}

.pr-600rem {
    padding-right: 0.600rem;
}

.waveform .side-menu ul.scrollable>li ul {
    padding: 0rem;
}

.pr-500rem {
    padding-right: 0.500rem;
}

.h-\[45px\] {
    height: 45px;
}

.footer p {
    font-size: 0.600rem;
}

.footer .render-text-footer{
    position: absolute;
    right: 15px;
    top: 2px;
   }

img.dashboard-logo {
    object-fit: cover;
}

.dashboard-logo-text {
    display: none;
}

.svg-icons a.view-icon svg {
    fill: rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
    /* stroke: rgb(var(--color-primary) / var(--tw-bg-opacity)) !important; */
    width: 1rem;
    height: 1rem;
    opacity: 1;
}

.svg-icons a.edit-icon svg {
    /* fill:rgb(var(--color-primary) / var(--tw-bg-opacity)) !important; */
    stroke: rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
    width: 0.875rem;
    height: 0.875rem;
    opacity: 1;
}

/* Tables in the CRM. Scoped out of every Summernote editor (.note-editable): what is pasted or typed there carries its
   own inline styles, and these rules are !important, so they would override them (the signature and compose editors
   would show grey CRM borders instead of the copied ones). :where() keeps every one of these rules' specificity. */
table:where(:not(.note-editable *)) {
    width: 100% !important;
}

table thead th:where(:not(.note-editable *)),
table thead td:where(:not(.note-editable *)),
table tbody td:where(:not(.note-editable *)),
table thead tr:where(:not(.note-editable *)),
table tbody tr:where(:not(.note-editable *)) {
    /* border: 1px solid rgb(var(--color-theme-2) / 0.8); */
    border: 1px solid #E5E7EB !important;
    font-size: 0.750rem;
    padding: 0.300rem !important;
}

table.order-billing-table thead th,
table.order-billing-table tbody td,
table thead.order-billing-table tr, table tbody tr:where(:not(.note-editable *)) {
    border: none !important;
}

table thead tr th:where(:not(.note-editable *)) {
    color: rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
}

table tr td span:where(:not(.note-editable *)){
    display: flex;
}

table.dataTable tr td > span{
    display: flex;
    align-items: center;
    width: fit-content;
}

table.dataTable tr td > span.select2-container{
    display: unset;
    width: unset;
}

table tr td.dt-control span {
    display: flex;
    align-items: center;
    margin-left: 5px;
    font-size:12px;
  }

  table.dataTable > tbody.ui-sortable > tr.ui-sortable-handle:hover{
    cursor: move;
    background-color: #f1f5f9;
    opacity: 0.9;

}

/* table.dataTable > tbody > tr:first-child > * {
    width: 30px !important;
} */


/* table.dataTable > thead > tr:first-child > * {
    width: 30px !important;
} */


table.dataTable td.dt-control::before {
    border-top: 10px solid transparent;
    border-left: 10px solid rgba(0, 0, 0, 0.5);
    border-bottom: 10px solid transparent;
    border-right: 0px solid transparent;
  }

table.dataTable td.dt-control {
    display: flex;
    align-content: center;
    font-size:18px;
    border: 0px !important;
    height:50px;
    align-items: center;
  }

  table.dataTable td.dt-control:before {
    content: "+" !important;
    border-top: none !important;
    border-left: none !important;
    border-bottom: none !important;
    border-right: none !important;
    padding: 0rem !important;
}

table.dataTable tr.dt-hasChild td.dt-control:before {
    content: "x" !important;
    border-top: none !important;
    border-left: none !important;
    border-bottom: none !important;
    border-right: none !important;
    padding: 0rem !important;
}

table.dataTable tr.dt-hasChild td.dt-control{
    font-size:18px;
}

div.dt-container select.dt-input {
    padding: 0px 3px !important;
    width: 50px;
    font-size: 0.750rem;
}

div.dt-container .dt-search input {
    padding: 1px 3px !important;
    font-size: 0.875rem;
}

div.dt-container div.dt-layout-cell {
    padding-top: 0px;
    padding-bottom: 5px;
}

table th.remove-table-order .dt-column-order {
    display: none;
}

table th .dt-column-title {
    float: left;
}

.dt-container .row:nth-child(1){
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.dt-container .row:nth-child(1) .col-sm-6{
    margin-bottom: 0.500rem;
}

.dt-container .row:nth-child(3){
    display: flex;
    justify-content: space-between;
    width: 100%;
    flex-wrap: wrap;
}

.dt-container .row:nth-child(3) .col-sm-6{
    margin-top: 0.500rem;
}

button.dt-paging-button {
    padding: 0.3em 0.8em !important;
    line-height: 12px;
    width: unset;
}

.view-data-label {
    min-width: 150px;
    width: 150px;
    font-size: 0.750rem;
    background-color: #f1f5f9c4;
    padding: 0.200rem 0.400rem;
}

.view-data-value {
    font-size: 0.750rem;
    margin-bottom: 0.200rem;
    width: 100%;
    min-width: 240px;
    padding: 0.200rem 0.400rem;
    position: relative;
    padding-right:1rem;
}

.view-data-value a:hover{
    color:blue;
}

.form-filed-edit svg{
    fill:rgb(var(--color-theme-1)) !important;
    width:14px;
    height:14px;
}

.form-filed-edit{
    position: absolute;
    right: 20px;
    top: 5px;
}

.view-data-divid {
    min-width: 20px;
    margin-bottom: 0.500rem;
}

label.error,
span.span-error, span.text-danger {
    color: red;
}

.border-right-dotted {
    border-right: 1px dotted #e2e8f0;
    border-left: 1px dotted #e2e8f0;
}

.border-bottom-solid {
    border-bottom: 1px dotted #04085f36;
}

button {
    font-size: 0.700rem;
    width: 75px;
    font-weight: normal !important;
}

button.transition {
    height: 1.5rem;
}

button.border-primary:hover,
.button.border-primary:hover {
    background-color: rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
    color: #fff !important;
}

.button {
    font-size: 0.700rem;
    font-weight: normal !important;
    height: 1.5rem;
}

button.transition.border-success:hover,
.button.transition.border-success:hover {
    background-color: #0d9488 !important;
    color: #fff !important;
}

button.transition.border-warning:hover,
.button.transition.border-warning:hover {
    background-color: #ca8a04 !important;
    color: #fff !important;
}

.export-csv-icon path{
    fill:#475569;
}

button.transition.border-warning:hover .export-csv-icon path,
.button.transition.border-warning:hover .export-csv-icon path {
    fill:#fff !important;
}

button.transition.border-danger:hover,
.button.transition.border-danger:hover {
    background-color: #b91c1c !important;
    color: #fff !important;
}

button.transition.border-secondary:hover {
    background-color: #e5e7eb !important;
}

button.transition.border-dark:hover {
    background-color: #1e293b !important;
    color: #fff !important;
}

button svg {
    margin-right: 0.300rem;
}

form label {
    font-size: 0.750rem;
    font-weight: 500;
}

form .tab-pane label{
    width: 100%;
}

select:invalid {
    color: gray !important;
}

.site-logo {
    width: 80px !important;
    padding-right: 0px;
    padding-left: 0px;
}

.dashboard-logo-fit {
    width: 75px;
    height: 100%;
}

.dashboard-logo-fit {
    width: 50px;
    height: 40px;
    margin-top: 20px;
}


div.dt-container .dt-paging .dt-paging-button.previous:hover {
    color: #fff !important;
    border: 1px solid rgb(243 242 242);
    background-color: rgba(0, 0, 0, 0.05) !important;
    background: -webkit-linear-gradient(rgb(var(--color-primary) / var(--tw-bg-opacity))) !important;
    background: -moz-linear-gradient(rgb(var(--color-primary) / var(--tw-bg-opacity))) !important;
    background: -ms-linear-gradient(rgb(var(--color-primary) / var(--tw-bg-opacity))) !important;
    background: -o-linear-gradient(rgb(var(--color-primary) / var(--tw-bg-opacity))) !important;
    background: rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
}

div.dt-container .dt-paging .dt-paging-button.next:hover {
    color: #fff !important;
    border: 1px solid rgb(243 242 242);
    background-color: rgba(0, 0, 0, 0.05) !important;
    background: -webkit-linear-gradient(rgb(var(--color-primary) / var(--tw-bg-opacity))) !important;
    background: -moz-linear-gradient(rgb(var(--color-primary) / var(--tw-bg-opacity))) !important;
    background: -ms-linear-gradient(rgb(var(--color-primary) / var(--tw-bg-opacity))) !important;
    background: -o-linear-gradient(rgb(var(--color-primary) / var(--tw-bg-opacity))) !important;
    background: rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
}

div.dt-container .dt-paging .dt-paging-button.current,
div.dt-container .dt-paging .dt-paging-button.current:hover,
div.dt-container .dt-paging .dt-paging-button.disabled:hover,
div.dt-container .dt-paging .dt-paging-button:hover,
div.dt-container .dt-paging .dt-paging-button.disabled:active {
    color: #fff !important;
    border: 1px solid rgb(243 242 242);
    background-color: rgba(0, 0, 0, 0.05) !important;
    background: -webkit-linear-gradient(rgb(var(--color-primary) / var(--tw-bg-opacity))) !important;
    background: -moz-linear-gradient(rgb(var(--color-primary) / var(--tw-bg-opacity))) !important;
    background: -ms-linear-gradient(rgb(var(--color-primary) / var(--tw-bg-opacity))) !important;
    background: -o-linear-gradient(rgb(var(--color-primary) / var(--tw-bg-opacity))) !important;
    background: rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
    width: unset;
}

div.dt-container .dt-paging .dt-paging-button.disabled {
    color: rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
    cursor: pointer;
    width: unset;
}

.w-10{
    width:10px;
}

.max-w-\[280px\] {
    width: 280px;
}

.w-\[14px\] {
    width: 14px;
}

.h-\[14px\] {
    height: 14px;
}

.w-\[16px\] {
    width: 16px;
}

.h-\[16px\] {
    height: 16px;
}

.w-\[30px\] {
    width: 30px;
}

.w-\[45px\] {
    width: 45px;
}

.w-\[60px\] {
    width: 60px;
}

.w-\[95px\] {
    width: 95px;
}

.w-\[100vw\] {
    width: 100%;
}

.w-\[120px\] {
    width: 120px;
}

.w-\[140px\] {
    width: 140px;
}

.w-\[220px\] {
    width: 220px;
}

.w-\[240px\] {
    width: 240px;
}

.w-\[40pc\] {
    width: 40%;
}

.h-\[30px\] {
    height: 30px;
}

.h-\[60px\] {
    height: 60px;
}

.h-\[95px\] {
    height: 95px;
}

.h-\[12px\] {
    height: 12px;
}

.w-\[12px\] {
    width: 12px;
}

.h-\[8px\] {
    height: 8px;
}

.w-\[8px\] {
    width: 8px;
}

.h-\[10px\] {
    height: 10px;
}

.w-\[10px\] {
    width: 8px;
}

.header-profile-icon svg {
    stroke: #fff;
    fill: #fff;
}

nav ol li a{
    text-transform: capitalize;
}

.bg-login-form-right {
    background-color: #fff;
    padding: 5rem 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bg-login-form-left {
    padding: 5rem 5rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bg-login-form-left:after {
    background-image: url(/assets/images/bg-lucent.png);
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    opacity: 0.2;
}

.login-form-left h2 {
    text-align: center;
}

.logo-cards .box {
    width: 30%;
    height: 120px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0.3rem;
    margin-bottom: 0.2rem;
}

.logo-cards .box img {
    width: 100%;
    height: auto;
    max-width: 165px;
}

.min-h-350 {
    min-height: 350px;
    box-shadow: 0px 0px 4px 1px #00000003;
}

.md\:p-30 {
    padding: 6rem;
}

.lg\:col-span-8 {
    grid-column: span 11 / span 11;
}

.lg\:col-span-1 {
    grid-column: span 1 / span 1;
}

.lg\:col-span-8 {
    grid-column: span 12 / span 12;
}

.lg\:col-span-4 {
    grid-column: span 12 / span 12;
}

.lg\:col-span-5 {
    grid-column: span 12 / span 12;
}

.lg\:col-span-3 {
    grid-column: span 12 / span 12;
}

.lg\:col-span-2 {
    grid-column: span 12 / span 12;
}

.lg\:col-span-10 {
    grid-column: span 12 / span 12;
}

.group.show .group-\[\.show\]\:mt-12 {
    margin-top: 2rem;
}

.btn-w-95 {
    width: 95px;
}

.form-success-alert {
    position: fixed;
    top: 50px;
    width: fit-content;
    right: 0px;
    display: none;
}

#otpFormSection {
    display: none;
}

.justify-space-between {
    justify-content: space-between;
}

.justify-content-start {
    justify-content: flex-start;
}

.justify-content-end {
    justify-content: flex-end;
}

.justify-content-spacearound {
    justify-content: space-around;
}

.justify-content-spacebetween {
    justify-content: space-between;
}

.justify-content-center {
    justify-content: center;
}

.d-none {
    display: none;
}

.d-block {
    display: block;
}

.align-item-center {
    align-items: center;
}

/*BEGIN: Note Modal*/

.note-btn-group .note-btn {
    width: unset;
    padding: 1px 5px;
    font-size: 10px;
    line-height: 1.4;
}

.note-modal-backdrop {
    z-index: 0 !important;
    background: rgba(255, 255, 255, 0) !important;
}

.note-modal-content {
    font-size: 0.800rem;
}

.note-modal-header {
    padding: 0.300rem;
}

.note-modal-title {
    font-size: 1rem;
    font-family: "Public Sans";
    font-weight: 400;
}

.note-modal-body {
    padding: 0.500rem;
    font-family: "Public Sans";
    font-weight: normal;
    font-size: 0.750rem;
}

.note-modal-body label {
    font-family: "Public Sans";
    font-weight: normal;
    font-size: 0.750rem;
    padding: 0px !important;
}

.note-modal-body input[type=text] {
    height: 25px;
    font-family: "Public Sans";
    font-weight: normal;
    font-size: 0.750rem;
}

.note-modal-body input {
    border-radius: 0.200rem;
    border-color: #e5e7e9;
}

.note-modal-footer .note-btn {
    color: #fff !important;
    border: 1px solid rgb(243 242 242);
    background-color: rgba(0, 0, 0, 0.05) !important;
    background: -webkit-linear-gradient(rgb(var(--color-primary) / var(--tw-bg-opacity))) !important;
    background: -moz-linear-gradient(rgb(var(--color-primary) / var(--tw-bg-opacity))) !important;
    background: -ms-linear-gradient(rgb(var(--color-primary) / var(--tw-bg-opacity))) !important;
    background: -o-linear-gradient(rgb(var(--color-primary) / var(--tw-bg-opacity))) !important;
    background: rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
    opacity: 1;
    font-size: 0.700rem;
    font-weight: 400;
    font-family: "Public Sans";
    margin-bottom: 1rem;
    padding: 0.3rem 0.5rem;
}

.note-form-group {
    padding-bottom: 10px;
}

.note-modal-footer {
    height: 40px;
    padding: 0px 0.500rem;
}

.note-modal-body [type=checkbox]:checked {
    margin-right: 0.300rem;
}

.note-editable ul {
    list-style: unset;
    padding-left: 20px;
    margin-bottom: 0.500rem;
}

.note-editable ol {
    list-style: decimal;
    padding-left: 20px;
    margin-bottom: 0.500rem;
}

.note-editable p {
    margin-bottom: 0.500rem;
}

.note-editable {
    height: auto;
    font-size: 0.750rem;
    font-weight: normal;
    font-family: "Public Sans";
}

/* Pasted content from Word/Outlook/Gmail is styled by its own inline styles (assets/js/email/mailPasteCleaner.js).
   Undo the Tailwind preflight for the elements it resets, so whatever the copy left unstyled looks like a browser.
   Links: Summernote's own stylesheet makes an editor link inherit its underline and background (its selector is
   .note-editor .note-editing-area .note-editable a), so this rule is more specific than that one. It sets no colour and
   no !important, so a link's own inline style from the copy still wins. */
html .note-editor .note-editing-area .note-editable a {
    text-decoration-line: underline;
    background-color: transparent;
}

.note-editable h1,
.note-editable h2,
.note-editable h3,
.note-editable h4,
.note-editable h5,
.note-editable h6 {
    font-size: revert;
    font-weight: revert;
    margin: revert;
}

.note-editable blockquote,
.note-editable pre,
.note-editable hr {
    margin: revert;
}

.note-editable hr {
    border: revert;
    height: revert;
    color: revert;
}

.note-editable img {
    display: inline;
}

.note-group-image-url {
    display: none;
}

/*END: Note Modal*/

.image-border {
    border: 1px solid #e5e7eb;
    display: flex;
    align-items: center;
    justify-content: center;
}

.dynamic-image .dynamic-image-delete {
    position: absolute;
    top: 0px;
    right: 0px;
    cursor: pointer;
    fill: #fff;
    stroke: #000;
}

.dynamic-image img {
    object-fit: contain;
    object-position: center;
    max-width: 100%;
    height: 100%;
    width: 100%;
}

.image-box-size {
    width: 100%;
    height: 135px;
}

.service-section-add .flex,
.faq-section-add .flex {
    cursor: pointer;
}

.pb-2 {
    padding-bottom: 0.5rem;
}

.dynamic-service-section,
.dynamic-faq-section {
    border-bottom: 1px dotted #e5e7eb;
}

.modal .dynamic-service-section,
.modal .dynamic-faq-section {
    border: none;
}

.col-span-1 {
    grid-column: span 1 / span 1;
}

.col-span-11 {
    grid-column: span 11 / span 11;
}

.tab-list li button {
    border: 1px solid rgb(var(--color-primary) / var(--tw-bg-opacity));
}

.tab-list li span.tab-nav {
    border: 1px solid rgb(var(--color-primary) / var(--tw-bg-opacity));
    text-align:center;
}

.tab-list li {
    padding: 0.100rem;
}

.flex-warp {
    flex-wrap: wrap;
}

.flex-nowarp {
    flex-wrap: nowrap;
    cursor: pointer;
}

.cursor-pointer {
    cursor: pointer;
}

[type=checkbox],
[type=radio] {
    width:1rem;
    height:1rem;
}

table.dataTable [type=checkbox]{
    width:0.75rem;
    height:0.75rem;
    border-radius: 3px;
    --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

/*BEGIN:multiselect-dropdown*/
.multiselect-dropdown {
    width: 100% !important;
}

.multiselect-dropdown-search {
    font-size: 0.750rem;
    line-height: 1rem;
    padding: 0.300rem;
    border: 1px solid #e5e7eb;
}

.multiselect-dropdown-list input {
    width: 0.8rem !important;
    height: 0.8rem !important;
    margin-right: 0.35em;
    border: 1px solid #e5e7eb;
}

.multiselect-dropdown-list div:hover {
    background-color: #e5e7eb66 !important;
}

.multiselect-dropdown-list .multiselect-dropdown-all-selector {
    border-bottom: 1px solid #e5e7eb;
}

.multiselect-dropdown-list div {
    padding: 0.15rem;
}

.multiselect-dropdown span.optext {
    background-color: #e5e7eb66 !important;
    padding: 0.1rem 0.5rem;
    font-size: 0.700rem;
    line-height: 1rem;
}

.multiselect-dropdown span.optext .optdel {
    margin-top: 0px !important;
    color: #666;
}

.multiselect-dropdown {
    width: 100% !important;
}

/* table.mail-list-table thead {
    display: none;
} */

table.mail-list-table tr td {
    border-left: 0px !important;
    border-right: 0px !important;
}

table.mail-list-table thead > tr > th.dt-orderable-asc span.dt-column-order:before{
    display:none !important;
}

table.mail-list-table thead > tr > th.dt-orderable-asc span.dt-column-order:after{
    display:none !important;
}

table.mail-list-table tr th {
    border-left: 0px !important;
    border-right: 0px !important;
}

table.mail-list-table tr {
    border-left: 0px !important;
    border-right: 0px !important;
}

table.mail-list-table tr .mail-addressing {
    cursor: pointer;
    text-align: left;
}

table.mail-list-table tr .mail-corporate {
    text-align: left;
}

table.mail-list-table tr .mail-subject {
    text-align: left;
}

table.mail-list-table tr .mail-assign-to {
    text-align: left;
}

table.mail-list-table tr .mail-date {
    text-align: left;
}

table.mail-list-table tr:hover .mail-addressing a {
    color: blue;
}

table.mail-list-table tr td.mail-fromTo-td{
    width:12% !important;
}

table.mail-list-table tr td.mail-subject-td{
    width: 36% !important;
}

table.mail-list-table tr td.mail-corporate-td{
    width:12% !important;
}

table.mail-list-table tr td.mail-assignto-td{
    width:10% !important;
}

table.mail-list-table tr td.mail-attachment-td{
    width:5% !important;
}

table.mail-list-table tr td.mail-date-td{
    width:15% !important;
}

table.mail-list-table tr td.mail-to-td {
    width: 12% !important;
    max-width: 260px;
    text-align: left;
    vertical-align: top;
}

/* Unassigned Mail List "Mail To": the recipient list is one long comma-joined string,
   so it needs an explicit wrap. emailList.js inserts a <wbr> after each comma; these
   rules let the cell use those break points and keep the column narrow. */
table.mail-list-table tr td.mail-to-td .mail-to-cell {
    display: block;
    max-width: 220px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.35;
}

/* Unassigned Mail List: long Subject is cut with "..." (full text in the title tooltip). */
table.mail-list-table tr td .mail-subject-cell {
    display: block;
    max-width: 320px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Unassigned Mail List: every cell is a link to the mail's view page. */
table.mail-list-table tr td a.mail-row-link {
    display: block;
    color: inherit;
    text-decoration: none;
}

table.mail-list-table tr.mail-row-clickable {
    cursor: pointer;
}

table.mail-list-table tr.mail-row-clickable:hover > td {
    background-color: #e0e7ff;
}

/* Mail To shows addresses exactly as stored (no Title Case from the table styles). */
table.mail-list-table tr td.mail-to-td,
table.mail-list-table tr td.mail-to-td .mail-to-cell {
    text-transform: none !important;
}

/* Action cell is not part of the row link: plain pointer, no row-hover navigation cue. */
table.mail-list-table tr td.mail-action-td {
    cursor: default;
}

/* Read / Unread badge column (soft colours). */
table.mail-list-table .mail-read-badge {
    display: inline-block;
    padding: 2px 10px;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.5;
    border-radius: 999px;
    border: 1px solid transparent;
}

table.mail-list-table .mail-read-badge.unread {
    color: #92400e;
    background: #fef3c7;
    border-color: #fcd34d;
}

table.mail-list-table .mail-read-badge.read {
    color: #1e40af;
    background: #dbeafe;
    border-color: #bfdbfe;
}

/* Action column: Mark read / unread envelope button. */
table.mail-list-table .mail-read-toggle {
    display: inline-flex;
    align-items: center;
    padding: 2px;
    background: none;
    border: 0;
    border-radius: 4px;
    cursor: pointer;
}

table.mail-list-table .mail-read-toggle:hover {
    background: #e2e8f0;
}

table.mail-list-table .mail-read-toggle:disabled {
    opacity: 0.5;
    cursor: wait;
}

table.mail-list-table .mail-read-toggle.unread {
    color: #b45309;
}

table.mail-list-table .mail-read-toggle.read {
    color: #1d4ed8;
}

/* "View thread" text link under the subject in the Unassigned Mail List (always one line). */
.thread-link,
.thread-link .thread-toggle-label {
    white-space: nowrap;
}

.thread-link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 0;
    font-size: 12px;
    color: #1d4ed8;
    background: none;
    border: 0;
    cursor: pointer;
}

.thread-link:hover {
    text-decoration: underline;
}

.thread-link svg {
    width: 12px;
    height: 12px;
    transition: transform 0.15s ease;
}

.thread-link.open svg {
    transform: rotate(180deg);
}

/* Read / Unread icon in the Action column (no longer used by the Unassigned Mail List). */
table.mail-list-table .mail-read-icon {
    display: inline-flex;
    align-items: center;
}

table.mail-list-table .mail-read-icon.unread {
    color: #dc2626;
}

table.mail-list-table .mail-read-icon.read {
    color: #16a34a;
}

/* "Show full thread" button (Mails & Notes, View Email, Unassigned Mail List). */
.thread-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
    color: #1d4ed8;
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: 6px;
    cursor: pointer;
    white-space: nowrap;
}

.thread-toggle:hover {
    background: #dbeafe;
}

.thread-toggle svg {
    width: 14px;
    height: 14px;
    flex: 0 0 auto;
    transition: transform 0.15s ease;
}

.thread-toggle.open svg {
    transform: rotate(180deg);
}

/* "Show earlier messages" (Mails & Notes): the quoted conversation under a mail, collapsed. */
.mail-quote-box {
    margin-bottom: 0.5rem;
}

.mail-quote-container {
    border-left: 3px solid #e5e7eb;
    padding-left: 8px;
}

/* Mail headers: long To / Cc / Subject wrap inside their box instead of running out of it. */
.mail-section-header .mailer-meta-form,
.mail-section-header .mailer-meta-to,
.mail-section-header .mailer-subject,
.mail-section-header .mail-to-dropdown,
.mailer-meta-to .dropdown-content td {
    min-width: 0;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.mail-section-header .mail-to-dropdown,
.mail-section-header .mailer-subject .flex {
    flex-wrap: wrap;
}

.mailview-field {
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* Recovered thread messages: images / tables never wider than their card. */
.forward-thread-body img {
    max-width: 100% !important;
    height: auto !important;
}

.forward-thread-body table {
    max-width: 100% !important;
}

/* Received and sent mail bodies, rendered in a sandboxed iframe (components/mailBodyFrame.blade.php).
   Its height is set from the frame's content by sizeMailFrame() in assets/js/email/viewEmailData.js. */
.mail-frame {
    display: block;
    width: 100%;
    border: 0;
    background: #fff;
}

/* Mails & Notes (components/viewMailList.blade.php): white space round the mail, as a mail client's reading pane
   has. On the frame rather than inside the mail, so the sender's own CSS can't remove it; sizeMailFrame()
   (viewEmailData.js) adds the top/bottom padding to the frame's height. */
.mail-chain-list .mail-frame {
    padding: 10px 14px;
}

/* Mails & Notes: shown while the thread is fetched (loadOrderMailThread). A thread already on screen
   (re-fetch after sending a mail) stays visible but dimmed under the loader. */
.mail-thread-loader {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 24px 0;
    color: #64748b;
    font-size: 13px;
}

.mail-thread-loader-spinner {
    width: 20px;
    height: 20px;
    border: 2px solid #cbd5e1;
    border-top-color: rgb(var(--color-primary));
    border-radius: 50%;
    animation: mail-thread-spin 0.8s linear infinite;
}

@keyframes mail-thread-spin {
    to {
        transform: rotate(360deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .mail-thread-loader-spinner {
        animation-duration: 2.4s;
    }
}

.email-list-thread[aria-busy="true"] > .mail-section {
    opacity: 0.5;
    pointer-events: none;
}

.mail-thread-error {
    padding: 24px 0;
    text-align: center;
    color: #b91c1c;
    font-size: 13px;
}

.mail-thread-error button {
    margin-left: 6px;
    text-decoration: underline;
}

/* Mails & Notes pager (components/mailThreadPagination), above and below the thread. */
.mail-thread-pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 4px 0 8px;
    font-size: 12px;
    color: #64748b;
}

.mail-thread-pagination-pages {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 3px;
}

/* width: auto opts out of the global `button { width: 75px }` rule; the buttons size to their label. */
.mail-thread-page {
    width: auto;
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    border: 1px solid #e2e8f0;
    border-radius: 3px;
    background: #fff;
    color: #334155;
    font-size: 11px;
    line-height: 20px;
    cursor: pointer;
}

.mail-thread-page:hover:not(:disabled):not(.active) {
    border-color: rgb(var(--color-primary));
    color: rgb(var(--color-primary));
}

.mail-thread-page:focus-visible {
    outline: 2px solid rgb(var(--color-primary));
    outline-offset: 1px;
}

.mail-thread-page.active {
    border-color: rgb(var(--color-primary));
    background: rgb(var(--color-primary));
    color: #fff;
    cursor: default;
}

.mail-thread-page:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

.mail-thread-page-gap {
    padding: 0 2px;
}

/* Compact SweetAlert2 popup for the mail compose / reply alerts (emailPopup.js MAIL_ALERT_CLASS, and
   updateSubmit's swal.customClass). Sizes are in em of the popup's own font-size, so one value scales it. */
.swal2-popup.mail-alert {
    width: min(26em, 92vw);
    padding: 0 0 1.1em;
    font-size: 0.8rem;
}

.swal2-popup.mail-alert .swal2-icon {
    font-size: 0.65em;
    margin: 1.6em auto 0.4em;
}

.swal2-popup.mail-alert .swal2-title {
    padding: 0.4em 1.2em 0;
    font-size: 1.35em;
    line-height: 1.3;
}

.swal2-popup.mail-alert .swal2-html-container {
    margin: 0.5em 1.4em 0;
    font-size: 1.05em;
    line-height: 1.5;
}

.swal2-popup.mail-alert .swal2-actions {
    margin-top: 1em;
}

table.mail-list-table tr:nth-child(even) {
    background-color: #f1f5f9;
}

table.mail-list-table tr>td:nth-child(1) {
    width: 20px;
}

table.mail-list-table tr>td:nth-child(5) {
    width: 100px;
    text-align: left;
}

table.mail-list-table tr>td:nth-child(2) {
    text-align: left;
}

table.mail-list-table tr>td:nth-child(3) {
    text-align: left;
}

table tr:hover>td a:hover {
    color: blue;
}

.mailer-meta-to .dropdown-content {
    width: 320px !important;
}

.mailer-meta-to .dropdown {
    font-size: 0.620rem;
    align-items: center;
}

.mailer-meta-form{
    font-size:0.650rem;
}

.mailer-meta-subject {
    font-size:0.650rem;
}

.dropdown-content tbody tr {
    border-left: 1px solid #fff !important;
    border-right: 1px solid #fff !important;
}

.dropdown-content tbody tr td {
    border-left: 1px solid #fff !important;
    border-right: 1px solid #fff !important;
    border-bottom: 1px solid #e5e7eb !important;
    border-top: 1px solid #e5e7eb !important;
    font-size: 0.650rem;
    line-height: 0.800rem;
    word-break: break-word;
    overflow-wrap: break-word;
}

.mail-to-dropdown {
    position: relative;
    align-items: center;
    font-size: 0.650rem;
}

.mail-to-dropdown .dropdown-content {
    display: none;
    position: absolute;
    top: 20px;
    background: #fff;
    padding: 0.5rem;
    box-shadow: 0px 5px 10px #00000030;
    border-radius: 5px;
    left: 0px;
}

.mail-to-dropdown:hover .dropdown-content {
    display: block;
    z-index: 1;
}

.mail-icons-meta {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.mail-icons-meta span {
    margin-top: 0.15rem;
    margin-bottom: 0.15rem;
    margin-left: 1.2rem;
    margin-right: 0.2rem;
}

.mail-icons-meta .mail-date {
    margin-left: 1.5rem;
}

.mail-section-header {
    border-bottom: 1px solid #e5e7eb;
}

.mailer-meta-to {
    margin-left: 1rem;
}

.mail-content-box {
    padding-top: 0.500rem;
    margin-bottom: 0.500rem;
    font-size:0.650rem;
}

.mail-content-box p,
.mail-content-box ol,
.mail-content-box ul {
    margin-bottom: 0.3rem;
}

/* Mails & Notes attachments (components/viewMailList.blade.php), Outlook-style: a card per file (type icon,
   name, size, View / Download) that wraps onto more rows; cards past the first few stay hidden until
   "Show all N attachments" adds .show-all (viewEmailData.js). */
.mail-content-attachment {
    border-bottom: 1px solid #e5e7eb;
    padding: 0.4rem 0;
}

.mail-content-attachment ul.mail-attachment-grid {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 0.4rem;
}

.mail-content-attachment ul li.mail-attachment-item {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    flex: 0 1 250px;
    min-width: 0;
    max-width: 100%;
    margin: 0;
    padding: 0.3rem 0.5rem;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    cursor: default;
}

.mail-content-attachment ul li.mail-attachment-item:hover {
    border-color: #cbd5e1;
    color: inherit;
}

.mail-content-attachment ul li.mail-attachment-extra {
    display: none;
}

.mail-content-attachment.show-all ul li.mail-attachment-extra {
    display: flex;
}

/* Fixed size: images get max-width: 100%, so a long name would otherwise squeeze the type icon. */
.mail-attachment-item .mail-attachment-icon {
    display: inline-flex;
    flex: 0 0 auto;
}

.mail-content-attachment ul.attached-image-list li img {
    width: 22px;
    max-width: none;
    margin: 0;
}

.mail-attachment-item .mail-attachment-meta {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-width: 0;
    line-height: 1.3;
}

.mail-attachment-item .mail-attachment-name {
    font-size: 0.7rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mail-attachment-item .mail-attachment-size {
    font-size: 0.6rem;
    color: #64748b;
}

.mail-content-attachment .mail-attachment-footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.25rem 1.25rem;
    margin-top: 0.4rem;
}

.mail-attachment-item .mail-attachment-action {
    display: inline-flex;
    align-items: center;
    padding: 0.1rem;
}

.mail-attachment-item .mail-attachment-action svg {
    width: 13px;
    height: 13px;
}

.mail-attachment-item a.mail-attachment-action:hover {
    color: blue;
}

.mail-attachment-item .mail-attachment-action-disabled {
    opacity: 0.35;
}

.mail-section .mail-attachment-item .mail-attachment-action-disabled svg {
    cursor: not-allowed;
}

.mail-section svg {
    cursor: pointer;
}

svg {
    cursor: pointer;
}

.mail-attachment-download-li {
    margin-left: 1.5rem !important;
}

.mail-section .col-span-8 {
    grid-column: span 8 / span 8;
}

.mail-section .col-span-4 {
    grid-column: span 4 / span 4;
}

.mail-attachment svg {
    stroke: rgb(var(--color-primary) / var(--tw-bg-opacity));
}

.mail-reply svg {
    fill: #fff;
}

.mail-replayall svg {
    fill: #fff;
}

.mail-forward svg {
    fill: #fff;
}

.mail-splite svg {
    stroke: rgb(var(--color-primary) / var(--tw-bg-opacity));
}

.mail-attachment-download-li svg {
    stroke: rgb(var(--color-primary) / var(--tw-bg-opacity));
}

.modal-tooltip-hover{
    position: relative;
}

.modal-tooltip-title{
    display:none;
}

.modal-tooltip-hover:hover .modal-tooltip-title{
    position: absolute;
    background-color: #000;
    color:#fff;
    font-size:0.600rem;
    display:block;
    width: fit-content;
    line-height: 0.800rem;
    width: 65px;
    line-height: 0.800rem;
    text-align: center;
    padding: 0.2rem;
}
/*END: mail section*/

/*BEGIN: Accordion*/
.accordion-group .accordion {
    cursor: pointer;
    transition: 0.4s;
    padding-top: 0.300rem;
    padding-bottom: 0px;
    padding-left: 0.400rem;
    padding-right: 0.400rem;
}

.accordion-group .active,
.accordion-group .accordion:hover {
    background-color: #f1f5f9;
}

.accordion-group .panel {
    display: none;
    background-color: white;
    overflow: hidden;
    padding-top: 0.300rem;
    padding-left: 0.400rem;
    padding-right: 0.400rem;
}

.accordian-item .mail-section-header {
    border-bottom: none;
}

.accordion-group .accordian-item {
    border-bottom: 1px solid #e5e7eb;
}

.accordion-group .accordian-item:has(>.accordion.active) {
    background: #f1f5f9;
    margin-bottom: 0.3rem;
    box-shadow: 0px 1px 4px #0000003d;
}

.accordion-group .accordion.active+.panel {
    background: #fff !important;
}

.accordion-group .accordion.active .mail-section-header {
    border-bottom: 1px solid #e5e7eb;
}

.accordian-action-nav {
    display: flex;
    flex-wrap: wrap;
}

.accordian-action-nav li {
    display: flex;
    flex-wrap: wrap;
    margin-left: 0.5rem;
    align-items: center;
    cursor: pointer;
    font-size: 0.7rem;
}

.accordian-action-nav li svg {
    margin-right: 0.1rem;
}

.accordian-paginations .pagination {
    display: flex;
}

.accordian-paginations .pagination a {
    box-sizing: border-box;
    display: inline-block;
    min-width: 1.8em;
    height: 1.2rem;
    line-height: 1rem;
    padding: 0.1em 0.2em;
    margin-left: 2px;
    text-align: center;
    text-decoration: none !important;
    cursor: pointer;
    color: inherit !important;
    border: 1px solid transparent;
    border-radius: 2px;
    background: transparent;
}

.accordian-paginations .pagination a:hover {
    background-color: rgb(var(--color-primary) / var(--tw-bg-opacity));
    color: #fff !important;
}

.accordian-paginations .pagination a.active {
    background-color: rgb(var(--color-primary) / var(--tw-bg-opacity));
    color: #fff !important;
}

ul.attached-image-list {
    display: flex;
    align-items: center;
}

ul.attached-image-list li {
    position: relative;
}

ul.attached-image-list li img {
    width: 20px;
    margin: 0.3rem;
}

ul.attached-image-list li .attached-image-delete {
    position: absolute;
    top: 0px;
    right: 0px;
}

/*END: Accordion*/

/*BEGIN: Mail Compose*/
.mail-box-type input{
    border-color: #0000003b !important;
    border-width: 1px !important;
    border-style: solid !important;
    box-shadow: unset !important;
}

.mail-box-type {
    padding-bottom:0.400rem;
}

.mail-box-to {
    display: flex;
    align-items: center;
}

.mail-box-cc {
    display: flex;
    align-items: center;
}

.mail-box-compose input,
.mail-box-compose select {
    border: 0;
    box-shadow: none;
}

.mail-box-compose label {
    margin-right: 0.5rem;
}

.mail-box-btn {
    margin-left: 0.5rem;
}

.mail-box-to,
.mail-box-cc,
.mail-box-temp,
.mail-box-subject,
.mail-box-message,
.mail-box-type {
    border-bottom: 1px dotted #e5e7eb;
}

.mail-box-temp select {
    padding-left: 0px;
    padding-right: 0px;
}

.mail-box-subject input {
    padding-left: 0px;
    padding-right: 0px;
}

.mail-box-message .note-toolbar {
    background-color: #fff !important;
    border-bottom: 1px solid;
    border-color: #fff !important;
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
    padding-left: 0px !important;
}

.note-tooltip {
    font-size: 0.550rem !important;
}

.note-tooltip-content {
    padding: 0px 4px !important;
}

.mail-box-message .note-editor.note-airframe,
.mail-box-message .note-editor.note-frame {
    border: 1px solid #fff !important;
}

.mail-box-message .note-editor.note-frame .note-statusbar {
    border-bottom-left-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
    border-top: 1px solid #fff !important;
}

.mail-box-message .note-editor.note-frame .note-editing-area .note-editable {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.mail-box-message .note-editor.note-frame .note-placeholder {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.mail-box-message .note-editor.note-frame .note-statusbar {
    background-color: hsl(0deg 0% 50.2% / 0%);
}

.mail-box-submition {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.mail-box-files-browse {
    margin-right: 1.5rem;
}

/* The compose popup is opened with addClass("show") (viewEmailData.js), not modal.js's show(), so it
   never gets the overflow-y-auto that makes a modal scrollable. Without this, a tall body (e.g. an
   image signature) pushes the Upload / Send row below the screen with no way to scroll to it.
   The 10vh offsets the `.modal .shadow-md { top: 10% }` push-down, so a small gap stays below the popup. */
.mail_compose_model {
    overflow-y: auto;
    padding-bottom: calc(10vh + 1.5rem);
}

/* The Order View page doesn't load fileUpload.css, which gives this button its size and white icon;
   without it the button is a full-width navy bar with a near-invisible dark icon. */
.mail-box-files-browse .ajax-file-upload {
    display: inline-block;
    color: #fff;
}

/* Uploaded files in the compose popup wrap onto more rows. The global .ajax-file-upload-container keeps them on
   one line, which with many attachments pushed the Send button out of the popup. */
.mail-box-files-browse .ajax-file-upload-container {
    flex-wrap: wrap;
}

.mail-box-compose svg {
    cursor: pointer;
}

.popup-close svg {
    cursor: pointer;
}

.mail-box-btn:hover {
    cursor: pointer;
}

/*END: Mail Compose*/

.fillter-height-auto.sm\:w-\[450px\] {
    max-width: 450x;
    height: auto;
    margin-top: 45px;
    width: 480px;
}

.order-tabs .tab-content {
    background-color: #fff;
}

.order-tabs ul li span.tab-count {
    font-size: 0.500rem;
    margin-left: 1rem;
}

.order-tabs ul{
    flex-wrap: wrap;
}

.order-tabs ul li button {
    background: #e5e7eb33;
    border: 1px solid #e5e7eb;
}

.order-tabs>ul li button {
    min-width: 140px !important;
}

.order-tabs ul li span.tab-nav {
    background: #e5e7eb33;
    border: 1px solid #e5e7eb;
}

.order-tabs>ul li span.tab-nav {
    min-width: 140px !important;
    text-align:center;
}

.ui-tooltip {
    background-color: #000;
    color: #fff;
    border: 0px solid;
    font-size: 0.600rem;
    line-height: 0.650rem;
    box-shadow: none;
    padding: 0.3rem;
    margin-top: 0px;
    border-radius: 0px;
}

.\[\&\.active\]\:text-slate-700.active {
    background-color: rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
    color: #fff !important;
}

/*BEGIN: Order*/
tr.no-reply-outend {
    background-color: #D6EAF8 !important;
}

tr.fivedays-delay-client {
    background-color: #FDEDEC !important;
}

tr.sevendays-delay-client {
    background-color: #FADBD8 !important;
}

tr.tendays-delay-client {
    background-color: #F5B7B1 !important;
}

svg.original-doc {
    fill: #1E8449;
    stroke: #fff;
}

svg.duplicate-doc {
    fill: #2C3E50;
    stroke: #fff;
}

.original-doc-tr{
    background-color:#1e844917;
}

/*END: Order*/

/*BEGIN: Inquiry*/
.inquiry-icons-meta {
    display: flex;
    justify-content: end;
}

.accordian-item .accordion.active> .inquiry-section-header{
    background-color: #f4f7fa;
    border-bottom:1px solid #e5e7eb;
}

.inquiry-section-header{
    padding:0.300rem 0.400rem;
    cursor: pointer;
}

.accordion-mail-meta{
    position: absolute;
    right: 230px;
    top: 10px;
}

.accordian-item .accordion:hover .inquiry-section-header{
    background-color: #f4f7fa;
}

.external-mail-thread .accordion.active+.panel {
    background-color: rgb(var(--color-theme-2) / 0.1) !important;
}

.external-mail-thread .accordion.active, .note-thread .accordion:hover {
    background-color: rgb(var(--color-theme-2) / 0.2) !important;
}

.external-mail-thread.external-mail-thread-to .accordion.active+.panel {
    background-color: #fff !important;
}

.external-mail-thread.external-mail-thread-to .accordion.active, .note-thread .accordion:hover {
    background-color: #f1f5f9 !important;
}

.internal-mail-thread.internal-mail-thread-to .accordion.active+.panel {
    background-color: #f1f5f9 !important;
}

.internal-mail-thread.internal-mail-thread-to .accordion.active, .note-thread .accordion:hover {
    background-color: #e0e3e5 !important;
}

.internal-mail-thread .accordion.active+.panel {
    background-color: rgb(var(--color-theme-1) / 0.1) !important;
}

.internal-mail-thread .accordion.active, .note-thread .accordion:hover {
    background-color: rgb(var(--color-theme-1) / 0.2) !important;
}

.internal-mail-thread .accordion {
    background-color: #d8dcea !important;
}

.external-mail-thread .accordion {
    background-color: #d9e4eb !important;
}

.external-mail-thread.external-mail-thread-to .accordion {
     background-color: #edeae0 !important;
}

.internal-mail-thread.internal-mail-thread-to .accordion {
    background-color: #d9ebee !important;
}

.document-mail-thread .accordion.active+.panel {
    background-color: #f5eede !important;
}

.document-mail-thread .accordion.active, .document-mail-thread .accordion:hover {
    background-color: #ecdfc0 !important;
}

.document-mail-thread .accordion {
    background-color: #ede3cf !important;
}

.mailer-subject-tag {
    display: inline-block;
    margin-left: 6px;
    padding: 1px 6px;
    border-radius: 10px;
    font-size: 0.6rem;
    font-weight: 600;
    text-transform: uppercase;
    vertical-align: middle;
}

.mailer-subject-tag-external {
    background-color: rgb(var(--color-theme-2) / 0.2);
    color: rgb(var(--color-theme-2));
}

.mailer-subject-tag-internal {
    background-color: rgb(var(--color-theme-1) / 0.2);
    color: rgb(var(--color-theme-1));
}

.mailer-subject-tag-document {
    background-color: #ecdfc0;
    color: #8a6d1d;
}

/* Send result of a mail sent from the CRM (ttk_interaction.interaction_mail_status), next to the type tag. */
.mailer-send-status-sent {
    background-color: rgb(var(--color-success) / 0.15);
    color: rgb(var(--color-success));
}

.mailer-send-status-failed {
    background-color: rgb(var(--color-danger) / 0.15);
    color: rgb(var(--color-danger));
    cursor: help;
}

/* A returned-mail (bounce / delay) notice from the recipient's mail server, received into the thread. */
.mailer-send-status-notice {
    background-color: #fef3c7;
    color: #92400e;
    cursor: help;
}

.note-thread .accordion.active+.panel {
    background: #efe9861f !important;
}

.note-thread .accordion.active, .note-thread .accordion:hover {
    background-color: #eaca5e33;
}

.question-thread .accordion.active, .question-thread .accordion:hover {
    background-color: #5ebfea33;
}

.question-thread .accordion.active+.panel {
    background: #5ebfea14 !important;
}

.response-thread .accordion.active, .response-thread .accordion:hover {
    background-color: #fff;
}

.response-thread .accordion.active+.panel {
    background-color: #fff !important;
}

.response-thread .acordion-panel {
    background-color: #fff !important;
}

.response-thread .acordion {
    background-color: #fff !important;
}

.accordian-item.response-thread{
    background-color: #fff !important;
    margin-bottom:0.300rem;
}

.response-thread .accordion.active, .response-thread .accordion:hover {
    background-color: #fff;
}

.note-write-wrapper select {
    border:1px solid #e5e7eb !important;
}

.note-write-wrapper input[type="date"] {
    border:1px solid #e5e7eb !important;
}

.select2.select2-container{
    width: 100% !important; 
}

.select2-container--default .select2-selection--single {
    border:1px solid #e5e7eb !important;
    border-radius: 5px !important;
    width: 100% !important;
}

.mail-write-wrapper .select2-container--default .select2-selection--single{
    border:1px solid #fff !important;
}

.mail-write-wrapper .select2-container--default .select2-selection--multiple{
    border:1px solid #fff !important;
}

.mail-write-wrapper .select2-container--default .select2-search--inline .select2-search__field{
    padding-left: 0px !important;
    margin-left: 0px !important;
}

.select2-selection__choice__remove{
    width: unset;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #e4e4e403 !important;
}

::placeholder{
    color: #adb7cc !important;
}

.select2-selection__placeholder{
    color: #adb7cc !important;
}

.note-placeholder{
    color: #adb7cc;
}

.select2-container--classic .select2-selection--single{
    background-image: none !important;
    background-color: #fff !important;
    border-color:#e5e7eb !important
}

.select2-container--classic .select2-selection--single .select2-selection__arrow{
    background-image: none !important;
    background-color: #fff !important;
    border-left: 1px solid #e5e7eb !important;
}

.select2-search__field{
    padding:0px 0.2rem !important;
    font-size:0.700rem;
}

.accordion-filter-list{
    display: none;
    position: absolute;
    z-index: 99999;
    background-color: #fff;
    text-align: left;
    top: 20px;
    cursor: pointer;
    box-shadow: 0px 1px 4px #e5e7eb;
    border:1px solid #e5e7eb;
    margin-left:0px;
    width:55px;
}

.accordion-filter-list ul li{
    padding:0.1rem;
    border-bottom:1px solid #e5e7eb;
}

.accordion-filter-list ul li:hover{
    background-color: #f1f5f9;
}

.accordion-fillter{
    position: relative;
    margin-right:1.2rem;
}

.accordion-fillter:hover .accordion-filter-list{
    display:block;
}

.form-inquery-merge input{
    height:25px;
    margin-right: 0.3rem;
}

.form-inquery-merge{
    margin-left: 0.3rem;
}

/*END: Inquiry*/

.select2-dropdown {
    z-index: 99999;
}

.select2-results ul.select2-results__options li{
     padding-top:0px !important;
     padding-bottom:0px !important;
}

/*BEGIN: Dashboard*/
.dashboard-cards{
    cursor: pointer;
}

.dashboard-span-2{
    grid-column: span 2 / span 2;
}

.dashboard-span-4{
    grid-column: span 4 / span 4;
}

.dashboard-span-6{
    grid-column: span 6 / span 6;
}

.dashboard-span-8{
    grid-column: span 8 / span 8;
}

.dashboard-span-10{
    grid-column: span 10 / span 10;
}

.dashboard-span-12{
    grid-column: span 12 / span 12;
}

.dashboard-span-card{
    position: relative;
}

.dashboard-span-card .accordian-item .accordion{
    padding:0.1rem;
}

.dashboard-span-card .accordian-item .acordion-panel{
    padding:0.1rem;
    border-top: 1px dotted #e5e7eb;
}

.dashboard-span-action {
    margin-top: 0.300rem;
    padding-top: 0.3rem;
    display: inline-flex;
    position: absolute;
    top: -5px;
    right: 15px;
}

.dashboard-span-value{
    padding: 0.1rem;
    font-size: 0.600rem;
    line-height: 0.88rem;
    width: 40px;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
}

.dashboard-span-card:hover .dashboard-span-action{
    display: inline-flex;
    position: absolute;
    top: -5px;
    right: 15px;
}

.dashboard-span-filter {
    position: absolute;
    top: 5px;
    right: 80px;
}

.document-softcopy-submition{
    border-top: 1px solid #e5e7eb;
    margin-top:1rem;
    padding-top:0.5rem;
}

.dashboard-chart-value {
    padding: 0.1rem;
    font-size: 0.600rem;
    line-height: 0.88rem;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    width:110px;
}

.dashboard-accrodian-dropdown .dropdown-content{
    width: 250px !important;
}

.dashboard-accrodian-dropdown .dropdown-content input{
    width: 230px !important;
}

.dashboard-span-card .dropdown svg{
    stroke: rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
}

.daterangepicker{
    top:150px !important;
}
/*END: Dashboard*/

.intro-y h2{
    font-size:0.900rem;
}

.mail-icons-meta span.icon-ml{
    margin-left:0.1rem;
}

.accoidion-clopse{
    margin-left:1.3rem;
}

.task-ongoing{
    color:#0d9488;
}

tr.task-pending {
    background-color: #FADBD8 !important;
}
.sta{
  width:25%!important;
}
/*theme-18*/
.theme-18 {
    --color-theme-1: 31 97 141;
    --color-theme-2: 93 173 226;
    --color-primary: 31 97 141;
    --color-secondary: 226 232 240;
    --color-success: 13 148 136;
    --color-info: 8 145 178;
    --color-warning: 202 138 4;
    --color-pending: 194 65 12;
    --color-danger: 185 28 28;
    --color-light: 241 245 249;
    --color-dark: 30 41 59;
  }
  .theme-18.dark {
    --color-primary: 31 97 141;
  }
/*theme-18*/

.lucide-x-square{
    stroke: red;
}

.text-red-500{
    color:red;
}

.width-auto{
    width:auto;
}

.max-w-\[280px\] {
    max-width: 280px;
}

.notification-alert-section{
    position: absolute;
    top:-5px;
    right:-5px;
}

.notification-alert {
    animation: fadeIn 1s;
    box-shadow: 0px 0px 4px 1px #00000029;
}

@keyframes fadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
  }

  .progress-bar2 {
    height: 10px;
    border-radius: 30px;
    background-image: 
      linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.05));
    transition: 0.4s linear;  
    transition-property: width, background-color;    
  }
  
  .progress-moved .progress-bar2 {
    width: 100%; 
    background-color: rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;  
    animation: progressAnimation 6s;
  }
  
  @keyframes progressAnimation {
    0%   { width: 5%; background-color: rgb(var(--color-primary));}
    100% { width: 100%; background-color: rgb(var(--color-primary) / var(--tw-bg-opacity)) !important; }
  }

  /*BEGIN: File Import*/
  .ajax-upload-dragdrop{
    border: 1px dotted #A5A5C7 !important;
    padding: 2px !important;
  }
  
  .ajax-file-upload{
    margin: 0px 10px 2px 0 !important;
    background: rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
    -webkit-box-shadow: 0 2px 0 0 rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
    box-shadow: 0 2px 0 0 rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
    padding: 6px 6px 4px 8px !important;
    font-family: "Public Sans" !important;
  }

  .ajax-file-upload-container{
    display:flex !important;
    flex-wrap: nowrap;
    margin: 0px !important;
  }

  .ajax-file-upload-statusbar {
    border: 0px solid rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
    padding:2px !important;
    width: 180px !important;
}

.ajax-file-upload-bar {
    background-color: rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
    height: 5px !important;
}

.jexcel > div > table > thead > tr > td {
    background-color: #fff !important;
    font-weight: bold !important;
    color: rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
}

.jexcel > div > table > tbody > tr > td:first-child {
    width: 10px !important;
}

.jexcel > div > table > tbody > tr > td:first-child {
    background-color: #fff !important;
}

.jexcel .highlight-top {
    border-top: 1px solid #0000001c !important;
}

.ajax-file-upload-red {
    font-size: 9px !important;
    -webkit-box-shadow: inset 0 39px 0 -24px rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
    box-shadow: inset 0 39px 0 -24px rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
    background-color: rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
    text-shadow: 0 1px 0 rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
    margin: 0px 10px 5px 0px !important;
    padding: 0px 10px !important;
}

.ajax-file-upload-statusbar-flex {
    display: flex;
    cursor: pointer;
    position: relative;
}

.bulk-expense-upload-meta {
    width:35px !important;
    border: 0px !important;
    position: relative;
}

.ajax-file-upload-statusbar-flex .custom-red {
    position: relative;
    top: -5px !important;
    right: 0px !important;
}

.ajax-file-upload-statusbar-flex .ajax-file-upload-filename{
    display:none !important;
}

.ajax-file-upload-filename{
    font-size: 0.650rem !important;
    width: 100% !important;
}
.ajax-file-upload-progress {
    width: 35px !important;
}
  /*END: File Import*/

.select-document-group-td{
    position: relative;
    padding-top:30px !important;
}  

.select-document-group .check-support-document + .select2-container{
    width: 60% !important;
    margin-right: 3px;
}

.select-document-group .check-document-type + .select2-container{
    width: 38% !important;
}

.select2-selection__clear{
    width:10px !important;
}

/*BEGIN: Rate Card*/
.rate-card-section{
    margin-bottom:10px;
}

.rate-card-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    border-bottom:1px dotted #00000029;
    padding-bottom:1rem;
    padding-top:1rem;
    padding-left: 0.4rem;
    padding-right: 0.4rem;
}

.rate-card-row:nth-child(odd){
    background-color: #fff;
}

.rate-card-row:nth-child(even){
    background-color: #f1f5f9
}

.rate-card-row-heading .rate-card-row-column p{
    color: rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
    font-weight: bold;
}

.rate-card-row-heading{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    border-bottom:1px dotted #00000029;
    padding-left: 0.4rem;
    padding-right: 0.4rem;
    padding-bottom:0.5rem;
    padding-top:0.5rem;
}

.rate-card-row-heading .rate-card-row-column{
    text-align: center;
}

.rate-card-row-column {
    width: 12%;
    text-align: left;
}

.rate-card-row-column.rate-card-row-column-amount{
    width: 10%;
}

.rate-card-row-column.rate-card-checkbox{
    width: 6.5%;
    text-align: center;
}

.rate-card-task-section .rate-card-row-column {
    width: 14%;
}

.rate-card-task-section .rate-card-row-column.rate-card-row-column-amount{
    width: 10%;
}

.rate-card-row-column.rate-card-row-add{
    width: 1%;
}

.rate-card-row-column label.inline-block{
    display: none;
}

.addexpensRow{
    margin-top: 0.3rem;
}

.addMoreRow{
    margin-top: 0.3rem;
}

.rate-card-row-column [type=checkbox] {
    width: 0.8rem;
    height: 0.8rem;
    border-radius: 3px;
    --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
/*END: Rate Card*/

.dependent-row-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 25px;
}

.depedent-row {
    padding-top:0.3rem;
    padding-left:0.3rem;
}

.depedent-row:nth-child(even) {
    background: #f1f5f9;
}

.depedent-row:nth-child(odd) {
    background: #fff;
}

.order-status-top {
    margin-right: 5rem;
}

.order-status-top svg {
    width: 12px;
    stroke: rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
}

#documentTableTab colgroup col[data-dt-column='0']{
    width:30px !important;
}

#documentTableTab colgroup col[data-dt-column='2']{
    width:20px !important;
}

#documentTableTab colgroup col[data-dt-column='3']{
    width:65px !important;
}

#documentTableTab th:nth-child(2){
    border-right: 1px solid #fff !important;
}

#documentTableTab td:nth-child(2){
    border-right: 1px solid #fff !important;
}

#documentTableTab colgroup col[data-dt-column='7']{
    width:80px !important;
}

#documentTableTab colgroup col[data-dt-column='8']{
    width:30px !important;
}

#expenseTableTab colgroup col[data-dt-column='0']{
    width:30px !important;
}

#expenseTableTab colgroup col[data-dt-column='9']{
    width:70px !important;
}

#expenseTableTab colgroup col[data-dt-column='11']{
    width:30px !important;
}

#expensesTable colgroup col[data-dt-column='0']{
    width:30px !important;
}

#expensesTable colgroup col[data-dt-column='10']{
    width:30px !important;
}

#expensesTable colgroup col[data-dt-column='5']{
    width:95px !important;
}

#expensesTable colgroup col[data-dt-column='6']{
    width:60px !important;
}

#expensesTable colgroup col[data-dt-column='7']{
    width:95px !important;
}

#expensesTable colgroup col[data-dt-column='8']{
    width:30px !important;
}

#expensesTable colgroup col[data-dt-column='9']{
    width:30px !important;
}

#expensesTable colgroup col[data-dt-column='3']{
    width:110px !important;
}

#expensesTable colgroup col[data-dt-column='4']{
    width:110px !important;
}

#taskTableTab tbody tr{
    border: 1px solid #E5E7EB !important;
}

#taskTableTab colgroup col[data-dt-column='1']{
    width:30px !important;
}

#taskTableTab colgroup col[data-dt-column='2']{
    width:165px !important;
}

colgroup col[data-dt-column='0']{
    width:30px !important;
}

colgroup col:last-child{
    width:30px !important;
}

table tr:nth-child(1) .row-move-up{
    display: none;
}

table tr:last-child .row-move-down{
    display: none;
}

#updateCheckListTable tr>td{
    padding:5px;
    position: relative;
}

.add-corporate-spoc-col{
    padding-right:30px;
    position: relative;
}

.add-corporate-spoc-col #add-corporate-spoc {
    position:absolute;
    margin-left:5px;
    margin-top:2px;
}


table.dashboard-table thead tr th {
    font-size: 0.600rem;
    padding: 0.100rem !important;
}

table.dashboard-table tbody tr td {
    font-size: 0.600rem;
    line-height: 0.700rem;
}

table.dashboard-table thead tr th:nth-child(1), table.dashboard-table thead tr th:nth-child(2){
    max-width: 90px;
    width: 90px;
}

table.dashboard-table thead tr th:nth-child(4) {
    max-width: 110px;
    width: 110px;
}

select.dashboard-email-fileter{
    width: 70px !important;
    margin-left: 0.3rem;
}

.dashboard-span-card .acordion-panel a.button {
    padding: 0px;
    height: 1.3rem;
}

.mea-btn {
    width: 135px;
  }

table#updateCheckListTable tbody>tr:nth-child(even){
    background: #f1f5f9;
}

table#updateCheckListTable tbody>tr:nth-child(odd){
    background: #fff;
}

#updateCheckListTable tbody>tr td:nth-child(1){
    max-width: 100px !important;
    width:100px !important;
}  

#updateCheckListTable tbody>tr td:nth-child(2){
    max-width: 100px !important;
    width:100px !important;
} 

#updateCheckListTable tbody>tr td:nth-child(3){
    max-width: 40px !important;
    width:40px !important;
} 

#updateCheckListTable tbody>tr td:nth-child(4){
    max-width: 200px !important;
    width:200px !important;
}  

#updateCheckListTable thead>tr th:nth-child(1){
    max-width: 100px !important;
    width:100px !important;
}  

#updateCheckListTable thead>tr td:nth-child(1){
    max-width: 100px !important;
    width:100px !important;
} 

#updateCheckListTable thead>tr th:nth-child(2){
    max-width: 100px !important;
    width:100px !important;
}  

#updateCheckListTable thead>tr td:nth-child(2){
    max-width: 100px !important;
    width:100px !important;
} 

#updateCheckListTable thead>tr th:nth-child(3){
    max-width: 40px !important;
    width:40px !important;
}

#updateCheckListTable thead>tr td:nth-child(3){
    max-width: 40px !important;
    width:40px !important;
} 

#updateCheckListTable thead>tr th:nth-child(4){
    max-width: 200px !important;
    width:200px !important;
}  

#updateCheckListTable thead>tr td:nth-child(4){
    max-width: 200px !important;
    width:200px !important;
} 

table#updateCheckListTable thead>tr:nth-child(even){
    background: #f1f5f9;
}

table#updateCheckListTable thead>tr:nth-child(odd){
    background: #fff;
}

.add-corporate-spoc-col{
    padding-right:30px;
    position: relative;
}

.add-corporate-spoc-col #addSpock {
    position:absolute;
    /* margin-left:5px;
    margin-top:2px; */
    right: 0px;
    top: 25px;
}

.select2-result-repository__meta {
    margin-top: 5px;
    margin-bottom: 5px;
}

.select2-result-repository__title {
    font-weight: bold;
}

.add-corporate-spoc-col #addCorporateSpoc {
    position:absolute;
    margin-left:5px;
    margin-top:2px;
}

.add-corporate-spoc-col #addCorporateShippingSpoc {
    position:absolute;
    margin-left:5px;
    margin-top:2px;
}

.add-checklist-doc-row{
    position: absolute;
    text-align: center;
    top: 10px;
    right: 15px;
}

.rownumber-row button{
    margin-bottom:5px;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

.document-file-section .ajax-upload-dragdrop{
    width: 40px !important;
}

.document-file-section .ajax-upload-dragdrop span b{
    display:none;
}

.document-file-section{
    display:flex;
    align-items: center;
    /* width: 85px; */
}

.document-file-section .ajax-file-upload-error {
    position: absolute;
    font-size: 0.6rem;
    line-height: 0.8rem;
    z-index: 11;
    background: #fff;
    padding: 2px;
    box-shadow: 0px 0px 4px 1px #e5e1e1;
    width: 150px;
}

.document-file-section .ajax-file-upload-statusbar-flex img{
    width:18px !important;
}

#propsalTableBody tr>th:nth-child(1), #propsalTableBody tr>td:nth-child(1){
    width:245px !important;
}

#propsalTableBody tr>th:nth-child(2), #propsalTableBody tr>td:nth-child(2){
    width:130px !important;
}

#propsalTableBody tr>th:nth-child(3), #propsalTableBody tr>td:nth-child(3){
    width:200px !important;
}

#propsalTableBody tr>th:nth-child(4), #propsalTableBody tr>td:nth-child(4){
    width:100px !important;
}

#propsalTableBody tr>th:nth-child(5), #propsalTableBody tr>td:nth-child(5){
    width:180px !important;
}

#propsalTableBody tr>th:nth-child(6), #propsalTableBody tr>td:nth-child(6){
    width:130px !important;
}

div:where(.swal2-container){
    z-index: 999999 !important;
}

table thead tr th:where(:not(.note-editable *)) {
    color: rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
    width: 100px;
}

#ratecardTable tr th, #ratecardTable tr td{
    width: 100px;
}

#ratecardTable tr th:nth-child(1), #ratecardTable tr td:nth-child(1){
    width: 20px;
}

#ratecardTable tr th:last-child, #ratecardTable tr td:last-child{
    width: 20px;
}

#ratecardTableList tr th:nth-child(1), #ratecardTableList tr td:nth-child(1){
    width: 20px;
}

#ratecardTableList tr th:last-child, #ratecardTableList tr td:last-child{
    width: 20px;
}


div:where(.swal2-container) button:where(.swal2-styled) {
    padding: .3em !important;
}

.swal2-confirm{
    display: inline-block;
    background: #7066e0;
    color: #fff;
    padding: 5px 10px;
    width: 100px;
    border-radius: 5px;
    font-size: 0.7rem;
    font-weight: 600 !important;
    margin-right:0.5rem;
}

.swal2-deny{
    display: inline-block;
    background: #7066e0;
    color: #fff;
    padding: 5px 10px;
    width: 100px;
    border-radius: 5px;
    font-size: 0.7rem;
    font-weight: 600 !important;
}

.swal2-cancel{
    display: inline-block;
    background: red;
    color: #fff;
    padding: 5px 10px;
    width: 100px;
    border-radius: 5px;
    font-size: 0.7rem;
    font-weight: 600 !important;
}

.es_date{
    color:#03045e;
}

.ec_date{
    color:black;
}

.select2-container--default.select2-container--disabled .select2-selection--single{
    background-color: rgb(241 245 249 / var(--tw-bg-opacity));
}

.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__rendered{
    color:#4444445c;
}

.select2-container--disabled .select2-selection__arrow{
    display: none;
}

.access-item-list{
    padding: 0.3rem;
    --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    --tw-border-opacity: 1;
    border: 1px solid rgb(226 232 240 / var(--tw-border-opacity));
    border-radius: 5px;
    display: flex;
    flex-wrap: wrap;
    background-color: #fff;
    min-height: 50px;
}

.access-item-list label{
    width: 100%;
}
.access-item-list label [type=checkbox]{
    width:0.8rem;
    height:0.8rem;
    margin-right:5px;
}

.group-access-btn{
    display: flex;
    justify-content: center;
}

.group-access-btn span{
    width: 22px;
    height:22px;
}

.access-row {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    justify-content: space-between;
    border: 1px dotted #00000029;
}

.module-column {
    width: 25%;
    margin-right: 0.5rem;
}

.all-access-column {
    width: 48%;
    margin-right:1%;
}

.all-access-card{
    max-width: 70%;
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    border-left: 1px dotted #00000029;
    border-right: 1px dotted #00000029;
    padding-left: 0.5rem;
}

.access-action-column{
    margin-right: 1%;
    padding-top:1.2rem;
}

.delete-access-column{
    padding-top: 1.2rem;
    margin-left: 0rem;
    width: 5%;
}

.access-row:nth-child(odd){
    background-color: #fff;
    padding:0.5rem;
}

.access-row:nth-child(even){
    background-color: #f1f5f9;
    padding:0.5rem;
}

.selectModule.error ~ label.error{
    display: block;
}

.selectModule ~ label.error {
    display: none;
}

#corporateBranchTableBody_wrapper .row:nth-child(3){
    width: 87% !important;
    margin-bottom: 0px;
}

.btn-right-pagination {
    width: 10%;
    position: absolute;
    right: 0px;
    bottom:0px;
}

#corporateContactTableBody_wrapper .row:nth-child(3){
    width: 88% !important;
    margin-bottom: 0px;
}

#billingContactTableBody_wrapper .row:nth-child(3){
    width: 90% !important;
    margin-bottom: 10px;
}

#corporateContract_wrapper .row:nth-child(3){
    width: 90% !important;
    margin-bottom: 10px;
}

.btn-right-pagination a {
    font-weight: 400;
    padding: 0.1rem;
}

.mailview-left{
    position: relative;
}

.mailview-left .maillist-back {
    position: absolute;
    top: 5px;
}

.mailview-left .mail-subject{
    margin-left:30px;
}

#maillListData tbody tr:hover{
    cursor: pointer;
}

.modal .shadow-md {
    top:10%;
}

.emptable-th5{
    width: 40px !important;
    max-width: 40px !important;
    min-width: 40px !important;
}

.emptable-th{
    width: 163px !important;
    max-width: 163px !important;
    min-width: 163px !important;
}

.emptable-th2, .emptable-th3, .emptable-th4{
    width:60px !important;
}

.header-breadcrumb li:last-child a{
    color:#f9f9f9 !important;
}

.header-breadcrumb li a{
    color:#c8c5c5!important;
}

.header-breadcrumb li:hover a{
    color:#f9f9f9 !important;
}

input[type="date"]::-webkit-calendar-picker-indicator {
    background: transparent;
    bottom: 0;
    color: transparent;
    cursor: pointer;
    height: auto;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: auto;
}

/* For Firefox */
input[type="date"]::-moz-calendar-picker-indicator {
    background: transparent;
    bottom: 0;
    color: transparent;
    cursor: pointer;
    height: auto;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: auto;
}

input[type="date"] {
    position: relative;
    width: 100%;
}

input[type="date"]::before{
    background-image: url(/assets/images/calender-icon.png);
    content: "";
    width: 12px;
    height: 12px;
    position: absolute;
    right: 20px;
    background-position: center;
    background-size: cover;
    top: 9px;
}

.order-export-list .dropdown-content{
    width: 165px;
}

#orderList colgroup col[data-dt-column='3']{
    width: 120px !important;
    max-width: 120px !important;
}

#orderList .dt-column-order{
    display:none;
}

.mail-box-message{
    position: relative;
}

.mail-box-message .note-editor.note-frame{
    position: relative;
}

.modal-fullscreen>.w-\[90\%\].shadow-md{
    width: 100% !important;
    top:0% !important;
    margin-top: 0rem !important;
}

.fullscreen .note-editable{
    height:65vh !important;
}

.note-editable{
    height: auto !important;
    max-height: 250px;
}

/* The rule above forces every summernote editor to shrink-wrap its content, which overrides the
   compose popup's own minHeight and collapses an empty message box to a single line. Give the
   mail popup a real floor to type into and a little more room before it starts scrolling; the
   other editors (country, checklist) keep the compact default. Scoped away from .fullscreen so
   the maximise button still expands to 65vh -- that rule carries the same specificity and would
   otherwise lose to this one, which comes later in the file. */
.mail-box-message .note-editor:not(.fullscreen) .note-editable{
    min-height: 240px;
    max-height: 380px;
}

#orderList tbody tr:hover{
    cursor: pointer;
}

table#orderList > tbody > tr:hover {
    background-color: #fff;
}

.ql-toolbar.ql-snow{
    width: 400px;
    border-width: 0px !important;
}

.ql-container.ql-snow{
    border-width: 0px !important;
    height: 250px;
}

.quill-message {
    border: 1px solid #0000000f;
}

#phone01-error{
    margin-top:0px;
}

.filed-50per{
    width: 50%;
}

.whatsapp-useritem {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    border-bottom: 1px solid #00000012;
}

.whatsapp-usericon {
    align-items: center;
    width: 40px;
    height: 36px;
    border: 1px solid #abaaaa42;
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    border-radius: 50%;
    margin-right: 0.5rem;
}

.whatsappview-usericon{
    align-items: center;
    width: 30px;
    height: 30px;
    border: 1px solid #abaaaa42;
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    border-radius: 50%;
    margin-right: 0.5rem; 
}

.whatsapp-usermeta {
    width: 100%;
    display: block;
}

.whatsapp-username {
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
}

.whatsapp-username span.wapp-username {
    width: 200px;
    margin-right: 0.5rem;
}

.whatsapp-username span.wapp-lastchat{
    width:100px;
    text-align: right;
    font-size:0.675rem;
}

.whatsapp-message{
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
}

.whatsapp-message span.wapp-message {
    width: 250px;
    margin-right: 0.5rem;
    font-size:0.675rem;
}

.whatsapp-message span.wapp-unread{
    background: rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
    width: 30px;
    text-align: right;
    width: 20px;
    height: 20px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 0.675rem;
}

.whatsapp-useritem:hover{
    background-color: #f1f5f9;
    cursor: pointer;
}

.whatsapp-useritem.active{
    background-color: #f1f5f9;
}

input#searchInput{
    font-size: 0.750rem;
}

.whatsapp-send-message {
    color: rgb(100 116 139 / var(--tw-text-opacity));
    background-color: rgb(241 245 249 / var(--tw-bg-opacity));
    border: 1px solid #e2e8f099;
    padding: 0.3rem;
    border-radius: 5px;
    width: 80%;
}

.wappsend-message-item {
    width: 70%;
    float: left;
    justify-content: flex-start;
    display: flex;
    flex-wrap: wrap;
}

.whatsapp-send-time {
    width: 100%;
}

.whatsapp-send-meta {
    display: flex;
    align-items: center;
}

.whatsapp-send-time span{
    font-size:0.675rem;
    color: #94a3b8;
}

.wappreceive-message-item{
    width: 70%;
    float: right;
    justify-content: flex-end;
    display: flex;
    flex-wrap: wrap;
}

.whatsapp-receive-meta {
    display: flex;
    align-items: center;
}

.whatsapp-receive-message {
    color: #333;
    background-color: rgb(var(--color-primary) / 0.2) !important;
    border: 1px solid rgb(var(--color-primary) / 0.2) !important;
    padding: 0.3rem;
    border-radius: 5px;
    width: 80%;
}

.whatsapp-receive-time {
    width: 100%;
    text-align: right;
}

.whatsapp-receive-time span{
    font-size:0.675rem;
    color: #94a3b8;
}

.wapp-message-date{
    width: 100%;
    text-align: center;
    margin-bottom: 10px;
    margin-top: 10px;
}

.wapp-message-date span{
    color: #94a3b8;
}

.whatsapp-messageloop {
    width: 100%;
    display: block;
    float: left;
}

.whatsapp-message-set{
    width: 100%;
    display: block;
    float: left;
    border-bottom: 1px solid #94a3b826;
    padding-bottom: 10px;
}

.whatsapp-form-wrapper {
    width: 100%;
    display: flex;
    align-items: center;
}

.whatsapp-form{
    width: 100%;
    display: black;
}

.whatsapp-file-upload{
    display: flex;
    align-items: center;
    border-top:1px solid #94a3b826;
    padding-top:0.5rem;
    margin-top: 0.1rem;
}

.h-\[682px\] {
    height: 682px;
}

.footer-chat {
    position: fixed;
    right: 10px;
    width: 480px;
    min-width: 360px;
    z-index: 111;
    bottom: 10px;
    display:none;
}

.footer-chat-icon{
    width: 40px;
    float: right;
    background-color: rgb(var(--color-theme-1)) !important;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #fff;
}

.footer-chat-iconspan {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.footer-chat-iconspan span{
    cursor: pointer !important;
}

.footer-chat-view-height{
    height: 320px;
    max-height: 320px;
    overflow-y: scroll;
}

.footer-chat-wrapper{
    box-shadow: 0px 10px 20px #040404cc !important;
    display: none;
}

.footer-chat-wrapper.show{
    display: block;
}

.footer-chat .whatsapp-file-upload{
    display: block;
}

.footer-chat .whatsapp-file-upload .ajax-file-upload{
    background-color: rgb(var(--color-theme-1)) !important;
}

.footer-chat .wappsend-message-item {
    width: 100%;
}

.footer-chat .wappreceive-message-item {
    width: 100%;
}

.footer-chat-listsearch{
    display: none;
    height: 473px;
    max-height: 473px;
    overflow-y: scroll;
}

.footer-chat-listsearch.show{
    display: block;
}

.footer-chat-view{
    display: none;
}

.footer-chat-view.show{
    display: block;
}

.col-span-8 {
    grid-column: span 8 / span 8;
}

.footer-chat .whatsapp-send-message{
    background-color: rgb(241 245 249 / 0.8);
}

.footer-chat .whatsapp-receive-message {
    color: #333;
    background-color: rgb(var(--color-primary) / 0.2) !important;
}

.footer-chat-view .h-\[768px\]{
    height: 100%;
}

.footer-chat-view .whatsapp-Chat-alignbottom{
    height: 320px;
    max-height: 320px;
    overflow-y: scroll;
}

.whatsapp-Chat-alignbottom{
    overflow-y: scroll;
}

.whatsapp-file-list{
    display:flex;
}

.whatsapp-file-item{
    margin-right: 0.8rem;
    display: flex;
    margin-bottom: 0.5rem;
    position: relative;
}

.whatsapp-file-icon img{
    width: 20px;
    height: 100%;
    object-fit: cover;
    object-position: top;
}

.whatsapp-file-item span.whatsapp-file-delete-icon {
    font-size: 1rem;
    position: absolute;
    top: -8px;
    right: -5px;
    cursor: pointer;
}

.whatsapp-file-dev{
    cursor: pointer;
}

.whatsapp-attach-items{
    min-height: 35px;
    width: 100%;
    display: block;
}

.whatsapp-chat-section{
    width: 100%;
    display: block;
    background: #fff;
}

.whatsapp-send-replyfor{
    color: rgb(100 116 139 / var(--tw-text-opacity));
    background-color: rgb(241 245 249 / 0.8);
    border: 1px solid #e2e8f099;
    padding: 0.3rem;
    border-radius: 5px;
    width:100%;
}

.whatsapp-receive-replayfor{
    padding: 0.3rem;
    border-radius: 5px;
    width:100%;
    color: #333;
    background-color: rgb(var(--color-primary) / 0.2) !important;
    border: 1px solid rgb(var(--color-primary) / 0.2) !important;
}

.whatsapp-file-download-icon{
    margin-left:0.3rem;
}

.whatsapp-message-set .whatsapp-file-item {
    margin-right: 0.5rem;
}

.whatsapp-file-download-all{
    display: flex;
    align-items: center;
    margin-left: 0.5rem;
}

.chat-bottom-sticky{
    position: sticky;
    width: 100%;
    bottom:0px;
    background: #fff;
}

.whatsapp-chat-page .whatsapp-user-list{
    height: 800px;
    overflow-y: scroll;
    max-height: 1100px;
}

.whatsapp-chat-page{
    min-height: 80%;
    height:100%;
}

.whatsapp-chat-page .h-\[768px\]{
    height:900px;
    max-height: 1200px;
}

.whatapp-chat-replyfor {
    background-color: #333;
    border-radius: 5px;
    padding: 0.2rem;
    margin: 0.2rem 0.8rem;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.wapp-user-pin svg{
    width: 16px;
    height: 16px;
}

.wapp-user-list-meta {
    display: flex;
    align-items: center;
}

.wapp-user-list-meta .wapp-unread{
    margin-right:1rem;
}

.visa-addons-btn{
    margin-left:1rem;
    font-size:0.500rem;
    height: 1.2rem !important;
}

.traveller-tabs ul li{
    position: relative;
    display: flex;
}

.traveller-tabs ul li span.taveller-edit-icon {
    top: 6px;
    position: absolute;
    right: 10px;
}

.traveller-tabs ul li span.taveller-edit-icon svg {
    fill: #fff;
}

.traveller-target + .taveller-edit-icon{
    display: none;
}

.traveller-target.active + .taveller-edit-icon{
    display: block;
}

.select2-container--default .select2-selection--multiple{
    --tw-border-opacity: 1;
    border-color: rgb(226 232 240 / var(--tw-border-opacity)) !important;
    font-size: 0.75rem !important;
    line-height: 1rem !important;
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}

.enquiry-traveller-meta:nth-child(odd) {
    background-color: #f1f5f96e;
}

.enquiry-traveller-meta{
    padding-left:0.5rem;
    padding-right:0.5rem;
}

.user-login-details {
    display: flex;
    justify-content: end;
    align-items: center;
    cursor: pointer;
}

.user-login-meta {
    display: flex;
    justify-content: end;
    align-items: center;
    flex-wrap: wrap;
    width: 160px;
}

.user-login-meta .user-login-span {
    line-height: 15px;
    width: 100%;
    color: #fff;
    text-align: right;
    margin-right: 10px;
    font-size: 11px;
}

div#updateContactModal {
    z-index: 1111;
}

.approve-expences {
    stroke: green;
}

.reject-expense {
    stroke: orange;
}

.approve-expences {
    display: block;
}

.reject-expense {
    display: block;
}

.expense-remormark-icon {
    width: 12px !important;
    height: 12px;
    background: orange;
    display: flex !important;
    align-items: center !important;
    justify-content: center;
    color: #fff;
    border-radius: 50%;
    cursor: pointer;
    margin-left: 5px;
    font-size: 9px;
    font-weight: 700;
}

.expense-status {
    display: flex;
    align-items: center;
}

.data-table-tooltip {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

.data-table-tooltip .data-table-tooltiptext {
    visibility: hidden;
    width: auto;
    background-color: orange;
    color: #fff;
    text-align: center;
    border-radius: 4px;
    padding: 3px 6px;
    position: absolute;
    z-index: 10;
    bottom: 125%; /* Show above */
    left: 50%;
    transform: translateX(-50%);
    opacity: 0;
    transition: opacity 0.3s;
    min-width: 220px;
    font-weight: 400;
    font-size: 0.675rem;
    line-height: 0.900rem;
  }

  .data-table-tooltip .data-table-tooltiptext::before {
    content: "";
    position: absolute;
    top: 100%; 
    left: 50%;
    margin-left: -6px;
    border-width: 6px;
    border-style: solid;
    border-color: orange transparent transparent transparent;
  }

  .data-table-tooltip:hover .data-table-tooltiptext {
    visibility: visible;
    opacity: 1;
  }
  
  #rejectRemarksModal .w-\[90\%\] {
    max-width: 600px;
  }

  #rejectRemarksModal .w-\[90\%\]::before {
    content: "";
    position: absolute;
    top: 100%; 
    right: 20px;
    margin-left: -10px;
    border-width: 10px;
    border-style: solid;
    border-color: #fff transparent transparent transparent;
  }

  #cancelRemarksModal .w-\[90\%\] {
    max-width: 600px;
  }

  #cancelRemarksModal .w-\[90\%\]::before {
    content: "";
    position: absolute;
    top: 100%; 
    right: 20px;
    margin-left: -10px;
    border-width: 10px;
    border-style: solid;
    border-color: #fff transparent transparent transparent;
  }

  .mail-ttk-icon {
    width: 14px;
    margin-left: 5px;
  }

  .mail-client-icon {
    width: 14px;
    margin-left: 5px;
  }

  .unread-svg-red svg path{
    stroke:#f4511e;
  }

  table.dataTable > tbody > tr.mail-row-unread  {
    background: #ff00001f;
}

.mail-read-status svg path {
    stroke: rgb(var(--color-theme-1)) !important;
}

.mail-read-status {
    margin-right: 1.2rem
}

.note-editor.note-airframe .note-editing-area .note-editable[contenteditable=false], .note-editor.note-frame .note-editing-area .note-editable[contenteditable=false] {
    background: none;
}

#mailUnreadList svg path {
    stroke:#f4511e !important;
}

table.dataTable tr td span{
    text-transform: capitalize !important;
}

table.dataTable tr th span {
    display: flex;
    align-items: center;
    width: fit-content;
}

#listMenuTable colgroup col:nth-child(7) {
    width: 80px !important;
}

#listMenuTable colgroup col:nth-child(8) {
    width: 80px !important;
}

#updateAccessListTableBody tr:hover {
    cursor:all-scroll;
}

#updateAccessListTableBody td:nth-child(1) {
    width:40px !important;
}

.list-menu-modal-content {
    max-width: 600px;
}

.access-menu-icon svg{
    stroke: #475569 !important;
    width: 1rem !important;
    margin-right: 3px;
}

.access-name-required.error + .error-message{
    color: red;
    display: block;
    font-weight: 600;
}

.access-name-required + .error-message{
    display: none;
}

.menu-required.error + .select2-container + .error-message{
    color: red;
    display: block;
    font-weight: 600;
}

.menu-required + .select2-container + .error-message{
    display: none;
}

.append-custom-access {
        border-top: 1px dotted #00000029;
        padding-top: 0.5rem;
}

.append-custom-access .access-row-loop .access-row{
    width: 49%;
    margin-right: 1%;
    margin-bottom: 1rem;
}

.append-custom-access .access-row-loop {
    display: flex;
    justify-content: start;
    flex-wrap: wrap;
}

.group-access-btn ul{
    margin-left: 1rem;
    margin-right: 1rem;
}

table tr td span.selection {
    display: block !important;
}

div.dt-container .dt-paging .dt-paging-button.current, div.dt-container .dt-paging .dt-paging-button.current:hover {
    color: #fff !important; 
}

.progress-container {
    display: flex;
    align-items: center;
}

.progress-container progress {
    height: 4px;
}

/* background: */
progress::-webkit-progress-bar {background-color: #e0e0e0; width: 100%;}
progress {background-color: #e0e0e0;}

/* value: */
progress::-webkit-progress-value {background-color: rgb(var(--color-theme-1) / 0.8) !important;}
progress::-moz-progress-bar {background-color: rgb(var(--color-theme-1) / 0.8) !important;}
progress {color: rgb(var(--color-theme-1) / 0.8);}

.has-child-table tbody tr {
    border: 1px solid #E5E7EB !important;
}

table.child-data-table {
    background-color: #f1f5f9a1 !important;
}

table.child-data-table thead tr th {
    width: 5px !important;
}

.rating-star-list {
    display: flex;
}

.visa-rating-star.active {
    fill: yellow;
}

.mail-thread > .accordion.active + .acordion-panel {
    display: block !important;
}

.mail-thread > .accordion + .acordion-panel {
    display: none !important;
}

.assign-table-heading > tr > th:nth-child(1) {
    width: 3% !important;
}

.assign-table-heading > tr > th:nth-child(2) {
    width: 15% !important;
}

.assign-table-heading > tr > th:nth-child(3) {
    width: 10% !important;
}

.assign-table-heading > tr > th:nth-child(5) {
    width: 10% !important;
}

.assign-table-heading > tr > th:nth-child(6) {
    width: 5% !important;
}

.exp-table-heading > tr > th:nth-child(1) {
    width: 3% !important;
}

.exp-table-heading > tr > th:nth-child(2) {
    width: 20% !important;
}

.exp-table-heading > tr > th:nth-child(3) {
    width: 10% !important;
}

.exp-table-heading > tr > th:nth-child(4) {
    width: 8% !important;
}

.exp-table-heading > tr > th:nth-child(5) {
    width: 10% !important;
}

.exp-table-heading > tr > th:nth-child(6) {
    width: 13% !important;
}

.exp-table-heading > tr > th:nth-child(7) {
    width: 12% !important;
}

.exp-table-heading > tr > th:nth-child(8) {
    width: 5% !important;
}

.exp-table-heading > tr > th:nth-child(9) {
    width: 10% !important;
}

.exp-table-heading > tr > th:nth-child(10) {
    width: 5% !important;
}

.comman-popup-width {
    max-width: 90%;
    width: 40%;
}

.enpense-evidence .ajax-upload-dragdrop {
    width: 37px !important;
}

.enpense-evidence .ajax-upload-dragdrop span{
    display: none;
}

.ratecard-text-area {
    background-color: #f1f5f9a6;
}

.star-color-group {
    display: flex;
    gap: 5px;
    cursor: pointer;
  }

  .star-color.star {
    font-size: 24px;
    color: #bcbdbd;
    transition: color 0.2s;
    cursor: pointer;
  }

  .star-color.star.active {
    color: gold;
  }

  .select2-selection--multiple:before {
    content: "";
    position: absolute;
    right: 7px;
    top: 42%;
    border-top: 5px solid #888;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
}

td.ratecard-other-fileds {
    background: #f1f5f98a;
}

#addExpenseForm .expenses-group {
    overflow-y: scroll;
    max-height: 350px;
}

.select2-container--open {
    z-index: 11111 !important;
}
 
.select2-container--default .select2-selection--multiple .select2-selection__clear {
    margin-right: 20px !important;
}

table#orderList td.dt-control {
    width: 70px !important;
}

.checklist-document .ajax-upload-dragdrop {
    display: flex;
    align-items: center;
}

#visaChecklistUpdateTableBody tr:nth-child(even) {
    background-color: #f1f5f9;
}

#visaChecklistUpdateTableBody tr:nth-child(odd) {
    background-color: #FFFFFF;
}

.note-editable {
    background: #fff;
}

.ajax-upload-dragdrop {
    background: #fff;
}

.checklist-document-upload-flex {
    display: flex;
    align-items: center;
}

.checklist-document-upload-flex .ajax-upload-dragdrop {
    width: 37px !important;
}

.checklist-document-upload-flex .ajax-upload-dragdrop span {
    display: none;
}

.checklist-document-upload-flex .ajax-file-upload {
    margin-right: 0px !important;
}

.checklist-document-upload-flex .bulk-expense-upload-meta {
    width: 30px !important;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

.checklist-document-upload-flex .attached-image-list li{
    display: flex;
}

.checklist-document-upload-flex ul.attached-image-list li img {
    width: 17px;
    margin: 0.3rem;
}

.checklist-document-upload-flex .delete-image {
    left: -3px;
    position: relative;
    cursor: pointer;
}

.daterangepicker {
    z-index: 1000001 !important;
}

.mailstone-item {
    text-align: center;
}

.mailstone-item p {
    font-size: 12px !important;
}

.mailstone-item.mailstone-item-complited .mailstone-complite-icon{
    display: block;
}

.mailstone-item .mailstone-complite-icon{
    display: none;
}

.mailstone-item.mailstone-item-complited .mailstone-pending-icon{
    display: none;
}

.mailstone-item .mailstone-pending-icon{
    display: black;
}

.mailstone-item .box{
    background-color: #f4f7fa;
}

.mailstone-item.mailstone-item-complited .box{
    background-color: #fff;
}

.billing-address-edit-btn {
    position: absolute;
    right: 10px;
}

#orderList tr.dt-hasChild.shown .child-data-table {
    display: block;
}

#orderList tr.dt-hasChild .child-data-table {
    display: none;
}

.expense-attachment-list .delete-image{
    position: absolute;
    top: -6px;
    right: -3px;
    cursor: pointer;
}

.expense-attachment-list {
    margin-top: 5px;
}

ul.attached-image-list.expense-attachment-list li {
    margin-left: 5px;
}

.expense-innner-table tr td {
    vertical-align: top;
}

.fixedHeader-floating {
    background-color: #f1f5f9;
    margin-top: 0px;
}

table.fixedHeader-floating input {
    display: none !important;
}

table.fixedHeader-floating thead tr th {
    color: rgb(var(--color-primary) / var(--tw-bg-opacity)) !important;
}

#corporateTable tbody tr, #expensesTable tbody tr, #taskListTable tbody tr {
    cursor: pointer;
}

table.dashboard-table tfoot tr td {
    font-size: 0.600rem;
    line-height: 0.700rem;
    border: 1px solid #80808024;
    padding: 5px;
}

table.dashboard-table td.aging-tr {
    text-align: left;
    background: #f1f5f9;
    font-weight: 600;
}

#taskTbody .dt-control span input {
    display: none;
}

#expenseTableTab .dt-control span input {
    display: none;
}

#taskListTable .dt-hasChild span input {
    display: none;
}

.order-task-expense {
    display: none;
}

#expenseTableTab tbody span input {
    display: none;
}

.select2-container--default.select2-container--disabled .select2-selection--single {
    background-color: #f4f7fa94 !important;
}

.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__rendered {
    color: #475569;
}

.res-earliest-appoiment {
    background-color: #f1f5f9;
}

.appoiment-document-upload-flex .ajax-upload-dragdrop {
    width: 200px !important;
}

.appoiment-document-upload-flex {
    display: flex !important;
}

.appoiment-document-upload-flex .ajax-file-upload-container {
    margin-top: -10px !important;
}

.attached-image-list-dev {
    position: relative;
    left: 20px;
    top: 15px;
    text-align: right;
    justify-content: flex-start;
    margin-left: 10px;
}

ul.attached-image-list.attached-image-list-dev li img {
    width: 22px;
}

.child-data-table thead tr th {
    font-weight: 500;
}

.mail-row-read.dt-hasChild.shown + tr > td {
    padding-left: 20px !important;
    padding-right: 20px !important;
}

.form-filed-edit.form-status-edit {
        right: 0px;
}

.form-filed-edit.form-status-edit svg{
    fill: none !important;
}

.swal2-confirm.my-confirm-btn {
    width: fit-content;
    padding-left: 10px !important;
    padding-right: 10px !important;
}

.addon-oos-upload .ajax-upload-dragdrop{
    display: flex !important;
}

.addon-oos-upload {
    margin-top: 10px;
}

@media screen and (min-width: 1201px) and (max-width: 1399px) {
    table.dataTable > thead > tr > th, table.dataTable > thead > tr > td, table.dataTable > tbody > tr > td{
        font-size: 0.650rem;
        line-height: .800rem;
    }

    .order-sub-chip {
        font-size: 0.650rem !important;
    }

    .td-division-badge {
        font-size: 0.600rem !important;
        padding: 0px 6px !important;
    }

    .td-status-badge {
        font-size: 0.600rem !important;
        padding: 0px 6px !important;
    }
}

@media (min-width: 1280px) {
    .\[\&\.content--compact\]\:xl\:ml-\[64px\].content--compact {
        margin-left: 55px;
    }

    .group.side-menu--collapsed .group-\[\.side-menu--collapsed\]\:xl\:ml-300rem {
        margin-left: 0.300rem;
    }

    .group-\[\.side-menu--collapsed\]\:xl\:ml-\[65px\] {
        margin-left: 65px;
    }

    .group.side-menu--collapsed .group-\[\.side-menu--collapsed\]\:xl\:w-\[55px\] {
        width: 55px;
    }
}

@media (min-width: 1024px) {
    .lg\:col-span-8 {
        grid-column: span 8 / span 8;
    }

    .lg\:col-span-4 {
        grid-column: span 4 / span 4;
    }

    .lg\:col-span-2 {
        grid-column: span 2 / span 2;
    }

    .lg\:col-span-5 {
        grid-column: span 5 / span 5;
    }

    .lg\:col-span-3 {
        grid-column: span 3 / span 3;
    }

    .lg\:col-span-10 {
        grid-column: span 10 / span 10;
    }

    .lg\:col-span-11 {
        grid-column: span 11 / span 11;
    }

    .dashboard-span-2{
        grid-column: span 2 / span 2;
    }

    .dashboard-span-4{
        grid-column: span 4 / span 4;
    }
    
    .dashboard-span-6{
        grid-column: span 6 / span 6;
    }
    
    .dashboard-span-8{
        grid-column: span 8 / span 8;
    }

    .dashboard-span-10{
        grid-column: span 10 / span 10;
    }
    
    .dashboard-span-12{
        grid-column: span 12 / span 12;
    }
}

@media (min-width: 991px) {
    .sm\:w-\[991px\] {
        width: 900px;
    }
}

@media (max-width: 1024px) { 
 .append-custom-access .access-row-loop .access-row {
        width: 100%;
    }
}

@media (max-width: 991px) { 
    .accordion-mail-meta {
        position: relative;
        right: 0px;
        top:0px
    }

    .mailer-meta-to {
        margin-left: 0rem;
    }

    .mail-icons-meta .mail-date {
        margin-left: 0rem;
    }

    .rate-card-row-heading{
        display:none !important;
    }

    .rate-card-row-column label.inline-block {
        display: block;
    }

    .rate-card-row-column {
        width: 31% !important;
        margin-bottom:0.8rem;
        text-align: left;
    }

    .rate-card-checkbox{
        text-align: left !important;
    }

    .rate-card-row-column.rate-card-row-add {
        width: 100% !important;
        border-top: 1px dotted #00000029;
        padding-top: 0.5rem;
        text-align: center;
        margin-bottom: 0px;
    }
}

@media (max-width: 767px) {
    .mail-section .col-span-8 {
        grid-column: span 12 / span 12;
    }

    .mail-section .col-span-4 {
        grid-column: span 12 / span 12;
    }

    .mail-section .mail-icons-meta {
        justify-content: flex-start;
    }

    .dashboard-span-2{
        grid-column: span 12 / span 12;
    }

    .dashboard-span-4{
        grid-column: span 12 / span 12;
    }
    
    .dashboard-span-6{
        grid-column: span 12 / span 12;
    }
    
    .dashboard-span-8{
        grid-column: span 12 / span 12;
    }

    .dashboard-span-10{
        grid-column: span 12 / span 12;
    }
    
    .dashboard-span-12{
        grid-column: span 12 / span 12;
    }

    .rate-card-row-column {
        width: 48% !important;
    }

    .rate-card-row-column.rate-card-checkbox {
        width: 31% !important;
    }

    .footer .render-text-footer {
        position: relative;
        right: unset;
        top: unset;
        text-align: center;
        margin-bottom: 0.5rem;
    }

    .access-row {
        flex-wrap: wrap;
    }

    .module-column {
        width: 100%;
        margin-right: 5%;
    }

    .all-access-card {
        max-width: 95%;
    }

    .delete-access-column {
        margin-left: 0rem;
    }

}

@media (max-width: 480px) {
    .flex.border-bottom-solid {
        flex-wrap: wrap;
    }

    .view-data-label {
        width: 100%;
        min-width: unset;
    }

    .view-data-value {
        width: 100%;
        min-width: unset;
    }

    .view-data-divid {
        display: none;
    }

    .bg-login-form-left {
        padding: 1rem 1rem;
        order: 2;
    }

    .bg-login-form-right {
        order: 1;
    }

    .logo-cards {
        flex-wrap: wrap;
    }

    .logo-cards .box {
        width: 100%;
    }

    .rate-card-row-column {
        width: 100% !important;
    }

    #corporateBranchTableBody_wrapper .row:nth-child(3){
        width: 100% !important;
        margin-bottom: 5px;
    }
    
    .btn-right-pagination {
        width: 100%;
        position: relative;
        right: 0px;
        bottom:0px;
    }

    #corporateContactTableBody_wrapper .row:nth-child(3){
        width: 100% !important;
        margin-bottom: 5px;
    }
    
    #corporateContract_wrapper .row:nth-child(3){
        width: 100% !important;
        margin-bottom: 5px;
    }
}

/* Our thread / read-status buttons opt out of the global `button { width: 75px }` and
   `button svg { margin-right }` rules above (they size to their content). */
button.thread-toggle,
button.thread-link,
button.mail-read-toggle {
    width: auto !important;
    max-width: none;
    height: auto;
    box-sizing: border-box;
    font-weight: 600 !important;
}

button.thread-link {
    font-weight: normal !important;
}

button.thread-toggle svg,
button.thread-link svg,
button.mail-read-toggle svg {
    margin-right: 0;
}

button.thread-toggle .thread-toggle-label,
button.thread-link .thread-toggle-label {
    display: inline;
    white-space: nowrap;
}