/* ================================================================
   NEXERP BLOG — FUTURISTIC DEEP SPACE THEME
   Overrides Odoo website_blog default styles to match the
   corporate website dark neon aesthetic.
   ================================================================ */

/* ================================================================
   BLOG PAGE — FULL PAGE BACKGROUND & LAYOUT
   We keep website.layout intact (required for the editor).
   We hide its default header/footer and inject our own via
   the blog_templates.xml override.
   ================================================================ */

/* Apply our gradient to the full page wrapper that website.layout uses */
body.website_blog_page,
.js_blog #wrapwrap,
#wrapwrap:has(#wrap.website_blog) {
    background:
        radial-gradient(ellipse at 30% 40%, rgba(0, 102, 255, 0.35) 0%, transparent 60%),
        radial-gradient(ellipse at 70% 70%, rgba(123, 47, 255, 0.30) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 10%, rgba(0, 245, 255, 0.20) 0%, transparent 50%),
        linear-gradient(180deg, #020408 0%, #050c14 50%, #080f1a 100%) !important;
    color: var(--text-bright);
}

/* Mesh grid on wrapwrap for blog */
#wrapwrap:has(#wrap.website_blog)::before {
    content: '';
    position: fixed;
    inset: 0;
    background-image:
        linear-gradient(rgba(0, 245, 255, 0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 245, 255, 0.03) 1px, transparent 1px);
    background-size: 50px 50px;
    pointer-events: none;
    z-index: 0;
}

/* ----------------------------------------------------------------
   ODOO DEFAULT HEADER / FOOTER — hidden on blog, we use our own
   ---------------------------------------------------------------- */
#wrapwrap:has(#wrap.website_blog) > header#top {
    display: none !important;
}

#wrapwrap:has(#wrap.website_blog) > footer.o_footer {
    display: none !important;
}

/* Odoo JS adds padding-top to #wrapwrap equal to the header height.
   Since we hide #top, we must zero that out. */
#wrapwrap:has(#wrap.website_blog) {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* ----------------------------------------------------------------
   OUR INJECTED HEADER — full width, fixed, exactly like main site
   The nx_header is injected as the first child of #wrapwrap via
   the blog_templates.xml xpath, so standard .nx_header CSS applies.
   We just need to ensure nothing overrides it.
   ---------------------------------------------------------------- */
#wrapwrap:has(#wrap.website_blog) .nx_header {
    display: block !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 9999 !important;
}

/* Blog wrap — push down below our fixed header (same height as main site) */
#wrap.website_blog {
    background: transparent;
    color: var(--text-bright);
    position: relative;
    z-index: 1;
    padding-top: 90px;   /* matches nx_header height */
    padding-bottom: 4rem;
}

/* ----------------------------------------------------------------
   WHITE SEARCH / BLOGS NAV STRIP — make dark
   ---------------------------------------------------------------- */
#wrap.website_blog .navbar,
#wrap.website_blog .navbar-light,
#wrap.website_blog nav.navbar {
    background: rgba(8, 15, 26, 0.85) !important;
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(0, 245, 255, 0.08) !important;
}

/* Blog category nav links */
#wrap.website_blog .navbar .nav-link,
#wrap.website_blog .navbar .nav-link.disabled {
    color: rgba(200, 220, 255, 0.65) !important;
}

#wrap.website_blog .navbar .nav-link:hover,
#wrap.website_blog .navbar .nav-link.active {
    color: var(--neon-cyan) !important;
}

/* Search input in blogs nav */
#wrap.website_blog .o_searchbar_form input,
#wrap.website_blog input[name="search"] {
    background: rgba(13, 25, 41, 0.8) !important;
    border: 1px solid rgba(0, 245, 255, 0.15) !important;
    border-radius: 8px !important;
    color: var(--text-bright) !important;
    font-family: 'Space Grotesk', sans-serif;
}

#wrap.website_blog .o_searchbar_form input::placeholder,
#wrap.website_blog input[name="search"]::placeholder {
    color: rgba(150, 180, 220, 0.5) !important;
}

#wrap.website_blog .o_searchbar_form input:focus,
#wrap.website_blog input[name="search"]:focus {
    border-color: var(--neon-cyan) !important;
    box-shadow: 0 0 0 3px rgba(0, 245, 255, 0.1) !important;
    outline: none !important;
}

/* Search submit button */
#wrap.website_blog .o_searchbar_form button,
#wrap.website_blog .input-group-text {
    background: rgba(0, 245, 255, 0.1) !important;
    border: 1px solid rgba(0, 245, 255, 0.2) !important;
    color: var(--neon-cyan) !important;
    border-radius: 0 8px 8px 0 !important;
}

/* ----------------------------------------------------------------
   MOBILE MENU — ensure the hamburger and slide-out work on blog
   ---------------------------------------------------------------- */
@media (max-width: 768px) {
    #wrapwrap:has(#wrap.website_blog) .nx_header .nx_nav {
        padding: 1rem 1.25rem !important;
    }

    #wrapwrap:has(#wrap.website_blog) .nx_header .menu_toggle {
        display: flex !important;
    }

    #wrap.website_blog {
        padding-top: 70px;  /* shorter header on mobile */
    }
}

/* ===== ADMIN TOOLBAR (fixed bottom-right, publisher only) ===== */
.nx_blog_admin_bar {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    z-index: 999;
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.nx_blog_admin_btn {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.65rem 1.3rem;
    font-family: 'Orbitron', sans-serif;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none !important;
    border-radius: 50px;
    white-space: nowrap;
    transition: transform 0.2s var(--ease-spring), box-shadow 0.2s;
}

.nx_blog_admin_btn .fa {
    font-size: 0.82rem;
}

/* Edit Page — outlined purple */
.nx_blog_edit_btn {
    background: rgba(123, 47, 255, 0.12);
    border: 1px solid rgba(123, 47, 255, 0.5);
    color: #b97dff !important;
    box-shadow: 0 0 14px rgba(123, 47, 255, 0.2);
}

.nx_blog_edit_btn:hover {
    background: rgba(123, 47, 255, 0.22);
    border-color: var(--neon-purple);
    color: #d4a8ff !important;
    transform: translateY(-3px) scale(1.04);
    box-shadow: 0 0 28px rgba(123, 47, 255, 0.45);
}

/* New Post — solid cyan gradient */
.nx_blog_new_btn {
    background: linear-gradient(135deg, var(--neon-cyan), var(--neon-blue));
    border: none;
    color: var(--bg-void) !important;
    box-shadow: var(--glow-cyan), 0 4px 20px rgba(0, 0, 0, 0.4);
}

.nx_blog_new_btn:hover {
    transform: translateY(-3px) scale(1.04);
    box-shadow: 0 0 30px rgba(0, 245, 255, 0.6), 0 0 80px rgba(0, 245, 255, 0.2);
    color: var(--bg-void) !important;
}

/* ===== BLOG HERO / BANNER — transparent so page gradient shows through ===== */
.o_wblog_cover_container,
.o_wblog_post_cover_container {
    background: transparent !important;
    border-bottom: 1px solid rgba(0, 245, 255, 0.1);
    position: relative;
    overflow: hidden;
}

/* Kill the default Odoo tan/beige cover color entirely */
.o_wblog_cover_container .o_record_cover_component,
.o_wblog_post_cover_container .o_record_cover_component,
.o_record_cover_component,
.o_record_has_cover .o_record_cover_component {
    background-color: transparent !important;
    background-image: none !important;
}

/* Blog/post title on the cover */
#o_wblog_blog_top,
.o_wblog_post_page_cover {
    background: transparent !important;
}

/* The full-width cover row */
.o_wblog_post_page_cover.o_record_has_cover {
    background: transparent !important;
}

/* Odoo sets inline style background-color on cover — JS clears it, CSS as backup */
.o_record_cover_component[style*="background"] {
    background-color: transparent !important;
    background-image: none !important;
}

/* ===== BREADCRUMB — blog post path e.g. "Our blog / Post Title" ===== */
#wrap.website_blog .breadcrumb,
#wrap.website_blog .breadcrumb-item,
#wrap.website_blog .breadcrumb-item.active {
    color: rgba(200, 220, 255, 0.75) !important;
    font-size: 0.82rem;
    font-family: 'Space Grotesk', sans-serif;
}

#wrap.website_blog .breadcrumb-item a {
    color: var(--neon-cyan) !important;
    text-decoration: none;
    opacity: 0.85;
    transition: opacity 0.2s;
}

#wrap.website_blog .breadcrumb-item a:hover {
    opacity: 1;
    text-decoration: underline;
}

#wrap.website_blog .breadcrumb-item + .breadcrumb-item::before {
    color: rgba(150, 180, 220, 0.5) !important;
}

/* ===== POST META — date, author, comments ===== */
#o_wblog_post_info,
#o_wblog_post_info .text-muted,
#o_wblog_post_info span,
#o_wblog_post_info i,
#o_wblog_post_info small,
#wrap.website_blog .text-muted {
    color: rgba(200, 220, 255, 0.80) !important;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 0.85rem;
}

/* Author name link */
#o_wblog_post_info a,
#wrap.website_blog #o_wblog_post_info a {
    color: var(--neon-cyan) !important;
    text-decoration: none;
    font-weight: 500;
}

#o_wblog_post_info a:hover {
    text-decoration: underline;
}

/* Blog title on cover */
.o_wblog_post_title h1,
.o_wblog_list_header h1,
.o_wblog_list_header h2 {
    font-family: 'Orbitron', sans-serif !important;
    color: var(--text-white) !important;
    text-shadow: var(--glow-cyan);
    letter-spacing: 0.03em;
}

.o_wblog_post_title .o_wblog_post_subtitle,
.o_wblog_list_header p {
    color: rgba(200, 220, 255, 0.75) !important;
    font-family: 'Space Grotesk', sans-serif;
}

/* ===== BLOG LIST PAGE ===== */
.o_wblog_posts_loop {
    background: transparent;
    padding: 2rem 0;
}

/* Blog post cards */
.o_wblog_post_short,
.o_wblog_post_list_item {
    background: var(--bg-card) !important;
    border: var(--glass-border) !important;
    border-radius: 12px !important;
    overflow: hidden;
    transition: border-color 0.3s var(--ease-smooth),
                box-shadow 0.3s var(--ease-smooth),
                transform 0.3s var(--ease-smooth);
    backdrop-filter: blur(10px);
    margin-bottom: 1.5rem;
}

.o_wblog_post_short:hover,
.o_wblog_post_list_item:hover {
    border: var(--glass-border-hover) !important;
    box-shadow: var(--glow-cyan);
    transform: translateY(-4px);
}

/* Post card cover image overlay */
.o_wblog_post_short .o_record_cover_component {
    position: relative;
}

.o_wblog_post_short .o_record_cover_component::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 60%;
    background: linear-gradient(transparent, var(--bg-card));
    pointer-events: none;
}

/* Post card body */
.o_wblog_post_short .card-body,
.o_wblog_post_list_item .card-body {
    background: transparent !important;
    color: var(--text-bright) !important;
    padding: 1.25rem 1.5rem;
}

.o_wblog_post_short .card-title a,
.o_wblog_post_list_item .card-title a {
    font-family: 'Orbitron', 'Space Grotesk', sans-serif !important;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--text-white) !important;
    text-decoration: none;
    letter-spacing: 0.02em;
    transition: color 0.2s;
}

.o_wblog_post_short .card-title a:hover,
.o_wblog_post_list_item .card-title a:hover {
    color: var(--neon-cyan) !important;
    text-shadow: 0 0 8px rgba(0, 245, 255, 0.5);
}

.o_wblog_post_short .card-text,
.o_wblog_post_list_item .card-text {
    color: var(--text-muted) !important;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 0.9rem;
    line-height: 1.6;
}

/* ===== BLOG SIDEBAR ===== */
#o_wblog_sidebar {
    background: rgba(13, 25, 41, 0.6);
    backdrop-filter: blur(12px);
    border: var(--glass-border);
    border-radius: 12px;
    padding: 1.5rem;
}

#o_wblog_sidebar .o_wblog_sidebar_title,
#o_wblog_sidebar h3,
#o_wblog_sidebar h4 {
    font-family: 'Orbitron', sans-serif !important;
    font-size: 0.85rem !important;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--neon-cyan) !important;
    border-bottom: 1px solid rgba(0, 245, 255, 0.15);
    padding-bottom: 0.5rem;
    margin-bottom: 1rem;
}

#o_wblog_sidebar a {
    color: var(--text-muted) !important;
    text-decoration: none;
    transition: color 0.2s;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 0.9rem;
}

#o_wblog_sidebar a:hover {
    color: var(--neon-cyan) !important;
}

/* Tag cloud in sidebar */
#o_wblog_sidebar .o_tag,
#o_wblog_sidebar .badge {
    background: rgba(0, 245, 255, 0.08) !important;
    border: 1px solid rgba(0, 245, 255, 0.2) !important;
    color: var(--neon-cyan) !important;
    border-radius: 20px !important;
    font-size: 0.78rem;
    padding: 0.2rem 0.65rem;
    transition: background 0.2s, box-shadow 0.2s;
    text-decoration: none;
    display: inline-block;
    margin: 0.15rem;
    font-family: 'Space Grotesk', sans-serif;
}

#o_wblog_sidebar .o_tag:hover,
#o_wblog_sidebar .badge:hover {
    background: rgba(0, 245, 255, 0.18) !important;
    box-shadow: 0 0 10px rgba(0, 245, 255, 0.3);
}

/* ===== BLOG POST PAGE ===== */
.o_wblog_post_page {
    background: transparent;
}

/* Post content wrapper */
#o_wblog_post_content_jump,
.o_wblog_read_top {
    background: transparent;
}

/* Article body */
#o_wblog_post_main {
    background: transparent;
}

.o_wblog_post_content {
    color: var(--text-bright) !important;
    font-family: 'Space Grotesk', 'Inter', sans-serif;
    font-size: 1rem;
    line-height: 1.8;
}

.o_wblog_post_content h1,
.o_wblog_post_content h2,
.o_wblog_post_content h3,
.o_wblog_post_content h4 {
    font-family: 'Orbitron', sans-serif !important;
    color: var(--text-white) !important;
    letter-spacing: 0.02em;
    margin-top: 2rem;
    margin-bottom: 0.75rem;
}

.o_wblog_post_content h2 {
    font-size: 1.35rem;
    color: var(--neon-cyan) !important;
}

.o_wblog_post_content h3 {
    font-size: 1.1rem;
}

.o_wblog_post_content p {
    color: var(--text-bright);
    margin-bottom: 1.25rem;
}

.o_wblog_post_content a {
    color: var(--neon-cyan) !important;
    text-decoration: none;
    border-bottom: 1px solid rgba(0, 245, 255, 0.3);
    transition: border-color 0.2s, text-shadow 0.2s;
}

.o_wblog_post_content a:hover {
    border-color: var(--neon-cyan);
    text-shadow: 0 0 8px rgba(0, 245, 255, 0.4);
}

.o_wblog_post_content blockquote {
    border-left: 3px solid var(--neon-purple) !important;
    background: rgba(123, 47, 255, 0.08) !important;
    border-radius: 0 8px 8px 0;
    padding: 1rem 1.5rem;
    color: var(--text-muted) !important;
    font-style: italic;
    margin: 1.5rem 0;
}

.o_wblog_post_content code,
.o_wblog_post_content pre {
    background: var(--bg-surface) !important;
    color: var(--neon-green) !important;
    border: 1px solid rgba(0, 255, 136, 0.2);
    border-radius: 6px;
    font-family: 'Courier New', monospace;
}

.o_wblog_post_content pre {
    padding: 1.25rem;
    overflow-x: auto;
}

.o_wblog_post_content code {
    padding: 0.15rem 0.4rem;
    font-size: 0.875em;
}

.o_wblog_post_content ul,
.o_wblog_post_content ol {
    color: var(--text-bright);
    padding-left: 1.5rem;
    margin-bottom: 1.25rem;
}

.o_wblog_post_content li {
    margin-bottom: 0.4rem;
}

.o_wblog_post_content hr {
    border-color: rgba(0, 245, 255, 0.1);
    margin: 2rem 0;
}

.o_wblog_post_content img {
    border-radius: 10px;
    border: var(--glass-border);
    max-width: 100%;
}

/* ===== POST META (author, date, tags) ===== */
.o_wblog_post_short_author,
.o_wblog_author_avatar_date,
.o_wblog_post_header_info {
    color: var(--text-dim) !important;
    font-size: 0.82rem;
    font-family: 'Space Grotesk', sans-serif;
}

.o_wblog_post_short_author a,
.o_wblog_author_avatar_date a,
.o_wblog_post_header_info a {
    color: var(--text-muted) !important;
    text-decoration: none;
}

.o_wblog_post_short_author a:hover,
.o_wblog_author_avatar_date a:hover,
.o_wblog_post_header_info a:hover {
    color: var(--neon-cyan) !important;
}

/* Tags on post */
.o_wblog_post_tag,
.o_blog_tag_list .badge,
.o_wblog_tag {
    background: rgba(0, 245, 255, 0.08) !important;
    border: 1px solid rgba(0, 245, 255, 0.25) !important;
    color: var(--neon-cyan) !important;
    border-radius: 20px !important;
    font-size: 0.78rem;
    padding: 0.2rem 0.7rem;
    font-family: 'Space Grotesk', sans-serif;
    text-decoration: none;
    display: inline-block;
    margin: 0.15rem;
    transition: background 0.2s, box-shadow 0.2s;
}

.o_wblog_post_tag:hover,
.o_blog_tag_list .badge:hover,
.o_wblog_tag:hover {
    background: rgba(0, 245, 255, 0.18) !important;
    box-shadow: 0 0 10px rgba(0, 245, 255, 0.3);
}

/* ===== BLOG NAVIGATION (prev/next) ===== */
.o_wblog_next_container {
    background: rgba(5, 12, 20, 0.5) !important;
    backdrop-filter: blur(8px);
    border-top: 1px solid rgba(0, 245, 255, 0.1);
    color: var(--text-muted) !important;
}

.o_wblog_next_container .o_wblog_next_link {
    color: var(--neon-cyan) !important;
    font-family: 'Orbitron', sans-serif;
    font-size: 0.9rem;
    text-decoration: none;
    transition: text-shadow 0.2s;
}

.o_wblog_next_container .o_wblog_next_link:hover {
    text-shadow: var(--glow-cyan);
}

/* ===== COMMENTS SECTION ===== */
#o_wblog_post_comments {
    background: rgba(5, 12, 20, 0.5);
    backdrop-filter: blur(8px);
    border-top: 1px solid rgba(0, 245, 255, 0.1);
    padding: 2rem 0;
}

#o_wblog_post_comments h3,
#o_wblog_post_comments h4 {
    font-family: 'Orbitron', sans-serif !important;
    color: var(--neon-cyan) !important;
    font-size: 1rem;
    letter-spacing: 0.1em;
}

#o_wblog_post_comments .o_portal_chatter_message_body {
    background: var(--bg-surface) !important;
    border: var(--glass-border) !important;
    border-radius: 10px;
    color: var(--text-bright) !important;
    padding: 1rem 1.25rem;
}

#o_wblog_post_comments .o_portal_chatter_message_author_name {
    color: var(--neon-cyan) !important;
    font-weight: 600;
}

#o_wblog_post_comments textarea,
#o_wblog_post_comments input[type="text"],
#o_wblog_post_comments input[type="email"] {
    background: var(--bg-surface) !important;
    border: var(--glass-border) !important;
    border-radius: 8px !important;
    color: var(--text-bright) !important;
    font-family: 'Space Grotesk', sans-serif;
    padding: 0.6rem 1rem;
    transition: border-color 0.2s;
}

#o_wblog_post_comments textarea:focus,
#o_wblog_post_comments input:focus {
    border-color: var(--neon-cyan) !important;
    box-shadow: 0 0 0 3px rgba(0, 245, 255, 0.1) !important;
    outline: none;
}

/* ===== SEARCH / FILTER BAR STRIP ===== */
#o_wblog_index_content,
.o_wblog_search_box_wrap,
.o_wblog_search_wrapper {
    background: transparent !important;
}

/* ===== BLOG SEARCH / FILTER BAR ===== */
.o_wblog_search_form input,
.o_wblog_search input {
    background: var(--bg-surface) !important;
    border: var(--glass-border) !important;
    border-radius: 8px !important;
    color: var(--text-bright) !important;
    font-family: 'Space Grotesk', sans-serif;
    padding: 0.6rem 1rem;
}

.o_wblog_search_form input:focus,
.o_wblog_search input:focus {
    border-color: var(--neon-cyan) !important;
    box-shadow: 0 0 0 3px rgba(0, 245, 255, 0.1) !important;
    outline: none;
}

.o_wblog_search_form .btn,
.o_wblog_search .btn {
    background: linear-gradient(135deg, var(--neon-cyan), var(--neon-blue)) !important;
    border: none !important;
    color: var(--bg-void) !important;
    font-family: 'Orbitron', sans-serif !important;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    border-radius: 8px !important;
    padding: 0.6rem 1.2rem !important;
    transition: box-shadow 0.2s;
    text-transform: uppercase;
}

.o_wblog_search_form .btn:hover,
.o_wblog_search .btn:hover {
    box-shadow: var(--glow-cyan);
}

/* ===== PAGINATION ===== */
.o_wblog_pager .pagination .page-item .page-link {
    background: var(--bg-surface) !important;
    border-color: rgba(0, 245, 255, 0.15) !important;
    color: var(--text-muted) !important;
    font-family: 'Space Grotesk', sans-serif;
    transition: background 0.2s, color 0.2s;
}

.o_wblog_pager .pagination .page-item.active .page-link,
.o_wblog_pager .pagination .page-item .page-link:hover {
    background: linear-gradient(135deg, rgba(0, 245, 255, 0.15), rgba(0, 102, 255, 0.15)) !important;
    border-color: var(--neon-cyan) !important;
    color: var(--neon-cyan) !important;
    box-shadow: 0 0 10px rgba(0, 245, 255, 0.2);
}

/* ===== READ MORE BUTTON ===== */
.o_wblog_post_short .btn,
.o_wblog_read_more {
    background: transparent !important;
    border: 1px solid rgba(0, 245, 255, 0.35) !important;
    color: var(--neon-cyan) !important;
    border-radius: 6px !important;
    font-family: 'Space Grotesk', sans-serif !important;
    font-size: 0.82rem;
    font-weight: 600;
    padding: 0.4rem 1rem !important;
    transition: background 0.2s, box-shadow 0.2s;
    text-decoration: none;
}

.o_wblog_post_short .btn:hover,
.o_wblog_read_more:hover {
    background: rgba(0, 245, 255, 0.08) !important;
    box-shadow: 0 0 14px rgba(0, 245, 255, 0.25);
}

/* ===== BLOG CATEGORIES FILTER (top bar) ===== */
.o_wblog_list_filter_header,
.o_wblog_tags_list {
    background: var(--bg-deep);
    border-bottom: 1px solid rgba(0, 245, 255, 0.08);
    padding: 0.75rem 0;
}

.o_wblog_list_filter_header a,
.o_wblog_tags_list a {
    color: var(--text-muted) !important;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 0.85rem;
    text-decoration: none;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    transition: color 0.2s, background 0.2s;
}

.o_wblog_list_filter_header a:hover,
.o_wblog_tags_list a:hover,
.o_wblog_list_filter_header a.active,
.o_wblog_tags_list a.active {
    color: var(--neon-cyan) !important;
    background: rgba(0, 245, 255, 0.08);
}

/* ===== BREADCRUMB ===== */
.o_wblog_post_page .breadcrumb,
.o_wblog .breadcrumb {
    background: transparent !important;
    padding: 0.75rem 0;
    font-size: 0.82rem;
}

.o_wblog_post_page .breadcrumb-item,
.o_wblog .breadcrumb-item {
    color: var(--text-dim) !important;
}

.o_wblog_post_page .breadcrumb-item a,
.o_wblog .breadcrumb-item a {
    color: var(--text-muted) !important;
    text-decoration: none;
}

.o_wblog_post_page .breadcrumb-item a:hover,
.o_wblog .breadcrumb-item a:hover {
    color: var(--neon-cyan) !important;
}

.o_wblog_post_page .breadcrumb-item.active,
.o_wblog .breadcrumb-item.active {
    color: var(--neon-cyan) !important;
}

.o_wblog_post_page .breadcrumb-item + .breadcrumb-item::before,
.o_wblog .breadcrumb-item + .breadcrumb-item::before {
    color: var(--text-dim) !important;
}

/* ===== SHARE BUTTONS ===== */
.o_wblog_share_links a,
.o_share_btn {
    background: var(--bg-surface) !important;
    border: var(--glass-border) !important;
    color: var(--text-muted) !important;
    border-radius: 8px;
    transition: border-color 0.2s, color 0.2s, box-shadow 0.2s;
    text-decoration: none;
    padding: 0.35rem 0.75rem;
    font-size: 0.85rem;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.o_wblog_share_links a:hover,
.o_share_btn:hover {
    border-color: var(--neon-cyan) !important;
    color: var(--neon-cyan) !important;
    box-shadow: 0 0 10px rgba(0, 245, 255, 0.2);
}

/* ===== AUTHOR BOX ===== */
.o_wblog_post_author_info {
    background: var(--bg-surface) !important;
    border: var(--glass-border) !important;
    border-radius: 12px;
    padding: 1.25rem;
    color: var(--text-muted) !important;
    font-family: 'Space Grotesk', sans-serif;
}

.o_wblog_post_author_info .o_wblog_author_name,
.o_wblog_post_author_info h5 {
    color: var(--text-white) !important;
    font-family: 'Orbitron', sans-serif !important;
    font-size: 0.9rem;
}

/* ===== SCROLLBAR inside blog ===== */
.o_wblog_post_content::-webkit-scrollbar {
    width: 5px;
}

.o_wblog_post_content::-webkit-scrollbar-thumb {
    background: linear-gradient(var(--neon-cyan), var(--neon-purple));
    border-radius: 3px;
}