/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

.error {
    color: red;
}

.auth-minimal-wrapper {
    background: #f76d31;
    background: linear-gradient(135deg, #f76d31, #f9c5a4);
}

.eye-icon {
    top: 53%;
}
.eye-icon-error {
    top: 40% !important;
}

.is-invalid {
    background-image: none !important;
}

.table-responsive .table thead th {
    background-color: #f8f9fa !important;
    border-top: 1px solid #e5e7eb;
    position: relative;
}

.table-responsive .table thead th:before{
    content:"\f0de";
    position:absolute;
    font-family:var(--fa-style-family, "Font Awesome 6 Free");
    right:0;
    top: 4px;
    font-size:16px;
    color:#ddd
}
.table-responsive .table thead th:after{
    content:"\f0dd";
    position:absolute;
    font-family:var(--fa-style-family, "Font Awesome 6 Free");
    right:0;
    bottom: 1px;
    font-size:16px;
    color:#ddd;
}

 
.table-responsive .table thead th .fa.fa-sort-up {
    position: absolute;
    right: 0;
    top: 7px;
    z-index:2
}

.table-responsive .table thead th .fa-sort-down {
    position: absolute;
    right: 0;
    bottom: 7px;
    z-index:2;
}

.table-responsive .table thead th:last-child:before,
.table-responsive .table thead th:last-child:after{display:none;}
 


/* .table-responsive .table tbody tr:last-child *:not(.action_btn_link a) {
    border-bottom: 1px solid #e5e7eb;
} */
.pagination {
    margin-left: 15px;
}

.pagination .page-item {
    margin: 3px;
}

.pagination .page-item .page-link {
    padding: 6px;
    display: inline-block;
    width: 38px;
    height: 38px;
    text-align: center;
    border-radius: 4px;
    color: #000;
}

.pagination .page-item.active .page-link {
    color: #fff;
}

.pagination .page-item.active .page-link,
.pagination .page-item .page-link:hover {
    background: #3454d1;
    border-color: #3454d1;
    color: #fff;
}

.action_btn_link a {
    display: inline-flex;
    margin: 5px;
    width: 36px;
    height: 36px;
    background: #e7e7e7;
    align-items: center;
    justify-content: center;
    border-radius: 100px;
}

.action_btn_link a:hover {
    color: inherit;
}


.profile_info_circle > a {
    display: inline-block;
    width: 50px;
    height: 50px;
    overflow: hidden;
    border-radius: 100px;
}

.profile_info_circle > a img {
    width: 100%!important;
    height: 100%;
    object-fit: cover;
}
.profile_pic_md_circle {
    width: 100px;
    height: 100px;
    border-radius: 100%;
    overflow: hidden;
}

.profile_pic_md_circle img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.form-switch .form-check-input {
    width: 40px;
    height: 24px;
    margin-right: 10px;
}
 
.form-switch label.form-check-label {
    padding-top: 7px;
}
.app-skin-dark .form-switch .form-check-input:checked {border-color: #3454d1;background-color: #3454d1!important;}
html.app-skin-dark .nxl-navigation .m-header .logo-lg {
    filter: none;
}
html.app-skin-dark .action_btn_link a {
    background-color: #28334c !important;
}
html.app-skin-dark .pagination .page-item .page-link {
    background-color: #28334c !important;
    color: #fff;
}
html.app-skin-dark .table-responsive .table thead th {
    background-color: #1b2436 !important ;
    color: #fff !important;
    border-color: #1b2436 !important;
}


html.app-skin-dark .pagination .page-item.active .page-link{border-color:#fff; background-color:#3454d1!important;}

/* Staff / User listing (Figma-style) */
.user-listing-card .card { border-radius: 12px; overflow: hidden; box-shadow: 0 1px 3px rgba(0,0,0,.06); }
.user-listing-toolbar { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 20px; padding: 20px; background: #fff; border-bottom: 1px solid #e5e7eb; }
.user-listing-toolbar .search-wrap { flex: 1; min-width: 200px; max-width: 400px; }
.user-listing-toolbar .search-wrap input { border-radius: 8px; border: 1px solid #e5e7eb; padding: 10px 14px; width: 100%; font-size: 0.95rem; }
.user-listing-toolbar .filter-stack { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.user-listing-toolbar .filter-row { display: flex; align-items: center; gap: 8px; }
.user-listing-toolbar .filter-stack .form-control,
.user-listing-toolbar .filter-stack .form-select { border-radius: 8px; border: 1px solid #e5e7eb; padding: 8px 12px; font-size: 0.9rem; min-width: 140px; }
.user-listing-toolbar .filter-stack .form-control.date-input { min-width: 140px; }
.user-listing-toolbar .filter-stack .to-label { font-size: 0.875rem; color: #64748b; margin: 0; }
.user-listing-toolbar .btn-reset { background: #e5e7eb; border: 1px solid #d1d5db; color: #475569; border-radius: 8px; padding: 8px 14px; font-size: 0.75rem; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; }
.user-listing-toolbar .btn-reset:hover { background: #d1d5db; color: #334155; border-color: #9ca3af; }
/* Horizontal filter row: Date | Status | Search | RESET FILTERS (blue) */
.filter-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; padding: 16px 20px; background: #fff; border-bottom: 1px solid #e5e7eb; border-radius: 0; }
.filter-bar .filter-item { display: flex; align-items: center; gap: 8px; }
.filter-bar .filter-item label { margin: 0; font-size: 0.9rem; color: #374151; white-space: nowrap; }
.filter-bar .form-control, .filter-bar .form-select { border: 1px solid #e5e7eb; border-radius: 8px; padding: 8px 12px; font-size: 0.9rem; min-width: 120px; }
.filter-bar .filter-item.to-text { color: #6b7280; font-size: 0.9rem; }
.filter-bar .btn-reset-filters { background: #2563eb; color: #fff; border: none; border-radius: 8px; padding: 8px 16px; font-size: 0.75rem; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; margin-left: auto; }
.filter-bar .btn-reset-filters:hover { background: #1d4ed8; color: #fff; }
.filter-bar .input-group-date { display: flex; align-items: center; border: 1px solid #e5e7eb; border-radius: 8px; background: #fff; }
.filter-bar .input-group-date input { border: none; border-radius: 8px; padding: 8px 12px; min-width: 130px; }
.filter-bar .input-group-date .input-group-text { border: none; background: transparent; color: #6b7280; padding-right: 10px; }
.user-listing-table .table { margin-bottom: 0; }
.user-listing-table .table thead th { font-weight: 600; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.05em; color: #64748b; padding: 14px 16px; border-bottom: 1px solid #e5e7eb; background: #f8fafc; }
.user-listing-table .table tbody td { padding: 14px 16px; vertical-align: middle; border-bottom: 1px solid #f1f5f9; }
.user-listing-table .table tbody tr:hover { background: #fafafa; }
.user-listing-avatar { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.user-listing-avatar-initials { width: 40px; height: 40px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: 600; font-size: 0.95rem; color: #fff; background: linear-gradient(135deg, #6366f1, #8b5cf6); flex-shrink: 0; }
.user-listing-user { display: flex; align-items: center; gap: 12px; }
.user-listing-user .name { font-weight: 600; color: #1e293b; }
.user-listing-user .email { font-size: 0.85rem; color: #64748b; }
.user-listing-status { display: inline-block; padding: 4px 10px; border-radius: 9999px; font-size: 0.75rem; font-weight: 500; }
.user-listing-status.active { background: #dcfce7; color: #166534; }
.user-listing-status.inactive { background: #f1f5f9; color: #64748b; }
.user-listing-table .action_btn_link a { margin: 2px; width: 34px; height: 34px; font-size: 0.9rem; }
.user-listing-footer { padding: 14px 20px; border-top: 1px solid #e5e7eb; background: #fafafa; font-size: 0.875rem; color: #64748b; }

/* User listing date picker icon */
.user-listing-toolbar .input-group-date { display: flex; align-items: center; border: 1px solid #e5e7eb; border-radius: 8px; background: #fff; }
.user-listing-toolbar .input-group-date input { border: none; border-radius: 8px; padding: 8px 12px; min-width: 130px; }
.user-listing-toolbar .input-group-date .input-group-text { border: none; background: transparent; color: #64748b; padding-right: 10px; }
html.app-skin-dark .user-listing-toolbar .input-group-date { border-color: #28334c; background: #28334c; }
html.app-skin-dark .user-listing-toolbar .input-group-date input { background: transparent; color: #e2e8f0; }

/* Dark skin */
html.app-skin-dark .user-listing-toolbar { background: #1b2436; border-color: #28334c; }
html.app-skin-dark .user-listing-toolbar .form-control,
html.app-skin-dark .user-listing-toolbar .form-select { background: #28334c; border-color: #28334c; color: #e2e8f0; }
html.app-skin-dark .user-listing-toolbar .btn-reset { background: #374151; border-color: #4b5563; color: #9ca3af; }
html.app-skin-dark .user-listing-toolbar .btn-reset:hover { background: #4b5563; color: #e2e8f0; }
html.app-skin-dark .user-listing-table .table thead th { background: #1b2436 !important; border-color: #28334c; }
html.app-skin-dark .user-listing-table .table tbody td { border-color: #28334c; }
html.app-skin-dark .user-listing-table .table tbody tr:hover { background: #28334c; }
html.app-skin-dark .user-listing-user .name { color: #e2e8f0; }
html.app-skin-dark .user-listing-user .email { color: #94a3b8; }
html.app-skin-dark .user-listing-footer { background: #1b2436; border-color: #28334c; color: #94a3b8; }

