/* carousel section begins here */

.border-sharp {
    background: linear-gradient(to left, rgba(0, 0, 0, 0.8) 5%, rgb(159 161 165) 50%, rgba(0, 0, 0, 0.8) 95%) left bottom no-repeat;
    background-size: 100% 1px;
}


/* page title / subtitle / settings / notifications */

.page-title {
    padding: var(--common-size) 1.5rem;
    width: 100%;
}

.page-title h5 {
    margin-bottom: 0;
    margin-top: .5rem;
}

.subtitle {
    font-size: 1.125rem;
    text-transform: capitalize;
}

.subtitle+p {
    margin-bottom: 0;
}


/* common smooth vertical scroll */

.scroll-y {
    overflow-x: hidden;
    overflow-y: auto;
    mask-image: linear-gradient(to top, transparent, black), linear-gradient(to left, transparent 4px, black 4px);
    mask-size: 100% 20000px;
    mask-position: left bottom;
    -webkit-mask-image: linear-gradient(to top, transparent, black), linear-gradient(to left, transparent 4px, black 4px);
    -webkit-mask-size: 100% 20000px;
    -webkit-mask-position: left bottom;
    transition: mask-position 0.3s, -webkit-mask-position 0.3s;
}

.scroll-y:hover {
    -webkit-mask-position: left top;
    mask-position: left top;
}

.height-500 {
    max-height: 500px;
}


/* ========= overall accounts container ============== */

.funds-container {
    width: 100%;
    gap: 20px;
}


/* four boxes */

.funds-container .four-box {
    padding: var(--common-size);
    border: 1px solid;
    border-color: var(--border-color);
    border-radius: var(--border-radius);
    min-height: 100px;
    background-color: var(--card-bg);
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    position: relative;
    /* cursor: pointer; */
    z-index: 2;
    overflow: hidden;
}


/* box 1 components & custom variables */

.payout-container,
.wallet-container {
    background: var(--box-gradient-green);
    border-radius: var(--border-radius-half);
    position: relative;
}

.wallet-container {
    --box-gradient-green: linear-gradient(105deg, #111 0%, #2A2A2A 100%);
    background: var(--box-gradient-green);
}

.payout-container label,
.payout-container span,
.wallet-container label,
.wallet-container span,
.trans-view label {
    color: var(--primary-color);
}

.wallet-container:after,
.payout-container::after {
    background: url(../img/card_design.svg);
    background-position: right;
    background-size: cover;
    background-repeat: no-repeat;
    content: "";
    position: absolute;
    width: 70px;
    height: 100%;
    top: 0;
    right: 0;
    opacity: 0.2;
}

.payout-container:after {
    transform: rotatex(180deg);
}

.total-value:after {
    background: url(../img/card_design.svg);
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    content: "";
    position: absolute;
    width: 50px;
    height: 100%;
    top: 0;
    right: 50px;
    opacity: 0.2;
    transform: scale3d(3, 1, 1);
}


/* icons background colors */

.icon-holder {
    --_bg-color: var(--black-03, pink);
    width: 28px;
    height: 28px;
    background-color: var(--_bg-color);
    border-radius: 4px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.payout-view .icon-holder,
.wallet-view .icon-holder {
    width: 32px;
    height: 32px;
}

.wallet-view .icon-holder {
    --black-03: var(--nav-active);
}

.trans-view .icon-holder {
    --black-03: rgba(57, 50, 94, 0.41);
}

.success .icon-holder {
    --black-03: var(--nav-active);
}

.pending .icon-holder {
    --black-03: rgba(55, 50, 43, 1);
}

.fail .icon-holder {
    --black-03: rgba(52, 41, 41, 0.6);
}

.hold .icon-holder {
    --black-03: var(--hold-blue-half);
}


/* icons colors declaration */

.icon-holder i {
    --_color: var(--primary-color, green);
    color: var(--_color);
}

.wallet-view .icon-holder i {
    --primary-color: var(--theme-teal);
}

.success .icon-holder i {
    --primary-color: var(--success-green);
}

.pending .icon-holder i {
    --primary-color: var(--pending-yellow);
}

.fail .icon-holder i {
    --primary-color: var(--danger-red);
}

.hold .icon-holder i {
    --primary-color: var(--hold-blue);
}


/* box three components / transaction summary */

.four-box .four-box {
    background-color: var(--nav-bg);
    min-height: auto;
    padding: var(--border-radius-half);
}

.trans-view label {
    padding-left: .25rem;
}

span.compare {
    font-size: var(--font-size-12);
    font-weight: var(--fw-400);
    position: relative;
}

span.success span {
    --_color: var(--success-green, green);
    color: var(--_color);
    font-size: var(--font-size-12);
}

span.success.fail span {
    --success-green: var(--danger-red);
}


/* percentage color change / before class */

span.compare:before {
    --_before: var(--success-green, green);
    color: var(--_before);
    font-size: 14px;
    padding-right: .15rem;
}

span.compare.success:before {
    content: "\2197";
}

span.compare.fail:before {
    content: "\2199";
    --success-green: var(--danger-red);
}

img.user-img {
    border-radius: 50%;
    margin-right: .5rem;
}


/*==== Disbursement list ======*/

.disb-list-item {
    padding-top: var(--font-size-12);
    padding-bottom: var(--font-size-12);
    border-bottom: 1px solid var(--border-color);
    padding: var(--common-size);
}

.disb-list-item:hover {
    background-color: var(--table-header);
}

.disb-list-item:first-child {
    border-top: 1px solid var(--border-color);
}


/* icon default bg */

.disb-list-item .status .icon-holder {
    --_icon-bg: var(--nav-bg, darkgrey);
    background-color: var(--_icon-bg);
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: .5rem;
}


/* icon color default */

.disb-list-item .status .icon-holder i {
    --_icon-color: var(--primary-color, teal);
    color: var(--_icon-color);
    font-size: 14px;
    display: none;
}

.status.success .icon-holder i.bi-check {
    display: inline-block;
    font-size: 18px;
}

.status.pending .icon-holder i.bi-hourglass,
.status.hold .icon-holder i.bi-hourglass {
    display: inline-block;
}

.status.fail .icon-holder i.bi-x-square {
    display: inline-block;
}


/*==== icon bg and icon color begins here====*/


/* icon bg color for success */

.status.success .icon-holder {
    --nav-bg: var(--success-green-half);
}


/* icon color for success */

.status.success .icon-holder i {
    --primary-color: var(--theme-teal);
}


/* icon bg color for pending */

.status.pending .icon-holder {
    --nav-bg: var(--pending-yellow-half);
}


/* icon color for pending */

.status.pending .icon-holder i {
    --primary-color: var(--pending-yellow);
}


/* icon bg color for success */

.status.fail .icon-holder {
    --nav-bg: var(--danger-red-half);
}


/* icon color for success */

.status.fail .icon-holder i {
    --primary-color: var(--danger-red);
}


/* =====status color default==== */

.disb-list-item .status:after {
    --_status-color: var(--nav-bg, grey);
    font-size: var(--font-size-12);
    padding-left: .5rem;
    color: var(--_status-color);
}


/* status text for success */

.disb-list-item .success:after {
    content: "Success";
    --nav-bg: var(--success-green);
}


/* status text for pending */

.disb-list-item .pending:after {
    content: "Pending";
    --nav-bg: var(--pending-yellow);
}


/* status text for failed */

.disb-list-item .fail:after {
    content: "Failed";
    --nav-bg: var(--danger-red);
}


/* status text for pending */

.disb-list-item .hold:after {
    content: "Hold";
    --nav-bg: var(--hold-blue);
}


/* icon bg color for hold */

.status.hold .icon-holder {
    --nav-bg: var(--hold-blue-half);
}


/* icon color for hold */

.status.hold .icon-holder i {
    --primary-color: var(--hold-blue);
}

.disb-list-item span {
    padding-left: .25rem;
}

.disb-list-item span.user-name {
    color: var(--primary-color);
    text-transform: capitalize;
}


/* active and inactive badge */

.status-badge {
    --_badge-bg: var(--nav-bg, limegreen);
    --_badge-color: var(--primary-color, green);
    display: inline-block;
    padding: .325rem .75rem .325rem;
    border-radius: 8px;
    min-width: 75px;
    text-align: center;
    background-color: var(--_badge-bg);
    color: var(--_badge-color);
    line-height: normal;
}

.status-badge.active {
    --nav-bg: var(--success-green-half);
    --primary-color: var(--success-green);
}

.status-badge.inactive {
    --nav-bg: var(--danger-red-half);
    --primary-color: var(--danger-red);
}

.status-badge.pending {
    --nav-bg: var(--pending-yellow-half);
    --primary-color: var(--pending-yellow);
}

.status-badge.hold {
    --nav-bg: var(--hold-blue-half);
    --primary-color: var(--hold-blue);
}

.badge-variant {
    --_border-color: var(--nav-bg, gray);
    --_badge-color: var(--primary-color, white);
    background-color: transparent;
    border: 1px solid;
    border-color: var(--_border-color);
    color: var(--_badge-color);
    padding: .25rem .75rem !important;
}

.merchant-pending {
    background-image: url(../img/hourglass-03.svg);
    background-repeat: no-repeat;
    background-size: 16px;
    background-position: 8px;
    padding-left: 1.8rem !important;
}

.merchant-uploaded {
    background-image: url(../img/file-check-03.svg);
    background-repeat: no-repeat;
    background-size: 16px;
    background-position: 8px;
    padding-left: 1.8rem !important;
}

.badge-variant.success {
    --nav-bg: var(--success-green);
    --primary-color: var(--success-green);
}

.badge-variant.pending {
    --nav-bg: var(--pending-yellow);
    --primary-color: var(--pending-yellow);
    background-image: none;
}

.badge-variant.fail {
    --nav-bg: var(--danger-red);
    --primary-color: var(--danger-red);
}

.badge-variant.hold {
    --nav-bg: var(--hold-blue);
    --primary-color: var(--hold-blue);
}

.badge-variant.skip {
    --nav-bg: var(--skip-blue);
    --primary-color: var(--skip-blue);
}

.badge-variant.uploaded {
    --nav-bg: var(--pending-yellow);
    --primary-color: var(--pending-yellow);
}

.badge-variant.hold.merchant,
.badge-variant.skip,
.badge-variant.uploaded,
.badge-variant.rejected,
.badge-variant.success {
    border-radius: 48px !important;
}

.badge-variant:before {
    padding-right: .25rem;
    font-size: 17px;
    line-height: 0;
}

.badge-variant.success:before {
    content: "\2713";
}

.badge-variant.pending:before,
.badge-variant.skip:before {
    content: "\2022";
    font-size: 15px;
}

.badge-variant.fail:before {
    content: "\2715";
    font-size: 15px;
}

.bg-gray {
    background-color: var(--table-hover);
    padding: 1.25rem var(--common-size);
    border-radius: var(--border-radius-8);
    position: relative;
    z-index: 10;
}

.bg-gray::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -60px;
    transform: translateY(-50%);
    background: radial-gradient(35% 60% at 50% 50%, rgba(0, 237, 81, 0.18) 0%, rgba(0, 237, 123, 0) 100%);
    width: 20rem;
    height: 100%;
    border-radius: 50%;
    z-index: -1;
}

.icon-large {
    background-color: var(--btn-border);
    border-radius: 4px;
    padding: var(--border-radius-8);
    display: inline-block;
}

.icon-large i {
    font-size: 1.5rem;
}

.bg-gray-lines {
    position: absolute;
    right: 0;
}

.legal-heads h6 {
    min-height: 33px;
}


/*============ Dashboard ends here ============== */


/* arrow griddle animation */

.ico-circle {
    width: 35px;
    height: 35px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background-color: var(--btn-bg);
    border: 1px solid var(--btn-border);
    border-radius: 50%;
    position: relative;
    overflow: hidden;
}

.ico-circle i {
    display: inline-block;
    position: relative;
    z-index: 1;
    transition: none;
    color: var(--primary-color);
}

.ico-circle:hover i.bi-arrow-up-right {
    animation: arrow-glide 0.4s ease-out 1;
    color: var(--theme-green);
}


/* box two ends here*/


/* row two begins here / theme dark panel (card) style begins here / theme dark accordion */


/* .btn-outline-secondary {
  background-color: var(--bg-color);
} */

.card.bg-dark {
    background-color: var(--card-bg) !important;
    border-color: var(--border-color);
    border-radius: var(--border-radius);
    overflow: hidden;
}

.card.bg-dark.borderless {
    border: none;
}

.card.bg-dark .card-header {
    border-color: var(--border-color);
    border-bottom: none;
}

.card.bg-dark .card-body {
    background-color: var(--card-body-bg);
    border-bottom-left-radius: var(--border-radius);
    border-bottom-right-radius: var(--border-radius);
    min-height: 100px;
}

.card.bg-dark.top-radius .card-body {
    border-top-left-radius: var(--border-radius);
    border-top-right-radius: var(--border-radius);
}

.card.bg-dark .card-body.card-body-none {
    background-color: transparent;
}

.card-header h5 {
    color: var(--primary-color);
    font-size: var(--common-size);
    margin-bottom: 0.25rem;
    font-family: var(--inter);
    font-weight: var(--fw-400);
}

.card-header h5 i {
    color: var(--text-grey);
    font-size: 1.25rem;
    margin-right: 0.5rem;
}

.card-header,
.has-check {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.card-header.has-sub {
    align-items: flex-start !important;
    padding: 0;
    border-bottom: 1px solid var(--border-color) !important;
}

.card.bg-dark.border-radius-0 {
    border-radius: 0;
}

.data-chart-legends {
    background-color: var(--bg-color);
}

.data-chart-legends span.legend-item {
    color: var(--text-grey);
    padding-top: var(--common-size);
    padding-bottom: var(--common-size);
    flex: 1 1 0%;
    text-align: center;
    border-top: 1px solid var(--border-color);
}

.card-nav .btn {
    background-color: var(--btn-bg);
    color: var(--primary-color);
    border: 1px solid var(--btn-border);
    margin-right: 0.25rem;
}

.card-nav .btn.active {
    background-color: var(--primary-color);
    color: var(--btn-bg);
}

.card-nav .btn:hover {
    opacity: 0.7;
}

.card.bg-dark .btn-close {
    background-color: var(--btn-bg);
    opacity: 1;
    color: var(--primary-color);
    border: 1px solid;
    border-color: var(--btn-border);
    background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cline%20x1%3D%2218%22%20y1%3D%226%22%20x2%3D%226%22%20y2%3D%2218%22%3E%3C%2Fline%3E%3Cline%20x1%3D%226%22%20y1%3D%226%22%20x2%3D%2218%22%20y2%3D%2218%22%3E%3C%2Fline%3E%3C%2Fsvg%3E);
    background-size: 28px 28px;
}

.panel-plain {
    background-color: var(--card-body-bg);
    border: 1px solid var(--border-light);
    border-radius: var(--common-size);
    padding: 10px var(--common-size);
}

.card.bg-dark .btn-outline-back {
    border-color: var(--border-color);
}

.transaction-card .card-body {
    height: 650px;
}

.transaction-card .card-body:hover {
    overflow-y: scroll;
}


/* theme dark accordion begin here*/

.accordion-dark {
    display: flex;
    flex-direction: column;
    gap: 10px;
    overflow: hidden;
}

.accordion-dark .accordion-item {
    border: 1px solid var(--border-color);
    border-radius: 1rem;
    overflow: hidden;
    background-color: transparent;
}

.accordion-dark .accordion-item .accordion-header .accordion-button {
    background-color: var(--datepicker-bg);
    box-shadow: none;
    color: var(--primary-color);
    display: flex;
    padding: 0.75rem 1rem;
}

.accordion-dark .accordion-item .accordion-header .accordion-button.collapsed {
    background-color: var(--table-header);
}

.accordion-dark .accordion-button::after {
    background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%209l6%206%206-6%22%2F%3E%3C%2Fsvg%3E);
    /* border: 1px solid var(--btn-border); */
    background-size: 25px 25px;
    background-position: center center;
    border-radius: 0.15rem;
    /* padding: 12px;
  background-color: var(--btn-bg); */
}

.accordion-dark .accordion-button p {
    margin-bottom: 0;
    margin-top: 0.25rem;
}

.accordion-dark .accordion-body {
    background-color: var(--card-body-bg);
    color: var(--primary-color);
}


/*row two ends here */


/* pagination begins here */

.pagination-container .pagination li,
.pagination-container .pagination li a {
    background-color: transparent;
    border-color: var(--border-color);
    color: var(--primary-color);
}

.pagination-container .pagination li.active a {
    background-color: var(--btn-bg);
}

.pagination-container .pagination li.disabled a {
    color: var(--secondary-color);
}


/* pagination ends here */

select.bg-dark {
    background-color: transparent !important;
}


/*chart section begins here */

div#legend-container div:last-child {
    border-right: none;
}

div#legend-container>div {
    border-right: 1px solid var(--border-color);
}


/*chart section ends here*/


/* modal and related components begins here */

.modal-backdrop.show,
.offcanvas-backdrop.show {
    opacity: 0.8;
}


/* home dashboard tab section */

.my-custom-tab {
    background-color: var(--nav-bg);
    border-radius: var(--border-radius-8);
    padding: .25rem;
}

.my-custom-tab .nav-link {
    padding: .15rem .5rem;
}

.my-custom-tab .nav-link.active {
    background-color: var(--card-bg);
    border-radius: var(--border-radius-8);
}

.my-custom-tab .nav-link i {
    font-size: 1.25rem;
    color: var(--primary-color);
}

.my-custom-tab .nav-link.active i {
    color: var(--success-green);
}

.border-left {
    width: 1px;
    border-left: 1px solid var(--border-color);
}


/*dashboard ends here*/


/* Toast Customization starts */

.toast-container .toast {
    max-width: 350px;
}

.toast-container .toast .toast-body .bi-x-lg {
    cursor: pointer;
    padding: var(--border-radius-6) var(--border-radius-8);
    transition: background-color 0.3s ease;
    border-radius: 4px;
}

.toast-container .toast .toast-body .bi-x-lg:hover {
    background-color: var(--btn-border);
}

.toast-container .toast .toast-body .toast-success {
    flex: 0 0 32px;
    height: 32px;
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
}


/* Failed Toast */

.success-toast .toast-body .bi-check-lg {
    background-color: var(--success-green);
    border-radius: 50%;
    width: 20px;
    height: 20px;
}

.success-toast::before {
    content: "";
    position: absolute;
    top: 50%;
    left: -6%;
    transform: translateY(-50%);
    background: radial-gradient(50% 50% at 50% 50%, rgba(0, 237, 81, 0.12) 0%, rgba(0, 237, 123, 0) 100%);
    width: 100px;
    height: 100px;
    border-radius: 50%;
}


/* Failed Toast */

.failed-toast .toast-body .bi-check-lg {
    background-color: var(--danger-red);
    border-radius: 50%;
    width: 20px;
    height: 20px;
}

.failed-toast .toast-body .bi-check-lg::before,
.success-toast .toast-body .bi-check-lg::before {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.failed-toast::before {
    content: "";
    position: absolute;
    top: 50%;
    left: -6%;
    transform: translateY(-50%);
    background: radial-gradient(50% 50% at 50% 50%, rgba(240, 66, 72, 0.13) 0%, rgba(240, 66, 72, 0) 100%);
    width: 100px;
    height: 100px;
    border-radius: 50%;
}


/* Toast Customization ends */


/* Cards Background starts */

.payouts_headCards .payouts_cards {
    border-radius: var(--border-radius-8);
    background-color: #111 !important;
}

.payouts_cards {
    flex: 1 0 0;
    position: relative;
    background-color: #111;
}

.payouts_cards::after {
    background: url(../img/card_design.svg);
    background-position: right;
    background-size: cover;
    background-repeat: no-repeat;
    content: "";
    position: absolute;
    width: 60px;
    height: 100%;
    top: 0;
    right: 0;
    opacity: 0.3;
}

.merchant-dropdown-options li[data-value=select_all] {
    border-bottom: 1px solid var(--nav-bg);
}

.dashboard-icon .disb-list-item:last-child {
    border-bottom: none;
}


/* Cards Background ends */


/* Common Table filter starts */


/* .table_filter {
  padding: 1rem;
} */

.table_filter .refresh_btn {
    width: 32px;
    height: 32px;
    border-color: var(--border-color);
}

.table_filter .refresh_btn:hover,
.table_filter .export_btn:hover,
.table_filter .datepicker.btn-outline-secondary:hover {
    background-color: var(--btn-bg) !important;
}

.table_filter .datepicker.btn-outline-secondary:focus,
.table_filter .datepicker.btn-outline-secondary:active,
.table_filter .datepicker.btn-outline-secondary:target {
    background-color: var(--btn-bg) !important;
    border: 1px solid var(--btn-border);
}

.table_filter .export_btn {
    height: 32px;
    font-size: var(--font-size-14);
    border-color: var(--border-color);
}

.Payout_table .card-nav .btn.active {
    background-color: var(--btn-bg);
    color: var(--primary-color);
    border: 1px solid var(--btn-border);
}

.table_filter .refresh_btn i {
    font-size: var(--font-size-18);
    transform: rotate(310deg);
}

.table_filter .table_search .bi-search {
    position: absolute;
    top: 9px;
    left: 10px;
    color: var(--primary-color);
}

.table_filter .table_search .btn {
    position: absolute;
    top: 0px;
    right: 36px;
    color: var(--primary-color);
    height: 22px;
    margin: 4px 10px 0 0;
    padding: 0px 10px 0 0;
}

.table_filter .table_search .seprator-right {
    border-right: #7D7D7D 1px solid;
    border-radius: 0;
    /* position: absolute;
  
  margin: 2px 1px 4px 0;
     padding: 0 10px 0 0;
 
vertical-align: middle;
  top: 0px;
  right: 36px !important; */
}

.table_filter .table_search .srh-btn {
    position: absolute;
    top: 0px;
    right: 4px !important;
    color: var(--primary-color);
    height: 24px;
    padding: 0px 2px;
    background: var(--btn-success);
    margin: 4px 0;
    width: 32px;
}

.table_filter .table_search input {
    height: 32px;
    width: 304px;
    padding: 0 20px 0 35px;
    font-size: var(--font-size-14);
    background-color: var(--nav-active) !important;
    border-radius: var(--border-radius-6);
    color: var(--primary-color);
}

.table_filter .table_search input:focus {
    border: 1px solid var(--focus-state);
}

.table_filter .datepicker {
    padding: 7px 25px 7px 0.75rem;
}

.table_filter .datepicker.btn-outline-secondary {
    background-color: var(--bg-color) !important;
    border: 1px solid var(--border-color);
}

.table_filter .datepicker::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    background-image: url(../img/chevron-down.png);
    background-repeat: no-repeat;
    width: 18px;
    height: 9px;
}

.table_filter .datepicker .daterange-value {
    font-size: var(--font-size-12);
}

.table_filter .border-end {
    height: 32px;
}


/* Table filter ends */


/* =========================================== */


/* Login starts */

.login-wrapper {
    height: 100vh;
    gap: 20px;
    width: 1400px;
    margin: auto;
}

.login-body {
    width: 600px;
    margin: 0 auto;
    background-color: var(--card-bg);
    padding: 45px;
    gap: 20px;
}

.login-body h4 {
    font-size: var(--font-size-24);
    text-transform: none;
}

.login-subhead {
    font-size: var(--font-size-20);
}

.login-wrapper .login-body {
    border-radius: var(--font-size-20);
    background-color: var(--login-bg) !important;
}

.login-form label {
    font-size: var(--font-size-14);
}


/* .login-form button {
  font-size: var(--font-size-20);
} */

.login-form button {
    height: 46px;
}

.login-form .backtologin {
    text-decoration: none;
    display: block;
    text-align: center;
    color: var(--datepicker-active);
    font-size: var(--common-size);
}

.corner-radius {
    border-radius: 4px;
}

.btn-google-signup {
    background-color: var(--google-sigin-btn);
    color: var(--primary-color);
    transition: opacity 0.3s ease;
    padding: 7px 0;
    font-size: var(--font-size-20);
}

.btn-google-signup:hover {
    background-color: var(--google-sigin-btn);
    color: var(--primary-color);
    opacity: 0.7;
}

.btn-green {
    background-color: var(--border-green);
    color: var(--primary-color);
}

.line-through-text {
    display: flex;
    align-items: center;
    text-align: center;
}

.line-through-text::before,
.line-through-text::after {
    content: "";
    flex: 1;
    border-bottom: 1px solid var(--border-light);
    opacity: 0.5;
}

.line-through-text span {
    padding: 0 10px;
    font-size: var(--font-size-14);
}

.navigate-signin {
    text-decoration: none;
    color: var(--border-green);
}

.login-wrapper.card {
    border-radius: 8px !important;
}

.login-main-wrapper .login-body {
    margin: auto;
}

.login-main-wrapper .login-header .btn-success {
    width: 120px;
    background-color: var(--bg-color);
    color: var(--border-green);
}

.login-main-wrapper .login-header .btn-success:hover {
    background-color: var(--border-green);
    color: var(--primary-color);
}

.login-bg::before {
    background: url(../img/bg-login.png);
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0.5;
}

.login-footer span,
.login-footer span a {
    font-size: var(--font-size-20);
}

.forgotpassword-navigator {
    position: absolute;
    top: 5px;
    right: 0;
    text-decoration: none;
    color: var(--datepicker-active);
    transition: opacity 0.3s ease;
}

.forgotpassword-navigator:hover {
    color: var(--datepicker-active);
    opacity: 0.7;
}

.login-form .form-control {
    height: 42px;
}

.fielderror-validation {
    background-color: var(--danger-red-half);
    padding: var(--font-size-12);
    border-radius: var(--border-radius-6);
}

.fielderror-validation .bi-exclamation-circle-fill {
    color: var(--danger-red);
    font-size: var(--common-size);
}

.fielderror-validation span {
    color: #FF8888;
}


/* Login ends */


/* setpassword by(john) starts*/

.password-criteria {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 10px;
}

.criteria-item {
    background-color: #444;
    color: #aaa;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.criteria-item.text-danger {
    color: #aaa !important;
}


/* When criteria are met: green */

.criteria-item.text-success {
    background-color: var(--success-green);
    /* Green background */
    color: #375721 !important;
    /* Light green text */
}

.criteria-item i {
    margin-right: 5px;
}

.criteria-item i.bi-check-circle-fill::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 12px;
    width: 8px;
    height: 8px;
    background-color: var(--text-grey);
    border-radius: 50%;
    transform: translateY(-50%);
}

.criteria-item.text-success i.bi-check-circle-fill::after {
    visibility: hidden;
}

.criteria-item i.bi-check-circle-fill::before {
    visibility: hidden;
}

.criteria-item.text-success i.bi-check-circle-fill::before {
    visibility: visible;
}

.show-toggle {
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
    cursor: pointer;
    font-size: 1.2rem;
    color: #aaa;
    z-index: 10;
}

.was-validated .form-control:valid,
.form-control.is-valid,
.was-validated .form-control:invalid,
.form-control.is-invalid {
    background-image: none !important;
    padding-right: 0.75rem;
    background-repeat: no-repeat;
}

.reset-description {
    font-size: var(--common-size);
    color: var(--text-grey);
}

.backtologin {
    display: block;
    text-align: center;
}

.havntReceived {
    color: var(--text-grey);
    display: block;
    font-size: var(--font-size-14);
}

.havntReceived a {
    font-size: var(--font-size-14);
    color: var(--datepicker-active);
}


/* setpassword  by(john) ends  */


/* otp-verification box containers starts here... */

.otp-box .input-group .form-control {
    height: 48px;
    /* border: 1px solid #444; */
    padding: 6px var(--border-radius-8);
    background-color: #111;
    color: #fff;
    box-sizing: border-box;
    outline: none;
    transition: border 0.2s ease-in-out;
    border-radius: var(--border-radius-8) !important;
}

.arrow-icon {
    font-size: 20px;
    width: 20px;
    height: 20px;
    display: inline-block;
}

.otp-input {
    width: 62.5px;
    height: 48px;
    font-size: 1.25rem;
    border-radius: 8px;
    text-align: center;
}


/* 
.otp-input:focus {
  border-color: #02a283;
  box-shadow: none;
  background-color: #1a1a1a;
}
.otp-help-text {
  display: block;
  width: 470px;
  height: 24px;
  line-height: 24px;
  text-align: left;
} */


/* otp-verification box containers starts here... */


/* Single date picker starts*/

.payout_modal .modal-body .bi-calendar4-week {
    position: absolute;
    top: 50%;
    right: var(--common-size);
    transform: translateY(-50%);
    pointer-events: none;
    color: var(--bs-gray-400);
    font-size: var(--common-size);
}

.payout_modal .modal-body .daterangepicker select.monthselect,
.daterangepicker select.yearselect,
.daterangepicker select.monthselect {
    border: none;
    background-color: var(--bg-color);
    border-radius: 3px;
    font-size: var(--font-size-14);
    color: var(--primary-color);
}


/* Single date picker ends */


/* Offcanvas customization starts */

.offcanvas {
    width: 480px !important;
}

.payout_offcanvas .offcanvas-header .btn-close {
    background-color: transparent;
    border: none;
}

.payout_offcanvas .offcanvas-body .copy_btn {
    position: relative;
}

.payout_offcanvas .offcanvas-body .copy_btn button {
    background-color: var(--btn-bg);
    padding: 3px 5px;
}

.payout_offcanvas .offcanvas-body .copy_btn button i {
    font-size: var(--font-size-12);
}

.payout_offcanvas .offcanvas-body .details-customer-card {
    background-color: var(--table-header);
    padding: var(--font-size-12);
    height: 100%;
}

.payout_offcanvas .offcanvas-body .details-customer-card div span {
    font-size: var(--font-size-12);
}

.payout_offcanvas .offcanvas-body .details-customer-card div span:nth-child(1) {
    color: var(--table-td);
}

.payout_offcanvas .offcanvas-body .transaction_id {
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-6);
}

.payout_offcanvas .offcanvas-body .transaction_id .copy_btn button .bi-copy {
    font-size: var(--font-size-12);
}

.payout_offcanvas .offcanvas-body .merchant-tag {
    display: inline-block;
    font-size: var(--font-size-12);
    border: 1px solid var(--border-color);
    padding: var(--border-radius-6);
    border-radius: var(--border-radius-6);
}

.offcanvas.card.bg-dark .card.bg-dark {
    border: none;
}

.modal-custom-title {
    --_bg-custom: var(--nav-bg, orange);
    background-color: var(--_bg-custom);
    border-radius: var(--border-radius-6);
    color: var(--primary-color);
}

.modal-custom-title span {
    --_custom-color: var(--primary-color, white);
    color: var(--_custom-color);
}

.modal-custom-title.success {
    --nav-bg: var(--success-green-half);
}

.modal-custom-title.success span {
    --primary-color: var(--success-green);
}

.modal-custom-title.success i {
    color: var(--success-green);
}

.modal-custom-title.pending {
    --nav-bg: var(--pending-yellow-half);
}

.modal-custom-title.pending span {
    --primary-color: var(--pending-yellow);
}

.modal-custom-title.pending i {
    color: var(--pending-yellow);
}

.modal-custom-title.fail {
    --nav-bg: var(--danger-red-half);
}

.modal-custom-title.fail i {
    color: var(--danger-red);
}

.modal-custom-title.fail span {
    --primary-color: var(--danger-red);
}

.modal-custom-title.hold {
    --nav-bg: var(--hold-blue-half);
}

.modal-custom-title.hold i {
    color: var(--hold-blue);
}

.modal-custom-title.hold span {
    --primary-color: var(--hold-blue);
}


/* Offcanvas customization ends */


/* Select 2 customization */

.select2-container--default .select2-dropdown {
    background-color: #232323;
    border: 1px solid #313131;
    border-radius: 8px;
    box-shadow: 0px 0px 8px #1d1d1d;
    width: 468px !important;
    padding: 8px;
}


/* .select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: var(--primary-color) !important;
} */


/*------------------------------- css for select2 (by john)---------------------------------*/

.merchant-dropdown-container {
    position: relative;
    font-size: 14px;
}

.merchant-dropdown-toggle {
    padding: 0.75rem 2rem 0.75rem 1rem !important;
    max-height: 200px;
    overflow-y: auto;
}

.merchant-dropdown-toggle {
    min-height: 46px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border: 1px solid var(--border-color);
    border-radius: 4px;
    background-color: transparent;
    cursor: pointer;
}

.merchant-dropdown-value {
    flex: 1;
    color: #ccc;
}

.dropdown-arrow {
    color: #999;
    margin-left: 8px;
}

.merchant-dropdown-menu {
    position: absolute;
    bottom: 100%;
    left: 0;
    margin-top: 6px;
    width: 100%;
    background: #232323;
    border: 1px solid #444;
    border-radius: 6px;
    display: none;
    padding: 10px;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.4);
    z-index: 1050;
}

.merchant-dropdown-container.open .merchant-dropdown-menu {
    display: block;
}

.merchant-search-wrapper {
    position: relative;
    margin-bottom: 10px;
}

.merchant-dropdown-search {
    width: 100%;
    padding: 0.5rem 0.75rem 0.5rem 2.25rem;
    border: none;
    border-radius: 6px;
    background-color: #1e1e1e;
    color: #fff;
}


/* .merchant-dropdown-toggle.form-control.form-select {
  color: var(--secondary-color) !important;
} */

img#currentProfileImage {
    outline: 1px solid var(--bs-gray-900);
}

.navigation .has-submenu img.user-img {
    outline: 1px solid var(--border-color);
}

.search-icon {
    position: absolute;
    top: 50%;
    left: 10px;
    transform: translateY(-50%);
    color: #aaa;
}

.merchant-dropdown-options {
    list-style: none;
    padding: 0;
    margin: 0;
    max-height: 200px;
    overflow-y: auto;
}

.merchant-dropdown-options li {
    padding: 8px;
    border-radius: 4px;
    color: #fff;
    display: flex !important;
    align-items: center;
}

.merchant-dropdown-options li:hover {
    background-color: #3a3a3a;
}

.merchant-dropdown-options input[type="checkbox"] {
    margin-right: 8px;
    accent-color: #02a283;
    width: var(--common-size);
    height: var(--common-size);
}

.merchant-dropdown-options li input[type="checkbox"] {
    border: 1px solid var(--secondary-color);
}

.merchant-dropdown-options li input[type="checkbox"]:checked {
    border: 1px solid #02a283;
}


/* .merchant-dropdown-options li input[type="checkbox"]:checked{
  border-color:#02a283;
  background-color: #0E312B;
} */

.merchant-dropdown-options li input[type="checkbox"]:checked:before {
    /* border: solid #02a283; */
    border-width: 0 2px 2px 0;
    margin: -1px -1px 0 -1px;
    height: 9px;
    width: 5px;
}

.merchant-tags-container {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.merchant-tag {
    background-color: #535353;
    color: var(--primary-color);
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 13px;
    display: flex;
    align-items: center;
}

.merchant-tag .remove-tag {
    margin-left: 6px;
    cursor: pointer;
    font-size: 14px;
    color: #ccc;
}

.merchant-tag .remove-tag:hover {
    color: #fff;
}


/* roles select  css  */


/* Container */

.role-dropdown-container {
    position: relative;
    width: 100%;
    color: #fff;
    font-size: var(--font-size-14);
}


/* Toggle */

.role-dropdown-toggle {
    padding: 0.75rem var(--common-size);
    background-color: transparent;
    border: 1px solid var(--border-color);
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: var(--font-size-14);
}

.role-dropdown-toggle,
.merchant-dropdown-toggle {
    appearance: none;
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 1.25rem 1.25rem;
    color: var(--secondary-color) !important;
    background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%209l6%206%206-6%22%2F%3E%3C%2Fsvg%3E) !important;
}

.role-dropdown-value {
    color: var(--secondary-color);
    transition: color 0.2s ease;
}

.role-dropdown-value.selected {
    color: var(--primary-color);
}

.role-dropdown-options li.selected {
    color: var(--primary-color);
    font-weight: 600;
}


/* Menu */

.role-dropdown-menu {
    display: none;
    position: absolute;
    width: 100%;
    top: 100%;
    z-index: 10;
    background-color: #1f1f1f;
    border: 1px solid #444;
    border-radius: 0 0 6px 6px;
    margin-top: 2px;
    overflow: hidden;
}

.role-dropdown-container.open .role-dropdown-menu {
    display: block;
}


/* Search */

.role-dropdown-search-wrapper {
    position: relative;
    border-bottom: 1px solid #333;
}

.role-dropdown-search {
    width: 100%;
    padding: 0.5rem 0.75rem 0.5rem 2.25rem;
    /* Increased from 2rem to 2.25rem */
    background-color: transparent;
    color: #fff;
    border: none;
    outline: none;
}

.search-icon {
    position: absolute;
    top: 50%;
    left: 0.75rem;
    transform: translateY(-50%);
    color: #aaa;
    font-size: 1rem;
    pointer-events: none;
    /* ensures click goes to input */
}


/* Options */

.role-dropdown-options {
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: 160px;
    overflow-y: auto;
}

.role-dropdown-options li {
    position: relative;
    padding: 0.5rem 0.75rem;
    padding-right: 2rem;
    background-color: transparent;
    cursor: pointer;
    transition: background 0.2s ease;
}

.role-dropdown-options li span :visited {
    color: var(--primary-color);
}

.role-dropdown-options li:hover {
    background-color: #2e2e2e;
}


/* Check icon inside selected option */

.role-dropdown-options li .check-icon {
    position: absolute;
    right: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    color: #3dd36b;
    font-size: 1rem;
    display: none;
}

.role-dropdown-options li.active .check-icon {
    display: inline;
}


/*============= role and access page ================ */

.card.bg-dark.card-plain {
    border: none;
    background-color: transparent !important;
}

.card.card-plain table.table.table-dark th {
    background-color: transparent;
}

.card.card-plain table.table.table-dark tbody tr {
    border: 1px solid;
    border-color: var(--border-color);
}

.card.card-plain table.table.table-dark td {
    background-color: var(--table-header);
    border: none;
}

.card.card-plain .d-print-none.table-responsive {
    display: none;
}

.card.card.card-plain .status_tab_content {
    overflow-x: hidden;
}

table.table.table-dark td .btn-link {
    background-color: var(--nav-active);
    display: inline-block;
    color: var(--primary-color);
    text-decoration: none;
}

table.table.table-dark .btn-link:hover {
    opacity: 0.7;
}

table.table.table-dark td .dropdown {
    display: inline-block;
    margin-left: 1.5rem;
}

table.table.table-dark td .dropdown .dropdown-item:hover {
    background-color: var(--secondary-color);
}

.bookmarks {
    border-bottom: 1px solid var(--border-color);
}

.bookmarks a {
    color: var(--secondary-color);
}

.bookmarks a:hover {
    color: var(--theme-green);
}

.bookmarks a.active {
    border-bottom: 1px solid;
    border-color: var(--theme-green);
    color: var(--primary-color);
}

.row-data label {
    color: var(--primary-color);
    font-size: 1rem;
}

.row-data label+span {
    display: block;
}

.permission-list .col-4 {
    display: flex;
    align-items: start;
}


/* merchant changes / 7 july modified */

.Merchant-details-document .col,
.Merchant-details-brief .col-3.pt-3 .view-documents {
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-8);
    margin-bottom: 1.25rem;
}

.Merchant-details-document .view-documents .btn {
    padding: 0;
}

.view-documents span i {
    font-size: var(--common-size) !important;
    color: var(--secondary-color);
    margin-right: .25rem;
}

.view-documents span span.text-secondary {
    display: block;
}


/* merchant module updated design begins here*/

.merchant-control {
    margin-right: 1rem;
    height: 95vh;
}

.merchant-control .main-content {
    overflow-y: auto;
}

.reupload>.navigatio-pills {
    margin-top: 1rem;
}

.merchant-control .form-select,
.merchant-control .form-control {
    background-color: transparent;
    border-color: var(--border-color);
    height: 47px;
    color: var(--primary-color) !important;
}

.merchant-control .form-select {
    background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%209l6%206%206-6%22%2F%3E%3C%2Fsvg%3E);
    background-size: 18px;
}

.merchant-control .form-select:focus {
    outline: 1px solid var(--secondary-color);
}

.merchant-control .card .page-title h6 {
    margin-bottom: 0;
}

.legal-items .col-3:nth-child(5),
.legal-items .col-3:last-child,
#ownerShip .card .row .col-3:last-child,
#companyStructureDocument .card .row .col-3:last-child {
    margin-top: 1rem;
}

.uploaded-file-box .text-white i {
    font-size: 1.25rem;
    color: var(--secondary-color);
}

.uploaded-file-box small.file-size,
.uploaded-file-box small.file-size+div {
    padding-left: 2.15rem;
    display: flex;
}


/* hold badge*/

.hold-blue {
    background-color: #235097;
    font-size: 12px;
}

.hold-purple {
    background-color: #6448CE;
    font-size: 12px;
}


/* media queries */


/* @media (min-resolution: 1.25dppx) {
  html {
    font-size: 0.813rem;
  }
} */

@media (min-width:1600px){
    .merchant-control .uploaded-file-box span.file-name{
        max-width: 180px;
    }
}


/* edit icon */

.edit-icon {
    position: absolute;
    bottom: 0;
    right: 0;
    background-color: #2A2929;
    color: white;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 10px;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.4);
    border: 1px solid #313030;
    cursor: pointer;
    transition: background-color 0.2s;
}

.edit-icon:hover {
    background-color: #414141;
}


/* add virtual account modal picture box */

.image-placeholder-box {
    width: 100%;
    height: 21.211rem;
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
    gap: 1.25rem;
    background-color: #222222;
    border-radius: 0.625rem;
    opacity: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 0.125rem solid #555;
    overflow: hidden;
}

.w-50 {
    width: 15.078rem !important;
}


/* Base slider appearance reset */

.custom-teal-slider {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 0.25rem;
    background: #313030;
    border-radius: 0.125rem;
    outline: none;
    opacity: 1;
    transition: background 0.3s ease;
}


/* Track styling */

.custom-teal-slider::-webkit-slider-runnable-track {
    height: 0.25rem;
    background: #313030;
    border-radius: 0.125rem;
}

.custom-teal-slider::-moz-range-track {
    height: 0.25rem;
    background: #313030;
    border-radius: 0.125rem;
}


/* Thumb styling (circle handle) */

.custom-teal-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 0.938rem;
    height: 0.938rem;
    border-radius: 50%;
    background-color: #44B39E;
    border: 1px solid #ffffffcc;
    cursor: pointer;
    box-shadow: 0 0 0.125rem rgba(0, 0, 0, 0.3);
    margin-top: -0.25rem;
}

.custom-teal-slider::-moz-range-thumb {
    width: 0.75rem;
    height: 0.75rem;
    border-radius: 50%;
    background-color: #44B39E;
    border: 0.063rem solid #ffffffcc;
    cursor: pointer;
    box-shadow: 0 0 0.125rem rgba(0, 0, 0, 0.3);
}


/* Wrapper styles for both icons */

.slider-icon-left,
.slider-icon-right {
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0.5;
}

.slider-icon-left i:before {
    font-size: 0.688rem;
}

.slider-icon-right i:before {
    font-size: 0.875rem;
}


/* Common icon styles inside wrapper */

.slider-icon-left i,
.slider-icon-right i {
    display: block;
    opacity: 1;
    border-width: 0.063rem;
}


/* Rounded cropper mask */

.cropper-crop-box,
.cropper-view-box,
.cropper-face {
    border-radius: 50% !important;
}

.cropper-view-box {
    outline: 2px solid #fff !important;
    outline-color: #fff !important;
}


/* Remove grid/lines */

.cropper-line,
.cropper-point {
    display: none !important;
}

#zoomSlider {
    width: 100%;
    height: 6px;
    appearance: none;
    border-radius: 5px;
    background: #66CDB8;
    outline: none;
}

#zoomSlider::-webkit-slider-thumb {
    appearance: none;
    height: 16px;
    width: 16px;
    background: #66CDB8;
    border: 2px solid #66CDB8;
    border-radius: 50%;
    cursor: pointer;
    margin-top: -5px;
}

#zoomSlider::-moz-range-thumb {
    height: 16px;
    width: 16px;
    background: #66CDB8;
    border: 2px solid #66CDB8;
    border-radius: 50%;
    cursor: pointer;
}

.btn-dash-addmerchant {
    position: relative;
    z-index: 6;
}

div.dashboard-icon .bg-gray-lines {
    z-index: 2;
}

div#reportrange,
div#ExportLogsreportrange {
    min-width: 135px;
    text-align: left;
    min-height: 32px;
}

#reportrange.active {
    background-color: var(--btn-bg) !important;
    border: 1px solid var(--btn-border) !important;
}

.wallet-Merchanttable-search .table_search .bi-search {
    top: 5px;
}

#tab-standard .table_filter .table_search .btn {
    right: 0px;
    margin: 5px 0 0;
}

#tab-standard .table_filter .table_search input {
    padding-right: 35px;
}