@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');

body { font-family: 'Poppins', sans-serif; line-height: 1.6; color: #333; margin: 0; padding: 0; overflow-x: hidden; background-color: #f8f9fa; }
.text-primary { color: #003459 !important; }
.container { max-width: 1200px; }

.navbar { z-index: 1030; background-color: #fff; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05); }
.navbar-brand .logo-img { height: 90px; width: auto; transition: all 0.3s ease; }
.navbar-brand .logo-img:hover { transform: scale(1.05); }
.nav-link { font-weight: 500; color: #333 !important; position: relative; transition: color 0.3s ease; }
.nav-link::after { content: ''; position: absolute; left: 0; bottom: -5px; width: 0; height: 2px; background-color: #003459; transition: width 0.3s ease; }
.nav-link:hover::after { width: 100%; }
.lang-switcher button { background-color: transparent; border-color: #343a40; color: #343a40; font-weight: bold; border-radius: 5px; transition: all 0.3s ease; }
.lang-switcher button:hover, .lang-switcher button.active { background-color: #343a40; color: white; border-color: transparent; }

#mainSlider { height: 100vh; background-image: url('img/slbg.jpg'); background-size: cover; background-position: center; background-attachment: fixed; border-radius: 0 0 1rem 1rem; }
#mainSlider .carousel-inner, #mainSlider .carousel-item { height: 100%; }
.carousel-item { position: relative; min-height: 300px; }
.slide-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to bottom, rgba(0, 52, 89, 0.5) 0%, rgba(0, 52, 89, 0.9) 100%); z-index: 1; }
.slider-text-container { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; pointer-events: none; }
.slider-content { max-width: 800px; width: 100%; padding-top: 5rem; padding-bottom: 5rem; pointer-events: all; }
.slider-content h1.display-4 { font-size: 3.5rem; margin-bottom: 1.5rem; font-weight: 700; }
.slider-content p.lead { font-size: 1.25rem; margin-bottom: 2rem; font-weight: 300; }

#accreditation-carousel-section { background-color: #003459; padding: 7rem 1rem; position: relative; overflow: hidden; }
#accreditation-carousel-section .display-5 { color: #fff; font-size: 2.6rem; font-weight: 600; }
#accreditation-carousel-section .input-group { max-width: 500px; margin: 2rem auto 0 auto; box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15); transition: transform 0.3s ease, box-shadow 0.3s ease; border-radius: 0.75rem; position: relative; }
#accreditation-carousel-section .form-control { border-radius: 0.75rem 0 0 0.75rem; padding: 0.9rem 1.2rem; font-size: 1rem; }
#accreditation-carousel-section .btn { border-radius: 0 0.75rem 0.75rem 0; padding: 0.9rem 1.2rem; background-color: #f8f9fa; border-color: #f8f9fa; color: #003459; transition: all 0.3s ease; }
#accreditation-carousel-section .btn:hover { background-color: #e2e6ea; border-color: #dae0e5; }

.search-results-container { position: absolute; top: calc(100% + 10px); left: 0; right: 0; z-index: 2000; background-color: #fff; border-radius: 0 0 0.75rem 0.75rem; box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15); max-height: 250px; overflow-y: auto; display: none; }
.search-results-container .list-group-item { border: none; border-top: 1px solid #eee; transition: background-color 0.2s ease, color 0.2s ease; }
.search-results-container .list-group-item:first-child { border-top: none; }
.search-results-container .list-group-item:hover { background-color: #f1f1f1; color: #003459; }

#cards-section { margin-top: 5rem; margin-bottom: 5rem; }
.card-style { background: linear-gradient(135deg, #ffffff 0%, #f9f9f9 100%); border: none; border-radius: 1rem; box-shadow: 0 4px 8px rgba(24, 17, 17, 0.05); padding: 2rem; height: 100%; display: flex; flex-direction: column; justify-content: space-between; transition: transform 0.3s ease, box-shadow 0.3s ease; }
.card-style:hover { transform: translateY(-10px); box-shadow: 12px 24px rgba(24, 17, 17, 0.15); }
.btn.btn-dark { transition: background-color 0.3s ease, transform 0.2s ease; border-radius: 0.5rem; }
.btn.btn-dark:hover { background-color: #222; transform: scale(1.02); }
.card-style h1, .card-style h2 { font-weight: 700; font-size: 1.8rem; margin-bottom: 1rem; text-align: center; color: #222; }
.card-style p { color: #555; margin-bottom: 1.5rem; text-align: left; font-weight: 400; }

footer { background-color: #343a40; color: #f8f9fa; padding: 2rem 0; }
footer h5 { color: #fff; margin-bottom: 1rem; }
footer p { margin-bottom: 0.5rem; }

.map-responsive { overflow: hidden; padding-bottom: 56.25%; position: relative; height: 0; }
.map-responsive iframe { left: 0; top: 0; height: 100%; width: 100%; position: absolute; border-radius: 0.5rem; }
[data-translate="descriptionText"] { max-width: 720px; }

#mobile-search-results { position: absolute; z-index: 1050; width: 100%; top: 100%; left: 0; background-color: white; box-shadow: 0 4px 10px rgba(0,0,0,0.1); }
#mobile-search-form, #desktop-search-form { position: relative; }
#desktop-search-results { position: absolute; top: 100%; left: 0; width: 100%; z-index: 1050; background-color: #fff; box-shadow: 0 4px 8px rgba(0,0,0,0.1); border: 1px solid #ddd; border-radius: 0.375rem; }

.details-container { margin-top: 50px; margin-bottom: 50px; }
.details-card { background-color: #ffffff; border-radius: 8px; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08); }
.details-card .card-header { background-color: #f1f5f9; padding: 1.5rem; border-bottom: 1px solid #e2e8f0; border-radius: 8px 8px 0 0; }
.details-card h2 { color: #212529; }
.badge-active { background-color: #28a745; }
.info-table th { width: 150px; color: #6c757d; font-weight: 500; }
.info-table td { color: #495057; }
.info-table tbody tr:nth-child(odd) { background-color: #f7f9fa; }

.certified-entity-container { max-width: 900px; margin: 40px auto; background-color: #fff; padding: 30px; border-radius: 8px; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); }
.certified-entity-title { font-size: 1.5rem; color: #333; border-bottom: 1px solid #e0e0e0; padding-bottom: 10px; margin-bottom: 20px; font-weight: 500; }
.entity-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 30px; }
.entity-info { display: flex; align-items: center; }
.entity-logo { width: 80px; height: 80px; margin-right: 20px; object-fit: contain; }
.entity-text-details h2 { margin: 0; font-size: 1.8rem; color: #2c3e50; font-weight: 600; }
.entity-text-details p { margin: 5px 0 0; color: #7f8c8d; font-size: 0.95rem; display: flex; align-items: center; }
.entity-flag { width: 20px; height: 15px; vertical-align: middle; margin-right: 8px; border: 1px solid #ddd; }
.qr-code-container { text-align: center; }
.qr-code { width: 100px; height: 100px; }
.qr-code-link { display: block; margin-top: 5px; color: #007bff; text-decoration: none; font-size: 0.9rem; }

.certifications-section { margin-top: 40px; }
.certifications-section p.subtitle { color: #7f8c8d; margin-top: -10px; margin-bottom: 20px; font-size: 0.95rem; }
.certification-card { border: 1px solid #e0e0e0; border-radius: 1rem; padding: 0; background-color: #fff; margin-top: 25px; margin-bottom: 2rem; overflow: hidden; }
.certification-card h3 { margin: 0 0 10px; font-size: 1.6rem; color: #333; font-weight: 500; }
.certification-card p { margin: 5px 0; color: #555; line-height: 1.5; font-size: 1.05rem; }
.certification-card a { text-decoration: none; }
.certification-content { padding: 0.5rem; }
.certification-status p { font-weight: 500; font-size: 1.25rem; }

.view-certificate-btn { background-color: #007bff; color: #fff; border: none; padding: 12px 20px; border-radius: 5px; font-size: 1rem; cursor: pointer; margin-top: 20px; display: inline-block; text-decoration: none; transition: background-color 0.2s; }
.view-certificate-btn:hover { background-color: #0056b3; }
.btn-outline-primary { border-width: 2px; font-weight: 500; border-radius: 0.5rem; }
.slider-btn { font-size: 1.1rem; padding: 0.6rem 1.2rem; }
.wave-header svg { display: block; height: 60px; width: 100%; }
.search-wrapper { position: relative; }
.search-wrapper input { height: 44px; font-size: 1rem; }
.search-btn-inside { position: absolute; top: 40%; right: 12px; transform: translateY(-50%); border: none; background: none; color: #333; font-size: 1.2rem; padding: 0; cursor: pointer; line-height: 1; }
.responsive-margin { margin-right: 0; }
.about-text { text-align: justify; }
.text-start.mt-4.px-3 p { color: white; font-size: 18px; }

.company-card { border: 1px solid #ddd; border-radius: 10px; background-color: #fff; padding: 20px; box-shadow: 0 4px 10px rgba(0,0,0,0.05); transition: all 0.3s ease; display: flex; flex-direction: column; height: 100%; }
.company-card:hover { transform: translateY(-5px); }
.logo-container { height: 80px; display: flex; align-items: center; justify-content: center; margin-bottom: 15px; }
.company-logo { max-height: 60px; max-width: 100%; object-fit: contain; }
.certification-block { border-top: 1px solid #ccc; padding-top: 15px; margin-top: 15px; flex-grow: 1; display: flex; flex-direction: column; }
.btn-certificate-wrapper { margin-top: auto; text-align: center; }
.btn-certificate { background-color: #003459; color: #fff; border: none; padding: 8px 16px; font-size: 0.9rem; transition: background-color 0.2s; width: 100%; border-radius: 5px; display: inline-block; text-decoration: none; }
.btn-certificate:hover { background-color: #001f33; color: #fff; }

.company-link { display: inline-block; }
.company-title-hover { transition: color 0.2s ease-in-out; }
.company-link:hover .company-title-hover { color: #003459 !important; }

.custom-indicators { bottom: -10px; margin-bottom: 0; }
.custom-indicators button { width: 8px !important; height: 8px !important; background-color: #ccc !important; border-radius: 50%; margin: 0 5px !important; border: none !important; opacity: 0.5; transition: all 0.3s ease; }
.custom-indicators button.active { background-color: #003459 !important; opacity: 1; transform: scale(1.3); }

@media (min-width: 992px) {
    .navbar-toggler, .btn[data-bs-target="#searchCollapse"] { display: none !important; }
    .navbar-collapse { display: flex !important; align-items: center; width: 100%; justify-content: flex-end; }
    .header-desktop-items { display: flex !important; align-items: center; flex-grow: 1; gap: 2rem; justify-content: space-between; }
    .header-search-container { position: relative; flex-grow: 1; max-width: 500px; margin-left: 2rem; }
    .header-search-container .form-control { border-top-right-radius: 0; border-bottom-right-radius: 0; }
    .header-search-container .btn { border-top-left-radius: 0; border-bottom-left-radius: 0; }
    .header-search-container .search-results-container { position: absolute; top: 100%; left: 0; right: 0; z-index: 9999; background-color: #fff; border-radius: 0 0 0.75rem 0.75rem; box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15); max-height: 250px; overflow-y: auto; display: none; }
    .navbar-nav { flex-direction: row; gap: 0.3rem; margin: 0 !important; padding: 0 !important; }
    .lang-switcher { display: flex; gap: 0.5rem; }
}

@media (min-width: 430px) { .responsive-margin { margin-right: 112px; } }

@media (max-width: 991.98px) {
    .navbar-brand .logo-img { height: 70px; }
    .navbar-toggler, .btn[data-bs-target="#searchCollapse"] { padding: 0.35rem 0.5rem; font-size: 1.1rem; border: 1px solid #343a40; border-radius: 5px; transition: all 0.3s ease; }
    .navbar-toggler:hover, .btn[data-bs-target="#searchCollapse"]:hover { background-color: #343a40; color: #fff; }
    .btn.btn-outline-dark { padding: 0.35rem 0.5rem; }
    .btn.btn-outline-dark .fas.fa-search { font-size: 1.1rem; }
    input.form-control::placeholder { font-size: 0.8rem; }
    .navbar-collapse { text-align: center; background-color: #f8f9fa; position: absolute; top: 100%; left: 0; width: 100%; box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, .1); padding-bottom: 1rem; }
    .navbar-nav { flex-direction: column; gap: 0.5rem; margin-bottom: 1rem; flex-grow: 1; justify-content: center; }
    .navbar-nav .nav-link { width: 100%; padding: 0.5rem 0; }
    .lang-switcher { display: flex; }
    .lang-switcher button { width: auto; padding: 0.1rem 0.3rem; font-size: 0.7rem; }
    .header-desktop-items { display: none !important; }
    .slider-content h1.display-4 { font-size: 2.5rem; }
    .slider-content p.lead { font-size: 1.1rem; }
    #mainSlider { height: auto; min-height: auto; }
    .carousel-item { min-height: 470px; height: 470px; }
    .slider-text-container { padding-top: 2rem; padding-bottom: 2rem; }
    .slider-content { padding-top: 1rem; padding-bottom: 1rem; }
}

@media (max-width: 767.98px) {
    .slider-content h1.display-4 { font-size: 2rem; margin-bottom: 0.5rem; }
    .slider-content p.lead { font-size: 0.9rem; margin-top: 0.5rem; margin-bottom: 1rem; }
    .carousel-indicators { bottom: 20px; z-index: 15; }
    .carousel-indicators button { height: 5px; }
    .carousel-control-prev, .carousel-control-next { opacity: 0.7; width: 10%; }
    .carousel-control-prev-icon, .carousel-control-next-icon { width: 1.5rem; height: 1.5rem; }
    #cards-section { margin-top: 1rem; }
    .carousel-item { min-height: 400px; height: 400px; }
    .wave-mobile { height: auto; }
    #reference-list .carousel-item { min-height: auto !important; height: auto !important; }
    #reference-list .btn-certificate-wrapper { margin-top: 1.5rem !important; padding-bottom: 2.5rem !important; }
}

@media (max-width: 576px) {
    #accreditation-carousel-section { padding: 5rem 1rem 4rem; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; }
    #accreditation-carousel-section .display-5 { font-size: 1.7rem; margin-bottom: 1rem; }
    #accreditation-carousel-section p { max-width: 100%; margin: 0.5rem 0 2rem; }
    #accreditation-carousel-section .input-group { max-width: 100%; width: 100%; flex-direction: column; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); padding: 0; border-radius: 0.75rem; }
    #accreditation-carousel-section .form-control { width: 100%; border-radius: 0.75rem; margin-bottom: 0.75rem; z-index: 1; }
    #accreditation-carousel-section .btn { width: 100%; border-radius: 0.75rem; margin-bottom: 0; }
    .search-results-container { position: absolute; top: auto; margin-top: 0.75rem; left: 0; right: 0; }
    .card-style { padding: 1.5rem; }
    .card-style h2 { font-size: 1.5rem; }
    .card-style div[data-translate] { font-size: 0.9rem; }
    .certification-status p { font-size: 1rem; }
}

@media (max-width: 480px) {
    .slider-btn { font-size: 0.9rem; padding: 0.4rem 0.9rem; margin-bottom: 25px; }
}

@media (max-width: 430px) {
    #desktop-main-search-results { display: block !important; position: relative !important; z-index: 10; max-height: 300px; overflow-y: auto; }
}

#desktop-search-results:empty,
#desktop-main-search-results:empty,
#mobile-header-search-results:empty,
#mobile-main-search-results:empty {
    display: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}