/* 
    The Rajneetik Times - Premium Dynamic Design
    =============================================
    - Theme: Sleek Modern Dark Mode / Glassmorphism
    - Primary Color: #ff2a2a (Electric Red)
    - Secondary Color: #ffaa00 (Vibrant Gold)
    - Background: #0a0e17 (Deep Navy/Slate)
    - Card Background: rgba(255, 255, 255, 0.03) (Glass)
*/

@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;700;900&family=Playfair+Display:ital,wght@0,700;1,700&family=Mukta:wght@400;600;700;800&display=swap');

:root {
    --primary: #C8102E; /* Deep Editorial Crimson */
    --primary-glow: rgba(200, 16, 46, 0.4);
    --secondary: #D4AF37; /* Metallic Gold */
    --bg-base: #0F1218; /* Obsidian Slate */
    --bg-surface: #1A1D24; /* Elevated Slate */
    --bg-glass: rgba(26, 29, 36, 0.85); /* Rich Glassmorphism */
    --border-glass: rgba(212, 175, 55, 0.15); /* Subtle Gold Border */
    --text-main: #E8E9F0; /* Soft Pearl White */
    --text-muted: #8E94A4; /* Silver Gray */
    --font-heading: 'Mukta', 'Outfit', sans-serif;
    --font-body: 'Mukta', 'Outfit', sans-serif;
    --transition-smooth: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

body {
    font-family: var(--font-body);
    color: var(--text-main);
    background-color: var(--bg-base);
    line-height: 1.7;
    margin: 0;
    -webkit-font-smoothing: antialiased;
}

.bg-body, .bg-accent {
    background-color: var(--bg-base) !important;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--text-main);
}

h1.title-medium-dark, h2.title-medium-dark, h3.title-medium-dark, 
h1.title-medium-dark a, h2.title-medium-dark a, h3.title-medium-dark a,
.color-dark, .post-date-dark ul li a, .post-date-dark ul li,
.topic-box-lg {
    color: var(--text-main) !important;
}

a {
    transition: var(--transition-smooth);
}

a:hover {
    text-decoration: none;
    color: var(--primary) !important;
}

/* Glassmorphism Header */
.header-style1 .main-menu-area {
    background: var(--bg-glass) !important;
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    border-bottom: 1px solid var(--border-glass);
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
    padding: 10px 0;
    transition: var(--transition-smooth);
}

.ne-main-menu nav > ul > li > a {
    color: var(--text-main) !important;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-size: 16px;
    position: relative;
    padding: 12px 18px;
    border-radius: 6px;
    transition: var(--transition-smooth);
}

/* Header link underline animation */
.ne-main-menu nav > ul > li > a::after {
    content: '';
    position: absolute;
    width: 0;
    height: 3px;
    bottom: -8px;
    left: 50%;
    transform: translateX(-50%);
    background: linear-gradient(90deg, var(--primary), var(--secondary));
    transition: var(--transition-smooth);
    border-radius: 2px;
    box-shadow: 0 -2px 10px var(--primary-glow);
}

.ne-main-menu nav > ul > li:hover > a::after,
.ne-main-menu nav > ul > li.active > a::after {
    width: 80%;
}

.ne-main-menu nav > ul > li:hover > a,
.ne-main-menu nav > ul > li.active > a {
    color: var(--secondary) !important;
    background: rgba(255, 255, 255, 0.05);
    text-shadow: 0 0 10px rgba(212, 175, 55, 0.3);
}

/* Search and User Icons */
.header-action-item ul li {
    border-right: 1px solid rgba(255, 255, 255, 0.1) !important;
}
.header-action-item ul li:last-child {
    border-right: none !important;
}

.header-action-item ul li .search-button i,
.login-btn,
.login-btn i {
    color: var(--text-main) !important;
    font-family: var(--font-heading);
    font-weight: 700;
    transition: var(--transition-smooth);
}
.menu-bar span {
    background-color: var(--text-main) !important;
    transition: var(--transition-smooth);
}

.header-action-item ul li .search-button:hover i,
.login-btn:hover,
.login-btn:hover i {
    color: var(--secondary) !important;
    transform: scale(1.05);
    text-shadow: 0 0 10px rgba(212, 175, 55, 0.4);
}

.menu-bar:hover span {
    background-color: var(--secondary) !important;
    box-shadow: 0 0 8px rgba(212, 175, 55, 0.4);
}

/* Breaking News Ticker */
.bg-accent.border-bottom.add-top-margin {
    background: linear-gradient(90deg, var(--bg-base) 0%, var(--bg-surface) 100%) !important;
    border-bottom: 1px solid var(--border-glass) !important;
    margin-top: 15px;
    border-radius: 8px;
    box-shadow: inset 0 0 20px rgba(0,0,0,0.5);
}

.topic-box {
    background: linear-gradient(135deg, var(--primary), #8A0A1F) !important;
    color: #fff;
    font-weight: 700;
    text-transform: uppercase;
    border-radius: 4px;
    box-shadow: 0 4px 15px var(--primary-glow);
    letter-spacing: 1px;
}
.topic-box::before { display: none; } /* Remove old triangle */

.feeding-text-dark a {
    color: var(--text-main) !important;
    font-weight: 500;
}
.feeding-text-dark a:hover {
    color: var(--secondary) !important;
    text-shadow: 0 0 8px rgba(255, 170, 0, 0.4);
}

/* Logo Styling */
.logo-area {
    padding: 10px 0;
    display: flex;
    align-items: center;
}

/* Pure HTML/CSS Logo Recreation */
.pure-css-logo {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    transition: var(--transition-smooth);
}

.pure-css-logo:hover {
    transform: scale(1.05);
    filter: drop-shadow(0 0 15px rgba(212, 175, 55, 0.4));
}

.logo-main-box {
    background: linear-gradient(135deg, #7A0000 0%, #3A0000 100%);
    border: 2px solid #D4AF37;
    box-shadow: inset 0 0 10px rgba(0,0,0,0.8), 0 3px 6px rgba(0,0,0,0.5);
    padding: 2px 8px 4px 8px;
    border-radius: 2px;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    z-index: 2;
    min-width: 90px;
}

.logo-the {
    font-family: var(--font-heading);
    color: #F8E287;
    font-size: 9px;
    font-weight: 700;
    align-self: flex-start;
    line-height: 1;
    margin-bottom: 0px;
}

.logo-rajneetik {
    font-family: var(--font-heading);
    color: #F8E287;
    font-size: 17px;
    font-weight: 900;
    text-shadow: 1px 1px 3px rgba(0,0,0,0.9);
    line-height: 1.1;
    letter-spacing: 0.5px;
}

.logo-times {
    font-family: var(--font-heading);
    color: #F8E287;
    font-size: 14px;
    font-weight: 900;
    text-shadow: 1px 1px 3px rgba(0,0,0,0.9);
    line-height: 1;
}

.logo-news-badge {
    background: linear-gradient(180deg, #F8E287 0%, #D4AF37 40%, #8C6800 100%);
    color: #000;
    font-family: var(--font-heading);
    font-weight: 900;
    font-size: 9px;
    padding: 2px 14px;
    border-radius: 0 0 3px 3px;
    box-shadow: 0 3px 8px rgba(0,0,0,0.6);
    margin-top: -2px;
    z-index: 1;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

/* Image Cards & Hover Effects (Rich Aesthetics & Animations) */
.img-overlay-70, .media {
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    background: var(--bg-surface);
    border: 1px solid var(--border-glass);
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
    transition: var(--transition-smooth);
}

.img-overlay-70:hover, .media:hover {
    transform: translateY(-8px) scale(1.01);
    box-shadow: 0 20px 40px rgba(0,0,0,0.6), 0 0 20px var(--primary-glow);
    border-color: rgba(200, 16, 46, 0.3);
}

.img-overlay-70 img, .media img {
    transition: transform 0.7s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.img-overlay-70:hover img, .media:hover img {
    transform: scale(1.08);
}

/* Gradients over Images */
.img-overlay-70::before {
    background: linear-gradient(0deg, rgba(10, 14, 23, 1) 0%, rgba(10, 14, 23, 0.6) 50%, rgba(0, 0, 0, 0) 100%) !important;
    height: 100% !important;
    opacity: 1 !important;
    z-index: 1 !important;
}

.mask-content-lg, .mask-content-sm, .mask-content-xs {
    z-index: 2 !important;
    padding: 30px;
}

/* Typography Overrides */
.title-medium-light a, .title-medium-dark a {
    text-shadow: 0 2px 5px rgba(0,0,0,0.8);
    line-height: 1.4;
}

.title-medium-light a:hover, .title-medium-dark a:hover {
    color: var(--secondary) !important;
}

/* Topic / Category Badges */
.topic-box-sm, .topic-box-lg {
    border-radius: 20px;
    padding: 5px 15px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.3);
    text-transform: uppercase;
}

.topic-box-sm::before, .topic-box-lg::before { display: none; }
.color-cinnabar, .color-azure-radiance, .color-apple, .color-razzmatazz, .color-web-orange {
    background: linear-gradient(135deg, var(--primary), #5A0010) !important;
    border: none !important;
}
.color-cinnabar::after, .color-azure-radiance::after, .color-apple::after, .color-razzmatazz::after, .color-web-orange::after { display: none; }

/* Filter Tabs */
.isotop-btn a {
    color: var(--text-muted) !important;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 8px 16px;
    border-radius: 20px;
    transition: var(--transition-smooth);
}
.isotop-btn a:hover, .isotop-btn a.current {
    color: #fff !important;
    background: var(--primary);
    box-shadow: 0 4px 15px var(--primary-glow);
}

/* Sidebar and Widgets */
.sidebar-box {
    background: var(--bg-surface);
    border: 1px solid var(--border-glass);
    border-radius: 12px;
    padding: 25px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
}

ul.stay-connected li {
    border: none !important;
    background: transparent;
}
ul.stay-connected li i {
    font-size: 24px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
    transition: var(--transition-smooth);
}
ul.stay-connected li:hover i {
    transform: translateY(-5px) rotate(10deg);
}
ul.stay-connected li .connection-quantity {
    color: var(--text-main);
}
ul.stay-connected li p {
    color: var(--text-muted);
}

/* Footer overides */
footer {
    background: #05080f !important;
    border-top: 1px solid var(--border-glass);
}
.footer-logo { display: none !important; }

/* Section Spacing & Structure */
.section-space-default { padding: 80px 0; }
.section-space-less2 { padding: 80px 0 60px; }

/* Hide Placeholder Banner Ads */
.ne-banner-layout1, 
.ne-banner-layout2, 
.sidebar-box .ne-banner-layout1,
.sidebar-box .ne-banner-layout2 {
    display: none !important;
}

/* Media Block Adjustments */
.media {
    padding: 15px;
    background: var(--bg-surface);
    border-radius: 12px;
    align-items: center;
}
.media img {
    border-radius: 8px;
}
.media-body {
    padding-left: 15px;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 10px;
}
::-webkit-scrollbar-track {
    background: var(--bg-base);
}
::-webkit-scrollbar-thumb {
    background: var(--border-glass);
    border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover {
    background: var(--primary);
}

/* Comprehensive Dark Mode Overrides */
.item-box-light-lg, .item-box-light-md, .item-box-light-md-less20,
.item-box-light-md-less30, .item-box-light-md-less10, .item-box-light-mix,
.games-review-box, .login-form {
    background: var(--bg-surface) !important;
    border: 1px solid var(--border-glass) !important;
    color: var(--text-main) !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2) !important;
}

.item-box-light-lg p, .item-box-light-md p,
.login-form label, .login-form input, select {
    color: var(--text-main) !important;
}

.login-form input, select {
    background-color: rgba(0,0,0,0.2) !important;
    border: 1px solid var(--border-glass) !important;
    border-radius: 4px;
}

.post-date-light ul li, .post-date-dark ul li, .more-info-link a, .more-info-link-light a {
    color: var(--text-muted) !important;
}
.post-date-light ul li i, .post-date-dark ul li i {
    color: var(--primary) !important;
}

.more-info-link a:hover, .more-info-link-light a:hover {
    color: var(--secondary) !important;
}

.topic-border { 
    border-bottom: 2px solid var(--border-glass); 
}
.topic-border::after { 
    background-color: var(--primary) !important; 
}

/* Buttons */
.login-form button, .btn-ftg-ptp-56, .btn-ftg-ptp-45, .btn-ftg-ptp-40 {
    background: linear-gradient(135deg, var(--primary), #8A0A1F) !important;
    border: none !important;
    color: #fff !important;
    box-shadow: 0 4px 15px var(--primary-glow) !important;
    border-radius: 4px !important;
    transition: var(--transition-smooth);
}

.login-form button:hover, .btn-ftg-ptp-56:hover, .btn-ftg-ptp-45:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(200, 16, 46, 0.6) !important;
}

.pagination-btn-wrapper ul li a {
    background-color: var(--bg-surface);
    border: 1px solid var(--border-glass);
    color: var(--text-main);
    border-radius: 4px;
}

.pagination-btn-wrapper ul li a:hover, .pagination-btn-wrapper ul .active a {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
    box-shadow: 0 4px 15px var(--primary-glow);
}
