/* Custom CSS for osTicket 1.17.6 - Dark Theme with specified colors */
/* Primary colors: #fe00fe (magenta), #00ff9f (cyan), #00b3fe (blue) */

/* Global styles */
body {
    margin: 0 !important;
	background-color: #1a1a1a !important;
	background-image: none !important;
	background-repeat: no-repeat !important;
    color: #e0e0e0 !important;
    font-family: Arial, sans-serif !important;
}

/* Horizontal rules */
hr {
    border: none !important;
	background: none !important;
}

ul {
    background-color: #222222 !important;
	border: none !important;
	background-image: none !important;
	background-repeat: no-repeat !important;
}

/* Header */
header, #header {
    background-color: #2a2a2a !important;
    border-bottom: 2px solid #fe00fe !important;
}

/* Navigation */
#navigation, .navbar, #nav, .client-nav, .navbar-nav, .navbar.navbar-default, .navbar-inverse {
    background: #2a2a2a !important;
    background-color: #2a2a2a !important;
    background-image: none !important;
	background-repeat: no-repeat !important;
	width: 100% !important;
    margin: 0 !important;
	margin-bottom: 10px !important;
    padding: 0 !important;
    left: 0 !important;
    right: 0 !important;
}
#nav li a.active,
#nav li a:hover {
	background-color: #fe00fe !important;
	color: rgb(224, 224, 224) !important;
}
#nav li a:hover {
	background-color: #fe00fe !important;
	color: rgb(224, 224, 224) !important;
}

#nav {
	height: 33px !important;
	overflow: hidden !important;
	padding-top: 16px !important;
}

#navigation, .navbar, .nav {
    background-color: #999999 !important;
	background: none !important;
}



#navigation a, .nav-item a {
    color: #00b3fe !important;
}

#navigation a:hover, .nav-item a:hover {
    color: #fe00fe !important;
    background-color: #444444 !important;
}

/* Main content */
#content, #container, .container {
    background-color: #222222 !important;
    border: none !important;
	border-image: none !important;
	border-image-repeat: no-repeat;
}

#content {
	padding: 0 !important;
    min-height: 100vh !important; /* Ensure content takes at least viewport height */
}

div.thread-body, div.content{
	background-color: transparent !important;
}

div.thread-body{
	color: rgb(224, 224, 224) !important;
}

/*.table, table {
    background-color: #2a2a2a !important;
    color: #e0e0e0 !important;
}

.table th, table th {
    background-color: #333333 !important;
    color: #00ff9f !important;
    border-bottom: 2px solid #fe00fe !important;
}

.table td, table td {
    border: 1px solid #00b3fe !important;
}*/

#kb li{
	background-image:none !important;
	background-repeat:no-repeat !important;
}
/* Buttons */
.btn, .button, input[type=submit], input[type=button], input[type=reset] {
    background-color: #00b3fe !important;
    padding: 6px;
	color: #ffffff !important;
    border: none !important;
	border-radius: 8px;
	margin-bottom: 16px;
}

.btn:hover, .button:hover, input[type=submit]:hover, input[type=button]:hover, input[type=reset]:hover{
    background-color: #fe00fe !important;
    color: #ffffff !important;
}

/* Forms */
.redactor-box.redactor-styles-on.redactor-toolbar-on.redactor-blur{
	background-color: rgb(224 ,224, 224) !important;
	color: rgb(58, 58, 58) !important;
	border: 1px solid #444444 !important;
}

.redactor-statusbar li{
	
color: rgb(224, 224, 224) !important;
	
}

.redactor-box.redactor-styles-on.redactor-toolbar-on.redactor-blur:focus{
  /* Your CSS styles go here */
	border-color: #fe00fe !important;
    box-shadow: 0 0 5px #fe00fe !important;
}

input[type=text], input[type=password], input[type=email], input[type=tel], textarea, select {
    background-color: rgb(224 ,224, 224) !important;
    color: rgb(58, 58, 58) !important;
    border: 1px solid #444444 !important;
	
}

input[type=text]:focus, input[type=password]:focus, input[type=email]:focus, input[type=tel]:focus, textarea:focus, select:focus {
    border-color: #fe00fe !important;
    box-shadow: 0 0 5px #fe00fe !important;
}

/* Alerts and notices */
/*.alert, .error, .warning, .success {
    border: 1px solid #00b3fe !important;
}

.alert.error {
    background-color: #4a1a1a !important;
    color: #ff6666 !important;
}

.alert.success {
    background-color: #1a4a1a !important;
    color: #00ff9f !important;
}

.alert.warning {
    background-color: #4a4a1a !important;
    color: #ffff66 !important;
}
*/
/* Ticket thread */
.thread-entry, .ticket-thread {
    background-color: #2a2a2a !important;
    border: 1px solid #00ff9f !important;
}

.thread-entry .header {
    background-color: #333333 !important;
    color: #00b3fe !important;
}

/* Footer */
footer, #footer {
    background-color: #2a2a2a !important;
    color: #00ff9f !important;
    border-top: 2px solid #fe00fe !important;
}

a {
    color: #00b3fe !important;
}

a:hover {
    color: #fe00fe !important;
}

/* Dropdowns */
.dropdown-menu {
    background-color: #333333 !important;
    border: 1px solid #00b3fe !important;
}

.dropdown-menu a {
    color: #00ff9f !important;
}

.dropdown-menu a:hover {
    background-color: #fe00fe !important;
    color: #000000 !important;
}

/* Modals */
.modal-content {
    background-color: #222222 !important;
    color: #e0e0e0 !important;
    border: 1px solid #00ff9f !important;
}

.modal-header {
    background-color: #333333 !important;
    border-bottom: 1px solid #fe00fe !important;
}

.modal-footer {
    background-color: #333333 !important;
    border-top: 1px solid #fe00fe !important;
}

/* Ensure contrast for accessibility */
h1, h2, h3, h4, h5, h6 {
    color: #00ff9f !important;
}

label {
    color: #e0e0e0 !important;
}

/* Custom scrollbar */
::-webkit-scrollbar {
    width: 8px !important;
}

::-webkit-scrollbar-track {
    background: #2a2a2a !important;
}

::-webkit-scrollbar-thumb {
    background: #00b3fe !important;
    border-radius: 4px !important;
}

::-webkit-scrollbar-thumb:hover {
    background: #fe00fe !important;
}

/* Override browser autofill styles */
input[type=text]:-webkit-autofill,
input[type=email]:-webkit-autofill,
input[type=tel]:-webkit-autofill,
input[type=password]:-webkit-autofill,
input[type=text]:autofill,
input[type=email]:autofill,
input[type=tel]:autofill,
input[type=password]:autofill {
    -webkit-box-shadow: 0 0 0 1000px #333333 inset !important;
    box-shadow: 0 0 0 1000px #333333 inset !important;
    -webkit-text-fill-color: #e0e0e0 !important;
    color: #e0e0e0 !important;
    background-color: #333333 !important;
    border: 1px solid #00ff9f !important;
    transition: none !important;
}

input[type=text]:-webkit-autofill:focus,
input[type=email]:-webkit-autofill:focus,
input[type=tel]:-webkit-autofill:focus,
input[type=password]:-webkit-autofill:focus,
input[type=text]:autofill:focus,
input[type=email]:autofill:focus,
input[type=tel]:autofill:focus,
input[type=password]:autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px #333333 inset, 0 0 5px #fe00fe !important;
    box-shadow: 0 0 0 1000px #333333 inset, 0 0 5px #fe00fe !important;
    -webkit-text-fill-color: #e0e0e0 !important;
    color: #e0e0e0 !important;
    background-color: #333333 !important;
    border: 1px solid #fe00fe !important;
    transition: none !important;
}

table {
  border-collapse: collapse; /* This is the key property */
  width: 100%; /* Optional: for table width */
}

td, th {
  border: none; /* Removes borders from individual cells */
  padding: 8px; /* Keep padding for content spacing, adjust as needed */
  text-align: left; /* Optional: default alignment */
}

#poweredBy{
	display: none !important;
}

#footer{
	padding: 18px !important;
	margin-bottom: 0 !important;
}