/* Document baseline.
   Component font sizes belong in components/*.css and pages/*.css, not here. */

body {
   color: var(--bm-ink);
   font-family: "Roboto", "Segoe UI", Arial, sans-serif;
   background: #fff;
   font-size: 1rem;
   line-height: 1.55
}

.text-primary {
   color: var(--bm-primary) !important
}

.content-width {
   max-width: 820px;
   margin-inline: auto
}

.floating-buttons {
   position: fixed;
   right: 1.25rem;
   bottom: 6rem;
   z-index: 1040;
   display: flex;
   flex-direction: column;
   gap: .7rem
}
.fab-btn {
   display: grid;
   place-items: center;
   width: 52px;
   height: 52px;
   border-radius: 50%;
   color: #fff;
   text-decoration: none;
   box-shadow: 0 4px 14px rgba(0,0,0,.22);
   transition: transform .18s, box-shadow .18s
}
.fab-btn:hover {
   transform: scale(1.1);
   box-shadow: 0 6px 20px rgba(0,0,0,.28);
   color: #fff
}
.fab-btn i { font-size: 1.4rem }
.fab-zalo { background: none; padding: 0; border-radius: 14px; overflow: hidden }
.fab-zalo svg { width: 52px; height: 52px; display: block }
.fab-phone { background: var(--bm-red) }
.fab-contact { background: var(--bm-green-bg) }
@media (max-width: 575.98px) {
   .floating-buttons { right: .75rem; bottom: 1rem }
   .fab-btn { width: 46px; height: 46px }
   .fab-btn i { font-size: 1.2rem }
   .fab-zalo { border-radius: 12px }
   .fab-zalo svg { width: 46px; height: 46px }
}