/*Search Cards*/
.pss-search-title{
    font-weight: 600;
    margin-top: 20px;
}
/*.pss-search-wrapper-hidden{
	display:block;
}*/

.pss-card{
    background-color: #fff;
    border: 0 solid #69727d;
    border-radius: 3px;
    display: flex;
    flex-direction: column;
    min-height: 100%;
    overflow: hidden;
    position: relative;
    transition: all .25s;
    width: 100%;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, .15);
    border-radius: 7px;
}

.pss-card:hover{
    box-shadow: 0 0 30px 0 rgba(0, 0, 0, .15);
}

.pss-card-thumb{
    margin-bottom: 20px;
}

.pss-card-thumb img {
    width: 100%;
}

.pss-card-title{
    padding: 0 10px;
    margin-top: 0px;
    min-height: 3.4rem;
}

.pss-card-title a{
    color: #575757;
    font-family: "IRANSansXFaNum", Sans-serif;
    font-weight: 600;
    line-height: 1.6rem;
    text-decoration: none !important;
    font-size: 1rem;
}

.pss-card-meta{
    padding: 10px 10px;
    color: #707070;
    border-top: 1px solid #eaeaea;
    margin-bottom: 0;
    font-size: 12px;
}

.pss-card-post-comments:before{
    content: ".";
    margin: 0 5px;
}

.pss-results-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:24px;
}

@media (max-width:1024px){
    .pss-results-grid{
        grid-template-columns:repeat(2,1fr);
    }
}

@media (max-width:767px){
    .pss-results-grid{
        grid-template-columns:1fr;
    }
}



/*Icon Search Box*/
.pss-search-overlay{
	touch-action:none;
}

.pss-icon-wrapper{
	display:inline-block;
}

.pss-search-toggle{
	display:flex;
	align-items:center;
	justify-content:center;
	width:44px;
	height:44px;
	padding:0;
	border:none !important;
	border-radius: 0 !important;
	background:transparent;
	cursor:pointer;
	color:#fff !important;
}

.pss-search-toggle svg{
	width:22px;
	height:22px;
	stroke-width: 3px;
}

.pss-search-overlay{
	position:fixed;
	inset:0;
	background:rgba(0,0,0,.5);
	opacity:0;
	visibility:hidden;
	transition:.2s;
	z-index:9998;
}

.pss-icon-wrapper.active .pss-search-overlay{
	opacity:1;
	visibility:visible;
}


.pss-search-popup{
	position:fixed;
	top:0;
	right:0;
	width:300px;
	height:100vh;
	background:#F7F4F0;
	transform:translateX(100%);
	transition:.2s;
	z-index:9999;
	padding:50px 20px 20px;
	opacity:0;
    visibility:hidden;
}

.pss-icon-wrapper.active .pss-search-popup{
	transform:translateX(0);
	opacity:1;
	visibility:visible;
}

@media(max-width:768px){
    .pss-search-form {
        position: absolute;
        top: 70px;
    }
}

.pss-search-close{
	position: absolute;
    top: 10px;
    left: 15px;
    border: 0 !important;
    font-size: 30px;
    cursor: pointer;
    background: none !important;
    font-weight: 600;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/*.pss-search-wrapper-hidden{
	display:none;
}*/

/*.pss-icon-wrapper.active .pss-search-popup,
.pss-icon-wrapper.active .pss-search-overlay{
	display:block;
}*/



/*Normal Search Box*/
.pss-item{
    display:flex;
    align-items:center;
    gap:10px;
}


.pss-thumb{
    width:50px;
    height:50px;
    object-fit:cover;
    border-radius:8px;
    flex-shrink:0;
}

.pss-search-box {
	display: block;
	position: relative;
	width: 100%;
}

.pss-search-box input {
	display: block;
	width: 100%;
	height: 42px;
	padding-inline-end: 46px;
}

.pss-search-box input:focus {
    box-shadow: 0 0 30px 0 rgba(0, 0, 0, .15);
    outline: none !important;
}

.pss-search-box button {
	position: absolute !important;
	top: 50% !important;
	inset-inline-end: 0 !important;
	transform: translateY(-50%) !important;
	width: fit-content;
	padding: calc(0.5rem - 1px) 18px !important;
	background: transparent;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 2;
	color: #fff;
	transition: none !important;
}

.pss-search-box button svg {
	width: 18px;
	height: 18px;
}

.pss-results {
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	background: #fff;
	/*border: 1px solid #ddd;*/
	z-index: 9999;
}

.pss-item {
	display: block;
	padding: 10px;
	text-decoration: none;
}

.pss-item:hover {
	background: #f5f5f5;
}

@media (max-width: 768px) {
	.pss-results {
		left: 10px;
		right: 10px;
	}
}