/* navbar.css Styling untuk komponen navbar yang di-render oleh js/navbar.js. Link file ini di tiap halaman yang pakai . */ .cs-navbar { position: sticky; top: 0; z-index: 50; background: rgba(250, 247, 244, .9); backdrop-filter: blur(10px); border-bottom: 1px solid var(--border, #E7E1D8); } .cs-navbar-inner{ width:100%; max-width:1300px; margin:0 auto; padding:.9rem 2rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; } .cs-navbar-brand { font-family: 'Playfair Display', serif; font-style: italic; font-size: 1.15rem; color: var(--dark, #1C1917); text-decoration: none; flex-shrink: 0; } .cs-navbar-links { display: flex; align-items: center; gap: 1.5rem; } .cs-navbar-link { font-family: 'DM Sans', sans-serif; font-size: .88rem; font-weight: 500; color: var(--muted, #8A8378); text-decoration: none; padding: 6px 2px; position: relative; } .cs-navbar-link.active { color: var(--violet, #7C5CFC); } .cs-navbar-link.active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -13px; height: 2px; background: var(--violet, #7C5CFC); border-radius: 99px; } .cs-navbar-logout { font-family: 'DM Sans', sans-serif; font-size: .8rem; color: var(--muted, #8A8378); background: none; border: 1px solid var(--border, #E7E1D8); border-radius: 99px; padding: 5px 14px; cursor: pointer; } .cs-navbar-logout:hover { border-color: var(--violet, #7C5CFC); color: var(--violet, #7C5CFC); } @media (max-width: 640px) { .cs-navbar-inner { flex-wrap: wrap; gap: .6rem; } .cs-navbar-links { gap: 1rem; order: 3; width: 100%; justify-content: center; } }