/**
 * Custom Modifications for Sonic Website
 * - Hide header top bar (phone, email, facebook)
 * - Hide Contact navigation tab
 * - Hide floating contact icons
 * - Hide social media icons
 * - Replace logo with text
 */

/* Hide the entire header top bar */
.header__top {
    display: none !important;
}

/* Hide Contact navigation link */
.header__menu a[href*="lien-he"],
.header__menu a[href*="contact"],
.footer__nav a[href*="lien-he"],
.footer__nav a[href*="contact"] {
    display: none !important;
}

/* Hide floating contact icons (phone, email, zalo) - positioned fixed */
.fixed-scroll,
.contact-fixed,
.fixed-contact,
.floating-contact,
.contact-float,
.position-fixed.d-flex.flex-column {
    display: none !important;
}

/* Hide social media icons in footer */
.footer__social,
.footer__social-list,
.social-icons,
.footer .social {
    display: none !important;
}

/* Hide Facebook page widget in footer */
.facebook-page,
.fb-page {
    display: none !important;
}

/* Hide "Follow now" section in footer */
.footer__content-item:has(.facebook-page) {
    display: none !important;
}

/* Hide Ho Chi Minh City Office section in footer */
.footer__content-item:has(h3:contains("Ho Chi Minh")),
.footer__content-item h3:contains("Ho Chi Minh") {
    display: none !important;
}

/* Alternative: Hide first office section (HCM) */
.footer__content .footer__content-item:nth-child(2) {
    display: none !important;
}

/* Hide Hanoi Office section in footer */
.footer__content .footer__content-item:nth-child(3) {
    display: none !important;
}

/* Hide Headquarters section in footer */
.footer__content .footer__content-item:nth-child(4) {
    display: none !important;
}

/* Hide any back-to-top or floating buttons with social icons */
.back-to-top + div,
.social-float {
    display: none !important;
}

/* Hide "SOLUTIONS INFORMATION TECHNOLOGY" text in banner */
.banner__subtitle,
#bannerSubtitle {
    display: none !important;
}

/* Hide Contact page content */
body[class*="contact"] main,
body[class*="lien-he"] main {
    display: none !important;
}

/* Hide entire Hotline section/box */
.connect__grid .connect__item:first-child,
.connect__item:nth-child(1) {
    display: none !important;
}

/* Alternative selector for Hotline box */
.connect__content:has(span:contains("Hotline")) {
    display: none !important;
}

.connect__item:has(.connect__content span:contains("Hotline")) {
    display: none !important;
}

/* Replace logo image with text "SONIC" */
.header__logo img,
.footer__logo img {
    display: none !important;
}

.header__logo::before,
.footer__logo::before {
    content: "SONIC";
    font-size: 24px;
    font-weight: bold;
    color: #333;
    display: inline-block;
}

/* Hide Sonic logo in About Us page */
.about__us-left .img img[src*="logo.png"],
img[src*="template/images/logo.png"] {
    display: none !important;
}

.about__us-left .img::before {
    content: "SONIC";
    font-size: 48px;
    font-weight: bold;
    color: #18ACE3;
    display: block;
    text-align: center;
}

/* Adjust header spacing after removing top bar */
.header__main {
    padding-top: 15px;
}

/* Banner background image removed - now using img tag in HTML */

/* Banner layout - text on left, shield image full background */
.banner {
    position: relative;
    overflow: hidden;
    min-height: 600px;
}

.banner__content {
    position: relative;
    z-index: 2;
    padding: 60px 0;
}

.banner__subtitle {
    font-size: 16px;
    color: #18ACE3;
    font-weight: 600;
    margin-bottom: 20px;
    line-height: 1.5;
    letter-spacing: 1px;
}

.banner__shield-image {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 50%;
    max-width: 700px;
    z-index: 1;
}

.banner__shield-image img {
    width: 100%;
    height: auto;
    object-fit: contain;
}

/* Adjust banner title for better spacing */
.banner__title {
    font-size: 64px;
    line-height: 1.2;
}

/* Hide shield image on mobile and tablets */
@media (max-width: 991px) {
    .banner__shield-image {
        display: none;
    }

    .banner {
        min-height: 500px;
    }

    .banner__title {
        font-size: 48px;
    }
}