/*
Theme Name: EZCDKey Gaming
Theme URI: https://ezcdkey.com
Description: Gaming theme
Author: EZCDKey
Version: 5.0
Template: astra
*/

/* ===== BASE ===== */
* { box-sizing: border-box; margin: 0; padding: 0; }

html, body, #page, .site, 
.ast-separate-container, .ast-plain-container,
.archive, .category, .single, .page, .search, .error404 {
    background-color: #0d0d0d !important;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: #fff;
    font-size: 16px;
    line-height: 1.7;
}

a { color: #00ff88; text-decoration: none; transition: color .2s; }
a:hover { color: #00cc6a; }
h1, h2, h3, h4, h5, h6 { color: #fff !important; font-weight: 700; }
p { color: #999; }

/* ===== HEADER ===== */
.site-header, .ast-primary-header, header#masthead {
    background: #0a0a0a !important;
    border-bottom: 1px solid #1a1a1a !important;
}
.site-title a { color: #00ff88 !important; font-weight: 800 !important; }
.main-navigation a, .menu-item a { color: #fff !important; }
.main-navigation a:hover, .menu-item a:hover { color: #00ff88 !important; }

/* ===== FOOTER ===== */
.site-footer, footer, .ast-small-footer {
    background: #0a0a0a !important;
    border-top: 1px solid #1a1a1a !important;
}
.site-footer, .site-footer *, .ast-small-footer * { color: #555 !important; }
.site-footer a, .ast-small-footer a { color: #00ff88 !important; }

/* ===== WRAPPER ===== */
.ez-wrapper {
    max-width: 1300px;
    margin: 0 auto;
    padding: 40px 20px;
}

/* ===== HERO WITH LOGO ===== */
.ez-hero {
    background: linear-gradient(135deg, #111 0%, #1a1a1a 100%);
    border: 1px solid #252525;
    border-radius: 16px;
    padding: 50px 40px;
    text-align: center;
    margin-bottom: 30px;
}
.ez-logo {
    margin-bottom: 15px;
}
.ez-logo svg {
    width: 250px;
    height: auto;
}
.ez-tagline {
    font-size: 1.1rem;
    color: #777;
    margin: 0;
}

/* ===== CATEGORIES BAR ===== */
.ez-categories-bar {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    margin-bottom: 40px;
    padding: 20px;
    background: #151515;
    border: 1px solid #252525;
    border-radius: 12px;
}
.ez-cat-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background: #0d0d0d;
    border: 1px solid #252525;
    border-radius: 25px;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    transition: all .2s;
}
.ez-cat-link:hover {
    border-color: #00ff88;
    color: #00ff88;
    transform: translateY(-2px);
}
.ez-cat-link .count {
    font-size: 11px;
    background: rgba(0, 255, 136, 0.15);
    color: #00ff88;
    padding: 3px 8px;
    border-radius: 10px;
}

/* ===== SECTION TITLE ===== */
.ez-section-title {
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 30px;
    padding-left: 15px;
    border-left: 4px solid #00ff88;
}

/* ===== 3-COLUMN GRID ===== */
.ez-grid-3, .ez-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
    margin-bottom: 50px;
}

/* ===== CARD ===== */
.ez-card {
    background: #151515;
    border: 1px solid #252525;
    border-radius: 14px;
    overflow: hidden;
    transition: all .25s ease;
}
.ez-card:hover {
    border-color: #00ff88;
    transform: translateY(-5px);
    box-shadow: 0 20px 40px rgba(0, 255, 136, 0.1);
}
.ez-card-img {
    aspect-ratio: 16/10;
    background: #1a1a1a;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}
.ez-card-img a { display: block; width: 100%; height: 100%; }
.ez-card-img img { width: 100%; height: 100%; object-fit: cover; }
.ez-card-img .icon { font-size: 3rem; opacity: .5; }
.ez-card-body { padding: 25px; }
.ez-card-cat {
    display: inline-block;
    font-size: 11px;
    font-weight: 600;
    color: #00ff88;
    background: rgba(0, 255, 136, 0.1);
    padding: 5px 12px;
    border-radius: 5px;
    margin-bottom: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.ez-card-title {
    font-size: 1.15rem;
    font-weight: 600;
    margin-bottom: 10px;
    line-height: 1.4;
}
.ez-card-title a { color: #fff; }
.ez-card-title a:hover { color: #00ff88; }
.ez-card-excerpt {
    font-size: 14px;
    color: #777;
    line-height: 1.6;
    margin-bottom: 12px;
}
.ez-card-meta { font-size: 13px; color: #555; }

/* ===== BROWSE BY CATEGORY ===== */
.ez-browse-section {
    margin-top: 20px;
    padding-top: 30px;
    border-top: 1px solid #1a1a1a;
}
.ez-category-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 20px;
}
.ez-category-card {
    background: #151515;
    border: 1px solid #252525;
    border-radius: 12px;
    padding: 25px;
    text-align: center;
    transition: all .25s ease;
}
.ez-category-card:hover {
    border-color: #00ff88;
    transform: translateY(-3px);
}
.ez-category-card .cat-icon {
    font-size: 2rem;
    display: block;
    margin-bottom: 12px;
}
.ez-category-card h4 {
    font-size: 1rem;
    margin-bottom: 8px;
    color: #fff !important;
}
.ez-category-card .cat-count {
    font-size: 13px;
    color: #00ff88;
}

/* ===== ARCHIVE HEADER ===== */
.ez-archive-header {
    text-align: center;
    margin-bottom: 40px;
}
.ez-archive-header h1 {
    font-size: 2.5rem;
    color: #00ff88 !important;
    margin-bottom: 10px;
}
.ez-archive-header p { color: #777; font-size: 1.1rem; }

/* ===== PAGINATION ===== */
.ez-pagination { text-align: center; margin-top: 30px; }
.ez-pagination .nav-links { display: inline-flex; gap: 10px; }
.ez-pagination a, .ez-pagination span {
    background: #151515;
    border: 1px solid #252525;
    color: #fff;
    padding: 12px 18px;
    border-radius: 8px;
    font-size: 14px;
}
.ez-pagination a:hover { border-color: #00ff88; color: #00ff88; }
.ez-pagination .current { background: #00ff88; color: #000; border-color: #00ff88; }

/* ===== SINGLE POST ===== */
.single .site-content,
.single .ast-container,
.single #primary,
.single .content-area { 
    background: #0d0d0d !important;
    max-width: 100% !important;
    width: 100% !important;
}
.single article,
.single .ast-article-single,
.single .entry-content-wrap,
.ast-single-post article {
    max-width: 1300px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 40px 20px !important;
    background: transparent !important;
    border: none !important;
}
.single .entry-header,
.ast-single-post .entry-header { 
    text-align: center; 
    margin-bottom: 30px; 
    padding-bottom: 30px; 
    border-bottom: 1px solid #1a1a1a;
    max-width: 1300px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
.single .entry-title,
.ast-single-post .entry-title { 
    font-size: 2.5rem !important; 
    margin-bottom: 15px !important; 
}
.single .entry-meta, 
.single .entry-meta *,
.ast-single-post .entry-meta { 
    color: #666 !important; 
    font-size: 14px !important; 
}
.single .post-thumb,
.ast-single-post .post-thumb { 
    border-radius: 12px; 
    overflow: hidden; 
    margin-bottom: 30px;
    max-width: 1300px !important;
}
.single .entry-content,
.ast-single-post .entry-content { 
    font-size: 18px !important; 
    line-height: 1.8 !important; 
    color: #bbb !important;
    max-width: 1300px !important;
}
.single .entry-content h2, 
.single .entry-content h3 { 
    margin: 35px 0 15px; 
    font-size: 1.6rem; 
}
.single .entry-content p { 
    color: #bbb !important; 
    margin-bottom: 20px; 
}
.single .entry-content ul, 
.single .entry-content ol { 
    color: #bbb; 
    margin: 20px 0; 
    padding-left: 25px; 
}
.single .entry-content li { 
    margin-bottom: 10px; 
}
.single .entry-content a { 
    color: #00ff88; 
}

/* Post Navigation */
.post-navigation, 
.ast-single-post-navigation,
.single .post-navigation { 
    max-width: 1300px !important; 
    margin: 30px auto !important; 
    padding: 20px !important; 
    border-top: 1px solid #1a1a1a; 
}
.nav-previous a, .nav-next a { color: #888 !important; }
.nav-previous a:hover, .nav-next a:hover { color: #00ff88 !important; }

/* Tags */
.tags-links a {
    display: inline-block;
    background: rgba(0, 255, 136, 0.1);
    color: #00ff88 !important;
    padding: 5px 12px;
    border-radius: 5px;
    margin: 0 5px 5px 0;
    font-size: 13px;
}

/* Comments */
.comments-area,
.single .comments-area,
#comments { 
    max-width: 1300px !important; 
    margin: 0 auto !important; 
    padding: 30px 20px !important; 
}
.comments-title { color: #fff !important; font-size: 1.3rem !important; margin-bottom: 20px; }
.comment-list { list-style: none !important; padding: 0 !important; }
.comment-list li {
    background: #151515 !important;
    border: 1px solid #252525 !important;
    border-radius: 10px !important;
    padding: 20px !important;
    margin-bottom: 15px !important;
}
.comment-author { color: #fff !important; }
.comment-meta { color: #555 !important; font-size: 12px !important; }
.comment-content, .comment-content p { color: #999 !important; }
.comment-respond {
    background: #151515 !important;
    border: 1px solid #252525 !important;
    border-radius: 12px !important;
    padding: 25px !important;
}
.comment-respond label { color: #888 !important; }
.comment-respond input, .comment-respond textarea {
    width: 100%;
    background: #0d0d0d !important;
    border: 1px solid #252525 !important;
    color: #fff !important;
    border-radius: 6px !important;
    padding: 12px !important;
    margin-top: 5px;
}
.comment-respond input:focus, .comment-respond textarea:focus {
    border-color: #00ff88 !important;
    outline: none;
}
.comment-respond .submit, .form-submit input {
    background: #00ff88 !important;
    color: #000 !important;
    border: none !important;
    padding: 12px 25px !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
    cursor: pointer;
}

/* ===== PAGES ===== */
.page .site-content,
.page .ast-container,
.page #primary { 
    background: #0d0d0d !important;
    max-width: 100% !important;
}
.page article,
.page .ast-article-page {
    max-width: 1300px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 40px 20px !important;
    background: transparent !important;
    border: none !important;
}
.page .entry-header { text-align: center; margin-bottom: 30px; padding-bottom: 30px; border-bottom: 1px solid #1a1a1a; }
.page .entry-title { font-size: 2.2rem !important; }
.page .entry-content { font-size: 17px; line-height: 1.8; }
.page .entry-content h2, .page .entry-content h3 { margin: 35px 0 15px; font-size: 1.5rem; }
.page .entry-content p { color: #bbb !important; margin-bottom: 20px; }
.page .entry-content ul, .page .entry-content ol { color: #bbb; margin: 20px 0; padding-left: 25px; }
.page .entry-content li { margin-bottom: 10px; }
.page .entry-content a { color: #00ff88; }

/* ===== SEARCH ===== */
.search .site-content { max-width: 1300px; margin: 0 auto; padding: 40px 20px; text-align: center; }
.search .page-title { font-size: 2rem; color: #00ff88 !important; }
.search-form { display: flex; gap: 10px; max-width: 500px; margin: 20px auto; }
.search-field {
    flex: 1;
    background: #151515 !important;
    border: 1px solid #252525 !important;
    color: #fff !important;
    padding: 12px 15px !important;
    border-radius: 8px !important;
}
.search-submit {
    background: #00ff88 !important;
    color: #000 !important;
    border: none !important;
    padding: 12px 25px !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    cursor: pointer;
}

/* ===== 404 ===== */
.error404 .site-content { max-width: 1300px; margin: 0 auto; padding: 60px 20px; text-align: center; }
.error404 .page-title { font-size: 5rem; color: #00ff88 !important; }
.error404 p { color: #777; font-size: 1.2rem; }

/* ===== HIDE ASTRA SIDEBAR ===== */
#secondary, .widget-area, .sidebar-main { display: none !important; }

/* ===== RESPONSIVE ===== */
@media (max-width: 1100px) {
    .ez-grid-3, .ez-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 700px) {
    .ez-grid-3, .ez-grid { grid-template-columns: 1fr; }
    .ez-hero { padding: 30px 20px; }
    .ez-logo svg { width: 180px; }
    .ez-tagline { font-size: 1rem; }
    .ez-section-title { font-size: 1.2rem; }
    .ez-categories-bar { gap: 8px; padding: 15px; }
    .ez-cat-link { padding: 8px 15px; font-size: 13px; }
    .ez-category-grid { grid-template-columns: repeat(2, 1fr); gap: 15px; }
    .ez-category-card { padding: 20px; }
    .single .entry-title, .page .entry-title { font-size: 1.6rem !important; }
    .ez-archive-header h1 { font-size: 1.8rem; }
    .ez-card-body { padding: 20px; }
    .ez-wrapper { padding: 20px 15px; }
}

@media (max-width: 480px) {
    .ez-logo svg { width: 150px; }
    .ez-card-title { font-size: 1rem; }
    .ez-category-grid { grid-template-columns: 1fr; }
    .single .entry-title, .page .entry-title { font-size: 1.4rem !important; }
}

/* ===== SCROLLBAR ===== */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #0d0d0d; }
::-webkit-scrollbar-thumb { background: #00ff88; border-radius: 4px; }
::selection { background: #00ff88; color: #000; }

/* Category Description Styles */
.ez-category-description {
    font-size: 1.1rem;
    line-height: 1.7;
    color: #b0b0b0;
    margin: 1rem 0 1.5rem;
    max-width: 800px;
}

.ez-post-count {
    font-size: 0.9rem;
    color: #00ff88;
    margin-bottom: 2rem;
    font-weight: 500;
}