﻿.category-btn {
    background-color: transparent;
    border: 2px solid #D1D5DB;
    border-radius: 9999px;
    padding: 8px 20px;
    font-size: 1rem;
    color: #374151;
    font-weight: 500;
    transition: all 0.3s ease;
    margin: 6px;
}

    .category-btn:hover {
        background-color: #F3F4F6;
    }

    .category-btn.active {
        background-color: #f0632f;
        border-color: #f0632f;
        color: white;
    }

.blog-card {
    background-color: #fff;
    border-radius: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
    padding: 24px;
    width: 300px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    text-align: center;
    margin-right: 20px;
    border: 1px solid #ddd;
}
a .author-info {
    text-decoration: none;
    color: #6B7280;
}

    .blog-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08);
    }

    .blog-card h5 {
        font-size: 20px;
        font-weight: 700;
        color: #111827;
        margin-bottom: 10px;
        text-align: left;
        min-height: 120px;
    }

    .blog-card a {
        text-decoration:none;
    }

    .blog-card .comp-description {
        font-size: 14px;
        color: #6B7280;
        margin-bottom: 12px;
        font-weight: 400;
        text-align: left;
    }
.blog-card .comp-description p {
    min-height: 70px;
}
    .blog-card img {
        width: 100%;
        height: 180px;
        object-fit: cover;
        border-radius: 8px;
        margin-bottom: 16px;
    }

    .blog-card svg {
        width: 16px;
        height: 16px;
        margin-right: 8px;
        color: #10B981;
    }

    .blog-card .category-label {
        color: #F97316;
        font-weight: 600;
        font-size: 14px;
        text-transform: uppercase;
        margin-bottom: 6px;
        text-align: left;
        display: block;
        min-height: 21px;
    }


.heroSlider-blogs .prev, .heroSlider-blogs .next {
    display: block !important;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    cursor: pointer;
}

.heroSlider-blogs .fa-chevron-circle-right:before {
    content: "\f138";
    color: #6B7280; 
    transition: color 0.3s ease;
}

.heroSlider-blogs .fa-chevron-circle-right:hover:before {
    color: #f0632f;
}
.heroSlider-blogs .fa-chevron-circle-left:before {
    content: "\f137";
    color: #6B7280;
    transition: color 0.3s ease;
}

.heroSlider-blogs .fa-chevron-circle-left:hover:before {
    color: #f0632f;
}
.heroSlider-blogs .prev {
    left: -20px;
}

.heroSlider-blogs .next {
    right: -20px;
}
@media (max-width: 768px) {
    .heroSlider-blogs .prev,
    .heroSlider-blogs .next {
        position: static;
        transform: none;
        margin: 0 10px;
    }

    .slider-nav-mobile {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 20px;
    }
    .blog-card h5 {
        min-height: 200px;
    }
    .blog-card .comp-description p {
        min-height: 130px;
    }
}
.blog-card .avatar{
    width:32px;
    height:32px;
    margin-bottom:0px;
    margin-right:5px;
}
.text-orange {
    font-weight: 700;
    color: #f0632f;
    text-decoration:none;
    margin-top:10px;
}
    .text-orange:hover {
        color: #f0632f;
    }
    .text-right-orange:hover {
        text-decoration: none;
        color: #f0632f; 
    }
