/* ============================================
   REVVED UP CARS - COMPREHENSIVE UI CLEANUP
   Fixes all UI inconsistencies site-wide
   ============================================ */

/* ============================================
   1. HIDE SIDEBAR NAV TOGGLE (GREEN BLOB)
   The revved-sidebar-nav opens a random panel
   ============================================ */
.revved-sidebar-nav {
    display: none !important;
}

.revved-sidebar-widget,
.revved-sidebar-wrap,
.revved-sidebar-close-wrap,
.revved-sidebar-close {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* ============================================
   2. FIX DROPDOWN ARROWS - Topics/News
   Remove ::before that creates overlapping arrows
   ============================================ */

/* Remove ALL pseudo-element arrows from menu items */
.menu-item-has-children > a::before,
.menu-item-has-children > a::after,
#menu-primary-menu .menu-item-has-children > a::before,
.navigation .menu-item-has-children > a::before,
.mainmenu .menu-item-has-children > a::before {
    display: none !important;
    content: none !important;
}

/* Add proper dropdown indicator AFTER the text */
.menu-item-has-children > a {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
}

/* Create a clean caret icon using borders */
#menu-primary-menu > .menu-item-has-children > a::after,
.navigation > .menu-item-has-children > a::after {
    content: "" !important;
    display: inline-block !important;
    width: 0 !important;
    height: 0 !important;
    border-left: 4px solid transparent !important;
    border-right: 4px solid transparent !important;
    border-top: 5px solid currentColor !important;
    margin-left: 6px !important;
    opacity: 0.5 !important;
    position: static !important;
    background: none !important;
    transform: none !important;
    transition: opacity 0.2s ease !important;
}

#menu-primary-menu > .menu-item-has-children > a:hover::after,
.navigation > .menu-item-has-children > a:hover::after {
    opacity: 1 !important;
}

/* Submenu nested dropdown arrows - point right */
.sub-menu .menu-item-has-children > a::after {
    content: "" !important;
    display: inline-block !important;
    width: 0 !important;
    height: 0 !important;
    border-top: 4px solid transparent !important;
    border-bottom: 4px solid transparent !important;
    border-left: 5px solid currentColor !important;
    margin-left: auto !important;
    opacity: 0.5 !important;
    position: static !important;
    background: none !important;
}

/* ============================================
   3. FIX SEARCH BUTTONS & FORMS
   ============================================ */

/* Desktop search in header */
.revved-search {
    display: flex !important;
    align-items: center !important;
    background: #f4f6f5 !important;
    border-radius: 10px !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 1px solid #e2e6e5 !important;
    max-width: 300px !important;
}

.revved-search form {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.revved-search input[type="search"],
.revved-search input#search {
    flex: 1 !important;
    padding: 10px 14px !important;
    border: none !important;
    background: transparent !important;
    font-size: 14px !important;
    color: #1a1f1a !important;
    outline: none !important;
    min-width: 150px !important;
}

.revved-search input::placeholder {
    color: #6b7270 !important;
}

.revved-search button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 42px !important;
    height: 42px !important;
    background: #647c40 !important;
    border: none !important;
    color: #fff !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
    transition: background 0.2s ease !important;
}

.revved-search button:hover {
    background: #4d6030 !important;
}

.revved-search button i {
    font-size: 14px !important;
}

/* Mobile search */
.header-mobile-search {
    padding: 16px !important;
    background: #f9faf9 !important;
    border-bottom: 1px solid #eef1f0 !important;
}

.header-mobile-search form {
    display: flex !important;
    align-items: center !important;
    background: #fff !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    border: 1px solid #e2e6e5 !important;
}

.header-mobile-search input {
    flex: 1 !important;
    padding: 12px 16px !important;
    border: none !important;
    background: transparent !important;
    font-size: 15px !important;
}

.header-mobile-search button {
    width: 48px !important;
    height: 48px !important;
    background: #647c40 !important;
    border: none !important;
    color: #fff !important;
}

/* Sidebar search widget */
.widget_search form,
.search-form {
    display: flex !important;
    align-items: stretch !important;
    background: #fff !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    border: 1px solid #e2e6e5 !important;
}

.widget_search input[type="search"],
.search-form input[type="search"],
.widget_search .search-field,
.search-form .search-field {
    flex: 1 !important;
    padding: 12px 16px !important;
    border: none !important;
    background: transparent !important;
    font-size: 14px !important;
    color: #1a1f1a !important;
}

.widget_search button,
.search-form button,
.widget_search .search-submit,
.search-form .search-submit {
    padding: 12px 18px !important;
    background: #647c40 !important;
    border: none !important;
    color: #fff !important;
    font-weight: 600 !important;
    cursor: pointer !important;
}

/* ============================================
   4. FIX NAVIGATION UNDERLINES
   Phase 4 added underlines that may conflict
   ============================================ */

/* Reset and unify nav underlines */
.navigation > li > a::after,
#menu-primary-menu > li > a::after {
    content: "" !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 50% !important;
    width: 0 !important;
    height: 3px !important;
    background: linear-gradient(90deg, #647c40, #f5ff3d) !important;
    transition: width 0.25s ease, left 0.25s ease !important;
    transform: none !important;
}

.navigation > li > a:hover::after,
#menu-primary-menu > li > a:hover::after,
.navigation > li.current-menu-item > a::after,
#menu-primary-menu > li.current-menu-item > a::after {
    width: calc(100% - 40px) !important;
    left: 20px !important;
    transform: none !important;
}

/* But NOT on dropdown parents - they have caret */
.navigation > .menu-item-has-children > a::after,
#menu-primary-menu > .menu-item-has-children > a::after {
    /* Keep as caret, remove underline effect */
    position: static !important;
    width: 0 !important;
    height: 0 !important;
    background: none !important;
}

/* ============================================
   5. FIX MOBILE MENU
   ============================================ */

/* Mobile menu container */
#revved-mobile-menu,
.revved-mobile-menu,
.mobile-menu-container {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

#revved-mobile-menu li,
.revved-mobile-menu li {
    border-bottom: 1px solid #eef1f0 !important;
    margin: 0 !important;
}

#revved-mobile-menu li a,
.revved-mobile-menu li a {
    display: block !important;
    padding: 14px 20px !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #1a1f1a !important;
    text-decoration: none !important;
}

#revved-mobile-menu li a:hover,
.revved-mobile-menu li a:hover {
    color: #647c40 !important;
    background: #f9faf9 !important;
}

/* Mobile submenu */
#revved-mobile-menu .sub-menu,
.revved-mobile-menu .sub-menu {
    display: none !important;
    background: #f4f6f5 !important;
    padding-left: 0 !important;
}

#revved-mobile-menu .sub-menu.active,
.revved-mobile-menu .sub-menu.show,
#revved-mobile-menu li.open > .sub-menu {
    display: block !important;
}

#revved-mobile-menu .sub-menu li a {
    padding-left: 40px !important;
    font-size: 14px !important;
}

/* ============================================
   6. FIX HAMBURGER MENU BUTTON
   ============================================ */

.hamburger_menu {
    display: none !important;
    width: 44px !important;
    height: 44px !important;
    background: #647c40 !important;
    border-radius: 8px !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    cursor: pointer !important;
    border: none !important;
    padding: 10px !important;
}

.hamburger_menu span {
    display: block !important;
    width: 22px !important;
    height: 2px !important;
    background: #fff !important;
    border-radius: 2px !important;
}

@media (max-width: 991px) {
    .hamburger_menu {
        display: flex !important;
    }
}

/* ============================================
   7. FIX CATEGORY BADGES CONSISTENCY
   ============================================ */

.revved-category,
.revved-category-badge,
.category-badge,
.cat-links a,
.entry-category a {
    display: inline-block !important;
    background: #647c40 !important;
    color: #fff !important;
    padding: 4px 10px !important;
    border-radius: 4px !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    text-decoration: none !important;
    line-height: 1.4 !important;
}

.revved-category:hover,
.revved-category-badge:hover,
.cat-links a:hover {
    background: #4d6030 !important;
    color: #fff !important;
}

/* ============================================
   8. FIX BUTTON CONSISTENCY
   ============================================ */

/* Primary buttons - Yellow */
.btn-primary,
.button-primary,
button.primary,
input[type="submit"],
.wp-block-button__link,
.revved-btn {
    background: linear-gradient(135deg, #f5ff3d 0%, #e8f038 100%) !important;
    color: #1a1f1a !important;
    border: none !important;
    padding: 12px 24px !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    cursor: pointer !important;
    text-decoration: none !important;
    display: inline-block !important;
    transition: all 0.2s ease !important;
}

.btn-primary:hover,
.button-primary:hover,
button.primary:hover,
input[type="submit"]:hover,
.wp-block-button__link:hover {
    background: linear-gradient(135deg, #e8f038 0%, #dce530 100%) !important;
    box-shadow: 0 4px 12px rgba(245, 255, 61, 0.3) !important;
    color: #1a1f1a !important;
}

/* Secondary buttons - Green */
.btn-secondary,
.button-secondary,
button.secondary {
    background: #647c40 !important;
    color: #fff !important;
    border: none !important;
    padding: 12px 24px !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
}

.btn-secondary:hover,
.button-secondary:hover {
    background: #4d6030 !important;
}

/* ============================================
   9. FIX PAGINATION
   ============================================ */

.pagination,
.page-numbers,
.nav-links {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    margin: 40px 0 !important;
    flex-wrap: wrap !important;
}

.page-numbers li,
.nav-links > * {
    list-style: none !important;
}

.page-numbers a,
.page-numbers span,
.nav-links a,
.nav-links span.current {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 44px !important;
    height: 44px !important;
    padding: 0 16px !important;
    background: #fff !important;
    border: 1px solid #e2e6e5 !important;
    border-radius: 8px !important;
    color: #1a1f1a !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
}

.page-numbers a:hover,
.nav-links a:hover {
    background: #647c40 !important;
    border-color: #647c40 !important;
    color: #fff !important;
}

.page-numbers .current,
.page-numbers span.current,
.nav-links span.current {
    background: #647c40 !important;
    border-color: #647c40 !important;
    color: #fff !important;
}

.page-numbers .next,
.page-numbers .prev {
    background: linear-gradient(135deg, #f5ff3d 0%, #e8f038 100%) !important;
    border-color: transparent !important;
    color: #1a1f1a !important;
}

.page-numbers .next:hover,
.page-numbers .prev:hover {
    box-shadow: 0 4px 12px rgba(245, 255, 61, 0.3) !important;
}

/* ============================================
   10. FIX CARD HOVER STATES
   ============================================ */

.revved-post-item,
.revved-post-item,
.post-card,
article.post {
    transition: box-shadow 0.2s ease !important;
}

.revved-post-item:hover,
.revved-post-item:hover,
.post-card:hover {
    box-shadow: 0 8px 24px rgba(26, 31, 26, 0.08) !important;
}

/* Disable aggressive transforms that cause jank */
.revved-post-item:hover,
.revved-post-item:hover,
.revved-post-item:hover img,
.revved-post-item:hover img {
    transform: none !important;
}

/* ============================================
   11. FIX WIDGET TITLES
   ============================================ */

.widget-title,
.widget h2,
.widget h3,
.sidebar .widget-title,
.footer-widget .widget-title {
    font-family: "DM Sans", sans-serif !important;
    font-size: 1.1rem !important;
    font-weight: 700 !important;
    color: #1a1f1a !important;
    margin: 0 0 20px !important;
    padding-bottom: 12px !important;
    border-bottom: 2px solid #eef1f0 !important;
    position: relative !important;
}

.widget-title::after,
.widget h2::after {
    content: "" !important;
    position: absolute !important;
    bottom: -2px !important;
    left: 0 !important;
    width: 50px !important;
    height: 2px !important;
    background: linear-gradient(90deg, #647c40, #f5ff3d) !important;
}

/* ============================================
   12. FIX LINKS CONSISTENCY
   ============================================ */

a {
    color: #647c40 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

a:hover {
    color: #4d6030 !important;
}

/* But not for cards and nav */
.revved-post-item a,
.revved-post-item a,
.navigation a,
#menu-primary-menu a,
.widget a {
    color: inherit !important;
}

.revved-post-item a:hover,
.revved-post-item a:hover {
    color: #647c40 !important;
}

/* Post titles should be dark */
.entry-title a,
.post-title a,
.revved-post-title a,
h2.entry-title a,
h3.entry-title a {
    color: #1a1f1a !important;
}

.entry-title a:hover,
.post-title a:hover,
.revved-post-title a:hover {
    color: #647c40 !important;
}

/* ============================================
   13. FIX FORM INPUTS CONSISTENCY
   ============================================ */

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="tel"],
input[type="number"],
textarea,
select {
    width: 100% !important;
    padding: 12px 16px !important;
    background: #f9faf9 !important;
    border: 1px solid #e2e6e5 !important;
    border-radius: 8px !important;
    font-size: 15px !important;
    color: #1a1f1a !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

input:focus,
textarea:focus,
select:focus {
    background: #fff !important;
    border-color: #647c40 !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(100, 124, 64, 0.1) !important;
}

/* ============================================
   14. FIX SOCIAL ICONS
   ============================================ */

.social-icons a,
.revved-social a,
.author-social a,
.theme_author_socials_icon a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    height: 36px !important;
    background: #f4f6f5 !important;
    border-radius: 50% !important;
    color: #4d544d !important;
    font-size: 14px !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
}

.social-icons a:hover,
.revved-social a:hover,
.author-social a:hover,
.theme_author_socials_icon a:hover {
    background: #647c40 !important;
    color: #fff !important;
}

/* ============================================
   15. FIX BREADCRUMBS
   ============================================ */

.breadcrumbs,
.breadcrumb,
.revved-breadcrumb,
.yoast-breadcrumb {
    font-size: 13px !important;
    color: #6b7270 !important;
    margin-bottom: 20px !important;
}

.breadcrumbs a,
.breadcrumb a,
.revved-breadcrumb a {
    color: #647c40 !important;
}

.breadcrumbs a:hover,
.breadcrumb a:hover {
    color: #4d6030 !important;
    text-decoration: underline !important;
}

/* ============================================
   16. FIX OFFCANVAS/SLIDE-OUT PANELS
   ============================================ */

.offcanvas-menu,
.revved-mobile-menu-wrapper,
.mobile-menu-wrapper {
    background: #fff !important;
    box-shadow: -4px 0 20px rgba(26, 31, 26, 0.1) !important;
}

.offcanvas-close,
.mobile-menu-close,
.revved-close {
    width: 40px !important;
    height: 40px !important;
    background: #f4f6f5 !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #1a1f1a !important;
    font-size: 18px !important;
    cursor: pointer !important;
    border: none !important;
}

.offcanvas-close:hover,
.mobile-menu-close:hover,
.revved-close:hover {
    background: #647c40 !important;
    color: #fff !important;
}

/* ============================================
   17. FIX TABLES
   ============================================ */

table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 24px 0 !important;
}

th, td {
    padding: 12px 16px !important;
    text-align: left !important;
    border-bottom: 1px solid #eef1f0 !important;
}

th {
    background: #f4f6f5 !important;
    font-weight: 600 !important;
    color: #1a1f1a !important;
}

tr:hover td {
    background: #f9faf9 !important;
}

/* ============================================
   18. FIX SCROLL & ANIMATION PERFORMANCE
   ============================================ */

* {
    scroll-behavior: smooth !important;
}

@media (prefers-reduced-motion: reduce) {
    * {
        animation: none !important;
        transition: none !important;
    }
}

/* Prevent layout shifts */
img {
    max-width: 100% !important;
    height: auto !important;
}

/* ============================================
   19. RESPONSIVE FIXES
   ============================================ */

@media (max-width: 1199px) {
    .revved-search {
        max-width: 250px !important;
    }
}

@media (max-width: 991px) {
    /* Hide desktop nav, show hamburger */
    .mainmenu,
    .site-navigation,
    .revved-search {
        display: none !important;
    }
    
    .hamburger_menu {
        display: flex !important;
    }
}

@media (max-width: 767px) {
    /* Stack elements */
    .page-numbers,
    .pagination {
        gap: 6px !important;
    }
    
    .page-numbers a,
    .page-numbers span {
        min-width: 38px !important;
        height: 38px !important;
        padding: 0 12px !important;
        font-size: 13px !important;
    }
}

@media (max-width: 480px) {
    input[type="text"],
    input[type="email"],
    textarea {
        padding: 10px 14px !important;
        font-size: 14px !important;
    }
}

/* ============================================
   HIDE OLD NEWS BADGE IN TICKER
   ============================================ */
.revved-top-bar .breaking-heading {
    display: none !important;
}

/* Show theme's original ticker with animation */
.revved-top-bar .revved-breakingnews {
    flex: 1 !important;
    overflow: hidden !important;
}

.breaking-headline-active.owl-carousel {
    display: flex !important;
}

.breaking-headline-active.owl-carousel .owl-stage-outer {
    overflow: visible !important;
}

.breaking-headline-active li {
    white-space: nowrap !important;
    padding-right: 60px !important;
}

.breaking-headline-active li a {
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 500 !important;
}

.breaking-headline-active li a:hover {
    color: #C5D631 !important;
}