/*!
 *  Line Awesome 1.1.0 by @icons_8 - https://icons8.com/line-awesome
 *  License - https://icons8.com/good-boy-license/ (Font: SIL OFL 1.1, CSS: MIT License)
 *
 * Made with love by Icons8 [ https://icons8.com/ ] using FontCustom [ https://github.com/FontCustom/fontcustom ]
 *
 * Contacts:
 *    [ https://icons8.com/contact ]
 *
 * Follow Icon8 on
 *    Twitter [ https://twitter.com/icons_8 ]
 *    Facebook [ https://www.facebook.com/Icons8 ]
 *    Google+ [ https://plus.google.com/+Icons8 ]
 *    GitHub [ https://github.com/icons8 ]
 */
@font-face {
  font-family: "LineAwesome";
  src: url("fonts/line-awesome/line-awesome.eot?v=1.1.");
  src: url("fonts/line-awesome/line-awesome.eot??v=1.1.#iefix") format("embedded-opentype"), url("fonts/line-awesome/line-awesome.woff2?v=1.1.") format("woff2"), url("fonts/line-awesome/line-awesome.woff?v=1.1.") format("woff"), url("fonts/line-awesome/line-awesome.ttf?v=1.1.") format("truetype"), url("fonts/line-awesome/line-awesome.svg?v=1.1.#fa") format("svg");
  font-weight: normal;
  font-style: normal; }

@media screen and (-webkit-min-device-pixel-ratio: 0) {
  @font-face {
    font-family: "LineAwesome";
    src: url("fonts/line-awesome/line-awesome.svg?v=1.1.#fa") format("svg"); } }

/* Thanks to http://fontawesome.io @fontawesome and @davegandy */
.la {
  display: inline-block;
  font: normal normal normal 16px/1 "LineAwesome";
  font-size: inherit;
  text-decoration: inherit;
  text-rendering: optimizeLegibility;
  text-transform: none;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  font-smoothing: antialiased; }

/* makes the font 33% larger relative to the icon container */
.la-lg {
  font-size: 1.33333333em;
  line-height: 0.75em;
  vertical-align: -15%; }

.la-2x {
  font-size: 2em; }

.la-3x {
  font-size: 3em; }

.la-4x {
  font-size: 4em; }

.la-5x {
  font-size: 5em; }

.la-fw {
  width: 1.28571429em;
  text-align: center; }

.la-ul {
  padding-left: 0;
  margin-left: 2.14285714em;
  list-style-type: none; }

.la-ul > li {
  position: relative; }

.la-li {
  position: absolute;
  left: -2.14285714em;
  width: 2.14285714em;
  top: 0.14285714em;
  text-align: center; }

.la-li.la-lg {
  left: -1.85714286em; }

.la-border {
  padding: .2em .25em .15em;
  border: solid 0.08em #eeeeee;
  border-radius: .1em; }

.pull-right {
  float: right; }

.pull-left {
  float: left; }

.li.pull-left {
  margin-right: .3em; }

.li.pull-right {
  margin-left: .3em; }

.la-spin {
  -webkit-animation: fa-spin 2s infinite linear;
  animation: fa-spin 2s infinite linear; }

@-webkit-keyframes fa-spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg); } }

@keyframes fa-spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg); } }

.la-rotate-90 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg); }

.la-rotate-180 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg); }

.la-rotate-270 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
  -webkit-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  transform: rotate(270deg); }

.la-flip-horizontal {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);
  -webkit-transform: scale(-1, 1);
  -ms-transform: scale(-1, 1);
  transform: scale(-1, 1); }

.la-flip-vertical {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);
  -webkit-transform: scale(1, -1);
  -ms-transform: scale(1, -1);
  transform: scale(1, -1); }

:root .la-rotate-90,
:root .la-rotate-180,
:root .la-rotate-270,
:root .la-flip-horizontal,
:root .la-flip-vertical {
  filter: none; }

.la-stack {
  position: relative;
  display: inline-block;
  width: 2em;
  height: 2em;
  line-height: 2em;
  vertical-align: middle; }

.la-stack-1x,
.la-stack-2x {
  position: absolute;
  left: 0;
  width: 100%;
  text-align: center; }

.la-stack-1x {
  line-height: inherit; }

.la-stack-2x {
  font-size: 2em; }

.la-inverse {
  color: #ffffff; }

/* Thanks to http://fontawesome.io @fontawesome and @davegandy */
.la-500px:before {
  content: "\f100"; }

.la-adjust:before {
  content: "\f101"; }

.la-adn:before {
  content: "\f102"; }

.la-align-center:before {
  content: "\f103"; }

.la-align-justify:before {
  content: "\f104"; }

.la-align-left:before {
  content: "\f105"; }

.la-align-right:before {
  content: "\f106"; }

.la-amazon:before {
  content: "\f107"; }

.la-ambulance:before {
  content: "\f108"; }

.la-anchor:before {
  content: "\f109"; }

.la-android:before {
  content: "\f10a"; }

.la-angellist:before {
  content: "\f10b"; }

.la-angle-double-down:before {
  content: "\f10c"; }

.la-angle-double-left:before {
  content: "\f10d"; }

.la-angle-double-right:before {
  content: "\f10e"; }

.la-angle-double-up:before {
  content: "\f10f"; }

.la-angle-down:before {
  content: "\f110"; }

.la-angle-left:before {
  content: "\f111"; }

.la-angle-right:before {
  content: "\f112"; }

.la-angle-up:before {
  content: "\f113"; }

.la-apple:before {
  content: "\f114"; }

.la-archive:before {
  content: "\f115"; }

.la-area-chart:before {
  content: "\f116"; }

.la-arrow-circle-down:before {
  content: "\f117"; }

.la-arrow-circle-left:before {
  content: "\f118"; }

.la-arrow-circle-o-down:before {
  content: "\f119"; }

.la-arrow-circle-o-left:before {
  content: "\f11a"; }

.la-arrow-circle-o-right:before {
  content: "\f11b"; }

.la-arrow-circle-o-up:before {
  content: "\f11c"; }

.la-arrow-circle-right:before {
  content: "\f11d"; }

.la-arrow-circle-up:before {
  content: "\f11e"; }

.la-arrow-down:before {
  content: "\f11f"; }

.la-arrow-left:before {
  content: "\f120"; }

.la-arrow-right:before {
  content: "\f121"; }

.la-arrow-up:before {
  content: "\f122"; }

.la-arrows:before {
  content: "\f123"; }

.la-arrows-alt:before {
  content: "\f124"; }

.la-arrows-h:before {
  content: "\f125"; }

.la-arrows-v:before {
  content: "\f126"; }

.la-asterisk:before {
  content: "\f127"; }

.la-at:before {
  content: "\f128"; }

.la-automobile:before {
  content: "\f129"; }

.la-backward:before {
  content: "\f12a"; }

.la-balance-scale:before {
  content: "\f12b"; }

.la-ban:before {
  content: "\f12c"; }

.la-bank:before {
  content: "\f12d"; }

.la-bar-chart:before {
  content: "\f12e"; }

.la-bar-chart-o:before {
  content: "\f12f"; }

.la-barcode:before {
  content: "\f130"; }

.la-bars:before {
  content: "\f131"; }

.la-battery-0:before {
  content: "\f132"; }

.la-battery-1:before {
  content: "\f133"; }

.la-battery-2:before {
  content: "\f134"; }

.la-battery-3:before {
  content: "\f135"; }

.la-battery-4:before {
  content: "\f136"; }

.la-battery-empty:before {
  content: "\f137"; }

.la-battery-full:before {
  content: "\f138"; }

.la-battery-half:before {
  content: "\f139"; }

.la-battery-quarter:before {
  content: "\f13a"; }

.la-battery-three-quarters:before {
  content: "\f13b"; }

.la-bed:before {
  content: "\f13c"; }

.la-beer:before {
  content: "\f13d"; }

.la-behance:before {
  content: "\f13e"; }

.la-behance-square:before {
  content: "\f13f"; }

.la-bell:before {
  content: "\f140"; }

.la-bell-o:before {
  content: "\f141"; }

.la-bell-slash:before {
  content: "\f142"; }

.la-bell-slash-o:before {
  content: "\f143"; }

.la-bicycle:before {
  content: "\f144"; }

.la-binoculars:before {
  content: "\f145"; }

.la-birthday-cake:before {
  content: "\f146"; }

.la-bitbucket:before {
  content: "\f147"; }

.la-bitbucket-square:before {
  content: "\f148"; }

.la-bitcoin:before {
  content: "\f149"; }

.la-black-tie:before {
  content: "\f14a"; }

.la-bold:before {
  content: "\f14b"; }

.la-bolt:before {
  content: "\f14c"; }

.la-bomb:before {
  content: "\f14d"; }

.la-book:before {
  content: "\f14e"; }

.la-bookmark:before {
  content: "\f14f"; }

.la-bookmark-o:before {
  content: "\f150"; }

.la-briefcase:before {
  content: "\f151"; }

.la-btc:before {
  content: "\f152"; }

.la-bug:before {
  content: "\f153"; }

.la-building:before {
  content: "\f154"; }

.la-building-o:before {
  content: "\f155"; }

.la-bullhorn:before {
  content: "\f156"; }

.la-bullseye:before {
  content: "\f157"; }

.la-bus:before {
  content: "\f158"; }

.la-buysellads:before {
  content: "\f159"; }

.la-cab:before {
  content: "\f15a"; }

.la-calculator:before {
  content: "\f15b"; }

.la-calendar:before {
  content: "\f15c"; }

.la-calendar-check-o:before {
  content: "\f15d"; }

.la-calendar-minus-o:before {
  content: "\f15e"; }

.la-calendar-o:before {
  content: "\f15f"; }

.la-calendar-plus-o:before {
  content: "\f160"; }

.la-calendar-times-o:before {
  content: "\f161"; }

.la-camera:before {
  content: "\f162"; }

.la-camera-retro:before {
  content: "\f163"; }

.la-car:before {
  content: "\f164"; }

.la-caret-down:before {
  content: "\f165"; }

.la-caret-left:before {
  content: "\f166"; }

.la-caret-right:before {
  content: "\f167"; }

.la-caret-square-o-down:before, .la-toggle-down:before {
  content: "\f168"; }

.la-caret-square-o-left:before, .la-toggle-left:before {
  content: "\f169"; }

.la-caret-square-o-right:before, .la-toggle-right:before {
  content: "\f16a"; }

.la-caret-square-o-up:before, .la-toggle-up:before {
  content: "\f16b"; }

.la-caret-up:before {
  content: "\f16c"; }

.la-cart-arrow-down:before {
  content: "\f16d"; }

.la-cart-plus:before {
  content: "\f16e"; }

.la-cc:before {
  content: "\f16f"; }

.la-cc-amex:before {
  content: "\f170"; }

.la-cc-diners-club:before {
  content: "\f171"; }

.la-cc-discover:before {
  content: "\f172"; }

.la-cc-jcb:before {
  content: "\f173"; }

.la-cc-mastercard:before {
  content: "\f174"; }

.la-cc-paypal:before {
  content: "\f175"; }

.la-cc-stripe:before {
  content: "\f176"; }

.la-cc-visa:before {
  content: "\f177"; }

.la-certificate:before {
  content: "\f178"; }

.la-chain:before {
  content: "\f179"; }

.la-chain-broken:before {
  content: "\f17a"; }

.la-check:before {
  content: "\f17b"; }

.la-check-circle:before {
  content: "\f17c"; }

.la-check-circle-o:before {
  content: "\f17d"; }

.la-check-square:before {
  content: "\f17e"; }

.la-check-square-o:before {
  content: "\f17f"; }

.la-chevron-circle-down:before {
  content: "\f180"; }

.la-chevron-circle-left:before {
  content: "\f181"; }

.la-chevron-circle-right:before {
  content: "\f182"; }

.la-chevron-circle-up:before {
  content: "\f183"; }

.la-chevron-down:before {
  content: "\f184"; }

.la-chevron-left:before {
  content: "\f185"; }

.la-chevron-right:before {
  content: "\f186"; }

.la-chevron-up:before {
  content: "\f187"; }

.la-child:before {
  content: "\f188"; }

.la-chrome:before {
  content: "\f189"; }

.la-circle:before {
  content: "\f18a"; }

.la-circle-o:before {
  content: "\f18b"; }

.la-circle-o-notch:before {
  content: "\f18c"; }

.la-circle-thin:before {
  content: "\f18d"; }

.la-clipboard:before {
  content: "\f18e"; }

.la-clock-o:before {
  content: "\f18f"; }

.la-clone:before {
  content: "\f190"; }

.la-close:before {
  content: "\f191"; }

.la-cloud:before {
  content: "\f192"; }

.la-cloud-download:before {
  content: "\f193"; }

.la-cloud-upload:before {
  content: "\f194"; }

.la-cny:before {
  content: "\f195"; }

.la-code:before {
  content: "\f196"; }

.la-code-fork:before {
  content: "\f197"; }

.la-codepen:before {
  content: "\f198"; }

.la-coffee:before {
  content: "\f199"; }

.la-cog:before {
  content: "\f19a"; }

.la-cogs:before {
  content: "\f19b"; }

.la-columns:before {
  content: "\f19c"; }

.la-comment:before {
  content: "\f19d"; }

.la-comment-o:before {
  content: "\f19e"; }

.la-commenting:before {
  content: "\f19f"; }

.la-commenting-o:before {
  content: "\f1a0"; }

.la-comments:before {
  content: "\f1a1"; }

.la-comments-o:before {
  content: "\f1a2"; }

.la-compass:before {
  content: "\f1a3"; }

.la-compress:before {
  content: "\f1a4"; }

.la-connectdevelop:before {
  content: "\f1a5"; }

.la-contao:before {
  content: "\f1a6"; }

.la-copy:before {
  content: "\f1a7"; }

.la-copyright:before {
  content: "\f1a8"; }

.la-creative-commons:before {
  content: "\f1a9"; }

.la-credit-card:before {
  content: "\f1aa"; }

.la-crop:before {
  content: "\f1ab"; }

.la-crosshairs:before {
  content: "\f1ac"; }

.la-css3:before {
  content: "\f1ad"; }

.la-cube:before {
  content: "\f1ae"; }

.la-cubes:before {
  content: "\f1af"; }

.la-cut:before {
  content: "\f1b0"; }

.la-cutlery:before {
  content: "\f1b1"; }

.la-dashboard:before {
  content: "\f1b2"; }

.la-dashcube:before {
  content: "\f1b3"; }

.la-database:before {
  content: "\f1b4"; }

.la-dedent:before {
  content: "\f1b5"; }

.la-delicious:before {
  content: "\f1b6"; }

.la-desktop:before {
  content: "\f1b7"; }

.la-deviantart:before {
  content: "\f1b8"; }

.la-diamond:before {
  content: "\f1b9"; }

.la-digg:before {
  content: "\f1ba"; }

.la-dollar:before {
  content: "\f1bb"; }

.la-dot-circle-o:before {
  content: "\f1bc"; }

.la-download:before {
  content: "\f1bd"; }

.la-dribbble:before {
  content: "\f1be"; }

.la-dropbox:before {
  content: "\f1bf"; }

.la-drupal:before {
  content: "\f1c0"; }

.la-edit:before {
  content: "\f1c1"; }

.la-eject:before {
  content: "\f1c2"; }

.la-ellipsis-h:before {
  content: "\f1c3"; }

.la-ellipsis-v:before {
  content: "\f1c4"; }

.la-empire:before, .la-ge:before {
  content: "\f1c5"; }

.la-envelope:before {
  content: "\f1c6"; }

.la-envelope-o:before {
  content: "\f1c7"; }

.la-envelope-square:before {
  content: "\f1c8"; }

.la-eraser:before {
  content: "\f1c9"; }

.la-eur:before {
  content: "\f1ca"; }

.la-euro:before {
  content: "\f1cb"; }

.la-exchange:before {
  content: "\f1cc"; }

.la-exclamation:before {
  content: "\f1cd"; }

.la-exclamation-circle:before {
  content: "\f1ce"; }

.la-exclamation-triangle:before {
  content: "\f1cf"; }

.la-expand:before {
  content: "\f1d0"; }

.la-expeditedssl:before {
  content: "\f1d1"; }

.la-external-link:before {
  content: "\f1d2"; }

.la-external-link-square:before {
  content: "\f1d3"; }

.la-eye:before {
  content: "\f1d4"; }

.la-eye-slash:before {
  content: "\f1d5"; }

.la-eyedropper:before {
  content: "\f1d6"; }

.la-facebook:before, .la-facebook-f:before {
  content: "\f1d7"; }

.la-facebook-official:before {
  content: "\f1d8"; }

.la-facebook-square:before {
  content: "\f1d9"; }

.la-fast-backward:before {
  content: "\f1da"; }

.la-fast-forward:before {
  content: "\f1db"; }

.la-fax:before {
  content: "\f1dc"; }

.la-female:before {
  content: "\f1dd"; }

.la-fighter-jet:before {
  content: "\f1de"; }

.la-file:before {
  content: "\f1df"; }

.la-file-archive-o:before {
  content: "\f1e0"; }

.la-file-audio-o:before {
  content: "\f1e1"; }

.la-file-code-o:before {
  content: "\f1e2"; }

.la-file-excel-o:before {
  content: "\f1e3"; }

.la-file-image-o:before {
  content: "\f1e4"; }

.la-file-movie-o:before {
  content: "\f1e5"; }

.la-file-o:before {
  content: "\f1e6"; }

.la-file-pdf-o:before {
  content: "\f1e7"; }

.la-file-photo-o:before {
  content: "\f1e8"; }

.la-file-picture-o:before {
  content: "\f1e9"; }

.la-file-powerpoint-o:before {
  content: "\f1ea"; }

.la-file-sound-o:before {
  content: "\f1eb"; }

.la-file-text:before {
  content: "\f1ec"; }

.la-file-text-o:before {
  content: "\f1ed"; }

.la-file-video-o:before {
  content: "\f1ee"; }

.la-file-word-o:before {
  content: "\f1ef"; }

.la-file-zip-o:before {
  content: "\f1f0"; }

.la-files-o:before {
  content: "\f1f1"; }

.la-film:before {
  content: "\f1f2"; }

.la-filter:before {
  content: "\f1f3"; }

.la-fire:before {
  content: "\f1f4"; }

.la-fire-extinguisher:before {
  content: "\f1f5"; }

.la-firefox:before {
  content: "\f1f6"; }

.la-flag:before {
  content: "\f1f7"; }

.la-flag-checkered:before {
  content: "\f1f8"; }

.la-flag-o:before {
  content: "\f1f9"; }

.la-flash:before {
  content: "\f1fa"; }

.la-flask:before {
  content: "\f1fb"; }

.la-flickr:before {
  content: "\f1fc"; }

.la-floppy-o:before {
  content: "\f1fd"; }

.la-folder:before {
  content: "\f1fe"; }

.la-folder-o:before {
  content: "\f1ff"; }

.la-folder-open:before {
  content: "\f200"; }

.la-folder-open-o:before {
  content: "\f201"; }

.la-font:before {
  content: "\f202"; }

.la-fonticons:before {
  content: "\f203"; }

.la-forumbee:before {
  content: "\f204"; }

.la-forward:before {
  content: "\f205"; }

.la-foursquare:before {
  content: "\f206"; }

.la-frown-o:before {
  content: "\f207"; }

.la-futbol-o:before, .la-soccer-ball-o:before {
  content: "\f208"; }

.la-gamepad:before {
  content: "\f209"; }

.la-gavel:before {
  content: "\f20a"; }

.la-gbp:before {
  content: "\f20b"; }

.la-gear:before {
  content: "\f20c"; }

.la-gears:before {
  content: "\f20d"; }

.la-genderless:before {
  content: "\f20e"; }

.la-get-pocket:before {
  content: "\f20f"; }

.la-gg:before {
  content: "\f210"; }

.la-gg-circle:before {
  content: "\f211"; }

.la-gift:before {
  content: "\f212"; }

.la-git:before {
  content: "\f213"; }

.la-git-square:before {
  content: "\f214"; }

.la-github:before {
  content: "\f215"; }

.la-github-alt:before {
  content: "\f216"; }

.la-github-square:before {
  content: "\f217"; }

.la-glass:before {
  content: "\f218"; }

.la-globe:before {
  content: "\f219"; }

.la-google:before {
  content: "\f21a"; }

.la-google-plus:before {
  content: "\f21b"; }

.la-google-plus-square:before {
  content: "\f21c"; }

.la-google-wallet:before {
  content: "\f21d"; }

.la-graduation-cap:before {
  content: "\f21e"; }

.la-gratipay:before, .la-gittip:before {
  content: "\f21f"; }

.la-group:before {
  content: "\f220"; }

.la-h-square:before {
  content: "\f221"; }

.la-hacker-news:before {
  content: "\f222"; }

.la-hand-grab-o:before {
  content: "\f223"; }

.la-hand-lizard-o:before {
  content: "\f224"; }

.la-hand-o-down:before {
  content: "\f225"; }

.la-hand-o-left:before {
  content: "\f226"; }

.la-hand-o-right:before {
  content: "\f227"; }

.la-hand-o-up:before {
  content: "\f228"; }

.la-hand-paper-o:before {
  content: "\f229"; }

.la-hand-peace-o:before {
  content: "\f22a"; }

.la-hand-pointer-o:before {
  content: "\f22b"; }

.la-hand-rock-o:before {
  content: "\f22c"; }

.la-hand-scissors-o:before {
  content: "\f22d"; }

.la-hand-spock-o:before {
  content: "\f22e"; }

.la-hand-stop-o:before {
  content: "\f22f"; }

.la-hdd-o:before {
  content: "\f230"; }

.la-header:before {
  content: "\f231"; }

.la-headphones:before {
  content: "\f232"; }

.la-heart:before {
  content: "\f233"; }

.la-heart-o:before {
  content: "\f234"; }

.la-heartbeat:before {
  content: "\f235"; }

.la-history:before {
  content: "\f236"; }

.la-home:before {
  content: "\f237"; }

.la-hospital-o:before {
  content: "\f238"; }

.la-hotel:before {
  content: "\f239"; }

.la-hourglass:before {
  content: "\f23a"; }

.la-hourglass-1:before {
  content: "\f23b"; }

.la-hourglass-2:before {
  content: "\f23c"; }

.la-hourglass-3:before {
  content: "\f23d"; }

.la-hourglass-end:before {
  content: "\f23e"; }

.la-hourglass-half:before {
  content: "\f23f"; }

.la-hourglass-o:before {
  content: "\f240"; }

.la-hourglass-start:before {
  content: "\f241"; }

.la-houzz:before {
  content: "\f242"; }

.la-html5:before {
  content: "\f243"; }

.la-i-cursor:before {
  content: "\f244"; }

.la-ils:before {
  content: "\f245"; }

.la-image:before {
  content: "\f246"; }

.la-inbox:before {
  content: "\f247"; }

.la-indent:before {
  content: "\f248"; }

.la-industry:before {
  content: "\f249"; }

.la-info:before {
  content: "\f24a"; }

.la-info-circle:before {
  content: "\f24b"; }

.la-inr:before {
  content: "\f24c"; }

.la-instagram:before {
  content: "\f24d"; }

.la-institution:before {
  content: "\f24e"; }

.la-internet-explorer:before {
  content: "\f24f"; }

.la-ioxhost:before {
  content: "\f250"; }

.la-italic:before {
  content: "\f251"; }

.la-joomla:before {
  content: "\f252"; }

.la-jpy:before {
  content: "\f253"; }

.la-jsfiddle:before {
  content: "\f254"; }

.la-key:before {
  content: "\f255"; }

.la-keyboard-o:before {
  content: "\f256"; }

.la-krw:before {
  content: "\f257"; }

.la-language:before {
  content: "\f258"; }

.la-laptop:before {
  content: "\f259"; }

.la-lastfm:before {
  content: "\f25a"; }

.la-lastfm-square:before {
  content: "\f25b"; }

.la-leaf:before {
  content: "\f25c"; }

.la-leanpub:before {
  content: "\f25d"; }

.la-legal:before {
  content: "\f25e"; }

.la-lemon-o:before {
  content: "\f25f"; }

.la-level-down:before {
  content: "\f260"; }

.la-level-up:before {
  content: "\f261"; }

.la-life-bouy:before {
  content: "\f262"; }

.la-life-buoy:before {
  content: "\f263"; }

.la-life-ring:before, .la-support:before {
  content: "\f264"; }

.la-life-saver:before {
  content: "\f265"; }

.la-lightbulb-o:before {
  content: "\f266"; }

.la-line-chart:before {
  content: "\f267"; }

.la-link:before {
  content: "\f268"; }

.la-linkedin:before {
  content: "\f269"; }

.la-linkedin-square:before {
  content: "\f26a"; }

.la-linux:before {
  content: "\f26b"; }

.la-list:before {
  content: "\f26c"; }

.la-list-alt:before {
  content: "\f26d"; }

.la-list-ol:before {
  content: "\f26e"; }

.la-list-ul:before {
  content: "\f26f"; }

.la-location-arrow:before {
  content: "\f270"; }

.la-lock:before {
  content: "\f271"; }

.la-long-arrow-down:before {
  content: "\f272"; }

.la-long-arrow-left:before {
  content: "\f273"; }

.la-long-arrow-right:before {
  content: "\f274"; }

.la-long-arrow-up:before {
  content: "\f275"; }

.la-magic:before {
  content: "\f276"; }

.la-magnet:before {
  content: "\f277"; }

.la-mail-forward:before {
  content: "\f278"; }

.la-mail-reply:before {
  content: "\f279"; }

.la-mail-reply-all:before {
  content: "\f27a"; }

.la-male:before {
  content: "\f27b"; }

.la-map:before {
  content: "\f27c"; }

.la-map-marker:before {
  content: "\f27d"; }

.la-map-o:before {
  content: "\f27e"; }

.la-map-pin:before {
  content: "\f27f"; }

.la-map-signs:before {
  content: "\f280"; }

.la-mars:before {
  content: "\f281"; }

.la-mars-double:before {
  content: "\f282"; }

.la-mars-stroke:before {
  content: "\f283"; }

.la-mars-stroke-h:before {
  content: "\f284"; }

.la-mars-stroke-v:before {
  content: "\f285"; }

.la-maxcdn:before {
  content: "\f286"; }

.la-meanpath:before {
  content: "\f287"; }

.la-medium:before {
  content: "\f288"; }

.la-medkit:before {
  content: "\f289"; }

.la-meh-o:before {
  content: "\f28a"; }

.la-mercury:before {
  content: "\f28b"; }

.la-microphone:before {
  content: "\f28c"; }

.la-microphone-slash:before {
  content: "\f28d"; }

.la-minus:before {
  content: "\f28e"; }

.la-minus-circle:before {
  content: "\f28f"; }

.la-minus-square:before {
  content: "\f290"; }

.la-minus-square-o:before {
  content: "\f291"; }

.la-mobile:before {
  content: "\f292"; }

.la-mobile-phone:before {
  content: "\f293"; }

.la-money:before {
  content: "\f294"; }

.la-moon-o:before {
  content: "\f295"; }

.la-mortar-board:before {
  content: "\f296"; }

.la-motorcycle:before {
  content: "\f297"; }

.la-mouse-pointer:before {
  content: "\f298"; }

.la-music:before {
  content: "\f299"; }

.la-navicon:before {
  content: "\f29a"; }

.la-neuter:before {
  content: "\f29b"; }

.la-newspaper-o:before {
  content: "\f29c"; }

.la-object-group:before {
  content: "\f29d"; }

.la-object-ungroup:before {
  content: "\f29e"; }

.la-odnoklassniki:before {
  content: "\f29f"; }

.la-odnoklassniki-square:before {
  content: "\f2a0"; }

.la-opencart:before {
  content: "\f2a1"; }

.la-openid:before {
  content: "\f2a2"; }

.la-opera:before {
  content: "\f2a3"; }

.la-optin-monster:before {
  content: "\f2a4"; }

.la-outdent:before {
  content: "\f2a5"; }

.la-pagelines:before {
  content: "\f2a6"; }

.la-paint-brush:before {
  content: "\f2a7"; }

.la-paper-plane:before, .la-send:before {
  content: "\f2a8"; }

.la-paper-plane-o:before, .la-send-o:before {
  content: "\f2a9"; }

.la-paperclip:before {
  content: "\f2aa"; }

.la-paragraph:before {
  content: "\f2ab"; }

.la-paste:before {
  content: "\f2ac"; }

.la-pause:before {
  content: "\f2ad"; }

.la-paw:before {
  content: "\f2ae"; }

.la-paypal:before {
  content: "\f2af"; }

.la-pencil:before {
  content: "\f2b0"; }

.la-pencil-square:before {
  content: "\f2b1"; }

.la-pencil-square-o:before {
  content: "\f2b2"; }

.la-phone:before {
  content: "\f2b3"; }

.la-phone-square:before {
  content: "\f2b4"; }

.la-photo:before {
  content: "\f2b5"; }

.la-picture-o:before {
  content: "\f2b6"; }

.la-pie-chart:before {
  content: "\f2b7"; }

.la-pied-piper:before {
  content: "\f2b8"; }

.la-pied-piper-alt:before {
  content: "\f2b9"; }

.la-pinterest:before {
  content: "\f2ba"; }

.la-pinterest-p:before {
  content: "\f2bb"; }

.la-pinterest-square:before {
  content: "\f2bc"; }

.la-plane:before {
  content: "\f2bd"; }

.la-play:before {
  content: "\f2be"; }

.la-play-circle:before {
  content: "\f2bf"; }

.la-play-circle-o:before {
  content: "\f2c0"; }

.la-plug:before {
  content: "\f2c1"; }

.la-plus:before {
  content: "\f2c2"; }

.la-plus-circle:before {
  content: "\f2c3"; }

.la-plus-square:before {
  content: "\f2c4"; }

.la-plus-square-o:before {
  content: "\f2c5"; }

.la-power-off:before {
  content: "\f2c6"; }

.la-print:before {
  content: "\f2c7"; }

.la-puzzle-piece:before {
  content: "\f2c8"; }

.la-qq:before {
  content: "\f2c9"; }

.la-qrcode:before {
  content: "\f2ca"; }

.la-question:before {
  content: "\f2cb"; }

.la-question-circle:before {
  content: "\f2cc"; }

.la-quote-left:before {
  content: "\f2cd"; }

.la-quote-right:before {
  content: "\f2ce"; }

.la-ra:before {
  content: "\f2cf"; }

.la-random:before {
  content: "\f2d0"; }

.la-rebel:before {
  content: "\f2d1"; }

.la-recycle:before {
  content: "\f2d2"; }

.la-reddit:before {
  content: "\f2d3"; }

.la-reddit-square:before {
  content: "\f2d4"; }

.la-refresh:before {
  content: "\f2d5"; }

.la-registered:before {
  content: "\f2d6"; }

.la-renren:before {
  content: "\f2d7"; }

.la-reorder:before {
  content: "\f2d8"; }

.la-repeat:before {
  content: "\f2d9"; }

.la-reply:before {
  content: "\f2da"; }

.la-reply-all:before {
  content: "\f2db"; }

.la-retweet:before {
  content: "\f2dc"; }

.la-rmb:before {
  content: "\f2dd"; }

.la-road:before {
  content: "\f2de"; }

.la-rocket:before {
  content: "\f2df"; }

.la-rotate-left:before {
  content: "\f2e0"; }

.la-rotate-right:before {
  content: "\f2e1"; }

.la-rouble:before {
  content: "\f2e2"; }

.la-rss:before, .la-feed:before {
  content: "\f2e3"; }

.la-rss-square:before {
  content: "\f2e4"; }

.la-rub:before {
  content: "\f2e5"; }

.la-ruble:before {
  content: "\f2e6"; }

.la-rupee:before {
  content: "\f2e7"; }

.la-safari:before {
  content: "\f2e8"; }

.la-save:before {
  content: "\f2e9"; }

.la-scissors:before {
  content: "\f2ea"; }

.la-search:before {
  content: "\f2eb"; }

.la-search-minus:before {
  content: "\f2ec"; }

.la-search-plus:before {
  content: "\f2ed"; }

.la-sellsy:before {
  content: "\f2ee"; }

.la-server:before {
  content: "\f2ef"; }

.la-share:before {
  content: "\f2f0"; }

.la-share-alt:before {
  content: "\f2f1"; }

.la-share-alt-square:before {
  content: "\f2f2"; }

.la-share-square:before {
  content: "\f2f3"; }

.la-share-square-o:before {
  content: "\f2f4"; }

.la-shekel:before {
  content: "\f2f5"; }

.la-sheqel:before {
  content: "\f2f6"; }

.la-shield:before {
  content: "\f2f7"; }

.la-ship:before {
  content: "\f2f8"; }

.la-shirtsinbulk:before {
  content: "\f2f9"; }

.la-shopping-cart:before {
  content: "\f2fa"; }

.la-sign-in:before {
  content: "\f2fb"; }

.la-sign-out:before {
  content: "\f2fc"; }

.la-signal:before {
  content: "\f2fd"; }

.la-simplybuilt:before {
  content: "\f2fe"; }

.la-sitemap:before {
  content: "\f2ff"; }

.la-skyatlas:before {
  content: "\f300"; }

.la-skype:before {
  content: "\f301"; }

.la-slack:before {
  content: "\f302"; }

.la-sliders:before {
  content: "\f303"; }

.la-slideshare:before {
  content: "\f304"; }

.la-smile-o:before {
  content: "\f305"; }

.la-sort:before, .la-unsorted:before {
  content: "\f306"; }

.la-sort-alpha-asc:before {
  content: "\f307"; }

.la-sort-alpha-desc:before {
  content: "\f308"; }

.la-sort-amount-asc:before {
  content: "\f309"; }

.la-sort-amount-desc:before {
  content: "\f30a"; }

.la-sort-asc:before, .la-sort-up:before {
  content: "\f30b"; }

.la-sort-desc:before, .la-sort-down:before {
  content: "\f30c"; }

.la-sort-numeric-asc:before {
  content: "\f30d"; }

.la-sort-numeric-desc:before {
  content: "\f30e"; }

.la-soundcloud:before {
  content: "\f30f"; }

.la-space-shuttle:before {
  content: "\f310"; }

.la-spinner:before {
  content: "\f311"; }

.la-spoon:before {
  content: "\f312"; }

.la-spotify:before {
  content: "\f313"; }

.la-square:before {
  content: "\f314"; }

.la-square-o:before {
  content: "\f315"; }

.la-stack-exchange:before {
  content: "\f316"; }

.la-stack-overflow:before {
  content: "\f317"; }

.la-star:before {
  content: "\f318"; }

.la-star-half:before {
  content: "\f319"; }

.la-star-half-o:before, .la-star-half-full:before, .la-star-half-empty:before {
  content: "\f31a"; }

.la-star-o:before {
  content: "\f31b"; }

.la-steam:before {
  content: "\f31c"; }

.la-steam-square:before {
  content: "\f31d"; }

.la-step-backward:before {
  content: "\f31e"; }

.la-step-forward:before {
  content: "\f31f"; }

.la-stethoscope:before {
  content: "\f320"; }

.la-sticky-note:before {
  content: "\f321"; }

.la-sticky-note-o:before {
  content: "\f322"; }

.la-stop:before {
  content: "\f323"; }

.la-street-view:before {
  content: "\f324"; }

.la-strikethrough:before {
  content: "\f325"; }

.la-stumbleupon:before {
  content: "\f326"; }

.la-stumbleupon-circle:before {
  content: "\f327"; }

.la-subscript:before {
  content: "\f328"; }

.la-subway:before {
  content: "\f329"; }

.la-suitcase:before {
  content: "\f32a"; }

.la-sun-o:before {
  content: "\f32b"; }

.la-superscript:before {
  content: "\f32c"; }

.la-table:before {
  content: "\f32d"; }

.la-tablet:before {
  content: "\f32e"; }

.la-tachometer:before {
  content: "\f32f"; }

.la-tag:before {
  content: "\f330"; }

.la-tags:before {
  content: "\f331"; }

.la-tasks:before {
  content: "\f332"; }

.la-taxi:before {
  content: "\f333"; }

.la-television:before, .la-tv:before {
  content: "\f334"; }

.la-tencent-weibo:before {
  content: "\f335"; }

.la-terminal:before {
  content: "\f336"; }

.la-text-height:before {
  content: "\f337"; }

.la-text-width:before {
  content: "\f338"; }

.la-th:before {
  content: "\f339"; }

.la-th-large:before {
  content: "\f33a"; }

.la-th-list:before {
  content: "\f33b"; }

.la-thumb-tack:before {
  content: "\f33c"; }

.la-thumbs-down:before {
  content: "\f33d"; }

.la-thumbs-o-down:before {
  content: "\f33e"; }

.la-thumbs-o-up:before {
  content: "\f33f"; }

.la-thumbs-up:before {
  content: "\f340"; }

.la-ticket:before {
  content: "\f341"; }

.la-times:before, .la-remove:before {
  content: "\f342"; }

.la-times-circle:before {
  content: "\f343"; }

.la-times-circle-o:before {
  content: "\f344"; }

.la-tint:before {
  content: "\f345"; }

.la-toggle-off:before {
  content: "\f346"; }

.la-toggle-on:before {
  content: "\f347"; }

.la-trademark:before {
  content: "\f348"; }

.la-train:before {
  content: "\f349"; }

.la-transgender:before, .la-intersex:before {
  content: "\f34a"; }

.la-transgender-alt:before {
  content: "\f34b"; }

.la-trash:before {
  content: "\f34c"; }

.la-trash-o:before {
  content: "\f34d"; }

.la-tree:before {
  content: "\f34e"; }

.la-trello:before {
  content: "\f34f"; }

.la-tripadvisor:before {
  content: "\f350"; }

.la-trophy:before {
  content: "\f351"; }

.la-truck:before {
  content: "\f352"; }

.la-try:before {
  content: "\f353"; }

.la-tty:before {
  content: "\f354"; }

.la-tumblr:before {
  content: "\f355"; }

.la-tumblr-square:before {
  content: "\f356"; }

.la-turkish-lira:before {
  content: "\f357"; }

.la-twitch:before {
  content: "\f358"; }

.la-twitter:before {
  content: "\f359"; }

.la-twitter-square:before {
  content: "\f35a"; }

.la-umbrella:before {
  content: "\f35b"; }

.la-underline:before {
  content: "\f35c"; }

.la-undo:before {
  content: "\f35d"; }

.la-university:before {
  content: "\f35e"; }

.la-unlink:before {
  content: "\f35f"; }

.la-unlock:before {
  content: "\f360"; }

.la-unlock-alt:before {
  content: "\f361"; }

.la-upload:before {
  content: "\f362"; }

.la-usd:before {
  content: "\f363"; }

.la-user:before {
  content: "\f364"; }

.la-user-md:before {
  content: "\f365"; }

.la-user-plus:before {
  content: "\f366"; }

.la-user-secret:before {
  content: "\f367"; }

.la-user-times:before {
  content: "\f368"; }

.la-users:before {
  content: "\f369"; }

.la-venus:before {
  content: "\f36a"; }

.la-venus-double:before {
  content: "\f36b"; }

.la-venus-mars:before {
  content: "\f36c"; }

.la-viacoin:before {
  content: "\f36d"; }

.la-video-camera:before {
  content: "\f36e"; }

.la-vimeo:before {
  content: "\f36f"; }

.la-vimeo-square:before {
  content: "\f370"; }

.la-vine:before {
  content: "\f371"; }

.la-vk:before {
  content: "\f372"; }

.la-volume-down:before {
  content: "\f373"; }

.la-volume-off:before {
  content: "\f374"; }

.la-volume-up:before {
  content: "\f375"; }

.la-warning:before {
  content: "\f376"; }

.la-wechat:before {
  content: "\f377"; }

.la-weibo:before {
  content: "\f378"; }

.la-weixin:before {
  content: "\f379"; }

.la-whatsapp:before {
  content: "\f37a"; }

.la-wheelchair:before {
  content: "\f37b"; }

.la-wifi:before {
  content: "\f37c"; }

.la-wikipedia-w:before {
  content: "\f37d"; }

.la-windows:before {
  content: "\f37e"; }

.la-won:before {
  content: "\f37f"; }

.la-wordpress:before {
  content: "\f380"; }

.la-wrench:before {
  content: "\f381"; }

.la-xing:before {
  content: "\f382"; }

.la-xing-square:before {
  content: "\f383"; }

.la-y-combinator:before {
  content: "\f384"; }

.la-y-combinator-square:before {
  content: "\f385"; }

.la-yahoo:before {
  content: "\f386"; }

.la-yc:before {
  content: "\f387"; }

.la-yc-square:before {
  content: "\f388"; }

.la-yelp:before {
  content: "\f389"; }

.la-yen:before {
  content: "\f38a"; }

.la-youtube:before {
  content: "\f38b"; }

.la-youtube-play:before {
  content: "\f38c"; }

.la-youtube-square:before {
  content: "\f38d"; }

/*! tailwindcss v4.2.0 | MIT License | https://tailwindcss.com */
@layer properties;
@layer theme, base, components, utilities;
@layer theme {
  :root, :host {
    --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
      "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
      "Courier New", monospace;
    --color-red-50: oklch(97.1% 0.013 17.38);
    --color-red-100: oklch(93.6% 0.032 17.717);
    --color-red-500: oklch(63.7% 0.237 25.331);
    --color-red-600: oklch(57.7% 0.245 27.325);
    --color-red-700: oklch(50.5% 0.213 27.518);
    --color-red-800: oklch(44.4% 0.177 26.899);
    --color-red-950: oklch(25.8% 0.092 26.042);
    --color-orange-100: oklch(95.4% 0.038 75.164);
    --color-orange-200: oklch(90.1% 0.076 70.697);
    --color-orange-400: oklch(75% 0.183 55.934);
    --color-orange-950: oklch(26.6% 0.079 36.259);
    --color-yellow-50: oklch(98.7% 0.026 102.212);
    --color-yellow-100: oklch(97.3% 0.071 103.193);
    --color-yellow-200: oklch(94.5% 0.129 101.54);
    --color-yellow-400: oklch(85.2% 0.199 91.936);
    --color-yellow-500: oklch(79.5% 0.184 86.047);
    --color-yellow-600: oklch(68.1% 0.162 75.834);
    --color-yellow-700: oklch(55.4% 0.135 66.442);
    --color-yellow-800: oklch(47.6% 0.114 61.907);
    --color-yellow-950: oklch(28.6% 0.066 53.813);
    --color-green-50: oklch(98.2% 0.018 155.826);
    --color-green-100: oklch(96.2% 0.044 156.743);
    --color-green-200: oklch(92.5% 0.084 155.995);
    --color-green-500: oklch(72.3% 0.219 149.579);
    --color-green-600: oklch(62.7% 0.194 149.214);
    --color-green-700: oklch(52.7% 0.154 150.069);
    --color-green-800: oklch(44.8% 0.119 151.328);
    --color-green-950: oklch(26.6% 0.065 152.934);
    --color-blue-50: oklch(97% 0.014 254.604);
    --color-blue-100: oklch(93.2% 0.032 255.585);
    --color-blue-500: oklch(62.3% 0.214 259.815);
    --color-blue-600: oklch(54.6% 0.245 262.881);
    --color-blue-700: oklch(48.8% 0.243 264.376);
    --color-blue-800: oklch(42.4% 0.199 265.638);
    --color-blue-950: oklch(28.2% 0.091 267.935);
    --color-violet-50: oklch(96.9% 0.016 293.756);
    --color-violet-100: oklch(94.3% 0.029 294.588);
    --color-violet-200: oklch(89.4% 0.057 293.283);
    --color-violet-500: oklch(60.6% 0.25 292.717);
    --color-violet-600: oklch(54.1% 0.281 293.009);
    --color-violet-700: oklch(49.1% 0.27 292.581);
    --color-violet-800: oklch(43.2% 0.232 292.759);
    --color-violet-950: oklch(28.3% 0.141 291.089);
    --color-gray-50: oklch(98.5% 0.002 247.839);
    --color-gray-200: oklch(92.8% 0.006 264.531);
    --color-gray-400: oklch(70.7% 0.022 261.325);
    --color-gray-500: oklch(55.1% 0.027 264.364);
    --color-gray-600: oklch(44.6% 0.03 256.802);
    --color-gray-700: oklch(37.3% 0.034 259.733);
    --color-zinc-50: oklch(98.5% 0 0);
    --color-zinc-100: oklch(96.7% 0.001 286.375);
    --color-zinc-200: oklch(92% 0.004 286.32);
    --color-zinc-300: oklch(87.1% 0.006 286.286);
    --color-zinc-400: oklch(70.5% 0.015 286.067);
    --color-zinc-500: oklch(55.2% 0.016 285.938);
    --color-zinc-600: oklch(44.2% 0.017 285.786);
    --color-zinc-800: oklch(27.4% 0.006 286.033);
    --color-zinc-900: oklch(21% 0.006 285.885);
    --color-zinc-950: oklch(14.1% 0.005 285.823);
    --color-neutral-200: oklch(92.2% 0 0);
    --color-neutral-700: oklch(37.1% 0 0);
    --color-black: #000;
    --color-white: #fff;
    --spacing: 0.25rem;
    --breakpoint-sm: 40rem;
    --breakpoint-md: 48rem;
    --breakpoint-lg: 64rem;
    --breakpoint-xl: 80rem;
    --breakpoint-2xl: 96rem;
    --container-2xl: 42rem;
    --text-xs: 0.75rem;
    --text-xs--line-height: calc(1 / 0.75);
    --text-sm: 0.875rem;
    --text-sm--line-height: calc(1.25 / 0.875);
    --text-base: 1rem;
    --text-base--line-height: calc(1.5 / 1);
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
    --text-xl: 1.25rem;
    --text-xl--line-height: calc(1.75 / 1.25);
    --text-2xl: 1.5rem;
    --text-2xl--line-height: calc(2 / 1.5);
    --text-3xl: 1.875rem;
    --text-3xl--line-height: calc(2.25 / 1.875);
    --text-4xl: 2.25rem;
    --text-4xl--line-height: calc(2.5 / 2.25);
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --tracking-tight: -0.025em;
    --leading-tight: 1.25;
    --leading-normal: 1.5;
    --leading-relaxed: 1.625;
    --radius-xs: 0.125rem;
    --radius-sm: calc(var(--radius) - 4px);
    --radius-md: calc(var(--radius) - 2px);
    --radius-lg: var(--radius);
    --radius-xl: calc(var(--radius) + 4px);
    --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
    --animate-spin: spin 1s linear infinite;
    --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
    --blur-md: 12px;
    --aspect-video: 16 / 9;
    --default-transition-duration: 150ms;
    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
    --color-background: var(--background);
    --color-popover: var(--popover);
    --color-muted-foreground: var(--muted-foreground);
    --color-accent: var(--accent);
    --color-primary: var(--primary);
    --color-primary-foreground: var(--primary-foreground);
    --color-secondary-foreground: var(--secondary-foreground);
    --color-destructive: var(--destructive);
    --color-mono: var(--mono);
    --color-border: var(--border);
    --color-input: var(--input);
    --text-2sm: 0.8125rem;
    --text-2sm--line-height: calc(1.075 / 0.8125);
    --text-2xs: 0.6875rem;
    --text-2xs--line-height: calc(0.825 / 0.6875);
  }
}
@layer base {
  *, ::after, ::before, ::backdrop, ::file-selector-button {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0 solid;
  }
  html, :host {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
  }
  hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
  }
  abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
  }
  h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit;
  }
  a {
    color: inherit;
    -webkit-text-decoration: inherit;
    text-decoration: inherit;
  }
  b, strong {
    font-weight: bolder;
  }
  code, kbd, samp, pre {
    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
    font-feature-settings: var(--default-mono-font-feature-settings, normal);
    font-variation-settings: var(--default-mono-font-variation-settings, normal);
    font-size: 1em;
  }
  small {
    font-size: 80%;
  }
  sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  sub {
    bottom: -0.25em;
  }
  sup {
    top: -0.5em;
  }
  table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse;
  }
  :-moz-focusring {
    outline: auto;
  }
  progress {
    vertical-align: baseline;
  }
  summary {
    display: list-item;
  }
  ol, ul, menu {
    list-style: none;
  }
  img, svg, video, canvas, audio, iframe, embed, object {
    display: block;
    vertical-align: middle;
  }
  img, video {
    max-width: 100%;
    height: auto;
  }
  button, input, select, optgroup, textarea, ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    border-radius: 0;
    background-color: transparent;
    opacity: 1;
  }
  :where(select:is([multiple], [size])) optgroup {
    font-weight: bolder;
  }
  :where(select:is([multiple], [size])) optgroup option {
    padding-inline-start: 20px;
  }
  ::file-selector-button {
    margin-inline-end: 4px;
  }
  ::placeholder {
    opacity: 1;
  }
  @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {
    ::placeholder {
      color: currentcolor;
    }
      @supports (color: color-mix(in lab, red, red)) {
    ::placeholder {
        color: color-mix(in oklab, currentcolor 50%, transparent);
    }
      }
  }
  textarea {
    resize: vertical;
  }
  ::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  ::-webkit-date-and-time-value {
    min-height: 1lh;
    text-align: inherit;
  }
  ::-webkit-datetime-edit {
    display: inline-flex;
  }
  ::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
  }
  ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
    padding-block: 0;
  }
  ::-webkit-calendar-picker-indicator {
    line-height: 1;
  }
  :-moz-ui-invalid {
    box-shadow: none;
  }
  button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button {
    appearance: button;
  }
  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
    height: auto;
  }
  [hidden]:where(:not([hidden="until-found"])) {
    display: none !important;
  }
}
@layer utilities {
  .collapse {
    visibility: collapse;
  }
  .invisible {
    visibility: hidden;
  }
  .visible {
    visibility: visible;
  }
  .absolute {
    position: absolute;
  }
  .fixed {
    position: fixed;
  }
  .relative {
    position: relative;
  }
  .static {
    position: static;
  }
  .sticky {
    position: sticky;
  }
  .\!start {
    inset-inline-start: var(--spacing) !important;
  }
  .-start {
    inset-inline-start: calc(var(--spacing) * -1);
  }
  .-start-\[3px\] {
    inset-inline-start: calc(3px * -1);
  }
  .start {
    inset-inline-start: var(--spacing);
  }
  .start-\(--sidebar-width\) {
    inset-inline-start: var(--sidebar-width);
  }
  .start-0 {
    inset-inline-start: calc(var(--spacing) * 0);
  }
  .start-1\/2 {
    inset-inline-start: calc(1/2 * 100%);
  }
  .start-2\/4 {
    inset-inline-start: calc(2/4 * 100%);
  }
  .start-3 {
    inset-inline-start: calc(var(--spacing) * 3);
  }
  .start-16 {
    inset-inline-start: calc(var(--spacing) * 16);
  }
  .start-\[93px\] {
    inset-inline-start: 93px;
  }
  .start-full {
    inset-inline-start: 100%;
  }
  .-end {
    inset-inline-end: calc(var(--spacing) * -1);
  }
  .-end-0\.5 {
    inset-inline-end: calc(var(--spacing) * -0.5);
  }
  .-end-1 {
    inset-inline-end: calc(var(--spacing) * -1);
  }
  .-end-2 {
    inset-inline-end: calc(var(--spacing) * -2);
  }
  .end {
    inset-inline-end: var(--spacing);
  }
  .end-0 {
    inset-inline-end: calc(var(--spacing) * 0);
  }
  .end-2 {
    inset-inline-end: calc(var(--spacing) * 2);
  }
  .end-3 {
    inset-inline-end: calc(var(--spacing) * 3);
  }
  .end-4 {
    inset-inline-end: calc(var(--spacing) * 4);
  }
  .end-5 {
    inset-inline-end: calc(var(--spacing) * 5);
  }
  .-top-0\.5 {
    top: calc(var(--spacing) * -0.5);
  }
  .-top-1 {
    top: calc(var(--spacing) * -1);
  }
  .top-\(--header-height\) {
    top: var(--header-height);
  }
  .top-0 {
    top: calc(var(--spacing) * 0);
  }
  .top-1\/2 {
    top: calc(1 / 2 * 100%);
  }
  .top-2 {
    top: calc(var(--spacing) * 2);
  }
  .top-2\/4 {
    top: calc(2 / 4 * 100%);
  }
  .top-4 {
    top: calc(var(--spacing) * 4);
  }
  .top-5 {
    top: calc(var(--spacing) * 5);
  }
  .top-9 {
    top: calc(var(--spacing) * 9);
  }
  .top-\[1\.5rem\] {
    top: 1.5rem;
  }
  .top-\[3rem\] {
    top: 3rem;
  }
  .top-\[15\%\] {
    top: 15%;
  }
  .top-\[15px\] {
    top: 15px;
  }
  .top-\[17px\] {
    top: 17px;
  }
  .top-\[calc\(var\(--header-height\)\+1\.5rem\)\] {
    top: calc(var(--header-height) + 1.5rem);
  }
  .top-\[calc\(var\(--header-height\)\+1rem\)\] {
    top: calc(var(--header-height) + 1rem);
  }
  .top-\[calc\(var\(--header-height\)\+var\(--navbar-height\)\+1rem\)\] {
    top: calc(var(--header-height) + var(--navbar-height) + 1rem);
  }
  .right-0 {
    right: calc(var(--spacing) * 0);
  }
  .-bottom-2 {
    bottom: calc(var(--spacing) * -2);
  }
  .bottom-0 {
    bottom: calc(var(--spacing) * 0);
  }
  .bottom-0\.5 {
    bottom: calc(var(--spacing) * 0.5);
  }
  .bottom-2 {
    bottom: calc(var(--spacing) * 2);
  }
  .bottom-4 {
    bottom: calc(var(--spacing) * 4);
  }
  .bottom-5 {
    bottom: calc(var(--spacing) * 5);
  }
  .left-0 {
    left: calc(var(--spacing) * 0);
  }
  .left-1\/2 {
    left: calc(1 / 2 * 100%);
  }
  .left-2\/4 {
    left: calc(2 / 4 * 100%);
  }
  .left-6 {
    left: calc(var(--spacing) * 6);
  }
  .left-\[2\.2px\] {
    left: 2.2px;
  }
  .left-\[2px\] {
    left: 2px;
  }
  .left-auto {
    left: auto;
  }
  .z-0 {
    z-index: 0;
  }
  .z-1 {
    z-index: 1;
  }
  .z-4 {
    z-index: 4;
  }
  .z-5 {
    z-index: 5;
  }
  .z-10 {
    z-index: 10;
  }
  .z-20 {
    z-index: 20;
  }
  .z-40 {
    z-index: 40;
  }
  .order-1 {
    order: 1;
  }
  .order-2 {
    order: 2;
  }
  .col-span-1 {
    grid-column: span 1 / span 1;
  }
  .col-span-2 {
    grid-column: span 2 / span 2;
  }
  .container {
    width: 100%;
  }
    @media (width >= 40rem) {
  .container {
      max-width: 40rem;
  }
    }
    @media (width >= 48rem) {
  .container {
      max-width: 48rem;
  }
    }
    @media (width >= 64rem) {
  .container {
      max-width: 64rem;
  }
    }
    @media (width >= 80rem) {
  .container {
      max-width: 80rem;
  }
    }
    @media (width >= 96rem) {
  .container {
      max-width: 96rem;
  }
    }
  .m-5 {
    margin: calc(var(--spacing) * 5);
  }
  .m-\[15px\] {
    margin: 15px;
  }
  .mx-1 {
    margin-inline: calc(var(--spacing) * 1);
  }
  .mx-1\.5 {
    margin-inline: calc(var(--spacing) * 1.5);
  }
  .mx-2 {
    margin-inline: calc(var(--spacing) * 2);
  }
  .mx-3\.5 {
    margin-inline: calc(var(--spacing) * 3.5);
  }
  .mx-4 {
    margin-inline: calc(var(--spacing) * 4);
  }
  .mx-5 {
    margin-inline: calc(var(--spacing) * 5);
  }
  .mx-7\.5 {
    margin-inline: calc(var(--spacing) * 7.5);
  }
  .mx-auto {
    margin-inline: auto;
  }
  .my-0\.5 {
    margin-block: calc(var(--spacing) * 0.5);
  }
  .my-1 {
    margin-block: calc(var(--spacing) * 1);
  }
  .my-1\.5 {
    margin-block: calc(var(--spacing) * 1.5);
  }
  .my-2 {
    margin-block: calc(var(--spacing) * 2);
  }
  .my-2\.5 {
    margin-block: calc(var(--spacing) * 2.5);
  }
  .my-3 {
    margin-block: calc(var(--spacing) * 3);
  }
  .my-5 {
    margin-block: calc(var(--spacing) * 5);
  }
  .my-7\.5 {
    margin-block: calc(var(--spacing) * 7.5);
  }
  .my-\[3\%\] {
    margin-block: 3%;
  }
  .-ms-1 {
    margin-inline-start: calc(var(--spacing) * -1);
  }
  .-ms-2 {
    margin-inline-start: calc(var(--spacing) * -2);
  }
  .-ms-2\.5 {
    margin-inline-start: calc(var(--spacing) * -2.5);
  }
  .-ms-5 {
    margin-inline-start: calc(var(--spacing) * -5);
  }
  .ms-1 {
    margin-inline-start: calc(var(--spacing) * 1);
  }
  .ms-2 {
    margin-inline-start: calc(var(--spacing) * 2);
  }
  .ms-2\.5 {
    margin-inline-start: calc(var(--spacing) * 2.5);
  }
  .ms-5 {
    margin-inline-start: calc(var(--spacing) * 5);
  }
  .ms-7\.5 {
    margin-inline-start: calc(var(--spacing) * 7.5);
  }
  .ms-auto {
    margin-inline-start: auto;
  }
  .-me-1 {
    margin-inline-end: calc(var(--spacing) * -1);
  }
  .-me-1\.5 {
    margin-inline-end: calc(var(--spacing) * -1.5);
  }
  .-me-2 {
    margin-inline-end: calc(var(--spacing) * -2);
  }
  .me-0\.5 {
    margin-inline-end: calc(var(--spacing) * 0.5);
  }
  .me-1 {
    margin-inline-end: calc(var(--spacing) * 1);
  }
  .me-1\.5 {
    margin-inline-end: calc(var(--spacing) * 1.5);
  }
  .me-1\.25 {
    margin-inline-end: calc(var(--spacing) * 1.25);
  }
  .me-2 {
    margin-inline-end: calc(var(--spacing) * 2);
  }
  .me-2\.5 {
    margin-inline-end: calc(var(--spacing) * 2.5);
  }
  .me-3 {
    margin-inline-end: calc(var(--spacing) * 3);
  }
  .me-5 {
    margin-inline-end: calc(var(--spacing) * 5);
  }
  .me-\[-10px\] {
    margin-inline-end: -10px;
  }
  .\!mt-\[30px\] {
    margin-top: 30px !important;
  }
  .-mt-0\.5 {
    margin-top: calc(var(--spacing) * -0.5);
  }
  .-mt-1 {
    margin-top: calc(var(--spacing) * -1);
  }
  .-mt-3 {
    margin-top: calc(var(--spacing) * -3);
  }
  .-mt-7\.5 {
    margin-top: calc(var(--spacing) * -7.5);
  }
  .-mt-8 {
    margin-top: calc(var(--spacing) * -8);
  }
  .-mt-px {
    margin-top: -1px;
  }
  .mt-0 {
    margin-top: calc(var(--spacing) * 0);
  }
  .mt-1 {
    margin-top: calc(var(--spacing) * 1);
  }
  .mt-2 {
    margin-top: calc(var(--spacing) * 2);
  }
  .mt-2\.5 {
    margin-top: calc(var(--spacing) * 2.5);
  }
  .mt-3 {
    margin-top: calc(var(--spacing) * 3);
  }
  .mt-4 {
    margin-top: calc(var(--spacing) * 4);
  }
  .mt-5 {
    margin-top: calc(var(--spacing) * 5);
  }
  .mt-6 {
    margin-top: calc(var(--spacing) * 6);
  }
  .mt-7 {
    margin-top: calc(var(--spacing) * 7);
  }
  .mt-\[2px\] {
    margin-top: 2px;
  }
  .mt-\[7px\] {
    margin-top: 7px;
  }
  .mr-1 {
    margin-right: calc(var(--spacing) * 1);
  }
  .mr-5 {
    margin-right: calc(var(--spacing) * 5);
  }
  .mb-0\.5 {
    margin-bottom: calc(var(--spacing) * 0.5);
  }
  .mb-1 {
    margin-bottom: calc(var(--spacing) * 1);
  }
  .mb-1\.5 {
    margin-bottom: calc(var(--spacing) * 1.5);
  }
  .mb-2 {
    margin-bottom: calc(var(--spacing) * 2);
  }
  .mb-2\.5 {
    margin-bottom: calc(var(--spacing) * 2.5);
  }
  .mb-3 {
    margin-bottom: calc(var(--spacing) * 3);
  }
  .mb-3\.5 {
    margin-bottom: calc(var(--spacing) * 3.5);
  }
  .mb-4 {
    margin-bottom: calc(var(--spacing) * 4);
  }
  .mb-4\.5 {
    margin-bottom: calc(var(--spacing) * 4.5);
  }
  .mb-5 {
    margin-bottom: calc(var(--spacing) * 5);
  }
  .mb-6\.5 {
    margin-bottom: calc(var(--spacing) * 6.5);
  }
  .mb-7 {
    margin-bottom: calc(var(--spacing) * 7);
  }
  .mb-7\.5 {
    margin-bottom: calc(var(--spacing) * 7.5);
  }
  .mb-8 {
    margin-bottom: calc(var(--spacing) * 8);
  }
  .mb-9 {
    margin-bottom: calc(var(--spacing) * 9);
  }
  .mb-10 {
    margin-bottom: calc(var(--spacing) * 10);
  }
  .mb-12 {
    margin-bottom: calc(var(--spacing) * 12);
  }
  .mb-16 {
    margin-bottom: calc(var(--spacing) * 16);
  }
  .mb-px {
    margin-bottom: 1px;
  }
  .-ml-1 {
    margin-left: calc(var(--spacing) * -1);
  }
  .ml-5 {
    margin-left: calc(var(--spacing) * 5);
  }
  .block {
    display: block;
  }
  .contents {
    display: contents;
  }
  .flex {
    display: flex;
  }
  .grid {
    display: grid;
  }
  .hidden {
    display: none;
  }
  .inline {
    display: inline;
  }
  .inline-block {
    display: inline-block;
  }
  .inline-flex {
    display: inline-flex;
  }
  .list-item {
    display: list-item;
  }
  .table {
    display: table;
  }
  .table-caption {
    display: table-caption;
  }
  .table-cell {
    display: table-cell;
  }
  .table-row {
    display: table-row;
  }
  .aspect-video {
    aspect-ratio: var(--aspect-video);
  }
  .size-0\.75 {
    width: calc(var(--spacing) * 0.75);
    height: calc(var(--spacing) * 0.75);
  }
  .size-1 {
    width: calc(var(--spacing) * 1);
    height: calc(var(--spacing) * 1);
  }
  .size-1\.5 {
    width: calc(var(--spacing) * 1.5);
    height: calc(var(--spacing) * 1.5);
  }
  .size-2 {
    width: calc(var(--spacing) * 2);
    height: calc(var(--spacing) * 2);
  }
  .size-2\.5 {
    width: calc(var(--spacing) * 2.5);
    height: calc(var(--spacing) * 2.5);
  }
  .size-3 {
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
  }
  .size-3\.5 {
    width: calc(var(--spacing) * 3.5);
    height: calc(var(--spacing) * 3.5);
  }
  .size-4 {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }
  .size-5 {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }
  .size-6 {
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
  }
  .size-7 {
    width: calc(var(--spacing) * 7);
    height: calc(var(--spacing) * 7);
  }
  .size-7\.5 {
    width: calc(var(--spacing) * 7.5);
    height: calc(var(--spacing) * 7.5);
  }
  .size-8 {
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
  }
  .size-9 {
    width: calc(var(--spacing) * 9);
    height: calc(var(--spacing) * 9);
  }
  .size-10 {
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
  }
  .size-11 {
    width: calc(var(--spacing) * 11);
    height: calc(var(--spacing) * 11);
  }
  .size-12 {
    width: calc(var(--spacing) * 12);
    height: calc(var(--spacing) * 12);
  }
  .size-14 {
    width: calc(var(--spacing) * 14);
    height: calc(var(--spacing) * 14);
  }
  .size-15 {
    width: calc(var(--spacing) * 15);
    height: calc(var(--spacing) * 15);
  }
  .size-16 {
    width: calc(var(--spacing) * 16);
    height: calc(var(--spacing) * 16);
  }
  .size-20 {
    width: calc(var(--spacing) * 20);
    height: calc(var(--spacing) * 20);
  }
  .size-48 {
    width: calc(var(--spacing) * 48);
    height: calc(var(--spacing) * 48);
  }
  .size-80 {
    width: calc(var(--spacing) * 80);
    height: calc(var(--spacing) * 80);
  }
  .size-\[5px\] {
    width: 5px;
    height: 5px;
  }
  .size-\[11px\] {
    width: 11px;
    height: 11px;
  }
  .size-\[18px\] {
    width: 18px;
    height: 18px;
  }
  .size-\[30px\] {
    width: 30px;
    height: 30px;
  }
  .size-\[34px\] {
    width: 34px;
    height: 34px;
  }
  .size-\[44px\] {
    width: 44px;
    height: 44px;
  }
  .size-\[45px\] {
    width: 45px;
    height: 45px;
  }
  .size-\[50px\] {
    width: 50px;
    height: 50px;
  }
  .size-\[60px\] {
    width: 60px;
    height: 60px;
  }
  .size-\[70px\] {
    width: 70px;
    height: 70px;
  }
  .size-\[90px\] {
    width: 90px;
    height: 90px;
  }
  .size-\[100px\] {
    width: 100px;
    height: 100px;
  }
  .size-\[120px\] {
    width: 120px;
    height: 120px;
  }
  .size-\[140px\] {
    width: 140px;
    height: 140px;
  }
  .h-\(--header-height\) {
    height: var(--header-height);
  }
  .h-\(--navbar-height\) {
    height: var(--navbar-height);
  }
  .h-1 {
    height: calc(var(--spacing) * 1);
  }
  .h-1\.5 {
    height: calc(var(--spacing) * 1.5);
  }
  .h-2 {
    height: calc(var(--spacing) * 2);
  }
  .h-3\.5 {
    height: calc(var(--spacing) * 3.5);
  }
  .h-4 {
    height: calc(var(--spacing) * 4);
  }
  .h-5 {
    height: calc(var(--spacing) * 5);
  }
  .h-6 {
    height: calc(var(--spacing) * 6);
  }
  .h-7 {
    height: calc(var(--spacing) * 7);
  }
  .h-8\.5 {
    height: calc(var(--spacing) * 8.5);
  }
  .h-9 {
    height: calc(var(--spacing) * 9);
  }
  .h-10 {
    height: calc(var(--spacing) * 10);
  }
  .h-11 {
    height: calc(var(--spacing) * 11);
  }
  .h-12 {
    height: calc(var(--spacing) * 12);
  }
  .h-20 {
    height: calc(var(--spacing) * 20);
  }
  .h-24 {
    height: calc(var(--spacing) * 24);
  }
  .h-40 {
    height: calc(var(--spacing) * 40);
  }
  .h-44 {
    height: calc(var(--spacing) * 44);
  }
  .h-48 {
    height: calc(var(--spacing) * 48);
  }
  .h-56 {
    height: calc(var(--spacing) * 56);
  }
  .h-\[1\.875rem\] {
    height: 1.875rem;
  }
  .h-\[4px\] {
    height: 4px;
  }
  .h-\[8px\] {
    height: 8px;
  }
  .h-\[12px\] {
    height: 12px;
  }
  .h-\[22px\] {
    height: 22px;
  }
  .h-\[28px\] {
    height: 28px;
  }
  .h-\[30px\] {
    height: 30px;
  }
  .h-\[35px\] {
    height: 35px;
  }
  .h-\[36px\] {
    height: 36px;
  }
  .h-\[42px\] {
    height: 42px;
  }
  .h-\[45px\] {
    height: 45px;
  }
  .h-\[50px\] {
    height: 50px;
  }
  .h-\[60px\] {
    height: 60px;
  }
  .h-\[70px\] {
    height: 70px;
  }
  .h-\[95\%\] {
    height: 95%;
  }
  .h-\[100px\] {
    height: 100px;
  }
  .h-\[120px\] {
    height: 120px;
  }
  .h-\[140px\] {
    height: 140px;
  }
  .h-\[170px\] {
    height: 170px;
  }
  .h-\[180px\] {
    height: 180px;
  }
  .h-\[240px\] {
    height: 240px;
  }
  .h-\[250px\] {
    height: 250px;
  }
  .h-\[280px\] {
    height: 280px;
  }
  .h-auto {
    height: auto;
  }
  .h-full {
    height: 100%;
  }
  .h-px {
    height: 1px;
  }
  .max-h-5 {
    max-height: calc(var(--spacing) * 5);
  }
  .max-h-20 {
    max-height: calc(var(--spacing) * 20);
  }
  .max-h-36 {
    max-height: calc(var(--spacing) * 36);
  }
  .max-h-44 {
    max-height: calc(var(--spacing) * 44);
  }
  .max-h-\[25px\] {
    max-height: 25px;
  }
  .max-h-\[50vh\] {
    max-height: 50vh;
  }
  .max-h-\[55px\] {
    max-height: 55px;
  }
  .max-h-\[100px\] {
    max-height: 100px;
  }
  .max-h-\[113px\] {
    max-height: 113px;
  }
  .max-h-\[120px\] {
    max-height: 120px;
  }
  .max-h-\[130px\] {
    max-height: 130px;
  }
  .max-h-\[140px\] {
    max-height: 140px;
  }
  .max-h-\[150px\] {
    max-height: 150px;
  }
  .max-h-\[160px\] {
    max-height: 160px;
  }
  .max-h-\[170px\] {
    max-height: 170px;
  }
  .max-h-\[180px\] {
    max-height: 180px;
  }
  .max-h-\[200px\] {
    max-height: 200px;
  }
  .max-h-\[230px\] {
    max-height: 230px;
  }
  .max-h-\[250px\] {
    max-height: 250px;
  }
  .max-h-\[300px\] {
    max-height: 300px;
  }
  .max-h-\[400px\] {
    max-height: 400px;
  }
  .max-h-\[calc\(100dvh-10px\)\)\] {
    max-height: calc(100dvh - 10px);
  }
  .min-h-8\.5 {
    min-height: calc(var(--spacing) * 8.5);
  }
  .min-h-52 {
    min-height: calc(var(--spacing) * 52);
  }
  .min-h-80 {
    min-height: calc(var(--spacing) * 80);
  }
  .min-h-\[22px\] {
    min-height: 22px;
  }
  .min-h-\[24px\] {
    min-height: 24px;
  }
  .min-h-\[30px\] {
    min-height: 30px;
  }
  .min-h-\[34px\] {
    min-height: 34px;
  }
  .min-h-\[42px\] {
    min-height: 42px;
  }
  .min-h-\[44px\] {
    min-height: 44px;
  }
  .min-h-\[200px\] {
    min-height: 200px;
  }
  .min-h-\[340px\] {
    min-height: 340px;
  }
  .min-h-\[400px\] {
    min-height: 400px;
  }
  .min-h-\[600px\] {
    min-height: 600px;
  }
  .w-\(--sidebar-width\) {
    width: var(--sidebar-width);
  }
  .w-1\.5 {
    width: calc(var(--spacing) * 1.5);
  }
  .w-5 {
    width: calc(var(--spacing) * 5);
  }
  .w-7 {
    width: calc(var(--spacing) * 7);
  }
  .w-8 {
    width: calc(var(--spacing) * 8);
  }
  .w-9 {
    width: calc(var(--spacing) * 9);
  }
  .w-10 {
    width: calc(var(--spacing) * 10);
  }
  .w-11 {
    width: calc(var(--spacing) * 11);
  }
  .w-12 {
    width: calc(var(--spacing) * 12);
  }
  .w-14 {
    width: calc(var(--spacing) * 14);
  }
  .w-16 {
    width: calc(var(--spacing) * 16);
  }
  .w-20 {
    width: calc(var(--spacing) * 20);
  }
  .w-24 {
    width: calc(var(--spacing) * 24);
  }
  .w-28 {
    width: calc(var(--spacing) * 28);
  }
  .w-32 {
    width: calc(var(--spacing) * 32);
  }
  .w-36 {
    width: calc(var(--spacing) * 36);
  }
  .w-40 {
    width: calc(var(--spacing) * 40);
  }
  .w-48 {
    width: calc(var(--spacing) * 48);
  }
  .w-52 {
    width: calc(var(--spacing) * 52);
  }
  .w-56 {
    width: calc(var(--spacing) * 56);
  }
  .w-80 {
    width: calc(var(--spacing) * 80);
  }
  .w-\[1\.875rem\] {
    width: 1.875rem;
  }
  .w-\[2px\] {
    width: 2px;
  }
  .w-\[6px\] {
    width: 6px;
  }
  .w-\[20px\] {
    width: 20px;
  }
  .w-\[26px\] {
    width: 26px;
  }
  .w-\[30px\] {
    width: 30px;
  }
  .w-\[40px\] {
    width: 40px;
  }
  .w-\[50px\] {
    width: 50px;
  }
  .w-\[55px\] {
    width: 55px;
  }
  .w-\[60px\] {
    width: 60px;
  }
  .w-\[62px\] {
    width: 62px;
  }
  .w-\[70px\] {
    width: 70px;
  }
  .w-\[75px\] {
    width: 75px;
  }
  .w-\[80px\] {
    width: 80px;
  }
  .w-\[90\%\] {
    width: 90%;
  }
  .w-\[90px\] {
    width: 90px;
  }
  .w-\[100px\] {
    width: 100px;
  }
  .w-\[105px\] {
    width: 105px;
  }
  .w-\[110px\] {
    width: 110px;
  }
  .w-\[120px\] {
    width: 120px;
  }
  .w-\[125px\] {
    width: 125px;
  }
  .w-\[135px\] {
    width: 135px;
  }
  .w-\[150px\] {
    width: 150px;
  }
  .w-\[170px\] {
    width: 170px;
  }
  .w-\[175px\] {
    width: 175px;
  }
  .w-\[180px\] {
    width: 180px;
  }
  .w-\[182px\] {
    width: 182px;
  }
  .w-\[185px\] {
    width: 185px;
  }
  .w-\[200px\] {
    width: 200px;
  }
  .w-\[220px\] {
    width: 220px;
  }
  .w-\[225px\] {
    width: 225px;
  }
  .w-\[230px\] {
    width: 230px;
  }
  .w-\[240px\] {
    width: 240px;
  }
  .w-\[250px\] {
    width: 250px;
  }
  .w-\[280px\] {
    width: 280px;
  }
  .w-\[285px\] {
    width: 285px;
  }
  .w-\[320px\] {
    width: 320px;
  }
  .w-\[350px\] {
    width: 350px;
  }
  .w-\[450px\] {
    width: 450px;
  }
  .w-\[520px\] {
    width: 520px;
  }
  .w-\[600px\] {
    width: 600px;
  }
  .w-\[720px\] {
    width: 720px;
  }
  .w-\[940px\] {
    width: 940px;
  }
  .w-auto {
    width: auto;
  }
  .w-full {
    width: 100%;
  }
  .w-screen {
    width: 100vw;
  }
  .max-w-2xl {
    max-width: var(--container-2xl);
  }
  .max-w-16 {
    max-width: calc(var(--spacing) * 16);
  }
  .max-w-24 {
    max-width: calc(var(--spacing) * 24);
  }
  .max-w-32 {
    max-width: calc(var(--spacing) * 32);
  }
  .max-w-48 {
    max-width: calc(var(--spacing) * 48);
  }
  .max-w-56 {
    max-width: calc(var(--spacing) * 56);
  }
  .max-w-64 {
    max-width: calc(var(--spacing) * 64);
  }
  .max-w-96 {
    max-width: calc(var(--spacing) * 96);
  }
  .max-w-\[10\%\] {
    max-width: 10%;
  }
  .max-w-\[15\%\] {
    max-width: 15%;
  }
  .max-w-\[20\%\] {
    max-width: 20%;
  }
  .max-w-\[25\%\] {
    max-width: 25%;
  }
  .max-w-\[60\%\] {
    max-width: 60%;
  }
  .max-w-\[70\%\] {
    max-width: 70%;
  }
  .max-w-\[90\%\] {
    max-width: 90%;
  }
  .max-w-\[125px\] {
    max-width: 125px;
  }
  .max-w-\[175px\] {
    max-width: 175px;
  }
  .max-w-\[200px\] {
    max-width: 200px;
  }
  .max-w-\[220px\] {
    max-width: 220px;
  }
  .max-w-\[250px\] {
    max-width: 250px;
  }
  .max-w-\[280px\] {
    max-width: 280px;
  }
  .max-w-\[320px\] {
    max-width: 320px;
  }
  .max-w-\[370px\] {
    max-width: 370px;
  }
  .max-w-\[380px\] {
    max-width: 380px;
  }
  .max-w-\[420px\] {
    max-width: 420px;
  }
  .max-w-\[440px\] {
    max-width: 440px;
  }
  .max-w-\[500px\] {
    max-width: 500px;
  }
  .max-w-\[600px\] {
    max-width: 600px;
  }
  .max-w-\[800px\] {
    max-width: 800px;
  }
  .max-w-full {
    max-width: 100%;
  }
  .max-w-none {
    max-width: none;
  }
  .min-w-0 {
    min-width: calc(var(--spacing) * 0);
  }
  .min-w-12 {
    min-width: calc(var(--spacing) * 12);
  }
  .min-w-14 {
    min-width: calc(var(--spacing) * 14);
  }
  .min-w-16 {
    min-width: calc(var(--spacing) * 16);
  }
  .min-w-20 {
    min-width: calc(var(--spacing) * 20);
  }
  .min-w-24 {
    min-width: calc(var(--spacing) * 24);
  }
  .min-w-28 {
    min-width: calc(var(--spacing) * 28);
  }
  .min-w-32 {
    min-width: calc(var(--spacing) * 32);
  }
  .min-w-36 {
    min-width: calc(var(--spacing) * 36);
  }
  .min-w-40 {
    min-width: calc(var(--spacing) * 40);
  }
  .min-w-48 {
    min-width: calc(var(--spacing) * 48);
  }
  .min-w-52 {
    min-width: calc(var(--spacing) * 52);
  }
  .min-w-56 {
    min-width: calc(var(--spacing) * 56);
  }
  .min-w-60 {
    min-width: calc(var(--spacing) * 60);
  }
  .min-w-64 {
    min-width: calc(var(--spacing) * 64);
  }
  .min-w-72 {
    min-width: calc(var(--spacing) * 72);
  }
  .min-w-\[65px\] {
    min-width: 65px;
  }
  .min-w-\[66px\] {
    min-width: 66px;
  }
  .min-w-\[70px\] {
    min-width: 70px;
  }
  .min-w-\[73px\] {
    min-width: 73px;
  }
  .min-w-\[75px\] {
    min-width: 75px;
  }
  .min-w-\[77px\] {
    min-width: 77px;
  }
  .min-w-\[80px\] {
    min-width: 80px;
  }
  .min-w-\[82px\] {
    min-width: 82px;
  }
  .min-w-\[84px\] {
    min-width: 84px;
  }
  .min-w-\[85px\] {
    min-width: 85px;
  }
  .min-w-\[88px\] {
    min-width: 88px;
  }
  .min-w-\[90px\] {
    min-width: 90px;
  }
  .min-w-\[95px\] {
    min-width: 95px;
  }
  .min-w-\[98px\] {
    min-width: 98px;
  }
  .min-w-\[100px\] {
    min-width: 100px;
  }
  .min-w-\[103px\] {
    min-width: 103px;
  }
  .min-w-\[105px\] {
    min-width: 105px;
  }
  .min-w-\[106px\] {
    min-width: 106px;
  }
  .min-w-\[110px\] {
    min-width: 110px;
  }
  .min-w-\[115px\] {
    min-width: 115px;
  }
  .min-w-\[116px\] {
    min-width: 116px;
  }
  .min-w-\[120px\] {
    min-width: 120px;
  }
  .min-w-\[122px\] {
    min-width: 122px;
  }
  .min-w-\[125px\] {
    min-width: 125px;
  }
  .min-w-\[130px\] {
    min-width: 130px;
  }
  .min-w-\[137px\] {
    min-width: 137px;
  }
  .min-w-\[140px\] {
    min-width: 140px;
  }
  .min-w-\[150px\] {
    min-width: 150px;
  }
  .min-w-\[160px\] {
    min-width: 160px;
  }
  .min-w-\[165px\] {
    min-width: 165px;
  }
  .min-w-\[170px\] {
    min-width: 170px;
  }
  .min-w-\[175px\] {
    min-width: 175px;
  }
  .min-w-\[180px\] {
    min-width: 180px;
  }
  .min-w-\[185px\] {
    min-width: 185px;
  }
  .min-w-\[190px\] {
    min-width: 190px;
  }
  .min-w-\[198px\] {
    min-width: 198px;
  }
  .min-w-\[200px\] {
    min-width: 200px;
  }
  .min-w-\[201px\] {
    min-width: 201px;
  }
  .min-w-\[206px\] {
    min-width: 206px;
  }
  .min-w-\[220px\] {
    min-width: 220px;
  }
  .min-w-\[224px\] {
    min-width: 224px;
  }
  .min-w-\[225px\] {
    min-width: 225px;
  }
  .min-w-\[240px\] {
    min-width: 240px;
  }
  .min-w-\[250px\] {
    min-width: 250px;
  }
  .min-w-\[255px\] {
    min-width: 255px;
  }
  .min-w-\[260px\] {
    min-width: 260px;
  }
  .min-w-\[300px\] {
    min-width: 300px;
  }
  .min-w-\[1000px\] {
    min-width: 1000px;
  }
  .min-w-full {
    min-width: 100%;
  }
  .flex-1 {
    flex: 1;
  }
  .flex-shrink {
    flex-shrink: 1;
  }
  .shrink {
    flex-shrink: 1;
  }
  .shrink-0 {
    flex-shrink: 0;
  }
  .flex-grow {
    flex-grow: 1;
  }
  .grow {
    flex-grow: 1;
  }
  .grow-0 {
    flex-grow: 0;
  }
  .basis-1\/2 {
    flex-basis: calc(1 / 2 * 100%);
  }
  .basis-1\/4 {
    flex-basis: calc(1 / 4 * 100%);
  }
  .table-auto {
    table-layout: auto;
  }
  .table-fixed {
    table-layout: fixed;
  }
  .border-collapse {
    border-collapse: collapse;
  }
  .border-separate {
    border-collapse: separate;
  }
  .border-spacing-0 {
    --tw-border-spacing-x: calc(var(--spacing) * 0);
    --tw-border-spacing-y: calc(var(--spacing) * 0);
    border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y);
  }
  .-translate-1\/2 {
    --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
    --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .-translate-x-1\/2 {
    --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .-translate-x-2\/4 {
    --tw-translate-x: calc(calc(2 / 4 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .translate-x-1\/2 {
    --tw-translate-x: calc(1 / 2 * 100%);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .translate-x-full {
    --tw-translate-x: 100%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .-translate-y-1\/2 {
    --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .-translate-y-2\/4 {
    --tw-translate-y: calc(calc(2 / 4 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .translate-y-1\/2 {
    --tw-translate-y: calc(1 / 2 * 100%);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .transform {
    transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
  }
  .animate-spin {
    animation: var(--animate-spin);
  }
  .cursor-pointer {
    cursor: pointer;
  }
  .resize {
    resize: both;
  }
  .appearance-none {
    appearance: none;
  }
  .grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .grid-rows-2 {
    grid-template-rows: repeat(2, minmax(0, 1fr));
  }
  .flex-col {
    flex-direction: column;
  }
  .flex-col-reverse {
    flex-direction: column-reverse;
  }
  .flex-row {
    flex-direction: row;
  }
  .flex-row-reverse {
    flex-direction: row-reverse;
  }
  .flex-nowrap {
    flex-wrap: nowrap;
  }
  .flex-wrap {
    flex-wrap: wrap;
  }
  .place-content-between {
    place-content: space-between;
  }
  .place-content-center {
    place-content: center;
  }
  .place-items-center {
    place-items: center;
  }
  .content-between {
    align-content: space-between;
  }
  .items-baseline {
    align-items: baseline;
  }
  .items-center {
    align-items: center;
  }
  .items-end {
    align-items: flex-end;
  }
  .items-start {
    align-items: flex-start;
  }
  .items-stretch {
    align-items: stretch;
  }
  .justify-between {
    justify-content: space-between;
  }
  .justify-center {
    justify-content: center;
  }
  .justify-end {
    justify-content: flex-end;
  }
  .justify-start {
    justify-content: flex-start;
  }
  .gap-0 {
    gap: calc(var(--spacing) * 0);
  }
  .gap-0\.5 {
    gap: calc(var(--spacing) * 0.5);
  }
  .gap-1 {
    gap: calc(var(--spacing) * 1);
  }
  .gap-1\.5 {
    gap: calc(var(--spacing) * 1.5);
  }
  .gap-1\.25 {
    gap: calc(var(--spacing) * 1.25);
  }
  .gap-2 {
    gap: calc(var(--spacing) * 2);
  }
  .gap-2\.5 {
    gap: calc(var(--spacing) * 2.5);
  }
  .gap-3 {
    gap: calc(var(--spacing) * 3);
  }
  .gap-3\.5 {
    gap: calc(var(--spacing) * 3.5);
  }
  .gap-4 {
    gap: calc(var(--spacing) * 4);
  }
  .gap-4\.5 {
    gap: calc(var(--spacing) * 4.5);
  }
  .gap-5 {
    gap: calc(var(--spacing) * 5);
  }
  .gap-6 {
    gap: calc(var(--spacing) * 6);
  }
  .gap-7 {
    gap: calc(var(--spacing) * 7);
  }
  .gap-7\.5 {
    gap: calc(var(--spacing) * 7.5);
  }
  .gap-8 {
    gap: calc(var(--spacing) * 8);
  }
  .gap-9 {
    gap: calc(var(--spacing) * 9);
  }
  .gap-10 {
    gap: calc(var(--spacing) * 10);
  }
  .gap-\[5px\] {
    gap: 5px;
  }
  .gap-\[10px\] {
    gap: 10px;
  }
  .gap-\[14px\] {
    gap: 14px;
  }
  .gap-px {
    gap: 1px;
  }
    :where(.space-y-2 > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
    }
    :where(.space-y-2\.5 > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 2.5) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 2.5) * calc(1 - var(--tw-space-y-reverse)));
    }
    :where(.space-y-3 > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
    }
    :where(.space-y-3\.5 > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 3.5) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 3.5) * calc(1 - var(--tw-space-y-reverse)));
    }
    :where(.space-y-4 > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
    }
    :where(.space-y-4\.5 > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 4.5) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 4.5) * calc(1 - var(--tw-space-y-reverse)));
    }
    :where(.space-y-5 > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)));
    }
  .gap-x-1 {
    column-gap: calc(var(--spacing) * 1);
  }
  .gap-x-4 {
    column-gap: calc(var(--spacing) * 4);
  }
    :where(.-space-x-2 > :not(:last-child)) {
      --tw-space-x-reverse: 0;
      margin-inline-start: calc(calc(var(--spacing) * -2) * var(--tw-space-x-reverse));
      margin-inline-end: calc(calc(var(--spacing) * -2) * calc(1 - var(--tw-space-x-reverse)));
    }
    :where(.space-x-0\.5 > :not(:last-child)) {
      --tw-space-x-reverse: 0;
      margin-inline-start: calc(calc(var(--spacing) * 0.5) * var(--tw-space-x-reverse));
      margin-inline-end: calc(calc(var(--spacing) * 0.5) * calc(1 - var(--tw-space-x-reverse)));
    }
  .gap-y-3\.5 {
    row-gap: calc(var(--spacing) * 3.5);
  }
  .gap-y-5 {
    row-gap: calc(var(--spacing) * 5);
  }
    :where(.divide-y > :not(:last-child)) {
      --tw-divide-y-reverse: 0;
      border-bottom-style: var(--tw-border-style);
      border-top-style: var(--tw-border-style);
      border-top-width: calc(1px * var(--tw-divide-y-reverse));
      border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
    }
    :where(.divide-border > :not(:last-child)) {
      border-color: var(--border);
    }
  .place-self-end {
    place-self: end;
  }
  .justify-self-center {
    justify-self: center;
  }
  .justify-self-end {
    justify-self: flex-end;
  }
  .truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .overflow-auto {
    overflow: auto;
  }
  .overflow-hidden {
    overflow: hidden;
  }
  .overflow-x-auto {
    overflow-x: auto;
  }
  .scroll-smooth {
    scroll-behavior: smooth;
  }
  .rounded {
    border-radius: 0.25rem;
  }
  .rounded-\[9px\] {
    border-radius: 9px;
  }
  .rounded-\[30px\] {
    border-radius: 30px;
  }
  .rounded-full {
    border-radius: calc(infinity * 1px);
  }
  .rounded-lg {
    border-radius: var(--radius);
  }
  .rounded-md {
    border-radius: calc(var(--radius) - 2px);
  }
  .rounded-none\! {
    border-radius: 0 !important;
  }
  .rounded-sm {
    border-radius: calc(var(--radius) - 4px);
  }
  .rounded-xl {
    border-radius: calc(var(--radius) + 4px);
  }
  .rounded-xs {
    border-radius: var(--radius-xs);
  }
  .rounded-t-lg {
    border-top-left-radius: var(--radius);
    border-top-right-radius: var(--radius);
  }
  .rounded-t-xl {
    border-top-left-radius: calc(var(--radius) + 4px);
    border-top-right-radius: calc(var(--radius) + 4px);
  }
  .rounded-b-xl {
    border-bottom-right-radius: calc(var(--radius) + 4px);
    border-bottom-left-radius: calc(var(--radius) + 4px);
  }
  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .border-0 {
    border-style: var(--tw-border-style);
    border-width: 0px;
  }
  .border-2 {
    border-style: var(--tw-border-style);
    border-width: 2px;
  }
  .border-3 {
    border-style: var(--tw-border-style);
    border-width: 3px;
  }
  .border-\[0\.5px\] {
    border-style: var(--tw-border-style);
    border-width: 0.5px;
  }
  .border-x {
    border-inline-style: var(--tw-border-style);
    border-inline-width: 1px;
  }
  .border-y {
    border-block-style: var(--tw-border-style);
    border-block-width: 1px;
  }
  .border-s {
    border-inline-start-style: var(--tw-border-style);
    border-inline-start-width: 1px;
  }
  .border-s-2 {
    border-inline-start-style: var(--tw-border-style);
    border-inline-start-width: 2px;
  }
  .border-e {
    border-inline-end-style: var(--tw-border-style);
    border-inline-end-width: 1px;
  }
  .border-t {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
  }
  .border-r {
    border-right-style: var(--tw-border-style);
    border-right-width: 1px;
  }
  .border-b {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
  }
  .border-b-0 {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 0px;
  }
  .border-b-2 {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 2px;
  }
  .border-l {
    border-left-style: var(--tw-border-style);
    border-left-width: 1px;
  }
  .border-dashed {
    --tw-border-style: dashed;
    border-style: dashed;
  }
  .border-none {
    --tw-border-style: none;
    border-style: none;
  }
  .border-black\/10\! {
    border-color: color-mix(in srgb, #000 10%, transparent) !important;
  }
    @supports (color: color-mix(in lab, red, red)) {
  .border-black\/10\! {
      border-color: color-mix(in oklab, var(--color-black) 10%, transparent) !important;
  }
    }
  .border-border {
    border-color: var(--border);
  }
  .border-destructive\/10 {
    border-color: var(--destructive);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .border-destructive\/10 {
      border-color: color-mix(in oklab, var(--destructive) 10%, transparent);
  }
    }
  .border-gray-200 {
    border-color: var(--color-gray-200);
  }
  .border-green-200 {
    border-color: var(--color-green-200);
  }
  .border-green-500 {
    border-color: var(--color-green-500);
  }
  .border-input {
    border-color: var(--input);
  }
  .border-mono\/25 {
    border-color: var(--mono);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .border-mono\/25 {
      border-color: color-mix(in oklab, var(--mono) 25%, transparent);
  }
    }
  .border-muted-foreground {
    border-color: var(--muted-foreground);
  }
  .border-orange-200 {
    border-color: var(--color-orange-200);
  }
  .border-primary {
    border-color: var(--primary);
  }
  .border-primary\/10 {
    border-color: var(--primary);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .border-primary\/10 {
      border-color: color-mix(in oklab, var(--primary) 10%, transparent);
  }
    }
  .border-transparent {
    border-color: transparent;
  }
  .border-violet-200 {
    border-color: var(--color-violet-200);
  }
  .border-white {
    border-color: var(--color-white);
  }
  .border-yellow-500 {
    border-color: var(--color-yellow-500);
  }
  .border-zinc-300 {
    border-color: var(--color-zinc-300);
  }
  .border-s-border {
    border-inline-start-color: var(--border);
  }
  .border-s-input {
    border-inline-start-color: var(--input);
  }
  .border-e-border {
    border-inline-end-color: var(--border);
  }
  .border-e-input {
    border-inline-end-color: var(--input);
  }
  .border-t-border {
    border-top-color: var(--border);
  }
  .border-r-input {
    border-right-color: var(--input);
  }
  .border-b-border {
    border-bottom-color: var(--border);
  }
  .border-b-input {
    border-bottom-color: var(--input);
  }
  .border-b-primary\/10 {
    border-bottom-color: var(--primary);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .border-b-primary\/10 {
      border-bottom-color: color-mix(in oklab, var(--primary) 10%, transparent);
  }
    }
  .border-b-transparent {
    border-bottom-color: transparent;
  }
  .bg-accent\/50 {
    background-color: var(--accent);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .bg-accent\/50 {
      background-color: color-mix(in oklab, var(--accent) 50%, transparent);
  }
    }
  .bg-accent\/60 {
    background-color: var(--accent);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .bg-accent\/60 {
      background-color: color-mix(in oklab, var(--accent) 60%, transparent);
  }
    }
  .bg-background {
    background-color: var(--background);
  }
  .bg-background\/70 {
    background-color: var(--background);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .bg-background\/70 {
      background-color: color-mix(in oklab, var(--background) 70%, transparent);
  }
    }
  .bg-black\/25 {
    background-color: color-mix(in srgb, #000 25%, transparent);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .bg-black\/25 {
      background-color: color-mix(in oklab, var(--color-black) 25%, transparent);
  }
    }
  .bg-border {
    background-color: var(--border);
  }
  .bg-destructive {
    background-color: var(--destructive);
  }
  .bg-destructive\/5 {
    background-color: var(--destructive);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .bg-destructive\/5 {
      background-color: color-mix(in oklab, var(--destructive) 5%, transparent);
  }
    }
  .bg-gray-700 {
    background-color: var(--color-gray-700);
  }
  .bg-green-50 {
    background-color: var(--color-green-50);
  }
  .bg-green-500 {
    background-color: var(--color-green-500);
  }
  .bg-input {
    background-color: var(--input);
  }
  .bg-mono {
    background-color: var(--mono);
  }
  .bg-mono\/20 {
    background-color: var(--mono);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .bg-mono\/20 {
      background-color: color-mix(in oklab, var(--mono) 20%, transparent);
  }
    }
  .bg-mono\/30 {
    background-color: var(--mono);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .bg-mono\/30 {
      background-color: color-mix(in oklab, var(--mono) 30%, transparent);
  }
    }
  .bg-mono\/50 {
    background-color: var(--mono);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .bg-mono\/50 {
      background-color: color-mix(in oklab, var(--mono) 50%, transparent);
  }
    }
  .bg-muted {
    background-color: var(--muted);
  }
  .bg-muted\! {
    background-color: var(--muted) !important;
  }
  .bg-muted-foreground\/60 {
    background-color: var(--muted-foreground);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .bg-muted-foreground\/60 {
      background-color: color-mix(in oklab, var(--muted-foreground) 60%, transparent);
  }
    }
  .bg-muted\/25 {
    background-color: var(--muted);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .bg-muted\/25 {
      background-color: color-mix(in oklab, var(--muted) 25%, transparent);
  }
    }
  .bg-muted\/30 {
    background-color: var(--muted);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .bg-muted\/30 {
      background-color: color-mix(in oklab, var(--muted) 30%, transparent);
  }
    }
  .bg-muted\/40 {
    background-color: var(--muted);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .bg-muted\/40 {
      background-color: color-mix(in oklab, var(--muted) 40%, transparent);
  }
    }
  .bg-muted\/50 {
    background-color: var(--muted);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .bg-muted\/50 {
      background-color: color-mix(in oklab, var(--muted) 50%, transparent);
  }
    }
  .bg-muted\/70 {
    background-color: var(--muted);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .bg-muted\/70 {
      background-color: color-mix(in oklab, var(--muted) 70%, transparent);
  }
    }
  .bg-orange-100 {
    background-color: var(--color-orange-100);
  }
  .bg-primary {
    background-color: var(--primary);
  }
  .bg-primary\/5 {
    background-color: var(--primary);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .bg-primary\/5 {
      background-color: color-mix(in oklab, var(--primary) 5%, transparent);
  }
    }
  .bg-primary\/10 {
    background-color: var(--primary);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .bg-primary\/10 {
      background-color: color-mix(in oklab, var(--primary) 10%, transparent);
  }
    }
  .bg-secondary-foreground {
    background-color: var(--secondary-foreground);
  }
  .bg-transparent {
    background-color: transparent;
  }
  .bg-transparent\! {
    background-color: transparent !important;
  }
  .bg-violet-50 {
    background-color: var(--color-violet-50);
  }
  .bg-violet-500 {
    background-color: var(--color-violet-500);
  }
  .bg-white {
    background-color: var(--color-white);
  }
  .bg-white\/70 {
    background-color: color-mix(in srgb, #fff 70%, transparent);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .bg-white\/70 {
      background-color: color-mix(in oklab, var(--color-white) 70%, transparent);
  }
    }
  .bg-yellow-50 {
    background-color: var(--color-yellow-50);
  }
  .bg-yellow-500 {
    background-color: var(--color-yellow-500);
  }
  .bg-linear-to-t {
    --tw-gradient-position: to top;
  }
    @supports (background-image: linear-gradient(in lab, red, red)) {
  .bg-linear-to-t {
      --tw-gradient-position: to top in oklab;
  }
    }
  .bg-linear-to-t {
    background-image: linear-gradient(var(--tw-gradient-stops));
  }
  .from-3\% {
    --tw-gradient-from-position: 3%;
  }
  .to-transparent {
    --tw-gradient-to: transparent;
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }
  .bg-\[length\:80\%\] {
    background-size: 80%;
  }
  .bg-\[length\:85\%\] {
    background-size: 85%;
  }
  .bg-\[length\:500px\] {
    background-size: 500px;
  }
  .bg-\[length\:550px\] {
    background-size: 550px;
  }
  .bg-\[length\:600px\] {
    background-size: 600px;
  }
  .bg-\[length\:650px\] {
    background-size: 650px;
  }
  .bg-\[length\:660px_310px\] {
    background-size: 660px 310px;
  }
  .bg-\[length\:700px\] {
    background-size: 700px;
  }
  .bg-\[length\:750px\] {
    background-size: 750px;
  }
  .bg-cover {
    background-size: cover;
  }
  .\[background-position\:7\.5rem_-3\.5rem\] {
    background-position: 7.5rem -3.5rem;
  }
  .\[background-position\:9rem_-4rem\] {
    background-position: 9rem -4rem;
  }
  .\[background-position\:121\%_41\%\] {
    background-position: 121% 41%;
  }
  .\[background-position\:175\%_25\%\] {
    background-position: 175% 25%;
  }
  .\[background-position\:195px_-85px\] {
    background-position: 195px -85px;
  }
  .bg-\[center_right_-8rem\] {
    background-position: center right -8rem;
  }
  .bg-\[center_top_1\.3rem\] {
    background-position: center top 1.3rem;
  }
  .bg-\[right_top_-1\.7rem\] {
    background-position: right top -1.7rem;
  }
  .bg-center {
    background-position: center;
  }
  .bg-top {
    background-position: top;
  }
  .bg-no-repeat {
    background-repeat: no-repeat;
  }
  .fill-border {
    fill: var(--border);
  }
  .fill-destructive\/5 {
    fill: var(--destructive);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .fill-destructive\/5 {
      fill: color-mix(in oklab, var(--destructive) 5%, transparent);
  }
    }
  .fill-green-50 {
    fill: var(--color-green-50);
  }
  .fill-green-100 {
    fill: var(--color-green-100);
  }
  .fill-muted\/30 {
    fill: var(--muted);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .fill-muted\/30 {
      fill: color-mix(in oklab, var(--muted) 30%, transparent);
  }
    }
  .fill-primary\/5 {
    fill: var(--primary);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .fill-primary\/5 {
      fill: color-mix(in oklab, var(--primary) 5%, transparent);
  }
    }
  .fill-violet-50 {
    fill: var(--color-violet-50);
  }
  .fill-violet-100 {
    fill: var(--color-violet-100);
  }
  .fill-yellow-100 {
    fill: var(--color-yellow-100);
  }
  .stroke-border {
    stroke: var(--border);
  }
  .stroke-destructive\/10 {
    stroke: var(--destructive);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .stroke-destructive\/10 {
      stroke: color-mix(in oklab, var(--destructive) 10%, transparent);
  }
    }
  .stroke-green-200 {
    stroke: var(--color-green-200);
  }
  .stroke-input {
    stroke: var(--input);
  }
  .stroke-primary\/10 {
    stroke: var(--primary);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .stroke-primary\/10 {
      stroke: color-mix(in oklab, var(--primary) 10%, transparent);
  }
    }
  .stroke-violet-100 {
    stroke: var(--color-violet-100);
  }
  .stroke-violet-200 {
    stroke: var(--color-violet-200);
  }
  .stroke-yellow-100 {
    stroke: var(--color-yellow-100);
  }
  .stroke-yellow-200 {
    stroke: var(--color-yellow-200);
  }
  .p-0 {
    padding: calc(var(--spacing) * 0);
  }
  .p-0\.5 {
    padding: calc(var(--spacing) * 0.5);
  }
  .p-1\.5 {
    padding: calc(var(--spacing) * 1.5);
  }
  .p-2 {
    padding: calc(var(--spacing) * 2);
  }
  .p-2\.5 {
    padding: calc(var(--spacing) * 2.5);
  }
  .p-3 {
    padding: calc(var(--spacing) * 3);
  }
  .p-3\.5 {
    padding: calc(var(--spacing) * 3.5);
  }
  .p-4 {
    padding: calc(var(--spacing) * 4);
  }
  .p-5 {
    padding: calc(var(--spacing) * 5);
  }
  .p-5\! {
    padding: calc(var(--spacing) * 5) !important;
  }
  .p-7 {
    padding: calc(var(--spacing) * 7);
  }
  .p-7\.5 {
    padding: calc(var(--spacing) * 7.5);
  }
  .p-8 {
    padding: calc(var(--spacing) * 8);
  }
  .p-10 {
    padding: calc(var(--spacing) * 10);
  }
  .px-0 {
    padding-inline: calc(var(--spacing) * 0);
  }
  .px-0\.5 {
    padding-inline: calc(var(--spacing) * 0.5);
  }
  .px-1\.5 {
    padding-inline: calc(var(--spacing) * 1.5);
  }
  .px-2 {
    padding-inline: calc(var(--spacing) * 2);
  }
  .px-2\.5 {
    padding-inline: calc(var(--spacing) * 2.5);
  }
  .px-2\.75 {
    padding-inline: calc(var(--spacing) * 2.75);
  }
  .px-3 {
    padding-inline: calc(var(--spacing) * 3);
  }
  .px-3\.5 {
    padding-inline: calc(var(--spacing) * 3.5);
  }
  .px-4 {
    padding-inline: calc(var(--spacing) * 4);
  }
  .px-5 {
    padding-inline: calc(var(--spacing) * 5);
  }
  .px-5\! {
    padding-inline: calc(var(--spacing) * 5) !important;
  }
  .px-7 {
    padding-inline: calc(var(--spacing) * 7);
  }
  .px-7\.5 {
    padding-inline: calc(var(--spacing) * 7.5);
  }
  .px-9 {
    padding-inline: calc(var(--spacing) * 9);
  }
  .px-10 {
    padding-inline: calc(var(--spacing) * 10);
  }
  .py-0 {
    padding-block: calc(var(--spacing) * 0);
  }
  .py-0\.5 {
    padding-block: calc(var(--spacing) * 0.5);
  }
  .py-1 {
    padding-block: calc(var(--spacing) * 1);
  }
  .py-1\.5 {
    padding-block: calc(var(--spacing) * 1.5);
  }
  .py-2 {
    padding-block: calc(var(--spacing) * 2);
  }
  .py-2\.5 {
    padding-block: calc(var(--spacing) * 2.5);
  }
  .py-2\.25 {
    padding-block: calc(var(--spacing) * 2.25);
  }
  .py-3 {
    padding-block: calc(var(--spacing) * 3);
  }
  .py-3\.5 {
    padding-block: calc(var(--spacing) * 3.5);
  }
  .py-3\.5\! {
    padding-block: calc(var(--spacing) * 3.5) !important;
  }
  .py-4 {
    padding-block: calc(var(--spacing) * 4);
  }
  .py-4\.5 {
    padding-block: calc(var(--spacing) * 4.5);
  }
  .py-5 {
    padding-block: calc(var(--spacing) * 5);
  }
  .py-5\.5\! {
    padding-block: calc(var(--spacing) * 5.5) !important;
  }
  .py-7\.5 {
    padding-block: calc(var(--spacing) * 7.5);
  }
  .py-9 {
    padding-block: calc(var(--spacing) * 9);
  }
  .py-10 {
    padding-block: calc(var(--spacing) * 10);
  }
  .py-\[6px\] {
    padding-block: 6px;
  }
  .py-\[8px\] {
    padding-block: 8px;
  }
  .ps-1\.5 {
    padding-inline-start: calc(var(--spacing) * 1.5);
  }
  .ps-2 {
    padding-inline-start: calc(var(--spacing) * 2);
  }
  .ps-2\.5 {
    padding-inline-start: calc(var(--spacing) * 2.5);
  }
  .ps-3 {
    padding-inline-start: calc(var(--spacing) * 3);
  }
  .ps-4 {
    padding-inline-start: calc(var(--spacing) * 4);
  }
  .ps-5 {
    padding-inline-start: calc(var(--spacing) * 5);
  }
  .ps-6 {
    padding-inline-start: calc(var(--spacing) * 6);
  }
  .ps-7 {
    padding-inline-start: calc(var(--spacing) * 7);
  }
  .ps-8 {
    padding-inline-start: calc(var(--spacing) * 8);
  }
  .ps-12 {
    padding-inline-start: calc(var(--spacing) * 12);
  }
  .ps-\[10px\] {
    padding-inline-start: 10px;
  }
  .ps-\[14\.5px\] {
    padding-inline-start: 14.5px;
  }
  .ps-\[22px\] {
    padding-inline-start: 22px;
  }
  .ps-px {
    padding-inline-start: 1px;
  }
  .pe-1 {
    padding-inline-end: calc(var(--spacing) * 1);
  }
  .pe-2 {
    padding-inline-end: calc(var(--spacing) * 2);
  }
  .pe-2\.5 {
    padding-inline-end: calc(var(--spacing) * 2.5);
  }
  .pe-3 {
    padding-inline-end: calc(var(--spacing) * 3);
  }
  .pe-3\.5 {
    padding-inline-end: calc(var(--spacing) * 3.5);
  }
  .pe-4 {
    padding-inline-end: calc(var(--spacing) * 4);
  }
  .pe-5 {
    padding-inline-end: calc(var(--spacing) * 5);
  }
  .pe-6 {
    padding-inline-end: calc(var(--spacing) * 6);
  }
  .pe-7\.5 {
    padding-inline-end: calc(var(--spacing) * 7.5);
  }
  .pe-10 {
    padding-inline-end: calc(var(--spacing) * 10);
  }
  .pe-\[10px\] {
    padding-inline-end: 10px;
  }
  .pt-\(--header-height\) {
    padding-top: var(--header-height);
  }
  .pt-0 {
    padding-top: calc(var(--spacing) * 0);
  }
  .pt-0\.5 {
    padding-top: calc(var(--spacing) * 0.5);
  }
  .pt-1 {
    padding-top: calc(var(--spacing) * 1);
  }
  .pt-1\.5 {
    padding-top: calc(var(--spacing) * 1.5);
  }
  .pt-2 {
    padding-top: calc(var(--spacing) * 2);
  }
  .pt-2\.5 {
    padding-top: calc(var(--spacing) * 2.5);
  }
  .pt-2\.25 {
    padding-top: calc(var(--spacing) * 2.25);
  }
  .pt-3 {
    padding-top: calc(var(--spacing) * 3);
  }
  .pt-3\.5 {
    padding-top: calc(var(--spacing) * 3.5);
  }
  .pt-4 {
    padding-top: calc(var(--spacing) * 4);
  }
  .pt-5 {
    padding-top: calc(var(--spacing) * 5);
  }
  .pt-6 {
    padding-top: calc(var(--spacing) * 6);
  }
  .pt-7 {
    padding-top: calc(var(--spacing) * 7);
  }
  .pt-7\.5 {
    padding-top: calc(var(--spacing) * 7.5);
  }
  .pt-7\.5\! {
    padding-top: calc(var(--spacing) * 7.5) !important;
  }
  .pt-8 {
    padding-top: calc(var(--spacing) * 8);
  }
  .pt-\[1px\] {
    padding-top: 1px;
  }
  .pr-2 {
    padding-right: calc(var(--spacing) * 2);
  }
  .pr-2\.5 {
    padding-right: calc(var(--spacing) * 2.5);
  }
  .pr-3 {
    padding-right: calc(var(--spacing) * 3);
  }
  .pb-0 {
    padding-bottom: calc(var(--spacing) * 0);
  }
  .pb-0\.5 {
    padding-bottom: calc(var(--spacing) * 0.5);
  }
  .pb-1 {
    padding-bottom: calc(var(--spacing) * 1);
  }
  .pb-1\.5 {
    padding-bottom: calc(var(--spacing) * 1.5);
  }
  .pb-2 {
    padding-bottom: calc(var(--spacing) * 2);
  }
  .pb-2\.5 {
    padding-bottom: calc(var(--spacing) * 2.5);
  }
  .pb-3 {
    padding-bottom: calc(var(--spacing) * 3);
  }
  .pb-3\.5 {
    padding-bottom: calc(var(--spacing) * 3.5);
  }
  .pb-4 {
    padding-bottom: calc(var(--spacing) * 4);
  }
  .pb-5 {
    padding-bottom: calc(var(--spacing) * 5);
  }
  .pb-6 {
    padding-bottom: calc(var(--spacing) * 6);
  }
  .pb-7 {
    padding-bottom: calc(var(--spacing) * 7);
  }
  .pb-7\.5 {
    padding-bottom: calc(var(--spacing) * 7.5);
  }
  .pb-10 {
    padding-bottom: calc(var(--spacing) * 10);
  }
  .pb-px {
    padding-bottom: 1px;
  }
  .pl-2\.5 {
    padding-left: calc(var(--spacing) * 2.5);
  }
  .pl-6 {
    padding-left: calc(var(--spacing) * 6);
  }
  .text-center {
    text-align: center;
  }
  .text-end {
    text-align: end;
  }
  .text-left {
    text-align: left;
  }
  .text-right {
    text-align: right;
  }
  .text-start {
    text-align: start;
  }
  .align-bottom {
    vertical-align: bottom;
  }
  .align-middle {
    vertical-align: middle;
  }
  .text-2sm {
    font-size: var(--text-2sm);
    line-height: var(--tw-leading, var(--text-2sm--line-height));
  }
  .text-2xl {
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
  }
  .text-2xs {
    font-size: var(--text-2xs);
    line-height: var(--tw-leading, var(--text-2xs--line-height));
  }
  .text-3xl {
    font-size: var(--text-3xl);
    line-height: var(--tw-leading, var(--text-3xl--line-height));
  }
  .text-4xl {
    font-size: var(--text-4xl);
    line-height: var(--tw-leading, var(--text-4xl--line-height));
  }
  .text-base {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
  }
  .text-base\! {
    font-size: var(--text-base) !important;
    line-height: var(--tw-leading, var(--text-base--line-height)) !important;
  }
  .text-lg {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }
  .text-sm {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }
  .text-xl {
    font-size: var(--text-xl);
    line-height: var(--tw-leading, var(--text-xl--line-height));
  }
  .text-xs {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }
  .text-xs\! {
    font-size: var(--text-xs) !important;
    line-height: var(--tw-leading, var(--text-xs--line-height)) !important;
  }
  .text-\[1\.875rem\] {
    font-size: 1.875rem;
  }
  .text-\[2\.25rem\] {
    font-size: 2.25rem;
  }
  .text-\[10px\] {
    font-size: 10px;
  }
  .text-\[11px\] {
    font-size: 11px;
  }
  .text-\[26px\] {
    font-size: 26px;
  }
  .leading-3 {
    --tw-leading: calc(var(--spacing) * 3);
    line-height: calc(var(--spacing) * 3);
  }
  .leading-4 {
    --tw-leading: calc(var(--spacing) * 4);
    line-height: calc(var(--spacing) * 4);
  }
  .leading-5 {
    --tw-leading: calc(var(--spacing) * 5);
    line-height: calc(var(--spacing) * 5);
  }
  .leading-5\.5 {
    --tw-leading: calc(var(--spacing) * 5.5);
    line-height: calc(var(--spacing) * 5.5);
  }
  .leading-6 {
    --tw-leading: calc(var(--spacing) * 6);
    line-height: calc(var(--spacing) * 6);
  }
  .leading-\[14px\] {
    --tw-leading: 14px;
    line-height: 14px;
  }
  .leading-\[22px\] {
    --tw-leading: 22px;
    line-height: 22px;
  }
  .leading-none {
    --tw-leading: 1;
    line-height: 1;
  }
  .font-medium {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
  .font-normal {
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
  }
  .font-semibold {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }
  .tracking-tight {
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
  }
  .text-nowrap {
    text-wrap: nowrap;
  }
  .whitespace-nowrap {
    white-space: nowrap;
  }
  .text-accent-foreground\/60 {
    color: var(--accent-foreground);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .text-accent-foreground\/60 {
      color: color-mix(in oklab, var(--accent-foreground) 60%, transparent);
  }
    }
  .text-destructive {
    color: var(--destructive);
  }
  .text-foreground {
    color: var(--foreground);
  }
  .text-gray-500 {
    color: var(--color-gray-500);
  }
  .text-gray-600 {
    color: var(--color-gray-600);
  }
  .text-gray-700 {
    color: var(--color-gray-700);
  }
  .text-green-500 {
    color: var(--color-green-500);
  }
  .text-green-600 {
    color: var(--color-green-600);
  }
  .text-mono {
    color: var(--mono);
  }
  .text-muted-foreground {
    color: var(--muted-foreground);
  }
  .text-muted-foreground\/50 {
    color: var(--muted-foreground);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .text-muted-foreground\/50 {
      color: color-mix(in oklab, var(--muted-foreground) 50%, transparent);
  }
    }
  .text-muted-foreground\/60 {
    color: var(--muted-foreground);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .text-muted-foreground\/60 {
      color: color-mix(in oklab, var(--muted-foreground) 60%, transparent);
  }
    }
  .text-orange-400 {
    color: var(--color-orange-400);
  }
  .text-primary {
    color: var(--primary);
  }
  .text-primary-foreground {
    color: var(--primary-foreground);
  }
  .text-red-500 {
    color: var(--color-red-500);
  }
  .text-secondary-foreground {
    color: var(--secondary-foreground);
  }
  .text-transparent {
    color: transparent;
  }
  .text-violet-500 {
    color: var(--color-violet-500);
  }
  .text-violet-600 {
    color: var(--color-violet-600);
  }
  .text-white {
    color: var(--color-white);
  }
  .text-yellow-400 {
    color: var(--color-yellow-400);
  }
  .text-yellow-500 {
    color: var(--color-yellow-500);
  }
  .text-yellow-600 {
    color: var(--color-yellow-600);
  }
  .capitalize {
    text-transform: capitalize;
  }
  .lowercase {
    text-transform: lowercase;
  }
  .uppercase {
    text-transform: uppercase;
  }
  .italic {
    font-style: italic;
  }
  .ordinal {
    --tw-ordinal: ordinal;
    font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
  }
  .tabular-nums {
    --tw-numeric-spacing: tabular-nums;
    font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
  }
  .line-through {
    text-decoration-line: line-through;
  }
  .overline {
    text-decoration-line: overline;
  }
  .underline {
    text-decoration-line: underline;
  }
  .antialiased {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  .accent-primary {
    accent-color: var(--primary);
  }
  .opacity-25 {
    opacity: 25%;
  }
  .opacity-75 {
    opacity: 75%;
  }
  .opacity-80 {
    opacity: 80%;
  }
  .opacity-90 {
    opacity: 90%;
  }
  .shadow {
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[0px_3px_11px_0px_rgba\(45\,72\,126\,0\.10\)\] {
    --tw-shadow: 0px 3px 11px 0px var(--tw-shadow-color, rgba(45,72,126,0.10));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-md {
    --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-none {
    --tw-shadow: 0 0 #0000;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-xs {
    --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .ring {
    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .ring-1 {
    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .ring-2 {
    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-black\/5 {
    --tw-shadow-color: color-mix(in srgb, #000 5%, transparent);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .shadow-black\/5 {
      --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-black) 5%, transparent) var(--tw-shadow-alpha), transparent);
  }
    }
  .ring-background {
    --tw-ring-color: var(--background);
  }
  .ring-border {
    --tw-ring-color: var(--border);
  }
  .ring-destructive\/20 {
    --tw-ring-color: var(--destructive);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .ring-destructive\/20 {
      --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
  }
    }
  .ring-green-200 {
    --tw-ring-color: var(--color-green-200);
  }
  .ring-input {
    --tw-ring-color: var(--input);
  }
  .ring-primary\/10 {
    --tw-ring-color: var(--primary);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .ring-primary\/10 {
      --tw-ring-color: color-mix(in oklab, var(--primary) 10%, transparent);
  }
    }
  .ring-primary\/20 {
    --tw-ring-color: var(--primary);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .ring-primary\/20 {
      --tw-ring-color: color-mix(in oklab, var(--primary) 20%, transparent);
  }
    }
  .ring-violet-50 {
    --tw-ring-color: var(--color-violet-50);
  }
  .ring-violet-200 {
    --tw-ring-color: var(--color-violet-200);
  }
  .ring-yellow-200 {
    --tw-ring-color: var(--color-yellow-200);
  }
  .outline {
    outline-style: var(--tw-outline-style);
    outline-width: 1px;
  }
  .outline-2 {
    outline-style: var(--tw-outline-style);
    outline-width: 2px;
  }
  .outline-3 {
    outline-style: var(--tw-outline-style);
    outline-width: 3px;
  }
  .outline-background {
    outline-color: var(--background);
  }
  .outline-gray-50 {
    outline-color: var(--color-gray-50);
  }
  .outline-muted\/70 {
    outline-color: var(--muted);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .outline-muted\/70 {
      outline-color: color-mix(in oklab, var(--muted) 70%, transparent);
  }
    }
  .blur {
    --tw-blur: blur(8px);
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .grayscale {
    --tw-grayscale: grayscale(100%);
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .invert {
    --tw-invert: invert(100%);
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .filter {
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .backdrop-blur-md {
    --tw-backdrop-blur: blur(var(--blur-md));
    -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
    backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
  }
  .transition {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-\[height\] {
    transition-property: height;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-all {
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-colors {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .duration-300 {
    --tw-duration: 300ms;
    transition-duration: 300ms;
  }
  .ease-in-out {
    --tw-ease: var(--ease-in-out);
    transition-timing-function: var(--ease-in-out);
  }
  .select-all {
    -webkit-user-select: all;
    user-select: all;
  }
  .\[--header-height-default\:95px\] {
    --header-height-default: 95px;
  }
  .\[--header-height-mobile\:70px\] {
    --header-height-mobile: 70px;
  }
  .\[--header-height\:54px\] {
    --header-height: 54px;
  }
  .\[--header-height\:58px\] {
    --header-height: 58px;
  }
  .\[--header-height\:60px\] {
    --header-height: 60px;
  }
  .\[--header-height\:78px\] {
    --header-height: 78px;
  }
  .\[--header-height\:100px\] {
    --header-height: 100px;
  }
  .\[--header-height\:var\(--header-height-default\)\] {
    --header-height: var(--header-height-default);
  }
  .\[--kt-drawer-enable\:true\] {
    --kt-drawer-enable: true;
  }
  .\[--kt-reparent-mode\:prepend\] {
    --kt-reparent-mode: prepend;
  }
  .\[--kt-reparent-target\:\#contentContainer\] {
    --kt-reparent-target: #contentContainer;
  }
  .\[--kt-reparent-target\:body\] {
    --kt-reparent-target: body;
  }
  .\[--kt-scrollbar-width\:auto\] {
    --kt-scrollbar-width: auto;
  }
  .\[--navbar-height\:56px\] {
    --navbar-height: 56px;
  }
  .\[--sidebar-width\:58px\] {
    --sidebar-width: 58px;
  }
  .\[--sidebar-width\:90px\] {
    --sidebar-width: 90px;
  }
  .\[--sidebar-width\:200px\] {
    --sidebar-width: 200px;
  }
  .\[--sidebar-width\:270px\] {
    --sidebar-width: 270px;
  }
  .\[--sidebar-width\:290px\] {
    --sidebar-width: 290px;
  }
    :is(.\*\:border-border > *) {
      border-color: var(--border);
    }
    .not-last\:block:not(*:last-child) {
      display: block;
    }
    .not-last\:border-e:not(*:last-child) {
      border-inline-end-style: var(--tw-border-style);
      border-inline-end-width: 1px;
    }
    .not-last\:border-b:not(*:last-child) {
      border-bottom-style: var(--tw-border-style);
      border-bottom-width: 1px;
    }
      @media (hover: hover) {
    .group-hover\:text-primary:is(:where(.group):hover *) {
        color: var(--primary);
    }
      }
    .group-has-checked\:hidden:is(:where(.group):has(*:checked) *) {
      display: none;
    }
    .group-has-checked\:inline:is(:where(.group):has(*:checked) *) {
      display: inline;
    }
    .placeholder\:text-secondary-foreground::placeholder {
      color: var(--secondary-foreground);
    }
    .before\:absolute::before {
      content: var(--tw-content);
      position: absolute;
    }
    .before\:start-\[20px\]::before {
      content: var(--tw-content);
      inset-inline-start: 20px;
    }
    .before\:start-\[32px\]::before {
      content: var(--tw-content);
      inset-inline-start: 32px;
    }
    .before\:top-0::before {
      content: var(--tw-content);
      top: calc(var(--spacing) * 0);
    }
    .before\:bottom-0::before {
      content: var(--tw-content);
      bottom: calc(var(--spacing) * 0);
    }
    .before\:left-\[11px\]::before {
      content: var(--tw-content);
      left: 11px;
    }
    .before\:size-1\.5::before {
      content: var(--tw-content);
      width: calc(var(--spacing) * 1.5);
      height: calc(var(--spacing) * 1.5);
    }
    .before\:size-\[6px\]::before {
      content: var(--tw-content);
      width: 6px;
      height: 6px;
    }
    .before\:-translate-x-2\/4::before {
      content: var(--tw-content);
      --tw-translate-x: calc(calc(2 / 4 * 100%) * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    .before\:-translate-y-1\/2::before {
      content: var(--tw-content);
      --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    .before\:-translate-y-2\/4::before {
      content: var(--tw-content);
      --tw-translate-y: calc(calc(2 / 4 * 100%) * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    .before\:rounded-full::before {
      content: var(--tw-content);
      border-radius: calc(infinity * 1px);
    }
    .before\:border-s::before {
      content: var(--tw-content);
      border-inline-start-style: var(--tw-border-style);
      border-inline-start-width: 1px;
    }
    .before\:border-l::before {
      content: var(--tw-content);
      border-left-style: var(--tw-border-style);
      border-left-width: 1px;
    }
    .before\:border-border::before {
      content: var(--tw-content);
      border-color: var(--border);
    }
    .last\:me-5:last-child {
      margin-inline-end: calc(var(--spacing) * 5);
    }
    .last\:mr-5:last-child {
      margin-right: calc(var(--spacing) * 5);
    }
    .last-of-type\:hidden:last-of-type {
      display: none;
    }
    .checked\:bg-none:checked {
      background-image: none;
    }
      @media (hover: hover) {
    .hover\:z-5:hover {
        z-index: 5;
    }
      }
      @media (hover: hover) {
    .hover\:rounded-lg:hover {
        border-radius: var(--radius);
    }
      }
      @media (hover: hover) {
    .hover\:border-border:hover {
        border-color: var(--border);
    }
      }
      @media (hover: hover) {
    .hover\:border-input:hover {
        border-color: var(--input);
    }
      }
      @media (hover: hover) {
    .hover\:bg-accent\/60:hover {
        background-color: var(--accent);
    }
        @supports (color: color-mix(in lab, red, red)) {
    .hover\:bg-accent\/60:hover {
          background-color: color-mix(in oklab, var(--accent) 60%, transparent);
    }
        }
      }
      @media (hover: hover) {
    .hover\:bg-background:hover {
        background-color: var(--background);
    }
      }
      @media (hover: hover) {
    .hover\:bg-primary\/10:hover {
        background-color: var(--primary);
    }
        @supports (color: color-mix(in lab, red, red)) {
    .hover\:bg-primary\/10:hover {
          background-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
        }
      }
      @media (hover: hover) {
    .hover\:bg-transparent:hover {
        background-color: transparent;
    }
      }
      @media (hover: hover) {
    .hover\:font-medium:hover {
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium);
    }
      }
      @media (hover: hover) {
    .hover\:text-foreground:hover {
        color: var(--foreground);
    }
      }
      @media (hover: hover) {
    .hover\:text-primary:hover {
        color: var(--primary);
    }
      }
      @media (hover: hover) {
    .hover\:text-white:hover {
        color: var(--color-white);
    }
      }
    .focus\:border-primary\/10:focus {
      border-color: var(--primary);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .focus\:border-primary\/10:focus {
        border-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
      }
    .focus\:bg-none:focus {
      background-image: none;
    }
    .focus\:ring-0:focus {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    .focus\:ring-3:focus {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    .focus\:ring-primary\/10:focus {
      --tw-ring-color: var(--primary);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .focus\:ring-primary\/10:focus {
        --tw-ring-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
      }
    .focus\:ring-offset-0:focus {
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    }
    :where(*[data-kt-sticky-header="on"]) .in-data-\[kt-sticky-header\=on\]\:pt-\(--header-height\) {
      padding-top: var(--header-height);
    }
    :where(*:is(.authors-row)) .in-\[\.authors-row\]\:start-\[64px\] {
      inset-inline-start: 64px;
    }
    :where(*:is(.authors-row)) .in-\[\.authors-row\]\:size-\[80px\] {
      width: 80px;
      height: 80px;
    }
    :where(*:is(.kt-menu-dropdown)) .in-\[\.kt-menu-dropdown\]\:-rotate-90 {
      rotate: calc(90deg * -1);
    }
    :where(*:is(.menu-dropdown)) .in-\[\.menu-dropdown\]\:-rotate-90 {
      rotate: calc(90deg * -1);
    }
    .has-checked\:border-3:has(*:checked) {
      border-style: var(--tw-border-style);
      border-width: 3px;
    }
    .has-checked\:border-green-500:has(*:checked) {
      border-color: var(--color-green-500);
    }
    .has-checked\:border-primary:has(*:checked) {
      border-color: var(--primary);
    }
    .aria-\[current\=true\]\:bg-primary[aria-current="true"] {
      background-color: var(--primary);
    }
    .data-\[kt-sticky-header\=on\]\:\[--header-height\:60px\][data-kt-sticky-header="on"] {
      --header-height: 60px;
    }
    @media (width >= 40rem) {
  .sm\:ms-8 {
      margin-inline-start: calc(var(--spacing) * 8);
  }
    }
    @media (width >= 40rem) {
  .sm\:me-0 {
      margin-inline-end: calc(var(--spacing) * 0);
  }
    }
    @media (width >= 40rem) {
  .sm\:inline-block {
      display: inline-block;
  }
    }
    @media (width >= 40rem) {
  .sm\:max-w-full {
      max-width: 100%;
  }
    }
    @media (width >= 40rem) {
  .sm\:grid-cols-1 {
      grid-template-columns: repeat(1, minmax(0, 1fr));
  }
    }
    @media (width >= 40rem) {
  .sm\:grid-cols-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
  }
    }
    @media (width >= 40rem) {
  .sm\:grid-cols-4 {
      grid-template-columns: repeat(4, minmax(0, 1fr));
  }
    }
    @media (width >= 40rem) {
  .sm\:flex-row {
      flex-direction: row;
  }
    }
    @media (width >= 40rem) {
  .sm\:flex-nowrap {
      flex-wrap: nowrap;
  }
    }
    @media (width >= 40rem) {
  .sm\:flex-wrap {
      flex-wrap: wrap;
  }
    }
    @media (width >= 40rem) {
  .sm\:items-center {
      align-items: center;
  }
    }
    @media (width >= 40rem) {
  .sm\:justify-end {
      justify-content: flex-end;
  }
    }
    @media (width >= 40rem) {
  .sm\:ps-8 {
      padding-inline-start: calc(var(--spacing) * 8);
  }
    }
    @media (width >= 48rem) {
  .md\:order-1 {
      order: 1;
  }
    }
    @media (width >= 48rem) {
  .md\:order-2 {
      order: 2;
  }
    }
    @media (width >= 48rem) {
  .md\:block {
      display: block;
  }
    }
    @media (width >= 48rem) {
  .md\:hidden {
      display: none;
  }
    }
    @media (width >= 48rem) {
  .md\:inline {
      display: inline;
  }
    }
    @media (width >= 48rem) {
  .md\:w-80 {
      width: calc(var(--spacing) * 80);
  }
    }
    @media (width >= 48rem) {
  .md\:max-w-\[60\%\] {
      max-width: 60%;
  }
    }
    @media (width >= 48rem) {
  .md\:flex-1 {
      flex: 1;
  }
    }
    @media (width >= 48rem) {
  .md\:grid-cols-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
  }
    }
    @media (width >= 48rem) {
  .md\:flex-row {
      flex-direction: row;
  }
    }
    @media (width >= 48rem) {
  .md\:flex-nowrap {
      flex-wrap: nowrap;
  }
    }
    @media (width >= 48rem) {
  .md\:items-center {
      align-items: center;
  }
    }
    @media (width >= 48rem) {
  .md\:justify-between {
      justify-content: space-between;
  }
    }
    @media (width >= 48rem) {
  .md\:gap-10 {
      gap: calc(var(--spacing) * 10);
  }
    }
    @media (width >= 64rem) {
  .lg\:fixed {
      position: fixed;
  }
    }
    @media (width >= 64rem) {
  .lg\:start-auto {
      inset-inline-start: auto;
  }
    }
    @media (width >= 64rem) {
  .lg\:top-\(--header-height\) {
      top: var(--header-height);
  }
    }
    @media (width >= 64rem) {
  .lg\:top-\[15\%\] {
      top: 15%;
  }
    }
    @media (width >= 64rem) {
  .lg\:top-\[80px\] {
      top: 80px;
  }
    }
    @media (width >= 64rem) {
  .lg\:right-auto {
      right: auto;
  }
    }
    @media (width >= 64rem) {
  .lg\:order-1 {
      order: 1;
  }
    }
    @media (width >= 64rem) {
  .lg\:order-2 {
      order: 2;
  }
    }
    @media (width >= 64rem) {
  .lg\:col-span-1 {
      grid-column: span 1 / span 1;
  }
    }
    @media (width >= 64rem) {
  .lg\:col-span-2 {
      grid-column: span 2 / span 2;
  }
    }
    @media (width >= 64rem) {
  .lg\:col-span-3 {
      grid-column: span 3 / span 3;
  }
    }
    @media (width >= 64rem) {
  .lg\:m-5 {
      margin: calc(var(--spacing) * 5);
  }
    }
    @media (width >= 64rem) {
  .lg\:mx-0 {
      margin-inline: calc(var(--spacing) * 0);
  }
    }
    @media (width >= 64rem) {
  .lg\:mx-3 {
      margin-inline: calc(var(--spacing) * 3);
  }
    }
    @media (width >= 64rem) {
  .lg\:ms-\(--sidebar-width\) {
      margin-inline-start: var(--sidebar-width);
  }
    }
    @media (width >= 64rem) {
  .lg\:ms-4 {
      margin-inline-start: calc(var(--spacing) * 4);
  }
    }
    @media (width >= 64rem) {
  .lg\:me-10 {
      margin-inline-end: calc(var(--spacing) * 10);
  }
    }
    @media (width >= 64rem) {
  .lg\:mt-\(--navbar-height\) {
      margin-top: var(--navbar-height);
  }
    }
    @media (width >= 64rem) {
  .lg\:mt-0 {
      margin-top: calc(var(--spacing) * 0);
  }
    }
    @media (width >= 64rem) {
  .lg\:mt-5 {
      margin-top: calc(var(--spacing) * 5);
  }
    }
    @media (width >= 64rem) {
  .lg\:mt-\[15px\] {
      margin-top: 15px;
  }
    }
    @media (width >= 64rem) {
  .lg\:mb-0 {
      margin-bottom: calc(var(--spacing) * 0);
  }
    }
    @media (width >= 64rem) {
  .lg\:mb-5 {
      margin-bottom: calc(var(--spacing) * 5);
  }
    }
    @media (width >= 64rem) {
  .lg\:mb-6 {
      margin-bottom: calc(var(--spacing) * 6);
  }
    }
    @media (width >= 64rem) {
  .lg\:mb-7 {
      margin-bottom: calc(var(--spacing) * 7);
  }
    }
    @media (width >= 64rem) {
  .lg\:mb-7\.5 {
      margin-bottom: calc(var(--spacing) * 7.5);
  }
    }
    @media (width >= 64rem) {
  .lg\:mb-8 {
      margin-bottom: calc(var(--spacing) * 8);
  }
    }
    @media (width >= 64rem) {
  .lg\:mb-9 {
      margin-bottom: calc(var(--spacing) * 9);
  }
    }
    @media (width >= 64rem) {
  .lg\:mb-10 {
      margin-bottom: calc(var(--spacing) * 10);
  }
    }
    @media (width >= 64rem) {
  .lg\:mb-11 {
      margin-bottom: calc(var(--spacing) * 11);
  }
    }
    @media (width >= 64rem) {
  .lg\:block {
      display: block;
  }
    }
    @media (width >= 64rem) {
  .lg\:flex {
      display: flex;
  }
    }
    @media (width >= 64rem) {
  .lg\:hidden {
      display: none;
  }
    }
    @media (width >= 64rem) {
  .lg\:inline {
      display: inline;
  }
    }
    @media (width >= 64rem) {
  .lg\:inline-flex {
      display: inline-flex;
  }
    }
    @media (width >= 64rem) {
  .lg\:h-\(--header-height\) {
      height: var(--header-height);
  }
    }
    @media (width >= 64rem) {
  .lg\:h-\[50px\] {
      height: 50px;
  }
    }
    @media (width >= 64rem) {
  .lg\:max-h-\[calc\(100dvh-70px\)\)\] {
      max-height: calc(100dvh - 70px);
  }
    }
    @media (width >= 64rem) {
  .lg\:w-\(--sidebar-width\) {
      width: var(--sidebar-width);
  }
    }
    @media (width >= 64rem) {
  .lg\:w-60 {
      width: calc(var(--spacing) * 60);
  }
    }
    @media (width >= 64rem) {
  .lg\:w-\[50px\] {
      width: 50px;
  }
    }
    @media (width >= 64rem) {
  .lg\:w-\[240px\] {
      width: 240px;
  }
    }
    @media (width >= 64rem) {
  .lg\:w-\[250px\] {
      width: 250px;
  }
    }
    @media (width >= 64rem) {
  .lg\:w-\[260px\] {
      width: 260px;
  }
    }
    @media (width >= 64rem) {
  .lg\:w-\[280px\] {
      width: 280px;
  }
    }
    @media (width >= 64rem) {
  .lg\:w-\[400px\] {
      width: 400px;
  }
    }
    @media (width >= 64rem) {
  .lg\:max-w-\[220px\] {
      max-width: 220px;
  }
    }
    @media (width >= 64rem) {
  .lg\:max-w-\[600px\] {
      max-width: 600px;
  }
    }
    @media (width >= 64rem) {
  .lg\:max-w-\[670px\] {
      max-width: 670px;
  }
    }
    @media (width >= 64rem) {
  .lg\:max-w-\[700px\] {
      max-width: 700px;
  }
    }
    @media (width >= 64rem) {
  .lg\:max-w-\[900px\] {
      max-width: 900px;
  }
    }
    @media (width >= 64rem) {
  .lg\:max-w-\[1240px\] {
      max-width: 1240px;
  }
    }
    @media (width >= 64rem) {
  .lg\:min-w-24 {
      min-width: calc(var(--spacing) * 24);
  }
    }
    @media (width >= 64rem) {
  .lg\:grow-0 {
      flex-grow: 0;
  }
    }
    @media (width >= 64rem) {
  .lg\:grid-cols-1 {
      grid-template-columns: repeat(1, minmax(0, 1fr));
  }
    }
    @media (width >= 64rem) {
  .lg\:grid-cols-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
  }
    }
    @media (width >= 64rem) {
  .lg\:grid-cols-3 {
      grid-template-columns: repeat(3, minmax(0, 1fr));
  }
    }
    @media (width >= 64rem) {
  .lg\:grid-cols-5 {
      grid-template-columns: repeat(5, minmax(0, 1fr));
  }
    }
    @media (width >= 64rem) {
  .lg\:flex-col {
      flex-direction: column;
  }
    }
    @media (width >= 64rem) {
  .lg\:flex-row {
      flex-direction: row;
  }
    }
    @media (width >= 64rem) {
  .lg\:flex-nowrap {
      flex-wrap: nowrap;
  }
    }
    @media (width >= 64rem) {
  .lg\:flex-wrap {
      flex-wrap: wrap;
  }
    }
    @media (width >= 64rem) {
  .lg\:items-center {
      align-items: center;
  }
    }
    @media (width >= 64rem) {
  .lg\:items-end {
      align-items: flex-end;
  }
    }
    @media (width >= 64rem) {
  .lg\:items-stretch {
      align-items: stretch;
  }
    }
    @media (width >= 64rem) {
  .lg\:justify-between {
      justify-content: space-between;
  }
    }
    @media (width >= 64rem) {
  .lg\:justify-center {
      justify-content: center;
  }
    }
    @media (width >= 64rem) {
  .lg\:justify-end {
      justify-content: flex-end;
  }
    }
    @media (width >= 64rem) {
  .lg\:gap-1\.5 {
      gap: calc(var(--spacing) * 1.5);
  }
    }
    @media (width >= 64rem) {
  .lg\:gap-2 {
      gap: calc(var(--spacing) * 2);
  }
    }
    @media (width >= 64rem) {
  .lg\:gap-2\.5 {
      gap: calc(var(--spacing) * 2.5);
  }
    }
    @media (width >= 64rem) {
  .lg\:gap-3 {
      gap: calc(var(--spacing) * 3);
  }
    }
    @media (width >= 64rem) {
  .lg\:gap-3\.5 {
      gap: calc(var(--spacing) * 3.5);
  }
    }
    @media (width >= 64rem) {
  .lg\:gap-4 {
      gap: calc(var(--spacing) * 4);
  }
    }
    @media (width >= 64rem) {
  .lg\:gap-4\.5 {
      gap: calc(var(--spacing) * 4.5);
  }
    }
    @media (width >= 64rem) {
  .lg\:gap-5 {
      gap: calc(var(--spacing) * 5);
  }
    }
    @media (width >= 64rem) {
  .lg\:gap-6 {
      gap: calc(var(--spacing) * 6);
  }
    }
    @media (width >= 64rem) {
  .lg\:gap-7\.5 {
      gap: calc(var(--spacing) * 7.5);
  }
    }
    @media (width >= 64rem) {
  .lg\:gap-9 {
      gap: calc(var(--spacing) * 9);
  }
    }
    @media (width >= 64rem) {
  .lg\:gap-10 {
      gap: calc(var(--spacing) * 10);
  }
    }
    @media (width >= 64rem) {
  .lg\:gap-11 {
      gap: calc(var(--spacing) * 11);
  }
    }
    @media (width >= 64rem) {
  .lg\:gap-12 {
      gap: calc(var(--spacing) * 12);
  }
    }
    @media (width >= 64rem) {
  .lg\:gap-14 {
      gap: calc(var(--spacing) * 14);
  }
    }
    @media (width >= 64rem) {
  .lg\:gap-20 {
      gap: calc(var(--spacing) * 20);
  }
    }
    @media (width >= 64rem) {
  .lg\:overflow-hidden {
      overflow: hidden;
  }
    }
    @media (width >= 64rem) {
  .lg\:overflow-visible {
      overflow: visible;
  }
    }
    @media (width >= 64rem) {
  .lg\:rounded-none {
      border-radius: 0;
  }
    }
    @media (width >= 64rem) {
  .lg\:rounded-xl {
      border-radius: calc(var(--radius) + 4px);
  }
    }
    @media (width >= 64rem) {
  .lg\:rounded-e-xl {
      border-start-end-radius: calc(var(--radius) + 4px);
      border-end-end-radius: calc(var(--radius) + 4px);
  }
    }
    @media (width >= 64rem) {
  .lg\:rounded-t-none {
      border-top-left-radius: 0;
      border-top-right-radius: 0;
  }
    }
    @media (width >= 64rem) {
  .lg\:rounded-l-none {
      border-top-left-radius: 0;
      border-bottom-left-radius: 0;
  }
    }
    @media (width >= 64rem) {
  .lg\:rounded-l-xl {
      border-top-left-radius: calc(var(--radius) + 4px);
      border-bottom-left-radius: calc(var(--radius) + 4px);
  }
    }
    @media (width >= 64rem) {
  .lg\:rounded-tl-xl {
      border-top-left-radius: calc(var(--radius) + 4px);
  }
    }
    @media (width >= 64rem) {
  .lg\:rounded-r-none {
      border-top-right-radius: 0;
      border-bottom-right-radius: 0;
  }
    }
    @media (width >= 64rem) {
  .lg\:border {
      border-style: var(--tw-border-style);
      border-width: 1px;
  }
    }
    @media (width >= 64rem) {
  .lg\:border-0 {
      border-style: var(--tw-border-style);
      border-width: 0px;
  }
    }
    @media (width >= 64rem) {
  .lg\:border-s {
      border-inline-start-style: var(--tw-border-style);
      border-inline-start-width: 1px;
  }
    }
    @media (width >= 64rem) {
  .lg\:border-e {
      border-inline-end-style: var(--tw-border-style);
      border-inline-end-width: 1px;
  }
    }
    @media (width >= 64rem) {
  .lg\:border-t {
      border-top-style: var(--tw-border-style);
      border-top-width: 1px;
  }
    }
    @media (width >= 64rem) {
  .lg\:border-r {
      border-right-style: var(--tw-border-style);
      border-right-width: 1px;
  }
    }
    @media (width >= 64rem) {
  .lg\:border-border {
      border-color: var(--border);
  }
    }
    @media (width >= 64rem) {
  .lg\:border-s-border {
      border-inline-start-color: var(--border);
  }
    }
    @media (width >= 64rem) {
  .lg\:border-e-border {
      border-inline-end-color: var(--border);
  }
    }
    @media (width >= 64rem) {
  .lg\:border-t-border {
      border-top-color: var(--border);
  }
    }
    @media (width >= 64rem) {
  .lg\:border-r-border {
      border-right-color: var(--border);
  }
    }
    @media (width >= 64rem) {
  .lg\:p-0 {
      padding: calc(var(--spacing) * 0);
  }
    }
    @media (width >= 64rem) {
  .lg\:p-7 {
      padding: calc(var(--spacing) * 7);
  }
    }
    @media (width >= 64rem) {
  .lg\:p-7\.5 {
      padding: calc(var(--spacing) * 7.5);
  }
    }
    @media (width >= 64rem) {
  .lg\:p-10 {
      padding: calc(var(--spacing) * 10);
  }
    }
    @media (width >= 64rem) {
  .lg\:p-12 {
      padding: calc(var(--spacing) * 12);
  }
    }
    @media (width >= 64rem) {
  .lg\:p-16 {
      padding: calc(var(--spacing) * 16);
  }
    }
    @media (width >= 64rem) {
  .lg\:px-6 {
      padding-inline: calc(var(--spacing) * 6);
  }
    }
    @media (width >= 64rem) {
  .lg\:px-7 {
      padding-inline: calc(var(--spacing) * 7);
  }
    }
    @media (width >= 64rem) {
  .lg\:px-7\.5 {
      padding-inline: calc(var(--spacing) * 7.5);
  }
    }
    @media (width >= 64rem) {
  .lg\:px-10 {
      padding-inline: calc(var(--spacing) * 10);
  }
    }
    @media (width >= 64rem) {
  .lg\:py-0 {
      padding-block: calc(var(--spacing) * 0);
  }
    }
    @media (width >= 64rem) {
  .lg\:py-3\.5 {
      padding-block: calc(var(--spacing) * 3.5);
  }
    }
    @media (width >= 64rem) {
  .lg\:py-4 {
      padding-block: calc(var(--spacing) * 4);
  }
    }
    @media (width >= 64rem) {
  .lg\:py-5 {
      padding-block: calc(var(--spacing) * 5);
  }
    }
    @media (width >= 64rem) {
  .lg\:py-6 {
      padding-block: calc(var(--spacing) * 6);
  }
    }
    @media (width >= 64rem) {
  .lg\:py-7\.5 {
      padding-block: calc(var(--spacing) * 7.5);
  }
    }
    @media (width >= 64rem) {
  .lg\:py-9 {
      padding-block: calc(var(--spacing) * 9);
  }
    }
    @media (width >= 64rem) {
  .lg\:py-10 {
      padding-block: calc(var(--spacing) * 10);
  }
    }
    @media (width >= 64rem) {
  .lg\:ps-0 {
      padding-inline-start: calc(var(--spacing) * 0);
  }
    }
    @media (width >= 64rem) {
  .lg\:ps-4 {
      padding-inline-start: calc(var(--spacing) * 4);
  }
    }
    @media (width >= 64rem) {
  .lg\:ps-5 {
      padding-inline-start: calc(var(--spacing) * 5);
  }
    }
    @media (width >= 64rem) {
  .lg\:pe-0 {
      padding-inline-end: calc(var(--spacing) * 0);
  }
    }
    @media (width >= 64rem) {
  .lg\:pe-3 {
      padding-inline-end: calc(var(--spacing) * 3);
  }
    }
    @media (width >= 64rem) {
  .lg\:pe-5 {
      padding-inline-end: calc(var(--spacing) * 5);
  }
    }
    @media (width >= 64rem) {
  .lg\:pe-6 {
      padding-inline-end: calc(var(--spacing) * 6);
  }
    }
    @media (width >= 64rem) {
  .lg\:pe-8 {
      padding-inline-end: calc(var(--spacing) * 8);
  }
    }
    @media (width >= 64rem) {
  .lg\:pe-10 {
      padding-inline-end: calc(var(--spacing) * 10);
  }
    }
    @media (width >= 64rem) {
  .lg\:pe-12 {
      padding-inline-end: calc(var(--spacing) * 12);
  }
    }
    @media (width >= 64rem) {
  .lg\:pe-12\.5 {
      padding-inline-end: calc(var(--spacing) * 12.5);
  }
    }
    @media (width >= 64rem) {
  .lg\:pt-0 {
      padding-top: calc(var(--spacing) * 0);
  }
    }
    @media (width >= 64rem) {
  .lg\:pt-4 {
      padding-top: calc(var(--spacing) * 4);
  }
    }
    @media (width >= 64rem) {
  .lg\:pt-5 {
      padding-top: calc(var(--spacing) * 5);
  }
    }
    @media (width >= 64rem) {
  .lg\:pt-6 {
      padding-top: calc(var(--spacing) * 6);
  }
    }
    @media (width >= 64rem) {
  .lg\:pt-7 {
      padding-top: calc(var(--spacing) * 7);
  }
    }
    @media (width >= 64rem) {
  .lg\:pt-7\.5 {
      padding-top: calc(var(--spacing) * 7.5);
  }
    }
    @media (width >= 64rem) {
  .lg\:pt-9 {
      padding-top: calc(var(--spacing) * 9);
  }
    }
    @media (width >= 64rem) {
  .lg\:pt-10 {
      padding-top: calc(var(--spacing) * 10);
  }
    }
    @media (width >= 64rem) {
  .lg\:pr-12\.5 {
      padding-right: calc(var(--spacing) * 12.5);
  }
    }
    @media (width >= 64rem) {
  .lg\:pb-0 {
      padding-bottom: calc(var(--spacing) * 0);
  }
    }
    @media (width >= 64rem) {
  .lg\:pb-2\.5 {
      padding-bottom: calc(var(--spacing) * 2.5);
  }
    }
    @media (width >= 64rem) {
  .lg\:pb-4 {
      padding-bottom: calc(var(--spacing) * 4);
  }
    }
    @media (width >= 64rem) {
  .lg\:pb-5 {
      padding-bottom: calc(var(--spacing) * 5);
  }
    }
    @media (width >= 64rem) {
  .lg\:pb-7 {
      padding-bottom: calc(var(--spacing) * 7);
  }
    }
    @media (width >= 64rem) {
  .lg\:pb-7\.5 {
      padding-bottom: calc(var(--spacing) * 7.5);
  }
    }
    @media (width >= 64rem) {
  .lg\:pb-9 {
      padding-bottom: calc(var(--spacing) * 9);
  }
    }
    @media (width >= 64rem) {
  .lg\:pb-10 {
      padding-bottom: calc(var(--spacing) * 10);
  }
    }
    @media (width >= 64rem) {
  .lg\:text-end {
      text-align: end;
  }
    }
    @media (width >= 64rem) {
  .lg\:text-right {
      text-align: right;
  }
    }
    @media (width >= 64rem) {
  .lg\:text-2xl {
      font-size: var(--text-2xl);
      line-height: var(--tw-leading, var(--text-2xl--line-height));
  }
    }
    @media (width >= 64rem) {
  .lg\:text-sm {
      font-size: var(--text-sm);
      line-height: var(--tw-leading, var(--text-sm--line-height));
  }
    }
    @media (width >= 64rem) {
  .lg\:\[--kt-drawer-enable\:false\] {
      --kt-drawer-enable: false;
  }
    }
    @media (width >= 64rem) {
  .lg\:\[--kt-reparent-mode\:prepend\] {
      --kt-reparent-mode: prepend;
  }
    }
    @media (width >= 64rem) {
  .lg\:\[--kt-reparent-target\:\#headerContainer\] {
      --kt-reparent-target: #headerContainer;
  }
    }
    @media (width >= 64rem) {
  .lg\:\[--kt-reparent-target\:\#megaMenuContainer\] {
      --kt-reparent-target: #megaMenuContainer;
  }
    }
    @media (width >= 64rem) {
  .lg\:\[--kt-reparent-target\:\#megaMenuWrapper\] {
      --kt-reparent-target: #megaMenuWrapper;
  }
    }
    @media (width >= 64rem) {
  .lg\:\[--kt-scrollbar-width\:auto\] {
      --kt-scrollbar-width: auto;
  }
    }
    @media (width >= 64rem) {
  .lg\:\[--scrollbar-width\:auto\] {
      --scrollbar-width: auto;
  }
    }
    @media (width >= 64rem) {
  .lg\:\[scrollbar-width\:auto\] {
      scrollbar-width: auto;
  }
    }
    @media (width >= 80rem) {
  .xl\:me-14 {
      margin-inline-end: calc(var(--spacing) * 14);
  }
    }
    @media (width >= 80rem) {
  .xl\:me-16 {
      margin-inline-end: calc(var(--spacing) * 16);
  }
    }
    @media (width >= 80rem) {
  .xl\:w-\[38\.75rem\] {
      width: 38.75rem;
  }
    }
    @media (width >= 80rem) {
  .xl\:max-w-96 {
      max-width: calc(var(--spacing) * 96);
  }
    }
    @media (width >= 80rem) {
  .xl\:min-w-24 {
      min-width: calc(var(--spacing) * 24);
  }
    }
    @media (width >= 80rem) {
  .xl\:grid-cols-1 {
      grid-template-columns: repeat(1, minmax(0, 1fr));
  }
    }
    @media (width >= 80rem) {
  .xl\:grid-cols-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
  }
    }
    @media (width >= 80rem) {
  .xl\:grid-cols-3 {
      grid-template-columns: repeat(3, minmax(0, 1fr));
  }
    }
    @media (width >= 80rem) {
  .xl\:grid-cols-4 {
      grid-template-columns: repeat(4, minmax(0, 1fr));
  }
    }
    @media (width >= 80rem) {
  .xl\:grid-cols-7 {
      grid-template-columns: repeat(7, minmax(0, 1fr));
  }
    }
    @media (width >= 80rem) {
  .xl\:flex-row {
      flex-direction: row;
  }
    }
    @media (width >= 80rem) {
  .xl\:flex-nowrap {
      flex-wrap: nowrap;
  }
    }
    @media (width >= 80rem) {
  .xl\:gap-7\.5 {
      gap: calc(var(--spacing) * 7.5);
  }
    }
    @media (width >= 80rem) {
  .xl\:bg-cover {
      background-size: cover;
  }
    }
    @media (width >= 96rem) {
  .\32 xl\:-ml-\[60px\] {
      margin-left: calc(60px * -1);
  }
    }
    .ltr\:rounded-tl-xl:where(:dir(ltr),[dir="ltr"],[dir="ltr"] *) {
      border-top-left-radius: calc(var(--radius) + 4px);
    }
    .ltr\:rounded-tr-xl:where(:dir(ltr),[dir="ltr"],[dir="ltr"] *) {
      border-top-right-radius: calc(var(--radius) + 4px);
    }
    .ltr\:border-l:where(:dir(ltr),[dir="ltr"],[dir="ltr"] *) {
      border-left-style: var(--tw-border-style);
      border-left-width: 1px;
    }
    .rtl\:start-0:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
      inset-inline-start: calc(var(--spacing) * 0);
    }
    .rtl\:-translate-x-1\/2:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
      --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    .rtl\:translate-x-1\/2:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
      --tw-translate-x: calc(1 / 2 * 100%);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    .rtl\:translate-x-2\/4:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
      --tw-translate-x: calc(2 / 4 * 100%);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    .rtl\:rotate-180:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
      rotate: 180deg;
    }
    .rtl\:transform:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
      transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
    }
    .rtl\:justify-start:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
      justify-content: flex-start;
    }
    .rtl\:rounded-tl-xl:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
      border-top-left-radius: calc(var(--radius) + 4px);
    }
    .rtl\:rounded-tr-xl:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
      border-top-right-radius: calc(var(--radius) + 4px);
    }
    .rtl\:border-s:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
      border-inline-start-style: var(--tw-border-style);
      border-inline-start-width: 1px;
    }
    .rtl\:\[background-position\:-3rem_-3\.5rem\]:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
      background-position: -3rem -3.5rem;
    }
    .rtl\:\[background-position\:-4rem_-4rem\]:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
      background-position: -4rem -4rem;
    }
    .rtl\:\[background-position\:-30\%_41\%\]:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
      background-position: -30% 41%;
    }
    .rtl\:\[background-position\:-70\%_25\%\]:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
      background-position: -70% 25%;
    }
    .rtl\:\[background-position\:-195px_-85px\]:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
      background-position: -195px -85px;
    }
    .rtl\:bg-\[center_left_-8rem\]:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
      background-position: center left -8rem;
    }
    .rtl\:bg-\[left_top_-1\.7rem\]:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
      background-position: left top -1.7rem;
    }
      .rtl\:before\:translate-x-1\/2:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *)::before {
        content: var(--tw-content);
        --tw-translate-x: calc(1 / 2 * 100%);
        translate: var(--tw-translate-x) var(--tw-translate-y);
      }
    .dark\:block:is(.dark *) {
      display: block;
    }
    .dark\:hidden:is(.dark *) {
      display: none;
    }
    .dark\:inline-block:is(.dark *) {
      display: inline-block;
    }
    .dark\:border-green-950:is(.dark *) {
      border-color: var(--color-green-950);
    }
    .dark\:border-orange-950:is(.dark *) {
      border-color: var(--color-orange-950);
    }
    .dark\:border-violet-950:is(.dark *) {
      border-color: var(--color-violet-950);
    }
    .dark\:border-yellow-950:is(.dark *) {
      border-color: var(--color-yellow-950);
    }
    .dark\:border-zinc-600:is(.dark *) {
      border-color: var(--color-zinc-600);
    }
    .dark\:bg-background:is(.dark *) {
      background-color: var(--background);
    }
    .dark\:bg-background\/70:is(.dark *) {
      background-color: var(--background);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .dark\:bg-background\/70:is(.dark *) {
        background-color: color-mix(in oklab, var(--background) 70%, transparent);
    }
      }
    .dark\:bg-green-950\/30:is(.dark *) {
      background-color: color-mix(in srgb, oklch(26.6% 0.065 152.934) 30%, transparent);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .dark\:bg-green-950\/30:is(.dark *) {
        background-color: color-mix(in oklab, var(--color-green-950) 30%, transparent);
    }
      }
    .dark\:bg-orange-950\/30:is(.dark *) {
      background-color: color-mix(in srgb, oklch(26.6% 0.079 36.259) 30%, transparent);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .dark\:bg-orange-950\/30:is(.dark *) {
        background-color: color-mix(in oklab, var(--color-orange-950) 30%, transparent);
    }
      }
    .dark\:bg-violet-950\/30:is(.dark *) {
      background-color: color-mix(in srgb, oklch(28.3% 0.141 291.089) 30%, transparent);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .dark\:bg-violet-950\/30:is(.dark *) {
        background-color: color-mix(in oklab, var(--color-violet-950) 30%, transparent);
    }
      }
    .dark\:bg-yellow-950\/30:is(.dark *) {
      background-color: color-mix(in srgb, oklch(28.6% 0.066 53.813) 30%, transparent);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .dark\:bg-yellow-950\/30:is(.dark *) {
        background-color: color-mix(in oklab, var(--color-yellow-950) 30%, transparent);
    }
      }
    .dark\:fill-green-950\/30:is(.dark *) {
      fill: color-mix(in srgb, oklch(26.6% 0.065 152.934) 30%, transparent);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .dark\:fill-green-950\/30:is(.dark *) {
        fill: color-mix(in oklab, var(--color-green-950) 30%, transparent);
    }
      }
    .dark\:fill-violet-950\/30:is(.dark *) {
      fill: color-mix(in srgb, oklch(28.3% 0.141 291.089) 30%, transparent);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .dark\:fill-violet-950\/30:is(.dark *) {
        fill: color-mix(in oklab, var(--color-violet-950) 30%, transparent);
    }
      }
    .dark\:fill-yellow-950\/30:is(.dark *) {
      fill: color-mix(in srgb, oklch(28.6% 0.066 53.813) 30%, transparent);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .dark\:fill-yellow-950\/30:is(.dark *) {
        fill: color-mix(in oklab, var(--color-yellow-950) 30%, transparent);
    }
      }
    .dark\:stroke-green-950:is(.dark *) {
      stroke: var(--color-green-950);
    }
    .dark\:stroke-violet-950:is(.dark *) {
      stroke: var(--color-violet-950);
    }
    .dark\:stroke-yellow-950:is(.dark *) {
      stroke: var(--color-yellow-950);
    }
    .dark\:text-black\/30:is(.dark *) {
      color: color-mix(in srgb, #000 30%, transparent);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .dark\:text-black\/30:is(.dark *) {
        color: color-mix(in oklab, var(--color-black) 30%, transparent);
    }
      }
    .dark\:text-muted-foreground\/50:is(.dark *) {
      color: var(--muted-foreground);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .dark\:text-muted-foreground\/50:is(.dark *) {
        color: color-mix(in oklab, var(--muted-foreground) 50%, transparent);
    }
      }
    .dark\:text-red-500:is(.dark *) {
      color: var(--color-red-500);
    }
    .dark\:text-yellow-600:is(.dark *) {
      color: var(--color-yellow-600);
    }
    .dark\:ring-green-950:is(.dark *) {
      --tw-ring-color: var(--color-green-950);
    }
    .dark\:ring-violet-950:is(.dark *) {
      --tw-ring-color: var(--color-violet-950);
    }
    .dark\:ring-yellow-950:is(.dark *) {
      --tw-ring-color: var(--color-yellow-950);
    }
    .kt-accordion-active\:hidden.active[data-kt-accordion-item] {
      display: none;
    }
    .active[data-kt-accordion-item] > [data-kt-accordion-toggle] .kt-accordion-active\:hidden {
      display: none;
    }
    .active[data-kt-accordion-item] > .kt-accordion-active\:hidden[data-kt-accordion-toggle] {
      display: none;
    }
    .kt-accordion-active\:inline-flex.active[data-kt-accordion-item] {
      display: inline-flex;
    }
    .active[data-kt-accordion-item] > [data-kt-accordion-toggle] .kt-accordion-active\:inline-flex {
      display: inline-flex;
    }
    .active[data-kt-accordion-item] > .kt-accordion-active\:inline-flex[data-kt-accordion-toggle] {
      display: inline-flex;
    }
    .open[data-kt-dropdown-initialized] > .kt-dropdown-open\:bg-background[data-kt-dropdown-toggle] {
      background-color: var(--background);
    }
    .open[data-kt-dropdown-initialized] > [data-kt-dropdown-toggle] .kt-dropdown-open\:bg-background {
      background-color: var(--background);
    }
    .open[data-kt-dropdown-initialized] > .kt-dropdown-open\:bg-primary\/10[data-kt-dropdown-toggle] {
      background-color: var(--primary);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .open[data-kt-dropdown-initialized] > .kt-dropdown-open\:bg-primary\/10[data-kt-dropdown-toggle] {
        background-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
      }
    .open[data-kt-dropdown-initialized] > [data-kt-dropdown-toggle] .kt-dropdown-open\:bg-primary\/10 {
      background-color: var(--primary);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .open[data-kt-dropdown-initialized] > [data-kt-dropdown-toggle] .kt-dropdown-open\:bg-primary\/10 {
        background-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
      }
    .open[data-kt-dropdown-initialized] > .kt-dropdown-open\:bg-transparent[data-kt-dropdown-toggle] {
      background-color: transparent;
    }
    .open[data-kt-dropdown-initialized] > [data-kt-dropdown-toggle] .kt-dropdown-open\:bg-transparent {
      background-color: transparent;
    }
    .empty[data-kt-image-input-initialized] .kt-image-input-empty\:border-input {
      border-color: var(--input);
    }
    .kt-modal-open\:\!flex.open[data-kt-modal-initialized] {
      display: flex !important;
    }
    .open[data-kt-modal-initialized] .kt-modal-open\:\!flex {
      display: flex !important;
    }
    .kt-scrollspy-active\:font-medium.active[data-kt-scrollspy-anchor] {
      --tw-font-weight: var(--font-weight-medium);
      font-weight: var(--font-weight-medium);
    }
    .active[data-kt-scrollspy-anchor] .kt-scrollspy-active\:font-medium {
      --tw-font-weight: var(--font-weight-medium);
      font-weight: var(--font-weight-medium);
    }
    .kt-scrollspy-active\:text-primary.active[data-kt-scrollspy-anchor] {
      color: var(--primary);
    }
    .active[data-kt-scrollspy-anchor] .kt-scrollspy-active\:text-primary {
      color: var(--primary);
    }
      .kt-scrollspy-active\:before\:bg-primary.active[data-kt-scrollspy-anchor]::before {
        content: var(--tw-content);
        background-color: var(--primary);
      }
      :is(.active[data-kt-scrollspy-anchor] .kt-scrollspy-active\:before\:bg-primary)::before {
        content: var(--tw-content);
        background-color: var(--primary);
      }
    .kt-select-option-selected\:block .selected[data-kt-select-option] {
      display: block;
    }
    .selected[data-kt-select-option] .kt-select-option-selected\:block {
      display: block;
    }
    .kt-tab-active\:border-primary\/10.active[data-kt-tab-toggle] {
      border-color: var(--primary);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-tab-active\:border-primary\/10.active[data-kt-tab-toggle] {
        border-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
      }
    .active[data-kt-tab-toggle] .kt-tab-active\:border-primary\/10 {
      border-color: var(--primary);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .active[data-kt-tab-toggle] .kt-tab-active\:border-primary\/10 {
        border-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
      }
    [data-kt-tabs-initialized]	[data-kt-dropdown-initialized]:has([data-kt-tab-toggle].active)	.kt-tab-active\:border-primary\/10 {
      border-color: var(--primary);
    }
      @supports (color: color-mix(in lab, red, red)) {
    [data-kt-tabs-initialized]	[data-kt-dropdown-initialized]:has([data-kt-tab-toggle].active)	.kt-tab-active\:border-primary\/10 {
        border-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
      }
    .kt-tab-active\:bg-primary\/10.active[data-kt-tab-toggle] {
      background-color: var(--primary);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-tab-active\:bg-primary\/10.active[data-kt-tab-toggle] {
        background-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
      }
    .active[data-kt-tab-toggle] .kt-tab-active\:bg-primary\/10 {
      background-color: var(--primary);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .active[data-kt-tab-toggle] .kt-tab-active\:bg-primary\/10 {
        background-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
      }
    [data-kt-tabs-initialized]	[data-kt-dropdown-initialized]:has([data-kt-tab-toggle].active)	.kt-tab-active\:bg-primary\/10 {
      background-color: var(--primary);
    }
      @supports (color: color-mix(in lab, red, red)) {
    [data-kt-tabs-initialized]	[data-kt-dropdown-initialized]:has([data-kt-tab-toggle].active)	.kt-tab-active\:bg-primary\/10 {
        background-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
      }
    .kt-tab-active\:text-primary.active[data-kt-tab-toggle] {
      color: var(--primary);
    }
    .active[data-kt-tab-toggle] .kt-tab-active\:text-primary {
      color: var(--primary);
    }
    [data-kt-tabs-initialized]	[data-kt-dropdown-initialized]:has([data-kt-tab-toggle].active)	.kt-tab-active\:text-primary {
      color: var(--primary);
    }
    .kt-toggle-active\:rotate-180.active[data-kt-toggle] {
      rotate: 180deg;
    }
    .active[data-kt-toggle] .kt-toggle-active\:rotate-180 {
      rotate: 180deg;
    }
      .rtl\:kt-toggle-active\:rotate-0.active[data-kt-toggle]:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
        rotate: 0deg;
      }
      .active[data-kt-toggle] .rtl\:kt-toggle-active\:rotate-0:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
        rotate: 0deg;
      }
    .kt-toggle-password-active\:block.active[data-kt-toggle-password-initialized] {
      display: block;
    }
    .active[data-kt-toggle-password-initialized] .kt-toggle-password-active\:block {
      display: block;
    }
    .kt-toggle-password-active\:hidden.active[data-kt-toggle-password-initialized] {
      display: none;
    }
    .active[data-kt-toggle-password-initialized] .kt-toggle-password-active\:hidden {
      display: none;
    }
    .light\:hidden:not(.dark *) {
      display: none;
    }
    .light\:bg-accent\/50:not(.dark *) {
      background-color: var(--accent);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .light\:bg-accent\/50:not(.dark *) {
        background-color: color-mix(in oklab, var(--accent) 50%, transparent);
    }
      }
    .kt-menu-item-active\:rounded-lg.kt-menu-item.active {
      border-radius: var(--radius);
    }
    .kt-menu-item.active .kt-menu-item-active\:rounded-lg {
      border-radius: var(--radius);
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:rounded-lg {
      border-radius: var(--radius);
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:rounded-lg {
      border-radius: var(--radius);
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:rounded-lg {
      border-radius: var(--radius);
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:rounded-lg {
      border-radius: var(--radius);
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:rounded-lg {
      border-radius: var(--radius);
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:rounded-lg {
      border-radius: var(--radius);
    }
    .kt-menu-item-active\:border-none.kt-menu-item.active {
      --tw-border-style: none;
      border-style: none;
    }
    .kt-menu-item.active .kt-menu-item-active\:border-none {
      --tw-border-style: none;
      border-style: none;
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:border-none {
      --tw-border-style: none;
      border-style: none;
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:border-none {
      --tw-border-style: none;
      border-style: none;
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:border-none {
      --tw-border-style: none;
      border-style: none;
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:border-none {
      --tw-border-style: none;
      border-style: none;
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:border-none {
      --tw-border-style: none;
      border-style: none;
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:border-none {
      --tw-border-style: none;
      border-style: none;
    }
    .kt-menu-item-active\:border-border.kt-menu-item.active {
      border-color: var(--border);
    }
    .kt-menu-item.active .kt-menu-item-active\:border-border {
      border-color: var(--border);
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:border-border {
      border-color: var(--border);
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:border-border {
      border-color: var(--border);
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:border-border {
      border-color: var(--border);
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:border-border {
      border-color: var(--border);
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:border-border {
      border-color: var(--border);
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:border-border {
      border-color: var(--border);
    }
    .kt-menu-item-active\:border-b-gray-400.kt-menu-item.active {
      border-bottom-color: var(--color-gray-400);
    }
    .kt-menu-item.active .kt-menu-item-active\:border-b-gray-400 {
      border-bottom-color: var(--color-gray-400);
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:border-b-gray-400 {
      border-bottom-color: var(--color-gray-400);
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:border-b-gray-400 {
      border-bottom-color: var(--color-gray-400);
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:border-b-gray-400 {
      border-bottom-color: var(--color-gray-400);
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:border-b-gray-400 {
      border-bottom-color: var(--color-gray-400);
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:border-b-gray-400 {
      border-bottom-color: var(--color-gray-400);
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:border-b-gray-400 {
      border-bottom-color: var(--color-gray-400);
    }
    .kt-menu-item-active\:border-b-mono.kt-menu-item.active {
      border-bottom-color: var(--mono);
    }
    .kt-menu-item.active .kt-menu-item-active\:border-b-mono {
      border-bottom-color: var(--mono);
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:border-b-mono {
      border-bottom-color: var(--mono);
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:border-b-mono {
      border-bottom-color: var(--mono);
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:border-b-mono {
      border-bottom-color: var(--mono);
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:border-b-mono {
      border-bottom-color: var(--mono);
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:border-b-mono {
      border-bottom-color: var(--mono);
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:border-b-mono {
      border-bottom-color: var(--mono);
    }
    .kt-menu-item-active\:border-b-primary.kt-menu-item.active {
      border-bottom-color: var(--primary);
    }
    .kt-menu-item.active .kt-menu-item-active\:border-b-primary {
      border-bottom-color: var(--primary);
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:border-b-primary {
      border-bottom-color: var(--primary);
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:border-b-primary {
      border-bottom-color: var(--primary);
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:border-b-primary {
      border-bottom-color: var(--primary);
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:border-b-primary {
      border-bottom-color: var(--primary);
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:border-b-primary {
      border-bottom-color: var(--primary);
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:border-b-primary {
      border-bottom-color: var(--primary);
    }
    .kt-menu-item-active\:\!bg-background.kt-menu-item.active {
      background-color: var(--background) !important;
    }
    .kt-menu-item.active .kt-menu-item-active\:\!bg-background {
      background-color: var(--background) !important;
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:\!bg-background {
      background-color: var(--background) !important;
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:\!bg-background {
      background-color: var(--background) !important;
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:\!bg-background {
      background-color: var(--background) !important;
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:\!bg-background {
      background-color: var(--background) !important;
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:\!bg-background {
      background-color: var(--background) !important;
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:\!bg-background {
      background-color: var(--background) !important;
    }
    .kt-menu-item-active\:bg-accent\/60.kt-menu-item.active {
      background-color: var(--accent);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-menu-item-active\:bg-accent\/60.kt-menu-item.active {
        background-color: color-mix(in oklab, var(--accent) 60%, transparent);
    }
      }
    .kt-menu-item.active .kt-menu-item-active\:bg-accent\/60 {
      background-color: var(--accent);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-menu-item.active .kt-menu-item-active\:bg-accent\/60 {
        background-color: color-mix(in oklab, var(--accent) 60%, transparent);
    }
      }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:bg-accent\/60 {
      background-color: var(--accent);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:bg-accent\/60 {
        background-color: color-mix(in oklab, var(--accent) 60%, transparent);
    }
      }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:bg-accent\/60 {
      background-color: var(--accent);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:bg-accent\/60 {
        background-color: color-mix(in oklab, var(--accent) 60%, transparent);
    }
      }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:bg-accent\/60 {
      background-color: var(--accent);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:bg-accent\/60 {
        background-color: color-mix(in oklab, var(--accent) 60%, transparent);
    }
      }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:bg-accent\/60 {
      background-color: var(--accent);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:bg-accent\/60 {
        background-color: color-mix(in oklab, var(--accent) 60%, transparent);
    }
      }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:bg-accent\/60 {
      background-color: var(--accent);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:bg-accent\/60 {
        background-color: color-mix(in oklab, var(--accent) 60%, transparent);
    }
      }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:bg-accent\/60 {
      background-color: var(--accent);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:bg-accent\/60 {
        background-color: color-mix(in oklab, var(--accent) 60%, transparent);
    }
      }
    .kt-menu-item-active\:bg-background.kt-menu-item.active {
      background-color: var(--background);
    }
    .kt-menu-item.active .kt-menu-item-active\:bg-background {
      background-color: var(--background);
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:bg-background {
      background-color: var(--background);
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:bg-background {
      background-color: var(--background);
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:bg-background {
      background-color: var(--background);
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:bg-background {
      background-color: var(--background);
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:bg-background {
      background-color: var(--background);
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:bg-background {
      background-color: var(--background);
    }
    .kt-menu-item-active\:bg-secondary.kt-menu-item.active {
      background-color: var(--secondary);
    }
    .kt-menu-item.active .kt-menu-item-active\:bg-secondary {
      background-color: var(--secondary);
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:bg-secondary {
      background-color: var(--secondary);
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:bg-secondary {
      background-color: var(--secondary);
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:bg-secondary {
      background-color: var(--secondary);
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:bg-secondary {
      background-color: var(--secondary);
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:bg-secondary {
      background-color: var(--secondary);
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:bg-secondary {
      background-color: var(--secondary);
    }
    .kt-menu-item-active\:font-medium.kt-menu-item.active {
      --tw-font-weight: var(--font-weight-medium);
      font-weight: var(--font-weight-medium);
    }
    .kt-menu-item.active .kt-menu-item-active\:font-medium {
      --tw-font-weight: var(--font-weight-medium);
      font-weight: var(--font-weight-medium);
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:font-medium {
      --tw-font-weight: var(--font-weight-medium);
      font-weight: var(--font-weight-medium);
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:font-medium {
      --tw-font-weight: var(--font-weight-medium);
      font-weight: var(--font-weight-medium);
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:font-medium {
      --tw-font-weight: var(--font-weight-medium);
      font-weight: var(--font-weight-medium);
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:font-medium {
      --tw-font-weight: var(--font-weight-medium);
      font-weight: var(--font-weight-medium);
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:font-medium {
      --tw-font-weight: var(--font-weight-medium);
      font-weight: var(--font-weight-medium);
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:font-medium {
      --tw-font-weight: var(--font-weight-medium);
      font-weight: var(--font-weight-medium);
    }
    .kt-menu-item-active\:font-semibold.kt-menu-item.active {
      --tw-font-weight: var(--font-weight-semibold);
      font-weight: var(--font-weight-semibold);
    }
    .kt-menu-item.active .kt-menu-item-active\:font-semibold {
      --tw-font-weight: var(--font-weight-semibold);
      font-weight: var(--font-weight-semibold);
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:font-semibold {
      --tw-font-weight: var(--font-weight-semibold);
      font-weight: var(--font-weight-semibold);
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:font-semibold {
      --tw-font-weight: var(--font-weight-semibold);
      font-weight: var(--font-weight-semibold);
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:font-semibold {
      --tw-font-weight: var(--font-weight-semibold);
      font-weight: var(--font-weight-semibold);
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:font-semibold {
      --tw-font-weight: var(--font-weight-semibold);
      font-weight: var(--font-weight-semibold);
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:font-semibold {
      --tw-font-weight: var(--font-weight-semibold);
      font-weight: var(--font-weight-semibold);
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:font-semibold {
      --tw-font-weight: var(--font-weight-semibold);
      font-weight: var(--font-weight-semibold);
    }
    .kt-menu-item-active\:text-foreground.kt-menu-item.active {
      color: var(--foreground);
    }
    .kt-menu-item.active .kt-menu-item-active\:text-foreground {
      color: var(--foreground);
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:text-foreground {
      color: var(--foreground);
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:text-foreground {
      color: var(--foreground);
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:text-foreground {
      color: var(--foreground);
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:text-foreground {
      color: var(--foreground);
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:text-foreground {
      color: var(--foreground);
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:text-foreground {
      color: var(--foreground);
    }
    .kt-menu-item-active\:text-mono.kt-menu-item.active {
      color: var(--mono);
    }
    .kt-menu-item.active .kt-menu-item-active\:text-mono {
      color: var(--mono);
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:text-mono {
      color: var(--mono);
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:text-mono {
      color: var(--mono);
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:text-mono {
      color: var(--mono);
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:text-mono {
      color: var(--mono);
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:text-mono {
      color: var(--mono);
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:text-mono {
      color: var(--mono);
    }
    .kt-menu-item-active\:text-primary.kt-menu-item.active {
      color: var(--primary);
    }
    .kt-menu-item.active .kt-menu-item-active\:text-primary {
      color: var(--primary);
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:text-primary {
      color: var(--primary);
    }
    .kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:text-primary {
      color: var(--primary);
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:text-primary {
      color: var(--primary);
    }
    .kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:text-primary {
      color: var(--primary);
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:text-primary {
      color: var(--primary);
    }
    .kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:text-primary {
      color: var(--primary);
    }
      .kt-menu-item-active\:before\:bg-primary.kt-menu-item.active::before {
        content: var(--tw-content);
        background-color: var(--primary);
      }
      :is(.kt-menu-item.active .kt-menu-item-active\:before\:bg-primary)::before {
        content: var(--tw-content);
        background-color: var(--primary);
      }
      :is(.kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:before\:bg-primary)::before {
        content: var(--tw-content);
        background-color: var(--primary);
      }
      :is(.kt-menu-item.active > .kt-menu-link .kt-menu-item-active\:before\:bg-primary)::before {
        content: var(--tw-content);
        background-color: var(--primary);
      }
      :is(.kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:before\:bg-primary)::before {
        content: var(--tw-content);
        background-color: var(--primary);
      }
      :is(.kt-menu-item.active > .kt-menu-label .kt-menu-item-active\:before\:bg-primary)::before {
        content: var(--tw-content);
        background-color: var(--primary);
      }
      :is(.kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:before\:bg-primary)::before {
        content: var(--tw-content);
        background-color: var(--primary);
      }
      :is(.kt-menu-item.active > .kt-menu-toggle .kt-menu-item-active\:before\:bg-primary)::before {
        content: var(--tw-content);
        background-color: var(--primary);
      }
    .kt-menu-item-here\:border-border.kt-menu-item.here {
      border-color: var(--border);
    }
    .kt-menu-item.here > .kt-menu-link .kt-menu-item-here\:border-border {
      border-color: var(--border);
    }
    .kt-menu-item.here > .kt-menu-link .kt-menu-item-here\:border-border {
      border-color: var(--border);
    }
    .kt-menu-item.here > .kt-menu-label .kt-menu-item-here\:border-border {
      border-color: var(--border);
    }
    .kt-menu-item.here > .kt-menu-label .kt-menu-item-here\:border-border {
      border-color: var(--border);
    }
    .kt-menu-item.here > .kt-menu-toggle .kt-menu-item-here\:border-border {
      border-color: var(--border);
    }
    .kt-menu-item.here > .kt-menu-toggle .kt-menu-item-here\:border-border {
      border-color: var(--border);
    }
    .kt-menu-item-here\:border-b-gray-400.kt-menu-item.here {
      border-bottom-color: var(--color-gray-400);
    }
    .kt-menu-item.here > .kt-menu-link .kt-menu-item-here\:border-b-gray-400 {
      border-bottom-color: var(--color-gray-400);
    }
    .kt-menu-item.here > .kt-menu-link .kt-menu-item-here\:border-b-gray-400 {
      border-bottom-color: var(--color-gray-400);
    }
    .kt-menu-item.here > .kt-menu-label .kt-menu-item-here\:border-b-gray-400 {
      border-bottom-color: var(--color-gray-400);
    }
    .kt-menu-item.here > .kt-menu-label .kt-menu-item-here\:border-b-gray-400 {
      border-bottom-color: var(--color-gray-400);
    }
    .kt-menu-item.here > .kt-menu-toggle .kt-menu-item-here\:border-b-gray-400 {
      border-bottom-color: var(--color-gray-400);
    }
    .kt-menu-item.here > .kt-menu-toggle .kt-menu-item-here\:border-b-gray-400 {
      border-bottom-color: var(--color-gray-400);
    }
    .kt-menu-item-here\:border-b-mono.kt-menu-item.here {
      border-bottom-color: var(--mono);
    }
    .kt-menu-item.here > .kt-menu-link .kt-menu-item-here\:border-b-mono {
      border-bottom-color: var(--mono);
    }
    .kt-menu-item.here > .kt-menu-link .kt-menu-item-here\:border-b-mono {
      border-bottom-color: var(--mono);
    }
    .kt-menu-item.here > .kt-menu-label .kt-menu-item-here\:border-b-mono {
      border-bottom-color: var(--mono);
    }
    .kt-menu-item.here > .kt-menu-label .kt-menu-item-here\:border-b-mono {
      border-bottom-color: var(--mono);
    }
    .kt-menu-item.here > .kt-menu-toggle .kt-menu-item-here\:border-b-mono {
      border-bottom-color: var(--mono);
    }
    .kt-menu-item.here > .kt-menu-toggle .kt-menu-item-here\:border-b-mono {
      border-bottom-color: var(--mono);
    }
    .kt-menu-item-here\:border-b-primary.kt-menu-item.here {
      border-bottom-color: var(--primary);
    }
    .kt-menu-item.here > .kt-menu-link .kt-menu-item-here\:border-b-primary {
      border-bottom-color: var(--primary);
    }
    .kt-menu-item.here > .kt-menu-link .kt-menu-item-here\:border-b-primary {
      border-bottom-color: var(--primary);
    }
    .kt-menu-item.here > .kt-menu-label .kt-menu-item-here\:border-b-primary {
      border-bottom-color: var(--primary);
    }
    .kt-menu-item.here > .kt-menu-label .kt-menu-item-here\:border-b-primary {
      border-bottom-color: var(--primary);
    }
    .kt-menu-item.here > .kt-menu-toggle .kt-menu-item-here\:border-b-primary {
      border-bottom-color: var(--primary);
    }
    .kt-menu-item.here > .kt-menu-toggle .kt-menu-item-here\:border-b-primary {
      border-bottom-color: var(--primary);
    }
    .kt-menu-item-here\:bg-background.kt-menu-item.here {
      background-color: var(--background);
    }
    .kt-menu-item.here > .kt-menu-link .kt-menu-item-here\:bg-background {
      background-color: var(--background);
    }
    .kt-menu-item.here > .kt-menu-link .kt-menu-item-here\:bg-background {
      background-color: var(--background);
    }
    .kt-menu-item.here > .kt-menu-label .kt-menu-item-here\:bg-background {
      background-color: var(--background);
    }
    .kt-menu-item.here > .kt-menu-label .kt-menu-item-here\:bg-background {
      background-color: var(--background);
    }
    .kt-menu-item.here > .kt-menu-toggle .kt-menu-item-here\:bg-background {
      background-color: var(--background);
    }
    .kt-menu-item.here > .kt-menu-toggle .kt-menu-item-here\:bg-background {
      background-color: var(--background);
    }
    .kt-menu-item-here\:bg-transparent.kt-menu-item.here {
      background-color: transparent;
    }
    .kt-menu-item.here > .kt-menu-link .kt-menu-item-here\:bg-transparent {
      background-color: transparent;
    }
    .kt-menu-item.here > .kt-menu-link .kt-menu-item-here\:bg-transparent {
      background-color: transparent;
    }
    .kt-menu-item.here > .kt-menu-label .kt-menu-item-here\:bg-transparent {
      background-color: transparent;
    }
    .kt-menu-item.here > .kt-menu-label .kt-menu-item-here\:bg-transparent {
      background-color: transparent;
    }
    .kt-menu-item.here > .kt-menu-toggle .kt-menu-item-here\:bg-transparent {
      background-color: transparent;
    }
    .kt-menu-item.here > .kt-menu-toggle .kt-menu-item-here\:bg-transparent {
      background-color: transparent;
    }
    .kt-menu-item-here\:font-medium.kt-menu-item.here {
      --tw-font-weight: var(--font-weight-medium);
      font-weight: var(--font-weight-medium);
    }
    .kt-menu-item.here > .kt-menu-link .kt-menu-item-here\:font-medium {
      --tw-font-weight: var(--font-weight-medium);
      font-weight: var(--font-weight-medium);
    }
    .kt-menu-item.here > .kt-menu-link .kt-menu-item-here\:font-medium {
      --tw-font-weight: var(--font-weight-medium);
      font-weight: var(--font-weight-medium);
    }
    .kt-menu-item.here > .kt-menu-label .kt-menu-item-here\:font-medium {
      --tw-font-weight: var(--font-weight-medium);
      font-weight: var(--font-weight-medium);
    }
    .kt-menu-item.here > .kt-menu-label .kt-menu-item-here\:font-medium {
      --tw-font-weight: var(--font-weight-medium);
      font-weight: var(--font-weight-medium);
    }
    .kt-menu-item.here > .kt-menu-toggle .kt-menu-item-here\:font-medium {
      --tw-font-weight: var(--font-weight-medium);
      font-weight: var(--font-weight-medium);
    }
    .kt-menu-item.here > .kt-menu-toggle .kt-menu-item-here\:font-medium {
      --tw-font-weight: var(--font-weight-medium);
      font-weight: var(--font-weight-medium);
    }
    .kt-menu-item-here\:font-semibold.kt-menu-item.here {
      --tw-font-weight: var(--font-weight-semibold);
      font-weight: var(--font-weight-semibold);
    }
    .kt-menu-item.here > .kt-menu-link .kt-menu-item-here\:font-semibold {
      --tw-font-weight: var(--font-weight-semibold);
      font-weight: var(--font-weight-semibold);
    }
    .kt-menu-item.here > .kt-menu-link .kt-menu-item-here\:font-semibold {
      --tw-font-weight: var(--font-weight-semibold);
      font-weight: var(--font-weight-semibold);
    }
    .kt-menu-item.here > .kt-menu-label .kt-menu-item-here\:font-semibold {
      --tw-font-weight: var(--font-weight-semibold);
      font-weight: var(--font-weight-semibold);
    }
    .kt-menu-item.here > .kt-menu-label .kt-menu-item-here\:font-semibold {
      --tw-font-weight: var(--font-weight-semibold);
      font-weight: var(--font-weight-semibold);
    }
    .kt-menu-item.here > .kt-menu-toggle .kt-menu-item-here\:font-semibold {
      --tw-font-weight: var(--font-weight-semibold);
      font-weight: var(--font-weight-semibold);
    }
    .kt-menu-item.here > .kt-menu-toggle .kt-menu-item-here\:font-semibold {
      --tw-font-weight: var(--font-weight-semibold);
      font-weight: var(--font-weight-semibold);
    }
    .kt-menu-item-here\:text-foreground.kt-menu-item.here {
      color: var(--foreground);
    }
    .kt-menu-item.here > .kt-menu-link .kt-menu-item-here\:text-foreground {
      color: var(--foreground);
    }
    .kt-menu-item.here > .kt-menu-link .kt-menu-item-here\:text-foreground {
      color: var(--foreground);
    }
    .kt-menu-item.here > .kt-menu-label .kt-menu-item-here\:text-foreground {
      color: var(--foreground);
    }
    .kt-menu-item.here > .kt-menu-label .kt-menu-item-here\:text-foreground {
      color: var(--foreground);
    }
    .kt-menu-item.here > .kt-menu-toggle .kt-menu-item-here\:text-foreground {
      color: var(--foreground);
    }
    .kt-menu-item.here > .kt-menu-toggle .kt-menu-item-here\:text-foreground {
      color: var(--foreground);
    }
    .kt-menu-item-here\:text-mono.kt-menu-item.here {
      color: var(--mono);
    }
    .kt-menu-item.here > .kt-menu-link .kt-menu-item-here\:text-mono {
      color: var(--mono);
    }
    .kt-menu-item.here > .kt-menu-link .kt-menu-item-here\:text-mono {
      color: var(--mono);
    }
    .kt-menu-item.here > .kt-menu-label .kt-menu-item-here\:text-mono {
      color: var(--mono);
    }
    .kt-menu-item.here > .kt-menu-label .kt-menu-item-here\:text-mono {
      color: var(--mono);
    }
    .kt-menu-item.here > .kt-menu-toggle .kt-menu-item-here\:text-mono {
      color: var(--mono);
    }
    .kt-menu-item.here > .kt-menu-toggle .kt-menu-item-here\:text-mono {
      color: var(--mono);
    }
    .kt-menu-item-here\:text-muted-foreground.kt-menu-item.here {
      color: var(--muted-foreground);
    }
    .kt-menu-item.here > .kt-menu-link .kt-menu-item-here\:text-muted-foreground {
      color: var(--muted-foreground);
    }
    .kt-menu-item.here > .kt-menu-link .kt-menu-item-here\:text-muted-foreground {
      color: var(--muted-foreground);
    }
    .kt-menu-item.here > .kt-menu-label .kt-menu-item-here\:text-muted-foreground {
      color: var(--muted-foreground);
    }
    .kt-menu-item.here > .kt-menu-label .kt-menu-item-here\:text-muted-foreground {
      color: var(--muted-foreground);
    }
    .kt-menu-item.here > .kt-menu-toggle .kt-menu-item-here\:text-muted-foreground {
      color: var(--muted-foreground);
    }
    .kt-menu-item.here > .kt-menu-toggle .kt-menu-item-here\:text-muted-foreground {
      color: var(--muted-foreground);
    }
    .kt-menu-item-here\:text-primary.kt-menu-item.here {
      color: var(--primary);
    }
    .kt-menu-item.here > .kt-menu-link .kt-menu-item-here\:text-primary {
      color: var(--primary);
    }
    .kt-menu-item.here > .kt-menu-link .kt-menu-item-here\:text-primary {
      color: var(--primary);
    }
    .kt-menu-item.here > .kt-menu-label .kt-menu-item-here\:text-primary {
      color: var(--primary);
    }
    .kt-menu-item.here > .kt-menu-label .kt-menu-item-here\:text-primary {
      color: var(--primary);
    }
    .kt-menu-item.here > .kt-menu-toggle .kt-menu-item-here\:text-primary {
      color: var(--primary);
    }
    .kt-menu-item.here > .kt-menu-toggle .kt-menu-item-here\:text-primary {
      color: var(--primary);
    }
    .kt-menu-item-show\:\!flex.kt-menu-item.show {
      display: flex !important;
    }
    .kt-menu-item.show > .kt-menu-link .kt-menu-item-show\:\!flex {
      display: flex !important;
    }
    .kt-menu-item.show > .kt-menu-link .kt-menu-item-show\:\!flex {
      display: flex !important;
    }
    .kt-menu-item.show > .kt-menu-label .kt-menu-item-show\:\!flex {
      display: flex !important;
    }
    .kt-menu-item.show > .kt-menu-label .kt-menu-item-show\:\!flex {
      display: flex !important;
    }
    .kt-menu-item.show > .kt-menu-toggle .kt-menu-item-show\:\!flex {
      display: flex !important;
    }
    .kt-menu-item.show > .kt-menu-toggle .kt-menu-item-show\:\!flex {
      display: flex !important;
    }
    .kt-menu-item-show\:hidden.kt-menu-item.show {
      display: none;
    }
    .kt-menu-item.show > .kt-menu-link .kt-menu-item-show\:hidden {
      display: none;
    }
    .kt-menu-item.show > .kt-menu-link .kt-menu-item-show\:hidden {
      display: none;
    }
    .kt-menu-item.show > .kt-menu-label .kt-menu-item-show\:hidden {
      display: none;
    }
    .kt-menu-item.show > .kt-menu-label .kt-menu-item-show\:hidden {
      display: none;
    }
    .kt-menu-item.show > .kt-menu-toggle .kt-menu-item-show\:hidden {
      display: none;
    }
    .kt-menu-item.show > .kt-menu-toggle .kt-menu-item-show\:hidden {
      display: none;
    }
    .kt-menu-item-show\:inline-flex.kt-menu-item.show {
      display: inline-flex;
    }
    .kt-menu-item.show > .kt-menu-link .kt-menu-item-show\:inline-flex {
      display: inline-flex;
    }
    .kt-menu-item.show > .kt-menu-link .kt-menu-item-show\:inline-flex {
      display: inline-flex;
    }
    .kt-menu-item.show > .kt-menu-label .kt-menu-item-show\:inline-flex {
      display: inline-flex;
    }
    .kt-menu-item.show > .kt-menu-label .kt-menu-item-show\:inline-flex {
      display: inline-flex;
    }
    .kt-menu-item.show > .kt-menu-toggle .kt-menu-item-show\:inline-flex {
      display: inline-flex;
    }
    .kt-menu-item.show > .kt-menu-toggle .kt-menu-item-show\:inline-flex {
      display: inline-flex;
    }
    .kt-menu-item-show\:text-foreground.kt-menu-item.show {
      color: var(--foreground);
    }
    .kt-menu-item.show > .kt-menu-link .kt-menu-item-show\:text-foreground {
      color: var(--foreground);
    }
    .kt-menu-item.show > .kt-menu-link .kt-menu-item-show\:text-foreground {
      color: var(--foreground);
    }
    .kt-menu-item.show > .kt-menu-label .kt-menu-item-show\:text-foreground {
      color: var(--foreground);
    }
    .kt-menu-item.show > .kt-menu-label .kt-menu-item-show\:text-foreground {
      color: var(--foreground);
    }
    .kt-menu-item.show > .kt-menu-toggle .kt-menu-item-show\:text-foreground {
      color: var(--foreground);
    }
    .kt-menu-item.show > .kt-menu-toggle .kt-menu-item-show\:text-foreground {
      color: var(--foreground);
    }
    .kt-menu-item-show\:text-mono.kt-menu-item.show {
      color: var(--mono);
    }
    .kt-menu-item.show > .kt-menu-link .kt-menu-item-show\:text-mono {
      color: var(--mono);
    }
    .kt-menu-item.show > .kt-menu-link .kt-menu-item-show\:text-mono {
      color: var(--mono);
    }
    .kt-menu-item.show > .kt-menu-label .kt-menu-item-show\:text-mono {
      color: var(--mono);
    }
    .kt-menu-item.show > .kt-menu-label .kt-menu-item-show\:text-mono {
      color: var(--mono);
    }
    .kt-menu-item.show > .kt-menu-toggle .kt-menu-item-show\:text-mono {
      color: var(--mono);
    }
    .kt-menu-item.show > .kt-menu-toggle .kt-menu-item-show\:text-mono {
      color: var(--mono);
    }
    .kt-menu-item-show\:text-primary.kt-menu-item.show {
      color: var(--primary);
    }
    .kt-menu-item.show > .kt-menu-link .kt-menu-item-show\:text-primary {
      color: var(--primary);
    }
    .kt-menu-item.show > .kt-menu-link .kt-menu-item-show\:text-primary {
      color: var(--primary);
    }
    .kt-menu-item.show > .kt-menu-label .kt-menu-item-show\:text-primary {
      color: var(--primary);
    }
    .kt-menu-item.show > .kt-menu-label .kt-menu-item-show\:text-primary {
      color: var(--primary);
    }
    .kt-menu-item.show > .kt-menu-toggle .kt-menu-item-show\:text-primary {
      color: var(--primary);
    }
    .kt-menu-item.show > .kt-menu-toggle .kt-menu-item-show\:text-primary {
      color: var(--primary);
    }
    .kt-menu-link-hover\:border-none.kt-menu-link:hover {
      --tw-border-style: none;
      border-style: none;
    }
    .kt-menu-link:hover .kt-menu-link-hover\:border-none {
      --tw-border-style: none;
      border-style: none;
    }
    .kt-menu-link-hover\:border-border.kt-menu-link:hover {
      border-color: var(--border);
    }
    .kt-menu-link:hover .kt-menu-link-hover\:border-border {
      border-color: var(--border);
    }
    .kt-menu-link-hover\:\!bg-background.kt-menu-link:hover {
      background-color: var(--background) !important;
    }
    .kt-menu-link:hover .kt-menu-link-hover\:\!bg-background {
      background-color: var(--background) !important;
    }
    .kt-menu-link-hover\:bg-accent\/60.kt-menu-link:hover {
      background-color: var(--accent);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-menu-link-hover\:bg-accent\/60.kt-menu-link:hover {
        background-color: color-mix(in oklab, var(--accent) 60%, transparent);
    }
      }
    .kt-menu-link:hover .kt-menu-link-hover\:bg-accent\/60 {
      background-color: var(--accent);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-menu-link:hover .kt-menu-link-hover\:bg-accent\/60 {
        background-color: color-mix(in oklab, var(--accent) 60%, transparent);
    }
      }
    .kt-menu-link-hover\:bg-background.kt-menu-link:hover {
      background-color: var(--background);
    }
    .kt-menu-link:hover .kt-menu-link-hover\:bg-background {
      background-color: var(--background);
    }
    .kt-menu-link-hover\:bg-secondary.kt-menu-link:hover {
      background-color: var(--secondary);
    }
    .kt-menu-link:hover .kt-menu-link-hover\:bg-secondary {
      background-color: var(--secondary);
    }
    .kt-menu-link-hover\:\!text-primary.kt-menu-link:hover {
      color: var(--primary) !important;
    }
    .kt-menu-link:hover .kt-menu-link-hover\:\!text-primary {
      color: var(--primary) !important;
    }
    .kt-menu-link-hover\:text-foreground.kt-menu-link:hover {
      color: var(--foreground);
    }
    .kt-menu-link:hover .kt-menu-link-hover\:text-foreground {
      color: var(--foreground);
    }
    .kt-menu-link-hover\:text-mono.kt-menu-link:hover {
      color: var(--mono);
    }
    .kt-menu-link:hover .kt-menu-link-hover\:text-mono {
      color: var(--mono);
    }
    .kt-menu-link-hover\:text-primary.kt-menu-link:hover {
      color: var(--primary);
    }
    .kt-menu-link:hover .kt-menu-link-hover\:text-primary {
      color: var(--primary);
    }
      .has-checked\:\[\&_\.checked\]\:flex:has(*:checked) .checked {
        display: flex;
      }
    @media (width >= 64rem) {
      .lg\:\[\&_\.kt-container-fluid\]\:pe-4 .kt-container-fluid {
        padding-inline-end: calc(var(--spacing) * 4);
      }
    }
    .\[\&_\.kt-step-icon\]\:text-muted-foreground .kt-step-icon {
      color: var(--muted-foreground);
    }
    .\[\&_\.kt-step-icon\]\:text-primary .kt-step-icon {
      color: var(--primary);
    }
    .\[\&_i\]\:text-white i {
      color: var(--color-white);
    }
      @media (hover: hover) {
        .hover\:\[\&_i\]\:text-black\/80:hover i {
          color: color-mix(in srgb, #000 80%, transparent);
        }
          @supports (color: color-mix(in lab, red, red)) {
        .hover\:\[\&_i\]\:text-black\/80:hover i {
            color: color-mix(in oklab, var(--color-black) 80%, transparent);
        }
          }
      }
      @media (hover: hover) {
        .hover\:\[\&_i\]\:text-primary:hover i {
          color: var(--primary);
        }
      }
      :is(.open[data-kt-dropdown-initialized] > .kt-dropdown-open\:\[\&_i\]\:text-primary[data-kt-dropdown-toggle]) i {
        color: var(--primary);
      }
      :is(.open[data-kt-dropdown-initialized] > [data-kt-dropdown-toggle] .kt-dropdown-open\:\[\&_i\]\:text-primary) i {
        color: var(--primary);
      }
      :is(.\[\&_border\]\:\[\&_i\]\:text-black\/80 border) i {
        color: color-mix(in srgb, #000 80%, transparent);
      }
        @supports (color: color-mix(in lab, red, red)) {
      :is(.\[\&_border\]\:\[\&_i\]\:text-black\/80 border) i {
          color: color-mix(in oklab, var(--color-black) 80%, transparent);
      }
        }
      .ltr\:\[\&_tr\:nth-of-type\(12\)\>td\:first-child\]\:rounded-bl-xl:where(:dir(ltr),[dir="ltr"],[dir="ltr"] *) tr:nth-of-type(12) > td:first-child {
        border-bottom-left-radius: calc(var(--radius) + 4px);
      }
      .rtl\:\[\&_tr\:nth-of-type\(12\)\>td\:first-child\]\:rounded-br-xl:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) tr:nth-of-type(12) > td:first-child {
        border-bottom-right-radius: calc(var(--radius) + 4px);
      }
      .ltr\:\[\&_tr\:nth-of-type\(12\)\>td\:last-child\]\:rounded-br-xl:where(:dir(ltr),[dir="ltr"],[dir="ltr"] *) tr:nth-of-type(12) > td:last-child {
        border-bottom-right-radius: calc(var(--radius) + 4px);
      }
      .rtl\:\[\&_tr\:nth-of-type\(12\)\>td\:last-child\]\:rounded-bl-xl:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) tr:nth-of-type(12) > td:last-child {
        border-bottom-left-radius: calc(var(--radius) + 4px);
      }
    .\[\&_tr\:nth-of-type\(2\)\>td\]\:border-t tr:nth-of-type(2) > td {
      border-top-style: var(--tw-border-style);
      border-top-width: 1px;
    }
      .ltr\:\[\&_tr\:nth-of-type\(2\)\>td\:first-child\]\:rounded-tl-xl:where(:dir(ltr),[dir="ltr"],[dir="ltr"] *) tr:nth-of-type(2) > td:first-child {
        border-top-left-radius: calc(var(--radius) + 4px);
      }
      .rtl\:\[\&_tr\:nth-of-type\(2\)\>td\:first-child\]\:rounded-tr-xl:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) tr:nth-of-type(2) > td:first-child {
        border-top-right-radius: calc(var(--radius) + 4px);
      }
    .\[\&\.active\]\:bg-primary\/10.active {
      background-color: var(--primary);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .\[\&\.active\]\:bg-primary\/10.active {
        background-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
      }
      .\[\&\.active\]\:\[\&_i\]\:text-primary.active i {
        color: var(--primary);
      }
    .active.\[\.active\&\]\:border-border {
      border-color: var(--border);
    }
    .active.\[\.active\&\]\:border-input {
      border-color: var(--input);
    }
    .active.\[\.active\&\]\:bg-background {
      background-color: var(--background);
    }
      .active.\[\.active\&\]\:\[\&_i\]\:text-primary i {
        color: var(--primary);
      }
}
:root {
  --background: var(--color-white);
  --foreground: var(--color-zinc-950);
  --card: var(--color-white);
  --card-foreground: var(--color-zinc-950);
  --popover: var(--color-white);
  --popover-foreground: var(--color-zinc-950);
  --primary: var(--color-blue-500);
  --primary-foreground: var(--color-white);
  --secondary: var(--color-zinc-100);
  --secondary-foreground: var(--color-zinc-900);
  --muted: var(--color-zinc-100);
  --muted-foreground: var(--color-zinc-500);
  --accent: var(--color-zinc-100);
  --accent-foreground: var(--color-zinc-900);
  --destructive: var(--color-red-600);
  --destructive-foreground: var(--color-white);
  --mono: var(--color-zinc-950);
  --mono-foreground: var(--color-white);
  --border: oklch(94% 0.004 286.32);
  --input: var(--color-zinc-200);
  --ring: var(--color-zinc-400);
  --radius: 0.5rem;
}
.dark {
  --background: var(--color-zinc-950);
  --foreground: var(--color-zinc-50);
  --card: var(--color-zinc-950);
  --card-foreground: var(--color-zinc-50);
  --popover: var(--color-zinc-950);
  --popover-foreground: var(--color-zinc-50);
  --primary: var(--color-blue-600);
  --primary-foreground: var(--color-white);
  --secondary: var(--color-zinc-800);
  --secondary-foreground: var(--color-zinc-50);
  --muted: var(--color-zinc-900);
  --muted-foreground: var(--color-zinc-500);
  --accent: var(--color-zinc-900);
  --accent-foreground: var(--color-zinc-50);
  --destructive: var(--color-red-600);
  --destructive-foreground: var(--color-white);
  --mono: var(--color-zinc-300);
  --mono-foreground: var(--color-black);
  --border: var(--color-zinc-800);
  --input: var(--color-zinc-800);
  --ring: var(--color-zinc-600);
}
@layer components {
  .kt-avatar {
    position: relative;
    display: flex;
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
    flex-shrink: 0;
  }
  .kt-avatar-image {
    overflow: hidden;
    border-radius: calc(infinity * 1px);
  }
    .kt-avatar-image img {
      aspect-ratio: 1 / 1;
      height: 100%;
      width: 100%;
    }
  .kt-avatar-fallback {
    display: flex;
    height: 100%;
    width: 100%;
    align-items: center;
    justify-content: center;
    border-radius: calc(infinity * 1px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    background-color: var(--accent);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }
  .kt-avatar-indicator {
    position: absolute;
    display: flex;
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
    align-items: center;
    justify-content: center;
  }
  .kt-avatar-status {
    display: flex;
    width: calc(var(--spacing) * 2);
    height: calc(var(--spacing) * 2);
    align-items: center;
    border-radius: calc(infinity * 1px);
    border-style: var(--tw-border-style);
    border-width: 2px;
    border-color: var(--background);
  }
    .kt-avatar-status.kt-avatar-status-online {
      background-color: var(--color-green-600);
    }
    .kt-avatar-status.kt-avatar-status-offline {
      background-color: var(--mono);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-avatar-status.kt-avatar-status-offline {
        background-color: color-mix(in oklab, var(--mono) 50%, transparent);
    }
      }
    .kt-avatar-status.kt-avatar-status-busy {
      background-color: var(--color-yellow-600);
    }
    .kt-avatar-status.kt-avatar-status-away {
      background-color: var(--color-blue-600);
    }
}
@layer components {
  .kt-accordion-item {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--border);
  }
    .kt-accordion-item:last-child {
      border-bottom-style: var(--tw-border-style);
      border-bottom-width: 0px;
    }
  .kt-accordion-toggle {
    display: flex;
    width: 100%;
    cursor: pointer;
    align-items: center;
    justify-content: space-between;
    gap: calc(var(--spacing) * 2.5);
    padding-block: calc(var(--spacing) * 4);
    text-align: start;
  }
  .kt-accordion-title {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--mono);
  }
  .kt-accordion-content {
    overflow: hidden;
    transition-property: height;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .kt-accordion-wrapper {
    padding-bottom: calc(var(--spacing) * 4);
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
    color: var(--foreground);
  }
  .kt-accordion-indicator {
    display: inline-flex;
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
    align-items: center;
    color: var(--muted-foreground);
  }
  .kt-accordion-indicator-on {
    display: block;
    width: calc(var(--spacing) * 3.5);
    height: calc(var(--spacing) * 3.5);
    flex-shrink: 0;
  }
    .kt-accordion-indicator-on.active[data-kt-accordion-item] {
      display: none;
    }
    .active[data-kt-accordion-item] > [data-kt-accordion-toggle] .kt-accordion-indicator-on {
      display: none;
    }
    .active[data-kt-accordion-item] > .kt-accordion-indicator-on[data-kt-accordion-toggle] {
      display: none;
    }
  .kt-accordion-indicator-off {
    display: none;
    width: calc(var(--spacing) * 3.5);
    height: calc(var(--spacing) * 3.5);
    flex-shrink: 0;
  }
    .kt-accordion-indicator-off.active[data-kt-accordion-item] {
      display: block;
    }
    .active[data-kt-accordion-item] > [data-kt-accordion-toggle] .kt-accordion-indicator-off {
      display: block;
    }
    .active[data-kt-accordion-item] > .kt-accordion-indicator-off[data-kt-accordion-toggle] {
      display: block;
    }
  .kt-accordion.kt-accordion-outline {
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing) * 3.5);
  }
    .kt-accordion.kt-accordion-outline .kt-accordion-item {
      border-radius: var(--radius);
      border-style: var(--tw-border-style);
      border-width: 1px;
      border-color: var(--border);
    }
    .kt-accordion.kt-accordion-outline .kt-accordion-content {
      border-top-style: var(--tw-border-style);
      border-top-width: 1px;
      border-color: var(--border);
    }
    .kt-accordion.kt-accordion-outline .kt-accordion-toggle {
      padding: calc(var(--spacing) * 4);
    }
    .kt-accordion.kt-accordion-outline .kt-accordion-wrapper {
      padding: calc(var(--spacing) * 4);
    }
}
@layer components {
  .kt-accordion-menu {
    display: flex;
    width: 100%;
    flex-direction: column;
    row-gap: calc(var(--spacing) * 1);
  }
  .kt-accordion-menu-content {
    overflow: hidden;
    padding-inline-start: calc(var(--spacing) * 6);
    transition-property: height;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .kt-accordion-menu-sub {
    width: 100%;
    row-gap: calc(var(--spacing) * 1);
  }
  .kt-accordion-menu-item {
    width: 100%;
  }
    :where(.kt-accordion-menu-item > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));
    }
  .kt-accordion-menu-toggle {
    display: flex;
    width: 100%;
    align-items: center;
    column-gap: calc(var(--spacing) * 2.5);
    border-radius: calc(var(--radius) - 2px);
    padding-inline: calc(var(--spacing) * 2.5);
    padding-block: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--foreground);
  }
      @media (hover: hover) {
    .kt-accordion-menu-toggle:hover {
        background-color: var(--accent);
    }
      }
    .kt-accordion-menu-toggle:disabled {
      pointer-events: none;
    }
    .kt-accordion-menu-toggle:disabled {
      opacity: 50%;
    }
    .kt-accordion-menu-toggle.active[data-kt-accordion-item] {
      background-color: var(--accent);
    }
    .active[data-kt-accordion-item] > [data-kt-accordion-toggle] .kt-accordion-menu-toggle {
      background-color: var(--accent);
    }
    .active[data-kt-accordion-item] > .kt-accordion-menu-toggle[data-kt-accordion-toggle] {
      background-color: var(--accent);
    }
    .kt-accordion-menu-toggle svg {
      width: calc(var(--spacing) * 4);
      height: calc(var(--spacing) * 4);
      flex-shrink: 0;
      color: var(--muted-foreground);
    }
  .kt-accordion-menu-link {
    display: flex;
    width: 100%;
    align-items: center;
    column-gap: calc(var(--spacing) * 2.5);
    border-radius: calc(var(--radius) - 2px);
    padding-inline: calc(var(--spacing) * 2.5);
    padding-block: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--foreground);
  }
      @media (hover: hover) {
    .kt-accordion-menu-link:hover {
        background-color: var(--accent);
    }
      }
    .kt-accordion-menu-link:disabled {
      pointer-events: none;
    }
    .kt-accordion-menu-link:disabled {
      opacity: 50%;
    }
    .kt-accordion-menu-link [data-kt-accordion-initialized] .selected {
      background-color: var(--accent);
    }
    [data-kt-accordion-initialized] .selected .kt-accordion-menu-link {
      background-color: var(--accent);
    }
    [data-kt-accordion-initialized] .kt-accordion-menu-link.selected {
      background-color: var(--accent);
    }
    .kt-accordion-menu-link svg {
      width: calc(var(--spacing) * 4);
      height: calc(var(--spacing) * 4);
      flex-shrink: 0;
      color: var(--muted-foreground);
    }
  .kt-accordion-menu-indicator {
    margin-inline-start: auto;
    width: calc(var(--spacing) * 3.5);
    height: calc(var(--spacing) * 3.5);
    flex-shrink: 0;
    color: var(--muted-foreground);
  }
    .kt-accordion-menu-indicator.active[data-kt-accordion-item] {
      rotate: 180deg;
    }
    .active[data-kt-accordion-item] > [data-kt-accordion-toggle] .kt-accordion-menu-indicator {
      rotate: 180deg;
    }
    .active[data-kt-accordion-item] > .kt-accordion-menu-indicator[data-kt-accordion-toggle] {
      rotate: 180deg;
    }
}
@layer components {
    .active[data-kt-accordion-item]:is([dir='rtl'] .kt-accordion-menu-indicator) {
      rotate: calc(180deg * -1);
    }
    .active[data-kt-accordion-item] > [data-kt-accordion-toggle] :is([dir='rtl'] .kt-accordion-menu-indicator) {
      rotate: calc(180deg * -1);
    }
    .active[data-kt-accordion-item] > [data-kt-accordion-toggle]:is([dir='rtl'] .kt-accordion-menu-indicator) {
      rotate: calc(180deg * -1);
    }
}
@layer components {
  .kt-alert {
    display: flex;
    width: 100%;
    align-items: stretch;
  }
  .kt-alert-title {
    flex-grow: 1;
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
  }
  .kt-alert-toolbar {
    display: flex;
    align-items: baseline;
    gap: calc(var(--spacing) * 2.5);
  }
  .kt-alert-actions {
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 2);
  }
  .kt-alert-description {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }
    .kt-alert-description p {
      margin-bottom: calc(var(--spacing) * 2);
    }
    .kt-alert-description p {
      --tw-leading: var(--leading-relaxed);
      line-height: var(--leading-relaxed);
    }
  .kt-alert-content {
    width: 100%;
    flex-grow: 1;
  }
    :where(.kt-alert-content > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)));
    }
    .kt-alert-content .kt-alert-title {
      --tw-font-weight: var(--font-weight-semibold);
      font-weight: var(--font-weight-semibold);
    }
  .kt-alert-icon {
    flex-shrink: 0;
  }
  .kt-alert-close {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    flex-shrink: 0;
    cursor: pointer;
  }
    .kt-alert-close i {
      font-size: var(--text-xs);
      line-height: var(--tw-leading, var(--text-xs--line-height));
      color: var(--muted-foreground);
    }
    .kt-alert-close  > svg {
      width: calc(var(--spacing) * 4);
      height: calc(var(--spacing) * 4);
      color: var(--muted-foreground);
    }
      :is(.kt-alert-close:focus,.kt-alert-close:hover) i,:is(.kt-alert-close:focus,.kt-alert-close:hover)  > svg {
        color: var(--foreground);
      }
  .kt-alert {
    gap: calc(var(--spacing) * 2.5);
    border-radius: var(--radius);
    padding: calc(var(--spacing) * 3.5);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }
    .kt-alert .kt-alert-icon svg {
      width: calc(var(--spacing) * 5);
      height: calc(var(--spacing) * 5);
    }
    .kt-alert .kt-alert-toolbar {
      padding-top: calc(var(--spacing) * 0.25);
    }
  .kt-alert-sm {
    gap: calc(var(--spacing) * 1.5);
    border-radius: calc(var(--radius) - 2px);
    padding-inline: calc(var(--spacing) * 2.5);
    padding-block: calc(var(--spacing) * 2);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }
    .kt-alert-sm .kt-alert-close {
      width: calc(var(--spacing) * 3.5);
      height: calc(var(--spacing) * 3.5);
    }
      :is(.kt-alert-sm .kt-alert-close)  > svg {
        width: calc(var(--spacing) * 3.5);
        height: calc(var(--spacing) * 3.5);
      }
    .kt-alert-sm .kt-alert-icon svg {
      width: calc(var(--spacing) * 4);
      height: calc(var(--spacing) * 4);
    }
  .kt-alert-lg {
    gap: calc(var(--spacing) * 2.5);
    border-radius: calc(var(--radius) - 2px);
    padding: calc(var(--spacing) * 4);
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
  }
    .kt-alert-lg .kt-alert-icon svg {
      width: calc(var(--spacing) * 6);
      height: calc(var(--spacing) * 6);
    }
    .kt-alert-lg .kt-alert-toolbar {
      padding-top: calc(var(--spacing) * 0.75);
    }
  .kt-alert {
    background-color: var(--muted);
    color: var(--foreground);
  }
  .kt-alert-primary {
    background-color: var(--primary);
    color: var(--primary-foreground);
  }
    .kt-alert-primary .kt-alert-close > svg {
      color: var(--primary-foreground);
    }
  .kt-alert-destructive {
    background-color: var(--destructive);
    color: var(--destructive-foreground);
  }
    .kt-alert-destructive .kt-alert-close > svg {
      color: var(--destructive-foreground);
    }
  .kt-alert-success {
    background-color: var(--color-green-500);
    color: var(--color-white);
  }
    .kt-alert-success .kt-alert-close > svg {
      color: var(--color-white);
    }
  .kt-alert-info {
    background-color: var(--color-violet-600);
    color: var(--color-white);
  }
    .kt-alert-info .kt-alert-close > svg {
      color: var(--color-white);
    }
  .kt-alert-warning {
    background-color: var(--color-yellow-500);
    color: var(--color-white);
  }
    .kt-alert-warning .kt-alert-close > svg {
      color: var(--color-white);
    }
  .kt-alert-mono {
    background-color: var(--mono);
    color: var(--mono-foreground);
  }
    .kt-alert-mono .kt-alert-close > svg {
      color: var(--mono-foreground);
    }
      .kt-alert-mono.kt-alert-primary .kt-alert-icon {
        color: var(--primary);
      }
      .kt-alert-mono.kt-alert-success .kt-alert-icon {
        color: var(--color-green-500);
      }
      .kt-alert-mono.kt-alert-destructive .kt-alert-icon {
        color: var(--destructive);
      }
      .kt-alert-mono.kt-alert-warning .kt-alert-icon {
        color: var(--color-yellow-500);
      }
      .kt-alert-mono.kt-alert-info .kt-alert-icon {
        color: var(--color-violet-600);
      }
    .kt-alert-outline .kt-alert-close {
      width: calc(var(--spacing) * 4);
      height: calc(var(--spacing) * 4);
      flex-shrink: 0;
      cursor: pointer;
    }
      :is(.kt-alert-outline .kt-alert-close)  > svg {
        width: calc(var(--spacing) * 4);
        height: calc(var(--spacing) * 4);
        color: var(--muted-foreground);
      }
        :is(:is(.kt-alert-outline .kt-alert-close):focus,:is(.kt-alert-outline .kt-alert-close):hover)  > svg {
          color: var(--foreground);
        }
  .kt-alert-outline {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    background-color: var(--background);
    color: var(--foreground);
  }
    .kt-alert-outline.kt-alert-primary {
      border-style: var(--tw-border-style);
      border-width: 1px;
      border-color: var(--border);
      background-color: var(--background);
      color: var(--primary);
    }
    .kt-alert-outline.kt-alert-destructive {
      border-style: var(--tw-border-style);
      border-width: 1px;
      border-color: var(--border);
      background-color: var(--background);
      color: var(--destructive);
    }
    .kt-alert-outline.kt-alert-success {
      border-style: var(--tw-border-style);
      border-width: 1px;
      border-color: var(--border);
      background-color: var(--background);
      color: var(--color-green-500);
    }
    .kt-alert-outline.kt-alert-info {
      border-style: var(--tw-border-style);
      border-width: 1px;
      border-color: var(--border);
      background-color: var(--background);
      color: var(--color-violet-600);
    }
    .kt-alert-outline.kt-alert-warning {
      border-style: var(--tw-border-style);
      border-width: 1px;
      border-color: var(--border);
      background-color: var(--background);
      color: var(--color-yellow-500);
    }
    .kt-alert-outline.kt-alert-mono {
      border-style: var(--tw-border-style);
      border-width: 1px;
      border-color: var(--border);
      background-color: var(--background);
      color: var(--mono);
    }
  .kt-alert-light {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    background-color: var(--muted);
    color: var(--foreground);
  }
    .kt-alert-light .kt-alert-icon > svg {
      color: var(--muted-foreground);
    }
    .kt-alert-light .kt-alert-close {
      width: calc(var(--spacing) * 4);
      height: calc(var(--spacing) * 4);
      flex-shrink: 0;
      cursor: pointer;
    }
      :is(.kt-alert-light .kt-alert-close)  > svg {
        width: calc(var(--spacing) * 4);
        height: calc(var(--spacing) * 4);
        color: var(--muted-foreground);
      }
        :is(:is(.kt-alert-light .kt-alert-close):focus,:is(.kt-alert-light .kt-alert-close):hover)  > svg {
          color: var(--foreground);
        }
    .kt-alert-light.kt-alert-primary {
      border-style: var(--tw-border-style);
      border-width: 1px;
      border-color: var(--primary);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-alert-light.kt-alert-primary {
        border-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
      }
    .kt-alert-light.kt-alert-primary {
      background-color: var(--primary);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-alert-light.kt-alert-primary {
        background-color: color-mix(in oklab, var(--primary) 5%, transparent);
    }
      }
    .kt-alert-light.kt-alert-primary {
      color: var(--foreground);
    }
      .kt-alert-light.kt-alert-primary .kt-alert-icon > svg {
        color: var(--primary);
      }
    .kt-alert-light.kt-alert-destructive {
      border-style: var(--tw-border-style);
      border-width: 1px;
      border-color: var(--destructive);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-alert-light.kt-alert-destructive {
        border-color: color-mix(in oklab, var(--destructive) 10%, transparent);
    }
      }
    .kt-alert-light.kt-alert-destructive {
      background-color: var(--destructive);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-alert-light.kt-alert-destructive {
        background-color: color-mix(in oklab, var(--destructive) 5%, transparent);
    }
      }
    .kt-alert-light.kt-alert-destructive {
      color: var(--foreground);
    }
      .kt-alert-light.kt-alert-destructive .kt-alert-icon > svg {
        color: var(--destructive);
      }
    .kt-alert-light.kt-alert-success {
      border-style: var(--tw-border-style);
      border-width: 1px;
      border-color: var(--color-green-200);
      background-color: var(--color-green-50);
      color: var(--foreground);
    }
      .kt-alert-light.kt-alert-success:is(.dark *) {
        border-color: color-mix(in srgb, oklch(26.6% 0.065 152.934) 50%, transparent);
      }
        @supports (color: color-mix(in lab, red, red)) {
      .kt-alert-light.kt-alert-success:is(.dark *) {
          border-color: color-mix(in oklab, var(--color-green-950) 50%, transparent);
      }
        }
      .kt-alert-light.kt-alert-success:is(.dark *) {
        background-color: color-mix(in srgb, oklch(26.6% 0.065 152.934) 30%, transparent);
      }
        @supports (color: color-mix(in lab, red, red)) {
      .kt-alert-light.kt-alert-success:is(.dark *) {
          background-color: color-mix(in oklab, var(--color-green-950) 30%, transparent);
      }
        }
      .kt-alert-light.kt-alert-success .kt-alert-icon > svg {
        color: var(--color-green-500);
      }
    .kt-alert-light.kt-alert-info {
      border-style: var(--tw-border-style);
      border-width: 1px;
      border-color: var(--color-violet-200);
      background-color: var(--color-violet-50);
      color: var(--foreground);
    }
      .kt-alert-light.kt-alert-info:is(.dark *) {
        border-color: color-mix(in srgb, oklch(28.3% 0.141 291.089) 50%, transparent);
      }
        @supports (color: color-mix(in lab, red, red)) {
      .kt-alert-light.kt-alert-info:is(.dark *) {
          border-color: color-mix(in oklab, var(--color-violet-950) 50%, transparent);
      }
        }
      .kt-alert-light.kt-alert-info:is(.dark *) {
        background-color: color-mix(in srgb, oklch(28.3% 0.141 291.089) 30%, transparent);
      }
        @supports (color: color-mix(in lab, red, red)) {
      .kt-alert-light.kt-alert-info:is(.dark *) {
          background-color: color-mix(in oklab, var(--color-violet-950) 30%, transparent);
      }
        }
      .kt-alert-light.kt-alert-info .kt-alert-icon > svg {
        color: var(--color-violet-500);
      }
    .kt-alert-light.kt-alert-warning {
      border-style: var(--tw-border-style);
      border-width: 1px;
      border-color: var(--color-yellow-200);
      background-color: var(--color-yellow-50);
      color: var(--foreground);
    }
      .kt-alert-light.kt-alert-warning:is(.dark *) {
        border-color: color-mix(in srgb, oklch(28.6% 0.066 53.813) 50%, transparent);
      }
        @supports (color: color-mix(in lab, red, red)) {
      .kt-alert-light.kt-alert-warning:is(.dark *) {
          border-color: color-mix(in oklab, var(--color-yellow-950) 50%, transparent);
      }
        }
      .kt-alert-light.kt-alert-warning:is(.dark *) {
        background-color: color-mix(in srgb, oklch(28.6% 0.066 53.813) 30%, transparent);
      }
        @supports (color: color-mix(in lab, red, red)) {
      .kt-alert-light.kt-alert-warning:is(.dark *) {
          background-color: color-mix(in oklab, var(--color-yellow-950) 30%, transparent);
      }
        }
      .kt-alert-light.kt-alert-warning .kt-alert-icon > svg {
        color: var(--color-yellow-500);
      }
}
@layer components {
    :where(.kt-form > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));
    }
  .kt-form-item {
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing) * 2.5);
  }
    :where(.kt-form-control > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 2.5) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 2.5) * calc(1 - var(--tw-space-y-reverse)));
    }
  .kt-form-control-inline {
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 2.5);
  }
    :where(.kt-form-control-inline > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 0) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 0) * calc(1 - var(--tw-space-y-reverse)));
    }
  .kt-form-label {
    display: flex;
    width: 100%;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-leading: 1;
    line-height: 1;
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--foreground);
  }
    .kt-form-label:is(:where(.peer):disabled ~ *) {
      cursor: not-allowed;
    }
    .kt-form-label:is(:where(.peer):disabled ~ *) {
      opacity: 50%;
    }
    .kt-switch:disabled + .kt-form-label,.kt-checkbox:disabled + .kt-form-label,.kt-radio:disabled + .kt-form-label {
      cursor: not-allowed;
      opacity: 50%;
    }
  .kt-form-description {
    margin-top: calc(var(--spacing) * -1);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
    color: var(--secondary-foreground);
  }
  .kt-form-message {
    margin-top: calc(var(--spacing) * -1);
    display: none;
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
    color: var(--destructive);
  }
  .kt-form-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: calc(var(--spacing) * 2.5);
  }
    .kt-form-item:has([aria-invalid='true']) .kt-form-message {
      display: block;
    }
    .kt-form-item:has([aria-invalid='true']) .kt-form-description {
      display: none;
    }
}
@layer components {
  .kt-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: var(--secondary);
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    white-space: nowrap;
    color: var(--accent-foreground);
  }
    .kt-badge:focus {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    .kt-badge:focus {
      --tw-ring-color: var(--ring);
    }
    .kt-badge:focus {
      --tw-ring-offset-width: 2px;
      --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    }
    .kt-badge:focus {
      --tw-outline-style: none;
      outline-style: none;
    }
      @media (forced-colors: active) {
    .kt-badge:focus {
        outline: 2px solid transparent;
        outline-offset: 2px;
    }
      }
    .kt-badge svg {
      margin-inline-start: -1px;
    }
    .kt-badge svg {
      flex-shrink: 0;
    }
  .kt-badge-primary {
    background-color: var(--primary);
    color: var(--primary-foreground);
  }
  .kt-badge-secondary {
    background-color: var(--secondary);
    color: var(--accent-foreground);
  }
  .kt-badge-success {
    background-color: var(--color-green-500);
    color: var(--color-white);
  }
  .kt-badge-warning {
    background-color: var(--color-yellow-400);
    color: var(--color-white);
  }
  .kt-badge-info {
    background-color: var(--color-violet-500);
    color: var(--color-white);
  }
  .kt-badge-mono {
    background-color: var(--mono);
    color: var(--mono-foreground);
  }
  .kt-badge-destructive {
    background-color: var(--destructive);
    color: var(--destructive-foreground);
  }
  .kt-badge-stroke {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    background-color: var(--background);
    color: var(--secondary-foreground);
  }
  .kt-badge-disabled {
    pointer-events: none;
    opacity: 50%;
  }
  .kt-badge-lg {
    height: calc(var(--spacing) * 7);
    min-width: calc(var(--spacing) * 7);
    gap: calc(var(--spacing) * 1.5);
    border-radius: calc(var(--radius) - 2px);
    padding-inline: 0.5rem;
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }
    .kt-badge-lg svg {
      width: calc(var(--spacing) * 3.5);
      height: calc(var(--spacing) * 3.5);
    }
  .kt-badge {
    height: calc(var(--spacing) * 6);
    min-width: calc(var(--spacing) * 6);
    gap: calc(var(--spacing) * 1.5);
    border-radius: calc(var(--radius) - 2px);
    padding-inline: 0.45rem;
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }
    .kt-badge svg {
      width: calc(var(--spacing) * 3.5);
      height: calc(var(--spacing) * 3.5);
    }
  .kt-badge-sm {
    height: calc(var(--spacing) * 5);
    min-width: calc(var(--spacing) * 5);
    gap: calc(var(--spacing) * 1);
    border-radius: calc(var(--radius) - 4px);
    padding-inline: 0.325rem;
    font-size: 0.6875rem;
    --tw-leading: 0.75rem;
    line-height: 0.75rem;
  }
    .kt-badge-sm svg {
      width: calc(var(--spacing) * 3);
      height: calc(var(--spacing) * 3);
    }
  .kt-badge-xs {
    height: calc(var(--spacing) * 4);
    min-width: calc(var(--spacing) * 4);
    gap: calc(var(--spacing) * 1);
    border-radius: calc(var(--radius) - 4px);
    padding-inline: 0.25rem;
    font-size: 0.625rem;
    --tw-leading: 0.5rem;
    line-height: 0.5rem;
  }
    .kt-badge-xs svg {
      width: calc(var(--spacing) * 3);
      height: calc(var(--spacing) * 3);
    }
  .kt-badge-outline {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    background-color: var(--muted);
    color: var(--secondary-foreground);
  }
    .kt-badge-outline.kt-badge-primary {
      border-style: var(--tw-border-style);
      border-width: 1px;
      border-color: var(--color-blue-100);
      background-color: var(--color-blue-50);
      color: var(--color-blue-700);
    }
      .kt-badge-outline.kt-badge-primary:is(.dark *) {
        border-color: var(--color-blue-950);
      }
      .kt-badge-outline.kt-badge-primary:is(.dark *) {
        background-color: color-mix(in srgb, oklch(28.2% 0.091 267.935) 50%, transparent);
      }
        @supports (color: color-mix(in lab, red, red)) {
      .kt-badge-outline.kt-badge-primary:is(.dark *) {
          background-color: color-mix(in oklab, var(--color-blue-950) 50%, transparent);
      }
        }
      .kt-badge-outline.kt-badge-primary:is(.dark *) {
        color: var(--color-blue-600);
      }
    .kt-badge-outline.kt-badge-secondary {
      border-color: var(--border);
      background-color: var(--secondary);
      color: var(--foreground);
    }
      .kt-badge-outline.kt-badge-secondary:is(.dark *) {
        background-color: var(--secondary);
      }
        @supports (color: color-mix(in lab, red, red)) {
      .kt-badge-outline.kt-badge-secondary:is(.dark *) {
          background-color: color-mix(in oklab, var(--secondary) 50%, transparent);
      }
        }
    .kt-badge-outline.kt-badge-success {
      border-style: var(--tw-border-style);
      border-width: 1px;
      border-color: var(--color-green-200);
      background-color: var(--color-green-50);
      color: var(--color-green-700);
    }
      .kt-badge-outline.kt-badge-success:is(.dark *) {
        border-color: var(--color-green-950);
      }
      .kt-badge-outline.kt-badge-success:is(.dark *) {
        background-color: color-mix(in srgb, oklch(26.6% 0.065 152.934) 50%, transparent);
      }
        @supports (color: color-mix(in lab, red, red)) {
      .kt-badge-outline.kt-badge-success:is(.dark *) {
          background-color: color-mix(in oklab, var(--color-green-950) 50%, transparent);
      }
        }
      .kt-badge-outline.kt-badge-success:is(.dark *) {
        color: var(--color-green-600);
      }
    .kt-badge-outline.kt-badge-warning.kt-badge-outline {
      border-style: var(--tw-border-style);
      border-width: 1px;
      border-color: var(--color-yellow-100);
      background-color: var(--color-yellow-50);
      color: var(--color-yellow-700);
    }
      .kt-badge-outline.kt-badge-warning.kt-badge-outline:is(.dark *) {
        border-color: var(--color-yellow-950);
      }
      .kt-badge-outline.kt-badge-warning.kt-badge-outline:is(.dark *) {
        background-color: color-mix(in srgb, oklch(28.6% 0.066 53.813) 50%, transparent);
      }
        @supports (color: color-mix(in lab, red, red)) {
      .kt-badge-outline.kt-badge-warning.kt-badge-outline:is(.dark *) {
          background-color: color-mix(in oklab, var(--color-yellow-950) 50%, transparent);
      }
        }
      .kt-badge-outline.kt-badge-warning.kt-badge-outline:is(.dark *) {
        color: var(--color-yellow-600);
      }
    .kt-badge-outline.kt-badge-info.kt-badge-outline {
      border-style: var(--tw-border-style);
      border-width: 1px;
      border-color: var(--color-violet-100);
      background-color: var(--color-violet-50);
      color: var(--color-violet-700);
    }
      .kt-badge-outline.kt-badge-info.kt-badge-outline:is(.dark *) {
        border-color: var(--color-violet-950);
      }
      .kt-badge-outline.kt-badge-info.kt-badge-outline:is(.dark *) {
        background-color: color-mix(in srgb, oklch(28.3% 0.141 291.089) 50%, transparent);
      }
        @supports (color: color-mix(in lab, red, red)) {
      .kt-badge-outline.kt-badge-info.kt-badge-outline:is(.dark *) {
          background-color: color-mix(in oklab, var(--color-violet-950) 50%, transparent);
      }
        }
      .kt-badge-outline.kt-badge-info.kt-badge-outline:is(.dark *) {
        color: var(--color-violet-600);
      }
    .kt-badge-outline.kt-badge-mono.kt-badge-outline {
      border-color: var(--mono);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-badge-outline.kt-badge-mono.kt-badge-outline {
        border-color: color-mix(in oklab, var(--mono) 10%, transparent);
    }
      }
    .kt-badge-outline.kt-badge-mono.kt-badge-outline {
      background-color: var(--mono);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-badge-outline.kt-badge-mono.kt-badge-outline {
        background-color: color-mix(in oklab, var(--mono) 10%, transparent);
    }
      }
    .kt-badge-outline.kt-badge-mono.kt-badge-outline {
      color: var(--mono);
    }
    .kt-badge-outline.kt-badge-destructive.kt-badge-outline {
      border-style: var(--tw-border-style);
      border-width: 1px;
      border-color: var(--color-red-100);
      background-color: var(--color-red-50);
      color: var(--color-red-700);
    }
      .kt-badge-outline.kt-badge-destructive.kt-badge-outline:is(.dark *) {
        border-color: var(--color-red-950);
      }
      .kt-badge-outline.kt-badge-destructive.kt-badge-outline:is(.dark *) {
        background-color: color-mix(in srgb, oklch(25.8% 0.092 26.042) 50%, transparent);
      }
        @supports (color: color-mix(in lab, red, red)) {
      .kt-badge-outline.kt-badge-destructive.kt-badge-outline:is(.dark *) {
          background-color: color-mix(in oklab, var(--color-red-950) 50%, transparent);
      }
        }
      .kt-badge-outline.kt-badge-destructive.kt-badge-outline:is(.dark *) {
        color: var(--color-red-600);
      }
    .kt-badge-light.kt-badge-primary {
      background-color: var(--color-blue-100);
      color: var(--color-blue-800);
    }
      .kt-badge-light.kt-badge-primary:is(.dark *) {
        background-color: color-mix(in srgb, oklch(28.2% 0.091 267.935) 50%, transparent);
      }
        @supports (color: color-mix(in lab, red, red)) {
      .kt-badge-light.kt-badge-primary:is(.dark *) {
          background-color: color-mix(in oklab, var(--color-blue-950) 50%, transparent);
      }
        }
      .kt-badge-light.kt-badge-primary:is(.dark *) {
        color: var(--color-blue-600);
      }
    .kt-badge-light.kt-badge-secondary {
      background-color: var(--secondary);
      color: var(--secondary-foreground);
    }
      .kt-badge-light.kt-badge-secondary:is(.dark *) {
        background-color: var(--secondary);
      }
        @supports (color: color-mix(in lab, red, red)) {
      .kt-badge-light.kt-badge-secondary:is(.dark *) {
          background-color: color-mix(in oklab, var(--secondary) 50%, transparent);
      }
        }
    .kt-badge-light.kt-badge-success {
      background-color: var(--color-green-100);
      color: var(--color-green-800);
    }
      .kt-badge-light.kt-badge-success:is(.dark *) {
        background-color: color-mix(in srgb, oklch(26.6% 0.065 152.934) 50%, transparent);
      }
        @supports (color: color-mix(in lab, red, red)) {
      .kt-badge-light.kt-badge-success:is(.dark *) {
          background-color: color-mix(in oklab, var(--color-green-950) 50%, transparent);
      }
        }
      .kt-badge-light.kt-badge-success:is(.dark *) {
        color: var(--color-green-600);
      }
    .kt-badge-light.kt-badge-warning {
      background-color: var(--color-yellow-100);
      color: var(--color-yellow-800);
    }
      .kt-badge-light.kt-badge-warning:is(.dark *) {
        background-color: color-mix(in srgb, oklch(28.6% 0.066 53.813) 50%, transparent);
      }
        @supports (color: color-mix(in lab, red, red)) {
      .kt-badge-light.kt-badge-warning:is(.dark *) {
          background-color: color-mix(in oklab, var(--color-yellow-950) 50%, transparent);
      }
        }
      .kt-badge-light.kt-badge-warning:is(.dark *) {
        color: var(--color-yellow-600);
      }
    .kt-badge-light.kt-badge-info {
      background-color: var(--color-violet-100);
      color: var(--color-violet-800);
    }
      .kt-badge-light.kt-badge-info:is(.dark *) {
        background-color: color-mix(in srgb, oklch(28.3% 0.141 291.089) 50%, transparent);
      }
        @supports (color: color-mix(in lab, red, red)) {
      .kt-badge-light.kt-badge-info:is(.dark *) {
          background-color: color-mix(in oklab, var(--color-violet-950) 50%, transparent);
      }
        }
      .kt-badge-light.kt-badge-info:is(.dark *) {
        color: var(--color-violet-600);
      }
    .kt-badge-light.kt-badge-mono {
      background-color: var(--mono);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-badge-light.kt-badge-mono {
        background-color: color-mix(in oklab, var(--mono) 10%, transparent);
    }
      }
    .kt-badge-light.kt-badge-mono {
      color: var(--mono);
    }
    .kt-badge-light.kt-badge-destructive {
      background-color: var(--color-red-100);
      color: var(--color-red-800);
    }
      .kt-badge-light.kt-badge-destructive:is(.dark *) {
        background-color: color-mix(in srgb, oklch(25.8% 0.092 26.042) 50%, transparent);
      }
        @supports (color: color-mix(in lab, red, red)) {
      .kt-badge-light.kt-badge-destructive:is(.dark *) {
          background-color: color-mix(in oklab, var(--color-red-950) 50%, transparent);
      }
        }
      .kt-badge-light.kt-badge-destructive:is(.dark *) {
        color: var(--color-red-600);
      }
  .kt-badge-ghost {
    background-color: transparent;
    padding-inline: calc(var(--spacing) * 0);
  }
    .kt-badge-ghost.kt-badge-primary {
      color: var(--primary);
    }
    .kt-badge-ghost.kt-badge-secondary {
      color: var(--secondary-foreground);
    }
    .kt-badge-ghost.kt-badge-destructive {
      color: var(--destructive);
    }
    .kt-badge-ghost.kt-badge-success {
      color: var(--color-green-500);
    }
    .kt-badge-ghost.kt-badge-warning {
      color: var(--color-yellow-500);
    }
    .kt-badge-ghost.kt-badge-info {
      color: var(--color-violet-500);
    }
    .kt-badge-ghost.kt-badge-mono {
      color: var(--mono);
    }
  .kt-badge-btn {
    margin-inline-end: calc(var(--spacing) * -0.5);
    display: inline-flex;
    width: calc(var(--spacing) * 3.5);
    height: calc(var(--spacing) * 3.5);
    cursor: pointer;
    align-items: center;
    justify-content: center;
    border-radius: calc(var(--radius) - 2px);
    padding: calc(var(--spacing) * 0);
    --tw-leading: 1;
    line-height: 1;
  }
    .kt-badge-btn i {
      font-size: var(--text-xs);
      line-height: var(--tw-leading, var(--text-xs--line-height));
      opacity: 70%;
      transition-property: opacity;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
      transition-duration: var(--tw-duration, var(--default-transition-duration));
    }
    .kt-badge-btn  > svg {
      width: calc(var(--spacing) * 3.5);
      height: calc(var(--spacing) * 3.5);
      opacity: 70%;
      transition-property: opacity;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
      transition-duration: var(--tw-duration, var(--default-transition-duration));
    }
      :is(.kt-badge-btn:focus,.kt-badge-btn:hover) i,:is(.kt-badge-btn:focus,.kt-badge-btn:hover)  > svg {
        opacity: 100%;
      }
  .kt-badge-dot {
    width: calc(var(--spacing) * 1.5);
    height: calc(var(--spacing) * 1.5);
    border-radius: calc(infinity * 1px);
    background-color: currentcolor;
    opacity: 75%;
  }
}
@layer components {
  .kt-link {
    display: inline-flex;
    cursor: pointer;
    align-items: center;
    border-radius: calc(var(--radius) - 2px);
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
    .kt-link:focus {
      --tw-outline-style: none;
      outline-style: none;
    }
    .kt-link:focus-visible {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    .kt-link:focus-visible {
      --tw-ring-color: var(--color-neutral-200);
    }
    .kt-link:focus-visible {
      --tw-ring-offset-width: 2px;
      --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    }
      .kt-link:is(.dark *):focus-visible {
        --tw-ring-color: var(--color-neutral-700);
      }
  .kt-link {
    color: var(--primary);
  }
  .kt-link-inverse {
    color: var(--background);
  }
  .kt-link-mono {
    color: var(--mono);
  }
  .kt-link {
    gap: calc(var(--spacing) * 1);
    font-size: 0.8125rem;
    --tw-leading: var(--text-sm--line-height);
    line-height: var(--text-sm--line-height);
  }
    .kt-link svg {
      width: calc(var(--spacing) * 4);
      height: calc(var(--spacing) * 4);
    }
    .kt-link i {
      font-size: var(--text-base);
      line-height: var(--tw-leading, var(--text-base--line-height));
    }
  .kt-link-sm {
    gap: calc(var(--spacing) * 1);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }
    .kt-link-sm svg {
      width: calc(var(--spacing) * 3.5);
      height: calc(var(--spacing) * 3.5);
    }
    .kt-link-sm i {
      font-size: var(--text-sm);
      line-height: var(--tw-leading, var(--text-sm--line-height));
    }
  .kt-link-lg {
    gap: calc(var(--spacing) * 1.5);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }
    .kt-link-lg svg {
      width: calc(var(--spacing) * 4);
      height: calc(var(--spacing) * 4);
    }
    .kt-link-lg i {
      font-size: var(--text-base);
      line-height: var(--tw-leading, var(--text-base--line-height));
    }
  .kt-link-underline {
    margin-top: calc(var(--spacing) * -0.5);
    text-decoration-style: solid;
  }
      @media (hover: hover) {
    .kt-link-underline:hover {
        text-decoration-line: underline;
    }
      }
      @media (hover: hover) {
    .kt-link-underline:hover {
        text-underline-offset: 4px;
    }
      }
  .kt-link-underlined {
    margin-top: calc(var(--spacing) * -0.5);
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-underline-offset: 4px;
  }
  .kt-link-dashed {
    text-decoration-style: dashed;
    text-decoration-thickness: 1px;
  }
  .kt-link-disabled {
    pointer-events: none;
    opacity: 50%;
  }
}
@layer components {
  .kt-btn {
    display: inline-flex;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    white-space: nowrap;
    --tw-ring-offset-color: var(--background);
    transition-property: color,box-shadow;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
    .kt-btn:focus-visible {
      --tw-outline-style: none;
      outline-style: none;
    }
      @media (forced-colors: active) {
    .kt-btn:focus-visible {
        outline: 2px solid transparent;
        outline-offset: 2px;
    }
      }
    .kt-btn:disabled {
      pointer-events: none;
    }
    .kt-btn:disabled {
      opacity: 50%;
    }
    .kt-btn:focus-visible {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    .kt-btn:focus-visible {
      --tw-ring-color: var(--ring);
    }
    .kt-btn:focus-visible {
      --tw-ring-offset-width: 2px;
      --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    }
  .kt-btn {
    flex-shrink: 0;
    --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-shadow-color: rgba(0,0,0,0.05);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .kt-btn {
      --tw-shadow-color: color-mix(in oklab, rgba(0,0,0,0.05) var(--tw-shadow-alpha), transparent);
  }
    }
    .kt-btn svg {
      flex-shrink: 0;
    }
  .kt-btn {
    background-color: var(--primary);
    color: var(--primary-foreground);
  }
      @media (hover: hover) {
    .kt-btn:hover {
        background-color: var(--primary);
    }
        @supports (color: color-mix(in lab, red, red)) {
    .kt-btn:hover {
          background-color: color-mix(in oklab, var(--primary) 90%, transparent);
    }
        }
      }
    .kt-btn.active {
      background-color: var(--primary);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-btn.active {
        background-color: color-mix(in oklab, var(--primary) 90%, transparent);
    }
      }
  .kt-btn-mono {
    background-color: var(--mono);
    color: var(--mono-foreground);
  }
      @media (hover: hover) {
    .kt-btn-mono:hover {
        background-color: var(--mono);
    }
        @supports (color: color-mix(in lab, red, red)) {
    .kt-btn-mono:hover {
          background-color: color-mix(in oklab, var(--mono) 90%, transparent);
    }
        }
      }
    .kt-btn-mono.active {
      background-color: var(--mono);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-btn-mono.active {
        background-color: color-mix(in oklab, var(--mono) 90%, transparent);
    }
      }
  .kt-btn-destructive {
    background-color: var(--destructive);
    color: var(--destructive-foreground);
  }
      @media (hover: hover) {
    .kt-btn-destructive:hover {
        background-color: var(--destructive);
    }
        @supports (color: color-mix(in lab, red, red)) {
    .kt-btn-destructive:hover {
          background-color: color-mix(in oklab, var(--destructive) 90%, transparent);
    }
        }
      }
    .kt-btn-destructive.active {
      background-color: var(--destructive);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-btn-destructive.active {
        background-color: color-mix(in oklab, var(--destructive) 90%, transparent);
    }
      }
  .kt-btn-secondary {
    background-color: var(--secondary);
    color: var(--secondary-foreground);
  }
      @media (hover: hover) {
    .kt-btn-secondary:hover {
        background-color: var(--secondary);
    }
      }
      @media (hover: hover) {
    .kt-btn-secondary:hover {
        color: var(--foreground);
    }
      }
    .kt-btn-secondary.active {
      background-color: var(--secondary);
    }
    .kt-btn-secondary.active {
      color: var(--foreground);
    }
    .kt-btn-secondary i {
      color: var(--muted-foreground);
    }
    .kt-btn-secondary svg {
      color: var(--muted-foreground);
    }
      :is(.kt-btn-secondary:hover,.kt-btn-secondary.active) i {
        color: var(--muted-foreground);
      }
      :is(.kt-btn-secondary:hover,.kt-btn-secondary.active) svg {
        color: var(--muted-foreground);
      }
  .kt-btn-outline {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--input);
    background-color: var(--background);
    color: var(--secondary-foreground);
  }
      @media (hover: hover) {
    .kt-btn-outline:hover {
        background-color: var(--accent);
    }
      }
      @media (hover: hover) {
    .kt-btn-outline:hover {
        color: var(--accent-foreground);
    }
      }
    .kt-btn-outline.active {
      background-color: var(--accent);
    }
    .kt-btn-outline.active {
      color: var(--accent-foreground);
    }
    .kt-btn-outline i {
      color: var(--muted-foreground);
    }
    .kt-btn-outline svg {
      color: var(--muted-foreground);
    }
      :is(.kt-btn-outline:hover,.kt-btn-outline.active) i {
        color: var(--secondary-foreground);
      }
      :is(.kt-btn-outline:hover,.kt-btn-outline.active) svg {
        color: var(--secondary-foreground);
      }
    .kt-btn-outline.kt-btn-primary {
      border-color: var(--primary);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-btn-outline.kt-btn-primary {
        border-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
      }
    .kt-btn-outline.kt-btn-primary {
      background-color: var(--primary);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-btn-outline.kt-btn-primary {
        background-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
      }
    .kt-btn-outline.kt-btn-primary {
      color: var(--primary);
    }
        @media (hover: hover) {
      .kt-btn-outline.kt-btn-primary:hover {
          background-color: var(--primary);
      }
        }
        @media (hover: hover) {
      .kt-btn-outline.kt-btn-primary:hover {
          color: var(--primary-foreground);
      }
        }
      .kt-btn-outline.kt-btn-primary.active {
        border-color: var(--primary);
      }
      .kt-btn-outline.kt-btn-primary.active {
        background-color: var(--primary);
      }
      .kt-btn-outline.kt-btn-primary.active {
        color: var(--primary-foreground);
      }
      .kt-btn-outline.kt-btn-primary i {
        color: var(--primary);
      }
      .kt-btn-outline.kt-btn-primary svg {
        color: var(--primary);
      }
        :is(.kt-btn-outline.kt-btn-primary:hover,.kt-btn-outline.kt-btn-primary.active) i {
          color: var(--primary-foreground);
        }
        :is(.kt-btn-outline.kt-btn-primary:hover,.kt-btn-outline.kt-btn-primary.active) svg {
          color: var(--primary-foreground);
        }
    .kt-btn-outline.kt-btn-destructive {
      border-color: var(--destructive);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-btn-outline.kt-btn-destructive {
        border-color: color-mix(in oklab, var(--destructive) 10%, transparent);
    }
      }
    .kt-btn-outline.kt-btn-destructive {
      background-color: var(--destructive);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-btn-outline.kt-btn-destructive {
        background-color: color-mix(in oklab, var(--destructive) 10%, transparent);
    }
      }
    .kt-btn-outline.kt-btn-destructive {
      color: var(--destructive);
    }
        @media (hover: hover) {
      .kt-btn-outline.kt-btn-destructive:hover {
          background-color: var(--destructive);
      }
        }
        @media (hover: hover) {
      .kt-btn-outline.kt-btn-destructive:hover {
          color: var(--destructive-foreground);
      }
        }
      .kt-btn-outline.kt-btn-destructive.active {
        border-color: var(--destructive);
      }
      .kt-btn-outline.kt-btn-destructive.active {
        background-color: var(--destructive);
      }
      .kt-btn-outline.kt-btn-destructive.active {
        color: var(--destructive-foreground);
      }
      .kt-btn-outline.kt-btn-destructive i {
        color: var(--destructive);
      }
      .kt-btn-outline.kt-btn-destructive svg {
        color: var(--destructive);
      }
        :is(.kt-btn-outline.kt-btn-destructive:hover,.kt-btn-outline.kt-btn-destructive.active) i {
          color: var(--destructive-foreground);
        }
        :is(.kt-btn-outline.kt-btn-destructive:hover,.kt-btn-outline.kt-btn-destructive.active) svg {
          color: var(--destructive-foreground);
        }
  .kt-btn-ghost {
    background-color: transparent;
    color: var(--accent-foreground);
    --tw-shadow: 0 0 #0000;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
      @media (hover: hover) {
    .kt-btn-ghost:hover {
        background-color: var(--accent);
    }
      }
      @media (hover: hover) {
    .kt-btn-ghost:hover {
        color: var(--accent-foreground);
    }
      }
    .kt-btn-ghost.active {
      background-color: var(--accent);
    }
    .kt-btn-ghost.active {
      color: var(--accent-foreground);
    }
      .kt-btn-ghost:not(.kt-btn-primary):not(.kt-btn-destructive) i {
        color: var(--muted-foreground);
      }
      .kt-btn-ghost:not(.kt-btn-primary):not(.kt-btn-destructive) svg {
        color: var(--muted-foreground);
      }
        :is(.kt-btn-ghost:not(.kt-btn-primary):not(.kt-btn-destructive):hover,.kt-btn-ghost.active:not(.kt-btn-primary):not(.kt-btn-destructive)) i {
          color: var(--secondary-foreground);
        }
        :is(.kt-btn-ghost:not(.kt-btn-primary):not(.kt-btn-destructive):hover,.kt-btn-ghost.active:not(.kt-btn-primary):not(.kt-btn-destructive)) svg {
          color: var(--secondary-foreground);
        }
    .kt-btn-ghost.kt-btn-primary {
      color: var(--primary);
    }
        @media (hover: hover) {
      .kt-btn-ghost.kt-btn-primary:hover {
          background-color: var(--primary);
      }
        }
        @media (hover: hover) {
      .kt-btn-ghost.kt-btn-primary:hover {
          color: var(--primary-foreground);
      }
        }
      .kt-btn-ghost.kt-btn-primary.active {
        background-color: var(--primary);
      }
      .kt-btn-ghost.kt-btn-primary.active {
        color: var(--primary-foreground);
      }
    .kt-btn-ghost.kt-btn-destructive {
      color: var(--destructive);
    }
        @media (hover: hover) {
      .kt-btn-ghost.kt-btn-destructive:hover {
          background-color: var(--destructive);
      }
        }
        @media (hover: hover) {
      .kt-btn-ghost.kt-btn-destructive:hover {
          color: var(--destructive-foreground);
      }
        }
      .kt-btn-ghost.kt-btn-destructive.active {
        background-color: var(--destructive);
      }
      .kt-btn-ghost.kt-btn-destructive.active {
        color: var(--destructive-foreground);
      }
  .kt-btn-dim {
    background-color: transparent;
    color: var(--muted-foreground);
    --tw-shadow: 0 0 #0000;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
      @media (hover: hover) {
    .kt-btn-dim:hover {
        background-color: transparent;
    }
      }
      @media (hover: hover) {
    .kt-btn-dim:hover {
        color: var(--foreground);
    }
      }
    .kt-btn-dim.active {
      background-color: transparent;
    }
    .kt-btn-dim.active {
      color: var(--foreground);
    }
    .kt-btn-dim i {
      color: var(--muted-foreground);
    }
    .kt-btn-dim svg {
      color: var(--muted-foreground);
    }
      :is(.kt-btn-dim:hover,.kt-btn-dim.active) i {
        color: var(--secondary-foreground);
      }
      :is(.kt-btn-dim:hover,.kt-btn-dim.active) svg {
        color: var(--secondary-foreground);
      }
  .kt-btn {
    height: calc(var(--spacing) * 8.5);
    gap: calc(var(--spacing) * 1.5);
    border-radius: calc(var(--radius) - 2px);
    padding-inline: calc(var(--spacing) * 3);
    font-size: 0.8125rem;
    --tw-leading: var(--text-sm--line-height);
    line-height: var(--text-sm--line-height);
  }
    .kt-btn svg {
      width: calc(var(--spacing) * 4);
      height: calc(var(--spacing) * 4);
    }
    .kt-btn i {
      font-size: var(--text-base);
      line-height: var(--tw-leading, var(--text-base--line-height));
    }
    .kt-btn.kt-btn-icon {
      width: calc(var(--spacing) * 8.5);
      height: calc(var(--spacing) * 8.5);
      padding: calc(var(--spacing) * 0);
    }
  .kt-btn-lg {
    height: calc(var(--spacing) * 10);
    gap: calc(var(--spacing) * 1.5);
    border-radius: calc(var(--radius) - 2px);
    padding-inline: calc(var(--spacing) * 4);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }
    .kt-btn-lg svg {
      width: calc(var(--spacing) * 4);
      height: calc(var(--spacing) * 4);
    }
    .kt-btn-lg i {
      font-size: var(--text-base);
      line-height: var(--tw-leading, var(--text-base--line-height));
    }
    .kt-btn-lg.kt-btn-icon {
      width: calc(var(--spacing) * 10);
      height: calc(var(--spacing) * 10);
      padding: calc(var(--spacing) * 0);
    }
  .kt-btn-sm {
    height: calc(var(--spacing) * 7);
    gap: calc(var(--spacing) * 1.25);
    border-radius: calc(var(--radius) - 2px);
    padding-inline: calc(var(--spacing) * 2.5);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }
    .kt-btn-sm svg {
      width: calc(var(--spacing) * 3.5);
      height: calc(var(--spacing) * 3.5);
    }
    .kt-btn-sm i {
      font-size: var(--text-sm);
      line-height: var(--tw-leading, var(--text-sm--line-height));
    }
    .kt-btn-sm.kt-btn-icon {
      width: calc(var(--spacing) * 7);
      height: calc(var(--spacing) * 7);
      padding: calc(var(--spacing) * 0);
    }
}
@layer components {
  .kt-label {
    display: inline-flex;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-leading: 1;
    line-height: 1;
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--foreground);
  }
    .kt-switch:disabled + .kt-label,.kt-checkbox:disabled + .kt-label,.kt-radio:disabled + .kt-label {
      cursor: not-allowed;
      opacity: 50%;
    }
  .kt-label-secondary {
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
  }
}
@layer components {
  .kt-card {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    border-radius: calc(var(--radius) + 4px);
    color: var(--card-foreground);
  }
  .kt-card {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    background-color: var(--card);
    --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-shadow-color: rgba(0,0,0,0.05);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .kt-card {
      --tw-shadow-color: color-mix(in oklab, rgba(0,0,0,0.05) var(--tw-shadow-alpha), transparent);
  }
    }
  .kt-card-header {
    display: flex;
    min-height: calc(var(--spacing) * 14);
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: calc(var(--spacing) * 2.5);
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--border);
    padding-inline: calc(var(--spacing) * 5);
  }
  .kt-card-footer {
    display: flex;
    align-items: center;
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    border-color: var(--border);
    padding-inline: calc(var(--spacing) * 5);
    padding-block: calc(var(--spacing) * 4);
  }
  .kt-card-content {
    flex-grow: 1;
    padding-inline: calc(var(--spacing) * 5);
    padding-block: calc(var(--spacing) * 5);
  }
  .kt-card-table {
    display: grid;
    flex-grow: 1;
  }
    .kt-card-table .kt-table-border {
      border-style: var(--tw-border-style);
      border-width: 0px;
    }
        :is(:is(.kt-card-table .kt-table) th,:is(.kt-card-table .kt-table) td):first-child {
          padding-inline-start: calc(var(--spacing) * 5);
        }
        :is(:is(.kt-card-table .kt-table) th,:is(.kt-card-table .kt-table) td):last-child {
          padding-inline-end: calc(var(--spacing) * 5);
        }
    .kt-card-grid .kt-card-header,.kt-card-grid .kt-card-footer {
      padding-inline: calc(var(--spacing) * 5);
    }
    .kt-card-grid .kt-card-content {
      padding: 0;
    }
      :is(.kt-card-grid .kt-card-content) .kt-table {
        border: 0;
      }
        :is(:is(.kt-card-grid .kt-card-content) .kt-table) th:first-child,:is(:is(.kt-card-grid .kt-card-content) .kt-table) td:first-child {
          padding-inline-start: calc(var(--spacing) * 5);
        }
          .kt-table-cell-center:is(:is(:is(.kt-card-grid .kt-card-content) .kt-table) th:first-child,:is(:is(.kt-card-grid .kt-card-content) .kt-table) td:first-child) {
            padding-inline-end: calc(var(--spacing) * 5);
          }
        :is(:is(.kt-card-grid .kt-card-content) .kt-table) th:last-child,:is(:is(.kt-card-grid .kt-card-content) .kt-table) td:last-child {
          padding-inline-end: calc(var(--spacing) * 5);
        }
          .table-cell-center:is(:is(:is(.kt-card-grid .kt-card-content) .kt-table) th:last-child,:is(:is(.kt-card-grid .kt-card-content) .kt-table) td:last-child) {
            padding-inline-start: calc(var(--spacing) * 5);
          }
    :where(.kt-card-heading > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));
    }
  .kt-card-toolbar {
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 2.5);
  }
  .kt-card-title {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
    --tw-leading: 1;
    line-height: 1;
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
  }
  .kt-card-description {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--muted-foreground);
  }
  .kt-card-group {
    flex-grow: 1;
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--border);
    padding-inline: calc(var(--spacing) * 5);
    padding-block: calc(var(--spacing) * 5);
  }
    .kt-card-group:last-child {
      border-bottom-style: var(--tw-border-style);
      border-bottom-width: 0px;
    }
    .kt-card-group + .kt-card-footer {
      border-top-style: var(--tw-border-style);
      border-top-width: 0px;
    }
  .kt-card-accent {
    background-color: var(--muted);
    padding: calc(var(--spacing) * 1);
    --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-shadow-color: rgba(0,0,0,0.05);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .kt-card-accent {
      --tw-shadow-color: color-mix(in oklab, rgba(0,0,0,0.05) var(--tw-shadow-alpha), transparent);
  }
    }
    .kt-card-accent .kt-card-header {
      border-bottom-style: var(--tw-border-style);
      border-bottom-width: 0px;
    }
    .kt-card-accent .kt-card-content {
      border-top-left-radius: calc(var(--radius) + 4px);
      border-top-right-radius: calc(var(--radius) + 4px);
      background-color: var(--card);
    }
      :is(.kt-card-accent .kt-card-content):last-child {
        border-bottom-right-radius: calc(var(--radius) + 4px);
        border-bottom-left-radius: calc(var(--radius) + 4px);
      }
    .kt-card-accent .kt-card-table {
      border-radius: calc(var(--radius) + 4px);
      background-color: var(--card);
    }
      :is(.kt-card-accent .kt-card-table):last-child {
        border-bottom-right-radius: calc(var(--radius) + 4px);
        border-bottom-left-radius: calc(var(--radius) + 4px);
      }
    .kt-card-accent .kt-card-footer {
      margin-top: 2px;
      border-bottom-right-radius: calc(var(--radius) + 4px);
      border-bottom-left-radius: calc(var(--radius) + 4px);
      border-top-style: var(--tw-border-style);
      border-top-width: 0px;
      background-color: var(--card);
    }
  .kt-card-border {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
  }
  .kt-card-rounded-t {
    border-top-left-radius: calc(var(--radius) + 4px);
    border-top-right-radius: calc(var(--radius) + 4px);
  }
  .kt-card-rounded-b {
    border-bottom-right-radius: calc(var(--radius) + 4px);
    border-bottom-left-radius: calc(var(--radius) + 4px);
  }
}
@layer components {
  [data-kt-carousel]:not([data-kt-carousel-show-scrollbar="true"])	[data-kt-carousel-viewport],	[data-kt-carousel]:not([data-kt-carousel-show-scrollbar="true"])	[data-kt-carousel-thumbnails] {
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  [data-kt-carousel]:not([data-kt-carousel-show-scrollbar="true"])	[data-kt-carousel-viewport]::-webkit-scrollbar,	[data-kt-carousel]:not([data-kt-carousel-show-scrollbar="true"])	[data-kt-carousel-thumbnails]::-webkit-scrollbar {
    display: none;
  }
  [data-kt-carousel-thumbnail]:not(:disabled),	[data-kt-carousel-pagination-item]:not(:disabled),	[data-kt-carousel-prev]:not(:disabled),	[data-kt-carousel-next]:not(:disabled) {
    cursor: pointer;
  }
  [data-kt-carousel-thumbnail] {
    transition-property: border-color, background-color, color, box-shadow, opacity;
    transition-duration: 0.2s;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  }
  @media (prefers-reduced-motion: reduce) {
    [data-kt-carousel-thumbnail] {
      transition-duration: 0.01ms;
      transition-property: none;
    }
  }
}
@layer components {
  .kt-checkbox {
    cursor: pointer;
    appearance: none;
    background-position: center;
    background-repeat: no-repeat;
    flex-shrink: 0;
    border-radius: calc(var(--radius) - 4px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--input);
    background-color: var(--background);
    --tw-ring-offset-color: var(--background);
  }
    .kt-checkbox:focus-visible {
      --tw-outline-style: none;
      outline-style: none;
    }
    .kt-checkbox:focus-visible {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    .kt-checkbox:focus-visible {
      --tw-ring-color: var(--ring);
    }
    .kt-checkbox:focus-visible {
      --tw-ring-offset-width: 2px;
      --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    }
    .kt-checkbox:disabled {
      cursor: not-allowed;
    }
    .kt-checkbox:disabled {
      opacity: 50%;
    }
    .kt-checkbox[aria-invalid="true"] {
      border-color: var(--destructive);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-checkbox[aria-invalid="true"] {
        border-color: color-mix(in oklab, var(--destructive) 60%, transparent);
    }
      }
    .kt-checkbox[aria-invalid="true"] {
      --tw-ring-color: var(--destructive);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-checkbox[aria-invalid="true"] {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 10%, transparent);
    }
      }
    .kt-checkbox:checked {
      border-color: var(--primary);
    }
    .kt-checkbox:checked {
      background-color: var(--primary);
    }
    .kt-checkbox:checked {
      color: var(--primary-foreground);
    }
    .kt-checkbox:indeterminate {
      border-color: var(--primary);
    }
    .kt-checkbox:indeterminate {
      background-color: var(--primary);
    }
    .kt-checkbox:indeterminate {
      color: var(--primary-foreground);
    }
    .kt-checkbox-mono:checked {
      border-color: var(--mono);
    }
    .kt-checkbox-mono:checked {
      background-color: var(--mono);
    }
    .kt-checkbox-mono:checked {
      color: var(--mono-foreground);
    }
    .kt-checkbox-mono:indeterminate {
      border-color: var(--mono);
    }
    .kt-checkbox-mono:indeterminate {
      background-color: var(--mono);
    }
    .kt-checkbox-mono:indeterminate {
      color: var(--mono-foreground);
    }
  .kt-checkbox {
    width: calc(var(--spacing) * 4.5);
    height: calc(var(--spacing) * 4.5);
  }
    .kt-checkbox:checked,.kt-checkbox[aria-checked='true'] {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='9' viewBox='0 0 12 9' fill='none'%3E%3Cpath d='M10.3667 0.541643L4.80007 6.10831L1.56674 2.87498C1.41061 2.71977 1.1994 2.63265 0.979241 2.63265C0.759086 2.63265 0.547876 2.71977 0.391741 2.87498C0.236532 3.03111 0.149414 3.24232 0.149414 3.46248C0.149414 3.68263 0.236532 3.89384 0.391741 4.04998L4.21674 7.87498C4.37288 8.03019 4.58409 8.1173 4.80424 8.1173C5.0244 8.1173 5.23561 8.03019 5.39174 7.87498L11.5417 1.72498C11.6198 1.64751 11.6818 1.55534 11.7241 1.45379C11.7665 1.35224 11.7882 1.24332 11.7882 1.13331C11.7882 1.0233 11.7665 0.914379 11.7241 0.81283C11.6818 0.711281 11.6198 0.619113 11.5417 0.541643C11.3856 0.386434 11.1744 0.299316 10.9542 0.299316C10.7341 0.299316 10.5229 0.386434 10.3667 0.541643Z' fill='white'/%3E%3C/svg%3E");
    }
    .kt-checkbox:indeterminate {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M6 10h8'/%3E%3C/svg%3E");
    }
  .kt-checkbox {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }
  .kt-checkbox-sm {
    width: calc(var(--spacing) * 4.5);
    height: calc(var(--spacing) * 4.5);
  }
    .kt-checkbox-sm:checked,.kt-checkbox-sm[aria-checked='true'] {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='7' viewBox='0 0 10 7' fill='none'%3E%3Cpath d='M8.4932 0.233321L4.03986 4.68665L1.4532 2.09999C1.32829 1.97582 1.15932 1.90613 0.983198 1.90613C0.807074 1.90613 0.638106 1.97582 0.513198 2.09999C0.38903 2.2249 0.319336 2.39386 0.319336 2.56999C0.319336 2.74611 0.38903 2.91508 0.513198 3.03999L3.5732 6.09999C3.69811 6.22415 3.86707 6.29385 4.0432 6.29385C4.21932 6.29385 4.38829 6.22415 4.5132 6.09999L9.4332 1.17999C9.49568 1.11801 9.54528 1.04428 9.57912 0.963038C9.61297 0.881799 9.6304 0.794662 9.6304 0.706655C9.6304 0.618647 9.61297 0.53151 9.57912 0.45027C9.54528 0.369031 9.49568 0.295296 9.4332 0.233321C9.30829 0.109154 9.13932 0.0394592 8.9632 0.0394592C8.78707 0.0394592 8.61811 0.109154 8.4932 0.233321Z' fill='white'/%3E%3C/svg%3E");
    }
    .kt-checkbox-sm:indeterminate {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M6 10h8'/%3E%3C/svg%3E");
    }
  .kt-checkbox-lg {
    width: calc(var(--spacing) * 5.5);
    height: calc(var(--spacing) * 5.5);
  }
    .kt-checkbox-lg:checked,.kt-checkbox-lg[aria-checked='true'] {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='10' viewBox='0 0 14 10' fill='none'%3E%3Cpath d='M11.8035 1.19582L5.68018 7.31915L2.12351 3.76249C1.95176 3.59176 1.71943 3.49593 1.47726 3.49593C1.23509 3.49593 1.00276 3.59176 0.831013 3.76249C0.660283 3.93424 0.564453 4.16657 0.564453 4.40874C0.564453 4.65091 0.660283 4.88324 0.831013 5.05499L5.03851 9.26249C5.21026 9.43322 5.44259 9.52905 5.68476 9.52905C5.92693 9.52905 6.15926 9.43322 6.33101 9.26249L13.096 2.49749C13.1819 2.41227 13.2501 2.31089 13.2967 2.19918C13.3432 2.08748 13.3672 1.96766 13.3672 1.84665C13.3672 1.72564 13.3432 1.60583 13.2967 1.49413C13.2501 1.38242 13.1819 1.28104 13.096 1.19582C12.9243 1.02509 12.6919 0.92926 12.4498 0.92926C12.2076 0.92926 11.9753 1.02509 11.8035 1.19582Z' fill='white'/%3E%3C/svg%3E");
    }
    .kt-checkbox-lg:indeterminate {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M6 10h8'/%3E%3C/svg%3E");
    }
}
@layer components {
    [aria-invalid="true"]:is(.dark .kt-checkbox) {
      border-color: var(--destructive);
    }
    [aria-invalid="true"]:is(.dark .kt-checkbox) {
      --tw-ring-color: var(--destructive);
    }
      @supports (color: color-mix(in lab, red, red)) {
    [aria-invalid="true"]:is(.dark .kt-checkbox) {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
    }
      }
}
@layer components {
  .kt-datatable-toolbar {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: calc(var(--spacing) * 3);
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    border-color: var(--border);
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 3);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--muted-foreground);
  }
    @media (width >= 40rem) {
  .kt-datatable-toolbar {
      flex-direction: row;
  }
    }
    @media (width >= 40rem) {
  .kt-datatable-toolbar {
      justify-content: space-between;
  }
    }
  .kt-datatable-pagination {
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 1);
  }
    .kt-datatable-pagination .kt-datatable-pagination-button {
      display: inline-flex;
      height: calc(var(--spacing) * 7);
      min-width: calc(var(--spacing) * 7);
      cursor: pointer;
      align-items: center;
      justify-content: center;
      border-radius: calc(var(--radius) - 2px);
      background-color: transparent;
      padding-inline: calc(var(--spacing) * 0.5);
      color: var(--muted-foreground);
    }
      .active:is(.kt-datatable-pagination .kt-datatable-pagination-button),:is(.kt-datatable-pagination .kt-datatable-pagination-button):hover:not(:disabled) {
        background-color: var(--accent);
        color: var(--accent-foreground);
      }
      .kt-datatable-pagination-prev:is(.kt-datatable-pagination .kt-datatable-pagination-button) {
        color: var(--foreground);
      }
      .kt-datatable-pagination-next:is(.kt-datatable-pagination .kt-datatable-pagination-button) {
        color: var(--foreground);
      }
      :is(.kt-datatable-pagination .kt-datatable-pagination-button):disabled {
        cursor: default;
        color: var(--muted-foreground);
      }
  .kt-datatable-length {
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    white-space: nowrap;
  }
  .kt-datatable-info {
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 4);
  }
  .kt-datatable-loading {
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    border-radius: calc(var(--radius) - 2px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    background-color: var(--card);
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-leading: 1;
    line-height: 1;
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--card-foreground);
    --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-shadow-color: rgba(0,0,0,0.05);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .kt-datatable-loading {
      --tw-shadow-color: color-mix(in oklab, rgba(0,0,0,0.05) var(--tw-shadow-alpha), transparent);
  }
    }
  .kt-datatable-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
  }
  [data-kt-datatable] {
    position: relative;
  }
  [data-kt-datatable].loading table {
    opacity: 0.6;
  }
}
@layer components {
  .kt-drawer {
    position: fixed;
    inset: calc(var(--spacing) * 0);
    z-index: 10;
    flex-direction: column;
    background-color: var(--popover);
    color: var(--popover-foreground);
    --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: 300ms;
    transition-duration: 300ms;
    --tw-ease: var(--ease-in-out);
    transition-timing-function: var(--ease-in-out);
    --tw-outline-style: none;
    outline-style: none;
  }
  .kt-drawer-backdrop {
    position: fixed;
    inset: calc(var(--spacing) * 0);
    background-color: color-mix(in srgb, #000 30%, transparent);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .kt-drawer-backdrop {
      background-color: color-mix(in oklab, var(--color-black) 30%, transparent);
  }
    }
  .kt-drawer-backdrop {
    backdrop-filter: blur(4px);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: 300ms;
    transition-duration: 300ms;
  }
  .kt-drawer-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--border);
    padding: calc(var(--spacing) * 5);
  }
  .kt-drawer-title {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--mono);
  }
  .kt-drawer-close {
    margin-inline-end: calc(var(--spacing) * -2.5);
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
    flex-shrink: 0;
    cursor: pointer;
  }
    .kt-drawer-close i {
      font-size: var(--text-xs);
      line-height: var(--tw-leading, var(--text-xs--line-height));
      opacity: 70%;
    }
    .kt-drawer-close  > svg {
      width: calc(var(--spacing) * 4);
      height: calc(var(--spacing) * 4);
      opacity: 70%;
    }
      :is(.kt-drawer-close:focus,.kt-drawer-close:hover) i {
        opacity: 100%;
      }
      :is(.kt-drawer-close:focus,.kt-drawer-close:hover)  > svg {
        opacity: 100%;
      }
  .kt-drawer-content {
    flex-grow: 1;
    overflow-y: auto;
    padding: calc(var(--spacing) * 5);
  }
  .kt-drawer-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    border-color: var(--border);
    padding: calc(var(--spacing) * 5);
  }
  .kt-drawer-start {
    inset-inline-end: auto;
    max-width: 90%;
    --tw-translate-x: -100%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
    .kt-drawer-start.open[data-kt-drawer-initialized] {
      --tw-translate-x: calc(var(--spacing) * 0);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    .open[data-kt-drawer-initialized] .kt-drawer-start {
      --tw-translate-x: calc(var(--spacing) * 0);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
  .kt-drawer-end {
    inset-inline-start: auto;
    max-width: 90%;
    --tw-translate-x: 100%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
    .kt-drawer-end.open[data-kt-drawer-initialized] {
      --tw-translate-x: calc(var(--spacing) * 0);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    .open[data-kt-drawer-initialized] .kt-drawer-end {
      --tw-translate-x: calc(var(--spacing) * 0);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
  .kt-drawer-top {
    inset-inline-start: calc(var(--spacing) * 0);
    inset-inline-end: calc(var(--spacing) * 0);
    top: auto;
    bottom: calc(var(--spacing) * 0);
    max-height: 90%;
    --tw-translate-y: 100%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
    .kt-drawer-top.open[data-kt-drawer-initialized] {
      --tw-translate-y: calc(var(--spacing) * 0);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    .open[data-kt-drawer-initialized] .kt-drawer-top {
      --tw-translate-y: calc(var(--spacing) * 0);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
  .kt-drawer-bottom {
    inset-inline-start: calc(var(--spacing) * 0);
    inset-inline-end: calc(var(--spacing) * 0);
    top: calc(var(--spacing) * 0);
    bottom: auto;
    max-height: 90%;
    --tw-translate-y: -100%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
    .kt-drawer-bottom.open[data-kt-drawer-initialized] {
      --tw-translate-y: calc(var(--spacing) * 0);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    .open[data-kt-drawer-initialized] .kt-drawer-bottom {
      --tw-translate-y: calc(var(--spacing) * 0);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
  .kt-drawer.open .kt-drawer-start {
    --tw-translate-x: calc(var(--spacing) * 0);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .kt-drawer.open .kt-drawer-end {
    --tw-translate-x: calc(var(--spacing) * 0);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .kt-drawer.open .kt-drawer-top {
    --tw-translate-y: calc(var(--spacing) * 0);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .kt-drawer.open .kt-drawer-bottom {
    --tw-translate-y: calc(var(--spacing) * 0);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
}
@layer components {
  .kt-dropdown {
    border-radius: calc(var(--radius) - 2px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    background-color: var(--popover);
    color: var(--popover-foreground);
    --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-shadow-color: rgba(0,0,0,0.05);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .kt-dropdown {
      --tw-shadow-color: color-mix(in oklab, rgba(0,0,0,0.05) var(--tw-shadow-alpha), transparent);
  }
    }
    .kt-dropdown:not(.open) {
      display: none;
    }
  .kt-dropdown-header {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--border);
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 3);
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }
  .kt-dropdown-body {
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 3);
  }
}
@layer components {
    :where(.kt-dropdown-menu > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));
    }
  .kt-dropdown-menu {
    border-radius: calc(var(--radius) - 2px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    background-color: var(--popover);
    padding: calc(var(--spacing) * 2);
    color: var(--popover-foreground);
    --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-shadow-color: rgba(0,0,0,0.05);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .kt-dropdown-menu {
      --tw-shadow-color: color-mix(in oklab, rgba(0,0,0,0.05) var(--tw-shadow-alpha), transparent);
  }
    }
    .kt-dropdown-menu:not(.open) {
      display: none;
    }
  .kt-dropdown-menu-sub {
    width: 100%;
  }
    :where(.kt-dropdown-menu-sub > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));
    }
  .kt-dropdown-menu-toggle {
    display: flex;
    width: 100%;
    cursor: pointer;
    align-items: center;
    column-gap: calc(var(--spacing) * 2.5);
    border-radius: calc(var(--radius) - 2px);
    padding-inline: calc(var(--spacing) * 2.5);
    padding-block: calc(var(--spacing) * 2);
    text-align: start;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
    .kt-dropdown-menu-toggle:disabled {
      pointer-events: none;
    }
    .kt-dropdown-menu-toggle:disabled {
      opacity: 50%;
    }
  .kt-dropdown-menu-toggle {
    color: var(--foreground);
  }
      @media (hover: hover) {
    .kt-dropdown-menu-toggle:hover {
        background-color: var(--accent);
    }
      }
      @media (hover: hover) {
    .kt-dropdown-menu-toggle:hover {
        color: var(--accent-foreground);
    }
      }
    .open[data-kt-dropdown-initialized] > .kt-dropdown-menu-toggle[data-kt-dropdown-toggle] {
      background-color: var(--accent);
    }
    .open[data-kt-dropdown-initialized] > [data-kt-dropdown-toggle] .kt-dropdown-menu-toggle {
      background-color: var(--accent);
    }
    .open[data-kt-dropdown-initialized] > .kt-dropdown-menu-toggle[data-kt-dropdown-toggle] {
      color: var(--accent-foreground);
    }
    .open[data-kt-dropdown-initialized] > [data-kt-dropdown-toggle] .kt-dropdown-menu-toggle {
      color: var(--accent-foreground);
    }
    .kt-dropdown-menu-toggle .kt-dropdown-menu-indicator {
      margin-inline-start: auto;
      display: inline-flex;
      width: calc(var(--spacing) * 3.5);
      height: calc(var(--spacing) * 3.5);
      flex-shrink: 0;
      align-items: center;
      color: var(--muted-foreground);
    }
    .kt-dropdown-menu-toggle i {
      flex-shrink: 0;
      font-size: var(--text-base);
      line-height: var(--tw-leading, var(--text-base--line-height));
      color: var(--muted-foreground);
    }
    .kt-dropdown-menu-toggle svg {
      width: calc(var(--spacing) * 4);
      height: calc(var(--spacing) * 4);
      flex-shrink: 0;
      color: var(--muted-foreground);
    }
  .kt-dropdown-menu-link {
    display: flex;
    width: 100%;
    cursor: pointer;
    align-items: center;
    column-gap: calc(var(--spacing) * 2.5);
    border-radius: calc(var(--radius) - 2px);
    padding-inline: calc(var(--spacing) * 2.5);
    padding-block: calc(var(--spacing) * 2);
    text-align: start;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
    .kt-dropdown-menu-link:disabled {
      pointer-events: none;
    }
    .kt-dropdown-menu-link:disabled {
      opacity: 50%;
    }
  .kt-dropdown-menu-link {
    color: var(--foreground);
  }
      @media (hover: hover) {
    .kt-dropdown-menu-link:hover {
        background-color: var(--accent);
    }
      }
      @media (hover: hover) {
    .kt-dropdown-menu-link:hover {
        color: var(--accent-foreground);
    }
      }
    .kt-dropdown-menu-link [data-kt-dropdown-initialized] .selected {
      background-color: var(--accent);
    }
    [data-kt-dropdown-initialized] .selected .kt-dropdown-menu-link {
      background-color: var(--accent);
    }
    [data-kt-dropdown-initialized] .kt-dropdown-menu-link.selected {
      background-color: var(--accent);
    }
    .kt-dropdown-menu-link [data-kt-dropdown-initialized] .selected {
      color: var(--accent-foreground);
    }
    [data-kt-dropdown-initialized] .selected .kt-dropdown-menu-link {
      color: var(--accent-foreground);
    }
    [data-kt-dropdown-initialized] .kt-dropdown-menu-link.selected {
      color: var(--accent-foreground);
    }
    .kt-dropdown-menu-link i {
      flex-shrink: 0;
      font-size: var(--text-base);
      line-height: var(--tw-leading, var(--text-base--line-height));
      color: var(--muted-foreground);
    }
    .kt-dropdown-menu-link svg {
      width: calc(var(--spacing) * 4);
      height: calc(var(--spacing) * 4);
      flex-shrink: 0;
      color: var(--muted-foreground);
    }
  .kt-dropdown-menu-separator {
    margin-inline: calc(var(--spacing) * -2);
    margin-block: calc(var(--spacing) * 2.5);
    height: 1px;
    background-color: var(--border);
  }
    .kt-dropdown-menu-separator:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
      rotate: 180deg;
    }
    .kt-dropdown-menu-separator:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
      transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
    }
}
@layer components {
    :where(.kt-context-menu > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 0.5) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 0.5) * calc(1 - var(--tw-space-y-reverse)));
    }
  .kt-context-menu {
    border-radius: calc(var(--radius) - 2px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    background-color: var(--popover);
    padding: calc(var(--spacing) * 1.5);
    color: var(--popover-foreground);
    --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-shadow-color: rgba(0,0,0,0.05);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .kt-context-menu {
      --tw-shadow-color: color-mix(in oklab, rgba(0,0,0,0.05) var(--tw-shadow-alpha), transparent);
  }
    }
    .kt-context-menu:not(.open) {
      display: none;
    }
  .kt-context-menu-sub {
    width: 100%;
  }
    :where(.kt-context-menu-sub > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));
    }
  .kt-context-menu-toggle {
    display: flex;
    width: 100%;
    cursor: pointer;
    align-items: center;
    column-gap: calc(var(--spacing) * 2);
    border-radius: calc(var(--radius) - 2px);
    padding-inline: calc(var(--spacing) * 2);
    padding-block: calc(var(--spacing) * 1.5);
    text-align: start;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
    .kt-context-menu-toggle:disabled {
      pointer-events: none;
    }
    .kt-context-menu-toggle:disabled {
      opacity: 50%;
    }
  .kt-context-menu-toggle {
    color: var(--foreground);
  }
      @media (hover: hover) {
    .kt-context-menu-toggle:hover {
        background-color: var(--accent);
    }
      }
      @media (hover: hover) {
    .kt-context-menu-toggle:hover {
        color: var(--accent-foreground);
    }
      }
  .kt-context-menu-link {
    display: flex;
    width: 100%;
    cursor: pointer;
    align-items: center;
    column-gap: calc(var(--spacing) * 2);
    border-radius: calc(var(--radius) - 2px);
    padding-inline: calc(var(--spacing) * 2);
    padding-block: calc(var(--spacing) * 1.5);
    text-align: start;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
    .kt-context-menu-link:disabled {
      pointer-events: none;
    }
    .kt-context-menu-link:disabled {
      opacity: 50%;
    }
  .kt-context-menu-link {
    color: var(--foreground);
  }
      @media (hover: hover) {
    .kt-context-menu-link:hover {
        background-color: var(--accent);
    }
      }
      @media (hover: hover) {
    .kt-context-menu-link:hover {
        color: var(--accent-foreground);
    }
      }
  .kt-context-menu-separator {
    margin-inline: calc(var(--spacing) * -2);
    margin-block: calc(var(--spacing) * 2.5);
    height: 1px;
    background-color: var(--border);
  }
    .kt-context-menu-separator:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
      rotate: 180deg;
    }
    .kt-context-menu-separator:where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
      transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
    }
}
@layer components {
  .kt-image-input {
    position: relative;
    display: inline-flex;
    width: calc(var(--spacing) * 20);
    height: calc(var(--spacing) * 20);
    cursor: pointer;
    align-items: center;
    justify-content: center;
  }
    .kt-image-input input[type='file'] {
      position: absolute;
      width: calc(var(--spacing) * 0);
      height: calc(var(--spacing) * 0);
      appearance: none;
      opacity: 0%;
    }
  .kt-image-input-remove {
    position: absolute;
    inset-inline-end: calc(var(--spacing) * 0.25);
    top: calc(var(--spacing) * 0.25);
    z-index: 1;
    display: flex;
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
    cursor: pointer;
    align-items: center;
    justify-content: center;
    border-radius: calc(infinity * 1px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    background-color: var(--background);
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
    .kt-image-input-remove i {
      font-size: 11px;
      color: var(--muted-foreground);
    }
    .kt-image-input-remove svg {
      width: calc(var(--spacing) * 3.25);
      height: calc(var(--spacing) * 3.25);
      color: var(--muted-foreground);
    }
      .kt-image-input-remove:hover i {
        color: var(--foreground);
      }
      .kt-image-input-remove:hover svg {
        color: var(--foreground);
      }
  .kt-image-input-placeholder {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: calc(infinity * 1px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    background-size: cover;
    background-repeat: no-repeat;
  }
    .empty[data-kt-image-input-initialized] .kt-image-input-placeholder {
      border-color: var(--border);
    }
  .kt-image-input-preview {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: calc(infinity * 1px);
    background-size: cover;
    background-repeat: no-repeat;
  }
}
@layer components {
  .kt-input {
    display: block;
    width: 100%;
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--input);
    background-color: var(--background);
    color: var(--foreground);
    --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-shadow-color: rgba(0,0,0,0.05);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .kt-input {
      --tw-shadow-color: color-mix(in oklab, rgba(0,0,0,0.05) var(--tw-shadow-alpha), transparent);
  }
    }
  .kt-input {
    outline-style: var(--tw-outline-style);
    outline-width: 0px;
    transition-property: color,box-shadow;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
    .kt-input::placeholder {
      color: var(--muted-foreground);
    }
    .kt-input:focus-visible {
      border-color: var(--ring);
    }
    .kt-input:focus-visible {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    .kt-input:focus-visible {
      --tw-ring-color: var(--ring);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-input:focus-visible {
        --tw-ring-color: color-mix(in oklab, var(--ring) 30%, transparent);
    }
      }
    .kt-input:focus-visible {
      --tw-outline-style: none;
      outline-style: none;
    }
    .kt-input:disabled {
      cursor: not-allowed;
    }
    .kt-input:disabled {
      opacity: 60%;
    }
    .kt-input::file-selector-button {
      height: 100%;
    }
    .kt-input[type=file] {
      padding-block: calc(var(--spacing) * 0);
    }
    .kt-input::file-selector-button {
      border-style: var(--tw-border-style);
      border-width: 0px;
    }
    .kt-input::file-selector-button {
      border-inline-end-style: var(--tw-border-style);
      border-inline-end-width: 1px;
    }
    .kt-input::file-selector-button {
      --tw-border-style: solid;
      border-style: solid;
    }
    .kt-input::file-selector-button {
      border-color: var(--input);
    }
    .kt-input::file-selector-button {
      background-color: transparent;
    }
    .kt-input::file-selector-button {
      padding: calc(var(--spacing) * 0);
    }
    .kt-input::file-selector-button {
      --tw-font-weight: var(--font-weight-medium);
      font-weight: var(--font-weight-medium);
    }
    .kt-input::file-selector-button {
      color: var(--foreground);
    }
    .kt-input::file-selector-button {
      font-style: normal;
    }
    .kt-input[aria-invalid="true"] {
      border-color: var(--destructive);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-input[aria-invalid="true"] {
        border-color: color-mix(in oklab, var(--destructive) 60%, transparent);
    }
      }
    .kt-input[aria-invalid="true"] {
      --tw-ring-color: var(--destructive);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-input[aria-invalid="true"] {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 10%, transparent);
    }
      }
  .kt-input {
    height: calc(var(--spacing) * 8.5);
    border-radius: calc(var(--radius) - 2px);
    padding-inline: calc(var(--spacing) * 3);
    font-size: 0.8125rem;
    --tw-leading: var(--text-sm--line-height);
    line-height: var(--text-sm--line-height);
  }
    .kt-input::file-selector-button {
      margin-inline-end: calc(var(--spacing) * 3);
    }
    .kt-input::file-selector-button {
      padding-inline-end: calc(var(--spacing) * 3);
    }
  .kt-input-lg {
    height: calc(var(--spacing) * 10);
    border-radius: calc(var(--radius) - 2px);
    padding-inline: calc(var(--spacing) * 4);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }
    .kt-input-lg::file-selector-button {
      margin-inline-end: calc(var(--spacing) * 4);
    }
    .kt-input-lg::file-selector-button {
      padding-inline-end: calc(var(--spacing) * 4);
    }
  .kt-input-sm {
    height: calc(var(--spacing) * 7);
    border-radius: calc(var(--radius) - 2px);
    padding-inline: calc(var(--spacing) * 2.5);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }
    .kt-input-sm::file-selector-button {
      margin-inline-end: calc(var(--spacing) * 2.5);
    }
    .kt-input-sm::file-selector-button {
      padding-inline-end: calc(var(--spacing) * 2.5);
    }
}
@layer components {
  .kt-input:not(input) {
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 1.5);
  }
    .kt-input:not(input):has(input:focus-visible) {
      border-color: var(--ring);
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
      --tw-ring-color: var(--ring);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-input:not(input):has(input:focus-visible) {
        --tw-ring-color: color-mix(in oklab, var(--ring) 30%, transparent);
    }
      }
    .kt-input:not(input):has(input:focus-visible) {
      --tw-outline-style: none;
      outline-style: none;
    }
    .kt-input:not(input) input {
      display: flex;
      height: auto;
      width: 100%;
      border-style: var(--tw-border-style);
      border-width: 0px;
      background-color: transparent;
      padding: calc(var(--spacing) * 0);
      color: var(--foreground);
      --tw-shadow: 0 0 #0000;
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
      transition-property: color;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
      transition-duration: var(--tw-duration, var(--default-transition-duration));
      --tw-outline-style: none;
      outline-style: none;
    }
      :is(.kt-input:not(input) input)::placeholder {
        color: var(--muted-foreground);
      }
      :is(.kt-input:not(input) input):focus-visible {
        --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
      }
      :is(.kt-input:not(input) input):disabled {
        cursor: not-allowed;
      }
      :is(.kt-input:not(input) input):disabled {
        opacity: 50%;
      }
    .kt-input:not(input) input {
      font-size: inherit;
      list-style: inherit;
    }
    .kt-input:not(input) i {
      font-size: var(--text-base);
      line-height: var(--tw-leading, var(--text-base--line-height));
      color: var(--muted-foreground);
    }
    .kt-input:not(input) svg {
      width: calc(var(--spacing) * 4);
      height: calc(var(--spacing) * 4);
      color: var(--muted-foreground);
    }
    .kt-input.kt-input-sm:not(input) {
      gap: calc(var(--spacing) * 1.25);
    }
      .kt-input.kt-input-sm:not(input) i {
        font-size: var(--text-sm);
        line-height: var(--tw-leading, var(--text-sm--line-height));
      }
      .kt-input.kt-input-sm:not(input) svg {
        width: calc(var(--spacing) * 3.5);
        height: calc(var(--spacing) * 3.5);
        color: var(--muted-foreground);
      }
    .kt-input.kt-input-lg:not(input) {
      gap: calc(var(--spacing) * 1.5);
    }
      .kt-input.kt-input-lg:not(input) i {
        font-size: var(--text-lg);
        line-height: var(--tw-leading, var(--text-lg--line-height));
      }
      .kt-input.kt-input-lg:not(input) svg {
        width: calc(var(--spacing) * 4);
        height: calc(var(--spacing) * 4);
        color: var(--muted-foreground);
      }
}
@layer components {
  .kt-input-addon {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--input);
    background-color: var(--muted);
    color: var(--secondary-foreground);
    --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-shadow-color: rgba(0,0,0,0.05);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .kt-input-addon {
      --tw-shadow-color: color-mix(in oklab, rgba(0,0,0,0.05) var(--tw-shadow-alpha), transparent);
  }
    }
  .kt-input-addon {
    height: calc(var(--spacing) * 8.5);
    min-width: calc(var(--spacing) * 8.5);
    border-radius: calc(var(--radius) - 2px);
    padding-inline: calc(var(--spacing) * 3);
    font-size: 0.8125rem;
    --tw-leading: var(--text-sm--line-height);
    line-height: var(--text-sm--line-height);
  }
    .kt-input-addon i {
      font-size: var(--text-lg);
      line-height: var(--tw-leading, var(--text-lg--line-height));
    }
    .kt-input-addon svg {
      width: calc(var(--spacing) * 4.5);
      height: calc(var(--spacing) * 4.5);
    }
    .kt-input-addon.kt-input-addon-sm {
      height: calc(var(--spacing) * 7);
      min-width: calc(var(--spacing) * 7);
      border-radius: calc(var(--radius) - 2px);
      padding-inline: calc(var(--spacing) * 2.5);
      font-size: var(--text-xs);
      line-height: var(--tw-leading, var(--text-xs--line-height));
    }
      .kt-input-addon.kt-input-addon-sm i {
        font-size: var(--text-base);
        line-height: var(--tw-leading, var(--text-base--line-height));
      }
      .kt-input-addon.kt-input-addon-sm svg {
        width: calc(var(--spacing) * 3.5);
        height: calc(var(--spacing) * 3.5);
      }
    .kt-input-addon.kt-input-addon-lg {
      height: calc(var(--spacing) * 10);
      min-width: calc(var(--spacing) * 10);
      border-radius: calc(var(--radius) - 2px);
      padding-inline: calc(var(--spacing) * 4);
      font-size: var(--text-sm);
      line-height: var(--tw-leading, var(--text-sm--line-height));
    }
      .kt-input-addon.kt-input-addon-lg i {
        font-size: var(--text-lg);
        line-height: var(--tw-leading, var(--text-lg--line-height));
      }
      .kt-input-addon.kt-input-addon-lg svg {
        width: calc(var(--spacing) * 4.5);
        height: calc(var(--spacing) * 4.5);
      }
    .kt-input-addon.kt-input-addon-icon {
      padding-inline: calc(var(--spacing) * 0);
    }
}
@layer components {
  .kt-input-ghost {
    border-style: var(--tw-border-style);
    border-width: 0px;
    background-color: var(--background);
    padding: calc(var(--spacing) * 0);
    --tw-shadow: 0 0 #0000;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
    .kt-input-ghost:focus-visible {
      border-style: var(--tw-border-style);
      border-width: 0px;
    }
    .kt-input-ghost:focus-visible {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
}
@layer components {
    [aria-invalid="true"]:is(.dark .kt-input) {
      border-color: var(--destructive);
    }
    [aria-invalid="true"]:is(.dark .kt-input) {
      --tw-ring-color: var(--destructive);
    }
      @supports (color: color-mix(in lab, red, red)) {
    [aria-invalid="true"]:is(.dark .kt-input) {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
    }
      }
}
@layer components {
  .kt-input-group {
    position: relative;
    display: flex;
    align-items: stretch;
  }
    .kt-input-group .kt-input,.kt-input-group .kt-select,.kt-input-group [data-kt-select-wrapper] {
      z-index: 1;
      flex-grow: 1;
    }
    .kt-input-group .kt-input-addon:has( + .kt-input),.kt-input-group .kt-input-addon:has( + .kt-select),.kt-input-group .kt-input-addon:has( + select[data-kt-select]) {
      border-start-end-radius: 0 !important;
      border-end-end-radius: 0 !important;
      border-inline-end-style: var(--tw-border-style) !important;
      border-inline-end-width: 0px !important;
    }
    .kt-input-group .kt-input + .kt-input-addon,.kt-input-group .kt-select + .kt-input-addon,.kt-input-group [data-kt-select-wrapper] + .kt-input-addon {
      border-start-start-radius: 0 !important;
      border-end-start-radius: 0 !important;
      border-inline-start-style: var(--tw-border-style) !important;
      border-inline-start-width: 0px !important;
    }
    .kt-input-group .kt-input-addon:has( + .kt-btn) {
      border-start-end-radius: 0 !important;
      border-end-end-radius: 0 !important;
    }
    .kt-input-group .kt-input + .kt-btn {
      border-start-start-radius: 0 !important;
      border-end-start-radius: 0 !important;
    }
    .kt-input-group .kt-input + .kt-btn.kt-btn-outline {
      border-inline-start-style: var(--tw-border-style) !important;
      border-inline-start-width: 0px !important;
    }
    .kt-input-group .kt-btn + .kt-input,.kt-input-group .kt-input-addon + .kt-input,.kt-input-group .kt-input-addon + .kt-select,.kt-input-group select[data-kt-select] + [data-kt-select-wrapper] .kt-select {
      border-start-start-radius: 0 !important;
      border-end-start-radius: 0 !important;
    }
    .kt-input-group .kt-input:has( + .kt-btn),.kt-input-group .kt-input:has( + .kt-input-addon),.kt-input-group .kt-select:has( + .kt-input-addon),.kt-input-group [data-kt-select-wrapper]:has( + .kt-input-addon) .kt-select {
      border-start-end-radius: 0 !important;
      border-end-end-radius: 0 !important;
    }
}
@layer components {
  .kt-modal {
    position: fixed;
    inset: calc(var(--spacing) * 0);
    overflow: auto;
    padding: calc(var(--spacing) * 4);
  }
    .kt-modal:not(.open) {
      display: none;
    }
  .kt-modal-backdrop {
    position: fixed;
    inset: calc(var(--spacing) * 0);
    background-color: color-mix(in srgb, #000 30%, transparent);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .kt-modal-backdrop {
      background-color: color-mix(in oklab, var(--color-black) 30%, transparent);
  }
    }
  .kt-modal-backdrop {
    backdrop-filter: blur(4px);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: 300ms;
    transition-duration: 300ms;
  }
  .kt-modal-close {
    margin-inline-end: calc(var(--spacing) * -2.5);
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
    flex-shrink: 0;
    cursor: pointer;
  }
    .kt-modal-close i {
      font-size: var(--text-xs);
      line-height: var(--tw-leading, var(--text-xs--line-height));
      opacity: 70%;
    }
    .kt-modal-close  > svg {
      width: calc(var(--spacing) * 4);
      height: calc(var(--spacing) * 4);
      opacity: 70%;
    }
      :is(.kt-modal-close:focus,.kt-modal-close:hover) i {
        opacity: 100%;
      }
      :is(.kt-modal-close:focus,.kt-modal-close:hover)  > svg {
        opacity: 100%;
      }
  .kt-modal-dialog {
    position: fixed;
    inset-inline-start: calc(1/2 * 100%);
    top: calc(1 / 2 * 100%);
    display: none;
    --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
    --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
    overflow: auto;
    padding: calc(var(--spacing) * 4);
  }
  .kt-modal-content {
    position: relative;
    margin-inline: auto;
    display: flex;
    flex-direction: column;
    border-radius: var(--radius);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    background-color: var(--popover);
    color: var(--popover-foreground);
    --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .kt-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: calc(var(--spacing) * 2);
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--border);
    padding-inline: calc(var(--spacing) * 5);
    padding-block: calc(var(--spacing) * 4);
  }
  .kt-modal-title {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--mono);
  }
  .kt-modal-body {
    overflow-y: auto;
    padding-inline: calc(var(--spacing) * 5);
    padding-block: calc(var(--spacing) * 4);
  }
  .kt-modal-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: calc(var(--spacing) * 2);
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    border-color: var(--border);
    padding-inline: calc(var(--spacing) * 5);
    padding-block: calc(var(--spacing) * 4);
  }
    .kt-modal-center:not(.kt-modal-fit) .kt-modal-content {
      top: calc(1 / 2 * 100%);
      --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
  .kt-modal-fit {
    overflow: visible;
    padding: calc(var(--spacing) * 0);
  }
    .kt-modal-fit.kt-modal-center {
      inset-inline-start: calc(1/2 * 100%);
      top: calc(1 / 2 * 100%);
      --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
      --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
}
@layer components {
  .kt-radio {
    cursor: pointer;
    appearance: none;
    background-position: center;
    background-repeat: no-repeat;
    flex-shrink: 0;
    border-radius: calc(infinity * 1px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--input);
    background-color: var(--background);
    --tw-ring-offset-color: var(--background);
  }
    .kt-radio:focus-visible {
      --tw-outline-style: none;
      outline-style: none;
    }
    .kt-radio:focus-visible {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    .kt-radio:focus-visible {
      --tw-ring-color: var(--ring);
    }
    .kt-radio:focus-visible {
      --tw-ring-offset-width: 2px;
      --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    }
    .kt-radio:disabled {
      cursor: not-allowed;
    }
    .kt-radio:disabled {
      opacity: 50%;
    }
    .kt-radio[aria-invalid="true"] {
      border-color: var(--destructive);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-radio[aria-invalid="true"] {
        border-color: color-mix(in oklab, var(--destructive) 60%, transparent);
    }
      }
    .kt-radio[aria-invalid="true"] {
      --tw-ring-color: var(--destructive);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-radio[aria-invalid="true"] {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 10%, transparent);
    }
      }
      .kt-radio[aria-invalid="true"]:is(.dark *) {
        border-color: var(--destructive);
      }
      .kt-radio[aria-invalid="true"]:is(.dark *) {
        --tw-ring-color: var(--destructive);
      }
        @supports (color: color-mix(in lab, red, red)) {
      .kt-radio[aria-invalid="true"]:is(.dark *) {
          --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
      }
        }
    .kt-radio:checked {
      border-color: var(--primary);
    }
    .kt-radio:checked {
      background-color: var(--primary);
    }
    .kt-radio:checked {
      color: var(--primary-foreground);
    }
    .kt-radio:indeterminate {
      border-color: var(--primary);
    }
    .kt-radio:indeterminate {
      background-color: var(--primary);
    }
    .kt-radio:indeterminate {
      color: var(--primary-foreground);
    }
    .kt-radio:checked,.kt-radio[aria-checked='true'] {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22' fill='none'%3E%3Ccircle cx='10.9995' cy='11' r='5.86667' fill='white'/%3E%3C/svg%3E");
    }
  .kt-radio {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }
  .kt-radio-sm {
    width: calc(var(--spacing) * 4.5);
    height: calc(var(--spacing) * 4.5);
  }
  .kt-radio-lg {
    width: calc(var(--spacing) * 5.5);
    height: calc(var(--spacing) * 5.5);
  }
    .kt-radio-mono:checked {
      border-color: var(--mono);
    }
    .kt-radio-mono:checked {
      background-color: var(--mono);
    }
    .kt-radio-mono:checked {
      color: var(--mono-foreground);
    }
    .kt-radio-mono:indeterminate {
      border-color: var(--mono);
    }
    .kt-radio-mono:indeterminate {
      background-color: var(--mono);
    }
    .kt-radio-mono:indeterminate {
      color: var(--mono-foreground);
    }
}
@layer components {
    [aria-invalid="true"]:is(.dark .kt-radio) {
      border-color: var(--destructive);
    }
    [aria-invalid="true"]:is(.dark .kt-radio) {
      --tw-ring-color: var(--destructive);
    }
      @supports (color: color-mix(in lab, red, red)) {
    [aria-invalid="true"]:is(.dark .kt-radio) {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
    }
      }
}
@layer components {
  :root {
    --kt-scrollable-scrollbar-size: 5px;
    --kt-scrollable-thumb-color: var(--color-accent);
  }
  .kt-scrollable::-webkit-scrollbar {
    width: var(--kt-scrollable-scrollbar-size);
    height: var(--kt-scrollable-scrollbar-size);
  }
  .kt-scrollable::-webkit-scrollbar-track {
    background: transparent;
  }
  .kt-scrollable::-webkit-scrollbar-thumb {
    background: var(--kt-scrollable-thumb-color);
    border-radius: var(--kt-scrollable-scrollbar-size);
  }
  @-moz-document url-prefix() {
    .kt-scrollable {
      scrollbar-width: thin;
      scrollbar-color: var(--kt-scrollable-thumb-color) transparent;
    }
  }
}
@layer components {
  .kt-select {
    display: flex;
    width: 100%;
    cursor: pointer;
    appearance: none;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--input);
    background-color: var(--background);
    padding-block: calc(var(--spacing) * 0);
    color: var(--foreground);
    --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-shadow-color: rgba(0,0,0,0.05);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .kt-select {
      --tw-shadow-color: color-mix(in oklab, rgba(0,0,0,0.05) var(--tw-shadow-alpha), transparent);
  }
    }
  .kt-select {
    transition-property: color,box-shadow;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
    .kt-select::placeholder {
      color: var(--muted-foreground);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-select::placeholder {
        color: color-mix(in oklab, var(--muted-foreground) 80%, transparent);
    }
      }
    .kt-select:focus-visible {
      border-color: var(--ring);
    }
    .kt-select:focus-visible {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    .kt-select:focus-visible {
      --tw-ring-color: var(--ring);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-select:focus-visible {
        --tw-ring-color: color-mix(in oklab, var(--ring) 30%, transparent);
    }
      }
    .kt-select:focus-visible {
      --tw-outline-style: none;
      outline-style: none;
    }
    .kt-select:disabled {
      cursor: not-allowed;
    }
    .kt-select:disabled {
      opacity: 60%;
    }
    .kt-select[aria-invalid="true"] {
      border-color: var(--destructive);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-select[aria-invalid="true"] {
        border-color: color-mix(in oklab, var(--destructive) 60%, transparent);
    }
      }
    .kt-select[aria-invalid="true"] {
      --tw-ring-color: var(--destructive);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-select[aria-invalid="true"] {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 10%, transparent);
    }
      }
  .kt-select {
    background-repeat: no-repeat;
    background-size: 14px 11px;
    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='%239f9fa9' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3E%3C/svg%3E");
  }
    .dark .kt-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='%239f9fa9' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3E%3C/svg%3E");
    }
    .kt-select[multiple],.kt-select[size]:not([size='1']) {
      padding-inline-end: var(--btn-default-px);
      background-image: none;
    }
    .kt-select:-moz-focusring {
      color: transparent;
      text-shadow: none;
    }
    .kt-select.active {
      border-color: var(--ring);
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
      --tw-ring-color: var(--ring);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-select.active {
        --tw-ring-color: color-mix(in oklab, var(--ring) 30%, transparent);
    }
      }
    .kt-select.active {
      --tw-outline-style: none;
      outline-style: none;
    }
    .kt-select.disabled {
      cursor: not-allowed;
      opacity: 60%;
    }
  .kt-select-label {
    display: flex;
    align-items: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .kt-select-arrow {
    margin-inline-start: auto;
  }
    .kt-select-arrow svg {
      width: calc(var(--spacing) * 4);
      height: calc(var(--spacing) * 4);
      color: var(--muted-foreground);
    }
  .kt-select-search {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--border);
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 1);
  }
    .kt-select-search .kt-input {
      font-size: var(--text-sm);
      line-height: var(--tw-leading, var(--text-sm--line-height));
    }
  .kt-select-search-empty {
    padding-inline: calc(var(--spacing) * 3.5);
    padding-block: calc(var(--spacing) * 1);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--muted-foreground);
  }
  .kt-select-loading {
    padding-inline: calc(var(--spacing) * 3.5);
    padding-block: calc(var(--spacing) * 1);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--muted-foreground);
  }
  .kt-select-dropdown {
    border-radius: calc(var(--radius) - 2px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    background-color: var(--popover);
    color: var(--popover-foreground);
    --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-shadow-color: rgba(0,0,0,0.05);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .kt-select-dropdown {
      --tw-shadow-color: color-mix(in oklab, rgba(0,0,0,0.05) var(--tw-shadow-alpha), transparent);
  }
    }
  .kt-select-select-all {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--border);
    padding-inline: calc(var(--spacing) * 2);
    padding-block: calc(var(--spacing) * 1);
  }
  .kt-select-select-all-button {
    width: 100%;
    cursor: pointer;
    border-radius: calc(var(--radius) - 2px);
    padding: calc(var(--spacing) * 1.5);
    text-align: start;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }
      @media (hover: hover) {
    .kt-select-select-all-button:hover {
        background-color: var(--accent);
    }
      }
      @media (hover: hover) {
    .kt-select-select-all-button:hover {
        color: var(--accent-foreground);
    }
      }
    :where(.kt-select-options > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 0.5) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 0.5) * calc(1 - var(--tw-space-y-reverse)));
    }
  .kt-select-options {
    padding: calc(var(--spacing) * 1);
  }
  .kt-select-wrapper {
    width: 100%;
    min-width: calc(var(--spacing) * 0);
  }
    .kt-select-wrapper.disabled {
      pointer-events: none;
      opacity: 60%;
    }
  .kt-select-option {
    display: flex;
    flex-grow: 1;
    cursor: pointer;
    align-items: center;
    gap: calc(var(--spacing) * 2.5);
    border-radius: calc(var(--radius) - 2px);
    padding-inline: calc(var(--spacing) * 2.5);
    padding-block: calc(var(--spacing) * 1.75);
    text-align: start;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }
      @media (hover: hover) {
    .kt-select-option:hover {
        background-color: var(--accent);
    }
      }
      @media (hover: hover) {
    .kt-select-option:hover {
        color: var(--accent-foreground);
    }
      }
    .kt-select-option[aria-disabled='true'],.kt-select-option.disabled {
      pointer-events: none;
      opacity: 60%;
    }
    .kt-select-option.focused,.kt-select-option.hover,.kt-select-option.highlighted {
      background-color: var(--accent);
      color: var(--accent-foreground);
    }
  .kt-select-option-text {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  .kt-select-group {
    padding-block: calc(var(--spacing) * 1);
  }
  .kt-select-group-header {
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 1);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--muted-foreground);
    text-transform: uppercase;
  }
  .kt-select-placeholder {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: var(--muted-foreground);
  }
  .kt-select-display:not([data-multiple='true']) {
    display: flex;
    width: 100%;
    min-width: calc(var(--spacing) * 0);
    align-items: center;
    overflow: hidden;
  }
  .kt-select-display:not([data-multiple='true']) .kt-select-option-text {
    min-width: calc(var(--spacing) * 0);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  .kt-select-tag {
    display: inline-flex;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    border-radius: var(--radius);
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 1.5);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    background-color: var(--accent);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .kt-select-tag {
      background-color: color-mix(in oklab, var(--accent) 10%, transparent);
  }
    }
  .kt-select-tag {
    color: var(--accent-foreground);
    max-width: 200px;
    flex-shrink: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-leading: var(--leading-tight);
    line-height: var(--leading-tight);
  }
  .kt-select-tag-remove {
    display: flex;
    height: calc(var(--spacing) * 5);
    width: calc(var(--spacing) * 5);
    align-items: center;
    justify-content: center;
    border-radius: calc(infinity * 1px);
    color: var(--muted-foreground);
  }
      @media (hover: hover) {
    .kt-select-tag-remove:hover {
        background-color: var(--accent);
    }
        @supports (color: color-mix(in lab, red, red)) {
    .kt-select-tag-remove:hover {
          background-color: color-mix(in oklab, var(--accent) 20%, transparent);
    }
        }
      }
      @media (hover: hover) {
    .kt-select-tag-remove:hover {
        color: var(--accent-foreground);
    }
      }
  .kt-select-tag-remove {
    cursor: pointer;
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: 200ms;
    transition-duration: 200ms;
    flex-shrink: 0;
    opacity: 100%;
  }
      @media (hover: hover) {
    .kt-select-tag-remove:hover {
        --tw-scale-x: 110%;
        --tw-scale-y: 110%;
        --tw-scale-z: 110%;
        scale: var(--tw-scale-x) var(--tw-scale-y);
    }
      }
  .kt-select-tag-remove svg {
    height: calc(var(--spacing) * 3.5);
    width: calc(var(--spacing) * 3.5);
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: 200ms;
    transition-duration: 200ms;
  }
  .kt-select-tag-remove:hover svg {
    --tw-scale-x: 110%;
    --tw-scale-y: 110%;
    --tw-scale-z: 110%;
    scale: var(--tw-scale-x) var(--tw-scale-y);
  }
  .kt-select-display[data-multiple='true'] {
    display: flex;
    min-height: 3rem;
    flex-wrap: wrap;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    padding: calc(var(--spacing) * 3);
    width: 100%;
    border-radius: calc(var(--radius) - 2px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--input);
    background-color: var(--background);
  }
    .kt-select-display[data-multiple='true']:focus-within {
      border-color: var(--ring);
    }
    .kt-select-display[data-multiple='true']:focus-within {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    .kt-select-display[data-multiple='true']:focus-within {
      --tw-ring-color: var(--ring);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-select-display[data-multiple='true']:focus-within {
        --tw-ring-color: color-mix(in oklab, var(--ring) 20%, transparent);
    }
      }
  .kt-select-display[data-multiple='true'] {
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: 200ms;
    transition-duration: 200ms;
  }
}
@layer components {
  .kt-select {
    height: calc(var(--spacing) * 8.5);
    gap: calc(var(--spacing) * 1);
    border-radius: calc(var(--radius) - 2px);
    padding-inline-start: calc(var(--spacing) * 3);
    padding-inline-end: calc(var(--spacing) * 6);
    font-size: 0.8125rem;
    --tw-leading: var(--text-sm--line-height);
    line-height: var(--text-sm--line-height);
    background-position: right 0.5rem center;
  }
    .kt-select[data-multiple='true'] {
      height: auto;
      min-height: calc(var(--spacing) * 8.5);
      flex-wrap: wrap;
      padding-block: calc(var(--spacing) * 1.5);
      background-position: right 0.5rem top 0.675rem;
    }
  .kt-select-sm {
    height: calc(var(--spacing) * 7);
    gap: calc(var(--spacing) * 1);
    border-radius: calc(var(--radius) - 2px);
    padding-inline-start: calc(var(--spacing) * 2.5);
    padding-inline-end: calc(var(--spacing) * 5);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    background-position: right 0.5rem center;
  }
    .kt-select-sm[data-multiple='true'] {
      height: auto;
      min-height: calc(var(--spacing) * 7);
      background-position: right 0.5rem top 0.575rem;
    }
  .kt-select-lg {
    height: calc(var(--spacing) * 10);
    gap: calc(var(--spacing) * 1.5);
    border-radius: calc(var(--radius) - 2px);
    padding-block: calc(var(--spacing) * 1);
    padding-inline-start: calc(var(--spacing) * 4);
    padding-inline-end: calc(var(--spacing) * 8);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    background-position: right 0.6rem center;
  }
    .kt-select-lg[data-multiple='true'] {
      height: auto;
      min-height: calc(var(--spacing) * 10);
      padding-block: calc(var(--spacing) * 2);
      background-position: right 0.6rem top 0.85rem;
    }
}
@layer components {
    [dir='rtl'] .kt-select {
      background-position: left 0.5rem center;
    }
      [data-multiple='true']:is([dir='rtl'] .kt-select) {
        background-position: left 0.5rem top 0.675rem;
      }
    [dir='rtl'] .kt-select-sm {
      background-position: left 0.5rem center;
    }
      [data-multiple='true']:is([dir='rtl'] .kt-select-sm) {
        background-position: left 0.5rem top 0.575rem;
      }
    [dir='rtl'] .kt-select-lg {
      background-position: left 0.75rem center;
    }
      [data-multiple='true']:is([dir='rtl'] .kt-select-lg) {
        background-position: left 0.75rem top 0.85rem;
      }
}
@layer components {
    [aria-invalid="true"]:is(.dark .kt-input) {
      border-color: var(--destructive);
    }
    [aria-invalid="true"]:is(.dark .kt-input) {
      --tw-ring-color: var(--destructive);
    }
      @supports (color: color-mix(in lab, red, red)) {
    [aria-invalid="true"]:is(.dark .kt-input) {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
    }
      }
}
@layer components {
  .kt-switch {
    position: relative;
    display: inline-flex;
    flex-shrink: 0;
    cursor: pointer;
    appearance: none;
    background-color: var(--input);
  }
    .kt-switch:focus-visible {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    .kt-switch:focus-visible {
      --tw-ring-color: var(--ring);
    }
    .kt-switch:focus-visible {
      --tw-ring-offset-width: 2px;
      --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    }
    .kt-switch:focus-visible {
      --tw-ring-offset-color: var(--background);
    }
    .kt-switch:focus-visible {
      --tw-outline-style: none;
      outline-style: none;
    }
      @media (forced-colors: active) {
    .kt-switch:focus-visible {
        outline: 2px solid transparent;
        outline-offset: 2px;
    }
      }
    .kt-switch:disabled {
      cursor: not-allowed;
    }
    .kt-switch:disabled {
      opacity: 50%;
    }
    .kt-switch[aria-invalid="true"] {
      border-style: var(--tw-border-style);
      border-width: 1px;
    }
    .kt-switch[aria-invalid="true"] {
      border-color: var(--destructive);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-switch[aria-invalid="true"] {
        border-color: color-mix(in oklab, var(--destructive) 60%, transparent);
    }
      }
    .kt-switch[aria-invalid="true"] {
      --tw-ring-color: var(--destructive);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-switch[aria-invalid="true"] {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 10%, transparent);
    }
      }
    .kt-switch:before {
      pointer-events: none;
      position: absolute;
      inset-inline-start: calc(var(--spacing) * 0);
      top: calc(1 / 2 * 100%);
      display: block;
      --tw-translate-x: calc(var(--spacing) * 1);
      --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
      border-radius: calc(infinity * 1px);
      background-color: var(--color-white);
      --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
      transition-property: transform, translate, scale, rotate;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
      transition-duration: var(--tw-duration, var(--default-transition-duration));
      --tw-content: "";
      content: var(--tw-content);
    }
    .kt-switch:checked,.kt-switch[aria-checked='true'] {
      background-color: var(--primary);
    }
  .kt-switch {
    height: calc(var(--spacing) * 5);
    width: calc(var(--spacing) * 7.5);
    border-radius: calc(infinity * 1px);
  }
    .kt-switch:before {
      width: calc(var(--spacing) * 3);
      height: calc(var(--spacing) * 3);
    }
      :is(.kt-switch:checked,.kt-switch[aria-checked='true']):before {
        --tw-translate-x: calc(var(--spacing) * 3.5);
        translate: var(--tw-translate-x) var(--tw-translate-y);
      }
  .kt-switch-sm {
    height: calc(var(--spacing) * 4.5);
    width: calc(var(--spacing) * 6.5);
    border-radius: calc(infinity * 1px);
  }
    .kt-switch-sm:before {
      width: calc(var(--spacing) * 2.5);
      height: calc(var(--spacing) * 2.5);
    }
      :is(.kt-switch-sm:checked,.kt-switch-sm[aria-checked='true']):before {
        --tw-translate-x: calc(var(--spacing) * 3);
        translate: var(--tw-translate-x) var(--tw-translate-y);
      }
  .kt-switch-lg {
    height: calc(var(--spacing) * 5.5);
    width: calc(var(--spacing) * 8.5);
    border-radius: calc(infinity * 1px);
  }
    .kt-switch-lg:before {
      width: calc(var(--spacing) * 3.5);
      height: calc(var(--spacing) * 3.5);
    }
      :is(.kt-switch-lg:checked,.kt-switch-lg[aria-checked='true']):before {
        --tw-translate-x: calc(var(--spacing) * 4);
        translate: var(--tw-translate-x) var(--tw-translate-y);
      }
}
@layer components {
    :is([dir='rtl'] .kt-switch):before {
      --tw-translate-x: calc(var(--spacing) * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
      :is(:is([dir='rtl'] .kt-switch):checked,[aria-checked='true']:is([dir='rtl'] .kt-switch)):before {
        --tw-translate-x: calc(var(--spacing) * -3.5);
        translate: var(--tw-translate-x) var(--tw-translate-y);
      }
        :is(.kt-switch-sm:is([dir='rtl'] .kt-switch):checked,.kt-switch-sm[aria-checked='true']:is([dir='rtl'] .kt-switch)):before {
          --tw-translate-x: calc(var(--spacing) * -3);
          translate: var(--tw-translate-x) var(--tw-translate-y);
        }
        :is(.kt-switch-lg:is([dir='rtl'] .kt-switch):checked,.kt-switch-lg[aria-checked='true']:is([dir='rtl'] .kt-switch)):before {
          --tw-translate-x: calc(var(--spacing) * -4);
          translate: var(--tw-translate-x) var(--tw-translate-y);
        }
}
@layer components {
    [aria-invalid="true"]:is(.dark .kt-switch) {
      border-color: var(--destructive);
    }
    [aria-invalid="true"]:is(.dark .kt-switch) {
      --tw-ring-color: var(--destructive);
    }
      @supports (color: color-mix(in lab, red, red)) {
    [aria-invalid="true"]:is(.dark .kt-switch) {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
    }
      }
}
@layer components {
  .kt-tabs.kt-tabs-line {
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 7);
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--border);
  }
  .kt-tabs.kt-tabs-line .kt-tab-toggle {
    display: inline-flex;
    cursor: pointer;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 2px;
    border-bottom-color: transparent;
    padding-block: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--secondary-foreground);
  }
      @media (hover: hover) {
    :is(.kt-tabs.kt-tabs-line .kt-tab-toggle):hover {
        color: var(--primary);
    }
      }
    .active[data-kt-tab-toggle]:is(.kt-tabs.kt-tabs-line .kt-tab-toggle) {
      border-color: var(--primary);
    }
    .active[data-kt-tab-toggle] :is(.kt-tabs.kt-tabs-line .kt-tab-toggle) {
      border-color: var(--primary);
    }
    [data-kt-tabs-initialized]	[data-kt-dropdown-initialized]:has([data-kt-tab-toggle].active)	:is(.kt-tabs.kt-tabs-line .kt-tab-toggle) {
      border-color: var(--primary);
    }
    .active[data-kt-tab-toggle]:is(.kt-tabs.kt-tabs-line .kt-tab-toggle) {
      color: var(--primary);
    }
    .active[data-kt-tab-toggle] :is(.kt-tabs.kt-tabs-line .kt-tab-toggle) {
      color: var(--primary);
    }
    [data-kt-tabs-initialized]	[data-kt-dropdown-initialized]:has([data-kt-tab-toggle].active)	:is(.kt-tabs.kt-tabs-line .kt-tab-toggle) {
      color: var(--primary);
    }
    :is(.kt-tabs.kt-tabs-line .kt-tab-toggle) svg {
      width: calc(var(--spacing) * 3.5);
      height: calc(var(--spacing) * 3.5);
      flex-shrink: 0;
      color: var(--muted-foreground);
    }
      .active[data-kt-tab-toggle]:is(:is(.kt-tabs.kt-tabs-line .kt-tab-toggle) svg) {
        color: var(--primary);
      }
      .active[data-kt-tab-toggle] :is(:is(.kt-tabs.kt-tabs-line .kt-tab-toggle) svg) {
        color: var(--primary);
      }
      [data-kt-tabs-initialized]	[data-kt-dropdown-initialized]:has([data-kt-tab-toggle].active)	:is(:is(.kt-tabs.kt-tabs-line .kt-tab-toggle) svg) {
        color: var(--primary);
      }
      :is(.kt-tabs.kt-tabs-line .kt-tab-toggle):hover svg {
        color: var(--primary);
      }
}
@layer components {
  .kt-textarea {
    width: 100%;
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--input);
    background-color: var(--background);
    color: var(--foreground);
    --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-shadow-color: rgba(0,0,0,0.05);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .kt-textarea {
      --tw-shadow-color: color-mix(in oklab, rgba(0,0,0,0.05) var(--tw-shadow-alpha), transparent);
  }
    }
  .kt-textarea {
    transition-property: color,box-shadow;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
    .kt-textarea::placeholder {
      color: var(--muted-foreground);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-textarea::placeholder {
        color: color-mix(in oklab, var(--muted-foreground) 80%, transparent);
    }
      }
    .kt-textarea:focus-visible {
      border-color: var(--ring);
    }
    .kt-textarea:focus-visible {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    .kt-textarea:focus-visible {
      --tw-ring-color: var(--ring);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-textarea:focus-visible {
        --tw-ring-color: color-mix(in oklab, var(--ring) 30%, transparent);
    }
      }
    .kt-textarea:focus-visible {
      --tw-outline-style: none;
      outline-style: none;
    }
    .kt-textarea:disabled {
      cursor: not-allowed;
    }
    .kt-textarea:disabled {
      opacity: 60%;
    }
    .kt-textarea[aria-invalid="true"] {
      border-color: var(--destructive);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-textarea[aria-invalid="true"] {
        border-color: color-mix(in oklab, var(--destructive) 60%, transparent);
    }
      }
    .kt-textarea[aria-invalid="true"] {
      --tw-ring-color: var(--destructive);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-textarea[aria-invalid="true"] {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 10%, transparent);
    }
      }
  .kt-textarea {
    border-radius: calc(var(--radius) - 2px);
    padding: calc(var(--spacing) * 3);
    font-size: 0.8125rem;
    --tw-leading: var(--text-sm--line-height);
    line-height: var(--text-sm--line-height);
  }
  .kt-textarea-lg {
    border-radius: calc(var(--radius) - 2px);
    padding: calc(var(--spacing) * 4);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }
  .kt-textarea-sm {
    border-radius: calc(var(--radius) - 2px);
    padding: calc(var(--spacing) * 2.5);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }
}
@layer components {
    [aria-invalid="true"]:is(.dark .kt-textarea) {
      border-color: var(--destructive);
    }
    [aria-invalid="true"]:is(.dark .kt-textarea) {
      --tw-ring-color: var(--destructive);
    }
      @supports (color: color-mix(in lab, red, red)) {
    [aria-invalid="true"]:is(.dark .kt-textarea) {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
    }
      }
}
@layer components {
  .kt-tooltip {
    border-radius: calc(var(--radius) - 2px);
    background-color: var(--mono);
    padding: calc(var(--spacing) * 1.5);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    color: var(--mono-foreground);
    --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-shadow-color: rgba(0,0,0,0.05);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .kt-tooltip {
      --tw-shadow-color: color-mix(in oklab, rgba(0,0,0,0.05) var(--tw-shadow-alpha), transparent);
  }
    }
    .kt-tooltip:is(.dark *) {
      border-style: var(--tw-border-style);
      border-width: 1px;
    }
    .kt-tooltip:is(.dark *) {
      border-color: var(--border);
    }
    .kt-tooltip:not(.show) {
      display: none;
    }
  .kt-tooltip-light {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    background-color: var(--popover);
    color: var(--popover-foreground);
  }
}
@layer components {
  .kt-popover {
    border-radius: calc(var(--radius) - 2px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    background-color: var(--popover);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--popover-foreground);
    --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-shadow-color: rgba(0,0,0,0.05);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .kt-popover {
      --tw-shadow-color: color-mix(in oklab, rgba(0,0,0,0.05) var(--tw-shadow-alpha), transparent);
  }
    }
    .kt-popover:not(.show) {
      display: none;
    }
  .kt-popover-header {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--border);
    padding-inline: calc(var(--spacing) * 2.5);
    padding-block: calc(var(--spacing) * 2);
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--mono);
  }
  .kt-popover-content {
    padding-inline: calc(var(--spacing) * 2.5);
    padding-block: calc(var(--spacing) * 2);
  }
}
@layer components {
  .kt-table-wrapper {
    position: relative;
    width: 100%;
    overflow: auto;
  }
  .kt-table {
    width: 100%;
    border-collapse: collapse;
    text-align: left;
    vertical-align: bottom;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--foreground);
    caption-side: bottom;
  }
    .kt-table tr {
      border-bottom-style: var(--tw-border-style);
      border-bottom-width: 1px;
      border-color: var(--border);
    }
    .kt-table caption {
      margin-top: calc(var(--spacing) * 4);
      font-size: var(--text-sm);
      line-height: var(--tw-leading, var(--text-sm--line-height));
      color: var(--muted-foreground);
    }
      :is(.kt-table thead) tr {
        border-bottom-style: var(--tw-border-style);
        border-bottom-width: 1px;
      }
      :is(.kt-table thead) th {
        height: calc(var(--spacing) * 10);
        background-color: var(--muted);
      }
        @supports (color: color-mix(in lab, red, red)) {
      :is(.kt-table thead) th {
          background-color: color-mix(in oklab, var(--muted) 40%, transparent);
      }
        }
      :is(.kt-table thead) th {
        padding-inline: calc(var(--spacing) * 4);
        text-align: left;
        vertical-align: middle;
        --tw-font-weight: var(--font-weight-normal);
        font-weight: var(--font-weight-normal);
        color: var(--secondary-foreground);
      }
        :is(:is(.kt-table thead) th):where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
          text-align: right;
        }
        :is(:is(.kt-table thead) th):has([role=checkbox]) {
          padding-inline-end: calc(var(--spacing) * 0);
        }
      :is(.kt-table tbody) tr:last-child {
        border-style: var(--tw-border-style);
        border-width: 0px;
      }
      :is(.kt-table tbody) td {
        padding-inline: calc(var(--spacing) * 4);
        padding-block: calc(var(--spacing) * 3);
        vertical-align: middle;
      }
        :is(:is(.kt-table tbody) td):has([role=checkbox]) {
          padding-inline-end: calc(var(--spacing) * 0);
        }
    .kt-table tfoot {
      border-top-style: var(--tw-border-style);
      border-top-width: 1px;
      background-color: var(--muted);
    }
      @supports (color: color-mix(in lab, red, red)) {
    .kt-table tfoot {
        background-color: color-mix(in oklab, var(--muted) 50%, transparent);
    }
      }
    .kt-table tfoot {
      --tw-font-weight: var(--font-weight-medium);
      font-weight: var(--font-weight-medium);
    }
        :is(.kt-table tfoot):last-child > tr {
          border-bottom-style: var(--tw-border-style);
          border-bottom-width: 0px;
        }
      :is(.kt-table tfoot) th {
        height: calc(var(--spacing) * 10);
        padding-inline: calc(var(--spacing) * 4);
        text-align: left;
        vertical-align: middle;
        --tw-font-weight: var(--font-weight-normal);
        font-weight: var(--font-weight-normal);
        color: var(--secondary-foreground);
      }
        :is(:is(.kt-table tfoot) th):where(:dir(rtl),[dir="rtl"],[dir="rtl"] *) {
          text-align: right;
        }
        :is(:is(.kt-table tfoot) th):has([role=checkbox]) {
          padding-inline-end: calc(var(--spacing) * 0);
        }
      :is(.kt-table td,.kt-table th) input[type='checkbox'] {
        vertical-align: inherit;
      }
      .checked:is(:is([data-kt-datatable-table],.kt-table-highlight) tr) {
        background-color: var(--muted);
      }
      :is(:is([data-kt-datatable-table],.kt-table-highlight) tr):has(td):hover {
        background-color: var(--muted);
      }
        @supports (color: color-mix(in lab, red, red)) {
      :is(:is([data-kt-datatable-table],.kt-table-highlight) tr):has(td):hover {
          background-color: color-mix(in oklab, var(--muted) 50%, transparent);
      }
        }
  .kt-table-col {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    cursor: pointer;
  }
  .kt-table-col-label {
    display: inline-flex;
    align-items: center;
    flex-wrap: nowrap;
    white-space: nowrap;
    gap: 0.35rem;
  }
  .kt-table-col-sort {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 0.975rem;
    width: 0.975rem;
    gap: 0.125rem;
    line-height: 1;
  }
    .kt-table-col-sort:before {
      display: inline-block;
      content: '';
      height: 0.25rem;
      width: 0.438rem;
      background-repeat: no-repeat;
      background-position: center;
      background-size: cover;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5' fill='none'%3E%3Cpath d='M1.08333 4.83333C0.908333 4.83333 0.791667 4.775 0.675 4.65833C0.441667 4.425 0.441667 4.075 0.675 3.84167L3.59167 0.925C3.825 0.691667 4.175 0.691667 4.40833 0.925L7.325 3.84167C7.55833 4.075 7.55833 4.425 7.325 4.65833C7.09167 4.89167 6.74167 4.89167 6.50833 4.65833L4 2.15L1.49167 4.65833C1.375 4.775 1.25833 4.83333 1.08333 4.83333Z' fill='%2378829D'/%3E%3C/svg%3E");
    }
    .kt-table-col-sort:after {
      display: inline-block;
      content: '';
      height: 0.25rem;
      width: 0.438rem;
      background-repeat: no-repeat;
      background-position: center;
      background-size: cover;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5' fill='none'%3E%3Cpath d='M4 4.24984C3.825 4.24984 3.70833 4.1915 3.59167 4.07484L0.675 1.15817C0.441667 0.924838 0.441667 0.574837 0.675 0.341504C0.908333 0.108171 1.25833 0.108171 1.49167 0.341504L4 2.84984L6.50833 0.341504C6.74167 0.108171 7.09167 0.108171 7.325 0.341504C7.55833 0.574837 7.55833 0.924838 7.325 1.15817L4.40833 4.07484C4.29167 4.1915 4.175 4.24984 4 4.24984Z' fill='%2378829D'/%3E%3C/svg%3E");
    }
      :is([aria-sort='asc'] .kt-table-col-sort):before {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5' fill='none'%3E%3Cpath d='M1.08333 4.83333C0.908333 4.83333 0.791667 4.775 0.675 4.65833C0.441667 4.425 0.441667 4.075 0.675 3.84167L3.59167 0.925C3.825 0.691667 4.175 0.691667 4.40833 0.925L7.325 3.84167C7.55833 4.075 7.55833 4.425 7.325 4.65833C7.09167 4.89167 6.74167 4.89167 6.50833 4.65833L4 2.15L1.49167 4.65833C1.375 4.775 1.25833 4.83333 1.08333 4.83333Z' fill='%234B5675'/%3E%3C/svg%3E");
      }
      :is([aria-sort='asc'] .kt-table-col-sort):after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5' fill='none'%3E%3Cpath d='M4 4.24984C3.825 4.24984 3.70833 4.1915 3.59167 4.07484L0.675 1.15817C0.441667 0.924838 0.441667 0.574837 0.675 0.341504C0.908333 0.108171 1.25833 0.108171 1.49167 0.341504L4 2.84984L6.50833 0.341504C6.74167 0.108171 7.09167 0.108171 7.325 0.341504C7.55833 0.574837 7.55833 0.924838 7.325 1.15817L4.40833 4.07484C4.29167 4.1915 4.175 4.24984 4 4.24984Z' fill='%23C9CEDA'/%3E%3C/svg%3E");
      }
      :is([aria-sort='desc'] .kt-table-col-sort):before {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5' fill='none'%3E%3Cpath d='M1.08333 4.83333C0.908333 4.83333 0.791667 4.775 0.675 4.65833C0.441667 4.425 0.441667 4.075 0.675 3.84167L3.59167 0.925C3.825 0.691667 4.175 0.691667 4.40833 0.925L7.325 3.84167C7.55833 4.075 7.55833 4.425 7.325 4.65833C7.09167 4.89167 6.74167 4.89167 6.50833 4.65833L4 2.15L1.49167 4.65833C1.375 4.775 1.25833 4.83333 1.08333 4.83333Z' fill='%23C9CEDA'/%3E%3C/svg%3E");
      }
      :is([aria-sort='desc'] .kt-table-col-sort):after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5' fill='none'%3E%3Cpath d='M4 4.24984C3.825 4.24984 3.70833 4.1915 3.59167 4.07484L0.675 1.15817C0.441667 0.924838 0.441667 0.574837 0.675 0.341504C0.908333 0.108171 1.25833 0.108171 1.49167 0.341504L4 2.84984L6.50833 0.341504C6.74167 0.108171 7.09167 0.108171 7.325 0.341504C7.55833 0.574837 7.55833 0.924838 7.325 1.15817L4.40833 4.07484C4.29167 4.1915 4.175 4.24984 4 4.24984Z' fill='%234B5675'/%3E%3C/svg%3E");
      }
}
@layer components {
  .kt-table-border {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
  }
    .kt-table-border td,.kt-table-border th {
      border-inline-end-style: var(--tw-border-style);
      border-inline-end-width: 1px;
      border-color: var(--border);
    }
      :is(.kt-table-border td,.kt-table-border th):last-child {
        border-inline-end-style: var(--tw-border-style);
        border-inline-end-width: 0px;
      }
  .kt-table-border-s {
    border-inline-start-style: var(--tw-border-style);
    border-inline-start-width: 1px;
    border-color: var(--border);
  }
  .kt-table-border-e {
    border-inline-end-style: var(--tw-border-style);
    border-inline-end-width: 1px;
    border-color: var(--border);
  }
  .kt-table-border-t {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    border-color: var(--border);
  }
  .kt-table-border-b {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--border);
  }
}
@layer components {
  [dir='rtl'] .kt-table {
    text-align: right;
  }
}
@layer component-overrides {
  th[data-kt-datatable-column-sort="false"] .kt-table-col {
    cursor: default;
  }
}
@layer components {
  .kt-toggle-group {
    display: inline-flex;
    align-items: center;
    background-color: var(--background);
    --tw-leading: 1;
    line-height: 1;
  }
    .kt-toggle-group .kt-btn {
      flex-grow: 1;
      border-style: var(--tw-border-style);
      border-width: 1px;
      border-inline-end-style: var(--tw-border-style);
      border-inline-end-width: 0px;
      border-color: var(--border);
      background-color: transparent;
      color: var(--accent-foreground);
    }
      :is(.kt-toggle-group .kt-btn):last-child {
        border-inline-end-style: var(--tw-border-style);
        border-inline-end-width: 1px;
        border-color: var(--border);
      }
      :is(.kt-toggle-group .kt-btn):not(:first-child) {
        border-start-start-radius: 0;
        border-end-start-radius: 0;
      }
      :is(.kt-toggle-group .kt-btn):not(:last-child) {
        border-start-end-radius: 0;
        border-end-end-radius: 0;
      }
      :is(.kt-toggle-group .kt-btn):not(:first-child):not(:last-child) {
        border-radius: 0;
      }
      :is(.kt-toggle-group .kt-btn) svg,:is(.kt-toggle-group .kt-btn) i {
        color: var(--muted-foreground);
      }
      :is(.kt-toggle-group .kt-btn) input[type='checkbox'],:is(.kt-toggle-group .kt-btn) input[type='radio'] {
        display: none;
      }
      :is(.kt-toggle-group .kt-btn):hover,:is(.kt-toggle-group .kt-btn):focus,:is(.kt-toggle-group .kt-btn):active,:is(.kt-toggle-group .kt-btn):has(input:checked),.active:is(.kt-toggle-group .kt-btn) {
        background-color: var(--accent);
        color: var(--accent-foreground);
      }
        :is(:is(.kt-toggle-group .kt-btn):hover,:is(.kt-toggle-group .kt-btn):focus,:is(.kt-toggle-group .kt-btn):active,:is(.kt-toggle-group .kt-btn):has(input:checked),.active:is(.kt-toggle-group .kt-btn)) svg,:is(:is(.kt-toggle-group .kt-btn):hover,:is(.kt-toggle-group .kt-btn):focus,:is(.kt-toggle-group .kt-btn):active,:is(.kt-toggle-group .kt-btn):has(input:checked),.active:is(.kt-toggle-group .kt-btn)) i {
          color: var(--accent-foreground);
        }
}
@layer components {
  .kt-separator {
    height: 1px;
    width: 100%;
    flex-shrink: 0;
    background-color: var(--border);
  }
  .kt-separator-vertical {
    height: 100%;
    width: 1px;
  }
}
@layer components {
  .kt-progress {
    position: relative;
    height: calc(var(--spacing) * 1);
    width: 100%;
    overflow: hidden;
    border-radius: calc(infinity * 1px);
    background-color: var(--secondary);
  }
  .kt-progress-indicator {
    height: 100%;
    width: 100%;
    flex: 1;
    transform: translateX(calc(100 - var(--progress-value)));
    border-radius: calc(infinity * 1px);
    background-color: var(--primary);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
    .kt-progress-primary .kt-progress-indicator {
      background-color: var(--primary);
    }
    .kt-progress-success .kt-progress-indicator {
      background-color: var(--color-green-500);
    }
    .kt-progress-warning .kt-progress-indicator {
      background-color: var(--color-yellow-500);
    }
    .kt-progress-info .kt-progress-indicator {
      background-color: var(--color-violet-500);
    }
    .kt-progress-destructive .kt-progress-indicator {
      background-color: var(--destructive);
    }
    .kt-progress-mono .kt-progress-indicator {
      background-color: var(--mono);
    }
}
@layer components {
  .kt-pagination {
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 1);
  }
  .kt-pagination-item {
    display: flex;
    flex-shrink: 0;
    flex-direction: row;
    align-items: center;
    gap: calc(var(--spacing) * 1);
  }
    .kt-pagination-item svg {
      width: calc(var(--spacing) * 4);
      height: calc(var(--spacing) * 4);
      color: var(--muted-foreground);
    }
  .kt-pagination-ellipsis {
    display: flex;
    height: calc(var(--spacing) * 9);
    width: calc(var(--spacing) * 9);
    align-items: center;
    justify-content: center;
  }
    .kt-pagination-ellipsis svg {
      width: calc(var(--spacing) * 4);
      height: calc(var(--spacing) * 4);
      color: var(--muted-foreground);
    }
}
@layer components {
  .kt-skeleton {
    animation: var(--animate-pulse);
    border-radius: calc(var(--radius) - 2px);
    background-color: var(--accent);
  }
}
@layer components {
  .kt-kbd {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: calc(var(--radius) - 2px);
    font-family: var(--font-mono);
  }
  .kt-kbd {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    background-color: var(--accent);
    color: var(--accent-foreground);
  }
  .kt-kbd-outline {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--input);
    background-color: transparent;
    color: var(--accent-foreground);
  }
  .kt-kbd {
    height: calc(var(--spacing) * 7);
    min-width: calc(var(--spacing) * 7);
    padding-inline: calc(var(--spacing) * 1.5);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }
    .kt-kbd svg {
      width: calc(var(--spacing) * 3.5);
      height: calc(var(--spacing) * 3.5);
    }
  .kt-kbd-xs {
    height: calc(var(--spacing) * 5);
    min-width: calc(var(--spacing) * 5);
    padding-inline: calc(var(--spacing) * 1);
    font-size: 0.6875rem;
    --tw-leading: 0.75rem;
    line-height: 0.75rem;
  }
    .kt-kbd-xs svg {
      width: calc(var(--spacing) * 3);
      height: calc(var(--spacing) * 3);
    }
  .kt-kbd-sm {
    height: calc(var(--spacing) * 6);
    min-width: calc(var(--spacing) * 6);
    padding-inline: calc(var(--spacing) * 1);
    font-size: 0.75rem;
    --tw-leading: 0.75rem;
    line-height: 0.75rem;
  }
    .kt-kbd-sm svg {
      width: calc(var(--spacing) * 3);
      height: calc(var(--spacing) * 3);
    }
}
@layer components {
  .kt-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: calc(var(--spacing) * 1.5);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    overflow-wrap: break-word;
    color: var(--muted-foreground);
  }
  .kt-breadcrumb-item {
    display: inline-flex;
    align-items: center;
    gap: calc(var(--spacing) * 1.5);
  }
  .kt-breadcrumb-link {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
      @media (hover: hover) {
    .kt-breadcrumb-link:hover {
        color: var(--foreground);
    }
      }
    .kt-breadcrumb-link svg {
      width: calc(var(--spacing) * 4);
      height: calc(var(--spacing) * 4);
    }
  .kt-breadcrumb-page {
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
    color: var(--foreground);
  }
    .kt-breadcrumb-separator svg {
      width: calc(var(--spacing) * 3.5);
      height: calc(var(--spacing) * 3.5);
    }
    .kt-breadcrumb-ellipsis svg {
      width: calc(var(--spacing) * 4);
      height: calc(var(--spacing) * 4);
    }
}
@layer components {
  .kt-toast-container {
    position: fixed;
    z-index: 9999;
  }
  .kt-toast {
    pointer-events: auto;
    position: fixed;
    z-index: 9999;
    width: calc(var(--spacing) * 76);
    max-width: 95%;
    overflow: hidden;
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    opacity: 0;
    animation: kt-toast-in 0.28s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    transition: top 0.28s cubic-bezier(0.4, 0, 0.2, 1),	opacity 0.28s cubic-bezier(0.4, 0, 0.2, 1);
  }
    .kt-toast.kt-toast-top-end {
      inset-inline-end: calc(var(--spacing) * 0);
      top: calc(var(--spacing) * 0);
      bottom: auto;
    }
    .kt-toast.kt-toast-top-center {
      top: calc(var(--spacing) * 0);
      bottom: auto;
      left: calc(1 / 2 * 100%);
      --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    .kt-toast.kt-toast-top-start {
      inset-inline-start: calc(var(--spacing) * 0);
      top: calc(var(--spacing) * 0);
      bottom: auto;
    }
    .kt-toast.kt-toast-middle-end {
      inset-inline-end: calc(var(--spacing) * 0);
      top: calc(1 / 2 * 100%);
      --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    .kt-toast.kt-toast-middle-center {
      top: calc(1 / 2 * 100%);
      left: calc(1 / 2 * 100%);
      --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
      --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    .kt-toast.kt-toast-middle-start {
      inset-inline-start: calc(var(--spacing) * 0);
      top: calc(1 / 2 * 100%);
      --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    .kt-toast.kt-toast-bottom-end {
      inset-inline-end: calc(var(--spacing) * 0);
      top: auto;
      bottom: calc(var(--spacing) * 0);
    }
    .kt-toast.kt-toast-bottom-center {
      top: auto;
      bottom: calc(var(--spacing) * 0);
      left: calc(1 / 2 * 100%);
      --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    .kt-toast.kt-toast-bottom-start {
      inset-inline-start: calc(var(--spacing) * 0);
      top: auto;
      bottom: calc(var(--spacing) * 0);
    }
  .kt-toast-progress {
    position: fixed;
    inset-inline-start: calc(var(--spacing) * 0);
    bottom: calc(var(--spacing) * 0);
    height: 3px;
    width: 100%;
    background-color: var(--primary);
    transform-origin: left;
    animation: kt-toast-progress-line linear forwards;
  }
}
@layer components {
  [dir='rtl'] .kt-toast-progress {
    transform-origin: right;
  }
}
@layer components {
  @keyframes kt-toast-in {
    from {
      opacity: 0;
      transform: translateY(-24px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  @keyframes kt-toast-out {
    from {
      opacity: 1;
    }
    to {
      opacity: 0;
    }
  }
  @keyframes kt-toast-progress-line {
    from {
      transform: scaleX(1);
    }
    to {
      transform: scaleX(0);
    }
  }
}
.kt-rating {
  display: flex;
  align-items: center;
}
.kt-rating-label {
  pointer-events: auto;
}
.appearance-none {
  background-image: none !important;
  box-shadow: none;
  background-color: transparent;
  border: 0;
  width: 0;
  height: 0;
}
@layer components {
  .apexcharts-text, .apexcharts-title-text, .apexcharts-legend-text {
    font-family: inherit !important;
  }
  .apexcharts-title-text {
    font-weight: var(--font-weight-normal);
  }
  .apexcharts-pie-label {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }
  .apexcharts-toolbar {
    text-align: start !important;
  }
  .apexcharts-menu {
    border: 1px solid var(--color-border) !important;
    box-shadow: var(--box-shadow-sm) !important;
    background-color: var(--color-background) !important;
    border-radius: 0.625rem !important;
    padding: 0.5rem 0 !important;
    overflow: hidden;
    min-width: 10rem !important;
  }
  .apexcharts-menu .apexcharts-menu-item {
    padding: 0.5rem 0.5rem !important;
  }
  .apexcharts-menu .apexcharts-menu-item:hover {
    background-color: var(--gray-100) !important;
  }
  .apexcharts-tooltip {
    border: 1px solid var(--color-border) !important;
    box-shadow: var(--box-shadow-sm) !important;
    background-color: var(--color-background) !important;
    border-radius: 0.625rem !important;
    color: var(--color-secondary-foreground) !important;
  }
  .apexcharts-tooltip .apexcharts-tooltip-title {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--foreground);
    padding: 0.25rem 0.5rem !important;
    background-color: transparent !important;
    border-bottom: 1px solid var(--color-border) !important;
  }
  .apexcharts-xaxistooltip {
    border: 1px solid var(--color-border) !important;
    box-shadow: var(--box-shadow-sm) !important;
    background-color: var(--color-background) !important;
    border-radius: 0.625rem;
    color: var(--color-mono);
  }
  .apexcharts-xaxistooltip:before {
    border-bottom: 0 !important;
  }
  .apexcharts-legend {
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing) * 2);
  }
  .apexcharts-legend .apexcharts-legend-series {
    gap: calc(var(--spacing) * 1);
    display: flex;
    align-items: center;
  }
  .apexcharts-legend .apexcharts-legend-series .apexcharts-legend-text {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--muted-foreground);
  }
  .apexcharts-card-rounded .apexcharts-canvas svg {
    border-bottom-left-radius: var(--radius-xl);
    border-bottom-right-radius: var(--radius-xl);
  }
  .apexcharts-rounded-sm .apexcharts-canvas svg {
    border-radius: var(--radius-sm);
  }
  .apexcharts-rounded .apexcharts-canvas svg {
    border-radius: var(--radius-md);
  }
  .apexcharts-rounded-lg .apexcharts-canvas svg {
    border-radius: var(--radius-lg);
  }
  .apexcharts-rounded-xl .apexcharts-canvas svg {
    border-radius: var(--radius-xl);
  }
}
/*! Pickr 1.9.1 MIT | https://github.com/Simonwep/pickr */
.pickr {
  position: relative;
  overflow: visible;
  transform: translateY(0);
}
.pickr * {
  box-sizing: border-box;
  outline: none;
  border: none;
  -webkit-appearance: none;
}
.pickr .pcr-button {
  position: relative;
  height: 2em;
  width: 2em;
  padding: .5em;
  cursor: pointer;
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Helvetica Neue",Arial,sans-serif;
  border-radius: .15em;
  background: url("data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 50 50\" stroke=\"%2342445A\" stroke-width=\"5px\" stroke-linecap=\"round\"><path d=\"M45,45L5,5\"></path><path d=\"M45,5L5,45\"></path></svg>") no-repeat center;
  background-size: 0;
  transition: all .3s;
}
.pickr .pcr-button::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>");
  background-size: .5em;
  border-radius: .15em;
  z-index: -1;
}
.pickr .pcr-button::before {
  z-index: initial;
}
.pickr .pcr-button::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  transition: background .3s;
  background: var(--pcr-color);
  border-radius: .15em;
}
.pickr .pcr-button.clear {
  background-size: 70%;
}
.pickr .pcr-button.clear::before {
  opacity: 0;
}
.pickr .pcr-button.clear:focus {
  box-shadow: 0 0 0 1px rgba(255,255,255,.85),0 0 0 3px var(--pcr-color);
}
.pickr .pcr-button.disabled {
  cursor: not-allowed;
}
.pickr *,.pcr-app * {
  box-sizing: border-box;
  outline: none;
  border: none;
  -webkit-appearance: none;
}
.pickr input:focus,.pickr input.pcr-active,.pickr button:focus,.pickr button.pcr-active,.pcr-app input:focus,.pcr-app input.pcr-active,.pcr-app button:focus,.pcr-app button.pcr-active {
  box-shadow: 0 0 0 1px rgba(255,255,255,.85),0 0 0 3px var(--pcr-color);
}
.pickr .pcr-palette,.pickr .pcr-slider,.pcr-app .pcr-palette,.pcr-app .pcr-slider {
  transition: box-shadow .3s;
}
.pickr .pcr-palette:focus,.pickr .pcr-slider:focus,.pcr-app .pcr-palette:focus,.pcr-app .pcr-slider:focus {
  box-shadow: 0 0 0 1px rgba(255,255,255,.85),0 0 0 3px rgba(0,0,0,.25);
}
.pcr-app {
  position: fixed;
  display: flex;
  flex-direction: column;
  z-index: 10000;
  border-radius: .1em;
  background: #fff;
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s,visibility 0s .3s;
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Helvetica Neue",Arial,sans-serif;
  box-shadow: 0 .15em 1.5em 0 rgba(0,0,0,.1),0 0 1em 0 rgba(0,0,0,.03);
  left: 0;
  top: 0;
}
.pcr-app.visible {
  transition: opacity .3s;
  visibility: visible;
  opacity: 1;
}
.pcr-app .pcr-swatches {
  display: flex;
  flex-wrap: wrap;
  margin-top: .75em;
}
.pcr-app .pcr-swatches.pcr-last {
  margin: 0;
}
@supports (display: grid) {
  .pcr-app .pcr-swatches {
    display: grid;
    align-items: center;
    grid-template-columns: repeat(auto-fit, 1.75em);
  }
}
.pcr-app .pcr-swatches>button {
  font-size: 1em;
  position: relative;
  width: calc(1.75em - 5px);
  height: calc(1.75em - 5px);
  border-radius: .15em;
  cursor: pointer;
  margin: 2.5px;
  flex-shrink: 0;
  justify-self: center;
  transition: all .15s;
  overflow: hidden;
  background: rgba(0,0,0,0);
  z-index: 1;
}
.pcr-app .pcr-swatches>button::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>");
  background-size: 6px;
  border-radius: .15em;
  z-index: -1;
}
.pcr-app .pcr-swatches>button::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--pcr-color);
  border: 1px solid rgba(0,0,0,.05);
  border-radius: .15em;
  box-sizing: border-box;
}
.pcr-app .pcr-swatches>button:hover {
  filter: brightness(1.05);
}
.pcr-app .pcr-swatches>button:not(.pcr-active) {
  box-shadow: none;
}
.pcr-app .pcr-interaction {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin: 0 -0.2em 0 -0.2em;
}
.pcr-app .pcr-interaction>* {
  margin: 0 .2em;
}
.pcr-app .pcr-interaction input {
  letter-spacing: .07em;
  font-size: .75em;
  text-align: center;
  cursor: pointer;
  color: #75797e;
  background: #f1f3f4;
  border-radius: .15em;
  transition: all .15s;
  padding: .45em .5em;
  margin-top: .75em;
}
.pcr-app .pcr-interaction input:hover {
  filter: brightness(0.975);
}
.pcr-app .pcr-interaction input:focus {
  box-shadow: 0 0 0 1px rgba(255,255,255,.85),0 0 0 3px rgba(66,133,244,.75);
}
.pcr-app .pcr-interaction .pcr-result {
  color: #75797e;
  text-align: left;
  flex: 1 1 8em;
  min-width: 8em;
  transition: all .2s;
  border-radius: .15em;
  background: #f1f3f4;
  cursor: text;
}
.pcr-app .pcr-interaction .pcr-result::-moz-selection {
  background: #4285f4;
  color: #fff;
}
.pcr-app .pcr-interaction .pcr-result::selection {
  background: #4285f4;
  color: #fff;
}
.pcr-app .pcr-interaction .pcr-type.active {
  color: #fff;
  background: #4285f4;
}
.pcr-app .pcr-interaction .pcr-save,.pcr-app .pcr-interaction .pcr-cancel,.pcr-app .pcr-interaction .pcr-clear {
  color: #fff;
  width: auto;
}
.pcr-app .pcr-interaction .pcr-save,.pcr-app .pcr-interaction .pcr-cancel,.pcr-app .pcr-interaction .pcr-clear {
  color: #fff;
}
.pcr-app .pcr-interaction .pcr-save:hover,.pcr-app .pcr-interaction .pcr-cancel:hover,.pcr-app .pcr-interaction .pcr-clear:hover {
  filter: brightness(0.925);
}
.pcr-app .pcr-interaction .pcr-save {
  background: #4285f4;
}
.pcr-app .pcr-interaction .pcr-clear,.pcr-app .pcr-interaction .pcr-cancel {
  background: #f44250;
}
.pcr-app .pcr-interaction .pcr-clear:focus,.pcr-app .pcr-interaction .pcr-cancel:focus {
  box-shadow: 0 0 0 1px rgba(255,255,255,.85),0 0 0 3px rgba(244,66,80,.75);
}
.pcr-app .pcr-selection .pcr-picker {
  position: absolute;
  height: 18px;
  width: 18px;
  border: 2px solid #fff;
  border-radius: 100%;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
.pcr-app .pcr-selection .pcr-color-palette,.pcr-app .pcr-selection .pcr-color-chooser,.pcr-app .pcr-selection .pcr-color-opacity {
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  display: flex;
  flex-direction: column;
  cursor: grab;
  cursor: -webkit-grab;
}
.pcr-app .pcr-selection .pcr-color-palette:active,.pcr-app .pcr-selection .pcr-color-chooser:active,.pcr-app .pcr-selection .pcr-color-opacity:active {
  cursor: grabbing;
  cursor: -webkit-grabbing;
}
.pcr-app[data-theme=classic] {
  width: 28.5em;
  max-width: 95vw;
  padding: .8em;
}
.pcr-app[data-theme=classic] .pcr-selection {
  display: flex;
  justify-content: space-between;
  flex-grow: 1;
}
.pcr-app[data-theme=classic] .pcr-selection .pcr-color-preview {
  position: relative;
  z-index: 1;
  width: 2em;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin-right: .75em;
}
.pcr-app[data-theme=classic] .pcr-selection .pcr-color-preview::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>");
  background-size: .5em;
  border-radius: .15em;
  z-index: -1;
}
.pcr-app[data-theme=classic] .pcr-selection .pcr-color-preview .pcr-last-color {
  cursor: pointer;
  border-radius: .15em .15em 0 0;
  z-index: 2;
}
.pcr-app[data-theme=classic] .pcr-selection .pcr-color-preview .pcr-current-color {
  border-radius: 0 0 .15em .15em;
}
.pcr-app[data-theme=classic] .pcr-selection .pcr-color-preview .pcr-last-color,.pcr-app[data-theme=classic] .pcr-selection .pcr-color-preview .pcr-current-color {
  background: var(--pcr-color);
  width: 100%;
  height: 50%;
}
.pcr-app[data-theme=classic] .pcr-selection .pcr-color-palette {
  width: 100%;
  height: 8em;
  z-index: 1;
}
.pcr-app[data-theme=classic] .pcr-selection .pcr-color-palette .pcr-palette {
  flex-grow: 1;
  border-radius: .15em;
}
.pcr-app[data-theme=classic] .pcr-selection .pcr-color-palette .pcr-palette::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>");
  background-size: .5em;
  border-radius: .15em;
  z-index: -1;
}
.pcr-app[data-theme=classic] .pcr-selection .pcr-color-chooser,.pcr-app[data-theme=classic] .pcr-selection .pcr-color-opacity {
  margin-left: .75em;
}
.pcr-app[data-theme=classic] .pcr-selection .pcr-color-chooser .pcr-picker,.pcr-app[data-theme=classic] .pcr-selection .pcr-color-opacity .pcr-picker {
  left: 50%;
  transform: translateX(-50%);
}
.pcr-app[data-theme=classic] .pcr-selection .pcr-color-chooser .pcr-slider,.pcr-app[data-theme=classic] .pcr-selection .pcr-color-opacity .pcr-slider {
  width: 8px;
  flex-grow: 1;
  border-radius: 50em;
}
.pcr-app[data-theme=classic] .pcr-selection .pcr-color-chooser .pcr-slider {
  background: linear-gradient(to bottom, hsl(0, 100%, 50%), hsl(60, 100%, 50%), hsl(120, 100%, 50%), hsl(180, 100%, 50%), hsl(240, 100%, 50%), hsl(300, 100%, 50%), hsl(0, 100%, 50%));
}
.pcr-app[data-theme=classic] .pcr-selection .pcr-color-opacity .pcr-slider {
  background: linear-gradient(to bottom, transparent, black),url("data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>");
  background-size: 100%,50%;
}
/*! Pickr 1.9.1 MIT | https://github.com/Simonwep/pickr */
.pickr {
  position: relative;
  overflow: visible;
  transform: translateY(0);
}
.pickr * {
  box-sizing: border-box;
  outline: none;
  border: none;
  -webkit-appearance: none;
}
.pickr .pcr-button {
  position: relative;
  height: 2em;
  width: 2em;
  padding: .5em;
  cursor: pointer;
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Helvetica Neue",Arial,sans-serif;
  border-radius: .15em;
  background: url("data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 50 50\" stroke=\"%2342445A\" stroke-width=\"5px\" stroke-linecap=\"round\"><path d=\"M45,45L5,5\"></path><path d=\"M45,5L5,45\"></path></svg>") no-repeat center;
  background-size: 0;
  transition: all .3s;
}
.pickr .pcr-button::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>");
  background-size: .5em;
  border-radius: .15em;
  z-index: -1;
}
.pickr .pcr-button::before {
  z-index: initial;
}
.pickr .pcr-button::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  transition: background .3s;
  background: var(--pcr-color);
  border-radius: .15em;
}
.pickr .pcr-button.clear {
  background-size: 70%;
}
.pickr .pcr-button.clear::before {
  opacity: 0;
}
.pickr .pcr-button.clear:focus {
  box-shadow: 0 0 0 1px rgba(255,255,255,.85),0 0 0 3px var(--pcr-color);
}
.pickr .pcr-button.disabled {
  cursor: not-allowed;
}
.pickr *,.pcr-app * {
  box-sizing: border-box;
  outline: none;
  border: none;
  -webkit-appearance: none;
}
.pickr input:focus,.pickr input.pcr-active,.pickr button:focus,.pickr button.pcr-active,.pcr-app input:focus,.pcr-app input.pcr-active,.pcr-app button:focus,.pcr-app button.pcr-active {
  box-shadow: 0 0 0 1px rgba(255,255,255,.85),0 0 0 3px var(--pcr-color);
}
.pickr .pcr-palette,.pickr .pcr-slider,.pcr-app .pcr-palette,.pcr-app .pcr-slider {
  transition: box-shadow .3s;
}
.pickr .pcr-palette:focus,.pickr .pcr-slider:focus,.pcr-app .pcr-palette:focus,.pcr-app .pcr-slider:focus {
  box-shadow: 0 0 0 1px rgba(255,255,255,.85),0 0 0 3px rgba(0,0,0,.25);
}
.pcr-app {
  position: fixed;
  display: flex;
  flex-direction: column;
  z-index: 10000;
  border-radius: .1em;
  background: #fff;
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s,visibility 0s .3s;
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Helvetica Neue",Arial,sans-serif;
  box-shadow: 0 .15em 1.5em 0 rgba(0,0,0,.1),0 0 1em 0 rgba(0,0,0,.03);
  left: 0;
  top: 0;
}
.pcr-app.visible {
  transition: opacity .3s;
  visibility: visible;
  opacity: 1;
}
.pcr-app .pcr-swatches {
  display: flex;
  flex-wrap: wrap;
  margin-top: .75em;
}
.pcr-app .pcr-swatches.pcr-last {
  margin: 0;
}
@supports (display: grid) {
  .pcr-app .pcr-swatches {
    display: grid;
    align-items: center;
    grid-template-columns: repeat(auto-fit, 1.75em);
  }
}
.pcr-app .pcr-swatches>button {
  font-size: 1em;
  position: relative;
  width: calc(1.75em - 5px);
  height: calc(1.75em - 5px);
  border-radius: .15em;
  cursor: pointer;
  margin: 2.5px;
  flex-shrink: 0;
  justify-self: center;
  transition: all .15s;
  overflow: hidden;
  background: rgba(0,0,0,0);
  z-index: 1;
}
.pcr-app .pcr-swatches>button::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>");
  background-size: 6px;
  border-radius: .15em;
  z-index: -1;
}
.pcr-app .pcr-swatches>button::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--pcr-color);
  border: 1px solid rgba(0,0,0,.05);
  border-radius: .15em;
  box-sizing: border-box;
}
.pcr-app .pcr-swatches>button:hover {
  filter: brightness(1.05);
}
.pcr-app .pcr-swatches>button:not(.pcr-active) {
  box-shadow: none;
}
.pcr-app .pcr-interaction {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin: 0 -0.2em 0 -0.2em;
}
.pcr-app .pcr-interaction>* {
  margin: 0 .2em;
}
.pcr-app .pcr-interaction input {
  letter-spacing: .07em;
  font-size: .75em;
  text-align: center;
  cursor: pointer;
  color: #75797e;
  background: #f1f3f4;
  border-radius: .15em;
  transition: all .15s;
  padding: .45em .5em;
  margin-top: .75em;
}
.pcr-app .pcr-interaction input:hover {
  filter: brightness(0.975);
}
.pcr-app .pcr-interaction input:focus {
  box-shadow: 0 0 0 1px rgba(255,255,255,.85),0 0 0 3px rgba(66,133,244,.75);
}
.pcr-app .pcr-interaction .pcr-result {
  color: #75797e;
  text-align: left;
  flex: 1 1 8em;
  min-width: 8em;
  transition: all .2s;
  border-radius: .15em;
  background: #f1f3f4;
  cursor: text;
}
.pcr-app .pcr-interaction .pcr-result::-moz-selection {
  background: #4285f4;
  color: #fff;
}
.pcr-app .pcr-interaction .pcr-result::selection {
  background: #4285f4;
  color: #fff;
}
.pcr-app .pcr-interaction .pcr-type.active {
  color: #fff;
  background: #4285f4;
}
.pcr-app .pcr-interaction .pcr-save,.pcr-app .pcr-interaction .pcr-cancel,.pcr-app .pcr-interaction .pcr-clear {
  color: #fff;
  width: auto;
}
.pcr-app .pcr-interaction .pcr-save,.pcr-app .pcr-interaction .pcr-cancel,.pcr-app .pcr-interaction .pcr-clear {
  color: #fff;
}
.pcr-app .pcr-interaction .pcr-save:hover,.pcr-app .pcr-interaction .pcr-cancel:hover,.pcr-app .pcr-interaction .pcr-clear:hover {
  filter: brightness(0.925);
}
.pcr-app .pcr-interaction .pcr-save {
  background: #4285f4;
}
.pcr-app .pcr-interaction .pcr-clear,.pcr-app .pcr-interaction .pcr-cancel {
  background: #f44250;
}
.pcr-app .pcr-interaction .pcr-clear:focus,.pcr-app .pcr-interaction .pcr-cancel:focus {
  box-shadow: 0 0 0 1px rgba(255,255,255,.85),0 0 0 3px rgba(244,66,80,.75);
}
.pcr-app .pcr-selection .pcr-picker {
  position: absolute;
  height: 18px;
  width: 18px;
  border: 2px solid #fff;
  border-radius: 100%;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
.pcr-app .pcr-selection .pcr-color-palette,.pcr-app .pcr-selection .pcr-color-chooser,.pcr-app .pcr-selection .pcr-color-opacity {
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  display: flex;
  flex-direction: column;
  cursor: grab;
  cursor: -webkit-grab;
}
.pcr-app .pcr-selection .pcr-color-palette:active,.pcr-app .pcr-selection .pcr-color-chooser:active,.pcr-app .pcr-selection .pcr-color-opacity:active {
  cursor: grabbing;
  cursor: -webkit-grabbing;
}
.pcr-app[data-theme=monolith] {
  width: 14.25em;
  max-width: 95vw;
  padding: .8em;
}
.pcr-app[data-theme=monolith] .pcr-selection {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex-grow: 1;
}
.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-preview {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 1em;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin-bottom: .5em;
}
.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-preview::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>");
  background-size: .5em;
  border-radius: .15em;
  z-index: -1;
}
.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-preview .pcr-last-color {
  cursor: pointer;
  transition: background-color .3s,box-shadow .3s;
  border-radius: .15em 0 0 .15em;
  z-index: 2;
}
.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-preview .pcr-current-color {
  border-radius: 0 .15em .15em 0;
}
.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-preview .pcr-last-color,.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-preview .pcr-current-color {
  background: var(--pcr-color);
  width: 50%;
  height: 100%;
}
.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-palette {
  width: 100%;
  height: 8em;
  z-index: 1;
}
.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-palette .pcr-palette {
  border-radius: .15em;
  width: 100%;
  height: 100%;
}
.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-palette .pcr-palette::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>");
  background-size: .5em;
  border-radius: .15em;
  z-index: -1;
}
.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-chooser,.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-opacity {
  height: .5em;
  margin-top: .75em;
}
.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-chooser .pcr-picker,.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-opacity .pcr-picker {
  top: 50%;
  transform: translateY(-50%);
}
.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-chooser .pcr-slider,.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-opacity .pcr-slider {
  flex-grow: 1;
  border-radius: 50em;
}
.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-chooser .pcr-slider {
  background: linear-gradient(to right, hsl(0, 100%, 50%), hsl(60, 100%, 50%), hsl(120, 100%, 50%), hsl(180, 100%, 50%), hsl(240, 100%, 50%), hsl(300, 100%, 50%), hsl(0, 100%, 50%));
}
.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-opacity .pcr-slider {
  background: linear-gradient(to right, transparent, black),url("data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>");
  background-size: 100%,.25em;
}
/*! Pickr 1.9.1 MIT | https://github.com/Simonwep/pickr */
.pickr {
  position: relative;
  overflow: visible;
  transform: translateY(0);
}
.pickr * {
  box-sizing: border-box;
  outline: none;
  border: none;
  -webkit-appearance: none;
}
.pickr .pcr-button {
  position: relative;
  height: 2em;
  width: 2em;
  padding: .5em;
  cursor: pointer;
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Helvetica Neue",Arial,sans-serif;
  border-radius: .15em;
  background: url("data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 50 50\" stroke=\"%2342445A\" stroke-width=\"5px\" stroke-linecap=\"round\"><path d=\"M45,45L5,5\"></path><path d=\"M45,5L5,45\"></path></svg>") no-repeat center;
  background-size: 0;
  transition: all .3s;
}
.pickr .pcr-button::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>");
  background-size: .5em;
  border-radius: .15em;
  z-index: -1;
}
.pickr .pcr-button::before {
  z-index: initial;
}
.pickr .pcr-button::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  transition: background .3s;
  background: var(--pcr-color);
  border-radius: .15em;
}
.pickr .pcr-button.clear {
  background-size: 70%;
}
.pickr .pcr-button.clear::before {
  opacity: 0;
}
.pickr .pcr-button.clear:focus {
  box-shadow: 0 0 0 1px rgba(255,255,255,.85),0 0 0 3px var(--pcr-color);
}
.pickr .pcr-button.disabled {
  cursor: not-allowed;
}
.pickr *,.pcr-app * {
  box-sizing: border-box;
  outline: none;
  border: none;
  -webkit-appearance: none;
}
.pickr input:focus,.pickr input.pcr-active,.pickr button:focus,.pickr button.pcr-active,.pcr-app input:focus,.pcr-app input.pcr-active,.pcr-app button:focus,.pcr-app button.pcr-active {
  box-shadow: 0 0 0 1px rgba(255,255,255,.85),0 0 0 3px var(--pcr-color);
}
.pickr .pcr-palette,.pickr .pcr-slider,.pcr-app .pcr-palette,.pcr-app .pcr-slider {
  transition: box-shadow .3s;
}
.pickr .pcr-palette:focus,.pickr .pcr-slider:focus,.pcr-app .pcr-palette:focus,.pcr-app .pcr-slider:focus {
  box-shadow: 0 0 0 1px rgba(255,255,255,.85),0 0 0 3px rgba(0,0,0,.25);
}
.pcr-app {
  position: fixed;
  display: flex;
  flex-direction: column;
  z-index: 10000;
  border-radius: .1em;
  background: #fff;
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s,visibility 0s .3s;
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Helvetica Neue",Arial,sans-serif;
  box-shadow: 0 .15em 1.5em 0 rgba(0,0,0,.1),0 0 1em 0 rgba(0,0,0,.03);
  left: 0;
  top: 0;
}
.pcr-app.visible {
  transition: opacity .3s;
  visibility: visible;
  opacity: 1;
}
.pcr-app .pcr-swatches {
  display: flex;
  flex-wrap: wrap;
  margin-top: .75em;
}
.pcr-app .pcr-swatches.pcr-last {
  margin: 0;
}
@supports (display: grid) {
  .pcr-app .pcr-swatches {
    display: grid;
    align-items: center;
    grid-template-columns: repeat(auto-fit, 1.75em);
  }
}
.pcr-app .pcr-swatches>button {
  font-size: 1em;
  position: relative;
  width: calc(1.75em - 5px);
  height: calc(1.75em - 5px);
  border-radius: .15em;
  cursor: pointer;
  margin: 2.5px;
  flex-shrink: 0;
  justify-self: center;
  transition: all .15s;
  overflow: hidden;
  background: rgba(0,0,0,0);
  z-index: 1;
}
.pcr-app .pcr-swatches>button::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>");
  background-size: 6px;
  border-radius: .15em;
  z-index: -1;
}
.pcr-app .pcr-swatches>button::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--pcr-color);
  border: 1px solid rgba(0,0,0,.05);
  border-radius: .15em;
  box-sizing: border-box;
}
.pcr-app .pcr-swatches>button:hover {
  filter: brightness(1.05);
}
.pcr-app .pcr-swatches>button:not(.pcr-active) {
  box-shadow: none;
}
.pcr-app .pcr-interaction {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin: 0 -0.2em 0 -0.2em;
}
.pcr-app .pcr-interaction>* {
  margin: 0 .2em;
}
.pcr-app .pcr-interaction input {
  letter-spacing: .07em;
  font-size: .75em;
  text-align: center;
  cursor: pointer;
  color: #75797e;
  background: #f1f3f4;
  border-radius: .15em;
  transition: all .15s;
  padding: .45em .5em;
  margin-top: .75em;
}
.pcr-app .pcr-interaction input:hover {
  filter: brightness(0.975);
}
.pcr-app .pcr-interaction input:focus {
  box-shadow: 0 0 0 1px rgba(255,255,255,.85),0 0 0 3px rgba(66,133,244,.75);
}
.pcr-app .pcr-interaction .pcr-result {
  color: #75797e;
  text-align: left;
  flex: 1 1 8em;
  min-width: 8em;
  transition: all .2s;
  border-radius: .15em;
  background: #f1f3f4;
  cursor: text;
}
.pcr-app .pcr-interaction .pcr-result::-moz-selection {
  background: #4285f4;
  color: #fff;
}
.pcr-app .pcr-interaction .pcr-result::selection {
  background: #4285f4;
  color: #fff;
}
.pcr-app .pcr-interaction .pcr-type.active {
  color: #fff;
  background: #4285f4;
}
.pcr-app .pcr-interaction .pcr-save,.pcr-app .pcr-interaction .pcr-cancel,.pcr-app .pcr-interaction .pcr-clear {
  color: #fff;
  width: auto;
}
.pcr-app .pcr-interaction .pcr-save,.pcr-app .pcr-interaction .pcr-cancel,.pcr-app .pcr-interaction .pcr-clear {
  color: #fff;
}
.pcr-app .pcr-interaction .pcr-save:hover,.pcr-app .pcr-interaction .pcr-cancel:hover,.pcr-app .pcr-interaction .pcr-clear:hover {
  filter: brightness(0.925);
}
.pcr-app .pcr-interaction .pcr-save {
  background: #4285f4;
}
.pcr-app .pcr-interaction .pcr-clear,.pcr-app .pcr-interaction .pcr-cancel {
  background: #f44250;
}
.pcr-app .pcr-interaction .pcr-clear:focus,.pcr-app .pcr-interaction .pcr-cancel:focus {
  box-shadow: 0 0 0 1px rgba(255,255,255,.85),0 0 0 3px rgba(244,66,80,.75);
}
.pcr-app .pcr-selection .pcr-picker {
  position: absolute;
  height: 18px;
  width: 18px;
  border: 2px solid #fff;
  border-radius: 100%;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
.pcr-app .pcr-selection .pcr-color-palette,.pcr-app .pcr-selection .pcr-color-chooser,.pcr-app .pcr-selection .pcr-color-opacity {
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  display: flex;
  flex-direction: column;
  cursor: grab;
  cursor: -webkit-grab;
}
.pcr-app .pcr-selection .pcr-color-palette:active,.pcr-app .pcr-selection .pcr-color-chooser:active,.pcr-app .pcr-selection .pcr-color-opacity:active {
  cursor: grabbing;
  cursor: -webkit-grabbing;
}
.pcr-app[data-theme=nano] {
  width: 14.25em;
  max-width: 95vw;
}
.pcr-app[data-theme=nano] .pcr-swatches {
  margin-top: .6em;
  padding: 0 .6em;
}
.pcr-app[data-theme=nano] .pcr-interaction {
  padding: 0 .6em .6em .6em;
}
.pcr-app[data-theme=nano] .pcr-selection {
  display: grid;
  grid-gap: .6em;
  grid-template-columns: 1fr 4fr;
  grid-template-rows: 5fr auto auto;
  align-items: center;
  height: 10.5em;
  width: 100%;
  align-self: flex-start;
}
.pcr-app[data-theme=nano] .pcr-selection .pcr-color-preview {
  grid-area: 2/1/4/1;
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin-left: .6em;
}
.pcr-app[data-theme=nano] .pcr-selection .pcr-color-preview .pcr-last-color {
  display: none;
}
.pcr-app[data-theme=nano] .pcr-selection .pcr-color-preview .pcr-current-color {
  position: relative;
  background: var(--pcr-color);
  width: 2em;
  height: 2em;
  border-radius: 50em;
  overflow: hidden;
}
.pcr-app[data-theme=nano] .pcr-selection .pcr-color-preview .pcr-current-color::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>");
  background-size: .5em;
  border-radius: .15em;
  z-index: -1;
}
.pcr-app[data-theme=nano] .pcr-selection .pcr-color-palette {
  grid-area: 1/1/2/3;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.pcr-app[data-theme=nano] .pcr-selection .pcr-color-palette .pcr-palette {
  border-radius: .15em;
  width: 100%;
  height: 100%;
}
.pcr-app[data-theme=nano] .pcr-selection .pcr-color-palette .pcr-palette::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>");
  background-size: .5em;
  border-radius: .15em;
  z-index: -1;
}
.pcr-app[data-theme=nano] .pcr-selection .pcr-color-chooser {
  grid-area: 2/2/2/2;
}
.pcr-app[data-theme=nano] .pcr-selection .pcr-color-opacity {
  grid-area: 3/2/3/2;
}
.pcr-app[data-theme=nano] .pcr-selection .pcr-color-chooser,.pcr-app[data-theme=nano] .pcr-selection .pcr-color-opacity {
  height: .5em;
  margin: 0 .6em;
}
.pcr-app[data-theme=nano] .pcr-selection .pcr-color-chooser .pcr-picker,.pcr-app[data-theme=nano] .pcr-selection .pcr-color-opacity .pcr-picker {
  top: 50%;
  transform: translateY(-50%);
}
.pcr-app[data-theme=nano] .pcr-selection .pcr-color-chooser .pcr-slider,.pcr-app[data-theme=nano] .pcr-selection .pcr-color-opacity .pcr-slider {
  flex-grow: 1;
  border-radius: 50em;
}
.pcr-app[data-theme=nano] .pcr-selection .pcr-color-chooser .pcr-slider {
  background: linear-gradient(to right, hsl(0, 100%, 50%), hsl(60, 100%, 50%), hsl(120, 100%, 50%), hsl(180, 100%, 50%), hsl(240, 100%, 50%), hsl(300, 100%, 50%), hsl(0, 100%, 50%));
}
.pcr-app[data-theme=nano] .pcr-selection .pcr-color-opacity .pcr-slider {
  background: linear-gradient(to right, transparent, black),url("data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>");
  background-size: 100%,.25em;
}
:root {
  --pcr-color: var(--foreground);
  --pcr-bg: var(--popover);
  --pcr-border: var(--border);
  --pcr-radius: 0.75rem;
  --pcr-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  --pcr-preview-radius: 0.5rem;
  --pcr-slider-radius: 0.25rem;
  --pcr-slider-bg: var(--border);
  --pcr-slider-thumb-bg: var(--popover);
  --pcr-slider-thumb-border: var(--border);
  --pcr-slider-thumb-size: 0.875rem;
  --pcr-input-bg: var(--popover);
  --pcr-input-text: var(--foreground);
  --pcr-input-border: var(--border);
  --pcr-input-radius: 0.375rem;
  --pcr-input-focus-border: var(--primary);
  --pcr-btn-bg: var(--primary);
  --pcr-btn-text: var(--primary-foreground);
  --pcr-btn-hover-bg: var(--primary);
  --pcr-btn-radius: 0.375rem;
}
.pcr-app {
  background-color: var(--pcr-bg);
  border: 1px solid var(--pcr-border);
  border-radius: var(--pcr-radius);
  box-shadow: var(--pcr-shadow);
  color: var(--pcr-color);
  --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  z-index: 1050;
}
.dark .pcr-app {
  --pcr-bg: var(--popover);
  --pcr-color: var(--foreground);
  --pcr-border: var(--border);
}
.pcr-app[data-kt-color-picker-input] {
  --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  z-index: 100;
}
.pcr-app .pcr-interaction {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  flex-wrap: nowrap;
}
.pcr-app .pcr-interaction button, .pcr-app .pcr-interaction input[type="button"], .pcr-app .pcr-interaction .pcr-save, .pcr-app .pcr-interaction .pcr-clear, .pcr-app .pcr-interaction .pcr-cancel {
  margin-left: 0;
  margin-right: 0;
}
.pcr-app .pcr-interaction input {
  background-color: var(--pcr-input-bg);
  color: var(--pcr-input-text);
  border: 1px solid var(--pcr-input-border);
  border-radius: var(--pcr-input-radius);
  padding-inline: calc(var(--spacing) * 2);
  padding-block: calc(var(--spacing) * 1);
  font-size: var(--text-sm);
  line-height: var(--tw-leading, var(--text-sm--line-height));
}
.pcr-app .pcr-interaction input.pcr-result {
  width: 80px;
  max-width: 80px;
  min-width: 80px;
}
.pcr-app .pcr-interaction input:focus {
  border-color: var(--pcr-input-focus-border);
  --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  --tw-ring-color: var(--primary);
  --tw-ring-offset-width: 1px;
  --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-outline-style: none;
  outline-style: none;
}
.pcr-button, .pickr .pcr-button, .pickr button.pcr-button, .pcr-app .pcr-button, .pcr-app button.pcr-button {
  width: 28px;
  height: 28px;
  min-width: 28px;
  min-height: 28px;
  border-radius: var(--pcr-btn-radius, 0.375rem);
  overflow: hidden;
  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
  transition-duration: var(--tw-duration, var(--default-transition-duration));
}
.pcr-app[class*="pcr-monolith"] {
  background-color: var(--pcr-bg);
  border: 1px solid var(--pcr-border);
  border-radius: var(--pcr-radius);
  box-shadow: var(--pcr-shadow);
  color: var(--pcr-color);
}
.pcr-app[class*="pcr-nano"] {
  background-color: var(--pcr-bg);
  border: 1px solid var(--pcr-border);
  border-radius: var(--pcr-radius);
  box-shadow: var(--pcr-shadow);
  color: var(--pcr-color);
}
.pcr-app .pcr-button:hover {
  background-color: var(--pcr-btn-hover-bg);
}
.pcr-app .pcr-slider {
  border-radius: var(--pcr-slider-radius);
  background-color: var(--pcr-slider-bg);
}
.pcr-app .pcr-slider::-webkit-slider-thumb {
  background-color: var(--pcr-slider-thumb-bg);
  border: 1px solid var(--pcr-slider-thumb-border);
  border-radius: 50%;
  width: var(--pcr-slider-thumb-size);
  height: var(--pcr-slider-thumb-size);
}
.pcr-app .pcr-slider::-moz-range-thumb {
  background-color: var(--pcr-slider-thumb-bg);
  border: 1px solid var(--pcr-slider-thumb-border);
  border-radius: 50%;
  width: var(--pcr-slider-thumb-size);
  height: var(--pcr-slider-thumb-size);
}
.kt-color-picker-preview {
  position: absolute;
  left: 0.25rem;
  top: 50%;
  transform: translateY(-50%);
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 0.375rem;
  border: 1px solid var(--border);
  background-color: #3F51B5;
  flex-shrink: 0;
  pointer-events: none;
  z-index: 1;
}
.kt-input {
  position: relative;
  display: flex;
  align-items: center;
}
.kt-input input[data-kt-color-picker-input-mode="true"], input[data-kt-color-picker-input-mode="true"] {
  position: relative;
  border-radius: var(--pcr-btn-radius, 0.375rem);
}
@layer components {
  .kt-container-fixed {
    width: 100%;
    flex-grow: 1;
    padding-inline: calc(var(--spacing) * 6);
  }
    @media (width >= 80rem) {
  .kt-container-fixed {
      margin-inline: auto;
  }
    }
    @media (width >= 80rem) {
  .kt-container-fixed {
      max-width: var(--breakpoint-xl);
  }
    }
    @media (width >= 80rem) {
  .kt-container-fixed {
      padding-inline: calc(var(--spacing) * 7.5);
  }
    }
}
@layer components {
  .kt-container-fluid {
    width: 100%;
    flex-grow: 1;
    padding-inline: calc(var(--spacing) * 6);
  }
    @media (width >= 80rem) {
  .kt-container-fluid {
      padding-inline: calc(var(--spacing) * 7.5);
  }
    }
}
/*! name: vanilla-calendar-pro v3.1.0 | url: https://github.com/uvarov-frontend/vanilla-calendar-pro */
[data-vc=calendar] {
  border-radius: .75rem;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  min-width: 272px;
  opacity: 1;
  padding: 1rem;
  position: relative;
  transition-duration: .15s;
  transition-property: opacity;
  transition-timing-function: cubic-bezier(.4,0,.2,1);
}
[data-vc=calendar] [tabindex="0"]:focus-visible,[data-vc=calendar] button:focus-visible,[data-vc=calendar]:focus-visible {
  border-radius: .5rem;
  outline-offset: -1px;
  outline-style: solid;
  outline-width: 1px;
}
[data-vc=calendar][data-vc-type=multiple] [data-vc=dates] {
  flex-grow: 0;
}
[data-vc=calendar][data-vc-calendar-hidden] {
  opacity: 0;
  pointer-events: none;
}
[data-vc=calendar][data-vc-calendar-hidden] * {
  pointer-events: none !important;
}
[data-vc=calendar][data-vc-input] {
  position: absolute;
}
[data-vc=calendar][data-vc-input][data-vc-position=bottom] {
  margin-top: .25rem;
}
[data-vc=calendar][data-vc-input][data-vc-position=top] {
  margin-top: -.25rem;
}
[data-vc=controls] {
  align-items: center;
  box-sizing: content-box;
  display: flex;
  justify-content: space-between;
  left: 0;
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 1.25rem;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 20;
}
[data-vc-arrow] {
  background-color: transparent;
  border-width: 0;
  cursor: pointer;
  display: block;
  height: 1.5rem;
  pointer-events: auto;
  position: relative;
  width: 1.5rem;
}
[data-vc-arrow]:before {
  background-position: 50%;
  background-repeat: no-repeat;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  --tw-content: "";
  content: var(--tw-content);
}
[data-vc-arrow=prev]:before {
  transform: rotate(90deg);
}
[data-vc-arrow=next]:before {
  transform: rotate(-90deg);
}
[data-vc=grid] {
  display: flex;
  flex-grow: 1;
  flex-wrap: wrap;
  gap: 1.75rem;
}
[data-vc=grid][data-vc-grid=hidden] [data-vc=column] {
  opacity: .3;
  pointer-events: none;
}
[data-vc=grid][data-vc-grid=hidden] [data-vc=column][data-vc-column=month],[data-vc=grid][data-vc-grid=hidden] [data-vc=column][data-vc-column=year] {
  opacity: 1;
  pointer-events: auto;
}
[data-vc=column] {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  min-width: 240px;
}
[data-vc=header] {
  align-items: center;
  display: flex;
  margin-bottom: .75rem;
  position: relative;
}
[data-vc-header=content] {
  align-items: center;
  display: grid;
  flex-grow: 1;
  grid-auto-columns: max-content;
  grid-auto-flow: column;
  justify-content: center;
  padding-left: 1rem;
  padding-right: 1rem;
  white-space: pre-wrap;
}
[data-vc=month],[data-vc=year] {
  background-color: transparent;
  border-radius: .25rem;
  border-width: 0;
  cursor: pointer;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.5rem;
  padding: .25rem;
}
[data-vc=month]:disabled,[data-vc=year]:disabled {
  pointer-events: none;
}
[data-vc=content],[data-vc=wrapper] {
  display: flex;
  flex-grow: 1;
}
[data-vc=content] {
  flex-direction: column;
}
[data-vc=months] {
  grid-template-columns: repeat(4,minmax(0,1fr));
}
[data-vc=months],[data-vc=years] {
  align-items: center;
  -moz-column-gap: .25rem;
  column-gap: .25rem;
  display: grid;
  flex-grow: 1;
  row-gap: 1rem;
}
[data-vc=years] {
  grid-template-columns: repeat(5,minmax(0,1fr));
}
[data-vc-months-month],[data-vc-years-year] {
  align-items: center;
  border-radius: .5rem;
  border-width: 0;
  cursor: pointer;
  display: flex;
  font-size: .75rem;
  font-weight: 600;
  height: 2.5rem;
  justify-content: center;
  line-height: 1rem;
  padding: .25rem;
  text-align: center;
  word-break: break-all;
}
[data-vc-months-month]:disabled,[data-vc-years-year]:disabled {
  pointer-events: none;
}
[data-vc-week=numbers] {
  display: flex;
  flex-direction: column;
}
[data-vc-week-numbers=title] {
  align-items: center;
  display: flex;
  font-size: .75rem;
  font-weight: 700;
  justify-content: center;
  line-height: 1rem;
  margin-bottom: .5rem;
}
[data-vc-week-numbers=content] {
  align-items: center;
  display: grid;
  grid-auto-flow: row;
  justify-items: center;
  row-gap: .25rem;
}
[data-vc-week-number] {
  align-items: center;
  background-color: transparent;
  border-style: none;
  cursor: pointer;
  display: flex;
  font-size: .75rem;
  font-weight: 600;
  justify-content: center;
  line-height: 1rem;
  margin: 0;
  min-height: 1.875rem;
  min-width: 1.875rem;
  padding: 0;
  width: 100%;
}
[data-vc=week] {
  display: grid;
  grid-template-columns: repeat(7,1fr);
  justify-items: center;
  margin-bottom: .5rem;
}
[data-vc-week-day] {
  align-items: center;
  background-color: transparent;
  border-style: none;
  display: flex;
  font-size: .75rem;
  font-weight: 700;
  justify-content: center;
  line-height: 1rem;
  margin: 0;
  min-width: 1.875rem;
  padding: 0;
  width: 100%;
}
button[data-vc-week-day] {
  cursor: pointer;
}
[data-vc=dates] {
  align-items: center;
  display: grid;
  flex-grow: 1;
  grid-template-columns: repeat(1,minmax(0,1fr));
  grid-template-rows: auto;
  justify-items: center;
  pointer-events: none;
}
[data-vc=dates][data-vc-dates-disabled] [data-vc-date-btn] {
  cursor: default;
}
[data-vc-dates=row] {
  align-items: center;
  display: grid;
  grid-template-columns: repeat(7,1fr);
  justify-items: center;
  width: 100%;
}
[data-vc-date] {
  align-items: center;
  display: flex;
  justify-content: center;
  padding-bottom: .125rem;
  padding-top: .125rem;
  pointer-events: auto;
  position: relative;
  width: 100%;
}
[data-vc-date]:not(:has([data-vc-date-btn])),[data-vc-date][data-vc-date-disabled],[data-vc-date][data-vc-date-disabled] [data-vc-date-btn] {
  pointer-events: none;
}
[data-vc-date][data-vc-date-hover] [data-vc-date-btn] {
  border-radius: 0;
}
[data-vc-date][data-vc-date-hover=first] [data-vc-date-btn] {
  border-bottom-left-radius: .5rem;
  border-bottom-right-radius: 0;
  border-top-left-radius: .5rem;
  border-top-right-radius: 0;
}
[data-vc-date][data-vc-date-hover=last] [data-vc-date-btn] {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: .5rem;
  border-top-left-radius: 0;
  border-top-right-radius: .5rem;
}
[data-vc-date][data-vc-date-hover=first-and-last] [data-vc-date-btn] {
  border-radius: .5rem;
}
[data-vc-date][data-vc-date-hover=first][data-vc-date-selected] [data-vc-date-btn] {
  border-bottom-left-radius: .5rem;
  border-top-left-radius: .5rem;
}
[data-vc-date][data-vc-date-hover=last][data-vc-date-selected] [data-vc-date-btn] {
  border-bottom-right-radius: .5rem;
  border-top-right-radius: .5rem;
}
[data-vc-date][data-vc-date-selected=first] [data-vc-date-btn] {
  border-bottom-left-radius: .5rem;
  border-bottom-right-radius: 0;
  border-top-left-radius: .5rem;
  border-top-right-radius: 0;
}
[data-vc-date][data-vc-date-selected=last] [data-vc-date-btn] {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: .5rem;
  border-top-left-radius: 0;
  border-top-right-radius: .5rem;
}
[data-vc-date][data-vc-date-selected=first-and-last] [data-vc-date-btn] {
  border-bottom-left-radius: .5rem;
  border-bottom-right-radius: .5rem;
  border-top-left-radius: .5rem;
  border-top-right-radius: .5rem;
}
[data-vc-date][data-vc-date-selected=middle] [data-vc-date-btn] {
  border-radius: 0;
}
[data-vc-date][data-vc-date-disabled]+[data-vc-date-hover] [data-vc-date-btn],[data-vc-date][data-vc-date-disabled]+[data-vc-date-selected] [data-vc-date-btn] {
  border-bottom-left-radius: .5rem;
  border-top-left-radius: .5rem;
}
[data-vc-date][data-vc-date-hover]:has(+[data-vc-date-disabled]) [data-vc-date-btn],[data-vc-date][data-vc-date-selected]:has(+[data-vc-date-disabled]) [data-vc-date-btn] {
  border-bottom-right-radius: .5rem;
  border-top-right-radius: .5rem;
}
[data-vc-date-btn]:focus-visible+[data-vc-date-popup],[data-vc-date-btn]:hover+[data-vc-date-popup],[data-vc-date-popup]:focus-visible,[data-vc-date-popup]:hover {
  opacity: 1;
  pointer-events: auto;
}
[data-vc-date-btn] {
  align-items: center;
  border-radius: .5rem;
  border-width: 0;
  cursor: pointer;
  display: flex;
  font-size: .75rem;
  font-weight: 400;
  height: 100%;
  justify-content: center;
  line-height: 1rem;
  min-height: 1.875rem;
  min-width: 1.875rem;
  padding: 0;
  transition-duration: 75ms;
  transition-property: all;
  transition-timing-function: cubic-bezier(.4,0,.2,1);
  width: 100%;
}
[data-vc-date][data-vc-date-today] [data-vc-date-btn] {
  font-weight: 700;
}
[data-vc-date-popup] {
  max-width: 9rem;
  min-width: 5rem;
  pointer-events: none;
  position: absolute;
  z-index: 20;
  --tw-translate-x: -50%;
  border-radius: .5rem;
  font-size: .75rem;
  font-weight: 400;
  line-height: 1rem;
  opacity: 0;
  padding: .25rem .5rem;
  transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  transition-duration: 75ms;
  transition-property: opacity;
  transition-timing-function: cubic-bezier(.4,0,.2,1);
}
[data-vc-date-popup]:hover {
  opacity: 1;
  pointer-events: auto;
}
[data-vc-date-range-tooltip] {
  max-width: 9rem;
  pointer-events: none;
  position: absolute;
  z-index: 30;
  --tw-translate-x: -50%;
  --tw-translate-y: -100%;
  border-radius: .375rem;
  font-size: .75rem;
  font-weight: 400;
  line-height: 1rem;
  padding: .25rem .5rem;
  transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
[data-vc-date-range-tooltip=hidden] {
  opacity: 0;
}
[data-vc-date-range-tooltip=visible] {
  opacity: 1;
}
[data-vc=time] {
  border-style: solid;
  border-width: 1px 0 0;
  display: grid;
  gap: .75rem;
  grid-template-columns: auto 1fr;
  margin-top: .75rem;
  padding-top: .75rem;
}
[data-vc-time=content] {
  align-items: center;
  display: grid;
  grid-auto-flow: column;
}
[data-vc-time-input=hour] {
  margin-right: .35rem;
  position: relative;
  width: 1.75rem;
}
[data-vc-time-input=hour]:after {
  display: block;
  margin-top: calc(-50% + 1px);
  position: absolute;
  right: -5px;
  top: 50%;
  --tw-content: ":";
  content: var(--tw-content);
}
[data-vc-time-input=minute] {
  width: 1.75rem;
}
[data-vc-time-input=hour] input,[data-vc-time-input=minute] input {
  border-radius: .25rem;
  border-width: 0;
  box-sizing: border-box;
  display: block;
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.125rem;
  margin: 0;
  padding: .125rem;
  position: relative;
  text-align: center;
  width: 100%;
}
[data-vc-time-input=hour] input:focus-visible,[data-vc-time-input=minute] input:focus-visible {
  outline-style: solid;
  outline-width: 1px;
}
[data-vc-time-input=hour] input:disabled,[data-vc-time-input=minute] input:disabled {
  cursor: default;
}
[data-vc-time-input=hour] input:hover:disabled,[data-vc-time-input=minute] input:hover:disabled,[data-vc-time=keeping] {
  background-color: transparent;
}
[data-vc-time=keeping] {
  border-radius: .25rem;
  border-width: 0;
  cursor: pointer;
  font-size: .69rem;
  margin-left: 1px;
  margin-top: .25rem;
  padding: 0;
  width: 22px;
}
[data-vc-time=keeping]:focus-visible {
  outline-style: solid;
  outline-width: 1px;
}
[data-vc-time=keeping]:disabled {
  cursor: default;
}
[data-vc-time=keeping]:hover:disabled {
  background-color: transparent;
}
[data-vc-time=ranges] {
  display: grid;
  grid-auto-flow: row;
}
[data-vc-time-range] {
  font-size: 0;
  position: relative;
  z-index: 10;
}
[data-vc-time-range]:before {
  content: var(--tw-content);
  left: 0;
}
[data-vc-time-range]:after {
  content: var(--tw-content);
  right: 0;
}
[data-vc-time-range]:after,[data-vc-time-range]:before {
  content: "";
  height: .5rem;
  pointer-events: none;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  z-index: 10;
}
[data-vc-time-range] input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  cursor: pointer;
  height: 1.25rem;
  margin: 0;
  outline-width: 0;
  position: relative;
  width: 100%;
}
[data-vc-time-range] input::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  border-radius: .25rem;
  border-style: solid;
  border-width: 1px;
  box-sizing: border-box;
  cursor: pointer;
  height: 1rem;
  margin-top: -.5rem;
  position: relative;
  width: .75rem;
  z-index: 20;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);
}
[data-vc-time-range] input::-moz-range-thumb {
  border-radius: .25rem;
  border-style: solid;
  border-width: 1px;
  box-sizing: border-box;
  cursor: pointer;
  height: 1rem;
  position: relative;
  width: .75rem;
  z-index: 20;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);
}
[data-vc-time-range] input::-webkit-slider-runnable-track {
  box-sizing: border-box;
  cursor: pointer;
  height: 1px;
  margin-top: 1px;
  width: 100%;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);
}
[data-vc-time-range] input::-moz-range-track {
  box-sizing: border-box;
  cursor: pointer;
  height: 1px;
  margin-top: 1px;
  width: 100%;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);
}
:root {
  --vc-calendar-bg: var(--popover);
  --vc-calendar-text: var(--foreground);
  --vc-calendar-border: var(--border);
  --vc-calendar-radius: 0.75rem;
  --vc-calendar-padding: 1rem;
  --vc-calendar-min-width: 272px;
  --vc-calendar-opacity: 1;
  --vc-calendar-transition-duration: 0.15s;
  --vc-calendar-input-margin-bottom: 0.25rem;
  --vc-calendar-input-margin-top: -0.25rem;
  --vc-calendar-hidden-opacity: 0;
  --vc-focus-color: var(--primary);
  --vc-focus-radius: 0.5rem;
  --vc-focus-offset: -1px;
  --vc-focus-width: 1px;
  --vc-controls-padding-x: 1rem;
  --vc-controls-padding-top: 1.25rem;
  --vc-controls-z-index: 20;
  --vc-arrow-size: 1rem;
  --vc-arrow-bg: transparent;
  --vc-arrow-opacity: 0.5;
  --vc-arrow-opacity-hover: 1;
  --vc-grid-gap: 1.75rem;
  --vc-grid-hidden-opacity: 0.3;
  --vc-column-min-width: 240px;
  --vc-header-margin-bottom: 0.75rem;
  --vc-header-content-padding-x: 1rem;
  --vc-header-text: var(--foreground);
  --vc-header-text-hover: var(--muted-foreground);
  --vc-header-text-disabled: var(--muted-foreground);
  --vc-header-font-size: 1rem;
  --vc-header-font-weight: 700;
  --vc-header-line-height: 1.5rem;
  --vc-header-btn-radius: 0.25rem;
  --vc-header-btn-padding: 0.25rem;
  --vc-picker-bg: var(--popover);
  --vc-picker-text: var(--muted-foreground);
  --vc-picker-bg-hover: var(--accent);
  --vc-picker-text-disabled: var(--muted-foreground);
  --vc-picker-selected-bg: var(--primary);
  --vc-picker-selected-text: var(--primary-foreground);
  --vc-picker-font-size: 0.75rem;
  --vc-picker-font-weight: 600;
  --vc-picker-line-height: 1rem;
  --vc-picker-height: 2.5rem;
  --vc-picker-radius: 0.5rem;
  --vc-picker-padding: 0.25rem;
  --vc-picker-column-gap: 0.25rem;
  --vc-picker-row-gap: 1rem;
  --vc-week-numbers-text: var(--muted-foreground);
  --vc-week-numbers-text-hover: var(--foreground);
  --vc-week-numbers-font-size: 0.75rem;
  --vc-week-numbers-font-weight: 700;
  --vc-week-numbers-line-height: 1rem;
  --vc-week-numbers-title-margin-bottom: 0.5rem;
  --vc-week-numbers-content-row-gap: 0.25rem;
  --vc-week-number-min-size: 1.875rem;
  --vc-week-number-font-weight: 600;
  --vc-weekday-text: var(--muted-foreground);
  --vc-weekday-text-hover: var(--foreground);
  --vc-weekday-off-text: var(--muted-foreground);
  --vc-weekday-off-text-hover: var(--foreground);
  --vc-weekday-font-size: 0.75rem;
  --vc-weekday-font-weight: 700;
  --vc-weekday-line-height: 1rem;
  --vc-weekday-min-width: 1.875rem;
  --vc-week-margin-bottom: 0.5rem;
  --vc-dates-disabled-cursor: default;
  --vc-date-bg: var(--popover);
  --vc-date-text: var(--foreground);
  --vc-date-bg-hover: var(--accent);
  --vc-date-text-hover: var(--foreground);
  --vc-date-font-size: 0.75rem;
  --vc-date-font-weight: 400;
  --vc-date-line-height: 1rem;
  --vc-date-min-size: 1.875rem;
  --vc-date-radius: 0.5rem;
  --vc-date-padding-y: 0.125rem;
  --vc-date-transition-duration: 75ms;
  --vc-date-transition-timing: cubic-bezier(0.4, 0, 0.2, 1);
  --vc-today-bg: var(--accent);
  --vc-today-text: var(--primary);
  --vc-today-font-weight: 700;
  --vc-selected-bg: var(--primary);
  --vc-selected-text: var(--primary-foreground);
  --vc-range-bg: var(--accent);
  --vc-range-text: var(--primary);
  --vc-hover-bg: var(--accent);
  --vc-hover-edge-bg: var(--accent);
  --vc-disabled-text: var(--muted-foreground);
  --vc-disabled-opacity: 1;
  --vc-outside-text: var(--muted-foreground);
  --vc-outside-bg: var(--popover);
  --vc-weekend-text: var(--muted-foreground);
  --vc-weekend-bg: var(--popover);
  --vc-weekend-bg-hover: var(--accent);
  --vc-weekend-selected-bg: var(--primary);
  --vc-weekend-selected-text: var(--primary-foreground);
  --vc-weekend-range-bg: var(--accent);
  --vc-weekend-range-text: var(--muted-foreground);
  --vc-weekend-outside-text: var(--muted-foreground);
  --vc-weekend-outside-bg: var(--popover);
  --vc-weekend-today-text: var(--primary);
  --vc-popup-bg: var(--popover);
  --vc-popup-text: var(--foreground);
  --vc-popup-radius: 0.5rem;
  --vc-popup-padding: 0.25rem 0.5rem;
  --vc-popup-font-size: 0.75rem;
  --vc-popup-font-weight: 400;
  --vc-popup-line-height: 1rem;
  --vc-popup-min-width: 5rem;
  --vc-popup-max-width: 9rem;
  --vc-popup-z-index: 20;
  --vc-popup-transition-duration: 75ms;
  --vc-tooltip-bg: var(--accent);
  --vc-tooltip-text: var(--muted-foreground);
  --vc-tooltip-radius: 0.375rem;
  --vc-tooltip-padding: 0.25rem 0.5rem;
  --vc-tooltip-font-size: 0.75rem;
  --vc-tooltip-font-weight: 400;
  --vc-tooltip-line-height: 1rem;
  --vc-tooltip-max-width: 9rem;
  --vc-tooltip-z-index: 30;
  --vc-time-border: var(--border);
  --vc-time-text: var(--foreground);
  --vc-time-gap: 0.75rem;
  --vc-time-margin-top: 0.75rem;
  --vc-time-padding-top: 0.75rem;
  --vc-time-input-bg: var(--popover);
  --vc-time-input-bg-hover: var(--accent);
  --vc-time-input-bg-focus: var(--accent);
  --vc-time-input-text: var(--foreground);
  --vc-time-input-font-size: 1rem;
  --vc-time-input-font-weight: 500;
  --vc-time-input-line-height: 1.125rem;
  --vc-time-input-radius: 0.25rem;
  --vc-time-input-padding: 0.125rem;
  --vc-time-input-width: 1.75rem;
  --vc-time-hour-margin-right: 0.35rem;
  --vc-time-keeping-text: var(--muted-foreground);
  --vc-time-keeping-bg-hover: var(--accent);
  --vc-time-keeping-font-size: 0.69rem;
  --vc-time-keeping-radius: 0.25rem;
  --vc-time-keeping-width: 22px;
  --vc-time-keeping-margin-left: 1px;
  --vc-time-keeping-margin-top: 0.25rem;
  --vc-time-range-bg: var(--popover);
  --vc-time-range-track-bg: var(--border);
  --vc-time-range-thumb-bg: var(--popover);
  --vc-time-range-thumb-border: var(--border);
  --vc-time-range-thumb-border-hover: var(--muted-foreground);
  --vc-time-range-thumb-border-focus: var(--primary);
  --vc-time-range-thumb-radius: 0.25rem;
  --vc-time-range-thumb-width: 0.75rem;
  --vc-time-range-thumb-height: 1rem;
  --vc-time-range-marker-bg: var(--border);
  --vc-time-range-marker-height: 0.5rem;
  --vc-time-range-marker-width: 1px;
}
[data-vc-theme=light].vc {
  background-color: var(--vc-calendar-bg);
  color: var(--vc-calendar-text);
}
[data-vc-theme=light].vc[data-vc=calendar] {
  background-color: var(--vc-calendar-bg);
  color: var(--vc-calendar-text);
  border: 1px solid var(--vc-calendar-border);
  border-radius: var(--vc-calendar-radius);
}
[data-vc-theme=light].vc[data-vc-input] {
  --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  --tw-shadow-color: rgba(0,0,0,0.05);
}
@supports (color: color-mix(in lab, red, red)) {
[data-vc-theme=light].vc[data-vc-input] {
    --tw-shadow-color: color-mix(in oklab, rgba(0,0,0,0.05) var(--tw-shadow-alpha), transparent);
}
  }
[data-vc-theme=light].vc[data-vc-input] {
  background-color: var(--vc-calendar-bg);
  border: 1px solid var(--vc-calendar-border);
  border-radius: var(--vc-calendar-radius);
  z-index: 100;
}
[data-vc-theme=light].vc [tabindex="0"]:focus-visible, [data-vc-theme=light].vc button:focus-visible, [data-vc-theme=light].vc:focus-visible {
  outline-color: var(--vc-focus-color);
  border-radius: var(--vc-focus-radius);
  outline-offset: var(--vc-focus-offset);
  outline-width: var(--vc-focus-width);
}
[data-vc-theme=light] .vc-arrow {
  background-color: var(--vc-arrow-bg);
  opacity: var(--vc-arrow-opacity);
  transition: opacity 0.2s ease-in-out;
}
:is([data-vc-theme=light] .vc-arrow):before {
    background-size: 80%;
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+PHBhdGggZmlsbD0iIzBmMTcyYSIgZD0iTTEyIDE2Yy0uMyAwLS41LS4xLS43LS4zbC02LTZjLS40LS40LS40LTEgMC0xLjRzMS0uNCAxLjQgMGw1LjMgNS4zIDUuMy01LjNjLjQtLjQgMS0uNCAxLjQgMHMuNCAxIDAgMS40bC02IDZjLS4yLjItLjQuMy0uNy4zIi8+PC9zdmc+");
  }
:is([data-vc-theme=light] .vc-arrow):focus,:is([data-vc-theme=light] .vc-arrow):hover {
    opacity: var(--vc-arrow-opacity-hover);
  }
.dark [data-vc-theme=light] .vc-arrow {
    opacity: 1;
  }
:is(.dark [data-vc-theme=light] .vc-arrow):focus,:is(.dark [data-vc-theme=light] .vc-arrow):hover {
      opacity: 1;
    }
.dark [data-vc-theme=light] .vc-arrow:before {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTEyIDE2Yy0uMyAwLS41LS4xLS43LS4zbC02LTZjLS40LS40LS40LTEgMC0xLjRzMS0uNCAxLjQgMGw1LjMgNS4zIDUuMy01LjNjLjQtLjQgMS0uNCAxLjQgMHMuNCAxIDAgMS40bC02IDZjLS4yLjItLjQuMy0uNy4zIi8+PC9zdmc+");
}
[data-vc-theme=light] .vc-header__content, [data-vc-theme=light] .vc-month, [data-vc-theme=light] .vc-year {
  color: var(--vc-header-text);
}
[data-vc-theme=light] .vc-month:disabled, [data-vc-theme=light] .vc-year:disabled {
  color: var(--vc-header-text-disabled);
}
@media (hover:hover) and (pointer:fine) {
  [data-vc-theme=light] .vc-month:hover,	[data-vc-theme=light] .vc-year:hover {
    color: var(--vc-header-text-hover);
  }
}
[data-vc-theme=light] .vc-months__month, [data-vc-theme=light] .vc-years__year {
  background-color: var(--vc-picker-bg);
  color: var(--vc-picker-text);
}
[data-vc-theme=light] .vc-months__month:disabled, [data-vc-theme=light] .vc-years__year:disabled {
  color: var(--vc-picker-text-disabled);
}
@media (hover:hover) and (pointer:fine) {
  [data-vc-theme=light] .vc-months__month:hover,	[data-vc-theme=light] .vc-years__year:hover {
    background-color: var(--vc-picker-bg-hover);
  }
  [data-vc-theme=light] .vc-months__month:hover:disabled,	[data-vc-theme=light] .vc-years__year:hover:disabled {
    color: var(--vc-picker-text-disabled);
  }
}
[data-vc-theme=light] .vc-months__month[data-vc-months-month-selected], [data-vc-theme=light] .vc-years__year[data-vc-years-year-selected] {
  background-color: var(--vc-picker-selected-bg);
  color: var(--vc-picker-selected-text);
}
@media (hover:hover) and (pointer:fine) {
  [data-vc-theme=light] .vc-months__month[data-vc-months-month-selected]:hover,	[data-vc-theme=light] .vc-years__year[data-vc-years-year-selected]:hover {
    background-color: var(--vc-picker-selected-bg);
    color: var(--vc-picker-selected-text);
  }
}
[data-vc-theme=light] .vc-week-number, [data-vc-theme=light] .vc-week-numbers__title {
  color: var(--vc-week-numbers-text);
}
@media (hover:hover) and (pointer:fine) {
  [data-vc-theme=light] .vc-week-number:hover {
    color: var(--vc-week-numbers-text-hover);
  }
}
[data-vc-theme=light] .vc-week__day {
  color: var(--vc-weekday-text);
}
@media (hover:hover) and (pointer:fine) {
  [data-vc-theme=light] button.vc-week__day:hover {
    color: var(--vc-weekday-text-hover);
  }
}
[data-vc-theme=light] .vc-week__day[data-vc-week-day-off] {
  color: var(--vc-weekday-off-text);
}
@media (hover:hover) and (pointer:fine) {
  [data-vc-theme=light] button.vc-week__day[data-vc-week-day-off]:hover {
    color: var(--vc-weekday-off-text-hover);
  }
}
[data-vc-theme=light] .vc-date__btn {
  background-color: var(--vc-date-bg);
  color: var(--vc-date-text);
}
@media (hover:hover) and (pointer:fine) {
  [data-vc-theme=light] .vc-date__btn:hover {
    background-color: var(--vc-date-bg-hover);
  }
}
[data-vc-theme=light] .vc-date[data-vc-date-today] .vc-date__btn {
  background-color: var(--vc-today-bg);
  color: var(--vc-today-text);
}
@media (hover:hover) and (pointer:fine) {
  [data-vc-theme=light] .vc-date[data-vc-date-today] .vc-date__btn:hover {
    color: var(--vc-today-text);
  }
}
[data-vc-theme=light] .vc-date[data-vc-date-today][data-vc-date-month=next] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-today][data-vc-date-month=prev] .vc-date__btn {
  color: var(--vc-outside-text);
}
[data-vc-theme=light] .vc-date[data-vc-date-month=next] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-month=prev] .vc-date__btn {
  color: var(--vc-outside-text);
}
[data-vc-theme=light] .vc-date[data-vc-date-disabled] .vc-date__btn {
  color: var(--vc-disabled-text);
}
[data-vc-theme=light] .vc-date[data-vc-date-hover] .vc-date__btn {
  background-color: var(--vc-hover-bg);
}
[data-vc-theme=light] .vc-date[data-vc-date-hover=first] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-hover=last] .vc-date__btn {
  background-color: var(--vc-hover-edge-bg);
}
@media (hover:hover) and (pointer:fine) {
  [data-vc-theme=light] .vc-date[data-vc-date-hover=first] .vc-date__btn:hover,	[data-vc-theme=light] .vc-date[data-vc-date-hover=last] .vc-date__btn:hover {
    background-color: var(--vc-hover-edge-bg);
  }
}
[data-vc-theme=light] .vc-date[data-vc-date-holiday] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-weekend] .vc-date__btn {
  color: var(--vc-weekend-text);
}
@media (hover:hover) and (pointer:fine) {
  [data-vc-theme=light] .vc-date[data-vc-date-holiday] .vc-date__btn:hover,	[data-vc-theme=light] .vc-date[data-vc-date-weekend] .vc-date__btn:hover {
    background-color: var(--vc-weekend-bg-hover);
  }
}
[data-vc-theme=light] .vc-date[data-vc-date-holiday][data-vc-date-hover] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-weekend][data-vc-date-hover] .vc-date__btn {
  background-color: var(--vc-weekend-bg-hover);
}
[data-vc-theme=light] .vc-date[data-vc-date-holiday][data-vc-date-hover=first] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-holiday][data-vc-date-hover=last] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-weekend][data-vc-date-hover=first] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-weekend][data-vc-date-hover=last] .vc-date__btn {
  background-color: var(--vc-hover-edge-bg);
}
@media (hover:hover) and (pointer:fine) {
  [data-vc-theme=light] .vc-date[data-vc-date-holiday][data-vc-date-hover=first] .vc-date__btn:hover,	[data-vc-theme=light] .vc-date[data-vc-date-holiday][data-vc-date-hover=last] .vc-date__btn:hover,	[data-vc-theme=light] .vc-date[data-vc-date-weekend][data-vc-date-hover=first] .vc-date__btn:hover,	[data-vc-theme=light] .vc-date[data-vc-date-weekend][data-vc-date-hover=last] .vc-date__btn:hover {
    background-color: var(--vc-hover-edge-bg);
  }
}
[data-vc-theme=light] .vc-date[data-vc-date-holiday][data-vc-date-disabled] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-weekend][data-vc-date-disabled] .vc-date__btn {
  color: var(--vc-disabled-text);
}
[data-vc-theme=light] .vc-date[data-vc-date-holiday][data-vc-date-today] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-weekend][data-vc-date-today] .vc-date__btn {
  color: var(--vc-weekend-today-text);
}
[data-vc-theme=light] .vc-date[data-vc-date-holiday][data-vc-date-today][data-vc-date-disabled] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-weekend][data-vc-date-today][data-vc-date-disabled] .vc-date__btn {
  color: var(--vc-disabled-text);
}
[data-vc-theme=light] .vc-date[data-vc-date-holiday][data-vc-date-month=next] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-holiday][data-vc-date-month=prev] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-weekend][data-vc-date-month=next] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-weekend][data-vc-date-month=prev] .vc-date__btn {
  background-color: var(--vc-weekend-outside-bg);
  color: var(--vc-weekend-outside-text);
}
@media (hover:hover) and (pointer:fine) {
  [data-vc-theme=light] .vc-date[data-vc-date-holiday][data-vc-date-month=next] .vc-date__btn:hover,	[data-vc-theme=light] .vc-date[data-vc-date-holiday][data-vc-date-month=prev] .vc-date__btn:hover,	[data-vc-theme=light] .vc-date[data-vc-date-weekend][data-vc-date-month=next] .vc-date__btn:hover,	[data-vc-theme=light] .vc-date[data-vc-date-weekend][data-vc-date-month=prev] .vc-date__btn:hover {
    background-color: var(--vc-date-bg-hover);
  }
}
[data-vc-theme=light] .vc-date[data-vc-date-holiday][data-vc-date-hover][data-vc-date-month=next] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-holiday][data-vc-date-hover][data-vc-date-month=prev] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-weekend][data-vc-date-hover][data-vc-date-month=next] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-weekend][data-vc-date-hover][data-vc-date-month=prev] .vc-date__btn {
  background-color: var(--vc-hover-bg);
}
[data-vc-theme=light] .vc-date[data-vc-date-holiday][data-vc-date-today][data-vc-date-month=next] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-holiday][data-vc-date-today][data-vc-date-month=prev] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-weekend][data-vc-date-today][data-vc-date-month=next] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-weekend][data-vc-date-today][data-vc-date-month=prev] .vc-date__btn {
  color: var(--vc-outside-text);
}
[data-vc-theme=light] .vc-date[data-vc-date-holiday][data-vc-date-disabled][data-vc-date-month=next] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-holiday][data-vc-date-disabled][data-vc-date-month=prev] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-weekend][data-vc-date-disabled][data-vc-date-month=next] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-weekend][data-vc-date-disabled][data-vc-date-month=prev] .vc-date__btn {
  color: var(--vc-disabled-text);
}
[data-vc-theme=light] .vc-date[data-vc-date-holiday][data-vc-date-selected] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-weekend][data-vc-date-selected] .vc-date__btn {
  background-color: var(--vc-weekend-selected-bg);
  color: var(--vc-weekend-selected-text);
}
@media (hover:hover) and (pointer:fine) {
  [data-vc-theme=light] .vc-date[data-vc-date-holiday][data-vc-date-selected] .vc-date__btn:hover,	[data-vc-theme=light] .vc-date[data-vc-date-weekend][data-vc-date-selected] .vc-date__btn:hover {
    background-color: var(--vc-weekend-selected-bg);
    color: var(--vc-weekend-selected-text);
  }
}
[data-vc-theme=light] .vc-date[data-vc-date-holiday][data-vc-date-selected][data-vc-date-month=next] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-holiday][data-vc-date-selected][data-vc-date-month=prev] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-weekend][data-vc-date-selected][data-vc-date-month=next] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-weekend][data-vc-date-selected][data-vc-date-month=prev] .vc-date__btn {
  background-color: var(--vc-hover-edge-bg);
  color: var(--vc-outside-text);
}
@media (hover:hover) and (pointer:fine) {
  [data-vc-theme=light] .vc-date[data-vc-date-holiday][data-vc-date-selected][data-vc-date-month=next] .vc-date__btn:hover,	[data-vc-theme=light] .vc-date[data-vc-date-holiday][data-vc-date-selected][data-vc-date-month=prev] .vc-date__btn:hover,	[data-vc-theme=light] .vc-date[data-vc-date-weekend][data-vc-date-selected][data-vc-date-month=next] .vc-date__btn:hover,	[data-vc-theme=light] .vc-date[data-vc-date-weekend][data-vc-date-selected][data-vc-date-month=prev] .vc-date__btn:hover {
    background-color: var(--vc-hover-edge-bg);
    color: var(--vc-outside-text);
  }
}
[data-vc-theme=light] .vc-date[data-vc-date-selected=middle][data-vc-date-holiday][data-vc-date-selected] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-selected=middle][data-vc-date-weekend][data-vc-date-selected] .vc-date__btn {
  background-color: var(--vc-weekend-range-bg);
  color: var(--vc-weekend-range-text);
}
@media (hover:hover) and (pointer:fine) {
  [data-vc-theme=light] .vc-date[data-vc-date-selected=middle][data-vc-date-holiday][data-vc-date-selected] .vc-date__btn:hover,	[data-vc-theme=light] .vc-date[data-vc-date-selected=middle][data-vc-date-weekend][data-vc-date-selected] .vc-date__btn:hover {
    background-color: var(--vc-weekend-range-bg);
    color: var(--vc-weekend-range-text);
  }
}
[data-vc-theme=light] .vc-date[data-vc-date-selected=middle][data-vc-date-holiday][data-vc-date-month=next][data-vc-date-selected] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-selected=middle][data-vc-date-holiday][data-vc-date-month=prev][data-vc-date-selected] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-selected=middle][data-vc-date-weekend][data-vc-date-month=next][data-vc-date-selected] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-selected=middle][data-vc-date-weekend][data-vc-date-month=prev][data-vc-date-selected] .vc-date__btn {
  background-color: var(--vc-hover-edge-bg);
  color: var(--vc-outside-text);
}
@media (hover:hover) and (pointer:fine) {
  [data-vc-theme=light] .vc-date[data-vc-date-selected=middle][data-vc-date-holiday][data-vc-date-month=next][data-vc-date-selected] .vc-date__btn:hover,	[data-vc-theme=light] .vc-date[data-vc-date-selected=middle][data-vc-date-holiday][data-vc-date-month=prev][data-vc-date-selected] .vc-date__btn:hover,	[data-vc-theme=light] .vc-date[data-vc-date-selected=middle][data-vc-date-weekend][data-vc-date-month=next][data-vc-date-selected] .vc-date__btn:hover,	[data-vc-theme=light] .vc-date[data-vc-date-selected=middle][data-vc-date-weekend][data-vc-date-month=prev][data-vc-date-selected] .vc-date__btn:hover {
    background-color: var(--vc-hover-edge-bg);
    color: var(--vc-outside-text);
  }
}
[data-vc-theme=light] .vc-date[data-vc-date-selected=middle][data-vc-date-selected] .vc-date__btn {
  background-color: var(--vc-range-bg);
  color: var(--vc-range-text);
}
@media (hover:hover) and (pointer:fine) {
  [data-vc-theme=light] .vc-date[data-vc-date-selected=middle][data-vc-date-selected] .vc-date__btn:hover {
    background-color: var(--vc-range-bg);
    color: var(--vc-range-text);
  }
}
[data-vc-theme=light] .vc-date[data-vc-date-selected=middle][data-vc-date-month=next][data-vc-date-selected] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-selected=middle][data-vc-date-month=prev][data-vc-date-selected] .vc-date__btn {
  background-color: var(--vc-hover-edge-bg);
  color: var(--vc-outside-text);
}
@media (hover:hover) and (pointer:fine) {
  [data-vc-theme=light] .vc-date[data-vc-date-selected=middle][data-vc-date-month=next][data-vc-date-selected] .vc-date__btn:hover,	[data-vc-theme=light] .vc-date[data-vc-date-selected=middle][data-vc-date-month=prev][data-vc-date-selected] .vc-date__btn:hover {
    background-color: var(--vc-hover-edge-bg);
    color: var(--vc-outside-text);
  }
}
[data-vc-theme=light] .vc-date[data-vc-date-selected] .vc-date__btn {
  background-color: var(--vc-selected-bg);
  color: var(--vc-selected-text);
}
@media (hover:hover) and (pointer:fine) {
  [data-vc-theme=light] .vc-date[data-vc-date-selected] .vc-date__btn:hover {
    background-color: var(--vc-selected-bg);
    color: var(--vc-selected-text);
  }
}
[data-vc-theme=light] .vc-date[data-vc-date-selected][data-vc-date-month=next] .vc-date__btn, [data-vc-theme=light] .vc-date[data-vc-date-selected][data-vc-date-month=prev] .vc-date__btn {
  background-color: var(--vc-hover-edge-bg);
  color: var(--vc-outside-text);
}
@media (hover:hover) and (pointer:fine) {
  [data-vc-theme=light] .vc-date[data-vc-date-selected][data-vc-date-month=next] .vc-date__btn:hover,	[data-vc-theme=light] .vc-date[data-vc-date-selected][data-vc-date-month=prev] .vc-date__btn:hover {
    background-color: var(--vc-hover-edge-bg);
    color: var(--vc-outside-text);
  }
}
[data-vc-theme=light] .vc-date__popup {
  background-color: var(--vc-popup-bg);
  color: var(--vc-popup-text);
  --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  --tw-shadow-color: rgba(0,0,0,0.05);
}
@supports (color: color-mix(in lab, red, red)) {
[data-vc-theme=light] .vc-date__popup {
    --tw-shadow-color: color-mix(in oklab, rgba(0,0,0,0.05) var(--tw-shadow-alpha), transparent);
}
  }
[data-vc-theme=light] .vc-date-range-tooltip {
  background-color: var(--vc-tooltip-bg);
  color: var(--vc-tooltip-text);
  --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  --tw-shadow-color: rgba(0,0,0,0.05);
}
@supports (color: color-mix(in lab, red, red)) {
[data-vc-theme=light] .vc-date-range-tooltip {
    --tw-shadow-color: color-mix(in oklab, rgba(0,0,0,0.05) var(--tw-shadow-alpha), transparent);
}
  }
[data-vc-theme=light] .vc-time {
  border-color: var(--vc-time-border);
}
[data-vc-theme=light] .vc-time__hour:after, [data-vc-theme=light] .vc-time__minute:after {
  color: var(--vc-time-text);
}
[data-vc-theme=light] .vc-time__hour input, [data-vc-theme=light] .vc-time__minute input {
  background-color: var(--vc-time-input-bg);
  color: var(--vc-time-input-text);
}
[data-vc-theme=light] .vc-time__hour input:focus-visible, [data-vc-theme=light] .vc-time__minute input:focus-visible {
  outline-color: var(--vc-focus-color);
}
@media (hover:hover) and (pointer:fine) {
  [data-vc-theme=light] .vc-time__hour input:hover,	[data-vc-theme=light] .vc-time__minute input:hover {
    background-color: var(--vc-time-input-bg-hover);
  }
}
[data-vc-theme=light] .vc-time__hour input[data-vc-input-focus], [data-vc-theme=light] .vc-time__minute input[data-vc-input-focus] {
  background-color: var(--vc-time-input-bg-focus);
}
[data-vc-theme=light] .vc-time__keeping {
  color: var(--vc-time-keeping-text);
}
[data-vc-theme=light] .vc-time__keeping:focus-visible {
  outline-color: var(--vc-focus-color);
}
@media (hover:hover) and (pointer:fine) {
  [data-vc-theme=light] .vc-time__keeping:hover {
    background-color: var(--vc-time-keeping-bg-hover);
  }
}
[data-vc-theme=light] .vc-time__range input {
  background-color: var(--vc-time-range-bg);
}
[data-vc-theme=light] .vc-time__range:after, [data-vc-theme=light] .vc-time__range:before {
  background-color: var(--vc-time-range-marker-bg);
}
[data-vc-theme=light] .vc-time__range:hover input::-webkit-slider-thumb {
  border-color: var(--vc-time-range-thumb-border-hover);
}
[data-vc-theme=light] .vc-time__range:hover input::-moz-range-thumb {
  border-color: var(--vc-time-range-thumb-border-hover);
}
[data-vc-theme=light] .vc-time__range input:focus-visible::-webkit-slider-thumb {
  border-color: var(--vc-time-range-thumb-border-focus);
}
[data-vc-theme=light] .vc-time__range input:focus-visible::-moz-range-thumb {
  border-color: var(--vc-time-range-thumb-border-focus);
}
[data-vc-theme=light] .vc-time__range input::-webkit-slider-thumb {
  border-color: var(--vc-time-range-thumb-border);
  background-color: var(--vc-time-range-thumb-bg);
}
[data-vc-theme=light] .vc-time__range input::-moz-range-thumb {
  border-color: var(--vc-time-range-thumb-border);
  background-color: var(--vc-time-range-thumb-bg);
}
[data-vc-theme=light] .vc-time__range input::-webkit-slider-runnable-track {
  background-color: var(--vc-time-range-track-bg);
}
[data-vc-theme=light] .vc-time__range input::-moz-range-track {
  background-color: var(--vc-time-range-track-bg);
}
[data-vc-week-numbers=title] {
  margin-top: 0.85rem;
  --tw-leading: 0.55;
  line-height: 0.55;
}
[data-vc=month], [data-vc=year] {
  font-size: var(--text-sm);
  line-height: var(--tw-leading, var(--text-sm--line-height));
  --tw-font-weight: var(--font-weight-medium);
  font-weight: var(--font-weight-medium);
}
[data-vc-week-day] {
  font-size: var(--text-sm);
  line-height: var(--tw-leading, var(--text-sm--line-height));
  --tw-font-weight: var(--font-weight-medium);
  font-weight: var(--font-weight-medium);
}
[data-vc=date] {
  font-size: var(--text-sm);
  line-height: var(--tw-leading, var(--text-sm--line-height));
  --tw-font-weight: var(--font-weight-normal);
  font-weight: var(--font-weight-normal);
}
[data-vc=time] {
  margin: 0;
  border: 0;
}
[data-vc-time=keeping] {
  margin: 0;
}
[data-vc-time-input=hour] input, [data-vc-time-input=minute] input {
  font-size: var(--text-sm);
  line-height: var(--tw-leading, var(--text-sm--line-height));
  --tw-font-weight: var(--font-weight-medium);
  font-weight: var(--font-weight-medium);
  outline: none !important;
  border: none !important;
}
.vc-highlight-weekends {
  --vc-weekday-off-text: var(--destructive);
  --vc-weekday-off-text-hover: var(--destructive);
  --vc-weekend-text: var(--destructive);
  --vc-weekend-bg-hover: var(--destructive);
}
@supports (color: color-mix(in lab, red, red)) {
.vc-highlight-weekends {
    --vc-weekend-bg-hover: color-mix(in srgb, var(--destructive) 10%, transparent);
}
  }
.vc-highlight-weekends {
  --vc-weekend-selected-bg: var(--destructive);
  --vc-weekend-selected-text: white;
  --vc-weekend-range-bg: var(--destructive);
}
@supports (color: color-mix(in lab, red, red)) {
.vc-highlight-weekends {
    --vc-weekend-range-bg: color-mix(in srgb, var(--destructive) 70%, transparent);
}
  }
.vc-highlight-weekends {
  --vc-weekend-range-text: white;
  --vc-weekend-today-text: var(--destructive);
}
.kt-date-picker-presets {
  display: flex;
  flex-wrap: wrap;
  gap: calc(var(--spacing) * 1);
  padding: calc(var(--spacing) * 2);
  background-color: var(--vc-calendar-bg);
}
.kt-date-picker-preset-btn {
  text-align: left;
  color: var(--vc-calendar-text);
}
@media (hover: hover) {
.kt-date-picker-preset-btn:hover {
      background-color: var(--vc-date-bg-hover);
  }
    }
@media (hover: hover) {
.kt-date-picker-preset-btn:hover {
      color: var(--vc-date-text-hover);
  }
    }
.kt-date-picker-preset-btn {
  border-radius: var(--vc-date-radius);
  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
  transition-duration: var(--tw-duration, var(--default-transition-duration));
  --tw-duration: 75ms;
  transition-duration: 75ms;
}
.vc-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: calc(var(--spacing) * 2);
  margin-top: calc(var(--spacing) * 1);
  padding-top: calc(var(--spacing) * 2.5);
  border-top-style: var(--tw-border-style);
  border-top-width: 1px;
  border-color: var(--border);
}
:root {
  --dt-row-selected: 13, 110, 253;
  --dt-row-selected-text: 255, 255, 255;
  --dt-row-selected-link: 228, 228, 228;
  --dt-row-stripe: 0, 0, 0;
  --dt-row-hover: 0, 0, 0;
  --dt-column-ordering: 0, 0, 0;
  --dt-header-align-items: center;
  --dt-header-vertical-align: middle;
  --dt-html-background: white;
}
:root.dark {
  --dt-html-background: rgb(33, 37, 41);
}
table.dataTable tbody td.dt-control {
  text-align: center;
  cursor: pointer;
}
table.dataTable tbody td.dt-control:before {
  display: inline-block;
  box-sizing: border-box;
  content: "";
  border-top: 5px solid transparent;
  border-left: 10px solid rgba(0, 0, 0, 0.5);
  border-bottom: 5px solid transparent;
  border-right: 0px solid transparent;
}
table.dataTable tbody tr.dt-hasChild td.dt-control:before {
  border-top: 10px solid rgba(0, 0, 0, 0.5);
  border-left: 5px solid transparent;
  border-bottom: 0px solid transparent;
  border-right: 5px solid transparent;
}
table.dataTable tfoot:empty {
  display: none;
}
html.dark table.dataTable td.dt-control:before, :root[data-bs-theme=dark] table.dataTable td.dt-control:before, :root[data-theme=dark] table.dataTable td.dt-control:before {
  border-left-color: rgba(255, 255, 255, 0.5);
}
html.dark table.dataTable tr.dt-hasChild td.dt-control:before, :root[data-bs-theme=dark] table.dataTable tr.dt-hasChild td.dt-control:before, :root[data-theme=dark] table.dataTable tr.dt-hasChild td.dt-control:before {
  border-top-color: rgba(255, 255, 255, 0.5);
  border-left-color: transparent;
}
div.dt-scroll {
  width: 100%;
  border: 1px solid var(--border);
  border-radius: 0.375rem;
  overflow: hidden;
}
.dt-scroll-body table.dataTable tbody tr td:last-child {
  padding-right: 1rem;
}
div.dt-scroll-body thead tr, div.dt-scroll-body tfoot tr {
  height: 0;
}
div.dt-scroll-body thead tr th, div.dt-scroll-body thead tr td, div.dt-scroll-body tfoot tr th, div.dt-scroll-body tfoot tr td {
  height: 0 !important;
  padding-top: 0px !important;
  padding-bottom: 0px !important;
  border-top-width: 0px !important;
  border-bottom-width: 0px !important;
}
div.dt-scroll-body thead tr th div.dt-scroll-sizing, div.dt-scroll-body thead tr td div.dt-scroll-sizing, div.dt-scroll-body tfoot tr th div.dt-scroll-sizing, div.dt-scroll-body tfoot tr td div.dt-scroll-sizing {
  height: 0 !important;
  overflow: hidden !important;
}
table.dataTable thead > tr > th:active, table.dataTable thead > tr > td:active {
  outline: none;
}
table.dataTable thead > tr > th.dt-orderable-asc .dt-column-order, table.dataTable thead > tr > th.dt-orderable-desc .dt-column-order, table.dataTable thead > tr > th.dt-ordering-asc .dt-column-order, table.dataTable thead > tr > th.dt-ordering-desc .dt-column-order, table.dataTable thead > tr > td.dt-orderable-asc .dt-column-order, table.dataTable thead > tr > td.dt-orderable-desc .dt-column-order, table.dataTable thead > tr > td.dt-ordering-asc .dt-column-order, table.dataTable thead > tr > td.dt-ordering-desc .dt-column-order {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 0.975rem;
  height: 0.975rem;
  gap: 0.125rem;
  line-height: 1;
}
table.dataTable thead > tr > th.dt-orderable-asc .dt-column-order:before, table.dataTable thead > tr > th.dt-orderable-asc .dt-column-order:after, table.dataTable thead > tr > th.dt-orderable-desc .dt-column-order:before, table.dataTable thead > tr > th.dt-orderable-desc .dt-column-order:after, table.dataTable thead > tr > th.dt-ordering-asc .dt-column-order:before, table.dataTable thead > tr > th.dt-ordering-asc .dt-column-order:after, table.dataTable thead > tr > th.dt-ordering-desc .dt-column-order:before, table.dataTable thead > tr > th.dt-ordering-desc .dt-column-order:after, table.dataTable thead > tr > td.dt-orderable-asc .dt-column-order:before, table.dataTable thead > tr > td.dt-orderable-asc .dt-column-order:after, table.dataTable thead > tr > td.dt-orderable-desc .dt-column-order:before, table.dataTable thead > tr > td.dt-orderable-desc .dt-column-order:after, table.dataTable thead > tr > td.dt-ordering-asc .dt-column-order:before, table.dataTable thead > tr > td.dt-ordering-asc .dt-column-order:after, table.dataTable thead > tr > td.dt-ordering-desc .dt-column-order:before, table.dataTable thead > tr > td.dt-ordering-desc .dt-column-order:after {
  display: inline-block;
  content: '';
  height: 0.25rem;
  width: 0.438rem;
  left: auto;
  right: auto;
  top: auto;
  bottom: auto;
  opacity: 1;
  line-height: inherit;
  font-size: inherit;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
table.dataTable thead > tr > th.dt-orderable-asc .dt-column-order:before, table.dataTable thead > tr > th.dt-orderable-desc .dt-column-order:before, table.dataTable thead > tr > th.dt-ordering-asc .dt-column-order:before, table.dataTable thead > tr > th.dt-ordering-desc .dt-column-order:before, table.dataTable thead > tr > td.dt-orderable-asc .dt-column-order:before, table.dataTable thead > tr > td.dt-orderable-desc .dt-column-order:before, table.dataTable thead > tr > td.dt-ordering-asc .dt-column-order:before, table.dataTable thead > tr > td.dt-ordering-desc .dt-column-order:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5' fill='none'%3E%3Cpath d='M1.08333 4.83333C0.908333 4.83333 0.791667 4.775 0.675 4.65833C0.441667 4.425 0.441667 4.075 0.675 3.84167L3.59167 0.925C3.825 0.691667 4.175 0.691667 4.40833 0.925L7.325 3.84167C7.55833 4.075 7.55833 4.425 7.325 4.65833C7.09167 4.89167 6.74167 4.89167 6.50833 4.65833L4 2.15L1.49167 4.65833C1.375 4.775 1.25833 4.83333 1.08333 4.83333Z' fill='%2378829D'/%3E%3C/svg%3E");
}
table.dataTable thead > tr > th.dt-orderable-asc .dt-column-order:after, table.dataTable thead > tr > th.dt-orderable-desc .dt-column-order:after, table.dataTable thead > tr > th.dt-ordering-asc .dt-column-order:after, table.dataTable thead > tr > th.dt-ordering-desc .dt-column-order:after, table.dataTable thead > tr > td.dt-orderable-asc .dt-column-order:after, table.dataTable thead > tr > td.dt-orderable-desc .dt-column-order:after, table.dataTable thead > tr > td.dt-ordering-asc .dt-column-order:after, table.dataTable thead > tr > td.dt-ordering-desc .dt-column-order:after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5' fill='none'%3E%3Cpath d='M4 4.24984C3.825 4.24984 3.70833 4.1915 3.59167 4.07484L0.675 1.15817C0.441667 0.924838 0.441667 0.574837 0.675 0.341504C0.908333 0.108171 1.25833 0.108171 1.49167 0.341504L4 2.84984L6.50833 0.341504C6.74167 0.108171 7.09167 0.108171 7.325 0.341504C7.55833 0.574837 7.55833 0.924838 7.325 1.15817L4.40833 4.07484C4.29167 4.1915 4.175 4.24984 4 4.24984Z' fill='%2378829D'/%3E%3C/svg%3E");
}
table.dataTable thead > tr > th[aria-sort='ascending'] .dt-column-order:before, table.dataTable thead > tr > td[aria-sort='ascending'] .dt-column-order:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5' fill='none'%3E%3Cpath d='M1.08333 4.83333C0.908333 4.83333 0.791667 4.775 0.675 4.65833C0.441667 4.425 0.441667 4.075 0.675 3.84167L3.59167 0.925C3.825 0.691667 4.175 0.691667 4.40833 0.925L7.325 3.84167C7.55833 4.075 7.55833 4.425 7.325 4.65833C7.09167 4.89167 6.74167 4.89167 6.50833 4.65833L4 2.15L1.49167 4.65833C1.375 4.775 1.25833 4.83333 1.08333 4.83333Z' fill='%234B5675'/%3E%3C/svg%3E");
}
table.dataTable thead > tr > th[aria-sort='ascending'] .dt-column-order:after, table.dataTable thead > tr > td[aria-sort='ascending'] .dt-column-order:after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5' fill='none'%3E%3Cpath d='M4 4.24984C3.825 4.24984 3.70833 4.1915 3.59167 4.07484L0.675 1.15817C0.441667 0.924838 0.441667 0.574837 0.675 0.341504C0.908333 0.108171 1.25833 0.108171 1.49167 0.341504L4 2.84984L6.50833 0.341504C6.74167 0.108171 7.09167 0.108171 7.325 0.341504C7.55833 0.574837 7.55833 0.924838 7.325 1.15817L4.40833 4.07484C4.29167 4.1915 4.175 4.24984 4 4.24984Z' fill='%23C9CEDA'/%3E%3C/svg%3E");
}
table.dataTable thead > tr > th[aria-sort='descending'] .dt-column-order:before, table.dataTable thead > tr > td[aria-sort='descending'] .dt-column-order:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5' fill='none'%3E%3Cpath d='M1.08333 4.83333C0.908333 4.83333 0.791667 4.775 0.675 4.65833C0.441667 4.425 0.441667 4.075 0.675 3.84167L3.59167 0.925C3.825 0.691667 4.175 0.691667 4.40833 0.925L7.325 3.84167C7.55833 4.075 7.55833 4.425 7.325 4.65833C7.09167 4.89167 6.74167 4.89167 6.50833 4.65833L4 2.15L1.49167 4.65833C1.375 4.775 1.25833 4.83333 1.08333 4.83333Z' fill='%23C9CEDA'/%3E%3C/svg%3E");
}
table.dataTable thead > tr > th[aria-sort='descending'] .dt-column-order:after, table.dataTable thead > tr > td[aria-sort='descending'] .dt-column-order:after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5' fill='none'%3E%3Cpath d='M4 4.24984C3.825 4.24984 3.70833 4.1915 3.59167 4.07484L0.675 1.15817C0.441667 0.924838 0.441667 0.574837 0.675 0.341504C0.908333 0.108171 1.25833 0.108171 1.49167 0.341504L4 2.84984L6.50833 0.341504C6.74167 0.108171 7.09167 0.108171 7.325 0.341504C7.55833 0.574837 7.55833 0.924838 7.325 1.15817L4.40833 4.07484C4.29167 4.1915 4.175 4.24984 4 4.24984Z' fill='%234B5675'/%3E%3C/svg%3E");
}
table.dataTable thead > tr > th.dt-orderable-asc, table.dataTable thead > tr > th.dt-orderable-desc, table.dataTable thead > tr > td.dt-orderable-asc, table.dataTable thead > tr > td.dt-orderable-desc {
  cursor: pointer;
}
table.dataTable thead > tr > th.dt-orderable-asc:hover, table.dataTable thead > tr > th.dt-orderable-desc:hover, table.dataTable thead > tr > td.dt-orderable-asc:hover, table.dataTable thead > tr > td.dt-orderable-desc:hover {
  outline: 2px solid rgba(0, 0, 0, 0.05);
  outline-offset: -2px;
}
table.dataTable thead > tr > th.dt-orderable-none:not(.dt-ordering-asc, .dt-ordering-desc) .dt-column-order:empty, table.dataTable thead > tr > th.sorting_desc_disabled .dt-column-order:after, table.dataTable thead > tr > th.sorting_asc_disabled .dt-column-order:before, table.dataTable thead > tr > td.dt-orderable-none:not(.dt-ordering-asc, .dt-ordering-desc) .dt-column-order:empty, table.dataTable thead > tr > td.sorting_desc_disabled .dt-column-order:after, table.dataTable thead > tr > td.sorting_asc_disabled .dt-column-order:before {
  display: none;
}
table.dataTable thead > tr > th.dt-orderable-none .dt-column-order, table.dataTable thead > tr > td.dt-orderable-none .dt-column-order {
  display: none !important;
}
table.dataTable thead > tr > th div.dt-column-header, table.dataTable thead > tr > th div.dt-column-footer, table.dataTable thead > tr > td div.dt-column-header, table.dataTable thead > tr > td div.dt-column-footer, table.dataTable tfoot > tr > th div.dt-column-header, table.dataTable tfoot > tr > th div.dt-column-footer, table.dataTable tfoot > tr > td div.dt-column-header, table.dataTable tfoot > tr > td div.dt-column-footer {
  display: flex;
  justify-content: space-between;
  align-items: var(--dt-header-align-items);
  gap: 4px;
}
table.dataTable thead > tr > th div.dt-column-header .dt-column-title, table.dataTable thead > tr > th div.dt-column-footer .dt-column-title, table.dataTable thead > tr > td div.dt-column-header .dt-column-title, table.dataTable thead > tr > td div.dt-column-footer .dt-column-title, table.dataTable tfoot > tr > th div.dt-column-header .dt-column-title, table.dataTable tfoot > tr > th div.dt-column-footer .dt-column-title, table.dataTable tfoot > tr > td div.dt-column-header .dt-column-title, table.dataTable tfoot > tr > td div.dt-column-footer .dt-column-title {
  flex-grow: 1;
}
table.dataTable thead > tr > th div.dt-column-header .dt-column-title:empty, table.dataTable thead > tr > th div.dt-column-footer .dt-column-title:empty, table.dataTable thead > tr > td div.dt-column-header .dt-column-title:empty, table.dataTable thead > tr > td div.dt-column-footer .dt-column-title:empty, table.dataTable tfoot > tr > th div.dt-column-header .dt-column-title:empty, table.dataTable tfoot > tr > th div.dt-column-footer .dt-column-title:empty, table.dataTable tfoot > tr > td div.dt-column-header .dt-column-title:empty, table.dataTable tfoot > tr > td div.dt-column-footer .dt-column-title:empty {
  display: none;
}
div.dt-scroll-body > table.dataTable > thead > tr > th, div.dt-scroll-body > table.dataTable > thead > tr > td {
  overflow: hidden;
}
:root.dark table.dataTable thead > tr > th.dt-orderable-asc:hover, :root.dark table.dataTable thead > tr > th.dt-orderable-desc:hover, :root.dark table.dataTable thead > tr > td.dt-orderable-asc:hover, :root.dark table.dataTable thead > tr > td.dt-orderable-desc:hover, :root[data-bs-theme=dark] table.dataTable thead > tr > th.dt-orderable-asc:hover, :root[data-bs-theme=dark] table.dataTable thead > tr > th.dt-orderable-desc:hover, :root[data-bs-theme=dark] table.dataTable thead > tr > td.dt-orderable-asc:hover, :root[data-bs-theme=dark] table.dataTable thead > tr > td.dt-orderable-desc:hover {
  outline: 2px solid rgba(255, 255, 255, 0.05);
}
@layer components {
  .dataTables_wrapper, .dt-container {
    font-family: inherit !important;
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0;
    padding-right: 0;
    color: var(--foreground);
  }
  div[id$='_wrapper'] {
    width: 100% !important;
    max-width: 100% !important;
  }
  table.dataTable {
    width: 100% !important;
    max-width: 100% !important;
    table-layout: fixed;
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    border-color: var(--border) !important;
  }
  .dt-scroll .dt-scroll-head table.dataTable, .dt-scroll .dt-scroll-body table.dataTable {
    border-width: 0 !important;
  }
  table.dataTable thead th, table.dataTable thead td {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--border);
    background-color: var(--muted);
  }
    @supports (color: color-mix(in lab, red, red)) {
  table.dataTable thead th, table.dataTable thead td {
      background-color: color-mix(in oklab, var(--muted) 50%, transparent);
  }
    }
  table.dataTable thead th, table.dataTable thead td {
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 3);
    text-align: left;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--foreground);
  }
  table.dataTable tbody th, table.dataTable tbody td {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--border);
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 3);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--foreground);
  }
  table.dataTable tbody tr:hover {
    background-color: var(--accent);
  }
    @supports (color: color-mix(in lab, red, red)) {
  table.dataTable tbody tr:hover {
      background-color: color-mix(in oklab, var(--accent) 50%, transparent);
  }
    }
  .dataTables_wrapper .dataTables_length, .dt-container .dt-length {
    margin-bottom: calc(var(--spacing) * 4);
  }
  .dataTables_wrapper .dataTables_filter, .dt-container .dt-search {
    margin-bottom: calc(var(--spacing) * 0);
  }
  .dt-layout-row .dt-length, .dataTables_wrapper .dt-layout-row .dataTables_length {
    margin: calc(var(--spacing) * 0);
    padding: calc(var(--spacing) * 0);
  }
  .dataTables_wrapper .dataTables_length label, .dataTables_wrapper .dataTables_filter label, .dt-container .dt-length label, .dt-container .dt-search label {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--foreground);
  }
  .dataTables_wrapper .dataTables_length label, .dt-container .dt-length label {
    font-size: 0;
  }
  .dataTables_wrapper .dataTables_filter label, .dt-container .dt-search label {
    font-size: 0;
  }
  .dataTables_wrapper .dataTables_filter input, .dt-container .dt-search input.dt-input {
    font-size: 0.8125rem;
    display: block;
    height: calc(var(--spacing) * 8.5);
    width: calc(var(--spacing) * 48);
    max-width: 100%;
    border-radius: calc(var(--radius) - 2px);
    padding-inline: calc(var(--spacing) * 3);
    --tw-leading: var(--leading-normal);
    line-height: var(--leading-normal);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--input);
    background-color: var(--background);
    color: var(--foreground);
    --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-shadow-color: rgba(0,0,0,0.05);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .dataTables_wrapper .dataTables_filter input, .dt-container .dt-search input.dt-input {
      --tw-shadow-color: color-mix(in oklab, rgba(0,0,0,0.05) var(--tw-shadow-alpha), transparent);
  }
    }
  .dataTables_wrapper .dataTables_filter input, .dt-container .dt-search input.dt-input {
    transition-property: color,box-shadow;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
    :is(.dataTables_wrapper .dataTables_filter input,.dt-container .dt-search input.dt-input)::placeholder {
      color: var(--muted-foreground);
    }
    :is(.dataTables_wrapper .dataTables_filter input,.dt-container .dt-search input.dt-input):focus-visible {
      border-color: var(--ring);
    }
    :is(.dataTables_wrapper .dataTables_filter input,.dt-container .dt-search input.dt-input):focus-visible {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    :is(.dataTables_wrapper .dataTables_filter input,.dt-container .dt-search input.dt-input):focus-visible {
      --tw-ring-color: var(--ring);
    }
      @supports (color: color-mix(in lab, red, red)) {
    :is(.dataTables_wrapper .dataTables_filter input,.dt-container .dt-search input.dt-input):focus-visible {
        --tw-ring-color: color-mix(in oklab, var(--ring) 30%, transparent);
    }
      }
    :is(.dataTables_wrapper .dataTables_filter input,.dt-container .dt-search input.dt-input):focus-visible {
      --tw-outline-style: none;
      outline-style: none;
    }
  .dataTables_wrapper .dataTables_length select, .dt-container .dt-length select.dt-input {
    font-size: 0.75rem;
    height: calc(var(--spacing) * 7);
    width: calc(var(--spacing) * 16);
    cursor: pointer;
    appearance: none;
    border-radius: calc(var(--radius) - 2px);
    padding-inline-start: calc(var(--spacing) * 2.5);
    padding-inline-end: calc(var(--spacing) * 5);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-leading: var(--leading-normal);
    line-height: var(--leading-normal);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--input);
    background-color: var(--background);
    color: var(--foreground);
    --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-shadow-color: rgba(0,0,0,0.05);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .dataTables_wrapper .dataTables_length select, .dt-container .dt-length select.dt-input {
      --tw-shadow-color: color-mix(in oklab, rgba(0,0,0,0.05) var(--tw-shadow-alpha), transparent);
  }
    }
  .dataTables_wrapper .dataTables_length select, .dt-container .dt-length select.dt-input {
    transition-property: color,box-shadow;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
    :is(.dataTables_wrapper .dataTables_length select,.dt-container .dt-length select.dt-input):focus-visible {
      border-color: var(--ring);
    }
    :is(.dataTables_wrapper .dataTables_length select,.dt-container .dt-length select.dt-input):focus-visible {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    :is(.dataTables_wrapper .dataTables_length select,.dt-container .dt-length select.dt-input):focus-visible {
      --tw-ring-color: var(--ring);
    }
      @supports (color: color-mix(in lab, red, red)) {
    :is(.dataTables_wrapper .dataTables_length select,.dt-container .dt-length select.dt-input):focus-visible {
        --tw-ring-color: color-mix(in oklab, var(--ring) 30%, transparent);
    }
      }
    :is(.dataTables_wrapper .dataTables_length select,.dt-container .dt-length select.dt-input):focus-visible {
      --tw-outline-style: none;
      outline-style: none;
    }
  .dataTables_wrapper .dataTables_length select, .dt-container .dt-length select.dt-input {
    background-repeat: no-repeat;
    background-size: 14px 11px;
    background-position: right 0.5rem center;
    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='%239f9fa9' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3E%3C/svg%3E");
  }
  .dataTables_wrapper .dt-layout-row, .dt-container .dt-layout-row {
    margin-top: calc(var(--spacing) * 4);
    margin-bottom: calc(var(--spacing) * 4);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    column-gap: calc(var(--spacing) * 4);
    row-gap: calc(var(--spacing) * 2);
    padding-inline: calc(var(--spacing) * 4);
  }
  .dataTables_wrapper .dt-layout-row .dt-layout-start, .dt-container .dt-layout-row .dt-layout-start {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    column-gap: calc(var(--spacing) * 3);
  }
  .dataTables_wrapper .dt-layout-row .dt-layout-end, .dt-container .dt-layout-row .dt-layout-end {
    margin-left: auto;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    column-gap: calc(var(--spacing) * 2);
  }
  .dataTables_wrapper .dataTables_info, .dt-container .dt-info {
    display: inline-flex;
    align-items: center;
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    color: var(--muted-foreground);
  }
  .dataTables_wrapper .dataTables_paginate .paginate_button, .dt-container .dt-paging .dt-paging-button {
    margin-inline: calc(var(--spacing) * 0.5);
    display: inline-flex;
    height: calc(var(--spacing) * 7);
    min-width: 1.75rem;
    align-items: center;
    justify-content: center;
    border-radius: calc(var(--radius) - 2px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    background-color: var(--background);
    padding-inline: calc(var(--spacing) * 2);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--foreground);
    cursor: pointer;
    transition: background-color 0.15s, color 0.15s;
  }
  .dataTables_wrapper .dataTables_paginate .paginate_button:not(.disabled):hover, .dt-container .dt-paging .dt-paging-button:not(.disabled):hover {
    border-color: var(--border);
    background-color: var(--accent);
    color: var(--accent-foreground);
  }
  .dataTables_wrapper .dataTables_paginate .paginate_button.current, .dt-container .dt-paging .dt-paging-button.current {
    border-color: var(--primary);
    background-color: var(--primary);
    color: var(--primary-foreground);
  }
  .dataTables_wrapper .dataTables_paginate .paginate_button.disabled, .dt-container .dt-paging .dt-paging-button.disabled {
    cursor: not-allowed;
    opacity: 50%;
  }
  .dataTables_wrapper .dataTables_processing, .dt-container .dt-processing {
    display: none;
    gap: calc(var(--spacing) * 2);
    border-radius: calc(var(--radius) - 2px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--input);
    background-color: var(--background);
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 4);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--foreground);
    min-height: 3.5rem;
  }
  .dt-scroll .dt-scroll-body {
    background-color: var(--background);
  }
  .dtfh-floatingparent, .fixedHeader-floating {
    z-index: 10;
    border: 1px solid var(--border);
    border-radius: var(--radius-md, 0.375rem);
    background: var(--background);
  }
  table.dataTable thead tr th .column-filter-dropdown, table.dataTable thead tr th:has(.column-filter-dropdown) {
    overflow: visible;
  }
  table#example-column-filter thead > tr > th, table#example-column-filter thead > tr > td {
    padding-block: calc(var(--spacing) * 2);
    vertical-align: middle;
  }
  table#example-column-filter thead .dt-column-header {
    min-height: 0;
  }
  table#example-column-visibility {
    table-layout: auto !important;
  }
}
:root {
  --dz-border-color: var(--ring);
  --dz-border-color-hover: var(--primary);
  --dz-border-width: 1px;
  --dz-border-style: dashed;
  --dz-bg: var(--background);
  --dz-radius: 6px;
  --dz-padding: 20px;
  --dz-min-height: 0;
  --dz-transition-duration: 300ms;
  --dz-message-gap: 14px;
  --dz-message-icon-size: 2rem;
  --dz-message-icon-bg: var(--background);
  --dz-message-icon-border: var(--input);
  --dz-message-icon-color: var(--primary);
  --dz-message-icon-i-color: var(--primary);
  --dz-message-text-gap: 6px;
  --dz-message-title-color: var(--mono);
  --dz-message-title-size: 13px;
  --dz-message-title-line-height: 14px;
  --dz-message-desc-color: var(--foreground);
  --dz-message-desc-size: 12px;
  --dz-message-desc-line-height: 13px;
  --dz-file-item-bg: var(--background);
  --dz-file-item-border: var(--input);
  --dz-file-item-radius: 6px;
  --dz-file-item-padding: 12px;
  --dz-file-item-gap: 10px;
  --dz-file-item-icon-size: 2rem;
  --dz-file-item-icon-border: var(--input);
  --dz-file-item-icon-color: var(--foreground);
  --dz-file-item-name-color: var(--mono);
  --dz-file-item-size-color: var(--foreground);
  --dz-file-item-action-color: var(--muted-foreground);
  --dz-file-item-action-size: 18px;
  --dz-file-item-complete-color: var(--primary);
  --dz-file-item-error-color: var(--destructive);
  --dz-progress-bg: var(--ring);
  --dz-progress-bar-bg: var(--mono);
  --dz-progress-bar-success: var(--primary);
  --dz-progress-bar-error: var(--destructive);
  --dz-progress-height: 4px;
}
.file-upload .dropzone {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: var(--dz-radius);
    border: var(--dz-border-width) var(--dz-border-style) var(--dz-border-color) !important;
    background: var(--dz-bg);
    padding: var(--dz-padding);
    min-height: var(--dz-min-height) !important;
    transition: all 0.3s ease;
  }
.file-upload .dropzone.dz-drag-hover {
    border-color: var(--dz-border-color-hover) !important;
  }
.file-upload .dropzone.dz-processing .dropzone-message {
    pointer-events: none;
    opacity: 60%;
  }
.file-upload .dropzone .dropzone-message {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: var(--dz-message-gap);
  }
.file-upload .dropzone .dropzone-message-icon {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    border-radius: calc(infinity * 1px);
    width: var(--dz-message-icon-size);
    height: var(--dz-message-icon-size);
    color: var(--dz-message-icon-color);
    background-color: var(--dz-message-icon-bg);
    border: 1px solid var(--dz-message-icon-border);
  }
.file-upload .dropzone .dropzone-message-icon i {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
    color: var(--dz-message-icon-i-color);
  }
.file-upload .dropzone .dropzone-message-text {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--dz-message-text-gap);
  }
.file-upload .dropzone .dropzone-message-title {
    font-size: var(--dz-message-title-size);
    line-height: var(--dz-message-title-line-height);
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--dz-message-title-color);
  }
.file-upload .dropzone .dropzone-message-desc {
    font-size: var(--dz-message-desc-size);
    line-height: var(--dz-message-desc-line-height);
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
    color: var(--dz-message-desc-color);
  }
.file-upload .dropzone .dropzone-previews {
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }
.file-upload .dropzone .dz-preview.dz-file-preview {
    display: block;
  }
.file-upload .dropzone .dz-remove,.file-upload .dropzone .dz-cancel {
    display: none !important;
  }
.file-upload .dropzone .dz-message {
    margin: calc(var(--spacing) * 0);
    height: calc(var(--spacing) * 0);
    overflow: hidden;
    padding: calc(var(--spacing) * 0);
    --tw-leading: 1;
    line-height: 1;
  }
.file-upload .dropzone .dz-message .dz-button {
    margin: calc(var(--spacing) * 0);
    height: calc(var(--spacing) * 0);
    overflow: hidden;
    padding: calc(var(--spacing) * 0);
    --tw-leading: 1;
    line-height: 1;
  }
.file-upload .file-upload-list:not(:empty) {
    margin-top: 20px;
  }
.file-upload .file-upload-list .dropzone-previews {
    display: flex;
    flex-direction: column;
    gap: 20px;
  }
.file-upload .dropzone-file-item {
  display: flex;
  border-radius: var(--dz-file-item-radius);
  border: 1px solid var(--dz-file-item-border);
  background: var(--dz-file-item-bg);
  padding: var(--dz-file-item-padding);
  gap: var(--dz-file-item-gap);
  transition: all 0.3s ease;
}
.file-upload .dropzone-file-item-icon {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  border-radius: var(--dz-file-item-radius);
  width: var(--dz-file-item-icon-size);
  height: var(--dz-file-item-icon-size);
  border: 1px solid var(--dz-file-item-icon-border);
}
.file-upload .dropzone-file-item-icon i {
  font-size: var(--text-base);
  line-height: var(--tw-leading, var(--text-base--line-height));
  color: var(--dz-file-item-icon-color);
}
.file-upload .dropzone-file-item-icon .dropzone-file-type-icon {
  height: 22px;
  width: auto;
}
.file-upload .dropzone-file-item-content {
  display: flex;
  flex-grow: 1;
  flex-direction: column;
  justify-content: space-between;
  gap: 4px;
}
.file-upload .dropzone-file-item-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--dz-file-item-gap);
}
.file-upload .dropzone-file-item-info {
  display: flex;
  min-width: calc(var(--spacing) * 0);
  flex: 1;
  align-items: center;
  gap: var(--dz-file-item-gap);
}
.file-upload .dropzone-file-item-name {
  display: grid;
  width: 100%;
  align-items: center;
}
.file-upload .dropzone-file-item-wrapper {
  font-size: 12px;
  line-height: 12px;
  font-weight: 500;
  color: var(--dz-file-item-name-color);
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.file-upload .dropzone-file-item-size {
  flex-shrink: 0;
  font-size: 13px;
  --tw-leading: 13px;
  line-height: 13px;
  --tw-font-weight: var(--font-weight-normal);
  font-weight: var(--font-weight-normal);
  white-space: nowrap;
  color: var(--dz-file-item-size-color);
}
.file-upload .dropzone-file-item-size > strong {
  --tw-font-weight: var(--font-weight-normal);
  font-weight: var(--font-weight-normal);
}
.file-upload .dropzone-file-item-actions {
  display: flex;
  flex-shrink: 0;
  align-items: center;
}
.file-upload .dropzone-file-item-actions .kt-btn {
  flex-shrink: 0;
  height: var(--dz-file-item-action-size);
  width: var(--dz-file-item-action-size);
}
.file-upload .dropzone-file-item-actions .kt-btn i {
  font-size: var(--text-sm);
  line-height: var(--tw-leading, var(--text-sm--line-height));
  color: var(--dz-file-item-action-color);
}
.file-upload .dropzone-file-item-complete {
  display: none;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  padding: calc(var(--spacing) * 0);
  height: var(--dz-file-item-action-size);
  width: var(--dz-file-item-action-size);
}
.file-upload .dropzone-file-item-complete i {
  font-size: var(--text-sm);
  line-height: var(--tw-leading, var(--text-sm--line-height));
  color: var(--dz-file-item-complete-color);
}
.file-upload .dropzone-file-item-error {
  display: none;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  padding: calc(var(--spacing) * 0);
  height: var(--dz-file-item-action-size);
  width: var(--dz-file-item-action-size);
}
.file-upload .dropzone-file-item-error {
  cursor: help;
}
.file-upload .dropzone-file-item-error i {
  font-size: var(--text-sm);
  line-height: var(--tw-leading, var(--text-sm--line-height));
  color: var(--dz-file-item-error-color);
}
.file-upload .dropzone-file-item.dz-error .dropzone-file-item-error {
  display: flex;
}
.file-upload .dropzone-file-item-progress {
  margin-bottom: 4px;
}
.file-upload .dropzone-file-item-progress .progress {
  border-radius: 4px;
  overflow: hidden;
  height: var(--dz-progress-height);
  background-color: var(--dz-progress-bg);
}
.file-upload .dropzone-file-item-progress .progress-bar {
  height: 100%;
  transition: width 0.3s ease;
  background-color: var(--dz-progress-bar-bg);
}
.file-upload .dropzone-file-item-progress .progress-bar[data-dz-uploadprogress] {
  width: 0%;
}
.file-upload .dropzone-file-item.dz-processing .dropzone-file-item-content .dropzone-file-item-progress {
  display: block;
}
.file-upload .dropzone-file-item.dz-complete .dropzone-file-item-content .dropzone-file-item-header .dropzone-file-item-actions .dropzone-file-item-remove {
  display: none;
}
.file-upload .dropzone-file-item.dz-complete .dropzone-file-item-content .dropzone-file-item-header .dropzone-file-item-actions .dropzone-file-item-complete {
  display: flex;
}
.file-upload .dropzone-file-item.dz-complete .dropzone-file-item-content .dropzone-file-item-header .dropzone-file-item-actions .dropzone-file-item-error {
  display: none;
}
.file-upload .dropzone-file-item.dz-complete .dropzone-file-item-content .dropzone-file-item-progress .progress-bar {
  background-color: var(--dz-progress-bar-success);
}
.file-upload .dropzone-file-item.dz-error .dropzone-file-item-content .dropzone-file-item-header .dropzone-file-item-actions .dropzone-file-item-complete {
  display: none;
}
.file-upload .dropzone-file-item.dz-error .dropzone-file-item-content .dropzone-file-item-header .dropzone-file-item-actions .dropzone-file-item-error {
  display: flex;
}
.file-upload .dropzone-file-item.dz-error .dropzone-file-item-content .dropzone-file-item-progress .progress-bar {
  background-color: var(--dz-progress-bar-error);
}
@layer components {
  .fc {
    font-family: inherit !important;
    font-size: var(--text-sm, 0.875rem) !important;
    line-height: var(--text-sm--line-height, 1.5) !important;
    --fc-list-event-hover-bg-color: var(--accent);
  }
  .fc * {
    font-family: inherit;
  }
  .fc-header-toolbar {
    margin-bottom: calc(var(--spacing) * 4);
  }
  .fc-toolbar-title {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--foreground);
    font-family: inherit;
  }
  .fc-toolbar-chunk {
    display: inline-flex;
    align-items: center;
    background-color: var(--background);
    --tw-leading: 1;
    line-height: 1;
  }
  .fc-button-group {
    display: inline-flex;
    align-items: center;
  }
  .fc-button {
    display: inline-flex;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    white-space: nowrap;
    --tw-ring-offset-color: var(--background);
  }
    .fc-button:focus-visible {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    .fc-button:focus-visible {
      --tw-ring-color: var(--ring);
    }
    .fc-button:focus-visible {
      --tw-ring-offset-width: 2px;
      --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    }
    .fc-button:focus-visible {
      --tw-outline-style: none;
      outline-style: none;
    }
  .fc-button {
    transition-property: color,box-shadow;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
    .fc-button:disabled {
      pointer-events: none;
    }
    .fc-button:disabled {
      opacity: 50%;
    }
  .fc-button {
    flex-shrink: 0;
    --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-shadow-color: rgba(0,0,0,0.05);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .fc-button {
      --tw-shadow-color: color-mix(in oklab, rgba(0,0,0,0.05) var(--tw-shadow-alpha), transparent);
  }
    }
  .fc-button {
    height: calc(var(--spacing) * 8.5);
    gap: calc(var(--spacing) * 1.5);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    background-color: transparent;
    padding-inline: calc(var(--spacing) * 3);
    color: var(--accent-foreground);
    font-family: inherit;
    font-size: var(--text-2sm, 0.8125rem) !important;
    line-height: var(--text-2sm--line-height, 1.25) !important;
  }
  .fc-button-group .fc-button:not(:last-child), .fc-toolbar-chunk > .fc-button:not(:last-child) {
    border-inline-end: none !important;
  }
  .fc-button-group .fc-button:first-child, .fc-toolbar-chunk > .fc-button:first-child {
    border-start-start-radius: var(--radius-md) !important;
    border-end-start-radius: var(--radius-md) !important;
  }
  .fc-button-group .fc-button:not(:first-child) {
    border-start-start-radius: 0 !important;
    border-end-start-radius: 0 !important;
  }
  .fc-button-group .fc-button:last-child, .fc-toolbar-chunk > .fc-button:last-child {
    border-start-end-radius: var(--radius-md) !important;
    border-end-end-radius: var(--radius-md) !important;
  }
  .fc-button-group .fc-button:not(:last-child) {
    border-start-end-radius: 0 !important;
    border-end-end-radius: 0 !important;
  }
  .fc-button .fc-icon, .fc-button .fc-icon::before, .fc-button .fc-icon::after {
    font-size: 1rem !important;
    color: var(--muted-foreground) !important;
    fill: var(--muted-foreground) !important;
    position: relative !important;
  }
  .fc-today-button {
    border-radius: var(--radius-md) !important;
    border-inline-end: 1px solid var(--border) !important;
  }
  .fc-dayGridMonth-button, .fc-timeGridWeek-button, .fc-timeGridDay-button, .fc-listWeek-button, .fc-listDay-button, .fc-listMonth-button, .fc-listYear-button {
    min-width: 4rem !important;
  }
    @media (hover: hover) {
  .fc-button:hover:not(:disabled), .fc-button:focus:not(:disabled) {
      background-color: var(--accent) !important;
      color: var(--accent-foreground) !important;
  }
    }
  .fc-button:hover:not(:disabled) .fc-icon, .fc-button:hover:not(:disabled) .fc-icon::before, .fc-button:hover:not(:disabled) .fc-icon::after, .fc-button:focus:not(:disabled) .fc-icon, .fc-button:focus:not(:disabled) .fc-icon::before, .fc-button:focus:not(:disabled) .fc-icon::after {
    color: var(--accent-foreground) !important;
    fill: var(--accent-foreground) !important;
  }
  .fc-button-primary {
    background-color: transparent !important;
    color: var(--accent-foreground) !important;
    border-color: var(--border) !important;
  }
  .fc-button-primary .fc-icon, .fc-button-primary .fc-icon::before, .fc-button-primary .fc-icon::after {
    color: var(--muted-foreground) !important;
    fill: var(--muted-foreground) !important;
  }
  .fc-button:disabled {
    cursor: not-allowed;
    opacity: 50%;
  }
  .fc-button-active {
    background-color: var(--accent) !important;
    color: var(--accent-foreground) !important;
    border-color: var(--border) !important;
  }
    @media (hover: hover) {
  .fc-button-active:hover:not(:disabled) {
      background-color: var(--accent) !important;
      color: var(--accent-foreground) !important;
  }
    }
  .fc-button-active .fc-icon, .fc-button-active .fc-icon::before, .fc-button-active .fc-icon::after {
    color: var(--accent-foreground) !important;
    fill: var(--accent-foreground) !important;
  }
  .fc-theme-standard td, .fc-theme-standard th {
    border-color: var(--border) !important;
  }
  .fc-col-header-cell {
    background-color: var(--muted);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .fc-col-header-cell {
      background-color: color-mix(in oklab, var(--muted) 50%, transparent);
  }
    }
  .fc-col-header-cell {
    padding: 0.5rem !important;
  }
  .fc-col-header-cell-cushion {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--muted-foreground);
    font-family: inherit;
  }
  .fc-daygrid-day {
    background-color: var(--background);
  }
  .fc-daygrid-day-top {
    font-size: var(--text-2xs);
    line-height: var(--tw-leading, var(--text-2xs--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--foreground);
    font-family: inherit;
    padding: 0.5rem !important;
  }
  .fc-daygrid-day-number {
    font-size: var(--text-2xs);
    line-height: var(--tw-leading, var(--text-2xs--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--foreground);
    font-family: inherit;
  }
  .fc-day-today {
    background-color: var(--accent);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .fc-day-today {
      background-color: color-mix(in oklab, var(--accent) 50%, transparent);
  }
    }
  .fc-day-today .fc-daygrid-day-number {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--primary);
  }
  .fc-event:not(.fc-list-event) {
    border-radius: calc(var(--radius) - 2px);
    border-style: var(--tw-border-style);
    border-width: 0px;
    padding: 0.25rem 0.5rem !important;
    margin: 0.125rem !important;
    cursor: pointer;
  }
  .fc-event:not(.fc-list-event):hover {
    opacity: 0.9;
  }
  .fc-event-title {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: inherit;
    padding: 0 !important;
  }
  .fc-event-time {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    color: inherit;
    padding: 0 !important;
  }
  .fc-popover {
    border: 1px solid var(--border) !important;
    box-shadow: var(--box-shadow-sm) !important;
    background-color: var(--background) !important;
    border-radius: var(--radius-md) !important;
  }
  .fc-popover-header {
    background-color: var(--muted);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .fc-popover-header {
      background-color: color-mix(in oklab, var(--muted) 50%, transparent);
  }
    }
  .fc-popover-header {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--foreground);
    font-family: inherit;
    padding: 0.5rem !important;
    border-bottom: 1px solid var(--border) !important;
  }
  .fc-popover-body {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--foreground);
    font-family: inherit;
    padding: 0.5rem !important;
  }
  .fc-more-link {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--primary);
  }
      @media (hover: hover) {
    .fc-more-link:hover {
        color: var(--primary);
    }
        @supports (color: color-mix(in lab, red, red)) {
    .fc-more-link:hover {
          color: color-mix(in oklab, var(--primary) 90%, transparent);
    }
        }
      }
  .fc-more-link {
    font-family: inherit;
  }
  .fc-daygrid-event {
    border-radius: calc(var(--radius) - 2px);
  }
  .fc-timegrid-slot {
    border-color: var(--border) !important;
  }
  .fc-timegrid-slot-label {
    font-size: var(--text-2xs);
    line-height: var(--tw-leading, var(--text-2xs--line-height));
    color: var(--muted-foreground);
    font-family: inherit;
  }
  .fc-timegrid-slot-label-cushion {
    font-size: var(--text-2xs);
    line-height: var(--tw-leading, var(--text-2xs--line-height));
    color: var(--muted-foreground);
    font-family: inherit;
  }
  .fc-timegrid-axis-cushion {
    font-size: var(--text-2xs);
    line-height: var(--tw-leading, var(--text-2xs--line-height));
    color: var(--muted-foreground);
    font-family: inherit;
  }
  .fc-timegrid-col {
    border-color: var(--border) !important;
  }
  .fc-timegrid-axis-frame {
    font-size: var(--text-2xs);
    line-height: var(--tw-leading, var(--text-2xs--line-height));
    color: var(--muted-foreground);
    font-family: inherit;
  }
  .fc-list tbody tr {
    background-color: var(--background) !important;
  }
  .fc-list tbody tr:hover {
    background-color: var(--accent) !important;
  }
  .fc-list tbody tr td {
    background-color: var(--background) !important;
    color: var(--foreground) !important;
  }
  .fc-list tbody tr:hover td {
    background-color: var(--accent) !important;
    color: var(--accent-foreground) !important;
  }
  .fc-list tbody tr .fc-list-event-time {
    color: var(--muted-foreground) !important;
  }
  .fc-list tbody tr:hover .fc-list-event-time {
    color: var(--accent-foreground) !important;
  }
  .fc-list-event-title {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    font-family: inherit;
    color: var(--foreground) !important;
  }
  .fc-list tbody tr:hover .fc-list-event-title {
    color: var(--accent-foreground) !important;
  }
  .fc-list-event-time {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    font-family: inherit;
  }
  .fc-list .fc-list-event-dot {
    background-color: var(--muted-foreground) !important;
  }
  .fc-list-event-graphic {
    text-align: center !important;
  }
  .fc-list-event-dot {
    margin: 0 auto !important;
  }
  #modal_project_task .project-task-date-wrap {
    width: 14rem;
    min-width: 14rem;
    max-width: 14rem;
    flex-shrink: 0;
  }
}
@layer components {
    .leaflet-container .leaflet-pane,.leaflet-container .leaflet-top,.leaflet-container .leaflet-bottom,.leaflet-container .leaflet-control {
      z-index: 1 !important;
    }
    .leaflet-container .leaflet-popup-content-wrapper {
      border-radius: var(--radius-md);
      text-align: center;
      background-color: var(--color-popover);
    }
      :is(.leaflet-container .leaflet-popup-content-wrapper) .leaflet-popup-content {
        font-family: inherit;
        font-size: var(--text-xs);
        line-height: var(--tw-leading, var(--text-xs--line-height));
      }
}
@layer components {
  .kt-menu {
    display: flex;
  }
  .kt-menu-item, .kt-menu-link {
    padding: 0;
    margin: 0;
  }
  .kt-menu-item {
    display: flex;
    flex-direction: column;
  }
  .kt-menu-link, .kt-menu-label, .kt-menu-toggle {
    cursor: pointer;
    display: flex;
    align-items: center;
    flex-grow: 1;
  }
  .kt-menu-title {
    display: flex;
    align-items: center;
    line-height: 1;
    flex-grow: 1;
  }
  .kt-menu-icon, .kt-menu-bullet, .kt-menu-badge, .kt-menu-arrow {
    display: flex;
    align-items: center;
    flex-shrink: 0;
  }
  .kt-menu-dropdown, .kt-menu-accordion {
    padding: 0;
    margin: 0;
    display: none;
    align-items: stretch;
    flex-direction: column;
  }
    .show.kt-menu-item-dropdown > .kt-menu-dropdown,.base-popper-root > .kt-menu-container > .kt-menu-dropdown,.kt-menu-dropdown.kt-menu.show,.kt-menu-dropdown.show[data-popper-placement] {
      display: flex;
      will-change: transform;
    }
  .kt-menu-accordion {
    display: none;
    transition: height 0.3s ease;
  }
    .show:not(.kt-menu-dropdown) > .kt-menu-accordion,.transitioning:not(.kt-menu-dropdown) > .kt-menu-accordion,.kt-menu-accordion.show {
      display: flex;
    }
}
@layer components {
  .kt-menu-dropdown {
    gap: calc(var(--spacing) * 0.25);
    border-radius: calc(var(--radius) - 2px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    background-color: var(--popover);
    color: var(--popover-foreground);
    --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-shadow-color: rgba(0,0,0,0.05);
  }
    @supports (color: color-mix(in lab, red, red)) {
  .kt-menu-dropdown {
      --tw-shadow-color: color-mix(in oklab, rgba(0,0,0,0.05) var(--tw-shadow-alpha), transparent);
  }
    }
}
@layer components {
  .kt-menu-default {
    gap: calc(var(--spacing) * 0.5);
    padding-block: calc(var(--spacing) * 2);
  }
    .kt-menu-default .kt-menu-link,.kt-menu-default .kt-menu-label {
      margin-inline: calc(var(--spacing) * 2);
      border-radius: calc(var(--radius) - 2px);
      padding-inline: calc(var(--spacing) * 2);
      padding-block: calc(var(--spacing) * 2);
    }
    .kt-menu-default .kt-menu-title {
      font-size: var(--text-2sm);
      line-height: var(--tw-leading, var(--text-2sm--line-height));
      --tw-font-weight: var(--font-weight-medium);
      font-weight: var(--font-weight-medium);
    }
    .kt-menu-default .kt-menu-icon {
      margin-inline-end: calc(var(--spacing) * 2.5);
    }
      :is(.kt-menu-default .kt-menu-icon) i {
        font-size: var(--text-lg);
        line-height: var(--tw-leading, var(--text-lg--line-height));
      }
    .kt-menu-default .kt-menu-bullet {
      margin-inline-end: calc(var(--spacing) * 2.5);
    }
    .kt-menu-default .kt-menu-arrow {
      margin-inline-start: calc(var(--spacing) * 2);
    }
      :is(.kt-menu-default .kt-menu-arrow) i {
        font-size: var(--text-xs);
        line-height: var(--tw-leading, var(--text-xs--line-height));
      }
    .kt-menu-default .kt-menu-badge {
      margin-inline-start: calc(var(--spacing) * 2.5);
    }
    .kt-menu-default .kt-menu-separator {
      margin-block: calc(var(--spacing) * 2);
      border-bottom-style: var(--tw-border-style);
      border-bottom-width: 1px;
      border-color: var(--border);
    }
      :is(.kt-menu-default .kt-menu-accordion:not(.kt-menu-no-indent)) .kt-menu-item > .kt-menu-link,:is(.kt-menu-default .kt-menu-accordion:not(.kt-menu-no-indent)) .kt-menu-item > .kt-menu-label {
        margin-inline-start: calc(var(--spacing) * 5);
      }
      :is(.kt-menu-default .kt-menu-accordion:not(.kt-menu-no-indent)) .kt-menu-item > .kt-menu-accordion .kt-menu-item > .kt-menu-link,:is(.kt-menu-default .kt-menu-accordion:not(.kt-menu-no-indent)) .kt-menu-item > .kt-menu-accordion .kt-menu-item > .kt-menu-label {
        margin-inline-start: calc(var(--spacing) * 8);
      }
      :is(.kt-menu-default .kt-menu-accordion:not(.kt-menu-no-indent)) .kt-menu-item > .kt-menu-accordion .kt-menu-item > .kt-menu-accordion .kt-menu-item > .kt-menu-link,:is(.kt-menu-default .kt-menu-accordion:not(.kt-menu-no-indent)) .kt-menu-item > .kt-menu-accordion .kt-menu-item > .kt-menu-accordion .kt-menu-item > .kt-menu-label {
        margin-inline-start: calc(var(--spacing) * 11);
      }
      :is(.kt-menu-default .kt-menu-accordion:not(.kt-menu-no-indent)) .kt-menu-item > .kt-menu-accordion .kt-menu-item > .kt-menu-accordion .kt-menu-item > .kt-menu-accordion .kt-menu-item > .kt-menu-link,:is(.kt-menu-default .kt-menu-accordion:not(.kt-menu-no-indent)) .kt-menu-item > .kt-menu-accordion .kt-menu-item > .kt-menu-accordion .kt-menu-item > .kt-menu-accordion .kt-menu-item > .kt-menu-label {
        margin-inline-start: calc(var(--spacing) * 14);
      }
  .kt-menu-fit {
    padding-block: calc(var(--spacing) * 0);
  }
    .kt-menu-fit .kt-menu-link,.kt-menu-fit .kt-menu-label {
      margin-inline: calc(var(--spacing) * 0);
    }
  .kt-menu-space {
    padding-block: calc(var(--spacing) * 2);
  }
    .kt-menu-space .kt-menu-link,.kt-menu-space .kt-menu-label {
      margin-inline: calc(var(--spacing) * 2.5);
    }
}
@layer components {
      :is(.kt-menu-default .kt-menu-item) .kt-menu-title {
        color: var(--foreground);
      }
      :is(.kt-menu-default .kt-menu-item) .kt-menu-icon i {
        color: var(--muted-foreground);
      }
      :is(.kt-menu-default .kt-menu-item) .kt-menu-arrow i {
        color: var(--muted-foreground);
      }
        :is(:is(.kt-menu-default .kt-menu-item) .kt-menu-link:hover,:is(.kt-menu-default .kt-menu-item) .kt-menu-label:hover) .kt-menu-title {
          color: var(--mono);
        }
        :is(:is(.kt-menu-default .kt-menu-item) .kt-menu-link:hover,:is(.kt-menu-default .kt-menu-item) .kt-menu-label:hover) .kt-menu-icon i {
          color: var(--primary);
        }
          :is(:is(.active:is(.kt-menu-default .kt-menu-item),.show:is(.kt-menu-default .kt-menu-item),.here:is(.kt-menu-default .kt-menu-item),.focus:is(.kt-menu-default .kt-menu-item)) > .kt-menu-link,:is(.active:is(.kt-menu-default .kt-menu-item),.show:is(.kt-menu-default .kt-menu-item),.here:is(.kt-menu-default .kt-menu-item),.focus:is(.kt-menu-default .kt-menu-item)) > .kt-menu-label) .kt-menu-title {
            color: var(--mono);
          }
          :is(:is(.active:is(.kt-menu-default .kt-menu-item),.show:is(.kt-menu-default .kt-menu-item),.here:is(.kt-menu-default .kt-menu-item),.focus:is(.kt-menu-default .kt-menu-item)) > .kt-menu-link,:is(.active:is(.kt-menu-default .kt-menu-item),.show:is(.kt-menu-default .kt-menu-item),.here:is(.kt-menu-default .kt-menu-item),.focus:is(.kt-menu-default .kt-menu-item)) > .kt-menu-label) .kt-menu-icon i {
            color: var(--primary);
          }
        :is(.active:is(.kt-menu-default .kt-menu-item),.here:is(.kt-menu-default .kt-menu-item)) > .kt-menu-link,:is(.active:is(.kt-menu-default .kt-menu-item),.here:is(.kt-menu-default .kt-menu-item)) > .kt-menu-label {
          background-color: var(--accent);
        }
      :is(.kt-menu-default .kt-menu-item) > .kt-menu-link:hover,:is(.kt-menu-default .kt-menu-item) > .kt-menu-label:hover {
        background-color: var(--accent);
      }
        .disabled:is(.kt-menu-default .kt-menu-item) > .kt-menu-link,.disabled:is(.kt-menu-default .kt-menu-item) > .kt-menu-label {
          opacity: 50%;
        }
}
@layer components {
  .range {
    width: 100%;
    height: 0.5rem;
    padding: 0;
    appearance: none;
  }
    .range:focus {
      outline: 0;
    }
    .range::-moz-focus-outer {
      border: 0;
    }
    .range::-webkit-slider-thumb {
      border-radius: calc(infinity * 1px);
      border-style: var(--tw-border-style);
      border-width: 1px;
      border-color: var(--border);
      background-color: var(--primary);
      --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
      width: 1.5rem;
      height: 1.5rem;
      margin-top: -0.5rem;
      appearance: none;
      transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    }
      :is(.range::-webkit-slider-thumb):active {
        background-color: var(--primary);
      }
    .range::-moz-range-thumb {
      border-radius: calc(infinity * 1px);
      border-style: var(--tw-border-style);
      border-width: 1px;
      border-color: var(--border);
      background-color: var(--primary);
      --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
      width: 1.5rem;
      height: 1.5rem;
      margin-top: -0.5rem;
      appearance: none;
      transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    }
      :is(.range::-moz-range-thumb):active {
        background-color: var(--primary);
      }
    .range::-moz-range-track {
      background-color: var(--input);
      width: 100%;
      height: 0.5rem;
      color: transparent;
      cursor: pointer;
      border-color: transparent;
      border-radius: 0.188rem;
    }
    .range::-webkit-slider-runnable-track {
      background-color: var(--input);
      width: 100%;
      height: 0.5rem;
      color: transparent;
      cursor: pointer;
      border-color: transparent;
      border-radius: 0.188rem;
    }
    .range:disabled {
      pointer-events: none;
    }
      .range:disabled::-webkit-slider-thumb {
        background-color: var(--accent);
      }
      .range:disabled::-moz-range-thumb {
        background-color: var(--accent);
      }
}
@layer components {
  .kt-rating {
    display: inline-flex;
    align-items: stretch;
  }
    .kt-rating input {
      appearance: none;
      position: absolute;
      inset-inline-start: 9999px;
    }
      [disabled]:is(.kt-rating input) {
        display: none;
      }
  .kt-rating-on {
    color: var(--color-yellow-400);
  }
  .kt-rating-off {
    color: var(--muted-foreground);
  }
  .kt-rating-label {
    display: inline-flex !important;
    align-items: center;
  }
    .kt-rating-label .kt-rating-on {
      display: none !important;
    }
    .kt-rating-label .kt-rating-off {
      display: inline-flex !important;
    }
    :is(.kt-rating:hover label.kt-rating-label,label.kt-rating-label,label.kt-rating-label.checked,div.kt-rating-label.checked) .kt-rating-on {
      display: inline-flex !important;
    }
    :is(.kt-rating:hover label.kt-rating-label,label.kt-rating-label,label.kt-rating-label.checked,div.kt-rating-label.checked) .kt-rating-off {
      display: none !important;
    }
    :is(label.kt-rating-label:hover ~ label.kt-rating-label,.kt-rating-input:checked ~ .kt-rating-label) .kt-rating-on {
      display: none !important;
    }
    :is(label.kt-rating-label:hover ~ label.kt-rating-label,.kt-rating-input:checked ~ .kt-rating-label) .kt-rating-off {
      display: inline-flex !important;
    }
  .kt-rating-label.indeterminate {
    position: relative;
  }
    .kt-rating-label.indeterminate .kt-rating-on {
      display: inline-flex !important;
      position: absolute;
      z-index: 1;
      overflow: hidden;
      inset-inline-start: 0;
    }
    .kt-rating-label.indeterminate .kt-rating-off {
      display: inline-flex !important;
    }
  label.kt-rating-label {
    cursor: pointer;
  }
}
@layer components {
  .kt-scrollable, .kt-scrollable-y, .kt-scrollable-x, .kt-scrollable-hover, .kt-scrollable-y-hover, .kt-scrollable-x-hover, .kt-scrollable-auto, .kt-scrollable-y-auto, .kt-scrollable-x-auto {
    scrollbar-width: thin;
    scrollbar-color: transparent transparent;
    position: relative;
  }
    :is(.kt-scrollable,.kt-scrollable-y,.kt-scrollable-x,.kt-scrollable-hover,.kt-scrollable-y-hover,.kt-scrollable-x-hover,.kt-scrollable-auto,.kt-scrollable-y-auto,.kt-scrollable-x-auto)::-webkit-scrollbar {
      width: 0.35rem;
      height: 0.35rem;
    }
    :is(.kt-scrollable,.kt-scrollable-y,.kt-scrollable-x,.kt-scrollable-hover,.kt-scrollable-y-hover,.kt-scrollable-x-hover,.kt-scrollable-auto,.kt-scrollable-y-auto,.kt-scrollable-x-auto)::-webkit-scrollbar-track {
      background-color: transparent;
    }
    :is(.kt-scrollable,.kt-scrollable-y,.kt-scrollable-x,.kt-scrollable-hover,.kt-scrollable-y-hover,.kt-scrollable-x-hover,.kt-scrollable-auto,.kt-scrollable-y-auto,.kt-scrollable-x-auto)::-webkit-scrollbar-thumb {
      border-radius: 1.25rem;
    }
    :is(.kt-scrollable,.kt-scrollable-y,.kt-scrollable-x,.kt-scrollable-hover,.kt-scrollable-y-hover,.kt-scrollable-x-hover,.kt-scrollable-auto,.kt-scrollable-y-auto,.kt-scrollable-x-auto)::-webkit-scrollbar-corner {
      background-color: transparent;
    }
  .kt-scrollable, .kt-scrollable-hover {
    overflow: scroll;
  }
  .kt-scrollable-y, .kt-scrollable-y-hover {
    overflow-y: scroll;
  }
  .kt-scrollable-x, .kt-scrollable-x-hover {
    overflow-x: scroll;
  }
  .kt-scrollable-auto {
    overflow: auto;
  }
  .kt-scrollable-y-auto {
    overflow-y: auto;
  }
  .kt-scrollable-x-auto {
    overflow-x: auto;
  }
  .kt-scrollable, .kt-scrollable-y, .kt-scrollable-x, .kt-scrollable-auto, .kt-scrollable-y-auto, .kt-scrollable-x-auto, .kt-scrollable-hover:hover, .kt-scrollable-y-hover:hover, .kt-scrollable-x-hover:hover {
    scrollbar-color: var(--scrollbar-thumb-color, var(--color-input)) transparent;
  }
    :is(.kt-scrollable,.kt-scrollable-y,.kt-scrollable-x,.kt-scrollable-auto,.kt-scrollable-y-auto,.kt-scrollable-x-auto,.kt-scrollable-hover:hover,.kt-scrollable-y-hover:hover,.kt-scrollable-x-hover:hover)::-webkit-scrollbar-thumb {
      background-color: var(--scrollbar-thumb-color, var(--color-input));
    }
    :is(.kt-scrollable,.kt-scrollable-y,.kt-scrollable-x,.kt-scrollable-auto,.kt-scrollable-y-auto,.kt-scrollable-x-auto,.kt-scrollable-hover:hover,.kt-scrollable-y-hover:hover,.kt-scrollable-x-hover:hover)::-webkit-scrollbar-corner {
      background-color: transparent;
    }
  @supports (-webkit-hyphens: none) {
    .kt-scrollable, .kt-scrollable-hover {
      overflow: auto;
    }
    .kt-scrollable-y, .kt-scrollable-y-hover {
      overflow-y: auto;
    }
    .kt-scrollable-x, .kt-scrollable-x-hover {
      overflow-x: auto;
    }
  }
  @media (max-width: 64rem) {
    .kt-scrollable, .kt-scrollable-hover {
      overflow: auto;
    }
    .kt-scrollable-y, .kt-scrollable-y-hover {
      overflow-y: auto;
    }
    .kt-scrollable-x, .kt-scrollable-x-hover {
      overflow-x: auto;
    }
  }
}
@layer components {
  .demo1 {
    --sidebar-transition-duration: 0.3s;
    --sidebar-transition-timing: ease;
    --sidebar-width: 280px;
    --sidebar-width-collapse: 80px;
    --sidebar-default-width: 280px;
    --header-height: 70px;
  }
  @media (max-width: 64rem) {
    .demo1 {
      --sidebar-width: 280px;
      --header-height: 60px;
    }
  }
  .demo1 .kt-header {
    height: var(--header-height);
  }
  .demo1 .kt-sidebar {
    width: var(--sidebar-width);
  }
  .demo1.kt-header-fixed .kt-wrapper {
    padding-top: var(--header-height);
  }
  @media (min-width: 64rem) {
    .demo1 .kt-sidebar {
      width: var(--sidebar-width);
      transition: width var(--sidebar-transition-duration) var(--sidebar-transition-timing);
    }
    .demo1 .kt-sidebar .kt-sidebar-header {
      height: var(--header-height);
    }
    .demo1 .kt-sidebar .kt-sidebar-logo {
      overflow: hidden;
    }
    .demo1 .kt-sidebar .kt-sidebar-wrapper {
      width: var(--sidebar-default-width);
    }
    .demo1 .kt-sidebar .kt-sidebar-logo {
      width: var(--sidebar-default-width);
    }
    .demo1 .kt-sidebar .small-logo {
      display: none;
    }
    .demo1.kt-sidebar-fixed .kt-wrapper {
      padding-inline-start: var(--sidebar-width) !important;
    }
    .demo1.kt-sidebar-fixed.kt-header-fixed .kt-header {
      inset-inline-start: var(--sidebar-width) !important;
    }
    .demo1.kt-sidebar-fixed.kt-header-fixed .kt-wrapper {
      padding-top: var(--header-height);
    }
    .demo1.kt-sidebar-collapse {
      --sidebar-width: var(--sidebar-width-collapse);
    }
    .demo1.kt-sidebar-collapse .kt-sidebar {
      transition: width var(--sidebar-transition-duration) var(--sidebar-transition-timing);
    }
    .demo1.kt-sidebar-collapse .kt-sidebar.animating {
      pointer-events: none;
    }
    .demo1.kt-sidebar-collapse .kt-sidebar:hover:not(.animating) {
      width: var(--sidebar-default-width);
      transition: width var(--sidebar-transition-duration) var(--sidebar-transition-timing);
    }
    .demo1.kt-sidebar-collapse .kt-sidebar:not(:hover) .default-logo {
      display: none;
    }
    .demo1.kt-sidebar-collapse .kt-sidebar:not(:hover) .small-logo {
      display: flex;
    }
    .demo1.kt-sidebar-collapse .kt-sidebar:not(:hover) .kt-menu > .kt-menu-item > .kt-menu-link .kt-menu-title,	.demo1.kt-sidebar-collapse .kt-sidebar:not(:hover) .kt-menu > .kt-menu-item > .kt-menu-link .kt-menu-arrow,	.demo1.kt-sidebar-collapse .kt-sidebar:not(:hover) .kt-menu > .kt-menu-item > .kt-menu-link .kt-menu-badge,	.demo1.kt-sidebar-collapse .kt-sidebar:not(:hover) .kt-menu > .kt-menu-item > .kt-menu-label .kt-menu-title,	.demo1.kt-sidebar-collapse .kt-sidebar:not(:hover) .kt-menu > .kt-menu-item > .kt-menu-label .kt-menu-arrow,	.demo1.kt-sidebar-collapse .kt-sidebar:not(:hover) .kt-menu > .kt-menu-item > .kt-menu-label .kt-menu-badge {
      display: none;
    }
    .demo1.kt-sidebar-collapse .kt-sidebar:not(:hover) .kt-menu > .kt-menu-item > .kt-menu-accordion {
      display: none;
    }
    .demo1.kt-sidebar-collapse .kt-sidebar:not(:hover) .kt-menu > .kt-menu-item > .kt-menu-heading {
      visibility: hidden;
      position: relative;
    }
    .demo1.kt-sidebar-collapse .kt-sidebar:not(:hover) .kt-menu > .kt-menu-item > .kt-menu-heading::before {
      content: "...";
      color: currentColor;
      font-size: inherit;
      position: absolute;
      visibility: visible;
      display: inline-block;
      bottom: 50%;
      inset-inline-start: 0;
      margin-inline-start: 0.225rem;
      transform: translateX(100%);
    }
    .demo1.kt-sidebar-collapse .kt-sidebar .kt-sidebar-content {
      overflow: hidden;
    }
  }
  .demo1 .kt-wrapper {
    transition: padding-inline-start var(--sidebar-transition-duration) var(--sidebar-transition-timing);
  }
  .demo1 .kt-header {
    transition: inset-inline-start var(--sidebar-transition-duration) var(--sidebar-transition-timing);
  }
}
@property --tw-border-spacing-x {
  syntax: "<length>";
  inherits: false;
  initial-value: 0;
}
@property --tw-border-spacing-y {
  syntax: "<length>";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-z {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-rotate-x {
  syntax: "*";
  inherits: false;
}
@property --tw-rotate-y {
  syntax: "*";
  inherits: false;
}
@property --tw-rotate-z {
  syntax: "*";
  inherits: false;
}
@property --tw-skew-x {
  syntax: "*";
  inherits: false;
}
@property --tw-skew-y {
  syntax: "*";
  inherits: false;
}
@property --tw-space-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-space-x-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-divide-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-gradient-position {
  syntax: "*";
  inherits: false;
}
@property --tw-gradient-from {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}
@property --tw-gradient-via {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}
@property --tw-gradient-to {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}
@property --tw-gradient-stops {
  syntax: "*";
  inherits: false;
}
@property --tw-gradient-via-stops {
  syntax: "*";
  inherits: false;
}
@property --tw-gradient-from-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 0%;
}
@property --tw-gradient-via-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 50%;
}
@property --tw-gradient-to-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-leading {
  syntax: "*";
  inherits: false;
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-tracking {
  syntax: "*";
  inherits: false;
}
@property --tw-ordinal {
  syntax: "*";
  inherits: false;
}
@property --tw-slashed-zero {
  syntax: "*";
  inherits: false;
}
@property --tw-numeric-figure {
  syntax: "*";
  inherits: false;
}
@property --tw-numeric-spacing {
  syntax: "*";
  inherits: false;
}
@property --tw-numeric-fraction {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-inset {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0px;
}
@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-outline-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-blur {
  syntax: "*";
  inherits: false;
}
@property --tw-brightness {
  syntax: "*";
  inherits: false;
}
@property --tw-contrast {
  syntax: "*";
  inherits: false;
}
@property --tw-grayscale {
  syntax: "*";
  inherits: false;
}
@property --tw-hue-rotate {
  syntax: "*";
  inherits: false;
}
@property --tw-invert {
  syntax: "*";
  inherits: false;
}
@property --tw-opacity {
  syntax: "*";
  inherits: false;
}
@property --tw-saturate {
  syntax: "*";
  inherits: false;
}
@property --tw-sepia {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-drop-shadow-size {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-blur {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-brightness {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-contrast {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-grayscale {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-hue-rotate {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-invert {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-opacity {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-saturate {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-sepia {
  syntax: "*";
  inherits: false;
}
@property --tw-duration {
  syntax: "*";
  inherits: false;
}
@property --tw-content {
  syntax: "*";
  initial-value: "";
  inherits: false;
}
@property --tw-ease {
  syntax: "*";
  inherits: false;
}
@property --tw-scale-x {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --tw-scale-y {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --tw-scale-z {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-border-spacing-x: 0;
      --tw-border-spacing-y: 0;
      --tw-translate-x: 0;
      --tw-translate-y: 0;
      --tw-translate-z: 0;
      --tw-rotate-x: initial;
      --tw-rotate-y: initial;
      --tw-rotate-z: initial;
      --tw-skew-x: initial;
      --tw-skew-y: initial;
      --tw-space-y-reverse: 0;
      --tw-space-x-reverse: 0;
      --tw-divide-y-reverse: 0;
      --tw-border-style: solid;
      --tw-gradient-position: initial;
      --tw-gradient-from: #0000;
      --tw-gradient-via: #0000;
      --tw-gradient-to: #0000;
      --tw-gradient-stops: initial;
      --tw-gradient-via-stops: initial;
      --tw-gradient-from-position: 0%;
      --tw-gradient-via-position: 50%;
      --tw-gradient-to-position: 100%;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-tracking: initial;
      --tw-ordinal: initial;
      --tw-slashed-zero: initial;
      --tw-numeric-figure: initial;
      --tw-numeric-spacing: initial;
      --tw-numeric-fraction: initial;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-outline-style: solid;
      --tw-blur: initial;
      --tw-brightness: initial;
      --tw-contrast: initial;
      --tw-grayscale: initial;
      --tw-hue-rotate: initial;
      --tw-invert: initial;
      --tw-opacity: initial;
      --tw-saturate: initial;
      --tw-sepia: initial;
      --tw-drop-shadow: initial;
      --tw-drop-shadow-color: initial;
      --tw-drop-shadow-alpha: 100%;
      --tw-drop-shadow-size: initial;
      --tw-backdrop-blur: initial;
      --tw-backdrop-brightness: initial;
      --tw-backdrop-contrast: initial;
      --tw-backdrop-grayscale: initial;
      --tw-backdrop-hue-rotate: initial;
      --tw-backdrop-invert: initial;
      --tw-backdrop-opacity: initial;
      --tw-backdrop-saturate: initial;
      --tw-backdrop-sepia: initial;
      --tw-duration: initial;
      --tw-content: "";
      --tw-ease: initial;
      --tw-scale-x: 1;
      --tw-scale-y: 1;
      --tw-scale-z: 1;
    }
  }
}

@font-face {
  font-family: 'keenicons-duotone';
  src:
    url('fonts/keenicons-duotone.ttf?gcn9yo') format('truetype'),
    url('fonts/keenicons-duotone.woff?gcn9yo') format('woff'),
    url('fonts/keenicons-duotone.svg?gcn9yo#keenicons-duotone') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

.ki-duotone {
  line-height: 1;
  position: relative;
  display: inline-flex;
}

.ki-duotone:after, 
.ki-duotone:before {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'keenicons-duotone' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  display: inline-flex;
}

.ki-abstract-1.ki-duotone:after {
  content: "\e900";
  
  opacity: 0.3;
}
.ki-abstract-1.ki-duotone:before {
  content: "\e901";
  position: absolute;
  
}
.ki-abstract-2.ki-duotone:after {
  content: "\e902";
  
  opacity: 0.3;
}
.ki-abstract-2.ki-duotone:before {
  content: "\e903";
  position: absolute;
  
}
.ki-abstract-3.ki-duotone:after {
  content: "\e904";
  
  opacity: 0.3;
}
.ki-abstract-3.ki-duotone:before {
  content: "\e905";
  position: absolute;
  
}
.ki-abstract-4.ki-duotone:after {
  content: "\e906";
  
  opacity: 0.3;
}
.ki-abstract-4.ki-duotone:before {
  content: "\e907";
  position: absolute;
  
}
.ki-abstract-5.ki-duotone:after {
  content: "\e908";
  
  opacity: 0.3;
}
.ki-abstract-5.ki-duotone:before {
  content: "\e909";
  position: absolute;
  
}
.ki-abstract-6.ki-duotone:before {
  content: "\e90a";
}
.ki-abstract-7.ki-duotone:after {
  content: "\e90b";
  
  opacity: 0.3;
}
.ki-abstract-7.ki-duotone:before {
  content: "\e90c";
  position: absolute;
  
}
.ki-abstract-8.ki-duotone:after {
  content: "\e90d";
  
  opacity: 0.3;
}
.ki-abstract-8.ki-duotone:before {
  content: "\e90e";
  position: absolute;
  
}
.ki-abstract-9.ki-duotone:after {
  content: "\e90f";
  
  opacity: 0.3;
}
.ki-abstract-9.ki-duotone:before {
  content: "\e910";
  position: absolute;
  
}
.ki-abstract-10.ki-duotone:after {
  content: "\e911";
  
  opacity: 0.3;
}
.ki-abstract-10.ki-duotone:before {
  content: "\e912";
  position: absolute;
  
}
.ki-abstract-11.ki-duotone:after {
  content: "\e913";
  
  opacity: 0.3;
}
.ki-abstract-11.ki-duotone:before {
  content: "\e914";
  position: absolute;
  
}
.ki-abstract-12.ki-duotone:after {
  content: "\e915";
  
  opacity: 0.3;
}
.ki-abstract-12.ki-duotone:before {
  content: "\e916";
  position: absolute;
  
}
.ki-abstract-13.ki-duotone:after {
  content: "\e917";
  
  opacity: 0.3;
}
.ki-abstract-13.ki-duotone:before {
  content: "\e918";
  position: absolute;
  
}
.ki-abstract-14.ki-duotone:after {
  content: "\e919";
  
}
.ki-abstract-14.ki-duotone:before {
  content: "\e91a";
  position: absolute;
  
  opacity: 0.3;
}
.ki-abstract-15.ki-duotone:after {
  content: "\e91b";
  
  opacity: 0.3;
}
.ki-abstract-15.ki-duotone:before {
  content: "\e91c";
  position: absolute;
  
}
.ki-abstract-16.ki-duotone:after {
  content: "\e91d";
  
  opacity: 0.3;
}
.ki-abstract-16.ki-duotone:before {
  content: "\e91e";
  position: absolute;
  
}
.ki-abstract-17.ki-duotone:after {
  content: "\e91f";
  
}
.ki-abstract-17.ki-duotone:before {
  content: "\e920";
  position: absolute;
  
  opacity: 0.3;
}
.ki-abstract-18.ki-duotone:after {
  content: "\e921";
  
}
.ki-abstract-18.ki-duotone:before {
  content: "\e922";
  position: absolute;
  
  opacity: 0.3;
}
.ki-abstract-19.ki-duotone:after {
  content: "\e923";
  
}
.ki-abstract-19.ki-duotone:before {
  content: "\e924";
  position: absolute;
  
  opacity: 0.3;
}
.ki-abstract-20.ki-duotone:after {
  content: "\e925";
  
}
.ki-abstract-20.ki-duotone:before {
  content: "\e926";
  position: absolute;
  
  opacity: 0.3;
}
.ki-abstract-21.ki-duotone:after {
  content: "\e927";
  
  opacity: 0.3;
}
.ki-abstract-21.ki-duotone:before {
  content: "\e928";
  position: absolute;
  
}
.ki-abstract-22.ki-duotone:after {
  content: "\e929";
  
  opacity: 0.3;
}
.ki-abstract-22.ki-duotone:before {
  content: "\e92a";
  position: absolute;
  
}
.ki-abstract-23.ki-duotone:after {
  content: "\e92b";
  
  opacity: 0.3;
}
.ki-abstract-23.ki-duotone:before {
  content: "\e92c";
  position: absolute;
  
}
.ki-abstract-24.ki-duotone:after {
  content: "\e92d";
  
}
.ki-abstract-24.ki-duotone:before {
  content: "\e92e";
  position: absolute;
  
  opacity: 0.3;
}
.ki-abstract-25.ki-duotone:after {
  content: "\e92f";
  
  opacity: 0.3;
}
.ki-abstract-25.ki-duotone:before {
  content: "\e930";
  position: absolute;
  
}
.ki-abstract-26.ki-duotone:after {
  content: "\e931";
  
  opacity: 0.3;
}
.ki-abstract-26.ki-duotone:before {
  content: "\e932";
  position: absolute;
  
}
.ki-abstract-27.ki-duotone:after {
  content: "\e933";
  
}
.ki-abstract-27.ki-duotone:before {
  content: "\e934";
  position: absolute;
  
  opacity: 0.3;
}
.ki-abstract-28.ki-duotone:after {
  content: "\e935";
  
}
.ki-abstract-28.ki-duotone:before {
  content: "\e936";
  position: absolute;
  
  opacity: 0.3;
}
.ki-abstract-29.ki-duotone:after {
  content: "\e937";
  
}
.ki-abstract-29.ki-duotone:before {
  content: "\e938";
  position: absolute;
  
  opacity: 0.3;
}
.ki-abstract-30.ki-duotone:after {
  content: "\e939";
  
}
.ki-abstract-30.ki-duotone:before {
  content: "\e93a";
  position: absolute;
  
  opacity: 0.3;
}
.ki-abstract-31.ki-duotone:after {
  content: "\e93b";
  
}
.ki-abstract-31.ki-duotone:before {
  content: "\e93c";
  position: absolute;
  
  opacity: 0.3;
}
.ki-abstract-32.ki-duotone:after {
  content: "\e93d";
  
}
.ki-abstract-32.ki-duotone:before {
  content: "\e93e";
  position: absolute;
  
  opacity: 0.3;
}
.ki-abstract-33.ki-duotone:after {
  content: "\e93f";
  
  opacity: 0.3;
}
.ki-abstract-33.ki-duotone:before {
  content: "\e940";
  position: absolute;
  
}
.ki-abstract-34.ki-duotone:after {
  content: "\e941";
  
  opacity: 0.3;
}
.ki-abstract-34.ki-duotone:before {
  content: "\e942";
  position: absolute;
  
}
.ki-abstract-35.ki-duotone:after {
  content: "\e943";
  
}
.ki-abstract-35.ki-duotone:before {
  content: "\e944";
  position: absolute;
  
  opacity: 0.3;
}
.ki-abstract-36.ki-duotone:after {
  content: "\e945";
  
}
.ki-abstract-36.ki-duotone:before {
  content: "\e946";
  position: absolute;
  
  opacity: 0.3;
}
.ki-abstract-37.ki-duotone:after {
  content: "\e947";
  
  opacity: 0.3;
}
.ki-abstract-37.ki-duotone:before {
  content: "\e948";
  position: absolute;
  
}
.ki-abstract-38.ki-duotone:after {
  content: "\e949";
  
}
.ki-abstract-38.ki-duotone:before {
  content: "\e94a";
  position: absolute;
  
  opacity: 0.3;
}
.ki-abstract-39.ki-duotone:after {
  content: "\e94b";
  
  opacity: 0.3;
}
.ki-abstract-39.ki-duotone:before {
  content: "\e94c";
  position: absolute;
  
}
.ki-abstract-40.ki-duotone:after {
  content: "\e94d";
  
}
.ki-abstract-40.ki-duotone:before {
  content: "\e94e";
  position: absolute;
  
  opacity: 0.3;
}
.ki-abstract-41.ki-duotone:after {
  content: "\e94f";
  
}
.ki-abstract-41.ki-duotone:before {
  content: "\e950";
  position: absolute;
  
  opacity: 0.3;
}
.ki-abstract-42.ki-duotone:after {
  content: "\e951";
  
  opacity: 0.3;
}
.ki-abstract-42.ki-duotone:before {
  content: "\e952";
  position: absolute;
  
}
.ki-abstract-43.ki-duotone:after {
  content: "\e953";
  
  opacity: 0.3;
}
.ki-abstract-43.ki-duotone:before {
  content: "\e954";
  position: absolute;
  
}
.ki-abstract-44.ki-duotone:after {
  content: "\e955";
  
}
.ki-abstract-44.ki-duotone:before {
  content: "\e956";
  position: absolute;
  
  opacity: 0.3;
}
.ki-abstract-45.ki-duotone:after {
  content: "\e957";
  
}
.ki-abstract-45.ki-duotone:before {
  content: "\e958";
  position: absolute;
  
  opacity: 0.3;
}
.ki-abstract-46.ki-duotone:after {
  content: "\e959";
  
  opacity: 0.3;
}
.ki-abstract-46.ki-duotone:before {
  content: "\e95a";
  position: absolute;
  
}
.ki-abstract-47.ki-duotone:after {
  content: "\e95b";
  
  opacity: 0.3;
}
.ki-abstract-47.ki-duotone:before {
  content: "\e95c";
  position: absolute;
  
}
.ki-abstract-48.ki-duotone:after {
  content: "\e95d";
  
  opacity: 0.3;
}
.ki-abstract-48.ki-duotone:before {
  content: "\e95e";
  position: absolute;
  
}
.ki-abstract-49.ki-duotone:after {
  content: "\e95f";
  
  opacity: 0.3;
}
.ki-abstract-49.ki-duotone:before {
  content: "\e960";
  position: absolute;
  
}
.ki-abstract.ki-duotone:after {
  content: "\e961";
  
  opacity: 0.3;
}
.ki-abstract.ki-duotone:before {
  content: "\e962";
  position: absolute;
  
}
.ki-add-files.ki-duotone:after {
  content: "\e963";
  
  opacity: 0.3;
}
.ki-add-files.ki-duotone:before {
  content: "\e964";
  position: absolute;
  
}
.ki-add-folder.ki-duotone:after {
  content: "\e965";
  
  opacity: 0.3;
}
.ki-add-folder.ki-duotone:before {
  content: "\e966";
  position: absolute;
  
}
.ki-add-notepad.ki-duotone:after {
  content: "\e967";
  
  opacity: 0.3;
}
.ki-add-notepad.ki-duotone:before {
  content: "\e968";
  position: absolute;
  
}
.ki-additem.ki-duotone:after {
  content: "\e969";
  
  opacity: 0.3;
}
.ki-additem.ki-duotone:before {
  content: "\e96a";
  position: absolute;
  
}
.ki-address-book.ki-duotone:after {
  content: "\e96b";
  
}
.ki-address-book.ki-duotone:before {
  content: "\e96c";
  position: absolute;
  
  opacity: 0.3;
}
.ki-airplane-square.ki-duotone:after {
  content: "\e96d";
  
  opacity: 0.3;
}
.ki-airplane-square.ki-duotone:before {
  content: "\e96e";
  position: absolute;
  
}
.ki-airplane.ki-duotone:after {
  content: "\e96f";
  
  opacity: 0.3;
}
.ki-airplane.ki-duotone:before {
  content: "\e970";
  position: absolute;
  
}
.ki-airpod.ki-duotone:after {
  content: "\e971";
  
  opacity: 0.3;
}
.ki-airpod.ki-duotone:before {
  content: "\e972";
  position: absolute;
  
}
.ki-android.ki-duotone:after {
  content: "\e973";
  
}
.ki-android.ki-duotone:before {
  content: "\e974";
  position: absolute;
  
  opacity: 0.3;
}
.ki-angular.ki-duotone:after {
  content: "\e975";
  
}
.ki-angular.ki-duotone:before {
  content: "\e976";
  position: absolute;
  
  opacity: 0.3;
}
.ki-apple.ki-duotone:before {
  content: "\e977";
}
.ki-archive-tick.ki-duotone:after {
  content: "\e978";
  
  opacity: 0.3;
}
.ki-archive-tick.ki-duotone:before {
  content: "\e979";
  position: absolute;
  
}
.ki-archive.ki-duotone:after {
  content: "\e97a";
  
  opacity: 0.3;
}
.ki-archive.ki-duotone:before {
  content: "\e97b";
  position: absolute;
  
}
.ki-arrow-circle-left.ki-duotone:after {
  content: "\e97c";
  
  opacity: 0.3;
}
.ki-arrow-circle-left.ki-duotone:before {
  content: "\e97d";
  position: absolute;
  
}
.ki-arrow-circle-right.ki-duotone:after {
  content: "\e97e";
  
  opacity: 0.3;
}
.ki-arrow-circle-right.ki-duotone:before {
  content: "\e97f";
  position: absolute;
  
}
.ki-arrow-down-left.ki-duotone:after {
  content: "\e980";
  
  opacity: 0.3;
}
.ki-arrow-down-left.ki-duotone:before {
  content: "\e981";
  position: absolute;
  
}
.ki-arrow-down-refraction.ki-duotone:after {
  content: "\e982";
  
}
.ki-arrow-down-refraction.ki-duotone:before {
  content: "\e983";
  position: absolute;
  
  opacity: 0.3;
}
.ki-arrow-down-right.ki-duotone:after {
  content: "\e984";
  
  opacity: 0.3;
}
.ki-arrow-down-right.ki-duotone:before {
  content: "\e985";
  position: absolute;
  
}
.ki-arrow-down.ki-duotone:after {
  content: "\e986";
  
  opacity: 0.3;
}
.ki-arrow-down.ki-duotone:before {
  content: "\e987";
  position: absolute;
  
}
.ki-arrow-left.ki-duotone:after {
  content: "\e988";
  
  opacity: 0.3;
}
.ki-arrow-left.ki-duotone:before {
  content: "\e989";
  position: absolute;
  
}
.ki-arrow-mix.ki-duotone:after {
  content: "\e98a";
  
  opacity: 0.3;
}
.ki-arrow-mix.ki-duotone:before {
  content: "\e98b";
  position: absolute;
  
}
.ki-arrow-right-left.ki-duotone:after {
  content: "\e98c";
  
}
.ki-arrow-right-left.ki-duotone:before {
  content: "\e98d";
  position: absolute;
  
  opacity: 0.3;
}
.ki-arrow-right.ki-duotone:after {
  content: "\e98e";
  
  opacity: 0.3;
}
.ki-arrow-right.ki-duotone:before {
  content: "\e98f";
  position: absolute;
  
}
.ki-arrow-two-diagonals.ki-duotone:after {
  content: "\e990";
  
  opacity: 0.3;
}
.ki-arrow-two-diagonals.ki-duotone:before {
  content: "\e991";
  position: absolute;
  
}
.ki-arrow-up-down.ki-duotone:after {
  content: "\e992";
  
}
.ki-arrow-up-down.ki-duotone:before {
  content: "\e993";
  position: absolute;
  
  opacity: 0.3;
}
.ki-arrow-up-left.ki-duotone:after {
  content: "\e994";
  
  opacity: 0.3;
}
.ki-arrow-up-left.ki-duotone:before {
  content: "\e995";
  position: absolute;
  
}
.ki-arrow-up-refraction.ki-duotone:after {
  content: "\e996";
  
}
.ki-arrow-up-refraction.ki-duotone:before {
  content: "\e997";
  position: absolute;
  
  opacity: 0.3;
}
.ki-arrow-up-right.ki-duotone:after {
  content: "\e998";
  
  opacity: 0.3;
}
.ki-arrow-up-right.ki-duotone:before {
  content: "\e999";
  position: absolute;
  
}
.ki-arrow-up.ki-duotone:after {
  content: "\e99a";
  
  opacity: 0.3;
}
.ki-arrow-up.ki-duotone:before {
  content: "\e99b";
  position: absolute;
  
}
.ki-arrow-zigzag.ki-duotone:after {
  content: "\e99c";
  
}
.ki-arrow-zigzag.ki-duotone:before {
  content: "\e99d";
  position: absolute;
  
  opacity: 0.3;
}
.ki-arrows-circle.ki-duotone:after {
  content: "\e99e";
  
  opacity: 0.3;
}
.ki-arrows-circle.ki-duotone:before {
  content: "\e99f";
  position: absolute;
  
}
.ki-arrows-loop.ki-duotone:after {
  content: "\e9a0";
  
  opacity: 0.3;
}
.ki-arrows-loop.ki-duotone:before {
  content: "\e9a1";
  position: absolute;
  
}
.ki-artificial-intelligence.ki-duotone:after {
  content: "\e9a2";
  
  opacity: 0.3;
}
.ki-artificial-intelligence.ki-duotone:before {
  content: "\e9a3";
  position: absolute;
  
}
.ki-autobrightness.ki-duotone:after {
  content: "\e9a4";
  
  opacity: 0.3;
}
.ki-autobrightness.ki-duotone:before {
  content: "\e9a5";
  position: absolute;
  
}
.ki-avalanche-avax.ki-duotone:after {
  content: "\e9a6";
  
  opacity: 0.3;
}
.ki-avalanche-avax.ki-duotone:before {
  content: "\e9a7";
  position: absolute;
  
}
.ki-award.ki-duotone:after {
  content: "\e9a8";
  
  opacity: 0.3;
}
.ki-award.ki-duotone:before {
  content: "\e9a9";
  position: absolute;
  
}
.ki-badge.ki-duotone:after {
  content: "\e9aa";
  
  opacity: 0.3;
}
.ki-badge.ki-duotone:before {
  content: "\e9ab";
  position: absolute;
  
}
.ki-bandage.ki-duotone:after {
  content: "\e9ac";
  
  opacity: 0.3;
}
.ki-bandage.ki-duotone:before {
  content: "\e9ad";
  position: absolute;
  
}
.ki-bank.ki-duotone:after {
  content: "\e9ae";
  
  opacity: 0.3;
}
.ki-bank.ki-duotone:before {
  content: "\e9af";
  position: absolute;
  
}
.ki-bar-chart.ki-duotone:after {
  content: "\e9b0";
  
}
.ki-bar-chart.ki-duotone:before {
  content: "\e9b1";
  position: absolute;
  
  opacity: 0.3;
}
.ki-barcode.ki-duotone:after {
  content: "\e9b2";
  
}
.ki-barcode.ki-duotone:before {
  content: "\e9b3";
  position: absolute;
  
  opacity: 0.3;
}
.ki-basket-ok.ki-duotone:after {
  content: "\e9b4";
  
  opacity: 0.3;
}
.ki-basket-ok.ki-duotone:before {
  content: "\e9b5";
  position: absolute;
  
}
.ki-basket.ki-duotone:after {
  content: "\e9b6";
  
  opacity: 0.3;
}
.ki-basket.ki-duotone:before {
  content: "\e9b7";
  position: absolute;
  
}
.ki-behance.ki-duotone:after {
  content: "\e9b8";
  
}
.ki-behance.ki-duotone:before {
  content: "\e9b9";
  position: absolute;
  
  opacity: 0.3;
}
.ki-bill.ki-duotone:after {
  content: "\e9ba";
  
  opacity: 0.3;
}
.ki-bill.ki-duotone:before {
  content: "\e9bb";
  position: absolute;
  
}
.ki-binance-usd-busd.ki-duotone:after {
  content: "\e9bc";
  
}
.ki-binance-usd-busd.ki-duotone:before {
  content: "\e9bd";
  position: absolute;
  
  opacity: 0.3;
}
.ki-binance.ki-duotone:after {
  content: "\e9be";
  
  opacity: 0.3;
}
.ki-binance.ki-duotone:before {
  content: "\e9bf";
  position: absolute;
  
}
.ki-bitcoin.ki-duotone:after {
  content: "\e9c0";
  
  opacity: 0.3;
}
.ki-bitcoin.ki-duotone:before {
  content: "\e9c1";
  position: absolute;
  
}
.ki-black-down.ki-duotone:before {
  content: "\e9c2";
}
.ki-black-left-line.ki-duotone:after {
  content: "\e9c3";
  
}
.ki-black-left-line.ki-duotone:before {
  content: "\e9c4";
  position: absolute;
  
  opacity: 0.3;
}
.ki-black-left.ki-duotone:before {
  content: "\e9c5";
}
.ki-black-right-line.ki-duotone:after {
  content: "\e9c6";
  
}
.ki-black-right-line.ki-duotone:before {
  content: "\e9c7";
  position: absolute;
  
  opacity: 0.3;
}
.ki-black-right.ki-duotone:before {
  content: "\e9c8";
}
.ki-black-up.ki-duotone:before {
  content: "\e9c9";
}
.ki-bluetooth.ki-duotone:after {
  content: "\e9ca";
  
}
.ki-bluetooth.ki-duotone:before {
  content: "\e9cb";
  position: absolute;
  
  opacity: 0.3;
}
.ki-book-open.ki-duotone:after {
  content: "\e9cc";
  
  opacity: 0.3;
}
.ki-book-open.ki-duotone:before {
  content: "\e9cd";
  position: absolute;
  
}
.ki-book-square.ki-duotone:after {
  content: "\e9ce";
  
  opacity: 0.3;
}
.ki-book-square.ki-duotone:before {
  content: "\e9cf";
  position: absolute;
  
}
.ki-book.ki-duotone:after {
  content: "\e9d0";
  
  opacity: 0.3;
}
.ki-book.ki-duotone:before {
  content: "\e9d1";
  position: absolute;
  
}
.ki-bookmark-2.ki-duotone:after {
  content: "\e9d2";
  
  opacity: 0.3;
}
.ki-bookmark-2.ki-duotone:before {
  content: "\e9d3";
  position: absolute;
  
}
.ki-bookmark.ki-duotone:after {
  content: "\e9d4";
  
  opacity: 0.3;
}
.ki-bookmark.ki-duotone:before {
  content: "\e9d5";
  position: absolute;
  
}
.ki-bootstrap.ki-duotone:after {
  content: "\e9d6";
  
  opacity: 0.3;
}
.ki-bootstrap.ki-duotone:before {
  content: "\e9d7";
  position: absolute;
  
}
.ki-briefcase.ki-duotone:after {
  content: "\e9d8";
  
  opacity: 0.3;
}
.ki-briefcase.ki-duotone:before {
  content: "\e9d9";
  position: absolute;
  
}
.ki-brifecase-cros.ki-duotone:after {
  content: "\e9da";
  
  opacity: 0.3;
}
.ki-brifecase-cros.ki-duotone:before {
  content: "\e9db";
  position: absolute;
  
}
.ki-brifecase-tick.ki-duotone:after {
  content: "\e9dc";
  
  opacity: 0.3;
}
.ki-brifecase-tick.ki-duotone:before {
  content: "\e9dd";
  position: absolute;
  
}
.ki-brifecase-timer.ki-duotone:after {
  content: "\e9de";
  
  opacity: 0.3;
}
.ki-brifecase-timer.ki-duotone:before {
  content: "\e9df";
  position: absolute;
  
}
.ki-brush.ki-duotone:after {
  content: "\e9e0";
  
  opacity: 0.3;
}
.ki-brush.ki-duotone:before {
  content: "\e9e1";
  position: absolute;
  
}
.ki-bucket-square.ki-duotone:after {
  content: "\e9e2";
  
  opacity: 0.3;
}
.ki-bucket-square.ki-duotone:before {
  content: "\e9e3";
  position: absolute;
  
}
.ki-bucket.ki-duotone:after {
  content: "\e9e4";
  
  opacity: 0.3;
}
.ki-bucket.ki-duotone:before {
  content: "\e9e5";
  position: absolute;
  
}
.ki-burger-menu-1.ki-duotone:after {
  content: "\e9e6";
  
  opacity: 0.3;
}
.ki-burger-menu-1.ki-duotone:before {
  content: "\e9e7";
  position: absolute;
  
}
.ki-burger-menu-2.ki-duotone:after {
  content: "\e9e8";
  
  opacity: 0.3;
}
.ki-burger-menu-2.ki-duotone:before {
  content: "\e9e9";
  position: absolute;
  
}
.ki-burger-menu-3.ki-duotone:after {
  content: "\e9ea";
  
  opacity: 0.3;
}
.ki-burger-menu-3.ki-duotone:before {
  content: "\e9eb";
  position: absolute;
  
}
.ki-burger-menu-4.ki-duotone:before {
  content: "\e9ec";
}
.ki-burger-menu-5.ki-duotone:before {
  content: "\e9ed";
}
.ki-burger-menu-6.ki-duotone:before {
  content: "\e9ee";
}
.ki-burger-menu.ki-duotone:after {
  content: "\e9ef";
  
  opacity: 0.3;
}
.ki-burger-menu.ki-duotone:before {
  content: "\e9f0";
  position: absolute;
  
}
.ki-bus.ki-duotone:after {
  content: "\e9f1";
  
  opacity: 0.3;
}
.ki-bus.ki-duotone:before {
  content: "\e9f2";
  position: absolute;
  
}
.ki-calculator.ki-duotone:after {
  content: "\e9f3";
  
  opacity: 0.3;
}
.ki-calculator.ki-duotone:before {
  content: "\e9f4";
  position: absolute;
  
}
.ki-calculatoror.ki-duotone:after {
  content: "\e9f5";
  
  opacity: 0.3;
}
.ki-calculatoror.ki-duotone:before {
  content: "\e9f6";
  position: absolute;
  
}
.ki-calendar-2.ki-duotone:after {
  content: "\e9f7";
  
  opacity: 0.3;
}
.ki-calendar-2.ki-duotone:before {
  content: "\e9f8";
  position: absolute;
  
}
.ki-calendar-8.ki-duotone:after {
  content: "\e9f9";
  
  opacity: 0.3;
}
.ki-calendar-8.ki-duotone:before {
  content: "\e9fa";
  position: absolute;
  
}
.ki-calendar-add.ki-duotone:after {
  content: "\e9fb";
  
  opacity: 0.3;
}
.ki-calendar-add.ki-duotone:before {
  content: "\e9fc";
  position: absolute;
  
}
.ki-calendar-edit.ki-duotone:after {
  content: "\e9fd";
  
  opacity: 0.3;
}
.ki-calendar-edit.ki-duotone:before {
  content: "\e9fe";
  position: absolute;
  
}
.ki-calendar-remove.ki-duotone:after {
  content: "\e9ff";
  
  opacity: 0.3;
}
.ki-calendar-remove.ki-duotone:before {
  content: "\ea00";
  position: absolute;
  
}
.ki-calendar-search.ki-duotone:after {
  content: "\ea01";
  
  opacity: 0.3;
}
.ki-calendar-search.ki-duotone:before {
  content: "\ea02";
  position: absolute;
  
}
.ki-calendar-tick.ki-duotone:after {
  content: "\ea03";
  
  opacity: 0.3;
}
.ki-calendar-tick.ki-duotone:before {
  content: "\ea04";
  position: absolute;
  
}
.ki-calendar.ki-duotone:after {
  content: "\ea05";
  
  opacity: 0.3;
}
.ki-calendar.ki-duotone:before {
  content: "\ea06";
  position: absolute;
  
}
.ki-call.ki-duotone:after {
  content: "\ea07";
  
  opacity: 0.3;
}
.ki-call.ki-duotone:before {
  content: "\ea08";
  position: absolute;
  
}
.ki-capsule.ki-duotone:after {
  content: "\ea09";
  
  opacity: 0.3;
}
.ki-capsule.ki-duotone:before {
  content: "\ea0a";
  position: absolute;
  
}
.ki-car.ki-duotone:after {
  content: "\ea0b";
  
  opacity: 0.3;
}
.ki-car.ki-duotone:before {
  content: "\ea0c";
  position: absolute;
  
}
.ki-category.ki-duotone:after {
  content: "\ea0d";
  
  opacity: 0.3;
}
.ki-category.ki-duotone:before {
  content: "\ea0e";
  position: absolute;
  
}
.ki-cd.ki-duotone:after {
  content: "\ea0f";
  
}
.ki-cd.ki-duotone:before {
  content: "\ea10";
  position: absolute;
  
  opacity: 0.3;
}
.ki-celsius-cel.ki-duotone:after {
  content: "\ea11";
  
}
.ki-celsius-cel.ki-duotone:before {
  content: "\ea12";
  position: absolute;
  
  opacity: 0.3;
}
.ki-chart-line-down-2.ki-duotone:after {
  content: "\ea13";
  
  opacity: 0.3;
}
.ki-chart-line-down-2.ki-duotone:before {
  content: "\ea14";
  position: absolute;
  
}
.ki-chart-line-down.ki-duotone:after {
  content: "\ea15";
  
  opacity: 0.3;
}
.ki-chart-line-down.ki-duotone:before {
  content: "\ea16";
  position: absolute;
  
}
.ki-chart-line-star.ki-duotone:after {
  content: "\ea17";
  
}
.ki-chart-line-star.ki-duotone:before {
  content: "\ea18";
  position: absolute;
  
  opacity: 0.3;
}
.ki-chart-line-up-2.ki-duotone:after {
  content: "\ea19";
  
}
.ki-chart-line-up-2.ki-duotone:before {
  content: "\ea1a";
  position: absolute;
  
  opacity: 0.3;
}
.ki-chart-line-up.ki-duotone:after {
  content: "\ea1b";
  
}
.ki-chart-line-up.ki-duotone:before {
  content: "\ea1c";
  position: absolute;
  
  opacity: 0.3;
}
.ki-chart-line.ki-duotone:after {
  content: "\ea1d";
  
  opacity: 0.3;
}
.ki-chart-line.ki-duotone:before {
  content: "\ea1e";
  position: absolute;
  
}
.ki-chart-pie-3.ki-duotone:after {
  content: "\ea1f";
  
}
.ki-chart-pie-3.ki-duotone:before {
  content: "\ea20";
  position: absolute;
  
  opacity: 0.3;
}
.ki-chart-pie-4.ki-duotone:after {
  content: "\ea21";
  
}
.ki-chart-pie-4.ki-duotone:before {
  content: "\ea22";
  position: absolute;
  
  opacity: 0.3;
}
.ki-chart-pie-simple.ki-duotone:after {
  content: "\ea23";
  
}
.ki-chart-pie-simple.ki-duotone:before {
  content: "\ea24";
  position: absolute;
  
  opacity: 0.3;
}
.ki-chart-pie-too.ki-duotone:after {
  content: "\ea25";
  
  opacity: 0.3;
}
.ki-chart-pie-too.ki-duotone:before {
  content: "\ea26";
  position: absolute;
  
}
.ki-chart-simple-2.ki-duotone:after {
  content: "\ea27";
  
}
.ki-chart-simple-2.ki-duotone:before {
  content: "\ea28";
  position: absolute;
  
  opacity: 0.3;
}
.ki-chart-simple-3.ki-duotone:after {
  content: "\ea29";
  
}
.ki-chart-simple-3.ki-duotone:before {
  content: "\ea2a";
  position: absolute;
  
  opacity: 0.3;
}
.ki-chart-simple.ki-duotone:after {
  content: "\ea2b";
  
}
.ki-chart-simple.ki-duotone:before {
  content: "\ea2c";
  position: absolute;
  
  opacity: 0.3;
}
.ki-chart.ki-duotone:after {
  content: "\ea2d";
  
}
.ki-chart.ki-duotone:before {
  content: "\ea2e";
  position: absolute;
  
  opacity: 0.3;
}
.ki-check-circle.ki-duotone:after {
  content: "\ea2f";
  
  opacity: 0.3;
}
.ki-check-circle.ki-duotone:before {
  content: "\ea30";
  position: absolute;
  
}
.ki-check-squared.ki-duotone:after {
  content: "\ea31";
  
  opacity: 0.3;
}
.ki-check-squared.ki-duotone:before {
  content: "\ea32";
  position: absolute;
  
}
.ki-check.ki-duotone:before {
  content: "\ea33";
}
.ki-cheque.ki-duotone:after {
  content: "\ea34";
  
}
.ki-cheque.ki-duotone:before {
  content: "\ea35";
  position: absolute;
  
  opacity: 0.3;
}
.ki-chrome.ki-duotone:after {
  content: "\ea36";
  
  opacity: 0.3;
}
.ki-chrome.ki-duotone:before {
  content: "\ea37";
  position: absolute;
  
}
.ki-classmates.ki-duotone:after {
  content: "\ea38";
  
}
.ki-classmates.ki-duotone:before {
  content: "\ea39";
  position: absolute;
  
  opacity: 0.3;
}
.ki-click.ki-duotone:after {
  content: "\ea3a";
  
}
.ki-click.ki-duotone:before {
  content: "\ea3b";
  position: absolute;
  
  opacity: 0.3;
}
.ki-clipboard.ki-duotone:after {
  content: "\ea3c";
  
  opacity: 0.3;
}
.ki-clipboard.ki-duotone:before {
  content: "\ea3d";
  position: absolute;
  
}
.ki-cloud-add.ki-duotone:after {
  content: "\ea3e";
  
}
.ki-cloud-add.ki-duotone:before {
  content: "\ea3f";
  position: absolute;
  
  opacity: 0.3;
}
.ki-cloud-change.ki-duotone:after {
  content: "\ea40";
  
}
.ki-cloud-change.ki-duotone:before {
  content: "\ea41";
  position: absolute;
  
  opacity: 0.3;
}
.ki-cloud-download.ki-duotone:after {
  content: "\ea42";
  
  opacity: 0.3;
}
.ki-cloud-download.ki-duotone:before {
  content: "\ea43";
  position: absolute;
  
}
.ki-cloud.ki-duotone:before {
  content: "\ea44";
}
.ki-code.ki-duotone:after {
  content: "\ea45";
  
  opacity: 0.3;
}
.ki-code.ki-duotone:before {
  content: "\ea46";
  position: absolute;
  
}
.ki-coffee.ki-duotone:after {
  content: "\ea47";
  
  opacity: 0.3;
}
.ki-coffee.ki-duotone:before {
  content: "\ea48";
  position: absolute;
  
}
.ki-color-swatch.ki-duotone:after {
  content: "\ea49";
  
  opacity: 0.3;
}
.ki-color-swatch.ki-duotone:before {
  content: "\ea4a";
  position: absolute;
  
}
.ki-colors-square.ki-duotone:after {
  content: "\ea4b";
  
  opacity: 0.3;
}
.ki-colors-square.ki-duotone:before {
  content: "\ea4c";
  position: absolute;
  
}
.ki-compass.ki-duotone:after {
  content: "\ea4d";
  
}
.ki-compass.ki-duotone:before {
  content: "\ea4e";
  position: absolute;
  
  opacity: 0.3;
}
.ki-copy-success.ki-duotone:after {
  content: "\ea4f";
  
}
.ki-copy-success.ki-duotone:before {
  content: "\ea50";
  position: absolute;
  
  opacity: 0.3;
}
.ki-copy.ki-duotone:before {
  content: "\ea51";
}
.ki-courier-express.ki-duotone:after {
  content: "\ea52";
  
}
.ki-courier-express.ki-duotone:before {
  content: "\ea53";
  position: absolute;
  
  opacity: 0.3;
}
.ki-courier.ki-duotone:after {
  content: "\ea54";
  
  opacity: 0.3;
}
.ki-courier.ki-duotone:before {
  content: "\ea55";
  position: absolute;
  
}
.ki-credit-cart.ki-duotone:after {
  content: "\ea56";
  
  opacity: 0.3;
}
.ki-credit-cart.ki-duotone:before {
  content: "\ea57";
  position: absolute;
  
}
.ki-cross-circle.ki-duotone:after {
  content: "\ea58";
  
  opacity: 0.3;
}
.ki-cross-circle.ki-duotone:before {
  content: "\ea59";
  position: absolute;
  
}
.ki-cross-square.ki-duotone:after {
  content: "\ea5a";
  
  opacity: 0.3;
}
.ki-cross-square.ki-duotone:before {
  content: "\ea5b";
  position: absolute;
  
}
.ki-cross.ki-duotone:before {
  content: "\ea5c";
}
.ki-crown-2.ki-duotone:after {
  content: "\ea5d";
  
  opacity: 0.3;
}
.ki-crown-2.ki-duotone:before {
  content: "\ea5e";
  position: absolute;
  
}
.ki-crown.ki-duotone:after {
  content: "\ea5f";
  
  opacity: 0.3;
}
.ki-crown.ki-duotone:before {
  content: "\ea60";
  position: absolute;
  
}
.ki-css.ki-duotone:after {
  content: "\ea61";
  
  opacity: 0.3;
}
.ki-css.ki-duotone:before {
  content: "\ea62";
  position: absolute;
  
}
.ki-cube-2.ki-duotone:after {
  content: "\ea63";
  
  opacity: 0.3;
}
.ki-cube-2.ki-duotone:before {
  content: "\ea64";
  position: absolute;
  
}
.ki-cube-3.ki-duotone:after {
  content: "\ea65";
  
  opacity: 0.3;
}
.ki-cube-3.ki-duotone:before {
  content: "\ea66";
  position: absolute;
  
}
.ki-cup.ki-duotone:after {
  content: "\ea67";
  
  opacity: 0.3;
}
.ki-cup.ki-duotone:before {
  content: "\ea68";
  position: absolute;
  
}
.ki-cursor.ki-duotone:after {
  content: "\ea69";
  
  opacity: 0.3;
}
.ki-cursor.ki-duotone:before {
  content: "\ea6a";
  position: absolute;
  
}
.ki-dash.ki-duotone:after {
  content: "\ea6b";
  
  opacity: 0.3;
}
.ki-dash.ki-duotone:before {
  content: "\ea6c";
  position: absolute;
  
}
.ki-data.ki-duotone:after {
  content: "\ea6d";
  
}
.ki-data.ki-duotone:before {
  content: "\ea6e";
  position: absolute;
  
  opacity: 0.3;
}
.ki-delete-files.ki-duotone:after {
  content: "\ea6f";
  
  opacity: 0.3;
}
.ki-delete-files.ki-duotone:before {
  content: "\ea70";
  position: absolute;
  
}
.ki-delete-folder.ki-duotone:after {
  content: "\ea71";
  
  opacity: 0.3;
}
.ki-delete-folder.ki-duotone:before {
  content: "\ea72";
  position: absolute;
  
}
.ki-delivery-2.ki-duotone:after {
  content: "\ea73";
  
  opacity: 0.3;
}
.ki-delivery-2.ki-duotone:before {
  content: "\ea74";
  position: absolute;
  
}
.ki-delivery-3.ki-duotone:after {
  content: "\ea75";
  
  opacity: 0.3;
}
.ki-delivery-3.ki-duotone:before {
  content: "\ea76";
  position: absolute;
  
}
.ki-delivery-24.ki-duotone:after {
  content: "\ea77";
  
  opacity: 0.3;
}
.ki-delivery-24.ki-duotone:before {
  content: "\ea78";
  position: absolute;
  
}
.ki-delivery-door.ki-duotone:after {
  content: "\ea79";
  
  opacity: 0.3;
}
.ki-delivery-door.ki-duotone:before {
  content: "\ea7a";
  position: absolute;
  
}
.ki-delivery-geolocation.ki-duotone:after {
  content: "\ea7b";
  
  opacity: 0.3;
}
.ki-delivery-geolocation.ki-duotone:before {
  content: "\ea7c";
  position: absolute;
  
}
.ki-delivery-time.ki-duotone:after {
  content: "\ea7d";
  
  opacity: 0.3;
}
.ki-delivery-time.ki-duotone:before {
  content: "\ea7e";
  position: absolute;
  
}
.ki-delivery.ki-duotone:after {
  content: "\ea7f";
  
  opacity: 0.3;
}
.ki-delivery.ki-duotone:before {
  content: "\ea80";
  position: absolute;
  
}
.ki-design-1.ki-duotone:after {
  content: "\ea81";
  
  opacity: 0.3;
}
.ki-design-1.ki-duotone:before {
  content: "\ea82";
  position: absolute;
  
}
.ki-design-2.ki-duotone:after {
  content: "\ea83";
  
  opacity: 0.3;
}
.ki-design-2.ki-duotone:before {
  content: "\ea84";
  position: absolute;
  
}
.ki-desktop-mobile.ki-duotone:after {
  content: "\ea85";
  
  opacity: 0.3;
}
.ki-desktop-mobile.ki-duotone:before {
  content: "\ea86";
  position: absolute;
  
}
.ki-devices-2.ki-duotone:after {
  content: "\ea87";
  
  opacity: 0.3;
}
.ki-devices-2.ki-duotone:before {
  content: "\ea88";
  position: absolute;
  
}
.ki-devices.ki-duotone:after {
  content: "\ea89";
  
  opacity: 0.3;
}
.ki-devices.ki-duotone:before {
  content: "\ea8a";
  position: absolute;
  
}
.ki-diamonds.ki-duotone:after {
  content: "\ea8b";
  
}
.ki-diamonds.ki-duotone:before {
  content: "\ea8c";
  position: absolute;
  
  opacity: 0.3;
}
.ki-directbox-default.ki-duotone:after {
  content: "\ea8d";
  
  opacity: 0.3;
}
.ki-directbox-default.ki-duotone:before {
  content: "\ea8e";
  position: absolute;
  
}
.ki-disconnect.ki-duotone:after {
  content: "\ea8f";
  
}
.ki-disconnect.ki-duotone:before {
  content: "\ea90";
  position: absolute;
  
  opacity: 0.3;
}
.ki-discount.ki-duotone:after {
  content: "\ea91";
  
  opacity: 0.3;
}
.ki-discount.ki-duotone:before {
  content: "\ea92";
  position: absolute;
  
}
.ki-disguise.ki-duotone:after {
  content: "\ea93";
  
  opacity: 0.3;
}
.ki-disguise.ki-duotone:before {
  content: "\ea94";
  position: absolute;
  
}
.ki-disk.ki-duotone:after {
  content: "\ea95";
  
  opacity: 0.3;
}
.ki-disk.ki-duotone:before {
  content: "\ea96";
  position: absolute;
  
}
.ki-dislike.ki-duotone:after {
  content: "\ea97";
  
}
.ki-dislike.ki-duotone:before {
  content: "\ea98";
  position: absolute;
  
  opacity: 0.3;
}
.ki-dj.ki-duotone:before {
  content: "\ea99";
}
.ki-document.ki-duotone:after {
  content: "\ea9a";
  
  opacity: 0.3;
}
.ki-document.ki-duotone:before {
  content: "\ea9b";
  position: absolute;
  
}
.ki-double-check.ki-duotone:after {
  content: "\ea9c";
  
}
.ki-double-check.ki-duotone:before {
  content: "\ea9d";
  position: absolute;
  
  opacity: 0.3;
}
.ki-dollar.ki-duotone:after {
  content: "\ea9e";
  
  opacity: 0.3;
}
.ki-dollar.ki-duotone:before {
  content: "\ea9f";
  position: absolute;
  
}
.ki-dots-circle-vertical.ki-duotone:after {
  content: "\eaa0";
  
  opacity: 0.3;
}
.ki-dots-circle-vertical.ki-duotone:before {
  content: "\eaa1";
  position: absolute;
  
}
.ki-dots-circle.ki-duotone:after {
  content: "\eaa2";
  
  opacity: 0.3;
}
.ki-dots-circle.ki-duotone:before {
  content: "\eaa3";
  position: absolute;
  
}
.ki-dots-horizontal.ki-duotone:before {
  content: "\eaa4";
}
.ki-dots-square-vertical.ki-duotone:after {
  content: "\eaa5";
  
  opacity: 0.3;
}
.ki-dots-square-vertical.ki-duotone:before {
  content: "\eaa6";
  position: absolute;
  
}
.ki-dots-square.ki-duotone:after {
  content: "\eaa7";
  
  opacity: 0.3;
}
.ki-dots-square.ki-duotone:before {
  content: "\eaa8";
  position: absolute;
  
}
.ki-dots-vertical.ki-duotone:after {
  content: "\eaa9";
  
}
.ki-dots-vertical.ki-duotone:before {
  content: "\eaaa";
  position: absolute;
  
  opacity: 0.3;
}
.ki-double-check-circle.ki-duotone:after {
  content: "\eaab";
  
  opacity: 0.3;
}
.ki-double-check-circle.ki-duotone:before {
  content: "\eaac";
  position: absolute;
  
}
.ki-double-down.ki-duotone:after {
  content: "\eaad";
  
}
.ki-double-down.ki-duotone:before {
  content: "\eaae";
  position: absolute;
  
  opacity: 0.3;
}
.ki-double-left-arrow.ki-duotone:after {
  content: "\eaaf";
  
  opacity: 0.3;
}
.ki-double-left-arrow.ki-duotone:before {
  content: "\eab0";
  position: absolute;
  
}
.ki-double-left.ki-duotone:after {
  content: "\eab1";
  
}
.ki-double-left.ki-duotone:before {
  content: "\eab2";
  position: absolute;
  
  opacity: 0.3;
}
.ki-double-right-arrow.ki-duotone:after {
  content: "\eab3";
  
  opacity: 0.3;
}
.ki-double-right-arrow.ki-duotone:before {
  content: "\eab4";
  position: absolute;
  
}
.ki-double-right.ki-duotone:after {
  content: "\eab5";
  
}
.ki-double-right.ki-duotone:before {
  content: "\eab6";
  position: absolute;
  
  opacity: 0.3;
}
.ki-double-up.ki-duotone:after {
  content: "\eab7";
  
}
.ki-double-up.ki-duotone:before {
  content: "\eab8";
  position: absolute;
  
  opacity: 0.3;
}
.ki-down-square.ki-duotone:after {
  content: "\eab9";
  
  opacity: 0.3;
}
.ki-down-square.ki-duotone:before {
  content: "\eaba";
  position: absolute;
  
}
.ki-down.ki-duotone:before {
  content: "\eabb";
}
.ki-dribbble.ki-duotone:after {
  content: "\eabc";
  
}
.ki-dribbble.ki-duotone:before {
  content: "\eabd";
  position: absolute;
  
  opacity: 0.3;
}
.ki-drop.ki-duotone:after {
  content: "\eabe";
  
}
.ki-drop.ki-duotone:before {
  content: "\eabf";
  position: absolute;
  
  opacity: 0.3;
}
.ki-dropbox.ki-duotone:after {
  content: "\eac0";
  
  opacity: 0.3;
}
.ki-dropbox.ki-duotone:before {
  content: "\eac1";
  position: absolute;
  
}
.ki-educare-ekt.ki-duotone:after {
  content: "\eac2";
  
  opacity: 0.3;
}
.ki-educare-ekt.ki-duotone:before {
  content: "\eac3";
  position: absolute;
  
}
.ki-electricity.ki-duotone:after {
  content: "\eac4";
  
  opacity: 0.3;
}
.ki-electricity.ki-duotone:before {
  content: "\eac5";
  position: absolute;
  
}
.ki-electronic-clock.ki-duotone:after {
  content: "\eac6";
  
  opacity: 0.3;
}
.ki-electronic-clock.ki-duotone:before {
  content: "\eac7";
  position: absolute;
  
}
.ki-element-1.ki-duotone:after {
  content: "\eac8";
  
  opacity: 0.3;
}
.ki-element-1.ki-duotone:before {
  content: "\eac9";
  position: absolute;
  
}
.ki-element-2.ki-duotone:after {
  content: "\eaca";
  
}
.ki-element-2.ki-duotone:before {
  content: "\eacb";
  position: absolute;
  
  opacity: 0.3;
}
.ki-element-3.ki-duotone:after {
  content: "\eacc";
  
  opacity: 0.3;
}
.ki-element-3.ki-duotone:before {
  content: "\eacd";
  position: absolute;
  
}
.ki-element-4.ki-duotone:after {
  content: "\eace";
  
}
.ki-element-4.ki-duotone:before {
  content: "\eacf";
  position: absolute;
  
  opacity: 0.3;
}
.ki-element-5.ki-duotone:after {
  content: "\ead0";
  
}
.ki-element-5.ki-duotone:before {
  content: "\ead1";
  position: absolute;
  
  opacity: 0.3;
}
.ki-element-6.ki-duotone:after {
  content: "\ead2";
  
  opacity: 0.3;
}
.ki-element-6.ki-duotone:before {
  content: "\ead3";
  position: absolute;
  
}
.ki-element-7.ki-duotone:after {
  content: "\ead4";
  
}
.ki-element-7.ki-duotone:before {
  content: "\ead5";
  position: absolute;
  
  opacity: 0.3;
}
.ki-element-8.ki-duotone:after {
  content: "\ead6";
  
  opacity: 0.3;
}
.ki-element-8.ki-duotone:before {
  content: "\ead7";
  position: absolute;
  
}
.ki-element-9.ki-duotone:after {
  content: "\ead8";
  
  opacity: 0.3;
}
.ki-element-9.ki-duotone:before {
  content: "\ead9";
  position: absolute;
  
}
.ki-element-10.ki-duotone:after {
  content: "\eada";
  
}
.ki-element-10.ki-duotone:before {
  content: "\eadb";
  position: absolute;
  
  opacity: 0.3;
}
.ki-element-11.ki-duotone:after {
  content: "\eadc";
  
}
.ki-element-11.ki-duotone:before {
  content: "\eadd";
  position: absolute;
  
  opacity: 0.3;
}
.ki-element-12.ki-duotone:after {
  content: "\eade";
  
  opacity: 0.3;
}
.ki-element-12.ki-duotone:before {
  content: "\eadf";
  position: absolute;
  
}
.ki-element-equal.ki-duotone:after {
  content: "\eae0";
  
  opacity: 0.3;
}
.ki-element-equal.ki-duotone:before {
  content: "\eae1";
  position: absolute;
  
}
.ki-element-plus.ki-duotone:after {
  content: "\eae2";
  
}
.ki-element-plus.ki-duotone:before {
  content: "\eae3";
  position: absolute;
  
  opacity: 0.3;
}
.ki-emoji-happy.ki-duotone:after {
  content: "\eae4";
  
  opacity: 0.3;
}
.ki-emoji-happy.ki-duotone:before {
  content: "\eae5";
  position: absolute;
  
}
.ki-enjin-coin-enj.ki-duotone:after {
  content: "\eae6";
  
}
.ki-enjin-coin-enj.ki-duotone:before {
  content: "\eae7";
  position: absolute;
  
  opacity: 0.3;
}
.ki-ensure.ki-duotone:after {
  content: "\eae8";
  
}
.ki-ensure.ki-duotone:before {
  content: "\eae9";
  position: absolute;
  
  opacity: 0.3;
}
.ki-entrance-left.ki-duotone:after {
  content: "\eaea";
  
}
.ki-entrance-left.ki-duotone:before {
  content: "\eaeb";
  position: absolute;
  
  opacity: 0.3;
}
.ki-entrance-right.ki-duotone:after {
  content: "\eaec";
  
  opacity: 0.3;
}
.ki-entrance-right.ki-duotone:before {
  content: "\eaed";
  position: absolute;
  
}
.ki-eraser.ki-duotone:after {
  content: "\eaee";
  
  opacity: 0.3;
}
.ki-eraser.ki-duotone:before {
  content: "\eaef";
  position: absolute;
  
}
.ki-euro.ki-duotone:after {
  content: "\eaf0";
  
  opacity: 0.3;
}
.ki-euro.ki-duotone:before {
  content: "\eaf1";
  position: absolute;
  
}
.ki-exit-down.ki-duotone:after {
  content: "\eaf2";
  
  opacity: 0.3;
}
.ki-exit-down.ki-duotone:before {
  content: "\eaf3";
  position: absolute;
  
}
.ki-exit-left.ki-duotone:after {
  content: "\eaf4";
  
  opacity: 0.3;
}
.ki-exit-left.ki-duotone:before {
  content: "\eaf5";
  position: absolute;
  
}
.ki-exit-right-corner.ki-duotone:after {
  content: "\eaf6";
  
  opacity: 0.3;
}
.ki-exit-right-corner.ki-duotone:before {
  content: "\eaf7";
  position: absolute;
  
}
.ki-exit-right.ki-duotone:after {
  content: "\eaf8";
  
  opacity: 0.3;
}
.ki-exit-right.ki-duotone:before {
  content: "\eaf9";
  position: absolute;
  
}
.ki-exit-up.ki-duotone:after {
  content: "\eafa";
  
  opacity: 0.3;
}
.ki-exit-up.ki-duotone:before {
  content: "\eafb";
  position: absolute;
  
}
.ki-external-drive.ki-duotone:after {
  content: "\eafc";
  
}
.ki-external-drive.ki-duotone:before {
  content: "\eafd";
  position: absolute;
  
  opacity: 0.3;
}
.ki-eye-slash.ki-duotone:after {
  content: "\eafe";
  
}
.ki-eye-slash.ki-duotone:before {
  content: "\eaff";
  position: absolute;
  
  opacity: 0.3;
}
.ki-eye.ki-duotone:after {
  content: "\eb00";
  
}
.ki-eye.ki-duotone:before {
  content: "\eb01";
  position: absolute;
  
  opacity: 0.3;
}
.ki-face-id.ki-duotone:after {
  content: "\eb02";
  
  opacity: 0.3;
}
.ki-face-id.ki-duotone:before {
  content: "\eb03";
  position: absolute;
  
}
.ki-facebook.ki-duotone:after {
  content: "\eb04";
  
  opacity: 0.3;
}
.ki-facebook.ki-duotone:before {
  content: "\eb05";
  position: absolute;
  
}
.ki-fasten.ki-duotone:after {
  content: "\eb06";
  
  opacity: 0.3;
}
.ki-fasten.ki-duotone:before {
  content: "\eb07";
  position: absolute;
  
}
.ki-fatrows.ki-duotone:after {
  content: "\eb08";
  
}
.ki-fatrows.ki-duotone:before {
  content: "\eb09";
  position: absolute;
  
  opacity: 0.3;
}
.ki-feather.ki-duotone:after {
  content: "\eb0a";
  
  opacity: 0.3;
}
.ki-feather.ki-duotone:before {
  content: "\eb0b";
  position: absolute;
  
}
.ki-figma.ki-duotone:after {
  content: "\eb0c";
  
  opacity: 0.3;
}
.ki-figma.ki-duotone:before {
  content: "\eb0d";
  position: absolute;
  
}
.ki-file-added.ki-duotone:after {
  content: "\eb0e";
  
}
.ki-file-added.ki-duotone:before {
  content: "\eb0f";
  position: absolute;
  
  opacity: 0.3;
}
.ki-file-deleted.ki-duotone:after {
  content: "\eb10";
  
}
.ki-file-deleted.ki-duotone:before {
  content: "\eb11";
  position: absolute;
  
  opacity: 0.3;
}
.ki-file-down.ki-duotone:after {
  content: "\eb12";
  
  opacity: 0.3;
}
.ki-file-down.ki-duotone:before {
  content: "\eb13";
  position: absolute;
  
}
.ki-file-left.ki-duotone:after {
  content: "\eb14";
  
  opacity: 0.3;
}
.ki-file-left.ki-duotone:before {
  content: "\eb15";
  position: absolute;
  
}
.ki-file-right.ki-duotone:after {
  content: "\eb16";
  
  opacity: 0.3;
}
.ki-file-right.ki-duotone:before {
  content: "\eb17";
  position: absolute;
  
}
.ki-file-sheet.ki-duotone:after {
  content: "\eb18";
  
}
.ki-file-sheet.ki-duotone:before {
  content: "\eb19";
  position: absolute;
  
  opacity: 0.3;
}
.ki-file-up.ki-duotone:after {
  content: "\eb1a";
  
  opacity: 0.3;
}
.ki-file-up.ki-duotone:before {
  content: "\eb1b";
  position: absolute;
  
}
.ki-files.ki-duotone:after {
  content: "\eb1c";
  
}
.ki-files.ki-duotone:before {
  content: "\eb1d";
  position: absolute;
  
  opacity: 0.3;
}
.ki-filter-edit.ki-duotone:after {
  content: "\eb1e";
  
  opacity: 0.3;
}
.ki-filter-edit.ki-duotone:before {
  content: "\eb1f";
  position: absolute;
  
}
.ki-filter-search.ki-duotone:after {
  content: "\eb20";
  
  opacity: 0.3;
}
.ki-filter-search.ki-duotone:before {
  content: "\eb21";
  position: absolute;
  
}
.ki-filter-square.ki-duotone:after {
  content: "\eb22";
  
}
.ki-filter-square.ki-duotone:before {
  content: "\eb23";
  position: absolute;
  
  opacity: 0.3;
}
.ki-filter-tablet.ki-duotone:after {
  content: "\eb24";
  
  opacity: 0.3;
}
.ki-filter-tablet.ki-duotone:before {
  content: "\eb25";
  position: absolute;
  
}
.ki-filter-tick.ki-duotone:after {
  content: "\eb26";
  
  opacity: 0.3;
}
.ki-filter-tick.ki-duotone:before {
  content: "\eb27";
  position: absolute;
  
}
.ki-filter.ki-duotone:after {
  content: "\eb28";
  
}
.ki-filter.ki-duotone:before {
  content: "\eb29";
  position: absolute;
  
  opacity: 0.3;
}
.ki-financial-schedule.ki-duotone:after {
  content: "\eb2a";
  
  opacity: 0.3;
}
.ki-financial-schedule.ki-duotone:before {
  content: "\eb2b";
  position: absolute;
  
}
.ki-fingerprint-scanning.ki-duotone:after {
  content: "\eb2c";
  
}
.ki-fingerprint-scanning.ki-duotone:before {
  content: "\eb2d";
  position: absolute;
  
  opacity: 0.3;
}
.ki-flag.ki-duotone:after {
  content: "\eb2e";
  
  opacity: 0.3;
}
.ki-flag.ki-duotone:before {
  content: "\eb2f";
  position: absolute;
  
}
.ki-flash-circle.ki-duotone:after {
  content: "\eb30";
  
  opacity: 0.3;
}
.ki-flash-circle.ki-duotone:before {
  content: "\eb31";
  position: absolute;
  
}
.ki-flask.ki-duotone:after {
  content: "\eb32";
  
  opacity: 0.3;
}
.ki-flask.ki-duotone:before {
  content: "\eb33";
  position: absolute;
  
}
.ki-focus.ki-duotone:after {
  content: "\eb34";
  
  opacity: 0.3;
}
.ki-focus.ki-duotone:before {
  content: "\eb35";
  position: absolute;
  
}
.ki-folder-added.ki-duotone:after {
  content: "\eb36";
  
  opacity: 0.3;
}
.ki-folder-added.ki-duotone:before {
  content: "\eb37";
  position: absolute;
  
}
.ki-folder-down.ki-duotone:after {
  content: "\eb38";
  
  opacity: 0.3;
}
.ki-folder-down.ki-duotone:before {
  content: "\eb39";
  position: absolute;
  
}
.ki-folder-up.ki-duotone:after {
  content: "\eb3a";
  
  opacity: 0.3;
}
.ki-folder-up.ki-duotone:before {
  content: "\eb3b";
  position: absolute;
  
}
.ki-folder.ki-duotone:after {
  content: "\eb3c";
  
  opacity: 0.3;
}
.ki-folder.ki-duotone:before {
  content: "\eb3d";
  position: absolute;
  
}
.ki-frame.ki-duotone:after {
  content: "\eb3e";
  
  opacity: 0.3;
}
.ki-frame.ki-duotone:before {
  content: "\eb3f";
  position: absolute;
  
}
.ki-geolocation-home.ki-duotone:after {
  content: "\eb40";
  
  opacity: 0.3;
}
.ki-geolocation-home.ki-duotone:before {
  content: "\eb41";
  position: absolute;
  
}
.ki-geolocation.ki-duotone:after {
  content: "\eb42";
  
  opacity: 0.3;
}
.ki-geolocation.ki-duotone:before {
  content: "\eb43";
  position: absolute;
  
}
.ki-ghost.ki-duotone:after {
  content: "\eb44";
  
}
.ki-ghost.ki-duotone:before {
  content: "\eb45";
  position: absolute;
  
  opacity: 0.3;
}
.ki-gift.ki-duotone:after {
  content: "\eb46";
  
}
.ki-gift.ki-duotone:before {
  content: "\eb47";
  position: absolute;
  
  opacity: 0.3;
}
.ki-github.ki-duotone:after {
  content: "\eb48";
  
  opacity: 0.3;
}
.ki-github.ki-duotone:before {
  content: "\eb49";
  position: absolute;
  
}
.ki-glass.ki-duotone:after {
  content: "\eb4a";
  
  opacity: 0.3;
}
.ki-glass.ki-duotone:before {
  content: "\eb4b";
  position: absolute;
  
}
.ki-google-play.ki-duotone:after {
  content: "\eb4c";
  
  opacity: 0.3;
}
.ki-google-play.ki-duotone:before {
  content: "\eb4d";
  position: absolute;
  
}
.ki-google.ki-duotone:after {
  content: "\eb4e";
  
  opacity: 0.3;
}
.ki-google.ki-duotone:before {
  content: "\eb4f";
  position: absolute;
  
}
.ki-graph-2.ki-duotone:after {
  content: "\eb50";
  
  opacity: 0.3;
}
.ki-graph-2.ki-duotone:before {
  content: "\eb51";
  position: absolute;
  
}
.ki-graph-3.ki-duotone:after {
  content: "\eb52";
  
  opacity: 0.3;
}
.ki-graph-3.ki-duotone:before {
  content: "\eb53";
  position: absolute;
  
}
.ki-graph-4.ki-duotone:after {
  content: "\eb54";
  
}
.ki-graph-4.ki-duotone:before {
  content: "\eb55";
  position: absolute;
  
  opacity: 0.3;
}
.ki-graph-up.ki-duotone:after {
  content: "\eb56";
  
  opacity: 0.3;
}
.ki-graph-up.ki-duotone:before {
  content: "\eb57";
  position: absolute;
  
}
.ki-graph.ki-duotone:after {
  content: "\eb58";
  
  opacity: 0.3;
}
.ki-graph.ki-duotone:before {
  content: "\eb59";
  position: absolute;
  
}
.ki-grid-2.ki-duotone:after {
  content: "\eb5a";
  
  opacity: 0.3;
}
.ki-grid-2.ki-duotone:before {
  content: "\eb5b";
  position: absolute;
  
}
.ki-grid.ki-duotone:after {
  content: "\eb5c";
  
  opacity: 0.3;
}
.ki-grid.ki-duotone:before {
  content: "\eb5d";
  position: absolute;
  
}
.ki-handcart.ki-duotone:before {
  content: "\eb5e";
}
.ki-happyemoji.ki-duotone:after {
  content: "\eb5f";
  
  opacity: 0.3;
}
.ki-happyemoji.ki-duotone:before {
  content: "\eb60";
  position: absolute;
  
}
.ki-heart-circle.ki-duotone:after {
  content: "\eb61";
  
  opacity: 0.3;
}
.ki-heart-circle.ki-duotone:before {
  content: "\eb62";
  position: absolute;
  
}
.ki-heart.ki-duotone:after {
  content: "\eb63";
  
  opacity: 0.3;
}
.ki-heart.ki-duotone:before {
  content: "\eb64";
  position: absolute;
  
}
.ki-home-1.ki-duotone:after {
  content: "\eb65";
  
  opacity: 0.3;
}
.ki-home-1.ki-duotone:before {
  content: "\eb66";
  position: absolute;
  
}
.ki-home-2.ki-duotone:after {
  content: "\eb67";
  
  opacity: 0.3;
}
.ki-home-2.ki-duotone:before {
  content: "\eb68";
  position: absolute;
  
}
.ki-home-3.ki-duotone:after {
  content: "\eb69";
  
  opacity: 0.3;
}
.ki-home-3.ki-duotone:before {
  content: "\eb6a";
  position: absolute;
  
}
.ki-home.ki-duotone:before {
  content: "\eb6b";
}
.ki-html.ki-duotone:after {
  content: "\eb6c";
  
  opacity: 0.3;
}
.ki-html.ki-duotone:before {
  content: "\eb6d";
  position: absolute;
  
}
.ki-icon.ki-duotone:after {
  content: "\eb6e";
  
  opacity: 0.3;
}
.ki-icon.ki-duotone:before {
  content: "\eb6f";
  position: absolute;
  
}
.ki-illustrator.ki-duotone:after {
  content: "\eb70";
  
  opacity: 0.3;
}
.ki-illustrator.ki-duotone:before {
  content: "\eb71";
  position: absolute;
  
}
.ki-information-1.ki-duotone:after {
  content: "\eb72";
  
  opacity: 0.3;
}
.ki-information-1.ki-duotone:before {
  content: "\eb73";
  position: absolute;
  
}
.ki-information-2.ki-duotone:after {
  content: "\eb74";
  
  opacity: 0.3;
}
.ki-information-2.ki-duotone:before {
  content: "\eb75";
  position: absolute;
  
}
.ki-information-3.ki-duotone:after {
  content: "\eb76";
  
  opacity: 0.3;
}
.ki-information-3.ki-duotone:before {
  content: "\eb77";
  position: absolute;
  
}
.ki-information-4.ki-duotone:after {
  content: "\eb78";
  
  opacity: 0.3;
}
.ki-information-4.ki-duotone:before {
  content: "\eb79";
  position: absolute;
  
}
.ki-information.ki-duotone:after {
  content: "\eb7a";
  
  opacity: 0.3;
}
.ki-information.ki-duotone:before {
  content: "\eb7b";
  position: absolute;
  
}
.ki-instagram.ki-duotone:after {
  content: "\eb7c";
  
  opacity: 0.3;
}
.ki-instagram.ki-duotone:before {
  content: "\eb7d";
  position: absolute;
  
}
.ki-joystick.ki-duotone:after {
  content: "\eb7e";
  
}
.ki-joystick.ki-duotone:before {
  content: "\eb7f";
  position: absolute;
  
  opacity: 0.3;
}
.ki-js-2.ki-duotone:after {
  content: "\eb80";
  
}
.ki-js-2.ki-duotone:before {
  content: "\eb81";
  position: absolute;
  
  opacity: 0.3;
}
.ki-js.ki-duotone:after {
  content: "\eb82";
  
}
.ki-js.ki-duotone:before {
  content: "\eb83";
  position: absolute;
  
  opacity: 0.3;
}
.ki-kanban.ki-duotone:after {
  content: "\eb84";
  
}
.ki-kanban.ki-duotone:before {
  content: "\eb85";
  position: absolute;
  
  opacity: 0.3;
}
.ki-key-square.ki-duotone:after {
  content: "\eb86";
  
  opacity: 0.3;
}
.ki-key-square.ki-duotone:before {
  content: "\eb87";
  position: absolute;
  
}
.ki-key.ki-duotone:after {
  content: "\eb88";
  
  opacity: 0.3;
}
.ki-key.ki-duotone:before {
  content: "\eb89";
  position: absolute;
  
}
.ki-keyboard.ki-duotone:after {
  content: "\eb8a";
  
}
.ki-keyboard.ki-duotone:before {
  content: "\eb8b";
  position: absolute;
  
  opacity: 0.3;
}
.ki-laptop.ki-duotone:after {
  content: "\eb8c";
  
  opacity: 0.3;
}
.ki-laptop.ki-duotone:before {
  content: "\eb8d";
  position: absolute;
  
}
.ki-laravel.ki-duotone:after {
  content: "\eb8e";
  
  opacity: 0.3;
}
.ki-laravel.ki-duotone:before {
  content: "\eb8f";
  position: absolute;
  
}
.ki-left-square.ki-duotone:after {
  content: "\eb90";
  
  opacity: 0.3;
}
.ki-left-square.ki-duotone:before {
  content: "\eb91";
  position: absolute;
  
}
.ki-left.ki-duotone:before {
  content: "\eb92";
}
.ki-like-2.ki-duotone:after {
  content: "\eb93";
  
  opacity: 0.3;
}
.ki-like-2.ki-duotone:before {
  content: "\eb94";
  position: absolute;
  
}
.ki-like-folder.ki-duotone:after {
  content: "\eb95";
  
  opacity: 0.3;
}
.ki-like-folder.ki-duotone:before {
  content: "\eb96";
  position: absolute;
  
}
.ki-like-shapes.ki-duotone:after {
  content: "\eb97";
  
  opacity: 0.3;
}
.ki-like-shapes.ki-duotone:before {
  content: "\eb98";
  position: absolute;
  
}
.ki-like-tag.ki-duotone:after {
  content: "\eb99";
  
  opacity: 0.3;
}
.ki-like-tag.ki-duotone:before {
  content: "\eb9a";
  position: absolute;
  
}
.ki-like.ki-duotone:after {
  content: "\eb9b";
  
}
.ki-like.ki-duotone:before {
  content: "\eb9c";
  position: absolute;
  
  opacity: 0.3;
}
.ki-loading.ki-duotone:after {
  content: "\eb9d";
  
}
.ki-loading.ki-duotone:before {
  content: "\eb9e";
  position: absolute;
  
  opacity: 0.3;
}
.ki-lock-2.ki-duotone:after {
  content: "\eb9f";
  
}
.ki-lock-2.ki-duotone:before {
  content: "\eba0";
  position: absolute;
  
  opacity: 0.3;
}
.ki-lock-3.ki-duotone:after {
  content: "\eba1";
  
  opacity: 0.3;
}
.ki-lock-3.ki-duotone:before {
  content: "\eba2";
  position: absolute;
  
}
.ki-lock.ki-duotone:after {
  content: "\eba3";
  
  opacity: 0.3;
}
.ki-lock.ki-duotone:before {
  content: "\eba4";
  position: absolute;
  
}
.ki-logistic.ki-duotone:after {
  content: "\eba5";
  
  opacity: 0.3;
}
.ki-logistic.ki-duotone:before {
  content: "\eba6";
  position: absolute;
  
}
.ki-lots-shopping.ki-duotone:after {
  content: "\eba7";
  
  opacity: 0.3;
}
.ki-lots-shopping.ki-duotone:before {
  content: "\eba8";
  position: absolute;
  
}
.ki-lovely.ki-duotone:after {
  content: "\eba9";
  
  opacity: 0.3;
}
.ki-lovely.ki-duotone:before {
  content: "\ebaa";
  position: absolute;
  
}
.ki-lts.ki-duotone:after {
  content: "\ebab";
  
}
.ki-lts.ki-duotone:before {
  content: "\ebac";
  position: absolute;
  
  opacity: 0.3;
}
.ki-magnifier.ki-duotone:after {
  content: "\ebad";
  
  opacity: 0.3;
}
.ki-magnifier.ki-duotone:before {
  content: "\ebae";
  position: absolute;
  
}
.ki-map.ki-duotone:after {
  content: "\ebaf";
  
  opacity: 0.3;
}
.ki-map.ki-duotone:before {
  content: "\ebb0";
  position: absolute;
  
}
.ki-mask.ki-duotone:after {
  content: "\ebb1";
  
  opacity: 0.3;
}
.ki-mask.ki-duotone:before {
  content: "\ebb2";
  position: absolute;
  
}
.ki-maximize.ki-duotone:after {
  content: "\ebb3";
  
  opacity: 0.3;
}
.ki-maximize.ki-duotone:before {
  content: "\ebb4";
  position: absolute;
  
}
.ki-medal-star.ki-duotone:after {
  content: "\ebb5";
  
  opacity: 0.3;
}
.ki-medal-star.ki-duotone:before {
  content: "\ebb6";
  position: absolute;
  
}
.ki-menu.ki-duotone:after {
  content: "\ebb7";
  
  opacity: 0.3;
}
.ki-menu.ki-duotone:before {
  content: "\ebb8";
  position: absolute;
  
}
.ki-message-add.ki-duotone:after {
  content: "\ebb9";
  
  opacity: 0.3;
}
.ki-message-add.ki-duotone:before {
  content: "\ebba";
  position: absolute;
  
}
.ki-message-edit.ki-duotone:after {
  content: "\ebbb";
  
  opacity: 0.3;
}
.ki-message-edit.ki-duotone:before {
  content: "\ebbc";
  position: absolute;
  
}
.ki-message-minus.ki-duotone:after {
  content: "\ebbd";
  
  opacity: 0.3;
}
.ki-message-minus.ki-duotone:before {
  content: "\ebbe";
  position: absolute;
  
}
.ki-message-notify.ki-duotone:after {
  content: "\ebbf";
  
  opacity: 0.3;
}
.ki-message-notify.ki-duotone:before {
  content: "\ebc0";
  position: absolute;
  
}
.ki-message-programming.ki-duotone:after {
  content: "\ebc1";
  
  opacity: 0.3;
}
.ki-message-programming.ki-duotone:before {
  content: "\ebc2";
  position: absolute;
  
}
.ki-message-question.ki-duotone:after {
  content: "\ebc3";
  
  opacity: 0.3;
}
.ki-message-question.ki-duotone:before {
  content: "\ebc4";
  position: absolute;
  
}
.ki-message-text-2.ki-duotone:after {
  content: "\ebc5";
  
  opacity: 0.3;
}
.ki-message-text-2.ki-duotone:before {
  content: "\ebc6";
  position: absolute;
  
}
.ki-message-text.ki-duotone:after {
  content: "\ebc7";
  
  opacity: 0.3;
}
.ki-message-text.ki-duotone:before {
  content: "\ebc8";
  position: absolute;
  
}
.ki-messages.ki-duotone:after {
  content: "\ebc9";
  
  opacity: 0.3;
}
.ki-messages.ki-duotone:before {
  content: "\ebca";
  position: absolute;
  
}
.ki-microsoft.ki-duotone:after {
  content: "\ebcb";
  
}
.ki-microsoft.ki-duotone:before {
  content: "\ebcc";
  position: absolute;
  
  opacity: 0.3;
}
.ki-milk.ki-duotone:after {
  content: "\ebcd";
  
  opacity: 0.3;
}
.ki-milk.ki-duotone:before {
  content: "\ebce";
  position: absolute;
  
}
.ki-minus-circle.ki-duotone:after {
  content: "\ebcf";
  
  opacity: 0.3;
}
.ki-minus-circle.ki-duotone:before {
  content: "\ebd0";
  position: absolute;
  
}
.ki-minus-folder.ki-duotone:after {
  content: "\ebd1";
  
  opacity: 0.3;
}
.ki-minus-folder.ki-duotone:before {
  content: "\ebd2";
  position: absolute;
  
}
.ki-minus-squared.ki-duotone:after {
  content: "\ebd3";
  
  opacity: 0.3;
}
.ki-minus-squared.ki-duotone:before {
  content: "\ebd4";
  position: absolute;
  
}
.ki-minus.ki-duotone:before {
  content: "\ebd5";
}
.ki-moon.ki-duotone:after {
  content: "\ebd6";
  
}
.ki-moon.ki-duotone:before {
  content: "\ebd7";
  position: absolute;
  
  opacity: 0.3;
}
.ki-more-2.ki-duotone:after {
  content: "\ebd8";
  
  opacity: 0.3;
}
.ki-more-2.ki-duotone:before {
  content: "\ebd9";
  position: absolute;
  
}
.ki-mouse-circle.ki-duotone:after {
  content: "\ebda";
  
}
.ki-mouse-circle.ki-duotone:before {
  content: "\ebdb";
  position: absolute;
  
  opacity: 0.3;
}
.ki-mouse-square.ki-duotone:after {
  content: "\ebdc";
  
  opacity: 0.3;
}
.ki-mouse-square.ki-duotone:before {
  content: "\ebdd";
  position: absolute;
  
}
.ki-mouse.ki-duotone:after {
  content: "\ebde";
  
  opacity: 0.3;
}
.ki-mouse.ki-duotone:before {
  content: "\ebdf";
  position: absolute;
  
}
.ki-nexo.ki-duotone:after {
  content: "\ebe0";
  
  opacity: 0.3;
}
.ki-nexo.ki-duotone:before {
  content: "\ebe1";
  position: absolute;
  
}
.ki-night-day.ki-duotone:after {
  content: "\ebe2";
  
  opacity: 0.3;
}
.ki-night-day.ki-duotone:before {
  content: "\ebe3";
  position: absolute;
  
}
.ki-note-2.ki-duotone:after {
  content: "\ebe4";
  
  opacity: 0.3;
}
.ki-note-2.ki-duotone:before {
  content: "\ebe5";
  position: absolute;
  
}
.ki-note.ki-duotone:after {
  content: "\ebe6";
  
  opacity: 0.3;
}
.ki-note.ki-duotone:before {
  content: "\ebe7";
  position: absolute;
  
}
.ki-notepad-bookmark.ki-duotone:after {
  content: "\ebe8";
  
}
.ki-notepad-bookmark.ki-duotone:before {
  content: "\ebe9";
  position: absolute;
  
  opacity: 0.3;
}
.ki-notepad-edit.ki-duotone:after {
  content: "\ebea";
  
  opacity: 0.3;
}
.ki-notepad-edit.ki-duotone:before {
  content: "\ebeb";
  position: absolute;
  
}
.ki-notepad.ki-duotone:after {
  content: "\ebec";
  
  opacity: 0.3;
}
.ki-notepad.ki-duotone:before {
  content: "\ebed";
  position: absolute;
  
}
.ki-notification-1.ki-duotone:after {
  content: "\ebee";
  
}
.ki-notification-1.ki-duotone:before {
  content: "\ebef";
  position: absolute;
  
  opacity: 0.3;
}
.ki-notification-bing.ki-duotone:after {
  content: "\ebf0";
  
}
.ki-notification-bing.ki-duotone:before {
  content: "\ebf1";
  position: absolute;
  
  opacity: 0.3;
}
.ki-notification-circle.ki-duotone:after {
  content: "\ebf2";
  
}
.ki-notification-circle.ki-duotone:before {
  content: "\ebf3";
  position: absolute;
  
  opacity: 0.3;
}
.ki-notification-favorite.ki-duotone:after {
  content: "\ebf4";
  
}
.ki-notification-favorite.ki-duotone:before {
  content: "\ebf5";
  position: absolute;
  
  opacity: 0.3;
}
.ki-notification-on.ki-duotone:after {
  content: "\ebf6";
  
  opacity: 0.3;
}
.ki-notification-on.ki-duotone:before {
  content: "\ebf7";
  position: absolute;
  
}
.ki-notification-status.ki-duotone:after {
  content: "\ebf8";
  
  opacity: 0.3;
}
.ki-notification-status.ki-duotone:before {
  content: "\ebf9";
  position: absolute;
  
}
.ki-notification.ki-duotone:after {
  content: "\ebfa";
  
  opacity: 0.3;
}
.ki-notification.ki-duotone:before {
  content: "\ebfb";
  position: absolute;
  
}
.ki-ocean.ki-duotone:after {
  content: "\ebfc";
  
}
.ki-ocean.ki-duotone:before {
  content: "\ebfd";
  position: absolute;
  
  opacity: 0.3;
}
.ki-office-bag.ki-duotone:after {
  content: "\ebfe";
  
  opacity: 0.3;
}
.ki-office-bag.ki-duotone:before {
  content: "\ebff";
  position: absolute;
  
}
.ki-package.ki-duotone:after {
  content: "\ec00";
  
  opacity: 0.3;
}
.ki-package.ki-duotone:before {
  content: "\ec01";
  position: absolute;
  
}
.ki-pad.ki-duotone:after {
  content: "\ec02";
  
  opacity: 0.3;
}
.ki-pad.ki-duotone:before {
  content: "\ec03";
  position: absolute;
  
}
.ki-pails.ki-duotone:after {
  content: "\ec04";
  
  opacity: 0.3;
}
.ki-pails.ki-duotone:before {
  content: "\ec05";
  position: absolute;
  
}
.ki-paintbucket.ki-duotone:after {
  content: "\ec06";
  
  opacity: 0.3;
}
.ki-paintbucket.ki-duotone:before {
  content: "\ec07";
  position: absolute;
  
}
.ki-paper-clip.ki-duotone:before {
  content: "\ec08";
}
.ki-paper-plane.ki-duotone:after {
  content: "\ec09";
  
}
.ki-paper-plane.ki-duotone:before {
  content: "\ec0a";
  position: absolute;
  
  opacity: 0.3;
}
.ki-parcel-tracking.ki-duotone:after {
  content: "\ec0b";
  
}
.ki-parcel-tracking.ki-duotone:before {
  content: "\ec0c";
  position: absolute;
  
  opacity: 0.3;
}
.ki-parcel.ki-duotone:after {
  content: "\ec0d";
  
  opacity: 0.3;
}
.ki-parcel.ki-duotone:before {
  content: "\ec0e";
  position: absolute;
  
}
.ki-password-check.ki-duotone:after {
  content: "\ec0f";
  
}
.ki-password-check.ki-duotone:before {
  content: "\ec10";
  position: absolute;
  
  opacity: 0.3;
}
.ki-paypal.ki-duotone:after {
  content: "\ec11";
  
}
.ki-paypal.ki-duotone:before {
  content: "\ec12";
  position: absolute;
  
  opacity: 0.3;
}
.ki-pencil.ki-duotone:after {
  content: "\ec13";
  
  opacity: 0.3;
}
.ki-pencil.ki-duotone:before {
  content: "\ec14";
  position: absolute;
  
}
.ki-people.ki-duotone:after {
  content: "\ec15";
  
}
.ki-people.ki-duotone:before {
  content: "\ec16";
  position: absolute;
  
  opacity: 0.3;
}
.ki-percentage.ki-duotone:after {
  content: "\ec17";
  
}
.ki-percentage.ki-duotone:before {
  content: "\ec18";
  position: absolute;
  
  opacity: 0.3;
}
.ki-phone.ki-duotone:after {
  content: "\ec19";
  
  opacity: 0.3;
}
.ki-phone.ki-duotone:before {
  content: "\ec1a";
  position: absolute;
  
}
.ki-photoshop.ki-duotone:after {
  content: "\ec1b";
  
  opacity: 0.3;
}
.ki-photoshop.ki-duotone:before {
  content: "\ec1c";
  position: absolute;
  
}
.ki-picture.ki-duotone:after {
  content: "\ec1d";
  
  opacity: 0.3;
}
.ki-picture.ki-duotone:before {
  content: "\ec1e";
  position: absolute;
  
}
.ki-pill.ki-duotone:before {
  content: "\ec1f";
}
.ki-pin.ki-duotone:after {
  content: "\ec20";
  
  opacity: 0.3;
}
.ki-pin.ki-duotone:before {
  content: "\ec21";
  position: absolute;
  
}
.ki-plus-circle.ki-duotone:after {
  content: "\ec22";
  
  opacity: 0.3;
}
.ki-plus-circle.ki-duotone:before {
  content: "\ec23";
  position: absolute;
  
}
.ki-plus-squared.ki-duotone:after {
  content: "\ec24";
  
  opacity: 0.3;
}
.ki-plus-squared.ki-duotone:before {
  content: "\ec25";
  position: absolute;
  
}
.ki-plus.ki-duotone:before {
  content: "\ec26";
}
.ki-pointers.ki-duotone:after {
  content: "\ec27";
  
  opacity: 0.3;
}
.ki-pointers.ki-duotone:before {
  content: "\ec28";
  position: absolute;
  
}
.ki-price-tag.ki-duotone:after {
  content: "\ec29";
  
  opacity: 0.3;
}
.ki-price-tag.ki-duotone:before {
  content: "\ec2a";
  position: absolute;
  
}
.ki-printer.ki-duotone:after {
  content: "\ec2b";
  
  opacity: 0.3;
}
.ki-printer.ki-duotone:before {
  content: "\ec2c";
  position: absolute;
  
}
.ki-profile-circle.ki-duotone:after {
  content: "\ec2d";
  
  opacity: 0.3;
}
.ki-profile-circle.ki-duotone:before {
  content: "\ec2e";
  position: absolute;
  
}
.ki-pulse.ki-duotone:after {
  content: "\ec2f";
  
  opacity: 0.3;
}
.ki-pulse.ki-duotone:before {
  content: "\ec30";
  position: absolute;
  
}
.ki-purchase.ki-duotone:after {
  content: "\ec31";
  
  opacity: 0.3;
}
.ki-purchase.ki-duotone:before {
  content: "\ec32";
  position: absolute;
  
}
.ki-python.ki-duotone:after {
  content: "\ec33";
  
  opacity: 0.3;
}
.ki-python.ki-duotone:before {
  content: "\ec34";
  position: absolute;
  
}
.ki-question-2.ki-duotone:after {
  content: "\ec35";
  
  opacity: 0.3;
}
.ki-question-2.ki-duotone:before {
  content: "\ec36";
  position: absolute;
  
}
.ki-question.ki-duotone:after {
  content: "\ec37";
  
  opacity: 0.3;
}
.ki-question.ki-duotone:before {
  content: "\ec38";
  position: absolute;
  
}
.ki-questionnaire-tablet.ki-duotone:after {
  content: "\ec39";
  
  opacity: 0.3;
}
.ki-questionnaire-tablet.ki-duotone:before {
  content: "\ec3a";
  position: absolute;
  
}
.ki-ranking.ki-duotone:after {
  content: "\ec3b";
  
  opacity: 0.3;
}
.ki-ranking.ki-duotone:before {
  content: "\ec3c";
  position: absolute;
  
}
.ki-react.ki-duotone:after {
  content: "\ec3d";
  
  opacity: 0.3;
}
.ki-react.ki-duotone:before {
  content: "\ec3e";
  position: absolute;
  
}
.ki-receipt-square.ki-duotone:after {
  content: "\ec3f";
  
  opacity: 0.3;
}
.ki-receipt-square.ki-duotone:before {
  content: "\ec40";
  position: absolute;
  
}
.ki-rescue.ki-duotone:after {
  content: "\ec41";
  
  opacity: 0.3;
}
.ki-rescue.ki-duotone:before {
  content: "\ec42";
  position: absolute;
  
}
.ki-right-left.ki-duotone:after {
  content: "\ec43";
  
}
.ki-right-left.ki-duotone:before {
  content: "\ec44";
  position: absolute;
  
  opacity: 0.3;
}
.ki-right-square.ki-duotone:after {
  content: "\ec45";
  
  opacity: 0.3;
}
.ki-right-square.ki-duotone:before {
  content: "\ec46";
  position: absolute;
  
}
.ki-right.ki-duotone:before {
  content: "\ec47";
}
.ki-rocket.ki-duotone:after {
  content: "\ec48";
  
  opacity: 0.3;
}
.ki-rocket.ki-duotone:before {
  content: "\ec49";
  position: absolute;
  
}
.ki-route.ki-duotone:after {
  content: "\ec4a";
  
}
.ki-route.ki-duotone:before {
  content: "\ec4b";
  position: absolute;
  
  opacity: 0.3;
}
.ki-router.ki-duotone:after {
  content: "\ec4c";
  
  opacity: 0.3;
}
.ki-router.ki-duotone:before {
  content: "\ec4d";
  position: absolute;
  
}
.ki-row-horizontal.ki-duotone:after {
  content: "\ec4e";
  
}
.ki-row-horizontal.ki-duotone:before {
  content: "\ec4f";
  position: absolute;
  
  opacity: 0.3;
}
.ki-row-vertical.ki-duotone:after {
  content: "\ec50";
  
}
.ki-row-vertical.ki-duotone:before {
  content: "\ec51";
  position: absolute;
  
  opacity: 0.3;
}
.ki-safe-home.ki-duotone:after {
  content: "\ec52";
  
  opacity: 0.3;
}
.ki-safe-home.ki-duotone:before {
  content: "\ec53";
  position: absolute;
  
}
.ki-satellite.ki-duotone:after {
  content: "\ec54";
  
  opacity: 0.3;
}
.ki-satellite.ki-duotone:before {
  content: "\ec55";
  position: absolute;
  
}
.ki-save-2.ki-duotone:after {
  content: "\ec56";
  
  opacity: 0.3;
}
.ki-save-2.ki-duotone:before {
  content: "\ec57";
  position: absolute;
  
}
.ki-save-deposit.ki-duotone:after {
  content: "\ec58";
  
}
.ki-save-deposit.ki-duotone:before {
  content: "\ec59";
  position: absolute;
  
  opacity: 0.3;
}
.ki-scan-barcode.ki-duotone:after {
  content: "\ec5a";
  
}
.ki-scan-barcode.ki-duotone:before {
  content: "\ec5b";
  position: absolute;
  
  opacity: 0.3;
}
.ki-screen.ki-duotone:after {
  content: "\ec5c";
  
  opacity: 0.3;
}
.ki-screen.ki-duotone:before {
  content: "\ec5d";
  position: absolute;
  
}
.ki-scroll.ki-duotone:after {
  content: "\ec5e";
  
  opacity: 0.3;
}
.ki-scroll.ki-duotone:before {
  content: "\ec5f";
  position: absolute;
  
}
.ki-search-list.ki-duotone:after {
  content: "\ec60";
  
  opacity: 0.3;
}
.ki-search-list.ki-duotone:before {
  content: "\ec61";
  position: absolute;
  
}
.ki-security-user.ki-duotone:after {
  content: "\ec62";
  
  opacity: 0.3;
}
.ki-security-user.ki-duotone:before {
  content: "\ec63";
  position: absolute;
  
}
.ki-setting-2.ki-duotone:after {
  content: "\ec64";
  
  opacity: 0.3;
}
.ki-setting-2.ki-duotone:before {
  content: "\ec65";
  position: absolute;
  
}
.ki-setting-3.ki-duotone:after {
  content: "\ec66";
  
  opacity: 0.3;
}
.ki-setting-3.ki-duotone:before {
  content: "\ec67";
  position: absolute;
  
}
.ki-setting-4.ki-duotone:before {
  content: "\ec68";
}
.ki-setting.ki-duotone:after {
  content: "\ec69";
  
  opacity: 0.3;
}
.ki-setting.ki-duotone:before {
  content: "\ec6a";
  position: absolute;
  
}
.ki-share.ki-duotone:after {
  content: "\ec6b";
  
  opacity: 0.3;
}
.ki-share.ki-duotone:before {
  content: "\ec6c";
  position: absolute;
  
}
.ki-shield-cross.ki-duotone:after {
  content: "\ec6d";
  
  opacity: 0.3;
}
.ki-shield-cross.ki-duotone:before {
  content: "\ec6e";
  position: absolute;
  
}
.ki-shield-search.ki-duotone:after {
  content: "\ec6f";
  
  opacity: 0.3;
}
.ki-shield-search.ki-duotone:before {
  content: "\ec70";
  position: absolute;
  
}
.ki-shield-slash.ki-duotone:after {
  content: "\ec71";
  
}
.ki-shield-slash.ki-duotone:before {
  content: "\ec72";
  position: absolute;
  
  opacity: 0.3;
}
.ki-shield-tick.ki-duotone:after {
  content: "\ec73";
  
  opacity: 0.3;
}
.ki-shield-tick.ki-duotone:before {
  content: "\ec74";
  position: absolute;
  
}
.ki-shield.ki-duotone:after {
  content: "\ec75";
  
  opacity: 0.3;
}
.ki-shield.ki-duotone:before {
  content: "\ec76";
  position: absolute;
  
}
.ki-ship.ki-duotone:after {
  content: "\ec77";
  
  opacity: 0.3;
}
.ki-ship.ki-duotone:before {
  content: "\ec78";
  position: absolute;
  
}
.ki-shop.ki-duotone:after {
  content: "\ec79";
  
}
.ki-shop.ki-duotone:before {
  content: "\ec7a";
  position: absolute;
  
  opacity: 0.3;
}
.ki-simcard-2.ki-duotone:after {
  content: "\ec7b";
  
  opacity: 0.3;
}
.ki-simcard-2.ki-duotone:before {
  content: "\ec7c";
  position: absolute;
  
}
.ki-simcard.ki-duotone:after {
  content: "\ec7d";
  
  opacity: 0.3;
}
.ki-simcard.ki-duotone:before {
  content: "\ec7e";
  position: absolute;
  
}
.ki-size.ki-duotone:after {
  content: "\ec7f";
  
  opacity: 0.3;
}
.ki-size.ki-duotone:before {
  content: "\ec80";
  position: absolute;
  
}
.ki-slack.ki-duotone:after {
  content: "\ec81";
  
}
.ki-slack.ki-duotone:before {
  content: "\ec82";
  position: absolute;
  
  opacity: 0.3;
}
.ki-slider-horizontal-2.ki-duotone:after {
  content: "\ec83";
  
}
.ki-slider-horizontal-2.ki-duotone:before {
  content: "\ec84";
  position: absolute;
  
  opacity: 0.3;
}
.ki-slider-horizontal.ki-duotone:after {
  content: "\ec85";
  
  opacity: 0.3;
}
.ki-slider-horizontal.ki-duotone:before {
  content: "\ec86";
  position: absolute;
  
}
.ki-slider-vertica.ki-duotone:after {
  content: "\ec87";
  
  opacity: 0.3;
}
.ki-slider-vertica.ki-duotone:before {
  content: "\ec88";
  position: absolute;
  
}
.ki-slider-vertical.ki-duotone:after {
  content: "\ec89";
  
}
.ki-slider-vertical.ki-duotone:before {
  content: "\ec8a";
  position: absolute;
  
  opacity: 0.3;
}
.ki-slider.ki-duotone:after {
  content: "\ec8b";
  
  opacity: 0.3;
}
.ki-slider.ki-duotone:before {
  content: "\ec8c";
  position: absolute;
  
}
.ki-sms.ki-duotone:after {
  content: "\ec8d";
  
  opacity: 0.3;
}
.ki-sms.ki-duotone:before {
  content: "\ec8e";
  position: absolute;
  
}
.ki-snapchat.ki-duotone:after {
  content: "\ec8f";
  
}
.ki-snapchat.ki-duotone:before {
  content: "\ec90";
  position: absolute;
  
  opacity: 0.3;
}
.ki-social-media.ki-duotone:after {
  content: "\ec91";
  
}
.ki-social-media.ki-duotone:before {
  content: "\ec92";
  position: absolute;
  
  opacity: 0.3;
}
.ki-soft-2.ki-duotone:after {
  content: "\ec93";
  
  opacity: 0.3;
}
.ki-soft-2.ki-duotone:before {
  content: "\ec94";
  position: absolute;
  
}
.ki-soft-3.ki-duotone:after {
  content: "\ec95";
  
}
.ki-soft-3.ki-duotone:before {
  content: "\ec96";
  position: absolute;
  
  opacity: 0.3;
}
.ki-soft.ki-duotone:after {
  content: "\ec97";
  
  opacity: 0.3;
}
.ki-soft.ki-duotone:before {
  content: "\ec98";
  position: absolute;
  
}
.ki-some-files.ki-duotone:after {
  content: "\ec99";
  
  opacity: 0.3;
}
.ki-some-files.ki-duotone:before {
  content: "\ec9a";
  position: absolute;
  
}
.ki-sort.ki-duotone:after {
  content: "\ec9b";
  
  opacity: 0.3;
}
.ki-sort.ki-duotone:before {
  content: "\ec9c";
  position: absolute;
  
}
.ki-speaker.ki-duotone:after {
  content: "\ec9d";
  
  opacity: 0.3;
}
.ki-speaker.ki-duotone:before {
  content: "\ec9e";
  position: absolute;
  
}
.ki-spotify.ki-duotone:after {
  content: "\ec9f";
  
}
.ki-spotify.ki-duotone:before {
  content: "\eca0";
  position: absolute;
  
  opacity: 0.3;
}
.ki-spring-framework.ki-duotone:before {
  content: "\eca1";
}
.ki-square-brackets.ki-duotone:after {
  content: "\eca2";
  
  opacity: 0.3;
}
.ki-square-brackets.ki-duotone:before {
  content: "\eca3";
  position: absolute;
  
}
.ki-star.ki-duotone:before {
  content: "\eca4";
}
.ki-status.ki-duotone:after {
  content: "\eca5";
  
  opacity: 0.3;
}
.ki-status.ki-duotone:before {
  content: "\eca6";
  position: absolute;
  
}
.ki-subtitle.ki-duotone:after {
  content: "\eca7";
  
  opacity: 0.3;
}
.ki-subtitle.ki-duotone:before {
  content: "\eca8";
  position: absolute;
  
}
.ki-sun.ki-duotone:after {
  content: "\eca9";
  
  opacity: 0.3;
}
.ki-sun.ki-duotone:before {
  content: "\ecaa";
  position: absolute;
  
}
.ki-support.ki-duotone:after {
  content: "\ecab";
  
  opacity: 0.3;
}
.ki-support.ki-duotone:before {
  content: "\ecac";
  position: absolute;
  
}
.ki-switch.ki-duotone:after {
  content: "\ecad";
  
}
.ki-switch.ki-duotone:before {
  content: "\ecae";
  position: absolute;
  
  opacity: 0.3;
}
.ki-syringe.ki-duotone:after {
  content: "\ecaf";
  
  opacity: 0.3;
}
.ki-syringe.ki-duotone:before {
  content: "\ecb0";
  position: absolute;
  
}
.ki-tab-tablet.ki-duotone:after {
  content: "\ecb1";
  
  opacity: 0.3;
}
.ki-tab-tablet.ki-duotone:before {
  content: "\ecb2";
  position: absolute;
  
}
.ki-tablet-delete.ki-duotone:after {
  content: "\ecb3";
  
  opacity: 0.3;
}
.ki-tablet-delete.ki-duotone:before {
  content: "\ecb4";
  position: absolute;
  
}
.ki-tablet-down.ki-duotone:after {
  content: "\ecb5";
  
  opacity: 0.3;
}
.ki-tablet-down.ki-duotone:before {
  content: "\ecb6";
  position: absolute;
  
}
.ki-tablet-ok.ki-duotone:after {
  content: "\ecb7";
  
  opacity: 0.3;
}
.ki-tablet-ok.ki-duotone:before {
  content: "\ecb8";
  position: absolute;
  
}
.ki-tablet-text-down.ki-duotone:after {
  content: "\ecb9";
  
  opacity: 0.3;
}
.ki-tablet-text-down.ki-duotone:before {
  content: "\ecba";
  position: absolute;
  
}
.ki-tablet-text-up.ki-duotone:after {
  content: "\ecbb";
  
}
.ki-tablet-text-up.ki-duotone:before {
  content: "\ecbc";
  position: absolute;
  
  opacity: 0.3;
}
.ki-tablet-up.ki-duotone:after {
  content: "\ecbd";
  
  opacity: 0.3;
}
.ki-tablet-up.ki-duotone:before {
  content: "\ecbe";
  position: absolute;
  
}
.ki-tablet.ki-duotone:after {
  content: "\ecbf";
  
}
.ki-tablet.ki-duotone:before {
  content: "\ecc0";
  position: absolute;
  
  opacity: 0.3;
}
.ki-tag-cross.ki-duotone:after {
  content: "\ecc1";
  
}
.ki-tag-cross.ki-duotone:before {
  content: "\ecc2";
  position: absolute;
  
  opacity: 0.3;
}
.ki-tag.ki-duotone:after {
  content: "\ecc3";
  
  opacity: 0.3;
}
.ki-tag.ki-duotone:before {
  content: "\ecc4";
  position: absolute;
  
}
.ki-teacher.ki-duotone:after {
  content: "\ecc5";
  
  opacity: 0.3;
}
.ki-teacher.ki-duotone:before {
  content: "\ecc6";
  position: absolute;
  
}
.ki-technology-1.ki-duotone:after {
  content: "\ecc7";
  
}
.ki-technology-1.ki-duotone:before {
  content: "\ecc8";
  position: absolute;
  
  opacity: 0.3;
}
.ki-technology-2.ki-duotone:after {
  content: "\ecc9";
  
  opacity: 0.3;
}
.ki-technology-2.ki-duotone:before {
  content: "\ecca";
  position: absolute;
  
}
.ki-technology-3.ki-duotone:after {
  content: "\eccb";
  
  opacity: 0.3;
}
.ki-technology-3.ki-duotone:before {
  content: "\eccc";
  position: absolute;
  
}
.ki-technology-4.ki-duotone:after {
  content: "\eccd";
  
  opacity: 0.3;
}
.ki-technology-4.ki-duotone:before {
  content: "\ecce";
  position: absolute;
  
}
.ki-telephone-geolocation.ki-duotone:after {
  content: "\eccf";
  
  opacity: 0.3;
}
.ki-telephone-geolocation.ki-duotone:before {
  content: "\ecd0";
  position: absolute;
  
}
.ki-test-tubes.ki-duotone:after {
  content: "\ecd1";
  
  opacity: 0.3;
}
.ki-test-tubes.ki-duotone:before {
  content: "\ecd2";
  position: absolute;
  
}
.ki-text-bold.ki-duotone:after {
  content: "\ecd3";
  
  opacity: 0.3;
}
.ki-text-bold.ki-duotone:before {
  content: "\ecd4";
  position: absolute;
  
}
.ki-text-circle.ki-duotone:after {
  content: "\ecd5";
  
  opacity: 0.3;
}
.ki-text-circle.ki-duotone:before {
  content: "\ecd6";
  position: absolute;
  
}
.ki-text-italic.ki-duotone:after {
  content: "\ecd7";
  
  opacity: 0.3;
}
.ki-text-italic.ki-duotone:before {
  content: "\ecd8";
  position: absolute;
  
}
.ki-text-number.ki-duotone:after {
  content: "\ecd9";
  
  opacity: 0.3;
}
.ki-text-number.ki-duotone:before {
  content: "\ecda";
  position: absolute;
  
}
.ki-text-strikethrough.ki-duotone:after {
  content: "\ecdb";
  
  opacity: 0.3;
}
.ki-text-strikethrough.ki-duotone:before {
  content: "\ecdc";
  position: absolute;
  
}
.ki-text-underline.ki-duotone:after {
  content: "\ecdd";
  
  opacity: 0.3;
}
.ki-text-underline.ki-duotone:before {
  content: "\ecde";
  position: absolute;
  
}
.ki-text.ki-duotone:before {
  content: "\ecdf";
}
.ki-textalign-center.ki-duotone:after {
  content: "\ece0";
  
}
.ki-textalign-center.ki-duotone:before {
  content: "\ece1";
  position: absolute;
  
  opacity: 0.3;
}
.ki-textalign-justifycenter.ki-duotone:after {
  content: "\ece2";
  
}
.ki-textalign-justifycenter.ki-duotone:before {
  content: "\ece3";
  position: absolute;
  
  opacity: 0.3;
}
.ki-textalign-left.ki-duotone:after {
  content: "\ece4";
  
}
.ki-textalign-left.ki-duotone:before {
  content: "\ece5";
  position: absolute;
  
  opacity: 0.3;
}
.ki-textalign-right.ki-duotone:after {
  content: "\ece6";
  
}
.ki-textalign-right.ki-duotone:before {
  content: "\ece7";
  position: absolute;
  
  opacity: 0.3;
}
.ki-thermometer.ki-duotone:after {
  content: "\ece8";
  
  opacity: 0.3;
}
.ki-thermometer.ki-duotone:before {
  content: "\ece9";
  position: absolute;
  
}
.ki-theta-theta.ki-duotone:after {
  content: "\ecea";
  
}
.ki-theta-theta.ki-duotone:before {
  content: "\eceb";
  position: absolute;
  
  opacity: 0.3;
}
.ki-tiktok.ki-duotone:after {
  content: "\ecec";
  
  opacity: 0.3;
}
.ki-tiktok.ki-duotone:before {
  content: "\eced";
  position: absolute;
  
}
.ki-time.ki-duotone:after {
  content: "\ecee";
  
  opacity: 0.3;
}
.ki-time.ki-duotone:before {
  content: "\ecef";
  position: absolute;
  
}
.ki-timer.ki-duotone:after {
  content: "\ecf0";
  
  opacity: 0.3;
}
.ki-timer.ki-duotone:before {
  content: "\ecf1";
  position: absolute;
  
}
.ki-to-left.ki-duotone:before {
  content: "\ecf2";
}
.ki-to-right.ki-duotone:before {
  content: "\ecf3";
}
.ki-toggle-off-circle.ki-duotone:after {
  content: "\ecf4";
  
  opacity: 0.3;
}
.ki-toggle-off-circle.ki-duotone:before {
  content: "\ecf5";
  position: absolute;
  
}
.ki-toggle-off.ki-duotone:after {
  content: "\ecf6";
  
  opacity: 0.3;
}
.ki-toggle-off.ki-duotone:before {
  content: "\ecf7";
  position: absolute;
  
}
.ki-toggle-on-circle.ki-duotone:after {
  content: "\ecf8";
  
  opacity: 0.3;
}
.ki-toggle-on-circle.ki-duotone:before {
  content: "\ecf9";
  position: absolute;
  
}
.ki-toggle-on.ki-duotone:after {
  content: "\ecfa";
  
  opacity: 0.3;
}
.ki-toggle-on.ki-duotone:before {
  content: "\ecfb";
  position: absolute;
  
}
.ki-trash-square.ki-duotone:after {
  content: "\ecfc";
  
  opacity: 0.3;
}
.ki-trash-square.ki-duotone:before {
  content: "\ecfd";
  position: absolute;
  
}
.ki-trash.ki-duotone:after {
  content: "\ecfe";
  
  opacity: 0.3;
}
.ki-trash.ki-duotone:before {
  content: "\ecff";
  position: absolute;
  
}
.ki-tree.ki-duotone:after {
  content: "\ed00";
  
  opacity: 0.3;
}
.ki-tree.ki-duotone:before {
  content: "\ed01";
  position: absolute;
  
}
.ki-trello.ki-duotone:after {
  content: "\ed02";
  
  opacity: 0.3;
}
.ki-trello.ki-duotone:before {
  content: "\ed03";
  position: absolute;
  
}
.ki-ts.ki-duotone:after {
  content: "\ed04";
  
  opacity: 0.3;
}
.ki-ts.ki-duotone:before {
  content: "\ed05";
  position: absolute;
  
}
.ki-twitch.ki-duotone:after {
  content: "\ed06";
  
  opacity: 0.3;
}
.ki-twitch.ki-duotone:before {
  content: "\ed07";
  position: absolute;
  
}
.ki-twitter.ki-duotone:after {
  content: "\ed08";
  
  opacity: 0.3;
}
.ki-twitter.ki-duotone:before {
  content: "\ed09";
  position: absolute;
  
}
.ki-two-credit-cart.ki-duotone:after {
  content: "\ed0a";
  
  opacity: 0.3;
}
.ki-two-credit-cart.ki-duotone:before {
  content: "\ed0b";
  position: absolute;
  
}
.ki-underlining.ki-duotone:after {
  content: "\ed0c";
  
  opacity: 0.3;
}
.ki-underlining.ki-duotone:before {
  content: "\ed0d";
  position: absolute;
  
}
.ki-up-diagonal.ki-duotone:after {
  content: "\ed0e";
  
  opacity: 0.3;
}
.ki-up-diagonal.ki-duotone:before {
  content: "\ed0f";
  position: absolute;
  
}
.ki-up-down.ki-duotone:after {
  content: "\ed10";
  
  opacity: 0.3;
}
.ki-up-down.ki-duotone:before {
  content: "\ed11";
  position: absolute;
  
}
.ki-up-square.ki-duotone:after {
  content: "\ed12";
  
  opacity: 0.3;
}
.ki-up-square.ki-duotone:before {
  content: "\ed13";
  position: absolute;
  
}
.ki-up.ki-duotone:before {
  content: "\ed14";
}
.ki-update-file.ki-duotone:after {
  content: "\ed15";
  
  opacity: 0.3;
}
.ki-update-file.ki-duotone:before {
  content: "\ed16";
  position: absolute;
  
}
.ki-update-folder.ki-duotone:after {
  content: "\ed17";
  
  opacity: 0.3;
}
.ki-update-folder.ki-duotone:before {
  content: "\ed18";
  position: absolute;
  
}
.ki-user-edit.ki-duotone:after {
  content: "\ed19";
  
  opacity: 0.3;
}
.ki-user-edit.ki-duotone:before {
  content: "\ed1a";
  position: absolute;
  
}
.ki-user-square.ki-duotone:after {
  content: "\ed1b";
  
  opacity: 0.3;
}
.ki-user-square.ki-duotone:before {
  content: "\ed1c";
  position: absolute;
  
}
.ki-user-tick.ki-duotone:after {
  content: "\ed1d";
  
}
.ki-user-tick.ki-duotone:before {
  content: "\ed1e";
  position: absolute;
  
  opacity: 0.3;
}
.ki-user.ki-duotone:after {
  content: "\ed1f";
  
  opacity: 0.3;
}
.ki-user.ki-duotone:before {
  content: "\ed20";
  position: absolute;
  
}
.ki-users.ki-duotone:after {
  content: "\ed21";
  
  opacity: 0.3;
}
.ki-users.ki-duotone:before {
  content: "\ed22";
  position: absolute;
  
}
.ki-verify.ki-duotone:after {
  content: "\ed23";
  
  opacity: 0.3;
}
.ki-verify.ki-duotone:before {
  content: "\ed24";
  position: absolute;
  
}
.ki-vibe-vibe.ki-duotone:after {
  content: "\ed25";
  
}
.ki-vibe-vibe.ki-duotone:before {
  content: "\ed26";
  position: absolute;
  
  opacity: 0.3;
}
.ki-virus.ki-duotone:after {
  content: "\ed27";
  
  opacity: 0.3;
}
.ki-virus.ki-duotone:before {
  content: "\ed28";
  position: absolute;
  
}
.ki-vue.ki-duotone:after {
  content: "\ed29";
  
  opacity: 0.3;
}
.ki-vue.ki-duotone:before {
  content: "\ed2a";
  position: absolute;
  
}
.ki-vuesax.ki-duotone:after {
  content: "\ed2b";
  
  opacity: 0.4;
}
.ki-vuesax.ki-duotone:before {
  content: "\ed2c";
  position: absolute;
  
}
.ki-wallet.ki-duotone:after {
  content: "\ed2d";
  
  opacity: 0.3;
}
.ki-wallet.ki-duotone:before {
  content: "\ed2e";
  position: absolute;
  
}
.ki-wanchain-wan.ki-duotone:after {
  content: "\ed2f";
  
}
.ki-wanchain-wan.ki-duotone:before {
  content: "\ed30";
  position: absolute;
  
  opacity: 0.3;
}
.ki-watch.ki-duotone:after {
  content: "\ed31";
  
  opacity: 0.3;
}
.ki-watch.ki-duotone:before {
  content: "\ed32";
  position: absolute;
  
}
.ki-whatsapp.ki-duotone:after {
  content: "\ed33";
  
  opacity: 0.4;
}
.ki-whatsapp.ki-duotone:before {
  content: "\ed34";
  position: absolute;
  
}
.ki-wifi-home.ki-duotone:after {
  content: "\ed35";
  
  opacity: 0.3;
}
.ki-wifi-home.ki-duotone:before {
  content: "\ed36";
  position: absolute;
  
}
.ki-wifi-square.ki-duotone:after {
  content: "\ed37";
  
  opacity: 0.3;
}
.ki-wifi-square.ki-duotone:before {
  content: "\ed38";
  position: absolute;
  
}
.ki-wifi.ki-duotone:after {
  content: "\ed39";
  
}
.ki-wifi.ki-duotone:before {
  content: "\ed3a";
  position: absolute;
  
  opacity: 0.3;
}
.ki-wireframe.ki-duotone:after {
  content: "\ed3b";
  
}
.ki-wireframe.ki-duotone:before {
  content: "\ed3c";
  position: absolute;
  
  opacity: 0.3;
}
.ki-wlan.ki-duotone:after {
  content: "\ed3d";
  
  opacity: 0.3;
}
.ki-wlan.ki-duotone:before {
  content: "\ed3e";
  position: absolute;
  
}
.ki-wrench.ki-duotone:after {
  content: "\ed3f";
  
  opacity: 0.3;
}
.ki-wrench.ki-duotone:before {
  content: "\ed40";
  position: absolute;
  
}
.ki-xaomi.ki-duotone:after {
  content: "\ed41";
  
}
.ki-xaomi.ki-duotone:before {
  content: "\ed42";
  position: absolute;
  
  opacity: 0.3;
}
.ki-xd.ki-duotone:after {
  content: "\ed43";
  
  opacity: 0.3;
}
.ki-xd.ki-duotone:before {
  content: "\ed44";
  position: absolute;
  
}
.ki-xmr.ki-duotone:after {
  content: "\ed45";
  
}
.ki-xmr.ki-duotone:before {
  content: "\ed46";
  position: absolute;
  
  opacity: 0.3;
}
.ki-yii.ki-duotone:after {
  content: "\ed47";
  
  opacity: 0.3;
}
.ki-yii.ki-duotone:before {
  content: "\ed48";
  position: absolute;
  
}
.ki-youtube.ki-duotone:after {
  content: "\ed49";
  
}
.ki-youtube.ki-duotone:before {
  content: "\ed4a";
  position: absolute;
  
  opacity: 0.3;
}

@font-face {
  font-family: 'keenicons-filled';
  src:
    url('fonts/keenicons-filled.ttf?nz57rx') format('truetype'),
    url('fonts/keenicons-filled.woff?nz57rx') format('woff'),
    url('fonts/keenicons-filled.svg?nz57rx#keenicons-filled') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

.ki-filled {
  line-height: 1;
  position: relative;
  display: inline-flex;
}

.ki-filled:after, 
.ki-filled:before {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'keenicons-filled' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  display: inline-flex;
}

.ki-abstract-1.ki-filled:after {
  content: "\e900";
  
  opacity: 0.1;
}
.ki-abstract-1.ki-filled:before {
  content: "\e901";
  position: absolute;
  
}
.ki-abstract-2.ki-filled:after {
  content: "\e902";
  
  opacity: 0.1;
}
.ki-abstract-2.ki-filled:before {
  content: "\e903";
  position: absolute;
  
}
.ki-abstract-3.ki-filled:after {
  content: "\e904";
  
  opacity: 0.1;
}
.ki-abstract-3.ki-filled:before {
  content: "\e905";
  position: absolute;
  
}
.ki-abstract-4.ki-filled:after {
  content: "\e906";
  
  opacity: 0.1;
}
.ki-abstract-4.ki-filled:before {
  content: "\e907";
  position: absolute;
  
}
.ki-abstract-5.ki-filled:after {
  content: "\e908";
  
  opacity: 0.1;
}
.ki-abstract-5.ki-filled:before {
  content: "\e909";
  position: absolute;
  
}
.ki-abstract-6.ki-filled:after {
  content: "\e90a";
  
  opacity: 0.1;
}
.ki-abstract-6.ki-filled:before {
  content: "\e90b";
  position: absolute;
  
}
.ki-abstract-7.ki-filled:after {
  content: "\e90c";
  
}
.ki-abstract-7.ki-filled:before {
  content: "\e90d";
  position: absolute;
  
  opacity: 0.1;
}
.ki-abstract-8.ki-filled:after {
  content: "\e90e";
  
  opacity: 0.1;
}
.ki-abstract-8.ki-filled:before {
  content: "\e90f";
  position: absolute;
  
}
.ki-abstract-9.ki-filled:after {
  content: "\e910";
  
  opacity: 0.1;
}
.ki-abstract-9.ki-filled:before {
  content: "\e911";
  position: absolute;
  
}
.ki-abstract-10.ki-filled:after {
  content: "\e912";
  
  opacity: 0.1;
}
.ki-abstract-10.ki-filled:before {
  content: "\e913";
  position: absolute;
  
}
.ki-abstract-11.ki-filled:after {
  content: "\e914";
  
  opacity: 0.1;
}
.ki-abstract-11.ki-filled:before {
  content: "\e915";
  position: absolute;
  
}
.ki-abstract-12.ki-filled:after {
  content: "\e916";
  
  opacity: 0.1;
}
.ki-abstract-12.ki-filled:before {
  content: "\e917";
  position: absolute;
  
}
.ki-abstract-13.ki-filled:after {
  content: "\e918";
  
  opacity: 0.1;
}
.ki-abstract-13.ki-filled:before {
  content: "\e919";
  position: absolute;
  
}
.ki-abstract-14.ki-filled:after {
  content: "\e91a";
  
  opacity: 0.1;
}
.ki-abstract-14.ki-filled:before {
  content: "\e91b";
  position: absolute;
  
}
.ki-abstract-15.ki-filled:after {
  content: "\e91c";
  
  opacity: 0.1;
}
.ki-abstract-15.ki-filled:before {
  content: "\e91d";
  position: absolute;
  
}
.ki-abstract-16.ki-filled:after {
  content: "\e91e";
  
  opacity: 0.1;
}
.ki-abstract-16.ki-filled:before {
  content: "\e91f";
  position: absolute;
  
}
.ki-abstract-17.ki-filled:after {
  content: "\e920";
  
  opacity: 0.1;
}
.ki-abstract-17.ki-filled:before {
  content: "\e921";
  position: absolute;
  
}
.ki-abstract-18.ki-filled:after {
  content: "\e922";
  
  opacity: 0.1;
}
.ki-abstract-18.ki-filled:before {
  content: "\e923";
  position: absolute;
  
}
.ki-abstract-19.ki-filled:after {
  content: "\e924";
  
  opacity: 0.1;
}
.ki-abstract-19.ki-filled:before {
  content: "\e925";
  position: absolute;
  
}
.ki-abstract-20.ki-filled:after {
  content: "\e926";
  
  opacity: 0.1;
}
.ki-abstract-20.ki-filled:before {
  content: "\e927";
  position: absolute;
  
}
.ki-abstract-21.ki-filled:after {
  content: "\e928";
  
  opacity: 0.1;
}
.ki-abstract-21.ki-filled:before {
  content: "\e929";
  position: absolute;
  
}
.ki-abstract-22.ki-filled:after {
  content: "\e92a";
  
  opacity: 0.1;
}
.ki-abstract-22.ki-filled:before {
  content: "\e92b";
  position: absolute;
  
}
.ki-abstract-23.ki-filled:after {
  content: "\e92c";
  
  opacity: 0.1;
}
.ki-abstract-23.ki-filled:before {
  content: "\e92d";
  position: absolute;
  
}
.ki-abstract-24.ki-filled:after {
  content: "\e92e";
  
  opacity: 0.1;
}
.ki-abstract-24.ki-filled:before {
  content: "\e92f";
  position: absolute;
  
}
.ki-abstract-25.ki-filled:after {
  content: "\e930";
  
  opacity: 0.1;
}
.ki-abstract-25.ki-filled:before {
  content: "\e931";
  position: absolute;
  
}
.ki-abstract-26.ki-filled:after {
  content: "\e932";
  
  opacity: 0.1;
}
.ki-abstract-26.ki-filled:before {
  content: "\e933";
  position: absolute;
  
}
.ki-abstract-27.ki-filled:after {
  content: "\e934";
  
  opacity: 0.1;
}
.ki-abstract-27.ki-filled:before {
  content: "\e935";
  position: absolute;
  
}
.ki-abstract-28.ki-filled:after {
  content: "\e936";
  
  opacity: 0.1;
}
.ki-abstract-28.ki-filled:before {
  content: "\e937";
  position: absolute;
  
}
.ki-abstract-29.ki-filled:after {
  content: "\e938";
  
  opacity: 0.1;
}
.ki-abstract-29.ki-filled:before {
  content: "\e939";
  position: absolute;
  
}
.ki-abstract-30.ki-filled:after {
  content: "\e93a";
  
  opacity: 0.1;
}
.ki-abstract-30.ki-filled:before {
  content: "\e93b";
  position: absolute;
  
}
.ki-abstract-31.ki-filled:after {
  content: "\e93c";
  
  opacity: 0.1;
}
.ki-abstract-31.ki-filled:before {
  content: "\e93d";
  position: absolute;
  
}
.ki-abstract-32.ki-filled:after {
  content: "\e93e";
  
  opacity: 0.1;
}
.ki-abstract-32.ki-filled:before {
  content: "\e93f";
  position: absolute;
  
}
.ki-abstract-33.ki-filled:after {
  content: "\e940";
  
  opacity: 0.1;
}
.ki-abstract-33.ki-filled:before {
  content: "\e941";
  position: absolute;
  
}
.ki-abstract-34.ki-filled:after {
  content: "\e942";
  
  opacity: 0.1;
}
.ki-abstract-34.ki-filled:before {
  content: "\e943";
  position: absolute;
  
}
.ki-abstract-35.ki-filled:after {
  content: "\e944";
  
}
.ki-abstract-35.ki-filled:before {
  content: "\e945";
  position: absolute;
  
  opacity: 0.1;
}
.ki-abstract-36.ki-filled:after {
  content: "\e946";
  
  opacity: 0.1;
}
.ki-abstract-36.ki-filled:before {
  content: "\e947";
  position: absolute;
  
}
.ki-abstract-37.ki-filled:after {
  content: "\e948";
  
  opacity: 0.1;
}
.ki-abstract-37.ki-filled:before {
  content: "\e949";
  position: absolute;
  
}
.ki-abstract-38.ki-filled:after {
  content: "\e94a";
  
  opacity: 0.1;
}
.ki-abstract-38.ki-filled:before {
  content: "\e94b";
  position: absolute;
  
}
.ki-abstract-39.ki-filled:after {
  content: "\e94c";
  
  opacity: 0.1;
}
.ki-abstract-39.ki-filled:before {
  content: "\e94d";
  position: absolute;
  
}
.ki-abstract-40.ki-filled:after {
  content: "\e94e";
  
  opacity: 0.1;
}
.ki-abstract-40.ki-filled:before {
  content: "\e94f";
  position: absolute;
  
}
.ki-abstract-41.ki-filled:after {
  content: "\e950";
  
  opacity: 0.1;
}
.ki-abstract-41.ki-filled:before {
  content: "\e951";
  position: absolute;
  
}
.ki-abstract-42.ki-filled:after {
  content: "\e952";
  
  opacity: 0.1;
}
.ki-abstract-42.ki-filled:before {
  content: "\e953";
  position: absolute;
  
}
.ki-abstract-43.ki-filled:after {
  content: "\e954";
  
  opacity: 0.1;
}
.ki-abstract-43.ki-filled:before {
  content: "\e955";
  position: absolute;
  
}
.ki-abstract-44.ki-filled:after {
  content: "\e956";
  
  opacity: 0.1;
}
.ki-abstract-44.ki-filled:before {
  content: "\e957";
  position: absolute;
  
}
.ki-abstract-45.ki-filled:before {
  content: "\e958";
}
.ki-abstract-46.ki-filled:after {
  content: "\e959";
  
  opacity: 0.1;
}
.ki-abstract-46.ki-filled:before {
  content: "\e95a";
  position: absolute;
  
}
.ki-abstract-47.ki-filled:after {
  content: "\e95b";
  
  opacity: 0.1;
}
.ki-abstract-47.ki-filled:before {
  content: "\e95c";
  position: absolute;
  
}
.ki-abstract-48.ki-filled:after {
  content: "\e95d";
  
  opacity: 0.1;
}
.ki-abstract-48.ki-filled:before {
  content: "\e95e";
  position: absolute;
  
}
.ki-abstract-49.ki-filled:after {
  content: "\e95f";
  
  opacity: 0.1;
}
.ki-abstract-49.ki-filled:before {
  content: "\e960";
  position: absolute;
  
}
.ki-abstract.ki-filled:after {
  content: "\e961";
  
  opacity: 0.1;
}
.ki-abstract.ki-filled:before {
  content: "\e962";
  position: absolute;
  
}
.ki-add-files.ki-filled:after {
  content: "\e963";
  
  opacity: 0.1;
}
.ki-add-files.ki-filled:before {
  content: "\e964";
  position: absolute;
  
}
.ki-add-folder.ki-filled:after {
  content: "\e965";
  
  opacity: 0.1;
}
.ki-add-folder.ki-filled:before {
  content: "\e966";
  position: absolute;
  
}
.ki-add-notepad.ki-filled:after {
  content: "\e967";
  
  opacity: 0.1;
}
.ki-add-notepad.ki-filled:before {
  content: "\e968";
  position: absolute;
  
}
.ki-additem.ki-filled:after {
  content: "\e969";
  
  opacity: 0.1;
}
.ki-additem.ki-filled:before {
  content: "\e96a";
  position: absolute;
  
}
.ki-address-book.ki-filled:after {
  content: "\e96b";
  
  opacity: 0.1;
}
.ki-address-book.ki-filled:before {
  content: "\e96c";
  position: absolute;
  
}
.ki-airplane-square.ki-filled:after {
  content: "\e96d";
  
  opacity: 0.1;
}
.ki-airplane-square.ki-filled:before {
  content: "\e96e";
  position: absolute;
  
}
.ki-airplane.ki-filled:after {
  content: "\e96f";
  
  opacity: 0.1;
}
.ki-airplane.ki-filled:before {
  content: "\e970";
  position: absolute;
  
}
.ki-airpod.ki-filled:after {
  content: "\e971";
  
  opacity: 0.1;
}
.ki-airpod.ki-filled:before {
  content: "\e972";
  position: absolute;
  
}
.ki-android.ki-filled:after {
  content: "\e973";
  
  opacity: 0.1;
}
.ki-android.ki-filled:before {
  content: "\e974";
  position: absolute;
  
}
.ki-angular.ki-filled:after {
  content: "\e975";
  
  opacity: 0.1;
}
.ki-angular.ki-filled:before {
  content: "\e976";
  position: absolute;
  
}
.ki-apple.ki-filled:after {
  content: "\e977";
  
  opacity: 0.1;
}
.ki-apple.ki-filled:before {
  content: "\e978";
  position: absolute;
  
}
.ki-archive-tick.ki-filled:after {
  content: "\e979";
  
  opacity: 0.1;
}
.ki-archive-tick.ki-filled:before {
  content: "\e97a";
  position: absolute;
  
}
.ki-archive.ki-filled:after {
  content: "\e97b";
  
  opacity: 0.1;
}
.ki-archive.ki-filled:before {
  content: "\e97c";
  position: absolute;
  
}
.ki-arrow-circle-left.ki-filled:after {
  content: "\e97d";
  
  opacity: 0.1;
}
.ki-arrow-circle-left.ki-filled:before {
  content: "\e97e";
  position: absolute;
  
}
.ki-arrow-circle-right.ki-filled:after {
  content: "\e97f";
  
  opacity: 0.1;
}
.ki-arrow-circle-right.ki-filled:before {
  content: "\e980";
  position: absolute;
  
}
.ki-arrow-down-left.ki-filled:before {
  content: "\e981";
}
.ki-arrow-down-refraction.ki-filled:before {
  content: "\e982";
}
.ki-arrow-down-right.ki-filled:before {
  content: "\e983";
}
.ki-arrow-down.ki-filled:before {
  content: "\e984";
}
.ki-arrow-left.ki-filled:before {
  content: "\e985";
}
.ki-arrow-mix.ki-filled:before {
  content: "\e986";
}
.ki-arrow-right-left.ki-filled:before {
  content: "\e987";
}
.ki-arrow-right.ki-filled:before {
  content: "\e988";
}
.ki-arrow-two-diagonals.ki-filled:before {
  content: "\e989";
}
.ki-arrow-up-down.ki-filled:before {
  content: "\e98a";
}
.ki-arrow-up-left.ki-filled:before {
  content: "\e98b";
}
.ki-arrow-up-refraction.ki-filled:before {
  content: "\e98c";
}
.ki-arrow-up-right.ki-filled:before {
  content: "\e98d";
}
.ki-arrow-up.ki-filled:before {
  content: "\e98e";
}
.ki-arrow-zigzag.ki-filled:before {
  content: "\e98f";
}
.ki-arrows-circle.ki-filled:before {
  content: "\e990";
}
.ki-arrows-loop.ki-filled:before {
  content: "\e991";
}
.ki-artificial-intelligence.ki-filled:after {
  content: "\e992";
  
  opacity: 0.1;
}
.ki-artificial-intelligence.ki-filled:before {
  content: "\e993";
  position: absolute;
  
}
.ki-autobrightness.ki-filled:after {
  content: "\e994";
  
  opacity: 0.1;
}
.ki-autobrightness.ki-filled:before {
  content: "\e995";
  position: absolute;
  
}
.ki-avalanche-avax.ki-filled:after {
  content: "\e996";
  
  opacity: 0.1;
}
.ki-avalanche-avax.ki-filled:before {
  content: "\e997";
  position: absolute;
  
}
.ki-award.ki-filled:after {
  content: "\e998";
  
  opacity: 0.1;
}
.ki-award.ki-filled:before {
  content: "\e999";
  position: absolute;
  
}
.ki-badge.ki-filled:after {
  content: "\e99a";
  
  opacity: 0.1;
}
.ki-badge.ki-filled:before {
  content: "\e99b";
  position: absolute;
  
}
.ki-bandage.ki-filled:after {
  content: "\e99c";
  
  opacity: 0.1;
}
.ki-bandage.ki-filled:before {
  content: "\e99d";
  position: absolute;
  
}
.ki-bank.ki-filled:after {
  content: "\e99e";
  
  opacity: 0.1;
}
.ki-bank.ki-filled:before {
  content: "\e99f";
  position: absolute;
  
}
.ki-bar-chart.ki-filled:after {
  content: "\e9a0";
  
  opacity: 0.1;
}
.ki-bar-chart.ki-filled:before {
  content: "\e9a1";
  position: absolute;
  
}
.ki-barcode.ki-filled:after {
  content: "\e9a2";
  
  opacity: 0.1;
}
.ki-barcode.ki-filled:before {
  content: "\e9a3";
  position: absolute;
  
}
.ki-basket-ok.ki-filled:after {
  content: "\e9a4";
  
  opacity: 0.1;
}
.ki-basket-ok.ki-filled:before {
  content: "\e9a5";
  position: absolute;
  
}
.ki-basket.ki-filled:after {
  content: "\e9a6";
  
  opacity: 0.1;
}
.ki-basket.ki-filled:before {
  content: "\e9a7";
  position: absolute;
  
}
.ki-behance.ki-filled:before {
  content: "\e9a8";
}
.ki-bill.ki-filled:after {
  content: "\e9a9";
  
  opacity: 0.1;
}
.ki-bill.ki-filled:before {
  content: "\e9aa";
  position: absolute;
  
}
.ki-binance-usd-busd.ki-filled:after {
  content: "\e9ab";
  
  opacity: 0.1;
}
.ki-binance-usd-busd.ki-filled:before {
  content: "\e9ac";
  position: absolute;
  
}
.ki-binance.ki-filled:after {
  content: "\e9ad";
  
  opacity: 0.1;
}
.ki-binance.ki-filled:before {
  content: "\e9ae";
  position: absolute;
  
}
.ki-bitcoin.ki-filled:after {
  content: "\e9af";
  
  opacity: 0.1;
}
.ki-bitcoin.ki-filled:before {
  content: "\e9b0";
  position: absolute;
  
}
.ki-black-down.ki-filled:before {
  content: "\e9b1";
}
.ki-black-left-line.ki-filled:before {
  content: "\e9b2";
}
.ki-black-left.ki-filled:before {
  content: "\e9b3";
}
.ki-black-right-line.ki-filled:before {
  content: "\e9b4";
}
.ki-black-right.ki-filled:before {
  content: "\e9b5";
}
.ki-black-up.ki-filled:before {
  content: "\e9b6";
}
.ki-bluetooth.ki-filled:after {
  content: "\e9b7";
  
  opacity: 0.1;
}
.ki-bluetooth.ki-filled:before {
  content: "\e9b8";
  position: absolute;
  
}
.ki-book-open.ki-filled:after {
  content: "\e9b9";
  
  opacity: 0.1;
}
.ki-book-open.ki-filled:before {
  content: "\e9ba";
  position: absolute;
  
}
.ki-book-square.ki-filled:after {
  content: "\e9bb";
  
  opacity: 0.1;
}
.ki-book-square.ki-filled:before {
  content: "\e9bc";
  position: absolute;
  
}
.ki-book.ki-filled:after {
  content: "\e9bd";
  
  opacity: 0.1;
}
.ki-book.ki-filled:before {
  content: "\e9be";
  position: absolute;
  
}
.ki-bookmark-2.ki-filled:after {
  content: "\e9bf";
  
  opacity: 0.1;
}
.ki-bookmark-2.ki-filled:before {
  content: "\e9c0";
  position: absolute;
  
}
.ki-bookmark.ki-filled:after {
  content: "\e9c1";
  
  opacity: 0.1;
}
.ki-bookmark.ki-filled:before {
  content: "\e9c2";
  position: absolute;
  
}
.ki-bootstrap.ki-filled:after {
  content: "\e9c3";
  
  opacity: 0.1;
}
.ki-bootstrap.ki-filled:before {
  content: "\e9c4";
  position: absolute;
  
}
.ki-briefcase.ki-filled:after {
  content: "\e9c5";
  
  opacity: 0.1;
}
.ki-briefcase.ki-filled:before {
  content: "\e9c6";
  position: absolute;
  
}
.ki-brifecase-cros.ki-filled:after {
  content: "\e9c7";
  
  opacity: 0.1;
}
.ki-brifecase-cros.ki-filled:before {
  content: "\e9c8";
  position: absolute;
  
}
.ki-brifecase-tick.ki-filled:after {
  content: "\e9c9";
  
  opacity: 0.1;
}
.ki-brifecase-tick.ki-filled:before {
  content: "\e9ca";
  position: absolute;
  
}
.ki-brifecase-timer.ki-filled:after {
  content: "\e9cb";
  
  opacity: 0.1;
}
.ki-brifecase-timer.ki-filled:before {
  content: "\e9cc";
  position: absolute;
  
}
.ki-brush.ki-filled:after {
  content: "\e9cd";
  
  opacity: 0.1;
}
.ki-brush.ki-filled:before {
  content: "\e9ce";
  position: absolute;
  
}
.ki-bucket-square.ki-filled:after {
  content: "\e9cf";
  
  opacity: 0.1;
}
.ki-bucket-square.ki-filled:before {
  content: "\e9d0";
  position: absolute;
  
}
.ki-bucket.ki-filled:after {
  content: "\e9d1";
  
  opacity: 0.1;
}
.ki-bucket.ki-filled:before {
  content: "\e9d2";
  position: absolute;
  
}
.ki-burger-menu-1.ki-filled:after {
  content: "\e9d3";
  
  opacity: 0.1;
}
.ki-burger-menu-1.ki-filled:before {
  content: "\e9d4";
  position: absolute;
  
}
.ki-burger-menu-2.ki-filled:after {
  content: "\e9d5";
  
  opacity: 0.1;
}
.ki-burger-menu-2.ki-filled:before {
  content: "\e9d6";
  position: absolute;
  
}
.ki-burger-menu-3.ki-filled:after {
  content: "\e9d7";
  
  opacity: 0.1;
}
.ki-burger-menu-3.ki-filled:before {
  content: "\e9d8";
  position: absolute;
  
}
.ki-burger-menu-4.ki-filled:before {
  content: "\e9d9";
}
.ki-burger-menu-5.ki-filled:before {
  content: "\e9da";
}
.ki-burger-menu-6.ki-filled:before {
  content: "\e9db";
}
.ki-burger-menu.ki-filled:after {
  content: "\e9dc";
  
  opacity: 0.1;
}
.ki-burger-menu.ki-filled:before {
  content: "\e9dd";
  position: absolute;
  
}
.ki-bus.ki-filled:after {
  content: "\e9de";
  
  opacity: 0.1;
}
.ki-bus.ki-filled:before {
  content: "\e9df";
  position: absolute;
  
}
.ki-calculator.ki-filled:after {
  content: "\e9e0";
  
  opacity: 0.1;
}
.ki-calculator.ki-filled:before {
  content: "\e9e1";
  position: absolute;
  
}
.ki-calculatoror.ki-filled:after {
  content: "\e9e2";
  
  opacity: 0.1;
}
.ki-calculatoror.ki-filled:before {
  content: "\e9e3";
  position: absolute;
  
}
.ki-calendar-2.ki-filled:after {
  content: "\e9e4";
  
  opacity: 0.1;
}
.ki-calendar-2.ki-filled:before {
  content: "\e9e5";
  position: absolute;
  
}
.ki-calendar-8.ki-filled:after {
  content: "\e9e6";
  
  opacity: 0.1;
}
.ki-calendar-8.ki-filled:before {
  content: "\e9e7";
  position: absolute;
  
}
.ki-calendar-add.ki-filled:after {
  content: "\e9e8";
  
  opacity: 0.1;
}
.ki-calendar-add.ki-filled:before {
  content: "\e9e9";
  position: absolute;
  
}
.ki-calendar-edit.ki-filled:after {
  content: "\e9ea";
  
  opacity: 0.1;
}
.ki-calendar-edit.ki-filled:before {
  content: "\e9eb";
  position: absolute;
  
}
.ki-calendar-remove.ki-filled:after {
  content: "\e9ec";
  
  opacity: 0.1;
}
.ki-calendar-remove.ki-filled:before {
  content: "\e9ed";
  position: absolute;
  
}
.ki-calendar-search.ki-filled:after {
  content: "\e9ee";
  
  opacity: 0.1;
}
.ki-calendar-search.ki-filled:before {
  content: "\e9ef";
  position: absolute;
  
}
.ki-calendar-tick.ki-filled:after {
  content: "\e9f0";
  
  opacity: 0.1;
}
.ki-calendar-tick.ki-filled:before {
  content: "\e9f1";
  position: absolute;
  
}
.ki-calendar.ki-filled:after {
  content: "\e9f2";
  
  opacity: 0.1;
}
.ki-calendar.ki-filled:before {
  content: "\e9f3";
  position: absolute;
  
}
.ki-call.ki-filled:after {
  content: "\e9f4";
  
}
.ki-call.ki-filled:before {
  content: "\e9f5";
  position: absolute;
  
  opacity: 0.1;
}
.ki-capsule.ki-filled:after {
  content: "\e9f6";
  
  opacity: 0.1;
}
.ki-capsule.ki-filled:before {
  content: "\e9f7";
  position: absolute;
  
}
.ki-car.ki-filled:after {
  content: "\e9f8";
  
  opacity: 0.1;
}
.ki-car.ki-filled:before {
  content: "\e9f9";
  position: absolute;
  
}
.ki-category.ki-filled:after {
  content: "\e9fa";
  
  opacity: 0.1;
}
.ki-category.ki-filled:before {
  content: "\e9fb";
  position: absolute;
  
}
.ki-cd.ki-filled:after {
  content: "\e9fc";
  
}
.ki-cd.ki-filled:before {
  content: "\e9fd";
  position: absolute;
  
  opacity: 0.1;
}
.ki-celsius-cel.ki-filled:after {
  content: "\e9fe";
  
  opacity: 0.1;
}
.ki-celsius-cel.ki-filled:before {
  content: "\e9ff";
  position: absolute;
  
}
.ki-chart-line-down-2.ki-filled:after {
  content: "\ea00";
  
  opacity: 0.1;
}
.ki-chart-line-down-2.ki-filled:before {
  content: "\ea01";
  position: absolute;
  
}
.ki-chart-line-down.ki-filled:before {
  content: "\ea02";
}
.ki-chart-line-star.ki-filled:after {
  content: "\ea03";
  
  opacity: 0.1;
}
.ki-chart-line-star.ki-filled:before {
  content: "\ea04";
  position: absolute;
  
}
.ki-chart-line-up-2.ki-filled:after {
  content: "\ea05";
  
  opacity: 0.1;
}
.ki-chart-line-up-2.ki-filled:before {
  content: "\ea06";
  position: absolute;
  
}
.ki-chart-line-up.ki-filled:before {
  content: "\ea07";
}
.ki-chart-line.ki-filled:after {
  content: "\ea08";
  
  opacity: 0.1;
}
.ki-chart-line.ki-filled:before {
  content: "\ea09";
  position: absolute;
  
}
.ki-chart-pie-3.ki-filled:after {
  content: "\ea0a";
  
  opacity: 0.1;
}
.ki-chart-pie-3.ki-filled:before {
  content: "\ea0b";
  position: absolute;
  
}
.ki-chart-pie-4.ki-filled:after {
  content: "\ea0c";
  
  opacity: 0.1;
}
.ki-chart-pie-4.ki-filled:before {
  content: "\ea0d";
  position: absolute;
  
}
.ki-chart-pie-simple.ki-filled:after {
  content: "\ea0e";
  
  opacity: 0.1;
}
.ki-chart-pie-simple.ki-filled:before {
  content: "\ea0f";
  position: absolute;
  
}
.ki-chart-pie-too.ki-filled:after {
  content: "\ea10";
  
  opacity: 0.1;
}
.ki-chart-pie-too.ki-filled:before {
  content: "\ea11";
  position: absolute;
  
}
.ki-chart-simple-2.ki-filled:after {
  content: "\ea12";
  
  opacity: 0.1;
}
.ki-chart-simple-2.ki-filled:before {
  content: "\ea13";
  position: absolute;
  
}
.ki-chart-simple-3.ki-filled:after {
  content: "\ea14";
  
  opacity: 0.1;
}
.ki-chart-simple-3.ki-filled:before {
  content: "\ea15";
  position: absolute;
  
}
.ki-chart-simple.ki-filled:after {
  content: "\ea16";
  
  opacity: 0.1;
}
.ki-chart-simple.ki-filled:before {
  content: "\ea17";
  position: absolute;
  
}
.ki-chart.ki-filled:after {
  content: "\ea18";
  
  opacity: 0.1;
}
.ki-chart.ki-filled:before {
  content: "\ea19";
  position: absolute;
  
}
.ki-check-circle.ki-filled:after {
  content: "\ea1a";
  
  opacity: 0.1;
}
.ki-check-circle.ki-filled:before {
  content: "\ea1b";
  position: absolute;
  
}
.ki-check-squared.ki-filled:after {
  content: "\ea1c";
  
  opacity: 0.1;
}
.ki-check-squared.ki-filled:before {
  content: "\ea1d";
  position: absolute;
  
}
.ki-check.ki-filled:before {
  content: "\ea1e";
}
.ki-cheque.ki-filled:after {
  content: "\ea1f";
  
  opacity: 0.1;
}
.ki-cheque.ki-filled:before {
  content: "\ea20";
  position: absolute;
  
}
.ki-chrome.ki-filled:after {
  content: "\ea21";
  
  opacity: 0.1;
}
.ki-chrome.ki-filled:before {
  content: "\ea22";
  position: absolute;
  
}
.ki-classmates.ki-filled:after {
  content: "\ea23";
  
  opacity: 0.1;
}
.ki-classmates.ki-filled:before {
  content: "\ea24";
  position: absolute;
  
}
.ki-click.ki-filled:after {
  content: "\ea25";
  
  opacity: 0.1;
}
.ki-click.ki-filled:before {
  content: "\ea26";
  position: absolute;
  
}
.ki-clipboard.ki-filled:after {
  content: "\ea27";
  
  opacity: 0.1;
}
.ki-clipboard.ki-filled:before {
  content: "\ea28";
  position: absolute;
  
}
.ki-cloud-add.ki-filled:after {
  content: "\ea29";
  
  opacity: 0.1;
}
.ki-cloud-add.ki-filled:before {
  content: "\ea2a";
  position: absolute;
  
}
.ki-cloud-change.ki-filled:after {
  content: "\ea2b";
  
  opacity: 0.1;
}
.ki-cloud-change.ki-filled:before {
  content: "\ea2c";
  position: absolute;
  
}
.ki-cloud-download.ki-filled:after {
  content: "\ea2d";
  
  opacity: 0.1;
}
.ki-cloud-download.ki-filled:before {
  content: "\ea2e";
  position: absolute;
  
}
.ki-cloud.ki-filled:after {
  content: "\ea2f";
  
  opacity: 0.1;
}
.ki-cloud.ki-filled:before {
  content: "\ea30";
  position: absolute;
  
}
.ki-code.ki-filled:after {
  content: "\ea31";
  
  opacity: 0.1;
}
.ki-code.ki-filled:before {
  content: "\ea32";
  position: absolute;
  
}
.ki-coffee.ki-filled:after {
  content: "\ea33";
  
  opacity: 0.1;
}
.ki-coffee.ki-filled:before {
  content: "\ea34";
  position: absolute;
  
}
.ki-color-swatch.ki-filled:after {
  content: "\ea35";
  
  opacity: 0.1;
}
.ki-color-swatch.ki-filled:before {
  content: "\ea36";
  position: absolute;
  
}
.ki-colors-square.ki-filled:after {
  content: "\ea37";
  
  opacity: 0.1;
}
.ki-colors-square.ki-filled:before {
  content: "\ea38";
  position: absolute;
  
}
.ki-compass.ki-filled:after {
  content: "\ea39";
  
  opacity: 0.1;
}
.ki-compass.ki-filled:before {
  content: "\ea3a";
  position: absolute;
  
}
.ki-copy-success.ki-filled:after {
  content: "\ea3b";
  
  opacity: 0.1;
}
.ki-copy-success.ki-filled:before {
  content: "\ea3c";
  position: absolute;
  
}
.ki-copy.ki-filled:after {
  content: "\ea3d";
  
  opacity: 0.1;
}
.ki-copy.ki-filled:before {
  content: "\ea3e";
  position: absolute;
  
}
.ki-courier-express.ki-filled:after {
  content: "\ea3f";
  
  opacity: 0.1;
}
.ki-courier-express.ki-filled:before {
  content: "\ea40";
  position: absolute;
  
}
.ki-courier.ki-filled:after {
  content: "\ea41";
  
  opacity: 0.1;
}
.ki-courier.ki-filled:before {
  content: "\ea42";
  position: absolute;
  
}
.ki-credit-cart.ki-filled:after {
  content: "\ea43";
  
  opacity: 0.1;
}
.ki-credit-cart.ki-filled:before {
  content: "\ea44";
  position: absolute;
  
}
.ki-cross-circle.ki-filled:after {
  content: "\ea45";
  
  opacity: 0.1;
}
.ki-cross-circle.ki-filled:before {
  content: "\ea46";
  position: absolute;
  
}
.ki-cross-square.ki-filled:after {
  content: "\ea47";
  
  opacity: 0.1;
}
.ki-cross-square.ki-filled:before {
  content: "\ea48";
  position: absolute;
  
}
.ki-cross.ki-filled:before {
  content: "\ea49";
}
.ki-crown-2.ki-filled:after {
  content: "\ea4a";
  
  opacity: 0.1;
}
.ki-crown-2.ki-filled:before {
  content: "\ea4b";
  position: absolute;
  
}
.ki-crown.ki-filled:after {
  content: "\ea4c";
  
  opacity: 0.1;
}
.ki-crown.ki-filled:before {
  content: "\ea4d";
  position: absolute;
  
}
.ki-css.ki-filled:after {
  content: "\ea4e";
  
  opacity: 0.1;
}
.ki-css.ki-filled:before {
  content: "\ea4f";
  position: absolute;
  
}
.ki-cube-2.ki-filled:after {
  content: "\ea50";
  
  opacity: 0.1;
}
.ki-cube-2.ki-filled:before {
  content: "\ea51";
  position: absolute;
  
}
.ki-cube-3.ki-filled:after {
  content: "\ea52";
  
  opacity: 0.1;
}
.ki-cube-3.ki-filled:before {
  content: "\ea53";
  position: absolute;
  
}
.ki-cup.ki-filled:after {
  content: "\ea54";
  
  opacity: 0.1;
}
.ki-cup.ki-filled:before {
  content: "\ea55";
  position: absolute;
  
}
.ki-cursor.ki-filled:after {
  content: "\ea56";
  
  opacity: 0.1;
}
.ki-cursor.ki-filled:before {
  content: "\ea57";
  position: absolute;
  
}
.ki-dash.ki-filled:after {
  content: "\ea58";
  
  opacity: 0.1;
}
.ki-dash.ki-filled:before {
  content: "\ea59";
  position: absolute;
  
}
.ki-data.ki-filled:after {
  content: "\ea5a";
  
  opacity: 0.1;
}
.ki-data.ki-filled:before {
  content: "\ea5b";
  position: absolute;
  
}
.ki-delete-files.ki-filled:after {
  content: "\ea5c";
  
  opacity: 0.1;
}
.ki-delete-files.ki-filled:before {
  content: "\ea5d";
  position: absolute;
  
}
.ki-delete-folder.ki-filled:after {
  content: "\ea5e";
  
  opacity: 0.1;
}
.ki-delete-folder.ki-filled:before {
  content: "\ea5f";
  position: absolute;
  
}
.ki-delivery-2.ki-filled:after {
  content: "\ea60";
  
  opacity: 0.1;
}
.ki-delivery-2.ki-filled:before {
  content: "\ea61";
  position: absolute;
  
}
.ki-delivery-3.ki-filled:after {
  content: "\ea62";
  
  opacity: 0.1;
}
.ki-delivery-3.ki-filled:before {
  content: "\ea63";
  position: absolute;
  
}
.ki-delivery-24.ki-filled:after {
  content: "\ea64";
  
  opacity: 0.1;
}
.ki-delivery-24.ki-filled:before {
  content: "\ea65";
  position: absolute;
  
}
.ki-delivery-door.ki-filled:after {
  content: "\ea66";
  
  opacity: 0.1;
}
.ki-delivery-door.ki-filled:before {
  content: "\ea67";
  position: absolute;
  
}
.ki-delivery-geolocation.ki-filled:after {
  content: "\ea68";
  
  opacity: 0.1;
}
.ki-delivery-geolocation.ki-filled:before {
  content: "\ea69";
  position: absolute;
  
}
.ki-delivery-time.ki-filled:after {
  content: "\ea6a";
  
  opacity: 0.1;
}
.ki-delivery-time.ki-filled:before {
  content: "\ea6b";
  position: absolute;
  
}
.ki-delivery.ki-filled:after {
  content: "\ea6c";
  
  opacity: 0.1;
}
.ki-delivery.ki-filled:before {
  content: "\ea6d";
  position: absolute;
  
}
.ki-design-1.ki-filled:after {
  content: "\ea6e";
  
  opacity: 0.1;
}
.ki-design-1.ki-filled:before {
  content: "\ea6f";
  position: absolute;
  
}
.ki-design-2.ki-filled:after {
  content: "\ea70";
  
  opacity: 0.1;
}
.ki-design-2.ki-filled:before {
  content: "\ea71";
  position: absolute;
  
}
.ki-desktop-mobile.ki-filled:after {
  content: "\ea72";
  
  opacity: 0.1;
}
.ki-desktop-mobile.ki-filled:before {
  content: "\ea73";
  position: absolute;
  
}
.ki-devices-2.ki-filled:after {
  content: "\ea74";
  
  opacity: 0.1;
}
.ki-devices-2.ki-filled:before {
  content: "\ea75";
  position: absolute;
  
}
.ki-devices.ki-filled:after {
  content: "\ea76";
  
  opacity: 0.1;
}
.ki-devices.ki-filled:before {
  content: "\ea77";
  position: absolute;
  
}
.ki-diamonds.ki-filled:after {
  content: "\ea78";
  
  opacity: 0.1;
}
.ki-diamonds.ki-filled:before {
  content: "\ea79";
  position: absolute;
  
}
.ki-directbox-default.ki-filled:after {
  content: "\ea7a";
  
  opacity: 0.1;
}
.ki-directbox-default.ki-filled:before {
  content: "\ea7b";
  position: absolute;
  
}
.ki-disconnect.ki-filled:after {
  content: "\ea7c";
  
  opacity: 0.1;
}
.ki-disconnect.ki-filled:before {
  content: "\ea7d";
  position: absolute;
  
}
.ki-discount.ki-filled:after {
  content: "\ea7e";
  
  opacity: 0.1;
}
.ki-discount.ki-filled:before {
  content: "\ea7f";
  position: absolute;
  
}
.ki-disguise.ki-filled:after {
  content: "\ea80";
  
  opacity: 0.1;
}
.ki-disguise.ki-filled:before {
  content: "\ea81";
  position: absolute;
  
}
.ki-disk.ki-filled:after {
  content: "\ea82";
  
  opacity: 0.1;
}
.ki-disk.ki-filled:before {
  content: "\ea83";
  position: absolute;
  
}
.ki-dislike.ki-filled:after {
  content: "\ea84";
  
  opacity: 0.1;
}
.ki-dislike.ki-filled:before {
  content: "\ea85";
  position: absolute;
  
}
.ki-dj.ki-filled:after {
  content: "\ea86";
  
  opacity: 0.1;
}
.ki-dj.ki-filled:before {
  content: "\ea87";
  position: absolute;
  
}
.ki-document.ki-filled:after {
  content: "\ea88";
  
  opacity: 0.1;
}
.ki-document.ki-filled:before {
  content: "\ea89";
  position: absolute;
  
}
.ki-double-check.ki-filled:before {
  content: "\ea8a";
}
.ki-dollar.ki-filled:after {
  content: "\ea8b";
  
  opacity: 0.1;
}
.ki-dollar.ki-filled:before {
  content: "\ea8c";
  position: absolute;
  
}
.ki-dots-circle-vertical.ki-filled:after {
  content: "\ea8d";
  
  opacity: 0.1;
}
.ki-dots-circle-vertical.ki-filled:before {
  content: "\ea8e";
  position: absolute;
  
}
.ki-dots-circle.ki-filled:after {
  content: "\ea8f";
  
  opacity: 0.1;
}
.ki-dots-circle.ki-filled:before {
  content: "\ea90";
  position: absolute;
  
}
.ki-dots-horizontal.ki-filled:before {
  content: "\ea91";
}
.ki-dots-square-vertical.ki-filled:after {
  content: "\ea92";
  
  opacity: 0.1;
}
.ki-dots-square-vertical.ki-filled:before {
  content: "\ea93";
  position: absolute;
  
}
.ki-dots-square.ki-filled:after {
  content: "\ea94";
  
  opacity: 0.1;
}
.ki-dots-square.ki-filled:before {
  content: "\ea95";
  position: absolute;
  
}
.ki-dots-vertical.ki-filled:before {
  content: "\ea96";
}
.ki-double-check-circle.ki-filled:after {
  content: "\ea97";
  
  opacity: 0.1;
}
.ki-double-check-circle.ki-filled:before {
  content: "\ea98";
  position: absolute;
  
}
.ki-double-down.ki-filled:before {
  content: "\ea99";
}
.ki-double-left-arrow.ki-filled:after {
  content: "\ea9a";
  
  opacity: 0.1;
}
.ki-double-left-arrow.ki-filled:before {
  content: "\ea9b";
  position: absolute;
  
}
.ki-double-left.ki-filled:before {
  content: "\ea9c";
}
.ki-double-right-arrow.ki-filled:after {
  content: "\ea9d";
  
  opacity: 0.1;
}
.ki-double-right-arrow.ki-filled:before {
  content: "\ea9e";
  position: absolute;
  
}
.ki-double-right.ki-filled:before {
  content: "\ea9f";
}
.ki-double-up.ki-filled:before {
  content: "\eaa0";
}
.ki-down-square.ki-filled:after {
  content: "\eaa1";
  
  opacity: 0.1;
}
.ki-down-square.ki-filled:before {
  content: "\eaa2";
  position: absolute;
  
}
.ki-down.ki-filled:before {
  content: "\eaa3";
}
.ki-dribbble.ki-filled:after {
  content: "\eaa4";
  
  opacity: 0.1;
}
.ki-dribbble.ki-filled:before {
  content: "\eaa5";
  position: absolute;
  
}
.ki-drop.ki-filled:after {
  content: "\eaa6";
  
  opacity: 0.1;
}
.ki-drop.ki-filled:before {
  content: "\eaa7";
  position: absolute;
  
}
.ki-dropbox.ki-filled:after {
  content: "\eaa8";
  
  opacity: 0.1;
}
.ki-dropbox.ki-filled:before {
  content: "\eaa9";
  position: absolute;
  
}
.ki-educare-ekt.ki-filled:after {
  content: "\eaaa";
  
  opacity: 0.1;
}
.ki-educare-ekt.ki-filled:before {
  content: "\eaab";
  position: absolute;
  
}
.ki-electricity.ki-filled:after {
  content: "\eaac";
  
  opacity: 0.1;
}
.ki-electricity.ki-filled:before {
  content: "\eaad";
  position: absolute;
  
}
.ki-electronic-clock.ki-filled:after {
  content: "\eaae";
  
  opacity: 0.1;
}
.ki-electronic-clock.ki-filled:before {
  content: "\eaaf";
  position: absolute;
  
}
.ki-element-1.ki-filled:after {
  content: "\eab0";
  
  opacity: 0.1;
}
.ki-element-1.ki-filled:before {
  content: "\eab1";
  position: absolute;
  
}
.ki-element-2.ki-filled:after {
  content: "\eab2";
  
  opacity: 0.1;
}
.ki-element-2.ki-filled:before {
  content: "\eab3";
  position: absolute;
  
}
.ki-element-3.ki-filled:after {
  content: "\eab4";
  
  opacity: 0.1;
}
.ki-element-3.ki-filled:before {
  content: "\eab5";
  position: absolute;
  
}
.ki-element-4.ki-filled:after {
  content: "\eab6";
  
  opacity: 0.1;
}
.ki-element-4.ki-filled:before {
  content: "\eab7";
  position: absolute;
  
}
.ki-element-5.ki-filled:after {
  content: "\eab8";
  
  opacity: 0.1;
}
.ki-element-5.ki-filled:before {
  content: "\eab9";
  position: absolute;
  
}
.ki-element-6.ki-filled:after {
  content: "\eaba";
  
  opacity: 0.1;
}
.ki-element-6.ki-filled:before {
  content: "\eabb";
  position: absolute;
  
}
.ki-element-7.ki-filled:after {
  content: "\eabc";
  
  opacity: 0.1;
}
.ki-element-7.ki-filled:before {
  content: "\eabd";
  position: absolute;
  
}
.ki-element-8.ki-filled:after {
  content: "\eabe";
  
  opacity: 0.1;
}
.ki-element-8.ki-filled:before {
  content: "\eabf";
  position: absolute;
  
}
.ki-element-9.ki-filled:after {
  content: "\eac0";
  
  opacity: 0.1;
}
.ki-element-9.ki-filled:before {
  content: "\eac1";
  position: absolute;
  
}
.ki-element-10.ki-filled:after {
  content: "\eac2";
  
  opacity: 0.1;
}
.ki-element-10.ki-filled:before {
  content: "\eac3";
  position: absolute;
  
}
.ki-element-11.ki-filled:after {
  content: "\eac4";
  
  opacity: 0.1;
}
.ki-element-11.ki-filled:before {
  content: "\eac5";
  position: absolute;
  
}
.ki-element-12.ki-filled:after {
  content: "\eac6";
  
  opacity: 0.1;
}
.ki-element-12.ki-filled:before {
  content: "\eac7";
  position: absolute;
  
}
.ki-element-equal.ki-filled:after {
  content: "\eac8";
  
  opacity: 0.1;
}
.ki-element-equal.ki-filled:before {
  content: "\eac9";
  position: absolute;
  
}
.ki-element-plus.ki-filled:after {
  content: "\eaca";
  
  opacity: 0.1;
}
.ki-element-plus.ki-filled:before {
  content: "\eacb";
  position: absolute;
  
}
.ki-emoji-happy.ki-filled:after {
  content: "\eacc";
  
  opacity: 0.1;
}
.ki-emoji-happy.ki-filled:before {
  content: "\eacd";
  position: absolute;
  
}
.ki-enjin-coin-enj.ki-filled:after {
  content: "\eace";
  
  opacity: 0.1;
}
.ki-enjin-coin-enj.ki-filled:before {
  content: "\eacf";
  position: absolute;
  
}
.ki-ensure.ki-filled:after {
  content: "\ead0";
  
  opacity: 0.1;
}
.ki-ensure.ki-filled:before {
  content: "\ead1";
  position: absolute;
  
}
.ki-entrance-left.ki-filled:after {
  content: "\ead2";
  
  opacity: 0.1;
}
.ki-entrance-left.ki-filled:before {
  content: "\ead3";
  position: absolute;
  
}
.ki-entrance-right.ki-filled:after {
  content: "\ead4";
  
  opacity: 0.1;
}
.ki-entrance-right.ki-filled:before {
  content: "\ead5";
  position: absolute;
  
}
.ki-eraser.ki-filled:after {
  content: "\ead6";
  
  opacity: 0.1;
}
.ki-eraser.ki-filled:before {
  content: "\ead7";
  position: absolute;
  
}
.ki-euro.ki-filled:after {
  content: "\ead8";
  
  opacity: 0.1;
}
.ki-euro.ki-filled:before {
  content: "\ead9";
  position: absolute;
  
}
.ki-exit-down.ki-filled:after {
  content: "\eada";
  
  opacity: 0.1;
}
.ki-exit-down.ki-filled:before {
  content: "\eadb";
  position: absolute;
  
}
.ki-exit-left.ki-filled:after {
  content: "\eadc";
  
  opacity: 0.1;
}
.ki-exit-left.ki-filled:before {
  content: "\eadd";
  position: absolute;
  
}
.ki-exit-right-corner.ki-filled:after {
  content: "\eade";
  
  opacity: 0.1;
}
.ki-exit-right-corner.ki-filled:before {
  content: "\eadf";
  position: absolute;
  
}
.ki-exit-right.ki-filled:after {
  content: "\eae0";
  
  opacity: 0.1;
}
.ki-exit-right.ki-filled:before {
  content: "\eae1";
  position: absolute;
  
}
.ki-exit-up.ki-filled:after {
  content: "\eae2";
  
  opacity: 0.1;
}
.ki-exit-up.ki-filled:before {
  content: "\eae3";
  position: absolute;
  
}
.ki-external-drive.ki-filled:after {
  content: "\eae4";
  
  opacity: 0.1;
}
.ki-external-drive.ki-filled:before {
  content: "\eae5";
  position: absolute;
  
}
.ki-eye-slash.ki-filled:after {
  content: "\eae6";
  
  opacity: 0.1;
}
.ki-eye-slash.ki-filled:before {
  content: "\eae7";
  position: absolute;
  
}
.ki-eye.ki-filled:after {
  content: "\eae8";
  
  opacity: 0.1;
}
.ki-eye.ki-filled:before {
  content: "\eae9";
  position: absolute;
  
}
.ki-face-id.ki-filled:after {
  content: "\eaea";
  
  opacity: 0.1;
}
.ki-face-id.ki-filled:before {
  content: "\eaeb";
  position: absolute;
  
}
.ki-facebook.ki-filled:after {
  content: "\eaec";
  
  opacity: 0.1;
}
.ki-facebook.ki-filled:before {
  content: "\eaed";
  position: absolute;
  
}
.ki-fasten.ki-filled:after {
  content: "\eaee";
  
  opacity: 0.1;
}
.ki-fasten.ki-filled:before {
  content: "\eaef";
  position: absolute;
  
}
.ki-fatrows.ki-filled:after {
  content: "\eaf0";
  
  opacity: 0.1;
}
.ki-fatrows.ki-filled:before {
  content: "\eaf1";
  position: absolute;
  
}
.ki-feather.ki-filled:after {
  content: "\eaf2";
  
  opacity: 0.1;
}
.ki-feather.ki-filled:before {
  content: "\eaf3";
  position: absolute;
  
}
.ki-figma.ki-filled:after {
  content: "\eaf4";
  
  opacity: 0.1;
}
.ki-figma.ki-filled:before {
  content: "\eaf5";
  position: absolute;
  
}
.ki-file-added.ki-filled:after {
  content: "\eaf6";
  
  opacity: 0.1;
}
.ki-file-added.ki-filled:before {
  content: "\eaf7";
  position: absolute;
  
}
.ki-file-deleted.ki-filled:after {
  content: "\eaf8";
  
  opacity: 0.1;
}
.ki-file-deleted.ki-filled:before {
  content: "\eaf9";
  position: absolute;
  
}
.ki-file-down.ki-filled:after {
  content: "\eafa";
  
  opacity: 0.1;
}
.ki-file-down.ki-filled:before {
  content: "\eafb";
  position: absolute;
  
}
.ki-file-left.ki-filled:after {
  content: "\eafc";
  
  opacity: 0.1;
}
.ki-file-left.ki-filled:before {
  content: "\eafd";
  position: absolute;
  
}
.ki-file-right.ki-filled:after {
  content: "\eafe";
  
  opacity: 0.1;
}
.ki-file-right.ki-filled:before {
  content: "\eaff";
  position: absolute;
  
}
.ki-file-sheet.ki-filled:after {
  content: "\eb00";
  
  opacity: 0.1;
}
.ki-file-sheet.ki-filled:before {
  content: "\eb01";
  position: absolute;
  
}
.ki-file-up.ki-filled:after {
  content: "\eb02";
  
  opacity: 0.1;
}
.ki-file-up.ki-filled:before {
  content: "\eb03";
  position: absolute;
  
}
.ki-files.ki-filled:after {
  content: "\eb04";
  
  opacity: 0.1;
}
.ki-files.ki-filled:before {
  content: "\eb05";
  position: absolute;
  
}
.ki-filter-edit.ki-filled:after {
  content: "\eb06";
  
  opacity: 0.1;
}
.ki-filter-edit.ki-filled:before {
  content: "\eb07";
  position: absolute;
  
}
.ki-filter-search.ki-filled:after {
  content: "\eb08";
  
  opacity: 0.1;
}
.ki-filter-search.ki-filled:before {
  content: "\eb09";
  position: absolute;
  
}
.ki-filter-square.ki-filled:after {
  content: "\eb0a";
  
  opacity: 0.1;
}
.ki-filter-square.ki-filled:before {
  content: "\eb0b";
  position: absolute;
  
}
.ki-filter-tablet.ki-filled:after {
  content: "\eb0c";
  
  opacity: 0.1;
}
.ki-filter-tablet.ki-filled:before {
  content: "\eb0d";
  position: absolute;
  
}
.ki-filter-tick.ki-filled:after {
  content: "\eb0e";
  
  opacity: 0.1;
}
.ki-filter-tick.ki-filled:before {
  content: "\eb0f";
  position: absolute;
  
}
.ki-filter.ki-filled:after {
  content: "\eb10";
  
  opacity: 0.1;
}
.ki-filter.ki-filled:before {
  content: "\eb11";
  position: absolute;
  
}
.ki-financial-schedule.ki-filled:after {
  content: "\eb12";
  
  opacity: 0.1;
}
.ki-financial-schedule.ki-filled:before {
  content: "\eb13";
  position: absolute;
  
}
.ki-fingerprint-scanning.ki-filled:before {
  content: "\eb14";
}
.ki-flag.ki-filled:after {
  content: "\eb15";
  
  opacity: 0.1;
}
.ki-flag.ki-filled:before {
  content: "\eb16";
  position: absolute;
  
}
.ki-flash-circle.ki-filled:after {
  content: "\eb17";
  
  opacity: 0.1;
}
.ki-flash-circle.ki-filled:before {
  content: "\eb18";
  position: absolute;
  
}
.ki-flask.ki-filled:after {
  content: "\eb19";
  
  opacity: 0.1;
}
.ki-flask.ki-filled:before {
  content: "\eb1a";
  position: absolute;
  
}
.ki-focus.ki-filled:after {
  content: "\eb1b";
  
  opacity: 0.1;
}
.ki-focus.ki-filled:before {
  content: "\eb1c";
  position: absolute;
  
}
.ki-folder-added.ki-filled:after {
  content: "\eb1d";
  
  opacity: 0.1;
}
.ki-folder-added.ki-filled:before {
  content: "\eb1e";
  position: absolute;
  
}
.ki-folder-down.ki-filled:after {
  content: "\eb1f";
  
  opacity: 0.1;
}
.ki-folder-down.ki-filled:before {
  content: "\eb20";
  position: absolute;
  
}
.ki-folder-up.ki-filled:after {
  content: "\eb21";
  
  opacity: 0.1;
}
.ki-folder-up.ki-filled:before {
  content: "\eb22";
  position: absolute;
  
}
.ki-folder.ki-filled:after {
  content: "\eb23";
  
  opacity: 0.1;
}
.ki-folder.ki-filled:before {
  content: "\eb24";
  position: absolute;
  
}
.ki-frame.ki-filled:after {
  content: "\eb25";
  
  opacity: 0.1;
}
.ki-frame.ki-filled:before {
  content: "\eb26";
  position: absolute;
  
}
.ki-geolocation-home.ki-filled:after {
  content: "\eb27";
  
  opacity: 0.1;
}
.ki-geolocation-home.ki-filled:before {
  content: "\eb28";
  position: absolute;
  
}
.ki-geolocation.ki-filled:after {
  content: "\eb29";
  
  opacity: 0.1;
}
.ki-geolocation.ki-filled:before {
  content: "\eb2a";
  position: absolute;
  
}
.ki-ghost.ki-filled:after {
  content: "\eb2b";
  
  opacity: 0.1;
}
.ki-ghost.ki-filled:before {
  content: "\eb2c";
  position: absolute;
  
}
.ki-gift.ki-filled:after {
  content: "\eb2d";
  
  opacity: 0.1;
}
.ki-gift.ki-filled:before {
  content: "\eb2e";
  position: absolute;
  
}
.ki-github.ki-filled:after {
  content: "\eb2f";
  
  opacity: 0.1;
}
.ki-github.ki-filled:before {
  content: "\eb30";
  position: absolute;
  
}
.ki-glass.ki-filled:after {
  content: "\eb31";
  
  opacity: 0.1;
}
.ki-glass.ki-filled:before {
  content: "\eb32";
  position: absolute;
  
}
.ki-google-play.ki-filled:after {
  content: "\eb33";
  
  opacity: 0.1;
}
.ki-google-play.ki-filled:before {
  content: "\eb34";
  position: absolute;
  
}
.ki-google.ki-filled:after {
  content: "\eb35";
  
  opacity: 0.1;
}
.ki-google.ki-filled:before {
  content: "\eb36";
  position: absolute;
  
}
.ki-graph-2.ki-filled:after {
  content: "\eb37";
  
  opacity: 0.1;
}
.ki-graph-2.ki-filled:before {
  content: "\eb38";
  position: absolute;
  
}
.ki-graph-3.ki-filled:after {
  content: "\eb39";
  
  opacity: 0.1;
}
.ki-graph-3.ki-filled:before {
  content: "\eb3a";
  position: absolute;
  
}
.ki-graph-4.ki-filled:after {
  content: "\eb3b";
  
  opacity: 0.1;
}
.ki-graph-4.ki-filled:before {
  content: "\eb3c";
  position: absolute;
  
}
.ki-graph-up.ki-filled:after {
  content: "\eb3d";
  
  opacity: 0.1;
}
.ki-graph-up.ki-filled:before {
  content: "\eb3e";
  position: absolute;
  
}
.ki-graph.ki-filled:after {
  content: "\eb3f";
  
  opacity: 0.1;
}
.ki-graph.ki-filled:before {
  content: "\eb40";
  position: absolute;
  
}
.ki-grid-2.ki-filled:after {
  content: "\eb41";
  
  opacity: 0.1;
}
.ki-grid-2.ki-filled:before {
  content: "\eb42";
  position: absolute;
  
}
.ki-grid.ki-filled:after {
  content: "\eb43";
  
  opacity: 0.1;
}
.ki-grid.ki-filled:before {
  content: "\eb44";
  position: absolute;
  
}
.ki-handcart.ki-filled:after {
  content: "\eb45";
  
  opacity: 0.1;
}
.ki-handcart.ki-filled:before {
  content: "\eb46";
  position: absolute;
  
}
.ki-happyemoji.ki-filled:after {
  content: "\eb47";
  
  opacity: 0.1;
}
.ki-happyemoji.ki-filled:before {
  content: "\eb48";
  position: absolute;
  
}
.ki-heart-circle.ki-filled:after {
  content: "\eb49";
  
  opacity: 0.1;
}
.ki-heart-circle.ki-filled:before {
  content: "\eb4a";
  position: absolute;
  
}
.ki-heart.ki-filled:after {
  content: "\eb4b";
  
  opacity: 0.1;
}
.ki-heart.ki-filled:before {
  content: "\eb4c";
  position: absolute;
  
}
.ki-home-1.ki-filled:after {
  content: "\eb4d";
  
  opacity: 0.1;
}
.ki-home-1.ki-filled:before {
  content: "\eb4e";
  position: absolute;
  
}
.ki-home-2.ki-filled:after {
  content: "\eb4f";
  
  opacity: 0.1;
}
.ki-home-2.ki-filled:before {
  content: "\eb50";
  position: absolute;
  
}
.ki-home-3.ki-filled:after {
  content: "\eb51";
  
  opacity: 0.1;
}
.ki-home-3.ki-filled:before {
  content: "\eb52";
  position: absolute;
  
}
.ki-home.ki-filled:after {
  content: "\eb53";
  
  opacity: 0.1;
}
.ki-home.ki-filled:before {
  content: "\eb54";
  position: absolute;
  
}
.ki-html.ki-filled:after {
  content: "\eb55";
  
  opacity: 0.1;
}
.ki-html.ki-filled:before {
  content: "\eb56";
  position: absolute;
  
}
.ki-icon.ki-filled:after {
  content: "\eb57";
  
  opacity: 0.1;
}
.ki-icon.ki-filled:before {
  content: "\eb58";
  position: absolute;
  
}
.ki-illustrator.ki-filled:after {
  content: "\eb59";
  
  opacity: 0.1;
}
.ki-illustrator.ki-filled:before {
  content: "\eb5a";
  position: absolute;
  
}
.ki-information-1.ki-filled:after {
  content: "\eb5b";
  
  opacity: 0.1;
}
.ki-information-1.ki-filled:before {
  content: "\eb5c";
  position: absolute;
  
}
.ki-information-2.ki-filled:after {
  content: "\eb5d";
  
  opacity: 0.1;
}
.ki-information-2.ki-filled:before {
  content: "\eb5e";
  position: absolute;
  
}
.ki-information-3.ki-filled:after {
  content: "\eb5f";
  
  opacity: 0.1;
}
.ki-information-3.ki-filled:before {
  content: "\eb60";
  position: absolute;
  
}
.ki-information-4.ki-filled:after {
  content: "\eb61";
  
  opacity: 0.1;
}
.ki-information-4.ki-filled:before {
  content: "\eb62";
  position: absolute;
  
}
.ki-information.ki-filled:after {
  content: "\eb63";
  
  opacity: 0.1;
}
.ki-information.ki-filled:before {
  content: "\eb64";
  position: absolute;
  
}
.ki-instagram.ki-filled:after {
  content: "\eb65";
  
  opacity: 0.1;
}
.ki-instagram.ki-filled:before {
  content: "\eb66";
  position: absolute;
  
}
.ki-joystick.ki-filled:after {
  content: "\eb67";
  
  opacity: 0.1;
}
.ki-joystick.ki-filled:before {
  content: "\eb68";
  position: absolute;
  
}
.ki-js-2.ki-filled:after {
  content: "\eb69";
  
  opacity: 0.1;
}
.ki-js-2.ki-filled:before {
  content: "\eb6a";
  position: absolute;
  
}
.ki-js.ki-filled:after {
  content: "\eb6b";
  
  opacity: 0.1;
}
.ki-js.ki-filled:before {
  content: "\eb6c";
  position: absolute;
  
}
.ki-kanban.ki-filled:after {
  content: "\eb6d";
  
  opacity: 0.1;
}
.ki-kanban.ki-filled:before {
  content: "\eb6e";
  position: absolute;
  
}
.ki-key-square.ki-filled:after {
  content: "\eb6f";
  
  opacity: 0.1;
}
.ki-key-square.ki-filled:before {
  content: "\eb70";
  position: absolute;
  
}
.ki-key.ki-filled:after {
  content: "\eb71";
  
  opacity: 0.1;
}
.ki-key.ki-filled:before {
  content: "\eb72";
  position: absolute;
  
}
.ki-keyboard.ki-filled:after {
  content: "\eb73";
  
  opacity: 0.1;
}
.ki-keyboard.ki-filled:before {
  content: "\eb74";
  position: absolute;
  
}
.ki-laptop.ki-filled:after {
  content: "\eb75";
  
  opacity: 0.1;
}
.ki-laptop.ki-filled:before {
  content: "\eb76";
  position: absolute;
  
}
.ki-laravel.ki-filled:after {
  content: "\eb77";
  
  opacity: 0.1;
}
.ki-laravel.ki-filled:before {
  content: "\eb78";
  position: absolute;
  
}
.ki-left-square.ki-filled:after {
  content: "\eb79";
  
  opacity: 0.1;
}
.ki-left-square.ki-filled:before {
  content: "\eb7a";
  position: absolute;
  
}
.ki-left.ki-filled:before {
  content: "\eb7b";
}
.ki-like-2.ki-filled:after {
  content: "\eb7c";
  
  opacity: 0.1;
}
.ki-like-2.ki-filled:before {
  content: "\eb7d";
  position: absolute;
  
}
.ki-like-folder.ki-filled:after {
  content: "\eb7e";
  
  opacity: 0.1;
}
.ki-like-folder.ki-filled:before {
  content: "\eb7f";
  position: absolute;
  
}
.ki-like-shapes.ki-filled:after {
  content: "\eb80";
  
  opacity: 0.1;
}
.ki-like-shapes.ki-filled:before {
  content: "\eb81";
  position: absolute;
  
}
.ki-like-tag.ki-filled:after {
  content: "\eb82";
  
  opacity: 0.1;
}
.ki-like-tag.ki-filled:before {
  content: "\eb83";
  position: absolute;
  
}
.ki-like.ki-filled:after {
  content: "\eb84";
  
  opacity: 0.1;
}
.ki-like.ki-filled:before {
  content: "\eb85";
  position: absolute;
  
}
.ki-loading.ki-filled:before {
  content: "\eb86";
}
.ki-lock-2.ki-filled:after {
  content: "\eb87";
  
  opacity: 0.1;
}
.ki-lock-2.ki-filled:before {
  content: "\eb88";
  position: absolute;
  
}
.ki-lock-3.ki-filled:after {
  content: "\eb89";
  
  opacity: 0.1;
}
.ki-lock-3.ki-filled:before {
  content: "\eb8a";
  position: absolute;
  
}
.ki-lock.ki-filled:after {
  content: "\eb8b";
  
  opacity: 0.1;
}
.ki-lock.ki-filled:before {
  content: "\eb8c";
  position: absolute;
  
}
.ki-logistic.ki-filled:after {
  content: "\eb8d";
  
  opacity: 0.1;
}
.ki-logistic.ki-filled:before {
  content: "\eb8e";
  position: absolute;
  
}
.ki-lots-shopping.ki-filled:after {
  content: "\eb8f";
  
  opacity: 0.1;
}
.ki-lots-shopping.ki-filled:before {
  content: "\eb90";
  position: absolute;
  
}
.ki-lovely.ki-filled:after {
  content: "\eb91";
  
  opacity: 0.1;
}
.ki-lovely.ki-filled:before {
  content: "\eb92";
  position: absolute;
  
}
.ki-lts.ki-filled:after {
  content: "\eb93";
  
  opacity: 0.1;
}
.ki-lts.ki-filled:before {
  content: "\eb94";
  position: absolute;
  
}
.ki-magnifier.ki-filled:after {
  content: "\eb95";
  
  opacity: 0.1;
}
.ki-magnifier.ki-filled:before {
  content: "\eb96";
  position: absolute;
  
}
.ki-map.ki-filled:after {
  content: "\eb97";
  
  opacity: 0.1;
}
.ki-map.ki-filled:before {
  content: "\eb98";
  position: absolute;
  
}
.ki-mask.ki-filled:after {
  content: "\eb99";
  
  opacity: 0.1;
}
.ki-mask.ki-filled:before {
  content: "\eb9a";
  position: absolute;
  
}
.ki-maximize.ki-filled:after {
  content: "\eb9b";
  
  opacity: 0.1;
}
.ki-maximize.ki-filled:before {
  content: "\eb9c";
  position: absolute;
  
}
.ki-medal-star.ki-filled:after {
  content: "\eb9d";
  
  opacity: 0.1;
}
.ki-medal-star.ki-filled:before {
  content: "\eb9e";
  position: absolute;
  
}
.ki-menu.ki-filled:after {
  content: "\eb9f";
  
  opacity: 0.1;
}
.ki-menu.ki-filled:before {
  content: "\eba0";
  position: absolute;
  
}
.ki-message-add.ki-filled:after {
  content: "\eba1";
  
  opacity: 0.1;
}
.ki-message-add.ki-filled:before {
  content: "\eba2";
  position: absolute;
  
}
.ki-message-edit.ki-filled:after {
  content: "\eba3";
  
  opacity: 0.1;
}
.ki-message-edit.ki-filled:before {
  content: "\eba4";
  position: absolute;
  
}
.ki-message-minus.ki-filled:after {
  content: "\eba5";
  
  opacity: 0.1;
}
.ki-message-minus.ki-filled:before {
  content: "\eba6";
  position: absolute;
  
}
.ki-message-notify.ki-filled:after {
  content: "\eba7";
  
  opacity: 0.1;
}
.ki-message-notify.ki-filled:before {
  content: "\eba8";
  position: absolute;
  
}
.ki-message-programming.ki-filled:after {
  content: "\eba9";
  
  opacity: 0.1;
}
.ki-message-programming.ki-filled:before {
  content: "\ebaa";
  position: absolute;
  
}
.ki-message-question.ki-filled:after {
  content: "\ebab";
  
  opacity: 0.1;
}
.ki-message-question.ki-filled:before {
  content: "\ebac";
  position: absolute;
  
}
.ki-message-text-2.ki-filled:after {
  content: "\ebad";
  
  opacity: 0.1;
}
.ki-message-text-2.ki-filled:before {
  content: "\ebae";
  position: absolute;
  
}
.ki-message-text.ki-filled:after {
  content: "\ebaf";
  
  opacity: 0.1;
}
.ki-message-text.ki-filled:before {
  content: "\ebb0";
  position: absolute;
  
}
.ki-messages.ki-filled:after {
  content: "\ebb1";
  
  opacity: 0.1;
}
.ki-messages.ki-filled:before {
  content: "\ebb2";
  position: absolute;
  
}
.ki-microsoft.ki-filled:after {
  content: "\ebb3";
  
  opacity: 0.1;
}
.ki-microsoft.ki-filled:before {
  content: "\ebb4";
  position: absolute;
  
}
.ki-milk.ki-filled:after {
  content: "\ebb5";
  
  opacity: 0.1;
}
.ki-milk.ki-filled:before {
  content: "\ebb6";
  position: absolute;
  
}
.ki-minus-circle.ki-filled:after {
  content: "\ebb7";
  
  opacity: 0.1;
}
.ki-minus-circle.ki-filled:before {
  content: "\ebb8";
  position: absolute;
  
}
.ki-minus-folder.ki-filled:after {
  content: "\ebb9";
  
  opacity: 0.1;
}
.ki-minus-folder.ki-filled:before {
  content: "\ebba";
  position: absolute;
  
}
.ki-minus-squared.ki-filled:after {
  content: "\ebbb";
  
  opacity: 0.1;
}
.ki-minus-squared.ki-filled:before {
  content: "\ebbc";
  position: absolute;
  
}
.ki-minus.ki-filled:before {
  content: "\ebbd";
}
.ki-moon.ki-filled:after {
  content: "\ebbe";
  
  opacity: 0.1;
}
.ki-moon.ki-filled:before {
  content: "\ebbf";
  position: absolute;
  
}
.ki-more-2.ki-filled:after {
  content: "\ebc0";
  
  opacity: 0.1;
}
.ki-more-2.ki-filled:before {
  content: "\ebc1";
  position: absolute;
  
}
.ki-mouse-circle.ki-filled:after {
  content: "\ebc2";
  
  opacity: 0.1;
}
.ki-mouse-circle.ki-filled:before {
  content: "\ebc3";
  position: absolute;
  
}
.ki-mouse-square.ki-filled:after {
  content: "\ebc4";
  
  opacity: 0.1;
}
.ki-mouse-square.ki-filled:before {
  content: "\ebc5";
  position: absolute;
  
}
.ki-mouse.ki-filled:after {
  content: "\ebc6";
  
  opacity: 0.1;
}
.ki-mouse.ki-filled:before {
  content: "\ebc7";
  position: absolute;
  
}
.ki-nexo.ki-filled:after {
  content: "\ebc8";
  
  opacity: 0.1;
}
.ki-nexo.ki-filled:before {
  content: "\ebc9";
  position: absolute;
  
}
.ki-night-day.ki-filled:after {
  content: "\ebca";
  
  opacity: 0.1;
}
.ki-night-day.ki-filled:before {
  content: "\ebcb";
  position: absolute;
  
}
.ki-note-2.ki-filled:after {
  content: "\ebcc";
  
  opacity: 0.1;
}
.ki-note-2.ki-filled:before {
  content: "\ebcd";
  position: absolute;
  
}
.ki-note.ki-filled:after {
  content: "\ebce";
  
  opacity: 0.1;
}
.ki-note.ki-filled:before {
  content: "\ebcf";
  position: absolute;
  
}
.ki-notepad-bookmark.ki-filled:after {
  content: "\ebd0";
  
  opacity: 0.1;
}
.ki-notepad-bookmark.ki-filled:before {
  content: "\ebd1";
  position: absolute;
  
}
.ki-notepad-edit.ki-filled:after {
  content: "\ebd2";
  
  opacity: 0.1;
}
.ki-notepad-edit.ki-filled:before {
  content: "\ebd3";
  position: absolute;
  
}
.ki-notepad.ki-filled:after {
  content: "\ebd4";
  
  opacity: 0.1;
}
.ki-notepad.ki-filled:before {
  content: "\ebd5";
  position: absolute;
  
}
.ki-notification-1.ki-filled:after {
  content: "\ebd6";
  
  opacity: 0.1;
}
.ki-notification-1.ki-filled:before {
  content: "\ebd7";
  position: absolute;
  
}
.ki-notification-bing.ki-filled:after {
  content: "\ebd8";
  
  opacity: 0.1;
}
.ki-notification-bing.ki-filled:before {
  content: "\ebd9";
  position: absolute;
  
}
.ki-notification-circle.ki-filled:after {
  content: "\ebda";
  
  opacity: 0.1;
}
.ki-notification-circle.ki-filled:before {
  content: "\ebdb";
  position: absolute;
  
}
.ki-notification-favorite.ki-filled:after {
  content: "\ebdc";
  
  opacity: 0.1;
}
.ki-notification-favorite.ki-filled:before {
  content: "\ebdd";
  position: absolute;
  
}
.ki-notification-on.ki-filled:after {
  content: "\ebde";
  
  opacity: 0.1;
}
.ki-notification-on.ki-filled:before {
  content: "\ebdf";
  position: absolute;
  
}
.ki-notification-status.ki-filled:after {
  content: "\ebe0";
  
  opacity: 0.1;
}
.ki-notification-status.ki-filled:before {
  content: "\ebe1";
  position: absolute;
  
}
.ki-notification.ki-filled:after {
  content: "\ebe2";
  
  opacity: 0.1;
}
.ki-notification.ki-filled:before {
  content: "\ebe3";
  position: absolute;
  
}
.ki-ocean.ki-filled:before {
  content: "\ebe4";
}
.ki-office-bag.ki-filled:after {
  content: "\ebe5";
  
  opacity: 0.1;
}
.ki-office-bag.ki-filled:before {
  content: "\ebe6";
  position: absolute;
  
}
.ki-package.ki-filled:after {
  content: "\ebe7";
  
  opacity: 0.1;
}
.ki-package.ki-filled:before {
  content: "\ebe8";
  position: absolute;
  
}
.ki-pad.ki-filled:after {
  content: "\ebe9";
  
  opacity: 0.1;
}
.ki-pad.ki-filled:before {
  content: "\ebea";
  position: absolute;
  
}
.ki-pails.ki-filled:after {
  content: "\ebeb";
  
  opacity: 0.1;
}
.ki-pails.ki-filled:before {
  content: "\ebec";
  position: absolute;
  
}
.ki-paintbucket.ki-filled:after {
  content: "\ebed";
  
  opacity: 0.1;
}
.ki-paintbucket.ki-filled:before {
  content: "\ebee";
  position: absolute;
  
}
.ki-paper-clip.ki-filled:after {
  content: "\ebef";
  
  opacity: 0.1;
}
.ki-paper-clip.ki-filled:before {
  content: "\ebf0";
  position: absolute;
  
}
.ki-paper-plane.ki-filled:after {
  content: "\ebf1";
  
  opacity: 0.1;
}
.ki-paper-plane.ki-filled:before {
  content: "\ebf2";
  position: absolute;
  
}
.ki-parcel-tracking.ki-filled:after {
  content: "\ebf3";
  
  opacity: 0.1;
}
.ki-parcel-tracking.ki-filled:before {
  content: "\ebf4";
  position: absolute;
  
}
.ki-parcel.ki-filled:after {
  content: "\ebf5";
  
  opacity: 0.1;
}
.ki-parcel.ki-filled:before {
  content: "\ebf6";
  position: absolute;
  
}
.ki-password-check.ki-filled:after {
  content: "\ebf7";
  
  opacity: 0.1;
}
.ki-password-check.ki-filled:before {
  content: "\ebf8";
  position: absolute;
  
}
.ki-paypal.ki-filled:after {
  content: "\ebf9";
  
  opacity: 0.1;
}
.ki-paypal.ki-filled:before {
  content: "\ebfa";
  position: absolute;
  
}
.ki-pencil.ki-filled:after {
  content: "\ebfb";
  
  opacity: 0.1;
}
.ki-pencil.ki-filled:before {
  content: "\ebfc";
  position: absolute;
  
}
.ki-people.ki-filled:after {
  content: "\ebfd";
  
  opacity: 0.1;
}
.ki-people.ki-filled:before {
  content: "\ebfe";
  position: absolute;
  
}
.ki-percentage.ki-filled:after {
  content: "\ebff";
  
  opacity: 0.1;
}
.ki-percentage.ki-filled:before {
  content: "\ec00";
  position: absolute;
  
}
.ki-phone.ki-filled:after {
  content: "\ec01";
  
  opacity: 0.1;
}
.ki-phone.ki-filled:before {
  content: "\ec02";
  position: absolute;
  
}
.ki-photoshop.ki-filled:after {
  content: "\ec03";
  
  opacity: 0.1;
}
.ki-photoshop.ki-filled:before {
  content: "\ec04";
  position: absolute;
  
}
.ki-picture.ki-filled:after {
  content: "\ec05";
  
  opacity: 0.1;
}
.ki-picture.ki-filled:before {
  content: "\ec06";
  position: absolute;
  
}
.ki-pill.ki-filled:after {
  content: "\ec07";
  
  opacity: 0.1;
}
.ki-pill.ki-filled:before {
  content: "\ec08";
  position: absolute;
  
}
.ki-pin.ki-filled:after {
  content: "\ec09";
  
  opacity: 0.1;
}
.ki-pin.ki-filled:before {
  content: "\ec0a";
  position: absolute;
  
}
.ki-plus-circle.ki-filled:after {
  content: "\ec0b";
  
  opacity: 0.1;
}
.ki-plus-circle.ki-filled:before {
  content: "\ec0c";
  position: absolute;
  
}
.ki-plus-squared.ki-filled:after {
  content: "\ec0d";
  
  opacity: 0.1;
}
.ki-plus-squared.ki-filled:before {
  content: "\ec0e";
  position: absolute;
  
}
.ki-plus.ki-filled:before {
  content: "\ec0f";
}
.ki-pointers.ki-filled:after {
  content: "\ec10";
  
  opacity: 0.1;
}
.ki-pointers.ki-filled:before {
  content: "\ec11";
  position: absolute;
  
}
.ki-price-tag.ki-filled:after {
  content: "\ec12";
  
  opacity: 0.1;
}
.ki-price-tag.ki-filled:before {
  content: "\ec13";
  position: absolute;
  
}
.ki-printer.ki-filled:after {
  content: "\ec14";
  
  opacity: 0.1;
}
.ki-printer.ki-filled:before {
  content: "\ec15";
  position: absolute;
  
}
.ki-profile-circle.ki-filled:after {
  content: "\ec16";
  
  opacity: 0.1;
}
.ki-profile-circle.ki-filled:before {
  content: "\ec17";
  position: absolute;
  
}
.ki-pulse.ki-filled:after {
  content: "\ec18";
  
  opacity: 0.1;
}
.ki-pulse.ki-filled:before {
  content: "\ec19";
  position: absolute;
  
}
.ki-purchase.ki-filled:after {
  content: "\ec1a";
  
  opacity: 0.1;
}
.ki-purchase.ki-filled:before {
  content: "\ec1b";
  position: absolute;
  
}
.ki-python.ki-filled:after {
  content: "\ec1c";
  
  opacity: 0.1;
}
.ki-python.ki-filled:before {
  content: "\ec1d";
  position: absolute;
  
}
.ki-question-2.ki-filled:after {
  content: "\ec1e";
  
  opacity: 0.1;
}
.ki-question-2.ki-filled:before {
  content: "\ec1f";
  position: absolute;
  
}
.ki-question.ki-filled:after {
  content: "\ec20";
  
  opacity: 0.1;
}
.ki-question.ki-filled:before {
  content: "\ec21";
  position: absolute;
  
}
.ki-questionnaire-tablet.ki-filled:after {
  content: "\ec22";
  
  opacity: 0.1;
}
.ki-questionnaire-tablet.ki-filled:before {
  content: "\ec23";
  position: absolute;
  
}
.ki-ranking.ki-filled:after {
  content: "\ec24";
  
  opacity: 0.1;
}
.ki-ranking.ki-filled:before {
  content: "\ec25";
  position: absolute;
  
}
.ki-react.ki-filled:after {
  content: "\ec26";
  
  opacity: 0.1;
}
.ki-react.ki-filled:before {
  content: "\ec27";
  position: absolute;
  
}
.ki-receipt-square.ki-filled:after {
  content: "\ec28";
  
  opacity: 0.1;
}
.ki-receipt-square.ki-filled:before {
  content: "\ec29";
  position: absolute;
  
}
.ki-rescue.ki-filled:after {
  content: "\ec2a";
  
  opacity: 0.1;
}
.ki-rescue.ki-filled:before {
  content: "\ec2b";
  position: absolute;
  
}
.ki-right-left.ki-filled:before {
  content: "\ec2c";
}
.ki-right-square.ki-filled:after {
  content: "\ec2d";
  
  opacity: 0.1;
}
.ki-right-square.ki-filled:before {
  content: "\ec2e";
  position: absolute;
  
}
.ki-right.ki-filled:before {
  content: "\ec2f";
}
.ki-rocket.ki-filled:after {
  content: "\ec30";
  
  opacity: 0.1;
}
.ki-rocket.ki-filled:before {
  content: "\ec31";
  position: absolute;
  
}
.ki-route.ki-filled:after {
  content: "\ec32";
  
  opacity: 0.1;
}
.ki-route.ki-filled:before {
  content: "\ec33";
  position: absolute;
  
}
.ki-router.ki-filled:after {
  content: "\ec34";
  
  opacity: 0.1;
}
.ki-router.ki-filled:before {
  content: "\ec35";
  position: absolute;
  
}
.ki-row-horizontal.ki-filled:after {
  content: "\ec36";
  
  opacity: 0.1;
}
.ki-row-horizontal.ki-filled:before {
  content: "\ec37";
  position: absolute;
  
}
.ki-row-vertical.ki-filled:after {
  content: "\ec38";
  
  opacity: 0.1;
}
.ki-row-vertical.ki-filled:before {
  content: "\ec39";
  position: absolute;
  
}
.ki-safe-home.ki-filled:after {
  content: "\ec3a";
  
  opacity: 0.1;
}
.ki-safe-home.ki-filled:before {
  content: "\ec3b";
  position: absolute;
  
}
.ki-satellite.ki-filled:after {
  content: "\ec3c";
  
  opacity: 0.1;
}
.ki-satellite.ki-filled:before {
  content: "\ec3d";
  position: absolute;
  
}
.ki-save-2.ki-filled:after {
  content: "\ec3e";
  
  opacity: 0.1;
}
.ki-save-2.ki-filled:before {
  content: "\ec3f";
  position: absolute;
  
}
.ki-save-deposit.ki-filled:after {
  content: "\ec40";
  
  opacity: 0.1;
}
.ki-save-deposit.ki-filled:before {
  content: "\ec41";
  position: absolute;
  
}
.ki-scan-barcode.ki-filled:after {
  content: "\ec42";
  
  opacity: 0.1;
}
.ki-scan-barcode.ki-filled:before {
  content: "\ec43";
  position: absolute;
  
}
.ki-screen.ki-filled:after {
  content: "\ec44";
  
  opacity: 0.1;
}
.ki-screen.ki-filled:before {
  content: "\ec45";
  position: absolute;
  
}
.ki-scroll.ki-filled:after {
  content: "\ec46";
  
  opacity: 0.1;
}
.ki-scroll.ki-filled:before {
  content: "\ec47";
  position: absolute;
  
}
.ki-search-list.ki-filled:after {
  content: "\ec48";
  
  opacity: 0.1;
}
.ki-search-list.ki-filled:before {
  content: "\ec49";
  position: absolute;
  
}
.ki-security-user.ki-filled:after {
  content: "\ec4a";
  
  opacity: 0.1;
}
.ki-security-user.ki-filled:before {
  content: "\ec4b";
  position: absolute;
  
}
.ki-setting-2.ki-filled:after {
  content: "\ec4c";
  
  opacity: 0.1;
}
.ki-setting-2.ki-filled:before {
  content: "\ec4d";
  position: absolute;
  
}
.ki-setting-3.ki-filled:after {
  content: "\ec4e";
  
  opacity: 0.1;
}
.ki-setting-3.ki-filled:before {
  content: "\ec4f";
  position: absolute;
  
}
.ki-setting-4.ki-filled:after {
  content: "\ec50";
  
  opacity: 0.1;
}
.ki-setting-4.ki-filled:before {
  content: "\ec51";
  position: absolute;
  
}
.ki-setting.ki-filled:after {
  content: "\ec52";
  
  opacity: 0.1;
}
.ki-setting.ki-filled:before {
  content: "\ec53";
  position: absolute;
  
}
.ki-share.ki-filled:after {
  content: "\ec54";
  
  opacity: 0.1;
}
.ki-share.ki-filled:before {
  content: "\ec55";
  position: absolute;
  
}
.ki-shield-cross.ki-filled:after {
  content: "\ec56";
  
  opacity: 0.1;
}
.ki-shield-cross.ki-filled:before {
  content: "\ec57";
  position: absolute;
  
}
.ki-shield-search.ki-filled:after {
  content: "\ec58";
  
  opacity: 0.1;
}
.ki-shield-search.ki-filled:before {
  content: "\ec59";
  position: absolute;
  
}
.ki-shield-slash.ki-filled:after {
  content: "\ec5a";
  
  opacity: 0.1;
}
.ki-shield-slash.ki-filled:before {
  content: "\ec5b";
  position: absolute;
  
}
.ki-shield-tick.ki-filled:after {
  content: "\ec5c";
  
  opacity: 0.1;
}
.ki-shield-tick.ki-filled:before {
  content: "\ec5d";
  position: absolute;
  
}
.ki-shield.ki-filled:after {
  content: "\ec5e";
  
  opacity: 0.1;
}
.ki-shield.ki-filled:before {
  content: "\ec5f";
  position: absolute;
  
}
.ki-ship.ki-filled:after {
  content: "\ec60";
  
  opacity: 0.1;
}
.ki-ship.ki-filled:before {
  content: "\ec61";
  position: absolute;
  
}
.ki-shop.ki-filled:after {
  content: "\ec62";
  
  opacity: 0.1;
}
.ki-shop.ki-filled:before {
  content: "\ec63";
  position: absolute;
  
}
.ki-simcard-2.ki-filled:after {
  content: "\ec64";
  
  opacity: 0.1;
}
.ki-simcard-2.ki-filled:before {
  content: "\ec65";
  position: absolute;
  
}
.ki-simcard.ki-filled:after {
  content: "\ec66";
  
  opacity: 0.1;
}
.ki-simcard.ki-filled:before {
  content: "\ec67";
  position: absolute;
  
}
.ki-size.ki-filled:after {
  content: "\ec68";
  
  opacity: 0.1;
}
.ki-size.ki-filled:before {
  content: "\ec69";
  position: absolute;
  
}
.ki-slack.ki-filled:after {
  content: "\ec6a";
  
  opacity: 0.1;
}
.ki-slack.ki-filled:before {
  content: "\ec6b";
  position: absolute;
  
}
.ki-slider-horizontal-2.ki-filled:after {
  content: "\ec6c";
  
  opacity: 0.1;
}
.ki-slider-horizontal-2.ki-filled:before {
  content: "\ec6d";
  position: absolute;
  
}
.ki-slider-horizontal.ki-filled:after {
  content: "\ec6e";
  
  opacity: 0.1;
}
.ki-slider-horizontal.ki-filled:before {
  content: "\ec6f";
  position: absolute;
  
}
.ki-slider-vertica.ki-filled:after {
  content: "\ec70";
  
  opacity: 0.1;
}
.ki-slider-vertica.ki-filled:before {
  content: "\ec71";
  position: absolute;
  
}
.ki-slider-vertical.ki-filled:after {
  content: "\ec72";
  
  opacity: 0.1;
}
.ki-slider-vertical.ki-filled:before {
  content: "\ec73";
  position: absolute;
  
}
.ki-slider.ki-filled:after {
  content: "\ec74";
  
  opacity: 0.1;
}
.ki-slider.ki-filled:before {
  content: "\ec75";
  position: absolute;
  
}
.ki-sms.ki-filled:after {
  content: "\ec76";
  
  opacity: 0.1;
}
.ki-sms.ki-filled:before {
  content: "\ec77";
  position: absolute;
  
}
.ki-snapchat.ki-filled:after {
  content: "\ec78";
  
  opacity: 0.1;
}
.ki-snapchat.ki-filled:before {
  content: "\ec79";
  position: absolute;
  
}
.ki-social-media.ki-filled:after {
  content: "\ec7a";
  
  opacity: 0.1;
}
.ki-social-media.ki-filled:before {
  content: "\ec7b";
  position: absolute;
  
}
.ki-soft-2.ki-filled:after {
  content: "\ec7c";
  
  opacity: 0.1;
}
.ki-soft-2.ki-filled:before {
  content: "\ec7d";
  position: absolute;
  
}
.ki-soft-3.ki-filled:after {
  content: "\ec7e";
  
  opacity: 0.1;
}
.ki-soft-3.ki-filled:before {
  content: "\ec7f";
  position: absolute;
  
}
.ki-soft.ki-filled:after {
  content: "\ec80";
  
  opacity: 0.1;
}
.ki-soft.ki-filled:before {
  content: "\ec81";
  position: absolute;
  
}
.ki-some-files.ki-filled:after {
  content: "\ec82";
  
  opacity: 0.1;
}
.ki-some-files.ki-filled:before {
  content: "\ec83";
  position: absolute;
  
}
.ki-sort.ki-filled:after {
  content: "\ec84";
  
  opacity: 0.1;
}
.ki-sort.ki-filled:before {
  content: "\ec85";
  position: absolute;
  
}
.ki-speaker.ki-filled:after {
  content: "\ec86";
  
  opacity: 0.1;
}
.ki-speaker.ki-filled:before {
  content: "\ec87";
  position: absolute;
  
}
.ki-spotify.ki-filled:after {
  content: "\ec88";
  
  opacity: 0.1;
}
.ki-spotify.ki-filled:before {
  content: "\ec89";
  position: absolute;
  
}
.ki-spring-framework.ki-filled:after {
  content: "\ec8a";
  
  opacity: 0.1;
}
.ki-spring-framework.ki-filled:before {
  content: "\ec8b";
  position: absolute;
  
}
.ki-square-brackets.ki-filled:after {
  content: "\ec8c";
  
  opacity: 0.1;
}
.ki-square-brackets.ki-filled:before {
  content: "\ec8d";
  position: absolute;
  
}
.ki-star.ki-filled:after {
  content: "\ec8e";
  
  opacity: 0.1;
}
.ki-star.ki-filled:before {
  content: "\ec8f";
  position: absolute;
  
}
.ki-status.ki-filled:after {
  content: "\ec90";
  
  opacity: 0.1;
}
.ki-status.ki-filled:before {
  content: "\ec91";
  position: absolute;
  
}
.ki-subtitle.ki-filled:after {
  content: "\ec92";
  
  opacity: 0.1;
}
.ki-subtitle.ki-filled:before {
  content: "\ec93";
  position: absolute;
  
}
.ki-sun.ki-filled:after {
  content: "\ec94";
  
  opacity: 0.1;
}
.ki-sun.ki-filled:before {
  content: "\ec95";
  position: absolute;
  
}
.ki-support.ki-filled:after {
  content: "\ec96";
  
  opacity: 0.1;
}
.ki-support.ki-filled:before {
  content: "\ec97";
  position: absolute;
  
}
.ki-switch.ki-filled:after {
  content: "\ec98";
  
  opacity: 0.1;
}
.ki-switch.ki-filled:before {
  content: "\ec99";
  position: absolute;
  
}
.ki-syringe.ki-filled:after {
  content: "\ec9a";
  
  opacity: 0.1;
}
.ki-syringe.ki-filled:before {
  content: "\ec9b";
  position: absolute;
  
}
.ki-tab-tablet.ki-filled:after {
  content: "\ec9c";
  
  opacity: 0.1;
}
.ki-tab-tablet.ki-filled:before {
  content: "\ec9d";
  position: absolute;
  
}
.ki-tablet-delete.ki-filled:after {
  content: "\ec9e";
  
  opacity: 0.1;
}
.ki-tablet-delete.ki-filled:before {
  content: "\ec9f";
  position: absolute;
  
}
.ki-tablet-down.ki-filled:after {
  content: "\eca0";
  
  opacity: 0.1;
}
.ki-tablet-down.ki-filled:before {
  content: "\eca1";
  position: absolute;
  
}
.ki-tablet-ok.ki-filled:after {
  content: "\eca2";
  
}
.ki-tablet-ok.ki-filled:before {
  content: "\eca3";
  position: absolute;
  
  opacity: 0.1;
}
.ki-tablet-text-down.ki-filled:after {
  content: "\eca4";
  
  opacity: 0.1;
}
.ki-tablet-text-down.ki-filled:before {
  content: "\eca5";
  position: absolute;
  
}
.ki-tablet-text-up.ki-filled:after {
  content: "\eca6";
  
  opacity: 0.1;
}
.ki-tablet-text-up.ki-filled:before {
  content: "\eca7";
  position: absolute;
  
}
.ki-tablet-up.ki-filled:after {
  content: "\eca8";
  
  opacity: 0.1;
}
.ki-tablet-up.ki-filled:before {
  content: "\eca9";
  position: absolute;
  
}
.ki-tablet.ki-filled:after {
  content: "\ecaa";
  
  opacity: 0.1;
}
.ki-tablet.ki-filled:before {
  content: "\ecab";
  position: absolute;
  
}
.ki-tag-cross.ki-filled:after {
  content: "\ecac";
  
  opacity: 0.1;
}
.ki-tag-cross.ki-filled:before {
  content: "\ecad";
  position: absolute;
  
}
.ki-tag.ki-filled:after {
  content: "\ecae";
  
  opacity: 0.1;
}
.ki-tag.ki-filled:before {
  content: "\ecaf";
  position: absolute;
  
}
.ki-teacher.ki-filled:after {
  content: "\ecb0";
  
  opacity: 0.1;
}
.ki-teacher.ki-filled:before {
  content: "\ecb1";
  position: absolute;
  
}
.ki-technology-1.ki-filled:after {
  content: "\ecb2";
  
  opacity: 0.1;
}
.ki-technology-1.ki-filled:before {
  content: "\ecb3";
  position: absolute;
  
}
.ki-technology-2.ki-filled:after {
  content: "\ecb4";
  
  opacity: 0.1;
}
.ki-technology-2.ki-filled:before {
  content: "\ecb5";
  position: absolute;
  
}
.ki-technology-3.ki-filled:after {
  content: "\ecb6";
  
  opacity: 0.1;
}
.ki-technology-3.ki-filled:before {
  content: "\ecb7";
  position: absolute;
  
}
.ki-technology-4.ki-filled:after {
  content: "\ecb8";
  
  opacity: 0.1;
}
.ki-technology-4.ki-filled:before {
  content: "\ecb9";
  position: absolute;
  
}
.ki-telephone-geolocation.ki-filled:after {
  content: "\ecba";
  
  opacity: 0.1;
}
.ki-telephone-geolocation.ki-filled:before {
  content: "\ecbb";
  position: absolute;
  
}
.ki-test-tubes.ki-filled:after {
  content: "\ecbc";
  
  opacity: 0.1;
}
.ki-test-tubes.ki-filled:before {
  content: "\ecbd";
  position: absolute;
  
}
.ki-text-bold.ki-filled:after {
  content: "\ecbe";
  
  opacity: 0.1;
}
.ki-text-bold.ki-filled:before {
  content: "\ecbf";
  position: absolute;
  
}
.ki-text-circle.ki-filled:before {
  content: "\ecc0";
}
.ki-text-italic.ki-filled:after {
  content: "\ecc1";
  
  opacity: 0.1;
}
.ki-text-italic.ki-filled:before {
  content: "\ecc2";
  position: absolute;
  
}
.ki-text-number.ki-filled:before {
  content: "\ecc3";
}
.ki-text-strikethrough.ki-filled:after {
  content: "\ecc4";
  
  opacity: 0.1;
}
.ki-text-strikethrough.ki-filled:before {
  content: "\ecc5";
  position: absolute;
  
}
.ki-text-underline.ki-filled:after {
  content: "\ecc6";
  
}
.ki-text-underline.ki-filled:before {
  content: "\ecc7";
  position: absolute;
  
  opacity: 0.1;
}
.ki-text.ki-filled:after {
  content: "\ecc8";
  
  opacity: 0.1;
}
.ki-text.ki-filled:before {
  content: "\ecc9";
  position: absolute;
  
}
.ki-textalign-center.ki-filled:before {
  content: "\ecca";
}
.ki-textalign-justifycenter.ki-filled:before {
  content: "\eccb";
}
.ki-textalign-left.ki-filled:before {
  content: "\eccc";
}
.ki-textalign-right.ki-filled:before {
  content: "\eccd";
}
.ki-thermometer.ki-filled:after {
  content: "\ecce";
  
  opacity: 0.1;
}
.ki-thermometer.ki-filled:before {
  content: "\eccf";
  position: absolute;
  
}
.ki-theta-theta.ki-filled:after {
  content: "\ecd0";
  
  opacity: 0.1;
}
.ki-theta-theta.ki-filled:before {
  content: "\ecd1";
  position: absolute;
  
}
.ki-tiktok.ki-filled:after {
  content: "\ecd2";
  
  opacity: 0.1;
}
.ki-tiktok.ki-filled:before {
  content: "\ecd3";
  position: absolute;
  
}
.ki-time.ki-filled:after {
  content: "\ecd4";
  
  opacity: 0.1;
}
.ki-time.ki-filled:before {
  content: "\ecd5";
  position: absolute;
  
}
.ki-timer.ki-filled:after {
  content: "\ecd6";
  
  opacity: 0.1;
}
.ki-timer.ki-filled:before {
  content: "\ecd7";
  position: absolute;
  
}
.ki-to-left.ki-filled:after {
  content: "\ecd8";
  
  opacity: 0.1;
}
.ki-to-left.ki-filled:before {
  content: "\ecd9";
  position: absolute;
  
}
.ki-to-right.ki-filled:after {
  content: "\ecda";
  
  opacity: 0.1;
}
.ki-to-right.ki-filled:before {
  content: "\ecdb";
  position: absolute;
  
}
.ki-toggle-off-circle.ki-filled:after {
  content: "\ecdc";
  
  opacity: 0.1;
}
.ki-toggle-off-circle.ki-filled:before {
  content: "\ecdd";
  position: absolute;
  
}
.ki-toggle-off.ki-filled:after {
  content: "\ecde";
  
}
.ki-toggle-off.ki-filled:before {
  content: "\ecdf";
  position: absolute;
  
  opacity: 0.1;
}
.ki-toggle-on-circle.ki-filled:after {
  content: "\ece0";
  
  opacity: 0.1;
}
.ki-toggle-on-circle.ki-filled:before {
  content: "\ece1";
  position: absolute;
  
}
.ki-toggle-on.ki-filled:after {
  content: "\ece2";
  
  opacity: 0.1;
}
.ki-toggle-on.ki-filled:before {
  content: "\ece3";
  position: absolute;
  
}
.ki-trash-square.ki-filled:after {
  content: "\ece4";
  
  opacity: 0.1;
}
.ki-trash-square.ki-filled:before {
  content: "\ece5";
  position: absolute;
  
}
.ki-trash.ki-filled:after {
  content: "\ece6";
  
  opacity: 0.1;
}
.ki-trash.ki-filled:before {
  content: "\ece7";
  position: absolute;
  
}
.ki-tree.ki-filled:after {
  content: "\ece8";
  
  opacity: 0.1;
}
.ki-tree.ki-filled:before {
  content: "\ece9";
  position: absolute;
  
}
.ki-trello.ki-filled:after {
  content: "\ecea";
  
  opacity: 0.1;
}
.ki-trello.ki-filled:before {
  content: "\eceb";
  position: absolute;
  
}
.ki-ts.ki-filled:after {
  content: "\ecec";
  
  opacity: 0.1;
}
.ki-ts.ki-filled:before {
  content: "\eced";
  position: absolute;
  
}
.ki-twitch.ki-filled:after {
  content: "\ecee";
  
  opacity: 0.1;
}
.ki-twitch.ki-filled:before {
  content: "\ecef";
  position: absolute;
  
}
.ki-twitter.ki-filled:after {
  content: "\ecf0";
  
  opacity: 0.1;
}
.ki-twitter.ki-filled:before {
  content: "\ecf1";
  position: absolute;
  
}
.ki-two-credit-cart.ki-filled:after {
  content: "\ecf2";
  
  opacity: 0.1;
}
.ki-two-credit-cart.ki-filled:before {
  content: "\ecf3";
  position: absolute;
  
}
.ki-underlining.ki-filled:after {
  content: "\ecf4";
  
  opacity: 0.1;
}
.ki-underlining.ki-filled:before {
  content: "\ecf5";
  position: absolute;
  
}
.ki-up-diagonal.ki-filled:before {
  content: "\ecf6";
}
.ki-up-down.ki-filled:before {
  content: "\ecf7";
}
.ki-up-square.ki-filled:after {
  content: "\ecf8";
  
}
.ki-up-square.ki-filled:before {
  content: "\ecf9";
  position: absolute;
  
  opacity: 0.1;
}
.ki-up.ki-filled:before {
  content: "\ecfa";
}
.ki-update-file.ki-filled:after {
  content: "\ecfb";
  
  opacity: 0.1;
}
.ki-update-file.ki-filled:before {
  content: "\ecfc";
  position: absolute;
  
}
.ki-update-folder.ki-filled:after {
  content: "\ecfd";
  
  opacity: 0.1;
}
.ki-update-folder.ki-filled:before {
  content: "\ecfe";
  position: absolute;
  
}
.ki-user-edit.ki-filled:after {
  content: "\ecff";
  
  opacity: 0.1;
}
.ki-user-edit.ki-filled:before {
  content: "\ed00";
  position: absolute;
  
}
.ki-user-square.ki-filled:after {
  content: "\ed01";
  
  opacity: 0.1;
}
.ki-user-square.ki-filled:before {
  content: "\ed02";
  position: absolute;
  
}
.ki-user-tick.ki-filled:after {
  content: "\ed03";
  
  opacity: 0.1;
}
.ki-user-tick.ki-filled:before {
  content: "\ed04";
  position: absolute;
  
}
.ki-user.ki-filled:after {
  content: "\ed05";
  
  opacity: 0.1;
}
.ki-user.ki-filled:before {
  content: "\ed06";
  position: absolute;
  
}
.ki-users.ki-filled:after {
  content: "\ed07";
  
  opacity: 0.1;
}
.ki-users.ki-filled:before {
  content: "\ed08";
  position: absolute;
  
}
.ki-verify.ki-filled:after {
  content: "\ed09";
  
  opacity: 0.1;
}
.ki-verify.ki-filled:before {
  content: "\ed0a";
  position: absolute;
  
}
.ki-vibe-vibe.ki-filled:after {
  content: "\ed0b";
  
  opacity: 0.1;
}
.ki-vibe-vibe.ki-filled:before {
  content: "\ed0c";
  position: absolute;
  
}
.ki-virus.ki-filled:after {
  content: "\ed0d";
  
  opacity: 0.1;
}
.ki-virus.ki-filled:before {
  content: "\ed0e";
  position: absolute;
  
}
.ki-vue.ki-filled:after {
  content: "\ed0f";
  
  opacity: 0.1;
}
.ki-vue.ki-filled:before {
  content: "\ed10";
  position: absolute;
  
}
.ki-vuesax.ki-filled:after {
  content: "\ed11";
  
  opacity: 0.1;
}
.ki-vuesax.ki-filled:before {
  content: "\ed12";
  position: absolute;
  
}
.ki-wallet.ki-filled:after {
  content: "\ed13";
  
  opacity: 0.1;
}
.ki-wallet.ki-filled:before {
  content: "\ed14";
  position: absolute;
  
}
.ki-wanchain-wan.ki-filled:after {
  content: "\ed15";
  
  opacity: 0.1;
}
.ki-wanchain-wan.ki-filled:before {
  content: "\ed16";
  position: absolute;
  
}
.ki-watch.ki-filled:after {
  content: "\ed17";
  
  opacity: 0.1;
}
.ki-watch.ki-filled:before {
  content: "\ed18";
  position: absolute;
  
}
.ki-whatsapp.ki-filled:after {
  content: "\ed19";
  
  opacity: 0.1;
}
.ki-whatsapp.ki-filled:before {
  content: "\ed1a";
  position: absolute;
  
}
.ki-wifi-home.ki-filled:after {
  content: "\ed1b";
  
  opacity: 0.1;
}
.ki-wifi-home.ki-filled:before {
  content: "\ed1c";
  position: absolute;
  
}
.ki-wifi-square.ki-filled:after {
  content: "\ed1d";
  
  opacity: 0.1;
}
.ki-wifi-square.ki-filled:before {
  content: "\ed1e";
  position: absolute;
  
}
.ki-wifi.ki-filled:after {
  content: "\ed1f";
  
  opacity: 0.1;
}
.ki-wifi.ki-filled:before {
  content: "\ed20";
  position: absolute;
  
}
.ki-wireframe.ki-filled:after {
  content: "\ed21";
  
  opacity: 0.1;
}
.ki-wireframe.ki-filled:before {
  content: "\ed22";
  position: absolute;
  
}
.ki-wlan.ki-filled:before {
  content: "\ed23";
}
.ki-wrench.ki-filled:after {
  content: "\ed24";
  
  opacity: 0.1;
}
.ki-wrench.ki-filled:before {
  content: "\ed25";
  position: absolute;
  
}
.ki-xaomi.ki-filled:after {
  content: "\ed26";
  
  opacity: 0.1;
}
.ki-xaomi.ki-filled:before {
  content: "\ed27";
  position: absolute;
  
}
.ki-xd.ki-filled:after {
  content: "\ed28";
  
  opacity: 0.1;
}
.ki-xd.ki-filled:before {
  content: "\ed29";
  position: absolute;
  
}
.ki-xmr.ki-filled:after {
  content: "\ed2a";
  
  opacity: 0.1;
}
.ki-xmr.ki-filled:before {
  content: "\ed2b";
  position: absolute;
  
}
.ki-yii.ki-filled:after {
  content: "\ed2c";
  
  opacity: 0.1;
}
.ki-yii.ki-filled:before {
  content: "\ed2d";
  position: absolute;
  
}
.ki-youtube.ki-filled:after {
  content: "\ed2e";
  
  opacity: 0.1;
}
.ki-youtube.ki-filled:before {
  content: "\ed2f";
  position: absolute;
  
}

@font-face {
  font-family: 'keenicons-outline';
  src:
    url('fonts/keenicons-outline.ttf?3m7u3e') format('truetype'),
    url('fonts/keenicons-outline.woff?3m7u3e') format('woff'),
    url('fonts/keenicons-outline.svg?3m7u3e#keenicons-outline') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

.ki-outline {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'keenicons-outline' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  display: inline-flex;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.ki-abstract-1.ki-outline:before {
  content: "\e900";
}
.ki-abstract-2.ki-outline:before {
  content: "\e901";
}
.ki-abstract-3.ki-outline:before {
  content: "\e902";
}
.ki-abstract-4.ki-outline:before {
  content: "\e903";
}
.ki-abstract-5.ki-outline:before {
  content: "\e904";
}
.ki-abstract-6.ki-outline:before {
  content: "\e905";
}
.ki-abstract-7.ki-outline:before {
  content: "\e906";
}
.ki-abstract-8.ki-outline:before {
  content: "\e907";
}
.ki-abstract-9.ki-outline:before {
  content: "\e908";
}
.ki-abstract-10.ki-outline:before {
  content: "\e909";
}
.ki-abstract-11.ki-outline:before {
  content: "\e90a";
}
.ki-abstract-12.ki-outline:before {
  content: "\e90b";
}
.ki-abstract-13.ki-outline:before {
  content: "\e90c";
}
.ki-abstract-14.ki-outline:before {
  content: "\e90d";
}
.ki-abstract-15.ki-outline:before {
  content: "\e90e";
}
.ki-abstract-16.ki-outline:before {
  content: "\e90f";
}
.ki-abstract-17.ki-outline:before {
  content: "\e910";
}
.ki-abstract-18.ki-outline:before {
  content: "\e911";
}
.ki-abstract-19.ki-outline:before {
  content: "\e912";
}
.ki-abstract-20.ki-outline:before {
  content: "\e913";
}
.ki-abstract-21.ki-outline:before {
  content: "\e914";
}
.ki-abstract-22.ki-outline:before {
  content: "\e915";
}
.ki-abstract-23.ki-outline:before {
  content: "\e916";
}
.ki-abstract-24.ki-outline:before {
  content: "\e917";
}
.ki-abstract-25.ki-outline:before {
  content: "\e918";
}
.ki-abstract-26.ki-outline:before {
  content: "\e919";
}
.ki-abstract-27.ki-outline:before {
  content: "\e91a";
}
.ki-abstract-28.ki-outline:before {
  content: "\e91b";
}
.ki-abstract-29.ki-outline:before {
  content: "\e91c";
}
.ki-abstract-30.ki-outline:before {
  content: "\e91d";
}
.ki-abstract-31.ki-outline:before {
  content: "\e91e";
}
.ki-abstract-32.ki-outline:before {
  content: "\e91f";
}
.ki-abstract-33.ki-outline:before {
  content: "\e920";
}
.ki-abstract-34.ki-outline:before {
  content: "\e921";
}
.ki-abstract-35.ki-outline:before {
  content: "\e922";
}
.ki-abstract-36.ki-outline:before {
  content: "\e923";
}
.ki-abstract-37.ki-outline:before {
  content: "\e924";
}
.ki-abstract-38.ki-outline:before {
  content: "\e925";
}
.ki-abstract-39.ki-outline:before {
  content: "\e926";
}
.ki-abstract-40.ki-outline:before {
  content: "\e927";
}
.ki-abstract-41.ki-outline:before {
  content: "\e928";
}
.ki-abstract-42.ki-outline:before {
  content: "\e929";
}
.ki-abstract-43.ki-outline:before {
  content: "\e92a";
}
.ki-abstract-44.ki-outline:before {
  content: "\e92b";
}
.ki-abstract-45.ki-outline:before {
  content: "\e92c";
}
.ki-abstract-46.ki-outline:before {
  content: "\e92d";
}
.ki-abstract-47.ki-outline:before {
  content: "\e92e";
}
.ki-abstract-48.ki-outline:before {
  content: "\e92f";
}
.ki-abstract-49.ki-outline:before {
  content: "\e930";
}
.ki-abstract.ki-outline:before {
  content: "\e931";
}
.ki-add-files.ki-outline:before {
  content: "\e932";
}
.ki-add-folder.ki-outline:before {
  content: "\e933";
}
.ki-add-notepad.ki-outline:before {
  content: "\e934";
}
.ki-additem.ki-outline:before {
  content: "\e935";
}
.ki-address-book.ki-outline:before {
  content: "\e936";
}
.ki-airplane-square.ki-outline:before {
  content: "\e937";
}
.ki-airplane.ki-outline:before {
  content: "\e938";
}
.ki-airpod.ki-outline:before {
  content: "\e939";
}
.ki-android.ki-outline:before {
  content: "\e93a";
}
.ki-angular.ki-outline:before {
  content: "\e93b";
}
.ki-apple.ki-outline:before {
  content: "\e93c";
}
.ki-archive-tick.ki-outline:before {
  content: "\e93d";
}
.ki-archive.ki-outline:before {
  content: "\e93e";
}
.ki-arrow-circle-left.ki-outline:before {
  content: "\e93f";
}
.ki-arrow-circle-right.ki-outline:before {
  content: "\e940";
}
.ki-arrow-down-left.ki-outline:before {
  content: "\e941";
}
.ki-arrow-down-refraction.ki-outline:before {
  content: "\e942";
}
.ki-arrow-down-right.ki-outline:before {
  content: "\e943";
}
.ki-arrow-down.ki-outline:before {
  content: "\e944";
}
.ki-arrow-left.ki-outline:before {
  content: "\e945";
}
.ki-arrow-mix.ki-outline:before {
  content: "\e946";
}
.ki-arrow-right-left.ki-outline:before {
  content: "\e947";
}
.ki-arrow-right.ki-outline:before {
  content: "\e948";
}
.ki-arrow-two-diagonals.ki-outline:before {
  content: "\e949";
}
.ki-arrow-up-down.ki-outline:before {
  content: "\e94a";
}
.ki-arrow-up-left.ki-outline:before {
  content: "\e94b";
}
.ki-arrow-up-refraction.ki-outline:before {
  content: "\e94c";
}
.ki-arrow-up-right.ki-outline:before {
  content: "\e94d";
}
.ki-arrow-up.ki-outline:before {
  content: "\e94e";
}
.ki-arrow-zigzag.ki-outline:before {
  content: "\e94f";
}
.ki-arrows-circle.ki-outline:before {
  content: "\e950";
}
.ki-arrows-loop.ki-outline:before {
  content: "\e951";
}
.ki-artificial-intelligence.ki-outline:before {
  content: "\e952";
}
.ki-autobrightness.ki-outline:before {
  content: "\e953";
}
.ki-avalanche-avax.ki-outline:before {
  content: "\e954";
}
.ki-award.ki-outline:before {
  content: "\e955";
}
.ki-badge.ki-outline:before {
  content: "\e956";
}
.ki-bandage.ki-outline:before {
  content: "\e957";
}
.ki-bank.ki-outline:before {
  content: "\e958";
}
.ki-bar-chart.ki-outline:before {
  content: "\e959";
}
.ki-barcode.ki-outline:before {
  content: "\e95a";
}
.ki-basket-ok.ki-outline:before {
  content: "\e95b";
}
.ki-basket.ki-outline:before {
  content: "\e95c";
}
.ki-behance.ki-outline:before {
  content: "\e95d";
}
.ki-bill.ki-outline:before {
  content: "\e95e";
}
.ki-binance-usd-busd.ki-outline:before {
  content: "\e95f";
}
.ki-binance.ki-outline:before {
  content: "\e960";
}
.ki-bitcoin.ki-outline:before {
  content: "\e961";
}
.ki-black-down.ki-outline:before {
  content: "\e962";
}
.ki-black-left-line.ki-outline:before {
  content: "\e963";
}
.ki-black-left.ki-outline:before {
  content: "\e964";
}
.ki-black-right-line.ki-outline:before {
  content: "\e965";
}
.ki-black-right.ki-outline:before {
  content: "\e966";
}
.ki-black-up.ki-outline:before {
  content: "\e967";
}
.ki-bluetooth.ki-outline:before {
  content: "\e968";
}
.ki-book-open.ki-outline:before {
  content: "\e969";
}
.ki-book-square.ki-outline:before {
  content: "\e96a";
}
.ki-book.ki-outline:before {
  content: "\e96b";
}
.ki-bookmark-2.ki-outline:before {
  content: "\e96c";
}
.ki-bookmark.ki-outline:before {
  content: "\e96d";
}
.ki-bootstrap.ki-outline:before {
  content: "\e96e";
}
.ki-briefcase.ki-outline:before {
  content: "\e96f";
}
.ki-brifecase-cros.ki-outline:before {
  content: "\e970";
}
.ki-brifecase-tick.ki-outline:before {
  content: "\e971";
}
.ki-brifecase-timer.ki-outline:before {
  content: "\e972";
}
.ki-brush.ki-outline:before {
  content: "\e973";
}
.ki-bucket-square.ki-outline:before {
  content: "\e974";
}
.ki-bucket.ki-outline:before {
  content: "\e975";
}
.ki-burger-menu-1.ki-outline:before {
  content: "\e976";
}
.ki-burger-menu-2.ki-outline:before {
  content: "\e977";
}
.ki-burger-menu-3.ki-outline:before {
  content: "\e978";
}
.ki-burger-menu-4.ki-outline:before {
  content: "\e979";
}
.ki-burger-menu-5.ki-outline:before {
  content: "\e97a";
}
.ki-burger-menu-6.ki-outline:before {
  content: "\e97b";
}
.ki-burger-menu.ki-outline:before {
  content: "\e97c";
}
.ki-bus.ki-outline:before {
  content: "\e97d";
}
.ki-calculator.ki-outline:before {
  content: "\e97e";
}
.ki-calculatoror.ki-outline:before {
  content: "\e97f";
}
.ki-calendar-2.ki-outline:before {
  content: "\e980";
}
.ki-calendar-8.ki-outline:before {
  content: "\e981";
}
.ki-calendar-add.ki-outline:before {
  content: "\e982";
}
.ki-calendar-edit.ki-outline:before {
  content: "\e983";
}
.ki-calendar-remove.ki-outline:before {
  content: "\e984";
}
.ki-calendar-search.ki-outline:before {
  content: "\e985";
}
.ki-calendar-tick.ki-outline:before {
  content: "\e986";
}
.ki-calendar.ki-outline:before {
  content: "\e987";
}
.ki-call.ki-outline:before {
  content: "\e988";
}
.ki-capsule.ki-outline:before {
  content: "\e989";
}
.ki-car.ki-outline:before {
  content: "\e98a";
}
.ki-category.ki-outline:before {
  content: "\e98b";
}
.ki-cd.ki-outline:before {
  content: "\e98c";
}
.ki-celsius-cel.ki-outline:before {
  content: "\e98d";
}
.ki-chart-line-down-2.ki-outline:before {
  content: "\e98e";
}
.ki-chart-line-down.ki-outline:before {
  content: "\e98f";
}
.ki-chart-line-star.ki-outline:before {
  content: "\e990";
}
.ki-chart-line-up-2.ki-outline:before {
  content: "\e991";
}
.ki-chart-line-up.ki-outline:before {
  content: "\e992";
}
.ki-chart-line.ki-outline:before {
  content: "\e993";
}
.ki-chart-pie-3.ki-outline:before {
  content: "\e994";
}
.ki-chart-pie-4.ki-outline:before {
  content: "\e995";
}
.ki-chart-pie-simple.ki-outline:before {
  content: "\e996";
}
.ki-chart-pie-too.ki-outline:before {
  content: "\e997";
}
.ki-chart-simple-2.ki-outline:before {
  content: "\e998";
}
.ki-chart-simple-3.ki-outline:before {
  content: "\e999";
}
.ki-chart-simple.ki-outline:before {
  content: "\e99a";
}
.ki-chart.ki-outline:before {
  content: "\e99b";
}
.ki-check-circle.ki-outline:before {
  content: "\e99c";
}
.ki-check-squared.ki-outline:before {
  content: "\e99d";
}
.ki-check.ki-outline:before {
  content: "\e99e";
}
.ki-cheque.ki-outline:before {
  content: "\e99f";
}
.ki-chrome.ki-outline:before {
  content: "\e9a0";
}
.ki-classmates.ki-outline:before {
  content: "\e9a1";
}
.ki-click.ki-outline:before {
  content: "\e9a2";
}
.ki-clipboard.ki-outline:before {
  content: "\e9a3";
}
.ki-cloud-add.ki-outline:before {
  content: "\e9a4";
}
.ki-cloud-change.ki-outline:before {
  content: "\e9a5";
}
.ki-cloud-download.ki-outline:before {
  content: "\e9a6";
}
.ki-cloud.ki-outline:before {
  content: "\e9a7";
}
.ki-code.ki-outline:before {
  content: "\e9a8";
}
.ki-coffee.ki-outline:before {
  content: "\e9a9";
}
.ki-color-swatch.ki-outline:before {
  content: "\e9aa";
}
.ki-colors-square.ki-outline:before {
  content: "\e9ab";
}
.ki-compass.ki-outline:before {
  content: "\e9ac";
}
.ki-copy-success.ki-outline:before {
  content: "\e9ad";
}
.ki-copy.ki-outline:before {
  content: "\e9ae";
}
.ki-courier-express.ki-outline:before {
  content: "\e9af";
}
.ki-courier.ki-outline:before {
  content: "\e9b0";
}
.ki-credit-cart.ki-outline:before {
  content: "\e9b1";
}
.ki-cross-circle.ki-outline:before {
  content: "\e9b2";
}
.ki-cross-square.ki-outline:before {
  content: "\e9b3";
}
.ki-cross.ki-outline:before {
  content: "\e9b4";
}
.ki-crown-2.ki-outline:before {
  content: "\e9b5";
}
.ki-crown.ki-outline:before {
  content: "\e9b6";
}
.ki-css.ki-outline:before {
  content: "\e9b7";
}
.ki-cube-2.ki-outline:before {
  content: "\e9b8";
}
.ki-cube-3.ki-outline:before {
  content: "\e9b9";
}
.ki-cup.ki-outline:before {
  content: "\e9ba";
}
.ki-cursor.ki-outline:before {
  content: "\e9bb";
}
.ki-dash.ki-outline:before {
  content: "\e9bc";
}
.ki-data.ki-outline:before {
  content: "\e9bd";
}
.ki-delete-files.ki-outline:before {
  content: "\e9be";
}
.ki-delete-folder.ki-outline:before {
  content: "\e9bf";
}
.ki-delivery-2.ki-outline:before {
  content: "\e9c0";
}
.ki-delivery-3.ki-outline:before {
  content: "\e9c1";
}
.ki-delivery-24.ki-outline:before {
  content: "\e9c2";
}
.ki-delivery-door.ki-outline:before {
  content: "\e9c3";
}
.ki-delivery-geolocation.ki-outline:before {
  content: "\e9c4";
}
.ki-delivery-time.ki-outline:before {
  content: "\e9c5";
}
.ki-delivery.ki-outline:before {
  content: "\e9c6";
}
.ki-design-1.ki-outline:before {
  content: "\e9c7";
}
.ki-design-2.ki-outline:before {
  content: "\e9c8";
}
.ki-desktop-mobile.ki-outline:before {
  content: "\e9c9";
}
.ki-devices-2.ki-outline:before {
  content: "\e9ca";
}
.ki-devices.ki-outline:before {
  content: "\e9cb";
}
.ki-diamonds.ki-outline:before {
  content: "\e9cc";
}
.ki-directbox-default.ki-outline:before {
  content: "\e9cd";
}
.ki-disconnect.ki-outline:before {
  content: "\e9ce";
}
.ki-discount.ki-outline:before {
  content: "\e9cf";
}
.ki-disguise.ki-outline:before {
  content: "\e9d0";
}
.ki-disk.ki-outline:before {
  content: "\e9d1";
}
.ki-dislike.ki-outline:before {
  content: "\e9d2";
}
.ki-dj.ki-outline:before {
  content: "\e9d3";
}
.ki-document.ki-outline:before {
  content: "\e9d4";
}
.ki-double-check.ki-outline:before {
  content: "\e9d5";
}
.ki-dollar.ki-outline:before {
  content: "\e9d6";
}
.ki-dots-circle-vertical.ki-outline:before {
  content: "\e9d7";
}
.ki-dots-circle.ki-outline:before {
  content: "\e9d8";
}
.ki-dots-horizontal.ki-outline:before {
  content: "\e9d9";
}
.ki-dots-square-vertical.ki-outline:before {
  content: "\e9da";
}
.ki-dots-square.ki-outline:before {
  content: "\e9db";
}
.ki-dots-vertical.ki-outline:before {
  content: "\e9dc";
}
.ki-double-check-circle.ki-outline:before {
  content: "\e9dd";
}
.ki-double-down.ki-outline:before {
  content: "\e9de";
}
.ki-double-left-arrow.ki-outline:before {
  content: "\e9df";
}
.ki-double-left.ki-outline:before {
  content: "\e9e0";
}
.ki-double-right-arrow.ki-outline:before {
  content: "\e9e1";
}
.ki-double-right.ki-outline:before {
  content: "\e9e2";
}
.ki-double-up.ki-outline:before {
  content: "\e9e3";
}
.ki-down-square.ki-outline:before {
  content: "\e9e4";
}
.ki-down.ki-outline:before {
  content: "\e9e5";
}
.ki-dribbble.ki-outline:before {
  content: "\e9e6";
}
.ki-drop.ki-outline:before {
  content: "\e9e7";
}
.ki-dropbox.ki-outline:before {
  content: "\e9e8";
}
.ki-educare-ekt.ki-outline:before {
  content: "\e9e9";
}
.ki-electricity.ki-outline:before {
  content: "\e9ea";
}
.ki-electronic-clock.ki-outline:before {
  content: "\e9eb";
}
.ki-element-1.ki-outline:before {
  content: "\e9ec";
}
.ki-element-2.ki-outline:before {
  content: "\e9ed";
}
.ki-element-3.ki-outline:before {
  content: "\e9ee";
}
.ki-element-4.ki-outline:before {
  content: "\e9ef";
}
.ki-element-5.ki-outline:before {
  content: "\e9f0";
}
.ki-element-6.ki-outline:before {
  content: "\e9f1";
}
.ki-element-7.ki-outline:before {
  content: "\e9f2";
}
.ki-element-8.ki-outline:before {
  content: "\e9f3";
}
.ki-element-9.ki-outline:before {
  content: "\e9f4";
}
.ki-element-10.ki-outline:before {
  content: "\e9f5";
}
.ki-element-11.ki-outline:before {
  content: "\e9f6";
}
.ki-element-12.ki-outline:before {
  content: "\e9f7";
}
.ki-element-equal.ki-outline:before {
  content: "\e9f8";
}
.ki-element-plus.ki-outline:before {
  content: "\e9f9";
}
.ki-emoji-happy.ki-outline:before {
  content: "\e9fa";
}
.ki-enjin-coin-enj.ki-outline:before {
  content: "\e9fb";
}
.ki-ensure.ki-outline:before {
  content: "\e9fc";
}
.ki-entrance-left.ki-outline:before {
  content: "\e9fd";
}
.ki-entrance-right.ki-outline:before {
  content: "\e9fe";
}
.ki-eraser.ki-outline:before {
  content: "\e9ff";
}
.ki-euro.ki-outline:before {
  content: "\ea00";
}
.ki-exit-down.ki-outline:before {
  content: "\ea01";
}
.ki-exit-left.ki-outline:before {
  content: "\ea02";
}
.ki-exit-right-corner.ki-outline:before {
  content: "\ea03";
}
.ki-exit-right.ki-outline:before {
  content: "\ea04";
}
.ki-exit-up.ki-outline:before {
  content: "\ea05";
}
.ki-external-drive.ki-outline:before {
  content: "\ea06";
}
.ki-eye-slash.ki-outline:before {
  content: "\ea07";
}
.ki-eye.ki-outline:before {
  content: "\ea08";
}
.ki-face-id.ki-outline:before {
  content: "\ea09";
}
.ki-facebook.ki-outline:before {
  content: "\ea0a";
}
.ki-fasten.ki-outline:before {
  content: "\ea0b";
}
.ki-fatrows.ki-outline:before {
  content: "\ea0c";
}
.ki-feather.ki-outline:before {
  content: "\ea0d";
}
.ki-figma.ki-outline:before {
  content: "\ea0e";
}
.ki-file-added.ki-outline:before {
  content: "\ea0f";
}
.ki-file-deleted.ki-outline:before {
  content: "\ea10";
}
.ki-file-down.ki-outline:before {
  content: "\ea11";
}
.ki-file-left.ki-outline:before {
  content: "\ea12";
}
.ki-file-right.ki-outline:before {
  content: "\ea13";
}
.ki-file-sheet.ki-outline:before {
  content: "\ea14";
}
.ki-file-up.ki-outline:before {
  content: "\ea15";
}
.ki-files.ki-outline:before {
  content: "\ea16";
}
.ki-filter-edit.ki-outline:before {
  content: "\ea17";
}
.ki-filter-search.ki-outline:before {
  content: "\ea18";
}
.ki-filter-square.ki-outline:before {
  content: "\ea19";
}
.ki-filter-tablet.ki-outline:before {
  content: "\ea1a";
}
.ki-filter-tick.ki-outline:before {
  content: "\ea1b";
}
.ki-filter.ki-outline:before {
  content: "\ea1c";
}
.ki-financial-schedule.ki-outline:before {
  content: "\ea1d";
}
.ki-fingerprint-scanning.ki-outline:before {
  content: "\ea1e";
}
.ki-flag.ki-outline:before {
  content: "\ea1f";
}
.ki-flash-circle.ki-outline:before {
  content: "\ea20";
}
.ki-flask.ki-outline:before {
  content: "\ea21";
}
.ki-focus.ki-outline:before {
  content: "\ea22";
}
.ki-folder-added.ki-outline:before {
  content: "\ea23";
}
.ki-folder-down.ki-outline:before {
  content: "\ea24";
}
.ki-folder-up.ki-outline:before {
  content: "\ea25";
}
.ki-folder.ki-outline:before {
  content: "\ea26";
}
.ki-frame.ki-outline:before {
  content: "\ea27";
}
.ki-geolocation-home.ki-outline:before {
  content: "\ea28";
}
.ki-geolocation.ki-outline:before {
  content: "\ea29";
}
.ki-ghost.ki-outline:before {
  content: "\ea2a";
}
.ki-gift.ki-outline:before {
  content: "\ea2b";
}
.ki-github.ki-outline:before {
  content: "\ea2c";
}
.ki-glass.ki-outline:before {
  content: "\ea2d";
}
.ki-google-play.ki-outline:before {
  content: "\ea2e";
}
.ki-google.ki-outline:before {
  content: "\ea2f";
}
.ki-graph-2.ki-outline:before {
  content: "\ea30";
}
.ki-graph-3.ki-outline:before {
  content: "\ea31";
}
.ki-graph-4.ki-outline:before {
  content: "\ea32";
}
.ki-graph-up.ki-outline:before {
  content: "\ea33";
}
.ki-graph.ki-outline:before {
  content: "\ea34";
}
.ki-grid-2.ki-outline:before {
  content: "\ea35";
}
.ki-grid.ki-outline:before {
  content: "\ea36";
}
.ki-handcart.ki-outline:before {
  content: "\ea37";
}
.ki-happyemoji.ki-outline:before {
  content: "\ea38";
}
.ki-heart-circle.ki-outline:before {
  content: "\ea39";
}
.ki-heart.ki-outline:before {
  content: "\ea3a";
}
.ki-home-1.ki-outline:before {
  content: "\ea3b";
}
.ki-home-2.ki-outline:before {
  content: "\ea3c";
}
.ki-home-3.ki-outline:before {
  content: "\ea3d";
}
.ki-home.ki-outline:before {
  content: "\ea3e";
}
.ki-html.ki-outline:before {
  content: "\ea3f";
}
.ki-icon.ki-outline:before {
  content: "\ea40";
}
.ki-illustrator.ki-outline:before {
  content: "\ea41";
}
.ki-information-1.ki-outline:before {
  content: "\ea42";
}
.ki-information-2.ki-outline:before {
  content: "\ea43";
}
.ki-information-3.ki-outline:before {
  content: "\ea44";
}
.ki-information-4.ki-outline:before {
  content: "\ea45";
}
.ki-information.ki-outline:before {
  content: "\ea46";
}
.ki-instagram.ki-outline:before {
  content: "\ea47";
}
.ki-joystick.ki-outline:before {
  content: "\ea48";
}
.ki-js-2.ki-outline:before {
  content: "\ea49";
}
.ki-js.ki-outline:before {
  content: "\ea4a";
}
.ki-kanban.ki-outline:before {
  content: "\ea4b";
}
.ki-key-square.ki-outline:before {
  content: "\ea4c";
}
.ki-key.ki-outline:before {
  content: "\ea4d";
}
.ki-keyboard.ki-outline:before {
  content: "\ea4e";
}
.ki-laptop.ki-outline:before {
  content: "\ea4f";
}
.ki-laravel.ki-outline:before {
  content: "\ea50";
}
.ki-left-square.ki-outline:before {
  content: "\ea51";
}
.ki-left.ki-outline:before {
  content: "\ea52";
}
.ki-like-2.ki-outline:before {
  content: "\ea53";
}
.ki-like-folder.ki-outline:before {
  content: "\ea54";
}
.ki-like-shapes.ki-outline:before {
  content: "\ea55";
}
.ki-like-tag.ki-outline:before {
  content: "\ea56";
}
.ki-like.ki-outline:before {
  content: "\ea57";
}
.ki-loading.ki-outline:before {
  content: "\ea58";
}
.ki-lock-2.ki-outline:before {
  content: "\ea59";
}
.ki-lock-3.ki-outline:before {
  content: "\ea5a";
}
.ki-lock.ki-outline:before {
  content: "\ea5b";
}
.ki-logistic.ki-outline:before {
  content: "\ea5c";
}
.ki-lots-shopping.ki-outline:before {
  content: "\ea5d";
}
.ki-lovely.ki-outline:before {
  content: "\ea5e";
}
.ki-lts.ki-outline:before {
  content: "\ea5f";
}
.ki-magnifier.ki-outline:before {
  content: "\ea60";
}
.ki-map.ki-outline:before {
  content: "\ea61";
}
.ki-mask.ki-outline:before {
  content: "\ea62";
}
.ki-maximize.ki-outline:before {
  content: "\ea63";
}
.ki-medal-star.ki-outline:before {
  content: "\ea64";
}
.ki-menu.ki-outline:before {
  content: "\ea65";
}
.ki-message-add.ki-outline:before {
  content: "\ea66";
}
.ki-message-edit.ki-outline:before {
  content: "\ea67";
}
.ki-message-minus.ki-outline:before {
  content: "\ea68";
}
.ki-message-notify.ki-outline:before {
  content: "\ea69";
}
.ki-message-programming.ki-outline:before {
  content: "\ea6a";
}
.ki-message-question.ki-outline:before {
  content: "\ea6b";
}
.ki-message-text-2.ki-outline:before {
  content: "\ea6c";
}
.ki-message-text.ki-outline:before {
  content: "\ea6d";
}
.ki-messages.ki-outline:before {
  content: "\ea6e";
}
.ki-microsoft.ki-outline:before {
  content: "\ea6f";
}
.ki-milk.ki-outline:before {
  content: "\ea70";
}
.ki-minus-circle.ki-outline:before {
  content: "\ea71";
}
.ki-minus-folder.ki-outline:before {
  content: "\ea72";
}
.ki-minus-squared.ki-outline:before {
  content: "\ea73";
}
.ki-minus.ki-outline:before {
  content: "\ea74";
}
.ki-moon.ki-outline:before {
  content: "\ea75";
}
.ki-more-2.ki-outline:before {
  content: "\ea76";
}
.ki-mouse-circle.ki-outline:before {
  content: "\ea77";
}
.ki-mouse-square.ki-outline:before {
  content: "\ea78";
}
.ki-mouse.ki-outline:before {
  content: "\ea79";
}
.ki-nexo.ki-outline:before {
  content: "\ea7a";
}
.ki-night-day.ki-outline:before {
  content: "\ea7b";
}
.ki-note-2.ki-outline:before {
  content: "\ea7c";
}
.ki-note.ki-outline:before {
  content: "\ea7d";
}
.ki-notepad-bookmark.ki-outline:before {
  content: "\ea7e";
}
.ki-notepad-edit.ki-outline:before {
  content: "\ea7f";
}
.ki-notepad.ki-outline:before {
  content: "\ea80";
}
.ki-notification-1.ki-outline:before {
  content: "\ea81";
}
.ki-notification-bing.ki-outline:before {
  content: "\ea82";
}
.ki-notification-circle.ki-outline:before {
  content: "\ea83";
}
.ki-notification-favorite.ki-outline:before {
  content: "\ea84";
}
.ki-notification-on.ki-outline:before {
  content: "\ea85";
}
.ki-notification-status.ki-outline:before {
  content: "\ea86";
}
.ki-notification.ki-outline:before {
  content: "\ea87";
}
.ki-ocean.ki-outline:before {
  content: "\ea88";
}
.ki-office-bag.ki-outline:before {
  content: "\ea89";
}
.ki-package.ki-outline:before {
  content: "\ea8a";
}
.ki-pad.ki-outline:before {
  content: "\ea8b";
}
.ki-pails.ki-outline:before {
  content: "\ea8c";
}
.ki-paintbucket.ki-outline:before {
  content: "\ea8d";
}
.ki-paper-clip.ki-outline:before {
  content: "\ea8e";
}
.ki-paper-plane.ki-outline:before {
  content: "\ea8f";
}
.ki-parcel-tracking.ki-outline:before {
  content: "\ea90";
}
.ki-parcel.ki-outline:before {
  content: "\ea91";
}
.ki-password-check.ki-outline:before {
  content: "\ea92";
}
.ki-paypal.ki-outline:before {
  content: "\ea93";
}
.ki-pencil.ki-outline:before {
  content: "\ea94";
}
.ki-people.ki-outline:before {
  content: "\ea95";
}
.ki-percentage.ki-outline:before {
  content: "\ea96";
}
.ki-phone.ki-outline:before {
  content: "\ea97";
}
.ki-photoshop.ki-outline:before {
  content: "\ea98";
}
.ki-picture.ki-outline:before {
  content: "\ea99";
}
.ki-pill.ki-outline:before {
  content: "\ea9a";
}
.ki-pin.ki-outline:before {
  content: "\ea9b";
}
.ki-plus-circle.ki-outline:before {
  content: "\ea9c";
}
.ki-plus-squared.ki-outline:before {
  content: "\ea9d";
}
.ki-plus.ki-outline:before {
  content: "\ea9e";
}
.ki-pointers.ki-outline:before {
  content: "\ea9f";
}
.ki-price-tag.ki-outline:before {
  content: "\eaa0";
}
.ki-printer.ki-outline:before {
  content: "\eaa1";
}
.ki-profile-circle.ki-outline:before {
  content: "\eaa2";
}
.ki-pulse.ki-outline:before {
  content: "\eaa3";
}
.ki-purchase.ki-outline:before {
  content: "\eaa4";
}
.ki-python.ki-outline:before {
  content: "\eaa5";
}
.ki-question-2.ki-outline:before {
  content: "\eaa6";
}
.ki-question.ki-outline:before {
  content: "\eaa7";
}
.ki-questionnaire-tablet.ki-outline:before {
  content: "\eaa8";
}
.ki-ranking.ki-outline:before {
  content: "\eaa9";
}
.ki-react.ki-outline:before {
  content: "\eaaa";
}
.ki-receipt-square.ki-outline:before {
  content: "\eaab";
}
.ki-rescue.ki-outline:before {
  content: "\eaac";
}
.ki-right-left.ki-outline:before {
  content: "\eaad";
}
.ki-right-square.ki-outline:before {
  content: "\eaae";
}
.ki-right.ki-outline:before {
  content: "\eaaf";
}
.ki-rocket.ki-outline:before {
  content: "\eab0";
}
.ki-route.ki-outline:before {
  content: "\eab1";
}
.ki-router.ki-outline:before {
  content: "\eab2";
}
.ki-row-horizontal.ki-outline:before {
  content: "\eab3";
}
.ki-row-vertical.ki-outline:before {
  content: "\eab4";
}
.ki-safe-home.ki-outline:before {
  content: "\eab5";
}
.ki-satellite.ki-outline:before {
  content: "\eab6";
}
.ki-save-2.ki-outline:before {
  content: "\eab7";
}
.ki-save-deposit.ki-outline:before {
  content: "\eab8";
}
.ki-scan-barcode.ki-outline:before {
  content: "\eab9";
}
.ki-screen.ki-outline:before {
  content: "\eaba";
}
.ki-scroll.ki-outline:before {
  content: "\eabb";
}
.ki-search-list.ki-outline:before {
  content: "\eabc";
}
.ki-security-user.ki-outline:before {
  content: "\eabd";
}
.ki-setting-2.ki-outline:before {
  content: "\eabe";
}
.ki-setting-3.ki-outline:before {
  content: "\eabf";
}
.ki-setting-4.ki-outline:before {
  content: "\eac0";
}
.ki-setting.ki-outline:before {
  content: "\eac1";
}
.ki-share.ki-outline:before {
  content: "\eac2";
}
.ki-shield-cross.ki-outline:before {
  content: "\eac3";
}
.ki-shield-search.ki-outline:before {
  content: "\eac4";
}
.ki-shield-slash.ki-outline:before {
  content: "\eac5";
}
.ki-shield-tick.ki-outline:before {
  content: "\eac6";
}
.ki-shield.ki-outline:before {
  content: "\eac7";
}
.ki-ship.ki-outline:before {
  content: "\eac8";
}
.ki-shop.ki-outline:before {
  content: "\eac9";
}
.ki-simcard-2.ki-outline:before {
  content: "\eaca";
}
.ki-simcard.ki-outline:before {
  content: "\eacb";
}
.ki-size.ki-outline:before {
  content: "\eacc";
}
.ki-slack.ki-outline:before {
  content: "\eacd";
}
.ki-slider-horizontal-2.ki-outline:before {
  content: "\eace";
}
.ki-slider-horizontal.ki-outline:before {
  content: "\eacf";
}
.ki-slider-vertica.ki-outline:before {
  content: "\ead0";
}
.ki-slider-vertical.ki-outline:before {
  content: "\ead1";
}
.ki-slider.ki-outline:before {
  content: "\ead2";
}
.ki-sms.ki-outline:before {
  content: "\ead3";
}
.ki-snapchat.ki-outline:before {
  content: "\ead4";
}
.ki-social-media.ki-outline:before {
  content: "\ead5";
}
.ki-soft-2.ki-outline:before {
  content: "\ead6";
}
.ki-soft-3.ki-outline:before {
  content: "\ead7";
}
.ki-soft.ki-outline:before {
  content: "\ead8";
}
.ki-some-files.ki-outline:before {
  content: "\ead9";
}
.ki-sort.ki-outline:before {
  content: "\eada";
}
.ki-speaker.ki-outline:before {
  content: "\eadb";
}
.ki-spotify.ki-outline:before {
  content: "\eadc";
}
.ki-spring-framework.ki-outline:before {
  content: "\eadd";
}
.ki-square-brackets.ki-outline:before {
  content: "\eade";
}
.ki-star.ki-outline:before {
  content: "\eadf";
}
.ki-status.ki-outline:before {
  content: "\eae0";
}
.ki-subtitle.ki-outline:before {
  content: "\eae1";
}
.ki-sun.ki-outline:before {
  content: "\eae2";
}
.ki-support.ki-outline:before {
  content: "\eae3";
}
.ki-switch.ki-outline:before {
  content: "\eae4";
}
.ki-syringe.ki-outline:before {
  content: "\eae5";
}
.ki-tab-tablet.ki-outline:before {
  content: "\eae6";
}
.ki-tablet-delete.ki-outline:before {
  content: "\eae7";
}
.ki-tablet-down.ki-outline:before {
  content: "\eae8";
}
.ki-tablet-ok.ki-outline:before {
  content: "\eae9";
}
.ki-tablet-text-down.ki-outline:before {
  content: "\eaea";
}
.ki-tablet-text-up.ki-outline:before {
  content: "\eaeb";
}
.ki-tablet-up.ki-outline:before {
  content: "\eaec";
}
.ki-tablet.ki-outline:before {
  content: "\eaed";
}
.ki-tag-cross.ki-outline:before {
  content: "\eaee";
}
.ki-tag.ki-outline:before {
  content: "\eaef";
}
.ki-teacher.ki-outline:before {
  content: "\eaf0";
}
.ki-technology-1.ki-outline:before {
  content: "\eaf1";
}
.ki-technology-2.ki-outline:before {
  content: "\eaf2";
}
.ki-technology-3.ki-outline:before {
  content: "\eaf3";
}
.ki-technology-4.ki-outline:before {
  content: "\eaf4";
}
.ki-telephone-geolocation.ki-outline:before {
  content: "\eaf5";
}
.ki-test-tubes.ki-outline:before {
  content: "\eaf6";
}
.ki-text-bold.ki-outline:before {
  content: "\eaf7";
}
.ki-text-circle.ki-outline:before {
  content: "\eaf8";
}
.ki-text-italic.ki-outline:before {
  content: "\eaf9";
}
.ki-text-number.ki-outline:before {
  content: "\eafa";
}
.ki-text-strikethrough.ki-outline:before {
  content: "\eafb";
}
.ki-text-underline.ki-outline:before {
  content: "\eafc";
}
.ki-text.ki-outline:before {
  content: "\eafd";
}
.ki-textalign-center.ki-outline:before {
  content: "\eafe";
}
.ki-textalign-justifycenter.ki-outline:before {
  content: "\eaff";
}
.ki-textalign-left.ki-outline:before {
  content: "\eb00";
}
.ki-textalign-right.ki-outline:before {
  content: "\eb01";
}
.ki-thermometer.ki-outline:before {
  content: "\eb02";
}
.ki-theta-theta.ki-outline:before {
  content: "\eb03";
}
.ki-tiktok.ki-outline:before {
  content: "\eb04";
}
.ki-time.ki-outline:before {
  content: "\eb05";
}
.ki-timer.ki-outline:before {
  content: "\eb06";
}
.ki-to-left.ki-outline:before {
  content: "\eb07";
}
.ki-to-right.ki-outline:before {
  content: "\eb08";
}
.ki-toggle-off-circle.ki-outline:before {
  content: "\eb09";
}
.ki-toggle-off.ki-outline:before {
  content: "\eb0a";
}
.ki-toggle-on-circle.ki-outline:before {
  content: "\eb0b";
}
.ki-toggle-on.ki-outline:before {
  content: "\eb0c";
}
.ki-trash-square.ki-outline:before {
  content: "\eb0d";
}
.ki-trash.ki-outline:before {
  content: "\eb0e";
}
.ki-tree.ki-outline:before {
  content: "\eb0f";
}
.ki-trello.ki-outline:before {
  content: "\eb10";
}
.ki-ts.ki-outline:before {
  content: "\eb11";
}
.ki-twitch.ki-outline:before {
  content: "\eb12";
}
.ki-twitter.ki-outline:before {
  content: "\eb13";
}
.ki-two-credit-cart.ki-outline:before {
  content: "\eb14";
}
.ki-underlining.ki-outline:before {
  content: "\eb15";
}
.ki-up-diagonal.ki-outline:before {
  content: "\eb16";
}
.ki-up-down.ki-outline:before {
  content: "\eb17";
}
.ki-up-square.ki-outline:before {
  content: "\eb18";
}
.ki-up.ki-outline:before {
  content: "\eb19";
}
.ki-update-file.ki-outline:before {
  content: "\eb1a";
}
.ki-update-folder.ki-outline:before {
  content: "\eb1b";
}
.ki-user-edit.ki-outline:before {
  content: "\eb1c";
}
.ki-user-square.ki-outline:before {
  content: "\eb1d";
}
.ki-user-tick.ki-outline:before {
  content: "\eb1e";
}
.ki-user.ki-outline:before {
  content: "\eb1f";
}
.ki-users.ki-outline:before {
  content: "\eb20";
}
.ki-verify.ki-outline:before {
  content: "\eb21";
}
.ki-vibe-vibe.ki-outline:before {
  content: "\eb22";
}
.ki-virus.ki-outline:before {
  content: "\eb23";
}
.ki-vue.ki-outline:before {
  content: "\eb24";
}
.ki-vuesax.ki-outline:before {
  content: "\eb25";
}
.ki-wallet.ki-outline:before {
  content: "\eb26";
}
.ki-wanchain-wan.ki-outline:before {
  content: "\eb27";
}
.ki-watch.ki-outline:before {
  content: "\eb28";
}
.ki-whatsapp.ki-outline:before {
  content: "\eb29";
}
.ki-wifi-home.ki-outline:before {
  content: "\eb2a";
}
.ki-wifi-square.ki-outline:before {
  content: "\eb2b";
}
.ki-wifi.ki-outline:before {
  content: "\eb2c";
}
.ki-wireframe.ki-outline:before {
  content: "\eb2d";
}
.ki-wlan.ki-outline:before {
  content: "\eb2e";
}
.ki-wrench.ki-outline:before {
  content: "\eb2f";
}
.ki-xaomi.ki-outline:before {
  content: "\eb30";
}
.ki-xd.ki-outline:before {
  content: "\eb31";
}
.ki-xmr.ki-outline:before {
  content: "\eb32";
}
.ki-yii.ki-outline:before {
  content: "\eb33";
}
.ki-youtube.ki-outline:before {
  content: "\eb34";
}

@font-face {
  font-family: 'keenicons-solid';
  src:
    url('fonts/keenicons-solid.ttf?m54ea1') format('truetype'),
    url('fonts/keenicons-solid.woff?m54ea1') format('woff'),
    url('fonts/keenicons-solid.svg?m54ea1#keenicons-solid') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

.ki-solid {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'keenicons-solid' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  display: inline-flex;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.ki-abstract-1.ki-solid:before {
  content: "\e900";
}
.ki-abstract-2.ki-solid:before {
  content: "\e901";
}
.ki-abstract-3.ki-solid:before {
  content: "\e902";
}
.ki-abstract-4.ki-solid:before {
  content: "\e903";
}
.ki-abstract-5.ki-solid:before {
  content: "\e904";
}
.ki-abstract-6.ki-solid:before {
  content: "\e905";
}
.ki-abstract-7.ki-solid:before {
  content: "\e906";
}
.ki-abstract-8.ki-solid:before {
  content: "\e907";
}
.ki-abstract-9.ki-solid:before {
  content: "\e908";
}
.ki-abstract-10.ki-solid:before {
  content: "\e909";
}
.ki-abstract-11.ki-solid:before {
  content: "\e90a";
}
.ki-abstract-12.ki-solid:before {
  content: "\e90b";
}
.ki-abstract-13.ki-solid:before {
  content: "\e90c";
}
.ki-abstract-14.ki-solid:before {
  content: "\e90d";
}
.ki-abstract-15.ki-solid:before {
  content: "\e90e";
}
.ki-abstract-16.ki-solid:before {
  content: "\e90f";
}
.ki-abstract-17.ki-solid:before {
  content: "\e910";
}
.ki-abstract-18.ki-solid:before {
  content: "\e911";
}
.ki-abstract-19.ki-solid:before {
  content: "\e912";
}
.ki-abstract-20.ki-solid:before {
  content: "\e913";
}
.ki-abstract-21.ki-solid:before {
  content: "\e914";
}
.ki-abstract-22.ki-solid:before {
  content: "\e915";
}
.ki-abstract-23.ki-solid:before {
  content: "\e916";
}
.ki-abstract-24.ki-solid:before {
  content: "\e917";
}
.ki-abstract-25.ki-solid:before {
  content: "\e918";
}
.ki-abstract-26.ki-solid:before {
  content: "\e919";
}
.ki-abstract-27.ki-solid:before {
  content: "\e91a";
}
.ki-abstract-28.ki-solid:before {
  content: "\e91b";
}
.ki-abstract-29.ki-solid:before {
  content: "\e91c";
}
.ki-abstract-30.ki-solid:before {
  content: "\e91d";
}
.ki-abstract-31.ki-solid:before {
  content: "\e91e";
}
.ki-abstract-32.ki-solid:before {
  content: "\e91f";
}
.ki-abstract-33.ki-solid:before {
  content: "\e920";
}
.ki-abstract-34.ki-solid:before {
  content: "\e921";
}
.ki-abstract-35.ki-solid:before {
  content: "\e922";
}
.ki-abstract-36.ki-solid:before {
  content: "\e923";
}
.ki-abstract-37.ki-solid:before {
  content: "\e924";
}
.ki-abstract-38.ki-solid:before {
  content: "\e925";
}
.ki-abstract-39.ki-solid:before {
  content: "\e926";
}
.ki-abstract-40.ki-solid:before {
  content: "\e927";
}
.ki-abstract-41.ki-solid:before {
  content: "\e928";
}
.ki-abstract-42.ki-solid:before {
  content: "\e929";
}
.ki-abstract-43.ki-solid:before {
  content: "\e92a";
}
.ki-abstract-44.ki-solid:before {
  content: "\e92b";
}
.ki-abstract-45.ki-solid:before {
  content: "\e92c";
}
.ki-abstract-46.ki-solid:before {
  content: "\e92d";
}
.ki-abstract-47.ki-solid:before {
  content: "\e92e";
}
.ki-abstract-48.ki-solid:before {
  content: "\e92f";
}
.ki-abstract-49.ki-solid:before {
  content: "\e930";
}
.ki-abstract.ki-solid:before {
  content: "\e931";
}
.ki-add-files.ki-solid:before {
  content: "\e932";
}
.ki-add-folder.ki-solid:before {
  content: "\e933";
}
.ki-add-notepad.ki-solid:before {
  content: "\e934";
}
.ki-additem.ki-solid:before {
  content: "\e935";
}
.ki-address-book.ki-solid:before {
  content: "\e936";
}
.ki-airplane-square.ki-solid:before {
  content: "\e937";
}
.ki-airplane.ki-solid:before {
  content: "\e938";
}
.ki-airpod.ki-solid:before {
  content: "\e939";
}
.ki-android.ki-solid:before {
  content: "\e93a";
}
.ki-angular.ki-solid:before {
  content: "\e93b";
}
.ki-apple.ki-solid:before {
  content: "\e93c";
}
.ki-archive-tick.ki-solid:before {
  content: "\e93d";
}
.ki-archive.ki-solid:before {
  content: "\e93e";
}
.ki-arrow-circle-left.ki-solid:before {
  content: "\e93f";
}
.ki-arrow-circle-right.ki-solid:before {
  content: "\e940";
}
.ki-arrow-down-left.ki-solid:before {
  content: "\e941";
}
.ki-arrow-down-refraction.ki-solid:before {
  content: "\e942";
}
.ki-arrow-down-right.ki-solid:before {
  content: "\e943";
}
.ki-arrow-down.ki-solid:before {
  content: "\e944";
}
.ki-arrow-left.ki-solid:before {
  content: "\e945";
}
.ki-arrow-mix.ki-solid:before {
  content: "\e946";
}
.ki-arrow-right-left.ki-solid:before {
  content: "\e947";
}
.ki-arrow-right.ki-solid:before {
  content: "\e948";
}
.ki-arrow-two-diagonals.ki-solid:before {
  content: "\e949";
}
.ki-arrow-up-down.ki-solid:before {
  content: "\e94a";
}
.ki-arrow-up-left.ki-solid:before {
  content: "\e94b";
}
.ki-arrow-up-refraction.ki-solid:before {
  content: "\e94c";
}
.ki-arrow-up-right.ki-solid:before {
  content: "\e94d";
}
.ki-arrow-up.ki-solid:before {
  content: "\e94e";
}
.ki-arrow-zigzag.ki-solid:before {
  content: "\e94f";
}
.ki-arrows-circle.ki-solid:before {
  content: "\e950";
}
.ki-arrows-loop.ki-solid:before {
  content: "\e951";
}
.ki-artificial-intelligence.ki-solid:before {
  content: "\e952";
}
.ki-autobrightness.ki-solid:before {
  content: "\e953";
}
.ki-avalanche-avax.ki-solid:before {
  content: "\e954";
}
.ki-award.ki-solid:before {
  content: "\e955";
}
.ki-badge.ki-solid:before {
  content: "\e956";
}
.ki-bandage.ki-solid:before {
  content: "\e957";
}
.ki-bank.ki-solid:before {
  content: "\e958";
}
.ki-bar-chart.ki-solid:before {
  content: "\e959";
}
.ki-barcode.ki-solid:before {
  content: "\e95a";
}
.ki-basket-ok.ki-solid:before {
  content: "\e95b";
}
.ki-basket.ki-solid:before {
  content: "\e95c";
}
.ki-behance.ki-solid:before {
  content: "\e95d";
}
.ki-bill.ki-solid:before {
  content: "\e95e";
}
.ki-binance-usd-busd.ki-solid:before {
  content: "\e95f";
}
.ki-binance.ki-solid:before {
  content: "\e960";
}
.ki-bitcoin.ki-solid:before {
  content: "\e961";
}
.ki-black-down.ki-solid:before {
  content: "\e962";
}
.ki-black-left-line.ki-solid:before {
  content: "\e963";
}
.ki-black-left.ki-solid:before {
  content: "\e964";
}
.ki-black-right-line.ki-solid:before {
  content: "\e965";
}
.ki-black-right.ki-solid:before {
  content: "\e966";
}
.ki-black-up.ki-solid:before {
  content: "\e967";
}
.ki-bluetooth.ki-solid:before {
  content: "\e968";
}
.ki-book-open.ki-solid:before {
  content: "\e969";
}
.ki-book-square.ki-solid:before {
  content: "\e96a";
}
.ki-book.ki-solid:before {
  content: "\e96b";
}
.ki-bookmark-2.ki-solid:before {
  content: "\e96c";
}
.ki-bookmark.ki-solid:before {
  content: "\e96d";
}
.ki-bootstrap.ki-solid:before {
  content: "\e96e";
}
.ki-briefcase.ki-solid:before {
  content: "\e96f";
}
.ki-brifecase-cros.ki-solid:before {
  content: "\e970";
}
.ki-brifecase-tick.ki-solid:before {
  content: "\e971";
}
.ki-brifecase-timer.ki-solid:before {
  content: "\e972";
}
.ki-brush.ki-solid:before {
  content: "\e973";
}
.ki-bucket-square.ki-solid:before {
  content: "\e974";
}
.ki-bucket.ki-solid:before {
  content: "\e975";
}
.ki-burger-menu-1.ki-solid:before {
  content: "\e976";
}
.ki-burger-menu-2.ki-solid:before {
  content: "\e977";
}
.ki-burger-menu-3.ki-solid:before {
  content: "\e978";
}
.ki-burger-menu-4.ki-solid:before {
  content: "\e979";
}
.ki-burger-menu-5.ki-solid:before {
  content: "\e97a";
}
.ki-burger-menu-6.ki-solid:before {
  content: "\e97b";
}
.ki-burger-menu.ki-solid:before {
  content: "\e97c";
}
.ki-bus.ki-solid:before {
  content: "\e97d";
}
.ki-calculator.ki-solid:before {
  content: "\e97e";
}
.ki-calculatoror.ki-solid:before {
  content: "\e97f";
}
.ki-calendar-2.ki-solid:before {
  content: "\e980";
}
.ki-calendar-8.ki-solid:before {
  content: "\e981";
}
.ki-calendar-add.ki-solid:before {
  content: "\e982";
}
.ki-calendar-edit.ki-solid:before {
  content: "\e983";
}
.ki-calendar-remove.ki-solid:before {
  content: "\e984";
}
.ki-calendar-search.ki-solid:before {
  content: "\e985";
}
.ki-calendar-tick.ki-solid:before {
  content: "\e986";
}
.ki-calendar.ki-solid:before {
  content: "\e987";
}
.ki-call.ki-solid:before {
  content: "\e988";
}
.ki-capsule.ki-solid:before {
  content: "\e989";
}
.ki-car.ki-solid:before {
  content: "\e98a";
}
.ki-category.ki-solid:before {
  content: "\e98b";
}
.ki-cd.ki-solid:before {
  content: "\e98c";
}
.ki-celsius-cel.ki-solid:before {
  content: "\e98d";
}
.ki-chart-line-down-2.ki-solid:before {
  content: "\e98e";
}
.ki-chart-line-down.ki-solid:before {
  content: "\e98f";
}
.ki-chart-line-star.ki-solid:before {
  content: "\e990";
}
.ki-chart-line-up-2.ki-solid:before {
  content: "\e991";
}
.ki-chart-line-up.ki-solid:before {
  content: "\e992";
}
.ki-chart-line.ki-solid:before {
  content: "\e993";
}
.ki-chart-pie-3.ki-solid:before {
  content: "\e994";
}
.ki-chart-pie-4.ki-solid:before {
  content: "\e995";
}
.ki-chart-pie-simple.ki-solid:before {
  content: "\e996";
}
.ki-chart-pie-too.ki-solid:before {
  content: "\e997";
}
.ki-chart-simple-2.ki-solid:before {
  content: "\e998";
}
.ki-chart-simple-3.ki-solid:before {
  content: "\e999";
}
.ki-chart-simple.ki-solid:before {
  content: "\e99a";
}
.ki-chart.ki-solid:before {
  content: "\e99b";
}
.ki-check-circle.ki-solid:before {
  content: "\e99c";
}
.ki-check-squared.ki-solid:before {
  content: "\e99d";
}
.ki-check.ki-solid:before {
  content: "\e99e";
}
.ki-cheque.ki-solid:before {
  content: "\e99f";
}
.ki-chrome.ki-solid:before {
  content: "\e9a0";
}
.ki-classmates.ki-solid:before {
  content: "\e9a1";
}
.ki-click.ki-solid:before {
  content: "\e9a2";
}
.ki-clipboard.ki-solid:before {
  content: "\e9a3";
}
.ki-cloud-add.ki-solid:before {
  content: "\e9a4";
}
.ki-cloud-change.ki-solid:before {
  content: "\e9a5";
}
.ki-cloud-download.ki-solid:before {
  content: "\e9a6";
}
.ki-cloud.ki-solid:before {
  content: "\e9a7";
}
.ki-code.ki-solid:before {
  content: "\e9a8";
}
.ki-coffee.ki-solid:before {
  content: "\e9a9";
}
.ki-color-swatch.ki-solid:before {
  content: "\e9aa";
}
.ki-colors-square.ki-solid:before {
  content: "\e9ab";
}
.ki-compass.ki-solid:before {
  content: "\e9ac";
}
.ki-copy-success.ki-solid:before {
  content: "\e9ad";
}
.ki-copy.ki-solid:before {
  content: "\e9ae";
}
.ki-courier-express.ki-solid:before {
  content: "\e9af";
}
.ki-courier.ki-solid:before {
  content: "\e9b0";
}
.ki-credit-cart.ki-solid:before {
  content: "\e9b1";
}
.ki-cross-circle.ki-solid:before {
  content: "\e9b2";
}
.ki-cross-square.ki-solid:before {
  content: "\e9b3";
}
.ki-cross.ki-solid:before {
  content: "\e9b4";
}
.ki-crown-2.ki-solid:before {
  content: "\e9b5";
}
.ki-crown.ki-solid:before {
  content: "\e9b6";
}
.ki-css.ki-solid:before {
  content: "\e9b7";
}
.ki-cube-2.ki-solid:before {
  content: "\e9b8";
}
.ki-cube-3.ki-solid:before {
  content: "\e9b9";
}
.ki-cup.ki-solid:before {
  content: "\e9ba";
}
.ki-cursor.ki-solid:before {
  content: "\e9bb";
}
.ki-dash.ki-solid:before {
  content: "\e9bc";
}
.ki-data.ki-solid:before {
  content: "\e9bd";
}
.ki-delete-files.ki-solid:before {
  content: "\e9be";
}
.ki-delete-folder.ki-solid:before {
  content: "\e9bf";
}
.ki-delivery-2.ki-solid:before {
  content: "\e9c0";
}
.ki-delivery-3.ki-solid:before {
  content: "\e9c1";
}
.ki-delivery-24.ki-solid:before {
  content: "\e9c2";
}
.ki-delivery-door.ki-solid:before {
  content: "\e9c3";
}
.ki-delivery-geolocation.ki-solid:before {
  content: "\e9c4";
}
.ki-delivery-time.ki-solid:before {
  content: "\e9c5";
}
.ki-delivery.ki-solid:before {
  content: "\e9c6";
}
.ki-design-1.ki-solid:before {
  content: "\e9c7";
}
.ki-design-2.ki-solid:before {
  content: "\e9c8";
}
.ki-desktop-mobile.ki-solid:before {
  content: "\e9c9";
}
.ki-devices-2.ki-solid:before {
  content: "\e9ca";
}
.ki-devices.ki-solid:before {
  content: "\e9cb";
}
.ki-diamonds.ki-solid:before {
  content: "\e9cc";
}
.ki-directbox-default.ki-solid:before {
  content: "\e9cd";
}
.ki-disconnect.ki-solid:before {
  content: "\e9ce";
}
.ki-discount.ki-solid:before {
  content: "\e9cf";
}
.ki-disguise.ki-solid:before {
  content: "\e9d0";
}
.ki-disk.ki-solid:before {
  content: "\e9d1";
}
.ki-dislike.ki-solid:before {
  content: "\e9d2";
}
.ki-dj.ki-solid:before {
  content: "\e9d3";
}
.ki-document.ki-solid:before {
  content: "\e9d4";
}
.ki-double-check.ki-solid:before {
  content: "\e9d5";
}
.ki-dollar.ki-solid:before {
  content: "\e9d6";
}
.ki-dots-circle-vertical.ki-solid:before {
  content: "\e9d7";
}
.ki-dots-circle.ki-solid:before {
  content: "\e9d8";
}
.ki-dots-horizontal.ki-solid:before {
  content: "\e9d9";
}
.ki-dots-square-vertical.ki-solid:before {
  content: "\e9da";
}
.ki-dots-square.ki-solid:before {
  content: "\e9db";
}
.ki-dots-vertical.ki-solid:before {
  content: "\e9dc";
}
.ki-double-down.ki-solid:before {
  content: "\e9dd";
}
.ki-double-left-arrow.ki-solid:before {
  content: "\e9de";
}
.ki-double-left.ki-solid:before {
  content: "\e9df";
}
.ki-double-right-arrow.ki-solid:before {
  content: "\e9e0";
}
.ki-double-right.ki-solid:before {
  content: "\e9e1";
}
.ki-double-up.ki-solid:before {
  content: "\e9e2";
}
.ki-down-square.ki-solid:before {
  content: "\e9e3";
}
.ki-down.ki-solid:before {
  content: "\e9e4";
}
.ki-dribbble.ki-solid:before {
  content: "\e9e5";
}
.ki-drop.ki-solid:before {
  content: "\e9e6";
}
.ki-dropbox.ki-solid:before {
  content: "\e9e7";
}
.ki-duble-check-circle.ki-solid:before {
  content: "\e9e8";
}
.ki-educare-ekt.ki-solid:before {
  content: "\e9e9";
}
.ki-electricity.ki-solid:before {
  content: "\e9ea";
}
.ki-electronic-clock.ki-solid:before {
  content: "\e9eb";
}
.ki-element-1.ki-solid:before {
  content: "\e9ec";
}
.ki-element-2.ki-solid:before {
  content: "\e9ed";
}
.ki-element-3.ki-solid:before {
  content: "\e9ee";
}
.ki-element-4.ki-solid:before {
  content: "\e9ef";
}
.ki-element-5.ki-solid:before {
  content: "\e9f0";
}
.ki-element-6.ki-solid:before {
  content: "\e9f1";
}
.ki-element-7.ki-solid:before {
  content: "\e9f2";
}
.ki-element-8.ki-solid:before {
  content: "\e9f3";
}
.ki-element-9.ki-solid:before {
  content: "\e9f4";
}
.ki-element-10.ki-solid:before {
  content: "\e9f5";
}
.ki-element-11.ki-solid:before {
  content: "\e9f6";
}
.ki-element-12.ki-solid:before {
  content: "\e9f7";
}
.ki-element-equal.ki-solid:before {
  content: "\e9f8";
}
.ki-element-plus.ki-solid:before {
  content: "\e9f9";
}
.ki-emoji-happy.ki-solid:before {
  content: "\e9fa";
}
.ki-enjin-coin-enj.ki-solid:before {
  content: "\e9fb";
}
.ki-ensure.ki-solid:before {
  content: "\e9fc";
}
.ki-entrance-left.ki-solid:before {
  content: "\e9fd";
}
.ki-entrance-right.ki-solid:before {
  content: "\e9fe";
}
.ki-eraser.ki-solid:before {
  content: "\e9ff";
}
.ki-euro.ki-solid:before {
  content: "\ea00";
}
.ki-exit-down.ki-solid:before {
  content: "\ea01";
}
.ki-exit-left.ki-solid:before {
  content: "\ea02";
}
.ki-exit-right-corner.ki-solid:before {
  content: "\ea03";
}
.ki-exit-right.ki-solid:before {
  content: "\ea04";
}
.ki-exit-up.ki-solid:before {
  content: "\ea05";
}
.ki-external-drive.ki-solid:before {
  content: "\ea06";
}
.ki-eye-slash.ki-solid:before {
  content: "\ea07";
}
.ki-eye.ki-solid:before {
  content: "\ea08";
}
.ki-face-id.ki-solid:before {
  content: "\ea09";
}
.ki-facebook.ki-solid:before {
  content: "\ea0a";
}
.ki-fasten.ki-solid:before {
  content: "\ea0b";
}
.ki-fatrows.ki-solid:before {
  content: "\ea0c";
}
.ki-feather.ki-solid:before {
  content: "\ea0d";
}
.ki-figma.ki-solid:before {
  content: "\ea0e";
}
.ki-file-added.ki-solid:before {
  content: "\ea0f";
}
.ki-file-deleted.ki-solid:before {
  content: "\ea10";
}
.ki-file-down.ki-solid:before {
  content: "\ea11";
}
.ki-file-left.ki-solid:before {
  content: "\ea12";
}
.ki-file-right.ki-solid:before {
  content: "\ea13";
}
.ki-file-sheet.ki-solid:before {
  content: "\ea14";
}
.ki-file-up.ki-solid:before {
  content: "\ea15";
}
.ki-files.ki-solid:before {
  content: "\ea16";
}
.ki-filter-edit.ki-solid:before {
  content: "\ea17";
}
.ki-filter-search.ki-solid:before {
  content: "\ea18";
}
.ki-filter-square.ki-solid:before {
  content: "\ea19";
}
.ki-filter-tablet.ki-solid:before {
  content: "\ea1a";
}
.ki-filter-tick.ki-solid:before {
  content: "\ea1b";
}
.ki-filter.ki-solid:before {
  content: "\ea1c";
}
.ki-financial-schedule.ki-solid:before {
  content: "\ea1d";
}
.ki-fingerprint-scanning.ki-solid:before {
  content: "\ea1e";
}
.ki-flag.ki-solid:before {
  content: "\ea1f";
}
.ki-flash-circle.ki-solid:before {
  content: "\ea20";
}
.ki-flask.ki-solid:before {
  content: "\ea21";
}
.ki-focus.ki-solid:before {
  content: "\ea22";
}
.ki-folder-added.ki-solid:before {
  content: "\ea23";
}
.ki-folder-down.ki-solid:before {
  content: "\ea24";
}
.ki-folder-up.ki-solid:before {
  content: "\ea25";
}
.ki-folder.ki-solid:before {
  content: "\ea26";
}
.ki-frame.ki-solid:before {
  content: "\ea27";
}
.ki-geolocation-home.ki-solid:before {
  content: "\ea28";
}
.ki-geolocation.ki-solid:before {
  content: "\ea29";
}
.ki-ghost.ki-solid:before {
  content: "\ea2a";
}
.ki-gift.ki-solid:before {
  content: "\ea2b";
}
.ki-github.ki-solid:before {
  content: "\ea2c";
}
.ki-glass.ki-solid:before {
  content: "\ea2d";
}
.ki-google-play.ki-solid:before {
  content: "\ea2e";
}
.ki-google.ki-solid:before {
  content: "\ea2f";
}
.ki-graph-2.ki-solid:before {
  content: "\ea30";
}
.ki-graph-3.ki-solid:before {
  content: "\ea31";
}
.ki-graph-4.ki-solid:before {
  content: "\ea32";
}
.ki-graph-up.ki-solid:before {
  content: "\ea33";
}
.ki-graph.ki-solid:before {
  content: "\ea34";
}
.ki-grid-2.ki-solid:before {
  content: "\ea35";
}
.ki-grid.ki-solid:before {
  content: "\ea36";
}
.ki-handcart.ki-solid:before {
  content: "\ea37";
}
.ki-happyemoji.ki-solid:before {
  content: "\ea38";
}
.ki-heart-circle.ki-solid:before {
  content: "\ea39";
}
.ki-heart.ki-solid:before {
  content: "\ea3a";
}
.ki-home-1.ki-solid:before {
  content: "\ea3b";
}
.ki-home-2.ki-solid:before {
  content: "\ea3c";
}
.ki-home-3.ki-solid:before {
  content: "\ea3d";
}
.ki-home.ki-solid:before {
  content: "\ea3e";
}
.ki-html.ki-solid:before {
  content: "\ea3f";
}
.ki-icon.ki-solid:before {
  content: "\ea40";
}
.ki-illustrator.ki-solid:before {
  content: "\ea41";
}
.ki-information-1.ki-solid:before {
  content: "\ea42";
}
.ki-information-2.ki-solid:before {
  content: "\ea43";
}
.ki-information-3.ki-solid:before {
  content: "\ea44";
}
.ki-information-4.ki-solid:before {
  content: "\ea45";
}
.ki-information.ki-solid:before {
  content: "\ea46";
}
.ki-instagram.ki-solid:before {
  content: "\ea47";
}
.ki-joystick.ki-solid:before {
  content: "\ea48";
}
.ki-js-2.ki-solid:before {
  content: "\ea49";
}
.ki-js.ki-solid:before {
  content: "\ea4a";
}
.ki-kanban.ki-solid:before {
  content: "\ea4b";
}
.ki-key-square.ki-solid:before {
  content: "\ea4c";
}
.ki-key.ki-solid:before {
  content: "\ea4d";
}
.ki-keyboard.ki-solid:before {
  content: "\ea4e";
}
.ki-laptop.ki-solid:before {
  content: "\ea4f";
}
.ki-laravel.ki-solid:before {
  content: "\ea50";
}
.ki-left-square.ki-solid:before {
  content: "\ea51";
}
.ki-left.ki-solid:before {
  content: "\ea52";
}
.ki-like-2.ki-solid:before {
  content: "\ea53";
}
.ki-like-folder.ki-solid:before {
  content: "\ea54";
}
.ki-like-shapes.ki-solid:before {
  content: "\ea55";
}
.ki-like-tag.ki-solid:before {
  content: "\ea56";
}
.ki-like.ki-solid:before {
  content: "\ea57";
}
.ki-loading.ki-solid:before {
  content: "\ea58";
}
.ki-lock-2.ki-solid:before {
  content: "\ea59";
}
.ki-lock-3.ki-solid:before {
  content: "\ea5a";
}
.ki-lock.ki-solid:before {
  content: "\ea5b";
}
.ki-logistic.ki-solid:before {
  content: "\ea5c";
}
.ki-lots-shopping.ki-solid:before {
  content: "\ea5d";
}
.ki-lovely.ki-solid:before {
  content: "\ea5e";
}
.ki-lts.ki-solid:before {
  content: "\ea5f";
}
.ki-magnifier.ki-solid:before {
  content: "\ea60";
}
.ki-map.ki-solid:before {
  content: "\ea61";
}
.ki-mask.ki-solid:before {
  content: "\ea62";
}
.ki-maximize.ki-solid:before {
  content: "\ea63";
}
.ki-medal-star.ki-solid:before {
  content: "\ea64";
}
.ki-menu.ki-solid:before {
  content: "\ea65";
}
.ki-message-add.ki-solid:before {
  content: "\ea66";
}
.ki-message-edit.ki-solid:before {
  content: "\ea67";
}
.ki-message-minus.ki-solid:before {
  content: "\ea68";
}
.ki-message-notify.ki-solid:before {
  content: "\ea69";
}
.ki-message-programming.ki-solid:before {
  content: "\ea6a";
}
.ki-message-question.ki-solid:before {
  content: "\ea6b";
}
.ki-message-text-2.ki-solid:before {
  content: "\ea6c";
}
.ki-message-text.ki-solid:before {
  content: "\ea6d";
}
.ki-messages.ki-solid:before {
  content: "\ea6e";
}
.ki-microsoft.ki-solid:before {
  content: "\ea6f";
}
.ki-milk.ki-solid:before {
  content: "\ea70";
}
.ki-minus-circle.ki-solid:before {
  content: "\ea71";
}
.ki-minus-folder.ki-solid:before {
  content: "\ea72";
}
.ki-minus-squared.ki-solid:before {
  content: "\ea73";
}
.ki-minus.ki-solid:before {
  content: "\ea74";
}
.ki-moon.ki-solid:before {
  content: "\ea75";
}
.ki-more-2.ki-solid:before {
  content: "\ea76";
}
.ki-mouse-circle.ki-solid:before {
  content: "\ea77";
}
.ki-mouse-square.ki-solid:before {
  content: "\ea78";
}
.ki-mouse.ki-solid:before {
  content: "\ea79";
}
.ki-nexo.ki-solid:before {
  content: "\ea7a";
}
.ki-night-day.ki-solid:before {
  content: "\ea7b";
}
.ki-note-2.ki-solid:before {
  content: "\ea7c";
}
.ki-note.ki-solid:before {
  content: "\ea7d";
}
.ki-notepad-bookmark.ki-solid:before {
  content: "\ea7e";
}
.ki-notepad-edit.ki-solid:before {
  content: "\ea7f";
}
.ki-notepad.ki-solid:before {
  content: "\ea80";
}
.ki-notification-1.ki-solid:before {
  content: "\ea81";
}
.ki-notification-bing.ki-solid:before {
  content: "\ea82";
}
.ki-notification-circle.ki-solid:before {
  content: "\ea83";
}
.ki-notification-favorite.ki-solid:before {
  content: "\ea84";
}
.ki-notification-on.ki-solid:before {
  content: "\ea85";
}
.ki-notification-status.ki-solid:before {
  content: "\ea86";
}
.ki-notification.ki-solid:before {
  content: "\ea87";
}
.ki-ocean.ki-solid:before {
  content: "\ea88";
}
.ki-office-bag.ki-solid:before {
  content: "\ea89";
}
.ki-package.ki-solid:before {
  content: "\ea8a";
}
.ki-pad.ki-solid:before {
  content: "\ea8b";
}
.ki-pails.ki-solid:before {
  content: "\ea8c";
}
.ki-paintbucket.ki-solid:before {
  content: "\ea8d";
}
.ki-paper-clip.ki-solid:before {
  content: "\ea8e";
}
.ki-paper-plane.ki-solid:before {
  content: "\ea8f";
}
.ki-parcel-tracking.ki-solid:before {
  content: "\ea90";
}
.ki-parcel.ki-solid:before {
  content: "\ea91";
}
.ki-password-check.ki-solid:before {
  content: "\ea92";
}
.ki-paypal.ki-solid:before {
  content: "\ea93";
}
.ki-pencil.ki-solid:before {
  content: "\ea94";
}
.ki-people.ki-solid:before {
  content: "\ea95";
}
.ki-percentage.ki-solid:before {
  content: "\ea96";
}
.ki-phone.ki-solid:before {
  content: "\ea97";
}
.ki-photoshop.ki-solid:before {
  content: "\ea98";
}
.ki-picture.ki-solid:before {
  content: "\ea99";
}
.ki-pill.ki-solid:before {
  content: "\ea9a";
}
.ki-pin.ki-solid:before {
  content: "\ea9b";
}
.ki-plus-circle.ki-solid:before {
  content: "\ea9c";
}
.ki-plus-squared.ki-solid:before {
  content: "\ea9d";
}
.ki-plus.ki-solid:before {
  content: "\ea9e";
}
.ki-pointers.ki-solid:before {
  content: "\ea9f";
}
.ki-price-tag.ki-solid:before {
  content: "\eaa0";
}
.ki-printer.ki-solid:before {
  content: "\eaa1";
}
.ki-profile-circle.ki-solid:before {
  content: "\eaa2";
}
.ki-pulse.ki-solid:before {
  content: "\eaa3";
}
.ki-purchase.ki-solid:before {
  content: "\eaa4";
}
.ki-python.ki-solid:before {
  content: "\eaa5";
}
.ki-question-2.ki-solid:before {
  content: "\eaa6";
}
.ki-question.ki-solid:before {
  content: "\eaa7";
}
.ki-questionnaire-tablet.ki-solid:before {
  content: "\eaa8";
}
.ki-ranking.ki-solid:before {
  content: "\eaa9";
}
.ki-react.ki-solid:before {
  content: "\eaaa";
}
.ki-receipt-square.ki-solid:before {
  content: "\eaab";
}
.ki-rescue.ki-solid:before {
  content: "\eaac";
}
.ki-right-left.ki-solid:before {
  content: "\eaad";
}
.ki-right-square.ki-solid:before {
  content: "\eaae";
}
.ki-right.ki-solid:before {
  content: "\eaaf";
}
.ki-rocket.ki-solid:before {
  content: "\eab0";
}
.ki-route.ki-solid:before {
  content: "\eab1";
}
.ki-router.ki-solid:before {
  content: "\eab2";
}
.ki-row-horizontal.ki-solid:before {
  content: "\eab3";
}
.ki-row-vertical.ki-solid:before {
  content: "\eab4";
}
.ki-safe-home.ki-solid:before {
  content: "\eab5";
}
.ki-satellite.ki-solid:before {
  content: "\eab6";
}
.ki-save-2.ki-solid:before {
  content: "\eab7";
}
.ki-save-deposit.ki-solid:before {
  content: "\eab8";
}
.ki-scan-barcode.ki-solid:before {
  content: "\eab9";
}
.ki-screen.ki-solid:before {
  content: "\eaba";
}
.ki-scroll.ki-solid:before {
  content: "\eabb";
}
.ki-search-list.ki-solid:before {
  content: "\eabc";
}
.ki-security-user.ki-solid:before {
  content: "\eabd";
}
.ki-setting-2.ki-solid:before {
  content: "\eabe";
}
.ki-setting-3.ki-solid:before {
  content: "\eabf";
}
.ki-setting-4.ki-solid:before {
  content: "\eac0";
}
.ki-setting.ki-solid:before {
  content: "\eac1";
}
.ki-share.ki-solid:before {
  content: "\eac2";
}
.ki-shield-cross.ki-solid:before {
  content: "\eac3";
}
.ki-shield-search.ki-solid:before {
  content: "\eac4";
}
.ki-shield-slash.ki-solid:before {
  content: "\eac5";
}
.ki-shield-tick.ki-solid:before {
  content: "\eac6";
}
.ki-shield.ki-solid:before {
  content: "\eac7";
}
.ki-ship.ki-solid:before {
  content: "\eac8";
}
.ki-shop.ki-solid:before {
  content: "\eac9";
}
.ki-simcard-2.ki-solid:before {
  content: "\eaca";
}
.ki-simcard.ki-solid:before {
  content: "\eacb";
}
.ki-size.ki-solid:before {
  content: "\eacc";
}
.ki-slack.ki-solid:before {
  content: "\eacd";
}
.ki-slider-horizontal-2.ki-solid:before {
  content: "\eace";
}
.ki-slider-horizontal.ki-solid:before {
  content: "\eacf";
}
.ki-slider-vertica.ki-solid:before {
  content: "\ead0";
}
.ki-slider-vertical.ki-solid:before {
  content: "\ead1";
}
.ki-slider.ki-solid:before {
  content: "\ead2";
}
.ki-sms.ki-solid:before {
  content: "\ead3";
}
.ki-snapchat.ki-solid:before {
  content: "\ead4";
}
.ki-social-media.ki-solid:before {
  content: "\ead5";
}
.ki-soft-2.ki-solid:before {
  content: "\ead6";
}
.ki-soft-3.ki-solid:before {
  content: "\ead7";
}
.ki-soft.ki-solid:before {
  content: "\ead8";
}
.ki-some-files.ki-solid:before {
  content: "\ead9";
}
.ki-sort.ki-solid:before {
  content: "\eada";
}
.ki-speaker.ki-solid:before {
  content: "\eadb";
}
.ki-spotify.ki-solid:before {
  content: "\eadc";
}
.ki-spring-framework.ki-solid:before {
  content: "\eadd";
}
.ki-square-brackets.ki-solid:before {
  content: "\eade";
}
.ki-star.ki-solid:before {
  content: "\eadf";
}
.ki-status.ki-solid:before {
  content: "\eae0";
}
.ki-subtitle.ki-solid:before {
  content: "\eae1";
}
.ki-sun.ki-solid:before {
  content: "\eae2";
}
.ki-support.ki-solid:before {
  content: "\eae3";
}
.ki-switch.ki-solid:before {
  content: "\eae4";
}
.ki-syringe.ki-solid:before {
  content: "\eae5";
}
.ki-tab-tablet.ki-solid:before {
  content: "\eae6";
}
.ki-tablet-delete.ki-solid:before {
  content: "\eae7";
}
.ki-tablet-down.ki-solid:before {
  content: "\eae8";
}
.ki-tablet-ok.ki-solid:before {
  content: "\eae9";
}
.ki-tablet-text-down.ki-solid:before {
  content: "\eaea";
}
.ki-tablet-text-up.ki-solid:before {
  content: "\eaeb";
}
.ki-tablet-up.ki-solid:before {
  content: "\eaec";
}
.ki-tablet.ki-solid:before {
  content: "\eaed";
}
.ki-tag-cross.ki-solid:before {
  content: "\eaee";
}
.ki-tag.ki-solid:before {
  content: "\eaef";
}
.ki-teacher.ki-solid:before {
  content: "\eaf0";
}
.ki-technology-1.ki-solid:before {
  content: "\eaf1";
}
.ki-technology-2.ki-solid:before {
  content: "\eaf2";
}
.ki-technology-3.ki-solid:before {
  content: "\eaf3";
}
.ki-technology-4.ki-solid:before {
  content: "\eaf4";
}
.ki-telephone-geolocation.ki-solid:before {
  content: "\eaf5";
}
.ki-test-tubes.ki-solid:before {
  content: "\eaf6";
}
.ki-text-bold.ki-solid:before {
  content: "\eaf7";
}
.ki-text-circle.ki-solid:before {
  content: "\eaf8";
}
.ki-text-italic.ki-solid:before {
  content: "\eaf9";
}
.ki-text-number.ki-solid:before {
  content: "\eafa";
}
.ki-text-strikethrough.ki-solid:before {
  content: "\eafb";
}
.ki-text-underline.ki-solid:before {
  content: "\eafc";
}
.ki-text.ki-solid:before {
  content: "\eafd";
}
.ki-textalign-center.ki-solid:before {
  content: "\eafe";
}
.ki-textalign-justifycenter.ki-solid:before {
  content: "\eaff";
}
.ki-textalign-left.ki-solid:before {
  content: "\eb00";
}
.ki-textalign-right.ki-solid:before {
  content: "\eb01";
}
.ki-thermometer.ki-solid:before {
  content: "\eb02";
}
.ki-theta-theta.ki-solid:before {
  content: "\eb03";
}
.ki-tiktok.ki-solid:before {
  content: "\eb04";
}
.ki-time.ki-solid:before {
  content: "\eb05";
}
.ki-timer.ki-solid:before {
  content: "\eb06";
}
.ki-to-left.ki-solid:before {
  content: "\eb07";
}
.ki-to-right.ki-solid:before {
  content: "\eb08";
}
.ki-toggle-off-circle.ki-solid:before {
  content: "\eb09";
}
.ki-toggle-off.ki-solid:before {
  content: "\eb0a";
}
.ki-toggle-on-circle.ki-solid:before {
  content: "\eb0b";
}
.ki-toggle-on.ki-solid:before {
  content: "\eb0c";
}
.ki-trash-square.ki-solid:before {
  content: "\eb0d";
}
.ki-trash.ki-solid:before {
  content: "\eb0e";
}
.ki-tree.ki-solid:before {
  content: "\eb0f";
}
.ki-trello.ki-solid:before {
  content: "\eb10";
}
.ki-ts.ki-solid:before {
  content: "\eb11";
}
.ki-twitch.ki-solid:before {
  content: "\eb12";
}
.ki-twitter.ki-solid:before {
  content: "\eb13";
}
.ki-two-credit-cart.ki-solid:before {
  content: "\eb14";
}
.ki-underlining.ki-solid:before {
  content: "\eb15";
}
.ki-up-diagonal.ki-solid:before {
  content: "\eb16";
}
.ki-up-down.ki-solid:before {
  content: "\eb17";
}
.ki-up-square.ki-solid:before {
  content: "\eb18";
}
.ki-up.ki-solid:before {
  content: "\eb19";
}
.ki-update-file.ki-solid:before {
  content: "\eb1a";
}
.ki-update-folder.ki-solid:before {
  content: "\eb1b";
}
.ki-user-edit.ki-solid:before {
  content: "\eb1c";
}
.ki-user-square.ki-solid:before {
  content: "\eb1d";
}
.ki-user-tick.ki-solid:before {
  content: "\eb1e";
}
.ki-user.ki-solid:before {
  content: "\eb1f";
}
.ki-users.ki-solid:before {
  content: "\eb20";
}
.ki-verify.ki-solid:before {
  content: "\eb21";
}
.ki-vibe-vibe.ki-solid:before {
  content: "\eb22";
}
.ki-virus.ki-solid:before {
  content: "\eb23";
}
.ki-vue.ki-solid:before {
  content: "\eb24";
}
.ki-vuesax.ki-solid:before {
  content: "\eb25";
}
.ki-wallet.ki-solid:before {
  content: "\eb26";
}
.ki-wanchain-wan.ki-solid:before {
  content: "\eb27";
}
.ki-watch.ki-solid:before {
  content: "\eb28";
}
.ki-whatsapp.ki-solid:before {
  content: "\eb29";
}
.ki-wifi-home.ki-solid:before {
  content: "\eb2a";
}
.ki-wifi-square.ki-solid:before {
  content: "\eb2b";
}
.ki-wifi.ki-solid:before {
  content: "\eb2c";
}
.ki-wireframe.ki-solid:before {
  content: "\eb2d";
}
.ki-wlan.ki-solid:before {
  content: "\eb2e";
}
.ki-wrench.ki-solid:before {
  content: "\eb2f";
}
.ki-xaomi.ki-solid:before {
  content: "\eb30";
}
.ki-xd.ki-solid:before {
  content: "\eb31";
}
.ki-xmr.ki-solid:before {
  content: "\eb32";
}
.ki-yii.ki-solid:before {
  content: "\eb33";
}
.ki-youtube.ki-solid:before {
  content: "\eb34";
}

[v-cloak] {
  display: none !important;
}

/* Bootstrap 3/4 modal fallback — the metronic9 theme drops Bootstrap's modal
   CSS, so plain `.modal.fade` containers (notably the one jquery-session-timeout
   appends to <body>) render as always-visible divs. Hide by default; Bootstrap's
   $.fn.modal("show") sets inline style="display:block" which overrides this. */
.modal.fade {
  display: none;
}

/* Doubled .total-column class bumps specificity to (0,3,2) so this rule wins
   over .kt-table thead th:is(.light *) (0,2,2) further down in the file —
   both have !important, so without the extra class the later rule wins. */
.kt-table thead th.total-column.total-column {
  background-color: #E8F0F9 !important;
  border-color: #E8F0F9 !important;
}

td.total-column {
  background: #F4F8FC !important;
  border-color: #F4F8FC !important;
}

/* Mix against --card (not --background): these cells sit inside a card, so
   they track the card surface if the two tokens ever diverge. */
.kt-table thead th.total-column:is(.dark *) {
  background-color: color-mix(in oklab, var(--primary) 25%, var(--card)) !important;
  border-color: color-mix(in oklab, var(--primary) 25%, var(--card)) !important;
}

td.total-column:is(.dark *) {
  background: color-mix(in oklab, var(--primary) 12%, var(--card)) !important;
  border-color: color-mix(in oklab, var(--primary) 12%, var(--card)) !important;
}

:root {
  --sticky-offset: 107px;
  --primary: #0275DD;
  /* L2: light menu band is a distinct gray layer (#EEEFF1), not the page's
     #F7F7F8 — part of the "too bright / harsh" feedback fix. */
  --nav-bg-color: #EEEFF1;
  --nav-x-margin: 80px;
  --table-col-max-width: 300px;

  /* Make Inter the global font. The layout loads Inter (Google Fonts, weights
     400/500/600/700) but the theme's --font-sans token only listed system
     fonts (ui-sans-serif, system-ui, …), so text rendered in the OS default
     rather than Inter. Prepend Inter so the whole app uses it; --font-sans
     flows into --default-font-family which the base layer applies to <html>.
     This :root is unlayered and loads after tailwind.styles.css's
     @layer theme, so it wins without !important. */
  --font-sans: 'Inter', ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
    "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";

  /* AB#14144 WCAG 2.2 AA: the theme's --muted-foreground (zinc-500,
     oklch 55.2%) measures 4.83:1 on white but only 4.39:1 on the zinc-100
     surfaces (--muted / --secondary / --accent) where it carries real copy —
     Schedule/ShiftTrade modal summary panels (bg-muted), hovered/checked
     datatable rows, and nav links with kt-menu-link-hover:!bg-accent.
     51% is the minimum lightness drop at the same hue/chroma that clears
     the 4.5:1 AA minimum on all light surfaces: 5.77 on white, 5.53 on
     zinc-50, 5.24 on zinc-100, 4.55 on zinc-200. */
  --muted-foreground: oklch(51% 0.016 285.938);
}

/* Restyle-spec dark tokens.

   W20 (Work Order 4, Eric-approved 2026-07-20) re-introduces the dark
   elevation ladder that the original spec deliberately omitted: customer
   feedback (the AB#14179 thread) rejected the flush theme — page, cards and
   tables all rendered the same color, so data surfaces didn't stand out.
   Dark now mirrors light's page/card contrast (Apple dark-mode guidance:
   elevated surfaces are lighter than the page):

     --background  oklch(14.1%)  page canvas (unchanged)
     --card        oklch(18%)    cards, kt-table surface, outline buttons (W19)
     --popover     oklch(22%)    modals, drawer panel, dropdown/search panels
     --muted       oklch(25%)    header bands, hover, edit-row highlight (W21)

   Derived formulas ride the tokens automatically and that shift is intended:
   the table-header muted/40 band, timecard zebra mix(muted 25%, card), badge
   tints.
   Inputs/selects keep their var(--background) fill and now read as recessed
   wells inside the 18% cards — an intentional depth cue, not an omission.
   --header-foreground is the table-column-header text color (zinc-400 dark /
   zinc-700 light, set below). Light theme is untouched. */
.dark {
  --card: oklch(18% 0.006 285.9);
  --popover: oklch(22% 0.006 285.9);
  --muted: oklch(25% 0.006 285.9);

  /* zinc-500 on the dark surfaces fails AA; zinc-400 gives 7.56/6.74. The
     spec's token table lists muted-foreground as zinc-500, but it only
     carries zero values / hints / captions; keep the AA-safe zinc-400. */
  --muted-foreground: var(--color-zinc-400);
  --header-foreground: var(--color-zinc-400);
}

html:not(.dark) {
  /* L1: off-white page canvas, white cards — customer feedback said the new
     UI read "too bright / harsh" with pure-white edge-to-edge. */
  --background: #F7F7F8;
  /* L3: table headers/labels darken to zinc-700 for hierarchy on white. */
  --header-foreground: oklch(37% 0.013 285.805);
}

/* Restyle spec G14: cards use the vendor's stock geometry and shadow
   (radius 12px, --border, 0 1px 2px rgba(0,0,0,.05)) — the old Figma-era
   0 4px 5px override is gone. No .kt-card override needed. */

/* Header employee-search dark-mode fix (PBI 12689 #3). The markup carries a
   `dark:bg-background` utility, but that class isn't present in the prebuilt
   tailwind.styles.css, so it's a no-op and the search bar kept its light
   `bg-[#F7F7F7]` in dark mode — a light box with near-black text that's hard
   to read. Restore the themed surface + visible text under .dark. Specificity
   (0,3,x) beats the (0,1,0) arbitrary bg utility, and this file loads after
   tailwind.styles.css, so no !important is needed. */
.dark .header-search .kt-input {
  border-color: #2b2b33;
}
.dark .header-search .kt-input,
.dark .header-search .kt-input input {
  background-color: #17171c;
}
.dark .header-search .kt-input input {
  color: var(--foreground);
}
.dark .header-search .kt-input > i {
  color: var(--muted-foreground);
}

.max-w-table-col {
  max-width: var(--table-col-max-width);
}

/* Propagate the header's .max-w-table-col constraint to body/footer cells.
   If any <th> in the table has the class, every <td> adopts the cap —
   simpler than per-column matching and fits how the class is applied today
   (to all columns of a bounded table). The table-level class is applied by
   bp-datatable-large-table-fix.js; this used to be
   `.kt-table:has(thead th.max-w-table-col)`, but running an upward :has()
   for every <td> made full-document style recalcs cost ~1s on report tables
   with thousands of rows (70k+ cells). */
.kt-table.bp-maxw-table-cols :is(tbody, tfoot) td {
  max-width: var(--table-col-max-width);
}

.logo {
  height: 28px;
  width: auto;
}

.base-logo {
  width: 185px;
  height: 41px;
}

/* Restyle spec L2 — theme-aware navigation (colors only; menu structure and
   data never change). Light = Metronic/Gmail-style soft gray layers instead
   of pure white edge-to-edge; dark = near-black layered rows. The logo
   already swaps via dark:hidden / dark:inline-block in _LayoutTopNav. Active
   state is the 2px bottom border (vendor kt-menu-item-active:border-b-mono);
   light --mono is already #09090b-equivalent, dark gets forced to white. */
html:not(.dark) .nav-bar,
html:not(.dark) .nav-dropdown {
  background-color: var(--nav-bg-color);
}

/* W14: no border-bottom here — the nav-bar's own border-y provides the
   single hairline between the logo row and the menu band (a second border
   here doubled it in light mode). */
html:not(.dark) .main-header {
  background-color: #ffffff;
}

html:not(.dark) .nav-bar .kt-menu-title {
  color: #18181b;
}
html:not(.dark) .nav-bar .kt-menu-item:hover > .kt-menu-link .kt-menu-title {
  color: #000000;
}
html:not(.dark) .nav-bar .kt-menu-item.active > .kt-menu-link .kt-menu-title {
  color: #09090b;
}

html:not(.dark) .header-search .kt-input,
html:not(.dark) .header-search .kt-input input {
  background-color: #F1F1F4;
}

.dark .main-header {
  background-color: #0d0d12;
}

.dark .nav-bar {
  background-color: #0d0d12;
  border-top-color: #1c1c22;
  border-bottom-color: #26262c;
}

.dark .nav-dropdown {
  background-color: #0d0d12;
}

.dark .nav-bar .kt-menu-title {
  color: #d6d6dc;
}
.dark .nav-bar .kt-menu-item:hover > .kt-menu-link .kt-menu-title,
.dark .nav-bar .kt-menu-item.active > .kt-menu-link .kt-menu-title {
  color: #ffffff;
}
.dark .nav-bar .kt-menu-item.active > .kt-menu-link {
  border-bottom-color: #ffffff;
}

.font-\[Inter\] {
  font-family: 'Inter';
}

.nav-x-spacing {
  padding-left: var(--nav-x-margin);
  padding-right: var(--nav-x-margin);
}

/* Mobile-only breathing room below the global top header. The .header-spacer
   sibling only kicks in at lg: (>=1024px) via lg:mb-11, leaving 0 gap on
   mobile. The reset for .main-header-hidden keeps the phantom gap from
   appearing when schedule/report pages collapse the header (height: 0). */
@media (max-width: 1023px) {
  .header-wrap.m-header {
    margin-bottom: 1rem;
  }

  .header-wrap.m-header.main-header-hidden {
    margin-bottom: 0;
  }
}

/* Active-direction arrow: dark fill so the sort indicator reads as active.
   The opposite-direction arrow is hidden via opacity:0 below. */
.kt-table-col.asc .kt-table-col-sort::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5' fill='none'%3E%3Cpath d='M1.08333 4.83333C0.908333 4.83333 0.791667 4.775 0.675 4.65833C0.441667 4.425 0.441667 4.075 0.675 3.84167L3.59167 0.925C3.825 0.691667 4.175 0.691667 4.40833 0.925L7.325 3.84167C7.55833 4.075 7.55833 4.425 7.325 4.65833C7.09167 4.89167 6.74167 4.89167 6.50833 4.65833L4 2.15L1.49167 4.65833C1.375 4.775 1.25833 4.83333 1.08333 4.83333Z' fill='%234B5675'/%3E%3C/svg%3E");
}

.kt-table-col.desc .kt-table-col-sort::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5' fill='none'%3E%3Cpath d='M4 4.24984C3.825 4.24984 3.70833 4.1915 3.59167 4.07484L0.675 1.15817C0.441667 0.924838 0.441667 0.574837 0.675 0.341504C0.908333 0.108171 1.25833 0.108171 1.49167 0.341504L4 2.84984L6.50833 0.341504C6.74167 0.108171 7.09167 0.108171 7.325 0.341504C7.55833 0.574837 7.55833 0.924838 7.325 1.15817L4.40833 4.07484C4.29167 4.1915 4.175 4.24984 4 4.24984Z' fill='%234B5675'/%3E%3C/svg%3E");
}

.kt-badge-primary {
  border-color: #1271C14D;
}

/* Sticky headers paint over scrolled card content, so they need an OPAQUE
   version of the spec's muted/40 header band: mix muted 40% into the card
   surface instead of transparent. Same formula both themes. */
.table-header-sticky thead th {
  background-color: color-mix(in oklab, var(--muted) 40%, var(--card));
  border-color: var(--border);
}

.table-header-sticky:is(.dark *) thead th {
  border-bottom: 1px solid var(--border);
  border-bottom-color: var(--border);
  box-shadow: inset 0 -1px 0 var(--border);
}

.table-header-sticky:is(.light *) thead th {
  border-bottom: 0;
  box-shadow: none;
}

/* Layout containment for very large report tables (thousands of rows).
   Applied by bp-datatable-large-table-fix.js, which also locks column widths
   and sets --bp-cv-row-height from the measured first row. Lets the engine
   skip layout/paint for offscreen rows so forced layouts cost milliseconds
   instead of seconds. Browsers without content-visibility ignore this. */
.bp-contain-rows > tbody > tr {
  content-visibility: auto;
  contain-intrinsic-size: auto var(--bp-cv-row-height, 60px);
}

/* Pin the Time Off Earning Code employee table header below the fixed nav. */
#account_pto_table thead th {
  position: sticky;
  top: var(--sticky-offset, 107px);
  z-index: 2;
  /* --card: the sticky header covers card content as rows scroll under it,
     so it must paint with the card surface. */
  background-color: var(--card);
}

.kt-table.no-borders {
    border: none;
}

.kt-table.no-borders tr {
    border: none;
}

.kt-table.no-borders th,
.kt-table.no-borders td {
    border: none;
}

/* Restyle spec G2: table headers render STOCK — 40px tall, muted/40 band,
   weight 400, 16px inline padding. The old 5px padding-top/bottom compressor
   and the SemiBold #4E4E4E label override are deliberately gone. The only
   header override the spec keeps is the label color: --header-foreground
   (zinc-400 dark / zinc-700 light, defined in the token blocks above) instead
   of the vendor's --secondary-foreground. Unlayered, loads after
   tailwind.styles.css's @layer components, so it wins without !important. */
:is(.kt-table thead) th,
:is(.kt-table thead) th .kt-table-col,
:is(.kt-table thead) th .kt-table-col-label {
  font-weight: 400;
  color: var(--header-foreground);
}

/* Datatable pagination — the Figma spec calls for larger 30×30 cells, solid
   mid-grey text, and a weight difference between the active and inactive page
   numbers. The theme ships 28px cells (spacing*7), near-2px inline padding,
   --muted-foreground (too light) text, and identical weights. Restore the
   spec: 30×30 cells, 8/12 padding, #4E4E4E text, inactive 400 / active 500.
   Unlayered → wins over the @layer components rules. Applied globally. */
.kt-datatable-pagination .kt-datatable-pagination-button {
  height: 30px;
  min-width: 30px;
  padding: 8px 12px;
  color: #4E4E4E;
  font-weight: 400;
}

.active:is(.kt-datatable-pagination .kt-datatable-pagination-button) {
  font-weight: 500;
}

/* Dark mode: keep the 30×30 geometry and 400/500 weights (set above,
   unscoped) but swap the light-mode #4E4E4E text for the theme's muted
   foreground so the page numbers stay legible on the dark surface. The
   :is(.dark *) prefix adds specificity over the base rule. */
.kt-datatable-pagination:is(.dark *) .kt-datatable-pagination-button {
  color: var(--muted-foreground);
}

.kt-table :is(tbody, tfoot) td {
  white-space: normal;
  overflow-wrap: break-word;
}

/* Remove gray weekend highlighting from KT datepicker — treat current-month
   weekends like normal days. Prev-month days remain greyed by the vendor.
   Next-month days are forced to current-month colours so they read as a
   continuous extension of the current month. */
[data-vc-theme] .vc-date[data-vc-date-weekend] .vc-date__btn,
[data-vc-theme] .vc-date[data-vc-date-month=next] .vc-date__btn,
[data-vc-theme] .vc-date[data-vc-date-weekend][data-vc-date-month=next] .vc-date__btn,
[data-vc-theme] .vc-date[data-vc-date-holiday][data-vc-date-month=next] .vc-date__btn {
  color: var(--vc-date-text);
}

/* Re-assert the vendor's grey for disabled dates after the rule above.
   The broad weekend / next-month selectors would otherwise repaint
   weekend-disabled or next-month-disabled cells with the active text colour. */
[data-vc-theme] .vc-date[data-vc-date-disabled] .vc-date__btn {
  color: var(--vc-disabled-text) !important;
}

[data-vc-theme] .vc-date[data-vc-date-weekend][data-vc-date-today] .vc-date__btn,
[data-vc-theme] .vc-date[data-vc-date-today][data-vc-date-month=next] .vc-date__btn {
  color: var(--vc-today-text);
}

[data-vc-theme] .vc-date[data-vc-date-weekend][data-vc-date-selected] .vc-date__btn {
  background-color: var(--vc-selected-bg);
  color: var(--vc-selected-text);
}

[data-vc-theme] .vc-date[data-vc-date-selected=middle][data-vc-date-weekend] .vc-date__btn {
  background-color: var(--vc-range-bg);
  color: var(--vc-range-text);
}

tfoot td {
  padding-inline: calc(var(--spacing) * 4);
  padding-block: calc(var(--spacing) * 3);
  vertical-align: middle;
}

.kt-table tfoot {
  background-color: transparent;
  border-color: var(--border);
}

.fc-view-container a:not([href]):not([tabindex]),
.fc-view-container a:not([href]):not([tabindex]):focus,
.fc-view-container a:not([href]):not([tabindex]):hover {
  color: inherit;
  text-decoration: none;
}

.fc-view-container .pto-calendar-event-hours {
  background: var(--muted-foreground) !important;
}

select[data-kt-select="true"]:not([data-kt-select-initialized="true"]) {
  visibility: hidden;
}


//Dashboard view
.dashboard-table {
  td {
    max-width: none;
  }
}


// Base loader
.base-loader-v2 {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background: #fff;
}

.base-loader-v2 .loader-v2 {
  width: 100px;
  height: 80px;
  position: absolute;
  top: -80px;
  right: 0;
  left: 0;
  bottom: 0;
  margin: auto;
}

.base-loader-v2 .loader-v2 .image {
  width: 100px;
  height: 160px;
  font-size: 40px;
  text-align: center;
  transform-origin: bottom center;
  animation: 3s rotate infinite;
  opacity: 0;
}

.base-loader-v2 .loader-v2 span {
  display: block;
  width: 100%;
  text-align: center;
  position: absolute;
  bottom: 0;
}

@keyframes rotate {
  0% {
    transform: rotate(90deg);
  }

  10% {
    opacity: 0;
  }

  35% {
    transform: rotate(0deg);
    opacity: 1;
  }

  65% {
    transform: rotate(0deg);
    opacity: 1;
  }

  80% {
    opacity: 0;
  }

  100% {
    transform: rotate(-90deg);
  }
}

.field-wrap-amount:before {
  content: '$';
  position: absolute;
  left: 15px;
}

.field-wrap-amount input {
  padding-left: 30px;
  text-align: right;
}

.field-wrap-amount {
  display: flex;
  align-items: center;
  position: relative;
}

.field-wrap-percentage {
  display: flex;
  align-items: center;
  position: relative;
}

.field-wrap-percentage input {
  padding-right: 30px;
  text-align: right;
}

.field-wrap-percentage:after {
  content: '%';
  position: absolute;
  right: 15px;
}

.container-fixed {
  min-height: calc(100vh - 152px);
}


body:has(.intro-wrap) .container-fixed {
  min-height: calc(100vh - 152px);
}

.intro-wrap {
  iframe {
    position: absolute;
    z-index: 1;
    top: 105px;
    left: 0;
    width: 100%;
    height: calc(100vh - 105px);
    margin: 0;
    padding: 0;
    border: 0;

    @media (max-width: 1025px) {
      top: 70px;
      height: calc(100vh - 70px);
    }
  }
}

//Responsive styles
@media (max-width: 48rem) {
  .sm\:hidden {
    display: none;
  }

  .sm\:flex-col {
    flex-direction: column;
  }

  .sm\:mb-5 {
    margin-bottom: calc(var(--spacing)*5)
  }
}

@media (min-width: 48rem) {
  .md\:hidden {
    display: none;
  }

  .md\:mx-\[80px\] {
    margin-right: 80px;
    margin-left: 80px;
  }

  .md\:grid-cols-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

@media (min-width: 64rem) {
  .lg\:block {
    display: block;
  }

  .lg\:min-w-\[350px\] {
    min-width: 350px;
  }

  .lg\:max-w-\[360px\] {
    max-width: 360px;
  }

}

@media (min-width: 80rem) {
  .xl\:hidden {
    display: none !important;
  }
}

@media (max-width: 1024px) {
  :root {
    --nav-x-margin: 40px;
    --sticky-offset: 58px;
  }
}

.btn-apply {
  background: transparent;
  padding: 0;
  color: royalblue !important;
  cursor: pointer;
  font-weight: bold;
}

.kt-form-message.field-validation-error {
  display: block;
  margin-top: calc(var(--spacing) * 1);
}

.validation-summary-valid,
.field-validation-valid,
.help-block:empty {
  display: none;
}

.field-validation-error,
.help-block,
.text-destructive.text-sm>.field-validation-error,
.text-sm.text-destructive>.field-validation-error,
.text-destructive.text-sm>.help-block,
.text-sm.text-destructive>.help-block {
  display: block;
  margin-top: calc(var(--spacing) * 1);
  font-size: 0.875rem;
  line-height: 1.25rem;
  color: var(--destructive, #E84556);
}

.kt-btn-warn {
  background-color: #DC8404;
}

.kt-badge-warning-2 {
  color: #efa614;
  background-color: #efa62121;

  &.kt-badge-outline {
    border-color: #efa614;
  }
}

.kt-alert {
  &.kt-alert-warning-2 {
    border-left: 2px solid #DC8400;
    background-color: #FFF9BB80;
    border-radius: 0;

    .kt-alert-title {
      color: #DC8400;
    }
  }
}

.kt-alert:is(.dark *) {
  &.kt-alert-warning-2 {
    border-left: 2px solid #7d4b00;
    background-color: #3c3b3480;
    border-radius: 0;

    .kt-alert-title {
      color: #7d4b00;
    }
  }
}


.text-warn-2 {
  color: #DC8400;
}

.hover\:underline:hover {
  text-decoration: underline;
}

.m-login__head {
  font-size: 3.5rem;
  font-weight: 300;
  font-family: Montserrat;
  color: #20303c;
}
/* In dark mode the original #000 here was effectively invisible against the
   dark background. Switch to the theme foreground token so the hero text
   reads cleanly in both modes. Used by Account/Register ("14 days for Free")
   and the setup-or-join state ("What would you like to do?"). */
.m-login__head:is(.dark *) {
  color: var(--foreground);
}

/* ----------------------------------------------------------------------------
   Account/Register header row — logo + "Already have an account? Login"
   ----------------------------------------------------------------------------
   Tailwind in metronic9-bundle.css doesn't generate `sm:` variants from
   .cshtml usage (Tailwind's source scan doesn't include Razor views), so the
   responsive layout has to live here as plain CSS keyed on a stable class
   hook. AB#13217 QA round 3 (Claire) flagged:
   - #7  Logo appears too small in the new layout
   - #8  Mobile Login button is in an odd position (should mirror QA1)
   - #14/15 Vertical spacing between logo and the hero text ("14 days for
          Free" / "What would you like to do?") feels cramped on mobile
   QA1 mobile pattern: logo at top-left and Login link at top-right (same
   row, just smaller). The hero font drops from 56px to ~36px so it stays on
   one line at 320–430px viewports. Keep flex-row across all breakpoints. */
.register-header-row {
  justify-content: space-between;
}
@media (max-width: 767px) {
  /* Generous breathing room between the header row and the hero text. The
     hero already has 30px (mb-7.5) below it before the buttons; this 2.5rem
     above gives a similar / slightly larger gap so the hero reads as
     visually balanced between the header and the buttons (matches QA1). */
  .register-content {
    margin-top: 2.5rem;
  }
  /* QA1 reduces the hero font on mobile so "14 days for Free" / "What would
     you like to do?" stays on one line at 320–430px viewports. The default
     3.5rem (56px) wraps at those widths. */
  .m-login__signin .m-login__head {
    font-size: 2.25rem;
  }
}
.kt-link {
  .kt-link i {
    line-height: 1;
  }
}


.border-top--black {
  border-top: 1px solid #000 !important;
}

.border-top--grey {
  border-top: 1px solid #dee2e6 !important;

  &:is(.dark *) {
    border-top-color: var(--border) !important;
  }
}

.border-bottom--black {
  border-bottom: 1px solid #000 !important;
}

.border-bottom--grey {
  border-bottom: 1px solid #dee2e6 !important;

  &:is(.dark *) {
    border-bottom-color: var(--border) !important;
  }
}

@media print {
  h1 {
    margin-bottom: 2rem;
    font-size: 2rem;
  }

  .gps-activity-report-view {
    position: fixed !important;
    top: 100px !important;
    min-width: 100% !important;

    &__fields {
      .col-lg-2 {
        max-width: 16.66667% !important;
      }
    }
  }
}

/* GPS Activity report "No GPS data available" empty state.
   The legacy .empty-data-section styles live in custom.scss (app-bundle.css),
   which this metronic9 page does not load, so re-declare them page-scoped here. */
.gps-activity-report-view .empty-data-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 250px;
  background: #FEF5F6;
}

.gps-activity-report-view .empty-data-section--icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin-bottom: 10px;
  background: #DCF4EC url("../../Content/images/dashboard/people.svg") no-repeat center;
}

.gps-activity-report-view .empty-data-section--title {
  font-weight: 600;
  font-size: 17px;
}

/* Dark mode: drop the light-pink panel for a themed dark surface. The title
   inherits the layout's light foreground, and the icon badge keeps its pale
   circle so the dark-slate people glyph stays legible. */
.dark .gps-activity-report-view .empty-data-section {
  background: var(--muted);
}

@media (width >=64rem) {
  .lg\:col-span-4 {
    grid-column: span 4 / span 4;
  }
}

@media (width >=80rem) {
  .xl\:col-span-3 {
    grid-column: span 3 / span 3;
  }
}

.textarea-resize-none {
  resize: none;
}
.min-h-\[75px\] {
    min-height: 75px;
}


.kt-radio:indeterminate {
  background-color: var(--background);
  border-color: var(--input);
}

.kt-radio.active:indeterminate {
  background-color: var(--primary);
  border-color: var(--primary);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22' fill='none'%3E%3Ccircle cx='10.9995' cy='11' r='5.86667' fill='white'/%3E%3C/svg%3E");
}
.col-span-3 {
  grid-column: span 3 / span 3;
}
@media print {
  .table-header-sticky thead th {
      position: static !important;
  }
  .bp-sticky-fixed-wrap {
      display: none !important;
  }
}
.right-4 {
  right: calc(var(--spacing) * 4);
}
// Phone number select: system font stacks render "*" noticeably smaller than
// digits, making masked numbers like "********3403" look broken. Force Inter
// (already loaded by the login layout) on both the select trigger and its
// options so asterisks match the digit size.
.phone-number-select,
.phone-number-select option {
  font-family: Inter, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
}

.wrap-anywhere {
  overflow-wrap: anywhere;
}
:is(.dark *) input[type="datetime-local"],
:is(.dark *) input[type="time"] {
  color-scheme: dark;
}

/* Dark-mode overrides for noUiSlider — the vendor stylesheet (CDN-loaded) uses
   hard-coded light colours (#fafbfc / #ebedf2 / #dfe2ea) that clash with the
   dark theme. Theme-level so every slider inherits the correct palette. */
:is(.dark *) .noUi-target {
  background: var(--muted);
  border-color: var(--border);
  box-shadow: none;

  .noUi-handle {
    background: var(--background);
    border-color: var(--border);
    box-shadow: 0 3px 6px -3px rgba(0, 0, 0, 0.6);
  }

  .noUi-connect {
    background: var(--primary);
  }
}

/* Chrome fills the input with its own white background/black text when the user
   picks an autofill/autocomplete suggestion. Pin the box-shadow to the theme
   surface in dark mode so the field doesn't flash white on hover. */
:is(.dark *) input:-webkit-autofill,
:is(.dark *) input:-webkit-autofill:hover,
:is(.dark *) input:-webkit-autofill:focus,
:is(.dark *) input:-webkit-autofill:active,
:is(.dark *) textarea:-webkit-autofill,
:is(.dark *) textarea:-webkit-autofill:hover,
:is(.dark *) textarea:-webkit-autofill:focus,
:is(.dark *) select:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px var(--background) inset !important;
  box-shadow: 0 0 0 1000px var(--background) inset !important;
  -webkit-text-fill-color: var(--foreground) !important;
  caret-color: var(--foreground);
  transition: background-color 9999s ease-in-out 0s;
}


/* Restyle spec P4: the 17-column detail table keeps compact density —
   10px block / 12px inline at 13px text (stock kt-table-sm is 8/8). */
.timecard-detail-table td,
.summary-row td {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

.timecard-detail-table.kt-table-sm tbody td,
.timecard-detail-table.kt-table-sm tfoot td,
.timecard-detail-table.kt-table-sm thead th {
  padding-inline: 12px;
}

.timecard-detail-table {
  font-size: 0.8125rem;
}

.bp-notes-icon {
  display: inline-block;
  width: 13px;
  height: 15px;
  vertical-align: text-bottom;
  background-color: var(--muted-foreground);
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='13' height='15' viewBox='0 0 13 15' fill='none'><path d='M2 0.5H8.41699C8.85421 0.500098 9.2698 0.6908 9.55469 1.02246L11.2197 2.96191C11.453 3.2338 11.581 3.58024 11.5811 3.93848V12.2305C11.5811 13.0589 10.9095 13.7305 10.0811 13.7305H2C1.17157 13.7305 0.5 13.0589 0.5 12.2305V2C0.5 1.17157 1.17157 0.5 2 0.5Z' fill='black' fill-opacity='0.1' stroke='black'/><path d='M8.25293 0.538452V3.73807H11.4776' stroke='black' stroke-linecap='round'/></svg>");
  mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='13' height='15' viewBox='0 0 13 15' fill='none'><path d='M2 0.5H8.41699C8.85421 0.500098 9.2698 0.6908 9.55469 1.02246L11.2197 2.96191C11.453 3.2338 11.581 3.58024 11.5811 3.93848V12.2305C11.5811 13.0589 10.9095 13.7305 10.0811 13.7305H2C1.17157 13.7305 0.5 13.0589 0.5 12.2305V2C0.5 1.17157 1.17157 0.5 2 0.5Z' fill='black' fill-opacity='0.1' stroke='black'/><path d='M8.25293 0.538452V3.73807H11.4776' stroke='black' stroke-linecap='round'/></svg>");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}

/* Ensure summary/total rows have a uniform background across every cell,
   including empty ones (e.g. trailing delete column). The bg on <td> (not
   <tr> alone) avoids gaps where cells carry their own backgrounds.
   Restyle spec P4: week bands and tfoot use the muted/40 band (same recipe
   as table headers, both themes); subtotal rows 500, totals 600 with a top
   border. */
.timecard-detail-table tr.summary-row > td,
.timecard-detail-table tfoot tr > td {
  background: color-mix(in oklab, var(--muted) 40%, transparent);
}
.timecard-detail-table tr.summary-row > td {
  font-weight: 500;
}
.timecard-detail-table tfoot tr > td {
  /* R11-10: labels stay 500; the numeric value cells get 600 below. */
  font-weight: 500;
  border-top: 1px solid var(--border);
}

.timecard-detail-table tbody tr.row-white > td {
  background: #ffffff;
}

.timecard-detail-table tbody tr.row-light > td {
  background: #F8F8FA;
}

.timecard-detail-table tbody tr.row-white:is(.dark *) > td {
  background: var(--card);
}

.timecard-detail-table tbody tr.row-light:is(.dark *) > td {
  background: color-mix(in oklab, var(--muted) 25%, var(--card));
}

/* W21: while the edit drawer is open, the highlighted punch row must paint
   its OWN td background (the tr-level highlight is fully covered by the
   opaque zebra td paint above, so in dark the highlight was invisible).
   Placed after the zebra dark rules — equal specificity, source order wins.
   --muted (25%) is a step above the 18% card, so the row reads clearly
   lighter than its neighbors while lifted above the overlay. Light keeps
   its accidental lifted-white-row behavior (untouched). */
.timecard-detail-table tbody tr.highlight:is(.dark *) > td {
  background: var(--muted);
}


.timecard-detail-table.kt-table-border tbody td:last-child {
  border-inline-end-style: var(--tw-border-style, solid);
  border-inline-end-width: 1px;
  border-color: var(--border);
}

abbr[data-original-title], abbr[title] {
  cursor: help;
}

/* Eonasdan bootstrap-datetimepicker popup — the vendor stylesheet ships with
   Bootstrap 3/4 defaults that clash with the Metronic 9 (Tailwind/KTUI) palette.
   Re-skin the widget using KTUI design tokens so it matches the rest of the UI
   in both light and dark modes.
   Written as flat CSS (no &-nesting) because this file is concatenated into
   metronic9-bundle.css without sass compilation — see gulpfile pack-metronic9-css.
   Selector uses .bootstrap-datetimepicker-widget.dropdown-menu (specificity 0,2,0)
   to beat any generic .dropdown-menu rule the page may carry. */
.bootstrap-datetimepicker-widget.dropdown-menu {
  display: block !important;
  z-index: 99999;
  /* Default width for time-only mode (format: 'HH:mm', no date component) —
     the popup only renders the hour/minute spinner block, so it needs much
     less horizontal space than the calendar grid. */
  min-width: 272px;
  padding: 1rem;
  background: var(--popover, var(--background));
  color: var(--popover-foreground, var(--foreground));
  border: 1px solid var(--border);
  border-radius: var(--radius-md, var(--radius, 0.5rem));
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  font-size: 0.75rem;
  line-height: 1rem;
}

/* Date or date+time mode — eonasdan renders a `.datepicker` descendant only
   when the format contains a date token, so :has(.datepicker) is the clean
   discriminator between time-only and date(-and-time) popups. Bump the
   min-width so the calendar grid (7 day columns + nav) fits without wrap. */
.bootstrap-datetimepicker-widget.dropdown-menu:has(.datepicker) {
  min-width: 450px;
}

.bootstrap-datetimepicker-widget.dropdown-menu:before,
.bootstrap-datetimepicker-widget.dropdown-menu:after {
  display: none;
}

/* Match VanillaCalendar [data-vc=calendar][data-vc-input][data-vc-position=…]
   margin so the popup sits 0.25rem off the input edge instead of flush
   against it (the [data-kt-date-picker] popovers on the In/Out Activity
   view use this offset). The plugin adds a `.bottom` or `.top` modifier
   class to the dropdown-menu based on which side it opens to. */
.bootstrap-datetimepicker-widget.dropdown-menu.bottom {
  margin-top: 10px;
}

.bootstrap-datetimepicker-widget.dropdown-menu.top {
  margin-top: -10px;
}

/* Align the popup with the .kt-input wrapper's left edge (not the input's
   left edge inside the wrapper) so the calendar icon and popup share a
   left axis — same alignment KTDatePicker uses on the In/Out Activity view
   via _repositionToParentContainer (newLeft = containerRect.left). The
   eonasdan plugin only exposes input-relative positioning, so it sets an
   inline `left: <icon-offset>` on the dropdown-menu when the popup is
   appended inside .kt-input; !important is the only way to override an
   inline style. Scoped to direct children of .kt-input so legacy / non-
   wrapped usages keep the plugin's default placement. */
.kt-input > .bootstrap-datetimepicker-widget.dropdown-menu {
  left: 0 !important;
}

.bootstrap-datetimepicker-widget.dropdown-menu .list-unstyled {
  margin: 0;
  padding: 0;
}

/* Side-by-side layout (sideBySide: true) — when enabled, the plugin renders
   the popup as `<div class="row"><div class="col-md-6">date</div>
   <div class="col-md-6">time</div></div>` using Bootstrap grid classes.
   The metronic9 bundle is Tailwind-based and doesn't ship Bootstrap's grid
   CSS, so .row / .col-md-6 are no-ops by default and both panels render
   stacked. Re-implement the flex layout here using KTUI tokens so the date
   grid + time spinner sit next to each other (matches VanillaCalendar's
   2-col grid layout). */
.bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs {
  width: auto;
}

.bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs > .row {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  margin: 0;
  gap: 1rem;
}

.bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs > .row > .col-md-6 {
  flex: 0 0 auto;
  width: auto;
  padding: 0;
}

/* Vertical divider between date and time panels — mirrors the [data-vc=time]
   `border-width: 0 0 0 1px` rule on VanillaCalendar so the two popovers share
   the same separator treatment. The time column also lays out its own
   contents as a column flex so the hour/minute spinner block centers
   vertically within the column (which stretches to match the date grid's
   height); without this it sits at the top with empty space underneath.
   Fixed 240px width keeps the time panel from collapsing to its content
   width when the hour/minute grids fold open and out (cells are larger now,
   so a stable column width avoids the popup jumping between views). */
.bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs > .row > .col-md-6 + .col-md-6 {
  width: 240px;
  flex: 0 0 240px;
  padding-left: 1rem;
  border-left: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* Hide the date-or-time picker switcher when both panels are already visible
   side by side (the vendor stylesheet hides this in sideBySide mode). */
.bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs a[data-action="togglePicker"] {
  display: none;
}

.bootstrap-datetimepicker-widget.dropdown-menu table {
  width: 100%;
  margin: 0;
  border: 0;
  border-collapse: separate;
  border-spacing: 0;
  color: inherit;
}

/* Reset table cell padding to 0 — VC's date grid is denser (cells rely on
   min-width / min-height instead of cell padding for sizing). Specific rows
   (header, day-of-week, days, time) opt back into the padding they need. */
.bootstrap-datetimepicker-widget.dropdown-menu table th,
.bootstrap-datetimepicker-widget.dropdown-menu table td {
  text-align: center;
  border: 0;
  padding: 0;
  vertical-align: middle;
}

/* Header: prev / picker-switch / next — match VanillaCalendar [data-vc=header]
   tokens (font 1rem/700, line-height 1.5rem, border-radius 0.25rem,
   margin-bottom 0.75rem on the row). The plugin emits both `.picker-switch`
   (date view) and `.datepicker-switch` (month / year / decade views) for the
   center cell, so style both. */
.bootstrap-datetimepicker-widget.dropdown-menu .picker-switch,
.bootstrap-datetimepicker-widget.dropdown-menu .datepicker-switch,
.bootstrap-datetimepicker-widget.dropdown-menu th.prev,
.bootstrap-datetimepicker-widget.dropdown-menu th.next {
  cursor: pointer;
  color: var(--foreground);
  border-radius: 0.25rem;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.5rem;
  padding: 0.25rem;
  /* 75ms ease — match VC [data-vc=header] / [data-vc-arrow] hover fade. */
  transition: opacity 75ms cubic-bezier(0.4, 0, 0.2, 1),
              color 75ms cubic-bezier(0.4, 0, 0.2, 1),
              background-color 75ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* Selected month / year label — match the KTUI / VanillaCalendar date picker
   header (text-sm, weight 500) used by [data-kt-date-picker] inputs so the
   bootstrap-datetimepicker popup reads consistently with the rest of the app.
   Kept separate from prev/next so the chevron icons (ki-left / ki-right) stay
   at their original 1rem glyph size. */
.bootstrap-datetimepicker-widget.dropdown-menu .picker-switch,
.bootstrap-datetimepicker-widget.dropdown-menu .datepicker-switch {
  font-size: var(--text-sm);
  line-height: var(--text-sm--line-height);
  font-weight: var(--font-weight-medium);
}

/* Pad the header row's bottom edge to match VC --vc-header-margin-bottom. */
.bootstrap-datetimepicker-widget.dropdown-menu thead tr:first-child th {
  padding-bottom: 0.75rem;
}

/* Day-of-week labels (Sun Mon Tue …) — match VanillaCalendar [data-vc-week-day]
   tokens (font 0.75rem/700, line-height 1rem, min-width 1.875rem, margin-
   bottom 0.5rem on the row). Color matches --vc-weekday-text
   (var(--muted-foreground), i.e. gray). */
.bootstrap-datetimepicker-widget.dropdown-menu th.dow {
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1rem;
  min-width: 1.875rem;
  padding-bottom: 0.5rem;
  color: var(--muted-foreground);
}

/* Picker-switch (month / year header label) hover — match VanillaCalendar
   --vc-header-text-hover (text color goes muted-foreground; no bg change).
   Explicit `background-color: transparent` overrides the vendor stylesheet's
   `thead tr:first-child th:hover { background: #eee }` rule that would
   otherwise leak through (vendors.bundle.css ships with the metronic9
   bundle and styles every header th on hover). */
.bootstrap-datetimepicker-widget.dropdown-menu .picker-switch:hover,
.bootstrap-datetimepicker-widget.dropdown-menu .datepicker-switch:hover {
  color: var(--muted-foreground);
  background-color: transparent;
}

/* Disable drill-up from the years view. The plugin renders five view modes
   (days → months → years → decades → centuries); clicking the picker-switch
   in years view normally takes the user to the decade-range / century views
   for picking a "year range." We don't want that — `pointer-events: none`
   makes the year-range header inert so users can only pick individual years
   (and navigate decades via the prev/next chevrons). Decade and century
   panels are also locked in case the plugin ever lands on them. */
.bootstrap-datetimepicker-widget.dropdown-menu .datepicker-years .picker-switch,
.bootstrap-datetimepicker-widget.dropdown-menu .datepicker-years .datepicker-switch,
.bootstrap-datetimepicker-widget.dropdown-menu .datepicker-decades .picker-switch,
.bootstrap-datetimepicker-widget.dropdown-menu .datepicker-decades .datepicker-switch,
.bootstrap-datetimepicker-widget.dropdown-menu .datepicker-centuries .picker-switch,
.bootstrap-datetimepicker-widget.dropdown-menu .datepicker-centuries .datepicker-switch {
  pointer-events: none;
  cursor: default;
}

/* Prev/next month arrows — match VanillaCalendar [data-vc-arrow] tokens
   (foreground color + 0.5 opacity, full opacity on hover). The 75ms hover
   transition is declared on the shared header rule above. */
.bootstrap-datetimepicker-widget.dropdown-menu th.prev,
.bootstrap-datetimepicker-widget.dropdown-menu th.next {
  color: var(--foreground);
  opacity: 0.5;
}

.bootstrap-datetimepicker-widget.dropdown-menu th.prev:hover,
.bootstrap-datetimepicker-widget.dropdown-menu th.next:hover {
  color: var(--foreground);
  opacity: 1;
  /* Override vendor `thead tr:first-child th:hover { background: #eee }`. */
  background-color: transparent;
}

.bootstrap-datetimepicker-widget.dropdown-menu th.disabled,
.bootstrap-datetimepicker-widget.dropdown-menu th.disabled:hover,
.bootstrap-datetimepicker-widget.dropdown-menu td.disabled,
.bootstrap-datetimepicker-widget.dropdown-menu td.disabled:hover {
  opacity: 0.5;
  cursor: not-allowed;
  background-color: transparent;
  color: var(--muted-foreground);
}

/* Day cells (used when the widget shows a calendar too) — match
   VanillaCalendar [data-vc-date-btn] tokens (font 0.75rem/400, line-height
   1rem, min-width/min-height 1.875rem, border-radius 0.5rem). No vertical
   padding so the selected (.active) highlight renders as a clean 30×30
   rounded square — VC achieves the same shape because its bg lives on a
   100%×100% inner button while the wrapper holds the 0.125rem row spacing.
   Without an inner element on our side, padding on the td would stretch
   the bg vertically. */
.bootstrap-datetimepicker-widget.dropdown-menu td.day,
.bootstrap-datetimepicker-widget.dropdown-menu td.hour,
.bootstrap-datetimepicker-widget.dropdown-menu td.minute,
.bootstrap-datetimepicker-widget.dropdown-menu td.second {
  min-height: 1.875rem;
  min-width: 1.875rem;
  padding: 0;
  cursor: pointer;
  border-radius: 0.5rem;
  font-size: 0.75rem;
  font-weight: 400;
  line-height: 1rem;
  /* Match VanillaCalendar [data-vc-date-btn] transition so the .active
     bg swap fades in / out instead of snapping. */
  transition: background-color 75ms cubic-bezier(0.4, 0, 0.2, 1),
              color 75ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* Month / year / decade / century selector spans (rendered when the user
   clicks the picker-switch to drill up to month/year selection). The plugin
   emits them as <span class="month|year|decade|century"> children of a
   <td colspan="7">. Match VanillaCalendar [data-vc-months-month] /
   [data-vc-years-year] tokens (font 0.75rem/600, height 2.5rem, border-
   radius 0.5rem, padding 0.25rem).

   VC layout: months in 4-up grid (`[data-vc=months]`), years/decades/centuries
   in 5-up grid (`[data-vc=years]`). Match by setting width-percent so the
   inline-flex spans wrap into the right column count. */
.bootstrap-datetimepicker-widget.dropdown-menu .month,
.bootstrap-datetimepicker-widget.dropdown-menu .year,
.bootstrap-datetimepicker-widget.dropdown-menu .decade,
.bootstrap-datetimepicker-widget.dropdown-menu .century {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 2.5rem;
  /* Margin acts as the inter-cell gap (we can't use grid-gap: spans live
     inside a single colspan=7 td). Vertical 0.5rem each side sums to the
     1rem row-gap VanillaCalendar uses; horizontal 0.125rem each side sums
     to its 0.25rem column-gap. */
  margin: 0.5rem 0.125rem;
  padding: 0.25rem;
  border-radius: 0.5rem;
  cursor: pointer;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1rem;
  color: var(--muted-foreground);
  text-align: center;
  word-break: break-all;
  /* 75ms ease — same as VC [data-vc-months-month] / [data-vc-years-year]. */
  transition: background-color 75ms cubic-bezier(0.4, 0, 0.2, 1),
              color 75ms cubic-bezier(0.4, 0, 0.2, 1);
}

.bootstrap-datetimepicker-widget.dropdown-menu .month {
  width: calc(25% - 0.25rem);
}

.bootstrap-datetimepicker-widget.dropdown-menu .year,
.bootstrap-datetimepicker-widget.dropdown-menu .decade,
.bootstrap-datetimepicker-widget.dropdown-menu .century {
  width: calc(20% - 0.25rem);
}

/* Suppress the vendor `td span:hover { background: #eee }` rule for the
   month/year/decade/century picker spans — matches the day-cell reset above
   so all calendar controls keep their default bg on hover. The .active and
   .focused rules below win on cascade because they come later. */
.bootstrap-datetimepicker-widget.dropdown-menu .month:hover,
.bootstrap-datetimepicker-widget.dropdown-menu .year:hover,
.bootstrap-datetimepicker-widget.dropdown-menu .decade:hover,
.bootstrap-datetimepicker-widget.dropdown-menu .century:hover {
  background-color: transparent;
}

/* Month / year / decade / century views collapse to the natural width of
   their spans (no full 7-column day grid to hold the table open), which
   makes the popup narrower than the day view and noticeably tighter than
   the VanillaCalendar [data-vc=calendar] picker (240px content area). Pin
   the panel containers to that same 240px floor so all four drill-up views
   match the In/Out Activity date picker. */
.bootstrap-datetimepicker-widget.dropdown-menu .datepicker-months,
.bootstrap-datetimepicker-widget.dropdown-menu .datepicker-years,
.bootstrap-datetimepicker-widget.dropdown-menu .datepicker-decades,
.bootstrap-datetimepicker-widget.dropdown-menu .datepicker-centuries {
  min-width: 240px;
}

.bootstrap-datetimepicker-widget.dropdown-menu .month.active,
.bootstrap-datetimepicker-widget.dropdown-menu .year.active,
.bootstrap-datetimepicker-widget.dropdown-menu .decade.active,
.bootstrap-datetimepicker-widget.dropdown-menu .century.active,
.bootstrap-datetimepicker-widget.dropdown-menu .month.active:hover,
.bootstrap-datetimepicker-widget.dropdown-menu .year.active:hover,
.bootstrap-datetimepicker-widget.dropdown-menu .decade.active:hover,
.bootstrap-datetimepicker-widget.dropdown-menu .century.active:hover {
  background-color: var(--primary);
  color: var(--primary-foreground);
}

.bootstrap-datetimepicker-widget.dropdown-menu .month.disabled,
.bootstrap-datetimepicker-widget.dropdown-menu .year.disabled,
.bootstrap-datetimepicker-widget.dropdown-menu .decade.disabled,
.bootstrap-datetimepicker-widget.dropdown-menu .century.disabled {
  opacity: 0.5;
  cursor: not-allowed;
  background-color: transparent;
  color: var(--muted-foreground);
}

/* Today highlight in month/year views — same treatment as today on the day
   grid (accent bg, primary text). */
.bootstrap-datetimepicker-widget.dropdown-menu .month.focused,
.bootstrap-datetimepicker-widget.dropdown-menu .year.focused,
.bootstrap-datetimepicker-widget.dropdown-menu .decade.focused,
.bootstrap-datetimepicker-widget.dropdown-menu .century.focused {
  background-color: var(--accent);
  color: var(--primary);
}

/* Prev-month days — muted, matching VanillaCalendar's vendor grey for
   prev-month cells. */
.bootstrap-datetimepicker-widget.dropdown-menu td.old {
  color: var(--muted-foreground);
}

/* Next-month days — render in the current-month colour so they read as a
   continuous extension of the current month, consistent with the KT
   VanillaCalendar styling above. Overrides the vendor stylesheet rule
   `.bootstrap-datetimepicker-widget table td.new { color: #777 }` (in
   theme/vendors/base/vendors.bundle.css). Mirrors the popup root's
   `color: var(--popover-foreground, var(--foreground))` so it matches
   current-month day cells exactly. */
.bootstrap-datetimepicker-widget.dropdown-menu td.new {
  color: var(--popover-foreground, var(--foreground));
}

/* Suppress the vendor `td.day:hover { background: #eee }` rule on the day
   grid only — the .active and .today rules below win on cascade because they
   come later with equal specificity. The hour/minute/second grid cells (shown
   when the user clicks the hour/minute label in the timepicker) get a real
   accent hover below; the plugin doesn't tag them with .today/.active so
   without an explicit hover they'd have no clickability feedback at all. */
.bootstrap-datetimepicker-widget.dropdown-menu td.day:hover {
  background-color: transparent;
}

/* Hour / minute / second grid hover — use accent bg (same token as the
   day-view's .today cell) so picking from the timepicker grids feels like
   part of the same component and matches QA1's grey #eee hover affordance. */
.bootstrap-datetimepicker-widget.dropdown-menu td.hour:hover,
.bootstrap-datetimepicker-widget.dropdown-menu td.minute:hover,
.bootstrap-datetimepicker-widget.dropdown-menu td.second:hover {
  background-color: var(--accent);
  color: var(--primary);
}

/* Selected day — match VanillaCalendar --vc-selected-bg / --vc-selected-text. */
.bootstrap-datetimepicker-widget.dropdown-menu td.active,
.bootstrap-datetimepicker-widget.dropdown-menu td.active:hover {
  background-color: var(--primary);
  color: var(--primary-foreground);
}

/* Today cell — match VanillaCalendar --vc-today-bg (accent) / --vc-today-text
   (primary). Prior version showed a primary-colored dot below the number which
   VC does not do. The :hover variant is needed because the reset above bumps
   `td.day:hover` specificity to (0,4,1) — same as `td.today` (0,3,1) only
   without :hover, so without an explicit :hover here the today cell would
   lose its accent bg when hovered. */
.bootstrap-datetimepicker-widget.dropdown-menu td.today,
.bootstrap-datetimepicker-widget.dropdown-menu td.today:hover {
  background-color: var(--accent);
  color: var(--primary);
}

.bootstrap-datetimepicker-widget.dropdown-menu td.today.active,
.bootstrap-datetimepicker-widget.dropdown-menu td.today.active:hover {
  background-color: var(--primary);
  color: var(--primary-foreground);
}

/* Timepicker panel */
.bootstrap-datetimepicker-widget.dropdown-menu .timepicker-picker table td {
  padding: calc(var(--spacing) * 1);
}

/* Increment / decrement hour/minute spinner buttons — match VanillaCalendar
   .vc-time-arrow tokens (height 1.25rem, muted-foreground color, 0.75rem
   chevron, hover goes to accent bg + foreground color). The prior 2rem×2rem
   buttons in foreground color looked visibly heavier than the VC spinner. */
.bootstrap-datetimepicker-widget.dropdown-menu .timepicker-picker td > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 1.25rem;
  padding: 0;
  border: 0;
  border-radius: calc(var(--radius, 0.5rem) - 2px);
  background-color: transparent;
  color: var(--muted-foreground);
  font-size: 0.75rem;
  line-height: 1;
  transition: background-color 0.15s ease, color 0.15s ease;
}

.bootstrap-datetimepicker-widget.dropdown-menu .timepicker-picker td > a:hover {
  color: var(--foreground);
  text-decoration: none;
}

.bootstrap-datetimepicker-widget.dropdown-menu .timepicker-picker td > a span {
  line-height: 1;
}

.bootstrap-datetimepicker-widget.dropdown-menu .timepicker-picker .separator {
  width: 0.5rem;
  font-weight: 600;
  color: var(--muted-foreground);
}

/* Hour / minute labels — match VanillaCalendar [data-vc-time-input=…] input
   tokens (font 1rem/600). */
.bootstrap-datetimepicker-widget.dropdown-menu .timepicker-picker .timepicker-hour,
.bootstrap-datetimepicker-widget.dropdown-menu .timepicker-picker .timepicker-minute,
.bootstrap-datetimepicker-widget.dropdown-menu .timepicker-picker .timepicker-second {
  display: inline-block;
  min-width: 2.25rem;
  padding: calc(var(--spacing) * 1) calc(var(--spacing) * 1.5);
  border-radius: calc(var(--radius, 0.5rem) - 2px);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1;
  color: var(--foreground);
  cursor: pointer;
}

/* AM/PM toggle — the plugin renders a <button> in the timepicker-picker table */
.bootstrap-datetimepicker-widget.dropdown-menu button[data-action="togglePeriod"] {
  width: 2.75rem;
  padding: calc(var(--spacing) * 1) 0;
  background: transparent;
  border: 1px solid var(--border);
  color: var(--foreground);
  border-radius: calc(var(--radius, 0.5rem) - 2px);
  font-size: 0.8125rem;
  line-height: 1;
  text-align: center;
  cursor: pointer;
}

/* Grid pickers shown when the user clicks the hour/minute/second label.
   Resting color mirrors the popup root's `var(--popover-foreground,
   var(--foreground))` so cells in this view match the day-view cells. */
.bootstrap-datetimepicker-widget.dropdown-menu .timepicker-hours td,
.bootstrap-datetimepicker-widget.dropdown-menu .timepicker-minutes td,
.bootstrap-datetimepicker-widget.dropdown-menu .timepicker-seconds td {
  padding: calc(var(--spacing) * 3.5) calc(var(--spacing) * 5);
  cursor: pointer;
  border-radius: calc(var(--radius, 0.5rem) - 2px);
  color: var(--popover-foreground, var(--foreground));
  font-size: 0.75rem;
  line-height: 1rem;
  transition: background-color 0.15s ease, color 0.15s ease;
}

/* Accordion toggle icon (between date + time panels) */
.bootstrap-datetimepicker-widget.dropdown-menu .accordion-toggle a,
.bootstrap-datetimepicker-widget.dropdown-menu a[data-action] {
  color: var(--foreground);
  text-decoration: none;
}

.bootstrap-datetimepicker-widget.dropdown-menu .accordion-toggle a:hover,
.bootstrap-datetimepicker-widget.dropdown-menu a[data-action]:hover {
  color: var(--primary);
  text-decoration: none;
}

.bootstrap-datetimepicker-widget.dropdown-menu .fa,
.bootstrap-datetimepicker-widget.dropdown-menu .glyphicon {
  line-height: 1;
}

/* Time-spinner / month-arrow icons are now rendered by KeenIcons via the
   layout's `icons:` map (ki-filled ki-up / ki-down / ki-left / ki-right) —
   see Views/Shared/metronic/_Layout.cshtml. The KI font is in the metronic9
   bundle, so no Unicode-chevron fallback is required for this widget.

   Size the glyphs down to match VanillaCalendar's spinner-arrow weight
   (height 1.25rem rows). Without these rules the icons inherit the default
   1rem KeenIcons size, which is too tall for the small spinner cell. */
.bootstrap-datetimepicker-widget.dropdown-menu .timepicker-picker .ki-up,
.bootstrap-datetimepicker-widget.dropdown-menu .timepicker-picker .ki-down {
  font-size: 0.875rem;
  line-height: 1;
}

.bootstrap-datetimepicker-widget.dropdown-menu th.prev .ki-left,
.bootstrap-datetimepicker-widget.dropdown-menu th.next .ki-right {
  font-size: 1rem;
  line-height: 1;
}

/* Dark-mode: deepen the box-shadow; the rest of the palette already adapts
   via the CSS custom properties. */
:is(.dark *) .bootstrap-datetimepicker-widget.dropdown-menu {
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.5), 0 4px 6px -2px rgba(0, 0, 0, 0.3);
}

/* jdewit/bootstrap-timepicker popup — the metronic9 bundle ships neither the
   legacy vendors.bundle.css that styles this widget nor the Glyphicons font
   that renders its up/down chevrons. Re-skin from scratch with KTUI tokens
   (so light/dark modes both work via the cascading custom properties) and
   inject Unicode chevrons as fallback content for the empty <span class=
   "glyphicon-chevron-…"> markers the plugin emits.
   Written as flat CSS (no &-nesting) because this file is concatenated into
   metronic9-bundle.css without sass compilation. */
.bootstrap-timepicker-widget.dropdown-menu {
  z-index: 1060;
  display: none;
  padding: calc(var(--spacing) * 2);
  background: var(--popover, var(--background));
  color: var(--popover-foreground, var(--foreground));
  border: 1px solid var(--border);
  border-radius: 0.75rem;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  font-size: 0.875rem;
  line-height: 1.25rem;
}

.bootstrap-timepicker-widget.dropdown-menu.open {
  display: inline-block;
}

/* Hide the vendor-emitted arrow caret triangles. */
.bootstrap-timepicker-widget.dropdown-menu:before,
.bootstrap-timepicker-widget.dropdown-menu:after {
  display: none;
}

.bootstrap-timepicker-widget.dropdown-menu table {
  width: 100%;
  margin: 0;
  border: 0;
  border-collapse: separate;
  border-spacing: 0;
  color: inherit;
}

.bootstrap-timepicker-widget.dropdown-menu table td {
  text-align: center;
  border: 0;
  padding: calc(var(--spacing) * 1);
  vertical-align: middle;
}

.bootstrap-timepicker-widget.dropdown-menu table td:not(.separator) {
  min-width: 2rem;
}

.bootstrap-timepicker-widget.dropdown-menu table td.separator {
  color: var(--muted-foreground);
  font-weight: 600;
}

/* Up / down chevron buttons (each wraps an empty <span class="glyphicon
   glyphicon-chevron-…"> — see .glyphicon-chevron-* fallback below). */
.bootstrap-timepicker-widget.dropdown-menu table td a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 1.5rem;
  margin: 0;
  padding: 0;
  border: 1px solid transparent;
  border-radius: calc(var(--radius, 0.5rem) - 2px);
  color: var(--foreground);
  text-decoration: none;
  outline: 0;
}

.bootstrap-timepicker-widget.dropdown-menu table td a:hover {
  background-color: color-mix(in oklab, var(--accent) 50%, transparent);
  border-color: var(--border);
  color: var(--foreground);
  text-decoration: none;
}

/* Glyphicons font isn't bundled in metronic9; render Unicode chevrons in
   place of the empty <span> markers so the up/down buttons are visible. */
.bootstrap-timepicker-widget.dropdown-menu .glyphicon-chevron-up:before {
  content: "\25B2"; /* ▲ */
  font-size: 0.625rem;
  line-height: 1;
}

.bootstrap-timepicker-widget.dropdown-menu .glyphicon-chevron-down:before {
  content: "\25BC"; /* ▼ */
  font-size: 0.625rem;
  line-height: 1;
}

/* Hour / minute / meridian inputs */
.bootstrap-timepicker-widget.dropdown-menu table td input {
  width: 2.5rem;
  margin: 0;
  padding: calc(var(--spacing) * 1) calc(var(--spacing) * 1.5);
  background: transparent;
  color: var(--foreground);
  border: 1px solid var(--border);
  border-radius: calc(var(--radius, 0.5rem) - 2px);
  font-size: 1rem;
  font-weight: 600;
  text-align: center;
}

.bootstrap-timepicker-widget.dropdown-menu table td input:focus {
  outline: 0;
  border-color: var(--primary);
}

/* Dark-mode: deepen the box-shadow; the rest of the palette already adapts
   via the CSS custom properties. */
:is(.dark *) .bootstrap-timepicker-widget.dropdown-menu {
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.5), 0 4px 6px -2px rgba(0, 0, 0, 0.3);
}

/* VanillaCalendar time picker (inside the KTDatePicker popover) — re-skin the
   vc-time section to match the already-customized .bootstrap-datetimepicker-widget:
   pill-style hour/minute inputs, bordered AM/PM toggle, no range sliders. */
.vc [data-vc=time] {
  border-color: var(--border);
  grid-template-columns: 1fr;
}

.vc [data-vc-time=ranges] {
  display: none;
}

.vc [data-vc-time=content] {
  justify-content: center;
  column-gap: calc(var(--spacing) * 1.5);
}

.vc [data-vc-time-input=hour],
.vc [data-vc-time-input=minute] {
  width: auto;
  margin: 0;

  /* Stack up-arrow / input / down-arrow vertically for a bootstrap-timepicker
     spinner look. Buttons are injected by timecard.vue.js::injectTimeArrows. */
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: calc(var(--spacing) * 0.5);
}

.vc [data-vc-time-input=hour] .vc-time-arrow,
.vc [data-vc-time-input=minute] .vc-time-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 1.25rem;
  padding: 0;
  border: 0;
  border-radius: calc(var(--radius, 0.5rem) - 2px);
  background-color: transparent;
  color: var(--muted-foreground);
  cursor: pointer;
  font-size: 0.75rem;
  line-height: 1;
}

.vc [data-vc-time-input=hour] .vc-time-arrow:hover:not(:disabled),
.vc [data-vc-time-input=minute] .vc-time-arrow:hover:not(:disabled) {
  background-color: color-mix(in oklab, var(--accent) 50%, transparent);
  color: var(--foreground);
}

.vc [data-vc-time-input=hour] input,
.vc [data-vc-time-input=minute] input {
  min-width: 2.25rem;
  padding: calc(var(--spacing) * 1) calc(var(--spacing) * 1.5);
  border-radius: calc(var(--radius, 0.5rem) - 2px);
  font-size: 1rem;
  font-weight: 600;
  color: var(--foreground);
  background-color: transparent;
}

.vc [data-vc-time-input=hour] input:hover:not(:disabled),
.vc [data-vc-time-input=minute] input:hover:not(:disabled),
.vc [data-vc-time-input=hour] input:focus-visible,
.vc [data-vc-time-input=minute] input:focus-visible {
  background-color: color-mix(in oklab, var(--accent) 50%, transparent);
  outline: none;
}

/* Reposition the ':' separator so it sits centered on the now-taller wrapper
   (up-arrow / input / down-arrow). Transform-based centering is reliable
   regardless of wrapper height; the vendored `margin-top: calc(-50% + 1px)`
   resolves against the wrapper's width (per spec), which breaks the offset
   once spinner arrows are added above/below the input. */
.vc [data-vc-time-input=hour]:after {
  right: calc(var(--spacing) * -1);
  margin-top: 0;
  transform: translateY(-50%);
  color: var(--muted-foreground);
  font-weight: 600;
}

/* AM/PM toggle — match the datetimepicker's togglePeriod pill. */
.vc [data-vc-time=keeping] {
  width: 2.75rem;
  margin-left: calc(var(--spacing) * 2);
  margin-top: 0;
  padding: calc(var(--spacing) * 1) 0;
  border: 1px solid var(--border);
  border-radius: calc(var(--radius, 0.5rem) - 2px);
  background-color: transparent;
  color: var(--foreground);
  font-size: 0.8125rem;
  line-height: 1;
}

.vc [data-vc-time=keeping]:hover:not(:disabled) {
  background-color: color-mix(in oklab, var(--accent) 50%, transparent);
}

/* Move the vc-time panel from below the date grid to the right of it, so the
   popover reads [ date grid | time ] instead of stacked. The calendar root
   ships as a column flex; reflow it into a 2-col grid with the header spanning
   the top and grid / time sitting side by side.

   Scoped to calendars that actually have a time panel via :has(). In date-only
   mode the override is skipped so the calendar keeps its default vertical
   flex layout (header on top of the date grid). */
.vc[data-vc=calendar]:has([data-vc=time]) {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto 1fr;
  column-gap: 1rem;
}

/* Default the input-anchored calendar popover beneath the fixed header
   (z-index 20) and nav (z-index 10) so page chrome stays on top while
   scrolling. */
.vc[data-vc=calendar][data-vc-input] {
  z-index: 5;
}

/* Inside a modal or drawer, lift the popover above the edit-punch sliding
   drawer (z-index 1002) and the modal backdrop (z-index 1040). Matches the
   explicit z-index used on the legacy .bootstrap-datetimepicker-widget
   override above so the two popovers share the same stacking layer.
   Two selectors cover the two DOM placements vanilla-calendar produces:
     1. Descendant — when the popover is mounted inside the input's
        parent chain (legacy `.modal`, `.kt-drawer`).
     2. Body :has() — when input-mode mounts the popover as a child of
        <body>, making it a sibling of `.kt-modal`, not a descendant.
        Without this, the kt-modal sits on top in the stacking order
        and the calendar renders behind it. The `.open` filter avoids
        lifting popovers on pages where a closed kt-modal happens to
        exist in the markup. */
:is(.modal, .kt-modal, .kt-drawer) .vc[data-vc=calendar][data-vc-input],
body:has(.kt-modal.open) .vc[data-vc=calendar][data-vc-input] {
  z-index: 1060;
}

/* Header sits above the wrapper in col 1 only, so its width matches the date
   grid beneath it (instead of stretching across to the time panel).
   Only applies when the parent is a 2-col grid (i.e. time panel present). */
.vc[data-vc=calendar]:has([data-vc=time]) [data-vc=header] {
  grid-column: 1;
}

.vc [data-vc=time] {
  grid-column: 2;
  grid-row: 1 / -1;
  max-width: 200px;

  /* Swap the top divider for a left one now that time sits to the right. */
  border-width: 0 0 0 1px;
  margin-top: 0;
  padding-top: 0;
  margin-left: 0;
  padding-left: 1rem;

  /* Switch to column-flex so the hour/minute/AM-PM row is vertically centered
     (and horizontally centered) within the full-height right panel. */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

/* Hide the inactive arrow so only the active (bright) arrow shows.
   asc  → up-arrow (::before) active, down-arrow (::after) hidden
   desc → down-arrow (::after) active, up-arrow (::before) hidden */
.kt-table-col.asc .kt-table-col-sort::after {
  opacity: 0;
}

.kt-table-col.desc .kt-table-col-sort::before {
  opacity: 0;
}

/* Generic column-hidden marker used by reportView.initColvis (and any other
   page that wants to hide a whole column without targeting page-specific
   class names). Toggling this class on every <th>/<td> in a column is the
   contract used by the bp-column-visibility-persist.js workflow. */
.bp-col-hidden {
  display: none !important;
}

/* Cap the column-visibility dropdown so reports with many dynamic columns
   (e.g. PTOSummary) stay scrollable instead of overflowing the viewport. */
.bp-colvis-menu {
  max-height: min(60vh, 400px);
  overflow-y: auto;
}

/* R11-2: the old dark-info background hack is gone — the kt-alert-light
   variant recipes below (end of file) own alert tinting in both themes. */

/* Dark-mode PIN dots: the un-entered dot used a mid-gray (#8c8c8f) that's
   too visible against the dark background, so it competed visually with
   the entered (#E4E4E7) dot and made it hard to tell which slots had
   been filled. Mirror the light-mode pattern (un-entered blends into the
   surface, entered stands out) by darkening the un-entered to zinc-700. */
:is(.dark *) .pin-field .pin-field__item.active:before {
  background: #E4E4E7;
}

:is(.dark *) .pin-field .pin-field__item:before {
  background: #3f3f46;
}

:is(.dark *) {
  .v-select {
    .vs__dropdown-toggle {
        background-color: var(--input);
        border-color: var(--border);
        color: var(--foreground);
    }
    .vs__selected,
    .vs__search,
    .vs__search:focus {
        color: var(--foreground);
    }
    .vs__open-indicator,
    .vs__clear {
        fill: var(--muted-foreground);
    }
    .vs__dropdown-menu {
        background-color: var(--popover);
        border-color: var(--border);
        color: var(--popover-foreground);
    }
    .vs__dropdown-option {
        color: var(--popover-foreground);
    }
    .vs__dropdown-option--highlight {
        background-color: var(--accent);
        color: var(--accent-foreground);
    }
    .vs__no-options {
        color: var(--muted-foreground);
    }
  }
}
.dark .swal2-popup {
  border: 1px solid var(--border) !important;
}
/* Right-align the action buttons inside the Calendar Sync swal modal.
   .swal2-actions defaults to justify-content: center; !important is used
   because SweetAlert2 wins by source order otherwise. */
.calendar-sync-modal .swal2-actions {
  justify-content: flex-end !important;
  padding: var(--swal2-html-container-padding);
  width: 100%;
}
/* When .kt-input is applied to the swal2 input via customClass.input,
   .kt-input sits inside @layer components, while .swal2-input is unlayered
   and wins regardless of specificity. Re-declare kt-input's key properties
   here (unlayered) so they take precedence. */
.swal2-container input.swal2-input.kt-input {
  display: block;
  border-style: solid;
  border-width: 1px;
  border-color: var(--input);
  background-color: var(--background);
  color: var(--foreground);
  height: calc(var(--spacing) * 8.5);
  border-radius: calc(var(--radius) - 2px);
  padding-inline: calc(var(--spacing) * 3);
  font-size: 0.8125rem;
  line-height: var(--text-sm--line-height);
  margin: 1rem 1.5rem 0;
  width: calc(100% - 3rem);
}
.swal2-container input.swal2-input.kt-input:focus {
  border-color: var(--input);
  box-shadow: none;
  outline: 0;
}

/* QuickBooks Desktop "Map Locations/Departments to" picker (SweetAlert
   input:'select'). A native <select> keeps its OS chrome on macOS WebKit —
   a rounded pill with the system arrow — which looks unstyled next to the
   themed inputs. Strip the native appearance and render it like a kt-select:
   rectangular border, themed colors, and a CSS chevron. Scoped to the
   qbd-maps-to-modal popup class set on these two Swal calls so it can't
   affect other SweetAlert selects elsewhere. */
.swal2-popup.qbd-maps-to-modal select.swal2-select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  display: block;
  width: calc(100% - 3rem);
  margin: 1rem 1.5rem 0;
  height: calc(var(--spacing) * 8.5);
  padding-inline-start: calc(var(--spacing) * 3);
  padding-inline-end: calc(var(--spacing) * 8);
  border: 1px solid var(--input);
  border-radius: calc(var(--radius) - 2px);
  background-color: var(--background);
  color: var(--foreground);
  font-size: 0.8125rem;
  line-height: var(--text-sm--line-height);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%239ca3af' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right calc(var(--spacing) * 3) center;
  background-size: 0.85rem;
}
.swal2-popup.qbd-maps-to-modal select.swal2-select:focus {
  border-color: var(--input);
  box-shadow: none;
  outline: 0;
}

/* Tailwind text-* utilities live in @layer utilities and lose to unlayered
   .swal2-title / .swal2-html-container. Override unlayered here so font-size
   wins when the corresponding customClass is applied. */
.swal2-container .swal2-title.text-lg {
  font-size: 1.125rem;
  line-height: 1.75rem;
}
.swal2-container .swal2-html-container.text-sm {
  font-size: 0.875rem;
  line-height: 1.25rem;
}



/* GPS Settings page — render the per-row radio choices as button-like pills
   (Off / Optional / Required, Off / On). Mimics master-branch UX while keeping
   real <input type="radio"> for native form posting and the existing Select-All
   wiring.
   NOTE: rules are NOT nested under .gps-settings-page so they apply regardless
   of when the body class is added by JS, and !important is used on the input-
   hiding rules to defeat the theme's native radio appearance. */
   .gps-radio-btn {
    display: inline-flex !important;
    align-items: center;
    cursor: pointer;
    padding: 0 !important;
    margin: 0 !important;
    position: relative;
    user-select: none;

    /* Visually hide the radio input (kept accessible for forms / screen readers) */
    > input[type="radio"] {
        position: absolute !important;
        opacity: 0 !important;
        width: 1px !important;
        height: 1px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        pointer-events: none !important;
        appearance: none !important;
        -webkit-appearance: none !important;
        -moz-appearance: none !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    > span {
        display: inline-block;
        padding: 8px 14px;
        min-width: 70px;
        color: var(--foreground, #2d2d2d);
        font-size: 14px;
        line-height: 1;
        text-align: center;
        white-space: nowrap;
        border-radius: 4px;
        background: transparent;
        transition: background-color 0.15s ease, color 0.15s ease;
    }

    &:hover > span {
        color: var(--primary, #1371c4);
        background: var(--accent, #e3e7fa);
    }

    > input[type="radio"]:checked ~ span,
    &:hover > input[type="radio"]:checked ~ span {
        color: var(--primary-foreground, #ffffff);
        background: var(--primary, #1371c4);
    }

    > input[type="radio"]:disabled ~ span {
        opacity: 0.5;
        cursor: not-allowed;
    }
}

/* Center each cell's button on the GPS settings page */
.gps-settings-page #employees_table tbody td.col-punches,
.gps-settings-page #employees_table tbody td.col-during-shifts,
.gps-settings-page #employees_table tbody td.col-auto-punch-out {
    text-align: center;
}


/* GroupPunch Step 3 — when the per-employee column table overflows horizontally
   at narrow widths, the browser default scrollbar is near-invisible against
   the dark card surface. Mirror the .kt-select-dropdown dark-mode scrollbar
   pattern above. Class-scoped so this only applies to the .group-punch-table-scroll
   wrapper on the GroupPunch view. */
.dark .group-punch-table-scroll ::-webkit-scrollbar-thumb {
    background: color-mix(in oklab, var(--foreground) 25%, var(--card, #1c1c1e));
}

@-moz-document url-prefix() {
    .dark .group-punch-table-scroll {
        scrollbar-color: color-mix(in oklab, var(--foreground) 25%, var(--card, #1c1c1e)) transparent;
    }
}

.popover {
    z-index: 25;
}


@media (max-width: 1200px) {
  .table--group-punch .thead-col.flex  {
    flex-wrap: wrap;
    .apply-btn {
      width: 100%;
      max-width: 170px;
    }
  }
}

.group-punch-view .group-punch__filter {
  width: 100%;
  max-width: 200px;
}

.group-punch-view select.kt-select.text-muted-foreground option {
  color: var(--foreground);
}

/* Truncate long Location/Department/Position values in Step 3 dropdowns
   (both per-row and the Apply-to-all header row) instead of wrapping to
   multiple lines and overflowing the cell. text-wrap is set explicitly
   because a later global `.kt-select-option-text { text-wrap: auto }`
   would otherwise override the wrap-aspect of `white-space: nowrap`. */
.group-punch-view .table--group-punch .kt-select-display .kt-select-option-text {
  white-space: nowrap;
  text-wrap: nowrap;
  min-width: 0;
}

/* Grouped Location/Department dropdown: hide the empty-value placeholder
   row in the open menu. */
.kt-select-wrapper.bp-grouped-select [data-kt-select-option][data-value=""] {
  display: none;
}

/* Skip layout/paint of offscreen dropdown rows in the grouped
   Location/Department pickers. KTSelect renders EVERY option as an <li> up
   front, so a large grouped list (AB#14083 account: 14,400 options) made
   each dropdown open block the main thread laying out thousands of rows
   that sit far outside the 250px scroll box — ~800ms per open on desktop,
   several seconds on kiosk tablets. content-visibility:auto lets the
   browser lay out only the rows near the scrollport and skip the rest
   until scrolled to (measured in real Chrome at 14,500 options: open drops
   ~750ms -> ~250ms; proportionally smaller lists get proportionally
   faster).
   contain-intrinsic-size is the skipped rows' CONTENT-BOX placeholder for
   BOTH axes: 250px inline x 20px block. The rows render 34px tall
   border-box with 7px vertical padding (uniform for headers and children),
   and padding is added ON TOP of the intrinsic placeholder — so 20px
   content + 14px padding reproduces the rendered 34px exactly and skipped
   rows contribute correct scrollbar geometry (34px here would inflate
   every skipped row to 48px and drift the scrollbar). The 250px inline
   placeholder matters because .kt-select-dropdown is width:max-content —
   skipped rows must not report a tiny intrinsic width or the dropdown
   would resize as long labels render in/out during scroll; 250px stays
   below the trigger-width min-width floor these full-width pickers get
   from kt-select-fix.js, so it never drives the dropdown wider on its
   own. Fixed estimates are used deliberately instead of the `auto`
   keyword — per-row remembered-size bookkeeping buys nothing for uniform
   rows.
   Opt-in scoped rather than every kt-select — small dropdowns don't need
   it, and this keeps their sizing byte-for-byte unchanged. Two ways in:
   - bp-grouped-select pickers (Location/Department): their dropdown stays
     inside the wrapper, so the wrapper-descendant selector matches.
   - Selects that portal their dropdown to <body> via the
     dropdownContainer config (Add/Edit Time Entries location/department/
     position pickers, 12k+ options on large accounts) can't be reached
     through the wrapper; they opt in with "dropdownClass": "bp-cv-rows"
     in data-kt-select-config, which KTSelect stamps onto the dropdown
     element itself.
   Browsers without support (pre-2024 Firefox/Safari) ignore the
   declaration and keep today's behavior. Rows filtered out by search get
   display:none via KTSelect's `hidden` class, which wins regardless. */
.kt-select-wrapper.bp-grouped-select .kt-select-dropdown [data-kt-select-option],
.kt-select-dropdown.bp-cv-rows [data-kt-select-option] {
  content-visibility: auto;
  contain-intrinsic-size: 250px 20px;
}

/* Grouped Location/Department dropdown: indent the department options that
   follow a (disabled) location header so departments read as nested under
   their location. Indenting in CSS rather than with leading spaces in the
   option text keeps the .cshtml output pure-ASCII (the Razor views are not
   served as UTF-8, so a non-breaking-space prefix mojibakes) and survives
   KTSelect trimming leading whitespace off the option label. Unlike
   .bp-optgroup-select this does NOT bold / un-dim the header, so the Add
   Punch modal and Edit Punch drawer share one common dimmed-header style.
   The sibling combinator only pushes options that FOLLOW a header, so
   standalone locations emitted before any header stay at the location
   level instead of looking like a department nested under it. */
.kt-select-wrapper.bp-grouped-select [data-kt-select-option][aria-disabled="true"] ~ [data-kt-select-option]:not([aria-disabled="true"]) {
  padding-left: calc(var(--spacing) * 5);
}

/* While setButtonToWait() (timecard.page.js) shows the loading spinner on a
   break-delete button, it prepends the .ki-loading spinner BEFORE the existing
   trash icon. These buttons are icon-only, so two icons stretch the button into
   a wide pill and the spinner/trash look misaligned. For the duration of the
   wait, hide the now-redundant trash icon and clear the spinner's prepend
   margin (mr-2) so the lone spinner centers like a normal single-icon button.
   Scoped to ONLY the break-delete links (.deleteBreakLink /
   .deleteAutomaticBreakLink) so every other setButtonToWait() button — incl.
   text buttons like Approve/Save — is left unchanged. */
.deleteBreakLink > .ki-loading ~ .ki-trash,
.deleteAutomaticBreakLink > .ki-loading ~ .ki-trash {
  display: none;
}
.deleteBreakLink > .ki-loading,
.deleteAutomaticBreakLink > .ki-loading {
  margin: 0;
}

/* Grouped Location/Department dropdown trigger: when the selected value
   reads "{Location} / {Department}" the combined string can be longer
   than the trigger and wraps onto two lines. KTSelect's default trigger
   has no allowance for that wrap — line 1 runs flush to the chevron and
   line 2 sits flush to the bottom edge, looking cramped. Allow vertical
   growth, give the text some breathing room at top/bottom, and reserve
   horizontal space for the chevron on the right. */
.kt-select-wrapper.bp-grouped-select .kt-select-display {
  height: auto;
  min-height: 34px;
  padding-block: 0.375rem;
}
.kt-select-wrapper.bp-grouped-select .kt-select-display .kt-select-option-text {
  white-space: normal;
  line-height: 1.3;
  padding-right: 0.5rem;
}

/* Flattened-<optgroup> kt-selects. KTSelect ignores native <optgroup>, so views
   that need grouped options emit each group as a disabled <option> header with its
   real options following (Views/AlertRule/_Form.cshtml -> "Alerts"/"Reminders";
   Views/Account/OverTimeSettings.cshtml -> "Most Common"/"Custom"). Restore the
   optgroup look: the disabled headers read as bold, full-opacity, non-interactive
   labels and the real options are indented beneath them. Opt a field in by adding
   .bp-optgroup-select to the container that wraps the <select> (an ancestor of the
   kt-select wrapper + dropdown) so genuinely-disabled options in other kt-selects
   keep their default dimmed appearance. !important on opacity overrides KTSelect's
   disabled-option dimming. The indent uses a sibling combinator so only options
   that FOLLOW a header get pushed over: a non-header option is a group child iff
   a disabled header precedes it among the option <li>s. This (a) leaves the indent
   off entirely when no header is present (OverTimeSettings only emits headers when
   the overtime types are grouped) and (b) keeps directly-selectable options that
   are emitted BEFORE any header at the top indent level — e.g. the punch-edit
   Location/Department dropdown lists locations that have no departments ahead of
   the grouped locations so they read as locations, not as a department nested
   under the location above (AB#13387, review #38). */
.bp-optgroup-select [data-kt-select-option][aria-disabled="true"] {
  opacity: 1 !important;
  font-weight: 700;
  pointer-events: none;
}
.bp-optgroup-select [data-kt-select-dropdown] [data-kt-select-option][aria-disabled="true"] ~ [data-kt-select-option]:not([aria-disabled="true"]) {
  padding-left: calc(var(--spacing) * 5);
}

/* Time Off Calendar filter dropdowns: pin the trigger to its min width so a
   long single selection or several stacked multi-selections clip with
   ellipsis instead of stretching the trigger (and pushing the toolbar). */
.pto-calendar-wrap .employees-select .kt-select-wrapper,
.pto-calendar-wrap .statuses-select .kt-select-wrapper {
  width: 200px;
  max-width: 200px;
}
.pto-calendar-wrap .employees-select .kt-select-display .kt-select-option-text,
.pto-calendar-wrap .statuses-select .kt-select-display .kt-select-option-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}

/* Lock the OPEN options menu to the same 200px width as the trigger so a
   single long option name doesn't widen the menu past the trigger (the
   global .kt-select-dropdown rule defaults to width:max-content with a
   ~512px cap). Each option clips with ellipsis instead of growing the
   menu. */
.pto-calendar-wrap .employees-select .kt-select-dropdown,
.pto-calendar-wrap .statuses-select .kt-select-dropdown {
  width: 200px !important;
  max-width: 200px !important;
}
.pto-calendar-wrap .employees-select .kt-select-dropdown .kt-select-option-text,
.pto-calendar-wrap .statuses-select .kt-select-dropdown .kt-select-option-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-break: normal;
  overflow-wrap: normal;
}

/* Add Time Off page — same multi-select widening pattern as the
   Time Off Calendar filters. The Employees dropdown sits next to the
   "Switch to date ranges" button; without a cap it grows to fit names
   and pushes the button (or wraps names onto multiple lines). The
   wrapper has `min-w-[300px]` from inline classes — match that as the
   ceiling so the trigger stays a fixed 300px wide and the comma-joined
   names clip with ellipsis. */
.add-pto-page .employees-select .kt-select-wrapper {
  width: 300px;
  max-width: 300px;
}
.add-pto-page .employees-select .kt-select-display .kt-select-option-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}

/* Time Off Calendar — Day Grid (month view).
   FullCalendar v3 with height:'auto' (the default) caps the .fc-scroller
   height when the visible viewport can't fit the natural calendar height
   + page chrome, which surfaces an inner vertical scrollbar AND reserves
   space at the right of the Saturday header for that scrollbar (the
   empty white sliver). QA1 doesn't have this — the calendar lets the
   page scroll naturally instead. Unset the FC-computed height + reveal
   overflow so the day grid flows into the page document and only the
   page scrollbar exists. The list-view rule below overrides this — list
   views NEED the scroller to scroll internally so the card-header and
   FC toolbar stay pinned. */
.pto-calendar-wrap .fc-scroller {
  height: auto !important;
  overflow: visible !important;
}

/* Time Off Calendar — List view (listYear / listMonth / etc.).
   In list view the year's events expand to ~7000+px of natural height,
   so without a constrained scroller the page document scrolls and
   pushes the card-header (Approve / Deny / Add Time Off) and the FC
   toolbar (Today / prev-next / Month-List) off-screen. The user has to
   scroll back to the top to act on a checked row. Cap the scroller to
   the available viewport height and let it scroll internally so those
   toolbars stay pinned.

   403px = ~107px (fixed top nav placeholder) + 56px (card-header) +
   32px (FC toolbar) + 80px (layout pb-[5rem]) + 24px (footer) + a
   little inner card padding. Matches Schedule's per-view calc(100vh - N)
   pattern (see metronic9/schedule.scss).

   Applies to both .pto-calendar-wrap (PTOCalendar) and .pto-summary-wrap
   (EmployeePTOSummary). The EmployeePTOSummary page has an extra PTO bank
   balance table above the calendar that scrolls with the page; once the
   user scrolls past it the calendar list behaves the same as on
   PTOCalendar — toolbars pinned, list scrolls internally. */
.pto-calendar-wrap .fc-view.fc-list-view .fc-scroller {
  height: calc(100vh - 403px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  min-height: 200px;
}

/* When the user clicks the toggle-header chevron in the FC toolbar, the
   ptocalendar.js handler adds .main-header-hidden to .header-wrap, which
   collapses the ~107px main-header + nav-bar to height 0. Reclaim that
   space so the list scroller grows to fill the viewport rather than
   leaving dead space below the list. */
.header-wrap.main-header-hidden ~ .container-fixed .pto-calendar-wrap .fc-view.fc-list-view .fc-scroller {
  height: calc(100vh - 296px) !important;
}

/* Issue 16 — Step 3 condensed-view reflow. Below 1180px the row cells need to
   stop enforcing their min-widths and the per-column kt-selects need to be
   allowed to shrink — otherwise the wrapper overflows and the page exposes a
   horizontal scrollbar that QA1 doesn't have. */
@media (max-width: 1180px) {
  .group-punch-view .table--group-punch td {
    min-width: 0;
  }
  .group-punch-view .table--group-punch .kt-select.w-\[170px\] {
    width: 100% !important;
    max-width: 170px;
  }
  .group-punch-view .table--group-punch .kt-select.w-\[220px\] {
    width: 100% !important;
    max-width: 220px;
  }
  .group-punch-view .table--group-punch .shift-col {
    max-width: none;
  }
}

/* Trade / Cover request modal — shift summary block + step-2 list rows.
   The legacy custom.scss styles for these classes were scoped under the
   old `.trade-cover-request-modal` Bootstrap wrapper, which the Metronic
   9 markup no longer carries (the modal now uses kt-modal at
   #tradeRequestModal). Re-declared here using KTUI design tokens so
   light / dark themes both work via the cascading custom properties.
   Written as flat CSS (no &-nesting) because this file is concatenated
   into metronic9-bundle.css without sass compilation — see gulpfile
   pack-metronic9-css. */

/* Reason textarea — kt-textarea ships full Metronic 9 styling (border,
   background, focus ring, placeholder), but `metronic9/helpers.css`
   strips its padding to 0 and sets line-height: 2.462 for a single-line
   autocomplete look that doesn't fit a multi-line input. Restore proper
   padding + line-height + min-height for the trade / cover reason field.
   Specificity (1,1,1) beats helpers.css's (0,1,0) even though helpers.css
   is concatenated later in metronic9-bundle.css. */
#tradeRequestModal textarea.kt-textarea {
  padding: 0.75rem;
  line-height: 1.5;
  min-height: 10rem;
  resize: vertical;
}

/* Outer "card" framing the date + colored shift chip. The legacy hex
   border is replaced with the Metronic 9 `--border` token; the inner
   shift-event keeps its user-color background. */
#tradeRequestModal .shift-info-block {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.625rem;
  width: 14.375rem;
  padding: 0.625rem;
  border: 1px solid var(--border);
  border-radius: var(--radius, 0.5rem);
}

#tradeRequestModal .shift-date {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--foreground);
}

/* Colored shift chip. Background is set inline by Vue (`activeShiftColor`)
   so the user's chosen shift color is preserved — text is forced white
   and the hours-count badge is white-on-primary so the chip stays
   legible across any chosen color. */
#tradeRequestModal .shift-event {
  flex: 1;
  min-width: 8.4375rem;
  min-height: 2.625rem;
  padding: 0.375rem;
  border-radius: calc(var(--radius, 0.5rem) - 2px);
  color: #fff;
}

#tradeRequestModal .shift-event__main {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.375rem;
  white-space: nowrap;
}

#tradeRequestModal .shift-event__addition {
  margin-top: 0.125rem;
  font-size: 0.75rem;
  color: #fff;
}

#tradeRequestModal .shift-event .shift-event-period {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 0.75rem;
}

#tradeRequestModal .shift-event .shift-event-hours-count {
  flex: 0 0 auto;
  margin-left: 0.375rem;
  padding: 0 0.3125rem;
  border: 0;
  border-radius: 0.625rem;
  background-color: #fff;
  color: var(--primary);
  font-size: 0.75rem;
  font-weight: 700;
}

/* Step 2 scroll area + group titles. Uses muted-foreground for the
   section headers so they sit visually behind the actual rows. */
#tradeRequestModal .shifts-list-holder {
  max-height: 14.375rem;
  overflow-y: auto;
}

#tradeRequestModal .shifts-list {
  margin-bottom: 1.5625rem;
}

#tradeRequestModal .shifts-list:last-child {
  margin-bottom: 0;
}

#tradeRequestModal .shifts-list__title {
  margin-bottom: 0.625rem;
  font-weight: 600;
  color: var(--muted-foreground);
}

#tradeRequestModal .shift-items-group {
  margin-bottom: 1.25rem;
}

#tradeRequestModal .shift-items-group:last-child {
  margin-bottom: 0;
}

#tradeRequestModal .shift-items-group__title {
  display: block;
  margin-bottom: 0.3125rem;
  font-weight: 600;
  color: var(--muted-foreground);
}

/* Individual selectable row in the step-2 picker. 75ms accent fade
   mirrors the bootstrap-datetimepicker / kt-select hover treatment so
   interactive elements across the project share a hover language. */
#tradeRequestModal .shift-item {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  margin-bottom: 0.625rem;
  padding: 0.375rem 0.5rem;
  border-radius: calc(var(--radius, 0.5rem) - 2px);
  transition: background-color 75ms cubic-bezier(0.4, 0, 0.2, 1);
}

#tradeRequestModal .shift-item:last-child {
  margin-bottom: 0;
}

#tradeRequestModal .shift-item:hover {
  background-color: var(--accent);
}

#tradeRequestModal .shift-item__control {
  display: flex;
  align-items: center;
}

#tradeRequestModal .shift-item__img {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
}

#tradeRequestModal .shift-item__img img.profile-mini-picture {
  flex: 0 0 auto;
  width: 1.875rem;
  min-width: 1.875rem;
  height: 1.875rem;
  border-radius: 9999px;
  object-fit: cover;
}

/* Default avatar (new_employee_face2.jpg) — flat black silhouette on a
   white circular background. In dark mode the white circle reads as a
   bright disc clashing with the dark page (QA round 4, item 21 —
   "Default profile-picture icon not styled for dark mode"). Invert
   colours when the image src points to this placeholder; the file is
   served from two locations (Azure blob storage for live data and
   /dist/images/ for fallback) so use a substring match. Photographic
   profile pictures keep their natural colours since they don't match
   this src pattern. */
.dark img[src*="new_employee_face2"] {
  /* W23: plain invert(1) turns the light-gray silhouette near-black, which
     vanishes on the oklch(18%) elevation-ladder cards. brightness(1.75)
     lifts the figure back to a clearly-visible mid-gray while the inverted
     white disc stays black. */
  filter: invert(1) brightness(1.75);
}

#tradeRequestModal .shift-item__info {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  font-size: 0.75rem;
  line-height: 1rem;
}

#tradeRequestModal .shift-item__info-details {
  font-weight: 600;
  color: var(--foreground);
}

#tradeRequestModal .shift-item__info-member-name {
  font-weight: 600;
  color: var(--muted-foreground);
}

/* "No shifts" / "No employees" placeholder. */
#tradeRequestModal .empty-list {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 14rem;
  color: var(--muted-foreground);
}

#tradeRequestModal .empty-list__text {
  font-size: 1rem;
}

/* Select All / Select None pseudo-link controls above the step-2 list. */
#tradeRequestModal .select-all-control {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--primary);
  cursor: pointer;
}

#tradeRequestModal .select-all-control:hover {
  text-decoration: underline;
}

/* Step 3 confirmation summary. */
#tradeRequestModal .final-step-info-text {
  display: block;
  margin-bottom: 1.875rem;
  font-weight: 600;
  text-align: center;
  color: var(--foreground);
}

#tradeRequestModal .final-step-info-block {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 25rem;
  max-height: 20.625rem;
  margin: 0 auto;
  padding: 1.25rem;
  border: 1px solid var(--border);
  border-radius: var(--radius, 0.5rem);
  overflow-y: auto;
}

/* Inside the step-3 summary card the outer block already provides a
   border — strip the inner shift-info-block border so the two
   framings don't double up. */
#tradeRequestModal .final-step-info-block .shift-info-block {
  border-color: transparent;
}

#tradeRequestModal .final-step-info-block__title {
  font-weight: 600;
  color: var(--foreground);
}
.kt-select-dropdown.open .kt-select-option-text {
  text-wrap: auto;
}
.grecaptcha-badge {
  opacity: 0;
}

.pb-32 {
  padding-bottom: calc(var(--spacing) * 32);
}
.pb-8 {
  padding-bottom: calc(var(--spacing) * 8);
}
.pt-8 {
  padding-top: calc(var(--spacing) * 8);
}



select[name="perpage"] + [data-kt-select-wrapper] .kt-select-display.kt-select {
  background-color: var(--accent) !important;
}

select[name="perpage"] + [data-kt-select-wrapper] .kt-select-display.kt-select .kt-select-arrow svg {
  color: var(--muted-foreground) !important;
}

/* KTUI's base .kt-modal has no z-index, so a popper-positioned .kt-menu-dropdown
   (left open when the user opens Send Message from the nav) ends up stacking
   above it. Pin the modal + backdrop to the same scale as the in-modal popups
   already use (1060) and the drawer (1002): backdrop 1040, modal 1050. */
.kt-modal-backdrop {
  z-index: 107 !important;
}
.kt-modal.open {
  z-index: 108 !important;
}

html:not(.dark){
  .kt-menu-dropdown .kt-menu-item .kt-menu-link:hover {
    background-color: #FCFCFC !important;
    border-color: #E4E4E7;
  }
  .kt-menu-dropdown .kt-menu-item .kt-menu-link.hover\:\!bg-transparent:hover,
  .hover\:\!bg-transparent:hover {
    background-color: transparent !important;
  }

  .hover\:\!border-none:hover {
    border: none !important;
  }
}

html.dark{
  .kt-menu-dropdown .kt-menu-item .kt-menu-link {
      border-width: 0;
  }

  .hover\:\!bg-transparent:hover {
    background-color: transparent !important;
  }

  .hover\:\!border-none:hover {
    border: none !important;
  }
}

.kt-menu-link.cursor-default {
  cursor: default;
}

#jumpToDatePicker {
  width: 0;
}

.vc-months button:focus-visible  {
  outline-color: transparent !important;
}


#toast-container > div {
  opacity: 1 !important;
}

.addon-card:hover {
  .kt-btn-outline {
      background-color: var(--accent);
  }
  .remove-addon-btn {
    text-decoration: underline;
  }
}

.view-plan-page .included-plan,
.view-plan-page .added {
  cursor: default;
}
.schedule-status-col {
  .schedule-status-label {
    margin-left: -8px;
    margin-right: -8px;
    width: calc(100% + 16px);
  }
}

/* iOS-style segmented control — muted track, white pill on the active
   option, inactive flush in the track. Used by the "Punched In" list/map
   switcher on Home/Index.cshtml and the Schedule / Availability page
   switcher on Schedule/Index.cshtml, Schedule/Availability.cshtml, and
   Schedule/_NoActiveEmployees.cshtml.

   --bp-view-toggle-pad sets the inner padding; the active button's radius
   is the outer 12px minus that pad so it sits cleanly inside the track.
   Inactive uses a smaller radius for the "winged corners" contrast — the
   active pill reads as a floating chip, inactive remains squared-into
   the track. */
.bp-view-toggle {
  --bp-view-toggle-pad: 4px;
  display: inline-flex;
  align-items: center;
  gap: 0;
  padding: var(--bp-view-toggle-pad);
  background-color: var(--muted);
  border-radius: 12px;
  line-height: 1;
}

.bp-view-toggle__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 32px;
  padding: 0 12px;
  background-color: transparent;
  border: 0;
  border-radius: 4px;        /* "winged" — squared-ish inactive */
  color: var(--muted-foreground);
  font-size: 0.75rem;        /* text-xs */
  font-weight: 500;          /* font-medium */
  text-decoration: none;     /* anchor variants used by the Schedule switcher */
  cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.bp-view-toggle__btn:hover {
  color: var(--foreground);
  text-decoration: none;
}

.bp-view-toggle__btn:focus-visible {
  outline: 2px solid var(--ring, var(--primary));
  outline-offset: 2px;
}

.bp-view-toggle__btn.active {
  background-color: var(--card);  /* white in light, elevated card in dark */
  color: var(--foreground);
  border-radius: 8px;             /* fully rounded "pill" */
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 1px 1px rgba(0, 0, 0, 0.04);
}

.bp-view-toggle__btn i {
  color: inherit;
}

html.dark img[src$="/facial_recognition_login.png"] {
  filter: invert(1) brightness(1);
}

.time-entries-table .kt-textarea {
  height: calc(var(--spacing) * 8.5);
  min-height: calc(var(--spacing) * 8.5);
  padding-block: calc(var(--spacing) * 1.5);
}

/* Kiosk / AutoPunch confirmation pages — port of the legacy
   .punch-info / .punch-time-info rules (custom.scss → app-bundle.css)
   that the metronic9 _PublicLayout doesn't load. The border tracks the
   Metronic theme token so the inner box doesn't render brighter than the
   outer kt-card in dark mode. */
.punch-confirmation-page .punch-info {
  display: flex;
  flex-direction: column;
  font-size: 13px;
  padding: 20px 30px;
  text-align: left;
  border: 1px solid var(--border);
  border-radius: 6px;
}

.punch-confirmation-page .punch-time-info {
  font-size: 14px;
  font-weight: 600;
  color: #1271c4;
}

/* The Time Card readout is not interactive, so the global hover tint
   that ships with [data-kt-datatable-table] (tailwind.styles.css ~L10244,
   background-color: color-mix(var(--muted)...)) just creates visual
   noise as the cursor sweeps across rows. Disable it specifically on
   the timecard-table. */
.timecard-table[data-kt-datatable-table] tr:hover {
  background-color: transparent !important;
}

/* Punch page — Shift dropdown row.
   Migrated from src/scss/custom.scss (`.shift-select-block` → select2)
   and adapted to kt-select. The shift trigger sits inline beside the
   "Shift:" label and shouldn't read as a separate form field, so the
   visible border + background are stripped and the wrapper shrinks to
   its content (with a small right-side gutter for the chevron). */
.shift-select-block .kt-select-wrapper {
  width: auto !important;
  padding-right: 20px;
}
.shift-select-block .kt-select-display {
  background: none;
  border: none;
  box-shadow: none;
}
/* Chevron — KTSelect's default display template doesn't inject an
   arrow (the .kt-select-arrow rules in the bundle only style one
   when a custom template adds it). Render a lucide-style chevron-down
   via a mask so it inherits the surrounding text color and stays in
   sync with light/dark mode. */
.shift-select-block .kt-select-display::after {
  content: "";
  display: inline-block;
  width: 1rem;
  height: 1rem;
  margin-inline-start: 0.25rem;
  flex-shrink: 0;
  background-color: var(--muted-foreground);
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
}
/* Suppress the open / focused-state ring + border change. KTSelect adds
   .active to the display when the dropdown opens and the element also
   matches :focus-visible, so the base .kt-select:focus-visible rule
   (metronic9-bundle.css ~L11431: border-color: var(--ring), 3px
   --tw-ring-shadow) lights up. With the trigger blended into the
   inline row, the ring reads as misplaced focus on adjacent content. */
.shift-select-block .kt-select-display.active,
.shift-select-block .kt-select-display:focus-visible {
  border-color: transparent;
  box-shadow: none;
  --tw-ring-shadow: 0 0 transparent;
}
/* Cap the OPEN options panel at 280px. The global .kt-select-dropdown rule
   defaults to width:max-content (capped ~512px), so a shift label that carries
   a location/department or a long time range widens the menu well past the
   trigger. Lock it to 280px and clip each option with ellipsis instead of
   growing the menu — same pattern as the PTO calendar / Add Time Off selects
   above. !important + the extra .shift-select-block specificity beats the base
   `width: max-content !important`. */
.shift-select-block .kt-select-dropdown {
  width: 280px !important;
  max-width: 280px !important;
}
.shift-select-block .kt-select-dropdown .kt-select-option-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-break: normal;
  overflow-wrap: normal;
}

/* QuickBooks Match Employees: DataTables renders the search box directly above
   the table with no gap. Add breathing room below the search control. */
#match_table_wrapper .dataTables_filter {
  margin-bottom: 1rem;
}

/* Flattened-<optgroup> kt-selects. KTSelect ignores native <optgroup>, so views
   that need grouped options emit each group as a disabled <option> header with its
   real options following (Views/AlertRule/_Form.cshtml -> "Alerts"/"Reminders";
   Views/Account/OverTimeSettings.cshtml -> "Most Common"/"Custom"). Restore the
   optgroup look: the disabled headers read as bold, full-opacity, non-interactive
   labels and the real options are indented beneath them. Opt a field in by adding
   .bp-optgroup-select to the container that wraps the <select> (an ancestor of the
   kt-select wrapper + dropdown) so genuinely-disabled options in other kt-selects
   keep their default dimmed appearance. !important on opacity overrides KTSelect's
   disabled-option dimming. The indent uses a sibling combinator so only options
   that FOLLOW a header get pushed over: a non-header option is a group child iff
   a disabled header precedes it among the option <li>s. This (a) leaves the indent
   off entirely when no header is present (OverTimeSettings only emits headers when
   the overtime types are grouped) and (b) keeps directly-selectable options that
   are emitted BEFORE any header at the top indent level — e.g. the punch-edit
   Location/Department dropdown lists locations that have no departments ahead of
   the grouped locations so they read as locations, not as a department nested
   under the location above (AB#13387, review #38). */
.bp-optgroup-select [data-kt-select-option][aria-disabled="true"] {
  opacity: 1 !important;
  font-weight: 700;
  pointer-events: none;
}
.bp-optgroup-select [data-kt-select-dropdown] [data-kt-select-option][aria-disabled="true"] ~ [data-kt-select-option]:not([aria-disabled="true"]) {
  padding-left: calc(var(--spacing) * 5);
}

/* ============================================================================
   Round 11 work order (bp-restyle-workorder)
   ============================================================================ */

/* R11-1: calendar grids paint the card surface (light: white like prod; dark: no visible change) */
#schedule_calendar .fc-view-container,
#m_calendar .fc-view-container {
  background-color: var(--card);
}

/* R11-2: kt-alert-light tint recipes — opaque against the surface, both themes */
html:not(.dark) .kt-alert-light.kt-alert-primary { background-color: color-mix(in oklab, var(--primary) 10%, var(--card)); border-color: color-mix(in oklab, var(--primary) 35%, var(--card)); color: var(--foreground); }
html:not(.dark) .kt-alert-light.kt-alert-primary .kt-alert-icon > i, html:not(.dark) .kt-alert-light.kt-alert-primary .kt-alert-icon > svg { color: var(--primary); }
.dark .kt-alert-light.kt-alert-primary { background-color: oklch(0.25 0.06 259.815); border-color: oklch(0.37 0.1 259.815); color: var(--foreground); }
.dark .kt-alert-light.kt-alert-primary .kt-alert-icon > i, .dark .kt-alert-light.kt-alert-primary .kt-alert-icon > svg { color: oklch(0.75 0.12 259.815); }

html:not(.dark) .kt-alert-light.kt-alert-success { background-color: color-mix(in oklab, var(--color-green-500) 10%, var(--card)); border-color: color-mix(in oklab, var(--color-green-500) 35%, var(--card)); color: var(--foreground); }
html:not(.dark) .kt-alert-light.kt-alert-success .kt-alert-icon > i, html:not(.dark) .kt-alert-light.kt-alert-success .kt-alert-icon > svg { color: var(--color-green-500); }
.dark .kt-alert-light.kt-alert-success { background-color: oklch(0.25 0.06 150); border-color: oklch(0.37 0.1 150); color: var(--foreground); }
.dark .kt-alert-light.kt-alert-success .kt-alert-icon > i, .dark .kt-alert-light.kt-alert-success .kt-alert-icon > svg { color: oklch(0.75 0.12 150); }

html:not(.dark) .kt-alert-light.kt-alert-warning { background-color: color-mix(in oklab, var(--color-yellow-500) 12%, var(--card)); border-color: color-mix(in oklab, var(--color-yellow-500) 40%, var(--card)); color: var(--foreground); }
html:not(.dark) .kt-alert-light.kt-alert-warning .kt-alert-icon > i, html:not(.dark) .kt-alert-light.kt-alert-warning .kt-alert-icon > svg { color: var(--color-yellow-600, oklch(0.68 0.16 85)); }
.dark .kt-alert-light.kt-alert-warning { background-color: oklch(0.25 0.06 85); border-color: oklch(0.37 0.1 85); color: var(--foreground); }
.dark .kt-alert-light.kt-alert-warning .kt-alert-icon > i, .dark .kt-alert-light.kt-alert-warning .kt-alert-icon > svg { color: oklch(0.75 0.12 85); }

html:not(.dark) .kt-alert-light.kt-alert-destructive { background-color: color-mix(in oklab, var(--destructive) 10%, var(--card)); border-color: color-mix(in oklab, var(--destructive) 35%, var(--card)); color: var(--foreground); }
html:not(.dark) .kt-alert-light.kt-alert-destructive .kt-alert-icon > i, html:not(.dark) .kt-alert-light.kt-alert-destructive .kt-alert-icon > svg { color: var(--destructive); }
.dark .kt-alert-light.kt-alert-destructive { background-color: oklch(0.25 0.07 25); border-color: oklch(0.37 0.12 25); color: var(--foreground); }
.dark .kt-alert-light.kt-alert-destructive .kt-alert-icon > i, .dark .kt-alert-light.kt-alert-destructive .kt-alert-icon > svg { color: oklch(0.75 0.14 25); }

html:not(.dark) .kt-alert-light.kt-alert-info { background-color: color-mix(in oklab, var(--color-violet-500) 10%, var(--card)); border-color: color-mix(in oklab, var(--color-violet-500) 35%, var(--card)); color: var(--foreground); }
html:not(.dark) .kt-alert-light.kt-alert-info .kt-alert-icon > i, html:not(.dark) .kt-alert-light.kt-alert-info .kt-alert-icon > svg { color: var(--color-violet-500); }
.dark .kt-alert-light.kt-alert-info { background-color: oklch(0.25 0.06 292); border-color: oklch(0.37 0.1 292); color: var(--foreground); }
.dark .kt-alert-light.kt-alert-info .kt-alert-icon > i, .dark .kt-alert-light.kt-alert-info .kt-alert-icon > svg { color: oklch(0.75 0.12 292); }

/* R11-4: row separation is the border only */
.main-header { box-shadow: none; }

/* R11-6a: form controls sit on the card surface in light. Dark unchanged (already var(--background)). */
html:not(.dark) .kt-input:not(.kt-input-ghost),
html:not(.dark) .kt-select,
html:not(.dark) .kt-select-display,
html:not(.dark) .kt-textarea {
  background-color: var(--card);
}
/* R11-6a note: the work order assumes .kt-input-ghost is transparent, but the
   vendor paints it SOLID var(--background) — in light that left ghost inputs
   (inner inputs of composite wrappers AND standalone ghosts like the report
   date fields) as gray boxes on the now-white surfaces. Make them actually
   transparent in light so they inherit the surface; dark gets no new rule. */
html:not(.dark) .kt-input-ghost {
  background-color: transparent;
}

/* the header employee-search pill keeps its own gray — re-assert after the rule above */
html:not(.dark) .header-search .kt-input,
html:not(.dark) .header-search .kt-input input {
  background-color: #F1F1F4;
}

/* R11-5: dashboard Pending Approval approve icons render primary in both
   themes (the global icon-ghost rule muted them); the eye/view icon keeps
   muted-foreground. */
.kt-btn-icon.kt-btn-ghost.approve-button,
.kt-btn-icon.kt-btn-ghost.approve-pto-button {
  color: var(--primary);
}
.kt-btn-icon.kt-btn-ghost.approve-button:hover,
.kt-btn-icon.kt-btn-ghost.approve-pto-button:hover {
  background: color-mix(in oklab, var(--primary) 12%, transparent);
  color: var(--primary);
}

/* R11-7: dashboard Pending Approval tabs — active state reads as a blue
   tinted pill. Scoped to these three toggles only; line tabs elsewhere keep
   their underline style. */
.dark :is([data-kt-tab-toggle="#punches_tab"], [data-kt-tab-toggle="#timeoff_tab"], [data-kt-tab-toggle="#timecards_tab"]).active {
  background: oklch(0.25 0.06 259.815);
  border: 1px solid oklch(0.37 0.1 259.815);
  color: oklch(0.75 0.12 259.815);
  font-weight: 600;
}
html:not(.dark) :is([data-kt-tab-toggle="#punches_tab"], [data-kt-tab-toggle="#timeoff_tab"], [data-kt-tab-toggle="#timecards_tab"]).active {
  background: color-mix(in oklab, var(--primary) 10%, var(--card));
  border: 1px solid color-mix(in oklab, var(--primary) 40%, var(--card));
  color: var(--primary);
  font-weight: 600;
}

/* R11-11: header search results panel. The panel and its rows are built by
   metronic-autocomplete-search.js with hard-coded inline colors (#1379f0
   headers, #74788d rows, JS mouseover background), so the themed values
   need !important to beat element.style. W20: dark surface now rides
   --popover (22%) — the elevated content-panel level — instead of the old
   flat literal. */
#search-results-dropdown {
  background: var(--card) !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px !important;
  box-shadow: 0 14px 44px rgba(0, 0, 0, 0.14) !important;
  backdrop-filter: none !important;
}
.dark #search-results-dropdown {
  background: var(--popover) !important;
  box-shadow: 0 14px 44px rgba(0, 0, 0, 0.45) !important;
}
#search-results-dropdown .m-dropdown-menu__item-title {
  color: var(--primary) !important;
  font-weight: 600 !important;
}
#search-results-dropdown .m-dropdown-menu__item,
#search-results-dropdown .m-dropdown-menu__item .text-mono {
  color: var(--foreground) !important;
}
#search-results-dropdown .m-dropdown-menu__item i {
  color: var(--muted-foreground) !important;
}
#search-results-dropdown .m-dropdown-menu__item:hover {
  background-color: color-mix(in oklab, var(--muted) 60%, transparent) !important;
}
#search-results-dropdown .m-dropdown-menu__item-group {
  border-color: var(--border);
}

/* R11-8: Add/Edit Punch modal — approved 600px geometry. The punch partials
   load into the shared #dynamicModalContent shell, so scope by the punch
   form id (the manual-break modals sharing the shell are untouched). The
   punch rows are flex with fixed-width kt-labels, so widening the label to
   110px is the flex equivalent of the shift modals' 110px grid column. */
#dynamicModalContent:has(#addPunchForm) {
  width: 600px;
  max-width: 92vw;
}
#dynamicModalContent:has(#addPunchForm) .kt-label {
  width: 110px;
  flex: 0 0 110px;
}
#dynamicModalContent:has(#addPunchForm) .kt-modal-body {
  padding-inline: 34px;
}
#dynamicModalContent:has(#addPunchForm) .kt-modal-footer {
  justify-content: flex-end;
  border-top: 1px solid var(--border);
}

/* R11-10: week Subtotal and grand Total NUMERIC value cells (count-col /
   total-col) read bolder than regular row values; row labels stay 500. */
.timecard-detail-table tr.summary-row > td.count-col,
.timecard-detail-table tr.summary-row > td.total-col,
.timecard-detail-table tfoot td.count-col,
.timecard-detail-table tfoot td.total-col {
  font-weight: 600;
}

/* W13: logged-out account form sits in a standard card on the app canvas.
   The flex centering mirrors the wrapper's previous parent (flex items-center)
   so the form content inside keeps its exact prior alignment. */
.account-card {
  /* W16: without an explicit width, the flex-centered card shrink-wraps to
     its content (~320px) instead of filling to its 472px cap. */
  width: 100%;
  max-width: 472px;
  margin: 56px auto 24px;
  padding: 36px 40px 30px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 14px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
html:not(.dark) .account-card { box-shadow: 0 4px 5px rgba(0, 0, 0, 0.03); }

/* W17: calendar pages render white edge-to-edge in light (like prod). The
   light --background token is #F7F7F8 app-wide; re-point it to white on the
   four calendar pages only (the #schedule_calendar / #m_calendar containers
   are server-rendered, so :has() matches on first paint). Dark is excluded
   and unchanged. The R11-1 .fc-view-container rule above stays — it becomes
   a no-op in light and still serves dark. */
html:not(.dark) body:has(#schedule_calendar),
html:not(.dark) body:has(#m_calendar) {
  --background: #ffffff;
}

/* ============================================================================
   Work Order 4 (bp-restyle-workorder-4) — dark elevation ladder + fixes.
   Dark token ladder itself is in the .dark block near the top of this file
   (W20). These are the companion surface/component rules.
   ============================================================================ */

/* W20: the punch-edit drawer panel (.sliding-card) sits at the popover level
   (22%) in dark — elevated above the 18% cards. Light keeps var(--background)
   (its off-white page surface) from the earlier work orders. */
.dark .sliding-card {
  background-color: var(--popover);
}

/* W19: outline buttons fill the card surface in BOTH themes. The vendor fills
   var(--background); on the off-white light page that made outline buttons
   (Employee-profile Deactivate / More, etc.) blend into the canvas with only
   the border separating them. --card renders them as white pills in light and
   at the 18% card level in dark. Variant coloring (outline+destructive, etc.)
   and hover/active states are unchanged — this only sets the resting fill. */
.kt-btn-outline {
  background-color: var(--card);
}

/* W18: header avatar trigger — restore prod's hover (utility-vs-component
   precedence regression). Prod renders this button 36×36, full-circle, with a
   TRANSPARENT hover that tints the person icon + chevron primary — no pill. On
   QA1 the kt-btn* component declarations beat the size-9 / rounded-full / hover
   utilities, collapsing it to a 26px 6px-radius muted pill around the icon
   only. Reordering the prebuilt bundle's @layer order to restore utility
   precedence is too broad/risky this round, so this is the scoped fallback.
   (Path taken: scoped fallback, not bundle reorder.)

   Scoped to .rounded-full so ONLY the avatar trigger matches — the sibling
   Help button in the header is also .kt-btn-icon.size-9 but has no
   rounded-full and must keep its normal kt-btn-ghost hover pill. */
.main-header .kt-btn-icon.size-9.rounded-full {
  width: 36px;
  height: 36px;
  border-radius: 9999px;
}
.main-header .kt-btn-icon.size-9.rounded-full:hover {
  background-color: transparent;
}
.main-header .kt-btn-icon.size-9.rounded-full:hover i {
  color: var(--primary);
}

/* ============================================================================
   Work Order 5 (bp-restyle-workorder-5) — six fixes + Import Employees layout.
   ============================================================================ */

/* W24 — search field inside select-dropdown panels (.kt-select-search): the
   ghost input didn't span the row and was invisible in light (white-on-white)
   / a floating inset box in dark. Give it the standard restyle input
   treatment spanning the panel's inner width. */
.kt-select-search {
  padding-left: 8px;
  padding-right: 8px;
}
.kt-select-search .kt-input {
  width: 100%;
  border: 1px solid var(--input);
  border-radius: 8px;
  background: var(--card);
  /* W38 (AB#14287) — the theme renders this search input with padding:0, so the
     placeholder/text sits flush against the left border. Inset it ~12px. (W38's
     other ask, a card/background fill instead of a transparent input, is already
     satisfied by the background above + the .dark rule below, from W24.) */
  padding-inline: 12px;
}
.dark .kt-select-search .kt-input {
  background: var(--background);
  border-color: var(--border);
}

/* W25 — Add/Edit Break modal was shrink-wrapping to ~340px. Widen to the
   600px punch-modal reference, scoped by the break form id (it shares the
   #dynamicModalContent shell with the punch modal, so :has keeps this off
   every other modal). The partial caps its form at max-w-[320px]; override so
   the fields stretch with the dialog. */
#dynamicModalContent:has(#add-break-form) {
  width: min(600px, 92vw);
}
#dynamicModalContent:has(#add-break-form) .modal-form {
  max-width: none;
  width: 100%;
}
#dynamicModalContent:has(#add-break-form) .kt-input,
#dynamicModalContent:has(#add-break-form) .kt-select,
#dynamicModalContent:has(#add-break-form) .kt-textarea {
  width: 100%;
}

/* W26 — Send Message modal jumped from 301px (Email) to 500px (Push/Both,
   when the push-setup alert appears). Pin it to the wide size in all tab
   states. */
#messageModal .kt-modal-content {
  width: min(500px, 92vw);
}

/* W37 — Email/Push/Both channel toggles: blue selected state + complete border,
   app-wide (AB#14281). The selected-segment blue recipe was scoped to
   .btn-group-toggle (Send Message modal only); the Alert/Reminder form and the
   Send/Publish Schedule modals use plain .kt-toggle-group, so their selection
   fell back to var(--accent) — a gray that's near-invisible against the flush
   card/background surface post-restyle. Re-scope the recipe to .kt-toggle-group
   so it covers every channel toggle. The .kt-toggle-group collapses each
   segment's trailing border to 0 (only :last-child keeps 1px), so a selected
   middle segment would otherwise show only three sides — restore the trailing
   border and lift the segment above its neighbour, offsetting the added width
   with a -1px margin so the group width stays stable. The Day/Week/Month +
   Schedule/Availability VIEW switchers are .bp-view-toggle and stay unchanged. */
.kt-toggle-group label.kt-btn:has(input:checked) {
  font-weight: 600;
  position: relative;
  z-index: 1;
  border-inline-end-width: 1px;
  margin-inline-end: -1px;
}
.dark .kt-toggle-group label.kt-btn:has(input:checked) {
  background: oklch(0.25 0.06 259.815);
  border-color: oklch(0.37 0.1 259.815);
  color: oklch(0.75 0.12 259.815);
}
html:not(.dark) .kt-toggle-group label.kt-btn:has(input:checked) {
  background: color-mix(in oklab, var(--primary) 10%, var(--card));
  border-color: color-mix(in oklab, var(--primary) 40%, var(--card));
  color: var(--primary);
}

/* W28 — kt-input-group: the magnifier addon rendered shorter (34px) than the
   input (38px). Stretch it to match with a clean joined seam. Applies to
   every .kt-input-group (Manage Templates search and any other). */
.kt-input-group {
  align-items: stretch;
}
.kt-input-group .kt-input-addon {
  height: auto;
  align-self: stretch;
}

/* W29 — Import Employees two-card layout. */
.import-employees-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  align-items: start;
}
@media (max-width: 900px) {
  .import-employees-grid {
    grid-template-columns: 1fr;
  }
}
.import-col-chips {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.import-col-chip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 8px 12px;
  font-size: var(--text-sm);
  font-weight: 500;
  background: color-mix(in oklab, var(--muted) 25%, transparent);
}
/* Green-outline "Download template": card-surface fill + #00B47D border/text,
   faint green wash on hover (the app has no green-outline btn variant). */
.bp-btn-success-outline {
  background-color: var(--card);
  border: 1px solid #00B47D;
  color: #00B47D;
}
.bp-btn-success-outline:hover {
  background-color: color-mix(in oklab, #00B47D 8%, var(--card));
  color: #00B47D;
}
.bp-btn-success-outline i {
  color: #00B47D;
}

/* ============================================================================
   Work Order 7 (bp-restyle-workorder-7) — CSS fixes W38-W42 (AB#14287).
   Presentation-only; no markup or behavior changes. W38 lives with the W24
   .kt-select-search rule above; W37 shipped separately under AB#14281.
   ============================================================================ */

/* W39 — Time Entry date input clips the year. The date input carries a
   min-w-[100px] Tailwind bracket utility, but there's no JIT step here (the
   bundle is a pre-scanned export), so that arbitrary-value utility is purged
   and its computed min-width is 0 — the ~100px box clips "2026" in dates like
   "07/21/2026". Set the floor as a real stylesheet rule so it can't be purged
   (do NOT reintroduce the bracket utility). Covers the Add/Edit Time Entries
   date inputs (input.kt-input.date). */
input.kt-input.date {
  min-width: 120px;
}

/* W40 — Row Delete button on the Add/Edit Time Entries pages is an
   <input type="button"> (not a <button>), so the .kt-btn flexbox centering has
   no effect on it (flexbox does not apply inside a replaced element) and its
   label renders vertically off-center vs the real <button> Save/Cancel. Center
   the single line with line-height instead: 32px = the 34px button height minus
   the 1px top/bottom borders. Pure CSS — the .delete-button click binding and
   markup are untouched. (The Schedule-modal delete controls are <a> elements,
   not input.kt-btn, so they're unaffected.) */
input.kt-btn.delete-button {
  padding-block: 0;
  line-height: 32px;
}

/* W41 — Copy-week confirm dialog (/Schedule -> Options -> Copy To -> pick week)
   shows the target range in a readonly .swal2-input that's only ~182px wide, so
   "2026-07-26 - 2026-08-01" (~196px) clips. Raise the floor. Scoped to
   [readonly] so it hits this display-only range field (schedule.js builds it
   readonly) without widening the app's other editable Swal text prompts; and
   min-width only, so the wider kt-input-styled swals (Calendar Sync, QBD) are
   unaffected. */
.swal2-input[readonly] {
  min-width: 230px;
}

/* W42 — Tooltips render behind open modals. .kt-tooltip.show is z-index:100,
   but an open .kt-modal is 108 (backdrop 107) with in-modal layers (selects,
   datepickers) at 1060, so e.g. the "Repeats Every:" tooltip inside the Edit
   Shift modal paints behind the dialog. Lift tooltips above the in-modal
   layers. This raises .kt-tooltip.show site-wide, not only inside modals;
   non-modal tooltips have no higher-stacked neighbour to clash with, so their
   appearance is unchanged. (Calendar fc-event tooltips keep their own scoped
   z-index:100 from schedule.scss.) */
.kt-tooltip.show {
  z-index: 1070;
}

/* W35 — Employee Profile / Group Details scrollspy rail. The rail's sticky
   box carried `top:110px; max-height:80vh; overflow-y:auto` as an inline
   style, which can't be media-queried. Once the page grid stacks to a single
   column below lg the rail sits above the content in a content-height row, so
   sticky has no travel and the 80vh cap only ever clipped the chip row into a
   nested scroller. Keep the desktop treatment, drop it on small screens.
   Presentation-only; the scrollspy wiring on the inner element is untouched. */
.bp-profile-rail {
  position: static;
  max-height: none;
  overflow: visible;
}

@media (min-width: 64rem) {
  .bp-profile-rail {
    position: sticky;
    top: 110px;
    max-height: 80vh;
    overflow-x: hidden;
    overflow-y: auto;
  }
}

/* Section cards on these two pages put two buttons side by side in a nowrap
   .kt-card-toolbar (e.g. "Department Settings" + "Edit Assignment"), which is
   wider than a 390px viewport and was the last thing forcing a horizontal
   scrollbar once the page grid stacked. Let the toolbar wrap below lg; scoped
   to the profile/group grid so no other page's header changes. */
@media (max-width: 63.9375rem) {
  .bp-profile-grid .kt-card-toolbar {
    flex-wrap: wrap;
  }

  /* Nested grids inside the content column (the alert row, the two-up section
     grids) size their single implicit track to the item's min-content, and a
     flex .kt-alert reports a min-content wider than a phone. Letting the items
     shrink keeps the track inside the column. */
  .bp-profile-grid .grid > * {
    min-width: 0;
  }

  /* Three section tables (Managers assigned, Time Off Accrual Rules, Pay
     Rates) sit straight in a .kt-card-body with no scroll wrapper, so their
     min-content width became the page's. Give those — and only those — their
     own horizontal scroller. The `> .kt-table` child combinator deliberately
     skips the datatable-wrapped cards, whose bodies also hold the "per page"
     select that an overflow context would clip. */
  .bp-profile-grid .kt-card-body:has(> .kt-table) {
    overflow-x: auto;
  }
}

/* ============================================================================
   Grouped "tile" layout — W33 (Employee Profile view), W34 (Employee Edit),
   W43 (Scheduling Settings). One long single-column body becomes a set of
   labelled tiles inside the SAME card. Presentation-only: no field, id, name,
   handler, or route changes ride along with it.

   Ported from the approved mockups (employee-profile-option-b,
   employee-profile-edit-option-b, scheduling-settings-organized). Those pages
   are standalone HTML with their own stylesheet, so the geometry is
   re-expressed here against the app's theme tokens. The mockups mark dark as
   the default and light with html.light; this app is the other way round
   (light default, .dark opt-in), so the tile fill is inverted accordingly.
   ============================================================================ */

.bp-gtiles {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

/* Single column on phones/small tablets (mockup breakpoint). */
@media (max-width: 860px) {
  .bp-gtiles {
    grid-template-columns: 1fr;
  }
}

/* Grid children default to min-width:auto, so a long unbreakable value (an
   email, a username) would push the tile wider than its track and give the
   whole page a horizontal scrollbar. */
.bp-gtiles > * {
  min-width: 0;
}

.bp-gtile {
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: 10px;
  /* Light: the flat --muted wash reads as a tile on the white card. Dark: the
     card is already elevated, so the same wash at 25% keeps the ladder. */
  background: var(--muted);
}

.bp-gtile:is(.dark *) {
  background: color-mix(in oklab, var(--muted) 25%, transparent);
}

/* Wide tile — spans both columns (used by "Punch & entry rules"). */
.bp-gtile-full {
  grid-column: 1 / -1;
}

.bp-gtile-label {
  margin: 0 0 6px;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--header-foreground);
}

/* Second heading inside a tile (e.g. "Employment dates" under Pay). */
.bp-gtile-sublabel {
  margin: 14px 0 6px;
}

/* --- Read-only rows (view page): label left, value right ------------------ */

.bp-grow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 0;
  border-bottom: 1px solid color-mix(in oklab, var(--border) 60%, transparent);
}

.bp-grow:last-child {
  border-bottom: 0;
}

.bp-grow-label {
  flex: 0 0 46%;
  font-size: 0.8125rem;
  color: var(--muted-foreground);
}

.bp-grow-value {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  font-weight: 500;
  text-align: right;
  /* Emails and usernames have no break opportunities; without this they blow
     out the tile and give the page a horizontal scrollbar. */
  overflow-wrap: anywhere;
}

.bp-grow-value > * {
  min-width: 0;
}

/* --- Rule rows (view page): stacked label/value left, Settings link right -- */

.bp-rrow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 9px 0;
  border-bottom: 1px solid color-mix(in oklab, var(--border) 60%, transparent);
}

.bp-rrow:last-child {
  border-bottom: 0;
}

.bp-rrow-label {
  margin: 0 0 2px;
  font-size: 0.75rem;
  color: var(--muted-foreground);
}

.bp-rrow > div:first-child {
  min-width: 0;
}

.bp-rrow-value {
  font-weight: 500;
  overflow-wrap: anywhere;
}

/* Below the mockup's 900px breakpoint the two-up rows stack so long values
   (overtime type names, permission sentences) stop being squeezed. */
@media (max-width: 900px) {
  .bp-grow,
  .bp-rrow {
    flex-wrap: wrap;
  }

  .bp-grow-label {
    flex: 1 1 100%;
  }

  .bp-grow-value {
    width: 100%;
    justify-content: flex-start;
    text-align: left;
  }
}

/* ============================================================================
   Billing pages — W30 (/Account/PurchasePlan), W31 (/Account/ChangePlan),
   W32 (/Account/ViewPlan). Ported from the approved Proposal B mockups
   (select-purchase-option-b, switch-plans-option-b, plan-billing-option-b).
   Presentation-only: every link, radio, form post, and Vue binding is the same.
   ============================================================================ */

/* Section heading on the billing pages ("Payment method", "Plans", "Add ons",
   "Billing Cycle", "Receipts"). Same type treatment as the tile label but with
   its own vertical rhythm — these separate blocks on a card, they don't cap a
   tile. It carries its own margins rather than relying on the mt- / mb-
   utilities: this file loads after tailwind.styles.css, so a class-level
   `margin` here would win over them anyway. */
.bp-section-label {
  margin: 22px 0 10px;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--header-foreground);
}

.bp-section-label:first-child {
  margin-top: 0;
}

/* Inline variant — sits in a flex row next to its value (the Plan row). */
.bp-section-label-inline {
  margin: 0;
}

/* Two-up page grid: decision column wider than the summary rail. */
.bp-billing-grid {
  display: grid;
  grid-template-columns: 1.35fr 1fr;
  gap: 16px;
  align-items: start;
}

@media (max-width: 900px) {
  .bp-billing-grid {
    grid-template-columns: 1fr;
  }
}

/* Billing cycle as two selectable bordered cards. The radios inside are the
   same inputs with the same names/values and the same Vue handlers — the card
   is just a bigger hit area and a visible selected state. */
.bp-cycwrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

@media (max-width: 600px) {
  .bp-cycwrap {
    grid-template-columns: 1fr;
  }
}

.bp-cyc {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--muted);
  cursor: pointer;
}

.bp-cyc:is(.dark *) {
  background: color-mix(in oklab, var(--muted) 25%, transparent);
}

.bp-cyc:has(.kt-radio:checked) {
  border-color: color-mix(in oklab, var(--primary) 55%, var(--border));
  box-shadow: 0 0 0 1px color-mix(in oklab, var(--primary) 55%, transparent);
  background: var(--card);
}

.bp-cyc:has(.kt-radio:checked):is(.dark *) {
  background: color-mix(in oklab, var(--muted) 25%, transparent);
}

.bp-cyc .kt-radio {
  margin-top: 2px;
}

/* On Switch Plans the cycle pair sits on the full-width canvas rather than in a
   column, so cap it instead of letting each card stretch half the page. */
.bp-cycwrap-wide {
  max-width: 640px;
}

/* --- W31 plan / add-on tiles ---------------------------------------------
   .addon-card / .plans-card-list / .addon-card-list are shared with
   /Account/ViewPlan and are defined in helpers.css, which loads AFTER this
   file in the metronic9 bundle. These rules are page-scoped (.switch-plans)
   so they out-specify the shared defaults without needing !important and
   without touching the ViewPlan rendering. */

.switch-plans .plans-card-list,
.switch-plans .addon-card-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
  margin: 0 0 4px;
}

.switch-plans .addon-card {
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: auto;
  min-height: 0;
  padding: 16px;
  border-radius: 10px;
  /* Light mode: white tile on the #F7F7F8 canvas — Eric's note was that the
     tiles must not blend into the background. */
  background: var(--card);
}

.switch-plans .addon-card:is(.dark *) {
  background: color-mix(in oklab, var(--muted) 25%, transparent);
}

/* helpers.css paints .addon-card--plan-card:not(.--current-plan) with
   --mono-foreground; the tile fill above is what the mockup calls for. */
.switch-plans .addon-card--can-change,
.switch-plans .addon-card--plan-card:not(.addon-card--current-plan) {
  background: var(--card) !important;
}

.switch-plans .addon-card--can-change:is(.dark *),
.switch-plans .addon-card--plan-card:not(.addon-card--current-plan):is(.dark *) {
  background: color-mix(in oklab, var(--muted) 25%, transparent) !important;
}

/* Current plan: blue ring, matching the "Current plan" chip. */
.switch-plans .addon-card--current-plan {
  border-color: color-mix(in oklab, var(--primary) 55%, var(--border));
  box-shadow: 0 0 0 1px color-mix(in oklab, var(--primary) 55%, transparent);
}

.switch-plans .addon-card__body {
  display: flex;
  flex: 1;
  flex-direction: column;
}

.bp-plan-price {
  margin: 10px 0 0;
  font-size: 1.3rem;
  font-weight: 600;
  text-align: center;
}

.bp-plan-per {
  font-size: 0.75rem;
  font-weight: 400;
  color: var(--muted-foreground);
}

.bp-plan-base {
  margin: 2px 0 10px;
  font-size: 0.8125rem;
  color: var(--muted-foreground);
  text-align: center;
}

.bp-plan-base:empty {
  display: none;
}

.bp-plan-foot {
  margin-top: auto;
  font-size: 0.8125rem;
}

.bp-plan-addon-price {
  margin: 0;
  font-weight: 500;
  text-align: right;
}

/* "What's included ⓘ" — the same .planInfoPopover hover trigger as before,
   just given a visible label instead of a bare icon. */
.bp-plan-included {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--secondary-foreground);
  cursor: pointer;
}

.bp-plan-included:hover {
  color: var(--primary);
}

/* Sticky action bar — the page is long enough that the footer Next scrolls
   out of reach on the plan grid. */
.bp-sticky-actions {
  position: sticky;
  bottom: 14px;
  z-index: 40;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 26px;
  padding: 12px 16px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--popover);
  box-shadow: 0 10px 34px rgb(0 0 0 / 12%);
}

.bp-sticky-actions:is(.dark *) {
  box-shadow: 0 10px 34px rgb(0 0 0 / 35%);
}

/* --- W32 plan hero + add-on rows (/Account/ViewPlan) ---------------------- */

.bp-plan-hero {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 14px;
}

.bp-plan-hero-desc {
  max-width: 420px;
  margin-top: 5px;
  font-size: 0.8125rem;
  color: var(--muted-foreground);
}

.bp-addon-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

@media (max-width: 760px) {
  .bp-addon-grid {
    grid-template-columns: 1fr;
  }
}

.bp-brow {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--muted);
}

.bp-brow:is(.dark *) {
  background: color-mix(in oklab, var(--muted) 25%, transparent);
}

.bp-brow-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 30px;
}

.bp-brow-name {
  display: flex;
  align-items: center;
  gap: 7px;
  font-weight: 500;
}

.bp-brow-desc {
  margin: 2px 0 6px;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--muted-foreground);
}

.bp-brow-price {
  margin-top: auto;
  font-size: 0.8125rem;
  font-weight: 500;
  text-align: right;
}

/* Fee Schedule sits inside the right-aligned price block now, so the
   centred/blocked treatment from helpers.css would fight it. */
.bp-brow-price .fee-schedule-link {
  display: inline;
  margin-top: 0;
  text-align: right;
}

/* --- Setting rows (W43 "Overlap rules"): heading + subline left, control
       right; wraps to stacked on narrow viewports. ---------------------------- */

.bp-orow {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid color-mix(in oklab, var(--border) 60%, transparent);
}

.bp-orow:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.bp-orow-label {
  min-width: 200px;
}

.bp-orow-label b {
  display: block;
  font-size: 0.875rem;
  font-weight: 600;
}

.bp-orow-label span {
  font-size: 0.75rem;
  color: var(--muted-foreground);
}

/* --- Form tiles (edit pages) ---------------------------------------------- */

/* Two-up field grid inside a full-width tile. */
.bp-rules2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 24px;
}

@media (max-width: 760px) {
  .bp-rules2 {
    grid-template-columns: 1fr;
  }
}

/* The app's field wrapper is `mb-5 flex flex-col gap-2`; drop the trailing
   gap so the last field doesn't push the tile's bottom padding out. */
.bp-gtile > .mb-5:last-child,
.bp-rules2 > .mb-5:last-child {
  margin-bottom: 0;
}

/* The pencil and "… Settings" anchors keep their existing class lists verbatim
   (a W33 guardrail — they're the same links with the same hrefs), and those
   lists carry ml-3 / ml-4 spacers sized for the old two-column table. The tile
   rows space their children with flex `gap` instead, so neutralise the stale
   margin rather than editing the anchors' classes. */
.bp-grow-value > .kt-btn,
.bp-grow-value > .kt-link,
.bp-rrow > .kt-link {
  margin-left: 0;
}

/* The trailing pencil / History link is a fixed affordance: it must not shrink
   and must not inherit the value's break-anywhere wrapping ("Hist / ory"). */
.bp-grow-value > .kt-btn,
.bp-grow-value > .kt-link {
  flex: none;
  overflow-wrap: normal;
  white-space: nowrap;
}

/*!
 * FullCalendar v3.8.2
 * Docs & License: https://fullcalendar.io/
 * (c) 2018 Adam Shaw
 */
.fc {
  direction: ltr;
  text-align: left; }

.fc-rtl {
  text-align: right; }

body .fc {
  /* extra precedence to overcome jqui */
  font-size: 1em; }

/* Colors
--------------------------------------------------------------------------------------------------*/
.fc-highlight {
  /* when user is selecting cells */
  background: #bce8f1;
  opacity: .3; }

.fc-bgevent {
  /* default look for background events */
  background: #8fdf82;
  opacity: .3; }

.fc-nonbusiness {
  /* default look for non-business-hours areas */
  /* will inherit .fc-bgevent's styles */
  background: #d7d7d7; }

/* Buttons (styled <button> tags, normalized to work cross-browser)
--------------------------------------------------------------------------------------------------*/
.fc button {
  /* force height to include the border and padding */
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  /* dimensions */
  margin: 0;
  height: 2.1em;
  padding: 0 .6em;
  /* text & cursor */
  font-size: 1em;
  /* normalize */
  white-space: nowrap;
  cursor: pointer; }

/* Firefox has an annoying inner border */
.fc button::-moz-focus-inner {
  margin: 0;
  padding: 0; }

.fc-state-default {
  /* non-theme */
  border: 1px solid; }

.fc-state-default.fc-corner-left {
  /* non-theme */
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px; }

.fc-state-default.fc-corner-right {
  /* non-theme */
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px; }

/* icons in buttons */
.fc button .fc-icon {
  /* non-theme */
  position: relative;
  top: -0.05em;
  /* seems to be a good adjustment across browsers */
  margin: 0 .2em;
  vertical-align: middle; }

  .fc-state-active {
    background-color: var(--muted);
  }
  
/* Buttons Groups
--------------------------------------------------------------------------------------------------*/
.fc-button-group {
  display: inline-block; }

/*
every button that is not first in a button group should scootch over one pixel and cover the
previous button's border...
*/
.fc .fc-button-group > * {
  /* extra precedence b/c buttons have margin set to zero */
  float: left;
  margin: 0 0 0 -1px; }

.fc .fc-button-group > :first-child {
  /* same */
  margin-left: 0; }

/* Popover
--------------------------------------------------------------------------------------------------*/
.fc-popover {
  position: absolute;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15); }

.fc-popover .fc-header {
  /* TODO: be more consistent with fc-head/fc-body */
  padding: 2px 4px; }

.fc-popover .fc-header .fc-title {
  margin: 0 2px; }

.fc-popover .fc-header .fc-close {
  cursor: pointer; }

.fc-ltr .fc-popover .fc-header .fc-title,
.fc-rtl .fc-popover .fc-header .fc-close {
  float: left; }

.fc-rtl .fc-popover .fc-header .fc-title,
.fc-ltr .fc-popover .fc-header .fc-close {
  float: right; }

/* Misc Reusable Components
--------------------------------------------------------------------------------------------------*/
.fc-divider {
  border-style: solid;
  border-width: 1px; }

hr.fc-divider {
  height: 0;
  margin: 0;
  padding: 0 0 2px;
  /* height is unreliable across browsers, so use padding */
  border-width: 1px 0; }

.fc-clear {
  clear: both; }

.fc-bg,
.fc-bgevent-skeleton,
.fc-highlight-skeleton,
.fc-helper-skeleton {
  /* these element should always cling to top-left/right corners */
  position: absolute;
  top: 0;
  left: 0;
  right: 0; }

.fc-bg {
  bottom: 0;
  /* strech bg to bottom edge */ }

.fc-bg table {
  height: 100%;
  /* strech bg to bottom edge */ }

/* Tables
--------------------------------------------------------------------------------------------------*/
.fc table {
  width: 100%;
  box-sizing: border-box;
  /* fix scrollbar issue in firefox */
  table-layout: fixed;
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 1em;
  /* normalize cross-browser */ }

.fc th {
  text-align: center; }

.fc th,
.fc td {
  border-style: solid;
  border-width: 1px;
  padding: 0;
  vertical-align: top; }

.fc td.fc-today {
  border-style: double;
  /* overcome neighboring borders */ }

/* Internal Nav Links
--------------------------------------------------------------------------------------------------*/
a[data-goto] {
  cursor: pointer; }

a[data-goto]:hover {
  text-decoration: underline; }

/* Fake Table Rows
--------------------------------------------------------------------------------------------------*/
.fc .fc-row {
  /* extra precedence to overcome themes w/ .ui-widget-content forcing a 1px border */
  /* no visible border by default. but make available if need be (scrollbar width compensation) */
  border-style: solid;
  border-width: 0; }

.fc-row table {
  /* don't put left/right border on anything within a fake row.
     the outer tbody will worry about this */
  border-left: 0 hidden transparent;
  border-right: 0 hidden transparent;
  /* no bottom borders on rows */
  border-bottom: 0 hidden transparent; }

.fc-row:first-child table {
  border-top: 0 hidden transparent;
  /* no top border on first row */ }

/* Day Row (used within the header and the DayGrid)
--------------------------------------------------------------------------------------------------*/
.fc-row {
  position: relative; }

.fc-row .fc-bg {
  z-index: 1; }

/* highlighting cells & background event skeleton */
.fc-row .fc-bgevent-skeleton,
.fc-row .fc-highlight-skeleton {
  bottom: 0;
  /* stretch skeleton to bottom of row */ }

.fc-row .fc-bgevent-skeleton table,
.fc-row .fc-highlight-skeleton table {
  height: 100%;
  /* stretch skeleton to bottom of row */ }

.fc-row .fc-highlight-skeleton td,
.fc-row .fc-bgevent-skeleton td {
  border-color: transparent; }

.fc-row .fc-bgevent-skeleton {
  z-index: 2; }

.fc-row .fc-highlight-skeleton {
  z-index: 3; }

/*
row content (which contains day/week numbers and events) as well as "helper" (which contains
temporary rendered events).
*/
.fc-row .fc-content-skeleton {
  position: relative;
  z-index: 4;
  padding-bottom: 2px;
  /* matches the space above the events */ }

.fc-row .fc-helper-skeleton {
  z-index: 5; }

.fc .fc-row .fc-content-skeleton table,
.fc .fc-row .fc-content-skeleton td,
.fc .fc-row .fc-helper-skeleton td {
  /* see-through to the background below */
  /* extra precedence to prevent theme-provided backgrounds */
  background: none;
  /* in case <td>s are globally styled */
  border-color: transparent; }

.fc-row .fc-content-skeleton td,
.fc-row .fc-helper-skeleton td {
  /* don't put a border between events and/or the day number */
  border-bottom: 0; }

.fc-row .fc-content-skeleton tbody td,
.fc-row .fc-helper-skeleton tbody td {
  /* don't put a border between event cells */
  border-top: 0; }

/* Scrolling Container
--------------------------------------------------------------------------------------------------*/
.fc-scroller {
  -webkit-overflow-scrolling: touch; }

/* TODO: move to agenda/basic */
.fc-scroller > .fc-day-grid,
.fc-scroller > .fc-time-grid {
  position: relative;
  /* re-scope all positions */
  width: 100%;
  /* hack to force re-sizing this inner element when scrollbars appear/disappear */ }

/* Global Event Styles
--------------------------------------------------------------------------------------------------*/
.fc-event {
  position: relative;
  /* for resize handle and other inner positioning */
  display: block;
  /* make the <a> tag block */
  font-size: .85em;
  line-height: 1.3;
  border-radius: 3px;
  border: 1px solid var(--border);
  /* default BORDER color */ }

.fc-event,
.fc-event-dot {
  background-color: var(--background);
  /* default BACKGROUND color */ }

.fc-event,
.fc-event:hover {
  color: #fff;
  /* default TEXT color */
  text-decoration: none;
  /* if <a> has an href */ }

.fc-event[href],
.fc-event.fc-draggable {
  cursor: pointer;
  /* give events with links and draggable events a hand mouse pointer */ }

.fc-not-allowed,
.fc-not-allowed .fc-event {
  /* to override an event's custom cursor */
  cursor: not-allowed; }

.fc-event .fc-bg {
  /* the generic .fc-bg already does position */
  z-index: 1;
  background: #fff;
  opacity: .25; }

.fc-event .fc-content {
  position: relative;
  z-index: 2; }

/* resizer (cursor AND touch devices) */
.fc-event .fc-resizer {
  position: absolute;
  z-index: 4; }

/* resizer (touch devices) */
.fc-event .fc-resizer {
  display: none; }

.fc-event.fc-allow-mouse-resize .fc-resizer,
.fc-event.fc-selected .fc-resizer {
  /* only show when hovering or selected (with touch) */
  display: block; }

/* hit area */
.fc-event.fc-selected .fc-resizer:before {
  /* 40x40 touch area */
  content: "";
  position: absolute;
  z-index: 9999;
  /* user of this util can scope within a lower z-index */
  top: 50%;
  left: 50%;
  width: 40px;
  height: 40px;
  margin-left: -20px;
  margin-top: -20px; }

/* Event Selection (only for touch devices)
--------------------------------------------------------------------------------------------------*/
.fc-event.fc-selected {
  z-index: 9999 !important;
  /* overcomes inline z-index */
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); }

.fc-event.fc-selected.fc-dragging {
  box-shadow: 0 2px 7px rgba(0, 0, 0, 0.3); }

/* Horizontal Events
--------------------------------------------------------------------------------------------------*/
/* bigger touch area when selected */
.fc-h-event.fc-selected:before {
  content: "";
  position: absolute;
  z-index: 3;
  /* below resizers */
  top: -10px;
  bottom: -10px;
  left: 0;
  right: 0; }

/* events that are continuing to/from another week. kill rounded corners and butt up against edge */
.fc-ltr .fc-h-event.fc-not-start,
.fc-rtl .fc-h-event.fc-not-end {
  margin-left: 0;
  border-left-width: 0;
  padding-left: 1px;
  /* replace the border with padding */
  border-top-left-radius: 0;
  border-bottom-left-radius: 0; }

.fc-ltr .fc-h-event.fc-not-end,
.fc-rtl .fc-h-event.fc-not-start {
  margin-right: 0;
  border-right-width: 0;
  padding-right: 1px;
  /* replace the border with padding */
  border-top-right-radius: 0;
  border-bottom-right-radius: 0; }

/* resizer (cursor AND touch devices) */
/* left resizer  */
.fc-ltr .fc-h-event .fc-start-resizer,
.fc-rtl .fc-h-event .fc-end-resizer {
  cursor: w-resize;
  left: -1px;
  /* overcome border */ }

/* right resizer */
.fc-ltr .fc-h-event .fc-end-resizer,
.fc-rtl .fc-h-event .fc-start-resizer {
  cursor: e-resize;
  right: -1px;
  /* overcome border */ }

/* resizer (mouse devices) */
.fc-h-event.fc-allow-mouse-resize .fc-resizer {
  width: 7px;
  top: -1px;
  /* overcome top border */
  bottom: -1px;
  /* overcome bottom border */ }

/* resizer (touch devices) */
.fc-h-event.fc-selected .fc-resizer {
  /* 8x8 little dot */
  border-radius: 4px;
  border-width: 1px;
  width: 6px;
  height: 6px;
  border-style: solid;
  border-color: inherit;
  background: #fff;
  /* vertically center */
  top: 50%;
  margin-top: -4px; }

/* left resizer  */
.fc-ltr .fc-h-event.fc-selected .fc-start-resizer,
.fc-rtl .fc-h-event.fc-selected .fc-end-resizer {
  margin-left: -4px;
  /* centers the 8x8 dot on the left edge */ }

/* right resizer */
.fc-ltr .fc-h-event.fc-selected .fc-end-resizer,
.fc-rtl .fc-h-event.fc-selected .fc-start-resizer {
  margin-right: -4px;
  /* centers the 8x8 dot on the right edge */ }

/* DayGrid events
----------------------------------------------------------------------------------------------------
We use the full "fc-day-grid-event" class instead of using descendants because the event won't
be a descendant of the grid when it is being dragged.
*/
.fc-day-grid-event {
  margin: 1px 2px 0;
  /* spacing between events and edges */
  padding: 0 1px; }

tr:first-child > td > .fc-day-grid-event {
  margin-top: 2px;
  /* a little bit more space before the first event */ }

.fc-day-grid-event.fc-selected:after {
  content: "";
  position: absolute;
  z-index: 1;
  /* same z-index as fc-bg, behind text */
  /* overcome the borders */
  top: -1px;
  right: -1px;
  bottom: -1px;
  left: -1px;
  /* darkening effect */
  background: #000;
  opacity: .25; }

.fc-day-grid-event .fc-content {
  /* force events to be one-line tall */
  white-space: nowrap;
  overflow: hidden; }

.fc-day-grid-event .fc-time {
  font-weight: bold; }

/* resizer (cursor devices) */
/* left resizer  */
.fc-ltr .fc-day-grid-event.fc-allow-mouse-resize .fc-start-resizer,
.fc-rtl .fc-day-grid-event.fc-allow-mouse-resize .fc-end-resizer {
  margin-left: -2px;
  /* to the day cell's edge */ }

/* right resizer */
.fc-ltr .fc-day-grid-event.fc-allow-mouse-resize .fc-end-resizer,
.fc-rtl .fc-day-grid-event.fc-allow-mouse-resize .fc-start-resizer {
  margin-right: -2px;
  /* to the day cell's edge */ }

/* Event Limiting
--------------------------------------------------------------------------------------------------*/
/* "more" link that represents hidden events */
a.fc-more {
  margin: 1px 3px;
  font-size: .85em;
  cursor: pointer;
  text-decoration: none; }

a.fc-more:hover {
  text-decoration: underline; }

.fc-limited {
  /* rows and cells that are hidden because of a "more" link */
  display: none; }

/* popover that appears when "more" link is clicked */
.fc-day-grid .fc-row {
  z-index: 1;
  /* make the "more" popover one higher than this */ }

.fc-more-popover {
  z-index: 2;
  width: 220px; }

.fc-more-popover .fc-event-container {
  padding: 10px; }

/* Now Indicator
--------------------------------------------------------------------------------------------------*/
.fc-now-indicator {
  position: absolute;
  border: 0 solid red; }

/* Utilities
--------------------------------------------------------------------------------------------------*/
.fc-unselectable {
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: transparent; }

/*
TODO: more distinction between this file and common.css
*/
/* Colors
--------------------------------------------------------------------------------------------------*/
.fc-unthemed th,
.fc-unthemed td,
.fc-unthemed thead,
.fc-unthemed tbody,
.fc-unthemed .fc-divider,
.fc-unthemed .fc-row,
.fc-unthemed .fc-content,
.fc-unthemed .fc-popover,
.fc-unthemed .fc-list-view,
.fc-unthemed .fc-list-heading td {
  border-color: var(--border); }

.fc-unthemed .fc-popover {
  background-color: #fff; }

.fc-unthemed .fc-divider,
.fc-unthemed .fc-popover .fc-header,
.fc-unthemed .fc-list-heading td {
  background: #eee; }

.fc-unthemed .fc-popover .fc-header .fc-close {
  color: #666; }

.fc-unthemed td.fc-today {
  background: var(--muted); }

.fc-unthemed .fc-disabled-day {
  background: var(--muted);
  opacity: .3; }

/* Icons (inline elements with styled text that mock arrow icons)
--------------------------------------------------------------------------------------------------*/
.fc-icon {
  display: inline-block;
  height: 1em;
  line-height: 1em;
  font-size: 1em;
  text-align: center;
  overflow: hidden;
  font-family: "Courier New", Courier, monospace;
  /* don't allow browser text-selection */
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }

/*
Acceptable font-family overrides for individual icons:
  "Arial", sans-serif
  "Times New Roman", serif

NOTE: use percentage font sizes or else old IE chokes
*/
.fc-icon:after {
  position: relative; }

.fc-icon-left-single-arrow:after {
  content: "\2039";
  font-weight: bold;
  font-size: 200%;
  top: -40%; }

.fc-icon-right-single-arrow:after {
  content: "\203A";
  font-weight: bold;
  font-size: 200%;
  top: -40%; }

.fc-icon-left-double-arrow:after {
  content: "\AB";
  font-size: 160%;
  top: -7%; }

.fc-icon-right-double-arrow:after {
  content: "\BB";
  font-size: 160%;
  top: -7%; }

.fc-icon-left-triangle:after {
  content: "\25C4";
  font-size: 125%;
  top: 3%; }

.fc-icon-right-triangle:after {
  content: "\25BA";
  font-size: 125%;
  top: 3%; }

.fc-icon-down-triangle:after {
  content: "\25BC";
  font-size: 125%;
  top: 2%; }

.fc-icon-x:after {
  content: "\D7";
  font-size: 200%;
  top: 6%; }

/* Popover
--------------------------------------------------------------------------------------------------*/
.fc-unthemed .fc-popover {
  border-width: 1px;
  border-style: solid; }

.fc-unthemed .fc-popover .fc-header .fc-close {
  font-size: .9em;
  margin-top: 2px; }

/* List View
--------------------------------------------------------------------------------------------------*/
.fc-unthemed .fc-list-item:hover td {
  background-color: #f5f5f5; }

/* Colors
--------------------------------------------------------------------------------------------------*/
.ui-widget .fc-disabled-day {
  background-image: none; }

/* Popover
--------------------------------------------------------------------------------------------------*/
.fc-popover > .ui-widget-header + .ui-widget-content {
  border-top: 0;
  /* where they meet, let the header have the border */ }

/* Global Event Styles
--------------------------------------------------------------------------------------------------*/
.ui-widget .fc-event {
  /* overpower jqui's styles on <a> tags. TODO: more DRY */
  color: #fff;
  /* default TEXT color */
  text-decoration: none;
  /* if <a> has an href */
  /* undo ui-widget-header bold */
  font-weight: normal; }

/* TimeGrid axis running down the side (for both the all-day area and the slot area)
--------------------------------------------------------------------------------------------------*/
.ui-widget td.fc-axis {
  font-weight: normal;
  /* overcome bold */ }

/* TimeGrid Slats (lines that run horizontally)
--------------------------------------------------------------------------------------------------*/
.fc-time-grid .fc-slats .ui-widget-content {
  background: none;
  /* see through to fc-bg */ }

.fc.fc-bootstrap3 a {
  text-decoration: none; }

.fc.fc-bootstrap3 a[data-goto]:hover {
  text-decoration: underline; }

.fc-bootstrap3 hr.fc-divider {
  border-color: inherit; }

.fc-bootstrap3 .fc-today.alert {
  border-radius: 0; }

/* Popover
--------------------------------------------------------------------------------------------------*/
.fc-bootstrap3 .fc-popover .panel-body {
  padding: 0;
  /* undo built-in padding */ }

/* TimeGrid Slats (lines that run horizontally)
--------------------------------------------------------------------------------------------------*/
.fc-bootstrap3 .fc-time-grid .fc-slats table {
  /* some themes have background color. see through to slats */
  background: none; }

/* Toolbar
--------------------------------------------------------------------------------------------------*/
.fc-toolbar {
  text-align: center; }

.fc-toolbar.fc-header-toolbar {
  margin-bottom: 1em; }

.fc-toolbar.fc-footer-toolbar {
  margin-top: 1em; }

.fc-toolbar .fc-left {
  float: left; }

.fc-toolbar .fc-right {
  float: right; }

.fc-toolbar .fc-center {
  display: inline-block; }

/* the things within each left/right/center section */
.fc .fc-toolbar > * > * {
  /* extra precedence to override button border margins */
  float: left;
  margin-left: .75em; }

/* the first thing within each left/center/right section */
.fc .fc-toolbar > * > :first-child {
  /* extra precedence to override button border margins */
  margin-left: 0; }

/* title text */
.fc-toolbar h2 {
  margin: 0; }

/* button layering (for border precedence) */
.fc-toolbar button {
  position: relative; }

.fc-toolbar .fc-state-hover,
.fc-toolbar .ui-state-hover {
  z-index: 2; }

.fc-toolbar .fc-state-down {
  z-index: 3; }

.fc-toolbar .fc-state-active,
.fc-toolbar .ui-state-active {
  z-index: 4; }

.fc-toolbar button:focus {
  z-index: 5; }

/* View Structure
--------------------------------------------------------------------------------------------------*/
/* undo twitter bootstrap's box-sizing rules. normalizes positioning techniques */
/* don't do this for the toolbar because we'll want bootstrap to style those buttons as some pt */
.fc-view-container *,
.fc-view-container *:before,
.fc-view-container *:after {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box; }

.fc-view,
.fc-view > table {
  /* so dragged elements can be above the view's main element */
  position: relative;
  z-index: 1; }

/* BasicView
--------------------------------------------------------------------------------------------------*/
/* day row structure */
.fc-basicWeek-view .fc-content-skeleton,
.fc-basicDay-view .fc-content-skeleton {
  /* there may be week numbers in these views, so no padding-top */
  padding-bottom: 1em;
  /* ensure a space at bottom of cell for user selecting/clicking */ }

.fc-basic-view .fc-body .fc-row {
  min-height: 4em;
  /* ensure that all rows are at least this tall */ }

/* a "rigid" row will take up a constant amount of height because content-skeleton is absolute */
.fc-row.fc-rigid {
  overflow: hidden; }

.fc-row.fc-rigid .fc-content-skeleton {
  position: absolute;
  top: 0;
  left: 0;
  right: 0; }

/* week and day number styling */
.fc-day-top.fc-other-month {
  opacity: 0.3; }

.fc-basic-view .fc-week-number,
.fc-basic-view .fc-day-number {
  padding: 2px; }

.fc-basic-view th.fc-week-number,
.fc-basic-view th.fc-day-number {
  padding: 0 2px;
  /* column headers can't have as much v space */ }

.fc-ltr .fc-basic-view .fc-day-top .fc-day-number {
  float: right; }

.fc-rtl .fc-basic-view .fc-day-top .fc-day-number {
  float: left; }

.fc-ltr .fc-basic-view .fc-day-top .fc-week-number {
  float: left;
  border-radius: 0 0 3px 0; }

.fc-rtl .fc-basic-view .fc-day-top .fc-week-number {
  float: right;
  border-radius: 0 0 0 3px; }

.fc-basic-view .fc-day-top .fc-week-number {
  min-width: 1.5em;
  text-align: center;
  background-color: #f2f2f2;
  color: #808080; }

/* when week/day number have own column */
.fc-basic-view td.fc-week-number {
  text-align: center; }

.fc-basic-view td.fc-week-number > * {
  /* work around the way we do column resizing and ensure a minimum width */
  display: inline-block;
  min-width: 1.25em; }

/* AgendaView all-day area
--------------------------------------------------------------------------------------------------*/
.fc-agenda-view .fc-day-grid {
  position: relative;
  z-index: 2;
  /* so the "more.." popover will be over the time grid */ }

.fc-agenda-view .fc-day-grid .fc-row {
  min-height: 3em;
  /* all-day section will never get shorter than this */ }

.fc-agenda-view .fc-day-grid .fc-row .fc-content-skeleton {
  padding-bottom: 1em;
  /* give space underneath events for clicking/selecting days */ }

/* TimeGrid axis running down the side (for both the all-day area and the slot area)
--------------------------------------------------------------------------------------------------*/
.fc .fc-axis {
  /* .fc to overcome default cell styles */
  vertical-align: middle;
  padding: 0 4px;
  white-space: nowrap; }

.fc-ltr .fc-axis {
  text-align: right; }

.fc-rtl .fc-axis {
  text-align: left; }

/* TimeGrid Structure
--------------------------------------------------------------------------------------------------*/
.fc-time-grid-container,
.fc-time-grid {
  /* so slats/bg/content/etc positions get scoped within here */
  position: relative;
  z-index: 1; }

.fc-time-grid {
  min-height: 100%;
  /* so if height setting is 'auto', .fc-bg stretches to fill height */ }

.fc-time-grid table {
  /* don't put outer borders on slats/bg/content/etc */
  border: 0 hidden transparent; }

.fc-time-grid > .fc-bg {
  z-index: 1; }

.fc-time-grid .fc-slats,
.fc-time-grid > hr {
  /* the <hr> AgendaView injects when grid is shorter than scroller */
  position: relative;
  z-index: 2; }

.fc-time-grid .fc-content-col {
  position: relative;
  /* because now-indicator lives directly inside */ }

.fc-time-grid .fc-content-skeleton {
  position: absolute;
  z-index: 3;
  top: 0;
  left: 0;
  right: 0; }

/* divs within a cell within the fc-content-skeleton */
.fc-time-grid .fc-business-container {
  position: relative;
  z-index: 1; }

.fc-time-grid .fc-bgevent-container {
  position: relative;
  z-index: 2; }

.fc-time-grid .fc-highlight-container {
  position: relative;
  z-index: 3; }

.fc-time-grid .fc-event-container {
  position: relative;
  z-index: 4; }

.fc-time-grid .fc-now-indicator-line {
  z-index: 5; }

.fc-time-grid .fc-helper-container {
  /* also is fc-event-container */
  position: relative;
  z-index: 6; }

/* TimeGrid Slats (lines that run horizontally)
--------------------------------------------------------------------------------------------------*/
.fc-time-grid .fc-slats td {
  height: 1.5em;
  border-bottom: 0;
  /* each cell is responsible for its top border */ }

.fc-time-grid .fc-slats .fc-minor td {
  border-top-style: dotted; }

/* TimeGrid Highlighting Slots
--------------------------------------------------------------------------------------------------*/
.fc-time-grid .fc-highlight-container {
  /* a div within a cell within the fc-highlight-skeleton */
  position: relative;
  /* scopes the left/right of the fc-highlight to be in the column */ }

.fc-time-grid .fc-highlight {
  position: absolute;
  left: 0;
  right: 0;
  /* top and bottom will be in by JS */ }

/* TimeGrid Event Containment
--------------------------------------------------------------------------------------------------*/
.fc-ltr .fc-time-grid .fc-event-container {
  /* space on the sides of events for LTR (default) */
  margin: 0 2.5% 0 2px; }

.fc-rtl .fc-time-grid .fc-event-container {
  /* space on the sides of events for RTL */
  margin: 0 2px 0 2.5%; }

.fc-time-grid .fc-event,
.fc-time-grid .fc-bgevent {
  position: absolute;
  z-index: 1;
  /* scope inner z-index's */ }

.fc-time-grid .fc-bgevent {
  /* background events always span full width */
  left: 0;
  right: 0; }

/* Generic Vertical Event
--------------------------------------------------------------------------------------------------*/
.fc-v-event.fc-not-start {
  /* events that are continuing from another day */
  /* replace space made by the top border with padding */
  border-top-width: 0;
  padding-top: 1px;
  /* remove top rounded corners */
  border-top-left-radius: 0;
  border-top-right-radius: 0; }

.fc-v-event.fc-not-end {
  /* replace space made by the top border with padding */
  border-bottom-width: 0;
  padding-bottom: 1px;
  /* remove bottom rounded corners */
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0; }

/* TimeGrid Event Styling
----------------------------------------------------------------------------------------------------
We use the full "fc-time-grid-event" class instead of using descendants because the event won't
be a descendant of the grid when it is being dragged.
*/
.fc-time-grid-event {
  overflow: hidden;
  /* don't let the bg flow over rounded corners */ }

.fc-time-grid-event.fc-selected {
  /* need to allow touch resizers to extend outside event's bounding box */
  /* common fc-selected styles hide the fc-bg, so don't need this anyway */
  overflow: visible; }

.fc-time-grid-event.fc-selected .fc-bg {
  display: none;
  /* hide semi-white background, to appear darker */ }

.fc-time-grid-event .fc-content {
  overflow: hidden;
  /* for when .fc-selected */ }

.fc-time-grid-event .fc-time,
.fc-time-grid-event .fc-title {
  padding: 0 1px; }

.fc-time-grid-event .fc-time {
  font-size: .85em;
  white-space: nowrap; }

/* short mode, where time and title are on the same line */
.fc-time-grid-event.fc-short .fc-content {
  /* don't wrap to second line (now that contents will be inline) */
  white-space: nowrap; }

.fc-time-grid-event.fc-short .fc-time,
.fc-time-grid-event.fc-short .fc-title {
  /* put the time and title on the same line */
  display: inline-block;
  vertical-align: top; }

.fc-time-grid-event.fc-short .fc-time span {
  display: none;
  /* don't display the full time text... */ }

.fc-time-grid-event.fc-short .fc-time:before {
  content: attr(data-start);
  /* ...instead, display only the start time */ }

.fc-time-grid-event.fc-short .fc-time:after {
  content: "\A0-\A0";
  /* seperate with a dash, wrapped in nbsp's */ }

.fc-time-grid-event.fc-short .fc-title {
  font-size: .85em;
  /* make the title text the same size as the time */
  padding: 0;
  /* undo padding from above */ }

/* resizer (cursor device) */
.fc-time-grid-event.fc-allow-mouse-resize .fc-resizer {
  left: 0;
  right: 0;
  bottom: 0;
  height: 8px;
  overflow: hidden;
  line-height: 8px;
  font-size: 11px;
  font-family: monospace;
  text-align: center;
  cursor: s-resize; }

.fc-time-grid-event.fc-allow-mouse-resize .fc-resizer:after {
  content: "="; }

/* resizer (touch device) */
.fc-time-grid-event.fc-selected .fc-resizer {
  /* 10x10 dot */
  border-radius: 5px;
  border-width: 1px;
  width: 8px;
  height: 8px;
  border-style: solid;
  border-color: inherit;
  background: #fff;
  /* horizontally center */
  left: 50%;
  margin-left: -5px;
  /* center on the bottom edge */
  bottom: -5px; }

/* Now Indicator
--------------------------------------------------------------------------------------------------*/
.fc-time-grid .fc-now-indicator-line {
  border-top-width: 1px;
  left: 0;
  right: 0; }

/* arrow on axis */
.fc-time-grid .fc-now-indicator-arrow {
  margin-top: -5px;
  /* vertically center on top coordinate */ }

.fc-ltr .fc-time-grid .fc-now-indicator-arrow {
  left: 0;
  /* triangle pointing right... */
  border-width: 5px 0 5px 6px;
  border-top-color: transparent;
  border-bottom-color: transparent; }

.fc-rtl .fc-time-grid .fc-now-indicator-arrow {
  right: 0;
  /* triangle pointing left... */
  border-width: 5px 6px 5px 0;
  border-top-color: transparent;
  border-bottom-color: transparent; }

/* List View
--------------------------------------------------------------------------------------------------*/
/* possibly reusable */
.fc-event-dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 5px; }

/* view wrapper */
.fc-rtl .fc-list-view {
  direction: rtl;
  /* unlike core views, leverage browser RTL */ }

.fc-list-view {
  border-width: 1px;
  border-style: solid; }

/* table resets */
.fc .fc-list-table {
  table-layout: auto;
  /* for shrinkwrapping cell content */ }

.fc-list-table td {
  border-width: 1px 0 0;
  padding: 8px 14px; }

.fc-list-table tr:first-child td {
  border-top-width: 0; }

/* day headings with the list */
.fc-list-heading {
  border-bottom-width: 1px; }

.fc-list-heading td {
  font-weight: bold; }

.fc-ltr .fc-list-heading-main {
  float: left; }

.fc-ltr .fc-list-heading-alt {
  float: right; }

.fc-rtl .fc-list-heading-main {
  float: right; }

.fc-rtl .fc-list-heading-alt {
  float: left; }

/* event list items */
.fc-list-item.fc-has-url {
  cursor: pointer;
  /* whole row will be clickable */ }

.fc-list-item-marker,
.fc-list-item-time {
  white-space: nowrap;
  width: 1px; }

/* make the dot closer to the event title */
.fc-ltr .fc-list-item-marker {
  padding-right: 0; }

.fc-rtl .fc-list-item-marker {
  padding-left: 0; }

.fc-list-item-title a {
  /* every event title cell has an <a> tag */
  text-decoration: none;
  color: inherit; }

.fc-list-item-title a[href]:hover {
  /* hover effect only on titles with hrefs */
  text-decoration: underline; }

/* message when no events */
.fc-list-empty-wrap2 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0; }

.fc-list-empty-wrap1 {
  width: 100%;
  height: 100%;
  display: table; }

.fc-list-empty {
  display: table-cell;
  vertical-align: middle;
  text-align: center; }

.fc-unthemed .fc-list-empty {
  /* theme will provide own background */
  background-color: var(--secondary);
}

/*! fancyBox v2.1.5 fancyapps.com | fancyapps.com/fancybox/#license */
.fancybox-wrap, .fancybox-skin, .fancybox-outer, .fancybox-inner, .fancybox-image, .fancybox-wrap iframe, .fancybox-wrap object, .fancybox-nav, .fancybox-nav span, .fancybox-tmp {
  padding: 0;
  margin: 0;
  border: 0;
  outline: none;
  vertical-align: top; }

.fancybox-wrap {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8020; }

.fancybox-skin {
  position: relative;
  background: #f9f9f9;
  color: #444;
  text-shadow: none;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px; }

.fancybox-opened {
  z-index: 8030; }

.fancybox-opened .fancybox-skin {
  -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); }

.fancybox-outer, .fancybox-inner {
  position: relative; }

.fancybox-inner {
  overflow: hidden; }

.fancybox-type-iframe .fancybox-inner {
  -webkit-overflow-scrolling: touch; }

.fancybox-error {
  color: #444;
  font: 14px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;
  margin: 0;
  padding: 15px;
  white-space: nowrap; }

.fancybox-image, .fancybox-iframe {
  display: block;
  width: 100%;
  height: 100%; }

.fancybox-image {
  max-width: 100%;
  max-height: 100%; }

#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
  background-image: url("../img/fancybox_sprite.png"); }

#fancybox-loading {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -22px;
  margin-left: -22px;
  background-position: 0 -108px;
  opacity: 0.8;
  cursor: pointer;
  z-index: 8060; }

#fancybox-loading div {
  width: 44px;
  height: 44px;
  background: url("../img/fancybox_loading.gif") center center no-repeat; }

.fancybox-close {
  position: absolute;
  top: -18px;
  right: -18px;
  width: 36px;
  height: 36px;
  cursor: pointer;
  z-index: 8040; }

.fancybox-nav {
  position: absolute;
  top: 0;
  width: 40%;
  height: 100%;
  cursor: pointer;
  text-decoration: none;
  background: transparent url("../img/blank.gif");
  /* helps IE */
  -webkit-tap-highlight-color: transparent;
  z-index: 8040; }

.fancybox-prev {
  left: 0; }

.fancybox-next {
  right: 0; }

.fancybox-nav span {
  position: absolute;
  top: 50%;
  width: 36px;
  height: 34px;
  margin-top: -18px;
  cursor: pointer;
  z-index: 8040;
  visibility: hidden; }

.fancybox-prev span {
  left: 10px;
  background-position: 0 -36px; }

.fancybox-next span {
  right: 10px;
  background-position: 0 -72px; }

.fancybox-nav:hover span {
  visibility: visible; }

.fancybox-tmp {
  position: absolute;
  top: -99999px;
  left: -99999px;
  max-width: 99999px;
  max-height: 99999px;
  overflow: visible !important; }

/* Overlay helper */
.fancybox-lock {
  overflow: visible !important;
  width: auto; }

.fancybox-lock body {
  overflow: hidden !important; }

.fancybox-lock-test {
  overflow-y: hidden !important; }

.fancybox-overlay {
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  display: none;
  z-index: 8010;
  background: url("../img/fancybox_overlay.png"); }

.fancybox-overlay-fixed {
  position: fixed;
  bottom: 0;
  right: 0; }

.fancybox-lock .fancybox-overlay {
  overflow: auto;
  overflow-y: scroll; }

/* Title helper */
.fancybox-title {
  visibility: hidden;
  font: normal 13px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;
  position: relative;
  text-shadow: none;
  z-index: 8050; }

.fancybox-opened .fancybox-title {
  visibility: visible; }

.fancybox-title-float-wrap {
  position: absolute;
  bottom: 0;
  right: 50%;
  margin-bottom: -35px;
  z-index: 8050;
  text-align: center; }

.fancybox-title-float-wrap .child {
  display: inline-block;
  margin-right: -100%;
  padding: 2px 20px;
  background: transparent;
  /* Fallback for web browsers that doesn't support RGBa */
  background: rgba(0, 0, 0, 0.8);
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
  text-shadow: 0 1px 2px #222;
  color: #FFF;
  font-weight: bold;
  line-height: 24px;
  white-space: nowrap; }

.fancybox-title-outside-wrap {
  position: relative;
  margin-top: 10px;
  color: #fff; }

.fancybox-title-inside-wrap {
  padding-top: 10px; }

.fancybox-title-over-wrap {
  position: absolute;
  bottom: 0;
  left: 0;
  color: #fff;
  padding: 10px;
  background: #000;
  background: rgba(0, 0, 0, 0.8); }

/*Retina graphics!*/
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {
  #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
    background-image: url("../img/fancybox_sprite@2x.png");
    background-size: 44px 152px;
    /*The size of the normal image, half the size of the hi-res image*/ }
  #fancybox-loading div {
    background-image: url("../img/fancybox_loading@2x.gif");
    background-size: 24px 24px;
    /*The size of the normal image, half the size of the hi-res image*/ } }

:root {
    --color-blue-200: oklch(88.2% 0.059 254.128);
    --color-blue-300: oklch(80.9% 0.105 251.813);
    --color-gray-100: oklch(96.7% 0.003 264.542);
    --color-gray-300: oklch(87.2% 0.01 258.338);
    --color-gray-800: oklch(27.8% 0.033 256.848);
    --color-gray-900: oklch(21% 0.034 264.665);
    --font-weight-bold: 700;
}

@layer utilities {

    /* ===========================
       Display / Visibility
       =========================== */
    .d-none {
        display: none !important;
    }
    .sr-only {
        clip-path: inset(50%);
        white-space: nowrap;
        border-width: 0;
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
    }

    /* ===========================
       Position
       =========================== */
    .inset-0 {
        inset: calc(var(--spacing) * 0);
    }
    .-end-0\.5 {
        inset-inline-end: calc(var(--spacing) * -0.5);
    }
    .end-0\.5 {
        inset-inline-end: calc(var(--spacing) * 0.5);
    }
    .top-7 {
        top: calc(var(--spacing) * 7);
    }
    .top-\[8\%\] {
        top: 8%;
    }
    .top-\[10\%\] {
        top: 10%;
    }
    .top-\[15px\] {
        top: 15px;
    }
    .top-\[17px\] {
        top: 17px;
    }
    .top-\[18\%\] {
        top: 18%;
    }
    .top-\[20\%\] {
        top: 20%;
    }
    .-top-\[10\%\] {
        top: -10%;
    }
    .isolate {
        isolation: isolate;
    }
    .right-2 {
        right: calc(var(--spacing) * 2);
    }
    .-right-0\.5 {
        right: calc(var(--spacing) * -0.5);
    }
    .left-\[2px\] {
        left: 2px;
    }
    .left-\[2\.2px\] {
        left: 2.2px;
    }
    .z-0 {
        z-index: 0;
    }

    /* ===========================
       Flexbox / Grid
       =========================== */
    .flex-auto {
        flex: auto;
    }
    .basis-1\/2 {
        flex-basis: 50%;
    }
    .basis-1\/4 {
        flex-basis: 25%;
    }
    .grow-1 {
        flex-grow: 1;
    }
    .shrink-1 {
        flex-shrink: 1;
    }
    .self-start {
        align-self: flex-start;
    }
    .grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .grid-cols-6 {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }
    .align-baseline {
        vertical-align: baseline;
    }

    /* ===========================
       Spacing: Margin
       =========================== */
    .m-0 {
        margin: 0;
    }
    .m-2 {
        margin: calc(var(--spacing) * 2);
    }
    .mx-0 {
        margin-left: 0;
        margin-right: 0;
    }
    .mx-0\.5 {
        margin-inline: calc(var(--spacing) * 0.5);
    }
    .mx-3 {
        margin-inline: calc(var(--spacing) * 3);
    }
    .my-1\.5 {
        margin-block: calc(var(--spacing) * 1.5);
    }
    .my-3 {
        margin-block: calc(var(--spacing) * 3);
    }
    .my-4 {
        margin-block: calc(var(--spacing) * 4);
    }
    .ms-3 {
        margin-inline-start: calc(var(--spacing) * 3);
    }
    .ms-4 {
        margin-inline-start: calc(var(--spacing) * 4);
    }
    .mt-1\.5 {
        margin-top: calc(var(--spacing) * 1.5);
    }
    .mt-10 {
        margin-top: calc(var(--spacing) * 10);
    }
    .mt-\[2px\] {
        margin-top: 2px;
    }
    .mt-\[7px\] {
        margin-top: 7px;
    }
    .mr-1\.5 {
        margin-right: calc(var(--spacing) * 1.5);
    }
    .mr-2 {
        margin-right: calc(var(--spacing) * 2);
    }
    .mr-3 {
        margin-right: calc(var(--spacing) * 3);
    }
    .mr-4 {
        margin-right: calc(var(--spacing) * 4);
    }
    .mb-0 {
        margin-bottom: calc(var(--spacing) * 0);
    }
    .mb-2\.75 {
        margin-bottom: calc(var(--spacing) * 2.75);
    }
    .mb-6 {
        margin-bottom: calc(var(--spacing) * 6);
    }
    .ml-auto {
        margin-left: auto;
    }
    .mx-auto {
        margin-inline: auto;
    }
    .-ml-px {
        margin-left: -1px;
    }
    .ml-1 {
        margin-left: calc(var(--spacing) * 1);
    }
    .ml-3 {
        margin-left: calc(var(--spacing) * 3);
    }
    .ml-10 {
        margin-left: calc(var(--spacing) * 10);
    }
    .ml-12 {
        margin-left: calc(var(--spacing) * 12);
    }
    .ml-15 {
        margin-left: calc(var(--spacing) * 15);
    }
    .-ml-2 {
        margin-left: calc(var(--spacing) * -2);
    }
    .-ml-6 {
        margin-left: calc(var(--spacing) * -6);
    }
    .-mr-2\.5 {
        margin-right: calc(var(--spacing) * -2.5);
    }
    .mt-7\.5 {
        margin-top: calc(var(--spacing) * 7.5);
    }
    .-mx-5 {
        margin-inline: calc(var(--spacing) * -5);
    }
    .-mb-5 {
        margin-bottom: calc(var(--spacing) * -5);
    }
    .-mt-5 {
        margin-top: calc(var(--spacing) * -5);
    }

    /* ===========================
       Spacing: Padding
       =========================== */
    .p-1 {
        padding: calc(var(--spacing) * 1);
    }
    .p-6 {
        padding: calc(var(--spacing) * 6);
    }
    .p-12 {
        padding: calc(var(--spacing) * 12);
    }
    .p-16 {
        padding: calc(var(--spacing) * 16);
    }
    .px-1 {
        padding-inline: calc(var(--spacing) * 1);
    }
    .px-1\.5 {
        padding-inline: calc(var(--spacing) * 1.5);
    }
    .px-8 {
        padding-inline: calc(var(--spacing) * 8);
    }
    .py-6 {
        padding-block: calc(var(--spacing) * 6);
    }
    .py-8 {
        padding-block: calc(var(--spacing) * 8);
    }
    .py-12 {
        padding-block: calc(var(--spacing) * 12);
    }
    .py-16 {
        padding-block: calc(var(--spacing) * 16);
    }
    .py-\[60px\] {
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .pe-10 {
        padding-inline-end: calc(var(--spacing) * 10);
    }
    .pt-px {
        padding-top: 1px;
    }
    .pt-1\.25 {
        padding-top: calc(var(--spacing) * 1.25);
    }
    .pt-10 {
        padding-top: calc(var(--spacing) * 10);
    }
    .pt-\[80px\] {
        padding-top: 80px;
    }
    .pr-4 {
        padding-right: calc(var(--spacing) * 4);
    }
    .pr-9 {
        padding-right: calc(var(--spacing) * 9);
    }
    .pr-10 {
        padding-right: calc(var(--spacing) * 10);
    }
    .pl-5 {
        padding-left: calc(var(--spacing) * 5);
    }
    .pl-8 {
        padding-left: calc(var(--spacing) * 8);
    }
    .pl-9 {
        padding-left: calc(var(--spacing) * 9);
    }
    .pl-11 {
        padding-left: calc(var(--spacing) * 11);
    }
    .pl-13 {
        padding-left: calc(var(--spacing) * 13);
    }
    .pb-\[5rem\] {
        padding-bottom: 5rem;
    }

    /* ===========================
       Spacing: Gap
       =========================== */
    .gap-12 {
        gap: calc(var(--spacing) * 12);
    }
    .gap-1\.75 {
        gap: calc(var(--spacing) * 1.75);
    }
    .gap-x-2 {
        column-gap: calc(var(--spacing) * 2);
    }
    .gap-x-6 {
        column-gap: 1.5rem;
    }
    .gap-y-1 {
        row-gap: calc(var(--spacing) * 1);
    }

    /* ===========================
       Spacing: Space Between
       =========================== */
    .-space-x-2 > :not(:last-child) {
        margin-inline-end: calc(var(--spacing) * -2);
    }
    .space-y-1 > :not(:last-child) {
        margin-bottom: calc(var(--spacing) * 1);
    }
    .space-x-0\.5 > :not(:last-child) {
        margin-inline-end: calc(var(--spacing) * 0.5);
    }
    .space-x-2 > :not(:last-child) {
        margin-inline-end: calc(var(--spacing) * 2);
    }
    .space-y-2\.5 > :not(:last-child) {
        margin-bottom: calc(var(--spacing) * 2.5);
    }
    .space-y-3\.5 > :not(:last-child) {
        margin-bottom: calc(var(--spacing) * 3.5);
    }
    .space-y-4\.5 > :not(:last-child) {
        margin-bottom: calc(var(--spacing) * 4.5);
    }

    /* ===========================
       Spacing: Divide
       =========================== */
    .divide-gray-200 > :not(:last-child) {
        border-color: var(--color-gray-200);
    }
    .divide-border > :not(:last-child) {
        border-color: var(--border);
    }

    /* ===========================
       Sizing: Width
       =========================== */
    .w-2 {
        width: calc(var(--spacing) * 2);
    }
    .w-4 {
        width: calc(var(--spacing) * 4);
    }
    .w-60 {
        width: calc(var(--spacing) * 60);
    }
    .w-auto {
        width: auto;
    }
    .w-fit {
        width: fit-content;
    }
    .w-px {
        width: 1px;
    }
    .w-\[2px\] {
        width: 2px;
    }
    .w-\[34px\] {
        width: 34px;
    }
    .w-\[36px\] {
        width: 36px;
        min-width: 36px;
    }
    .w-\[40px\] {
        width: 40px;
    }
    .w-\[80px\] {
        width: 80px;
    }
    .w-\[105px\] {
        width: 105px;
    }
    .w-\[110px\] {
        width: 110px;
    }
    .w-\[182px\] {
        width: 182px;
    }
    .w-\[300px\] {
        width: 300px;
    }
    .w-\[720px\] {
        width: 720px;
    }
    .w-\[870px\] {
        width: 870px;
    }
    .w-\[940px\] {
        width: 940px;
    }
    .w-\[1000px\] {
        width: 1000px;
    }

    /* ===========================
       Sizing: Height
       =========================== */
    .h-3 {
        height: calc(var(--spacing) * 3);
    }
    .h-8 {
        height: calc(var(--spacing) * 8);
    }
    .h-36 {
        height: calc(var(--spacing) * 36);
    }
    .h-100vh {
        height: 100vh;
    }
    .h-\[0\.75rem\] {
        height: 0.75rem;
    }
    .h-\[12px\] {
        height: 12px;
    }
    .h-\[24px\] {
        height: 24px;
    }
    .h-\[25px\] {
        height: 25px;
    }
    .h-\[34px\] {
        height: 34px;
    }
    .h-\[58px\] {
        height: 58px;
    }
    .h-\[65px\] {
        height: 65px;
    }
    .h-\[150px\] {
        height: 150px;
    }
    .h-\[200px\] {
        height: 200px;
    }
    .h-\[300px\] {
        height: 300px;
    }
    .h-\[400px\] {
        height: 400px;
    }
    .h-\[500px\] {
        height: 500px;
    }
    .h-\[600px\] {
        height: 600px;
    }
    .h-\[5000px\] {
        height: 5000px;
    }

    /* ===========================
       Sizing: Size (width + height)
       =========================== */
    .size-15 {
        width: calc(var(--spacing) * 15);
        height: calc(var(--spacing) * 15);
    }
    .size-24 {
        width: calc(var(--spacing) * 24);
        height: calc(var(--spacing) * 24);
    }
    .size-\[11px\] {
        width: 11px;
        height: 11px;
    }

    /* ===========================
       Sizing: Min Width
       =========================== */
    .min-w-max {
        min-width: max-content;
    }
    .min-w-\[60px\] {
        min-width: 60px;
    }
    .min-w-\[65px\] {
        min-width: 65px;
    }
    .min-w-\[66px\] {
        min-width: 66px;
    }
    .min-w-\[70px\] {
        min-width: 70px;
    }
    .min-w-\[73px\] {
        min-width: 73px;
    }
    .min-w-\[75px\] {
        min-width: 75px;
    }
    .min-w-\[77px\] {
        min-width: 77px;
    }
    .min-w-\[80px\] {
        min-width: 80px;
    }
    .min-w-\[82px\] {
        min-width: 82px;
    }
    .min-w-\[84px\] {
        min-width: 84px;
    }
    .min-w-\[85px\] {
        min-width: 85px;
    }
    .min-w-\[88px\] {
        min-width: 88px;
    }
    .min-w-\[90px\] {
        min-width: 90px;
    }
    .min-w-\[95px\] {
        min-width: 95px;
    }
    .min-w-\[105px\] {
        min-width: 105px;
    }
    .min-w-\[106px\] {
        min-width: 106px;
    }
    .min-w-\[115px\] {
        min-width: 115px;
    }
    .min-w-\[116px\] {
        min-width: 116px;
    }
    .min-w-\[125px\] {
        min-width: 125px;
    }
    .min-w-\[135px\] {
        min-width: 135px;
    }
    .min-w-\[140px\] {
        min-width: 140px;
    }
    .min-w-\[145px\] {
        min-width: 145px;
    }
    .min-w-\[201px\] {
        min-width: 201px;
    }
    .min-w-\[230px\] {
        min-width: 230px;
    }
    .min-w-\[255px\] {
        min-width: 255px;
    }
    .min-w-\[275px\] {
        min-width: 275px;
    }
    .min-w-\[290px\] {
        min-width: 290px;
    }
    .min-w-\[320px\] {
        min-width: 320px;
    }
    .min-w-\[350px\] {
        min-width: 350px;
    }
    .min-w-\[500px\] {
        min-width: 500px;
    }
    .min-w-\[880px\] {
        min-width: 880px;
    }

    /* ===========================
       Sizing: Min Height
       =========================== */
    .min-h-screen {
        min-height: 100vh;
    }
    .min-h-\[50px\] {
        min-height: 50px;
    }
    .min-h-\[170px\] {
        min-height: 170px;
    }
    .min-h-\[650px\] {
        min-height: 650px;
    }
    .min-h-\[750px\] {
        min-height: 750px;
    }
    .min-h-\[800px\] {
        min-height: 800px;
    }
    .min-h-5 {
        min-height: calc(var(--spacing) * 5);
    }
    .min-h-12 {
        min-height: calc(var(--spacing) * 12);
    }

    /* ===========================
       Sizing: Max Width
       =========================== */
    .max-w-36 {
        max-width: calc(var(--spacing) * 36);
    }
    .max-w-60 {
        max-width: calc(var(--spacing) * 60);
    }
    .max-w-72 {
        max-width: calc(var(--spacing) * 72);
    }
    .max-w-\[33vw\] {
        max-width: 33vw;
    }
    .max-w-\[10\%\] {
        max-width: 10%;
    }
    .max-w-\[20\%\] {
        max-width: 20%;
    }
    .max-w-\[70\%\] {
        max-width: 70%;
    }
    .max-w-\[110px\] {
        max-width: 110px;
    }
    .max-w-\[230px\] {
        max-width: 230px;
    }
    .max-w-\[240px\] {
        max-width: 240px;
    }
    .max-w-\[325px\] {
        max-width: 325px;
    }
    .max-w-\[345px\] {
        max-width: 345px;
    }
    .max-w-\[400px\] {
        max-width: 400px;
    }
    .max-w-\[500px\] {
        max-width: 500px;
    }
    .max-w-\[550px\] {
        max-width: 550px;
    }
    .max-w-\[580px\] {
        max-width: 580px;
    }
    .max-w-\[700px\] {
        max-width: 700px;
    }
    .max-w-\[900px\] {
        max-width: 900px;
    }
    .max-w-\[1000px\] {
        max-width: 1000px;
    }

    /* ===========================
       Sizing: Max Height
       =========================== */
    .max-h-\[35\] {
        max-height: 35px;
    }
    .max-h-\[340px\] {
        max-height: 340px;
    }
    .max-h-\[600px\] {
        max-height: 600px;
    }
    .max-h-\[90\%\] {
        max-height: 90%;
    }
    .max-h-\[95\%\] {
        max-height: 95%;
    }
    .max-h-full {
        max-height: 100%;
    }

    /* ===========================
       Typography
       =========================== */
    .font-sans {
        font-family: var(--font-sans);
    }
    .font-bold {
        --tw-font-weight: var(--font-weight-bold);
        font-weight: var(--font-weight-bold);
    }
    .text-4xl {
        font-size: var(--text-4xl);
        line-height: var(--tw-leading, var(--text-4xl--line-height));
    }
    .text-\[13px\] {
        font-size: 13px;
    }
    .capitalize {
        text-transform: capitalize;
    }
    .decoration-dotted {
        text-decoration-style: dotted;
    }
    .cursor-help {
        cursor: help;
    }
    .leading-0 {
        line-height: 0;
    }
    .nowrap {
        white-space: nowrap;
    }
    .list-decimal {
        list-style-type: decimal;
    }
    .break-all {
        line-break: anywhere;
    }
    .placeholder\:font-medium::placeholder {
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium);
    }
    .placeholder\:text-secondary-foreground::placeholder {
        color: var(--secondary-foreground);
    }

    /* ===========================
       Text Colors
       =========================== */
    .text-red-500 {
        color: #E44545;
    }
    .text-red-700 {
        color: var(--color-red-700);
    }
    .text-blue-600 {
        color: var(--color-blue-600);
    }
    .text-blue-800 {
        color: var(--color-blue-800);
    }
    .text-gray-300 {
        color: var(--color-gray-300);
    }
    .text-gray-400 {
        color: var(--color-gray-400);
    }
    .text-gray-500 {
        color: var(--color-gray-500);
    }
    .text-gray-600 {
        color: var(--color-gray-600);
    }
    .text-gray-700 {
        color: var(--color-gray-700);
    }
    .text-gray-800 {
        color: var(--color-gray-800);
    }
    .text-gray-900 {
        color: var(--color-gray-900);
    }

    /* ===========================
       Background Colors
       =========================== */
    .bg-\[\#fefefe\] {
        background-color: #fefefe;
    }
    .bg-accent {
        background-color: var(--accent);
    }
    .bg-red-100 {
        background-color: var(--color-red-100);
    }
    .bg-blue-50 {
        background-color: var(--color-blue-50);
    }
    .bg-blue-100 {
        background-color: var(--color-blue-100);
    }
    .bg-blue-500 {
        background-color: var(--color-blue-500);
    }
    .bg-blue-600 {
        background-color: var(--color-blue-600);
    }
    .bg-gray-50 {
        background-color: var(--color-gray-50);
    }
    .bg-gray-100 {
        background-color: var(--color-gray-100);
    }
    .bg-gray-300 {
        background-color: var(--color-gray-300);
    }
    .bg-gray-400 {
        background-color: var(--color-gray-400);
    }
    .bg-gray-500 {
        background-color: var(--color-gray-500);
    }
    .bg-gray-600 {
        background-color: var(--color-gray-600);
    }
    .bg-gray-700 {
        background-color: var(--color-gray-700);
    }
    .bg-gray-900 {
        background-color: var(--color-gray-900);
    }
    .bg-secondary-foreground {
        background-color: var(--secondary-foreground);
    }

    @supports (color: color-mix(in lab, red, red)) {
        .bg-muted-foreground\/60 {
            background-color: color-mix(in oklab, var(--muted-foreground) 60%, transparent);
        }
    }

    /* ===========================
       Border Width
       =========================== */
    .border-x-0 {
        border-right: 0;
        border-left: 0;
    }
    .border-4 {
        border-style: var(--tw-border-style);
        border-width: 4px;
    }
    .border-t-0 {
        border-top-style: var(--tw-border-style);
        border-top-width: 0;
    }
    .border-b-3 {
        border-bottom-style: var(--tw-border-style);
        border-bottom-width: 3px;
    }
    .border-l {
        border-left-style: var(--tw-border-style);
        border-left-width: 1px;
    }
    .border-l-2 {
        border-left-style: var(--tw-border-style);
        border-left-width: 2px;
    }

    /* ===========================
       Border Colors
       =========================== */
    .border-red-500 {
        border-color: var(--color-red-500);
    }
    .border-red-700 {
        border-color: var(--color-red-700);
    }
    .border-blue-500 {
        border-color: var(--color-blue-500);
    }
    .border-gray-200 {
        border-color: var(--color-gray-200);
    }
    .border-gray-300 {
        border-color: var(--color-gray-300);
    }
    .border-muted-foreground {
        border-color: var(--muted-foreground);
    }
    .border-s-gray-300 {
        border-inline-start-color: var(--color-gray-300);
    }
    .border-t-gray-200 {
        border-top-color: var(--color-gray-200);
    }
    .border-r-gray-200 {
        border-right-color: var(--color-gray-200);
    }
    .border-b-gray-200 {
        border-bottom-color: var(--color-gray-200);
    }
    .border-b-primary {
        border-bottom-color: var(--primary);
    }
    .border-l-gray-300 {
        border-left-color: var(--color-gray-300);
    }

    /* ===========================
       Border Radius
       =========================== */
    .rounded-none {
        border-radius: 0;
    }
    .rounded-r-none {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }
    .rounded-l-none {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }
    .rounded-t {
        border-top-left-radius: .25rem;
        border-top-right-radius: .25rem;
    }
    .rounded-b {
        border-bottom-right-radius: .25rem;
        border-bottom-left-radius: .25rem;
    }
    .rounded-l-\[6px\] {
        border-top-left-radius: 6px;
        border-bottom-left-radius: 6px;
    }
    .rounded-r-\[6px\] {
        border-top-right-radius: 6px;
        border-bottom-right-radius: 6px;
    }

    /* ===========================
       Outline
       =========================== */
    .outline-2 {
        outline-style: var(--tw-outline-style);
        outline-width: 2px;
    }
    .outline-3 {
        outline-style: var(--tw-outline-style);
        outline-width: 3px;
    }
    .outline-background {
        outline-color: var(--background);
    }
    .outline-gray-50 {
        outline-color: var(--color-gray-50);
    }

    @supports (color: color-mix(in lab, red, red)) {
        .outline-muted\/70 {
            outline-color: color-mix(in oklab, var(--muted) 70%, transparent);
        }
    }

    /* ===========================
       Ring
       =========================== */
    .ring-inset {
        --tw-ring-inset: inset;
    }
    .ring-blue-300 {
        --tw-ring-color: var(--color-blue-300);
    }

    /* ===========================
       Shadow
       =========================== */
    .shadow-sm {
        --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    .shadow-lg {
        --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, #0000001a), 0 4px 6px -4px var(--tw-shadow-color, #0000001a);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    .shadow-primary {
        --tw-shadow-color: var(--primary);
    }

    /* ===========================
       Effects
       =========================== */
    .opacity-0 {
        opacity: 0;
    }
    .opacity-50 {
        opacity: .5;
    }
    .opacity-100 {
        opacity: 1;
    }
    .cursor-not-allowed {
        cursor: not-allowed;
    }
    .overflow-visible {
        overflow: visible;
    }
    .overflow-y-hidden {
        overflow-y: hidden;
    }

    /* ===========================
       Transforms
       =========================== */
    .translate-y-0 {
        --tw-translate-y: calc(var(--spacing) * 0);
        translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    .translate-y-2 {
        --tw-translate-y: calc(var(--spacing) * 2);
        translate: var(--tw-translate-x) var(--tw-translate-y);
    }

    /* ===========================
       Transitions
       =========================== */
    .transition-opacity {
        transition-property: opacity;
        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
        transition-duration: var(--tw-duration, var(--default-transition-duration));
    }
    .duration-700 {
        --tw-duration: .7s;
        transition-duration: .7s;
    }

    /* ===========================
       Responsive: sm (max-width: 48rem)
       =========================== */
    @media (max-width: 48rem) {
        .sm\:static {
            position: static;
        }
        .sm\:hidden {
            display: none;
        }
        .sm\:flex-col {
            flex-direction: column;
        }
        .sm\:justify-start {
            justify-content: start;
        }
        .sm\:mb-5 {
            margin-bottom: calc(var(--spacing) * 5);
        }
        .sm\:pt-\[30px\] {
            padding-top: 40px;
        }
        .sm\:pt-\[70px\] {
            padding-top: 70px;
        }
        .sm\:px-\[25px\] {
            padding-inline: 25px;
        }
        .sm\:min-h-\[950px\] {
            min-height: 950px;
        }
    }

    /* ===========================
       Responsive: sm (min-width: 40rem)
       =========================== */
    @media (min-width: 40rem) {
        .sm\:flex {
            display: flex;
        }
        .sm\:mt-0 {
            margin-top: calc(var(--spacing) * 0);
        }
        .sm\:gap-6 {
            gap: calc(var(--spacing) * 6);
        }
    }

    /* ===========================
       Responsive: md (min-width: 48rem)
       =========================== */
    @media (min-width: 48rem) {
        .md\:hidden {
            display: none;
        }
        .md\:grow-0 {
            flex-grow: 0;
        }
        .md\:mx-\[80px\] {
            margin-right: 80px;
            margin-left: 80px;
        }
        .md\:px-\[25px\] {
            padding-inline: 25px;
        }
    }

    /* ===========================
       Responsive: lg (min-width: 64rem)
       =========================== */
    @media (min-width: 64rem) {
        .lg\:block {
            display: block;
        }
        .lg\:inline-block {
            display: inline-block;
        }
        .lg\:flex-\[0_0_25\%\] {
            flex: 0 0 25%;
        }
        .lg\:flex-\[1_1_75\%\] {
            flex: 1 1 75%;
        }
        .lg\:grid-cols-4 {
            grid-template-columns: repeat(4, minmax(0, 1fr));
        }
        .lg\:left-auto {
            left: auto;
        }
        .lg\:top-\[110px\] {
            top: 110px;
        }
        .lg\:z-20 {
            z-index: 20;
        }
        .lg\:-ml-2 {
            margin-left: calc(var(--spacing) * -2);
        }
        .lg\:ml-\[240px\] {
            margin-left: 240px;
        }
        .lg\:mr-\[280px\] {
            margin-right: 280px;
        }
        .lg\:mb-5 {
            margin-bottom: calc(var(--spacing) * 5);
        }
        .lg\:mb-16 {
            margin-bottom: calc(var(--spacing) * 16);
        }
        .lg\:min-h-5 {
            min-height: calc(var(--spacing) * 5);
        }
        .lg\:w-56 {
            width: calc(var(--spacing) * 56);
        }
        .lg\:w-\[280px\] {
            width: 280px;
        }
        .lg\:w-\[300px\] {
            width: 300px;
        }
        .lg\:w-\[500px\] {
            width: 500px;
        }
        .lg\:w-\[600px\] {
            width: 600px;
        }
        .lg\:h-\[80px\] {
            height: 80px;
        }
        .lg\:min-w-0 {
            min-width: calc(var(--spacing) * 0);
        }
        .lg\:min-w-\[360px\] {
            min-width: 360px;
        }
        .lg\:max-w-\[500px\] {
            max-width: 500px;
        }
        .lg\:max-w-\[800px\] {
            max-width: 800px;
        }
        .lg\:max-w-\[1100px\] {
            max-width: 1100px;
        }
        .lg\:gap-16 {
            gap: calc(var(--spacing) * 16);
        }
        .lg\:px-8 {
            padding-inline: calc(var(--spacing) * 8);
        }
        .lg\:px-\[60px\] {
            padding-inline: 60px;
        }
        .lg\:py-16 {
            padding-block: calc(var(--spacing) * 16);
        }
        .lg\:pe-5 {
            padding-inline-end: calc(var(--spacing) * 5);
        }
        .lg\:pl-2 {
            padding-left: calc(var(--spacing) * 2);
        }
        .lg\:pt-\[110px\] {
            padding-top: 110px;
        }
        .lg\:translate-x-0 {
            --tw-translate-x: calc(var(--spacing) * 0);
            translate: var(--tw-translate-x) var(--tw-translate-y);
        }
        .dark\:lg\:hidden:is(.dark *) {
            display: none;
        }
        .dark\:lg\:inline-block:is(.dark *) {
            display: inline-block;
        }
        .lg\:dark\:bg-transparent:is(.dark *) {
            background-color: transparent;
        }
    }

    /* ===========================
       Responsive: xl (min-width: 80rem)
       =========================== */
    @media (min-width: 80rem) {
        .xl\:hidden {
            display: none !important;
        }
        .xl\:block {
            display: block;
        }
        .xl\:mx-auto {
            margin-inline: auto;
        }
        .xl\:max-w-\[90rem\] {
            max-width: 90rem;
        }
        .xl\:w-\[33\%\] {
            width: 33%;
        }
    }

    /* ===========================
       Responsive: sticky navbar
       =========================== */
    @media (max-width: 1024px) {
        :root {
            --nav-x-margin: 0;
            --sticky-offset: 58px;
        }
    }
}

/* ==========================================================================
   Pseudo-class / State Variants
   ========================================================================== */

/* --- Hover --- */
@media (hover: hover) {
    .hover\:bg-accent:hover {
        background-color: var(--accent);
    }
    .hover\:bg-blue-50:hover {
        background-color: var(--color-blue-50);
    }
    .hover\:bg-blue-200:hover {
        background-color: var(--color-blue-200);
    }
    .hover\:bg-blue-600:hover {
        background-color: var(--color-blue-600);
    }
    .hover\:bg-blue-700:hover {
        background-color: var(--color-blue-700);
    }
    .hover\:bg-gray-100:hover {
        background-color: var(--color-gray-100);
    }
    .hover\:bg-gray-200:hover {
        background-color: var(--color-gray-200);
    }
    .hover\:text-blue-600:hover {
        color: var(--color-blue-600);
    }
    .hover\:text-gray-600:hover {
        color: var(--color-gray-600);
    }
    .hover\:text-gray-700:hover {
        color: var(--color-gray-700);
    }
    .hover\:shadow:hover {
        --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    .hover\:shadow-primary:hover {
        --tw-shadow-color: var(--primary);
    }

    @supports (color: color-mix(in lab, red, red)) {
        .hover\:shadow-primary:hover {
            --tw-shadow-color: color-mix(in oklab, var(--primary) var(--tw-shadow-alpha), transparent);
        }
    }
}

/* --- Focus --- */
.focus\:outline-none:focus {
    --tw-outline-style: none;
    outline-style: none;
}
.focus\:z-10:focus {
    z-index: 10;
}
.focus\:ring-2:focus {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
.focus\:ring-blue-500:focus {
    --tw-ring-color: var(--color-blue-500);
}

/* --- Active --- */
.active\:text-primary:active {
    color: var(--primary);
}

/* --- Before pseudo-element --- */
.before\:border-gray-200:before {
    border-color: var(--color-gray-200);
}
.before\:left-\[10px\]:before {
    left: 10px;
}
.before\:left-px:before {
    left: 1px;
}
.before\:left-\[2px\]:before {
    left: 2px;
}
.before\:left-\[2\.2px\]:before {
    left: 2.2px;
}

/* --- Dark mode --- */
.dark\:flex:is(.dark *) {
    display: flex;
}
.dark\:bg-transparent:is(.dark *) {
    background-color: transparent;
}
.dark\:border-gray-100:is(.dark *) {
    border-color: var(--color-gray-100);
}

/* --- Light mode --- */
.light\:bg-\[\#fefefe\] {
    background-color: #fefefe;
}
.light\:border-gray-100 {
    border-color: var(--color-gray-100);
}
.light\:border-gray-300 {
    border-color: var(--color-gray-300);
}

/* --- Group hover --- */
.group-hover\:flex:is(:where(.group):hover *) {
    display: flex;
}
.group-hover\:opacity-100:is(:where(.group):hover *) {
    opacity: 1;
}
.group-focus\:opacity-100:is(:where(.group):focus *) {
    opacity: 1;
}

/* ==========================================================================
   Metronic 9 Component Styles (kt-*)
   ==========================================================================
   Global customizations and extensions to KTUI (Metronic 9 Tailwind)
   components. Page-scoped kt-* rules belong in theme.custom.scss instead.
   ========================================================================== */

/* KT UI's stock rules color only SVG children of .kt-alert-icon (`.kt-alert-icon > svg`),
   but this codebase uses Keen font icons (`<i class="ki-filled ...">`). Mirror every
   variant color rule for <i> children so the icon picks up the variant color instead of
   inheriting the alert body's foreground (which renders black on light success/etc.).
   Also mirror the size rules from .kt-alert / .kt-alert-sm / .kt-alert-lg so <i> icons
   scale the same as the documented <svg> children. */

.kt-alert .kt-alert-icon > i {
  font-size: calc(var(--spacing) * 5);
  line-height: 1;
}
.kt-alert-sm .kt-alert-icon > i {
  font-size: calc(var(--spacing) * 4);
}
.kt-alert-lg .kt-alert-icon > i {
  font-size: calc(var(--spacing) * 6);
}

/* Light style: body is --foreground, so the icon needs an explicit variant color. */
.kt-alert-light {
  .kt-alert-icon > i {
    color: var(--muted-foreground);
  }
  &.kt-alert-primary .kt-alert-icon > i {
    color: var(--primary);
  }
  &.kt-alert-destructive .kt-alert-icon > i {
    color: var(--destructive);
  }
  &.kt-alert-success .kt-alert-icon > i {
    color: var(--color-green-500);
  }
  &.kt-alert-info .kt-alert-icon > i {
    color: var(--color-violet-500);
  }
  &.kt-alert-warning .kt-alert-icon > i {
    color: var(--color-yellow-500);
  }
}

/* Mono-combo style: mirror the .kt-alert-icon color rules for <i> children so font
   icons pick up the variant accent. */
.kt-alert-mono {
  &.kt-alert-primary .kt-alert-icon > i {
    color: var(--primary);
  }
  &.kt-alert-success .kt-alert-icon > i {
    color: var(--color-green-500);
  }
  &.kt-alert-destructive .kt-alert-icon > i {
    color: var(--destructive);
  }
  &.kt-alert-warning .kt-alert-icon > i {
    color: var(--color-yellow-500);
  }
  &.kt-alert-info .kt-alert-icon > i {
    color: var(--color-violet-600);
  }
}

/* KTUI hides the native <select> and renders .kt-select-wrapper > .kt-select-display
   as the visible control. jQuery Unobtrusive Validation skips hidden fields
   (`ignore: :hidden`), so `.input-validation-error` is never added to the
   native select — our only reliable error signal is the sibling
   `.field-validation-error` message emitted by `@Html.ValidationMessageFor`.
   Also keep the server-side path working in case the select is rendered with
   `.input-validation-error` already applied. */
.kt-select-wrapper:has(~ .field-validation-error) .kt-select-display,
select[data-kt-select].input-validation-error ~ .kt-select-wrapper .kt-select-display {
  border-color: var(--destructive, #e84556) !important;
  background-color: color-mix(in oklab, var(--destructive, #e84556) 8%, var(--background)) !important;
}

/* Bare native <select class="kt-select"> (no data-kt-select wrapper) — used in
   places like GroupPunch Step 3 per-employee selects. JS-side validation tags
   the failing select with .has-error to mirror the destructive look applied
   above when KTUI wraps the control. */
select.kt-select.has-error {
  border-color: var(--destructive, #e84556) !important;
}

/* Tailwind's preflight resets `ol, ul, menu { list-style: none }` and the
   `list-disc` utility is NOT generated when the only usage sites are .cshtml
   views (Tailwind only scans configured globs). Restore bullet markers when
   a <ul> appears inside a .kt-alert — the canonical pattern for showing a
   list of validation messages (see Views/Shared/metronic/_ValidationSummary
   .cshtml). Padding-left provides room for the markers to render inside the
   alert content. Marker color follows the variant accent (same colors KTUI
   applies to .kt-alert-icon > svg) so bullets read as part of the alert
   theme rather than the muted body text. */
.kt-alert ul {
  list-style: disc outside;
  padding-left: 1.25rem;
}
.kt-alert.kt-alert-primary ul ::marker,
.kt-alert.kt-alert-light.kt-alert-primary ul ::marker {
  color: var(--primary);
}
.kt-alert.kt-alert-success ul ::marker,
.kt-alert.kt-alert-light.kt-alert-success ul ::marker {
  color: var(--color-green-500);
}
.kt-alert.kt-alert-info ul ::marker,
.kt-alert.kt-alert-light.kt-alert-info ul ::marker {
  color: var(--color-violet-500);
}
.kt-alert.kt-alert-warning ul ::marker,
.kt-alert.kt-alert-light.kt-alert-warning ul ::marker {
  color: var(--color-yellow-500);
}

/* KTUI's .kt-select-placeholder has overflow/text-overflow/nowrap but no
   min-width constraint, so inside the flex .kt-select-display its intrinsic
   min-width keeps the text wider than its container and it pushes into the
   trailing arrow (background-image). Allow it to actually shrink + ellipsize.
   The non-multiple display already truncates (KTUI line 4500); the multi-
   select display does not, so this rule fills that gap. */
.kt-select-placeholder {
  min-width: 0;
}
.kt-select-display[data-multiple="true"] {
  min-width: 0;
}

// KT modals must stack above page content. Some pages (e.g. Schedule) set
// elevated z-index on toolbar buttons (.fc-button at 10, publish/send buttons
// at 100), which otherwise bleed through the modal backdrop.
.kt-modal {
  z-index: 1050;
}
.kt-modal-backdrop {
  z-index: 1040;
}

/* KTUI's .kt-modal-center positions .kt-modal-content with top: 50% +
   translateY(-50%). When the content is taller than the viewport, that pulls
   the content's top edge above the scroll container's origin, where scrolling
   can never reach it — the modal header becomes unreachable on short windows
   (e.g. the Schedule shift modals). Center with flex auto margins instead:
   the open modal becomes a flex scrollport, a modal that fits stays centered,
   and one that overflows top-aligns so both header and footer can be scrolled
   to. Scoped to .open (KTModal) and .show (bootstrap modal JS, which drives
   the Schedule modals) with !important because both libraries set an inline
   `display: block` that must lose to the flex layout while the modal is
   visible.

   NOTE: KTModal drops `open` before it clears the inline `display: block`,
   so this rule alone leaves a dismiss gap where the still-painted modal
   falls out of flex layout and snaps to the top of the viewport (AB#14174).
   The metronic _Layout.cshtml closes that gap globally by hiding the
   element on the 'hide' event. */
.kt-modal.kt-modal-center.open:not(.kt-modal-fit),
.kt-modal.kt-modal-center.show:not(.kt-modal-fit) {
  display: flex !important;
}

.kt-modal.kt-modal-center:not(.kt-modal-fit) .kt-modal-content {
  top: 0;
  translate: none;
  margin-block: auto;
}

/* KT Select popover guard — KTUI's _setDropdownWidth writes
   `style.width = "<trigger>px"` inline on every open, which pins the popover
   to the trigger width and clips long option labels. Override to content
   width (max-content) so options render on one line when they fit; cap with
   max-width so a very long unbreakable string can't push the popover
   hundreds of pixels wide and trigger Popper's preventOverflow to shift it
   off-anchor (originally reproducible on the Availability scheduleFilter
   selects). When the cap is hit, .kt-select-option-text below wraps the text. */
.kt-select-dropdown {
    width: max-content !important;
    max-width: min(80vw, 32rem);
}

.kt-select-dropdown .kt-select-option-text {
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* AB#14218 — inside a modal/drawer, tighten the max-content cap further.
   The 32rem (512px) cap above is wider than the ~500px shift/availability
   modals (.kt-modal-content is max-w-[500px]), and their pickers sit in a
   3-col grid where the control column (col-span-2) starts ~1/3 in. When a
   picker has long option labels (Location, Position), the content-width
   popover grows wider than its trigger; Popper's preventOverflow then pins
   the popover's right edge to the modal boundary and grows it LEFT, so it
   renders shifted off to the left of the trigger (while short-label pickers
   like Department Code stay aligned). Capping to 19rem keeps the popover
   within the control column so it stays anchored under the trigger; long
   labels wrap via the overflow-wrap rule above instead of pushing it wide. */
:is(.modal, .kt-modal, .kt-drawer) .kt-select-dropdown {
    max-width: min(80vw, 19rem);
}

/* Default the kt-select dropdown beneath the fixed header (z-index 20) and
   nav (z-index 10) so page chrome stays on top while the page is scrolled
   with the dropdown open. KTSelect writes z-index inline on the dropdown
   element — both via its template literal (default 105) and at show time
   via a `style.zIndex` assignment — so !important is required to win the
   cascade. The dropdown's containing block is the initial CB (the wrapper
   is not positioned), so it already escapes any `.kt-card.overflow-hidden`
   ancestor; only the stacking layer needs adjustment. Mirrors the
   .vc[data-vc=calendar][data-vc-input] override above. */
.kt-select-dropdown {
    z-index: 25 !important;
}

/* Inside a modal or drawer, lift the dropdown above the edit-punch sliding
   drawer (z-index 1002) and the modal backdrop (z-index 1040). */
:is(.modal, .kt-modal, .kt-drawer) .kt-select-dropdown {
    z-index: 1060 !important;
}

/* KTUI's thin themed scrollbar (the .kt-scrollable rules in ktui/styles.css)
   only applies when the dropdown's inner list carries the .kt-scrollable
   class — set via the `optionsClass` config on the select. Selects that
   don't pass `optionsClass` fall back to the OS default scrollbar, which
   is wider, OS-themed, and looks different from the KTUI docs demo.
   Replicate the kt-scrollable treatment on every scrollable descendant
   of .kt-select-dropdown so the dropdown matches the docs regardless of
   optionsClass, driven by KTUI's own --kt-scrollable-thumb-color and
   --kt-scrollable-scrollbar-size variables. */
.kt-select-dropdown ::-webkit-scrollbar {
    width: var(--kt-scrollable-scrollbar-size, 5px);
    height: var(--kt-scrollable-scrollbar-size, 5px);
}

.kt-select-dropdown ::-webkit-scrollbar-track {
    background: transparent;
}

.kt-select-dropdown ::-webkit-scrollbar-thumb {
    background: var(--kt-scrollable-thumb-color, var(--color-accent));
    border-radius: var(--kt-scrollable-scrollbar-size, 5px);
}

.kt-select-dropdown,
.kt-select-dropdown * {
    scrollbar-width: thin;
    scrollbar-color: var(--kt-scrollable-thumb-color, var(--color-accent)) transparent;
}

/* Dark mode: lift the thumb toward the foreground so it stays visible
   on the dark card. Redefine the variable on the dropdown so it
   cascades into every scrollable descendant. */
.dark .kt-select-dropdown {
    --kt-scrollable-thumb-color: color-mix(in oklab, var(--foreground) 25%, var(--card, #1c1c1e));
}

/* KTUI ships .kt-select at 0.8125rem (13px); every other .kt-select-* element
   already uses var(--text-sm) (14px). Bump the trigger to match so the control
   reads the same size as its dropdown contents.

   :not(.kt-select-sm) excludes the small variant — its own 12px rule has equal
   specificity to a bare `.kt-select`, and our override appears later in the
   cascade, so without the negation we'd unintentionally bump sm selects too. */
.kt-select:not(.kt-select-sm) {
    font-size: var(--text-sm);
}

.kt-label {
  line-height: 1.5;
}
/* KTUI's .kt-label is the wrapper for a checkbox / switch / radio + its inline
   text. Default browser cursor on <label> is text/arrow, so the wrapping label
   doesn't communicate that it's interactive. Restore the pointer cursor while
   the control is enabled, and surface disabled state explicitly. Scoped via
   :has() so plain text labels (e.g. .kt-form-label on stacked form fields)
   are unaffected. */
.kt-label:has(> .kt-radio),
.kt-label:has(> .kt-checkbox),
.kt-label:has(> .kt-switch) {
  cursor: pointer;
}
.kt-label:has(> .kt-radio:disabled),
.kt-label:has(> .kt-checkbox:disabled),
.kt-label:has(> .kt-switch:disabled) {
  cursor: not-allowed;
}

/* --- Keenthemes Components --- */
.kt-menu-title {
    font-size: 13px;
    font-weight: 500;
}

/* Restyle spec G2: header labels are weight 400 (stock) — the old
   `:not(.font-normal) { font-weight: 600 }` bump is gone. */

/* KTUI defaults force nowrap on header labels, which makes long titles
   expand the column instead of wrapping. Allow normal word-wrap so the
   browser's auto-layout can size columns to the actual data, not the label. */
.kt-table thead th {
    white-space: normal;
    overflow-wrap: break-word;
}

.kt-table thead .kt-table-col-label {
    white-space: normal;
    flex-wrap: wrap;
}

.kt-table-sm tbody td,
.kt-table-sm tfoot td {
    padding-inline: calc(var(--spacing) * 2);
    padding-block: calc(var(--spacing) * 2);
    vertical-align: middle;
}

.kt-table-bordered td {
    border: 1px solid var(--border);
}

.kt-btn-success {
    background-color: #00B47D;
    color: #ffffff;
}

.kt-btn-success:hover {
    background-color: #009a6b;
    color: #ffffff;
}

.kt-btn-success-light {
    background-color: #D4F1E5;
    color: #00B47D;
}

.kt-btn-success-light:hover {
    background-color: #C0E9D7;
    color: #00B47D;
}

.kt-select-tag {
    max-width: max-content !important;
}

/* Fallback scroll cap for dropdowns whose options list has NO max-height of its
   own (a few selects pass `optionsClass: "kt-scrollable overflow-auto"` with no
   max-h-*). Without this they'd grow unbounded. */
.kt-select-dropdown.open {
    max-height: 50vh;
    overflow-y: auto;
}

/* The popover and its inner options list must not BOTH be scroll containers.
   Almost every kt-select passes `optionsClass: "kt-scrollable overflow-auto
   max-h-[Npx]"`, which makes the options list its own (correct) scroller — the
   one that keeps any search box / select-all header pinned. The 50vh popover
   cap above then adds a SECOND, redundant scroller nested around it. That extra
   scrollbar is invisible while 50vh stays above the list's own max-height, but
   becomes a visible double scrollbar the moment 50vh drops below it — e.g. the
   OverTimeSettings overtime-type list (max-h-[400px]) at >100% browser zoom,
   where the viewport-relative 50vh shrinks under 400px. When the list owns a
   real cap (kt-scrollable + a max-h-* class), let it be the sole scroller and
   size the popover to its content. Scoped to lists that carry a max-h-* class
   so the no-cap selects above keep the 50vh fallback. */
.kt-select-dropdown.open:has(.kt-select-options.kt-scrollable[class*="max-h-"]),
.kt-select-dropdown.open:has([data-kt-select-options].kt-scrollable[class*="max-h-"]) {
    max-height: none;
    overflow: visible;
}

/* Validation error state — match legacy pink fill + red border */
.input-validation-error,
.kt-input:has(.grow.input-validation-error) {
    border-color: var(--destructive, #e84556) !important;
}
/* Pink fill excludes checkbox/radio/switch — they use background-color for
   their checked state, which the fill would mask (AB#13384 #7). Border only. */
.input-validation-error:not(.kt-checkbox):not(.kt-radio):not(.kt-switch),
.kt-input:has(.grow.input-validation-error) {
    background-color: color-mix(in oklab, var(--destructive, #e84556) 8%, var(--background)) !important;
}

/* Join consecutive addons inside an input-group (the bundled Metronic 9 CSS
   only handles the input↔addon transition; chained addons fall through to
   default rounded borders and visually detach). Flatten the right edge of
   each addon that's followed by another addon, and the left edge of each
   addon that follows another addon. */
.kt-input-group .kt-input-addon:has(+ .kt-input-addon) {
    border-start-end-radius: 0 !important;
    border-end-end-radius: 0 !important;
    border-inline-end-width: 0 !important;
}
.kt-input-group .kt-input-addon + .kt-input-addon {
    border-start-start-radius: 0 !important;
    border-end-start-radius: 0 !important;
}

/* Gray out the entire input group when its input is disabled */
.kt-input-group:has(.kt-input:disabled) {
    pointer-events: none;
}

.kt-input-group:has(.kt-input:disabled) .kt-input {
    background-color: var(--muted);
}

.kt-input-group:has(.kt-input:disabled) .kt-input-addon {
    background-color: var(--muted);
    opacity: 0.7;
}

.ki-loading {
    display: inline-block;
    animation: spin 1s linear infinite;
}

.ki-modal {
    background-color: #0000005c !important;
}

/* Ensure modals and backdrops render above the sticky header (z-20) */
.kt-modal {
    z-index: 50;
}

.kt-modal-backdrop {
    z-index: 40;
}


/* ============================================================================
   Restyle spec (bp-restyle-spec) — global component values, both themes.
   Skin-only: geometry and color; no layout or behavior. Token blocks
   (--header-foreground, light --background) live in theme.custom.scss.
   ============================================================================ */

/* G3 — header top border. Column bars (kt-table-border td/th inline-end) and
   row bottom borders already render; inside card wrappers the table's OUTER
   frame stays suppressed (the card edge is the frame), so the one missing
   piece is the line above the header band. */
.kt-table-border thead tr {
  border-top: 1px solid var(--border);
}

/* G6 — slim scrollbars on every table wrapper / overflow container. */
.kt-table-wrapper,
.kt-scrollable,
.overflow-x-auto,
.overflow-auto {
  scrollbar-width: thin;
  scrollbar-color: oklch(35% 0.01 286) transparent;
}
:is(.kt-table-wrapper, .kt-scrollable, .overflow-x-auto, .overflow-auto)::-webkit-scrollbar {
  height: 8px;
  width: 8px;
}
:is(.kt-table-wrapper, .kt-scrollable, .overflow-x-auto, .overflow-auto)::-webkit-scrollbar-track {
  background: transparent;
}
:is(.kt-table-wrapper, .kt-scrollable, .overflow-x-auto, .overflow-auto)::-webkit-scrollbar-thumb {
  background: oklch(35% 0.01 286);
  border-radius: 99px;
}
:is(.kt-table-wrapper, .kt-scrollable, .overflow-x-auto, .overflow-auto)::-webkit-scrollbar-thumb:hover {
  background: oklch(44.2% 0.017 285.786);
}
html:not(.dark) :is(.kt-table-wrapper, .kt-scrollable, .overflow-x-auto, .overflow-auto) {
  scrollbar-color: oklch(84% 0.004 286) transparent;
}
html:not(.dark) :is(.kt-table-wrapper, .kt-scrollable, .overflow-x-auto, .overflow-auto)::-webkit-scrollbar-thumb {
  background: oklch(84% 0.004 286);
}

/* G7 — kt-btn-sm geometry: 30px tall, 11px inline padding, 13px / 500 text
   (vendor ships 28px / 10px / 12px). Radius 6px and the subtle shadow come
   from the vendor base. */
.kt-btn-sm {
  height: 30px;
  padding-inline: 11px;
  font-size: 0.8125rem;
}

/* G7 — row-level XS buttons (Add Break, Assign Shift, + Add, Apply to All).
   Class applied in the views that carry those controls. */
.kt-btn-xs {
  height: 26px;
  gap: calc(var(--spacing) * 1);
  border-radius: calc(var(--radius) - 2px);
  padding-inline: 9px;
  font-size: var(--text-xs);
  line-height: var(--tw-leading, var(--text-xs--line-height));
}

/* G8 — badge geometry: 22px / 0 8px / radius 6 / 12px 500 (vendor: 24px). */
.kt-badge {
  height: 22px;
  min-width: 22px;
  padding-inline: 8px;
}

/* G8 — badge variant recipes. The light-tint variants (`kt-badge-light`, the
   BP default) get the spec's bordered tint pattern: primary hue 259.815,
   success hue 150, warn hue 85 — dark theme rows first, then the L4 light
   equivalents. Destructive follows the same pattern (hue 25) so status chips
   stay consistent. */
.dark .kt-badge-light.kt-badge-primary {
  border: 1px solid oklch(37% 0.1 259.815);
  background-color: oklch(25% 0.06 259.815);
  color: oklch(75% 0.12 259.815);
}
.dark .kt-badge-light.kt-badge-success {
  border: 1px solid oklch(37% 0.1 150);
  background-color: oklch(25% 0.06 150);
  color: oklch(75% 0.12 150);
}
.dark .kt-badge-light.kt-badge-warning {
  border: 1px solid oklch(37% 0.1 85);
  background-color: oklch(25% 0.06 85);
  color: oklch(75% 0.12 85);
}
.dark .kt-badge-light.kt-badge-destructive {
  border: 1px solid oklch(37% 0.12 25);
  background-color: oklch(25% 0.07 25);
  color: oklch(75% 0.14 25);
}
.dark .kt-badge-light.kt-badge-mono,
.dark .kt-badge-light.kt-badge-secondary {
  border: 1px solid var(--border);
  background-color: var(--muted);
  color: var(--secondary-foreground);
}
html:not(.dark) .kt-badge-light.kt-badge-primary {
  border: 1px solid oklch(88% 0.045 259.815);
  background-color: oklch(96.5% 0.02 259.815);
  color: oklch(45% 0.19 259.815);
}
html:not(.dark) .kt-badge-light.kt-badge-success {
  border: 1px solid oklch(88% 0.045 150);
  background-color: oklch(96.5% 0.02 150);
  color: oklch(45% 0.19 150);
}
html:not(.dark) .kt-badge-light.kt-badge-warning {
  border: 1px solid oklch(88% 0.045 85);
  background-color: oklch(96.5% 0.02 85);
  color: oklch(45% 0.19 85);
}
html:not(.dark) .kt-badge-light.kt-badge-destructive {
  border: 1px solid oklch(88% 0.05 25);
  background-color: oklch(96.5% 0.02 25);
  color: oklch(48% 0.19 25);
}
html:not(.dark) .kt-badge-light.kt-badge-mono,
html:not(.dark) .kt-badge-light.kt-badge-secondary {
  border: 1px solid var(--border);
  background-color: var(--muted);
  color: var(--secondary-foreground);
}

/* G9 — checkboxes: vendor already renders the spec (18px, radius 4, --input
   border, --background bg, checked = primary fill + white check). Light theme
   needs the unchecked box on white so the checked blue fill survives
   (reconfirmed in the spec addendum: scope with :not(:checked)). */
html:not(.dark) .kt-checkbox:not(:checked) {
  background-color: var(--card);
}

/* G11 — modals: dark surface one step above the page, 14px radius, deep
   shadow; overlay 40% black with NO backdrop blur (both themes). max-width
   stays per-modal in markup. */
.kt-modal-content {
  border-radius: 14px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}
/* W20: dark modals sit at the popover level (22%) — the most elevated
   surface, lighter than the 18% cards behind them. Was a flat 16.5% literal
   from before the elevation ladder; now tracks --popover so the punch modal
   and every other modal stay consistent on the ladder. */
.dark .kt-modal-content {
  background-color: var(--popover);
}
.kt-modal-backdrop {
  background-color: rgba(0, 0, 0, 0.4);
  backdrop-filter: none;
}

/* G12 — drawers: overlay 25% black, NO blur — the content behind must stay
   readable. Drawer surface itself keeps the vendor token (--popover). */
.kt-drawer-backdrop {
  background-color: rgba(0, 0, 0, 0.25);
  backdrop-filter: none;
}

/* G13 — line tabs: transparent, inactive muted-foreground, active foreground
   + 2px BP Blue underline. Applies to the KTUI line-tab pattern used by the
   Employees / Locations header tabs. */
.kt-tabs-line .kt-tab-toggle {
  color: var(--muted-foreground);
  border-bottom-width: 2px;
}
.kt-tabs-line .kt-tab-toggle.active,
.kt-tabs-line .kt-tab-toggle[aria-selected='true'] {
  color: var(--foreground);
  border-bottom-color: var(--primary);
}

/* G14 — icon-ghost buttons (eye, approve-circle, GPS pin, pager arrows). */
.kt-btn-icon.kt-btn-ghost {
  width: 26px;
  height: 26px;
  border-radius: 6px;
  color: var(--muted-foreground);
}
.kt-btn-icon.kt-btn-ghost:hover {
  background-color: var(--muted);
  color: var(--secondary-foreground);
}

/* G10 — form fields in modals and pop-out drawers: 38px tall, radius 8,
   page-background fill, 14px text; textareas 90px minimum. Scoped to overlay
   contexts so dense toolbar filters keep their compact sizing. */
:is(.kt-modal, .kt-drawer, .sliding-card) .kt-input,
:is(.kt-modal, .kt-drawer, .sliding-card) .kt-select {
  height: 38px;
  border-radius: 8px;
  font-size: var(--text-sm);
}
:is(.kt-modal, .kt-drawer, .sliding-card) textarea.kt-textarea,
:is(.kt-modal, .kt-drawer, .sliding-card) textarea.kt-input {
  min-height: 90px;
  height: auto;
}

/* P4 — the Add Break XS button straddles the punch-pair row border inside
   the In-row Time cell; give that cell extra bottom room and the paired
   Out-row Time cell extra top room so the button never covers the times. */
.timecard-detail-table td:has(> .add-break-btn) {
  padding-bottom: 24px !important;
}
.timecard-detail-table tr:has(.add-break-btn) + tr td:nth-child(3) {
  padding-top: 20px !important;
}

/* G10/P7/P8 — criteria + entry forms (report criteria pages, time-entry
   add/edit, add time off): 38px radius-8 fields. The class is applied on
   each page's <form>; toolbars and header searches elsewhere keep their
   compact vendor sizing. */
.bp-report-criteria .kt-input,
.bp-report-criteria .kt-select {
  height: 38px;
  border-radius: 8px;
  font-size: var(--text-sm);
}

/* G14 — toolbar search inputs (leading magnifier glyph): 32px compact. */
.kt-input:has(> i.ki-magnifier) {
  height: 32px;
}

/* ==========================================================================
   Component Styles
   ========================================================================== */

.swal-btn-light {
    background-color: #ffffff;
    color: var(--secondary-foreground, #4b5563);
    border: 1px solid var(--input, #d1d5db);
}

.swal-btn-light:hover {
    background-color: var(--accent, #f3f4f6);
    color: var(--accent-foreground, #374151);
}

.swal-btn-destructive {
    background-color: var(--destructive, #e42855);
    color: var(--destructive-foreground, #ffffff);
}

@media (hover: hover) {
    .swal-btn-destructive:hover {
        background-color: var(--destructive, #e42855);
        color: var(--destructive-foreground, #ffffff);
    }
    @supports (color: color-mix(in lab, red, red)) {
        .swal-btn-destructive:hover {
            background-color: color-mix(in oklab, var(--destructive, #e42855) 90%, transparent);
            color: var(--destructive-foreground, #ffffff);
        }
    }
}

/* --- SweetAlert dark mode --- */
/* Popup stays light-mode; just add a visible border so the
   outline is clear against the dark page backdrop. */
.dark .swal2-popup {
    border: 1px solid #e5e7eb;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
}

/* Force Cancel button to keep readable light-mode colors
   even when the page is in dark mode. */
.dark .swal-btn-light {
    background-color: #ffffff;
    color: #4b5563;
    border-color: #d1d5db;
}

.dark .swal-btn-light:hover {
    background-color: #f3f4f6;
    color: #374151;
}

/* --- SweetAlert dark mode (opt-in) --- */
/* Pages opt their Swal modals into proper dark theming by adding the
   .swal-dark class to customClass.popup. Currently used on the Schedule
   and Availability pages. These rules override the default "popup stays
   light" behavior above so the popup uses theme dark variables. */
.dark .swal2-popup.swal-dark {
    background-color: var(--popover, #161719);
    color: var(--popover-foreground, #e5e7eb);
    border-color: var(--border, #2a2b2e);
}

.dark .swal2-popup.swal-dark .swal2-title,
.dark .swal2-popup.swal-dark .swal2-html-container,
.dark .swal2-popup.swal-dark .swal2-label,
.dark .swal2-popup.swal-dark label {
    color: var(--popover-foreground, #e5e7eb);
}

.dark .swal2-popup.swal-dark .swal2-input,
.dark .swal2-popup.swal-dark input.swal2-input.kt-input,
.dark .swal2-popup.swal-dark .kt-input {
    background-color: var(--background, #0b0b0c);
    color: var(--foreground, #e5e7eb);
    border-color: var(--input, #3a3b3e);
}

/* Reset the global .kt-btn-outline override so outline buttons inside
   a swal-dark popup follow the theme's dark outline style instead of
   being forced to light. */
.dark .swal2-popup.swal-dark .kt-btn.kt-btn-outline,
.dark .swal2-popup.swal-dark .kt-btn-outline {
    background-color: transparent;
    color: var(--secondary-foreground, #e5e7eb);
    border-color: var(--input, #3a3b3e);
}

.dark .swal2-popup.swal-dark .kt-btn.kt-btn-outline:hover,
.dark .swal2-popup.swal-dark .kt-btn-outline:hover {
    background-color: var(--accent, #1f2024);
    color: var(--accent-foreground, #f3f4f6);
}

/* --- Prevent scroll bounce caused by sticky header/navbar --- */
html {
    overscroll-behavior-y: none;
}

/* Header is always fixed (the h-[58px] utility is applied on the element
   itself — see theme.utils.scss). Navbar is always fixed on desktop via the
   rules below. */
@media (min-width: 1024px) {
    #navbar.nav-bar {
        position: fixed;
        top: 58px;
        left: 0;
        right: 0;
        z-index: 10;
    }
    #navbar-wrapper {
        height: 49px;
    }
}

/* Override the inline z-index that ktui assigns when the mobile navbar drawer
   opens. The defaults sit above modal dialogs (modal zindex is 90), so the
   open drawer ends up covering modals. Keep the drawer below the modal layer. */
#navbar.kt-drawer {
    z-index: 85 !important;
}
.kt-drawer-backdrop {
    z-index: 80 !important;
}

/* --- Dropdown Menu --- */
.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 10rem;
    padding: .5rem 0;
    margin: 0;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 0;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 15px 1px rgba(81, 77, 92, .2);
    -moz-box-shadow: 0 0 15px 1px rgba(81, 77, 92, .2);
    box-shadow: 0 0 15px 1px rgba(81, 77, 92, .2);
}

/* ==========================================================================
   Datepicker
   ========================================================================== */

.datepicker {
    border-radius: 4px;
    direction: ltr;
}

.datepicker-inline {
    width: 220px;
}

.datepicker-rtl {
    direction: rtl;
}

.datepicker-rtl.dropdown-menu {
    left: auto;
}

.datepicker-rtl table tr td span {
    float: right;
}

.datepicker-dropdown {
    top: 0;
    left: 0;
    padding: 4px;
}

.datepicker table {
    margin: 0;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.datepicker table tr td,
.datepicker table tr th {
    text-align: center;
    width: 30px;
    height: 30px;
    border-radius: 4px;
    border: none;
}

.table-striped .datepicker table tr td,
.table-striped .datepicker table tr th {
    background-color: transparent;
}

.datepicker table tr td.new,
.datepicker table tr td.old {
    color: #777;
}

.datepicker table tr td.day:hover,
.datepicker table tr td.focused {
    background: #eee;
    cursor: pointer;
}

.datepicker table tr td.disabled,
.datepicker table tr td.disabled:hover {
    background: 0 0;
    color: #777;
    cursor: default;
}

.datepicker table tr td.highlighted {
    color: #000;
    background-color: #d9edf7;
    border-color: #85c5e5;
    border-radius: 0;
}

.datepicker table tr td.highlighted.focus,
.datepicker table tr td.highlighted:focus {
    color: #000;
    background-color: #afd9ee;
    border-color: #298fc2;
}

.datepicker table tr td.highlighted:hover {
    color: #000;
    background-color: #afd9ee;
    border-color: #52addb;
}

.datepicker table tr td.highlighted.active,
.datepicker table tr td.highlighted:active {
    color: #000;
    background-color: #afd9ee;
    border-color: #52addb;
}

.datepicker table tr td.highlighted.active.focus,
.datepicker table tr td.highlighted.active:focus,
.datepicker table tr td.highlighted.active:hover,
.datepicker table tr td.highlighted:active.focus,
.datepicker table tr td.highlighted:active:focus,
.datepicker table tr td.highlighted:active:hover {
    color: #000;
    background-color: #91cbe8;
    border-color: #298fc2;
}

.datepicker table tr td.highlighted.disabled.focus,
.datepicker table tr td.highlighted.disabled:focus,
.datepicker table tr td.highlighted.disabled:hover,
.datepicker table tr td.highlighted[disabled].focus,
.datepicker table tr td.highlighted[disabled]:focus,
.datepicker table tr td.highlighted[disabled]:hover,
fieldset[disabled] .datepicker table tr td.highlighted.focus,
fieldset[disabled] .datepicker table tr td.highlighted:focus,
fieldset[disabled] .datepicker table tr td.highlighted:hover {
    background-color: #d9edf7;
    border-color: #85c5e5;
}

.datepicker table tr td.highlighted.focused {
    background: #afd9ee;
}

.datepicker table tr td.highlighted.disabled,
.datepicker table tr td.highlighted.disabled:active {
    background: #d9edf7;
    color: #777;
}

.datepicker table tr td.today {
    color: #000;
    background-color: #ffdb99;
    border-color: #ffb733;
}

.datepicker table tr td.today.focus,
.datepicker table tr td.today:focus {
    color: #000;
    background-color: #ffc966;
    border-color: #b37400;
}

.datepicker table tr td.today:hover {
    color: #000;
    background-color: #ffc966;
    border-color: #f59e00;
}

.datepicker table tr td.today.active,
.datepicker table tr td.today:active {
    color: #000;
    background-color: #ffc966;
    border-color: #f59e00;
}

.datepicker table tr td.today.active.focus,
.datepicker table tr td.today.active:focus,
.datepicker table tr td.today.active:hover,
.datepicker table tr td.today:active.focus,
.datepicker table tr td.today:active:focus,
.datepicker table tr td.today:active:hover {
    color: #000;
    background-color: #ffbc42;
    border-color: #b37400;
}

.datepicker table tr td.today.disabled.focus,
.datepicker table tr td.today.disabled:focus,
.datepicker table tr td.today.disabled:hover,
.datepicker table tr td.today[disabled].focus,
.datepicker table tr td.today[disabled]:focus,
.datepicker table tr td.today[disabled]:hover,
fieldset[disabled] .datepicker table tr td.today.focus,
fieldset[disabled] .datepicker table tr td.today:focus,
fieldset[disabled] .datepicker table tr td.today:hover {
    background-color: #ffdb99;
    border-color: #ffb733;
}

.datepicker table tr td.today.focused {
    background: #ffc966;
}

.datepicker table tr td.today.disabled,
.datepicker table tr td.today.disabled:active {
    background: #ffdb99;
    color: #777;
}

.datepicker table tr td.range {
    color: #000;
    background-color: #eee;
    border-color: #bbb;
    border-radius: 0;
}

.datepicker table tr td.range.focus,
.datepicker table tr td.range:focus {
    color: #000;
    background-color: #d5d5d5;
    border-color: #7c7c7c;
}

.datepicker table tr td.range:hover {
    color: #000;
    background-color: #d5d5d5;
    border-color: #9d9d9d;
}

.datepicker table tr td.range.active,
.datepicker table tr td.range:active {
    color: #000;
    background-color: #d5d5d5;
    border-color: #9d9d9d;
}

.datepicker table tr td.range.active.focus,
.datepicker table tr td.range.active:focus,
.datepicker table tr td.range.active:hover,
.datepicker table tr td.range:active.focus,
.datepicker table tr td.range:active:focus,
.datepicker table tr td.range:active:hover {
    color: #000;
    background-color: #c3c3c3;
    border-color: #7c7c7c;
}

.datepicker table tr td.range.disabled.focus,
.datepicker table tr td.range.disabled:focus,
.datepicker table tr td.range.disabled:hover,
.datepicker table tr td.range[disabled].focus,
.datepicker table tr td.range[disabled]:focus,
.datepicker table tr td.range[disabled]:hover,
fieldset[disabled] .datepicker table tr td.range.focus,
fieldset[disabled] .datepicker table tr td.range:focus,
fieldset[disabled] .datepicker table tr td.range:hover {
    background-color: #eee;
    border-color: #bbb;
}

.datepicker table tr td.range.focused {
    background: #d5d5d5;
}

.datepicker table tr td.range.disabled,
.datepicker table tr td.range.disabled:active {
    background: #eee;
    color: #777;
}

.datepicker table tr td.range.highlighted {
    color: #000;
    background-color: #e4eef3;
    border-color: #9dc1d3;
}

.datepicker table tr td.range.highlighted.focus,
.datepicker table tr td.range.highlighted:focus {
    color: #000;
    background-color: #c1d7e3;
    border-color: #4b88a6;
}

.datepicker table tr td.range.highlighted:hover {
    color: #000;
    background-color: #c1d7e3;
    border-color: #73a6c0;
}

.datepicker table tr td.range.highlighted.active,
.datepicker table tr td.range.highlighted:active {
    color: #000;
    background-color: #c1d7e3;
    border-color: #73a6c0;
}

.datepicker table tr td.range.highlighted.active.focus,
.datepicker table tr td.range.highlighted.active:focus,
.datepicker table tr td.range.highlighted.active:hover,
.datepicker table tr td.range.highlighted:active.focus,
.datepicker table tr td.range.highlighted:active:focus,
.datepicker table tr td.range.highlighted:active:hover {
    color: #000;
    background-color: #a8c8d8;
    border-color: #4b88a6;
}

.datepicker table tr td.range.highlighted.disabled.focus,
.datepicker table tr td.range.highlighted.disabled:focus,
.datepicker table tr td.range.highlighted.disabled:hover,
.datepicker table tr td.range.highlighted[disabled].focus,
.datepicker table tr td.range.highlighted[disabled]:focus,
.datepicker table tr td.range.highlighted[disabled]:hover,
fieldset[disabled] .datepicker table tr td.range.highlighted.focus,
fieldset[disabled] .datepicker table tr td.range.highlighted:focus,
fieldset[disabled] .datepicker table tr td.range.highlighted:hover {
    background-color: #e4eef3;
    border-color: #9dc1d3;
}

.datepicker table tr td.range.highlighted.focused {
    background: #c1d7e3;
}

.datepicker table tr td.range.highlighted.disabled,
.datepicker table tr td.range.highlighted.disabled:active {
    background: #e4eef3;
    color: #777;
}

.datepicker table tr td.range.today {
    color: #000;
    background-color: #f7ca77;
    border-color: #f1a417;
}

.datepicker table tr td.range.today.focus,
.datepicker table tr td.range.today:focus {
    color: #000;
    background-color: #f4b747;
    border-color: #815608;
}

.datepicker table tr td.range.today:hover {
    color: #000;
    background-color: #f4b747;
    border-color: #bf800c;
}

.datepicker table tr td.range.today.active,
.datepicker table tr td.range.today:active {
    color: #000;
    background-color: #f4b747;
    border-color: #bf800c;
}

.datepicker table tr td.range.today.active.focus,
.datepicker table tr td.range.today.active:focus,
.datepicker table tr td.range.today.active:hover,
.datepicker table tr td.range.today:active.focus,
.datepicker table tr td.range.today:active:focus,
.datepicker table tr td.range.today:active:hover {
    color: #000;
    background-color: #f2aa25;
    border-color: #815608;
}

.datepicker table tr td.range.today.disabled.focus,
.datepicker table tr td.range.today.disabled:focus,
.datepicker table tr td.range.today.disabled:hover,
.datepicker table tr td.range.today[disabled].focus,
.datepicker table tr td.range.today[disabled]:focus,
.datepicker table tr td.range.today[disabled]:hover,
fieldset[disabled] .datepicker table tr td.range.today.focus,
fieldset[disabled] .datepicker table tr td.range.today:focus,
fieldset[disabled] .datepicker table tr td.range.today:hover {
    background-color: #f7ca77;
    border-color: #f1a417;
}

.datepicker table tr td.range.today.disabled,
.datepicker table tr td.range.today.disabled:active {
    background: #f7ca77;
    color: #777;
}

.datepicker table tr td.selected,
.datepicker table tr td.selected.highlighted {
    color: #fff;
    background-color: #777;
    border-color: #555;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}

.datepicker table tr td.selected.focus,
.datepicker table tr td.selected.highlighted.focus,
.datepicker table tr td.selected.highlighted:focus,
.datepicker table tr td.selected:focus {
    color: #fff;
    background-color: #5e5e5e;
    border-color: #161616;
}

.datepicker table tr td.selected.highlighted:hover,
.datepicker table tr td.selected:hover {
    color: #fff;
    background-color: #5e5e5e;
    border-color: #373737;
}

.datepicker table tr td.selected.active,
.datepicker table tr td.selected.highlighted.active,
.datepicker table tr td.selected.highlighted:active,
.datepicker table tr td.selected:active {
    color: #fff;
    background-color: #5e5e5e;
    border-color: #373737;
}

.datepicker table tr td.selected.active.focus,
.datepicker table tr td.selected.active:focus,
.datepicker table tr td.selected.active:hover,
.datepicker table tr td.selected.highlighted.active.focus,
.datepicker table tr td.selected.highlighted.active:focus,
.datepicker table tr td.selected.highlighted.active:hover,
.datepicker table tr td.selected.highlighted:active.focus,
.datepicker table tr td.selected.highlighted:active:focus,
.datepicker table tr td.selected.highlighted:active:hover,
.datepicker table tr td.selected:active.focus,
.datepicker table tr td.selected:active:focus,
.datepicker table tr td.selected:active:hover {
    color: #fff;
    background-color: #4c4c4c;
    border-color: #161616;
}

.datepicker table tr td.selected.disabled.focus,
.datepicker table tr td.selected.disabled:focus,
.datepicker table tr td.selected.disabled:hover,
.datepicker table tr td.selected.highlighted.disabled.focus,
.datepicker table tr td.selected.highlighted.disabled:focus,
.datepicker table tr td.selected.highlighted.disabled:hover,
.datepicker table tr td.selected.highlighted[disabled].focus,
.datepicker table tr td.selected.highlighted[disabled]:focus,
.datepicker table tr td.selected.highlighted[disabled]:hover,
.datepicker table tr td.selected[disabled].focus,
.datepicker table tr td.selected[disabled]:focus,
.datepicker table tr td.selected[disabled]:hover,
fieldset[disabled] .datepicker table tr td.selected.focus,
fieldset[disabled] .datepicker table tr td.selected.highlighted.focus,
fieldset[disabled] .datepicker table tr td.selected.highlighted:focus,
fieldset[disabled] .datepicker table tr td.selected.highlighted:hover,
fieldset[disabled] .datepicker table tr td.selected:focus,
fieldset[disabled] .datepicker table tr td.selected:hover {
    background-color: #777;
    border-color: #555;
}
/* 
.datepicker table tr td.active,
.datepicker table tr td.active.highlighted {
    color: #fff;
    background-color: #337ab7;
    border-color: #2e6da4;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}

.datepicker table tr td.active.focus,
.datepicker table tr td.active.highlighted.focus,
.datepicker table tr td.active.highlighted:focus,
.datepicker table tr td.active:focus {
    color: #fff;
    background-color: #286090;
    border-color: #122b40;
}

.datepicker table tr td.active.highlighted:hover,
.datepicker table tr td.active:hover {
    color: #fff;
    background-color: #286090;
    border-color: #204d74;
}

.datepicker table tr td.active.active,
.datepicker table tr td.active.highlighted.active,
.datepicker table tr td.active.highlighted:active,
.datepicker table tr td.active:active {
    color: #fff;
    background-color: #286090;
    border-color: #204d74;
}

.datepicker table tr td.active.active.focus,
.datepicker table tr td.active.active:focus,
.datepicker table tr td.active.active:hover,
.datepicker table tr td.active.highlighted.active.focus,
.datepicker table tr td.active.highlighted.active:focus,
.datepicker table tr td.active.highlighted.active:hover,
.datepicker table tr td.active.highlighted:active.focus,
.datepicker table tr td.active.highlighted:active:focus,
.datepicker table tr td.active.highlighted:active:hover,
.datepicker table tr td.active:active.focus,
.datepicker table tr td.active:active:focus,
.datepicker table tr td.active:active:hover {
    color: #fff;
    background-color: #204d74;
    border-color: #122b40;
}

.datepicker table tr td.active.disabled.focus,
.datepicker table tr td.active.disabled:focus,
.datepicker table tr td.active.disabled:hover,
.datepicker table tr td.active.highlighted.disabled.focus,
.datepicker table tr td.active.highlighted.disabled:focus,
.datepicker table tr td.active.highlighted.disabled:hover,
.datepicker table tr td.active.highlighted[disabled].focus,
.datepicker table tr td.active.highlighted[disabled]:focus,
.datepicker table tr td.active.highlighted[disabled]:hover,
.datepicker table tr td.active[disabled].focus,
.datepicker table tr td.active[disabled]:focus,
.datepicker table tr td.active[disabled]:hover,
fieldset[disabled] .datepicker table tr td.active.focus,
fieldset[disabled] .datepicker table tr td.active.highlighted.focus,
fieldset[disabled] .datepicker table tr td.active.highlighted:focus,
fieldset[disabled] .datepicker table tr td.active.highlighted:hover,
fieldset[disabled] .datepicker table tr td.active:focus,
fieldset[disabled] .datepicker table tr td.active:hover {
    background-color: #337ab7;
    border-color: #2e6da4;
} */

.datepicker table tr td span {
    display: block;
    width: 23%;
    height: 54px;
    line-height: 54px;
    float: left;
    margin: 1%;
    cursor: pointer;
    border-radius: 4px;
}

.datepicker table tr td span.focused,
.datepicker table tr td span:hover {
    background: #eee;
}

.datepicker table tr td span.disabled,
.datepicker table tr td span.disabled:hover {
    background: 0 0;
    color: #777;
    cursor: default;
}

/* .datepicker table tr td span.active,
.datepicker table tr td span.active.disabled,
.datepicker table tr td span.active.disabled:hover,
.datepicker table tr td span.active:hover {
    color: #fff;
    background-color: #337ab7;
    border-color: #2e6da4;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
} */

/* .datepicker table tr td span.active.disabled.focus,
.datepicker table tr td span.active.disabled:focus,
.datepicker table tr td span.active.disabled:hover.focus,
.datepicker table tr td span.active.disabled:hover:focus,
.datepicker table tr td span.active.focus,
.datepicker table tr td span.active:focus,
.datepicker table tr td span.active:hover.focus,
.datepicker table tr td span.active:hover:focus {
    color: #fff;
    background-color: #286090;
    border-color: #122b40;
}

.datepicker table tr td span.active.disabled:hover,
.datepicker table tr td span.active.disabled:hover:hover,
.datepicker table tr td span.active:hover,
.datepicker table tr td span.active:hover:hover {
    color: #fff;
    background-color: #286090;
    border-color: #204d74;
}

.datepicker table tr td span.active.active,
.datepicker table tr td span.active.disabled.active,
.datepicker table tr td span.active.disabled:active,
.datepicker table tr td span.active.disabled:hover.active,
.datepicker table tr td span.active.disabled:hover:active,
.datepicker table tr td span.active:active,
.datepicker table tr td span.active:hover.active,
.datepicker table tr td span.active:hover:active {
    color: #fff;
    background-color: #286090;
    border-color: #204d74;
}

.datepicker table tr td span.active.active.focus,
.datepicker table tr td span.active.active:focus,
.datepicker table tr td span.active.active:hover,
.datepicker table tr td span.active.disabled.active.focus,
.datepicker table tr td span.active.disabled.active:focus,
.datepicker table tr td span.active.disabled.active:hover,
.datepicker table tr td span.active.disabled:active.focus,
.datepicker table tr td span.active.disabled:active:focus,
.datepicker table tr td span.active.disabled:active:hover,
.datepicker table tr td span.active.disabled:hover.active.focus,
.datepicker table tr td span.active.disabled:hover.active:focus,
.datepicker table tr td span.active.disabled:hover.active:hover,
.datepicker table tr td span.active.disabled:hover:active.focus,
.datepicker table tr td span.active.disabled:hover:active:focus,
.datepicker table tr td span.active.disabled:hover:active:hover,
.datepicker table tr td span.active:active.focus,
.datepicker table tr td span.active:active:focus,
.datepicker table tr td span.active:active:hover,
.datepicker table tr td span.active:hover.active.focus,
.datepicker table tr td span.active:hover.active:focus,
.datepicker table tr td span.active:hover.active:hover,
.datepicker table tr td span.active:hover:active.focus,
.datepicker table tr td span.active:hover:active:focus,
.datepicker table tr td span.active:hover:active:hover {
    color: #fff;
    background-color: #204d74;
    border-color: #122b40;
}

.datepicker table tr td span.active.disabled.disabled.focus,
.datepicker table tr td span.active.disabled.disabled:focus,
.datepicker table tr td span.active.disabled.disabled:hover,
.datepicker table tr td span.active.disabled.focus,
.datepicker table tr td span.active.disabled:focus,
.datepicker table tr td span.active.disabled:hover,
.datepicker table tr td span.active.disabled:hover.disabled.focus,
.datepicker table tr td span.active.disabled:hover.disabled:focus,
.datepicker table tr td span.active.disabled:hover.disabled:hover,
.datepicker table tr td span.active.disabled:hover[disabled].focus,
.datepicker table tr td span.active.disabled:hover[disabled]:focus,
.datepicker table tr td span.active.disabled:hover[disabled]:hover,
.datepicker table tr td span.active.disabled[disabled].focus,
.datepicker table tr td span.active.disabled[disabled]:focus,
.datepicker table tr td span.active.disabled[disabled]:hover,
.datepicker table tr td span.active:hover.disabled.focus,
.datepicker table tr td span.active:hover.disabled:focus,
.datepicker table tr td span.active:hover.disabled:hover,
.datepicker table tr td span.active:hover[disabled].focus,
.datepicker table tr td span.active:hover[disabled]:focus,
.datepicker table tr td span.active:hover[disabled]:hover,
.datepicker table tr td span.active[disabled].focus,
.datepicker table tr td span.active[disabled]:focus,
.datepicker table tr td span.active[disabled]:hover,
fieldset[disabled] .datepicker table tr td span.active.disabled.focus,
fieldset[disabled] .datepicker table tr td span.active.disabled:focus,
fieldset[disabled] .datepicker table tr td span.active.disabled:hover,
fieldset[disabled] .datepicker table tr td span.active.disabled:hover.focus,
fieldset[disabled] .datepicker table tr td span.active.disabled:hover:focus,
fieldset[disabled] .datepicker table tr td span.active.disabled:hover:hover,
fieldset[disabled] .datepicker table tr td span.active.focus,
fieldset[disabled] .datepicker table tr td span.active:focus,
fieldset[disabled] .datepicker table tr td span.active:hover,
fieldset[disabled] .datepicker table tr td span.active:hover.focus,
fieldset[disabled] .datepicker table tr td span.active:hover:focus,
fieldset[disabled] .datepicker table tr td span.active:hover:hover {
    background-color: #337ab7;
    border-color: #2e6da4;
} */

.datepicker table tr td span.new,
.datepicker table tr td span.old {
    color: #777;
}

.datepicker .datepicker-switch {
    width: 145px;
}

.datepicker .datepicker-switch,
.datepicker .next,
.datepicker .prev,
.datepicker tfoot tr th {
    cursor: pointer;
}

.datepicker .datepicker-switch:hover,
.datepicker .next:hover,
.datepicker .prev:hover,
.datepicker tfoot tr th:hover {
    background: #eee;
}

.datepicker .next.disabled,
.datepicker .prev.disabled {
    visibility: hidden;
}

.datepicker .cw {
    font-size: 10px;
    width: 12px;
    padding: 0 2px 0 5px;
    vertical-align: middle;
}

/* ==========================================================================
   Custom Application Components
   ========================================================================== */

/* --- Loader --- */
.loader {
    width: 75%;
    height: 75%;
    border: 2px solid #1379F0;
    border-bottom-color: transparent;
    border-radius: 50%;
    display: inline-block;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
}

/* --- DataTables Column Visibility --- */
.dt-button-collection {
    z-index: 9 !important;
    padding: 0.5rem 0 !important;
    border-radius: 0.5rem !important;
    box-shadow: 0 4px 24px rgba(0, 0, 0, .12) !important;
    background: var(--mono-foreground) !important;
    border: 1px solid var(--border) !important;
    min-width: 160px !important;
}

.dt-button-collection .buttons-columnVisibility {
    display: flex !important;
    align-items: center !important;
    gap: 0.75rem !important;
    width: 100% !important;
    padding: 0.5rem 1rem !important;
    background: none !important;
    border: none !important;
    text-align: left !important;
    cursor: pointer !important;
    font-size: 0.875rem !important;
    color: var(--foreground) !important;
    box-shadow: none !important;
}

.dt-button-collection .buttons-columnVisibility:hover {
    background: var(--accent) !important;
}

.dt-button-collection .buttons-columnVisibility::before {
    content: '';
    display: block;
    width: 1rem;
    height: 1rem;
    border: 1.5px solid var(--border);
    border-radius: 0.25rem;
    flex-shrink: 0;
    background: none;
}

.dt-button-collection .buttons-columnVisibility.active::before {
    background-color: var(--primary);
    border-color: var(--primary);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26l2.974 2.99L8 2.193z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 10px;
}

.table-btn-colvis .dt-button-down-arrow {
    padding: 0 !important;
    font-size: 0 !important;
}

.table-btn-colvis .dt-button-down-arrow:before {
    content: "\eaa3";
    position: relative;
    top: 5px;
    font-family: 'keenicons-filled';
    font-size: 12px;
    font-weight: 600;
}

.table-btn-colvis:hover {
    background-color: var(--accent) !important;
    color: var(--accent-foreground) !important;
}

/* --- About Table --- */
.about-table td {
    padding: 10px;
}

.about-table td.label {
    color: #78829D;
    padding-left: 0;
    padding-right: 0;
}

/* --- Chip --- */
.chip-full {
    height: auto;
    white-space: normal;
    line-height: 2;
}

/* --- GPS Map --- */
.gps-map .gm-style img[style*="opacity: 0.89321"] {
    border-radius: 17px;
    border: 3px solid #FFF !important;
}

.gps-map .gm-style div[style*="width: 35px"] {
    border-radius: 34px;
    outline: #3435fb solid 1px;
}

.gps-map .gm-style iframe + div {
    border: none !important;
}

.gps-map .maps-ee-photo {
    width: 34px;
    height: 34px;
    border-radius: 17px;
    border: 3px solid #FFF !important;
}

.gps-map .maps-ee-details {
    margin: 0;
    font-weight: 550;
    font-size: 12px;
    color: #65707F;
    display: flex;
}

.gps-map .maps-ee-details-col {
    margin: 0;
    padding-right: 10px;
    display: flex;
}

.gps-map .maps-ee-details-col .row {
    margin: 0 !important;
}

.gps-map .maps-info-gray {
    color: #ADB5BD;
    font-size: 11px;
}

.gps-map .left-data {
    text-align: left !important;
}

.gps-map .right-data {
    text-align: left !important;
    flex: auto;
    margin-left: 30px;
}

.gps-map div[role=dialog].gm-style-iw.gm-style-iw-c {
    padding: 0 !important;
    border-radius: 0;
}

.gps-map div[role=dialog].gm-style-iw.gm-style-iw-c button {
    right: 0 !important;
    display: none !important;
}

.gps-map div[role=dialog].gm-style-iw.gm-style-iw-c .gm-style-iw-d {
    overflow: visible !important;
    margin: 12px;
}

.gps-map .gps-green-span {
    margin: -3px 3px 0;
    -webkit-margin-before: -3px 3px 0 3px;
}

.gps-green-span {
    padding: 3px 5px;
    background-color: #CBF4C9;
    color: #15684A;
    font-weight: 600;
    border-radius: 7px;
}

.gps-location-timestamp {
    color: #6578D8;
}

/* --- Activity Map --- */
.activity-map {
    width: 100% !important;
    height: 100% !important;
    min-height: 600px;
}

.activity-map .gm-style div[style*="width: 34px"] {
    border-radius: 34px;
    outline: rgba(74, 179, 229, .4) solid 14px;
}

.activity-map .gm-style div[style*="width: 35px"] {
    border-radius: 34px;
    outline: rgba(229, 70, 85, .4) solid 14px;
}

.activity-map .gm-style img[style*="opacity: 0.89321"] {
    border-radius: 17px;
    border: 3px solid #FFF !important;
}

.activity-map .gm-style div[style*="width: 12px"] {
    cursor: pointer;
}

/* --- GPS Lost --- */
.fa-exclamation-circle.gps-lost {
    color: #E84556;
    margin-right: 3px;
}

.gps-lost-popovers-popup {
    background-color: #555;
    border-radius: 10px;
}

.gps-lost-popovers-popup p {
    color: #fff !important;
    font-weight: bolder;
}

.gps-lost-popovers-popup .arrow::after {
    border-top-color: #555;
}

/* --- Dashboard Map --- */
.dashboard-map {
    width: 100% !important;
    height: calc(100% - 30px) !important;
    min-height: 338px;
}

.dashboard-map div[role=dialog].gm-style-iw.gm-style-iw-c {
    border-radius: 34px;
    padding-right: 10px;
    border: 3px solid #FFF !important;
}

@media (max-width: 768px) {
    .dashboard-map {
        min-height: 500px !important;
    }
}

/* --- Table Styles --- */
.total-col {
    background: #E8F0F9;
}

/* Dark values are token-based so these rows track the card surface they sit
   on (var(--card)) rather than hard-coded hexes. .total-col mirrors
   td.total-column in theme.custom.scss - same light-mode color, so same
   dark-mode primary tint. */
.total-col:is(.dark *) {
    background: color-mix(in oklab, var(--primary) 12%, var(--card));
}

.row-light {
    background: #eff7fc8c;
}

.row-light:is(.dark *) {
    background: color-mix(in oklab, var(--muted) 25%, var(--card));
}

.row-white:is(.dark *) {
    background: var(--card);
}


/* Restyle spec P4: week-band rows use the muted/40 header-band recipe in
   both themes (was hard-coded #EFF4F8 / #2a2a2c). */
tr.summary-row {
    background: color-mix(in oklab, var(--muted) 40%, transparent);
}

.timecard-detail-table tfoot {
    border-top: 2px solid var(--border);
}

/* --- KT Table Highlights --- */
.kt-table.highlight-last-col td:last-of-type {
    background: #E8E8E8 !important;
}

.kt-table.highlight-2nd-last-col td:nth-last-of-type(2) {
    background: #E8E8E8 !important;
}

.kt-table.highlight-last-col td:last-of-type:is(.dark *) {
    background: #2A2A2C !important;
}

.kt-table.highlight-2nd-last-col td:nth-last-of-type(2):is(.dark *) {
    background: #2A2A2C !important;
}

/* --- Employee GPS Row --- */
.dark\:text-lighter:is(.dark *):not(:hover, .active) {
    color: #d7d7d7 !important;
}

.ee-gps-row.active {
    color: #1371C4 !important;
    background-color: #E3E7FA !important;
}

.ee-gps-row.active:is(.dark *) {
    color: rgb(158, 158, 158) !important;
    background-color: #4a4a4a !important;
}

/* --- Side Nav --- */
.side-nav-menu-item.active,
.side-nav-menu-item:hover {
    background: #F9F9F9;
    color: var(--primary);
}

.side-nav-menu-item.active:is(.dark *),
.side-nav-menu-item:hover:is(.dark *) {
    background: #111217;
}

/* --- More Menu --- */
.more-menu-buttons-list .kt-dropdown-menu-link:hover i {
    color: var(--primary) !important;
}

/* --- Header Search --- */
.search-icon-m {
    display: none;
}

header {
    transition: margin-bottom 0.3s ease;
}

@media (max-width: 650px) {
    header .header-search {
        display: none;
        width: 100%;
        top: 49px;
        left: 0;
        right: 0;
        padding: 0 4%;
        position: absolute;
    }

    header:has(.header-search.active) {
        margin-bottom: 40px;
    }

    .header-search.active {
        display: block;
    }

    .search-icon-m {
        display: block;
    }
}

@media (max-width: 44rem) {
    .kt-card-header {
        line-height: 1.5;
        padding: calc(var(--spacing) * 5);
    }
}

/* --- Info Background --- */
.info-bg {
    background-image: url('/dist/images/info-bg.png');
}

/* --- Break Time Separator --- */
.break-time-separator {
    display: flex;
    width: 100%;
    margin-bottom: 1rem;
}

.break-time-separator:after,
.break-time-separator:before {
    content: '';
    display: block;
    position: relative;
    top: -9px;
    min-height: 1px;
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%;
    border-bottom: 1px solid rgb(190, 190, 190);
}

.break-time-separator:before {
    margin-right: 20px;
}

.break-time-separator:after {
    margin-left: 20px;
}

/* --- Drawer / Sliding Card --- */
/* Restyle spec G12: 25% dim, no blur - the time card behind must stay
   readable while the drawer is open. */
.drawer-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .25);
    opacity: 0;
    visibility: hidden;
    transition: opacity .3s ease, visibility .3s ease;
    z-index: 1000;
}

.drawer-overlay.active {
    opacity: 1;
    visibility: visible;
}

.sliding-card {
    position: fixed;
    top: 60px;
    right: -66vw;
    height: calc(100% - 60px);
    background-color: var(--background);
    border-left: 1px solid var(--border);
    box-shadow: -2px 0 5px rgba(0, 0, 0, .3);
    padding: 8px;
    box-sizing: border-box;
    z-index: 1002;
    overflow-y: auto;
    width: 66vw;
}

.sliding-card.active {
    right: 0;
}

@media (min-width: 768px) {
    .sliding-card {
        width: 66vw;
        max-width: 66vw;
    }
}

/* --- Table Row Highlight --- */
/* Restyle spec P4-EDIT-LIFT: while the edit drawer is open, the row being
   edited lifts ABOVE the dim overlay (overlay z-1000 < row z-1001 < drawer
   z-1002). Dark keeps a translucent muted wash; light pins to the card. */
tr.highlight {
    position: relative !important;
    z-index: 1001;
    background: var(--card);
}

.dark tr.highlight {
    background: color-mix(in oklab, var(--muted) 75%, transparent);
}

/* --- Addon / Plan Cards --- */
.addon-card-list {
    width: 100%;
    max-width: none;
}

.addon-card-list,
.plans-card-list {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.addon-card {
    min-height: 167px;
    border: 1px solid var(--border);
    border-radius: 6px;
    box-shadow: none;
    width: 300px;
    padding: 15px 10px;
    background: var(--accent);
}

.addon-card--can-change,
.addon-card--plan-card:not(.addon-card--current-plan) {
    background: var(--mono-foreground) !important;
}

/* --- Stripe Elements --- */
.StripeElement {
    box-sizing: border-box;
    padding: calc(var(--spacing) * 1.5) calc(var(--spacing) * 3);
    border: 1px solid var(--border);
    border-radius: 5px;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .07), 0 1px 1.5px 0 rgba(0, 0, 0, .05);
    -webkit-transition: border-color 150ms ease;
    transition: border-color 150ms ease;
}

.StripeElement--invalid {
    border-color: #ef9896;
}

/* --- Card Image Holder --- */
.card-img-holder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 130px;
    height: 80px;
    font-size: .85rem;
    color: var(--muted-foreground);
    border-radius: .5rem;
}

.card-img-holder.american-express {
    background: #ffffff url('/dist/images/payment-cards/american-express.jpg') center / 100% no-repeat;
}
.card-img-holder.diners-club {
    background: url('/dist/images/payment-cards/diners-club.png') center / 100% no-repeat;
}
.card-img-holder.discover {
    background: url('/dist/images/payment-cards/discover.jpg') center / 90% no-repeat;
}
.card-img-holder.jcb {
    background: url('/dist/images/payment-cards/jcb.png') center / 80% no-repeat;
}
.card-img-holder.master-card {
    background: url('/dist/images/payment-cards/master-card.png') center / 65% no-repeat;
}
.card-img-holder.union-pay {
    background: url('/dist/images/payment-cards/union-pay.png') center / 100% no-repeat;
}
.card-img-holder.visa {
    background: url('/dist/images/payment-cards/visa.png') center / 100% no-repeat;
}
.card-img-holder.unknown {
    background: #ffffff url('/dist/images/payment-cards/cc_1.png') center / 100% no-repeat;
}

/* ==========================================================================
   Animations
   ========================================================================== */

@keyframes spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* Dark mode: tell browsers to render native form controls (notably the
   spinner arrows on <input type="number"> and the calendar / time pickers)
   in their dark UA variants. Without this they keep their light-mode look —
   white spinner arrows on a dark input field — and stand out as a visible
   theming inconsistency. Kaitlyn's 2026-05-14 item #39 on AB#12650. */
html.dark input[type="number"],
html.dark input[type="date"],
html.dark input[type="time"],
html.dark input[type="datetime-local"],
[data-kt-theme-mode="dark"] input[type="number"],
[data-kt-theme-mode="dark"] input[type="date"],
[data-kt-theme-mode="dark"] input[type="time"],
[data-kt-theme-mode="dark"] input[type="datetime-local"] {
    color-scheme: dark;
}

/* Dark mode: also propagate color-scheme to the root so native scrollbars on
   every scrollable container render in their dark variant. Without this,
   pages with overflow scrollers (Map Payroll Items, Map Customers & Jobs /
   Service Items / Classes, etc.) show light-mode grey/white scrollbar
   thumbs against a dark page background. Kaitlyn's 2026-05-12 items #8 + #11
   on AB#13179. */
html.dark,
[data-kt-theme-mode="dark"] {
    color-scheme: dark;
}

/* Shift dropdown: wrap long shift option labels so the dropdown doesn't blow
   up to several hundred pixels wide on the employee Punch page. Gary's
   2026-05-13 item #39 on AB#13066. Constrains the options panel + lets the
   label text break onto multiple lines. */
.shiftId-kt + .kt-select-dropdown,
.kt-select[data-kt-select-trigger="true"][aria-controls*="shiftId"] + .kt-select-dropdown,
.kt-select-dropdown[aria-labelledby*="shiftId"] {
    max-width: 380px;
}

.shiftId-kt + .kt-select-dropdown .kt-select-option,
.kt-select-dropdown[aria-labelledby*="shiftId"] .kt-select-option {
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
    line-height: 1.3;
}

/* --- Restyle spec G5: numeric value hierarchy in tables ---
   Apply .bp-num to hour/number/money/count cells ONLY (tabular figures read
   as a different font on prose dates and date-range lists - never put it
   there). Modifiers: zero values recede, real values firm up, totals lead,
   negatives alarm. */
.bp-num {
    font-variant-numeric: tabular-nums;
}

.bp-num-zero {
    color: var(--muted-foreground);
}

.bp-num-val {
    font-weight: 500;
}

.bp-num-total {
    font-weight: 600;
}

.bp-num-neg {
    color: #F8285A;
}

.report-by-table__head-border {
    border-top: 1px solid var(--foreground);
    border-bottom: 1px solid var(--foreground);
}

.report-by-table__head-border:is(.dark *) {
    border-top-color: var(--muted-foreground);
    border-bottom-color: var(--muted-foreground);
}

.report-by-table .col-1--report {
    flex: 0 0 10.33333% !important;
    max-width: 10.33333% !important;
    width: 10.33333% !important;
    padding: 0;
    text-align: right;
}

.report-by-table .col-report {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%;
    width: auto;
    padding: 0;
}

.report-by-table .report-row {
    padding: 5px 0;
}

.report-by-table .row-total-1,
.report-by-table .row-total-2,
.report-by-table .row-total-3 {
    display: flex;
    align-items: center;
    font-weight: 600;
}

.report-by-table .label-0,
.report-by-table .label-1,
.report-by-table .label-2 {
    min-width: 100px;
    display: block;
    text-overflow: ellipsis;
    overflow: hidden;
}

.report-by-table .label-0 {
    font-size: 1.125rem;
    font-weight: 700;
}

.report-by-table .label-1 {
    font-size: 1rem;
    font-weight: 600;
}

.report-by-table .label-2 {
    font-size: 0.9375rem;
    font-weight: 600;
}

.report-by-table .report-link {
    color: #1271C4;
    cursor: pointer;
}

.report-by-table .report-link:hover {
    color: #3A99DF;
    text-decoration: underline;
}

/* Hours Report by table */
.report-by-table {

  .col-report {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%;
    width: auto;
    padding: 0;
    font-size: 14px;
  }

  .col-1--report {
    flex: 0 0 10.33333% !important;
    max-width: 10.33333% !important;
    width: 10.33333% !important;
    padding: 0;
    text-align: right;
    font-size: 14px;
  }

  &__head {
    display: flex;
    padding-bottom: 10px;
    margin-bottom: 20px;
    border-bottom: 1px solid #000;
  }

  .report-entity {
    margin-bottom: 25px;
  }

  .report-row {
    padding: 5px 0;
  }

  .report-link {
    display: block;
    color: #1271C4;
    cursor: pointer;

    &:hover {
      color: #3A99DF;
      text-decoration: underline;
    }
  }

  .pl-2-rem {
    padding-left: 2rem !important;
  }

  .pl-5 {
    padding-left: 5% !important;
  }

  .pl-5--rem {
    padding-left: 5rem !important;
  }

  .pl-10 {
    padding-left: 10%;
  }

  .pl-19 {
    padding-left: 19%;
  }

  .pl-13 {
    padding-left: 13%;
  }

  .pl-30 {
    padding-left: 30%;
  }

  .pl-50 {
    padding-left: 50%;
  }

  .label-0 {
    font-size: 18px;
    font-weight: 600;
    min-width: 100px;
    overflow: hidden;
    display: block;
    text-overflow: ellipsis;
  }

  .label-1 {
    font-size: 16px;
    font-weight: 600;
    min-width: 100px;
    overflow: hidden;
    display: block;
    text-overflow: ellipsis;
  }

  .label-2 {
    font-size: 14px;
    font-weight: 600;
    min-width: 100px;
    overflow: hidden;
    display: block;
    text-overflow: ellipsis;
  }

  .label-3 {
    font-size: 14px;
  }

  .row-3 {
    border-top: 1px solid #ccc;
    padding: 5px 0 !important;

    &:is(.dark *) {
      border-top-color: var(--border);
    }
  }

  .row-total-1 {
    display: flex;
    align-items: center;
    font-weight: 600;

    &:is(.dark *) {
      border-top-color: var(--muted-foreground);
    }

    .label-2 {
      max-width: 32vh;
    }

    @media (max-width: 1024px) {
      .label-2 {
        white-space: normal;
      }
    }
  }

  .row-total-2 {
    padding: 5px 0;
    margin-bottom: 40px;
    font-weight: 600;
  }

  .row-total-3 {
    padding: 5px 0 30px;
    border-top: 1px solid #000000;
    font-weight: 600;

    &:is(.dark *) {
      border-top-color: var(--border);
    }
  }

}

#reportByTable .dataTables_scrollBody {
  border-bottom: none !important;
}

@media print {
  .report-by-table {
    abbr {
      text-decoration: none;
    }
  }
}

// ============================================================================
// Metronic v9 FullCalendar Theme Overrides
// Based on: https://keenthemes.com/metronic/tailwind/docs/plugins/fullcalendar
// ============================================================================


// -- Global font inheritance
.fc {
  font-family: inherit !important;
}

// -- Toolbar title
.fc-toolbar-title {
  font-size: var(--text-base) !important;
  line-height: var(--tw-leading, var(--text-base--line-height)) !important;
  font-weight: var(--font-weight-semibold);
  color: var(--foreground);
}

// -- Toolbar chunk layout
.fc-toolbar-chunk {
  display: flex;
  align-items: center;
  gap: 0 !important;
}

// -- Button group spacing
.fc-button + .fc-button {
  margin-left: 0 !important;
}

.fc-button:not(:last-child) {
  border-right: none !important;
}

// -- Base button style
.fc-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center;
  cursor: pointer;
  white-space: nowrap;
  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke;
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
  transition-duration: var(--tw-duration, var(--default-transition-duration));
  height: calc(var(--spacing) * 8);
  border-style: var(--tw-border-style);
  border-width: 1px;
  border-color: var(--border);
  background-color: var(--background);
  padding-inline: calc(var(--spacing) * 3);
  font-size: var(--text-xs);
  line-height: var(--tw-leading, var(--text-xs--line-height));
  font-weight: var(--font-weight-medium);
  color: var(--foreground);
  border-radius: 0 !important;
  box-shadow: none !important;
  gap: 0.375rem !important;

  .fc-icon,
  .fc-icon::before,
  .fc-icon::after {
    font-size: 1rem !important;
    color: currentColor !important;
    fill: currentColor !important;
    position: relative !important;
  }

  &:hover:not(:disabled) {
    background-color: var(--accent) !important;
    color: var(--accent-foreground) !important;

    .fc-icon,
    .fc-icon::before,
    .fc-icon::after {
      color: var(--accent-foreground) !important;
      fill: var(--accent-foreground) !important;
    }
  }

  &:focus-visible {
    outline: none !important;
    --tw-ring-shadow: 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-ring-shadow) !important;
    --tw-ring-color: var(--ring);
    --tw-ring-offset-width: 2px;
  }

  &:disabled {
    cursor: not-allowed;
    opacity: 50%;
  }
}

// -- Button group border radius
.fc-button-group .fc-button:first-child,
.fc-toolbar-chunk .fc-button:first-child {
  border-top-left-radius: var(--radius-md) !important;
  border-bottom-left-radius: var(--radius-md) !important;
}

.fc-button-group .fc-button:last-child,
.fc-toolbar-chunk .fc-button:last-child {
  border-top-right-radius: var(--radius-md) !important;
  border-bottom-right-radius: var(--radius-md) !important;
}

// -- Today & view buttons
.fc-today-button {
  border-radius: var(--radius-md) !important;
}

.fc-today-button,
.fc-dayGridWeek-button,
.fc-dayGridDay-button,
.fc-listWeek-button,
.fc-listDay-button,
.fc-listMonth-button,
.fc-listYear-button {
  min-width: 4rem !important;
  width: auto !important;
}

// -- Primary button (default state)
.fc-button-primary {
  background-color: var(--background) !important;
  color: var(--foreground) !important;
  border-color: var(--border) !important;

  &:hover:not(:disabled) {
    background-color: var(--accent) !important;
    color: var(--accent-foreground) !important;
  }

  .fc-icon,
  .fc-icon::before,
  .fc-icon::after {
    color: currentColor !important;
    fill: currentColor !important;
  }

  &:hover:not(:disabled) .fc-icon,
  &:hover:not(:disabled) .fc-icon::before,
  &:hover:not(:disabled) .fc-icon::after {
    color: var(--accent-foreground) !important;
    fill: var(--accent-foreground) !important;
  }
}

// -- Active button state
.fc-button-active {
  background-color: var(--primary) !important;
  color: var(--primary-foreground) !important;
  border-color: var(--primary) !important;

  &:hover:not(:disabled) {
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--primary) 90%, transparent) !important;
    }
    @supports not (color: color-mix(in lab, red, red)) {
      opacity: 0.9;
    }
    color: var(--primary-foreground) !important;
  }

  .fc-icon,
  .fc-icon::before,
  .fc-icon::after {
    color: var(--primary-foreground) !important;
    fill: var(--primary-foreground) !important;
  }
}

// -- Table borders
.fc-theme-standard td,
.fc-theme-standard th {
  border-color: var(--border) !important;
}

// -- Column header cells
.fc-col-header-cell {
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--muted) 50%, transparent);
  }
  @supports not (color: color-mix(in lab, red, red)) {
    background-color: var(--muted);
  }
  padding: 0.5rem !important;
}

.fc-col-header-cell-cushion {
  font-size: var(--text-sm);
  line-height: var(--tw-leading, var(--text-sm--line-height));
  font-weight: var(--font-weight-medium);
  color: var(--muted-foreground);
}

// -- Day grid cells
.fc-daygrid-day {
  background-color: var(--background);
}

.fc-daygrid-day-top {
  font-size: var(--text-sm);
  line-height: var(--tw-leading, var(--text-sm--line-height));
  font-weight: var(--font-weight-medium);
  color: var(--foreground);
  padding: 0.5rem !important;
}

// -- Today highlight
.fc-day-today {
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--accent) 50%, transparent) !important;
  }
  @supports not (color: color-mix(in lab, red, red)) {
    background-color: var(--accent) !important;
  }
}

// -- Events
.fc-event {
  border-radius: calc(var(--radius) - 2px);
  border-width: 0px;
  padding: 0.25rem 0.5rem !important;
  margin: 0.125rem !important;
  background-color: rgba(66, 133, 244, 0.1) !important;
  color: var(--primary-foreground) !important;
  cursor: pointer;

  &:hover {
    opacity: 0.9;
  }
}

.fc-event-title {
  font-size: var(--text-xs);
  line-height: var(--tw-leading, var(--text-xs--line-height));
  font-weight: var(--font-weight-medium);
  padding: 0 !important;
}

.fc-event-time {
  font-size: var(--text-xs);
  line-height: var(--tw-leading, var(--text-xs--line-height));
  padding: 0 !important;
}

.fc-daygrid-event {
  border-radius: calc(var(--radius) - 2px);
}

// -- Popover
.fc-popover {
  border: 1px solid var(--border) !important;
  box-shadow: var(--box-shadow-sm) !important;
  /* --popover, matching KTUI overlay surfaces (with the same fallback the
     other popover consumers in theme.custom.scss use). */
  background-color: var(--popover, var(--background)) !important;
  border-radius: var(--radius-md) !important;
}

.fc-popover-header {
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--muted) 50%, transparent);
  }
  @supports not (color: color-mix(in lab, red, red)) {
    background-color: var(--muted);
  }
  padding: 0.5rem !important;
  border-bottom: 1px solid var(--border) !important;
}

.fc-popover-body {
  padding: 0.5rem !important;
}

// -- "More" link
.fc-more-link {
  font-size: var(--text-xs);
  line-height: var(--tw-leading, var(--text-xs--line-height));
  color: var(--primary);

  &:hover {
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--primary) 80%, transparent);
    }
  }
}

// -- Time grid
.fc-timegrid-slot {
  border-color: var(--border) !important;
}

.fc-timegrid-slot-label {
  font-size: var(--text-xs);
  line-height: var(--tw-leading, var(--text-xs--line-height));
  color: var(--muted-foreground);
}

.fc-timegrid-col {
  border-color: var(--border) !important;
}

// -- List view
.fc-list-event {
  &:hover {
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--accent) 50%, transparent);
    }
    @supports not (color: color-mix(in lab, red, red)) {
      background-color: var(--accent);
    }
  }
}

.fc-list-event-title {
  font-size: var(--text-sm);
  line-height: var(--tw-leading, var(--text-sm--line-height));
  font-weight: var(--font-weight-medium);
  color: var(--foreground);
}

.fc-list-event-time {
  font-size: var(--text-xs);
  line-height: var(--tw-leading, var(--text-xs--line-height));
  color: var(--muted-foreground);
}

// ============================================================================
// BuddyPunch Schedule-specific overrides (existing)
// ============================================================================

.header-wrap ~ .m-body {
  transition: padding 0.3s ease-in;
}

/* Animate the show/hide-menu toggle so the calendar grows/shrinks smoothly
   instead of snapping. Targets every property that the toggle handler
   changes: header collapse, header-spacer margin, schedule-calendar-header
   top margin, and the per-view scroller heights driven by .full-view. */
.header-wrap {
  transition: height 0.3s ease;
}

.header-spacer {
  transition: margin-bottom 0.3s ease;
}

.schedule-calendar-header {
  transition: margin-top 0.3s ease;
}

.schedule-block #schedule_calendar .fc-body .fc-scroller-clip .fc-scroller,
.schedule-block #schedule_calendar .fc-body .fc-widget-content .fc-scroller {
  transition: height 0.3s ease;
}

.header-wrap.main-header-hidden {
  overflow: hidden;
  height: 0 !important;
}
.header-wrap.main-header-hidden .main-header,
.header-wrap.main-header-hidden #navbar-wrapper {
  display: none !important;
}
.header-wrap.main-header-hidden ~ .m-body {
  padding-top: 0 !important;
}
.header-wrap.main-header-hidden ~ .container-fixed #content > div:first-child {
  padding-top: calc(var(--spacing) * 5);
}

.fc #clearAllFiltersBtn {
  height: 100%;
}

.header-wrap.main-header-hidden ~ .m-body #schedule_calendar .fc-view-container .fc-body .fc-scroller {
  height: calc(100vh - 260px);
}

.header-wrap.main-header-hidden ~ .m-body #schedule_calendar .fc-view-container .fc-timeline .fc-body .fc-scroller {
  height: calc(100vh - 360px);
}
.header-wrap.main-header-hidden ~ .m-body #schedule_calendar .fc-view-container .fc-timeline.fc-timelineDay-view .fc-body .fc-scroller {
  height: calc(100vh - 310px);
}




.schedule-block {
  #schedule_calendar {
    .fc-header-toolbar {
      display: flex;
      justify-content: space-between;
      margin: 0;
      border-bottom: 0;
      font-size: .8125rem;

      .fc-left {
        display: flex;
        gap: calc(var(--spacing) * 2);

        .kt-btn {
          padding: 15px 7px;
        }

        .fc-button-group {
          display: flex;
          gap: calc(var(--spacing) * 2);

          .fc-button {
            line-height: 1;
            position: relative;
            display: inline-flex;
            font-size: var(--text-base);
          }

          .fc-button,
          .fc-button:before {
            font-family: 'keenicons-filled' !important;
            speak: never;
            font-style: normal;
            font-weight: normal;
            font-variant: normal;
            text-transform: none;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
            display: inline-flex;

            &.fc-prev-button {
              &:before {
                content: "\eb7b";
              }
            }
            &.fc-next-button {
              &:before {
                content: "\ec2f";
              }
            }

          }
        }
      }

      .fc-right {
        display: flex;
        flex: 1;
        flex-wrap: wrap;
        justify-content: center;

        .kt-btn {
          margin: 0;
          padding: 15px;
        }
      }


      #filterButton {
        overflow: hidden;
        text-overflow: ellipsis;
      }
    }

    .fc th,
    .fc td {
      border-style: solid;
      border-width: 1px;
      padding: 0;
      vertical-align: top; }

    .fc td,.fc th {
      border-style: var(--tw-border-style);
      border-color: var(--border);
      border-width: 1px;
      padding: 0;
      vertical-align: top
    }

    .fc-view-container {
      thead.fc-head {
        td {
          padding: 0;
          border-bottom: none;
          border-style: var(--tw-border-style);
          border-width: 1px;
          border-color: var(--border);
        }
      }
      thead.fc-head.fc-foot {
        th {
          background: var(--color-gray-100);
        }
        td {
          border-bottom: none;

        }
      }

      &:is(.dark *) thead.fc-head.fc-foot th {
        background: color-mix(in oklab, var(--foreground) 8%, var(--card, #1c1c1e));
      }

      .fc-content,
      .fc-divider,
      .fc-list-heading td,
      .fc-list-view,
      .fc-popover,
      .fc-row,
      tbody,
      td,
      th,
      thead {
        border-color: var(--border);
      }
    }


    .fc-timelineDay-view {
      .fc-body .fc-scroller-clip .fc-scroller {
        height: calc(100vh - 384px) !important;
      }
    }

    .fc-timelineWeek-view {
      .fc-body .fc-scroller-clip .fc-scroller {
        height: calc(100vh - 433px) !important;
        min-height: 400px;
      }
    }

    .fc-month-view {
      .fc-body .fc-widget-content .fc-scroller {
        height: calc(100vh - 372px) !important;
        &.h-100 {
          height: 100% !important;
        }
      }
    }

    /* Reclaim ~110px when the top header is hidden (the toggle-header-btn
       handler adds .full-view to #schedule_calendar). Mirrors the legacy
       src/scss/schedule.scss .full-view block. */
    &.full-view {
      .fc-timelineDay-view {
        .fc-body .fc-scroller-clip .fc-scroller {
          height: calc(100vh - 274px) !important;
        }
      }

      .fc-timelineWeek-view {
        .fc-body .fc-scroller-clip .fc-scroller {
          height: calc(100vh - 323px) !important;
        }
      }

      .fc-month-view {
        .fc-body .fc-widget-content .fc-scroller {
          height: calc(100vh - 262px) !important;
        }
      }
    }

    .fc-body .fc-resource-area .fc-widget-content {
          border-bottom: 1px solid var(--border, #E2E4ED);

      .profile-mini-picture {
        min-width: 35px;
        border-radius: 50%;

      }
    }

      #schedule-calendar-subfooter {
      display: block;
      height: 45px;
      background: var(--color-white);
      padding: 20px 0 0 0;
    }

    &:is(.dark *) #schedule-calendar-subfooter {
      background: var(--card, #1c1c1e);
    }
  }










  .dropdown .dropdown-menu .dropdown-submenu {
    display: none !important;
    list-style: none;
    padding-left: 20px;
    margin-bottom: 0px;
  }

  .dropdown .dropdown-menu .dropdown-submenu.show {
    display: inherit !important;
  }

  .dropdown .dropdown-menu .dropdown-submenu .dropdown-item {
    color: #575962;
  }

  #copyToButtonSpan.rotate90 {
    transform: rotate(90deg);
  }

  #clearShiftsMenuButtonSpan.rotate90 {
    transform: rotate(90deg);
  }

  #templatesMenuButtonSpan.rotate90 {
    transform: rotate(90deg);
  }

  .swal2-input {
    font-size: 14px !important;
    line-height: 21px !important;
  }

  #manage_templates_table_wrapper, #apply_template_table_wrapper .row:first-child {
    max-height: calc(100vh - 400px);
    overflow-y: auto;
    overflow-x: hidden;
  }

  .fc-head .fc-resource-area .fc-scroller-clip {
    overflow: visible !important;
  }

  .fc-head .fc-resource-area .fc-scroller-clip .fc-scroller {
    overflow: visible !important;
    margin: 0 !important;
  }

  .fc-head .fc-resource-area .fc-scroller-clip .fc-scroller .fc-content {
    z-index: 3 !important;
  }

  .fc-head .fc-resource-area .fc-cell-content {
    overflow: visible !important;
  }

  .fc-head .fc-cell-text .dropdown-item {
    width: auto;
  }

  #btnSwalSyncCancel {
    margin-left: auto;
  }

  .event-unavailable .fc-content {
    flex-direction: column;
    align-items: center;
  }

  .event-preferred .fc-content {
    flex-direction: column;
    align-items: center;
  }

  @media only screen and (max-width: 1350px) {
    #dropdownLabelViewBy {
      display: none;
    }

    #filterButton {
      width: 100% !important;
    }
}

  @media only screen and (max-width: 576px) {
  .modal-dialog {
    min-width: 200px !important;
    max-width: 500px;
    margin: 1.75rem auto;
  }
}

  @page {
  size: auto;
  margin: 5mm 5mm 0
}

}

/* Calendar Sync modal rules. SweetAlert mounts the modal at document.body,
   outside `.schedule-block`, so descendant selectors scoped to that wrapper
   never match. Hoisted to top level for the same reason as the availability
   tooltip rules below. The Copy buttons themselves use KTUI's tooltip
   (data-kt-tooltip) for the hover text — see #btn-copy-* in schedule.js. */
.modal-cal-sync-content {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  margin: 30px 40px 10px 40px;
}

.modal-cal-sync-content h6 {
  color: var(--foreground);
}

/* Use theme tokens instead of hard-coded light colors so the read-only
   ical-my-schedule / ical-full-schedule inputs and Copy buttons adapt to
   dark mode (the swal popup carries `swal-dark`). --muted reads as a recessed
   light grey in light mode and a dark grey in dark mode. */
.modal-cal-sync-content input {
  max-width: 100%;
  background: var(--muted) !important;
  color: var(--foreground);
  border-color: var(--border);
}

/* The iCal URL inputs (#ical-my-schedule / #ical-full-schedule) are readonly —
   the user only ever selects/copies their text. KTUI's kt-input focus state
   swaps the border to --ring and adds a 3px ring; suppress both so the field
   keeps its resting --border on focus. */
.modal-cal-sync-content input:focus,
.modal-cal-sync-content input:focus-visible {
  border-color: var(--border);
  outline: none;
  box-shadow: none;
  --tw-ring-shadow: 0 0 #0000;
}

.modal-cal-sync-content .btn-copy {
  margin: 0px;
  background: var(--muted);
  border-left: 1px solid var(--border);
  font-weight: normal;
}

/* Inside a kt-input-group, KTUI zeroes the trailing button's left border
   (tailwind.styles.css ~8964: border-inline-start-width: 0 !important) so it
   merges seamlessly with the input. In light mode that's fine — the input's
   own border still delineates the edge. In dark mode the input and Copy
   button share the same --muted background, so the merged seam disappears and
   the button looks fused to the field. Restore a 1px left divider in dark mode.

   This MUST live in @layer components: KTUI's rule is an !important inside that
   layer, and for !important declarations a layered rule always beats an
   unlayered one regardless of specificity. Matching the layer lets our higher
   specificity (the extra .modal-cal-sync-content / :is(.dark *)) win the tie. */
@layer components {
  .modal-cal-sync-content .kt-input-group .kt-input + .btn-copy:is(.dark *),
  /* ptocalendar.js builds the same cal-sync modal but with the input +
     #btn-copy-my-schedule in a plain .flex (no .kt-input-group), so KTUI never
     zeroes the button's left border — it keeps the border-left:1px from
     .btn-copy above. The problem there is only the color: --border is nearly
     invisible against the shared --muted background in dark mode. Give it the
     same visible divider treatment. */
  .modal-cal-sync-content #btn-copy-my-schedule:is(.dark *) {
    border-inline-start-width: 1px !important;
    border-inline-start-style: solid !important;
    /* --border (0.274 L) sits barely above the --muted background (0.21 L), so
       the divider reads as nearly invisible. Mix it toward --muted-foreground
       for a lighter, clearly-visible seam — still fully theme-token-based so it
       tracks the palette. */
    border-inline-start-color: color-mix(in oklab, var(--border), var(--muted-foreground)) !important;
  }
}

/* The Copy buttons keep focus after click (they're never blurred), so KTUI's
   kt-btn focus ring lingers around the button. Suppress the focus outline /
   ring on both cal-sync Copy buttons (#btn-copy-my-schedule and
   #btn-copy-full-schedule) — the copy action gives its own "Copied" tooltip
   feedback, so the focus ring adds nothing. */
.modal-cal-sync-content .btn-copy:focus,
.modal-cal-sync-content .btn-copy:focus-visible {
  outline: none;
  box-shadow: none;
  --tw-ring-shadow: 0 0 #0000;
}

/* Availability tooltip rules used by the Create / Edit Shift modals.
   Hoisted out of `.schedule-block` because the modals are rendered as
   siblings of `.schedule-block` (see Schedule/Index.cshtml), so descendant
   selectors scoped to `.schedule-block` never match the modal markup. */
#row-preferred-tooltip {
  margin-left: 0;
  margin-right: 0;
}

#row-unavailable-tooltip {
  margin-left: 0;
  margin-right: 0;
  margin-top: 15px;
}

#row-preferred-tooltip[style*="display: none"] + #row-unavailable-tooltip {
  margin-top: 0px;
}

.shift-view-availability {
  background-color: transparent;
  color: var(--muted-foreground);
  padding: 5px;
  cursor: pointer;
  padding-top: 0px;
  padding-bottom: 0px;
  line-height: normal;
  font-size: 1rem;
}

.shift-view-availability a {
  color: #1271C4 !important;
  text-decoration: underline !important;
  font-size: 1rem;
  margin-right: 10px;
}

.shift-view-availability i {
  margin-left: 7px;
  color: #1271C4;
  font-size: 1rem;
}

.shift-view-unavailable {
  background-color: transparent;
  color: var(--muted-foreground);
  padding: 5px;
  cursor: pointer;
  padding-top: 0px;
  padding-bottom: 0px;
  line-height: normal;
  font-size: 1rem;
}

.shift-view-unavailable a {
  color: #D93600 !important;
  text-decoration: underline !important;
  font-size: 1rem;
  margin-right: 10px;
}

.availability-tooltip {
  position: relative;
  cursor: pointer;
}

.availability-tooltip .left {
  top: 25px;
  min-width: 300px;
  color: #444444;
  background-color: white;
  border: 1px solid gray;
  font-weight: normal;
  font-size: 13px;
  position: absolute;
  z-index: 99999999;
  box-sizing: border-box;
  box-shadow: 0 1px 8px rgba(0,0,0,0.5);
  display: none;
}

.availability-tooltip .left .unavailable {
  background-color: #999;
  display: flex;
}

.availability-tooltip .left .date-header {
  background: #F7FAFC;
  text-align: center;
  color: black;
  font-weight: bold;
  padding: 5px;
}

.availability-tooltip .left .preferred {
  /*background-color: #53b0f8;*/
  display: flex;
}

.availability-tooltip .left .unavailable div {
  width: 50%;
  display: inline-block;
}

.availability-tooltip .left .preferred div {
  width: 50%;
  display: inline-block;
}

.availability-tooltip .left .unavailable div:first-child {
  background-color: white;
  color: black;
  text-align: right;
  padding: 5px;
  padding-right: 10px;
}

.availability-tooltip .left .unavailable div:first-child div {
  background: rgb(217, 54, 0);
  color: white;
  padding: 3px 10px;
  width: auto;
}

.availability-tooltip .left .unavailable div:last-child {
  background-color: white;
  color: black;
  text-align: left;
  padding: 5px;
}

.availability-tooltip .left .preferred div:first-child {
  /*background-color: #53b0f8;*/
  color: black;
  text-align: right;
  padding: 5px;
  padding-right: 10px;
}

.availability-tooltip .left .preferred div:first-child div {
  background: rgb(18, 113, 196);
  color: white;
  padding: 3px 10px;
  width: auto;
}

.availability-tooltip .left .preferred div:last-child {
  /*background-color: white;*/
  color: black;
  text-align: left;
  padding: 5px;
}

.availability-tooltip:hover .left {
  display: block;
}

.availability-tooltip .left i {
  position: absolute;
  top: 50%;
  left: 100%;
  margin-top: -12px;
  width: 12px;
  height: 24px;
  overflow: hidden;
}

.availability-tooltip .left i::after {
  content: '';
  position: absolute;
  width: 12px;
  height: 12px;
  left: 0;
  top: 50%;
  transform: translate(-50%,-50%) rotate(-45deg);
  background-color: #EEEEEE;
  box-shadow: 0 1px 8px rgba(0,0,0,0.5);
}

.schedule-print-info {
  display: none;
  justify-content: center;
  font-size: 15px;
  color: #000;
}

.schedule-print-info__date {
  position: absolute;
  left: 0;
}

/* ============================================================================
   Print rules for Schedule (all views, especially Month).

   The legacy Bootstrap stylesheet (src/scss/schedule.scss) had an extensive
   @media print block that handled the schedule page chrome, but that file
   is not part of the Metronic 9 bundle (see gulpfile.js `metronic9Css`).
   Without these rules the Month-view print path (window.print() from
   PrintElem in schedule.js) prints the entire app shell: fixed header,
   nav bar, footer, filters row, FC toolbar buttons, and the still-open
   Options dropdown menu (#optionsButton popup).

   Block comments only inside @media print { } -- the metronic9 SCSS files
   are concatenated raw (no sass compile step), and `//` line comments
   risk CSS parser error-recovery dropping subsequent rules.
   ============================================================================ */
@media print {
  .schedule-print-info {
    display: flex !important;
  }

  /* Global Metronic 9 layout chrome. */
  .header-wrap,
  header.main-header,
  .nav-bar,
  .header-spacer,
  footer.footer,
  .trial-spinner-container {
    display: none !important;
  }

  /* KTUI dropdown menus and tooltip popups never belong in the printout.
     Item 44: when Print is invoked from the Options dropdown, the menu is
     still in the open state when window.print() snapshots the document. */
  .kt-dropdown-menu,
  .kt-tooltip,
  [data-kt-tooltip-content] {
    display: none !important;
  }

  /* Page-level action rows above the calendar. */
  .bp-view-toggle,
  #optionsButton,
  #publishShiftsButton,
  #sendScheduleButton,
  .toggle-header-btn {
    display: none !important;
  }

  /* Filter row + mobile filter trigger/panel + relocated FC controls. */
  .schedule-calendar-header .filtersWrap,
  #mobile-filter-trigger,
  #mobile-filter-panel,
  #mobile-fc-controls {
    display: none !important;
  }

  /* FullCalendar navigation buttons (prev/next/today, day/week/month).
     Leave .fc-center so the period title still prints above the grid. */
  #schedule_calendar .fc-header-toolbar .fc-left,
  #schedule_calendar .fc-header-toolbar .fc-right,
  #schedule_calendar .fc-header-toolbar .fc-clear {
    display: none !important;
  }

  /* Reclaim the layout's horizontal padding (sm:px-[25px] md:px-[25px]
     lg:px-[60px] on the content container) so the month grid uses the
     full printable width. */
  .container-fixed,
  main#content,
  main#content > div {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Month view: let the inner scroller render at intrinsic height so all
     weeks print, and keep each week-row intact across page breaks. */
  .schedule-block #schedule_calendar .fc-month-view .fc-body .fc-widget-content .fc-scroller {
    height: auto !important;
    overflow: visible !important;
  }
  #schedule_calendar .fc-month-view .fc-day-grid .fc-row {
    break-before: avoid;
    break-inside: avoid;
    break-after: avoid;
  }

  /* Keep event borders visible when the browser drops background colors. */
  #schedule_calendar .fc-view-container .fc-event.event-published {
    border: 1px solid !important;
  }

  /* Force browsers to honor event background colors for parity with QA1. */
  #schedule_calendar .fc-event,
  #schedule_calendar .fc-event * {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}

/* Total row highlight */
#schedule_calendar .fc-view-container tr[data-resource-id="0"],
#schedule_calendar .fc-view-container tr[data-resource-id="0"] .fc-widget-content {
  background: #eff8ff !important;
}

#schedule_calendar:is(.dark *) .fc-view-container tr[data-resource-id="0"],
#schedule_calendar:is(.dark *) .fc-view-container tr[data-resource-id="0"] .fc-widget-content {
  background: color-mix(in oklab, var(--primary, #1b84ff) 10%, var(--card, #1c1c1e)) !important;
}

/* ── Metronic 9 FullCalendar v3 theme ───────────────────────────────── */

#schedule_calendar {
  .fc-toolbar {
    padding: 0.75rem 1rem;
    margin-bottom: 0;
    border-bottom: 1px solid var(--border, #e9ecef);

    h2 {
      font-size: 1rem;
      font-weight: 600;
      color: var(--foreground, #1e2129);
      line-height: 1.5;
    }
  }

  /* Buttons — match kt-btn kt-btn-light style */
  .fc-button {
    background: var(--card, #fff);
    background-image: none;
    border: 1px solid var(--border, #dbdfe9);
    border-radius: 0.5rem;
    color: var(--foreground, #1e2129);
    font-size: 0.8125rem;
    font-weight: 500;
    height: auto;
    padding: 0.375rem 0.75rem;
    box-shadow: none;
    text-shadow: none;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;

    &:hover,
    &:focus {
      background: color-mix(in oklab, var(--primary) 8%, var(--card, #fff));
      border-color: var(--primary, #1b84ff);
      color: var(--primary, #1b84ff);
      box-shadow: none;
      outline: none;
    }
  }

  .fc-state-active,
  .fc-state-down,
  .fc-button.fc-state-active {
    z-index: 2;
    background: #F7F7F7;
    border-color: var(--input);
    color: #000;
    font-weight: 500;
    box-shadow: none;
  }

  &:is(.dark *) .fc-state-active,
  &:is(.dark *) .fc-state-down,
  &:is(.dark *) .fc-button.fc-state-active {
    background: color-mix(in oklab, var(--foreground) 10%, var(--card, #1c1c1e));
    color: var(--foreground);
  }

  .fc-state-disabled {
    opacity: 0.5;
    pointer-events: none;
  }

  /* Button group borders */
  .fc-button-group .fc-button {
    border-radius: 0;

    &:first-child {
      border-top-left-radius: 0.5rem;
      border-bottom-left-radius: 0.5rem;
    }

    &:last-child {
      border-top-right-radius: 0.5rem;
      border-bottom-right-radius: 0.5rem;
    }
  }

  /* Calendar grid */
  .fc-widget-header,
  .fc-widget-content {
    border-color: var(--border, #dbdfe9);
  }

  .fc-day-header,
  .fc-widget-header {
    background: color-mix(in oklab, var(--muted, #f9f9f9) 50%, transparent);
    color: var(--muted-foreground, #78829d);
    font-size: 0.8rem;
    font-weight: 600;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--border);
  }

  /* Today highlight — text color only.
     FC's bundled stylesheet sets `background: var(--muted)` on
     `.fc-unthemed td.fc-today` and `border-style: double` on
     `.fc td.fc-today`, which makes today's column body cells visibly
     differ from the surrounding columns. Reset both so the today body
     cells blend with the rest of the grid; only the header date label
     keeps a visual cue via color + weight (QA round 4, item 13 — "Today
     column has blue background across whole column"). */
  td.fc-today {
    background: transparent !important;
    border-style: solid !important;
  }

  .fc-today .fc-cell-text {
    color: var(--primary, #1b84ff);
    font-weight: 600;
  }

  /* Resource area */
  .fc-resource-area {
    background: color-mix(in oklab, var(--muted, #f9f9f9) 60%, transparent);

    .fc-cell-text {
      font-size: 0.8125rem;
      font-weight: 500;
      color: var(--foreground, #1e2129);
    }
  }

  /* Events — apply the same base treatment to Week (timeline) and
     Month-view events so they share padding, border, and typography. */
  .fc-timeline-event,
  .fc-month-view .fc-event {
    border-radius: 0.375rem;
    border: none;
    padding: 0.125rem 0.5rem;
    font-size: 0.75rem;
    font-weight: 500;
  }

  /* Scrollbar — applied to .fc-scroller and any related scrolling
     containers FullCalendar v3 wraps it in (.fc-scroller-clip, etc.).
     Thumb tinted to the native page-scrollbar shade (QA item 66 — the old
     var(--border) thumb was near-white, far lighter than the page's native
     scrollbar and hard to see). Mirrors the dark-mode formula below
     (foreground 25% over the surface); in light mode this lands at ~#bbb,
     matching the OS scrollbar grey while keeping the thin Metronic width. */
  .fc-scroller,
  .fc-scroller-clip {
    scrollbar-width: thin;
    scrollbar-color: color-mix(in oklab, var(--foreground) 25%, var(--background)) transparent;
  }

  .fc-scroller::-webkit-scrollbar,
  .fc-scroller-clip::-webkit-scrollbar {
    width: 5px;
    height: 5px;
  }

  .fc-scroller::-webkit-scrollbar-track,
  .fc-scroller-clip::-webkit-scrollbar-track,
  .fc-scroller::-webkit-scrollbar-corner,
  .fc-scroller-clip::-webkit-scrollbar-corner {
    background: transparent;
  }

  .fc-scroller::-webkit-scrollbar-thumb,
  .fc-scroller-clip::-webkit-scrollbar-thumb {
    background: color-mix(in oklab, var(--foreground) 25%, var(--background));
    border-radius: 4px;
  }

  /* Dark mode — --border alone blends into the dark card; lift the thumb
     toward the foreground so it stays visible, and brighten the subtle
     bottom shadow scheduler.min.css applies to .fc-scroller and the
     timeline header's scroller. */
  &:is(.dark *) {
    .fc-scroller,
    .fc-scroller-clip {
      scrollbar-color: color-mix(in oklab, var(--foreground) 25%, var(--card, #1c1c1e)) transparent;
    }

    .fc-scroller::-webkit-scrollbar-thumb,
    .fc-scroller-clip::-webkit-scrollbar-thumb {
      background: color-mix(in oklab, var(--foreground) 25%, var(--card, #1c1c1e));
    }

    .fc-scroller,
    .fc-timeline.fc-scrolled .fc-head .fc-scroller {
      box-shadow: 0 3px 4px rgba(0, 0, 0, 0.35);
    }
  }
}

/* Availability event colors. Wrapped in @layer components because
   tailwind.styles.css emits `.fc-event:not(.fc-list-event) {
   background-color: var(--primary) !important; }` inside that same layer.
   Layered !important beats unlayered !important regardless of specificity,
   so we have to live in the layer to override. */
@layer components {
  /* Schedule view only — Availability view shares .schedule-block but has
     its own treatment, so these rules are scoped to the .schedule-shifts
     class added on the Schedule wrapper. */
  /* Preferred blocks must be readable WITHOUT hover (AB#14291) — a light
     primary tint (kt-badge-light recipe) so they stand apart from both real
     shifts (solid colors) and Unavailable (muted grey). */
  .schedule-shifts .fc-event.event-preferred {
    background: color-mix(in oklab, var(--primary) 8%, var(--card, #fff)) !important;
    color: var(--primary) !important;
    border: 1px solid color-mix(in oklab, var(--primary) 35%, var(--card, #fff)) !important;
    box-shadow: none !important;
  }

  .schedule-shifts .fc-event.event-preferred:hover {
    background-color: color-mix(in oklab, var(--primary) 14%, var(--card, #fff)) !important;
    color: var(--primary) !important;
    opacity: 1 !important;
  }

  .schedule-shifts:is(.dark *) .fc-event.event-preferred {
    background: oklch(0.25 0.06 259.8) !important;
    color: oklch(0.78 0.11 259.8) !important;
    border: 1px solid oklch(0.37 0.1 259.8) !important;
    box-shadow: none !important;
  }

  .schedule-shifts:is(.dark *) .fc-event.event-preferred:hover {
    background-color: oklch(0.28 0.07 259.8) !important;
    color: oklch(0.82 0.11 259.8) !important;
    opacity: 1 !important;
  }

  .schedule-shifts .fc-event.event-unavailable {
    background-color: #f4f6f9 !important;
    color: #c3c7cc !important;
    border: none !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
  }

  .schedule-shifts .fc-event.event-unavailable:hover {
    background-color: #f4f6f9 !important;
    color: #c3c7cc !important;
    opacity: 1 !important;
  }

  /* Dark-mode counterpart — the hardcoded #f4f6f9 / #c3c7cc is invisible on
     a dark card. Mix a small foreground tint over the card so the
     unavailable block still reads as a flat muted surface. */
  .schedule-shifts:is(.dark *) .fc-event.event-unavailable,
  .schedule-shifts:is(.dark *) .fc-event.event-unavailable:hover {
    background-color: color-mix(in oklab, var(--foreground) 8%, var(--card, #1c1c1e)) !important;
    color: var(--muted-foreground) !important;
    border: none !important;
    box-shadow: none !important;
    opacity: 1 !important;
  }

  /* Availability view — separate treatment from Schedule. */
  .schedule-availability .fc-event.event-preferred {
    background-color: lightcyan !important;
    color: var(--foreground) !important;
    border: 1px solid lightgray !important;
    box-shadow: none !important;
  }

  .schedule-availability .fc-event.event-preferred:hover {
    background-color: lightcyan !important;
    color: var(--foreground) !important;
    opacity: 1 !important;
  }

  .schedule-availability .fc-event.event-unavailable {
    background-color: cornsilk !important;
    color: var(--foreground) !important;
    border: 1px solid lightgray !important;
    box-shadow: none !important;
  }

  .schedule-availability .fc-event.event-unavailable:hover {
    background-color: cornsilk !important;
    color: var(--foreground) !important;
    opacity: 1 !important;
  }

  /* Dark mode — keep the cool/warm semantic the light mode established
     (lightcyan = cool/preferred, cornsilk = warm/unavailable) but swap
     to saturated source hues and bump the mix ratio. The previous 22%
     mix of pale-near-white colors into a near-black card produced two
     barely-distinguishable dark greys (QA round 4, item 16 — "hard to
     tell the difference in color between preferred and unavailable
     entries in dark mode"). */
  .schedule-availability:is(.dark *) .fc-event.event-preferred,
  .schedule-availability:is(.dark *) .fc-event.event-preferred:hover {
    background-color: color-mix(in oklab, #1c8ea3 45%, var(--card, #1c1c1e)) !important;
    color: var(--foreground) !important;
    border: 1px solid color-mix(in oklab, #4dd0e1 60%, var(--card, #1c1c1e)) !important;
  }

  .schedule-availability:is(.dark *) .fc-event.event-unavailable,
  .schedule-availability:is(.dark *) .fc-event.event-unavailable:hover {
    background-color: color-mix(in oklab, #a8741a 45%, var(--card, #1c1c1e)) !important;
    color: var(--foreground) !important;
    border: 1px solid color-mix(in oklab, #ffb74d 60%, var(--card, #1c1c1e)) !important;
  }

  /* The .schedule-block .fc-timeline-event rule below hardcodes #4E4E4E text,
     which is unreadable on the dark availability blocks. Restore the
     foreground token on the Availability view in dark mode. */
  .schedule-availability:is(.dark *) .fc-timeline-event {
    color: var(--foreground) !important;
  }

  /* Availability timeline events stack title above the notes icon
     (.event-unavailable / .event-preferred .fc-content uses
     flex-direction: column). Shrink the title and clip with ellipsis
     so a long type label doesn't visually run into the .fc-notes-icon
     sitting at the top-right of the event. The 18px right cap on the
     title leaves room for the 13px SVG note icon plus a small gap. */
  .schedule-availability .fc-timeline-event.event-unavailable .fc-title,
  .schedule-availability .fc-timeline-event.event-preferred .fc-title {
    font-size: 11px !important;
    max-width: calc(100% - 18px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .schedule-block .fc-event .fc-title {
    font-size: 14px !important;
  }

  .schedule-block.schedule-shifts .fc-event.event-unavailable .fc-title,
  .schedule-block.schedule-shifts .fc-event.event-preferred .fc-title {
    font-size: 11px !important;
  }

  /* Pack title + hour badge + trailing icons together at the start so the
     .fc-hour-count sits right next to the .fc-title instead of being pushed
     to the right edge of the event. min-width: 0 + flex-shrink: 1 keeps the
     ellipsis behavior on long titles. Applied to both Week (timeline) and
     Month-view events. */
  .fc-time-area .fc-widget-content .fc-timeline-event .fc-content,
  .fc-month-view .fc-event .fc-content {
    display: flex;
    align-items: center;
  }

  .fc-time-area .fc-widget-content .fc-timeline-event .fc-title,
  .fc-month-view .fc-event .fc-title {
    flex: 0 1 auto;
    min-width: 0;
  }

  /* tailwind.styles.css sets `color: var(--primary-foreground) !important`
     on .fc-event:not(.fc-list-event), which makes the event text unreadable
     on the per-event 10% tinted background. Applied to both Week (timeline)
     and Month-view events. The Month-view selector deliberately drops the
     .schedule-block prefix to keep specificity at 2 classes — matching the
     timeline rule — so per-state availability overrides
     (.schedule-shifts .fc-event.event-unavailable, etc.) still win. */
  .schedule-block .fc-timeline-event,
  .fc-month-view .fc-event {
    color: #4E4E4E !important;
  }

  /* The notes icon is an <i> element, which is italic by default and
     would otherwise pass that down to the kt-tooltip span inside it.
     Render it inline alongside the hour-count and trade/cover badges so
     a shift that has both notes AND a pending trade/cover doesn't end up
     with the absolute notes icon stacked on top of the T/C badge
     (QA round 5, item 23 — "notes icon covers the T/C icon"). */
  .schedule-block .fc-event .fc-notes-icon {
    font-style: normal;
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    margin-left: 3px;
    line-height: 1;
  }

  /* Trade / Cover indicator badges (the "T" / "C" letter pills shown on a
     shift that is pending a trade or cover request). Sized to match the
     legacy .m-badge--trade / --cover treatment so the badge reads as a
     small inline tag next to the title without pushing other elements. */
  .schedule-block .fc-event .fc-shift-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-width: 15px;
    width: 15px;
    min-height: 15px;
    height: 15px;
    margin: 0 3px;
    padding: 0;
    font-size: 10px;
    font-weight: 600;
    font-style: normal;
    line-height: 1;
    border-radius: 0.25em;
  }

  .schedule-block .fc-event .fc-shift-badge--trade {
    background-color: #01B47D;
    color: #fff;
  }

  .schedule-block .fc-event .fc-shift-badge--cover {
    background-color: #D3E2FD;
    color: #3f4047;
  }

  .schedule-block:is(.dark *) .fc-event .fc-shift-badge--cover {
    background-color: #4F6A99;
    color: #fff;
  }

  .bp-btn-cover-pending,
  .bp-btn-cover-pending:focus {
    background-color: #D3E2FD;
    border-color: #D3E2FD;
    color: #3f4047;
  }
  .bp-btn-cover-pending:hover {
    background-color: color-mix(in oklab, #D3E2FD 90%, #000);
    border-color: color-mix(in oklab, #D3E2FD 90%, #000);
    color: #3f4047;
  }
  :is(.dark *).bp-btn-cover-pending,
  :is(.dark *) .bp-btn-cover-pending {
    background-color: #4F6A99;
    border-color: #4F6A99;
    color: #fff;
  }
  :is(.dark *) .bp-btn-cover-pending:hover {
    background-color: color-mix(in oklab, #4F6A99 90%, #fff);
    border-color: color-mix(in oklab, #4F6A99 90%, #fff);
  }

  .schedule-block .fc-event .fc-shift-badge,
  .schedule-block .fc-event .fc-notes-icon {
    position: relative;
  }
  .schedule-block .fc-event .kt-tooltip.show {
    position: absolute;
    z-index: 100;
    background-color: var(--popover);
    color: var(--popover-foreground);
    border: 1px solid var(--border);
    white-space: nowrap;
    pointer-events: none;
  }
}

/* Outside @layer components on purpose. The legacy
   `src/scss/schedule.scss` has an unlayered rule
   `.fc-event .fc-hour-count { border: 0; border-radius: 10px; }`
   and unlayered normal declarations beat layered ones regardless of
   specificity, so a copy of this rule inside @layer components would
   silently lose. */
.schedule-block .fc-timeline-event .fc-hour-count,
.schedule-block .fc-month-view .fc-event .fc-hour-count,
.schedule-block .resource_hours .kt-badge {
  border: 1px solid;
  min-height: 18px;
  /* Floor of 23px, but the badge grows to fit wider content. flex-shrink: 0
     stops the parent flex row (.fc-content is display:flex) from squeezing the
     badge down to the 23px floor — which would clip values like "10.25h" — and
     nowrap keeps the value on one line as the badge widens. */
  min-width: 23px;
  width: auto;
  flex-shrink: 0;
  white-space: nowrap;
  padding: 0 2px;
  gap: 0;
  border-radius: 5px;
  font-size: 10px;
  font-weight: 500;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
}

.schedule-block .fc-timeline-event .fc-hour-count,
.schedule-block .fc-month-view .fc-event .fc-hour-count {
  margin-left: 2px;
  margin-right: 2px;
}

/* Pack the .fc-content row tightly at the start so the .fc-hour-count
   badge sits next to the .fc-title rather than at the far edge. Applied
   to both Week (timeline) and Month-view events. */
#schedule_calendar .fc-view-container .fc-time-area .fc-timeline-event .fc-content,
#schedule_calendar .fc-view-container .fc-month-view .fc-event .fc-content {
  justify-content: flex-start;
}

.schedule-block .fc-event .fc-notes-icon {
  margin: 0 0 0 3px;
}

.schedule-block .fc-event .fc-content > .fc-hour-count {
  margin-left: auto;
}

.pto-hours-duration .hours-count {
  border: 1px solid;
  min-height: 18px;
  min-width: 23px;
  padding: 0;
  gap: 0;
  border-radius: 5px;
  font-size: 10px;
  font-weight: 500;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
}

.resource_label.text-muted-foreground.text-xs {
  font-size: 13px !important;
}

.pto-time-holder {
  display: flex;
  flex-direction: column;
}

.pto-time-holder .hours-count.fc-hour-count {
  border: 1px solid;
  min-height: 18px;
  min-width: 23px !important;
  max-width: none !important;
  width: auto !important;
  padding: 0 4px;
  gap: 0;
  border-radius: 5px;
  font-size: 10px;
  font-weight: 500;
  box-sizing: border-box;
  display: inline-flex !important;
  align-self: flex-start !important;
  justify-content: center;
  align-items: center;
  white-space: nowrap !important;
  flex: 0 0 auto;
}

.schedule-block .resource_hours .kt-badge.kt-badge-stroke {
  border-color: #E4E4E7;
}

.schedule-block .resource_hours .kt-badge.kt-badge-outline.kt-badge-primary {
  border-color: #CDE4FF;
  color: #0275DD;
}

/* Open Shift events render with no fill and a dashed indigo border so they
   visually read as a placeholder waiting to be assigned. The base .fc-event
   rule sets a default blue tinted background with !important, so this rule
   needs !important on both background and border to win. */
#schedule_calendar .fc-view-container .fc-event.event-openshift {
  background-color: transparent !important;
  border: 1px dashed rgb(63, 81, 181) !important;
}

/* QA item 65 — match the Time Off Calendar's outline on Schedule PTO events.
   The legacy src/scss/schedule.scss rule
   `#schedule_calendar .fc-view-container .event-pto { border: 1.5px solid #CCC }`
   (specificity 1,2,0) is concatenated after this file via custom.scss, so the
   override carries an extra .fc-event class (1,3,0) to win on specificity
   without !important. The Time Off Calendar event uses `1px solid var(--border)`,
   so mirror that here — the token also gives the dark-mode parity #CCC lacked.
   Left in src/metronic9/ (not the legacy file) so only the new theme changes;
   the legacy rule still drives the old-theme bundle. */
#schedule_calendar .fc-view-container .fc-event.event-pto {
  border: 1px solid var(--border);
}

/* Time-off (PTO/Sick/Holiday/etc.) badge inside a time-off event card.
   The hours pill (.fc-hour-count) is forced to min-height: 18px by the
   .schedule-block .fc-timeline-event .fc-hour-count rule above, but the
   .kt-badge-xs PTO code badge is only 16px tall, so when they sit
   side-by-side in the View-by-Employee row their top/bottom edges
   visibly diverge by ~2px. Pin the PTO badge to the same 18px height so
   the two pills line up. */
#schedule_calendar .fc-view-container .event-pto .pto-calendar-event-code {
  min-height: 18px;
  align-items: center;
}

/* Long PTO codes must truncate instead of overflowing .fc-title and running
   under the trailing .fc-hour-count ("8h") pill. .fc-title already shrinks
   (flex: 0 1 auto; min-width: 0) and .fc-hour-count no longer shrinks, so
   clipping the title and ellipsizing the code badge keeps the two from
   overlapping. The badge is a kt-badge (inline-flex), on which text-overflow
   has no effect, so switch it to inline-block; the mono/roundless badge has no
   border or vertical padding, so line-height: 18px recenters the single line
   that align-items: center used to handle. */
#schedule_calendar .fc-view-container .event-pto .fc-title {
  overflow: hidden;
}

#schedule_calendar .fc-view-container .event-pto .fc-title .pto-calendar-event-code {
  display: inline-block;
  max-width: -webkit-fill-available;
  max-width: -moz-available;
  max-width: stretch;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 18px;
  text-align: center;
  vertical-align: middle;
}

/* Stop the trailing hours pill from sitting flush against the ellipsized code.
   The pill floats right via `margin-left: auto`, which collapses to 0 when the
   event is too narrow for any free space, leaving the code and the pill's 1px
   outline touching. A non-collapsing margin-right on the title guarantees a gap
   on the pill's LEFT regardless of width, while the pill's own margin-right
   keeps the gap on its RIGHT. Drop the pill's horizontal padding (the element's
   `px-0` is otherwise overridden by the unlayered .fc-hour-count padding rules)
   so it stays compact; min-width: 23px + justify-content: center keep "8h"
   centered. */
#schedule_calendar .fc-view-container .event-pto .fc-title {
  margin-right: 4px;
}

#schedule_calendar .fc-view-container .event-pto .fc-hour-count {
  padding-left: 0;
  padding-right: 0;
}

/* PTO events are read-only on the calendar (no click/drag handler), so the
   pointer cursor FullCalendar applies to every event is misleading. */
#schedule_calendar .fc-view-container .event-pto,
#schedule_calendar .fc-view-container .event-pto * {
  cursor: default;
}

/* Tighten PTO event padding to 0.25rem on all sides. The competing rule
   `.fc-event:not(.fc-list-event) { padding: 0.25rem 0.5rem !important }`
   lives inside @layer components, and layered !important beats unlayered
   !important regardless of specificity (see the longer note above the
   Availability event-color block), so this override has to live in the
   layer too. schedule.scss ships as plain CSS, so the compound selector
   is written flat instead of relying on native CSS nesting. */
@layer components {
  .fc-event:not(.fc-list-event).event-pto {
    padding: 0.25rem !important;
  }
}

/* The notes icon is absolutely positioned (top:1px; right:0) so it
   floats in the top-right of multi-line shift cards without pushing
   other content. Time-off cards are single-row in View-by-Job-Code
   condensed views, which puts the absolute icon directly on top of
   the hours pill (.fc-hour-count) at the right edge. For PTO events,
   let the notes icon flow inline at the end of .fc-content so it sits
   after the hours pill instead of overlapping it. */
#schedule_calendar .fc-view-container .event-pto .fc-notes-icon {
  position: static;
  margin-inline-start: 4px;
  flex-shrink: 0;
}

/* Availability Create/Edit modals use `grid grid-cols-3` with col-span-2 on
   the right column. NOTE: these modals reuse the same element ids as the
   Shift modals (#createShiftModal / #editShiftModal), so the id-scoped Shift
   rule below always outranked this class-scoped one and this rule never
   fired — the availability modals actually rendered with the Shift template
   (label calc(20% + 30px)). AB#14213 scoped the Shift rule away with
   :not(.availability-event-modal); this template now takes effect, so keep
   it at the historical effective values: the label column must stay wide
   enough for the checkbox + "Repeat Every:" to fit on one line. We must
   keep three tracks — collapsing to two would push every col-span-2 child
   onto an implicit second row. The modals are rendered as siblings of
   `.schedule-block` (not descendants), so this rule lives at the top level
   rather than nested inside the `.schedule-block` wrapper. */
.availability-event-modal .kt-form-item.grid.grid-cols-3 {
  grid-template-columns: calc(20% + 30px) minmax(0, 1fr) minmax(0, 0.8fr);
}

/* Create/Edit Shift modals — same problem as Availability modals above:
   the default `grid-cols-3` makes the label column too wide for the short
   labels ("From:", "To:", "Break:", etc.). Fixed 110px label column; cols
   2 + 3 split the remainder equally. AB#14213: the previous 1fr / 0.8fr
   split left col 3 at ~142px — narrower than the custom-repeats group
   (60px interval input + unit select), so the group sat flush against the
   modal edge and the interval input was the first thing squeezed. Equal
   shares give col 3 ~166px, so the group ends with breathing room like
   the ShiftColorId select above it. */
#createShiftModal:not(.availability-event-modal) .kt-form-item.grid.grid-cols-3,
#editShiftModal:not(.availability-event-modal) .kt-form-item.grid.grid-cols-3 {
  grid-template-columns: 110px minmax(0, 1fr) minmax(0, 1fr);
}

/* Recurrence-type select grows to span cols 2 + 3 when schedule.js adds
   `.big` (Monthly / Annually / Every weekday) — these labels are long
   ("Monthly on the second Wednesday", "Annually on September 30", …) and
   get truncated inside the narrower col 2 alone. The `.big` class is never
   set when "Custom…" is selected (which is when `.customTypeField`
   becomes visible in col 3), so the two never compete for col 3. */
#createShiftModal #RecurrenceTypeWrapper.big,
#editShiftModal #RecurrenceTypeWrapper.big {
  grid-column: 2 / span 2;
}

/* theme.custom.scss applies `padding-right: 15px` globally to
   .kt-select-option-text. In the cramped Shift modals that padding eats
   into the displayed option text; drop it here. */
#createShiftModal .kt-select-option-text,
#editShiftModal .kt-select-option-text {
  padding-right: 0;
}

/* schedule-days-block repeat-day pills — the light-mode rule lives in
   src/scss/schedule.scss with hardcoded #f1f3f4 / #80868b / #D1E3FA,
   which are unreadable on the dark card surface. Re-skin each state
   with Metronic v9 tokens so the pills tint with the rest of the
   surface in dark mode. */
.dark .schedule-days-block .schedule-day .schedule-day__caption {
  color: var(--muted-foreground);
  background-color: color-mix(in oklab, var(--foreground) 8%, var(--card, #1c1c1e));
}

.dark .schedule-days-block .schedule-day input:checked + .schedule-day__caption {
  color: var(--primary-foreground);
  background-color: var(--primary);
}

.dark .schedule-days-block .schedule-day input:disabled + .schedule-day__caption {
  color: var(--muted-foreground);
  background-color: color-mix(in oklab, var(--primary) 25%, var(--card, #1c1c1e));
}

/* FOUC fix — hide the native <select> filter elements inside .filtersWrap
   until kt-select has wrapped them. Without this, on first paint the
   unstyled multi-selects (Locations, Department Codes, Positions, Time
   Off, Employees) render as tall scrolling listboxes before the JS init
   runs and replaces them with the compact kt-select pills. KTUI sets
   `data-kt-select-initialized="true"` on the native <select> after wrap
   and also adds `.hidden`, so once init completes this rule no longer
   matches and KTUI's own `.hidden` takes over hiding the native. The
   existing rule in theme.custom.scss only covers selects with the
   `data-kt-select="true"` attribute; Schedule/Availability filter selects
   are marked with the `kt-select` class instead. */
.filtersWrap select.kt-select:not([data-kt-select-initialized="true"]) {
  display: none;
}

/* Schedule/Availability filter triggers — compact pill style for the
   .scheduleFilter kt-selects (location / department / position / pto /
   employee) plus the #viewBySelect single-select. KTUI clears the
   original <select>'s className on init and *moves* the classes:
   display-specific ones (`kt-select`) go onto the rendered display
   element, and the rest (including `scheduleFilter`) onto the
   [data-kt-select-wrapper] sibling. Target the wrapper for the
   scheduleFilter group; for viewBySelect (no class to anchor on)
   reach the wrapper via the original <select>'s preserved id —
   KTUI does not strip the id, only the className. Active state uses
   :has(option:checked) on a stable parent; kt-select-fix.js keeps
   the native <option>.selected state in sync with KTUI's internal
   state, so :checked is a reliable signal. Shares the #0275DD /
   #CDE4FF accent with .resource_hours kt-badge above. */
.kt-select-wrapper.scheduleFilter .kt-select-display.kt-select,
select#viewBySelect + [data-kt-select-wrapper] .kt-select-display.kt-select {
  height: 28px !important;
  min-height: 28px !important;
  padding-block: 0 !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  border-color: #E4E4E7 !important;
  background-color: #F7F7F7 !important;
  background-size: 11px 8px !important;
}

/* KTUI moves Tailwind utilities from the original <select> onto the
   wrapper at init, so `class="kt-select min-w-[200px] scheduleFilter"`
   leaves `min-w-[200px]` (=200px) on .kt-select-wrapper. Strip it so
   the pill sizes to content (placeholder text + chevron) and lines up
   with the compact 28px height. Scoped to scheduleFilter so we don't
   touch other kt-select instances elsewhere on the page. */
.kt-select-wrapper.scheduleFilter {
  min-width: 0 !important;
}

/* Give the placeholder text breathing room before the chevron — the
   trigger's padding-inline-end already reserves space for the SVG, but
   long placeholder labels (e.g. "Department Codes") sit right against
   that reserve without this extra 15px. */
.kt-select-wrapper.scheduleFilter .kt-select-placeholder,
select#viewBySelect + [data-kt-select-wrapper] .kt-select-placeholder {
  padding-right: 15px !important;
}

/* Widen the right padding to 25px on any Schedule filter trigger that
   has a selected value, so the chip / "N selected" label clears the
   chevron without truncation. */
.filter-item:has(option:checked) .kt-select-wrapper.scheduleFilter .kt-select-display.kt-select {
  padding-right: 25px !important;
}

/* Nudge the chevron up a hair (0.04rem) on multi-select triggers so it
   sits visually centered against the 28px compact pill height instead
   of KTUI's default 34px-tuned position (right 0.5rem top 0.675rem). */
.kt-select-wrapper.scheduleFilter .kt-select-display.kt-select[data-multiple="true"] {
  background-position: right 0.5rem top 0.635rem !important;
}

.filter-item:has(option:checked) .kt-select-wrapper.scheduleFilter .kt-select-display.kt-select {
  color: #0275DD !important;
  border-color: #CDE4FF !important;
  background-color: #EFF6FF !important;
}

/* Suppress KTUI's default focus / open-state treatment on .kt-select
   (border tints to var(--ring), a 3px ring shadow appears, and .active
   is toggled while the dropdown is open). Keep the pill flat and let
   the base / active-state rules above own border-color and shadow. */
.kt-select-wrapper.scheduleFilter .kt-select-display.kt-select,
select#viewBySelect + [data-kt-select-wrapper] .kt-select-display.kt-select {
  &:focus,
  &:focus-visible,
  &.active {
    box-shadow: none !important;
    --tw-ring-shadow: 0 0 #0000 !important;
    --tw-ring-color: transparent !important;
    outline: none !important;
    border-color: #E4E4E7 !important;
  }
}

.filter-item:has(option:checked) .kt-select-wrapper.scheduleFilter .kt-select-display.kt-select {
  &:focus,
  &:focus-visible,
  &.active {
    border-color: #CDE4FF !important;
  }
}

/* Clear-all-filters button — match the 11px / 400-weight type of the
   filter pills it sits next to (the .kt-btn baseline is heavier and
   larger). Lives inside a .filter-item in both Schedule/Index.cshtml
   and Schedule/Availability.cshtml. */
#clearAllFiltersBtn {
  width: 84px !important;
  height: 28px !important;
  font-size: 11px !important;
  font-weight: 400 !important;
}

/* Match the dropdown contents (options, group headers, search input) to
   the 11px trigger size so the open menu doesn't jump to a larger
   default. The dropdown is a descendant of the wrapper element, so the
   same anchors used above reach it. */
.kt-select-wrapper.scheduleFilter .kt-select-dropdown,
.kt-select-wrapper.scheduleFilter .kt-select-dropdown .kt-select-option,
.kt-select-wrapper.scheduleFilter .kt-select-dropdown .kt-select-option-text,
.kt-select-wrapper.scheduleFilter .kt-select-dropdown .kt-select-group-header,
.kt-select-wrapper.scheduleFilter .kt-select-dropdown .kt-select-search .kt-input,
.kt-select-wrapper.scheduleFilter .kt-select-dropdown .kt-select-select-all-button,
select#viewBySelect + [data-kt-select-wrapper] .kt-select-dropdown,
select#viewBySelect + [data-kt-select-wrapper] .kt-select-dropdown .kt-select-option,
select#viewBySelect + [data-kt-select-wrapper] .kt-select-dropdown .kt-select-option-text,
select#viewBySelect + [data-kt-select-wrapper] .kt-select-dropdown .kt-select-group-header,
select#viewBySelect + [data-kt-select-wrapper] .kt-select-dropdown .kt-select-search .kt-input,
select#viewBySelect + [data-kt-select-wrapper] .kt-select-dropdown .kt-select-select-all-button {
  font-size: 13px !important;
}

/* Dark-mode counterparts for the filter pills. The hardcoded #F7F7F7 /
   #E4E4E7 / #EFF6FF / #CDE4FF / #0275DD palette would either disappear
   into the dark card or look like out-of-theme islands. Mirror the
   pattern used by the .schedule-days-block pills and the
   .schedule-status-col total cells: surface = foreground mixed into
   --card for neutral, --primary mixed into --card for active. Re-skin
   the focus override too so it tracks the active border color. */
.dark .kt-select-wrapper.scheduleFilter .kt-select-display.kt-select,
.dark select#viewBySelect + [data-kt-select-wrapper] .kt-select-display.kt-select {
  border-color: var(--border) !important;
  background-color: color-mix(in oklab, var(--foreground) 8%, var(--card, #1c1c1e)) !important;
}

.dark .filter-item:has(option:checked) .kt-select-wrapper.scheduleFilter .kt-select-display.kt-select {
  color: var(--primary) !important;
  border-color: color-mix(in oklab, var(--primary) 40%, var(--card, #1c1c1e)) !important;
  background-color: color-mix(in oklab, var(--primary) 15%, var(--card, #1c1c1e)) !important;
}

.dark .kt-select-wrapper.scheduleFilter .kt-select-display.kt-select,
.dark select#viewBySelect + [data-kt-select-wrapper] .kt-select-display.kt-select {
  &:focus,
  &:focus-visible,
  &.active {
    border-color: var(--border) !important;
  }
}

.dark .filter-item:has(option:checked) .kt-select-wrapper.scheduleFilter .kt-select-display.kt-select {
  &:focus,
  &:focus-visible,
  &.active {
    border-color: color-mix(in oklab, var(--primary) 40%, var(--card, #1c1c1e)) !important;
  }
}

/* Options dropdown menu on Schedule/Index.cshtml — match the 13px size
   used by the kt-select filter dropdowns above so the page's
   secondary menus read uniformly. The .kt-dropdown-menu is a DOM
   sibling of #optionsButton (KTUI keeps it adjacent and positions via
   Popper). Descendant selector covers nested submenus (Copy To,
   Clear Shifts, Templates) since their .kt-dropdown-menu elements
   are children of the top-level menu in markup. */
#optionsButton + .kt-dropdown-menu,
#optionsButton + .kt-dropdown-menu * {
  font-size: 13px !important;
}

/* Hide-menu toggle on Schedule/Index.cshtml — icon-only square pill,
   sized 34x34 to match the height of the adjacent kt-btn primaries
   and read as a control rather than a text button. */
.kt-btn.toggle-header-btn {
  width: 34px !important;
  height: 34px !important;
  padding: 0 !important;
  font-size: 14px !important;
}

/* KTUI's `.kt-btn i { font-size: var(--text-base); }` rule directly
   sizes <i> font icon children, overriding any font-size set on the
   button itself. Target the <i> explicitly so the keenicon glyph
   inside #toggle-header-btn renders at the requested 14px. */
.kt-btn.toggle-header-btn i {
  font-size: 14px !important;
}

/* timelineWeek "Add shift" affordance.
   Ported from src/scss/schedule.scss — that bundle is no longer loaded on
   Metronic 9 pages, so without these the temp-cell overlays appended by
   initNewShiftControl render unstyled (no positioning, no hover pill). */
.fc-timelineWeek-view {
  /* Timeline rows in this view auto-size to the event height, leaving no
     vertical room below an existing event to click for a new shift. Force
     a min-height on resource rows that contain events (marked by JS via
     `row-has-events` in eventAfterAllRender) on both sides so the
     temp-cell logic has a gap to render the "Add shift" pill in.
     Empty rows stay at their natural compact height. */
  .fc-resource-area .fc-rows tr.row-has-events,
  .fc-time-area .fc-rows tr.row-has-events,
  .fc-resource-area .fc-rows tr.row-has-events .fc-widget-content,
  .fc-time-area .fc-rows tr.row-has-events .fc-widget-content,
  .fc-time-area .fc-rows tr.row-has-events .fc-widget-content > div {
    /* --row-min-height is set inline per-row by JS based on the deepest
       event's bottom + a buffer, so the gap stays consistent whether the
       row stacks 1, 2, or N events on the same day. */
    min-height: var(--row-min-height, 90px);
  }

  .fc-time-area.fc-widget-content .fc-widget-content {
    position: relative;
  }

  .temp-cell {
    position: absolute;
    top: 0;
    vertical-align: middle;
    border: 0;

    .add-shift-btn {
      display: none;
      align-items: center;
      justify-content: center;
      height: 100%;
      color: var(--primary);
      font-size: var(--text-sm);
      font-weight: var(--font-weight-semibold);
      cursor: pointer;

      &__icon {
        margin-right: 5px;
        font-weight: var(--font-weight-semibold);
      }
    }

    &:hover .add-shift-btn {
      display: flex;
    }
  }
}


/* Toastr notifications — extracted from vendors.bundle.css for Metronic 9 bundle */

.toast-title {
  font-weight: bold; }

.toast-message {
  -ms-word-wrap: break-word;
  word-wrap: break-word; }

.toast-message a,
.toast-message label {
  color: #FFFFFF; }

.toast-message a:hover {
  color: #CCCCCC;
  text-decoration: none; }

.toast-close-button {
  position: relative;
  right: -0.3em;
  top: -0.3em;
  float: right;
  font-size: 20px;
  font-weight: bold;
  color: #FFFFFF;
  -webkit-text-shadow: 0 1px 0 #ffffff;
  text-shadow: 0 1px 0 #ffffff;
  opacity: 0.8;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  filter: alpha(opacity=80);
  line-height: 1; }

.toast-close-button:hover,
.toast-close-button:focus {
  color: #000000;
  text-decoration: none;
  cursor: pointer;
  opacity: 0.4;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  filter: alpha(opacity=40); }

.rtl .toast-close-button {
  left: -0.3em;
  float: left;
  right: 0.3em; }

/*Additional properties for button version
 iOS requires the button element instead of an anchor tag.
 If you want the anchor version, it requires `href="#"`.*/
button.toast-close-button {
  padding: 0;
  cursor: pointer;
  background: transparent;
  border: 0;
  -webkit-appearance: none; }

.toast-top-center {
  top: 0;
  right: 0;
  width: 100%; }

.toast-bottom-center {
  bottom: 0;
  right: 0;
  width: 100%; }

.toast-top-full-width {
  top: 0;
  right: 0;
  width: 100%; }

.toast-bottom-full-width {
  bottom: 0;
  right: 0;
  width: 100%; }

.toast-top-left {
  top: 12px;
  left: 12px; }

.toast-top-right {
  top: 12px;
  right: 12px; }

.toast-bottom-right {
  right: 12px;
  bottom: 12px; }

.toast-bottom-left {
  bottom: 12px;
  left: 12px; }

#toast-container {
  position: fixed;
  z-index: 999999;
  pointer-events: none;
  /*overrides*/ }

#toast-container * {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

#toast-container > div {
  position: relative;
  pointer-events: auto;
  overflow: hidden;
  margin: 0 0 6px;
  padding: 15px 15px 15px 50px;
  width: 300px;
  -moz-border-radius: 3px 3px 3px 3px;
  -webkit-border-radius: 3px 3px 3px 3px;
  border-radius: 3px 3px 3px 3px;
  background-position: 15px center;
  background-repeat: no-repeat;
  -moz-box-shadow: 0 0 12px #999999;
  -webkit-box-shadow: 0 0 12px #999999;
  box-shadow: 0 0 12px #999999;
  color: #FFFFFF;
  opacity: 0.8;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  filter: alpha(opacity=80); }

#toast-container > div.rtl {
  direction: rtl;
  padding: 15px 50px 15px 15px;
  background-position: right 15px center; }

#toast-container > div:hover {
  -moz-box-shadow: 0 0 12px #000000;
  -webkit-box-shadow: 0 0 12px #000000;
  box-shadow: 0 0 12px #000000;
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
  cursor: pointer; }

#toast-container > .toast-info {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGwSURBVEhLtZa9SgNBEMc9sUxxRcoUKSzSWIhXpFMhhYWFhaBg4yPYiWCXZxBLERsLRS3EQkEfwCKdjWJAwSKCgoKCcudv4O5YLrt7EzgXhiU3/4+b2ckmwVjJSpKkQ6wAi4gwhT+z3wRBcEz0yjSseUTrcRyfsHsXmD0AmbHOC9Ii8VImnuXBPglHpQ5wwSVM7sNnTG7Za4JwDdCjxyAiH3nyA2mtaTJufiDZ5dCaqlItILh1NHatfN5skvjx9Z38m69CgzuXmZgVrPIGE763Jx9qKsRozWYw6xOHdER+nn2KkO+Bb+UV5CBN6WC6QtBgbRVozrahAbmm6HtUsgtPC19tFdxXZYBOfkbmFJ1VaHA1VAHjd0pp70oTZzvR+EVrx2Ygfdsq6eu55BHYR8hlcki+n+kERUFG8BrA0BwjeAv2M8WLQBtcy+SD6fNsmnB3AlBLrgTtVW1c2QN4bVWLATaIS60J2Du5y1TiJgjSBvFVZgTmwCU+dAZFoPxGEEs8nyHC9Bwe2GvEJv2WXZb0vjdyFT4Cxk3e/kIqlOGoVLwwPevpYHT+00T+hWwXDf4AJAOUqWcDhbwAAAAASUVORK5CYII=") !important; }

#toast-container > .toast-error {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHOSURBVEhLrZa/SgNBEMZzh0WKCClSCKaIYOED+AAKeQQLG8HWztLCImBrYadgIdY+gIKNYkBFSwu7CAoqCgkkoGBI/E28PdbLZmeDLgzZzcx83/zZ2SSXC1j9fr+I1Hq93g2yxH4iwM1vkoBWAdxCmpzTxfkN2RcyZNaHFIkSo10+8kgxkXIURV5HGxTmFuc75B2RfQkpxHG8aAgaAFa0tAHqYFfQ7Iwe2yhODk8+J4C7yAoRTWI3w/4klGRgR4lO7Rpn9+gvMyWp+uxFh8+H+ARlgN1nJuJuQAYvNkEnwGFck18Er4q3egEc/oO+mhLdKgRyhdNFiacC0rlOCbhNVz4H9FnAYgDBvU3QIioZlJFLJtsoHYRDfiZoUyIxqCtRpVlANq0EU4dApjrtgezPFad5S19Wgjkc0hNVnuF4HjVA6C7QrSIbylB+oZe3aHgBsqlNqKYH48jXyJKMuAbiyVJ8KzaB3eRc0pg9VwQ4niFryI68qiOi3AbjwdsfnAtk0bCjTLJKr6mrD9g8iq/S/B81hguOMlQTnVyG40wAcjnmgsCNESDrjme7wfftP4P7SP4N3CJZdvzoNyGq2c/HWOXJGsvVg+RA/k2MC/wN6I2YA2Pt8GkAAAAASUVORK5CYII=") !important; }

#toast-container > .toast-success {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==") !important; }

#toast-container > .toast-warning {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGYSURBVEhL5ZSvTsNQFMbXJGICMYGYmJhAQIJAICYQPAACiSDB8AiICQQJT4CqQEwgJvYASAQCiZiYmJhAIBATCARJy+9rTsldd8sKu1M0+dLb057v6/lbq/2rK0mS/TRNj9cWNAKPYIJII7gIxCcQ51cvqID+GIEX8ASG4B1bK5gIZFeQfoJdEXOfgX4QAQg7kH2A65yQ87lyxb27sggkAzAuFhbbg1K2kgCkB1bVwyIR9m2L7PRPIhDUIXgGtyKw575yz3lTNs6X4JXnjV+LKM/m3MydnTbtOKIjtz6VhCBq4vSm3ncdrD2lk0VgUXSVKjVDJXJzijW1RQdsU7F77He8u68koNZTz8Oz5yGa6J3H3lZ0xYgXBK2QymlWWA+RWnYhskLBv2vmE+hBMCtbA7KX5drWyRT/2JsqZ2IvfB9Y4bWDNMFbJRFmC9E74SoS0CqulwjkC0+5bpcV1CZ8NMej4pjy0U+doDQsGyo1hzVJttIjhQ7GnBtRFN1UarUlH8F3xict+HY07rEzoUGPlWcjRFRr4/gChZgc3ZL2d8oAAAAASUVORK5CYII=") !important; }

#toast-container.toast-top-center > div,
#toast-container.toast-bottom-center > div {
  width: 300px;
  margin-left: auto;
  margin-right: auto; }

#toast-container.toast-top-full-width > div,
#toast-container.toast-bottom-full-width > div {
  width: 96%;
  margin-left: auto;
  margin-right: auto; }

/* Backgrounds aligned with KTUI alert tokens; auto-adapt to dark mode. */
.toast {
  background-color: var(--foreground); }

.toast-success {
  background-color: var(--color-green-500); }

.toast-error {
  background-color: var(--destructive); }

.toast-info {
  background-color: var(--color-violet-500); }

.toast-warning {
  background-color: var(--color-yellow-500); }

.toast-progress {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 4px;
  background-color: #000000;
  opacity: 0.4;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  filter: alpha(opacity=40); }

/*Responsive Design*/
@media all and (max-width: 240px) {
  #toast-container > div {
    padding: 8px 8px 8px 50px;
    width: 11em; }
  #toast-container > div.rtl {
    padding: 8px 50px 8px 8px; }
  #toast-container .toast-close-button {
    right: -0.2em;
    top: -0.2em; }
  #toast-container .rtl .toast-close-button {
    left: -0.2em;
    right: 0.2em; } }

@media all and (min-width: 241px) and (max-width: 480px) {
  #toast-container > div {
    padding: 8px 8px 8px 50px;
    width: 18em; }
  #toast-container > div.rtl {
    padding: 8px 50px 8px 8px; }
  #toast-container .toast-close-button {
    right: -0.2em;
    top: -0.2em; }
  #toast-container .rtl .toast-close-button {
    left: -0.2em;
    right: 0.2em; } }

@media all and (min-width: 481px) and (max-width: 768px) {
  #toast-container > div {
    padding: 15px 15px 15px 50px;
    width: 25em; }
  #toast-container > div.rtl {
    padding: 15px 50px 15px 15px; } }

/*!
 * smartbanner.js v1.24.1 <https://github.com/ain/smartbanner.js#readme>
 * Copyright © 2024 Ain Tohvri, contributors. Licensed under GPL-3.0.
 */
.smartbanner{position:absolute;top:0;left:0;overflow-x:hidden;width:100%;height:84px;background:#f3f3f3;font-family:Helvetica,sans,sans-serif}.smartbanner__exit{position:absolute;top:calc(50% - 6px);left:9px;display:block;margin:0;width:12px;height:12px;border:0;text-align:center}.smartbanner__exit::before,.smartbanner__exit::after{position:absolute;width:1px;height:12px;background:#716f6f;content:" "}.smartbanner__exit::before{transform:rotate(45deg)}.smartbanner__exit::after{transform:rotate(-45deg)}.smartbanner__icon{position:absolute;top:10px;left:30px;width:64px;height:64px;border-radius:15px;background-size:64px 64px}.smartbanner__info{position:absolute;top:10px;left:104px;display:flex;overflow-y:hidden;width:60%;height:64px;align-items:center;color:#000}.smartbanner__info__title{font-size:14px}.smartbanner__info__author,.smartbanner__info__price{font-size:12px}.smartbanner__button{position:absolute;top:32px;right:10px;z-index:1;display:block;padding:0 10px;min-width:10%;border-radius:5px;background:#f3f3f3;color:#1474fc;font-size:18px;text-align:center;text-decoration:none}.smartbanner__button__label{text-align:center}.smartbanner.smartbanner--android{background:#3d3d3d url("data:image/gif;base64,R0lGODlhCAAIAIABAFVVVf///yH5BAEHAAEALAAAAAAIAAgAAAINRG4XudroGJBRsYcxKAA7");box-shadow:inset 0 4px 0 #88b131}.smartbanner.smartbanner--android .smartbanner__exit{left:6px;margin-right:7px;width:17px;height:17px;border-radius:14px;background:#1c1e21;box-shadow:0 1px 2px rgba(0,0,0,.8) inset,0 1px 1px rgba(255,255,255,.3);color:#b1b1b3;font-family:"ArialRoundedMTBold",Arial;font-size:20px;line-height:17px;text-shadow:0 1px 1px #000}.smartbanner.smartbanner--android .smartbanner__exit::before,.smartbanner.smartbanner--android .smartbanner__exit::after{top:3px;left:8px;width:2px;height:11px;background:#b1b1b3}.smartbanner.smartbanner--android .smartbanner__exit:active,.smartbanner.smartbanner--android .smartbanner__exit:hover{color:#eee}.smartbanner.smartbanner--android .smartbanner__icon{background-color:rgba(0,0,0,0);box-shadow:none}.smartbanner.smartbanner--android .smartbanner__info{color:#ccc;text-shadow:0 1px 2px #000}.smartbanner.smartbanner--android .smartbanner__info__title{color:#fff;font-weight:bold}.smartbanner.smartbanner--android .smartbanner__button{top:30px;right:20px;padding:0;min-width:12%;border-radius:0;background:none;box-shadow:0 0 0 1px #333,0 0 0 2px #dddcdc;color:#d1d1d1;font-size:14px;font-weight:bold}.smartbanner.smartbanner--android .smartbanner__button:active,.smartbanner.smartbanner--android .smartbanner__button:hover{background:none}.smartbanner.smartbanner--android .smartbanner__button__label{display:block;padding:0 10px;background:#42b6c9;background:linear-gradient(to bottom, #42b6c9, #39a9bb);box-shadow:none;line-height:24px;text-align:center;text-shadow:none;text-transform:none}.smartbanner.smartbanner--android .smartbanner__button__label:active,.smartbanner.smartbanner--android .smartbanner__button__label:hover{background:#2ac7e1}/*# sourceMappingURL=smartbanner.min.css.map */

@charset "UTF-8";
/* --- PTO Calendar (FullCalendar v3 → Metronic 9 styling) --- */
.pto-calendar-wrap .fc-toolbar.fc-header-toolbar {
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between; }

.pto-calendar-wrap .fc-toolbar .fc-left,
.pto-calendar-wrap .fc-toolbar .fc-center,
.pto-calendar-wrap .fc-toolbar .fc-right {
  display: inline-flex;
  align-items: center;
  line-height: 1; }

/* FC v3 ships .fc-button-group as inline-block; its child buttons are floated
   inside it (`.fc .fc-toolbar > * > *`). That means buttons inside the group
   aren't flex items of the fc-left/right inline-flex container — they're
   inside a non-flex sub-container, so the parent's align-items: center can't
   reach them. Make the group flex so its buttons share a baseline with the
   other fc-left/right items (today button, view buttons, periodSelectHolder). */
.pto-calendar-wrap .fc-toolbar .fc-button-group {
  display: inline-flex;
  align-items: center; }

/* Title (now in fc-right) */
.pto-calendar-wrap .fc-toolbar .fc-right h2 {
  font-size: var(--text-base);
  font-weight: var(--font-weight-semibold);
  color: var(--foreground);
  margin: 0; }

/* Base button */
.pto-calendar-wrap .fc-toolbar .fc-button {
  display: inline-flex;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  font-weight: var(--font-weight-medium);
  white-space: nowrap;
  height: 2.125rem;
  gap: 0.375rem;
  border: 1px solid var(--border);
  background-color: transparent;
  padding: 0 0.75rem;
  color: var(--accent-foreground);
  font-family: inherit;
  font-size: 0.8125rem !important;
  line-height: 1.25 !important;
  flex-shrink: 0;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  transition: color 0.15s, box-shadow 0.15s, background-color 0.15s;
  outline: none; }

/* Remove old FC state backgrounds */
.pto-calendar-wrap .fc-toolbar .fc-button.fc-state-default {
  background-image: none;
  background-color: transparent;
  text-shadow: none; }

/* Hover */
.pto-calendar-wrap .fc-toolbar .fc-button:hover:not(.fc-state-disabled) {
  background-color: var(--accent) !important;
  color: var(--accent-foreground) !important; }

/* Active state */
.pto-calendar-wrap .fc-toolbar .fc-button.fc-state-active {
  background-color: var(--accent) !important;
  color: var(--accent-foreground) !important;
  border-color: var(--border) !important; }

/* Disabled */
.pto-calendar-wrap .fc-toolbar .fc-button.fc-state-disabled {
  pointer-events: none;
  opacity: 0.5;
  cursor: not-allowed; }

/* Focus ring */
.pto-calendar-wrap .fc-toolbar .fc-button:focus-visible {
  outline: none;
  ring: 2px solid var(--ring);
  ring-offset: 2px; }

/* Button group: border radius */
.pto-calendar-wrap .fc-toolbar .fc-button-group .fc-button:first-child {
  border-top-left-radius: var(--radius-md) !important;
  border-bottom-left-radius: var(--radius-md) !important;
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important; }

.pto-calendar-wrap .fc-toolbar .fc-button-group .fc-button:last-child {
  border-top-right-radius: var(--radius-md) !important;
  border-bottom-right-radius: var(--radius-md) !important;
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important; }

.pto-calendar-wrap .fc-toolbar .fc-button-group .fc-button:not(:last-child) {
  border-right: none !important; }

.pto-calendar-wrap .fc-toolbar .fc-button-group .fc-button:not(:first-child):not(:last-child) {
  border-radius: 0 !important; }

/* Standalone buttons */
.pto-calendar-wrap .fc-toolbar .fc-today-button {
  border-radius: var(--radius-md) !important; }

/* Center view buttons — styled via JS (kt-btn + Tailwind utilities, matching Schedule) */
.pto-calendar-wrap .fc-header-toolbar .fc-center .kt-btn {
  margin: 0;
  padding: 15px;
  min-width: 4rem; }

.pto-calendar-wrap .fc-header-toolbar .fc-center .fc-toggleHeaderBtn-button {
  min-width: auto; }

/* Nav arrow icons */
.pto-calendar-wrap .fc-toolbar .fc-button .fc-icon {
  font-size: 1rem !important;
  color: var(--muted-foreground) !important;
  position: relative !important; }

.pto-calendar-wrap .fc-toolbar .fc-button:hover:not(.fc-state-disabled) .fc-icon {
  color: var(--accent-foreground) !important; }

/* Day grid header — color matches KTUI .kt-table thead th so weekdays read
   the same as data-table headers in both light and dark mode. The inner-element
   override is required because schedule.scss ships an unscoped rule
   `.fc-unthemed th.fc-day-header > a, > span { color: #364151 }` that hardcodes
   a non-adaptive color on the <a>/<span> where the day name actually renders. */
.pto-calendar-wrap .fc-head .fc-day-header {
  background-color: color-mix(in oklab, var(--muted) 50%, transparent);
  padding: 0.5rem 0.75rem !important;
  font-size: var(--text-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--muted-foreground);
  border-color: var(--border); }

.pto-calendar-wrap .fc-head .fc-day-header > a,
.pto-calendar-wrap .fc-head .fc-day-header > span {
  color: var(--muted-foreground); }

/* Table borders */
.pto-calendar-wrap .fc td,
.pto-calendar-wrap .fc th {
  border-color: var(--border) !important; }

/* Day cells — skip .fc-disabled-day so prev/next month cells keep FC's
   muted styling (matches Schedule + Availability). */
.pto-calendar-wrap .fc .fc-day:not(.fc-disabled-day) {
  background-color: var(--background); }

/* Today highlight */
.pto-calendar-wrap .fc .fc-today {
  background-color: color-mix(in oklab, var(--accent) 50%, transparent) !important; }

/* Day numbers */
.pto-calendar-wrap .fc .fc-day-number {
  font-size: var(--text-2xs);
  font-weight: var(--font-weight-medium);
  color: var(--foreground);
  padding: 0.5rem !important; }

.pto-calendar-wrap .fc .fc-today .fc-day-number {
  font-weight: var(--font-weight-semibold);
  color: var(--primary); }

/* Events — wrapped in @layer components because tailwind.styles.css emits
   `.fc-event:not(.fc-list-event) { background-color: var(--primary)
   !important; color: var(--primary-foreground) !important; ... }` inside
   that layer. Layered !important beats unlayered !important regardless of
   specificity, so unlayered overrides silently lose and every event would
   render as a solid blue pill. Mirror the schedule.scss workaround. */
@layer components {
  .pto-calendar-wrap .fc-event {
    border: 1.5px solid var(--border) !important;
    color: var(--foreground) !important;
    background-color: var(--background) !important;
    box-shadow: none;
    cursor: pointer;
    margin: 0 6px 1px;
    padding: 5px;
    border-radius: calc(var(--radius) - 2px); }
  .pto-calendar-wrap .fc-event:hover {
    background-color: var(--accent) !important; }
  /* Blackout date events — cornsilk yellow background to match QA1 (no
       special outline; the .fc-event base border stays as a subtle gray).
       #m_calendar bumps specificity so this beats other layered rules
       targeting .fc-event. */
  .pto-calendar-wrap:not(.pto-summary-wrap) #m_calendar .blackout-date-event {
    background-color: #FFF8DC !important;
    color: var(--foreground) !important; }
  /* In dark mode the cornsilk yellow would glare against the dark canvas.
       Use a warning-token blend so blackouts read as yellow-tinted but stay
       within the dark-mode palette. Border softened too (a full --warning
       border reads as a stark white-ish outline against the dark canvas). */
  .pto-calendar-wrap:not(.pto-summary-wrap) #m_calendar .blackout-date-event:is(.dark *) {
    background-color: color-mix(in oklab, var(--muted-foreground) 45%, var(--background)) !important;
    border-color: color-mix(in oklab, var(--muted-foreground) 55%, var(--background)) !important; } }

.pto-calendar-wrap .fc-event .fc-content {
  padding: 0 !important;
  text-align: left;
  display: flex;
  align-items: center;
  overflow: visible;
  height: 15px; }

.pto-calendar-wrap .fc-event .fc-content::before {
  display: none !important; }

/* Event elements */
.pto-calendar-wrap .fc-event .pto-calendar-event-name {
  font-size: 0.8125rem;
  font-weight: 600;
  color: inherit;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-right: 0.5rem; }

.pto-calendar-wrap .fc-event .pto-calendar-event-hours {
  padding: 0 5px;
  border: 0;
  border-radius: 10px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  line-height: 1;
  color: var(--primary-foreground);
  background: var(--muted-foreground);
  margin-left: auto;
  flex-shrink: 0; }

/* 21px = ki-filled icon (16) + margin-right (5) — aligns badge under name's first letter.
   margin-top clears the name's descenders (g, p, y) from touching the badge.
   No .fc-event in selector — list view's link omits that class. */
.pto-calendar-wrap .pto-calendar-event-code {
  margin-left: 21px;
  margin-top: 4px; }

/* More link */
.pto-calendar-wrap .fc-more {
  font-size: var(--text-xs);
  font-weight: var(--font-weight-medium);
  color: var(--primary); }

.pto-calendar-wrap .fc-more:hover {
  color: color-mix(in oklab, var(--primary) 90%, transparent); }

/* Popover */
.pto-calendar-wrap .fc-popover {
  border: 1px solid var(--border) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
  background-color: var(--background) !important;
  border-radius: var(--radius-md) !important; }

.pto-calendar-wrap .fc-popover .fc-header {
  background-color: color-mix(in oklab, var(--muted) 50%, transparent);
  font-size: var(--text-sm);
  font-weight: var(--font-weight-medium);
  color: var(--foreground);
  padding: 0.5rem !important;
  border-bottom: 1px solid var(--border) !important; }

/* List view */
.pto-calendar-wrap .fc-list-table tr {
  background-color: var(--background) !important; }

.pto-calendar-wrap .fc-list-table tr:hover {
  background-color: var(--accent) !important; }

.pto-calendar-wrap .fc-list-table td {
  background-color: var(--background) !important;
  color: var(--foreground) !important;
  border-color: var(--border) !important; }

.pto-calendar-wrap .fc-list-table tr:hover td {
  background-color: var(--accent) !important;
  color: var(--accent-foreground) !important; }

/* List heading rows need a darker fill than body rows so users can visually
   distinguish a date-group header from a regular request row. The
   `.fc-list-table tr { background-color: var(--background) !important }` rule
   above overrides plain `td` backgrounds, so set the fill at both levels and
   use !important here too. */
.pto-calendar-wrap .fc-list-heading,
.pto-calendar-wrap .fc-list-heading td {
  background-color: var(--muted) !important;
  color: var(--foreground);
  font-size: var(--text-sm);
  font-weight: var(--font-weight-medium);
  border-color: var(--border) !important; }

/* Match QA1's two-tier hierarchy in the date-group header: the left-side
   main label (full date) reads as the primary text, while the right-side
   alt label (day-of-week / year) reads as secondary — lighter color and
   normal weight. Without this, both anchors inherit the cell's foreground
   + medium weight from the rule above and look identical. */
.pto-calendar-wrap .fc-list-heading .fc-list-heading-alt {
  color: var(--muted-foreground);
  font-weight: var(--font-weight-normal); }

.pto-calendar-wrap .fc-list-table tr.fc-list-heading:hover td {
  background-color: var(--muted) !important;
  color: var(--foreground) !important; }

.pto-calendar-wrap .fc-list-table .pto-calendar-event-hours {
  margin-left: 5px;
  font-size: var(--text-xs); }

.pto-calendar-wrap .fc-list-table .checkbox-event-container {
  padding: 0.5em 0;
  font-size: 0.9em;
  gap: 0.5rem; }

/* Scrollbar — applied in condensed grid view and list view. var(--border)
   adapts to dark mode automatically; track stays transparent so the rail
   doesn't show a hardcoded light color against a dark canvas. */
.pto-calendar-wrap .fc-scroller {
  scrollbar-width: thin;
  scrollbar-color: var(--border) transparent; }

.pto-calendar-wrap .fc-scroller::-webkit-scrollbar {
  width: 5px;
  height: 5px; }

.pto-calendar-wrap .fc-scroller::-webkit-scrollbar-track {
  background: transparent; }

.pto-calendar-wrap .fc-scroller::-webkit-scrollbar-thumb {
  background: var(--border);
  border-radius: 4px; }

/* Card-toolbar holds the action buttons (Approve / Deny / Add Time Off). When
   the card-header wraps at narrow widths, KTUI's default flex behavior lets
   the toolbar align flush-left under the heading and sit flush against the
   card boundary. Pin it right with margin-left:auto and add a top margin so
   the wrapped row is breathing-spaced from the heading and the right edge. */
.pto-calendar-wrap .kt-card-header .kt-card-toolbar {
  margin-left: auto;
  padding-right: calc(var(--spacing) * 2); }

@media (max-width: 1024px) {
  .pto-calendar-wrap .kt-card-header .kt-card-toolbar {
    margin-top: calc(var(--spacing) * 2); } }

.schedule-wrap {
  margin: 0 -40px;
  background: #f4f5f8 !important;
  border-color: #f4f5f8 !important; }

@media (max-width: 1025px) {
  .schedule-wrap {
    margin: auto; } }

.schedule-menu-controls {
  display: flex;
  margin: -18px 0 10px;
  padding: 0; }
  .schedule-menu-controls__item {
    list-style: none;
    margin-right: 60px; }
    .schedule-menu-controls__item a {
      font-weight: 600;
      color: #AAAAAA;
      cursor: pointer; }
      .schedule-menu-controls__item a:hover {
        color: #364151;
        text-decoration: none; }
    .schedule-menu-controls__item:last-child {
      margin-right: 0; }
    .schedule-menu-controls__item.active a {
      color: #364151; }
      .schedule-menu-controls__item.active a:hover {
        color: #364151;
        text-decoration: none; }

@media (max-width: 1025px) {
  .schedule-menu-controls {
    padding: 0.5rem 2.2rem 0; } }

.fc-time-area .fc-event-container {
  padding-bottom: 0 !important; }

.fc-unthemed .fc-day-grid td:not(.fc-axis).fc-event-container {
  padding: 0; }

.fc-unthemed th {
  padding: .75rem .5rem;
  font-size: 1rem;
  font-weight: bold; }

.fc-unthemed .fc-event .fc-title,
.fc-unthemed .fc-event-dot .fc-title {
  font-size: .8571rem;
  font-weight: bold;
  color: inherit;
  overflow: hidden;
  text-overflow: ellipsis; }

.fc-unthemed .fc-description {
  font-size: .85rem;
  margin-top: .25rem;
  font-weight: 400;
  /*! color: #7b7e8a; */
  margin-left: 0; }

.fc-unthemed .fc-event,
.fc-unthemed .fc-event-dot {
  background: var(--background);
  border: 1.5px solid var(--border); }

.fc-unthemed .fc-toolbar .fc-button.fc-state-disabled {
  background: #e3e8ee;
  color: #afb2c1;
  opacity: 0.38; }

.schedule-block {
  height: calc(100% - 13px); }
  .schedule-block .toggle-header-btn__caption {
    display: none;
    margin-right: 5px; }
  .schedule-block__body {
    height: calc(100% - 54px); }
  .schedule-block .m-portlet__head {
    background-color: #ffffff !important;
    border-color: #ebedf2 !important; }
    .schedule-block .m-portlet__head .dropdown .btn.dropdown-toggle.btn-light {
      background-color: #ffffff !important;
      border-color: #ffffff !important; }
  .schedule-block #schedule_calendar .fc-timelineDay-view .fc-body .fc-scroller-clip .fc-scroller {
    height: calc(100vh - 384px) !important; }
  .schedule-block #schedule_calendar .fc-timelineWeek-view .fc-body .fc-scroller-clip .fc-scroller {
    height: calc(100vh - 433px) !important;
    min-height: 400px; }
  .schedule-block #schedule_calendar .fc-month-view .fc-body .fc-widget-content .fc-scroller {
    height: calc(100vh - 372px) !important; }
    .schedule-block #schedule_calendar .fc-month-view .fc-body .fc-widget-content .fc-scroller.h-100 {
      height: 100% !important; }
  .schedule-block #schedule_calendar.full-view .fc-timelineDay-view .fc-body .fc-scroller-clip .fc-scroller {
    height: calc(100vh - 274px) !important; }
  .schedule-block #schedule_calendar.full-view .fc-timelineWeek-view .fc-body .fc-scroller-clip .fc-scroller {
    height: calc(100vh - 323px) !important; }
  .schedule-block #schedule_calendar.full-view .fc-month-view .fc-body .fc-widget-content .fc-scroller {
    height: calc(100vh - 262px) !important; }

.availability-block {
  height: calc(100% - 13px); }
  .availability-block .toggle-header-btn__caption {
    display: none;
    margin-right: 5px; }
  .availability-block .availability-label {
    display: inline-block;
    background: dimgray;
    color: white;
    font-size: 14px;
    border-radius: 5px;
    padding: 0 5px; }
  .availability-block .filter-item:first-child:after {
    content: '';
    display: block;
    background: #fff;
    height: 10px;
    position: absolute;
    left: -15px;
    width: 100px;
    bottom: -16px; }
  .availability-block .filter-item:first-child.active:after {
    width: 138px; }
  .availability-block__body {
    height: calc(100% - 54px); }
  .availability-block .m-portlet__head {
    background-color: #ffffff !important;
    border-color: #ebedf2 !important; }
    .availability-block .m-portlet__head .dropdown .btn.dropdown-toggle.btn-light {
      background-color: #ffffff !important;
      border-color: #ffffff !important; }
  .availability-block #schedule_calendar .fc-timelineDay-view .fc-body .fc-scroller-clip .fc-scroller {
    height: calc(100vh - 329px) !important; }
  .availability-block #schedule_calendar .fc-timelineWeek-view .fc-body .fc-scroller-clip .fc-scroller {
    height: calc(100vh - 331px) !important; }
  .availability-block #schedule_calendar .fc-month-view .fc-body .fc-widget-content .fc-scroller {
    height: calc(100vh - 317px) !important; }
  .availability-block #schedule_calendar #schedule-calendar-subfooter {
    display: block;
    height: 45px;
    padding: 10px 70px 0 0; }
  .availability-block #schedule_calendar.full-view .fc-timelineDay-view .fc-body .fc-scroller-clip .fc-scroller {
    height: calc(100vh - 219px) !important; }
  .availability-block #schedule_calendar.full-view .fc-timelineWeek-view .fc-body .fc-scroller-clip .fc-scroller {
    height: calc(100vh - 221px) !important; }
  .availability-block #schedule_calendar.full-view .fc-month-view .fc-body .fc-widget-content .fc-scroller {
    height: calc(100vh - 207px) !important; }
  .availability-block .modal .timepicker-field {
    display: inline-flex;
    max-width: 100px; }

.schedule-block .m-portlet__head .bootstrap-select .dropdown-toggle.btn-light:focus,
.availability-block .m-portlet__head .bootstrap-select .dropdown-toggle.btn-light:focus {
  z-index: 1 !important;
  box-shadow: none !important; }

.schedule-block .m-portlet__head .bootstrap-select.show .dropdown-toggle.btn-light,
.availability-block .m-portlet__head .bootstrap-select.show .dropdown-toggle.btn-light {
  z-index: 1 !important;
  box-shadow: none !important; }

#schedule_calendar .fc-view-container {
  position: relative; }

#schedule_calendar .fc-view-container thead.fc-head td {
  border: 0;
  border-bottom: 3px solid #364150; }

#schedule_calendar .fc-view-container thead.fc-head.fc-foot td {
  border-bottom: none; }

#schedule_calendar .fc-view-container .fc-resource-area td {
  border-bottom-color: #fff; }

#schedule_calendar .fc-view-container .fc-resource-area td:empty {
  width: 0 !important; }

#schedule_calendar .fc-view-container .fc-timeline .fc-head > tr > .fc-divider {
  background-color: #fff; }

#schedule_calendar .fc-view-container .fc-event {
  padding: 6px;
  border-color: black;
  border-radius: 2px;
  line-height: 1.3333;
  margin: 3px 2px 0 2px; }

#schedule_calendar .fc-view-container .fc-event.event-openshift {
  padding-left: 8px; }

#schedule_calendar .fc-view-container .fc-description {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis; }

.btn-brand.focus,
.btn-brand:focus,
.btn-brand:not(:disabled):not(.disabled).active:focus,
.btn-brand:not(:disabled):not(.disabled):active:focus,
.btn-primary.focus,
.btn-primary:focus,
.btn-primary:not(:disabled):not(.disabled).active:focus,
.btn-primary:not(:disabled):not(.disabled):active:focus,
.show > .btn-brand.dropdown-toggle:focus,
.show > .btn-primary.dropdown-toggle:focus {
  box-shadow: 0 0 0 .2rem #1271C4; }

#schedule_calendar .fc-view-container .fc-event .fc-bg {
  opacity: 0 !important; }

#schedule_calendar .fc-view-container .fc-content::before {
  display: none !important; }

#schedule_calendar .fc-view-container .fc-content #filterButton {
  overflow: hidden;
  text-overflow: ellipsis; }

#schedule_calendar .fc-view-container .fc-event .fc-content {
  padding: 0 !important;
  text-align: left;
  display: flex;
  justify-content: space-between; }

#schedule_calendar .fc-view-container .fc-axis {
  width: 120px !important; }

#schedule_calendar .fc-view-container sticky {
  position: relative;
  top: 81%;
  width: 91.7%; }

#schedule_calendar .fc-view-container .sticky-2 {
  position: relative;
  top: 87%;
  width: 91.7%; }

.m-header ~ .m-body {
  transition: padding 0.3s ease-in; }

.m-header--fixed.m-header--minimize-off .m-header.m-header-hidden {
  overflow: hidden;
  height: 0 !important; }

#schedule_calendar .fc-view-container .fc-body .fc-scroller {
  height: calc(100vh - 370px); }

#schedule_calendar .fc-view-container .fc-timeline .fc-body .fc-scroller {
  /*! overflow-x: hidden !important; */
  /*! margin: 0 -20px 0 0 !important */
  height: calc(100vh - 470px) !important; }

.m-header.m-header-hidden ~ .m-body {
  padding-top: 0 !important; }

.m-header.m-header-hidden ~ .m-body #schedule_calendar .fc-view-container .fc-body .fc-scroller {
  height: calc(100vh - 260px); }

.m-header.m-header-hidden ~ .m-body #schedule_calendar .fc-view-container .fc-timeline .fc-body .fc-scroller {
  height: calc(100vh - 360px); }

#schedule_calendar .fc-view-container .fc-timeline.fc-timelineDay-view .fc-body .fc-scroller {
  height: calc(100vh - 420px); }

.m-header.m-header-hidden ~ .m-body #schedule_calendar .fc-view-container .fc-timeline.fc-timelineDay-view .fc-body .fc-scroller {
  height: calc(100vh - 310px); }

#schedule_calendar .fc-view-container .fc-scroller-canvas > .fc-content {
  border: none !important; }

.fc-timeline .fc-divider {
  width: 0 !important; }

.fc-unthemed .fc-toolbar .fc-button {
  outline: 0 !important;
  height: 2.5rem;
  padding: 0 .75rem;
  font-size: 1rem;
  background-color: #e3e8ee; }

.fc-unthemed .fc-toolbar h2 {
  font-size: 1rem !important;
  margin-top: 0; }

.fc .fc-toolbar > .fc-right > * {
  float: left;
  margin-left: 0;
  border-radius: 0 !important; }

#m_calendar .fc-header-toolbar .fc-right {
  margin-right: -50px;
  text-transform: uppercase; }

.fc-header-toolbar .fc-center h2 {
  font-weight: 700; }

.fc-today-button {
  text-transform: capitalize; }

/* #schedule_calendar .fc-view-container .fc-event.shift-blue1 {
    border-color: #426e86 !important;
    border-width: 1px !important;
} */
#schedule_calendar .fc-view-container .fc-event.shift-blue1 .fc-title {
  /* color: #00f !important; */
  font-weight: 700; }

.fc-event .fc-hour-count {
  padding: 0 5px;
  border: 0;
  border-radius: 10px;
  font-weight: 700;
  color: #426e86;
  background: #fff;
  align-self: self-start; }

.total-schedule-time-holder {
  display: flex;
  max-width: 220px;
  margin-bottom: 3px; }
  .total-schedule-time-holder .resource_hours {
    display: flex;
    flex: 0 0 50%;
    max-width: 50%; }

@media only screen and (max-width: 1350px) {
  .total-schedule-time-holder,
  .pto-time-holder {
    flex-direction: column; } }

.pto-time-holder {
  display: flex;
  max-width: 220px; }

.pto-hours-duration {
  display: flex;
  flex: 0 0 50%;
  max-width: 50%;
  margin-bottom: 2px !important; }
  .pto-hours-duration .caption {
    display: flex;
    align-items: center;
    line-height: 1.4;
    padding: .25em .4em;
    font-size: 75%;
    text-align: center;
    border-radius: .25rem; }
  .pto-hours-duration .hours-count {
    align-self: center;
    margin-left: 5px;
    padding: 0 5px;
    border: 0;
    border-radius: 10px;
    font-weight: 700;
    color: #ffffff;
    background: #575962;
    white-space: nowrap; }

.total-schedule-time {
  margin-left: 5px;
  padding: 0 5px;
  border: 0;
  border-radius: 10px;
  font-weight: 700;
  color: #426e86;
  background: #fff;
  align-self: self-start;
  font-size: 12px;
  white-space: nowrap; }
  .total-schedule-time--unscheduled {
    background: #426e86;
    color: #ffffff; }

.unscheduled_resource_label {
  color: #426e86; }

.fc-event .fc-notes-icon {
  margin: 0 0 0 auto;
  font-size: 1rem;
  color: inherit; }

.fc-event.event-unavailable .fc-notes-icon {
  position: absolute;
  right: 0; }

@media (min-width: 1440px) {
  .fc-event .fc-hour-count,
  .fc-view-container .pto-calendar-event-hours {
    line-height: 1rem;
    height: 1rem; } }

.fc-timeline-event .fc-content .fc-hour-count.red {
  background: red; }

.fc-ltr .fc-timeline-event .fc-title {
  margin-left: 0 !important; }

#m_calendar .fc-view-container .fc-content,
#m_calendar .fc-view-container .fc-divider,
#m_calendar .fc-view-container .fc-list-heading td,
#m_calendar .fc-view-container .fc-list-view,
#m_calendar .fc-view-container .fc-popover,
#m_calendar .fc-view-container .fc-row,
#m_calendar .fc-view-container tbody,
#m_calendar .fc-view-container td,
#m_calendar .fc-view-container th,
#m_calendar .fc-view-container thead,
#schedule_calendar .fc-view-container .fc-content,
#schedule_calendar .fc-view-container .fc-divider,
#schedule_calendar .fc-view-container .fc-list-heading td,
#schedule_calendar .fc-view-container .fc-list-view,
#schedule_calendar .fc-view-container .fc-popover,
#schedule_calendar .fc-view-container .fc-row,
#schedule_calendar .fc-view-container tbody,
#schedule_calendar .fc-view-container td,
#schedule_calendar .fc-view-container th,
#schedule_calendar .fc-view-container thead {
  border-color: var(--border); }

#schedule_calendar .fc-view-container .fc-event.open-shift {
  border: none !important;
  border-left: 5px solid red !important; }

#schedule_calendar .fc-view-container .fc-event.open-shift .fc-title {
  font-weight: 700;
  color: #000 !important; }

#schedule_calendar .fc-view-container .fc-event.open-shift > div {
  color: #000 !important; }

#schedule_calendar .fc-view-container .open-shift.shift-blue1 {
  border-left: 5px solid #426e86 !important; }

#schedule_calendar .fc-view-container .open-shift.shift-blue1 .fc-content > .fc-hour-count {
  background: #426e86 !important;
  color: #fff !important; }

.fc-description {
  text-align: left;
  margin-left: 10px; }

#schedule_calendar {
  /* Invisible spacer mirrored into the time-area .fc-content so its scroll
       height matches the resource-area side, which carries the .col-control
       "Add employee" footer. The two timeline panes share a single (time-area)
       scrollbar; without this the joined scroll tops out $col-control-height
       short and the col-control can never be scrolled fully into view. */
  /* timelineWeek rows that contain events: FC sizes them to fit the event
       exactly, leaving no vertical room below the event to add another shift
       in the same day column. JS in eventAfterAllRender sets --row-min-height
       per row to (deepest-event-bottom + buffer) so the temp-cell logic in
       initNewShiftControl has a gap to render the "Add shift" pill into.
       Applied to both fc-time-area and fc-resource-area sides so the resource
       labels stay aligned with the event row.
       NOTE: min-height on a <tr>/<td> (table-row / table-cell) is ignored by
       the table layout algorithm — it is the inner block-level
       `.fc-widget-content > div` wrapper that actually grows the row. That
       `> div` selector is therefore required on BOTH sides; without it on the
       resource side the left column stays short and the first event row's
       label misaligns with its (taller) grid row. */ }
  #schedule_calendar .fc-view-container tr[data-resource-id="0"] .fc-widget-content > div {
    display: flex;
    align-items: center; }
  #schedule_calendar .fc-view-container tr[data-resource-id="0"] .fc-cell-content {
    padding-bottom: 5px; }
  #schedule_calendar .fc-view-container tr[data-resource-id="0"] {
    height: auto !important; }
  #schedule_calendar .col-control {
    height: 60px; }
    #schedule_calendar .col-control .add-emp-btn {
      display: flex;
      align-items: center;
      color: #00B77A;
      font-weight: 600; }
      #schedule_calendar .col-control .add-emp-btn__icon {
        margin-right: 5px;
        font-weight: 600; }
      #schedule_calendar .col-control .add-emp-btn:hover {
        text-decoration: none; }
    #schedule_calendar .col-control .add-emp-text {
      margin: 0;
      font-size: 14px; }
      #schedule_calendar .col-control .add-emp-text .btn-import-employees {
        color: #334151;
        text-decoration: underline;
        cursor: pointer; }
  #schedule_calendar .col-control-spacer {
    height: 60px; }
  #schedule_calendar .fc-time-area.fc-widget-content .fc-widget-content {
    position: relative; }
  #schedule_calendar .fc-time-area.fc-widget-content .temp-cell {
    position: absolute;
    top: 0;
    vertical-align: middle;
    border: 0; }
    #schedule_calendar .fc-time-area.fc-widget-content .temp-cell .add-shift-btn {
      display: none;
      align-items: center;
      justify-content: center;
      height: 100%;
      color: #0074CB;
      font-size: 14px;
      font-weight: 600;
      cursor: pointer; }
      #schedule_calendar .fc-time-area.fc-widget-content .temp-cell .add-shift-btn__icon {
        margin-right: 5px;
        font-weight: 600; }
    #schedule_calendar .fc-time-area.fc-widget-content .temp-cell:hover .add-shift-btn {
      display: flex; }
  #schedule_calendar .fc-timelineWeek-view .fc-resource-area .fc-rows tr.row-has-events,
  #schedule_calendar .fc-timelineWeek-view .fc-time-area .fc-rows tr.row-has-events,
  #schedule_calendar .fc-timelineWeek-view .fc-resource-area .fc-rows tr.row-has-events .fc-widget-content,
  #schedule_calendar .fc-timelineWeek-view .fc-time-area .fc-rows tr.row-has-events .fc-widget-content,
  #schedule_calendar .fc-timelineWeek-view .fc-resource-area .fc-rows tr.row-has-events .fc-widget-content > div,
  #schedule_calendar .fc-timelineWeek-view .fc-time-area .fc-rows tr.row-has-events .fc-widget-content > div {
    min-height: var(--row-min-height, 90px); }

.fc-button {
  font-weight: 700;
  text-transform: capitalize; }

.bootstrap-select > .dropdown-toggle.btn-light {
  font-weight: 400; }

.fc-cell-content .fc-cell-text {
  font-size: 13px !important; }

.m-badge.m-badge--blue1 {
  background-color: #426E86;
  color: #fff; }

.m-badge.m-badge--blue2 {
  background-color: #128277;
  color: #fff; }

.m-badge.m-badge--green1 {
  background-color: #5B7065;
  color: #fff; }

.m-badge.m-badge--green2 {
  background-color: #ACBD78;
  color: #fff; }

.m-badge.m-badge--red1 {
  background-color: #D24136;
  color: #fff; }

.m-badge.m-badge--red2 {
  background-color: #FF6E82;
  color: #fff; }

.m-badge.m-badge--orange1 {
  background-color: #F47D4A;
  color: #fff; }

.m-badge.m-badge--orange2 {
  background-color: #CD7213;
  color: #fff; }

.m-badge.m-badge--purple {
  background-color: #727077;
  color: #fff; }

.m-badge.m-badge--yellow {
  background-color: #F0D014;
  color: #fff; }

.m-badge.m-badge--cocoa {
  background-color: #795548;
  color: #fff; }

.m-badge.m-badge--flamingo {
  background-color: #E67C73;
  color: #fff; }

.m-badge.m-badge--tomato {
  background-color: #D50000;
  color: #fff; }

.m-badge.m-badge--tangerine {
  background-color: #F4511E;
  color: #fff; }

.m-badge.m-badge--pumpkin {
  background-color: #EF6C00;
  color: #fff; }

.m-badge.m-badge--mango {
  background-color: #F09300;
  color: #fff; }

.m-badge.m-badge--eucalyptus {
  background-color: #009688;
  color: #fff; }

.m-badge.m-badge--basil {
  background-color: #0B8043;
  color: #fff; }

.m-badge.m-badge--pistachio {
  background-color: #7CB342;
  color: #fff; }

.m-badge.m-badge--avocado {
  background-color: #C0CA33;
  color: #fff; }

.m-badge.m-badge--citron {
  background-color: #E4C441;
  color: #fff; }

.m-badge.m-badge--banana {
  background-color: #F6BF26;
  color: #fff; }

.m-badge.m-badge--sage {
  background-color: #33B679;
  color: #fff; }

.m-badge.m-badge--peacock {
  background-color: #039BE5;
  color: #fff; }

.m-badge.m-badge--cobalt {
  background-color: #4285F4;
  color: #fff; }

.m-badge.m-badge--blueberry {
  background-color: #3F51B5;
  color: #fff; }

.m-badge.m-badge--lavender {
  background-color: #7986CB;
  color: #fff; }

.m-badge.m-badge--wisteria {
  background-color: #B39DDB;
  color: #fff; }

.m-badge.m-badge--graphite {
  background-color: #616161;
  color: #fff; }

.m-badge.m-badge--birch {
  background-color: #A79B8E;
  color: #fff; }

.m-badge.m-badge--radicchio {
  background-color: #AD1457;
  color: #fff; }

.m-badge.m-badge--cherry blossom {
  background-color: #D81B60;
  color: #fff; }

.m-badge.m-badge--grape {
  background-color: #8E24AA;
  color: #fff; }

.m-badge.m-badge--amethyst {
  background-color: #9E69AF;
  color: #fff; }

.m-badge.m-badge--cocoa {
  background-color: #795548;
  color: #fff; }

.m-badge.m-badge--flamingo {
  background-color: #E67C73;
  color: #fff; }

.m-badge.m-badge--tomato {
  background-color: #D50000;
  color: #fff; }

.m-badge.m-badge--tangerine {
  background-color: #F4511E;
  color: #fff; }

.m-badge.m-badge--pumpkin {
  background-color: #EF6C00;
  color: #fff; }

.m-badge.m-badge--mango {
  background-color: #F09300;
  color: #fff; }

.m-badge.m-badge--eucalyptus {
  background-color: #009688;
  color: #fff; }

.m-badge.m-badge--basil {
  background-color: #0B8043;
  color: #fff; }

.m-badge.m-badge--pistachio {
  background-color: #7CB342;
  color: #fff; }

.m-badge.m-badge--avocado {
  background-color: #C0CA33;
  color: #fff; }

.m-badge.m-badge--citron {
  background-color: #E4C441;
  color: #fff; }

.m-badge.m-badge--banana {
  background-color: #F6BF26;
  color: #fff; }

.m-badge.m-badge--sage {
  background-color: #33B679;
  color: #fff; }

.m-badge.m-badge--peacock {
  background-color: #039BE5;
  color: #fff; }

.m-badge.m-badge--cobalt {
  background-color: #4285F4;
  color: #fff; }

.m-badge.m-badge--blueberry {
  background-color: #3F51B5;
  color: #fff; }

.m-badge.m-badge--lavender {
  background-color: #7986CB;
  color: #fff; }

.m-badge.m-badge--wisteria {
  background-color: #B39DDB;
  color: #fff; }

.m-badge.m-badge--graphite {
  background-color: #616161;
  color: #fff; }

.m-badge.m-badge--birch {
  background-color: #A79B8E;
  color: #fff; }

.m-badge.m-badge--radicchio {
  background-color: #AD1457;
  color: #fff; }

.m-badge.m-badge--cherryblossom {
  background-color: #D81B60;
  color: #fff; }

.m-badge.m-badge--grape {
  background-color: #8E24AA;
  color: #fff; }

.m-badge.m-badge--amethyst {
  background-color: #9E69AF;
  color: #fff; }

.m-radio.m-radio--state-blue1.m-radio--solid > span {
  background: #426E86;
  border: 1px solid transparent !important; }

.m-radio.m-radio--state-blue1.m-radio--solid > span:after {
  border: solid #fff;
  background: #fff; }

.m-radio.m-radio--state-blue1.m-radio--solid > input:focus ~ span {
  border: 1px solid transparent !important; }

.m-radio.m-radio--state-blue1.m-radio--solid > input:checked ~ span {
  background: #426E86; }

.m-radio.m-radio--state-blue2.m-radio--solid > span {
  background: #128277;
  border: 1px solid transparent !important; }

.m-radio.m-radio--state-blue2.m-radio--solid > span:after {
  border: solid #fff;
  background: #fff; }

.m-radio.m-radio--state-blue2.m-radio--solid > input:focus ~ span {
  border: 1px solid transparent !important; }

.m-radio.m-radio--state-blue2.m-radio--solid > input:checked ~ span {
  background: #128277; }

.m-radio.m-radio--state-green1.m-radio--solid > span {
  background: #5B7065;
  border: 1px solid transparent !important; }

.m-radio.m-radio--state-green1.m-radio--solid > span:after {
  border: solid #fff;
  background: #fff; }

.m-radio.m-radio--state-green1.m-radio--solid > input:focus ~ span {
  border: 1px solid transparent !important; }

.m-radio.m-radio--state-green1.m-radio--solid > input:checked ~ span {
  background: #5B7065; }

.m-radio.m-radio--state-green2.m-radio--solid > span {
  background: #ACBD78;
  border: 1px solid transparent !important; }

.m-radio.m-radio--state-green2.m-radio--solid > span:after {
  border: solid #fff;
  background: #fff; }

.m-radio.m-radio--state-green2.m-radio--solid > input:focus ~ span {
  border: 1px solid transparent !important; }

.m-radio.m-radio--state-green2.m-radio--solid > input:checked ~ span {
  background: #ACBD78; }

.m-radio.m-radio--state-red1.m-radio--solid > span {
  background: #D24136;
  border: 1px solid transparent !important; }

.m-radio.m-radio--state-red1.m-radio--solid > span:after {
  border: solid #fff;
  background: #fff; }

.m-radio.m-radio--state-red1.m-radio--solid > input:focus ~ span {
  border: 1px solid transparent !important; }

.m-radio.m-radio--state-red1.m-radio--solid > input:checked ~ span {
  background: #D24136; }

.m-radio.m-radio--state-red2.m-radio--solid > span {
  background: #FF6E82;
  border: 1px solid transparent !important; }

.m-radio.m-radio--state-red2.m-radio--solid > span:after {
  border: solid #fff;
  background: #fff; }

.m-radio.m-radio--state-red2.m-radio--solid > input:focus ~ span {
  border: 1px solid transparent !important; }

.m-radio.m-radio--state-red2.m-radio--solid > input:checked ~ span {
  background: #FF6E82; }

.m-radio.m-radio--state-orange1.m-radio--solid > span {
  background: #F47D4A;
  border: 1px solid transparent !important; }

.m-radio.m-radio--state-orange1.m-radio--solid > span:after {
  border: solid #fff;
  background: #fff; }

.m-radio.m-radio--state-orange1.m-radio--solid > input:focus ~ span {
  border: 1px solid transparent !important; }

.m-radio.m-radio--state-orange1.m-radio--solid > input:checked ~ span {
  background: #F47D4A; }

.m-radio.m-radio--state-orange2.m-radio--solid > span {
  background: #CD7213;
  border: 1px solid transparent !important; }

.m-radio.m-radio--state-orange2.m-radio--solid > span:after {
  border: solid #fff;
  background: #fff; }

.m-radio.m-radio--state-orange2.m-radio--solid > input:focus ~ span {
  border: 1px solid transparent !important; }

.m-radio.m-radio--state-orange2.m-radio--solid > input:checked ~ span {
  background: #CD7213; }

.m-radio.m-radio--state-purple.m-radio--solid > span {
  background: #727077;
  border: 1px solid transparent !important; }

.m-radio.m-radio--state-purple.m-radio--solid > span:after {
  border: solid #fff;
  background: #fff; }

.m-radio.m-radio--state-purple.m-radio--solid > input:focus ~ span {
  border: 1px solid transparent !important; }

.m-radio.m-radio--state-purple.m-radio--solid > input:checked ~ span {
  background: #727077; }

.m-radio.m-radio--state-yellow.m-radio--solid > span {
  background: #F0D014;
  border: 1px solid transparent !important; }

.m-radio.m-radio--state-yellow.m-radio--solid > span:after {
  border: solid #fff;
  background: #fff; }

.m-radio.m-radio--state-yellow.m-radio--solid > input:focus ~ span {
  border: 1px solid transparent !important; }

.m-radio.m-radio--state-yellow.m-radio--solid > input:checked ~ span {
  background: #F0D014; }

.fc-month-view .fc-row.fc-widget-header {
  border-right-width: 0 !important; }

.fc-state-default {
  box-shadow: none; }

.fc .fc-toolbar .fc-button:not(:first-child) {
  border-left: 1px solid #fff; }

.fc-unthemed th {
  border: 0; }

.fc td {
  font-weight: 500; }

.fc-unthemed th.fc-day-header > a, .fc-unthemed th.fc-day-header > span {
  color: #364151;
  font-weight: bold; }

.fc-ltr a.fc-timeline-event .fc-title {
  padding-left: 0; }

.fc-event .fc-details {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis; }

#schedule_calendar .fc-body .fc-resource-area .fc-cell-content {
  padding-top: 5px;
  padding-bottom: 0;
  padding-left: 14px; }

.fc-cell-content > div {
  min-height: 70px; }

.fc-unthemed .fc-event {
  font-weight: 500; }

#schedule_calendar .fc-view-container .event-pto {
  border: 1.5px solid #CCC;
  color: #575962; }

#schedule_calendar .fc-view-container .event-pto .fc-content {
  align-items: center; }

#schedule_calendar .fc-view-container .event-pto .fc-hour-count {
  background: #575962;
  align-self: center; }

#schedule_calendar .fc-view-container .event-pto .badge-primary {
  display: inline-block;
  line-height: 1.4; }

#schedule_calendar .fc-view-container .event-pto .fc-details .badge-primary,
#schedule_calendar .fc-view-container .event-pto .fc-details .badge-roundless {
  display: inline-block;
  margin-left: 2.5em; }

#schedule_calendar .event-published {
  color: #fff; }

#schedule_calendar .event-unpublished .fc-hour-count,
#schedule_calendar .event-openshift .fc-hour-count,
#schedule_calendar .fc-view-container .event-pto .fc-hour-count {
  color: #fff; }

#schedule_calendar .event-openshift {
  color: #364151;
  border-width: 1px; }

#schedule_calendar .event-openshift .event-openshift-label {
  position: absolute;
  top: 0;
  left: -1px;
  width: 5px;
  height: 100%;
  border-top-left-radius: 2px;
  border-bottom-left-radius: 2px; }

#schedule_calendar .event-openshift .fc-details {
  opacity: 0.75; }

.m-checkbox > span {
  border-radius: 2px; }

.m-checkbox > span:after {
  box-sizing: border-box; }

.fc-filter-header .m-portlet__head {
  border-bottom: 1px solid #e3e8ee; }

.fc-filter-header .m-portlet__head .col-lg-auto,
.fc-filter-header .m-portlet__head .dropdown .btn.dropdown-toggle.btn-light {
  padding: 0; }

.fc-filter-header .m-portlet__head .dropdown .btn.dropdown-toggle.btn-light {
  background: #f7fafc;
  border-color: #f7fafc; }

.fc-filter-header .bootstrap-select > .dropdown-toggle::after {
  right: 1.5em; }

@media (max-width: 1100px) {
  .fc-filter-header .m-portlet__head-caption .m-form__group label.col-form-label {
    padding-right: 0;
    padding-left: 0;
    max-width: 30px; } }

.fc-filter-header .m-portlet__head .dropdown .btn.dropdown-toggle.btn-light .filter-option {
  position: static;
  padding-left: 1em;
  padding-right: 2em;
  color: #364151;
  font-weight: bold; }

.m-portlet-alert.m-portlet-alert--warning {
  background-color: #fcf8e2; }

.m-portlet.m-portlet-alert.m-portlet-alert--warning .m-portlet__head .m-portlet__head-text,
.m-portlet.m-portlet-alert.m-portlet-alert--warning .m-portlet__body {
  color: #665154; }

.badge-pto {
  padding: 0;
  margin: 5px;
  min-height: 8px;
  min-width: 8px;
  width: 8px; }

.resource_hours {
  margin-bottom: .1em;
  font-size: 0.857em;
  font-weight: 500; }

.resource_pto_hours_duration {
  margin-bottom: 0;
  font-size: 12px;
  color: #a3a5ad;
  font-weight: normal; }

#schedule_calendar .fc-header-toolbar {
  margin-bottom: 0.5em; }

.bs-container {
  z-index: 1061; }

.ui-sortable > * {
  cursor: -webkit-grab;
  cursor: grab; }

.ui-sortable-helper .fc-widget-content {
  cursor: -webkit-grabbing;
  cursor: grabbing;
  background-color: #eff8ff !important;
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.46); }

.fc-ltr .fc-body .fc-time-area .fc-following:before, .fc-ltr .fc-timeline-event.fc-not-start .fc-title:before {
  display: none !important; }

@media print {
  .fc-widget-content {
    background: none !important; }
  .fc th, .fc td, .fc hr, .fc thead, .fc tbody, .fc-row {
    border-width: 3px; }
  #schedule_calendar .fc-view-container .fc-event.event-published {
    border: 1px solid !important; }
  .schedule-block #schedule_calendar .fc-month-view .fc-body .fc-widget-content .fc-scroller {
    height: auto !important; }
  #schedule_calendar .fc-title.fc-following {
    visibility: hidden !important; }
  #schedule_calendar .fc-timeline-event .fc-title {
    visibility: visible !important;
    left: 0 !important; }
  .m-grid__item--fluid {
    padding-top: 0 !important; }
  .m-header--fixed .m-body {
    padding: 0 !important; }
  .schedule-menu-controls {
    display: none !important; }
  .fc-left,
  .fc-right,
  .fc-clear {
    display: none !important; }
  .fc-month-view .fc-day-grid .fc-row {
    break-before: avoid;
    break-inside: avoid;
    break-after: avoid; }
  .fc-month-view .fc-day-grid .fc-event-container {
    break-before: avoid; } }

@media (max-width: 1300px) {
  #schedule_calendar .fc-view-container .fc-event {
    padding: 4px; } }

@media (max-width: 1025px) {
  #schedule_calendar {
    position: relative; }
    #schedule_calendar .fc-view-container thead.fc-head td:first-child {
      width: 180px !important; }
  .availability-block #schedule_calendar {
    margin-top: 50px; }
  .availability-block .availability-label-wrap {
    position: absolute;
    top: -45px;
    left: 0;
    right: 0;
    width: 100%;
    margin: 0; } }

@media screen and (max-width: 768px) {
  .modal-open {
    overflow: hidden !important;
    position: fixed; }
  .calendar-sync-modal {
    width: 95% !important; }
    .calendar-sync-modal .modal-cal-sync-content {
      margin: 0; }
  .schedule-block .filter-item,
  .availability-block .filter-item {
    margin-bottom: 5px; }
  .schedule-block .modal .modal-body,
  .availability-block .modal .modal-body {
    max-height: 70vh;
    overflow-y: auto; }
  .schedule-block .schedule-additional-controls {
    display: flex !important;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-between; }
  .schedule-block .toggle-header-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex: 1 0 48%; }
    .schedule-block .toggle-header-btn__caption {
      display: block; }
  .schedule-block .schedule-options {
    flex: 1 0 48%;
    margin-right: 10px; }
    .schedule-block .schedule-options .dropdown-toggle {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding-right: 20px; }
    .schedule-block .schedule-options .dropdown-menu {
      width: 100%; }
  .schedule-block .publish-shifts-button, .schedule-block .send-schedule-button {
    flex: 1 0 100%;
    order: 1;
    width: 100%;
    margin-top: 10px;
    z-index: 100; }
  .schedule-block #publishShiftsButton-sticky-wrapper {
    flex: 1 0 100%;
    order: 1;
    width: 100%;
    z-index: 100;
    margin-bottom: 5px;
    position: relative; }
  .schedule-block #manageTemplatesModal .modal-dialog,
  .schedule-block #applyTemplateModal .modal-dialog {
    max-width: 95% !important; }
  .availability-block .availability-additional-controls {
    display: flex !important;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-between; }
  .availability-block .toggle-header-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex: 1 0 48%; }
    .availability-block .toggle-header-btn__caption {
      display: block; }
  .availability-block #schedule_calendar {
    margin-top: 50px; }
  .availability-block .availability-label-wrap {
    margin-left: -9%; }
  .availability-block .availability-options {
    flex: 1 0 48%;
    margin-right: 10px; }
    .availability-block .availability-options .dropdown-toggle {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding-right: 20px; }
    .availability-block .availability-options .dropdown-menu {
      width: 100%; }
  .availability-block .modal .timepicker-field {
    display: inline-flex;
    max-width: 75px; }
    .availability-block .modal .timepicker-field .form-control {
      padding-left: 10px;
      padding-right: 10px; }
  .m-portlet__body.schedule_calendar_portlet {
    padding-left: 0 !important;
    padding-right: 0 !important; }
  #schedule_calendar .fc-view-container thead.fc-head td:first-child {
    width: 155px !important; }
  #schedule_calendar .fc-view-container .fc-resource-area td:empty {
    padding: 0 !important; }
  #schedule_calendar .fc-body .fc-resource-area .fc-cell-content {
    padding-left: 0; }
  #schedule_calendar .fc-timeline td .resourceTitle {
    white-space: normal;
    hyphens: auto; }
  #schedule_calendar .fc-view-container .fc-timeline .fc-body .fc-scroller {
    height: 100vh !important; }
  #schedule_calendar {
    position: relative; }
    #schedule_calendar .fc-left .fc-button-group {
      display: flex;
      justify-content: space-between;
      margin: 0 15px 0 80px;
      overflow: hidden;
      background: #E3E8EE;
      border-radius: 4px; }
      #schedule_calendar .fc-left .fc-button-group:is(.dark *) {
        background: color-mix(in oklab, var(--foreground) 8%, var(--card, #1c1c1e)); }
      #schedule_calendar .fc-left .fc-button-group .fc-button {
        position: relative;
        z-index: 10; }
      #schedule_calendar .fc-left .fc-button-group .fc-corner-left {
        border-right: 1px solid #fff; }
        #schedule_calendar .fc-left .fc-button-group .fc-corner-left:is(.dark *) {
          border-right-color: var(--border); }
      #schedule_calendar .fc-left .fc-button-group .fc-corner-right {
        border-left: 1px solid #fff; }
        #schedule_calendar .fc-left .fc-button-group .fc-corner-right:is(.dark *) {
          border-left-color: var(--border); }
    #schedule_calendar .fc-left .fc-today-button {
      position: absolute;
      left: 5px;
      top: 0; }
    #schedule_calendar .fc-center {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      margin-left: 16%; }
    #schedule_calendar .fc-right {
      display: flex;
      justify-content: space-between;
      margin: 0 15px; }
      #schedule_calendar .fc-right .fc-button {
        width: 100%; }
  .bootstrap-select .dropdown-menu.inner > li > a .text {
    white-space: normal; }
  .bootstrap-timepicker-minute {
    padding: 0 !important; } }

@media screen and (max-height: 500px) {
  .schedule-block #schedule_calendar .fc-timelineDay-view .fc-body .fc-scroller-clip .fc-scroller,
  .schedule-block #schedule_calendar .fc-timelineWeek-view .fc-body .fc-scroller-clip .fc-scroller,
  .availability-block #schedule_calendar .fc-timelineDay-view .fc-body .fc-scroller-clip .fc-scroller,
  .availability-block #schedule_calendar .fc-timelineWeek-view .fc-body .fc-scroller-clip .fc-scroller {
    height: 100vh !important;
    min-height: 400px; }
  .schedule-block #schedule_calendar .fc-month-view .fc-body .fc-widget-content .fc-scroller,
  .availability-block #schedule_calendar .fc-month-view .fc-body .fc-widget-content .fc-scroller {
    height: 100vh !important;
    min-height: 400px; } }

.recurrence-type-wrapper {
  max-width: 165px; }
  .recurrence-type-wrapper.small {
    max-width: 120px; }
  .recurrence-type-wrapper.big {
    min-width: 332px;
    max-width: 332px; }
  .recurrence-type-wrapper .dropdown-toggle {
    padding-left: 10px;
    padding-right: 15px; }
  .recurrence-type-wrapper .filter-option {
    padding-left: 10px; }

.schedule-days-block {
  display: flex;
  align-items: center;
  margin-left: 10px;
  padding-right: 15px; }
  .schedule-days-block.fixed {
    position: relative; }
  .schedule-days-block .schedule-day {
    width: 22px;
    height: 22px;
    margin-right: 6px;
    margin-bottom: 0; }
    .schedule-days-block .schedule-day:last-child {
      margin-right: 0; }
    .schedule-days-block .schedule-day input {
      display: none;
      position: relative;
      z-index: -9999; }
    .schedule-days-block .schedule-day .schedule-day__caption {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 22px;
      height: 22px;
      border-radius: 24px;
      color: #80868b;
      background-color: #f1f3f4;
      font-size: 10px;
      cursor: pointer; }
    .schedule-days-block .schedule-day input:checked + .schedule-day__caption {
      color: white;
      background-color: #1a73e8; }
    .schedule-days-block .schedule-day input:disabled + .schedule-day__caption {
      color: white;
      background-color: #D1E3FA;
      cursor: default; }

.customTypeField.col-count {
  max-width: 72px;
  padding-right: 0; }

.customTypeField.col-type {
  max-width: 135px; }

/* ---------------------------------------------------------------------------
   Geofence Create/Edit (Metronic 9)

   Page-specific layout for ~/Views/Geofence/CreateOrEdit.cshtml. Scoped under
   `.create-or-edit-geofences-page` (class added by the view's jQuery ready
   handler) so nothing here leaks into other views.
   -------------------------------------------------------------------------- */
.create-or-edit-geofences-page {
  /* Prevent grid children from forcing horizontal overflow onto the
       neighbouring column at medium widths. */
  /* Keep the two selection tables stacked until the viewport is wide enough
       to render both side-by-side without the radio columns overlapping.
       Tailwind's xl breakpoint (1280px) is too tight; 1500px gives each grid
       cell enough room for the 180px name column plus the four radio cols
       (at 1400px the Employees table overflowed its cell by ~6px).

       Each column holds three rows (Active spacer, section heading, table).
       Using `subgrid` on the columns lets row heights be decided across the
       whole grid, so the Employees heading wrapping to two lines doesn't push
       its table below the Groups table. */
  /* The Groups spacer only exists to align the two headings when the tables
       sit side-by-side; when the grid stacks to a single column, hide it so
       the Groups section doesn't start with an empty row. */ }
  .create-or-edit-geofences-page .table-titles-col {
    color: #575962; }
  .create-or-edit-geofences-page .grid > div {
    min-width: 0; }
  @media (min-width: 1500px) {
    .create-or-edit-geofences-page .geofence-assign-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      grid-template-rows: auto auto 1fr;
      row-gap: 0; }
      .create-or-edit-geofences-page .geofence-assign-grid > div {
        display: grid;
        grid-template-rows: subgrid;
        grid-row: span 3;
        /* Subgrid row 3 stretches to max(Employees table, Groups
                   table). Anchor each child to the top of its row so the
                   shorter Groups table doesn't get pulled down and its rows
                   don't grow gaps. */ }
        .create-or-edit-geofences-page .geofence-assign-grid > div > * {
          align-self: start; } }
  .create-or-edit-geofences-page .geofence-groups-spacer {
    display: none; }
    @media (min-width: 1500px) {
      .create-or-edit-geofences-page .geofence-groups-spacer {
        display: block; } }
  .create-or-edit-geofences-page .geofence-assign-table {
    /* Keep the employee/group name column wide enough to render typical
           names on a single line, matching QA1. Extremely long names wrap to
           a second line (also matching QA1) rather than growing the column
           and pushing the table past its grid cell. */
    /* Remaining columns share the remaining space evenly. */
    /* Keep both tables' section/control header rows visually sticky as the
           user scrolls through long employee/group lists. */ }
    .create-or-edit-geofences-page .geofence-assign-table thead th.manager-name-col,
    .create-or-edit-geofences-page .geofence-assign-table thead th:first-child {
      min-width: 180px;
      white-space: nowrap; }
    .create-or-edit-geofences-page .geofence-assign-table tbody td.manager-name-col {
      min-width: 180px;
      width: 180px;
      word-break: break-word; }
    .create-or-edit-geofences-page .geofence-assign-table tbody td.tb-col,
    .create-or-edit-geofences-page .geofence-assign-table thead th.tb-col {
      width: 1%;
      white-space: nowrap; }
    .create-or-edit-geofences-page .geofence-assign-table thead .table-titles th,
    .create-or-edit-geofences-page .geofence-assign-table thead .table-controls th {
      position: sticky;
      z-index: 2;
      background-color: var(--background); }
    .create-or-edit-geofences-page .geofence-assign-table thead .table-titles th {
      top: var(--sticky-offset, 107px); }
    .create-or-edit-geofences-page .geofence-assign-table thead .table-controls th {
      top: calc(var(--sticky-offset, 107px) + 2.25rem); }

.payroll-intro {
  margin: 0 auto;
  max-width: 1380px; }
  .payroll-intro__hero {
    display: flex;
    gap: 50px;
    padding: 70px 0 200px 90px;
    background: linear-gradient(#873cff, rgba(135, 60, 255, 0) 0%), linear-gradient(-85deg, rgba(246, 249, 252, 0.9) 80%, white 0%); }
    :is(.dark *) .payroll-intro__hero {
      background: linear-gradient(rgba(135, 60, 255, 0.6), rgba(135, 60, 255, 0) 0%), linear-gradient(-85deg, var(--muted) 80%, var(--background) 0%); }
    @media (max-width: 1024px) {
      .payroll-intro__hero {
        flex-direction: column-reverse;
        gap: 30px;
        padding: 30px 30px 240px; } }
  .payroll-intro__hero-content {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0; }
  .payroll-intro__title {
    margin: 0 0 20px;
    font-weight: 700;
    font-size: 36px;
    line-height: 1.2;
    color: var(--mono); }
  .payroll-intro__desc {
    margin: 0 0 40px;
    font-weight: 400;
    font-size: 24px;
    line-height: 1.5;
    color: var(--mono); }
  .payroll-intro__list {
    margin: 0 0 35px;
    padding: 0;
    list-style: none; }
  .payroll-intro__list-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 15px;
    font-weight: 400;
    font-size: 20px;
    line-height: 1.4;
    color: var(--mono); }
    .payroll-intro__list-item i {
      color: var(--primary);
      margin-top: 4px;
      flex-shrink: 0; }
  .payroll-intro__hero-video {
    flex-shrink: 0;
    min-width: 596px; }
    @media (max-width: 1024px) {
      .payroll-intro__hero-video {
        min-width: 0;
        width: 100%; } }
  .payroll-intro__faq-section {
    display: flex;
    flex-direction: column;
    padding: 0 90px;
    margin-bottom: 120px; }
    @media (max-width: 1024px) {
      .payroll-intro__faq-section {
        padding: 0 30px; } }
  .payroll-intro__faq-title {
    margin: 0 0 20px;
    font-weight: 600;
    font-size: 34px;
    line-height: 1.2;
    color: var(--mono);
    text-align: center; }
  .payroll-intro__faq-desc {
    margin: 0 0 60px;
    font-weight: 400;
    font-size: 22px;
    line-height: 1.5;
    color: var(--muted-foreground);
    text-align: center; }
  .payroll-intro__faq-list {
    display: flex;
    flex-direction: column;
    gap: 20px; }
  .payroll-intro__faq-item {
    position: relative;
    display: flex;
    flex-direction: column;
    max-height: 80px;
    overflow: hidden;
    padding: 0 60px 30px 30px;
    background: var(--muted);
    cursor: pointer;
    transition: max-height 0.15s ease-out; }
    .payroll-intro__faq-item.is-expanded {
      max-height: 500px;
      transition: max-height 0.25s ease-in; }
  .payroll-intro__faq-control {
    position: absolute;
    top: 30px;
    right: 30px;
    font-size: 20px;
    color: var(--muted-foreground);
    pointer-events: none; }
  .payroll-intro__faq-question {
    display: flex;
    align-items: center;
    height: 80px;
    min-height: 80px;
    font-weight: 500;
    font-size: 24px;
    line-height: 1.2;
    color: var(--mono); }
  .payroll-intro__faq-answer {
    font-weight: 400;
    font-size: 20px;
    line-height: 1.7;
    color: var(--muted-foreground); }

[v-cloak] {
  display: none; }

/* Tailwind v4's pre-built theme bundle (src/metronic9/tailwind.styles.css)
   only emits utilities it sees in the templates it scanned at build time.
   `md:grid-cols-3` / `md:col-span-1` / `md:col-span-2` are needed by the
   Punch page's responsive grid (single column on mobile, 1+2 on desktop)
   but weren't in the source set, so we re-create them here. Matches
   Tailwind v4's --breakpoint-md (48rem). */
@media (min-width: 48rem) {
  .md\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .md\:col-span-1 {
    grid-column: span 1 / span 1; }
  .md\:col-span-2 {
    grid-column: span 2 / span 2; } }

/* Webcam preview: stretch the <video> (or fallback <object>) to fill
   the full width of the #webcam container, with object-fit:cover
   cropping when the 4:3 capture aspect doesn't match the container's
   30vh-tall display shape. Webcam.js writes fixed pixel width/height
   attributes onto the element from Webcam.set({ width, height }) — at
   ≤750px viewports the punch card is full-width but the 640px native
   capture leaves a gutter. The !important overrides those inline attrs.

   Scoped to the Punch page (#employeePunch): there width === destWidth so
   Webcam.js applies NO CSS transform, and forcing the <video> to 100% just
   fills the container. KioskPunch / AutoPunch use width(320) ≠ destWidth(640),
   so Webcam.js applies transform: scaleX(0.5) with transform-origin 0 0 on a
   640px box. If this rule applied there it would clamp the box to the 320px
   container first, then the 0.5 transform would shrink it AGAIN to 160px
   anchored top-left — a tiny, left-aligned preview. Those pages keep
   Webcam.js's intrinsic 640px box (their own `max-width: max-content`
   override defeats Tailwind preflight) so the transform renders correctly. */
#employeePunch #webcam video, #employeePunch #webcam object {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  display: block; }

/* Horizontal scroll for kt-table inside every Metronic 9 kt-card-grid.
   Without this, a long unbroken cell value (e.g. a 200-char "111…"
   Geofence name) makes the kt-table wider than its kt-card and the
   table escapes past the card's right edge.

   Two pieces are required:

   1. The KT datatable wrapper `<div class="grid" data-kt-datatable>`
      is a CSS Grid. Grid items default to `min-width: auto` (=
      min-content), which lets the inner kt-card-content grow to the
      table's natural width — defeating overflow:auto below. Forcing
      `minmax(0, 1fr)` on the column track lets the child shrink.

   2. The inner `.kt-card-content` that wraps the table itself needs
      `min-width: 0` (same shrink-allowing trick at flex/grid level)
      plus `overflow-x: auto` to show a horizontal scrollbar when the
      table is wider than the card. `:has(.kt-table)` scopes the rule
      so card-contents that don't hold a table are untouched. */
.kt-card-grid [data-kt-datatable].grid {
  grid-template-columns: minmax(0, 1fr); }

.kt-card-grid .kt-card-content:has(.kt-table) {
  min-width: 0;
  overflow-x: auto; }

.pin-field {
  display: flex;
  gap: 0.825rem;
  justify-content: center; }
  .pin-field .pin-field__item {
    border: 1.05px solid #E4E4E7;
    border-radius: .4rem;
    width: 52.71px;
    height: 52.71px;
    max-height: 50px;
    position: relative; }
    .pin-field .pin-field__item:before {
      content: '';
      position: absolute;
      top: calc(50% - 4.21px);
      left: calc(50% - 4.21px);
      width: 8.43px;
      height: 8.43px;
      border-radius: 10px;
      background: #E4E4E7; }
    .pin-field .pin-field__item.active:before {
      background: #8c8c8f; }
    .pin-field .pin-field__item:last-child {
      margin-right: 0; }

.keyboard .keyboard__row {
  display: flex;
  gap: 0.916rem;
  justify-content: center;
  margin-bottom: 0.916rem; }

.keyboard .keyboard__key {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 59.815px;
  height: 59.815px;
  border-radius: 100%;
  font-size: 1.113rem;
  background-color: #e4e4e74b;
  color: #858585;
  cursor: pointer; }
  .keyboard .keyboard__key.hidden {
    cursor: default;
    background: transparent; }
    .keyboard .keyboard__key.hidden:active {
      background: transparent; }
  .keyboard .keyboard__key:active {
    background-color: #e4e4e77a; }
  .keyboard .keyboard__key.keyboard__key--border {
    border: 1px solid #A0A0A0;
    border-radius: 25px;
    box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.5); }

.keyboard .keyboard__cross {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 59.815px;
  height: 59.815px;
  cursor: pointer; }

.keyboard .keyboard__icon {
  font-size: 1.5rem;
  color: #858585; }

/* Empty-state for /Report/TimeCards when the account has no employees yet.
   Mirrors the .no-active-employee-* rules from app-bundle.css so the layout
   works under the metronic9 layout, which only loads metronic9-bundle.css. */
.no-active-employee-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0 auto 50px; }
  .no-active-employee-wrap .no-active-employee {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: -14px auto 0;
    padding-top: 175px;
    width: 657px;
    max-width: 100%;
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: top center; }
    .no-active-employee-wrap .no-active-employee .no-active-employee-info {
      max-width: 400px;
      text-align: center; }
      .no-active-employee-wrap .no-active-employee .no-active-employee-info__title {
        display: inline-block;
        margin-bottom: 10px;
        font-size: 17px;
        font-weight: 600; }
      .no-active-employee-wrap .no-active-employee .no-active-employee-info__text {
        margin: 0; }
      .no-active-employee-wrap .no-active-employee .no-active-employee-info__link {
        text-decoration: underline; }
    .no-active-employee-wrap .no-active-employee--time-cards-view {
      background-image: url("/dist/images/Reports/timecard-missing.png"); }
      .no-active-employee-wrap .no-active-employee--time-cards-view .no-active-employee-info {
        max-width: 630px; }
  .no-active-employee-wrap .no-active-employee-info-img {
    width: 100%;
    max-width: 1040px;
    height: 544px;
    background-size: 100%;
    background-repeat: no-repeat; }
    .no-active-employee-wrap .no-active-employee-info-img--timecards {
      background-image: url("/dist/images/Reports/timecard-sample.png"); }

/* Dashboard GPS map InfoWindow bubble.
   The bubble HTML (built server-side in CurrentActivityViewModel.GetMapsMarkerInfo)
   wraps the name+location on the left and the GPS/accuracy/shift block on the
   right inside a `<div class="row">`. In QA1 master that .row was display:flex
   via Bootstrap; the metronic9 bundle doesn't load Bootstrap so the row falls
   back to block-level and the right column drops below the left column,
   leaving "Accurate to within …" and "Current Shift: …" cropped (Rachel's
   item 13 on AB#13094). Force the layout here so it works without Bootstrap. */
.gps-map .maps-ee-details-col[style*="flex-direction:column"] > .row {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 16px;
  width: 100%; }

.gps-map .maps-ee-details-col[style*="flex-direction:column"] > .row > .left-data {
  flex: 1 1 auto;
  min-width: 0; }

/* right-data: allow lines to wrap when the map column is narrow so
   "Accurate to within 13 feet" / "Current Shift: 0:01" don't get clipped at
   the bubble's edge. The InfoWindow auto-sizes height to fit wrapped lines.

   text-align: left so the "Current Shift: …" line reads left-justified to
   match prod (QA1). Without Bootstrap's defaults, .right-data was inheriting
   the bubble's text-align: right and the shift line ended up flush against
   the bubble edge — Nick's 2026-05-08 item #1 on AB#13094. */
.gps-map .maps-ee-details-col[style*="flex-direction:column"] > .row > .right-data {
  flex: 0 1 auto;
  margin-left: 0;
  word-break: normal;
  overflow-wrap: anywhere;
  text-align: left; }

/* Vertically center the avatar column against the text column.
   The image column has inline `align-items: center` but that only positions
   its own children — it doesn't share a center with the sibling text column.
   Centering happens on the parent .maps-ee-details flex row, so the avatar
   sits at the vertical midpoint of the (taller) text block (Nick's
   2026-05-08 item #2 on AB#13094). */
.gps-map .maps-ee-details {
  align-items: center; }

/* Time stamps and the "GPS" pill should never split mid-token. */
.gps-map .gps-location-timestamp,
.gps-map .gps-green-span {
  white-space: nowrap; }

/* Dark-mode overrides for the Churnkey cancellation modal (#ck-app). The
   widget is a third-party Tailwind bundle injected at runtime on ViewPlan,
   so we override its internal utility classes (bg-white, text-gray-*,
   border-gray-*) when our app is in dark mode. Scoped to #ck-app via
   :is(.dark *) so light mode stays untouched. */
:is(.dark *) #ck-app {
  /* Boundary/status screens (loading "Cancelling subscription…" and the
       "Sorry, something went wrong" error wall) use their own .title/.subtitle
       classes plus text-gray-600 — none of which are covered above, so their
       text stayed near-black on the darkened modal. */
  /* Follow-up textarea ("We read every answer..."). Churnkey leaves it as a
       default browser textarea, which renders white-on-dark inside our themed
       modal. Borders stay branded (border-primary-middle). */ }
  :is(.dark *) #ck-app .ck-background-overlay .bg-gray-500 {
    background-color: #000 !important; }
  :is(.dark *) #ck-app #ck-cf-modal,
  :is(.dark *) #ck-app #ck-theme-pre-section,
  :is(.dark *) #ck-app .ck-modal {
    background-color: var(--card) !important;
    color: var(--foreground) !important; }
  :is(.dark *) #ck-app .ck-survey-step li {
    background-color: var(--card) !important;
    border-color: var(--border) !important; }
  :is(.dark *) #ck-app .text-brand-black,
  :is(.dark *) #ck-app .text-gray-800 {
    color: var(--foreground) !important; }
  :is(.dark *) #ck-app .text-gray-500 {
    color: var(--muted-foreground) !important; }
  :is(.dark *) #ck-app .title {
    color: var(--foreground) !important; }
  :is(.dark *) #ck-app .subtitle,
  :is(.dark *) #ck-app .text-gray-600 {
    color: var(--muted-foreground) !important; }
  :is(.dark *) #ck-app .ck-step-footer {
    border-top-color: var(--border) !important; }
  :is(.dark *) #ck-app .ck-gray-primary-button {
    background-color: var(--muted) !important;
    color: var(--foreground) !important; }
  :is(.dark *) #ck-app .ck-black-primary-button {
    background-color: var(--primary) !important;
    color: var(--primary-foreground) !important; }
  :is(.dark *) #ck-app #followup-input {
    background-color: var(--background) !important;
    color: var(--foreground) !important; }
    :is(.dark *) #ck-app #followup-input::placeholder {
      color: var(--muted-foreground) !important; }

/* Tailwind arbitrary-value backgrounds the pre-built metronic9 bundle
   doesn't generate. Add new entries here when a view needs a one-off hex —
   the `[` `]` `#` in the class name must be CSS-escaped in the selector.
   Also paint child `<td>` cells so the rule still wins when applied to a
   table row whose cells get their own background from kt-table styles. */
.bg-\[\#F7F7F7\],
.bg-\[\#F7F7F7\] > td {
  background-color: #F7F7F7; }

.predefined-shift-field {
  padding: 10px;
  font-size: 0.875rem;
  font-weight: 600;
  border: 1px solid #eceef1;
  border-radius: .25rem; }

/* Punch buttons (.bp-punch-btn) toggle a .disabled class to indicate the
   employee can't punch — e.g. no shifts today, or late-punch mode with no
   time selected (AB#13066 #43 / #44). Metronic 9 styles native :disabled
   on <button>/<input>, but not a class-based .disabled, so without this
   rule the button stayed full-color and clickable. pointer-events:none
   also blocks clicks at the browser level, since the .punchInBtn /
   .punchInUsingKeyBtn / #latePunchInButton click handlers don't gate on
   the .disabled class. */
.bp-punch-btn.disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none; }

/* The .timecard-table[data-kt-datatable-table] tr:hover override in
   theme.custom.scss (~L2523) forces every row to `background-color:
   transparent !important` on hover. In light mode that's fine for
   .row-white (default-transparent) but strips .row-light's natural
   #eff7fc8c background (helpers.css:1105), making .row-light rows
   visibly flip to white on hover. In dark mode it strips BOTH row
   backgrounds (token-based per helpers.css .row-light/.row-white dark
   rules), making rows flash to the page background on hover. Restore
   the natural row color for each mode — the dark values MUST match the
   helpers.css dark row rules or hovering repaints the row. */
.timecard-table[data-kt-datatable-table] tr.row-light:hover {
  background-color: #eff7fc8c !important; }

.timecard-table[data-kt-datatable-table] tr.row-light:hover:is(.dark *) {
  background-color: color-mix(in oklab, var(--muted) 25%, var(--card)) !important; }

.timecard-table[data-kt-datatable-table] tr.row-white:hover:is(.dark *) {
  background-color: var(--card) !important; }

/* Grand-total row at the bottom of the timecard table. Light-mode color
   matches the previous `bg-[#F7F7F7]` inline utility; dark-mode color
   mirrors `tr.summary-row:is(.dark *)` (helpers.css:1122) — the same
   "subtle gray emphasis" role. Hover overrides preserve the background
   against the broad `tr:hover { transparent !important }` rule in
   theme.custom.scss:2523. Children > td also get the color so kt-table's
   per-cell backgrounds don't paint over the row tint. */
.timecard-table tr.timecard-total-row,
.timecard-table tr.timecard-total-row > td {
  background-color: color-mix(in oklab, var(--muted) 40%, var(--card));
  font-weight: 600; }

.timecard-table[data-kt-datatable-table] tr.timecard-total-row:hover {
  background-color: color-mix(in oklab, var(--muted) 40%, var(--card)) !important; }

/* Success toast — deepen the green. notification.service.js shows success
   notifications via KTToast.show({ variant: 'success' }), which renders
   `.kt-toast.kt-alert-success.kt-alert-solid` with a --color-green-500
   background (a bright, slightly-cyan green). Use a deeper, richer emerald so
   "Approved!"/success toasts read as more clearly green. The solid-success
   variant keeps the icon/title/close in white, so contrast stays strong.
   !important matches this file's other overrides of the prebuilt bundle. */
.kt-toast.kt-alert-success.kt-alert-solid {
  background-color: oklch(0.58 0.2 150) !important; }