/*
* demo.css
* File include item demo only specific css only
******************************************************************************/

.light-style .menu .app-brand.demo {
	height: 64px;
}

.dark-style .menu .app-brand.demo {
	height: 64px;
}

.app-brand-logo.demo svg {
	width: 38px;
	height: 20px;
}

.app-brand-text.demo {
	font-size: 1.25rem;
}

/* ! For .layout-navbar-fixed added fix padding top tpo .layout-page */
.layout-navbar-fixed .layout-wrapper:not(.layout-without-menu) .layout-page {
	padding-top: 64px !important;
}

/* Navbar page z-index issue solution */
.content-wrapper .navbar {
	z-index: auto;
}

/*
* Content
******************************************************************************/

.demo-blocks > * {
	display: block !important;
}

.demo-inline-spacing > * {
	margin: 1rem 0.375rem 0 0 !important;
}

/* ? .demo-vertical-spacing class is used to have vertical margins between elements. To remove margin-top from the first-child, use .demo-only-element class with .demo-vertical-spacing class. For example, we have used this class in forms-input-groups.html file. */
.demo-vertical-spacing > * {
	margin-top: 1.25rem !important;
	margin-bottom: 0 !important;
}

.demo-vertical-spacing.demo-only-element > :first-child {
	margin-top: 0 !important;
}

.demo-vertical-spacing-lg > * {
	margin-top: 1.875rem !important;
	margin-bottom: 0 !important;
}

.demo-vertical-spacing-lg.demo-only-element > :first-child {
	margin-top: 0 !important;
}

.demo-vertical-spacing-xl > * {
	margin-top: 5rem !important;
	margin-bottom: 0 !important;
}

.demo-vertical-spacing-xl.demo-only-element > :first-child {
	margin-top: 0 !important;
}

.rtl-only {
	display: none !important;
	text-align: left !important;
	direction: ltr !important;
}

[dir='rtl'] .rtl-only {
	display: block !important;
}

/* Dropdown buttons going out of small screens */
@media (max-width: 576px) {
	#dropdown-variation-demo .btn-group .text-truncate {
		width: 300px;
		position: relative;
	}

	#dropdown-variation-demo .btn-group .text-truncate::after {
		position: absolute;
		top: 45%;
		right: 0.65rem;
	}
}

/*
* Layout demo
******************************************************************************/

.layout-demo-wrapper {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-direction: column;
	flex-direction: column;
	margin-top: 1.25rem;
}

.layout-demo-placeholder img {
	width: 900px;
}

.layout-demo-info {
	text-align: center;
	margin-top: 1.25rem;
}

.thead-bg-primary thead {
	background: var(--bs-primary);
	color: white;
}

.thead-bg-primary thead .p-column-title {

	color: white !important;
}

span[data-pc-section='sort'] {
	color: white !important;
	margin-left: 7px !important;
}

.p-column-header-content svg {
	color: #fff !important;
}


.p-datatable .p-datatable-tbody > tr > td .p-row-toggler,
.p-datatable .p-datatable-tbody > tr > td .p-row-editor-init,
.p-datatable .p-datatable-tbody > tr > td .p-row-editor-save,
.p-datatable .p-datatable-tbody > tr > td .p-row-editor-cancel {
	width: 1.75rem;
	height: 1.75rem;
	color: #64748b;
	border: 0 none;
	background: transparent;
	border-radius: 50%;
	transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s, outline-color 0.2s;
	outline-color: transparent;
}

.p-datatable .p-datatable-tbody > tr > td .p-row-toggler:enabled:hover,
.p-datatable .p-datatable-tbody > tr > td .p-row-editor-init:enabled:hover,
.p-datatable .p-datatable-tbody > tr > td .p-row-editor-save:enabled:hover,
.p-datatable .p-datatable-tbody > tr > td .p-row-editor-cancel:enabled:hover {
	color: #475569;
	border-color: transparent;
	background: #f1f5f9;
}

.p-column-filter-menu-button,
.p-column-filter-clear-button {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
	text-decoration: none;
	overflow: hidden;
	position: relative;
}

.p-column-filter-row .p-column-filter-menu-button,
.p-column-filter-row .p-column-filter-clear-button {
	margin-left: 0.5rem;
}

.p-column-filter-menu-button {

	color: rgba(0, 0, 0, 0.6);
	border: 0 none;
	background: transparent;
	border-radius: 50%;
	transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
	outline-color: transparent;
}

.p-column-filter-menu-button:hover {
	color: rgba(0, 0, 0, 0.6);
	border-color: transparent;
	background: rgba(0, 0, 0, 0.04);
}

.p-column-filter-menu-button.p-column-filter-menu-button-open,
.p-column-filter-menu-button.p-column-filter-menu-button-open:hover {
	background: rgba(0, 0, 0, 0.04);
	color: rgba(0, 0, 0, 0.6);
}

.p-column-filter-menu-button.p-column-filter-menu-button-active,
.p-column-filter-menu-button.p-column-filter-menu-button-active:hover {
	background: rgba(103, 58, 183, 0.12);
	color: #673AB7;
}

.p-column-filter-menu-button:focus-visible {
	outline: 0 none;
	outline-offset: 0;
	box-shadow: none;
}

.p-column-header-content {
	display: flex
}

.p-column-filter-overlay {
	background: #ffffff;
	color: rgba(0, 0, 0, 0.87);
	border: 0 none;
	border-radius: 4px;
	box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
	min-width: 12.5rem;
}

.p-column-filter-overlay .p-column-filter-row-items {
	padding: 0;
}

.p-column-filter-overlay .p-column-filter-row-items .p-column-filter-row-item {
	margin: 0;
	padding: 1rem 1rem;
	border: 0 none;
	color: rgba(0, 0, 0, 0.87);
	background: transparent;
	transition: none;
	border-radius: 0;
}

.p-column-filter-overlay .p-column-filter-row-items .p-column-filter-row-item:first-child {
	margin-top: 0;
}

.p-column-filter-overlay .p-column-filter-row-items .p-column-filter-row-item:last-child {
	margin-bottom: 0;
}

.p-column-filter-overlay .p-column-filter-row-items .p-column-filter-row-item.p-highlight {
	color: #673AB7;
	background: rgba(103, 58, 183, 0.12);
}

.p-column-filter-overlay .p-column-filter-row-items .p-column-filter-row-item:not(.p-highlight):not(.p-disabled):hover {
	color: rgba(0, 0, 0, 0.87);
	background: rgba(0, 0, 0, 0.04);
}

.p-column-filter-overlay .p-column-filter-row-items .p-column-filter-row-item:focus-visible {
	outline: 0 none;
	outline-offset: 0;
	box-shadow: none;
}

.p-column-filter-overlay .p-column-filter-row-items .p-column-filter-separator {
	border-top: 1px solid rgba(0, 0, 0, 0.12);
	margin: 0.5rem 0;
}

.p-column-filter-overlay-menu .p-column-filter-operator {
	padding: 1rem;
	border-bottom: 1px solid rgba(0, 0, 0, 0.12);
	color: rgba(0, 0, 0, 0.87);
	background: #ffffff;
	margin: 0;
	border-top-right-radius: 4px;
	border-top-left-radius: 4px;
}

.p-column-filter-overlay-menu .p-column-filter-constraint {
	padding: 1rem;
	border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}

.p-column-filter-overlay-menu .p-column-filter-constraint .p-column-filter-matchmode-dropdown {
	margin-bottom: 0.5rem;
}

.p-column-filter-overlay-menu .p-column-filter-constraint .p-column-filter-remove-button {
	margin-top: 0.5rem;
}

.p-column-filter-overlay-menu .p-column-filter-constraint:last-child {
	border-bottom: 0 none;
}

.p-column-filter-overlay-menu .p-column-filter-add-rule {
	padding: 1rem 1rem;
}

.p-column-filter-overlay-menu .p-column-filter-buttonbar {
	padding: 1rem;
}

.p-column-filter-constraint .p-dropdown {
	display: none
}

.p-column-filter-buttonbar {
	display: none
}

.p-tooltip {
	position: absolute;
	display: none;
	padding: 0.25em 0.5rem;
	max-width: 12.5rem;
}

.p-tooltip.p-tooltip-right,
.p-tooltip.p-tooltip-left {
	padding: 0 0.25rem;
}

.p-tooltip.p-tooltip-top,
.p-tooltip.p-tooltip-bottom {
	padding: 0.25em 0;
}

.p-tooltip .p-tooltip-text {
	white-space: pre-line;
	word-break: break-word;
}

.p-tooltip-arrow {
	position: absolute;
	width: 0;
	height: 0;
	border-color: transparent;
	border-style: solid;
	scale: 2;
}

.p-tooltip-right .p-tooltip-arrow {
	margin-top: -0.25rem;
	border-width: 0.25em 0.25em 0.25em 0;
}

.p-tooltip-left .p-tooltip-arrow {
	margin-top: -0.25rem;
	border-width: 0.25em 0 0.25em 0.25rem;
}

.p-tooltip.p-tooltip-top {
	padding: 0.25em 0;
}

.p-tooltip-top .p-tooltip-arrow {
	margin-left: -0.25rem;
	border-width: 0.25em 0.25em 0;
}

.p-tooltip-bottom .p-tooltip-arrow {
	margin-left: -0.25rem;
	border-width: 0 0.25em 0.25rem;
}

.p-tooltip .p-tooltip-text {
	background: rgba(97, 97, 97, 0.9);
	color: #ffffff;
	padding: 0.5rem;
	box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
	border-radius: 4px;
}

.p-tooltip.p-tooltip-right .p-tooltip-arrow {
	border-right-color: rgba(97, 97, 97, 0.9);
}

.p-tooltip.p-tooltip-left .p-tooltip-arrow {
	border-left-color: rgba(97, 97, 97, 0.9);
}

.p-tooltip.p-tooltip-top .p-tooltip-arrow {
	border-top-color: rgba(97, 97, 97, 0.9);
}

.p-tooltip.p-tooltip-bottom .p-tooltip-arrow {
	border-bottom-color: rgba(97, 97, 97, 0.9);
}


.p-column-filter-menu-button {
	width: 20px !important;
	height: 20px !important;
	margin-left: 5px
}

.p-datatable .p-datatable-tbody > tr {
	color: var(--bs-table-color) !important;
}

.p-datatable-loading-overlay {
	background: transparent !important;
}

.p-datatable .p-datatable-header {
	background: #ffffff;
	color: rgba(0, 0, 0, 0.87);
	padding: 1rem 1rem;
	font-weight: 500;
}

.p-datatable .p-datatable-footer {
	background: #ffffff;
	color: #334155;
	padding: 0.75rem 1rem;
	font-weight: 600;
	border: 0 !important;
}


.dark-style .p-datatable .p-datatable-footer {
	background: #1f2937 !important;

}


.light-style .p-datatable .p-datatable-footer {
	background: #ffffff !important;

}


.p-datatable-footer[data-pc-section='footer'] {
	border: 0 !important;
}

.dropdown {
	position: relative;
	display: inline-block;
}

.dropdown-content {
	display: none;
	position: absolute;

	z-index: 10;
}

.dropdown:hover .dropdown-content {
	display: block;
}

.custom-card .p-card-body {
	padding: 0 !important
}

button {
	text-transform: capitalize !important;
}

button span {
	text-transform: capitalize !important;
}
.p-dropdown-items-wrapper ul{
	padding:0 !important;
	margin:0 !important;
}

@media (min-width: 1400px){
	.container-xxl {
		max-width: 1750px !important;
	}
}

html::-webkit-scrollbar {
    width: 5px;
}

html::-webkit-scrollbar-track {
    background: #f1f1f1;
}

html::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 5px;
}

.p-dropdown-label.p-inputtext{
	font-size: 14px!important;
}