/* ===== TOP BAR ===== */

.top-bar {
    background: #2dace3;
    color: white;
    height: 3.3rem;
}

/* INNER WRAPPER */
.top-bar-inner {
    max-width: 1200px;   /* controls left/right distance */
    margin: 0 auto;      /* centers the content */

    display: flex;
    justify-content: space-between;
    align-items: center;

    height: 100%;
    padding: 0 20px;

    font-size: 14px;
    font-family: Montserrat, Almarai, Tahoma, sans-serif;
}

/* LEFT SIDE */
.top-bar-left {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* RIGHT SIDE */
.top-bar-right {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 18px;
}

/* Icons */
.top-bar-left a,
.top-bar-right a {
    color: white;
    text-decoration: none;
    font-size: 16px;
    transition: opacity .3s;
}

.top-bar-left a:hover,
.top-bar-right a:hover {
    opacity: 0.8;
}

/* Phone */
.top-bar-left .phone {
    font-size: 16px;
    white-space: nowrap;
}