/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/

/* JobBoard Menus */
#menu-nganh-nghe,
#menu-vi-tri {
    max-height: 500px;
    overflow-y: auto;
    border: 1px solid #ddd;
    /* Optional: adds a border to look like a box */
    padding: 10px;
    background: #fff;
    border-radius: 4px;
}

/* Header Menu Icons */
.header-nav .nav-top-link {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    line-height: 1.2;
    padding-top: 5px;
    /* Adjust spacing */
}

.header-nav .nav-top-link::before {
    font-family: "FontAwesome";
    /* Try generic FontAwesome or "Font Awesome 5 Free" depending on theme version */
    font-weight: 900;
    font-size: 20px;
    color: #dc3545 !important;
    /* Force color */
    margin-bottom: 5px;
    display: block;
    opacity: 1 !important;
    transition: none !important;
    /* Stop transition effects on icon */
}

/* Fallback for FA naming in Flatsome */
@media (min-width: 0) {
    .header-nav .nav-top-link::before {
        font-family: "Font Awesome 5 Free";
    }
}

/* Fix Hover Issue: Ensure icon stays visible */
.header-nav .nav-top-link:hover::before,
.header-nav .nav-top-link.active::before,
.header-nav .nav-top-link:focus::before,
.current-menu-item>.nav-top-link::before {
    opacity: 1 !important;
    display: block !important;
    visibility: visible !important;
    color: #dc3545 !important;
    transform: none !important;
}

.trang-chu>.nav-top-link::before {
    content: "\f015";
}

/* Home */
.new-jobs>.nav-top-link::before {
    content: "\f0e7";
}

/* Bolt */
.ung-vien>.nav-top-link::before {
    content: "\f2c2";
}

/* ID Card */
.nha-tuyen-dung>.nav-top-link::before {
    content: "\f0a1";
}

/* Bullhorn */
.tin-tuc>.nav-top-link::before {
    content: "\f1ea";
}

/* Newspaper */
.lien-he>.nav-top-link::before {
    content: "\f095";
}

/* Phone */

/* Global Hide Divider */
.is-divider {
    display: none !important;
}

/* Blog Post Styles */
.box-blog-post .post-title,
.box-blog-post .post-title a {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.3;
    max-height: 2.6em;
    /* 1.3 * 2 */
}

/* Ensure title takes up space of 2 lines even if short */
.box-blog-post .post-title {
    min-height: 2.6em;
}

.box-blog-post .from_the_blog_excerpt {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.5;
    max-height: 3em;
    /* 1.5 * 2 */
}

/* Blog Post Card Styles */
.box-blog-post {
    border-radius: 10px;
    overflow: hidden;
    transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1), transform 0.3s ease;
    border: 1px solid #f0f0f0;
    background: #fff;
    height: 100%;
}

.box-blog-post:hover {
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
    transform: translateY(-2px);
}

.box-blog-post .box-image {
    border-radius: 10px 10px 0 0;
    overflow: hidden;
}

.box-blog-post .box-image .image-cover {
    border-radius: 10px 10px 0 0;
}

.box-blog-post .box-text {
    padding: 15px;
}

/* Single Blog Header Styles */
.entry-header-text {
    text-align: left !important;
}

.entry-header-text.text-center {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.entry-header-text .entry-category {
    margin-bottom: 10px;
}

.entry-header-text .entry-category a {
    display: inline-block;
    background: #f3f4f6;
    color: #4b5563;
    padding: 4px 12px;
    border-radius: 99px;
    text-decoration: none;
    font-weight: 500;
    transition: all 0.2s;
}

.entry-header-text .entry-category a:hover {
    background: #e5e7eb;
    color: #111;
}

.entry-header-text .entry-title {
    text-align: left;
    margin-bottom: 15px;
}

.entry-header-text .entry-meta {
    text-transform: none !important;
    text-align: left;
    letter-spacing: normal;
}

/* Single Post Content Images */
.entry-content.single-page img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    border-radius: 10px;
    height: auto;
    max-width: 100%;
}


/* Contact Box Styles */
.box-lien-he {
    background: #afa5a514;
    padding: 10px;
    border: 1px solid #eee;
    border-radius: 6px;
    /* "Soft" radius */
    margin: 2px;
}

.box-lien-he h3 {
    font-weight: 700;
    color: #dc3545;
    /* rgb(220, 53, 69) */
    font-size: 20px;
    line-height: 30px;
    margin-bottom: 0;
}

.box-lien-he p {
    font-weight: 400;
    color: #dc3545;
    /* rgb(220, 53, 69) */
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 0;
    /* Tight spacing often looks better here */
}

/* Add Icons to Contact Boxes */
.box-lien-he {
    position: relative;
    padding-left: 60px !important;
    /* Space for icon */
}

.box-lien-he::before {
    font-family: "FontAwesome";
    font-weight: 900;
    /* For FontAwesome Solid icons */
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 32px;
    color: #dc3545;
}

/* Specific Icons */
.box-lien-he.phone::before {
    content: "\f095";
    /* fa-phone */
}

.box-lien-he.hotline::before {
    content: "\f2a0";
    /* fa-phone-volume */
}

.box-lien-he.email::before {
    content: "\f0e0";
    /* fa-envelope */
}

.absolute-footer {
    display: none !important;
}

@media only screen and (max-width: 48em) {
    /*************** ADD MOBILE ONLY CSS HERE  ***************/


}

/* Job Icons Fix */
.icon-clock,
.icon-money,
.icon-map-pin {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-style: normal;
}

.icon-clock::before {
    content: "\f017";
}

.icon-money::before {
    content: "\f0d6";
}

/* Money Bill */
.icon-map-pin::before {
    content: "\f3c5";
}

/* Map Marker */
.box-logo-cong-ty {
    border-radius: 10px;
    border: 1px solid rgb(0, 112, 192);
    text-align: center;
}

.box-logo-cong-ty .box-image {
    display: flex;
    justify-content: center;
    padding: 10px;
}

.box-logo-cong-ty .box-image img {
    width: 80px;
    height: 80px;
    object-fit: contain;
}

.box-logo-cong-ty .box-text {
    padding: 0 15px;
}

.box-logo-cong-ty .box-text h4 {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin: 0;
}

.row-slider-image-box .flickity-page-dots {
    display: none;
}

border-10 img {
    border-radius: 10px;
}