/* Minification failed. Returning unminified contents.
(504,1): run-time error CSS1019: Unexpected token, found '@import'
(504,9): run-time error CSS1019: Unexpected token, found 'url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,200;0,400;0,500;0,600;0,700;0,800;1,200;1,300;1,400;1,500;1,600;1,700;1,800&family=Open+Sans:wght@300&family=Plus+Jakarta+Sans:ital,wght@0,200;0,400;0,500;0,600;1,200;1,600&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto+Condensed:wght@100;200&display=swap')'
(517,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(517,32): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(517,60): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(517,78): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(517,91): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(517,119): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(517,164): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(517,197): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(517,216): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(517,236): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(517,256): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(517,272): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(517,297): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(517,317): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(517,342): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(517,364): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(517,388): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(517,408): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(517,420): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(517,463): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(517,554): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(522,128): run-time error CSS1039: Token not allowed after unary operator: '-background'
(522,183): run-time error CSS1039: Token not allowed after unary operator: '-text-color'
(523,39): run-time error CSS1039: Token not allowed after unary operator: '-main-text'
(527,70): run-time error CSS1039: Token not allowed after unary operator: '-radius'
(529,61): run-time error CSS1039: Token not allowed after unary operator: '-main-font'
(529,90): run-time error CSS1039: Token not allowed after unary operator: '-main-text'
(539,131): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(544,94): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(545,81): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(551,75): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(579,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(580,10): run-time error CSS1035: Expected colon, found '{'
(606,92): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(647,44): run-time error CSS1039: Token not allowed after unary operator: '-over-color'
(708,53): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(867,146): run-time error CSS1039: Token not allowed after unary operator: '-border-color'
(882,92): run-time error CSS1039: Token not allowed after unary operator: '-gap'
(883,51): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(896,42): run-time error CSS1039: Token not allowed after unary operator: '-popins'
(900,41): run-time error CSS1039: Token not allowed after unary operator: '-text-white'
(902,48): run-time error CSS1039: Token not allowed after unary operator: '-main-background'
(903,48): run-time error CSS1039: Token not allowed after unary operator: '-midgrey'
(904,55): run-time error CSS1039: Token not allowed after unary operator: '-highlight'
(916,42): run-time error CSS1039: Token not allowed after unary operator: '-radius'
(917,48): run-time error CSS1039: Token not allowed after unary operator: '-radius-adaptive'
(998,71): run-time error CSS1039: Token not allowed after unary operator: '-text-white'
(1000,102): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(1015,90): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1015,133): run-time error CSS1039: Token not allowed after unary operator: '-midgrey'
(1024,53): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1054,77): run-time error CSS1039: Token not allowed after unary operator: '-main-text'
(1057,44): run-time error CSS1039: Token not allowed after unary operator: '-hover'
(1066,76): run-time error CSS1039: Token not allowed after unary operator: '-main-color'
(1079,45): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(1093,180): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(1094,43): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(1102,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1102,32): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1102,55): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1102,82): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1102,104): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1102,130): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1107,65): run-time error CSS1039: Token not allowed after unary operator: '-button-radius'
(1107,257): run-time error CSS1039: Token not allowed after unary operator: '-text'
(1108,44): run-time error CSS1039: Token not allowed after unary operator: '-over-color'
(1109,70): run-time error CSS1039: Token not allowed after unary operator: '-press-color'
(1110,46): run-time error CSS1039: Token not allowed after unary operator: '-context'
(1110,90): run-time error CSS1039: Token not allowed after unary operator: '-outline'
(1114,35): run-time error CSS1039: Token not allowed after unary operator: '-button-extra-height'
(1114,74): run-time error CSS1039: Token not allowed after unary operator: '-button-text-size'
(1148,35): run-time error CSS1039: Token not allowed after unary operator: '-main-color'
(1149,33): run-time error CSS1039: Token not allowed after unary operator: '-green'
(1150,37): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(1157,42): run-time error CSS1039: Token not allowed after unary operator: '-special-color'
(1158,44): run-time error CSS1039: Token not allowed after unary operator: '-hover'
(1161,65): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(1165,83): run-time error CSS1039: Token not allowed after unary operator: '-button-text-size'
(1175,13): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1175,42): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1188,36): run-time error CSS1039: Token not allowed after unary operator: '-input-height'
(1191,84): run-time error CSS1039: Token not allowed after unary operator: '-input-height'
(1191,116): run-time error CSS1039: Token not allowed after unary operator: '-input-padding'
(1191,323): run-time error CSS1039: Token not allowed after unary operator: '-button-radius'
(1214,142): run-time error CSS1039: Token not allowed after unary operator: '-text'
(1216,128): run-time error CSS1039: Token not allowed after unary operator: '-button-radius'
(1235,44): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(1242,61): run-time error CSS1039: Token not allowed after unary operator: '-error-color'
(1250,53): run-time error CSS1039: Token not allowed after unary operator: '-input-color'
(1253,64): run-time error CSS1039: Token not allowed after unary operator: '-input-color'
(1264,180): run-time error CSS1039: Token not allowed after unary operator: '-error-color'
(1268,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(1269,10): run-time error CSS1035: Expected colon, found '{'
(1282,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(1283,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(1288,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(1289,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '100%'
(1300,13): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
 */
/*!
 * knockout-daterangepicker
 * version: 0.1.0
 * authors: Sensor Tower team
 * license: MIT
 * https://sensortower.github.io/daterangepicker
 */
.daterangepicker {
  display: none;
  position: absolute;
  background: white;
  box-shadow: 0 2px 15px rgba(0, 0, 0, 0.3);
  -ms-flex-pack: start;
      justify-content: flex-start;
  border-radius: 4px;
  padding: 4px;
  font-size: 13px;
  font-family: sans-serif;
  line-height: 1.5em;
}

.daterangepicker ul, .daterangepicker li, .daterangepicker button, .daterangepicker form {
  padding: 0;
  margin: 0;
  border: 0;
  list-style: none;
  outline: none;
}

.daterangepicker .controls {
  min-width: 180px;
  margin: 4px;
}

.daterangepicker .periods li,
.daterangepicker .ranges li {
  margin: 0;
  padding: 4px 9px;
  margin: 0;
  background: #f5f5f5;
  color: #08c;
  cursor: pointer;
}

.daterangepicker .periods li:hover, .daterangepicker .periods li.active,
.daterangepicker .ranges li:hover,
.daterangepicker .ranges li.active {
  background: #08c;
  color: white;
}

.daterangepicker .periods {
  display: -ms-inline-flexbox;
  display: inline-flex;
  margin: 0 auto 8px;
}

.daterangepicker .periods li:first-child {
  border-radius: 4px 0 0 4px;
}

.daterangepicker .periods li:last-child {
  border-radius: 0 4px 4px 0;
}

.daterangepicker .ranges {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  -ms-flex-align: stretch;
      align-items: stretch;
}

.daterangepicker .ranges li {
  border-radius: 4px;
  margin-bottom: 8px;
  text-align: left;
}

.daterangepicker .custom-range-inputs {
  display: -ms-flexbox;
  display: flex;
  margin: -3px;
  margin-bottom: 5px;
}

.daterangepicker .custom-range-inputs input {
  min-width: 50px;
  width: 50px;
  -ms-flex: 1;
      flex: 1;
  margin: 3px;
  border-radius: 4px;
  border: 1px solid #ccc;
  height: auto;
  padding: 0.5em;
  font-size: 13px;
  color: #333;
}

.daterangepicker .custom-range-buttons {
  display: -ms-flexbox;
  display: flex;
  margin: -3px;
}

.daterangepicker .custom-range-buttons button {
  margin: 0;
  padding: 4px 9px;
  margin: 3px;
  border-radius: 4px;
  background: #f5f5f5;
  color: #08c;
}

.daterangepicker .custom-range-buttons button:hover {
  background: gainsboro;
}

.daterangepicker .custom-range-buttons button.apply-btn {
  background: #38A551;
  color: white;
}

.daterangepicker .custom-range-buttons button.apply-btn:hover {
  background: #2b7f3e;
}

.daterangepicker .arrow-left,
.daterangepicker .arrow-right {
  display: inline-block;
  position: relative;
  background-color: #333;
  width: 7px;
  height: 3px;
  margin-bottom: 2px;
  vertical-align: middle;
}

.daterangepicker .arrow-left:before,
.daterangepicker .arrow-right:before {
  content: '';
  display: block;
  position: absolute;
  border: 5px solid transparent;
}

.daterangepicker .arrow-left {
  margin-left: 5px;
}

.daterangepicker .arrow-left:before {
  border-right-width: 6px;
  border-right-color: #333;
  transform: translate(-10px, -3.5px);
}

.daterangepicker .arrow-right {
  margin-right: 5px;
}

.daterangepicker .arrow-right:before {
  border-left-width: 6px;
  border-left-color: #333;
  transform: translate(6px, -3.5px);
}

.daterangepicker.orientation-right:not(.standalone):before {
  position: absolute;
  top: -7px;
  left: 9px;
  display: inline-block;
  border-right: 7px solid transparent;
  border-bottom: 7px solid rgba(0, 0, 0, 0.2);
  border-left: 7px solid transparent;
  content: '';
}

.daterangepicker.orientation-left:not(.standalone):before {
  position: absolute;
  top: -7px;
  right: 9px;
  display: inline-block;
  border-right: 7px solid transparent;
  border-bottom: 7px solid rgba(0, 0, 0, 0.2);
  border-left: 7px solid transparent;
  content: '';
}

.daterangepicker.orientation-right:not(.standalone):after {
  position: absolute;
  top: -6px;
  left: 10px;
  display: inline-block;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #fff;
  border-left: 6px solid transparent;
  content: '';
}

.daterangepicker.orientation-left:not(.standalone):after {
  position: absolute;
  top: -6px;
  right: 10px;
  display: inline-block;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #fff;
  border-left: 6px solid transparent;
  content: '';
}

.daterangepicker select {
  width: 100%;
  box-sizing: border-box;
  padding: 2px 7px;
  height: auto;
  font-size: 13px;
  line-height: 1.5em;
  text-align: center;
  margin: 0 2px;
}

.daterangepicker select.hidden {
  display: none;
}

.daterangepicker select.month-select {
  -ms-flex: 10;
      flex: 10;
  max-width: 75%;
}

.daterangepicker select.year-select {
  -ms-flex: 11;
      flex: 11;
  max-width: 75%;
}

.daterangepicker select.decade-select {
  -ms-flex: 11;
      flex: 11;
  max-width: 75%;
}

.calendar {
  display: none;
  margin: 4px;
}

.calendar .calendar-header,
.calendar .calendar-table {
  min-width: 190px;
  margin-left: auto;
  margin-right: auto;
}

.calendar .calendar-title {
  margin: 0;
  padding: 4px 9px;
  margin: 0 auto;
  margin-bottom: 8px;
  text-align: center;
  display: block;
}

.calendar .calendar-header button {
  margin: 0;
  padding: 4px 9px;
  width: 100%;
  padding-left: 0;
  padding-right: 0;
  border-radius: 4px;
  background: transparent;
}

.calendar .calendar-header button:hover {
  background: #f5f5f5;
}

.calendar .calendar-header {
  display: -ms-flexbox;
  display: flex;
  margin: 0 6px 4px;
}

.calendar .calendar-header .calendar-selects {
  -ms-flex: 5;
      flex: 5;
  text-align: center;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: center;
      align-items: center;
  padding: 2px;
}

.calendar .calendar-header .arrow {
  -ms-flex: 1;
      flex: 1;
  text-align: center;
}

.calendar .calendar-header .arrow.arrow-hidden {
  visibility: hidden;
}

.calendar .calendar-table {
  height: 180px;
  border: 1px solid #f5f5f5;
  border-radius: 4px;
  overflow: hidden;
  padding: 5px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-line-pack: stretch;
      align-content: stretch;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  -ms-flex-direction: column;
      flex-direction: column;
}

.calendar .calendar-table .table-row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-line-pack: stretch;
      align-content: stretch;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  -ms-flex: 1;
      flex: 1;
}

.calendar .calendar-table .table-row .table-col {
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1;
      flex: 1;
  text-align: center;
  line-height: 1;
  cursor: default;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.calendar .calendar-table .table-row .table-col .table-value-wrapper {
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1;
      flex: 1;
  -ms-flex-align: center;
      align-items: center;
}

.calendar .calendar-table .table-row .table-col .table-value-wrapper .table-value {
  -ms-flex: 1;
      flex: 1;
}

.calendar .calendar-table .table-row .table-col.out-of-boundaries, .calendar .calendar-table .table-row .table-col.unavailable,
.calendar .calendar-table .table-row .table-col .week-day.unavailable {
  color: #bbb;
}

.calendar .calendar-table .table-row .table-col.in-range {
  background: rgba(0, 136, 204, 0.1);
}

.calendar .calendar-table .table-row .table-col.clickable {
  cursor: pointer;
}

.calendar .calendar-table .table-row .table-col.clickable:hover .table-value-wrapper {
  background: #eee;
  border-radius: 4px;
}

.calendar .calendar-table .table-row .table-col.start-date .table-value-wrapper, .calendar .calendar-table .table-row .table-col.end-date .table-value-wrapper {
  border-radius: 4px;
}

.calendar .calendar-table .table-row .table-col.start-date .table-value-wrapper, .calendar .calendar-table .table-row .table-col.start-date .table-value-wrapper:hover, .calendar .calendar-table .table-row .table-col.end-date .table-value-wrapper, .calendar .calendar-table .table-row .table-col.end-date .table-value-wrapper:hover {
  background: #08c;
  color: white;
}

.calendar .calendar-table .table-row .table-col.start-date.out-of-boundaries .table-value-wrapper, .calendar .calendar-table .table-row .table-col.start-date.out-of-boundaries .table-value-wrapper:hover, .calendar .calendar-table .table-row .table-col.end-date.out-of-boundaries .table-value-wrapper, .calendar .calendar-table .table-row .table-col.end-date.out-of-boundaries .table-value-wrapper:hover {
  background: #bbb;
}

.calendar .calendar-table .table-row .table-col.start-date {
  border-radius: 4px 0 0 4px;
}

.calendar .calendar-table .table-row .table-col.end-date {
  border-radius: 0 4px 4px 0;
}

.calendar .calendar-table .table-row .table-col .week-day {
  -ms-flex: 1;
      flex: 1;
  text-align: center;
}

.calendar .calendar-table .table-row.weekdays .table-col {
  font-weight: bold;
}

.daterangepicker.opened {
  display: -ms-inline-flexbox;
  display: inline-flex;
}

.daterangepicker.expanded .calendar {
  display: block;
}

.daterangepicker.hide-periods .periods {
  display: none;
}

.daterangepicker.hide-periods .calendar .calendar-title {
  display: none;
}

.daterangepicker.standalone {
  position: static;
}

.daterangepicker.standalone .custom-range-buttons {
  display: none;
}

.daterangepicker.hide-weekdays .weekdays {
  display: none;
}

.daterangepicker.single {
  -ms-flex-direction: column;
      flex-direction: column;
}

.daterangepicker.single .ranges,
.daterangepicker.single .custom-range-inputs,
.daterangepicker.single .custom-range-buttons,
.daterangepicker.single .calendar .calendar-title {
  display: none;
}

.daterangepicker.single .controls {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
}

.daterangepicker.single .controls .periods {
  margin-bottom: 0;
}

.daterangepicker.single .calendar .calendar-header {
  margin-left: 0;
  margin-right: 0;
}

.daterangepicker.single .calendar .calendar-table {
  border: none;
  padding: 0;
}

.daterangepicker.single.hide-periods .controls {
  display: none;
}

.daterangepicker.month-period .table-col {
  font-size: 1.25em;
}

.daterangepicker.year-period .table-col {
  font-size: 1.25em;
}

.daterangepicker.quarter-period .table-col {
  -ms-flex-direction: column;
      flex-direction: column;
  font-size: 2em;
}

.daterangepicker.quarter-period .table-col .months {
  font-size: 0.5em;
  opacity: 0.75;
}

.daterangepicker.orientation-left:not(.single) .controls {
  -ms-flex-order: 2;
      order: 2;
}

@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,200;0,400;0,500;0,600;0,700;0,800;1,200;1,300;1,400;1,500;1,600;1,700;1,800&family=Open+Sans:wght@300&family=Plus+Jakarta+Sans:ital,wght@0,200;0,400;0,500;0,600;1,200;1,600&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto+Condensed:wght@100;200&display=swap');



* { /* box-shadow:0 0 0 1px red!important;*/ }
* { box-sizing: border-box; margin: 0; padding: 0; outline: none; border: none }



li { list-style: none; }
a { color: inherit; text-decoration: none; }


:root { --main-color: #FDD65D; --main-background: #FDD65D; --green: #1c8e27; --gap: 10px; --secondary-color: #3169DE; --main-font: 'Roboto Condensed', sans-serif; --popins: 'Poppins', sans-serif; --main-text: 16px; --text-color: #000; --text-white: #fff; --radius: 10px; --radius-adaptive: 10px; --background: #fff; --border-color: #e4e4e4; --highlight: #F2F2F2; --error-color: #ce0000; --midgrey: #878787; --index: 9; --midgrey-light: rgba(135, 135, 135, 0.2); --over-color: linear-gradient(to top, var(--midgrey-light) 0%, var(--midgrey-light) 100%); --press-color: linear-gradient(to top, var(--midgrey-light) 0%, var(--midgrey-light) 100%); }



html { -webkit-tap-highlight-color: rgba(0,0,0,0); touch-action: manipulation; }
html, body { width: 100%; margin: 0; padding: 0; box-sizing: border-box; position: relative; cursor: default; background: var(--background); overscroll-behavior-x: none; color: var(--text-color); }
body { display: flex; font-size: var(--main-text); min-height: 100vh; }

body { overflow-x: hidden; justify-content: center }
app, view { display: flex; width: 100%; flex-direction: column; }
app { flex: 1; max-width: 1200px; padding: 50px; border-radius: var(--radius) }

html, body, input, button, textarea, li { font-family: var(--main-font); font-size: var(--main-text); font-weight: 500; }

/*Tatul*/

.k-popup { box-shadow: 0px 8px 0 -4px rgba(0,0,0,.05),0 0 0 1px rgba(0,0,0,.05), 0 15px 20px -10px rgba(0,0,0,.3); }

/*.multiset.k-popup----------------*/
.multiset.k-popup .k-list .k-item { overflow: hidden; display: flex; flex-direction: column; padding: 0; line-height: 40px; height: auto; max-height: 40px; box-shadow: inset 0px -1px 0 0 rgb(229, 229, 229); }
    .multiset.k-popup .k-list .k-item wrap { display: flex; align-items: center; padding: 0 10px; height: 40px; font-weight: 400; }
    .multiset.k-popup .k-list .k-item text { flex: 1; }
    .multiset.k-popup .k-list .k-item:hover, .multiset.k-popup .k-list .k-item.k-state-focused { color: inherit; background: var(--secondary-color); }


    .multiset.k-popup .k-list .k-item ul { background: #fafafa; }
        .multiset.k-popup .k-list .k-item ul li { padding-left: 40px; box-shadow: inset 0px -1px 0 0 rgba(0, 0, 0, 0.05); }
            .multiset.k-popup .k-list .k-item ul li:hover { color: inherit; background: var(--secondary-color); }
            .multiset.k-popup .k-list .k-item ul li.selected { background: var(--secondary-color); }
            .multiset.k-popup .k-list .k-item ul li wrap { line-height: 30px; height: 30px; }

    .multiset.k-popup .k-list .k-item.open { max-height: 100%; }
    .multiset.k-popup .k-list .k-item icon { color: #6b6b6b; font-size: 25px; }
    .multiset.k-popup .k-list .k-item.open icon { transform: rotate(180deg); }
    .multiset.k-popup .k-list .k-item.k-state-selected { background: var(--secondary-color); }
    .multiset.k-popup .k-list .k-item ul li:last-child { /* box-shadow: none; */ }
/*-----------------*/



/* calendar picker */

.daterangepicker { z-index: 1000; }


/* kendo inputs */

.k-widget { position: relative; float: left; }
    .k-widget.k-combobox { /*min-width:170px;*/ width: 100%; }
    .k-widget.k-datepicker { /*width:240px;*/ display: inline-block; }
    .k-widget.k-timepicker { /*width:75px;*/ display: inline-block; }
    .k-widget.k-header { min-height: 30px; box-sizing: border-box; }
.flex_row .k-widget.k-datetimepicker.k-header { }

.k-picker-wrap { float: left; width: 100%; }
.k-dropdown-wrap { width: 100%; float: left; }
.k-datetimepicker.k-widget.k-header .k-input { padding: 0 60px 0 0; }
.k-widget.k-header input.k-input, .k-widget.k-header span.k-input { padding: 0 30px 0 15px; min-width: 0px; margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; background-color: transparent; }
.k-widget.k-header .k-input { height: 30px; line-height: 30px; padding: 0 7px; background: #fff; width: 100%; -webkit-transition: none; text-overflow: ellipsis; /*box-shadow:0 0 0 1px rgba(0,0,0,.1);*/ display: block }

td .k-widget.k-header input.k-input { font-weight: inherit }

@keyframes highlight {
    from { font-weight: 400 }
    to { font-weight: 700 }
}

td.highlight { animation: highlight linear .5s infinite }

.k-dropdown-wrap.k-state-focused .k-input, .k-picker-wrap.k-state-focused .k-input { /*box-shadow: 0 0 0 1px rgba(0,0,0,.1), 0 0 0 3px rgba(71,77,162,0.1);*/ }

.k-list-filter input { height: 30px; line-height: 30px; padding: 0 30px 0 7px; background: #fff; width: 100%; -webkit-transition: none; color: #000; text-overflow: ellipsis; display: block }
.k-select, .k-list-filter span { width: 30px; box-sizing: border-box; position: absolute; top: 0; right: 0; cursor: pointer; }

.k-widget.k-header .k-select { width: 30px; font-size: 0; line-height: 1; }
.k-datetimepicker.k-widget.k-header .k-select { width: 60px; z-index: 1; }
    .k-datetimepicker.k-widget.k-header .k-select:active { padding-top: 0px; }
    .k-datetimepicker.k-widget.k-header .k-select > span:active { padding-top: 1px; }
.k-widget.k-header .k-select:active { padding-top: 1px; }
.k-popup.k-list-container { padding: 0; border: 0; box-sizing: border-box; background: #fff; overflow-x: hidden; overflow-y: auto; }
.k-popup .k-list { /*margin: 5px;*/ min-height: 30px; -ms-overflow-style: -ms-autohiding-scrollbar; overflow: overlay; }
    .k-popup .k-list .k-item { line-height: 40px; height: 40px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; cursor: pointer; padding: 0 10px; color: #000; list-style: none; }

        .k-popup .k-list .k-item .icon { margin: 0 5px 0 -10px; }

        .k-list-optionlabel.k-state-focused, .k-popup .k-list .k-item.k-state-focused { background: rgba(0, 0, 0, 0.1); }
        .k-popup .k-list .k-item.k-state-selected.k-item.deleted.k-state-focused { font-style: italic; font-weight: 400; background: transparent; }
        .k-popup .k-list .k-item.k-state-selected { font-weight: 700; }

        .k-popup .k-list .k-item:hover, .k-list-optionlabel:hover { background-color: var(--secondary-color); color: #fff; }
        .k-popup .k-list .k-item:active, .k-list-optionlabel:active { line-height: 41px }
.k-list-optionlabel { height: 30px; line-height: 30px; padding: 0 10px; font-weight: 700; cursor: pointer; background: rgba(0, 0, 0, 0.1); display: block; position: relative; margin: 5px; }

.k-list-filter, .k-header-item { height: 30px; display: block; position: relative; margin: 5px; }

    .k-header-item .button { width: 100%; }
:focus { outline: none }

.k-tabstrip-wrapper { height: 100%; }

.filter_block .k-widget.k-header .k-input, .filter_block .k-widget.k-multiselect.k-header { background: #283947; color: #fff; box-shadow: none }
/*-------------*/



/*scrollbars*/

.k-desktop ::-webkit-scrollbar-track { background-color: rgba(0,0,0,0); }
.k-desktop ::-webkit-scrollbar { width: 12px; height: 12px; background-color: transparent; }
.k-desktop ::-webkit-scrollbar-thumb { background-color: rgba(0,0,0,.2); background-clip: padding-box; height: 40px; width: 40px; }
    .k-desktop ::-webkit-scrollbar-thumb:hover { background-color: rgba(0,0,0,.3); }
.k-desktop ::-webkit-scrollbar-button { height: 0px; width: 0px; background: transparent }

/**/

.k-desktop .filter_content::-webkit-scrollbar-track { background-color: rgba(0, 0, 0, 0); border: 8px solid rgba(0, 0, 0, 0); background-clip: padding-box; }
    .k-desktop .filter_content::-webkit-scrollbar-track:hover { background-color: rgba(0, 0, 0, .05); }
.k-desktop .filter_content::-webkit-scrollbar { width: 20px; height: 20px; background-color: rgba(0, 0, 0, 0); border: 8px solid rgba(0, 0, 0, 0); background-clip: padding-box; }
.k-desktop .filter_content::-webkit-scrollbar-thumb { background-color: rgba(0, 0, 0, .15); border: 8px solid rgba(0, 0, 0, 0); background-clip: padding-box; width: 60px; height: 60px; }
    .k-desktop .filter_content::-webkit-scrollbar-thumb:hover { background-color: rgba(0, 0, 0, .3); border: 7px solid rgba(0, 0, 0, 0); }
.k-desktop .filter_content::-webkit-scrollbar-button { height: 0; width: 0; background: transparent; }

.k-desktop .filter_container { scrollbar-face-color: #2f4150; scrollbar-arrow-color: #2f4150; scrollbar-track-color: #2f4150; scrollbar-3dlight-color: #2f4150; scrollbar-darkshadow-color: #2f4150; scrollbar-highlight-color: #2f4150; scrollbar-shadow-color: #2f4150; scrollbar-face-color: #233341; }

.k-desktop .k-popup .k-list { scrollbar-face-color: #fff; scrollbar-arrow-color: #fff; scrollbar-track-color: #fff; scrollbar-3dlight-color: #fff; scrollbar-darkshadow-color: #fff; scrollbar-highlight-color: #fff; scrollbar-shadow-color: #fff; scrollbar-face-color: #233341; }

/*kendo icons ligature*/
.k-icon, icon { font-family: "Material Symbols Rounded"; font-weight: normal; font-style: normal; font-size: 0; line-height: 1; letter-spacing: normal; text-transform: none; display: flex; align-items: center; justify-content: center; white-space: nowrap; word-wrap: normal; direction: ltr; font-feature-settings: "liga"; -webkit-font-smoothing: antialiased; height: 30px; width: 30px; border-radius: 10px; flex-shrink: 0; overflow: hidden; font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24; }
.k-icon::after { font-size: 24px; }
 .k-icon::avtive { transform: translateY(1px); }
    .k-icon:hover { background-image: var(--over-color); }

/*    .k-icon:after { width: 30px; height: 30px; min-width: 30px; font-size: 25px; display: flex; -moz-font-feature-settings: "liga=1, dlig=1"; -ms-font-feature-settings: "liga", "dlig"; -webkit-font-feature-settings: "liga", "dlig"; -o-font-feature-settings: "liga", "dlig"; font-feature-settings: "liga", "dlig"; font-variant-ligatures: common-ligatures; text-rendering: optimizeLegibility; font-family: icon; display: flex; display: -ms-flexbox; display: -webkit-flex; align-items: center; -ms-flex-align: center; justify-content: center; -ms-flex-pack: center; font-weight: 400; font-style: normal; user-select: none; text-transform: lowercase; position: relative; z-index: 9; overflow: hidden; }*/

    .k-icon.k-delete:after { content: ' delete'; }
.k-multiselect-wrap .k-icon.k-delete:after { content: 'cancel'; }

.k-icon.k-i-arrow-s:after { content: 'expand_more'; }
.k-icon.k-i-arrow-w:after { content: 'chevron_left'; }
.k-icon.k-i-arrow-e:after { content: 'chevron_right'; }
.k-icon.k-i-arrow-n:after { content: 'arrow_n'; }

.k-icon.k-i-seek-n:after { }
.k-icon.k-i-seek-s:after { }
.k-icon.k-i-seek-w:after { content: 'chevron_double_w'; }
.k-icon.k-i-seek-e:after { content: 'chevron_double_e'; }

.k-icon.k-i-clock:after { content: ' recent '; }
.k-icon.k-i-calendar:after { content: ' date '; }

.k-grid-content tr td.k-hierarchy-cell .k-icon.k-minus:after { content: 'arrow_s'; }
.k-grid-content tr td.k-hierarchy-cell .k-icon.k-plus:after { content: 'arrow_e'; }


/*============START DATE/TIME PICKER==================*/
.dropdown-menu { position: absolute; z-index: 99999; background: #fff; padding: 5px; box-shadow: 0 0 0 1px rgba(0,0,0,.03), 0 10px 30px -10px rgba(0,0,0,.2); max-width: 250px; }
    .dropdown-menu table { table-layout: fixed; border-spacing: 0; }
    .dropdown-menu .list-unstyled { position: relative; font-size: 13px; }
    .dropdown-menu .picker-switch { /* background: #F44336; */ text-align: center; /* color: #fff; */ cursor: pointer; }
        .dropdown-menu .picker-switch.accordion-toggle { /* background: #8BC34A; */ }
            .dropdown-menu .picker-switch.accordion-toggle a { background: rgba(0, 0, 0, 0.05); min-height: 30px; line-height: 30px; }
    .dropdown-menu .table-condensed { width: 100%; }
        /*.dropdown-menu .table-condensed a {display:block;text-align:center;}*/
        .dropdown-menu .table-condensed a { display: flex; display: -ms-flexbox; justify-content: center; -ms-flex-pack: center; align-items: center; -ms-flex-align: center; }
    .dropdown-menu .k-icon { cursor: pointer; }
    .dropdown-menu .table-condensed a .k-icon:before { /* color:#fff; */ }
    .dropdown-menu .table-condensed button { /* background:#4CAF50; */ min-width: 0; margin: 0 auto; display: block; float: none; }
    .dropdown-menu .collapse { position: relative; width: 100%; z-index: 99; display: none; background-color: #fff; }
        .dropdown-menu .collapse.in { display: block; }
    .dropdown-menu .table-condensed .timepicker-hour:hover { box-shadow: none }

    .dropdown-menu .hour { padding: 10px }
    .dropdown-menu .minute { padding: 10px; }
    .dropdown-menu .day { padding: 10px; text-align: center; }
    .dropdown-menu .old, .new, .disabled { color: rgba(0, 0, 0, 0.2); }
    .dropdown-menu .dow { padding: 10px; text-align: center; }
    .dropdown-menu .datepicker { }
    .dropdown-menu .timepicker table { width: 100%; /* background: #CDDC39; */ }
    .dropdown-menu .timepicker td { text-align: center }
    .dropdown-menu .datepicker-months { }
        .dropdown-menu .datepicker-months table { width: 100%; table-layout: fixed; }
    .dropdown-menu .month { text-align: center; text-shadow: 0 -1px 0 rgba(0,0,0,0.25); width: 20%; min-height: 50px; display: inline-block; line-height: 50px; }
    .dropdown-menu .datepicker-years { }
        .dropdown-menu .datepicker-years table { width: 100%; }
    .dropdown-menu .year { text-align: center; text-shadow: 0 -1px 0 rgba(0,0,0,0.25); width: 25%; min-height: 50px; display: inline-block; line-height: 50px; }
    .dropdown-menu .datepicker-decades { }
        .dropdown-menu .datepicker-decades table { width: 100%; }
    .dropdown-menu .decade { text-align: center; text-shadow: 0 -1px 0 rgba(0,0,0,0.25); width: 33.333%; height: 50px; display: inline-block; line-height: 50px; }
    .dropdown-menu .timepicker { }
    .dropdown-menu .table-condensed th { padding: 5px; }
    .dropdown-menu .datepicker-days > .table-condensed td, .dropdown-menu .table-condensed td > span { border-radius: 2px; cursor: pointer; }
    .dropdown-menu .active { background-color: var(--secondary-color); color: #fff; text-shadow: 0 -1px 0 rgba(0,0,0,0.25); }
    .dropdown-menu .datepicker-days > .table-condensed td:hover, .dropdown-menu .table-condensed td > span:hover { box-shadow: 0 0px 0 1px rgba(0, 0, 0, 0.1); }

    .dropdown-menu table td.today:before { content: ''; display: inline-block; border: solid transparent; border-width: 0 0 7px 7px; border-bottom-color: #000000; border-top-color: rgba(0, 0, 0, 0.2); position: absolute; bottom: 4px; right: 4px; }
    .dropdown-menu table td.today { position: relative; }
/*============END DATE/TIME PICKER==================*/



/*==========START windows===========*/
.ovrl_wnd_cont { }
    .ovrl_wnd_cont > div { height: 100%; width: 100%; position: fixed; z-index: 99999; padding: 20px; opacity: 0; -ms-flex-direction: row; visibility: hidden; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; -ms-flex-direction: column; -ms-flex-align: center; -ms-flex-pack: center; -ms-flex-negative: 1; align-items: center; justify-content: center; overflow: auto; background-color: rgba(15,20,25,.55); top: 0; left: 0; }

/*.ovrl_wnd_cont > div { width: calc(100% - 70px);left: calc(0% - -70px);}
@media screen and (max-width: 500px) {
    .ovrl_wnd_cont > div { width: 100%; left: 0;}
}

body.fit .ovrl_wnd_cont > div {width: 100%; left: 0;}*/

.main_fit .ovrl_wnd_cont > div.open { width: 100%; }

.ovrl_wnd_cont > div.no_overlay { background: none; width: 100%; }

.ovrl_wnd_cont > div { width: calc(100% - 70px); right: 0; left: auto; }
    .ovrl_wnd_cont > div.open { opacity: 1; visibility: visible; }

@media screen and (max-width:500px) {
    .ovrl_wnd_cont > div.open { width: 100%; }
}

.ovrl_wnd_cont > div.open { }

.ovrl_wnd_cont > div > div { box-sizing: border-box; position: relative; -ms-flex-pack: center; overflow: hidden; justify-content: center; display: -ms-flexbox; -ms-flex-direction: column; display: flex; flex-direction: column; max-height: calc(100vh - 120px); -ms-flex-negative: 1; max-width: 100%; box-shadow: 0px 8px 0 -4px rgba(0,0,0,.05), 0 0 0 1px rgba(0,0,0,.05), 0 15px 20px -10px rgba(0,0,0,.3); /*border-radius:6px;*/ }

@media screen\0 {
    .ovrl_wnd_cont > div > div { max-height: none; }
}
/* target IE 10*/
.ovrl_wnd_cont > div > div > header { width: 100%; height: 50px; min-height: 50px; cursor: default; position: relative; z-index: 1 }
    .ovrl_wnd_cont > div > div > header > p { background: #fff; height: 50px; text-align: left; box-sizing: border-box; margin: 0; padding: 0 60px 0 20px; line-height: 50px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 16px; /*color:#2d3e4d;*/ font-weight: 600; }
    .ovrl_wnd_cont > div > div > header > span { height: 30px; width: 30px; position: absolute; right: 10px; top: 10px; cursor: pointer; background-image: url(../images/sprite.svg); background-repeat: no-repeat; background-position: -300px -90px; }
        .ovrl_wnd_cont > div > div > header > span:active { transform: translateY(1px); -webkit-transform: translateY(1px) }
.ovrl_wnd_cont > div > div > div { display: -ms-flexbox; -ms-flex-direction: column; display: flex; flex-direction: column; max-height: 100%; overflow: hidden; -ms-flex-negative: 1; }
.window_cont { position: relative; display: -ms-flexbox; -ms-flex-direction: column; display: flex; flex-direction: column; max-height: 100%; width: 100%; overflow: hidden; background: #fff; -ms-flex-negative: 1; -ms-flex: 1 0 auto; }
    .window_cont .form_container { padding: 15px; white-space: normal; background: #ffffff; /* background-image: -webkit-linear-gradient(top, #fff 0%, #f3f3f3  120px); */ /* background-image: linear-gradient(to bottom, #fff 0%, #f3f3f3  120px); */ position: relative; -ms-flex: 1 1 auto; max-height: 100%; overflow-x: hidden; /*max-width: 420px;width: 420px;*/ min-width: 320px; float: left; }
    .window_cont .commandPanel { display: flex; display: -ms-flexbox; justify-content: flex-end; -ms-flex-pack: end; flex-wrap: wrap; -ms-flex-wrap: wrap; min-height: 50px; box-sizing: border-box; width: 100%; padding: 0 10px; align-items: center; -ms-flex-align: center; }
    .window_cont form { display: -ms-flexbox; -ms-flex-direction: column; display: flex; flex-direction: column; max-height: 100%; max-width: 900px; overflow: hidden; -ms-flex-negative: 1; }

    .window_cont .user_content { font-weight: 400; line-height: 20px; }


.commandPanel .button { margin: 0 10px 0 0; background-color: transparent; }
    .commandPanel .button:last-child { margin-right: 0; }
    .commandPanel .button.right { margin: 0 0 0 10px }
.commandPanel .white { }
.commandPanel .primary { background-color: #fdd65d; min-width: 110px; }
    .commandPanel .primary:hover { }

.form_container .commandPanel { min-height: 30px; padding: 10px 0px 0 0; }
.form_container .section_group { width: 100%; padding: 0 0px 20px 0; box-sizing: border-box; position: relative; /*float: left;clear: both;*/ display: flex; flex-wrap: wrap; }
.form_container .section { float: left; position: relative; padding: 0; width: 100%; }
.form_container .section_group .section.middle { min-width: 350px; }

@media screen and (max-width:600px) {
    .form_container .section_group .section { width: 100%; }
        .form_container .section_group .section.middle { min-width: 0px; }
}

.form_container .section_group div.section:only-child { width: 100%; }


.form_container fieldset { border: none; border-top: 1px rgba(0,0,0,.1) solid; box-sizing: border-box; position: relative; margin: 5px 0px 25px 0px; }









.form_container .section .form_fields { max-width: 100%; }
.form_container .form_fields .input_label { font-size: 13px; min-width: 110px; text-align: right; }

.form_container .section .form_fields.status { padding-top: 15px; }
/*----*/

.message_box { padding: 0 20px; min-width: 280px; box-sizing: border-box; background: #fff; }
    .message_box .message_container { max-width: 350px; white-space: normal; word-wrap: break-word; padding: 10px 0; font-size: 13px; /*font-weight: 600;*/ /*color: #5a5a5a;*/ }
        .message_box .message_container h2 { font-size: 18px; font-weight: 400; margin-bottom: 10px; }
.message_text a.link { color: #3169de; font-weight: 600; }
    .message_text a.link:hover { text-decoration: underline; }


.message_box footer { display: block; height: 80px; padding: 20px 0; }

    .message_box footer .button { background-color: transparent; color: #000; box-shadow: none; padding-left: 0; float: right; height: 40px; line-height: 40px; margin-left: 10px; padding: 0 10px; }
        .message_box footer .button:hover { box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.09); }


.message_box.action_confirm { display: flex; display: -ms-flexbox; flex-direction: column; -ms-flex-direction: column; height: 100%; }
    .message_box.action_confirm > div { overflow-x: hidden; overflow-y: auto; }



.footer_bar { float: left; width: 100%; padding: 20px 10px 10px 10px; }
    .footer_bar .link, .user_content a { font-weight: 600; text-decoration: underline; }
    .footer_bar p { margin: 5px 0; }
        .footer_bar p .link { }





.action_confirm.message_box .message_container { max-width: 900px; }
.action_confirm .message_text p { font-weight: 400; margin: 10px 0 }
    .action_confirm .message_text p.bold { font-weight: 600; }
.additional_information { padding: 10px; display: flex; display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap; font-weight: 400; }
.addition_item { flex: 1; -ms-flex: 1; /* min-width: 160px; */ /* max-width: 160px; */ margin: 10px; }
.addition_title { font-weight: 600; margin: 5px 0; display: block; text-transform: uppercase; }
.addition_item ul li { margin: 2px 0; }
.message_box.action_confirm footer { height: 80px; min-height: 80px; display: flex; display: -ms-flexbox; justify-content: flex-end; -ms-flex-pack: end; flex-wrap: wrap; -ms-flex-wrap: wrap; }
    .message_box.action_confirm footer .button.gray.no { order: 2; -ms-order: 2; }

.message_text ul { margin-left: 15px; }
.message_text li { list-style-type: disc; }
.message_text ul ul li { list-style-type: circle; }

.public_information { background: #689F38; border-radius: 30px; height: 20px; min-width: 20px; width: 20px; font-size: 0; position: relative; }
    .public_information:after { content: ""; background-image: url(/Content/icon/earth.svg); height: 14px; min-width: 14px; display: block; position: absolute; top: 3px; left: 3px; background-size: contain; background-repeat: no-repeat; }
.private_info { padding: 15px 20px; margin: 10px 0; font-style: italic; }
.url { display: block; width: 100%; white-space: normal; background: #ffffff; margin: 5px 0; padding: 10px; word-break: break-word; word-break: break-all; word-wrap: break-word; }
    .url a { color: #3169de; text-decoration: underline; }


.form_container .description { margin: 0 0 15px 0; padding: 0 5px; font-weight: 400; font-style: normal; /*color: #000000;*/ }
.message_text a { color: inherit; }
.window_cont .toggle.check_cont .ch_cont label { color: #5a5a5a; }



/*.success.message_box.action_confirm .message_text{color:#1c8e27}
.error.message_box.action_confirm .message_text{color:#ce0000;}*/


.success header { color: #1c8e27 }
.error header { color: #ce0000; }
.message > div > header p text { display: flex; align-items: center; }
    .message > div > header p text icon { margin-left: 5px; font-size: 20px; }
/*==========END windows===========*/


/*Tatul*/



/*view*/

view { display: flex; height: 100%; width: 100%; position: relative; overflow: hidden; box-shadow: 0 0 0 1px #e4e4e4; box-shadow: 0 0 0 1px var(--border-color); flex-direction: column; z-index: 999; background: transparent }





/**/

group { display: flex; flex-wrap: wrap; }
logo { display: flex; }


separator { box-shadow: inset 0 0 0 1px; flex-shrink: 0; opacity: 0.1; }


    separator[horizontal] { min-height: 1px; height: 1px; position: relative; margin: var(--gap) 0; z-index: 2; display: flex; flex: 1 1 100%; max-height: 1px; width: 100%; }
        separator[horizontal][data-margin="40"] { --gap: 40px }


[data-wrap="preline"] { white-space: pre-line; }
[data-wrap="nowrap"] { flex-wrap: nowrap; }


[data-height="small"] { height: 10px; }
[data-height="20"] { height: 20px; }
[data-height="50"] { height: 50px; }
[data-height="70"] { height: 70px; }
[data-height="adaptive"] { height: 80px; }

[data-font="popins"] { font-family: var(--popins); }

[data-index="9"] { z-index: 9; }

[data-text-color="white"] { color: var(--text-white); }

[data-background="primary"] { background: var(--main-background); }
[data-background="midgrey"] { background: var(--midgrey); }
[data-background="higlight"] { background-color: var(--highlight); }

[data-direction="column"] { flex-direction: column; }
[data-justify="between"] { justify-content: space-between; }
[data-justify="center"] { justify-content: center; }
[data-justify="start"] { justify-content: start; }
[data-justify="end"] { justify-content: end; }
[data-align="adaptive"] { align-items: center; }
[data-align="center"] { align-items: center; }
[data-align="start"] { align-items: start; }
[data-align="end"] { align-items: end; }

[data-radius="10"] { border-radius: var(--radius); }
[data-radius="adaptive"] { border-radius: var(--radius-adaptive); }


[data-gap="10"] { gap: 10px }
[data-gap="15"] { gap: 15px }
[data-gap="30"] { gap: 30px }
[data-space="50"] { padding: 50px; }
[data-space="30"] { padding: 30px; }
[data-space="20"] { padding: 20px; }
[data-space="5"] { padding: 5px; }
[data-space-horizontal="20"] { padding: 0 20px; }
[data-space-horizontal="30"] { padding: 0 30px; }
[data-space-right="20"] { padding-right: 20px }

[data-grow="1"] { flex-grow: 1; }

[data-space-top="30"] { padding-top: 30px; }

[data-text-size="18"] { font-size: 18px; }
[data-text-size="24"] { font-size: 24px; }

[data-text-size="28"] { font-size: 28px; }
[data-text-size="32"] { font-size: 32px; }
[data-text-size="36"] { font-size: 36px; }
[data-text-size="48"] { font-size: 36px; }


[data-text-size="large"] { font-size: 32px; }
[data-text-size="medium"] { font-size: 24px; }
[data-text-size="small"] { font-size: 18px; }

[data-text-transform="uppercase"] { text-transform: uppercase; }

[data-height="fit"] { height: 100%; }

[data-width="fit"] { width: 100%; }
[data-width="70"] { width: 70px; }
[data-width="150"] { width: 150px; }
[data-width="350"] { max-width: 350px; }
[data-width="430"] { max-width: 430px; }
[data-width="600"] { max-width: 600px; }
[data-width="720"] { max-width: 720px; }
[data-min-width="380"] { min-width: 380px; }
[data-min-width="320"] { min-width: 320px; }

[data-light] { opacity: 0.5; }
[data-light="medium"] { opacity: 0.7; } 

[data-length="fit"] { width: 100%; }


[data-length="200"] { width: 200px; }
[data-weight="600"] { font-weight: 600; }
[data-weight="500"] { font-weight: 500; }


[data-length] { flex-shrink: 0; max-width: 100%; }

[data-fit] { flex-basis: 0%; }
[data-fit='1'] { flex-grow: 1; }
[data-fit='1.5'] { flex-grow: 1.5; }

[data-cursor="pointer"] { cursor: pointer; }
[data-type="link"] { cursor: pointer; }
    [data-type="link"]:hover { text-decoration: underline; opacity: 0.5; }
    [data-type="link"]:active { transform: translateY(1px); }

[data-position="realtive"] { position: relative; }
[data-overflow="hidden"] { overflow: hidden; }


[data-position="right"] { margin-left: auto; }

[data-type="accordion"] group[data-type="panel"]::after { content: ""; position: absolute; left: 0; width: 80px; background: transparent; height: 100%; transition: .5s ease-in-out; }
[data-type="accordion"].active > group[data-type="panel"],
[data-type="accordion"].done > group[data-type="panel"] { cursor: pointer; pointer-events: all; }
[data-type="accordion"] group[data-type="panel"] { pointer-events: none; }

[data-type="accordion"].active > group[data-type="panel"] group .button.mini icon { transform: rotate(90deg); transition: .25s; }


[data-type="accordion"].active group[data-type="panel"] { color: var(--text-white); cursor: pointer; }
[data-type="accordion"] group[data-type="panel"]:active { transform: translateY(1px); }
[data-type="accordion"].active group[data-type="panel"]::after { width: 100%; background-color: var(--secondary-color); }

/*[data-type="accordion"].active group[data-type="panel"] group[data-space-horizontal="20"] { padding: 0; }*/


[data-type="accordion"].active group[data-type="panel"] ~ group[data-type="controller"] { height: auto; opacity: 1; pointer-events: inherit; padding: 20px 20px 0; }


[data-underline="underline"] { text-decoration: underline; }

[data-display="list_item"] text { display: list-item; line-height: 30px; }
group[data-display="list_item"] group[data-display="list_item"] text { list-style: circle; }

group[data-type="panel"] ~ group[data-type="controller"],
group[data-type="panel"].hide ~ group[data-type="controller"] { height: 0; opacity: 0; transition: .25s; padding: 0; pointer-events: none; }
[data-type="accordion"].done group[data-type="panel"] group[data-background="midgrey"] { --midgrey: #1C8E27; background-color: var(--midgrey); }

[data-type="accordion"].open group[data-type="panel"] ~ group[data-type="controller"] { height: auto; opacity: 1; pointer-events: inherit; padding: 20px 20px 0; }

group[data-type="panel"] { min-width: 100%; flex-wrap: nowrap; }
    group[data-type="panel"] > group { text-overflow: ellipsis; max-width: 100%; overflow: hidden; flex-wrap: nowrap; }
    group[data-type="panel"] text { text-overflow: ellipsis; max-width: 100%; overflow: hidden; white-space: nowrap; }

form { display: flex; flex-direction: column; }
field { display: flex; justify-content: flex-start; --gap: 0px; width: 100%; position: relative; flex-direction: column; }


    field message { position: relative; margin: 5px; overflow: hidden; width: 100%; }




input[disabled] ~ box,
input[disabled] ~ text { opacity: 0.5; cursor: default; }


/* [checkbox] */

[checkbox],
[radio],
[classic] { display: flex; align-items: center; min-height: 30px; white-space: nowrap; position: relative; /*overflow: hidden;*/ cursor: pointer; max-width: 100%; }

    [checkbox]:active,
    [radio]:active,
    [classic]:active { transform: translateY(1px); }

    [checkbox] input,
    [radio] input,
    [classic] input { display: none; }

    [checkbox] box { height: 20px; width: 36px; display: flex; position: relative; border-radius: 10px; flex-shrink: 0; cursor: pointer; box-shadow: inset 0 0 0 2px; }

    [checkbox] text,
    [radio] text,
    [classic] text { padding: 0 10px; white-space: nowrap; font-size: (var(--main-text)); width: 100%; overflow: hidden; position: relative; text-overflow: ellipsis; }

box ink { width: 50px; height: 50px; position: absolute; top: -16px; left: -16px; border-radius: 25px; overflow: hidden; z-index: 1; }
    box ink:hover { background-color: var(--hover); }

[checkbox] name,
[radio] name { padding: 0 10px 0 0; }

[checkbox] check { height: 10px; width: 10px; box-shadow: inset 0 0 0 7px; top: 5px; left: 5px; transition: 0.25s; background: white; border-radius: 20px; position: absolute; }



[checkbox] input:checked ~ box { box-shadow: inset 0 0 0 20px; color: var(--main-color); }
    [checkbox] input:checked ~ box check { transform: translateX(16px); box-shadow: inset 0 0 0 0px; }


/* ----- */


/* ----- */

[classic] box { display: flex; position: relative; flex-shrink: 0; box-shadow: inset 0 0 0 2px; transition: 0.125s; border-radius: 3px; }
[classic] box { height: 24px; width: 24px; /*border-radius: 3px;*/ }
[classic] check { transform: scale(0); margin: auto; top: 0; left: 0; height: 20px; width: 20px; transition: 0.125s; filter: brightness(0) invert(1); background: url('data:image/svg+xml;base64, PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJmZWF0aGVyIGZlYXRoZXItY2hlY2siPjxwb2x5bGluZSBwb2ludHM9IjIwIDYgOSAxNyA0IDEyIj48L3BvbHlsaW5lPjwvc3ZnPg== '); }

[classic] input:checked ~ box { color: var(--secondary-color); box-shadow: inset 0 0 0 15px; }

    [classic] input:checked ~ box check { transform: none; }

[classic] separator + box { margin-left: 10px; }
[classic] box + separator { margin-left: 20px; }

/**/


/* radio */

[radio] box { display: flex; position: relative; border-radius: 10px; flex-shrink: 0; box-shadow: inset 0 0 0 2px; }
[radio] box { height: 18px; width: 18px; }
[radio] check { height: 8px; width: 8px; transition: 0.25s; background: white; border-radius: 20px; position: absolute; top: 5px; left: 5px; transform: scale(0); background: var(--secondary-color); }
[radio] input:checked ~ box { color: var(--secondary-color); }
    [radio] input:checked ~ box check { transform: scale(1); }
/* ----- */


/* button */


:root { --button-radius: 10px; --input-padding: 15px; --outline: rgba(0,0,0,.1); --input-height: 50px; --button-text-size: 20px; --button-extra-height: 60px; }

.button[data-hover="none"], [data-hover="none"] { background-image: none; }
    .button[data-hover="none"]:active, [data-hover="none"]:active { background-image: none; }

.button { height: 40px; text-align: center; border-radius: var(--button-radius); text-transform: uppercase; display: flex; align-items: center; justify-content: center; cursor: pointer; padding: 0 15px; user-select: none; font-weight: 700; font-size: var(--text); white-space: nowrap; position: relative; background: transparent; /*flex-shrink: 0;*/ overflow: hidden; line-height: 30px; text-decoration: none; color: inherit; }
    .button:hover { background-image: var(--over-color); }
    .button:not([effect="material"]):active { background-image: var(--press-color); }
    .button.outline { background-color: var(--context); box-shadow: inset 0 0 0 1px var(--outline) }

    .button * { pointer-events: none; }

    .button.extra { height: var( --button-extra-height); font-size: var(--button-text-size); }


    .button text,
    .button icon { z-index: 1; }

    .button:active text,
    .button:active icon,
    .button:active badge,
    .button:active tip,
    .button:active dot { transform: translateY(1px); }

    .button text { width: 100%; overflow: hidden; text-overflow: ellipsis; }

a.button:not([data-outline="none"]) text { text-decoration: underline; }

.button icon { margin: 0 0 0 -10px; }
.button text ~ icon { margin: 0 -10px 0 0; }



.button.mini icon,
.button.extra icon,
.button.micro icon { margin: auto; }

.button.mini { width: 40px; height: 40px; padding-left: 0; padding-right: 0; flex-shrink: 0; }
    .button.mini.rounded { height: 40px; }

.button.micro { width: 30px; height: 30px; padding-left: 0; padding-right: 0; flex-shrink: 0; }

.button.accent { box-shadow: inset 0 0 0 1.52px; /*margin: 0 5px;*/ }



.primary { background-color: var(--main-color); color: #fff; fill: #fff }
.green { background-color: var(--green); color: #fff; fill: #fff }
.secondary { background-color: var(--secondary-color); color: #fff; fill: #fff }


.button.fit { flex: 1; max-width: 100%; }
.button.wide { width: 100%; }


.button.special { background-color: var(--special-color); color: #fff; }
.button.highlight { background-color: var(--hover); }


.button.accent:hover { box-shadow: none; background-color: var(--secondary-color); color: #fff; }
.button.accent:active { }


.button.large { min-height: 50px; height: 50px; min-width: 200px; font-size: var(--button-text-size); }

.button[disabled] { opacity: 0.5; cursor: default; pointer-events: none; }

button::-moz-focus-inner { border: none; }

.button.adaptive icon { display: none; margin: auto; }

@media (max-width: 900px) {

    :root { --button-extra-height: 50px; --button-text-size: 18px; }

    .button.large { min-width: 150px; width: 100%; }
}


space { display: flex; width: 100%; flex-shrink: 0; }



/* cont */


cont { display: flex; height: var(--input-height); align-items: center; max-width: 100%; position: relative; text-transform: uppercase; padding-right: 10px; }

    cont input[type="text"],
    cont input[type="password"] { display: flex; align-items: center; height: var(--input-height); padding: 0 var(--input-padding); -webkit-transition: none; width: 100%; white-space: nowrap; text-overflow: ellipsis; color: inherit; position: relative; overflow: hidden; background-color: transparent; border-radius: var(--button-radius); z-index: 2; }


    cont input::placeholder { opacity: 0; transform: translateY(50%); transition: .125s; }
    cont input:focus::placeholder { opacity: .5; transform: none }


    cont input:-webkit-autofill ~ decor label text wrap { transform: translateY(-50%); }
    cont input:-webkit-autofill ~ decor label text .line { transform: scaleX(0); }

    cont decor label { transition: 300ms ease all; }

        cont decor label text wrap { transform: translateY(-50%); transition: transform .225s, max-width .225s; display: flex; height: 100%; align-items: center; width: 100%; overflow: hidden; }
        cont decor label text .line { position: absolute; width: 100%; transform: scaleX(0); transition: transform .125s; transform-origin: right }

    cont[disabled="disabled"] decor label text { display: none; }
    cont[disabled="disabled"][value="none"] decor label text { display: flex; }
        cont[disabled="disabled"][value="none"] decor label text wrap { display: none; }


    cont decor { position: absolute; width: 100%; height: 100%; pointer-events: none; }
        cont decor label { display: flex; width: 100%; position: relative; height: 100%; padding: 0 10px; }
            cont decor label text { align-items: center; display: flex; max-width: 100%; position: relative; }
                cont decor label text span { padding: 0 5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--text); }
            cont decor label .line { height: 100%; flex: 1; box-shadow: inset 0 1.52px 0 0; }
        cont decor border { position: absolute; width: 100%; height: 100%; box-shadow: inset 0 0 0 1.52px; border-radius: var(--button-radius); pointer-events: none; clip-path: polygon(0% 0%, 0% 100%, 10px 100%, 10px 0, calc(100% - 10px) 0, calc(100% - 10px) 50%, 10px 50%, 10px 100%, 100% 100%, 100% 0%); content: ""; top: 0; left: 0; }

        cont decor label .line,
        cont decor border { opacity: .20 }

    cont:hover decor label .line,
    cont:hover decor border { opacity: .85 }

    cont input[readonly] { user-select: none; pointer-events: none; }
        cont input[readonly] ~ decor { opacity: 0.7; pointer-events: none; }

    cont input:placeholder-shown ~ decor label text wrap { transform: none }
    cont input:focus ~ decor label { font-size: 14px; }

    cont input:placeholder-shown ~ text { opacity: 0; }

    cont input:focus ~ text { opacity: 1; }

    cont input:placeholder-shown ~ decor label text .line { transform: none }
    cont input:focus ~ decor { color: var(--secondary-color) }
        cont input:focus ~ decor label .line,
        cont input:focus ~ decor border { opacity: 1 }
        cont input:focus ~ decor label text wrap { transform: translateY(-50%); }

        cont input:focus ~ decor label text .line { transform: scaleX(0) }

    cont input.input-validation-error ~ decor { color: var(--error-color) }

    cont input:-webkit-autofill { transition: background-color 5000s ease-in-out 5000s; }
    cont[disabled]:hover decor label .line,
    cont[disabled]:hover decor border,
    cont:hover input:disabled ~ decor label .line,
    cont:hover input:disabled ~ decor border { opacity: .20; }

    cont[disabled] { opacity: 0.5; background: var(--input-color); pointer-events: none; }
    cont input:disabled ~ decor label text { opacity: 0.7; }

    cont input[disabled], textarea:disabled { background: var(--input-color); pointer-events: none; opacity: 0.5; }

    cont[data-type="textarea"] { height: auto; min-height: 40px; }
    cont[decor="hide"] decor { display: none; }
    cont[data-type="alternative"] { padding-right: 0; }
    cont[data-type="alternative"] .button { border-radius: 0 10px 10px 0; max-width: 100px; min-width: 100px; }




/*validationError*/
.validationError decor, .validationError + message, .validationError ~ message, .validationMessage decor, .validationMessage + message, .validationMessage ~ message { color: var(--error-color) !important; }

icon { font-family: "Material Symbols Rounded"; font-weight: normal; font-style: normal; font-size: 24px; line-height: 1; letter-spacing: normal; text-transform: none; display: flex; align-items: center; justify-content: center; white-space: nowrap; word-wrap: normal; direction: ltr; font-feature-settings: "liga"; -webkit-font-smoothing: antialiased; height: 30px; width: 30px; flex-shrink: 0; overflow: hidden; font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24; }

@keyframes loader {
    from { transform: translateX(-100%) }
    50% { transform: translateX(100%) }
    to { transform: translateX(-100%) }
}

.preloader { height: 100%; width: 100%; z-index: 99999; position: absolute; top: 0; left: 0; display: flex; align-items: center; justify-content: center; }
    .preloader > div { height: 40px; width: 40px; top: 0; left: 0; right: 0; bottom: 0; position: absolute; margin: auto; transform: scale(1); }
        .preloader > div svg { animation: rotate 2s linear infinite; width: 30px; height: 30px; }
    .preloader[data-svg="small"] > div svg { height: 25px; width: 25px; }

    .preloader > div svg circle { stroke-dasharray: 60; stroke-dashoffset: 0; stroke: #000; stroke-linecap: round; animation: dash 1.6s ease-in-out infinite; }


@keyframes dash {
    0% { stroke-dasharray: 1,150; stroke-dashoffset: 0; }
    50% { stroke-dasharray: 90,150; stroke-dashoffset: -35; }
    100% { stroke-dasharray: 90,150; stroke-dashoffset: -124; }
}

@keyframes rotate {
    100% { transform: rotate(360deg); }
}



group .hide, .hide { display: none; }


/* media */

@media (max-width: 900px) {
    :root { --radius-adaptive: 0; }

    app { padding: 0; }

    cont, cont[data-length="200"] { width: 100%; }

    view { box-shadow: none; }

    group[data-type="panel"] { max-width: 325px; }
        group[data-type="panel"][data-space-right="20"] { padding-right: 10px; }

    cont[data-type="alternative"] .button { font-size: 16px; }

    [data-align="adaptive"] { align-items: start; }

    [data-fit] { flex-basis: auto; }

    [data-space="50"] { padding: 10px; }

    [data-adaptive="center"] { align-items: center; justify-content: center; }
    [data-justify="between"] { justify-content: center; }

    [data-height="adaptive"] { height: 70px; }
    [data-height="50"] { height: 25px; }
    [data-height="70"] { height: 60px; }
    [data-min-width="400"] { min-width: 150px; width: 250px; }
    [data-min-width="320"] { max-width: 250px; min-width: 250px; }

    [data-width="70"] { width: 60px; }

    [data-text-size="small"] { font-size: 16px; }
    [data-text-size="medium"] { font-size: 20px; }
    [data-text-size="24"] { font-size: 16px; }
    [data-text-size="28"] { font-size: 24px; }
    [data-text-size="36"] { font-size: 32px; }
    [data-text-size="48"] { font-size: 36px; }

    [data-type="accordion"].active group[data-type="panel"] ~ group[data-type="controller"] { padding: 10px 10px 0; }
    [data-wrap="nowrap"] { flex-wrap: wrap; }
}