/*CSS For modification*/
input.search-table {
    padding: 12px;
    border: 1px solid #BFC4C8;
    border-radius: 4px;
    font-size: 12px;
    height: 100%;
    width: 271.5px !important;
}

.search-table-holder {
    position: relative;
}

    .search-table-holder .material-symbols-outlined {
        position: absolute;
        top: 50%;
        right: 12px;
        transform: translateY(-50%);
        cursor: pointer;
        color: black !important;
        height: 24px !important;
        width: 24px !important;
        font-size: 24px !important;
    }

.search-table {
    padding-inline-end: 35px !important; /* Adjust based on icon size */
}

.form-outline .form-control:focus:not(.is-invalid) ~ .form-notch:not(.disabled) .form-notch-leading {
    border-top: .125rem solid #212529;
    border-bottom: .125rem solid #212529;
    border-left: .125rem solid #212529;
    box-shadow: -1px 0px 0px 0px #000000, 0px 1px 0px 0px #000000, 0px -1px 0px 0px #000000;
}
.form-outline .form-control:focus:not(.is-invalid) ~ .form-notch.disabled .form-notch-leading.disabled {
    border-top: .0625rem solid #212529;
    border-bottom: .0625rem solid #212529;
    border-left: .0625rem solid #212529;
    box-shadow: -1px 0px 0px 0px #000000, 0px 1px 0px 0px #000000, 0px -1px 0px 0px #000000;
}
.form-outline .form-control ~ .form-notch div {
    border-color: #212529;
}
.form-outline .form-control:focus:not(.is-invalid) ~ .form-notch:not(.disabled) .form-notch-middle:not(.disabled) {
    border-bottom: .125rem solid;
    border-color: #212529;
    border-top: none;
    box-shadow: 0 1px 0 0 #000000;
}

.form-outline .form-control:focus:not(.is-invalid) ~ .form-notch.disabled .form-notch-middle.disabled {
    border-bottom: .0625rem solid;
    border-color: #212529;
    box-shadow: 0 1px 0 0 #000000;
}

.form-outline .form-control.active:not(.is-invalid) ~ .form-notch.disabled .form-notch-middle.disabled {
    border-right: none;
    border-left: none;
    border-top: .0625rem solid #212529;
}

.form-outline .form-control:focus:not(.is-invalid) ~ .form-notch:not(.disabled) .form-notch-trailing:not(.disabled) {
    border-color: currentcolor currentcolor currentcolor #E4A11B;
    border-bottom: .125rem solid #212529;
    border-right: .125rem solid #212529;
    border-top: .125rem solid #212529;
    box-shadow: 1px 0 0 0 #000000, 0 -1px 0 0 #000000, 0 1px 0 0 #000000;
}

.form-outline .form-control:focus:not(.is-invalid) ~ .form-notch.disabled .form-notch-trailing.disabled {
    border-color: currentcolor currentcolor currentcolor #E4A11B;
    border-bottom: .0625rem solid #212529;
    border-right: .0625rem solid #212529;
    border-top: .0625rem solid #212529;
    box-shadow: 1px 0 0 0 #000000, 0 -1px 0 0 #000000, 0 1px 0 0 #000000;
}

.form-outline .form-control:focus ~ .form-label {
    color: #49454F !important;
}

.form-outline .form-control.active ~ .form-notch:not(.disabled) .form-notch-middle:not(.disabled), .form-outline .form-control:focus ~ .form-notch:not(.disabled) .form-notch-middle:not(.disabled) {
    border-top: 1px transparent;
}

.form-check-input:checked {
    background-color: #000000;
    border-color: #000000 !important;
}

.form-check-input:focus {
    box-shadow: none !important;
}

    .form-check-input:focus:before {
        box-shadow: none !important;
    }

.form-check-input:checked:focus:before {
    box-shadow: none !important;
}

.form-check-input:checked[type=checkbox] {
    background-color: #000000 !important;
    border-color: #000000 !important;
}

.pos-ecr-radio:checked {
    border-color: #000000;
}

    .pos-ecr-radio:checked:after {
        border-color: #000000;
        background-color: #000000 !important;
    }

.pos-ecr-radio {
    border: .125rem solid #000000;
}

.text-style {
    color: var(--M3-sys-light-on-surface, #1D1B20);
    height: 56px;
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.header-input {
    color: var(--neutral-neutral-500-base, #212529);
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
.form-outline .form-control:not(.form-control-md) ~ .form-label {
    line-height: 34px !important;
    font-size: 16px !important;
    color: #49454F /*!important*/;
    transform-origin: 0 -16px;
    transition:none;
}
.form-outline .form-control.form-control-md ~ .form-label {
    line-height: var(--Font-LineHeight-xs, 20px);
    font-size: var(--Font-Size-xs, 12px);
    color: var(--content-content-primary, #212529);
    transform-origin: 0 -16px;
    transition: none;
    margin-left: 8px !important;
    margin-top: 8px !important;
}
.form-outline .form-control.is-invalid ~ .form-notch .form-notch-leading {
    border-width: 2px;
}
.form-outline .form-control.is-invalid ~ .form-notch .form-notch-middle {
    border-top: 2px solid #dc4c64;
    border-bottom: 2px solid #dc4c64;
}
.form-outline .form-control.is-invalid.active ~ .form-notch .form-notch-middle {
    border-top: 2px solid #dc4c64;
    border-bottom: 2px solid #dc4c64;
}
.form-outline .form-control.is-invalid:focus ~ .form-notch .form-notch-middle {
    border-top: 2px solid #dc4c64;
    border-bottom: 2px solid #dc4c64;
}
.form-outline .form-control.is-invalid:active ~ .form-notch .form-notch-middle {
    border-top: 2px solid #dc4c64;
    border-bottom: 2px solid #dc4c64;
}
.form-outline .form-control.is-invalid ~ .form-notch .form-notch-trailing {
    border-width: 2px;
}
.form-outline .form-label {
    line-height: 18px;
    font-size: 12px;
}
input ::placeholder {
    font-size: 16px; 
    line-height: 24px !important; 
}

/* For compatibility with Internet Explorer */
:-ms-input-placeholder {
    font-size: 16px;
    line-height: 1.5;
    color: #888;
}

/* For compatibility with older versions of Chrome, Safari, etc. */
::-webkit-input-placeholder {
    font-size: 16px; 
    line-height: 24px !important; 
}
.form-control {
    --mdb-primary-text-emphasis: #212529;
    color: var(--mdb-primary-text-emphasis);
}
.form-outline .leading {
    position: absolute;
    right: initial; 
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    /*color: var(--mdb-surface-color);*/
}

input[type="date"]::-webkit-calendar-picker-indicator {
    background-image: none;
    cursor: pointer;
}

/*enhancement form removing grayed output read-only fields*/
.form-outline .form-control[readonly] {
    background: transparent;
}

.form-check-input:disabled {
    opacity: 1;
}
input[type=file].form-control.is-invalid {
    border-color: #dc4c64;
}
.form-check-input[type=checkbox]:indeterminate {
    background-color: #FFF;
    border-color: #000000;
    --mdb-form-check-bg-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><mask id="mask0_18045_24982" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="24" height="24"><rect width="24" height="24" fill="%23D9D9D9"/></mask><g mask="url(%23mask0_18045_24982)"><path d="M5 13V11H19V13H5Z" fill="%23212529"/></g></svg>')
}
.input-partial-disabled div {
    border-color: #A6B4BA !important;
    pointer-events: none;
}

.input-partial-disabled div.form-outline i.leading, .input-partial-disabled div.form-outline input.input-partial, .input-partial-disabled div.form-outline label.form-label {
    color: #A6B4BA !important;
}

.select-disabled, .select-disabled div {
    border-color: #A6B4BA !important;
    pointer-events: none;
}

.select-disabled i {
    color: #A6B4BA !important;
}

.select-disabled label.form-label {
    color: #A6B4BA !important;
}

.select-disabled.form-outline select.field-dropdown {
    color: #A6B4BA !important;
    border-color: #A6B4BA !important;
}
.input-stock-quantity.is-invalid{
    margin-bottom:0;
}

.custom-file-input-outline {
    border: 1px solid #ced4da;
    border-radius: 0.375rem;
    overflow: hidden;
}

.custom-file-input-outline .form-control {
    border: none !important;
    box-shadow: none !important;
    height: auto;
    background-color: #ffffff;
}

.custom-file-input-outline .form-control-lg::-webkit-file-upload-button {
    background-color: #ffffff !important;
    border-right: 1px solid #ced4da;
    padding: 0.5rem 1rem;
    cursor: pointer;
}

.custom-file-input-outline .form-control-lg::-webkit-file-upload-button:hover,
.custom-file-input-outline .form-control-lg::-webkit-file-upload-button:active,
.custom-file-input-outline .form-control-lg::-webkit-file-upload-button:focus {
    background-color: #ffffff !important;
}