

	:root {
	  --ab-orange:rgb(232,140,74);
	  --ab-blue:rgb(26,58,95);
	  --ab-red:rgba(200,36,36,1);
	  --text:rgba(88,88,88,1);
	}
 
 
	 
	/* latin-ext */
	@font-face {
		font-family: "Roboto Mono";
		font-style: normal;
		font-weight: 400 700;
		font-display: swap;
		src: url("/Assets/Fonts/RobotoMono-LatinExt.woff2?V=23") format("woff2");
		unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF;
	}
	
	/* latin */
	@font-face {
		font-family: "Roboto Mono";
		font-style: normal;
		font-weight: 400 700;
		font-display: swap;
		src: url("/Assets/Fonts/RobotoMono-Latin.woff2?V=23") format("woff2");
		unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+20AC, U+2122;
	}

 
	@font-face {
	  font-display: swap;
	  font-family: 'Fellix';
	  font-style: normal;
	  font-weight: 100;
	  src: url('/Assets/Fonts/FellixMoos-Light.woff2?V=23') format('woff2');
	}
	
	@font-face {
	  font-display: swap;
	  font-family: 'Fellix';
	  font-style: normal;
	  font-weight: 200;
	  src: url('/Assets/Fonts/FellixMoos-Light.woff2') format('woff2');
	}
	
	@font-face {
	  font-display: swap;
	  font-family: 'Fellix';
	  font-style: normal;
	  font-weight: 300;
	  src: url('/Assets/Fonts/FellixMoos-Light.woff2?V=23') format('woff2');
	}
	
	@font-face {
	  font-display: swap;
	  font-family: 'Fellix';
	  font-style: normal;
	  font-weight: 400;
	  src: url('/Assets/Fonts/FellixMoos-Regular.woff2?V=23') format('woff2');
	}
	
	@font-face {
	  font-display: swap;
	  font-family: 'Fellix';
	  font-style: normal;
	  font-weight: 500;
	  src: url('/Assets/Fonts/FellixMoos-Medium.woff2?V=23') format('woff2');
	}
	
	@font-face {
	  font-display: swap;
	  font-family: 'Fellix';
	  font-style: normal;
	  font-weight: 600;
	  src: url('/Assets/Fonts/FellixMoos-SemiBold.woff2?V=23') format('woff2');
	}
	
	@font-face {
	  font-display: swap;
	  font-family: 'Fellix';
	  font-style: normal;
	  font-weight: 700;
	  src: url('/Assets/Fonts/FellixMoos-Bold.woff2?V=23') format('woff2');
	}
 
	 
	* {
		overflow-y: auto;
		scrollbar-width: none;
		-ms-overflow-style: none;
	}
	
	*::-webkit-scrollbar,
	*::-webkit-scrollbar {
		width: 0px;
		height: 0px;
		background: transparent;
	}
 
 
 
	h1, h2, h3, h4, h5, h6 {		margin: 0;	}
	
	* {	-webkit-box-sizing: border-box;  -moz-box-sizing: border-box; box-sizing: border-box; -webkit-tap-highlight-color:rgba(0,0,0,0); }
	a, a:visited, a:hover, a:active {
		color:rgb(26,58,95);
		text-decoration: none;
	}
 
	
	
	textarea:focus, input:focus{outline: none;}
 

	.NoSelect {
		-webkit-touch-callout:none;
		-webkit-user-select:none;
		-khtml-user-select:none;
		-moz-user-select:none;
		-ms-user-select:none;
		user-select:none;
	}
 
 

	html,body {
		height:100%;
		min-width:360px;
	}
	

	body {
		margin: 0;
		min-height: 100vh;
		font-family: 'Fellix', Arial, sans-serif;
		font-weight: 400;
		font-size: 16px;	
		line-height: 1.5;
		color: var(--text);
		background:#fff;;
		overflow-x: hidden;
		position: relative;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		min-width:360px;
	}
	button,	input,	textarea,	select {
		font-family: inherit;
		font-weight: inherit;
		font-size: inherit;
	}
	
	
 
	.Centerer { 	
		width:1080px;	
		margin:0 auto;   
	} 
	@media only screen and (max-width:1200px) {
		.Centerer { 	
			width:calc(100%);  
		}  
	}
	
	.Standart {
		float:left;
		width:100%;
		position:relative; 
	}

	.Standart50 { 
		width:50% !important; 
		text-align:center;
		margin-left:25%
	}
	
	.StandartGap {
		width: 100%;
		position: relative;
		display: flex;
		justify-content: center;   /* yatayda ortalar */
		align-items: center;       /* dikeyde hizalar */
		gap: 24px;                 /* aralarındaki boşluk */
		flex-wrap: wrap;           /* sığmazsa alt satıra geçer */
	}
	
	@media only screen and (max-width:900px) {
		.Standart50 { 
			width:70% !important; 
			margin-left:15%
		}
	}
	@media only screen and (max-width:640px) {
		.Standart50 { 
			width:100% !important; 
			margin-left:0px;
		}
	}
	
	
	
	
	
		 
		 
	/* ================= NAVIGATION BAR STYLES ================= */
	
	.Navigator {
		background-color: rgba(255, 255, 255, 1);
		box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
		position: relative;
		z-index: 100;
		float: left;
		width: 100%;
		padding:12px 0px;
	}
	
 
	.Nav_Logo_Container {
		float:left;
		height:46px;
		line-height:20px; 
		padding-left:46px;
		background-image:url(/Assets/Img/Logo_Top.avif?Ref=1.2);
		background-position:left center;
		background-repeat:no-repeat;
		background-size:contain;
		font-size:20px;
		font-weight:700;
		padding-top:3px; 
		font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
		color:#b91f63 !important;
	}
	
	.Nav_Logo_Container span {
		color:#6f1f9c;
	}

	
	.Bottom_Bar_Button {
		flex: 1;
		height: 60px;
	
		border: 0;
		background: transparent;
	
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 3px;
	
		color: #30394F;
		cursor: pointer;
		font-family: inherit;
	}
	
	.Bottom_Bar_Button i {
		font-size: 24px;
		line-height: 24px;
	}
	
	.Bottom_Bar_Button span {
		font-size: 11px;
		line-height: 12px;
		font-weight: 500;
	}
	
	.Bottom_Bar_Button:hover {
		background: rgba(48,57,79,0.05);
	}
	
	.Bottom_Bar_Button.active {
		color: #c00086;
	}
	
	
	
	.Top_Bar {
		position: fixed;
		top: 0;
		z-index: 100;
		width: 100%;
		height: 56px;
		background: #fff;
		display: flex;
		align-items: center;
		padding: 0 8px;
		box-sizing: border-box;
		border-bottom: 1px solid rgba(0,0,0,0.08);
	}
	.Top_Bar_Text {
		font-size: 18px;
		font-weight: 600;
		color: #30394F;
		line-height: 1;
		white-space: nowrap;
		display: flex;
		align-items: center;
		gap:6px;
	}
	
 
	.Top_Bar_Text i {
		font-size: 32px;
		line-height: 1;
	}
		
	
	
	
	
	
	
	
	
	
	
	.Page {
		min-height:80%;
		padding-bottom:32px;
		position:fixed;
		left:0px;
		right:0px;
		top:56px;
		bottom:60px;
		overflow:hidden;
		overflow-y:auto; 
	}
	
	
	.Bottom_Bar {
		position: fixed;
		left: 0;
		bottom: 0;
		width: 100%;
		height: 60px;
		display: flex;
		align-items: center;
		background: #fff;
		border-top: 1px solid rgba(0,0,0,0.08);
		z-index: 9999;
	}

 
	 
	.Gray_Banner {
		background-color:rgba(0,0,0,0.01);
		padding: 32px 0px;
		padding-bottom:48px;
		position: relative;
		isolation: isolate;
		text-align:center;
		border-bottom:1px solid rgba(0,0,0,0.025);
		margin-bottom:32px;
	}
	
	.Gray_Banner::before {
		content: '';
		position: absolute;
		inset: 0;
		background-image: radial-gradient(circle at 10% 20%, rgba(0,0,0,0.04) 1px, transparent 1px);
		background-size: 40px 40px;
		pointer-events: none;
		z-index: -1;
	}
	
	.Gray_Banner::after {
		content: '';
		position: absolute;
		inset: 0;
		background: linear-gradient(135deg, rgba(255,255,255,0.4) 0%, transparent 50%);
		pointer-events: none;
		z-index: -1;
	}
		 
	 
	 
	 
 
	.Burger {
		position: fixed;
		top: 12px;
		right: 16px;
		height: 38px;
		width: 38px;
		background: linear-gradient(135deg, #ff1f7a 0%, #d6003d 55%, #9b1dff 100%);
		border: 1px solid rgba(255, 255, 255, 0.16);
		border-radius: 10px;
		overflow: hidden;
		z-index: 20;
		cursor: pointer;
		box-shadow:	0 10px 24px rgba(255, 31, 122, 0.28),	inset 0 1px 0 rgba(255, 255, 255, 0.22);
		transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
	}

	.BurgerLine {
		position:absolute; 
		left:6px;
		right:6px;
		height:4px;
		background-color:rgba(255,255,255,1);
		transition-duration:400ms;
		transform-origin: center center;
	}
	
	.BurgerLine1 {
		top:6px; 
		z-index:102
	}
	.BurgerLine2 {
		top:16px; 
		z-index:8
	}
	.BurgerLine3 {
		top:26px; 
		z-index:102
	}
 
	
	
	
	
	
	
	.Header {
		margin-bottom:32px; 
		color:rgba(0,0,0,0.8);
	}
	.Description {
		color:var(--ab-blue) ; font-size:14px; font-style: italic;
	}
	
	.Frame {
		position:relative;
		float:left;
		width:100%;
		background-color: white;
		border: 1px solid #e5e7eb;
		border-radius:6px; 
		transition: all 0.2s ease;
		text-decoration: none; 
		padding:22px;
		color:rgba(0,0,0,0.8);
		background-color: rgba(79, 70, 229, 0.025);
		box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.025);
	}
	
	.FrameForm {
		padding-bottom:18px
	}
 
	
	
	.asterix {
		color:rgba(153,0,0,1)
	}

	 
	.Form_Line , .Form_Line_Inline {
		float:left;
		width:100%;
		position:relative;
		margin-bottom:24px
	}
	
	.Form_Line_Inline {
		border-bottom: 1px dotted rgb(228, 230, 234);
		margin-bottom:8px;
		padding-bottom:8px
	}
	
	
	
	.Form_Label_Inline {
		float:left;
		width:calc(20% - 24px);
		position:relative;
		font-size:16px;
		font-weight:500;  
		color:var(--moos-blue-001); 
		display: flex;
		align-items: center;      /* dikey ortalar */
		min-height:46px
	}

	.Form_Label_Dot_Inline {
		float:left;
		width:24px;
		position:relative;
		font-size:20px;
		display: flex;
		align-items: center;      /* dikey ortalar */
		min-height:46px
	}

	.Form_Element_Inline {
		float:left;
		width:80%;
		position:relative;
		display: flex;
		align-items: center;      /* dikey ortalar */
		min-height:46px; 
	}

	
	.Form_Element_Inline input, .Form_Element_Inline textarea, .Form_Element_Inline select
	 {
		padding:12px 12px;
		border-radius:6px;
		border:1px solid rgb(200, 200, 200);; 
		float:left;
		width:100%;
		font-size:16px;
		font-weight:500; 
		min-height:46px; 
		color:var(--moos-blue-001);
	}
	
	
	.Form_Element_Inline button,
	.Form_Element_Inline input[type="button"],
	.Form_Element_Inline input[type="submit"] {
		padding:12px 12px;
		border-radius:6px;
		border:none;
		float:left;
		width:100%;
		font-size:14px;
		font-weight:600;
		min-height:46px;
		background-color:rgba(51,153,255,1);
		color:rgba(255,255,255,1);
		cursor:pointer;
		transition: all 0.2s ease;
	}
	
	
	
	.Form_Element_Inline button:hover,
	.Form_Element_Inline input[type="button"]:hover,
	.Form_Element_Inline input[type="submit"]:hover {
		background-color:rgba(51,102,204,1);
		color:rgba(255,255,255,1); 
	}
	
	
	.Form_Element_Inline button.active,
	.Form_Element_Inline input[type="button"].active,
	.Form_Element_Inline input[type="submit"].active {
		background-color:rgba(44,44,44,1);
		color:rgba(255,255,255,1); 
	}
	
	
	.Form_Element_Inline textarea {
		resize:vertical;
		min-height:100px
	}
	
	
	.Aggrement_Text {
		color:rgba(0,0,0,0.75);
		font-size: 14px; 
	}
	
	 
	input[type="checkbox"] {
		width: 1.25rem;
		height: 1.25rem;
		accent-color: #003399;
		cursor: pointer;
		transform:translate(0px,4px)
	}
	
	
	
	
	
	
	#ProductFormSubmitButton {
		float:right;
		background-color:#003B9D;
		color: white;
		border: none;
		padding:18px 36px;
		border-radius:3px;
		font-size:18px;
		font-weight: 400;
		cursor: pointer;
		transition: background-color 0.2s ease, transform 0.1s ease;
		flex-shrink: 0;
		font-family: inherit;  
		margin-top:32px;
		min-width:240px;
		text-align:center
	}
	
	#ProductFormSubmitButton:hover {
		background-color: #1d5fd1;
	} 
	 
	
	
	@media only screen and (max-width:640px) {
		#ProductFormSubmitButton {
			float:left;
			width:100%;
		}
	}

	#ProductFormSubmitButton:disabled {
		background-color: #9CA3AF !important;
		color: #FFFFFF !important;
		cursor: not-allowed !important;
		opacity: 0.7;
	}
	
	
	.swal2-confirm,.swal2-cancel,.swal2-deny{border:none !important;outline:none !important}.swal2-confirm:focus,.swal2-cancel:focus,.swal2-deny:focus{border:none !important;outline:none !important;box-shadow:none !important}
	
	.swal2-popup *,	.swal2-popup {font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif;}
	
	
	.swal2-html-container {border-bottom:1px dotted rgba(26,58,95,1) ; padding-bottom:24px;}
	
	.swal2-actions{gap:24px !important ; margin-top:24px !important; }
	
	/* Confirm butonu - AB mavisi */
	.swal2-confirm {
		background-color: var(--ab-blue) !important;
		color: white !important;
		border-radius:4px !important;
		font-weight: 600 !important;
		font-weight: 400 !important;
		font-size: 16px !important;
		padding:16px 32px!important; 
		min-width:168px !important;
	}
	
	.swal2-confirm:hover {
		background-color:rgba(51,153,0,1) !important;
	}
	
	.swal2-cancel, .swal2-deny {
		background-color: var(--ab-red) !important;
		border-radius: 4px !important;
		font-weight: 400 !important;
		font-size: 16px !important;
		padding: 16px 32px !important;;
		min-width:168px !important;
	}
	
	.swal2-cancel:hover , .swal2-deny:hover {
		background-color:rgba(164,11,11,1) !important;
	}
 
	.swal2-container {
	  background-color:rgba(26,58,95,0.7) !important;
	}
	
 
	.swal2-popup {
		background-color: white !important;
		border-radius:8px;
		border:3px solid rgba(26,58,95,1)
	}
	
	
	
	.TopIconContainer {
		width: 100px;
		height: 120px;
		background-color: rgba(244,244,244,1);
		border-radius: 8px;
		position: relative;
		box-shadow: 0 8px 18px -6px rgba(0, 0, 0, 0.14);
		border: 1px solid #e5e7eb;
		transition: 
			transform 0.28s ease,
			box-shadow 0.28s ease,
			border-color 0.28s ease,
			background-color 0.28s ease;
	}
	
	.TopIconContainer:hover {
		transform: translateY(-2px);
		box-shadow: 0 12px 24px -8px rgba(0, 0, 0, 0.18);
		border-color: #a5b4fc;
		background-color: rgba(79, 70, 229, 0.05);
	}
		
	.TopIconContainerActive {
		transform: translateY(-6px);
		border: 2px solid #003B9D;
		background-color:rgba(255,255,255,1);
	}
	
	
	
	.TopIconContainer .TopIconImg {
		position:absolute;
		top:8px;
		left:8px;
		right:8px;
		aspect-ratio:1 / 1;
		height:auto;
		background-color:rgba(255,255,255,1);
		background-repeat:no-repeat;
		background-size:contain;
		background-position:center center;
		overflow:hidden;
		border-radius:8px;
	}
	
 
	.TopIconContainer .TopIconTxt {
		position:absolute; 
		left:8px;
		right:8px;
		bottom:5px;
		font-size:12px;
	}
	
	
	.TextCarousel {
		width: 100%;
		min-height: 24px;
		position: relative;
		overflow: hidden;
		text-align: center;
		margin-top:52px
	}
	
	.TextCarouselItem {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		opacity: 0;
		transform: translateY(10px);
		font-size: 15px;
		line-height: 22px;
		color: #0f2d52;
		font-style: italic; 
		transition: opacity 0.45s ease, transform 0.45s ease;
	}
	
	.TextCarouselItem.active {
		opacity: 1;
		transform: translateY(0);
	}
	
	
	 
		
	.Nav_Login_Right {
		float: right;
		background-color: #003B9D;
		color: #ffffff;
		border: none;
		padding: 0px 18px;
		border-radius: 3px;
		font-size: 0.875rem;
		font-weight: 500;
		cursor: pointer;
		transition: background-color 0.2s ease, transform 0.1s ease;
		flex-shrink: 0;
		font-family: inherit;
		height: 38px;
		line-height: 38px;
		margin-top: 4px;
		text-decoration: none;
	
		display: inline-flex;
		align-items: center;
		gap: 7px;
	}
	
	.Nav_Login_Right:hover {
		background-color: #1d5fd1;
	}
	
	.Nav_Login_Icon {
		width: 17px;
		height: 17px;
		stroke: currentColor;
		stroke-width: 2;
		fill: none;
		stroke-linecap: round;
		stroke-linejoin: round;
		flex-shrink: 0;
	}
	 
		 
	.Nav_Print_Right {
		float: right;
		background-color: #be185d;
		color: #ffffff;
		border: 1px solid #be185d;
		padding: 0px 16px;
		border-radius: 3px;
		font-size: 0.875rem;
		font-weight: 500;
		cursor: pointer;
		transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.1s ease;
		flex-shrink: 0;
		font-family: inherit;
		height: 38px;
		line-height: 38px;
		margin-top: 4px;
		margin-right: 8px;
		text-decoration: none;
	
		display: inline-flex;
		align-items: center;
		gap: 7px;
	}
	
	.Nav_Print_Right:hover {
		background-color: #9d174d;
		border-color: #9d174d;
	}
	
	.Nav_Print_Icon {
		width: 17px;
		height: 17px;
		stroke: currentColor;
		stroke-width: 2;
		fill: none;
		stroke-linecap: round;
		stroke-linejoin: round;
		flex-shrink: 0;
	}
		 
			 
		 
	.Button100 {
		width: 100%;
		display: block;
		background-color:#003B9D;
		color: white;
		border: none;
		padding: 18px 36px;
		border-radius: 3px;
		font-size: 18px;
		font-weight: 400;
		font-family: inherit;
		cursor: pointer;
		transition: background-color 0.2s ease, transform 0.1s ease;
		margin-top: 32px;
		text-align: center;
		box-sizing: border-box;
		font-family: inherit;
	}
	.Button100:visisted, .Button100:active {
		color: white !important
	}
	
	.Button100:hover {
		background-color: #1d5fd1;
		color:rgba(255,255,255,1);
	}
	
	.Button100Green {
		background-color: #15803d;
	}
	
	.Button100Green:hover {
		background-color: #16a34a;
		color: rgba(255,255,255,1);
	}
	
	
	
	.Button100Red {
		background-color: #be185d;
	}
	
	.Button100Red:hover {
		background-color: #9d174d; 
	}
	
	
	
	
	.Button100:disabled {
		background-color: #9CA3AF !important;
		color: #FFFFFF !important;
		cursor: not-allowed !important;
		opacity: 0.7;
	}
		
	.Button100Icon {
		width: 32px;
		height: 32px;
		stroke: currentColor;
		stroke-width: 2.3;
		fill: none;
		stroke-linecap: round;
		stroke-linejoin: round;
		flex-shrink: 0;
		transform:translate(-2px,10px)
	}
	
	
	.InfoTable {
		width: 100%;
		border-collapse: collapse;
		font-family: Consolas, "Courier New", monospace;
	}
	
	.InfoTable tr {
		border-bottom: 1px solid rgba(119, 119, 119, 0.35);
	}
	
	.InfoTable td,
	.InfoTable th {
		padding: 6px 0 2px 0;
		font-family: Consolas, "Courier New", monospace;
		font-size: 13px;
		line-height: 18px;
		color: #333;
		vertical-align: top;
	}
	
	
		
		
		
	.ExploreArea {
		position: relative;
		float: left;
		width: 100%;
		padding: 12px 0;
		overflow-x: auto;
		overflow-y: hidden;
		white-space: nowrap;
		-webkit-overflow-scrolling: touch;
	}
	
	.ExploreArea::-webkit-scrollbar {
		display: none;
	}
		
	.ExploreItem {
		display: inline-block;
		width: 82px;
		margin-right: 12px;
		text-align: center;
		text-decoration: none;
		color: #222;
		vertical-align: top;
		transition: all 0.2s ease;
	}
	
	.ExploreImage {
		width: 72px;
		height: 72px;
		margin: 0 auto;
		border-radius: 50%;
		padding: 3px;
		background: linear-gradient(45deg, #feda75, #d62976, #962fbf, #4f5bd5);
		box-sizing: border-box;
		transition: all 0.25s ease;
		box-shadow: 0 4px 10px rgba(0,0,0,0.08);
	}
	
	.ExploreImage img {
		width: 100%;
		height: 100%;
		border-radius: 50%;
		object-fit: cover;
		border: 2px solid #fff;
		padding: 0;
		transition: all 0.25s ease;
	}
	
	.ExploreItem span {
		display: block;
		margin-top: 7px;
		font-size: 12px;
		font-weight: 500;
		color: #333;
		transition: all 0.2s ease;
	}
	
	/* Hover */
	.ExploreItem:hover .ExploreImage {
		transform: translateY(-3px) scale(1.06);
		box-shadow: 0 8px 18px rgba(0,0,0,0.16);
	}
	
	.ExploreItem:hover .ExploreImage img {
		filter: brightness(1.06) contrast(1.04);
	}
	
	.ExploreItem:hover span {
		color: #003B9D;
		font-weight: 600;
	}
	
	/* Tıklama hissi */
	.ExploreItem:active .ExploreImage {
		transform: scale(0.96);
	}
	
	
	
	
	.Call_WhatsApp {
		position:absolute;
		right:0px;
		top:0px;
		background: #1ebe5d;
		color: #fff;
		padding: 16px 24px;
		border-radius:6px;
		font-size: 16px;
		font-weight: 600;
		text-decoration: none;
		line-height: 1;
		transition: all 0.2s ease;
		cursor:pointer
	}
	
	
	
	.Call_WhatsApp:hover {
    	background: #339900;
    	color: #fff; 
	}
	
	
	.ProductNotice {
		background-color:rgba(255,204,0,0.1);
		font-size:13px;
		border-radius:6px;
		padding:12px 24px;
		color:rgba(0,0,0,1);
	}
	
		
		
		
	.ButtonContainer {
		float: left;
		width: 100%;
		text-align: center;
		margin: 20px 0;
	}
	
	.Refresh_Button {
		display: inline-flex;
		align-items: center;
		justify-content: center;
	
		min-width: 140px;
		min-height: 46px;
	
		padding: 12px 24px;
		border: 0;
		border-radius: 6px;
	 
	
		font-size: 16px;
		font-weight: 600;
		cursor: pointer;
	
		text-decoration: none;
		transition: all 0.2s ease;
			
		background: linear-gradient(45deg, #d89b00, #b91f63, #6f1f9c, #2638b8);
		color: #fff;
	}
	
		
	@media (max-width: 768px) {
		.Refresh_Button {
			display: flex;
			width:calc( 100% - 24px);
			margin:0px 12px;
			box-sizing: border-box;
		}
	}
	
	.Refresh_Button:visited {
		color:rgba(255,255,255,1)
	}
	
	.Refresh_Button:hover {
		background: linear-gradient(45deg, #d29b00, #b21f63, #6a1f9c, #2138b8);
		color: #fff; 
	}
	
	.Refresh_Button:active {
		transform: scale(0.98);
	}
	
	@media (max-width: 768px) {
		.Refresh_Button {
			min-width: 160px;
			min-height: 52px;
			font-size: 16px;
			padding: 14px 26px;
		}
	}
	
	
	
	.CategoryAdminBox {
		float:left;
		width:calc( (100% / 4) - 12px);
		background-color:rgba(244,244,244,1);
		border:2px solid rgba(0,0,0,0.2);
		padding:12px;
		border-radius:6px;
		margin-bottom:12px;
		cursor:pointer;
		font-size:16px;
		font-weight:600;
		color:rgba(0,0,0,1);
	}
	.CategoryAdminBox:nth-child(1n) , .CategoryAdminBox:nth-child(2n) {
		margin-right: 12px;
	}
	.CategoryAdminBox:hover {
		border:2px solid rgba(0,120,0,0.8);
	}

	.CategoryAdminBoxSelected {
		background-color:rgba(0,120,0,0.7);
		color:rgba(255,255,255,1);
	}	
	
	@media (max-width: 768px) {
		.CategoryAdminBox {
			float:left;
			width:100%;  
		}
		.CategoryAdminBox:nth-child(1n) , .CategoryAdminBox:nth-child(2n) {
			margin-right: 0px;
		}
	}
	
	
	
	
.Products_Container {
	float: left;
	width: 100%;
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;

	gap:0px;
	padding: 24px 12px;
	box-sizing: border-box;
}

.Product_Card {
	width: 100%;
	max-width: 470px;
	position: relative;
	background: #fff;
	padding-bottom: 24px;
	margin-bottom:24px;
	border-bottom: 1px dotted rgba(0, 0, 0, 0.05);
}

/* ---------- Header ---------- */
.Product_Header {
	width: 100%;
	height: 52px;
	display: flex;
	align-items: center;
	gap: 10px;
	position:absolute;
	left:0px;
	right:0px;
	z-index:12;
	padding-left:8px;
	padding-right:8px;
	
}

@media only screen and (max-width:860px) {
 
 
	
}



.Product_Seller_Logo {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	overflow: hidden;
	background: #eee;
	flex: 0 0 auto;
    box-shadow: 
        0 0 0 2px rgba(255,255,255,0.85),
        0 2px 8px rgba(0,0,0,0.35);
}

.Product_Seller_Logo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.Product_Seller {
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    text-shadow: 0 1px 2px rgba(0,0,0,0.55);
}

/* ---------- Media Slider (Instagram tarzı) ---------- */
.Product_Image {
	width: 100%;
	aspect-ratio: 4 / 6;
	background: #000;
	border-radius:0px;
	position: relative;
	overflow: hidden;
}

.Product_Media_Slider {
	width: 100%;
	height: 100%;
	display: flex;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	cursor: grab;
}

.Product_Media_Slider.dragging {
	cursor: grabbing;
	scroll-snap-type: none; /* sürüklerken snap'in araya girmemesi için */
	user-select: none;
}


.Product_Media_Slider::-webkit-scrollbar {
	display: none;
}

.Product_Media_Item {
	flex: 0 0 100%;
	width: 100%;
	height: 100%;
	scroll-snap-align: center;
	scroll-snap-stop: always;
	position: relative;
}

.Product_Media_Item img,
.Product_Media_Item video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	pointer-events: none;
	user-select: none;
	background: #111;
}

.Product_Media_Counter {
	position: absolute;
	top: 10px;
	right: 10px;
	padding: 3px 9px;
	border-radius: 999px;
	background: rgba(0, 0, 0, 0.45);
	color: #fff;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.3;
	pointer-events: none;
	z-index: 2;
}

.Product_Media_Dots {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	pointer-events: none;
	z-index: 2;
}

.Product_Media_Dots span {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.5);
	transition: background-color 160ms ease, transform 160ms ease;
}

.Product_Media_Dots span.active {
	background: #fff;
	transform: scale(1.3);
}

/* ---------- Actions ---------- */
.Product_Actions {
	position: relative;
	width: 100%;
	display: flex;
	align-items: center;
	gap:18px;
	padding: 8px 0px 8px 0px; 
}






.Product_Actions span {
	width: 30px;
	height: 30px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	color: #262626;
	border-radius: 50%;
	transition:
		background-color 180ms ease,
		transform 160ms ease,
		color 160ms ease;
}

.Product_Actions span i {
	font-size: 28px;
	line-height: 1;
	font-weight: 400;
}

.Product_Actions span:hover {
	background-color: rgba(0, 0, 0, 0.055);
	transform: scale(1.08);
}

.Product_Actions span:active {
	transform: scale(0.92);
}

/* ---------- Likes / Stock ---------- */
.Product_Likes {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 2px;
	padding-bottom: 2px;
	margin-bottom: 2px;
	font-size: 15px;
	color: #333;
}

.Product_Likes > div {
	width: 50%;
}

.Product_Seen {
	text-align: left;
}

.Product_Stock {
	text-align: right;
	font-weight: 600;
	color: #178a3b;
}

/* ---------- Price Badge ---------- */
.Product_Price_Badge {
	position: absolute;
	right: 0px;
	top: 16px;
	color: #111;
	font-size: 16px;
	font-weight: 600;
	line-height: 1;
}

/* ---------- Text ---------- */
.Product_Text {
	width: 100%;
	font-size: 14px;
	color: #222;
	line-height: 1.4;
	padding: 12px 0px;
}

/* ---------- CTA ---------- */
.Product_CTA {
	width: 100%;
	display: flex;
	align-items: center;
	gap: 24px;
	margin-top: 12px;
}

.Product_CTA a {
	height: 42px;
	padding: 0 18px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	text-align: center;
	white-space: nowrap;
	border-radius: 8px;
	background: #111;
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	transition: all 180ms ease;
}

.Product_CTA a i {
	font-size: 18px;
}

.Product_CTA a:hover {
	background: #333; 
}

.Product_CTA_Button {
	flex: 1;
}

.Product_CTA_Save {
	background: #0d6efd !important;
	color: #fff;
}

.Product_CTA_Save:hover {
	background: #0b5ed7 !important;
	color: #fff;
}


 

@media only screen and (max-width:800px) {
	.Product_Card {
		max-width: 100%;
		
	}
	.Products_Container {
		padding:0px 0px 12px 0px;
		gap:0px;
	}

	.Product_Image {
		border-radius: 0px;
	}
	
	.Product_Actions { 	
		padding: 8px 12px;
	}  
	
	.Product_Actions .Product_Price_Badge { 	
		right:12px;
	}  	
	
	.Product_Likes {
		padding: 0px 12px;
	}
	
	.Product_Text {
		padding: 12px 12px;
	}
	
	.Product_CTA {
		padding: 0px 12px;
	}

	.Product_CTA a {
		padding: 0 12px;  
		gap:6px;
	}
	
	.Product_CTA a i {
		font-size: 16px;
	}

	.Product_CTA .Product_CTA_Save {
		flex: 0 0 60%;
	}
	
	.Product_CTA .Product_CTA_Info {
		flex: 1;
	}



}




.Product_Media_Arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 32px;
	height: 32px;
	border: none;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.4);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	z-index: 3;
	opacity: 0;
	transition: opacity 160ms ease, background-color 160ms ease, transform 160ms ease;
}

.Product_Media_Arrow i {
	font-size: 20px;
	line-height: 1;
}

.Product_Media_Arrow:hover {
	background: rgba(0, 0, 0, 0.6);
}

.Product_Media_Arrow_Left {
	left: 10px;
}

.Product_Media_Arrow_Right {
	right: 10px;
}

/* Sadece masaüstünde, kart hover edilince görünsün */
@media (hover: hover) and (pointer: fine) {
	.Product_Image:hover .Product_Media_Arrow {
		opacity: 1;
	}
}

/* Mobilde tamamen gizle */
@media (hover: none), (pointer: coarse) {
	.Product_Media_Arrow {
		display: none;
	}
}

/* İlk ve son slide'da ilgili oku gizle */
.Product_Media_Arrow[disabled] {
	opacity: 0 !important;
	pointer-events: none;
}




	
	.Product_Admin_Buttons {
		width: 100%; 
		margin-bottom: 12px;
		padding:12px 12px; 
		border-bottom: 1px dashed rgba(0,0,0,0.12);
	}
	
	.Product_Admin_Title {
		width: 100%;
		font-size: 12px;
		font-weight: 600;
		color: rgba(0,0,0,0.65);
		margin-bottom: 8px;
	}
	
	.Product_Admin_Button_List {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
	}
	
	.Admin_Filter_Button {
		height: 30px;
		padding: 0 12px;
		border-radius:8px;
		border: 1px solid rgba(0,0,0,0.14);
		background: #fff;
		color: #333;
		font-size: 14px;
		font-weight: 500;
		cursor: pointer;
	}
	
	.Admin_Filter_Button:hover {
		background: rgba(0,0,0,0.04);
	}
	
	.Admin_Filter_Button.active {
		background: #0d6efd;
		border-color: #0d6efd;
		color: #fff;
	}











