.card {
	overflow: hidden;
}

.card-header {
	align-items: center;
	border-bottom: 1px solid #ccc;
	color: #444;
	display: flex;
	gap: 40px;
	justify-content: space-between;
	padding: 10px 20px;
	width: 100%;
}

.card-header h1 {
	align-items: center;
	display: flex;
	font-size: 1.5rem;
	font-weight: 600;
	gap: 10px;
	margin: 0;
}

.card-header h1 img {
	height: auto;
	opacity: 0.6;
	width: 20px;
}

.card-header h1 span {
	font-size: 1rem;
	font-weight: 400;
}

.card-header h2,
.card-body h2 {
	align-items: center;
	display: flex;
	font-size: 1.2rem;
	font-weight: 600;
	gap: 5px;
	margin-bottom: 20px;
}

.card-header h2 img,
.card-body h2 img {
	height: 15px;
	opacity: 0.6;
	width: auto;
}

/* *******************************/

.card-header-view .desktop {
	display: none;
}

.card-header-view .mobile {
}

@media (min-width: 1400px) {

	.card-header-view .desktop {
		display: block;
	}

	.card-header-view .mobile {
		display: none;
	}
}

/* *******************************/

.card-body .results {
	border: 1px solid #dee2e6;
	border-radius: 0.375rem;
	margin-top: 20px;
}

.card-body .results table tr:last-child {
	border-bottom: 0px solid #fff;
}

/* *******************************/

.card-options {
	align-items: flex-start;
	border-bottom: 1px solid #ccc;
	display: flex;
	flex-direction: column;
	gap: 10px;
	justify-content: space-between;
	padding: 10px 20px;
}

.card-options form {
	width: 100%;
}

.card-options .filters {
	align-items: center;
	display: flex;
	flex-grow: 1;
	flex-wrap: wrap;
	gap: 10px;
}

.card-options .options {
	align-items: center;
	display: flex;
	gap: 20px;
}

@media (min-width: 768px){

	.card-options form {
		width: 300px;
	}
}

@media (min-width: 1400px) {

	.card-options {
		align-items: center;
		flex-direction: row;
		gap: 20px;
	}
}

/* *******************************/

.card-filters, .card-filters-instream {
	align-items: flex-start;
	background-color: #fff3cd;
	border-bottom: 1px solid #ccc;
	display: none;
	gap: 10px;
	justify-content: flex-start;
	padding: 10px 20px;
	white-space: nowrap;
}

.card-filters-selected, .card-filters-instream-selected {
	display: flex;
}

@media (min-width: 1400px) {

	.card-filters, .card-filters-instream {
		align-items: center;
		flex-direction: row;
		gap: 20px;
	}
}

/* *******************************/

.card-table {
	overflow-x: auto;
}

.card-table table {
	margin-bottom: 0;
}

.card-table table td.error {
	background-color: #fbe6e8;
}

.card-table table td.warning {
	background-color: #fff3cd;
	color: #664d03;
}

.card-table table td.warning a {
	color: #664d03;
	text-decoration: underline;
}

.card-table table td.warning a:hover {
	text-decoration: none;
}

.card-table table td.error img,
.card-table table td.warning img {
	height: 16px;
	width: auto;
}

.card-table table th:first-child,
.card-table table td:first-child {
	padding-left: 20px;
}

.card-table table th:last-child,
.card-table table td:last-child {
	padding-right: 15px;
}

.card-table img {
	height: 12px;
	margin-right: 2px;
	opacity: 0.5;
	width: auto;
}

.card-table .td-note {
	color: rgb(220 53 69);
	font-size: 0.8rem;
}

/*  sticky columns */

th, td {
	outline: 0px solid #ffffff;
}

.col-no {
	left: 0;
	position: sticky;
}

.col-id {
	left: 0;
	position: sticky;
	padding-right: .9rem !important;
}

.fixed-header {
	z-index: 20;
}

/* *******************************/

.card-stats {
	align-items: flex-start;
	display: flex;
	gap: 20px;
	justify-content: space-between;
}

.card-stats .chart {
	border-right: 1px solid #ccc;
	width: 50%;
}

.card-stats .meta {
	padding: 20px 0;
	width: 50%;
}

.card-stats table {
	margin-bottom: 0;
	width: 100%;
}

.card-stats table th:first-child,
.card-stats table td:first-child {
	padding-left: 20px;
}

.card-stats table th:last-child,
.card-stats table td:last-child {
	padding-right: 15px;
}

/* *******************************/

.card-pagination {
	align-items: center;
	border-top: 0;
	display: flex;
	gap: 40px;
	justify-content: space-between;
	padding: 10px 20px;
	width: 100%;
}

.card-pagination form {
	align-items: center;
	display: flex;
	gap: 10px;
	width: auto;
}

.card-pagination form label {
	font-weight: 600;
}

.card-pagination .count {
	font-weight: 600;
	white-space: nowrap;
	width: calc((100svh - 80px) / 3);
}

.card-pagination .pages {
	font-weight: 600;
	white-space: nowrap;
}

.card-pagination .nav {
	align-items: center;
	display: flex;
	flex-wrap: nowrap;
	gap: 0;
	justify-content: flex-end;
	width: calc((100svh - 80px) / 3);
}

.card-pagination .nav button {
	height: 30px;
	transition: all ease 0.2s;
	width: 40px;
}

.card-pagination .nav button:hover img {
	opacity: 1;
}

.balance table tr:last-child td{
	border-bottom: 0px;
}

.balance table tr:last-child td:last-child {
	background-color: #f3f3f3;
}

/* *******************************/

.card-totals {
	align-items: center;
	border-top: 0;
	font-weight: 600;
	justify-content: flex-start;
	padding: 10px 15px 10px 20px;
	width: 100%;
}

.card-totals .label-column {
	flex-grow: 1;
}

.card-totals .total-column {
	margin-right: 0px;
	width: 125px;
}

/* *******************************/

.modal .card {
	max-height:  max(450px, 45vh);
}

span.badge.rounded-pill.text-bg-secondary {
	background-color: #cff4fc !important;
	color: #444444 !important;
}

@media (min-height: 725px) and (orientation: landscape) {
  .modal .card {
    max-height: calc((100vh - 208px) / 2); 
  }
	
	.modal .card.mt-4 {
		max-height: calc((100vh - 340px) / 2); 
	}
}


#month, select#days {
	display: none; /* Initially hidden */
}