
@media screen and (min-width: 1700px) {
    .main.sidenav-toggled .top-nav {
        left: 123px;
        width: calc(100% - 123px);
    }
    .main.sidenav-toggled .aside {
        width: 123px;
        padding: 0 0 30px 30px;
    }
    .main.sidenav-toggled .aside .aside-accordion{
        padding-right: 30px;
        padding-top: 40px;
    }
    .main.sidenav-toggled .aside .aside-accordion .non-accordion-item a .icon{
        width: 30px;
    }
    .main.sidenav-toggled .aside .aside-accordion .accordion-item .accordion-button .icon{
        width: 30px;
    }
}

@media only screen and (max-width: 1699.98px) and (min-width: 1500px) {

    /* Buttons Css Start */
    .crm-btn{
        min-width: 130px;
    }
    .crm-btn-sm{
        padding: 7px 16px;
        height: 38px;
    }
    .crm-btn-md{
        padding: 9px 16px;
        height: 42px;
    }
    .crm-btn-lg{
        padding: 13px 16px;
        height: 52px;
    }
    .icon-btn .icon{
        width: 20px;
        height: 20px;
    }
    .icon-btn-sm{
        padding: 7px 20px 7px 16px;
    }
    .icon-btn-md{
        padding: 9px 20px 9px 16px;
    }
    .icon-btn-lg{
        padding: 12px 14px 12px 14px;
    }
    .crm-btn-outline{
        min-width: 130px;
    }
    /* Buttons Css End */

    /* Input label & Fields Start */
    .field-sm{
        padding: 6px 12px;
        height: 38px;
    }
    .field-md{
        padding: 8px 12px;
        height: 42px;
    }
    .field-lg{
        padding: 10px 12px;
        height: 46px;
    }
    .field-xl{
        padding: 13px 12px;
        height: 52px;
    }
    select.crm-field {
        background-size: 14px 14px;
    }
    .icon-pass-shown,
    .icon-pass-hidden{
        width: 18px;
    }
    
    .main {
        padding-left: 340px;
    }

    /* Left Sidebar Start*/
    .aside {
        width: 340px;
        padding: 0 0 20px 25px;
    }
    .aside::after{
        top: 88px;
    }
    .aside .sidebar-toggler{
        top: 33px;
        right: -11px;
        height: 24px;
        width: 24px;
    }
    .aside .logo-container{
        padding: 19px 25px 19px 0;
    }
    .aside .logo-container .logo .icon{
        width: 50px;
        height: 50px;
    }
    .aside .logo-container .logo .text{
        font-size: var(--fs-36);
    }
    .aside .aside-accordion{
        row-gap: 10px;
        height: calc(100% - 88px);
        padding-top: 30px;
        padding-right: 25px;
    }
    .aside .aside-accordion .non-accordion-item a{
        font-size: var(--fs-16);
        padding: 14px 16px;
        border-radius: 10px;
    }
    .aside .aside-accordion .non-accordion-item a .icon{
        width: 20px;
    }
    .aside .aside-accordion .accordion-item {
        border-radius: 10px;
    }
    .aside .aside-accordion .accordion-item .accordion-button{
        font-size: var(--fs-16);
        padding: 14px 10px;
    }
    .aside .aside-accordion .accordion-item .accordion-button::after{
        width: 1.125rem;
        height: 1.125rem;
    }
    .aside .aside-accordion .accordion-item .accordion-button .icon{
        width: 20px;
    }
    .aside .aside-accordion .accordion-item ul{
        padding: 15px 30px 10px;
    }
    .aside .aside-accordion .accordion-item ul li a{
        font-size: var(--fs-16);
        padding: 12px 16px;
        border-radius: 10px;
    }
    /* Left Sidebar End */

    /* Left Sidebar Toggled */
    .main.sidenav-toggled .top-nav {
        left: 110px;
        width: calc(100% - 110px);
    }
    .main.sidenav-toggled{
        padding-left: 110px;
    }
    .main.sidenav-toggled .aside {
        width: 110px;
    }
    .main.sidenav-toggled .aside .aside-accordion .non-accordion-item a .icon{
        width: 27px;
    }
    .main.sidenav-toggled .aside .aside-accordion .accordion-item .accordion-button .icon{
        width: 27px;
    }
    /* Left Sidebar Toggled */

    /* Topbar Start*/
    .top-nav {
        left: 340px;
        width: calc(100% - 340px);
        padding: 20px 30px;
    }
    .top-nav .btn-back{
        column-gap: 6px;
        font-size: var(--fs-18);
    }
    .top-nav .btn-back .icon {
        width: 26px;
        height: 26px;
    }
    .top-nav .role-dropdown .dropdown-toggle{
        font-size: var(--fs-16);
        padding: 12px 20px;
        border-radius: 10px;
    }
    .top-nav .role-dropdown .dropdown-toggle .icon{
        width: 18px;
    }
    .top-nav .role-dropdown .dropdown-menu,
    .top-nav .profile-dropdown .dropdown-menu{
        padding: 10px 0 10px;
        border-radius: 10px;
    }
    .top-nav .role-dropdown .dropdown-menu li a,
    .top-nav .profile-dropdown .dropdown-menu li a{
        padding: 12px 16px;
    }
    .top-nav .profile-dropdown .dropdown-toggle{
        width: 45px;
        height: 45px;
    }
    .top-nav .profile-dropdown .dropdown-menu li a .icon{
        width: 22px;
    }
    /* Topbar End*/

    /* Main Content Start */
    .main .content {
        padding: 89px 30px 25px;
    }

    /* General Breadcrumbs Start*/
    .breadcrumbs{
        padding: 18px 0;
    }
    .breadcrumbs .breadcrumbs-list li a{
        font-size: var(--fs-16);
    }
    .breadcrumbs .btn-back{
        column-gap: 5px;
        font-size: var(--fs-16);
    }
    .breadcrumbs .btn-back .icon{
        width: 18px;
        height: 18px;
    }
    /* General Breadcrumbs End*/

    .mb-60{
        margin-bottom: 50px !important;
    }

    /* Login Page Start*/
    .auth-page .content .box .heading{
        font-size: var(--fs-40);
        line-height: 1.2;
    }
    .auth-page .content .box .desc{
        font-size: var(--fs-16);
        margin-bottom: 45px;
    }
    /* Login Page End*/

    /* CRM Full Card Start */
    .crm-full-card{
        min-height: calc(100vh - 166px);
    }
    .crm-full-card .crm-full-card-header{
        padding: 24px 24px;
    }
    /* CRM Full Card End */

    /* Actions Dropdown Start */
    .actions-dd .dropdown-toggle {
        padding: 8px 14px;
    }
    .actions-dd .dropdown-menu {
        padding: 8px 0 8px;
    }
    .actions-dd .dropdown-menu li a {
        padding: 8px 14px;
    }
    /* Actions Dropdown End */

    /* Searchbar for Table Header Start */
    .search-filter{
        max-width: 330px;
    }
    .search-filter .form-control{
        padding: 13px 14px;
    }
    .search-filter .filter-dropdown{
        padding: 13px 40px 13px 15px;
        background-size: 14px 14px;
        font-size: var(--fs-14);
    }
    /* Searchbar for Table Header End */

    /* CRM Table Start */
    .crm-table thead tr th{
        font-size: var(--fs-16);
        padding: 22px 12px;
    }
    .crm-table thead th.sorting {
        padding: 22px 18px 22px 12px;
    }
    .crm-table thead th.sorting:after {
        background-size: 16px 16px;
        width: 18px;
        height: 18px;
    }
    .crm-table thead tr th:first-child,
    .crm-table tbody tr td:first-child{
        padding-left: 30px;
    }
    .crm-table thead tr th:last-child,
    .crm-table tbody tr td:last-child{
        padding-right: 30px;
    }
    .crm-table tbody tr td{
        font-size: var(--fs-16);
        padding: 22px 12px;
    }
    .crm-table tr .checkbox-column .form-check-input {
        width: 18px;
        height: 18px;
        border: 2px solid #606060;
    }
    .crm-table tr .checkbox-column .form-check-input:checked{
        background-size: 18px 18px;
    }
    .crm-table tbody tr td .actions-column .actions .item{
        font-size: var(--fs-16);
    }
    .crm-table tbody tr td .actions-column .actions .item .icon{
        width: 16px;
    }
    .dataTables_wrapper .bottom{
        padding: 20px 25px;
    }
    /* CRM Table End */

    .form-check .form-check-input {
        width: 1.25em;
        height: 1.25em;
    }
    .form-check .form-check-input[type=checkbox]:checked {
        background-size: 20px 20px;
    }

    .status-icon {
        width: 28px;
        height: 28px;
    }

    .permission-checkbox input[type="checkbox"] {
        -webkit-appearance: none;
        appearance: none;
        background-color: transparent;
        margin: 0;
        font: inherit;
        color: var(--gray-100);
        width: 1.5em;
        height: 1.5em;
        border: 0.15em solid currentColor;
        border-radius: 0.15em;
        transform: translateY(-0.075em);
        display: inline-grid;
        place-content: center;
        border-radius: 3px;
    }
    .permission-checkbox input[type="checkbox"]:checked{
        background-color: #0087be;
        border-color: #0087be;
    }
    .permission-checkbox input[type="checkbox"]::before {
        content: "";
        width: 0.65em;
        height: 0.65em;
        clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
        transform: scale(0);
        transform-origin: bottom left;
        transition: 120ms transform ease-in-out;
        box-shadow: inset 1em 1em var(--white);
        background-color: CanvasText;
    }
    .permission-checkbox input[type="checkbox"]:checked::before {
        transform: scale(1);
    }

    .campaign-logo{
        width: 70px;
        height: 70px;
    }
    .accent-color{
        width: 35px;
        height: 35px;
    }
    .custom-badge{
        min-width: 110px;
        font-size: var(--fs-16);
        padding: 8px 10px;
    }

    .product-img{
        width: 60px;
    }

    .email-keywords{
        gap: 12px;
    }
    .email-keywords .keyword{
        font-size: var(--fs-14);
        padding: 10px 12px;
    }

    /* Expandable Filter Start */
    .expandable-filter .expandable-content{
        background-color: var(--light-blue-100);
        border-top: 1px solid var(--crm-full-card-border);
    }
    .expandable-filter .expandable-content .padding-box{
        padding: 25px;
    }
    /* Expandable Filter End */

    /* CRM Update Card Start */
    .crm-update-card{
        min-height: calc(100vh - 166px);
    }
    .crm-update-card .crm-update-card-header{
        padding: 28px 20px;
    }
    .crm-update-card .crm-update-card-header .heading{
        font-size: var(--fs-22);
    }
    .crm-update-card .crm-update-card-body{
        padding: 40px 30px 30px;
    }
    .crm-update-card .crm-update-card-body .sub-heading{
        font-size: var(--fs-22);
    }
    .crm-update-card .crm-update-card-footer{
        padding: 25px 30px;
    }
    /* CRM Update Card End */

    /* CRM Tabs Card Start */
    .crm-tabs-card{
        min-height: calc(100vh - 172px);
    }
    .crm-tabs-card .tabs-header{
        column-gap: 40px;
        padding: 25px 20px 0;
    }
    .crm-tabs-card .tabs-header .nav-item .nav-link{
        padding: 0 15px 15px;
    }
    .crm-tabs-card .tabs-header .nav-item .nav-link.active{
        background-color: transparent;
    }
    .crm-tabs-card .tabs-header .nav-item .nav-link::after{
        height: 6px;
    }
    /* CRM Tabs Card End */

    /* Table Card Inside Tab Start */
    .table-inside-tab-card .table-inside-tab-card-header{
        padding: 22px 20px;
    }
    /* Table Card Inside Tab End */

    /* Common Create Popup Start */
    .create-popup{
        width: 450px;
        max-height: calc(100vh - 107px);
        top: 89px;
        right: -450px;
    }
    .create-popup.opened{
        transform: translateX(-450px);
    }
    .create-popup .popup-header{
        padding: 17px 20px;
    }
    .create-popup .popup-header .heading{
        font-size: var(--fs-20);
    }
    .create-popup .popup-header .btn-close{
        width: 1rem;
        height: 1rem;
    }
    .create-popup .popup-body{
        max-height: calc(100% - 135px);
        padding: 20px 20px 25px;
    }
    .create-popup .popup-body .sub-heading{
        font-size: var(--fs-14);
        margin-bottom: 15px;
    }
    .create-popup .popup-footer{
        padding: 20px 20px;
    }
    /* Common Create Popup End */

    /* Delete Popup Start */
    .delete-popup .modal-dialog {
        max-width: 270px !important;
    }
    .delete-popup .modal-content .modal-header{
        padding: 15px 15px;
    }
    .delete-popup .modal-content .modal-header .modal-title{
        font-size: var(--fs-20);
    }
    .delete-popup .modal-content .modal-body{
        padding: 20px 20px;
    }
    .delete-popup .modal-content .modal-body .desc{
        font-size: var(--fs-16);
    }
    .delete-popup .modal-content .modal-footer .btn-cancel,
    .delete-popup .modal-content .modal-footer .btn-yes{
        height: 50px;
        font-size: var(--fs-16);
    }
    /* Delete Popup End */

    /* Toasts Start */
    .toast.toast-sm{
        max-width: 450px;
    }
    .toast.toast-md{
        max-width: 700px;
    }
    .toast.toast-lg{
        max-width: 870px;
    }

    .toast .close{
        width: 40px;
        height: 40px;
    }
    .toast .close svg{
        width: 14px;
        height: 14px;
    }
    .toast .title {
        margin-top: 2px;
    }
    /* Toasts End */

    /* Bootstrap Modal Css Start */
    .modal .modal-dialog{
        max-width: 480px;
    }
    .modal .modal-header{
        padding: 0.75rem 1rem;
    }
    .modal .modal-header .modal-title{
        font-size: var(--fs-20);
    }
    /* Bootstrap Modal Css End */

    .order-steps .step .left .date{
        font-size: var(--fs-16);
    }
    .order-steps .step .right .desc{
        font-size: var(--fs-16);
    }
    .order-steps .step .right .status{
        font-size: var(--fs-14);
    }
    .order-steps .step .right .badge-link .status-badge{
        min-width: 90px;
        height: 28px;
        font-size: var(--fs-14);
    }
    .order-steps .step .right .badge-link .link{
        font-size: var(--fs-14);
    }

    .log-status{
        font-size: var(--fs-16);
        padding: 8px 12px;
    }
    .log-details{
        padding-bottom: 35px;
        margin-bottom: 35px;
    }
    .log-details .key{
        font-size: var(--fs-16);
    }
    .log-details .value {
        font-size: var(--fs-16);
    }
    .code-view{
        font-size: var(--fs-16);
    }

    .delete-product-item .icon{
        width: 36px;
    }

    /* Select 2 Start */
    .field-lg + .select2-container .select2-selection--single{
        height: 46px !important;
    }
    .field-md + .select2-container .select2-selection--single{
        height: 42px !important;
    }
    .field-lg + .select2-container .select2-selection--single .select2-selection__rendered {
        line-height: 46px !important;
    }
    .field-md + .select2-container .select2-selection--single .select2-selection__rendered {
        line-height: 42px !important;
    }
    .select2-container .select2-selection--single .select2-selection__rendered .select2-selection__placeholder {
        font-size: var(--fs-14);
    }
    .select2-container .select2-selection--single .select2-selection__arrow{
        background-size: 14px 14px;
    }
    .field-lg + .select2-container .select2-selection--single .select2-selection__arrow{
        height: 46px !important;
    }
    .field-md + .select2-container .select2-selection--single .select2-selection__arrow{
        height: 42px !important;
    }
    .select2-container .select2-search--dropdown .select2-search__field {
        font-size: var(--fs-14);
    }
    .select2-container .select2-dropdown .select2-results .select2-results__option{
        font-size: var(--fs-14);
    }

    .field-lg + .select2-container .select2-selection--multiple .select2-selection__rendered{
        min-height: 44px;
    }
    .field-md + .select2-container .select2-selection--multiple .select2-selection__rendered{
        min-height: 40px;
    }
    .select2-container .select2-selection--multiple .select2-selection__rendered .select2-selection__choice{
        font-size: var(--fs-14);
    }
    .select2-container .select2-selection--multiple .select2-selection__rendered .select2-search .select2-search__field{
        font-size: var(--fs-14);
    }
    /* Select 2 End */

    /* Dashboard Start */
    .dashboard-widgets .widget{
        padding: 10px 15px;
        column-gap: 10px;
    }
    .dashboard-widgets .widget .total{
        row-gap: 30px;
    }
    .dashboard-widgets .widget .total .number{
        font-size: var(--fs-42);
    }
    .dashboard-widgets .widget .total .text{
        font-size: var(--fs-16);
    }
    .dashboard-widgets .widget .pattern-img{
        width: 110px;
    }

    .dashboard-chart .header .heading{
        font-size: var(--fs-22);
    }
    .dashboard-chart .session-status{
        column-gap: 20px;
    }
    /* Dashboard End */

    /* Main Content End */
}

@media only screen and (max-width: 1499.98px) and (min-width: 1200px) {

    /* Common Spacing Start */
    .mb-30{
        margin-bottom: 20px !important;
    }
    .mb-35{
        margin-bottom: 25px !important;
    }
    .mb-60{
        margin-bottom: 40px !important;
    }
    .mb-90{
        margin-bottom: 60px !important;
    }
    .pt-30{
        padding-top: 20px;
    }
    .gap-y-24{
        row-gap: 20px;
    }
    .gap-x-30{
        column-gap: 15px;
    }
    .gap-x-20{
        column-gap: 10px;
    }
    label.error{
        font-size: var(--fs-14);
    }
    /* Common Spacing End */

    /* Buttons Css Start */
    .crm-btn{
        min-width: 120px;
        font-size: var(--fs-14);
    }
    .crm-btn-sm{
        padding: 5px 16px;
        height: 36px;
    }
    .crm-btn-md{
        padding: 7px 16px;
        height: 40px;
    }
    .crm-btn-lg{
        padding: 12px 16px;
        height: 48px;
    }
    .icon-btn .icon{
        width: 20px;
        height: 20px;
    }
    .icon-btn-sm{
        padding: 4px 20px 4px 16px;
    }
    .icon-btn-md{
        padding: 6px 20px 6px 16px;
    }
    .icon-btn-lg{
        padding: 12px 14px 12px 10px;
    }
    .crm-btn-outline{
        min-width: 120px;
        font-size: var(--fs-14);
    }
    /* Buttons Css End */

    /* Input label & Fields Start */
    .crm-label{
        font-size: var(--fs-14);
    }
    .crm-field{
        font-size: var(--fs-14);
    }
    .field-sm{
        padding: 5px 12px;
        height: 36px;
    }
    .field-md{
        padding: 7px 12px;
        height: 40px;
    }
    .field-lg{
        padding: 9px 12px;
        height: 44px;
    }
    .field-xl{
        padding: 12px 12px;
        height: 48px;
    }
    select.crm-field {
        background-size: 12px 12px;
    }
    .icon-pass-shown,
    .icon-pass-hidden{
        width: 15px;
    }

    /* Login Page Start*/
    .auth-page .content .box .heading{
        font-size: var(--fs-36);
        line-height: 1.2;
    }
    .auth-page .content .box .desc{
        font-size: var(--fs-14);
        margin-bottom: 40px;
    }
    /* Login Page End*/

    /* Left Sidebar Start*/
    .main {
        padding-left: 300px;
    }
    .aside {
        width: 300px;
        padding: 0 0 20px 20px;
        border-radius: 0 25px 25px 0;
    }
    .aside::after{
        top: 81px;
    }
    .aside .sidebar-toggler{
        top: 31px;
        right: -9px;
        height: 20px;
        width: 20px;
    }
    .aside .logo-container{
        padding: 21px 20px 20px 0;
    }
    .aside .logo-container .logo .icon{
        width: 40px;
        height: 40px;
    }
    .aside .logo-container .logo .text{
        font-size: var(--fs-32);
    }
    .aside .aside-accordion{
        row-gap: 8px;
        height: calc(100% - 81px);
        padding-top: 30px;
        padding-right: 20px;
    }
    .aside .aside-accordion .non-accordion-item a{
        font-size: var(--fs-14);
        column-gap: 12px;
        padding: 14px 16px;
        border-radius: 8px;
    }
    .aside .aside-accordion .non-accordion-item a .icon{
        width: 18px;
    }
    .aside .aside-accordion .accordion-item {
        border-radius: 8px;
    }
    .aside .aside-accordion .accordion-item .accordion-button{
        font-size: var(--fs-14);
        column-gap: 12px;
        padding: 13px 10px;
    }
    .aside .aside-accordion .accordion-item .accordion-button::after{
        width: 1rem;
        height: 1rem;
        background-size: 1rem;
    }
    .aside .aside-accordion .accordion-item .accordion-button .icon{
        width: 18px;
    }
    .aside .aside-accordion .accordion-item ul{
        padding: 10px 30px 10px;
    }
    .aside .aside-accordion .accordion-item ul li a{
        font-size: var(--fs-14);
        padding: 12px 16px;
        border-radius: 8px;
    }
    /* Left Sidebar End */

    /* Left Sidebar Toggled */
    .main.sidenav-toggled .top-nav {
        left: 99px;
        width: calc(100% - 99px);
    }
    .main.sidenav-toggled{
        padding-left: 99px;
    }
    .main.sidenav-toggled .aside {
        width: 99px;
    }
    .main.sidenav-toggled .aside .aside-accordion .non-accordion-item a .icon{
        width: 24px;
    }
    .main.sidenav-toggled .aside .aside-accordion .accordion-item .accordion-button .icon{
        width: 24px;
    }
    /* Left Sidebar Toggled */

    /* Topbar Start*/
    .top-nav {
        left: 300px;
        width: calc(100% - 300px);
        padding: 20px 30px;
    }
    .top-nav .btn-back{
        column-gap: 5px;
        font-size: var(--fs-16);
    }
    .top-nav .btn-back .icon {
        width: 22px;
        height: 22px;
    }
    .top-nav .role-dropdown .dropdown-toggle{
        font-size: var(--fs-14);
        padding: 10px 15px;
        border-radius: 10px;
    }
    .top-nav .role-dropdown .dropdown-toggle .icon{
        width: 18px;
    }
    .top-nav .role-dropdown .dropdown-menu,
    .top-nav .profile-dropdown .dropdown-menu{
        padding: 10px 0 10px;
        border-radius: 10px;
    }
    .top-nav .role-dropdown .dropdown-menu li a,
    .top-nav .profile-dropdown .dropdown-menu li a{
        font-size: var(--fs-14);
        column-gap: 10px;
        padding: 8px 16px;
    }
    .top-nav .profile-dropdown .dropdown-toggle{
        width: 40px;
        height: 40px;
    }
    .top-nav .profile-dropdown .dropdown-menu li a .icon{
        width: 18px;
    }
    /* Topbar End*/

    /* Main Content Start */
    .main .content {
        padding: 82px 25px 20px;
    }

    /* General Breadcrumbs Start*/
    .breadcrumbs{
        padding: 15px 0;
    }
    .breadcrumbs .breadcrumbs-list li a{
        font-size: var(--fs-14);
    }
    .breadcrumbs .btn-back{
        font-size: var(--fs-14);
    }
    .breadcrumbs .btn-back .icon{
        width: 18px;
        height: 18px;
    }
    /* General Breadcrumbs End*/

    /* CRM Full Card Start */
    .crm-full-card{
        min-height: calc(100vh - 148px);
    }
    .crm-full-card .crm-full-card-header{
        padding: 20px 20px;
    }
    /* CRM Full Card End */

    /* CRM Update Card Start */
    .crm-update-card{
        min-height: calc(100vh - 148px);
    }
    .crm-update-card .crm-update-card-header{
        padding: 20px 20px;
    }
    .crm-update-card .crm-update-card-header .heading{
        font-size: var(--fs-20);
    }
    .crm-update-card .crm-update-card-body{
        padding: 30px 30px 30px;
    }
    .crm-update-card .crm-update-card-body .sub-heading{
        font-size: var(--fs-18);
    }
    .crm-update-card .crm-update-card-footer{
        padding: 20px 25px;
    }
    /* CRM Update Card End */

    /* CRM Tabs Card Start */
    .crm-tabs-card{
        min-height: calc(100vh - 146px);
    }
    .crm-tabs-card .tabs-header{
        column-gap: 35px;
        padding: 20px 20px 0;
    }
    .crm-tabs-card .tabs-header .nav-item .nav-link{
        padding: 0 15px 15px;
        font-size: var(--fs-16);
    }
    .crm-tabs-card .tabs-header .nav-item .nav-link::after{
        height: 5px;
        border-radius: 10px;
    }
    /* CRM Tabs Card End */

    /* Table Card Inside Tab Start */
    .table-inside-tab-card .table-inside-tab-card-header{
        padding: 20px 25px;
    }
    /* Table Card Inside Tab End */

    /* Customer Detail Page Start */
    .customer-details-view{
        padding: 30px;
    }
    .details-sub-heading{
        font-size: var(--fs-18);
    }
    .customer-details .key{
        font-size: var(--fs-14);
    }
    .customer-details .value{
        font-size: var(--fs-14);
    }

    .wallet-details{
        font-size: var(--fs-16);
        margin-bottom: 10px;
    }
    
    .positive-value,
    .negative-value{
        font-size: var(--fs-14);
    }
    .positive-value .icon,
    .negative-value .icon{
        width: 24px;
    }
    .enter-admin-fee{
        height: 15px;
        width: 25px;
        font-size: var(--fs-14);
    }
    /* Customer Detail Page End */

    /* Actions Dropdown Start */
    .actions-dd .dropdown-toggle {
        padding: 8px 12px;
    }
    .actions-dd .dropdown-toggle .icon{
        width: 14px;
    }
    .actions-dd .dropdown-menu {
        padding: 8px 0 8px;
    }
    .actions-dd .dropdown-menu li a {
        padding: 6px 12px;
        font-size: var(--fs-14);
    }
    /* Actions Dropdown End */

    /* Searchbar for Table Header Start */
    .search-filter{
        max-width: 300px;
    }
    .search-filter .form-control{
        font-size: var(--fs-14);
        padding: 12px 14px;
    }
    .search-filter .filter-dropdown{
        padding: 12px 35px 12px 10px;
        background-size: 12px 12px;
        background-position: right 12px center;
        font-size: var(--fs-14);
    }
    /* Searchbar for Table Header End */

    /* CRM Table Start */
    .crm-table thead tr th{
        font-size: var(--fs-14);
        padding: 18px 10px;
    }
    .crm-table thead th.sorting {
        padding: 18px 16px 18px 10px;
    }
    .crm-table thead th.sorting:after {
        background-size: 14px 14px;
        width: 16px;
        height: 16px;
    }
    .crm-table thead tr th:first-child,
    .crm-table tbody tr td:first-child{
        padding-left: 25px;
    }
    .crm-table thead tr th:last-child,
    .crm-table tbody tr td:last-child{
        padding-right: 25px;
    }
    .crm-table tbody tr td{
        font-size: var(--fs-14);
        padding: 18px 12px;
    }
    .crm-table tr .checkbox-column .form-check-input {
        width: 16px;
        height: 16px;
        border: 1px solid #606060;
    }
    .crm-table tr .checkbox-column .form-check-input:checked{
        background-size: 16px 16px;
    }
    .crm-table tbody tr td .actions-column .actions .item{
        font-size: var(--fs-14);
    }
    .crm-table tbody tr td .actions-column .actions .item .icon{
        width: 14px;
    }
    .dataTables_wrapper .bottom{
        padding: 15px 20px;
    }
    /* CRM Table End */

    /* Table Pagination Start */
    .dataTables_paginate .pagination li a{
        width: 28px;
        height: 28px;
        font-size: var(--fs-12);
    }
    /* Table Pagination End */

    /* Table No of Entries Text Start */
    .dataTables_wrapper .dataTables_info{
        font-size: var(--fs-12);
    }
    /* Table No of Entries Text End */

    /* Table No of Pages Dropdown Start */
    .dataTables_wrapper .dataTables_length label{
        column-gap: 8px;
        font-size: var(--fs-12);
    }
    .dataTables_wrapper .dataTables_length label select{
        font-size: var(--fs-12);
        background-position: right 10px top 6px;
        padding: 5px 35px 5px 12px;
    }
    /* Table No of Pages Dropdown End */

    /* Checkbox and Radio */
    .form-check{
        column-gap: 10px;
    }
    .form-check .form-check-input {
        width: 1.125em;
        height: 1.125em;
    }
    .form-check .form-check-input[type=checkbox]:checked {
        background-size: 18px 18px;
    }
    .form-check .form-check-label{
        font-size: var(--fs-14);
    }
    /* Input Fields End */

    /* Common Create Popup Start */
    .create-popup{
        width: 420px;
        max-height: calc(100vh - 102px);
        top: 82px;
        right: -420px;
    }
    .create-popup.opened{
        transform: translateX(-420px);
    }
    .create-popup .popup-header{
        padding: 15px 15px;
    }
    .create-popup .popup-header .heading{
        font-size: var(--fs-18);
    }
    .create-popup .popup-header .btn-close{
        width: 1rem;
        height: 1rem;
    }
    .create-popup .popup-body{
        max-height: calc(100% - 125px);
        padding: 20px 20px 20px;
    }
    .create-popup .popup-body .sub-heading{
        font-size: var(--fs-14);
        margin-bottom: 15px;
    }
    .create-popup .popup-footer{
        padding: 20px 20px;
    }
    /* Common Create Popup End */

    /* Delete Popup Start */
    .delete-popup .modal-dialog {
        max-width: 230px !important;
    }
    .delete-popup .modal-content{
        border-radius: 12px;
    }
    .delete-popup .modal-content .modal-header{
        padding: 12px 15px;
    }
    .delete-popup .modal-content .modal-header .modal-title{
        font-size: var(--fs-18);
    }
    .delete-popup .modal-content .modal-header .btn-close {
        width: 0.75rem;
        background-size: 0.75rem;
    }
    .delete-popup .modal-content .modal-body{
        padding: 15px 15px;
    }
    .delete-popup .modal-content .modal-body .desc{
        font-size: var(--fs-14);
    }
    .delete-popup .modal-content .modal-footer .btn-cancel,
    .delete-popup .modal-content .modal-footer .btn-yes{
        height: 50px;
        font-size: var(--fs-14);
    }
    .delete-popup .modal-content .modal-footer .btn-cancel {
        border-radius: 0 0 0 9px;
    }
    .delete-popup .modal-content .modal-footer .btn-yes {
        border-radius: 0 0 9px 0;
    }
    /* Delete Popup End */

    /* Toasts Start */
    .toast{
        padding: 15px;
    }
    .toast.toast-sm{
        max-width: 400px;
    }
    .toast.toast-md{
        max-width: 650px;
    }
    .toast.toast-lg{
        max-width: 800px;
    }

    .toast .close{
        top: 5px;
        right: 5px;
        width: 36px;
        height: 36px;
    }
    .toast .close svg{
        width: 12px;
        height: 12px;
    }
    .toast .icon-container{
        width: 28px;
        height: 28px;
        border-radius: 28px;
    }
    .toast .title{
        font-size: var(--fs-14);
        margin-top: 3px;
    }
    .toast .desc{
        margin-top: 7px;
        font-size: var(--fs-14);
    }
    /* Toasts End */

    /* Bootstrap Modal Css Start */
    .modal .modal-dialog{
        max-width: 450px;
    }
    .modal .modal-header{
        padding: 0.75rem 1rem;
    }
    .modal .modal-header .modal-title{
        font-size: var(--fs-18);
    }
    /* Bootstrap Modal Css End */

    .status-icon {
        width: 24px;
        height: 24px;
    }

    .permission-checkbox input[type="checkbox"] {
        width: 1.25em;
        height: 1.25em;
    }
    
    .campaign-logo{
        width: 60px;
        height: 60px;
    }
    .accent-color{
        width: 30px;
        height: 30px;
    }

    /* Color Picker */
    .custom-color-picker .color-code{
        column-gap: 10px;
    }
    .custom-color-picker .color-code input{
        width: 24px;
        height: 24px;
    }
    .custom-color-picker .color-code .value{
        font-size: var(--fs-14);
    }
    .custom-color-picker svg{
        width: 20px;
        height: 20px;
    }

    .custom-badge{
        min-width: 100px;
        font-size: var(--fs-14);
        padding: 7px 10px;
        border-radius: 5px;
    }

    .view-invoice-link{
        font-size: var(--fs-14);
    }

    .product-img{
        width: 45px;
    }

    .email-keywords{
        gap: 10px;
        margin-top: 12px;
    }
    .email-keywords .keyword{
        font-size: var(--fs-12);
        padding: 10px 12px;
    }

    /* Stripe Custom Account Steps Start */
    .stripe-steps-container{
        padding: 30px 30px;
    }
    .stripe-steps .nav-item .nav-link .numb{
        height: 35px;
        width: 35px;
        font-size: var(--fs-14);
        line-height: 35px;
        border-radius: 35px;
    }
    .stripe-steps .nav-item .nav-link.active .numb::before{
        height: 37px;
        width: 37px;
        border-radius: 37px;
    }
    .stripe-steps .nav-item .nav-link .numb .check-icon{
        width: 15px;
    }
    .stripe-steps .nav-item .nav-link .title{
        font-size: var(--fs-14);
    }
    /* Stripe Custom Account Steps End*/

    /* Subscription Details Card Start */
    .subscription-details-card{
        min-height: calc(100vh - 146px);
    }
    .subscription-details-card .subscription-details-card-header{
        padding: 20px 20px;
    }
    .subscription-details-card .subscription-details-card-header .heading{
        font-size: var(--fs-20);
    }
    /* Subscription Details Card End */

    /* Subscription View Details Start */
    .view-subscription-details{
        padding: 30px 30px 30px;
    }
    .view-subscription-details .sub-heading{
        font-size: var(--fs-18);
        margin-bottom: 0;
    }
    .view-subscription-details .key{
        font-size: var(--fs-14);
    }
    .view-subscription-details .value{
        font-size: var(--fs-14);
    }
    /* Subscription View Details End */

    /* Customer Subscription Card Start */
    .customer-subscription-card .sub-heading{
        font-size: var(--fs-18);
        padding-left: 30px;
    }
    .customer-subscription-card .customer-subscription-card-header{
        padding: 20px 20px;
    }
    /* Customer Subscription Card End */

    /* Products View Details Start */
    .view-product-details .key,
    .view-session-order-details .key,
    .view-order-details .key{
        font-size: var(--fs-14);
    }
    .view-product-details .value,
    .view-session-order-details .value,
    .view-order-details .value{
        font-size: var(--fs-14);
    }
    .view-product-details .key{
        width: 150px;
    }
    /* Products View Details End */

    /* Coupon Details Start */
    .products-coupon-details .key,
    .products-coupon-details .value{
        font-size: var(--fs-14);
    }
    /* Coupon Details End */

    /* Session Orders View Details Start */
    .session-orders-btns{
        right: 10px;
        column-gap: 10px;
    }
    .session-orders-btns .btn{
        padding: 7px 12px;
        height: 40px;
        font-size: var(--fs-14);
    }
    /* Session Orders Details End */

    /* Orders View Details Start */
    .order-fixed-btns{
        right: 15px;
        column-gap: 10px;
    }
    .order-fixed-btns .btn-resend,
    .order-fixed-btns .btn-add-blacklist{
        padding: 7px 12px 7px 10px;
        height: 40px;
        font-size: var(--fs-14);
        border-radius: 6px;
    }
    .order-steps .step .left .date{
        font-size: var(--fs-14);
    }
    .order-steps .step .left .time{
        font-size: var(--fs-12);
    }
    .order-steps .step .right .desc{
        font-size: var(--fs-14);
    }
    .order-steps .step .right .status{
        font-size: var(--fs-14);
    }
    .order-steps .step .right .badge-link .status-badge{
        min-width: 85px;
        height: 26px;
        font-size: var(--fs-14);
    }
    .order-steps .step .right .badge-link .link{
        font-size: var(--fs-14);
    }

    .log-status{
        font-size: var(--fs-14);
        padding: 6px 12px;
    }
    .log-details{
        padding-bottom: 30px;
        margin-bottom: 30px;
    }
    .log-details .key{
        font-size: var(--fs-14);
    }
    .log-details .value {
        font-size: var(--fs-14);
    }
    .code-view{
        padding: 15px;
        font-size: var(--fs-14);
    }

    .delete-product-item .icon{
        width: 32px;
    }

    .grand-total{
        padding: 20px 20px;
    }
    .grand-total .item{
        margin-bottom: 15px;
    }
    .grand-total .item .key{
        font-size: var(--fs-14);
    }
    .grand-total .item .value{
        font-size: var(--fs-14);
    }

    .order-payment-modal .modal-body .content-container .icon,
    .refund-modal .modal-body .content-container .icon{
        width: 50px;
    }
    .order-payment-modal .modal-body .content-container .desc,
    .refund-modal .modal-body .content-container .desc{
        font-size: var(--fs-14);
    }

    .refund-modal .modal-body .amount-details .item{
        column-gap: 30px;
    }
    .refund-modal .modal-body .amount-details .item .key,
    .refund-modal .modal-body .amount-details .item .value{
        font-size: var(--fs-14);
    }
    /* Orders Details End */

    /* Select 2 Start */
    .field-lg + .select2-container .select2-selection--single{
        height: 44px !important;
    }
    .field-md + .select2-container .select2-selection--single{
        height: 40px !important;
    }
    .select2-container .select2-selection--single .select2-selection__rendered {
        font-size: var(--fs-14);
    }
    .field-lg + .select2-container .select2-selection--single .select2-selection__rendered {
        line-height: 44px !important;
    }
    .field-md + .select2-container .select2-selection--single .select2-selection__rendered {
        line-height: 40px !important;
    }
    .select2-container .select2-selection--single .select2-selection__rendered .select2-selection__placeholder {
        font-size: var(--fs-14);
    }
    .select2-container .select2-selection--single .select2-selection__arrow{
        background-size: 12px 12px;
    }
    .field-lg + .select2-container .select2-selection--single .select2-selection__arrow{
        height: 44px !important;
    }
    .field-md + .select2-container .select2-selection--single .select2-selection__arrow{
        height: 40px !important;
    }
    .select2-container .select2-search--dropdown .select2-search__field {
        font-size: var(--fs-14);
    }
    .select2-container .select2-dropdown .select2-results .select2-results__option{
        font-size: var(--fs-14);
    }

    .field-lg + .select2-container .select2-selection--multiple .select2-selection__rendered{
        min-height: 42px;
    }
    .field-md + .select2-container .select2-selection--multiple .select2-selection__rendered{
        min-height: 38px;
    }
    .select2-container .select2-selection--multiple .select2-selection__rendered .select2-selection__choice{
        font-size: var(--fs-12);
    }
    .select2-container .select2-selection--multiple .select2-selection__rendered .select2-search .select2-search__field{
        font-size: var(--fs-14);
    }
    /* Select 2 End */

    /* Dashboard Start */
    .dashboard-widgets .widget{
        padding: 12px 15px;
        column-gap: 10px;
    }
    .dashboard-widgets .widget .total{
        row-gap: 25px;
    }
    .dashboard-widgets .widget .total .number{
        font-size: var(--fs-36);
    }
    .dashboard-widgets .widget .total .text{
        font-size: var(--fs-14);
    }
    .dashboard-widgets .widget .pattern-img{
        width: 90px;
    }

    .dashboard-chart .chart-card{
        padding: 25px 30px;
    }
    .dashboard-chart .header .heading{
        font-size: var(--fs-20);
    }
    .dashboard-chart .session-status{
        column-gap: 20px;
    }
    .dashboard-chart .session-status .item .text{
        font-size: var(--fs-14);
    }
    .dashboard-chart .duration-selection {
        column-gap: 10px;
    }
    .dashboard-chart .duration-selection .option input+label{
        padding: 7px 18px;
        font-size: var(--fs-14);
    }
    /* Dashboard End */
    
    /* Main Content End */
}
@media screen and (max-width: 991.98px) {
    .main,
    .main.sidenav-toggled {
        padding-left: 0;
    }
    .aside {
        width: 300px;
        transform: translateX(-315px);
    }
    .main.sidenav-toggled .aside {
        transform: translateX(0);
    }
    .top-nav {
        left: 0;
        width: 100%;
    }
    .top-nav > div,
    .top-nav .btn-back{
        display: none;
    }
    .top-nav .btn-toggle-mob{
        display: block;
    }
    .top-nav .btn-toggle-mob .icon{
        width: 30px;
    }
}
@media only screen and (max-width: 991.98px) and (min-width: 768px) {
    .top-nav {
        padding: 20px 15px;
    }
}
@media screen and (max-width: 767.98px) {
    .mb-60{
        margin-bottom: 40px !important;
    }
    .gap-x-20{
        column-gap: 10px;
    }
    .word-break{
        word-break: keep-all;
        white-space: nowrap;
    }

    .crm-btn-lg{
        padding: 10px 16px;
        height: 50px;
    }
    .field-lg{
        padding: 9px 12px;
        height: 44px;
    }
    .field-xl{
        padding: 10px 12px;
        height: 50px;
    }

    /* Login Page Start*/
    .auth-page .logo{
        left: 7.5%;
        top: 20px;
        width: 130px;
    }
    .auth-page .content{
        padding-top: 80px;
        padding-bottom: 20px;
        position: relative;
        background: var(--bg-gradient);
    }
    .auth-page .content .box{
        width: 85%;
        padding: 20px;
        background-color: var(--light-blue);
        border-radius: 10px;
    }
    .auth-page .content .box .icon{
        margin-bottom: 10px;
    }
    .auth-page .content .box .heading{
        font-size: var(--fs-32);
    }
    .auth-page .content .box .desc{
        font-size: var(--fs-16);
        line-height: 1.4;
        margin-bottom: 30px;
    }
    /* Login Page End*/

    /* Left Sidebar Start*/
    .aside {
        padding: 0 0 15px 15px;
        border-radius: 0 20px 0 0;
    }
    .aside::after{
        top: 70px;
    }
    .aside .sidebar-toggler{
        top: 24px;
        right: -12px;
        height: 24px;
        width: 24px;
    }
    .aside .logo-container{
        padding: 15px 0;
    }
    .aside .logo-container .logo .icon{
        width: 40px;
        height: 40px;
    }
    .aside .logo-container .logo .text{
        font-size: var(--fs-28);
    }
    .aside .aside-accordion{
        row-gap: 8px;
        height: calc(100% - 81px);
        padding-top: 20px;
        padding-right: 15px;
    }
    .aside .aside-accordion .non-accordion-item a{
        font-size: var(--fs-16);
        column-gap: 10px;
        padding: 14px 14px;
        border-radius: 8px;
    }
    .aside .aside-accordion .non-accordion-item a .icon{
        width: 18px;
    }
    .aside .aside-accordion .accordion-item {
        border-radius: 8px;
    }
    .aside .aside-accordion .accordion-item .accordion-button{
        font-size: var(--fs-16);
        column-gap: 10px;
        padding: 14px 8px;
    }
    .aside .aside-accordion .accordion-item .accordion-button::after{
        width: 1rem;
        height: 1rem;
        background-size: 1rem;
    }
    .aside .aside-accordion .accordion-item .accordion-button .icon{
        width: 18px;
    }
    .aside .aside-accordion .accordion-item ul{
        padding: 10px 24px 10px;
    }
    .aside .aside-accordion .accordion-item ul li a{
        font-size: var(--fs-16);
        padding: 12px 14px;
        border-radius: 8px;
    }
    /* Left Sidebar End */

    /* Topbar Start*/
    .top-nav {
        padding: 15px 15px;
    }
    .top-nav .btn-toggle-mob .icon{
        width: 30px;
    }
    .top-nav .role-dropdown .dropdown-toggle{
        font-size: var(--fs-14);
        padding: 9px 15px;
        border-radius: 8px;
    }
    .top-nav .profile-dropdown .dropdown-menu{
        padding: 10px 0 10px;
        border-radius: 8px;
    }
    .top-nav .profile-dropdown .dropdown-menu li a{
        padding: 8px 16px;
    }
    .top-nav .profile-dropdown .dropdown-toggle{
        width: 40px;
        height: 40px;
    }
    .top-nav .profile-dropdown .dropdown-menu li a .icon{
        width: 18px;
    }
    /* Topbar End*/

    /* Main Content Start */
    .main .content {
        padding: 71px 15px 20px;
    }

    /* General Breadcrumbs Start*/
    .breadcrumbs{
        padding: 15px 0;
    }
    .breadcrumbs .breadcrumbs-list li a{
        font-size: var(--fs-16);
    }
    /* General Breadcrumbs End*/

    /* CRM Full Card Start */
    .crm-full-card{
        min-height: calc(100vh - 137px);
    }
    .crm-full-card .crm-full-card-header{
        flex-direction: column;
        align-items: stretch;
        row-gap: 15px;
        padding: 20px 20px;
    }
    .sm-gap-y-15{
        row-gap: 15px;
    }
    /* CRM Full Card End */

    /* CRM Update Card Start */
    .crm-update-card{
        min-height: calc(100vh - 137px);
    }
    .crm-update-card .crm-update-card-header{
        padding: 20px 15px;
    }
    .crm-update-card .crm-update-card-header .heading{
        font-size: var(--fs-18);
    }
    .crm-update-card .crm-update-card-body{
        padding: 25px 20px 20px;
    }
    .crm-update-card .crm-update-card-body .sub-heading{
        font-size: var(--fs-18);
    }
    .crm-update-card .crm-update-card-footer{
        padding: 20px 20px;
    }
    /* CRM Update Card End */

    /* CRM Tabs Card Start */
    .crm-tabs-card{
        min-height: calc(100vh - 137px);
    }
    .crm-tabs-card .tabs-header{
        column-gap: 20px;
        padding: 20px 10px 0;
        justify-content: flex-start;
        flex-wrap: nowrap;
        overflow-x: auto;
    }
    .crm-tabs-card .tabs-header .nav-item .nav-link{
        padding: 0 0 15px;
        font-size: var(--fs-16);
        white-space: nowrap;
    }
    .crm-tabs-card .tabs-header .nav-item .nav-link::after{
        height: 5px;
        border-radius: 10px;
    }
    /* CRM Tabs Card End */

    /* Table Card Inside Tab Start */
    .table-inside-tab-card .table-inside-tab-card-header{
        flex-direction: column;
        align-items: stretch;
        row-gap: 15px;
        padding: 20px 20px;
    }
    /* Table Card Inside Tab End */

    /* Customer Detail Page Start */
    .customer-details-view{
        padding: 30px;
    }
    .details-sub-heading{
        font-size: var(--fs-18);
        align-items: flex-start;
        flex-direction: column;
        row-gap: 5px;
    }
    .customer-details .key{
        font-size: var(--fs-14);
        width: auto;
    }
    .customer-details .value{
        font-size: var(--fs-14);
    }

    .wallet-details{
        font-size: var(--fs-16);
        margin-bottom: 10px;
    }
    
    .positive-value,
    .negative-value{
        font-size: var(--fs-14);
    }
    .positive-value .icon,
    .negative-value .icon{
        width: 24px;
    }
    /* Customer Detail Page End */

    /* Actions Dropdown Start */
    .actions-dd .dropdown-toggle{
        height: 50px;
        justify-content: space-between;
    }
    /* Actions Dropdown End */

    /* Searchbar for Table Header Start */
    .search-filter{
        max-width: 100%;
        border-radius: 8px;
    }
    .search-filter .form-control{
        font-size: var(--fs-16);
        padding: 8px 12px;
    }
    .search-filter .filter-dropdown{
        padding: 12px 30px 12px 12px;
        background-size: 12px 12px;
        background-position: right 12px center;
        font-size: var(--fs-16);
        border-radius: 0 8px 8px 0;
    }
    /* Searchbar for Table Header End */

    /* CRM Table Start */
    .crm-table thead tr th{
        font-size: var(--fs-16);
        padding: 18px 12px;
    }
    .crm-table thead th.sorting:after {
        background-size: 14px 14px;
        width: 16px;
        height: 16px;
    }
    .crm-table thead tr th:first-child,
    .crm-table tbody tr td:first-child{
        padding-left: 20px;
    }
    .crm-table thead tr th:last-child,
    .crm-table tbody tr td:last-child{
        padding-right: 20px;
    }
    .crm-table tbody tr td{
        font-size: var(--fs-16);
        padding: 18px 12px;
    }
    .crm-table tr .checkbox-column .form-check-input {
        width: 18px;
        height: 18px;
    }
    .crm-table tr .checkbox-column .form-check-input:checked{
        background-size: 18px 18px;
    }
    .crm-table tbody tr td .actions-column .actions .item{
        font-size: var(--fs-16);
    }
    .crm-table tbody tr td .actions-column .actions .item .icon{
        width: 14px;
    }
    /* CRM Table End */

    .dataTables_wrapper .bottom{
        flex-direction: column;
        justify-content: center;
        row-gap: 15px;
    }

    /* Table Pagination Start */
    .dataTables_paginate .pagination li a{
        width: 28px;
        height: 28px;
        font-size: var(--fs-12);
    }
    /* Table Pagination End */

    /* Table No of Entries Text Start */
    .dataTables_wrapper .dataTables_info{
        font-size: var(--fs-12);
    }
    /* Table No of Entries Text End */

    /* Table No of Pages Dropdown Start */
    .dataTables_wrapper .dataTables_length label{
        column-gap: 8px;
        font-size: var(--fs-12);
    }
    .dataTables_wrapper .dataTables_length label select{
        font-size: var(--fs-12);
        background-position: right 10px top 6px;
        padding: 5px 35px 5px 12px;
    }
    /* Table No of Pages Dropdown End */

    /* Checkbox and Radio */
    .form-check{
        column-gap: 10px;
    }
    .form-check .form-check-input {
        width: 1.125em;
        height: 1.125em;
    }
    .form-check .form-check-input[type=checkbox]:checked {
        background-size: 18px 18px;
    }
    .form-check .form-check-label{
        font-size: var(--fs-14);
    }
    /* Input Fields End */

    /* Common Create Popup Start */
    .create-popup{
        width: 100%;
        max-height: calc(100vh - 71px);
        top: initial;
        bottom: 0;
        right: 0;
        left: 0;
        transform: translateY(100%);
        border-radius: 0px 0px 0px 0px;
    }
    .create-popup.opened{
        transform: translateY(0);
    }
    .create-popup .popup-header{
        padding: 20px 15px;
    }
    .create-popup .popup-header .heading{
        font-size: var(--fs-18);
    }
    .create-popup .popup-header .btn-close{
        width: 1rem;
        height: 1rem;
    }
    .create-popup .popup-body{
        max-height: calc(100% - 147px);
        padding: 20px 20px 20px;
    }
    .create-popup .popup-body .sub-heading{
        font-size: var(--fs-16);
        margin-bottom: 15px;
    }
    .create-popup .popup-footer{
        padding: 20px 20px;
    }
    .create-popup .popup-footer .crm-btn-outline,
    .create-popup .popup-footer .crm-btn{
        flex: 1;
    }
    /* Common Create Popup End */

    /* Delete Popup Start */
    .delete-popup .modal-dialog {
        max-width: 260px;
        margin: 0 auto;
    }
    .delete-popup .modal-content .modal-header{
        padding: 15px 15px;
    }
    .delete-popup .modal-content .modal-header .modal-title{
        font-size: var(--fs-20);
    }
    .delete-popup .modal-content .modal-header .btn-close{
        width: 1rem;
        background-size: 1rem;
    }
    .delete-popup .modal-content .modal-body{
        padding: 20px 15px;
    }
    .delete-popup .modal-content .modal-body .desc{
        font-size: var(--fs-16);
    }
    .delete-popup .modal-content .modal-footer .btn-cancel,
    .delete-popup .modal-content .modal-footer .btn-yes{
        height: 50px;
        font-size: var(--fs-16);
    }
    /* Delete Popup End */

    .status-icon {
        width: 24px;
        height: 24px;
    }

    .permission-checkbox input[type="checkbox"] {
        width: 1.25em;
        height: 1.25em;
    }
    
    .campaign-logo{
        width: 60px;
        height: 60px;
    }
    .accent-color{
        width: 30px;
        height: 30px;
    }

    /* Color Picker */
    .custom-color-picker .color-code{
        column-gap: 10px;
    }
    .custom-color-picker .color-code input{
        width: 24px;
        height: 24px;
    }
    .custom-color-picker .color-code .value{
        font-size: var(--fs-14);
    }
    .custom-color-picker svg{
        width: 20px;
        height: 20px;
    }

    .custom-badge{
        min-width: 85px;
        font-size: var(--fs-12);
        padding: 7px 10px;
    }
    .product-img{
        width: 45px;
    }

    .email-keywords{
        gap: 8px;
        margin-top: 12px;
    }
    .email-keywords .keyword{
        font-size: var(--fs-12);
        padding: 10px 12px;
    }

    /* Stripe Custom Account Steps Start */
    .stripe-steps-container{
        padding: 30px 30px;
    }
    .stripe-steps .nav-item .nav-link .numb{
        height: 35px;
        width: 35px;
        font-size: var(--fs-14);
        line-height: 35px;
        border-radius: 35px;
    }
    .stripe-steps .nav-item .nav-link.active .numb::before{
        height: 37px;
        width: 37px;
        border-radius: 37px;
    }
    .stripe-steps .nav-item .nav-link .numb .check-icon{
        width: 15px;
    }
    .stripe-steps .nav-item .nav-link .title{
        font-size: var(--fs-14);
    }
    /* Stripe Custom Account Steps End*/

    /* Subscription Details Card Start */
    .subscription-details-card{
        min-height: calc(100vh - 146px);
    }
    .subscription-details-card .subscription-details-card-header{
        padding: 20px 20px;
    }
    .subscription-details-card .subscription-details-card-header .heading{
        font-size: var(--fs-20);
    }
    /* Subscription Details Card End */

    /* Subscription View Details Start */
    .view-subscription-details{
        padding: 30px 30px 30px;
    }
    .view-subscription-details .sub-heading{
        font-size: var(--fs-18);
        margin-bottom: 0;
    }
    .view-subscription-details .key{
        font-size: var(--fs-14);
    }
    .view-subscription-details .value{
        font-size: var(--fs-14);
    }
    /* Subscription View Details End */

    /* Customer Subscription Card Start */
    .customer-subscription-card .sub-heading{
        font-size: var(--fs-18);
        padding-left: 30px;
    }
    .customer-subscription-card .customer-subscription-card-header{
        padding: 20px 20px;
    }
    /* Customer Subscription Card End */

    /* Products View Details Start */
    .view-product-details .key,
    .view-session-order-details .key,
    .view-order-details .key{
        font-size: var(--fs-16);
        width: auto;
    }
    .view-product-details .value,
    .view-session-order-details .value,
    .view-order-details .value{
        font-size: var(--fs-16);
    }
    /* Products View Details End */

    /* Session Orders View Details Start */
    .session-orders-btns{
        position: initial;
        flex-direction: column;
        row-gap: 15px;
        transform: translateY(0);
    }
    .session-orders-btns .btn{
        width: 100%;
    }
    /* Session Orders Details End */

    /* Orders View Details Start */
    .order-fixed-btns{
        position: initial;
        flex-direction: column;
        row-gap: 15px;
        transform: translateY(0);
    }
    .order-fixed-btns .btn-resend,
    .order-fixed-btns .btn-add-blacklist{
        width: 100%;
    }

    .grand-total{
        padding: 20px 20px;
    }
    .grand-total .item{
        margin-bottom: 15px;
    }
    .grand-total .item .key{
        font-size: var(--fs-14);
    }
    .grand-total .item .value{
        font-size: var(--fs-14);
    }
    /* Orders Details End */

    /* Dashboard Start */
    .dashboard-widgets .widget{
        padding: 15px 15px;
        border-radius: 8px;
    }
    .dashboard-widgets .widget .total{
        row-gap: 20px;
    }
    .dashboard-widgets .widget .total .number{
        font-size: var(--fs-32);
    }
    .dashboard-widgets .widget .total .text{
        font-size: var(--fs-16);
    }
    .dashboard-widgets .widget .pattern-img{
        display: none;
    }

    .dashboard-chart .chart-card {
        padding: 20px 20px;
    }
    .dashboard-chart .header .heading {
        font-size: var(--fs-20);
    }
    /* Dashboard End */

    /* Main Content End */
}