.brand-logo {
    display: inline-flex;
    align-items: baseline;
    justify-content: center;
    gap: 0;
    font-weight: 800;
    letter-spacing: -0.5px;
    line-height: 1;
    user-select: none;
    direction: rtl;
}

.brand-logo--sm { font-size: 14px; }
.brand-logo--sidebar { font-size: 0.875rem; }
.brand-logo--md { font-size: 20px; }
.brand-logo--lg { font-size: 28px; }
.brand-logo--xl { font-size: 36px; }

.brand-logo .brand-v {
    color: #10b981;
}

.brand-logo .brand-cloud {
    color: #0f172a;
    transition: color 0.3s ease;
}

.dark .brand-logo .brand-cloud,
body.dark-mode .brand-logo .brand-cloud {
    color: #ffffff;
}

.brand-logo .brand-os {
    font-size: 0.42em;
    font-weight: 700;
    line-height: 1;
    margin-left: 2px;
    position: relative;
    top: -0.45em;
    color: #64748b;
    transition: color 0.3s ease;
}

.dark .brand-logo .brand-os,
body.dark-mode .brand-logo .brand-os {
    color: #94a3b8;
}