.zaringcatg-breadcrumb{ width:100%; margin:0 0 10px; direction:rtl; } .zaringcatg-breadcrumb__scroller{ width:100%; overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch; scroll-behavior:smooth; scrollbar-width:thin; scrollbar-color:#d4d4d4 #f3f3f3; padding:0 0 5px; } .zaringcatg-breadcrumb__scroller::-webkit-scrollbar{ height:4px; } .zaringcatg-breadcrumb__scroller::-webkit-scrollbar-track{ background:#f3f3f3; border-radius:999px; } .zaringcatg-breadcrumb__scroller::-webkit-scrollbar-thumb{ background:#d4d4d4; border-radius:999px; } .zaringcatg-breadcrumb__scroller::-webkit-scrollbar-thumb:hover{ background:#bbbbbb; } .zaringcatg-breadcrumb__list{ list-style:none; margin:0; padding:0; display:inline-flex; align-items:center; flex-wrap:nowrap; gap:4px; min-width:max-content; } .zaringcatg-breadcrumb__item{ display:inline-flex; align-items:center; gap:4px; flex:0 0 auto; min-width:0; } .zaringcatg-breadcrumb__link, .zaringcatg-breadcrumb__current{ display:inline-flex; align-items:center; gap:4px; min-width:0; flex:0 0 auto; max-width:180px; padding:2px 0; text-decoration:none; background:transparent; border:none; box-shadow:none; line-height:1.45; white-space:nowrap; } .zaringcatg-breadcrumb__link{ color:#6b7280; transition:color .18s ease; } .zaringcatg-breadcrumb__link:hover{ color:#374151; } .zaringcatg-breadcrumb__current{ color:#eab308; } .zaringcatg-breadcrumb__icon{ width:13px; height:13px; display:inline-flex; align-items:center; justify-content:center; flex:0 0 13px; color:currentColor; opacity:.95; } .zaringcatg-breadcrumb__icon svg{ width:100%; height:100%; display:block; } .zaringcatg-breadcrumb__text{ display:inline-block; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11px; font-weight:500; max-width:140px; } .zaringcatg-breadcrumb__sep{ width:10px; height:10px; display:inline-flex; align-items:center; justify-content:center; flex:0 0 10px; color:#c7c7c7; } .zaringcatg-breadcrumb__sep svg{ width:100%; height:100%; display:block; } @media (max-width:991px){ .zaringcatg-breadcrumb__link, .zaringcatg-breadcrumb__current{ max-width:160px; } .zaringcatg-breadcrumb__text{ font-size:10.5px; max-width:120px; } } @media (max-width:767px){ .zaringcatg-breadcrumb{ margin-bottom:8px; } .zaringcatg-breadcrumb__scroller{ padding-bottom:5px; } .zaringcatg-breadcrumb__list{ gap:3px; } .zaringcatg-breadcrumb__item{ gap:3px; } .zaringcatg-breadcrumb__link, .zaringcatg-breadcrumb__current{ max-width:135px; gap:3px; padding:1px 0; } .zaringcatg-breadcrumb__text{ font-size:10px; max-width:92px; } .zaringcatg-breadcrumb__icon{ width:12px; height:12px; flex:0 0 12px; } .zaringcatg-breadcrumb__sep{ width:9px; height:9px; flex:0 0 9px; } } @media (max-width:480px){ .zaringcatg-breadcrumb__link, .zaringcatg-breadcrumb__current{ max-width:120px; } .zaringcatg-breadcrumb__text{ max-width:78px; } }