/* Mixins Start */
.pagination ul li a, .pagination ul li button, .btn-light, .btn-secondary, .btn-second, .btn-primary, .btn-dark, .btn-first-light, .btn-first, .btn-info, .btn-warning, .btn-success, .btn-danger, .btn-third {
  display: flex;
  justify-content: center;
  align-items: center;
}

.tag-item-box button, .btn-generate, .ui-datepicker .datepicker-select-wrapper .close-wrapper, .video-wrapper .video-footer .btn-picture, .voice_record_btn, .input-btn-icon, .btn-close {
  display: grid;
  place-items: center;
}

/* Mixins End */
:root {
  /* Colors */
  --text-lightest: #fff;
  --text-darkest: #000;
  --white: #fff;
  --black: #000;
  /* Backgrounds */
  --scrollbar-bg: rgb(var(--rgb-zinc-200));
  --scrollbar-thumb-bg: rgb(var(--rgb-zinc-400));
  /* Border Radius */
  --radius-full: 99999px;
  --radius-input: 0.75rem;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
}

body.blue {
  /* Global Themes Start */
  --rgb-lightest: 255, 255, 255;
  --rgb-lighter: var(--rgb-slate-50);
  --rgb-light: var(--rgb-slate-200);
  --rgb-light-dark: var(--rgb-slate-500);
  --rgb-dark: var(--rgb-slate-700);
  --rgb-darker: var(--rgb-slate-900);
  --rgb-darkest: 0, 0, 0;
  /* Main color for buttons and main areas */
  --rgb-first-lighter: var(--rgb-blue-200);
  --rgb-first-light: var(--rgb-blue-400);
  --rgb-first: var(--rgb-blue-700);
  --rgb-first-dark: var(--rgb-blue-800);
  --rgb-first-darker: var(--rgb-blue-900);
  /* For secondary sections in sso */
  --rgb-second-lighter: var(--rgb-sky-50);
  --rgb-second-light: var(--rgb-sky-200);
  --rgb-second: var(--rgb-sky-500);
  --rgb-second-dark: var(--rgb-sky-700);
  --rgb-second-darker: var(--rgb-sky-900);
  /* For secondary sections in profile */
  --rgb-third-lighter: var(--rgb-indigo-50);
  --rgb-third-light: var(--rgb-indigo-200);
  --rgb-third: var(--rgb-indigo-500);
  --rgb-third-dark: var(--rgb-indigo-600);
  --rgb-third-darker: var(--rgb-indigo-800);
  --rgb-forth-lighter: var(--rgb-blue-50);
  --rgb-forth-light: var(--rgb-blue-200);
  --rgb-forth: var(--rgb-blue-600);
  --rgb-forth-dark: var(--rgb-blue-700);
  --rgb-forth-darker: var(--rgb-blue-900);
  --rgb-fifth-lighter: var(--rgb-blue-50);
  --rgb-fifth-light: var(--rgb-blue-200);
  --rgb-fifth: var(--rgb-blue-500);
  --rgb-fifth-dark: var(--rgb-blue-700);
  --rgb-fifth-darker: var(--rgb-blue-900);
  /* for active buttons in pagination and so on... */
  --rgb-sixth: var(--rgb-sky-600);
  /* Very close to first color more uses in "my" */
  --rgb-seventh-lighter: var(--rgb-blue-100);
  --rgb-seventh-light: var(--rgb-blue-200);
  --rgb-seventh: var(--rgb-blue-400);
  --rgb-seventh-dark: var(--rgb-blue-600);
  --rgb-seventh-darker: var(--rgb-blue-900);
  /* Boxes background */
  --rgb-ninth-lighter: var(--rgb-lightest);
  --rgb-ninth-darker: var(--rgb-darkest);
  /* Body background */
  --rgb-tenth-lighter: var(--rgb-blue-50);
  --rgb-tenth-darker: var(--rgb-blue-900);
  /* Global Themes End */
}

body.orange {
  /* Global Themes Start */
  --rgb-lightest: 255, 255, 255;
  --rgb-lighter: var(--rgb-slate-50);
  --rgb-light: var(--rgb-slate-200);
  --rgb-light-dark: var(--rgb-slate-500);
  --rgb-dark: var(--rgb-slate-700);
  --rgb-darker: var(--rgb-slate-900);
  --rgb-darkest: 0, 0, 0;
  /* Main color for buttons and main areas */
  --rgb-first-lighter: var(--rgb-orange-200);
  --rgb-first-light: var(--rgb-orange-400);
  --rgb-first: var(--rgb-orange-700);
  --rgb-first-dark: var(--rgb-orange-800);
  --rgb-first-darker: var(--rgb-orange-900);
  /* For secondary sections in sso */
  --rgb-second-lighter: var(--rgb-pink-50);
  --rgb-second-light: var(--rgb-pink-200);
  --rgb-second: var(--rgb-pink-500);
  --rgb-second-dark: var(--rgb-pink-700);
  --rgb-second-darker: var(--rgb-pink-900);
  /* For secondary sections in profile */
  --rgb-third-lighter: var(--rgb-rose-50);
  --rgb-third-light: var(--rgb-rose-200);
  --rgb-third: var(--rgb-rose-500);
  --rgb-third-dark: var(--rgb-rose-600);
  --rgb-third-darker: var(--rgb-rose-800);
  --rgb-forth-lighter: var(--rgb-orange-50);
  --rgb-forth-light: var(--rgb-orange-200);
  --rgb-forth: var(--rgb-orange-600);
  --rgb-forth-dark: var(--rgb-orange-700);
  --rgb-forth-darker: var(--rgb-orange-900);
  --rgb-fifth-lighter: var(--rgb-orange-50);
  --rgb-fifth-light: var(--rgb-orange-200);
  --rgb-fifth: var(--rgb-orange-400);
  --rgb-fifth-dark: var(--rgb-orange-700);
  --rgb-fifth-darker: var(--rgb-orange-900);
  /* for active buttons in pagination and so on... */
  --rgb-sixth: var(--rgb-amber-600);
  /* Very close to first color more uses in "my" */
  --rgb-seventh-lighter: var(--rgb-orange-100);
  --rgb-seventh-light: var(--rgb-orange-200);
  --rgb-seventh: var(--rgb-orange-400);
  --rgb-seventh-dark: var(--rgb-orange-600);
  --rgb-seventh-darker: var(--rgb-orange-900);
  /* Boxes background */
  --rgb-ninth-lighter: var(--rgb-lightest);
  --rgb-ninth-darker: var(--rgb-darkest);
  /* Body background */
  --rgb-tenth-lighter: var(--rgb-orange-50);
  --rgb-tenth-darker: var(--rgb-orange-900);
  /* Global Themes End */
}

body.fuchsia {
  /* Global Themes Start */
  --rgb-lightest: 255, 255, 255;
  --rgb-lighter: var(--rgb-slate-50);
  --rgb-light: var(--rgb-slate-200);
  --rgb-light-dark: var(--rgb-slate-500);
  --rgb-dark: var(--rgb-slate-700);
  --rgb-darker: var(--rgb-slate-900);
  --rgb-darkest: 0, 0, 0;
  /* Main color for buttons and main areas */
  --rgb-first-lighter: var(--rgb-fuchsia-200);
  --rgb-first-light: var(--rgb-fuchsia-400);
  --rgb-first: var(--rgb-fuchsia-700);
  --rgb-first-dark: var(--rgb-fuchsia-800);
  --rgb-first-darker: var(--rgb-fuchsia-900);
  /* For secondary sections in sso */
  --rgb-second-lighter: var(--rgb-pink-50);
  --rgb-second-light: var(--rgb-pink-200);
  --rgb-second: var(--rgb-pink-500);
  --rgb-second-dark: var(--rgb-pink-700);
  --rgb-second-darker: var(--rgb-pink-900);
  /* For secondary sections in profile */
  --rgb-third-lighter: var(--rgb-fuchsia-50);
  --rgb-third-light: var(--rgb-fuchsia-200);
  --rgb-third: var(--rgb-fuchsia-500);
  --rgb-third-dark: var(--rgb-fuchsia-600);
  --rgb-third-darker: var(--rgb-fuchsia-800);
  --rgb-forth-lighter: var(--rgb-fuchsia-50);
  --rgb-forth-light: var(--rgb-fuchsia-200);
  --rgb-forth: var(--rgb-fuchsia-600);
  --rgb-forth-dark: var(--rgb-fuchsia-700);
  --rgb-forth-darker: var(--rgb-fuchsia-900);
  --rgb-fifth-lighter: var(--rgb-fuchsia-50);
  --rgb-fifth-light: var(--rgb-fuchsia-200);
  --rgb-fifth: var(--rgb-fuchsia-400);
  --rgb-fifth-dark: var(--rgb-fuchsia-700);
  --rgb-fifth-darker: var(--rgb-fuchsia-900);
  /* for active buttons in pagination and so on... */
  --rgb-sixth: var(--rgb-pink-600);
  /* Very close to first color more uses in "my" */
  --rgb-seventh-lighter: var(--rgb-pink-100);
  --rgb-seventh-light: var(--rgb-pink-200);
  --rgb-seventh: var(--rgb-pink-400);
  --rgb-seventh-dark: var(--rgb-pink-600);
  --rgb-seventh-darker: var(--rgb-pink-900);
  /* Boxes background */
  --rgb-ninth-lighter: var(--rgb-lightest);
  --rgb-ninth-darker: var(--rgb-darkest);
  /* Body background */
  --rgb-tenth-lighter: var(--rgb-fuchsia-50);
  --rgb-tenth-darker: var(--rgb-fuchsia-900);
  /* Global Themes End */
}

body.pink {
  /* Global Themes Start */
  --rgb-lightest: 255, 255, 255;
  --rgb-lighter: var(--rgb-slate-50);
  --rgb-light: var(--rgb-slate-200);
  --rgb-light-dark: var(--rgb-slate-500);
  --rgb-dark: var(--rgb-slate-700);
  --rgb-darker: var(--rgb-slate-900);
  --rgb-darkest: 0, 0, 0;
  /* Main color for buttons and main areas */
  --rgb-first-lighter: var(--rgb-pink-200);
  --rgb-first-light: var(--rgb-pink-400);
  --rgb-first: var(--rgb-pink-700);
  --rgb-first-dark: var(--rgb-pink-800);
  --rgb-first-darker: var(--rgb-pink-900);
  /* For secondary sections in sso */
  --rgb-second-lighter: var(--rgb-rose-50);
  --rgb-second-light: var(--rgb-rose-200);
  --rgb-second: var(--rgb-rose-500);
  --rgb-second-dark: var(--rgb-rose-700);
  --rgb-second-darker: var(--rgb-rose-900);
  /* For secondary sections in profile */
  --rgb-third-lighter: var(--rgb-rose-50);
  --rgb-third-light: var(--rgb-rose-200);
  --rgb-third: var(--rgb-rose-500);
  --rgb-third-dark: var(--rgb-rose-600);
  --rgb-third-darker: var(--rgb-rose-800);
  --rgb-forth-lighter: var(--rgb-pink-50);
  --rgb-forth-light: var(--rgb-pink-200);
  --rgb-forth: var(--rgb-pink-600);
  --rgb-forth-dark: var(--rgb-pink-700);
  --rgb-forth-darker: var(--rgb-pink-900);
  --rgb-fifth-lighter: var(--rgb-pink-50);
  --rgb-fifth-light: var(--rgb-pink-200);
  --rgb-fifth: var(--rgb-pink-500);
  --rgb-fifth-dark: var(--rgb-pink-700);
  --rgb-fifth-darker: var(--rgb-pink-900);
  /* for active buttons in pagination and so on... */
  --rgb-sixth: var(--rgb-fuchsia-600);
  /* Very close to first color more uses in "my" */
  --rgb-seventh-lighter: var(--rgb-fuchsia-100);
  --rgb-seventh-light: var(--rgb-fuchsia-200);
  --rgb-seventh: var(--rgb-fuchsia-400);
  --rgb-seventh-dark: var(--rgb-fuchsia-600);
  --rgb-seventh-darker: var(--rgb-fuchsia-900);
  /* Boxes background */
  --rgb-ninth-lighter: var(--rgb-lightest);
  --rgb-ninth-darker: var(--rgb-darkest);
  /* Body background */
  --rgb-tenth-lighter: var(--rgb-pink-50);
  --rgb-tenth-darker: var(--rgb-pink-900);
  /* Global Themes End */
}

body.emerald {
  /* Global Themes Start */
  --rgb-lightest: 255, 255, 255;
  --rgb-lighter: var(--rgb-slate-50);
  --rgb-light: var(--rgb-slate-200);
  --rgb-light-dark: var(--rgb-slate-500);
  --rgb-dark: var(--rgb-slate-700);
  --rgb-darker: var(--rgb-slate-900);
  --rgb-darkest: 0, 0, 0;
  /* Main color for buttons and main areas */
  --rgb-first-lighter: var(--rgb-emerald-200);
  --rgb-first-light: var(--rgb-emerald-400);
  --rgb-first: var(--rgb-emerald-700);
  --rgb-first-dark: var(--rgb-emerald-800);
  --rgb-first-darker: var(--rgb-emerald-900);
  /* For secondary sections in sso */
  --rgb-second-lighter: var(--rgb-cyan-50);
  --rgb-second-light: var(--rgb-cyan-200);
  --rgb-second: var(--rgb-cyan-500);
  --rgb-second-dark: var(--rgb-cyan-700);
  --rgb-second-darker: var(--rgb-cyan-900);
  /* For secondary sections in profile */
  --rgb-third-lighter: var(--rgb-emerald-50);
  --rgb-third-light: var(--rgb-emerald-200);
  --rgb-third: var(--rgb-emerald-500);
  --rgb-third-dark: var(--rgb-emerald-600);
  --rgb-third-darker: var(--rgb-emerald-800);
  --rgb-forth-lighter: var(--rgb-emerald-50);
  --rgb-forth-light: var(--rgb-emerald-200);
  --rgb-forth: var(--rgb-emerald-600);
  --rgb-forth-dark: var(--rgb-emerald-700);
  --rgb-forth-darker: var(--rgb-emerald-900);
  --rgb-fifth-lighter: var(--rgb-emerald-50);
  --rgb-fifth-light: var(--rgb-emerald-200);
  --rgb-fifth: var(--rgb-emerald-500);
  --rgb-fifth-dark: var(--rgb-emerald-700);
  --rgb-fifth-darker: var(--rgb-emerald-900);
  /* for active buttons in pagination and so on... */
  --rgb-sixth: var(--rgb-cyan-600);
  /* Very close to first color more uses in "my" */
  --rgb-seventh-lighter: var(--rgb-emerald-100);
  --rgb-seventh-light: var(--rgb-emerald-200);
  --rgb-seventh: var(--rgb-emerald-400);
  --rgb-seventh-dark: var(--rgb-emerald-600);
  --rgb-seventh-darker: var(--rgb-emerald-900);
  /* Boxes background */
  --rgb-ninth-lighter: var(--rgb-lightest);
  --rgb-ninth-darker: var(--rgb-darkest);
  /* Body background */
  --rgb-tenth-lighter: var(--rgb-emerald-50);
  --rgb-tenth-darker: var(--rgb-emerald-900);
  /* Global Themes End */
}

body.red {
  /* Global Themes Start */
  --rgb-lightest: 255, 255, 255;
  --rgb-lighter: var(--rgb-slate-50);
  --rgb-light: var(--rgb-slate-200);
  --rgb-light-dark: var(--rgb-slate-500);
  --rgb-dark: var(--rgb-slate-700);
  --rgb-darker: var(--rgb-slate-900);
  --rgb-darkest: 0, 0, 0;
  /* Main color for buttons and main areas */
  --rgb-first-lighter: var(--rgb-red-200);
  --rgb-first-light: var(--rgb-red-400);
  --rgb-first: var(--rgb-red-700);
  --rgb-first-dark: var(--rgb-red-800);
  --rgb-first-darker: var(--rgb-red-900);
  /* For secondary sections in sso */
  --rgb-second-lighter: var(--rgb-rose-50);
  --rgb-second-light: var(--rgb-rose-200);
  --rgb-second: var(--rgb-rose-500);
  --rgb-second-dark: var(--rgb-rose-700);
  --rgb-second-darker: var(--rgb-rose-900);
  /* For secondary sections in profile */
  --rgb-third-lighter: var(--rgb-rose-50);
  --rgb-third-light: var(--rgb-rose-200);
  --rgb-third: var(--rgb-rose-500);
  --rgb-third-dark: var(--rgb-rose-600);
  --rgb-third-darker: var(--rgb-rose-800);
  --rgb-forth-lighter: var(--rgb-red-50);
  --rgb-forth-light: var(--rgb-red-200);
  --rgb-forth: var(--rgb-red-600);
  --rgb-forth-dark: var(--rgb-red-700);
  --rgb-forth-darker: var(--rgb-red-900);
  --rgb-fifth-lighter: var(--rgb-red-50);
  --rgb-fifth-light: var(--rgb-red-200);
  --rgb-fifth: var(--rgb-red-500);
  --rgb-fifth-dark: var(--rgb-red-700);
  --rgb-fifth-darker: var(--rgb-red-900);
  /* for active buttons in pagination and so on... */
  --rgb-sixth: var(--rgb-fuchsia-600);
  /* Very close to first color more uses in "my" */
  --rgb-seventh-lighter: var(--rgb-red-100);
  --rgb-seventh-light: var(--rgb-red-200);
  --rgb-seventh: var(--rgb-red-400);
  --rgb-seventh-dark: var(--rgb-red-600);
  --rgb-seventh-darker: var(--rgb-red-900);
  /* Boxes background */
  --rgb-ninth-lighter: var(--rgb-lightest);
  --rgb-ninth-darker: var(--rgb-darkest);
  /* Body background */
  --rgb-tenth-lighter: var(--rgb-red-50);
  --rgb-tenth-darker: var(--rgb-red-900);
  /* Global Themes End */
}

body.sky {
  /* Global Themes Start */
  --rgb-lightest: 255, 255, 255;
  --rgb-lighter: var(--rgb-slate-50);
  --rgb-light: var(--rgb-slate-200);
  --rgb-light-dark: var(--rgb-slate-500);
  --rgb-dark: var(--rgb-slate-700);
  --rgb-darker: var(--rgb-slate-900);
  --rgb-darkest: 0, 0, 0;
  /* Main color for buttons and main areas */
  --rgb-first-lighter: var(--rgb-sky-200);
  --rgb-first-light: var(--rgb-sky-400);
  --rgb-first: var(--rgb-sky-700);
  --rgb-first-dark: var(--rgb-sky-800);
  --rgb-first-darker: var(--rgb-sky-900);
  /* For secondary sections in sso */
  --rgb-second-lighter: var(--rgb-cyan-50);
  --rgb-second-light: var(--rgb-cyan-200);
  --rgb-second: var(--rgb-cyan-500);
  --rgb-second-dark: var(--rgb-cyan-700);
  --rgb-second-darker: var(--rgb-cyan-900);
  /* For secondary sections in profile */
  --rgb-third-lighter: var(--rgb-cyan-50);
  --rgb-third-light: var(--rgb-cyan-200);
  --rgb-third: var(--rgb-cyan-500);
  --rgb-third-dark: var(--rgb-cyan-600);
  --rgb-third-darker: var(--rgb-cyan-800);
  --rgb-forth-lighter: var(--rgb-sky-50);
  --rgb-forth-light: var(--rgb-sky-200);
  --rgb-forth: var(--rgb-sky-600);
  --rgb-forth-dark: var(--rgb-sky-700);
  --rgb-forth-darker: var(--rgb-sky-900);
  --rgb-fifth-lighter: var(--rgb-violet-50);
  --rgb-fifth-light: var(--rgb-violet-200);
  --rgb-fifth: var(--rgb-violet-500);
  --rgb-fifth-dark: var(--rgb-violet-700);
  --rgb-fifth-darker: var(--rgb-violet-900);
  /* for active buttons in pagination and so on... */
  --rgb-sixth: var(--rgb-sky-600);
  /* Very close to first color more uses in "my" */
  --rgb-seventh-lighter: var(--rgb-sky-100);
  --rgb-seventh-light: var(--rgb-sky-200);
  --rgb-seventh: var(--rgb-sky-400);
  --rgb-seventh-dark: var(--rgb-sky-600);
  --rgb-seventh-darker: var(--rgb-sky-900);
  /* Boxes background */
  --rgb-ninth-lighter: var(--rgb-lightest);
  --rgb-ninth-darker: var(--rgb-darkest);
  /* Body background */
  --rgb-tenth-lighter: var(--rgb-sky-50);
  --rgb-tenth-darker: var(--rgb-sky-900);
  /* Global Themes End */
}

body.yellow {
  /* Global Themes Start */
  --rgb-lightest: 255, 255, 255;
  --rgb-lighter: var(--rgb-slate-50);
  --rgb-light: var(--rgb-slate-200);
  --rgb-light-dark: var(--rgb-slate-500);
  --rgb-dark: var(--rgb-slate-700);
  --rgb-darker: var(--rgb-slate-900);
  --rgb-darkest: 0, 0, 0;
  /* Main color for buttons and main areas */
  --rgb-first-lighter: var(--rgb-yellow-200);
  --rgb-first-light: var(--rgb-yellow-400);
  --rgb-first: var(--rgb-yellow-700);
  --rgb-first-dark: var(--rgb-yellow-800);
  --rgb-first-darker: var(--rgb-yellow-900);
  /* For secondary sections in sso */
  --rgb-second-lighter: var(--rgb-amber-50);
  --rgb-second-light: var(--rgb-amber-200);
  --rgb-second: var(--rgb-amber-500);
  --rgb-second-dark: var(--rgb-amber-700);
  --rgb-second-darker: var(--rgb-amber-900);
  /* For secondary sections in profile */
  --rgb-third-lighter: var(--rgb-amber-50);
  --rgb-third-light: var(--rgb-amber-200);
  --rgb-third: var(--rgb-amber-500);
  --rgb-third-dark: var(--rgb-amber-600);
  --rgb-third-darker: var(--rgb-amber-800);
  --rgb-forth-lighter: var(--rgb-yellow-50);
  --rgb-forth-light: var(--rgb-yellow-200);
  --rgb-forth: var(--rgb-yellow-600);
  --rgb-forth-dark: var(--rgb-yellow-700);
  --rgb-forth-darker: var(--rgb-yellow-900);
  --rgb-fifth-lighter: var(--rgb-yellow-50);
  --rgb-fifth-light: var(--rgb-yellow-200);
  --rgb-fifth: var(--rgb-yellow-500);
  --rgb-fifth-dark: var(--rgb-yellow-700);
  --rgb-fifth-darker: var(--rgb-yellow-900);
  /* for active buttons in pagination and so on... */
  --rgb-sixth: var(--rgb-orange-600);
  /* Very close to first color more uses in "my" */
  --rgb-seventh-lighter: var(--rgb-yellow-100);
  --rgb-seventh-light: var(--rgb-yellow-200);
  --rgb-seventh: var(--rgb-yellow-400);
  --rgb-seventh-dark: var(--rgb-yellow-600);
  --rgb-seventh-darker: var(--rgb-yellow-900);
  /* Boxes background */
  --rgb-ninth-lighter: var(--rgb-lightest);
  --rgb-ninth-darker: var(--rgb-darkest);
  /* Body background */
  --rgb-tenth-lighter: var(--rgb-yellow-50);
  --rgb-tenth-darker: var(--rgb-yellow-900);
  /* Global Themes End */
}

body.green {
  /* Global Themes Start */
  --rgb-lightest: 255, 255, 255;
  --rgb-lighter: var(--rgb-slate-50);
  --rgb-light: var(--rgb-slate-200);
  --rgb-light-dark: var(--rgb-slate-500);
  --rgb-dark: var(--rgb-slate-700);
  --rgb-darker: var(--rgb-slate-900);
  --rgb-darkest: 0, 0, 0;
  /* Main color for buttons and main areas */
  --rgb-first-lighter: var(--rgb-green-200);
  --rgb-first-light: var(--rgb-green-400);
  --rgb-first: var(--rgb-green-700);
  --rgb-first-dark: var(--rgb-green-800);
  --rgb-first-darker: var(--rgb-green-900);
  /* For secondary sections in sso */
  --rgb-second-lighter: var(--rgb-lime-50);
  --rgb-second-light: var(--rgb-lime-200);
  --rgb-second: var(--rgb-lime-500);
  --rgb-second-dark: var(--rgb-lime-700);
  --rgb-second-darker: var(--rgb-lime-900);
  /* For secondary sections in profile */
  --rgb-third-lighter: var(--rgb-lime-50);
  --rgb-third-light: var(--rgb-lime-200);
  --rgb-third: var(--rgb-lime-500);
  --rgb-third-dark: var(--rgb-lime-600);
  --rgb-third-darker: var(--rgb-lime-800);
  --rgb-forth-lighter: var(--rgb-green-50);
  --rgb-forth-light: var(--rgb-green-200);
  --rgb-forth: var(--rgb-green-600);
  --rgb-forth-dark: var(--rgb-green-700);
  --rgb-forth-darker: var(--rgb-green-900);
  --rgb-fifth-lighter: var(--rgb-green-50);
  --rgb-fifth-light: var(--rgb-green-200);
  --rgb-fifth: var(--rgb-green-500);
  --rgb-fifth-dark: var(--rgb-green-700);
  --rgb-fifth-darker: var(--rgb-green-900);
  /* for active buttons in pagination and so on... */
  --rgb-sixth: var(--rgb-lime-600);
  /* Very close to first color more uses in "my" */
  --rgb-seventh-lighter: var(--rgb-green-100);
  --rgb-seventh-light: var(--rgb-green-200);
  --rgb-seventh: var(--rgb-green-400);
  --rgb-seventh-dark: var(--rgb-green-600);
  --rgb-seventh-darker: var(--rgb-green-900);
  /* Boxes background */
  --rgb-ninth-lighter: var(--rgb-lightest);
  --rgb-ninth-darker: var(--rgb-darkest);
  /* Body background */
  --rgb-tenth-lighter: var(--rgb-green-50);
  --rgb-tenth-darker: var(--rgb-green-900);
  /* Global Themes End */
}

body.purple {
  /* Global Themes Start */
  --rgb-lightest: 255, 255, 255;
  --rgb-lighter: var(--rgb-slate-50);
  --rgb-light: var(--rgb-slate-200);
  --rgb-light-dark: var(--rgb-slate-500);
  --rgb-dark: var(--rgb-slate-700);
  --rgb-darker: var(--rgb-slate-900);
  --rgb-darkest: 0, 0, 0;
  /* Main color for buttons and main areas */
  --rgb-first-lighter: var(--rgb-purple-200);
  --rgb-first-light: var(--rgb-purple-400);
  --rgb-first: var(--rgb-purple-700);
  --rgb-first-dark: var(--rgb-purple-800);
  --rgb-first-darker: var(--rgb-purple-900);
  /* For secondary sections in sso */
  --rgb-second-lighter: var(--rgb-violet-50);
  --rgb-second-light: var(--rgb-violet-200);
  --rgb-second: var(--rgb-violet-500);
  --rgb-second-dark: var(--rgb-violet-700);
  --rgb-second-darker: var(--rgb-violet-900);
  /* For secondary sections in profile */
  --rgb-third-lighter: var(--rgb-violet-50);
  --rgb-third-light: var(--rgb-violet-200);
  --rgb-third: var(--rgb-violet-500);
  --rgb-third-dark: var(--rgb-violet-600);
  --rgb-third-darker: var(--rgb-violet-800);
  --rgb-forth-lighter: var(--rgb-purple-50);
  --rgb-forth-light: var(--rgb-purple-200);
  --rgb-forth: var(--rgb-purple-600);
  --rgb-forth-dark: var(--rgb-purple-700);
  --rgb-forth-darker: var(--rgb-purple-900);
  --rgb-fifth-lighter: var(--rgb-purple-50);
  --rgb-fifth-light: var(--rgb-purple-200);
  --rgb-fifth: var(--rgb-purple-500);
  --rgb-fifth-dark: var(--rgb-purple-700);
  --rgb-fifth-darker: var(--rgb-purple-900);
  /* for active buttons in pagination and so on... */
  --rgb-sixth: var(--rgb-purple-600);
  /* Very close to first color more uses in "my" */
  --rgb-seventh-lighter: var(--rgb-violet-100);
  --rgb-seventh-light: var(--rgb-violet-200);
  --rgb-seventh: var(--rgb-violet-400);
  --rgb-seventh-dark: var(--rgb-violet-600);
  --rgb-seventh-darker: var(--rgb-violet-900);
  /* Boxes background */
  --rgb-ninth-lighter: var(--rgb-lightest);
  --rgb-ninth-darker: var(--rgb-darkest);
  /* Body background */
  --rgb-tenth-lighter: var(--rgb-purple-50);
  --rgb-tenth-darker: var(--rgb-purple-900);
  /* Global Themes End */
}

body.indigo {
  /* Global Themes Start */
  --rgb-lightest: 255, 255, 255;
  --rgb-lighter: var(--rgb-slate-50);
  --rgb-light: var(--rgb-slate-200);
  --rgb-light-dark: var(--rgb-slate-500);
  --rgb-dark: var(--rgb-slate-700);
  --rgb-darker: var(--rgb-slate-900);
  --rgb-darkest: 0, 0, 0;
  /* Main color for buttons and main areas */
  --rgb-first-lighter: var(--rgb-indigo-200);
  --rgb-first-light: var(--rgb-indigo-400);
  --rgb-first: var(--rgb-indigo-700);
  --rgb-first-dark: var(--rgb-indigo-800);
  --rgb-first-darker: var(--rgb-indigo-900);
  /* For secondary sections in sso */
  --rgb-second-lighter: var(--rgb-indigo-50);
  --rgb-second-light: var(--rgb-indigo-200);
  --rgb-second: var(--rgb-indigo-500);
  --rgb-second-dark: var(--rgb-indigo-700);
  --rgb-second-darker: var(--rgb-indigo-900);
  /* For secondary sections in profile */
  --rgb-third-lighter: var(--rgb-indigo-50);
  --rgb-third-light: var(--rgb-indigo-200);
  --rgb-third: var(--rgb-indigo-500);
  --rgb-third-dark: var(--rgb-indigo-600);
  --rgb-third-darker: var(--rgb-indigo-800);
  --rgb-forth-lighter: var(--rgb-indigo-50);
  --rgb-forth-light: var(--rgb-indigo-200);
  --rgb-forth: var(--rgb-indigo-600);
  --rgb-forth-dark: var(--rgb-indigo-700);
  --rgb-forth-darker: var(--rgb-indigo-900);
  --rgb-fifth-lighter: var(--rgb-indigo-50);
  --rgb-fifth-light: var(--rgb-indigo-200);
  --rgb-fifth: var(--rgb-indigo-500);
  --rgb-fifth-dark: var(--rgb-indigo-700);
  --rgb-fifth-darker: var(--rgb-indigo-900);
  /* for active buttons in pagination and so on... */
  --rgb-sixth: var(--rgb-purple-600);
  /* Very close to first color more uses in "my" */
  --rgb-seventh-lighter: var(--rgb-indigo-100);
  --rgb-seventh-light: var(--rgb-indigo-200);
  --rgb-seventh: var(--rgb-indigo-400);
  --rgb-seventh-dark: var(--rgb-indigo-600);
  --rgb-seventh-darker: var(--rgb-indigo-900);
  /* Boxes background */
  --rgb-ninth-lighter: var(--rgb-lightest);
  --rgb-ninth-darker: var(--rgb-darkest);
  /* Body background */
  --rgb-tenth-lighter: var(--rgb-indigo-50);
  --rgb-tenth-darker: var(--rgb-indigo-900);
  /* Global Themes End */
}

body.slate {
  /* Global Themes Start */
  --rgb-lightest: 255, 255, 255;
  --rgb-lighter: var(--rgb-slate-50);
  --rgb-light: var(--rgb-slate-200);
  --rgb-light-dark: var(--rgb-slate-500);
  --rgb-dark: var(--rgb-slate-700);
  --rgb-darker: var(--rgb-slate-900);
  --rgb-darkest: 0, 0, 0;
  /* Main color for buttons and main areas */
  --rgb-first-lighter: var(--rgb-slate-200);
  --rgb-first-light: var(--rgb-slate-400);
  --rgb-first: var(--rgb-slate-700);
  --rgb-first-dark: var(--rgb-slate-800);
  --rgb-first-darker: var(--rgb-slate-900);
  /* For secondary sections in sso */
  --rgb-second-lighter: var(--rgb-yellow-50);
  --rgb-second-light: var(--rgb-yellow-200);
  --rgb-second: var(--rgb-yellow-500);
  --rgb-second-dark: var(--rgb-yellow-700);
  --rgb-second-darker: var(--rgb-yellow-900);
  /* For secondary sections in profile */
  --rgb-third-lighter: var(--rgb-yellow-50);
  --rgb-third-light: var(--rgb-yellow-200);
  --rgb-third: var(--rgb-yellow-500);
  --rgb-third-dark: var(--rgb-yellow-600);
  --rgb-third-darker: var(--rgb-yellow-800);
  --rgb-forth-lighter: var(--rgb-yellow-50);
  --rgb-forth-light: var(--rgb-yellow-200);
  --rgb-forth: var(--rgb-yellow-600);
  --rgb-forth-dark: var(--rgb-yellow-700);
  --rgb-forth-darker: var(--rgb-yellow-900);
  --rgb-fifth-lighter: var(--rgb-yellow-50);
  --rgb-fifth-light: var(--rgb-yellow-200);
  --rgb-fifth: var(--rgb-yellow-500);
  --rgb-fifth-dark: var(--rgb-yellow-700);
  --rgb-fifth-darker: var(--rgb-yellow-900);
  /* for active buttons in pagination and so on... */
  --rgb-sixth: var(--rgb-purple-600);
  /* Very close to first color more uses in "my" */
  --rgb-seventh-lighter: var(--rgb-yellow-100);
  --rgb-seventh-light: var(--rgb-yellow-200);
  --rgb-seventh: var(--rgb-yellow-400);
  --rgb-seventh-dark: var(--rgb-yellow-600);
  --rgb-seventh-darker: var(--rgb-yellow-900);
  /* Boxes background */
  --rgb-ninth-lighter: var(--rgb-lightest);
  --rgb-ninth-darker: var(--rgb-darkest);
  /* Body background */
  --rgb-tenth-lighter: var(--rgb-slate-50);
  --rgb-tenth-darker: var(--rgb-slate-900);
  /* Global Themes End */
}

body.yellow-blue {
  /* Global Themes Start */
  --rgb-lightest: 255, 255, 255;
  --rgb-lighter: var(--rgb-slate-50);
  --rgb-light: var(--rgb-slate-200);
  --rgb-light-dark: var(--rgb-slate-500);
  --rgb-dark: var(--rgb-slate-700);
  --rgb-darker: var(--rgb-slate-900);
  --rgb-darkest: 0, 0, 0;
  /* Main color for buttons and main areas */
  --rgb-first-lighter: var(--rgb-yellow-200);
  --rgb-first-light: var(--rgb-yellow-300);
  --rgb-first: var(--rgb-yellow-500);
  --rgb-first-dark: var(--rgb-yellow-500);
  --rgb-first-darker: var(--rgb-yellow-500);
  /* For secondary sections in sso */
  --rgb-second-lighter: var(--rgb-indigo-100);
  --rgb-second-light: var(--rgb-indigo-300);
  --rgb-second: var(--rgb-indigo-500);
  --rgb-second-dark: var(--rgb-indigo-600);
  --rgb-second-darker: var(--rgb-indigo-800);
  /* For secondary sections in profile */
  --rgb-third-lighter: var(--rgb-indigo-50);
  --rgb-third-light: var(--rgb-indigo-200);
  --rgb-third: var(--rgb-indigo-500);
  --rgb-third-dark: var(--rgb-indigo-600);
  --rgb-third-darker: var(--rgb-indigo-800);
  --rgb-forth-lighter: var(--rgb-yellow-50);
  --rgb-forth-light: var(--rgb-yellow-200);
  --rgb-forth: var(--rgb-yellow-400);
  --rgb-forth-dark: var(--rgb-yellow-500);
  --rgb-forth-darker: var(--rgb-yellow-600);
  --rgb-fifth-lighter: var(--rgb-amber-100);
  --rgb-fifth-light: var(--rgb-amber-300);
  --rgb-fifth: var(--rgb-amber-400);
  --rgb-fifth-dark: var(--rgb-amber-600);
  --rgb-fifth-darker: var(--rgb-amber-700);
  /* for active buttons in pagination and so on... */
  --rgb-sixth: var(--rgb-indigo-600);
  /* Very close to first color more uses in "my" */
  --rgb-seventh-lighter: var(--rgb-amber-200);
  --rgb-seventh-light: var(--rgb-amber-300);
  --rgb-seventh: var(--rgb-amber-400);
  --rgb-seventh-dark: var(--rgb-amber-500);
  --rgb-seventh-darker: var(--rgb-amber-600);
  /* Boxes background */
  --rgb-ninth-lighter: var(--rgb-lightest);
  --rgb-ninth-darker: var(--rgb-darkest);
  /* Body background */
  --rgb-tenth-lighter: var(--rgb-yellow-50);
  --rgb-tenth-darker: var(--rgb-yellow-900);
  /* Global Themes End */
}

body.dark {
  /* Global Themes Start */
  --rgb-lightest: 255, 255, 255;
  --rgb-lighter: var(--rgb-slate-800);
  --rgb-light: var(--rgb-slate-500);
  --rgb-light-dark: var(--rgb-slate-300);
  --rgb-dark: var(--rgb-slate-200);
  --rgb-darker: var(--rgb-slate-100);
  --rgb-darkest: var(--rgb-lightest);
  /* Main color for buttons and main areas */
  --rgb-first-lighter: var(--rgb-blue-900);
  --rgb-first-light: var(--rgb-blue-800);
  --rgb-first: var(--rgb-blue-600);
  --rgb-first-dark: var(--rgb-blue-500);
  --rgb-first-darker: var(--rgb-blue-300);
  /* For secondary sections in sso */
  --rgb-second-lighter: var(--rgb-pink-900);
  --rgb-second-light: var(--rgb-pink-700);
  --rgb-second: var(--rgb-pink-500);
  --rgb-second-dark: var(--rgb-pink-400);
  --rgb-second-darker: var(--rgb-pink-300);
  /* For secondary sections in profile */
  --rgb-third-lighter: var(--rgb-blue-800);
  --rgb-third-light: var(--rgb-blue-600);
  --rgb-third: var(--rgb-blue-500);
  --rgb-third-dark: var(--rgb-blue-400);
  --rgb-third-darker: var(--rgb-blue-200);
  --rgb-forth-lighter: var(--rgb-slate-900);
  --rgb-forth-light: var(--rgb-blue-700);
  --rgb-forth: var(--rgb-slate-600);
  --rgb-forth-dark: var(--rgb-slate-600);
  --rgb-forth-darker: var(--rgb-slate-800);
  --rgb-fifth-lighter: var(--rgb-blue-50);
  --rgb-fifth-light: var(--rgb-blue-200);
  --rgb-fifth: var(--rgb-blue-500);
  --rgb-fifth-dark: var(--rgb-blue-700);
  --rgb-fifth-darker: var(--rgb-blue-900);
  /* for active buttons in pagination and so on... */
  --rgb-sixth: var(--rgb-pink-400);
  /* Very close to first color more uses in "my" */
  --rgb-seventh-lighter: var(--rgb-blue-900);
  --rgb-seventh-light: var(--rgb-blue-200);
  --rgb-seventh: var(--rgb-blue-400);
  --rgb-seventh-dark: var(--rgb-blue-600);
  --rgb-seventh-darker: var(--rgb-blue-500);
  /* Boxes background */
  --rgb-ninth-lighter: var(--rgb-slate-800);
  --rgb-ninth-darker: var(--rgb-slate-900);
  /* Body background */
  --rgb-tenth-lighter: var(--rgb-slate-900);
  --rgb-tenth-darker: var(--rgb-slate-900);
  /* Global Themes End */
  --scrollbar-bg: rgb(var(--rgb-slate-700));
  --scrollbar-thumb-bg: rgb(var(--rgb-slate-500));
}

body.faragard-dark {
  /* Global Themes Start */
  --rgb-lightest: 255, 255, 255;
  --rgb-lighter: var(--rgb-slate-800);
  --rgb-light: var(--rgb-slate-500);
  --rgb-light-dark: var(--rgb-slate-300);
  --rgb-dark: var(--rgb-slate-200);
  --rgb-darker: var(--rgb-slate-100);
  --rgb-darkest: var(--rgb-lightest);
  /* Main color for buttons and main areas */
  --rgb-first-lighter: var(--rgb-slate-700);
  --rgb-first-light: var(--rgb-slate-600);
  --rgb-first: var(--rgb-slate-600);
  --rgb-first-dark: var(--rgb-slate-600);
  --rgb-first-darker: var(--rgb-slate-100);
  /* For secondary sections in sso */
  --rgb-second-lighter: var(--rgb-sky-900);
  --rgb-second-light: var(--rgb-sky-700);
  --rgb-second: var(--rgb-sky-500);
  --rgb-second-dark: var(--rgb-sky-400);
  --rgb-second-darker: var(--rgb-sky-300);
  /* For secondary sections in profile */
  --rgb-third-lighter: var(--rgb-blue-800);
  --rgb-third-light: var(--rgb-blue-600);
  --rgb-third: var(--rgb-blue-500);
  --rgb-third-dark: var(--rgb-blue-400);
  --rgb-third-darker: var(--rgb-blue-200);
  --rgb-forth-lighter: var(--rgb-slate-900);
  --rgb-forth-light: var(--rgb-blue-700);
  --rgb-forth: var(--rgb-slate-600);
  --rgb-forth-dark: var(--rgb-slate-600);
  --rgb-forth-darker: var(--rgb-slate-800);
  --rgb-fifth-lighter: var(--rgb-blue-50);
  --rgb-fifth-light: var(--rgb-blue-200);
  --rgb-fifth: var(--rgb-blue-500);
  --rgb-fifth-dark: var(--rgb-blue-700);
  --rgb-fifth-darker: var(--rgb-blue-900);
  /* for active buttons in pagination and so on... */
  --rgb-sixth: var(--rgb-sky-400);
  /* Very close to first color more uses in "my" */
  --rgb-seventh-lighter: var(--rgb-blue-900);
  --rgb-seventh-light: var(--rgb-blue-200);
  --rgb-seventh: var(--rgb-blue-400);
  --rgb-seventh-dark: var(--rgb-blue-600);
  --rgb-seventh-darker: var(--rgb-blue-500);
  /* Boxes background */
  --rgb-ninth-lighter: var(--rgb-slate-800);
  --rgb-ninth-darker: var(--rgb-slate-900);
  /* Body background */
  --rgb-tenth-lighter: var(--rgb-slate-900);
  --rgb-tenth-darker: var(--rgb-slate-900);
  /* Global Themes End */
  --scrollbar-bg: rgb(var(--rgb-slate-700));
  --scrollbar-thumb-bg: rgb(var(--rgb-slate-500));
}

body:not(body.dark) .light\:d-none {
  display: none !important;
}
body:not(body.dark) .light\:d-block {
  display: block !important;
}

body:not(body.faragard-dark) .light\:d-none {
  display: none !important;
}
body:not(body.faragard-dark) .light\:d-block {
  display: block !important;
}

body.dark table.table, body.faragard-dark table.table {
  overflow: hidden;
}
body.dark table.table thead tr th, body.faragard-dark table.table thead tr th {
  background-color: rgb(var(--rgb-ninth-lighter)) !important;
}
body.dark table.table .th-heading, body.faragard-dark table.table .th-heading {
  background-color: rgb(var(--rgb-ninth-lighter)) !important;
}
body.dark table.table-two-by-two tbody tr:nth-of-type(4n + 1):not(.selected) td, body.dark table.table-two-by-two tbody tr:nth-of-type(4n + 2):not(.selected) td, body.faragard-dark table.table-two-by-two tbody tr:nth-of-type(4n + 1):not(.selected) td, body.faragard-dark table.table-two-by-two tbody tr:nth-of-type(4n + 2):not(.selected) td {
  background-color: rgb(var(--rgb-seventh-lighter)) !important;
}
body.dark table.table-two-by-two tbody tr:nth-of-type(4n + 3):not(.selected) td, body.dark table.table-two-by-two tbody tr:nth-of-type(4n + 4):not(.selected) td, body.faragard-dark table.table-two-by-two tbody tr:nth-of-type(4n + 3):not(.selected) td, body.faragard-dark table.table-two-by-two tbody tr:nth-of-type(4n + 4):not(.selected) td {
  background-color: color-mix(in srgb, rgb(var(--rgb-first-lighter)) 97%, white) !important;
}
body.dark table.table.striped tbody tr:nth-of-type(2n + 1):not(.selected) td, body.faragard-dark table.table.striped tbody tr:nth-of-type(2n + 1):not(.selected) td {
  background-color: rgb(var(--rgb-seventh-lighter));
}
body.dark table.table.striped tbody tr:nth-of-type(2n):not(.selected) td, body.faragard-dark table.table.striped tbody tr:nth-of-type(2n):not(.selected) td {
  background-color: color-mix(in srgb, rgb(var(--rgb-first-lighter)) 97%, white);
}
body.dark table.table tbody tr.odd-striped:not(.selected) td, body.faragard-dark table.table tbody tr.odd-striped:not(.selected) td {
  background-color: rgb(var(--rgb-seventh-lighter)) !important;
}
body.dark table.table tbody tr.even-striped:not(.selected) td, body.faragard-dark table.table tbody tr.even-striped:not(.selected) td {
  background-color: color-mix(in srgb, rgb(var(--rgb-first-lighter)) 97%, white) !important;
}
body.dark table.table tbody tr td, body.faragard-dark table.table tbody tr td {
  color: rgb(var(--rgb-darkest)) !important;
}
body.dark .text-muted, body.faragard-dark .text-muted {
  color: rgb(var(--rgb-light-dark)) !important;
}
body.dark .dark\:d-none, body.faragard-dark .dark\:d-none {
  display: none !important;
}
body.dark .dark\:d-block, body.faragard-dark .dark\:d-block {
  display: block !important;
}
body.dark select, body.faragard-dark select {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") !important;
}
body.dark textarea::placeholder, body.faragard-dark textarea::placeholder {
  color: rgb(var(--rgb-slate-400)) !important;
}
body.dark input[type=text]::placeholder,
body.dark input[type=number]::placeholder,
body.dark input[type=date]::placeholder,
body.dark input[type=email]::placeholder,
body.dark input[type=password]::placeholder,
body.dark input[type=tel]::placeholder,
body.dark input[type=search]::placeholder,
body.dark input[type=url]::placeholder,
body.dark input[type=datetime-local]::placeholder,
body.dark input[type=month]::placeholder,
body.dark input[type=time]::placeholder,
body.dark input[type=week]::placeholder,
body.dark input[type=select-one] select::placeholder, body.faragard-dark input[type=text]::placeholder,
body.faragard-dark input[type=number]::placeholder,
body.faragard-dark input[type=date]::placeholder,
body.faragard-dark input[type=email]::placeholder,
body.faragard-dark input[type=password]::placeholder,
body.faragard-dark input[type=tel]::placeholder,
body.faragard-dark input[type=search]::placeholder,
body.faragard-dark input[type=url]::placeholder,
body.faragard-dark input[type=datetime-local]::placeholder,
body.faragard-dark input[type=month]::placeholder,
body.faragard-dark input[type=time]::placeholder,
body.faragard-dark input[type=week]::placeholder,
body.faragard-dark input[type=select-one] select::placeholder {
  color: rgb(var(--rgb-slate-400)) !important;
}
body.dark .form-error, body.faragard-dark .form-error {
  background-color: rgb(var(--rgb-red-600), 0.1) !important;
  border-color: rgb(var(--rgb-red-500)) !important;
}
body.dark .form-error:focus, body.faragard-dark .form-error:focus {
  background-color: rgb(var(--rgb-red-600), 0.1) !important;
  border-color: rgb(var(--rgb-red-500)) !important;
}
body.dark .form-success, body.faragard-dark .form-success {
  background-color: rgb(var(--rgb-green-600), 0.1) !important;
  border-color: rgb(var(--rgb-green-700)) !important;
}
body.dark .form-success:focus, body.faragard-dark .form-success:focus {
  background-color: rgb(var(--rgb-green-600), 0.1) !important;
  border-color: rgb(var(--rgb-green-700)) !important;
}
body.dark .btn-dark, body.faragard-dark .btn-dark {
  background-color: rgb(var(--rgb-first-lighter)) !important;
}
body.dark .form-radio.form-error, body.dark .form-radio.form-success, body.faragard-dark .form-radio.form-error, body.faragard-dark .form-radio.form-success {
  background-color: transparent !important;
}

/* Fonts Start */
@font-face {
  font-family: IRANSans;
  font-style: normal;
  font-weight: bold;
  src: url("../fonts/eot/IRANSansWeb(FaNum)_Bold.eot");
  src: url("../fonts/eot/IRANSansWeb(FaNum)_Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/woff2/IRANSansWeb(FaNum)_Bold.woff2") format("woff2"), url("../fonts/woff/IRANSansWeb(FaNum)_Bold.woff") format("woff"), url("../fonts/ttf/IRANSansWeb(FaNum)_Bold.ttf") format("truetype");
}
@font-face {
  font-family: IRANSans;
  font-style: normal;
  font-weight: 500;
  src: url("../fonts/eot/IRANSansWeb(FaNum)_Medium.eot");
  src: url("../fonts/eot/IRANSansWeb(FaNum)_Medium.eot?#iefix") format("embedded-opentype"), url("../fonts/woff2/IRANSansWeb(FaNum)_Medium.woff2") format("woff2"), url("../fonts/woff/IRANSansWeb(FaNum)_Medium.woff") format("woff"), url("../fonts/ttf/IRANSansWeb(FaNum)_Medium.ttf") format("truetype");
}
@font-face {
  font-family: IRANSans;
  font-style: normal;
  font-weight: 300;
  src: url("../fonts/eot/IRANSansWeb(FaNum)_Light.eot");
  src: url("../fonts/eot/IRANSansWeb(FaNum)_Light.eot?#iefix") format("embedded-opentype"), url("../fonts/woff2/IRANSansWeb(FaNum)_Light.woff2") format("woff2"), url("../fonts/woff/IRANSansWeb(FaNum)_Light.woff") format("woff"), url("../fonts/ttf/IRANSansWeb(FaNum)_Light.ttf") format("truetype");
}
@font-face {
  font-family: IRANSans;
  font-style: normal;
  font-weight: 200;
  src: url("../fonts/eot/IRANSansWeb(FaNum)_UltraLight.eot");
  src: url("../fonts/eot/IRANSansWeb(FaNum)_UltraLight.eot?#iefix") format("embedded-opentype"), url("../fonts/woff2/IRANSansWeb(FaNum)_UltraLight.woff2") format("woff2"), url("../fonts/woff/IRANSansWeb(FaNum)_UltraLight.woff") format("woff"), url("../fonts/ttf/IRANSansWeb(FaNum)_UltraLight.ttf") format("truetype");
}
@font-face {
  font-family: IRANSans;
  font-style: normal;
  font-weight: normal;
  src: url("../fonts/eot/IRANSansWeb(FaNum).eot");
  src: url("../fonts/eot/IRANSansWeb(FaNum).eot?#iefix") format("embedded-opentype"), url("../fonts/woff2/IRANSansWeb(FaNum).woff2") format("woff2"), url("../fonts/woff/IRANSansWeb(FaNum).woff") format("woff"), url("../fonts/ttf/IRANSansWeb(FaNum).ttf") format("truetype");
}
/* Fonts End */
* {
  font-family: IRANSans, Verdana, Tahoma, serif;
  transition: color 100ms, background-color 100ms, box-shadow 100ms;
}

body {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: IRANSans, Verdana, Tahoma, serif;
}

/* Css Reset Start */
/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}

ol,
ul {
  list-style: none;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* Css Reset End */
input {
  background: none;
  outline: none;
  max-width: 100%;
}

select,
option {
  font-family: IRANSans, Verdana, Tahoma, serif !important;
  -moz-font-family: IRANSans, Verdana, Tahoma, serif !important;
}

select {
  position: relative;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: left 0.75rem center;
  background-size: 16px 12px;
  cursor: pointer;
  appearance: none;
  border-radius: 0.75rem;
  font-size: 14px;
  width: 100%;
  transition: all 200ms;
  display: flex;
  align-items: center;
  padding: 8px 16px;
}
html[dir=ltr] select {
  background-position: right 0.75rem center;
}

button {
  outline: none;
  border: none;
  background: transparent;
  font-size: 12px;
  white-space: nowrap;
  font-family: IRANSans, Verdana, Tahoma, serif;
}

label {
  user-select: none;
}

a {
  text-decoration: none;
  font-size: 13px;
  cursor: pointer;
}

p {
  font-size: 13px;
  color: rgb(var(--rgb-darkest));
}

ul {
  margin: 0;
  padding: 0;
}
ul li {
  list-style: none;
}

small {
  font-size: 12px;
}

input[type=text],
input[type=number],
input[type=date],
input[type=email],
input[type=password],
input[type=tel],
input[type=search],
input[type=url],
input[type=datetime-local],
input[type=month],
input[type=time],
input[type=week],
input[type=select-one] select {
  height: 38px !important;
  line-height: 38px;
  border: 1px solid rgb(var(--rgb-light));
  border-radius: 0.75rem;
  transition: 0.4s border-color !important;
  padding: 4px 8px;
  font-size: 14px;
  max-width: 100%;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
}
input[type=text][readonly],
input[type=number][readonly],
input[type=date][readonly],
input[type=email][readonly],
input[type=password][readonly],
input[type=tel][readonly],
input[type=search][readonly],
input[type=url][readonly],
input[type=datetime-local][readonly],
input[type=month][readonly],
input[type=time][readonly],
input[type=week][readonly],
input[type=select-one] select[readonly] {
  border: 2px solid rgb(var(--rgb-light));
  -moz-appearance: textfield !important;
  appearance: textfield !important;
}
input[type=text]::placeholder,
input[type=number]::placeholder,
input[type=date]::placeholder,
input[type=email]::placeholder,
input[type=password]::placeholder,
input[type=tel]::placeholder,
input[type=search]::placeholder,
input[type=url]::placeholder,
input[type=datetime-local]::placeholder,
input[type=month]::placeholder,
input[type=time]::placeholder,
input[type=week]::placeholder,
input[type=select-one] select::placeholder {
  color: rgb(var(--rgb-slate-500)) !important;
}

textarea {
  line-height: 38px;
  border: 1px solid rgb(var(--rgb-zinc-300));
  border-radius: 0.75rem;
  transition: 0.4s border-color !important;
  font-size: 14px;
}
textarea[readonly] {
  border: 2px solid rgb(var(--rgb-zinc-300));
}
textarea::placeholder {
  color: rgb(var(--rgb-slate-500)) !important;
}

label {
  cursor: pointer;
}

input[type=search]::-webkit-search-decoration,
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-results-button,
input[type=search]::-webkit-search-results-decoration {
  display: none;
}

input[type=color] {
  width: 30px;
  height: 30px;
  border-radius: 8px;
  overflow: hidden;
  display: block;
  outline: none;
  padding: 0 !important;
  border: 3px solid rgb(var(--rgb-zinc-300));
  margin: 4px 8px 4px 0;
}
input[type=color]::-moz-color-swatch {
  border: none;
}
input[type=color]::-webkit-color-swatch-wrapper {
  padding: 0;
  border-radius: 0;
}
input[type=color]::-webkit-color-swatch {
  border: none;
}
input[type=color]:focus {
  border-color: rgb(var(--rgb-zinc-300)) !important;
}

/* 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;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-background-clip: text;
  -webkit-text-fill-color: rgb(var(--rgb-darkest));
  transition: background-color 5000s ease-in-out 0s;
}

div[tabindex],
label[tabindex],
button[tabindex] {
  transition: outline 200ms;
  outline: 0 solid transparent;
}
div[tabindex]:focus-visible,
label[tabindex]:focus-visible,
button[tabindex]:focus-visible {
  border-radius: 0.3rem;
  outline-color: rgb(var(--rgb-light)) !important;
  outline-width: 3px;
  outline-offset: 3px;
}

h1 {
  font-size: 30px;
  font-weight: bold;
}

h2 {
  font-size: 26px;
  font-weight: bold;
}

h3 {
  font-size: 22px;
  font-weight: bold;
}

h4 {
  font-size: 20px;
  font-weight: bold;
}

h5 {
  font-size: 18px;
  font-weight: bold;
}

h6 {
  font-size: 14px;
  font-weight: bold;
}

:is(h1,
h2,
h3,
h4,
h5,
h6) {
  color: rgb(var(--rgb-darkest));
}

img, svg {
  max-width: 100%;
}

input:focus,
select:focus,
textarea:focus {
  outline: none !important;
  border-color: rgb(var(--rgb-blue-900)) !important;
  box-shadow: 0 1px 15px rgb(var(--rgb-darkest)/4%), 0 1px 6px rgb(var(--rgb-darkest)/4%) !important;
}

textarea {
  overflow: hidden;
  overflow-y: auto;
}
textarea::-webkit-scrollbar {
  width: 8px;
  border-radius: 8px;
}
textarea::-webkit-scrollbar-track {
  background: var(--scrollbar-bg);
}
textarea::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb-bg);
  border-radius: 8px;
}

video {
  max-width: 100%;
}

.text-lightest {
  color: rgb(var(--rgb-lightest)) !important;
}

.text-lighter {
  color: rgb(var(--rgb-lighter)) !important;
}

.text-light {
  color: rgb(var(--rgb-light)) !important;
}

.text-light-dark {
  color: rgb(var(--rgb-light-dark)) !important;
}

.text-sixth {
  color: rgb(var(--rgb-sixth)) !important;
}

.text-darker {
  color: rgb(var(--rgb-darker)) !important;
}

.text-darkest {
  color: rgb(var(--rgb-darkest)) !important;
}

.text-first-darker {
  color: rgb(var(--rgb-first-darker)) !important;
}

.text-light-dark {
  color: rgb(var(--rgb-light-dark)) !important;
}

.text-second-dark {
  color: rgb(var(--rgb-seventh-dark)) !important;
}

.text-second-darker {
  color: rgb(var(--rgb-seventh-darker)) !important;
}

.text-success {
  color: rgb(var(--rgb-green-600)) !important;
}

.text-danger {
  color: rgb(var(--rgb-red-600)) !important;
}

.text-seventh-darker {
  color: rgb(var(--rgb-seventh-darker)) !important;
}

.one-line {
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
}

.two-lines-only {
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

.three-lines-only {
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

.ltr {
  text-align: left !important;
  direction: ltr;
}

.rtl {
  text-align: right !important;
  direction: rtl;
}

.hide {
  display: none !important;
}

.w-fit {
  width: fit-content !important;
}

.h-fit {
  height: fit-content !important;
}

@media only screen and (max-width: 360px) {
  .d-xs-none {
    display: none;
  }
}

@media only screen and (max-width: 360px) {
  .d-xs-block {
    display: block;
  }
}

.min-h-inherit {
  min-height: inherit !important;
}

.zindex-1 {
  z-index: 1;
}

/* Buttons start */
.btn-third {
  align-items: center;
  color: rgb(var(--rgb-light-dark)) !important;
  font-weight: normal;
  border-radius: 6px;
  min-width: 40px;
  height: 36px;
  font-size: 10px;
  gap: 4px;
}
.btn-third i {
  font-size: 12px;
}
.btn-third:hover, .btn-third:active {
  color: rgb(var(--rgb-light-dark));
  background-color: rgb(var(--rgb-darkest), 0.05) !important;
}

/* Buttons end */
.section {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: min-content;
  border-radius: 8px;
  background-color: rgb(var(--rgb-ninth-lighter));
  box-shadow: 0 0 10px 0 rgba(var(--rgb-darkest), 0.06);
}
.section .section-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  padding: 18px 0 6px 0;
  margin-left: 30px;
  margin-right: 30px;
  border-bottom: 1px solid rgba(var(--rgb-darkest), 0.1);
  border-radius: var(--radius-md) var(--radius-md) 0 0;
}
.section .section-header img, .section .section-header svg {
  width: 32px;
  height: 32px;
  max-width: 100%;
  border-radius: 6px;
}
.section .section-header :is(h1,
h2,
h3) {
  color: rgb(var(--rgb-blue-600));
  font-size: 15px;
  font-weight: 700;
  margin: 0;
}
.section .section-header :is(h4,
h5,
h6) {
  color: rgb(var(--rgb-blue-600));
  font-size: 15px;
  font-weight: 400;
  margin: 0;
}
.section .section-header :is(h1,
h2,
h3,
h4,
h5,
h6) {
  color: rgb(var(--rgb-first-darker)) !important;
}
.section .section-body {
  padding: 16px 30px;
  min-height: 470px;
}
.section .section-footer {
  display: flex;
  align-items: center;
  justify-content: end;
  flex-wrap: wrap;
  gap: 12px;
  width: 100%;
  min-height: 70px !important;
  background-color: rgb(var(--rgb-first-lighter));
  padding: 16px 24px;
  border-radius: 0 0 var(--radius-md) var(--radius-md);
}

@media only screen and (max-width: 575px) {
  .section-header {
    margin-left: 16px !important;
    margin-right: 16px !important;
  }
  .section-body,
  .section-footer {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}
.IR-sans {
  font-family: IRANSans, Verdana, Tahoma, serif !important;
}

.fa-rtl {
  transform: scaleX(-1) !important;
}

.f-center {
  display: flex;
  justify-content: center;
  align-items: center;
}

.g-center {
  display: flex;
  place-items: center;
}

.cursor-pointer {
  cursor: pointer;
}

.text-justify {
  text-align: justify;
}

.fs-8 {
  font-size: 8px !important;
}

.fs-9 {
  font-size: 9px !important;
}

.fs-10 {
  font-size: 10px !important;
}

.fs-11 {
  font-size: 11px !important;
}

.fs-12 {
  font-size: 12px !important;
}

.fs-13 {
  font-size: 13px !important;
}

.fs-14 {
  font-size: 14px !important;
}

.fs-15 {
  font-size: 15px !important;
}

.fs-16 {
  font-size: 16px !important;
}

.fs-17 {
  font-size: 17px !important;
}

.fs-18 {
  font-size: 18px !important;
}

.fs-19 {
  font-size: 19px !important;
}

.fs-20 {
  font-size: 20px !important;
}

.fs-21 {
  font-size: 21px !important;
}

.fs-22 {
  font-size: 22px !important;
}

.fs-23 {
  font-size: 23px !important;
}

.fs-24 {
  font-size: 24px !important;
}

.fs-25 {
  font-size: 25px !important;
}

.fs-26 {
  font-size: 26px !important;
}

.fs-27 {
  font-size: 27px !important;
}

.fs-28 {
  font-size: 28px !important;
}

.fs-29 {
  font-size: 29px !important;
}

.fs-30 {
  font-size: 30px !important;
}

.fw-100 {
  font-weight: 100 !important;
}

.fw-200 {
  font-weight: 200 !important;
}

.fw-300 {
  font-weight: 300 !important;
}

.fw-400 {
  font-weight: 400 !important;
}

.fw-500 {
  font-weight: 500 !important;
}

.fw-600 {
  font-weight: 600 !important;
}

.fw-700 {
  font-weight: 700 !important;
}

.fw-800 {
  font-weight: 800 !important;
}

.fw-900 {
  font-weight: 900 !important;
}

.ls-1 {
  letter-spacing: 1px !important;
}

.ls-2 {
  letter-spacing: 2px !important;
}

.ls-3 {
  letter-spacing: 3px !important;
}

.ls-4 {
  letter-spacing: 4px !important;
}

.col-span-1 {
  grid-column: span 1/span 1;
}

.col-span-2 {
  grid-column: span 2/span 2;
}

.col-span-3 {
  grid-column: span 3/span 3;
}

.col-span-4 {
  grid-column: span 4/span 4;
}

.col-span-5 {
  grid-column: span 5/span 5;
}

.col-span-6 {
  grid-column: span 6/span 6;
}

.col-span-7 {
  grid-column: span 7/span 7;
}

.col-span-8 {
  grid-column: span 8/span 8;
}

.col-span-9 {
  grid-column: span 9/span 9;
}

.col-span-10 {
  grid-column: span 10/span 10;
}

.col-span-11 {
  grid-column: span 11/span 11;
}

.col-span-12 {
  grid-column: span 12/span 12;
}

@media only screen and (min-width: 575px) {
  .col-span-sm-1 {
    grid-column: span 1/span 1;
  }
}

@media only screen and (min-width: 575px) {
  .col-span-sm-2 {
    grid-column: span 2/span 2;
  }
}

@media only screen and (min-width: 575px) {
  .col-span-sm-3 {
    grid-column: span 3/span 3;
  }
}

@media only screen and (min-width: 575px) {
  .col-span-sm-4 {
    grid-column: span 4/span 4;
  }
}

@media only screen and (min-width: 575px) {
  .col-span-sm-5 {
    grid-column: span 5/span 5;
  }
}

@media only screen and (min-width: 575px) {
  .col-span-sm-6 {
    grid-column: span 6/span 6;
  }
}

@media only screen and (min-width: 575px) {
  .col-span-sm-7 {
    grid-column: span 7/span 7;
  }
}

@media only screen and (min-width: 575px) {
  .col-span-sm-8 {
    grid-column: span 8/span 8;
  }
}

@media only screen and (min-width: 575px) {
  .col-span-sm-9 {
    grid-column: span 9/span 9;
  }
}

@media only screen and (min-width: 575px) {
  .col-span-sm-10 {
    grid-column: span 10/span 10;
  }
}

@media only screen and (min-width: 575px) {
  .col-span-sm-11 {
    grid-column: span 11/span 11;
  }
}

@media only screen and (min-width: 575px) {
  .col-span-sm-12 {
    grid-column: span 12/span 12;
  }
}

@media only screen and (min-width: 767px) {
  .col-span-md-1 {
    grid-column: span 1/span 1;
  }
}

@media only screen and (min-width: 767px) {
  .col-span-md-2 {
    grid-column: span 2/span 2;
  }
}

@media only screen and (min-width: 767px) {
  .col-span-md-3 {
    grid-column: span 3/span 3;
  }
}

@media only screen and (min-width: 767px) {
  .col-span-md-4 {
    grid-column: span 4/span 4;
  }
}

@media only screen and (min-width: 767px) {
  .col-span-md-5 {
    grid-column: span 5/span 5;
  }
}

@media only screen and (min-width: 767px) {
  .col-span-md-6 {
    grid-column: span 6/span 6;
  }
}

@media only screen and (min-width: 767px) {
  .col-span-md-7 {
    grid-column: span 7/span 7;
  }
}

@media only screen and (min-width: 767px) {
  .col-span-md-8 {
    grid-column: span 8/span 8;
  }
}

@media only screen and (min-width: 767px) {
  .col-span-md-9 {
    grid-column: span 9/span 9;
  }
}

@media only screen and (min-width: 767px) {
  .col-span-md-10 {
    grid-column: span 10/span 10;
  }
}

@media only screen and (min-width: 767px) {
  .col-span-md-11 {
    grid-column: span 11/span 11;
  }
}

@media only screen and (min-width: 767px) {
  .col-span-md-12 {
    grid-column: span 12/span 12;
  }
}

@media only screen and (min-width: 992px) {
  .col-span-lg-1 {
    grid-column: span 1/span 1;
  }
}

@media only screen and (min-width: 992px) {
  .col-span-lg-2 {
    grid-column: span 2/span 2;
  }
}

@media only screen and (min-width: 992px) {
  .col-span-lg-3 {
    grid-column: span 3/span 3;
  }
}

@media only screen and (min-width: 992px) {
  .col-span-lg-4 {
    grid-column: span 4/span 4;
  }
}

@media only screen and (min-width: 992px) {
  .col-span-lg-5 {
    grid-column: span 5/span 5;
  }
}

@media only screen and (min-width: 992px) {
  .col-span-lg-6 {
    grid-column: span 6/span 6;
  }
}

@media only screen and (min-width: 992px) {
  .col-span-lg-7 {
    grid-column: span 7/span 7;
  }
}

@media only screen and (min-width: 992px) {
  .col-span-lg-8 {
    grid-column: span 8/span 8;
  }
}

@media only screen and (min-width: 992px) {
  .col-span-lg-9 {
    grid-column: span 9/span 9;
  }
}

@media only screen and (min-width: 992px) {
  .col-span-lg-10 {
    grid-column: span 10/span 10;
  }
}

@media only screen and (min-width: 992px) {
  .col-span-lg-11 {
    grid-column: span 11/span 11;
  }
}

@media only screen and (min-width: 992px) {
  .col-span-lg-12 {
    grid-column: span 12/span 12;
  }
}

@media only screen and (min-width: 1200px) {
  .col-span-xl-1 {
    grid-column: span 1/span 1;
  }
}

@media only screen and (min-width: 1200px) {
  .col-span-xl-2 {
    grid-column: span 2/span 2;
  }
}

@media only screen and (min-width: 1200px) {
  .col-span-xl-3 {
    grid-column: span 3/span 3;
  }
}

@media only screen and (min-width: 1200px) {
  .col-span-xl-4 {
    grid-column: span 4/span 4;
  }
}

@media only screen and (min-width: 1200px) {
  .col-span-xl-5 {
    grid-column: span 5/span 5;
  }
}

@media only screen and (min-width: 1200px) {
  .col-span-xl-6 {
    grid-column: span 6/span 6;
  }
}

@media only screen and (min-width: 1200px) {
  .col-span-xl-7 {
    grid-column: span 7/span 7;
  }
}

@media only screen and (min-width: 1200px) {
  .col-span-xl-8 {
    grid-column: span 8/span 8;
  }
}

@media only screen and (min-width: 1200px) {
  .col-span-xl-9 {
    grid-column: span 9/span 9;
  }
}

@media only screen and (min-width: 1200px) {
  .col-span-xl-10 {
    grid-column: span 10/span 10;
  }
}

@media only screen and (min-width: 1200px) {
  .col-span-xl-11 {
    grid-column: span 11/span 11;
  }
}

@media only screen and (min-width: 1200px) {
  .col-span-xl-12 {
    grid-column: span 12/span 12;
  }
}

@media only screen and (min-width: 1400px) {
  .col-span-xxl-1 {
    grid-column: span 1/span 1;
  }
}

@media only screen and (min-width: 1400px) {
  .col-span-xxl-2 {
    grid-column: span 2/span 2;
  }
}

@media only screen and (min-width: 1400px) {
  .col-span-xxl-3 {
    grid-column: span 3/span 3;
  }
}

@media only screen and (min-width: 1400px) {
  .col-span-xxl-4 {
    grid-column: span 4/span 4;
  }
}

@media only screen and (min-width: 1400px) {
  .col-span-xxl-5 {
    grid-column: span 5/span 5;
  }
}

@media only screen and (min-width: 1400px) {
  .col-span-xxl-6 {
    grid-column: span 6/span 6;
  }
}

@media only screen and (min-width: 1400px) {
  .col-span-xxl-7 {
    grid-column: span 7/span 7;
  }
}

@media only screen and (min-width: 1400px) {
  .col-span-xxl-8 {
    grid-column: span 8/span 8;
  }
}

@media only screen and (min-width: 1400px) {
  .col-span-xxl-9 {
    grid-column: span 9/span 9;
  }
}

@media only screen and (min-width: 1400px) {
  .col-span-xxl-10 {
    grid-column: span 10/span 10;
  }
}

@media only screen and (min-width: 1400px) {
  .col-span-xxl-11 {
    grid-column: span 11/span 11;
  }
}

@media only screen and (min-width: 1400px) {
  .col-span-xxl-12 {
    grid-column: span 12/span 12;
  }
}

.row-span-1 {
  grid-row: span 1/span 1;
}

.row-span-2 {
  grid-row: span 2/span 2;
}

.row-span-3 {
  grid-row: span 3/span 3;
}

.row-span-4 {
  grid-row: span 4/span 4;
}

.row-span-5 {
  grid-row: span 5/span 5;
}

.row-span-6 {
  grid-row: span 6/span 6;
}

.row-span-7 {
  grid-row: span 7/span 7;
}

.row-span-8 {
  grid-row: span 8/span 8;
}

.row-span-9 {
  grid-row: span 9/span 9;
}

.row-span-10 {
  grid-row: span 10/span 10;
}

.row-span-11 {
  grid-row: span 11/span 11;
}

.row-span-12 {
  grid-row: span 12/span 12;
}

@media only screen and (min-width: 575px) {
  .row-span-sm-1 {
    grid-row: span 1/span 1;
  }
}

@media only screen and (min-width: 575px) {
  .row-span-sm-2 {
    grid-row: span 2/span 2;
  }
}

@media only screen and (min-width: 575px) {
  .row-span-sm-3 {
    grid-row: span 3/span 3;
  }
}

@media only screen and (min-width: 575px) {
  .row-span-sm-4 {
    grid-row: span 4/span 4;
  }
}

@media only screen and (min-width: 575px) {
  .row-span-sm-5 {
    grid-row: span 5/span 5;
  }
}

@media only screen and (min-width: 575px) {
  .row-span-sm-6 {
    grid-row: span 6/span 6;
  }
}

@media only screen and (min-width: 575px) {
  .row-span-sm-7 {
    grid-row: span 7/span 7;
  }
}

@media only screen and (min-width: 575px) {
  .row-span-sm-8 {
    grid-row: span 8/span 8;
  }
}

@media only screen and (min-width: 575px) {
  .row-span-sm-9 {
    grid-row: span 9/span 9;
  }
}

@media only screen and (min-width: 575px) {
  .row-span-sm-10 {
    grid-row: span 10/span 10;
  }
}

@media only screen and (min-width: 575px) {
  .row-span-sm-11 {
    grid-row: span 11/span 11;
  }
}

@media only screen and (min-width: 575px) {
  .row-span-sm-12 {
    grid-row: span 12/span 12;
  }
}

@media only screen and (min-width: 767px) {
  .row-span-md-1 {
    grid-row: span 1/span 1;
  }
}

@media only screen and (min-width: 767px) {
  .row-span-md-2 {
    grid-row: span 2/span 2;
  }
}

@media only screen and (min-width: 767px) {
  .row-span-md-3 {
    grid-row: span 3/span 3;
  }
}

@media only screen and (min-width: 767px) {
  .row-span-md-4 {
    grid-row: span 4/span 4;
  }
}

@media only screen and (min-width: 767px) {
  .row-span-md-5 {
    grid-row: span 5/span 5;
  }
}

@media only screen and (min-width: 767px) {
  .row-span-md-6 {
    grid-row: span 6/span 6;
  }
}

@media only screen and (min-width: 767px) {
  .row-span-md-7 {
    grid-row: span 7/span 7;
  }
}

@media only screen and (min-width: 767px) {
  .row-span-md-8 {
    grid-row: span 8/span 8;
  }
}

@media only screen and (min-width: 767px) {
  .row-span-md-9 {
    grid-row: span 9/span 9;
  }
}

@media only screen and (min-width: 767px) {
  .row-span-md-10 {
    grid-row: span 10/span 10;
  }
}

@media only screen and (min-width: 767px) {
  .row-span-md-11 {
    grid-row: span 11/span 11;
  }
}

@media only screen and (min-width: 767px) {
  .row-span-md-12 {
    grid-row: span 12/span 12;
  }
}

@media only screen and (min-width: 992px) {
  .row-span-lg-1 {
    grid-row: span 1/span 1;
  }
}

@media only screen and (min-width: 992px) {
  .row-span-lg-2 {
    grid-row: span 2/span 2;
  }
}

@media only screen and (min-width: 992px) {
  .row-span-lg-3 {
    grid-row: span 3/span 3;
  }
}

@media only screen and (min-width: 992px) {
  .row-span-lg-4 {
    grid-row: span 4/span 4;
  }
}

@media only screen and (min-width: 992px) {
  .row-span-lg-5 {
    grid-row: span 5/span 5;
  }
}

@media only screen and (min-width: 992px) {
  .row-span-lg-6 {
    grid-row: span 6/span 6;
  }
}

@media only screen and (min-width: 992px) {
  .row-span-lg-7 {
    grid-row: span 7/span 7;
  }
}

@media only screen and (min-width: 992px) {
  .row-span-lg-8 {
    grid-row: span 8/span 8;
  }
}

@media only screen and (min-width: 992px) {
  .row-span-lg-9 {
    grid-row: span 9/span 9;
  }
}

@media only screen and (min-width: 992px) {
  .row-span-lg-10 {
    grid-row: span 10/span 10;
  }
}

@media only screen and (min-width: 992px) {
  .row-span-lg-11 {
    grid-row: span 11/span 11;
  }
}

@media only screen and (min-width: 992px) {
  .row-span-lg-12 {
    grid-row: span 12/span 12;
  }
}

@media only screen and (min-width: 1200px) {
  .row-span-xl-1 {
    grid-row: span 1/span 1;
  }
}

@media only screen and (min-width: 1200px) {
  .row-span-xl-2 {
    grid-row: span 2/span 2;
  }
}

@media only screen and (min-width: 1200px) {
  .row-span-xl-3 {
    grid-row: span 3/span 3;
  }
}

@media only screen and (min-width: 1200px) {
  .row-span-xl-4 {
    grid-row: span 4/span 4;
  }
}

@media only screen and (min-width: 1200px) {
  .row-span-xl-5 {
    grid-row: span 5/span 5;
  }
}

@media only screen and (min-width: 1200px) {
  .row-span-xl-6 {
    grid-row: span 6/span 6;
  }
}

@media only screen and (min-width: 1200px) {
  .row-span-xl-7 {
    grid-row: span 7/span 7;
  }
}

@media only screen and (min-width: 1200px) {
  .row-span-xl-8 {
    grid-row: span 8/span 8;
  }
}

@media only screen and (min-width: 1200px) {
  .row-span-xl-9 {
    grid-row: span 9/span 9;
  }
}

@media only screen and (min-width: 1200px) {
  .row-span-xl-10 {
    grid-row: span 10/span 10;
  }
}

@media only screen and (min-width: 1200px) {
  .row-span-xl-11 {
    grid-row: span 11/span 11;
  }
}

@media only screen and (min-width: 1200px) {
  .row-span-xl-12 {
    grid-row: span 12/span 12;
  }
}

@media only screen and (min-width: 1400px) {
  .row-span-xxl-1 {
    grid-row: span 1/span 1;
  }
}

@media only screen and (min-width: 1400px) {
  .row-span-xxl-2 {
    grid-row: span 2/span 2;
  }
}

@media only screen and (min-width: 1400px) {
  .row-span-xxl-3 {
    grid-row: span 3/span 3;
  }
}

@media only screen and (min-width: 1400px) {
  .row-span-xxl-4 {
    grid-row: span 4/span 4;
  }
}

@media only screen and (min-width: 1400px) {
  .row-span-xxl-5 {
    grid-row: span 5/span 5;
  }
}

@media only screen and (min-width: 1400px) {
  .row-span-xxl-6 {
    grid-row: span 6/span 6;
  }
}

@media only screen and (min-width: 1400px) {
  .row-span-xxl-7 {
    grid-row: span 7/span 7;
  }
}

@media only screen and (min-width: 1400px) {
  .row-span-xxl-8 {
    grid-row: span 8/span 8;
  }
}

@media only screen and (min-width: 1400px) {
  .row-span-xxl-9 {
    grid-row: span 9/span 9;
  }
}

@media only screen and (min-width: 1400px) {
  .row-span-xxl-10 {
    grid-row: span 10/span 10;
  }
}

@media only screen and (min-width: 1400px) {
  .row-span-xxl-11 {
    grid-row: span 11/span 11;
  }
}

@media only screen and (min-width: 1400px) {
  .row-span-xxl-12 {
    grid-row: span 12/span 12;
  }
}

.opacity-10 {
  opacity: 0.1 !important;
}

.opacity-20 {
  opacity: 0.2 !important;
}

.opacity-30 {
  opacity: 0.3 !important;
}

.opacity-40 {
  opacity: 0.4 !important;
}

.opacity-50 {
  opacity: 0.5 !important;
}

.opacity-60 {
  opacity: 0.6 !important;
}

.opacity-70 {
  opacity: 0.7 !important;
}

.opacity-80 {
  opacity: 0.8 !important;
}

.opacity-90 {
  opacity: 0.9 !important;
}

.opacity-100 {
  opacity: 1 !important;
}

.order-1 {
  order: 1 !important;
}

@media only screen and (min-width: 767px) {
  .order-md-1 {
    order: 1 !important;
  }
}
.order-2 {
  order: 2 !important;
}

@media only screen and (min-width: 767px) {
  .order-md-2 {
    order: 2 !important;
  }
}
.order-3 {
  order: 3 !important;
}

@media only screen and (min-width: 767px) {
  .order-md-3 {
    order: 3 !important;
  }
}
.order-4 {
  order: 4 !important;
}

@media only screen and (min-width: 767px) {
  .order-md-4 {
    order: 4 !important;
  }
}
.order-5 {
  order: 5 !important;
}

@media only screen and (min-width: 767px) {
  .order-md-5 {
    order: 5 !important;
  }
}
.order-6 {
  order: 6 !important;
}

@media only screen and (min-width: 767px) {
  .order-md-6 {
    order: 6 !important;
  }
}
.order-7 {
  order: 7 !important;
}

@media only screen and (min-width: 767px) {
  .order-md-7 {
    order: 7 !important;
  }
}
.order-8 {
  order: 8 !important;
}

@media only screen and (min-width: 767px) {
  .order-md-8 {
    order: 8 !important;
  }
}
.order-9 {
  order: 9 !important;
}

@media only screen and (min-width: 767px) {
  .order-md-9 {
    order: 9 !important;
  }
}
.order-10 {
  order: 10 !important;
}

@media only screen and (min-width: 767px) {
  .order-md-10 {
    order: 10 !important;
  }
}
.order-11 {
  order: 11 !important;
}

@media only screen and (min-width: 767px) {
  .order-md-11 {
    order: 11 !important;
  }
}
.order-12 {
  order: 12 !important;
}

@media only screen and (min-width: 767px) {
  .order-md-12 {
    order: 12 !important;
  }
}
.z-100 {
  z-index: 100 !important;
}

.z-200 {
  z-index: 200 !important;
}

.z-300 {
  z-index: 300 !important;
}

.z-400 {
  z-index: 400 !important;
}

.z-500 {
  z-index: 500 !important;
}

.z-600 {
  z-index: 600 !important;
}

.z-700 {
  z-index: 700 !important;
}

.z-800 {
  z-index: 800 !important;
}

.z-900 {
  z-index: 900 !important;
}

.z-1000 {
  z-index: 1000 !important;
}

.ls-sm {
  letter-spacing: 4px;
}

.ls-md {
  letter-spacing: 8px;
}

.ls-lg {
  letter-spacing: 12px;
}

.ls-xl {
  letter-spacing: 16px;
}

.shadow-sm {
  box-shadow: 0 0.125rem 0.25rem rgba(var(--rgb-darkest), 0.075) !important;
}

.form-group {
  border-radius: 0.75rem;
  padding: 12px 16px;
}

.form_group {
  border: 2px solid rgb(var(--rgb-zinc-300));
}

.form-switch-wrapper {
  padding: 12px 16px;
}

.mce-edit-area {
  min-height: 250px;
}

select.form-control {
  padding-left: 36px;
  user-select: none;
  line-clamp: 1;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 13px;
  display: -webkit-box;
}
html[dir=ltr] select.form-control {
  padding-right: 36px;
  padding-left: 12px;
}

select.form-control-sm {
  min-height: 26px;
  line-height: 14px;
  font-size: 12px;
  width: fit-content;
}
select.form-control[multiple] {
  overflow-y: auto;
  background-image: none !important;
  padding-left: 0.75rem;
  max-height: 110px;
}
html[dir=ltr] select.form-control[multiple] {
  padding-right: 0.75rem;
  padding-left: 0;
}

select.form-control[multiple]::-webkit-scrollbar {
  width: 8px !important;
  height: 8px !important;
  border-radius: 8px !important;
}
select.form-control[multiple]::-webkit-scrollbar-track {
  background: var(--scrollbar-bg);
}
select.form-control[multiple]::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb-bg);
  border-radius: 8px !important;
}

.form-control {
  border-radius: 0.75rem;
  font-size: 14px;
  width: 100%;
  transition: all 200ms;
  background-color: rgb(var(--rgb-lighter));
  border-color: rgb(var(--rgb-light));
  color: rgb(var(--rgb-dark));
  min-height: 40px;
  display: flex;
  align-items: center;
  line-height: 27px;
}
.form-control:focus {
  border-radius: 0.75rem;
  outline: 0;
  box-shadow: none;
  color: rgb(var(--rgb-darkest));
  background-color: rgb(var(--rgb-ninth-lighter)) !important;
  border-color: rgb(var(--rgb-first-darker)) !important;
}
.form-border {
  border: 1px solid transparent !important;
}
.form-error {
  border-radius: 0.75rem;
  background-color: rgb(var(--rgb-red-50)) !important;
  border-color: rgb(var(--rgb-red-600)) !important;
}
.form-error:focus {
  background-color: rgb(var(--rgb-red-50)) !important;
  border-color: rgb(var(--rgb-red-600)) !important;
}
.form-success {
  border-radius: 0.75rem;
  background-color: rgb(var(--rgb-green-50)) !important;
  border-color: rgb(var(--rgb-green-700)) !important;
}
.form-success-border {
  border: 1px solid rgb(var(--rgb-green-700)) !important;
}
.form-success:focus {
  background-color: rgb(var(--rgb-green-50)) !important;
  border-color: rgb(var(--rgb-green-700)) !important;
}

@media screen and (max-width: 360px) {
  .col-xs-12 {
    width: 100% !important;
  }
}
.border-light {
  border-color: rgb(var(--rgb-light)) !important;
}

.btn {
  font-size: 12px;
  font-weight: 400;
  white-space: nowrap;
  --bs-btn-color: transparent;
  --bs-btn-bg: transparent;
  --bs-btn-border-width: none;
  --bs-btn-border-color: transparent;
  --bs-btn-border-radius: 6px;
  --bs-btn-hover-border-color: transparent;
  --bs-btn-box-shadow: none;
  --bs-btn-disabled-opacity: 0.65;
  --bs-btn-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-btn-focus-shadow-rgb), 0.5);
  padding: 4px 12px;
  line-height: 26px;
  color: var(--text-lightest);
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  border: none;
  border-radius: 6px;
  background-color: transparent;
  transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}

.btn:focus-visible,
.btn:active {
  box-shadow: none !important;
  outline: none !important;
}

.btn-close {
  background: none;
  color: rgb(var(--rgb-red-500));
  padding: 0 !important;
  width: 30px;
  height: 30px;
  opacity: 0.8;
}
.btn-close:hover {
  color: rgb(var(--rgb-red-500));
}
.btn-close:focus {
  outline: 0;
  box-shadow: 0 0 0 0.25rem rgba(var(--rgb-first), 0.25);
}
.btn-close i {
  font-size: 16px;
}

.btn-sm {
  height: 30px !important;
  padding-left: 9px;
  padding-right: 9px;
  font-size: 12px;
}

.btn-danger {
  background-color: rgb(var(--rgb-red-700)) !important;
  color: rgb(var(--rgb-lightest)) !important;
  height: 40px;
  gap: 6px;
}
.btn-danger:hover, .btn-danger:active, .btn-danger:focus-visible {
  background-color: rgb(var(--rgb-red-800)) !important;
  box-shadow: 0 0 4px 1px rgba(var(--rgb-darkest), 0.4);
}

.btn-success {
  background-color: rgb(var(--rgb-green-700)) !important;
  color: rgb(var(--rgb-lightest)) !important;
  height: 40px;
  gap: 6px;
}
.btn-success:hover, .btn-success:active, .btn-success:focus-visible {
  background-color: rgb(var(--rgb-green-800)) !important;
  box-shadow: 0 0 4px 1px rgba(var(--rgb-darkest), 0.4);
}

.btn-warning {
  background-color: rgb(var(--rgb-amber-500)) !important;
  color: rgb(var(--rgb-lightest)) !important;
  height: 40px;
  gap: 6px;
}
.btn-warning:hover, .btn-warning:active, .btn-warning:focus-visible {
  background-color: rgb(var(--rgb-amber-600)) !important;
  box-shadow: 0 0 4px 1px rgba(var(--rgb-darkest), 0.4);
}

.btn-info {
  background-color: rgb(var(--rgb-cyan-600)) !important;
  color: rgb(var(--rgb-lightest)) !important;
  height: 40px;
  gap: 6px;
}
.btn-info:hover, .btn-info:active, .btn-info:focus-visible {
  background-color: rgb(var(--rgb-cyan-700)) !important;
  box-shadow: 0 0 4px 1px rgba(var(--rgb-darkest), 0.4);
}

.btn-first {
  background-color: rgb(var(--rgb-first)) !important;
  color: rgb(var(--rgb-lightest)) !important;
  height: 40px;
  gap: 6px;
}
.btn-first:hover, .btn-first:active, .btn-first:focus-visible {
  background-color: rgb(var(--rgb-first)) !important;
  box-shadow: 0 0 4px 1px rgba(var(--rgb-darkest), 0.4);
}

.btn-first-light {
  background-color: rgb(var(--rgb-first-lighter)) !important;
  color: rgb(var(--rgb-first-darker)) !important;
  box-shadow: none;
  height: 40px;
  gap: 6px;
}
.btn-first-light:hover, .btn-first-light:active, .btn-first-light:focus-visible {
  background-color: rgb(var(--rgb-first-lighter), 0.7) !important;
  color: rgb(var(--rgb-first-darker)) !important;
}

.btn-dark {
  background-color: rgb(var(--rgb-first-darker)) !important;
  color: rgb(var(--rgb-lightest)) !important;
  height: 40px;
  gap: 6px;
}
.btn-dark:hover, .btn-dark:active, .btn-dark:focus-visible {
  background-color: rgb(var(--rgb-first-darker)) !important;
  box-shadow: 0 0 4px 1px rgba(var(--rgb-darkest), 0.4);
}

.btn-primary {
  background-color: rgb(var(--rgb-blue-600));
  min-width: 110px;
  color: white;
  --bs-btn-border-color: rgb(var(--rgb-blue-600));
  border-radius: 6px;
  height: 40px;
  padding-left: 36px !important;
  padding-right: 36px !important;
  gap: 8px;
  box-shadow: inset 0 1px 0 rgba(var(--rgb-lightest), 0.15), 0 1px 1px rgba(var(--rgb-darkest), 0.075);
  font-weight: 800;
  transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}
.btn-primary:hover, .btn-primary:active, .btn-primary:focus-visible {
  background-color: rgb(var(--rgb-blue-700)) !important;
  box-shadow: 0 0 4px 1px rgba(var(--rgb-darkest), 0.4);
}

.btn-second {
  background-color: rgb(var(--rgb-seventh-dark));
  min-width: 110px;
  color: white;
  --bs-btn-border-color: rgb(var(--rgb-seventh-dark));
  border-radius: 6px;
  height: 40px;
  padding-left: 36px !important;
  padding-right: 36px !important;
  gap: 8px;
  box-shadow: inset 0 1px 0 rgba(var(--rgb-lightest), 0.15), 0 1px 1px rgba(var(--rgb-darkest), 0.075);
  font-weight: 800;
  transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}
.btn-second:hover, .btn-second:active, .btn-second:focus-visible {
  color: rgb(var(--rgb-lightest)) !important;
  background-color: rgb(var(--rgb-seventh-dark)) !important;
  box-shadow: 0 0 4px 1px rgba(var(--rgb-darkest), 0.4);
}

.btn-secondary {
  background-color: rgb(var(--rgb-zinc-600));
  min-width: 110px;
  color: white;
  --bs-btn-border-color: rgb(var(--rgb-zinc-600));
  border-radius: 6px;
  height: 40px;
  padding-left: 36px !important;
  padding-right: 36px !important;
  gap: 6px;
  box-shadow: inset 0 1px 0 rgba(var(--rgb-lightest), 0.15), 0 1px 1px rgba(var(--rgb-darkest), 0.075);
  font-weight: 800;
  transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}
.btn-secondary:hover, .btn-secondary:active, .btn-secondary:focus-visible {
  background-color: rgb(var(--rgb-zinc-700)) !important;
  box-shadow: 0 0 4px 1px rgba(var(--rgb-darkest), 0.4);
}

.btn-light {
  background: rgb(var(--rgb-lighter));
  color: rgb(var(--rgb-darkest));
  border: 1px solid rgb(var(--rgb-light));
  height: 40px;
  gap: 6px;
  transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}
.btn-light:hover, .btn-light:active, .btn-light:focus-visible {
  background-color: rgb(var(--rgb-lighter)) !important;
  color: rgb(var(--rgb-darkest)) !important;
  box-shadow: 0 0 4px 1px rgba(var(--rgb-darkest), 0.4);
}

.btn-forth {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  background: rgb(var(--rgb-first-light));
  color: rgb(var(--rgb-lightest));
  padding: 0.375rem 0.75rem;
}
.btn-forth:hover, .btn-forth:active, .btn-forth:focus-visible {
  background-color: rgb(var(--rgb-first-light)) !important;
  color: rgb(var(--rgb-lightest)) !important;
  box-shadow: 0 0 4px 1px rgba(var(--rgb-darkest), 0.4);
}

.btn-long {
  width: auto;
  height: auto;
  font-weight: normal;
}

/* SSO Btns start */
.btn-primary, .btn-primary:disabled {
  background: rgb(var(--rgb-first-dark));
  --bs-btn-border-color: rgb(var(--rgb-first-dark));
}
.btn-primary:hover, .btn-primary:active, .btn-primary:focus-visible, .btn-primary:disabled:hover, .btn-primary:disabled:active, .btn-primary:disabled:focus-visible {
  background: rgb(var(--rgb-first)) !important;
  box-shadow: 0 0 4px 1px rgba(var(--rgb-darkest), 0.4) !important;
}

.btn-secondary, .btn-secondary:disabled {
  background: transparent;
  border-radius: 6px;
  width: 140px;
  max-width: max-content;
  height: 40px;
  display: grid;
  place-items: center;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 0px rgba(0, 0, 0, 0.075);
  font-weight: 800;
  color: rgb(var(--rgb-second));
  --bs-btn-active-bg: rgb(var(--rgb-second));
  border: 1px solid rgb(var(--rgb-second));
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.btn-secondary:hover, .btn-secondary:active, .btn-secondary:focus-visible, .btn-secondary:disabled:hover, .btn-secondary:disabled:active, .btn-secondary:disabled:focus-visible {
  background-color: rgb(var(--rgb-second)) !important;
  box-shadow: 0 0 4px 1px rgba(0, 0, 0, 0.4);
}

/* SSO Btns end */
.bigger-110 {
  transition: 150ms;
}
.bigger-110:hover {
  transform-origin: center;
  transform: scale(1.2);
}

.overflow-x-auto::-webkit-scrollbar, .overflow-y-auto::-webkit-scrollbar, .overflow-auto::-webkit-scrollbar {
  width: 8px;
}
.overflow-x-auto::-webkit-scrollbar-thumb, .overflow-y-auto::-webkit-scrollbar-thumb, .overflow-auto::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb-bg);
  border-radius: var(--radius-full);
  cursor: pointer;
}
.overflow-x-auto::-webkit-scrollbar-track, .overflow-y-auto::-webkit-scrollbar-track, .overflow-auto::-webkit-scrollbar-track {
  background: var(--scrollbar-bg);
  border-radius: var(--radius-full);
}

.transform-none {
  transform: none !important;
}

.form-label {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 0;
  width: fit-content;
}
.form-label[required|=true]::after, .form-label[required]:not([required|=false])::after {
  content: "*";
  color: rgb(var(--rgb-red-600));
  background: transparent;
  padding-right: 4px;
}
.form-label span[required|=true]::after, .form-label span[required]:not([required|=false])::after {
  content: "*";
  color: rgb(var(--rgb-red-600));
  background: transparent;
  padding-right: 4px;
}
html[dir=ltr] .form-label span[required|=true]::after, html[dir=ltr] .form-label span[required]:not([required|=false])::after {
  padding-left: 4px;
  padding-right: 0;
}

.form-radio {
  width: fit-content;
}

.form-radio input[type=radio] {
  position: absolute;
  opacity: 0;
}

.form-radio label {
  cursor: pointer;
}
.form-radio label > span {
  margin-top: 2px;
}
.form-radio label svg {
  height: 22px;
  cursor: pointer;
  font-size: 22px;
  fill: rgb(var(--rgb-seventh)) !important;
  vertical-align: middle;
  overflow: hidden;
}
.form-radio label svg.radio-on {
  opacity: 0;
  pointer-events: none;
  display: none;
}
.form-radio label svg.radio-off {
  opacity: 1;
  pointer-events: auto;
  display: block;
}
.form-radio input:checked + label svg.radio-off {
  opacity: 0;
  pointer-events: none;
  display: none;
}
.form-radio input:checked + label svg.radio-on {
  display: block;
  opacity: 1;
  pointer-events: auto;
}
.form-radio.form-error {
  background-color: transparent !important;
}
.form-radio.form-error label span {
  color: rgb(var(--rgb-red-600)) !important;
}
.form-radio.form-error label svg {
  fill: rgb(var(--rgb-red-600)) !important;
}
.form-radio.form-success {
  background-color: transparent !important;
}
.form-radio.form-success label span {
  color: rgb(var(--rgb-green-700)) !important;
}
.form-radio.form-success label svg {
  fill: rgb(var(--rgb-green-700)) !important;
}

input.no-style, input.no-style:focus, input.no-style:focus-within, input.no-style:focus-visible {
  background-color: transparent !important;
  border-color: transparent !important;
  outline-color: transparent !important;
}

.counter {
  display: flex;
  align-items: center;
  justify-content: end;
  gap: 4px;
}
.counter span {
  color: rgb(var(--rgb-light-dark));
  font-size: 12px;
}

.form-radio label {
  font-size: 13px !important;
  font-weight: 400 !important;
  white-space: nowrap !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

.form-radio input[type=radio] + label:empty:before {
  margin-right: 0;
}

.nav-tabs {
  border: none;
}
.nav-tabs ul {
  display: flex;
}
.nav-tabs .nav-link {
  color: rgb(var(--rgb-zinc-400));
  font-size: 12px;
  font-weight: 600;
  border: 3px solid transparent;
  transition: all 200ms;
}
.nav-tabs .nav-link.show {
  border-color: transparent;
  color: rgb(var(--rgb-first-darker));
}
.nav-tabs .nav-link:focus-visible {
  outline: 0;
  box-shadow: none;
}
.nav-tabs .nav-link.active {
  color: rgb(var(--rgb-first-darker));
  border-color: transparent;
  border-bottom-color: rgb(var(--rgb-first-darker));
}
body.dark .nav-tabs .nav-link.active, body.dark .nav-tabs .nav-link:hover {
  color: rgb(var(--rgb-first)) !important;
  border-color: transparent;
  border-bottom-color: rgb(var(--rgb-first)) !important;
}

body.faragard-dark .nav-tabs .nav-link.active, body.faragard-dark .nav-tabs .nav-link:hover {
  color: rgb(var(--rgb-first)) !important;
  border-color: transparent;
  border-bottom-color: rgb(var(--rgb-first)) !important;
}

.nav-tabs .nav-link:focus,
.nav-tabs .nav-link:hover {
  border-color: transparent;
  border-bottom-color: rgb(var(--rgb-first-darker));
}
body.dark .nav-tabs-light .nav-link.active, body.dark .nav-tabs-light .nav-link:hover {
  color: rgb(var(--rgb-darkest)) !important;
  border-color: transparent;
  border-bottom-color: transparent !important;
}

body.faragard-dark .nav-tabs-light .nav-link.active, body.faragard-dark .nav-tabs-light .nav-link:hover {
  color: rgb(var(--rgb-darkest)) !important;
  border-color: transparent;
  border-bottom-color: transparent !important;
}

.nav-tabs {
  max-width: 100%;
  height: 100%;
  padding-bottom: 0;
}
.nav-tabs ul {
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
}
.nav-tabs ul::-webkit-scrollbar {
  width: 0;
  display: none;
}
.nav-tabs .nav-link {
  line-height: normal;
}
.nav-tabs .nav-link.active {
  background-color: transparent;
  color: rgb(var(--rgb-first-darker)) !important;
  border-bottom-color: rgb(var(--rgb-first-darker)) !important;
}
.nav-tabs .nav-link:hover {
  color: rgb(var(--rgb-first-darker));
}
.nav-tabs .nav-link:focus,
.nav-tabs .nav-link:hover {
  border-color: transparent;
  border-bottom-color: rgb(var(--rgb-first-darker));
}

[data-disabled|=true] {
  opacity: 0.7;
  pointer-events: none;
}

.radius-top {
  border-radius: 0.75rem 0.75rem 0 0 !important;
}

.radius-bottom {
  border-radius: 0 0 0.75rem 0.75rem !important;
}

.radius-right {
  border-radius: 0 0.75rem 0.75rem 0 !important;
}
html[dir=ltr] .radius-right {
  border-radius: 0.75rem 0 0 0.75rem !important;
}

.radius-left {
  border-radius: 0.75rem 0 0 0.75rem !important;
}
html[dir=ltr] .radius-left {
  border-radius: 0 0.75rem 0.75rem 0 !important;
}

html[dir=ltr] .no-radius-right {
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}

html:not([dir=ltr]) .no-radius-right {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

html[dir=ltr] .no-radius-left {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

html:not([dir=ltr]) .no-radius-left {
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}

.no-radius {
  border-radius: 0 !important;
}

.input-btn-icon {
  width: 48px;
  height: 38px;
  color: white;
  border-radius: var(--radius-input);
  transition: filter 200ms;
}
.input-btn-icon:active {
  filter: brightness(94%);
}

.captcha-img {
  border: 1px solid rgb(var(--rgb-light)) !important;
  border-right: transparent;
  border-radius: 0.65rem 0 0 0.65rem;
  cursor: pointer;
}
html[dir=ltr] .captcha-img {
  border-radius: 0 0.65rem 0.65rem 0;
}

/* Skeleton loading Start */
.loading-animation {
  overflow: hidden;
  pointer-events: none;
}

.loading-animation::before {
  content: "";
  display: block;
  height: 100%;
  width: 100%;
  animation: loading 1s infinite cubic-bezier(0.28, 0.72, 0.78, 0.85);
  background: linear-gradient(to right, transparent, rgba(var(--rgb-lightest), 0.3), transparent);
}

@keyframes loading {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(-100%);
  }
}
.h-loading {
  width: 140px;
  height: 20px;
  background: rgb(var(--rgb-light));
  border-radius: 100px;
}

.label-loading {
  width: 100px;
  height: 16px;
  background: rgb(var(--rgb-light));
  border-radius: 100px;
}

.first-btn-loading {
  width: 110px;
  height: 40px;
  background-color: rgb(var(--rgb-first));
  border-radius: 6px;
}

.light-btn-loading {
  width: 110px;
  height: 40px;
  background-color: rgb(var(--rgb-first));
  border-radius: 6px;
}

/* Skeleton loading End */
/* Table */
.vertical-text {
  width: 0;
}
.vertical-text span {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  max-height: 150px;
  display: block;
}

.table-wrapper {
  overflow: auto;
  border: 2px solid rgb(var(--rgb-light));
  margin-bottom: 1rem;
  padding: 0;
  width: 100%;
}
.table-wrapper:not(.no-radius) {
  border-radius: 18px;
}
.table-wrapper table {
  margin: 0 !important;
}
@media only screen and (max-width: 992px) {
  .table-wrapper.no-border-sm {
    border: none !important;
  }
}

.a-sort {
  position: relative;
  padding-left: 24px;
}
html[dir=ltr] .a-sort {
  padding-right: 24px;
  padding-left: auto;
}

.a-sort::before, .a-sort::after {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  opacity: 0.5;
  font-size: 16px;
}
.a-sort::before {
  content: "\f0d7";
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  left: 12px;
  top: 57%;
}
html[dir=ltr] .a-sort::before {
  margin-left: 6px;
  margin-right: auto;
}

.a-sort::after {
  content: "\f0d8";
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  left: 12px;
  top: 43%;
}
html[dir=ltr] .a-sort::after {
  margin-left: 6px;
  margin-right: auto;
}

.a-sort-asc::before {
  opacity: 1;
}
.a-sort-asc::after {
  opacity: 0.5;
}
.a-sort-desc::before {
  opacity: 0.5;
}
.a-sort-desc::after {
  opacity: 1;
}

table.table {
  border-spacing: 0;
  border-collapse: collapse;
  border-style: hidden;
  display: table;
  font-size: 14px;
  width: 100%;
  height: 0;
}
table.table:not(.no-radius) {
  border-radius: 16px;
}
table.table-error {
  outline-color: rgb(var(--rgb-red-600)) !important;
}
table.table.striped tbody tr:nth-of-type(2n+1) td {
  background-color: color-mix(in srgb, rgb(var(--rgb-first-lighter)) 30%, white);
}
table.table.striped tbody tr:nth-of-type(2n) td {
  background-color: rgb(var(--rgb-third-lighter));
}
table.table-no-thead:not(.no-radius) tbody tr:nth-of-type(1) {
  border-top-left-radius: 16px;
  border-top-right-radius: 16px;
}
table.table-no-thead:not(.no-radius) tbody tr:nth-of-type(1) td:nth-child(1) {
  border-top-right-radius: 16px;
}
html[dir=ltr] table.table-no-thead:not(.no-radius) tbody tr:nth-of-type(1) td:nth-child(1) {
  border-top-right-radius: 0;
  border-top-left-radius: 16px;
}

table.table-no-thead:not(.no-radius) tbody tr:nth-of-type(1) td:nth-last-child(1) {
  border-top-left-radius: 16px;
}
html[dir=ltr] table.table-no-thead:not(.no-radius) tbody tr:nth-of-type(1) td:nth-last-child(1) {
  border-top-left-radius: 0;
  border-top-right-radius: 16px;
}

table.table .th-heading {
  background-color: color-mix(in srgb, rgb(var(--rgb-first-dark)) 80%, black) !important;
  color: rgb(var(--rgb-lightest)) !important;
  font-weight: bold;
  text-align: right;
}
html[dir=ltr] table.table .th-heading {
  text-align: left;
}

table.table thead tr th {
  background-color: color-mix(in srgb, rgb(var(--rgb-first-dark)) 80%, black) !important;
  color: rgb(var(--rgb-lightest)) !important;
  border: 2px solid rgb(var(--rgb-light));
  border-top-color: transparent !important;
  font-size: 0.9em;
  padding: 10px 8px;
  font-weight: bold;
  text-align: right;
  vertical-align: middle;
}
html[dir=ltr] table.table thead tr th {
  text-align: left;
}

table.table thead tr th:nth-of-type(1) {
  border-right-color: transparent !important;
}
table.table thead tr th:nth-last-of-type(1) {
  border-left-color: transparent !important;
}
table.table:not(.no-radius) thead tr:nth-of-type(1) > th:nth-of-type(1) {
  border-top-right-radius: 16px !important;
}
html[dir=ltr] table.table:not(.no-radius) thead tr:nth-of-type(1) > th:nth-of-type(1) {
  border-top-left-radius: 16px !important;
  border-top-right-radius: 0 !important;
}

table.table:not(.no-radius) thead tr:nth-of-type(1) > th:nth-last-of-type(1) {
  border-top-left-radius: 16px !important;
}
html[dir=ltr] table.table:not(.no-radius) thead tr:nth-of-type(1) > th:nth-last-of-type(1) {
  border-top-right-radius: 16px !important;
  border-top-left-radius: 0 !important;
}

table.table:not(.no-radius) tbody tr:nth-last-of-type(1) {
  border-bottom-right-radius: 16px;
  border-bottom-left-radius: 16px;
}
@media only screen and (min-width: 992px) {
  table.table:not(.no-radius) tbody tr:nth-last-of-type(1) td:nth-child(1) {
    border-bottom-right-radius: 16px;
  }
  html[dir=ltr] table.table:not(.no-radius) tbody tr:nth-last-of-type(1) td:nth-child(1) {
    border-bottom-left-radius: 16px !important;
    border-bottom-right-radius: 0 !important;
  }
  table.table:not(.no-radius) tbody tr:nth-last-of-type(1) td:nth-last-child(1) {
    border-bottom-left-radius: 16px;
  }
  html[dir=ltr] table.table:not(.no-radius) tbody tr:nth-last-of-type(1) td:nth-last-child(1) {
    border-bottom-right-radius: 16px !important;
    border-bottom-left-radius: 0 !important;
  }
}
table.table-two-by-two tbody tr:nth-of-type(4n+1) td, table.table-two-by-two tbody tr:nth-of-type(4n+2) td {
  background-color: color-mix(in srgb, rgb(var(--rgb-first-lighter)) 30%, white) !important;
}
table.table-two-by-two tbody tr:nth-of-type(4n+3) td, table.table-two-by-two tbody tr:nth-of-type(4n+4) td {
  background-color: rgb(var(--rgb-third-lighter)) !important;
}
table.table > tbody > tr {
  font-size: 0.9em;
  padding: 5px;
  text-align: center;
  color: rgb(var(--rgb-darkest));
}
table.table > tbody > tr.hidden {
  display: none;
}
table.table > tbody > tr.odd-striped td {
  background-color: color-mix(in srgb, rgb(var(--rgb-first-light)) 18%, rgb(var(--rgb-lightest))) !important;
}
table.table > tbody > tr.even-striped td {
  background-color: rgb(var(--rgb-third-lighter)) !important;
}
table.table > tbody > tr.selected {
  background-color: color-mix(in srgb, rgb(var(--rgb-third-light)) 16%, rgb(var(--rgb-seventh)) 14%) !important;
  box-shadow: inset 0 0 8px 999px rgba(var(--rgb-darkest), 0.02);
}
table.table > tbody > tr.selected td {
  background-color: transparent !important;
  font-weight: 500;
}
@media only screen and (min-width: 992px) {
  table.table > tbody > tr:nth-last-of-type(1) td {
    border-bottom-color: transparent !important;
  }
}
table.table > tbody > tr:hover td {
  box-shadow: inset 0 0 10px 99999px rgba(var(--rgb-darkest), 0.03);
}
table.table > tbody > tr > th {
  overflow-wrap: anywhere;
  hyphens: auto;
  background-color: rgb(var(--rgb-ninth-lighter)) !important;
  color: rgb(var(--rgb-darkest));
  font-weight: bold;
}
table.table > tbody > tr td {
  display: table-cell;
  vertical-align: middle;
  padding: 10px 8px;
  border: 2px solid transparent;
  text-align: right;
  border-bottom-color: rgb(var(--rgb-light)) !important;
  border-left-color: rgb(var(--rgb-light)) !important;
  border-right-color: rgb(var(--rgb-light)) !important;
  overflow-wrap: anywhere;
  hyphens: auto;
}
html[dir=ltr] table.table > tbody > tr td {
  text-align: left;
}

table.table > tbody > tr td:not(:nth-last-of-type(1)) {
  border-left-color: rgb(var(--rgb-light)) !important;
}
table.table > tbody > tr td.heading {
  background-color: rgb(var(--rgb-ninth-lighter)) !important;
  font-weight: bold;
}
table.table > tbody > tr td span {
  transition: all 0.2s ease;
  transform-origin: center;
}
table.table > tbody > tr td::before {
  color: rgb(var(--rgb-darkest));
}

table.table-ticket {
  border-spacing: 0;
  border-collapse: collapse;
  border-style: hidden;
  display: table;
  font-size: 14px;
  width: 100%;
  height: 0;
}
table.table-ticket:not(.no-radius) {
  border-radius: 16px;
}
table.table-ticket-error {
  outline-color: rgb(var(--rgb-red-600)) !important;
}
table.table-ticket.striped tbody tr:nth-of-type(2n+1) td {
  background-color: color-mix(in srgb, rgb(var(--rgb-first-lighter)) 30%, white);
}
table.table-ticket.striped tbody tr:nth-of-type(2n) td {
  background-color: rgb(var(--rgb-third-lighter));
}
table.table-ticket .th-heading {
  background-color: rgb(var(--rgb-first-lighter)) !important;
  color: rgb(var(--rgb-first-darker)) !important;
  font-weight: bold;
  text-align: right;
}
html[dir=ltr] table.table-ticket .th-heading {
  text-align: left;
}

table.table-ticket thead tr th {
  min-width: 130px;
  background-color: rgb(var(--rgb-first-lighter)) !important;
  color: rgb(var(--rgb-first-darker)) !important;
  border: 2px solid rgb(var(--rgb-light));
  border-top-color: transparent !important;
  font-size: 0.9em;
  padding: 10px 8px;
  font-weight: bold;
  text-align: right;
  vertical-align: middle;
}
table.table-ticket thead tr th.th-titlebar {
  min-width: 54px;
  max-width: 100px;
  text-align: center;
}
html[dir=ltr] table.table-ticket thead tr th {
  text-align: left;
}

table.table-ticket thead tr th:nth-of-type(1) {
  border-right-color: transparent !important;
}
table.table-ticket thead tr th:nth-last-of-type(1) {
  border-left-color: transparent !important;
}
table.table-ticket:not(.no-radius) thead tr:nth-of-type(1) > th:nth-of-type(1) {
  border-top-right-radius: 4px !important;
}
html[dir=ltr] table.table-ticket:not(.no-radius) thead tr:nth-of-type(1) > th:nth-of-type(1) {
  border-top-left-radius: 4px !important;
  border-top-right-radius: 0 !important;
}

table.table-ticket:not(.no-radius) thead tr:nth-of-type(1) > th:nth-last-of-type(1) {
  border-top-left-radius: 4px !important;
}
html[dir=ltr] table.table-ticket:not(.no-radius) thead tr:nth-of-type(1) > th:nth-last-of-type(1) {
  border-top-right-radius: 4px !important;
  border-top-left-radius: 0 !important;
}

table.table-ticket:not(.no-radius) tbody tr:nth-last-of-type(1) {
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
}
@media only screen and (min-width: 992px) {
  table.table-ticket:not(.no-radius) tbody tr:nth-last-of-type(1) td:nth-child(1) {
    border-bottom-right-radius: 4px;
  }
  html[dir=ltr] table.table-ticket:not(.no-radius) tbody tr:nth-last-of-type(1) td:nth-child(1) {
    border-bottom-left-radius: 4px !important;
    border-bottom-right-radius: 0 !important;
  }
  table.table-ticket:not(.no-radius) tbody tr:nth-last-of-type(1) td:nth-last-child(1) {
    border-bottom-left-radius: 4px;
  }
  html[dir=ltr] table.table-ticket:not(.no-radius) tbody tr:nth-last-of-type(1) td:nth-last-child(1) {
    border-bottom-right-radius: 4px !important;
    border-bottom-left-radius: 0 !important;
  }
}
table.table-ticket > tbody > tr {
  font-size: 0.9em;
  padding: 5px;
  text-align: center;
  color: rgb(var(--rgb-darkest));
}
table.table-ticket > tbody > tr.hidden {
  display: none;
}
table.table-ticket > tbody > tr.selected {
  background-color: color-mix(in srgb, rgb(var(--rgb-third-light)) 16%, rgb(var(--rgb-seventh)) 14%) !important;
  box-shadow: inset 0 0 8px 999px rgba(var(--rgb-darkest), 0.02);
}
table.table-ticket > tbody > tr.selected td {
  background-color: transparent !important;
  font-weight: 500;
}
@media only screen and (min-width: 992px) {
  table.table-ticket > tbody > tr:nth-last-of-type(1) td {
    border-bottom-color: transparent !important;
  }
}
table.table-ticket > tbody > tr:hover td {
  box-shadow: inset 0 0 10px 99999px rgba(var(--rgb-darkest), 0.03);
}
table.table-ticket > tbody > tr > th {
  overflow-wrap: anywhere;
  hyphens: auto;
  background-color: rgb(var(--rgb-ninth-lighter)) !important;
  color: rgb(var(--rgb-darkest));
  font-weight: bold;
}
table.table-ticket > tbody > tr td {
  display: table-cell;
  vertical-align: middle;
  padding: 10px 8px;
  border: 2px solid transparent;
  text-align: right;
  border-bottom-color: rgb(var(--rgb-light)) !important;
  border-left-color: rgb(var(--rgb-light)) !important;
  border-right-color: rgb(var(--rgb-light)) !important;
  overflow-wrap: anywhere;
  hyphens: auto;
}
html[dir=ltr] table.table-ticket > tbody > tr td {
  text-align: left;
}

table.table-ticket > tbody > tr td:not(:nth-last-of-type(1)) {
  border-left-color: rgb(var(--rgb-light)) !important;
}
table.table-ticket > tbody > tr td.heading {
  background-color: rgb(var(--rgb-ninth-lighter)) !important;
  font-weight: bold;
}
table.table-ticket > tbody > tr td.td-titlebar {
  min-width: 54px;
  max-width: 100px;
  text-align: center;
}
table.table-ticket > tbody > tr td span {
  transition: all 0.2s ease;
  transform-origin: center;
}
table.table-ticket > tbody > tr td::before {
  color: rgb(var(--rgb-darkest));
}
table.table-ticket .table-ticket-btn {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  color: rgb(var(--rgb-lightest));
  min-width: 130px;
  padding: 12px 6px;
}
table.table-ticket .table-ticket-btn-empty {
  background-color: rgb(var(--rgb-green-500));
}
body.dark table.table-ticket .table-ticket-btn-empty {
  background-color: rgb(var(--rgb-green-600));
}

table.table-ticket .table-ticket-btn-gap {
  background-color: rgb(var(--rgb-slate-500));
}
body.dark table.table-ticket .table-ticket-btn-gap {
  background-color: rgb(var(--rgb-slate-600));
}

table.table-ticket .table-ticket-btn-sell {
  background-color: rgb(var(--rgb-red-500));
}
body.dark table.table-ticket .table-ticket-btn-sell {
  background-color: rgb(var(--rgb-red-600));
}

table.table-ticket .table-ticket-btn-reserve {
  background-color: rgb(var(--rgb-amber-500));
}
body.dark table.table-ticket .table-ticket-btn-reserve {
  background-color: rgb(var(--rgb-amber-600));
}

table.table-ticket .table-ticket-btn-select {
  background-color: rgb(var(--rgb-blue-500));
}
body.dark table.table-ticket .table-ticket-btn-select {
  background-color: rgb(var(--rgb-blue-600));
}

table.table-ticket .td-btn {
  padding: 0;
}

.text-like {
  color: green !important;
}

.text-dislike {
  color: red !important;
}

/* Pagination Start */
.pagination {
  max-width: 100%;
}
.pagination ul {
  display: flex;
  justify-content: center;
  gap: 8px;
  flex-wrap: wrap;
}
.pagination ul li a, .pagination ul li button {
  color: rgb(var(--rgb-lightest));
  width: auto;
  padding: 8px;
  min-width: 32px;
  height: 32px;
  border-radius: var(--radius-md);
  background-color: rgb(var(--rgb-third));
}
.pagination ul li a:hover, .pagination ul li a:active, .pagination ul li a:focus-visible, .pagination ul li button:hover, .pagination ul li button:active, .pagination ul li button:focus-visible {
  box-shadow: 0 0 4px 1px rgba(var(--rgb-darkest), 0.2);
}
.pagination ul li a.pagination-loading, .pagination ul li button.pagination-loading {
  width: 32px;
  height: 32px;
  padding: 0;
}
.pagination ul li.active a, .pagination ul li.active button {
  background-color: rgb(var(--rgb-sixth));
}
@media only screen and (max-width: 767px) {
  .pagination ul li:not(.active):not(.next):not(.previous) {
    display: none;
  }
}

/* Pagination End */
/* Swiper Defaults */
.swiper {
  max-width: fill-available;
  max-width: -moz-available;
  max-width: -webkit-fill-available;
}

.swiper-button-prev,
.swiper-button-next {
  background: white;
}
.swiper-button-prev::after,
.swiper-button-next::after {
  display: none;
}

/* Password Start */
.password-strength-group .password-strength-meter {
  width: calc(100% - 80px);
  transition: height 0.3s;
  display: flex;
  justify-content: stretch;
}
.password-strength-group .password-strength-meter .meter-block {
  height: 4px;
  background: #ccc;
  margin: 0 3px;
  flex-grow: 1;
}

.password-strength-message {
  opacity: 0;
  visibility: hidden;
  text-align: center;
  transition: all 0.4s;
  position: absolute;
  top: 100%;
  right: 0;
  border-radius: 8px;
  color: rgb(var(--rgb-lightest));
  background-color: transparent;
  width: max-content !important;
  min-width: 50px;
  padding: 8px;
  cursor: help;
  z-index: 50;
}
html[dir=ltr] .password-strength-message {
  left: 0;
  right: auto;
}

.password-strength-message .message-item {
  transition: opacity 0.2s;
  font-size: 10px;
  display: none !important;
}
.password-strength-message::before {
  content: "";
  height: 0;
  width: 0;
  border: 4px solid transparent;
  display: block;
  left: 50%;
  transform: translateX(-50%) rotate(-135deg);
  top: -2px;
  position: absolute;
  transition: all 0.4s;
  box-shadow: 4px -4px 8px -4px rgba(var(--rgb-darkest), 0.2);
  z-index: 0;
}

input:focus ~ .password-strength-message[data-strength]:not([data-strength=""]):not([data-strength="0"]) {
  opacity: 1;
  visibility: visible;
  top: calc(118% + 8px);
}

@media only screen and (min-width: 767px) {
  .password-strength-message {
    text-align: right !important;
    left: 100% !important;
    top: 47% !important;
    transform: translateY(-50%) !important;
    right: initial !important;
    bottom: initial !important;
  }
  html[dir=ltr] .password-strength-message {
    right: 100% !important;
    left: auto !important;
  }
  .password-strength-message::before {
    top: 50% !important;
    bottom: initial !important;
    transform: translateY(-50%) rotate(136deg) !important;
    left: -2px !important;
  }
  html[dir=ltr] .password-strength-message::before {
    right: -2px !important;
    left: auto !important;
    transform: translateY(-50%) rotate(-44deg) !important;
  }
  input:focus ~ .password-strength-message[data-strength]:not([data-strength=""]):not([data-strength="0"]) {
    left: calc(100% + 8px) !important;
  }
  html[dir=ltr] input:focus ~ .password-strength-message[data-strength]:not([data-strength=""]):not([data-strength="0"]) {
    right: calc(100% + 8px) !important;
    left: auto !important;
  }
}
.password-strength-group[data-strength="1"] .meter-block:nth-child(-n+1) {
  background: rgb(var(--rgb-red-600));
}

.password-strength-message[data-strength=""],
.password-strength-message[data-strength="0"],
.password-strength-message[data-strength="1"] {
  background-color: rgb(var(--rgb-red-600));
}
.password-strength-message[data-strength=""] .message-item:nth-of-type(1),
.password-strength-message[data-strength="0"] .message-item:nth-of-type(1),
.password-strength-message[data-strength="1"] .message-item:nth-of-type(1) {
  display: block !important;
}
.password-strength-message[data-strength=""]::before,
.password-strength-message[data-strength="0"]::before,
.password-strength-message[data-strength="1"]::before {
  border-right-color: rgb(var(--rgb-red-600));
  border-bottom-color: rgb(var(--rgb-red-600));
}

.password-strength-group[data-strength="2"] .meter-block:nth-child(-n+2) {
  background: rgb(var(--rgb-yellow-600));
}

.password-strength-message[data-strength="2"] {
  background-color: rgb(var(--rgb-yellow-600));
}
.password-strength-message[data-strength="2"] .message-item:nth-of-type(2) {
  display: block !important;
}
.password-strength-message[data-strength="2"]::before {
  border-right-color: rgb(var(--rgb-yellow-600));
  border-bottom-color: rgb(var(--rgb-yellow-600));
}

.password-strength-group[data-strength="3"] .meter-block:nth-child(-n+3) {
  background: rgb(var(--rgb-lime-600));
}

.password-strength-message[data-strength="3"] {
  background-color: rgb(var(--rgb-lime-600));
}
.password-strength-message[data-strength="3"] .message-item:nth-of-type(3) {
  display: block !important;
}
.password-strength-message[data-strength="3"]::before {
  border-right-color: rgb(var(--rgb-lime-600));
  border-bottom-color: rgb(var(--rgb-lime-600));
}

.password-strength-group[data-strength="4"] .meter-block:nth-child(-n+4) {
  background: rgb(var(--rgb-green-600));
}

.password-strength-message[data-strength="4"] {
  background-color: rgb(var(--rgb-green-600));
}
.password-strength-message[data-strength="4"] .message-item:nth-of-type(4) {
  display: block !important;
}
.password-strength-message[data-strength="4"]::before {
  border-right-color: rgb(var(--rgb-green-600));
  border-bottom-color: rgb(var(--rgb-green-600));
}

/* Password End */
/* Separator Start */
.separator-horizontal {
  width: 100%;
  height: 0.5px;
  margin: 8px 0;
  background-color: rgba(var(--rgb-darkest), 0.1);
  display: flex;
}
.separator-horizontal-1 {
  height: 2px;
}

.separator-vertical {
  width: 0;
  height: auto;
  margin: 8px 0;
  background-color: rgba(var(--rgb-darkest), 0.1);
  display: flex;
  outline: 0.2px solid rgba(var(--rgb-darkest), 0.1);
}

.separator-horizontal-dashed {
  width: 100%;
  height: 1px;
  margin: 8px 0;
  border-bottom: 1px dashed rgba(var(--rgb-darkest), 0.1);
  display: flex;
}

.separator-vertical-dashed {
  width: 0.5px;
  height: auto;
  margin: 8px 0;
  background-image: repeating-linear-gradient(1deg, rgba(var(--rgb-darkest), 0.3), rgba(var(--rgb-darkest), 0.3) 6px, transparent 6px, transparent 12px, rgba(var(--rgb-darkest), 0.3) 12px), repeating-linear-gradient(91deg, rgba(var(--rgb-darkest), 0.3), rgba(var(--rgb-darkest), 0.3) 6px, transparent 6px, transparent 12px, rgba(var(--rgb-darkest), 0.3) 12px), repeating-linear-gradient(181deg, rgba(var(--rgb-darkest), 0.3), rgba(var(--rgb-darkest), 0.3) 6px, transparent 6px, transparent 12px, rgba(var(--rgb-darkest), 0.3) 12px), repeating-linear-gradient(271deg, rgba(var(--rgb-darkest), 0.3), rgba(var(--rgb-darkest), 0.3) 6px, transparent 6px, transparent 12px, rgba(var(--rgb-darkest), 0.3) 12px);
  background-size: 2px 100%, 0, 0, 0;
  background-position: 0 0, 0 0, 100% 0, 0 100%;
  background-repeat: no-repeat;
  display: flex;
}

/* Separator End */
/* Button Animation Start */
.btn-fetch {
  padding: 8px 16px;
  border-radius: 8px;
  background-color: rgb(var(--rgb-blue-500));
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.btn-fetch::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border: 3px solid transparent;
  border-radius: 8px;
}
.btn-fetch:hover, .btn-fetch:active, .btn-fetch:focus-visible {
  background-color: rgb(var(--rgb-blue-400));
  color: rgb(var(--rgb-lightest));
}
.btn-fetch.is-loading-fetch::before {
  border-color: rgb(var(--rgb-blue-800));
  animation: clippath 3s infinite linear;
}
.btn-fetch.is-loading-fetch i {
  -webkit-animation-name: fa-spin;
  animation-name: fa-spin;
  -webkit-animation-duration: var(--fa-animation-duration, 2s);
  animation-duration: var(--fa-animation-duration, 2s);
  -webkit-animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  -webkit-animation-timing-function: var(--fa-animation-timing, linear);
  animation-timing-function: var(--fa-animation-timing, linear);
}

@keyframes clippath {
  0%, 100% {
    clip-path: inset(0 0 95% 0);
  }
  25% {
    clip-path: inset(0 0 0 95%);
  }
  50% {
    clip-path: inset(95% 0 0 0);
  }
  75% {
    clip-path: inset(0 95% 0 0);
  }
}
/* Button Animation End */
/* Responsive */
@media only screen and (min-width: 575px) {
  .snackbar {
    min-width: 320px !important;
    max-width: 92% !important;
    width: fit-content !important;
  }
}
@media only screen and (min-width: 992px) {
  table.table tbody tr td {
    max-width: 100%;
  }
}
@media only screen and (max-width: 360px) {
  .form-cast-group label > span {
    font-size: 8px !important;
  }
}
@media only screen and (max-width: 992px) {
  .password-strength-group .password-strength-meter {
    width: 100%;
  }
}
@media only screen and (max-width: 767px) {
  .switcher-box {
    bottom: 120px !important;
  }
}
@media only screen and (max-width: 992px) {
  table.table:not(.matrix-table):not(.table-joined) {
    border-radius: 0;
    outline: none !important;
  }
  table.table:not(.matrix-table):not(.table-joined) tbody tr {
    border-radius: 16px;
  }
  table.table:not(.matrix-table) .heading:not(.th-show),
  table.table:not(.matrix-table) .th-heading:not(.th-show) {
    display: none;
  }
  table.table:not(.matrix-table) tbody {
    gap: 15px;
    display: grid;
    vertical-align: middle;
  }
  table.table:not(.matrix-table) tbody tr {
    padding: 0;
    overflow: hidden;
    border: none;
  }
  table.table:not(.matrix-table) tbody tr td {
    border: none !important;
    display: block;
  }
  table.table:not(.matrix-table) tbody tr td::before {
    content: attr(data-title);
    color: rgb(var(--rgb-light-dark));
    padding: 0 12px;
    text-wrap: nowrap;
    margin-top: auto;
    margin-bottom: auto;
    font-weight: bold;
  }
  table.table:not(.matrix-table) tbody tr td:not([data-title])::before {
    display: none;
  }
  table.table:not(.matrix-table) td[data-title] {
    display: flex;
    border-bottom: 2px solid rgb(var(--rgb-light)) !important;
  }
  table.table:not(.matrix-table) td[data-title]:nth-last-of-type(1) {
    border-bottom: none !important;
  }
  table.table:not(.matrix-table) thead {
    display: none;
  }
  table.table-joined {
    outline: 2px solid rgb(var(--rgb-light)) !important;
    border-radius: 15px !important;
  }
  table.table-joined tbody {
    gap: 0 !important;
  }
  table.table-joined tbody tr {
    border-radius: 0 !important;
    border-bottom: 2px solid rgb(var(--rgb-light)) !important;
  }
  table.table-joined tbody tr:nth-last-of-type(1) {
    border-bottom: none !important;
  }
  table.table-joined tbody tr:nth-of-type(1) {
    border-top-right-radius: 16px !important;
    border-top-left-radius: 16px !important;
  }
  table.table-joined tbody tr:nth-last-of-type(1) {
    border-bottom-right-radius: 16px !important;
    border-bottom-left-radius: 16px !important;
  }
  table.table.matrix-table:not(.no-radius) tbody tr:nth-last-of-type(1) td:nth-child(1) {
    border-bottom-right-radius: 16px;
  }
  table.table.matrix-table:not(.no-radius) tbody tr:nth-last-of-type(1) td:nth-last-child(1) {
    border-bottom-left-radius: 16px;
  }
  table.table.matrix-table tbody tr:nth-last-of-type(1) td {
    border-bottom-color: transparent !important;
  }
}
.switcher-box {
  width: fit-content;
  height: fit-content;
  position: fixed;
  bottom: 60px;
  z-index: 150;
  left: 30px;
  right: initial;
}
.switcher-box .theme-btn {
  width: 50px;
  height: 50px;
  border-radius: var(--radius-full);
  cursor: pointer;
  z-index: 120;
  transition: filter 150ms ease-in-out;
  background-color: rgb(var(--rgb-first)) !important;
  box-shadow: -1px 1px 2px 0 rgba(var(--rgb-darkest), 0.2) !important;
  color: rgb(var(--rgb-lightest));
}
.switcher-box .theme-btn:hover {
  background-color: rgb(var(--rgb-first)) !important;
  filter: brightness(120%);
}
.switcher-box .themes {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 8px;
  bottom: 90%;
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  z-index: -1;
  border-radius: 10px;
  box-shadow: -1px 1px 2px 0 rgba(var(--rgb-darkest), 0.2) !important;
  background-color: rgb(var(--rgb-first)) !important;
  color: rgb(var(--rgb-lightest)) !important;
  transition: all 200ms;
}
.switcher-box .themes.show {
  bottom: 120% !important;
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
}
.switcher-box .themes button {
  min-width: 40px;
  max-width: 50px;
  min-height: 40px;
  border-radius: 15px;
  box-shadow: 0 0 4px 0 rgba(var(--rgb-lightest), 0.6) !important;
  background-color: green;
  font-size: 10px;
  transition: all 150ms;
  color: white;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.switcher-box .themes button.selected {
  outline: 2px solid rgb(var(--rgb-lightest)) !important;
  outline-offset: 2px;
}
.switcher-box .themes button[theme=blue] {
  background: rgb(var(--rgb-blue-600));
}
.switcher-box .themes button[theme=fuchsia] {
  background: rgb(var(--rgb-fuchsia-600));
}
.switcher-box .themes button[theme=emerald] {
  background: rgb(var(--rgb-emerald-600));
}
.switcher-box .themes button[theme=sky] {
  background: rgb(var(--rgb-sky-600));
}
.switcher-box .themes button[theme=red] {
  background: rgb(var(--rgb-red-600));
}
.switcher-box .themes button[theme=yellow] {
  background: rgb(var(--rgb-yellow-600));
}
.switcher-box .themes button[theme=purple] {
  background: rgb(var(--rgb-purple-600));
}
.switcher-box .themes button[theme=pink] {
  background: rgb(var(--rgb-pink-600));
}
.switcher-box .themes button[theme=green] {
  background: rgb(var(--rgb-green-600));
}
.switcher-box .themes button[theme=indigo] {
  background: rgb(var(--rgb-indigo-600));
}
.switcher-box .themes button[theme=orange] {
  background: rgb(var(--rgb-orange-600));
}
.switcher-box .themes button[theme=dark] {
  background: rgb(var(--rgb-slate-600));
}

:root {
  --rgb-lightest: 255, 255, 255;
  --rgb-darkest: 0, 0, 0;
  /* Const */
  --rgb-white: 255, 255, 255;
  --rgb-black: 0, 0, 0;
  /* Primary Colors RGB */
  --rgb-blue-50: 239, 246, 255;
  --rgb-blue-100: 219, 234, 254;
  --rgb-blue-200: 191, 219, 254;
  --rgb-blue-300: 147, 197, 253;
  --rgb-blue-400: 96, 165, 250;
  --rgb-blue-500: 59, 130, 246;
  --rgb-blue-600: 37, 99, 235;
  --rgb-blue-700: 29, 78, 216;
  --rgb-blue-800: 30, 64, 175;
  --rgb-blue-900: 30, 58, 138;
  --rgb-zinc-50: 250, 250, 250;
  --rgb-zinc-100: 244, 244, 245;
  --rgb-zinc-200: 228, 228, 231;
  --rgb-zinc-300: 212, 212, 216;
  --rgb-zinc-400: 161, 161, 170;
  --rgb-zinc-500: 113, 113, 122;
  --rgb-zinc-600: 82, 82, 91;
  --rgb-zinc-700: 63, 63, 70;
  --rgb-zinc-800: 39, 39, 42;
  --rgb-zinc-900: 24, 24, 27;
  --rgb-orange-50: 255, 247, 237;
  --rgb-orange-100: 255, 237, 213;
  --rgb-orange-200: 254, 215, 170;
  --rgb-orange-300: 253, 186, 116;
  --rgb-orange-400: 251, 146, 60;
  --rgb-orange-500: 249, 115, 22;
  --rgb-orange-600: 234, 88, 12;
  --rgb-orange-700: 194, 65, 12;
  --rgb-orange-800: 154, 52, 18;
  --rgb-orange-900: 124, 45, 18;
  --rgb-green-50: 240, 253, 244;
  --rgb-green-100: 220, 252, 231;
  --rgb-green-200: 187, 247, 208;
  --rgb-green-300: 134, 239, 172;
  --rgb-green-400: 74, 222, 128;
  --rgb-green-500: 34, 197, 94;
  --rgb-green-600: 22, 163, 74;
  --rgb-green-700: 21, 128, 61;
  --rgb-green-800: 22, 101, 52;
  --rgb-green-900: 20, 83, 45;
  --rgb-red-50: 254, 242, 242;
  --rgb-red-100: 254, 226, 226;
  --rgb-red-200: 254, 202, 202;
  --rgb-red-300: 252, 165, 165;
  --rgb-red-400: 248, 113, 113;
  --rgb-red-500: 239, 68, 68;
  --rgb-red-600: 220, 38, 38;
  --rgb-red-700: 185, 28, 28;
  --rgb-red-800: 153, 27, 27;
  --rgb-red-900: 127, 29, 29;
  --rgb-yellow-50: 254, 252, 232;
  --rgb-yellow-100: 254, 249, 195;
  --rgb-yellow-200: 254, 240, 138;
  --rgb-yellow-300: 253, 224, 71;
  --rgb-yellow-400: 250, 204, 21;
  --rgb-yellow-500: 234, 179, 8;
  --rgb-yellow-600: 202, 138, 4;
  --rgb-yellow-700: 161, 98, 7;
  --rgb-yellow-800: 133, 77, 14;
  --rgb-yellow-900: 113, 63, 18;
  --rgb-lime-50: 247, 254, 231;
  --rgb-lime-100: 236, 252, 203;
  --rgb-lime-200: 217, 249, 157;
  --rgb-lime-300: 190, 242, 100;
  --rgb-lime-400: 163, 230, 53;
  --rgb-lime-500: 132, 204, 22;
  --rgb-lime-600: 101, 163, 13;
  --rgb-lime-700: 77, 124, 15;
  --rgb-lime-800: 63, 98, 18;
  --rgb-lime-900: 54, 83, 20;
  --rgb-amber-50: 255, 251, 235;
  --rgb-amber-100: 254, 243, 199;
  --rgb-amber-200: 253, 230, 138;
  --rgb-amber-300: 252, 211, 77;
  --rgb-amber-400: 251, 191, 36;
  --rgb-amber-500: 245, 158, 11;
  --rgb-amber-600: 217, 119, 6;
  --rgb-amber-700: 180, 83, 9;
  --rgb-amber-800: 146, 64, 14;
  --rgb-amber-900: 120, 53, 15;
  --rgb-slate-50: 248, 250, 252;
  --rgb-slate-100: 241, 245, 249;
  --rgb-slate-200: 226, 232, 240;
  --rgb-slate-300: 203, 213, 225;
  --rgb-slate-400: 148, 163, 184;
  --rgb-slate-500: 100, 116, 139;
  --rgb-slate-600: 71, 85, 105;
  --rgb-slate-700: 51, 65, 85;
  --rgb-slate-800: 30, 41, 59;
  --rgb-slate-900: 15, 23, 42;
  --rgb-gray-50: 249, 250, 251;
  --rgb-gray-100: 243, 244, 246;
  --rgb-gray-200: 229, 231, 235;
  --rgb-gray-300: 209, 213, 219;
  --rgb-gray-400: 156, 163, 175;
  --rgb-gray-500: 107, 114, 128;
  --rgb-gray-600: 75, 85, 99;
  --rgb-gray-700: 55, 65, 81;
  --rgb-gray-800: 31, 41, 55;
  --rgb-gray-900: 17, 24, 39;
  --rgb-neutral-50: 250, 250, 250;
  --rgb-neutral-100: 245, 245, 245;
  --rgb-neutral-200: 229, 229, 229;
  --rgb-neutral-300: 212, 212, 212;
  --rgb-neutral-400: 163, 163, 163;
  --rgb-neutral-500: 115, 115, 115;
  --rgb-neutral-600: 82, 82, 82;
  --rgb-neutral-700: 64, 64, 64;
  --rgb-neutral-800: 38, 38, 38;
  --rgb-neutral-900: 23, 23, 23;
  --rgb-stone-50: 250, 250, 249;
  --rgb-stone-100: 245, 245, 244;
  --rgb-stone-200: 231, 229, 228;
  --rgb-stone-300: 214, 211, 209;
  --rgb-stone-400: 168, 162, 158;
  --rgb-stone-500: 120, 113, 108;
  --rgb-stone-600: 87, 83, 78;
  --rgb-stone-700: 68, 64, 60;
  --rgb-stone-800: 41, 37, 36;
  --rgb-stone-900: 28, 25, 23;
  --rgb-cyan-50: 236, 254, 255;
  --rgb-cyan-100: 207, 250, 254;
  --rgb-cyan-200: 165, 243, 252;
  --rgb-cyan-300: 103, 232, 249;
  --rgb-cyan-400: 34, 211, 238;
  --rgb-cyan-500: 6, 182, 212;
  --rgb-cyan-600: 8, 145, 178;
  --rgb-cyan-700: 14, 116, 144;
  --rgb-cyan-800: 21, 94, 117;
  --rgb-cyan-900: 22, 78, 99;
  --rgb-emerald-50: 236, 253, 245;
  --rgb-emerald-100: 209, 250, 229;
  --rgb-emerald-200: 167, 243, 208;
  --rgb-emerald-300: 110, 231, 183;
  --rgb-emerald-400: 52, 211, 153;
  --rgb-emerald-500: 16, 185, 129;
  --rgb-emerald-600: 5, 150, 105;
  --rgb-emerald-700: 4, 120, 87;
  --rgb-emerald-800: 6, 95, 70;
  --rgb-emerald-900: 6, 78, 59;
  --rgb-teal-50: 240, 253, 250;
  --rgb-teal-100: 204, 251, 241;
  --rgb-teal-200: 153, 246, 228;
  --rgb-teal-300: 94, 234, 212;
  --rgb-teal-400: 45, 212, 191;
  --rgb-teal-500: 20, 184, 166;
  --rgb-teal-600: 13, 148, 136;
  --rgb-teal-700: 15, 118, 110;
  --rgb-teal-800: 17, 94, 89;
  --rgb-teal-900: 19, 78, 74;
  --rgb-sky-50: 240, 249, 255;
  --rgb-sky-100: 224, 242, 254;
  --rgb-sky-200: 186, 230, 253;
  --rgb-sky-300: 125, 211, 252;
  --rgb-sky-400: 56, 189, 248;
  --rgb-sky-500: 14, 165, 233;
  --rgb-sky-600: 2, 132, 199;
  --rgb-sky-700: 3, 105, 161;
  --rgb-sky-800: 7, 89, 133;
  --rgb-sky-900: 12, 74, 110;
  --rgb-indigo-50: 238, 242, 255;
  --rgb-indigo-100: 224, 231, 255;
  --rgb-indigo-200: 199, 210, 254;
  --rgb-indigo-300: 165, 180, 252;
  --rgb-indigo-400: 129, 140, 248;
  --rgb-indigo-500: 99, 102, 241;
  --rgb-indigo-600: 79, 70, 229;
  --rgb-indigo-700: 67, 56, 202;
  --rgb-indigo-800: 55, 48, 163;
  --rgb-indigo-900: 49, 46, 129;
  --rgb-violet-50: 245, 243, 255;
  --rgb-violet-100: 237, 233, 254;
  --rgb-violet-200: 221, 214, 254;
  --rgb-violet-300: 196, 181, 253;
  --rgb-violet-400: 167, 139, 250;
  --rgb-violet-500: 139, 92, 246;
  --rgb-violet-600: 124, 58, 237;
  --rgb-violet-700: 109, 40, 217;
  --rgb-violet-800: 91, 33, 182;
  --rgb-violet-900: 76, 29, 149;
  --rgb-purple-50: 250, 245, 255;
  --rgb-purple-100: 243, 232, 255;
  --rgb-purple-200: 233, 213, 255;
  --rgb-purple-300: 216, 180, 254;
  --rgb-purple-400: 192, 132, 252;
  --rgb-purple-500: 168, 85, 247;
  --rgb-purple-600: 147, 51, 234;
  --rgb-purple-700: 126, 34, 206;
  --rgb-purple-800: 107, 33, 168;
  --rgb-purple-900: 88, 28, 135;
  --rgb-fuchsia-50: 253, 244, 255;
  --rgb-fuchsia-100: 250, 232, 255;
  --rgb-fuchsia-200: 245, 208, 254;
  --rgb-fuchsia-300: 240, 171, 252;
  --rgb-fuchsia-400: 232, 121, 249;
  --rgb-fuchsia-500: 217, 70, 239;
  --rgb-fuchsia-600: 192, 38, 211;
  --rgb-fuchsia-700: 162, 28, 175;
  --rgb-fuchsia-800: 134, 25, 143;
  --rgb-fuchsia-900: 112, 26, 117;
  --rgb-pink-50: 253, 242, 248;
  --rgb-pink-100: 252, 231, 243;
  --rgb-pink-200: 251, 207, 232;
  --rgb-pink-300: 249, 168, 212;
  --rgb-pink-400: 244, 114, 182;
  --rgb-pink-500: 236, 72, 153;
  --rgb-pink-600: 219, 39, 119;
  --rgb-pink-700: 190, 24, 93;
  --rgb-pink-800: 157, 23, 77;
  --rgb-pink-900: 131, 24, 67;
  --rgb-rose-50: 255, 241, 242;
  --rgb-rose-100: 255, 228, 230;
  --rgb-rose-200: 254, 205, 211;
  --rgb-rose-300: 253, 164, 175;
  --rgb-rose-400: 251, 113, 133;
  --rgb-rose-500: 244, 63, 94;
  --rgb-rose-600: 225, 29, 72;
  --rgb-rose-700: 190, 18, 60;
  --rgb-rose-800: 159, 18, 57;
  --rgb-rose-900: 136, 19, 55;
  /* Primary Colors HEX */
  --lightest: #ffffff;
  --darkest: #000000;
  --blue-50: #eff6ff;
  --blue-100: #dbeafe;
  --blue-200: #bfdbfe;
  --blue-300: #93c5fd;
  --blue-400: #60a5fa;
  --blue-500: #3b82f6;
  --blue-600: #2563eb;
  --blue-700: #1d4ed8;
  --blue-800: #1e40af;
  --blue-900: #1e3a8a;
  --zinc-50: #fafafa;
  --zinc-100: #f4f4f5;
  --zinc-200: #e4e4e7;
  --zinc-300: #d4d4d8;
  --zinc-400: #a1a1aa;
  --zinc-500: #71717a;
  --zinc-600: #52525b;
  --zinc-700: #3f3f46;
  --zinc-800: #27272a;
  --zinc-900: #18181b;
  --orange-50: #fff7ed;
  --orange-100: #ffedd5;
  --orange-200: #fed7aa;
  --orange-300: #fdba74;
  --orange-400: #fb923c;
  --orange-500: #f97316;
  --orange-600: #ea580c;
  --orange-700: #c2410c;
  --orange-800: #9a3412;
  --orange-900: #7c2d12;
  --green-50: #86efac;
  --green-100: #dcfce7;
  --green-200: #bbf7d0;
  --green-300: #86efac;
  --green-400: #4ade80;
  --green-500: #22c55e;
  --green-600: #16a34a;
  --green-700: #15803d;
  --green-800: #166534;
  --green-900: #14532d;
  --red-50: #fef2f2;
  --red-100: #fee2e2;
  --red-200: #fecaca;
  --red-300: #fca5a5;
  --red-400: #f87171;
  --red-500: #ef4444;
  --red-600: #ef4444;
  --red-700: #b91c1c;
  --red-800: #991b1b;
  --red-900: #7f1d1d;
  --yellow-50: #fefce8;
  --yellow-100: #fef9c3;
  --yellow-200: #fef08a;
  --yellow-300: #fde047;
  --yellow-400: #facc15;
  --yellow-500: #eab308;
  --yellow-600: #ca8a04;
  --yellow-700: #a16207;
  --yellow-800: #854d0e;
  --yellow-900: #713f12;
  --lime-50: #f7fee7;
  --lime-100: #ecfccb;
  --lime-200: #d9f99d;
  --lime-300: #bef264;
  --lime-400: #a3e635;
  --lime-500: #84cc16;
  --lime-600: #65a30d;
  --lime-700: #4d7c0f;
  --lime-800: #3f6212;
  --lime-900: #365314;
  --amber-50: #fffbeb;
  --amber-100: #fef3c7;
  --amber-200: #fde68a;
  --amber-300: #fcd34d;
  --amber-400: #fbbf24;
  --amber-500: #f59e0b;
  --amber-600: #d97706;
  --amber-700: #b45309;
  --amber-800: #92400e;
  --amber-900: #78350f;
  --slate-50: #f8fafc;
  --slate-100: #f1f5f9;
  --slate-200: #e2e8f0;
  --slate-300: #cbd5e1;
  --slate-400: #94a3b8;
  --slate-500: #64748b;
  --slate-600: #475569;
  --slate-700: #334155;
  --slate-800: #1e293b;
  --slate-900: #0f172a;
  --gray-50: #f9fafb;
  --gray-100: #f3f4f6;
  --gray-200: #e5e7eb;
  --gray-300: #d1d5db;
  --gray-400: #9ca3af;
  --gray-500: #6b7280;
  --gray-600: #4b5563;
  --gray-700: #374151;
  --gray-800: #1f2937;
  --gray-900: #111827;
  --neutral-50: #fafafa;
  --neutral-100: #f5f5f5;
  --neutral-200: #e5e5e5;
  --neutral-300: #d4d4d4;
  --neutral-400: #a3a3a3;
  --neutral-500: #737373;
  --neutral-600: #525252;
  --neutral-700: #404040;
  --neutral-800: #262626;
  --neutral-900: #171717;
  --stone-50: #fafaf9;
  --stone-100: #f5f5f4;
  --stone-200: #e7e5e4;
  --stone-300: #d6d3d1;
  --stone-400: #a8a29e;
  --stone-500: #78716c;
  --stone-600: #57534e;
  --stone-700: #44403c;
  --stone-800: #292524;
  --stone-900: #1c1917;
  --cyan-50: #ecfeff;
  --cyan-100: #cffafe;
  --cyan-200: #a5f3fc;
  --cyan-300: #67e8f9;
  --cyan-400: #22d3ee;
  --cyan-500: #06b6d4;
  --cyan-600: #0891b2;
  --cyan-700: #0e7490;
  --cyan-800: #155e75;
  --cyan-900: #164e63;
  --emerald-50: #ecfdf5;
  --emerald-100: #d1fae5;
  --emerald-200: #a7f3d0;
  --emerald-300: #6ee7b7;
  --emerald-400: #34d399;
  --emerald-500: #10b981;
  --emerald-600: #059669;
  --emerald-700: #047857;
  --emerald-800: #065f46;
  --emerald-900: #064e3b;
  --teal-50: #f0fdfa;
  --teal-100: #ccfbf1;
  --teal-200: #99f6e4;
  --teal-300: #5eead4;
  --teal-400: #2dd4bf;
  --teal-500: #14b8a6;
  --teal-600: #0d9488;
  --teal-700: #0f766e;
  --teal-800: #115e59;
  --teal-900: #134e4a;
  --sky-50: #f0f9ff;
  --sky-100: #e0f2fe;
  --sky-200: #bae6fd;
  --sky-300: #7dd3fc;
  --sky-400: #38bdf8;
  --sky-500: #0ea5e9;
  --sky-600: #0284c7;
  --sky-700: #0369a1;
  --sky-800: #075985;
  --sky-900: #0c4a6e;
  --indigo-50: #eef2ff;
  --indigo-100: #e0e7ff;
  --indigo-200: #c7d2fe;
  --indigo-300: #a5b4fc;
  --indigo-400: #818cf8;
  --indigo-500: #6366f1;
  --indigo-600: #4f46e5;
  --indigo-700: #4338ca;
  --indigo-800: #3730a3;
  --indigo-900: #312e81;
  --violet-50: #f5f3ff;
  --violet-100: #ede9fe;
  --violet-200: #ddd6fe;
  --violet-300: #c4b5fd;
  --violet-400: #a78bfa;
  --violet-500: #8b5cf6;
  --violet-600: #7c3aed;
  --violet-700: #6d28d9;
  --violet-800: #5b21b6;
  --violet-900: #4c1d95;
  --purple-50: #faf5ff;
  --purple-100: #f3e8ff;
  --purple-200: #e9d5ff;
  --purple-300: #d8b4fe;
  --purple-400: #c084fc;
  --purple-500: #a855f7;
  --purple-600: #9333ea;
  --purple-700: #7e22ce;
  --purple-800: #6b21a8;
  --purple-900: #581c87;
  --fuchsia-50: #fdf4ff;
  --fuchsia-100: #fae8ff;
  --fuchsia-200: #fae8ff;
  --fuchsia-300: #f0abfc;
  --fuchsia-400: #e879f9;
  --fuchsia-500: #d946ef;
  --fuchsia-600: #c026d3;
  --fuchsia-700: #a21caf;
  --fuchsia-800: #86198f;
  --fuchsia-900: #701a75;
  --pink-50: #fdf2f8;
  --pink-100: #fce7f3;
  --pink-200: #fbcfe8;
  --pink-300: #f9a8d4;
  --pink-400: #f472b6;
  --pink-500: #ec4899;
  --pink-600: #db2777;
  --pink-700: #be185d;
  --pink-800: #9d174d;
  --pink-900: #831843;
  --rose-50: #fff1f2;
  --rose-100: #ffe4e6;
  --rose-200: #fecdd3;
  --rose-300: #fda4af;
  --rose-400: #fb7185;
  --rose-500: #f43f5e;
  --rose-600: #e11d48;
  --rose-700: #be123c;
  --rose-800: #9f1239;
  --rose-900: #881337;
}

.bg-blue-50 {
  background-color: rgb(var(--rgb-blue-50)) !important;
}

.bg-blue-100 {
  background-color: rgb(var(--rgb-blue-100)) !important;
}

.bg-blue-200 {
  background-color: rgb(var(--rgb-blue-200)) !important;
}

.bg-blue-300 {
  background-color: rgb(var(--rgb-blue-300)) !important;
}

.bg-blue-400 {
  background-color: rgb(var(--rgb-blue-400)) !important;
}

.bg-blue-500 {
  background-color: rgb(var(--rgb-blue-500)) !important;
}

.bg-blue-600 {
  background-color: rgb(var(--rgb-blue-600)) !important;
}

.bg-blue-700 {
  background-color: rgb(var(--rgb-blue-700)) !important;
}

.bg-blue-800 {
  background-color: rgb(var(--rgb-blue-800)) !important;
}

.bg-blue-900 {
  background-color: rgb(var(--rgb-blue-900)) !important;
}

.bg-zinc-50 {
  background-color: rgb(var(--rgb-zinc-50)) !important;
}

.bg-zinc-100 {
  background-color: rgb(var(--rgb-zinc-100)) !important;
}

.bg-zinc-200 {
  background-color: rgb(var(--rgb-zinc-200)) !important;
}

.bg-zinc-300 {
  background-color: rgb(var(--rgb-zinc-300)) !important;
}

.bg-zinc-400 {
  background-color: rgb(var(--rgb-zinc-400)) !important;
}

.bg-zinc-500 {
  background-color: rgb(var(--rgb-zinc-500)) !important;
}

.bg-zinc-600 {
  background-color: rgb(var(--rgb-zinc-600)) !important;
}

.bg-zinc-700 {
  background-color: rgb(var(--rgb-zinc-700)) !important;
}

.bg-zinc-800 {
  background-color: rgb(var(--rgb-zinc-800)) !important;
}

.bg-zinc-900 {
  background-color: rgb(var(--rgb-zinc-900)) !important;
}

.bg-orange-50 {
  background-color: rgb(var(--rgb-orange-50)) !important;
}

.bg-orange-100 {
  background-color: rgb(var(--rgb-orange-100)) !important;
}

.bg-orange-200 {
  background-color: rgb(var(--rgb-orange-200)) !important;
}

.bg-orange-300 {
  background-color: rgb(var(--rgb-orange-300)) !important;
}

.bg-orange-400 {
  background-color: rgb(var(--rgb-orange-400)) !important;
}

.bg-orange-500 {
  background-color: rgb(var(--rgb-orange-500)) !important;
}

.bg-orange-600 {
  background-color: rgb(var(--rgb-orange-600)) !important;
}

.bg-orange-700 {
  background-color: rgb(var(--rgb-orange-700)) !important;
}

.bg-orange-800 {
  background-color: rgb(var(--rgb-orange-800)) !important;
}

.bg-orange-900 {
  background-color: rgb(var(--rgb-orange-900)) !important;
}

.bg-green-50 {
  background-color: rgb(var(--rgb-green-50)) !important;
}

.bg-green-100 {
  background-color: rgb(var(--rgb-green-100)) !important;
}

.bg-green-200 {
  background-color: rgb(var(--rgb-green-200)) !important;
}

.bg-green-300 {
  background-color: rgb(var(--rgb-green-300)) !important;
}

.bg-green-400 {
  background-color: rgb(var(--rgb-green-400)) !important;
}

.bg-green-500 {
  background-color: rgb(var(--rgb-green-500)) !important;
}

.bg-green-600 {
  background-color: rgb(var(--rgb-green-600)) !important;
}

.bg-green-700 {
  background-color: rgb(var(--rgb-green-700)) !important;
}

.bg-green-800 {
  background-color: rgb(var(--rgb-green-800)) !important;
}

.bg-green-900 {
  background-color: rgb(var(--rgb-green-900)) !important;
}

.bg-red-50 {
  background-color: rgb(var(--rgb-red-50)) !important;
}

.bg-red-100 {
  background-color: rgb(var(--rgb-red-100)) !important;
}

.bg-red-200 {
  background-color: rgb(var(--rgb-red-200)) !important;
}

.bg-red-300 {
  background-color: rgb(var(--rgb-red-300)) !important;
}

.bg-red-400 {
  background-color: rgb(var(--rgb-red-400)) !important;
}

.bg-red-500 {
  background-color: rgb(var(--rgb-red-500)) !important;
}

.bg-red-600 {
  background-color: rgb(var(--rgb-red-600)) !important;
}

.bg-red-700 {
  background-color: rgb(var(--rgb-red-700)) !important;
}

.bg-red-800 {
  background-color: rgb(var(--rgb-red-800)) !important;
}

.bg-red-900 {
  background-color: rgb(var(--rgb-red-900)) !important;
}

.bg-yellow-50 {
  background-color: rgb(var(--rgb-yellow-50)) !important;
}

.bg-yellow-100 {
  background-color: rgb(var(--rgb-yellow-100)) !important;
}

.bg-yellow-200 {
  background-color: rgb(var(--rgb-yellow-200)) !important;
}

.bg-yellow-300 {
  background-color: rgb(var(--rgb-yellow-300)) !important;
}

.bg-yellow-400 {
  background-color: rgb(var(--rgb-yellow-400)) !important;
}

.bg-yellow-500 {
  background-color: rgb(var(--rgb-yellow-500)) !important;
}

.bg-yellow-600 {
  background-color: rgb(var(--rgb-yellow-600)) !important;
}

.bg-yellow-700 {
  background-color: rgb(var(--rgb-yellow-700)) !important;
}

.bg-yellow-800 {
  background-color: rgb(var(--rgb-yellow-800)) !important;
}

.bg-yellow-900 {
  background-color: rgb(var(--rgb-yellow-900)) !important;
}

.bg-lime-50 {
  background-color: rgb(var(--rgb-lime-50)) !important;
}

.bg-lime-100 {
  background-color: rgb(var(--rgb-lime-100)) !important;
}

.bg-lime-200 {
  background-color: rgb(var(--rgb-lime-200)) !important;
}

.bg-lime-300 {
  background-color: rgb(var(--rgb-lime-300)) !important;
}

.bg-lime-400 {
  background-color: rgb(var(--rgb-lime-400)) !important;
}

.bg-lime-500 {
  background-color: rgb(var(--rgb-lime-500)) !important;
}

.bg-lime-600 {
  background-color: rgb(var(--rgb-lime-600)) !important;
}

.bg-lime-700 {
  background-color: rgb(var(--rgb-lime-700)) !important;
}

.bg-lime-800 {
  background-color: rgb(var(--rgb-lime-800)) !important;
}

.bg-lime-900 {
  background-color: rgb(var(--rgb-lime-900)) !important;
}

.bg-amber-50 {
  background-color: rgb(var(--rgb-amber-50)) !important;
}

.bg-amber-100 {
  background-color: rgb(var(--rgb-amber-100)) !important;
}

.bg-amber-200 {
  background-color: rgb(var(--rgb-amber-200)) !important;
}

.bg-amber-300 {
  background-color: rgb(var(--rgb-amber-300)) !important;
}

.bg-amber-400 {
  background-color: rgb(var(--rgb-amber-400)) !important;
}

.bg-amber-500 {
  background-color: rgb(var(--rgb-amber-500)) !important;
}

.bg-amber-600 {
  background-color: rgb(var(--rgb-amber-600)) !important;
}

.bg-amber-700 {
  background-color: rgb(var(--rgb-amber-700)) !important;
}

.bg-amber-800 {
  background-color: rgb(var(--rgb-amber-800)) !important;
}

.bg-amber-900 {
  background-color: rgb(var(--rgb-amber-900)) !important;
}

.bg-slate-50 {
  background-color: rgb(var(--rgb-slate-50)) !important;
}

.bg-slate-100 {
  background-color: rgb(var(--rgb-slate-100)) !important;
}

.bg-slate-200 {
  background-color: rgb(var(--rgb-slate-200)) !important;
}

.bg-slate-300 {
  background-color: rgb(var(--rgb-slate-300)) !important;
}

.bg-slate-400 {
  background-color: rgb(var(--rgb-slate-400)) !important;
}

.bg-slate-500 {
  background-color: rgb(var(--rgb-slate-500)) !important;
}

.bg-slate-600 {
  background-color: rgb(var(--rgb-slate-600)) !important;
}

.bg-slate-700 {
  background-color: rgb(var(--rgb-slate-700)) !important;
}

.bg-slate-800 {
  background-color: rgb(var(--rgb-slate-800)) !important;
}

.bg-slate-900 {
  background-color: rgb(var(--rgb-slate-900)) !important;
}

.bg-gray-50 {
  background-color: rgb(var(--rgb-gray-50)) !important;
}

.bg-gray-100 {
  background-color: rgb(var(--rgb-gray-100)) !important;
}

.bg-gray-200 {
  background-color: rgb(var(--rgb-gray-200)) !important;
}

.bg-gray-300 {
  background-color: rgb(var(--rgb-gray-300)) !important;
}

.bg-gray-400 {
  background-color: rgb(var(--rgb-gray-400)) !important;
}

.bg-gray-500 {
  background-color: rgb(var(--rgb-gray-500)) !important;
}

.bg-gray-600 {
  background-color: rgb(var(--rgb-gray-600)) !important;
}

.bg-gray-700 {
  background-color: rgb(var(--rgb-gray-700)) !important;
}

.bg-gray-800 {
  background-color: rgb(var(--rgb-gray-800)) !important;
}

.bg-gray-900 {
  background-color: rgb(var(--rgb-gray-900)) !important;
}

.bg-neutral-50 {
  background-color: rgb(var(--rgb-neutral-50)) !important;
}

.bg-neutral-100 {
  background-color: rgb(var(--rgb-neutral-100)) !important;
}

.bg-neutral-200 {
  background-color: rgb(var(--rgb-neutral-200)) !important;
}

.bg-neutral-300 {
  background-color: rgb(var(--rgb-neutral-300)) !important;
}

.bg-neutral-400 {
  background-color: rgb(var(--rgb-neutral-400)) !important;
}

.bg-neutral-500 {
  background-color: rgb(var(--rgb-neutral-500)) !important;
}

.bg-neutral-600 {
  background-color: rgb(var(--rgb-neutral-600)) !important;
}

.bg-neutral-700 {
  background-color: rgb(var(--rgb-neutral-700)) !important;
}

.bg-neutral-800 {
  background-color: rgb(var(--rgb-neutral-800)) !important;
}

.bg-neutral-900 {
  background-color: rgb(var(--rgb-neutral-900)) !important;
}

.bg-stone-50 {
  background-color: rgb(var(--rgb-stone-50)) !important;
}

.bg-stone-100 {
  background-color: rgb(var(--rgb-stone-100)) !important;
}

.bg-stone-200 {
  background-color: rgb(var(--rgb-stone-200)) !important;
}

.bg-stone-300 {
  background-color: rgb(var(--rgb-stone-300)) !important;
}

.bg-stone-400 {
  background-color: rgb(var(--rgb-stone-400)) !important;
}

.bg-stone-500 {
  background-color: rgb(var(--rgb-stone-500)) !important;
}

.bg-stone-600 {
  background-color: rgb(var(--rgb-stone-600)) !important;
}

.bg-stone-700 {
  background-color: rgb(var(--rgb-stone-700)) !important;
}

.bg-stone-800 {
  background-color: rgb(var(--rgb-stone-800)) !important;
}

.bg-stone-900 {
  background-color: rgb(var(--rgb-stone-900)) !important;
}

.bg-cyan-50 {
  background-color: rgb(var(--rgb-cyan-50)) !important;
}

.bg-cyan-100 {
  background-color: rgb(var(--rgb-cyan-100)) !important;
}

.bg-cyan-200 {
  background-color: rgb(var(--rgb-cyan-200)) !important;
}

.bg-cyan-300 {
  background-color: rgb(var(--rgb-cyan-300)) !important;
}

.bg-cyan-400 {
  background-color: rgb(var(--rgb-cyan-400)) !important;
}

.bg-cyan-500 {
  background-color: rgb(var(--rgb-cyan-500)) !important;
}

.bg-cyan-600 {
  background-color: rgb(var(--rgb-cyan-600)) !important;
}

.bg-cyan-700 {
  background-color: rgb(var(--rgb-cyan-700)) !important;
}

.bg-cyan-800 {
  background-color: rgb(var(--rgb-cyan-800)) !important;
}

.bg-cyan-900 {
  background-color: rgb(var(--rgb-cyan-900)) !important;
}

.bg-emerald-50 {
  background-color: rgb(var(--rgb-emerald-50)) !important;
}

.bg-emerald-100 {
  background-color: rgb(var(--rgb-emerald-100)) !important;
}

.bg-emerald-200 {
  background-color: rgb(var(--rgb-emerald-200)) !important;
}

.bg-emerald-300 {
  background-color: rgb(var(--rgb-emerald-300)) !important;
}

.bg-emerald-400 {
  background-color: rgb(var(--rgb-emerald-400)) !important;
}

.bg-emerald-500 {
  background-color: rgb(var(--rgb-emerald-500)) !important;
}

.bg-emerald-600 {
  background-color: rgb(var(--rgb-emerald-600)) !important;
}

.bg-emerald-700 {
  background-color: rgb(var(--rgb-emerald-700)) !important;
}

.bg-emerald-800 {
  background-color: rgb(var(--rgb-emerald-800)) !important;
}

.bg-emerald-900 {
  background-color: rgb(var(--rgb-emerald-900)) !important;
}

.bg-teal-50 {
  background-color: rgb(var(--rgb-teal-50)) !important;
}

.bg-teal-100 {
  background-color: rgb(var(--rgb-teal-100)) !important;
}

.bg-teal-200 {
  background-color: rgb(var(--rgb-teal-200)) !important;
}

.bg-teal-300 {
  background-color: rgb(var(--rgb-teal-300)) !important;
}

.bg-teal-400 {
  background-color: rgb(var(--rgb-teal-400)) !important;
}

.bg-teal-500 {
  background-color: rgb(var(--rgb-teal-500)) !important;
}

.bg-teal-600 {
  background-color: rgb(var(--rgb-teal-600)) !important;
}

.bg-teal-700 {
  background-color: rgb(var(--rgb-teal-700)) !important;
}

.bg-teal-800 {
  background-color: rgb(var(--rgb-teal-800)) !important;
}

.bg-teal-900 {
  background-color: rgb(var(--rgb-teal-900)) !important;
}

.bg-sky-50 {
  background-color: rgb(var(--rgb-sky-50)) !important;
}

.bg-sky-100 {
  background-color: rgb(var(--rgb-sky-100)) !important;
}

.bg-sky-200 {
  background-color: rgb(var(--rgb-sky-200)) !important;
}

.bg-sky-300 {
  background-color: rgb(var(--rgb-sky-300)) !important;
}

.bg-sky-400 {
  background-color: rgb(var(--rgb-sky-400)) !important;
}

.bg-sky-500 {
  background-color: rgb(var(--rgb-sky-500)) !important;
}

.bg-sky-600 {
  background-color: rgb(var(--rgb-sky-600)) !important;
}

.bg-sky-700 {
  background-color: rgb(var(--rgb-sky-700)) !important;
}

.bg-sky-800 {
  background-color: rgb(var(--rgb-sky-800)) !important;
}

.bg-sky-900 {
  background-color: rgb(var(--rgb-sky-900)) !important;
}

.bg-indigo-50 {
  background-color: rgb(var(--rgb-indigo-50)) !important;
}

.bg-indigo-100 {
  background-color: rgb(var(--rgb-indigo-100)) !important;
}

.bg-indigo-200 {
  background-color: rgb(var(--rgb-indigo-200)) !important;
}

.bg-indigo-300 {
  background-color: rgb(var(--rgb-indigo-300)) !important;
}

.bg-indigo-400 {
  background-color: rgb(var(--rgb-indigo-400)) !important;
}

.bg-indigo-500 {
  background-color: rgb(var(--rgb-indigo-500)) !important;
}

.bg-indigo-600 {
  background-color: rgb(var(--rgb-indigo-600)) !important;
}

.bg-indigo-700 {
  background-color: rgb(var(--rgb-indigo-700)) !important;
}

.bg-indigo-800 {
  background-color: rgb(var(--rgb-indigo-800)) !important;
}

.bg-indigo-900 {
  background-color: rgb(var(--rgb-indigo-900)) !important;
}

.bg-violet-50 {
  background-color: rgb(var(--rgb-violet-50)) !important;
}

.bg-violet-100 {
  background-color: rgb(var(--rgb-violet-100)) !important;
}

.bg-violet-200 {
  background-color: rgb(var(--rgb-violet-200)) !important;
}

.bg-violet-300 {
  background-color: rgb(var(--rgb-violet-300)) !important;
}

.bg-violet-400 {
  background-color: rgb(var(--rgb-violet-400)) !important;
}

.bg-violet-500 {
  background-color: rgb(var(--rgb-violet-500)) !important;
}

.bg-violet-600 {
  background-color: rgb(var(--rgb-violet-600)) !important;
}

.bg-violet-700 {
  background-color: rgb(var(--rgb-violet-700)) !important;
}

.bg-violet-800 {
  background-color: rgb(var(--rgb-violet-800)) !important;
}

.bg-violet-900 {
  background-color: rgb(var(--rgb-violet-900)) !important;
}

.bg-purple-50 {
  background-color: rgb(var(--rgb-purple-50)) !important;
}

.bg-purple-100 {
  background-color: rgb(var(--rgb-purple-100)) !important;
}

.bg-purple-200 {
  background-color: rgb(var(--rgb-purple-200)) !important;
}

.bg-purple-300 {
  background-color: rgb(var(--rgb-purple-300)) !important;
}

.bg-purple-400 {
  background-color: rgb(var(--rgb-purple-400)) !important;
}

.bg-purple-500 {
  background-color: rgb(var(--rgb-purple-500)) !important;
}

.bg-purple-600 {
  background-color: rgb(var(--rgb-purple-600)) !important;
}

.bg-purple-700 {
  background-color: rgb(var(--rgb-purple-700)) !important;
}

.bg-purple-800 {
  background-color: rgb(var(--rgb-purple-800)) !important;
}

.bg-purple-900 {
  background-color: rgb(var(--rgb-purple-900)) !important;
}

.bg-fuchsia-50 {
  background-color: rgb(var(--rgb-fuchsia-50)) !important;
}

.bg-fuchsia-100 {
  background-color: rgb(var(--rgb-fuchsia-100)) !important;
}

.bg-fuchsia-200 {
  background-color: rgb(var(--rgb-fuchsia-200)) !important;
}

.bg-fuchsia-300 {
  background-color: rgb(var(--rgb-fuchsia-300)) !important;
}

.bg-fuchsia-400 {
  background-color: rgb(var(--rgb-fuchsia-400)) !important;
}

.bg-fuchsia-500 {
  background-color: rgb(var(--rgb-fuchsia-500)) !important;
}

.bg-fuchsia-600 {
  background-color: rgb(var(--rgb-fuchsia-600)) !important;
}

.bg-fuchsia-700 {
  background-color: rgb(var(--rgb-fuchsia-700)) !important;
}

.bg-fuchsia-800 {
  background-color: rgb(var(--rgb-fuchsia-800)) !important;
}

.bg-fuchsia-900 {
  background-color: rgb(var(--rgb-fuchsia-900)) !important;
}

.bg-pink-50 {
  background-color: rgb(var(--rgb-pink-50)) !important;
}

.bg-pink-100 {
  background-color: rgb(var(--rgb-pink-100)) !important;
}

.bg-pink-200 {
  background-color: rgb(var(--rgb-pink-200)) !important;
}

.bg-pink-300 {
  background-color: rgb(var(--rgb-pink-300)) !important;
}

.bg-pink-400 {
  background-color: rgb(var(--rgb-pink-400)) !important;
}

.bg-pink-500 {
  background-color: rgb(var(--rgb-pink-500)) !important;
}

.bg-pink-600 {
  background-color: rgb(var(--rgb-pink-600)) !important;
}

.bg-pink-700 {
  background-color: rgb(var(--rgb-pink-700)) !important;
}

.bg-pink-800 {
  background-color: rgb(var(--rgb-pink-800)) !important;
}

.bg-pink-900 {
  background-color: rgb(var(--rgb-pink-900)) !important;
}

.bg-rose-50 {
  background-color: rgb(var(--rgb-rose-50)) !important;
}

.bg-rose-100 {
  background-color: rgb(var(--rgb-rose-100)) !important;
}

.bg-rose-200 {
  background-color: rgb(var(--rgb-rose-200)) !important;
}

.bg-rose-300 {
  background-color: rgb(var(--rgb-rose-300)) !important;
}

.bg-rose-400 {
  background-color: rgb(var(--rgb-rose-400)) !important;
}

.bg-rose-500 {
  background-color: rgb(var(--rgb-rose-500)) !important;
}

.bg-rose-600 {
  background-color: rgb(var(--rgb-rose-600)) !important;
}

.bg-rose-700 {
  background-color: rgb(var(--rgb-rose-700)) !important;
}

.bg-rose-800 {
  background-color: rgb(var(--rgb-rose-800)) !important;
}

.bg-rose-900 {
  background-color: rgb(var(--rgb-rose-900)) !important;
}

.text-blue-50 {
  color: rgb(var(--rgb-blue-50)) !important;
}

.text-blue-100 {
  color: rgb(var(--rgb-blue-100)) !important;
}

.text-blue-200 {
  color: rgb(var(--rgb-blue-200)) !important;
}

.text-blue-300 {
  color: rgb(var(--rgb-blue-300)) !important;
}

.text-blue-400 {
  color: rgb(var(--rgb-blue-400)) !important;
}

.text-blue-500 {
  color: rgb(var(--rgb-blue-500)) !important;
}

.text-blue-600 {
  color: rgb(var(--rgb-blue-600)) !important;
}

.text-blue-700 {
  color: rgb(var(--rgb-blue-700)) !important;
}

.text-blue-800 {
  color: rgb(var(--rgb-blue-800)) !important;
}

.text-blue-900 {
  color: rgb(var(--rgb-blue-900)) !important;
}

.text-zinc-50 {
  color: rgb(var(--rgb-zinc-50)) !important;
}

.text-zinc-100 {
  color: rgb(var(--rgb-zinc-100)) !important;
}

.text-zinc-200 {
  color: rgb(var(--rgb-zinc-200)) !important;
}

.text-zinc-300 {
  color: rgb(var(--rgb-zinc-300)) !important;
}

.text-zinc-400 {
  color: rgb(var(--rgb-zinc-400)) !important;
}

.text-zinc-500 {
  color: rgb(var(--rgb-zinc-500)) !important;
}

.text-zinc-600 {
  color: rgb(var(--rgb-zinc-600)) !important;
}

.text-zinc-700 {
  color: rgb(var(--rgb-zinc-700)) !important;
}

.text-zinc-800 {
  color: rgb(var(--rgb-zinc-800)) !important;
}

.text-zinc-900 {
  color: rgb(var(--rgb-zinc-900)) !important;
}

.text-orange-50 {
  color: rgb(var(--rgb-orange-50)) !important;
}

.text-orange-100 {
  color: rgb(var(--rgb-orange-100)) !important;
}

.text-orange-200 {
  color: rgb(var(--rgb-orange-200)) !important;
}

.text-orange-300 {
  color: rgb(var(--rgb-orange-300)) !important;
}

.text-orange-400 {
  color: rgb(var(--rgb-orange-400)) !important;
}

.text-orange-500 {
  color: rgb(var(--rgb-orange-500)) !important;
}

.text-orange-600 {
  color: rgb(var(--rgb-orange-600)) !important;
}

.text-orange-700 {
  color: rgb(var(--rgb-orange-700)) !important;
}

.text-orange-800 {
  color: rgb(var(--rgb-orange-800)) !important;
}

.text-orange-900 {
  color: rgb(var(--rgb-orange-900)) !important;
}

.text-green-50 {
  color: rgb(var(--rgb-green-50)) !important;
}

.text-green-100 {
  color: rgb(var(--rgb-green-100)) !important;
}

.text-green-200 {
  color: rgb(var(--rgb-green-200)) !important;
}

.text-green-300 {
  color: rgb(var(--rgb-green-300)) !important;
}

.text-green-400 {
  color: rgb(var(--rgb-green-400)) !important;
}

.text-green-500 {
  color: rgb(var(--rgb-green-500)) !important;
}

.text-green-600 {
  color: rgb(var(--rgb-green-600)) !important;
}

.text-green-700 {
  color: rgb(var(--rgb-green-700)) !important;
}

.text-green-800 {
  color: rgb(var(--rgb-green-800)) !important;
}

.text-green-900 {
  color: rgb(var(--rgb-green-900)) !important;
}

.text-red-50 {
  color: rgb(var(--rgb-red-50)) !important;
}

.text-red-100 {
  color: rgb(var(--rgb-red-100)) !important;
}

.text-red-200 {
  color: rgb(var(--rgb-red-200)) !important;
}

.text-red-300 {
  color: rgb(var(--rgb-red-300)) !important;
}

.text-red-400 {
  color: rgb(var(--rgb-red-400)) !important;
}

.text-red-500 {
  color: rgb(var(--rgb-red-500)) !important;
}

.text-red-600 {
  color: rgb(var(--rgb-red-600)) !important;
}

.text-red-700 {
  color: rgb(var(--rgb-red-700)) !important;
}

.text-red-800 {
  color: rgb(var(--rgb-red-800)) !important;
}

.text-red-900 {
  color: rgb(var(--rgb-red-900)) !important;
}

.text-yellow-50 {
  color: rgb(var(--rgb-yellow-50)) !important;
}

.text-yellow-100 {
  color: rgb(var(--rgb-yellow-100)) !important;
}

.text-yellow-200 {
  color: rgb(var(--rgb-yellow-200)) !important;
}

.text-yellow-300 {
  color: rgb(var(--rgb-yellow-300)) !important;
}

.text-yellow-400 {
  color: rgb(var(--rgb-yellow-400)) !important;
}

.text-yellow-500 {
  color: rgb(var(--rgb-yellow-500)) !important;
}

.text-yellow-600 {
  color: rgb(var(--rgb-yellow-600)) !important;
}

.text-yellow-700 {
  color: rgb(var(--rgb-yellow-700)) !important;
}

.text-yellow-800 {
  color: rgb(var(--rgb-yellow-800)) !important;
}

.text-yellow-900 {
  color: rgb(var(--rgb-yellow-900)) !important;
}

.text-lime-50 {
  color: rgb(var(--rgb-lime-50)) !important;
}

.text-lime-100 {
  color: rgb(var(--rgb-lime-100)) !important;
}

.text-lime-200 {
  color: rgb(var(--rgb-lime-200)) !important;
}

.text-lime-300 {
  color: rgb(var(--rgb-lime-300)) !important;
}

.text-lime-400 {
  color: rgb(var(--rgb-lime-400)) !important;
}

.text-lime-500 {
  color: rgb(var(--rgb-lime-500)) !important;
}

.text-lime-600 {
  color: rgb(var(--rgb-lime-600)) !important;
}

.text-lime-700 {
  color: rgb(var(--rgb-lime-700)) !important;
}

.text-lime-800 {
  color: rgb(var(--rgb-lime-800)) !important;
}

.text-lime-900 {
  color: rgb(var(--rgb-lime-900)) !important;
}

.text-amber-50 {
  color: rgb(var(--rgb-amber-50)) !important;
}

.text-amber-100 {
  color: rgb(var(--rgb-amber-100)) !important;
}

.text-amber-200 {
  color: rgb(var(--rgb-amber-200)) !important;
}

.text-amber-300 {
  color: rgb(var(--rgb-amber-300)) !important;
}

.text-amber-400 {
  color: rgb(var(--rgb-amber-400)) !important;
}

.text-amber-500 {
  color: rgb(var(--rgb-amber-500)) !important;
}

.text-amber-600 {
  color: rgb(var(--rgb-amber-600)) !important;
}

.text-amber-700 {
  color: rgb(var(--rgb-amber-700)) !important;
}

.text-amber-800 {
  color: rgb(var(--rgb-amber-800)) !important;
}

.text-amber-900 {
  color: rgb(var(--rgb-amber-900)) !important;
}

.text-slate-50 {
  color: rgb(var(--rgb-slate-50)) !important;
}

.text-slate-100 {
  color: rgb(var(--rgb-slate-100)) !important;
}

.text-slate-200 {
  color: rgb(var(--rgb-slate-200)) !important;
}

.text-slate-300 {
  color: rgb(var(--rgb-slate-300)) !important;
}

.text-slate-400 {
  color: rgb(var(--rgb-slate-400)) !important;
}

.text-slate-500 {
  color: rgb(var(--rgb-slate-500)) !important;
}

.text-slate-600 {
  color: rgb(var(--rgb-slate-600)) !important;
}

.text-slate-700 {
  color: rgb(var(--rgb-slate-700)) !important;
}

.text-slate-800 {
  color: rgb(var(--rgb-slate-800)) !important;
}

.text-slate-900 {
  color: rgb(var(--rgb-slate-900)) !important;
}

.text-gray-50 {
  color: rgb(var(--rgb-gray-50)) !important;
}

.text-gray-100 {
  color: rgb(var(--rgb-gray-100)) !important;
}

.text-gray-200 {
  color: rgb(var(--rgb-gray-200)) !important;
}

.text-gray-300 {
  color: rgb(var(--rgb-gray-300)) !important;
}

.text-gray-400 {
  color: rgb(var(--rgb-gray-400)) !important;
}

.text-gray-500 {
  color: rgb(var(--rgb-gray-500)) !important;
}

.text-gray-600 {
  color: rgb(var(--rgb-gray-600)) !important;
}

.text-gray-700 {
  color: rgb(var(--rgb-gray-700)) !important;
}

.text-gray-800 {
  color: rgb(var(--rgb-gray-800)) !important;
}

.text-gray-900 {
  color: rgb(var(--rgb-gray-900)) !important;
}

.text-neutral-50 {
  color: rgb(var(--rgb-neutral-50)) !important;
}

.text-neutral-100 {
  color: rgb(var(--rgb-neutral-100)) !important;
}

.text-neutral-200 {
  color: rgb(var(--rgb-neutral-200)) !important;
}

.text-neutral-300 {
  color: rgb(var(--rgb-neutral-300)) !important;
}

.text-neutral-400 {
  color: rgb(var(--rgb-neutral-400)) !important;
}

.text-neutral-500 {
  color: rgb(var(--rgb-neutral-500)) !important;
}

.text-neutral-600 {
  color: rgb(var(--rgb-neutral-600)) !important;
}

.text-neutral-700 {
  color: rgb(var(--rgb-neutral-700)) !important;
}

.text-neutral-800 {
  color: rgb(var(--rgb-neutral-800)) !important;
}

.text-neutral-900 {
  color: rgb(var(--rgb-neutral-900)) !important;
}

.text-stone-50 {
  color: rgb(var(--rgb-stone-50)) !important;
}

.text-stone-100 {
  color: rgb(var(--rgb-stone-100)) !important;
}

.text-stone-200 {
  color: rgb(var(--rgb-stone-200)) !important;
}

.text-stone-300 {
  color: rgb(var(--rgb-stone-300)) !important;
}

.text-stone-400 {
  color: rgb(var(--rgb-stone-400)) !important;
}

.text-stone-500 {
  color: rgb(var(--rgb-stone-500)) !important;
}

.text-stone-600 {
  color: rgb(var(--rgb-stone-600)) !important;
}

.text-stone-700 {
  color: rgb(var(--rgb-stone-700)) !important;
}

.text-stone-800 {
  color: rgb(var(--rgb-stone-800)) !important;
}

.text-stone-900 {
  color: rgb(var(--rgb-stone-900)) !important;
}

.text-cyan-50 {
  color: rgb(var(--rgb-cyan-50)) !important;
}

.text-cyan-100 {
  color: rgb(var(--rgb-cyan-100)) !important;
}

.text-cyan-200 {
  color: rgb(var(--rgb-cyan-200)) !important;
}

.text-cyan-300 {
  color: rgb(var(--rgb-cyan-300)) !important;
}

.text-cyan-400 {
  color: rgb(var(--rgb-cyan-400)) !important;
}

.text-cyan-500 {
  color: rgb(var(--rgb-cyan-500)) !important;
}

.text-cyan-600 {
  color: rgb(var(--rgb-cyan-600)) !important;
}

.text-cyan-700 {
  color: rgb(var(--rgb-cyan-700)) !important;
}

.text-cyan-800 {
  color: rgb(var(--rgb-cyan-800)) !important;
}

.text-cyan-900 {
  color: rgb(var(--rgb-cyan-900)) !important;
}

.text-emerald-50 {
  color: rgb(var(--rgb-emerald-50)) !important;
}

.text-emerald-100 {
  color: rgb(var(--rgb-emerald-100)) !important;
}

.text-emerald-200 {
  color: rgb(var(--rgb-emerald-200)) !important;
}

.text-emerald-300 {
  color: rgb(var(--rgb-emerald-300)) !important;
}

.text-emerald-400 {
  color: rgb(var(--rgb-emerald-400)) !important;
}

.text-emerald-500 {
  color: rgb(var(--rgb-emerald-500)) !important;
}

.text-emerald-600 {
  color: rgb(var(--rgb-emerald-600)) !important;
}

.text-emerald-700 {
  color: rgb(var(--rgb-emerald-700)) !important;
}

.text-emerald-800 {
  color: rgb(var(--rgb-emerald-800)) !important;
}

.text-emerald-900 {
  color: rgb(var(--rgb-emerald-900)) !important;
}

.text-teal-50 {
  color: rgb(var(--rgb-teal-50)) !important;
}

.text-teal-100 {
  color: rgb(var(--rgb-teal-100)) !important;
}

.text-teal-200 {
  color: rgb(var(--rgb-teal-200)) !important;
}

.text-teal-300 {
  color: rgb(var(--rgb-teal-300)) !important;
}

.text-teal-400 {
  color: rgb(var(--rgb-teal-400)) !important;
}

.text-teal-500 {
  color: rgb(var(--rgb-teal-500)) !important;
}

.text-teal-600 {
  color: rgb(var(--rgb-teal-600)) !important;
}

.text-teal-700 {
  color: rgb(var(--rgb-teal-700)) !important;
}

.text-teal-800 {
  color: rgb(var(--rgb-teal-800)) !important;
}

.text-teal-900 {
  color: rgb(var(--rgb-teal-900)) !important;
}

.text-sky-50 {
  color: rgb(var(--rgb-sky-50)) !important;
}

.text-sky-100 {
  color: rgb(var(--rgb-sky-100)) !important;
}

.text-sky-200 {
  color: rgb(var(--rgb-sky-200)) !important;
}

.text-sky-300 {
  color: rgb(var(--rgb-sky-300)) !important;
}

.text-sky-400 {
  color: rgb(var(--rgb-sky-400)) !important;
}

.text-sky-500 {
  color: rgb(var(--rgb-sky-500)) !important;
}

.text-sky-600 {
  color: rgb(var(--rgb-sky-600)) !important;
}

.text-sky-700 {
  color: rgb(var(--rgb-sky-700)) !important;
}

.text-sky-800 {
  color: rgb(var(--rgb-sky-800)) !important;
}

.text-sky-900 {
  color: rgb(var(--rgb-sky-900)) !important;
}

.text-indigo-50 {
  color: rgb(var(--rgb-indigo-50)) !important;
}

.text-indigo-100 {
  color: rgb(var(--rgb-indigo-100)) !important;
}

.text-indigo-200 {
  color: rgb(var(--rgb-indigo-200)) !important;
}

.text-indigo-300 {
  color: rgb(var(--rgb-indigo-300)) !important;
}

.text-indigo-400 {
  color: rgb(var(--rgb-indigo-400)) !important;
}

.text-indigo-500 {
  color: rgb(var(--rgb-indigo-500)) !important;
}

.text-indigo-600 {
  color: rgb(var(--rgb-indigo-600)) !important;
}

.text-indigo-700 {
  color: rgb(var(--rgb-indigo-700)) !important;
}

.text-indigo-800 {
  color: rgb(var(--rgb-indigo-800)) !important;
}

.text-indigo-900 {
  color: rgb(var(--rgb-indigo-900)) !important;
}

.text-violet-50 {
  color: rgb(var(--rgb-violet-50)) !important;
}

.text-violet-100 {
  color: rgb(var(--rgb-violet-100)) !important;
}

.text-violet-200 {
  color: rgb(var(--rgb-violet-200)) !important;
}

.text-violet-300 {
  color: rgb(var(--rgb-violet-300)) !important;
}

.text-violet-400 {
  color: rgb(var(--rgb-violet-400)) !important;
}

.text-violet-500 {
  color: rgb(var(--rgb-violet-500)) !important;
}

.text-violet-600 {
  color: rgb(var(--rgb-violet-600)) !important;
}

.text-violet-700 {
  color: rgb(var(--rgb-violet-700)) !important;
}

.text-violet-800 {
  color: rgb(var(--rgb-violet-800)) !important;
}

.text-violet-900 {
  color: rgb(var(--rgb-violet-900)) !important;
}

.text-purple-50 {
  color: rgb(var(--rgb-purple-50)) !important;
}

.text-purple-100 {
  color: rgb(var(--rgb-purple-100)) !important;
}

.text-purple-200 {
  color: rgb(var(--rgb-purple-200)) !important;
}

.text-purple-300 {
  color: rgb(var(--rgb-purple-300)) !important;
}

.text-purple-400 {
  color: rgb(var(--rgb-purple-400)) !important;
}

.text-purple-500 {
  color: rgb(var(--rgb-purple-500)) !important;
}

.text-purple-600 {
  color: rgb(var(--rgb-purple-600)) !important;
}

.text-purple-700 {
  color: rgb(var(--rgb-purple-700)) !important;
}

.text-purple-800 {
  color: rgb(var(--rgb-purple-800)) !important;
}

.text-purple-900 {
  color: rgb(var(--rgb-purple-900)) !important;
}

.text-fuchsia-50 {
  color: rgb(var(--rgb-fuchsia-50)) !important;
}

.text-fuchsia-100 {
  color: rgb(var(--rgb-fuchsia-100)) !important;
}

.text-fuchsia-200 {
  color: rgb(var(--rgb-fuchsia-200)) !important;
}

.text-fuchsia-300 {
  color: rgb(var(--rgb-fuchsia-300)) !important;
}

.text-fuchsia-400 {
  color: rgb(var(--rgb-fuchsia-400)) !important;
}

.text-fuchsia-500 {
  color: rgb(var(--rgb-fuchsia-500)) !important;
}

.text-fuchsia-600 {
  color: rgb(var(--rgb-fuchsia-600)) !important;
}

.text-fuchsia-700 {
  color: rgb(var(--rgb-fuchsia-700)) !important;
}

.text-fuchsia-800 {
  color: rgb(var(--rgb-fuchsia-800)) !important;
}

.text-fuchsia-900 {
  color: rgb(var(--rgb-fuchsia-900)) !important;
}

.text-pink-50 {
  color: rgb(var(--rgb-pink-50)) !important;
}

.text-pink-100 {
  color: rgb(var(--rgb-pink-100)) !important;
}

.text-pink-200 {
  color: rgb(var(--rgb-pink-200)) !important;
}

.text-pink-300 {
  color: rgb(var(--rgb-pink-300)) !important;
}

.text-pink-400 {
  color: rgb(var(--rgb-pink-400)) !important;
}

.text-pink-500 {
  color: rgb(var(--rgb-pink-500)) !important;
}

.text-pink-600 {
  color: rgb(var(--rgb-pink-600)) !important;
}

.text-pink-700 {
  color: rgb(var(--rgb-pink-700)) !important;
}

.text-pink-800 {
  color: rgb(var(--rgb-pink-800)) !important;
}

.text-pink-900 {
  color: rgb(var(--rgb-pink-900)) !important;
}

.text-rose-50 {
  color: rgb(var(--rgb-rose-50)) !important;
}

.text-rose-100 {
  color: rgb(var(--rgb-rose-100)) !important;
}

.text-rose-200 {
  color: rgb(var(--rgb-rose-200)) !important;
}

.text-rose-300 {
  color: rgb(var(--rgb-rose-300)) !important;
}

.text-rose-400 {
  color: rgb(var(--rgb-rose-400)) !important;
}

.text-rose-500 {
  color: rgb(var(--rgb-rose-500)) !important;
}

.text-rose-600 {
  color: rgb(var(--rgb-rose-600)) !important;
}

.text-rose-700 {
  color: rgb(var(--rgb-rose-700)) !important;
}

.text-rose-800 {
  color: rgb(var(--rgb-rose-800)) !important;
}

.text-rose-900 {
  color: rgb(var(--rgb-rose-900)) !important;
}

.svg-blue-50 {
  fill: rgb(var(--rgb-blue-50)) !important;
}

.svg-blue-100 {
  fill: rgb(var(--rgb-blue-100)) !important;
}

.svg-blue-200 {
  fill: rgb(var(--rgb-blue-200)) !important;
}

.svg-blue-300 {
  fill: rgb(var(--rgb-blue-300)) !important;
}

.svg-blue-400 {
  fill: rgb(var(--rgb-blue-400)) !important;
}

.svg-blue-500 {
  fill: rgb(var(--rgb-blue-500)) !important;
}

.svg-blue-600 {
  fill: rgb(var(--rgb-blue-600)) !important;
}

.svg-blue-700 {
  fill: rgb(var(--rgb-blue-700)) !important;
}

.svg-blue-800 {
  fill: rgb(var(--rgb-blue-800)) !important;
}

.svg-blue-900 {
  fill: rgb(var(--rgb-blue-900)) !important;
}

.svg-zinc-50 {
  fill: rgb(var(--rgb-zinc-50)) !important;
}

.svg-zinc-100 {
  fill: rgb(var(--rgb-zinc-100)) !important;
}

.svg-zinc-200 {
  fill: rgb(var(--rgb-zinc-200)) !important;
}

.svg-zinc-300 {
  fill: rgb(var(--rgb-zinc-300)) !important;
}

.svg-zinc-400 {
  fill: rgb(var(--rgb-zinc-400)) !important;
}

.svg-zinc-500 {
  fill: rgb(var(--rgb-zinc-500)) !important;
}

.svg-zinc-600 {
  fill: rgb(var(--rgb-zinc-600)) !important;
}

.svg-zinc-700 {
  fill: rgb(var(--rgb-zinc-700)) !important;
}

.svg-zinc-800 {
  fill: rgb(var(--rgb-zinc-800)) !important;
}

.svg-zinc-900 {
  fill: rgb(var(--rgb-zinc-900)) !important;
}

.svg-orange-50 {
  fill: rgb(var(--rgb-orange-50)) !important;
}

.svg-orange-100 {
  fill: rgb(var(--rgb-orange-100)) !important;
}

.svg-orange-200 {
  fill: rgb(var(--rgb-orange-200)) !important;
}

.svg-orange-300 {
  fill: rgb(var(--rgb-orange-300)) !important;
}

.svg-orange-400 {
  fill: rgb(var(--rgb-orange-400)) !important;
}

.svg-orange-500 {
  fill: rgb(var(--rgb-orange-500)) !important;
}

.svg-orange-600 {
  fill: rgb(var(--rgb-orange-600)) !important;
}

.svg-orange-700 {
  fill: rgb(var(--rgb-orange-700)) !important;
}

.svg-orange-800 {
  fill: rgb(var(--rgb-orange-800)) !important;
}

.svg-orange-900 {
  fill: rgb(var(--rgb-orange-900)) !important;
}

.svg-green-50 {
  fill: rgb(var(--rgb-green-50)) !important;
}

.svg-green-100 {
  fill: rgb(var(--rgb-green-100)) !important;
}

.svg-green-200 {
  fill: rgb(var(--rgb-green-200)) !important;
}

.svg-green-300 {
  fill: rgb(var(--rgb-green-300)) !important;
}

.svg-green-400 {
  fill: rgb(var(--rgb-green-400)) !important;
}

.svg-green-500 {
  fill: rgb(var(--rgb-green-500)) !important;
}

.svg-green-600 {
  fill: rgb(var(--rgb-green-600)) !important;
}

.svg-green-700 {
  fill: rgb(var(--rgb-green-700)) !important;
}

.svg-green-800 {
  fill: rgb(var(--rgb-green-800)) !important;
}

.svg-green-900 {
  fill: rgb(var(--rgb-green-900)) !important;
}

.svg-red-50 {
  fill: rgb(var(--rgb-red-50)) !important;
}

.svg-red-100 {
  fill: rgb(var(--rgb-red-100)) !important;
}

.svg-red-200 {
  fill: rgb(var(--rgb-red-200)) !important;
}

.svg-red-300 {
  fill: rgb(var(--rgb-red-300)) !important;
}

.svg-red-400 {
  fill: rgb(var(--rgb-red-400)) !important;
}

.svg-red-500 {
  fill: rgb(var(--rgb-red-500)) !important;
}

.svg-red-600 {
  fill: rgb(var(--rgb-red-600)) !important;
}

.svg-red-700 {
  fill: rgb(var(--rgb-red-700)) !important;
}

.svg-red-800 {
  fill: rgb(var(--rgb-red-800)) !important;
}

.svg-red-900 {
  fill: rgb(var(--rgb-red-900)) !important;
}

.svg-yellow-50 {
  fill: rgb(var(--rgb-yellow-50)) !important;
}

.svg-yellow-100 {
  fill: rgb(var(--rgb-yellow-100)) !important;
}

.svg-yellow-200 {
  fill: rgb(var(--rgb-yellow-200)) !important;
}

.svg-yellow-300 {
  fill: rgb(var(--rgb-yellow-300)) !important;
}

.svg-yellow-400 {
  fill: rgb(var(--rgb-yellow-400)) !important;
}

.svg-yellow-500 {
  fill: rgb(var(--rgb-yellow-500)) !important;
}

.svg-yellow-600 {
  fill: rgb(var(--rgb-yellow-600)) !important;
}

.svg-yellow-700 {
  fill: rgb(var(--rgb-yellow-700)) !important;
}

.svg-yellow-800 {
  fill: rgb(var(--rgb-yellow-800)) !important;
}

.svg-yellow-900 {
  fill: rgb(var(--rgb-yellow-900)) !important;
}

.svg-lime-50 {
  fill: rgb(var(--rgb-lime-50)) !important;
}

.svg-lime-100 {
  fill: rgb(var(--rgb-lime-100)) !important;
}

.svg-lime-200 {
  fill: rgb(var(--rgb-lime-200)) !important;
}

.svg-lime-300 {
  fill: rgb(var(--rgb-lime-300)) !important;
}

.svg-lime-400 {
  fill: rgb(var(--rgb-lime-400)) !important;
}

.svg-lime-500 {
  fill: rgb(var(--rgb-lime-500)) !important;
}

.svg-lime-600 {
  fill: rgb(var(--rgb-lime-600)) !important;
}

.svg-lime-700 {
  fill: rgb(var(--rgb-lime-700)) !important;
}

.svg-lime-800 {
  fill: rgb(var(--rgb-lime-800)) !important;
}

.svg-lime-900 {
  fill: rgb(var(--rgb-lime-900)) !important;
}

.svg-amber-50 {
  fill: rgb(var(--rgb-amber-50)) !important;
}

.svg-amber-100 {
  fill: rgb(var(--rgb-amber-100)) !important;
}

.svg-amber-200 {
  fill: rgb(var(--rgb-amber-200)) !important;
}

.svg-amber-300 {
  fill: rgb(var(--rgb-amber-300)) !important;
}

.svg-amber-400 {
  fill: rgb(var(--rgb-amber-400)) !important;
}

.svg-amber-500 {
  fill: rgb(var(--rgb-amber-500)) !important;
}

.svg-amber-600 {
  fill: rgb(var(--rgb-amber-600)) !important;
}

.svg-amber-700 {
  fill: rgb(var(--rgb-amber-700)) !important;
}

.svg-amber-800 {
  fill: rgb(var(--rgb-amber-800)) !important;
}

.svg-amber-900 {
  fill: rgb(var(--rgb-amber-900)) !important;
}

.svg-slate-50 {
  fill: rgb(var(--rgb-slate-50)) !important;
}

.svg-slate-100 {
  fill: rgb(var(--rgb-slate-100)) !important;
}

.svg-slate-200 {
  fill: rgb(var(--rgb-slate-200)) !important;
}

.svg-slate-300 {
  fill: rgb(var(--rgb-slate-300)) !important;
}

.svg-slate-400 {
  fill: rgb(var(--rgb-slate-400)) !important;
}

.svg-slate-500 {
  fill: rgb(var(--rgb-slate-500)) !important;
}

.svg-slate-600 {
  fill: rgb(var(--rgb-slate-600)) !important;
}

.svg-slate-700 {
  fill: rgb(var(--rgb-slate-700)) !important;
}

.svg-slate-800 {
  fill: rgb(var(--rgb-slate-800)) !important;
}

.svg-slate-900 {
  fill: rgb(var(--rgb-slate-900)) !important;
}

.svg-gray-50 {
  fill: rgb(var(--rgb-gray-50)) !important;
}

.svg-gray-100 {
  fill: rgb(var(--rgb-gray-100)) !important;
}

.svg-gray-200 {
  fill: rgb(var(--rgb-gray-200)) !important;
}

.svg-gray-300 {
  fill: rgb(var(--rgb-gray-300)) !important;
}

.svg-gray-400 {
  fill: rgb(var(--rgb-gray-400)) !important;
}

.svg-gray-500 {
  fill: rgb(var(--rgb-gray-500)) !important;
}

.svg-gray-600 {
  fill: rgb(var(--rgb-gray-600)) !important;
}

.svg-gray-700 {
  fill: rgb(var(--rgb-gray-700)) !important;
}

.svg-gray-800 {
  fill: rgb(var(--rgb-gray-800)) !important;
}

.svg-gray-900 {
  fill: rgb(var(--rgb-gray-900)) !important;
}

.svg-neutral-50 {
  fill: rgb(var(--rgb-neutral-50)) !important;
}

.svg-neutral-100 {
  fill: rgb(var(--rgb-neutral-100)) !important;
}

.svg-neutral-200 {
  fill: rgb(var(--rgb-neutral-200)) !important;
}

.svg-neutral-300 {
  fill: rgb(var(--rgb-neutral-300)) !important;
}

.svg-neutral-400 {
  fill: rgb(var(--rgb-neutral-400)) !important;
}

.svg-neutral-500 {
  fill: rgb(var(--rgb-neutral-500)) !important;
}

.svg-neutral-600 {
  fill: rgb(var(--rgb-neutral-600)) !important;
}

.svg-neutral-700 {
  fill: rgb(var(--rgb-neutral-700)) !important;
}

.svg-neutral-800 {
  fill: rgb(var(--rgb-neutral-800)) !important;
}

.svg-neutral-900 {
  fill: rgb(var(--rgb-neutral-900)) !important;
}

.svg-stone-50 {
  fill: rgb(var(--rgb-stone-50)) !important;
}

.svg-stone-100 {
  fill: rgb(var(--rgb-stone-100)) !important;
}

.svg-stone-200 {
  fill: rgb(var(--rgb-stone-200)) !important;
}

.svg-stone-300 {
  fill: rgb(var(--rgb-stone-300)) !important;
}

.svg-stone-400 {
  fill: rgb(var(--rgb-stone-400)) !important;
}

.svg-stone-500 {
  fill: rgb(var(--rgb-stone-500)) !important;
}

.svg-stone-600 {
  fill: rgb(var(--rgb-stone-600)) !important;
}

.svg-stone-700 {
  fill: rgb(var(--rgb-stone-700)) !important;
}

.svg-stone-800 {
  fill: rgb(var(--rgb-stone-800)) !important;
}

.svg-stone-900 {
  fill: rgb(var(--rgb-stone-900)) !important;
}

.svg-cyan-50 {
  fill: rgb(var(--rgb-cyan-50)) !important;
}

.svg-cyan-100 {
  fill: rgb(var(--rgb-cyan-100)) !important;
}

.svg-cyan-200 {
  fill: rgb(var(--rgb-cyan-200)) !important;
}

.svg-cyan-300 {
  fill: rgb(var(--rgb-cyan-300)) !important;
}

.svg-cyan-400 {
  fill: rgb(var(--rgb-cyan-400)) !important;
}

.svg-cyan-500 {
  fill: rgb(var(--rgb-cyan-500)) !important;
}

.svg-cyan-600 {
  fill: rgb(var(--rgb-cyan-600)) !important;
}

.svg-cyan-700 {
  fill: rgb(var(--rgb-cyan-700)) !important;
}

.svg-cyan-800 {
  fill: rgb(var(--rgb-cyan-800)) !important;
}

.svg-cyan-900 {
  fill: rgb(var(--rgb-cyan-900)) !important;
}

.svg-emerald-50 {
  fill: rgb(var(--rgb-emerald-50)) !important;
}

.svg-emerald-100 {
  fill: rgb(var(--rgb-emerald-100)) !important;
}

.svg-emerald-200 {
  fill: rgb(var(--rgb-emerald-200)) !important;
}

.svg-emerald-300 {
  fill: rgb(var(--rgb-emerald-300)) !important;
}

.svg-emerald-400 {
  fill: rgb(var(--rgb-emerald-400)) !important;
}

.svg-emerald-500 {
  fill: rgb(var(--rgb-emerald-500)) !important;
}

.svg-emerald-600 {
  fill: rgb(var(--rgb-emerald-600)) !important;
}

.svg-emerald-700 {
  fill: rgb(var(--rgb-emerald-700)) !important;
}

.svg-emerald-800 {
  fill: rgb(var(--rgb-emerald-800)) !important;
}

.svg-emerald-900 {
  fill: rgb(var(--rgb-emerald-900)) !important;
}

.svg-teal-50 {
  fill: rgb(var(--rgb-teal-50)) !important;
}

.svg-teal-100 {
  fill: rgb(var(--rgb-teal-100)) !important;
}

.svg-teal-200 {
  fill: rgb(var(--rgb-teal-200)) !important;
}

.svg-teal-300 {
  fill: rgb(var(--rgb-teal-300)) !important;
}

.svg-teal-400 {
  fill: rgb(var(--rgb-teal-400)) !important;
}

.svg-teal-500 {
  fill: rgb(var(--rgb-teal-500)) !important;
}

.svg-teal-600 {
  fill: rgb(var(--rgb-teal-600)) !important;
}

.svg-teal-700 {
  fill: rgb(var(--rgb-teal-700)) !important;
}

.svg-teal-800 {
  fill: rgb(var(--rgb-teal-800)) !important;
}

.svg-teal-900 {
  fill: rgb(var(--rgb-teal-900)) !important;
}

.svg-sky-50 {
  fill: rgb(var(--rgb-sky-50)) !important;
}

.svg-sky-100 {
  fill: rgb(var(--rgb-sky-100)) !important;
}

.svg-sky-200 {
  fill: rgb(var(--rgb-sky-200)) !important;
}

.svg-sky-300 {
  fill: rgb(var(--rgb-sky-300)) !important;
}

.svg-sky-400 {
  fill: rgb(var(--rgb-sky-400)) !important;
}

.svg-sky-500 {
  fill: rgb(var(--rgb-sky-500)) !important;
}

.svg-sky-600 {
  fill: rgb(var(--rgb-sky-600)) !important;
}

.svg-sky-700 {
  fill: rgb(var(--rgb-sky-700)) !important;
}

.svg-sky-800 {
  fill: rgb(var(--rgb-sky-800)) !important;
}

.svg-sky-900 {
  fill: rgb(var(--rgb-sky-900)) !important;
}

.svg-indigo-50 {
  fill: rgb(var(--rgb-indigo-50)) !important;
}

.svg-indigo-100 {
  fill: rgb(var(--rgb-indigo-100)) !important;
}

.svg-indigo-200 {
  fill: rgb(var(--rgb-indigo-200)) !important;
}

.svg-indigo-300 {
  fill: rgb(var(--rgb-indigo-300)) !important;
}

.svg-indigo-400 {
  fill: rgb(var(--rgb-indigo-400)) !important;
}

.svg-indigo-500 {
  fill: rgb(var(--rgb-indigo-500)) !important;
}

.svg-indigo-600 {
  fill: rgb(var(--rgb-indigo-600)) !important;
}

.svg-indigo-700 {
  fill: rgb(var(--rgb-indigo-700)) !important;
}

.svg-indigo-800 {
  fill: rgb(var(--rgb-indigo-800)) !important;
}

.svg-indigo-900 {
  fill: rgb(var(--rgb-indigo-900)) !important;
}

.svg-violet-50 {
  fill: rgb(var(--rgb-violet-50)) !important;
}

.svg-violet-100 {
  fill: rgb(var(--rgb-violet-100)) !important;
}

.svg-violet-200 {
  fill: rgb(var(--rgb-violet-200)) !important;
}

.svg-violet-300 {
  fill: rgb(var(--rgb-violet-300)) !important;
}

.svg-violet-400 {
  fill: rgb(var(--rgb-violet-400)) !important;
}

.svg-violet-500 {
  fill: rgb(var(--rgb-violet-500)) !important;
}

.svg-violet-600 {
  fill: rgb(var(--rgb-violet-600)) !important;
}

.svg-violet-700 {
  fill: rgb(var(--rgb-violet-700)) !important;
}

.svg-violet-800 {
  fill: rgb(var(--rgb-violet-800)) !important;
}

.svg-violet-900 {
  fill: rgb(var(--rgb-violet-900)) !important;
}

.svg-purple-50 {
  fill: rgb(var(--rgb-purple-50)) !important;
}

.svg-purple-100 {
  fill: rgb(var(--rgb-purple-100)) !important;
}

.svg-purple-200 {
  fill: rgb(var(--rgb-purple-200)) !important;
}

.svg-purple-300 {
  fill: rgb(var(--rgb-purple-300)) !important;
}

.svg-purple-400 {
  fill: rgb(var(--rgb-purple-400)) !important;
}

.svg-purple-500 {
  fill: rgb(var(--rgb-purple-500)) !important;
}

.svg-purple-600 {
  fill: rgb(var(--rgb-purple-600)) !important;
}

.svg-purple-700 {
  fill: rgb(var(--rgb-purple-700)) !important;
}

.svg-purple-800 {
  fill: rgb(var(--rgb-purple-800)) !important;
}

.svg-purple-900 {
  fill: rgb(var(--rgb-purple-900)) !important;
}

.svg-fuchsia-50 {
  fill: rgb(var(--rgb-fuchsia-50)) !important;
}

.svg-fuchsia-100 {
  fill: rgb(var(--rgb-fuchsia-100)) !important;
}

.svg-fuchsia-200 {
  fill: rgb(var(--rgb-fuchsia-200)) !important;
}

.svg-fuchsia-300 {
  fill: rgb(var(--rgb-fuchsia-300)) !important;
}

.svg-fuchsia-400 {
  fill: rgb(var(--rgb-fuchsia-400)) !important;
}

.svg-fuchsia-500 {
  fill: rgb(var(--rgb-fuchsia-500)) !important;
}

.svg-fuchsia-600 {
  fill: rgb(var(--rgb-fuchsia-600)) !important;
}

.svg-fuchsia-700 {
  fill: rgb(var(--rgb-fuchsia-700)) !important;
}

.svg-fuchsia-800 {
  fill: rgb(var(--rgb-fuchsia-800)) !important;
}

.svg-fuchsia-900 {
  fill: rgb(var(--rgb-fuchsia-900)) !important;
}

.svg-pink-50 {
  fill: rgb(var(--rgb-pink-50)) !important;
}

.svg-pink-100 {
  fill: rgb(var(--rgb-pink-100)) !important;
}

.svg-pink-200 {
  fill: rgb(var(--rgb-pink-200)) !important;
}

.svg-pink-300 {
  fill: rgb(var(--rgb-pink-300)) !important;
}

.svg-pink-400 {
  fill: rgb(var(--rgb-pink-400)) !important;
}

.svg-pink-500 {
  fill: rgb(var(--rgb-pink-500)) !important;
}

.svg-pink-600 {
  fill: rgb(var(--rgb-pink-600)) !important;
}

.svg-pink-700 {
  fill: rgb(var(--rgb-pink-700)) !important;
}

.svg-pink-800 {
  fill: rgb(var(--rgb-pink-800)) !important;
}

.svg-pink-900 {
  fill: rgb(var(--rgb-pink-900)) !important;
}

.svg-rose-50 {
  fill: rgb(var(--rgb-rose-50)) !important;
}

.svg-rose-100 {
  fill: rgb(var(--rgb-rose-100)) !important;
}

.svg-rose-200 {
  fill: rgb(var(--rgb-rose-200)) !important;
}

.svg-rose-300 {
  fill: rgb(var(--rgb-rose-300)) !important;
}

.svg-rose-400 {
  fill: rgb(var(--rgb-rose-400)) !important;
}

.svg-rose-500 {
  fill: rgb(var(--rgb-rose-500)) !important;
}

.svg-rose-600 {
  fill: rgb(var(--rgb-rose-600)) !important;
}

.svg-rose-700 {
  fill: rgb(var(--rgb-rose-700)) !important;
}

.svg-rose-800 {
  fill: rgb(var(--rgb-rose-800)) !important;
}

.svg-rose-900 {
  fill: rgb(var(--rgb-rose-900)) !important;
}

/* Back Grounds */
.bg-ninth-lighter {
  background-color: rgb(var(--rgb-ninth-lighter)) !important;
}

.bg-tenth-lighter {
  background-color: rgb(var(--rgb-tenth-lighter)) !important;
}

.bg-first-lighter {
  background-color: rgb(var(--rgb-first-lighter)) !important;
}

.bg-darkest {
  background-color: rgb(var(--rgb-darkest)) !important;
}

.bg-light-dark {
  background-color: rgb(var(--rgb-light-dark)) !important;
}

.bg-light {
  background-color: rgb(var(--rgb-light)) !important;
}

.bg-lighter {
  background-color: rgb(var(--rgb-lighter)) !important;
}

.bg-lightest {
  background-color: rgb(var(--rgb-lightest)) !important;
}

/* Bootstrap */
.bg-warning {
  background-color: rgb(var(--rgb-amber-600)) !important;
}

/* Texts */
.bg-first-lighter {
  background-color: rgb(var(--rgb-first-lighter)) !important;
}

.bg-first-light {
  background-color: rgb(var(--rgb-first-light)) !important;
}

.bg-first {
  background-color: rgb(var(--rgb-first)) !important;
}

.bg-first-dark {
  background-color: rgb(var(--rgb-first-dark)) !important;
}

.bg-first-darker {
  background-color: rgb(var(--rgb-first-darker)) !important;
}

.bg-second-lighter {
  background-color: rgb(var(--rgb-second-lighter)) !important;
}

.bg-second-light {
  background-color: rgb(var(--rgb-second-light)) !important;
}

.bg-second {
  background-color: rgb(var(--rgb-second)) !important;
}

.bg-second-dark {
  background-color: rgb(var(--rgb-second-dark)) !important;
}

.bg-second-darker {
  background-color: rgb(var(--rgb-second-darker)) !important;
}

.bg-third-lighter {
  background-color: rgb(var(--rgb-third-lighter)) !important;
}

.bg-third-light {
  background-color: rgb(var(--rgb-third-light)) !important;
}

.bg-third {
  background-color: rgb(var(--rgb-third)) !important;
}

.bg-third-dark {
  background-color: rgb(var(--rgb-third-dark)) !important;
}

.bg-third-darker {
  background-color: rgb(var(--rgb-third-darker)) !important;
}

.bg-forth-lighter {
  background-color: rgb(var(--rgb-forth-lighter)) !important;
}

.bg-forth-light {
  background-color: rgb(var(--rgb-forth-light)) !important;
}

.bg-forth {
  background-color: rgb(var(--rgb-forth)) !important;
}

.bg-forth-dark {
  background-color: rgb(var(--rgb-forth-dark)) !important;
}

.bg-forth-darker {
  background-color: rgb(var(--rgb-forth-darker)) !important;
}

.bg-fifth-lighter {
  background-color: rgb(var(--rgb-fifth-lighter)) !important;
}

.bg-fifth-light {
  background-color: rgb(var(--rgb-fifth-light)) !important;
}

.bg-fifth {
  background-color: rgb(var(--rgb-fifth)) !important;
}

.bg-fifth-dark {
  background-color: rgb(var(--rgb-fifth-dark)) !important;
}

.bg-fifth-darker {
  background-color: rgb(var(--rgb-fifth-darker)) !important;
}

.bg-sixth-lighter {
  background-color: rgb(var(--rgb-sixth-lighter)) !important;
}

.bg-sixth-light {
  background-color: rgb(var(--rgb-sixth-light)) !important;
}

.bg-sixth {
  background-color: rgb(var(--rgb-sixth)) !important;
}

.bg-sixth-dark {
  background-color: rgb(var(--rgb-sixth-dark)) !important;
}

.bg-sixth-darker {
  background-color: rgb(var(--rgb-sixth-darker)) !important;
}

.bg-seventh-lighter {
  background-color: rgb(var(--rgb-seventh-lighter)) !important;
}

.bg-seventh-light {
  background-color: rgb(var(--rgb-seventh-light)) !important;
}

.bg-seventh {
  background-color: rgb(var(--rgb-seventh)) !important;
}

.bg-seventh-dark {
  background-color: rgb(var(--rgb-seventh-dark)) !important;
}

.bg-seventh-darker {
  background-color: rgb(var(--rgb-seventh-darker)) !important;
}

.bg-eigth-lighter {
  background-color: rgb(var(--rgb-eigth-lighter)) !important;
}

.bg-eigth-light {
  background-color: rgb(var(--rgb-eigth-light)) !important;
}

.bg-eigth {
  background-color: rgb(var(--rgb-eigth)) !important;
}

.bg-eigth-dark {
  background-color: rgb(var(--rgb-eigth-dark)) !important;
}

.bg-eigth-darker {
  background-color: rgb(var(--rgb-eigth-darker)) !important;
}

.bg-ninth-lighter {
  background-color: rgb(var(--rgb-ninth-lighter)) !important;
}

.bg-ninth-light {
  background-color: rgb(var(--rgb-ninth-light)) !important;
}

.bg-ninth {
  background-color: rgb(var(--rgb-ninth)) !important;
}

.bg-ninth-dark {
  background-color: rgb(var(--rgb-ninth-dark)) !important;
}

.bg-ninth-darker {
  background-color: rgb(var(--rgb-ninth-darker)) !important;
}

.bg-tenth-lighter {
  background-color: rgb(var(--rgb-tenth-lighter)) !important;
}

.bg-tenth-light {
  background-color: rgb(var(--rgb-tenth-light)) !important;
}

.bg-tenth {
  background-color: rgb(var(--rgb-tenth)) !important;
}

.bg-tenth-dark {
  background-color: rgb(var(--rgb-tenth-dark)) !important;
}

.bg-tenth-darker {
  background-color: rgb(var(--rgb-tenth-darker)) !important;
}

.text-first-lighter {
  color: rgb(var(--rgb-first-lighter)) !important;
}

.text-first-light {
  color: rgb(var(--rgb-first-light)) !important;
}

.text-first {
  color: rgb(var(--rgb-first)) !important;
}

.text-first-dark {
  color: rgb(var(--rgb-first-dark)) !important;
}

.text-first-darker {
  color: rgb(var(--rgb-first-darker)) !important;
}

.text-second-lighter {
  color: rgb(var(--rgb-second-lighter)) !important;
}

.text-second-light {
  color: rgb(var(--rgb-second-light)) !important;
}

.text-second {
  color: rgb(var(--rgb-second)) !important;
}

.text-second-dark {
  color: rgb(var(--rgb-second-dark)) !important;
}

.text-second-darker {
  color: rgb(var(--rgb-second-darker)) !important;
}

.text-third-lighter {
  color: rgb(var(--rgb-third-lighter)) !important;
}

.text-third-light {
  color: rgb(var(--rgb-third-light)) !important;
}

.text-third {
  color: rgb(var(--rgb-third)) !important;
}

.text-third-dark {
  color: rgb(var(--rgb-third-dark)) !important;
}

.text-third-darker {
  color: rgb(var(--rgb-third-darker)) !important;
}

.text-forth-lighter {
  color: rgb(var(--rgb-forth-lighter)) !important;
}

.text-forth-light {
  color: rgb(var(--rgb-forth-light)) !important;
}

.text-forth {
  color: rgb(var(--rgb-forth)) !important;
}

.text-forth-dark {
  color: rgb(var(--rgb-forth-dark)) !important;
}

.text-forth-darker {
  color: rgb(var(--rgb-forth-darker)) !important;
}

.text-fifth-lighter {
  color: rgb(var(--rgb-fifth-lighter)) !important;
}

.text-fifth-light {
  color: rgb(var(--rgb-fifth-light)) !important;
}

.text-fifth {
  color: rgb(var(--rgb-fifth)) !important;
}

.text-fifth-dark {
  color: rgb(var(--rgb-fifth-dark)) !important;
}

.text-fifth-darker {
  color: rgb(var(--rgb-fifth-darker)) !important;
}

.text-sixth-lighter {
  color: rgb(var(--rgb-sixth-lighter)) !important;
}

.text-sixth-light {
  color: rgb(var(--rgb-sixth-light)) !important;
}

.text-sixth {
  color: rgb(var(--rgb-sixth)) !important;
}

.text-sixth-dark {
  color: rgb(var(--rgb-sixth-dark)) !important;
}

.text-sixth-darker {
  color: rgb(var(--rgb-sixth-darker)) !important;
}

.text-seventh-lighter {
  color: rgb(var(--rgb-seventh-lighter)) !important;
}

.text-seventh-light {
  color: rgb(var(--rgb-seventh-light)) !important;
}

.text-seventh {
  color: rgb(var(--rgb-seventh)) !important;
}

.text-seventh-dark {
  color: rgb(var(--rgb-seventh-dark)) !important;
}

.text-seventh-darker {
  color: rgb(var(--rgb-seventh-darker)) !important;
}

.text-eigth-lighter {
  color: rgb(var(--rgb-eigth-lighter)) !important;
}

.text-eigth-light {
  color: rgb(var(--rgb-eigth-light)) !important;
}

.text-eigth {
  color: rgb(var(--rgb-eigth)) !important;
}

.text-eigth-dark {
  color: rgb(var(--rgb-eigth-dark)) !important;
}

.text-eigth-darker {
  color: rgb(var(--rgb-eigth-darker)) !important;
}

.text-ninth-lighter {
  color: rgb(var(--rgb-ninth-lighter)) !important;
}

.text-ninth-light {
  color: rgb(var(--rgb-ninth-light)) !important;
}

.text-ninth {
  color: rgb(var(--rgb-ninth)) !important;
}

.text-ninth-dark {
  color: rgb(var(--rgb-ninth-dark)) !important;
}

.text-ninth-darker {
  color: rgb(var(--rgb-ninth-darker)) !important;
}

.text-tenth-lighter {
  color: rgb(var(--rgb-tenth-lighter)) !important;
}

.text-tenth-light {
  color: rgb(var(--rgb-tenth-light)) !important;
}

.text-tenth {
  color: rgb(var(--rgb-tenth)) !important;
}

.text-tenth-dark {
  color: rgb(var(--rgb-tenth-dark)) !important;
}

.text-tenth-darker {
  color: rgb(var(--rgb-tenth-darker)) !important;
}

.svg-none {
  fill: none;
}

.svg-lightest {
  fill: rgb(var(--rgb-lightest)) !important;
}

.svg-lighter {
  fill: rgb(var(--rgb-lighter)) !important;
}

.svg-light {
  fill: rgb(var(--rgb-light)) !important;
}

.svg-light-dark {
  fill: rgb(var(--rgb-light-dark)) !important;
}

.svg-dark {
  fill: rgb(var(--rgb-dark)) !important;
}

.svg-darker {
  fill: rgb(var(--rgb-darker)) !important;
}

.svg-darkest {
  fill: rgb(var(--rgb-darkest)) !important;
}

.svg-first-lighter {
  fill: rgb(var(--rgb-first-lighter)) !important;
}

.svg-first-light {
  fill: rgb(var(--rgb-first-light)) !important;
}

.svg-first {
  fill: rgb(var(--rgb-first)) !important;
}

.svg-first-dark {
  fill: rgb(var(--rgb-first-dark)) !important;
}

.svg-first-darker {
  fill: rgb(var(--rgb-first-darker)) !important;
}

.svg-second-lighter {
  fill: rgb(var(--rgb-second-lighter)) !important;
}

.svg-second-light {
  fill: rgb(var(--rgb-second-light)) !important;
}

.svg-second {
  fill: rgb(var(--rgb-second)) !important;
}

.svg-second-dark {
  fill: rgb(var(--rgb-second-dark)) !important;
}

.svg-second-darker {
  fill: rgb(var(--rgb-second-darker)) !important;
}

.svg-third-lighter {
  fill: rgb(var(--rgb-third-lighter)) !important;
}

.svg-third-light {
  fill: rgb(var(--rgb-third-light)) !important;
}

.svg-third {
  fill: rgb(var(--rgb-third)) !important;
}

.svg-third-dark {
  fill: rgb(var(--rgb-third-dark)) !important;
}

.svg-third-darker {
  fill: rgb(var(--rgb-third-darker)) !important;
}

.svg-forth-lighter {
  fill: rgb(var(--rgb-forth-lighter)) !important;
}

.svg-forth-light {
  fill: rgb(var(--rgb-forth-light)) !important;
}

.svg-forth {
  fill: rgb(var(--rgb-forth)) !important;
}

.svg-forth-dark {
  fill: rgb(var(--rgb-forth-dark)) !important;
}

.svg-forth-darker {
  fill: rgb(var(--rgb-forth-darker)) !important;
}

.svg-fifth-lighter {
  fill: rgb(var(--rgb-fifth-lighter)) !important;
}

.svg-fifth-light {
  fill: rgb(var(--rgb-fifth-light)) !important;
}

.svg-fifth {
  fill: rgb(var(--rgb-fifth)) !important;
}

.svg-fifth-dark {
  fill: rgb(var(--rgb-fifth-dark)) !important;
}

.svg-fifth-darker {
  fill: rgb(var(--rgb-fifth-darker)) !important;
}

.svg-sixth-lighter {
  fill: rgb(var(--rgb-sixth-lighter)) !important;
}

.svg-sixth-light {
  fill: rgb(var(--rgb-sixth-light)) !important;
}

.svg-sixth {
  fill: rgb(var(--rgb-sixth)) !important;
}

.svg-sixth-dark {
  fill: rgb(var(--rgb-sixth-dark)) !important;
}

.svg-sixth-darker {
  fill: rgb(var(--rgb-sixth-darker)) !important;
}

.svg-seventh-lighter {
  fill: rgb(var(--rgb-seventh-lighter)) !important;
}

.svg-seventh-light {
  fill: rgb(var(--rgb-seventh-light)) !important;
}

.svg-seventh {
  fill: rgb(var(--rgb-seventh)) !important;
}

.svg-seventh-dark {
  fill: rgb(var(--rgb-seventh-dark)) !important;
}

.svg-seventh-darker {
  fill: rgb(var(--rgb-seventh-darker)) !important;
}

.svg-eigth-lighter {
  fill: rgb(var(--rgb-eigth-lighter)) !important;
}

.svg-eigth-light {
  fill: rgb(var(--rgb-eigth-light)) !important;
}

.svg-eigth {
  fill: rgb(var(--rgb-eigth)) !important;
}

.svg-eigth-dark {
  fill: rgb(var(--rgb-eigth-dark)) !important;
}

.svg-eigth-darker {
  fill: rgb(var(--rgb-eigth-darker)) !important;
}

.svg-ninth-lighter {
  fill: rgb(var(--rgb-ninth-lighter)) !important;
}

.svg-ninth-light {
  fill: rgb(var(--rgb-ninth-light)) !important;
}

.svg-ninth {
  fill: rgb(var(--rgb-ninth)) !important;
}

.svg-ninth-dark {
  fill: rgb(var(--rgb-ninth-dark)) !important;
}

.svg-ninth-darker {
  fill: rgb(var(--rgb-ninth-darker)) !important;
}

.svg-tenth-lighter {
  fill: rgb(var(--rgb-tenth-lighter)) !important;
}

.svg-tenth-light {
  fill: rgb(var(--rgb-tenth-light)) !important;
}

.svg-tenth {
  fill: rgb(var(--rgb-tenth)) !important;
}

.svg-tenth-dark {
  fill: rgb(var(--rgb-tenth-dark)) !important;
}

.svg-tenth-darker {
  fill: rgb(var(--rgb-tenth-darker)) !important;
}

.svg-stop-lightest {
  stop-color: rgb(var(--rgb-lightest)) !important;
}

.svg-stop-lighter {
  stop-color: rgb(var(--rgb-lighter)) !important;
}

.svg-stop-light {
  stop-color: rgb(var(--rgb-light)) !important;
}

.svg-stop-light-dark {
  stop-color: rgb(var(--rgb-light-dark)) !important;
}

.svg-stop-dark {
  stop-color: rgb(var(--rgb-dark)) !important;
}

.svg-stop-darker {
  stop-color: rgb(var(--rgb-darker)) !important;
}

.svg-stop-darkest {
  stop-color: rgb(var(--rgb-darkest)) !important;
}

.svg-stop-first-lighter {
  stop-color: rgb(var(--rgb-first-lighter)) !important;
}

.svg-stop-first-light {
  stop-color: rgb(var(--rgb-first-light)) !important;
}

.svg-stop-first {
  stop-color: rgb(var(--rgb-first)) !important;
}

.svg-stop-first-dark {
  stop-color: rgb(var(--rgb-first-dark)) !important;
}

.svg-stop-first-darker {
  stop-color: rgb(var(--rgb-first-darker)) !important;
}

.svg-stop-second-lighter {
  stop-color: rgb(var(--rgb-second-lighter)) !important;
}

.svg-stop-second-light {
  stop-color: rgb(var(--rgb-second-light)) !important;
}

.svg-stop-second {
  stop-color: rgb(var(--rgb-second)) !important;
}

.svg-stop-second-dark {
  stop-color: rgb(var(--rgb-second-dark)) !important;
}

.svg-stop-second-darker {
  stop-color: rgb(var(--rgb-second-darker)) !important;
}

.svg-stop-third-lighter {
  stop-color: rgb(var(--rgb-third-lighter)) !important;
}

.svg-stop-third-light {
  stop-color: rgb(var(--rgb-third-light)) !important;
}

.svg-stop-third {
  stop-color: rgb(var(--rgb-third)) !important;
}

.svg-stop-third-dark {
  stop-color: rgb(var(--rgb-third-dark)) !important;
}

.svg-stop-third-darker {
  stop-color: rgb(var(--rgb-third-darker)) !important;
}

.svg-stop-forth-lighter {
  stop-color: rgb(var(--rgb-forth-lighter)) !important;
}

.svg-stop-forth-light {
  stop-color: rgb(var(--rgb-forth-light)) !important;
}

.svg-stop-forth {
  stop-color: rgb(var(--rgb-forth)) !important;
}

.svg-stop-forth-dark {
  stop-color: rgb(var(--rgb-forth-dark)) !important;
}

.svg-stop-forth-darker {
  stop-color: rgb(var(--rgb-forth-darker)) !important;
}

.svg-stop-fifth-lighter {
  stop-color: rgb(var(--rgb-fifth-lighter)) !important;
}

.svg-stop-fifth-light {
  stop-color: rgb(var(--rgb-fifth-light)) !important;
}

.svg-stop-fifth {
  stop-color: rgb(var(--rgb-fifth)) !important;
}

.svg-stop-fifth-dark {
  stop-color: rgb(var(--rgb-fifth-dark)) !important;
}

.svg-stop-fifth-darker {
  stop-color: rgb(var(--rgb-fifth-darker)) !important;
}

.svg-stop-sixth-lighter {
  stop-color: rgb(var(--rgb-sixth-lighter)) !important;
}

.svg-stop-sixth-light {
  stop-color: rgb(var(--rgb-sixth-light)) !important;
}

.svg-stop-sixth {
  stop-color: rgb(var(--rgb-sixth)) !important;
}

.svg-stop-sixth-dark {
  stop-color: rgb(var(--rgb-sixth-dark)) !important;
}

.svg-stop-sixth-darker {
  stop-color: rgb(var(--rgb-sixth-darker)) !important;
}

.svg-stop-seventh-lighter {
  stop-color: rgb(var(--rgb-seventh-lighter)) !important;
}

.svg-stop-seventh-light {
  stop-color: rgb(var(--rgb-seventh-light)) !important;
}

.svg-stop-seventh {
  stop-color: rgb(var(--rgb-seventh)) !important;
}

.svg-stop-seventh-dark {
  stop-color: rgb(var(--rgb-seventh-dark)) !important;
}

.svg-stop-seventh-darker {
  stop-color: rgb(var(--rgb-seventh-darker)) !important;
}

.svg-stop-eigth-lighter {
  stop-color: rgb(var(--rgb-eigth-lighter)) !important;
}

.svg-stop-eigth-light {
  stop-color: rgb(var(--rgb-eigth-light)) !important;
}

.svg-stop-eigth {
  stop-color: rgb(var(--rgb-eigth)) !important;
}

.svg-stop-eigth-dark {
  stop-color: rgb(var(--rgb-eigth-dark)) !important;
}

.svg-stop-eigth-darker {
  stop-color: rgb(var(--rgb-eigth-darker)) !important;
}

.svg-stop-ninth-lighter {
  stop-color: rgb(var(--rgb-ninth-lighter)) !important;
}

.svg-stop-ninth-light {
  stop-color: rgb(var(--rgb-ninth-light)) !important;
}

.svg-stop-ninth {
  stop-color: rgb(var(--rgb-ninth)) !important;
}

.svg-stop-ninth-dark {
  stop-color: rgb(var(--rgb-ninth-dark)) !important;
}

.svg-stop-ninth-darker {
  stop-color: rgb(var(--rgb-ninth-darker)) !important;
}

.svg-stop-tenth-lighter {
  stop-color: rgb(var(--rgb-tenth-lighter)) !important;
}

.svg-stop-tenth-light {
  stop-color: rgb(var(--rgb-tenth-light)) !important;
}

.svg-stop-tenth {
  stop-color: rgb(var(--rgb-tenth)) !important;
}

.svg-stop-tenth-dark {
  stop-color: rgb(var(--rgb-tenth-dark)) !important;
}

.svg-stop-tenth-darker {
  stop-color: rgb(var(--rgb-tenth-darker)) !important;
}

/* Radio Buttons */
.material-switch {
  width: fit-content;
}
.material-switch > input[type=checkbox] {
  display: none;
}
.material-switch > input[type=checkbox]:checked + label::before {
  background: rgb(var(--rgb-blue-500));
  opacity: 0.5;
}
.material-switch > input[type=checkbox]:checked + label::after {
  background: rgb(var(--rgb-blue-500));
  right: 25px;
}
.material-switch > label {
  cursor: pointer;
  height: 0;
  position: relative;
  width: 40px;
}
.material-switch > label::before {
  background: rgb(var(--rgb-darkest));
  box-shadow: inset 0 0 10px rgba(var(--rgb-darkest), 0.5);
  border-radius: 8px;
  content: "";
  height: 16px;
  margin-top: -8px;
  position: absolute;
  opacity: 0.3;
  transition: all 0.4s ease-in-out;
  width: 40px;
}
.material-switch > label::after {
  background: rgb(var(--rgb-lightest));
  border-radius: 16px;
  box-shadow: 0 0 5px rgba(var(--rgb-darkest), 0.3);
  content: "";
  height: 24px;
  right: -4px;
  margin-top: -8px;
  position: absolute;
  top: -4px;
  transition: all 0.3s ease-in-out;
  width: 24px;
}
.material-switch.form-error > label::before, .material-switch.form-error label::after {
  outline: 1px solid rgb(var(--rgb-red-600));
}

/* Form Radio Inputs */
.form-radio {
  margin: 0.5rem;
  cursor: pointer;
}

.form-radio input[type=radio] {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
  pointer-events: none;
}
.form-radio input[type=radio]:focus > svg, .form-radio input[type=radio]:focus-visible + label > svg {
  border-radius: 0.3rem;
  outline: 3px solid rgb(var(--rgb-light)) !important;
  outline-offset: 3px;
  transition: all 200ms;
}

.form-radio-label {
  font-size: 13px !important;
  font-weight: 400 !important;
  white-space: nowrap !important;
  display: flex;
  align-items: center;
}

/* Form Image Radio */
.form-image-radio > input[type=radio] {
  display: none;
}

.form-image-radio > label {
  padding: 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  max-width: 150px;
  cursor: pointer;
  border-radius: 8px;
}

.form-image-radio > label img, .form-image-radio > label svg {
  height: 120px;
  width: 120px;
  transition-duration: 0.2s;
  transform-origin: 50% 50%;
}

.form-image-radio > label span {
  font-size: 12px;
  color: rgb(var(--rgb-light-dark));
  padding: 4px;
}

.form-image-radio > input:checked + label img, .form-image-radio > input:checked + label svg {
  transform: scale(0.9);
  box-shadow: 0 0 5px #333;
}

/* Form Text Radio*/
.radio-text {
  display: none;
  margin: 10px;
}

.radio-text + label {
  border: 1px solid #333;
  color: #333;
  background-color: #fff;
  cursor: pointer;
  display: inline-block;
  font-weight: 400;
  text-align: center;
  vertical-align: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  line-height: 1.5;
  border-radius: 0.25rem;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.radio-text:checked + label {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad;
}

.radio-text:hover {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad;
}

/* Plate Box */
/* plate */
.plate-box {
  max-width: 320px;
  height: 65px;
  border-radius: 12px;
  font-size: 24px;
  background-color: #fff;
  border: 1px solid #eee;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.06);
  padding: 3px;
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-evenly;
  align-items: center;
  font-weight: 650;
  line-height: 24px;
  color: #222;
}

.plate-box-img {
  width: 36px;
  background-color: #01286d;
  border-radius: 8px 4px 4px 8px;
  margin-right: 8px;
  height: 100%;
  display: flex;
  align-content: center;
  justify-content: center;
}

.plate-box-input {
  width: 40px;
  text-align: center;
  outline: none;
  height: 32px;
  opacity: 1;
  line-height: 32px;
  font-size: 18px !important;
  color: #444 !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.plate-box-char {
  width: 56px;
  height: 32px;
}

.plate-box-empty {
  height: 32px !important;
}

.plate-box-vertical-separator {
  height: 32px;
  border-right: 1px solid hsla(0, 0%, 52.2%, 0.50196);
  margin-right: 4px;
  margin-left: 4px;
}

.plate-box-city-code {
  width: 40px;
}

.plate-alpha {
  width: 40px;
  height: 40px;
  line-height: 40px;
  background-color: #f4f4f4;
  border: 1px solid #f4f4f4;
  color: rgba(0, 0, 0, 0.6) !important;
  border-radius: 12px;
  margin: 4px;
  font-size: 16px;
  font-weight: 650;
  text-align: center;
}

/* Numeral Range */
.scale li label {
  border-radius: 0;
  width: 100%;
  height: 100%;
  border-right: 0;
  font-size: 16px;
  text-align: center;
  line-height: 39px;
}

.range-number, .range-number:focus {
  background-color: transparent;
}

.scale li label {
  border-radius: 0;
  width: 100%;
  height: 100%;
  border-right: 0;
  font-size: 16px;
  text-align: center;
  line-height: 39px;
}
.scale li label.selected-scale {
  background-color: rgb(var(--rgb-first-light)) !important;
}

.range-number, .range-number:focus {
  background-color: transparent;
}

.scale {
  margin: 20px 0 0 0;
}

.scale, .rating {
  width: 100%;
  /*max-width: 600px;*/
  height: 100px;
  margin-top: 30px;
}

.scale > div {
  width: 100%;
}

.scale-numbers {
  /*padding-left: 1.7%;
  padding-right: 1.7%;*/
  margin: 10px 0 0 0;
}

.scale-numbers {
  height: 50px;
}

.scale-numbers ul {
  padding-left: 0;
  direction: ltr !important;
}

.scale ul, .rating ul {
  list-style-type: none;
  margin-top: 0;
  padding-right: 0;
  height: 100%;
  direction: ltr;
  margin-right: 0;
}

.scale li, .rating li {
  display: inline-block;
  list-style: none;
  height: 100%;
  float: inline-start;
}

.question-val:checked + label {
  background-color: #1789da;
}

.theme-white .scale > div:first-child ul li:last-child {
  border-right: 0px !important;
}

/* Range Slider */
/* spectrum */
.spectrum_slider {
  width: 100%;
  padding: 16px;
  display: flex;
  align-items: center;
}

.spectrum_item_clicked {
  background-color: #159df7 !important;
  color: #fff;
}

.spectrum_slider input[type=range] {
  width: 100%;
  height: 2px !important;
  margin: 0;
  background: black;
  direction: ltr !important;
  border: none;
  outline: none;
}

.scale li:first-child label {
  border-radius: 6px 0 0 6px;
}

.scale li:last-child label {
  border-radius: 0 6px 6px 0;
}

.scale li > label:hover {
  cursor: pointer;
  border: 3px solid #1789da !important;
  color: #444 !important;
}

.question-val:checked + label {
  background-color: #1789da !important;
}

datalist {
  display: flex;
  justify-content: space-between;
  flex-direction: row-reverse;
  height: auto;
  margin-top: 16px;
  width: 100%;
  height: 6px;
}

datalist > option::before {
  content: "";
  display: block;
  width: 0;
  height: 6px;
  outline: 1px solid rgb(var(--rgb-light));
  text-indent: 0;
}

datalist > option {
  width: fit-content;
  padding: 0;
}

.label-row {
  display: table;
  width: 100%;
  table-layout: fixed;
  border-spacing: 10px;
}

.label-item {
  display: table-cell;
  vertical-align: middle;
  width: 50%;
  text-align: center;
  word-wrap: break-word;
  font-size: 12px;
}

.label-item:last-child {
  width: 25%;
}

.label-item:first-child {
  width: 25%;
}

/* Images Overlay */
.images_overlay {
  background: rgba(var(--rgb-black), 0.5);
  z-index: 5;
  visibility: hidden;
  opacity: 0;
  transition: all 0.3s ease-in-out;
  width: 100%;
}

.images_item:hover > .images_overlay {
  visibility: visible;
  opacity: 1;
  cursor: pointer;
}

.images_item:focus > .images_overlay {
  visibility: visible;
  opacity: 1;
  cursor: pointer;
}

body.dark .form-checkbox.form-error, body.dark .form-checkbox.form-success {
  background-color: transparent !important;
}

/* Checkbox svg Start */
.form-checkbox {
  width: 100%;
  display: flex;
  align-items: center;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  padding: 8px;
}
.form-checkbox label {
  cursor: pointer;
}
.form-checkbox label > span {
  margin-top: 2px;
}
.form-checkbox label svg {
  width: auto;
  height: 20px;
  cursor: pointer;
  font-size: 20px;
  fill: rgb(var(--rgb-seventh)) !important;
}
.form-checkbox label svg.checkbox-on {
  opacity: 0;
  pointer-events: none;
  display: none;
}
.form-checkbox label svg.checkbox-off {
  opacity: 1;
  pointer-events: auto;
  display: inline-block;
}
.form-checkbox.form-error {
  background-color: transparent !important;
}
.form-checkbox.form-error label span {
  color: rgb(var(--rgb-red-600)) !important;
}
.form-checkbox.form-error label svg {
  fill: rgb(var(--rgb-red-600)) !important;
}
.form-checkbox.form-success {
  background-color: transparent !important;
}
.form-checkbox.form-success label span {
  color: rgb(var(--rgb-green-700)) !important;
}
.form-checkbox.form-success label svg {
  fill: rgb(var(--rgb-green-700)) !important;
}
.form-checkbox input:checked + label svg.checkbox-off {
  opacity: 0;
  pointer-events: none;
  display: none;
}
.form-checkbox input:checked + label svg.checkbox-on {
  display: inline-block;
  opacity: 1;
  pointer-events: auto;
}
.form-checkbox input[type=checkbox] {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
  pointer-events: none;
}
.form-checkbox input[type=checkbox]:focus > svg, .form-checkbox input[type=checkbox]:focus-visible + label > svg {
  border-radius: 0.3rem;
  outline: 3px solid rgb(var(--rgb-light)) !important;
  outline-offset: 3px;
  transition: all 200ms;
}
.form-checkbox:hover input ~ svg {
  background-color: rgb(var(--rgb-darkest), 0.08);
}
.form-checkbox:hover input:checked ~ svg {
  background-color: rgb(var(--rgb-first));
}
.form-checkbox .checkbox__body {
  line-height: 1.4;
  font-size: 13px;
  font-weight: 400;
}

/* Checkbox svg End */
.clock-timepicker-popup {
  display: block;
  z-index: 99999;
  cursor: default;
  position: fixed;
  width: 200px;
  background-color: rgb(255, 255, 255);
  box-shadow: rgba(0, 0, 0, 0.14) 0 4px 20px 0;
  border-radius: 5px;
  overflow: hidden;
  user-select: none;
  visibility: visible;
  left: 272.388px;
  top: 372.188px;
}

.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {
  font-family: "IRANSans", sans-serif !important;
}

.voice_record_btn {
  width: 40px;
  height: 40px;
  cursor: pointer;
}

.map-container {
  height: 400px;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}

/* Take Picture Start */
.video-wrapper {
  width: 100%;
  position: relative;
}
.video-wrapper .video-element {
  border-radius: 8px;
  width: 100%;
  max-width: 100%;
  height: 100%;
}
.video-wrapper .video-footer {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 30px;
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 8px;
  height: 100px;
  z-index: 50;
}
.video-wrapper .video-footer .btn-picture {
  position: relative;
  border-radius: 100%;
  font-size: 18px;
  color: white;
  background-color: var(--red-600);
  width: 50px;
  height: 50px;
}
.video-wrapper .video-footer .btn-picture:active {
  color: white;
}
.video-wrapper .video-footer .btn-picture:active::before {
  width: 130%;
  height: 130%;
}
.video-wrapper .video-footer .btn-picture::before {
  content: "";
  width: 120%;
  height: 120%;
  background-color: var(--red-600);
  opacity: 0.3;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 100%;
  transition: all 200ms;
  z-index: -1;
}
.video-wrapper .captured-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  background-color: rgb(var(--rgb-ninth-lighter));
  padding: 12px;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 60;
}
.video-wrapper .captured-wrapper.show {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.video-wrapper .captured-wrapper img, .video-wrapper .captured-wrapper svg {
  width: 100%;
  max-width: 100%;
  border-radius: 8px;
}
.video-wrapper .captured-wrapper > button {
  position: absolute;
  top: 15px;
  left: 15px;
  color: rgb(var(--rgb-red-500));
}

/* Take picture end */
/* Popup List items Start */
.li_bg_animation {
  padding: 10px 12px;
  border-radius: 8px;
  transition: all 0.3s ease;
  margin: 5px 0;
  cursor: pointer;
}
.li_bg_animation a {
  color: rgb(var(--rgb-zinc-800)) !important;
}
.li_bg_animation:hover {
  background-color: rgb(var(--rgb-zinc-100));
  transform: translateX(-20px);
}

/* Popup List items End */
/* Jquery ui Date picker And Time picker Start */
.clock-timepicker-popup {
  background-color: rgb(var(--rgb-ninth-lighter)) !important;
  box-shadow: 0px 4px 20px 0px rgb(var(--rgb-darkest), 0.2) !important;
}

.ui-datepicker {
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%);
  z-index: 2710;
  border-radius: 12px;
  width: auto;
  padding: 0;
  box-shadow: 5px 0 20px 1px rgb(var(--rgb-darkest), 0.2);
  background-color: rgb(var(--rgb-ninth-lighter)) !important;
}
.ui-datepicker-header {
  position: initial !important;
  border-radius: 12px 12px 0 0;
  background-color: rgb(var(--rgb-first));
  border: none;
  padding: 8px 16px !important;
  display: flex;
  flex-direction: column;
}
.ui-datepicker-title {
  text-align: right;
  font-size: 24px;
  color: rgb(var(--rgb-lightest));
  font-weight: normal;
  margin: 0;
}
html[dir=ltr] .ui-datepicker-title {
  text-align: left;
}

.ui-datepicker table.ui-datepicker-calendar thead tr th {
  color: rgb(var(--rgb-light-dark));
  font-weight: normal;
  font-size: 12px;
}
.ui-datepicker table.ui-datepicker-calendar tbody tr td {
  width: 36px;
  height: 36px;
  min-width: 36px;
  min-height: 36px;
  padding: 0;
  /* Styles for Weekends */
}
.ui-datepicker table.ui-datepicker-calendar tbody tr td .ui-state-default {
  color: rgb(var(--rgb-darkest));
}
.ui-datepicker table.ui-datepicker-calendar tbody tr td .ui-state-active {
  border-radius: 50% !important;
}
.ui-datepicker table.ui-datepicker-calendar tbody tr td.ui-state-disabled .ui-state-default {
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgb(var(--rgb-darkest)) !important;
  background-color: rgb(var(--rgb-darkest), 0.1) !important;
  border-radius: var(--radius-full);
  height: 100%;
}
.ui-datepicker table.ui-datepicker-calendar tbody tr td.ui-datepicker-week-col {
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgb(var(--rgb-light-dark));
  font-size: 12px;
}
.ui-datepicker table.ui-datepicker-calendar tbody tr td.ui-datepicker-today:hover a::before {
  background-color: rgb(var(--rgb-first));
}
.ui-datepicker table.ui-datepicker-calendar tbody tr td.ui-datepicker-today a::before {
  background-color: rgb(var(--rgb-seventh), 0.2);
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}
.ui-datepicker table.ui-datepicker-calendar tbody tr td.ui-datepicker-current-day a {
  color: rgb(var(--rgb-lightest)) !important;
}
.ui-datepicker table.ui-datepicker-calendar tbody tr td.ui-datepicker-current-day a::before {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
  background-color: rgb(var(--rgb-first)) !important;
}
.ui-datepicker table.ui-datepicker-calendar tbody tr td:not(.ui-datepicker-week-col):not(.ui-datepicker-current-day):hover {
  opacity: 0.5;
}
.ui-datepicker table.ui-datepicker-calendar tbody tr td:not(.ui-datepicker-week-col):not(.ui-datepicker-current-day):hover a {
  color: rgb(var(--rgb-lightest));
}
.ui-datepicker table.ui-datepicker-calendar tbody tr td:not(.ui-datepicker-week-col):not(.ui-datepicker-current-day):hover a::before {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}
.ui-datepicker table.ui-datepicker-calendar tbody tr td a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background: none;
  border: none;
  position: relative;
}
.ui-datepicker table.ui-datepicker-calendar tbody tr td a::before {
  content: "";
  width: 94%;
  height: 94%;
  border-radius: 100%;
  background-color: rgb(var(--rgb-first));
  display: flex;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0);
  opacity: 0;
  transition: all 400ms;
  z-index: -1;
}
.ui-datepicker table.ui-datepicker-calendar tbody tr td:nth-last-of-type(1) a {
  color: rgb(var(--rgb-red-600)) !important;
}
.ui-datepicker .ui-datepicker-year span {
  font-size: 14px;
  font-weight: normal;
  text-align: right;
  color: rgb(var(--rgb-lightest));
  border: 1px solid transparent;
  border-radius: 3px;
  cursor: pointer;
  transition: all 200ms;
  padding: 0 10px;
  user-select: none;
  width: fit-content;
}
html[dir=ltr] .ui-datepicker .ui-datepicker-year span {
  text-align: left;
}

.ui-datepicker .ui-datepicker-year span:hover {
  border-color: rgb(var(--rgb-lightest));
}
.ui-datepicker .ui-datepicker-year .datepicker-select-wrapper {
  background-color: rgb(var(--rgb-ninth-lighter)) !important;
  z-index: 360;
}
.ui-datepicker .ui-datepicker-month span {
  font-size: 13px;
  font-weight: normal;
  color: rgb(var(--rgb-dark));
  border: 1px solid transparent;
  border-radius: 3px;
  cursor: pointer;
  transition: all 200ms;
  padding: 0 8px;
  margin: 8px auto;
  user-select: none;
  display: block;
  width: fit-content;
}
.ui-datepicker .ui-datepicker-month span:hover {
  color: rgb(var(--rgb-seventh-dark));
  border-color: rgb(var(--rgb-seventh-dark));
}
.ui-datepicker .ui-datepicker-navbar .ui-datepicker-title {
  margin: 0 8px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.ui-datepicker .ui-datepicker-navbar .ui-datepicker-title .ui-datepicker-prev::before {
  content: "\f054" !important;
}
.ui-datepicker .ui-datepicker-navbar .ui-datepicker-title .ui-datepicker-next::before {
  content: "\f053" !important;
}
.ui-datepicker .ui-datepicker-navbar .ui-datepicker-title .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-navbar .ui-datepicker-title .ui-datepicker-next {
  position: initial !important;
  background-color: transparent;
  font-size: 16px;
  display: block !important;
}
.ui-datepicker .ui-datepicker-navbar .ui-datepicker-title .ui-datepicker-prev::before,
.ui-datepicker .ui-datepicker-navbar .ui-datepicker-title .ui-datepicker-next::before {
  font-family: "Font Awesome 5 Pro" !important;
  font-size: 12px !important;
  color: rgb(var(--rgb-light-dark));
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
}
.ui-datepicker .ui-datepicker-navbar .ui-datepicker-title .ui-datepicker-prev:hover,
.ui-datepicker .ui-datepicker-navbar .ui-datepicker-title .ui-datepicker-next:hover {
  border: none;
  background-color: transparent;
}
.ui-datepicker .datepicker-select-wrapper {
  position: absolute;
  right: 0;
  top: 84px;
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  transition: all 200ms;
  background-color: rgb(var(--rgb-ninth-lighter));
  width: 100%;
  height: calc(100% - 84px - 40px);
  max-height: calc(100% - 84px - 40px);
  z-index: 250;
  padding: 36px 8px 6px 8px;
}
.ui-datepicker .datepicker-select-wrapper .close-wrapper {
  top: 6px !important;
  left: 6px !important;
  width: 30px;
  height: 30px;
  font-size: 16px;
  color: rgb(var(--rgb-red-500)) !important;
}
.ui-datepicker .datepicker-select-wrapper .close-wrapper:hover {
  background-color: transparent !important;
  border: none;
}
.ui-datepicker .datepicker-select-wrapper.show {
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
}
.ui-datepicker .datepicker-select-wrapper .datepicker-select-scrollbar {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(4, 1fr);
  grid-gap: 4px;
  gap: 4px;
  width: 100%;
  height: 100%;
  max-height: 100%;
  overflow-y: auto;
}
.ui-datepicker .datepicker-select-wrapper .datepicker-select-scrollbar::-webkit-scrollbar {
  width: 8px;
  margin: 16px;
}
.ui-datepicker .datepicker-select-wrapper .datepicker-select-scrollbar::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb-bg);
  border-radius: 8px;
}
.ui-datepicker .datepicker-select-wrapper .datepicker-select-scrollbar::-webkit-scrollbar-track {
  background: var(--scrollbar-bg);
  border-radius: 8px;
}
.ui-datepicker .datepicker-select-wrapper .datepicker-select-scrollbar div {
  border-radius: 3px;
  display: grid;
  place-items: center;
  cursor: pointer;
  width: 100%;
  padding: 8px;
  font-size: 14px;
  transition: all 200ms;
  color: rgb(var(--rgb-darkest));
}
.ui-datepicker .datepicker-select-wrapper .datepicker-select-scrollbar div:hover {
  background-color: rgb(var(--rgb-darkest), 0.03);
}
.ui-datepicker .datepicker-select-wrapper .datepicker-select-scrollbar div[selected] {
  background-color: rgb(var(--rgb-first-lighter));
  color: rgb(var(--rgb-first-darker));
}
.ui-datepicker .datepicker-select-wrapper button.close-wrapper {
  position: absolute;
  top: 8px;
  left: 8px;
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
  position: initial !important;
  display: block;
  cursor: pointer !important;
}
.ui-datepicker .ui-datepicker-buttonpane button {
  border: none;
  background-color: transparent;
  color: rgb(var(--rgb-seventh-dark));
  font-weight: normal;
  font-size: 13px;
  padding: 8px 16px;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
  opacity: 1 !important;
}
.ui-datepicker .ui-datepicker-buttonpane button:hover {
  background-color: rgb(var(--rgb-darkest), 0.03);
}

body.dark .ui-datepicker-buttonpane button, body.faragard-dark .ui-datepicker-buttonpane button {
  color: rgb(var(--rgb-seventh-darker)) !important;
}

.ui-widget-content {
  border: 1px solid rgb(var(--rgb-darkest), 0.1) !important;
  background-color: transparent;
}

/* Jquery ui Date picker And Time picker End */
/* Select drop down input Styles Start */
.dropdown {
  display: flex;
  width: 100%;
  transition: all 250ms ease;
  position: relative;
  font-size: 14px;
  text-align: right;
  cursor: pointer;
  position: relative;
  height: 40px;
}
html[dir=ltr] .dropdown {
  text-align: left;
}

.dropdown.open::after {
  transform: rotate(-180deg);
}
.dropdown.open .dropdown-wrapper {
  grid-template-rows: 1fr !important;
  pointer-events: auto;
  visibility: visible;
}
.dropdown::after {
  content: "\f078";
  font-family: var(--fa-style-family, "Font Awesome 6 Pro");
  position: absolute;
  top: 8px;
  left: 16px;
  transition: all 250ms ease-in-out;
}
.dropdown.dropup .dropdown-wrapper {
  top: auto;
  bottom: 100% !important;
}
.dropdown:focus-visible {
  outline: none;
}
.dropdown select {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  position: absolute;
}
.dropdown-values {
  padding-left: 22px;
  display: flex;
  align-items: center;
}
html[dir=ltr] .dropdown-values {
  padding-right: 22px;
  padding-left: 0;
}

.dropdown-values span {
  user-select: none;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 13px;
  display: -webkit-box;
}
.dropdown .dropdown-wrapper {
  position: absolute;
  top: 100%;
  right: 0;
  left: 0;
  width: 100%;
  display: grid;
  grid-template-rows: 0fr;
  transition: all 250ms;
  overflow: hidden;
  pointer-events: none;
  visibility: hidden;
}
.dropdown .dropdown-options {
  height: 100%;
  overflow: hidden;
  min-height: 0px;
  background-color: rgb(var(--rgb-ninth-lighter));
  border-radius: 0.75rem;
  overflow-y: auto;
  z-index: 30;
  padding: 0;
  list-style: none;
  border: 1px solid rgb(var(--rgb-light));
  box-shadow: 0 3px 4px rgb(var(--rgb-darkest), 0.05);
}
.dropdown .dropdown-options::-webkit-scrollbar {
  width: 8px;
  margin: 16px;
}
.dropdown .dropdown-options::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb-bg);
  border-radius: 8px;
}
.dropdown .dropdown-options::-webkit-scrollbar-track {
  background: var(--scrollbar-bg);
  border-radius: 8px;
}
.dropdown .dropdown-options li {
  padding: 8px 16px;
  transition: all 250ms ease-in-out;
  cursor: pointer;
  font-size: 14px;
  color: rgb(var(--rgb-darkest));
  user-select: none;
}
.dropdown .dropdown-options li:not(:nth-last-child(1)) {
  border-bottom: 1px solid rgb(var(--rgb-light));
}
.dropdown .dropdown-options li[selected|=selected] {
  background-color: rgb(var(--rgb-darkest), 0.05);
}
.dropdown .dropdown-options li:hover {
  background-color: rgb(var(--rgb-darkest), 0.05);
}
.dropdown .dropdown-options li:active {
  background-color: rgb(var(--rgb-darkest), 0.05);
}

/* Select drop down input Styles End */
/* Show Password Start */
.show_password_icon {
  cursor: pointer;
  width: 37px;
  height: 37px;
  font-size: 14px;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  display: grid;
  place-items: center;
}
html[dir=ltr] .show_password_icon {
  right: 0;
  left: auto;
}

.show_password_icon > i:nth-child(1) {
  display: flex !important;
}
.show_password_icon > i:nth-child(2) {
  display: none !important;
}
.show_password_icon.show_icon > i:nth-child(1) {
  display: none !important;
}
.show_password_icon.show_icon > i:nth-child(2) {
  display: flex !important;
}

/* Show Password End */
/* Password field Styles Start */
.inquiry-button {
  width: 100px;
  height: 35px;
  color: #fff;
  border-radius: 8px;
  border: 1px solid #0084ff;
  background-color: #0084ff;
}

.password-strength-group .password-strength-meter {
  width: calc(100% - 80px);
  transition: height 0.3s;
  display: flex;
  justify-content: stretch;
}

.password-strength-group .password-strength-meter .meter-block {
  height: 4px;
  background: #ccc;
  margin: 0 3px;
  flex-grow: 1;
}

/* .password-strength-group .password-strength-meter .meter-block:last-child {
  margin: 0;
} */
.password-strength-group .password-strength-message {
  font-weight: 20px;
  height: 1em;
  text-align: right;
  transition: all 0.5s;
  margin-top: 3px;
  position: relative;
}
html[dir=ltr] .password-strength-group .password-strength-message {
  text-align: left;
}

.password-strength-group .password-strength-message .message-item {
  position: absolute;
  right: 0;
  opacity: 0;
  transition: opacity 0.2s;
}

.password-strength-group[data-strength="1"] .meter-block:nth-child(-n+1) {
  background: #cc3d04;
}

.password-strength-group[data-strength="1"] .message-item:nth-child(1) {
  opacity: 1;
}

.password-strength-group[data-strength="2"] .meter-block:nth-child(-n+2) {
  background: #ffc43b;
}

.password-strength-group[data-strength="2"] .message-item:nth-child(2) {
  opacity: 1;
}

.password-strength-group[data-strength="3"] .meter-block:nth-child(-n+3) {
  background: #9ea60a;
}

.password-strength-group[data-strength="3"] .message-item:nth-child(3) {
  opacity: 1;
}

.password-strength-group[data-strength="4"] .meter-block:nth-child(-n+4) {
  background: #289116;
}

.password-strength-group[data-strength="4"] .message-item:nth-child(4) {
  opacity: 1;
}

.btn-generate {
  max-width: 40px;
  width: 100%;
  height: 40px;
  color: #fff;
  font-size: 10px;
  outline: none !important;
  border: 1px solid rgb(var(--rgb-first-dark));
  background-color: rgb(var(--rgb-first-dark));
  border-radius: 0;
}
.btn-generate.copy {
  border: 1px solid rgb(var(--rgb-yellow-500));
  background-color: rgb(var(--rgb-yellow-500));
  border-radius: 0.75rem 0 0 0.75rem;
}
html[dir=ltr] .btn-generate.copy {
  border-radius: 0 0.75rem 0.75rem 0;
}

.border-dashed {
  border-style: dashed;
}

/* Password field Styles End */
/* Cast Styles Start */
.form-cast-group {
  display: flex;
  width: 100%;
  height: auto;
  justify-content: center;
  align-items: center;
}
.form-cast-group img, .form-cast-group svg {
  width: 100%;
  max-width: 100%;
  max-height: 100px;
  flex-shrink: 0;
}
.form-cast-group label {
  max-width: fit-content;
  flex-shrink: 0;
}
.form-cast-group label > span {
  visibility: hidden;
  opacity: 0;
  transition: all 0.3s ease-in;
  color: rgb(var(--rgb-darkest));
  font-size: 12px;
  max-width: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.form-cast-group label:hover > span {
  visibility: visible;
  opacity: 1;
}
.form-cast-group input:checked + label > span {
  visibility: visible;
  opacity: 1;
}

.avatar_item_input:checked + label {
  border: 1px solid #a1a1a1 !important;
  border-radius: 10px !important;
}

/* Cast Styles End */
/* Customize Tagify Start */
.tagify__tag__removeBtn:hover + div::before {
  box-shadow: 0 0 0 1.5em rgb(var(--rgb-seventh), 1) inset !important;
}

.tagify--select::after {
  content: "\f078";
  left: 16px;
  right: auto;
  font-family: "Font Awesome 6 Pro";
  top: 18px !important;
  transform-origin: center;
  transform: rotate(0deg);
}
.tagify--select[aria-expanded=true]::after {
  transform: rotate(180deg);
}

.tagify__dropdown {
  border-radius: 0.75rem;
  border: 1px solid rgb(var(--rgb-zinc-300));
  padding: 0;
  margin: 0;
}
.tagify__dropdown .tagify__dropdown__wrapper {
  padding: 0;
  margin: 0;
  background-color: rgb(var(--rgb-ninth-lighter));
  border: 1px solid rgb(var(--rgb-light)) !important;
}
.tagify__dropdown .tagify__dropdown__wrapper .tagify__dropdown__item {
  padding: 8px 16px;
  transition: all 0.2s ease-in-out;
  cursor: pointer;
  font-size: 14px;
  width: 100%;
  color: rgb(var(--rgb-darkest));
}
.tagify__dropdown .tagify__dropdown__wrapper .tagify__dropdown__item:not(:nth-last-child(1)) {
  border-bottom: 1px solid rgb(var(--rgb-light));
}
.tagify__dropdown .tagify__dropdown__wrapper .tagify__dropdown__item.tagify__dropdown__item--active {
  background-color: rgb(var(--rgb-darkest), 0.05);
  color: rgb(var(--rgb-darkest));
}

.tagify__input::before, .tagify__input:focus:empty::before, .tagify__input::after {
  color: rgb(var(--rgb-light-dark)) !important;
  opacity: 0.8;
}

.tagify__dropdown__item {
  margin: 0;
}

.tagify__dropdown.extra-properties .tagify__dropdown__item > img {
  display: inline-block;
  vertical-align: middle;
  height: 20px;
  transform: scale(0.75);
  margin-right: 5px;
  border-radius: 2px;
  transition: 0.12s ease-out;
}

.tagify.form-control .tagify__input {
  min-width: auto;
  max-width: 100%;
}

.tagify.form-control tag {
  white-space: nowrap;
}

.tagify.form-control tag img {
  display: inline-block;
  height: 16px;
  margin-right: 3px;
  border-radius: 2px;
  pointer-events: none;
}

.tagify__dropdown .tagify__dropdown__item > img {
  display: inline-block;
  vertical-align: middle;
  height: 24px !important;
  transform: scale(0.75);
  margin-left: 5px;
  border-radius: 2px;
  transition: 0.12s ease-out;
  width: 30px;
  min-width: 30px;
  object-fit: contain;
}

.tagify__dropdown .tagify__dropdown__item--active > img,
.tagify__dropdown .tagify__dropdown__item:hover > img {
  transform: none;
  margin-left: 12px;
}

.tagify.form-control .tagify__input {
  min-width: auto;
  max-width: 100%;
}

.tagify.form-control tag {
  white-space: nowrap;
}

.tagify.form-control tag img {
  display: inline-block;
  height: 26px;
  width: 30px;
  min-width: 30px;
  object-fit: contain;
  margin-left: 5px;
  border-radius: 2px;
  pointer-events: none;
}

.tagify {
  align-items: center !important;
  padding: 0 12px !important;
  overflow: hidden;
}
.tagify .tagify__tag {
  margin: 4px 0 4px 8px !important;
  --tag-inset-shadow-size: 9999px !important;
}
.tagify .tagify__tag__removeBtn {
  font-family: IRANSans, Verdana, Tahoma, serif !important;
  margin-left: 5px !important;
  margin-right: 0;
  padding-top: 3px;
}
.tagify .tagify__tag__removeBtn:hover {
  background-color: rgb(var(--rgb-red-600)) !important;
}
.tagify .tagify__input {
  margin: 5px 0 !important;
}
.tagify .tagify__input::before {
  color: rgb(var(--rgb-light-dark));
}
.tagify .tagify__tag__removeBtn {
  color: rgb(var(--rgb-lightest));
}
.tagify .tagify__tag-text {
  color: rgb(var(--rgb-lightest));
}

.tagify__tag > div::before {
  box-shadow: 0 0 0 999px rgb(var(--rgb-seventh-dark)) inset !important;
}

.tagify__tag__bg_transparent > div::before {
  box-shadow: 0 0 0 999px transparent inset !important;
}
.tagify__tag__bg_transparent .tagify__tag-text {
  color: rgb(var(--rgb-darkest));
}

.tagify__selectbox {
  position: relative;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  background-size: 16px 12px;
  background-repeat: no-repeat;
  background-position: left 0.75rem center;
}
body.dark .tagify__selectbox, body.faragard-dark .tagify__selectbox {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") !important;
}

/* Customize Tagify End */
/* Loader Styles Start */
#loading {
  width: 100vw;
  height: 100dvh;
  background-image: radial-gradient(circle farthest-corner at center, rgb(var(--rgb-first)) 0%, #1c262b 100%);
  position: fixed;
  z-index: 999999999;
}

.loader {
  position: absolute;
  top: calc(50% - 32px);
  left: calc(50% - 32px);
  width: 64px;
  height: 64px;
  border-radius: 50%;
  perspective: 800px;
}

.inner {
  position: absolute;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  border-radius: 50%;
}

.inner.one {
  left: 0%;
  top: 0%;
  animation: rotate-one 1s linear infinite;
  border-bottom: 3px solid #faefef;
  /* border-bottom: 3px solid #EFEFFA; */
}

.inner.two {
  right: 0%;
  top: 0%;
  animation: rotate-two 1s linear infinite;
  border-right: 3px solid #efeffa;
}

.inner.three {
  right: 0%;
  bottom: 0%;
  animation: rotate-three 1s linear infinite;
  border-top: 3px solid #efeffa;
}

.loading {
  width: 100%;
  height: 100%;
}

.loading-text {
  position: absolute;
  top: 25%;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  text-align: center;
  width: 100%;
  height: 100px;
  line-height: 100px;
}

.loading-text span {
  display: inline-block;
  margin: 0 5px;
  color: #fff;
}

.loading-text span:nth-child(1) {
  filter: blur(0px);
  animation: blur-text 1.5s 0s infinite linear alternate;
}

.loading-text span:nth-child(2) {
  filter: blur(0px);
  animation: blur-text 1.5s 0.2s infinite linear alternate;
}

.loading-text span:nth-child(3) {
  filter: blur(0px);
  animation: blur-text 1.5s 0.4s infinite linear alternate;
}

.loading-text span:nth-child(4) {
  filter: blur(0px);
  animation: blur-text 1.5s 0.6s infinite linear alternate;
}

.loading-text span:nth-child(5) {
  filter: blur(0px);
  animation: blur-text 1.5s 0.8s infinite linear alternate;
}

.loading-text span:nth-child(6) {
  filter: blur(0px);
  animation: blur-text 1.5s 1s infinite linear alternate;
}

.loading-text span:nth-child(7) {
  filter: blur(0px);
  animation: blur-text 1.5s 1.2s infinite linear alternate;
}

@keyframes blur-text {
  0% {
    filter: blur(0px);
  }
  100% {
    filter: blur(4px);
  }
}
@keyframes rotate-one {
  0% {
    transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
  }
  100% {
    transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
  }
}
@keyframes rotate-two {
  0% {
    transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
  }
  100% {
    transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
  }
}
@keyframes rotate-three {
  0% {
    transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
  }
  100% {
    transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
  }
}
/* Loader Styles End */
/* File Loader Styles Start */
.loader-listfile {
  display: inline-flex;
  font-size: 0px;
  padding: 0px;
  align-items: center;
  margin: auto;
}
.loader-listfile span {
  vertical-align: middle;
  border-radius: 100%;
  display: inline-block;
  width: 10px;
  height: 10px;
  margin: 3px 2px;
  -webkit-animation: loader-listfile 0.8s linear infinite alternate;
  animation: loader-listfile 0.8s linear infinite alternate;
}
.loader-listfile span:nth-child(1) {
  -webkit-animation-delay: -1s;
  animation-delay: -1s;
  background: rgba(var(--rgb-first-light), 0.6);
}
.loader-listfile span:nth-child(2) {
  -webkit-animation-delay: -0.8s;
  animation-delay: -0.8s;
  background: rgba(var(--rgb-first-light), 0.8);
}
.loader-listfile span:nth-child(3) {
  -webkit-animation-delay: -0.26666s;
  animation-delay: -0.26666s;
  background: rgb(var(--rgb-first-light));
}
.loader-listfile span:nth-child(4) {
  -webkit-animation-delay: -0.8s;
  animation-delay: -0.8s;
  background: rgba(var(--rgb-first-light), 0.8);
}
.loader-listfile span:nth-child(5) {
  -webkit-animation-delay: -1s;
  animation-delay: -1s;
  background: rgba(var(--rgb-first-light), 0.4);
}

@keyframes loader-listfile {
  from {
    transform: scale(0, 0);
  }
  to {
    transform: scale(1, 1);
  }
}
@-webkit-keyframes loader-listfile {
  from {
    -webkit-transform: scale(0, 0);
  }
  to {
    -webkit-transform: scale(1, 1);
  }
}
/* File Loader Styles End */
/* File Upload Styles Start */
.file-drop-area,
.single-file-preview {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 100%;
  padding: 6px 32px;
  border-radius: 12px;
  border: 1px solid rgb(var(--rgb-light));
  transition: 0.3s;
  gap: 8px;
  background-color: rgb(var(--rgb-lighter));
  color: rgb(var(--rgb-darkest)) !important;
}
.file-drop-area img, .file-drop-area svg,
.single-file-preview img,
.single-file-preview svg {
  cursor: pointer;
  height: 40px;
  width: 70px;
  border-radius: 8px;
  object-fit: cover;
}

.single-file-preview {
  min-height: 53px;
}

.file-drop-area {
  padding: 8px 16px;
}
.file-drop-area.is-active {
  background-color: rgb(var(--rgb-first-lighter));
}

.btn-fake {
  flex-shrink: 0;
  font-size: 12px;
  text-transform: uppercase;
  cursor: pointer;
  z-index: 100;
  transition: all 100ms linear;
}

.btn-fake:hover {
  transform: scale(1.1);
}

.file-msg {
  color: rgb(var(--rgb-zinc-400));
  font-size: 16px;
  font-weight: 300;
  line-height: 1.4;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: right;
}
html[dir=ltr] .file-msg {
  text-align: left;
}

.item-delete {
  cursor: pointer;
  z-index: 100;
  color: gray;
  padding: 8px;
  border-radius: 4px;
  transition: color 200ms;
}

.item-delete:hover {
  color: rgb(var(--rgb-red-500)) !important;
}

.file-input {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  cursor: pointer;
  opacity: 0;
}

.file-input:focus {
  outline: none;
}

/* File Upload Styles End */
/* Sortable Styles Start */
ul.sort-list {
  width: fit-content;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
ul.sort-list li {
  cursor: move;
}

.ui-sortable-placeholder {
  outline: 1px dashed rgb(var(--rgb-zinc-300));
  visibility: visible !important;
}

/* Sortable Styles End */
/* snackbar start */
.snackbar {
  visibility: hidden;
  min-width: 260px;
  max-width: 400px;
  line-height: 24px;
  word-wrap: break-word;
  width: 76%;
  max-width: 400px;
  background-color: rgb(var(--rgb-ninth-lighter));
  color: rgb(var(--rgb-dark));
  text-align: center;
  border-radius: 8px;
  padding: 16px;
  position: fixed;
  z-index: 4000;
  left: 50%;
  top: 32px;
  min-height: 56px;
  height: fit-content;
  transform: translateX(-50%);
  font-size: 14px;
  box-shadow: 2px 2px 10px 0 rgba(var(--rgb-darkest), 0.1);
  cursor: help;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  overflow: hidden;
}
.snackbar::before {
  content: "";
  height: 4px;
  width: 0%;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: rgb(var(--rgb-light-dark));
  animation-name: progressWidth;
  animation-duration: var(--snackbar-duration, 1000ms);
  animation-timing-function: linear;
  transition: all cubic-bezier(0, 0.61, 1, 0.36);
}
.snackbar.hide-progress::before {
  opacity: 0;
  visibility: hidden;
}
@keyframes progressWidth {
  0% {
    width: 0%;
  }
  100% {
    width: 100%;
  }
}
.snackbar p {
  color: rgb(var(--rgb-dark)) !important;
  margin: 0;
  font-size: 14px;
  text-align: right;
}
html[dir=ltr] .snackbar p {
  text-align: left;
}

.snackbar i {
  color: rgb(var(--rgb-light-dark));
  animation: toggleIcon 800ms cubic-bezier(0.37, 0.15, 0.7, 0.9) infinite;
  transition: transform 800ms;
}
@keyframes toggleIcon {
  0% {
    transform: scale(1);
  }
  10% {
    transform: scale(0.9);
  }
  80% {
    transform: scale(1.2);
  }
  100% {
    transform: scale(1);
  }
}
.snackbar.show {
  visibility: visible;
  animation-name: fadeinSnackbar, fadeoutSnackbar;
  animation-duration: 0.5s, 0.5s;
  animation-delay: 0s, var(--snackbar-duration, 1000ms);
}
.snackbar-success {
  box-shadow: 2px 2px 10px 0 rgba(var(--rgb-green-700), 0.16) !important;
}
.snackbar-success i {
  color: rgb(var(--rgb-green-500)) !important;
}
.snackbar-success::before {
  background-color: rgb(var(--rgb-green-500));
}
.snackbar-danger {
  box-shadow: 2px 2px 10px 0 rgba(var(--rgb-red-700), 0.16) !important;
}
.snackbar-danger i {
  color: rgb(var(--rgb-red-500)) !important;
}
.snackbar-danger::before {
  background-color: rgb(var(--rgb-red-500));
}
.snackbar-info {
  box-shadow: 2px 2px 10px 0 rgba(var(--rgb-sky-700), 0.16) !important;
}
.snackbar-info i {
  color: rgb(var(--rgb-sky-500)) !important;
}
.snackbar-info::before {
  background-color: rgb(var(--rgb-sky-500));
}
.snackbar-warning {
  box-shadow: 2px 2px 10px 0 rgba(var(--rgb-yellow-700), 0.16) !important;
}
.snackbar-warning i {
  color: rgb(var(--rgb-yellow-500)) !important;
}
.snackbar-warning::before {
  background-color: rgb(var(--rgb-yellow-500));
}
.snackbar-light i {
  color: rgb(var(--rgb-light-dark)) !important;
}
.snackbar-light::before {
  background-color: rgb(var(--rgb-light-dark));
}

body.dark .snackbar, body.faragard-dark .snackbar {
  background-color: rgb(var(--rgb-first-lighter));
}
body.dark .snackbar-success, body.faragard-dark .snackbar-success {
  box-shadow: 2px 2px 10px 0 rgba(var(--rgb-green-400), 0.16) !important;
}
body.dark .snackbar-danger, body.faragard-dark .snackbar-danger {
  box-shadow: 2px 2px 10px 0 rgba(var(--rgb-red-400), 0.16) !important;
}
body.dark .snackbar-info, body.faragard-dark .snackbar-info {
  box-shadow: 2px 2px 10px 0 rgba(var(--rgb-sky-400), 0.16) !important;
}
body.dark .snackbar-warning, body.faragard-dark .snackbar-warning {
  box-shadow: 2px 2px 10px 0 rgba(var(--rgb-yellow-400), 0.16) !important;
}

@-webkit-keyframes fadeinSnackbar {
  from {
    top: 0;
    opacity: 0;
    visibility: hidden;
  }
  to {
    top: 32px;
    opacity: 1;
    visibility: visible;
  }
}
@keyframes fadeinSnackbar {
  from {
    top: 0;
    opacity: 0;
    visibility: hidden;
  }
  to {
    top: 32px;
    opacity: 1;
    visibility: visible;
  }
}
@-webkit-keyframes fadeoutSnackbar {
  from {
    top: 32px;
    opacity: 1;
    visibility: visible;
  }
  to {
    top: 0;
    opacity: 0;
    visibility: hidden;
  }
}
@keyframes fadeoutSnackbar {
  from {
    top: 32px;
    opacity: 1;
    visibility: visible;
  }
  to {
    top: 0;
    opacity: 0;
    visibility: hidden;
  }
}
/* snackbar end */
/* Loading circular */
.circular-loading {
  display: none;
}

.is-circular-loading {
  pointer-events: none;
  opacity: 0.7;
}
.is-circular-loading > *:not(.loading) {
  display: none;
}
.is-circular-loading .circular-loading {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
}
.is-circular-loading .circular-loading::before {
  content: "\f3f4";
  font-family: "Font Awesome 6 Pro";
  font-size: 18px;
  width: fit-content;
  height: fit-content;
  -webkit-animation-name: fa-spin;
  animation-name: fa-spin;
  -webkit-animation-duration: var(--fa-animation-duration, 1s);
  animation-duration: var(--fa-animation-duration, 1s);
  -webkit-animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  -webkit-animation-timing-function: var(--fa-animation-timing, linear);
  animation-timing-function: var(--fa-animation-timing, linear);
}

/* Like Dislike Styles Start */
.like-dislike-form {
  border: 1px solid transparent;
}
.like-dislike-form input.like-input:checked + label i {
  color: rgb(var(--rgb-green-600));
}
.like-dislike-form input.dislike-input:checked + label i {
  color: rgb(var(--rgb-red-600));
}
.like-dislike-form label {
  padding: 4px 8px;
  cursor: pointer;
}
.like-dislike-form label i {
  color: rgb(var(--rgb-darkest));
}

/* Like Dislike Styles End */
/* Bottom Navbar Styles Start */
nav.bottom-navbar {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 86px;
  background: rgb(var(--rgb-ninth-lighter));
  z-index: 2700;
  box-shadow: 0 -3px 8px rgb(var(--rgb-darkest), 0.1);
}
nav.bottom-navbar ul {
  display: flex;
  justify-content: space-around;
  align-items: end;
  width: 100%;
  height: 100%;
  padding-bottom: 6px;
}
nav.bottom-navbar ul li {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
nav.bottom-navbar ul li.center a {
  color: rgb(var(--rgb-seventh-darker));
  position: relative;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
nav.bottom-navbar ul li.center a::before {
  content: "";
  background: rgb(var(--rgb-ninth-lighter));
  width: 80px;
  height: 80px;
  border-radius: var(--radius-full);
  position: absolute;
  top: 35%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -1;
  box-shadow: 0 -14px 22px -20px rgb(var(--rgb-darkest), 0.4);
}
nav.bottom-navbar ul li.center a img, nav.bottom-navbar ul li.center a svg {
  width: 58px;
  height: 58px;
  background: rgb(var(--rgb-seventh-light));
  padding: 12px;
  border-radius: var(--radius-full);
}
nav.bottom-navbar ul li a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: rgb(var(--rgb-light-dark));
  gap: 4px;
  padding: 8px 12px;
  height: 100%;
  position: relative;
  flex: 1;
}
@media only screen and (max-width: 360px) {
  nav.bottom-navbar ul li a {
    padding: 8px 4px !important;
  }
}
nav.bottom-navbar ul li a img, nav.bottom-navbar ul li a svg {
  width: 30px;
  height: 30px;
}
nav.bottom-navbar ul li a .counter {
  min-width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  background-color: rgb(var(--rgb-first));
  color: rgb(var(--rgb-lightest));
  top: 6px;
  left: 0px;
  border-radius: 999px;
  padding: 3px 6px 1px 6px;
  min-width: 20px;
  text-align: center;
}
nav.bottom-navbar ul li a .counter:empty {
  display: none;
}

/* Bottom Navbar Styles End */
/* Bootstrap Classes Start */
.mw-fit {
  max-width: fit-content !important;
}

.shadow {
  box-shadow: 0 0.5rem 1rem rgba(var(--rgb-darkest), 0.15) !important;
}

.modal {
  box-shadow: 0 0.5rem 1rem rgba(var(--rgb-darkest), 0.9) !important;
  --bs-modal-zindex: 2600;
}

.modal-backdrop {
  --bs-backdrop-zindex: 2599;
}

.modal-content {
  background-color: rgb(var(--rgb-ninth-lighter));
}
.modal-content .modal-header {
  justify-content: space-between;
  border-bottom-color: rgba(var(--rgb-darkest), 0.1) !important;
}
.modal-content .modal-header :is(h1,
h2,
h3,
h4,
h5,
h6) {
  color: rgb(var(--rgb-first-darker)) !important;
}
.modal-content .modal-footer {
  border-color: rgba(var(--rgb-darkest), 0.1);
  background-color: rgb(var(--rgb-first-lighter));
}

@media only screen and (min-width: 767px) {
  .modal-btn-md-start {
    position: absolute;
    left: calc(100% + 6px);
  }
}

.alert-dark {
  background-color: rgb(var(--rgb-light));
  color: rgb(var(--rgb-darker));
}
.alert-info-light {
  background-color: rgb(var(--rgb-blue-100));
  color: rgb(var(--rgb-blue-700));
}
body.dark .alert-info-light, body.faragard-dark .alert-info-light {
  background-color: rgb(var(--rgb-blue-700));
  color: rgb(var(--rgb-blue-100));
}

.alert-warning-light {
  background-color: rgb(var(--rgb-amber-100));
  color: rgb(var(--rgb-amber-700));
}
body.dark .alert-warning-light, body.faragard-dark .alert-warning-light {
  background-color: rgb(var(--rgb-amber-700));
  color: rgb(var(--rgb-amber-100));
}

.alert-success-light {
  background-color: rgb(var(--rgb-green-100));
  color: rgb(var(--rgb-green-700));
}
body.dark .alert-success-light, body.faragard-dark .alert-success-light {
  background-color: rgb(var(--rgb-green-700));
  color: rgb(var(--rgb-green-100));
}

.alert-danger-light {
  background-color: rgb(var(--rgb-red-100));
  color: rgb(var(--rgb-red-700));
}
body.dark .alert-danger-light, body.faragard-dark .alert-danger-light {
  background-color: rgb(var(--rgb-red-700));
  color: rgb(var(--rgb-red-100));
}

html[dir=ltr] .modal-header .btn-close {
  margin: calc(-0.5 * var(--bs-modal-header-padding-y)) calc(-0.5 * var(--bs-modal-header-padding-x)) calc(-0.5 * var(--bs-modal-header-padding-y)) auto;
}
html[dir=ltr] .left-0 {
  left: auto !important;
  right: 0 !important;
}
html[dir=ltr] .right-0 {
  right: auto !important;
  left: 0 !important;
}
html[dir=ltr] .end-0 {
  left: auto !important;
  right: 0 !important;
}
html[dir=ltr] .start-0 {
  right: auto !important;
  left: 0 !important;
}
html[dir=ltr] .border-end {
  border-right: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
  border-left: none !important;
}
html[dir=ltr] .border-start {
  border-left: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
  border-right: none !important;
}
html[dir=ltr] .text-start {
  text-align: left !important;
}
html[dir=ltr] .text-end {
  text-align: right !important;
}

/* Bootstrap Classes End */
/* Search Result Start */
body.dark .search-result ul li a, body.faragard-dark .search-result ul li a {
  color: white;
}
body.dark .search-result ul li:hover a .loading-animation, body.faragard-dark .search-result ul li:hover a .loading-animation {
  background-color: rgb(var(--rgb-lightest), 0.5);
}
body.dark .search-result ul li:hover a .loading-animation::before, body.faragard-dark .search-result ul li:hover a .loading-animation::before {
  background: linear-gradient(to right, transparent, rgb(var(--rgb-first), 1), transparent) !important;
}
body.dark .loading-animation, body.faragard-dark .loading-animation {
  overflow: hidden;
}

.search-result {
  position: absolute;
  top: 110%;
  left: 0;
  width: 100%;
  background-color: rgb(var(--rgb-ninth-lighter));
  border-radius: 8px;
  padding: 5px;
  box-shadow: 0 0 8px 0 rgba(var(--rgb-darkest), 0.2);
  color: rgb(var(--rgb-darkest));
  z-index: 500;
  max-height: 210px;
  overflow-y: auto;
  overflow-x: hidden;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transition: all 300ms;
  transform: translateY(10px);
}
.search-result.show {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}
.search-result::-webkit-scrollbar {
  width: 6px;
}
.search-result::-webkit-scrollbar-track {
  background: var(--scrollbar-bg);
}
.search-result::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb-bg);
  border-radius: 6px;
}
.search-result ul {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}
.search-result ul li:focus {
  outline: none !important;
}
.search-result ul li:focus a {
  background-color: rgb(var(--rgb-first), 0.1);
}
.search-result ul li:focus a .loading-animation {
  overflow: hidden;
  background: rgb(var(--rgb-lightest));
}
.search-result ul li:focus a .loading-animation::before {
  content: "";
  display: block;
  height: 100%;
  width: 100%;
  animation: loading-text-anim 1s infinite;
  background: linear-gradient(to right, transparent, rgb(var(--rgb-first), 0.1), transparent);
}
.search-result ul li a {
  display: flex;
  flex-direction: column;
  padding: 8px 15px;
  border-radius: 6px;
  transition: 100ms;
  color: rgb(var(--rgb-first));
}
.search-result ul li a .title {
  padding-top: 4px;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.search-result ul li a p.description {
  font-size: 12px;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.search-result ul li a img, .search-result ul li a svg {
  width: 48px;
  height: 48px;
  object-fit: cover;
}
.search-result ul li:not(:last-child) {
  border-bottom: 1px solid var(--rgb-light-dark);
}
.search-result ul li:hover a {
  background-color: rgb(var(--rgb-first), 0.1);
}
.search-result ul li:hover a .loading-animation {
  overflow: hidden;
  background: rgb(var(--rgb-lightest));
}
.search-result ul li:hover a .loading-animation::before {
  content: "";
  display: block;
  height: 100%;
  width: 100%;
  animation: loading-text-anim 1s infinite;
  background: linear-gradient(to right, transparent, rgb(var(--rgb-first), 0.1), transparent);
}

.loading-animation {
  overflow: hidden;
  background: rgb(var(--rgb-first), 0.1);
}
.loading-animation.title {
  padding-top: 0 !important;
}
.loading-animation::before {
  content: "";
  display: block;
  height: 100%;
  width: 100%;
  animation: loading-text-anim 1s infinite;
  background: linear-gradient(to left, transparent, rgb(var(--rgb-ninth-lighter), 0.5), transparent);
}

body.dark .loading-animation, body.faragard-dark .loading-animation {
  background-color: rgb(var(--rgb-first-lighter)) !important;
}

@keyframes loading-text-anim {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(-100%);
  }
}
.line {
  height: 10px;
  width: 300px;
  border-radius: 50px;
}

.loading_title {
  height: 16px;
  width: 40%;
  border-radius: 50px;
}

.loading_img {
  height: 46px;
  width: 46px;
  min-width: 46px;
  border-radius: 4px;
}

.loading_desc {
  margin-top: 15px;
  height: 10px;
  width: 100%;
  border-radius: 50px;
}

/* Search Result End */
/* Light gallery styles start */
.lg-inner {
  direction: ltr !important;
}

.lg-thumb-outer {
  direction: ltr !important;
}

.lg-backdrop {
  z-index: 2600;
}

/* Light gallery styles end */
/* Print styles start */
@media print {
  .no-print,
  .emkanat {
    display: none !important;
  }
  .print {
    display: initial !important;
    color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }
}
/* Print styles end */
/* Switcher theme start */
.switcher-theme {
  width: fit-content;
  display: flex;
  height: 26px;
}
.switcher-theme > input[type=checkbox] {
  display: none;
}
.switcher-theme > input[type=checkbox]:checked + label::before {
  background: rgb(var(--rgb-seventh-light)) !important;
  box-shadow: inset 0 0 10px rgba(var(--rgb-seventh-dark), 0.5);
  opacity: 1;
}
.switcher-theme > input[type=checkbox]:checked + label::after {
  box-shadow: 0 0 5px rgba(var(--rgb-seventh-dark), 0.2);
  background: rgb(var(--rgb-lightest)) !important;
  right: 26px;
}
.switcher-theme > input[type=checkbox]:checked + label i {
  color: rgb(var(--rgb-seventh-dark));
  right: 5px;
}
.switcher-theme > input[type=checkbox]:checked + label i::before {
  content: "\f755" !important;
}
.switcher-theme > label {
  cursor: pointer;
  height: 0;
  position: relative;
  width: 48px;
}
.switcher-theme > label i {
  position: absolute;
  right: 26px;
  top: 5px;
  color: rgb(var(--rgb-lightest));
  font-size: 16px !important;
}
.switcher-theme > label i::before {
  content: "\e28f";
}
.switcher-theme > label::before {
  background: rgb(var(--rgb-first-lighter)) !important;
  box-shadow: inset 0 0 10px rgba(var(--rgb-darkest), 0.3);
  border-radius: 18px;
  content: "";
  height: 26px;
  position: absolute;
  opacity: 1;
  transition: all 0.4s ease-in-out;
  width: 48px;
  left: 0;
  right: 0;
}
.switcher-theme > label::after {
  background: rgb(var(--rgb-seventh-darker)) !important;
  box-shadow: 0 0 5px rgba(var(--rgb-darkest), 0.1);
  border-radius: 9px;
  content: "";
  height: 18px;
  width: 18px;
  right: 4px;
  position: absolute;
  top: 4px;
  transition: all 0.3s ease-in-out;
}

/* Switcher theme end */
/* Comments Start */
.comments img, .comments svg {
  width: 32px;
  height: 32px;
  border-radius: var(--radius-input);
}
.comments .comment-box {
  padding: 15px 0 4px 0;
  display: flex;
  flex-direction: column;
  min-height: 80px;
  border-bottom: 1px solid rgba(var(--rgb-darkest), 0.1);
}
.comments .comment-box:nth-last-of-type(1) {
  border-bottom: none;
}
.comments .comment-box .title {
  color: rgb(var(--rgb-light-dark));
  font-size: 13px;
}
.comments .comment-box .body {
  font-weight: 500;
  font-size: 13px;
  color: rgb(var(--rgb-darker));
}

/* Comments End */
/* Tag box start */
.tag-item-box {
  display: inline-flex;
  gap: 8px;
  justify-content: space-between;
  align-items: center;
  padding: 8px 12px;
  font-size: 12px;
  background-color: rgb(var(--rgb-seventh-dark));
  border-radius: 4px;
  width: fit-content;
  color: rgb(var(--rgb-lightest));
  margin: 0;
}
.tag-item-box:has(button:hover) {
  background-color: rgb(var(--rgb-seventh));
}
.tag-item-box button {
  border-radius: var(--radius-full);
  width: 14px;
  height: 14px;
  padding: 0;
}
.tag-item-box button:hover {
  background-color: rgb(var(--rgb-red-700));
}
.tag-item-box button i {
  margin-top: 1px;
  font-size: 10px;
  color: rgb(var(--rgb-lightest));
}

/* Tag box end */
.text-shadow {
  text-shadow: 0 0 7px rgb(var(--rgb-black));
}

.title-bar-cover {
  min-height: 220px !important;
  background-image: url("../images/my/ticket/location-cover.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 16px 24px;
  display: flex;
  justify-content: flex-start !important;
  align-items: center;
  flex-direction: row !important;
  color: rgb(var(--rgb-lightest));
  gap: 8px;
}
@media only screen and (max-width: 767px) {
  .title-bar-cover {
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
  }
  .title-bar-cover .title,
  .title-bar-cover .content {
    text-align: center !important;
  }
}
.title-bar-cover .title,
.title-bar-cover .content {
  text-align: right;
}
html[dir=ltr] .title-bar-cover .title,
html[dir=ltr] .title-bar-cover .content {
  text-align: left;
}

.title-bar-cover img, .title-bar-cover svg {
  width: 100px;
  height: 100px;
  max-width: 100%;
  border-radius: var(--radius-full);
}

/* Circular loader Material start */
.spinner {
  -webkit-animation: rotation 1.35s linear infinite;
  animation: rotation 1.35s linear infinite;
  stroke: rgb(var(--rgb-seventh));
}

@-webkit-keyframes rotation {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(270deg);
    transform: rotate(270deg);
  }
}
@keyframes rotation {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(270deg);
    transform: rotate(270deg);
  }
}
.circle {
  stroke-dasharray: 180;
  stroke-dashoffset: 0;
  -webkit-transform-origin: center;
  -ms-transform-origin: center;
  transform-origin: center;
  -webkit-animation: turn 1.35s ease-in-out infinite;
  animation: turn 1.35s ease-in-out infinite;
}

@-webkit-keyframes turn {
  0% {
    stroke-dashoffset: 180;
  }
  50% {
    stroke-dashoffset: 45;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
  }
  100% {
    stroke-dashoffset: 180;
    -webkit-transform: rotate(450deg);
    transform: rotate(450deg);
  }
}
@keyframes turn {
  0% {
    stroke-dashoffset: 180;
  }
  50% {
    stroke-dashoffset: 45;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
  }
  100% {
    stroke-dashoffset: 180;
    -webkit-transform: rotate(450deg);
    transform: rotate(450deg);
  }
}
/* Circular loader Material end */
/* No ui range slider styles start */
.noUi-horizontal {
  height: 6px;
  width: 100%;
}
.noUi-horizontal.form-error .noUi-handle {
  border-color: rgb(var(--rgb-red-600));
  box-shadow: inset 0 0 1px rgba(var(--rgb-red-600), 0.9), 0 2px 6px -3px rgba(var(--rgb-darkest), 0.5);
}
.noUi-horizontal .noUi-handle {
  width: 16px;
  height: 16px;
  cursor: pointer;
  border-radius: 100%;
  border: 1px solid rgb(var(--rgb-light));
  background: rgb(var(--rgb-first));
  box-shadow: inset 0 0 1px rgba(var(--rgb-lightest), 0.9), 0 2px 6px -3px rgba(var(--rgb-darkest), 0.5);
}

.noUi-target {
  border-color: rgb(var(--rgb-light));
}

.noUi-handle:after,
.noUi-handle:before {
  display: none;
}

.noUi-txt-dir-rtl.noUi-horizontal .noUi-handle {
  left: -8px;
}

.noUi-connect {
  background: rgb(var(--rgb-first));
}

/* No ui range slider styles end */
.hidden {
  display: none !important;
}

.min-height-auto {
  min-height: auto !important;
}

.max-height-none {
  max-height: none !important;
}

.min-width-auto {
  min-width: auto !important;
}

.min-w-100 {
  min-width: 100% !important;
}

.min-h-100 {
  min-height: 100% !important;
}

.min-height-470 {
  min-height: 470px !important;
}

.mx-box {
  margin: 0 30px !important;
}

.breadcrumb > ul > ul:first-child {
  display: none;
}

@media print {
  body {
    visibility: hidden;
  }
  .emkanat {
    visibility: hidden;
    display: none;
  }
  .print {
    visibility: visible;
    position: absolute;
    right: 0px;
    top: 0px;
    border-radius: 16px;
  }
}
.standard-scrollbar::-webkit-scrollbar {
  width: 8px;
  height: 8px;
  border-radius: 8px;
}
.standard-scrollbar::-webkit-scrollbar-track {
  background: var(--scrollbar-bg);
}
.standard-scrollbar::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb-bg);
  border-radius: 8px;
}
.standard-scrollbar-sm::-webkit-scrollbar {
  width: 4px;
  height: 4px;
  border-radius: 4px;
}
.standard-scrollbar-sm::-webkit-scrollbar-track {
  background: var(--scrollbar-bg);
}
.standard-scrollbar-sm::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb-bg);
  border-radius: 4px;
}
.standard-scrollbar-hidden {
  scrollbar-width: none;
  -ms-overflow-style: none;
  scrollbar-color: transparent transparent;
}
.standard-scrollbar-hidden::-webkit-scrollbar {
  width: 0;
}
.standard-scrollbar-hidden::-webkit-scrollbar-track, .standard-scrollbar-hidden::-webkit-scrollbar-thumb {
  background: transparent;
}
@media only screen and (max-width: 575px) {
  .standard-scrollbar-hidden-sm {
    scrollbar-width: none;
  }
  .standard-scrollbar-hidden-sm::-webkit-scrollbar {
    width: 0;
  }
  .standard-scrollbar-hidden-sm::-webkit-scrollbar-track, .standard-scrollbar-hidden-sm::-webkit-scrollbar-thumb {
    background: transparent;
  }
}
@media only screen and (max-width: 767px) {
  .standard-scrollbar-hidden-md {
    scrollbar-width: none;
  }
  .standard-scrollbar-hidden-md::-webkit-scrollbar {
    width: 0;
  }
  .standard-scrollbar-hidden-md::-webkit-scrollbar-track, .standard-scrollbar-hidden-md::-webkit-scrollbar-thumb {
    background: transparent;
  }
}

/* Dropdown tabs start */
.drop-tab-group:not(:has(.drop-tab)) {
  display: none;
}

@media only screen and (max-width: 992px) {
  .drop-tab {
    position: absolute;
    top: 100%;
    left: 0;
    background-color: rgb(var(--rgb-ninth-lighter));
    border: 1px solid rgba(var(--rgb-darkest), 0.1);
    min-width: 220px !important;
    z-index: 2000;
    min-height: max-content;
    max-height: 240px;
    overflow-y: auto;
    height: auto !important;
    border-radius: 8px;
    transform: translateY(10px);
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
    transition: all 200ms;
  }
  html[dir=ltr] .drop-tab {
    right: 0;
    left: auto;
  }
  .drop-tab::-webkit-scrollbar {
    width: 8px;
  }
  .drop-tab::-webkit-scrollbar-thumb {
    background: var(--scrollbar-thumb-bg);
    border-radius: var(--radius-full);
    cursor: pointer;
  }
  .drop-tab::-webkit-scrollbar-track {
    background: var(--scrollbar-bg);
    border-radius: var(--radius-full);
  }
  .drop-tab.show {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
    visibility: visible;
  }
  .drop-tab ul {
    display: flex;
    flex-direction: column;
    gap: 0 !important;
    width: 100%;
  }
  .drop-tab ul li {
    border-bottom: 0.5px solid rgba(var(--rgb-darkest), 0.1);
    border-radius: 0 !important;
  }
  .drop-tab ul li:nth-of-type(1) {
    border-radius: 7px 7px 0 0 !important;
  }
  .drop-tab ul li:nth-last-of-type(1) {
    border-radius: 0 0 7px 7px !important;
    border-bottom: none;
  }
  .drop-tab ul li:hover {
    background-color: rgba(var(--rgb-darkest), 0.05);
  }
  .drop-tab ul li button {
    width: 100%;
    text-align: start;
    border: none !important;
    background-color: transparent !important;
    box-shadow: none !important;
    color: rgb(var(--rgb-light-dark)) !important;
    font-weight: 500;
  }
  .drop-tab ul li button:hover, .drop-tab ul li button.active {
    color: rgb(var(--rgb-first-darker)) !important;
  }
  .drop-tab ul li button:focus, .drop-tab ul li button:hover {
    border-color: transparent;
    border-bottom-color: rgb(var(--rgb-first-darker));
  }
  .drop-tab-group {
    position: relative;
  }
}
/* Dropdown tabs end */
/* Loaders start */
.dots-loader-wrapper {
  width: 46px;
  height: 46px;
  display: none;
  position: relative;
}
.dots-loader-wrapper.active {
  display: block;
}
.dots-loader-wrapper.active .dots-loader {
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
}

.dots-loader {
  font-size: 10px;
  width: 1em;
  height: 1em;
  border-radius: 50%;
  position: absolute;
  text-indent: -9999em;
  animation: mulShdSpin 1.1s infinite ease;
  transform: translate(-50%, -50%) translateZ(0) scale(0.7);
  top: 50%;
  left: 50%;
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  z-index: 99999;
  transition: all 200ms linear;
}
.dots-loader.lightest-loader {
  animation: mulShdSpinWhite 1.1s infinite ease !important;
}

@keyframes mulShdSpin {
  0%, 100% {
    box-shadow: 0em -2.6em 0em 0em rgb(var(--rgb-first-light)), 1.8em -1.8em 0 0em rgba(var(--rgb-first-light), 0.2), 2.5em 0em 0 0em rgba(var(--rgb-first-light), 0.2), 1.75em 1.75em 0 0em rgba(var(--rgb-first-light), 0.2), 0em 2.5em 0 0em rgba(var(--rgb-first-light), 0.2), -1.8em 1.8em 0 0em rgba(var(--rgb-first-light), 0.2), -2.6em 0em 0 0em rgba(var(--rgb-first-light), 0.5), -1.8em -1.8em 0 0em rgba(var(--rgb-first-light), 0.7);
  }
  12.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(var(--rgb-first-light), 0.7), 1.8em -1.8em 0 0em rgb(var(--rgb-first-light)), 2.5em 0em 0 0em rgba(var(--rgb-first-light), 0.2), 1.75em 1.75em 0 0em rgba(var(--rgb-first-light), 0.2), 0em 2.5em 0 0em rgba(var(--rgb-first-light), 0.2), -1.8em 1.8em 0 0em rgba(var(--rgb-first-light), 0.2), -2.6em 0em 0 0em rgba(var(--rgb-first-light), 0.2), -1.8em -1.8em 0 0em rgba(var(--rgb-first-light), 0.5);
  }
  25% {
    box-shadow: 0em -2.6em 0em 0em rgba(var(--rgb-first-light), 0.5), 1.8em -1.8em 0 0em rgba(var(--rgb-first-light), 0.7), 2.5em 0em 0 0em rgb(var(--rgb-first-light)), 1.75em 1.75em 0 0em rgba(var(--rgb-first-light), 0.2), 0em 2.5em 0 0em rgba(var(--rgb-first-light), 0.2), -1.8em 1.8em 0 0em rgba(var(--rgb-first-light), 0.2), -2.6em 0em 0 0em rgba(var(--rgb-first-light), 0.2), -1.8em -1.8em 0 0em rgba(var(--rgb-first-light), 0.2);
  }
  37.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(var(--rgb-first-light), 0.2), 1.8em -1.8em 0 0em rgba(var(--rgb-first-light), 0.5), 2.5em 0em 0 0em rgba(var(--rgb-first-light), 0.7), 1.75em 1.75em 0 0em rgb(var(--rgb-first-light)), 0em 2.5em 0 0em rgba(var(--rgb-first-light), 0.2), -1.8em 1.8em 0 0em rgba(var(--rgb-first-light), 0.2), -2.6em 0em 0 0em rgba(var(--rgb-first-light), 0.2), -1.8em -1.8em 0 0em rgba(var(--rgb-first-light), 0.2);
  }
  50% {
    box-shadow: 0em -2.6em 0em 0em rgba(var(--rgb-first-light), 0.2), 1.8em -1.8em 0 0em rgba(var(--rgb-first-light), 0.2), 2.5em 0em 0 0em rgba(var(--rgb-first-light), 0.5), 1.75em 1.75em 0 0em rgba(var(--rgb-first-light), 0.7), 0em 2.5em 0 0em rgb(var(--rgb-first-light)), -1.8em 1.8em 0 0em rgba(var(--rgb-first-light), 0.2), -2.6em 0em 0 0em rgba(var(--rgb-first-light), 0.2), -1.8em -1.8em 0 0em rgba(var(--rgb-first-light), 0.2);
  }
  62.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(var(--rgb-first-light), 0.2), 1.8em -1.8em 0 0em rgba(var(--rgb-first-light), 0.2), 2.5em 0em 0 0em rgba(var(--rgb-first-light), 0.2), 1.75em 1.75em 0 0em rgba(var(--rgb-first-light), 0.5), 0em 2.5em 0 0em rgba(var(--rgb-first-light), 0.7), -1.8em 1.8em 0 0em rgb(var(--rgb-first-light)), -2.6em 0em 0 0em rgba(var(--rgb-first-light), 0.2), -1.8em -1.8em 0 0em rgba(var(--rgb-first-light), 0.2);
  }
  75% {
    box-shadow: 0em -2.6em 0em 0em rgba(var(--rgb-first-light), 0.2), 1.8em -1.8em 0 0em rgba(var(--rgb-first-light), 0.2), 2.5em 0em 0 0em rgba(var(--rgb-first-light), 0.2), 1.75em 1.75em 0 0em rgba(var(--rgb-first-light), 0.2), 0em 2.5em 0 0em rgba(var(--rgb-first-light), 0.5), -1.8em 1.8em 0 0em rgba(var(--rgb-first-light), 0.7), -2.6em 0em 0 0em rgb(var(--rgb-first-light)), -1.8em -1.8em 0 0em rgba(var(--rgb-first-light), 0.2);
  }
  87.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(var(--rgb-first-light), 0.2), 1.8em -1.8em 0 0em rgba(var(--rgb-first-light), 0.2), 2.5em 0em 0 0em rgba(var(--rgb-first-light), 0.2), 1.75em 1.75em 0 0em rgba(var(--rgb-first-light), 0.2), 0em 2.5em 0 0em rgba(var(--rgb-first-light), 0.2), -1.8em 1.8em 0 0em rgba(var(--rgb-first-light), 0.5), -2.6em 0em 0 0em rgba(var(--rgb-first-light), 0.7), -1.8em -1.8em 0 0em rgb(var(--rgb-first-light));
  }
}
@keyframes mulShdSpinWhite {
  0%, 100% {
    box-shadow: 0em -2.6em 0em 0em rgb(var(--rgb-lightest)), 1.8em -1.8em 0 0em rgba(var(--rgb-lightest), 0.2), 2.5em 0em 0 0em rgba(var(--rgb-lightest), 0.2), 1.75em 1.75em 0 0em rgba(var(--rgb-lightest), 0.2), 0em 2.5em 0 0em rgba(var(--rgb-lightest), 0.2), -1.8em 1.8em 0 0em rgba(var(--rgb-lightest), 0.2), -2.6em 0em 0 0em rgba(var(--rgb-lightest), 0.5), -1.8em -1.8em 0 0em rgba(var(--rgb-lightest), 0.7);
  }
  12.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(var(--rgb-lightest), 0.7), 1.8em -1.8em 0 0em rgb(var(--rgb-lightest)), 2.5em 0em 0 0em rgba(var(--rgb-lightest), 0.2), 1.75em 1.75em 0 0em rgba(var(--rgb-lightest), 0.2), 0em 2.5em 0 0em rgba(var(--rgb-lightest), 0.2), -1.8em 1.8em 0 0em rgba(var(--rgb-lightest), 0.2), -2.6em 0em 0 0em rgba(var(--rgb-lightest), 0.2), -1.8em -1.8em 0 0em rgba(var(--rgb-lightest), 0.5);
  }
  25% {
    box-shadow: 0em -2.6em 0em 0em rgba(var(--rgb-lightest), 0.5), 1.8em -1.8em 0 0em rgba(var(--rgb-lightest), 0.7), 2.5em 0em 0 0em rgb(var(--rgb-lightest)), 1.75em 1.75em 0 0em rgba(var(--rgb-lightest), 0.2), 0em 2.5em 0 0em rgba(var(--rgb-lightest), 0.2), -1.8em 1.8em 0 0em rgba(var(--rgb-lightest), 0.2), -2.6em 0em 0 0em rgba(var(--rgb-lightest), 0.2), -1.8em -1.8em 0 0em rgba(var(--rgb-lightest), 0.2);
  }
  37.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(var(--rgb-lightest), 0.2), 1.8em -1.8em 0 0em rgba(var(--rgb-lightest), 0.5), 2.5em 0em 0 0em rgba(var(--rgb-lightest), 0.7), 1.75em 1.75em 0 0em rgb(var(--rgb-lightest)), 0em 2.5em 0 0em rgba(var(--rgb-lightest), 0.2), -1.8em 1.8em 0 0em rgba(var(--rgb-lightest), 0.2), -2.6em 0em 0 0em rgba(var(--rgb-lightest), 0.2), -1.8em -1.8em 0 0em rgba(var(--rgb-lightest), 0.2);
  }
  50% {
    box-shadow: 0em -2.6em 0em 0em rgba(var(--rgb-lightest), 0.2), 1.8em -1.8em 0 0em rgba(var(--rgb-lightest), 0.2), 2.5em 0em 0 0em rgba(var(--rgb-lightest), 0.5), 1.75em 1.75em 0 0em rgba(var(--rgb-lightest), 0.7), 0em 2.5em 0 0em rgb(var(--rgb-lightest)), -1.8em 1.8em 0 0em rgba(var(--rgb-lightest), 0.2), -2.6em 0em 0 0em rgba(var(--rgb-lightest), 0.2), -1.8em -1.8em 0 0em rgba(var(--rgb-lightest), 0.2);
  }
  62.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(var(--rgb-lightest), 0.2), 1.8em -1.8em 0 0em rgba(var(--rgb-lightest), 0.2), 2.5em 0em 0 0em rgba(var(--rgb-lightest), 0.2), 1.75em 1.75em 0 0em rgba(var(--rgb-lightest), 0.5), 0em 2.5em 0 0em rgba(var(--rgb-lightest), 0.7), -1.8em 1.8em 0 0em rgb(var(--rgb-lightest)), -2.6em 0em 0 0em rgba(var(--rgb-lightest), 0.2), -1.8em -1.8em 0 0em rgba(var(--rgb-lightest), 0.2);
  }
  75% {
    box-shadow: 0em -2.6em 0em 0em rgba(var(--rgb-lightest), 0.2), 1.8em -1.8em 0 0em rgba(var(--rgb-lightest), 0.2), 2.5em 0em 0 0em rgba(var(--rgb-lightest), 0.2), 1.75em 1.75em 0 0em rgba(var(--rgb-lightest), 0.2), 0em 2.5em 0 0em rgba(var(--rgb-lightest), 0.5), -1.8em 1.8em 0 0em rgba(var(--rgb-lightest), 0.7), -2.6em 0em 0 0em rgb(var(--rgb-lightest)), -1.8em -1.8em 0 0em rgba(var(--rgb-lightest), 0.2);
  }
  87.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(var(--rgb-lightest), 0.2), 1.8em -1.8em 0 0em rgba(var(--rgb-lightest), 0.2), 2.5em 0em 0 0em rgba(var(--rgb-lightest), 0.2), 1.75em 1.75em 0 0em rgba(var(--rgb-lightest), 0.2), 0em 2.5em 0 0em rgba(var(--rgb-lightest), 0.2), -1.8em 1.8em 0 0em rgba(var(--rgb-lightest), 0.5), -2.6em 0em 0 0em rgba(var(--rgb-lightest), 0.7), -1.8em -1.8em 0 0em rgb(var(--rgb-lightest));
  }
}
/* Loaders end */
/* Profile avatar change styles start */
/* Cropper Styles Start */
@media screen and (max-width: 992px) {
  .image-editor .wrapper {
    flex-direction: column;
  }
  .wrapper .editor-panel {
    width: 100% !important;
  }
  .wrapper .preview-img {
    width: 100% !important;
    margin: 0 0 15px !important;
  }
}
@media screen and (max-width: 575px) {
  .controls button {
    width: 100%;
    margin-bottom: 10px;
  }
  .controls .row {
    width: 100%;
  }
  .controls .row .save-img {
    margin-left: 0;
  }
}
.cropper-view-box {
  direction: ltr !important;
}

.disable .editor-panel button {
  pointer-events: none !important;
}

.image-editor.disable :where(.editor-panel,
.reset-filter,
.save-img) {
  opacity: 0.6 !important;
  pointer-events: none !important;
}

.image-editor h2 {
  margin-top: -8px;
  font-size: 22px;
  font-weight: 500;
}

.image-editor .wrapper {
  display: flex;
  margin: 16px 0;
  min-height: 335px;
}

.wrapper .editor-panel {
  padding: 15px 20px;
  min-width: 280px;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border: 1px solid rgba(var(--rgb-darkest), 0.1);
}

.editor-panel .title {
  display: block;
  font-size: 16px;
  margin-bottom: 12px;
  color: rgb(var(--rgb-light-dark));
}

.editor-panel .option,
.controls {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.editor-panel button {
  outline: none;
  height: 40px;
  font-size: 12px;
  color: rgb(var(--rgb-third-dark));
  background: rgb(var(--rgb-ninth-lighter));
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  margin-bottom: 8px;
  border: 1px solid rgb(var(--rgb-third-dark));
}

.editor-panel .filter button {
  width: calc(50% - 4px);
  cursor: pointer;
}

.editor-panel .filter button.active {
  color: rgb(var(--rgb-lightest));
  background: rgb(var(--rgb-third-dark));
  border-color: rgb(var(--rgb-third-dark));
}

.editor-panel .filter .slider {
  margin-top: 12px;
}

.editor-panel .filter .slider .filter-info {
  display: flex;
  color: rgb(var(--rgb-light-dark));
  font-size: 14px;
  justify-content: space-between;
}

.editor-panel .filter .slider input {
  width: 100%;
  height: 5px;
  accent-color: rgb(var(--rgb-third-dark));
}

.editor-panel .rotate {
  margin-top: 17px;
}

.editor-panel .rotate button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(25% - 3px);
}

.editor-panel .rotate .option button:nth-child(3),
.editor-panel .rotate .option button:nth-child(4) {
  font-size: 18px;
}

.wrapper {
  display: flex;
  gap: 16px;
}
.wrapper .preview-img {
  flex-grow: 1;
  display: flex;
  overflow: hidden;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  align-items: center;
  justify-content: center;
}
.wrapper .preview-img img, .wrapper .preview-img svg {
  max-width: 100%;
  width: 100%;
  height: 100%;
  max-height: 336px;
  object-fit: contain;
}

.controls {
  gap: 8px;
  align-items: center;
}
.controls button {
  padding: 11px 20px;
  outline: none;
  border-radius: 6px;
  color: rgb(var(--rgb-lightest));
  cursor: pointer;
  transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
}

.switcher-box {
  z-index: 1000;
}

/* Cropper Styles End */
/* Profile avatar change styles end */
/* Portal node styles start */
.content-box {
  background-color: rgb(var(--rgb-ninth-lighter));
  border-radius: 6px;
  box-shadow: 1px 2px 4px -1px rgba(var(--rgb-darkest), 0.2);
  margin: 16px 0;
  padding: 14px 18px;
  color: rgb(var(--rgb-darkest));
}
.content-box .head {
  border-bottom: 1px solid rgba(var(--rgb-darkest), 0.1);
}
.content-box .head h4 {
  padding: 6px 8px;
  font-weight: bold;
  color: rgb(var(--rgb-darkest));
  font-size: 14px !important;
}

.node-content {
  line-height: 30px;
}
.node-content h2 {
  padding: 8px 0;
}
.node-content small {
  color: rgb(var(--rgb-light-dark));
  font-size: 12px;
  font-weight: 500;
}
.node-content p {
  font-size: 16px;
}
.node-content .head-details {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  border-bottom: 1px solid rgba(var(--rgb-darkest), 0.1);
  padding-bottom: 8px;
  margin-bottom: 8px;
}

aside ul.side-nav {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 4px 0;
}
aside ul.side-nav li {
  display: flex;
  flex-direction: column;
  border-radius: 10px;
}
aside ul.side-nav li.active {
  background-color: rgb(var(--rgb-first-lighter));
}
aside ul.side-nav li:not(:nth-last-of-type(1)) a::before {
  content: "";
  width: calc(100% - 24px);
  height: 0.5px;
  background-color: rgba(var(--rgb-darkest), 0.1);
  position: absolute;
  transform: translateX(-50%);
  bottom: -4.3px;
  left: 50%;
}
aside ul.side-nav li a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--portal-text-darken);
  padding: 12px 16px;
  border-radius: 10px;
  font-size: 14px;
  position: relative;
  transition: all 200ms;
}
aside ul.side-nav li a:hover {
  background-color: rgb(var(--rgb-darkest), 0.05);
}
aside ul.side-nav li a > span:not(:empty) {
  min-width: 22px;
  width: auto;
  padding: 4px 6px;
  height: 22px;
  border-radius: 12px;
  font-size: 12px;
  background-color: rgb(var(--rgb-seventh));
  color: rgb(var(--rgb-lightest));
  text-align: center;
}
aside ul.side-nav li a.node-item {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
  height: 90px;
}
aside ul.side-nav li a.node-item h6 {
  font-size: 16px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
aside ul.side-nav li a.node-item img, aside ul.side-nav li a.node-item svg {
  width: 70px;
  height: 70px;
  border-radius: 8px;
  object-fit: cover;
}
aside ul.tag-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin: 8px 0;
}
aside ul.tag-list li a {
  border: 1px solid rgb(var(--rgb-seventh));
  border-radius: 10px;
  color: rgb(var(--rgb-seventh));
  padding: 2px 16px;
  font-size: 10px;
}
aside ul.tag-list li a:hover {
  color: rgb(var(--rgb-lightest));
  background-color: rgb(var(--rgb-seventh));
}

/* Portal node styles end */
.mce-container {
  width: 100%;
}

.text-end {
  direction: ltr !important;
}

.text-right {
  text-align: right !important;
}

.text-left {
  text-align: left !important;
}

.w-calc-3 {
  width: 33.3333333333%;
}

.text-align-left {
  text-align: left;
}

.payment_select_items ul {
  gap: 8px;
}
.payment_select_items ul li:hover a {
  background-color: rgba(var(--rgb-first-lighter), 0.7);
}
.payment_select_items ul li a {
  padding: 12px 16px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  box-shadow: -1px 1px 12px 0 rgba(var(--rgb-darkest), 0.09);
  border-radius: 8px;
  gap: 8px;
  color: rgb(var(--rgb-first-dark));
  transition: all 150ms;
  background-color: rgba(var(--rgb-first-lighter));
  border: 1.4px solid transparent;
}
.payment_select_items ul li a i {
  font-size: 30px;
  color: rgb(var(--rgb-first-dark));
}

body.dark .payment_select_items ul li a, body.faragard-dark .payment_select_items ul li a {
  color: rgb(var(--rgb-dark));
}
body.dark .payment_select_items ul li a i, body.faragard-dark .payment_select_items ul li a i {
  color: rgb(var(--rgb-dark));
}

.body-content {
  height: 100dvh;
  overflow-y: auto;
  overflow-x: hidden;
}

.field-wrapper {
  grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)) !important;
}
.field-wrapper-one-col {
  grid-template-columns: 1fr !important;
}

/* Timeline styles start */
#timeline {
  width: 400px;
}

.vis-timeline {
  border: 0.5px solid rgb(var(--rgb-darkest), 0.1);
  border-radius: 8px;
  font-size: 10px;
}

.vis-panel.vis-bottom,
.vis-panel.vis-center,
.vis-panel.vis-left,
.vis-panel.vis-right,
.vis-panel.vis-top {
  border: 0.5px solid rgb(var(--rgb-darkest), 0.1);
}

.timeline-wrapper {
  position: relative;
}

.cursor-line {
  position: absolute;
  width: 0;
  height: 100%;
  top: 0;
  z-index: 1;
  pointer-events: none;
  outline: 1px solid rgb(var(--rgb-first));
}

.timeline-wrapper {
  position: relative;
  overflow: hidden;
  padding: 0;
  border-radius: 7px;
}

.vis-context-menu {
  width: 180px;
  height: auto;
  display: block;
  background-color: rgb(var(--rgb-ninth-lighter));
  box-shadow: 0 0 8px 0 rgba(var(--rgb-darkest), 0.1);
  border-radius: 8px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100000;
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
}
.vis-context-menu ul {
  display: flex;
  flex-direction: column;
}
.vis-context-menu ul li {
  cursor: pointer;
  display: flex;
  width: 100%;
  padding: 8px 16px;
  font-size: 13px;
  color: rgb(var(--rgb-darkest));
}
.vis-context-menu ul li:not(:nth-last-of-type(1)) {
  border-bottom: 1px solid rgba(var(--rgb-darkest), 0.06);
}
.vis-context-menu ul li:hover {
  background-color: rgb(var(--rgb-darkest), 0.02);
}
.vis-context-menu.show {
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
}

.vis-labelset {
  display: flex;
  flex-direction: column;
}
.vis-labelset .vis-label {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 120px;
}
.vis-labelset .vis-label.draggable {
  cursor: move;
}
.vis-labelset .vis-label .vis-inner {
  text-align: center;
}

.vis-group-is-dragging {
  background-color: rgb(var(--rgb-seventh), 0.1);
}

.range-handler-container {
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  pointer-events: none;
  overflow: hidden;
}

.start-range-handler {
  top: 0;
  width: 0;
  background-color: rgb(var(--rgb-seventh-dark), 0.1);
  pointer-events: none;
  right: 0;
  position: absolute;
  height: 100%;
  z-index: 1000;
}
.start-range-handler-content {
  pointer-events: auto;
  position: relative;
  width: 0;
  height: 100%;
  background-color: transparent;
  cursor: ew-resize;
  margin-right: auto;
}
.start-range-handler-content::before {
  content: "\f7a5";
  font-family: "Font Awesome 5 Pro";
  position: absolute;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  width: 12px;
  height: 26px;
  font-size: 14px;
  color: rgb(var(--rgb-lightest));
  background-color: rgb(var(--rgb-seventh-dark));
  border-radius: 4px;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 2px;
}

.end-range-handler {
  top: 0;
  width: 0;
  background-color: rgb(var(--rgb-seventh-dark), 0.1);
  pointer-events: none;
  left: 0;
  position: absolute;
  height: 100%;
  z-index: 1000;
}
.end-range-handler-content {
  pointer-events: auto;
  position: relative;
  width: 0;
  height: 100%;
  background-color: transparent;
  cursor: ew-resize;
  margin-left: auto;
}
.end-range-handler-content::before {
  content: "\f7a5";
  font-family: "Font Awesome 5 Pro";
  position: absolute;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  width: 12px;
  height: 26px;
  font-size: 14px;
  color: rgb(var(--rgb-lightest));
  background-color: rgb(var(--rgb-seventh-dark));
  border-radius: 4px;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 2px;
}

.vis-item {
  background-color: rgb(var(--rgb-first-lighter));
  border-color: rgb(var(--rgb-first-light));
  color: rgb(var(--rgb-darker));
}
.vis-item.vis-selected {
  background-color: rgb(var(--rgb-second-light)) !important;
  border-color: rgb(var(--rgb-second)) !important;
}

.vis-text, .vis-label {
  color: rgb(var(--rgb-light-dark)) !important;
}

.vis-grid {
  border-color: rgb(var(--rgb-darkest), 0.2) !important;
}

.vis-foreground .vis-group, .vis-labelset .vis-label {
  border-color: rgb(var(--rgb-darkest), 0.2) !important;
}

/* Timeline styles end */
/* map grid layers start */
.grid-layer-wrapper {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  grid-gap: 16px;
  gap: 16px;
  width: 100%;
  padding: 0 8px;
}
.grid-layer-item {
  background-color: rgb(var(--rgb-first-lighter));
  border-radius: 8px;
  cursor: pointer;
  display: flex;
  align-items: center;
  padding: 8px 10px;
  gap: 8px;
  color: rgb(var(--rgb-light-dark));
  font-size: 14px;
  transition: all 150ms;
  position: relative;
  overflow: hidden;
}
.grid-layer-item:hover {
  background-color: rgba(var(--rgb-first-lighter), 0.7);
}
.grid-layer-item.active {
  border-right: 5px solid rgb(var(--rgb-first));
  box-shadow: 0 0 8px 0 rgba(var(--rgb-darkest), 0.1);
}
html[dir=ltr] .grid-layer-item.active {
  border-left: 5px solid rgb(var(--rgb-first));
  border-right: none;
}

.grid-layer-item::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
  background: repeating-linear-gradient(-60deg, transparent 0%, transparent 1%, rgb(var(--rgb-first-light), 0.3) 1%, rgb(var(--rgb-first-light), 0.3) 2%);
  animation: loading 14s linear infinite;
  background-size: 500% 500%;
  transition: opacity 200ms;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.grid-layer-item * {
  z-index: 2;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.grid-layer-item.is-loading::before {
  opacity: 1;
  visibility: visible;
}
@keyframes loading {
  0% {
    background-position: 0 50%;
  }
  100% {
    background-position: 100% 50%;
  }
}
.grid-layer-img {
  width: 38px;
  height: 38px;
}
.grid-layer-img img, .grid-layer-img svg {
  width: 100%;
  max-width: 100%;
  height: 100%;
  border-radius: 6px;
}

/* map grid layers end */
/* Leaflet start */
.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
  background: rgb(var(--rgb-tenth-lighter));
  color: rgb(var(--rgb-light-dark));
  box-shadow: 0 3px 14px rgba(var(--rgb-darkest), 0.2);
}

.leaflet-container {
  background-color: rgb(var(--rgb-tenth-lighter));
}
.leaflet-container a.leaflet-popup-close-button {
  top: 4px;
  right: 4px;
  color: rgb(var(--rgb-light-dark));
}
.leaflet-container a.leaflet-popup-close-button:hover {
  color: rgb(var(--rgb-red-500));
}

/* Leaflet end */
/* Plate box Styles Start */
.plate-box {
  max-width: 320px;
  height: 65px;
  border-radius: 12px;
  font-size: 24px;
  background-color: rgb(var(--rgb-ninth-lighter));
  border: 1px solid rgb(var(--rgb-light));
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.06);
  padding: 3px;
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-evenly;
  align-items: center;
  font-weight: 650;
  line-height: 24px;
  color: #222;
}

.plate-box-img {
  width: 36px;
  background-color: #01286d;
  border-radius: 8px 4px 4px 8px;
  margin-right: 8px;
  height: 100%;
  display: flex;
  align-content: center;
  justify-content: center;
}
html[dir=ltr] .plate-box-img {
  margin-left: 8px;
  margin-right: 0;
  border-radius: 4px 8px 8px 4px;
}

.plate-box-input {
  width: 40px;
  text-align: center;
  outline: none;
  height: 32px;
  opacity: 1;
  line-height: 32px;
  font-size: 18px !important;
  color: rgb(var(--rgb-light-dark)) !important;
  background-color: transparent;
}
.plate-box-input-lg {
  width: 70px !important;
}

.plate-box-char {
  width: 56px;
  height: 32px;
}

.plate-box-empty {
  height: 32px !important;
}

.plate-box-vertical-separator {
  height: 32px;
  border-right: 1px solid hsla(0, 0%, 52.2%, 0.50196);
  margin-right: 4px;
  margin-left: 4px;
}

.plate-box-city-code {
  width: 40px;
}

.plate-alpha {
  min-width: 40px;
  width: fit-content;
  height: 40px;
  line-height: 40px;
  background-color: rgb(var(--rgb-ninth-lighter));
  border: 1px solid rgb(var(--rgb-light));
  color: rgb(var(--rgb-light-dark)) !important;
  border-radius: 12px;
  margin: 4px;
  font-size: 16px;
  font-weight: 650;
  text-align: center;
}

/* Plate box Styles End */
/* Token input override start */
html[dir=ltr] ul.token-input-list li {
  direction: ltr !important;
  text-align: left;
}

/* Token input override end */
/* Fontawesome override icons start */
html[dir=ltr] .fa-chevron-right:before {
  content: "\f053";
}
html[dir=ltr] .fa-chevron-left:before {
  content: "\f054";
}
html[dir=ltr] .fa-arrow-right:before {
  content: "\f060";
}
html[dir=ltr] .fa-arrow-left:before {
  content: "\f061";
}
html[dir=ltr] .fa-step-forward:before {
  content: "\f048";
}

/* Fontawesome override icons end */
/* Select language start */
.lang-select {
  font-size: 12px;
  position: relative;
}
.lang-select img, .lang-select svg {
  width: 24px !important;
  height: 24px !important;
  user-select: none;
  min-width: fit-content;
}
.lang-select-sm img, .lang-select-sm svg {
  width: 14px !important;
  height: 14px !important;
}
.lang-select-input {
  border-radius: 12px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  cursor: pointer;
  background-color: rgb(Var(--rgb-ninth-lighter));
}
.lang-select-input::before {
  content: "\f0d7";
  color: rgb(var(--rgb-darkest));
  font-family: "Fontawesome";
  transition: all 200ms;
}
.lang-select-text {
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  direction: ltr;
  color: rgb(var(--rgb-darkest));
  user-select: none;
}
.lang-select.show .lang-select-input::before {
  rotate: 180deg;
}
.lang-select.show .lang-select-dropdown {
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
  transform: translate(-50%, 0);
}
.lang-select-dropdown {
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  position: absolute;
  top: calc(100% + 8px);
  left: 50%;
  width: max-content;
  background-color: rgb(var(--rgb-ninth-lighter));
  box-shadow: 0 -5px 12px 0 rgba(var(--rgb-darkest), 0.15);
  display: flex;
  flex-direction: column;
  height: auto;
  padding: 6px;
  border-radius: 12px;
  transform: translate(-50%, -6px);
  transition: all 300ms;
  z-index: 9998;
  user-select: none;
}
.lang-select-dropdown::before {
  content: "";
  border: 8px solid transparent;
  border-bottom-color: rgb(var(--rgb-ninth-lighter));
  position: absolute;
  top: -14px;
  left: 50%;
  transform: translateX(-50%);
}
.lang-select-dropdown.dropup {
  transform: translate(-50%, 6px);
  bottom: calc(100% + 8px);
  top: auto;
  box-shadow: 0 5px 12px 0 rgba(var(--rgb-darkest), 0.15);
}
.lang-select-dropdown.dropup::before {
  border-bottom-color: transparent;
  border-top-color: rgb(var(--rgb-ninth-lighter));
  bottom: -14px;
  top: auto;
  left: 50%;
  transform: translateX(-50%);
}
.lang-select-dropdown-item {
  display: flex;
  align-items: center;
  justify-content: end;
  border-radius: 8px;
  gap: 8px;
  cursor: pointer;
  padding: 4px 6px;
  transition: all 300ms;
  font-size: 11px;
  min-width: 36px;
}
.lang-select-dropdown-item.active {
  background-color: rgb(var(--rgb-darkest), 0.07);
}
.lang-select-dropdown-item:hover {
  background-color: rgb(var(--rgb-darkest), 0.05);
}

aside.sidebar:not(.show) .lang-select-text {
  max-width: 2.49ch;
}

/* Select language end */
.btn-deff {
  background: rgb(var(--rgb-lighter));
  color: rgb(var(--rgb-darkest));
  border: 1px solid rgb(var(--rgb-light));
  height: 40px;
  gap: 6px;
  opacity: 1;
}
.btn-deff:hover {
  opacity: 0.5;
}

.widget_item[disabled] {
  opacity: 0.2;
  filter: alpha(opacity=20);
}

.sort {
  cursor: pointer !important;
}
.sort-asc::after {
  content: "\f0d7";
  font-family: FontAwesome;
  font-weight: 900;
  font-size: 16px;
  margin-right: 6px;
}
.sort-desc::after {
  content: "\f0d8";
  font-family: FontAwesome;
  font-weight: 900;
  font-size: 16px;
  margin-right: 6px;
}

.shp-breadcrumb ul {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.shp-breadcrumb ul li {
  text-wrap: nowrap;
}
.shp-breadcrumb ul li:not(:nth-of-type(1))::before {
  content: "/";
  color: rgb(var(--rgb-light-dark));
  font-size: 12px;
}
.shp-breadcrumb ul li a {
  padding: 4px 3px;
  font-size: 13px;
  color: rgb(var(--rgb-light-dark));
  text-wrap: nowrap;
}
.shp-breadcrumb-chevron ul li {
  color: rgb(var(--rgb-light-dark));
}
.shp-breadcrumb-chevron ul li:not(:nth-of-type(1))::before {
  content: "\f104";
  font-family: Fontawesome;
  font-size: 12px;
}
.shp-breadcrumb-chevron ul li:nth-last-of-type(1) {
  color: rgb(var(--rgb-darker));
}
.shp-breadcrumb-chevron ul li:nth-last-of-type(1) a {
  color: rgb(var(--rgb-darker));
}
.shp-img-checkbox {
  position: absolute;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.shp-img-checkbox:checked + .shp-img-checkbox-label {
  border-color: rgb(var(--rgb-second));
}
.shp-img-checkbox-label {
  width: 54px;
  height: 54px;
  border-radius: 12px;
  cursor: pointer;
  border: 5px solid transparent;
  outline: 1px solid rgb(var(--rgb-light));
  overflow: hidden;
  padding: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.shp-img-checkbox-label * {
  border-radius: 8px;
  background-repeat: no-repeat;
  background-size: contain;
}
.shp-figure {
  margin: auto;
  overflow: hidden;
  position: relative;
  border-radius: 6px;
  width: fit-content;
}
.shp-figure-second {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
  transition: opacity 400ms ease;
  width: 100%;
  height: 100%;
}
.shp-figure-img {
  width: 220px !important;
}
.shp-figure-status {
  border-radius: 8px;
  outline: 1px solid rgb(var(--rgb-slate-500));
  position: relative;
  margin: 0;
}
.shp-figure-status::before {
  content: "\f071";
  background-color: rgb(var(--rgb-slate-500));
  width: 36px;
  height: 36px;
  font-size: 18px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  font-family: "Font Awesome 5 Pro";
  color: rgb(var(--rgb-lightest));
  display: grid;
  place-items: center;
  opacity: 0.9;
}
.shp-figure-status.error {
  content: "\f071";
  outline-color: rgb(var(--rgb-red-500));
}
.shp-figure-status.error::before {
  background-color: rgb(var(--rgb-red-500));
}
.shp-figure-status.success {
  outline-color: rgb(var(--rgb-green-500));
}
.shp-figure-status.success::before {
  content: "\f00c";
  background-color: rgb(var(--rgb-green-500));
}
.shp-figure-status.warning {
  content: "\f071";
  outline-color: rgb(var(--rgb-red-500));
}
.shp-figure-status.warning::before {
  background-color: rgb(var(--rgb-red-500));
}
.shp-main-widget {
  background-color: rgb(var(--rgb-ninth-lighter));
  padding: 16px;
}
.shp-main-widget:not(.shp-main-widget-no-radius-md) {
  border: 1px solid rgb(var(--rgb-light));
  border-radius: 16px;
}
@media only screen and (min-width: 992px) {
  .shp-main-widget-no-radius-md {
    border: 1px solid rgb(var(--rgb-light));
    border-radius: 16px;
  }
}
.shp-main-widget-brand {
  display: flex;
  justify-content: center;
}
.shp-main-widget-brand:not(:nth-last-of-type(1)) {
  border-left: 1px solid rgb(var(--rgb-light));
}
html[dir=ltr] .shp-main-widget-brand:not(:nth-last-of-type(1)) {
  border-right: 1px solid rgb(var(--rgb-light));
  border-left: none;
}

@media only screen and (max-width: 575px) {
  .shp-main-widget-brand.no-border-sm {
    border: none !important;
  }
}
.shp-main-widget-brand img, .shp-main-widget-brand svg {
  width: 160px;
  height: 120px;
  max-width: 100%;
  object-fit: contain;
}
.shp-main-widget-sm {
  width: 100%;
  max-width: 100%;
}
@media only screen and (min-width: 575px) {
  .shp-main-widget-sm {
    max-width: 400px;
  }
}
.shp-main-widget .accordion-item {
  background-color: transparent !important;
}
.shp-main-widget .accordion-button {
  background-color: transparent !important;
}
.shp-main-widget .accordion-button:not(.collapsed) {
  background-color: transparent;
  color: rgb(var(--rgb-darkest));
}
.shp-main-item-options {
  position: absolute;
  top: 12px;
  left: 12px;
  background-color: rgb(var(--rgb-ninth-lighter));
  box-shadow: 1px 1px 2px 1px rgba(var(--rgb-darkest), 0.1);
  display: flex;
  flex-direction: column;
  border-radius: 12px;
  transition: all 300ms ease-in-out;
  z-index: 100;
  transform: scale(0.9);
}
html[dir=ltr] .shp-main-item-options {
  right: 12px;
  left: auto;
}

@media only screen and (min-width: 767px) {
  .shp-main-item-options {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateX(-24px);
  }
}
.shp-main-item-options-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 36px;
  height: 36px;
  font-size: 16px;
  transition: all 200ms;
  color: rgb(var(--rgb-darker));
}
.shp-main-item-options-btn:hover i {
  opacity: 0.6;
}
.shp-main-slider {
  width: 100%;
  padding: 0;
  height: 190px;
}
@media only screen and (min-width: 767px) {
  .shp-main-slider {
    height: 240px;
  }
}
@media only screen and (min-width: 1200px) {
  .shp-main-slider {
    height: 400px;
  }
}
.shp-main-slider .swiper-button-prev, .shp-main-slider .swiper-button-next {
  position: absolute;
  top: auto;
  bottom: 10%;
}
.shp-main-slider .swiper-button-prev {
  right: 32px;
}
html[dir=ltr] .shp-main-slider .swiper-button-prev {
  left: 32px;
  right: auto;
}

.shp-main-slider .swiper-button-next {
  right: 80px;
}
html[dir=ltr] .shp-main-slider .swiper-button-next {
  left: 80px;
  right: auto;
}

.shp-main-special-slider {
  background: linear-gradient(to right, rgb(var(--rgb-first-light)), rgb(var(--rgb-first)));
  width: 100%;
  border-radius: 16px;
  display: flex;
  padding: 16px 2px;
}
html[dir=ltr] .shp-main-special-slider {
  background: linear-gradient(to left, rgb(var(--rgb-first-light)), rgb(var(--rgb-first)));
}

@media only screen and (max-width: 575px) {
  .shp-main-special-slider {
    border-radius: 0;
  }
}
.shp-main-special-slider-images {
  width: 200px;
  height: 100%;
  flex-direction: column;
}
.shp-main-special-slider-images img.textImage, .shp-main-special-slider-images svg.textImage {
  width: 80px;
}
.shp-main-special-slider-images img.image, .shp-main-special-slider-images svg.image {
  width: 130px;
}
.shp-main-special-slider-item {
  overflow: hidden;
  width: 184px;
  height: 100%;
  background: rgb(var(--rgb-ninth-lighter));
  padding: 12px;
}
.shp-main-special-slider-item:nth-of-type(1) {
  border-radius: 0 8px 8px 0;
}
html[dir=ltr] .shp-main-special-slider-item:nth-of-type(1) {
  border-radius: 8px 0 0 8px;
}

.shp-main-special-slider-item:nth-last-of-type(1) {
  border-radius: 8px 0 0 8px;
}
@media only screen and (min-width: 767px) {
  .shp-main-special-slider-item:hover .shp-main-item-options {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(0);
  }
}
.shp-main-special-slider-item:hover .shp-figure-second {
  opacity: 1;
}
.shp-main-special-slider-item .box-left-corner {
  position: absolute;
  top: 12px;
  right: 16px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  z-index: 10;
}
html[dir=ltr] .shp-main-special-slider-item .box-left-corner {
  left: 16px;
  right: auto;
}

.shp-main-special-slider-item-box {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
}
.shp-main-special-slider-item-box img, .shp-main-special-slider-item-box svg {
  width: 330px;
  height: 150px;
  object-fit: cover;
  display: flex;
  max-width: 100%;
}
.shp-slider-btn {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background-color: rgb(var(--rgb-lighter)) !important;
  border: 1px solid rgb(var(--rgb-light)) !important;
  color: rgb(var(--rgb-light-dark)) !important;
  font-size: 13px;
  box-shadow: 0 1px 2px 1px rgba(var(--rgb-darkest), 0.1);
}
.shp-slider-btn.swiper-button-disabled {
  opacity: 0;
  visibility: hidden;
}
.shp-slider-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
}
.shp-slider-pagination .swiper-pagination-bullet {
  width: 4px;
  height: 4px;
  border-radius: 4px;
  transition: width 400ms;
}
.shp-slider-pagination .swiper-pagination-bullet-active {
  width: 16px;
  height: 6px;
  background-color: rgb(var(--rgb-ninth-lighter));
}
.shp-slider-product-list-gallery {
  padding: 4px 0;
}
.shp-slider-product-list-gallery-video {
  position: relative;
  border: none;
}
.shp-slider-product-list-gallery-video::before {
  position: absolute;
  top: 0;
  left: 0;
  content: "\f144";
  font-family: "Font Awesome 6 Pro";
  font-size: 22px;
  width: 100%;
  height: 100%;
  background-color: rgb(var(--rgb-darkest), 0.8);
  text-align: center;
  line-height: 60.5px;
  border-radius: 8px;
  color: rgb(var(--rgb-light));
}
.shp-slider-product-list-gallery .swiper-slide {
  background-color: rgb(var(--rgb-ninth-lighter));
  border: 1px solid rgb(var(--rgb-light));
  border-radius: 10px;
  cursor: pointer;
  transition: all 100ms;
  width: 64px;
  min-width: 64px;
  max-width: 64px;
  height: 64px;
}
.shp-slider-product-list-gallery .swiper-slide img, .shp-slider-product-list-gallery .swiper-slide video, .shp-slider-product-list-gallery .swiper-slide svg {
  width: 100%;
  height: 100%;
  max-width: 100%;
  object-fit: cover;
  border-radius: 8px;
  padding: 3px;
}
.shp-slider-product-list-gallery .swiper-slide.swiper-slide-thumb-active {
  border-color: rgb(var(--rgb-second));
  border-width: 2px;
}
.shp-slider-product-main-gallery {
  height: 70vh;
  padding: 4px 0;
}
.shp-slider-product-main-gallery .swiper-slide {
  background-color: rgb(var(--rgb-ninth-lighter));
  border-radius: 8px;
  cursor: pointer;
  height: 70vh;
}
.shp-slider-product-main-gallery .swiper-slide img, .shp-slider-product-main-gallery .swiper-slide video, .shp-slider-product-main-gallery .swiper-slide svg {
  width: 100%;
  height: 100%;
  max-width: 100%;
  object-fit: contain;
  border-radius: 8px;
}
.shp-product-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  height: 88px;
  overflow: hidden;
}
@media only screen and (min-width: 767px) {
  .shp-product-list {
    grid-template-columns: repeat(5, 1fr);
  }
}
@media only screen and (min-width: 992px) {
  .shp-product-list {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media only screen and (min-width: 1200px) {
  .shp-product-list {
    grid-template-columns: repeat(5, 1fr);
  }
}
.shp-product-list img, .shp-product-list video, .shp-product-list svg {
  width: 100%;
  height: 100%;
  max-width: 100%;
  object-fit: cover;
  border-radius: 8px;
}
.shp-product-list-item {
  height: 88px;
  background-color: rgb(var(--rgb-ninth-lighter));
  border: 1px solid rgb(var(--rgb-light));
  padding: 3px;
  border-radius: 8px;
  cursor: pointer;
}
.shp-product-list-item-video {
  position: relative;
  border: none;
}
.shp-product-list-item-video::before {
  position: absolute;
  top: 0;
  left: 0;
  content: "\f144";
  font-family: "Font Awesome 6 Pro";
  font-size: 22px;
  width: 100%;
  height: 100%;
  background-color: rgb(var(--rgb-ninth-lighter), 0.9);
  text-align: center;
  line-height: 88px;
  border: 1px solid rgb(var(--rgb-light));
  border-radius: 8px;
  color: rgb(var(--rgb-light-dark));
}
@media only screen and (max-width: 767px) {
  .shp-product-list-item:nth-of-type(4) {
    position: relative;
    border: none;
  }
  .shp-product-list-item:nth-of-type(4)::before {
    position: absolute;
    top: 0;
    left: 0;
    content: "\f141";
    font-family: "Font Awesome 6 Pro";
    font-size: 22px;
    width: 100%;
    height: 100%;
    background-color: rgb(var(--rgb-ninth-lighter), 0.9);
    text-align: center;
    line-height: 88px;
    border: 1px solid rgb(var(--rgb-light));
    border-radius: 8px;
    color: rgb(var(--rgb-light-dark));
  }
}
@media only screen and (min-width: 767px) and (max-width: 992px) {
  .shp-product-list-item:nth-of-type(5) {
    position: relative;
    border: none;
  }
  .shp-product-list-item:nth-of-type(5)::before {
    position: absolute;
    top: 0;
    left: 0;
    content: "\f141";
    font-family: "Font Awesome 6 Pro";
    font-size: 22px;
    width: 100%;
    height: 100%;
    background-color: rgb(var(--rgb-ninth-lighter), 0.9);
    text-align: center;
    line-height: 88px;
    border: 1px solid rgb(var(--rgb-light));
    border-radius: 8px;
    color: rgb(var(--rgb-light-dark));
  }
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .shp-product-list-item:nth-of-type(4) {
    position: relative;
    border: none;
  }
  .shp-product-list-item:nth-of-type(4)::before {
    position: absolute;
    top: 0;
    left: 0;
    content: "\f141";
    font-family: "Font Awesome 6 Pro";
    font-size: 22px;
    width: 100%;
    height: 100%;
    background-color: rgb(var(--rgb-ninth-lighter), 0.9);
    text-align: center;
    line-height: 88px;
    border: 1px solid rgb(var(--rgb-light));
    border-radius: 8px;
    color: rgb(var(--rgb-light-dark));
  }
}
@media only screen and (min-width: 1200px) {
  .shp-product-list-item:nth-of-type(5) {
    position: relative;
    border: none;
  }
  .shp-product-list-item:nth-of-type(5)::before {
    position: absolute;
    top: 0;
    left: 0;
    content: "\f141";
    font-family: Fontawesome;
    font-size: 22px;
    width: 100%;
    height: 100%;
    background-color: rgb(var(--rgb-ninth-lighter), 0.9);
    text-align: center;
    line-height: 88px;
    border: 1px solid rgb(var(--rgb-light));
    border-radius: 8px;
    color: rgb(var(--rgb-light-dark));
  }
}
.shp-product-list-thumb {
  width: 100px;
  min-width: 100px;
  max-width: 100px;
  height: 100px;
  border-radius: 8px;
}
.shp-product-list-thumb img, .shp-product-list-thumb video, .shp-product-list-thumb svg {
  border-radius: 8px;
}
.shp-tooltip {
  position: relative;
}
.shp-tooltip:hover .shp-tooltip-content {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.shp-tooltip-content {
  max-width: 280px;
  position: absolute;
  display: block;
  text-wrap: wrap;
  width: max-content;
  line-height: 24px;
  top: 100%;
  left: 50%;
  background-color: rgb(var(--rgb-dark));
  color: rgb(var(--rgb-ninth-lighter));
  padding: 9px 16px;
  border-radius: 12px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateX(-50%) translateY(4px);
  font-weight: 500;
  font-size: 12px;
  z-index: 2700;
  transition: all 200ms;
  text-align: center;
}
.shp-tooltip-content.to-right {
  right: auto;
  left: 100%;
  top: 50%;
  transform: translateY(-50%) translateX(4px);
}
html[dir=ltr] .shp-tooltip-content.to-right {
  left: auto;
  right: 100%;
}

.shp-tooltip-content.to-top {
  right: auto;
  left: 50%;
  top: auto !important;
  bottom: 100%;
  transform: translateX(-50%) translateY(-4px);
}
html[dir=ltr] .shp-tooltip-content.to-top {
  left: auto;
  right: 100%;
}

.shp-tooltip-content.to-left {
  left: auto;
  right: 100%;
  top: 50%;
  transform: translateY(-50%) translateX(4px);
}
html[dir=ltr] .shp-tooltip-content.to-left {
  right: auto;
  left: 100%;
}

.shp-tooltip-content-sm {
  max-width: 160px;
}
.shp-product-sidebar {
  border: 1px solid rgb(var(--rgb-light));
  background-color: rgb(var(--rgb-lighter));
  padding: 16px;
  border-radius: 12px;
}
.shp-product-sidebar-seller-details {
  position: relative;
  display: flex;
  flex-direction: column;
}
.shp-product-sidebar-seller-details:hover .shp-product-sidebar-seller-details-hover {
  opacity: 1;
  visibility: visible;
}
.shp-product-sidebar-seller-details-hover {
  position: absolute;
  top: 0;
  left: 110%;
  width: 400px;
  height: auto;
  box-shadow: 0 2px 4px 0 rgba(var(--rgb-darkest), 0.1);
  background: rgb(var(--rgb-ninth-lighter));
  border: 1px solid rgb(var(--rgb-light));
  border-radius: 12px;
  padding: 12px 16px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: all 200ms;
}
html[dir=ltr] .shp-product-sidebar-seller-details-hover {
  right: 110%;
  left: auto;
}

.shp-product-sidebar-seller-details-hover .seller_function {
  font-size: 32px;
  font-weight: 900;
  padding: 15px 0;
}
.shp-product-sidebar-seller-details-hover .seller_general_function {
  width: 100%;
}
.shp-product-sidebar-seller-details-hover .seller_general_function .title {
  font-size: 14px;
  font-weight: 900;
}
.shp-product-sidebar-seller-details-hover .seller_general_function .grid_function {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  place-items: center;
  gap: 6px;
  text-align: center;
  margin-bottom: 8px;
}
.shp-product-sidebar-seller-details-hover .seller_general_function .grid_function .item_function {
  font-size: 12px;
  color: rgb(var(--rgb-light-dark));
}
.shp-product-sidebar-seller-details-hover .seller_general_function .grid_function .item_function span {
  font-weight: 700;
  font-size: 16px;
  padding: 15px 0 8px 0;
}
.shp-product-properties {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 8px;
}
.shp-product-properties-item {
  background-color: rgb(var(--rgb-lighter));
  border: 1px solid rgb(var(--rgb-light));
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 500;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.shp-product-counter {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  place-items: center;
  border: 1px solid rgb(var(--rgb-light));
  border-radius: 8px;
  overflow: hidden;
  width: 102px;
  max-width: 102px;
  min-height: 44px;
  max-height: 44px;
}
.shp-product-counter-count {
  display: flex;
  flex-direction: column;
  text-align: center;
  justify-content: center;
  align-items: center;
  color: rgb(var(--rgb-first));
}
.shp-product-counter-btn {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  cursor: pointer;
  color: rgb(var(--rgb-first));
}
.shp-product-nav {
  background: rgb(var(--rgb-ninth-lighter));
  width: 100%;
  transition: all 200ms ease;
}
.shp-product-nav ul {
  border-bottom: 1px solid rgb(var(--rgb-light));
  margin: 0;
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
}
.shp-product-nav ul li {
  list-style: none;
  display: inline-block;
  position: relative;
  text-wrap: nowrap;
}
.shp-product-nav ul li::after, .shp-product-nav ul li button.nav-link::after {
  content: "";
  width: 0;
  background: rgb(var(--rgb-second));
  height: 4px;
  border-radius: 6px 6px 0 0;
  display: block;
  transition: 200ms;
  transform-origin: center;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}
@media only screen and (min-width: 992px) {
  .shp-product-nav ul li.active::after, .shp-product-nav ul li button.nav-link.active::after {
    width: 80% !important;
    margin: auto;
    display: block;
  }
}
.shp-product-nav ul li.active a, .shp-product-nav ul li .nav-link.active {
  color: rgb(var(--rgb-second)) !important;
  transition: 100ms;
}
.shp-product-nav ul li.active a .badge, .shp-product-nav ul li .nav-link.active .badge {
  background-color: rgb(var(--rgb-second));
}
.shp-product-nav ul li a {
  color: rgb(var(--rgb-darkest));
  padding: 12px 16px 10px 16px;
  text-decoration: none;
  display: block;
  font-size: 12px;
  font-weight: 500;
  text-wrap: nowrap;
}
.shp-product-nav ul li .nav-link {
  color: rgb(var(--rgb-light-dark));
}
.shp-product-nav ul li .nav-link:hover, .shp-product-nav ul li .nav-link:active {
  color: rgb(var(--rgb-light-dark));
}
.shp-product-nav ul li .nav-link .badge {
  background-color: rgb(var(--rgb-light-dark));
  color: rgb(var(--rgb-ninth-lighter));
}
.shp-product-nav.stickTop {
  position: sticky;
  top: 76px;
  z-index: 95;
  left: 0;
  display: block;
}
@media only screen and (min-width: 1200px) {
  .shp-product-nav.stickTop {
    top: 120px;
  }
  .shp-product-nav.stickTop.slideUp {
    top: 79px;
  }
}
.shp-product-section {
  padding: 24px 0;
  border-bottom: 4px solid rgb(var(--rgb-light));
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.shp-product-section-title {
  position: relative;
  padding-bottom: 14px;
  font-weight: 500;
  font-size: 16px;
  margin: 12px 0;
}
.shp-product-section-title::after {
  content: "";
  position: absolute;
  top: 100%;
  right: 0;
  width: 70px;
  height: 2px;
  border-radius: 4px;
  background-color: rgb(var(--rgb-second));
}
html[dir=ltr] .shp-product-section-title::after {
  left: 0;
  right: auto;
}

.shp-product-props-nav ul {
  padding: 8px 0;
  display: flex;
  flex-direction: column;
}
.shp-product-props-nav ul li {
  display: flex;
  font-size: 14px;
  line-height: 30px;
  gap: 8px;
}
.shp-product-props-nav ul li span {
  width: 30%;
  color: rgb(var(--rgb-light-dark));
  padding: 8px 0;
}
.shp-product-props-nav ul li ul {
  width: 70%;
  border-bottom: 1px solid rgb(var(--rgb-light));
}
.shp-product-sticky-box {
  transition: all 200ms ease;
}
.shp-product-sticky-box.stickTop {
  position: sticky;
  top: 126px;
  z-index: 90;
  left: 0;
  display: block;
}
@media only screen and (min-width: 1200px) {
  .shp-product-sticky-box.stickTop {
    top: 166px;
  }
  .shp-product-sticky-box.stickTop.slideUp {
    top: 126px;
  }
}
.shp-product-img-slider {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: fit-content;
}
.shp-product-img-slider-thumb {
  width: 280px;
  height: 280px;
  border-radius: 8px;
  object-fit: contain;
  background-color: rgb(var(--rgb-black));
  max-width: 100%;
}
.shp-product-img-slider-play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: rgb(var(--rgb-black), 0.4);
  width: 34px;
  height: 34px;
  border-radius: 50%;
  color: rgb(var(--rgb-lightest));
  font-size: 16px;
  display: grid;
  place-items: center;
}
.shp-product-wrapper {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(176px, 1fr));
  grid-gap: 16px;
}
.shp-product-wrapper-lg {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  grid-gap: 16px;
}
.shp-product-wrapper-horizontal {
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
}
.shp-product-wrapper-horizontal .shp-main-special-slider-item-box {
  flex-direction: row;
  align-items: start;
}
.shp-product-result-item {
  display: flex;
  flex-direction: column;
  font-size: 13px;
  padding: 8px 12px;
}
.shp-product-result-item:not(:nth-last-of-type(1)) {
  border-bottom: 1px solid rgb(var(--rgb-light));
}
.shp-product-result-item:hover .btn-light-dark {
  background-color: rgb(var(--rgb-second)) !important;
  border-color: rgb(var(--rgb-second)) !important;
  color: rgb(var(--rgb-lightest)) !important;
}
.shp-product-result-item:hover .shp-product-result-item-title {
  color: rgb(var(--rgb-second-dark));
  border-color: rgb(var(--rgb-second-dark));
}
.shp-product-result-item-title {
  color: rgb(var(--rgb-light-dark));
  border-bottom: 2px dashed transparent;
  width: fit-content;
}
.shp-product-result-item img, .shp-product-result-item svg {
  width: 100px;
  height: 100px;
  object-fit: contain;
}
.shp-product-upload {
  position: relative;
  padding: 24px 16px;
  display: flex;
  flex-direction: column;
  border: 1px solid rgb(var(--rgb-light));
  border-radius: 8px;
}
.shp-product-upload-title {
  position: absolute;
  background-color: rgb(var(--rgb-ninth-lighter));
  top: -16px;
  right: 16px;
  padding: 6px 8px;
  font-weight: 500;
  color: rgb(var(--rgb-darker));
  font-size: 14px;
}
.shp-product-upload-content {
  border: 2px dashed rgb(var(--rgb-light-dark), 0.5);
  border-radius: 8px;
  padding: 12px 16px;
  background-color: rgb(var(--rgb-light), 0.5);
  cursor: grab;
}
.shp-product-upload-plus {
  padding: 12px;
  font-size: 26px;
  background-color: rgb(var(--rgb-first-lighter));
  color: rgb(var(--rgb-first-darker));
  border-radius: 50%;
  width: fit-content;
  display: flex;
  place-items: center;
}

.accordion {
  --bs-accordion-bg: rgb(var(--rgb-ninth-lighter));
  --bs-accordion-btn-color: rgb(var(--rgb-darkest));
  --bs-accordion-active-bg: rgb(var(--rgb-second-lighter));
  --bs-accordion-active-color: rgb(var(--rgb-darkest));
}
.accordion-item {
  border-left: none;
  border-right: none;
  border-top: none;
}
.accordion-item:focus, .accordion-item:focus-visible {
  box-shadow: none !important;
}
.accordion-item:nth-last-of-type(1) {
  border-bottom: none;
}
.accordion-no-icon::after, .accordion-no-icon::before {
  content: "" !important;
  display: none !important;
}
.accordion-button {
  background: none;
}
.accordion-button:focus, .accordion-button:focus-visible {
  box-shadow: none !important;
}
.accordion-button::after {
  content: "\f078";
  font-family: Fontawesome;
  background-image: none !important;
  font-weight: bold;
  font-size: 14px;
  transform-origin: center;
  display: grid;
  place-items: center;
  position: absolute;
  left: 16px;
}
html[dir=ltr] .accordion-button::after {
  right: 16px;
  left: auto;
}

.accordion-button:not(.collapsed) {
  background-color: transparent;
}
.accordion-body {
  max-height: 360px;
  overflow-y: auto;
  overflow-x: hidden;
}
.accordion-step .accordion-item {
  border: 0;
  position: relative;
  padding-bottom: 24px;
}
.accordion-step .accordion-item:not(:nth-last-of-type(1))::before {
  content: "";
  height: calc(100% - 32px);
  width: 0;
  border-left: 3px dashed rgb(var(--rgb-light));
  position: absolute;
  top: 32px;
  right: 16px;
}
html[dir=ltr] .accordion-step .accordion-item:not(:nth-last-of-type(1))::before {
  left: 16px;
  right: auto;
}

.accordion-step .accordion-item.disabled {
  pointer-events: none;
}
.accordion-step .accordion-item.disabled .accordion-button::before {
  background-color: rgb(var(--rgb-light));
  color: rgb(var(--rgb-light));
  box-shadow: 0 6px 12px 0 rgba(var(--rgb-light), 0.3);
}
.accordion-step .accordion-item.checked::before {
  border-color: rgb(var(--rgb-first));
}
.accordion-step .accordion-item.checked .accordion-button::before {
  content: "\f00c";
  font-size: 10px;
}
.accordion-step .accordion-button {
  padding-left: 36px;
  padding-right: 6px;
  gap: 12px;
}
html[dir=ltr] .accordion-step .accordion-button {
  padding-right: 36px;
  padding-left: 6px;
}

.accordion-step .accordion-button span {
  line-height: 24px;
}
.accordion-step .accordion-button:not(.collapsed) {
  box-shadow: none;
}
.accordion-step .accordion-button:not(.collapsed)::after {
  content: "\f068";
  transform: rotate(0deg);
}
.accordion-step .accordion-button::before {
  content: "\f111";
  font-family: Fontawesome;
  background-color: rgb(var(--rgb-first));
  color: rgb(var(--rgb-lightest));
  border-radius: 8px;
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  font-size: 8px;
  box-shadow: 0 6px 12px 0 rgb(var(--rgb-first), 0.3);
}
.accordion-step .accordion-button::after {
  content: "\f067";
  transform: rotate(-90deg);
  color: rgb(var(--rgb-seventh));
}
.accordion-step .accordion-body {
  overflow: unset;
  max-height: none;
}
@media only screen and (max-width: 767px) {
  .accordion-step .accordion-body {
    padding: 12px;
  }
}

/*
Verification start
*/
.verify-control {
  text-align: center;
  width: 44px;
}

.pointer-events-none {
  pointer-events: none;
}

.bmap .leaflet-bottom {
  bottom: 64px;
}
.bmap-content .down-section-btn {
  left: 168px;
}
.bmap-sidebar {
  position: absolute;
  width: 590px;
  height: 100%;
  right: 0;
  background-color: rgb(var(--rgb-ninth-lighter));
  z-index: 2000;
  border-radius: 12px 0 0 12px;
  transform: translateX(100%);
  transition: all 300ms ease-in-out;
  max-height: 100%;
  max-width: calc(100% - 42px);
}
.bmap-sidebar.show {
  box-shadow: -8px 0 24px 1px rgba(var(--rgb-darkest), 0.1);
  transform: translateX(0);
}
.bmap-sidebar.show .bmap-hamburger-btn i {
  transform: rotate(180deg);
}
.bmap-hamburger-btn {
  width: 40px;
  height: 40px;
  position: absolute;
  left: -40px;
  top: 40px;
  display: flex;
  border: 1px solid rgb(var(--rgb-light));
  background-color: rgb(var(--rgb-ninth-lighter));
  border-radius: 6px 0 0 6px;
  font-size: 15px;
  color: rgb(var(--rgb-darkest));
  align-items: center;
  justify-content: center;
  z-index: 300;
  transition: all 300ms ease-in-out;
}
html[dir=ltr] .bmap-hamburger-btn {
  right: -40px;
  left: auto;
  border-radius: 0 6px 6px 0;
}

.bmap-hamburger-btn i {
  color: rgb(var(--rgb-darkest));
  transition: all 300ms ease;
}
.bmap-btn {
  border-radius: 40px !important;
  min-height: 40px;
  padding: 0;
  display: flex;
  gap: 4px;
  padding-left: 4px;
  align-items: center;
  transition: all 300ms;
  text-align: center;
}
.bmap-btn span {
  width: 100%;
}
.bmap-btn:hover {
  background-color: rgb(var(--rgb-first));
  color: rgb(var(--rgb-lightest));
  box-shadow: 0 0 4px 1px rgba(var(--rgb-darkest), 0.4) !important;
}
.bmap-btn .bmap-btn-icon {
  background-color: rgb(var(--rgb-first-darker));
  min-width: 40px;
  min-height: 40px;
  width: 40px;
  height: 40px;
  border-radius: 100%;
}
.bmap-btn-dark {
  background-color: rgb(var(--rgb-first));
  color: rgb(var(--rgb-lightest));
}
.bmap-btn-dark:hover {
  background-color: rgb(var(--rgb-first));
}
.bmap-btn-dark .bmap-btn-icon {
  background-color: color-mix(in srgb, rgb(var(--rgb-first-darker)) 70%, rgb(var(--rgb-black)));
}
.bmap-btn-danger {
  background-color: rgb(var(--rgb-red-700)) !important;
  color: rgb(var(--rgb-lightest));
}
.bmap-btn-danger:hover {
  background-color: rgb(var(--rgb-red-700)) !important;
}
.bmap-btn-danger .bmap-btn-icon {
  background-color: rgb(var(--rgb-red-800));
}
.bmap-btn-success {
  background-color: rgb(var(--rgb-green-700)) !important;
  color: rgb(var(--rgb-lightest));
}
.bmap-btn-success:hover {
  background-color: rgb(var(--rgb-green-700)) !important;
}
.bmap-btn-success .bmap-btn-icon {
  background-color: rgb(var(--rgb-green-800));
}
.bmap-btn-info {
  background-color: rgb(var(--rgb-sky-700)) !important;
  color: rgb(var(--rgb-lightest));
}
.bmap-btn-info:hover {
  background-color: rgb(var(--rgb-sky-700)) !important;
}
.bmap-btn-info .bmap-btn-icon {
  background-color: rgb(var(--rgb-sky-800));
}
.bmap-btn-warning {
  background-color: rgb(var(--rgb-amber-700)) !important;
  color: rgb(var(--rgb-lightest));
}
.bmap-btn-warning:hover {
  background-color: rgb(var(--rgb-amber-700)) !important;
}
.bmap-btn-warning .bmap-btn-icon {
  background-color: rgb(var(--rgb-amber-800));
}
.bmap-btn-icon {
  display: grid;
  place-items: center;
}
.bmap-ordered-list {
  border-bottom: 1px solid rgb(var(--rgb-light));
  padding: 4px 6px;
  display: flex;
  align-items: center;
  font-size: 14px;
  border-radius: 8px;
  color: rgb(var(--rgb-darkest));
}
.bmap-ordered-list:hover {
  background-color: rgb(var(--rgb-first), 0.05);
}
.bmap-ordered-list.active {
  background-color: rgb(var(--rgb-first-lighter));
  border: 1px solid rgb(var(--rgb-first));
}
.bmap-ordered-list.active-key {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  background-color: rgb(var(--rgb-first-dark));
  color: rgb(var(--rgb-lightest));
  border-radius: 8px;
}
.bmap-ordered-list-routes.active {
  background-color: rgb(var(--rgb-first-light), 0.7);
  border: 2px solid rgb(var(--rgb-first));
}
.bmap-ordered-list-wrapper {
  padding-bottom: 284px;
}
.bmap-ordered-list-key {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  background-color: rgb(var(--rgb-first-dark));
  color: rgb(var(--rgb-lightest));
  border-radius: 8px;
}
.bmap-card {
  border-radius: 12px;
  padding: 12px 16px;
  box-shadow: 0 2px 6px 0 rgba(var(--rgb-darkest), 0.05);
  text-align: center;
  font-size: 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  border-bottom: 3px solid rgb(var(--rgb-first));
}
.bmap-card-success {
  background-color: rgb(var(--rgb-green-100));
  color: rgb(var(--rgb-green-700));
  border-bottom-color: rgb(var(--rgb-green-700));
}
body.dark .bmap-card-success {
  background-color: rgb(var(--rgb-green-700));
  color: rgb(var(--rgb-green-100));
  border-bottom-color: rgb(var(--rgb-green-100));
}

body.faragard-dark .bmap-card-success {
  background-color: rgb(var(--rgb-green-700));
  color: rgb(var(--rgb-green-100));
  border-bottom-color: rgb(var(--rgb-green-100));
}

.bmap-card-danger {
  background-color: rgb(var(--rgb-red-100));
  color: rgb(var(--rgb-red-700));
  border-bottom-color: rgb(var(--rgb-red-700));
}
body.dark .bmap-card-danger {
  background-color: rgb(var(--rgb-red-700));
  color: rgb(var(--rgb-red-100));
  border-bottom-color: rgb(var(--rgb-red-100));
}

body.faragard-dark .bmap-card-danger {
  background-color: rgb(var(--rgb-red-700));
  color: rgb(var(--rgb-red-100));
  border-bottom-color: rgb(var(--rgb-red-100));
}

.bmap-card-warning {
  background-color: rgb(var(--rgb-amber-100));
  color: rgb(var(--rgb-amber-700));
  border-bottom-color: rgb(var(--rgb-amber-700));
}
body.dark .bmap-card-warning {
  background-color: rgb(var(--rgb-amber-700));
  color: rgb(var(--rgb-amber-100));
  border-bottom-color: rgb(var(--rgb-amber-100));
}

body.faragard-dark .bmap-card-warning {
  background-color: rgb(var(--rgb-amber-700));
  color: rgb(var(--rgb-amber-100));
  border-bottom-color: rgb(var(--rgb-amber-100));
}

.bmap-card-info {
  background-color: rgb(var(--rgb-sky-100));
  color: rgb(var(--rgb-sky-700));
  border-bottom-color: rgb(var(--rgb-sky-700));
}
body.dark .bmap-card-info {
  background-color: rgb(var(--rgb-sky-700));
  color: rgb(var(--rgb-sky-100));
  border-bottom-color: rgb(var(--rgb-sky-100));
}

body.faragard-dark .bmap-card-info {
  background-color: rgb(var(--rgb-sky-700));
  color: rgb(var(--rgb-sky-100));
  border-bottom-color: rgb(var(--rgb-sky-100));
}

.bmap-card-default {
  background-color: rgb(var(--rgb-slate-100));
  color: rgb(var(--rgb-slate-700));
  border-bottom-color: rgb(var(--rgb-slate-700));
}
body.dark .bmap-card-default {
  background-color: rgb(var(--rgb-slate-700));
  color: rgb(var(--rgb-slate-100));
  border-bottom-color: rgb(var(--rgb-slate-100));
}

body.faragard-dark .bmap-card-default {
  background-color: rgb(var(--rgb-slate-700));
  color: rgb(var(--rgb-slate-100));
  border-bottom-color: rgb(var(--rgb-slate-100));
}

.bmap-icons-wrapper {
  position: absolute;
  bottom: 10px;
  right: 30px;
  display: flex;
  gap: 16px;
  align-items: center;
  z-index: 990;
}
.bmap-icons-wrapper.left {
  left: 78px;
  right: auto;
}
.bmap-icons-btn {
  z-index: 401;
  width: 30px;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgb(var(--rgb-first));
  color: rgb(var(--rgb-lightest));
  border: none;
  outline: none;
  font-size: 16px;
  box-shadow: 0 0 0 4px rgba(var(--rgb-first), 0.5), 0 0 8px 0 rgba(var(--rgb-darkest), 0.1);
  transition: all 200ms;
}
.bmap-icons-btn:hover, .bmap-icons-btn:active {
  background-color: rgb(var(--rgb-first));
  color: rgb(var(--rgb-lightest));
  box-shadow: 0 0 0 6px rgba(var(--rgb-first), 0.5), 0 0 8px 0 rgba(var(--rgb-darkest), 0.1);
}
.bmap-guide-popup {
  position: absolute;
  background-color: rgb(var(--rgb-ninth-lighter));
  box-shadow: 1px 2px 8px 0 rgba(var(--rgb-darkest), 0.1);
  bottom: calc(100% + 12px);
  left: 0;
  padding: 12px 16px;
  border-radius: 12px;
  min-width: 160px;
  display: flex;
  flex-direction: column;
  width: max-content;
  gap: 6px;
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  transition: all 200ms ease-out;
}
.bmap-guide-popup.show {
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
  transform: translateY(-4px);
}
.bmap-guide-popup-item {
  color: rgb(var(--rgb-darker));
  font-weight: 500;
  padding: 4px;
  border-radius: 8px;
  font-size: 12px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.bmap-route-shape-straight {
  width: 100%;
  min-height: 10px;
  height: 10px;
  background: rgb(var(--rgb-first));
  border-radius: 10px;
  position: relative;
}
.bmap-route-shape-straight::before {
  content: attr(data-title);
  position: absolute;
  top: 0;
  transform: rotate(90deg);
  color: rgb(var(--rgb-first-darker));
  font-weight: 500;
}
.bmap-route-shape-icon {
  width: 48px;
  height: 48px;
  font-size: 24px;
  background-color: rgb(var(--rgb-first-light));
  z-index: 10;
  color: rgb(var(--rgb-first-darker));
  border-radius: 50%;
  transform: translateY(-100%);
  display: grid;
  position: relative;
  place-items: center;
  box-shadow: 0 0 0 8px rgb(var(--rgb-first-lighter));
}
.bmap-route-shape-icon::before, .bmap-route-shape-icon::after {
  content: "";
  background-color: transparent;
  border: 20px solid transparent;
  border-bottom-color: rgb(var(--rgb-first-light));
  position: absolute;
  top: -34px;
  left: 50%;
  z-index: 1;
  transform: scaleY(1.2) translateX(-50%);
}
.bmap-route-shape-icon::before {
  border-width: 24px;
  border-bottom-color: rgb(var(--rgb-first-lighter));
  top: -50px;
}
.bmap-route-shape-icon.down {
  transform: translateY(-128%);
}
.bmap-route-shape-icon.down::before {
  top: auto;
  bottom: -50px;
  border-bottom-color: transparent !important;
  border-top-color: rgb(var(--rgb-first-lighter));
}
.bmap-route-shape-icon.down::after {
  top: auto;
  bottom: -34px;
  border-bottom-color: transparent !important;
  border-top-color: rgb(var(--rgb-first-light));
}
.bmap-route-shape-icon-danger {
  background-color: rgb(var(--rgb-red-300));
  color: rgb(var(--rgb-red-800));
  box-shadow: 0 0 0 8px rgb(var(--rgb-red-200));
}
.bmap-route-shape-icon-danger::after {
  border-bottom-color: rgb(var(--rgb-red-300));
}
.bmap-route-shape-icon-danger::before {
  border-bottom-color: rgb(var(--rgb-red-200));
}
.bmap-route-shape-icon-danger.down::after {
  border-top-color: rgb(var(--rgb-red-300));
}
.bmap-route-shape-icon-danger.down::before {
  border-top-color: rgb(var(--rgb-red-200));
}
.bmap-route-shape-icon-success {
  background-color: rgb(var(--rgb-green-300));
  color: rgb(var(--rgb-green-800));
  box-shadow: 0 0 0 8px rgb(var(--rgb-green-200));
}
.bmap-route-shape-icon-success::after {
  border-bottom-color: rgb(var(--rgb-green-300));
}
.bmap-route-shape-icon-success::before {
  border-bottom-color: rgb(var(--rgb-green-200));
}
.bmap-route-shape-icon-success.down::after {
  border-top-color: rgb(var(--rgb-green-300));
}
.bmap-route-shape-icon-success.down::before {
  border-top-color: rgb(var(--rgb-green-200));
}
.bmap-route-shape-icon-warning {
  background-color: rgb(var(--rgb-amber-300));
  color: rgb(var(--rgb-amber-800));
  box-shadow: 0 0 0 8px rgb(var(--rgb-amber-200));
}
.bmap-route-shape-icon-warning::after {
  border-bottom-color: rgb(var(--rgb-amber-300));
}
.bmap-route-shape-icon-warning::before {
  border-bottom-color: rgb(var(--rgb-amber-200));
}
.bmap-route-shape-icon-warning.down::after {
  border-top-color: rgb(var(--rgb-amber-300));
}
.bmap-route-shape-icon-warning.down::before {
  border-top-color: rgb(var(--rgb-amber-200));
}
.bmap-route-shape-icon-info {
  background-color: rgb(var(--rgb-sky-300));
  color: rgb(var(--rgb-sky-800));
  box-shadow: 0 0 0 8px rgb(var(--rgb-sky-200));
}
.bmap-route-shape-icon-info::after {
  border-bottom-color: rgb(var(--rgb-sky-300));
}
.bmap-route-shape-icon-info::before {
  border-bottom-color: rgb(var(--rgb-sky-200));
}
.bmap-route-shape-icon-info.down::after {
  border-top-color: rgb(var(--rgb-sky-300));
}
.bmap-route-shape-icon-info.down::before {
  border-top-color: rgb(var(--rgb-sky-200));
}
.bmap-route-station {
  height: 280px;
  overflow-x: auto;
  overflow-y: hidden;
  display: flex;
  flex-direction: row-reverse;
  width: fit-content;
  width: 100%;
  max-width: 100%;
  justify-content: space-between;
  padding: 72px 32px 12px 0;
}
.bmap-route-station-down {
  flex-direction: column;
  overflow-x: hidden;
  overflow-y: auto;
  height: 100%;
  width: 280px;
  padding: 32px 72px 12px 0;
}
.bmap-route-station-down .bmap-route-shape-icon {
  transform: translateX(126%) rotate(-90deg);
}
.bmap-route-station-down .bmap-route-shape-icon i {
  transform: rotate(90deg);
}
.bmap-route-station-down .bmap-route-shape-straight {
  min-height: auto;
  min-width: 10px;
  height: 100%;
  width: auto;
}
.bmap-route-station-down .bmap-route-shape-straight::before {
  width: max-content;
  top: -30px;
  left: 50%;
  transform: translateX(-50%);
}
.bmap-route-station-down .bmap-route-station-item {
  writing-mode: horizontal-tb;
  flex-direction: row;
  padding: 12px 48px 12px 12px;
  border-radius: 12px 0 0 12px;
}
.bmap-route-station-down .bmap-route-station-item::after {
  right: -8px;
  left: auto;
  bottom: -8px;
  top: auto;
}
.bmap-route-station-down .bmap-route-station-item::before {
  right: -8px;
  left: auto;
  top: -8px;
  bottom: auto;
  transform: rotate(225deg);
}
.bmap-route-station-down .bmap-route-station-item-key {
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
}
.bmap-route-station-item {
  font-size: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 48px 12px 12px 12px;
  writing-mode: vertical-rl;
  text-align: center;
  background-color: rgb(var(--rgb-first));
  color: rgb(var(--rgb-lightest));
  position: relative;
  border-radius: 0 0 12px 12px;
}
.bmap-route-station-item::before, .bmap-route-station-item::after {
  content: "";
  transform: rotate(45deg);
  background-color: transparent;
  border: 8px solid transparent;
  border-right-color: rgb(var(--rgb-first));
  position: absolute;
  top: -8px;
  right: -6px;
  z-index: 1;
}
.bmap-route-station-item::after {
  left: -6px;
  right: auto;
  border-right-color: transparent;
  border-bottom-color: rgb(var(--rgb-first));
}
.bmap-route-station-item-key {
  position: absolute;
  top: 16px;
  left: 50%;
  transform: translateX(-50%);
  color: rgb(var(--rgb-lightest));
  border: 1px solid rgb(var(--rgb-lightest));
  border-radius: 50%;
  width: 28px;
  height: 30px;
  display: grid;
  place-items: center;
  writing-mode: horizontal-tb;
}
.bmap-route-station-item-danger {
  background-color: rgb(var(--rgb-red-700));
}
.bmap-route-station-item-danger::before {
  border-right-color: rgb(var(--rgb-red-700));
}
.bmap-route-station-item-danger::after {
  border-bottom-color: rgb(var(--rgb-red-700));
}
.bmap-route-station-item-success {
  background-color: rgb(var(--rgb-green-700));
}
.bmap-route-station-item-success::before {
  border-right-color: rgb(var(--rgb-green-700));
}
.bmap-route-station-item-success::after {
  border-bottom-color: rgb(var(--rgb-green-700));
}
.bmap-route-station-item-warning {
  background-color: rgb(var(--rgb-amber-700));
}
.bmap-route-station-item-warning::before {
  border-right-color: rgb(var(--rgb-amber-700));
}
.bmap-route-station-item-warning::after {
  border-bottom-color: rgb(var(--rgb-amber-700));
}
.bmap-route-station-item-info {
  background-color: rgb(var(--rgb-sky-700));
}
.bmap-route-station-item-info::before {
  border-right-color: rgb(var(--rgb-sky-700));
}
.bmap-route-station-item-info::after {
  border-bottom-color: rgb(var(--rgb-sky-700));
}
.bmap-map-marker {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: rgb(var(--rgb-first-light));
  position: relative;
  display: grid;
  place-items: center;
  font-size: 18px;
  color: rgb(var(--rgb-first-darker));
  box-shadow: 0 0 0 4px rgb(var(--rgb-first-lighter)), 0 -2px 7px 0 rgb(var(--rgb-darkest), 0.3);
}
.bmap-map-marker::before, .bmap-map-marker::after {
  content: "";
  border: 18px solid transparent;
  border-top-color: rgb(var(--rgb-first-light));
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translateX(-50%) translateY(-3px) scaleY(1.4);
}
.bmap-map-marker::before {
  border-width: 24px;
  border-radius: 8px;
  border-top-color: rgb(var(--rgb-first-lighter));
  z-index: -1;
}
.bmap-map-marker-success {
  background-color: rgb(var(--rgb-green-300));
  color: rgb(var(--rgb-green-800));
  box-shadow: 0 0 0 4px rgb(var(--rgb-green-200));
}
.bmap-map-marker-success::after {
  border-top-color: rgb(var(--rgb-green-300));
}
.bmap-map-marker-success::before {
  border-top-color: rgb(var(--rgb-green-200));
}
.bmap-map-marker-danger {
  background-color: rgb(var(--rgb-red-300));
  color: rgb(var(--rgb-red-800));
  box-shadow: 0 0 0 4px rgb(var(--rgb-red-200));
}
.bmap-map-marker-danger::after {
  border-top-color: rgb(var(--rgb-red-300));
}
.bmap-map-marker-danger::before {
  border-top-color: rgb(var(--rgb-red-200));
}
.bmap-map-popup {
  min-height: 80px;
  width: 300px;
  max-width: 260px;
  max-height: 200px;
  overflow-y: auto;
  overflow-x: hidden;
}
.bmap-map-popup-custom {
  transition: transform 300ms ease-in-out !important;
}
.bmap-map-popup-custom .leaflet-popup-content-wrapper, .bmap-map-popup-custom .leaflet-popup-tip {
  background-color: rgb(var(--rgb-ninth-lighter));
}
.bmap-map-popup-custom .leaflet-popup-content-wrapper .leaflet-popup-content, .bmap-map-popup-custom .leaflet-popup-tip .leaflet-popup-content {
  margin: 20px;
}

.bmap-timeline-timer {
  background-color: rgb(var(--rgb-first-lighter), 0.5);
  color: rgb(var(--rgb-first-darker));
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 12px 32px;
  border-radius: 12px;
  border: 2px solid transparent;
  font-size: 12px;
  cursor: pointer;
}
.bmap-timeline-timer.active {
  background-color: rgb(var(--rgb-first-lighter));
  border-color: rgb(var(--rgb-first-light));
}

/* Time line start */
.brztl-timeline-container {
  background-color: transparent;
}

.brztl-progress-container {
  background-color: rgb(var(--rgb-first-lighter));
}

.brztl-progress-fill {
  background-color: rgb(var(--rgb-first-light));
}

.brztl-current-time, .brztl-total-time {
  top: -10px;
  color: rgb(var(--rgb-light-dark));
}

.brztl-playPauseBtn {
  font-size: 1.5rem !important;
}

.brztl-controls-container {
  margin-top: 18px;
}

.brztl-control-buttons .brztl-speedBtn {
  background-color: rgb(var(--rgb-first));
}

/* Bus map styles */
.custom_fullscreen {
  background-color: rgb(var(--rgb-first)) !important;
  border: 1px solid rgb(var(--rgb-first)) !important;
  outline: none !important;
  background-position: 80% 0% !important;
}

/*# sourceMappingURL=main.css.map */