:root { --hp-dark-blue: #0149A2; --hp-blue: #008EEF; --hp-orange: #FD7900; --hp-dark-orange: #FF4101; /* Overridden per-broker via inline style on */ --hp-base: var(--hp-dark-blue); --hp-accent: var(--hp-blue); } /* ── Navbar ── */ .hp-navbar { background-color: var(--hp-base); } .hp-navbar .navbar-brand, .hp-navbar .nav-link, .hp-navbar .navbar-text { color: #fff !important; } .hp-navbar .nav-link:hover, .hp-navbar .nav-link.active { color: rgba(255,255,255,.75) !important; } /* ── Buttons ── */ .btn-hp { background-color: var(--hp-accent); border-color: var(--hp-accent); color: #fff; } .btn-hp:hover { background-color: var(--hp-base); border-color: var(--hp-base); color: #fff; } .btn-hp-outline { border-color: var(--hp-accent); color: var(--hp-accent); } .btn-hp-outline:hover { background-color: var(--hp-accent); color: #fff; } /* ── Card headers ── */ .card-header-hp { background-color: var(--hp-base); color: #fff; } /* ── Sidebar / dashboard widgets ── */ .widget-card { border: 1px solid #dee2e6; border-radius: .5rem; padding: 1.25rem; height: 100%; } .widget-card .widget-title { font-size: .8rem; text-transform: uppercase; letter-spacing: .05em; color: #6c757d; margin-bottom: .5rem; } /* ── Activity badge colors ── */ .activity-pending { border-left: 4px solid var(--hp-orange); } .activity-waiting { border-left: 4px solid var(--hp-blue); } .activity-done { border-left: 4px solid #198754; } /* ── Calendar ── */ .hp-calendar table { width: 100%; table-layout: fixed; } .hp-calendar th { text-align: center; font-size: .75rem; color: #6c757d; } .hp-calendar td { text-align: center; padding: .35rem; border: 1px solid #f0f0f0; vertical-align: top; cursor: pointer; } .hp-calendar td:hover { background: #f8f9fa; } .hp-calendar td.today { background: #e8f4fd; font-weight: 600; } .hp-calendar td.other-month { color: #adb5bd; } .hp-calendar .day-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; margin: 1px; } /* ── Misc ── */ .text-hp-base { color: var(--hp-base) !important; } .text-hp-accent { color: var(--hp-accent) !important; } .bg-hp-base { background-color: var(--hp-base) !important; } .footer-bar { background: #f8f9fa; border-top: 1px solid #dee2e6; font-size: .8rem; color: #6c757d; }