/*
	Theme: bagznetwork
	Prometheus Version: 1.6
	BagzNetwork RP - noir / bleu, animations fluides, zero glow.
	Ecrit a la main (pas genere par Admin > Theme editor).
	=> Ne JAMAIS re-sauvegarder ce theme depuis l'editeur admin, il ecraserait ce fichier.
*/

:root {
	--bg:        #070a0f;
	--bg-2:      #0b1018;
	--surface:   #0f1622;
	--surface-2: #141d2c;
	--surface-3: #1a2535;
	--border:    #1e2a3d;
	--blue:      #2f7fff;
	--blue-h:    #4d93ff;
	--blue-d:    #1d5ed1;
	--text:      #e7edf6;
	--text-dim:  #9aa8bd;
	--text-mute: #6f7d92;
	--ok:        #2ecc71;
	--err:       #e2504a;
	--r:         10px;
	--t:         .22s cubic-bezier(.4, 0, .2, 1);
}

/* ---------- Base ---------- */

body, .wrap {
	background-color: var(--bg) !important;
}

body {
	color: var(--text) !important;
	-webkit-font-smoothing: antialiased;
}

.content {
	animation: bn-fade .35s ease both;
}

@keyframes bn-fade {
	from { opacity: 0; transform: translateY(8px); }
	to   { opacity: 1; transform: none; }
}

hr {
	border-color: var(--border) !important;
}

a {
	color: var(--blue) !important;
	transition: color var(--t) !important;
}

a:hover, a:focus {
	color: var(--blue-h) !important;
	text-decoration: none !important;
}

h1, .header {
	color: #fff !important;
	font-weight: 700 !important;
	letter-spacing: -.01em;
}

h2, h3 { color: var(--text) !important; }
h6     { color: var(--blue) !important; }

::selection { background: var(--blue-d); color: #fff; }

/* ---------- Navbar ---------- */

.navbar-inverse {
	background-color: var(--bg-2) !important;
	border-bottom: 1px solid var(--border);
}

.navbar-inverse .navbar-nav > li > a {
	color: var(--text-dim) !important;
	position: relative;
	transition: color var(--t), background-color var(--t) !important;
}

/* soulignement qui glisse, pas de neon */
.navbar-inverse .navbar-nav > li > a:after {
	content: "";
	position: absolute;
	left: 50%; right: 50%; bottom: 6px;
	height: 2px;
	background: var(--blue);
	border-radius: 2px;
	transition: left var(--t), right var(--t);
}

.navbar-inverse .navbar-nav > li > a:hover:after,
.navbar-inverse .navbar-nav > .active > a:after {
	left: 14px; right: 14px;
}

.navbar-inverse .navbar-nav > .active > a,
.navbar-inverse .navbar-nav > .active > a:hover,
.navbar-inverse .navbar-nav > .active > a:focus,
.navbar-inverse .navbar-nav > li > a:hover,
.navbar-inverse .navbar-nav > li > a:focus {
	background-color: transparent !important;
	color: #fff !important;
}

.navbar-brand img {
	transition: transform var(--t) !important;
}

.navbar-brand:hover img {
	transform: scale(1.06);
}

.notify-icon {
	background: var(--err) !important;
	color: #fff !important;
}

/* ---------- Banniere / credits ---------- */

.banner {
	background-color: var(--bg-2) !important;
	border-bottom: 1px solid var(--border);
}

.credits {
	background-color: var(--surface-2) !important;
	color: var(--text) !important;
	border: 1px solid var(--border);
	border-radius: var(--r);
	padding: 8px 14px;
	transition: border-color var(--t) !important;
}

.credits:hover { border-color: var(--blue-d); }
.credits .fa-coins { color: var(--blue) !important; }

/* ---------- Boites / panels ---------- */

.options,
.dashboard-widget-small-box,
.panel-body,
.stat-box,
#sortable li {
	background-color: var(--surface) !important;
	border-radius: var(--r);
}

.options,
.dashboard-widget-small-box,
.panel-body,
.panel-body .panel-inner,
.stat-box {
	color: var(--text-dim) !important;
}

.panel-body > .panel-header,
.stat-box-header {
	background-color: var(--surface-2) !important;
	color: #fff !important;
	border-bottom: 1px solid var(--border);
}

.darker-box, .info-box {
	background-color: var(--bg-2) !important;
	border: 1px solid var(--border);
	border-radius: var(--r);
}

.dashboard-widget-small-box {
	border-color: var(--border) !important;
	transition: transform var(--t), background-color var(--t) !important;
}

.dashboard-widget-small-box:hover { transform: translateY(-3px); }
.dashboard-widget-small-box .element { color: var(--blue) !important; }
.dashboard-widget-small-box .caption { color: var(--text) !important; }
.dashboard-widget-small-box i, #sortable li i { color: var(--surface-3) !important; }

.bs-callout {
	background-color: var(--surface) !important;
	color: var(--text) !important;
	border-radius: var(--r);
}

.bs-callout-success { border-left-color: var(--ok) !important; }
.bs-callout-danger  { border-left-color: var(--err) !important; }
.bs-callout-info    { border-left-color: var(--blue) !important; }

/* ---------- Boutique ---------- */

.store-box,
.store-box-upper span,
.store-box-upper li {
	border-color: var(--border) !important;
}

.store-box {
	background-color: var(--surface) !important;
	border-radius: var(--r);
	overflow: hidden;
	transition: transform var(--t), border-color var(--t) !important;
}

.store-box:hover {
	transform: translateY(-4px);
	border-color: var(--blue-d) !important;
}

.store-box-header {
	background-color: var(--surface-2) !important;
	color: #fff !important;
}

.store-box-upper span { color: var(--blue) !important; }

.categoryLink {
	background-color: var(--surface-2) !important;
	color: var(--text) !important;
	border-radius: var(--r);
	transition: background-color var(--t), color var(--t) !important;
}

.categoryLink:hover {
	background-color: var(--surface-3) !important;
	color: #fff !important;
}

.credit-content {
	border-color: var(--border) !important;
	color: var(--blue) !important;
}

.credit-content span { color: var(--text-mute) !important; }

.srv-box {
	background-color: var(--surface) !important;
	border: 1px solid var(--border);
	border-radius: var(--r);
	transition: background-color var(--t), transform var(--t) !important;
}

.srv-box:hover {
	background-color: var(--surface-2) !important;
	transform: translateY(-3px);
}

.srv-box:hover .fa { color: var(--blue) !important; }
.srv-label { background-color: var(--blue-d) !important; }
a .srv-label { color: #fff !important; }

.pkg-step {
	background-color: var(--surface-2) !important;
	color: var(--text-dim) !important;
}

/* ---------- Boutons ---------- */

.btn-prom,
.buy-btn {
	border-radius: 8px !important;
	transition: background-color var(--t), transform var(--t), color var(--t) !important;
}

.btn-prom {
	background-color: var(--surface-3) !important;
	color: var(--text) !important;
	border: 1px solid var(--border) !important;
}

.btn-prom:hover, .btn-prom:focus {
	background-color: var(--surface-2) !important;
	color: #fff !important;
}

.buy-btn {
	background-color: var(--blue) !important;
	border-color: var(--blue) !important;
	color: #fff !important;
	font-weight: 600;
}

.buy-btn:hover, .buy-btn:focus {
	background-color: var(--blue-d) !important;
	border-color: var(--blue-d) !important;
	color: #fff !important;
}

.btn-prom:active, .buy-btn:active { transform: translateY(1px); }

/* ---------- Formulaires ---------- */

.form-control {
	background-color: var(--bg-2) !important;
	color: var(--text) !important;
	border: 1px solid var(--border) !important;
	border-radius: 8px !important;
	transition: border-color var(--t), background-color var(--t) !important;
}

.form-control::placeholder { color: var(--text-mute) !important; }

.form-control:focus {
	border-color: var(--blue) !important;
	background-color: var(--surface) !important;
	box-shadow: none !important;
}

.icheckbox_line-red, .iradio_line-red {
	background: var(--surface-2) !important;
	color: var(--text) !important;
	border-color: var(--border) !important;
}

.icheckbox_line-red.checked, .iradio_line-red.checked {
	border-color: var(--blue) !important;
}

/* ---------- Dropdown / pagination / tables ---------- */

.dropdown-menu {
	background-color: var(--surface) !important;
	color: var(--text) !important;
	border: 1px solid var(--border) !important;
	border-radius: var(--r) !important;
	animation: bn-drop .18s ease both;
}

@keyframes bn-drop {
	from { opacity: 0; transform: translateY(-6px); }
	to   { opacity: 1; transform: none; }
}

.dropdown-menu > li > a,
.dropdown-menu .dropdown-item {
	transition: background-color var(--t), color var(--t) !important;
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
	background-color: var(--surface-2) !important;
	color: #fff !important;
}

.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
	background-color: var(--blue-d) !important;
	color: #fff !important;
}

.pagination li a {
	background-color: var(--surface) !important;
	color: var(--text-dim) !important;
	border-color: var(--border) !important;
	transition: background-color var(--t), color var(--t) !important;
}

.pagination li a:hover, .pagination li a:focus {
	background-color: var(--surface-2) !important;
	color: #fff !important;
}

.pagination > .active > a,
.pagination > .active > a:hover,
.pagination > .active > a:focus {
	background-color: var(--blue-d) !important;
	color: #fff !important;
	border-color: var(--blue-d) !important;
}

.table { color: var(--text-dim) !important; }

.table-striped thead {
	background-color: var(--bg-2) !important;
	color: var(--blue) !important;
}

.table-striped > tbody > tr:nth-of-type(odd) {
	background-color: var(--surface) !important;
	color: var(--text) !important;
}

.table-striped > tbody > tr {
	transition: background-color var(--t) !important;
}

.table-striped > tbody > tr:hover {
	background-color: var(--surface-2) !important;
}

/* ---------- Modals ---------- */

.modal-content {
	background-color: var(--surface) !important;
	color: var(--text) !important;
	border: 1px solid var(--border) !important;
	border-radius: var(--r) !important;
}

.modal-header {
	background-color: var(--bg-2) !important;
	color: #fff !important;
	border-bottom: 1px solid var(--border) !important;
}

.modal-footer {
	background-color: var(--bg-2) !important;
	border-top: 1px solid var(--border) !important;
}

/* ---------- Support ---------- */

.ticket-header {
	background-color: var(--surface-2) !important;
	color: var(--text) !important;
	border-radius: var(--r) var(--r) 0 0;
}

/* ---------- Barre de don ---------- */

.progress {
	background-color: var(--bg-2) !important;
	border-radius: 999px !important;
	overflow: hidden;
}

.progress-bar, .progress-bar-danger {
	background-color: var(--blue) !important;
	transition: width .6s cubic-bezier(.4, 0, .2, 1) !important;
}

/* ---------- Footer ---------- */

.footer {
	background-color: var(--bg-2) !important;
	color: var(--text-dim) !important;
	border-top: 1px solid var(--border);
}

.version { color: var(--text-mute) !important; }
.tos-link { color: var(--text-dim) !important; }

/* ---------- Panel admin ---------- */

.main-menu-box, .version-marker {
	background-color: var(--bg-2) !important;
	border-right: 1px solid var(--border);
}

.main-menu-box ul li {
	color: var(--text-dim) !important;
	transition: background-color var(--t), color var(--t), padding-left var(--t) !important;
}

.main-menu-box ul li:hover {
	background-color: var(--surface) !important;
	padding-left: 22px;
}

.main-menu-box ul li.active {
	background-color: var(--surface-2) !important;
	color: #fff !important;
	box-shadow: inset 3px 0 0 var(--blue);
}

.main-menu-box .sub-menu { background-color: var(--bg) !important; }
.main-menu-box ul.sub-menu .submenu-header { color: var(--blue) !important; }
.version-marker { color: var(--text-mute) !important; }

.content-page-top {
	background-color: var(--bg-2) !important;
	border-bottom: 1px solid var(--border);
}

.content-page-top > span,
.content-page-top > span > i { color: #fff !important; }
.content-page-top:after { border-color: var(--bg-2) transparent transparent !important; }

.dashboard-nav, .dashboard-nav a { background-color: var(--surface) !important; }

.dashboard-nav a {
	color: var(--text-dim) !important;
	transition: background-color var(--t), color var(--t) !important;
}

.dashboard-nav a:hover, .dashboard-nav a:focus {
	background-color: var(--surface-2) !important;
	color: #fff !important;
}

.dashboard-nav a.active {
	background-color: var(--blue-d) !important;
	color: #fff !important;
}

/* ---------- Scrollbar ---------- */

* { scrollbar-color: var(--surface-3) var(--bg); scrollbar-width: thin; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb {
	background: var(--surface-3);
	border-radius: 999px;
	transition: background var(--t);
}
::-webkit-scrollbar-thumb:hover { background: var(--blue-d); }

/* ---------- Accessibilite ---------- */

a:focus-visible,
button:focus-visible,
.buy-btn:focus-visible,
.btn-prom:focus-visible {
	outline: 2px solid var(--blue-h) !important;
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	*, *:before, *:after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
}

/* ---------- Visuels BagzNetwork (banniere, cartes packs) ---------- */

.banner img {
	height: 100px;
	width: auto;
	max-width: 100%;
	object-fit: contain;
}

.store-box-upper img {
	display: block;
	object-fit: cover;
}

.store-box-lower ul {
	display: inline-block;
	text-align: left;
	margin: 0 auto 12px;
	padding-left: 1.2em;
}

.store-box-lower li { padding: 2px 0; }
.store-box-lower li::marker { color: var(--blue); }

@media (max-width: 576px) {
	.banner img { height: 64px; }
}