html,
body,
#root,
#root > div {
width: 100%;
height: 100%;
}
html {
-webkit-overflow-scrolling: touch;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
body {
overflow: hidden;
height: 100%;
font-family: 'OptimaLTPro-Roman', Georgia, serif;
font-weight: 400;
font-style: normal;
font-size: 16px;
line-height: 1.25em;
flex: 1;
}
h1 {
font-family: 'AlbertusMTPro-Light', Palatino, Georgia, serif;
font-weight: 300;
margin-bottom: 3rem;
font-size: 32px;
}
h2,
h3,
h4,
h5 {
font-family: 'OptimaLTPro-Roman', Georgia, serif;
font-weight: 400;
line-height: 1.25em;
}
p {
font-family: 'OptimaLTPro-Roman', Georgia, serif;
}
/* These styles make the root element full-height */
#root {
display: flex;
height: 100%;
}
.dark {
background-color: #000;
color: #fff;
}
.light {
background-color: #fff;
color: #000;
}
::placeholder {
color: #525252;
opacity: 1; /* Firefox */
}
.flatpickr-calendar,
span.flatpickr-weekday,
.popup-box {
font-family: 'ABCFavorit-Book', Helvetica, Arial, sans-serif;
}
/* :lang(fa) */
span.flatpickr-weekday:lang(fa),
select.flatpickr-monthDropdown-months:lang(fa) {
font-family: 'NotoSansArabic-Regular', Tahoma, sans-serif !important;
font-size: 14px !important;
}
.flatpickr-input.flatpickr-mobile {
display: none;
}
body::-webkit-scrollbar {
width: 0px;
height: 0px;
}
body.light {
color-scheme: light;
}
body.dark {
color-scheme: dark;
}
div[data-scrollbar-flat-list-adjust='true'] > div {
margin-left: calc((100vw - 100%) / 2) !important;
}
div[data-scrollbar-tabs-scroll-view-adjust='true'] > div,
div[data-scrollbar-form-scroll-wrapper-adjust='true'] > div {
padding-left: calc((100vw - 100%)) !important;
max-width: calc(530px + calc((100vw - 100%))) !important;
}
input[id^='tag-input-'] {
all: unset;
}
a[data-web-link='true'] {
transform: scale(1);
transition: transform 0.2s ease-in-out;
}
a[data-web-link='true']:hover {
transform: scale(1.01);
transition: transform 0.2s ease-in-out;
}
a,
a image {
cursor: pointer !important;
}
span,
p,
div,
a,
h1,
h2,
h3,
h4,
h5,
h6 {
user-select: text !important;
}
/* Seems to be a bug on Chrome where the above doesn't work */
div[role='alert'] div#alert-dialog-description {
user-select: all !important;
}
/* Counteract effect for buttons in alerts */
*[role='button'] {
user-select: none !important;
}
/* Hide scrollbar */
div#groups-scroll-view {
scrollbar-width: none;
}
/* Selection color */
::-moz-selection {
/* Code for Firefox */
/* Light gray */
background: #d7d3c1;
}
::selection {
background: hsl(48, 22%, 80%);
}
/* Dark mode selection () */
body.dark ::-moz-selection {
background: #343b2e;
}
body.dark ::selection {
background: #343b2e;
}
/* Divs with role="button" and aria-disabled="true" */
/* Should have a cursor of not-allowed */
/* But this doesn't work */
div[role='button'][aria-disabled='true'] {
cursor: not-allowed !important;
}
/* Selected paths don't have outline */
path:focus {
outline: none;
}
/* Mapbox */
.mapboxgl-popup-content {
border-radius: 0px !important;
padding: 0px !important; /* We handle padding ourselves */
}