/* Notice Page & Notification Styles for 13L Game */
.notice-page,
[data-v-adb8df98].notice-page,
.notice-page[data-v-adb8df98] {
    min-height: 100vh !important;
    background-color: var(--bg_color_L1, #f5f6fa) !important;
    padding-bottom: 1.6rem !important;
    box-sizing: border-box !important;
}

.notice-page__nav,
[data-v-adb8df98].notice-page__nav,
.notice-page__nav[data-v-adb8df98] {
    background: var(--bg_color_L2, #ffffff) !important;
    position: sticky !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 99 !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important;
    border-bottom: 1px solid var(--Stroke_color, #eaedf2) !important;
}

.notice-page__nav-title,
[data-v-adb8df98].notice-page__nav-title {
    font-size: .42667rem !important;
    font-weight: 600 !important;
    color: var(--text_primary, #1e2637) !important;
    font-family: Poppins, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
}

.notice-page__nav-icon,
[data-v-adb8df98].notice-page__nav-icon {
    font-size: .48rem !important;
    color: var(--text_primary, #1e2637) !important;
    cursor: pointer !important;
}

.notice-page__content,
[data-v-adb8df98].notice-page__content {
    padding: .32rem .36rem !important;
    max-width: 10rem !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
}

.notice-list,
[data-v-adb8df98].notice-list {
    display: flex !important;
    flex-direction: column !important;
    gap: .3rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.notice-card,
[data-v-adb8df98].notice-card,
.notice-card[data-v-adb8df98] {
    background: var(--bg_color_L2, #ffffff) !important;
    border-radius: .28rem !important;
    padding: .36rem .4rem !important;
    box-shadow: 0 .04rem .16rem rgba(0, 0, 0, 0.04) !important;
    border: .01333rem solid var(--Stroke_color, #eaedf2) !important;
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
    transition: transform .15s ease, box-shadow .15s ease !important;
    position: relative !important;
    overflow: hidden !important;
}

.notice-card.is-clickable,
[data-v-adb8df98].notice-card.is-clickable {
    cursor: pointer !important;
}

.notice-card.is-clickable:active,
[data-v-adb8df98].notice-card.is-clickable:active {
    transform: scale(0.99) !important;
    opacity: 0.9 !important;
}

/* Card Header: Megaphone Icon + Title */
.notice-card__head,
[data-v-adb8df98].notice-card__head {
    display: flex !important;
    align-items: center !important;
    gap: .24rem !important;
    margin-bottom: .22rem !important;
    padding-bottom: .2rem !important;
    border-bottom: .01333rem solid var(--Stroke_color, #f0f2f7) !important;
}

/* Megaphone Icon */
.notice-card__icon,
[data-v-adb8df98].notice-card__icon,
.notice-card__icon[data-v-adb8df98] {
    width: .72rem !important;
    height: .72rem !important;
    min-width: .72rem !important;
    min-height: .72rem !important;
    max-width: .72rem !important;
    max-height: .72rem !important;
    padding: .12rem !important;
    border-radius: 50% !important;
    background: rgba(72, 143, 253, 0.1) !important;
    color: var(--main_color, #488FFD) !important;
    fill: var(--main_color, #488FFD) !important;
    flex-shrink: 0 !important;
    box-sizing: border-box !important;
    display: block !important;
}

.notice-card__icon path,
[data-v-adb8df98].notice-card__icon path,
.notice-card__icon[data-v-adb8df98] path {
    fill: var(--main_color, #488FFD) !important;
}

/* Title */
.notice-card__title,
[data-v-adb8df98].notice-card__title {
    font-family: Poppins, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: .37333rem !important;
    font-weight: 600 !important;
    color: var(--text_primary, #1e2637) !important;
    margin: 0 !important;
    flex: 1 !important;
    line-height: 1.35 !important;
    word-break: break-word !important;
}

/* Preview Content (Message Body) */
.notice-card__preview,
[data-v-adb8df98].notice-card__preview {
    font-size: .32rem !important;
    color: var(--text_secondary, #575c62) !important;
    line-height: 1.6 !important;
    margin-bottom: .2rem !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
}

.notice-card__preview p,
[data-v-adb8df98].notice-card__preview p {
    margin: 0 0 .14rem 0 !important;
    font-size: inherit !important;
    color: inherit !important;
    line-height: inherit !important;
}

.notice-card__preview p:last-child,
[data-v-adb8df98].notice-card__preview p:last-child {
    margin-bottom: 0 !important;
}

.notice-card__preview a,
[data-v-adb8df98].notice-card__preview a {
    color: var(--main_color, #488FFD) !important;
    text-decoration: underline !important;
    word-break: break-all !important;
}

.notice-card__preview strong,
.notice-card__preview b,
[data-v-adb8df98].notice-card__preview strong,
[data-v-adb8df98].notice-card__preview b {
    color: var(--text_primary, #1e2637) !important;
    font-weight: 600 !important;
}

/* Timestamp */
.notice-card__time,
[data-v-adb8df98].notice-card__time {
    display: inline-flex !important;
    align-items: center !important;
    gap: .12rem !important;
    font-size: .26667rem !important;
    color: var(--text_tertiary, #94a3b8) !important;
    margin-top: .08rem !important;
    line-height: 1.4 !important;
}

.notice-card__time::before,
[data-v-adb8df98].notice-card__time::before {
    content: "" !important;
    display: inline-block !important;
    width: .26667rem !important;
    height: .26667rem !important;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2394a3b8'%3E%3Cpath d='M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10 10-4.5 10-10S17.5 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm.5-13H11v6l5.2 3.1.8-1.3-4.5-2.7V7z'/%3E%3C/svg%3E") no-repeat center / contain !important;
    flex-shrink: 0 !important;
}

/* Action Button */
.notice-card__action,
[data-v-adb8df98].notice-card__action {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    align-self: flex-start !important;
    margin-top: .24rem !important;
    padding: .14rem .38rem !important;
    border-radius: .4rem !important;
    background: var(--main_color, #488FFD) !important;
    color: #ffffff !important;
    border: none !important;
    font-size: .29333rem !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    box-shadow: 0 .04rem .12rem rgba(72, 143, 253, 0.3) !important;
    transition: opacity .15s ease !important;
}

.notice-card__action:active,
[data-v-adb8df98].notice-card__action:active {
    opacity: 0.85 !important;
}

/* Empty State Fallback */
.no-data {
    display: flex !important;
    flex-direction: column !important;
    margin-top: 1.06667rem !important;
    align-items: center !important;
}
.no-data .data-icon {
    width: calc(var(--width) * .01333rem) !important;
    height: calc(var(--height) * .01333rem) !important;
}
.no-data .data-icon svg {
    width: calc(var(--width) * .01333rem) !important;
    height: calc(var(--height) * .01333rem) !important;
}
.no-data img.data-icon {
    width: 2.06667rem !important;
    height: 3.33333rem !important;
}
.no-data .data-text {
    color: var(--text_tertiary, #94a3b8) !important;
    font-size: .32rem !important;
}

/* WinGo Ticket Card UI Enhancement */
.TimeLeft__C,
[data-v-5f093580].TimeLeft__C,
.TimeLeft__C[data-v-5f093580],
[data-v-eada7fde].TimeLeft__C,
.TimeLeft__C[data-v-eada7fde] {
    width: calc(100% - .69333rem) !important;
    height: 2.66667rem !important;
    margin: .48rem auto 0 !important;
    background-color: #3b96f5 !important;
    background-image: url(/assets/ar_saas08/wingo_bg-130ea2d6.webp) !important;
    background-repeat: no-repeat !important;
    background-size: 100% 100% !important;
    background-position: center !important;
    border-radius: .26667rem !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(22, 115, 221, 0.2) !important;
    box-sizing: border-box !important;
}

.TimeLeft__C-rule,
[data-v-5f093580].TimeLeft__C-rule,
.TimeLeft__C-rule[data-v-5f093580],
[data-v-eada7fde].TimeLeft__C-rule,
.TimeLeft__C-rule[data-v-eada7fde] {
    position: absolute !important;
    top: .29333rem !important;
    left: .29333rem !important;
    height: .61333rem !important;
    width: auto !important;
    max-width: 44% !important;
    padding: 0 .2rem !important;
    font-size: .29333rem !important;
    font-weight: 500 !important;
    text-align: center !important;
    border: .02667rem solid rgba(255, 255, 255, 0.75) !important;
    border-radius: .8rem !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: .06667rem !important;
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.12) !important;
    backdrop-filter: blur(2px) !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
}

.TimeLeft__C-rule svg,
[data-v-5f093580].TimeLeft__C-rule svg,
.TimeLeft__C-rule[data-v-5f093580] svg,
[data-v-eada7fde].TimeLeft__C-rule svg,
.TimeLeft__C-rule[data-v-eada7fde] svg {
    height: .36rem !important;
    width: .36rem !important;
    color: #ffffff !important;
    fill: #ffffff !important;
    display: block !important;
}

.TimeLeft__C-name,
[data-v-5f093580].TimeLeft__C-name,
.TimeLeft__C-name[data-v-5f093580],
[data-v-eada7fde].TimeLeft__C-name,
.TimeLeft__C-name[data-v-eada7fde] {
    position: absolute !important;
    top: .98rem !important;
    left: .29333rem !important;
    height: .66667rem !important;
    line-height: .66667rem !important;
    border-radius: .13333rem !important;
    font-size: .32rem !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    padding: 0 !important;
}

.TimeLeft__C-num,
[data-v-5f093580].TimeLeft__C-num,
.TimeLeft__C-num[data-v-5f093580],
[data-v-eada7fde].TimeLeft__C-num,
.TimeLeft__C-num[data-v-eada7fde] {
    position: absolute !important;
    height: .66667rem !important;
    display: flex !important;
    left: .29333rem !important;
    bottom: .26rem !important;
}

.TimeLeft__C-id,
[data-v-5f093580].TimeLeft__C-id,
.TimeLeft__C-id[data-v-5f093580],
[data-v-eada7fde].TimeLeft__C-id,
.TimeLeft__C-id[data-v-eada7fde] {
    position: absolute !important;
    bottom: .22667rem !important;
    right: .29333rem !important;
    font-weight: 700 !important;
    font-size: .37333rem !important;
    height: .52rem !important;
    line-height: .52rem !important;
    color: #ffffff !important;
    letter-spacing: .01333rem !important;
}

.TimeLeft__C-text,
[data-v-5f093580].TimeLeft__C-text,
.TimeLeft__C-text[data-v-5f093580],
[data-v-eada7fde].TimeLeft__C-text,
.TimeLeft__C-text[data-v-eada7fde] {
    height: .4rem !important;
    line-height: .4rem !important;
    font-weight: 700 !important;
    font-size: .32rem !important;
    position: absolute !important;
    top: .32rem !important;
    right: .32rem !important;
    color: #ffffff !important;
}

.TimeLeft__C-time,
[data-v-5f093580].TimeLeft__C-time,
.TimeLeft__C-time[data-v-5f093580],
[data-v-eada7fde].TimeLeft__C-time,
.TimeLeft__C-time[data-v-eada7fde] {
    height: .8rem !important;
    line-height: .8rem !important;
    position: absolute !important;
    bottom: .96rem !important;
    right: .32rem !important;
    display: flex !important;
    align-items: center !important;
}

.TimeLeft__C-time > div,
[data-v-5f093580].TimeLeft__C-time > div,
.TimeLeft__C-time[data-v-5f093580] > div,
[data-v-eada7fde].TimeLeft__C-time > div,
.TimeLeft__C-time[data-v-eada7fde] > div {
    background-color: #ffffff !important;
    font-weight: 700 !important;
    font-size: .48rem !important;
    text-align: center !important;
    padding: 0 .10667rem !important;
    width: .53333rem !important;
    height: .72rem !important;
    line-height: .72rem !important;
    color: #fb5b5b !important;
    border-radius: .08rem !important;
    box-shadow: 0 .04rem .08rem rgba(0, 0, 0, 0.1) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
}

.TimeLeft__C-time > div + div,
[data-v-5f093580].TimeLeft__C-time > div + div,
.TimeLeft__C-time[data-v-5f093580] > div + div,
[data-v-eada7fde].TimeLeft__C-time > div + div,
.TimeLeft__C-time[data-v-eada7fde] > div + div {
    margin-left: .12rem !important;
}

.TimeLeft__C-time > div:nth-child(1),
[data-v-5f093580].TimeLeft__C-time > div:nth-child(1),
.TimeLeft__C-time[data-v-5f093580] > div:nth-child(1),
[data-v-eada7fde].TimeLeft__C-time > div:nth-child(1),
.TimeLeft__C-time[data-v-eada7fde] > div:nth-child(1) {
    clip-path: polygon(0 30%, 30% 0, 100% 0, 100% 100%, 0% 100%) !important;
}

.TimeLeft__C-time > div:nth-child(5),
[data-v-5f093580].TimeLeft__C-time > div:nth-child(5),
.TimeLeft__C-time[data-v-5f093580] > div:nth-child(5),
[data-v-eada7fde].TimeLeft__C-time > div:nth-child(5),
.TimeLeft__C-time[data-v-eada7fde] > div:nth-child(5) {
    clip-path: polygon(0 0, 100% 0, 100% 70%, 70% 100%, 0 100%) !important;
}

.TimeLeft__C-time > div:nth-child(3),
[data-v-5f093580].TimeLeft__C-time > div:nth-child(3),
.TimeLeft__C-time[data-v-5f093580] > div:nth-child(3),
[data-v-eada7fde].TimeLeft__C-time > div:nth-child(3),
.TimeLeft__C-time[data-v-eada7fde] > div:nth-child(3) {
    width: .26rem !important;
    background: transparent !important;
    background-color: transparent !important;
    color: #ffffff !important;
    box-shadow: none !important;
    padding: 0 !important;
    clip-path: none !important;
}