@layer properties, theme, base, custom, components, utilities;

/* Non-Tailwind CSS overrides for the new UI stack. */

/* Loads before tailwind.css, so it sets the layer order for the page.
   Our own component CSS sits in `custom`: above Tailwind's preflight, below its components and utilities,
   so utilities like `hidden` win over it. */

@layer custom{
:root {
  /* Scale */
  --scale: 0.7505863956;

  /* New colors */
  --new-light-grey: #e8e9eb;
  --new-grey: #e2e2e2;
  --new-charcoal: #1f2628;
  --new-light-blue-sky: #e2eef5;
  --new-blue-sky: #7acbd5;
  --new-blue: #45c7f2;
  --new-blue-2: #47c8f1;

  /* Colors */
  --dark-blue: #242131;
  --dark-blue-lighter: #3a364f;
  --dark-blue-darker: #1d1b29;
  --dark-blue-darkest: #1a1823;

  --purple: #6f5ba5;
  --purple-lighter: #c6bedb;
  --purple-darker: #524177;

  --purple-grey: #aba6c0;
  --purple-grey-lighter: #f5f1ff;
  --purple-grey-lighter2: #d5d3e0;
  --purple-grey-lightest: #eae9f2;

  --blue: #78c3ed;
  --light-blue: #9aecf6;
  --light-blue-darker: #3cdaee;

  --grey-darker: #90939e;
  --grey: #9ba3af;
  --grey-light: #cccccc;
  --grey-light2: #e3e3e3;
  --grey-lightest: #eeeeee;
  --grey-invisible: #f6f6f6;

  --red: #db4453;
  --red-darker: #70161f;
  --red-lighter: #f8dadd;
  --red-in-tailwind: #ca101b;

  --green: #44db53;

  /* Typography */
  --bold-font: 500;
  --regular-font: 300;
  --light-font: 200;

  /* Radius */
  --rounded-radius: 25px;

  /* Box shadows */
  --box-shadow-1: 0 3px 7px rgba(0, 0, 0, 0.07);
  --box-shadow-2: 0 4px 7px 3px rgba(0, 0, 0, 0.07);
  --box-shadow-3: 0 0 5px rgba(0, 0, 0, 0.3);
  --new-box-shadow-1: 0 0 40px 0 #e8e9eb;

  /* Navigation */
  --topbar-height: calc(98px * var(--scale));
  --sidebar-width: calc(290px * var(--scale));
  --sidebar-side-margin: calc(30px * var(--scale));

  /* Screen sizes */
  --screen-xs: 480px;
  --screen-sm: 768px;
  --screen-md: 992px;
  --screen-lg: 1200px;

  /* Layers */
  --layer-card: 100;
  --layer-tooltips: 200;
  --layer-overlay: 300;
  --layer-role-selector: 900;
  --layer-chatwoot: 1000;
  --layer-modal: 1050;
  --layer-google-places-dropdown: 1100;
  --layer-sidebar: 1200;
  --layer-flash: 1400;
  --layer-loading-overlay: 1600;
}
}

@layer custom{

@font-face {
  font-family: 'fontello';
  src: url("/assets/fontello-eb23a947.woff2?81838689") format('woff2');
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"]:before,
[class*=" icon-"]:before {
  font-family: "fontello";
  font-style: normal;
  font-weight: normal;
  speak: never;

  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: .2em;
  text-align: center;

  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;

  /* fix buttons height, for twitter bootstrap */
  line-height: 1em;

  /* Animation center compensation - margins should be symmetric */
  margin-left: .2em;

  /* Font smoothing. That was taken from TWBS */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-account:before { content: '\e800'; }
.icon-add-user:before { content: '\e801'; }
.icon-arrow-down:before { content: '\e802'; }
.icon-arrow-up:before { content: '\e803'; }
.icon-calendar:before { content: '\e804'; }
.icon-chat:before { content: '\e805'; }
.icon-wallet:before { content: '\e806'; }
.icon-edit:before { content: '\e807'; }
.icon-help:before { content: '\e809'; }
.icon-mail:before { content: '\e80a'; }
.icon-remind:before { content: '\e80b'; }
.icon-sales:before { content: '\e80c'; }
.icon-setting:before { content: '\e80d'; }
.icon-teacher:before { content: '\e80e'; }
.icon-success:before { content: '\e80f'; }
.icon-error:before { content: '\e810'; }
.icon-exclamation:before { content: '\e811'; }
.icon-logout:before { content: '\e812'; }
.icon-menu:before { content: '\e813'; }
.icon-filter:before { content: '\e815'; }
.icon-menu-square:before { content: '\e817'; }
.icon-plus:before { content: '\e818'; }
.icon-share:before { content: '\e819'; }
.icon-arrow-left:before { content: '\e81a'; }
.icon-arrow-right:before { content: '\e81b'; }
.icon-delete:before { content: '\e81c'; }
.icon-call-answer:before { content: '\e81d'; }
.icon-calendar-cancel:before { content: '\e81e'; }
.icon-calendar-repeat:before { content: '\e81f'; }
.icon-locked:before { content: '\e821'; }
.icon-sailboat:before { content: '\e823'; }
.icon-group:before { content: '\e824'; }
.icon-replacement:before { content: '\e825'; }
.icon-presentation:before { content: '\e827'; }
.icon-reading:before { content: '\e828'; }
.icon-party:before { content: '\e829'; }
.icon-activenow:before { content: '\e82a'; }
.icon-qr-code:before { content: '\e82b'; }
.icon-pdf-file:before { content: '\e82e'; }
.icon-smile:before { content: '\e82f'; }
.icon-usage-suggestion:before { content: '\e830'; }
.icon-dropdown:before { content: '\e831'; }
.icon-tennis-raquet:before { content: '\e832'; }
.icon-mail_cancel:before { content: '\e834'; }
.icon-calendar-move:before { content: '\e836'; }
.icon-dropup:before { content: '\e838'; }
.icon-long-arrow-left:before { content: '\e839'; }
.icon-to-do-list:before { content: '\e83a'; }
.icon-building:before { content: '\e83b'; }
.icon-home:before { content: '\e83c'; }
.icon-filters-show:before { content: '\e83e'; }
.icon-star-filled:before { content: '\e83f'; }
.icon-star-empty:before { content: '\e840'; }
.icon-award:before { content: '\e841'; }
.icon-attention:before { content: '\e842'; }
.icon-repeat:before { content: '\e843'; }
.icon-option:before { content: '\e844'; }
.icon-user-tag:before { content: '\e845'; }
.icon-book:before { content: '\e855'; }
.icon-video-camera:before { content: '\e85c'; }
.icon-one-circle:before { content: '\e87a'; }
.icon-duplicate:before { content: '\e87b'; }
.icon-tick-alt:before { content: '\e8c6'; }
.icon-x-alt:before { content: '\e8c7'; }
.icon-menu-alt:before { content: '\e8d1'; }
.icon-long-arrow-right-alt:before { content: '\e8d3'; }
.icon-search:before { content: '\e816'; }
.icon-credit-card:before { content: '\e820'; }
.icon-history:before { content: '\f1da'; }
}

@layer custom{

.svg-icon {
  display: inline-block;
  mask-size: contain;
  -webkit-mask-size: contain;
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-position: center;
}

.add_circle_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/add_circle_16-icon-380ac146.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/add_circle_16-icon-380ac146.svg");
}

.admin_panel_settings_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/admin_panel_settings_16-icon-02fa3517.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/admin_panel_settings_16-icon-02fa3517.svg");
}

.autorenew_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/autorenew_16-icon-1ebd558d.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/autorenew_16-icon-1ebd558d.svg");
}

.bar_chart_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/bar_chart_16-icon-83af2f5a.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/bar_chart_16-icon-83af2f5a.svg");
}

.cake_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/cake_16-icon-74993ce7.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/cake_16-icon-74993ce7.svg");
}

.calendar_month_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/calendar_month_16-icon-ec92ee89.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/calendar_month_16-icon-ec92ee89.svg");
}

.call_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/call_16-icon-26aa0779.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/call_16-icon-26aa0779.svg");
}

.celebration_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/celebration_16-icon-981f91f7.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/celebration_16-icon-981f91f7.svg");
}

.check_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/check_16-icon-7a3d7562.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/check_16-icon-7a3d7562.svg");
}

.checkbook_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/checkbook_16-icon-d3c49ba4.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/checkbook_16-icon-d3c49ba4.svg");
}

.checklist_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/checklist_16-icon-427b0163.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/checklist_16-icon-427b0163.svg");
}

.close_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/close_16-icon-57609731.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/close_16-icon-57609731.svg");
}

.co_present_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/co_present_16-icon-0f7cc5ce.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/co_present_16-icon-0f7cc5ce.svg");
}

.content_copy_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/content_copy_16-icon-dc1f5b3f.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/content_copy_16-icon-dc1f5b3f.svg");
}

.counter_1_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/counter_1_16-icon-a5c43026.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/counter_1_16-icon-a5c43026.svg");
}

.credit_card_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/credit_card_16-icon-0715cbea.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/credit_card_16-icon-0715cbea.svg");
}

.delete_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/delete_16-icon-09870690.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/delete_16-icon-09870690.svg");
}

.dictionary_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/dictionary_16-icon-ec23808a.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/dictionary_16-icon-ec23808a.svg");
}

.event_repeat_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/event_repeat_16-icon-9b1bd383.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/event_repeat_16-icon-9b1bd383.svg");
}

.groups_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/groups_16-icon-bd484e1b.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/groups_16-icon-bd484e1b.svg");
}

.help_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/help_16-icon-042b4d16.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/help_16-icon-042b4d16.svg");
}

.keyboard_arrow_right_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/keyboard_arrow_right_16-icon-4fba11da.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/keyboard_arrow_right_16-icon-4fba11da.svg");
}

.location_on_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/location_on_16-icon-3ca242cc.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/location_on_16-icon-3ca242cc.svg");
}

.lock_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/lock_16-icon-c9a1495f.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/lock_16-icon-c9a1495f.svg");
}

.mail_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/mail_16-icon-a27e1ba4.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/mail_16-icon-a27e1ba4.svg");
}

.partner_exchange_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/partner_exchange_16-icon-cebe2f46.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/partner_exchange_16-icon-cebe2f46.svg");
}

.person_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/person_16-icon-6cee114f.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/person_16-icon-6cee114f.svg");
}

.pool_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/pool_16-icon-7720b90a.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/pool_16-icon-7720b90a.svg");
}

.qr_code_2_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/qr_code_2_16-icon-77234560.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/qr_code_2_16-icon-77234560.svg");
}

.sailing_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/sailing_16-icon-d7971eb2.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/sailing_16-icon-d7971eb2.svg");
}

.school_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/school_16-icon-e04de32c.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/school_16-icon-e04de32c.svg");
}

.sell_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/sell_16-icon-4810e820.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/sell_16-icon-4810e820.svg");
}

.settings_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/settings_16-icon-f79aa776.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/settings_16-icon-f79aa776.svg");
}

.sms_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/sms_16-icon-d73e51d4.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/sms_16-icon-d73e51d4.svg");
}

.sports_tennis_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/sports_tennis_16-icon-e513547f.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/sports_tennis_16-icon-e513547f.svg");
}

.stylus_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/stylus_16-icon-a21f8db0.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/stylus_16-icon-a21f8db0.svg");
}

.trophy_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/trophy_16-icon-cafdb695.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/trophy_16-icon-cafdb695.svg");
}

.visibility_off_16-icon {
  width: 16px;
  height: 16px;
  mask-image: url("/assets/icons/square_16px/visibility_off_16-icon-e3ca17e7.svg");
  -webkit-mask-image: url("/assets/icons/square_16px/visibility_off_16-icon-e3ca17e7.svg");
}

.add_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/add_20-icon-818b5952.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/add_20-icon-818b5952.svg");
}

.add_circle_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/add_circle_20-icon-380ac146.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/add_circle_20-icon-380ac146.svg");
}

.admin_panel_settings_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/admin_panel_settings_20-icon-5a606950.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/admin_panel_settings_20-icon-5a606950.svg");
}

.approval_delegation_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/approval_delegation_20-icon-2c93070e.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/approval_delegation_20-icon-2c93070e.svg");
}

.arrow_range_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/arrow_range_20-icon-f005d1dd.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/arrow_range_20-icon-f005d1dd.svg");
}

.autorenew_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/autorenew_20-icon-1ebd558d.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/autorenew_20-icon-1ebd558d.svg");
}

.bar_chart_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/bar_chart_20-icon-00155f68.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/bar_chart_20-icon-00155f68.svg");
}

.calendar_month_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/calendar_month_20-icon-db9fdfba.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/calendar_month_20-icon-db9fdfba.svg");
}

.captive_portal_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/captive_portal_20-icon-91501db3.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/captive_portal_20-icon-91501db3.svg");
}

.celebration_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/celebration_20-icon-7c87e7a8.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/celebration_20-icon-7c87e7a8.svg");
}

.check_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/check_20-icon-1c28b87c.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/check_20-icon-1c28b87c.svg");
}

.checkbook_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/checkbook_20-icon-d3c49ba4.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/checkbook_20-icon-d3c49ba4.svg");
}

.checklist_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/checklist_20-icon-427b0163.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/checklist_20-icon-427b0163.svg");
}

.close_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/close_20-icon-4bd4d98e.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/close_20-icon-4bd4d98e.svg");
}

.co_present_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/co_present_20-icon-62be19b7.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/co_present_20-icon-62be19b7.svg");
}

.content_copy_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/content_copy_20-icon-80e7ffe6.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/content_copy_20-icon-80e7ffe6.svg");
}

.counter_1_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/counter_1_20-icon-a7c1f876.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/counter_1_20-icon-a7c1f876.svg");
}

.credit_card_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/credit_card_20-icon-aba9a2f2.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/credit_card_20-icon-aba9a2f2.svg");
}

.delete_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/delete_20-icon-41858eba.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/delete_20-icon-41858eba.svg");
}

.dictionary_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/dictionary_20-icon-015738bc.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/dictionary_20-icon-015738bc.svg");
}

.diversity_3_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/diversity_3_20-icon-aa2a5588.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/diversity_3_20-icon-aa2a5588.svg");
}

.docs_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/docs_20-icon-120712f8.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/docs_20-icon-120712f8.svg");
}

.download_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/download_20-icon-9ea28199.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/download_20-icon-9ea28199.svg");
}

.error_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/error_20-icon-086b9c3a.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/error_20-icon-086b9c3a.svg");
}

.escalator_warning_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/escalator_warning_20-icon-d86f2243.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/escalator_warning_20-icon-d86f2243.svg");
}

.event_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/event_20-icon-24df08cb.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/event_20-icon-24df08cb.svg");
}

.event_busy_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/event_busy_20-icon-ff65684b.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/event_busy_20-icon-ff65684b.svg");
}

.event_repeat_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/event_repeat_20-icon-9b1bd383.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/event_repeat_20-icon-9b1bd383.svg");
}

.event_upcoming_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/event_upcoming_20-icon-57f262bd.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/event_upcoming_20-icon-57f262bd.svg");
}

.filter_alt_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/filter_alt_20-icon-911c37df.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/filter_alt_20-icon-911c37df.svg");
}

.filter_list_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/filter_list_20-icon-7f4fc160.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/filter_list_20-icon-7f4fc160.svg");
}

.format_list_bulleted_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/format_list_bulleted_20-icon-c9ebc58c.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/format_list_bulleted_20-icon-c9ebc58c.svg");
}

.g_translate_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/g_translate_20-icon-005829d4.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/g_translate_20-icon-005829d4.svg");
}

.groups_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/groups_20-icon-ea574060.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/groups_20-icon-ea574060.svg");
}

.help_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/help_20-icon-cf586f04.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/help_20-icon-cf586f04.svg");
}

.history_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/history_20-icon-886b4413.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/history_20-icon-886b4413.svg");
}

.id_card_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/id_card_20-icon-468e1477.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/id_card_20-icon-468e1477.svg");
}

.keyboard_arrow_down_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/keyboard_arrow_down_20-icon-f608d071.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/keyboard_arrow_down_20-icon-f608d071.svg");
}

.keyboard_arrow_right_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/keyboard_arrow_right_20-icon-101afbd2.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/keyboard_arrow_right_20-icon-101afbd2.svg");
}

.keyboard_arrow_up_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/keyboard_arrow_up_20-icon-d420a161.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/keyboard_arrow_up_20-icon-d420a161.svg");
}

.language_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/language_20-icon-baa75a69.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/language_20-icon-baa75a69.svg");
}

.location_on_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/location_on_20-icon-31d75df6.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/location_on_20-icon-31d75df6.svg");
}

.logout_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/logout_20-icon-b0ef731e.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/logout_20-icon-b0ef731e.svg");
}

.loop_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/loop_20-icon-7f843831.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/loop_20-icon-7f843831.svg");
}

.magnifying_glass_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/magnifying_glass_20-icon-bd65aab3.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/magnifying_glass_20-icon-bd65aab3.svg");
}

.mail_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/mail_20-icon-8220eeb7.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/mail_20-icon-8220eeb7.svg");
}

.manage_accounts_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/manage_accounts_20-icon-e103134c.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/manage_accounts_20-icon-e103134c.svg");
}

.menu_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/menu_20-icon-a96f2736.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/menu_20-icon-a96f2736.svg");
}

.menu_book_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/menu_book_20-icon-85a09abc.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/menu_book_20-icon-85a09abc.svg");
}

.more_horiz_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/more_horiz_20-icon-a6974257.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/more_horiz_20-icon-a6974257.svg");
}

.more_vert_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/more_vert_20-icon-548c1c1b.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/more_vert_20-icon-548c1c1b.svg");
}

.open_in_new_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/open_in_new_20-icon-4775b0a1.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/open_in_new_20-icon-4775b0a1.svg");
}

.partner_exchange_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/partner_exchange_20-icon-18afb6e9.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/partner_exchange_20-icon-18afb6e9.svg");
}

.password_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/password_20-icon-dd8f8884.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/password_20-icon-dd8f8884.svg");
}

.person_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/person_20-icon-e775b7b9.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/person_20-icon-e775b7b9.svg");
}

.person_add_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/person_add_20-icon-9ff793c3.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/person_add_20-icon-9ff793c3.svg");
}

.person_cancel_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/person_cancel_20-icon-402c5267.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/person_cancel_20-icon-402c5267.svg");
}

.person_search_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/person_search_20-icon-60063f7e.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/person_search_20-icon-60063f7e.svg");
}

.qr_code_2_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/qr_code_2_20-icon-77234560.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/qr_code_2_20-icon-77234560.svg");
}

.receipt_long_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/receipt_long_20-icon-cc98c40a.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/receipt_long_20-icon-cc98c40a.svg");
}

.sailing_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/sailing_20-icon-c1998ffc.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/sailing_20-icon-c1998ffc.svg");
}

.savings_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/savings_20-icon-2d323e6c.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/savings_20-icon-2d323e6c.svg");
}

.schedule_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/schedule_20-icon-87825f19.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/schedule_20-icon-87825f19.svg");
}

.school_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/school_20-icon-ff63c416.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/school_20-icon-ff63c416.svg");
}

.sell_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/sell_20-icon-4810e820.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/sell_20-icon-4810e820.svg");
}

.sentiment_satisfied_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/sentiment_satisfied_20-icon-7a142875.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/sentiment_satisfied_20-icon-7a142875.svg");
}

.settings_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/settings_20-icon-0b7adec6.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/settings_20-icon-0b7adec6.svg");
}

.sms_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/sms_20-icon-ffcd3ec9.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/sms_20-icon-ffcd3ec9.svg");
}

.sports_tennis_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/sports_tennis_20-icon-e5d02301.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/sports_tennis_20-icon-e5d02301.svg");
}

.star_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/star_20-icon-bf0f3d09.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/star_20-icon-bf0f3d09.svg");
}

.stylus_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/stylus_20-icon-3e21a211.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/stylus_20-icon-3e21a211.svg");
}

.swap_horiz_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/swap_horiz_20-icon-e8ff1dcf.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/swap_horiz_20-icon-e8ff1dcf.svg");
}

.trophy_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/trophy_20-icon-cafdb695.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/trophy_20-icon-cafdb695.svg");
}

.unsubscribe_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/unsubscribe_20-icon-13254a74.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/unsubscribe_20-icon-13254a74.svg");
}

.view_week_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/view_week_20-icon-6f2b5778.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/view_week_20-icon-6f2b5778.svg");
}

.visibility_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/visibility_20-icon-900ae7d0.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/visibility_20-icon-900ae7d0.svg");
}

.visibility_off_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/visibility_off_20-icon-20180e7f.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/visibility_off_20-icon-20180e7f.svg");
}

.warning_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/warning_20-icon-e6a747d8.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/warning_20-icon-e6a747d8.svg");
}

.wifi_home_20-icon {
  width: 20px;
  height: 20px;
  mask-image: url("/assets/icons/square_20px/wifi_home_20-icon-1fa788d5.svg");
  -webkit-mask-image: url("/assets/icons/square_20px/wifi_home_20-icon-1fa788d5.svg");
}

.add_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/add_24-icon-ad542536.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/add_24-icon-ad542536.svg");
}

.add_a_photo_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/add_a_photo_24-icon-095809c7.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/add_a_photo_24-icon-095809c7.svg");
}

.autorenew_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/autorenew_24-icon-06edd4a3.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/autorenew_24-icon-06edd4a3.svg");
}

.calendar_month_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/calendar_month_24-icon-c8a5f49a.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/calendar_month_24-icon-c8a5f49a.svg");
}

.celebration_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/celebration_24-icon-4df492a6.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/celebration_24-icon-4df492a6.svg");
}

.checkbook_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/checkbook_24-icon-c4ee43f9.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/checkbook_24-icon-c4ee43f9.svg");
}

.checklist_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/checklist_24-icon-453c671d.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/checklist_24-icon-453c671d.svg");
}

.close_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/close_24-icon-ec7bb641.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/close_24-icon-ec7bb641.svg");
}

.co_present_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/co_present_24-icon-bed7f24b.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/co_present_24-icon-bed7f24b.svg");
}

.content_copy_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/content_copy_24-icon-2468f861.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/content_copy_24-icon-2468f861.svg");
}

.credit_card_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/credit_card_24-icon-ed9cec2e.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/credit_card_24-icon-ed9cec2e.svg");
}

.dictionary_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/dictionary_24-icon-6521e089.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/dictionary_24-icon-6521e089.svg");
}

.diversity_3_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/diversity_3_24-icon-29e1789e.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/diversity_3_24-icon-29e1789e.svg");
}

.docs_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/docs_24-icon-ebf7cdd6.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/docs_24-icon-ebf7cdd6.svg");
}

.east_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/east_24-icon-23a8dbc8.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/east_24-icon-23a8dbc8.svg");
}

.emoji_objects_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/emoji_objects_24-icon-f5f753eb.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/emoji_objects_24-icon-f5f753eb.svg");
}

.error_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/error_24-icon-0ae0a8d0.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/error_24-icon-0ae0a8d0.svg");
}

.event_busy_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/event_busy_24-icon-20d77ac7.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/event_busy_24-icon-20d77ac7.svg");
}

.event_upcoming_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/event_upcoming_24-icon-a385e281.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/event_upcoming_24-icon-a385e281.svg");
}

.groups_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/groups_24-icon-3c564aa2.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/groups_24-icon-3c564aa2.svg");
}

.help_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/help_24-icon-a70c12f4.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/help_24-icon-a70c12f4.svg");
}

.history_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/history_24-icon-a82d8b9f.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/history_24-icon-a82d8b9f.svg");
}

.keyboard_arrow_down_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/keyboard_arrow_down_24-icon-94d09512.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/keyboard_arrow_down_24-icon-94d09512.svg");
}

.keyboard_arrow_left_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/keyboard_arrow_left_24-icon-2ed4f748.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/keyboard_arrow_left_24-icon-2ed4f748.svg");
}

.keyboard_arrow_right_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/keyboard_arrow_right_24-icon-beb50bd7.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/keyboard_arrow_right_24-icon-beb50bd7.svg");
}

.keyboard_arrow_up_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/keyboard_arrow_up_24-icon-3f84b271.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/keyboard_arrow_up_24-icon-3f84b271.svg");
}

.location_on_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/location_on_24-icon-8f35a07f.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/location_on_24-icon-8f35a07f.svg");
}

.mail_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/mail_24-icon-b2225b36.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/mail_24-icon-b2225b36.svg");
}

.menu_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/menu_24-icon-e394ac49.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/menu_24-icon-e394ac49.svg");
}

.newspaper_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/newspaper_24-icon-05c81467.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/newspaper_24-icon-05c81467.svg");
}

.notifications_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/notifications_24-icon-118aa379.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/notifications_24-icon-118aa379.svg");
}

.person_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/person_24-icon-902a0d6d.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/person_24-icon-902a0d6d.svg");
}

.person_add_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/person_add_24-icon-ebe03b2b.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/person_add_24-icon-ebe03b2b.svg");
}

.person_alert_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/person_alert_24-icon-7fb317aa.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/person_alert_24-icon-7fb317aa.svg");
}

.person_cancel_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/person_cancel_24-icon-049835e5.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/person_cancel_24-icon-049835e5.svg");
}

.person_check_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/person_check_24-icon-6820f30c.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/person_check_24-icon-6820f30c.svg");
}

.school_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/school_24-icon-b58dcffc.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/school_24-icon-b58dcffc.svg");
}

.settings_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/settings_24-icon-37fe2cc1.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/settings_24-icon-37fe2cc1.svg");
}

.south_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/south_24-icon-b99c3b6b.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/south_24-icon-b99c3b6b.svg");
}

.star_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/star_24-icon-1e08b48e.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/star_24-icon-1e08b48e.svg");
}

.upload_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/upload_24-icon-f28d91a8.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/upload_24-icon-f28d91a8.svg");
}

.west_24-icon {
  width: 24px;
  height: 24px;
  mask-image: url("/assets/icons/square_24px/west_24-icon-6e03c091.svg");
  -webkit-mask-image: url("/assets/icons/square_24px/west_24-icon-6e03c091.svg");
}
}

/* Unlayered: these override third-party CSS (DataTables, FullCalendar, air-datepicker), which is unlayered,
   or deliberately override Tailwind utilities (mail preview). */

/* GENERAL */

.tailwind-view .dt-container {
  overflow: auto;

  &:has(.table.overflow-visible) {
    overflow: visible;
  }

  .table.border-b-none tbody tr:last-child {
    border-bottom: none;
  }

  .table {
    .instructor-avatar {
      min-width: 68px;
      padding-right: 20px !important;
    }

    .eventable-color {
      position: relative;
      min-width: 8px;
      padding: 0 !important;
    }

    tbody tr {
      td:first-child.eventable-color + td {
        padding-left: 8px;
      }
    }

    thead th:first-child.eventable-color + th {
      padding-left: 8px;
    }
  }

  .table tbody {
    a {
      &:hover {
        text-decoration: underline;
      }
    }
  }

  .table tbody tr {
    border-bottom: 1px solid #e5e5e5;

    &.dtr-expanded {
      border-bottom-color: transparent;
    }

    td {
      padding: 24px;
      padding-left: 0px;
      width: -moz-fit-content;
      width: fit-content;

      .btn-secondary,
      .btn-primary {
        white-space: nowrap;
      }
    }

    td:not(.eventable-color):not(:has(input[type="checkbox"])):not(.instructor-avatar):not(.mobile-toggle-heading) {
      min-width: 128px;
    }

    td:first-child {
      padding-left: 24px;
    }
  }

  .table tbody tr.child td {
    padding-top: 0;
  }

  thead th {
    border-bottom: 1px solid #e5e5e5;

    &:first-child {
      padding-left: 24px;
    }
    &.mobile-toggle-heading {
      display: none !important;
    }
  }

/* Hide processing message indicator */
div.dt-processing {
  display: none !important;
}

/* BOTTOM CONTROL SECTION */

  .dt-layout-row:not(.dt-layout-table) {
    padding: 0 24px;
    display: flex;
    align-items: center;
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size: 12px;
    line-height: 18px;
    text-transform: uppercase;
    margin-top: 30px;
    position: sticky;
    left: 0;

    /* pagination styles */
    .dt-layout-start {
      height: auto;

      .ellipsis {
        margin: auto 14px;
      }

      /* Pagination buttons styles */
      .dt-paging {
        color: #6541B0;

        .dt-paging-button {
        &:hover {
          cursor: pointer;
        }

        /* Previous and next buttons styles */
        &.previous,
        &.next {
          background-color: #e9deff;
          font-weight: 450;
          text-transform: uppercase;
          margin: 0px 24px;
          padding: 6px 12px;
          border-radius: 4px;
          border: 1px solid transparent;

          &:hover {
            border-color: #7638F2
          }

          &.disabled {
            cursor: not-allowed;
            background-color: #e5e5e5;
            border-color: #e5e5e5;
            color: #939299;
          }
        }

        &.previous {
          margin-left: 0px;
        }

        /* Page number buttons styles */
        &:not(.previous, .next) {
          padding: 2px;
          font-weight: 500;

          /* Current page button styles */
          &.current {
            font-weight: 700;
            font-size: 14px;
          }
        }
      }
    }
  }

    /* page length select styles */
    .dt-layout-end {
      font-weight: 500;
      margin-left: auto;
      padding: 5px 0px;

      /* select input styles */
      .dt-input {
        border-radius: 4px;
        margin-left: 6px;
        font-size: 12px;
        height: 30px;
        padding: 0px;
        width: 50px;
        padding-left: 6px;
      }
    }
  }
}

.tailwind-view .table > tbody > tr:hover {
  background-color: #FBFBFC;
}

/* mobile styling */
@media screen and (max-width: 815px) {
  .tailwind-view .dt-container .dt-layout-row:not(.dt-layout-table) {

    .dt-layout-start {
      white-space: nowrap;

      /* hide page number buttons other than current one */
      .dt-paging-button {
        &:not(.previous, .next, .current) {
          display: none;
        }
        &.previous {
          margin-right: 10px !important;
        }
        &.next {
          margin-left: 10px !important;
        }
      }

      /* hide ellipsis */
      .ellipsis {
        display: none;
      }

      /* current page styles */
      .dt-paging .current {
        margin: auto 5px;
      }
    }

    /* remove text from page length select */
    .dt-layout-end {
      font-size: 0px;
    }
  }
}

/* RESPONSIVE COLLAPSED COLUMNS */

/* hide columns dropdown icon */
.tailwind-view .dtr-title>.icon-dropdown,
.tailwind-view icon-dropup {
  display: none
}

/* column header styles */
.tailwind-view .dtr-title {
  font-family: "Open Sans", Arial, sans-serif;
  font-weight: 700;
  font-size: 0.75rem;
  line-height: 1rem;
  color: rgb(156 163 175);
  text-transform: uppercase;
}

/* row data styles */
.tailwind-view .dtr-data {
  font-family: "Open Sans", Arial, sans-serif;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.5rem;
  display: block;
}

/* remove row list styles */
.tailwind-view .dtr-details {
  list-style-type: none;
  margin-left: 0;

  li {
    margin-bottom: 1rem
  }
}

.tailwind-view .mobile-toggle-cell {
  display: none;
}

.tailwind-view .mobile-toggle-heading {
  display: none !important;

}

@media screen and (max-width: 639px) {
  .tailwind-view .dt-container .advanced-table tbody tr.child td.child {
    padding-left: 0px !important;
  }

  .tailwind-view .dt-container .table.details-toggle tbody tr td:first-child {
    padding-left: 0px;
  }

  .tailwind-view .dt-container .table tbody tr td {
    padding-right: 0px;
  }

  .tailwind-view .mobile-toggle-cell {
    display: table-cell !important;
    padding-right: 0 !important;
  }

  .tailwind-view .mobile-toggle-heading {
    display: table-cell;
    padding-right: 0px !important;
  }

  .tailwind-view .mobile-toggle-cell .collapsed {
    display: inline-flex;
  }

  .tailwind-view .mobile-toggle-cell .expanded {
    display: none;
  }

  .tailwind-view tr.dtr-expanded .mobile-toggle-cell .collapsed {
    display: none;
  }

  .tailwind-view tr.dtr-expanded .mobile-toggle-cell .expanded {
    display: inline-flex;
  }
}

/* CUSTOM */

.tailwind-view .text-clamp-4 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  line-clamp: 4;
}

.tailwind-view .dtr-title a {
  font-size: 12px;
  font-weight: 600;
}

.tailwind-view .dtr-data {
  font-size: 14px;
  font-weight: 400px;
}

.tailwind-view .sticky-y-th,
.tailwind-view td:has(> .sticky-col-wrapper) {
  position: sticky;
  background-color: white;
  left: 0px;
}

.tailwind-view .sticky-y-th {
  z-index: 2
}

.tailwind-view .table-sticky-header {
  height: 80vh;
}

.tailwind-view .table-sticky-header table {
  border-collapse: collapse;
}

.tailwind-view .table-sticky-header thead th {
  position: sticky;
  background-color: white;
  top: 0;
  padding-top: 8px;
  box-shadow: inset 0 -1px 0 rgb(209 213 219);
}

.tailwind-view .table-sticky-header thead th:not(.sticky-y-th) {
  z-index: 1
}

@media screen and (max-width: 1023px) {
  .tailwind-view .dt-container .table.section-aligned tbody tr td:first-child,
  .tailwind-view .dt-container .table.section-aligned thead th:first-child {
    padding-left: 0;
  }
}

/* GENERAL */

/* Calendar background */
.fc-view-harness {
  background-color: white;
  border-radius: 8px;
}

/* Background of today column */
.fc-timegrid-col.fc-day-today,
.fc-daygrid-day.fc-day-today {
  background: #F8F8FA !important;
}

/* Remove highlight of today when BusinessHours are applied */
.fc-timegrid-col.fc-day-today:has(.fc-timegrid-col-frame .fc-timegrid-col-bg .fc-timegrid-bg-harness .fc-non-business) {
  background: transparent !important;
}

/* Stops highlighting day on click in month view */
.fc-daygrid-day-bg,
.fc-timegrid-col-bg {
  .fc-highlight {
    background-color: transparent !important;
  }
}

#calendar {
  padding: 20px 20px;

  table {
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
  }
}

/* border radius for timegrid only (excluding daygrid for all day) */
.fc-scrollgrid-section-body:has(.fc-timegrid-body) {
  td {
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
  }
}

/* border radius */
.fc-scrollgrid-section-header {
  th {
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
  }
}

/* border radius */
.fc-scrollgrid {
  border-top-right-radius: 8px;
  border-top-left-radius: 8px;
}

/* styles for current day above calendar */
.js-current-date {
  font-size: 14px;
  text-transform: capitalize;
  color: var(--purple);

  @media (min-width: 480px) {
    font-size: 20px;
  }
}

/* HEADER */

/* to prevent content of header from going beyond the parent */
.fc-col-header-cell-cushion {
  display: inline
}

/* list view header text position */
.fc-list-heading-main {
  float: left;
}

/* list view header text position */
.fc-list-heading-alt {
  float: right;
}

/* remove the space between the header and the calendar */
.fc-timegrid-divider {
  display: none;
}

/* remove left/right border from header */
.fc-col-header {
  th {
    border-left: none;
    border-right: none;
  }
}

/* styles for header elements with day names */
.fc-col-header-cell {
  padding: 7px !important;
  color: #7A7876 !important;
  padding: 10px;
  font-weight: 500;
  font-size: 0.8rem;
  overflow: hidden;
}

/* styles for header with all day row (allDayText) */
.fc-timegrid-axis-frame-liquid {
  background-color: #F8F8FA;
  color: #B5B4B3;
  font-weight: 500;
  font-size: 0.8rem;

  .fc-scrollgrid-shrink-cushion {
    max-width: 80px;
    padding: 7px;
  }
}

/* styles for all day row in daily view */
.fc-timegrid-axis-frame {
  justify-content: flex-start !important;
  min-height: 40px;
}

/* LEFT TIME AXIS */

/* set width of first column of the table */
.fc-timegrid-cols,
.fc-scroller {
  colgroup {
    col {
      width: 80px !important;
    }
  }
}

/* set width of the first table column content */
.fc-timegrid-slots {
  colgroup {
    col {
      width: 60px !important;
    }
  }
}

/* remove border from left menu with hours */
.fc-timegrid-slot-label {
  border: none !important;
}

/* remove border from left menu with hours */
.fc-timegrid-slot-lane {
  border-left: none !important;
}

/* move the hour to align with the line */
.fc-timegrid-slot-label-cushion {
  transform: translateY(-70%) !important;
  font-size: 0.8rem;
  color: #B5B4B3;
  font-weight: 500;
}

/* hide first hour */
.fc-timegrid-slots tr:first-child>td.fc-timegrid-slot div {
  visibility: hidden !important;
}

/* LIST VIEW */

/* remove event border */
.fc-list-event {
  border: none !important;
}

/* word break in mobile view for list view */
@media (max-width: 480px) {
  .fc-list-table {
    a {
      .fc-event-title {
        white-space: normal !important;
      }
    }
  }
}

/* EVENT */

/* remove dash from time from the event being moved */
.fc-event-mirror {
  .fc-event-time:after {
    display: none
  }
}

/* New element created by selecting */
.fc-event-mirror {
  color: #7B7977 !important;
  border-top-color: var(--purple) !important;
  border-top-style: solid !important;
  background-color: var(--purple-grey-lightest);
  border-top-width: 2px;

  .fc-content {
    align-items: flex-start;
    padding-top: 5px;

    .fc-event-time {
      padding-top: 0;
      font-size: .9rem;
      color: #7B7977;
    }
  }
}

/* Short event (length 1 slot) */
.fc-timegrid-event-short:not(.fc-event-mirror) {
  .fc-content {
    .fc-event-time {
      display: none
    }

    .fc-event-title {
      font-size: 0.8rem;
    }
  }
}

.fc-content {
  padding-left: 5px !important;
}

/* prevent events from overlapping */
.fc-timegrid-event-harness {
  margin-right: 1px
}


/* hide event title while dragging */
.fc-event-dragging .fc-event-title {
  display: none;
}

/* remove border radius from event */
.fc-event {
  border-radius: 0px;
  border: none;
}

/* to modify event colors to make them more bright */
.fc-event-mask {
  background: white;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 25%;
  z-index: 1;
}

.fc-event-trial-lesson-availability-block {
  border-left-width: 2px;
  border-left-style: solid;
}

.fc-event-instructor-absence {
  border-left-width: 2px;
  border-left-style: solid;
  background-image: repeating-linear-gradient(45deg, #f8a871 0 8px, #ef9d5c 8px 16px);
}

/* prevent event name from being greyed out by fc-event-mask */
.fc-event-time,
.fc-event-title {
  z-index: 2 !important;
  position: relative !important;
}

/* FIXED WIDTH COLUMNS */

.x-scroll-calendar {
  .fc-view-harness {
    overflow-x: scroll;

    .fc-view>table {
      min-width: 0;
      width: auto;
    }
  }

  table {
    table-layout: fixed;
  }

  .fc-timegrid-axis {
    min-width: 80px;
  }

  .fc-day,
  .fc-resource {
    width: 100px;
  }

  th {
    overflow-wrap: anywhere;
    width: 100px;
  }
}

/* TAILWIND CALENDAR OVERRIDES */

#calendar.tailwind-calendar {
  padding: 0px;
  position: relative;

  /* Highlighted background of today column/square */
  .fc-view-harness div.fc-view {

    .fc-timegrid-col.fc-day-today,
    .fc-daygrid-day.fc-day-today {
      background: rgba(114, 170, 254, 0.1) !important;

      /* bold day text in month view */
      .fc-daygrid-day-top {
        font-weight: 700;
        color: #232130;
      }
    }

    /* borders in headers in week view */
    &.fc-timeGridWeek-view {
      table.fc-col-header {
        th.fc-col-header-cell {
          padding-top: 15px !important;
          padding-bottom: 15px !important;

          .fc-header-date,
          .fc-header-weekday {
            font-family: 'Open Sans', sans-serif;
            font-weight: 600;
            font-size: 11px;
            line-height: 16.5px;
            color: #7A7876;
          }
        }

        th.fc-col-header-cell.fc-day-today {

          .fc-header-date,
          .fc-header-weekday {
            color: #49494D;
          }
        }
      }
    }

    /* Remove today highlight from timegrid day view */
    &.fc-resourceTimeGridDay-view {

      .fc-timegrid-col.fc-day-today,
      .fc-daygrid-day.fc-day-today {
        background: white !important;
      }
    }

    .fc-event {
      .fc-event-title {
        font-size: 12px;
        line-height: 16px;
      }

      .fc-event-time {
        line-height: 12px;
      }

      border-radius: 4px;
    }
  }

  /* Time indicator styles */
  .fc-timegrid-now-indicator-line {
    border-width: 2px 0px 0px;
    border-color: #FF6633;
  }

  .fc-timegrid-now-indicator-arrow {
    border-left-color: #FF6633;
    border-right-color: #FF6633;
  }

  /* styles for header with all day row (allDayText) */
  .fc-timegrid-axis-frame-liquid {
    font-size: 0.7rem;
    background-color: white;
  }


  .fc-timegrid-slot-label-cushion {
    transform: translateY(-88%) !important;
    font-size: 11px;
    color: #B5B4B3;
    font-weight: 600;
    padding-right: 12px;
  }

  /* Headers of timegrid */
  .fc-scrollgrid-section-header .fc-col-header-cell {
    border-top-right-radius: 0px;
    border-top-left-radius: 0px;

    &.fc-timegrid-axis {
      border-top-left-radius: 8px;
    }
  }

  .fc-col-header-cell {
    &.fc-day-today {
      background: rgba(114, 170, 254, 0.1) !important;

      span {
        font-weight: 600;
        color: #232130;
      }
    }
  }

  /* List view */
  .fc-list {
    border-radius: 8px;
    overflow: hidden;
    border-color: #F1F1F2;

    /* Day row */
    .fc-list-day {

      /* Correctly handle border of top row to not allow broken corners */
      &:first-child {
        border-top-left-radius: 8px;
        border-top-right-radius: 8px;
        overflow: hidden;
      }

      /* Highlight current day */
      &.fc-day-today .fc-list-day-cushion {
        background-color: #F1F7FF;
        font-weight: 700;
      }

      /* Day text styles */
      th {
        border-color: #F1F1F2;

        .fc-list-day-cushion {
          background-color: #F1F1F2;
          font-family: 'Open Sans', sans-serif;
          font-weight: 600;
          color: #232130;
          font-size: 13px;

          /* Day name */
          .fc-list-heading-main {
            text-transform: uppercase;
            padding: 2px 0px 1px 0px;
          }

          /* Date on the right */
          .fc-list-heading-alt {
            padding: 2px 0px 1px 0px;
          }
        }
      }
    }

    /* Event styles */
    .fc-event {
      font-size: 12px;
      line-height: 18px;

      td {
        border-color: #F1F1F2;
      }
    }

    .fc-list-event-graphic {
      padding-left: 2px;
    }
  }
}

/* Keep the body alias: application.css compiles it to the Bootstrap content root. */
body[data-style-context="bootstrap"] .fc-col-header-cell,
[data-style-context="bootstrap"] .fc-col-header-cell {
  font-size: 0.7rem;
}

body[data-style-context="bootstrap"] .fc-timegrid-axis-frame-liquid,
[data-style-context="bootstrap"] .fc-timegrid-axis-frame-liquid {
  font-size: 0.7rem;
}

body[data-style-context="bootstrap"] .fc-timegrid-slot-label-cushion,
[data-style-context="bootstrap"] .fc-timegrid-slot-label-cushion {
  font-size: 0.7rem;
}

body[data-style-context="bootstrap"] .fc-event-mirror .fc-content .fc-event-time,
[data-style-context="bootstrap"] .fc-event-mirror .fc-content .fc-event-time {
  font-size: 0.7875rem;
}

body[data-style-context="bootstrap"] .fc-timegrid-event-short:not(.fc-event-mirror) .fc-content .fc-event-title,
[data-style-context="bootstrap"] .fc-timegrid-event-short:not(.fc-event-mirror) .fc-content .fc-event-title {
  font-size: 0.7rem;
}

body[data-style-context="bootstrap"] #calendar.tailwind-calendar .fc-timegrid-axis-frame-liquid,
[data-style-context="bootstrap"] #calendar.tailwind-calendar .fc-timegrid-axis-frame-liquid {
  font-size: 0.6125rem;
}

.air-datepicker.-inline-.air-datepicker-custom {
  font-family: Open Sans, sans-serif;
  border-radius: 0.5rem;
  border-color: #ddd;
  padding: .75rem;
  padding-top: .25rem;

  .air-datepicker-body--day-name {
    color: #919097;
  }

  .air-datepicker-nav {
    .air-datepicker-nav--title {
      color: black;

      i {
        color: black;
      }
    }

    .air-datepicker-nav--action path {
      stroke: #6541B0;
    }
  }

  .air-datepicker-cell {
    color: black;

    &.-current- {
      color: #7638F2;
    }

    &.-focus-:not(.-selected-) {

      background: #F1F1F2;
    }

    &.-selected- {
      background: #6541B0;
      color: white;
    }

    &.-day-.-disabled-,
    &.-month-.-disabled-,
    &.-year-.-disabled- {
      color: #E5E5E5;
      cursor: not-allowed;
    }

    &.-day-:not(.-selected-):not(.-disabled-).-other-month- {
      color: #939299;
    }
  }
}

.mail-preview {
  display: flex;

  .text-xs {
    font-size: inherit;
    line-height: inherit;
  }

  .btn-primary {
    background-color: #6541B0;
    border-radius: 0.375rem;
    letter-spacing: 0.025em;
    font-size: 0.75rem;
    height: -moz-fit-content;
    height: fit-content;
    font-weight: 700;
    color: #ffffff;
    text-align: center;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    border-width: 1px;
    border-color: transparent;

    &:hover {
      cursor: pointer;
      background-color: #7638F2;
    }
  }

  .background {
    margin: 0;
    padding: 10px;
    height: 100% !important;
    width: 100% !important;
    -webkit-text-size-adjust: none;
    background-color: #f5f8f9;
    color: black;
    font-family: Arial;
    font-size: 18px;
  }

  p {
    margin-block-start: 1rem;
    margin-block-end: 1rem;
  }
}

@layer custom {
  /* The scope root does not match its own descendant utilities. */
  .tailwind-view.modal {
    position: absolute;
    z-index: 30;
    transition-duration: 0.3s;
  }

  .tailwind-view.modal.opacity-0 {
    opacity: 0;
  }
}

/* Document and service rules stay outside the page's content scope. */
html:has(> body[data-page-style-context="bootstrap"]) {
  min-height: 100%;
  scroll-behavior: auto;
}

body[data-page-style-context="bootstrap"] {
  width: 100%;
  min-height: 100vh;
}

body[data-page-style-context="bootstrap"] .woot--bubble-holder > button {
  z-index: var(--layer-chatwoot, 1000) !important;
  border-radius: 100px !important;
}