@charset "utf-8";
/* CSS Document */

	html, body {
			margin: 0;
			padding: 0;
			height: 100%;
			overflow-x: hidden;
			background-color: #ffffff;
			font-family: "Sarabun", serif;
			font-weight: 300;
			font-style: normal;
			font-size: 15px;
			color: #000;
		}

		.wrapper {
			display: flex;
			width: 100vw;
			height: 100vh;
			margin: 0;
			padding: 0;
		}

		.wrapper .wrapper-left {
			display:flex;
			/*flex: 1;*/
			margin: 0;
			padding: 0;
			justify-content: center; /* yatayda ortalama */
			align-items: center; /* Dikeyde ortalar */
			width:49%;
		}

		.wrapper .wrapper-right {
			display:flex;
			/*flex: 1;*/
			margin: 0;
			padding: 0;
			justify-content: center; /* yatayda ortalama */
			align-items: center; /* Dikeyde ortalar */
			
			width:49%;
		}

		.wrapper .center{
			width:2%;
			border-left:1px dashed #ccc;
		}





.transition{ 
	-webkit-transition: all 750ms ease-in-out; 
	-moz-transition: all 750ms ease-in-out; 
	-ms-transition: all 750ms ease-in-out; 
	-o-transition: all 750ms ease-in-out; 
	transition: all 750ms ease-in-out; 
}
* {
  box-sizing: border-box;
}

.link-clean {
  color: inherit;         
  text-decoration: none;   
  cursor: pointer;         
}

.link-clean:hover {
  text-decoration: none;
	color: inherit;
}


.shadow{
	box-shadow: 1px 1px 1px 1px #ccc;
}

.img-fix{ 
	width:100%; 
	height:auto;
}

.img-gs{ 
	filter: grayscale(0%);
}

.img-gs:hover{ 
	filter: grayscale(0%);
}

.top-submenu{
	font-size:10px; color:#999
}


/* FORMLAR */

.grey{
	background-color:#f4f4f4;
}

/* FORMLAR */


	.list-min-btn{
		margin:0px; padding:6px 10px; display: inline-block; text-decoration:none; cursor:pointer; width: auto;
		align-self: end; color:black; font-variant:small-caps; border:1px solid #e5e5e5; margin-left:120px
	}

	.list-min-btn:hover{
		text-decoration:none;
		background-color:#444;
		color:white;
}



	.form-min-btn{
		margin:0px; padding:6px 10px; display: inline-block; text-decoration:none; cursor:pointer; width: auto;
		align-self: end; color:black; font-variant:small-caps; border:1px solid #e5e5e5; margin-left:0px
	}

	.form-min-btn:hover{
		text-decoration:none;
		background-color:#444;
		color:white;
	}

.form-min-input{
	width:100px; border:1px solid #ccc; padding:6px 10px;
}



.label-genel{
	font-variant:small-caps;
	padding:6px 0px
}

.cosmos-btn{
	border:1px solid #ccc; padding:12px 25px; margin:5px; display: inline-block; text-decoration:none; cursor:pointer; color:black;
}

.cosmos-btn:hover{
	text-decoration:none;
	background-color:#000;
	color:white;
	border:1px solid #000;
}


.cosmos-act-btn{
	border:1px solid #402b64; padding:12px 25px; margin:5px; display: inline-block; text-decoration:none; cursor:pointer; color:white; background-color:#402b64; font-variant:small-caps; font-size:16px
}

.cosmos-act-btn:hover{
	text-decoration:none;
	background-color:#fff;
	color:black;
	border:1px solid #402b64;
}

  .btn-trans {
    border:1px solid #ccc; padding:8px 20px; margin-right:10px; color:black;
  }

  .btn-trans:hover {
    background-color:#ccc;
	   text-decoration: none;
  }


  .btn-trans a {
    text-decoration: none;
	  color:black;
  }

	.left-act-btn{
		margin:2px 0px; border-bottom:1px dashed #000; background-color:black; padding:12px 25px; display: inline-block; text-decoration:none; cursor:pointer; width: auto;
		align-self: end; color:white;
	}

	.left-act-btn:hover{
		text-decoration:none;
		background-color:#444;
		color:white;
		border-bottom:1px dashed #444;
	}

.home-menu-item{
	padding:8px 20px; color:white; font-family:Sarabun; font-weight:500; font-size:12px; border-top:1px solid #444; border-bottom:1px solid #444; margin-bottom:0px; cursor:pointer; text-decoration:none
}

.home-menu-item:hover{
	background-color:#444;
	text-decoration:none
}



.form-row{
	margin-bottom:3px
}

.input-genel{
	border:1px solid #e5e5e5; border-radius:0px; padding:8px; width:70%
}






/* ICONS */

.icon-mask-login{
	display: inline-block; /* veya block */
	width: 40%;
	height: auto;
	color: #402b64;
	margin-top: auto;
	margin-bottom: auto;
	
}


/* LOGIN */

.login-title{
	font-size:28px;
	font-weight:500;
	font-variant:small-caps;
	margin-bottom:30px
}


.lang-choice{
	margin:25px 0px;
	font-size:13px;
}




@media (max-width: 768px) {
	
	  #topmenu-pc{
		 display:none;
	  }
	
	  #pagemenu-mobil{
		 width:40px; height:40px; border-radius:50%; background-color:black; font-size:24px; text-align:center; color:white
	  }
	  
	  #pagemenu-content{margin:0px; text-align:left; display:none; position:fixed; width:100%; height:100%; top:0px; left:0px; color:white; z-index:1000000000; background-color:black;}
	
	  .mobil-menu-item{
		  border-bottom:1px dashed #555; padding:10px; color:white;
	  }
	  
	  .mobil-menu-item:hover{
		  background-color:#444;
		  text-decoration:none;
		  color:white;
	  }
	
	  #topmenu-mobil{
		 position:fixed; width:40px; height:40px; top:7px; left:calc(100% - 47px); border-radius:50%; background-color:black; font-size:24px; text-align:center; color:white; z-index: 10000
	  }
	
	
	.sero-container{
		display: flex; gap:0px; border-bottom:1px solid #e5e5e5; margin-bottom:10px; padding:0px 0px;
		flex-direction: column;
		text-align: left;
		
	}

	.sero-left{
		display:none;
	}

	.sero-right{
		width:calc(100% - 0px); text-align: left; font-family:Sarabun; font-size:14px; font-weight:300
	}

	.sero-center-left{
		display:none;
	}

	.sero-center-right{
		display:none;
	}
	
	
	.polites-left-btn{
		margin:2px 0px; border-bottom:1px dashed #ccc; padding:12px 25px; display: inline-block; text-decoration:none; cursor:pointer; width: auto;
		align-self: end; color:black;
	}

	.polites-left-btn:hover{
		text-decoration:none;
		background-color:#444;
		color:white;
		border-bottom:1px dashed #444;
	}
	  
	  
	.polites-left-act-btn{
		margin:2px 0px; border-bottom:1px dashed #000; background-color:black; padding:12px 25px; display: inline-block; text-decoration:none; cursor:pointer; width: auto;
		align-self: end; color:white;
	}

	.polites-left-act-btn:hover{
		text-decoration:none;
		background-color:#444;
		color:white;
		border-bottom:1px dashed #444;
	}
	
	
	
	
	
	
	
}






	.list-detail-btn{
		margin:0px; padding:6px 20px; display: inline-block; text-decoration:none; cursor:pointer; width: auto;
		align-self: end; color:black; font-variant:small-caps;
	}

	.list-detail-btn:hover{
		text-decoration:none;
		background-color:#444;
		color:white;
	}




 @media (min-width: 769px) {
	 
	  #topmenu-pc{
		 position: fixed; top: 5px; left: 0; width: 100%; z-index: 100; display: flex; justify-content: center; 
	  }
	 
	 #pagemenu-content{
		 display:none;
	 }
	 
	  #topmenu-mobil{
		 display:none;
	  }
	 
	 #pagemenu-mobil{
		 display:none;
	  }

	 .calendar-pagemenu{
		 border-bottom:1px dashed #ccc; padding-bottom:15px; margin-bottom:25px;
	 } 
	 
	.sero-container{
		display: flex; gap:30px; text-align: right; border-bottom:1px solid #e5e5e5; margin-bottom:10px; padding:30px 0px
	}

	.sero-left{
		width:calc(39% - 0px); font-family:Sarabun; font-size:14px; font-weight:500;position: relative; /* Bu da gerekebilir, içerik için */
  z-index: 1;
	}

	.sero-right{
		width:calc(59% - 0px); text-align: left; font-family:Sarabun; font-size:14px; font-weight:300
	}

	.sero-center-left{
		width:calc(1% - 0px); border-right:1px dashed #ccc;
	}

	.sero-center-right{
		width:calc(1% - 0px); border-right:1px dashed #ccc;
	}
	 
	.polites-left-btn{
		margin:2px 0px; border-bottom:1px dashed #ccc; padding:12px 25px; display: inline-block; text-decoration:none; cursor:pointer; width: auto;
		align-self: end; color:black;
	}

	.polites-left-btn:hover{
		text-decoration:none;
		background-color:#000;
		color:white;
		border-bottom:1px dashed #000;
	}
	  
	  
	.polites-left-act-btn{
		margin:2px 0px; border-bottom:1px dashed #000; background-color:black; padding:12px 25px; display: inline-block; text-decoration:none; cursor:pointer; width: auto;
		align-self: end; color:white;
	}

	.polites-left-act-btn:hover{
		text-decoration:none;
		background-color:#444;
		color:white;
		border-bottom:1px dashed #444;
	}
	 
	 
	 
	 .home-list-group{
		 display: flex; justify-content: space-between; border-bottom:1px dashed #ccc; padding: 10px;
	 } 
	 
	 .home-list-group-left{
		 width:40%; text-align: left; font-variant:small-caps
	 }
	 
	 .home-list-group-center{
		 width:5%; text-align: center;
	 }
	 
	 .home-list-group-right{
		 width:55%; text-align: left;
	 }
	 
	 
	 
	 
	 
	 
	 

	 
}



























	 /* ALERT */
	  
	.agora-alert {
		padding: 20px;
		border-radius: 0px;
		font-size: 14px;
		margin-bottom: 1rem;
		border: 1px solid transparent;
		background-repeat: no-repeat;
		min-height: 140px;
		background-size: cover;
		background-position: center;
		color: white;
		display: flex;
		align-items: center; /* dikey orta */
		line-height: 1.5;
		user-select: text;
		justify-content: flex-start; /* soldan hizalı */
		position: relative; /* ::before için gerekli */
	}


	.agora-alert-min {
		padding: 20px;
		border-radius: 0px;
		font-size: 14px;
		margin-bottom: 1rem;
		border: 1px solid transparent;
		color: white;
		text-align:center
	}



		.dionysos-warn { /* Sınır/uyarı */
		  position: relative;
		  z-index: 1;
		  background-color: rgba(214,195,155, 0.3);
		  color: #000;
		border-color: #d6c39b;

		}

		.dionysos-warn::before {
		  content: "";
		  position: absolute;
		  top: 0; left: 0;
		  width: 100%;
		  height: 100%;
		  background-image: url('/media/images/interface/vazo-kadinbasi.png');
		  background-position: top left;
		  background-repeat: no-repeat;
		  background-size: auto 80px;
		  opacity: 0.3; /* sadece arka planın opaklığı */
		  z-index: -1; /* yazının arkasında kalması için */
		}


		.oracle-error { /* Sınır/uyarı */
		  position: relative;
		  z-index: 1;
		  background-color: rgba(218,184,187, 0.3);
		  color: #000;
		border-color: #dab8bb;
			flex-direction: column;
		text-align: left;
			align-items: center;     /* dikeyde ortalar */
  			justify-content: center; 

		}

		.oracle-error::before {
		  content: "";
		  position: absolute;
		  top: 0; left: 0;
		  width: 100%;
		  height: 100%;
		  background-image: url('/media/images/interface/vazo-kadinbasi.png');
		  background-position: top left;
		  background-repeat: no-repeat;
		  background-size: auto 80px;
		  opacity: 0.3; /* sadece arka planın opaklığı */
		  z-index: -1; /* yazının arkasında kalması için */
		}


		.agora-bless { /* Başarı / Onay */
		  position: relative;
		  z-index: 1;
		  background-color: rgba(206,245,205, 0.3);
		  color: #000;
		border-color: #cef5cd;

		}

		.agora-bless::before {
		  content: "";
		  position: absolute;
		  top: 0; left: 0;
		  width: 100%;
		  height: 100%;
		  background-image: url('/media/images/interface/vazo-kadinbasi.png');
		  background-position: top left;
		  background-repeat: no-repeat;
		  background-size: auto 80px;
		  opacity: 0.3; /* sadece arka planın opaklığı */
		  z-index: -1; /* yazının arkasında kalması için */
		}


		.dikaioma-info { /* bilgi */
		  position: relative;
		  z-index: 1;
		  background-color: rgba(128,185,205, 0.3);
		  color: #000;
		  border-color: #80b9cd;
			display: block;
  width: 100%;

		}

		.dikaioma-info::before {
		  content: "";
		  position: absolute;
		  top: 0; left: 0;
		  width: 100%;
		  height: 100%;
		  background-image: url('/media/images/interface/vazo-kadinbasi.png');
		  background-position: top left;
		  background-repeat: no-repeat;
		  background-size: auto 80px;
		  opacity: 0.3; /* sadece arka planın opaklığı */
		  z-index: -1; /* yazının arkasında kalması için */
		}


.icon-mask-left svg {
  width: 80px;
  height: 80px;
	color: #000;
	vertical-align: middle;
	display: inline-flex;
  align-items: center;
  gap: 20px;
	margin-left:20px;
	
}


.icon-mask-title svg {
  width: 30px;
  height: 30px;
	color: #000;
	vertical-align: middle;
	display: inline-flex;
  align-items: center;
  gap: 20px;
	margin-left:20px;
	
}


.icon-mask-list svg {
  width: 14px;
  height: 14px;
	color: #666;
	vertical-align: middle;
	display: inline-flex;
  align-items: center;
  gap: 20px;
	margin-left:20px;
	
}


.polites-content-title{
	font-weight:800; font-size:18px;  padding:0px 0px 14px 0px
}


	.process-grey-btn{
		margin:0px; padding:8px 20px; display: inline-block; text-decoration:none; cursor:pointer; width: auto;
		align-self: end; color:black; font-variant:small-caps; font-size:16px;background-color:#f4f4f4;
	}

	.process-grey-btn:hover{
		text-decoration:none;
		background-color:#444;
		color:white;
	}


	.process-grey-min-btn{
		margin:0px; padding:6px 10px; display: inline-block; text-decoration:none; cursor:pointer; width: auto;
		align-self: end; color:black; font-variant:small-caps; font-size:16px;background-color:#f4f4f4;
	}

	.process-grey-min-btn:hover{
		text-decoration:none;
		background-color:#444;
		color:white;
	}


	.process-green-min-btn{
		margin:0px; padding:6px 10px; display: inline-block; text-decoration:none; cursor:pointer; width: auto;
		align-self: end; color:black; font-variant:small-caps; font-size:16px; background-color:yellowgreen;
	}

	.process-green-min-btn:hover{
		text-decoration:none;
		background-color:#444;
		color:white;
	}


	.process-black-btn{
		margin:0px; padding:12px 25px; display: inline-block; text-decoration:none; cursor:pointer; width: auto;
		align-self: end; color:white; font-variant:small-caps; font-size:16px;background-color:#000; border:1px solid #000;
	}

	.process-black-btn:hover{
		text-decoration:none;
		background-color:#666;
		color:white;
		border:1px solid #666;
	}


	.process-gray-btn{
		margin:0px; padding:12px 25px; display: inline-block; text-decoration:none; cursor:pointer; width: auto;
		align-self: end; color:black; font-variant:small-caps; font-size:16px;background-color:#ccc; border:1px solid #ccc;
	}

	.process-gray-btn:hover{
		text-decoration:none;
		background-color:#666;
		color:white;
		border:1px solid #666;
	}

	.tag-min-btn{
		margin:0px; padding:6px 10px; display: inline-block; text-decoration:none; cursor:pointer; width: auto;
		align-self: end; color:black; font-variant:small-caps; font-size:16px; background-color:#ffffff; border:1px solid #e5e5e5;
	}

	.tag-min-btn:hover{
		text-decoration:none;
		background-color:#444;
		color:white;
		border:1px solid #444;
	}



.trash-unicode-icon{
	border:1px solid #e5e5e5; display:inline-flex; align-items:center; justify-content:center; padding: 0px 10px; text-align:center; cursor:pointer
}

.trash-unicode-icon:hover{
	background-color:red;
}

.dep-text-title {
  font-style: normal;
	font-size: 24px;
	font-family: "Sarabun", serif;
  	font-weight: 300;
	margin:15px 0px;
	padding:12px 25px; 
	background-color:#f4f4f4;
	font-variant:small-caps;
}


.seans-list{
	padding:10px; border-bottom:1px dashed #e5e5e5
}


.package-list-container{
	border-bottom:1px dashed #ccc; padding:8px 0px; margin-bottom:3px; display:flex; gap:0px; flex-wrap:wrap; align-items:center
}

.package-list-pass-container{
	border-bottom:1px dashed #ccc; background-color:#f9f9f9; color:#999; padding:8px 0px; margin-bottom:3px; display:flex; gap:0px; flex-wrap:wrap; align-items:center
}

.process-input{
	border:1px solid #ccc; padding:8px 10px; width:100%
}

.form-row{
	margin-bottom:8px
}

.form-row-title{
	margin-bottom:3px; font-variant:small-caps
}


.form-title-single{
	margin-bottom:3px; font-variant:small-caps; padding:8px 20px; background-color:#e5e5e5; border-bottom:1px dashed #ccc; font-size:18px;
}












ul.pButon{
	overflow:hidden;
	margin-bottom:10px;
}

ul.pButon li{
	float:left;
	border:1px solid #ddd;
	margin-right:5px;
	border-radius:3px;
}

ul.pButon li a{
	display:block;
	padding:10px 15px;
}

.pEditor{
	width:100%;
	height:300px;
	border:1px solid #ddd;
	padding:10px;
	font:14px/21px Arial;
	overflow:auto;
}

.pEditor.html-mode {
	background-color: #fdf6e3;
	color: #333;
	font-family: monospace;
	border: 2px dashed #aaa;
}


.editor-icon{
	display:inline-block; padding:6px; text-align:center; align-items:center; border:1px solid #e5e5e5;
}

.editor-icon:hover{
	background-color:#e5e5e5;
}


.editor-item-icon svg {
  width: 14px;
  height: 14px;
	color: #000;
	vertical-align: middle;
	display: inline-flex;
  align-items: center;
  gap: 2px;
	
}

.editor-item-icon:hover svg {
	background-color:#e5e5e5;
}


.icon-asma-free-row svg {
  width: 18px;
  height: 18px;
	color: #b8792a;
	vertical-align: bottom;
	display: inline-flex;
  align-items: center;
  gap: 2px;
	margin-top:5px;
	margin-right:15px;
	
}


.icon-asma-paid-row svg {
  width: 18px;
  height: 18px;
	color:green;
	vertical-align: bottom;
	display: inline-flex;
  align-items: center;
  gap: 2px;
	margin-top:5px;
	margin-right:15px;


	
}