/* =============================== Dynamic Brand Colors (from PHP) :root variables are set inline in via header.php Example: :root { --theme-color: #e60023; --bg-color: #ffffff; --font-color: #333333; } =============================== */ body { font-family: 'Inter', sans-serif; background: var(--bg-color); color: var(--font-color); line-height: 1.6; } h1, h2, h3, h4, h5, h6 { font-weight: 700; color: var(--theme-color); } a { color: var(--theme-color); text-decoration: none; } a:hover { color: var(--theme-color); text-decoration: underline; } .navbar { background: var(--theme-color); padding: 1rem; } .navbar .nav-link { color: var(--bg-color); margin-left: 1rem; } .navbar .nav-link:hover { color: var(--bg-color); text-decoration: underline; } .btn-theme { background: var(--theme-color); color:var(--bg-color); border: none; } .btn-theme:hover { opacity: 0.9; color:var(--bg-color); } .section { padding: 60px 0; } .bg-light { background:var(--bg-color); } .shadow-sm { box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,.075); } .rounded-3 { border-radius: 1rem; } .card-title { font-weight: 600; } .carousel-caption { background: rgba(0,0,0,0.5); padding: 20px; border-radius: 8px; } footer { background:var(--bg-color); padding: 30px 0; } footer p { margin: 0; color: var(--font-color); text-align: center; } .floating-btn { position: fixed; z-index: 9999; display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; border-radius: 50%; color: var(--bg-color); font-size: 22px; text-decoration: none; } .floating-btn.whatsapp { background: #25D366; left: 20px; bottom: 20px; } .floating-btn.call { background: var(--theme-color); right: 20px; bottom: 20px; } /* Optional: more elements pick up font color */ p, li, small, .card-text { color: var(--font-color); } .footer p, li, small, .card-text { color: var(--bg-color); } .dropdown-submenu { position: relative; } .dropdown-submenu > .dropdown-menu { top: 0; right: 100%; margin-top: -1px; }