/*=========================================================
TOPBAR FRONTEND
SIMPATI RSUD MIMIKA
=========================================================*/

.topbar {
    position:relative;
    z-index:50;
    min-height:42px;
    display:flex;
    align-items:center;
    color:#f9fffb;
    background:linear-gradient(90deg,#547d68 0%,#6f9a86 66%,#8cad7b 100%);
    border-bottom:1px solid rgba(255,255,255,.18);
    box-shadow:0 8px 22px rgba(53,82,67,.12);
    font-family:'Montserrat','Segoe UI',sans-serif;
}

.topbar-wrapper {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    min-height:42px;
}

.topbar-left {
    display:flex;
    align-items:center;
    min-width:0;
    gap:8px;
    color:rgba(255,255,255,.94);
}

.topbar-left i {
    flex:0 0 auto;
    color:#ffe7ad;
    font-size:.92rem;
}

.topbar-left span {
    display:block;
    max-width:680px;
    overflow:hidden;
    font-size:.73rem;
    font-weight:600;
    line-height:1.35;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.topbar-right {
    display:flex;
    align-items:center;
    justify-content:flex-end;
    flex:0 0 auto;
    gap:7px;
}

.topbar-right a {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:31px;
    height:31px;
    flex:0 0 auto;
    color:#fff;
    background:rgba(255,255,255,.13);
    border:1px solid rgba(255,255,255,.2);
    border-radius:999px;
    font-size:.84rem;
    line-height:1;
    text-decoration:none;
    transition:transform .22s ease, background .22s ease, color .22s ease, box-shadow .22s ease;
}

.topbar-right a:hover {
    color:#547d68;
    background:#fff;
    box-shadow:0 10px 20px rgba(46,72,58,.16);
    transform:translateY(-2px);
}

.topbar-right a.topbar-map-link,
.topbar-right a.visit-rsud-link {
    width:auto !important;
    min-width:178px !important;
    height:32px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:8px !important;
    padding:0 15px !important;
    color:#345b48 !important;
    background:linear-gradient(135deg,#fffdf7,#fff0cc) !important;
    border:1px solid rgba(255,231,176,.98) !important;
    border-radius:12px !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 8px 18px rgba(63,92,75,.1) !important;
    font-size:.68rem !important;
    font-weight:800 !important;
    letter-spacing:0 !important;
    white-space:nowrap !important;
}

.topbar-right a.topbar-map-link i,
.topbar-right a.visit-rsud-link i {
    display:grid;
    width:20px;
    height:20px;
    place-items:center;
    flex:0 0 auto;
    color:#bd8c32 !important;
    background:#fff !important;
    border-radius:8px !important;
    font-size:.78rem !important;
}

.topbar-right a.topbar-map-link span,
.topbar-right a.visit-rsud-link span {
    display:inline-block;
    line-height:1 !important;
    transform:translateY(.5px);
}

.topbar-right a.topbar-map-link:hover,
.topbar-right a.visit-rsud-link:hover {
    color:#fff !important;
    background:linear-gradient(135deg,#c99a45,#a87a2b) !important;
    border-color:#bd8c32 !important;
}

.topbar-right a.topbar-map-link:hover i,
.topbar-right a.visit-rsud-link:hover i {
    color:#a87a2b !important;
    background:#fff9ec !important;
}

.topbar-social-label {
    display:inline-flex;
    align-items:center;
    height:31px;
    margin-left:2px;
    color:rgba(255,255,255,.86);
    font-size:.64rem;
    font-weight:800;
    letter-spacing:.03em;
    text-transform:uppercase;
}

@media (max-width:1199.98px) {
    .topbar-left span {
        max-width:520px;
    }
}

@media (max-width:991.98px) {
    .topbar {
        display:none;
    }
}
