body.qr-power-challenge .qr-challenge-wrapper {
    background: url("images/challenge_bg.jpg") no-repeat 0 0;
    background-size: cover;
    padding: 45px 0 20px 0;
}

body.qr-power-challenge .content {
    background-color: #000 !important;
    padding: 0 10px;
}

body.qr-power-challenge .entry-content {
    margin: 0 auto !important;
    max-width: 1280px;
}

body.qr-power-challenge .page.challenge-container {
    margin: 0;
}

body.qr-power-challenge .challenge-container,
body.qr-power-challenge .stats-container {
    display: grid;
    /* Creates two columns of equal width */
    grid-template-columns: repeat(1, 1fr);
    /* Creates two rows of equal height (e.g., 150px each) */
    grid-template-rows: auto;
    /* Adds space between the grid cells */
    gap: 10px;
    margin: 0;
    padding: 0 10px;
}

body.qr-power-challenge .challenge-container.bonus {
    display: block;
    width: 100%;
    padding: 20px 50px;
}

body.qr-power-challenge .video-container {
    color: white;
    display: flex;
    /* Stacks items vertically (video top, instructions bottom) */
    flex-direction: column;
    /* Centers items horizontally */
    align-items: center;
    /* Adds spacing between video and instructions */
    gap: 20px;
    /* Adds spacing inside the container edges */
    padding: 5px;
}

body.qr-power-challenge .video-container .video,
body.qr-power-challenge .video-container .instructions {
    width: 100%;
    max-width: 100%;
    height: auto;
    background: #000;
    border-radius: 6px;
    display: block;
    padding: 5px 10px;
}

body.qr-power-challenge .qr-video {
    width: 100%;
}

body.qr-power-challenge .challenge-box-container,
body.qr-power-challenge .stats {
    margin-top: 1.5rem;
    padding: 1.35rem 1.5rem;
    border-radius: 14px;
    color: #f2f2f2;
    background:
            linear-gradient(
                    180deg,
                    rgba(255, 255, 255, 0.22) 0%,
                    rgba(255, 255, 255, 0.05) 14%,
                    rgba(0, 0, 0, 0.08) 55%,
                    rgba(0, 0, 0, 0.28) 100%
            ),
            linear-gradient(
                    90deg,
                    #2c2c2c 0%,
                    #4a4a4a 22%,
                    #7a7a7a 48%,
                    #555555 72%,
                    #2a2a2a 100%
            );
    border: 1px solid #1b1b1b;
    box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.38),
            inset 0 -2px 3px rgba(0, 0, 0, 0.45),
            inset 1px 0 0 rgba(255, 255, 255, 0.08),
            inset -1px 0 0 rgba(0, 0, 0, 0.4),
            0 3px 8px rgba(0, 0, 0, 0.45);
}

body.qr-power-challenge .stats h3 {
    text-align: center;
    width: 100%;
    margin: 0 0 0.5rem;
}

body.qr-power-challenge .stats .column {
    text-align: center;
    min-width: 120px;
    padding: 0 1rem;
}

body.qr-power-challenge .stats .column p {
    margin: 0.15rem 0;
}

body.qr-power-challenge .stats {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
}

body.qr-power-challenge .sponsor {
    display: grid;
    place-items: center;
    height: auto;
}

body.qr-power-challenge .sponsor img,
body.qr-power-challenge .sponsor-image img {
    max-width: 100%;
    height: auto;
}

body.qr-power-challenge .sponsor-image {
    width: 100%;
    height: 120px;
}

body.qr-power-challenge .leaderboard {
    margin: 1.5rem 10px 2rem;
}

body.qr-power-challenge .leaderboard .responsive-table {
    width: 100%;
    border-collapse: collapse;
    background: rgba(0, 0, 0, 0.55);
    color: #f2f2f2;
}

body.qr-power-challenge .leaderboard th,
body.qr-power-challenge .leaderboard td {
    padding: 0.6rem 0.75rem;
    text-align: left;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}

body.qr-power-challenge .leaderboard th {
    background: #111;
    color: #fff;
}

body.qr-power-challenge .leaderboard tr.qr-you {
    background: rgba(255, 246, 214, 0.2);
    font-weight: 600;
}

body.qr-power-challenge .qr-gp-note {
    font-size: 0.85rem;
    color: #ccc;
    margin-top: 0.75rem;
}

body.qr-power-challenge .challenge-box-container label,
body.qr-power-challenge .challenge-box label {
    color: #f5f5f5;
}

body.qr-power-challenge .challenge-box-container input[type="text"],
body.qr-power-challenge .challenge-box-container input[type="email"],
body.qr-power-challenge .challenge-box-container input[type="password"],
body.qr-power-challenge .challenge-box-container input[type="number"],
body.qr-power-challenge .challenge-box-container textarea,
body.qr-power-challenge .challenge-box-container select {
    width: 100%;
    box-sizing: border-box;
    padding: 0.65rem 0.8rem;
    margin-bottom: 0.75rem;
    color: #111;
    background: linear-gradient(#f4f4f4, #e4e4e4);
    border: 1px solid #1a1a1a;
    border-radius: 8px;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.25);
}

body.qr-power-challenge .challenge-box-container .gform_button,
body.qr-power-challenge .challenge-box-container .challenge-btn,
body.qr-power-challenge .challenge-box-container input[type="submit"] {
    color: #fff;
    background: linear-gradient(#4a4a4a, #2b2b2b);
    border: 1px solid #111;
    border-radius: 8px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
}

body.qr-power-challenge .qr-sponsor-box {
    margin-top: 2rem;
    padding: 1.25rem;
    background: #fff;
    border: 2px dashed #c3c4c7;
    border-radius: 8px;
    text-align: center;
}

body.qr-power-challenge .qr-sponsor-box.qr-sponsor-visited {
    border-color: #00a32a;
    background: #f0faf0;
}

body.qr-power-challenge .qr-banner {
    display: block;
    margin: 0 auto 1rem;
    object-fit: contain;
}

body.qr-power-challenge .qr-banner-square {
    width: 200px;
    height: 200px;
}

body.qr-power-challenge .qr-banner-wide {
    width: 100%;
    max-width: 768px;
    height: 200px;
}

body.qr-power-challenge .qr-sponsor-btn {
    display: inline-block;
    padding: 0.75rem 1.5rem;
    background: #2271b1;
    color: #fff !important;
    text-decoration: none;
    border-radius: 4px;
    font-weight: 600;
}

body.qr-power-challenge .qr-sponsor-btn:hover {
    background: #135e96;
    color: #fff !important;
}

body.qr-power-challenge .qr-sponsor-note {
    margin: 0.75rem 0 0;
    font-size: 0.85rem;
    color: #666;
}

body.qr-power-challenge .qr-bonus-form {
    margin-top: 1.25rem;
}

body.qr-power-challenge .qr-placeholder-form input[type="text"] {
    width: 100%;
    padding: 0.6rem;
    margin-bottom: 0.75rem;
    border: 1px solid #c3c4c7;
    border-radius: 4px;
    box-sizing: border-box;
}

body.qr-power-challenge .green {
    color: #00a32a;
    font-size: 0.9rem;
    margin-top: 0.5rem;
}

body.qr-power-challenge .qr-login-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.78);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99999;
    padding: 20px;
}

body.qr-power-challenge .qr-login-modal {
    background: #fff;
    border-radius: 12px;
    padding: 2.25rem 2rem;
    max-width: 400px;
    width: 100%;
    position: relative;
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.35);
    max-height: 90vh;
    overflow-y: auto;
}

body.qr-power-challenge .qr-auth-panel[hidden] {
    display: none;
}

body.qr-power-challenge .qr-login-modal h2 {
    margin: 0 0 0.5rem;
    font-size: 1.5rem;
    text-align: center;
}

body.qr-power-challenge .qr-login-modal > p {
    margin: 0 0 1.25rem;
    text-align: center;
    color: #50575e;
}

body.qr-power-challenge .qr-login-error {
    color: #d63638 !important;
    font-weight: 600;
}

body.qr-power-challenge .qr-login-field {
    margin-bottom: 1rem;
}

body.qr-power-challenge .qr-login-field label {
    display: block;
    margin-bottom: 0.35rem;
    font-weight: 600;
    font-size: 0.9rem;
}

body.qr-power-challenge .qr-login-field .input {
    width: 100%;
    padding: 0.65rem 0.75rem;
    font-size: 1rem;
    border: 1px solid #c3c4c7;
    border-radius: 4px;
    box-sizing: border-box;
}

body.qr-power-challenge .qr-login-remember {
    margin: 0.75rem 0 1.25rem;
    font-size: 0.9rem;
}

body.qr-power-challenge .qr-login-submit {
    margin: 0 0 1.25rem;
    text-align: center;
}

body.qr-power-challenge .qr-login-submit .challenge-btn {
    width: 100%;
}

body.qr-power-challenge .qr-register-link {
    margin: 0;
    text-align: center;
    font-size: 0.95rem;
}

body.qr-power-challenge .qr-register-link a {
    color: #2271b1;
    font-weight: 600;
    text-decoration: none;
}

body.qr-power-challenge .qr-login-close {
    position: absolute;
    top: 10px;
    right: 14px;
    background: none;
    border: none;
    font-size: 1.75rem;
    cursor: pointer;
    color: #666;
}

body.qr-power-challenge .qr-is-hidden,
body.qr-power-challenge .qr-bonus-lock:not(.qr-is-open) {
    display: none !important;
}

@media screen and (min-width: 960px) {
    body.qr-power-challenge .challenge-container,
    body.qr-power-challenge .stats-container {
        /* Creates two columns of equal width */
        grid-template-columns: repeat(2, 1fr);
        /* Creates two rows of equal height (e.g., 150px each) */
        grid-template-rows: repeat(3, auto);
    }

    body.qr-power-challenge .qr-challenge-wrapper {
        padding: 45px 20px 20px 20px;
    }

    body.qr-power-challenge .content {
        padding: 0 20px;
    }
}
