/* Client */

:root {
  /* ================= Brand Colors ================= */
  --clr-primary: #f25d1b;
  /* Navy Gray / Dark Blue */
  --clr-secondary: #fcb42f;
  /* Bright Orange */
  --clr-accent: #bf4635;
  /* Brick Red */
  --clr-warning: #fcb42f;
  /* Amber / Warm Yellow */
  --clr-black: #000000;
  /* Black */

  --frx-track : #f3f4f6;

  /* ================= Brand Colors (RGB for opacity) ================= */
  --clr-primary-rgb: 242 93 27;
  --clr-secondary-rgb: 252 180 47;
  --clr-accent-rgb: 191 70 53;
  --clr-warning-rgb: 252 180 47;
  --clr-black-rgb: 0 0 0;

  /* ================= Background Colors ================= */
  --bg-base: #ffffff;
  /* White */
  --bg-muted: #4b5563;
  /* Slate Gray */
  --bg-primary: var(--clr-primary);
  --bg-secondary: var(--clr-secondary);
  --bg-accent: var(--clr-accent);
  --bg-black: var(--clr-black);

  /* ================= Background Colors (RGB) ================= */
  --bg-base-rgb: 255 255 255;
  --bg-muted-rgb: 75 85 99;
  --bg-primary-rgb: var(--clr-primary-rgb);
  --bg-secondary-rgb: var(--clr-secondary-rgb);
  --bg-accent-rgb: var(--clr-accent-rgb);
  --bg-black-rgb: var(--clr-black-rgb);

  /* ================= Text Colors ================= */
  --txt-white: #ffffff;
  --txt-muted: #9ca3af;
  /* Cool Gray */
  --txt-strong: #111827;
  /* Charcoal Black */
  --txt-primary: var(--clr-primary);
  --txt-secondary: var(--clr-secondary);
  --txt-accent: var(--clr-accent);

  /* ================= Text Colors (RGB) ================= */
  --txt-white-rgb: 255 255 255;
  --txt-muted-rgb: 107 114 128;
  --txt-strong-rgb: 17 24 39;
  --txt-primary-rgb: var(--clr-primary-rgb);
  --txt-secondary-rgb: var(--clr-secondary-rgb);
  --txt-accent-rgb: var(--clr-accent-rgb);

  /* ================= Border Colors ================= */
  --border-base: #ebecf0;
  /* Light Gray */
  --border-strong: var(--clr-primary);
  --border-primary: var(--clr-primary);
   --border-secondary: var(--clr-secondary);

  /* ================= Border Colors (RGB) ================= */
  --border-base-rgb: 235 236 239;
  --border-strong-rgb: var(--clr-primary-rgb);
}





* {
  scrollbar-width: none;
}


/* ------------------------------------------------------------------------ */
/* Utility Classes ================================================= Start */
/* ------------------------------------------------------------------------ */

/* Background Color ================= */
.bg-cstm-primary { background-color: var(--bg-primary); }
.bg-cstm-primary-5 { background-color: rgb(var(--bg-primary-rgb) / 0.05); }       
.bg-cstm-primary-10 { background-color: rgb(var(--bg-primary-rgb) / 0.1); } 
.bg-cstm-primary-20 { background-color: rgb(var(--bg-primary-rgb) / 0.2); }
.bg-cstm-primary-30 { background-color: rgb(var(--bg-primary-rgb)/ 0.3); }
.bg-cstm-primary-40 { background-color: rgb(var(--bg-primary-rgb)/ 0.4); }
.bg-cstm-primary-50 { background-color: rgb(var(--bg-primary-rgb)/ 0.5); }
.bg-cstm-primary-60 { background-color: rgb(var(--bg-primary-rgb)/ 0.6); }
.bg-cstm-primary-70 { background-color: rgb(var(--bg-primary-rgb)/ 0.7); }
.bg-cstm-primary-80 { background-color: rgb(var(--bg-primary-rgb)/ 0.8); }
.bg-cstm-primary-90 { background-color: rgb(var(--bg-primary-rgb)/ 0.9); }
     
.bg-cstm-secondary { background-color: var(--bg-secondary); }
.bg-cstm-secondary-10 { background-color: rgb(var(--bg-secondary-rgb) / 0.1); }
.bg-cstm-secondary-20 { background-color: rgb(var(--bg-secondary-rgb) / 0.2); }
.bg-cstm-secondary-30 { background-color: rgb(var(--bg-secondary-rgb) / 0.3); }
.bg-cstm-secondary-40 { background-color: rgb(var(--bg-secondary-rgb) / 0.4); }
.bg-cstm-secondary-50 { background-color: rgb(var(--bg-secondary-rgb) / 0.5); }
.bg-cstm-secondary-60 { background-color: rgb(var(--bg-secondary-rgb) / 0.6); }
.bg-cstm-secondary-70 { background-color: rgb(var(--bg-secondary-rgb) / 0.7); }
.bg-cstm-secondary-80 { background-color: rgb(var(--bg-secondary-rgb) / 0.8); }
.bg-cstm-secondary-90 { background-color: rgb(var(--bg-secondary-rgb) / 0.9); }

.bg-cstm-black-10 { background-color: rgb(var(--bg-black-rgb) / 0.1); }
.bg-cstm-black-20 { background-color: rgb(var(--bg-black-rgb) / 0.2); }
.bg-cstm-black-30 { background-color: rgb(var(--bg-black-rgb) / 0.3); }
.bg-cstm-black-40 { background-color: rgb(var(--bg-black-rgb) / 0.4); }
.bg-cstm-black-50 { background-color: rgb(var(--bg-black-rgb) / 0.5); }
.bg-cstm-black-60 { background-color: rgb(var(--bg-black-rgb) / 0.6); }
.bg-cstm-black-70 { background-color: rgb(var(--bg-black-rgb) / 0.7); }
.bg-cstm-black-80 { background-color: rgb(var(--bg-black-rgb) / 0.8); }
.bg-cstm-black-90 { background-color: rgb(var(--bg-black-rgb) / 0.9); }

/* Gradient BG Colors */
.bg-cstm-primary-gradient-light{
  background: linear-gradient(90deg, rgb(var(--bg-primary-rgb) / 0.2) 0.12%, #FDF8F7 99.89%) !important;
}
.bg-cstm-primary-gradient-dark{
  background: linear-gradient( 146deg, var(--bg-primary) -50%, rgb(15 15 15 / 1)) !important
}
.bg-cstm-danger-gradient-light{
  background: linear-gradient(90deg, rgb(var(--bg-red-rgb) / 0.2) 0.12%, #FDF8F7 99.89%) !important;
}
.bg-cstm-danger-gradient-dark{
  background: linear-gradient(90deg, #651e1e 0.12%, #000000 99.89%) !important;
}
.bg-cstm-common-gradient-light{
  background: linear-gradient(90deg, #F7E9FF 0.12%, #FDF8F7 99.89%) !important;
}

/* Hover Background */
.hover\:bg-cstm-primary:hover { background-color: var(--bg-primary); }
.hover\:bg-cstm-primary-10:hover { background-color: rgb(var(--bg-primary-rgb) / 0.1); }
.hover\:bg-cstm-primary-20:hover { background-color: rgb(var(--bg-primary-rgb) / 0.2); }
.hover\:bg-cstm-primary-30:hover { background-color: rgb(var(--bg-primary-rgb)/ 0.3); }
.hover\:bg-cstm-primary-40:hover { background-color: rgb(var(--bg-primary-rgb)/ 0.4); }
.hover\:bg-cstm-primary-50:hover { background-color: rgb(var(--bg-primary-rgb)/ 0.5); }
.hover\:bg-cstm-primary-light:hover { background-color: var(--bg-primary-light); }
.hover\:bg-cstm-primary-dark:hover { background-color: var(--bg-primary-dark); }

.hover\:bg-cstm-secondary:hover { background-color: var(--bg-secondary); }
.hover\:bg-cstm-secondary-10:hover { background-color: rgb(var(--bg-secondary-rgb) / 0.1); }
.hover\:bg-cstm-secondary-20:hover { background-color: rgb(var(--bg-secondary-rgb) / 0.2); }
.hover\:bg-cstm-secondary-30:hover { background-color: rgb(var(--bg-secondary-rgb) / 0.3); }
.hover\:bg-cstm-secondary-40:hover { background-color: rgb(var(--bg-secondary-rgb) / 0.4); }
.hover\:bg-cstm-secondary-50:hover { background-color: rgb(var(--bg-secondary-rgb) / 0.5); }


/* Text ================= */
.text-cstm-primary { color: var(--txt-primary); }
.text-cstm-primary-10 { color: rgb(var(--txt-primary-rgb) / 0.1); }
.text-cstm-primary-20 { color: rgb(var(--txt-primary-rgb) / 0.2); }
.text-cstm-primary-30 { color: rgb(var(--txt-primary-rgb) / 0.3); }
.text-cstm-primary-40 { color: rgb(var(--txt-primary-rgb) / 0.4); }
.text-cstm-primary-50 { color: rgb(var(--txt-primary-rgb) / 0.5); }
.text-cstm-primary-60 { color: rgb(var(--txt-primary-rgb) / 0.6); }
.text-cstm-primary-70 { color: rgb(var(--txt-primary-rgb) / 0.7); }
.text-cstm-primary-80 { color: rgb(var(--txt-primary-rgb) / 0.8); }
.text-cstm-primary-90 { color: rgb(var(--txt-primary-rgb) / 0.9); }

.text-cstm-secondary { color: var(--txt-secondary); }
.text-cstm-secondary-10 { color: rgb(var(--txt-secondary-rgb) / 0.1); }
.text-cstm-secondary-20 { color: rgb(var(--txt-secondary-rgb) / 0.2); }
.text-cstm-secondary-30 { color: rgb(var(--txt-secondary-rgb) / 0.3); }
.text-cstm-secondary-40 { color: rgb(var(--txt-secondary-rgb) / 0.4); }
.text-cstm-secondary-50 { color: rgb(var(--txt-secondary-rgb) / 0.5); }
.text-cstm-secondary-60 { color: rgb(var(--txt-secondary-rgb) / 0.6); }
.text-cstm-secondary-70 { color: rgb(var(--txt-secondary-rgb) / 0.7); }
.text-cstm-secondary-80 { color: rgb(var(--txt-secondary-rgb) / 0.8); }
.text-cstm-secondary-90 { color: rgb(var(--txt-secondary-rgb) / 0.9); }

/* Hover Text */
.hover\:text-cstm-primary:hover { color: var(--txt-primary); }
.hover\:text-cstm-primary-10:hover { color: rgb(var(--txt-primary-rgb) / 0.1); }
.hover\:text-cstm-primary-20:hover { color: rgb(var(--txt-primary-rgb) / 0.2); }
.hover\:text-cstm-primary-30:hover { color: rgb(var(--txt-primary-rgb) / 0.3); }
.hover\:text-cstm-primary-40:hover { color: rgb(var(--txt-primary-rgb) / 0.4); }
.hover\:text-cstm-primary-50:hover { color: rgb(var(--txt-primary-rgb) / 0.5); }
.hover\:text-cstm-primary-60:hover { color: rgb(var(--txt-primary-rgb) / 0.6); }
.hover\:text-cstm-primary-70:hover { color: rgb(var(--txt-primary-rgb) / 0.7); }
.hover\:text-cstm-primary-80:hover { color: rgb(var(--txt-primary-rgb) / 0.8); }
.hover\:text-cstm-primary-90:hover { color: rgb(var(--txt-primary-rgb) / 0.9); }

.hover\:text-cstm-secondary:hover { color: var(--txt-secondary); }
.hover\:text-cstm-secondary-10:hover { color: rgb(var(--txt-secondary-rgb) / 0.1); }
.hover\:text-cstm-secondary-20:hover { color: rgb(var(--txt-secondary-rgb) / 0.2); }
.hover\:text-cstm-secondary-30:hover { color: rgb(var(--txt-secondary-rgb) / 0.3); }
.hover\:text-cstm-secondary-40:hover { color: rgb(var(--txt-secondary-rgb) / 0.4); }
.hover\:text-cstm-secondary-50:hover { color: rgb(var(--txt-secondary-rgb) / 0.5); }
.hover\:text-cstm-secondary-60:hover { color: rgb(var(--txt-secondary-rgb) / 0.6); }
.hover\:text-cstm-secondary-70:hover { color: rgb(var(--txt-secondary-rgb) / 0.7); }
.hover\:text-cstm-secondary-80:hover { color: rgb(var(--txt-secondary-rgb) / 0.8); }
.hover\:text-cstm-secondary-90:hover { color: rgb(var(--txt-secondary-rgb) / 0.9); }

/* ================== Buttons ===============*/
.btn {
  font-size: 14px;
  transition-duration: 300ms;
  cursor: pointer;
}

.btn-cstm-primary {
  background-color: var(--bg-primary);
  color: var(--txt-white);
}

.btn-cstm-primary:hover {
  background-color: rgb(var(--bg-primary-rgb) / 0.85);
}

.btn-cstm-secondary {
  background-color: var(--bg-secondary);
  color: var(--txt-white);
}

.btn-cstm-secondary:hover {
  background-color: rgb(var(--bg-secondary-rgb) / 0.85);
}

/* ==================== Border ================= */
.border-cstm-primary {
  border-color: var(--border-primary);
}

.border-cstm-secondary {
  border-color: var(--border-secondary);
}



/* Common Spacing =========================================================================*/
.cstm-block-space {
  padding-block: 40px;
}

.cstm-inline-space {
  padding-inline: 40px;
}

@media (max-width: 768px) {
  .cstm-inline-space {
    padding-inline: 20px;
  }

  .cstm-block-space {
    padding-block: 20px;
  }
}



/* Initial Setting ======================================================================== */
/* Horizontle Scroll */
.cstm-tbl-scroll {
  width: 100%;
}

@media (max-width: 991px) {
  .cstm-tbl-scroll {
    overflow-x: auto;
  }

  .cstm-tbl-scroll table {
    min-width: 850px;
  }
}


/* Vertical Scroll */
.cstm-vertical-tbl-scroll {
  max-height: 310px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: #9ca3af transparent;
}

.cstm-vertical-tbl-scroll table thead,
.cstm-vertical-tbl-scroll table tbody {
  display: block;
  width: 100%;
}

.cstm-vertical-tbl-scroll table thead {
  position: sticky;
  top: 0;
  z-index: 10;
}

.cstm-vertical-tbl-scroll table tbody tr,
.cstm-vertical-tbl-scroll table thead tr {
  display: table;
  table-layout: fixed;
  width: 100%;
}

/* Scrollbar styling */
.cstm-vertical-tbl-scroll::-webkit-scrollbar {
  width: 6px;
}

.cstm-vertical-tbl-scroll::-webkit-scrollbar-thumb {
  background-color: #9ca3af;
  border-radius: 9999px;
  min-height: 30px;
  margin: 4px;
}

.cstm-vertical-tbl-scroll::-webkit-scrollbar-thumb:hover {
  background-color: #6b7280;
}

.cstm-vertical-tbl-scroll::-webkit-scrollbar-track {
  background: transparent;
}






/* Select Dropdown Setting ================ */
select,
::picker(select) {
  appearance: base-select;
  border: 1px solid #dddddd;
  border-radius: 5px;
  margin-top: 4px;
}

select::picker-icon {
  visibility: hidden;
}

.dark option {
  background: #374151;
  color: var(--txt-white);
}

option[selected],
option:hover {
  background-color: var(--bg-secondary);
  color: var(--txt-white);
}

option::checkmark {
  padding-left: 10px;
}


/* Pseudo Setting ================= */
[type='text']:focus,
[type='email']:focus,
[type='url']:focus,
[type='password']:focus,
[type='number']:focus,
[type='date']:focus,
[type='datetime-local']:focus,
[type='month']:focus,
[type='search']:focus,
[type='tel']:focus,
[type='time']:focus,
[type='week']:focus,
[multiple]:focus,
textarea:focus,
select:focus {
  --tw-ring-color: var(--border-primary);
  border-color: var(--border-primary) !important;
}

[type='text'],
[type='email'],
[type='url'],
[type='password'],
[type='number'],
[type='date'],
[type='datetime-local'],
[type='month'],
[type='search'],
[type='tel'],
[type='time'],
[type='week'],
[multiple],
textarea,
select {
  font-size: 14px;
}






/* ======================================================================= Custom Classes - Start */
/* Navbar ===================== */
.navbar-header {
  box-shadow: 0px 0px 10px #00000030;
}

/* Sidebar ===================== */
.cstm-sidebar-menu li>a.active-page {
  background-color: var(--bg-secondary);
  color: var(--txt-white);
}

.cstm-sidebar-menu li>a.active-page:hover {
  background-color: var(--bg-accent);
}

.cstm-sidebar-menu li a:hover {
  color: var(--txt-primary);
}


/* View Profile ================= */
.cstm-avatar-upload .avatar-preview {
  border-color: var(--border-secondary);
}

.cstm-tab-style-gradient button[aria-selected=true],
.cstm-tab-style-gradient .active-tab {
  background: no-repeat;
  border-top: none;
  border-bottom: 4px solid var(--border-secondary);
  color: var(--txt-primary);
}

.cstm-tab-style-gradient button[aria-selected=true]:hover,
.cstm-tab-style-gradient .active-tab:hover {
  color: var(--clr-secondary);
}

.dark .cstm-tab-style-gradient button[aria-selected=true],
.dark .cstm-tab-style-gradient .active-tab {
  color: var(--clr-secondary);
}


/* Faq ===========================*/
.cstm-accordion-item [aria-expanded=true] {
  background-color: rgb(var(--bg-primary-rgb) / 0.1);
}

.cstm-accordion-item [aria-expanded=true] span {
  color: var(--txt-primary);
}

.cstm-sidebar-menu li>a.active-page,
.cstm-sidebar-menu .dropdown-open>a,
.cstm-sidebar-menu li.dropdown.open>a {
  background-color: var(--bg-primary) !important;
  color: var(--txt-white) !important;
}

.cstm-sidebar-menu .dropdown-open {
  padding-top: 5px;
  transition-duration: 300ms;
}

.bg-cstm-black-40 {
  background-color: rgb(var(--bg-black-rgb) / 0.4);
}

.backdrop-blur-sm {
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.max-h-\[90vh\] {
  max-height: 90vh;
}

.space-y-3> :not([hidden])~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
}

.dropdown.manual-open .sidebar-submenu a:not(.active) {
  background: transparent !important;
  color: rgb(75 85 99 / var(--tw-text-opacity)) !important;
}

input[type="checkbox"] {
  accent-color: var(--bg-primary);
  color: var(--bg-primary);
}

input[type="checkbox"]:focus {
  box-shadow: none;
}
.sidebar.active .sidebar-menu li button span{
  display: none;
}
.scrollbar_thin {
  scrollbar-width: thin;
}
.table td:last-child, .table th:last-child {
    text-align: center;
}
@media (max-width:768px) {
  .mobile_d_none {
    display: none;
  }

  .mobile_d_unset {
    display: inline-block;
  }

  #reportTabs .nav-item {
    display: block !important;
  }
}