@font-face {
    font-family: 'vazir';
    src: url('/fonts/Vazir-Medium.eot');
    /* IE9 Compat Modes */
    src: url('/fonts/Vazir-Medium.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('/fonts/Vazir-Medium.woff2') format('woff2'), /* Super Modern Browsers */
    url('/fonts/Vazir-Medium.woff') format('woff'), /* Pretty Modern Browsers */
    url('/fonts/Vazir-Medium.ttf') format('truetype')
}

@font-face {
    font-family: 'anjoman';

    /* IE9 Compat Modes */
    src: /* IE6-IE8 */
    url('../fonts/Anjoman-Light.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/Anjoman-Light.woff') format('woff'), /* Pretty Modern Browsers */
    url('../fonts/Anjoman-Light.ttf') format('truetype')
}

:root{
    --primary: #14dcf5;
    --grey: #c0c0c0;
}
.font-vazir {
    font-family: 'vazir', Arial, Helvetica, sans-serif;
}
.font-anjoman {
    font-family: 'anjoman', Arial, Helvetica, sans-serif;
}

ol{
    list-style: decimal !important;
    list-style-position: inside !important;
}

textarea {
    font-family: 'vazir', Arial, Helvetica, sans-serif !important;
}

a[target="_blank"]::after,
a.external::after {
  @extend .glyphicon;
  content: "\e164";
  margin-left: .5em;
  margin-right: .25em;
}

pre{
    direction: ltr;
    text-align: start;
    padding: 10px;
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}
pre.CodeMirror-line{
    direction: rtl !important;
    text-align: start !important;
}


.swiper-pagination-bullet.swiper-pagination-bullet-active{
    background-color: var(--primary) !important;
}

.swiper-pagination-bullet {
    background-color: var(--grey) !important;
}

.swiper-slide { width: 300px }

ion-icon {
    --ionicon-stroke-width: 48px;
}

*::-webkit-scrollbar{
    width: 10px;
    height: 4px;
}
*::-webkit-scrollbar-track{
    background: #262B3F;
}
*::-webkit-scrollbar-thumb{
    background: var(--primary);
    border-radius: 10px;
}

*::-webkit-scrollbar-thumb:hover{
    background: var(--primary);
}

.cls-1 {
    fill: #ffffff;
}

.CodeMirror {
    background: #1D1C2A !important;
    color: #ffffff !important;
}
.editor-preview {
    background: #242635;
}
button{
    color: white  !important;
}
.editor-toolbar button.active, .editor-toolbar button:hover {
    color: #1D1C2A  !important;
}