@charset "UTF-8";

/* ▶ 배팅 슬립  */
.lsr_start{position: sticky; top: 75px;}/*  */
.lsr_container { width: 420px; background: var(--lsr_card_bg); border-radius: 8px; padding: 16px; border:1px solid var(--lsr_card_bd); box-shadow: 0 4px 8px rgba(0,0,0,0.05); }
.lsr_tab_wrapper { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 8px; margin-bottom: 8px; }
.lsr_tab { position: relative; text-align: center; }
.lsr_tab .lsr_tab_btn{width: 100%; padding: 13px 0; border: 1px solid var(--common_opc_border); border-radius: 8px; }
.lsr_tab .lsr_tab_btn span{font-size: 16px; padding-left: 30px; position: relative; color: var(--common_txt); }
.lsr_tab .lsr_tab_btn.cart span{ padding-left: 27px;}
.lsr_tab .lsr_tab_btn span::before{content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); background-position: center; background-repeat: no-repeat; background-size: contain;}
.lsr_tab .lsr_tab_btn.cart span::before{background-image: var(--lsr_ico_cart); width: 22px; height: 22px; top: 40%;}
.lsr_tab .lsr_tab_btn.log span::before{background-image: var(--lsr_ico_log); width: 26px; height: 20px;}

.lsr_tab.on .lsr_tab_btn{border: 1px solid var(--main_blue);}
.lsr_tab.on .lsr_tab_btn span{ color: var(--main_blue); }
.lsr_tab.on .lsr_tab_btn.cart span::before{background-image: var(--lsr_ico_cart_on); }
.lsr_tab.on .lsr_tab_btn.log span::before{background-image: var(--lsr_ico_log_on);}

.lsr_badge { position: absolute; top: 3px; right: 4px; font-size: 12px; font-weight: 600; display: inline-block; padding: 3px; border-radius: 20px; min-width: 20px; }
.lsr_badge.mg { background: #F4288B; color: #FFF; }
.lsr_badge.bl { background: #2D45A3; color: #FFF; }

.lsr_tab_swiper {overflow: hidden;min-height: 510px;}
.lsr_cart_in{max-height: calc(100vh - 155px); overflow-y: auto;}
.lsr_tab_swiper .swiper-wrapper .lsr_append_bill.swiper-slide{max-height: calc(100vh - 155px); overflow-y: auto;}
.lsr_tab_swiper .swiper-wrapper .lsr_append_bill.swiper-slide::-webkit-scrollbar, .lsr_cart_in::-webkit-scrollbar {width: 5px;}
.lsr_tab_swiper .swiper-wrapper .lsr_append_bill.swiper-slide::-webkit-scrollbar-track, .lsr_cart_in::-webkit-scrollbar-track {background: transparent;border-radius: 10px;}
.lsr_tab_swiper .swiper-wrapper .lsr_append_bill.swiper-slide::-webkit-scrollbar-thumb, .lsr_cart_in::-webkit-scrollbar-thumb {background-color: var(--common_txt_opc);border-radius: 10px;}
.empty_st_cart{font-size: 15px; padding: 10px 12px; border-radius: 5px; background: var(--input_bg_opc); color: var(--common_txt); text-align: center;}

.lsr_calc_wrap{margin-bottom: 10px;}
.lsrc_row{display: grid; grid-template-columns: 45% 55%; align-items: center; column-gap: 3px; padding: 10px 12px; border-bottom: 1px solid var(--common_opc_border);}
.lsrc_row div span{font-size: 15px; color: var(--common_txt);}
.lsrc_row div.int{text-align: right;}
.lsrc_row div.int.mycoin span{position: relative; padding-left: 20px;}
.lsrc_row div.int.mycoin span::before{content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); background-image: url("/assets/images/ico_coupon_sm.png"); background-repeat: no-repeat; background-size: contain; background-position: center; width: 18px; height: 18px; }
.lsrc_row div.bl span{color: var(--main_blue);}
.lsrc_row div.bo span{font-weight: bold;}
.lsrc_row div.rd span{color: #FA2828;}
.lsrc_row div.yl span{color: #FFC300;}
.lsrc_row div.fx span{color: var(--common_txt_opc);}
.lsrc_row.in_inp{padding: 3px 7px 3px 12px;}
.lsrc_row div.int input{width: 100%; height: 100%; background: var(--input_bg_opc); color: #FA2828; font-size: 15px; font-weight: 600; padding: 5px; border-radius: 5px; text-align: right;}
.lsrc_row div.int input::placeholder{font-weight: 400; color: var(--common_txt_opc); font-size: 13px;}


.lsr_quick_btn_grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; margin-bottom: 5px; }
.lsr_q_btn_wrap{}
.lsr_q_btn_wrap .lsr_quick_btn{width: 100%; font-size: 16px; padding: 10px 0; border-radius: 5px; border: 1px solid var(--common_light_border); color: var(--common_txt); background: var(--lsr_quick_btn_bg);}
.lsr_q_btn_wrap .lsr_quick_btn.dk{background: var(--lsr_quick_btn_dk_bg); color: #FFF;}

.lsr_final_btn_grid {display: grid;grid-template-columns: repeat(3, 1fr);column-gap: 5px;}
.lsr_final_btn_grid .left {grid-column: span 2;}
.lsr_final_btn_grid .right{display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 3px;}
.lsr_f_l_btn{width: 100%; padding: 15px 0; background: var(--main_blue); border-radius: 5px;}
.lsr_f_l_btn span{position: relative; padding-left: 25px; font-size: 16px; font-weight: bold; color: #FFF;}
.lsr_f_l_btn span::before{content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 20px; height: 20px; background-image: url("/assets/images/sports/icon/ico_st_coin_wh.png"); background-repeat: no-repeat; background-size: contain; background-position: center;}
.lsr_f_r_btn { position: relative; width: 100%; padding: 15px 0; border: 1px solid var(--common_light_border); border-radius: 5px; background: var(--lsr_quick_btn_bg); overflow: hidden; }
.lsr_f_r_btn.clear::before,
.lsr_f_r_btn.refresh::before { content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 28px; height: 28px; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; }
.lsr_f_r_btn.clear::before { background-image: var(--lsr_ico_clear); width: 26px; height: 26px; }
.lsr_f_r_btn.refresh::before { background-image: var(--lsr_ico_refresh); width: 23px; height: 23px; }
.lsr_quick_btn:hover,.lsr_f_l_btn:hover,.lsr_tab_btn:hover, .lsr_f_r_btn:hover {filter: brightness(0.9);}
.st_cart_list_start{}/* max-height: 380px; overflow-y: auto; */
.st_cart_list_start::-webkit-scrollbar {width: 5px;}
.st_cart_list_start::-webkit-scrollbar-track {background: transparent;border-radius: 10px;}
.st_cart_list_start::-webkit-scrollbar-thumb {background-color: var(--common_txt_opc);border-radius: 10px;}
/* ▶ 배팅 슬립  */

/* ▶ 배팅카트 아이템   */
.stc_row{padding: 10px; border-radius: 5px; background: var(--lsr_cart_item_bg); position: relative; letter-spacing: -0.05px; margin-top: 5px;}
.del_this_bet { position: absolute; width: 20px; height: 20px; background: transparent; border: none; padding: 0; cursor: pointer; top: 10px; right: 10px; border-radius: 5px; }
.del_this_bet::before,
.del_this_bet::after { content: ''; position: absolute; left: 50%; top: 50%; width: 85%; height: 2px; border-radius: 20px; background-color: var(--common_txt); transform-origin: center; }
.del_this_bet::before { transform: translate(-50%,-50%) rotate(45deg); }
.del_this_bet::after { transform: translate(-50%,-50%) rotate(-45deg); }
.del_this_bet:hover{background: var(--common_opc_border);}
.stcr_team{font-size: 15px; color: var(--common_txt); margin-bottom: 3px; padding-right: 15px;}
.stcr_team.red{color:#EE280E; font-weight: 500 }
.stcr_team.grad {font-size: 16px; background: linear-gradient(180deg, #ffbc00 0%, #ff491e 100%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;text-shadow: 0 0 1px rgba(0,0,0,0.1);font-weight: 600;}
.stcr_team.bonus {font-size: 16px; color: #00C896; font-weight: 600;}
.stcr_flx{display: flex;align-items: center;justify-content: space-between; margin-top: 8px;}
.stcr_flx .left, .stcr_flx .right{display: flex;align-items: center; column-gap: 2px; flex-wrap: wrap;}
.stcr_flx .left > div{font-size: 14px; color: var(--common_txt_opc);}
.stcr_flx .right > div > span{font-size: 15px; color: var(--common_txt); font-weight: 500}
.stcr_flx .right > div > em{font-size: 15px; color: var(--common_txt); font-weight: 500}
.stcr_flx .right > div > em.pos{color: var(--main_blue);}
.stcr_flx .right > div > em.neg{color: #EE280E;}
.stcr_flx .right > div > em.bonus{color: #00C896;}
/* ▶ 배팅카트 아이템   */

/* ▶ 배팅내역 아이템ㅁ   */
.lsr_bill{border-radius: 5px; background: var(--input_bg_opc); border: 1px solid var(--common_opc_border); margin-bottom: 15px; }
.lsrb_hd{background: var(--lsrb_hd_bg); padding: 8px 12px; display: flex; align-items: center; column-gap: 3px; border-radius: 5px 5px 0 0;}
.lsrb_hd span{font-size: 16px; font-weight: 500; color: var(--common_txt);}
.lsrb_game_inf{position: relative; padding: 8px 12px; border-bottom: 1px solid var(--common_opc_border); background: var(--lsrb_game_inf_bg);}
.lsrb_status{position: absolute; top: 10px; right: 10px; font-size: 13px; font-weight: 600; color: var(--common_txt);}
.lsrb_status.wait{color: #FFA800 }
.lsrb_game_dt{font-size: 13px; color: var(--common_txt_opc); margin-bottom: 8px;}
.lsrb_team{font-size: 15px; color: var(--common_txt); margin-bottom: 3px;}
.lsrb_team.red{color:#EE280E; font-weight: 500 }
.lsrb_team.grad {font-size: 16px; background: linear-gradient(180deg, #ffbc00 0%, #ff491e 100%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;text-shadow: 0 0 1px rgba(0,0,0,0.1);font-weight: 600;}
.lsrb_team.bonus {font-size: 16px; color: #00C896; font-weight: 600;}
.lsrb_flx{display: flex;align-items: center;justify-content: space-between; margin-top: 8px;}
.lsrb_flx .left, .lsrb_flx .right{display: flex;align-items: center; column-gap: 2px; flex-wrap: wrap;}
.lsrb_flx .left > div{font-size: 14px; color: var(--common_txt_opc);}
.lsrb_flx .right > div > span{font-size: 15px; color: var(--common_txt); font-weight: 500}
.lsrb_flx .right > div > em{font-size: 15px; color: var(--common_txt); font-weight: 500}
.lsrb_flx .right > div > em.pos{color: var(--main_blue);}
.lsrb_flx .right > div > em.neg{color: #EE280E;}
.lsrb_flx .right > div > em.bonus{color: #00C896;}
.lsrb_bill_detail ul{padding: 8px 12px; background: var(--lsrb_bill_detail_bg); border-radius: 0 0 5px 5px;}
.lsrb_bill_detail ul li{ display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.lsrb_bill_detail ul li:last-child{margin-bottom: 0;}
.lsrb_bill_detail ul li .lb{font-size: 14px; color: var(--common_txt_opc);}
.lsrb_bill_detail ul li .val{font-size: 14px; color: var(--common_txt);}
.empty_bill{font-size: 17px; color: var(--common_txt_opc); text-align: center; margin-top: 150px;}
/* ▶ 배팅내역 아이템ㅁ   */

.st_cat_grid{display: grid; grid-template-columns: repeat(10, 1fr); column-gap: 5px;}
.st_cat_item{padding: 8px 0; border: 1px solid var(--st_cat_bd); border-radius: 5px; background: var(--st_cat_bg); cursor: pointer; }
.st_cat_item.on{ border-color: var(--st_cat_bd_on); }
.st_cat_item:hover{ background: var(--st_cat_bg_hv); }
.st_cat_item .ill{width: 36px; height: 36px; margin: 0 auto 7px; line-height: 36px; }
.st_cat_item .ill img{ width: 100%; vertical-align: middle; }
.st_cat_item .tt{text-align: center; font-size: 13px; color: var(--common_txt); margin: 0 auto 5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 75px }
.st_cat_item .cnt{ text-align: center; margin: 0 10px; padding: 3px 0; border-radius: 10px; font-size: 13px; color: var(--st_cat_cnt_txt); background: var(--st_cat_cnt_bg) }
.st_cat_item.on .cnt{ background: var(--st_cat_cnt_bg_on);color: var(--st_cat_cnt_txt_on);  }


.st_folder{border: 1px solid var(--st_fold_bd); margin-bottom: 15px; display: block; transition: opacity 0.3s ease; border-bottom: 0;}
.st_folder.close {opacity: 0;height: 0;overflow: hidden;padding: 0;margin: 0;pointer-events: none;position: absolute;}
.st_folder.bonus{border: 2px solid;border-image-slice: 1;border-image-source: linear-gradient(90.88deg, #FFAB24 0.52%, #F0FF1D 20.62%, #FB6C1F 44.56%, #FFAB24 72.79%, #FD8C22 100.07%); margin-bottom: 10px;}
.st_folder_inner{}

.stf_hd{display: flex; align-items: center; column-gap: 5px; padding: 8px 15px; background: var(--stf_hd_bg); border-bottom: 1px solid var(--common_deep_border);}
.stf_hd .ill{width: 30px;}
.stf_hd .ill_flag{ width: 38px; height: 27px; position: relative;}
.stf_hd .ill_flag .fg{ position: absolute;width: 38px; height: 27px; background-size: contain; background-repeat: no-repeat; background-position: center}
.stf_hd .ill img{ width: 100%; vertical-align: middle;}
.stf_hd .txt{font-size: 17px; font-weight: 700; color: var(--stf_hd_txt);}
.stf_hd .txt.spe span{color: var(--stf_hd_txt);}
.st_folder.bonus .stf_hd .txt{color: #400F0F;}
.st_folder.bonus .stf_hd{background: #F9F3C5;}

.stf_m{}
.stf_m .stf_m_fi{ display: grid; align-items: center; grid-template-columns: 140px 110px 470px auto; column-gap: 3px; padding: 7px 12px; background: var(--stf_m_bg); border-bottom: 1px solid var(--common_deep_border);}
.stf_m .stf_m_fi.st_f_bonus_grid{ grid-template-columns: 140px 110px 470px auto; }
.stf_m .stf_m_fi .dt{ font-size: 16px; text-align: center; color: var(--stf_m_txt);}
.stf_m .stf_m_fi .b_type{display: flex; flex-direction: column; align-items: center; justify-content: center; row-gap: 3px; column-gap: 3px;}
.stf_m .stf_m_fi .b_type p{font-size: 13px; text-align: center; color: var(--stf_m_txt);}
.st_folder.bonus .stf_m .stf_m_fi .b_type p{font-size: 16px; text-align: center; color: var(--stf_m_txt);}

.stf_m .stf_m_fi .vs_grid{display: grid; grid-template-columns: 210px 1fr 210px; column-gap: 3px; justify-content: space-between;}
.stf_m .stf_m_fi .vs_grid .vs_inner{background: var(--stf_m_grad); border: 1px solid #000; border-radius: 5px; padding: 6px 8px; }
.stf_m .stf_m_fi .vs_grid .vs_inner.data_in{cursor: pointer;}
.stf_m .stf_m_fi .vs_grid .vs_inner.data_in.on{background: linear-gradient(180deg, #FFD54A 0%, #FF9257 100%);border: 1px solid #E34C15;}
.stf_m .stf_m_fi .vs_grid .vs_inner.data_in:hover{background: linear-gradient(180deg, #FFD54A 0%, #FF9257 100%);border: 1px solid #E34C15;}
.stf_m .stf_m_fi .vs_grid .vs_inner.vs{text-align: center; padding: 6px 0; width: 100%;}
.stf_m .stf_m_fi .vs_grid .vs_inner.vs span{font-size: 14px; font-weight: 600; color:#131313;}
.stf_m .stf_m_fi .vs_grid .vs_inner.fl{display: grid; grid-template-columns: auto 50px; column-gap: 3px; align-items: center;}
.stf_m .stf_m_fi .vs_grid .vs_inner.fl.awy{grid-template-columns: 50px auto;}
.stf_m .stf_m_fi .vs_grid .vs_inner.fl.awy .team {order: 2;}
.stf_m .stf_m_fi .vs_grid .vs_inner.fl.awy .float {order: 1;}
.stf_m .stf_m_fi .vs_grid .vs_inner.fl .team{width: 100%; font-size: 13px; overflow: hidden; color: #131313; white-space: nowrap; text-overflow: ellipsis; }
.stf_m .stf_m_fi .vs_grid .vs_inner.fl.awy .team{text-align: right;}
.stf_m .stf_m_fi .vs_grid .vs_inner.fl em{font-size: 14px; color: #131313;}

.stf_m .stf_m_fi .vs_grid .vs_inner.fl.home .float{text-align: right;}
.stf_m .stf_m_fi .vs_grid .vs_inner.fl.awy .float{text-align: left;}
.stf_m .stf_m_fi .vs_grid .vs_inner.fl .float.pos em{color: var(--main_blue); position: relative; padding-right: 9px;}
.stf_m .stf_m_fi .vs_grid .vs_inner.fl .float.neg em{color: #D5424D; position: relative; padding-right: 9px;}
.stf_m .stf_m_fi .vs_grid .vs_inner.fl .float.over em{color: #D5424D; position: relative; padding-right: 9px;}
.stf_m .stf_m_fi .vs_grid .vs_inner.fl .float.under em{color: var(--main_blue); position: relative; padding-right: 9px;}
.stf_m .stf_m_fi .vs_grid .vs_inner.fl .float.over em::after{content: "▲"; color: #D5424D;  font-size: 8px; position: absolute; top: 50%; transform: translateY(-50%); right: 0;}
.stf_m .stf_m_fi .vs_grid .vs_inner.fl .float.under em::after{content: "▼"; color: var(--main_blue);  font-size: 8px; position: absolute; top: 50%; transform: translateY(-50%); right: 0;}



.fold_toggle{padding-left: 5px; height: 100%;}
.fold_toggle button{width: 100%; background: linear-gradient(180deg, #4D4D4D 0%, #1D1D1D 100%); border-radius: 5px; font-size: 14px; color: #FFF; height: 100%; border: 1px solid #000;}
.fold_toggle button:hover {background: linear-gradient(180deg, #6E6E6E 0%, #2E2E2E 100%);}

.stf_more_di{display: none;}
.stf_more_di .stf_m_fi{background: var(--stf_more_di_bg);}
.stf_more_di .stf_m .stf_m_fi .dt{color: var(--stf_more_di_txt);}

.empty_fold{margin: 40px auto 100px;}
.empty_fold p{font-size: 18px; color: var(--common_txt_opc); text-align: center; font-weight: 500}

/* ◀ 다폴더 보너스 배당 - 3폴더 이상 베팅 시 ▶ */
.st_f_b_pop_btn a{display: block; width: 100%; padding: 4px; background: linear-gradient(180deg, #F9F3C5 0%, #FFE415 100%);border: 1px solid #AC740C; border-radius: 5px; text-align: center;}
.st_f_b_pop_btn a:hover {background: linear-gradient(180deg, #E6DA9C 0%, #E6C900 100%);}
.st_f_b_pop_btn a span{font-size: 14px; color: #000; position: relative;}
.st_f_b_pop_btn a span::before{content: '◀'; font-size: 7px; color: #000; position: absolute; top: 50%; left: -10px; transform: translateY(-50%);}
.st_f_b_pop_btn a span::after{content: '▶'; font-size: 7px; color: #000; position: absolute; top: 50%; right: -10px; transform: translateY(-50%);}
/* ◀ 다폴더 보너스 배당 - 3폴더 이상 베팅 시 ▶ */



/* ▶ 리그, 국가 선택 필터  */
.stf_drop_pop_wrap{display: flex; margin-bottom: 10px; align-items: center; justify-content: flex-end; column-gap: 5px;}
.stf_dropdown_panel { display: none; position: absolute; background: var(--input_bg_opc); border: 1px solid var(--common_opc_border); width: 200px; z-index: 99; padding: 10px; margin-top: 2px; }
.stf_sel_item { position: relative; }
.stf_dropdown_btn { width: 200px; padding: 8px; background: var(--common_input_bg); color: var(--common_txt); border: 1px solid var(--common_opc_border); text-align: left; cursor: pointer; }
.stf_dropdown_btn::after{content: '';position: absolute;top: 50%;right: 7px;transform: translateY(-50%);width: 11px;height: 6.5px;background-image: var(--common_arrow_down_thin);background-repeat: no-repeat;background-size: contain;}
.stf_dropdown_list { max-height: 170px; overflow-y: auto; margin-bottom: 5px; padding-right: 7px;}
.stf_custom_chk { display: flex; align-items: center; gap: 6px; cursor: pointer; margin-bottom: 8px;}
.stf_custom_chk input[type="checkbox"] { display: none; }
.stf_custom_chk span { position: relative; padding-left: 24px; white-space: nowrap; color: var(--common_txt); overflow: hidden; text-overflow: ellipsis; line-height: 16px; font-size: 15px; }
.stf_custom_chk span i { content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 14px; height: 14px; border: 2px solid var(--main_blue); border-radius: 3px; background-color: white; box-sizing: border-box; }
.stf_custom_chk input[type="checkbox"]:checked + span i { background-color: var(--main_blue); border-color: var(--main_blue); }
.stf_dropdown_actions { display: grid; grid-template-columns: 1fr 1fr; column-gap: 5px;}
.stf_btn_confirm, .stf_btn_reset { padding: 5px 10px; border: none; cursor: pointer; }
.stf_btn_confirm { background-color: var(--main_blue); color: white; }
.stf_btn_reset { background-color: #d9d9d9; color: #000; }
.stf_dropdown_list::-webkit-scrollbar {width: 5px;}
.stf_dropdown_list::-webkit-scrollbar-track {background: transparent;border-radius: 10px;}
.stf_dropdown_list::-webkit-scrollbar-thumb {background-color: var(--common_txt_opc);border-radius: 10px;}
/* ▶ 리그, 국가 선택 필터  */