html, body {min-height: 100vh;display: flex;flex-direction: column;margin: 0;}
/* body {font-family: 'Nunito', sans-serif;font-weight: 400; } */
@font-face{font-family:bold;src:url("/assets/css/fonts/yekan-bold.ttf") !important}
body{touch-action:manipulation;}
/* .fy{font-family:'bold' !important} */
.login-class{display: none}
.italic{font-style: italic;}
body {font-weight: 400; }
strong, b {font-weight: 800;}
.text-back{color:var(--back)}
::selection {background-color: lightgray;}
.form-check-input:checked{background-color: var(--back) !important; border-color: var(--back) !important; }
h1,h2,h3,h4,h5,h6,p,label,td{color:var(--back)}
.form-select, .form-floating>.form-control, .form-floating>.form-control-plaintext, .form-floating>.form-select{border-radius: 4px!important;}
select, textarea, input[type=text], input[type=tel], input[type=number] , input[type=email] , input[type=password] , input[type=date] {border:1px solid var(--back)!important; border-radius: 4px!important; transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;}
select:focus, textarea:focus, input[type=text]:focus, input[type=tel]:focus, input[type=number]:focus , input[type=email]:focus , input[type=date]:focus , input[type=password]:focus {border-color:var(--back)!important;box-shadow: 0.01em 0.01em 3px var(--back)!important; transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;}
.form-check-input:checked{background-color:var(--back); border-color: var(--back);}
label{padding-bottom: 2px;}
.o3{opacity: 0.3;} .o4{opacity: 0.4;} .o5{opacity: 0.5;} .o6{opacity: 0.6;} .o7{opacity: 0.7;} .o8{opacity: 0.8;}
::placeholder{color:#b8b8b8 !important;}
.btn-primary, .btn-primary:hover, .btn-primary:focus, .btn-primary:active {background-color: var(--back) !important; border-color: var(--back) !important; color: var(--background) !important; border-radius: 5px !important;}
/* .btn-danger, .btn-danger:hover, .btn-danger:focus, .btn-danger:active {background-color: var(--red) !important; border-color: var(--red) !important; color: var(--background) !important; border-radius: 5px !important;} */
.btn-secondary, .btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active {background-color: var(--gray) !important; border-color: var(--gray) !important; color: var(--background) !important; border-radius: 5px !important;}
.toast{background:var(--back) !important;}
.messages .error{color: var(--red) !important;}
.messages .success{color: var(--green) !important;}
.darkgrey{color: #5e5e5e;}
.permission-group{font-style: bold; color: deepskyblue}
/* .toast.text-bg-primary {background:var(--back); opacity: 1 !important;} */
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {box-shadow: 0.2em 0.2em 10px var(--gray) !important;}
li, input[type="email"],input[type="tel"], input[type="password"], input[type="date"], input[type="number"], input[type="text"], ::selection, input[type="text"]::selection, textarea, .input-group-text {color: var(--back) !important;}
.form-floating>.form-control, .form-floating>.form-control-plaintext, .form-floating>.form-select {color:var(--back)}
.label-float,.form-floating>.form-control-plaintext~label, .form-floating>.form-control:focus~label, .form-floating>.form-control:not(:placeholder-shown)~label, .form-floating>.form-select~label{color:var(--gray);}
.hand{cursor: pointer;}
.p-6{padding: 6px !important;}
.f10{font-size: 10px !important;}.f11{font-size: 11px;}.f12{font-size: 12px;}.f13{font-size: 13px;}.f14{font-size: 14px;}
.float-right{float: right;}
.btn-link{color: var(--back);}
.direction_rtl{direction: rtl;}
.direction_rtl_text_left{direction: rtl; text-align: left;}
.no-underline{text-decoration: none; color: inherit;}
.verification_input{letter-spacing: 0.5em;}
nav .offcanvas-header h5, nav .text-bg-dark, nav .bg-dark, .navbar-dark{background-color: var(--nav-menu-back-color) !important;}
nav .offcanvas, .offcanvas-lg, .offcanvas-md, .offcanvas-sm, .offcanvas-xl, .offcanvas-xxl{--bs-offcanvas-width: 80%; max-width: 260px; min-width: 200px}
.offcanvas-bottom{padding: 10px 20px;}
.green{color: var(--green);}
.bold{font-weight: bold;}
.a-theme{color: var(--back);}
.navbar-brand{position: fixed; top: 0; right: 0; font-size: 1em;}
.text-grey, .text-gray{color: var(--gray)}
.offcanvas-body{padding: 0;}
.not-ready{opacity: 0.4;}
#open-menu-button, .offcanvas-title, .navbar-brand{color:var(--nav-menu-color)}
.navbar.fixed-top{height: 32px; box-shadow: 0px 0px 5px 1px gray}
.hidden{display: none;}
.navbar-toggler:focus{box-shadow: none;}
.dropdown-menu-dark{background-color: var(--back); color: var(--nav-menu-color);}
.offcanvas-header{border-bottom: 1px solid gray;}
.nav-item.divider {height: 1px;margin: 0.5rem 0;background-color: var(--gray);width: 100%;opacity: 0.1;}
button.navbar-toggler{border: none; position: absolute; font-size: 19px; padding-left: 0px; color: var(--gray);}
nav form input[type="search"]{color:var(--front) !important; background: transparent !important;}
.text-primary{color: var(--back) !important;}
.footer{background-color: var(--back); color: var(--front); font-size: 14px; width: 100%;}
.footer a{color: lightblue;}
form .btn-100{width: 100px;}
.grey, .gray, .label-grey{color: grey;}
.red{color: red;}
.footer div{padding: 10px;}
.form-control{padding: .375rem .5rem;}
.content .menu_page{display: none;}
.content{display: none;}
.app-bar {background-color: var(--back);position: fixed;bottom: 0;left: 0;width: 100%;height: 80px;display: flex;justify-content: space-evenly;align-items: center;padding-bottom: 22px; z-index: 999;}
.app-bar i {color: lightgray;padding: 15px 25px;font-size: 18px;opacity: 0.2;}
.menu_active{opacity: 1 !important; transition: 0.5s;}
.offcanvas-backdrop{background-color:var(--back) !important;}
.offcanvas.show:not(.hiding), .offcanvas.showing{background: var(--back); color: white;}
.offcanvas.show, .offcanvas.showing{background: var(--back); color: white;}
.nav-link{color: lightgray !important; border-bottom: 1px dashed gray !important;}
.top-card{background-color: white; border-radius: 92% 34% 28% 90% / 0% 0% 7% 38%; width: 100%; z-index: 1; position: fixed; top: 5%; height:60%;}
.bottom-card{padding:10px; background: linear-gradient(to bottom, var(--back), #011212); color: var(--back); height: 100%; bottom: 0px;  width: 100%; position: fixed; z-index: 0;}
.login-text{margin: 0px; padding-bottom: 15px; border-bottom: 1px dashed lightgray; font-size: 18px;}
.flag-grid img{width: 35px; padding: 0px; margin: 15px; display: inline-block; opacity: 0.3; border-radius: 15px}
.flag-row-1{white-space: nowrap; position: fixed; bottom: 130px; width: 100%;}
.flag-row-2{white-space: nowrap; position: fixed; bottom: 80px; width: 100%;}
.flag-row-3{white-space: nowrap; position: fixed; bottom: 30px; width: 100%;}
.icon-golds{white-space: nowrap; overflow: hidden; position: fixed; bottom: 180px; z-index: 1; width: 100%; height: 240px; text-align: center; opacity: 0.5;}
.icon-gold{width: 60px; padding: 0px 15px; margin: 0 35px;}
.login {width: 90%; margin: auto;height: 100vh;position: fixed;top: 12%;border-radius: 15px;z-index: 3 !important;}
.login-box label{ font-size: 13px; opacity: 0.4;}
.login-box input, .login-box button{height: 40px;}
.login-box {padding: 0px 30px; width: 100%;border-radius: 10px;z-index: 3 !important;}
.div-login-logo{position: fixed; top: 1%; left: 10%; z-index: -99;}
.div-login-logo img{width: 70px;}
.display-none{display: none;}
.width-50 .col-sm-6{width: 50%;}
.direction_rtl{direction: rtl;}
.tran-not-respond{font-size: 13px !important; color:gray; border-bottom: 1px dashed darkgray; margin: 3px 0px;}
.text-align-right{text-align: right !important;}
#alert_message{position: fixed; bottom: 9%; opacity: 0.8; z-index: 1057; width: 80%; left: 10%;}
#alert_message .alert{padding: 6px 15px; font-weight: bold; font-size: 14px;}
#alert_message .alert-success{ background-color: var(--back); color: white; border: none;}
.table-dark tr th{background-color: var(--back)}
.price-row {display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px dashed rgba(var(--back-rgb), 0.2);}
.user-items-card{padding: 0 !important}
.d-p{font-size: 15px; margin-bottom: 2px; color:white;}
.user-items-card .card-body{padding: 10px 5px; border-radius: 5px;}
.user-items-card .card-title-items{font-size: 12px;}
.sell-item-user, .buy-item-user, .sell-item-user-best, .buy-item-user-best{padding: 2x 0px; margin: 4px 4px; height: 25px; font-size: 13px;  border: 1px solid; border-radius: 5px; border-color:rgb(61, 61, 168, 0.2);}
.buy-item-user{border-color:rgba(139, 0, 0, 0.4);}
.padding-user-setting-list{padding: 5px 5px !important;}
.sell-item-user{border-color:rgba(0, 100, 0, 0.4);}
.price-line {display: flex; align-items: center; justify-content: space-between; height: 100%; width: 100%;}
.price-text {text-align: right; white-space: nowrap; padding-right: 5px;}
.price-number {text-align: center; white-space: nowrap; padding-left: 5px;}
.disabled-item-price{opacity: 0.5;}
.display-none-price{opacity: 0.01;}
.has-add-price{color: red !important}
.invisible-item {visibility: hidden; pointer-events: none;}
.side-block {display:flex;width:30%;justify-content:flex-end;align-items:center;gap:5px;}
.value-block {font-size:14px;direction:ltr;min-width:75px;text-align:center;}
.arrow {font-size:14px; min-width: 15px; margin: auto;font-weight:bold;cursor:pointer;line-height:14px; padding: 2px 8px}
.arrow.up {color:darkgreen;}
.arrow.down {color:darkred;}
.middle-name {width:35%;text-align:center;font-size:12px;font-weight:bold; border-right: 1px dashed rgba(var(--back-rgb), 0.2); border-left: 1px dashed rgba(var(--back-rgb), 0.2); margin: 0 5px; padding: 0 5px;}
.side-outer {display:flex;flex-direction:column;width:32%;}
.side-outer-buy {align-items:flex-start;}
.side-outer-sell {align-items:flex-start;}
#menu_telegram .container{padding: 0px}
.telegram-card-body{padding: 10px 5px !important}
.value-static {cursor:default;}
.pr-1{padding-right: 1px;}
.horizontal-box {display: flex;flex-direction: row;align-items: center;justify-content: center;gap: 5px;width: 90%;}
.item-icon {width:20px;height:20px;margin-left:4px;vertical-align:middle;object-fit:contain;}
.group-row { padding: 10px 0; border-bottom:1px dashed rgba(0,0,0,0.2)}
.group-header { display:flex; align-items:center;font-weight:bold; margin-bottom:8px; }
.group-title { font-size:14px;  padding: 3px 10px 3px 20px; color: var(--back)}
.child-line {display:flex; align-items:center; justify-content:space-between; padding:4px 0; font-size:13px;}
.child-name { width:24%; color: var(--back)}
.side {display:flex; align-items:center; gap:5px; width:35%; justify-content:center;}
.price-value { min-width:70px; text-align:center; cursor:pointer; }
.arrow { cursor:pointer; font-size:14px; padding:0 15px; }
.arrow-padding-right {padding:0 15px 0 5px;}
.arrow-padding-left {padding:0 5px 0 15px;}
.back-green, .arrow.up { color:darkgreen; }
.back-red, .arrow.down { color:darkred; }
.price-getting-update {color: gray; opacity: 0.4;}
.manager-price-value-sell{color: darkred}
.manager-price-value-buy{color: darkblue}
#btnSendWhatsapp{background-color: #075E54; border: 10px; color: white; position: fixed; bottom: 20%; right: 12%; z-index: 999; opacity: 0.95; display: none;}
#users_gold_access{margin-top: 3px}
.btn-show-grey{font-size: 13px !important; padding: 2px 6px !important;}
.border-item-settings-bottom{border-bottom: 1px dashed rgba(0, 0, 0, 0.2); padding-bottom: 10px; padding-right: 25px;}
.item-setting-div:nth-child(odd) {background-color: #f8f9fa;}
.item-setting-div:nth-child(even) {background-color: #ffffff;}
.setting-items-modal-icon{color: var(--back); font-size: 20px;}
.diamond-menu-list .nav-link{color:#57e0ff !important}
.store-label-diamond{color: dodgerblue;}
.admin-label-diamond{color: seagreen;}
.currency-span, .currency-span img{width: 25px;}
.div-order-inputs input, .div-order-inputs input:focus{border-radius: 0 !important; border-color: #dee2e6 !important; box-shadow: none !important; font-size: 14px;}
.div-order-inputs span{border: 1px solid #dee2e6; width: 60px; justify-content: center; font-size: 14px;}
.slide-wrap{width: 100%;max-width: 320px;margin: 20px auto;}
.slide-track{position: relative;height: 50px;background: #e9ecef;border-radius: 30px;overflow: hidden;}
.slide-text{position: absolute;width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;font-weight: bold;user-select: none;background: linear-gradient(110deg,#6c757d 40%,#ffffff 50%,#6c757d 60%);background-size: 200% 100%;-webkit-background-clip: text;-webkit-text-fill-color: transparent;animation: slideShine 2.5s ease-in-out infinite;}
.progress .progress-bar{transition: width 0.5s ease !important; background-color: #555555 !important;}
.progress-bar.progress-bar-striped {background-image: linear-gradient(45deg, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent); background-size: 1rem 1rem; animation: progress-bar-stripes 1s linear infinite;}
.progress, .progress-stacked{background-color: transparent !important;}
.e-stepper {display: flex;justify-content: space-between;align-items: center;position: relative;padding: 20px 10px;}
.e-stepper::before {content: "";position: absolute;top: 32px;left: 0;right: 0;height: 2px;background: #e9ecef;z-index: 0;}
.e-step {position: relative;z-index: 1;text-align: center;flex: 1;}
.e-step.done::after {transform: scaleX(1);}
.dot {width: 18px;height: 18px;background: #dee2e6;border-radius: 50%;margin: 0 auto;transition: all 0.3s ease;}
.e-step.done .dot {background: black;}
.e-step.active .dot {width: 18px;height: 18px;background: darkgray;position: relative;}
.e-step.active .dot::after {content: "";position: absolute;inset: -2px;border-radius: 50%;box-shadow: 0 0 0 0 rgba(169, 169, 169, 0.6);animation: pulse 1.0s ease-out infinite;}
@keyframes pulse {0% {box-shadow: 0 0 0 0 rgba(169, 169, 169, 0.6); opacity: 1;} 100% { box-shadow: 0 0 0 10px rgba(169, 169, 169, 0); opacity: 0; }}
.e-step span {display: block;margin-top: 10px;color: #989fa5;font-size: 12px;transition: color 0.3s ease;}
.e-step.done span{color: black;font-weight: 500;  }
.e-step.active span {color: darkgray;font-weight: 500;}
@keyframes progress-bar-stripes {0% { background-position-x: 1rem; }100% { background-position-x: 0; }}
@keyframes slideShine {0% {background-position: 200% 0;} 100% {background-position: -200% 0;}}
.slide-handle{position: absolute;left: 0;top: 0;height: 50px;width: 50px;background: var(--back);border-radius: 50%;display: flex;align-items: center;justify-content: center;color: #fff;cursor: pointer;touch-action: none;}
.fee-item-order{margin: 0; text-align: center; font-size: 12px; color: darkblue; font-weight: bold; padding: 2px}
.user-report-card-body{padding: 2px 10px !important}
.user-report-card-header{padding: 2px 10px !important; font-size: 14px;}
.legend-box {width: 12px;height: 12px;border-radius: 3px;display: inline-block;}
.bg-red, .text-bg-red{background-color: darkred !important; color: white !important;}
.border-red{border-color: darkred !important;}
.text-red, .text-red p{color:darkred}
.bg-grey, .text-bg-grey{background-color: #555555 !important; color: white !important;}
.border-grey{border-color: #555555 !important;}
.text-grey, .text-grey p{color: #555555}
.bg-yellow, .text-bg-yellow{background-color: #bda800 !important; color: white !important;}
.border-yellow{border-color: #bda800 !important;}
.text-yellow, .text-yellow p{color: #bda800;}
.text-red p, .text-yellow p{text-decoration: line-through;}
.bg-green, .text-bg-green{background-color: darkgreen !important; color: white !important;}
.border-green{border-color: darkgreen !important;}
.text-green, .text-green p{color: darkgreen}
.bg-blue, .text-bg-blue{background-color: darkblue !important; color: white !important;}
.border-blue{border-color: darkblue !important;}
.text-blue, .text-blue p{color: darkblue !important}
.manager-transaction-card-header{background: var(--back) !important; color: white !important;}
.progress-manager .progress-bar-manager{background-color: var(--back) !important;}
.transactions-card-manager-buttons-div span.badge{padding: 5px 12px; min-width: 40px; font-size: 14px !important;}
.transactions-card-manager-buttons-div span.text-bg-red{padding: 5px 8px !important; min-width: 35px; font-size: 12px !important; margin: 0 2px;}
.text-decoration-none{text-decoration: none;}
.label-right{float: inline-end;}
.back-setting-color{color: darkcyan}
.network-bullet{padding-left: 3px; opacity: 0.5;}
.price-number-sell-self{color: darkred;}
.price-number-buy-self{color: darkgreen;}
.price-number {backface-visibility: hidden; transform: translateZ(0); will-change: transform, opacity;}
.text-sell-others .price-number-sell-others{font-weight: bold; color:darkred}
.text-buy-others .price-number-buy-others{font-weight: bold; color: darkgreen;}
.history-red{color:darkred !important; font-weight: bold;}
.history-green{color:darkgreen !important; font-weight: bold;}
.table-fixed {table-layout: fixed;width: max-content;min-width: 100%;}
.table-fixed th,
.table-fixed td {white-space: nowrap;word-break: break-word;vertical-align: top;}
.table-fixed th:nth-child(1),
.table-fixed td:nth-child(1) { width: 40px; }
.table-fixed th:nth-child(2),
.table-fixed td:nth-child(2) { width: 150px; }
.table-fixed th:nth-child(3),
.table-fixed td:nth-child(3) { width: 125px; }
.table-fixed th:nth-child(4),
.table-fixed td:nth-child(4) { width: 120px; }
.table-fixed th:nth-child(5),
.table-fixed td:nth-child(5) { width: 125px; }
.table-fixed th:nth-child(6),
.table-fixed td:nth-child(6) { width: 120px; }
.table-fixed th:nth-child(7),
.table-fixed td:nth-child(7) { width: 125px; }
.table-fixed th:nth-child(8),
.table-fixed td:nth-child(8) { width: 130px; direction: ltr;}
.table-fixed th,
.table-fixed td {white-space: normal;word-break: break-word; vertical-align: top;}
.rtl-scroll{direction: rtl;}
.rtl-scroll table{direction: rtl;}
.others-list {max-height: 73px; overflow-y: auto;}
input.telegram-code-input{border-radius: 0px !important; font-size: 12px;}
@media print {
  .no-print-scroll {max-height: none !important;overflow: visible !important;}
  .table-responsive {overflow: visible !important;}
  tr {page-break-inside: avoid;}
  thead {display: table-header-group;}
}
@media only screen and (min-width: 991px) {
    .offcanvas, .offcanvas-lg, .offcanvas-md, .offcanvas-sm, .offcanvas-xl, .offcanvas-xxl{--bs-offcanvas-width: 250px}
    body {overflow: visible !important; margin-left: 260px;}
    .offcanvas.offcanvas-start {visibility: visible;transform: translateX(0); border-right: 0px;}
    /* .offcanvas-backdrop {display: none;} */
    .offcanvas-bottom{padding: 20px 80px; left: 260px !important;}
    .offcanvas-bottom .offcanvas-header, .offcanvas-bottom .offcanvas-body{width: 600px; margin: auto;}
    .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl{padding-left: calc(var(--bs-gutter-x) * .8);}
}
@media only screen and (max-width: 667px) {
    .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl{padding: 0 9px;}
}
@media only screen and (max-width: 600px) {
    .modal-dialog-scrollable .modal-content{max-height: 93% !important;}
    .ol_help{margin-bottom: 8px;}
    .login-class{display: block}
    .desktop-content{display: none;}
    .content{display: contents;}
    .content-inner{width: 92%; margin: 0 auto;}
    .mobile-navbar{display: contents;}
    .mobile-navbar .row{position: fixed; bottom: 0; width: 100%; margin:auto; padding-bottom: 10px; border-top: 1px solid var(--back); box-shadow: 6px 7px 13px 1px var(--back);}
    .mobile-navbar .row .col{color: var(--back); text-align: center; padding-top: 10px;}
}