/* ============================================
   REVVEDUPCARS BRAND REVAMP - PHASE 1
   Based on logo colors: Yellow #f5ff3d, Green #647c40
   ============================================ */

/* Google Fonts */
@import url("https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Inter:opsz,wght@14..32,100..900&display=swap");

/* CSS Custom Properties */
:root {
    --revved-primary: #f5ff3d;
    --revved-primary-dark: #d4e033;
    --revved-secondary: #647c40;
    --revved-secondary-dark: #4a5c30;
    --revved-secondary-light: #7a9450;
    --revved-dark: #1a1f1a;
    --revved-gray-900: #2d332d;
    --revved-gray-800: #3d433d;
    --revved-gray-700: #4d544d;
    --revved-gray-600: #6b7270;
    --revved-gray-500: #8a918f;
    --revved-gray-400: #aeb9b8;
    --revved-gray-300: #c1c9c9;
    --revved-gray-200: #e2e6e5;
    --revved-gray-100: #f4f6f5;
    --revved-white: #ffffff;
    --revved-gradient-primary: linear-gradient(135deg, #647c40 0%, #7a9450 50%, #f5ff3d 100%);
    --revved-gradient-dark: linear-gradient(180deg, #1a1f1a 0%, #2d332d 100%);
    --revved-gradient-accent: linear-gradient(90deg, #647c40, #f5ff3d);
    --revved-font-primary: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --revved-font-heading: "DM Sans", "Inter", sans-serif;
    --revved-radius-sm: 6px;
    --revved-radius-md: 10px;
    --revved-radius-lg: 16px;
    --revved-radius-xl: 24px;
    --revved-shadow-sm: 0 2px 4px rgba(26, 31, 26, 0.06);
    --revved-shadow-md: 0 4px 12px rgba(26, 31, 26, 0.1);
    --revved-shadow-lg: 0 8px 24px rgba(26, 31, 26, 0.12);
    --revved-shadow-xl: 0 16px 48px rgba(26, 31, 26, 0.16);
}

/* Global Typography */
body {
    font-family: var(--revved-font-primary) !important;
    font-size: 17px !important;
    line-height: 1.7 !important;
    color: var(--revved-text-primary) !important;
    background-color: var(--revved-bg-primary) !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
}

h1, h2, h3, h4, h5, h6,
.entry-title, .post-title, .revved-post-title,
.revved-post-title, .widget-title, .revved-section-title {
    font-family: var(--revved-font-heading) !important;
    font-weight: 700 !important;
    color: var(--revved-text-primary) !important;
    line-height: 1.25 !important;
    letter-spacing: -0.02em !important;
}

h1, .h1 { font-size: 2.75rem !important; }
h2, .h2 { font-size: 2rem !important; }
h3, .h3 { font-size: 1.5rem !important; }
h4, .h4 { font-size: 1.25rem !important; }
h5, .h5 { font-size: 1.1rem !important; }
h6, .h6 { font-size: 1rem !important; }

.entry-title a, .post-title a, .revved-post-title a, .revved-post-title a {
    color: var(--revved-text-primary) !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

.entry-title a:hover, .post-title a:hover,
.revved-post-title a:hover, .revved-post-title a:hover {
    color: var(--revved-secondary) !important;
}

p, .entry-content p {
    font-size: 1.0625rem !important;
    line-height: 1.8 !important;
    color: var(--revved-gray-700) !important;
}

a {
    color: var(--revved-secondary) !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

a:hover {
    color: var(--revved-secondary-dark) !important;
}

/* Header & Navigation */
.revved-topbar, .revved-topbar, .top-bar {
    background: var(--revved-dark) !important;
    padding: 8px 0 !important;
    border-bottom: 1px solid var(--revved-gray-800) !important;
}

.revved-topbar *, .revved-topbar *, .top-bar * {
    color: var(--revved-gray-400) !important;
    font-size: 13px !important;
}

.revved-topbar a:hover, .revved-topbar a:hover {
    color: var(--revved-primary) !important;
}

.revved-main-header, .revved-header, header.site-header, .header-area {
    background: var(--revved-white) !important;
    box-shadow: var(--revved-shadow-md) !important;
}

.revved-main-menu > li > a, .primary-menu > li > a,
.main-navigation ul > li > a, .navbar-nav > li > a, .nav-menu > li > a {
    font-family: var(--revved-font-heading) !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    color: var(--revved-text-primary) !important;
    padding: 12px 18px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.03em !important;
    border-radius: var(--revved-radius-sm) !important;
    transition: all 0.25s ease !important;
}

.revved-main-menu > li > a:hover, .nav-menu > li > a:hover,
.revved-main-menu > li.current-menu-item > a, .nav-menu > li.current-menu-item > a {
    background: var(--revved-gray-100) !important;
    color: var(--revved-secondary) !important;
}

.revved-main-menu .sub-menu, .nav-menu .sub-menu, .dropdown-menu {
    background: var(--revved-white) !important;
    border: 1px solid var(--revved-gray-200) !important;
    border-radius: var(--revved-radius-md) !important;
    box-shadow: var(--revved-shadow-lg) !important;
    padding: 12px 0 !important;
}

.revved-main-menu .sub-menu li a, .nav-menu .sub-menu li a {
    font-size: 14px !important;
    font-weight: 500 !important;
    padding: 10px 20px !important;
    color: var(--revved-gray-700) !important;
    text-transform: none !important;
}

.revved-main-menu .sub-menu li a:hover, .nav-menu .sub-menu li a:hover {
    background: var(--revved-gray-100) !important;
    color: var(--revved-secondary) !important;
}

/* Buttons & CTAs */
.btn, button, input[type="submit"], input[type="button"],
.wp-block-button__link, .revved-btn, .revved-btn, .read-more-btn, .revved-readmore a {
    font-family: var(--revved-font-heading) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    padding: 14px 28px !important;
    border-radius: var(--revved-radius-md) !important;
    border: none !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
}

.btn-primary, .wp-block-button__link, input[type="submit"],
.revved-btn, .revved-btn, .revved-cookie-btn {
    background: var(--revved-primary) !important;
    color: var(--revved-text-primary) !important;
    box-shadow: 0 4px 14px rgba(245, 255, 61, 0.3) !important;
}

.btn-primary:hover, .wp-block-button__link:hover, input[type="submit"]:hover,
.revved-btn:hover, .revved-btn:hover, .revved-cookie-btn:hover {
    background: var(--revved-primary-dark) !important;
    color: var(--revved-text-primary) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(245, 255, 61, 0.4) !important;
}

.btn-secondary, .read-more-btn, .revved-readmore a {
    background: var(--revved-secondary) !important;
    color: var(--revved-white) !important;
}

.btn-secondary:hover, .read-more-btn:hover, .revved-readmore a:hover {
    background: var(--revved-secondary-dark) !important;
    transform: translateY(-2px) !important;
}

/* Category Badges */
.revved-category, .category-tag, .cat-links a,
.post-categories a, .revved-category-badge {
    font-family: var(--revved-font-heading) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    padding: 5px 12px !important;
    border-radius: 4px !important;
    background: var(--revved-secondary) !important;
    color: var(--revved-white) !important;
    transition: all 0.2s ease !important;
}

.revved-category:hover, .cat-links a:hover {
    background: var(--revved-secondary-dark) !important;
}

/* Override inline red styles */
.revved-category[style*="background"] {
    background: var(--revved-secondary) !important;
}

/* Form Inputs */
input[type="text"], input[type="email"], input[type="password"],
input[type="search"], input[type="url"], textarea, select {
    font-family: var(--revved-font-primary) !important;
    font-size: 15px !important;
    padding: 14px 18px !important;
    border: 2px solid var(--revved-gray-300) !important;
    border-radius: var(--revved-radius-md) !important;
    background: var(--revved-white) !important;
    transition: all 0.2s ease !important;
}

input[type="text"]:focus, input[type="email"]:focus, textarea:focus {
    border-color: var(--revved-secondary) !important;
    outline: none !important;
    box-shadow: 0 0 0 4px rgba(100, 124, 64, 0.1) !important;
}

/* Widget Title Accents - Override Red */
.widget-title::before, .widget-title::after,
.section-title::before, .revved-section-title::before {
    background: var(--revved-primary) !important;
}

/* Breaking News */
.breaking-news, .breaking-heading {
    background: var(--revved-secondary) !important;
}

/* Pagination */
.pagination .current, .page-numbers.current {
    background: var(--revved-secondary) !important;
    color: var(--revved-white) !important;
}

/* Post Cards */
.revved-post-item, .revved-post-item, .post-card, article.post {
    background: var(--revved-white) !important;
    border-radius: var(--revved-radius-lg) !important;
    overflow: hidden !important;
    box-shadow: var(--revved-shadow-sm) !important;
    transition: all 0.3s ease !important;
    border: 1px solid var(--revved-gray-200) !important;
}

.revved-post-item:hover, .revved-post-item:hover, article.post:hover {
    box-shadow: var(--revved-shadow-lg) !important;
    transform: translateY(-4px) !important;
}

.revved-thumb img, .post-thumbnail img {
    transition: transform 0.4s ease !important;
}

.revved-post-item:hover .revved-thumb img {
    transform: scale(1.05) !important;
}

/* Sidebar Widgets */
.widget, .sidebar .widget {
    background: var(--revved-white) !important;
    border-radius: var(--revved-radius-lg) !important;
    padding: 28px !important;
    margin-bottom: 24px !important;
    box-shadow: var(--revved-shadow-sm) !important;
    border: 1px solid var(--revved-gray-200) !important;
}

.widget-title, .revved-title {
    font-size: 1.1rem !important;
    font-weight: 700 !important;
    margin-bottom: 20px !important;
    padding-bottom: 14px !important;
    border-bottom: 2px solid var(--revved-gray-200) !important;
    position: relative !important;
}

.widget-title::after, .revved-title::after {
    content: "" !important;
    position: absolute !important;
    bottom: -2px !important;
    left: 0 !important;
    width: 50px !important;
    height: 2px !important;
    background: var(--revved-primary) !important;
}

/* Footer */
footer, .site-footer, .revved-footer, .revved-footer {
    background: var(--revved-dark) !important;
    color: var(--revved-gray-400) !important;
}

footer .widget-title {
    color: var(--revved-white) !important;
}

footer a {
    color: var(--revved-gray-400) !important;
}

footer a:hover {
    color: var(--revved-primary) !important;
}

footer .social-icons a:hover, .revved-footer .revved-social-icon a:hover {
    background: var(--revved-primary) !important;
    color: var(--revved-text-primary) !important;
}

/* Selection */
::selection {
    background: var(--revved-primary) !important;
    color: var(--revved-text-primary) !important;
}

/* Scrollbar */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--revved-gray-100); }
::-webkit-scrollbar-thumb { background: var(--revved-gray-400); border-radius: 5px; }
::-webkit-scrollbar-thumb:hover { background: var(--revved-secondary); }

/* Responsive */
@media (max-width: 991px) {
    h1, .h1 { font-size: 2rem !important; }
    h2, .h2 { font-size: 1.5rem !important; }
}

@media (max-width: 767px) {
    body { font-size: 16px !important; }
    h1, .h1 { font-size: 1.75rem !important; }
    h2, .h2 { font-size: 1.35rem !important; }
}