/* NabzClan Helpdesk theme: black and white, matching the logo and the forum. Loaded last (config system.frontend.custom_css).
   Palette: bg #0a0a0a, card #111, raised #161616, border #262626, text #e5e5e5, muted #a3a3a3, primary button white on black. */
:root {
  --nz-bg: #0a0a0a; --nz-card: #111111; --nz-raised: #161616; --nz-border: #262626;
  --nz-text: #e5e5e5; --nz-muted: #a3a3a3; --nz-link: #ffffff; --nz-radius: 12px;
}
body { background-color: var(--nz-bg); color: var(--nz-text); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, Helvetica, Arial, sans-serif; }
::-webkit-scrollbar-track { background: var(--nz-bg); }
::-webkit-scrollbar-thumb { background: var(--nz-border); }
a { color: var(--nz-link); }
a:hover { color: #fff; opacity: 1; }
:focus-visible { outline: 2px solid #ffffff; outline-offset: 2px; border-radius: 4px; }
.text-dark, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { color: #fff !important; }
.text-muted { color: var(--nz-muted) !important; }
.text-primary { color: var(--nz-link) !important; }
.bg-light, .bg-white { background-color: var(--nz-raised) !important; }
.tickets-paragrah { color: var(--nz-muted); }
hr { border-color: var(--nz-border); opacity: 1; }

/* navigation */
.nav-bar { background-color: rgba(0, 0, 0, .92); box-shadow: 0 1px 0 var(--nz-border); backdrop-filter: blur(8px); }
.nav-bar.scrolling { box-shadow: 0 8px 30px rgba(0, 0, 0, .45); }
.nav-bar .nav-bar-menu .nav-bar-links .link, .nav-bar .drop-down .drop-down-btn, .drop-down .drop-down-btn { color: #d4d4d4; }
.nav-bar .nav-bar-menu .nav-bar-links .link:hover, .nav-bar .drop-down .drop-down-btn:hover, .drop-down .drop-down-btn:hover { color: #fff; }
.nav-bar-menu-btn { color: #fff; }
.drop-down .drop-down-menu, .custom-dropdown .dropdown-menu { background-color: var(--nz-raised); box-shadow: 0 0 0 1px var(--nz-border), 0 12px 32px rgba(0, 0, 0, .5); border-radius: var(--nz-radius); }
.drop-down .drop-down-menu .drop-down-item, .custom-dropdown .dropdown-menu .dropdown-item { color: var(--nz-text); }
.drop-down .drop-down-menu .drop-down-item.active { background-color: transparent; color: var(--nz-link) !important; }
.drop-down .drop-down-menu .drop-down-divider { border-color: var(--nz-border); }
.custom-dropdown .dropdown-btn { background-color: var(--nz-raised); color: var(--nz-text); }
@media (max-width: 991.98px) { .nav-bar .nav-bar-menu .nav-bar-links { background-color: var(--nz-card); } .nav-bar .nav-bar-menu .overlay { background-color: rgba(0, 0, 0, .6); } }

/* buttons */
.btn { border-radius: 10px; font-weight: 600; }
.btn.btn-primary { background-color: #fff; border-color: #fff; color: #000; }
.btn.btn-primary:hover, .btn.btn-primary:focus, .btn.btn-primary:active, .btn.btn-primary:focus-visible { background-color: #e5e5e5; border-color: #e5e5e5; color: #000; }
.btn.btn-secondary, .btn.btn-light { background-color: var(--nz-raised); border-color: var(--nz-border); color: var(--nz-text); }
.btn.btn-outline-light, .btn.btn-outline-secondary { border-color: var(--nz-border); color: var(--nz-text); }
.btn.btn-outline-light:hover, .btn.btn-outline-secondary:hover { background-color: var(--nz-raised); border-color: #404040; color: #fff; }
.btn.btn-outline-primary, .btn.btn-outline-light { color: #fff; border-color: #fff; background-color: transparent; }
.btn.btn-outline-primary:hover, .btn.btn-outline-light:hover { background-color: #fff; border-color: #fff; color: #000; }
.react-btn { background-color: var(--nz-raised); color: var(--nz-text); border-color: var(--nz-border) !important; }

/* forms */
.form-control, .form-select, .input-group-text { background-color: var(--nz-bg); color: var(--nz-text); border-color: #333333; border-radius: 10px; }
.form-control::placeholder { color: #8a8a8a; }
.form-control:focus, .form-select:focus { background-color: var(--nz-bg); color: #fff; border-color: #a3a3a3; box-shadow: 0 0 0 .2rem rgba(255, 255, 255, .25); }
.form-control:disabled, .form-control[readonly], .form-select:disabled { background-color: var(--nz-raised) !important; color: var(--nz-muted); }
.form-check-input { background-color: var(--nz-bg); border-color: #404040; }
.form-label, label { color: var(--nz-text); }
.form-text { color: var(--nz-muted); }
.form-search button, .form-search .icon, .header-search .search-input .search-icon { color: var(--nz-muted); }

/* cards and surfaces */
.card, .card-v, .dash-table, .settings-links .settings-link, .noti-lg .noti-item, .modal-content, .accordion-item, .list-group-item, .page-body, .body-doc { background-color: var(--nz-card); color: var(--nz-text); }
.card, .card-v, .dash-table, .modal-content { border: 1px solid var(--nz-border); border-radius: var(--nz-radius); box-shadow: none; }
.card-v:hover { border-color: #404040; }
.settings-links .settings-link { box-shadow: none; border: 1px solid var(--nz-border); color: var(--nz-text); }
.settings-links .settings-link.active { background-color: #fff; border-color: #fff; color: #000; }
.table { color: var(--nz-text); --bs-table-bg: transparent; --bs-table-color: var(--nz-text); --bs-table-striped-bg: var(--nz-raised); --bs-table-hover-bg: var(--nz-raised); border-color: var(--nz-border); }
.dash-table td, .dash-table th, .dash-table .table > :not(:last-child) > :last-child > *, .table > :not(caption) > * > * { border-color: var(--nz-border); background-color: transparent; color: var(--nz-text); }
.category, .doc-category, .page-links .page-links-item, .sidebar-link { color: #d4d4d4; }
.category:not(:last-child), .doc-category:not(:last-child), .search .search-item:not(:last-child) { border-color: var(--nz-border); }
.category:hover, .sidebar-link:hover { color: #fff; }
.sidebar-link.active, .page-links .page-links-item.active, .page-links .page-links-title.active a { color: var(--nz-link); }
.page-links .page-links-title a { color: #fff; }
.page-sidebar, .page-doc::before { background-color: var(--nz-card); }
.page-body { border-left-color: var(--nz-border); }
.sidebar-toggle span { background-color: var(--nz-text); }
.search-btn { color: var(--nz-text); }
.search .search-results { background-color: var(--nz-raised); box-shadow: 0 0 0 1px var(--nz-border), 0 16px 40px rgba(0, 0, 0, .5); border-radius: var(--nz-radius); }
.search .search-item:hover { background-color: var(--nz-card); }
.search .search-item .search-item-title { color: var(--nz-link); }
.search .empty { color: var(--nz-muted); }
.badge::before { background-color: rgba(255, 255, 255, .06); border: 1px solid var(--nz-border); border-radius: 6px; }
.badge.bg-primary { color: var(--nz-link); } .badge.bg-secondary { color: var(--nz-muted); } .badge.bg-dark { color: var(--nz-text); }
.page-item .page-link { background-color: var(--nz-card); border-color: var(--nz-border); color: var(--nz-link); }
.page-item.active .page-link { background-color: #fff; border-color: #fff; color: #000; }
.login-with .login-with-divider span { background-color: var(--nz-card); color: var(--nz-muted); }
.login-with .login-with-divider::before { background-color: var(--nz-border); }
.counter { color: var(--nz-link); }
.counter.counter-secondary { color: var(--nz-muted); }

/* dashboard (member panel) */
.dash-contain { background: var(--nz-bg); }
.dash-sidebar-inner { background-color: var(--nz-card); border-right: 1px solid var(--nz-border); }
.dash-sidebar-links-title { color: var(--nz-muted); }
.dash-sidebar-link-anchor, .dash-sidebar-link-menu .dash-sidebar-link { color: #d4d4d4; }
.dash-sidebar-link-anchor:hover, .dash-sidebar-link.current .dash-sidebar-link-anchor, .dash-sidebar-link-menu .dash-sidebar-link.current { color: #fff; }
.dash-sidebar .overlay { background-color: rgba(0, 0, 0, .6); }
.noti .noti-header, .noti .noti-footer { border-color: var(--nz-border); color: var(--nz-muted); }
.noti .noti-item .noti-item-info .noti-item-text { color: var(--nz-text); }
.noti .noti-item .noti-item-info .noti-item-time { color: var(--nz-muted); }
.noti .noti-item:hover, .noti .noti-item.active, .noti-lg .noti-item:hover { background-color: var(--nz-raised); }
.noti .noti-item.unread, .noti-lg .noti-item.unread { background-color: rgba(255, 255, 255, .06); }

/* hero */
.header { background: var(--nz-bg); color: #fff; border-bottom: 1px solid var(--nz-border); }
.header .wrapper { background-blend-mode: soft-light; opacity: 1; }
.header .header-shape { display: none; }
.header .header-title { color: #fff !important; font-weight: 700; letter-spacing: -.02em; }
.header .header-text { color: #d4d4d4; }
.header-search .search-input input { background-color: var(--nz-card); color: #fff; border: 1px solid #333333; }
.section .section-title-divider { background-color: var(--nz-border); }
.section .section-title-divider::after { background-color: #fff; }
.categories-img { border-radius: 14px; }

/* footer, cookie notice */
.footer-sm, .footer-light { background-color: #000000; border-top: 1px solid var(--nz-border); color: var(--nz-muted); }
.footer-sm .footer-copyright, .footer-light .footer-copyright { color: var(--nz-muted); }
.footer-sm .footer-links .link a { color: var(--nz-link); }
.cookies { background-color: var(--nz-raised); color: var(--nz-text); border: 1px solid var(--nz-border); box-shadow: 0 16px 40px rgba(0, 0, 0, .55); border-radius: var(--nz-radius); }

/* article body */
.article-body, .page-body { line-height: 1.7; }
.article-body a, .page-body a { text-decoration: underline; }
.article-body code, .page-body code { background: var(--nz-raised); color: #e5e5e5; padding: .1em .4em; border-radius: 6px; }

/* NabzClan home blocks */
.nz-section { padding: 48px 0 8px; }
.nz-section h2 { font-size: 1.6rem; font-weight: 700; margin-bottom: .4rem; }
.nz-section .nz-lead { color: var(--nz-muted); max-width: 46rem; margin: 0 auto 1.75rem; }
.nz-dept { display: block; height: 100%; padding: 1.25rem; background: var(--nz-card); border: 1px solid var(--nz-border); border-radius: var(--nz-radius); color: var(--nz-text); transition: border-color .2s, transform .2s; }
.nz-dept:hover { border-color: #737373; transform: translateY(-2px); color: var(--nz-text); }
.nz-dept h3 { font-size: 1.05rem; font-weight: 650; margin: 0 0 .35rem; }
.nz-dept p { color: var(--nz-muted); margin: 0; font-size: .93rem; line-height: 1.5; }
.nz-cta { display: flex; flex-wrap: wrap; gap: .75rem; justify-content: center; margin-top: 1.5rem; }
.nz-note { background: var(--nz-card); border: 1px solid var(--nz-border); border-left: 4px solid #fff; border-radius: var(--nz-radius); padding: 1.25rem 1.5rem; color: #d4d4d4; }
.nz-links { display: flex; flex-wrap: wrap; gap: .75rem; justify-content: center; }
.nz-links a { padding: .55rem 1rem; border: 1px solid var(--nz-border); border-radius: 999px; color: var(--nz-text); background: var(--nz-card); }
.nz-links a:hover { border-color: #737373; color: #fff; }
html { overflow-x: hidden; }

/* hero: calm background instead of the template's line pattern */
.header .wrapper { background-image: none !important; }
.header .wrapper-content { padding-bottom: 1rem; }
.nz-dept p { color: var(--nz-muted) !important; }
.nz-helper { margin-top: .5rem; padding: .75rem 1rem; border-radius: 10px; background: var(--nz-raised); border: 1px solid var(--nz-border); color: #d4d4d4; font-size: .93rem; }
.cookies { max-width: 340px; }

/* wordmark next to the logo */
.nav-bar .logo { display: inline-flex; align-items: center; gap: .6rem; text-decoration: none; }
.nz-wordmark { color: #fff; font-weight: 700; font-size: 1.1rem; letter-spacing: .01em; white-space: nowrap; }
.nz-wordmark span { color: var(--nz-muted); font-weight: 500; }
@media (max-width: 420px) { .nz-wordmark span { display: none; } }
.nav-bar .logo img { width: auto; height: 45px; }

/* black and white: primary is white, so anything that put white text on the primary colour is flipped to black text */
::selection { background-color: #fff; color: #000; -webkit-text-fill-color: #000; }
::-moz-selection { background-color: #fff; color: #000; -webkit-text-fill-color: #000; }
.bg-primary { background-color: #fff !important; color: #000 !important; }
.badge.bg-primary { color: #fff; }
a:hover, .nav-bar .nav-bar-menu .nav-bar-links .link:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.btn:hover, .nav-bar a.btn:hover, .nav-bar .logo:hover, .card-v a:hover, .nz-dept:hover { text-decoration: none; }
.drop-down .drop-down-menu .drop-down-item:hover, .custom-dropdown .dropdown-menu .dropdown-item.active, .custom-dropdown .dropdown-menu .dropdown-item:hover { background-color: var(--nz-border); color: #fff; }
.dash-sidebar-link-anchor .dash-sidebar-link-counter { background-color: #fff; color: #000; }
.form-check-input:checked { background-color: #fff; border-color: #fff; }
.form-check-input:checked[type=checkbox] { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e"); }
.form-check-input:checked[type=radio] { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23000'/%3e%3c/svg%3e"); }
.form-check-input:focus { border-color: #fff; box-shadow: 0 0 0 .2rem rgba(255, 255, 255, .2); }

/* home hero: no tall coloured block, readable on black, button row sits below the search box */
.header { background: var(--nz-bg) !important; }
.header .wrapper { min-height: 0 !important; padding-top: 72px; padding-bottom: 56px; }
.header .header-title { color: #fff !important; font-size: clamp(2rem, 6vw, 3.5rem); }
.header .header-text { color: var(--nz-text) !important; font-size: 1.1rem; }
.header-search { position: relative; margin-bottom: 0; }
.header-search .search-input input { background-color: var(--nz-card); color: #fff; border: 1px solid #404040; }
.header-search .search-input input::placeholder { color: #a3a3a3; opacity: 1; }
.nz-cta { position: relative; z-index: 0; margin-top: 1.25rem; }
.footer-sm .footer-links .link a { color: var(--nz-muted); }
.footer-sm .footer-links .link a:hover { color: #fff; }
.cookies .btn { white-space: nowrap; }