.campaign-banner{position:relative}.campaign-banner .campaign-btn{display:flex;justify-content:space-between;width:100%;position:absolute;top:0;padding:12px;align-items:center}.campaign-banner .campaign-btn.scrolled{display:flex;justify-content:space-between;width:100%;max-width:425px;position:fixed;background:white;z-index:10;top:0;padding:12px;align-items:center}.campaign-banner .item-search{width:100%;height:38px;display:flex;align-items:center;right:0;position:relative}.campaign-banner .item-search .button-icon-search{position:absolute;background:unset;height:38px;border:unset;top:0;left:14px;bottom:0;display:flex;align-items:center;pointer-events:none}.campaign-banner .item-search input{display:block;width:100%;height:38px;padding-inline-start:2.5rem;--tw-text-opacity: 1;border:none;border-radius:8px;color:#fff;font-size:14px;font-weight:500;line-height:20px;background:rgba(44,42,42,.3)}.campaign-banner .item-search input:focus{outline:0;border:none}.campaign-banner .item-search input::-moz-placeholder{color:#fff}.campaign-banner .item-search input::placeholder{color:#fff}.campaign-banner .title-banner>img{position:absolute;top:64px;left:0;flex-shrink:0}.campaign-body{border-radius:12px;width:100%;max-width:460px;background:var(--Neutral-Grey-100, #F5F5F5)}.campaign-body .top-bar{display:flex;width:100%;position:absolute;top:-45px;align-items:end}.campaign-body .top-bar .active{position:relative;display:flex;width:50%;height:45px;padding:var(--6px, 6px) var(--Spacing-4, 16px);justify-content:center;align-items:center;gap:8px;border-radius:var(--Spacing-3, 12px) var(--Spacing-0, 0px) var(--Spacing-0, 0px) var(--Spacing-0, 0px);background:#FFF;box-shadow:-9px -9px 21.1px #0000000f}.campaign-body .top-bar .active .title-video{color:#9471fd;text-align:center;font-size:16px;font-weight:600;line-height:18px}.campaign-body .top-bar .active .title-live{color:#f55b5b;text-align:center;font-size:16px;font-weight:600;line-height:18px}.campaign-body .top-bar .un-active{display:flex;width:50%;height:41px;padding:var(--Spacing-0, 0px) 8px 1px var(--Spacing-1, 4px);justify-content:center;align-items:center;gap:8px;flex-shrink:0;border-radius:var(--Spacing-0, 0px) var(--Spacing-3, 12px) var(--Spacing-0, 0px) var(--Spacing-0, 0px);background:var(--Neutral-Grey-100, #F5F5F5)}.campaign-body .top-bar .un-active>span{color:var(--Neutral-Grey-700, #434343);text-align:center;font-size:14px;font-weight:500;line-height:18px}.campaign-body .sort{width:100%;display:flex;padding:12px 80px 12px 12px;justify-content:flex-start;align-items:center;height:60px;flex-shrink:0;background:linear-gradient(180deg,#FFF 40%,rgba(255,255,255,.1) 100%);overflow-x:auto;white-space:nowrap}.campaign-body .sort .item-sort{display:inline-flex;align-items:center;justify-content:center;gap:8px;color:var(--Neutral-Grey-400, #A5A5A5);text-align:center;font-size:14px;font-weight:500;line-height:18px;cursor:pointer;min-width:30%}.campaign-body .sort .item-sort.active{color:var(--Neutral-Grey-700, #434343)}.campaign-body .sort .item-sort.reverse svg{transform:rotateX(180deg)}.campaign-body .filter{display:flex;height:32px;padding:var(--Spacing-1, 4px) 12px;justify-content:center;align-items:center;gap:8px;background:linear-gradient(180deg,#FFF 70%,rgba(255,255,255,.1) 100%);position:absolute;right:0}.campaign-body .filter>span{color:var(--Neutral-Grey-500, #767676);text-align:center;font-size:14px;font-weight:500;line-height:18px}.campaign-body .sort::-webkit-scrollbar{display:none}.campaign-body .campaign-list{background:var(--Neutral-Grey-100, #F5F5F5);display:grid;padding:0 14px;display:flex;flex-direction:column;gap:14px}.campaign-body .campaign-list .campaign-detail{display:flex;padding:12px;flex-direction:column;align-items:flex-start;gap:8px;position:relative;align-self:stretch;border-radius:var(--Spacing-3, 12px);background:#FFF}.campaign-body .campaign-list .campaign-detail>div:first-child{display:flex;gap:12px;width:100%}.campaign-body .campaign-list .campaign-detail>div:first-child .title{color:var(--Neutral-Grey-800, #292929);font-size:14px;font-weight:500;line-height:20px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.campaign-body .campaign-list .campaign-detail>div:first-child .tag{display:flex;gap:8px;flex-wrap:wrap}.campaign-body .campaign-list .campaign-detail>div:first-child .tag .commission{width:-moz-fit-content;width:fit-content;justify-content:center;display:flex;padding:var(--Spacing-0, 0px) 4px;align-items:center;gap:4px;border-radius:4px;background:var(--Neutral-Grey-900, #1A1A1A);box-shadow:-1px 0 #5cf7f2,1px 0 #ff5475}.campaign-body .campaign-list .campaign-detail>div:first-child .tag .commission>span{color:var(--Neutral-Grey-0, #FFF);font-size:10px;font-weight:500;line-height:15.608px}.campaign-body .campaign-list .campaign-detail>div:first-child .tag .commission>div{width:1px;height:var(--Spacing-2, 8px);border-radius:var(--Spacing-2, 8px);background:#959595}.campaign-body .campaign-list .campaign-detail>div:first-child .tag .streamer-deals{width:-moz-fit-content;width:fit-content;border-radius:4px;background:#FFEBEF;display:flex;padding:4px;align-items:center;gap:4px;color:#f4244d;font-size:10px;font-style:normal;font-weight:600;line-height:12px}.campaign-body .campaign-list .campaign-detail>div:first-child .voucher-campaign{display:flex;justify-content:space-between;align-items:center}.campaign-body .campaign-list .campaign-detail>div:first-child .voucher-campaign>div:first-child>span{color:#737373;font-size:11px;font-style:normal;font-weight:500;line-height:14px}.campaign-body .campaign-list .campaign-detail>div:first-child .voucher-campaign .number-voucher{height:8px;border-radius:4px;background:var(--Neutral-Grey-100, #FEDAE1)}.campaign-body .campaign-list .campaign-detail>div:first-child .voucher-campaign .number-voucher .filled-part{position:relative;height:8px;border-radius:4px;background:var(--Primary-500, #EF4444)}.campaign-body .campaign-list .campaign-detail>div:first-child .voucher-campaign .views{display:grid}.campaign-body .campaign-list .campaign-detail>div:first-child .voucher-campaign .views .image{display:flex;align-items:center;justify-content:end}.campaign-body .campaign-list .campaign-detail>div:first-child .voucher-campaign .views .image>img{width:20px;height:20px;border-radius:var(--Spacing-0, 18px);background:lightgray 50%/cover no-repeat;margin-left:-5px}.campaign-body .campaign-list .campaign-detail>div:first-child .voucher-campaign .views>span{color:#737373;font-size:12px;font-weight:500;line-height:14px}.campaign-body .campaign-list .campaign-detail>div:last-child{display:flex;justify-content:space-between;align-items:center;width:100%}.campaign-body .campaign-list .campaign-detail>div:last-child .budget>span{color:#737373;font-size:13px;font-weight:600;line-height:14px}.campaign-body .campaign-list .campaign-detail>div:last-child .budget>p{color:var(--primary-600-main, #D7002B);font-size:14px;font-weight:600;line-height:24px;margin-bottom:0}.campaign-body .campaign-list .campaign-detail>div:last-child .action-join{display:flex;padding:6px 12px;justify-content:center;align-items:center;gap:8px;border-radius:var(--Spacing-6, 32px);background:var(--primary-600-main, #D7002B)}.campaign-body .campaign-list .campaign-detail>div:last-child .action-join>span{color:#fff;text-align:center;font-size:14px;font-weight:500;line-height:14px}.campaign-body .campaign-list .campaign-detail .bonus{display:flex;width:124px;height:22px;padding:1px 7px;flex-direction:column;justify-content:center;align-items:flex-start;gap:8px;border-radius:var(--Spacing-3, 12px) var(--Spacing-0, 0px);background:linear-gradient(90deg,#ECD8FF 0%,#F5EAFF 100%);position:absolute;left:0;top:-6px}.campaign-body .campaign-list .campaign-detail .bonus>span{color:#9547ff;text-align:center;font-size:11px;font-weight:600;line-height:9.48px}.bg-opacity-show-filter{position:fixed;top:0;bottom:0;left:0;right:0;background-color:#000;opacity:.6;z-index:50}.filter-popup{position:fixed;bottom:0;left:0;right:0;width:100%;max-height:70vh;overflow-y:scroll;border-top-left-radius:.5rem;border-top-right-radius:.5rem;background-color:#fff;z-index:50;animation:slideUp 1s forwards}.filter-popup .filter-popup-top{display:flex;padding:12px;justify-content:space-between;align-items:flex-start;align-self:stretch;position:fixed;width:100%;background:white;border-radius:8px}.filter-popup .filter-popup-top .resrt-filter{color:var(--primary-600-main, var(--Primary-Primary, #D7002B));font-size:14px;font-weight:500;line-height:20px;width:49px;flex-shrink:0}.filter-popup .filter-popup-top .title-filter{color:var(--Base-Gr-Darker-900, #393E40);text-align:center;font-size:16px;font-weight:700;line-height:24px}.filter-popup .filter-popup-top .icon-close-popup{display:flex;padding:.125rem}.filter-popup>div:not(:first-child){padding:16px 16px 0}.filter-popup .block-shop{display:grid;gap:4px;margin-top:10vw}.filter-popup .block-shop .title-filter{color:var(--Neutral-800, #383838);font-size:14px;font-weight:600;line-height:20px}.filter-popup .block-shop input{display:flex;padding:12px;width:100%;align-items:center;gap:43px;align-self:stretch;border-radius:var(--Spacing-2, 8px);border:1px solid var(--Neutral-Grey-200, #E6E6E6)}.filter-popup .block-shop input::-moz-placeholder{color:var(--Neutral-Grey-500, #767676);font-size:12px;font-weight:500;line-height:18px}.filter-popup .block-shop input::placeholder{color:var(--Neutral-Grey-500, #767676);font-size:12px;font-weight:500;line-height:18px}.filter-popup .block-shop input:focus{border:1px solid var(--Neutral-Grey-200, #E6E6E6);outline:none}.filter-popup .block-type{display:flex;flex-direction:column;align-items:flex-start;gap:8px;align-self:stretch}.filter-popup .block-type .title-filter{color:var(--Neutral-800, #383838);font-size:14px;font-weight:600;line-height:20px}.filter-popup .block-type .filter-option-button{display:flex;align-items:flex-start;align-content:flex-start;gap:8px;align-self:stretch;flex-wrap:wrap}.filter-popup .block-type .filter-option-button .block-type-item-active{display:flex;padding:var(--Spacing-1, 4px) 12px;flex-direction:column;align-items:flex-start;gap:10px;border-radius:var(--24px, 24px);border:1px solid var(--Primary-Primary, #D7002B);background:#fff}.filter-popup .block-type .filter-option-button .block-type-item-active>span{color:var(--primary-600-main, var(--Primary-Primary, #D7002B));font-size:12px;font-weight:500;line-height:18px}.filter-popup .block-type .filter-option-button .block-type-item{display:flex;padding:var(--Spacing-1, 4px) 12px;flex-direction:column;align-items:flex-start;gap:10px;border-radius:var(--24px, 24px);border:1px solid #F1F1F1;background:#fff}.filter-popup .block-type .filter-option-button .block-type-item>span{color:var(--Neutral-Grey-700, #434343);font-size:12px;font-weight:500;line-height:18px}.filter-popup .block-salary{display:grid;gap:8px}.filter-popup .block-salary .title-filter{color:var(--Neutral-800, #383838);font-size:14px;font-weight:600;line-height:20px}.filter-popup .block-salary .input-salary{gap:16px;width:100%}.filter-popup .block-salary .input-salary>div{display:grid;gap:4px}.filter-popup .block-salary .input-salary>div>label{color:#000;font-size:12px;font-weight:500;line-height:18px}.filter-popup .block-salary .input-salary>div .input-container{display:flex;align-items:center;border-radius:4px;padding:4px 8px;border:1px solid var(--Neutral-Grey-200, #E6E6E6);gap:4px}.filter-popup .block-salary .input-salary>div .input-container>input{border:none;outline:none;flex:1;width:100%;display:flex;justify-content:space-between;align-items:center}.filter-popup .block-salary .input-salary>div .input-container>input::-moz-placeholder{color:var(--Neutral-Grey-500, #767676);font-size:12px;font-weight:500;line-height:18px}.filter-popup .block-salary .input-salary>div .input-container>input::placeholder{color:var(--Neutral-Grey-500, #767676);font-size:12px;font-weight:500;line-height:18px}.filter-popup .block-salary .input-salary>div .input-container>input:focus{border:none;outline:none}.filter-popup .block-salary .input-salary>div .input-container>span{display:flex;align-items:center;border-left:1px solid #E9E9E9;height:12px;padding-left:8px;color:#000;margin-left:4px;text-align:center;font-size:12px;font-weight:500;line-height:18px}.filter-popup .block-salary .filter-option-button{display:flex;align-items:flex-start;align-content:flex-start;gap:8px;align-self:stretch;flex-wrap:wrap}.filter-popup .block-salary .filter-option-button .block-salary-item-active{display:flex;padding:var(--Spacing-1, 4px) 12px;flex-direction:column;align-items:flex-start;gap:10px;border-radius:var(--24px, 24px);border:1px solid var(--Primary-Primary, #D7002B);background:#fff}.filter-popup .block-salary .filter-option-button .block-salary-item-active>span{color:var(--primary-600-main, var(--Primary-Primary, #D7002B));font-size:12px;font-weight:500;line-height:18px}.filter-popup .block-salary .filter-option-button .block-salary-item{display:flex;padding:var(--Spacing-1, 4px) 12px;flex-direction:column;align-items:flex-start;gap:10px;border-radius:var(--24px, 24px);border:1px solid #F1F1F1;background:#fff}.filter-popup .block-salary .filter-option-button .block-salary-item>span{color:var(--Neutral-Grey-700, #434343);font-size:12px;font-weight:500;line-height:18px}.filter-popup .block-follower{display:flex;flex-direction:column;align-items:flex-start;gap:8px;align-self:stretch}.filter-popup .block-follower .title-filter{color:var(--Neutral-800, #383838);font-size:14px;font-weight:600;line-height:20px}.filter-popup .block-follower .filter-option-button{display:flex;align-items:flex-start;align-content:flex-start;gap:8px;align-self:stretch;flex-wrap:wrap}.filter-popup .block-follower .filter-option-button .block-follower-item-active{display:flex;padding:var(--Spacing-1, 4px) 12px;flex-direction:column;align-items:flex-start;gap:10px;border-radius:var(--24px, 24px);border:1px solid var(--Primary-Primary, #D7002B);background:#fff}.filter-popup .block-follower .filter-option-button .block-follower-item-active>span{color:var(--primary-600-main, var(--Primary-Primary, #D7002B));font-size:12px;font-weight:500;line-height:18px}.filter-popup .block-follower .filter-option-button .block-follower-item{display:flex;padding:var(--Spacing-1, 4px) 12px;flex-direction:column;align-items:flex-start;gap:10px;border-radius:var(--24px, 24px);border:1px solid #F1F1F1;background:#fff}.filter-popup .block-follower .filter-option-button .block-follower-item>span{color:var(--Neutral-Grey-700, #434343);font-size:12px;font-weight:500;line-height:18px}.filter-popup .block-submit{padding-bottom:32px!important}.filter-popup .block-submit .submit-filter{width:100%;display:flex;padding:var(--inset-md, 12px) var(--inset-lg, 16px);justify-content:center;align-items:center;align-self:stretch;border-radius:var(--md, 8px);background:var(--Primary-Primary, #D7002B);border:none}.filter-popup .block-submit .submit-filter>span{color:var(--DarkOverlayElement-100, #FFF);font-size:14px;font-weight:700;line-height:20px}.top-bar div{transition:background-color .1s ease,transform .1s ease}.top-bar div.active{background-color:#f0f0f0;transform:scale(1.05)}.top-bar div.un-active{background-color:#fff}.no-record-product{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px;top:50%;left:50%;transform:translate(-50%,-50%);position:fixed;background:whitesmoke;width:100%;height:30%}.no-record-product>div:last-child{text-align:center}.no-record-product>div:last-child>div:first-child{margin-bottom:2px;color:var(--Neutral-Grey-800, #292929);text-align:center;font-size:16px;font-style:normal;font-weight:600;line-height:24px}.no-record-product>div:last-child>div:last-child{color:var(--Neutral-Grey-600, #767676);text-align:center;font-size:14px;font-style:normal;font-weight:400;line-height:20px}