.zarinvir-tabs-wrapper{ width:100%; direction:rtl; margin:0; overflow: hidden; } .zarinvir-tabs-container{ display:flex; width:100%; gap:8px; position:sticky; top:0; z-index:100; background:#ffffff; padding:6px 0; overflow-x:auto; -ms-overflow-style:none; scrollbar-width:none; } .zarinvir-tabs-container::-webkit-scrollbar{ display:none; } .zarinvir-tab-item{ flex:1 1 auto; min-width:max-content; display:flex; align-items:center; justify-content:center; gap:8px; padding:15px 10px; border-radius:8px; cursor:pointer; font-size:14px; font-weight:600; background:#f4f6fb; color:#4c5c84; white-space:nowrap; text-align:center; transition:background-color .15s ease,color .15s ease; } .zarinvir-tab-item:not(.zarinvir-tab-active):hover{ background:#e9edf7; } .zarinvir-tab-icon{ display:flex; align-items:center; justify-content:center; width:20px; height:20px; } .zarinvir-tab-icon svg{ width:100%; height:100%; display:block; } .zarinvir-tab-active{ background:#ffb900; color:#ffffff; } .zarinvir-tab-active:hover{ background:#ffb900; color:#ffffff; } @media(max-width:768px){ .zarinvir-tabs-container { justify-content: flex-start; } .zarinvir-tab-item{ font-size:13px; padding:10px 14px; flex: 0 0 auto; } } .zarinvir-title-block{ display:flex; align-items:flex-start; gap:14px; width:100%; direction:rtl; box-sizing:border-box; } .zarinvir-title-block__icon{ flex:0 0 auto; width:34px; height:34px; display:flex; align-items:flex-start; justify-content:center; margin-top:3px; color:#ffb900; } .zarinvir-title-block__icon svg{ width:34px; height:34px; display:block; } .zarinvir-title-block__content{ display:flex; flex-direction:column; gap:6px; min-width:0; } .zarinvir-title-block__main{ display:flex; flex-wrap:wrap; align-items:baseline; gap:6px; font-size:24px; line-height:1.3; } .zarinvir-title-block__first{ font-weight:800; color:#111827; position:relative; transition:all .25s ease; } .zarinvir-title-block__second, .zarinvir-title-block__version-value{ font-weight:700; color:#ffb900; } .zarinvir-title-block__divider{ width:120px; height:3px; border-radius:4px; background:linear-gradient(to left,#ffb900,#ffd65c,transparent); } .zarinvir-title-block__sub{ font-size:13px; color:#6b7280; direction:ltr; text-align:right; line-height:1.4; } @media (max-width:768px){ .zarinvir-title-block{ gap:10px; } .zarinvir-title-block__icon{ width:30px; height:30px; } .zarinvir-title-block__icon svg{ width:30px; height:30px; } .zarinvir-title-block__main{ font-size:20px; } .zarinvir-title-block__divider{ width:90px; height:2.5px; } .zarinvir-title-block__sub{ font-size:12px; } }