/* STYLES */
:root { 
    --bglight   : white;
    --textlight : white;
    --border1   : #eeeeee;
    --border2   : rgba(66, 75, 90, 0.5);
}

/* #region - AJAX GRID */

[data-axpost] .tax-links,
[data-axgrid] .tax-links { 
    margin-bottom: 30px; 
}
[data-axpost] .tax-links ul,
[data-axgrid] .tax-links ul { 
    gap: 10px; 
}
[data-axpost] .tax-links ul .btn,
[data-axgrid] .tax-links ul .btn {
    background-color: white;
}

[data-axgrid] .cpt-row { 
    row-gap: 30px; 
}
[data-axgrid] .cpt { 
    background-color: white;
    border: 1px solid var(--border1);
    padding: 10px; 
    display: block;
}
[data-axgrid] .cpt div[data-image="image-opt"], 
[data-axgrid] .cpt div[data-image="image-none"], 
[data-axgrid] .cpt div[data-image="image-thumb"] {
    min-height: 200px;
    margin-bottom: 20px;
}

[data-axgrid] .cpt .cpt-title {
    margin-bottom: 0;
    color: var(--color2);
}

[data-axgrid] .cpt .cat-links {
    display: flex;
    gap: 10px;
    font-size: 14px;
}

[data-axgrid] .ajax_category.active { 
    background-color: #e5e5e5; 
}

[data-axpost] .ajax_category.active span,
[data-axgrid] .ajax_category.active span {
    color: white;
}

[data-axpost] .ajx_btn,
[data-axgrid] .ajx_btn { 
    margin-top: 30px; 
}

[data-axpost] [data-design="grid-1.0"] .div-meta {
    padding-bottom: 0;
}

.dots {
    width: 13.4px;
    height: 13.4px;
    background: var(--color2);
    color: var(--color2);
    border-radius: 50%;
    box-shadow: 22.4px 0,-22.4px 0;
    animation: dots-u8fzftmd 1s infinite linear alternate;
    margin: 20px auto 0;
}

@keyframes dots-u8fzftmd {
    0% {
       box-shadow: 22.4px 0,-22.4px 0;
       background: rgba(71,75,255,0.13);
    }
 
    33% {
       box-shadow: 22.4px 0,-22.4px 0 rgba(71,75,255,0.13);
       background: rgba(71,75,255,0.13);
    }
 
    66% {
       box-shadow: 22.4px 0 rgba(71,75,255,0.13),-22.4px 0;
       background: rgba(71,75,255,0.13);
    }
 }

.iloader {
    margin-top: 20px;
    text-align: center;
    height: 13.4px;
}

.iloader .dots {
    display: none;
}

/* #endregion */

/* #region - AXF (ajax filter) */

.axf .filter-results {
    display: flex;
    gap: 10px;
    padding: 15px 0;
}

.axf .filter-results div {
    display: block;
    position: relative;
    padding: 7px 15px;
    padding-right: 30px;
    background-color: rgba(0,0,0,0.3);
    font-size: 14px;
    border-radius: 5px;
    color: white;
}

.axf .filter-results div::after {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 7px;
    content: "\d7";
    color: white;
    font-size: 22px;
    cursor: pointer;
}

.axf .results pre {

}

.axf .post-count {
    font-size: 14px;
    font-weight: 600;
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
    padding-bottom: 20px;
    margin-bottom: 20px;
}

.axf .flex-row {
    display: flex;
    flex-wrap: wrap;
    margin-left: -15px;
    margin-right: -15px;
    row-gap: 30px;
}

.axf .flex-row .post-wrap {
    padding-left: 15px;
    padding-right: 15px;
    flex: 0 0 25%;
    max-width: 25%;
}

.axf .flex-row .post-item {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.axf .flex-row .post-item:hover {
    background-color: aliceblue;
}

.axf .flex-row .post-info {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.axf .flex-row .post-tax {
    display: flex;
    gap: 5px;
    flex-wrap: wrap;
}

.axf .flex-row .post-tax span {
    font-size: 13px;
    color: white;
    position: relative;
    display: block;
    white-space:nowrap;
    background-color: #999;
    padding: 0 9px 0 18px;
}

.axf .flex-row .post-tax span::before {
    content: "";
    display: block;
    width: 6px;
    height: 6px;
    background-color: white;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 6px;
}

/* PAGINATION */

.axf-pagination {
    border-top: 1px solid rgba(0, 0, 0, 0.2);
    margin-top: 30px;
    padding-top: 20px;
    display: flex;
    gap: 5px;
}

.axf-pagination a, 
.axf-pagination .moreof
{
  min-width: 32px !important;
  padding: 0 10px;
  height: 34px !important;
  background: #FFF;
  line-height: 120%;
  border: 1px solid #E7E7E7;
  -webkit-border-radius: 0;
  border-radius: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #333;
  font-size: 14px;
  transition: 0.3;
}

.axf-pagination .moreof
{
  padding: 0;
  letter-spacing: 1px;
  color: #ccc;
  margin-top: 1px;
}

.axf-pagination a.selected,
.axf-pagination a:hover {
    background-color: rgba(0,0,0,0.8);
    color: white;
}

.axf-pagination a[data-f]{
    padding: 0;
}

.axf-pagination a img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    width: 70%;
    height: 70%;
    transition: 0.3;
}

.axf-pagination a:hover img {
    filter: brightness(0) invert(1);
}

.axf-pagination a[data-ff] img{
    transform: rotate(180deg);
}

.axf-btn {
    flex: 0 0 100%;
    max-width: 100%;
}

/* #endregion */

/* #region - AXF (ajax filter) */

:root {
    --cal-empty-bg : rgba(255, 255, 255, 0.10);
    --cal-cel-bg : white;
    --cal-day-name-bg : rgba(0, 0, 0, 0.1);
    --cal-day-border : 1px solid rgba(0, 0, 0, 0.5);
    --cal-month-year-bg : #444;
}

#calendar-outer {
	width: 100%;
    padding: 20px;
    margin-top: 20px;
    background-color: rgba(0, 0, 0, 0.05);
}

	#calendar-outer ul {
		margin: 0px;
		padding: 0px;
	}

		#calendar-outer ul li {
			margin: 0px;
			padding: 0px;
			list-style-type: none;
		}

.calendar-nav .prev {
	display: inline-block;
	float: left;
	cursor: pointer
}

.calendar-nav .next {
	display: inline-block;
	float: right;
	cursor: pointer
}

div.calendar-nav {
	background-color: var(--cal-month-year-bg);
	text-align: center;
	padding: 10px;
	color: #FFF;
	box-sizing: border-box;
	font-weight: bold;
    margin-bottom: 20px;
}

#calendar-outer .week-name-title {
    display: flex;
}

    #calendar-outer .week-name-title li {
        border-radius: 0;
        flex: 0 0 14.28%;
        max-width: 0 0 14.28%;
        padding: 5px 10px;
        border-right: var(--cal-day-border);
        border-top: var(--cal-day-border);
        font-weight: 500;
        background-color: var(--cal-day-name-bg);
    }

    #calendar-outer .week-name-title li:first-child { 
        border-left: var(--cal-day-border);
    }

#calendar-outer .week-day-cell {
    display: flex;
    flex-wrap: wrap;
    border-bottom: var(--cal-day-border);
}

    #calendar-outer .week-day-cell span {
        display: block;
        margin-bottom: 10px;
    }

    #calendar-outer .week-day-cell .is-empty {
        background-color: var(--cal-empty-bg);
    }

    #calendar-outer .week-day-cell .is-empty span {
        opacity: 0.3;
    }

    #calendar-outer .week-day-cell .is-empty .the_event {
        opacity: 0.3;
    }

    

#calendar-outer .week-day-cell li {
    border-radius: 0;
    flex: 0 0 14.28%;
    max-width: 0 0 14.28%;
    min-height: 120px;
}

    #calendar-outer .week-day-cell li {
        padding: 10px;
        border: var(--cal-day-border);
        border-left: none;
        border-bottom: none;
    }

    #calendar-outer .week-day-cell .is-day {
        background-color: var(--cal-cel-bg);
    }

    #calendar-outer .week-day-cell li:nth-child(7n-6) {
        border-left: var(--cal-day-border);
    }

#calendar-outer .the_event {
    font-weight: normal;
    font-size: 75%;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.05);
    border-radius: 10px;
    padding: 5px 10px;
    margin-bottom: 5px;
    line-height: 125%;
}


/* #endregion */