form.login-page .input_area {
    margin-top: 2px !important;
}
form.login-page .passwordInput{
    margin-top: 10px !important;
}
form.login-page  .forgotPasswordLink {
    margin-top: 10px !important;
}

form.login-page button.signInButton {
    margin-top: 15px !important;
    font-size: 16px;
}
.topspacing {
    padding-top: 20px;
    padding-bottom: 25px;
}
h3.siteHeading{
    margin-top:0px !important;
}
form.login-page p.form_error,.dashboardMessage p.form_error {
    background: #ff000059;
    font-size: 14px;
    text-align: center;
    border-radius: 4px;
    padding: 4px 0px;
    margin: 10px 0px 0px !important; 
}
form.login-page p.form_success,.dashboardMessage p.form_success {
    background: #00800069;
    font-size: 14px;
    text-align: center;
    border-radius: 4px;
    padding: 4px 0px;
    margin: 10px 0px 0px !important; 
}
form.login-page input{
    outline:unset !important;
    box-shadow:unset !important;
}
form.login-page button.signInButton.forgot {
    margin-top: 25px !important;
}
.scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none;
}
.scrollbar-hide::-webkit-scrollbar {
    display: none;
}
nav.top-nav-menu div.menu-items{
    gap: 10px;
    justify-content: center;
    padding: 12px 0px;
}
nav.top-nav-menu div.menu-items a {
    display: flex;
    flex-direction: column;
    padding: 4px 10px;
    font-size: 14px;
    line-height: unset;
    border-radius: 6px;
    gap: 4px;
    height: unset;
    align-items: center;
}
nav.top-nav-menu div.menu-items a svg {
    margin: 0px;
}
div.addNewBatch div.p-6 {
    padding: 0px;
    justify-content: end;
}
div.addNewBatch {
    border: unset;
    background: transparent;
    box-shadow: unset;
}
main select,main input {
    outline: unset !important;
    box-shadow: unset !important;
}
div#pagination {
    margin-top: 25px;
    margin-bottom: 25px;
}
.destinationStores .store input[type="radio"] {
    position: absolute !important;
    top: 0px;
    left: 0px;
    width: 100% !important;
    height: 100% !important;
    transform: unset !important;
    pointer-events: unset !important;
}
.destinationStores .store {
    position: relative;
}
.max-w-4xl {
    max-width: 56rem;
}
.mt-6 {
    margin-top: 1.5rem;
}
form.validateForm label.error {
    display: none !important;
}
form.validateForm input.error,form.validateForm select.error {
    border-color: red !important;
}
form.validateForm2 label.error {
    display: none !important;
}
form.validateForm2 input.error,form.validateForm2 select.error {
    border-color: red !important;
}
div.tablistMain {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    --tw-gradient-to: #d4e6cf var(--tw-gradient-to-position);
    --tw-gradient-from: #c8e2c4 var(--tw-gradient-from-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
form.formProfile input,form.formProfile select {
    margin-top: 2px !important;
}
form.formReset input,form.formReset div.relative {
    margin-top: 2px !important;
}
.withSearchInputBox {
    display: flex;
    justify-content: space-between;
}
.withSearchInputBox label {
    display: flex;
}
.withSearchInputBox label input.search {
    border: 1px solid #eaeaea;
    color: rgb(157 23 77 / var(--tw-text-opacity, 1));
    font-size: 14px;
    font-weight: 400;
    background: #fff;
    padding: 2px 12px;
    min-width: 250px;
}
.withSearchInputBox label input.search::placeholder {
    color: rgb(157 23 77 / var(--tw-text-opacity, 1));
    opacity: 0.6;
}
div table.dataTable {
    border-collapse: collapse;
}
table.dataTable>thead>tr>th, table.dataTable>thead>tr>td {
    border-bottom: unset;
}
div table.dataTable>thead>tr>th {
    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}
div table.dataTable tbody td {
    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}
div.dataTables_wrapper.no-footer {
    font-size: 14px;
}
div.dataTables_wrapper.no-footer div#search_area_table_length {
    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    vertical-align: middle;
}
div.dataTables_wrapper.no-footer div#search_area_table_length select {
    font-size: 12px;
    padding: 0px 2px;
}
div.dataTables_wrapper.no-footer div#search_area_table_filter {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    vertical-align: middle;
}
div#search_area_table_info {
    padding-top: 1.2rem;
    padding-bottom: 1.2rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    vertical-align: middle;
    font-size: 14px;
}
div#search_area_table_paginate {
    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    vertical-align: middle;
}
div.dataTables_wrapper .dataTables_paginate .paginate_button.current, div.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    padding: 2px 5px;
    font-size: 14px;
    background: rgb(38 137 30);
    color: #fff !important;
    border: unset;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
    padding: 2px 5px;
    font-size: 14px;
}
div.productTypePageSubTypes {
    height: 100%;
    max-height: 370px;
    overflow-y: scroll;
    padding-right: 12px;
}
div.productTypePageSubTypes::-webkit-scrollbar {
  width: 5px;
}
div.productTypePageSubTypes::-webkit-scrollbar-track {
  background: transparent;
}
div.productTypePageSubTypes::-webkit-scrollbar-thumb {
  background: rgb(38 137 30);
}
div.siteAccountLogo {
    background: transparent !important;
    box-shadow: unset;
    padding: 0px;
}
div.siteAccountLogo img {
    width: 100% !important;
    height: unset;
    max-width: 180px;
}
div.poweredByMessage {
    position: absolute;
    bottom: 10px;
    left: 0px;
    right: 0px;
}
div.poweredByMessage p {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    gap: 15px;
    padding-left: 15px;
}
div.poweredByMessage p img {
    width: 100%;
    max-width: 100px;
}
div.dashboardLogo {
    background: transparent;
    box-shadow: unset;
    height: unset;
    width: 100%;
    max-width: 70px;
}
div.dashboardLogo img {
    height: unset;
    width: 100%;
}
div.dashboardLogoName h1 {
    font-size: 26px;
    line-height: 26px;
}
div.dashboardLogoName p {
    font-size: 14px;
}
div.dashboardUserName p.name {
    font-size: 16px;
    line-height: 16px;
    margin-bottom: 2px;
}
div.dashboardUserName p.role {
    font-size: 14px;
    line-height: 14px;
}
div.poweredByMessageDashboard p {
    display: flex;
    gap: 15px;
    align-items: center;
    font-size: 14px;
    justify-content: center;
}
div.poweredByMessageDashboard p img {
    width: 100%;
    max-width: 120px;
}
div.poweredByMessageDashboard {
    padding-bottom: 15px;
    padding-top: 10px;
}
div.itemsMade {
    background: #26891e;
}
div.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: unset;
    color: inherit !important;
    border: unset;
}
div.productionTotal {
    background: #2f8e28;
}
button.addNewUserButton {
    background: #26891e;
}
.grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
table#search_area_table {
    width: 100% !important;
}
.addProductionForm .productionFields{
    border: 1px solid #eaeaea;
    padding: 15px 12px 50px;
    border-radius: 4px;
    margin-bottom: 20px;
    position: relative;
}
div.addNewBatch div.p-6 {
    padding: 15px 12px;
}
.addProductionForm div.productionFields div.fields {
    position: absolute;
    bottom: 3px;
    right: 3px;
    display: inline-flex;
    gap: 5px;
}
.addProductionForm div.productionFields div.fields button {
    background: #1bc06e;
    color: #fff;
    width: 25px;
    height: 25px;
    font-size: 12px;
    border-radius: 6px;
}
.addProductionForm div.productionFields div.fields button.addMoreField {
    display: none;
}
.addProductionForm div.allProductionFields div.productionFields:last-child div.fields button.addMoreField {
    display: block;
}
.addProductionForm div.allProductionFields div.productionFields:first-child div.fields button.removeThisField {
    display: none;
}
.addProductionForm div.productionFields div.fields button.removeThisField {
    background: #ff00009c;
}
.addProductionForm .productionFields input {
    width: 100%;
    display: block;
}
.transferProduction input {
    display: block;
    outline: unset !important;
    box-shadow: unset !important;
}
div.customModel {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    bottom: 0px;
    height: 100%;
    z-index: 999;
    background: #000000a6;
    padding-top: 40px;
    padding-bottom: 40px;
}
div.customModel div.modalArea {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    position: relative;
}
div.customModel div.modalArea .text-card-foreground {
    background: #fff;
}
div.customModel div.modalArea .grid.grid-cols-1.md\:grid-cols-4.gap-4 {
    display: block;
}
div.customModel div.modalArea .grid.grid-cols-1.md\:grid-cols-4.gap-4 div {
    display: inline-block;
    vertical-align: top;
    width: 31%;
    margin-right: 1%;
    margin-bottom: 1%;
}
div.customModel div.modalArea button.closeCustomModal {
    position: absolute;
    top: -15px;
    right: -15px;
    background: red;
    z-index: 9;
    font-size: 16px;
    color: #fff;
    width: 35px;
    height: 35px;
    border-radius: 100px;
}
body.custom-modal-open {
    overflow: hidden;
}
body.custom-modal-open div.customModel {
    overflow-y: scroll;
}
span.quatantityError {
    display: block;
    font-size: 12px;
    line-height: 14px;
    color: red;
    margin-top: 4px;
    margin-bottom: 5px;
}
.modalArea select {
    outline: unset !important;
    box-shadow: unset !important;
}
.grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
div.saleRecordTable  table#current_inventory_table {
    width: 100% !important;
}

div.saleRecordTable   div#current_inventory_table_length {
    padding: 10px 20px;
}

div.saleRecordTable div#current_inventory_table_filter {
    padding: 10px 20px;
}

div.saleRecordTable div#current_inventory_table_info {
    padding: 10px 20px;
}

div.saleRecordTable div#current_inventory_table_paginate {
    padding: 10px 20px;
}
form.addNewSale input,form.addNewSale select {
    outline: unset !important;
    box-shadow: unset !important;
    width: 100%;
    display: block;
}
div.dataTables_wrapper .dt-buttons {
    padding-top: 12px;
    padding-bottom: 10px;
    padding-left: 1rem;
    padding-right: 1rem;
    vertical-align: middle;
    display: inline-flex;
    align-items: center;
}

div.dataTables_wrapper .dt-buttons button.dt-button {
    font-size: 12px;
    padding: 4px 10px;
    border: unset !important;
    border-radius: 4px;
    background-image: linear-gradient(to right, #3b82f6, #6366f1) !important;
    color: #fff !important;
    outline: unes !important;
    box-shadow: unset !important;
}
.addProductionForm .productionFields textarea {
    width: 100%;
    display: block;
    max-width: 100%;
    height: 150px;
    outline:unset !important;
    box-shadow:unset !important;
}
@media (max-width:600px){
    nav.top-nav-menu div.menu-items a span {
        display: none;
    }
    nav.top-nav-menu div.menu-items {
        gap: 0px;
    }
    nav.top-nav-menu div.menu-items a {
        padding: 6px 8px;
        margin: 0px !important;
    }
    div.tablistMain {grid-template-columns: unset;display: flex;flex-direction: column;align-items: center;height: unset;background: transparent;gap: 10px;}
    div.tablistMain button {
        background: #cee6cc6e;
    }
    h3.tracking-tight.text-pink-800.text-xl.font-bold.flex.items-center {
        font-size: 18px;
    }
    .flex.flex-col.md\:flex-row.gap-4 {
        width: 100%;
    }
    .flex.flex-col.md\:flex-row.gap-4 select {
        width: 100%;
    }
    canvas#pieChart {
        width: 100% !important;
    }
    div#roundchartFunc {
        width: 100% !important;
    }
    .text-card-foreground.bg-white\/90.backdrop-blur-sm.border-2.border-pink-200.shadow-xl.rounded-2xl.overflow-hidden .p-6 {
        padding: 1.5rem 0.5rem;
    }
    div.text-card-foreground.bg-white\/90.backdrop-blur-sm.border-2.border-pink-200.shadow-xl.rounded-2xl.overflow-hidden h3.tracking-tight.text-pink-800.text-xl.font-bold.flex.items-center {
        font-size: 14px;
    }
    div#barChartFunc {
        width: 100% !important;
    }
    canvas#barChart {
        width: 100% !important;
    }
    div.dataTables_wrapper.no-footer div#search_area_table_filter label {
        display: flex;
        align-items: center;
    }
    div table.dataTable>thead>tr>th {
        padding: 1rem 0.5rem;
        font-size: 14px;
    }
    div table.dataTable tbody td {
        padding: 1rem 0.5rem;
        font-size: 12px;
    }
    table#search_area_table {
        white-space: nowrap;
        width: 100% !important;
    }
    .text-card-foreground.bg-white\/90.backdrop-blur-sm.border-2.border-pink-200.shadow-xl.rounded-2xl.overflow-hidden .h-80 {
        height: auto;
    }
    .flex.flex-col.md\:flex-row.justify-between.items-start.md\:items-center.gap-4 h3.tracking-tight.text-pink-800.text-xl.font-bold.flex.items-center {
        font-size: 16px;
    }
    h3.text-2xl.font-semibold.leading-none.tracking-tight.text-pink-800.flex.items-center {
        font-size: 16px;
    }
    div.destinationStores div.store .font-medium.text-gray-900 {
        font-size: 14px;
    }
    h3.text-2xl.font-semibold.leading-none.tracking-tight.text-pink-800 {
        font-size: 16px;
    }
    .h-10.items-center.justify-center.rounded-md.p-1.text-muted-foreground.grid.w-full.grid-cols-3.bg-white\/60.backdrop-blur-sm.border.border-pink-200 {
        display: block;
        height: unset;
    }
    .h-10.items-center.justify-center.rounded-md.p-1.text-muted-foreground.grid.w-full.grid-cols-3.bg-white\/60.backdrop-blur-sm.border.border-pink-200 button {
        display: block;
        width: 100%;
    }
    .flex.flex-col.space-y-1\.5.p-6.bg-gradient-to-r.from-pink-50.to-rose-50.rounded-t-2xl div.flex.justify-between.items-start {
        display: block;
    }
    .flex.flex-col.space-y-1\.5.p-6.bg-gradient-to-r.from-pink-50.to-rose-50.rounded-t-2xl div.flex.justify-between.items-start .flex.gap-1 {
        margin-top: 10px;
    }
    .flex.flex-col.space-y-1\.5.p-6.bg-gradient-to-r.from-pink-50.to-rose-50.rounded-t-2xl div.flex.justify-between.items-start h3.tracking-tight.text-pink-800.text-lg.font-bold.flex.items-center {
        font-size: 14px;
    }
    .text-card-foreground.bg-white\/90.backdrop-blur-sm.border-2.border-pink-200.shadow-xl.rounded-2xl.hover\:shadow-2xl.transition-all.duration-300.transform.hover\:scale-105 p.text-sm.text-gray-700 {}
    .text-card-foreground.bg-white\/90.backdrop-blur-sm.border-2.border-pink-200.shadow-xl.rounded-2xl.hover\:shadow-2xl.transition-all.duration-300.transform.hover\:scale-105 .flex.items-center.space-x-2 {
        white-space: normal;
        word-break: break-all;
    }
    button.addNewStoreButton.inline-flex.items-center.justify-center.gap-2.whitespace-nowrap.rounded-md.text-sm.font-medium.ring-offset-background.transition-colors.focus-visible\:outline-none.focus-visible\:ring-2.focus-visible\:ring-ring.focus-visible\:ring-offset-2.disabled\:pointer-events-none.disabled\:opacity-50.\[\&_svg\]\:pointer-events-none.\[\&_svg\]\:size-4.\[\&_svg\]\:shrink-0.bg-primary.hover\:bg-primary\/90.h-10.px-4.py-2.bg-gradient-to-r.from-pink-500.to-rose-500.hover\:from-pink-600.hover\:to-rose-600.text-white.shadow-lg {
        margin-top: 15px;
        font-size: 14px;
        padding: 0px 15px;
    }
    .flex.justify-between.items-center.p-3.bg-gradient-to-r.from-pink-50.to-rose-50.rounded-lg.border.border-pink-200 {
        display: block;
    }
    .flex.justify-between.items-center.p-3.bg-gradient-to-r.from-pink-50.to-rose-50.rounded-lg.border.border-pink-200 button.deleteSubType.inline-flex.items-center.justify-center.gap-2.whitespace-nowrap.text-sm.font-medium.ring-offset-background.transition-colors.focus-visible\:outline-none.focus-visible\:ring-2.focus-visible\:ring-ring.focus-visible\:ring-offset-2.disabled\:pointer-events-none.disabled\:opacity-50.\[\&_svg\]\:pointer-events-none.\[\&_svg\]\:size-4.\[\&_svg\]\:shrink-0.border.bg-background.hover\:text-accent-foreground.h-9.rounded-md.px-3.border-red-200.text-red-600.hover\:bg-red-50 {
        margin-top: 15px;
    }
    .flex.justify-between.items-center.p-3.bg-gradient-to-r.from-pink-50.to-rose-50.rounded-lg.border.border-pink-200 span.font-medium.text-gray-800 {
        font-size: 14px;
    }
    .text-card-foreground.bg-white\/90.backdrop-blur-sm.border-2.border-pink-200.shadow-xl.rounded-2xl h4.font-semibold.text-gray-700.mb-3 {
        font-size: 14px;
    }
    .flex.flex-col.space-y-1\.5.p-6.bg-gradient-to-r.from-pink-50.to-rose-50.rounded-t-2xl .flex.flex-col.md\:flex-row.justify-between.items-start.md\:items-center.gap-4 h3.tracking-tight.text-pink-800.text-xl.font-bold.flex.items-center {
        font-size: 14px;
    }
    .flex.flex-col.space-y-1\.5.p-6.bg-gradient-to-r.from-pink-50.to-rose-50.rounded-t-2xl .flex.flex-col.md\:flex-row.justify-between.items-start.md\:items-center.gap-4 .flex.gap-2 {
        display: block;
        padding-top: 20px;
    }
    .flex.flex-col.space-y-1\.5.p-6.bg-gradient-to-r.from-pink-50.to-rose-50.rounded-t-2xl .flex.flex-col.md\:flex-row.justify-between.items-start.md\:items-center.gap-4 .flex.gap-2 button {
        margin-bottom: 10px;
        font-size: 14px;
    }
    .recharts-wrapper {
        width: 100% !important;
    }
    button.addNewBatchButton.inline-flex.items-center.justify-center.gap-2.whitespace-nowrap.rounded-md.text-sm.font-medium.ring-offset-background.transition-colors.focus-visible\:outline-none.focus-visible\:ring-2.focus-visible\:ring-ring.focus-visible\:ring-offset-2.disabled\:pointer-events-none.disabled\:opacity-50.\[\&_svg\]\:pointer-events-none.\[\&_svg\]\:size-4.\[\&_svg\]\:shrink-0.bg-primary.hover\:bg-primary\/90.h-10.px-4.py-2.bg-gradient-to-r.from-pink-500.to-rose-500.hover\:from-pink-600.hover\:to-rose-600.text-white.shadow-lg {
        margin-top: 15px;
    }
    div.productTypePageSubTypes {
        padding-right: 0px;
        max-height: unset;
        overflow-y: visible;
    }
    div.poweredByMessage {
        position: static;
        width: 100%;
    }
    div.poweredByMessage p {
        flex-direction: column;
        align-items: center;
        gap: 5px;
    }
    div.accountScreens {
        flex-direction: column;
        gap: 50px;
    }
    div.dashboardLogoName h1 {
        font-size: 20px;
        line-height: 20px;
    }
    div.dashboardLogoName p {
        font-size: 12px;
    }
    div.poweredByMessageDashboard p {
        flex-direction: column;
        gap: 10px;
    }
    div table.dataTable tbody td ul.dtr-details {
        display: block;
        width: 100%;
    }
    div table.dataTable tbody td ul.dtr-details li {
        width: 100%;
    }
    div table.dataTable tbody td ul.dtr-details {
        display: block;
        width: 100%;
    }
    div table.dataTable tbody td ul.dtr-details li {
        width: 100%;
    }
    table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control:before, table.dataTable.dtr-inline.collapsed>tbody>tr>th.dtr-control:before {
        content: "â–¼" !important;
        transform: rotate(-90deg) !important;
    }
    table.dataTable.dtr-inline.collapsed>tbody>tr.parent>td.dtr-control:before, table.dataTable.dtr-inline.collapsed>tbody>tr.parent>th.dtr-control:before {
        transform: rotate(0deg) !important;
    }
    div.dataTables_wrapper.no-footer div#search_area_table_filter {
        padding: 0px;
        padding-bottom: 10px;
    }
    div.dataTables_wrapper.no-footer div#search_area_table_length {
        padding: 0px 0px 10px;
        text-align: left;
    }
    .dataTables_wrapper .dataTables_filter input {
        padding: 0px 2px !important;
        width: 100%;
        max-width: 180px;
    }
    .mobilePadding div#search_area_table_length {
        padding: 10px 10px 10px !important;
    }
    .mobilePadding div#search_area_table_filter {
        margin: 0px;
        padding: 0px 10px 10px !important;
    }
    div.transferPadding {
        padding: 0px;
    }
    div.transferPadding div#search_area_table_length {
        padding: 0px 20px 10px !important;
    }
    div.transferPadding div#search_area_table_filter {
        padding: 0px 20px 10px !important;
    }
    button.addNewUserButton.addNewStoreButton {
        margin-top: 12px;
    }
    .h-10.items-center.justify-center.rounded-md.p-1.text-muted-foreground.grid.w-full.grid-cols-4.bg-white\/60.backdrop-blur-sm.border.border-pink-200 {
        display: block;
        height: unset;
    }
    .h-10.items-center.justify-center.rounded-md.p-1.text-muted-foreground.grid.w-full.grid-cols-4.bg-white\/60.backdrop-blur-sm.border.border-pink-200 button {
        display: block;
        width: 100%;
    }
    div.customModel div.modalArea {
        width: 90%;
    }
    div.customModel div.modalArea button.closeCustomModal {
        top: -10px;
        right: -10px;
    }
    div.customModel div.modalArea .grid.grid-cols-1.md\:grid-cols-4.gap-4 div {
        width: 100%;
        margin-bottom: 5%;
    }
    div.customModel div.modalArea .grid.grid-cols-1.md\:grid-cols-4.gap-4 {
        margin-top: 0px;
    }
    .addProductionForm .productionFields {
        padding-bottom: 40px;
    }

    div.productionHistory {
        padding: 12px 15px;
    }

    div.productionHistory h3 {
        font-size: 14px;
    }
    button.addNewUserButton {
        margin-top: 15px;
    }
    div.addEmployeeForm button{font-size: 12px;padding: 0px 12px;}
    table#current_inventory_table {
        white-space: nowrap;
        width: 100% !important;
    }
    .saleTableScroll div#current_inventory_table_wrapper {
        overflow-x: scroll;
    }
    nav.top-nav-menu div.menu-items {
        display: block;
        text-align: center;
    }
    nav.top-nav-menu div.menu-items a {
        display: inline-block;
        margin-right: 5px !important;
    }
    .addProductionForm .productionFields textarea {
        font-size: 14px;
        height: 120px;
    }
}
@media (min-width:601px) and (max-width:990px){
    nav.top-nav-menu div.menu-items a {
        padding: 5px 12px;
        font-size: 12px;
        margin: 0px !important;
        display: inline-flex;
    }
    nav.top-nav-menu div.menu-items {
        display: block;
        text-align: center;
    }
    h3.tracking-tight.text-pink-800.text-xl.font-bold.flex.items-center {
        font-size: 16px;
    }
    select#dateFilter {
        margin-top: 0px;
        font-size: 14px;
    }
    select#storeFilter {
        margin-top: 0px;
        font-size: 14px;
    }
    p.text-3xl.md\:text-4xl.font-bold.text-gray-800.mt-2 {
        font-size: 24px;
    }
    div table.dataTable>thead>tr>th {
        font-size: 12px;
        padding: 8px 12px;
    }
    div table.dataTable tbody td {
        font-size: 12px;
        padding: 8px 12px;
    }
    div#search_area_table_info {
        font-size: 12px;
        padding: 15px 0px 0px;
    }
    select#typeFilter {
        margin-top: 0px;
        font-size: 14px;
    }
    h3.tracking-tight.text-pink-800.text-lg.font-bold {
        font-size: 16px;
    }
    form.validateForm label {
        font-size: 12px;
    }
    form.validateForm select,form.validateForm input {
        margin: 0px !important;
        font-size: 12px;
    }
    form.validateForm .productionFields {
        gap: 8px;
        padding-bottom: 50px;
    }
    button[type="button"],button[type="submit"] {
        font-size: 12px;
    }
    div.customModel div.modalArea {
    max-width: 92%;
}

div.customModel div.modalArea .flex.flex-col.space-y-1\.5.p-6 {
    padding-bottom: 0px;
}

div.customModel div.modalArea h3 {
    font-size: 18px;
}

div.customModel div.modalArea label {
    font-size: 12px;
}

div.customModel div.modalArea input {
    font-size: 12px;
}

div.customModel div.modalArea label.block.text-sm.font-medium.text-gray-700.mb-3 {
    margin-bottom: 5px;
}
form.space-y-4.validateForm.addNewSale {
    padding-top: 15px;
}
button.addNewUserButton.addNewTypeButton {
    font-size: 12px;
    gap: 0px;
}

button.addNewUserButton.addNewSubTypeButton {
    font-size: 12px;
    gap: 0px;
}
table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control:before, table.dataTable.dtr-inline.collapsed>tbody>tr>th.dtr-control:before {
    content: "â–¼" !important;
    transform: rotate(270deg);
}

table.dataTable.dtr-inline.collapsed>tbody>tr.parent>td.dtr-control:before, table.dataTable.dtr-inline.collapsed>tbody>tr.parent>th.dtr-control:before {
    transform: rotate(0deg);
}
}