/* CrossTrack Scout theme for MantisBT 2.x
 * Scout is a melanistic coyote with cross-fox colouring: warm neutrals over
 * near-black browns, rust primary actions, Inter typeface.
 * Token source: FursOnIceReg sql/migrations/007_themes.sql (Scout seed).
 */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root {
	--ct-bg:           #16110D;  /* Coal - page ground (boxdark-2) */
	--ct-surface:      #221B15;  /* Soot - cards & sidebar (boxdark) */
	--ct-surface-2:    #2C231B;  /* Ash - table head, chips (meta-4) */
	--ct-hover:        #2C231B;  /* Ash - hover states (graydark) */
	--ct-input-bg:     #1B1511;  /* form inputs */
	--ct-border:       #2C231B;  /* Ash - strokedark */
	--ct-input-border: #3A2E23;  /* form-strokedark */
	--ct-primary:      #B04E1B;  /* deep rust - white label passes WCAG AA */
	--ct-primary-dim:  #96430F;
	--ct-link:         #E58A45;  /* Ember - links & hovers */
	--ct-info:         #E58A45;
	--ct-ice:          #D2622A;  /* bright rust - decorative accent */
	--ct-success:      #4FA87C;
	--ct-warning:      #DFB13E;
	--ct-danger:       #E06550;
	--ct-text:         #C9BCA9;  /* bodydark - Birch/Fawn midpoint */
	--ct-text-bright:  #EFE5D3;  /* Birch - labels, table headings */
	--ct-text-muted:   #A2937E;  /* Fawn - muted */
	--ct-white:        #FFFDF9;  /* warm near-white; pure white reads cold here */
	--ct-radius:       2px;      /* cards: rounded-sm */
	--ct-radius-md:    6px;      /* buttons & inputs: rounded-md */
	--ct-shadow:       0px 8px 13px -3px rgba(0, 0, 0, 0.07);
}

/* ---------- base ---------- */

body, html {
	background-color: var(--ct-bg) !important;
	color: var(--ct-text);
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

.main-content, .page-content, .main-container,
.main-container:before, .main-container.container:before,
.skin-3 .main-container:before {
	background: var(--ct-bg) !important;
}

a { color: var(--ct-link) !important; }
a:hover { color: var(--ct-ice) !important; }
a i { color: var(--ct-text-muted) !important; }

.page-header h1, h1, h2, h3, h4, h5 { color: var(--ct-text-bright); }
.lead, p { color: var(--ct-text); }
.white { color: var(--ct-white) !important; }

/* ---------- top navbar ---------- */

.navbar {
	background-color: var(--ct-surface) !important;
	border-bottom: 1px solid var(--ct-border);
	box-shadow: none;
}

.navbar .navbar-brand,
.ace-nav > li > a > .ace-icon,
.ace-nav > li.grey > a {
	color: var(--ct-text-bright) !important;
	font-weight: 600;
}

.ace-nav > li { border-left: 0 !important; background: transparent !important; }
.ace-nav > li > a { background: transparent !important; color: var(--ct-text-bright) !important; }
.ace-nav > li > a:hover { background: var(--ct-hover) !important; }

/* ---------- breadcrumbs / project bar ---------- */

.breadcrumbs {
	background-color: var(--ct-surface) !important;
	border: 0 !important;
	border-bottom: 1px solid var(--ct-border) !important;
	border-radius: 0 !important;
	padding: 10px !important;
}

.breadcrumbs a, .breadcrumb > li, .breadcrumb > li.active,
.breadcrumbs .nav-search-icon {
	color: var(--ct-text-bright) !important;
}

.breadcrumb > li + li:before { color: var(--ct-text-muted); }

.breadcrumbs .nav-search-input {
	background-color: var(--ct-input-bg) !important;
	border: 1px solid var(--ct-input-border) !important;
	border-radius: var(--ct-radius-md) !important;
	color: var(--ct-text-bright) !important;
}

/* ---------- sidebar ---------- */

.skin-3 .sidebar, .sidebar {
	background-color: var(--ct-surface) !important;
	border-color: var(--ct-border) !important;
	border-width: 0 1px 0 0 !important;
}

.nav-list, .skin-3 .nav-list > li,
.skin-3 .nav-list > li > a, .skin-3 .nav-list > li.active > a {
	background-color: inherit !important;
	border-color: var(--ct-border) !important;
}

.skin-3 .nav-list > li > a:hover,
.skin-3 .nav-list > li.active.highlight > a,
.skin-3 .nav-list > li.active > a,
.sidebar.compact .nav-list > li > a:hover {
	background-color: var(--ct-hover) !important;
	border-color: var(--ct-hover) !important;
}

.menu-text { color: var(--ct-text-bright) !important; font-weight: 500; }
.menu-icon { color: var(--ct-text-muted) !important; }
.nav-list a:hover .menu-text { color: var(--ct-white) !important; }
.nav-list a:hover .menu-icon { color: var(--ct-ice) !important; }
.nav-list > li.active .menu-icon { color: var(--ct-ice) !important; }
.nav-list > li.active > a { font-weight: 600 !important; }

.nav-list li.active > a:before,
.skin-3 .nav-list li.active > a::before { display: none; }

.nav-list > li:before, .nav-list > li:after,
.skin-3 .nav-list > li.open:before,
.skin-3 .nav-list > li:hover:before,
.skin-3 .nav-list > li.active:before,
.skin-3 .nav-list > li.active + li:before {
	background-color: var(--ct-primary) !important;
}

.sidebar-toggle, .skin-3 .sidebar-toggle {
	background-color: inherit !important;
	border-color: var(--ct-border) !important;
	color: var(--ct-ice) !important;
}

.sidebar-toggle > .ace-icon, .skin-3 .sidebar-toggle > .ace-icon {
	background-color: var(--ct-surface) !important;
	border-color: var(--ct-ice) !important;
	color: var(--ct-ice) !important;
}

.sidebar-shortcuts, .sidebar-shortcuts-mini {
	background-color: var(--ct-surface) !important;
	border-color: var(--ct-border) !important;
}

/* ---------- widgets / cards ---------- */

.widget-box {
	background-color: var(--ct-surface) !important;
	border: 1px solid var(--ct-border) !important;
	border-radius: var(--ct-radius) !important;
	box-shadow: var(--ct-shadow);
}

.widget-header,
.widget-color-blue2 > .widget-header,
[class*="widget-color-"] > .widget-header {
	background-color: var(--ct-surface) !important;
	border: 0 !important;
	border-bottom: 1px solid var(--ct-border) !important;
	color: var(--ct-white) !important;
}

.widget-title, .widget-header > .widget-title { color: var(--ct-white) !important; font-weight: 600; }
.widget-header .badge { background-color: var(--ct-surface-2) !important; color: var(--ct-text-bright); }

.widget-body, .widget-main {
	background-color: transparent !important;
	color: var(--ct-text) !important;
	border: 0 !important;
}

.widget-toolbox {
	background-color: var(--ct-surface-2) !important;
	border: 0 !important;
	border-top: 1px solid var(--ct-border) !important;
}

[class*="widget-color-"] > .widget-header > .widget-toolbar::before {
	border-color: transparent !important;
}

.well {
	background-color: var(--ct-surface-2) !important;
	border-color: var(--ct-border) !important;
	color: var(--ct-text-bright);
}

/* ---------- tables ---------- */

.table { background-color: inherit !important; color: var(--ct-text) !important; }

.table-bordered { border: 1px solid var(--ct-border) !important; background-color: transparent !important; }

.widget-body .table th, .widget-main .table th,
.widget-body .table thead tr td, .widget-main .table thead tr td {
	background-color: var(--ct-surface-2) !important;
	color: var(--ct-text-bright) !important;
	border: 0 !important;
	border-bottom: 1px solid var(--ct-border) !important;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

.widget-body .table thead, .widget-main .table thead {
	background-color: var(--ct-surface-2) !important;
}

.widget-body .table, .widget-main .table {
	background-color: transparent !important;
	color: var(--ct-text) !important;
}

.table-bordered > tbody > tr > td,
.widget-body .table td, .widget-main .table td {
	border: 0 !important;
	border-top: 1px solid var(--ct-border) !important;
	vertical-align: middle;
}

.widget-body .table-striped > tbody > tr,
.widget-main .table-striped > tbody > tr {
	background-color: transparent !important;
}

.widget-body .table-striped > tbody > tr:nth-of-type(odd),
.widget-main .table-striped > tbody > tr:nth-of-type(odd) {
	background-color: rgba(44, 35, 27, 0.45) !important;
}

.widget-body .table-striped > tbody > tr:hover,
.widget-main .table-striped > tbody > tr:hover,
.table-hover > tbody > tr:hover {
	background-color: rgba(44, 35, 27, 0.85) !important;
}

.widget-body .table a, .widget-main .table a {
	color: var(--ct-link) !important;
	font-weight: 500;
}

.widget-body .table a.btn, .widget-main .table a.btn { color: var(--ct-white) !important; }

.widget-body .table-responsive, .widget-main .table-responsive {
	background-color: transparent !important;
	color: var(--ct-text) !important;
}

tr.spacer { background-color: var(--ct-bg) !important; }
.table-hover > tbody > tr.spacer:hover { background-color: var(--ct-bg) !important; }
.buglist-headers { border-bottom: 1px solid var(--ct-border) !important; }

/* default.css paints #edf3f4 on category cells AND their inline labels -
   override the full selector set: white text, transparent backgrounds */
td.category, th.category,
td.category label, th.category label {
	background: transparent !important;
	color: var(--ct-white) !important;
	font-weight: 500 !important;
}

tr.bugnote .bugnote-note {
	background-color: var(--ct-surface-2) !important;
	color: var(--ct-text-bright) !important;
}

td.bug-tags, label.inline.small { color: var(--ct-text-muted); }
span.required { color: var(--ct-danger) !important; }

/* ---------- buttons ---------- */

.btn {
	border-radius: var(--ct-radius-md) !important;
	font-weight: 500;
	transition: background-color .15s ease, opacity .15s ease;
}

.btn.btn-white, .btn-primary, .btn.btn-white.btn-primary {
	background-color: var(--ct-primary) !important;
	border-color: var(--ct-primary) !important;
	color: var(--ct-white) !important;
}

.btn.btn-white.active, .btn-primary.active,
.btn.btn-white.btn-primary.active,
.btn.btn-white:hover, .btn-primary:hover,
.btn.btn-white.btn-primary:hover,
.btn-primary.no-hover:active, .btn-primary.no-hover:hover {
	background-color: var(--ct-primary-dim) !important;
	border-color: var(--ct-primary-dim) !important;
}

.btn-toolbar { padding: 10px 0 !important; background-color: transparent !important; }

/* ---------- forms ---------- */

.form-control, .input-sm, input, .form-inline .input-sm,
textarea.form-control, input.form-control, select, .dropzone {
	background-color: var(--ct-input-bg) !important;
	color: var(--ct-text-bright) !important;
	border: 1px solid var(--ct-input-border) !important;
	border-radius: var(--ct-radius-md) !important;
}

.form-control:focus, input:focus, textarea.form-control:focus, select:focus {
	border-color: var(--ct-primary) !important;
	outline: none;
	box-shadow: none !important;
}

input::placeholder, textarea::placeholder { color: var(--ct-text-muted) !important; }

input[type="checkbox"], input[type="radio"] { background-color: transparent !important; border: 0 !important; }
input[type="file"] { padding: 10px; }
input[type="submit"], input[type="button"], button.btn {
	border-radius: var(--ct-radius-md) !important;
}

.dropzone { border-style: dashed !important; }

/* ---------- labels / status pills ---------- */

.label {
	border-radius: 9999px !important;
	padding: 3px 10px;
	font-weight: 600;
	color: #16110D;  /* dark text on the pastel status colors */
}

.label:before, .label:after { display: none !important; }
.label.arrowed, .label.arrowed-in { border-radius: 9999px !important; }
.label-hide { display: none; }

/* ---------- tabs ---------- */

.nav-tabs { border-bottom: 1px solid var(--ct-border) !important; }

.nav-tabs > li > a, .nav-tabs > li > a:focus {
	background-color: transparent !important;
	color: var(--ct-text-muted) !important;
	border: 0 !important;
	border-radius: 0 !important;
	font-weight: 500;
}

.nav-tabs a:hover {
	background-color: var(--ct-hover) !important;
	color: var(--ct-text-bright) !important;
	border: 0 !important;
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
	background-color: var(--ct-surface) !important;
	color: var(--ct-white) !important;
	border: 0 !important;
	border-bottom: 2px solid var(--ct-primary) !important;
}

/* ---------- dropdown menus ---------- */

.dropdown-toggle { background-color: transparent !important; }
.dropdown-toggle:hover { background-color: var(--ct-hover) !important; }

.dropdown-menu, .menu-min .menu-text {
	background-color: var(--ct-surface) !important;
	border: 1px solid var(--ct-border) !important;
	border-radius: var(--ct-radius-md) !important;
	box-shadow: var(--ct-shadow);
}

.dropdown-menu a { color: var(--ct-text-bright) !important; }

.dropdown-menu .search {
	background-color: var(--ct-input-bg) !important;
	color: var(--ct-text-bright) !important;
}

.dropdown-menu li.active:hover > a, .dropdown-menu li.active > a,
.dropdown-menu li:hover > a, .dropdown-menu li > a:active,
.dropdown-menu li > a:focus {
	background-color: var(--ct-primary) !important;
	color: var(--ct-white) !important;
}

/* ---------- pagination ---------- */

.pager > li > a, .pagination > li > a {
	background-color: var(--ct-surface) !important;
	border-color: var(--ct-border) !important;
	color: var(--ct-text-bright) !important;
}

.pagination > li.active > a, .pagination > li.active > a:hover {
	background-color: var(--ct-primary) !important;
	border-color: var(--ct-primary) !important;
	color: var(--ct-white) !important;
}

.pager > li.disabled > a, .pager > li.disabled > a:hover,
.pagination > li.disabled > a, .pagination > li.disabled > a:hover {
	color: var(--ct-text-muted) !important;
	background-color: var(--ct-bg) !important;
}

/* ---------- alerts ---------- */

.alert {
	border-radius: var(--ct-radius-md);
	border-width: 1px;
}

.alert-success {
	background-color: rgba(79, 168, 124, 0.15) !important;
	border-color: rgba(79, 168, 124, 0.4) !important;
	color: #7CC9A0 !important;
}

.alert-warning {
	background-color: rgba(223, 177, 62, 0.15) !important;
	border-color: rgba(223, 177, 62, 0.4) !important;
	color: var(--ct-warning) !important;
}

.alert-danger, .alert-error {
	background-color: rgba(224, 101, 80, 0.15) !important;
	border-color: rgba(224, 101, 80, 0.4) !important;
	color: #EFA294 !important;
}

.alert-info {
	background-color: rgba(229, 138, 69, 0.15) !important;
	border-color: rgba(229, 138, 69, 0.4) !important;
	color: var(--ct-link) !important;
}

/* ---------- login pages ---------- */

.login-layout, .login-layout .main-content {
	background-color: var(--ct-bg) !important;
}

.login-container .widget-box,
.signup-box.widget-box, #login-box {
	background-color: var(--ct-surface) !important;
	border: 1px solid var(--ct-border) !important;
	border-radius: var(--ct-radius) !important;
	box-shadow: var(--ct-shadow);
}

.login-box .widget-main, .signup-box .widget-main {
	background-color: transparent !important;
}

.login-layout .widget-box .widget-main { background-color: var(--ct-surface) !important; }

.login-box .header, .signup-box .header, .login-layout h4.header {
	color: var(--ct-white) !important;
	border-bottom-color: var(--ct-border) !important;
}

.login-layout label, .login-container label { color: var(--ct-text-bright); }

/* ---------- misc ---------- */

.footer-content {
	background-color: var(--ct-surface) !important;
	border-top: 1px solid var(--ct-border) !important;
	color: var(--ct-text-muted);
}

.footer, .footer a { color: var(--ct-text-muted) !important; }

.profile-activity { border-color: var(--ct-border) !important; }
.profile-activity:nth-of-type(even) { background-color: rgba(44, 35, 27, 0.45) !important; }
.profile-activity:hover, .profile-activity:nth-of-type(odd):hover {
	background-color: rgba(44, 35, 27, 0.85) !important;
}
.profile-activity .thumbicon { border-radius: 100% !important; }

.bootstrap-datetimepicker-widget, .bootstrap-datetimepicker-widget * {
	background-color: var(--ct-surface) !important;
	color: var(--ct-text-bright) !important;
}

.bootstrap-datetimepicker-widget td.day:hover,
.bootstrap-datetimepicker-widget span.month:hover,
.bootstrap-datetimepicker-widget span.year:hover {
	background-color: var(--ct-hover) !important;
}

.bootstrap-datetimepicker-widget td.day.active,
.bootstrap-datetimepicker-widget span.month.active,
.bootstrap-datetimepicker-widget span.year.active {
	background-color: var(--ct-primary) !important;
	color: var(--ct-white) !important;
}

.arrow { z-index: -1; background-color: transparent !important; }
.arrow::after { border-right-color: var(--ct-primary) !important; }

.small-caption { font-size: 9pt; }

.color-global { background-color: var(--ct-surface-2); }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--ct-bg); }
::-webkit-scrollbar-thumb { background: var(--ct-surface-2); border-radius: 5px; }
::-webkit-scrollbar-thumb:hover { background: var(--ct-hover); }