#site-header .search-input { background-color: #ffffff !important; color: #212529 !important; border: 2px solid #0a369d !important; } #site-header .search-input::placeholder { color: #6c757d !important; } #site-header .search-input:focus { background-color: #ffffff !important; color: #212529 !important; border-color: #2754b4 !important; box-shadow: 0 0 0 0.2rem rgba(10, 54, 157, 0.25) !important; } :root { --header-bg: #0a369d; --header-font: #ffffff; --header-height: 56px; --nav-bg: #2754b4; --nav-font: #ffffff; --nav-height: 42px; --sidebar-bg: #f8f9fa; --sidebar-border: #dee2e6; } #site-header { background-image: none; background-size: cover; background-position: center; background-repeat: no-repeat; position: relative; } .navbar { background-color: var(--header-bg) !important; min-height: var(--header-height); } .navbar .navbar-brand, .navbar .navbar-text, .navbar .btn { color: var(--header-font) !important; } .navbar .form-control { color: var(--header-font) !important; } .navbar .form-control::placeholder { color: rgba(255, 255, 255, 0.7) !important; } .navbar .search-input { background-color: #ffffff !important; color: #212529 !important; border: 2px solid #0a369d !important; } .navbar .search-input::placeholder { color: #6c757d !important; opacity: 1 !important; } .navbar .search-input:focus { background-color: #ffffff !important; color: #212529 !important; border-color: #2754b4 !important; box-shadow: 0 0 0 0.2rem rgba(10, 54, 157, 0.25) !important; } .navbar .btn-outline-light { border-color: var(--header-font) !important; } .dropdown-menu { --bs-dropdown-min-width: 0; --bs-dropdown-padding-x: 0; --bs-dropdown-padding-y: 0; --bs-dropdown-border-width: 0; --bs-dropdown-border-radius: 0; --bs-dropdown-box-shadow: none; background-color: var(--header-bg) !important; border: none !important; border-radius: 0 !important; padding: 0 !important; margin: 0 !important; min-width: 0 !important; box-shadow: none !important; } .dropdown-item { color: var(--header-font) !important; border-radius: 0 !important; padding: 0.4rem 1rem; white-space: nowrap; width: auto; } .dropdown-item:hover, .dropdown-item:focus { background-color: rgba(255, 255, 255, 0.1) !important; color: var(--header-font) !important; } .nav-tabs .dropdown-menu { margin-top: 0 !important; } .dropdown-toggle::after { display: none !important; } .btn-outline-light { color: var(--header-font) !important; border-color: var(--header-font) !important; } .btn-outline-light:hover { background-color: rgba(255, 255, 255, 0.1) !important; color: var(--header-font) !important; } .btn-outline-light:focus, .btn-outline-light:active, .show > .btn-outline-light.dropdown-toggle { background-color: rgba(255, 255, 255, 0.1) !important; color: var(--header-font) !important; border-color: var(--header-font) !important; box-shadow: none !important; } .bi-chevron-down { font-size: 0.75em; margin-left: 0.25rem; } .breadcrumb-item + .breadcrumb-item::before { content: "" !important; padding: 0 !important; } .breadcrumb { --bs-breadcrumb-divider: ""; --bs-breadcrumb-margin-bottom: 0; margin-bottom: 0; } .breadcrumb .breadcrumb-item { color: var(--header-bg) !important; } .breadcrumb .breadcrumb-item a { color: var(--header-bg) !important; text-decoration: none; } .breadcrumb .breadcrumb-item a:hover { text-decoration: underline; } .sidebar-toggle-item { display: flex; align-items: center; margin-right: 0.5rem; } .sidebar-toggle-btn { padding: 0; line-height: 1; font-size: 1.1rem; color: var(--header-bg) !important; border: none !important; background: transparent !important; box-shadow: none !important; cursor: pointer; } .sidebar-toggle-btn:hover { opacity: 0.7; } .sidebar-column { transition: all 0.3s ease; } .sidebar-hidden { display: none !important; } .navigation-section { background-color: var(--nav-bg) !important; color: var(--nav-font) !important; min-height: var(--nav-height); } .focus-visible:focus, .btn:focus, .form-control:focus, .nav-link:focus { outline: 3px solid #0056b3 !important; outline-offset: 2px !important; box-shadow: 0 0 0 1px #ffffff, 0 0 0 4px #0056b3 !important; } @media (prefers-contrast: high) { :root { --text-color: #000000; --bg-color: #ffffff; --border-color: #000000; --focus-color: #000000; } .btn-primary { background-color: #000000 !important; border-color: #000000 !important; color: #ffffff !important; } .btn-outline-light { color: #000000 !important; border-color: #000000 !important; } .text-muted { color: #000000 !important; } .navbar { background-color: #ffffff !important; border-bottom: 1px solid #000000 !important; } } @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } } .nav-tabs { background-color: transparent !important; border: none !important; border-radius: 0 !important; gap: 0 !important; } .nav-tabs .nav-link { background-color: transparent !important; border: none !important; color: var(--nav-font) !important; } .nav-tabs .nav-link:hover { background-color: rgba(255, 255, 255, 0.1) !important; } .nav-tabs .nav-link.active { background-color: rgba(255, 255, 255, 0.2) !important; border-bottom: 2px solid var(--nav-font) !important; } .sidebar-column { background-color: var(--sidebar-bg) !important; border-right: 1px solid var(--sidebar-border) !important; position: sticky; top: 0; min-height: calc(100vh - var(--header-height) - var(--nav-height) - 42px); } .sidebar { padding: 1.5rem; height: 100%; overflow-y: auto; } .content-column { background-color: #ffffff; } .content-wrapper { padding: 2rem; padding-bottom: 80px !important; } .main-content { flex: 1; min-height: auto; } @media (max-width: 767.98px) { .sidebar-column { border-right: none !important; border-top: 1px solid var(--sidebar-border) !important; min-height: auto; margin-top: 1rem; } .content-column { background-color: #ffffff; } .content-wrapper { min-height: auto; padding-bottom: 2rem !important; } } @media (max-width: 991.98px) { .sidebar-column { order: 2 !important; } .content-column { order: 1 !important; } } pre { background: #f8f9fa; padding: 1rem; border-radius: 6px; overflow-x: auto; border: 1px solid #dee2e6; margin-bottom: 1rem; } pre code { background: none; padding: 0; color: #333; font-size: 0.85rem; line-height: 1.5; } /* Bootstrap 5 nested dropdown support (dropdown-submenu) — unlimited depth, CSS hover */ .dropdown-submenu { position: relative; } .dropdown-submenu > .dropdown-menu { top: 0; left: 100%; margin-top: 0; margin-left: 0; display: none; --bs-dropdown-border-width: 0; --bs-dropdown-border-radius: 0; --bs-dropdown-box-shadow: none; border: none !important; border-radius: 0 !important; box-shadow: none !important; } .dropdown-submenu:hover > .dropdown-menu { display: block; } .dropdown-submenu:hover > .dropdown-toggle { background-color: rgba(255, 255, 255, 0.15) !important; } .dropdown-submenu > .dropdown-toggle .bi-chevron-right { float: right; margin-top: 0.25rem; } @media (max-width: 767.98px) { .dropdown-submenu > .dropdown-menu { left: 0; top: 100%; margin-top: 0; margin-left: 1rem; border: none !important; border-radius: 0 !important; box-shadow: none; } .dropdown-submenu:hover > .dropdown-menu { display: none; } .dropdown-submenu.show > .dropdown-menu { display: block; } } code { background: #e8e8e8; padding: 0.15rem 0.4rem; border-radius: 3px; font-size: 0.9em; color: #d63384; } .footer-icon { color: #6c757d; text-decoration: none; transition: all 0.2s ease-in-out; display: inline-block; padding: 2px; } .footer-icon:hover { color: #0d6efd; transform: translateY(-1px); } .footer-icon:active { transform: translateY(0); } .footer-icon.guide:hover { color: #198754; } .footer-icon.cms:hover { color: #dc3545; } .footer-icon.git:hover { color: #6f42c1; } .footer-icon.website:hover { color: #fd7e14; }