@import url("https://cdn.datatables.net/1.13.6/css/jquery.dataTables.min.css");
@import url("https://cdn.jsdelivr.net/npm/apexcharts@3.45.1/dist/apexcharts.min.css");
@import url("https://cdn.jsdelivr.net/npm/antd/dist/antd.min.css");
@import url("https://cdn.jsdelivr.net/npm/@splidejs/splide@4.1.4/dist/css/splide.min.css");
@import "./ui/multi-select.dist.css";
@import "./tabler.css";
@import "./bootstrap-datepicker3.standalone.min.css";
@import "./typography.css";
@import "./ui/button.css";
@import "./ui/form.css";
@import "./ui/toggle.css";
@import "./ui/badge.css";
@import "./ui/row-cards.css";
@import "./ui/card.css";
@import "./ui/row-form.css";
@import "./ui/circle-icon.css";
@import "./ui/i.css";
@import "./ui/clr.css";
@import "./ui/bg.css";
@import "./ui/helpers.css";
@import "./ui/nav.css";
@import "./ui/avatar.css";
@import "./ui/header.css";
@import "./ui/breadcrumb.css";
@import "./ui/sidebar.css";
@import "./ui/dropdown.css";
@import "./ui/container.css";
@import "./ui/map.css";
@import "./ui/table.css";
@import "./ui/table-sort.css";
@import "./ui/link.css";
@import "./ui/nav-tabs.css";
@import "./ui/ant.css";
@import "./ui/apexchart.css";
@import "./ui/page-header-cover.css";
@import "./ui/tab-content.css";
@import "./ui/accordion.css";
@import "./ui/nav-pills.css";
@import "./ui/progressbar.css";
@import "./ui/modal.css";
@import "./ui/pagination.css";
@import "./ui/tag.css";
@import "./ui/segmentedControl.css";
@import "./ui/dropdown-menu.css";
@import "./ui/dropdown-item.css";
@import "./ui/card-wrapper.css";
@import "./ui/avatar-container.css";
@import "./ui/page-tabs.css";
@import "./ui/input-icon-wrap.css";
@import "./ui/opening-hours.css";
@import "./ui/logo.css";
@import "./ui/page-authentication.css";
@import "./ui/calendar.css";
@import "./ui/select-toggle.css";
@import "./ui/comment.css";
@import "./ui/toast.css";
@import "./ui/offcanvas.css";
@import "./ui/account-menu.css";
@import "./ui/lang-switcher.css";
@import "./ui/license-activation.css";
@import "./ui/dot.css";
@import "./ui/editor.css";
@import "./ui/skeleton.css";
@import "./ui/custom-select.css";
@import "./ui/checkbox.css";
@import "./leaflet.css";
@import "./ui/eco-mode.css";
@import "./ui/basic-selected-wrapper.css";

@-ms-viewport {
  width: device-width;
}

:root {
  /* base */
  font-size: 100%;

  --color-scheme: light;

  --font-family: system-ui, -apple-system, blinkmacsystemfont, "Segoe UI",
    roboto, oxygen, ubuntu, cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  --font-family-inter: "Inter", var(--font-family);

  --transition: all 300ms ease;
  --transition-transform: transform 300ms ease;

  /* COLORS */
  --background: #f7f7f7;
  --main-blue: #005382;
  --primary-500: #005382;
  --primary-100: #dcecf4;
  --primary-50: #f3fafe;
  --success-bg: #e0fbd1;
  --success-text: #328a03;
  --danger-bg: #fae3e3;
  --danger-text: #c23a3a;
  --alert-bg: #ffecd4;
  --alert-text: #d27501;
  --white: #ffffff;
  --grey-50: #f3f3f3;
  --grey-100: #ededed;
  --grey-200: #d6d6d6;
  --grey-500: #898989;
  --black: #111111;
  --grey-700: #4c4c4c;
  --grey-600: #686868;
  --grey-300: #bfbfbf;
  --danger-500: #ef0000;
  --primary-800: #003b5c;
  --danger-600: #bd3a00;
  --purple-text: #bb29ff;
  --purple-bg: #faeeff;
  --alert-50: #fff7ee;
  --alert-500: #ff9f29;
  --primary-300: #99bacd;
  --danger-50: #fff6f6;
  --success-500: #45b369;
  --grey-10: #fcfcfc;
  --grey-400: #a7a7a7;
  --danger-700: #8a2b00;
  --text-primary-light: #111827;
  --text-secondary-light: #4b5563;
  --text-secondary-light: #4b5563;

  --tblr-primary: var(--primary-500);
  --tblr-primary-darken: var(--primary-800);
  --tblr-black-rgb: 17, 17, 17;

  --box-shadow: 0 0.25rem 1.875rem 0rem rgba(46, 45, 116, 0.05);
  --radius: 0.5rem;
  --radius-md: 0.75rem;

  --sidebar-width: 19.5rem;

  --bg-gradient-white: linear-gradient(0deg,
      var(--white) 0%,
      rgba(255, 255, 255, 0) 100%);
  --bg-modal: rgba(0, 0, 0, 0.6);

  --toggle-shadow: 1px 2px 4.7px 0px rgba(0, 0, 0, 0.05) inset;
  --hover-shadow: rgba(var(--tblr-body-color-rgb), 0.16) 0 2px 16px 0;
  --soft-shadow: 0px 4px 30px 0px rgba(46, 45, 116, 0.05);
  --tooltip-shadow: 0px 3px 40px 1px rgba(20, 37, 47, 0.15);

  --padding-inline: 1.25rem;

  --calendar-footer-height: 4.25rem;
  --calendar-breadcrumb-height: 12.125rem;
  --calendar-menu-height: 4.75rem;
}

@media (min-width: calc(64rem + 1px)) {
  :root {
    --padding-inline: 1.5rem;
  }
}

:root {
  /* z-index */
  --index-base: 1;
  --index-page: 10;
  --index-select: 20;
  --index-menu: 100;
  --index-modal: 1100;
  --index-sidebar: 1001;
}

*,
*:before,
*:after {
  box-sizing: border-box;
}

html {
  text-rendering: optimizeLegibility;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  -webkit-overflow-scrolling: touch;
  hanging-punctuation: first last;
  color-scheme: var(--color-scheme);
  height: 100%;
}

body {
  position: relative;
  height: 100%;
  min-height: 100%;
  margin: 0;
  font-family: var(--font-family-inter);
  background: var(--background);
  font-size: 1rem;
  line-height: normal;
  -webkit-overflow-scrolling: touch;
}

img {
  box-sizing: content-box;
}

img,
picture {
  -ms-interpolation-mode: nearest-neighbor;
  backface-visibility: hidden;
  image-rendering: auto;
}

img,
svg {
  display: inline-block;
  max-width: 100%;
  height: auto;
  border: none;
}

a,
svg,
path {
  transition: var(--transition);
}

iframe {
  max-width: 100%;
}

label {
  user-select: none;
}

textarea {
  max-width: 100%;
}

form {
  width: 100%;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  text-wrap: pretty;

  @media (min-width: 48rem) {
    text-wrap: balance;
  }

  &:last-child {
    margin-bottom: 0;
  }
}

p {
  text-wrap: pretty;
}

p:where([class]) {
  margin: 0;
}

a {
  color: inherit;
}

:where(#app, #root, #storybook-root):not([hidden]) {
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  margin: auto;

  >* {
    flex: 1;
  }
}

.page-wrapper {
  transition: var(--transition);
  overflow: hidden;

  @media (min-width: calc(64rem + 1px)) {
    margin-left: var(--sidebar-width);
    overflow: unset;
  }
}

.page-body {
  --tblr-page-padding-y: 2rem;
  --tblr-page-padding-x: var(--padding-inline);
  margin: 0;
  padding-block-end: var(--tblr-page-padding-y);
  padding-inline: var(--tblr-page-padding-x);

  .row-cards>div:last-child {
    margin-bottom: 0;
  }
}

.page-inner {
  position: relative;
  min-height: 100%;
  flex: 1;
  display: flex;
  flex-direction: column;
  border-radius: var(--radius);
  overflow: hidden;
  background: var(--white);
  margin-bottom: 2rem;
}

.row-cards>div:last-child {
  margin-bottom: 2rem;
}

hr {
  border: 0.0625rem solid var(--grey-200);
  width: 100%;
  margin: 0;
}

.pe-12px {
  padding-right: 12px !important;
}

.px-12px {
  padding-inline: 12px !important;
}

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

.bg-blue {
  border: 0.0625rem solid #edf1ff;
  background: linear-gradient(90deg,
      var(--primary-50) 0.12%,
      var(--primary-50) 50.51%);
}

.bg-primary-500 {
  background-color: var(--primary-500);
}

.bg-grey-50 {
  background-color: var(--grey-50);
}

.min-vh-70 {
  min-height: 70dvh;
}

.container-inline {
  container-type: inline-size;

  &:has(> .fade.show) {
    container-type: unset;
  }
}

.all-pages {
  padding-block: 2rem;
  width: min(100%, 40rem);
  margin-inline: auto;

  a {
    text-decoration: underline;
    color: var(--grey-700);

    &:hover {
      color: var(--primary-500);
    }
  }

  li {
    font-size: 0.875rem;
    padding-block: 0.25rem;
  }
}

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100;
  src: url("../fonts/Inter-Thin.woff2") format("woff2"),
    url("../fonts/Inter-Thin.woff") format("woff");
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 300;
  src: url("../fonts/Inter-Light.woff2") format("woff2"),
    url("../fonts/Inter-Light.woff") format("woff");
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/Inter-Regular.woff2") format("woff2"),
    url("../fonts/Inter-Regular.woff") format("woff");
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 500;
  src: url("../fonts/Inter-Medium.woff2") format("woff2"),
    url("../fonts/Inter-Medium.woff") format("woff");
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 600;
  src: url("../fonts/Inter-SemiBold.woff2") format("woff2"),
    url("../fonts/Inter-SemiBold.woff") format("woff");
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/Inter-Bold.woff2") format("woff2"),
    url("../fonts/Inter-Bold.woff") format("woff");
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 800;
  src: url("../fonts/Inter-ExtraBold.woff2") format("woff2"),
    url("../fonts/Inter-ExtraBold.woff") format("woff");
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 900;
  src: url("../fonts/Inter-Black.woff2") format("woff2"),
    url("../fonts/Inter-Black.woff") format("woff");
  font-display: swap;
}