/**
Theme Name: قالب چایلد آسترا
Author: Brainstorm Force/ ایران آسترا
Author URI: http://iranastra.ir/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: weblime
Template: astra
*/

body, button, input, select, textarea, .ast-button, .ast-custom-button {
	font-family: IRANSansWeb
}
.d-none{
    display: none !important;
}

/*All buttons*/
button:focus{
	background-color: var(--ast-global-color-0);
}
.mb-4{
    margin-bottom: 32px !important;
}
/* at /login */
.role-label{
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    margin-left: 24px;
}

/*
Custom button shortcode styles
*/

.login-btn, .user-menu-btn{
	background-color: #E65409;
	color: white;
	padding: 12px 40px;
	border-radius: 16px;
	/*text-decoration: underline;*/
	font-weight: 500;
}

/*header menu between 900 and 1050 px*/
@media (min-width:900px) and (max-width:970px){
	.main-navigation .menu-link{
		padding: 0 8px !important;
		font-size: 13px !important;
	}
}
@media (min-width:971px) and (max-width:1070px){
	.main-navigation .menu-link{
		padding: 0 12px !important;
		font-size: 14px !important;
	}
}
.login-btn:hover, .user-menu-btn:hover {
	color: #FFFFFF;
}
/*.user-menu-btn {*/
/*	background: #0073e6;*/
/*	color: #fff;*/
/*	padding: 8px 14px;*/
/*	border-radius: 4px;*/
/*	border: none;*/
/*	cursor: pointer;*/
/*	font-size: 14px;*/
/*	transition: background 0.2s;*/
/*}*/
/*.user-menu-btn:hover {*/
/*	background: #005bb5;*/
/*}*/

/*job position button in main menu*/
@media  (min-width: 768px){
	.main-navigation .menu-item-object-job-position a {
		background: #E65409;
		border-radius: 16px;
		height: 50% !important;
		color: white !important;
	}
}
/* user menu container */
.user-menu {
	position: relative;
	display: inline-block;
}

/* مخفی بودن منو به صورت پیش‌فرض */
.user-menu .dropdown-menu {
	display: none;
	position: absolute;
	background: #fff;
	min-width: 160px;
	left: 0;
	top: 100%;
	border: 1px solid #ddd;
	border-radius: 4px;
	padding: 5px 0;
	box-shadow: 0 2px 8px rgba(0,0,0,0.1);
	z-index: 9999;
}

/* آیتم‌های منو */
.user-menu .dropdown-menu li {
	list-style: none;
}
.user-menu .dropdown-menu li a {
	display: block;
	padding: 10px 12px;
	color: #333;
	text-decoration: none;
}
.user-menu .dropdown-menu li a:hover {
	background: #f5f5f5;
}

/* فقط با CSS: نمایش منو وقتی روی دکمه هاور یا فوکوس بشه */
.user-menu:hover .dropdown-menu,
.user-menu:focus-within .dropdown-menu {
	display: block;
}

/* واکنش‌گرا (موبایل) */
@media (max-width: 768px) {
	.login-btn,
	.user-menu-btn {
		font-size: 16px;
		padding: 10px 18px;
		width: 100%;
	}
	.user-menu .dropdown-menu {
		right: auto;
		left: 0;
		width: 100%;
	}
}


/* styles for login page */
.login-container{
	/*background-color: #E65409;*/
	width: 30%;
	min-width: 400px;
	display: flex;
	flex-direction: row;
	margin: 5vh auto;
	height: 90vh;
	border-radius: 16px;
}
.login-container .form-container{
	width: 100%;
	background-color: #EBEBEB;
	border-radius: 16px;
}
.login-container .img-container{
	width: 50%;
	background-color: #0fa951;
}
#custom-login-wrapper{
	justify-content: center;
	display: flex;
	flex-direction: column;
}
#custom-login-box{
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 0 20px;
}
#custom-login-box label{
	margin-right: 8px;
}
#custom-login-box input, #custom-login-box select{
	border-radius: 16px;
	padding: 8px 12px;
	margin-bottom: 16px;
}
.custom-logo-link{

}
.custom-logo-link img{
	display: flex;
	justify-content: center;
	width: 120px;
}
.site-branding{
	display: flex;
	flex-direction: row;
	gap: 4px;
	margin: 20px auto 20px auto;
	align-items: center;
}
.site-description{
	text-align: center;
	margin-bottom: 16px;
	padding: 0px 16px;
}
#cp_phone {
	text-align: right;
}
#cp_otp{
	text-align: center;
}
#otp-section {
	display: flex;
	flex-direction: column;
	width: 100%;
	gap: 8px;
	margin-top: 8px;
}
#complete-profile-fields{
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 0 20px;
}
#complete-profile-fields input{
	border-radius: 16px;
	padding: 8px 12px;
}
.form-error{
	color: red;
	font-size: 10px;
	margin: 0 4px !important;
	text-align: right;
}
.disabled-btn{
	background-color: gray !important;
}
.disabled-btn:hover{
	background-color: gray !important;
}
#otp-timer{
	display: none;
	text-align: center;
	font-size: 12px;
	color: gray;
}
@media screen and (max-width: 500px){
	.login-container .img-container{
		display: none;
	}
	.login-container{
		width: 90%;
		min-width: unset;
		margin: 5vh 5%;
	}
	.login-container .form-container{
		width: 100%;
		border-radius: 16px;
	}
}

/*styles for user profile page*/
.user-profile-container-section{
	width: 100%;
	padding: 16px 0;
	background-color: #EBEBEB;
	display: flex;
	flex-direction: column;
	gap: 32px;
}
.user-profile-container{
	width: 100%;
	min-height: 40vh;
	padding: 16px 0;
	background-color: #EBEBEB;
	display: flex;
	flex-direction: row;
}
.sidebar-menu-profile{
	width: 20%;
	background-color: #000000;
	padding: 16px 8px;
	transition: all 0.5s;
	position: relative;
}
.sidebar-menu-profile.hide{
	/*width: 20px;*/
}
.sidebar-menu-profile .menu-container{

	text-decoration: none;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.sidebar-menu-profile .menu-container a{
	text-decoration: none;
	background: #FFFFFF;
    color: #000000;
	padding: 8px 16px;
	border-radius: 16px;
	cursor: pointer;
}
.profile-header{
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	margin-right: 16px;
}
.logout-button{
	background: #E65409;
	border: none;
	padding: 10px 40px;
	border-radius: 16px;
	font-size: 14px;
	cursor: pointer;
	transition: 0.3s;
}
.logout-button:hover{
	color: white;
}
.user-info-container{
	margin: 4px auto;
}

@media screen and (max-width: 768px){
	.sidebar-menu-profile.hide .menu-container{
		display: none;
	}
}

/*
Single Job Position Template
*/

main.job-position{
	padding: 0;
	max-width: 600px;
	margin: 0px auto;

}
.job-container{
    background-color: #EBEBEB;
}
.job-img{
	margin: 0px auto;
	width: 100%;
}
.recruitment-meta{
    margin: 20px 0;
    background: #cbcbcb;
    padding: 16px;
}
.job_recruitment_title{
	font-weight: 600;
	text-decoration: underline;
}
.job-primary-meta{
	padding: 16px;
	margin: 0 auto;
}
h1.job-title{
	color: #E65409;
	margin: 20px auto;
	font-size: 24px;
}
h2.job-title{
    color: #E65409;
}
h5.title{
	margin: 16px auto;
	color: #E65409;
}
.company-info-meta{
	display: flex;
	flex-direction: row;
	gap: 60px;
}
.company-info-meta a{
	text-decoration: underline;
}
.job-container p{
	text-align: justify;
	margin-right: 8px;
}
.skill-name{
	margin-bottom: 8px;
}
.job-secondary-meta{
	max-width: 80%;
	margin: 0px 10%;
	padding: 16px;
	/*background-color: #0fa951;*/
	background-color: #E65409b2;;
	color: #FFFFFF;
	border-radius: 16px;
	/*box-shadow: rgba(15,169,81,0.51) 0px 3px 8px;*/
	box-shadow: 2px 2px 18px 4px rgba(230, 84, 9, 0.5);
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 4%;
	justify-content: flex-start;
}
.job-secondary-meta .meta-row{
	display: flex;
	flex-direction: row;
	width: 48%;
	background-color: #FFFFFF6B;
	border-radius: 8px;
	justify-content: flex-start;
	align-items: center;
	color: #000000;
	margin-bottom: 16px;
	gap: 12px;
	padding: 8px;
    /*position: relative;*/
    /*!*display: inline-block;*!*/
    /*cursor: help;*/

}
/*.job-secondary-meta .meta-row::after {*/
/*    content: attr(data-tooltip);*/
/*    position: absolute;*/
/*    bottom: 100%;*/
/*    right: 0;*/
/*    background: #333;*/
/*    color: #fff;*/
/*    padding: 6px 10px;*/
/*    border-radius: 4px;*/
/*    white-space: nowrap;*/
/*    font-size: 12px;*/
/*    opacity: 0;*/
/*    pointer-events: none;*/
/*    transform: translateY(-5px);*/
/*    transition: opacity 0.2s ease, transform 0.2s ease;*/
/*    z-index: 10;*/
/*}*/

/*.job-secondary-meta .meta-row:hover::after {*/
/*    opacity: 1;*/
/*    transform: translateY(-10px);*/
/*}*/

.meta-row img{
	width: 30px;
}
.meta-row span{
	font-size: 12px;
}
.job-company-meta, .job-more-info-meta{
	padding: 16px;
	margin: 0px auto;
}
.job-more-info-meta p{
	margin-bottom: 0;
}
.job-company-meta h5.title{
	margin-top: 0;
}
.apply-btn-container{
	padding: 16px 0;
	margin: 0px auto;
	text-align: center;
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-bottom: 40px;
    width: 50%;
}
.apply-btn {
	margin: 16px auto;
	width: 40%;
	font-weight: 600;
	font-size: 16px;
}
@media screen and (max-width: 580px){
	.job-secondary-meta .meta-row{
		width: 90%;
		gap: 20%;
	}
	.company-info-meta{
		flex-direction: column;
		gap: 8px;
	}
	.company-info-meta p{
		margin-bottom: 0;
	}
}
@media screen and (max-width: 768px){
	main.job-position{
		max-width: 90%;
		padding: 0;
	}
	h1.job-title{
		font-size: 20px;
	}
	.job-primary-meta, .job-secondary-meta{
		width: 90%;
		justify-content: center;
	}
	.job-secondary-meta{
		margin: 0 auto;
	}
	.job-secondary-meta .meta-row{
		/*width: 90%;*/
		/*gap: 20%;*/
	}
	.apply-btn-container {
		width: 80%;
	}
}

/*announcment and recruitment page and section*/
.card-list-grid {
	direction: ltr;
}
.card-list-col{
	direction: rtl;
}

/*recruitment single page and archive and job position archive*/
main.recruitment{
	max-width: 60%;
	margin: 40px auto;
}
.recruitment-img{
	margin: 0px auto;
	width: 80%;
}
#expired-img {
    position: absolute;
    width: 12% !important;
    left: 30%;
    transform: rotate(-25deg);
}
.job_recruitment_title{
	font-weight: 600;
	text-decoration: underline;
}
.recruitment-primary-meta{
	padding: 16px;
	margin: 0 auto;
}
h1.recruitment-title{
	color: #E65409;
	margin: 32px auto;
	font-size: 24px;
}
h5.title{
	margin: 32px auto 16px;
	color: #E65409;
}
.recruitment-description{
	margin: 32px 8px;
	text-align: justify;
}
.recruitment-description h4 {
	margin-bottom: 8px;
}
.recruitment-more-info{
	margin: 24px auto;
	text-align: justify;
}
.recruitment-more-info h4 {
	margin-bottom: 8px;
}
.jobs-container{
	display: flex;
	flex-direction: column;
	gap: 40px;
}
.job-card-container{
	padding: 24px 32px;
	background-color: #EBEBEB;
	border-radius: 16px;
	display: flex;
	flex-direction: column;
	/*justify-content: space-between;*/
	gap: 24px;
}
.job-card{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	/*gap: 2%;*/
}
.job-card .right{
	display: flex;
	flex-direction: column;
	gap: 16px;
	align-items: flex-start;
	justify-content: flex-start;
	width: 60%;
}
.job-card-title {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.job-card-title a{
	color: #333333;
}
.job-card-title a:last-child {
    margin-top: 4px;
    font-weight: 500;
}
.job-card-title a:hover{
	color: #000000;
}
.job-card .left{
	display: flex;
	flex-direction: column;
	gap: 0px;
	align-items: center;
	justify-content: flex-start;
	margin-top: 20px;
	/*width: 29%;*/
}
.job-card .info-container{
	display: flex;
	flex-direction: row;
	gap: 8px;
	flex-wrap: wrap;
}
.job-card .info-container .info{
	display: flex;
	flex-direction: row;
	gap: 4px;
	width: 47%;
	align-items: center;
}
.job-card .info-container .info:last-child {
    /*width: 100% !important;*/
}
.info-container .info img{
	width: 30px;
	height: 30px;
}
.span-info{
	font-size: 12px;
}
.job-card .left .company-info{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 4px;
}
.job-card .left img{
	width: 50px;
}
.job-card .left a{
	font-size: 10px;
	text-decoration: underline;
}
.location-container{
	display: flex;
	flex-direction: row;
	gap: 2px;
}
.location-container p{
	font-size: 14px !important;
	margin-bottom: 0 !important;
	color: #7A7A7A;
}
.location-container img{
	width: 15px !important;
	height: 15px !important;
	margin: auto;
	color: gray;
}
.job-card .left p{
	margin-bottom: 4px;
	font-size: 14px;
}
.job-card-container .btn-container{
	/*border-top: 1px solid black;*/
	display: flex;
	flex-direction: row;
	gap: 40px;
	justify-content: flex-start;
	align-items: center;
    margin-top: 8px;
	/*padding-top: 8px;*/
}
.job-card-container .btn-container a{
	text-decoration: underline;
	font-size: 14px !important;
}
.job-card-container .btn-container button {
	padding: 8px 12px;
	font-size: 12px;
}
.job-archive-container{
	width: 60%;
	margin: 40px auto;
}
.expired{
    background-color: #666666;
}
.expired:hover{
    background-color: #666666;
}
.poster-container{
    margin: 16px auto;
    padding: 24px 32px;
    text-align: center;
}
.poster-container img {
    width: 30%;
    margin: 20px 35%;
}
.poster-container a{
	text-decoration: underline;
}
.share-container h5{
	margin-top: 24px;
	text-align: center;
}
/*.social-media {*/
/*	width: 50px;*/
/*	height: 50px;*/
/*	border-radius: 50%;*/
/*	display: flex;*/
/*	align-items: center;*/
/*	justify-content: center;*/
/*	cursor: pointer;*/
/*	color: white;*/
/*	font-size: 22px;*/
/*	transition: transform 0.2s, box-shadow 0.2s;*/
/*}*/

/*.social-media:hover {*/
/*	transform: scale(1.1);*/
/*	box-shadow: 0 4px 12px rgba(0,0,0,0.2);*/
/*}*/

/*!* رنگ اختصاصی برای هر شبکه *!*/
/*.social-media.telegram { background: #0088cc; }*/
/*.social-media.whatsapp { background: #25D366; }*/
/*.social-media.linkedin { background: #0077B5; }*/
/*.social-media.x { background: #1DA1F2; }*/
/*.social-media.facebook { background: #4267B2; }*/
/*.social-media.copy { background: #E65409; }*/

/*!* آیکون ها وسط قرار بگیرن *!*/
/*.social-media i {*/
/*	pointer-events: none;*/
/*}*/
/*@media (max-width: 768px) {*/
/*	.share-container{*/
/*		padding: 16px 32px;*/
/*	}*/
/*	.social-media {*/
/*		width: 45px;*/
/*		height: 45px;*/
/*		font-size: 20px;*/
/*	}*/
/*}*/
@media screen and (max-width: 768px){
	main.recruitment{
		max-width: 98%;
		margin: 0px auto;
	}
	.recruitment-img{
		margin: 0px auto;
		width: 90%;
	}
	.job-card-container{
		padding: 16px;
	}
	.job-card-container .job-card{
		flex-direction: column-reverse;
		gap: 8px;
	}
	.job-card-container .job-card .right{
		width: 100%;
	}
	.job-card .info-container .info{
		width: 48%;
	}
    .job-card-container .btn-container button{
        font-size: 12px !important;
        padding: 8px 12px !important;
    }
	.span-info{
		font-size: 13px;
	}
	.job-card .left{
		margin-top: 0;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
	}
	.job-card .left > img{
		/*display: none;*/
	}
	.job-card .left .company-info > p{
		margin-bottom: 0;
		font-size: 12px;
	}
	.job-card .left .company-info{
		flex-direction: row;
	}
	.job-card .left .company-info img{
		width: 15px;
		height: 15px;
	}
	.job-archive-container{
		width: 90%;
		margin: 40px auto;
	}
}
@media screen and (max-width: 410px){
	.span-info{
		font-size: 12px;
	}
}
@media screen and (max-width: 390px){
	.span-info{
		font-size: 11px;
	}
}
@media screen and (max-width: 370px){
	.span-info{
		font-size: 10px;
	}
}
/* admin panel page */
.table-index{
    width: 50px;
}
#usersTable .table.dataTable{
    width: 100% !important;
}
.profiles-container table td, .profiles-container table th{
    text-align: center !important;
    padding: 4px 8px;
}
a.btn{
    cursor: pointer;
}
td p{
    margin-bottom: 0px;
}
td img{
    width: 60px;
}
tr.completed{
    background-color: #9efab0 !important;
}
.dataTables_filter{
    margin-bottom: 16px;
}
.filters{
    margin-bottom: 8px;
}

/*modal in admin panel*/
/* پس‌زمینه تیره پشت مدال */
.modal-overlay {
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(0,0,0,0.6);
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 999;
}

/* جعبه مدال */
.modal-box {
    background: #fff;
    padding: 20px;
    border-radius: 12px;
    width: 90%;
    max-width: 800px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.2);
    animation: fadeIn 0.3s ease;
    max-height: 90vh; /* محدود کردن ارتفاع به 90٪ از ارتفاع صفحه */
    overflow-y: auto;
}

.modal-box h3 {
    margin-top: 0;
    font-size: 1.2rem;
    text-align: center;
    color: #222;
}

.modal-box textarea {
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 8px;
    padding: 8px;
    margin-top: 24px auto;
    font-family: inherit;
    resize: vertical;
}

.modal-actions {
    display: flex;
    justify-content: space-between;
    margin-top: 15px;
}

.modal-actions button {
    padding: 8px 16px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 600;
}

.modal-actions .save-btn {
    /*background-color: #0073aa;*/
    color: white;
}
#closeModal{
    background-color: #0073aa;
}

.modal-actions button:hover {
    opacity: 0.9;
}

/* افکت نمایش */
@keyframes fadeIn {
    from { opacity: 0; transform: scale(0.95); }
    to { opacity: 1; transform: scale(1); }
}
/*note attachment*/
#noteFile {
    margin: 16px auto;
}
.attachment{

}
.note-attachment{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin: 16px auto;
    border-top: 1px dashed #ccc;
    padding: 8px;
}
.note-attachment .btn-container{
    display: flex;
    gap: 16px;
}
.note-item .add-file, .note-attachment .remove-file{
    cursor: pointer;
    font-size: 30px;
}