:root{
	--p:#156edc;

}
article p,article  li,article  h1,article  h2,article  h3,article  h4,article  h5,article  h6,article  span {
  overflow-wrap: break-word;
  overflow-wrap: anywhere;
}


body:has(.closendn:not(.dn):not(.toast):not(.toastleft):not(.toastright)){
	overflow:hidden;
}

.article h2:not(.on):not(.nav-item){
	/* margin-bottom:0.75rem; */
}

.article table{
	border--:1px solid #aaa;
	min-width:60%;
	margin-block--:0.25rem

}
.article table th,
.article table td{
	border-bottom:1px solid #dcdcea;
	padding-block:0.75rem;

}
.article table th:first-child,
.article table td:first-child{
	padding-left:1rem;
}

.tab-content>*{
	display:none;
}

.tab-content>*:is(.active),
.tab-content>*.active{
	display:block;
}

.nav-item{
	cursor:pointer;
	user-select: none;
	-webkit-user-select: none;
	font-weight:600;
	padding-inline:2rem;
	display:flex;align-items:center;
	justify-content:center;
}





.article>*,
section.yazi{
	/* margin-bottom:0.75rem; */
}

.on{
	cursor:pointer;
}

.accordion .on{
	border--:1px solid #aaa;
	border-radius:0.5rem;
}


.accordion .on.active {
    background: #156EDC;
    color: #fff;
}
.accordion .on.active+* {
    outline: 2px solid #156EDC;
    color: #181842;
	outline-offset:-3px;
	background:#fff;
}

.accordion .body{
	padding--:1.2rem;
}


/*ANIMATIONS*/
.svg-box {
	display:inline-flex;
	align-items:center;
	justify-content:center;
	margin-inline:auto;
	position: relative;
	width:150px !important;
	transform--:scale(0.95) translateX(-30%);
}
.green-stroke {
	stroke:#70a040;
}
.red-stroke {
	stroke: #FF6245;
}
.yellow-stroke {
	stroke: #FFC107;
}
.circular circle.path {
	stroke-dasharray: 330;
	stroke-dashoffset: 0;
	stroke-linecap: round;
	opacity: 0.6;
	opacity: 1;
	animation: 0.7s draw-circle ease-out;
	stroke-width: 5px !important;
}

/*------- Checkmark ---------*/
.checkmark{
	stroke-width: 8px !important;
	stroke-linecap: round;
	position:absolute;
	top: 56px;
	left: 52px;
	width: 52px;
	height: 40px;
}

.checkmark path {
	animation: 1s draw-check ease-out;
}

@keyframes draw-circle {
	0% {
		stroke-dasharray: 0,330;
		stroke-dashoffset: 0;
		opacity: 1;
	}

	80% {
		stroke-dasharray: 330,330;
		stroke-dashoffset: 0;
		opacity: 1;
	}

	100%{
		opacity: 0.4;
	}
}

@keyframes draw-check {
	0% {
		stroke-dasharray: 49,80;
		stroke-dashoffset: 48;
		opacity: 0;
	}

	50% {
		stroke-dasharray: 49,80;
		stroke-dashoffset: 48;
		opacity: 1;
	}

	100% {
		stroke-dasharray: 130,80;
		stroke-dashoffset: 48;
	}
}

/*---------- Cross ----------*/
.cross {
	stroke-width:6.25;
	stroke-linecap: round;
	position: absolute;
	top: 54px;
	left: 54px;
	width: 40px;
	height: 40px;
}

.cross .first-line {
	animation: 0.7s draw-first-line ease-out;
}

.cross .second-line {
	animation: 0.7s draw-second-line ease-out;
}

@keyframes draw-first-line {
	0% {
		stroke-dasharray: 0,56;
		stroke-dashoffset: 0;
	}

	50% {
		stroke-dasharray: 0,56;
		stroke-dashoffset: 0;
	}

	100% {
		stroke-dasharray: 56,330;
		stroke-dashoffset: 0;
	}
}

@keyframes draw-second-line {
	0% {
		stroke-dasharray: 0,55;
		stroke-dashoffset: 1;
	}

	50% {
		stroke-dasharray: 0,55;
		stroke-dashoffset: 1;
	}

	100% {
		stroke-dasharray: 55,0;
		stroke-dashoffset: 70;
	}
}

.warn-sign {
	stroke-width:6.25;
	stroke-linecap: round;
	position: absolute;
	top: 40px;
	left: 68px;
	width: 15px;
	height: 70px;
	animation: 0.5s warn-sign-bounce cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.warn-sign .dot {
	stroke:none;
	fill: #FFC107;
}
@keyframes warn-sign-bounce {
	0% {
		transform: scale(0);
		opacity: 0;
	}
	50% {
		transform: scale(0);
		opacity: 1;
	}
	100% {
		transform: scale(1);
	}
}


.lighton img{
	-webkit-animation-duration:.81s;
	animation-duration:0.81s;
	-webkit-animation-name:lighton;
	animation-name:lighton;
 	-webkit-animation-fill-mode:both;
	animation-fill-mode:both;
	background:#201F1A;
	background:#333;
}

@keyframes lighton{
	0%{opacity: 0.1;}
	20%{opacity:0.2;}
	30%{opacity:0.3;}
	40%{opacity:0.4;}
	50%{opacity:0.5;}
	60%{opacity:0.6;}
	70%{opacity:0.7;}
	80%{opacity:0.8;}
	90%{opacity:0.9;}
   100%{opacity:1;}
}


@keyframes toleft {
	0% {
		left:25%;
	}
	100% {
		left:0 ;
	}
}
@keyframes toright {
 	0% {
		right:25%;
	}
	100% {
		right:0 ;

	}
}

@-webkit-keyframes fadein{
from{bottom: 0; opacity: 0;}
to{bottom: 60px; opacity: 1;}
}

@keyframes fadein{
from{bottom: 0; opacity: 0;}
to{bottom: 60px; opacity: 1;}
}

@-webkit-keyframes fadeout{
from{bottom: 60px; opacity: 1;}
to{bottom: 0; opacity: 0;}
}

@keyframes fadeout{
from{bottom: 60px; opacity: 1;}
to{bottom: 0; opacity: 0;}
}



/*Animated result end */


.closedn{
	cursor:pointer;
	aspect-ratio:1/1;
	display:inline-flex;
	align-items:center;justify-content:center;
}


	/*
	transform:scale(var(--scale, 0.58));
	transition: transform 0.52s ease;
	clip-path: circle(0% at 0% 0%);
	clip-path: circle(150% at 50% 50%);
	transition: clip-path 0.5s ease, opacity 0.12s ease;
	max-height: 0 ;
	max-height: 250px;
	transition: opacity 0.2s ease, max-height 0.2s ease;
	opacity: 0;
	transition: transform 0.2s ease, opacity 0.2s ease;
	transform: translate(var(--translate-x, 0), var(--translate-y, 0)) scale(var(--scale, 0.58));
	*/
.tooltip{
	pointer-events: none; /* so tooltip doesn’t block hover */
	box-shadow--:0 1px 5px #555;
	max-width--: 250px;
	border:0 !important;
	text-align:center;
	--ttp:#343a40;color:#fc0;
	--ttp:#32325b;color:#fff;
	background:var(--ttp);
	min-width:10rem;
	word-wrap: break-word;
	font-weight:500;
	font-size:0.9rem;
}
.tooltip.showanim {
}

.tooltip:after{
	content:'🞃';
	content:'▼';

	/*
	background-repeat: no-repeat;
	background-size: contain;
	background-image: url("arrow-down.svg");
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='black'%3E%3Cpath d='M8 12 2.5 5h11z'/%3E%3C/svg%3E");
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3E%3Cpath d='M8 12 2.5 5h11z'/%3E%3C/svg%3E");
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='currentColor'%3E%3Cpath d='M8 12 2.5 5h11z'/%3E%3C/svg%3E");

	width: 20px;
	height:20px;
	*/
	display:inline-block;
    content: "";
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 7px solid var(--ttp);
	bottom:-4.0%;




	color:var(--ttp);
	z-index:1;
	position:absolute;
	/* bottom:4.5%; */
	left:50%;
	left:var(--arrow-left, 50%);
	transform:translate(-50%,57%);
	font-size:1.25rem;
}
.tooltip.arrowup:after{
	transform:translate(-50%,50%) rotate(180deg);
	bottom:100%;
}

.download-b,
.exclamation-b,
.exclamation-g,
.search-d,
.search-f,
.arrow-right-n,
.arrow-down-f,
.arrow-down-b,
.arrow-right-b,
.arrow-right-f{
	background-position:center;
	background-repeat:no-repeat;
	background-color:transparent;
	background-size:100%;
	width :1.3rem;
	aspect-ratio:1/1;
	display:inline-block;
}
.arrow-right-b{background-image:url(../upload/main/icons/button-arrow-right-blue.svg);}
.arrow-right-f{background-image:url(../upload/main/icons/button-arrow-right-white.svg);}
.arrow-right-n{background-image:url(../upload/main/icons/button-arrow-right-navy.svg);}

.arrow-down-b{background-image:url(../upload/main/icons/button-arrow-down-blue.svg);}
.arrow-down-f{background-image:url(../upload/main/icons/button-arrow-down-white.svg);}
.download-b{background-image:url(../upload/main/icons/button-arrow-down-gray.svg);}
.dosya:hover .download-b{background-image:url(../upload/main/icons/button-arrow-down-blue.svg);}


.search-d{background-image:url(../upload/main/icons/button-search-dark.svg);}
.search-f{background-image:url(../upload/main/icons/button-search-white.svg);}

.search-d,
.search-f{
	aspect-ratio:unset;
	aspect-ratio:14/17;
	width:14px;
	height--:17px;
}


.exclamation-b{background-image:url(../upload/main/icons/warning-exclamation-blue.svg);}
.exclamation-g{background-image:url(../upload/main/icons/warning-exclamation-gray.svg);}



.loadingsrc{
	overflow:hidden;
	background-color:#ccc;
	background-image:url(img/loading.gif);
	background-size: 1rem;
	background-repeat: no-repeat;
	background-position: center;
	color:transparent;
	font:0.2rem !important;
}

.loading {
    border-width: 3px;
    --btc: transparent;
    border-color: green;
    border-top-color: transparent;
    border-radius: 50%;
    width: 3rem;
    aspect-ratio: 1 / 1;
    animation: spin 1s linear infinite;
}

/*yeni sw*/
.sw2{
	min-width:2.85rem;
	aspect-ratio:5/3;
	aspect-ratio:6/3;
	aspect-ratio:6/3.2;
	border-radius:10rem;
	position:relative;
	cursor:pointer;
	border:1px solid #ccc;
	display:inline-flex;align-items:center;

	backface-visibility: hidden;
	transform: translate3d(0,0,0);
	will-change: transform;

	vertical-align:middle;
	user-drag: none;-webkit-user-drag: none;
	user-select: none;-webkit-user-select: none;
	display:flex;align-items:center;
	background:#ddd;
}

.sw2:has(:checked){
	background:#0a0;
	background:#4ed164;
	background:#2bc645;
	justify-content--:flex-end;
}


.sw2:after/* ,
.sw2>div */{
	backface-visibility: hidden;
	transform: translate3d(0,0,0);
	will-change: transform;

	content:'';
	transition: left 0.3s ease, transform 0.3s ease 0.03s;
	/*ağır sayfalarda table + filtre sırasında animasyon atlama yapar. thread yoğun syaflarda browser layout/reflow yapar */
	/*
	box-shadow: inset 0 0 1px 1px #0002,0 0 1px #000f;
	*/
	box-shadow: -2px 4px 3px rgba(0, 0, 0, 0.05);
	background:#fff;
	border-radius:50%;
	aspect-ratio:1;
	height:100%;
	position:absolute;
	left:0%;
	transform:translateX(0%);
}
.sw2nt:after{
	transition:unset;
}
.sw2:has(input:checked):after
/*, .sw2>input:checked+div */{
	left:100%;
	transform:translateX(-100%);
}
.sw2 input{
	display:none;
}


.sw{
	cursor: pointer;
	display: inline-flex !important;
	align-items:center;
	justify-content:center;
	place-items: center;
	--swbg:#fff;
	--radius: 80rem;
	 overflow:hidden;
	gap: 0em;
	max-width:fit-content;
	width:auto !important;
	min-height:1.2rem;
	padding-inline:2px;
/*
	height:32px !important;
	 */
}

.sw input{
	--switch-position: 0%;
	appearance: none;
	background-color: #7f7f7f;
	border:0px solid #7f7f7f;
	border-radius: var(--radius);
	display: inline-flex;align-items:center;
	margin: 0;padding:0;
	aspect-ratio:1.8/1;
	height:100%;
	cursor:pointer;
	position:relative;
	--chkd:#7f7f7f;
}


.sw input:checked {
	--chkd:#0b0;
	--switch-position: 100%;
	background-color: var(--chkd);
}

.sw input:after{
	content:'';
	background:#fff;
	border-radius:50rem;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	box-shadow--:0 0px 2px #aaa;
	aspect-ratio:1/1;
	height: calc(100% - 2px);
	transform:translateX(1px);
	transition: transform 0.11s linear !important;
	border:0.25px solid var(--chkd);

}
.sw input:checked:after{
	transform:translateX(calc(100% - 1.5px));
}
.sw input[type="radio"],
.sw input[type="checkbox"] {
  position:relative;
  width:  auto;
  height: calc(100% - 6px);
}
.sw input:disabled {
	opacity:.7;
}

/* .sw input:focus-visible {
	outline: 2px solid var(--chkd);
	outline-offset: 2px
}

.sw input:active:not(:disabled) {
	filter: brightness(1.1);
}
*/


.row .break,
.row .break,
.dif .break,
.dfc .break,
.df .break{
	width:100%;
	display:block;
	flex:0 0 auto;
	min-width: 1px;
	flex-basis: 100%;

}


hr:not([size]) {
    height: 0.04rem;
}
hr {
    margin: 1rem 0;
    color: inherit;
    background-color: currentColor;
    border: 0;
    opacity: 0.25;
}


.symbols{
	font-family:DejaVu Sans, Symbola, Everson Mono, Dingbats, Segoe UI Symbol, Quivira, SunExt-A, FreeSerif, Universalia, unifont;
}


.ribbon {
	--f: .5em;
	position: absolute;
	top: 0;
	right: 0;
	border-image: conic-gradient(#0008 0 0) 51% / var(--f);
	/*sola
	clip-path: polygon(100% calc(100% - var(--f)), 100% 100%, calc(100% - var(--f)) calc(100% - var(--f)), var(--f) calc(100% - var(--f)), 0 100%, 0 calc(100% - var(--f)), 999px calc(100% - var(--f) - 999px), calc(100% - 999px) calc(100% - var(--f) - 999px));
	transform: translate(calc((cos(45deg) - 1) * 100%), -100%) rotate(-45deg);
	transform-origin: 100% 100%;
	*/
	/*sağa*/
	clip-path: polygon(100% calc(100% - var(--f)), 100% 100%, calc(100% - var(--f)) calc(100% - var(--f)), var(--f) calc(100% - var(--f)), 0 100%, 0 calc(100% - var(--f)), 999px calc(100% - var(--f) - 999px), calc(100% - 999px) calc(100% - var(--f) - 999px));
	transform: translate(calc((1 - cos(45deg)) * 100%), -100%) rotate(45deg);
	transform-origin: 0% 100%;
}



img {
    -webkit-user-drag: none;
    user-select: none;
    -moz-user-select: none;
}

.hvr:hover{
	background:#f1f1f1;
}