/* ==========================================
   THEME: Dark Green (Matrix)
   ========================================== */

:root {
    --primary: #00FF88;
    --primary-dark: #00CC6A;
    --primary-light: #E0FFF0;
    --primary-rgb: 0, 255, 136;
    --bg-body: #0A0F0A;
    --bg-card: #111811;
    --bg-card-hover: #1A231A;
    --bg-navbar: rgba(10, 15, 10, 0.95);
    --bg-footer: #050805;
    --text-primary: #FFFFFF;
    --text-secondary: #88AA88;
    --border-color: #2A3D2A;
}

/* Override Bootstrap .text-warning to use theme primary color */
.text-warning {
    color: var(--primary) !important;
}

/* Navbar brand color */
.navbar-brand {
    color: var(--primary) !important;
}

/* Links */
a {
    color: var(--primary);
}

a:hover {
    color: var(--primary-light);
}

/* Card title links */
.card-title a:hover {
    color: var(--primary) !important;
}

/* Badge kategori */
.badge-kategori {
    background-color: rgba(var(--primary-rgb), 0.2) !important;
    color: var(--primary) !important;
}

/* Buttons */
.btn-warning {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
    color: #000 !important;
}

.btn-warning:hover {
    background-color: var(--primary-dark) !important;
    border-color: var(--primary-dark) !important;
}

.btn-outline-warning {
    border-color: var(--primary) !important;
    color: var(--primary) !important;
}

.btn-outline-warning:hover {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
    color: #000 !important;
}

/* Sidebar */
.sidebar .card-title {
    color: var(--primary) !important;
}

.sidebar .text-warning {
    color: var(--primary) !important;
}

/* Article headings */
.article-content h2,
.article-content h3,
.article-content h4,
.article-content h5,
.article-content h6 {
    color: var(--primary) !important;
}

.article-content blockquote {
    border-left-color: var(--primary) !important;
}

/* Meta info icons */
.meta-info i {
    color: var(--primary) !important;
}

/* Footer */
footer h5,
footer h6 {
    color: var(--primary) !important;
}

/* Breadcrumb */
.breadcrumb-item.active {
    color: var(--primary) !important;
}

.breadcrumb-item a:hover {
    color: var(--primary) !important;
}

/* Carousel indicators */
.carousel-indicators button {
    border-color: var(--primary) !important;
}

.carousel-indicators button.active {
    background-color: var(--primary) !important;
}

/* Rating stars */
.rating-stars {
    color: var(--primary) !important;
}

/* Alert */
.alert-warning {
    background-color: rgba(var(--primary-rgb), 0.1) !important;
    border-color: var(--primary) !important;
    color: var(--primary) !important;
}

/* Scroll to top */
.scroll-top {
    background-color: var(--primary) !important;
    box-shadow: 0 4px 15px rgba(var(--primary-rgb), 0.3) !important;
}

/* Pagination */
.pagination .page-item.active .page-link {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
}

.pagination .page-link:hover {
    background-color: rgba(var(--primary-rgb), 0.2) !important;
    border-color: var(--primary) !important;
    color: var(--primary) !important;
}

/* CTA Box */
.cta-box {
    border-color: var(--primary) !important;
}

.cta-box h4 {
    color: var(--primary) !important;
}

/* Share buttons hover */
.share-buttons a:hover {
    background-color: var(--primary) !important;
}

/* Social links hover */
footer .social-links a:hover {
    background-color: var(--primary) !important;
}

/* Form focus */
.form-control:focus,
.form-select:focus {
    border-color: var(--primary) !important;
    box-shadow: 0 0 0 0.2rem rgba(var(--primary-rgb), 0.25) !important;
}

/* Sidebar list hover */
.sidebar .list-group-item:hover {
    background-color: rgba(var(--primary-rgb), 0.1) !important;
    color: var(--primary) !important;
}

/* Popular item hover */
.popular-item h6 a:hover {
    color: var(--primary) !important;
}

/* List unstyled links */
.list-unstyled a:hover {
    color: var(--primary) !important;
}

/* Tags icon */
.article-tags i {
    color: var(--primary) !important;
}

/* Background warning override */
.bg-warning {
    background-color: var(--primary) !important;
}

.badge.bg-warning {
    background-color: var(--primary) !important;
    color: #000 !important;
}