/*
Theme Name: Fairy Dark Rebel Theme
Theme URI: https://rebelscience.club/
Author: Antigravity & Rebelcoder
Author URI: https://rebelscience.club/
Description: Custom theme for rebelscience.club with charcoal gray colors, modern aesthetics, rounder corners, and glassmorphism sticky header.
Version: 1.0.0
Template: fairy
Text Domain: fairy-dark-rebel-theme
*/

/* Enqueue Inter Font */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');

/* Typography Global Override */
body, button, input, select, optgroup, textarea, 
.site-footer *, .site-footer a, .site-footer p,
h1, h2, h3, h4, h5, h6, .site-title, .site-title a, 
.widget-title, .btn, .btn-primary, .main-navigation a {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
}

/* Global Background - Unified Flat Dark Gray */
body, #page, #content, .site-content, .site, #main, .main, .wrapper {
    background: #1a1a1a !important;
    background-color: #1a1a1a !important;
    background-image: none !important;
    box-shadow: none !important;
    color: #e3e4e6 !important;
}

body, button, input, select, optgroup, textarea, 
.site-footer *, .site-footer a, .site-footer p {
    color: #babcbf;
}

a:focus,
input[type="text"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="number"]:focus, input[type="tel"]:focus, input[type="range"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="time"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="color"]:focus, textarea:focus {
	color: #ffffff;
	outline-color: #D8C4A4;
}

p a, .entry-content a,
.site-title, .site-title a, h1.site-title a, p.site-title a, .site-title a:visited,
.card_title a {
	color: #D8C4A4;
}

.btn-primary,
body .btn-primary, .btn.btn-primary,
.card-blog-post .card_body p,
.search-form .search-field,
.wp-block-search .wp-block-search__input {
	color: #ffffff;
}

.main-navigation a,
.widget-area .widget a,
.post-navigation .nav-links a {
	color: #babcbf;
}

.search-form .search-field:focus,
.wp-block-search .wp-block-search__input:focus {
	color: #ffffff;
}

/* Card & Widget Overrides - Single Frame, Flat Charcoal with Depth */
.card-blog-post, 
.widget, 
#secondary .widget, 
.widget-area .widget,
.site-footer-top {
	background-color: #1a1a1a !important;
    background-image: none !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important; /* One clean frame */
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.3) !important; /* Modern depth shadow */
    border-radius: 8px !important;
}

/* Remove double frames from wrapper elements */
article.post,
article.page,
.card,
.card_body, 
.entry-content, 
.card-promo {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
}

.site-header.site-header-left-logo .site-header-top, 
.site-header.site-header-v2 .site-header-topbar,
.site-footer-bottom {
	background-color: #1a1a1a !important; /* Unified gray for header */
}

.btn-primary,
.search-form .search-submit,
input[type="submit"],
.wp-block-search .wp-block-search__button,
.pagination .page-numbers {
	background-color: var(--fairy-primary-color, #1e73be) !important;
	color: #000000 !important;
}

.btn-primary:hover,
.search-form .search-submit:hover,
input[type="submit"]:hover,
.wp-block-search .wp-block-search__button:hover,
.pagination .page-numbers:hover,
.pagination .page-numbers.current {
	background-color: #ffffff !important;
	color: #000000 !important;
}

#secondary .widget .widget-title::after,
.widget-area .widget .widget-title::after,
.widget .widget-title::after {
	background-color: #6b46c1 !important; /* Align accent bar to purple */
}

textarea, input, select, optgroup, 
.comment-list .comment .comment-body {
	background-color: #1a1a1a !important;
	color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.06);
}

/* Borders - Translucent instead of harsh white lines */
.wp-block-search .wp-block-search__button,
.search-form .search-field,
.wp-block-search .wp-block-search__input {
	border-color: rgba(255, 255, 255, 0.06) !important;
}

/* Remove header top/bottom separator lines */
.site-header-bottom, .site-header-top {
	border-bottom: none !important;
}

/* Hover Accent */
a:hover {
	color: #805ad5;
}

.card_title a:hover,
.main-navigation #primary-menu > li > a:hover,
.site-header.site-header-left-logo .site-header-top .site-header-top-menu li a:hover, .site-header.site-header-left-logo .site-header-top .site-header-top-menu li a:focus, .site-header.site-header-v2 .site-header-topbar .site-header-top-menu li a:hover, .site-header.site-header-v2 .site-header-topbar .site-header-top-menu li a:focus, .top-header-toggle-btn,
.site-footer a:hover {
	color: #805ad5;
}

.single .card-blog-post .card_body{
    width: 100%;
    flex-basis: 100%;
}

/* Unified Widget Color Accents */
.widget a, 
#secondary a, 
.widget-area a {
    color: #babcbf !important;
}
.widget a:hover, 
#secondary a:hover, 
.widget-area a:hover {
    color: #805ad5 !important;
}

/* Category Badges Styling */
.category-label-group a, 
.category-label-group.bg-label a {
    background-color: #2b2b2b !important;
    color: #ffffff !important;
    border-radius: 4px !important;
    font-size: 11px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    padding: 3px 8px !important;
}

.category-label-group a:hover, 
.category-label-group.bg-label a:hover {
    background-color: #6b46c1 !important;
    color: #ffffff !important;
}

/* Modern Rounded Corners */
.card-blog-post, 
.widget,
#secondary .widget,
.widget-area .widget,
.btn-primary, 
.btn-secondary-border,
textarea, input, select, 
.comment-list .comment .comment-body, 
.wp-block-search .wp-block-search__input,
.wp-block-search .wp-block-search__button,
.pagination .page-numbers,
img {
    border-radius: 12px !important;
}

/* Smooth Transitions */
a, button, input, select, textarea, .btn-primary, .card-blog-post {
    transition: all 0.25s ease-in-out !important;
}

/* Glassmorphism Sticky Header with blur effect */
.site-header {
    position: sticky !important;
    top: 0;
    z-index: 9999;
    background: rgba(26, 26, 26, 0.82) !important; /* Unified #1a1a1a with opacity */
    backdrop-filter: blur(12px) saturate(180%);
    -webkit-backdrop-filter: blur(12px) saturate(180%);
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.2);
}

/* Offset for admin bar */
body.admin-bar .site-header {
    top: 32px !important;
}

@media screen and (max-width: 782px) {
    body.admin-bar .site-header {
        top: 46px !important;
    }
}

@media screen and (max-width: 991px) {
	body.admin-bar #masthead #primary-menu.off_canva_nav {
		padding-top: 46px;
	}
}

/* Thin Header Design & Removal of Menu Background */
.site-header {
    padding: 0 !important;
}

.site-header-topbar {
    display: none !important; /* Hide top info bar for thin design */
}

/* Compress Main header branding area padding */
.site-header-top.header-main-bar {
    padding-top: 10px !important;
    padding-bottom: 5px !important;
}

/* Compress Navigation menu padding completely */
.site-header-bottom {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.site-branding {
    margin: 0 !important;
    padding: 0 !important;
}

/* Logo Sizing limit to keep thin header */
.custom-logo-link img.custom-logo {
    max-height: 45px !important;
    width: auto !important;
}

/* Hide Site Title and Tagline if Logo exists */
.custom-logo-link + .site-title,
.custom-logo-link + h1.site-title,
.custom-logo-link + p.site-title {
    display: none !important;
}

.site-description {
    margin-top: 4px !important;
    margin-bottom: 0px !important;
    font-size: 11px !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    color: #ffffff !important;
    display: block !important;
}

/* Make primary menu items thinner, remove hover background */
.main-navigation #primary-menu > li > a {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
}
.main-navigation #primary-menu > li > a:hover,
.main-navigation #primary-menu > li.focus > a,
.main-navigation #primary-menu > li.current-menu-item > a {
    background: transparent !important;
    color: #6b46c1 !important;
}

/* Hide the 'Menu' dropdown item from top bar */
li#menu-item-1236 {
    display: none !important;
}


/* Centering Content on Pages without Sidebar */
@media screen and (min-width: 992px) {
    body:not(:has(#secondary)) #primary.col-md-2-3 {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        margin: 0 auto;
    }
    
    /* Width Adjustments - Shifting Proportions with Fixed Offset */
    #primary.col-md-2-3, 
    #primary.col-lg-2-3 {
        flex: 0 0 calc(75% - 30px) !important;
        max-width: calc(75% - 30px) !important;
    }
    #secondary.col-md-1-3, 
    #secondary.col-lg-1-3 {
        flex: 0 0 calc(25% + 30px) !important;
        max-width: calc(25% + 30px) !important;
        padding-right: 0 !important;
    }
}

/* Styling for the new Socials Widget */
.socials-widget-grid {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.socials-widget-grid a {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    color: #babcbf !important;
    transition: color 0.2s;
}
.socials-widget-grid a i {
    font-size: 18px;
    width: 20px;
    text-align: center;
    color: #ffffff;
}
.socials-widget-grid a:hover {
    color: #805ad5 !important;
}
.socials-widget-grid a:hover i {
    color: #805ad5 !important;
}

/* Right-side widgets fill their column (which is now offset by -50px, maintaining their size) */
#secondary .widget {
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}