/*
Theme Name: 2024 Child-Theme
Template: twentytwentyfour
Version: 1.0.0
Author: Divan
Description: اين یک پوسته فرزند است که به صورت اختصاصی برای باشگاه میلیونرها ایجاد شده است
*/

p, h1, h2, h3, h4, h5, h6, label, input, .pay-res, #my-footer, .wp-element-button, .wpcf7-response-output, #loginbtn, #login + a, #user-info, .wp-block-list, .wpcf7-form button, span.error, span.success, .tab{
	font-family: iransansx !important;
}

header{
	display: block;
    height: .1px;
    position: relative;
}

p:not(:has(+ *)), ol:not(:has(+ *)){
	margin-bottom: 0;
}
p{
	margin-top: 0;
}

.home-image {
	height: 600px !important;
	max-height: 100vw;
	margin: 0 auto !important;
	position: relative;
	background-position: center !important;
}

.home-image::after {
	content: "";
	width: 100%;
	height: 100%;
	z-index: 0;
	background-image: linear-gradient(180deg, rgba(2, 8, 23, 0) 80%, rgba(2, 8, 23, 1) 100%);
	position: absolute;
	left: 0;
	top: 0;
}

.zin1{
	position: relative;
	z-index: 1;
}


.wpcf7-form {
	width: 400px;
	max-width: calc(100% - 30px);
	margin: 0 auto;
	border: 1px solid #1e293b;
	border-radius: 10px;
	padding: 15px 30px;
}

.wpcf7-form p, .wpcf7-form span, .wpcf7-form input{
	width: 100%;
	display: block;
}

.wpcf7-form input {
	font-size: 16px;
	margin-top: 10px;
	background: transparent;
	color: #fff;
	padding: 7px 10px;
	box-sizing: border-box;
	border: 1px solid #1e293b;
	border-radius: 8px;
	transition: .5s ease;
}

.wpcf7-form input:focus-visible {
	outline: none;
	box-shadow: 0 0 5px 0px #1e4586;
}

input.wpcf7-submit{
	background: #1e4586;
	cursor: pointer;
	margin-top: 30px;
	color: #fff;
	font-weight: bold;
}

input.wpcf7-submit:hover{
	box-shadow: 0 0 6px 1px #1e4586;
}


.transform{
	position: relative;
	z-index: 1;
	margin-bottom: 50px !important;
}

.transform h3 {
	margin: 40px auto !important;
	max-width: 400px;
	background: rgba(228, 163, 0, .1);
	border: 1px solid rgb(228, 163, 0);
	font-size: 18px !important;
	font-weight: 400 !important;
	padding: 12px !important;
	border-radius: 10px;
}

.pay-res{
	display: block;
	width: 400px;
	background: #fff;
	border: 1px solid #1e293b;
	border-radius: 10px;
	padding: 30px;
	text-align: center;
	color: #1e293b;
}

.pay-res b{
	display: block;
	margin-bottom: 10px;
}

.pay-res span{
	display: block;
	margin-top: 20px;
	border: 2px solid;
	border-radius: 8px;
	padding: 15px;
	font-size: .8em;
	font-weight: bold;
}

.res-mark{
	width: 80px;
	height: 80px;
	padding: 20px;
	margin: 0 auto 30px;
	border: 2px solid;
	border-radius: 70px;
	box-sizing: border-box;
}

.pay-res table{
	width: 100%;
	margin-top: 25px;
	border-spacing: 0;
	font-size: .9em;
	text-align: right;
}

.pay-res table td{
	padding: 10px;
	border-bottom: 1px solid #eee;
}

.pay-res table tr td:last-child{
	text-align: left;
}

.pay-res tr:last-child td{
	border-bottom: none;
}

.pay-res a {
    color: #e4a300;
}

main{
	min-height: calc(100vh - 90px);
}

#maintm{
	max-width: 700px;
}

footer{
	z-index: 2;
	position: relative;
	height: 75px;
	margin-top: 15px;
	box-sizing: border-box;
	border-top: 1px solid #ccc;
}

#my-footer{
	text-align: center;
    margin: 0px auto 20px;
    min-width: 100%;
    display: inline-block;
}

#my-footer a{
	text-decoration: none;
	outline: none;
	transition: all .3s ease;
	padding-bottom: 3px;
	border-bottom: 1px dashed;
}

#my-footer a:hover{
	text-shadow: 0 0 6px #fff;
}

#my-footer img{
	vertical-align: middle;
	width: 20px;
	margin-right: 5px;
}

#loginbtn{
	position: absolute;
    left: 20px;
    top: 20px;
    z-index: 10;
	font-size: .9em;
}

#loginbtn a{
	display: inline-block;
    padding: 5px 15px;
	margin-right: 15px;
	background: #1e293b;
    border-radius: 5px;
    text-decoration: none;
	transition: background .3s ease;
}

#loginbtn a:hover{
	background: #16253d;
}

#user-info{
	width: 100%;
	padding: 5px 0;
}

#user-info td{
	padding: 15px;
}

#user-info tr td:last-child{
	direction: ltr;
}

#user-info tr td:first-child{
	font-weight: bold;
}

#user-info tr:first-child td{
	border-bottom: 1px solid;
}

#user-info textarea{
	width: 100%;
    height: 80px;
    resize: none;
    background: transparent;
    color: #fff;
    padding: 10px;
	border: none;
    background: #020817;
	border-radius: 10px;
}

span.copycb{
	cursor: pointer;
    border-radius: 4px;
    padding: 8px 12px 4px;
    background-color: #020817;
    color: #fff;
    margin-right: 8px;
    transition: background-color .5s ease;
    font-size: .8rem;
    font-weight: normal;
}

span.copycb svg{
	width: 16px;
    fill: #c2cbdc;
    vertical-align: sub;
    margin-right: 8px;
}

main.wp-block-group{
	position: relative;
}

#login-title{
	margin-top: 200px;
	text-align: center;
	font-weight: bold;
    margin-bottom: 30px;
}

#login.wpcf7-form{
	background: #1f2941;
}

#login.wpcf7-form label{
    display: inline;
}

#login.wpcf7-form input{
	direction: ltr;
	margin-bottom: 15px;
	background: rgba(2, 8, 23, .4);
	border-color: #020817;
}

#login + a{
	margin: 30px auto 0;
    display: table;
    text-decoration: none;
    color: #e4a300;
	border-bottom: 1px solid transparent;
}

#login + a:hover{
	border-color: #e4a300;
}

#verifybtn{
	display: none;
}

/* #verifybtn, #sendotp{
	width: 100%;
} */

#login label[for="token"]{
	display: none;
	text-align: center;
}

span.error{
	font-size: .85em;
    padding: 8px 10px;
    margin-top: 20px;
    box-sizing: border-box;
	background: rgba(255, 0, 0, .2);
	border: 1px solid #f00;
	border-radius: 8px;
    text-align: center;
}

span.success{
	font-size: .85em;
    padding: 8px 10px;
    margin-bottom: 10px;
    box-sizing: border-box;
	background: rgba(0, 180, 0, .2);
	border: 1px solid #060;
	border-radius: 8px;
    text-align: center;
	margin-top: 20px;
}

.wpcf7-form button{
	background: #1e4586;
	width: 100%;
    cursor: pointer;
    margin-top: 10px;
    color: #fff;
    font-weight: bold;
	padding: 7px 30px;
    box-sizing: border-box;
    border: 1px solid #1e293b;
    border-radius: 8px;
    transition: all .5s ease;
}

.wpcf7-form button:hover{
	box-shadow: 0 0 6px 1px #1e4586;
}

#user-area{
	padding-inline: 20px;
	margin-inline: auto;
	width: 1200px;
	max-width: 100%;
}

#user-area > *{
	max-width: 100%;
}

#user-area .tab{
	margin-top: 150px;
}

.video-container{
	width: 500px;
    max-width: 100%;
    margin: 0 auto;
}

.video-container:has(+ *){
	margin-bottom: 20px;
}


.bank-detail{
	background: #ddd;
    padding: 15px;
    font-size: .95rem;
    border-radius: 5px;
    margin-bottom: 20px;
	display: grid;
    row-gap: 5px;
}





/*tabs*/
.tab{
	width: 100%;
    display: flex;
	align-items: flex-start;
}

.tab-menu{
	width: 30%;
    display: flex;
	margin-left: 40px;
	box-sizing: border-box;
    flex-direction: column;
    box-sizing: border-box;
	background: #1f2941;
	padding: 25px 20px;
    border-radius: 13px;
	z-index: 15;
}

.tab-menu a{
    margin-bottom: 10px;
    padding: 12px 16px;
    text-decoration: none;
    border-radius: 10px;
	transition: background .2s ease;
}

.tab-menu a:hover{
	background: #182139;
}

.tab-menu a:last-child{
	border-bottom: none;
}

.tab-menu a.active{
	background: #0f172c;
}

.tab-menu a::before {
    content: "";
    background: transparent;
    height: 100%;
    width: 5px;
    display: block;
    position: absolute;
    top: 0;
    right: 0;
}

.tab-menu h4{
	margin: 0 0 25px;
    padding: 0 10px 20px;
    border-bottom: 2px dashed #020817;
    text-align: center;
    font-weight: bold;
    font-size: 1.2rem;
}

.tab-menu h4 span{
	display: block;
    margin-top: 12px;
    font-weight: normal;
    color: #8896b6;
	font-size: .9em;
}

.tab-menu a:last-child{
	margin-bottom: 0;
}

.tab-body{
	width: 70%;
	box-sizing: border-box;
	padding: 30px;
	border: 1px solid #1f2941;
    border-radius: 12px;
	background: #1f2941;
}

.tab-body h3{
	font-size: 1.4em;
    font-weight: bold;
    text-align: center;
    margin: 0 0 30px;
	color: #cdcdcd;
}

.tab-body a.btn{
	border-radius: .33rem;
    color: #ffffff;
    background-color: #020817;
    padding: .6rem 1rem;
    margin: 20px auto 0;
    display: block;
    width: 100px;
    text-decoration: none;
    font-size: .9rem;
    text-align: center;
}

.tab-body a{
	color: #e4a300;
}




/*Aparat iframe*/
.aparat-frame{
	position: relative;
}

.aparat-frame .ratio{
	display :block;
	width: 100%;
	height: auto;
}

.aparat-frame span{
	display: block;
	padding-top: 57%;
}

.aparat-frame iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: none;
    border-radius: 10px;
    box-shadow: 0 0 7px 1px #1e4586;
}




@media screen and (max-width: 782px){
	.entry-content{
		padding: 0;
	}

	.entry-content main{
		margin: 0;
		max-width: 100%;
	}
	
	.entry-content .transform{
		padding-right: var(--wp--style--root--padding-right);
    	padding-left: var(--wp--style--root--padding-left);
	}
	
	.wpcf7-form{
		width: 80%;
		max-width: calc(100% - 10px);
	}
	
	.pay-res{
		width: 80%;
	}
	
	.pay-res span{
		font-size: .9em;
	}
	
	h2:has(+ .zin1) {
		margin-top: 50px !important;
	}
	
	#mnbtn{
		width: 45px;
		height: 45px;
		position: fixed;
		right: 20px;
		top: 20px;
		background: #1e293b;
		border-radius: 5px;
		padding: 10px;
		box-sizing: border-box;
		z-index: 16;
	}
	
	#mnbtn svg{
		fill: #fff;
		height: 100%;
        margin: 0 auto;
        display: block;
	}
	
	#user-area .tab{
		margin-top: 85px;
	}
	
	.tab-body{
		width: 100%;
	}
	
	.tab-menu{
		width: 100%;
        height: 100vh;
		padding-top: 90px;
        margin: 0;
        position: fixed;
        top: 0;
        right: -100%;
        transition: right .5s ease;
		border-radius: 0;
	}
	
	.tab-menu.open{
		right: 0;
	}
	
	.tab-menu h4{
		text-align: right;
	}
	
	#loginbtn a{
		padding: 10px 15px;
	}
}


@media screen and (min-width: 782px){
	.home-image{
		height: 900px !important;
		width: 700px;
		background-position: 0 -260px !important;
	}
	
	.home-image::after{
		background-image: linear-gradient(90deg, #020817 0, rgba(2,8,23,0.985565) .97%, rgba(2,8,23,0.945131) 2.07833%, rgba(2,8,23,0.883007) 3.29667%, rgba(2,8,23,0.803499) 4.60167%, rgba(2,8,23,0.710915) 5.96667%, rgba(2,8,23,0.609563) 7.365%, rgba(2,8,23,0.50375) 8.77167%, rgba(2,8,23,0.397784) 10.16%, rgba(2,8,23,0.295973) 11.505%, rgba(2,8,23,0.202624) 12.78%, rgba(2,8,23,0.122044) 13.95833%, rgba(2,8,23,0.0585423) 15.01667%, rgba(2,8,23,0.0164249) 15.92833%, rgba(2,8,23,0) 16.66667%, rgba(2,8,23,0) 83.33333%, rgba(2,8,23,0.0164249) 84.07167%, rgba(2,8,23,0.0585423) 84.98333%, rgba(2,8,23,0.122044) 86.04167%, rgba(2,8,23,0.202624) 87.22%, rgba(2,8,23,0.295973) 88.495%, rgba(2,8,23,0.397784) 89.84%, rgba(2,8,23,0.50375) 91.22833%, rgba(2,8,23,0.609563) 92.635%, rgba(2,8,23,0.710915) 94.03333%, rgba(2,8,23,0.803499) 95.39833%, rgba(2,8,23,0.883007) 96.70333%, rgba(2,8,23,0.945131) 97.92167%, rgba(2,8,23,0.985565) 99.03%, #020817),linear-gradient(0deg, #020817 0, #020817 10.48148%, rgba(2,8,23,0.985565) 23.63704%, rgba(2,8,23,0.945131) 26.1%, rgba(2,8,23,0.883007) 28.80741%, rgba(2,8,23,0.803499) 31.70741%, rgba(2,8,23,0.710915) 34.74074%, rgba(2,8,23,0.609563) 37.84815%, rgba(2,8,23,0.50375) 40.97407%, rgba(2,8,23,0.397784) 44.05926%, rgba(2,8,23,0.295973) 47.04815%, rgba(2,8,23,0.202624) 49.88148%, rgba(2,8,23,0.122044) 52.5%, rgba(2,8,23,0.0585423) 54.85185%, rgba(2,8,23,0.0164249) 56.87778%, rgba(2,8,23,0.0164249) 100%)
	}
	
	.transform{
		margin-top: -300px !important;
	}
	
	.tab-menu h4 span{
		display: none;
	}
	
	#mnbtn{
		display: none;
	}
}




@font-face {
	font-family: iransansx;
	src: url('assets/fonts/IRANSansX-Regular.woff') format('woff');
}
@font-face {
	font-family: iransansx;
	src: url('assets/fonts/IRANSansX-Bold.woff') format('woff');
	font-weight: 700;
}