/*

    @name Dark
    @icon bi bi-moon-fill
    @priority 998

*/

html.theme-dark {
  --bs-body-bg: #121212;
  --bs-body-color: white;
  --bs-body-color-rgb: 255, 255, 255;
  --bs-secondary-color: rgba(183, 202, 222, 0.75);
  --bs-dark-bg-subtle: #232323;
  --bs-tertiary-bg: #4c4e4f;
  --bs-border-color: #404040;
}

html.theme-dark .btn-primary {
  --bs-btn-color: #dcdcdc;
}

html.theme-dark .site-title {
  color: #4b91ff !important;
}


html.theme-dark a.nav-link {
  color: var(--bs-body-color) !important;
}

html.theme-dark a.nav-link:hover {
  color: #b3d0e6 !important;
}

html.theme-dark a.nav-link:active {
  color: #b3d0e6 !important;
}

html.theme-dark .bg-success {
  background-color: rgb(0, 107, 59) !important;
  color: #d5d5d5 !important;
}

html.theme-dark .bg-success:hover {
  background-color: rgb(0, 149, 82) !important;
  color: #d5d5d5 !important;
}

html.theme-dark .accordion-button:not(.collapsed) {
  background-color: #232323 !important;
  box-shadow: none !important;
  color: var(--bs-body-color) !important;
}

html.theme-dark .carousel-dark .carousel-control-next-icon,
html.theme-dark .carousel-dark .carousel-control-prev-icon {
  filter: none;
}

html.theme-dark .carousel-indicators {
  filter: invert(1);
}

html.theme-dark .bsfc-container {
  background-color: var(--bs-body-bg) !important;
  border-width: 3px;
}

html.theme-dark .dropdown-item.active {
  background-color: #4b91ff;
}

html.theme-dark a.btn-primary,
html.theme-dark .bg-primary {
  color: white;
}

html.theme-dark .tooltip-inner {
  color: var(--bs-body-color);
}

html.theme-dark .upsell-mini.has-feature {
    border: 1px solid var(--bs-success-border-subtle);
    background: var(--bs-dark-bg-subtle);
}


/* Menu */


html.theme-dark .user-menu {
    background-color: #0d1117;
    border-right-color: #30363d;
}
  
html.theme-dark .user-menu .list-group-item a {
    color: var(--bs-body-color);
}

html.theme-dark .user-menu .list-group-item a:hover {
    background-color: #21262d;
    color: var(--bs-body-color);
}

html.theme-dark .user-menu .list-group-item a[aria-current="page"]:before,
html.theme-dark .user-menu .list-group-item a.active:before {
    background-color: #4b91ff;
}

html.theme-dark .user-menu .list-group-item a.no-invites-available {
    color: #8b949e;
}

html.theme-dark .user-menu .list-group-item a.no-invites-available:hover {
    color: #8b949e;
}

html.theme-dark .user-menu h4 {
    color: #8b949e;
}

html.theme-dark .user-menu .admin-section {
    border-top-color: #30363d;
}


/*feed account*/
html.theme-dark button.form-control {
    background: none !important;
}

html.theme-dark .bg-white {
    background-color: #37373791 !important;
    backdrop-filter: blur(10px);
    color: white;
}
html.theme-dark .bg-light, 
html.theme-dark .btn-light {
    background-color: #ffffff38 !important;
}

html.theme-dark [class="d-flex align-items-center p-2 cursor-pointer"]:hover {
    background-color: #54535391 !important
}

/*upload image button*/
html.theme-dark input#image[type="file"]::file-selector-button {
	border: 1px solid #b32b6a;
  	padding: .2em .4em;
 	border-radius: .2em;
 	background-color: #4b102ba1;
 	transition: 0.3s;
 	color: #b32b6a;
	cursor: pointer;
}
html.theme-dark input#image[type="file"]::file-selector-button:hover {
  	padding: .2em .4em;
 	border-radius: .2em;
 	background-color: #b32b6a;
 	transition: 0.1s;
 	color: white;
}


/* chart theming */
html.theme-dark canvas {
	background: #12171ef7;
  padding: 1em;
	border-radius: 1rem;
	border: 2px solid #777;
}



/* tooltips */
html.theme-dark .tooltip-inner {
  color: white;
  background: #313131;
}

/* approve deny bg */
html.theme-dark .modal.fade.bg-success {	
	background: #00955273 !important;
}

html.theme-dark .modal.fade.bg-danger {
	background: #ff000012 !important;
}

html.theme-dark .modal.fade.bg-warning {
	background: #4236094f !important;
}


/*Callouts and alerts*/
html.theme-dark .callout-info {
    background-color: #313131 !important;
    border-color: #777 !important;
    color: white !important;
}

html.theme-dark .alert-primary,
html.theme-dark .alert-info {
    background-color: #313131 !important;
    border-color: #777 !important;
    color: white !important;
}

html.theme-dark .alert-danger {
    background-color: #ff00004f !important;
    border-color: #777 !important;
    color: white !important;
}


/*Posts*/

html.theme-dark div.pinned-posts-carousel {
    background-color: var(--bs-body-bg);
    border: solid #a300ff 2px !important;
    border-radius: 5px;
}