/* Custom CSS - Template módosítások */

/* UL/LI bullet pontok eltávolítása ahol van ikon */
ul li i.bi {
    margin-right: 8px;
}

ul:has(li i.bi) {
    list-style: none;
    padding-left: 0;
}

ul:has(li i.bi) li {
    list-style: none;
}

/* Általános lista stílusok ahol nincs ikon */
.single-content ul {
    padding-left: 0;
    list-style: none;
}

.single-content ul li {
    position: relative;
    padding-left: 25px;
    margin-bottom: 10px;
}

.single-content ul li i {
    position: absolute;
    left: 0;
    top: 5px;
}

/* Service details oldalon a lista stílusok */
.service-details-area ul {
    list-style: none;
    padding-left: 0;
}

.service-details-area ul li {
    margin-bottom: 12px;
    padding-left: 30px;
    position: relative;
}

.service-details-area ul li i {
    position: absolute;
    left: 0;
    top: 2px;
    color: var(--main-color);
}

/* Referencia munkáink szekció - fehér szöveg javítás */
.projects-area .section-title.yellow-title h2 {
    color: #222222 !important;
}

.projects-area .section-title.yellow-title .top-title {
    color: #666666 !important;
}

/* Desktop logó méret és pozíció javítás */
.desktop-nav .navbar-brand img {
    max-width: 90px;
    height: auto;
    position: relative;
    left: -10px;
}

/* Navbar scroll állapotban */
.sticky-on .navbar-brand img {
    max-width: 60px;
    height: auto;
}

/* Általános elemtartások javítása */
/* Referencia munkáink - képek és címek közötti távolság */
.projects-card-content {
    margin-top: 20px !important;
}

/* Referencia munkáink - gomb feletti távolság */
.projects-area .text-center {
    margin-top: 40px !important;
}

/* Miért válasszon minket - gomb alatti távolság */
.different-content .default-btn {
    margin-bottom: 30px !important;
}

/* Copyright szöveg fehér színe */
.copy-right-area p {
    color: #ffffff !important;
}

/* Footer háttérkép eltávolítása */
.footer-area {
    background-image: none !important;
}

/* Mobil reszponzív - minden balra igazított elem középre helyezése legkisebb képernyőn */
@media (max-width: 767.98px) {
    /* Hero szekció szövegek középre */
    .hero-slider-content {
        text-align: center !important;
    }

    /* Rólunk szekció szöveg középre */
    .about-content {
        text-align: center !important;
    }

    /* Miért válasszon minket szekció szöveg középre */
    .different-content {
        text-align: center !important;
    }

    /* Szolgáltatások kártyák szöveg középre */
    .single-services-card {
        text-align: center !important;
        margin-bottom: 30px !important;
    }

    /* Projekt kártyák szöveg középre */
    .projects-card-content {
        text-align: center !important;
    }

    /* Ingyenes konzultáció szekció középre */
    .consultation-content {
        text-align: center !important;
    }

    /* Footer elemek középre */
    .single-footer-widget {
        text-align: center !important;
    }

    /* Lista elemek középre igazítása mobilon */
    .different-content ul,
    .consultation-content ul {
        display: inline-block;
        text-align: left;
    }

    /* Ingyenes felmérés gomb középre igazítása és felső távolság */
    .consultation-content .default-btn {
        display: block !important;
        margin: 30px auto 0 auto !important;
        text-align: center !important;
        width: fit-content !important;
    }
}

/* Navbar közepes képernyők optimalizálása - 1200px és 1400px között */
@media only screen and (min-width: 1200px) and (max-width: 1400px) {
    .desktop-nav .navbar .navbar-nav .nav-item a {
        margin-left: 10px;
        margin-right: 10px;
    }

    .desktop-nav .navbar .navbar-nav .nav-item:first-child a {
        margin-left: 15px;
    }
}

/* Navbar mobile breakpoint módosítás - 1199px alatt hamburger menü */
@media only screen and (max-width: 1199px) {
    .navbar-area {
        background-color: var(--heading-color);
        box-shadow: var(--box-shadow);
        padding-top: 15px;
        padding-bottom: 15px;
        z-index: 2;
    }

    .navbar-area::before {
        display: none;
    }

    .navbar-area.is-sticky {
        background-color: var(--black-color) !important;
        padding-top: 15px;
        padding-bottom: 15px;
    }

    .mobile-responsive-nav {
        display: block;
    }

    .mobile-responsive-nav .mobile-responsive-menu {
        position: relative;
    }

    .mobile-responsive-nav .mobile-responsive-menu.mean-container .mean-nav {
        margin-top: 50px;
        background-color: var(--white-color);
    }

    .mobile-responsive-nav .mobile-responsive-menu.mean-container .mean-nav ul {
        font-size: 15px;
        border: none !important;
    }

    .mobile-responsive-nav .mobile-responsive-menu.mean-container .mean-nav ul li a {
        color: var(--black-color);
        border-top-color: #dbeefd;
        text-transform: capitalize;
    }

    .mobile-responsive-nav .mobile-responsive-menu.mean-container .mean-nav ul li a i {
        display: none;
    }

    .mobile-responsive-nav .mobile-responsive-menu.mean-container .mean-nav ul li a.mean-expand {
        width: 100%;
        height: 28px;
        text-align: right;
        padding: 11px !important;
        background: rgba(0,0,0,0) !important;
        border-left: none !important;
        border-bottom: none !important;
    }

    .mobile-responsive-nav .mobile-responsive-menu.mean-container .mean-nav ul li a.active {
        color: var(--main-color);
    }

    .mobile-responsive-nav .mobile-responsive-menu.mean-container .mean-nav ul li li a {
        font-size: 15px;
    }

    .mobile-responsive-nav .mobile-responsive-menu.mean-container .navbar-nav {
        box-shadow: 0 7px 13px 0 rgba(0,0,0,.1);
        margin-top: 0 !important;
        max-height: 50vh;
        overflow-y: scroll;
    }

    .mobile-responsive-nav .mobile-responsive-menu.mean-container .navbar-nav::-webkit-scrollbar {
        width: 7px;
    }

    .mobile-responsive-nav .mobile-responsive-menu.mean-container .navbar-nav::-webkit-scrollbar-track {
        background: #f1f1f1;
    }

    .mobile-responsive-nav .mobile-responsive-menu.mean-container .navbar-nav::-webkit-scrollbar-thumb {
        background: #888;
    }

    .mobile-responsive-nav .mobile-responsive-menu.mean-container .navbar-nav::-webkit-scrollbar-thumb:hover {
        background: #555;
    }

    .mobile-responsive-nav .mean-container a.meanmenu-reveal {
        top: 0;
        padding: 0;
        width: 35px;
        height: 30px;
        padding-top: 13px;
        color: var(--main-color);
    }

    .mobile-responsive-nav .mean-container a.meanmenu-reveal span {
        background: var(--main-color);
        height: 4px;
        margin-top: -6px;
        border-radius: 0;
        position: relative;
        top: 8px;
    }

    .mobile-responsive-nav .mean-container .mean-bar {
        background: rgba(0,0,0,0);
        position: absolute;
        z-index: 999;
        padding: 0;
    }

    .mobile-responsive-nav .logo {
        position: relative;
        width: 130px;
        z-index: 999;
        max-width: 85px;
    }

    .desktop-nav {
        display: none;
    }

    .others-option-for-responsive {
        display: block;
    }

    .top-header-area ul li {
        font-size: 14px;
        margin-right: 0;
    }

    .header-area {
        position: initial;
        background-color: #111;
    }

    .top-header-area {
        border-bottom: 1px solid #313131;
    }

    .top-header-area ul {
        float: unset;
        text-align: center;
    }
}