.btn-float{
    position: fixed;
    bottom: 45px;
    left: 80px;
    z-index: 1000;
}
@media (max-width: 768px) {
    .btn-float {
        position: fixed;
        bottom: 20px;
        right: 24px;
        left: 24px;
        width: auto;
        z-index: 999;
    }

}
.ss02 {
    -moz-font-feature-settings: "ss02";
    -webkit-font-feature-settings: "ss02";
    font-feature-settings: "ss02";
}
.ss03 {
    -moz-font-feature-settings: "ss03";
    -webkit-font-feature-settings: "ss03";
    font-feature-settings: "ss03";
}

       /* ==========================================
          OTP - 6 Digit Input
       ========================================== */

   .otp-input-wrapper {
       width: 100%;
       display: flex;
       flex-direction: row;
       flex-wrap: nowrap;
       justify-content: center;
       align-items: center;
       gap: 10px;
       direction: ltr;
   }

.otp-digit {
    flex: 1 1 0;
    width: 100%;
    min-width: 0;
    max-width: 52px;
    height: 56px;

    padding: 0;

    text-align: center;
    direction: ltr;

    font-size: 23px;
    font-weight: 600;

    background-color: var(--vz-light);
    border: 1px solid var(--vz-border-color);
    border-radius: 10px;

    transition: all 0.18s ease;
}

.otp-digit:hover {
    border-color: rgba(var(--vz-primary-rgb), 0.35);
}

.otp-digit:focus {
    background-color: var(--vz-white);
    border-color: var(--vz-primary);

    box-shadow:
        0 0 0 3px rgba(var(--vz-primary-rgb), 0.10);

    outline: none;

    transform: translateY(-1px);
}

.otp-digit.is-invalid {
    border-color: var(--vz-danger) !important;

    box-shadow:
        0 0 0 3px rgba(var(--vz-danger-rgb), 0.08);
}

#otp-error {
    min-height: 20px;
    margin-top: 8px;
    font-size: 12px;
}


/* موبایل‌های کوچک */
@media (max-width: 400px) {

    .otp-input-wrapper {
        gap: 6px;
    }

    .otp-digit {
        max-width: 46px;
        height: 50px;
        font-size: 20px;
    }
}
.sla-percent {
    min-width: 58px;
    height: 36px;
    padding: 0 10px;
    border-radius: 10px;
    background: var(--vz-primary-bg-subtle, #eef2ff);
    color: var(--vz-primary, #405189);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 13px;
}

.empty-icon {
    width: 56px;
    height: 56px;
    margin: 0 auto;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--vz-light);
    color: var(--vz-secondary);
    font-size: 22px;
}

.sla-mini-box {
    padding: 12px;
    border: 1px solid var(--vz-border-color, #e9ebec);
    border-radius: 10px;
    background: var(--vz-light, #f8f9fa);
}

.avatar-md {
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn-soft-warning {
    background: rgba(247, 184, 75, .12);
    color: #f7b84b;
    border: 0;
}

.btn-soft-success {
    background: rgba(10, 179, 156, .12);
    color: #0ab39c;
    border: 0;
}

.sla-policy-option {
    display: flex;
    gap: 14px;
    padding: 18px;
    border: 1px solid var(--vz-border-color, #e9ebec);
    border-radius: 12px;
    cursor: pointer;
    transition: .2s ease;
}

.sla-policy-option:hover {
    border-color: var(--vz-primary, #405189);
    background: var(--vz-light, #f8f9fa);
}

.sla-policy-option:has(input:checked) {
    border-color: var(--vz-primary, #405189);
    background: rgba(64, 81, 137, .04);
}

.sla-policy-option input {
    flex: 0 0 auto;
}

.sla-policy-content {
    flex: 1;
    min-width: 0;
}
.app-menu #scrollbar {
    height: calc(100vh - 70px);
}

.app-menu #scrollbar .simplebar-wrapper,
.app-menu #scrollbar .simplebar-mask,
.app-menu #scrollbar .simplebar-offset {
    height: 100%;
}

.app-menu #scrollbar .simplebar-content-wrapper {
    height: 100%;
    overflow-y: auto !important;
    overflow-x: hidden;
}