/* Sungame Theme v1.5.8 — optional Liquid Glass presentation overlay. */

body.sg-liquid-glass {
    --sg-glass-surface: rgba(255, 255, 255, .72);
    --sg-glass-surface-strong: rgba(255, 255, 255, .84);
    --sg-glass-surface-soft: rgba(246, 251, 249, .66);
    --sg-glass-border: rgba(38, 126, 112, .18);
    --sg-glass-border-strong: rgba(38, 126, 112, .34);
    --sg-glass-shadow: 0 12px 32px rgba(29, 72, 68, .08);
    --sg-glass-shadow-float: 0 20px 48px rgba(29, 72, 68, .16);
    --sg-glass-highlight: rgba(255, 255, 255, .72);
    --sg-glass-surface-prominent: rgba(234, 249, 244, .58);
    --sg-glass-border-prominent: rgba(38, 126, 112, .42);
    --sg-glass-shadow-prominent: 0 18px 44px rgba(29, 72, 68, .14), 0 3px 12px rgba(38, 126, 112, .06);
    --sg-glass-specular: rgba(255, 255, 255, .68);
    --sg-glass-blur: 18px;
    --sg-glass-saturate: 135%;
    --sg-selector-indicator-surface: rgba(5, 82, 67, .90);
    --sg-selector-indicator-border: rgba(4, 64, 52, .82);
    --sg-selector-indicator-shadow: 0 4px 14px rgba(5, 82, 67, .24);
    --sg-selector-indicator-highlight: rgba(255, 255, 255, .12);
    background:
        radial-gradient(circle at 12% 0%, rgba(69, 178, 154, .12), transparent 32rem),
        radial-gradient(circle at 94% 10%, rgba(86, 190, 209, .10), transparent 28rem),
        linear-gradient(180deg, rgba(248, 252, 251, .94), rgba(244, 248, 247, .98));
}

body.sg-liquid-glass .sg-app {
    position: relative;
}

body.sg-liquid-glass .sg-header {
    background: var(--sg-glass-surface-strong);
    border-bottom-color: var(--sg-glass-border);
    box-shadow: 0 8px 26px rgba(29, 72, 68, .06);
}

body.sg-liquid-glass .sg-nav__dropdown,
body.sg-liquid-glass .sg-account-dropdown,
body.sg-liquid-glass .popover {
    background: var(--sg-glass-surface-strong);
    border-color: var(--sg-glass-border-strong);
    box-shadow: var(--sg-glass-shadow-float);
}

body.sg-liquid-glass .sg-navigation-backdrop {
    background: rgba(23, 51, 49, .22);
}

body.sg-liquid-glass .sg-sidebar .card,
body.sg-liquid-glass .sg-sidebar .card-sidebar,
body.sg-liquid-glass .sg-content > .card,
body.sg-liquid-glass .sg-content > .panel,
body.sg-liquid-glass .sg-card-list tbody tr.sg-invoice-card td,
body.sg-liquid-glass .sg-card-list tbody tr.sg-quote-card td,
body.sg-liquid-glass .sg-footer {
    background: var(--sg-glass-surface);
    border-color: var(--sg-glass-border);
    box-shadow: var(--sg-glass-shadow);
}

body.sg-liquid-glass .sg-content > .card > .card-header,
body.sg-liquid-glass .sg-content > .panel > .panel-heading,
body.sg-liquid-glass .sg-sidebar .card > .card-header,
body.sg-liquid-glass .sg-sidebar .card-sidebar > .card-header {
    background: var(--sg-glass-surface-soft);
    border-bottom-color: var(--sg-glass-border);
}

body.sg-liquid-glass .sg-button--quiet,
body.sg-liquid-glass .sg-icon-button,
body.sg-liquid-glass .sg-footer__locale {
    background: var(--sg-glass-surface-soft);
    border-color: var(--sg-glass-border);
}

body.sg-liquid-glass .sg-button--accent,
body.sg-liquid-glass .btn-primary,
body.sg-liquid-glass .btn-success {
    /* Primary actions remain solid and retain the Standard Sungame hierarchy. */
    box-shadow: 0 8px 18px rgba(21, 122, 110, .16);
}

body.sg-liquid-glass .sg-footer__watermark-zone {
    border-top-color: var(--sg-glass-border);
}

body.sg-liquid-glass .sg-service-card,
body.sg-liquid-glass .sg-metric,
body.sg-liquid-glass .sg-home-product,
body.sg-liquid-glass .sg-empty-state,
body.sg-liquid-glass .sg-service-hero,
body.sg-liquid-glass .sg-service-fact,
body.sg-liquid-glass .sg-service-meta__address,
body.sg-liquid-glass .sg-service-meta__actions,
body.sg-liquid-glass .sg-service-detail__panel,
body.sg-liquid-glass .sg-service-detail-grid > div,
body.sg-liquid-glass .sg-service-usage-grid > div {
    background:
        linear-gradient(135deg, var(--sg-glass-highlight), transparent 42%),
        var(--sg-glass-surface);
    border-color: var(--sg-glass-border);
    box-shadow: var(--sg-glass-shadow);
}

body.sg-liquid-glass .sg-home-hero__signal {
    background:
        linear-gradient(90deg, rgba(20, 91, 66, .05) 1px, transparent 1px) 0 0 / 28px 28px,
        linear-gradient(rgba(20, 91, 66, .05) 1px, transparent 1px) 0 0 / 28px 28px,
        linear-gradient(135deg, var(--sg-glass-specular), transparent 46%),
        linear-gradient(160deg, rgba(69, 178, 154, .10), rgba(86, 190, 209, .06) 48%, transparent 78%),
        var(--sg-glass-surface-prominent);
    border-color: var(--sg-glass-border-prominent);
    box-shadow: var(--sg-glass-shadow-prominent), inset 0 1px 0 var(--sg-glass-specular);
}

body.sg-liquid-glass .sg-metric,
body.sg-liquid-glass .sg-service-card,
body.sg-liquid-glass .sg-service-hero,
body.sg-liquid-glass .sg-dashboard-panel,
body.sg-liquid-glass .sg-invoice-overview,
body.sg-liquid-glass .sg-masspay__invoices,
body.sg-liquid-glass .sg-masspay__summary,
body.sg-liquid-glass .sg-masspay__payment,
body.sg-liquid-glass .sg-auth__form {
    background:
        linear-gradient(135deg, var(--sg-glass-specular), transparent 46%),
        linear-gradient(160deg, rgba(69, 178, 154, .10), rgba(86, 190, 209, .06) 48%, transparent 78%),
        var(--sg-glass-surface-prominent);
    border-color: var(--sg-glass-border-prominent);
    box-shadow: var(--sg-glass-shadow-prominent), inset 0 1px 0 var(--sg-glass-specular);
}

body.sg-liquid-glass .sg-dashboard-panel {
    padding: clamp(18px, 2.5vw, 26px);
    border: 1px solid var(--sg-glass-border-prominent);
    border-radius: var(--sg-radius-lg);
}

body.sg-liquid-glass .sg-signal-card,
body.sg-liquid-glass .sg-service-actions__menu {
    background:
        linear-gradient(135deg, var(--sg-glass-specular), transparent 48%),
        var(--sg-glass-surface-strong);
    border-color: var(--sg-glass-border-prominent);
    box-shadow: var(--sg-glass-shadow-float), inset 0 1px 0 var(--sg-glass-specular);
}

body.sg-liquid-glass .sg-help-link,
body.sg-liquid-glass .sg-masspay-invoice,
body.sg-liquid-glass .sg-register-card,
body.sg-liquid-glass .sg-cancellation-card {
    background:
        linear-gradient(135deg, var(--sg-glass-specular), transparent 52%),
        var(--sg-glass-surface-soft);
    border-color: var(--sg-glass-border);
    box-shadow: var(--sg-glass-shadow), inset 0 1px 0 var(--sg-glass-specular);
}

body.sg-liquid-glass .sg-invoice-overview__stat,
body.sg-liquid-glass .sg-dashboard-panel__item-icon {
    background:
        linear-gradient(135deg, var(--sg-glass-specular), transparent 56%),
        var(--sg-glass-surface-soft);
    border: 1px solid var(--sg-glass-border);
    box-shadow: var(--sg-glass-shadow), inset 0 1px 0 var(--sg-glass-specular);
}

body.sg-liquid-glass .sg-invoice-overview__stat--all {
    background:
        linear-gradient(135deg, var(--sg-glass-specular), transparent 56%),
        rgba(240, 248, 244, .78);
    border-color: rgba(20, 91, 66, .28);
}

body.sg-liquid-glass .sg-invoice-overview__stat--pending {
    background:
        linear-gradient(135deg, var(--sg-glass-specular), transparent 56%),
        rgba(255, 249, 233, .82);
    border-color: rgba(234, 216, 172, .86);
}

body.sg-liquid-glass .sg-invoice-overview__stat--paid {
    background:
        linear-gradient(135deg, var(--sg-glass-specular), transparent 56%),
        rgba(237, 248, 242, .80);
    border-color: rgba(184, 217, 201, .86);
}

body.sg-liquid-glass .sg-service-tabs {
    position: relative;
    flex-wrap: nowrap;
    gap: 8px;
    padding: 8px;
    border: 1px solid var(--sg-glass-border);
    border-radius: var(--sg-radius-lg);
    background:
        linear-gradient(135deg, var(--sg-glass-specular), transparent 56%),
        var(--sg-glass-surface-soft);
    box-shadow: var(--sg-glass-shadow), inset 0 1px 0 var(--sg-glass-specular);
}

body.sg-liquid-glass .sg-service-tabs__indicator {
    background:
        linear-gradient(135deg, var(--sg-selector-indicator-highlight), transparent 58%),
        var(--sg-selector-indicator-surface);
    border: 1px solid var(--sg-selector-indicator-border);
    border-radius: var(--sg-radius-md);
    box-shadow: var(--sg-selector-indicator-shadow), inset 0 1px 0 var(--sg-selector-indicator-highlight);
    display: block;
    height: 0;
    left: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    transform: translate3d(0, 0, 0);
    transition: height 200ms ease, opacity 160ms ease, transform 200ms ease, width 200ms ease;
    width: 0;
    z-index: 0;
}

body.sg-liquid-glass .sg-service-tabs a {
    flex: 0 0 auto;
    min-height: 36px;
    padding: 7px 11px;
    border: 1px solid transparent;
    border-radius: var(--sg-radius-md);
    background: transparent;
    box-shadow: inset 0 1px 0 transparent;
    text-decoration: none;
    position: relative;
    z-index: 1;
}

body.sg-liquid-glass .sg-service-tabs a:hover:not(.active),
body.sg-liquid-glass .sg-service-tabs a:focus-visible:not(.active) {
    border-color: var(--sg-glass-border);
    background:
        linear-gradient(135deg, var(--sg-glass-specular), transparent 60%),
        var(--sg-glass-surface-soft);
    box-shadow: inset 0 1px 0 var(--sg-glass-specular);
}

body.sg-liquid-glass .sg-service-tabs a.active::after {
    display: none;
}

body.sg-liquid-glass .sg-service-tabs a.active {
    border-color: var(--sg-selector-indicator-border);
    border-radius: var(--sg-radius-md);
    background:
        linear-gradient(135deg, var(--sg-selector-indicator-highlight), transparent 58%),
        var(--sg-selector-indicator-surface);
    box-shadow: var(--sg-selector-indicator-shadow), inset 0 1px 0 var(--sg-selector-indicator-highlight);
    color: #ffffff;
}

body.sg-liquid-glass .sg-service-tabs.is-enhanced .sg-service-tabs__indicator {
    opacity: 1;
}

body.sg-liquid-glass .sg-service-tabs.is-initializing .sg-service-tabs__indicator {
    transition: none !important;
}

body.sg-liquid-glass .sg-service-tabs.is-enhanced a.active {
    background: transparent;
    border-color: transparent;
    box-shadow: none;
    color: #ffffff;
}

body.sg-liquid-glass .sg-service-tabs a:focus-visible {
    outline: 2px solid var(--sg-brand, #0b9d8d);
    outline-offset: 2px;
}

body.sg-liquid-glass .sg-service-actions__toggle {
    background:
        linear-gradient(135deg, var(--sg-glass-specular), transparent 56%),
        var(--sg-glass-surface-soft);
    border-color: var(--sg-glass-border);
    box-shadow: inset 0 1px 0 var(--sg-glass-specular);
}

body.sg-liquid-glass .sg-status-pill,
body.sg-liquid-glass .sg-status-badge {
    background:
        linear-gradient(135deg, var(--sg-glass-specular), transparent 60%),
        var(--sg-glass-surface-soft);
    border-color: var(--sg-glass-border);
    box-shadow: inset 0 1px 0 var(--sg-glass-specular);
}

body.sg-liquid-glass .sg-status-pill--active,
body.sg-liquid-glass .sg-status-badge.status-active,
body.sg-liquid-glass .sg-status-badge.status-completed {
    background:
        linear-gradient(135deg, var(--sg-glass-specular), transparent 60%),
        rgba(237, 248, 242, .82);
    border-color: rgba(184, 217, 201, .86);
}

body.sg-liquid-glass .sg-status-badge.status-pending,
body.sg-liquid-glass .sg-status-badge.status-fraud {
    background:
        linear-gradient(135deg, var(--sg-glass-specular), transparent 60%),
        rgba(255, 249, 233, .84);
    border-color: rgba(234, 216, 172, .86);
}

body.sg-liquid-glass .sg-status-badge.status-suspended,
body.sg-liquid-glass .sg-status-badge.status-terminated,
body.sg-liquid-glass .sg-status-badge.status-cancelled {
    background:
        linear-gradient(135deg, var(--sg-glass-specular), transparent 60%),
        rgba(255, 241, 241, .84);
    border-color: rgba(228, 188, 188, .86);
}

body.sg-liquid-glass .sg-status-pill--active {
    color: var(--sg-success);
    background:
        linear-gradient(135deg, var(--sg-glass-specular), transparent 60%),
        rgba(237, 248, 242, .82);
    border-color: rgba(184, 217, 201, .86);
}

body.sg-liquid-glass .sg-status-pill--pending,
body.sg-liquid-glass .sg-status-pill--fraud {
    color: var(--sg-warning);
    background:
        linear-gradient(135deg, var(--sg-glass-specular), transparent 60%),
        rgba(255, 249, 233, .84);
    border-color: rgba(234, 216, 172, .86);
}

body.sg-liquid-glass .sg-status-pill--suspended,
body.sg-liquid-glass .sg-status-pill--terminated,
body.sg-liquid-glass .sg-status-pill--cancelled {
    color: var(--sg-danger);
    background:
        linear-gradient(135deg, var(--sg-glass-specular), transparent 60%),
        rgba(255, 241, 241, .84);
    border-color: rgba(228, 188, 188, .86);
}

@media (max-width: 900px) {
    body.sg-liquid-glass .sg-navigation {
        background: var(--sg-glass-surface-strong);
        border-color: var(--sg-glass-border-strong);
        box-shadow: var(--sg-glass-shadow-float);
    }
}

body.sg-liquid-glass:not(.sg-order-context) .modal .modal-content {
    background: var(--sg-glass-surface-strong);
    border-color: var(--sg-glass-border-strong);
    box-shadow: var(--sg-glass-shadow-float);
}

@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    @media (min-width: 901px) {
        body.sg-liquid-glass .sg-header {
            -webkit-backdrop-filter: blur(var(--sg-glass-blur)) saturate(var(--sg-glass-saturate));
            backdrop-filter: blur(var(--sg-glass-blur)) saturate(var(--sg-glass-saturate));
        }
    }

    @media (max-width: 900px) {
        body.sg-liquid-glass .sg-navigation {
            -webkit-backdrop-filter: blur(var(--sg-glass-blur)) saturate(var(--sg-glass-saturate));
            backdrop-filter: blur(var(--sg-glass-blur)) saturate(var(--sg-glass-saturate));
        }
    }

    body.sg-liquid-glass:not(.sg-order-context) .modal .modal-content {
        -webkit-backdrop-filter: blur(var(--sg-glass-blur)) saturate(var(--sg-glass-saturate));
        backdrop-filter: blur(var(--sg-glass-blur)) saturate(var(--sg-glass-saturate));
    }

    body.sg-liquid-glass .sg-signal-card,
    body.sg-liquid-glass .sg-service-actions__menu {
        -webkit-backdrop-filter: blur(var(--sg-glass-blur)) saturate(var(--sg-glass-saturate));
        backdrop-filter: blur(var(--sg-glass-blur)) saturate(var(--sg-glass-saturate));
    }
}

/* v1.5.15 Homepage Game Directory: one restrained glass surface per entry. */
body.sg-liquid-glass .sg-home-game {
    background:
        linear-gradient(135deg, var(--sg-glass-highlight), transparent 48%),
        var(--sg-glass-surface);
    border-color: var(--sg-glass-border);
    box-shadow: var(--sg-glass-shadow);
}

body.sg-liquid-glass .sg-home-game__icon {
    background: rgba(234, 249, 244, .72);
    border-color: var(--sg-glass-border);
    box-shadow: inset 0 1px 0 var(--sg-glass-specular);
}

body.sg-liquid-glass .sg-home-game__meta {
    padding: 6px 10px;
    border: 1px solid var(--sg-glass-border);
    border-radius: 999px;
    background: rgba(234, 249, 244, .72);
    color: var(--sg-text-secondary);
}

body.sg-liquid-glass .sg-home-game__cta {
    border-color: var(--sg-glass-border-strong);
    background: rgba(255, 255, 255, .56);
    box-shadow: inset 0 1px 0 var(--sg-glass-specular);
    color: var(--sg-brand);
}

body.sg-liquid-glass .sg-home-game__cta:hover,
body.sg-liquid-glass .sg-home-game__cta:focus {
    border-color: var(--sg-glass-border-strong);
    background: var(--sg-glass-surface-strong);
    color: var(--sg-brand);
}

body.sg-liquid-glass .sg-home-game:hover,
body.sg-liquid-glass .sg-home-game:focus-within {
    border-color: var(--sg-glass-border-strong);
    box-shadow: var(--sg-glass-shadow-float);
    transform: translateY(-1px);
}

@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    body.sg-liquid-glass .sg-home-game {
        -webkit-backdrop-filter: blur(12px) saturate(120%);
        backdrop-filter: blur(12px) saturate(120%);
    }
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    body.sg-liquid-glass .sg-home-game {
        background: var(--sg-glass-surface-strong);
    }
}

@media (prefers-contrast: more) {
    body.sg-liquid-glass {
        --sg-glass-surface: rgba(255, 255, 255, .92);
        --sg-glass-surface-strong: rgba(255, 255, 255, .97);
        --sg-glass-surface-soft: rgba(248, 252, 251, .92);
        --sg-glass-border: rgba(24, 76, 68, .42);
        --sg-glass-border-strong: rgba(24, 76, 68, .64);
        --sg-glass-surface-prominent: rgba(255, 255, 255, .94);
        --sg-glass-border-prominent: rgba(24, 76, 68, .68);
        --sg-glass-shadow-prominent: 0 16px 36px rgba(29, 72, 68, .12), 0 3px 10px rgba(38, 126, 112, .06);
        --sg-glass-specular: rgba(255, 255, 255, .90);
        --sg-selector-indicator-surface: rgba(4, 72, 58, .92);
        --sg-selector-indicator-border: rgba(4, 58, 46, .88);
        --sg-selector-indicator-highlight: rgba(255, 255, 255, .10);
    }
}

@media (prefers-reduced-motion: reduce) {
    body.sg-liquid-glass .sg-service-tabs__indicator {
        transition: none !important;
    }
}

@media print {
    body.sg-liquid-glass {
        background: #fff;
    }

    body.sg-liquid-glass .sg-header,
    body.sg-liquid-glass .sg-footer,
    body.sg-liquid-glass .sg-sidebar .card,
    body.sg-liquid-glass .sg-sidebar .card-sidebar,
    body.sg-liquid-glass .sg-content > .card,
    body.sg-liquid-glass .sg-content > .panel,
    body.sg-liquid-glass .modal .modal-content,
    body.sg-liquid-glass .sg-home-hero__signal,
    body.sg-liquid-glass .sg-signal-card,
    body.sg-liquid-glass .sg-metric,
    body.sg-liquid-glass .sg-home-product,
    body.sg-liquid-glass .sg-empty-state,
    body.sg-liquid-glass .sg-service-card,
    body.sg-liquid-glass .sg-service-hero,
    body.sg-liquid-glass .sg-service-fact,
    body.sg-liquid-glass .sg-service-meta__address,
    body.sg-liquid-glass .sg-service-meta__actions,
    body.sg-liquid-glass .sg-service-detail__panel,
    body.sg-liquid-glass .sg-service-detail-grid > div,
    body.sg-liquid-glass .sg-service-usage-grid > div,
    body.sg-liquid-glass .sg-dashboard-panel,
    body.sg-liquid-glass .sg-dashboard-panel__item-icon,
    body.sg-liquid-glass .sg-help-link,
    body.sg-liquid-glass .sg-service-tabs,
    body.sg-liquid-glass .sg-service-tabs__indicator,
    body.sg-liquid-glass .sg-service-tabs a.active,
    body.sg-liquid-glass .sg-service-actions__menu,
    body.sg-liquid-glass .sg-service-actions__toggle,
    body.sg-liquid-glass .sg-status-pill,
    body.sg-liquid-glass .sg-status-badge,
    body.sg-liquid-glass .sg-auth__form,
    body.sg-liquid-glass .sg-invoice-overview,
    body.sg-liquid-glass .sg-invoice-overview__stat,
    body.sg-liquid-glass .sg-masspay__invoices,
    body.sg-liquid-glass .sg-masspay__summary,
    body.sg-liquid-glass .sg-masspay__payment,
    body.sg-liquid-glass .sg-masspay-invoice,
    body.sg-liquid-glass .sg-register-card,
    body.sg-liquid-glass .sg-cancellation-card {
        background: #fff;
        background-image: none;
        box-shadow: none;
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
    }

    body.sg-liquid-glass .sg-service-tabs__indicator {
        display: none;
    }

    body.sg-liquid-glass .sg-service-tabs a.active,
    body.sg-liquid-glass .sg-service-tabs.is-enhanced a.active {
        background: transparent;
        background-image: none;
        border-color: #555;
        box-shadow: none;
        color: #222;
        font-weight: 700;
        outline: 1px solid #555;
        outline-offset: -1px;
        text-decoration: underline;
        transition: none;
        animation: none;
    }
}