*{
    box-sizing: border-box
}
*, body, html{
    margin: 0;
    padding: 0
}
body, html{
    position: relative;
    overflow-x: hidden;
    max-width: 100vw;
    border: 0;
    background-color: var(--background-surface-stage-1);
    font-family: var(--primary-font-family), sans-serif;
    scroll-behavior: smooth;
    scrollbar-width: thin;
    scrollbar-color: var(--background-surface-stage-4)
}
a{
    color: inherit;
    text-decoration: none
}
a, button, input, select, textarea{
    -webkit-tap-highlight-color: transparent
}
:root{
    --app-height: 100dvh
}
select{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}
img, picture{
    font-size: 12px;
    color: var(--content-secondary);
    overflow-wrap: break-word
}
button{
    padding: 0;
    border: none;
    background-color: transparent;
    font: inherit;
    color: inherit
}
img:not([src]){
    visibility: hidden
}
[data-layout-type=full-screen-modal]+[data-layout-type=root]{
    display: none
}
::-webkit-scrollbar{
    width: 8px;
    height: 8px
}
::-webkit-scrollbar-track{
    background: transparent
}
::-webkit-scrollbar-thumb{
    background-color: transparent;
    border-radius: 4px
}
:hover::-webkit-scrollbar-thumb{
    background-color: var(--background-surface-stage-4);
    border: 2px solid var(--background-surface-stage-1)
}
*{
    scrollbar-width: thin;
    scrollbar-color: transparent transparent
}
:hover{
    scrollbar-color: var(--background-surface-stage-4) var(--background-surface-stage-1)
}
html[dir=rtl]{
    direction: rtl
}
html[dir=ltr]{
    direction: ltr
}
html[dir=rtl] body{
    text-align: right
}
html[dir=ltr] body{
    text-align: left
}
[data-device-type=mobile] [data-id=zsalesiq][position$=-bottom] #zsiq_float{
    bottom: calc(var(--tabBarHeight) + env(safe-area-inset-bottom, 0px) + 24px) !important
}