table.dataTable {
	font-size: 85%;
	line-height: 15px;
}

table.dataTable td, table.dataTable th {
	padding: 9px 5px 9px 5px;
}

table#table-select-columns.dataTable td, table.dataTable th {
	padding: 5px 5px 5px 5px;
}

table#table-vorschau.dataTable td, table.dataTable th {
	padding: 5px 5px 5px 5px;
}

table.dataTable th:before, table.dataTable th:after {
	bottom: 0.5em !important;
}

select.select-field  {
	font-size: 0.8rem;
}

.content-header {
	padding: 8px .5rem;
}

.direct-chat .card-body {
	padding: 5px;
}

.alert,.callout {
	padding: .25rem 0.5rem;
}

label:not(.form-check-label):not(.custom-file-label) {
	padding-right: 5px;
}

.dataTable > thead > tr > th.no-sort[class*="sort"]::after, .dataTable > thead > tr > th.no-sort[class*="sort"]::before {
	display: none
}

.nav-header {
	color: #ffffff !important;
}

[class*=sidebar-dark-] .nav-sidebar>.nav-item>.nav-link, [class*=sidebar-dark-] .nav-sidebar>.nav-item>.nav-link:focus {
	background-color: rgba(255, 255, 255, .15);
}

[class*=sidebar-dark-] .nav-sidebar>.nav-item:hover>.nav-link
	background-color: rgba(255, 255, 255, .1);
	color: #fff;
}

/* Status-Icons in den Chat-Bubbles */
.direct-chat-text {
	position: relative;
	padding-bottom: 18px; /* Platz für das Status-Icon */
}

/* Container für das Icon unten rechts */
.chat-status {
	position: absolute;
	bottom: 2px;
	right: 6px;
	font-size: 9px;
	color: #fff;
}

/* Icons für verschiedene Status */
.chat-status.sent::after {
	content: "\f00c"; /* Einfacher Haken */
	font-family: "Font Awesome 5 Free";
	font-weight: 600;
	color: #fff;
	margin-left: 5px;
}

.chat-status.delivered::after {
	content: "\f00c\f00c";
	font-family: "Font Awesome 5 Free";
	font-weight: 600;
	letter-spacing: -0.5em;
	padding-right: 3px;
	margin-left: 5px;
}

.chat-status.read::after {
	content: "\f06e"; /* Auge-Symbol */
	font-family: "Font Awesome 5 Free";
	font-weight: 600;
	margin-left: 5px;
}

.chat-status.failed::after {
	content: "\f071"; /* Fehlersymbol */
	font-family: "Font Awesome 5 Free";
	font-weight: 600;
	padding-right: 0px;
	margin-left: 5px;
}

.whatsapp-icon {
	font-size: 1.1em;
	color: #fff;
}

.direct-chat-msg:not(.right) .whatsapp-icon {
	color: #444;
}

.text-whatsapp {
	color: #25D366;
}

.bg-whatsapp {
	background-color: #25D366;
	color: #ffffff;
}

.attachments {
	margin-top: 5px;
	padding-left: 10px;
}
.right .attachments {
	margin-left: 50px;
}
.attachment {
	display: inline-block;
	padding: 7px 8px 7px 8px;
	margin-right: 5px;
	margin-bottom: 5px;
	border-radius: 10px;
	border: 1px solid #ddd;
	-moz-box-shadow: 2px 2px 3px #eee;
	-webkit-box-shadow: 2px 2px 3px #eee;
	box-shadow: 2px 2px 3px #eee;
	background-color: #f5f5f5;
}
.attachment, .attachment a {
	color: #555;
}
.attachment.missing {
	background-color: #efaaaa;
}
.attachment.missing span {
	text-decoration: line-through;
}
.attachment i {
	margin-right: 2px; 
	color: #555;
}
.attachment span {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 150px;
	display: inline-block;
	vertical-align: bottom;
	font-size: 0.85em;
}

.card-whatsapp:not(.card-outline)>.card-header {
	color: #ffffff;
	background-color: #337f4f;
}

.direct-chat-text {
	margin-right: 50px;
	margin-left: 5px;
}

.right .direct-chat-text {
	margin-left: 50px;
	margin-right: 5px;
}

.direct-chat-primary .right>.direct-chat-text.whatsapp {
	background-color: #3faf69;
	border-color: #3aa562;
	color: #fff;
}
.direct-chat-primary .right>.direct-chat-text.whatsapp::after, .direct-chat-primary .right>.direct-chat-text.whatsapp::before {
	border-left-color: #3aa562;
	border-right-color: transparent;
}

.direct-chat-primary .right.failed>.direct-chat-text.whatsapp {
	background-color: #dc3545;
	border-color: #dc3545;
	color: #fff;
}
.direct-chat-primary .right.failed>.direct-chat-text.whatsapp::after, .direct-chat-primary .right.failed>.direct-chat-text.whatsapp::before {
	border-left-color: #dc3545;
}


.direct-chat-primary .right>.direct-chat-text.whatsapp.pending, .direct-chat-primary .right>.direct-chat-text.whatsapp.sent {
	opacity: 0.5;
}

.direct-chat-primary .right>.direct-chat-text.whatsapp.error, .direct-chat-primary .right>.direct-chat-text.whatsapp.failed {
	background-color: #dc3545;
	border-color: #dc3545;
	color: #fff;
	opacity: 0.5;
}

.direct-chat-text.whatsapp {
	background-color: #d8ede0;
	border-color: #cbe9d7;
}
.direct-chat-text.whatsapp::after {
	border-right-color: #cbe9d7;
}

.inline-input {
	border: none;
	border-bottom: 2px solid #007bff;
	background: transparent;
	outline: none;
	width: auto;
	display: inline-block;
	text-align: center;
	min-width: 50px;
	max-width: 100%;
	font-size: 1rem;
	transition: border-color 0.3s ease-in-out;
}
.inline-input::placeholder {
	color: #aaa;
}
.inline-input:focus {
	border-bottom: 2px solid #0056b3;
}

/* Placeholder-Farbe */
.inline-input::placeholder {
	color: #aaa;
}

/* Fokus-Effekt */
.inline-input:focus {
	border-bottom: 2px solid #0056b3; /* Dunkleres Blau */
}

/* ❌ Ungültiger Zustand → Roter Unterstrich */
.inline-input.is-invalid {
	border-bottom: 2px solid #dc3545 !important; /* Rot */
}

/* ✅ Gültiger Zustand → Grüner Unterstrich */
.inline-input.is-valid {
	border-bottom: 2px solid #28a745 !important; /* Grün */
}

/* Standard-Fehlermeldungen von jQuery Validate verstecken */
label.error {
	display: none !important;
}
