(footer, cleaned to "© 2026 — Adrixis Technologies")
* ------------------------------------------------------------------------- */
html, body { height: 100%; }
body:has(> .container.text-center) {
margin: 0;
padding: 0;
background: #ffffff;
overflow-x: hidden;
}
body > .container.text-center {
display: grid !important;
grid-template-columns: 1.1fr 1fr;
grid-template-rows: 1fr auto;
min-height: 100vh;
width: 100vw;
max-width: 100vw;
padding: 0 !important;
margin: 0 !important;
position: relative;
background: #ffffff;
overflow: hidden;
}
/* Left panel: dark gradient hero */
body > .container.text-center::before {
content: "";
grid-column: 1;
grid-row: 1 / -1;
background:
radial-gradient(ellipse at 30% 20%, rgba(6, 182, 212, 0.18), transparent 50%),
radial-gradient(ellipse at 80% 80%, rgba(168, 85, 247, 0.12), transparent 55%),
linear-gradient(135deg, var(--adrixis-bg) 0%, var(--adrixis-bg-alt) 55%, #0f172a 100%);
position: relative;
}
/* The hero logo + injected tagline live in the left panel */
body > .container.text-center > img {
grid-column: 1;
grid-row: 1;
justify-self: center;
align-self: center;
max-width: 460px;
width: 75%;
height: auto;
padding: 48px;
filter: drop-shadow(0 20px 40px rgba(6, 182, 212, 0.2));
position: relative;
z-index: 1;
margin-top: -40px;
}
/* Marketing tagline injected by skin.js, placed below the logo */
.adrixis-hero-tagline {
grid-column: 1;
grid-row: 1;
align-self: end;
justify-self: center;
padding: 0 48px 48px;
max-width: 560px;
text-align: center;
color: var(--adrixis-text-regular);
position: relative;
z-index: 1;
}
.adrixis-hero-tagline h2 {
font-family: var(--adrixis-font-display) !important;
font-weight: 800;
font-size: clamp(20px, 2.2vw, 28px);
color: var(--adrixis-text-strong) !important;
margin: 0 0 10px;
letter-spacing: -0.02em;
}
.adrixis-hero-tagline h2 .accent { color: var(--adrixis-primary-light); }
.adrixis-hero-tagline p {
font-size: 14px;
line-height: 1.6;
color: var(--adrixis-text-muted);
margin: 0;
}
/* Right panel: white sign-in form */
body > .container.text-center > .row:first-of-type {
grid-column: 2;
grid-row: 1;
margin: 0 !important;
padding: 0 !important;
background: #ffffff;
display: flex !important;
flex-direction: column;
align-items: stretch;
justify-content: center;
}
/* Collapse the bootstrap col-md-4 spacers; the form fills its column */
body > .container.text-center > .row:first-of-type > .col-md-4:not(:has(.panel)):not(:has(form)) {
display: none !important;
}
body > .container.text-center > .row:first-of-type > .col-md-4 {
width: 100% !important;
flex: 0 0 100% !important;
max-width: 100% !important;
float: none !important;
padding: 0 !important;
}
/* The form panel — flat, no shadow (right panel IS the surface). */
body > .container.text-center > .row:first-of-type .panel,
body > .container.text-center > .row:first-of-type .panel-default {
background: transparent !important;
border: none !important;
box-shadow: none !important;
backdrop-filter: none !important;
margin: 0 auto;
width: 100%;
max-width: 420px;
}
body > .container.text-center > .row:first-of-type .panel-body {
padding: 48px 40px !important;
}
body > .container.text-center > .row:first-of-type .container-fluid {
padding: 0 !important;
}
/* Sign-in heading injected by skin.js above the form */
.adrixis-signin-heading {
font-family: var(--adrixis-font-display);
font-weight: 800;
font-size: 28px;
color: var(--adrixis-text-ink) !important;
margin: 0 0 8px;
text-align: left;
letter-spacing: -0.02em;
}
.adrixis-signin-subhead {
font-size: 14px;
color: var(--adrixis-text-ink-muted);
margin: 0 0 32px;
text-align: left;
}
body > .container.text-center > .row:first-of-type form {
text-align: left;
}
/* Hide director (upstream connection) + language picker */
body > .container.text-center .form-group:has(input[name="director"]),
body > .container.text-center .form-group:has(select[name="locale"]) {
display: none !important;
}
body > .container.text-center .row.centered.text-centered {
text-align: left !important;
}
body > .container.text-center .panel .form-group {
margin-bottom: 18px;
}
/* --- Inputs on the WHITE right panel ------------------------------------- */
body > .container.text-center > .row:first-of-type .panel .input-group {
margin-bottom: 0;
}
body > .container.text-center > .row:first-of-type .panel .input-group-addon {
background: var(--adrixis-surface-muted) !important;
border: 1px solid var(--adrixis-border-light) !important;
border-right: none !important;
color: var(--adrixis-text-ink-muted) !important;
min-width: 44px;
padding: 10px 14px !important;
}
body > .container.text-center > .row:first-of-type .panel .form-control {
background: #ffffff !important;
border: 1px solid var(--adrixis-border-light) !important;
border-left: none !important;
color: var(--adrixis-text-ink) !important;
font-size: 15px !important;
height: 46px !important;
padding: 12px 16px !important;
box-shadow: none !important;
transition: all 150ms;
}
body > .container.text-center > .row:first-of-type .panel .form-control::placeholder {
color: var(--adrixis-text-ink-muted) !important;
font-weight: 400;
}
body > .container.text-center > .row:first-of-type .panel .form-control:focus {
border-color: var(--adrixis-primary) !important;
box-shadow: 0 0 0 3px var(--adrixis-primary-glow) !important;
outline: none !important;
}
body > .container.text-center > .row:first-of-type .panel .form-control:focus + .input-group-addon,
body > .container.text-center > .row:first-of-type .panel .input-group:focus-within .input-group-addon {
border-color: var(--adrixis-primary) !important;
color: var(--adrixis-primary) !important;
}
body > .container.text-center > .row:first-of-type .panel input[type="submit"].btn-primary {
width: 100%;
padding: 14px 20px !important;
font-size: 15px;
margin-top: 12px;
font-weight: 700 !important;
letter-spacing: 0.02em;
}
/* Footer strip spanning both halves */
body > .container.text-center > p,
body > .container.text-center p:last-of-type {
grid-column: 1 / -1;
grid-row: 2;
background: #ffffff;
color: var(--adrixis-text-ink-muted) !important;
padding: 20px;
margin: 0 !important;
text-align: center;
font-size: 12px;
letter-spacing: 0.05em;
border-top: 1px solid var(--adrixis-border-light);
}
body > .container.text-center > p br { display: none; }
body > .container.text-center > p a {
color: var(--adrixis-text-ink-muted) !important;
text-decoration: none;
}
/* Hide the alerts row and
gaps (if any) between the form row and footer */
body > .container.text-center > br { display: none !important; }
body > .container.text-center > .row + .row { display: none !important; }
/* Responsive: stack vertically on small screens */
@media (max-width: 768px) {
body > .container.text-center {
grid-template-columns: 1fr;
grid-template-rows: auto 1fr auto;
}
body > .container.text-center::before { grid-row: 1; }
body > .container.text-center > img {
grid-row: 1; max-width: 240px; margin: 0; padding: 36px 24px 12px;
}
.adrixis-hero-tagline {
grid-row: 1; align-self: start; padding: 0 24px 36px;
}
body > .container.text-center > .row:first-of-type { grid-row: 2; }
body > .container.text-center > .row:first-of-type .panel-body { padding: 36px 24px !important; }
body > .container.text-center > p { grid-row: 3; }
}
body > .container.text-center .panel {
background: rgba(15, 23, 42, 0.92) !important;
border: 1px solid rgba(6, 182, 212, 0.3) !important;
backdrop-filter: blur(12px);
box-shadow: 0 25px 60px rgb(0 0 0 / 0.5),
0 0 40px rgb(6 182 212 / 0.12);
}
/* Login inputs — bright borders, light bg so fields are obviously visible
against the dark panel. Earlier version made them nearly invisible. */
body > .container.text-center .panel .input-group {
margin-bottom: 12px;
}
body > .container.text-center .panel .input-group-addon {
background: rgba(6, 182, 212, 0.18) !important;
border: 1px solid rgba(6, 182, 212, 0.55) !important;
border-right: none !important;
color: var(--adrixis-primary-light) !important;
min-width: 42px;
font-size: 14px;
}
body > .container.text-center .panel .form-control {
background: rgba(255, 255, 255, 0.08) !important;
border: 1px solid rgba(6, 182, 212, 0.45) !important;
border-left: none !important;
color: #ffffff !important;
font-size: 15px !important;
height: 42px !important;
padding: 10px 14px !important;
box-shadow: none !important;
transition: all 150ms;
}
body > .container.text-center .panel .form-control::placeholder {
color: rgba(203, 213, 225, 0.75) !important;
font-weight: 400;
}
body > .container.text-center .panel .form-control:focus {
background: rgba(255, 255, 255, 0.14) !important;
border-color: var(--adrixis-primary) !important;
box-shadow: 0 0 0 3px rgba(6, 182, 212, 0.28) !important;
outline: none !important;
}
body > .container.text-center .panel .input-group-addon + .form-control {
border-left: none !important;
}
/* The pre-filled "director" field should look read-only but still visible */
body > .container.text-center .panel .form-control[readonly] {
background: rgba(6, 182, 212, 0.06) !important;
color: var(--adrixis-primary-light) !important;
cursor: not-allowed;
font-family: var(--adrixis-font-mono) !important;
font-size: 13px !important;
}
/* The language selector dropdown */
body > .container.text-center .panel select.form-control,
body > .container.text-center .panel .bootstrap-select .btn {
background: rgba(255, 255, 255, 0.08) !important;
border: 1px solid rgba(6, 182, 212, 0.45) !important;
color: #ffffff !important;
}
body > .container.text-center .panel .bootstrap-select .btn:hover,
body > .container.text-center .panel .bootstrap-select .btn:focus {
background: rgba(255, 255, 255, 0.14) !important;
}
body > .container.text-center .panel .btn-primary {
width: 100%;
padding: 10px 16px !important;
font-size: 15px;
margin-top: 8px;
}
/* The footer
— after sub_filter it should contain only the copyright line
plus whitespace/
s. Clean it up visually. */
body > .container.text-center > p,
body > .container.text-center p:last-of-type {
margin-top: 32px;
font-size: 12px;
color: rgba(203, 213, 225, 0.5) !important;
text-align: center;
letter-spacing: 0.05em;
font-weight: 500;
}
body > .container.text-center > p br { display: none; }
body > .container.text-center > p a {
color: rgba(203, 213, 225, 0.5) !important;
text-decoration: none;
}
/* --- Hard-override sunflower theme login.css ------------------------------
The Bareos sunflower theme ships a login.css that sets a full-bleed yellow
sunflower photograph as body background and forces #submit to white/black.
nginx strips the tag, but we add belt-and-braces overrides in case
it ever slips through. These win on specificity + !important. */
body {
background-image: none !important;
background-color: var(--adrixis-bg) !important;
}
#submit,
input#submit,
input#submit.btn,
input#submit.btn-primary {
background-color: var(--adrixis-primary) !important;
background-image: none !important;
color: #ffffff !important;
border-color: var(--adrixis-primary) !important;
}
#submit:hover,
input#submit:hover {
background-color: var(--adrixis-primary-dark) !important;
color: #ffffff !important;
}
/* The sunflower theme forces .panel to transparent/no-border. Our card uses
.panel on the login page; make sure our dark glass styling wins. */
body > .container.text-center .panel-default,
body > .container.text-center .panel {
background: rgba(15, 23, 42, 0.92) !important;
border: 1px solid rgba(6, 182, 212, 0.3) !important;
box-shadow: 0 25px 60px rgb(0 0 0 / 0.5),
0 0 40px rgb(6 182 212 / 0.12) !important;
}
/* --- Dashboard navbar: harder override (post-login) ---------------------- */
.navbar-fixed-top,
.navbar-fixed-bottom,
nav.navbar {
background: linear-gradient(180deg, var(--adrixis-bg) 0%, var(--adrixis-bg-alt) 100%) !important;
background-color: var(--adrixis-bg) !important;
border-bottom: 1px solid rgba(6, 182, 212, 0.2) !important;
}
.navbar .navbar-toggle {
border-color: rgba(6, 182, 212, 0.3) !important;
}
.navbar .navbar-toggle .icon-bar {
background-color: var(--adrixis-primary-light) !important;
}
.navbar .dropdown-menu > li > a {
color: var(--adrixis-text-ink) !important;
}
.navbar .caret {
border-top-color: var(--adrixis-text-regular) !important;
}
/* --- Bareos default header color leaks (page-header is often colored) ---- */
.page-header,
.page-header h1,
.page-header h2,
.page-header h3 {
color: var(--adrixis-text-ink) !important;
border-bottom: 2px solid var(--adrixis-primary) !important;
padding-bottom: 10px;
}
/* --- Status pills: dashboard uses these for job statuses ---------------- */
.label.label-info-running,
.label.label-primary-waiting,
.label[class*="running"] {
background: var(--adrixis-info) !important;
color: #ffffff !important;
}
.label[class*="success"],
.label[class*="finished"],
.label[class*="ok"] {
background: var(--adrixis-success) !important;
color: #ffffff !important;
}
.label[class*="warning"],
.label[class*="canceled"] {
background: var(--adrixis-warning) !important;
color: #ffffff !important;
}
.label[class*="danger"],
.label[class*="error"],
.label[class*="fatal"],
.label[class*="failed"] {
background: var(--adrixis-danger) !important;
color: #ffffff !important;
}
/* --- Bootstrap-table (the Bareos jobs/clients/pools lists) --------------- */
.bootstrap-table .fixed-table-toolbar .btn,
.bootstrap-table .fixed-table-pagination .btn {
border-radius: var(--adrixis-radius-sm) !important;
}
.bootstrap-table .table > thead > tr > th {
background: var(--adrixis-bg) !important;
color: var(--adrixis-text-strong) !important;
}
.bootstrap-table .table > thead > tr > th .th-inner {
color: var(--adrixis-text-strong) !important;
}
/* --- Any residual bareos-vendor image (sunflower, Bareos.png) ----------- */
img[src*="bareos" i],
img[src*="sunflower" i],
img[src*="Bareos.png"] {
content: url('/adrixis-skin/logo-mark.svg') !important;
max-height: 32px;
width: auto;
}
/* Login page hero gets the bigger logo */
body > .container.text-center > img[src*="sunflower" i],
body > .container.text-center > img[src*="bareos" i] {
content: url('/adrixis-skin/logo-login.svg') !important;
}
/* --- Hide any lingering vendor subscription / donation links ------------ */
a[href*="bareos.com"]:not(.keep),
a[href*="bareos.org"]:not(.keep),
a[href*="/subscription"]:not(.keep),
a[href*="docs.bareos"]:not(.keep) {
display: none !important;
}
/* --- Fossil / commit-tracker link in About pages ------------------------ */
a[href*="fossil"],
a[href*="Fossil"] {
display: none !important;
}
/* --- Modals: dialogs should match brand (Bareos uses stock Bootstrap) --- */
.modal-content {
border-radius: var(--adrixis-radius-lg) !important;
border: 1px solid var(--adrixis-border-light) !important;
box-shadow: var(--adrixis-shadow-lg) !important;
}
.modal-header {
background: linear-gradient(180deg, #ffffff 0%, var(--adrixis-surface-muted) 100%) !important;
border-bottom: 1px solid var(--adrixis-border-light) !important;
border-radius: var(--adrixis-radius-lg) var(--adrixis-radius-lg) 0 0 !important;
}
.modal-title {
font-family: var(--adrixis-font-display) !important;
font-weight: 700 !important;
color: var(--adrixis-text-ink) !important;
}
.modal-footer {
border-top: 1px solid var(--adrixis-border-light) !important;
}
.close {
color: var(--adrixis-text-ink-muted) !important;
text-shadow: none !important;
opacity: 0.6;
}
.close:hover { opacity: 1; color: var(--adrixis-primary-dark) !important; }
/* --- Breadcrumbs (used on many sub-pages) ------------------------------- */
.breadcrumb {
background: transparent !important;
padding: 8px 0 !important;
margin-bottom: 16px !important;
font-size: 13px !important;
}
.breadcrumb > li > a { color: var(--adrixis-primary-dark) !important; }
.breadcrumb > .active { color: var(--adrixis-text-ink-muted) !important; }
.breadcrumb > li + li::before {
color: var(--adrixis-text-ink-muted) !important;
content: "/\00a0" !important;
}
/* --- Nav tabs (used in About / Configuration pages) --------------------- */
.nav-tabs {
border-bottom: 1px solid var(--adrixis-border-light) !important;
}
.nav-tabs > li > a {
color: var(--adrixis-text-ink-muted) !important;
border-radius: var(--adrixis-radius-sm) var(--adrixis-radius-sm) 0 0 !important;
margin-right: 2px !important;
border: 1px solid transparent !important;
font-weight: 500;
}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
color: var(--adrixis-primary-dark) !important;
border-color: var(--adrixis-border-light) var(--adrixis-border-light) #ffffff !important;
border-bottom-color: #ffffff !important;
background: #ffffff !important;
font-weight: 700;
}
.nav-tabs > li > a:hover {
background: var(--adrixis-surface-muted) !important;
border-color: transparent !important;
}
/* --- Progress bars (job progress) --------------------------------------- */
.progress {
background: var(--adrixis-surface-muted) !important;
border-radius: 999px !important;
height: 10px !important;
box-shadow: inset 0 1px 2px rgba(0,0,0,0.05) !important;
}
.progress-bar {
background: linear-gradient(90deg, var(--adrixis-primary) 0%, var(--adrixis-primary-light) 100%) !important;
border-radius: 999px !important;
}
.progress-bar-success { background: var(--adrixis-success) !important; }
.progress-bar-warning { background: var(--adrixis-warning) !important; }
.progress-bar-danger { background: var(--adrixis-danger) !important; }
.progress-bar-info { background: linear-gradient(90deg, var(--adrixis-primary) 0%, var(--adrixis-accent) 100%) !important; }
/* --- Chosen select / selectpicker (locale dropdown on login) ------------ */
.bootstrap-select > .dropdown-toggle {
background: rgba(2, 6, 23, 0.5) !important;
border-color: rgba(203, 213, 225, 0.15) !important;
color: var(--adrixis-text-strong) !important;
}
body > .container.text-center .bootstrap-select > .dropdown-toggle {
color: var(--adrixis-text-strong) !important;
}
/* --- Links on dark surfaces (navbar dropdowns, footer) ------------------ */
footer a:hover, .footer a:hover { color: var(--adrixis-primary) !important; }
/* --- Hide any "powered by" / vendor Fossil badges that might appear ----- */
.fossil-link,
.vendor-link,
[class*="powered-by-bareos"] {
display: none !important;
}