/**
 * Mr Zero — delightful visual effects (aurora, glass, shine)
 */

/* ── Aurora background on all themed pages ── */
body.mz-theme::after,
body.mz-hub-page::after {
    content: '';
    position: fixed;
    inset: -20%;
    z-index: -1;
    pointer-events: none;
    background:
        radial-gradient(circle at 12% 18%, rgba(6, 182, 212, 0.12) 0%, transparent 42%),
        radial-gradient(circle at 88% 12%, rgba(34, 211, 238, 0.1) 0%, transparent 38%),
        radial-gradient(circle at 72% 88%, rgba(167, 139, 250, 0.06) 0%, transparent 40%),
        radial-gradient(circle at 20% 75%, rgba(52, 211, 153, 0.05) 0%, transparent 35%);
    animation: mz-aurora 14s ease-in-out infinite alternate;
}

body.mz-hub-page::after {
    background:
        radial-gradient(circle at 12% 18%, rgba(6, 182, 212, 0.08) 0%, transparent 42%),
        radial-gradient(circle at 88% 12%, rgba(34, 211, 238, 0.06) 0%, transparent 38%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.5) 0%, rgba(248, 250, 252, 0.92) 100%) !important;
}

/* Hub uses mz-hub-shell — no narrow .container */

/* Glass morphism panels */
body.mz-theme .card,
body.mz-theme .container > .header,
body.mz-theme .header:not(.common-header):not(.header-left):not(.header-right),
.mz-hub-hero,
.mz-hub-grid .card,
.mz-balance-panel,
.mz-welcome-banner {
    backdrop-filter: blur(14px) saturate(130%);
    -webkit-backdrop-filter: blur(14px) saturate(130%);
}

body.mz-theme .card,
.mz-hub-grid .card {
    background: linear-gradient(
        155deg,
        rgba(255, 255, 255, 0.98) 0%,
        rgba(248, 250, 252, 0.95) 100%
    ) !important;
    position: relative;
    overflow: hidden;
}

/* Shine sweep on card hover */
body.mz-theme .card::after,
.mz-hub-grid .card::after {
    content: '';
    display: block !important;
    position: absolute;
    top: 0;
    left: -100%;
    width: 55%;
    height: 100%;
    background: linear-gradient(
        105deg,
        transparent 0%,
        rgba(255, 255, 255, 0) 45%,
        rgba(255, 255, 255, 0.55) 50%,
        rgba(255, 255, 255, 0) 55%,
        transparent 100%
    );
    transform: skewX(-18deg);
    transition: left 0.6s ease;
    pointer-events: none;
}

body.mz-theme .card:hover::after,
.mz-hub-grid .card:hover::after {
    left: 140%;
}

/* Animated gradient top bar on cards */
body.mz-theme .card::before,
.mz-hub-grid .card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #0891b2, #22d3ee, #67e8f9, #0891b2);
    background-size: 300% 100%;
    animation: mz-border-flow 5s linear infinite;
}

/* Logo float + glow */
.mz-nav-logo img,
.mz-hub-hero__logo {
    animation: mz-float 4.5s ease-in-out infinite, mz-logo-glow 3s ease-in-out infinite;
}

.mz-nav-logo:hover img {
    animation-duration: 2s, 1.5s;
}

/* Nav buttons micro-interaction */
.common-header .home-btn,
.common-header .my-account-btn,
.common-header .add-funds-btn-header,
.common-header .admin-panel-btn {
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, border-color 0.2s ease !important;
}

.common-header .home-btn:hover,
.common-header .my-account-btn:hover,
.common-header .add-funds-btn-header:hover {
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 6px 20px rgba(34, 211, 238, 0.2) !important;
}

/* Primary buttons — shine sweep */
body.mz-theme .card > button,
body.mz-theme .card button[type="button"],
body.mz-theme .card button[type="submit"],
body.mz-theme form > button,
.mz-hub-grid .card-link {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

body.mz-theme .card > button::after,
body.mz-theme .card button[type="button"]::after,
body.mz-theme .card button[type="submit"]::after,
body.mz-theme form > button::after,
.mz-hub-grid .card-link::after {
    content: '';
    position: absolute;
    top: 0;
    left: -120%;
    width: 60%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.22), transparent);
    animation: mz-btn-shine 3.5s ease-in-out infinite;
    pointer-events: none;
}

/* Search — animated border */
.mz-hub-search {
    position: relative;
    padding: 2px !important;
    border: none !important;
    background: linear-gradient(90deg, #0891b2, #22d3ee, #67e8f9, #0891b2) !important;
    background-size: 300% 100% !important;
    animation: mz-border-flow 6s linear infinite;
    border-radius: 10px !important;
}

.mz-hub-search > input,
.mz-hub-search input {
    border-radius: 10px !important;
    background: #ffffff !important;
}

/* Hero title subtle glow */
.mz-hub-hero__title {
    animation: mz-text-glow 4s ease-in-out infinite;
}

.mz-hub-hero__eyebrow {
    animation: mz-fade-in 0.6s ease-out 0.2s both;
}

/* Service header animated accent */
body.mz-theme .container > .header::before,
body.mz-theme .header:not(.common-header)::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    border-radius: 10px 10px 0 0;
    background: linear-gradient(90deg, #0891b2, #22d3ee, #a78bfa, #0891b2);
    background-size: 300% 100%;
    animation: mz-border-flow 5s linear infinite;
}

body.mz-theme .container > .header,
body.mz-theme .header:not(.common-header):not(.header-left):not(.header-right) {
    position: relative;
    overflow: hidden;
}

/* Info boxes gentle pulse */
body.mz-theme .info-box,
body.mz-theme .service11-billing-note,
body.mz-theme .easypaisa-cross-note {
    animation: mz-scale-in 0.4s ease-out both, mz-glow-pulse 4s ease-in-out 0.5s infinite;
}

/* Inputs focus glow — one-shot, not looping */
body.mz-theme textarea:focus,
body.mz-theme input:focus,
body.mz-theme select:focus {
    box-shadow: 0 0 0 3px rgba(6, 182, 212, 0.18), 0 0 20px rgba(6, 182, 212, 0.1) !important;
}

/* Progress bar enhanced */
body.mz-theme .progress-bar-fill {
    position: relative;
    overflow: hidden;
}

body.mz-theme .progress-bar-fill::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.35), transparent);
    animation: mz-btn-shine 1.8s linear infinite;
}

/* Auth page delight */
body.mz-auth-page .login-container,
body.mz-auth-page .signup-container {
    position: relative;
    overflow: hidden;
    border: 2px solid transparent !important;
    background-clip: padding-box;
    box-shadow: 0 0 40px rgba(6, 182, 212, 0.1), 0 16px 48px rgba(15, 23, 42, 0.08) !important;
}

body.mz-auth-page .login-container::before,
body.mz-auth-page .signup-container::before {
    content: '';
    position: absolute;
    inset: -2px;
    border-radius: 16px;
    padding: 2px;
    background: linear-gradient(135deg, #0891b2, #22d3ee, #a78bfa, #0891b2);
    background-size: 300% 300%;
    animation: mz-border-flow 8s linear infinite;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    z-index: -1;
    pointer-events: none;
}

body.mz-auth-page .brand-hero__logo-img {
    animation: mz-float 4s ease-in-out infinite, mz-logo-glow 3s ease-in-out infinite;
}

/* Hub cards — calmer than service pages */
body.mz-hub-page .mz-hub-grid .card::before {
    display: none;
}

body.mz-hub-page .mz-hub-grid .card::after {
    display: none;
}

body.mz-hub-page .mz-hub-hero {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

body.mz-hub-page .mz-hub-hero__title {
    animation: none;
}

/* Stagger hub cards — disabled for cleaner full-page grid */

.mz-svc-num {
    animation: mz-fade-in 0.5s ease-out both;
}

.mz-hub-grid .card-link:active {
    transform: scale(0.98) !important;
}
