.zmb2-nav { font-family: 'Zarin-font', Tahoma, Arial, sans-serif; direction: rtl; z-index: 1000; position: relative; } .zmb2-root { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 10px 0; font-size: 16px; font-weight: 500; color: #fff; } .zmb2-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 4px 0; } a.zmb2-link { color: #ffffff !important; text-decoration: none; padding: 8px 6px; font-size: 15px; display: inline-flex; align-items: center; flex: 1; } .zmb2-root > .zmb2-item > .zmb2-row > .zmb2-link { font-weight: 600; font-size: 15px; } .zmb2-sub { list-style: none; margin: 0; padding: 0 15px 0 0; background: transparent; display: block; max-height: 0; overflow: hidden; flex-direction: column; gap: 5px; transition: max-height 0.3s ease-in-out; } .zmb2-sub .zmb2-link { font-weight: 500; color: #f7f7f7 !important; font-size: 14px; } .zmb2-item.zmb2-open > .zmb2-sub { max-height: 500px; } .zmb2-toggle { background: none; border: none; cursor: pointer; padding: 6px; display: flex; align-items: center; justify-content: center; margin-right: 6px; width: 40px; height: 40px; border-radius: 4px; } @media (max-width: 768px) { .zmb2-root { flex-direction: column; } }