/* ============================================================
   CERES Sabit Logo - Ön yüz stilleri (tüm class'lar "csl-" önekli)
   Ayarlardan gelen değerler inline CSS değişkeni olarak eklenir.
   ============================================================ */

.csl-float {
	position: fixed;
	z-index: var(--csl-z, 9999);
	pointer-events: none; /* Sadece kutunun kendisi tıklanabilir */
	line-height: 1;
}

.csl-float .csl-box {
	pointer-events: auto;
	position: relative;
	box-sizing: border-box;
	background: var(--csl-bg, #fff);
	padding: var(--csl-pad, 10px);
	border-radius: var(--csl-radius, 10px);
	border: var(--csl-border, none);
	transition: opacity .35s ease, transform .35s ease, visibility 0s linear 0s;
}

/* ---------- Konumlar ---------- */
.csl-pos-top-left      { top: calc(var(--csl-y) + env(safe-area-inset-top, 0px));    left: calc(var(--csl-x) + env(safe-area-inset-left, 0px)); }
.csl-pos-top-center    { top: calc(var(--csl-y) + env(safe-area-inset-top, 0px));    left: 50%; transform: translateX(-50%); }
.csl-pos-top-right     { top: calc(var(--csl-y) + env(safe-area-inset-top, 0px));    right: calc(var(--csl-x) + env(safe-area-inset-right, 0px)); }
.csl-pos-middle-left   { top: 50%; left: calc(var(--csl-x) + env(safe-area-inset-left, 0px));  transform: translateY(-50%); }
.csl-pos-middle-right  { top: 50%; right: calc(var(--csl-x) + env(safe-area-inset-right, 0px)); transform: translateY(-50%); }
.csl-pos-bottom-left   { bottom: calc(var(--csl-y) + env(safe-area-inset-bottom, 0px)); left: calc(var(--csl-x) + env(safe-area-inset-left, 0px)); }
.csl-pos-bottom-center { bottom: calc(var(--csl-y) + env(safe-area-inset-bottom, 0px)); left: 50%; transform: translateX(-50%); }
.csl-pos-bottom-right  { bottom: calc(var(--csl-y) + env(safe-area-inset-bottom, 0px)); right: calc(var(--csl-x) + env(safe-area-inset-right, 0px)); }

/* Giriş yapmışken WordPress yönetim çubuğunun altında kalmasın */
body.admin-bar .csl-float[class*="csl-pos-top-"] { top: calc(var(--csl-y) + 32px); }
@media (max-width: 782px) {
	body.admin-bar .csl-float[class*="csl-pos-top-"] { top: calc(var(--csl-y) + 46px); }
}

/* ---------- Logolar ---------- */
.csl-items {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--csl-gap, 10px);
}
.csl-dir-row .csl-items { flex-direction: row; }

.csl-item {
	display: block;
	line-height: 0;
	transition: transform .2s ease;
}
.csl-float img.csl-img {
	display: block;
	width: var(--csl-w, 90px);
	max-width: none;
	height: auto;
	margin: 0;
	border: 0;
	box-shadow: none;
}

a.csl-item:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 3px;
	border-radius: 2px;
}

.csl-hover-lift a.csl-item:hover { transform: translateY(-3px); }
.csl-hover-grow a.csl-item:hover { transform: scale(1.06); }

/* ---------- Üst yazı ---------- */
.csl-label {
	color: var(--csl-label, #1a1a1a);
	font-size: 12px;
	font-weight: 600;
	line-height: 1.3;
	text-align: center;
	margin: 0 0 8px;
}

/* ---------- Gölge ---------- */
.csl-shadow-soft .csl-box   { box-shadow: 0 3px 12px rgba(0, 0, 0, .12); }
.csl-shadow-strong .csl-box { box-shadow: 0 8px 28px rgba(0, 0, 0, .24); }

/* ---------- Kapatma butonu ----------
   Varsayılan: kutunun sağ üst köşesinin hemen dışı.
   Sağa yaslı konumlarda sola, üste yaslı konumlarda alta alınır ki ekran dışına taşmasın. */
.csl-close {
	position: absolute;
	top: -9px;
	right: -9px;
	width: 22px;
	height: 22px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: #333;
	color: #fff;
	font: 600 15px/22px Arial, sans-serif;
	text-align: center;
	cursor: pointer;
	opacity: .85;
	box-shadow: 0 1px 4px rgba(0, 0, 0, .25);
}
.csl-close:hover, .csl-close:focus-visible { opacity: 1; }
.csl-close:focus-visible { outline: 2px solid #333; outline-offset: 2px; }

.csl-float[class*="-right"] .csl-close { right: auto; left: -9px; }
.csl-float[class*="csl-pos-top-"] .csl-close { top: auto; bottom: -9px; }

/* ---------- Görünür / gizli durumlar & animasyonlar ---------- */
.csl-float:not(.is-visible) .csl-box {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity .35s ease, transform .35s ease, visibility 0s linear .35s;
}

.csl-anim-slide[class*="csl-pos-bottom-"]:not(.is-visible) .csl-box { transform: translateY(24px); }
.csl-anim-slide[class*="csl-pos-top-"]:not(.is-visible) .csl-box    { transform: translateY(-24px); }
.csl-anim-slide.csl-pos-middle-left:not(.is-visible) .csl-box       { transform: translateX(-24px); }
.csl-anim-slide.csl-pos-middle-right:not(.is-visible) .csl-box      { transform: translateX(24px); }
.csl-anim-zoom:not(.is-visible) .csl-box                            { transform: scale(.85); }

.csl-anim-none .csl-box,
.csl-anim-none:not(.is-visible) .csl-box { transition: none; }

@media (prefers-reduced-motion: reduce) {
	.csl-float .csl-box,
	.csl-float:not(.is-visible) .csl-box,
	.csl-item { transition: none !important; transform: none !important; }
}

@media print {
	.csl-float { display: none !important; }
}
