html {
    padding: 0;
    margin: 0;
    font-family: 'Open Sans', sans-serif;
}

body {
    padding: 0;
    margin: 0;
    background: rgb(245, 245, 245);
}

h1 {
    margin-top: 0;
    font-weight: bold;
}

h2 {
    margin-top: 0;
    font-weight: bold;
}

h3 {
    margin-top: 0;
    font-weight: bold;
}

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

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
 
}

span.balance { white-space: nowrap; }

.balance-overzero {
    background: var(--color-success);
    color: #fff;
    font-size: 12px;
    padding: 0px 8px;
    border-radius: 8px;
    margin-left: 8px;
    background: var(--color-success);
    box-shadow: 0 0 0 5px var(--color-success-background);
}
.balance-subzero {  


    background: var(--color-red);     color: #fff;
    font-size: 12px;
    padding: 0px 8px;
    border-radius: 8px;
    margin-left: 8px;
    background: var(--color-error);
    box-shadow: 0 0 0 5px var(--color-error-background);



}

.filters-block { margin-bottom: calc(var(--grid-gap)*2) }

.operation-amount {

    white-space: nowrap;

    color: #666;

}

.operation-amount.operation-plus { color: var(--color-success); }
.operation-amount.operation-minus { color: var(--color-error); }

.pages { margin-top: calc(var(--grid-gap)) }

.billing-operations .head .cell {

    text-transform: uppercase;
    font-size: 12px;
    font-weight: 600;
    color: #666;
    background: #fafafa;
     padding: calc(var(--grid-gap)) !important;

}

.billing-operations .head .cell:first-child { border-radius: 0 0 8px 8px }

.billing-operations .operation .cell {
        font-size: 14px;
            padding: calc(var(--grid-gap)) !important;
    border-bottom: 1px solid #eee;
}

.billing-operations .row:last-child .cell { padding-bottom: calc(var(--grid-gap)) !important;  }

.billing-operations .row:hover .cell { background: #fafafa }
.billing-operations .row.openlink:hover .cell { cursor: pointer; }

.ui-sortable { cursor: move }
   .ui-autocomplete {    
      max-height: 300px;
      overflow-y: auto;
      /* prevent horizontal scrollbar */
      overflow-x: hidden;
      z-index: 12312312312312 !important;
   }
 
.ui-menu-item-wrapper {
    padding: 8px !important;
    font-size: 14px;
}

.ui-menu-item-wrapper span {
    display: block;
    color: #999;
    font-size: 12px;
}

.ui-state-active { background: #eee !important; border: none !important; color: #000 !important; margin: 0 !important}
 .grey { color: #999 }
 .grey2 { color: rgba(10, 37, 64, 0.7); }
 

.copy { cursor: pointer }
.resend-block { color: var(--color-text-3); }


/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

.icon-tippy {
    color: #fff;
    background: #ccc;
    border-radius: 50%;
    display: inline-block;
    width: 14px;
    height: 14px;
    text-align: center;
    font-size: 12px;
    font-weight: bold;
    cursor: pointer;

}

.event-form .counter {
    float: right;
    font-size: 14px;
    text-transform: lowercase;
    color: #ccc;
}

.width50proc { width: 50%; }

.icon-tippy::before {
    content: '?'
}
.smallFancy { width: auto; max-width: 400px; min-width: 400px;  }

.mediumFancy { width: auto; max-width: 700px; min-width: 700px; }

.bigFancy { width: 100%; }

.fancybox__content h1 {  }

.fancybox__content h1 span.user-role-name { font-weight: normal; }

.fancybox__content h1 span.user_id {     font-weight: normal;
    /* float: right; */
    font-size: 14px;
    font-size: 12px;
    /* background: rgb(250 219 71 / 30%); */
    padding: 4px 8px;
    border-radius: 4px;
    color: #666;}


.ui-error { font-size: 14px; color: var(--color-error);  display: none; box-sizing: border-box; padding: calc(var(--grid-gap)/2) 0  }

.display { display: block; }

.input-group {

    position: relative;
    width: 100%;
    max-width: 400px;
    font-size: 14px;
}

.input-group .input, .input-group  .select, .input-group .textarea {

    width: 100%;
    max-width: 400px;
    padding: calc(var(--grid-gap));
    box-sizing: border-box;
    outline: none;
    border: 1px solid #ccc;
    border-radius: calc(var(--grid-gap));
    z-index: 50;
    background: #fff;

}

.input-group  .select option {
 padding: calc(var(--grid-gap));
}

.input-group .placeholder {

    position: absolute;
    top: calc(var(--grid-gap));
    left: calc(var(--grid-gap)/2);
    font-size: 14px;
    padding: 0 calc(var(--grid-gap)/2);
    color: #666;
    transition: 0.3s;
    pointer-events: none;

}

.input-group button, .input-group a.button { width:100% }

.input-group .clear-input {

    position: absolute;
    top: calc(var(--grid-gap));
    right: calc(var(--grid-gap)/2);
    font-size: 14px;
    padding: 0 calc(var(--grid-gap)/2);
    color: #666;
    transition: 0.3s;
    z-index: 100;
    opacity: 0;
    cursor: pointer;
}

.input-group .show-password-input {

    position: absolute;
    top: calc(var(--grid-gap));
    right: calc(var(--grid-gap)/2);
    font-size: 14px;
    padding: 0 calc(var(--grid-gap)/2);
    color: #666;
    transition: 0.3s;
    z-index: 100;
    opacity: 0;
    cursor: pointer;
}


 

.input-group .input:not(:placeholder-shown) + .placeholder, .input-group .input:focus + .placeholder, .input-group .textarea:not(:placeholder-shown) + .placeholder, .input-group .textarea:focus + .placeholder  {
    top: calc(var(--grid-gap)/-2);
    color: #333;
    background: #fff;
    font-size: 11px;

}

.input-group .input:not(:placeholder-shown) ~ span.clear-input, .input-group .input:focus ~ span.clear-input {
    opacity: 1;
}
.input-group .input:not(:placeholder-shown) ~ span.show-password-input, .input-group .input:focus ~ span.show-password-input {
    opacity: 1;
}

.input-group label.checkbox {
   
  display: grid;
  grid-template-columns: calc(var(--grid-gap)/1) auto;
  gap: calc(var(--grid-gap)/2);
}


 

 
 

.input-group label.checkbox input[type="checkbox"] {
  /* Add if not using autoprefixer */
  -webkit-appearance: none;
  /* Remove most all native input styles */
  appearance: none;
  /* For iOS < 15 */
  background-color: #eee;
  /* Not removed via appearance */
  margin: 0;
  margin-top: 4px;
  font: inherit;
  width: 14px;
  height: 14px;
  border: 2px solid #eee;
  border-radius: 2px;
  transform: translateY(-0.075em);

  display: grid;
  place-content: center;
}

.input-group label.checkbox input[type="checkbox"]::before {
  content: "";
  width: 8px;
  height:  8px;
  clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
  transform: scale(0);
  transform-origin: bottom left;
  transition: 120ms transform ease-in-out;
  color: red;
  background: #fff;
  /* Windows High Contrast Mode */
 
}
.input-group label.checkbox input[type="checkbox"]:checked {
     background:  var(--color-background-button);
     border-color: var(--color-background-button);
}
.input-group label.checkbox input[type="checkbox"]:checked::before {
  transform: scale(1);

}

.input-group label.checkbox input[type="checkbox"]:focus {
 
}

.input-group label.checkbox input[type="checkbox"]:disabled {
  
  color: var(--color-text-3);
  cursor: not-allowed;
}

.input-group label.radio {
   
  display: grid;
  grid-template-columns: calc(var(--grid-gap)/1) auto;
  gap: calc(var(--grid-gap)/2);
  padding: calc(var(--grid-gap)/2) 0;
}


.input-group label.radio input[type="radio"] {
  /* Add if not using autoprefixer */
  -webkit-appearance: none;
  /* Remove most all native input styles */
  appearance: none;
  /* For iOS < 15 */
  background-color: #eee;
  /* Not removed via appearance */
  margin: 0;
  margin-top: 4px;
  font: inherit;
  width: 14px;
  height: 14px;
  border: 2px solid #eee;
  border-radius: 100%;
  transform: translateY(-0.075em);

  display: grid;
  place-content: center;
}

.input-group label.radio input[type="radio"]::before {
  content: "";
  width: 8px;
  height:  8px;
  clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
  transform: scale(0);
  transform-origin: bottom left;
  transition: 120ms transform ease-in-out;
  color: red;
  background: #fff;
  /* Windows High Contrast Mode */
 
}
.input-group label.radio input[type="radio"]:checked {
     background:  var(--color-background-button);
     border-color: var(--color-background-button);
}
.input-group label.radio input[type="radio"]:checked::before {
  transform: scale(1);

}

.input-group label.radio input[type="radio"]:focus {
 
}

.input-group label.radio input[type="radio"]:disabled {
  
  color: var(--color-text-3);
  cursor: not-allowed;
}


.no-display { 
    display: none !important 
}
 
.app-loader__hide {
    opacity: 0;
}
.app-loader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 10000;
    background-color: rgb(255 255 255 / 90%);
    transition: opacity 0.3s ease-out;
}

.app-loader__icon {
    animation: jump 1s ease-in-out infinite;
     
    width: 150px;

}

.app-loader__icon-shadow {
    height: 5px;
    width: 100px;
    margin-top: 10px;
    background: #4E76FC;
    border-radius: 100%;
    opacity: 0.5;
    filter: blur(2.5px);
    animation: jumpShadow 1s ease-in-out infinite;
}

@keyframes jump {
  0% {}
  50% {
    transform: translateY(-4px);
  }
  100% {}
}

@keyframes jumpShadow {
  0% {
    opacity: 0.5;
  }
  50% {
    opacity: 0.15;
    transform: translateY(4px) scaleX(1.66);
  }
  100% {
    opacity: 0.5;
  }
}


    input  {width: 100%;
    padding: calc(var(--grid-gap) / 2);
    border-radius: 4px;
    border: 2px solid #eee; box-sizing: border-box;  background: #fff;}

        textarea  {width: 100%;
    padding: calc(var(--grid-gap) / 2);
    border-radius: 4px;
    border: 2px solid #eee; box-sizing: border-box;  }
input[type="checkbox"] { width: auto }
input[type="radio"] { width: auto }
    select {width: 100%; box-sizing: border-box; 
    padding: calc(var(--grid-gap) / 2);
    border-radius: 4px;
border: none;
    box-shadow: inset 0px 0px 0px 2px #eee;
    background: #fff;
       outline: none}



.grid { display: grid; }

.grid-gap { grid-gap: var(--grid-gap); }
.grid-12 {  grid-template-columns: repeat(12, [col] 1fr);}
 
.grid-12 {    grid-column: span 12;}
.grid-11 {    grid-column: span 11;}
.grid-10 {    grid-column: span 10; }
.grid-9 {    grid-column: span 9;}
.grid-8 {    grid-column: span 8;}
.grid-7 {    grid-column: span 7;}
.grid-6 {    grid-column: span 6;}
.grid-5 {    grid-column: span 5;}
.grid-4 {    grid-column: span 4;}
.grid-3 {    grid-column: span 3;}
.grid-2 {    grid-column: span 2;}
.grid-1 {    grid-column: span 1;}

.flex { display: flex;    align-items: center;    gap: var(--grid-gap);    justify-content: space-between;    }


.justify-content-start {    justify-content: flex-start; }
.align-items-start { align-items: start; }

.align-self { align-self: auto; }
.align-center { text-align:  center; }


.box-block {

    padding: var(--grid-gap);
    border-radius: 4px;
    box-shadow: 0 1px 10px 0 rgba(196, 208, 227, .7);
    margin-bottom: var(--grid-gap);
}

.box-block-disabled { opacity: 0.25 }

.margin-bottom { margin-bottom:  var(--grid-gap); }
.margin-bottom-half { margin-bottom:  calc(var(--grid-gap)/2); }

.border-radius {    border-radius: var(--block-border-radius);}

.padding {padding: calc(2 * var(--grid-gap));}


.wrapper {  margin-left: auto;  margin-right: auto; flex-basis: 100%;    padding: calc(var(--grid-gap) * 2) calc(var(--grid-gap) * 4);    box-sizing: content-box;}
 

 
header {
    display: flex;
    
 
    top: 0;
    width: 100%;
    align-items: center;
    
    z-index: 3;
    user-select: none;
 

}

section  {  padding: calc(2 * var(--grid-gap)) 0; }

 

header .logo {  align-items: center;    gap: var(--grid-gap);    justify-content: space-between;}
header .logo img {  height: 32px; width: auto; }
footer .logo img {  height: 32px; width: auto; }


.box {
    display: flex;
    flex-direction: column;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
     
    max-width: 400px;
    margin: 0 auto;
    gap: var(--grid-gap);
    border-radius: calc(2*var(--grid-gap));
    box-sizing: border-box;
    padding: calc(2*var(--grid-gap));
    background: var(--color-background-boxes);

        box-shadow: rgba(78, 88, 134, 0.04) 0px 0px 16px;
    
}

.box h2 {
    font-size: 18px;
    margin: 0;
} 
.box p {
    font-size: 14px;
    margin: 0;
}

.invite-box {  padding: calc(var(--grid-gap)); background:  var(--color-highlight); }
a {
    color: var(--color-link);
    text-decoration: none;
}
.saveStatus { color: var(--color-success) }
button { 
    font-size: 14px;
      
    max-width: 400px;
    padding: calc(var(--grid-gap)) calc(var(--grid-gap)*4);
    box-sizing: border-box;
    outline: none;
    border: 1px solid #ccc;
    border-radius: calc(var(--grid-gap));
    z-index: 50;
    background: var(--color-background-button);
    color: var(--color-button-text);
    border: none;
    cursor: pointer;
    transition: all 0.2s;
    position: relative;
}

button.small { 
    font-size: 14px;
      
    max-width: 400px;
    padding: calc(var(--grid-gap)/2) calc(var(--grid-gap)*2);
    box-sizing: border-box;
    outline: none;
    border: 1px solid #ccc;
    border-radius: calc(var(--grid-gap));
    z-index: 50;
    background: var(--color-background-button);
    color: var(--color-button-text);
    border: none;
    cursor: pointer;
    transition: all 0.2s;
    position: relative;
}


button:hover { 
    background: var(--color-background-button-hover);
}

button:active { 
    background: var(--color-background-button-pressed);
}

 
button.mediumButton {max-width: 200px;}

button.button-loading span {
  visibility: hidden;
  opacity: 0;
}

button.button-loading::after {
  content: "";
  position: absolute;
  width: 16px;
  height: 16px;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  border: 4px solid transparent;
  border-top-color: #ffffff;
  border-radius: 50%;
  animation: button-loading-spinner 1s ease infinite;
}

@keyframes button-loading-spinner {
  from {
    transform: rotate(0turn);
  }

  to {
    transform: rotate(1turn);
  }
}

a.button.simpleButtonText {

    background: #fff;
    color: #000;

}
a.button.simpleButtonText:hover {

    background: #ccc;
 

}
a.button.simpleButtonText:active {
    background: #999;
}

a.button.simpleButton {

    background: #eee;
    color: #000;

}
a.button.simpleButton:hover {

    background: #ccc;
 

}
a.button.simpleButton:active {
    background: #999;
}
.align-right { text-align: right }
a.button {
    display: inline-block;
    text-align: center;
    font-size: 14px;
    
    padding: calc(var(--grid-gap));
    box-sizing: border-box;
    outline: none;
    text-decoration: none;
    border: 1px solid #ccc;
    border-radius: calc(var(--grid-gap));
    z-index: 50;
    background: var(--color-background-button);
    color: var(--color-button-text);
    border: none;
    cursor: pointer;
    white-space: nowrap;

}

a.button:hover { 
    background: var(--color-background-button-hover);
}

a.button-small {
    display: inline-block;
    text-align: center;
    font-size: 13px;
    padding: 4px 16px;
    box-sizing: border-box;
    outline: none;
    text-decoration: none;
    border: 1px solid #ccc;
    border-radius: 8px;
    z-index: 50;
    background: var(--color-background-button);
    color: var(--color-button-text);
    border: none;
    cursor: pointer;
    white-space: nowrap;

}

a.button-medium {
    display: inline-block;
    text-align: center;
    font-size: 14px;
    padding: calc(var(--grid-gap)/2) var(--grid-gap);
    box-sizing: border-box;
    outline: none;
    text-decoration: none;
    border: 1px solid #ccc;
    border-radius: var(--grid-gap);
    z-index: 50;
    background: var(--color-background-button);
    color: var(--color-button-text);
    border: none;
    cursor: pointer;
    white-space: nowrap;

}

a.button:hover { 
    background: var(--color-background-button-hover);
}


.buttons-inline {

    display: flex;
        gap: calc(var(--grid-gap)/2);
        width: 100%;
}
.simpleFooter {
    background: #eee;
    padding: var(--grid-gap);
    border-radius: var(--grid-gap);
    font-size: 14px;
    justify-content: normal;
    color: #999;
}

.simpleFooter a {
    color: rgb(10 13 21);
    text-decoration: none;
}

.stop_functions { padding: var(--grid-gap);
    border: 2px solid  var(--color-red);
    max-width: 800px; margin-bottom: calc(var(--grid-gap)*2);
    border-radius: 4px;
}

.stop_functions p { margin: 0; line-height: 150%; }
 .stop_functions span {     background: var(--color-red);
    /* color: #fff; */
    padding: 0px 8px;
    /* text-transform: lowercase; */
    font-size: 12px;
    /* border: 2px solid var(--color-red); */
    border-radius: 4px;
    white-space: nowrap;
    margin-right: 4px;
    display: inline-block; }
 
:root {
    --grid-gap: 16px;
    --block-border-radius: 16px;
    --text-font-size-1: 16px;
    --text-font-size-2: 20px;
    --text-font-size-0: 18px;
    --header-font-size-0: 36px;
    --heading-font-size-1: 32px;
    --heading-font-size-2: 20px;


    --color-text-main: #222;
    --color-text-second: rgb(111, 111, 111);

    --color-text-3: #999;

    --color-button-text: #fff;
    --color-link: rgb(25, 79, 218);

    --color-background-button: rgb(43, 97, 236);
    --color-background-button-hover: rgb(25, 79, 218);

    --color-background-button-pressed: rgb(23, 69, 187);

    --color-background-boxes: #fff;

    --color-highlight: rgb(211 227 253 / 38%);
    --color-highlight2: #fcf4e2;


    

    --color-error: rgb(204 0 0 / 80%);
    --color-success: rgb(176, 216, 65);

    --color-error-background:rgb(204 0 0 / 20%);
    --color-success-background: rgb(176 216 65 / 20%);
    --color-gray-background: #eee;


    --color-warn: #ff9500;

    --color-red: #e6adad;


    --box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);

}

 

@media(max-width: 760px) {

    :root {
        --grid-gap: 16px;
        --block-border-radius: 16px;
        --text-font-size-1: 16px;

        --text-font-size-2: 20px;
        --text-font-size-0: 18px;
        --header-font-size-0: 36px;
        --heading-font-size-1: 28px;
        --heading-font-size-2: 24px;

        --header-height: 70px;

    }

    header .logo img {
        margin: 0 auto;
        display: block;
    }

    section.main { padding: calc(var(--grid-gap));  }

    .wrapper { padding: calc(var(--grid-gap) * 1) calc(var(--grid-gap) * 1);    box-sizing: content-box;}
 
    .simpleFooter { 

        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
 
        gap: calc(var(--grid-gap)/2); 
    }
}

.notifyjs-liveinform-base {

    background: #fff;
   padding: calc(var(--grid-gap)/2) calc(var(--grid-gap)*2); 
   border-radius: var(--grid-gap);
       width: auto;
    font-weight: 300;
    font-size: 14px;
}

.notifyjs-liveinform-success {
    background: var(--color-success);
    color: #fff;
}

.notifyjs-liveinform-error {
    background: var(--color-error);
    color: #fff;
}
.notifyjs-liveinform-warn {
    background: var(--color-warn);
    color: #fff;
}
.notifyjs-liveinform-info {
   
}

    .user-role-name { font-size: 12px;  background: rgb(250 219 71 / 30%); padding: 4px 8px; border-radius: 4px; color: #666}
    .shop-list {
        
        display: grid;
        column-gap: var(--grid-gap);
        row-gap: var(--grid-gap);
        grid-template-columns: repeat(auto-fill, minmax(min(150px, 100%), 1fr));

    }

    .shop-list-element {
        position: relative;
        cursor: default;
        transition: 0.3sease -out;
        border-radius: 12px;
        background-color: var(--color-bg-hover);
        padding: calc(var(--grid-gap) / 2);
        font-size: 14px;

        padding: calc(var(--grid-gap) / 1);
        font-size: 14px;
    /*background: rgb(211 227 253 / 38%);*/
    cursor: pointer;
    box-shadow: 0 4px 12px hsla(0, 0%, 6%, .08);

    }
.shop-list-element.shop-add {
    background: rgb(211 227 253 / 38%);

}

.shop-list-element.account-add {
    background: rgb(211 227 253 / 38%);

}

.shop-list-element.current-shop { box-shadow: inset 0px 0px 0px 2px var(--color-success); }

    .shop_id { color: #999 }


.root {
    display: grid;
    grid-template-columns: var(--menu-unfold) auto;
    grid-template-rows: minmax(100vh, auto);
}
.root .menu {   width: 280px;
    background: #fff;
    box-shadow: 0 10px 44px 0 rgba(196, 208, 227, .25);
    z-index: 1000;

    display: flex;
    flex-direction: column;
    -webkit-box-flex: 1;
    flex-grow: 1;
    height: 100vh;

    overflow: hidden;
position: sticky;
    top: 0;
    /* height: auto; */
    scrollbar-width: none;
}

.root .menu .scroll {
    overflow-y: auto;
    scrollbar-width: thin;
}
.root .main { background: #fff; display: flex; min-height: 100vh; justify-content: space-between;  flex-direction: column; }
.root .menu ul {
        padding: 0;
    margin: 0 10px;
}
.root .menu li {
     display: block; margin: 0; padding: 0;
}
.root .menu li a {
    color: #666;
    width: 100%;
    display: block;
    cursor: pointer;
        padding: calc(var(--grid-gap) / 2) calc(var(--grid-gap)) calc(var(--grid-gap) / 2) calc(var(--grid-gap)*25/10);
    display: block;
    
    border-radius: calc(var(--grid-gap)/2);
    font-weight: 600;
    font-size: 15px;
    margin-bottom: 5px;
    box-sizing: border-box;
    background: #fff;
    position: relative;
}
.root .menu .arrow {
float: right;
    opacity: 0.5;
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:none;%7D%3C/style%3E%3C/defs%3E%3Ctitle/%3E%3Cg data-name='Layer 2' id='Layer_2'%3E%3Cpath d='M16,21a1,1,0,0,1-.71-.29l-8-8a1,1,0,1,1,1.42-1.42L16,18.59l7.29-7.3a1,1,0,0,1,1.42,1.42l-8,8A1,1,0,0,1,16,21Z'/%3E%3C/g%3E%3Cg id='frame'%3E%3Crect class='cls-1' height='32' width='32'/%3E%3C/g%3E%3C/svg%3E");
    background-size: 18px;
    background-repeat: no-repeat;
    -moz-transition: transform 1s;
    -webkit-transition: transform 1s;
    transition: transform .5s;
}
.flip {
    transform: rotate(-180deg);
}
.menu-icon {
    width: 14px;
    height: 14px;
    background-position: center center;
    display: inline-block;
    background-size: 14px;
    background-repeat: no-repeat;
    margin-right:  calc(var(--grid-gap) / 2);
    position: absolute;
    top: calc(var(--grid-gap)*5/8);
    left: calc(var(--grid-gap));
    filter: invert(60%);
}

.dot {
    width: 7px;
    border-radius: 50%;
    height: 7px;
    display: inline-block;
    vertical-align: middle;
    margin-left: 8px;

}

.root .menu ul.sub li .dots {
    position: absolute;
    right: 20px;
    top: 6px;
}
.root .menu .dot {
    width: 7px;
    border-radius: 50%;
    height: 7px;
    display: inline-block;
    vertical-align: middle;
    margin-left: 8px;

}

.dot.error {
    background: var(--color-error);
    box-shadow: 0 0 0 3px var(--color-error-background);
}

.dot.active {
    background: var(--color-success);
    box-shadow: 0 0 0 3px var(--color-success-background);

}

.dot.inactive {
    background: #ccc;
    box-shadow: 0 0 0 3px var(--color-gray-background);
}

.root.menu .feature {

    background: var(--color-success);

}

.index {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg fill='%23000' fill-rule='evenodd' clip-rule='evenodd' version='1.1' viewBox='0 0 24 24' xml:space='preserve' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cg id='info'/%3E%3Cg id='icons'%3E%3Cpath d='M23.6,10.3L13.2,2.4c-0.7-0.5-1.7-0.5-2.5,0L0.4,10.3C-0.4,10.9,0,12,1,12h1v6.1C2,20.2,3.8,22,6,22h2 c0.6,0,1-0.4,1-1v-4.9C9,15,9.9,14,11,14h2c1.1,0,2,1,2,2.1V21c0,0.5,0.4,1,1,1h2c2.2,0,4-1.8,4-3.9V12h1 C23.9,12,24.3,10.9,23.6,10.3z' id='home' fill='' /%3E%3C/g%3E%3C/svg%3E");
 
}
.tracks {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg fill='none' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 15C13.6569 15 15 13.6569 15 12C15 10.3431 13.6569 9 12 9C10.3431 9 9 10.3431 9 12C9 13.6569 10.3431 15 12 15Z' fill='currentColor'/%3E%3Cpath clip-rule='evenodd' d='M12 3C12.5523 3 13 3.44772 13 4V5.07089C16.0657 5.5094 18.4906 7.93431 18.9291 11H20C20.5523 11 21 11.4477 21 12C21 12.5523 20.5523 13 20 13H18.9291C18.4906 16.0657 16.0657 18.4906 13 18.9291V20C13 20.5523 12.5523 21 12 21C11.4477 21 11 20.5523 11 20V18.9291C7.93431 18.4906 5.5094 16.0657 5.07089 13H4C3.44772 13 3 12.5523 3 12C3 11.4477 3.44772 11 4 11H5.07089C5.5094 7.93431 7.93431 5.5094 11 5.07089V4C11 3.44772 11.4477 3 12 3ZM7 12C7 9.23858 9.23858 7 12 7C14.7614 7 17 9.23858 17 12C17 14.7614 14.7614 17 12 17C9.23858 17 7 14.7614 7 12Z' fill='currentColor' fill-rule='evenodd'/%3E%3C/svg%3E");
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg id='Layer_1' style='enable-background:new 0 0 30 30;' version='1.1' viewBox='0 0 30 30' xml:space='preserve' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cpath d='M20.619,18.457c-0.081,0.081-0.163,0.162-0.244,0.241c-0.547,0.539-1.055,1.044-1.464,1.524C23.523,20.765,26,22.188,26,23 c0,1.019-3.883,3-11,3S4,24.019,4,23c0-0.812,2.477-2.235,7.089-2.778c-0.41-0.48-0.918-0.985-1.464-1.524 c-0.08-0.079-0.162-0.16-0.244-0.241C5.226,19.167,2,20.696,2,23c0,3.282,6.54,5,13,5s13-1.718,13-5 C28,20.696,24.774,19.167,20.619,18.457z'/%3E%3Cpath d='M15,2c-4.418,0-8,3.582-8,8c0,6,7,8,7,12c0,0.552,0.448,1,1,1s1-0.448,1-1c0-4,7-6,7-12C23,5.582,19.418,2,15,2z M15,12 c-1.105,0-2-0.895-2-2c0-1.105,0.895-2,2-2s2,0.895,2,2C17,11.105,16.105,12,15,12z'/%3E%3C/svg%3E");
}

.reviews {
 
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg enable-background='new 0 0 32 32' id='Glyph' version='1.1' viewBox='0 0 32 32' xml:space='preserve' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cpath d='M29.895,12.52c-0.235-0.704-0.829-1.209-1.549-1.319l-7.309-1.095l-3.29-6.984C17.42,2.43,16.751,2,16,2 s-1.42,0.43-1.747,1.122l-3.242,6.959l-7.357,1.12c-0.72,0.11-1.313,0.615-1.549,1.319c-0.241,0.723-0.063,1.507,0.465,2.046 l5.321,5.446l-1.257,7.676c-0.125,0.767,0.185,1.518,0.811,1.959c0.602,0.427,1.376,0.469,2.02,0.114l6.489-3.624l6.581,3.624 c0.646,0.355,1.418,0.311,2.02-0.114c0.626-0.441,0.937-1.192,0.811-1.959l-1.259-7.686l5.323-5.436 C29.958,14.027,30.136,13.243,29.895,12.52z' id='XMLID_328_'/%3E%3C/svg%3E");
}

.check {
 
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.488 21.754c.294.157.663.156.957-.001 8.012-4.304 8.581-12.713 8.574-15.104a.988.988 0 0 0-.596-.903l-8.05-3.566a1.005 1.005 0 0 0-.813.001L3.566 5.747a.99.99 0 0 0-.592.892c-.034 2.379.445 10.806 8.514 15.115zM8.674 10.293l2.293 2.293 4.293-4.293 1.414 1.414-5.707 5.707-3.707-3.707 1.414-1.414z'/%3E%3C/svg%3E");}

.settings {
 
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg style='enable-background:new 0 0 24 24;' version='1.1' viewBox='0 0 24 24' xml:space='preserve' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cg id='info'/%3E%3Cg id='icons'%3E%3Cpath d='M22.2,14.4L21,13.7c-1.3-0.8-1.3-2.7,0-3.5l1.2-0.7c1-0.6,1.3-1.8,0.7-2.7l-1-1.7c-0.6-1-1.8-1.3-2.7-0.7 L18,5.1c-1.3,0.8-3-0.2-3-1.7V2c0-1.1-0.9-2-2-2h-2C9.9,0,9,0.9,9,2v1.3c0,1.5-1.7,2.5-3,1.7L4.8,4.4c-1-0.6-2.2-0.2-2.7,0.7 l-1,1.7C0.6,7.8,0.9,9,1.8,9.6L3,10.3C4.3,11,4.3,13,3,13.7l-1.2,0.7c-1,0.6-1.3,1.8-0.7,2.7l1,1.7c0.6,1,1.8,1.3,2.7,0.7L6,18.9 c1.3-0.8,3,0.2,3,1.7V22c0,1.1,0.9,2,2,2h2c1.1,0,2-0.9,2-2v-1.3c0-1.5,1.7-2.5,3-1.7l1.2,0.7c1,0.6,2.2,0.2,2.7-0.7l1-1.7 C23.4,16.2,23.1,15,22.2,14.4z M12,16c-2.2,0-4-1.8-4-4c0-2.2,1.8-4,4-4s4,1.8,4,4C16,14.2,14.2,16,12,16z' id='settings'/%3E%3C/g%3E%3C/svg%3E");
}

.integrations {
 
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M326.612 185.391c59.747 59.809 58.927 155.698.36 214.59-.11.12-.24.25-.36.37l-67.2 67.2c-59.27 59.27-155.699 59.262-214.96 0-59.27-59.26-59.27-155.7 0-214.96l37.106-37.106c9.84-9.84 26.786-3.3 27.294 10.606.648 17.722 3.826 35.527 9.69 52.721 1.986 5.822.567 12.262-3.783 16.612l-13.087 13.087c-28.026 28.026-28.905 73.66-1.155 101.96 28.024 28.579 74.086 28.749 102.325.51l67.2-67.19c28.191-28.191 28.073-73.757 0-101.83-3.701-3.694-7.429-6.564-10.341-8.569a16.037 16.037 0 0 1-6.947-12.606c-.396-10.567 3.348-21.456 11.698-29.806l21.054-21.055c5.521-5.521 14.182-6.199 20.584-1.731a152.482 152.482 0 0 1 20.522 17.197zM467.547 44.449c-59.261-59.262-155.69-59.27-214.96 0l-67.2 67.2c-.12.12-.25.25-.36.37-58.566 58.892-59.387 154.781.36 214.59a152.454 152.454 0 0 0 20.521 17.196c6.402 4.468 15.064 3.789 20.584-1.731l21.054-21.055c8.35-8.35 12.094-19.239 11.698-29.806a16.037 16.037 0 0 0-6.947-12.606c-2.912-2.005-6.64-4.875-10.341-8.569-28.073-28.073-28.191-73.639 0-101.83l67.2-67.19c28.239-28.239 74.3-28.069 102.325.51 27.75 28.3 26.872 73.934-1.155 101.96l-13.087 13.087c-4.35 4.35-5.769 10.79-3.783 16.612 5.864 17.194 9.042 34.999 9.69 52.721.509 13.906 17.454 20.446 27.294 10.606l37.106-37.106c59.271-59.259 59.271-155.699.001-214.959z'/%3E%3C/svg%3E");

}
.deliveries {
 
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg enable-background='new 0 0 24 24' height='24px' id='Layer_1' version='1.1' viewBox='0 0 24 24' width='24px' xml:space='preserve' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cg%3E%3Cpath d='M20.6,5.7c0-0.2-0.1-0.3-0.2-0.4l-8.1-4.7c-0.1-0.1-0.3-0.1-0.5,0L3.6,5.3C3.5,5.4,3.4,5.5,3.4,5.7c0,0.2,0.1,0.3,0.2,0.4 l8.1,4.7c0.1,0,0.2,0.1,0.2,0.1s0.2,0,0.2-0.1l8.1-4.7C20.5,6,20.6,5.8,20.6,5.7z'/%3E%3Cpath d='M10.6,13.2L2.5,8.5C2.3,8.4,2.1,8.4,2,8.5C1.9,8.6,1.8,8.8,1.8,8.9v9.4c0,0.2,0.1,0.3,0.2,0.4l8.1,4.7 c0.1,0,0.2,0.1,0.2,0.1s0.2,0,0.2-0.1c0.1-0.1,0.2-0.2,0.2-0.4v-9.4C10.9,13.4,10.8,13.3,10.6,13.2z'/%3E%3Cpath d='M22,8.5c-0.1-0.1-0.3-0.1-0.5,0l-8.1,4.7c-0.1,0.1-0.2,0.2-0.2,0.4V23c0,0.2,0.1,0.3,0.2,0.4c0.1,0,0.2,0.1,0.2,0.1 s0.2,0,0.2-0.1l8.1-4.7c0.1-0.1,0.2-0.2,0.2-0.4V8.9C22.2,8.8,22.1,8.6,22,8.5z'/%3E%3C/g%3E%3C/svg%3E");
}

.finance {
   background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle/%3E%3Cpath d='M20.5.305H3.5A3.535,3.535,0,0,0,0,3.805v13a4.5,4.5,0,0,0,3.306,4.174L14.465,23.6a2.929,2.929,0,0,0,2.487-.489A2.863,2.863,0,0,0,18,20.805l0-9.692a4.264,4.264,0,0,0-3.119-4.1L4.056,4.028a.75.75,0,1,1,.4-1.446l3.534.975.012,0H20.5a.75.75,0,1,1,0,1.5H15.265a.25.25,0,0,0-.067.491l.086.024a5.719,5.719,0,0,1,2.9,1.894.254.254,0,0,0,.194.091H20.5a.75.75,0,0,1,0,1.5H19.462a.249.249,0,0,0-.238.327,5.609,5.609,0,0,1,.281,1.731v6.942a.25.25,0,0,0,.25.25H20.5a3.5,3.5,0,0,0,3.5-3.5v-11A3.5,3.5,0,0,0,20.5.305Zm-5,15a2,2,0,1,1-2-2A2,2,0,0,1,15.5,15.305Z'/%3E%3C/svg%3E");
}

.sendings {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m8.5 18 3.5 4 3.5-4H19c1.103 0 2-.897 2-2V4c0-1.103-.897-2-2-2H5c-1.103 0-2 .897-2 2v12c0 1.103.897 2 2 2h3.5zM7 7h10v2H7V7zm0 4h7v2H7v-2z'/%3E%3C/svg%3E");
}
.new {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg style='enable-background:new 0 0 36 36;' version='1.1' viewBox='0 0 36 36' xml:space='preserve' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23222A30;%7D .st1%7Bfill:none;stroke:%23222A30;stroke-width:2.0101;stroke-linejoin:round;stroke-miterlimit:10;%7D .st2%7Bfill:%23171715;%7D .st3%7Bfill-rule:evenodd;clip-rule:evenodd;fill:%23222A30;%7D%0A%3C/style%3E%3Cg id='Layer_1'/%3E%3Cg id='icons'%3E%3Cpath class='st0' d='M19.6,2h-3.2c-0.9,0-1.6,0.7-1.6,1.6v11.2H3.6c-0.9,0-1.6,0.7-1.6,1.6v3.2c0,0.9,0.7,1.6,1.6,1.6 h11.2v11.2c0,0.9,0.7,1.6,1.6,1.6h3.2c0.9,0,1.6-0.7,1.6-1.6V21.2h11.2c0.9,0,1.6-0.7,1.6-1.6v-3.2c0-0.9-0.7-1.6-1.6-1.6H21.2V3.6 C21.2,2.7,20.5,2,19.6,2z' id='add_1_'/%3E%3C/g%3E%3C/svg%3E");
}
.reports {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg style='enable-background:new 0 0 24 24;' version='1.1' viewBox='0 0 24 24' xml:space='preserve' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cg id='info'/%3E%3Cg id='icons'%3E%3Cg id='statistics'%3E%3Cpath d='M5,12H3c-1.1,0-2,0.9-2,2v6c0,1.1,0.9,2,2,2h2c1.1,0,2-0.9,2-2v-6C7,12.9,6.1,12,5,12z'/%3E%3Cpath d='M13,2h-2C9.9,2,9,2.9,9,4v16c0,1.1,0.9,2,2,2h2c1.1,0,2-0.9,2-2V4C15,2.9,14.1,2,13,2z'/%3E%3Cpath d='M21,8h-2c-1.1,0-2,0.9-2,2v10c0,1.1,0.9,2,2,2h2c1.1,0,2-0.9,2-2V10C23,8.9,22.1,8,21,8z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
.root .menu li a:hover {
    background: #fafafa;
}

.root .menu ul.sub li a:hover {
    background: #fafafa;
}
 
.root .menu ul.sub { display: none;     margin: 0 0 0 calc(var(--grid-gap)*15/10); }

.root .menu ul.sub li a {
        padding: calc(var(--grid-gap) / 2) calc(var(--grid-gap)) calc(var(--grid-gap) / 2) calc(var(--grid-gap));
    
}
.root .menu ul.sub li a.selected {
    background: rgb(211 227 253 / 38%) !important;
}

.root .menu li.selected a { background: rgb(211 227 253 / 38%); color: #000 }


.root .menu li.selected a .menu-icon { filter: invert(0%); }

.root .menu li.selected .arrow {   transform: rotate(-180deg); }


.root .menu li.selected ul.sub { display: block }
.root .menu li.selected ul.sub li a { background: #fff; color: #666 }
.root .menu li.selected ul.sub li a:hover { background: #fafafa;   }

.root .menu .logo {
    display: block;
    height: 30px;
    width: 180px;
    background: url('/assets/img/liveinform_logo.svg') center center;
    background-size: 143px 35px;
    background-repeat: no-repeat;
    padding-top: 50px;
    margin: 0 auto;
}

.root .header-block {
      padding: calc(var(--grid-gap)* 2);
    display: flex;
    justify-content: flex-end;
    font-size: 14px;

}

 .icon-direction {
 display: inline-block;
    height: 12px;
    width: 12px;
    background: url('/assets/img/direction.svg') center center;
    background-size: 12px 12px;
    background-repeat: no-repeat;
     
    margin-right: calc(var(--grid-gap)/2);

    display: none;

}
.icon-arrow-down {
 display: inline-block;
    height: 16px;
    width: 16px;
    background: url('/assets/img/arrow-down.svg?22') center center;
    background-size: 16px 16px;
    background-repeat: no-repeat;
    opacity: 0.3;
    cursor: pointer;
 }
 .icon-arrow-top {
 display: inline-block;
    height: 16px;
    width: 16px;
    background: url('/assets/img/arrow-top.svg?2') center center;
    background-size: 16px 16px;
    background-repeat: no-repeat;
    opacity: 0.3;
    cursor: pointer;
 }
.icon-delete {
 display: inline-block;
    height: 16px;
    width: 16px;
    background: url('/assets/img/delete.svg') center center;
    background-size: 16px 16px;
    background-repeat: no-repeat;
    opacity: 0.3;
    cursor: pointer;
 }
.icon-drag {
 display: inline-block;
    height: 16px;
    width: 16px;
    background: url('/assets/img/drag-dotts.svg') center center;
    background-size: 16px 16px;
    background-repeat: no-repeat;
    opacity: 0.3;
    cursor: pointer;
 }

 .icon-reviews-yamaps {
 display: inline-block;
    height: 32px;
    width: 32px;
    background: url('/assets/img/yamaps.svg') center center;
    background-size: 32px 32px;
    background-repeat: no-repeat;
     
    cursor: pointer;
 }

  .icon-reviews-yabusiness {
 display: inline-block;
    height: 32px;
    width: 32px;
    background: url('/assets/img/yabusiness.svg') center center;
    background-size: 32px 32px;
    background-repeat: no-repeat;
     
    cursor: pointer;
 }

   .icon-reviews-2gis {
 display: inline-block;
    height: 32px;
    width: 32px;
    background: url('/assets/img/2gis.svg') center center;
    background-size: 32px 32px;
    background-repeat: no-repeat;
     
    cursor: pointer;
 }

    .icon-reviews-google {
 display: inline-block;
    height: 32px;
    width: 32px;
    background: url('/assets/img/google.svg') center center;
    background-size: 32px 32px;
    background-repeat: no-repeat;
     
    cursor: pointer;
 }

    .icon-reviews-zoon {
 display: inline-block;
    height: 32px;
    width: 32px;
    background: url('/assets/img/zoon.svg') center center;
    background-size: 32px 32px;
    background-repeat: no-repeat;
     
    cursor: pointer;
 }

     .icon-reviews-site {
 display: inline-block;
    height: 32px;
    width: 32px;
    background: url('/assets/img/site.svg') center center;
    background-size: 16px 16px;
    background-repeat: no-repeat;
     
    cursor: pointer;
 }

     .icon-reviews-vk {
 display: inline-block;
    height: 32px;
    width: 32px;
    background: url('/assets/img/vk.svg') center center;
    background-size: 32px 32px;
    background-repeat: no-repeat;
     
    cursor: pointer;
 }
    .icon-reviews-avito {
 display: inline-block;
    height: 32px;
    width: 32px;
    background: url('/assets/img/avito.svg') center center;
    background-size: 32px 32px;
    background-repeat: no-repeat;
     
    cursor: pointer;
 }
    .icon-reviews-otzovik {
 display: inline-block;
    height: 32px;
    width: 32px;
    background: url('/assets/img/otzovik.svg') center center;
    background-size: 32px 32px;
    background-repeat: no-repeat;
     
    cursor: pointer;
 }


.icon-telegram {
 display: inline-block;
    height: 12px;
    width: 12px;
    background: url('/assets/img/telegram.svg') center center;
    background-size: 12px 12px;
    background-repeat: no-repeat;
     
    margin-right: calc(var(--grid-gap)/2);

}

.icon-whatsapp {
 display: inline-block;
    height: 12px;
    width: 12px;
    background: url('/assets/img/whatsapp.svg') center center;
    background-size: 12px 12px;
    background-repeat: no-repeat;
     
    margin-right: calc(var(--grid-gap)/2);

}

.icon-email {
 display: inline-block;
    height: 12px;
    width: 12px;
    background: url('/assets/img/email.svg') center center;
    background-size: 12px 12px;
    background-repeat: no-repeat;
     
    margin-right: calc(var(--grid-gap)/2);

}

.icon-sms {
 display: inline-block;
    height: 12px;
    width: 12px;
    background: url('/assets/img/sms.svg') center center;
    background-size: 12px 12px;
    background-repeat: no-repeat;
     
    margin-right: calc(var(--grid-gap)/2);

}


.icon-call {
 display: inline-block;
    height: 12px;
    width: 12px;
    background: url('/assets/img/call.svg') center center;
    background-size: 12px 12px;
    background-repeat: no-repeat;
     
    margin-right: calc(var(--grid-gap)/2);

}

.event .badges { margin-bottom: var(--grid-gap); display: flex; align-items: center; gap: var(--grid-gap);}

.event  .badges div:last-child { margin-left: auto;  }
.event  .badges div:last-child label { margin: 0 var(--grid-gap) }

.event_type .text { margin-bottom: var(--grid-gap) }

.event_type .subject { margin-bottom: var(--grid-gap); font-weight: bold }


.channel {
    text-transform: uppercase;
    font-weight: 600;
    font-size: 10px;
    background: #eee;
    padding: 2px 16px;
    border-radius: 4px;
    border: 2px solid #eee;
    box-sizing: border-box;
    display: inline-block;
    white-space: nowrap;
    vertical-align: middle;
}

span.direction {
    text-transform: uppercase;
    font-weight: 600;
    font-size: 10px;
    background: #eee;
    padding: 4px 16px;
    border-radius: 4px;
    box-sizing: border-box;
    display: inline-block;
    vertical-align: middle;
}

.event .delivery {
    text-transform: uppercase;
    font-weight: 600;
    font-size: 10px;
    box-shadow: inset 0px 0px 0px 2px #eee;
    color: #ccc;
    padding: 4px 16px;
    border-radius: 4px;
    box-sizing: border-box;
}
.event .step {
        font-weight: bold;
    font-size: 14px;
    margin-bottom: calc(var(--grid-gap) / 2);
}

.channel-sms {
   border-color: #fd4582 !important;
    background: #fff !important;
    color: #fd4582 !important;

}

.channel-email {
    background: #cdedff !important;
}

.channel-telegram {
    background: #fff !important;
    color: #24A1DE;
    border-color: #24A1DE !important;
}

.channel-cascade {
    background: #2200ff  !important;
    color: #fff;
}


.channel-sms-title {
    color: #ffbb68  !important;

}

.channel-email-title {
    color: #58c3ff !important
}
.channel-whatsapp-title {
    color: #00a884 !important
}
 
.channel-telegram-title {
    color: #24A1DE !important;
     
}

.channel-cascade-title {
    color: #2200ff  !important;
 
}

 


.channel-call { background: #ffdc85 !important }

.channel-telegram .icon-telegram {
     filter: invert(100%);
}

.channel-whatsapp {
    background: #fff !important;
    color: #00a884;
    border-color:  #00a884 !important;
}

.channel-whatsapp .icon-whatsapp {
     filter: invert(100%);
}

.table { display: table }
.row { display: table-row; }
.cell { display: table-cell; padding: 0 calc(var(--grid-gap)) calc(var(--grid-gap)) 0; position: relative;  vertical-align: top;}
.table .row:last-child .cell { padding-bottom: 0 }
.table .row .cell:last-child  { padding-right: 0 }


.flexMenu { display: flex; gap: calc(var(--grid-gap)*2); }
.section-menu { width: 160px; }
.section-main { max-width:600px; }

.section-menu .section-menu-item { 
    margin-bottom: calc(var(--grid-gap)/2);
     margin-right: calc(var(--grid-gap)/2);
    border-radius: 4px;
    padding: calc(var(--grid-gap)/2) calc(var(--grid-gap));
    cursor: pointer;
     }

.section-menu .section-menu-item.selected {
    background: rgb(211 227 253 / 38%) !important;
}

.section-menu.horizontal { width: 100%; }

.section-menu.horizontal .section-menu-item {
    background: #eee;
}

.section-menu.horizontal .section-menu-item.selected {
    background: var(--color-link) !important;

    color: #fff;
}

.section-menu.horizontal { margin-bottom:  calc(var(--grid-gap)*2) }


.integration-header { padding: calc(var(--grid-gap) * 1) 0;
  
    border-bottom: 2px solid #eee;
    margin-bottom: calc(var(--grid-gap) * 2);
   font-size: 14px;
   color: #666;

     } 

    .integration-header.flex {
        justify-content: flex-start;
            gap: calc(var(--grid-gap)*2);
     }
.integration-header div div { padding: 2px 0; }

     .integration-header .logo { height: 32px; }

     .integration-header .contacts a { color: #999 }
 .integration-help { max-width: 800px }

.section-menu.horizontal  .section-menu-item { display: inline-block; }
 


 
  .row-filters { display: flex;
    align-items: center;
    gap: var(--grid-gap);
    flex-wrap: wrap;
}
.form-filters .row-filters { margin-bottom: var(--grid-gap); }
 .form-filters div small { display: block; font-size: 11px; color: #ccc; margin-bottom: 4px; }
.form-filters select, .form-filters  input { padding: calc(var(--grid-gap)/4); font-size: 13px;}

.form-filters button {  padding: calc(var(--grid-gap)/2) calc(var(--grid-gap)*4); font-size: 13px; }

.form-filters .radio-tabs { display: flex; }

.form-filters .radio-tabs .radio-tab input { display: none }

.form-filters .radio-tabs .radio-tab { cursor: pointer; padding: calc(var(--grid-gap)/2) var(--grid-gap); border-bottom: 2px solid #eee; color: #999; font-size: 14px}
.form-filters .radio-tabs .selected { color: #000; border-color: var(--color-link) }
.form-filters .radio-tabs .counter { background: #eee;
    border-radius: calc(var(--grid-gap) / 4);
    color: #666;
    font-size: 10px;
    font-weight: bold;
    padding: calc(var(--grid-gap) / 4);
    /* display: inline-block; */
    margin-left: calc(var(--grid-gap)/2);}

    .form-filters .radio-tabs .counter:empty {
    display: none;
}
 .filters-block { display: flex;
    align-items: center;
    gap: var(--grid-gap);
    flex-wrap: wrap;
     }


     .filters-block div small { display: block; font-size: 11px; color: #ccc; margin-bottom: 4px; }
.results_count {
    padding: calc(var(--grid-gap));
    text-align: center;
    color: #999;
}
.results_count  span {     color: var(--color-link); }
     .load-more {   }
.load-more a {

    display: block;
    padding: calc(var(--grid-gap)) calc(var(--grid-gap) * 2);
    background: #fafafa;
    border-radius: calc(var(--grid-gap) / 2);
     margin-top: calc(var(--grid-gap));
    text-align: center;
    border: 1px solid #eee;
}

.load-more a:hover { background: #eee }

.actions-block {
        position: fixed;
 
   bottom: 0;
    right: 0;
    left: 280px;
    border-radius: var(--grid-gap);
    
    width: 100%;
    box-sizing: border-box;
    z-index: 9999;
    /* border-radius: 5px; */
    
     
}
.actions-block select { background: #fff }
.actions-block .actions-container {

     padding: var(--grid-gap);
  
     
    
    box-sizing: border-box;
    display: flex;
    grid-gap: var(--grid-gap);
background: rgb(234 242 255);
    display: flex;
    align-items: center;
    grid-gap: var(--grid-gap);
    vertical-align: middle;
    font-size: 14px;

}

.actions-container .counter span { color: var(--color-link);  }

.buttons {
    display: flex;
    gap: calc(var(--grid-gap));
    align-items: center;
    justify-content: left;
    white-space: nowrap;
}

.buttons div a {
    padding: 4px 8px;
    font-size: 10px;
    text-transform: uppercase;
    display: block;
    border-radius: calc(var(--grid-gap) / 1);
    background: rgb(255, 255, 255);
    color: rgb(102, 102, 102);
    border: 1px solid rgb(204, 204, 204);
    font-weight: normal;
    background: #fff
}

.buttons div a:hover { background: #eee }

.buttons div a {
    display: flex;
    gap: 2px;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
}

.buttons div a .icon {
    width: 12px;
    height: 12px;
    display: block;
    background-size: 12px 12px;
}

.buttons div a .text {
}

.buttons a.button-menu .text {
    display: none;
}


.user-icon {

    height:  12px;
    width: 12px;
    display: inline-block;
    background-size: 12px;
    vertical-align: middle;
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg width='800px' height='800px' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 21C5 17.134 8.13401 14 12 14C15.866 14 19 17.134 19 21M16 7C16 9.20914 14.2091 11 12 11C9.79086 11 8 9.20914 8 7C8 4.79086 9.79086 3 12 3C14.2091 3 16 4.79086 16 7Z' stroke='%23000000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-position: center center;
    background-repeat: no-repeat;
 

}
.buttons .icon-menu {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg width='800px' height='800px' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' fill='%23000000' class='bi bi-three-dots-vertical'%3E%3Cpath d='M9.5 13a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0zm0-5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0zm0-5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z'/%3E%3C/svg%3E");
    background-position: center center;
    background-repeat: no-repeat;
}

.buttons .icon-cancel {
    background-image: url("data:image/svg+xml,<svg data-tid=\"Icon__root\" width=\"16\" height=\"16\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 16\" aria-hidden=\"true\" style=\"fill: rgb(237, 63, 63); margin-bottom: 0px;flex-shrink: 0;outline: none;\"><path d=\"M5.68 4.973a.5.5 0 1 0-.707.707l1.82 1.82-1.82 1.82a.5.5 0 0 0 .707.707l1.82-1.82 1.82 1.82a.5.5 0 1 0 .707-.707L8.207 7.5l1.82-1.82a.5.5 0 0 0-.707-.707L7.5 6.793l-1.82-1.82Z\"></path><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.5 1a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13ZM2 7.5a5.5 5.5 0 1 1 11 0 5.5 5.5 0 0 1-11 0Z\"></path></svg>");
    background-position: center center;
    background-repeat: no-repeat;
}

.buttons .icon-ship {
    background-image: url("data:image/svg+xml,<%3Fxml version=\"1.0\" encoding=\"utf-8\"%3F><svg version=\"1.1\" id=\"Layer_1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\" width=\"122.881px\" height=\"122.88px\" style=\"fill:  rgb(139, 175, 39);\" viewBox=\"0 0 122.881 122.88\" enable-background=\"new 0 0 122.881 122.88\" xml:space=\"preserve\"><g><path d=\"M61.44,0c16.966,0,32.326,6.877,43.445,17.995s17.996,26.479,17.996,43.444c0,16.967-6.877,32.327-17.996,43.445 S78.406,122.88,61.44,122.88c-16.966,0-32.326-6.877-43.444-17.995S0,78.406,0,61.439c0-16.965,6.877-32.326,17.996-43.444 S44.474,0,61.44,0L61.44,0z M34.556,67.179c-1.313-1.188-1.415-3.216-0.226-4.529c1.188-1.313,3.216-1.415,4.529-0.227L52.3,74.611 l31.543-33.036c1.223-1.286,3.258-1.336,4.543-0.114c1.285,1.223,1.336,3.257,0.113,4.542L54.793,81.305l-0.004-0.004 c-1.195,1.257-3.182,1.338-4.475,0.168L34.556,67.179L34.556,67.179z M100.33,22.55C90.377,12.598,76.627,6.441,61.44,6.441 c-15.188,0-28.938,6.156-38.89,16.108c-9.953,9.953-16.108,23.702-16.108,38.89c0,15.188,6.156,28.938,16.108,38.891 c9.952,9.952,23.702,16.108,38.89,16.108c15.187,0,28.937-6.156,38.89-16.108c9.953-9.953,16.107-23.702,16.107-38.891 C116.438,46.252,110.283,32.502,100.33,22.55L100.33,22.55z\"/></g></svg>");
    background-position: center center;
    background-repeat: no-repeat;
}

.buttons .icon-export {
    background-image: url("data:image/svg+xml,%3Csvg id='SvgjsSvg1001' width='288' height='288' xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.com/svgjs'%3E%3Cdefs id='SvgjsDefs1002'%3E%3C/defs%3E%3Cg id='SvgjsG1008'%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 128 128' width='288' height='288'%3E%3Cpath fill='%23000000' d='M80 96h-8.3l-8-13-8 13H48l11.4-17.7-10.7-16.6h8L64.1 74l7.2-12.3h7.8l-10.8 17L80 96z' class='svgShape color007732-0 selectable'%3E%3C/path%3E%3Cpath fill='%23000000' d='M104 126H24c-5.5 0-10-4.5-10-10V12c0-5.5 4.5-10 10-10h40.7c2.7 0 5.2 1 7.1 2.9l39.3 39.3c1.9 1.9 2.9 4.4 2.9 7.1V116c0 5.5-4.5 10-10 10zM24 6c-3.3 0-6 2.7-6 6v104c0 3.3 2.7 6 6 6h80c3.3 0 6-2.7 6-6V51.3c0-1.6-.6-3.1-1.8-4.2L68.9 7.8C67.8 6.6 66.3 6 64.7 6H24z' class='svgShape color007732-1 selectable'%3E%3C/path%3E%3C/svg%3E%3C/g%3E%3C/svg%3E");
    background-position: center center;
    background-repeat: no-repeat;
}
.buttons .icon-sync {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg fill='%23000000' width='800px' height='800px' viewBox='-4 0 32 32' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle%3Esync%3C/title%3E%3Cpath d='M17.594 16h2.031c0-1.813-0.688-3.531-1.75-4.844h-0.031c-0.781-0.938-1.719-1.656-2.844-2.125-0.031 0-0.063-0.031-0.063-0.031-0.188-0.063-0.375-0.188-0.563-0.25-0.063 0-0.094-0.031-0.156-0.031-0.156-0.063-0.375-0.094-0.531-0.125-0.063-0.031-0.156-0.063-0.219-0.063-0.188-0.031-0.344-0.063-0.531-0.094h-0.188c-0.219-0.031-0.469-0.031-0.688-0.031-1.563-0.031-3.094 0.438-4.406 1.344-0.531 0.375-1.344 0.25-1.688-0.281-0.375-0.531-0.219-1.281 0.313-1.656 1.688-1.188 3.656-1.813 5.688-1.813 0.031 0 0.031-0.031 0.031-0.031 0.063 0 0.094 0.031 0.125 0.031 0.281 0 0.563 0 0.813 0.031 0.125 0 0.219 0.031 0.344 0.031 0.125 0.031 0.281 0.031 0.438 0.063 0.063 0 0.125 0.031 0.188 0.031 0.094 0.031 0.25 0.094 0.375 0.125 0.188 0.031 0.406 0.094 0.594 0.156 0.094 0.031 0.188 0.063 0.25 0.094 0.25 0.063 0.5 0.156 0.719 0.25 0.063 0 0.094 0.031 0.125 0.031 1.438 0.625 2.719 1.563 3.75 2.813 0 0.031 0.031 0.031 0.031 0.063 0.156 0.188 0.313 0.406 0.438 0.594 0.031 0 0.031 0.031 0.031 0.063 1.125 1.625 1.813 3.531 1.813 5.656h1.969l-3.188 4.781zM0 16l3.188-4.813 3.219 4.813h-2.031c0 1.781 0.656 3.406 1.719 4.719 0.031 0.031 0.031 0.063 0.063 0.094 0.156 0.188 0.313 0.375 0.469 0.531v0.031c0.5 0.5 1.094 0.938 1.719 1.281 0.031 0 0.031 0.031 0.031 0.031 0.188 0.094 0.406 0.188 0.594 0.25 0.031 0.031 0.094 0.063 0.125 0.063 0.156 0.063 0.313 0.125 0.5 0.188 0.063 0.031 0.125 0.063 0.219 0.063 0.125 0.063 0.313 0.094 0.469 0.125 0.094 0.031 0.188 0.031 0.281 0.063 0.156 0.031 0.313 0.063 0.469 0.063 0.094 0.031 0.156 0.031 0.25 0.031 0.188 0.031 0.438 0.031 0.625 0.031 1.594 0.031 3.125-0.438 4.438-1.375 0.531-0.344 1.344-0.188 1.688 0.344 0.375 0.531 0.219 1.281-0.313 1.656-1.688 1.188-3.656 1.813-5.688 1.813-0.344 0-0.688-0.031-1.031-0.063-0.063 0-0.125-0.031-0.188-0.031-0.188-0.031-0.344-0.031-0.531-0.063-0.063-0.031-0.125-0.031-0.156-0.031-0.125-0.031-0.313-0.063-0.438-0.094-0.188-0.063-0.375-0.094-0.563-0.156-0.094-0.031-0.188-0.063-0.313-0.094-0.188-0.063-0.438-0.156-0.656-0.25-0.063 0-0.125-0.031-0.156-0.063-0.25-0.125-0.531-0.25-0.75-0.375-0.031 0-0.063-0.031-0.063-0.031-0.844-0.438-1.563-1-2.25-1.688 0-0.031-0.031-0.031-0.031-0.063-0.188-0.188-0.406-0.406-0.594-0.625-0.063-0.031-0.094-0.125-0.125-0.188l-0.375-0.469c0-0.031-0.031-0.031-0.031-0.063-1.125-1.594-1.813-3.531-1.813-5.656h-1.969z'%3E%3C/path%3E%3C/svg%3E");
 background-position: center center;
    background-repeat: no-repeat;
}

.buttons .icon-settings {

background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg width='800px' height='800px' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12 8.25C9.92894 8.25 8.25 9.92893 8.25 12C8.25 14.0711 9.92894 15.75 12 15.75C14.0711 15.75 15.75 14.0711 15.75 12C15.75 9.92893 14.0711 8.25 12 8.25ZM9.75 12C9.75 10.7574 10.7574 9.75 12 9.75C13.2426 9.75 14.25 10.7574 14.25 12C14.25 13.2426 13.2426 14.25 12 14.25C10.7574 14.25 9.75 13.2426 9.75 12Z' fill='%23000000'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11.9747 1.25C11.5303 1.24999 11.1592 1.24999 10.8546 1.27077C10.5375 1.29241 10.238 1.33905 9.94761 1.45933C9.27379 1.73844 8.73843 2.27379 8.45932 2.94762C8.31402 3.29842 8.27467 3.66812 8.25964 4.06996C8.24756 4.39299 8.08454 4.66251 7.84395 4.80141C7.60337 4.94031 7.28845 4.94673 7.00266 4.79568C6.64714 4.60777 6.30729 4.45699 5.93083 4.40743C5.20773 4.31223 4.47642 4.50819 3.89779 4.95219C3.64843 5.14353 3.45827 5.3796 3.28099 5.6434C3.11068 5.89681 2.92517 6.21815 2.70294 6.60307L2.67769 6.64681C2.45545 7.03172 2.26993 7.35304 2.13562 7.62723C1.99581 7.91267 1.88644 8.19539 1.84541 8.50701C1.75021 9.23012 1.94617 9.96142 2.39016 10.5401C2.62128 10.8412 2.92173 11.0602 3.26217 11.2741C3.53595 11.4461 3.68788 11.7221 3.68786 12C3.68785 12.2778 3.53592 12.5538 3.26217 12.7258C2.92169 12.9397 2.62121 13.1587 2.39007 13.4599C1.94607 14.0385 1.75012 14.7698 1.84531 15.4929C1.88634 15.8045 1.99571 16.0873 2.13552 16.3727C2.26983 16.6469 2.45535 16.9682 2.67758 17.3531L2.70284 17.3969C2.92507 17.7818 3.11058 18.1031 3.28089 18.3565C3.45817 18.6203 3.64833 18.8564 3.89769 19.0477C4.47632 19.4917 5.20763 19.6877 5.93073 19.5925C6.30717 19.5429 6.647 19.3922 7.0025 19.2043C7.28833 19.0532 7.60329 19.0596 7.8439 19.1986C8.08452 19.3375 8.24756 19.607 8.25964 19.9301C8.27467 20.3319 8.31403 20.7016 8.45932 21.0524C8.73843 21.7262 9.27379 22.2616 9.94761 22.5407C10.238 22.661 10.5375 22.7076 10.8546 22.7292C11.1592 22.75 11.5303 22.75 11.9747 22.75H12.0252C12.4697 22.75 12.8407 22.75 13.1454 22.7292C13.4625 22.7076 13.762 22.661 14.0524 22.5407C14.7262 22.2616 15.2616 21.7262 15.5407 21.0524C15.686 20.7016 15.7253 20.3319 15.7403 19.93C15.7524 19.607 15.9154 19.3375 16.156 19.1985C16.3966 19.0596 16.7116 19.0532 16.9974 19.2042C17.3529 19.3921 17.6927 19.5429 18.0692 19.5924C18.7923 19.6876 19.5236 19.4917 20.1022 19.0477C20.3516 18.8563 20.5417 18.6203 20.719 18.3565C20.8893 18.1031 21.0748 17.7818 21.297 17.3969L21.3223 17.3531C21.5445 16.9682 21.7301 16.6468 21.8644 16.3726C22.0042 16.0872 22.1135 15.8045 22.1546 15.4929C22.2498 14.7697 22.0538 14.0384 21.6098 13.4598C21.3787 13.1586 21.0782 12.9397 20.7378 12.7258C20.464 12.5538 20.3121 12.2778 20.3121 11.9999C20.3121 11.7221 20.464 11.4462 20.7377 11.2742C21.0783 11.0603 21.3788 10.8414 21.6099 10.5401C22.0539 9.96149 22.2499 9.23019 22.1547 8.50708C22.1136 8.19546 22.0043 7.91274 21.8645 7.6273C21.7302 7.35313 21.5447 7.03183 21.3224 6.64695L21.2972 6.60318C21.0749 6.21825 20.8894 5.89688 20.7191 5.64347C20.5418 5.37967 20.3517 5.1436 20.1023 4.95225C19.5237 4.50826 18.7924 4.3123 18.0692 4.4075C17.6928 4.45706 17.353 4.60782 16.9975 4.79572C16.7117 4.94679 16.3967 4.94036 16.1561 4.80144C15.9155 4.66253 15.7524 4.39297 15.7403 4.06991C15.7253 3.66808 15.686 3.2984 15.5407 2.94762C15.2616 2.27379 14.7262 1.73844 14.0524 1.45933C13.762 1.33905 13.4625 1.29241 13.1454 1.27077C12.8407 1.24999 12.4697 1.24999 12.0252 1.25H11.9747ZM10.5216 2.84515C10.5988 2.81319 10.716 2.78372 10.9567 2.76729C11.2042 2.75041 11.5238 2.75 12 2.75C12.4762 2.75 12.7958 2.75041 13.0432 2.76729C13.284 2.78372 13.4012 2.81319 13.4783 2.84515C13.7846 2.97202 14.028 3.21536 14.1548 3.52165C14.1949 3.61826 14.228 3.76887 14.2414 4.12597C14.271 4.91835 14.68 5.68129 15.4061 6.10048C16.1321 6.51968 16.9974 6.4924 17.6984 6.12188C18.0143 5.9549 18.1614 5.90832 18.265 5.89467C18.5937 5.8514 18.9261 5.94047 19.1891 6.14228C19.2554 6.19312 19.3395 6.27989 19.4741 6.48016C19.6125 6.68603 19.7726 6.9626 20.0107 7.375C20.2488 7.78741 20.4083 8.06438 20.5174 8.28713C20.6235 8.50382 20.6566 8.62007 20.6675 8.70287C20.7108 9.03155 20.6217 9.36397 20.4199 9.62698C20.3562 9.70995 20.2424 9.81399 19.9397 10.0041C19.2684 10.426 18.8122 11.1616 18.8121 11.9999C18.8121 12.8383 19.2683 13.574 19.9397 13.9959C20.2423 14.186 20.3561 14.29 20.4198 14.373C20.6216 14.636 20.7107 14.9684 20.6674 15.2971C20.6565 15.3799 20.6234 15.4961 20.5173 15.7128C20.4082 15.9355 20.2487 16.2125 20.0106 16.6249C19.7725 17.0373 19.6124 17.3139 19.474 17.5198C19.3394 17.72 19.2553 17.8068 19.189 17.8576C18.926 18.0595 18.5936 18.1485 18.2649 18.1053C18.1613 18.0916 18.0142 18.045 17.6983 17.8781C16.9973 17.5075 16.132 17.4803 15.4059 17.8995C14.68 18.3187 14.271 19.0816 14.2414 19.874C14.228 20.2311 14.1949 20.3817 14.1548 20.4784C14.028 20.7846 13.7846 21.028 13.4783 21.1549C13.4012 21.1868 13.284 21.2163 13.0432 21.2327C12.7958 21.2496 12.4762 21.25 12 21.25C11.5238 21.25 11.2042 21.2496 10.9567 21.2327C10.716 21.2163 10.5988 21.1868 10.5216 21.1549C10.2154 21.028 9.97201 20.7846 9.84514 20.4784C9.80512 20.3817 9.77195 20.2311 9.75859 19.874C9.72896 19.0817 9.31997 18.3187 8.5939 17.8995C7.86784 17.4803 7.00262 17.5076 6.30158 17.8781C5.98565 18.0451 5.83863 18.0917 5.73495 18.1053C5.40626 18.1486 5.07385 18.0595 4.81084 17.8577C4.74458 17.8069 4.66045 17.7201 4.52586 17.5198C4.38751 17.314 4.22736 17.0374 3.98926 16.625C3.75115 16.2126 3.59171 15.9356 3.4826 15.7129C3.37646 15.4962 3.34338 15.3799 3.33248 15.2971C3.28921 14.9684 3.37828 14.636 3.5801 14.373C3.64376 14.2901 3.75761 14.186 4.0602 13.9959C4.73158 13.5741 5.18782 12.8384 5.18786 12.0001C5.18791 11.1616 4.73165 10.4259 4.06021 10.004C3.75769 9.81389 3.64385 9.70987 3.58019 9.62691C3.37838 9.3639 3.28931 9.03149 3.33258 8.7028C3.34348 8.62001 3.37656 8.50375 3.4827 8.28707C3.59181 8.06431 3.75125 7.78734 3.98935 7.37493C4.22746 6.96253 4.3876 6.68596 4.52596 6.48009C4.66055 6.27983 4.74468 6.19305 4.81093 6.14222C5.07395 5.9404 5.40636 5.85133 5.73504 5.8946C5.83873 5.90825 5.98576 5.95483 6.30173 6.12184C7.00273 6.49235 7.86791 6.51962 8.59394 6.10045C9.31998 5.68128 9.72896 4.91837 9.75859 4.12602C9.77195 3.76889 9.80512 3.61827 9.84514 3.52165C9.97201 3.21536 10.2154 2.97202 10.5216 2.84515Z' fill='%23000000'/%3E%3C/svg%3E");
 background-position: center center;
    background-repeat: no-repeat;


}

.buttons .icon-update {

background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg width='800px' height='800px' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21.2799 6.40005L11.7399 15.94C10.7899 16.89 7.96987 17.33 7.33987 16.7C6.70987 16.07 7.13987 13.25 8.08987 12.3L17.6399 2.75002C17.8754 2.49308 18.1605 2.28654 18.4781 2.14284C18.7956 1.99914 19.139 1.92124 19.4875 1.9139C19.8359 1.90657 20.1823 1.96991 20.5056 2.10012C20.8289 2.23033 21.1225 2.42473 21.3686 2.67153C21.6147 2.91833 21.8083 3.21243 21.9376 3.53609C22.0669 3.85976 22.1294 4.20626 22.1211 4.55471C22.1128 4.90316 22.0339 5.24635 21.8894 5.5635C21.7448 5.88065 21.5375 6.16524 21.2799 6.40005V6.40005Z' stroke='%23000000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M11 4H6C4.93913 4 3.92178 4.42142 3.17163 5.17157C2.42149 5.92172 2 6.93913 2 8V18C2 19.0609 2.42149 20.0783 3.17163 20.8284C3.92178 21.5786 4.93913 22 6 22H17C19.21 22 20 20.2 20 18V13' stroke='%23000000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-position: center center;
    background-repeat: no-repeat;


}
.buttons .icon-track {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --%3E%3Csvg width='800px' height='800px' viewBox='0 0 48 48' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15.5168 11.5352C17.7677 9.27094 20.8193 8 24 8C27.1807 8 30.2323 9.27094 32.4832 11.5352C34.7343 13.7996 36 16.872 36 20.0769C36 25.6035 32.9361 30.6047 29.7435 34.298C28.1592 36.1307 26.5723 37.6075 25.3814 38.6258C24.8154 39.1097 24.3405 39.4887 24 39.7517C23.6595 39.4887 23.1846 39.1097 22.6186 38.6258C21.4277 37.6075 19.8408 36.1307 18.2565 34.298C15.0639 30.6047 12 25.6035 12 20.0769C12 16.872 13.2657 13.7996 15.5168 11.5352ZM23.4236 41.8172C23.424 41.8174 23.4243 41.8176 24 41C24.5757 41.8176 24.576 41.8174 24.5764 41.8172C24.2311 42.0603 23.7689 42.0603 23.4236 41.8172ZM23.4236 41.8172L24 41L24.5764 41.8172L24.58 41.8146L24.5891 41.8082L24.6209 41.7854C24.6482 41.7658 24.6875 41.7374 24.7379 41.7004C24.8387 41.6263 24.9842 41.5178 25.1681 41.3765C25.5357 41.0938 26.0571 40.6794 26.6811 40.1459C27.9277 39.08 29.5908 37.5328 31.2565 35.6059C34.5639 31.7799 38 26.3195 38 20.0769C38 16.3454 36.5264 12.7655 33.9016 10.1251C31.2765 7.48454 27.7149 6 24 6C20.2851 6 16.7235 7.48454 14.0984 10.1251C11.4736 12.7655 10 16.3454 10 20.0769C10 26.3195 13.4361 31.7799 16.7435 35.6059C18.4092 37.5328 20.0723 39.08 21.3189 40.1459C21.9429 40.6794 22.4643 41.0938 22.8319 41.3765C23.0158 41.5178 23.1613 41.6263 23.2621 41.7004C23.3125 41.7374 23.3518 41.7658 23.3791 41.7854L23.4109 41.8082L23.42 41.8146L23.4236 41.8172ZM20 20C20 17.7909 21.7909 16 24 16C26.2091 16 28 17.7909 28 20C28 22.2091 26.2091 24 24 24C21.7909 24 20 22.2091 20 20ZM24 14C20.6863 14 18 16.6863 18 20C18 23.3137 20.6863 26 24 26C27.3137 26 30 23.3137 30 20C30 16.6863 27.3137 14 24 14Z' fill='%23333333'/%3E%3C/svg%3E");
     background-position: center center;
    background-repeat: no-repeat;
}
.buttons .icon-open {
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg fill='%23000000' height='800px' width='800px' version='1.1' id='Icons' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 32 32' xml:space='preserve'%3E%3Cg%3E%3Cpath d='M16,10c1.7,0,3-1.3,3-3s-1.3-3-3-3s-3,1.3-3,3S14.3,10,16,10z'/%3E%3Cpath d='M16,13c-1.7,0-3,1.3-3,3s1.3,3,3,3s3-1.3,3-3S17.7,13,16,13z'/%3E%3Cpath d='M16,22c-1.7,0-3,1.3-3,3s1.3,3,3,3s3-1.3,3-3S17.7,22,16,22z'/%3E%3C/g%3E%3C/svg%3E");
 background-position: center center;
    background-repeat: no-repeat;
}
.buttons .icon-download {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg width='800px' height='800px' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18.22 20.75H5.78C5.43322 20.7359 5.09262 20.6535 4.77771 20.5075C4.4628 20.3616 4.17975 20.155 3.94476 19.8996C3.70977 19.6442 3.52745 19.3449 3.40824 19.019C3.28903 18.693 3.23525 18.3468 3.25 18V15C3.25 14.8011 3.32902 14.6103 3.46967 14.4697C3.61033 14.329 3.80109 14.25 4 14.25C4.19892 14.25 4.38968 14.329 4.53033 14.4697C4.67099 14.6103 4.75 14.8011 4.75 15V18C4.72419 18.2969 4.81365 18.5924 4.99984 18.8251C5.18602 19.0579 5.45465 19.21 5.75 19.25H18.22C18.5154 19.21 18.784 19.0579 18.9702 18.8251C19.1564 18.5924 19.2458 18.2969 19.22 18V15C19.22 14.8011 19.299 14.6103 19.4397 14.4697C19.5803 14.329 19.7711 14.25 19.97 14.25C20.1689 14.25 20.3597 14.329 20.5003 14.4697C20.641 14.6103 20.72 14.8011 20.72 15V18C20.75 18.6954 20.5041 19.3744 20.0359 19.8894C19.5677 20.4045 18.9151 20.7137 18.22 20.75Z' fill='%23000000'/%3E%3Cpath d='M12 15.75C11.9015 15.7504 11.8038 15.7312 11.7128 15.6934C11.6218 15.6557 11.5392 15.6001 11.47 15.53L7.47 11.53C7.33752 11.3878 7.2654 11.1997 7.26882 11.0054C7.27225 10.8111 7.35096 10.6258 7.48838 10.4883C7.62579 10.3509 7.81118 10.2722 8.00548 10.2688C8.19978 10.2654 8.38782 10.3375 8.53 10.47L12 13.94L15.47 10.47C15.6122 10.3375 15.8002 10.2654 15.9945 10.2688C16.1888 10.2722 16.3742 10.3509 16.5116 10.4883C16.649 10.6258 16.7277 10.8111 16.7312 11.0054C16.7346 11.1997 16.6625 11.3878 16.53 11.53L12.53 15.53C12.4608 15.6001 12.3782 15.6557 12.2872 15.6934C12.1962 15.7312 12.0985 15.7504 12 15.75Z' fill='%23000000'/%3E%3Cpath d='M12 15.75C11.8019 15.7474 11.6126 15.6676 11.4725 15.5275C11.3324 15.3874 11.2526 15.1981 11.25 15V4C11.25 3.80109 11.329 3.61032 11.4697 3.46967C11.6103 3.32902 11.8011 3.25 12 3.25C12.1989 3.25 12.3897 3.32902 12.5303 3.46967C12.671 3.61032 12.75 3.80109 12.75 4V15C12.7474 15.1981 12.6676 15.3874 12.5275 15.5275C12.3874 15.6676 12.1981 15.7474 12 15.75Z' fill='%23000000'/%3E%3C/svg%3E");
    background-position: center center;
    background-repeat: no-repeat;
}

.buttons .icon-copy {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg width='800px' height='800px' viewBox='0 -0.5 25 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M17.676 14.248C17.676 15.8651 16.3651 17.176 14.748 17.176H7.428C5.81091 17.176 4.5 15.8651 4.5 14.248V6.928C4.5 5.31091 5.81091 4 7.428 4H14.748C16.3651 4 17.676 5.31091 17.676 6.928V14.248Z' stroke='%23000000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M10.252 20H17.572C19.1891 20 20.5 18.689 20.5 17.072V9.75195' stroke='%23000000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-position: center center;
    background-repeat: no-repeat;
}

.buttons .icon-barcode {
    background-image: url("data:image/svg+xml,<svg data-tid=\"Icon__root\" width=\"16\" height=\"16\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 16\" aria-hidden=\"true\" style=\"fill: currentcolor; margin-bottom: 0px; flex-shrink: 0; outline: none;\"><path d=\"M7.5 1a.5.5 0 0 1 .5.5v8.373c.056-.032.109-.07.159-.114l3.012-2.635a.5.5 0 1 1 .658.752l-3.012 2.636a2 2 0 0 1-2.634 0L3.171 7.876a.5.5 0 1 1 .658-.752l3.013 2.635c.05.044.102.082.158.114V1.5a.5.5 0 0 1 .5-.5Z\"></path><path d=\"M1 13.5a.5.5 0 0 1 .5-.5h12a.5.5 0 0 1 0 1h-12a.5.5 0 0 1-.5-.5Z\"></path></svg>");
    background-position: center center;
    background-repeat: no-repeat;
}

.buttons .icon-syncmanual {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --%3E%3Csvg width='800px' height='800px' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.3935 5.37371C18.0253 6.70569 19.8979 10.7522 18.5761 14.4118C17.6363 17.0135 15.335 18.7193 12.778 19.0094M12.778 19.0094L13.8253 17.2553M12.778 19.0094L14.4889 20M9.60651 18.6263C5.97465 17.2943 4.10205 13.2478 5.42394 9.58823C6.36371 6.98651 8.66504 5.28075 11.222 4.99059M11.222 4.99059L10.1747 6.74471M11.222 4.99059L9.51114 4' stroke='%23464455' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-position: center center;
    background-repeat: no-repeat;
}

.buttons .icon-review-change-status {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --%3E%3Csvg width='30px' height='30px' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21.2799 6.40005L11.7399 15.94C10.7899 16.89 7.96987 17.33 7.33987 16.7C6.70987 16.07 7.13987 13.25 8.08987 12.3L17.6399 2.75002C17.8754 2.49308 18.1605 2.28654 18.4781 2.14284C18.7956 1.99914 19.139 1.92124 19.4875 1.9139C19.8359 1.90657 20.1823 1.96991 20.5056 2.10012C20.8289 2.23033 21.1225 2.42473 21.3686 2.67153C21.6147 2.91833 21.8083 3.21243 21.9376 3.53609C22.0669 3.85976 22.1294 4.20626 22.1211 4.55471C22.1128 4.90316 22.0339 5.24635 21.8894 5.5635C21.7448 5.88065 21.5375 6.16524 21.2799 6.40005V6.40005Z' stroke='%23000000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M11 4H6C4.93913 4 3.92178 4.42142 3.17163 5.17157C2.42149 5.92172 2 6.93913 2 8V18C2 19.0609 2.42149 20.0783 3.17163 20.8284C3.92178 21.5786 4.93913 22 6 22H17C19.21 22 20 20.2 20 18V13' stroke='%23000000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-position: center center;
    background-repeat: no-repeat;
}

.buttons .icon-question-change-status {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --%3E%3Csvg width='30px' height='30px' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21.2799 6.40005L11.7399 15.94C10.7899 16.89 7.96987 17.33 7.33987 16.7C6.70987 16.07 7.13987 13.25 8.08987 12.3L17.6399 2.75002C17.8754 2.49308 18.1605 2.28654 18.4781 2.14284C18.7956 1.99914 19.139 1.92124 19.4875 1.9139C19.8359 1.90657 20.1823 1.96991 20.5056 2.10012C20.8289 2.23033 21.1225 2.42473 21.3686 2.67153C21.6147 2.91833 21.8083 3.21243 21.9376 3.53609C22.0669 3.85976 22.1294 4.20626 22.1211 4.55471C22.1128 4.90316 22.0339 5.24635 21.8894 5.5635C21.7448 5.88065 21.5375 6.16524 21.2799 6.40005V6.40005Z' stroke='%23000000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M11 4H6C4.93913 4 3.92178 4.42142 3.17163 5.17157C2.42149 5.92172 2 6.93913 2 8V18C2 19.0609 2.42149 20.0783 3.17163 20.8284C3.92178 21.5786 4.93913 22 6 22H17C19.21 22 20 20.2 20 18V13' stroke='%23000000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-position: center center;
    background-repeat: no-repeat;
}

.buttons .icon-review-comment {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --%3E%3Csvg width='30px' height='30px' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 13.5997 2.37562 15.1116 3.04346 16.4525C3.22094 16.8088 3.28001 17.2161 3.17712 17.6006L2.58151 19.8267C2.32295 20.793 3.20701 21.677 4.17335 21.4185L6.39939 20.8229C6.78393 20.72 7.19121 20.7791 7.54753 20.9565C8.88837 21.6244 10.4003 22 12 22Z' stroke='%23000000' stroke-width='1.5'/%3E%3Cpath d='M8 10.5H16' stroke='%23000000' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M8 14H13.5' stroke='%23000000' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
    background-position: center center;
    background-repeat: no-repeat;
}

.buttons .icon-question-answer {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --%3E%3Csvg width='30px' height='30px' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 13.5997 2.37562 15.1116 3.04346 16.4525C3.22094 16.8088 3.28001 17.2161 3.17712 17.6006L2.58151 19.8267C2.32295 20.793 3.20701 21.677 4.17335 21.4185L6.39939 20.8229C6.78393 20.72 7.19121 20.7791 7.54753 20.9565C8.88837 21.6244 10.4003 22 12 22Z' stroke='%23000000' stroke-width='1.5'/%3E%3Cpath d='M8 10.5H16' stroke='%23000000' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M8 14H13.5' stroke='%23000000' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
    background-position: center center;
    background-repeat: no-repeat;
}



.action-body {

    width: auto;
    overflow: hidden !important;
    overscroll-behavior-y: none;
    margin-right: var(--fancybox-scrollbar-compensate, 0);

}

.action-carousel {
        position: relative;
    box-sizing: border-box;
    flex: 1;
    min-height: 0px;
    z-index: 10;
    overflow-y: overlay;
    overflow-x: clip;
    width: 100%;

}
.action-box {

    
         
      
        position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
        background: rgb(0 0 0 / 85%);
        box-sizing: border-box;

        box-sizing: border-box;
    display: flex;
    flex-direction: column;

  
  justify-content: center; /* Center items along the main axis (vertical) */
  align-items: center; /* Center items along the cross axis (horizontal) */
  min-height: 100vh; /* Ensure container takes full viewport height */
z-index: 10001;
    }

    .save-block { display: flex; align-items: center;
    grid-gap: var(--grid-gap);
    vertical-align: middle; }

    .save-block div { width: auto }
.action-box h1 { font-size: 24px; }
        .action-box .action-container { margin: calc(4*var(--grid-gap)); padding: calc(var(--grid-gap)*2); 
        border-radius: var(--grid-gap); background:#fff; position: relative;

        align-self: center;
    display: flex;
    flex-direction: column;     margin-left: auto;
    margin-right: auto;}
 
        .action-box .action-close { position: absolute; top:  var(--grid-gap); right: var(--grid-gap);  width: 32px;
    background: url(/assets/img/cross.svg) center center;
    background-size: 32px 32px;
    background-repeat: no-repeat;
    opacity: 0.2; height: 32px; cursor: pointer; background-color: #fff; border-radius: 50%}

    .action-box .action-close:hover { opacity: 0.5; background-color: #eee }

    .action-box-medium { max-width: 600px;  }

    .action-box-small { max-width: 400px;  }
.action-box-widget {

    max-width: 300px;
    font-size: 13px;
p {color: #000; font-size: 13px;}
    h1 { font-size: 16px; }


button {
    padding: calc(var(--grid-gap) / 2) calc(var(--grid-gap) * 1);
    
    font-size: 10px;
     
}
}


.table-loading { opacity: 0.4 }

.table-wrapper { width: 100%; max-width: 100%;
    overflow-x: auto; }
.table-wrapper   .table {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    position: relative;
}
.check-row .cell { cursor: pointer; }
.check-row:hover .cell { background: #fafafa !important}

.table-wrapper .cell div.child { padding: 4px 0 }
.table-wrapper .cell div.child:first-child { padding-top: 0; }
.table-wrapper .cell div.child:last-child { padding-bottom: 0; }
.table-wrapper  .table .row .cell:first-child {
        position: sticky;
        left: 0;
        background: #fff;
        z-index: 99;
    }
/* .table-wrapper  .table .row .cell:last-child { */
    .table-wrapper  .table .row .last-cell {
        position: sticky;
        right: 0;
        background: #fff;
        border-left: 1px solid #eee;
        padding-right: 8px;
    }


.nowrap { white-space: nowrap; }

/*.table-wrapper   .table .row { display: flex;  grid-gap: calc(var(--grid-gap));
    align-items: center; } */


.table-wrapper {
.row { display: table-row; }
    .cell { padding: 16px 8px;
        font-size: 12px; }

    .cell { border-bottom: 1px solid #eee }

    .row:last-child .cell { border-bottom: none }

    .row:last-child .cell {
    padding-bottom: 8px;
}

.cell .row-part { margin-bottom: 4px; }
.cell .row-part:last-child { margin-bottom: 0; }

    .string2 { color: #999; font-size: 11px; }
.black { color: #000;  }

    .product .string2 {
        color: #999;
        font-size: 11px;
        display: inline-block;
        max-width: 300px;
        min-width: 200px;
        white-space: pre-line;
    }

    .product { margin-bottom: 8px; }

    .cell .product:last-child { margin-bottom: 0 }

    .row.heading .cell {
        background: #fafafa !important;
        color: #999 !important;
        white-space: nowrap;
    }

 

}






.amount-examples {  margin: var(--grid-gap) 0 }

.amount-examples span { display: inline-block; margin-right: 8px  }
.amount-examples span a { background: #eee; padding: 4px 8px; font-size: 12px; color: #000; border-radius: 4px; }

.payment-methods .payment-group { margin-bottom: var(--grid-gap) }

.payment-methods .payment-group .group-name { font-weight: bold; display:  block; margin-bottom: calc(var(--grid-gap)/2) }

.payment-methods .payment-group .payment-provider {   }
.payment-provider { cursor:pointer; }
.payment-provider:hover .provider-icon { background: rgb(211 227 253 / 38%) }

span.provider-description {
    color: #999;
    font-size: 14px;
    display: block;
    margin-bottom: calc(var(--grid-gap) / 2);
}
.tokens-list .table .row .cell:first-child { width: 40% }
.events-reviews-block {

   background: #fff;
    margin: 0 0 calc(var(--grid-gap) * 2) 0;
    /* border: 1px solid #000; */
    border-radius: 4px;
    cursor: pointer;
    padding: calc(2 * var(--grid-gap));
    background: linear-gradient(148deg, rgb(255 176 0 / 10%), rgb(247 35 235 / 10%));
    position: relative;

}
.events-reviews-block p {   font-size:16px; }
.events-reviews-block a.button {
    background: #fff;
    color: var(--color-background-button-hover);
}
.events-reviews-block h4 {

        margin-top: 0; 
    font-size: 20px;
    margin-bottom: 20px;
}
.events-reviews-block .reviews-on {
    color: var(--color-success);
    font-size: 14px;

    background: var(--color-success);
    font-size: 14px;
    display: inline;
    color: #fff;
    padding: 4px calc(2 * var(--grid-gap));;
    /* font-size: 10px; */
    border-radius: calc(2 * var(--grid-gap));
    /* font-weight: bold; */
    /* text-transform: uppercase; */
    position: absolute;
    top: calc(2 * var(--grid-gap));
    right: calc(2 * var(--grid-gap));
    color: #000;
 }
.events-reviews-block p:last-child { margin-bottom: 0 }


.payment-providers { display: flex;
    align-items: center;
    gap: var(--grid-gap); flex-wrap: wrap;}
.payment-providers  .provider-icon {     width: 180px;
    height: 50px;
    text-align: center;
    padding: calc(var(--grid-gap) / 2);
     box-shadow: 0 1px 10px 0 rgba(196, 208, 227, .7);
    border-radius: 8px;
    display: table-cell;
    vertical-align: middle; position:relative; }

    .provider-icon.loading {
        opacity: 0.3;
    }

    .payment-provider .loading span {
  visibility: hidden;
  opacity: 0;
}

.payment-provider .loading::after {
  content: "";
  position: absolute;
  width: 16px;
  height: 16px;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  border: 4px solid transparent;
  border-top-color: var(--color-link);
  border-radius: 50%;
  animation: button-loading-spinner 1s ease infinite;
}


   .payment-providers  .provider-icon img { max-height: 30px;
    max-width: 150px;}
 .payment-providers  .provider-icon { position:relative; }

.payment-providers  .provider-icon .exp {position: absolute;
    left: 8px;
    bottom: 8px;
    /* font-weight: bold; */
    font-size: 11px;
    color: #666;}
.contragent-form h4 { font-size: 14px; margin-top: 0; margin-bottom: calc(var(--grid-gap)/2) }
.contragent-form .table { width: 100% }

input:read-only, textarea:read-only { background: #eee }

.access-who {
    font-size: 12px;
    background: var(--color-highlight);
    padding: 4px;
    border-radius: 4px;
    color: #666;
    display: inline-block;
    margin-left: 8px;
}


.access-row { margin-bottom: calc(var(--grid-gap)); padding: var(--grid-gap);
    /* border: 1px solid #eee; */
    border-radius: 4px;
    box-shadow: 0 1px 10px 0 rgba(196, 208, 227, .7);justify-content: flex-end;     align-items: start;}
.access-row div:first-child { margin-right: auto;  }
    
.access-row span  {   }
.access-row small {  font-size: 11px; color: #ccc; margin-bottom: 4px; }


.access-row div:last-child { width: 50px; }

.access-row div:nth-last-child(2) { width: 200px; }
 

.access-name { display: block;  margin-bottom: 4px;   }
.access-phone { display: block;  margin-bottom: 4px;font-size: 13px; color: #999 }
.access-email { display: block; margin-bottom: 4px; font-size: 13px; color: #999}

.user-role-name { display: inline-block; margin-bottom: 4px; }
.access-scopes { display: block; margin-bottom: 4px; }

.messenger-connection div  {  white-space: nowrap; }
.messenger-connection small { display: block; font-size: 11px; color: #ccc; margin-bottom: 4px; }
.messenger-state-authorized, .messenger-state-starting {padding: 4px 16px;  border-radius: 4px; font-size: 10px;  text-transform: uppercase; color: #fff; background:  var(--color-success) }

.messenger-state-notauthorized, .messenger-state-blocked { padding: 4px 16px;  border-radius: 4px; font-size: 10px;  text-transform: uppercase; color: #fff; background: var(--color-error) }

.qr-field {width: 256px;
    height: 256px;
    background: #eee;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    margin-bottom: var(--grid-gap);
}


.telegram-status-active {padding: 4px 16px;  border-radius: 4px; font-size: 10px;  text-transform: uppercase;  color: #fff; background:  var(--color-success) }

.telegram-status-inactive, .telegram-status-stopped { padding: 4px 16px;  border-radius: 4px; font-size: 10px; text-transform: uppercase; color: #fff; background: var(--color-error) }

.substr250 {

    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    max-width: 300px;
    
    text-overflow: ellipsis;

}


.invite-link {

    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    max-width: 250px;
    font-size: 14px;
    text-overflow: ellipsis;

}


.payment-providers  .provider-icon .contragent-name {

    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    max-width: 150px;
    font-size: 14px;
    text-overflow: ellipsis;

}

.payment-providers  .provider-icon .contragent-inn {
    color: #999;
    display: block;
    font-size: 12px;
}

.payment-providers  .provider-icon .bank-name {
    color: #999;
    display: block;
    font-size: 12px;
}
   .provider-description { position: relative; display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    max-width: 180px;
    font-size: 14px;
    text-overflow: ellipsis;}
    .provider-description .icon-delete { position: absolute;  top: 2px;  right: 0;  height: 12px;
    width: 12px;
    opacity: 0.1;
    background-size: 12px 12px; }

.provider-description .icon-delete:hover { opacity: 0.6 }
.messenger-connection {
    padding: var(--grid-gap);
    /* border: 1px solid #eee; */
    border-radius: 4px;
    box-shadow: 0 1px 10px 0 rgba(196, 208, 227, .7);
    margin-bottom: var(--grid-gap);
}
.delivery-tokens {   max-width: 800px; }
.token-settings { 

       padding: calc(var(--grid-gap)* 2);
    /* border-bottom: 1px solid #eee; */
   
    margin: 0 0 calc(var(--grid-gap)* 2) 0;
    /* border: 1px solid #ccc; */
    border-radius: calc(var(--grid-gap)/ 2);
    background: linear-gradient(148deg, rgb(255 176 0 / 10%), rgb(247 35 235 / 10%));
}

.table .icon-delete { margin-left: var(--grid-gap); }
.table .cell h3 {
    font-weight: bold;
    font-size: 15px;
    margin-bottom: calc(var(--grid-gap)/2);
}
.table .cell p {
    font-size: 15px;
    margin: calc(var(--grid-gap)/2) 0;
    color: #666;
}

.table .cell li {
    font-size: 15px;
    margin: calc(var(--grid-gap)/2) 0;
    color: #666;
    margin-left: -20px;
}

ol li { 
    margin: calc(var(--grid-gap)/2) 0;
    
    margin-left: -20px;}

.table.schedule .cell {  vertical-align: middle; padding: 0 calc(var(--grid-gap) / 2) calc(var(--grid-gap) / 2) 0; }
.color-black { color: #000 !important }

.senders-list {     align-items: flex-start !important }
.senders-list .country { margin-bottom:  calc(var(--grid-gap)*2) }
.senders-list p b { color: #000 !important }  
.senders-list .icon-flag { width: 18px; height: 18px; display: inline-block;  margin-bottom: -2px; }
.senders-list .operator { padding-left: calc(var(--grid-gap)); margin-bottom: calc(var(--grid-gap)/2); font-size: 12px; }

.senders-list .operator-status-waiting { color: #ccc }
.senders-list .operator-status-verified { color: var(--color-success) }
.senders-list .operator-status-stopped, .senders-list .operator-status-rejected, .senders-list .operator-status-stopped_temp, .senders-list .operator-status-double, .senders-list .operator-status-need_docs { color: var(--color-error) }

.dns-records.table .row:first-child .cell { font-weight: bold; }

.dns-records.table .cell {      padding: 0 calc(var(--grid-gap)/2) calc(var(--grid-gap)/2) 0;max-width: 250px;     overflow-wrap: break-word; }

.record .record-statuses .success {color: var(--color-success)}
.record .record-statuses .error {color: var(--color-warn)}


.record { margin-bottom: calc(var(--grid-gap));
    position: relative;
    font-size: 14px;  
    border: 2px solid #eee;
    border-radius: 4px;
    padding: calc(var(--grid-gap) / 2);}

    .record div:first-child { position: absolute;
    top: 4px;
    right: 4px;
    background: #eee;
    padding: 2px 8px;
    font-size: 12px;
    border-radius: 4px; }

.record .record-value {max-width: 350px;     overflow-wrap: break-word;}

.record span.what { color: #999 }

.email-domains {     
    background: var(--color-highlight);

        padding: calc(var(--grid-gap) * 2);
    /* border-bottom: 1px solid #eee; */
    margin: calc(var(--grid-gap)) 0;
    /* border: 1px solid #ccc; */
    border-radius: 4px;

      }
.settings-section h3 {
    font-weight: bold;
    font-size: 15px;
    margin-bottom: calc(var(--grid-gap)/2);
}

.settings-section h4 {
    font-weight: bold;
    font-size: 15px;
    margin-top: 0;
    margin-bottom: calc(var(--grid-gap)/2);
}
.settings-section p {
    font-size: 15px;
    margin: calc(var(--grid-gap)/2) 0;
    color: #999;
}

.settings-section div.section-option { margin-bottom: calc(var(--grid-gap)/2) }

.settings-section span.description { color: #666; font-size: 14px; }

.settings-section .shop-logo { margin: calc(var(--grid-gap)/2) 0; padding:  calc(var(--grid-gap)/2) }
.settings-section .shop-logo img { max-width: 200px:  }
.settings-section .shop-logo label {display: block;
    font-size: 14px;
    margin-top: calc(var(--grid-gap));
    color: #999;}

.settings-section input, .settings-section select { max-width: 300px; } 

.settings-section { margin-bottom: calc(var(--grid-gap)*2) }

.field-out-block { margin: calc(var(--grid-gap)) 0; margin: calc(var(--grid-gap)) 0;
    padding: calc(var(--grid-gap));
    border: 2px solid #eee;
    border-radius: 4px;
    position: relative;
} 

.field-out-block .icon-delete { position: absolute; top:calc(var(--grid-gap)/1); right: calc(var(--grid-gap)/1)  }
.field-out-block div { padding:  calc(var(--grid-gap)/2) 0}
.field-out-block  input, .field-out-block  textarea, .field-out-block  select { width: 100%; max-width: 100%}


h1 span.center { text-align: center; display:block; }
label { cursor: pointer; }
.autopayment { max-width: 800px }
.autopayment .cell { width: 50%; }

.autoinvoice { max-width: 800px }
.autoinvoice .cell { width: 50%; }


.autoinvoice .contragents-list div.flex { padding: calc(var(--grid-gap));
    border: 1px solid #eee;
    border-radius: 4px;
    margin-bottom: calc(var(--grid-gap) / 2); align-items: flex-start; justify-content: left;}

 

    .autoinvoice .contragents-list div span.bank {color: #ccc; font-size: 12px}




.autopayment .cards-list div { padding: calc(var(--grid-gap));
    border: 1px solid #eee;
    border-radius: 4px;
    margin-bottom: calc(var(--grid-gap) / 2);  }




.autopayment .cards-list div img { height: 12px; width: auto; display: inline-block; margin-right: calc(var(--grid-gap)/2) }
.autopayment .cards-list .exp { font-size: 12px; color: #ccc }
.autopayment .cards-list .is_expired-1 { color: var(--color-error) }

.fields_list .icon-delete {  float: right }

.autopayment .cards-list .icon-delete {  height: 12px;
    width: 12px;
    opacity: 0.1;
    background-size: 12px 12px; }

.autopayment .cards-list .icon-delete:hover { opacity: 0.6 }

.fail-icon-big {

    text-transform: uppercase;

    box-sizing: border-box;
    display: block;
    height: 128px;
    width: 128px;
    background: url(/assets/img/fail.svg) center center;
    background-size: 128px 128px;
    background-repeat: no-repeat;
    margin: 0 auto var(--grid-gap) auto;
     
}

.success-icon-big {

    text-transform: uppercase;

    box-sizing: border-box;
    display: block;
    height: 128px;
    width: 128px;
    background: url(/assets/img/success.svg) center center;
    background-size: 128px 128px;
    background-repeat: no-repeat;
    margin: 0 auto var(--grid-gap) auto;
     
}
.event .event-menu-icon {

    text-transform: uppercase;
    font-weight: 600;
    font-size: 12px;
    background: #eee;
    padding: 4px 16px;
    border-radius: 4px;
    box-sizing: border-box;
    display: inline-block;
    height: 16px;
    width: 16px;
    background: url(/assets/img/menu.svg) center center;
    background-size: 16px 16px;
    background-repeat: no-repeat;
    
    vertical-align: middle;
}

.event .event-id { color: #999 }


.events_timeline { border-left: 2px solid #eee; margin-left: calc(var(--grid-gap)/2)} 



.events-filters { margin-bottom: calc(var(--grid-gap));  }
.events-filters div {    margin-bottom: calc(var(--grid-gap)/1); }
.events-filters div label { display: inline-block; border-radius: 4px; padding: 4px 8px; padding: 4px 8px;
  
    border: 1px solid #eee;  }
.events-filters  .filter { display: flex; gap: calc(var(--grid-gap)/2); align-items: center;}
   
    .events-filters div span:first-child { padding: 0; border: 0 }

.event_type { max-width: 80%; padding-left: calc(var(--grid-gap)*2); position: relative}

.event_type .event-badge-icon {width: 24px;
    height: 24px;
    position: absolute;
    left: -15px;
    top: 0;
    border: 2px solid #fff;
    border-radius: 50%; }

.event_type h2 { display: inline; font-size: 18px; margin: 0 0 var(--grid-gap) 0; }

 
.event_type .event, .event_type .event-one-step { 

   
    padding: calc(2 * var(--grid-gap));
    
    background: #fafafa;
    margin: 0 0 calc(2 * var(--grid-gap)) 0;
    
    border-radius: 4px;
    cursor: pointer;
}



    .event_type .event-status-inactive { opacity: 0.2 }

    .event_type .event-delivery-all { background: rgb(227, 235, 255, 40%); }

    .event_type .event:hover { opacity: 1 }

    .event_type .event div:last-child { margin-bottom: 0 }

.event_type  p.description { color: #999; margin: calc(var(--grid-gap)/2) 0 var(--grid-gap) 0;}
.event_type .event .options .params { color: #999  }
.event-badge { text-transform: uppercase;
    font-weight: 600;
    font-size: 10px; 
     background: #eee;   padding: 4px 16px;
    border-radius: 4px;
    box-sizing: border-box;
    white-space: nowrap;
        display: inline-block;
}

.message-badge { text-transform: uppercase;
    font-weight: 600;
    font-size: 10px; 
     background: #eee;   padding: 4px 16px;
    border-radius: 4px;
    box-sizing: border-box;
    white-space: nowrap;
}

.event_type .event_new { display: flex;
    gap: calc(var(--grid-gap) / 2);
    align-items: center;
    margin: calc(2 * var(--grid-gap)) 0;
     }
.event_type .event_new a { font-weight: 600;
    /* font-size: 12px; */
    white-space: nowrap;
    padding: 4px 16px;
    border-radius: 4px;
    box-sizing: border-box;
    font-size: 14px;
    color: #666;
    box-shadow: 0 1px 10px 0 rgba(196, 208, 227, .7);
      }
.webhooks-out-form .settings-section input, .webhooks-out-form .settings-section select  { max-width: 100%; width: 100% }
.webhooks-list { max-width: 800px; }
.webhooks-list .table { width:100% }
.webhooks-list .cell { padding-top: calc(var(--grid-gap)*1);  padding-bottom: calc(var(--grid-gap)*1);}
.webhook-url { display: block; max-width: 600px; white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis; margin-bottom: 10px;     color: #666;
    font-weight: 300;  }
.webhook-status, .webhook-format, .webhook-shops, .webhook-deliveries {
 
    background: #eee;
    color: #000;
 
 
    font-size: 12px;
 
    text-transform: uppercase;
    font-weight: 600;
    font-size: 12px;
    /* background: #eee; */
    padding: 4px 16px;
    border-radius: 8px;
    box-sizing: border-box;


}



.webhook-status.active { background: var(--color-success); color: #000}

.webhook-status.stopped { background: #ffaaaa }
.webhook-status.deleted { background: #fafafa;
    color: #999; }
.webhook-status.inactive { background: #fafafa;
    color: #999; }
.message-badge-clicked { background: #6b4aff;     color: #fff; }
.message-badge-finished, .message-badge-delivered { background: #f0ffc6; color: #6c9300 }
 
 
.message-badge-canceled { background: #eee; color: #666 }
.message-badge-undelivered { background: #ffaaaa; color: #e24242 }

.message-badge-error, .message-badge-failed, .message-badge-error, .message-badge-bounced, .message-badge-dropped, .message-badge-spam { background: #ffaaaa; color: #e24242 }
 

.message-badge-opened, .message-badge-read  { background: #a3b5fc;
    color: #4a81f2; }
 

.message-badge-processing, .message-badge-sent, .message-badge-calling { background: #f3e2b4;
    color: #8b5600; }
.message-badge-new { background: #ffffff;
    color: #bdbdbd;
    border: 1px solid #eee; }

.dots-events {
display: flex;
     align-items: center;
gap: calc(var(--grid-gap)/4); 
margin-bottom: 4px;

}

.cell .dots-events:last-child { margin-bottom: 0 }

.dots-events div:first-child {         color: #999;
        font-size: 11px;
        min-width: 42px;
}
 

.dot-event { width: 10px;
    height: 6px;
    background: #eee;
    border-radius: 4px;
    display: inline-block;
    /*border: 4px solid #eee; */
    box-sizing: content-box; }
/*
    .dot-type-telegram { background: #24A1DE }
    .dot-type-whatsapp { background: #00a884 }
    .dot-type-sms { background: #fd4582 }
    .dot-type-call { background: #ffdc85  }
    .dot-type-email { background: #cdedff  }
*/

    .dot-status-delivered {background: var(--color-success) !important}
    .dot-status-finished {background: var(--color-success) !important }
    .dot-status-opened, .dot-status-read  { background: #4a81f2  !important}
     
    .dot-status-clicked {background: #6b4aff  !important}
    .dot-status-canceled {background: #eee  !important}
    .dot-status-undelivered {background: #e24242  !important}

 .dot-status-failed,  .dot-status-error,  .dot-status-bounced,,  .dot-status-dropped,  .dot-status-spam { background: #e24242  !important }

 

   
 
 
 
 

 
 .operation_type {
    text-transform: uppercase;
    font-weight: 600;
    font-size: 10px;
    background: rgb(238, 238, 238);
    padding: 4px 16px;
    border-radius: 4px;
    box-sizing: border-box;
    white-space: nowrap;
    display: inline-block;
}
 .invoice_status {
    text-transform: uppercase;
    font-weight: 600;
    font-size: 10px;
    background: rgb(238, 238, 238);
    padding: 4px 16px;
    border-radius: 4px;
    box-sizing: border-box;
    white-space: nowrap;
    display: inline-block;
}
.invoice_status-new {  background: rgb(189, 239, 255);    color: rgb(47, 199, 247); }
.invoice_status-payed { background: #f0ffc6; color: #6c9300 }
 
.invoice_status-refunded { background: #ffaaaa;    color: #e24242; }
.invoice_status-error { background: #ffaaaa; color: #e24242}

.event-badge-review { background: #f5beff;
    color: #b106d7; }

.event-badge-new { background: #ffffff;
    color: #bdbdbd;
    border: 1px solid #eee; }
.event-badge-icon-new { background: #ffffff; color: #bdbdbd }


.event-badge-created { background: #eaf2fc; color: #3b5179 }
.event-badge-icon-created { background: #eaf2fc; color: #3b5179 }

.event-badge-accepted { background: #bdefff; color: #2fc7f7 }
.event-badge-icon-accepted { background: #bdefff; color: #2fc7f7 }

.event-badge-sent { background: #bdefff; color: #2fc7f7  }
.event-badge-icon-sent { background: #bdefff; color: #2fc7f7  }

.event-badge-intermediate { background: #bdefff; color: #2fc7f7  }
.event-badge-icon-intermediate { background: #bdefff; color: #2fc7f7  }

.event-badge-redirected { background: #bdefff; color: #2fc7f7  }
.event-badge-icon-redirected { background: #bdefff; color: #2fc7f7  }

.event-badge-city { background: #bdefff; color: #2fc7f7 }
.event-badge-icon-city { background: #bdefff; color: #2fc7f7 }

.event-badge-ready { background: #f3e2b4; color: #8b5600; background: linear-gradient(142deg,  rgb(243 226 180 / 27%),  rgb(243 226 180));  }
.event-badge-icon-ready { background: #f3e2b4; color: #8b5600 }

.event-badge-ready_door { background: #f3e2b4; color: #8b5600; background: linear-gradient(142deg,  rgb(243 226 180 / 27%),  rgb(243 226 180));  }
.event-badge-icon-ready_door { background: #f3e2b4; color: #8b5600 }

.event-badge-ready_postamat { background: #f3e2b4; color: #8b5600; background: linear-gradient(142deg,  rgb(243 226 180 / 27%),  rgb(243 226 180));  }
.event-badge-icon-ready_postamat { background: #f3e2b4; color: #8b5600 }

 


.event-badge-notification { background: #f3e2b4; color: #ff8248; background: linear-gradient(142deg,  rgb(243 226 180 / 27%),  rgb(243 226 180));  }
.event-badge-icon-notification { background: #f3e2b4; color: #ff8248 }

.event-badge-notification_door { background: #f3e2b4; color: #ff8248;  background: linear-gradient(142deg,  rgb(243 226 180 / 27%),  rgb(243 226 180)); }
.event-badge-icon-notification_door { background: #f3e2b4; color: #ff8248 }

.event-badge-notification_postamat { background: #f3e2b4; color: #ff8248;  background: linear-gradient(142deg,  rgb(243 226 180 / 27%),  rgb(243 226 180)); }
.event-badge-icon-notification_postamat { background: #f3e2b4; color: #ff8248 }

.event-badge-active { background: #f0ffc6; color: #6c9300; } 
.event-badge-stopped  {  background: #ffaaaa; color: #e24242; }
.event-badge-inactive { background: #eee; color: #666 }
.event-badge-drafted{ background: #f3e2b4; color: #8b5600;   }

.event-badge-delivered { background: #f0ffc6; color: #6c9300; background: linear-gradient(142deg,  rgb(240 255 198/ 27%),  rgb(240 255 198)); } 
.event-badge-icon-delivered { background: #f0ffc6; color: #6c9300 }


.event-badge-payed { background: #f0ffc6; color: #6c9300 }
.event-badge-icon-payed { background: #f0ffc6; color: #6c9300 }

.event-badge-problem { background: #ffaaaa;    color: #e24242;  background: linear-gradient(142deg, rgb(255 170 170 / 27%), #ffaaaa);}
.event-badge-icon-problem { background: #ffaaaa;    color: #e24242; }


.event-badge-not_delivered { background: #ffaaaa; color: #e24242; background: linear-gradient(142deg, rgb(255 170 170 / 27%), #ffaaaa); }
.event-badge-icon-not_delivered { background: #ffaaaa; color: #e24242 }

.event-badge-sent_to_sender { background: #ffaaaa; color: #e24242; background: linear-gradient(142deg, rgb(255 170 170 / 27%), #ffaaaa); }
.event-badge-icon-sent_to_sender { background: #ffaaaa; color: #e24242 }


.event-badge-ready_for_sender { background: #ffaaaa; color: #e24242; background: linear-gradient(142deg, rgb(255 170 170 / 27%), #ffaaaa); }
.event-badge-icon-ready_for_sender { background: #ffaaaa; color: #e24242 }


.event-badge-notification_to_sender { background: #ffaaaa; color: #e24242; background: linear-gradient(142deg, rgb(255 170 170 / 27%), #ffaaaa); }
.event-badge-icon-notification_to_sender { background: #ffaaaa; color: #e24242 }


.event-badge-delivered_to_sender { background: #ffaaaa; color: #e24242; background: linear-gradient(142deg, rgb(255 170 170 / 27%), #ffaaaa); }
.event-badge-icon-delivered_to_sender { background: #ffaaaa; color: #e24242 }

.event-badge-not_delivered_to_sender { background: #ffaaaa; color: #e24242; background: linear-gradient(142deg, rgb(255 170 170 / 27%), #ffaaaa); }
.event-badge-icon-not_delivered_to_sender { background: #ffaaaa; color: #e24242 }


.event-badge-canceled { background: #eee; color: #666 }
.event-badge-icon-canceled { background: #eee; color: #e24242 }

.event-badge-payment_accepted { background: #000; color: #2fc7f7 }
.event-badge-icon-payment_accepted { background: #000; color: #2fc7f7 }


.event-badge-payment_problem { background: #000; color: #e24242 }
.event-badge-icon-payment_problem { background: #000; color: #e24242 }

.event-badge-payment_payed { background: #000; color: #bbff00 }
.event-badge-icon-payment_payed { background: #000; color: #bbff00 }

.crm-sendings .events_timeline { border: none; margin-left: 0; }

.crm-sendings .events_timeline .event_type .event-badge-icon{ display: none }
.crm-sendings .events_timeline .event_type { max-width: 100%; padding-left: 0; padding-bottom: calc(var(--grid-gap)*2) }

.review-settings-good-texts { padding: calc(var(--grid-gap)*2); background: rgb(176 216 65 / 20%); border-radius: var(--grid-gap); margin-bottom: calc(2*var(--grid-gap)) }

.review-settings-bad-texts { padding: calc(var(--grid-gap)*2); background: rgb(204 0 0 / 5%); border-radius: var(--grid-gap); margin-bottom: calc(2*var(--grid-gap)) }

.review-settings-texts { padding: calc(var(--grid-gap)*2); background: rgb(211 227 253 / 38%); border-radius: var(--grid-gap); margin-bottom: calc(2*var(--grid-gap)) }
.review-settings-texts .settings-section:last-child { margin-bottom: 0 }
.review-settings-good-texts .settings-section:last-child { margin-bottom: 0 }
.review-settings-bad-texts .settings-section:last-child { margin-bottom: 0 }
.reviews_settings input[type="text"] { width: 100%; max-width: none }
.reviews_settings textarea { min-height: 100px }



.reviews_settings .chips_list .chip {

    display: flex;
    width: 100%;
gap: var(--grid-gap); 
margin-bottom: var(--grid-gap); 
align-items: center;




}

.width100 { width: 100%; max-width: none }
.reviews_settings .chips_list .chip div:nth-child(2) { width: 100% }


.reviews_settings .links_list .link {

    display: flex;
    width: 100%;
gap: var(--grid-gap); 
margin-bottom: var(--grid-gap); 
align-items: center;




}
.reviews_settings .links_list .link div:nth-child(3) { width: 100% }
.reviews_settings .links_list .link input::placeholder { color: #ccc}

.bull::before { content: '\2022 '; color: #999 }

.fancyBox h1 { font-size: 24px; }
.sendings-list .cell { padding: calc(var(--grid-gap)); border-bottom: 1px solid #eee; }

.sendings-list .entity-parent div.entity-child { padding: 0 0 5px 0 }
.sendings-list   .message {
    padding: 16px !important;
    background: #fafafa;
    border-radius: 8px;

}
.sendings-list   .message-text { margin-top: 8px;} 
.sendings-list .small { font-size: 13px; }
.sendings-list { font-size: 14px; }

.sendings-list .bold {     font-weight: 500; }

.entity-parent .tracking {white-space: nowrap;
    overflow: hidden;
    max-width: 150px;
 
    text-overflow: ellipsis;
}

.nowrap { white-space: nowrap }

.event-form h3 {

    font-size: 14px;
    font-weight: 500;
    color: #000;
    margin: 0 0 calc(var(--grid-gap) / 2) 0;

}

.event-form h4 {

    font-size: 14px;
    font-weight: 500;
    color: #666;
    margin: 0 0 calc(var(--grid-gap) / 2) 0;

}


.event-form  .steps .step-parent:first-child .icon-arrow-top { display: none }
.event-form  .steps .step-parent:last-child .icon-arrow-down { display: none }

.event-form  .step h2 { font-size: 20px; margin-top: 0}
.event-form  .step { position: relative; padding: var(--grid-gap); border-radius: calc(var(--grid-gap)/2); border: 1px solid #000; margin-bottom: var(--grid-gap) }
.event-form  .step .icon-delete {  position: absolute; top: var(--grid-gap); right: calc(var(--grid-gap)*1) }


.event-form  .step .arrows { position: absolute; top: var(--grid-gap); right: calc(var(--grid-gap)*3) }

.event-form  .step .arrows span { padding: 0 var(--grid-gap); }

 .sortable-active .step .event-one {  display: none }

  .sortable-active .step_new {  display: none }


.event-form .step_new {     display: flex;
    gap: calc(var(--grid-gap) / 2);
    align-items: center;
    margin-bottom: var(--grid-gap);
    padding: 8px;
    /* background: #eee; */
    text-align: center;
    border: 1px solid #ccc;
    padding: var(--grid-gap);
    border-radius: calc(var(--grid-gap) / 2); }
.event-form .step_new a { font-weight: 600;
    /* font-size: 12px; */
    padding: 4px 16px;
    border-radius: 4px;
    box-sizing: border-box;
    font-size: 14px;
    color: #666;
    box-shadow: 0 1px 10px 0 rgba(196, 208, 227, .7);
      }


.event-form .section { margin-bottom: calc(var(--grid-gap)/1) }

.event-form .section p  { color: #999; margin-top: 0 }

.event-form .event-one .section:last-child {   }

.event-form .section:last-child {  }

.event-form textarea {width: 100%;
    padding: calc(var(--grid-gap) / 2);
    border-radius: 4px;
    border: 2px solid #eee; min-height: 100px;}


    .event-form input {width: 100%;
    padding: calc(var(--grid-gap) / 2);
    border-radius: 4px;
    border: 2px solid #eee;  }

        .event-form select {width: 100%;
    padding: calc(var(--grid-gap) / 2);
    border-radius: 4px;
border: none;
    box-shadow: inset 0px 0px 0px 2px #eee;
       outline: none}

        .event-form .fastconditions {
                background: #fafafa;
    padding: calc(var(--grid-gap));
    margin-bottom: calc(var(--grid-gap) / 2);
    font-size: 14px;
    border-radius: calc(var(--grid-gap) / 2);
        }
        .event-form .fastconditions b { font-size: 14px;
    display: inline-block;
    margin-bottom: 8px;
    font-weight: 600; }
        .event-form .fastconditions a {    display: inline-block;
    padding: 4px 8px;
    background: #eee;
    border-radius: 4px;
    color: #000;
    margin-right: var(--grid-gap);
        }
.event-form .conditions { margin-top: var(--grid-gap); }
          .event-form .conditions small {  font-size: 12px;
    color: #999;
    display: inline-block;
    margin-bottom: 4px;
}

    .event-form .options { display: flex; gap: var(--grid-gap);     }
 .event-form .options .option {width: 100%}
 .event-form .options .last-option { width: auto;
    align-self: self-end; }
 .event-form .options .last-option .icon-delete { height: 40px }
  .event-form .conditions .options { margin-bottom: var(--grid-gap);     }
.event-form div.preview { color: #999 }
.macroses { line-height: 32px; }
  .macroses a { display: inline;
    font-weight: 500;
    /* font-size: 12px; */
    padding: 4px 8px;
    border-radius: 4px;
    box-sizing: border-box;
    font-size: 12px;
    color: #666;
    background: #eee;
    margin: 0 4px 0 0;
    white-space: nowrap;
     
 }

 textarea {}

 

.header-block .heading {
    margin-right: auto;
    padding: 0;
     
}

.header-block .heading h1 { margin: 0; font-weight: bold }

.menu  .shop {
     
    display: flex;
    align-items: center;
    cursor: pointer;



    margin: var(--grid-gap);
    margin-bottom: var(--grid-gap);
    /* border-bottom: 1px solid rgb(211 227 253 / 38%); */
    background: #fafafa;
    border-radius: 8px;
    padding: calc(var(--grid-gap));
    margin-top: 0;
 
}


.menu  .shop div {
    padding-right: var(--grid-gap);
    align-items: center;
}
.shop .shop-name {
    display: block;
    font-size: 14px;
    font-weight: bold;
    max-width: 150px;
    white-space: nowrap;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.shop .shop-id {
    font-size: 14px;
    color: #ccc;
}

.menu .user { margin-top: auto; }

.user .user-name {
    display: block;
    font-size: 14px;
    font-weight: bold;
    max-width: 160px;
    white-space: nowrap;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.user .user-role {
      display: block;
    font-size: 14px;
    color: #ccc;
}

.user .user-id {
      display: block;
    font-size: 14px;
    color: #ccc;
}
.shop-icon {
 
    display: inline-block;
    overflow: visible;
    width: 40px;
    height: 40px;

}

.downarrow-icon {

display: inline-block;
    overflow: visible;
    fill: var(--color-typo-ghost);
    width: 16px;
    height: 16px;

}

.menu  .user-block {
     
    display: flex;
    align-items: center;
    cursor: pointer;


    margin: var(--grid-gap);
    margin-bottom: var(--grid-gap);
    /* border-bottom: 1px solid rgb(211 227 253 / 38%); */
    background: #fafafa;
    border-radius: 8px;
    padding: calc(var(--grid-gap));
    margin-top: 0;

 
}

.menu  .user-block:hover {  background: rgb(211 227 253 / 38%)}

.menu  .user div {
    padding-right: var(--grid-gap);
    align-items: center;
}

.main-block {
    padding: calc(var(--grid-gap)*2);
    padding-top: 0;
}

.main-block {/* margin-left: calc(var(--grid-gap)*4); max-width: 1000px */ }

.footer-block {
      padding: calc(var(--grid-gap)* 2);
 margin-top: auto;
    font-size: 14px;
    border-top: 1px solid #eee;
    background: rgb(211 227 253 / 10%);
}
.footer {
    display: grid;
    grid-gap: var(--grid-gap);
    color: #999;
        grid-template-columns: repeat(12, [col] 1fr);
   
   
}
.footer b { font-size: 15px; color: #000;
}

 .footer a { color: #000 }

 .footer a.phone { color: #000;
    font-weight: bold;
    font-size: 18px; }
 .footer span.text { color: #999 }
.footer > div {
    grid-column: span 3;

}
.footer-item { margin-bottom: var(--grid-gap) }
:root {
        --menu-unfold: 300px;
        --color-typo-secondary: rgba(10, 37, 64, 0.7);
        --color-typo-ghost:rgb(211 227 253 / 38%);;

}



@media screen and (min-width: 1024px) {
    .root {
        grid-template-columns: auto minmax(320px, 1fr);
        grid-template-rows: minmax(100vh, auto);
    }
}

 

        .checkbox-input {
            appearance: none;
            width: 1rem !important;
            height: 1rem !important;
            /* border: 1px solid var(--color-link); */
            border-radius: 0.25rem;
            background-color: #fff;
            cursor: pointer;
            transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
            margin: 0;
        }

        .checkbox-input:hover:not(:disabled) {
            /* border-color: var(--color-link);*/
        }
/*
        .checkbox-input:focus {
            border-color: var(--color-link);
            outline: none;
            box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
        }
*/
        .checkbox-input:checked {
            background-color: var(--color-link);
            border-color: var(--color-link);
            background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
        }

        .checkbox-input:disabled {
            opacity: 0.5;
            cursor: not-allowed;
        }

        .checkbox-input:disabled + span {
            opacity: 0.5;
            cursor: not-allowed;
        }

        .radio-input {
        -webkit-appearance: none;
        appearance: none;
        width: 1rem !important;
        height: 1rem !important;
        border: 1px solid #dee2e6;
        border-radius: 50%;
        background-color: #fff;
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
        cursor: pointer;
        transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
        margin: 0;
    }

    /* Стилизация выбранного состояния радиокнопки */
    .radio-input:checked {
        background-color: var(--color-link);
        border-color: var(--color-link);
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e");
    }

    /* Стилизация отключённого состояния радиокнопки */
    .radio-input:disabled {
        filter: none;
        opacity: 0.5;
        cursor: not-allowed;
    }

    /* Стилизация метки радиокнопки при отключённом состоянии */
    .radio-input:disabled ~ .radio-label {
        opacity: 0.5;
        cursor: not-allowed;
    }



/* The switch - the box around the slider */
.switch {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  width: 48px;
  height: 20px;
}

/* Hide default HTML checkbox */
.switch input {display:none;}

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  border-radius: 20px;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  
  
 
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
 position: absolute;
    content: "";
    height: 14px;
    width: 14px;
    left: 4px;
    bottom: 3px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
    border-radius: 50%;

}

input:checked + .slider {
  background-color: #b0d841;
  background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNyAxMyIgY2xhc3M9InVpLWljb24tY2hlY2tib3ggdWktdHVtYmxlcl9fY29udHJvbC1pY29uLXllcyI+PHBhdGggc3Ryb2tlPSIjMzMzMzMzIiBmaWxsPSJub25lIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgZD0iTTEgN3MyLjkgMi43IDQuNCA0Yy40LjMgMS4xIDEgMS4xIDFMMTYgMSI+PC9wYXRoPjwvc3ZnPg==');
     
        background-size: 10px 10px;
    background-position: left center;
    background-repeat: no-repeat;
    background-position-x: 10px;
}


input:disabled + .slider {
opacity: 0.6;
}

input:focus + .slider {
 
}

input:checked + .slider:before {
  -webkit-transform: translateX(24px);
  -ms-transform: translateX(24px);
  transform: translateX(24px);
}


.dropdown-menu {
  position: absolute;
  z-index: 9999999;
  display: none;
  opacity: 0;
  top: 0;
  left: 0;
  -webkit-transition: opacity 0.2s, -webkit-transform 0.2s;
  transition: opacity 0.2s, transform 0.2s;
  -webkit-transform: translateY(-20px) scale(0.93);
  transform: translateY(-20px) scale(0.93);
   }
  .dropdown-menu.dropdown-opened {
    opacity: 1;
    -webkit-transform: none !important;
    transform: none !important; }
  .dropdown-menu.fixed {
    position: fixed; }
  .dropdown-menu.dropdown-anchor-left-top, .dropdown-menu.dropdown-anchor-left-center, .dropdown-menu.dropdown-anchor-left-bottom {
    -webkit-transform: translateX(-20px) scale(0.93);
    transform: translateX(-20px) scale(0.93); }
  .dropdown-menu.dropdown-anchor-right-top, .dropdown-menu.dropdown-anchor-right-center, .dropdown-menu.dropdown-anchor-right-bottom {
    -webkit-transform: translateX(20px) scale(0.93);
    transform: translateX(20px) scale(0.93); }
  .dropdown-menu .dropdown-anchor {
    border: 7px solid #fff; }
    .dropdown-menu .dropdown-anchor, .dropdown-menu .dropdown-anchor::after {
      position: absolute;
      content: '';
      display: inline-block; }
    .dropdown-menu .dropdown-anchor::after {
      border: 6px solid #fff; }
  .dropdown-menu.dark .dropdown-anchor, .dropdown-menu.dark .dropdown-anchor::after {
    border-color: #32363F; }
  .dropdown-menu.grey-anchor .dropdown-anchor, .dropdown-menu.grey-anchor .dropdown-anchor::after {
    border-color: #f6f6f6; }
  .dropdown-menu.accent-anchor .dropdown-anchor, .dropdown-menu.accent-anchor .dropdown-anchor::after {
    border-color: #F57C00; }
  .dropdown-menu.dropdown-anchor-top-left:not(.dropdown-overlay-trigger), .dropdown-menu.dropdown-anchor-top-center:not(.dropdown-overlay-trigger), .dropdown-menu.dropdown-anchor-top-right:not(.dropdown-overlay-trigger) {
    margin-top: 10px; }
  .dropdown-menu.dropdown-anchor-top-left .dropdown-anchor, .dropdown-menu.dropdown-anchor-top-center .dropdown-anchor, .dropdown-menu.dropdown-anchor-top-right .dropdown-anchor {
    border-top-color: transparent;
    border-right-color: transparent;
    border-left-color: transparent;
    top: -14px; }
    .dropdown-menu.dropdown-anchor-top-left .dropdown-anchor::after, .dropdown-menu.dropdown-anchor-top-center .dropdown-anchor::after, .dropdown-menu.dropdown-anchor-top-right .dropdown-anchor::after {
      border-top-color: transparent;
      border-right-color: transparent;
      border-left-color: transparent;
      margin-top: -5px;
      margin-left: -6px; }
  .dropdown-menu.dropdown-anchor-top-left.dropdown-anchor-top-left .dropdown-anchor, .dropdown-menu.dropdown-anchor-top-center.dropdown-anchor-top-left .dropdown-anchor, .dropdown-menu.dropdown-anchor-top-right.dropdown-anchor-top-left .dropdown-anchor {
    left: 15px; }
  .dropdown-menu.dropdown-anchor-top-left.dropdown-anchor-top-center .dropdown-anchor, .dropdown-menu.dropdown-anchor-top-center.dropdown-anchor-top-center .dropdown-anchor, .dropdown-menu.dropdown-anchor-top-right.dropdown-anchor-top-center .dropdown-anchor {
    left: calc(50% - 7px); }
  .dropdown-menu.dropdown-anchor-top-left.dropdown-anchor-top-right .dropdown-anchor, .dropdown-menu.dropdown-anchor-top-center.dropdown-anchor-top-right .dropdown-anchor, .dropdown-menu.dropdown-anchor-top-right.dropdown-anchor-top-right .dropdown-anchor {
    left: calc(100% - 28px); }
  .dropdown-menu.dropdown-anchor-right-top:not(.dropdown-overlay-trigger), .dropdown-menu.dropdown-anchor-right-center:not(.dropdown-overlay-trigger), .dropdown-menu.dropdown-anchor-right-bottom:not(.dropdown-overlay-trigger) {
    margin-left: -10px; }
  .dropdown-menu.dropdown-anchor-right-top .dropdown-anchor, .dropdown-menu.dropdown-anchor-right-center .dropdown-anchor, .dropdown-menu.dropdown-anchor-right-bottom .dropdown-anchor {
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: transparent;
    left: 100%; }
    .dropdown-menu.dropdown-anchor-right-top .dropdown-anchor::after, .dropdown-menu.dropdown-anchor-right-center .dropdown-anchor::after, .dropdown-menu.dropdown-anchor-right-bottom .dropdown-anchor::after {
      border-top-color: transparent;
      border-right-color: transparent;
      border-bottom-color: transparent;
      margin-left: -7px;
      margin-top: -6px; }
  .dropdown-menu.dropdown-anchor-right-top.dropdown-anchor-right-top .dropdown-anchor, .dropdown-menu.dropdown-anchor-right-center.dropdown-anchor-right-top .dropdown-anchor, .dropdown-menu.dropdown-anchor-right-bottom.dropdown-anchor-right-top .dropdown-anchor {
    top: 11px; }
  .dropdown-menu.dropdown-anchor-right-top.dropdown-anchor-right-center .dropdown-anchor, .dropdown-menu.dropdown-anchor-right-center.dropdown-anchor-right-center .dropdown-anchor, .dropdown-menu.dropdown-anchor-right-bottom.dropdown-anchor-right-center .dropdown-anchor {
    top: calc(50% - 7px); }
  .dropdown-menu.dropdown-anchor-right-top.dropdown-anchor-right-bottom .dropdown-anchor, .dropdown-menu.dropdown-anchor-right-center.dropdown-anchor-right-bottom .dropdown-anchor, .dropdown-menu.dropdown-anchor-right-bottom.dropdown-anchor-right-bottom .dropdown-anchor {
    top: calc(100% - 26px); }
  .dropdown-menu.dropdown-anchor-bottom-left:not(.dropdown-overlay-trigger), .dropdown-menu.dropdown-anchor-bottom-center:not(.dropdown-overlay-trigger), .dropdown-menu.dropdown-anchor-bottom-right:not(.dropdown-overlay-trigger) {
    margin-top: -10px; }
  .dropdown-menu.dropdown-anchor-bottom-left .dropdown-anchor, .dropdown-menu.dropdown-anchor-bottom-center .dropdown-anchor, .dropdown-menu.dropdown-anchor-bottom-right .dropdown-anchor {
    border-right-color: transparent;
    border-bottom-color: transparent;
    border-left-color: transparent;
    top: 100%; }
    .dropdown-menu.dropdown-anchor-bottom-left .dropdown-anchor::after, .dropdown-menu.dropdown-anchor-bottom-center .dropdown-anchor::after, .dropdown-menu.dropdown-anchor-bottom-right .dropdown-anchor::after {
      border-right-color: transparent;
      border-bottom-color: transparent;
      border-left-color: transparent;
      margin-top: -7px;
      margin-left: -6px; }
  .dropdown-menu.dropdown-anchor-bottom-left.dropdown-anchor-bottom-left .dropdown-anchor, .dropdown-menu.dropdown-anchor-bottom-center.dropdown-anchor-bottom-left .dropdown-anchor, .dropdown-menu.dropdown-anchor-bottom-right.dropdown-anchor-bottom-left .dropdown-anchor {
    left: 15px; }
  .dropdown-menu.dropdown-anchor-bottom-left.dropdown-anchor-bottom-center .dropdown-anchor, .dropdown-menu.dropdown-anchor-bottom-center.dropdown-anchor-bottom-center .dropdown-anchor, .dropdown-menu.dropdown-anchor-bottom-right.dropdown-anchor-bottom-center .dropdown-anchor {
    left: calc(50% - 7px); }
  .dropdown-menu.dropdown-anchor-bottom-left.dropdown-anchor-bottom-right .dropdown-anchor, .dropdown-menu.dropdown-anchor-bottom-center.dropdown-anchor-bottom-right .dropdown-anchor, .dropdown-menu.dropdown-anchor-bottom-right.dropdown-anchor-bottom-right .dropdown-anchor {
    left: calc(100% - 28px); }
  .dropdown-menu.dropdown-anchor-left-top:not(.dropdown-overlay-trigger), .dropdown-menu.dropdown-anchor-left-center:not(.dropdown-overlay-trigger), .dropdown-menu.dropdown-anchor-left-bottom:not(.dropdown-overlay-trigger) {
    margin-left: 10px; }
  .dropdown-menu.dropdown-anchor-left-top .dropdown-anchor, .dropdown-menu.dropdown-anchor-left-center .dropdown-anchor, .dropdown-menu.dropdown-anchor-left-bottom .dropdown-anchor {
    border-top-color: transparent;
    border-bottom-color: transparent;
    border-left-color: transparent;
    left: -14px; }
    .dropdown-menu.dropdown-anchor-left-top .dropdown-anchor::after, .dropdown-menu.dropdown-anchor-left-center .dropdown-anchor::after, .dropdown-menu.dropdown-anchor-left-bottom .dropdown-anchor::after {
      border-top-color: transparent;
      border-bottom-color: transparent;
      border-left-color: transparent;
      margin-left: -5px;
      margin-top: -6px; }
  .dropdown-menu.dropdown-anchor-left-top.dropdown-anchor-left-top .dropdown-anchor, .dropdown-menu.dropdown-anchor-left-center.dropdown-anchor-left-top .dropdown-anchor, .dropdown-menu.dropdown-anchor-left-bottom.dropdown-anchor-left-top .dropdown-anchor {
    top: 11px; }
  .dropdown-menu.dropdown-anchor-left-top.dropdown-anchor-left-center .dropdown-anchor, .dropdown-menu.dropdown-anchor-left-center.dropdown-anchor-left-center .dropdown-anchor, .dropdown-menu.dropdown-anchor-left-bottom.dropdown-anchor-left-center .dropdown-anchor {
    top: calc(50% - 7px); }
  .dropdown-menu.dropdown-anchor-left-top.dropdown-anchor-left-bottom .dropdown-anchor, .dropdown-menu.dropdown-anchor-left-center.dropdown-anchor-left-bottom .dropdown-anchor, .dropdown-menu.dropdown-anchor-left-bottom.dropdown-anchor-left-bottom .dropdown-anchor {
    top: calc(100% - 26px); }
  .dropdown-menu.max-height ul {
    max-height: 184px; }
  .dropdown-menu ul {
    min-width: 160px;
    list-style: none;
    background: #FFF;
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
    overflow: auto;
    padding: 0;
    margin: 0; 
    font-size: 14px;
    border-radius: calc(var(--grid-gap)/2);

}
    .dropdown-menu ul li {
      list-style: none;
      padding: 0;
      margin: 0;
      line-height: 100%; }
      .dropdown-menu ul li > a,
      .dropdown-menu ul li label {
        display: block;
        color: #555;
        text-decoration: none;
        line-height: 100%;
        padding: var(--grid-gap) calc(var(--grid-gap)*2);
        white-space: nowrap;
        transition: all 0.1s; }
        .dropdown-menu ul li > a svg,
        .dropdown-menu ul li label svg {
          height: 14px;
          width: 18px;
          vertical-align: middle;
          margin-left: -2px;
          margin-right: 4px;
          margin-top: -3px; }
          .dropdown-menu ul li > a svg path, .dropdown-menu ul li > a svg polygon,
          .dropdown-menu ul li label svg path,
          .dropdown-menu ul li label svg polygon {
            transition: fill 0.1s;
            fill: #0b0b0b; }
        .dropdown-menu ul li > a span.greenSVG svg path, .dropdown-menu ul li > a span.greenSVG svg polygon,
        .dropdown-menu ul li label span.greenSVG svg path,
        .dropdown-menu ul li label span.greenSVG svg polygon {
          fill: #B7D968; }
        .dropdown-menu ul li > a .flag,
        .dropdown-menu ul li label .flag {
          padding-bottom: 1px; }
        .dropdown-menu ul li > a:not(.grey):hover, .dropdown-menu ul li > a:hover,
        .dropdown-menu ul li label:not(.grey):hover,
        .dropdown-menu ul li label:hover {
          background-color: var(--color-background-button);
          color: #FFF;
          cursor: pointer; }
          .dropdown-menu ul li > a:not(.grey):hover svg path, .dropdown-menu ul li > a:not(.grey):hover svg polygon, .dropdown-menu ul li > a:hover svg path, .dropdown-menu ul li > a:hover svg polygon,
          .dropdown-menu ul li label:not(.grey):hover svg path,
          .dropdown-menu ul li label:not(.grey):hover svg polygon,
          .dropdown-menu ul li label:hover svg path,
          .dropdown-menu ul li label:hover svg polygon {
            fill: #fff; }
        .dropdown-menu ul li > a.active,
        .dropdown-menu ul li label.active {
          -webkit-user-select: none;
          -moz-user-select: none;
          user-select: none;
          cursor: default;
          pointer-events: none;
          color: #999;
          background: #f6f6f6; }
        .dropdown-menu ul li > a.grey:hover,
        .dropdown-menu ul li label.grey:hover {
          cursor: default; }
        .dropdown-menu ul li > a.disabled, .dropdown-menu ul li > a.disabled:hover, .dropdown-menu ul li > a.disabled:active,
        .dropdown-menu ul li label.disabled,
        .dropdown-menu ul li label.disabled:hover,
        .dropdown-menu ul li label.disabled:active {
          -webkit-user-select: none;
          -moz-user-select: none;
          user-select: none;
          cursor: default;
          pointer-events: none;
          cursor: default;
          color: #999; }
      .dropdown-menu ul li.title {
        padding: 7.5px 15px;
        background: #f6f6f6;
        color: #999;
        font-family: "Roboto", "Open Sans", sans-serif;
        font-size: 12px;
        text-transform: uppercase;
        border: 0;
        border-top-left-radius: 3px;
        border-top-right-radius: 3px; }
        .dropdown-menu ul li.title.grey {
          background: #999;
          color: #F57C00; }
        .dropdown-menu ul li.title.light {
          background: #f6f6f6;
          color: #fccfa2; }
        .dropdown-menu ul li.title.accent {
          background: #F57C00;
          color: #fccfa2; }
    .dropdown-menu ul li > a:hover small.grey {
      opacity: 0.75;
      color: #fff; }
    .dropdown-menu ul li:first-child.divider {
      display: none; }
  .dropdown-menu.right-aligned {
    text-align: right; }
    .dropdown-menu.right-aligned ul li a svg {
      margin-right: 0;
      margin-left: 4px; }
  .dropdown-menu .divider {
    height: 1px;
    background: #eee;
   
    overflow: hidden; }
  .dropdown-menu.dark.assign-dropdown ul li a {
    color: #fff; }
    .dropdown-menu.dark.assign-dropdown ul li a:hover {
      background: #F57C00;
      color: #fff; }
  .dropdown-menu.dark ul {
    background: #32363F; }
    .dropdown-menu.dark ul li > a,
    .dropdown-menu.dark ul li label {
      color: #939aaa; }
      .dropdown-menu.dark ul li > a svg path,
      .dropdown-menu.dark ul li > a svg polygon,
      .dropdown-menu.dark ul li label svg path,
      .dropdown-menu.dark ul li label svg polygon {
        fill: #778093; }
      .dropdown-menu.dark ul li > a.active,
      .dropdown-menu.dark ul li label.active {
        color: #7f889a;
        background: #393d48; }
        .dropdown-menu.dark ul li > a.active.green,
        .dropdown-menu.dark ul li label.active.green {
          background: #B7D968;
          color: #fff; }
          .dropdown-menu.dark ul li > a.active.green svg path, .dropdown-menu.dark ul li > a.active.green svg polygon,
          .dropdown-menu.dark ul li label.active.green svg path,
          .dropdown-menu.dark ul li label.active.green svg polygon {
            fill: #fff; }
        .dropdown-menu.dark ul li > a.active.accent,
        .dropdown-menu.dark ul li label.active.accent {
          background: #F57C00;
          color: #fff; }
          .dropdown-menu.dark ul li > a.active.accent svg path, .dropdown-menu.dark ul li > a.active.accent svg polygon,
          .dropdown-menu.dark ul li label.active.accent svg path,
          .dropdown-menu.dark ul li label.active.accent svg polygon {
            fill: #fff; }
    .dropdown-menu.dark ul .divider {
      background: rgba(255, 255, 255, 0.08); }

@media screen and (max-width: 420px) {
  .dropdown-menu ul li > a {
    line-height: 32px;
    padding-left: 24px;
    padding-right: 24px; } }



    .skeleton {
    background-color: #e2e5e7;
    
    background-image:           
            linear-gradient(
                90deg, 
                rgba(#fff, 0), 
                rgba(#fff, 0.5),
                rgba(#fff, 0)
            );
    background-size: 40px 100%;  
    background-repeat: no-repeat;  
    background-position: left -40px top 0;  
    animation: shine 1s ease infinite;
}

@keyframes shine {
    to {
    
        background-position: right -40px top 0;
    }
}


.paginationjs {
    line-height: 1.6;
   
    font-size: 14px;
    box-sizing: initial
}

.paginationjs:after {
    display: table;
    content: " ";
    clear: both
}

.paginationjs .paginationjs-pages {
    
}

.paginationjs .paginationjs-pages ul {
    
    margin: 0;
    padding: 0;
        display: flex;
    justify-content: center;
}

.paginationjs .paginationjs-go-button,.paginationjs .paginationjs-go-input,.paginationjs .paginationjs-nav {
    float: left;
    margin-left: 10px;
    font-size: 14px
}

.paginationjs .paginationjs-pages li {
    float: left;
    /*border: 1px solid #eee;*/
    border-right: none;
    list-style: none;
    cursor: pointer;
    margin: 0 2px;
}

.paginationjs .paginationjs-pages li>a {
    min-width: 30px;
     
    border-bottom: none;
    height: 28px;
    line-height: 28px;
    display: block;
    background: #fff;
    font-size: 14px;
    color: #333;
    text-decoration: none;
    text-align: center;
    border-radius: 8px;
}

.paginationjs .paginationjs-pages li>a:hover {
    background: #eee
}

.paginationjs .paginationjs-pages li.active {
    border: none
}

.paginationjs .paginationjs-pages li.active>a {
    /*height: 30px;*/
    line-height: 28px;
    background: var(--color-background-button-hover);
    color: #fff
}

.paginationjs .paginationjs-pages li.disabled>a {
    opacity: .3
}

.paginationjs .paginationjs-pages li.disabled>a:hover {
    background: 0 0
}

.paginationjs .paginationjs-pages li:first-child,.paginationjs .paginationjs-pages li:first-child>a {
      border-radius: 50%;
}

.paginationjs .paginationjs-pages li:last-child {
    /*border-right: 1px solid #eee;*/
    border-radius: 8px;
 
}

.paginationjs .paginationjs-pages li:last-child>a {
   border-radius: 8px;
}

.paginationjs .paginationjs-go-input>input[type=text] {
    width: 30px;
    height: 28px;
    background: #fff;
    border-radius: 4px;
    border: 1px solid #eee;
    padding: 0;
    font-size: 14px;
    text-align: center;
    vertical-align: baseline;
    outline: 0;
    box-shadow: none;
    box-sizing: initial
}

.paginationjs .paginationjs-go-button>input[type=button] {
    min-width: 40px;
    height: 30px;
    line-height: 28px;
    background: #fff;
    border-radius: 3px;
    border: 1px solid #eee;
    text-align: center;
    padding: 0 8px;
    font-size: 14px;
    vertical-align: baseline;
    outline: 0;
    box-shadow: none;
    color: #333;
    cursor: pointer;
    vertical-align: middle\9
}

.paginationjs.paginationjs-theme-blue .paginationjs-go-input>input[type=text],.paginationjs.paginationjs-theme-blue .paginationjs-pages li {
    border-color: #289de9
}

.paginationjs .paginationjs-go-button>input[type=button]:hover {
    background-color: #f8f8f8
}

.paginationjs .paginationjs-nav {
    height: 30px;
    line-height: 30px
}

.paginationjs .paginationjs-go-button,.paginationjs .paginationjs-go-input {
    margin-left: 5px\9
}

.paginationjs.paginationjs-small {
    font-size: 12px
}

.paginationjs.paginationjs-small .paginationjs-pages li>a {
    min-width: 26px;
    height: 24px;
    line-height: 24px;
    font-size: 12px
}

.paginationjs.paginationjs-small .paginationjs-pages li.active>a {
    height: 26px;
    line-height: 26px
}

.paginationjs.paginationjs-small .paginationjs-go-input {
    font-size: 12px
}

.paginationjs.paginationjs-small .paginationjs-go-input>input[type=text] {
    width: 26px;
    height: 24px;
    font-size: 12px
}

.paginationjs.paginationjs-small .paginationjs-go-button {
    font-size: 12px
}

.paginationjs.paginationjs-small .paginationjs-go-button>input[type=button] {
    min-width: 30px;
    height: 26px;
    line-height: 24px;
    padding: 0 6px;
    font-size: 12px
}

.paginationjs.paginationjs-small .paginationjs-nav {
    height: 26px;
    line-height: 26px;
    font-size: 12px
}

.paginationjs.paginationjs-big {
    font-size: 16px
}

.paginationjs.paginationjs-big .paginationjs-pages li>a {
    min-width: 36px;
    height: 34px;
    line-height: 34px;
    font-size: 16px
}

.paginationjs.paginationjs-big .paginationjs-pages li.active>a {
    height: 36px;
    line-height: 36px
}

.paginationjs.paginationjs-big .paginationjs-go-input {
    font-size: 16px
}

.paginationjs.paginationjs-big .paginationjs-go-input>input[type=text] {
    width: 36px;
    height: 34px;
    font-size: 16px
}

.paginationjs.paginationjs-big .paginationjs-go-button {
    font-size: 16px
}

.paginationjs.paginationjs-big .paginationjs-go-button>input[type=button] {
    min-width: 50px;
    height: 36px;
    line-height: 34px;
    padding: 0 12px;
    font-size: 16px
}

.paginationjs.paginationjs-big .paginationjs-nav {
    height: 36px;
    line-height: 36px;
    font-size: 16px
}

.paginationjs.paginationjs-theme-blue .paginationjs-pages li>a {
    color: #289de9
}

.paginationjs.paginationjs-theme-blue .paginationjs-pages li>a:hover {
    background: #e9f4fc
}

.paginationjs.paginationjs-theme-blue .paginationjs-pages li.active>a {
    background: #289de9;
    color: #fff
}

.paginationjs.paginationjs-theme-blue .paginationjs-pages li.disabled>a:hover {
    background: 0 0
}

.paginationjs.paginationjs-theme-blue .paginationjs-go-button>input[type=button] {
    background: #289de9;
    border-color: #289de9;
    color: #fff
}

.paginationjs.paginationjs-theme-green .paginationjs-go-input>input[type=text],.paginationjs.paginationjs-theme-green .paginationjs-pages li {
    border-color: #449d44
}

.paginationjs.paginationjs-theme-blue .paginationjs-go-button>input[type=button]:hover {
    background-color: #3ca5ea
}

.paginationjs.paginationjs-theme-green .paginationjs-pages li>a {
    color: #449d44
}

.paginationjs.paginationjs-theme-green .paginationjs-pages li>a:hover {
    background: #ebf4eb
}

.paginationjs.paginationjs-theme-green .paginationjs-pages li.active>a {
    background: #449d44;
    color: #fff
}

.paginationjs.paginationjs-theme-green .paginationjs-pages li.disabled>a:hover {
    background: 0 0
}

.paginationjs.paginationjs-theme-green .paginationjs-go-button>input[type=button] {
    background: #449d44;
    border-color: #449d44;
    color: #fff
}

.paginationjs.paginationjs-theme-yellow .paginationjs-go-input>input[type=text],.paginationjs.paginationjs-theme-yellow .paginationjs-pages li {
    border-color: #ec971f
}

.paginationjs.paginationjs-theme-green .paginationjs-go-button>input[type=button]:hover {
    background-color: #55a555
}

.paginationjs.paginationjs-theme-yellow .paginationjs-pages li>a {
    color: #ec971f
}

.paginationjs.paginationjs-theme-yellow .paginationjs-pages li>a:hover {
    background: #fdf5e9
}

.paginationjs.paginationjs-theme-yellow .paginationjs-pages li.active>a {
    background: #ec971f;
    color: #fff
}

.paginationjs.paginationjs-theme-yellow .paginationjs-pages li.disabled>a:hover {
    background: 0 0
}

.paginationjs.paginationjs-theme-yellow .paginationjs-go-button>input[type=button] {
    background: #ec971f;
    border-color: #ec971f;
    color: #fff
}

.paginationjs.paginationjs-theme-red .paginationjs-go-input>input[type=text],.paginationjs.paginationjs-theme-red .paginationjs-pages li {
    border-color: #c9302c
}

.paginationjs.paginationjs-theme-yellow .paginationjs-go-button>input[type=button]:hover {
    background-color: #eea135
}

.paginationjs.paginationjs-theme-red .paginationjs-pages li>a {
    color: #c9302c
}

.paginationjs.paginationjs-theme-red .paginationjs-pages li>a:hover {
    background: #faeaea
}

.paginationjs.paginationjs-theme-red .paginationjs-pages li.active>a {
    background: #c9302c;
    color: #fff
}

.paginationjs.paginationjs-theme-red .paginationjs-pages li.disabled>a:hover {
    background: 0 0
}

.paginationjs.paginationjs-theme-red .paginationjs-go-button>input[type=button] {
    background: #c9302c;
    border-color: #c9302c;
    color: #fff
}

.paginationjs.paginationjs-theme-red .paginationjs-go-button>input[type=button]:hover {
    background-color: #ce4541
}

.paginationjs .paginationjs-pages li.paginationjs-next {
    border-right: 1px solid #eee\9
}

.paginationjs .paginationjs-go-input>input[type=text] {
    line-height: 28px\9;
    vertical-align: middle\9
}

.paginationjs.paginationjs-big .paginationjs-pages li>a {
    line-height: 36px\9
}

.paginationjs.paginationjs-big .paginationjs-go-input>input[type=text] {
    height: 36px\9;
    line-height: 36px\9
}




