.vesna-filter-panel__sortby { position: relative; } .vesna-sortby { position: relative; display: inline-block; } .vesna-sortby__toggle { display: flex; align-items: center; gap: 8px; background: #ffffff; border-radius: 6px; padding: 10px 16px; font-size: 14px; font-weight: 500; color: #333; cursor: pointer; transition: all 0.3s ease; justify-content: space-between; } .vesna-sortby__toggle:hover { background: transparent; } .vesna-sortby__icon { width: 10px; height: 10px; transition: transform 0.3s ease; flex-shrink: 0; } .vesna-sortby__toggle.open .vesna-sortby__icon { transform: rotate(180deg); } .vesna-sortby__dropdown { position: absolute; top: 100%; right: 0; z-index: 12; background: #fff; border: 1px solid #ddd; min-width: 170px; margin-top: 6px; padding: 0; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08); } .vesna-sortby__item { margin: 0; padding: 0; } .vesna-sortby__option { width: 100%; background: none; border: none; padding: 10px 16px; text-align: left; font-size: 14px; font-weight: 400; color: #333; cursor: pointer; transition: background-color 0.3s ease; display: block; } @media (max-width: 768px) { .vesna-sortby__toggle { padding: 8px 12px; font-size: 13px; min-width: 140px; } .vesna-sortby__dropdown { min-width: 180px; } .vesna-sortby__option { padding: 8px 12px; font-size: 13px; } }