.topic-widget-container{position: relative; z-index: 2; height: 50px; display: flex; margin: var(--size-3) 0;}
.topic-widget-container .width-max{max-width:var(--body-container) ; width: 100%; margin: 0 auto;}
.topic-widget-wrapper{display: flex; justify-content: space-between; align-items: center; padding: 0 0 0 var(--size-3); gap: var(--size-2); width: 100%; height: 100%; align-items: center; background: #fbf4f4 !important; border: 1px solid #9A1E23; border-radius: 8px; overflow: hidden;}
.topic-widget-wrapper .tw-title{font-weight: 700; text-transform: uppercase; color: #9A1E23; font-size: 10px; text-wrap: nowrap;}
.tw-title-container{display: flex; align-items: center; gap: var(--size-1); width: 120px;}
.tw-list-row-container{display: flex; gap: 2px;}
.tw-list-row{display: flex; align-items: center;}
a.btn-tw-list-row{ max-width: 30ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; padding: 2px 8px !important; border: none; border-radius: 16px; background: #feeae6 !important; color: #212121 !important; cursor: pointer; font-size: 10px; text-transform: none !important; }
a.btn-tw-list-row:hover{background: #ce282d !important; color:#FFFFFF !important;}
.tw-list-row-container{overflow: scroll; scrollbar-width: none; -ms-overflow-style: none;}
.tw-list-row-container::-webkit-scrollbar { display: none; }


@media screen and (min-width:0px) and (max-width:1023px){
    .topic-widget-container{margin-left: 5px; margin-right: 5px; padding-bottom: 13px;}
    .tw-title-container .svgicon{width: 16px !important;}
}
@media screen and (min-width:1024px){
    .topic-widget-wrapper .tw-title{font-size: 12px;}
    a.btn-tw-list-row{font-size: 12px;}
}