/* ===== INFO BAR ===== */
.info-bar-container {
    display: flex;
    flex-wrap: wrap;
    height: 140px;
}
.info-left-wrapper {
    position: relative;
 
}

.info-deco {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height:38px; /* a dekorációs sáv magassága */
    background-image: url('../../images/greek-pattern.png');
    background-repeat: repeat-x;  /* vízszintesen ismétlődik */
    background-position: top left;
    background-size: auto 100%;   /* arányosan kitölti a magasságot */
    z-index: 1;                  /* a tartalom fölött, ha kell */
    opacity: 0.63
}
/* Bal oldal */
.info-left {
    background-color: #aa7e0d;
    width: 70%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 0 2rem;
    gap: 2rem;
    color: #fff;
    padding-right:100px;
}

/* Jobb oldal */
.info-right {
    background-color: #212121;
    width: 30%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 0 2rem;
    gap: 1.5rem;
}

/* Info és social ikonok */
.info-icon svg, .social-icon svg {
    width: 20px;
    height: 20px;
    color: #f8fcff;
}

.info-item {
    display: flex;
    flex-direction: column; /* cím felül, érték alul */
    margin-bottom: 1rem;
    color: #fff;
    margin-right: 10px;
}

/* A cím sor: ikon + cím */
.info-item .info-label-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.info-item .info-label {
    font-weight: 600; /* vastag cím */
    font-size: 0.95rem;
}

.info-item .info-text {
    font-weight: 100; /* vékony alatta */
    font-size: 0.9rem;

    color: #e2e2e2;
}

.info-item .info-icon svg {
    width: 20px;
    height: 20px;
    color: #a0c9ef;
}


/* Nagyon kicsi mobilok (<480px) */
@media screen and (max-width: 400px) {
    #info-bar-top .info-left {
        padding-top: 45px; /* dekor sáv magassága + 5px */
        
    }

    #info-bar-top .info-item {
        margin-bottom: 0.5rem;
        gap: 0.2rem;
    }

    #info-bar-top .info-item .info-icon svg {
        width: 20px;
        height: 20px;
        margin-left: 0;
        margin-bottom: 2px;
    }

    #info-bar-top .info-item .info-label {
        font-size: 1rem;
    }

    #info-bar-top .info-item .info-text {
        font-size: 0.9rem;
    }
}


/* MOBIL RESZPONZÍV */
/* ===== Mobil optimalizáció (<768px) ===== */
@media screen and (max-width: 768px) {
    .info-left {
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
        padding: 3rem 1rem 1rem 1rem; /* fent nagyobb padding, lent marad 1rem */
        height:280px;
    }

    .info-item {
        display: flex;
        flex-direction: column; /* ikon, cím, szöveg egymás alatt */
        align-items: flex-start;
        margin-bottom: 1rem;
        gap: 0.3rem;
    }

    .info-item .info-icon svg {
        width: 40px;
        height: 40px;
        margin-bottom: 2px;
        margin-left: 30px;
    }

    .info-item .info-label {
        font-weight: bold;
        font-size: 1.2rem;
    }

    .info-item .info-text {
        font-weight: normal;
        font-size: 1rem;
    }
}


/* ===== INFO BAR mobil javítás ===== */
/* ===== Mobil javítás 768px alatt ===== */
/* ===== MOBIL JAVÍTÁS 768px alatt ===== */
@media screen and (max-width: 768px) {
    #info-bar-top .info-bar-container {
        flex-direction: column !important;
        align-items: stretch !important;
        height: auto !important;
        padding: 0 !important;
    }

    /* Bal oldal: minden elem egymás alatt */
    #info-bar-top .info-left {
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important; /* sor helyett oszlop */
        justify-content: flex-start !important;
        align-items: flex-start !important;
        gap: 0.5rem !important;
        padding: 1rem !important;
        margin: 0 !important;
        color: #fff !important;
    }

    #info-bar-top .info-left .info-item {
        display: flex !important;
        flex-direction: column !important; /* cím, telefonszám, nyitvatartás egymás alatt */
        align-items: flex-start !important;
        margin: 0.2rem 0 !important;
        color: #fff !important;
        gap: 0.2rem;
    }

    #info-bar-top .info-left .info-text {
        color: #fff !important; /* telefonszám fehér */
        margin-left: 0 !important;
    }

    /* Jobb oldal: social ikonok egymás mellett, középre */
    #info-bar-top .info-right {
        width: 100% !important;
        display: flex !important;
        flex-direction: row !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 0.5rem !important;
        padding: 0.5rem 0 !important;
        margin: 0 !important;
    }

    #info-bar-top .social-icon {
        display: flex !important;
        flex-direction: row !important;
        justify-content: center !important;
        gap: 0.5rem !important;
    }

    #info-bar-top .info-icon svg,
    #info-bar-top .social-icon svg {
        width: 20px !important;
        height: 20px !important;
        color: #fff !important; /* ikonok fehérek */
    }
}

/* ===== Nagyon kicsi mobilok <400px ===== */
@media screen and (max-width: 400px) {
    #info-bar-top .info-left {
        flex-direction: column !important; /* minden elem egymás alatt */
        align-items: flex-start !important;
        padding: 0.8rem 1rem !important;
        gap: 0.3rem !important;
    }

    #info-bar-top .info-left .info-item {
        flex-direction: column !important;
        align-items: flex-start !important;
        margin: 0.2rem 0 !important;
        gap: 0.2rem !important;
    }

    #info-bar-top .info-left .info-text {
        color: #fff !important;
        margin-left: 0 !important;
    }

    /* Social ikonok középre egymás mellett */
    #info-bar-top .info-right {
        flex-direction: row !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 0.5rem !important;
        padding: 0.5rem 0 !important;
    }

    #info-bar-top .social-icon {
        justify-content: center !important;
        gap: 0.5rem !important;
    }

    #info-bar-top .info-icon svg,
    #info-bar-top .social-icon svg {
        color: #fff !important;
    }
}

/* Mobilon: cím, telefon, nyitvatartás fehér */
@media screen and (max-width: 768px) {
    #info-bar-top .info-left .info-item .info-text {
        color: #fff !important; /* ezzel garantáltan fehér lesz */
        margin-left: 0 !important;
    }
}
@media screen and (max-width: 400px) {
    #info-bar-top .info-left .info-item .info-text {
        color: #fff !important;
        margin-left: 0 !important;
    }
}
a[href^="tel"] {
    color: #fff !important;
    text-decoration: none !important;
    -webkit-text-fill-color: #fff !important; /* Safari-specifikus */
}

#info-bar-top .info-icon svg,
#info-bar-top .social-icon svg {
    width: 40px !important;
    height: 40px !important;
}
#info-bar-top .info-icon svg,
#info-bar-top .social-icon svg {
    color: #ffffff !important; /* piros például */
}