@charset "utf-8";

/* ── Sugar detail pages (deposit, mypage, customer, forms, lists) ── */

.sugar-main .content_box,
.sugar-main .content_box_in,
.sugar-main .content_box_in2 {
    background: var(--sugar-bg-lighten, #2e2f3b) !important;
    border: 1px solid var(--sugar-border, #4a4b59) !important;
    border-radius: 14px !important;
    color: var(--sugar-text, #fff) !important;
    box-sizing: border-box;
}

.sugar-main .content_box {
    padding: 20px !important;
    margin-bottom: 16px;
}

.sugar-main .content_box_in,
.sugar-main .content_box_in2 {
    padding: 20px !important;
    margin-top: 12px;
}

.sugar-main .title_box {
    background: transparent !important;
    border: none !important;
    padding: 0 0 12px !important;
    border-bottom: 1px solid var(--sugar-border, #4a4b59) !important;
    margin-bottom: 0 !important;
}

.sugar-main .title_box .title {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    text-shadow: none !important;
}

.sugar-main .title_box .title span {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    font-size: 16px !important;
    margin-left: 8px;
    opacity: 0.85;
}

.sugar-main .s_title1,
.sugar-main .board_title b {
    color: var(--sugar-primary, #ff37a8) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
}

.sugar-main .info_wrap {
    background: var(--sugar-bg-dark, #252831) !important;
    border: 1px solid var(--sugar-border, #4a4b59) !important;
    border-radius: 10px !important;
    color: var(--sugar-text-muted, #a9abc2) !important;
}

.sugar-main .info3,
.sugar-main .info_wrap .info3 {
    color: var(--sugar-text-muted, #a9abc2) !important;
    line-height: 1.7 !important;
}

.sugar-main .info3 .font05,
.sugar-main .font05 {
    color: var(--sugar-primary, #ff37a8) !important;
}

.sugar-main .list_box {
    background: var(--sugar-bg-dark, #252831) !important;
    border: 1px solid var(--sugar-border, #4a4b59) !important;
    border-radius: 10px !important;
    overflow: hidden;
}

.sugar-main .list_box.deposit-history-list {
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
}

/* ── Mobile customer service table (horizontal scroll) ── */
.sugar-main .customer-service-table-scroll {
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    width: 100%;
    background: var(--sugar-bg-dark, #252831) !important;
    border: 1px solid var(--sugar-border, #4a4b59) !important;
    border-radius: 10px !important;
}

.sugar-main .customer-service-table {
    width: 100%;
    min-width: 620px;
    border-collapse: collapse;
    table-layout: fixed;
}

.sugar-main .customer-service-table th,
.sugar-main .customer-service-table td {
    display: table-cell !important;
    white-space: nowrap;
    padding: 10px 8px !important;
    text-align: center;
    vertical-align: middle;
    font-size: 13px;
    border-bottom: 1px solid var(--sugar-border, #4a4b59);
    box-sizing: border-box;
}

.sugar-main .customer-service-table thead th {
    background: #484960 !important;
    color: var(--sugar-text, #fff) !important;
    font-weight: 600;
    line-height: 1.3;
    border-bottom: 1px solid var(--sugar-border, #4a4b59);
}

.sugar-main .customer-service-table tbody td {
    background: transparent !important;
    color: var(--sugar-text, #fff) !important;
}

.sugar-main .customer-service-table .cell-title {
    text-align: left !important;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sugar-main .customer-service-table .cell-title a {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--sugar-text, #fff) !important;
}

.sugar-main .customer-service-table tbody tr.sugar-row-link {
    cursor: pointer;
}

.sugar-main .customer-service-table tbody tr.sugar-row-link:hover td {
    background: rgba(255, 55, 168, 0.08) !important;
}

.sugar-main .list_tr3.deposit-history-cols > * {
    width: calc(100% / 5) !important;
}

@media screen and (max-width: 1024px) {
    .sugar-main .list_tr3.deposit-history-cols > *:nth-child(1) {
        display: none !important;
    }

    .sugar-main .list_tr3.deposit-history-cols > *:nth-child(n+2) {
        width: calc(100% / 4) !important;
    }
}

.sugar-main .list_tr4.trfirst,
.sugar-main .list_tr.trfirst,
.sugar-main .list_tr2.trfirst,
.sugar-main .list_tr3.trfirst,
.sugar-main .list_tr5.trfirst,
.sugar-main .list_tr6.trfirst {
    background: #484960 !important;
}

.sugar-main .list_title4,
.sugar-main .list_title,
.sugar-main .list_title2,
.sugar-main .list_title3 {
    color: var(--sugar-text, #fff) !important;
    background: transparent !important;
    border-color: var(--sugar-border, #4a4b59) !important;
}

.sugar-main .list_tr4,
.sugar-main .list_tr,
.sugar-main .list_tr2,
.sugar-main .list_tr3,
.sugar-main .list_tr5,
.sugar-main .list_tr6 {
    border-bottom: 1px solid var(--sugar-border, #4a4b59) !important;
}

.sugar-main .list_notice4,
.sugar-main .list_notice,
.sugar-main .list_notice2,
.sugar-main .list_notice3 {
    color: var(--sugar-text, #fff) !important;
    background: transparent !important;
}

.sugar-main .list_notice4 a,
.sugar-main .list_notice a,
.sugar-main .list_notice2 a {
    color: var(--sugar-text, #fff) !important;
}

.sugar-main .list_notice4 a:hover,
.sugar-main .list_notice a:hover {
    color: var(--sugar-primary, #ff37a8) !important;
}

/* Status / category badges — Sugar dark palette (overrides basic.css bright colors) */
body.sugar-layout .sugar-main .division1,
.sugar-main .division1 {
    background: var(--sugar-btn-secondary, #484960) !important;
    color: var(--sugar-text-muted, #a9abc2) !important;
    border: 1px solid var(--sugar-border, #4a4b59) !important;
    border-radius: 6px !important;
    font-weight: 500 !important;
    text-shadow: none !important;
    box-shadow: none !important;
}

body.sugar-layout .sugar-main .division2,
.sugar-main .division2 {
    background: var(--sugar-primary, #ff37a8) !important;
    color: var(--sugar-btn-text, #000) !important;
    border: 1px solid transparent !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
    text-shadow: none !important;
    box-shadow: none !important;
}

body.sugar-layout .sugar-main .division3,
.sugar-main .division3 {
    background: rgba(255, 55, 168, 0.12) !important;
    color: var(--sugar-primary, #ff37a8) !important;
    border: 1px solid var(--sugar-red-border, rgba(255, 55, 168, 0.35)) !important;
    border-radius: 999px !important;
    font-weight: 600 !important;
    min-width: auto !important;
    text-shadow: none !important;
    box-shadow: none !important;
}

body.sugar-layout .sugar-main .division4,
.sugar-main .division4 {
    background: rgba(248, 113, 113, 0.12) !important;
    color: #f87171 !important;
    border: 1px solid rgba(248, 113, 113, 0.35) !important;
    border-radius: 6px !important;
    font-weight: 500 !important;
    text-shadow: none !important;
    box-shadow: none !important;
}

.sugar-main .write_box {
    border: 1px solid var(--sugar-border, #4a4b59) !important;
    border-radius: 10px !important;
    overflow: hidden;
}

.sugar-main .write_title {
    background: #484960 !important;
    border-color: var(--sugar-border, #4a4b59) !important;
    color: var(--sugar-text, #fff) !important;
}

.sugar-main .write_title_top {
    border-top-color: var(--sugar-primary, #ff37a8) !important;
}

.sugar-main .write_basic {
    background: var(--sugar-bg-dark, #252831) !important;
    border-color: var(--sugar-border, #4a4b59) !important;
    color: var(--sugar-text, #fff) !important;
}

.sugar-main .write_basic input,
.sugar-main .write_basic select,
.sugar-main .write_basic textarea,
.sugar-main .input1,
.sugar-main .input2,
.sugar-main .input3 {
    background: #17121b !important;
    border: 1px solid var(--sugar-border, #4a4b59) !important;
    color: var(--sugar-text, #fff) !important;
    border-radius: 8px !important;
}

.sugar-main .write_basic input:focus,
.sugar-main .input1:focus {
    border-color: var(--sugar-primary, #ff37a8) !important;
    outline: none !important;
}

.sugar-main .write_basic input::placeholder,
.sugar-main .input1::placeholder {
    color: #7e8096 !important;
}

.sugar-main .btn1_2,
.sugar-main .btn1,
.sugar-main .btn2,
.sugar-main .write_basic_btn a,
.sugar-main .write_basic_btn .btn1_2 {
    background: var(--sugar-primary, #ff37a8) !important;
    border: none !important;
    color: #000 !important;
    border-radius: 8px !important;
    font-weight: 700 !important;
}

.sugar-main .btn1_2:hover,
.sugar-main .write_basic_btn a:hover {
    filter: brightness(1.08);
}

.sugar-main .write_basic_btn.sel a,
.sugar-main .write_basic_btn a.active {
    background: #484960 !important;
    color: #fff !important;
    border: 1px solid var(--sugar-border, #4a4b59) !important;
}

.sugar-main .radio_wrap label,
.sugar-main .write_basic label {
    color: var(--sugar-text, #fff) !important;
}

.sugar-main .borad_box,
.sugar-main .board {
    background: var(--sugar-bg-lighten, #2e2f3b) !important;
    border: 1px solid var(--sugar-border, #4a4b59) !important;
    border-radius: 12px !important;
}

.sugar-main .board_title {
    background: #484960 !important;
    border-bottom: 1px solid var(--sugar-border, #4a4b59) !important;
    padding: 12px 16px !important;
    border-radius: 12px 12px 0 0 !important;
}

.sugar-main .myTable {
    background: transparent !important;
}

.sugar-main .myTable tr:nth-child(even) td {
    background: rgba(255, 255, 255, 0.02) !important;
}

.sugar-main .myTable tr:hover td {
    background: rgba(255, 55, 168, 0.06) !important;
}

.sugar-main .pagination,
.sugar-main .paginate {
    margin-top: 16px;
}

.sugar-main .pagination a,
.sugar-main .pagination span,
.sugar-main .paginate a,
.sugar-main .paginate strong {
    background: var(--sugar-bg-dark, #252831) !important;
    border: 1px solid var(--sugar-border, #4a4b59) !important;
    color: var(--sugar-text, #fff) !important;
    border-radius: 6px !important;
}

.sugar-main .pagination .active span,
.sugar-main .paginate strong {
    background: var(--sugar-primary, #ff37a8) !important;
    color: #000 !important;
    border-color: var(--sugar-primary, #ff37a8) !important;
}

/* Pagination (.page_wrap) — designed.blade.php */
body.sugar-layout .sugar-main .page_wrap {
    float: none;
    width: 100%;
    height: auto;
    min-height: 40px;
    margin-top: 20px;
    padding: 8px 0;
    text-align: center;
    clear: both;
}

body.sugar-layout .sugar-main .page_wrap ul {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

body.sugar-layout .sugar-main .page_wrap ul li {
    display: inline-block;
    margin: 0;
}

body.sugar-layout .sugar-main .page_wrap ul li a {
    display: inline-block;
    text-decoration: none;
    border: none;
    background: transparent !important;
    padding: 0;
    box-shadow: none !important;
}

body.sugar-layout .sugar-main .page_wrap .page,
body.sugar-layout .sugar-main .page_wrap ul li a .page {
    background: var(--sugar-btn-secondary, #484960) !important;
    border: 1px solid var(--sugar-border, #4a4b59) !important;
    color: var(--sugar-text-muted, #a9abc2) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    padding: 10px 14px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    text-shadow: none !important;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

body.sugar-layout .sugar-main .page_wrap .pageon {
    background: var(--sugar-primary, #ff37a8) !important;
    border: 1px solid var(--sugar-primary, #ff37a8) !important;
    color: var(--sugar-btn-text, #000) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    padding: 10px 14px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    border-radius: 8px !important;
    box-shadow: var(--sugar-glow-sm, 0 2px 8px rgba(255, 55, 168, 0.18)) !important;
    text-shadow: none !important;
}

body.sugar-layout .sugar-main .page_wrap ul li a:not([href]) .page,
body.sugar-layout .sugar-main .page_wrap ul li a.ctrl:not([href]) .page {
    opacity: 0.45;
    cursor: default;
}

body.sugar-layout .sugar-main .page_wrap ul li a[href]:hover .page {
    background: rgba(255, 55, 168, 0.12) !important;
    border-color: var(--sugar-red-border-hover, rgba(255, 55, 168, 0.65)) !important;
    color: var(--sugar-text, #fff) !important;
}

body.sugar-layout .sugar-main .page_wrap .ctrl .page {
    min-width: auto;
    padding: 10px 12px !important;
}

@media (max-width: 768px) {
    body.sugar-layout .sugar-main .page_wrap ul {
        gap: 4px;
    }

    body.sugar-layout .sugar-main .page_wrap .page,
    body.sugar-layout .sugar-main .page_wrap .pageon,
    body.sugar-layout .sugar-main .page_wrap ul li a .page {
        min-width: 34px;
        padding: 8px 10px !important;
        font-size: 12px !important;
    }

    body.sugar-layout .sugar-main .page_wrap .ctrl .page {
        padding: 8px 8px !important;
        font-size: 11px !important;
    }
}

/* ── Minigame game tabs (.minigame-tab-list) ── */
body.sugar-layout .minigame-sports-main .minigame-tab-list {
    gap: 8px;
    margin-bottom: 8px;
}

body.sugar-layout .minigame-sports-main .minigame-tab-list .minigame-main-tab {
    background: var(--sugar-btn-secondary, #484960) !important;
    border: 1px solid var(--sugar-border, #4a4b59) !important;
    border-radius: 10px !important;
    color: var(--sugar-text-muted, #a9abc2) !important;
    font-family: 'Noto Sans KR', sans-serif !important;
    font-weight: 500 !important;
    box-shadow: none !important;
    text-shadow: none !important;
    transform: none !important;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease !important;
}

body.sugar-layout .minigame-sports-main .minigame-tab-list .minigame-main-tab:not(.active):hover {
    background: rgba(255, 55, 168, 0.1) !important;
    border-color: var(--sugar-red-border-hover, rgba(255, 55, 168, 0.65)) !important;
    color: var(--sugar-text, #fff) !important;
    box-shadow: none !important;
    transform: none !important;
}

body.sugar-layout .minigame-sports-main .minigame-tab-list .minigame-main-tab.active {
    background: var(--sugar-primary, #ff37a8) !important;
    border-color: var(--sugar-primary, #ff37a8) !important;
    color: var(--sugar-btn-text, #000) !important;
    font-weight: 600 !important;
    box-shadow: var(--sugar-glow-sm, 0 2px 8px rgba(255, 55, 168, 0.18)) !important;
    text-shadow: none !important;
    transform: none !important;
    animation: none !important;
}

body.sugar-layout .minigame-sports-main .minigame-tab {
    background: var(--sugar-bg-dark, #252831) !important;
    border-color: var(--sugar-border, #4a4b59) !important;
    color: var(--sugar-text, #fff) !important;
}

body.sugar-layout .minigame-sports-main .minigame-tab-left,
body.sugar-layout .minigame-sports-main .minigame-tab-right {
    color: var(--sugar-text-muted, #a9abc2) !important;
}

body.sugar-layout .minigame-sports-main .minigame-tab .cred {
    color: var(--sugar-primary, #ff37a8) !important;
}

@media (max-width: 768px) {
    body.sugar-layout .minigame-sports-main .minigame-tab-list .minigame-main-tab {
        min-height: 40px;
        padding: 8px 6px !important;
        font-size: 13px !important;
        border-radius: 8px !important;
    }
}

.sugar-main .mypage_nav,
.sugar-main .sub_menu,
.sugar-main .m_menu {
    background: var(--sugar-bg-dark, #252831) !important;
    border: 1px solid var(--sugar-border, #4a4b59) !important;
    border-radius: 10px !important;
}

.sugar-main .mypage_nav a,
.sugar-main .sub_menu a {
    color: var(--sugar-text, #fff) !important;
    border-color: var(--sugar-border, #4a4b59) !important;
}

.sugar-main .mypage_nav a.active,
.sugar-main .mypage_nav a:hover,
.sugar-main .sub_menu a:hover {
    background: #484960 !important;
    color: var(--sugar-primary, #ff37a8) !important;
}

.sugar-main .view_box,
.sugar-main .view_content,
.sugar-main .board_view {
    background: var(--sugar-bg-dark, #252831) !important;
    border: 1px solid var(--sugar-border, #4a4b59) !important;
    border-radius: 10px !important;
    color: var(--sugar-text, #fff) !important;
    padding: 20px !important;
}

.sugar-main .view_title,
.sugar-main .view_head {
    border-bottom: 1px solid var(--sugar-border, #4a4b59) !important;
    color: var(--sugar-text, #fff) !important;
}

.sugar-main table {
    color: var(--sugar-text, #fff) !important;
}

.sugar-main table th {
    background: #484960 !important;
    border-color: var(--sugar-border, #4a4b59) !important;
    color: var(--sugar-text, #fff) !important;
}

.sugar-main table td {
    background: var(--sugar-bg-dark, #252831) !important;
    border-color: var(--sugar-border, #4a4b59) !important;
    color: var(--sugar-text, #fff) !important;
}

.sugar-main .live_transaction_boards,
.sugar-main .borad_box.live_board {
    margin-top: 16px;
}

.sugar-page-box .sugar-game-section {
    margin-top: 0;
}

.sugar-page-box .horizontal-swiper-wrapper {
    margin-bottom: 0;
}

.sugar-main .borad_box_ticker,
.sugar-main .live_ticker_board,
.sugar-main .live_ticker_viewport {
    background: var(--sugar-bg-dark, #252831) !important;
    color: var(--sugar-text, #fff) !important;
}

.sugar-main .live_ticker_viewport {
    padding: 0 16px;
    box-sizing: border-box;
}

.sugar-main .live_ticker_list li {
    color: var(--sugar-text, #fff) !important;
    border-color: var(--sugar-border, #4a4b59) !important;
    padding: 0 6px;
    box-sizing: border-box;
}

.sugar-main .live_ticker_list .ticker_time {
    color: var(--sugar-text-muted, #a9abc2) !important;
    padding-left: 2px;
}

.sugar-main .live_ticker_list .ticker_id {
    color: var(--sugar-text, #fff) !important;
}

.sugar-main .live_ticker_list .ticker_amount {
    color: var(--sugar-primary, #ff37a8) !important;
    font-weight: 600;
    padding-right: 2px;
}

/* Clickable list rows (notice, event, message, customer) */
.sugar-layout .sugar-row-link {
    cursor: pointer;
    transition: background 0.2s ease;
}

.sugar-layout .list_tr2.sugar-row-link:hover,
.sugar-layout .list_tr4.sugar-row-link:hover,
.sugar-layout .list_box table tbody tr.sugar-row-link:hover {
    background: rgba(255, 55, 168, 0.06) !important;
}

.sugar-live-boards-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    width: 100%;
}

.sugar-live-boards-row > .borad_box_ticker {
    flex: 1 1 calc(50% - 6px);
    width: auto !important;
    float: none !important;
    margin: 0 !important;
}

@media (max-width: 1023px) {
    .sugar-live-boards-row > .borad_box_ticker {
        flex: 1 1 100%;
    }
}

/* Detail pages: lift low-contrast legacy text colors */
.sugar-layout.brand-sugar02 .sugar-main .list_tr4:not(.trfirst) > *:nth-child(2),
.sugar-layout.brand-sugar02 .sugar-main .list_tr2:not(.trfirst) > *:nth-child(2),
.sugar-layout.brand-sugar02 .sugar-main .list_tr5 > div:nth-child(3),
.sugar-layout.brand-sugar02 .sugar-main .con_box,
.sugar-layout.brand-sugar02 .sugar-main .con_box20,
.sugar-layout.brand-sugar02 .sugar-main .no_data,
.sugar-layout.brand-sugar02 .sugar-main .empty,
.sugar-layout.brand-sugar02 .sugar-main .paginate,
.sugar-layout.brand-sugar02 .sugar-main .pagination,
.sugar-layout.brand-sugar02 .sugar-main .mypage_box,
.sugar-layout.brand-sugar02 .sugar-main .customer_box {
    color: var(--sugar-text, #fff) !important;
}

.sugar-layout.brand-sugar02 .sugar-main .list_date,
.sugar-layout.brand-sugar02 .sugar-main .list_writer,
.sugar-layout.brand-sugar02 .sugar-main .list_hit,
.sugar-layout.brand-sugar02 .sugar-main .date,
.sugar-layout.brand-sugar02 .sugar-main .sub,
.sugar-layout.brand-sugar02 .sugar-main .desc {
    color: var(--sugar-text-muted, #a9abc2) !important;
}

/* ── Mypage betting: #searchForm category tabs ── */
body.sugar-layout .sugar-main #searchForm .betting-category-tabs,
.sugar-main #searchForm .betting-category-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    width: 100%;
    margin: 0 0 18px 0 !important;
    padding: 0;
    list-style: none;
}

body.sugar-layout .sugar-main #searchForm .betting-category-tabs li,
.sugar-main #searchForm .betting-category-tabs li {
    flex: 1 1 0;
    min-width: 0;
    margin: 0 !important;
    float: none !important;
}

body.sugar-layout .sugar-main #searchForm .betting-category-tabs li a,
.sugar-main #searchForm .betting-category-tabs li a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 44px;
    padding: 10px 14px;
    text-align: center;
    text-decoration: none;
    background: var(--sugar-btn-secondary, #484960) !important;
    border: 1px solid var(--sugar-border, #4a4b59) !important;
    border-radius: 10px !important;
    color: var(--sugar-text-muted, #a9abc2) !important;
    font-family: 'Noto Sans KR', sans-serif !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
    box-shadow: none !important;
    text-shadow: none !important;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease !important;
    transform: none !important;
}

body.sugar-layout .sugar-main #searchForm .betting-category-tabs li a span,
.sugar-main #searchForm .betting-category-tabs li a span {
    color: inherit !important;
    font-size: inherit !important;
}

body.sugar-layout .sugar-main #searchForm .betting-category-tabs li:not(.active):hover a,
.sugar-main #searchForm .betting-category-tabs li:not(.active):hover a {
    background: rgba(255, 55, 168, 0.1) !important;
    border-color: var(--sugar-red-border-hover, rgba(255, 55, 168, 0.65)) !important;
    color: var(--sugar-text, #fff) !important;
    box-shadow: none !important;
    transform: none !important;
}

body.sugar-layout .sugar-main #searchForm .betting-category-tabs li.active a,
.sugar-main #searchForm .betting-category-tabs li.active a {
    background: var(--sugar-primary, #ff37a8) !important;
    border-color: var(--sugar-primary, #ff37a8) !important;
    color: var(--sugar-btn-text, #000) !important;
    font-weight: 600 !important;
    box-shadow: var(--sugar-glow-sm, 0 2px 8px rgba(255, 55, 168, 0.18)) !important;
    text-shadow: none !important;
    animation: none !important;
}

@media screen and (max-width: 768px) {
    body.sugar-layout .sugar-main #searchForm .betting-category-tabs,
    .sugar-main #searchForm .betting-category-tabs {
        gap: 6px;
        margin-bottom: 14px !important;
    }

    body.sugar-layout .sugar-main #searchForm .betting-category-tabs li a,
    .sugar-main #searchForm .betting-category-tabs li a {
        min-height: 40px;
        padding: 8px 6px;
        font-size: 13px !important;
        border-radius: 8px !important;
    }
}

@media screen and (max-width: 420px) {
    body.sugar-layout .sugar-main #searchForm .betting-category-tabs li a,
    .sugar-main #searchForm .betting-category-tabs li a {
        min-height: 38px;
        font-size: 12px !important;
    }
}

/* ── Sugar modal overlay (announcement / alert / login / join) ── */
/* Sugar: fixed inset-0 z-[200] flex bg-black/60 backdrop-blur-sm items-center justify-center */
body.sugar-layout .center_popup_area_box {
    display: none !important;
    position: fixed !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    pointer-events: none;
}

body.sugar-layout .center_popup_area_box.is-open {
    position: fixed !important;
    inset: 0 !important;
    z-index: 10050 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 24px !important;
    box-sizing: border-box !important;
    pointer-events: auto !important;
    background: rgba(0, 0, 0, 0.6) !important;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    overflow-y: auto;
    text-align: center;
    visibility: visible !important;
    opacity: 1 !important;
}

body.sugar-layout .center_popup_area_box .shadow {
    display: none !important;
}

body.sugar-layout .center_popup_area_box .line_up {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 16px;
    width: auto !important;
    max-width: 100%;
    pointer-events: auto !important;
    overflow: visible !important;
    float: none !important;
}

body.sugar-layout .center_popup_area_box .center_popup_area {
    display: none !important;
    float: none !important;
    margin: 0 !important;
    width: min(448px, calc(100vw - 48px)) !important;
    flex-direction: column;
    overflow: hidden;
    background: #17121b;
    border: 1px solid var(--sugar-border, rgba(255, 255, 255, 0.12));
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.55);
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
}

body.sugar-layout .center_popup_area_box .center_popup_area.is-open {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    position: relative;
    z-index: 1;
}

body.sugar-layout .center_popup_area_box .center_popup_area .conts {
    width: 100% !important;
    height: auto !important;
    max-height: min(558px, calc(100vh - 160px)) !important;
    aspect-ratio: 448 / 558;
}

body.sugar-layout .center_popup_area_box .center_popup_area .bottom {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    height: auto !important;
    min-height: 44px;
    line-height: 1.4 !important;
    padding: 10px 12px !important;
    text-shadow: none !important;
}

body.sugar-layout .center_popup_area_box .center_popup_area .bottom .pop_only_close,
body.sugar-layout .center_popup_area_box .center_popup_area .bottom .pop_close {
    float: none !important;
    font-size: 14px !important;
    color: #fff !important;
    cursor: pointer;
}

/* bPopup backdrop + alert dialog */
body.sugar-layout > .b-modal {
    background: rgba(0, 0, 0, 0.6) !important;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    z-index: 100600 !important;
}

body.sugar-layout .layer-wrap.default,
body.sugar-layout #div_common_alert.layer-wrap.default {
    width: min(420px, calc(100vw - 32px)) !important;
    border-radius: 16px !important;
    background: #17121b !important;
    border: 1px solid var(--sugar-border, rgba(255, 255, 255, 0.12)) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.55) !important;
    z-index: 100601 !important;
}

body.sugar-layout .layer-wrap.default.active,
body.sugar-layout #div_common_alert.layer-wrap.default.active {
    display: block !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
}

body.sugar-layout .layer-wrap.default .is-con h3,
body.sugar-layout .layer-wrap.default .is-con .stit {
    color: #fff !important;
}

body.sugar-layout .layer-wrap.default .is-btm {
    background: #252831 !important;
    border-top: 1px solid var(--sugar-border, rgba(255, 255, 255, 0.12)) !important;
}

body.sugar-layout .layer-wrap.default .is-btm .enter-btn {
    background: linear-gradient(135deg, #944cff 0%, #ff37a8 100%) !important;
    border-color: transparent !important;
    color: #fff !important;
}

body.sugar-layout .layer-wrap.default .is-btm .cancel-btn {
    background: #343434 !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
    color: #fff !important;
}

/* Login / join overlay */
body.sugar-layout #login.modal.is-open,
body.sugar-layout #login.modal[style*="block"] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(0, 0, 0, 0.6) !important;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

body.sugar-layout #join.is-open,
body.sugar-layout #join[style*="flex"] {
    position: fixed !important;
    inset: 0 !important;
    z-index: 100000 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(0, 0, 0, 0.6) !important;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    float: none !important;
    min-height: 0 !important;
    padding: 24px;
    box-sizing: border-box;
}

/* Mobile announcement backdrop */
body.sugar-layout > .shadow.is-open {
    display: block !important;
    background: rgba(0, 0, 0, 0.6) !important;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    pointer-events: auto !important;
    z-index: 10040 !important;
}