@font-face {
  font-family: "Gordita";
  src: url("../typo/gordita_regular.woff");
  font-weight: 400;
}

@font-face {
  font-family: "Gordita";
  src: url("../typo/gordita_regular_italic.woff");
  font-weight: 400;
  font-style: italic;
}

@font-face {
  font-family: "Gordita";
  src: url("../typo/gordita_medium.woff");
  font-weight: 600;
}

@font-face {
  font-family: "Gordita";
  src: url("../typo/gordita_medium_italic.woff");
  font-weight: 600;
  font-style: italic;
}

@font-face {
  font-family: "Gordita";
  src: url("../typo/gordita_bold.woff");
  font-weight: 700;
}

@font-face {
  font-family: "Gordita";
  src: url("../typo/gordita_bold_italic.woff");
  font-weight: 700;
  font-style: italic;
}

@font-face {
  font-family: "Gordita";
  src: url("../typo/gordita_black.woff");
  font-weight: 800;
}

@font-face {
  font-family: "Gordita";
  src: url("../typo/gordita_black_italic.woff");
  font-weight: 800;
  font-style: italic;
}

:root {
  --color-background: 243, 247, 249;
  --color-text: 0, 0, 0;
  --color-text-inverse: 255, 255, 255;
  --color-border: 160, 168, 171;
  --color-tHead: 232, 234, 235;
  --color-button: 102, 206, 245;
  --color-button-inactive: 160, 168, 171;
  --color-button-inactive-text: 91, 104, 109;
  --color-label-green: 0, 240, 146;
  --color-label-red: 255, 0, 0;
  --color-label-orange: 251, 138, 32;
  --color-label-purple: 151, 71, 255;
  --color-label-pink: 235, 87, 202;
  --color-label-yellow: 251, 188, 9;
  --color-tag: 232, 234, 235;
  --color-widget-background: 255, 255, 255;
  --color-widget-savings: 0, 174, 239;
  --color-link-sidebar: 91, 104, 109;
  --color-header-text: 91, 104, 109;
  --color-alert-disclaimer: 255, 71, 71;
  --font-size: 16px;
  --gutter: 40px;
  --gap: 30px;
  --radius: 12px;
  --size-header: 82px;
  --width: 0;
  --width-sidebar: 300px;
  --icon-dashboard: url(../images/icons/icon-dashboard.svg);
  --icon-reports: url(../images/icons/icon-reports.svg);
  --icon-savings: url(../images/icons/icon-savings.svg);
  --icon-config: url(../images/icons/icon-configuration.svg);
  --icon-invitations: url(../images/icons/icon-invitation.svg);
  --icon-support: url(../images/icons/icon-support.svg);
  --icon-support-new: url(../images/icons/icon-support-new.svg);
  --icon-integration: url(../images/icons/icon-integration.svg);
  --icon-click: url(../images/icons/icon-click.svg);
  --icon-money: url(../images/icons/icon-money-white.svg);
  --icon-refresh: url(../images/icons/icon-refresh-white.svg);
  --icon-docs: url(../images/icons/icon-docs-grey.svg);
  --icon-bot: url(../images/icons/icon-widget-bots.svg);
  --icon-proxy: url(../images/icons/icon-widget-proxy-users.svg);
  --icon-vpn: url(../images/icons/icon-widget-vpn-users.svg);
  --icon-crowler: url(../images/icons/icon-widget-crowler.svg);
  --icon-mobile: url(../images/icons/icon-mobile.svg);
  --icon-skull: url(../images/icons/icon-skull.svg);
  --icon-monitor: url(../images/icons/icon-monitoring.svg);
  --icon-whitelist: url(../images/icons/icon-whitelist.svg);
  --icon-block: url(../images/icons/icon-block.svg);
  --icon-config-red: url(../images/icons/icon-config-red.svg);
  --icon-config-grey: url(../images/icons/icon-config-grey.svg);
  --icon-add: url(../images/icons/icon-add.svg);
  --icon-download: url(../images/icons/icon-download.svg);
  --icon-trash: url(../images/icons/icon-trash-red.svg);
  --icon-close: url(../images/icons/icon-close-grey.svg);
  --icon-close-white: url(../images/icons/icon-close-white.svg);
  --icon-filters: url(../images/icons/icon-filter-grey.svg);
  --icon-calendar: url(../images/icons/icon-calendar-grey.svg);
  --icon-calendar-white: url(../images/icons/icon-calendar-white.svg);
  --icon-arrow: url(../images/icons/icon-arrow-grey.svg);
  --icon-arrow-dropdown: url(../images/icons/icon-arrow-dropdown.svg);
  --icon-radar: url(../images/icons/icon-radar-grey.svg);
  --icon-cursor: url(../images/icons/icon-cursor-grey.svg);
  --icon-search: url(../images/icons/icon-search-grey.svg);
  --icon-scale: url(../images/icons/icon-scale-grey.svg);
  --icon-connectivity: url(../images/icons/icon-conectivity-grey.svg);
  --icon-browser: url(../images/icons/icon-browser-grey.svg);
  --icon-devices: url(../images/icons/icon-devices-grey.svg);
  --icon-location: url(../images/icons/icon-location-grey.svg);
  --icon-header-account: url(../images/icons/icon-dropdown-account.svg);
  --icon-header-theme: url(../images/icons/icon-dropdown-dark-theme.svg);
  --icon-header-switch: url(../images/icons/icon-dropdown-switch-account.svg);
  --icon-header-logout: url(../images/icons/icon-dropdown-logout.svg);
  --icon-os-windows: url(../images/icons/icon-os-windows.svg);
  --icon-os-apple: url(../images/icons/icon-os-apple.svg);
  --icon-os-android: url(../images/icons/icon-os-android.svg);
  --icon-os-linux: url(../images/icons/icon-os-ubuntu.svg);
  --icon-sources: url(../images/icons/icon-source.svg);
  --icon-conversions: url(../images/icons/icon-conversation-gray.svg);
  --icon-error: url(../images/icons/error.svg);
  --icon-info: url(../images/icons/info.svg);
  --icon-success: url(../images/icons/success.svg);
  --icon-warning: url(../images/icons/warning.svg);
  --icon-edit: url(../images/icons/icon-edit.svg);
  --icon-conversion: url(../images/icons/icon-conversion-dashboard.svg);
}

html {
  font-family: "Gordita", sans-serif;
  font-size: var(--font-size);
  height: 100%;
}

body {
  margin: 0;
  padding: 0;
  background-color: rgba(var(--color-background), 1);
  font-family: "Gordita", sans-serif;
  color: rgb(var(--color-text));
  min-height: 100%;
  opacity: 1;
}

* {
  box-sizing: border-box;
}

.whitespace-nowrap {
  white-space: nowrap;
}

.justify-end {
  justify-content: end;
}
.justify-center {
  justify-content: center;
}
.gap-30{
  gap: 30px !important;
}

.fib,
.fi {
  background-size: contain;
  background-position: 50%;
  background-repeat: no-repeat;
}

.fi {
  position: relative;
  display: inline-block;
  width: 1.333333em;
  line-height: 1em;
}

.fi:before {
  content: "";
}

.fi.fis {
  width: 1em;
}

.fi-xx::before {
  content: url(../images/flags/xx.svg);
}

.fi-xx.fis::before {
  content: url(../flags/1x1/xx.svg);
}

.fi-ad::before {
  content: url(../images/flags/ad.svg);
}

.fi-ad.fis::before {
  content: url(../flags/1x1/ad.svg);
}

.fi-ae::before {
  content: url(../images/flags/ae.svg);
}

.fi-ae.fis::before {
  content: url(../flags/1x1/ae.svg);
}

.fi-af::before {
  content: url(../images/flags/af.svg);
}

.fi-af.fis::before {
  content: url(../flags/1x1/af.svg);
}

.fi-ag::before {
  content: url(../images/flags/ag.svg);
}

.fi-ag.fis::before {
  content: url(../flags/1x1/ag.svg);
}

.fi-ai::before {
  content: url(../images/flags/ai.svg);
}

.fi-ai.fis::before {
  content: url(../flags/1x1/ai.svg);
}

.fi-al::before {
  content: url(../images/flags/al.svg);
}

.fi-al.fis::before {
  content: url(../flags/1x1/al.svg);
}

.fi-am::before {
  content: url(../images/flags/am.svg);
}

.fi-am.fis::before {
  content: url(../flags/1x1/am.svg);
}

.fi-ao::before {
  content: url(../images/flags/ao.svg);
}

.fi-ao.fis::before {
  content: url(../flags/1x1/ao.svg);
}

.fi-aq::before {
  content: url(../images/flags/aq.svg);
}

.fi-aq.fis::before {
  content: url(../flags/1x1/aq.svg);
}

.fi-ar::before {
  content: url(../images/flags/ar.svg);
}

.fi-ar.fis::before {
  content: url(../flags/1x1/ar.svg);
}

.fi-as::before {
  content: url(../images/flags/as.svg);
}

.fi-as.fis::before {
  content: url(../flags/1x1/as.svg);
}

.fi-at::before {
  content: url(../images/flags/at.svg);
}

.fi-at.fis::before {
  content: url(../flags/1x1/at.svg);
}

.fi-au::before {
  content: url(../images/flags/au.svg);
}

.fi-au.fis::before {
  content: url(../flags/1x1/au.svg);
}

.fi-aw::before {
  content: url(../images/flags/aw.svg);
}

.fi-aw.fis::before {
  content: url(../flags/1x1/aw.svg);
}

.fi-ax::before {
  content: url(../images/flags/ax.svg);
}

.fi-ax.fis::before {
  content: url(../flags/1x1/ax.svg);
}

.fi-az::before {
  content: url(../images/flags/az.svg);
}

.fi-az.fis::before {
  content: url(../flags/1x1/az.svg);
}

.fi-ba::before {
  content: url(../images/flags/ba.svg);
}

.fi-ba.fis::before {
  content: url(../flags/1x1/ba.svg);
}

.fi-bb::before {
  content: url(../images/flags/bb.svg);
}

.fi-bb.fis::before {
  content: url(../flags/1x1/bb.svg);
}

.fi-bd::before {
  content: url(../images/flags/bd.svg);
}

.fi-bd.fis::before {
  content: url(../flags/1x1/bd.svg);
}

.fi-be::before {
  content: url(../images/flags/be.svg);
}

.fi-be.fis::before {
  content: url(../flags/1x1/be.svg);
}

.fi-bf::before {
  content: url(../images/flags/bf.svg);
}

.fi-bf.fis::before {
  content: url(../flags/1x1/bf.svg);
}

.fi-bg::before {
  content: url(../images/flags/bg.svg);
}

.fi-bg.fis::before {
  content: url(../flags/1x1/bg.svg);
}

.fi-bh::before {
  content: url(../images/flags/bh.svg);
}

.fi-bh.fis::before {
  content: url(../flags/1x1/bh.svg);
}

.fi-bi::before {
  content: url(../images/flags/bi.svg);
}

.fi-bi.fis::before {
  content: url(../flags/1x1/bi.svg);
}

.fi-bj::before {
  content: url(../images/flags/bj.svg);
}

.fi-bj.fis::before {
  content: url(../flags/1x1/bj.svg);
}

.fi-bl::before {
  content: url(../images/flags/bl.svg);
}

.fi-bl.fis::before {
  content: url(../flags/1x1/bl.svg);
}

.fi-bm::before {
  content: url(../images/flags/bm.svg);
}

.fi-bm.fis::before {
  content: url(../flags/1x1/bm.svg);
}

.fi-bn::before {
  content: url(../images/flags/bn.svg);
}

.fi-bn.fis::before {
  content: url(../flags/1x1/bn.svg);
}

.fi-bo::before {
  content: url(../images/flags/bo.svg);
}

.fi-bo.fis::before {
  content: url(../flags/1x1/bo.svg);
}

.fi-bq::before {
  content: url(../images/flags/bq.svg);
}

.fi-bq.fis::before {
  content: url(../flags/1x1/bq.svg);
}

.fi-br::before {
  content: url(../images/flags/br.svg);
}

.fi-br.fis::before {
  content: url(../flags/1x1/br.svg);
}

.fi-bs::before {
  content: url(../images/flags/bs.svg);
}

.fi-bs.fis::before {
  content: url(../flags/1x1/bs.svg);
}

.fi-bt::before {
  content: url(../images/flags/bt.svg);
}

.fi-bt.fis::before {
  content: url(../flags/1x1/bt.svg);
}

.fi-bv::before {
  content: url(../images/flags/bv.svg);
}

.fi-bv.fis::before {
  content: url(../flags/1x1/bv.svg);
}

.fi-bw::before {
  content: url(../images/flags/bw.svg);
}

.fi-bw.fis::before {
  content: url(../flags/1x1/bw.svg);
}

.fi-by::before {
  content: url(../images/flags/by.svg);
}

.fi-by.fis::before {
  content: url(../flags/1x1/by.svg);
}

.fi-bz::before {
  content: url(../images/flags/bz.svg);
}

.fi-bz.fis::before {
  content: url(../flags/1x1/bz.svg);
}

.fi-ca::before {
  content: url(../images/flags/ca.svg);
}

.fi-ca.fis::before {
  content: url(../flags/1x1/ca.svg);
}

.fi-cc::before {
  content: url(../images/flags/cc.svg);
}

.fi-cc.fis::before {
  content: url(../flags/1x1/cc.svg);
}

.fi-cd::before {
  content: url(../images/flags/cd.svg);
}

.fi-cd.fis::before {
  content: url(../flags/1x1/cd.svg);
}

.fi-cf::before {
  content: url(../images/flags/cf.svg);
}

.fi-cf.fis::before {
  content: url(../flags/1x1/cf.svg);
}

.fi-cg::before {
  content: url(../images/flags/cg.svg);
}

.fi-cg.fis::before {
  content: url(../flags/1x1/cg.svg);
}

.fi-ch::before {
  content: url(../images/flags/ch.svg);
}

.fi-ch.fis::before {
  content: url(../flags/1x1/ch.svg);
}

.fi-ci::before {
  content: url(../images/flags/ci.svg);
}

.fi-ci.fis::before {
  content: url(../flags/1x1/ci.svg);
}

.fi-ck::before {
  content: url(../images/flags/ck.svg);
}

.fi-ck.fis::before {
  content: url(../flags/1x1/ck.svg);
}

.fi-cl::before {
  content: url(../images/flags/cl.svg);
}

.fi-cl.fis::before {
  content: url(../flags/1x1/cl.svg);
}

.fi-cm::before {
  content: url(../images/flags/cm.svg);
}

.fi-cm.fis::before {
  content: url(../flags/1x1/cm.svg);
}

.fi-cn::before {
  content: url(../images/flags/cn.svg);
}

.fi-cn.fis::before {
  content: url(../flags/1x1/cn.svg);
}

.fi-co::before {
  content: url(../images/flags/co.svg);
}

.fi-co.fis::before {
  content: url(../flags/1x1/co.svg);
}

.fi-cr::before {
  content: url(../images/flags/cr.svg);
}

.fi-cr.fis::before {
  content: url(../flags/1x1/cr.svg);
}

.fi-cu::before {
  content: url(../images/flags/cu.svg);
}

.fi-cu.fis::before {
  content: url(../flags/1x1/cu.svg);
}

.fi-cv::before {
  content: url(../images/flags/cv.svg);
}

.fi-cv.fis::before {
  content: url(../flags/1x1/cv.svg);
}

.fi-cw::before {
  content: url(../images/flags/cw.svg);
}

.fi-cw.fis::before {
  content: url(../flags/1x1/cw.svg);
}

.fi-cx::before {
  content: url(../images/flags/cx.svg);
}

.fi-cx.fis::before {
  content: url(../flags/1x1/cx.svg);
}

.fi-cy::before {
  content: url(../images/flags/cy.svg);
}

.fi-cy.fis::before {
  content: url(../flags/1x1/cy.svg);
}

.fi-cz::before {
  content: url(../images/flags/cz.svg);
}

.fi-cz.fis::before {
  content: url(../flags/1x1/cz.svg);
}

.fi-de::before {
  content: url(../images/flags/de.svg);
}

.fi-de.fis::before {
  content: url(../flags/1x1/de.svg);
}

.fi-dj::before {
  content: url(../images/flags/dj.svg);
}

.fi-dj.fis::before {
  content: url(../flags/1x1/dj.svg);
}

.fi-dk::before {
  content: url(../images/flags/dk.svg);
}

.fi-dk.fis::before {
  content: url(../flags/1x1/dk.svg);
}

.fi-dm::before {
  content: url(../images/flags/dm.svg);
}

.fi-dm.fis::before {
  content: url(../flags/1x1/dm.svg);
}

.fi-do::before {
  content: url(../images/flags/do.svg);
}

.fi-do.fis::before {
  content: url(../flags/1x1/do.svg);
}

.fi-dz::before {
  content: url(../images/flags/dz.svg);
}

.fi-dz.fis::before {
  content: url(../flags/1x1/dz.svg);
}

.fi-ec::before {
  content: url(../images/flags/ec.svg);
}

.fi-ec.fis::before {
  content: url(../flags/1x1/ec.svg);
}

.fi-ee::before {
  content: url(../images/flags/ee.svg);
}

.fi-ee.fis::before {
  content: url(../flags/1x1/ee.svg);
}

.fi-eg::before {
  content: url(../images/flags/eg.svg);
}

.fi-eg.fis::before {
  content: url(../flags/1x1/eg.svg);
}

.fi-eh::before {
  content: url(../images/flags/eh.svg);
}

.fi-eh.fis::before {
  content: url(../flags/1x1/eh.svg);
}

.fi-er::before {
  content: url(../images/flags/er.svg);
}

.fi-er.fis::before {
  content: url(../flags/1x1/er.svg);
}

.fi-es::before {
  content: url(../images/flags/es.svg);
}

.fi-es.fis::before {
  content: url(../flags/1x1/es.svg);
}

.fi-et::before {
  content: url(../images/flags/et.svg);
}

.fi-et.fis::before {
  content: url(../flags/1x1/et.svg);
}

.fi-fi::before {
  content: url(../images/flags/fi.svg);
}

.fi-fi.fis::before {
  content: url(../flags/1x1/fi.svg);
}

.fi-fj::before {
  content: url(../images/flags/fj.svg);
}

.fi-fj.fis::before {
  content: url(../flags/1x1/fj.svg);
}

.fi-fk::before {
  content: url(../images/flags/fk.svg);
}

.fi-fk.fis::before {
  content: url(../flags/1x1/fk.svg);
}

.fi-fm::before {
  content: url(../images/flags/fm.svg);
}

.fi-fm.fis::before {
  content: url(../flags/1x1/fm.svg);
}

.fi-fo::before {
  content: url(../images/flags/fo.svg);
}

.fi-fo.fis::before {
  content: url(../flags/1x1/fo.svg);
}

.fi-fr::before {
  content: url(../images/flags/fr.svg);
}

.fi-fr.fis::before {
  content: url(../flags/1x1/fr.svg);
}

.fi-ga::before {
  content: url(../images/flags/ga.svg);
}

.fi-ga.fis::before {
  content: url(../flags/1x1/ga.svg);
}

.fi-gb::before {
  content: url(../images/flags/gb.svg);
}

.fi-gb.fis::before {
  content: url(../flags/1x1/gb.svg);
}

.fi-gd::before {
  content: url(../images/flags/gd.svg);
}

.fi-gd.fis::before {
  content: url(../flags/1x1/gd.svg);
}

.fi-ge::before {
  content: url(../images/flags/ge.svg);
}

.fi-ge.fis::before {
  content: url(../flags/1x1/ge.svg);
}

.fi-gf::before {
  content: url(../images/flags/gf.svg);
}

.fi-gf.fis::before {
  content: url(../flags/1x1/gf.svg);
}

.fi-gg::before {
  content: url(../images/flags/gg.svg);
}

.fi-gg.fis::before {
  content: url(../flags/1x1/gg.svg);
}

.fi-gh::before {
  content: url(../images/flags/gh.svg);
}

.fi-gh.fis::before {
  content: url(../flags/1x1/gh.svg);
}

.fi-gi::before {
  content: url(../images/flags/gi.svg);
}

.fi-gi.fis::before {
  content: url(../flags/1x1/gi.svg);
}

.fi-gl::before {
  content: url(../images/flags/gl.svg);
}

.fi-gl.fis::before {
  content: url(../flags/1x1/gl.svg);
}

.fi-gm::before {
  content: url(../images/flags/gm.svg);
}

.fi-gm.fis::before {
  content: url(../flags/1x1/gm.svg);
}

.fi-gn::before {
  content: url(../images/flags/gn.svg);
}

.fi-gn.fis::before {
  content: url(../flags/1x1/gn.svg);
}

.fi-gp::before {
  content: url(../images/flags/gp.svg);
}

.fi-gp.fis::before {
  content: url(../flags/1x1/gp.svg);
}

.fi-gq::before {
  content: url(../images/flags/gq.svg);
}

.fi-gq.fis::before {
  content: url(../flags/1x1/gq.svg);
}

.fi-gr::before {
  content: url(../images/flags/gr.svg);
}

.fi-gr.fis::before {
  content: url(../flags/1x1/gr.svg);
}

.fi-gs::before {
  content: url(../images/flags/gs.svg);
}

.fi-gs.fis::before {
  content: url(../flags/1x1/gs.svg);
}

.fi-gt::before {
  content: url(../images/flags/gt.svg);
}

.fi-gt.fis::before {
  content: url(../flags/1x1/gt.svg);
}

.fi-gu::before {
  content: url(../images/flags/gu.svg);
}

.fi-gu.fis::before {
  content: url(../flags/1x1/gu.svg);
}

.fi-gw::before {
  content: url(../images/flags/gw.svg);
}

.fi-gw.fis::before {
  content: url(../flags/1x1/gw.svg);
}

.fi-gy::before {
  content: url(../images/flags/gy.svg);
}

.fi-gy.fis::before {
  content: url(../flags/1x1/gy.svg);
}

.fi-hk::before {
  content: url(../images/flags/hk.svg);
}

.fi-hk.fis::before {
  content: url(../flags/1x1/hk.svg);
}

.fi-hm::before {
  content: url(../images/flags/hm.svg);
}

.fi-hm.fis::before {
  content: url(../flags/1x1/hm.svg);
}

.fi-hn::before {
  content: url(../images/flags/hn.svg);
}

.fi-hn.fis::before {
  content: url(../flags/1x1/hn.svg);
}

.fi-hr::before {
  content: url(../images/flags/hr.svg);
}

.fi-hr.fis::before {
  content: url(../flags/1x1/hr.svg);
}

.fi-ht::before {
  content: url(../images/flags/ht.svg);
}

.fi-ht.fis::before {
  content: url(../flags/1x1/ht.svg);
}

.fi-hu::before {
  content: url(../images/flags/hu.svg);
}

.fi-hu.fis::before {
  content: url(../flags/1x1/hu.svg);
}

.fi-id::before {
  content: url(../images/flags/id.svg);
}

.fi-id.fis::before {
  content: url(../flags/1x1/id.svg);
}

.fi-ie::before {
  content: url(../images/flags/ie.svg);
}

.fi-ie.fis::before {
  content: url(../flags/1x1/ie.svg);
}

.fi-il::before {
  content: url(../images/flags/il.svg);
}

.fi-il.fis::before {
  content: url(../flags/1x1/il.svg);
}

.fi-im::before {
  content: url(../images/flags/im.svg);
}

.fi-im.fis::before {
  content: url(../flags/1x1/im.svg);
}

.fi-in::before {
  content: url(../images/flags/in.svg);
}

.fi-in.fis::before {
  content: url(../flags/1x1/in.svg);
}

.fi-io::before {
  content: url(../images/flags/io.svg);
}

.fi-io.fis::before {
  content: url(../flags/1x1/io.svg);
}

.fi-iq::before {
  content: url(../images/flags/iq.svg);
}

.fi-iq.fis::before {
  content: url(../flags/1x1/iq.svg);
}

.fi-ir::before {
  content: url(../images/flags/ir.svg);
}

.fi-ir.fis::before {
  content: url(../flags/1x1/ir.svg);
}

.fi-is::before {
  content: url(../images/flags/is.svg);
}

.fi-is.fis::before {
  content: url(../flags/1x1/is.svg);
}

.fi-it::before {
  content: url(../images/flags/it.svg);
}

.fi-it.fis::before {
  content: url(../flags/1x1/it.svg);
}

.fi-je::before {
  content: url(../images/flags/je.svg);
}

.fi-je.fis::before {
  content: url(../flags/1x1/je.svg);
}

.fi-jm::before {
  content: url(../images/flags/jm.svg);
}

.fi-jm.fis::before {
  content: url(../flags/1x1/jm.svg);
}

.fi-jo::before {
  content: url(../images/flags/jo.svg);
}

.fi-jo.fis::before {
  content: url(../flags/1x1/jo.svg);
}

.fi-jp::before {
  content: url(../images/flags/jp.svg);
}

.fi-jp.fis::before {
  content: url(../flags/1x1/jp.svg);
}

.fi-ke::before {
  content: url(../images/flags/ke.svg);
}

.fi-ke.fis::before {
  content: url(../flags/1x1/ke.svg);
}

.fi-kg::before {
  content: url(../images/flags/kg.svg);
}

.fi-kg.fis::before {
  content: url(../flags/1x1/kg.svg);
}

.fi-kh::before {
  content: url(../images/flags/kh.svg);
}

.fi-kh.fis::before {
  content: url(../flags/1x1/kh.svg);
}

.fi-ki::before {
  content: url(../images/flags/ki.svg);
}

.fi-ki.fis::before {
  content: url(../flags/1x1/ki.svg);
}

.fi-km::before {
  content: url(../images/flags/km.svg);
}

.fi-km.fis::before {
  content: url(../flags/1x1/km.svg);
}

.fi-kn::before {
  content: url(../images/flags/kn.svg);
}

.fi-kn.fis::before {
  content: url(../flags/1x1/kn.svg);
}

.fi-kp::before {
  content: url(../images/flags/kp.svg);
}

.fi-kp.fis::before {
  content: url(../flags/1x1/kp.svg);
}

.fi-kr::before {
  content: url(../images/flags/kr.svg);
}

.fi-kr.fis::before {
  content: url(../flags/1x1/kr.svg);
}

.fi-kw::before {
  content: url(../images/flags/kw.svg);
}

.fi-kw.fis::before {
  content: url(../flags/1x1/kw.svg);
}

.fi-ky::before {
  content: url(../images/flags/ky.svg);
}

.fi-ky.fis::before {
  content: url(../flags/1x1/ky.svg);
}

.fi-kz::before {
  content: url(../images/flags/kz.svg);
}

.fi-kz.fis::before {
  content: url(../flags/1x1/kz.svg);
}

.fi-la::before {
  content: url(../images/flags/la.svg);
}

.fi-la.fis::before {
  content: url(../flags/1x1/la.svg);
}

.fi-lb::before {
  content: url(../images/flags/lb.svg);
}

.fi-lb.fis::before {
  content: url(../flags/1x1/lb.svg);
}

.fi-lc::before {
  content: url(../images/flags/lc.svg);
}

.fi-lc.fis::before {
  content: url(../flags/1x1/lc.svg);
}

.fi-li::before {
  content: url(../images/flags/li.svg);
}

.fi-li.fis::before {
  content: url(../flags/1x1/li.svg);
}

.fi-lk::before {
  content: url(../images/flags/lk.svg);
}

.fi-lk.fis::before {
  content: url(../flags/1x1/lk.svg);
}

.fi-lr::before {
  content: url(../images/flags/lr.svg);
}

.fi-lr.fis::before {
  content: url(../flags/1x1/lr.svg);
}

.fi-ls::before {
  content: url(../images/flags/ls.svg);
}

.fi-ls.fis::before {
  content: url(../flags/1x1/ls.svg);
}

.fi-lt::before {
  content: url(../images/flags/lt.svg);
}

.fi-lt.fis::before {
  content: url(../flags/1x1/lt.svg);
}

.fi-lu::before {
  content: url(../images/flags/lu.svg);
}

.fi-lu.fis::before {
  content: url(../flags/1x1/lu.svg);
}

.fi-lv::before {
  content: url(../images/flags/lv.svg);
}

.fi-lv.fis::before {
  content: url(../flags/1x1/lv.svg);
}

.fi-ly::before {
  content: url(../images/flags/ly.svg);
}

.fi-ly.fis::before {
  content: url(../flags/1x1/ly.svg);
}

.fi-ma::before {
  content: url(../images/flags/ma.svg);
}

.fi-ma.fis::before {
  content: url(../flags/1x1/ma.svg);
}

.fi-mc::before {
  content: url(../images/flags/mc.svg);
}

.fi-mc.fis::before {
  content: url(../flags/1x1/mc.svg);
}

.fi-md::before {
  content: url(../images/flags/md.svg);
}

.fi-md.fis::before {
  content: url(../flags/1x1/md.svg);
}

.fi-me::before {
  content: url(../images/flags/me.svg);
}

.fi-me.fis::before {
  content: url(../flags/1x1/me.svg);
}

.fi-mf::before {
  content: url(../images/flags/mf.svg);
}

.fi-mf.fis::before {
  content: url(../flags/1x1/mf.svg);
}

.fi-mg::before {
  content: url(../images/flags/mg.svg);
}

.fi-mg.fis::before {
  content: url(../flags/1x1/mg.svg);
}

.fi-mh::before {
  content: url(../images/flags/mh.svg);
}

.fi-mh.fis::before {
  content: url(../flags/1x1/mh.svg);
}

.fi-mk::before {
  content: url(../images/flags/mk.svg);
}

.fi-mk.fis::before {
  content: url(../flags/1x1/mk.svg);
}

.fi-ml::before {
  content: url(../images/flags/ml.svg);
}

.fi-ml.fis::before {
  content: url(../flags/1x1/ml.svg);
}

.fi-mm::before {
  content: url(../images/flags/mm.svg);
}

.fi-mm.fis::before {
  content: url(../flags/1x1/mm.svg);
}

.fi-mn::before {
  content: url(../images/flags/mn.svg);
}

.fi-mn.fis::before {
  content: url(../flags/1x1/mn.svg);
}

.fi-mo::before {
  content: url(../images/flags/mo.svg);
}

.fi-mo.fis::before {
  content: url(../flags/1x1/mo.svg);
}

.fi-mp::before {
  content: url(../images/flags/mp.svg);
}

.fi-mp.fis::before {
  content: url(../flags/1x1/mp.svg);
}

.fi-mq::before {
  content: url(../images/flags/mq.svg);
}

.fi-mq.fis::before {
  content: url(../flags/1x1/mq.svg);
}

.fi-mr::before {
  content: url(../images/flags/mr.svg);
}

.fi-mr.fis::before {
  content: url(../flags/1x1/mr.svg);
}

.fi-ms::before {
  content: url(../images/flags/ms.svg);
}

.fi-ms.fis::before {
  content: url(../flags/1x1/ms.svg);
}

.fi-mt::before {
  content: url(../images/flags/mt.svg);
}

.fi-mt.fis::before {
  content: url(../flags/1x1/mt.svg);
}

.fi-mu::before {
  content: url(../images/flags/mu.svg);
}

.fi-mu.fis::before {
  content: url(../flags/1x1/mu.svg);
}

.fi-mv::before {
  content: url(../images/flags/mv.svg);
}

.fi-mv.fis::before {
  content: url(../flags/1x1/mv.svg);
}

.fi-mw::before {
  content: url(../images/flags/mw.svg);
}

.fi-mw.fis::before {
  content: url(../flags/1x1/mw.svg);
}

.fi-mx::before {
  content: url(../images/flags/mx.svg);
}

.fi-mx.fis::before {
  content: url(../flags/1x1/mx.svg);
}

.fi-my::before {
  content: url(../images/flags/my.svg);
}

.fi-my.fis::before {
  content: url(../flags/1x1/my.svg);
}

.fi-mz::before {
  content: url(../images/flags/mz.svg);
}

.fi-mz.fis::before {
  content: url(../flags/1x1/mz.svg);
}

.fi-na::before {
  content: url(../images/flags/na.svg);
}

.fi-na.fis::before {
  content: url(../flags/1x1/na.svg);
}

.fi-nc::before {
  content: url(../images/flags/nc.svg);
}

.fi-nc.fis::before {
  content: url(../flags/1x1/nc.svg);
}

.fi-ne::before {
  content: url(../images/flags/ne.svg);
}

.fi-ne.fis::before {
  content: url(../flags/1x1/ne.svg);
}

.fi-nf::before {
  content: url(../images/flags/nf.svg);
}

.fi-nf.fis::before {
  content: url(../flags/1x1/nf.svg);
}

.fi-ng::before {
  content: url(../images/flags/ng.svg);
}

.fi-ng.fis::before {
  content: url(../flags/1x1/ng.svg);
}

.fi-ni::before {
  content: url(../images/flags/ni.svg);
}

.fi-ni.fis::before {
  content: url(../flags/1x1/ni.svg);
}

.fi-nl::before {
  content: url(../images/flags/nl.svg);
}

.fi-nl.fis::before {
  content: url(../flags/1x1/nl.svg);
}

.fi-no::before {
  content: url(../images/flags/no.svg);
}

.fi-no.fis::before {
  content: url(../flags/1x1/no.svg);
}

.fi-np::before {
  content: url(../images/flags/np.svg);
}

.fi-np.fis::before {
  content: url(../flags/1x1/np.svg);
}

.fi-nr::before {
  content: url(../images/flags/nr.svg);
}

.fi-nr.fis::before {
  content: url(../flags/1x1/nr.svg);
}

.fi-nu::before {
  content: url(../images/flags/nu.svg);
}

.fi-nu.fis::before {
  content: url(../flags/1x1/nu.svg);
}

.fi-nz::before {
  content: url(../images/flags/nz.svg);
}

.fi-nz.fis::before {
  content: url(../flags/1x1/nz.svg);
}

.fi-om::before {
  content: url(../images/flags/om.svg);
}

.fi-om.fis::before {
  content: url(../flags/1x1/om.svg);
}

.fi-pa::before {
  content: url(../images/flags/pa.svg);
}

.fi-pa.fis::before {
  content: url(../flags/1x1/pa.svg);
}

.fi-pe::before {
  content: url(../images/flags/pe.svg);
}

.fi-pe.fis::before {
  content: url(../flags/1x1/pe.svg);
}

.fi-pf::before {
  content: url(../images/flags/pf.svg);
}

.fi-pf.fis::before {
  content: url(../flags/1x1/pf.svg);
}

.fi-pg::before {
  content: url(../images/flags/pg.svg);
}

.fi-pg.fis::before {
  content: url(../flags/1x1/pg.svg);
}

.fi-ph::before {
  content: url(../images/flags/ph.svg);
}

.fi-ph.fis::before {
  content: url(../flags/1x1/ph.svg);
}

.fi-pk::before {
  content: url(../images/flags/pk.svg);
}

.fi-pk.fis::before {
  content: url(../flags/1x1/pk.svg);
}

.fi-pl::before {
  content: url(../images/flags/pl.svg);
}

.fi-pl.fis::before {
  content: url(../flags/1x1/pl.svg);
}

.fi-pm::before {
  content: url(../images/flags/pm.svg);
}

.fi-pm.fis::before {
  content: url(../flags/1x1/pm.svg);
}

.fi-pn::before {
  content: url(../images/flags/pn.svg);
}

.fi-pn.fis::before {
  content: url(../flags/1x1/pn.svg);
}

.fi-pr::before {
  content: url(../images/flags/pr.svg);
}

.fi-pr.fis::before {
  content: url(../flags/1x1/pr.svg);
}

.fi-ps::before {
  content: url(../images/flags/ps.svg);
}

.fi-ps.fis::before {
  content: url(../flags/1x1/ps.svg);
}

.fi-pt::before {
  content: url(../images/flags/pt.svg);
}

.fi-pt.fis::before {
  content: url(../flags/1x1/pt.svg);
}

.fi-pw::before {
  content: url(../images/flags/pw.svg);
}

.fi-pw.fis::before {
  content: url(../flags/1x1/pw.svg);
}

.fi-py::before {
  content: url(../images/flags/py.svg);
}

.fi-py.fis::before {
  content: url(../flags/1x1/py.svg);
}

.fi-qa::before {
  content: url(../images/flags/qa.svg);
}

.fi-qa.fis::before {
  content: url(../flags/1x1/qa.svg);
}

.fi-re::before {
  content: url(../images/flags/re.svg);
}

.fi-re.fis::before {
  content: url(../flags/1x1/re.svg);
}

.fi-ro::before {
  content: url(../images/flags/ro.svg);
}

.fi-ro.fis::before {
  content: url(../flags/1x1/ro.svg);
}

.fi-rs::before {
  content: url(../images/flags/rs.svg);
}

.fi-rs.fis::before {
  content: url(../flags/1x1/rs.svg);
}

.fi-ru::before {
  content: url(../images/flags/ru.svg);
}

.fi-ru.fis::before {
  content: url(../flags/1x1/ru.svg);
}

.fi-rw::before {
  content: url(../images/flags/rw.svg);
}

.fi-rw.fis::before {
  content: url(../flags/1x1/rw.svg);
}

.fi-sa::before {
  content: url(../images/flags/sa.svg);
}

.fi-sa.fis::before {
  content: url(../flags/1x1/sa.svg);
}

.fi-sb::before {
  content: url(../images/flags/sb.svg);
}

.fi-sb.fis::before {
  content: url(../flags/1x1/sb.svg);
}

.fi-sc::before {
  content: url(../images/flags/sc.svg);
}

.fi-sc.fis::before {
  content: url(../flags/1x1/sc.svg);
}

.fi-sd::before {
  content: url(../images/flags/sd.svg);
}

.fi-sd.fis::before {
  content: url(../flags/1x1/sd.svg);
}

.fi-se::before {
  content: url(../images/flags/se.svg);
}

.fi-se.fis::before {
  content: url(../flags/1x1/se.svg);
}

.fi-sg::before {
  content: url(../images/flags/sg.svg);
}

.fi-sg.fis::before {
  content: url(../flags/1x1/sg.svg);
}

.fi-sh::before {
  content: url(../images/flags/sh.svg);
}

.fi-sh.fis::before {
  content: url(../flags/1x1/sh.svg);
}

.fi-si::before {
  content: url(../images/flags/si.svg);
}

.fi-si.fis::before {
  content: url(../flags/1x1/si.svg);
}

.fi-sj::before {
  content: url(../images/flags/sj.svg);
}

.fi-sj.fis::before {
  content: url(../flags/1x1/sj.svg);
}

.fi-sk::before {
  content: url(../images/flags/sk.svg);
}

.fi-sk.fis::before {
  content: url(../flags/1x1/sk.svg);
}

.fi-sl::before {
  content: url(../images/flags/sl.svg);
}

.fi-sl.fis::before {
  content: url(../flags/1x1/sl.svg);
}

.fi-sm::before {
  content: url(../images/flags/sm.svg);
}

.fi-sm.fis::before {
  content: url(../flags/1x1/sm.svg);
}

.fi-sn::before {
  content: url(../images/flags/sn.svg);
}

.fi-sn.fis::before {
  content: url(../flags/1x1/sn.svg);
}

.fi-so::before {
  content: url(../images/flags/so.svg);
}

.fi-so.fis::before {
  content: url(../flags/1x1/so.svg);
}

.fi-sr::before {
  content: url(../images/flags/sr.svg);
}

.fi-sr.fis::before {
  content: url(../flags/1x1/sr.svg);
}

.fi-ss::before {
  content: url(../images/flags/ss.svg);
}

.fi-ss.fis::before {
  content: url(../flags/1x1/ss.svg);
}

.fi-st::before {
  content: url(../images/flags/st.svg);
}

.fi-st.fis::before {
  content: url(../flags/1x1/st.svg);
}

.fi-sv::before {
  content: url(../images/flags/sv.svg);
}

.fi-sv.fis::before {
  content: url(../flags/1x1/sv.svg);
}

.fi-sx::before {
  content: url(../images/flags/sx.svg);
}

.fi-sx.fis::before {
  content: url(../flags/1x1/sx.svg);
}

.fi-sy::before {
  content: url(../images/flags/sy.svg);
}

.fi-sy.fis::before {
  content: url(../flags/1x1/sy.svg);
}

.fi-sz::before {
  content: url(../images/flags/sz.svg);
}

.fi-sz.fis::before {
  content: url(../flags/1x1/sz.svg);
}

.fi-tc::before {
  content: url(../images/flags/tc.svg);
}

.fi-tc.fis::before {
  content: url(../flags/1x1/tc.svg);
}

.fi-td::before {
  content: url(../images/flags/td.svg);
}

.fi-td.fis::before {
  content: url(../flags/1x1/td.svg);
}

.fi-tf::before {
  content: url(../images/flags/tf.svg);
}

.fi-tf.fis::before {
  content: url(../flags/1x1/tf.svg);
}

.fi-tg::before {
  content: url(../images/flags/tg.svg);
}

.fi-tg.fis::before {
  content: url(../flags/1x1/tg.svg);
}

.fi-th::before {
  content: url(../images/flags/th.svg);
}

.fi-th.fis::before {
  content: url(../flags/1x1/th.svg);
}

.fi-tj::before {
  content: url(../images/flags/tj.svg);
}

.fi-tj.fis::before {
  content: url(../flags/1x1/tj.svg);
}

.fi-tk::before {
  content: url(../images/flags/tk.svg);
}

.fi-tk.fis::before {
  content: url(../flags/1x1/tk.svg);
}

.fi-tl::before {
  content: url(../images/flags/tl.svg);
}

.fi-tl.fis::before {
  content: url(../flags/1x1/tl.svg);
}

.fi-tm::before {
  content: url(../images/flags/tm.svg);
}

.fi-tm.fis::before {
  content: url(../flags/1x1/tm.svg);
}

.fi-tn::before {
  content: url(../images/flags/tn.svg);
}

.fi-tn.fis::before {
  content: url(../flags/1x1/tn.svg);
}

.fi-to::before {
  content: url(../images/flags/to.svg);
}

.fi-to.fis::before {
  content: url(../flags/1x1/to.svg);
}

.fi-tr::before {
  content: url(../images/flags/tr.svg);
}

.fi-tr.fis::before {
  content: url(../flags/1x1/tr.svg);
}

.fi-tt::before {
  content: url(../images/flags/tt.svg);
}

.fi-tt.fis::before {
  content: url(../flags/1x1/tt.svg);
}

.fi-tv::before {
  content: url(../images/flags/tv.svg);
}

.fi-tv.fis::before {
  content: url(../flags/1x1/tv.svg);
}

.fi-tw::before {
  content: url(../images/flags/tw.svg);
}

.fi-tw.fis::before {
  content: url(../flags/1x1/tw.svg);
}

.fi-tz::before {
  content: url(../images/flags/tz.svg);
}

.fi-tz.fis::before {
  content: url(../flags/1x1/tz.svg);
}

.fi-ua::before {
  content: url(../images/flags/ua.svg);
}

.fi-ua.fis::before {
  content: url(../flags/1x1/ua.svg);
}

.fi-ug::before {
  content: url(../images/flags/ug.svg);
}

.fi-ug.fis::before {
  content: url(../flags/1x1/ug.svg);
}

.fi-um::before {
  content: url(../images/flags/um.svg);
}

.fi-um.fis::before {
  content: url(../flags/1x1/um.svg);
}

.fi-us::before {
  content: url(../images/flags/us.svg);
}

.fi-us.fis::before {
  content: url(../flags/1x1/us.svg);
}

.fi-uy::before {
  content: url(../images/flags/uy.svg);
}

.fi-uy.fis::before {
  content: url(../flags/1x1/uy.svg);
}

.fi-uz::before {
  content: url(../images/flags/uz.svg);
}

.fi-uz.fis::before {
  content: url(../flags/1x1/uz.svg);
}

.fi-va::before {
  content: url(../images/flags/va.svg);
}

.fi-va.fis::before {
  content: url(../flags/1x1/va.svg);
}

.fi-vc::before {
  content: url(../images/flags/vc.svg);
}

.fi-vc.fis::before {
  content: url(../flags/1x1/vc.svg);
}

.fi-ve::before {
  content: url(../images/flags/ve.svg);
}

.fi-ve.fis::before {
  content: url(../flags/1x1/ve.svg);
}

.fi-vg::before {
  content: url(../images/flags/vg.svg);
}

.fi-vg.fis::before {
  content: url(../flags/1x1/vg.svg);
}

.fi-vi::before {
  content: url(../images/flags/vi.svg);
}

.fi-vi.fis::before {
  content: url(../flags/1x1/vi.svg);
}

.fi-vn::before {
  content: url(../images/flags/vn.svg);
}

.fi-vn.fis::before {
  content: url(../flags/1x1/vn.svg);
}

.fi-vu::before {
  content: url(../images/flags/vu.svg);
}

.fi-vu.fis::before {
  content: url(../flags/1x1/vu.svg);
}

.fi-wf::before {
  content: url(../images/flags/wf.svg);
}

.fi-wf.fis::before {
  content: url(../flags/1x1/wf.svg);
}

.fi-ws::before {
  content: url(../images/flags/ws.svg);
}

.fi-ws.fis::before {
  content: url(../flags/1x1/ws.svg);
}

.fi-ye::before {
  content: url(../images/flags/ye.svg);
}

.fi-ye.fis::before {
  content: url(../flags/1x1/ye.svg);
}

.fi-yt::before {
  content: url(../images/flags/yt.svg);
}

.fi-yt.fis::before {
  content: url(../flags/1x1/yt.svg);
}

.fi-za::before {
  content: url(../images/flags/za.svg);
}

.fi-za.fis::before {
  content: url(../flags/1x1/za.svg);
}

.fi-zm::before {
  content: url(../images/flags/zm.svg);
}

.fi-zm.fis::before {
  content: url(../flags/1x1/zm.svg);
}

.fi-zw::before {
  content: url(../images/flags/zw.svg);
}

.fi-zw.fis::before {
  content: url(../flags/1x1/zw.svg);
}

.fi-arab::before {
  content: url(../images/flags/arab.svg);
}

.fi-arab.fis::before {
  content: url(../flags/1x1/arab.svg);
}

.fi-cefta::before {
  content: url(../images/flags/cefta.svg);
}

.fi-cefta.fis::before {
  content: url(../flags/1x1/cefta.svg);
}

.fi-cp::before {
  content: url(../images/flags/cp.svg);
}

.fi-cp.fis::before {
  content: url(../flags/1x1/cp.svg);
}

.fi-dg::before {
  content: url(../images/flags/dg.svg);
}

.fi-dg.fis::before {
  content: url(../flags/1x1/dg.svg);
}

.fi-eac::before {
  content: url(../images/flags/eac.svg);
}

.fi-eac.fis::before {
  content: url(../flags/1x1/eac.svg);
}

.fi-es-ct::before {
  content: url(../images/flags/es-ct.svg);
}

.fi-es-ct.fis::before {
  content: url(../flags/1x1/es-ct.svg);
}

.fi-es-ga::before {
  content: url(../images/flags/es-ga.svg);
}

.fi-es-ga.fis::before {
  content: url(../flags/1x1/es-ga.svg);
}

.fi-es-pv::before {
  content: url(../images/flags/es-pv.svg);
}

.fi-es-pv.fis::before {
  content: url(../flags/1x1/es-pv.svg);
}

.fi-eu::before {
  content: url(../images/flags/eu.svg);
}

.fi-eu.fis::before {
  content: url(../flags/1x1/eu.svg);
}

.fi-gb-eng::before {
  content: url(../images/flags/gb-eng.svg);
}

.fi-gb-eng.fis::before {
  content: url(../flags/1x1/gb-eng.svg);
}

.fi-gb-nir::before {
  content: url(../images/flags/gb-nir.svg);
}

.fi-gb-nir.fis::before {
  content: url(../flags/1x1/gb-nir.svg);
}

.fi-gb-sct::before {
  content: url(../images/flags/gb-sct.svg);
}

.fi-gb-sct.fis::before {
  content: url(../flags/1x1/gb-sct.svg);
}

.fi-gb-wls::before {
  content: url(../images/flags/gb-wls.svg);
}

.fi-gb-wls.fis::before {
  content: url(../flags/1x1/gb-wls.svg);
}

.fi-ic::before {
  content: url(../images/flags/ic.svg);
}

.fi-ic.fis::before {
  content: url(../flags/1x1/ic.svg);
}

.fi-pc::before {
  content: url(../images/flags/pc.svg);
}

.fi-pc.fis::before {
  content: url(../flags/1x1/pc.svg);
}

.fi-sh-ac::before {
  content: url(../images/flags/sh-ac.svg);
}

.fi-sh-ac.fis::before {
  content: url(../flags/1x1/sh-ac.svg);
}

.fi-sh-hl::before {
  content: url(../images/flags/sh-hl.svg);
}

.fi-sh-hl.fis::before {
  content: url(../flags/1x1/sh-hl.svg);
}

.fi-sh-ta::before {
  content: url(../images/flags/sh-ta.svg);
}

.fi-sh-ta.fis::before {
  content: url(../flags/1x1/sh-ta.svg);
}

.fi-un::before {
  content: url(../images/flags/un.svg);
}

.fi-un.fis::before {
  content: url(../flags/1x1/un.svg);
}

.fi-xk::before {
  content: url(../images/flags/xk.svg);
}

.fi-xk.fis::before {
  content: url(../flags/1x1/xk.svg);
}
.d-block{
  display: block;
}
.m-auto{
  margin: auto;
}
.mb-0{
  margin-bottom: 0 !important;
}
.mt-0{
  margin-top: 0 !important;
}
.mb-8{
  margin-bottom: 8px;
}
#allWrap {
  position: relative;
  width: 100%;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  justify-items: stretch;
  padding-left: 300px;
  transition: padding 0.3s ease-in-out;
}

#allWrap.registerLogin {
  background-color: white;
  padding-left: 0;
  flex-direction: row;
  padding: var(--gap);
}

#allWrap.registerLogin>[data-grid] {
  width: 100%;
}

#allWrap.registerLogin>[data-grid] .col:first-child {
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 1039px) {
  #allWrap.registerLogin>[data-grid] {
    grid-template-columns: 1fr;
  }

  #allWrap.registerLogin>[data-grid] .col:last-child {
    display: none;
  }

  #allWrap.registerLogin>[data-grid] [data-width="6"] {
    grid-column: span 1;
  }
}

@media (max-width: 349px) {
  #allWrap.registerLogin form p[data-horizontal][data-horizontal*=space] {
    font-size: 14px;
    align-items: center;
  }
}

#sidebar {
  min-width: 300px;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  border-right: solid 1px rgba(var(--color-border), 0.24);
  overflow: auto;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

#sidebar .sidebar-content {
  /* height: calc(100% - 35px); */
  overflow: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}

#sidebar .sidebar-content .sidebar-content-data {
  height: 100%;
  display: flex;
  flex-direction: column;
}

#theContent {
  width: 100%;
  min-height: 100%;
  flex: 1;
  padding: var(--gutter);
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: var(--gap);
  position: relative;
  align-items: start;
}

#theContent #pageContent {
  display: flex;
  flex-direction: column;
  gap: var(--gap);
}

#theContent #pageContent[data-grid] {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: var(--gap);
}

#theContent #pageContent[data-grid] [data-width="2"] {
  grid-column: span 2;
}

#theContent #pageContent[data-grid] [data-width="3"] {
  grid-column: span 3;
}

#theContent #pageContent[data-grid] [data-width="4"] {
  grid-column: span 4;
}

#theContent #pageContent[data-grid] [data-width="5"] {
  grid-column: span 5;
}

#theContent #pageContent[data-grid] [data-width="6"] {
  grid-column: span 6;
}

#theContent #pageContent[data-grid] [data-width="7"] {
  grid-column: span 7;
}

#theContent #pageContent[data-grid] [data-width="8"] {
  grid-column: span 8;
}

#theContent #pageContent[data-grid] [data-width="9"] {
  grid-column: span 9;
}

#theContent #pageContent[data-grid] [data-width="10"] {
  grid-column: span 10;
}

#theContent #pageContent[data-grid] [data-width="11"] {
  grid-column: span 11;
}

#theContent #pageContent[data-grid] [data-width="12"] {
  grid-column: span 12;
}

#theContent #pageContent[data-grid] [data-flex] {
  display: flex;
  gap: var(--gap);
}

#theContent #pageContent[data-grid] [data-flex][data-flex=column] {
  flex-direction: column;
}

.notifications {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: calc(var(--gap) / 3);
  padding: var(--gap) var(--gutter) 0;
}

[data-grid] {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: var(--gap);
}

[data-grid] [data-width="2"] {
  grid-column: span 2;
}

[data-grid] [data-width="3"] {
  grid-column: span 3;
}

[data-grid] [data-width="4"] {
  grid-column: span 4;
}

[data-grid] [data-width="5"] {
  grid-column: span 5;
}

[data-grid] [data-width="6"] {
  grid-column: span 6;
}

[data-grid] [data-width="7"] {
  grid-column: span 7;
}

[data-grid] [data-width="8"] {
  grid-column: span 8;
}

[data-grid] [data-width="9"] {
  grid-column: span 9;
}

[data-grid] [data-width="10"] {
  grid-column: span 10;
}

[data-grid] [data-width="11"] {
  grid-column: span 11;
}

[data-grid] [data-width="12"] {
  grid-column: span 12;
}

[data-grid] [data-flex] {
  display: flex;
  gap: var(--gap);
}

[data-grid] [data-flex][data-flex=column] {
  flex-direction: column;
}

@media (max-width: 880px) {
  [data-grid] [data-width="9"] {
    grid-column: span 12;
  }
}

#allWrap #sidebar {
  position: fixed;
  z-index: 11;
  left: 0;
  top: 0;
  transition: left 0.2s ease-in-out;
  background-color: rgba(var(--color-background));
}

@media (max-width: 1275px) {
  #allWrap {
    padding-left: 0;
    transition: padding 0.3s ease-in-out;
  }

  #allWrap #sidebar {
    left: -100%;
    transition: left 0.3s ease-in-out;
  }

  #allWrap #sidebar.active {
    --width-sidebar: 270px;
    left: 0;
  }
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  padding: 0;
}

h2,
h3,
h4,
h5 {
  font-weight: 600;
}

h1 {
  font-size: 2.25rem;
}

h2 {
  font-size: 1.875rem;
}

h3 {
  font-size: 1.6rem;
}

h4 {
  font-size: 1.312rem;
}

h5 {
  font-size: 1.1rem;
}

p {
  margin: 0;
  padding: 0;
}

b {
  font-weight: 600;
}

[data-text*=small] {
  font-size: 0.8125rem;
}

[data-text*=grey] {
  color: rgb(var(--color-border));
}

ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none;
  text-align: left;
}

ol {
  counter-reset: item;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

ol li {
  display: flex;
  flex-direction: row;
  gap: 5px;
}

ol li::before {
  counter-increment: item;
  content: counter(item, decimal-leading-zero);
  color: rgb(var(--color-border));
}

a {
  color: inherit;
  text-decoration: none;
}

a.delete {
  color: rgb(var(--color-alert-disclaimer));
  display: inline-flex;
  flex-direction: row;
  gap: calc(var(--gap) / 3);
}

a.delete::after {
  content: var(--icon-trash);
}
a.edit::after {
  content: var(--icon-edit);
}
a.link-text{
  color: rgb(var(--color-button));
  text-decoration: underline;
}
form {
  display: flex;
  flex-direction: column;
  gap: calc(var(--gap));
  margin: 0;
}

form p {
  width: 100%;
  display: flex;
  flex-direction: column;
  row-gap: calc(var(--gap) / 4);
}

form p[data-horizontal] {
  flex-direction: row;
}

form p[data-horizontal][data-horizontal*=space] {
  justify-content: space-between;
}

input:not([type=range], [type=checkbox], [type=radio]) {
  appearance: none;
  width: 100%;
  border: none;
  min-height: 40px;
  border-radius: 50px;
  font-family: "Gordita", sans-serif;
  font-size: 0.875rem;
  color: rgb(var(--color-text), 1);
  box-shadow: none;
  outline: 0;
  padding: 12px calc(var(--gap) / 2);
}

input:not([type=range], [type=checkbox], [type=radio])::placeholder {
  color: rgba(var(--color-text), 0.36);
}

input:not([type=range], [type=checkbox], [type=radio]):not(input[type=submit]) {
  border: solid 1px rgba(var(--color-border), 0.5);
}

input:not([type=range], [type=checkbox], [type=radio]):not(input[type=submit]):focus,
input:not([type=range], [type=checkbox], [type=radio]):not(input[type=submit]):focus-within {
  appearance: none;
  border: solid 1px rgba(var(--color-border), 1);
}

input:not([type=range], [type=checkbox], [type=radio]):not(input[type=submit]):focus::placeholder,
input:not([type=range], [type=checkbox], [type=radio]):not(input[type=submit]):focus-within::placeholder {
  opacity: 0;
}

.inputWrap input:not([type=range], [type=checkbox], [type=radio]):not(input[type=submit]) {
  border: none;
  min-height: auto;
  padding: 0;
  border-radius: 0;
}

input:not([type=range], [type=checkbox], [type=radio])[type=submit] {
  background-color: rgb(var(--color-button));
  font-weight: 600;
  font-size: 0.875rem;
  color: rgb(var(--color-text-inverse));
  justify-content: center;
}

input:not([type=range], [type=checkbox], [type=radio])[type=submit]:hover {
  cursor: pointer;
}

input:not([type=range], [type=checkbox], [type=radio])[type=submit][data-props*=outline] {
  border: solid 1px rgba(var(--color-border), 0.5);
  background-color: transparent;
  color: rgb(var(--color-text));
}

input:not([type=range], [type=checkbox], [type=radio])[data-icon],
input:not([type=range], [type=checkbox], [type=radio])[type=search] {
  background-repeat: no-repeat;
  background-position: center left calc(var(--gap) / 2);
  padding-left: calc(var(--gap) + 10px);
}

input:not([type=range], [type=checkbox], [type=radio])[data-icon][data-icon=user],
input:not([type=range], [type=checkbox], [type=radio])[type=search][data-icon=user] {
  background-image: url(../images/icons/icon-user.svg);
}

input:not([type=range], [type=checkbox], [type=radio])[data-icon][data-icon=mail],
input:not([type=range], [type=checkbox], [type=radio])[type=search][data-icon=mail] {
  background-image: url(../images/icons/icon-mail.svg);
}

input:not([type=range], [type=checkbox], [type=radio])[data-icon][data-icon=password],
input:not([type=range], [type=checkbox], [type=radio])[type=search][data-icon=password] {
  background-image: url(../images/icons/icon-password.svg);
}

input:not([type=range], [type=checkbox], [type=radio])[data-icon][data-icon=globe],
input:not([type=range], [type=checkbox], [type=radio])[type=search][data-icon=globe] {
  background-image: url(../images/icons/icon-globe-grey.svg);
}

input:not([type=range], [type=checkbox], [type=radio])[type=number] {
  -moz-appearance: textfield;
}

input:not([type=range], [type=checkbox], [type=radio])[type=number]::-webkit-outer-spin-button,
input:not([type=range], [type=checkbox], [type=radio])[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type=checkbox] {
  position: relative;
  appearance: none;
  width: 16px;
  height: 16px;
  border: solid 1px rgba(var(--color-border), 0.5);
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
}

input[type=checkbox]:hover {
  cursor: pointer;
  background-color: rgba(var(--color-border), 0.12);
}

input[type=checkbox]:checked {
  background-color: rgb(var(--color-button));
  border: solid 1px rgb(var(--color-button));
}

input[type=checkbox]:checked::before {
  border-radius: 2px;
  content: '';
  display: block;
  position: absolute;
  top: 0px;
  left: 4px;
  width: 5px;
  height: 9px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

input[type=checkbox][data-input=switch] {
  width: 48px;
  height: 24px;
  min-width: 48px;
  max-width: 48px;
  border-radius: 12px;
  padding: 2px;
  background-color: rgba(var(--color-border), 0.24);
  border: none;
  transition: all 0.15s ease;
}

input[type=checkbox][data-input=switch]::before {
  content: "";
  width: 20px;
  height: 20px;
  border-radius: 10px;
  background-color: rgb(var(--color-text-inverse));
  position: absolute;
  top: 50%;
  left: 2px;
  transform: translateY(-50%);
  transition: all 0.15s ease;
}

input[type=checkbox][data-input=switch]:checked {
  background-color: rgb(var(--color-button));
  transition: all 0.15s ease;
}

input[type=checkbox][data-input=switch]:checked::before {
  left: 26px;
  transition: all 0.15s ease;
}

input[type=radio] {
  position: relative;
  appearance: none;
  width: 16px;
  height: 16px;
  min-height: auto;
  padding: 0;
  border: solid 1px rgba(var(--color-border), 0.5);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}

input[type=radio]:hover {
  cursor: pointer;
  background-color: rgba(var(--color-border), 0.12);
}

input[type=radio]:checked {
  background-color: rgb(var(--color-button));
  border: solid 1px rgb(var(--color-button));
}

input[type=radio]:checked::before {
  content: "";
  width: 8px;
  height: 8px;
  background-color: rgb(var(--color-text-inverse));
  border-radius: 6px;
}

input[type=search] {
  background-image: url(../images/icons/icon-search-s.svg);
}

input[type=range] {
  -webkit-appearance: none;
  padding: 0;
  appearance: none;
  width: 200px;
  max-width: 200px;
  cursor: pointer;
  outline: none;
  border-radius: 15px;
  height: 4px;
  min-height: auto;
  background: rgba(var(--color-border), 0.24);
}

input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  height: 12px;
  width: 12px;
  background-color: rgb(var(--color-widget-savings));
  border-radius: 50%;
  border: none;
  transition: 0.2s ease-in-out;
}

input[type=range]::-webkit-slider-thumb:hover {
  box-shadow: 0 0 0 5px rgba(var(--color-button), 0.2);
}

input[type=range]::-moz-range-thumb {
  height: 12px;
  width: 12px;
  background-color: rgb(var(--color-widget-savings));
  border-radius: 50%;
  border: none;
  transition: 0.2s ease-in-out;
}

input[type=range]::-moz-range-thumb:hover {
  box-shadow: 0 0 0 5px rgba(var(--color-button), 0.2);
}

input[type=range]:active::-webkit-slider-thumb {
  box-shadow: 0 0 0 5px rgba(var(--color-widget-savings), 0.2);
}

input[type=range]:active::-moz-range-thumb {
  box-shadow: 0 0 0 5px rgba(var(--color-widget-savings), 0.2);
}

button {
  border: 1px solid transparent;
  min-height: 40px;
  min-width: 90px;
  padding: 0.75rem 1.25rem 0.625rem 1.25rem;
  border-radius: 50px;
  font-family: "Gordita", sans-serif;
  font-size: 0.875rem;
  display: flex;
  flex-direction: row;
  gap: calc(var(--gap) / 2);
  align-items: center;
  justify-items: center;
  appearance: none;
  background-color: rgb(var(--color-button));
  font-weight: 600;
  font-size: 0.875rem;
  color: rgb(var(--color-text-inverse));
  justify-content: center;
  align-self: start;
}
button:disabled{
  background-color: rgb(156 163 175);
  opacity: 0.5;
  cursor: not-allowed;
}

button:hover {
  cursor: pointer;
}

button[data-button=outline] {
  border: solid 1px rgba(var(--color-border), 0.5);
  background-color: transparent;
  color: rgb(var(--color-text));
}

button[data-button=outline][data-icon=google]::before {
  content: url(../images/icons/icon-google.svg);
}
button[data-button=outline][data-icon=facebook]::before {
  content: url(../images/icons/facebook.svg);
}

button[data-button=inactive] {
  color: rgb(var(--color-button-inactive-text));
  background-color: rgba(var(--color-button-inactive), 0.15);
}

button[data-button*=red] {
  background-color: rgb(var(--color-label-red));
}

button[data-button*=red][data-button*=outline] {
  background-color: transparent;
  border: solid 1px rgb(var(--color-label-red));
  color: rgb(var(--color-label-red));
}

button[data-button*=green] {
  background-color: rgb(var(--color-label-green));
}

button:disabled:hover {
  cursor: default;
}

label {
  display: flex;
  flex-direction: row;
  gap: 5px;
  align-items: center;
  font-size: 13px;
  font-weight: 600;
  color: rgb(var(--color-header-text));
  margin-bottom: 4px;
}

select {
  appearance: none;
  width: 100%;
  border: none;
  min-height: 40px;
  border-radius: 50px;
  font-family: "Gordita", sans-serif;
  font-size: 0.875rem;
  color: rgb(var(--color-text), 1);
  box-shadow: none;
  outline: 0;
  padding: 12px 35px 12px calc(var(--gap) / 2);
  border: solid 1px rgba(var(--color-border), 0.5);
  background-image: url("../images/icons/icon-arrow-select.svg");
  background-repeat: no-repeat;
  background-position: center right calc(var(--gap) / 2);
}
select.overflow-ellipsis{
    max-width: 170px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
textarea {
  appearance: none;
  width: 100%;
  border: none;
  border-radius: 1rem;
  font-family: "Gordita", sans-serif;
  font-size: 0.875rem;
  color: rgb(var(--color-text), 1);
  box-shadow: none;
  outline: 0;
  border: solid 1px rgba(var(--color-border), 0.5);
  padding: calc(var(--gap) / 2);
  min-height: 110px;
  overflow: auto;
  resize: none;
}

.inputWrap {
  padding: 12px calc(var(--gap) / 2);
  border: solid 1px rgba(var(--color-border), 0.5);
  display: flex;
  flex-direction: row;
  gap: calc(var(--gap) / 3);
  min-height: 40px;
  border-radius: 50px;
}

table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
  font-weight: 400;
}

table thead tr:last-child td {
  border-bottom: none;
}

table tr {
  padding-left: 20px;
  padding-right: 20px;
  flex-wrap: nowrap !important;
}

table tr th {
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  color: rgb(var(--color-header-text));
  background-color: rgb(var(--color-tHead));
  text-align: left;
  letter-spacing: 0.3;
  height: 3rem;
  padding: 8px;
}

table th:nth-of-type(1) {
  border-radius: var(--radius) 0 0 var(--radius);
  /* padding-left: 20px; */
}

table th:nth-last-of-type(1) {
  border-radius: 0 var(--radius) var(--radius) 0;
  text-align: center;
  padding-right: 20px;
}

table td {
  padding: 20px 4px;
  border-bottom: solid 1px rgba(var(--color-border), 0.15);
}

table td:nth-last-of-type(1) {
  padding-right: 20px;
}

table td[data-type=error] {
  color: rgb(var(--color-alert-disclaimer));
}

table th:nth-last-child(1),
table td:nth-last-child(1) {
  text-align: right;
}

table[data-table*=last-blue] tbody td:nth-last-child(1) {
  color: rgb(var(--color-button));
}

.button {
  border: none;
  min-height: 40px;
  min-width: 90px;
  padding: 0.625rem 1.25rem;
  border-radius: 50px;
  font-family: "Gordita", sans-serif;
  font-size: 0.875rem;
  display: inline-flex;
  flex-direction: row;
  gap: calc(var(--gap) / 2);
  align-items: center;
  justify-items: center;
  appearance: none;
  background-color: rgb(var(--color-button));
  font-weight: 600;
  font-size: 0.875rem;
  color: rgb(var(--color-text-inverse));
  justify-content: center;
}

.button:hover {
  cursor: pointer;
}

.button[data-button*=outline] {
  border: solid 1px rgba(var(--color-border), 0.5);
  background-color: transparent;
  color: rgb(var(--color-text));
}

.button[data-button=inactive] {
  color: rgb(var(--color-button-inactive-text));
  background-color: rgba(var(--color-button-inactive), 0.15);
}

.button[data-button=download] {
  padding: 0;
  margin: 0;
  width: auto;
  min-width: auto;
  min-height: auto;
  background-color: transparent;
}

.button[data-button=download]::before {
  content: url(../images/icons/icon-download.svg);
}

.button[data-button*=icon] {
  min-width: auto;
  min-height: auto;
  width: 40px;
  height: 40px;
  padding: 0;
}

.button[data-icon=google]::before {
  content: url(../images/icons/icon-google.svg);
}

.button[data-icon=arrowBack]::before {
  content: url(../images/icons/icon-back.svg);
  line-height: 9px;
}

button:focus {
  box-shadow: none !important;
}

.clickThreshold {
  border-spacing: calc(var(--gap) / 3);
  border-collapse: initial;
  font-size: 0.875rem;
  padding: calc(var(--gap) / 3);
  border: solid 1px rgba(var(--color-border), 0.24);
  border-radius: var(--radius);
}

li .clickThreshold {
  margin-top: calc(var(--gap) / 2);
}

.clickThreshold th,
.clickThreshold td {
  padding: 0;
  border: none;
}

.clickThreshold th:nth-child(2),
.clickThreshold td:nth-child(2) {
  max-width: 150px;
}

.clickThreshold th:first-child,
.clickThreshold th:nth-child(3),
.clickThreshold th:nth-last-child(1),
.clickThreshold td:first-child,
.clickThreshold td:nth-child(3),
.clickThreshold td:nth-last-child(1) {
  width: 1%;
  white-space: nowrap;
}

.clickThreshold th:nth-last-child(3),
.clickThreshold td:nth-last-child(3) {
  max-width: 90px;
}

.clickThreshold .buttonsWrap {
  border-top: solid 1px rgba(var(--color-border), 0.24);
  padding-top: calc(var(--gap) / 2);
  margin-top: 5px;
}

#sidebar .sidebar-logo {
  position: sticky;
  top: 0;
  background-color: #f3f7f9;
}

#sidebar .logo {
  flex: 0;
  align-self: center;
  padding: 0;
  justify-content: center;
  padding-top: 24px;
  padding-bottom: 35px;
}

#sidebar .sidebar-logo .close-data {
  display: none;
}

#sidebar a {
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
  color: rgb(var(--color-link-sidebar));
  align-items: center;
  padding: 1.125rem;
  border-radius: var(--radius);
}

#sidebar a[data-icon=dashboard]::before {
  content: var(--icon-dashboard);
}

#sidebar a[data-icon=reports]::before {
  content: var(--icon-reports);
}

#sidebar a[data-icon=savings]::before {
  content: var(--icon-savings);
}

#sidebar a[data-icon=config]::before {
  content: var(--icon-config);
}

#sidebar a[data-icon=invitations]::before {
  content: var(--icon-invitations);
}

#sidebar a[data-icon=support]::before {
  content: var(--icon-support);
}

#sidebar a[data-icon=support-new]::before {
  content: var(--icon-support-new);
}
#sidebar a[data-icon=conversion]::before {
  content: var(--icon-conversion);
}
#sidebar a[data-icon=integration]::before {
  content: var(--icon-integration);
  width: 20px;
  height: 20px;
}

#sidebar>.menu,
#sidebar>.support {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  padding: 0 var(--gutter);
}

#sidebar>.menu a,
#sidebar>.support a {
  transition: background-color 0.2s ease;
}

#sidebar>.menu a:hover,
#sidebar>.support a:hover {
  background-color: rgba(var(--color-link-sidebar), 0.05);
  transition: background-color 0.2s ease;
}

#sidebar>.menu a.active,
#sidebar>.support a.active {
  background-color: rgba(var(--color-widget-background), 1);
}

#sidebar>.menu .active a,
#sidebar>.support .active a {
  background-color: rgba(var(--color-widget-background), 1);
}
#sidebar .integration-count{
  position: absolute;
    top: -8px;
    right: -12px;
    background: rgb(var(--color-label-red));
    color: white;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    line-height: 18px;
    text-align: center;
    font-size: 10px;
    font-weight: 700;
}
.sidebar-plan-box{
  position: relative;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  display: flex;
  width: fit-content;
  margin: auto;
  color: rgb(var(--color-link-sidebar));
  cursor: pointer;
  transition: all 0.1s ease-in-out;
  width: 270px;
}
.sidebar-plan-box .plan-data{
  position: absolute;
  top: 100%;
  background: white;
  width: 100%;
  left: 0;
  padding:8px 12px 12px;
  border-bottom-right-radius: 12px;
  border-bottom-left-radius: 12px;
  height: 0;
  opacity: 0;
  display: none;
}
.sidebar-plan-box.hovered {
  background-color: #ffffff;
}
.sidebar-plan-box.hovered .plan-data{
  height: auto;
  opacity: 1;
  display: block;
  transition: all 0.3s ease-in-out;
}
.userMenu .sidebar-plan-box{
  display: block;
  border-radius: 12px;
  background-color: rgba(var(--color-border), 0.1);
}
.userMenu .sidebar-plan-box .plan-data{
  height: fit-content;
  opacity: 1;
  display: block;
  position: relative;
  background-color: transparent;
}
.sidebar-plan-box .sidebar-plan{
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 12px 8px;
}
.sidebar-plan-box .sidebar-plan .plan-icon{
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #00AEEF;
}
.sidebar-plan-box .sidebar-plan .plan-icon svg{
  flex-shrink: 0;
  transform: rotate(90deg);
}
.sidebar-plan-box .sidebar-plan .plan-title{
  color: rgb(var(--color-link-sidebar));
  font-size: 14px;
  margin-bottom: 4px;
}
.sidebar-plan-box .sidebar-plan .plan-subtitle,
.sidebar-plan-box .plan-amount{
  color: rgb(var(--color-link-sidebar));
  font-weight: 600;
  margin-bottom: 2px;
}
.sidebar-plan-box .progress-text{
  font-size: 12px;
  margin-top: 2px;
  margin-bottom: 12px;
}

.sidebar-backdrop-cst{
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    top: 0;
    left: 0;
    z-index: 10;
    display: none;
    border-radius: 12px;
}

.sidebar-backdrop-cst.show {
  display: block;
}

@media (max-width: 1275px) {
  #sidebar {
    border-right: none;
    /* justify-content: flex-start; */
  }

  /* #sidebar .logo {
    min-width: 22px;
    min-height: 22px;
    position: relative;
    margin-left: auto;
    transform: rotate(45deg);
  } */

    #sidebar .sidebar-logo .close-data{
        width: 100%;
        position: relative;
        display: block;
    }
  #sidebar .sidebar-logo .sidebar-close{
    position: absolute;
    right: 4px;
    top: 8px;
    width: 40px;
    height: 40px;
  }

  #sidebar .sidebar-logo .sidebar-close::before {
    width: 2px;
    height: 22px;
    right: 30px;
    transform: rotate(45deg);
    right: 17px;
    top: 10px;
  }

  #sidebar .sidebar-logo .sidebar-close::after {
    width: 22px;
    height: 2px;
    right: 20px;
    transform: rotate(45deg);
    right: 7px;
    top: 20px;
  }

  #sidebar .sidebar-logo .sidebar-close::before,
  #sidebar .sidebar-logo .sidebar-close::after {
    position: absolute;
    background-color: rgb(var(--color-border));
    border-radius: 2px;
    display: block;
    content: "";
  }

  #sidebar .logo {
    justify-content: flex-start;
    padding-left: var(--gutter);
  }

  #sidebar .logo svg {
    display: none;
  }
}

#header {
  width: 100%;
  height: var(--size-header);
  padding: 24px;
  display: flex;
  flex-direction: row;
  gap: calc(var(--gap) / 2);
  align-items: center;
  justify-content: space-between;
  background-color: rgba(var(--color-background), 0.72);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  position: sticky;
  top: 0;
  z-index: 10;
  align-items: center;
}

#header .trigger,
#header .logo {
  display: none;
}

#header .trigger {
  flex-direction: column;
  justify-content: space-between;
  width: 20px;
  height: 18px;
}

#header .trigger span {
  display: block;
  width: 100%;
  height: 2px;
  border-radius: 2px;
  background-color: rgb(var(--color-border));
}

#header .trigger span:nth-child(2) {
  width: 75%;
}

#header h4 {
  text-transform: capitalize;
  flex: 1;
}

#header .userName {
  color: rgb(var(--color-header-text));
}

#header .--savings {
  align-self: center;
}

#header .userMenu {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
}

#header .userMenu::after {
  content: url(../images/icons/icon-arrow-dropdown.svg);
}

#header .userMenu>img {
  width: 36px;
  height: 36px;
  object-fit: cover;
  border-radius: 20px;
}

#header .userMenu>ul {
  position: absolute;
  top: calc(100% + var(--gap) / 2);
  right: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0 1.25rem;
  background-color: white;
  border-radius: var(--radius);
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.06);
  opacity: 0;
  visibility: collapse;
  transform: translateY(-20px);
  transition: transform 0.3s ease, opacity 0.2s ease, visibility 0s ease 0.3s;
}

#header .userMenu>ul li {
  border-bottom: solid 1px rgba(var(--color-border), 0.24);
  padding: 1.25rem 0;
}

#header .userMenu>ul li:nth-last-of-type(1) {
  border-bottom: transparent;
}

#header .userMenu>ul li>a {
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
  align-items: center;
  transition: opacity 0.2s ease;
  width: max-content;
}

#header .userMenu>ul li>a[data-icon=account]::before {
  content: var(--icon-header-account);
}

#header .userMenu>ul li>a[data-icon=theme]::before {
  content: var(--icon-header-theme);
}

#header .userMenu>ul li>a[data-icon=switch]::before {
  content: var(--icon-header-switch);
}

#header .userMenu>ul li>a[data-icon=savings]::before {
  content: var(--icon-savings);
}

#header .userMenu>ul li>a[data-icon=logout]::before {
  content: var(--icon-header-logout);
}

#header .userMenu>ul a {
  color: rgb(var(--color-header-text));
}

#header .userMenu>ul:hover li a {
  opacity: 0.5;
  transition: opacity 0.2s ease;
}

#header .userMenu>ul:hover li:hover a {
  opacity: 1;
  transition: opacity 0.2s ease;
}

#header .userMenu:hover {
  cursor: pointer;
}

#header .userMenu.active::before {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: calc(var(--gap) / 2);
  transform: translateY(100%);
}

#header .userMenu.active ul {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition: transform 0.3s ease, opacity 0.2s ease, visibility 0s ease;
}

@media (max-width: 1275px) {
  #header h4 {
    display: none;
  }

  #header .trigger {
    display: flex;
  }

  #header .logo {
    display: block;
  }

  #header .userName {
    margin-left: auto;
  }
}

@media (max-width: 460px) {
  #header {
    padding: 0 var(--gutter);
  }
}

@media (max-width: 340px) {
  #header .userMenu {
    gap: 5px;
  }

  #header .logo svg {
    width: 150px;
    height: auto;
  }
}

.widget .widgetTitle .acc-overview-create-dl {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  margin-left: auto;
  align-items: start;
}

#summary-filters .date-download {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

#filters,
#summary-filters,
.date-filter-css {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  gap: calc(var(--gap) / 2);
  position: relative;
  z-index: 3;
}

#filters .dateFilter,
#filters .campaignFilter,
.date-filter-css .dateFilter,
.date-filter-css .campaignFilter,
#summary-filters .summary-dateFilter {
  position: relative;
}

#filters .dateFilter>span,
#filters .campaignFilter>span,
.date-filter-css .dateFilter>span,
.date-filter-css .campaignFilter>span,
#summary-filters .summary-dateFilter>span {
  min-width: 100px;
  min-height: 40px;
  padding: 0.75rem 1.25rem;
  border-radius: 50px;
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.875rem;
  font-weight: 600;
  color: rgb(var(--color-header-text));
  background-color: rgba(var(--color-border), 0.15);
  transition: background-color 0.15s ease;
  position: relative;
}

#filters .dateFilter>span:hover,
#filters .campaignFilter>span:hover,
.date-filter-css .dateFilter>span:hover,
.date-filter-css .campaignFilter>span:hover,
#summary-filters .summary-dateFilter>span:hover {
  cursor: pointer;
  background-color: rgba(var(--color-border), 0.24);
  transition: background-color 0.15s ease;
}

#filters .dateFilter .wrap,
#filters .filter-dropdown.wrap,
.date-filter-css .dateFilter .wrap,
.date-filter-css .filter-dropdown.wrap,
#summary-filters .summary-dateFilter .wrap {
  position: absolute;
  top: calc(100% + var(--gap) / 2);
  max-width: 750px;
  width: 100vw;
  background-color: rgb(var(--color-widget-background));
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.06);
  padding: 15px var(--gap);
  border-radius: var(--radius);
  display: flex;
  opacity: 0;
  visibility: collapse;
  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0s ease 0.2s;
}

#filters .dateFilter.active,
#filters .campaignFilter.active,
.date-filter-css .dateFilter.active,
.date-filter-css .campaignFilter.active,
#summary-filters .summary-dateFilter.active {
  z-index: 2;
}

#filters .dateFilter.active>span,
#filters .campaignFilter.active>span,
.date-filter-css .dateFilter.active>span,
.date-filter-css .campaignFilter.active>span,
#summary-filters .summary-dateFilter.active>span {
  color: rgb(var(--color-text-inverse));
  background-color: rgb(var(--color-button));
}

#filters .dateFilter .closeTrigger,
#filters .campaignFilter .closeTrigger,
.date-filter-css .dateFilter .closeTrigger,
.date-filter-css .campaignFilter .closeTrigger,
#summary-filters .summary-dateFilter .summary-closeTrigger {
  position: relative;
  width: 40px;
  height: 40px;
  border-radius: 40px;
  background-color: rgba(var(--color-border), 0.15);
  transform: rotate(45deg);
  display: none;
}

#filters .dateFilter .closeTrigger:hover,
#filters .campaignFilter .closeTrigger:hover,
.date-filter-css .dateFilter .closeTrigger:hover,
.date-filter-css .campaignFilter .closeTrigger:hover,
#summary-filters .summary-dateFilter .summary-closeTrigger:hover {
  cursor: pointer;
}

#filters .dateFilter .closeTrigger::before,
#filters .dateFilter .closeTrigger::after,
#filters .campaignFilter .closeTrigger::before,
#filters .campaignFilter .closeTrigger::after,
.date-filter-css .dateFilter .closeTrigger::before,
.date-filter-css .dateFilter .closeTrigger::after,
.date-filter-css .campaignFilter .closeTrigger::before,
.date-filter-css .campaignFilter .closeTrigger::after,
#summary-filters .summary-dateFilter .summary-closeTrigger::before,
#summary-filters .summary-dateFilter .summary-closeTrigger::after {
  content: "";
  width: 2px;
  height: 20px;
  background-color: rgb(var(--color-border));
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

#filters .dateFilter .closeTrigger::after,
#filters .campaignFilter .closeTrigger::after,
.date-filter-css .dateFilter .closeTrigger::after,
.date-filter-css .campaignFilter .closeTrigger::after,
#summary-filters .summary-dateFilter .summary-closeTrigger::after {
  transform: translate(-50%, -50%) rotate(90deg);
}

#filters .dateFilter>span::after,
.date-filter-css .dateFilter>span::after,
#summary-filters .summary-dateFilter>span::after {
  content: "";
  width: 14px;
  height: 10px;
  background-image: url(../images/icons/icon-arrow-dropdown.svg);
  background-position: center;
  background-repeat: no-repeat;
}

#filters .dateFilter .wrap,
.date-filter-css .dateFilter .wrap,
#summary-filters .summary-dateFilter .wrap {
  flex-direction: column;
  gap: calc(var(--gap) / 2);
  transform: translateY(20px);
  transition: visibility 0s ease, opacity 0.2s ease, transform 0.2s ease;
}

#filters .dateFilter .wrap>div,
.date-filter-css .dateFilter .wrap>div,
#summary-filters .summary-dateFilter .wrap>div {
  width: 100%;
  border-bottom: solid 1px rgba(var(--color-border), 0.24);
}

#filters .dateFilter .wrap footer,
.date-filter-css .dateFilter .wrap footer,
#summary-filters .summary-dateFilter .wrap footer {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
}

#filters .dateFilter .wrap footer .date,
.date-filter-css .dateFilter .wrap footer .date,
#summary-filters .summary-dateFilter .wrap footer .date {
  display: flex;
  align-items: center;
  gap: 10px;
  color: rgb(var(--color-button-inactive-text));
  background-color: rgba(var(--color-border), 0.15);
  padding: 0 15px;
  border-radius: 50px;
  min-height: 30px;
  font-size: 0.875rem;
  font-weight: 600;
}

#filters .dateFilter .wrap footer .date span:nth-of-type(2),
.date-filter-css .dateFilter .wrap footer .date span:nth-of-type(2),
#summary-filters .summary-dateFilter .wrap footer .date span:nth-of-type(2) {
  display: flex;
  gap: 10px;
  align-items: center;
}

#filters .dateFilter .wrap footer .date span:nth-of-type(2)::before,
.date-filter-css .dateFilter .wrap footer .date span:nth-of-type(2)::before,
#summary-filters .summary-dateFilter .wrap footer .date span:nth-of-type(2)::before {
  content: var(--icon-arrow);
  transform: rotate(90deg);
}

#filters .dateFilter .wrap footer button:first-of-type,
.date-filter-css .dateFilter .wrap footer button:first-of-type,
#summary-filters .summary-dateFilter .wrap footer button:first-of-type {
  margin-left: auto;
}

#filters .dateFilter.active>span::after,
.date-filter-css .dateFilter.active>span::after,
#summary-filters .summary-dateFilter.active>span::after {
  background-image: var(--icon-close-white);
}

#filters .dateFilter.active .wrap,
.date-filter-css .dateFilter.active .wrap,
#summary-filters .summary-dateFilter.active .wrap {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
  transition: visibility 0s ease, opacity 0.2s ease, transform 0.2s ease;
}

#filters .campaignFilter>span::before,
.date-filter-css .campaignFilter>span::before {
  content: "";
  width: 14px;
  height: 10px;
  background-image: var(--icon-filters);
  background-repeat: no-repeat;
  background-position: center center;
}

#filters .filter-dropdown.wrap,
.date-filter-css .filter-dropdown.wrap {
  left: 50%;
  transform: translate(-40%, 20px);
  gap: var(--gap);
  flex-direction: row;
  flex-wrap: wrap;
  max-height: calc(100vh - 230px);
  overflow: auto;
  min-height: 200px;
}

#filters .filter-dropdown.wrap ul,
.date-filter-css .filter-dropdown.wrap ul {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: calc(var(--gap) / 3);
}

#filters .filter-dropdown.wrap ul>li:first-child,
.date-filter-css .filter-dropdown.wrap ul>li:first-child {
  font-weight: 600;
}

#filters .filter-dropdown.wrap ul li,
.date-filter-css .filter-dropdown.wrap ul li {
  position: relative;
}

#filters .filter-dropdown.wrap input,
.date-filter-css .filter-dropdown.wrap input {
  visibility: collapse;
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

#filters .filter-dropdown.wrap input:checked+label,
.date-filter-css .filter-dropdown.wrap input:checked+label {
  background-color: rgb(var(--color-button));
  color: rgb(var(--color-text-inverse));
  transition: background-color 0.15s ease, color 0.15s ease;
}

#filters .filter-dropdown.wrap label,
.date-filter-css .filter-dropdown.wrap label {
  padding: calc(var(--gap) / 2);
  border-radius: var(--radius);
  background-color: rgba(var(--color-border), 0.12);
  transition: background-color 0.15s ease, color 0.15s ease;
}

#filters .filter-dropdown.wrap label:hover,
.date-filter-css .filter-dropdown.wrap label:hover {
  cursor: pointer;
}

#filters .filter-dropdown.wrap>div,
.date-filter-css .filter-dropdown.wrap>div {
  flex-basis: 100%;
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  border-top: solid 1px rgba(var(--color-border), 0.24);
  padding: calc(var(--gap) / 2) 0;
  position: sticky;
  bottom: 0;
  background: white;
}

#filters .filter-dropdown.wrap>div button:first-of-type,
.date-filter-css .filter-dropdown.wrap>div button:first-of-type {
  margin-left: auto;
}

#filters .filter-dropdown.wrap>div>span,
.date-filter-css .filter-dropdown.wrap>div>span {
  color: rgb(var(--color-border));
}

#filters .campaignFilter.active>span::before,
.date-filter-css .campaignFilter.active>span::before {
  background-image: var(--icon-close-white);
}

#filters .campaignFilter.active+.filter-dropdown.wrap,
.date-filter-css .campaignFilter.active+.filter-dropdown.wrap {
  visibility: visible;
  opacity: 1;
  transform: translate(-40%, 0);
  transition: visibility 0s ease, opacity 0.2s ease, transform 0.2s ease;
  padding-bottom: 0;
}

#filters .filter-dropdown.wrap.download-report-menu{
  display: block;
  max-width: 400px;
}
#filters .filter-dropdown.wrap.download-report-menu .year-filter,
#filters .filter-dropdown.wrap.download-report-menu .source-filter,
#filters .filter-dropdown.wrap.download-report-menu .month-filter{
  border: none;
  display: block;
}
#filters .filter-dropdown.wrap.download-report-menu label{
  padding: 0;
  background: transparent;
  margin-bottom: 6px;
}

@media (min-width: 850px) {

  #filters .campaignFilter.left-position .wrap,
  .date-filter-css .campaignFilter.left-position .wrap {
    left: 100%;
  }
}

@media (max-width: 850.99px) {
  .preset-plugin-container {
    gap: 8px;
  }

  #filters .dateFilter .wrap,
  #filters .filter-dropdown.wrap,
  .date-filter-css .dateFilter .wrap,
  .date-filter-css .filter-dropdown.wrap,
  #summary-filters .summary-dateFilter .wrap {
    position: fixed;
    top: auto;
    bottom: -100%;
    max-width: 100%;
    width: 100%;
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.06);
    border-radius: var(--radius) var(--radius) 0 0;
    transition: bottom 0.3s ease, opacity 0.2s ease, transform 0.2s ease, visibility 0s ease 0.2s;
  }

  #filters .dateFilter .closeTrigger,
  #filters .campaignFilter .closeTrigger,
  .date-filter-css .dateFilter .closeTrigger,
  .date-filter-css .campaignFilter .closeTrigger,
  #summary-filters .summary-dateFilter .summary-closeTrigger {
    display: block;
    color: transparent;
    font-size: 0;
  }

  #filters .dateFilter .wrap,
  .date-filter-css .dateFilter .wrap,
  #summary-filters .summary-dateFilter .wrap {
    flex-direction: column;
    left: 0;
    bottom: -100%;
    /* transform: translateY(0); */
    transition: bottom 0.3s ease, visibility 0s ease, opacity 0.2s ease, transform 0.2s ease;
  }

  #filters .dateFilter.active .wrap,
  .date-filter-css .dateFilter.active .wrap,
  #summary-filters .summary-dateFilter.active .wrap {
    visibility: visible;
    opacity: 1;
    bottom: -1px;
    /* transform: translateY(0); */
    transition: bottom 0.3s ease, visibility 0s ease, opacity 0.2s ease, transform 0.2s ease;
    max-height: calc(100% - 100px);
    overflow: auto;
  }

  #filters .filter-dropdown.wrap,
  .date-filter-css .filter-dropdown.wrap {
    left: 0;
    transform: translate(0);
  }

  #filters .filter-dropdown.wrap>div,
  .date-filter-css .filter-dropdown.wrap>div {
    gap: 15px;
  }

  #filters .filter-dropdown.wrap>div button,
  .date-filter-css .filter-dropdown.wrap>div button {
    margin-left: auto;
  }

  #filters .campaignFilter.active+.filter-dropdown.wrap,
  .date-filter-css .campaignFilter.active+.filter-dropdown.wrap {
    visibility: visible;
    opacity: 1;
    transform: translate(0);
    bottom: 0;
    transition: bottom 0.3s ease, visibility 0s ease, opacity 0.2s ease, transform 0.2s ease;
  }

  #filters .filter-dropdown.wrap>div .close,
  #filters .dateFilter .wrap footer .close,
  .date-filter-css .filter-dropdown.wrap>div .close,
  .date-filter-css .dateFilter .wrap footer .close,
  #summary-filters .summary-dateFilter .wrap footer .close {
    display: none;
  }

  #filters .filter-dropdown.wrap,
  .date-filter-css .filter-dropdown.wrap {
    max-height: calc(100vh - 170px);
  }
}

@media (max-width: 639px) {

  #filters .filter-dropdown.wrap,
  .date-filter-css .filter-dropdown.wrap {
    display: grid;
    grid-template-columns: 1fr;
    overflow-y: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }

  #filters .filter-dropdown.wrap::-webkit-scrollbar,
  .date-filter-css .filter-dropdown.wrap::-webkit-scrollbar {
    display: none;
  }
}

@media (max-width: 574px) {

  #filters .dateFilter>span::before,
  .date-filter-css .dateFilter>span::before,
  #summary-filters .summary-dateFilter>span::before {
    content: "";
    width: 16px;
    height: 17px;
    background-image: var(--icon-calendar);
    background-repeat: no-repeat;
    background-position: center;
  }

  #filters .dateFilter>span::after,
  .date-filter-css .dateFilter>span::after,
  #summary-filters .summary-dateFilter>span::after {
    display: none;
  }

  #filters .dateFilter.active>span::before,
  .date-filter-css .dateFilter.active>span::before,
  #summary-filters .summary-dateFilter.active>span::before {
    background-image: var(--icon-calendar-white);
  }
}

@media (max-width: 463px) {

  #filters .dateFilter,
  #filters .campaignFilter .date-filter-css .dateFilter,
  .date-filter-css .campaignFilter {
    flex: 1;
  }

  #filters .dateFilter>span,
  #filters .campaignFilter>span,
  .date-filter-css .dateFilter>span,
  .date-filter-css .campaignFilter>span,
  #summary-filters .summary-dateFilter>span {
    justify-content: center;
  }

  #filters .dateFilter .wrap footer,
  .date-filter-css .dateFilter .wrap footer,
  #summary-filters .summary-dateFilter .wrap footer {
    display: grid;
    grid-template-columns: 1fr 40px;
  }

  #filters .dateFilter .wrap footer .date,
  .date-filter-css .dateFilter .wrap footer .date,
  #summary-filters .summary-dateFilter .wrap footer .date {
    grid-column: 1/span 2;
    height: 40px;
    justify-content: center;
  }

  /* #filters .dateFilter .wrap footer button:first-of-type {
    margin-left: 0;
    margin-right: auto;
  } */
}

@media (max-width: 394px) {

  #filters .campaignFilter,
  .date-filter-css .campaignFilter {
    flex: 0;
  }
}

@media (max-width: 376px) {

  #filters .dateFilter,
  .date-filter-css .dateFilter {
    flex: 1;
  }

  #filters .dateFilter>span,
  .date-filter-css .dateFilter>span,
  #summary-filters .summary-dateFilter>span {
    justify-content: center;
  }
}

@media (max-width: 345px) {

  #filters,
  .date-filter-css {
    gap: 6px;
  }

  #filters .dateFilter>span,
  #filters .campaignFilter>span,
  .date-filter-css .dateFilter>span,
  .date-filter-css .campaignFilter>span,
  #summary-filters .summary-dateFilter>span {
    padding: 0.75rem;
    gap: 7px;
    justify-content: center;
  }

  #filters .filter-dropdown.wrap>div>span:first-child,
  .date-filter-css .filter-dropdown.wrap>div>span:first-child {
    display: none;
  }

  #filters .filter-dropdown.wrap>div button,
  .date-filter-css .filter-dropdown.wrap>div button {
    margin-left: 0;
  }
}

.widget {
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
  padding: 1.562rem 1.875rem;
  background-color: rgba(var(--color-widget-background), 1);
  border-radius: var(--radius);
  align-self: start;
  gap: var(--gap);
}

/* .widget>* {
  z-index: 2;
} */

.widget .widgetTitle {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  font-size: 22px;
  font-weight: 600;
  color: rgb(var(--color-header-text));
}

.widget.--accountsOverview .widgetTitle {
  z-index: 3;
  gap: 24px;
}

.widget.--progressBar {
  height: 100%;
}

.widget.--progressBar .widgetTitle {
  flex-wrap: nowrap;
}

.widget .widgetTitle[data-title=underline] {
  border-bottom: solid 1px rgba(var(--color-border), 0.24);
  padding: 0 0 0.937rem;
}

.widget .widgetTitle[data-icon=click]::before {
  content: var(--icon-click);
}

.widget .widgetTitle[data-icon=money]::before {
  content: var(--icon-money);
}

.widget .widgetTitle[data-icon=bot]::before {
  content: var(--icon-bot);
}

.widget .widgetTitle[data-icon=proxy]::before {
  content: var(--icon-proxy);
}

.widget .widgetTitle[data-icon=vpn]::before {
  content: var(--icon-vpn);
}

.widget .widgetTitle[data-icon=crowler]::before {
  content: var(--icon-crowler);
}

.widget .widgetTitle[data-icon=mobile]::before {
  content: var(--icon-mobile);
}

.widget .widgetTitle[data-icon=skull]::before {
  content: var(--icon-skull);
}

.widget .widgetTitle input[type=search] {
  min-height: 24px;
  padding: 5px 12px 5px var(--gap);
  border-color: transparent;
  background-color: rgba(var(--color-text), 0.06);
  background-position: center left calc(var(--gap) / 3);
  background-image: url(../images/icons/icon-search-s.svg);
  max-width: 240px;
  margin-left: auto;
  transition: all 0.15s ease;
}

.widget .widgetTitle input[type=search]:focus,
.widget .widgetTitle input[type=search]:focus-within {
  background-color: transparent;
  border-color: rgba(var(--color-border), 0.5);
  transition: all 0.15s ease;
}

.widget .widgetTitle>span {
  margin-right: auto;
}

.widget .widgetTitle a {
  font-size: 0.8125rem;
  font-weight: 400;
  display: inline-flex;
  flex-direction: row;
  gap: calc(var(--gap) / 4);
  align-items: center;
}

.widget .widgetTitle a.download {
  margin-left: auto;
}

.widget .widgetTitle a.download::after {
  content: var(--icon-download);
}
.widget .widgetTitle a.add::after {
  content: var(--icon-add);
  padding-top: 2px;
}

.widget .widgetTitle>div {
  display: flex;
  flex-direction: column;
}

.widget .widgetTitle>div span {
  font-size: 0.75rem;
  font-weight: 400;
  color: rgb(var(--color-border));
}

.widget.--menu {
  padding: 0;
  background-color: transparent;
  grid-column: span 3;
}

.widget.--menu ul {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}

.widget.--menu ul li a {
  display: flex;
  align-items: center;
  gap: calc(var(--gap) / 3);
  padding: 1rem 1.25rem;
  border-radius: var(--radius);
  color: rgb(var(--color-header-text));
  transition: background-color 0.2s ease;
}

.widget.--menu ul li a:hover {
  background-color: rgba(var(--color-link-sidebar), 0.05);
  transition: background-color 0.2s ease;
}

.widget.--menu ul li a::before {
  transform: translateY(2px);
}
.integration.widget.--menu ul li a::before{
  max-width: 20px;
  max-height: 20px;
  transform: translateY(0px);
}

.widget.--menu ul li a.active {
  background-color: rgba(var(--color-widget-background), 1);
}

.widget.--menu ul li a[data-icon=whitelist]::before {
  content: var(--icon-whitelist);
}

.widget.--menu ul li a[data-icon=block]::before {
  content: var(--icon-block);
}

.widget.--menu ul li a[data-icon=config-red]::before {
  content: var(--icon-config-red);
}

.widget.--menu ul li a[data-icon=config-grey]::before {
  content: var(--icon-config-grey);
}
.widget.--menu ul li a[data-icon="google-ads"]::before{
  content: url(../images/icons/icon-google-ads.svg);
}
.widget.--menu ul li a[data-icon="google-tag-manager"]::before{
  content: url(../images/icons/icon-google-tag-manager.svg);
}
.widget.--menu ul li a[data-icon="conversions"]::before{
  content: url(../images/icons/icon-conversion.svg);
}
.widget.--menu ul li a[data-icon="facebook"]::before{
  content: url(../images/icons/facebook.svg);
}
.widget.--menu ul li a[data-icon="instagram"]::before{
  content: url(../images/icons/icon-instagram.svg);
}
.widget.--menu ul li a[data-icon="linked-in"]::before{
  content: url(../images/icons/icon-linkedin.svg);
}
.widget.--menu ul li a[data-icon="tiktok"]::before{
  content: url(../images/icons/icon-tiktok.svg);
}
.widget.--menu ul li a[data-icon="dv36"]::before{
  content: url(../images/icons/icon-dvd.svg);
}
.widget.--menu ul li a[data-icon="overview"]::before{
  content: url(../images/icons/icon-overview.png);
}

.widget.--menu ul li a span {
  display: flex;
  flex-direction: column;
}

.widget.--menu ul li a span::after {
  content: attr(data-description);
  color: rgb(var(--color-button-inactive));
  font-size: 0.75rem;
}

.widget.--menu ul li.active a {
  background-color: rgba(var(--color-widget-background), 1);
}

@media (max-width: 880px) {
  .widget.--menu {
    grid-column: span 12;
    position: relative;
  }

  .widget.--menu ul {
    flex-direction: row;
    overflow-x: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }

  .widget.--menu ul::-webkit-scrollbar {
    display: none;
  }

  .widget.--menu ul li {
    white-space: nowrap;
  }
}

@media (max-width: 639px) {
  .widget.--menu {
    grid-column: span 2;
  }

  .widget.--menu ul {
    gap: 5px;
  }

  .widget.--menu ul li a {
    padding: 0.8rem;
  }
}

.widget.--menuRow {
  padding: 0;
  background-color: transparent;
}

.widget.--menuRow a {
  position: relative;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  color: rgba(var(--color-text), 0.36);
}

.widget.--menu.reports-sidebar a[data-icon=radar]::before {
  content: var(--icon-radar);
}

.widget.--menu.reports-sidebar a[data-icon=cursor]::before {
  content: var(--icon-cursor);
}

.widget.--menu.reports-sidebar a[data-icon=search]::before {
  content: var(--icon-search);
}

.widget.--menu.reports-sidebar a[data-icon=scale]::before {
  content: var(--icon-scale);
}

.widget.--menu.reports-sidebar a[data-icon=connectivity]::before {
  content: var(--icon-connectivity);
}

.widget.--menu.reports-sidebar a[data-icon=browser]::before {
  content: var(--icon-browser);
}

.widget.--menu.reports-sidebar a[data-icon=devices]::before {
  content: var(--icon-devices);
}

.widget.--menu.reports-sidebar a[data-icon=location]::before {
  content: var(--icon-location);
}
.widget.--menu.reports-sidebar a[data-icon=sources]::before {
  content: var(--icon-sources);
}
.widget.--menu.reports-sidebar a[data-icon=conversions]::before {
  content: var(--icon-conversions);
}
.widget.--menuRow a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -10px;
  width: 0;
  height: 1px;
  background-color: rgba(var(--color-border), 0.24);
  transition: background-color 0.2s ease, width 0.2s ease;
}

.widget.--menuRow a:hover::after {
  width: 100%;
  transition: background-color 0.2s ease, width 0.2s ease;
}

.widget.--menuRow a.active {
  --icon-radar: url(../images/icons/icon-radar-blue.svg);
  --icon-cursor: url(../images/icons/icon-cursor-blue.svg);
  --icon-search: url(../images/icons/icon-search-blue.svg);
  --icon-scale: url(../images/icons/icon-scale-blue.svg);
  --icon-connectivity: url(../images/icons/icon-conectivity-blue.svg);
  --icon-browser: url(../images/icons/icon-browser-blue.svg);
  --icon-devices: url(../images/icons/icon-devices-blue.svg);
  --icon-location: url(../images/icons/icon-location-blue.svg);
  --icon-sources: url(../images/icons/icon-source-blue.svg);
  --icon-conversions: url(../images/icons/icon-conversation-blue.svg);
  color: rgb(0, 173, 239);
}

.widget.--menuRow a.active::after {
  width: 100%;
  background-color: rgb(0, 173, 239);
}

.widget.--menuRow ul {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

@media (max-width: 1099px) {
  .widget.--menuRow ul {
    overflow-x: scroll;
    justify-content: start;
    flex-wrap: nowrap;
    gap: 15px;
    -ms-overflow-style: none;
    scrollbar-width: none;
    padding-bottom: 10px;
  }

  .widget.--menuRow ul::-webkit-scrollbar {
    display: none;
  }

  .widget.--menuRow ul li {
    display: flex;
    flex-wrap: nowrap;
  }

  .widget.--menuRow ul li a {
    white-space: nowrap;
  }
}

.widget.--billing-info form {
  gap: var(--gap);
}

.widget.--billing-info form .wrap {
  display: grid;
  gap: var(--gap);
}

.widget.--billing-info form .wrap[data-wrap="2"] {
  grid-template-columns: 1fr 1fr;
}

.widget.--billing-info form .wrap[data-wrap="3"] {
  grid-template-columns: repeat(3, 1fr);
}

.widget.--billing-info form label {
  align-self: start;
  padding-left: 5px;
}

@media (max-width: 419px) {
  .widget.--billing-info form .wrap[data-wrap="2"] {
    grid-template-columns: 1fr;
  }
}

.widget.--payment-method .cardList {
  width: 100%;
  display: flex;
  flex-direction: column;
  /* padding-bottom: var(--gap); */
  /* border-bottom: solid 1px rgba(var(--color-border), 0.24); */
}

.widget.--payment-method .cardList li {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  transition: padding 0.2s ease;
}

.widget.--payment-method .cardList li .cardlist-data {
  padding: 10px 0;
  border-bottom: solid 1px rgba(var(--color-border), 0.24);
}

.widget.--payment-method .cardList li:nth-of-type(1) {
  padding-top: 0;
}

.widget.--payment-method .cardList li p {
  flex: 1;
}

.widget.--payment-method .cardList li button {
  flex: 0;
}

.widget.--payment-method .cardList li .details {
  display: none;
  width: 100%;
  border-top: solid 1px rgba(var(--color-border), 0.24);
  padding-top: calc(var(--gap) / 2);
  overflow: hidden;
}

.widget.--payment-method .cardList li .details .wrap {
  display: flex;
  flex-direction: row;
  gap: var(--gap);
}

.widget.--payment-method .cardList li .details .wrap p {
  display: flex;
  flex-direction: column;
  row-gap: calc(var(--gap) / 3);
  flex: 1;
}

.widget.--payment-method .cardList li .details .wrap>div {
  display: flex;
  flex-direction: column;
  row-gap: calc(var(--gap) / 3);
}

.widget.--payment-method .cardList li .details .wrap>div>div {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: calc(var(--gap) / 2);
  border-radius: 50px;
  padding: 12px calc(var(--gap) / 2);
  border: solid 1px rgba(var(--color-border), 0.5);
  color: rgba(var(--color-text), 0.36);
}

.widget.--payment-method .cardList li .details .wrap>div>div input {
  border: none;
  padding: 0;
  border-radius: 0;
  min-height: auto;
}

.widget.--payment-method .cardList li.active {
  padding: calc(var(--gap) / 2);
  border: solid 1px rgba(var(--color-border), 0.24);
  border-radius: var(--radius);
  transition: padding 0.2s ease;
}

.widget.--payment-method .cardList li.active>*:last-child {
  order: 1;
}

.widget.--payment-method .cardList li.active .details {
  display: flex;
}

@media (max-width: 669px) {
  .widget.--payment-method .cardList li p {
    min-width: 100%;
  }
}

@media (max-width: 419px) {
  .widget.--payment-method>button {
    width: 100%;
  }

  .widget.--payment-method .cardList li .details {
    gap: 15px;
  }

  .widget.--payment-method .cardList li .details .wrap {
    flex-direction: column;
  }

  .widget.--payment-method .cardList li.active {
    padding: 10px;
  }
}

.widget.--invoices table th:nth-last-of-type(3),
.widget.--invoices table th:nth-last-of-type(2),
.widget.--invoices table th:nth-last-of-type(1),
.widget.--invoices table td:nth-last-of-type(3),
.widget.--invoices table td:nth-last-of-type(2),
.widget.--invoices table td:nth-last-of-type(1) {
  text-align: center;
}

.widget.--invoices table [data-button=download] {
  width: fit-content;
}

@media (max-width: 700px) {
  .widget.--invoices table tr {
    display: flex;
    flex-direction: column;
    border-bottom: solid 1px rgba(var(--color-border), 0.24);
    padding: 15px 0;
  }

  .widget.--invoices table tr:first-child {
    display: none;
  }

  .widget.--invoices table tr:last-child {
    border-bottom: none;
    padding-bottom: 0;
  }

  .widget.--invoices table tr:nth-of-type(2) {
    padding-top: 0;
  }

  .widget.--invoices table tr td {
    border-bottom: none;
    width: 100%;
    padding: 10px 0;
    text-align: left;
    display: flex;
    flex-direction: row;
    gap: 15px;
    align-items: center;
  }

  .widget.--invoices table tr td:nth-last-of-type(3),
  .widget.--invoices table tr td:nth-last-of-type(2),
  .widget.--invoices table tr td:nth-last-of-type(1) {
    text-align: left;
  }

  .widget.--invoices table tr td .tdTitle {
    min-width: 80px;
    text-transform: uppercase;
    color: rgb(var(--color-border));
    font-size: 12px;
  }
}

@media (max-width: 463px) {
  .widget.--invoices table tr td {
    flex-direction: column;
    align-items: start;
    gap: 5px;
  }
}

.widget.--subscription table td:nth-of-type(1) {
  font-size: 0.6875rem;
  text-transform: uppercase;
  color: rgb(var(--color-header-text));
  width: 100px;
  padding-left: 0;
}

.widget.--subscription table td:nth-last-of-type(1) {
  padding-left: 0;
}

.widget.--subscription .buttonsWrap button:nth-of-type(1) {
  margin-right: auto;
}

@media (max-width: 563px) {
  .widget.--subscription .buttonsWrap {
    flex-direction: column;
  }

  .widget.--subscription .buttonsWrap button {
    width: 100%;
  }
}

@media (max-width: 390px) {
  .widget.--subscription table tr {
    display: flex;
    flex-direction: column;
    align-items: start;
    border-bottom: solid 1px rgba(var(--color-border), 0.24);
    padding: 10px 0;
    gap: 5px;
  }

  .widget.--subscription table tr td {
    padding: 0;
    border: none;
  }
}

.widget.--accountsOverview {
  display: grid;
  grid-template-columns: 1fr;
}

.widget.--accountsOverview>ul {
  display: flex;
  flex-direction: column;
}

.widget.--accountsOverview>ul>li {
  padding: var(--gap) 0;
  display: flex;
  flex-direction: row;
  gap: var(--gap);
  align-items: stretch;
  border-bottom: solid 1px rgba(var(--color-border), 0.24);
}

.widget.--accountsOverview>ul>li:nth-of-type(1) {
  padding-top: 0;
}

.widget.--accountsOverview>ul>li>* {
  flex: 1;
  align-self: stretch;
}

.widget.--accountsOverview .accountDetails {
  padding-top: 20px;
  display: flex;
  flex-direction: column;
  gap: calc(var(--gap) / 6);
}

.widget.--accountsOverview .accountDetails .mail {
  font-weight: 600;
  font-size: 1.125rem;
}
.edit-text-box .close-editable-text{
  display: none !important;
  height: 20px !important;
  width: 20px !important;
}
.edit-text-box{
    display: flex;
    align-items: center;
    gap: 8px;
}
.edit-text-box .editable-text{
  padding: 6px;
  border-radius: 4px;
}
.edit-text-box .editable-text[contenteditable="true"]{
  border: solid 1px rgba(var(--color-border), 0.24);
}
.edit-text-box .editable-text[contenteditable="true"]:focus-visible{
  outline: none;
}

.widget.--accountsOverview .accountDetails .buttonsWrap {
  margin-top: auto;
}

.widget.--accountsOverview .--clicks {
  background-color: rgba(var(--color-border), 0.12);
}

.widget.--accountsOverview .--clicks .widgetTitle {
  color: rgb(var(--color-text));
}

.widget.--accountsOverview .--clicks .canvasWrap{
  max-width: 130px;
  position: relative;
}

.widget.--accountsOverview .--clicks .canvasWrap .center,
.source-tab-data .canvasWrap .center-data{
  position: absolute;
  top: 55%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-weight: 600;
  font-size: 13px;
}

.widget.--accountsOverview>.buttonsWrap {
  grid-row: 2;
  border-bottom: solid 1px rgba(var(--color-border), 0.24);
  padding-bottom: var(--gap);
}

@media (max-width: 1099px) {
  .widget.--accountsOverview ul li {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .widget.--accountsOverview ul li .accountDetails {
    grid-row: 1/span 2;
  }

  .widget.--accountsOverview ul li .--savings {
    grid-column: 2;
  }
}

@media (max-width: 767px) {
  .widget.--accountsOverview ul li {
    display: grid;
    grid-template-columns: 1fr;
  }

  .widget.--accountsOverview ul li .accountDetails {
    grid-row: 1;
  }

  .widget.--accountsOverview ul li .accountDetails .buttonsWrap {
    padding-top: 20px;
  }

  .widget.--accountsOverview ul li .--savings {
    grid-column: 1;
  }
}

@media (max-width: 499px) {
  .widget.--accountsOverview>.buttonsWrap {
    flex-direction: column;
  }

  .widget.--accountsOverview>.buttonsWrap button {
    width: 100%;
  }
}

@media (max-width: 399px) {
  .widget.--accountsOverview .--clicks[data-size=s] {
    gap: 15px;
    flex-direction: column;
  }

  .widget.--accountsOverview .--clicks[data-size=s]>div:nth-of-type(1) {
    gap: 20px;
  }
}

.widget.--savings {
  --color-text: 255, 255, 255;
  --color-text-inverse: 0, 0, 0;
  background-color: rgb(var(--color-widget-savings));
  color: rgb(var(--color-text));
  justify-content: space-between;
  overflow: hidden;
}

.widget.--savings::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(314deg, rgba(253, 212, 0, 0.84) -25.97%, rgba(253, 212, 0, 0) 66.44%);
}

.widget.--savings .widgetTitle {
  color: rgb(var(--color-text));
  font-size: 1.125rem;
}

.widget.--savings .widgetTitle+div {
  font-size: 1.875rem;
  font-weight: 600;
  display: flex;
  flex-direction: column;
}

.widget.--savings .widgetTitle+div span {
  font-size: 0.75rem;
}

.widget.--savings[data-size=L] {
  flex: 1;
  min-height: 250px;
}

.widget.--savings[data-size=L]::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url(../images/overlay-money.png);
  background-size: cover;
  mix-blend-mode: multiply;
}

.widget.--savings[data-size=s] {
  height: 36px;
  padding: 0 15px;
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  background-color: rgba(var(--color-border), 0.1);
  border-radius: 18px;
  gap: 10px;
  color: rgb(var(--color-header-text));
  width: auto;
  align-items: center;
  transition: background-color 0.15s ease;
}

.widget.--savings[data-size=s]::before {
  content: var(--icon-savings);
  background: none;
  position: relative;
  top: auto;
  left: auto;
  width: auto;
  height: auto;
}

.widget.--savings[data-size=s]:hover {
  cursor: pointer;
  background-color: rgba(var(--color-border), 0.24);
  transition: background-color 0.15s ease;
}

.widget.--clicks .canvasWrap {
  max-width: 120px;
  position: relative;
  margin: 0 auto;
}

.widget.--clicks .canvasWrap .center,
.source-tab-data .canvasWrap .center-data {
  position: absolute;
  top: 55%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-weight: 600;
}

.widget.--clicks .stats {
  text-transform: capitalize;
  font-size: 0.8125rem;
  color: rgb(var(--color-border));
}

.widget.--clicks .stats>* {
  display: flex;
  flex-direction: row;
  gap: calc(var(--gap) / 3);
  align-items: center;
}

.widget.--clicks .stats>*::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 4px;
  background-color: rgba(var(--color-border), 0.24);
}

.widget.--clicks .stats>*[data-label=green]::before {
  background-color: rgb(var(--color-label-green));
}

.widget.--clicks .stats>*[data-label=red]::before {
  background-color: rgb(var(--color-label-red));
}
.widget.--clicks .stats>*[data-label=orange]::before {
  color: rgb(var(--color-label-orange));
}

.widget.--clicks .stats>* span {
  font-weight: 600;
  color: rgb(var(--color-text));
  margin-left: auto;
}

.widget.--clicks[data-size=s] {
  flex-direction: row;
  align-items: stretch;
}

.widget.--clicks[data-size=s]>div {
  flex: 1;
}

.widget.--clicks[data-size=s]>div:nth-of-type(1) {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

@media (max-width: 1149px) {

  .widget.--sendInvite,
  [data-grid] [data-width="5"] {
    grid-column: span 12;
  }

}

@media (max-width: 639px) {
  .widget.--sendInvite {
    grid-column: span 2;
  }

  [data-grid] {
    grid-template-columns: 1fr 1fr;
  }

  [data-grid] [data-width="4"],
  [data-grid] [data-width="5"],
  [data-grid] [data-width="7"],
  [data-grid] [data-width="9"],
  [data-grid] [data-width="12"] {
    grid-column: span 2;
  }
}

.widget.--invitations>ul {
  display: flex;
  flex-direction: column;
}

.widget.--invitations>ul li {
  padding: 1.25rem 0;
  border-bottom: solid 1px rgba(var(--color-border), 0.24);
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: calc(var(--gap) / 3);
  align-items: center;
}

.widget.--invitations>ul li:nth-of-type(1) {
  padding-top: 0;
}

.widget.--invitations>ul li:nth-last-of-type(1) {
  border-bottom: none;
}

.widget.--invitations>ul li span {
  margin-right: auto;
  word-break: break-all;
}

.widget.--invitations>ul li label {
  color: rgb(var(--color-button-inactive));
}

.btn-flex {
  display: flex;
  justify-content: end;
  column-gap: 10px;
}

@media (max-width: 1149px) {
  .widget.--invitations {
    grid-column: span 12;
  }
}

@media (max-width: 639px) {
  .widget.--invitations {
    grid-column: span 2;
  }

  .widget.--invitations ul li label {
    align-items: end;
    justify-content: end;
  }
}

@media (max-width: 549px) {
  .widget.--invitations ul li {
    grid-template-columns: 1fr;
    row-gap: 15px;
    justify-content: center;
    text-align: center;
    align-items: center;
    display: grid;
  }

  /* .widget.--invitations ul li span {
    margin: 0 auto;
  } */
  .widget.--invitations ul li label {
    align-items: center;
    justify-content: center;
  }
}

.widget.--refresh {
  padding: 0;
  background-color: transparent;
}

.widget.--refresh button {
  width: 100%;
  border-radius: var(--radius);
  padding: 1.562rem 1.875rem;
  background-color: rgb(var(--color-text));
  font-size: 1.125rem;
  justify-content: space-between;
  text-align: left;
  line-height: 1;
}

.widget.--refresh button::before {
  content: var(--icon-refresh);
}

.widget.--documentation {
  padding: 0;
  background-color: transparent;
}

.widget.--documentation button {
  flex-direction: column;
  gap: 0;
  width: 100%;
  border-radius: var(--radius);
  padding: 1.562rem 1.875rem;
  background-color: rgba(var(--color-border), 0.24);
  color: rgb(var(--color-header-text));
  font-size: 1.125rem;
  align-items: end;
}

.widget.--documentation button::before {
  content: var(--icon-docs);
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 1.875rem;
}

.widget.--documentation button::after {
  content: attr(data-description);
  font-size: 0.8125rem;
  font-weight: 400;
}

@media (max-width: 1080px) {
  .widget.--documentation button {
    padding: 4rem 1.562rem 1.562rem;
    align-items: center;
  }

  .widget.--documentation button::before {
    top: 1.562rem;
    left: 50%;
    transform: translateX(-50%);
  }
}

@media (max-width: 483px) {
  .widget.--documentation button {
    padding: 1.562rem 1.875rem;
    align-items: end;
  }

  .widget.--documentation button::before {
    top: 50%;
    transform: translateY(-50%);
    left: 1.875rem;
  }
}

.widget.--savingsDetails table td:not(:nth-of-type(1)) {
  text-align: center;
}

.widget.--savingsDetails table td:nth-last-of-type(1) {
  color: rgb(var(--color-button));
}

.widget.--registerLogin {
  padding: 0;
  border-radius: 0;
  align-items: center;
  margin: auto 0;
  background-color: transparent;
}

.widget.--registerLogin article {
  width: 100%;
  max-width: 350px;
  align-items: center;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: calc(var(--gap) / 2);
}

.widget.--registerLogin form {
  width: 100%;
  gap: calc(var(--gap) / 2);
  align-items: center;
}

.widget.--registerLogin form button {
  width: 100%;
}

.widget.--progressBar .widgetTitle {
  color: rgb(var(--color-text));
}

.widget.--progressBar .widgetTitle+div {
  display: flex;
  flex-direction: column;
  gap: calc(var(--gap) / 3);
}

.widget.--progressBar .widgetTitle+div span {
  font-size: 1.875rem;
  font-weight: 600;
}
.widget.--progressBar .widgetTitle + div > div,
.sidebar-plan-box .--progressBar .progress-data,
.conversions-plan-box .--progressBar .progress-data{
  width: 100%;
  height: 10px;
  border-radius: 5px;
  background-color: rgba(var(--color-border), 0.12);
  position: relative;
  overflow: hidden;
}
.widget.--progressBar .widgetTitle + div > div::before,
.sidebar-plan-box .--progressBar .progress-data::before,
.conversions-plan-box .--progressBar .progress-data::before{
  content: "";
  display: block;
  width: calc(var(--width) * 1%);
  height: 10px;
  background: linear-gradient(90deg, #00AEEF 0%, #FDD400 50%, #FF4747 100%);
  background-position: top left;
  background-repeat: no-repeat;
  background-size: calc(100% * 100 / var(--width));
  border-radius: 5px;
}

@media (max-width: 900px) {
  .widget.--progressBar {
    grid-column: span 6;
  }
}

@media (max-width: 639px) {
  .widget.--progressBar {
    grid-column: span 2;
  }
}

.widget.--totalTraffic {
  min-height: 400px;
}

.widget.--clickInsights .widgetTitle {
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  font-weight: 600;
  color: rgb(var(--color-header-text));
  position: relative;
  /* z-index: 3; */
}

.widget.--clickInsights .widgetTitle .widgwt-btn{
  flex-direction: row;
  align-items: center;
  justify-content: end;
  margin-left: auto;
}

.widget.--clickInsights .widgetTitle input[type=search] {
  margin-left: 0;
}

.widget.--clickInsights .widgetTitle input[type=search]:focus,
.widget.--clickInsights .widgetTitle input[type=search]:focus-within {
  background-color: transparent;
  border-color: rgba(var(--color-border), 0.5);
  transition: all 0.15s ease;
}

.widget.--clickInsights .widgetTitle>div:first-child {
  display: flex;
  flex-direction: column;
  width: calc((100% - 20px - 240px) / 2);
}

.widget.--clickInsights .widgetTitle>div:first-child span {
  font-size: 0.75rem;
  font-weight: 400;
  color: rgb(var(--color-border));
}

.widget.--clickInsights .widgetTitle .columns {
  margin-left: auto;
  position: relative;
}

.widget.--clickInsights .widgetTitle .columns:hover {
  cursor: pointer;
}

.widget.--clickInsights .widgetTitle .columns span {
  font-size: 0.8125rem;
  font-weight: 400;
  display: inline-flex;
  flex-direction: row;
  gap: calc(var(--gap) / 4);
  color: rgb(var(--color-header-text));
  text-transform: capitalize;
}

.widget.--clickInsights .widgetTitle .columns span::before {
  content: "+/-";
}

.widget.--clickInsights .widgetTitle .columns ul {
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  transform: translate(-50%, 20px);
  opacity: 0;
  visibility: collapse;
  display: flex;
  flex-direction: column;
  gap: 5px;
  background-color: rgb(var(--color-widget-background));
  padding: 10px 15px 10px 10px;
  border: solid 1px rgba(var(--color-border), 0.24);
  border-radius: var(--radius);
  height: 220px;
  overflow: auto;
}

.widget.--clickInsights .widgetTitle .columns ul label {
  font-size: 0.8125rem;
  font-weight: 400;
  white-space: nowrap;
}

.widget.--clickInsights .widgetTitle .columns.active ul {
  opacity: 1;
  transform: translate(-50%, 0);
  visibility: visible;
}

.widget.--clickInsights .widgetTitle .download {
  margin-left: 30px;
  white-space: nowrap;
}

@media (max-width: 880px) {
  .widget.--clickInsights .widgetTitle>div:first-child {
    width: auto;
    flex: 1;
  }

  .widget.--clickInsights .widgetTitle .columns {
    display: none;
  }

  .widget.--clickInsights .widgetTitle .download {
    margin-left: 15px;
  }

  .widget.--clickInsights .widgetTitle input[type=search] {
    margin-left: auto;
  }
}

@media (max-width: 715px) {
  .widget.--clickInsights .widgetTitle>div:first-child {
    flex: 1;
  }

  .widget.--clickInsights .widgetTitle input[type=search] {
    display: none;
  }
}

@media (max-width: 540px) {
  .widget.--clickInsights .widgetTitle {
    flex-direction: column;
    align-items: start;
    row-gap: 10px;
  }

  #filters,
  .date-filter-css {
    display: grid;
  }

  #filters .dateFilter>span,
  #filters .campaignFilter>span,
  .date-filter-css .dateFilter>span,
  .date-filter-css .campaignFilter>span,
  #summary-filters .summary-dateFilter>span {
    justify-content: center;
  }
}

@media (max-width: 630px) {
  .widget.--whitelisted .widgetTitle {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
  }

  .widget.--whitelisted .widgetTitle input[type=search] {
    margin-left: 0;
  }
}

@media (max-width: 520px) {
  .widget.--whitelisted .widgetTitle {
    grid-template-columns: 1fr 1fr 16px;
  }

  .widget.--whitelisted .widgetTitle .download {
    width: 17px;
    height: 17px;
    overflow: hidden;
    position: relative;
    padding-left: 17px;
  }

  .widget.--whitelisted .widgetTitle .download::after {
    position: absolute;
    left: 0;
    top: 0;
  }
}

@media (max-width: 500px) {
  .widget.--whitelisted table thead {
    display: none;
  }

  .widget.--whitelisted table tr {
    display: grid;
    grid-template-columns: 1fr 30px;
    text-align: left;
    align-items: start;
    border-bottom: solid 1px rgba(var(--color-border), 0.24);
    padding: 10px 0;
  }

  .widget.--whitelisted table tr:last-child {
    border: none;
  }

  .widget.--whitelisted table tr td {
    border: none;
    padding: 5px 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
  }

  .widget.--whitelisted table tr td:first-child,
  .widget.--whitelisted table tr td:nth-child(2) {
    grid-column: 1;
  }

  .widget.--whitelisted table tr td:last-child {
    grid-column: 2;
    grid-row: 1/span 2;
    align-self: center;
    justify-content: center;
    align-items: center;
  }

  .widget.--whitelisted table tr td:last-child .tdTitle {
    display: none;
  }

  .widget.--whitelisted table tr td .tdTitle {
    min-width: 80px;
    color: rgb(var(--color-border));
    font-size: 12px;
    text-transform: uppercase;
  }
}

@media (max-width: 393px) {
  .widget.--whitelisted .widgetTitle {
    grid-template-columns: 1fr 16px;
  }

  .widget.--whitelisted .widgetTitle input[type=search] {
    grid-column: 1;
    grid-row: 2;
    min-width: 90%;
  }

  .widget.--whitelisted .widgetTitle .download {
    grid-row: 2;
  }

  .widget.--whitelisted table tr td {
    padding: 5px 0;
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 2px;
  }
}

@media (max-width: 767px) {
  .widget.--monthlySavings table thead {
    display: none;
  }

  .widget.--monthlySavings table tr {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    align-items: start;
    padding: 15px 0;
    column-gap: 20px;
    row-gap: 15px;
    border-bottom: solid 1px rgba(var(--color-border), 0.24);
  }

  .widget.--monthlySavings table tr:first-child {
    border-top: solid 1px rgba(var(--color-border), 0.24);
  }

  .widget.--monthlySavings table tr:last-child {
    border: none;
  }

  .widget.--monthlySavings table tr td {
    padding: 0;
    border: none;
    margin-left: 0;
    text-align: left;
    display: grid;
    grid-template-columns: 1fr;
    gap: 5px;
  }

  .widget.--monthlySavings table tr td:not(:nth-of-type(1)) {
    text-align: left;
  }

  .widget.--monthlySavings table tr td .tdTitle {
    text-transform: uppercase;
    font-size: 12px;
    color: rgb(var(--color-border));
  }
}

@media (max-width: 674px) {
  .widget.--monthlySavings table tr {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 424px) {
  .widget.--monthlySavings table tr {
    grid-template-columns: 1fr;
    row-gap: 5px;
  }

  .widget.--monthlySavings table tr td {
    grid-template-columns: 140px 1fr;
  }
}

@media (max-width: 549px) {
  .widget ul.split2>li button {
    width: 100%;
  }

  .widget ul.split2>li .rangeSlider {
    align-items: start;
  }

  .widget ul.split2>li .rangeSlider input[type=range] {
    width: 100%;
    max-width: 100%;
  }
}

@media (max-width: 989px) {
  .widget.--countryRegion {
    grid-column: span 12;
  }
}

@media (max-width: 639px) {
  .widget.--countryRegion {
    grid-column: span 2;
  }
}

@media (max-width: 549px) {
  .widget.--countryRegion table thead {
    display: none;
  }

  .widget.--countryRegion table tbody {
    display: flex;
    flex-direction: column;
  }

  .widget.--countryRegion table tbody tr {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    border-bottom: solid 1px rgba(var(--color-border), 0.24);
    gap: 10px;
    padding: 15px 0;
  }

  .widget.--countryRegion table tbody tr:last-child {
    border: none;
  }

  .widget.--countryRegion table tbody tr td {
    display: grid;
    grid-template-columns: 1fr;
    padding: 0;
    border: none;
    text-align: left;
  }

  .widget.--countryRegion table tbody tr td .tdTitle {
    text-transform: uppercase;
    font-size: 12px;
    color: rgb(var(--color-border));
  }
}

@media (max-width: 419px) {
  .widget.--countryRegion table tbody tr {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 574px) {
  .widget {
    padding: 1.2rem;
  }
}

.alert {
  padding: 1.25rem;
  border-radius: var(--radius);
  display: flex;
  flex-direction: column;
  gap: calc(var(--gap) / 3);
}

.alert[data-alert=disclaimer] {
  background-color: rgba(var(--color-alert-disclaimer), 0.09);
  color: rgb(var(--color-alert-disclaimer));
}

.alert .alertTitle {
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  font-weight: 600;
}

.picUpload {
  display: flex;
  flex-direction: row;
  gap: calc(var(--gap) / 2);
  align-items: center;
}

.picUpload img {
  width: 80px;
  height: 80px;
  object-fit: cover;
  border-radius: 50px;
}

.picUpload button {
  align-self: center;
}

.picUpload .fileWrap {
  display: flex;
  flex-direction: row;
}

.picUpload .fileWrap input {
  display: none;
}

.picUpload .fileWrap label {
  min-height: 40px;
  min-width: 90px;
  padding: 0.625rem 1.25rem;
  border-radius: 50px;
  border: solid 1px rgba(var(--color-border), 1);
  background-color: transparent;
  color: rgb(var(--color-text));
}

.picUpload .fileWrap label:hover {
  cursor: pointer;
}

@media (max-width: 473px) {
  .picUpload {
    display: grid;
    grid-template-columns: 80px 1fr;
    align-items: start;
  }

  .picUpload img {
    grid-row: span 2;
    align-self: center;
  }

  .picUpload .fileWrap {
    width: 100%;
    text-align: center;
    justify-content: center;
  }

  .picUpload .fileWrap label {
    width: 100%;
    justify-content: center;
  }

  .picUpload button {
    grid-column: 2;
  }
}

@media (max-width: 391px) {
  .picUpload {
    display: flex;
    flex-direction: column;
  }

  .picUpload button {
    width: 100%;
  }
}

.buttonsWrap {
  display: flex;
  flex-direction: row;
  gap: calc(var(--gap) / 3);
}

.banner {
  display: flex;
  flex-direction: row;
  gap: calc(var(--gap) / 2);
  align-items: center;
  padding: calc(var(--gap) / 2);
  background-color: white;
  border-radius: var(--radius);
  color: rgb(var(--color-text));
}

.banner[data-icon=monitor]::before {
  content: var(--icon-monitor);
}
.banner[data-icon=error]::before {
  content: var(--icon-error);
}
.banner[data-icon=info]::before {
  content: var(--icon-info);
}
.banner[data-icon=success]::before {
  content: var(--icon-success);
}
.banner[data-icon=warning]::before {
  content: var(--icon-warning);
}

.banner>div {
  margin-right: auto;
}

.banner.--upgrade {
  --color-text: 255, 255, 255;
  --color-border: 255, 255, 255;
  background-color: transparent;
  background: linear-gradient(257deg, #66CEF5 32.84%, #FFD600 155.53%);
}
.banner.warning-notification{
  color: white;
  background: linear-gradient(257deg, rgb(var(--color-label-yellow)) 32.84%, #FFD600 155.53%);
}
.banner.error-notification{
  color: white;
  background: linear-gradient(257deg, rgb(var(--color-label-red)) 32.84%, #FFD600 155.53%);
}
.banner.info-notification{
  color: white;
  background: linear-gradient(257deg, #00AEEF 32.84%, rgb(var(--color-button)) 155.53%);
}
.banner.success-notification{
  color: white;
  background: linear-gradient(257deg, #4CAF50 32.84%, rgb(var(--color-label-green)) 155.53%);
}
.banner .button.notification-btn {
  border-color: white;
  color: white;
  min-width: 160px;
}

@media (max-width: 716px) {
  .banner {
    flex-wrap: wrap;
  }

  .banner[data-icon=monitor]::before {
    display: none;
  }

  .banner .button {
    flex-basis: 100%;
  }
}
.swal-modal .swal-title{
    font-size: 18px;
    color: #101010;
}
.swal-modal .swal-text{
  text-align: center;
  font-size: 14px;
  line-height: 22px;
  color: #696969;
}
ul.split2>li {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  border-bottom: solid 1px rgba(var(--color-border), 0.24);
  padding: calc(var(--gap) / 2) 0;
  gap: var(--gap);
}
.split2.savings-card .saving-list-item .saving-li{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  gap: 4px;
  padding-bottom: 4px;
}
.split2.savings-card .saving-list-item .saving-li .saving-label{
  display: grid;
  cursor: pointer;
}
.split2.savings-card .saving-list-item{
  border-bottom: solid 1px rgba(var(--color-border), 0.24);
  padding: calc(var(--gap) / 2) 0;
}
.split2.savings-card .saving-list-item .saving-li .savings-radio,
.shrink-0{
  flex-shrink: 0;
}

ul.split2>li>*:first-child {
  flex: 1;
}

ul.split2>li:last-child {
  border-bottom: none;
}

ul.split2 li.dropdown-list {
  align-items: start;
}

ul.split2 li.dropdown-list select {
  width: fit-content;
  padding-right: 30px;
}

.rangeSlider {
  display: flex;
  flex-direction: column;
  gap: calc(var(--gap) / 5);
  align-items: end;
}

.rangeSlider span {
  font-size: 0.75rem;
  text-transform: uppercase;
  color: rgb(var(--color-border));
}

.tagInput {
  min-height: 40px;
  border-radius: var(--radius);
  border: solid 1px rgba(var(--color-border), 0.24);
  padding: 7px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 7px;
  font-size: 0.875rem;
  align-items: center;
}

.tagInput input:not([type=checkbox], [type=range]):not([type=submit]) {
  border: none;
  padding: 5px;
  border-radius: 0;
  min-height: auto;
  flex: 1;
  min-width: 200px;
}

.tagInput input:not([type=checkbox], [type=range]):not([type=submit]):focus,
.tagInput input:not([type=checkbox], [type=range]):not([type=submit]):focus-within {
  border: none;
}

.tagInput .tag {
  background-color: rgb(var(--color-tag));
  color: rgb(var(--color-link-sidebar));
  padding: 5px 10px;
  border-radius: 6px;
  display: inline-flex;
  flex-direction: row;
  gap: calc(var(--gap) / 3);
  align-items: center;
}

.tagInput .tag span::after {
  content: var(--icon-close);
}

.tagInput .tag span:hover {
  cursor: pointer;
}

/* .maxHeight {
  max-height: calc(100svh - var(--gap) - var(--size-header) - var(--gutter) * 2);
} */
@media (max-width: 880px) {
  .maxHeight {
    max-height: none;
  }

  .maxHeight[data-flex=column] {
    grid-column: span 12;
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .maxHeight[data-flex=column]>*,
  .maxHeight[data-flex=column] button {
    height: 100%;
  }
}

@media (max-width: 639px) {
  .maxHeight[data-flex=column] {
    grid-column: span 2;
  }
}

@media (max-width: 483px) {
  .maxHeight[data-flex=column] {
    grid-template-columns: 1fr;
  }

  .maxHeight[data-flex=column] .--savings[data-size=L] {
    min-height: 200px;
  }
}

table.clickThreshold {
  border-spacing: calc(var(--gap) / 3);
  border-collapse: initial;
  font-size: 0.875rem;
  padding: calc(var(--gap) / 3);
  border: solid 1px rgba(var(--color-border), 0.24);
  border-radius: var(--radius);
}

li table.clickThreshold {
  margin-top: calc(var(--gap) / 2);
}

table.clickThreshold th,
table.clickThreshold td {
  padding: 0;
  border: none;
}

table.clickThreshold th:first-child,
table.clickThreshold th:nth-child(3),
table.clickThreshold th:nth-last-child(1),
table.clickThreshold td:first-child,
table.clickThreshold td:nth-child(3),
table.clickThreshold td:nth-last-child(1) {
  width: 1%;
  white-space: nowrap;
}

table.clickThreshold th:nth-child(2),
table.clickThreshold td:nth-child(2) {
  max-width: 150px;
}

table.clickThreshold th:nth-last-child(3),
table.clickThreshold td:nth-last-child(3) {
  max-width: 90px;
}

table.clickThreshold .buttonsWrap {
  border-top: solid 1px rgba(var(--color-border), 0.24);
  padding-top: calc(var(--gap) / 2);
  margin-top: 5px;
}

@media (max-width: 799px) {
  table.clickThreshold tbody {
    display: flex;
    flex-direction: column;
  }

  table.clickThreshold tr {
    padding: 15px 0;
    border-bottom: solid 1px rgba(var(--color-border), 0.24);
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap !important;
  }

  table.clickThreshold tr:first-child {
    padding-top: 0;
  }

  table.clickThreshold tr:last-child {
    border-bottom: none;
    padding-bottom: 0;
  }

  table.clickThreshold tr:last-child div {
    border-top: none;
    padding-top: 0;
  }

  table.clickThreshold tr th:first-child,
  table.clickThreshold tr th:nth-child(3),
  table.clickThreshold tr td:first-child,
  table.clickThreshold tr td:nth-child(3) {
    width: 80px;
  }

  table.clickThreshold tr th:nth-last-child(1),
  table.clickThreshold tr td:nth-last-child(1) {
    width: auto;
  }

  table.clickThreshold tr th:nth-child(2),
  table.clickThreshold tr td:nth-child(2) {
    max-width: 100%;
    width: calc(100% - 10px - 80px);
  }

  table.clickThreshold tr th:nth-last-child(3),
  table.clickThreshold tr td:nth-last-child(3) {
    flex: 1;
    max-width: 100%;
  }

  table.clickThreshold tr th:nth-last-child(2),
  table.clickThreshold tr td:nth-last-child(2) {
    flex: 1;
    max-width: 100%;
  }
}

@media (max-width: 549px) {

  table.clickThreshold tr th:last-child,
  table.clickThreshold tr td:last-child {
    min-width: 100%;
  }

  table.clickThreshold tr th:last-child button,
  table.clickThreshold tr td:last-child button {
    width: 100%;
  }
}

@media (max-width: 449px) {

  table.clickThreshold tr th:first-child,
  table.clickThreshold tr th:nth-child(3),
  table.clickThreshold tr td:first-child,
  table.clickThreshold tr td:nth-child(3) {
    min-width: 100%;
  }

  table.clickThreshold tr th:nth-child(2),
  table.clickThreshold tr td:nth-child(2) {
    width: 100%;
  }

  table.clickThreshold tr:last-child div {
    flex-direction: column;
  }
}

@media (max-width: 359px) {

  table.clickThreshold tr th:first-child,
  table.clickThreshold tr th:nth-child(3),
  table.clickThreshold tr td:first-child,
  table.clickThreshold tr td:nth-child(3) {
    min-width: 100%;
  }

  table.clickThreshold tr th:nth-last-child(3),
  table.clickThreshold tr td:nth-last-child(3) {
    min-width: 100%;
  }
}

.table-responsive-cst {
  width: 100%;
  overflow-x: auto;
}

table.clickInsights {
  width: 100%;
  /* display: flex;
  flex-direction: column; */
}

/* table.clickInsights > thead,
table.clickInsights > tbody {
  display: flex;
  flex-direction: column;
} */
/* table.clickInsights > thead > tr,
table.clickInsights > tbody > tr {
  width: 100%;
  padding: 0 15px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 0;
  border-top: solid 1px rgba(var(--color-border), 0.24);
} */
table.clickInsights>thead>tr:nth-of-type(1),
table.clickInsights>tbody>tr:nth-of-type(1) {
  border-top: none;
}

table.clickInsights>thead>tr td.details,
table.clickInsights>tbody>tr td.details {
  /* display: none; */
}

table.clickInsights>thead>tr.active,
table.clickInsights>tbody>tr.active {
  border: solid 1px rgba(var(--color-border), 0.24);
  border-radius: var(--radius);
}

table.clickInsights>thead>tr.active td.details,
table.clickInsights>tbody>tr.active td.details {
  display: flex;
}

table.clickInsights>thead>tr.active+tr,
table.clickInsights>tbody>tr.active+tr {
  border-top: none;
}

/* table.clickInsights > thead th, table.clickInsights > thead td,
table.clickInsights > tbody th,
table.clickInsights > tbody td {
  background-color: transparent;
  min-height: 3rem;
  display: flex;
  align-items: center;
  white-space: nowrap;
  flex: 1;
} */

table.clickInsights>thead th.date,
table.clickInsights>thead th.aiScore,
table.clickInsights>thead td.date,
table.clickInsights>thead td.aiScore,
table.clickInsights>tbody th.date,
table.clickInsights>tbody th.aiScore,
table.clickInsights>tbody td.date,
table.clickInsights>tbody td.aiScore {
  min-width: 8%;
}

table.clickInsights>thead th.suspicious,
table.clickInsights>thead td.suspicious,
table.clickInsights>tbody th.suspicious,
table.clickInsights>tbody td.suspicious {
  min-width: 8%;
  align-items: center;
  justify-content: center;
}

table.clickInsights>thead th.os,
table.clickInsights>thead td.os,
table.clickInsights>tbody th.os,
table.clickInsights>tbody td.os {
  min-width: 10%;
}

table.clickInsights>thead th.ip,
table.clickInsights>thead td.ip,
table.clickInsights>tbody th.ip,
table.clickInsights>tbody td.ip {
  min-width: 18%;
}

table.clickInsights>thead th.geo,
table.clickInsights>thead th.iProv,
table.clickInsights>thead th.keywords,
table.clickInsights>thead td.geo,
table.clickInsights>thead td.iProv,
table.clickInsights>thead td.keywords,
table.clickInsights>tbody th.geo,
table.clickInsights>tbody th.iProv,
table.clickInsights>tbody th.keywords,
table.clickInsights>tbody td.geo,
table.clickInsights>tbody td.iProv,
table.clickInsights>tbody td.keywords {
  min-width: 16%;
}

/* table.clickInsights > thead th.details, table.clickInsights > thead td.details,
table.clickInsights > tbody th.details,
table.clickInsights > tbody td.details {
  width: 100%;
  min-width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  padding: 25px 20px;
  align-items: start;
  justify-content: start;
  row-gap: var(--gap);
} */
table.clickInsights>thead th.details>div,
table.clickInsights>thead td.details>div,
table.clickInsights>tbody th.details>div,
table.clickInsights>tbody td.details>div {
  display: flex;
  flex-direction: column;
  gap: var(--gap);
  align-items: start;
  justify-content: start;
}

/* table.clickInsights > thead th.details > div:nth-child(1), table.clickInsights > thead td.details > div:nth-child(1),
table.clickInsights > tbody th.details > div:nth-child(1),
table.clickInsights > tbody td.details > div:nth-child(1) {
  width: calc(50vw - 250px);
  padding-right: var(--gap);
}
table.clickInsights > thead th.details > div:nth-child(2), table.clickInsights > thead td.details > div:nth-child(2),
table.clickInsights > tbody th.details > div:nth-child(2),
table.clickInsights > tbody td.details > div:nth-child(2) {
  width: calc(50vw - 250px);
}
table.clickInsights > thead th.details > div:nth-child(3), table.clickInsights > thead td.details > div:nth-child(3),
table.clickInsights > tbody th.details > div:nth-child(3),
table.clickInsights > tbody td.details > div:nth-child(3) {
  width: 100vw;
  flex-direction: row;
  gap: calc(var(--gap) / 2);
}
table.clickInsights > thead th.details > div:nth-child(3) button:last-child, table.clickInsights > thead td.details > div:nth-child(3) button:last-child,
table.clickInsights > tbody th.details > div:nth-child(3) button:last-child,
table.clickInsights > tbody td.details > div:nth-child(3) button:last-child {
  margin-left: auto;
} */
table.clickInsights>thead th.details>div .wrap,
table.clickInsights>thead td.details>div .wrap,
table.clickInsights>tbody th.details>div .wrap,
table.clickInsights>tbody td.details>div .wrap {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 15px;
}

table.clickInsights>thead th.details>div .title,
table.clickInsights>thead td.details>div .title,
table.clickInsights>tbody th.details>div .title,
table.clickInsights>tbody td.details>div .title {
  text-transform: capitalize;
  color: rgb(var(--color-text));
  font-size: 1rem;
  font-weight: 600;
  padding: 0;
  min-height: auto;
  height: auto;
  text-align: left;
}

table.clickInsights>thead th.details>div .timeline,
table.clickInsights>thead td.details>div .timeline,
table.clickInsights>tbody th.details>div .timeline,
table.clickInsights>tbody td.details>div .timeline {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 15px;
}

table.clickInsights>thead th.details>div .timeline::before,
table.clickInsights>thead td.details>div .timeline::before,
table.clickInsights>tbody th.details>div .timeline::before,
table.clickInsights>tbody td.details>div .timeline::before {
  position: absolute;
  content: "";
  width: 1px;
  height: calc(100% - var(--gap));
  bottom: 0;
  left: 7px;
  background: linear-gradient(180deg, #00AEEF 57.75%, rgba(0, 174, 239, 0) 99.77%);
}

table.clickInsights>thead th.details>div .timeline>li,
table.clickInsights>thead td.details>div .timeline>li,
table.clickInsights>tbody th.details>div .timeline>li,
table.clickInsights>tbody td.details>div .timeline>li {
  display: flex;
  flex-direction: row;
  gap: 15px;
  position: relative;
  z-index: 2;
}

table.clickInsights>thead th.details>div .timeline>li::before,
table.clickInsights>thead td.details>div .timeline>li::before,
table.clickInsights>tbody th.details>div .timeline>li::before,
table.clickInsights>tbody td.details>div .timeline>li::before {
  content: "";
  width: 12px;
  height: 12px;
  border-radius: 12px;
  border: solid 2px white;
  margin-top: var(--gap);
  background-color: rgb(var(--color-button));
}

table.clickInsights>thead th.details>div .timeline>li ul,
table.clickInsights>thead td.details>div .timeline>li ul,
table.clickInsights>tbody th.details>div .timeline>li ul,
table.clickInsights>tbody td.details>div .timeline>li ul {
  flex: 1;
  border: solid 1px rgba(var(--color-border), 0.24);
  border-radius: var(--radius);
  padding: 15px;
  display: flex;
  flex-direction: column;
}

table.clickInsights>thead th.details>div .timeline>li ul li,
table.clickInsights>thead td.details>div .timeline>li ul li,
table.clickInsights>tbody th.details>div .timeline>li ul li,
table.clickInsights>tbody td.details>div .timeline>li ul li {
  display: flex;
  flex-direction: row;
  gap: 15px;
  justify-content: space-between;
  border-bottom: solid 1px rgba(var(--color-border), 0.24);
  padding: 10px 0;
}

table.clickInsights>thead th.details>div .timeline>li ul li:last-child,
table.clickInsights>thead td.details>div .timeline>li ul li:last-child,
table.clickInsights>tbody th.details>div .timeline>li ul li:last-child,
table.clickInsights>tbody td.details>div .timeline>li ul li:last-child {
  border-bottom: none;
}

table.clickInsights>thead th.details>div .timeline>li ul .date,
table.clickInsights>thead td.details>div .timeline>li ul .date,
table.clickInsights>tbody th.details>div .timeline>li ul .date,
table.clickInsights>tbody td.details>div .timeline>li ul .date {
  font-weight: 600;
}

table.clickInsights>thead th.details>div .timeline>li ul .title,
table.clickInsights>thead td.details>div .timeline>li ul .title,
table.clickInsights>tbody th.details>div .timeline>li ul .title,
table.clickInsights>tbody td.details>div .timeline>li ul .title {
  color: rgb(var(--color-header-text));
  text-transform: uppercase;
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.5;
}

table.clickInsights>thead th.details>div .mapLocation,
table.clickInsights>thead td.details>div .mapLocation,
table.clickInsights>tbody th.details>div .mapLocation,
table.clickInsights>tbody td.details>div .mapLocation {
  width: 100%;
  display: flex;
  flex-direction: row;
  gap: var(--gap);
  justify-content: space-between;
}

table.clickInsights>thead th.details>div .mapLocation .mapWrap,
table.clickInsights>thead td.details>div .mapLocation .mapWrap,
table.clickInsights>tbody th.details>div .mapLocation .mapWrap,
table.clickInsights>tbody td.details>div .mapLocation .mapWrap {
  width: calc(100% - var(--gap) - 120px);
  height: 100%;
  overflow: hidden;
  border-radius: var(--radius);
}

table.clickInsights>thead th.details>div .mapLocation .mapWrap iframe,
table.clickInsights>thead td.details>div .mapLocation .mapWrap iframe,
table.clickInsights>tbody th.details>div .mapLocation .mapWrap iframe,
table.clickInsights>tbody td.details>div .mapLocation .mapWrap iframe {
  width: 100%;
  height: 100%;
}

table.clickInsights>thead th.details>div .mapLocation table,
table.clickInsights>thead td.details>div .mapLocation table,
table.clickInsights>tbody th.details>div .mapLocation table,
table.clickInsights>tbody td.details>div .mapLocation table {
  display: flex;
  flex-direction: column;
  max-width: 120px;
}

table.clickInsights>thead th.details>div .mapLocation table tr,
table.clickInsights>thead td.details>div .mapLocation table tr,
table.clickInsights>tbody th.details>div .mapLocation table tr,
table.clickInsights>tbody td.details>div .mapLocation table tr {
  display: flex;
  flex-direction: column;
  gap: 5px;
  border: none;
}

table.clickInsights>thead th.details>div .mapLocation table tr td,
table.clickInsights>thead td.details>div .mapLocation table tr td,
table.clickInsights>tbody th.details>div .mapLocation table tr td,
table.clickInsights>tbody td.details>div .mapLocation table tr td {
  width: 100%;
}

table.clickInsights>thead th.details table tr,
table.clickInsights>thead td.details table tr,
table.clickInsights>tbody th.details table tr,
table.clickInsights>tbody td.details table tr {
  padding: 10px 0;
  border-bottom: solid 1px rgba(var(--color-border), 0.24);
}

table.clickInsights>thead th.details table td,
table.clickInsights>thead td.details table td,
table.clickInsights>tbody th.details table td,
table.clickInsights>tbody td.details table td {
  min-height: auto;
  height: auto;
  white-space: wrap;
  display: block;
  text-align: left;
}

table.clickInsights>thead th.details table td:first-child,
table.clickInsights>thead td.details table td:first-child,
table.clickInsights>tbody th.details table td:first-child,
table.clickInsights>tbody td.details table td:first-child {
  color: rgb(var(--color-header-text));
  text-transform: uppercase;
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.5;
  max-width: 130px;
}

table.clickInsights>thead th.hide,
table.clickInsights>thead td.hide,
table.clickInsights>tbody th.hide,
table.clickInsights>tbody td.hide {
  display: none;
}

table.clickInsights>thead td,
table.clickInsights>tbody td {
  flex: 1;
  border-bottom: none;
  padding: 0;
  font-size: 0.75rem;
}

table.clickInsights>thead td:not(.suspicious):hover,
table.clickInsights>tbody td:not(.suspicious):hover {
  cursor: pointer;
}

table.clickInsights>thead .tdTitle,
table.clickInsights>tbody .tdTitle {
  text-transform: uppercase;
  font-size: 12px;
  color: rgb(var(--color-border));
}

table.clickInsights>thead {
  background-color: rgb(var(--color-tHead));
  border-radius: var(--radius);
}

/* table.clickInsights > tbody tr {
  display: table-row;
  flex-direction: row;
} */
table.clickInsights span {
  display: flex;
  flex-direction: row;
  gap: 5px;
  align-items: center;
}

table.clickInsights span.location::before {
  width: 16px;
  height: 12px;
}

table.clickInsights span.os.windows::before {
  content: var(--icon-os-windows);
}

table.clickInsights span.os.apple::before {
  content: var(--icon-os-apple);
}

table.clickInsights span.os.android::before {
  content: var(--icon-os-android);
}

table.clickInsights span.os.linux::before {
  content: var(--icon-os-linux);
}

table.clickInsights span.score,
table.clickInsights span.keyword {
  border-radius: 50px;
  padding: 5px 10px;
  display: inline-block;
}

table.clickInsights span.score {
  color: rgb(var(--color-text-inverse));
  width: fit-content;
}

table.clickInsights span.score.safe {
  background-color: rgb(var(--color-label-green));
}

table.clickInsights span.score.low {
  background-color: rgb(var(--color-button));
}

table.clickInsights span.score.medium {
  background-color: rgb(var(--color-label-yellow));
}

table.clickInsights span.score.high {
  background-color: rgb(var(--color-label-orange));
}

table.clickInsights span.score.extreme {
  background-color: rgb(var(--color-label-red));
}

table.clickInsights span.score.blocked {
  background-color: #cccccc;
}

table.clickInsights span.keyword {
  background-color: rgb(var(--color-tHead));
  color: rgb(var(--color-header-text));
}

table.clickInsights tbody tr {
  border-top: solid 1px rgba(160, 168, 171, 0.24);
}

table.clickInsights thead tr th {
  min-width: 90px;
  white-space: nowrap;
  font-weight: 600;
}

table.clickInsights tbody tr>td {
  padding: 12px 4px;
  max-width: 300px;
  word-wrap: break-word;
}

table.clickInsights tbody.table-body tr>td:nth-of-type(1) {
  padding-left: 20px;
}

table.clickInsights tbody.table-body tr>td:nth-last-child(1) {
  padding-right: 20px;
}

/* table.clickInsights tbody tr > td:nth-last-child(1) span{
    justify-content: end;
} */
table.clickInsights tbody tr.dt-hasChild {
  background: rgba(var(--color-border), 0.09);
  border-radius: 8px;
}

table.clickInsights tbody tr.dt-hasChild td:nth-last-of-type(1) {
  border-top-right-radius: 8px;
  background: transparent;
  border-bottom-right-radius: 8px;
}

table.clickInsights tbody tr.dt-hasChild td:nth-of-type(1) {
  border-top-left-radius: 8px;
  background: transparent;
  border-bottom-left-radius: 8px;
}

table.clickInsights tbody tr.dt-hasChild+tr {
  border-top: none;
}

table.clickInsights tbody tr.dt-hasChild+tr td.details .click-data table tbody>tr {
  display: flex;
  flex-direction: row;
  border-bottom: none;
  gap: 5px;
}

table.clickInsights tbody tr.dt-hasChild+tr td.details .click-data table tbody>tr td {
  padding: 0;
}

table.clickInsights tbody tr.dt-hasChild+tr td.details .click-data table tbody>tr td:last-child {
  max-width: none;
}

table.clickInsights tbody tr.dt-hasChild+tr td:nth-last-child(1),
table.clickInsights tbody tr.dt-hasChild+tr td:nth-of-type(1) {
  padding: 0 0 12px;
}

table.clickInsights tbody tr.dt-hasChild+tr td.details {
  /* display: flex; */
  padding: 0;
  width: calc(100vw - 460px);
  min-width: 100%;
  position: sticky;
  left: 0;
}

table.clickInsights tbody tr.dt-hasChild+tr td.details .details-desc {
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: 100%;
  padding: 25px;
  border: solid 1px rgba(var(--color-border), 0.15);
  border-radius: 12px;
}

table.clickInsights tbody tr.dt-hasChild+tr td.details .details-desc .blocking-reason,
table.clickInsights tbody tr.dt-hasChild+tr td.details .details-desc .click-data,
table.clickInsights tbody tr.dt-hasChild+tr td.details .details-desc .cst-btn-grp {
  display: flex;
  flex-direction: column;
  gap: var(--gap);
  align-items: start;
  justify-content: start;
  flex-wrap: wrap;
  width: 100%;
}

table.clickInsights tbody tr.dt-hasChild+tr td.details .details-desc .click-data .mapLocation table tr {
  flex-direction: column;
}

table.clickInsights tbody tr.dt-hasChild+tr td.details .details-desc .cst-btn-grp {
  grid-column: 1 / span 2;
  width: 100%;
  flex-direction: row;
  gap: calc(var(--gap) / 2);
}

table.clickInsights tbody tr.dt-hasChild+tr td.details .details-desc .cst-btn-grp .close {
  margin-left: auto;
}

@media (max-width: 1399px) {
  table.clickInsights tbody tr.dt-hasChild+tr td.details {
    width: calc(100vw - 335px);
  }
}

@media (max-width: 1275px) {
  table.clickInsights tbody tr.dt-hasChild+tr td.details {
    width: calc(100vw - 115px);
  }
}

@media (max-width: 1099px) {

  /* table.clickInsights > thead {
    display: none;
  } */
  /* table.clickInsights > tbody tr {
    padding: 15px 0;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    column-gap: 8px;
  } */
  table.clickInsights tbody.table-body tr>td:nth-of-type(1) {
    padding-left: 4px;
  }

  /* table.clickInsights > tbody tr td {
    min-height: auto;
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 5px;
    word-break: break-word;
  } */
  table.clickInsights>tbody tr td.suspicious {
    align-items: start;
    justify-content: start;
  }

  table.clickInsights>tbody tr td.details {
    grid-column: 1/span 4;
    flex-direction: row;
    width: 100%;
    column-gap: 0;
  }

  table.clickInsights>tbody tr td.details>div table tr {
    display: flex;
    flex-wrap: wrap;
  }

  table.clickInsights>tbody tr td.details>div table tr>td:last-child {
    word-break: break-all;
  }

  table.clickInsights>tbody tr.active {
    padding: 15px;
  }
}

@media (max-width: 880px) {
  table.clickInsights>tbody>tr {
    grid-template-columns: repeat(3, 1fr);
  }

  table.clickInsights>tbody>tr td.details {
    grid-column: 1/span 3;
    grid-template-columns: 1fr;
  }

  table.clickInsights>tbody>tr td.details>div:nth-child(1) {
    width: 100%;
    padding-right: 0;
  }

  table.clickInsights>tbody>tr td.details>div:nth-child(2) {
    width: 100%;
  }

  table.clickInsights>tbody>tr.active td.details {
    display: grid;
  }

  table.clickInsights tbody tr.dt-hasChild+tr td.details .details-desc {
    display: flex;
    flex-direction: column;
    padding: 12px;
  }
}

@media (max-width: 730px) {
  table.clickInsights>tbody>tr td.details>div:nth-child(3) {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
  }

  table.clickInsights>tbody>tr td.details>div:nth-child(3) button:last-child {
    margin-left: 0;
  }
}

@media (max-width: 639px) {
  table.clickInsights>tbody>tr {
    grid-template-columns: repeat(2, 1fr);
  }

  table.clickInsights>tbody>tr td.details {
    grid-column: 1/span 2;
  }

  table.clickInsights tbody tr.dt-hasChild+tr td.details .click-data table tbody>tr {
    flex-direction: column;
  }
}

@media (max-width: 540px) {
  table.clickInsights>tbody>tr td.details>div:nth-child(3) {
    grid-template-columns: 1fr;
  }

  table.clickInsights>tbody>tr td.details>div .mapLocation {
    display: grid;
    grid-template-columns: 1fr;
  }

  table.clickInsights>tbody>tr td.details>div .mapLocation .mapWrap {
    width: 100%;
    height: 100%;
  }
}

@media (max-width: 449px) {
  table.clickInsights>tbody>tr {
    grid-template-columns: 1fr;
  }

  table.clickInsights>tbody>tr td.details {
    grid-column: 1;
  }

  table.clickInsights>tbody>tr td.details table tr {
    flex-direction: column;
    gap: 5px;
  }
}

@media (max-width: 394px) {
  table.clickInsights>tbody>tr {
    grid-template-columns: 1fr;
  }

  table.clickInsights>tbody>tr td.details>div .timeline>li ul li {
    flex-direction: column;
    gap: 7px;
  }
}

.trafficSavingsClicks .--totalTraffic {
  align-self: stretch;
}

.trafficSavingsClicks .--totalTraffic .widgetTitle {
  align-items: center;
}

.trafficSavingsClicks .--totalTraffic .widgetTitle .labels,
.source-tab-content .trafficSavingsClicks .widgetTitle .labels {
  margin-left: auto;
  display: flex;
  flex-direction: row;
  gap: 10px;
}

.trafficSavingsClicks .--totalTraffic .widgetTitle .labels span,
.source-tab-content .trafficSavingsClicks .widgetTitle .labels span {
  display: flex;
  flex-direction: row;
  gap: 5px;
  align-items: center;
}

.trafficSavingsClicks .--totalTraffic .widgetTitle .labels span::before,
.source-tab-content .trafficSavingsClicks .widgetTitle .labels span::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 4px;
  background-color: rgba(var(--color-border), 0.24);
}

.trafficSavingsClicks .--totalTraffic .widgetTitle .labels span[data-label=blue]::before,
.source-tab-content .trafficSavingsClicks .widgetTitle .labels span[data-label=blue]::before {
  background-color: rgb(var(--color-button));
}

.trafficSavingsClicks .--totalTraffic .widgetTitle .labels span[data-label=green]::before,
.source-tab-content .trafficSavingsClicks .widgetTitle .labels span[data-label=green]::before {
  background-color: rgb(var(--color-label-green));
}

.trafficSavingsClicks .--totalTraffic .widgetTitle .labels span[data-label=red]::before,
.source-tab-content .trafficSavingsClicks .widgetTitle .labels span[data-label=red]::before {
  background-color: rgb(var(--color-label-red));
}
.trafficSavingsClicks .--totalTraffic .widgetTitle .labels span[data-label=orange]::before,
.source-tab-content .trafficSavingsClicks .widgetTitle .labels span[data-label=orange]::before {
  background-color: rgb(var(--color-label-orange));
}

.trafficSavingsClicks .--totalTraffic #trafficChart {
  width: calc(100% + 20px);
  margin-left: -10px;
  position: relative;
}

.trafficSavingsClicks .--totalTraffic #trafficChart::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  background-color: #f2fbfe;
  top: 0;
  left: 0;
  border-radius: var(--radius);
}

.trafficSavingsClicks .--totalTraffic #trafficChart .apexcharts-yaxis-texts-g text:not(:nth-child(1), :nth-last-child(1)) {
  display: none;
}

.trafficSavingsClicks [data-width="3"] {
  display: flex;
  flex-direction: column;
  gap: var(--gap);
}

.trafficSavingsClicks [data-width="3"] .--savings {
  flex: 1;
}

.trafficSavingsClicks [data-width="3"] .--clicks {
  flex: 1;
  gap: 10px;
}

.trafficSavingsClicks [data-width="3"] .--clicks .canvasWrap {
  max-width: 125px;
  margin: 0 auto;
  position: relative;
}

.trafficSavingsClicks [data-width="3"] .--clicks .canvasWrap .center {
  position: absolute;
  top: 53%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 1rem;
  font-weight: 600;
  font-size: 1.2rem;
}

@media (max-width: 880px) {
  .trafficSavingsClicks {
    grid-template-columns: 1fr 1fr;
  }

  .trafficSavingsClicks .--totalTraffic {
    grid-column: span 2;
  }

  .trafficSavingsClicks [data-width="3"] {
    grid-column: span 2;
    grid-row: 1;
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .trafficSavingsClicks [data-width="3"] .--savings {
    height: 100%;
  }
}

@media (max-width: 539px) {
  .trafficSavingsClicks .--totalTraffic {
    display: none;
  }

  .trafficSavingsClicks [data-width="3"] {
    grid-template-columns: 1fr;
  }
}

.fraudStatistics {
  align-items: center;
}

.fraudStatistics .chartWrap {
  transform: rotate(180deg);
}

.fraudStatistics .widget.stats {
  border-radius: 0;
  padding: var(--gap) 0;
  background-color: transparent;
  gap: 15px;
}

.fraudStatistics .widget.stats .widgetTitle {
  color: rgb(var(--color-text));
}

.fraudStatistics .widget.stats ul {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: var(--gap);
  row-gap: 0;
}

.fraudStatistics .widget.stats ul li {
  padding: 10px 0;
  border-bottom: solid 1px rgba(var(--color-border), 0.24);
  display: grid;
  grid-template-columns: 1fr 45px;
  row-gap: 5px;
  column-gap: 15px;
}

.fraudStatistics .widget.stats ul li .label {
  width: 100%;
  text-transform: uppercase;
  font-size: 0.75rem;
  letter-spacing: 0.3;
  grid-column: 1/span 2;
}

.fraudStatistics .widget.stats ul li .label[data-label=blue] {
  color: rgb(var(--color-button));
}

.fraudStatistics .widget.stats ul li .label[data-label=purple] {
  color: rgb(var(--color-label-purple));
}

.fraudStatistics .widget.stats ul li .label[data-label=pink] {
  color: rgb(var(--color-label-pink));
}

.fraudStatistics .widget.stats ul li .label[data-label=green] {
  color: rgb(var(--color-label-green));
}

.fraudStatistics .widget.stats ul li .label[data-label=yellow] {
  color: rgb(var(--color-label-yellow));
}

.fraudStatistics .widget.stats ul li .label[data-label=orange] {
  color: rgb(var(--color-label-orange));
}

@media (max-width: 1099px) {
  .fraudStatistics[data-grid] {
    grid-template-columns: 325px 1fr;
  }

  .fraudStatistics .chart {
    grid-column: 1;
  }

  .fraudStatistics .stats {
    grid-column: 2;
  }
}

@media (max-width: 900px) {
  .fraudStatistics {
    align-items: start;
  }

  .fraudStatistics .widget.stats ul {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 639px) {
  .fraudStatistics {
    grid-column: span 2;
    gap: 0;
  }

  .fraudStatistics[data-grid] {
    grid-template-columns: 1fr;
  }

  .fraudStatistics .widget.stats {
    grid-column: 1;
  }
}

@media (max-width: 959px) {

  /* table[data-table=last-blue] tr {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-bottom: solid 1px rgba(var(--color-border), 0.24);
    padding: 15px 0;
    gap: 10px;
  } */
  /* table[data-table=last-blue] tr:last-child {
    border-bottom: none;
    padding-bottom: 0;
  } */
  /* table[data-table=last-blue] tr:first-child {
    padding-top: 0;
  } */
  /* table[data-table=last-blue] tr td {
    border-bottom: none;
    width: 100%;
    padding: 10px 0;
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: 5px;
    align-items: start;
  } */
  /* table[data-table=last-blue] tr td:nth-last-of-type(3), table[data-table=last-blue] tr td:nth-last-of-type(2), table[data-table=last-blue] tr td:nth-last-of-type(1) {
    text-align: left;
  } */
  table[data-table=last-blue] tr td .tdTitle {
    min-width: 80px;
    text-transform: uppercase;
    color: rgb(var(--color-border));
    font-size: 12px;
  }
}

[data-props*=stick] {
  position: sticky;
  top: calc(var(--size-header) + var(--gutter));
}

@media (max-width: 880px) {
  [data-props*=stick] {
    position: relative;
    top: auto;
  }
}

[data-props*=expand] {
  flex: 1;
}

:host {
  --color-bg-default: #fff;
  --color-bg-secondary: #f9f9f9;
  --color-fg-default: #333;
  --color-fg-primary: #66cef5;
  --color-fg-secondary: #748194;
  --color-fg-selected: #fff;
  --color-fg-muted: #9e9e9e;
  --color-fg-accent: #e63757;
  --color-btn-primary-bg: #fff;
  --color-btn-primary-fg: #6b82ff;
  --color-btn-primary-border: #6b82ff;
  --color-btn-primary-hover-bg: #6b82ff;
  --color-btn-primary-hover-fg: #fff;
  --color-btn-primary-hover-border: #6b82ff;
  --color-btn-primary-disabled-bg: #a2b0ff;
  --color-btn-primary-disabled-fg: #fff;
  --color-btn-primary-disabled-border: #a2b0ff;
  --color-btn-secondary-bg: #fff;
  --color-btn-secondary-fg: #748194;
  --color-btn-secondary-border: #748194;
  --color-btn-secondary-hover-bg: #748194;
  --color-btn-secondary-hover-fg: #fff;
  --color-btn-secondary-hover-border: #748194;
  --color-btn-secondary-disabled-bg: #b5bbc4;
  --color-btn-secondary-disabled-fg: #fff;
  --color-btn-secondary-disabled-border: #b5bbc4;
  --color-border-default: #ddd;
  --color-border-locked: #f9f9f9;
  --day-width: 42px;
  --day-height: 37px;
  --border-radius: 2px;
  --primary-color: #6b82ff;
  --secondary-color: #748194;
  --white-color: #fff;
  --black-color: #333;
  --lightgray-color: #f9f9f9;
  --gray-color: #9e9e9e;
  --red-color: #e63757;
}

* {
  box-sizing: border-box;
}

.container {
  width: 100%;
  border-radius: 4px;
  color: var(--color-fg-default);
  cursor: default;
  display: inline-block;
  font-size: 0.8em;
  height: 0;
  overflow: hidden;
  pointer-events: all;
  position: absolute;
  transform: scale(0);
}

.container.calc {
  height: auto;
  transform: none;
  transition: none;
  visibility: hidden;
}

.container.show {
  box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
  height: auto;
  transform: scale(1);
}

.container.inline {
  height: auto;
  left: 0;
  position: relative;
  top: 0;
  transform: scaleY(1);
}

.container>main {
  background-color: var(--color-bg-default);
}

.container>footer,
.container>header {
  background-color: var(--color-bg-secondary);
  padding: 10px;
}

.container>footer .footer-buttons {
  -moz-column-gap: 5px;
  column-gap: 5px;
  display: flex;
  justify-content: flex-end;
}

.container>footer .footer-buttons>button {
  background-color: transparent;
  border: 1px solid transparent;
  border-radius: var(--border-radius);
  cursor: pointer;
  padding: 5px 10px;
}

.container>footer .footer-buttons>button.apply-button {
  background-color: var(--color-btn-primary-bg);
  border-color: var(--color-btn-primary-border);
  color: var(--color-btn-primary-fg);
}

.container>footer .footer-buttons>button.apply-button:hover {
  background-color: var(--color-btn-primary-hover-bg);
  border-color: var(--color-btn-primary-hover-border);
  color: var(--color-btn-primary-hover-fg);
}

.container>footer .footer-buttons>button.apply-button:disabled {
  background-color: var(--color-btn-primary-disabled-bg);
  border-color: var(--color-btn-primary-disabled-border);
  color: var(--color-btn-primary-disabled-fg);
  cursor: default;
}

.container>footer .footer-buttons>button.cancel-button {
  background-color: var(--color-btn-secondary-bg);
  border-color: var(--color-btn-secondary-border);
  color: var(--color-btn-secondary-fg);
}

.container>footer .footer-buttons>button.cancel-button:hover {
  background-color: var(--color-btn-secondary-hover-bg);
  border-color: var(--color-btn-secondary-hover-border);
  color: var(--color-btn-secondary-hover-fg);
}

.container>footer .footer-buttons>button.cancel-button:disabled {
  background-color: var(--color-btn-secondary-disabled-bg);
  border-color: var(--color-btn-secondary-disabled-border);
  color: var(--color-btn-secondary-disabled-fg);
  cursor: default;
}

.grid-1 {
  grid-template-columns: repeat(1, 1fr);
}

.grid-2 {
  grid-template-columns: repeat(2, 1fr);
}

.grid-3 {
  grid-template-columns: repeat(3, 1fr);
}

.grid-4 {
  grid-template-columns: repeat(4, 1fr);
}

.grid-5 {
  grid-template-columns: repeat(5, 1fr);
}

.grid-6 {
  grid-template-columns: repeat(6, 1fr);
}

.grid-7 {
  grid-template-columns: repeat(7, 1fr);
}

.grid-8 {
  grid-template-columns: repeat(8, 1fr);
}

.grid-9 {
  grid-template-columns: repeat(9, 1fr);
}

.grid-10 {
  grid-template-columns: repeat(10, 1fr);
}

.grid-11 {
  grid-template-columns: repeat(11, 1fr);
}

.grid-12 {
  grid-template-columns: repeat(12, 1fr);
}

.calendars {
  display: grid;
}

.calendars:not(.grid-1) .calendar>.header .month-name {
  order: 2;
  text-align: center;
}

.calendars:not(.grid-1) .calendar>.header .previous-button {
  order: 1;
  visibility: hidden;
}

.calendars:not(.grid-1) .calendar>.header .next-button {
  order: 3;
  visibility: hidden;
}

.calendars:not(.grid-1) .calendar:first-child>.header .previous-button,
.calendars:not(.grid-1) .calendar:last-child>.header .next-button {
  visibility: visible;
}

.calendar {
  padding: 10px;
  padding-left: 0;
}

.calendar+.calendar {
  padding-right: 0;
}

.calendar>.header {
  align-items: center;
  -moz-column-gap: 5px;
  column-gap: 5px;
  display: flex;
  justify-content: space-between;
}

.calendar>.header .month-name {
  flex: 1;
  font-size: 15px;
  font-weight: 600;
}

.calendar>.header button {
  min-width: auto;
  align-items: center;
  background-color: transparent;
  border: 1px solid transparent;
  border-radius: 2px;
  color: var(--color-btn-secondary-fg);
  cursor: pointer;
  display: flex;
  justify-content: center;
  padding: 4px 7px;
}

.calendar>.header button.previous-button {
  position: relative;
}

.calendar>.header button.previous-button::before {
  content: url(../images/icons/icon-arrow-dropdown.svg);
  transform: rotate(90deg);
}

.calendar>.header button.next-button {
  position: relative;
}

.calendar>.header button.next-button::before {
  content: url(../images/icons/icon-arrow-dropdown.svg);
  transform: rotate(-90deg);
}

.calendar>.header button>img,
.calendar>.header button>svg {
  fill: var(--color-btn-secondary-fg);
  color: var(--color-btn-secondary-fg);
  pointer-events: none;
  transform: scale(0.7);
}

.calendar>.daynames-row,
.calendar>.days-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 0;
}

.calendar>.daynames-row>.day,
.calendar>.daynames-row>.dayname,
.calendar>.days-grid>.day,
.calendar>.days-grid>.dayname {
  align-items: center;
  cursor: default;
  display: flex;
  flex-direction: column;
  font-size: 13px;
  justify-content: center;
}

.calendar>.daynames-row>.dayname {
  color: var(--color-fg-muted);
  font-size: 12px;
  padding: 5px 0;
}

.calendar>.days-grid>.day {
  aspect-ratio: 1/1;
  z-index: 2;
  position: relative;
}

.calendar>.days-grid>.day:hover::before {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  content: "";
  width: 100%;
  aspect-ratio: 1/1;
  border-radius: 50px;
  background-color: rgb(var(--color-tHead));
  z-index: -1;
}

.calendar>.days-grid>.day.today {
  font-weight: 600;
}

.calendar>.days-grid>.day.selected {
  color: var(--color-fg-selected);
}

.calendar>.days-grid>.day.selected::before {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  content: "";
  width: 100%;
  aspect-ratio: 1/1;
  border-radius: 50px;
  background-color: var(--color-fg-primary);
  z-index: -1;
}

@media (max-width: 480px) {
  .container:not(.inline) {
    transform: scaleY(0) !important;
    transform-origin: bottom center !important;
  }

  .container:not(.inline).show {
    bottom: 0 !important;
    left: 0 !important;
    position: fixed !important;
    right: 0 !important;
    top: auto !important;
    transform: scaleY(1) !important;
  }

  .container {
    width: 100%;
  }

  .calendars {
    grid-template-columns: repeat(1, 1fr);
  }

  .calendars .calendar {
    box-sizing: border-box;
    width: 100%;
  }

  .calendars .calendar:nth-child(n+2) {
    display: none;
  }

  .calendars .calendar>.days-grid>.day {
    height: auto;
    max-height: unset;
    max-width: unset;
    min-height: unset;
    min-width: unset;
    width: auto;
  }

  .calendars .calendar>.header:not(.no-next-month) .next-button {
    visibility: visible;
  }
}

:host {
  --color-fg-locked: #9e9e9e;
  --color-bg-locked: #ffab91;
  --color-bg-unavailable: #f9f9f9;
}

.container.lock-plugin .calendars .calendar:first-child>.header.no-previous-month .previous-button,
.container.lock-plugin .calendars .calendar:last-child>.header.no-next-month .next-button {
  visibility: hidden;
}

.container.lock-plugin .calendar>.days-grid>.day.not-available {
  background-color: var(--color-bg-unavailable);
  color: var(--color-fg-locked);
  font-style: italic;
  pointer-events: none;
}

.container.lock-plugin .calendar>.days-grid>.day.locked {
  background-color: transparent;
  border: 1px solid var(--color-border-locked);
  color: var(--color-fg-locked);
  pointer-events: none;
}

.container.lock-plugin .calendar>.days-grid>.day.locked:not(.start):not(.end) {
  background-image: repeating-linear-gradient(135deg, transparent, var(--color-bg-locked) 2px, transparent 2px, transparent 4px);
  font-style: italic;
}

.container.lock-plugin .preset-plugin-container>button:disabled {
  color: var(--color-fg-locked);
  pointer-events: none;
}

.container.preset-plugin>main {
  display: flex;
}

.container.preset-plugin>main.preset-left {
  flex-direction: row-reverse;
}

.container.preset-plugin>main.preset-right {
  flex-direction: row;
}

.container.preset-plugin>main.preset-left .preset-plugin-container,
.container.preset-plugin>main.preset-right .preset-plugin-container {
  flex-direction: column;
  width: 130px;
}

.container.preset-plugin>main.preset-top {
  flex-direction: column-reverse;
}

.container.preset-plugin>main.preset-bottom {
  flex-direction: column;
}

.container.preset-plugin>main.preset-bottom .preset-plugin-container,
.container.preset-plugin>main.preset-top .preset-plugin-container {
  flex-direction: row;
  flex-wrap: wrap;
}

.preset-plugin-container {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-bottom: 15px;
  padding-top: 15px;
  border-bottom: solid 1px rgba(var(--color-border), 0.24);
}

.preset-plugin-container>button {
  color: rgb(91, 104, 109);
  background-color: rgba(160, 168, 171, 0.15);
  padding: 0 10px;
  border-radius: 50px;
  min-height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.875rem;
  font-weight: 600;
}

:host {
  --color-bg-inrange: #d5dbff;
  --color-bg-tooltip: #fff;
  --color-fg-tooltip: #333;
}

.range-plugin-tooltip {
  background-color: var(--color-bg-tooltip);
  border-radius: var(--border-radius);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
  color: var(--color-fg-tooltip);
  font-size: 12px;
  margin-top: -4px;
  padding: 4px 8px;
  pointer-events: none;
  position: absolute;
  visibility: hidden;
  white-space: nowrap;
  z-index: 1;
}

.range-plugin-tooltip:before {
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid rgba(0, 0, 0, 0.12);
  bottom: -5px;
  content: "";
  left: calc(50% - 5px);
  position: absolute;
}

.range-plugin-tooltip:after {
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid var(--color-bg-tooltip);
  bottom: -4px;
  content: "";
  left: calc(50% - 4px);
  position: absolute;
}

.container.range-plugin .calendar>.days-grid>.day {
  position: relative;
  aspect-ratio: 1/1;
}

.container.range-plugin .calendar>.days-grid>.day.in-range:last-of-type {
  border-bottom-right-radius: var(--border-radius);
  border-top-right-radius: var(--border-radius);
}

.container.range-plugin .calendar>.days-grid>.day.in-range {
  background-color: rgb(232, 234, 235);
  border-radius: 0;
}

.container.range-plugin .calendar>.days-grid>.day.end,
.container.range-plugin .calendar>.days-grid>.day.start {
  color: var(--color-fg-selected);
}

.container.range-plugin .calendar>.days-grid>.day.end::before,
.container.range-plugin .calendar>.days-grid>.day.start::before {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  content: "";
  width: 100%;
  aspect-ratio: 1/1;
  border-radius: 50px;
  background-color: var(--color-fg-primary);
  z-index: -1;
}

.container.range-plugin .calendar>.days-grid>.day.start::after {
  content: "";
  width: 50%;
  aspect-ratio: 1/2;
  position: absolute;
  top: 0;
  right: 0;
  background-color: rgb(var(--color-tHead));
  z-index: -2;
}

.container.range-plugin .calendar>.days-grid>.day.start.flipped::after {
  right: auto;
  left: 0;
}

.container.range-plugin .calendar>.days-grid>.in-range:nth-last-of-type(1) {
  border-top-right-radius: 50px;
  border-bottom-right-radius: 50px;
}

.container.range-plugin .calendar>.days-grid>.day.end::after {
  content: "";
  width: 50%;
  aspect-ratio: 1/2;
  position: absolute;
  top: 0;
  left: 0;
  background-color: rgb(var(--color-tHead));
  z-index: -2;
}

.container.range-plugin .calendar>.days-grid>.day.end.flipped::after {
  left: auto;
  right: 0;
}

.container.range-plugin .calendar>.days-grid>.day.start.end:after {
  content: none;
}

.container.range-plugin .calendar>.days-grid>div:not(.day)+.day.in-range {
  border-bottom-left-radius: var(--border-radius);
  border-top-left-radius: var(--border-radius);
}

.container.range-plugin .calendar>.days-grid>div:nth-child(7n).in-range {
  border-bottom-right-radius: var(--border-radius);
  border-top-right-radius: var(--border-radius);
}

.container.range-plugin .calendar>.days-grid>div:nth-child(7n+1).in-range {
  border-bottom-left-radius: var(--border-radius);
  border-top-left-radius: var(--border-radius);
}

.container.preset-plugin main {
  display: grid;
}

.container.preset-plugin main.preset-left>.calendars,
.container.preset-plugin main.preset-top>.calendars {
  order: 2;
}

.container.preset-plugin main.preset-left>.preset-plugin-container,
.container.preset-plugin main.preset-top>.preset-plugin-container {
  order: 1;
}

.container.preset-plugin main.preset-left,
.container.preset-plugin main.preset-right {
  grid-template-columns: auto auto;
}

.container.preset-plugin main.preset-left .preset-plugin-container,
.container.preset-plugin main.preset-right .preset-plugin-container {
  grid-row: span 2;
  width: 130px;
}

.container.preset-plugin main.preset-bottom>.preset-plugin-container {
  order: 4;
}

.container.preset-plugin main.preset-bottom,
.container.preset-plugin main.preset-top {
  grid-template-columns: auto;
}

.container.preset-plugin main>.time-plugin-container {
  order: 3;
}

.container>main:not([class*=preset-]) {
  flex-direction: column;
}

.time-plugin-container {
  background-color: var(--color-bg-secondary);
  border-bottom: 1px solid var(--color-border-default);
  display: flex;
  justify-content: space-around;
  padding: 10px;
}

.time-plugin-container input[type=time] {
  font-size: 18px;
}

.time-plugin-container input[type=time],
.time-plugin-container select {
  background-color: var(--color-bg-default);
  border: 1px solid transparent;
  border-radius: 4px;
  color: var(--color-fg-default);
}

.time-plugin-container select {
  margin: 0 3px;
}

.container.amp-plugin .calendars .calendar>.header .month-name {
  align-items: center;
  -moz-column-gap: 5px;
  column-gap: 5px;
  display: flex;
  justify-content: center;
}

.container.amp-plugin .calendars .calendar>.header .month-name select {
  border: none;
  font-size: 14px;
  padding: 3px;
}

.container.amp-plugin .calendars .calendar>.header .month-name select.month-name--dropdown {
  font-weight: 700;
}

.container.amp-plugin .calendars .calendar>.header .reset-button {
  order: 4;
}

.container.amp-plugin .calendars.calendars:not(.grid-1) .calendar>.header .reset-button {
  visibility: hidden;
}

.container.amp-plugin .calendars.calendars:not(.grid-1) .calendar:last-child>.header .reset-button {
  visibility: visible;
}

.container.amp-plugin.week-numbers .calendar>.daynames-row,
.container.amp-plugin.week-numbers .calendar>.days-grid {
  grid-template-columns: 30px repeat(7, 1fr);
}

.container.amp-plugin.week-numbers .calendar>.daynames-row .wnum-header,
.container.amp-plugin.week-numbers .calendar>.daynames-row .wnum-item,
.container.amp-plugin.week-numbers .calendar>.days-grid .wnum-header,
.container.amp-plugin.week-numbers .calendar>.days-grid .wnum-item {
  align-items: center;
  color: var(--color-fg-muted);
  display: flex;
  font-size: 12px;
  justify-content: center;
}

.container[data-theme=dark] {
  --color-bg-default: #22272e;
  --color-bg-secondary: #2d333b;
  --color-bg-inrange: #2c542e;
  --color-bg-locked: #ec775c;
  --color-bg-unavailable: #545d68;
  --color-bg-tooltip: #9e9e9e;
  --color-fg-default: #adbac7;
  --color-fg-primary: #46954a;
  --color-fg-secondary: #202122;
  --color-fg-muted: #9e9e9e;
  --color-fg-accent: #ec775c;
  --color-fg-locked: #9e9e9e;
  --color-btn-primary-bg: #2d333b;
  --color-btn-primary-fg: #46954a;
  --color-btn-primary-border: #46954a;
  --color-btn-primary-hover-bg: #46954a;
  --color-btn-primary-hover-fg: #fff;
  --color-btn-primary-hover-border: #46954a;
  --color-btn-secondary-bg: #2d333b;
  --color-btn-secondary-fg: #adbac7;
  --color-btn-secondary-border: #adbac7;
  --color-btn-secondary-hover-bg: #adbac7;
  --color-btn-secondary-hover-fg: #202122;
  --color-btn-secondary-hover-border: #adbac7;
  --color-border-default: #373e47;
  --color-border-locked: #2d333b;
}

input#datepicker,
input#summary-datepicker {
  display: none;
}

@media (max-width: 739px) {
  .preset-plugin-container>button {
    font-size: 0.75rem;
  }
}

@media (max-width: 463px) {
  .preset-plugin-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
  }

  .preset-plugin-container>button {
    width: 100%;
  }
}

@media (max-width: 373px) {
  .preset-plugin-container {
    grid-template-columns: repeat(2, 1fr);
  }
}

.registerAd {
  padding: var(--gap);
  display: flex;
  flex-direction: column;
  height: 100%;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: white;
  border-radius: var(--radius);
  background-color: #031720;
  background-image: url(../images/ad-register-background.png);
  background-size: cover;
  overflow: hidden;
}

.registerAd .wrap {
  width: 100%;
  height: 90%;
  max-width: 500px;
  display: flex;
  flex-direction: column;
  gap: calc(var(--gap) * 2);
  justify-content: space-between;
}

.registerAd .wrap>article:nth-of-type(1) p {
  color: rgba(255, 255, 255, 0.5);
}

.registerAd .wrap>article:nth-of-type(2) {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: var(--gap);
}

.registerAd .wrap>article:nth-of-type(2)>div {
  position: relative;
}

.registerAd .wrap>article:nth-of-type(2)>div::before {
  content: url(../images/circles.svg);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.registerAd .wrap>article:nth-of-type(2) ul {
  list-style: none;
  display: flex;
  flex-direction: column;
  text-align: left;
  margin: 0;
  padding: 0;
  align-items: start;
}

.registerAd .wrap>article:nth-of-type(2) ul li {
  flex: 0;
  position: relative;
}

.registerAd .wrap>article:nth-of-type(2) ul li::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  top: 50%;
  left: 0;
  background-color: rgb(var(--color-button));
  opacity: 0.8;
}

.registerAd .logos {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

.loginAd {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
  padding: var(--gap);
  display: flex;
  align-items: center;
}

.loginAd .wrap {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 500px;
  height: 90%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.loginAd .wrap p {
  font-size: 1.125rem;
  color: rgba(0, 0, 0, 0.5);
}

.loginAd .wrap article:not(.logos) {
  display: flex;
  flex-direction: column;
  gap: var(--gap);
}

.loginAd .wrap .logos {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: calc(var(--gap) / 2) var(--gap);
  background-color: rgba(255, 255, 255, 0.36);
  border-radius: 50px;
  backdrop-filter: blur(12px);
}

.loginAd>img {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: var(--radius);
}

.hidden {
  display: none;
}

.reg-step-3 {
  width: 100%;
}

.reg-step-3 .step-3 {
  height: 100%;
}

.my-auto {
  margin-top: auto;
  margin-bottom: auto;
}

.w-100 {
  width: 100% !important;
}
.w-75 {
  width: 75% !important;
  margin: auto;
  @media (max-width: 768px) {
    width: 100% !important;
  }
}
.h-100 {
  height: 100%;
}

.ml-auto {
  margin-left: auto;
}

.flex-cnt {
  display: flex !important;
  gap: 4px;
  align-items: center;
}

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

button:focus-visible {
  outline: none;
}

/* data-table css */
.dataTables_wrapper .dataTables_filter label {
  margin-bottom: 8px;
  font-size: 14px;
  display: grid;
}

.dataTables_wrapper .dataTables_filter input,
.cst-search {
  background-color: rgba(0, 0, 0, 0.06);
  border: none !important;
  max-width: 400px;
  background-size: 17px;
  margin-bottom: 8px;
}

.dataTables_wrapper .dataTables_length label {
  margin-bottom: 8px;
  font-size: 12px;
  color: rgba(var(--color-text), 0.36);
}

.dataTables_wrapper .dataTables_length label select {
  width: 80px;
  border-radius: 4px;
  background-color: transparent;
}

.dataTables_wrapper .dataTables_info {
  margin-top: 20px;
  font-size: 14px;
  color: rgba(var(--color-text), 0.7);
  float: left;
  margin-right: 20px;
}

/* pagination */
.dataTables_wrapper .dataTables_paginate {
  position: relative;
  float: right;
  text-align: right;
  margin-top: 10px;
  display: flex;
  align-items: center;
  column-gap: 20px;
  color: rgba(var(--color-text), 0.75);
  max-width: 100%;
  min-height: 35px;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
  padding: 9px 14px;
  border-radius: 4px;
}

.dataTables_wrapper .dataTables_paginate span {
  display: flex;
  align-items: center;
  column-gap: 4px;
  overflow: auto;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.current {
  cursor: pointer;
  background-color: rgb(var(--color-background));
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled {
  opacity: 0.5;
  pointer-events: none;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.previous:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.next:hover {
  background-color: transparent;
  color: rgb(var(--color-text));
}

.dataTables_wrapper .dataTables_empty,
.no-rec-found {
  text-align: center;
  font-size: 20px;
  padding: 50px 20px;
  color: rgb(var(--color-header-text)) !important;
}

.pricingPlans {
  padding-top: calc(var(--gap) * 0.5);
  display: flex;
  flex-direction: column;
  gap: var(--gap);
  align-items: center;
}

.pricingPlans>div {
  width: 90%;
  max-width: 500px;
  text-align: center;
}

.pricingPlans>div:first-of-type {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.pricingPlans>div:first-of-type h4 {
  color: rgb(var(--color-button));
}

.pricingPlans>div:first-of-type p {
  color: rgba(var(--color-text), 0.36);
}

.pricingPlans>div:nth-of-type(2) .contactTxt {
  display: none;
}

.pricingPlans>div:nth-of-type(3) .switchWrap {
  margin: 0 auto;
  max-width: 320px;
  display: grid;
  grid-template-columns: repeat(4, auto);
  grid-template-rows: 1;
  align-items: center;
  gap: 1rem;
}

.pricingPlans>div:nth-of-type(3) .switchWrap>* {
  grid-row: 1;
  margin: 0;
}

.pricingPlans>div:nth-of-type(3) .switchWrap p {
  grid-column: 3;
  grid-row: 1;
}

.pricingPlans>div:nth-of-type(3) .switchWrap p+p {
  grid-column: 1;
  color: rgb(var(--color-button));
}

.pricingPlans>div:nth-of-type(3) .switchWrap input:checked+p {
  color: rgb(var(--color-button));
}

.pricingPlans>div:nth-of-type(3) .switchWrap input:checked+p+p {
  color: rgb(var(--color-text));
}

.pricingPlans>div:nth-of-type(3) .switchWrap span {
  color: rgb(var(--color-button));
  grid-column: 4;
  border: solid 1px rgb(var(--color-button));
  border-radius: 20px;
  height: 36px;
  padding: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}

.pricingPlans>div:nth-of-type(4) {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.pricingPlans>div:nth-of-type(5) {
  margin-top: 30px;
}

.pricingPlans>div:nth-of-type(5) button {
  margin: 0 auto;
  padding: 12px 30px;
  font-size: 1.1rem;
}

.pricingPlans>div:nth-of-type(6) {
  margin-top: var(--gap);
  background: rgb(var(--color-widget-background));
  border-radius: var(--radius);
  padding: 10px var(--gap);
  font-size: 1.2rem;
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.06);
}

.pricingPlans>div:nth-of-type(6) ul {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.pricingPlans>div:nth-of-type(6) ul li {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  padding: 20px 0;
  border-bottom: solid 1px rgba(var(--color-border), 0.12);
}

.pricingPlans>div:nth-of-type(6) ul li:last-child {
  border-bottom: none;
}

.pricingPlans>div:nth-of-type(6) ul li::before {
  content: var(--icon-whitelist);
}

.pricingPlans>div:nth-of-type(7) {
  margin-top: var(--gap);
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--gap);
}

.pricingPlans>div:nth-of-type(7) img {
  width: auto;
  max-height: 36px;
}

.pricingPlans>div:last-of-type {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-bottom: 60px;
}

.pricingPlans>div:last-of-type h2 {
  font-weight: 700;
  color: rgba(var(--color-border), 0.72);
  line-height: 1;
}

.pricingPlans>div [data-contact] {
  display: none;
}

#popupWrap {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 99;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  visibility: collapse;
}

#popupWrap::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: rgba(var(--color-text), 0.12);
  opacity: 0;
  transition: backdrop-filter 0.1s ease;
}

#popupWrap .popup {
  position: relative;
  z-index: 3;
  width: 80%;
  max-width: 550px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  flex-direction: column;
  padding: 1.562rem 1.875rem;
  background-color: rgba(var(--color-widget-background), 1);
  border-radius: var(--radius);
  align-self: start;
  gap: var(--gap);
  text-align: center;
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.06);
  opacity: 0;
  transform: translateY(100px);
  transition: all 0.15s ease;
  @media (max-width: 767px) {
    max-width: max-content;
  }
}

#popupWrap .popup .title {
  font-weight: 600;
  display: flex;
  flex-direction: column;
  gap: calc(var(--gap) / 4);
  align-items: center;
  justify-content: center;
}

#popupWrap .popup .title::before {
  content: var(--icon-alert);
}

#popupWrap .popup .actions {
  display: flex;
  flex-direction: row;
  gap: calc(var(--gap) / 3);
  justify-content: center;
}

#popupWrap.active {
  visibility: visible;
}

#popupWrap.active::before {
  opacity: 1;
  transition: opacity 0.1s ease;
}

#popupWrap.active .popup {
  opacity: 1;
  transform: translateY(0);
  transition: all 0.15s ease;
}

#loader {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 99;
  background-color: rgba(var(--color-text), 0.36);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: collapse;
  transition: opacity 0.3s ease, visibility 0s ease 0.3s;
}

#loader.active {
  visibility: visible;
  opacity: 1;
  transition: visibility 0s ease, opacity 0.3s ease;
}

#loader .loader {
  width: 3px;
  height: 3px;
  display: block;
  margin: 10px auto;
  position: relative;
  border-radius: 4px;
  color: #FFF;
  background: currentColor;
  box-sizing: border-box;
  animation: animloader 0.3s 0.3s linear infinite alternate;
}

#loader .loader::after,
#loader .loader::before {
  content: "";
  box-sizing: border-box;
  width: 3px;
  height: 3px;
  border-radius: 4px;
  background: currentColor;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 10px;
  animation: animloader 0.3s 0.45s linear infinite alternate;
}

#loader .loader::after {
  top: -10px;
  animation-delay: 0s;
}

/* Functional styling;
 * These styles are required for noUiSlider to function.
 * You don't need to change these rules to apply your design.
 */
.noUi-target,
.noUi-target * {
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-user-select: none;
  -ms-touch-action: none;
  touch-action: none;
  -ms-user-select: none;
  -moz-user-select: none;
  user-select: none;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.noUi-target {
  position: relative;
}

.noUi-base,
.noUi-connects {
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 1;
}

/* Wrapper for all connect elements.
*/
.noUi-connects {
  overflow: hidden;
  z-index: 0;
}

.noUi-connect,
.noUi-origin {
  will-change: transform;
  position: absolute;
  z-index: 1;
  top: 0;
  right: 0;
  height: 100%;
  width: 100%;
  -ms-transform-origin: 0 0;
  -webkit-transform-origin: 0 0;
  -webkit-transform-style: preserve-3d;
  transform-origin: 0 0;
  transform-style: flat;
}

/* Offset direction
*/
.noUi-txt-dir-rtl.noUi-horizontal .noUi-origin {
  left: 0;
  right: auto;
}

/* Give origins 0 height/width so they don't interfere with clicking the
* connect elements.
*/
.noUi-vertical .noUi-origin {
  top: -100%;
  width: 0;
}

.noUi-horizontal .noUi-origin {
  height: 0;
}

.noUi-handle {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  position: absolute;
}

.noUi-touch-area {
  height: 100%;
  width: 100%;
}

.noUi-state-tap .noUi-connect,
.noUi-state-tap .noUi-origin {
  -webkit-transition: transform 0.3s;
  transition: transform 0.3s;
}

.noUi-state-drag * {
  cursor: inherit !important;
}

/* Slider size and handle placement;
*/
.noUi-horizontal {
  height: 4px;
}

.noUi-horizontal .noUi-handle {
  width: 12px;
  height: 12px;
  right: -4px;
  top: -4px;
  border-radius: 12px;
  outline: 5px solid;
  outline-color: rgba(var(--color-button), 0.24);
  transition: outline 0.2s ease-out;
}

.noUi-horizontal .noUi-handle:hover {
  cursor: pointer;
}

.noUi-vertical {
  width: 18px;
}

.noUi-vertical .noUi-handle {
  width: 28px;
  height: 34px;
  right: -6px;
  bottom: -17px;
}

.noUi-txt-dir-rtl.noUi-horizontal .noUi-handle {
  left: -17px;
  right: auto;
}

/* Styling;
* Giving the connect element a border radius causes issues with using transform: scale
*/
.noUi-target {
  background: #EBEDEE;
  border-radius: 4px;
}

.noUi-connects {
  border-radius: 3px;
}

.noUi-connect {
  background: rgb(var(--color-button));
}

/* Handles and cursors;
*/
.noUi-draggable {
  cursor: ew-resize;
}

.noUi-vertical .noUi-draggable {
  cursor: ns-resize;
}

.noUi-handle {
  background: rgb(var(--color-button));
  cursor: default;
}

.noUi-vertical .noUi-handle:before,
.noUi-vertical .noUi-handle:after {
  width: 14px;
  height: 1px;
  left: 6px;
  top: 14px;
}

.noUi-vertical .noUi-handle:after {
  top: 17px;
}

/* Disabled state;
*/
[disabled] .noUi-connect {
  background: #B8B8B8;
}

[disabled].noUi-target,
[disabled].noUi-handle,
[disabled] .noUi-handle {
  cursor: not-allowed;
}

/* Base;
*
*/
.noUi-pips,
.noUi-pips * {
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.noUi-pips {
  position: absolute;
  color: #999;
}

/* Values;
*
*/
.noUi-value {
  position: absolute;
  white-space: nowrap;
  text-align: center;
}

.noUi-value-sub {
  color: #ccc;
  font-size: 10px;
}

/* Markings;
*
*/
.noUi-marker {
  position: absolute;
  background: #CCC;
}

.noUi-marker-sub {
  background: #AAA;
}

.noUi-marker-large {
  background: #AAA;
}

/* Horizontal layout;
*
*/
.noUi-pips-horizontal {
  padding: 10px 0;
  height: 80px;
  top: 100%;
  left: 0;
  width: 100%;
}

.noUi-value-horizontal {
  -webkit-transform: translate(-50%, 50%);
  transform: translate(-50%, 50%);
}

.noUi-rtl .noUi-value-horizontal {
  -webkit-transform: translate(50%, 50%);
  transform: translate(50%, 50%);
}

.noUi-marker-horizontal.noUi-marker {
  margin-left: -1px;
  width: 2px;
  height: 5px;
}

.noUi-marker-horizontal.noUi-marker-sub {
  height: 10px;
}

.noUi-marker-horizontal.noUi-marker-large {
  height: 15px;
}

/* Vertical layout;
*
*/
.noUi-pips-vertical {
  padding: 0 10px;
  height: 100%;
  top: 0;
  left: 100%;
}

.noUi-value-vertical {
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  padding-left: 25px;
}

.noUi-rtl .noUi-value-vertical {
  -webkit-transform: translate(0, 50%);
  transform: translate(0, 50%);
}

.noUi-marker-vertical.noUi-marker {
  width: 5px;
  height: 2px;
  margin-top: -1px;
}

.noUi-marker-vertical.noUi-marker-sub {
  width: 10px;
}

.noUi-marker-vertical.noUi-marker-large {
  width: 15px;
}

.noUi-tooltip {
  display: block;
  position: absolute;
  border-radius: 6px;
  background: #5B686D;
  color: white;
  padding: 0.36rem 1rem;
  text-align: center;
  white-space: nowrap;
  font-size: 14px;
}

.noUi-horizontal .noUi-tooltip {
  -webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  left: 50%;
  bottom: -50px;
}

.noUi-horizontal .noUi-tooltip::before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  top: -4px;
  left: 50%;
  transform: translateX(-50%);
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 5px solid #5B686D;
}

.noUi-vertical .noUi-tooltip {
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  top: 50%;
  right: 120%;
}

.noUi-horizontal .noUi-origin>.noUi-tooltip {
  -webkit-transform: translate(50%, 0);
  transform: translate(50%, 0);
  left: auto;
  bottom: 10px;
}

.noUi-vertical .noUi-origin>.noUi-tooltip {
  -webkit-transform: translate(0, -18px);
  transform: translate(0, -18px);
  top: auto;
  right: 28px;
}

@keyframes animloader {
  0% {
    width: 3px;
  }

  100% {
    width: 30px;
  }
}

@media (max-width: 1399px) {
  :root {
    --gutter: 30px;
  }
}

@media (max-width: 1399px) {
  :root {
    --gutter: 30px;
    --width-sidebar: 250px;
  }
}

@media (max-width: 1399px) {
  :root {
    --gutter: 24px;
    --width-sidebar: 220px;
  }
}

@media (max-width: 460px) {
  :root {
    --size-header: 72px;
  }
}

/*# sourceMappingURL=style.css.map */

.whitespace-normal-imp {
  white-space: normal !important;
}

/* Text color for error message */
.text-red {
  color: #900B09;
}
.mt-4{
  margin-top: 4px;
}
#registerWrap {
  width: 100%;
  min-height: 100svh;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 var(--gap);
}

@media (max-width: 460px) {
  #registerWrap {
    padding: 0 15px;
  }
}

#registerWrap .logoWrap {
  display: flex;
  align-items: center;
  justify-content: center;
}

#registerWrap [data-color=grey] {
  color: rgb(var(--color-border));
}

#registerWrap [data-color=green] {
  color: rgb(var(--color-label-green));
}

#registerWrap [data-size=small] {
  font-size: 14px;
}

#registerWrap [data-icon=lock-green] {
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: center;
}

.registerWrap [data-icon=lock-green]::before {
  content: var(--icon-lock-small-green);
}

.registerWrap [data-text=center] {
  text-align: center;
}

.registerWrap [data-message] {
  width: 100%;
  padding: 12px 15px;
  border-radius: 9px;
  text-align: center;
}

.registerWrap [data-message][data-message=success] {
  background-color: #eafbe7;
  color: rgb(0, 191, 0);
  border: solid 1px rgba(0, 191, 0, 0.5);
}

.registerWrap [data-message][data-message=error] {
  background-color: #ffe5e5;
  color: rgb(var(--color-label-red));
  border: solid 1px rgba(var(--color-label-red), 0.2);
}

#registerWrap .title {
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 0 var(--gap);
}

#registerWrap button[type=submit] {
  width: 100%;
}

#registerWrap [data-icon=arrowBack] {
  align-self: center;
}

#registerWrap .text {
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 5px;
}

#registerWrap .text p {
  display: inline;
}

#registerWrap .text p[data-icon] {
  display: flex;
  flex-direction: row;
  gap: 10px;
}

#registerWrap .text p[data-icon][data-color=green] {
  color: rgb(0, 191, 0);
}

#registerWrap input:not(:focus, :focus-within)[data-icon]:required:valid {
  background-image: url(../images/icons/icon-check-green.svg);
}

#registerWrap input[data-props*=text-center] {
  text-align: center;
}

#registerWrap .switchWrap {
  margin: 0 auto;
  max-width: 320px;
  display: grid;
  grid-template-columns: repeat(4, auto);
  grid-template-rows: 1;
  align-items: center;
  gap: 1rem;
}

#registerWrap .switchWrap>* {
  grid-row: 1;
  margin: 0;
}

#registerWrap .switchWrap p {
  grid-column: 3;
  grid-row: 1;
}

#registerWrap .switchWrap p+p {
  grid-column: 1;
  color: rgb(var(--color-button));
}

#registerWrap .switchWrap input:checked+p {
  color: rgb(var(--color-button));
}

#registerWrap .switchWrap input:checked+p+p {
  color: rgb(var(--color-text));
}

#registerWrap .switchWrap input:checked+p+p+span {
  color: rgb(var(--color-button));
  border-color: rgb(var(--color-button));
}

#registerWrap .switchWrap span {
  color: rgb(var(--color-border));
  grid-column: 4;
  border: solid 1px rgb(var(--color-border));
  border-radius: 20px;
  height: 36px;
  padding: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}

@media (max-width: 430px) {
  #registerWrap .switchWrap {
    grid-template-columns: repeat(3, 1fr);
  }

  #registerWrap .switchWrap span {
    grid-row: 2;
    grid-column: 1/span 3;
  }
}

#registerWrap .sliderWrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  padding-bottom: 50px;
}

#registerWrap .sliderWrap #slider {
  width: 90%;
}

#registerWrap .sliderWrap .noUi-horizontal .noUi-tooltip {
  -webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  left: 50%;
  bottom: -60px;
  font-size: 13px;
  padding: 9px;
}

#registerWrap .sliderWrap .noUi-horizontal .noUi-tooltip::before {
  top: -4px;
}

#registerWrap .wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 15px;
}

@media (max-width: 460px) {
  #registerWrap .wrap {
    grid-template-columns: 1fr;
  }
}

#registerWrap .monthYear {
  display: flex;
  flex-direction: row;
  min-height: 40px;
  border-radius: 50px;
  border: solid 1px rgba(var(--color-border), 0.5);
  padding: 12px calc(var(--gap) / 2);
  color: rgba(var(--color-text), 0.36);
  gap: 5px;
  max-width: 100%;
}

#registerWrap .monthYear input {
  margin: 0;
  padding: 0;
  height: auto;
  min-height: auto;
  border: none;
  border-radius: 0;
  width: 30px;
}

#registerWrap .registerContainer {
  width: 100%;
  min-height: 100svh;
  max-width: 480px;
  padding-top: var(--gap);
  padding-bottom: var(--gap);
  display: flex;
  flex-direction: column;
  gap: var(--gap);
}

#registerWrap .content {
  width: 100%;
  display: flex;
  flex-direction: column;
  margin: auto 0;
  gap: var(--gap);
}

#registerWrap .content form {
  gap: 26px;
}

#registerWrap #popupWrap .popup {
  width: 90%;
  max-width: 640px;
  text-align: left;
  max-height: 90%;
}

@media (max-width: 400px) {
  #registerWrap #popupWrap .popup {
    padding: 20px;
    gap: 20px;
  }
}

#registerWrap #popupWrap .popup .title {
  text-align: left;
  justify-content: start;
  align-items: start;
  padding: 0;
}

#registerWrap #popupWrap .popup .content {
  gap: 15px;
  font-size: 14px;
  margin: 0 0 auto;
  overflow-y: scroll;
  padding-right: 20px;
}

#registerWrap #popupWrap .popup .content::-webkit-scrollbar {
  width: 6px;
  background-color: transparent;
  border-radius: 10px;
}

#registerWrap #popupWrap .popup .content::-webkit-scrollbar-thumb {
  background-color: rgba(var(--color-border), 0.5);
  border-radius: 10px;
}

#registerWrap #popupWrap .popup .content ol li {
  counter-increment: step-counter;
  position: relative;
  padding-left: 30px;
}

#registerWrap #popupWrap .popup .content ol li::before {
  counter-increment: li;
  content: counter(step-counter, decimal-leading-zero) ".";
  position: absolute;
  left: 0;
  top: 1px;
  font-size: 14px;
}

.font-sans-cst {
  font-family: Helvetica, sans-serif !important;
  font-weight: 200 !important;
}

#allWrap [data-message] {
  width: 100%;
  padding: 12px 15px;
  border-radius: 9px;
  text-align: center;
}

#allWrap [data-message][data-message=success] {
  background-color: #eafbe7;
  color: rgb(0, 191, 0);
  border: solid 1px rgba(0, 191, 0, 0.5);
}

#allWrap [data-message][data-message=error] {
  background-color: #ffe5e5;
  color: rgb(var(--color-label-red));
  border: solid 1px rgba(var(--color-label-red), 0.2);
}

#allWrap .error-msg {
  max-width: 460px;
}
.error-msg{
  color: #FF4747;
}
.text-nowrap {
  text-wrap: nowrap;
}

/* tagify library css start */
:root {
  --tagify-dd-color-primary: rgb(53, 149, 246);
  --tagify-dd-bg-color: white;
}

.tagify {
  --tags-disabled-bg: #f1f1f1;
  --tags-border-color: #ddd;
  --tags-hover-border-color: #ccc;
  --tags-focus-border-color: #3595f6;
  --tag-bg: #e5e5e5;
  --tag-hover: #d3e2e2;
  --tag-text-color: black;
  --tag-text-color--edit: black;
  --tag-pad: 0.3em 0.5em;
  --tag-inset-shadow-size: 1.1em;
  --tag-invalid-color: #d39494;
  --tag-invalid-bg: rgba(211, 148, 148, 0.5);
  --tag-remove-bg: rgba(211, 148, 148, 0.3);
  --tag-remove-btn-color: black;
  --tag-remove-btn-bg: none;
  --tag-remove-btn-bg--hover: #c77777;
  --input-color: inherit;
  --tag--min-width: 1ch;
  --tag--max-width: auto;
  --tag-hide-transition: 0.3s;
  --placeholder-color: rgba(0, 0, 0, 0.4);
  --placeholder-color-focus: rgba(0, 0, 0, 0.25);
  --loader-size: 0.8em;
  --readonly-striped: 1;
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  border: 1px solid #ddd;
  border: 1px solid var(--tags-border-color);
  padding: 0;
  line-height: 0;
  cursor: text;
  outline: 0;
  position: relative;
  box-sizing: border-box;
  transition: 0.1s;
  border-radius: 24px;
}

@keyframes tags--bump {
  30% {
    transform: scale(1.2);
  }
}

@keyframes rotateLoader {
  to {
    transform: rotate(1turn);
  }
}

.tagify:hover {
  border-color: #ccc;
  border-color: var(--tags-hover-border-color);
}

.tagify.tagify--focus {
  transition: 0s;
  border-color: #3595f6;
  border-color: var(--tags-focus-border-color);
}

.tagify[disabled] {
  background: var(--tags-disabled-bg);
  filter: saturate(0);
  opacity: 0.5;
  pointer-events: none;
}

.tagify[disabled].tagify--select,
.tagify[readonly].tagify--select {
  pointer-events: none;
}

.tagify[disabled]:not(.tagify--mix):not(.tagify--select),
.tagify[readonly]:not(.tagify--mix):not(.tagify--select) {
  cursor: default;
}

.tagify[disabled]:not(.tagify--mix):not(.tagify--select)>.tagify__input,
.tagify[readonly]:not(.tagify--mix):not(.tagify--select)>.tagify__input {
  visibility: hidden;
  width: 0;
  margin: 5px 0;
}

.tagify[disabled]:not(.tagify--mix):not(.tagify--select) .tagify__tag>div,
.tagify[readonly]:not(.tagify--mix):not(.tagify--select) .tagify__tag>div {
  padding: 0.3em 0.5em;
  padding: var(--tag-pad);
}

.tagify[disabled]:not(.tagify--mix):not(.tagify--select) .tagify__tag>div::before,
.tagify[readonly]:not(.tagify--mix):not(.tagify--select) .tagify__tag>div::before {
  animation: readonlyStyles 1s calc(-1s * (var(--readonly-striped) - 1)) paused;
}

@keyframes readonlyStyles {
  0% {
    background: linear-gradient(45deg,
        var(--tag-bg) 25%,
        transparent 25%,
        transparent 50%,
        var(--tag-bg) 50%,
        var(--tag-bg) 75%,
        transparent 75%,
        transparent) 0/5px 5px;
    box-shadow: none;
    filter: brightness(0.95);
  }
}

.tagify[disabled] .tagify__tag__removeBtn,
.tagify[readonly] .tagify__tag__removeBtn {
  display: none;
}

.tagify--loading .tagify__input>br:last-child {
  display: none;
}

.tagify--loading .tagify__input::before {
  content: none;
}

.tagify--loading .tagify__input::after {
  content: "";
  vertical-align: middle;
  opacity: 1;
  width: 0.7em;
  height: 0.7em;
  width: var(--loader-size);
  height: var(--loader-size);
  border: 3px solid;
  border-color: #eee #bbb #888 transparent;
  border-radius: 50%;
  animation: rotateLoader 0.4s infinite linear;
  content: "" !important;
  margin: -2px 0 -2px 0.5em;
}

.tagify--loading .tagify__input:empty::after {
  margin-left: 0;
}

.tagify+input,
.tagify+textarea {
  position: absolute !important;
  left: -9999em !important;
  transform: scale(0) !important;
}

.tagify__tag {
  display: inline-flex;
  align-items: center;
  margin: 5px 0 5px 5px;
  position: relative;
  z-index: 1;
  outline: 0;
  line-height: normal;
  cursor: default;
  transition: 0.13s ease-out;
}

.tagify__tag>div {
  vertical-align: top;
  box-sizing: border-box;
  max-width: 100%;
  padding: 0.3em 0.5em;
  padding: var(--tag-pad, 0.3em 0.5em);
  color: #000;
  color: var(--tag-text-color, #000);
  line-height: inherit;
  border-radius: 3px;
  white-space: nowrap;
  transition: 0.13s ease-out;
}

.tagify__tag>div>* {
  white-space: pre-wrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  vertical-align: top;
  min-width: 1ch;
  max-width: auto;
  min-width: var(--tag--min-width, 1ch);
  max-width: var(--tag--max-width, auto);
  transition: 0.8s ease, 0.1s color;
}

.tagify__tag>div>[contenteditable] {
  outline: 0;
  -webkit-user-select: text;
  user-select: text;
  cursor: text;
  margin: -2px;
  padding: 2px;
  max-width: 350px;
}

.tagify__tag>div::before {
  content: "";
  position: absolute;
  border-radius: inherit;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  pointer-events: none;
  transition: 120ms ease;
  animation: tags--bump 0.3s ease-out 1;
  box-shadow: 0 0 0 1.1em #e5e5e5 inset;
  box-shadow: 0 0 0 var(--tag-inset-shadow-size, 1.1em) var(--tag-bg, #e5e5e5) inset;
}

.tagify__tag:focus div::before,
.tagify__tag:hover:not([readonly]) div::before {
  top: -2px;
  right: -2px;
  bottom: -2px;
  left: -2px;
  box-shadow: 0 0 0 1.1em #d3e2e2 inset;
  box-shadow: 0 0 0 var(--tag-inset-shadow-size, 1.1em) var(--tag-hover, #d3e2e2) inset;
}

.tagify__tag--loading {
  pointer-events: none;
}

.tagify__tag--loading .tagify__tag__removeBtn {
  display: none;
}

.tagify__tag--loading::after {
  --loader-size: 0.4em;
  content: "";
  vertical-align: middle;
  opacity: 1;
  width: 0.7em;
  height: 0.7em;
  width: var(--loader-size);
  height: var(--loader-size);
  border: 3px solid;
  border-color: #eee #bbb #888 transparent;
  border-radius: 50%;
  animation: rotateLoader 0.4s infinite linear;
  margin: 0 0.5em 0 -0.1em;
}

.tagify__tag--flash div::before {
  animation: none;
}

.tagify__tag--hide {
  width: 0 !important;
  padding-left: 0;
  padding-right: 0;
  margin-left: 0;
  margin-right: 0;
  opacity: 0;
  transform: scale(0);
  transition: 0.3s;
  transition: var(--tag-hide-transition, 0.3s);
  pointer-events: none;
}

.tagify__tag--hide>div>* {
  white-space: nowrap;
}

.tagify__tag.tagify--noAnim>div::before {
  animation: none;
}

.tagify__tag.tagify--notAllowed:not(.tagify__tag--editable) div>span {
  opacity: 0.5;
}

.tagify__tag.tagify--notAllowed:not(.tagify__tag--editable) div::before {
  box-shadow: 0 0 0 1.1em rgba(211, 148, 148, 0.5) inset !important;
  box-shadow: 0 0 0 var(--tag-inset-shadow-size, 1.1em) var(--tag-invalid-bg, rgba(211, 148, 148, 0.5)) inset !important;
  transition: 0.2s;
}

.tagify__tag[readonly] .tagify__tag__removeBtn {
  display: none;
}

.tagify__tag[readonly]>div::before {
  animation: readonlyStyles 1s calc(-1s * (var(--readonly-striped) - 1)) paused;
}

@keyframes readonlyStyles {
  0% {
    background: linear-gradient(45deg,
        var(--tag-bg) 25%,
        transparent 25%,
        transparent 50%,
        var(--tag-bg) 50%,
        var(--tag-bg) 75%,
        transparent 75%,
        transparent) 0/5px 5px;
    box-shadow: none;
    filter: brightness(0.95);
  }
}

.tagify__tag--editable>div {
  color: #000;
  color: var(--tag-text-color--edit, #000);
}

.tagify__tag--editable>div::before {
  box-shadow: 0 0 0 2px #d3e2e2 inset !important;
  box-shadow: 0 0 0 2px var(--tag-hover, #d3e2e2) inset !important;
}

.tagify__tag--editable>.tagify__tag__removeBtn {
  pointer-events: none;
}

.tagify__tag--editable>.tagify__tag__removeBtn::after {
  opacity: 0;
  transform: translateX(100%) translateX(5px);
}

.tagify__tag--editable.tagify--invalid>div::before {
  box-shadow: 0 0 0 2px #d39494 inset !important;
  box-shadow: 0 0 0 2px var(--tag-invalid-color, #d39494) inset !important;
}

.tagify__tag__removeBtn {
  order: 5;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50px;
  cursor: pointer;
  font: 14px/1 Arial;
  background: 0 0;
  background: var(--tag-remove-btn-bg, none);
  color: #000;
  color: var(--tag-remove-btn-color, #000);
  width: 14px;
  height: 14px;
  margin-right: 4.6666666667px;
  margin-left: auto;
  overflow: hidden;
  transition: 0.2s ease-out;
}

.tagify__tag__removeBtn::after {
  content: "×";
  transition: 0.3s, color 0s;
}

.tagify__tag__removeBtn:hover {
  color: #fff;
  background: #c77777;
  background: var(--tag-remove-btn-bg--hover, #c77777);
}

.tagify__tag__removeBtn:hover+div>span {
  opacity: 0.5;
}

.tagify__tag__removeBtn:hover+div::before {
  box-shadow: 0 0 0 1.1em rgba(211, 148, 148, 0.3) inset !important;
  box-shadow: 0 0 0 var(--tag-inset-shadow-size, 1.1em) var(--tag-remove-bg, rgba(211, 148, 148, 0.3)) inset !important;
  transition: box-shadow 0.2s;
}

.tagify:not(.tagify--mix) .tagify__input br {
  display: none;
}

.tagify:not(.tagify--mix) .tagify__input * {
  display: inline;
  white-space: nowrap;
}

.tagify__input {
  flex-grow: 1;
  display: inline-block;
  min-width: 110px;
  margin: 5px;
  padding: 0.3em 0.5em;
  padding: var(--tag-pad, 0.3em 0.5em);
  line-height: normal;
  position: relative;
  white-space: pre-wrap;
  color: inherit;
  color: var(--input-color, inherit);
  box-sizing: inherit;
}

.tagify__input:focus {
  outline: 0;
}

.tagify__input:focus::before {
  transition: 0.2s ease-out;
  opacity: 0;
  transform: translatex(6px);
}

@supports (-ms-ime-align: auto) {
  .tagify__input:focus::before {
    display: none;
  }
}

.tagify__input:focus:empty::before {
  transition: 0.2s ease-out;
  opacity: 1;
  transform: none;
  color: rgba(0, 0, 0, 0.25);
  color: var(--placeholder-color-focus);
}

@-moz-document url-prefix() {
  .tagify__input:focus:empty::after {
    display: none;
  }
}

.tagify__input::before {
  content: attr(data-placeholder);
  height: 1em;
  line-height: 1.2em;
  margin: auto 0;
  z-index: 1;
  color: rgba(0, 0, 0, 0.4);
  color: var(--placeholder-color);
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  position: absolute;
}

.tagify__input::after {
  content: attr(data-suggest);
  display: inline-block;
  white-space: pre;
  color: #000;
  opacity: 0.3;
  pointer-events: none;
  max-width: 100px;
}

.tagify__input .tagify__tag {
  margin: 0 1px;
}

.tagify--mix {
  display: block;
}

.tagify--mix .tagify__input {
  padding: 5px;
  margin: 0;
  width: 100%;
  height: 100%;
  line-height: 1.5;
  display: block;
}

.tagify--mix .tagify__input::before {
  height: auto;
  display: none;
  line-height: inherit;
}

.tagify--mix .tagify__input::after {
  content: none;
}

.tagify--select::after {
  content: ">";
  opacity: 0.5;
  position: absolute;
  top: 50%;
  right: 0;
  bottom: 0;
  font: 16px monospace;
  line-height: 8px;
  height: 8px;
  pointer-events: none;
  transform: translate(-150%, -50%) scaleX(1.2) rotate(90deg);
  transition: 0.2s ease-in-out;
}

.tagify--select[aria-expanded="true"]::after {
  transform: translate(-150%, -50%) rotate(270deg) scaleY(1.2);
}

.tagify--select .tagify__tag {
  position: absolute;
  top: 0;
  right: 1.8em;
  bottom: 0;
}

.tagify--select .tagify__tag div {
  display: none;
}

.tagify--select .tagify__input {
  width: 100%;
}

.tagify--empty .tagify__input::before {
  transition: 0.2s ease-out;
  opacity: 1;
  transform: none;
  display: inline-block;
  width: auto;
}

.tagify--mix .tagify--empty .tagify__input::before {
  display: inline-block;
}

.tagify--invalid {
  --tags-border-color: #d39494;
}

.tagify__dropdown {
  position: absolute;
  z-index: 9999;
  transform: translateY(1px);
  overflow: hidden;
}

.tagify__dropdown[placement="top"] {
  margin-top: 0;
  transform: translateY(-100%);
}

.tagify__dropdown[placement="top"] .tagify__dropdown__wrapper {
  border-top-width: 1.1px;
  border-bottom-width: 0;
}

.tagify__dropdown[position="text"] {
  box-shadow: 0 0 0 3px rgba(var(--tagify-dd-color-primary), 0.1);
  font-size: 0.9em;
}

.tagify__dropdown[position="text"] .tagify__dropdown__wrapper {
  border-width: 1px;
}

.tagify__dropdown__wrapper {
  max-height: 300px;
  overflow: auto;
  background: #fff;
  background: var(--tagify-dd-bg-color);
  border: 1px solid #3595f6;
  border-color: var(--tagify-dd-color-primary);
  border-bottom-width: 1.33px;
  border-top-width: 0;
  box-shadow: 0 2px 4px -2px rgba(0, 0, 0, 0.2);
  transition: 0.25s cubic-bezier(0, 1, 0.5, 1);
}

.tagify__dropdown__header:empty {
  display: none;
}

.tagify__dropdown__footer {
  display: inline-block;
  margin-top: 0.5em;
  padding: 0.3em 0.5em;
  font-size: 0.7em;
  font-style: italic;
  opacity: 0.5;
}

.tagify__dropdown__footer:empty {
  display: none;
}

.tagify__dropdown--initial .tagify__dropdown__wrapper {
  max-height: 20px;
  transform: translateY(-1em);
}

.tagify__dropdown--initial[placement="top"] .tagify__dropdown__wrapper {
  transform: translateY(2em);
}

.tagify__dropdown__item {
  box-sizing: inherit;
  padding: 0.3em 0.5em;
  margin: 1px;
  cursor: pointer;
  border-radius: 2px;
  position: relative;
  outline: 0;
}

.tagify__dropdown__item--active {
  background: #3595f6;
  background: var(--tagify-dd-color-primary);
  color: #fff;
}

.tagify__dropdown__item:active {
  filter: brightness(105%);
}

/* tagify library css start */

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

.email-tagify .tagify {
  border-radius: 9999px;
  padding-left: 6px;
  padding-right: 6px;
}

.email-tagify .tagify__tag>div {
  border-radius: 9999px;
}

.shadow-lg {
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.bg-dark-200 {
  --tw-bg-opacity: 1;
  background-color: rgb(231 237 242 / var(--tw-bg-opacity));
}
.bg-FAFAFA{
  background-color: #FAFAFA;
}
.rounded-md {
  border-radius: 0.375rem !important;
}

.custom-message {
  padding: 8px 12px;
  margin: 10px;
  font-weight: 600;
}


.cst-button {
  border: 1px solid transparent;
  min-height: 40px;
  min-width: 90px;
  padding: .625rem 1.25rem;
  border-radius: 50px;
  font-family: 'Gordita', sans-serif;
  font-size: .875rem;
  display: flex;
  flex-direction: row;
  gap: calc(var(--gap) / 2);
  align-items: center;
  justify-items: center;
  appearance: none;
  background-color: rgb(var(--color-button));
  font-weight: 600;
  font-size: .875rem;
  color: rgb(var(--color-text-inverse));
  justify-content: center;
  align-self: start;
  border-radius: 9999px !important;
  width: fit-content !important;
}


.cst-button {
  border: none;
  min-height: 40px;
  min-width: 90px;
  padding: .625rem 1.25rem;
  border-radius: 50px;
  font-family: 'Gordita', sans-serif;
  font-size: .875rem;
  display: flex;
  flex-direction: row;
  gap: calc(var(--gap) / 2);
  align-items: center;
  justify-items: center;
  appearance: none;
  background-color: rgb(var(--color-button));
  font-weight: 600;
  font-size: .875rem;
  color: rgb(var(--color-text-inverse));
  justify-content: center;
  align-self: start;
  border-radius: 9999px !important;
  width: fit-content !important;
}

.cst-button-inactive {
  color: rgb(var(--color-button-inactive-text));
  background-color: rgba(var(--color-button-inactive), 0.15);
}

.form-subscription-button {
  width: 100%;
  margin-top: 24px;
}

.py-2-cst {
  padding-top: 8px;
  padding-bottom: 8px;
}


.label-cst {
  display: block;
  font-weight: 700;
  color: #483d5d;
  margin-bottom: 8px;
}

.select-cst {
  margin-bottom: 12px;
  padding-top: 8px;
  padding-bottom: 8px;
  border: 1px solid #D5D0DF;
  background-color: #ffffff;
}

.tooltip-textvalue-css {
  display: block;
  padding-bottom: 8px;
  text-align: end;
}

#filter-data-cancel {
  margin-left: 12px;
}

.cardlist-cst {}

.d-flex-cst {
  display: flex;
  flex-wrap: wrap;
}

.items-center-cst {
  align-items: center;
}

.w-120-cst {
  width: 120px;
}

.gap-6px {
  gap: 6px;
}

.overflow-auto {
  overflow: auto;
}

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

#placement-list-table .placement-col-1 {
  display: flex;
  align-items: center;
  column-gap: 4px;
}

.cst-scroll::-webkit-scrollbar {
  width: 5px;
}

.cst-scroll::-webkit-scrollbar-track {
  background-color: #f1f1f1;
  border-radius: 10px;
}

.cst-scroll::-webkit-scrollbar-thumb {
  background: #d4d4d4;
  border-radius: 10px;
}

.datamap-style {
  height: 648px;
}

#popupWrapNotify {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 99;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  visibility: collapse;
}

#popupWrapNotify::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: rgba(var(--color-text), 0.12);
  opacity: 0;
  transition: backdrop-filter 0.1s ease;
}

#popupWrapNotify .popup {
  position: relative;
  z-index: 3;
  width: 80%;
  max-width: 300px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  flex-direction: column;
  padding: 1.562rem 1.875rem;
  background-color: rgba(var(--color-widget-background), 1);
  border-radius: var(--radius);
  align-self: start;
  gap: var(--gap);
  text-align: center;
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.06);
  opacity: 0;
  transform: translateY(100px);
  transition: all 0.15s ease;
}

#popupWrapNotify .popup .title {
  font-weight: 600;
  display: flex;
  flex-direction: column;
  gap: calc(var(--gap) / 4);
  align-items: center;
  justify-content: center;
}

#popupWrapNotify .popup .title::before {
  content: var(--icon-alert);
}

#popupWrapNotify .popup .actions {
  display: flex;
  flex-direction: row;
  gap: calc(var(--gap) / 3);
  justify-content: center;
}

#popupWrapNotify.active {
  visibility: visible;
}

#popupWrapNotify.active::before {
  opacity: 1;
  transition: opacity 0.1s ease;
}

#popupWrapNotify.active .popup {
  opacity: 1;
  transform: translateY(0);
  transition: all 0.15s ease;
}

#popupWrapNotify.notifications-modal .popup {
  max-width: 490px;
}

.alert-message-cst {
  margin: 15px 40px 0 40px;
  width: calc(100% - 80px) !important;
}


.email-verification-btn {
  margin-left: auto;
  margin-right: auto;
  color: white;
  font-weight: 600;
  margin-top: 24px;
}

.card-cst {
  background: white;
  padding: 50px;
  border-radius: 20px;
  max-width: 700px;
  width: calc(100% - 20px);
}

.verification-main-div {
  min-height: calc(100vh - 200px);
  display: flex;
  justify-content: center;
  align-items: center;
}

.fw-500-cst {
  font-weight: 500;
}

.alert-blue {
  background-color: #e3f7ff !important;
  color: rgb(0, 173, 239) !important;
  border: solid 1px rgb(0, 173, 239) !important;
  font-size: 14px;
}

.underline {
  text-decoration: underline;
}

.download-btn-placement {
  width: auto !important;
  flex: 0 !important;
}

#select-plan {
  width: 100%;
}

.float-right {
  float: right;
}

.tracker-link {
  color: rgb(0, 173, 239);
}

.tracker-link:hover {
  text-decoration: underline;
}

@media (max-width: 1399px) {
  .alert-message-cst {
    margin: 15px 24px 0 24px;
    width: calc(100% - 48px) !important;
  }
}

@media (max-width: 425px) {
  #popupWrapNotify.notifications-modal .popup {
    width: 95%;
    padding-left: 10px;
    padding-right: 10px;
  }
}

@media (max-width: 767px) {
  .datamap-style {
    height: 400px;
  }
}

.select2-container {
  max-width: 100%;
}

.acc-review-select span.select2.select2-container ul.select2-selection__rendered li:first-child {
  display: flex;
  align-items: center;
  gap: 4px;
  border: 1px solid rgb(184, 180, 180);
  border-radius: 8px;
  padding: 3px 6px;
  line-height: 26px;
}

.acc-review-select span.select2.select2-container ul.select2-selection__rendered li:first-child:hover {
  background-color: rgb(var(--color-button));
  color: rgb(var(--color-text-inverse));
  font-weight: 600;
  border: 1px solid rgb(var(--color-button));

}

.hover-text-primary:hover {
  color: rgb(var(--color-button));
}

.acc-review-select span.select2.select2-container ul.select2-selection__rendered li:first-child:hover .plus-sign-size {
  color: rgb(var(--color-text-inverse));
  font-weight: 600;
}

.acc-review-select span.select2-selection.select2-selection--multiple {
  padding: 0px 0px 0px 0px;
}

.acc-review-select span.select2.select2-container .plus-sign-size {
  font-size: 18px;
}

.relative-cst {
  position: relative;
}

.card-sm {
  padding: 14px;
  border: 1px solid #f3f4f5;
  box-shadow: 0px 0px 4px 0px rgba(237, 237, 237, 1);
  border-radius: 8px;
}

.invited-user-list {
  /* position: absolute; */
  background-color: white;
  color: #000;
  left: 0;

}

.invited-user-list-ul {
  margin-top: 6px;
  list-style: disc;
  list-style-position: inside;
}

.card-h-equal {
  min-height: 150px;
  height: fit-content;
}

.card-h-saving {
  min-height: 180px;
}

.invited-user-list-ul li {
  padding: 2px 0;
}

.cursor-pointer {
  cursor: pointer;
}

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

.canvas-sub {
  height: fit-content;
}

.closest-div-list .buttonsWrap {
  margin-top: 40px !important;

  @media (max-width: 767px) {
    margin-top: auto !important;
  }
}

.selected-subacc-text {
  margin-top: 6px;
  font-size: 14px;
  color: rgb(var(--color-border));
  font-weight: 400;
}

.selected-subacc-text .count {
  font-size: 14px !important;
  color: #000 !important;
  font-weight: 600 !important;
}

button.btn.btn-outline-primary {
  border: 1px solid #66cef5 !important;
  color: #66cef5 !important;
  background-color: transparent !important;
}
button.btn.btn-outline-secondary{
  border: solid 1px rgba(var(--color-border), 0.5) !important;
  color: rgba(var(--color-border)) !important;
  background-color: transparent !important;
}
.text-left{
    text-align: left;
}
.text-right{
    text-align: right;
}

.pl-16 {
  padding-left: 64px !important;
}

#filters .filter-dropdown.wrap.cst-scroll .filter-input-div,
.date-filter-css .filter-dropdown.wrap.cst-scroll .filter-input-div {
  width: 100%;
  display: block;
  position: relative;
  border-top: none;
  padding: 0;
}

#filters .filter-dropdown.wrap.cst-scroll .filter-input-div input,
.date-filter-css .filter-dropdown.wrap.cst-scroll .filter-input-div input {
  visibility: visible;
  width: 100%;
  position: relative;
  border-radius: 12px;
}

#filters .filter-dropdown.wrap.cst-scroll .filter-input-div input,
.date-filter-css .filter-dropdown.wrap.cst-scroll .filter-input-div input {
  visibility: hidden;
  width: 100%;
  position: relative;
  border-radius: 12px;
}

#filters .campaignFilter.active+.filter-dropdown.wrap.cst-scroll .filter-input-div input {
  visibility: visible;
}
.aspect-btn{
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(var(--color-border), 0.15);
}
.aspect-btn.active{
  background-color: rgb(var(--color-button));
}
.date-filter-css .campaignFilter.active+.filter-dropdown.wrap.cst-scroll .filter-input-div input {
  visibility: visible;
}

.free-trial-text {
  font-size: 20px;
  font-weight: 600;
}

.by-signing-up {
  color: #878585;
  font-size: 14px;
}

.items-start-cst {
  align-items: start;
}

.date-filter-css .filter-dropdown {
  inset: 0 !important;
  position: relative !important;
  /* display: none !important; */
  max-height: 0 !important;
  overflow: hidden !important;
  transition: max-height 0.8s ease-in-out !important;
  visibility: visible !important;
  transition-property: all !important;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
  transition-duration: 800ms !important;
  min-height: unset !important;
}

.date-filter-css .campaignFilter {
  width: fit-content;
  margin-bottom: 10px;
}

.date-filter-css .campaignFilter>span {
  justify-content: center;
}

.date-filter-css .campaignFilter.active+.filter-dropdown.wrap {
  /* display: flex !important; */
  max-height: 500px !important;
  padding: 15px var(--gap) 0px !important;
  overflow: auto !important;
  opacity: 1 !important;
  transform: translateY(0) !important;
  transition: visibility 0s ease, opacity 0.2s ease, transform 0.2s ease !important;
}

.date-filter-css .preset-plugin-container {
  margin-top: 15px;
}

.date-filter-css #click-dateFilter {
  display: inline-block;
  width: 260px;
}

.date-filter-css #blocked-click-dateFilter {
  display: inline-block;
  width: 260px;
}

.date-filter-css .click-filters-relative-cst {
  display: inline-block;
  width: 110px;
}

.date-filter-css .filter-dropdown {
  left: -255px !important;
}

.border-list {
  margin-top: 20px;
  border: solid 1px rgba(var(--color-border), 0.24) !important;
  /* border-bottom: 1px solid; */
  border-radius: var(--radius);
  padding: 20px 16px !important;
}

.border-list .clickThreshold {
  border: 0;
  padding: 0;
}

.mt-5-cst {
  margin-top: 20px;
}
.mt-auto{
  margin-top: auto;
}

.widget.--tickets .ticketForm {
  overflow: hidden;
  height: 0;
  transition: height 0.3s ease-out;
  display: none;
}

.widget.--tickets .ticketForm form {
  border: solid 1px rgba(var(--color-border), 0.5);
  border-radius: var(--radius);
  padding: 20px;
  overflow: hidden;
}

.widget.--tickets .ticketForm form .title {
  --icon-pencil: url(../assets/icons/icon-pencil-grey.svg);
  --color-text: 91, 104, 109;
  border-bottom: solid 1px rgba(var(--color-border), 0.5);
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
  font-weight: 600;
  color: rgb(var(--color-text));
  padding-bottom: 0.937rem;
}

.widget.--tickets .ticketForm form .title::before {
  content: var(--icon-pencil);
}

.widget.--tickets .ticketForm form .buttonsWrap {
  justify-content: space-between;
}

.widget.--tickets .ticketForm.active {
  height: auto;
  display: block;
}

.widget.--tickets table tbody tr {
  border-top: solid 1px rgba(var(--color-border), 0.15);
}

.widget.--tickets table tbody tr:first-of-type {
  border: none;
}

.widget.--tickets table tbody tr.open {
  border-top: none;
}

.widget.--tickets table tbody tr.open+tr {
  border-top: none;
}

.widget.--tickets table tbody tr:first-of-type.open td {
  padding-top: 5px;
}

.widget.--tickets table tbody tr td {
  text-align: left;
  padding: 0;
  border: 0;
}

.widget.--tickets table tbody {
  counter-reset: row-num;
}

.widget.--tickets .ticket .title {
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
  padding: 20px;
}

.widget.--tickets .ticket .title:hover {
  cursor: pointer;
}

.widget.--tickets .ticket .title::before {
  counter-increment: row-num;
  content: counter(row-num) ". ";
}

.widget.--tickets .ticket .title::before,
.widget.--tickets .ticket .title span {
  padding-top: 3px;
}

.widget.--tickets .ticket .title label {
  --color-text: 255, 255, 255;
  margin-left: auto;
  display: flex;
  flex-direction: row;
  gap: 5px;
  align-items: center;
  border-radius: 50px;
  padding: 6px 10px 5px;
  color: rgb(var(--color-text));
  font-size: 0.75rem;
}

.widget.--tickets .ticket .title label[data-label=sent] {
  background-color: rgb(var(--color-label-blue));
}

.widget.--tickets .ticket .title label[data-label=respond] {
  background-color: rgb(var(--color-label-red));
}

.widget.--tickets .ticket .title label[data-label=resolved] {
  background-color: rgb(var(--color-label-green));
}

.widget.--tickets .ticket .wrap {
  padding: 0 20px 20px;
  flex-direction: column;
  gap: 20px;
  height: 0;
  display: none;
  overflow: hidden;
}

.widget.--tickets .ticket .department {
  color: rgb(var(--color-text-secondary));
}

.widget.--tickets .ticket .user {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12px;
  color: rgb(var(--color-text-secondary));
}

.widget.--tickets .ticket .user img {
  width: 36px;
  aspect-ratio: 1/1;
  border-radius: 36px;
  object-fit: cover;
}

.widget.--tickets .ticket .user span:not(.date) {
  display: flex;
  flex-direction: row;
  gap: 12px;
  align-items: center;
}

.widget.--tickets .ticket .user span:not(.date)::after {
  content: "/";
}

.widget.--tickets .ticket .attachments {
  display: flex;
  flex-direction: column;
  color: rgb(var(--color-text-secondary));
  gap: 6px;
}

.widget.--tickets .ticket .attachments .title {
  padding: 0;
  margin-bottom: 3px;
  text-transform: uppercase;
  font-size: 0.75rem;
  font-weight: 400;
}

.widget.--tickets .ticket .attachments .title::before {
  content: "";
  display: none;
}

.widget.--tickets .ticket .attachments span:not(.title) {
  display: flex;
  flex-direction: row;
  gap: 6px;
  align-items: center;
}

.widget.--tickets .ticket .attachments span:not(.title)::before {
  content: var(--icon-file);
}

.widget.--tickets .ticket .messageContent {
  background-color: rgb(var(--color-message-user));
  padding: 20px;
  border-radius: var(--radius) var(--radius) var(--radius) 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.widget.--tickets .ticket .messageContent p {
  font-size: 1rem;
  line-height: 1.375rem;
}

.widget.--tickets .ticket .message {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-right: 40px;
}

.widget.--tickets .ticket .message[data-message=agent] {
  padding-right: 0;
  padding-left: 40px;
  align-items: end;
}

.widget.--tickets .ticket .message[data-message=agent] .messageContent {
  background-color: rgb(var(--color-message-agent));
  border-radius: var(--radius) var(--radius) 0 var(--radius);
}

.widget.--tickets .ticket .message[data-message=agent] .user {
  flex-direction: row-reverse;
}

.widget.--tickets .ticket .message[data-message=agent] .user span:not(.date)::before {
  content: "/";
}

.widget.--tickets .ticket .message[data-message=agent] .user span:not(.date)::after {
  content: "";
  display: none;
}

.widget.--tickets .ticket .buttonsWrap .closeTicket {
  margin-left: auto;
}

.widget.--tickets .ticket .respondForm {
  border-top: solid 1px rgba(var(--color-border), 0.5);
  padding: 20px 0 0;
  display: none;
  height: 0;
  overflow: hidden;
}

.widget.--tickets .ticket .respondForm .buttonsWrap {
  justify-content: space-between;
}

.widget.--tickets .ticket .respondForm.active {
  display: flex;
  height: auto;
}

.widget.--tickets .ticket.open {
  border: solid 1px rgba(var(--color-border), 0.5);
  border-radius: var(--radius);
}

.widget.--tickets .ticket.open .title {
  border: 0;
}

.widget.--tickets .ticket.open .title:hover {
  cursor: default;
}

.widget.--tickets .ticket.open .title span {
  font-weight: 600;
}

.widget.--tickets .ticket.open .wrap {
  display: flex;
  height: auto;
}

@media (max-width: 574px) {
  .widget.--tickets .ticketForm {
    padding: 15px;
    gap: 15px;
  }

  .widget.--tickets .ticket .title {
    padding: 15px;
  }

  .widget.--tickets .ticket .title label {
    align-self: baseline;
  }

  .widget.--tickets .ticket .wrap {
    padding: 0 15px 15px;
  }

  .widget.--tickets .ticket .user {
    flex-direction: column;
    align-items: start;
    padding-left: 42px;
    padding-top: 3px;
    gap: 3px;
    position: relative;
  }

  .widget.--tickets .ticket .user img {
    position: absolute;
    top: 0;
    left: 0;
  }

  .widget.--tickets .ticket .user span:not(.date)::after {
    display: none;
  }

  .widget.--tickets .ticket .message {
    padding-right: 15px;
  }

  .widget.--tickets .ticket .message[data-message=agent] {
    padding-left: 15px;
  }

  .widget.--tickets .ticket .message[data-message=agent] .user {
    padding-left: 0;
    padding-right: 42px;
    flex-direction: column;
    align-items: end;
  }

  .widget.--tickets .ticket .message[data-message=agent] .user img {
    left: auto;
    right: 0;
  }

  .widget.--tickets .ticket .message[data-message=agent] .user span:not(.date)::before {
    display: none;
  }

  .widget.--tickets .ticket .respondForm {
    gap: 15px;
  }

  .widget.--tickets .ticket>.wrap .buttonsWrap {
    flex-direction: column;
  }

  .widget.--tickets .ticket>.wrap .buttonsWrap button {
    width: 100%;
  }

  .widget.--tickets .ticket>.wrap .buttonsWrap .closeTicket {
    margin-left: 0;
  }
}

.widget.--articles {
  background-color: transparent;
  padding-left: 0;
}

.widget.--articles ul li {
  border-bottom: solid 1px rgba(var(--color-border), 0.24);
  padding: 0.937rem 0;
}

.widget.--articles ul li:first-of-type {
  padding-top: 0;
}

.widget.--articles ul li:last-of-type {
  border-bottom: 0;
}

.widget.--articles ul li a {
  color: rgb(var(--color-link-sidebar));
  text-decoration: underline;
}

.widget.--articles [data-button=outline] {
  color: rgb(var(--color-link-sidebar));
}

@media (max-width: 880px) {
  .widget.--articles {
    grid-column: span 12;
    grid-row: 2;
  }
}

/* badge style */
.badge{
  font-size: 11px;
  padding: 4px 8px;
  border-radius: 10px;
  display: inline-block;
  color: #ffffff;
  font-weight: 600;
  letter-spacing: 1px;
}
.badge.badge-success{
  background-color: rgb(var(--color-label-green));
}
.badge.badge-danger{
  background-color: rgb(var(--color-label-red));
}
.badge.badge-alert{
  background-color: rgb(var(--color-label-orange));
}
/* .datatable-search-cst{
  margin-bottom: 8px;
  font-size: 14px;
  display: grid;
  flex-direction: row;
  gap: 5px;
  align-items: center;
  font-weight: 600;
  color: rgb(var(--color-header-text));
} */
.datatable-search-cst input{
  background-color: rgba(0, 0, 0, 0.06);
  border: none !important;
  max-width: 400px;
  background-size: 17px;
  margin-bottom: 8px;
  width: 100%;
}
.payment-failed-div{
  height: calc(100vh - 150px);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 20px;
  /* max-width: 800px; */
  margin: auto;
}
.payment-failed-div .submit-sign-up-form{
  margin: 20px auto;

}
.payment-failed-div .description{
  color: rgb(var(--color-link-sidebar));
  margin: 30px 0 20px;
  font-size: 18px;
}
.break-all{
  word-break: break-all;
}

#registerWrap .registerContainer.tag-page{
  max-width: 550px;
}
.tab-nav {
  list-style: none;
  padding: 0;
  display: flex;
  justify-content: space-between;
  width: 100%;
  overflow: auto;
}
.tab-nav .tab-link {
  padding: 14px 20px;
  cursor: pointer;
  color: #00AEEF;
  text-align: center;
  white-space: nowrap;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  background-color: #F4F7F9;
  flex: 1;
  font-size: 18px;
  @media (max-width: 576px) {
    font-size: 16px;
  }
}
.tab-nav .tab-link.active {
  color: #000000;
  background-color: #ffffff;
}
.pixel-tab .tabs-content{
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 0.5px;
  text-align: left;
  @media (max-width: 576px) {
    font-size: 14px;
  }
}
.pixel-tab .tabs-content.reg-card{
  padding-bottom: 40px;
}
.pixel-tab .tabs-content a.link{
  color: #00AEEF;
}
.pixel-tab .tabs-content .title-tab{
  padding-bottom: 16px;
  font-size: 16px;
  text-align: center;
}
.pixel-tab .tabs-content .tag-list{
  list-style: disc;
  padding-left: 16px;
  margin: 16px 0;
}
.pixel-tab .tabs-content .tag-list li{
  margin-bottom: 5px;
}
.pixel-tab .tabs-content .skip-link,
.query-string .skip-link{
  color: #878585;
  font-size: 14px;
}
.tab-content {
  display: none;
}
.tab-content.active {
  display: block;
}
.copy-input .copy-icon{
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  opacity: 0.2;
  pointer-events: none;
  cursor: not-allowed;
  transition: opacity 0.2s ease;
}
ul.google-adds-list{
    list-style: decimal;
    line-height: 30px;
    padding-left: 20px;
}
/* .accountDetails .web-url{
  padding:6px
} */
 .timezone-select .select2-container .select2-selection--single,.currency-select .select2-container .select2-selection--single{
    padding-left: 8px;
  }

.space-between{
  display: flex;
  justify-content: space-between;
  color: rgb(160, 168, 171);
  font-size: 0.8125rem;
  margin-bottom: 4px;
}
table.clickInsights>tbody td.details>div .timeline>li .bg-insight-card{
  background: rgb(255 0 0 / 6%);
  border-color: rgb(255 0 0 / 6%) !important;
}
table#conversion-table tbody tr td .gcl-td{
  max-width: 250px;
  word-break: break-all;
  margin: auto
}
.item-center{
  align-items: center;
}
.lh-24px{
  line-height: 24px;
}
.text-success{
  color: #14AE5C;
}
.audience-box{
  padding: 12px;
  border-radius: 8px;
}
.add-rule-grp-btn{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid #E8E8E8;
  padding: 10px;
  box-shadow: 0px 1px 2px 0px #1018280D;
  color: #11964A;
  font-size: 16px;
  font-weight: 500;
  border-radius: 8px;
  cursor: pointer;
  user-select: none;
}
.select-box [data-grid],
.select-box-clone [data-grid]{
  gap: 12px;
}
.w-80px{
  width: 80px;
}
.sortable-placeholder {
    height: 60px;
    border: 2px dashed #ccc;
    background: #fafafa;
    border-radius: 6px;
    margin: 5px 0;
}
.select-box-added {
    cursor: move;
}