/* ═══════════════════════════════════════════════
   JOO CASINO AUSTRALIA — PREMIUM DESIGN UPGRADE
   2026 - Purple/Gold Brand Identity
   ═══════════════════════════════════════════════ */

/* Premium Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Inter:wght@400;500;600;700;800;900&display=swap');

/* Apply premium typography */
h1, h2, h3, .offer-title, .hero-h1, .hero-h2, .hero-heading, .dl-hero-h1 {
    font-family: 'DM Serif Display', Georgia, serif !important;
    font-weight: 400 !important;
}

body, p, a, li, td, th, span, div {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

/* H1 styling - make it dramatic */
h1 {
    font-size: clamp(28px, 5vw, 52px) !important;
    line-height: 1.1 !important;
    color: var(--rc-text) !important;
    margin-bottom: 24px !important;
    letter-spacing: -0.02em !important;
}

/* H2 — casino gold shimmer */
h2 {
    font-size: clamp(20px, 3vw, 32px) !important;
    color: var(--rc-text) !important;
    line-height: 1.25 !important;
    margin: 32px 0 16px !important;
    position: relative;
    padding-bottom: 10px;
}

h2::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 40px;
    height: 2px;
    background: linear-gradient(90deg, var(--rc-accent), transparent);
    border-radius: 2px;
}

/* Hero offer-title (index) */
.offer-title {
    font-family: 'DM Serif Display', Georgia, serif !important;
    font-size: clamp(28px, 5vw, 52px) !important;
    line-height: 1.1 !important;
    color: var(--rc-text) !important;
    letter-spacing: -0.02em !important;
    background: linear-gradient(135deg, #faf5ff 30%, #d4af37 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Slot section title */
.section-title {
    font-family: 'DM Serif Display', Georgia, serif !important;
    font-size: clamp(24px, 3.5vw, 40px) !important;
    color: var(--rc-text) !important;
    text-align: center;
    margin-bottom: 30px !important;
}

/* Enhanced buttons */
.btn-danger, .btn-primary, .offer-btn {
    font-family: 'Inter', sans-serif !important;
    font-weight: 800 !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    border-radius: 10px !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
    background: linear-gradient(90deg, var(--rc-accent), var(--rc-accent-hover)) !important;
    color: #140818 !important;
    box-shadow: 0 4px 16px rgba(212, 175, 55, 0.3) !important;
    border: none !important;
}

.btn-danger:hover, .btn-primary:hover, .offer-btn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 28px rgba(212, 175, 55, 0.5) !important;
}

/* Header improvements */
.header {
    border-bottom: 1px solid rgba(212, 175, 55, 0.15) !important;
    padding: 12px 0 !important;
}

/* Keep header background as-is (light cream) but add subtle purple edge */
.header::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(212, 175, 55, 0.4), rgba(164, 0, 255, 0.2), transparent);
}

/* Logo max height in header */
.custom-logo {
    max-height: 52px !important;
    width: auto !important;
}

/* Nav links improvements */
.header .nav a {
    font-weight: 600 !important;
    font-size: 14px !important;
    padding: 6px 0 !important;
    position: relative;
    transition: color 0.2s !important;
}

.header .nav a::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 2px;
    background: var(--rc-accent);
    transition: width 0.2s;
}

.header .nav a:hover::after { width: 100%; }

/* Screen/hero section - index */
.screen.page-section {
    background: linear-gradient(135deg, #140818 0%, #1e1028 50%, #2d1840 100%) !important;
    padding: 60px 0 !important;
    position: relative;
    overflow: hidden;
}

.screen.page-section::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 70% 80% at 70% 50%, rgba(212, 175, 55, 0.1) 0%, transparent 65%);
    pointer-events: none;
}

/* Offer subtitle on index */
.offer-desc {
    color: var(--rc-text-muted, #e9d5ff) !important;
    font-size: 17px !important;
    line-height: 1.65 !important;
}

/* Slot cards */
.slot-element .item__img {
    border-radius: 12px !important;
    overflow: hidden;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.slot-element:hover .item__img {
    transform: translateY(-4px) scale(1.02);
    box-shadow: 0 12px 30px rgba(212, 175, 55, 0.25);
}

/* Page content area */
.page-content.page-section {
    background: var(--rc-bg) !important;
}

/* Lead paragraph */
p.lead {
    font-size: 18px !important;
    color: #e9d5ff !important;
    border-left: 3px solid var(--rc-accent);
    padding-left: 18px !important;
    margin-bottom: 28px !important;
}

/* Jackpot ticker / live zone */
.jackpot, .jackpot-ticker, .live-zone {
    background: linear-gradient(90deg, #1e1028, #2d1840, #1e1028) !important;
    border-top: 1px solid rgba(212, 175, 55, 0.2) !important;
    border-bottom: 1px solid rgba(212, 175, 55, 0.2) !important;
}

/* Author section */
.author {
    background: var(--rc-surface) !important;
    border: 1px solid rgba(212, 175, 55, 0.15) !important;
    border-radius: 16px !important;
    padding: 24px !important;
}

/* Footer */
.footer {
    border-top: 1px solid rgba(212, 175, 55, 0.12) !important;
}

.footer-menu a {
    color: #c4b5d4 !important;
    font-size: 13px !important;
    transition: color 0.2s !important;
}

.footer-menu a:hover {
    color: var(--rc-accent) !important;
}

/* Article editorial */
article p {
    line-height: 1.75 !important;
    margin-bottom: 18px !important;
    color: var(--rc-text-muted, #e9d5ff) !important;
}

article h2 { margin-top: 36px !important; }
article h3 { color: var(--rc-accent) !important; margin-top: 24px !important; }

/* FAQ */
.faq-item, [itemtype*="Question"] {
    border: 1px solid rgba(212, 175, 55, 0.15) !important;
    border-radius: 10px !important;
    padding: 16px 20px !important;
    margin-bottom: 12px !important;
    background: var(--rc-surface) !important;
    transition: border-color 0.2s !important;
}

[itemtype*="Question"]:hover {
    border-color: rgba(212, 175, 55, 0.4) !important;
}

[itemtype*="Question"] h3 {
    color: var(--rc-text) !important;
    font-size: 16px !important;
    margin: 0 0 10px !important;
}

/* Responsive hero improvements */
@media (max-width: 768px) {
    .offer-title { font-size: 30px !important; }
    .screen.page-section { padding: 40px 0 !important; }
    .joo-hero { padding: 40px 0 30px !important; }
}

/* Smooth scroll */
html { scroll-behavior: smooth; }

/* Selection color */
::selection {
    background: rgba(212, 175, 55, 0.35);
    color: #faf5ff;
}


/*!
Theme Name: EveryOne
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: EveryOne
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

EveryOne is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

/* JooCasino — purple, magenta & gold (banner palette) */
:root {
    --rc-bg: #140818;
    --rc-surface: #1e1028;
    --rc-surface-2: #2d1840;
    --rc-text: #faf5ff;
    --rc-text-muted: #e9d5ff;
    --rc-link: #f472b6;
    --rc-accent: #d4af37;
    --rc-accent-hover: #fbbf24;
    --rc-focus: rgba(212, 175, 55, 0.55);
}

body {
    background-color: var(--rc-bg) !important;
    color: var(--rc-text) !important;
    padding-top: 100px !important; /* offset for fixed header so headings don't sit under it */
}

/* Extra top spacing so first heading is clearly below the header on all pages */
.page-content.page-section,
#page-text.page-section {
    padding-top: 1.5rem !important;
}

.header,
.header .menu-item-has-children .sub-menu {
    background: linear-gradient(180deg, #fefce8 0%, #faf5ff 45%, #f5f3ff 100%) !important;
}

.header {
    box-shadow: 0 2px 16px rgba(88, 28, 135, 0.22) !important;
}

.header .nav a,
.header .mobile-nav a {
    color: #3b0764 !important;
}

.header .nav a:hover,
.header .mobile-nav a:hover {
    color: var(--rc-accent) !important;
}

.footer {
    background-color: var(--rc-bg) !important;
}

.main-text-content a,
.page-text a {
    color: var(--rc-link) !important;
}

.main-text-content a:hover,
.page-text a:hover {
    color: var(--rc-accent-hover) !important;
}

/* Tables: unified dark theme (all pages) */
.main-text-content table,
.page-text table,
.responsible-gambling table {
    width: 100%;
    border-collapse: collapse;
    margin: 24px 0;
    font-size: 14px;
    line-height: 1.5;
    background-color: var(--rc-surface) !important;
    border: 1px solid var(--rc-surface-2);
}

.main-text-content table th,
.main-text-content table td,
.page-text table th,
.page-text table td,
.responsible-gambling table th,
.responsible-gambling table td {
    border: 1px solid var(--rc-surface-2);
    padding: 12px 14px;
    text-align: left;
    vertical-align: top;
    color: #ffffff !important;
}

.main-text-content table thead th,
.page-text table thead th,
.responsible-gambling table thead th {
    background-color: var(--rc-surface-2) !important;
    font-weight: 600;
    color: #ffffff !important;
}

.main-text-content table tbody tr:nth-child(even),
.page-text table tbody tr:nth-child(even),
.responsible-gambling table tbody tr:nth-child(even) {
    background-color: rgba(37, 37, 37, 0.8) !important;
}

.main-text-content table tbody tr:nth-child(even) td,
.page-text table tbody tr:nth-child(even) td,
.responsible-gambling table tbody tr:nth-child(even) td {
    color: #ffffff !important;
}

.main-text-content table tbody tr:hover,
.page-text table tbody tr:hover,
.responsible-gambling table tbody tr:hover {
    background-color: var(--rc-surface-2) !important;
}

.main-text-content table a,
.page-text table a,
.responsible-gambling table a {
    color: var(--rc-link) !important;
    text-decoration: underline;
}

.main-text-content table a:hover,
.page-text table a:hover,
.responsible-gambling table a:hover {
    color: var(--rc-accent-hover) !important;
    text-decoration: none;
}

@media (max-width: 768px) {
    .main-text-content table,
    .main-text-content thead,
    .main-text-content tbody,
    .main-text-content th,
    .main-text-content td,
    .main-text-content tr,
    .page-text table,
    .page-text thead,
    .page-text tbody,
    .page-text th,
    .page-text td,
    .page-text tr,
    .responsible-gambling table,
    .responsible-gambling thead,
    .responsible-gambling tbody,
    .responsible-gambling th,
    .responsible-gambling td,
    .responsible-gambling tr {
        display: block;
    }

    .main-text-content thead,
    .page-text thead,
    .responsible-gambling thead {
        display: none;
    }

    .main-text-content tr,
    .page-text tr,
    .responsible-gambling tr {
        margin-bottom: 16px;
        border: 1px solid var(--rc-surface-2);
        padding: 10px;
        background-color: var(--rc-surface) !important;
    }

    .main-text-content td,
    .page-text td,
    .responsible-gambling td {
        border: none;
        padding: 6px 0;
        color: #ffffff !important;
    }

    .main-text-content td::before,
    .page-text td::before,
    .responsible-gambling td::before {
        content: attr(data-label);
        font-weight: 600;
        display: block;
        margin-bottom: 4px;
        color: var(--rc-link);
    }
}

body.banner-background .screen-content {
    background: transparent !important;
}

.offer-title,
.offer-desc {
    color: var(--rc-text) !important;
}

.btn,
.btn.btn-primary,
.btn.btn-danger,
.btn.offer-btn,
.header .btn-danger {
    background-color: var(--rc-accent) !important;
    color: #ffffff !important;
}

.btn:hover,
.btn.btn-primary:hover,
.btn.btn-danger:hover,
.btn.offer-btn:hover,
.header .btn-danger:hover {
    background-color: var(--rc-accent-hover) !important;
}

.btn:focus,
.btn:focus-visible,
.header .btn-danger:focus-visible,
.btn.btn-primary:focus-visible,
.btn.btn-danger:focus-visible,
.btn.offer-btn:focus-visible {
    outline: 2px solid var(--rc-focus) !important;
    outline-offset: 2px;
}

/* Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */


/* Fix: download page header — neutralise body padding-top on this page only */
body.page-id-download{padding-top:0 !important;}