/**
 * CASINO NIGHT THEME STYLES
 */

body.theme-casino-night {
    background-color: var(--color-primary);
    text-rendering: optimizeLegibility;

    --chip-left-offset: 0px;
    --chip-right-offset: 0px;

    /* Card & Chip SVG Assets */
    /* Left Fan: Pivot shifted to (35,35) and rotated counter-clockwise (negative angles) to fan out down-right */
    --img-cards-left: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 160'><defs><filter id='s' x='-30%' y='-30%' width='160%' height='160%'><feDropShadow dx='1' dy='3' stdDeviation='3' flood-opacity='0.35'/></filter></defs><g transform='translate(35, 35) rotate(-18)'><rect x='-30' y='15' width='60' height='90' rx='5' fill='%23ffffff' stroke='%23D4AF37' stroke-width='1.2' filter='url(%23s)'/><text x='-25' y='30' font-family='Georgia,serif' font-size='11' font-weight='bold' fill='%23E31B23'>J</text><path d='M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z' fill='%23E31B23' transform='translate(-25, 34) scale(0.35) translate(-12, -12)'/><path d='M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z' fill='%23E31B23' transform='translate(0, 60) scale(0.7) translate(-12, -12)'/><path d='M 2,16 L 4,8 L 9,12 L 12,6 L 15,12 L 20,8 L 22,16 L 22,18 L 2,18 Z' fill='%23D4AF37' transform='translate(0, 44) scale(0.65) translate(-12, -12)'/></g><g transform='translate(35, 35) rotate(-45)'><rect x='-30' y='15' width='60' height='90' rx='5' fill='%23ffffff' stroke='%23D4AF37' stroke-width='1.2' filter='url(%23s)'/><text x='-25' y='30' font-family='Georgia,serif' font-size='11' font-weight='bold' fill='%23111111'>A</text><path d='M12 2C11.5 2 6 9 6 13C6 16.5 8.5 19 12 19C15.5 19 18 16.5 18 13C18 9 12.5 2 12 2ZM10.5 19L9.5 22.5H14.5L13.5 19H10.5Z' fill='%23111111' transform='translate(-25, 34) scale(0.35) translate(-12, -12)'/><path d='M12 2C11.5 2 6 9 6 13C6 16.5 8.5 19 12 19C15.5 19 18 16.5 18 13C18 9 12.5 2 12 2ZM10.5 19L9.5 22.5H14.5L13.5 19H10.5Z' fill='%23111111' transform='translate(0, 60) scale(0.8) translate(-12, -12)'/><path d='M 2,16 L 4,8 L 9,12 L 12,6 L 15,12 L 20,8 L 22,16 L 22,18 L 2,18 Z' fill='%23D4AF37' transform='translate(0, 44) scale(0.65) translate(-12, -12)'/></g><g transform='translate(35, 35) rotate(-72)'><rect x='-30' y='15' width='60' height='90' rx='5' fill='%23ffffff' stroke='%23D4AF37' stroke-width='1.2' filter='url(%23s)'/><text x='-25' y='30' font-family='Georgia,serif' font-size='11' font-weight='bold' fill='%23E31B23'>K</text><path d='M12 2L2 12l10 10 10-10L12 2z' fill='%23E31B23' transform='translate(-25, 34) scale(0.35) translate(-12, -12)'/><path d='M12 2L2 12l10 10 10-10L12 2z' fill='%23E31B23' transform='translate(0, 60) scale(0.7) translate(-12, -12)'/><path d='M 2,16 L 4,8 L 9,12 L 12,6 L 15,12 L 20,8 L 22,16 L 22,18 L 2,18 Z' fill='%23D4AF37' transform='translate(0, 44) scale(0.65) translate(-12, -12)'/></g></svg>");

    /* Right Fan: Pivot shifted to (125,35) and rotated clockwise (positive angles) to fan out down-left */
    --img-cards-right: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 160'><defs><filter id='s' x='-30%' y='-30%' width='160%' height='160%'><feDropShadow dx='-1' dy='3' stdDeviation='3' flood-opacity='0.35'/></filter></defs><g transform='translate(125, 35) rotate(72)'><rect x='-30' y='15' width='60' height='90' rx='5' fill='%23ffffff' stroke='%23D4AF37' stroke-width='1.2' filter='url(%23s)'/><text x='-25' y='30' font-family='Georgia,serif' font-size='11' font-weight='bold' fill='%23111111'>Q</text><path d='M12 2C13.7 2 15 3.3 15 5C15 5.8 14.7 6.6 14.1 7.2C15.8 7.3 17 8.7 17 10.5C17 12.2 15.7 13.5 14 13.5C13.8 13.5 13.5 13.5 13.3 13.4C13.9 14.5 14.5 16 14.5 19H9.5C9.5 16 10.1 14.5 10.7 13.4C10.5 13.5 10.2 13.5 10 13.5C8.3 13.5 7 12.2 7 10.5C7 8.7 8.2 7.3 9.9 7.2C9.3 6.6 9 5.8 9 5C9 3.3 10.3 2 12 2Z' fill='%23111111' transform='translate(-25, 34) scale(0.35) translate(-12, -12)'/><path d='M12 2C13.7 2 15 3.3 15 5C15 5.8 14.7 6.6 14.1 7.2C15.8 7.3 17 8.7 17 10.5C17 12.2 15.7 13.5 14 13.5C13.8 13.5 13.5 13.5 13.3 13.4C13.9 14.5 14.5 16 14.5 19H9.5C9.5 16 10.1 14.5 10.7 13.4C10.5 13.5 10.2 13.5 10 13.5C8.3 13.5 7 12.2 7 10.5C7 8.7 8.2 7.3 9.9 7.2C9.3 6.6 9 5.8 9 5C9 3.3 10.3 2 12 2Z' fill='%23111111' transform='translate(0, 60) scale(0.7) translate(-12, -12)'/><path d='M 2,16 L 4,8 L 9,12 L 12,6 L 15,12 L 20,8 L 22,16 L 22,18 L 2,18 Z' fill='%23D4AF37' transform='translate(0, 44) scale(0.65) translate(-12, -12)'/></g><g transform='translate(125, 35) rotate(45)'><rect x='-30' y='15' width='60' height='90' rx='5' fill='%23ffffff' stroke='%23D4AF37' stroke-width='1.2' filter='url(%23s)'/><text x='-25' y='30' font-family='Georgia,serif' font-size='11' font-weight='bold' fill='%23E31B23'>A</text><path d='M12 2L2 12l10 10 10-10L12 2z' fill='%23E31B23' transform='translate(-25, 34) scale(0.35) translate(-12, -12)'/><path d='M12 2L2 12l10 10 10-10L12 2z' fill='%23E31B23' transform='translate(0, 60) scale(0.75) translate(-12, -12)'/><path d='M 2,16 L 4,8 L 9,12 L 12,6 L 15,12 L 20,8 L 22,16 L 22,18 L 2,18 Z' fill='%23D4AF37' transform='translate(0, 44) scale(0.65) translate(-12, -12)'/></g><g transform='translate(125, 35) rotate(18)'><rect x='-30' y='15' width='60' height='90' rx='5' fill='%23ffffff' stroke='%23D4AF37' stroke-width='1.2' filter='url(%23s)'/><text x='-25' y='30' font-family='Georgia,serif' font-size='11' font-weight='bold' fill='%23111111'>K</text><path d='M12 2C11.5 2 6 9 6 13C6 16.5 8.5 19 12 19C15.5 19 18 16.5 18 13C18 9 12.5 2 12 2ZM10.5 19L9.5 22.5H14.5L13.5 19H10.5Z' fill='%23111111' transform='translate(-25, 34) scale(0.35) translate(-12, -12)'/><path d='M12 2C11.5 2 6 9 6 13C6 16.5 8.5 19 12 19C15.5 19 18 16.5 18 13C18 9 12.5 2 12 2ZM10.5 19L9.5 22.5H14.5L13.5 19H10.5Z' fill='%23111111' transform='translate(0, 60) scale(0.8) translate(-12, -12)'/><path d='M 2,16 L 4,8 L 9,12 L 12,6 L 15,12 L 20,8 L 22,16 L 22,18 L 2,18 Z' fill='%23D4AF37' transform='translate(0, 44) scale(0.65) translate(-12, -12)'/></g></svg>");

    --img-chip-red: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 120'><defs><filter id='s' x='-20%' y='-20%' width='140%' height='140%'><feDropShadow dx='0' dy='3' stdDeviation='3' flood-opacity='0.4'/></filter><g id='c'><path d='M 20,0 A 30,12 0 0 0 80,0 L 80,6 A 30,12 0 0 1 20,6 Z' fill='%23991218'/><polygon points='26,8.5 32,9.5 32,15.5 26,14.5' fill='%23ffffff'/><polygon points='47,12 53,12 53,18 47,18' fill='%23ffffff'/><polygon points='68,9.5 74,8.5 74,14.5 68,15.5' fill='%23ffffff'/><ellipse cx='50' cy='0' rx='30' ry='12' fill='%23E31B23'/><ellipse cx='50' cy='0' rx='20' ry='8' fill='none' stroke='%23ffffff' stroke-width='1.2' stroke-dasharray='4,3'/><ellipse cx='50' cy='0' rx='10' ry='4' fill='%23ffffff'/><path d='M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z' fill='%23E31B23' transform='translate(50, 0) scale(0.35) translate(-12,-12)'/></g></defs><g filter='url(%23s)'><use href='%23c' y='90'/><use href='%23c' y='84'/><use href='%23c' y='78'/><use href='%23c' y='72'/><use href='%23c' y='66'/><use href='%23c' y='60'/><use href='%23c' y='54'/><use href='%23c' y='48'/></g></svg>");

    --img-chip-blue: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 120'><defs><filter id='s' x='-20%' y='-20%' width='140%' height='140%'><feDropShadow dx='0' dy='3' stdDeviation='3' flood-opacity='0.4'/></filter><g id='c'><path d='M 20,0 A 30,12 0 0 0 80,0 L 80,6 A 30,12 0 0 1 20,6 Z' fill='%23101F2D'/><polygon points='26,8.5 32,9.5 32,15.5 26,14.5' fill='%23ffffff'/><polygon points='47,12 53,12 53,18 47,18' fill='%23ffffff'/><polygon points='68,9.5 74,8.5 74,14.5 68,15.5' fill='%23ffffff'/><ellipse cx='50' cy='0' rx='30' ry='12' fill='%231C3144'/><ellipse cx='50' cy='0' rx='20' ry='8' fill='none' stroke='%23ffffff' stroke-width='1.2' stroke-dasharray='4,3'/><ellipse cx='50' cy='0' rx='10' ry='4' fill='%23ffffff'/><path d='M12 2C11.5 2 6 9 6 13C6 16.5 8.5 19 12 19C15.5 19 18 16.5 18 13C18 9 12.5 2 12 2ZM10.5 19L9.5 22.5H14.5L13.5 19H10.5Z' fill='%23111111' transform='translate(50, 0) scale(0.35) translate(-12,-12)'/></g></defs><g filter='url(%23s)'><use href='%23c' y='84'/><use href='%23c' y='78'/><use href='%23c' y='72'/><use href='%23c' y='66'/><use href='%23c' y='60'/><use href='%23c' y='54'/></g></svg>");

    --img-chip-gold: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 120'><defs><filter id='s' x='-20%' y='-20%' width='140%' height='140%'><feDropShadow dx='0' dy='3' stdDeviation='3' flood-opacity='0.4'/></filter><g id='c'><path d='M 20,0 A 30,12 0 0 0 80,0 L 80,6 A 30,12 0 0 1 20,6 Z' fill='%2396781C'/><polygon points='26,8.5 32,9.5 32,15.5 26,14.5' fill='%23ffffff'/><polygon points='47,12 53,12 53,18 47,18' fill='%23ffffff'/><polygon points='68,9.5 74,8.5 74,14.5 68,15.5' fill='%23ffffff'/><ellipse cx='50' cy='0' rx='30' ry='12' fill='%23D4AF37'/><ellipse cx='50' cy='0' rx='20' ry='8' fill='none' stroke='%23ffffff' stroke-width='1.2' stroke-dasharray='4,3'/><ellipse cx='50' cy='0' rx='10' ry='4' fill='%23ffffff'/><path d='M12 2L2 12l10 10 10-10L12 2z' fill='%23E31B23' transform='translate(50, 0) scale(0.35) translate(-12,-12)'/></g></defs><g filter='url(%23s)'><use href='%23c' y='80'/><use href='%23c' y='74'/><use href='%23c' y='68'/><use href='%23c' y='62'/><use href='%23c' y='56'/></g></svg>");
}

/* Subtle, soft card-table felt fabric background texture */
body.theme-casino-night .theme-texture {
    background-image:
        radial-gradient(rgba(255, 255, 255, 0.03) 15%, transparent 50%),
        radial-gradient(rgba(0, 0, 0, 0.06) 15%, transparent 50%);
    background-size: 12px 12px;
    background-position: 0 0, 6px 6px;
    opacity: calc(0.35 + 0.45 * var(--frame-intensity));
    z-index: -2 !important;
    /* Force texture behind everything inside the frame */
    pointer-events: none;
}

/* Force Casino Frame to render BEHIND all poster text, banner, QR codes, and sway-layer cards/chips */
body.theme-casino-night .theme-frame {
    opacity: 1;
    border: 10px solid #8B6508;
    /* Dark gold base */
    box-shadow:
        inset 0 0 0 2px #FFD700,
        /* Gold line */
        inset 0 0 30px rgba(0, 0, 0, 0.6),
        /* Inner shadow */
        0 0 20px rgba(0, 0, 0, 0.8),
        0 0 calc(20px * var(--frame-intensity)) rgba(212, 175, 55, 0.3);
    border-radius: 6px;
    z-index: -10 !important;
    /* Forces frame and its texture behind main-content (z-index 10) and QR codes (z-index 30) */
}

/* Inner velvet edge for the frame */
body.theme-casino-night .theme-frame-inner {
    border: 4px solid #E31B23;
    /* Classic red card table trim */
    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.7);
    border-radius: 2px;
}

/* Hide Frame Logic */
body.border-hidden.theme-casino-night .theme-frame,
body.border-hidden.theme-casino-night .theme-texture {
    opacity: 0 !important;
    pointer-events: none;
}

/* 
========================================
DECORATIVE CORNER SWAY LAYERS
========================================
*/

body.theme-casino-night .sway-layer {
    display: none !important;
    /* Hide other unused layers */
    position: absolute;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    transform-origin: center;
    opacity: 0;
    transition: opacity 0.5s ease-in-out, left 0.6s cubic-bezier(0.34, 1.56, 0.64, 1), right 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
    pointer-events: none;
    z-index: 60;
    /* Render in front of the content-wrapper and frame */
    will-change: transform;
}

/* Ensure cards and chips are completely opaque */
body.theme-casino-night:not(.is-loading) .sway-layer {
    opacity: 1 !important;
}

body.theme-casino-night.border-hidden .sway-layer {
    opacity: 0 !important;
    animation-play-state: paused !important;
}

/* Top Left Corner: Fanned Cards (12px from corner to prevent any viewport clipping) */
body.theme-casino-night .sway-top-left {
    display: block !important;
    top: 12px;
    left: 12px;
    width: 15vw;
    height: 15vw;
    min-width: 140px;
    min-height: 140px;
    background-image: var(--img-cards-left);
    transform-origin: left top;
    animation: cards-sway-left calc(12s / var(--gust-speed)) ease-in-out infinite alternate;
}

/* Top Right Corner: Fanned Cards (12px from corner to prevent any viewport clipping) */
body.theme-casino-night .sway-top-right {
    display: block !important;
    top: 12px;
    right: 12px;
    width: 15vw;
    height: 15vw;
    min-width: 140px;
    min-height: 140px;
    background-image: var(--img-cards-right);
    transform-origin: right top;
    animation: cards-sway-right calc(10s / var(--gust-speed)) ease-in-out infinite alternate;
}

/* Bottom Left Corner: Staggered Red, Gold, Blue Chip Stacks nested cleanly inside the felt area */
body.theme-casino-night .sway-bottom-left {
    display: block !important;
    bottom: 45px;
    left: calc(55px + var(--chip-left-offset, 0px));
    width: 6.5vw;
    height: 8vw;
    min-width: 65px;
    min-height: 80px;
    background-image: var(--img-chip-red);
    transform-origin: center bottom;
    animation: chip-stack-left-1 calc(10.0s / var(--gust-speed)) ease-in-out infinite;
    z-index: 64;
}

body.theme-casino-night .sway-bottom-3 {
    display: block !important;
    bottom: 35px;
    left: calc(95px + var(--chip-left-offset, 0px));
    width: 6.5vw;
    height: 8vw;
    min-width: 65px;
    min-height: 80px;
    background-image: var(--img-chip-gold);
    transform-origin: center bottom;
    animation: chip-stack-left-2 calc(10.0s / var(--gust-speed)) ease-in-out infinite;
    z-index: 65;
    /* overlaps others in the stack */
}

body.theme-casino-night .sway-bottom-4 {
    display: block !important;
    bottom: 50px;
    left: calc(135px + var(--chip-left-offset, 0px));
    width: 6.5vw;
    height: 8vw;
    min-width: 65px;
    min-height: 80px;
    background-image: var(--img-chip-blue);
    transform-origin: center bottom;
    animation: chip-stack-left-3 calc(10.0s / var(--gust-speed)) ease-in-out infinite;
    z-index: 63;
}

/* Bottom Right Corner: Staggered Blue, Red, Gold Chip Stacks nested cleanly inside the felt area */
body.theme-casino-night .sway-bottom-right {
    display: block !important;
    bottom: 45px;
    right: calc(55px + var(--chip-right-offset, 0px));
    width: 6.5vw;
    height: 8vw;
    min-width: 65px;
    min-height: 80px;
    background-image: var(--img-chip-blue);
    transform-origin: center bottom;
    animation: chip-stack-right-1 calc(12.0s / var(--gust-speed)) ease-in-out infinite;
    z-index: 64;
}

body.theme-casino-night .sway-bottom-5 {
    display: block !important;
    bottom: 50px;
    right: calc(95px + var(--chip-right-offset, 0px));
    width: 6.5vw;
    height: 8vw;
    min-width: 65px;
    min-height: 80px;
    background-image: var(--img-chip-red);
    transform-origin: center bottom;
    animation: chip-stack-right-2 calc(12.0s / var(--gust-speed)) ease-in-out infinite;
    z-index: 65;
    /* overlaps others */
}

body.theme-casino-night .sway-bottom-6 {
    display: block !important;
    bottom: 35px;
    right: calc(135px + var(--chip-right-offset, 0px));
    width: 6.5vw;
    height: 8vw;
    min-width: 65px;
    min-height: 80px;
    background-image: var(--img-chip-gold);
    transform-origin: center bottom;
    animation: chip-stack-right-3 calc(12.0s / var(--gust-speed)) ease-in-out infinite;
    z-index: 63;
}

/* Staggered background chip stacks to create depth */
body.theme-casino-night .sway-bottom-7 {
    display: block !important;
    bottom: 55px;
    left: calc(20px + var(--chip-left-offset, 0px));
    width: 5.5vw;
    height: 6.8vw;
    min-width: 55px;
    min-height: 68px;
    background-image: var(--img-chip-blue);
    transform-origin: center bottom;
    z-index: 62;
}

body.theme-casino-night .sway-bottom-8 {
    display: block !important;
    bottom: 60px;
    left: calc(175px + var(--chip-left-offset, 0px));
    width: 5.5vw;
    height: 6.8vw;
    min-width: 55px;
    min-height: 68px;
    background-image: var(--img-chip-red);
    transform-origin: center bottom;
    z-index: 62;
}

body.theme-casino-night .sway-bottom-9 {
    display: block !important;
    bottom: 55px;
    right: calc(20px + var(--chip-right-offset, 0px));
    width: 5.5vw;
    height: 6.8vw;
    min-width: 55px;
    min-height: 68px;
    background-image: var(--img-chip-red);
    transform-origin: center bottom;
    z-index: 62;
}

body.theme-casino-night .sway-bottom-10 {
    display: block !important;
    bottom: 60px;
    right: calc(175px + var(--chip-right-offset, 0px));
    width: 5.5vw;
    height: 6.8vw;
    min-width: 55px;
    min-height: 68px;
    background-image: var(--img-chip-blue);
    transform-origin: center bottom;
    z-index: 62;
}

body.theme-casino-night .qr-left,
body.theme-casino-night .qr-right {
    bottom: 50px !important;
}

body.theme-casino-night .qr-left {
    left: 50px !important;
}

body.theme-casino-night .qr-right {
    right: 50px !important;
}

/* Offset chips when QR codes are visible */
body.theme-casino-night:has(#qr-soiree:not(.qr-hidden)) {
    --chip-left-offset: 230px;
}

body.theme-casino-night:has(#qr-membership:not(.qr-hidden)) {
    --chip-right-offset: 230px;
}

@media (max-width: 1400px) {
    body.theme-casino-night:has(#qr-soiree:not(.qr-hidden)) {
        --chip-left-offset: 140px;
    }

    body.theme-casino-night:has(#qr-membership:not(.qr-hidden)) {
        --chip-right-offset: 140px;
    }
}

/* 
========================================
ANIMATION KEYFRAMES
========================================
*/

@keyframes cards-sway-left {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(4deg) scale(1.02);
    }
}

@keyframes cards-sway-right {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(-4deg) scale(1.02);
    }
}

/* Snappy clacking/shuffling chip stack animations (Left Corner) */
@keyframes chip-stack-left-1 {
    0% {
        transform: translateX(0) rotate(0deg);
    }

    2% {
        transform: translateX(12px) rotate(1deg);
    }

    4% {
        transform: translateX(12px) rotate(1deg);
    }

    6% {
        transform: translateX(12px) rotate(-0.5deg);
    }

    8% {
        transform: translateX(12px) rotate(0.5deg);
    }

    10% {
        transform: translateX(12px) rotate(-1deg);
    }

    12% {
        transform: translateX(12px) rotate(0deg);
    }

    15%,
    100% {
        transform: translateX(0) rotate(0deg);
    }
}

@keyframes chip-stack-left-2 {
    0% {
        transform: translateX(0) rotate(0deg);
    }

    2% {
        transform: translateX(-12px) rotate(-1deg);
    }

    4% {
        transform: translateX(-12px) rotate(-1.5deg);
    }

    6% {
        transform: translateX(-12px) rotate(0deg);
    }

    8% {
        transform: translateX(-12px) rotate(-1deg);
    }

    10% {
        transform: translateX(-12px) rotate(0.5deg);
    }

    12% {
        transform: translateX(-12px) rotate(0deg);
    }

    15% {
        transform: translateX(0) rotate(0deg);
    }

    22% {
        transform: translateX(12px) rotate(1deg);
    }

    24% {
        transform: translateX(12px) rotate(1.5deg);
    }

    26% {
        transform: translateX(12px) rotate(0deg);
    }

    28% {
        transform: translateX(12px) rotate(-1deg);
    }

    30% {
        transform: translateX(12px) rotate(0.5deg);
    }

    32% {
        transform: translateX(12px) rotate(0deg);
    }

    35%,
    100% {
        transform: translateX(0) rotate(0deg);
    }
}

@keyframes chip-stack-left-3 {

    0%,
    20% {
        transform: translateX(0) rotate(0deg);
    }

    22% {
        transform: translateX(-12px) rotate(-1deg);
    }

    24% {
        transform: translateX(-12px) rotate(1deg);
    }

    26% {
        transform: translateX(-12px) rotate(-0.5deg);
    }

    28% {
        transform: translateX(-12px) rotate(0.5deg);
    }

    30% {
        transform: translateX(-12px) rotate(-1deg);
    }

    32% {
        transform: translateX(-12px) rotate(0deg);
    }

    35%,
    100% {
        transform: translateX(0) rotate(0deg);
    }
}

/* Snappy clacking/shuffling chip stack animations (Right Corner) */
@keyframes chip-stack-right-1 {
    0% {
        transform: translateX(0) rotate(0deg);
    }

    2% {
        transform: translateX(-12px) rotate(-1deg);
    }

    4% {
        transform: translateX(-12px) rotate(-1deg);
    }

    6% {
        transform: translateX(-12px) rotate(0.5deg);
    }

    8% {
        transform: translateX(-12px) rotate(-0.5deg);
    }

    10% {
        transform: translateX(-12px) rotate(1deg);
    }

    12% {
        transform: translateX(-12px) rotate(0deg);
    }

    15%,
    100% {
        transform: translateX(0) rotate(0deg);
    }
}

@keyframes chip-stack-right-2 {
    0% {
        transform: translateX(0) rotate(0deg);
    }

    2% {
        transform: translateX(12px) rotate(1deg);
    }

    4% {
        transform: translateX(12px) rotate(1.5deg);
    }

    6% {
        transform: translateX(12px) rotate(0deg);
    }

    8% {
        transform: translateX(12px) rotate(1deg);
    }

    10% {
        transform: translateX(12px) rotate(-0.5deg);
    }

    12% {
        transform: translateX(12px) rotate(0deg);
    }

    15% {
        transform: translateX(0) rotate(0deg);
    }

    22% {
        transform: translateX(-12px) rotate(-1deg);
    }

    24% {
        transform: translateX(-12px) rotate(-1.5deg);
    }

    26% {
        transform: translateX(-12px) rotate(0deg);
    }

    28% {
        transform: translateX(-12px) rotate(1deg);
    }

    30% {
        transform: translateX(-12px) rotate(-0.5deg);
    }

    32% {
        transform: translateX(-12px) rotate(0deg);
    }

    35%,
    100% {
        transform: translateX(0) rotate(0deg);
    }
}

@keyframes chip-stack-right-3 {

    0%,
    20% {
        transform: translateX(0) rotate(0deg);
    }

    22% {
        transform: translateX(12px) rotate(1deg);
    }

    24% {
        transform: translateX(12px) rotate(-1deg);
    }

    26% {
        transform: translateX(12px) rotate(0.5deg);
    }

    28% {
        transform: translateX(12px) rotate(-0.5deg);
    }

    30% {
        transform: translateX(12px) rotate(1deg);
    }

    32% {
        transform: translateX(12px) rotate(0deg);
    }

    35%,
    100% {
        transform: translateX(0) rotate(0deg);
    }
}

/* Logo Banner styling */
body.theme-casino-night .logo-banner {
    background: #111111 !important;
    border: 3px solid #FFD700 !important;
    box-shadow:
        inset 0 0 10px rgba(212, 175, 55, 0.4),
        0 8px 16px rgba(0, 0, 0, 0.5) !important;
    padding: 12px 36px !important;
    border-radius: 4px !important;
}

body.theme-casino-night .logo-text-custom {
    color: #FFD700 !important;
    font-family: var(--font-display) !important;
    font-size: 1.25rem !important;
    letter-spacing: 3px !important;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.8) !important;
    text-transform: uppercase;
}

/* Text Stylings */
body.theme-casino-night .event-top-label {
    font-family: var(--font-heading) !important;
    font-size: 2.0rem !important;
    color: #FFD700 !important;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.6) !important;
    letter-spacing: 5px !important;
    text-transform: uppercase;
    margin-bottom: 6px !important;
}

body.theme-casino-night .event-title {
    font-family: var(--font-display) !important;
    font-size: 3.4rem !important;
    color: #ffffff !important;
    text-shadow:
        0 2px 10px rgba(0, 0, 0, 0.8),
        0 0 20px rgba(212, 175, 55, 0.4) !important;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-top: 10px !important;
    margin-bottom: 12px !important;
}

body.theme-casino-night .event-subtitle {
    font-family: var(--font-primary) !important;
    font-size: 1.35rem !important;
    color: #FF5252 !important;
    /* Brighter, high-contrast red */
    letter-spacing: 4px !important;
    text-transform: uppercase;
    margin-top: 4px !important;
    margin-bottom: 20px !important;
    /* High-contrast outline effect for readability on felt green */
    text-shadow:
        1px 1px 0 #000,
        -1px -1px 0 #000,
        1px -1px 0 #000,
        -1px 1px 0 #000,
        0 2px 8px rgba(0, 0, 0, 0.9) !important;
}

body.theme-casino-night .event-date {
    font-family: var(--font-primary) !important;
    font-size: 1.15rem !important;
    color: #FFD700 !important;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.9) !important;
    background: rgba(0, 0, 0, 0.6) !important;
    border: 2px solid #FFD700 !important;
    padding: 6px 20px !important;
    letter-spacing: 1px !important;
}

body.theme-casino-night .hosts-title {
    font-family: var(--font-heading) !important;
    font-size: 2.4rem !important;
    color: #FFD700 !important;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8) !important;
    letter-spacing: 2px !important;
}

body.theme-casino-night .hosts-list span {
    font-family: var(--font-primary) !important;
    color: #ffffff !important;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8) !important;
    background: rgba(0, 0, 0, 0.55);
    border-left: none !important;
    /* Remove the vertical line */
    padding: 6px 16px;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
}

/* Card Suit Bullet Icons next to host names (cyclically rotating) */
body.theme-casino-night .hosts-list span::before {
    margin-right: 8px;
    font-size: 1.15rem;
    font-weight: bold;
    display: inline-block;
    line-height: 1;
}

/* 1. Spades (Gold) */
body.theme-casino-night .hosts-list span:nth-child(4n+1)::before {
    content: '♠';
    color: #FFD700;
}

/* 2. Hearts (Red) */
body.theme-casino-night .hosts-list span:nth-child(4n+2)::before {
    content: '♥';
    color: #E31B23;
}

/* 3. Diamonds (Red) */
body.theme-casino-night .hosts-list span:nth-child(4n+3)::before {
    content: '♦';
    color: #E31B23;
}

/* 4. Clubs (Gold) */
body.theme-casino-night .hosts-list span:nth-child(4n+4)::before {
    content: '♣';
    color: #FFD700;
}

/* Light Background overrides */
body.theme-casino-night.is-light-bg .logo-text-custom {
    color: #B58A00 !important;
    text-shadow: none !important;
}

body.theme-casino-night.is-light-bg .event-title {
    color: var(--color-dark-text) !important;
    text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.8) !important;
}

body.theme-casino-night.is-light-bg .hosts-title,
body.theme-casino-night.is-light-bg .event-top-label {
    color: var(--color-dark-text) !important;
    text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.8) !important;
}

body.theme-casino-night.is-light-bg .event-subtitle {
    color: #A81116 !important;
    text-shadow: none !important;
}

body.theme-casino-night.is-light-bg .hosts-list span {
    color: var(--color-dark-text) !important;
    background: rgba(255, 255, 255, 0.8) !important;
    text-shadow: none !important;
}

body.theme-casino-night.is-light-bg .hosts-list span:nth-child(4n+1)::before {
    color: #111111;
}

body.theme-casino-night.is-light-bg .hosts-list span:nth-child(4n+2)::before {
    color: #E31B23;
}

body.theme-casino-night.is-light-bg .hosts-list span:nth-child(4n+3)::before {
    color: #E31B23;
}

body.theme-casino-night.is-light-bg .hosts-list span:nth-child(4n+4)::before {
    color: #111111;
}

body.theme-casino-night.is-light-bg .event-date {
    background: #ffffff !important;
    color: var(--color-dark-text) !important;
    border-color: #B58A00 !important;
    text-shadow: none !important;
}

/* Card Suit Particles Styling */
body.theme-casino-night .petal {
    border-radius: 0 !important;
    box-shadow: none !important;
    filter: none !important;
}

body.theme-casino-night .petal.is-blurred {
    opacity: 0.5 !important;
}

/* Suit Shapes (Inline SVG masks) */
body.theme-casino-night .petal--heart {
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z'/></svg>") no-repeat center / contain;
    mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z'/></svg>") no-repeat center / contain;
}

body.theme-casino-night .petal--diamond {
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M12 2L2 12l10 10 10-10L12 2z'/></svg>") no-repeat center / contain;
    mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M12 2L2 12l10 10 10-10L12 2z'/></svg>") no-repeat center / contain;
}

body.theme-casino-night .petal--spade {
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M12 2C11.5 2 6 9 6 13C6 16.5 8.5 19 12 19C15.5 19 18 16.5 18 13C18 9 12.5 2 12 2ZM10.5 19L9.5 22.5H14.5L13.5 19H10.5Z'/></svg>") no-repeat center / contain;
    mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M12 2C11.5 2 6 9 6 13C6 16.5 8.5 19 12 19C15.5 19 18 16.5 18 13C18 9 12.5 2 12 2ZM10.5 19L9.5 22.5H14.5L13.5 19H10.5Z'/></svg>") no-repeat center / contain;
}

body.theme-casino-night .petal--club {
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M12 2C13.7 2 15 3.3 15 5C15 5.8 14.7 6.6 14.1 7.2C15.8 7.3 17 8.7 17 10.5C17 12.2 15.7 13.5 14 13.5C13.8 13.5 13.5 13.5 13.3 13.4C13.9 14.5 14.5 16 14.5 19H9.5C9.5 16 10.1 14.5 10.7 13.4C10.5 13.5 10.2 13.5 10 13.5C8.3 13.5 7 12.2 7 10.5C7 8.7 8.2 7.3 9.9 7.2C9.3 6.6 9 5.8 9 5C9 3.3 10.3 2 12 2Z'/></svg>") no-repeat center / contain;
    mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M12 2C13.7 2 15 3.3 15 5C15 5.8 14.7 6.6 14.1 7.2C15.8 7.3 17 8.7 17 10.5C17 12.2 15.7 13.5 14 13.5C13.8 13.5 13.5 13.5 13.3 13.4C13.9 14.5 14.5 16 14.5 19H9.5C9.5 16 10.1 14.5 10.7 13.4C10.5 13.5 10.2 13.5 10 13.5C8.3 13.5 7 12.2 7 10.5C7 8.7 8.2 7.3 9.9 7.2C9.3 6.6 9 5.8 9 5C9 3.3 10.3 2 12 2Z'/></svg>") no-repeat center / contain;
}

/* Responsive configurations */
@media (max-width: 1800px) {
    body.theme-casino-night .hosts-list span {
        font-size: calc(1.35rem * var(--host-text-size) * var(--host-scale-base) * var(--dynamic-scale));
    }

    body.theme-casino-night .hosts-container {
        margin-top: 3vh;
        margin-bottom: -1vh;
    }
}

@media (min-width: 1801px) {
    body.theme-casino-night .hosts-list span {
        font-size: calc(1.85rem * var(--host-text-size) * var(--host-scale-base) * var(--dynamic-scale));
    }

    body.theme-casino-night .hosts-container {
        margin-top: 5vh;
        margin-bottom: -2vh;
    }

    body.theme-casino-night .logo-banner {
        margin: 4rem 0 -4rem 0;
        scale: 1.25;
    }

    body.theme-casino-night .event-top-label {
        font-size: 2.6rem !important;
        margin-bottom: 10px !important;
    }

    body.theme-casino-night .event-title {
        font-size: 4.6rem !important;
        margin-top: 15px !important;
        margin-bottom: 18px !important;
    }

    body.theme-casino-night .event-subtitle {
        font-size: 1.7rem !important;
    }

    body.theme-casino-night .event-date {
        font-size: 1.4rem !important;
        margin-top: 18px !important;
    }
}