/*------------------------------------------------------
* 	 Date : 10.06.2025
*  Design : [Hasan MUTLU]
* 	 Mail : bilgi@cocukpsikiyatriankara.com.tr
* Website : www.cocukpsikiyatriankara.com.tr
*-------------------------------------------------------
* Description:
* - Ankara Çocuk ve Ergen Psikiyatristi
* - Mustafa Kemal Mah. 2156. Sk. No:20/1 Casanita Plaza,
* - Casanita Plaza, Kat:1, No:102, 06510 Çankaya-Ankara
*-------------------------------------------------------*/

/*
TABLE BUILD

    1. FONT

	2. GENERAL
		A. Owl Sliders
		B. Fslightbox
		C. Pagination
		D. Tabs
		E. Section Title
		F. Special Form
		G. Buttons Group
		H. Modal
		H. Accordion
		I. Horizontal/Vertical Tabs

	3. HEADER
		A. Contact
		B. Social Media
		C. Logo & Menu
		D. Other Menu
		E. Off Canvas Menu
		F.

	4. SLIDER (CAROUSEL)
		A. Main Slider (Image & Text Slider)
		B. Services Slider
		C. Blog Slider
		D. Memberships Slider

	5. MAIN CONTENT
		A. About Us
		B.
		C. Our Staff
		D. Videos
		E. Feedback
		F. Column
		G. CTA Section
		H. Contact

	6. ADDITIONAL CONTENT
		A.
		B.
		C.
		D.
		E.
		F. Scroll(Footer) Style
		G.

	7. MORE CONTAINER
		A. Title
		B. Sidebar Left
		C. Sidebar Right
		D. File Download
		E. Comment Form
		F. Related News
		G. Section Details
		H. Project Sponsored
		I. Video Gallery
		J. Photo Gallery
		K. Page Detail
		L. Social Media Sharing
		M. About Us Detail
		N. Services Detail
		O. Mission And Vision
		P. Login
		R. Profile Overview
		S. Statistics
		T. Patients
		U. Appointments
		V. Messages
		Y. Session
		Z. Children
		X. Support
		AA. Doctor Comments
        AB. Dashboard Widgets
        AC. Doctor Appointments
        AC. Expert Detail Hero
        AD. Dashboard Calendar
        AE. Team Page
        AF. Secretary Tasks




	8. FOOTER
		A. Working Hours
		B. Social Media
		C. Title
		D. Logo, Site Name, Address...
		E. Lists
		F. Contact
		G. Newsletter
		H. Copyright & Design
		I. Scroll Up/ Down

	9. RESPONSIVE DESIGN
		A. 100 x 576 (mobile)
		B. 576 x 768 (tablet)
		C. 768 x 1024 (medium tablet and phone)
		D. 1024 x 1199 (large tablet and laptop)
		E. 1199 x 1399 (large desktop and wide monitor)
		F. 1400 > (Larger than 1400px) (large desktop)
		G. Print

	10. ANIMATIONS
		A. Video Icon
		B. Fixed Menu
		C. About Icon

*/

/*===================================================
   1. FONT
=====================================================*/
@import "am-fonts.css";
@import "am-root.css?v=1.0.26";
/*===================================================
   END OF FONT
=====================================================*/

/*===================================================
   2. GENERAL
=====================================================*/
body {
	background-color:var(--background-color);
	font-family: var(--primary-font), sans-serif;
	font-size: var(--body-font-size);
	color:var(--color-text);
	line-height: var(--body-line-height);
	font-weight: var(--body-font-weight);
	margin:0;
	padding:0;
    margin-top: -24px !important;
}
a {
	transition: all var(--transition-medium);
	text-decoration: none;
	outline: none;
}

a:hover,
a:active,
a:focus {
	color:var(--primary-color);
}
dl, ol, ul {
	list-style:none;
	margin: 0;
	padding: 0;
}
img {
	width: 100%;
	height: auto;
	vertical-align: middle;
}
::selection{
	background:var(--primary-background) none repeat scroll 0 0;
	color:var(--white-color);
}
::-moz-selection{
	background:var(--primary-background) none repeat scroll 0 0;
	color:var(--white-color);
}
/*---------------------------------------------------
   2.A Owl Sliders
-----------------------------------------------------*/
.layout1.owl-carousel,
.layout2.owl-carousel,
.layout3.owl-carousel,
.layout4.owl-carousel,
.layout4b.owl-carousel,
.layout5.owl-carousel{overflow: hidden;}

.layout1 .owl-nav button,
.layout2 .owl-nav button,
.layout3 .owl-nav button,
.layout4 .owl-nav button,
.layout4b .owl-nav button,
.layout5 .owl-nav button {
	background: var(--white-color) !important;
	color: var(--primary-color) !important;
	font-size: 1.125rem !important;
	text-align: center;
	border: 1px solid rgba(0, 0, 0, 0.06);
	border-radius: var(--radius-circle);
	height: 48px;
	width: 48px;
	opacity: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.16);
	transition: var(--transition-all-medium);
}
.layout1.layout1-additional .owl-nav button,
.layout2.layout2-additional .owl-nav button,
.layout3.layout3-additional .owl-nav button,
.layout4.layout4-additional .owl-nav button,
.layout4b.layout4b-additional .owl-nav button,
.layout5.layout5-additional .owl-nav button{width: 38px;height: 38px;}

/*.layout4b.layout4b-additional .owl-nav button{opacity: 1;}*/

.layout1 .owl-nav,
.layout3 .owl-nav,
.layout4 .owl-nav,
.layout4b .owl-nav,
.layout5 .owl-nav{
	position: absolute;
	top: 40%;
	right: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.layout1 .owl-nav button.owl-prev,
.layout2 .owl-nav button.owl-prev,
.layout3 .owl-nav button.owl-prev,
.layout4 .owl-nav button.owl-prev,
.layout4b .owl-nav button.owl-prev,
.layout5 .owl-nav button.owl-prev {
	position: absolute;
	top: 50%;
	left: -40px;
}
/*.layout4b .owl-nav button.owl-prev {
	position: absolute;
	top: 75%;
	left: -65px;
}*/
.layout1 .owl-nav button.owl-next,
.layout2 .owl-nav button.owl-next,
.layout3 .owl-nav button.owl-next,
.layout4 .owl-nav button.owl-next,
.layout4b .owl-nav button.owl-next,
.layout5 .owl-nav button.owl-next {
	position: absolute;
	top: 50%;
	right: -40px;
}
/*.layout4b .owl-nav button.owl-next{
	position: absolute;
	top: 75%;
	left: -125px;
}*/
.layout1 .owl-nav button:hover,
.layout2 .owl-nav button:hover,
.layout3 .owl-nav button:hover,
.layout4 .owl-nav button:hover,
.layout4b .owl-nav button:hover,
.layout5 .owl-nav button:hover {
	background: var(--primary-background) !important;
	color: var(--white-color) !important;
	transform: scale(1.05);
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.20);
}

.layout1.owl-carousel:hover button.owl-prev,
.layout2.owl-carousel:hover button.owl-prev,
.layout3.owl-carousel:hover button.owl-prev,
.layout4.owl-carousel:hover button.owl-prev,
.layout4b.owl-carousel:hover button.owl-prev,
.layout5.owl-carousel:hover button.owl-prev{
	opacity: 1;
	left: 40px;
}
.layout1.owl-carousel:hover button.owl-next,
.layout2.owl-carousel:hover button.owl-next,
.layout3.owl-carousel:hover button.owl-next,
.layout4.owl-carousel:hover button.owl-next,
.layout4b.owl-carousel:hover button.owl-next,
.layout5.owl-carousel:hover button.owl-next{
	opacity: 1;
	right: 40px;
}

/*------*/
.layout3,
.layout4 {
	background: transparent;
	margin: 0 0 1.5rem 0;
	position: relative;
	zoom: 1;
}
.layout4.layout4-modifier{margin:1rem 0 0 !important;}
.layout4 .owl-stage-outer{padding-bottom:1.5rem;}
.layout4b .owl-stage-outer{border-radius: var(--radius-lg);}

.layout3 .owl-nav.disabled + .owl-dots,
.layout4 .owl-nav.disabled + .owl-dots {
	margin-top: 15px;
}
.layout3 .owl-dots,
.layout4 .owl-dots {
	display: flex;
	align-items: center;
	justify-content: center;
	/*text-align: center;*/
	padding: .5rem 0;
	-webkit-tap-highlight-color: transparent;
}
.layout4 .owl-dots .owl-dot,
.layout4 .owl-dots .owl-dot {
	display: inline-block;
	zoom: 1;
	*display: inline;
}
.layout3 .owl-dots .owl-dot span,
.layout4 .owl-dots .owl-dot span {
	background: transparent;
	border: 1px solid var(--grey-color);
	border-radius: var(--radius-full);
	width: 18px;
	height: 18px;
	margin: 0 4px;
	display: block;
	position: relative;
	-webkit-backface-visibility: visible;
	transition: opacity 200ms ease;
}
.layout3 .owl-dots .owl-dot span::after,
.layout4 .owl-dots .owl-dot span::after {
	content: "";
	position: absolute;
	width: 10px;
	height: 10px;
	background-color: var(--grey-color);
	border-radius: var(--radius-full);
	left: 50%;
	top: 50%;
	margin-left: -5px;
	margin-top: -5px;
	transition: all var(--transition-fast);
}
.layout3 .owl-dots .owl-dot.active span,
.layout3 .owl-dots .owl-dot:hover span,
.layout4 .owl-dots .owl-dot.active span,
.layout4 .owl-dots .owl-dot:hover span {
	border-color: var(--primary-color-light);
}

.layout3 .owl-dots .owl-dot:hover span::after,
.layout3 .owl-dots .owl-dot.active span::after,
.layout4 .owl-dots .owl-dot:hover span::after,
.layout4 .owl-dots .owl-dot.active span::after{
	background-color: var(--primary-color-dark);
}

/*---------------------------*/
.header-carousel-one .owl-nav {
	position: absolute;
	right: 50px;
	top: 42%;
	z-index: 2;
}
/*@media (min-width: 768px) and (max-width: 1024px) {
	.header-carousel-one .owl-nav {
		bottom: 210px;
		left: 45%;
		top: auto;
		right: auto;
	}
}
@media (max-width: 575.98px) {

}*/
.header-carousel-one .owl-nav button {
	background: rgba(var(--white-opacity),.2) !important;
	color: var(--white-color) !important;
	font-size: 1.25rem;
	line-height: 48px;
	border-radius: var(--radius-circle);
	height: 48px;
	width: 48px;
	display: block;
	transition: var(--transition-all-medium);
}
.header-carousel-one .owl-nav button:hover {
	background: rgba(var(--white-opacity),1) !important;
	color: var(--primary-color) !important;
}
.header-carousel-one .owl-nav button.owl-next {
	margin-left: 10px;
}
/*@media (max-width: 991.98px), (max-width: 575.98px) {
	.header-carousel-one .owl-nav button.owl-next {
		margin-left: 10px;
	}
	.header-carousel-one .owl-nav button {
		display: inline-block;
	}
}*/

/*---------------------------------------------------
   2.B Fslightbox
-----------------------------------------------------*/
.fslightboxs {
	border-radius: var(--radius-lg) !important;
}
.fslightbox-thumb {
	border-radius: var(--radius-lg) !important;
}
.fslightboxta {
	border: 2px solid var(--white-color) !important;
}
.fslightbox-slide-btn{border-radius: var(--radius-full) !important;}

.fslightboxci h4,
.fslightboxci h5,
.fslightboxci h6 {
	font-weight: 600;
	font-size: 1.25rem;
	color: var(--white-color);
	margin-bottom: .4rem;
}
.fslightboxci,
.fslightboxci p {
	font-size: 0.9rem !important;
	color: var(--white-color) !important;
	font-weight: normal;
	margin: 0;
}
/*---------------------------------------------------
   2.C Pagination
-----------------------------------------------------*/
ul.pagination{
	list-style:none;
	margin: 5px 0;
	padding-left: 5px;
}
ul.pagination > li{
	list-style-type:none;
	margin: 5px 0;
	padding-left: 5px;
	float:left;
	display:block;
}
ul.pagination > li > a,
ul.pagination > li > span{
	color:var(--secondary-color);
	line-height: 36px;
	text-align: center;
	border:1px solid var(--color-border);
	border-radius:var(--radius-circle) !important;
	margin:0;
	padding:0;
	width: 36px;
	height: 36px;
	transition: var(--transition-all-fast);
}
ul.pagination > li.previous-page > a,
ul.pagination > li.next-page > a{border-radius:3px;}

ul.pagination > li.active-page > a:hover,
ul.pagination > li.active-page > a,
ul.pagination > li > a:focus,
ul.pagination > li > a:hover,
ul.pagination > li > span:focus,
ul.pagination > li > span:hover{
	background:var(--primary-background) !important;
	color:var(--white-color);
	border-color:var(--primary-border-color);
}

.paginate-customize{
	font-size: .9rem;
	color: var(--secondary-color);
	font-weight: 400;
}
.page-item.active .page-link {
	z-index: var(--z-low);
	color: var(--white-color);
	background-color: var(--primary-background) !important;
	border-color: var(--primary-border-color) !important;
}
/*---------------------------------------------------
   2.D Tabs
-----------------------------------------------------*/
/*.tab-wrapper {
	overflow-x: auto;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch; !* iOS için *!
}
.nav-tabs {
	display: flex;
	flex-wrap: nowrap;
	!* min-width: max-content; Bu çok önemli: içerik genişliğinden az olmasın *!
	transition:var(--transition-opacity);
}
.nav-tabs .nav-item {
	flex: 0 0 auto;
}

.nav-tabs .nav-link {
	background-color: var(--color-success);
	color: var(--secondary-color);
	font-size: .9rem;
	border: 1px solid var(--grey-color-light);
	border-bottom: none;
	!*border-top-left-radius: var(--button-border-radius);
	border-top-right-radius: var(--button-border-radius);*!
	border-radius: 0;
	margin-right: 0.25rem;
	padding: .5rem;
}
.nav-tabs .nav-link.active {
	background-color: var(--white-color);
	border-color: var(--primary-border-color);
	color:var(--primary-color);
	font-weight: 500;
	position: relative;
	z-index: var(--z-low);
}
.tab-content {
	background-color: var(--white-color);
	text-align: start;
	border: 1px solid var(--grey-color-light);
	border-top: none;
	!*border-bottom-left-radius: 1rem;
	border-bottom-right-radius: 1rem;*!
	padding: 1.5rem .75rem;
	transition: var(--transition-all-slow) !important;
}
.tab-content .image-wrapper {position: relative;}
.tab-content img:not(.other-list-wrapper img,
.video-card-thumbnail picture img) {
	width: 100% !important;
	height: auto !important;
	margin: .75rem 0;
	display: block !important;
	transition: var(--transition-transform), var(--transition-opacity);
}
.tab-content img:hover {
	!*opacity: 0.7;*!
	transform: scale(1.02);
}

.tab-content .zoom-icon{
	background: rgba(var(--secondary-opacity),.7) none repeat scroll 0 0;
	text-align: center;
	border-radius: var(--radius-circle);
	width: 40px;
	height: 40px;
	display: block;
	position: absolute;
	top: 15px;
	right: 15px;
	z-index: var(--z-float);
}
.tab-content .zoom-icon i {
	color: var(--white-color);
	line-height: 40px;
	font-size: 1rem;
}

.tab-content h1 {
	font-size: 1.75rem;
	font-weight: 800;
}
.tab-content h2 {
	font-size: 1.5rem;
	font-weight: 700;
}
.tab-content h3 {
	font-size: 1.25rem;
	font-weight: 600;
}
.tab-content h4 {
	font-size: 1.125rem;
	font-weight: 500;
}
.tab-content h5 {
	font-size: 1rem;
	font-weight: 400;
}
.tab-content h6 {
	font-size: .9rem;
	font-weight: 300;
}

.tab-content h1,
.tab-content h2,
.tab-content h3,
.tab-content h4,
.tab-content h5,
.tab-content h6 {
	color: var(--secondary-color);
	margin-top: .5rem;
	margin-bottom: .5rem;
	line-height: 1.2;
	transition: var(--transition-color);
}
.tab-content h1:hover,
.tab-content h2:hover,
.tab-content h3:hover,
.tab-content h4:hover,
.tab-content h5:hover,
.tab-content h6:hover {
	color: var(--primary-color);
}*/
/*---------------------------------------------------
   2.E Section Title
-----------------------------------------------------*/
/*---------------- AÇIK RENK BAŞLIK ----------------*/
.section-header .sh-eyebrow {
    display:flex;
    align-items:center;
    gap:8px;
    margin-bottom:3px;
}
.section-header .sh-dot1 {
    background:var(--primary-color);
    width:6px;
    height:6px;
    border-radius:var(--radius-circle);
}
.section-header .sh-dot2 {
    background:var(--primary-shadow-hover);
    width:6px;
    height:6px;
    border-radius:var(--radius-circle);
}
.section-header .sh-tag {
    color:var(--primary-color);
    font-size: 1.4rem;
    font-weight: 700;
}
.section-header .sh-title {
    color:var(--color-footer-top);
    font-size:1.8rem;
    font-weight:900;
    line-height:1.1;
}
.section-header .sh-underline {
    background:linear-gradient(90deg, var(--primary-color), transparent);
    height:3px;
    border-radius:var(--radius-xl);
    margin-top:8px;
    width:70px;
}
.section-header .sh-sub {
    font-size: 1rem;
    line-height: 1.7;
    color: var(--grey-color-deep);
    margin-top: 6px;
}

/*---------------- ÖZEL ORTALI BAŞLIK ----------------*/
#team .section-header {
    text-align: center;
}

#team .sh-eyebrow {
    justify-content: center;
}

#team .sh-underline {
    margin-left: auto;
    margin-right: auto;
}

#team .am-team-head {
    display: flex;
    justify-content: flex-start;
    margin-bottom: 24px;
}
#team .am-videos-head {
    display: flex;
    justify-content: center;
}

#services .section-header {
    text-align: center;
}

#services .sh-eyebrow {
    justify-content: center;
}

#services .sh-underline {
    margin-left: auto;
    margin-right: auto;
}

@media (max-width: 768px) {
    #team .am-videos-head {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        margin-top: 24px;
    }

    #team .am-videos-head .am-about-btns {
        display: flex;
        justify-content: center;
        width: 100%;
    }

    #team .am-videos-head .am-btn {
        font-size: 0.8rem !important;
        padding: 10px 20px !important;
    }
}
/*---------------- KOYU RENK BAŞLIK ----------------*/

.section-header-dark .sh-eyebrow {
    display:flex;
    align-items:center;
    gap:8px;
    margin-bottom:3px;
}

.section-header-dark .sh-dot1 {
    background:var(--primary-color);
    width:6px;
    height:6px;
    border-radius:var(--radius-circle);
}

.section-header-dark .sh-dot2 {
    background:var(--primary-shadow-hover);
    width:6px;
    height:6px;
    border-radius:var(--radius-circle);
}

.section-header-dark .sh-tag {
    color:var(--primary-color);
    font-size:1.4rem;
    font-weight:700;
}

.section-header-dark .sh-title {
    color:var(--white-color);
    font-size:1.8rem;
    font-weight:900;
    line-height:1.1;
}

.section-header-dark .sh-underline {
    background:linear-gradient(90deg, var(--primary-color), transparent);
    height:3px;
    border-radius:var(--radius-xl);
    margin-top:8px;
    width:70px;
}

.section-header-dark .sh-sub {
    font-size:1rem;
    line-height:1.7;
    color:rgba(255,255,255,0.38);
    margin-top:6px;
}

/*---------------- Panel Başlık ----------------*/
.panel-header {
    display: flex; align-items: center;
    justify-content: space-between;
    flex-wrap: wrap; gap: 16px;
    margin-bottom: 24px;
}

.panel-title {
    display: flex; align-items: center; gap: 14px;
}

.panel-title > div > p {
    color: var(--color-footer-top);
    font-size: 1.3rem;
    font-weight: 800;
    margin: 0;
}

.panel-title > div > span {
    color: #9aa0b4;
    font-size: .9rem;
    font-weight: 600;
}

.panel-icon {
    background: var(--color-footer-top);
    width: 46px;
    height: 46px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 6px 20px color-mix(in srgb, var(--color-footer-top) 35%, transparent);
}

.panel-badge {
    background: #f4f5f9;
    border: 1.5px solid #eaecf2;
    display: flex; align-items: center; gap: 6px;
    border-radius: 12px; padding: 8px 16px;
}

.panel-badge > strong {
    color: var(--color-footer-top);
    font-size: 1.4rem;
    font-weight: 800;
}

.panel-badge > span {
    color: #9aa0b4;
    font-size: .8rem;
    font-weight: 600;
}

/*---------------------------------------------------
   2.F Special Form
-----------------------------------------------------*/
.special-frm label {
	display: inline-block;
	max-width: 100%;
	margin-bottom: 20px;
}
.special-frm .label {
	font-weight: 500;
	font-size: 1rem;
	line-height: 1.25;
	color:var(--color-text);
	text-align:left;
	padding:3px 2px;
	margin-bottom: 5px;
	display: block;
}
.special-frm .input,
.special-frm .select,
.special-frm .textarea,
.special-frm .radio,
.special-frm .checkbox{
	position: relative;
	display: block;
}
.special-frm .select:hover select{cursor:pointer;}
.special-frm .select select{background-color: transparent !important;color: var(--color-text) !important;}
.special-frm .select i {
	background: transparent;
	position: absolute;
	top: 14px;
	right: 8px;
	width: 5px;
	height: 11px;
	box-shadow: 10px 10px 19px #1c1e22,-10px -10px 19px #262a2e;;
}
.special-frm .select i:after,
.special-frm .select i:before {
	content: '';
	position: absolute;
	right: 0;
	border-right: 4px solid transparent;
	border-left: 4px solid transparent;
}
.special-frm .select i:after {
	bottom: 0;
	border-top: 4px solid var(--color-border);
}
.special-frm .select i:before {
	top: 0;
	border-bottom: 4px solid var(--color-border);
}
.special-frm .select-multiple select {height: auto;}

.special-frm .input input,
.special-frm .select select,
.special-frm .textarea textarea {
	background: var(--white-color);
	font-size: 1rem;
	font-weight: 400;
	color: var(--color-text);
	line-height: 1.2;
	border: none;
	border-radius: var(--radius-sm);
	width: 100%;
	height: 54px;
	padding: 10px 16px;
	display: block;
	box-sizing: border-box;
	outline: none;
	appearance: none;
}

.special-frm .input input,
.special-frm .select select,
.special-frm .textarea textarea,
.special-frm .radio i,
.special-frm .checkbox i{
	border-color: var(--color-border);
	transition: border-color 0.3s;
}
.special-frm .input:hover input,
.special-frm .select:hover select,
.special-frm .textarea:hover textarea,
.special-frm .radio:hover i,
.special-frm .checkbox:hover i{color: var(--primary-color);}

.special-frm .input input:focus,
.special-frm .select select:focus,
.special-frm .textarea textarea:focus,
.special-frm .radio input:focus + i,
.special-frm .checkbox input:focus + i{color: var(--primary-color);}

.special-frm .input input::-moz-placeholder,
.special-frm .select select::-moz-placeholder,
.special-frm .textarea textarea::-moz-placeholder{
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.25;
	color:var(--grey-color);
}

.special-frm .input input:focus::-moz-placeholder,.special-frm .input input:active::-moz-placeholder,
.special-frm .select select:focus::-moz-placeholder,.special-frm .select select:active::-moz-placeholder,
.special-frm .textarea textarea:focus::-moz-placeholder,.special-frm .textarea textarea:active::-moz-placeholder{
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.25;
	color:var(--primary-color);
}

.special-frm .radio input + i:after {background-color: var(--primary-background);}
.special-frm .checkbox input + i:after {color: var(--white-color);}
.special-frm .radio input:checked + i,
.special-frm .checkbox input:checked + i,
.special-frm .toggle input:checked + i {border-color: var(--white-color);}
.special-frm .rating input:checked ~ label {color: var(--white-color);}

.special-frm .textarea textarea {
	height: auto;
	resize: none;
}
.special-frm .textarea-expandable textarea {height: 55px;}
.special-frm .textarea-expandable textarea:focus {height: auto;}
.special-frm .textarea textarea{resize: none;}

.special-frm .radio,
.special-frm .checkbox {
	font-size: 1rem;
	color: var(--white-color);
	font-weight: 400;
	line-height: 1.6;
	margin-bottom: 4px;
	padding-left: 27px;
	cursor: pointer;
}
.special-frm .radio:last-child,
.special-frm .checkbox:last-child {margin-bottom: 0;}
.special-frm .radio input,
.special-frm .checkbox input {
	position: absolute;
	left: -9999px;
}
.special-frm .radio i,
.special-frm .checkbox i {
	background: transparent;
	border-radius: 3px;
	border:1px solid var(--color-border);
	width: 17px;
	height: 17px;
	position: absolute;
	top: 5px;
	left: 0;
	display: block;
	outline: none;
}
.special-frm .radio i {border-radius: 50%;}
.special-frm .radio input + i:after,
.special-frm .checkbox input + i:after {
	position: absolute;
	opacity: 0;
	transition: opacity 0.1s;
}
.special-frm .radio input + i:after {
	content: '';
	top: 5px;
	left: 5px;
	width: 5px;
	height: 5px;
	border-radius: var(--radius-circle);
}
.special-frm .checkbox input + i:after {
	font: normal bold 13px/16px "Font Awesome 5 Pro";
	text-align: center;
	content: '\f00c';
	top: 0;
	left: 0;
	width: 15px;
	height: 15px;
}
.special-frm .radio input:checked + i:after,
.special-frm .checkbox input:checked + i:after {opacity: 1;}
.special-frm .inline-group {margin: 0 -30px 20px 0;}
.special-frm .inline-group:after {
	content: '';
	display: table;
	clear: both;
}
.special-frm .inline-group .radio,
.special-frm .inline-group .checkbox {
	float: left;
	margin-right: 30px;
}
.special-frm .inline-group .radio:last-child,
.special-frm .inline-group .checkbox:last-child {margin-bottom: 4px;}

.special-frm .inline-group .radio,
.special-frm .inline-group .checkbox{margin-top: 0;}

/*-------------------*/
.special-frm .tooltip {
	background: var(--color-tooltip);
	font-size: .8rem;
	line-height: 1.2rem;
	font-weight: 400;
	color: var(--white-color);
	border-radius: var(--radius-md);
	position: absolute;
	left: -9999px;
	z-index: 1;
	padding: 5px 10px;
	opacity: 0;
	transition: margin 0.3s, opacity 0.3s;
}
.special-frm .tooltip:after {
	content: '';
	position: absolute;
}
.special-frm .input input:focus + .tooltip,
.special-frm .textarea textarea:focus + .tooltip {opacity: 1;}

.special-frm .tooltip-top-right {
	bottom: 100%;
	margin-bottom: 15px;
}
.special-frm .tooltip-top-right:after {
	top: 100%;
	right: 16px;
	border-top: 4px solid var(--color-tooltip);
	border-right: 4px solid transparent;
	border-left: 4px solid transparent;
}
.special-frm .input input:focus + .tooltip-top-right,
.special-frm .textarea textarea:focus + .tooltip-top-right {
	right: 0;
	left: auto;
	margin-bottom: 5px;
}
.special-frm .tooltip-top-left {
	bottom: 100%;
	margin-bottom: 15px;
}
.special-frm .tooltip-top-left:after {
	top: 100%;
	left: 16px;
	border-top: 4px solid var(--color-tooltip);
	border-right: 4px solid transparent;
	border-left: 4px solid transparent;
}
.special-frm .input input:focus + .tooltip-top-left,
.special-frm .textarea textarea:focus + .tooltip-top-left {
	right: auto;
	left: 0;
	margin-bottom: 5px;
}
.special-frm .tooltip-right {
	top: 9px;
	white-space: nowrap;
	margin-left: 15px;
}
.special-frm .tooltip-right:after {
	top: 6px;
	right: 100%;
	border-top: 4px solid transparent;
	border-right: 4px solid var(--color-tooltip);
	border-bottom: 4px solid transparent;
}
.special-frm .input input:focus + .tooltip-right,
.special-frm .textarea textarea:focus + .tooltip-right {
	left: 100%;
	margin-left: 5px;
}
.special-frm .tooltip-left {
	top: 9px;
	white-space: nowrap;
	margin-right: 15px;
}
.special-frm .tooltip-left:after {
	top: 6px;
	left: 100%;
	border-top: 4px solid transparent;
	border-bottom: 4px solid transparent;
	border-left: 4px solid var(--color-tooltip);
}
.special-frm .input input:focus + .tooltip-left,
.special-frm .textarea textarea:focus + .tooltip-left {
	right: 100%;
	left: auto;
	margin-right: 5px;
}
.special-frm .tooltip-bottom-right {
	top: 100%;
	margin-top: 15px;
}
.special-frm .tooltip-bottom-right:after {
	bottom: 100%;
	right: 16px;
	border-right: 4px solid transparent;
	border-bottom: 4px solid var(--color-tooltip);
	border-left: 4px solid transparent;
}
.special-frm .input input:focus + .tooltip-bottom-right,
.special-frm .textarea textarea:focus + .tooltip-bottom-right {
	right: 0;
	left: auto;
	margin-top: 5px;
}
.special-frm .tooltip-bottom-left {
	top: 100%;
	margin-top: 15px;
}
.special-frm .tooltip-bottom-left:after {
	bottom: 100%;
	left: 16px;
	border-right: 4px solid transparent;
	border-bottom: 4px solid var(--color-tooltip);
	border-left: 4px solid transparent;
}
.special-frm .input input:focus + .tooltip-bottom-left,
.special-frm .textarea textarea:focus + .tooltip-bottom-left {
	right: auto;
	left: 0;
	margin-top: 5px;
}
.special-form .select-list {
	position: relative;
	display: inline-block;
	width: 100%;
	margin-bottom: 47px;
}
/*---------------------------------------------------
   2.G Buttons Group
-----------------------------------------------------*/
.am-btn-wrap {
    position: relative;
    display: inline-flex;
}

.am-btn-wrap::after {
    content: '';
    position: absolute;
    inset: -7px;
    border-radius: 60px;
    border: 1.5px solid transparent;
    opacity: 0;
    transition:
        opacity   .35s ease,
        inset     .4s  cubic-bezier(.34, 1.56, .64, 1),
        border-color .35s ease;
    pointer-events: none;
    z-index: 0;
}

.am-btn-wrap:hover::after {
    opacity: 1;
    inset: -5px;
}

.am-btn-wrap-primary::after {border-color: var(--primary-color-light);}

.am-btn-wrap-secondary::after {border-color: var(--secondary-color-light);}

.am-btn-wrap-white::after {border-color: rgba(255, 255, 255, .45);}

.am-btn-wrap-outline::after {border-color: var(--primary-color);}

.am-btn {
    color: var(--white-color);
    font-size: .9rem;
    font-style: normal;
    font-weight: 600;
    border-radius: var(--radius-xl);
    padding: 13px 28px;
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition:
        background   .3s ease,
        transform    .3s cubic-bezier(.34, 1.56, .64, 1),
        box-shadow   .3s ease;
    cursor: pointer;
    border: none;
    text-decoration: none;
    white-space: nowrap;
    letter-spacing: .02em;
}
.am-btn-wrap:hover .am-btn {transform: scale(0.97);}

.am-btn i {
    font-size: 15px;
    transition: transform .35s cubic-bezier(.34, 1.56, .64, 1);
    flex-shrink: 0;
}

.am-btn-primary {
    background: var(--primary-color);
    color: var(--white-color) !important;
    box-shadow: 0 2px 12px var(--primary-shadow);
}
.am-btn-wrap:hover .am-btn-primary {
    background: var(--primary-color-dark);
    box-shadow: 0 6px 20px var(--primary-shadow-hover);
}
.am-btn-wrap:hover .am-btn-primary i {transform: rotate(-45deg);}

.am-btn-secondary {
    background: var(--secondary-color);
    color: var(--white-color) !important;
    box-shadow: 0 2px 12px var(--secondary-shadow);
}
.am-btn-wrap:hover .am-btn-secondary {
    background: var(--secondary-color-dark);
    box-shadow: 0 6px 20px var(--secondary-shadow-hover);
}
.am-btn-wrap:hover .am-btn-secondary i {transform: translateX(3px);}

.am-btn-white {
    background: var(--white-color);
    color: var(--primary-color) !important;
    box-shadow: 0 2px 12px rgba(0,0,0,.08);
}
.am-btn-wrap:hover .am-btn-white {
    background: var(--primary-color-extra-light); /* #d6f2e6 */
    color: var(--primary-color-dark) !important;
    box-shadow: 0 6px 20px rgba(0,0,0,.12);
}
.am-btn-wrap:hover .am-btn-white i {
    transform: translateX(3px);
}

.am-btn-outline {
    background: transparent;
    color: var(--primary-color) !important;
    border: 1.5px solid var(--primary-color);
    box-shadow: none;
}
.am-btn-wrap:hover .am-btn-outline {
    background: var(--primary-color-extra-light);
    color: var(--primary-color-dark) !important;
    border-color: var(--primary-color-dark);
}
.am-btn-wrap:hover .am-btn-outline i {transform: translateX(3px);}

.am-btn-dark {
    background: var(--color-footer);
    color: var(--white-color) !important;
    box-shadow: 0 2px 12px rgba(0,0,0,.18);
}
.am-btn-wrap:hover .am-btn-dark {
    background: var(--color-footer-top);       /
    box-shadow: 0 6px 20px rgba(0,0,0,.24);
}
.am-btn-wrap:hover .am-btn-dark i {transform: rotate(-45deg);}

.am-btn-success {
    background: var(--color-success);
    color: #0a5c50 !important;
    box-shadow: 0 2px 12px rgba(163,228,215,.3);
}
.am-btn-wrap:hover .am-btn-success {background: var(--success-button-hover);}

.am-btn-warning {
    background: var(--color-warning);
    color: var(--color-heading) !important;
    box-shadow: 0 2px 12px rgba(255,244,193,.4);
}
.am-btn-wrap:hover .am-btn-warning {background: var(--warning-button-hover);}

.am-btn-sm {
    font-size: 0.75rem;
    padding: 9px 18px;
}
.am-btn-sm i { font-size: 13px; }

.am-btn-lg {
    font-size: 1rem;
    padding: 16px 34px;
}
.am-btn-lg i { font-size: 17px; }

.am-btn-block {
    width: 100%;
    justify-content: center;
}
.am-btn-wrap.am-btn-block {width: 100%;}

.am-btn-wrap .header-appointment-btn {
    background: var(--primary-color);
    color: var(--white-color);
    font-size: 0.875rem;
    font-weight: 600;
    padding: 10px 22px;
    gap: 7px;
    border-radius: var(--radius-xl);
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: background .3s, transform .3s cubic-bezier(.34,1.56,.64,1);
    position: relative;
    z-index: 1;
}
.am-btn-wrap:hover .header-appointment-btn {
    color: var(--white-color) !important;
    background: var(--primary-color-dark);
    transform: scale(0.97);
}

.am-btn:active {
    transform: scale(0.94) !important;
    transition: transform .1s;
}
.am-btn:focus-visible {
    outline: 2px solid var(--primary-color);
    outline-offset: 4px;
    border-radius: var(--radius-xl);
}

.am-btn:disabled,
.am-btn[aria-disabled="true"] {
    opacity: .45;
    cursor: not-allowed;
    pointer-events: none;
}

@media (max-width: 575px) {
    .am-btn-wrap-block-mobile {
        width: 100%;
    }
    .am-btn-wrap-block-mobile .am-btn {
        width: 100%;
        justify-content: center;
    }
}

/*---------------------------------------------------
   2.H Modal
-----------------------------------------------------*/
.modal-backdrop {
	background-color: rgba(var(--intro-opacity), 0.7) !important;
	z-index: 99998 !important;
}
.modal {
	z-index: 99999 !important;
}
.modal {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	z-index: 99999 !important;
	pointer-events: auto !important;
	/*height: auto !important;*/
	overflow: auto;
}

.close-icon{background: none;border:0;/*margin-bottom: 1.5rem*/}
.close-icon > span {
	backdrop-filter: blur(6px);
	background: rgba(var(--white-opacity),.6) !important;
	border: 1px solid rgba(var(--white-opacity),.3);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
	border-radius: var(--radius-circle);
	width: 42px;
	height: 42px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	cursor: pointer;
}
.close-icon > span:hover {
	background: rgba(var(--white-opacity),.9);
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);
	transform: scale(1.05);
}
.close-icon > span i {
	color: var(--primary-color);
	font-size: 1.5rem;
	transition: color 0.3s ease;
}
.close-icon > span:hover i {
	color: var(--primary-color-light);
}

.modal-backdrop {
	background-color: rgba(23,34,52,.7);
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999 !important;
	pointer-events: auto !important;
}
.modal-backdrop.show {opacity: 1;}
.modal-container {
	font-family: var(--primary-font), sans-serif;
	border-radius: var(--radius-lg);
	/*max-width: 500px;*/
	padding: 0;
	margin: 20px 0;
	box-shadow: 0 0.1em 0.4em rgba(0,0,0,.3);
}
.modal-title {
	font-size: 1.5rem;
	font-weight: 800;
	/*line-height: 2.4;
	padding: 1rem 0;*/
}
.modal-content {
	border-radius: var(--radius-xl);
	border: none;
	max-height: 100%;
	overflow: hidden;
}
.modal-header{justify-content: space-between !important; padding: 1rem 1rem;}
.modal-body{
	overflow-y: auto;
	max-height: 92vh;
	padding: 2rem 1rem !important;
}

.reply-modal .am-form-comment {
    margin: 0 !important;
    padding: 0 2rem !important;
}
/*.modal-body {
	max-height: calc(100vh - 230px);
	min-height: 50px;
	overflow-y: auto;
}
*/
.modal-footer {
	padding: 1rem 0;
	text-align: right;
}
p:first-child {margin-top: 0;}
.copyright-foot p{
	font-size: 0.9rem;
	font-weight: 400;
	color: var(--white-color);
}

/* TinyMCE element show default: 1100-1200 */
.tox-tinymce-aux,
.tox-dialog-wrap {
	z-index: 99999 !important;
	pointer-events: auto !important;
}

.special-picker-wrap {
	position: relative !important; /* Takvimin bu containera göre konumlanması için */
	display: inline-block !important;
	width: 100%;
}

.modal-news-xl {
	max-width: min(1280px, calc(100vw - 1.5rem));
	width: auto;
}

.modal-news-xl .container,
.modal-news-xl .container-fluid {
	max-width: 100%;
	padding-right: var(--bs-gutter-x,.75rem);
	padding-left: var(--bs-gutter-x,.75rem);
}
@media (max-width: 575.98px) {
	.modal-news-xl {
		max-width: calc(100vw - 1.5rem);
		margin: 0.75rem auto; /* Yan boşluk sağlar */
	}
}
@media (min-width: 576px) {
	.modal-news-xl {
		max-width: 540px;
	}
}
@media (min-width: 768px) {
	.modal-news-xl {
		max-width: 720px;
	}
}
@media (min-width: 992px) {
	.modal-news-xl {
		max-width: 960px;
	}
}
@media (min-width: 1200px) {
	.modal-news-xl {
		max-width: 1140px;
	}
}
@media (min-width: 1280px) {
	.modal-news-xl {
		max-width: 1280px;
	}
}
@media (min-width: 1400px) {
	.modal-xl,
	.modal-news-xl {
		max-width: 1320px;
	}
}

/* ============================================
   - KVKK / Page Modal Content
============================================ */
.kvkk-main-title {
    color: var(--primary-color);
    font-size: 1.5rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 1.75rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid var(--color-border);
}

.kvkk-section {
    margin-bottom: 1.75rem;
    padding-bottom: 1.75rem;
    border-bottom: 1px solid var(--color-border);
}

.kvkk-section:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.kvkk-section h3 {
    color: var(--color-footer-top);
    font-size: 1.2rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 0.85rem;
    background: none;
    border-left: none;
    padding: 0;
    border-radius: 0;
}

.kvkk-section h3::before {
    content: '';
    width: 3px;
    height: 16px;
    background: var(--primary-color);
    border-radius: 2px;
    flex-shrink: 0;
}

.kvkk-section p {
    color: var(--color-text);
    font-size: 1rem;
    line-height: 1.85;
    padding-left: 13px;
    margin-bottom: 0.5rem;
}

.kvkk-info-box {
    background: var(--grey-color-xlight);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    border-left: 3px solid var(--primary-color);
    padding: 0;
    margin: 0.75rem 0 0 13px;
    overflow: hidden;
}

.kvkk-info-box p {
    display: flex;
    align-items: center;
    gap: 0;
    padding: 0;
    margin: 0;
    border-bottom: 1px solid var(--color-border);
    font-size: 1rem;
}
.kvkk-info-box p:last-child {
    border-bottom: none;
}

.kvkk-info-box p strong {
    background: var(--grey-color-xlight);
    color: var(--grey-color-dark);
    font-size: 1rem;
    font-weight: 700;
    padding: 11px 14px;
    min-width: 110px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    border-right: 1px solid var(--color-border);
}

.kvkk-list {
    list-style: none;
    padding: 0 0 0 13px;
    margin: 0.5rem 0;
}

.kvkk-list li {
    font-size: 1rem;
    line-height: 1.85;
    color: var(--color-text);
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 5px 0;
    border-bottom: 1px solid var(--grey-color-xlight);
}

.kvkk-list li:last-child {
    border-bottom: none;
}

.kvkk-list li::before {
    background: var(--primary-color);
    content: '';
    width: 5px;
    height: 5px;
    border-radius: 50%;
    margin-top: 10px;
    flex-shrink: 0;
}

/*---------------------------------------------------
   2.H. Accordion
-----------------------------------------------------*/
.accordion {
	--bs-accordion-border-color: none;
}
.accordion-item {
	border: none;
	border-radius: 7px;
	margin-bottom: 16px;
	background:var(--background-color);
	box-shadow: 0 0 40px 5px rgba(0, 0, 0, 0.03);
}
.accordion-item:last-child {
	border-bottom: none !important;
}
.accordion-button {
	color: var(--black-color);
	background: var(--color-membership-bg);
	font-size: var(--font-size-base);
	font-weight: 600;
	width: 100%;
	padding: 25px 70px 25px 40px;
	position: relative;
	box-shadow: none;
	border-radius: 0;
	transition: all 0.3s ease;

	display: block;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	line-height: 1.4;
}

.accordion-button:not(.collapsed) {
	white-space: normal;
	overflow: visible;
	text-overflow: unset;
}
.accordion-button .count {
	color: var(--primary-color);
	padding-right: 8px;
}

.accordion-button::after {
	content: "+";
	font-size: var(--font-size-xl) !important;
	color: var(--primary-color);
	background-image: none !important;
	mask-image: none !important;
	-webkit-mask-image: none !important;
	transition: transform 0.2s ease-in-out;

	position: absolute;
	top: 50%;
	right: 35px;
	transform: translateY(-50%);
	font-weight: 600;
	line-height: 1;
	height: auto;
}
.accordion-button:not(.collapsed)::after {
	content: "-";
}
button[aria-expanded="true"] {
	color: var(--primary-color) !important;
	background-color: var(--color-membership-bg) !important;
	box-shadow: none !important;
}
.accordion-button:focus {
	z-index: 3;
	outline: 0;
	box-shadow: none;
}
.accordion-body {
	background-color: var(--color-membership-bg);
	font-size: var(--font-size-base) !important;
	line-height: 1.4;
	padding: 0 40px 30px;
}
.accordion-body b {
	font-weight: 600;
}
.accordion-body .text {
	display: block;
	position: relative;
	top: 0;
}
.accordion-box .block .acc-btn:before {
	content: none !important;
}
.accordion-item {
	background: var(--background-color);
	border-radius: var(--radius-lg) !important;
	overflow: hidden;
}
/*---------------------------------------------------
   2.I. Horizontal/Vertical Tabs
-----------------------------------------------------*/

.tab.tab-light{
    font-family: var(--primary-font), sans-serif;
    color: var(--primary-color);
}
.nav.nav-tabs {
    border-bottom: 1px solid var(--grey-color-light);
    display: flex;
    justify-content: center;
    margin-bottom: 1.75rem;
}
.tab.tab-light .nav-link {
    color: var(--color-footer-top);
    font-weight: 700;
    font-size: 1rem;
    border-top-left-radius: var(--radius-lg);
    border-top-right-radius: var(--radius-lg);
    padding: .75rem;
}
.tab.tab-light .nav-tabs .nav-item.show .nav-link,
.tab.tab-light .nav-tabs .nav-link.active {
    color: var(--primary-color);
    background-color: var(--white-color);
    border-color: var(--grey-color-light) var(--grey-color-light) var(--white-color);
}
.tab.tab-light .tab-content {
    width: 100%;
    margin-top:2.5rem;
}
/*===================================================
   END OF GENERAL
=====================================================*/

/*===================================================
   3. HEADER
=====================================================*/
#header{
    background: var(--black-color);
    border-bottom: 1px solid var(--primary-shadow-hover);
    position: relative;
    z-index: 60;
}
.am-topbar {
    background:var(--black-color);
    border-bottom: 1px solid var(--primary-shadow-hover);
    position: relative;
    z-index: 60;
}

.am-topbar::after {
    background: linear-gradient(90deg, transparent, var(--primary-shadow-hover) 30%, var(--secondary-shadow-hover) 70%, transparent);
    height: 76px;
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
}

.am-topbar .container {
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.tb-l,
.tb-r {
    display: flex;
    align-items: center;
    gap: 16px;
}

.tb-item {
    color: var(--grey-color);
    font-size: .9rem;
    font-weight: 500;
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 7px;
}
.tb-item:hover{color:var(--primary-color);}
.tb-item a {
    color: inherit;
    text-decoration: none;
    transition: color .2s;
}

.tb-item a:hover {color: var(--primary-color);}

.tb-dot {
    background: var(--primary-color);
    width: 5px;
    height: 5px;
    border-radius: 50%;
    animation: amBlink 2s infinite;
    flex-shrink: 0;
}

@keyframes amBlink {
    0%, 100% { opacity: 1; }
    50% { opacity: .2; }
}

.tb-div {
    background: var(--grey-color-light);
    width: 1px;
    height: 10px;
}

.tb-hours {
    color:var(--grey-color);
    font-size: .9rem;
    font-weight: 500;
}

.tb-soc {
    display: flex;
    gap: 8px;
    position: relative;
    z-index: 2;
}

.tb-sc {
    color: var(--grey-color);
    width: 27px;
    height: 27px;
    border-radius: var(--radius-xl);
    border: 1px solid var(--grey-color);
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
    position: relative;
    overflow: hidden;
}

.tb-sc::before {
    background: var(--primary-color);
    content: '';
    position: absolute;
    inset: 0;
    transform: translateY(100%);
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
    z-index: 0;
}

.tb-sc:hover::before {transform: translateY(0);}

.tb-sc:hover {
    color: var(--white-color);
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--primary-shadow);
    transform: translateY(-2px);
}

.tb-sc i,
.tb-sc svg {
    font-size: .8rem;
    width: 12px;
    height: 12px;
    position: relative;
    z-index: 1;
    display: block;
    line-height: 1;
}

.am-nav-wrap {
    background: linear-gradient(160deg, #071410 0%, #0d2218 55%, #163322 100%);
    padding: 10px 0 14px;
    position: relative;
    z-index: 50;
}

.am-nav-wrap::before {
    background-image: linear-gradient(rgba(var(--primary-opacity),.03) 1px, transparent 1px), linear-gradient(90deg, rgba(var(--primary-opacity),.03) 1px, transparent 1px);
    content: '';
    position: absolute;
    inset: 0;
    background-size: 52px 52px;
    pointer-events: none;
}

.am-badge-wrap {
    display: flex;
    justify-content: center;
    margin-bottom: -15px;
    position: relative;
    z-index: 9999;
}

.am-badge {
    color: var(--primary-color);
    font-size: 1rem;
    font-weight: 500;
    gap: 10px;
    padding: 4px 16px;
    border-radius: var(--radius-xl);
    background: rgba(var(--primary-opacity),.1);
    border: 1px solid rgba(var(--primary-opacity),.2);
    display: inline-flex;
    align-items: center;
}

.am-badge-dot {
    background: var(--primary-color);
    width: 5px;
    height: 5px;
    border-radius: 50%;
    animation: amBlink 2s infinite;
}

.am-nav-pill {
    background: rgba(255,255,255,.055);
    border: 1px solid rgba(255,255,255,.1);
    box-shadow: 0 8px 32px rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.07);
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 72px;
    border-radius: 100px;
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    padding: 0 10px 0 12px;
    position: relative;
    z-index: 100;
}

.am-nav-pill::before {
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.12), transparent);
    content: '';
    position: absolute;
    top: 0;
    left: 20%;
    right: 20%;
    height: 1px;
}

.am-links {
    display: flex;
    align-items: center;
    gap: 2px;
    list-style: none;
}

.am-link-item {position: relative;}

.am-link {
    color: var(--grey-color-light);
    font-size: 1rem;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 8px 14px;
    border-radius: 100px;
    text-decoration: none;
    transition: all .2s;
    cursor: pointer;
    white-space: nowrap;
}

.am-link:hover {
    color: var(--white-color);
    background: rgba(255,255,255,.08);
}

.am-link svg {
    opacity: .45;
    transition: transform .25s;
}

.am-link-item.dd-open .am-link svg {transform: rotate(180deg);}

.am-dropdown {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    min-width: 180px;
    padding-top: 12px;
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease;
    z-index: 9999;
}

.am-dropdown-inner {
    background: rgba(7,20,14,.97);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 14px;
    padding: 8px;
    box-shadow: 0 16px 40px rgba(0,0,0,.3);
}

.am-link-item:hover .am-dropdown {
    opacity: 1;
    pointer-events: all;
}

.am-link-item:hover .am-link svg {
    transform: rotate(180deg);
}

.am-link-item.dd-open .am-dropdown {
    opacity: 1;
    pointer-events: all;
}

.am-dd-item {
    color: var(--grey-color-light);
    font-size: .9rem;
    font-weight: 500;
    display: block;
    padding: 9px 14px;
    border-radius: 8px;
    text-decoration: none;
    transition: all .2s;
}

.am-dd-item:hover {
    color: var(--white-color);
    background: var(--primary-shadow-hover);
}

.am-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.am-phone {
    background: rgba(var(--primary-opacity),.07);
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 4px 16px 4px 9px;
    border-radius: var(--radius-xl);
    border: 1px solid rgba(var(--primary-opacity),.15);
    cursor: pointer;
    transition: all .35s;
    text-decoration: none;
}

.am-phone-ico {
    background: rgba(var(--primary-opacity),.12);
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 1px solid rgba(var(--primary-opacity),.2);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .4s;
}

.am-phone:hover .am-phone-ico {
    background: rgba(var(--primary-opacity),.22);
    border-color: rgba(var(--primary-opacity),.4);
    box-shadow: 0 0 12px var(--primary-shadow);
    transform: rotate(-15deg) scale(1.1);
}

.am-phone:hover {
    background: rgba(var(--primary-opacity),.12);
    border-color: rgba(var(--primary-opacity),.35);
}

.am-phone-num {
    color: var(--white-color);
    font-size: .9rem;
    font-weight: 600;
    line-height: 1.1;
}

.am-phone-lbl {
    color: var(--primary-color);
    font-size: .9rem;
    font-weight: 500;
}

.am-ghost {
    color: var(--grey-color-light);
    font-size: .9rem;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border-radius: 100px;
    border: 1px solid var(--primary-shadow-hover);
    background: transparent;
    text-decoration: none;
    transition: all .25s;
}
.am-ghost svg{color: var(--primary-color);}
.am-ghost:hover {
    color: var(--primary-color);
    background: transparent;
    border-color: var(--primary-color);
}

.am-user-pill {
    color: var(--white-color);
    font-size: .9rem;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.12);
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px 6px 6px;
    border-radius: 100px;
    cursor: pointer;
    position: relative;
    transition: all .25s;
    user-select: none;
}

.am-user-pill:hover {background: rgba(255,255,255,.1);}

.am-user-circle {
    color: var(--white-color);
    background: linear-gradient(135deg, var(--primary-color), var(--primary-color-dark));
    font-size:.9rem;
    font-weight: 700;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.am-user-dd {
    background: rgba(7,20,14,.97);
    border: 1px solid rgba(255,255,255,.1);
    box-shadow: 0 16px 40px rgba(0,0,0,.3);
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 200px;
    backdrop-filter: blur(20px);
    border-radius: 14px;
    padding: 8px;
    opacity: 0;
    pointer-events: none;
    transition: all .3s;
    z-index: 200;
}

.am-user-pill.am-dd-open .am-user-dd {
    opacity: 1;
    pointer-events: all;
}

.am-user-dd-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 14px;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: 300;
    color: rgba(255,255,255,.5);
    text-decoration: none;
    transition: all .2s;
    border: none;
    background: transparent;
    width: 100%;
    cursor: pointer;
    text-align: left;
}

.am-user-dd-item:hover {
    color:var(--white-color);
    background: rgba(255,255,255,.07);
}

.am-user-dd-item.am-logout {
    color: var(--secondary-color-light);
    margin-top: 4px;
    border-top: 1px solid rgba(255,255,255,.06);
    padding-top: 12px;
}

.am-user-dd-item.am-logout:hover {
    color: var(--secondary-color);
    background: var(--secondary-shadow);
}
.am-logo {
    display: flex;
    align-items: center;
    gap: 7px;
    text-decoration: none;
}

.am-logo-img {
    height: 65px;
    width: auto;
    transition: transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.am-logo:hover .am-logo-img {
    transform: rotate(360deg) scale(1.15);
}
.am-logo-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.am-logo-title {
    color:var(--primary-color);
    font-size: 1.8rem;
    font-weight: 900;
    line-height: 1.2;
}

.am-logo-anka {color: var(--secondary-color);}

.am-logo-sub {
    color: var(--primary-color);
    font-size: .9rem;
    font-weight: 500;
    line-height: 1.3;
}
.am-randevu {
    color: var(--white-color);
    background: linear-gradient(135deg, var(--secondary-color), var(--secondary-color-dark));
    font-size: .9rem;
    font-weight: 500;
    gap: 8px;
    padding: 9px 22px;
    border-radius: 100px;
    display: flex;
    align-items: center;
    border: none;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    transition: all .4s;
    box-shadow: 0 4px 16px var(--secondary-shadow);
    white-space: nowrap;
}

.am-randevu-shine {
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    position: absolute;
    top: 0;
    left: -80%;
    width: 50%;
    height: 100%;
    animation: amShine 3s infinite 1s;
}

@keyframes amShine {
    0% { left: -80%; }
    40%, 100% { left: 150%; }
}

.am-randevu:hover {
    transform: scale(1.06);
    box-shadow: 0 8px 24px var(--secondary-shadow-hover);
}

.am-randevu:active {transform: scale(.97);}

.menu-mobile-trigger,
.desktop-trigger {
    background: rgba(255,255,255,.05);
    width: 38px;
    height: 38px;
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,.12);
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    cursor: pointer;
    transition: all .25s;
}

.menu-mobile-trigger span,
.desktop-trigger span {
    display: block;
    height: 1.5px;
    border-radius: 2px;
    background: var(--white-color);
    transition: all .35s cubic-bezier(.77,0,.175,1);
}

.menu-mobile-trigger span:nth-child(1),
.desktop-trigger span:nth-child(1) {width: 16px;}

.menu-mobile-trigger span:nth-child(2),
.desktop-trigger span:nth-child(2) {
    width: 11px;
    background: var(--primary-color);
}

.menu-mobile-trigger span:nth-child(3),
.desktop-trigger span:nth-child(3) {width: 16px;}

.menu-mobile-trigger:hover,
.desktop-trigger:hover {
    border-color: var(--primary-border-color);
    background: rgba(var(--primary-opacity),.06);
}

@media(max-width:1199px) and (min-width:1024px) {
    .am-link { padding: 7px 10px; font-size: 0.75rem; }
    .am-phone-lbl { display: none; }
}

@media(max-width:1023px) {
    .am-topbar{height: 50px; }

    .am-topbar .tb-item{font-size:.8rem;}
    .tb-hours { display: none; }
    .am-badge-wrap { display: none; }
    .am-nav-pill { height: 60px; padding: 0 8px 0 12px; }
    .am-logo-img { height: 52px; }
    .am-logo-title { font-size: 1.2rem;}
    .am-logo-sub { font-size:.8rem; }
    .am-links { display: none; }
    .am-phone { display: none; }
    .am-ghost { display: none; }
    .am-user-pill { display: none; }
    .menu-mobile-trigger,
    .desktop-trigger { display: flex; }
}

@media(max-width:599px) {
    .am-topbar { display: none; }
    .am-nav-pill { height: 52px; border-radius: 14px; }
    .am-logo-img { height: 42px; }
    .am-randevu { padding: 8px 14px; font-size: .8rem; }
    .am-randevu svg { display: none; }
}

@media(max-width:767px) and (min-width:544px){
    .tb-div{display:none;}
    .tb-item:last-child{display:none;}

}


body.am-oc-locked{ overflow:hidden; }


.am-oc-overlay{
    position:fixed; inset:0; z-index:99998;
    background:rgba(0,0,0,.55);
    backdrop-filter:blur(3px);
    opacity:0; pointer-events:none;
    transition:opacity .35s ease;
}
.am-oc-overlay.open{ opacity:1; pointer-events:all; }

#amOffcanvas{
    position:fixed;
    top:0; left:0;
    width:100%; width:100vw;
    height:100%; height:100dvh;
    background:linear-gradient(160deg,var(--black-dark) 0%,#0d2218 55%,#163322 100%);
    z-index:99999;
    transform:translateX(100%);
    transition:transform .4s cubic-bezier(.4,0,.2,1);
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    display:flex;
    flex-direction:column;
    box-shadow:-8px 0 40px rgba(0,0,0,.4);
}

.am-oc-spacer{
    flex:1;
    display:flex;
    align-items:center;
}

.am-oc-footer{
    width:100%;
}
#amOffcanvas.open{ transform:translateX(0); }

.am-oc-accent{
    height:3px; flex-shrink:0;
    background:linear-gradient(90deg,var(--primary-color),var(--primary-color-dark) 40%,var(--secondary-color) 70%,var(--secondary-color-dark));
}

.am-oc-head{
    padding:20px 20px 16px;
    border-bottom:1px solid rgba(255,255,255,.08);
    display:flex; align-items:center; justify-content:space-between;
    flex-shrink:0;
}
.am-oc-logo{
    display:flex; align-items:center; gap:10px;
    text-decoration:none;
}
.am-oc-logo img{ height:36px; width:auto; }
.am-oc-logo-text{ display:flex; flex-direction:column; gap:1px; }
.am-oc-logo-title{

    font-size:15px; font-weight:700;
    color:var(--white-color); line-height:1.2; letter-spacing:-.3px;
}
.am-oc-logo-title span{ color:var(--primary-color); }
.am-oc-logo-sub{
    font-size:9.5px; letter-spacing:.3px;
    color:rgba(255,255,255,.45); margin-top:1px;
}

.am-oc-close{
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.1);
    color:rgba(255,255,255,.7);
    width:36px; height:36px; border-radius:10px;
    cursor:pointer; font-size:16px;
    display:flex; align-items:center; justify-content:center;
    transition:all .2s; flex-shrink:0;
}
.am-oc-close:hover{
    background:var(--secondary-color);
    border-color:var(--secondary-color);
    color:var(--white-color);
    transform:rotate(90deg);
}
.am-oc-close svg{ width:16px; height:16px; }


.am-oc-nav{ padding:12px 0; flex:none; }
.am-oc-list{ list-style:none; padding:0; margin:0; }

.am-oc-item,
.am-oc-parent{
    color:var(--grey-color-light);
    font-size:1rem;
    font-weight:500;
    padding:13px 22px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    cursor:pointer;
    text-decoration:none;
    border-left:3px solid transparent;
    transition:background .15s, border-color .15s, color .15s;
}

.am-oc-parent:hover,
.am-oc-item:hover{
    background:rgba(255,255,255,.05);
    border-left-color: var(--primary-color);
    color:var(--primary-color);
}

.am-oc-group.am-open .am-oc-parent{
    color: var(--white-color);
    background:var(--primary-shadow);
    border-left-color: var(--primary-color);
}

.am-oc-arrow{
    transition:transform .25s; opacity:.5; flex-shrink:0;
}
.am-oc-group.am-open .am-oc-arrow{ transform:rotate(180deg); opacity:.9; color:var(--primary-color); }

.am-oc-children{
    list-style:none; padding:0; margin:0;
    max-height:0; overflow:hidden;
    transition:max-height .3s ease;
    background:rgba(0,0,0,.15);
}
.am-oc-group.am-open .am-oc-children{ max-height:600px; }

.am-oc-child-link{
    display:flex; align-items:center; gap:8px;
    padding:10px 22px 10px 36px;
    color:var(--grey-color-light);
    text-decoration:none;
    font-size:.9rem;
    transition:color .15s, background .15s;
}
.am-oc-child-link:hover{
    color:var(--primary-color);
    background:rgba(255,255,255,.04);
}
.am-oc-child-dot{
    width:6px;
    height:6px;
    border-radius:50%;
    background:var(--primary-color);
    flex-shrink:0;
    opacity:.7;
}

.am-oc-footer{
    padding:20px 20px 24px;
    margin-top:8px;
    border-top:1px solid rgba(255,255,255,.08);
}

.am-oc-btn-primary{
    color:var(--white-color);
    background:var(--secondary-color);
    font-size:1rem;
    font-weight:600;
    width:100%;
    border:none;
    padding:13px;
    border-radius:11px;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    margin-bottom:10px;
    transition:all .2s;
    box-shadow:0 4px 14px var(--secondary-shadow);
}
.am-oc-btn-primary:hover{
    background:var(--primary-color);
    transform:translateY(-1px);
}
.am-oc-btn-primary:active{ transform:scale(.98); }

.am-oc-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
}
.am-oc-btn-sec{
    color:var(--grey-color-light);
    font-size:.9rem;
    padding:10px; border-radius:9px;
    display:flex; align-items:center; justify-content:center; gap:6px;
    border:1px solid var(--primary-color-dark);
    text-decoration:none;
    transition:all .2s;
}
.am-oc-btn-sec:hover{
    color:var(--white-color);
    background:var(--primary-color-dark);
}

.am-oc-social{
    display:flex;
    align-items:center;
    gap:10px;
    margin-top:50px;
}

.am-oc-social-label{
    color: var(--grey-color-mlight);
    font-size: .9rem;
    font-weight: 600;
    white-space: nowrap;
}
.am-oc-social-line{ background:var(--grey-color-mlight); flex:1; height:1px;  }
.am-oc-social-icons{ display:flex; gap:8px; }
.am-oc-sc{
    color:var(--primary-color);
    font-size:.9rem;
    width:30px;
    height:30px;
    border-radius:8px;
    border:1px solid var(--grey-color-mlight);
    display:flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    transition:all .2s;
}
.am-oc-sc:hover{
    background:var(--primary-color);
    border-color:var(--primary-color);
    color:var(--white-color);
    transform:translateY(-2px);
}

/* ── Responsive ── */
@media(min-width:600px){
    #amOffcanvas{ max-width:420px; left:auto; right:0; transform:translateX(100%); }
    #amOffcanvas.open{ transform:translateX(0); }
}
@media(max-width:374px){
    .am-oc-item, .am-oc-parent{ font-size:.9rem; padding:12px 18px; }
}


/*---------------------------------------------------
   3.A Contact
-----------------------------------------------------*/
.topbar-left .list-wrap {
	display: flex;
	align-items: center;
	gap: 10px 35px;
}
.topbar-left .list-wrap li {
	font-size: 1rem;
	color: var(--white-color);
	line-height: 2.75rem;
	display: flex;
	align-items: center;
	position: relative;
	transition: all var(--transition-medium);
}
.topbar-left .list-wrap li::before {
	background: rgba(var(--white-opacity),.2);
	content: "";
	position: absolute;
	right: -16px;
	top: 50%;
	transform: translateY(-50%);
	width: 1px;
	height: 100%;
}
.topbar-left .list-wrap li:last-child::before {
	display: none;
}
.topbar-left .list-wrap li i {
	font-size: 1rem;
	line-height: 0;
	color: var(--white-color);
	margin-right: 8px;
	transition: all var(--transition-medium);
}
.topbar-left .list-wrap li a {
	color: var(--white-color);
}
.topbar-left .list-wrap li:hover,
.topbar-left .list-wrap li:hover i,
.topbar-left .list-wrap li:hover a i,
.topbar-left .list-wrap li:hover a{
	color: var(--primary-color);
}

.topbar-right {
	display: flex;
	align-items: center;
	justify-content: flex-end;
}
.header-contact {
	color: var(--white-color);
	font-size: 1rem;
	line-height: 2.75rem;
	margin-right: 35px;
	position: relative;
	transition: all var(--transition-medium);
}
.header-contact::before {
	background: rgba(var(--white-opacity),.2);
	content: "";
	position: absolute;
	right: -16px;
	top: 50%;
	width: 1px;
	height: 100%;
	transform: translateY(-50%);
}
.header-contact a {
	font-size: 1rem;
	line-height: 1.2;
	color: var(--white-color);
	display: flex;
	align-items: center;
}
.header-contact i {
	font-size: 1rem;
	margin-right: 8px;
	transition: all var(--transition-medium);
}
.header-contact:hover,
.header-contact:hover i,
.header-contact:hover a i,
.header-contact:hover a {
	color: var(--primary-color);
}
/*---------------------------------------------------
   3.B Social Media
-----------------------------------------------------*/
.social-icons {
	margin:7px 0;
	padding: 0;
	display: flex;
	justify-content: start;
	flex-wrap: wrap;
	list-style: none;
}
.social-icons li {
	margin:0 5px 0 0;
	padding: 0;
	overflow: visible;
}
.social-icons li:last-child{margin-right: 0;}
.social-icons li a {
	color:var(--white-color);
	font-size: 1.2rem;
	line-height:1.4;
	text-align: center;
	text-decoration: none;
	height: 26px;
	width: 26px;
	display: block;
	transition: all var(--transition-fast);
}
.social-icons li i { line-height: inherit; }
.social-icons.social-icons-sm li {	margin: 0 4px 4px; }
.social-icons.social-icons-sm li a { font-size: 1rem; }
.social-icons.social-icons-lg li a {
	background-color: transparent;
	font-size: 1rem;
	/*line-height:1.7;*/
	border-radius:var(--radius-circle);
	border: 1px solid var(--white-color);
	width: 30px;
	height: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.social-icons.social-icons-light li a { color: var(--white-color); }
.social-icons.social-icons-muted li a { color: var(--white-color); }
.social-icons li:hover a {
	color:var(--white-color);
	transform: scale(1.2);
}

.social-icons-twitter svg{fill:var(--white-color) !important;}

.social-icons li:hover.social-icons-twitter a,
.social-icons.social-icons-colored li.social-icons-twitter a { background-color:var(--black-color); }

.social-icons li:hover.social-icons-facebook a,
.social-icons.social-icons-colored li.social-icons-facebook a { background-color:var(--facebook); }

.social-icons li:hover.social-icons-linkedin a,
.social-icons.social-icons-colored li.social-icons-linkedin a { background-color: var(--linkedin); }

.social-icons li:hover.social-icons-rss a,
.social-icons.social-icons-colored li.social-icons-rss a { background-color:var(--rss);}

.social-icons li:hover.social-icons-dribbble a,
.social-icons.social-icons-colored li.social-icons-dribbble a { background-color:var(--dribbble); }

.social-icons li:hover.social-icons-github a,
.social-icons.social-icons-colored li.social-icons-github a { background-color:var(--github); }

.social-icons li:hover.social-icons-behance a,
.social-icons.social-icons-colored li.social-icons-behance a { background-color:var(--behance); }

.social-icons li:hover.social-icons-google a,
.social-icons.social-icons-colored li.social-icons-google a { background-color:var(--youtube); }

.social-icons li:hover.social-icons-pinterest a,
.social-icons.social-icons-colored li.social-icons-pinterest a { background-color:var(--pinterest); }

.social-icons li:hover.social-icons-youtube a,
.social-icons.social-icons-colored li.social-icons-youtube a { background-color:var(--youtube); }

.social-icons li:hover.social-icons-instagram a,
.social-icons.social-icons-colored li.social-icons-instagram a {
	background:radial-gradient(circle at 30% 107%, var(--instagram-one-color) 0%, var(--instagram-one-color) 5%, var(--instagram-two-color) 45%,var(--instagram-three-color) 60%,var(--instagram-four-color) 90%);
}

.social-icons li:hover.social-icons-skype a,
.social-icons.social-icons-colored li.social-icons-skype a { background-color:var(--skype); }

.social-icons li:hover.social-icons-email a,
.social-icons.social-icons-colored li.social-icons-email a { background-color:var(--email); }

.social-icons li:hover.social-icons-vk a,
.social-icons.social-icons-colored li.social-icons-vk a { background-color:var(--vk); }

.social-icons li:hover.social-icons-xing a,
.social-icons.social-icons-colored li.social-icons-xing a { background-color:var(--xing); }

.social-icons li:hover.social-icons-tumblr a,
.social-icons.social-icons-colored li.social-icons-tumblr a { background-color:var(--tumblr); }

.social-icons li:hover.social-icons-reddit a,
.social-icons.social-icons-colored li.social-icons-reddit a { background-color:var(--reddit); }

.social-icons li:hover.social-icons-delicious a,
.social-icons.social-icons-colored li.social-icons-delicious a { background-color:var(--delicious); }

.social-icons li:hover.social-icons-stumbleupon a,
.social-icons.social-icons-colored li.social-icons-stumbleupon a { background-color:var(--stumbleupon); }

.social-icons li:hover.social-icons-digg a,
.social-icons.social-icons-colored li.social-icons-digg a { background-color:var(--digg); }

.social-icons li:hover.social-icons-blogger a,
.social-icons.social-icons-colored li.social-icons-blogger a { background-color:var(--blogger); }

.social-icons li:hover.social-icons-flickr a,
.social-icons.social-icons-colored li.social-icons-flickr a { background-color:var(--flickr); }

.social-icons li:hover.social-icons-vimeo a,
.social-icons.social-icons-colored li.social-icons-vimeo a { background-color:var(--vimeo); }

.social-icons li:hover.social-icons-yahoo a,
.social-icons.social-icons-colored li.social-icons-yahoo a { background-color:var(--yahoo); }

.social-icons li:hover.social-icons-apple a,
.social-icons.social-icons-colored li.social-icons-apple a { background-color:var(--apple); }

.social-icons.social-icons-colored li:hover a { background-color:var(--white-color); }

/*---------------------------------------------------
   3.C Logo & Menu
-----------------------------------------------------*/
.header-branding.horizontal {
	display: flex;
	align-items: center;
	gap: .75rem;
}
.header-branding__logo {
	flex-shrink: 0;
	transition: var(--transition-transform);
}
.header-branding:hover .header-branding__logo {
	transform: rotateY(180deg);
}
.header-branding__img {
	max-width: 80px;
}
.header-branding__text {
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.header-branding__title-pre {
	font-family: var(--fourth-font), sans-serif;
	font-size: 1.1rem;
	font-weight: 500;
	color: var(--secondary-color);
	line-height: 1.2;
}
.header-branding__title {
	font-family: var(--secondary-font), sans-serif;
	font-size: 1.4rem;
	font-weight: 600;
	color: var(--primary-color);
	line-height: 1.3;
}
.header-branding__subtitle {
	font-family: var(--tertiary-font), sans-serif;
	font-size: 0.9rem;
	font-weight: 500;
	color: var(--secondary-color);
	line-height: 1.2;
}
/*@media (max-width: 576px) {
	.header-branding.horizontal {
		flex-direction: column;
		align-items: center;
		text-align: center;
	}
}*/

.bg-menu{
	background-color:transparent;
	position: relative;
	z-index: var(--z-float);
	height: auto !important;
	display: flex !important;
	animation: slide-down 0.7s;
}
.mn-fix{
	background:var(--white-color) none repeat scroll 0 0;
	box-shadow: 0 9px 38px rgb(0 0 0 / 5%), 0 5px 12px rgb(0 0 0 / 10%);
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: var(--z-float);
}

.menu-wrapper {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	/*max-height: 70px;*/
}
.header-item-left {
	display: flex;
	-webkit-box-flex: 0;
	flex: 0 0 35%;
}
.head-menu{position: relative;}
.menu-section{list-style: none;margin: 0;padding: 0;}

.header-item-center {
	display: flex;
	justify-content: end;
	-webkit-box-flex: 0;
	flex: 1 1 auto !important;
}
.header-item-right .user-actions-menu {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 10px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.header-item-right .user-actions-menu li {
    display: flex !important;
    align-items: center !important;
}

.header-appointment-btn i {
    transform: none !important;
    margin-left: 4px !important;
}
.header-item-right {
    margin-left: 32px !important;
    flex-shrink: 0 !important;
}
.fixed-add .nav-user-pill {
    background: rgba(17,34,53,0.08) !important;
    border-color: rgba(17,34,53,0.2) !important;
}

.fixed-add .nav-user-name {
    color: var(--color-footer-top) !important;
}

.fixed-add .nav-user-arrow {
    color: #666 !important;
}
.fixed-add{
	background:var(--white-color) none repeat scroll 0 0;
	position: fixed !important;
	top: 0;
	right: 0;
	left: 0;
	/*animation: 1000ms ease-in-out 0s normal none 1 running fadeInDown;*/
	box-shadow: 0 9px 38px rgba(0,0,0,.05),0 5px 12px rgba(0,0,0,.1);
}
.header-item-right {
	display: flex;
	flex: 0 0 22%;
	align-items: center;
	justify-content: flex-end;
}
/*.header-item-right .menu-icon {
    font-size: 1.35rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    margin-left: 1rem;
    border: none;
    outline: none;
    color: #232323;
    transition: all 0.3s ease;
}*/
.head-menu > ul > li {
	display: inline-block;
	line-height: 5.5rem;
	margin-left: .5rem;
}
.head-menu > ul > li:first-child{margin-left: 0;}
.head-menu > ul > li > a {
	color:var(--white-color);
	font-size:1.125rem;
	font-weight: 500;
	line-height: 1.25;
	letter-spacing: 1px;
	border: none;
	position: relative;
	outline: none;
	text-transform: capitalize;
	text-rendering: optimizeLegibility;
	transition: var(--transition-all-slow);
}
.head-menu > ul > li > a:before {
	background-color: var(--white-color);
	border-radius:var(--radius-lg);
	content: '';
	width: 10px;
	height: 3px;
	position: absolute;
	bottom: -4px;
	left: 50%;
	transform: translateX(50%) scale(1, 0);
	transition: transform .4s ease;
	transform-origin: left center;
}
@media (max-width: 1199px) {
	.head-menu > ul > li > a:before {
		display: none;
	}
}
.head-menu > ul > li.active > a:before,
.head-menu > ul > li:hover > a:before {
	background-color: var(--primary-background);
	transform: translateX(-50%) scale(1, 1);
	transform-origin: right center;
}

.header-bottom.fixed-add .head-menu > ul > li.active > a:before,
.header-bottom.fixed-add .head-menu > ul > li:hover > a:before {
	background-color: var(--white-color);
	transform: translateX(-50%) scale(1, 1);
	transform-origin: right center;
}

.head-menu > ul > li .menu-subs {
	background: var(--white-color);
	border-radius:0 0 var(--radius-sm) var(--radius-sm);
	border-top: 3px solid var(--primary-border-color);
	width: 100%;
	height: auto;
	margin-top:1.75rem;
	padding: .5rem;
	outline: none;
	position: absolute;
	z-index: var(--z-fixed);
	opacity: 0;
	visibility: hidden;
	box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
	transition: var(--transition-all-slow);
}
.head-menu > ul > li .menu-subs > ul {list-style:none; margin: 0;padding: 0;}
.head-menu > ul > li .menu-subs > ul > li {line-height: 1;}
.head-menu > ul > li .menu-subs > ul > li > a {
	color: var(--color-text);
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.25;
	padding: 0.5rem 0;
	border: none;
	outline: none;
	display: block;
	/*display: inline-block;*/
	text-transform: capitalize;
	text-rendering: optimizeLegibility;
	position: relative;
	transition:all 500ms ease !important;
}

.head-menu > ul > li .menu-subs > ul > li > a:before {
	background-color: var(--primary-background);
	font-family: "Font Awesome 5 Duotone",serif;
	line-height: 0;
	border-radius: var(--radius-lg);
	content: "";
	opacity: 0;
	width: 10px;
	height: 2px;
	margin-right: 5px;
	position: absolute;
	top: 50%;
	left: 0;
	display: inline;
	transform: translateY(-50%);
	transition:all 500ms ease !important;
}
/*.head-menu > ul > li .menu-subs > ul > li > a:before {
    font-family: "Font Awesome 5 Duotone", serif;
    display: inline;
    text-align: center;
    font-size: 24px;
    line-height: 0;
    border-radius: var(--radius-lg);
    content: "-";
    opacity: 0;
    margin-right: 5px;
    left: 0;
    transition:all 500ms ease !important;
}*/
.head-menu > ul > li .menu-column-1 {
	min-width: 12rem;
	max-width: 15rem;
}
.head-menu > ul > li .menu-subs.menu-mega {
	left: 50%;
	transform: translateX(-50%);
}
.head-menu > ul > li .menu-subs.menu-mega > .list-item > ul > li {
	display: block;
	line-height: 1;
	padding: 0.5rem 0;
}
.head-menu > ul > li .menu-subs.menu-mega > .list-item > ul > li > a {
	color: var(--color-text);
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.25;
	text-rendering: optimizeLegibility;
	border: none;
	outline: none;
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	display: -webkit-box;
	transition:all 500ms ease !important;
}

.head-menu > ul > li .menu-subs.menu-mega > .list-item > ul > li > a:before {
	background-color: var(--primary-background);
	font-family: "Font Awesome 5 Duotone",serif;
	/*text-align: center;
    font-size: 24px;*/
	line-height: 0;
	border-radius: var(--radius-lg);
	content: "";
	width: 10px;
	height: 2px;
	margin-right: 5px;
	position: absolute;
	top: 50%;
	left: 0;
	opacity: 0;
	display: inline;
	transform: translateY(-50%);
	transition:all 500ms ease !important;
}
.head-menu > ul > li .menu-subs.menu-mega > .list-item > ul > li > a:hover::before,
.head-menu > ul > li .menu-subs > ul > li > a:hover::before{opacity: 1;left: .2rem;}

.head-menu > ul > li .menu-subs.menu-mega > .list-item > ul > li > a:hover,
.head-menu > ul > li .menu-subs > ul > li > a:hover {color: var(--primary-color);padding-left: 1rem !important;}

.head-menu > ul > li .menu-subs.menu-column-4 {
	max-width: 52rem;
	width: 100%;
	padding: .4rem;
	display: flex;
	flex-wrap: wrap;
}
.head-menu > ul > li .menu-subs.menu-column-4 > .list-item {
	-webkit-box-flex: 0;
	flex: 0 0 33.333%;
	padding: 0 .2rem;
}
.head-menu > ul > li .menu-subs.menu-column-4 > .list-item ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.head-menu > ul > li .menu-subs.menu-column-4 > .list-item .title {
	font-size: 1rem;
	font-weight: 500;
	color: var(--primary-color);
	line-height: 1;
	border: none;
	margin: 0;
	padding: 0.5rem 0;
	outline: none;
	text-rendering: optimizeLegibility;
	transition: var(--transition-all-fast);
}
.head-menu > ul > li .menu-subs.menu-column-4 > .list-item.text-center .title {text-align: center;}
.head-menu > ul > li .menu-subs.menu-column-4 > .list-item img.responsive {
	max-width: 100%;
	width: 100%;
	height: auto;
	margin-top: 0.75rem;
	-o-object-fit: cover;
	object-fit: cover;
	vertical-align: middle;
}

/*.header-item-right a:hover,   ----BEKLET*/
.head-menu > ul > li:hover > a {color: var(--primary-color) !important;}

@media only screen and (min-width: 993px) {
	.head-menu > ul > li.menu-item-has-children:hover .menu-subs {
		margin-top: 0.5rem;
		opacity: 1;
		visibility: visible;
	}
}

.menu-mobile-header,
.menu-mobile-trigger {display: none;}

/*----------------------------------*/
@media only screen and (max-width: 1199px) {
	.header-item-center {
		flex: 0 0 100%;
	}
	.header-item-left, .header-item-right {
		flex: 0 0 75%;
	}
	.menu-wrapper {
		justify-content: space-between;
	}
	.menu-mobile-trigger {
		width: 40px;
		height: 40px;
		display: flex;
		align-items: end;
		justify-content: center;
		flex-direction: column;
		gap: 7px;
		cursor: pointer;
	}
	.menu-mobile-trigger span {
		background: var(--white-color);
		border-radius: var(--radius-lg);
		width: 32px;
		height: 2px;
		transition: all .5s ease-in-out;
	}
	/*.menu-mobile-trigger span:nth-child(1) {width:29px;}
    .menu-mobile-trigger span:nth-child(2),*/
	.menu-mobile-trigger span:nth-child(2) {width:24px;}

	.menu-mobile-trigger span:nth-child(3) {width:32px;}

	.menu-mobile-trigger:hover span:nth-child(1) {background:rgba(var(--primary-opacity),.9) !important;}
	.menu-mobile-trigger:hover span:nth-child(2) {background:rgba(var(--primary-opacity),.7) !important;}
	.menu-mobile-trigger:hover span:nth-child(3) {background:rgba(var(--primary-opacity),.5) !important;}


	.header-item-right {
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
	}
	.head-menu {
		background:rgba(var(--intro-opacity),1);
		position: fixed;
		top: 0;
		left: 0;
		width: 19rem;
		height: 100%;
		z-index: 1099;
		overflow: hidden;
		transform: translate(-100%);
		transition: all 0.5s ease-in-out;
	}
	.head-menu.active {
		transform: translate(0);
	}
	.head-menu > ul > li {
		display: block;
		line-height: 1;
		margin: 0;
	}
	.head-menu > ul > li > a {
		color: var(--white-color) !important;
		line-height: 3.125rem;
		border-bottom:1px solid rgba(var(--intro-border),1);
		height: 3.125rem;
		padding: 0 3.125rem 0 1rem;
		display: block;
	}
	.head-menu > ul > li > a i {
		position: absolute;
		font-size: 1.25rem;
		line-height: 3.125rem;
		top: 0;
		right: 0;
		width: 3.125rem;
		height: 3.125rem;
		text-align: center;
		transform: rotate(-90deg);
	}
	.head-menu .menu-mobile-header {
		background:rgba(var(--intro-opacity),1);
		border-bottom: 1px solid rgba(var(--intro-border),1);
		position: sticky;
		/*position: relative;*/
		top: 0;
		z-index: 501;
		height: 3.125rem;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		align-items: center;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
	}
	.head-menu .menu-mobile-header .menu-mobile-arrow {
		font-size: 1.5rem;
		color: var(--white-color);
		text-align: center;
		line-height: 2.5rem;
		border-right: 1px solid rgba(0, 0, 0, 0.1);
		width: 2.5rem;
		height: 2.5rem;
		display: none;
		cursor: pointer;
	}
	.head-menu .menu-mobile-header.active .menu-mobile-arrow {display: block;}
	.head-menu .menu-mobile-header .menu-mobile-title {
		font-family: inherit;
		color: var(--white-color);
		font-size: 1rem;
		font-weight: 500;
		line-height: inherit;
		text-transform: capitalize;
		text-rendering: optimizeLegibility;
	}
	.head-menu .menu-mobile-header .menu-mobile-close {
		/*background-color: var(--background-white);*/
		color: var(--white-color);
		font-size:1.5rem;
		text-align: center;
		line-height: 2.5rem;
		/*border-radius: 0.75rem;*/
		cursor: pointer;
		width: 2.5rem;
		height: 2.5rem;
	}
	.head-menu .menu-section {
		height: 100%;
		overflow-y: auto;
		overflow-x: hidden;
	}
	.head-menu > ul > li .menu-subs {
		background-color:rgba(var(--intro-opacity),1);
		position: absolute;
		display: none;
		top: 0;
		left: 0;
		max-width: none;
		min-width: auto;
		width: 100%;
		height: 100%;
		margin: 0;
		padding:4rem 1rem 1rem;
		opacity: 1;
		overflow-y: auto;
		visibility: visible;
		transform: translateX(0%);
		box-shadow: none;
	}
	.head-menu > ul > li .menu-subs.menu-mega {
		position: absolute;
		display: none;
		top: 0;
		left: 0;
		max-width: none;
		min-width: auto;
		width: 100%;
		height: 100%;
		margin: 0;
		padding:4rem 1rem 1rem;
		opacity: 1;
		overflow-y: auto;
		visibility: visible;
		transform: translateX(0%);
		box-shadow: none;
	}
	.head-menu > ul > li .menu-subs.active {display: block;}
	.head-menu > ul > li .menu-subs.menu-column-4 > .list-item {
		-webkit-box-flex: 0;
		flex: 0 0 100%;
		padding: 0;
	}
	.head-menu > ul > li .menu-subs.menu-column-4 > .list-item img.responsive {margin-top: 0;}
	.head-menu > ul > li .menu-subs.menu-column-4 > .list-item.text-center .title {margin-bottom: 1.25rem;}
	.head-menu > ul > li .menu-subs.menu-column-4 > .list-item.text-center:last-child .title {margin-bottom: 0;}
	.head-menu > ul > li .menu-subs > ul > li > a {display: block;color: var(--white-color);}
	.head-menu > ul > li .menu-subs.menu-mega > .list-item > ul {margin-bottom: 1rem;}
	.head-menu > ul > li .menu-subs.menu-mega > .list-item > ul > li > a {display: block;color: var(--white-color);}
	.overlay {
		background: rgba(0, 0, 0, 0.55);
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: 1098;
		opacity: 0;
		visibility: hidden;
		transition: all 0.5s ease-in-out;
	}
	.overlay.active {
		opacity: 1;
		visibility: visible;
	}
}
/*----------------------------------*/
@-webkit-keyframes slideLeft {
	0% {
		opacity: 0;
		transform: translateX(100%);
	}
	100% {
		opacity: 1;
		transform: translateX(0);
	}
}
@keyframes slideLeft {
	0% {
		opacity: 0;
		transform: translateX(100%);
	}
	100% {
		opacity: 1;
		transform: translateX(0);
	}
}
@-webkit-keyframes slideRight {
	0% {
		opacity: 1;
		transform: translateX(0);
	}
	100% {
		opacity: 0;
		transform: translateX(100%);
	}
}
@keyframes slideRight {
	0% {
		opacity: 1;
		transform: translateX(0);
	}
	100% {
		opacity: 0;
		transform: translateX(100%);
	}
}
/*---------------------------------------------------
   3.D Other Menu
-----------------------------------------------------*/
/*ul.user-actions-menu {
	display: flex;
	align-items: center;
	margin-left:1rem;
}
ul.user-actions-menu li {
	position: relative;
	margin-left:1.2rem;
}
ul.user-actions-menu li:first-child {margin-left: 0;}
ul.user-actions-menu li:first-child::before {display: none;}
!*ul.user-actions-menu li a {
    color: var(--secondary-color);
    font-size: 1rem;
}*!

ul.user-actions-menu li i{transform: rotate(0deg);}
ul.user-actions-menu li a {}
ul.user-actions-menu li a:hover {}

ul.user-actions-menu li.user-account-button {
	display: flex;
	align-items: center;
	!*margin-right: 30px;*!
}

ul.user-actions-menu li.user-account-button span,
ul.user-actions-menu li.user-account-button span i,
ul.user-actions-menu li.user-account-button a,
ul.user-actions-menu li.user-account-button a i {
    transition: all 0.5s ease-in-out;
}

ul.user-actions-menu li.user-account-button:hover span i,
ul.user-actions-menu li.user-account-button:hover a i {
    color: var(--secondary-color);
}

ul.user-actions-menu li.user-account-button:hover span,
ul.user-actions-menu li.user-account-button:hover a {
    border-color: var(--primary-border-color) !important;
}

ul.user-actions-menu li.user-account-button > span,
ul.user-actions-menu li.user-account-button > a {
    background: transparent;
    color: var(--white-color);
    font-size: 1.25rem;
    line-height: 0;
    border: 1px solid var(--white-color);
    border-radius: 50%;
    margin-right: 7px;
    min-width: 40px;
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    text-decoration: none;
}*/

/* ═══════════════════════════════════════════════════════════
   HEADER — GİRİŞ YAP + RANDEVU AL
   ═══════════════════════════════════════════════════════════ */

.am-form section {
    width: 100%;
}

.am-form .row {
    margin-left: 0;
    margin-right: 0;
}


/* ── User Actions Menu ──────────────────────────────────── */
.menu-wrapper {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
}

.header-item-left   { flex: 0 0 auto !important; }

.header-item-center {
    flex: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
}

.header-item-right {
    flex: 0 0 auto !important;
    margin-left: 20px !important;
}

/* ── User Actions Menu ───────────────────────────────── */
.header-item-right .user-actions-menu {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 10px !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.header-item-right .user-actions-menu li {
    display: flex !important;
    align-items: center !important;
}

/* ── Masaüstü hamburger ──────────────────────────────── */
.desktop-hamburger { display: flex !important; align-items: center !important; }
.desktop-trigger   { cursor: pointer; }

/* ── Giriş Yap Pill ──────────────────────────────────── */
.nav-user-pill {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    height: 40px !important;
    padding: 0 16px 0 6px !important;
    background: rgba(255,255,255,0.08) !important;
    border: 1px solid rgba(255,255,255,0.2) !important;
    border-radius: 100px !important;
    cursor: pointer !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    transition: all .2s !important;
}

.nav-user-pill:hover {
    background: rgba(255,255,255,0.15) !important;
    border-color: rgba(255,255,255,0.35) !important;
}

.nav-user-pill--icon {
    height: 36px !important;
    width: 36px !important;
    padding: 0 !important;
    justify-content: center !important;
    border-radius: 50% !important;
}

.nav-user-circle {
    width: 28px !important;
    height: 28px !important;
    border-radius: 50% !important;
    background: var(--primary-color) !important;
    color: white !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    flex-shrink: 0 !important;
}

.nav-user-name {
    font-size: .9rem !important;
    font-weight: 600 !important;
    color: white !important;
    white-space: nowrap !important;
}

.nav-user-arrow {
    font-size: 9px !important;
    color: rgba(255,255,255,0.5) !important;
}

/* ── Scroll'da beyaz header ──────────────────────────── */
.fixed-add .nav-user-pill  { background: rgba(17,34,53,0.08) !important; border-color: rgba(17,34,53,0.2) !important; }
.fixed-add .nav-user-name  { color: var(--color-footer-top) !important; }
.fixed-add .nav-user-arrow { color: #666 !important; }

/* ── Dropdown ────────────────────────────────────────── */
.nav-user-dropdown {
    display: none;
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    width: 210px;
    background: white;
    border: 1px solid #eee;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 8px 32px rgba(0,0,0,.15);
    z-index: 99999;
}

.nav-user-dropdown.open { display: block; }

.nav-user-item {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 11px 16px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #333 !important;
    text-decoration: none !important;
    border-bottom: 1px solid #f5f5f5 !important;
    transition: background .15s !important;
}

.nav-user-item:last-child    { border-bottom: none !important; }
.nav-user-item:hover         { background: #f9f9f9 !important; }
.nav-user-item--logout       { color: var(--primary-color) !important; }
.nav-user-item--logout:hover { background: var(--white-color)5f5 !important; }

/* ── Randevu Al Butonu (header'a özel) ───────────────── */
.header-appointment-btn {
    color: var(--white-color);
    font-size: 1rem;
    font-weight: 400;
    border-radius: var(--radius-xl);
    padding: 10px 24px;
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: var(--transition-all-medium);
    cursor: pointer;
    border: none;
    background: var(--primary-color);
    text-decoration: none;
    white-space: nowrap;
}

.header-appointment-btn::after {
    content: "";
    border-radius: var(--radius-circle);
    height: 30px;
    width: 30px;
    display: inline-block;
    transition: var(--transition-all-medium);
    position: absolute;
    top: 5px;
    left: 5px;
    z-index: -1;
    background: var(--primary-button-hover);
}

.header-appointment-btn:hover::after {
    width: 94%;
    border-radius: var(--radius-xl);
}

.header-appointment-btn i      { margin-left: 4px; transform: none; }
.header-appointment-btn:hover  { color: var(--white-color) !important; }

/* ── Mobil menü içi butonlar ─────────────────────────── */
.mobile-bottom-actions {
    display: none !important;
    flex-direction: column;
    gap: 10px;
    padding: 16px;
    border-top: 1px solid rgba(255,255,255,0.1);
    margin-top: 8px;
    list-style: none;
}

.mobile-btn-appointment {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 13px;
    background: var(--primary-color);
    border-radius: 10px;
    color: white !important;
    text-decoration: none;
    font-size: 14px;
    font-weight: 700;
}

.mobile-btn-login {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 13px;
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 10px;
    color: white !important;
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
}

/* ── Telefon sabit randevu butonu ────────────────────── */
.mobile-fixed-appointment {
    display: none;
    position: fixed;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 9998;
}

.mobile-fixed-appointment a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 28px;
    background: var(--primary-color);
    color: white !important;
    border-radius: 100px;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 8px 24px rgba(232,80,58,0.4);
    white-space: nowrap;
}

/* ══════════════════════════════════════════════════════
   VARSAYILAN (tüm ekranlar)
   ══════════════════════════════════════════════════════ */
.header-item-right        { display: flex !important; }
.mobile-bottom-actions    { display: none !important; }
.mobile-fixed-appointment { display: none !important; }
.mobile-fixed-buttons     { display: none; }
.clinic-location-btn      { display: flex !important;}
.desktop-hamburger        { display: flex !important; align-items: center !important; }
.header-item-center .menu-mobile-trigger { display: none; }

/* ══════════════════════════════════════════════════════
   767px ve altı — TAM MOBİL
   ══════════════════════════════════════════════════════ */
@media (max-width: 767px) {
    .header-item-right        { display: none !important; }
    .mobile-bottom-actions    { display: block !important; }
    .mobile-fixed-buttons     { display: flex !important; }
    .clinic-location-btn      { display: none !important; }
    .desktop-hamburger        { display: none !important; }

    .header-item-center {
        flex: 0 0 auto !important;
        margin-left: auto !important;
        justify-content: flex-end !important;
    }
    .header-item-center .menu-mobile-trigger {
        display: flex !important;
    }
}

/* ══════════════════════════════════════════════════════
   768px - 991px — TABLET
   Randevu Al + Hamburger header'da, altbutonlar + hızlı erişim açık
   ══════════════════════════════════════════════════════ */
@media (min-width: 768px) and (max-width: 991px) {
    .header-item-right {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: 10px !important;
    }
    .user-account-button      { display: none !important; }
    .appointment-button       { display: flex !important; }
    .mobile-bottom-actions    { display: block !important; }
    .mobile-fixed-buttons     { display: flex !important; }
    .clinic-location-btn      { display: none !important; }
    .desktop-hamburger        { display: flex !important; }

    .header-appointment-btn {
        height: 36px !important;
        font-size: 12px !important;
        padding: 0 14px !important;
        white-space: nowrap;
    }
    .header-appointment-btn::after {
        height: 26px !important;
        width: 26px !important;
        top: 4px !important;
        left: 4px !important;
    }
    .header-item-center {
        flex: 1 !important;
        margin-left: 0 !important;
    }
}

/* ══════════════════════════════════════════════════════
   992px - 1199px — KÜÇÜK LAPTOP
   Header normal, altbutonlar + hızlı erişim açık
   ══════════════════════════════════════════════════════ */
@media (min-width: 992px) and (max-width: 1199px) {
    .header-item-right        { display: flex !important; }
    .mobile-bottom-actions    { display: block !important; }
    .mobile-fixed-buttons     { display: flex !important; }
    .clinic-location-btn      { display: none !important; }
    .desktop-hamburger        { display: flex !important; }
}

/* ══════════════════════════════════════════════════════
   1200px - 1400px — LAPTOP/MASAÜSTÜ
   Butonlar alt alta, kliniğe git sabit sağ alt
   ══════════════════════════════════════════════════════ */
@media (min-width: 1200px) and (max-width: 1400px) {
    .mobile-bottom-actions    { display: none !important; }
    .mobile-fixed-buttons     { display: none !important; }
    .clinic-location-btn      { display: flex !important; }

    .header-item-right ul.user-actions-menu {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 5px !important;
    }
    .desktop-hamburger { display: none !important; }

    .nav-user-pill {
        height: 34px !important;
        font-size: 12px !important;
        padding: 0 14px 0 6px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    .header-appointment-btn {
        height: 34px !important;
        font-size: 12px !important;
        padding: 0 14px !important;
        width: 100% !important;
        box-sizing: border-box !important;
        justify-content: center !important;
    }
    .header-appointment-btn::after {
        height: 26px !important;
        width: 26px !important;
        top: 4px !important;
        left: 6px !important;
    }
    .header-appointment-btn:hover::after {
        width: 90% !important;
    }
    ul.menu-section { flex-wrap: nowrap !important; }
    ul.menu-section > li > a,
    ul.menu-section > li > .menu-parent {
        padding: 0 4px !important;
        font-size: 1rem !important;
        white-space: nowrap;
    }
}

/* ══════════════════════════════════════════════════════
   1400px üstü — GENİŞ MASAÜSTÜ
   ══════════════════════════════════════════════════════ */
@media (min-width: 1400px) {
    .mobile-bottom-actions    { display: none !important; }
    .mobile-fixed-buttons     { display: none !important; }
    .clinic-location-btn      { display: flex !important; }
    .desktop-hamburger        { display: flex !important; }
}


/* ══════════════════════════════════════════════════════
   MOBİL MENÜ HIZLI ERİŞİM BLOĞU
   ══════════════════════════════════════════════════════ */
.mobile-bottom-actions {
    padding: 0 !important;
    list-style: none !important;
    margin: 0 !important;
    border-top: none !important;
}

.mob-quick-access {
    margin: 12px 14px 16px;
    background: rgba(232,80,58,0.10);
    border: 1px solid rgba(232,80,58,0.22);
    border-radius: 14px;
    padding: 16px 14px 14px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.mob-quick-label {
    font-size: 1rem;
    color: rgba(232,80,58,0.75);
    font-weight: 600;
    margin-bottom: 4px;
}

.mob-quick-btn {
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
    padding: 11px 16px !important;
    border-radius: 100px !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: all .2s ease !important;
    cursor: pointer !important;
}
.mob-quick-btn--primary {
    background: var(--primary-color) !important;
    color: white !important;
}
.mob-quick-btn--primary:hover {
    background: #d04030 !important;
    color: white !important;
}
.mob-quick-btn--secondary {
    background: rgba(255,255,255,0.07) !important;
    color: rgba(255,255,255,0.85) !important;
    border: none !important;
}
.mob-quick-btn--secondary:hover {
    background: rgba(255,255,255,0.12) !important;
    color: white !important;
}
.mob-quick-btn--location {
    background: rgba(255,255,255,0.07) !important;
    color: rgba(255,255,255,0.85) !important;
    border: none !important;
}
.mob-quick-btn--location:hover {
    background: rgba(255,255,255,0.12) !important;
    color: white !important;
}

.mob-quick-social {
    display: flex !important;
    justify-content: center !important;
    gap: 7px !important;
    margin-top: 6px !important;
    padding-top: 12px !important;
    border-top: 1px solid rgba(255,255,255,0.07) !important;
}
.mob-quick-social-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 35px !important;
    height: 35px !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,0.06) !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
    color: rgba(255,255,255,0.6) !important;
    font-size: 1rem !important;
    text-decoration: none !important;
    transition: all .2s ease !important;
}
.mob-quick-social-icon svg {
    fill: rgba(255,255,255,0.6) !important;
    width: 12px !important;
    height: 12px !important;
}
.mob-quick-social-icon:hover {
    background: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
    transform: translateY(-2px) !important;
}
.mob-quick-social-icon:hover svg {
    fill: white !important;
}


/* ══════════════════════════════════════════════════════
   MOBİL SABİT ALT BUTONLAR
   ══════════════════════════════════════════════════════ */
.am-node-rail {
    position: fixed;
    right: 20px;
    top: 60%;
    transform: translateY(-50%);
    z-index: 999;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 10px 0;
}

.am-nr-track {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 63%;
    transform: translateX(-50%);
    width: 1.5px;
    background: linear-gradient(
        180deg,
        transparent 0%,
        rgba(86, 190, 146, .25) 20%,
        rgba(86, 190, 146, .4)  50%,
        rgba(86, 190, 146, .25) 80%,
        transparent 100%
    );
    pointer-events: none;
}

.am-nr-node {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    cursor: pointer;
    text-decoration: none;
    outline: none;
}

.am-nr-circle {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
    z-index: 2;
    transition:
        transform .35s cubic-bezier(.34, 1.56, .64, 1),
        box-shadow .35s ease;
    margin-right: -10px;
    box-shadow: -2px 0 12px rgba(0, 0, 0, .2);
}

.am-nr-node:hover .am-nr-circle,
.am-nr-node:focus-visible .am-nr-circle,
.am-nr-node.active .am-nr-circle {transform: scale(1.18) translateX(-6px);}

.am-nr-circle--primary {
    background: var(--primary-color);
    box-shadow: -2px 0 16px var(--primary-shadow);
}
.am-nr-node:hover .am-nr-circle--primary {
    background: var(--primary-color-dark);
    box-shadow: -4px 0 20px var(--primary-shadow-hover);
}

.am-nr-circle--dark {
    background: var(--color-footer);
    box-shadow: -2px 0 12px rgba(0, 0, 0, .3);
}
.am-nr-node:hover .am-nr-circle--dark {
    background: var(--color-footer-top);
    box-shadow: -4px 0 18px rgba(0, 0, 0, .4);
}

.am-nr-circle--wp {
    background: #25d366;
    box-shadow: -2px 0 12px rgba(37, 211, 102, .25);
}
.am-nr-node:hover .am-nr-circle--wp {
    background: #1da851;
    box-shadow: -4px 0 18px rgba(37, 211, 102, .35);
}

.am-nr-tooltip {
    position: absolute;
    right: 46px;
    top: 50%;
    transform: translateY(-50%) translateX(10px);
    background: var(--primary-color-dark);
    border: 0.5px solid rgba(86, 190, 146, .2);
    border-radius: 10px;
    padding: 7px 12px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    opacity: 0;
    pointer-events: none;
    transition:
        opacity .25s ease,
        transform .3s cubic-bezier(.34, 1.56, .64, 1);
    white-space: nowrap;
    box-shadow: -4px 4px 20px rgba(0, 0, 0, .25);
}


.am-nr-tooltip::after {
    content: '';
    position: absolute;
    right: -5px;
    top: 50%;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-color: transparent transparent transparent var(--primary-color-dark);
}

.am-nr-tooltip-name {
    font-size: .8rem;
    font-weight: 700;
    color: var(--white-color);
    line-height: 1;
}

.am-nr-node:hover .am-nr-tooltip-name {color: var(--white-color);}

.am-nr-node:hover .am-nr-tooltip-sub {color: var(--primary-color-extra-light);}

.am-nr-tooltip-sub {
    font-size: .8rem;
    color: var(--primary-color-extra-light);
    line-height: 1;
}

.am-nr-node:hover .am-nr-tooltip,
.am-nr-node:focus-visible .am-nr-tooltip,
.am-nr-node.active .am-nr-tooltip {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
}

.am-nr-pulse {
    position: absolute;
    right: -11px;
    top: 50%;
    transform: translateY(-50%);
    width: 47px;
    height: 47px;
    border-radius: var(--radius-circle);
    background: rgba(86, 190, 146, .2);
    animation: amNrPulse 2.5s ease-in-out infinite;
    pointer-events: none;
    z-index: 1;
}

@keyframes amNrPulse {
    0%   { transform: translateY(-50%) scale(1);   opacity: .6; }
    70%  { transform: translateY(-50%) scale(1.55); opacity: 0; }
    100% { transform: translateY(-50%) scale(1);   opacity: 0; }
}

@media (max-width: 991px) {
    .am-node-rail {
        top: auto;
        bottom: 250px;
        transform: none;
        gap: 8px;
        padding: 8px 0;
    }

    .am-nr-circle {
        width: 46px;
        height: 46px;
        margin-right: -12px;
    }

    .am-nr-tooltip {right: 50px;}
}

.mobile-fixed-buttons {display: none !important;}


.mfb-icon-btn {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    text-decoration: none;
}

.mfb-circle {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 20px rgba(0,0,0,0.25);
    transition: transform .25s ease;
}

.mfb-circle:hover {
    transform: translateY(-2px);
}

.mfb-circle--wp  { background: #00a884; }
.mfb-circle--tel { background: #31c5f4; }

.mfb-label {
    font-size: 10px;
    font-weight: 600;
    color: var(--white-color);
    white-space: nowrap;
}

/* ══════════════════════════════════════════════════════
   KLİNİĞE GİT — MASAÜSTÜ SABİT BUTONU
   ══════════════════════════════════════════════════════ */
.clinic-location-btn {
    position: fixed;
    display: flex;
    bottom: 43px;
    right: 116px;
    z-index: 9990;
    align-items: center;
    gap: 10px;
    background: var(--color-footer-top);
    border: 1px solid var(--color-footer-top);
    border-radius: 100px;
    padding: 8px 16px 8px 8px;
    text-decoration: none;
    cursor: pointer;
    transition: all .25s ease;
    backdrop-filter: blur(8px);
    box-shadow: 0 4px 20px rgba(0,0,0,0.3);
}
.clinic-location-btn:hover {
    background: var(--color-footer-top);
    transform: translateY(-2px);
    box-shadow: 0 8px 28px rgba(0,0,0,0.35);
}
.clinic-location-btn__icon {
    width: 35px;
    height: 35px;
    border-radius: var(--radius-circle);
    background: var(--primary-color);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: transform .25s ease;
}
.clinic-location-btn:hover .clinic-location-btn__icon {
    transform: scale(1.1);
}
.clinic-location-btn__text {
    display: flex;
    flex-direction: column;
    line-height: 1.25;
}
.clinic-location-btn__label {
    font-size: .9rem;
    font-weight: 600;
    color: var(--white-color);
    white-space: nowrap;
}
.clinic-location-btn__sub {
    font-size: .7rem;
    color: var(--grey-color);
    white-space: nowrap;
}
.clinic-location-btn__arrow {
    flex-shrink: 0;
    margin-left: 4px;
    transition: transform .25s ease;
}
.clinic-location-btn:hover .clinic-location-btn__arrow {
    transform: translate(2px, -2px);
}

#clinicModal {
    background: rgba(0, 0, 0, 0.55);
    display: none;
    position: fixed;
    inset: 0;
    z-index: 9999;
    align-items: center;
    justify-content: center;
}

.clinic-modal-wrap {
    background: linear-gradient(135deg, #3d9a72 0%, #112235 100%);
    border-radius: 20px;
    padding: 2px;
    width: 100%;
    max-width: 400px;
    margin: 1rem;
}

.clinic-modal-inner {
    background: rgba(255, 255, 255, 0.1);
    border-radius: 19px;
    border: 0.5px solid rgba(255, 255, 255, 0.2);
    padding: 1.5rem;
}

.clinic-modal-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.25rem;
}

.clinic-modal-title {
    color: var(--white-color);
    font-size: 1rem;;
    font-weight: 600;
}

.clinic-modal-close {
    color: var(--white-color);
    background: var(--primary-color-dark);
    font-size: 1rem;
    width: 30px;
    height: 30px;
    border: none;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
}

.clinic-modal-close:hover {background: var(--primary-border-color);}

.clinic-modal-addr {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    margin-bottom: 1rem;
    padding: 10px 12px;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 10px;
}

.clinic-modal-addr svg {
    flex-shrink: 0;
    margin-top: 2px;
}

.clinic-modal-addr span {
    color: var(--grey-color-xlight);
    font-size: .9rem;
    line-height: 1.6;
}

.clinic-modal-park {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    margin-bottom: 1.25rem;
    padding: 10px 12px;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 10px;
}

.clinic-modal-park-badge {
    color: var(--white-color);
    background: var(--primary-color);
    font-size:1rem;
    font-weight: 600;
    width: 30px;
    height: 30px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.clinic-modal-park-title {
    color: var(--white-color);
    font-size: .9rem;
    font-weight: 500;
    margin: 0 0 3px;
}

.clinic-modal-park-text {
    color: rgba(255, 255, 255, 0.6);
    font-size: .9rem;
    line-height: 1.5;
    margin: 0;
}

.clinic-modal-park-text strong {color: rgba(255, 255, 255, 0.9);}

.clinic-modal-btns {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.clinic-modal-btn {
    color: var(--white-color);
    font-size: .9rem;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 11px;
    border-radius: 10px;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: opacity 0.2s;
}

.clinic-modal-btn {transition: transform 0.2s, opacity 0.2s;}

.clinic-modal-btn:hover {
    color: var(--white-color);
    transform: translateY(-2px);
    opacity: 0.9;
}

.clinic-modal-btn:active {
    transform: translateY(0px);
    opacity: 1;
}

.clinic-modal-btn--google {background: var(--primary-accent-color);}
.clinic-modal-btn--yandex {background: var(--secondary-color);}
.clinic-modal-btn--apple {background: var(--color-footer-top);}


/*---------------------------------------------------
   3.E Off Canvas Menu
-----------------------------------------------------*/
.pi-overlay {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 9998;
    background: rgba(0, 0, 0, 0.5);
}

.pi-overlay.active {display: block;}

.pi-panel {
    position: fixed;
    top: 0;
    right: 0;
    width: 860px;
    max-width: 100%;
    height: 100vh;
    z-index: 9999;
    display: none;
    transition: none;
}

.pi-left {
    background: linear-gradient(160deg, #071410 0%, #0d2218 55%, #163322 100%);
    width: 300px;
    min-width: 300px;
    display: flex;
    flex-direction: column;
    padding: 2rem 1.75rem;
    overflow-y: auto;
}

.pi-logo {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 7px;
    text-decoration: none;
    margin-bottom: 4rem;
}

.pi-logo-img {
    height: 65px;
    width: auto;
    transition: transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.pi-logo:hover .pi-logo-img {transform: rotate(360deg) scale(1.15);}

.pi-logo-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.pi-logo-title {
    color: var(--primary-color);
    font-size: 1.8rem;
    font-weight: 900;
    line-height: 1.2;
}

.pi-logo-anka {color: var(--secondary-color);}

.pi-logo-sub {
    color: var(--primary-color);
    font-size: .9rem;
    font-weight: 500;
    line-height: 1.3;
}

.pi-left-body {flex: 1;}

.pi-left-title {
    color: var(--white-color);
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: .75rem;
    line-height: 1.3;
}

.pi-left-title span {color: var(--primary-color);}

.pi-left-desc {
    color: var(--grey-color-xdark);
    font-size: 1rem;
    line-height: 1.5;
    margin-bottom: 2rem;
}

.pi-left-steps {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-bottom: 2rem;
}

.pi-ls-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.pi-ls-circle {
    font-size: 1.1rem;
    font-weight: 600;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: all 0.3s;
}

.pi-ls-circle.active {
    color: var(--white-color);
    background: var(--primary-color);
}

.pi-ls-circle.done {
    color: var(--white-color);
    background: var(--primary-color-dark);
}

.pi-ls-circle.wait {
    color: var(--grey-color-deep);
    background: var(--primary-shadow);
    border: 1px solid var(--grey-color-deep);
}

.pi-ls-info {padding-top: 4px;}

.pi-ls-label {
    color: var(--grey-color-deep);
    font-size: 1rem;
    font-weight: 600;
    transition: color 0.3s;
}

.pi-ls-label.active {color: var(--white-color);}

.pi-ls-sub {
    color: var(--grey-color-deep);
    font-size: 1rem;
    margin-top: 2px;
}

.pi-ls-line {
    background: var(--grey-color-deep);
    width: 1px;
    height: 50px;
    margin-left: 20px;
    transition: background 0.3s;
}

.pi-ls-line.done {background: var(--primary-color);}

.pi-left-trust {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 6rem;
}

.pi-trust-item {
    color: var(--grey-color-deep);
    font-size: .9rem;
    display: flex;
    align-items: center;
    gap: 8px;
}

.pi-trust-item svg {
    stroke: var(--primary-color);
    flex-shrink: 0;
}

.pi-left-alt {
    margin-top: auto;
    padding-top: 1.5rem;
    border-top: 1px solid var(--primary-shadow);
}

.pi-dt-link {
    color: var(--primary-color-dark);
    font-size: 1rem;
    display: flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
    transition: color 0.2s;
    font-weight: 600;
}

.pi-dt-link:hover {color: var(--white-color);}

.pi-dt-link svg {flex-shrink: 0;}

.pi-right {
    flex: 1;
    background: var(--white-color);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.pi-right-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.75rem;
    border-bottom: 1px solid #f0f0f0;
    flex-shrink: 0;
}

.pi-right-title {
    color: #222;
    font-size: 15px;
    font-weight: 600;
}

.pi-close-btn {
    color: var(--primary-color-dark);
    background: var(--primary-color-extra-light);
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.2s;
}

.pi-close-btn:hover {
    color: var(--white-color);
    background: var(--primary-color);
}

.pi-right-body {
    flex: 1;
    overflow-y: auto;
    padding: 1.5rem 1.75rem;
}

.pi-social {
    margin-top: 6rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--primary-shadow-hover);
}

.pi-social-title {
    color: var(--black-color);
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: .25rem;
}

.pi-social-sub {
    font-size: .93rem;
    color: var(--grey-color-deep);
    margin-bottom: .5rem;
}

.pi-step-content {animation: piFadeIn 0.3s ease;}

@keyframes piFadeIn {
    from { opacity: 0; transform: translateX(12px); }
    to   { opacity: 1; transform: translateX(0); }
}

.pi-progress-bar {
    height: 3px;
    background: #f0f0f0;
    margin: 0 1.75rem .5rem;
    border-radius: 2px;
}

.pi-progress-fill {
    height: 3px;
    background: var(--primary-color);
    border-radius: 2px;
    transition: width 0.4s ease;
}

.pi-step-footer {
    display: flex;
    gap: 8px;
    margin-top: 1.5rem;
    padding-top: 1rem;
    border-top: 1px solid #f0f0f0;
}

.pi-btn-back {
    color: #666;
    background: var(--white-color);
    font-size: .9rem;
    padding: 11px;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    flex: 1;
    cursor: pointer;
    transition: background 0.2s;
}

.pi-btn-back:hover {
    color: var(--white-color);
    background: var(--primary-color-dark);
}

.pi-btn-next {
    color: var(--white-color)!important;
    background: var(--primary-color);
    font-size: .9rem;
    font-weight: 600;
    flex: 2;
    padding: 11px;
    border: none;
    border-radius: 10px;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: background 0.2s;
}

.pi-btn-next:hover {
    color: var(--primary-color-dark)!important;
    background: transparent;
    border: 1px solid var(--primary-color-dark);
}

.pi-btn-submit {background: var(--primary-color-dark)!important;}

.pi-step-summary {
    color: var(--primary-color-dark);
    background: var(--primary-shadow);
    font-size: .92rem;
    font-weight: 600;
    border: 1px solid var(--primary-shadow-hover);
    border-radius: 10px;
    padding: 10px 14px;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 8px;
}

.pi-step-summary i {
    color: var(--primary-color);
    font-size:1rem;
}

.pi-confirm-box {
    background: #f0faf5;
    border: 1px solid #b8e8d0;
    border-radius: 12px;
    padding: 1rem;
    margin-bottom: 1rem;
}

.pi-confirm-row {
    font-size: .9rem;
    display: flex;
    justify-content: space-between;
    padding: 6px 0;
    border-bottom: 1px solid var(--primary-shadow-hover);
}

.pi-confirm-row:last-child {border-bottom: none;}

.pi-confirm-row span:first-child {color: var(--primary-color-dark); font-weight: 600;}

.pi-confirm-row span:last-child {
    color: var(--grey-color-xxdark);
    font-size: 1rem;
}

/* Tablet (max 991px): Sol panel küçülür */
@media (max-width: 991px) {

    .pi-panel {width: 100%;}
    .pi-left {
        width: 220px;
        min-width: 220px;
        padding: 1.5rem 1.25rem;
    }
    .pi-left-title {font-size: 18px;}
    .pi-left-desc {display: none;}
    .pi-trust-item span {display: none;}
    .pi-right-body {padding: 1.25rem;}
}


@media (max-width: 767px) {
    .pi-panel {
        width: 100%;
        flex-direction: column;
    }
    .pi-left {display: none;}
    .pi-right {height: 100vh;}
    .pi-right-head {padding: 1rem 1.25rem;}
    .pi-right-body {padding: 1rem 1.25rem;}
}

/* Küçük mobil (max 480px) */
@media (max-width: 480px) {
    .pi-right-body {padding: .75rem 1rem;}
}

.side-social-media {
	display: flex;
	align-items: center;
	justify-content: center;
}
.side-social-media a {
    background-color: var(--primary-shadow);
    color: var(--primary-color);
    font-size: 1rem;
    text-align: center;
    border-radius: var(--radius-circle);
    height: 40px;
    width: 40px;
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    transition: all 500ms ease;
    border: 1px solid var(--primary-color);
}
/*.side-social-media a[media="facebook"]:hover {
	border-color: var(--facebook);
}
.side-social-media a[media="twitter"]:hover {
	border-color: var(--black-color);
}
.side-social-media a[media="instagram"]:hover {
	border-color: var(--instagram-three-color);
}
.side-social-media a[media="linkedin"]:hover {
	border-color: var(--linkedin);
}
.side-social-media a[media="youtube"]:hover {
	border-color: var(--youtube);
}*/

.side-social-media a i {font-size: 1.2rem;}
.side-social-media a:hover i{color:var(--white-color) !important;}

.side-social-media a[media="twitter"] svg{fill:var(--primary-color) !important;}
.side-social-media a:hover svg{fill:var(--white-color) !important;}

.side-social-media a:after {
	background:var(--primary-background);
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: -1;
	opacity: 1;
	height: 100%;
	transition-delay: .1s;
	transition-timing-function: ease-in-out;
	transition-duration: .4s;
	transition-property: all;
	transform-origin: top;
	transform-style: preserve-3d;
	transform: scaleY(0);
}
.side-social-media a[media="facebook"]:after {background-color: var(--facebook);}
.side-social-media a[media="twitter"]:after {background-color: var(--black-color);}
.side-social-media a[media="instagram"]:after {
	background: radial-gradient(circle at 30% 107%, var(--instagram-one-color) 0%, var(--instagram-one-color) 5%, var(--instagram-two-color) 45%,var(--instagram-three-color) 60%,var(--instagram-four-color) 90%);
}
.side-social-media a[media="linkedin"]:after {background-color: var(--linkedin);}
.side-social-media a[media="youtube"]:after {background-color: var(--youtube);}

.side-social-media a:hover:after {
	opacity: 1;
	transform: scaleY(1);
}
.side-social-media a+a {margin-left: 10px;}

/*===================================================
   END OF HEADER
=====================================================*/

/*===================================================
   4. SLIDER (CAROUSEL)
=====================================================*/
.am-slider {
    background: #040d08;
    position: relative;
    width: 100%;
    height: calc(100vh - 300px);
    min-height: 500px;
    overflow: hidden;
}

.am-slider-topline {
   /* background: linear-gradient(90deg, var(--primary-color) 40%, var(--secondary-color) 100%);*/
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    z-index: 10;
}

.am-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.7s ease;
    display: flex;
    background-size: cover;
    background-position: center;
}

.am-slide.active {
    opacity: 1;
    pointer-events: all;
}

.am-slide-overlay {display: none;}

.am-slide-left {
    background: rgba(4,13,8,.95);
    width: 45%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 48px 40px;
    position: relative;
    z-index: 2;
    flex-shrink: 0;
}

.am-slide-left::after {
    background: linear-gradient(90deg, transparent, rgba(4,13,8,.95));
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 80px;
    z-index: 3;
}

.am-slide-right {
    flex: 1;
    position: relative;
    overflow: hidden;
}

.am-slide-right-overlay {
    background: linear-gradient(90deg, rgba(4,13,8,.5) 0%, transparent 50%);
    position: absolute;
    inset: 0;
    z-index: 1;
}

.am-slide-badge {
    background: rgba(var(--primary-opacity), 0.12);
    color: var(--primary-color);
    font-size: 1rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 12px;
    border-radius: 20px;
    border: 1px solid rgba(var(--primary-opacity), 0.25);
    margin-bottom: 16px;
    width: fit-content;
}

.am-slide-badge-dot {
    background: var(--primary-color);
    width: 5px;
    height: 5px;
    border-radius: 50%;
    animation: amBlink 2s infinite;
}

.am-slide-h {
    color: var(--white-color);
    font-size: 2rem;
    font-weight: 800;
    line-height: 1.2;
    margin-bottom: 12px;
}

.am-slide-h em {
    color: var(--primary-color);
    font-style: normal;
}

.am-slide-p {
    color: var(--grey-color-dark);
    font-size: 1rem;
    line-height: 1.7;
    margin-bottom: 22px;
    max-width: 300px;
}

.am-slide-btns {
    display: flex;
    align-items: center;
    gap: 10px;
}

.am-slide-btn1 {
    background: var(--secondary-color);
    color: var(--white-color);
    border: none;
    padding: 10px 22px;
    border-radius: 50px;
    font-size: .9rem;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 4px 14px var(--secondary-shadow);
    transition: all 0.3s;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.am-slide-btn1:hover {
    color: var(--white-color);
    transform: scale(1.05);
    box-shadow: 0 6px 20px var(--secondary-shadow-hover);
}

.am-slide-btn2 {
    color: var(--primary-color);
    background: transparent;
    font-size: .9rem;
    font-weight: 500;
    gap: 6px;
    padding: 8px 16px;
    border-radius: 100px;
    border: 1px solid var(--primary-shadow-hover);
    display: flex;
    align-items: center;
    cursor:pointer;
    text-decoration: none;
    transition: all .25s;
}

.am-slide-btn2:hover {
    color: var(--white-color);
    border-color: var(--grey-color-light);
}

.am-slide-stats {
    display: flex;
    gap: 20px;
    margin-top: 24px;
    padding-top: 18px;
    border-top: 1px solid rgba(255,255,255,.07);
}

.am-stat-n {
    color: var(--primary-color);
    font-size:2rem;
    font-weight: 800;
    line-height: 1;
}

.am-stat-l {
    color: var(--grey-color-light);
    font-size: 1rem;
    margin-top: 3px;
}

.am-slide-play {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
}

.am-play-btn {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: rgba(var(--primary-opacity), 0.15);
    border: 2px solid rgba(var(--primary-opacity), 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s;
    backdrop-filter: blur(8px);
    text-decoration: none;
}

.am-play-btn:hover {
    background: rgba(var(--primary-opacity), 0.3);
    transform: scale(1.1);
}

.am-play-icon {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 9px 0 9px 16px;
    border-color: transparent transparent transparent var(--primary-color);
    margin-left: 4px;
}

.am-slide-photo-label {
    background: rgba(4,13,8,.85);
    position: absolute;
    bottom: 20px;
    right: 20px;
    border: 1px solid rgba(var(--primary-opacity), 0.2);
    border-radius: 10px;
    padding: 8px 14px;
    z-index: 3;
    backdrop-filter: blur(8px);
}

.am-slide-photo-label a {
    color: var(--white-color);
    font-size: 0.8rem;
    transition: color .3s ease;
}

.am-photo-label-t {
    color: var(--primary-color);
    font-size: 1rem;
    font-weight: 600;
    transition: color .3s ease;
}

.am-slide-photo-label:hover .am-photo-label-t {color: var(--white-color);}
.am-slide-photo-label:hover a {color: var(--primary-color);}

.am-slide-deco-1 {
    position: absolute;
    bottom: -80px;
    left: -80px;
    width: 260px;
    height: 260px;
    border-radius: 50%;
    border: 1px solid rgba(var(--primary-opacity), 0.06);
    pointer-events: none;
    z-index: 0;
}

.am-slide-deco-1::before {
    content: '';
    position: absolute;
    inset: 30px;
    border-radius: 50%;
    border: 1px solid rgba(var(--primary-opacity), 0.04);
}

.am-slide-deco-1::after {
    content: '';
    position: absolute;
    inset: 60px;
    border-radius: 50%;
    border: 1px solid rgba(var(--primary-opacity), 0.03);
}

.am-slide-deco-2 {
    position: absolute;
    top: -40px;
    right: 60px;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    border: 1px solid rgba(var(--primary-opacity), 0.05);
    pointer-events: none;
    z-index: 0;
}

.am-slide-deco-3 {
    position: absolute;
    top: 50%;
    right: 20px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(var(--primary-opacity), 0.3);
    pointer-events: none;
    z-index: 0;
    box-shadow: 0 20px 0 rgba(var(--primary-opacity), 0.2), 0 40px 0 rgba(var(--primary-opacity), 0.1), 0 -20px 0 rgba(var(--primary-opacity), 0.2), 0 -40px 0 rgba(var(--primary-opacity), 0.1);
}

.am-slider-nav {
    position: absolute;
    bottom: 24px;
    left: 40px;
    display: flex;
    align-items: center;
    gap: 6px;
    z-index: 10;
}

.am-slider-dot {
    background: rgba(255,255,255,.2);
    width: 5px;
    height: 5px;
    border-radius: 50%;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.am-slider-dot.active {
    width: 18px;
    border-radius: 3px;
    background: var(--primary-color);
}

.am-slider-arrows {
    position: absolute;
    bottom: 30px;
    left: calc(45% - 49px);
    display: flex;
    flex-direction: row;
    gap: 6px;
    z-index: 20;
}

.am-slider-arr {
    color:var(--grey-color-light);
    background: transparent;
    font-size: 1.1rem;
    font-weight: 600;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    border: 1px solid var(--primary-shadow-hover);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.25s;
    backdrop-filter: blur(8px);
    box-shadow: 0 4px 16px rgba(0,0,0,.3);
}

.am-slider-arr:hover {
    color: var(--primary-color);
    background: rgba(4,13,8,.95);
    border-color: var(--primary-color);
}

.am-slider-counter {
    color: var(--grey-color-dark);
    position: absolute;
    bottom: 8px;
    left: 45%;
    transform: translateX(-50%);
    font-size: 1rem;
    z-index: 9999;
}

.am-slider-counter span {
    color: var(--primary-color);
    font-weight: 700;
}

.am-slide-bg-mobile {display: none;}

.am-slide-overlay {display: none;}

.am-slide-img {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    transition: transform 8s ease;
}

.am-slide.active .am-slide-img {transform: scale(1.05);}

.am-slide-right-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(4,13,8,.6) 0%, transparent 50%);
    z-index: 1;
}

@media(max-width:1023px) {

    .am-slide-bg-mobile {
        display: block;
        position: absolute;
        inset: 0;
        background-size: cover;
        background-position: center;
        z-index: 0;
    }

    .am-slide-overlay {
        display: block;
        position: absolute;
        inset: 0;
        background: linear-gradient(180deg, rgba(4,13,8,.2) 0%, rgba(4,13,8,.75) 50%, rgba(4,13,8,.95) 100%);
        z-index: 1;
    }

    .am-slide-right {display: none;    }

    .am-slide-left {
        position: absolute;
        inset: 0;
        width: 100%;
        background: transparent;
        justify-content: flex-end;
        padding: 24px 24px 56px;
        z-index: 2;
    }

    .am-slide-left::after { display: none; }

    .am-slide-deco-1,
    .am-slide-deco-2,
    .am-slide-deco-3 { display: none; }

    .am-slide-p { max-width: 100%; }

    .am-slider-nav {
        bottom: 16px;
        left: 20px;
    }

    .am-slider-arrows {
        bottom: 10px;
        left: auto;
        right: 16px;
    }

    .am-slider-counter { display: none; }
    .am-slide-photo-label { display: none; }
    .am-slide-stats { margin-top: 16px; }
}

@media(max-width:599px) {
    .am-slider { height: 420px; }
    .am-slide-left { padding: 20px 16px 52px; }
    .am-slide-h { font-size: 1.3rem; }
    .am-slide-p { font-size: .8rem; margin-bottom: 16px; }
    .am-slide-btn1, .am-slide-btn2 { padding: 9px 14px; font-size: .7rem; }
    .am-slide-stats { gap: 12px; flex-wrap: wrap; }
}
/*---------------------------------------------------
   4.A Main Slider (Image & Text Slider)
-----------------------------------------------------*/
.intro-area {
	position: relative;
	z-index: 1;
	padding: 525px 0 170px;
	overflow: hidden;
}
.intro-area::before {
	background-color:rgba(var(--intro-opacity),.5);
	height: 100%;
	width: 100%;
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: var(--z-0);
	mix-blend-mode: multiply;
	transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
}

@media (max-width: 991.98px), (max-width: 575.98px) {
	.intro-area {
		padding: 200px 0 120px;
	}
}

.intro-area .intro-image {
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: var(--z-minus);
	object-fit: cover;
	transform: scale(1);
	transition: transform 8000ms ease, opacity 2400ms ease-in;
}
.intro-area .intro-image::after {
	background: var(--primary-background);
	height: 100%;
	width: 100%;
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	opacity: 0.2;
	z-index: var(--z-base);
}
.intro-area .intro-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.intro-area .intro-content {
	max-width: 850px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	display: block;
	position: relative;
	opacity: 0;
	z-index: 1;
	overflow: hidden;
	transform: perspective(400px) rotateY(0deg) translateY(-120px);
	transition: all 2000ms ease;
}
.intro-area .intro-content h5 {
	color: var(--primary-color);
	font-size: 1.5rem;
	font-style: normal;
	font-weight: 500;
	line-height: 1.2;
	margin: 0 0 .625rem;
	display: inline-block;
}
.intro-area .intro-content h2 {
	color: var(--white-color);
	font-size: 3.75rem;
	font-weight: 600;
	line-height: 1;
	margin: 0 0 1rem;
}
.intro-area .intro-content p {
	color: var(--white-color);
	font-size: 1.25rem;
	font-weight: 400;
	line-height: 1.2;
	margin: 0 0 2rem;
}

.header-carousel-one .active .intro-area .intro-content{
	opacity: 1;
	transform: perspective(400px) rotateY(0deg) translateY(0px);
}
.header-carousel-one .active .intro-area .intro-content {
	transition-delay: 1200ms;
}

.header-carousel-one .active .intro-area .intro-image {
	transform: scale(1.2);
}
@media screen and (min-width: 2000px) {
	.header-carousel-one .intro-area .intro-image {
		width: 100%;
	}
}
/*---------------------------------------------------
   4.B Services Slider
-----------------------------------------------------*/
.am-services {
    background: var(--white-color);
    padding: 2rem 0;
    position: relative;
    overflow: hidden;
}

.am-services .owl-dot span {background: rgba(255,255,255,.2) !important;}

.am-services .owl-dot.active span {background: var(--primary-color) !important;}

.am-services-slider-wrap {
    position: relative;
    padding: 2rem 3rem;
}

#svcPrev {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
}

#svcNext {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
}

.am-owl-arr {
    background: transparent;
    color: var(--primary-color);
    width: 40px;
    height: 40px;
    border-radius: var(--radius-circle);
    border: 1px solid var(--primary-button-hover);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.25s;
}

.am-owl-arr:hover {
    background: var(--primary-color);
    color: var(--white-color);
    border-color: var(--primary-color);
}

.am-svc-item {padding: 0 6px;}

.am-svc-card {
    border-radius: 16px;
    overflow: hidden;
    position: relative;
    height: 260px;
    cursor: pointer;
    text-decoration: none;
    display: block;
    width: 100%;
}

.am-svc-card-photo {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center top;
    transition: transform 0.6s ease;
}

.am-svc-card:hover .am-svc-card-photo {transform: scale(1.06);}

.am-svc-card-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(4,13,8,.1) 0%, rgba(4,13,8,.6) 50%, rgba(4,13,8,.97) 100%);
}

.am-svc-card-line {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));
    transform: scaleX(0);
    transition: transform 0.4s ease;
    transform-origin: left;
    z-index: 3;
}

.am-svc-card:hover .am-svc-card-line {transform: scaleX(1);}

.am-svc-card-num {
    color: var(--primary-button-hover);
    font-size: 1rem;
    font-weight: 900;
    top: 14px;
    right: 14px;
    position: absolute;
    z-index: 2;
}

.am-svc-card-content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 18px;
    z-index: 2;
}

.am-svc-card-title {
    font-size: 1rem;
    font-weight: 800;
    color: var(--grey-color-light);
    margin-bottom: 4px;
    transition: color 0.3s;
}

.am-svc-card:hover .am-svc-card-title {color: var(--primary-color);}

.am-svc-card-desc {
    color: var(--grey-color-xdark);
    font-size: 1rem;
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    transition: max-height 0.4s ease, opacity 0.3s;
}

.am-svc-card-link {
    color: rgba(var(--primary-opacity), 0.7);
    font-size: 1rem;
    font-weight: 600;
    margin-top: 8px;
    display: flex;
    align-items: center;
    gap: 4px;
    transition: gap 0.2s, color 0.3s;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height 0.4s ease, opacity 0.3s, gap 0.2s;
}

.am-svc-card:hover .am-svc-card-link {
    color: var(--primary-color);
    max-height: 30px;
    opacity: 1;
    gap: 7px;
}

.am-svc-card:hover .am-svc-card-desc {
    max-height: 50px;
    opacity: 1;
}

.am-services::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(
        circle,
        rgba(86, 190, 146, 0.13) 1.5px,
        transparent 1.5px
    );
    background-size: 22px 22px;
    pointer-events: none;
    z-index: 0;
}

.am-services::after {
    content: '';
    position: absolute;
    top: -80px;
    right: -80px;
    width: 320px;
    height: 320px;
    border-radius: 50%;
    background: radial-gradient(
        circle,
        rgba(86, 190, 146, 0.12) 0%,
        transparent 70%
    );
    pointer-events: none;
    z-index: 0;
}

.am-services-spot-bottom {
    position: absolute;
    bottom: -60px;
    left: -60px;
    width: 260px;
    height: 260px;
    border-radius: 50%;
    background: radial-gradient(
        circle,
        rgba(206, 87, 75, 0.07) 0%,
        transparent 70%
    );
    pointer-events: none;
    z-index: 0;
}

.am-services-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 40px;
}

.am-services-viewall {
    color: var(--primary-color);
    font-size: 1rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 9px 20px;
    border-radius: 50px;
    border: 1px solid rgba(var(--primary-opacity), 0.2);
    text-decoration: none;
    transition: all 0.3s;
    white-space: nowrap;
}

.am-services-viewall:hover {
    background: var(--primary-color);
    color: var(--white-color);
    border-color: var(--primary-color);
}

.am-flip-card {
    height: 280px;
    perspective: 1000px;
    cursor: pointer;
    padding: 0 6px;
}

.am-flip-card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    transition: transform 0.65s cubic-bezier(0.4, 0, 0.2, 1);
    transform-style: preserve-3d;
}

@media(hover: hover) {
    .am-flip-card:hover .am-flip-card-inner {
        transform: rotateY(180deg);
    }
}

/*---------------------------------------------------
   4.B Blog Slider
-----------------------------------------------------*/
#blogs {
    background: #f2f7f4;
    padding: 2rem 0;
}

.bl-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 32px;
    gap: 20px;
}

.bl-header-right {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-bottom: 4px;
    flex-shrink: 0;
}

.bl-all-link {
    color: var(--primary-color);
    font-size: 1rem;
    font-weight: 600;
    gap: 5px;
    border-bottom: 1.5px solid var(--primary-color);
    padding-bottom: 1px;
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    white-space: nowrap;
    transition: opacity .2s;
}

.bl-all-link:hover { opacity: .75; }

.bl-nav {
    color: var(--primary-color);
    background: transparent;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1.5px solid var(--primary-color);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .2s, color .2s;
    flex-shrink: 0;
}

.bl-nav:hover {
    color: var(--white-color);
    background: var(--primary-color);
}

.bl-slide { display: none; }
.bl-slide.active { display: block; }

.bl-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    align-items: stretch;
}

.bl-hero {
    background: #0d2217;
    border-radius: 18px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    text-decoration: none;
    transition: transform .3s;
    box-shadow: 0 12px 40px rgba(0,0,0,0.12);
}

.bl-hero:hover { transform: translateY(-4px); }

.bl-hero-img {
    height: 240px;
    background-size: cover;
    background-position: center;
    position: relative;
    flex-shrink: 0;
}

.bl-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, transparent 30%, rgba(0,0,0,0.5));
}

.bl-hero-top-bar {
    background: var(--primary-color);
    height: 3px;
    top: 0; left: 0; right: 0;
    position: absolute;
}

.bl-hero-badge {
    color: var(--white-color);
    background: var(--primary-color);
    font-size: .8rem;
    padding: 4px 10px;
    border-radius: 100px;
    font-weight: 600;
    position: absolute;
    top: 14px; left: 14px;
}

.bl-hero-views {
    color: var(--white-color);
    background: var(--primary-shadow-hover);
    font-size: .9rem;
    padding: 4px 9px;
    border-radius: var(--radius-xl);
    position: absolute;
    bottom: 12px;
    right: 14px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.bl-hero-body {
    padding: 22px;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.bl-hero-label {
    color: var(--primary-color-light);
    font-size:1rem;
    font-weight: 600;
    margin-bottom: 10px;
}

.bl-hero-title {
    color: var(--grey-color-light);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.4;
    margin-bottom: 10px;
}

.bl-hero-title:hover{color: var(--primary-color);}

.bl-hero-excerpt {
    color: var(--grey-color-dark);
    font-size: .99rem;
    line-height: 1.5;
    flex: 1;
    margin-bottom: 14px;
}

.bl-hero-meta {
    color: var(--grey-color-light);
    font-size: .9rem;
    gap: 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.bl-hero-meta span:first-child {
    background-color: var(--primary-shadow);
    border-radius: 20px;
    padding: 4px 10px;
}

.bl-hero-meta svg { margin-right:4px; vertical-align: -1px; flex-shrink: 0; }

.bl-hero-readmore {
    color: var(--primary-color-light);
    font-weight: 600;
    font-size: .9rem;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
    transition: all .2s ease;
}

.bl-hero-readmore:hover{
    color: var(--grey-color-light);
    background-color: var(--primary-shadow);
    padding: 4px 10px;
    border-radius: 20px;
}

.bl-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.bl-item {
    background: var(--white-color);
    padding-right: 14px;
    border: 0.5px solid var(--grey-color-light);
    gap: 14px;
    display: grid;
    grid-template-columns: 90px 1fr 24px;
    align-items: center;
    border-radius: 14px;
    overflow: hidden;
    text-decoration: none;
    transition: border-color .2s, background .2s, transform .2s;
    box-shadow: 0 4px 16px rgba(0,0,0,0.05);
}

.bl-item:hover {
    border-color: var(--primary-color);
    background: #edf8f2;
    transform: translateX(5px);
}

.bl-item-img {
    width: 90px;
    height: 90px;
    background-size: cover;
    background-position: center;
    background-color: #c0dece;
    flex-shrink: 0;
}

.bl-item-body {
    min-width: 0;
    padding: 12px 0;
}

.bl-item-title {
    color: #0d2217;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.45;
    margin-bottom: 8px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bl-item-meta {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: .8rem;
}

.bl-item-meta span:first-child {
    color: var(--primary-color);
    background: var(--primary-shadow);
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 20px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.bl-item-meta span:last-child {
    color: var(--primary-color);
    background: var(--primary-shadow);
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 20px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.bl-item-sep {color: #ccc;}

.bl-item-arrow {
    color: #ccc;
    transition: color .2s, transform .2s;
    flex-shrink: 0;
}

.bl-item:hover .bl-item-arrow {
    color: var(--primary-color);
    transform: translateX(3px);
}

.bl-dots {
    display: flex;
    gap: 6px;
    justify-content: center;
    margin-top: 24px;
}

.bl-dot {
    height: 4px;
    border-radius: 100px;
    background: #c0dace;
    border: none;
    cursor: pointer;
    transition: width .3s, background .3s;
    padding: 0;
}

.bl-dot.active { width: 28px; background: var(--primary-color); }
.bl-dot:not(.active) { width: 4px; }

/* ── RESPONSIVE ── */
@media (max-width: 900px) {
    #blogs { padding: 56px 0; }
    #blogs .bl-layout { grid-template-columns: 1fr; gap: 16px; }
    #blogs .bl-hero-img { height: 200px; }
}

@media (max-width: 600px) {
    #blogs { padding: 44px 0; }
    #blogs .bl-header { flex-direction: column; align-items: flex-start; }
    #blogs .bl-item { grid-template-columns: 72px 1fr 20px; gap: 10px; }
    #blogs .bl-item-img { width: 72px; height: 72px; }
}

/*---------------------------------------------------
   4.C Memberships Slider
-----------------------------------------------------*/
#memberships{
	background: var(--color-membership-bg);
	padding: 3rem 0;
}

.membership-card {
	background:var(--white-color);
	text-align: center;
	border-radius:0;
	padding:36px 20px;
	position:relative;
	z-index:1;
	transition:var(--transition-all-medium);
}
.membership-card::before {
	background:var(--color-membership-bg);
	border-radius: inherit;
	position:absolute;
	content:"";
	width:100%;
	height:0;
	bottom:0;
	left:0;
	z-index:-1;
	transition:.6s;
}
.membership-card:hover {
	-webkit-box-shadow:0 15px 25px rgba(35,47,85,0.1);
	box-shadow:0 15px 25px rgba(35,47,85,0.1)
}
.membership-card:hover::before {
	height:100%;
}

.membership-card .membership-logo {margin-bottom:25px;}
.membership-card .membership-logo img {
	width: 100%;
	max-width: 85px;
	height: auto;
	object-fit: contain;
	display: block;
	margin: 0 auto;
}
.membership-card .membership-title a {
	color:var(--color-heading);
	font-size:1.125rem;
	font-weight:500;
	line-height: 1.2;
	min-height: 48px;
	margin-bottom:0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	transition:all var(--transition-fast);
}
.membership-card:hover .membership-title a {
	color:var(--primary-color);
}

.sms-code-inputs .code-input {
    font-size: 1.375rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--grey-color);
    width: 46px;
    height: 54px;
    box-shadow: none;
    padding: 0;
}
.sms-code-inputs .code-input:hover{border-color: var(--primary-color);}
.sms-code-inputs .code-input:focus {
    outline: none;
    border-color: var(--primary-color);
    box-shadow: 0 6px 18px rgba(var(--grey-color),0.08);
}

.circular-progress {
    position: relative;
    width: 80px;
    height: 80px;
    margin: auto;
}
.circular-svg {
    transform: rotate(-90deg);
    width: 100%;
    height: 100%;
}
.circular-bg {
    fill: none;
    stroke: var(--grey-color);
    stroke-width: 2.75;
}
.circular-bar {
    fill: none;
    /*stroke: #0d6efd;*/
    stroke-width: 2.75;
    stroke-linecap: round;
    stroke-dasharray: 100,100;
    stroke-dashoffset: 0;
    transition: stroke-dashoffset 1s linear;
}
.circular-text {
    font-size: 1rem;
    font-weight: 500;
    color: var(--black-color);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.resend-btn {
    background: linear-gradient(90deg, rgba(var(--primary-opacity),.6), var(--primary-color));
    color: var(--white-color);
    font-weight: 500;
    font-size: 1rem;
    border: none;
    border-radius: var(--radius-xl);
    padding: 8px 16px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}
.resend-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}
.resend-btn:hover:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0,0,0,0.15);
}

/*===================================================
   END OF SLIDER (CAROUSEL)
=====================================================*/

/*===================================================
   5. MAIN CONTENT
=====================================================*/

/*---------------------------------------------------
   5.A About Us
-----------------------------------------------------*/
.am-about {
    background: #f0f7f4;
    padding: 120px 0;
    position: relative;
    overflow: hidden;
}

.am-about-badge .anka {
    color: var(--secondary-color);
    font-size: 1rem;
    font-weight: 800;
}

.am-about::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(var(--primary-opacity), 0.2) 30%, rgba(206,87,75,.2) 70%, transparent);
}

.am-about::after {
    content: '';
    position: absolute;
    bottom: -80px;
    right: -80px;
    width: 300px;
    height: 300px;
    border-radius: 50%;
    border: 1px solid rgba(var(--primary-opacity), 0.08);
    pointer-events: none;
}

.am-about-deco {
    position: absolute;
    bottom: -40px;
    right: -40px;
    width: 180px;
    height: 180px;
    border-radius: 50%;
    border: 1px solid rgba(var(--primary-opacity), 0.06);
    pointer-events: none;
}

.am-about-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
    position: relative;
    z-index: 2;
}

.am-about-left {
    position: relative;
    height: 460px;
}

.am-about-photo {
    position: absolute;
    inset: 0;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0,0,0,.12);
    z-index: 2;
}

.am-about-left:hover .am-about-photo {
    overflow: hidden;
}

.am-about-photo-img {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center top;
    transition: transform 0.6s ease;
    border-radius: 16px;
}
.am-about-corner-tl {
    position: absolute;
    top: -8px;
    left: -8px;
    width: 50px;
    height: 50px;
    z-index: 3;
    border-top: 3px solid var(--primary-color);
    border-left: 3px solid var(--primary-color);
    border-radius: 6px 0 0 0;
    transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.am-about-corner-br {
    position: absolute;
    bottom: -8px;
    right: -8px;
    width: 50px;
    height: 50px;
    z-index: 3;
    border-bottom: 3px solid var(--secondary-color);
    border-right: 3px solid var(--secondary-color);
    border-radius: 0 0 6px 0;
    transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.am-about-left:hover .am-about-corner-tl {
    width: 70px;
    height: 70px;
    border-color: var(--primary-color-dark);
    /* box-shadow: -2px -2px 12px var(--primary-shadow);*/
}

.am-about-left:hover .am-about-corner-br {
    width: 70px;
    height: 70px;
    border-color: var(--secondary-color-dark);
    /*  box-shadow: 2px 2px 12px var(--secondary-shadow);*/
}

.am-about-left:hover .am-about-float {
    transform: translateY(-5px) scale(1.05);
    box-shadow: 0 12px 32px var(--primary-shadow-hover);
}

.am-about-left:hover .am-about-float2 {
    transform: translateY(-4px) scale(1.05);
    box-shadow: 0 8px 24px var(--secondary-shadow-hover);
}

.am-about-left:hover .am-about-badge {
    background: rgba(var(--primary-opacity), 0.25);
    border-color: rgba(var(--primary-opacity), 0.5);
}

.am-about-left:hover .am-about-photo-img {transform: scale(1.04);}

.am-about-float {transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);}

.am-about-float2 {transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);}

.am-about-photo:hover .am-about-photo-img {transform: scale(1.04);}

.am-about-left::before {
    content: '';
    position: absolute;
    top: -40px;
    left: -40px;
    width: 220px;
    height: 220px;
    background-image: radial-gradient(circle, rgba(var(--primary-opacity), 0.28) 2px, transparent 2px);
    background-size: 14px 14px;
    z-index: 0;
}

.am-about-left::after {
    content: '';
    position: absolute;
    bottom: -30px;
    right: -30px;
    width: 220px;
    height: 220px;
    background-image: radial-gradient(circle, rgba(206,87,75,.2) 2px, transparent 2px);
    background-size: 14px 14px;
    z-index: 0;
}

.am-about-photo-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(
        180deg,
        rgba(4, 20, 12, 0.15)  0%,
        transparent             38%,
        rgba(4, 20, 12, 0.80) 100%
    );
}

.am-about-photo-overlay::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(var(--primary-opacity), 0.09); /* #56be92 @ %9 */
    mix-blend-mode: multiply;
}
.am-about-photo-overlay::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(
        ellipse at 50% 45%,
        transparent              42%,
        rgba(4, 20, 12, 0.28)   72%,
        rgba(4, 20, 12, 0.52)  100%
    );
}

.am-about-badge {z-index: 3;}

.am-about-badge {
    color: var(--primary-color);
    font-size: .9rem;
    font-weight: 700;
    padding: 4px 12px;
    position: absolute;
    top: 16px;
    left: 16px;
    background: rgba(var(--primary-opacity), 0.12);
    border: 1px solid rgba(var(--primary-opacity), 0.25);
    border-radius: 20px;
    z-index: 3;
    backdrop-filter: blur(8px);
}

.am-about-float {
    background: var(--white-color);
    position: absolute;
    bottom: 65px;
    right: -20px;
    border-radius: 14px;
    padding: 14px 18px;
    box-shadow: 0 8px 32px rgba(var(--primary-opacity), 0.15);
    z-index: 3;
    border: 1px solid rgba(var(--primary-opacity), 0.1);
}

.am-about-float-n {
    color: var(--primary-color);
    font-size: 1.5rem;
    font-weight: 900;
    line-height: 1;
}

.am-about-float-l {
    color: var(--secondary-color);
    font-size: 1rem;
    font-weight: 600;
    margin-top: 3px;
}

.am-about-float2 {
    background: #071410;
    position: absolute;
    top: 20px;
    right: -14px;
    border-radius: 12px;
    padding: 10px 14px;
    z-index: 3;
    box-shadow: 0 8px 24px rgba(0,0,0,.15);
}

.am-about-float2-n {
    color: var(--white-color);
    font-size: 1.3rem;
    font-weight: 900;
    line-height: 1;
}

.am-about-float2-l {
    color: rgba(255,255,255,.3);
    font-size: 0.438rem;
    margin-top: 3px;
}

.am-about-right {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.am-about-pre {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 18px;
}

.am-about-pre-dot {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--primary-color-dark);
    animation: amBlink 2s infinite;
    flex-shrink: 0;
}

.am-about-pre-line {
    width: 20px;
    height: 1px;
    background: rgba(var(--primary-opacity), 0.4);
    flex-shrink: 0;
}

.am-about-pre-t {
    font-size: 0.563rem;
    color: var(--primary-color-dark);
    font-weight: 700;
    text-transform: uppercase;
}

.am-about-h {
    font-size: 2.25rem;
    font-weight: 900;
    color: #071410;
    line-height: 1.15;
    margin-bottom: 14px;

}

.am-about-h em {
    color: var(--primary-color-dark);
    font-style: normal;
}

.am-about-h strong {color: var(--secondary-color);}

.am-about-p {
    color: var(--black-color);
    font-size: 1rem;
    line-height: 1.8;
    padding: 2rem 0;
    margin: 0px;
}

.am-about-btns {
    display: flex;
    align-items: center;
    gap: 12px;
}

.am-about-btn1 {
    background: linear-gradient(135deg, var(--primary-color), var(--primary-color-dark));
    color: var(--white-color);
    font-size: .9rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 12px 24px;
    border-radius: 50px;
    text-decoration: none;
    transition: all 0.3s;
    box-shadow: 0 4px 16px var(--primary-shadow);
}

.am-about-btn1:hover {
    color: var(--white-color);
    transform: scale(1.05);
    box-shadow: 0 6px 20px var(--primary-shadow-hover);
}

.am-about-btn2 {
    background: rgba(255,255,255,.7);
    color: var(--primary-color-dark);
    font-size: .9rem;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    border-radius: 50px;
    border: 1px solid rgba(var(--primary-opacity), 0.25);
    text-decoration: none;
    transition: all 0.3s;
}

.am-about-btn2:hover {
    color: var(--primary-color);
    border-color: var(--primary-border-color);
    background: var(--white-color);
}

.am-about-play-ico {
    background: var(--primary-color);
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.am-about-play-tri {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 0 4px 7px;
    border-color: transparent transparent transparent var(--white-color);
    margin-left: 1px;
}

.am-about-stats {
    display: flex;
    gap: 24px;
    margin-top: 28px;
    padding-top: 24px;
    border-top: 1px solid rgba(var(--primary-opacity), 0.15);
}

.am-about-stat-n {
    font-size: 1.5rem;
    font-weight: 900;
    color: var(--primary-color-dark);
    line-height: 1;
}

.am-about-stat-n.coral {color: var(--secondary-color);}

.am-about-stat-l {
    color: var(--grey-color-deep);
    font-size: 1rem;
    font-weight: 600;
    margin-top: 4px;
}

@media(max-width:1023px) {
    .am-about { padding: 60px 0; }
    .am-about-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    .am-about-left { height: 320px; }
    .am-about-float { right: 20px; }
    .am-about-float2 { right: 14px; }
    .am-about-h { font-size: 1.75rem; }
}

@media(max-width:599px) {
    .am-about { padding: 40px 0; }
    .am-about-left { height: 260px; }
    .am-about-h { font-size: 1.5rem; }
    .am-about-btns { flex-wrap: wrap; }
    .am-about-btn1,
    .am-about-btn2 { width: 100%; justify-content: center; }
    .am-about-stats { gap: 16px; }
}
/*--------------------- HAKKIMIZDA DETAY----------------*/
#aboutus-details-content {padding: 60px 0;}

.about-premium {
    border-radius: 24px;
    overflow: hidden;
    border: 1px solid var(--grey-color-light);
    box-shadow: 0 4px 40px rgba(26, 42, 74, .12);
}

.abp-hero {
    background: linear-gradient(160deg, #071410 0%, #0a1a12 60%, #0d2218 100%);
    display: grid;
    grid-template-columns: 1fr 360px;
    min-height: 320px;
    position: relative;
    overflow: hidden;
}

.abp-hero-deco {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}
.abp-hero-deco--1 {
    width: 420px;
    height: 420px;
    border: 10px solid var(--primary-shadow);
    top: -130px;
    left: -90px;
}
.abp-hero-deco--2 {
    width: 240px;
    height: 240px;
    border: 20px solid var(--primary-shadow);
    bottom: -70px;
    left: 300px;
}

.abp-hero-left {
    padding: 44px 52px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    z-index: 1;
}

.abp-kicker {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
}
.abp-kicker-bar {
    display: block;
    width: 22px;
    height: 2px;
    background: var(--primary-color);
    flex-shrink: 0;
}
.abp-kicker-txt {
    color: var(--primary-color);
    font-size: 1rem;
    font-weight: 700;
}

.abp-title {
    color: var(--grey-color-deep);
    font-size: 1rem;
    font-weight: 700;
    margin: 0 0 6px;
}

.abp-name {
    color: var(--white-color);
    font-size: 2.6rem;
    font-weight: 900;
    line-height: 1.1;
    margin: 0 0 12px;
}
.abp-name em {
    font-style: normal;
    color: var(--primary-color);
}

.abp-role {
    font-size: 13px;
    color: rgba(255, 255, 255, .45);
    font-weight: 500;
    margin: 0 0 20px;
}

/* Bottom row */
.abp-bottom-row {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: nowrap;
}

.abp-vdiv {
    width: 1px;
    height: 34px;
    background: rgba(255, 255, 255, .12);
    flex-shrink: 0;
}

.abp-glass-block {
    display: flex;
    align-items: stretch;
    background: rgba(255, 255, 255, .06);
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 12px;
    overflow: hidden;
    flex-shrink: 0;
}
.abp-glass-item {
    padding: 8px 16px;
    border-right: 1px solid rgba(255, 255, 255, .08);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    transition: background .2s;
}
.abp-glass-item:last-child { border-right: none; }
.abp-glass-item:hover { background-color: var(--primary-shadow); }
.abp-glass-item--red {
    background: rgba(var(--primary-opacity), .18);
    border-right: 1px solid rgba(var(--primary-opacity), .2);
}
.abp-glass-item--red:hover { background: rgba(var(--primary-opacity), .25); }

.abp-glass-n {
    color: var(--white-color);
    font-size: 1.3rem;
    font-weight: 900;
    line-height: 1;
    display: block;
    white-space: nowrap;
}
.abp-glass-item--red .abp-glass-n { color: var(--primary-color); }
.abp-glass-l {
    font-size: .9rem;
    font-weight: 600;
    color: var(--grey-color-xdark);
    display: block;
    white-space: nowrap;
}

.abp-socials {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.abp-si {
    color: var(--white-color);
    font-size: .9rem;
    font-weight: 700;
    width: 35px;
    height: 35px;
    border-radius: 9px;
    border: 1px solid var(--primary-shadow-hover);
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: background .2s, border-color .2s, color .2s;
}
.abp-si:hover {
    color: var(--white-color);
    background: var(--primary-color);
    border-color: var(--primary-color);
}
.abp-si svg,
.abp-si i { width: 16px; height: 16px; font-size: 1rem; }

.abp-hero-right {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding: 0 40px;
    position: relative;
    z-index: 1;
}
.abp-photo-wrap {
    background: rgba(255, 255, 255, .05);
    width: 280px;
    height: 360px;
    border-radius: 16px 16px 0 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .12);
    border-bottom: none;
    flex-shrink: 0;
    position: relative;
}
.abp-photo-wrap::before {
    content: '';
    position: absolute;
    left: 0; top: 0;
    width: 4px; height: 100%;
    background: var(--primary-color);
    z-index: 2;
}
.abp-photo-wrap a { display: block; width: 100%; height: 100%; }
.abp-photo-img {
    width: 100%; height: 100%;
    object-fit: cover;
    object-position: top center;
    display: block;
    transition: transform .5s ease;
}
.abp-photo-wrap:hover .abp-photo-img { transform: scale(1.04); }
.abp-photo-placeholder {
    width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
    font-size: 48px; font-weight: 900;
    color: rgba(255, 255, 255, .07);
}

.abp-quote-band {
    background: var(--white-color)fff;
    border-top: 3px solid var(--primary-color);
    border-bottom: 1px solid var(--grey-color-light);
    padding: 26px 52px;
    display: flex;
    align-items: center;
    gap: 18px;
}
.abp-quote-mark {
    color: var(--primary-color);
    font-size: 72px;
    font-weight: 900;
    line-height: .65;
    opacity: .18;
    flex-shrink: 0;
    margin-top: -6px;
}
.abp-quote-txt {
    color: var(--color-footer-top);
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.45;
    font-style: italic;
    margin: 0;
}

.abp-body {
    background: var(--white-color);
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
}

.abp-col-label {
    color: var(--grey-color);
    font-size: 1.3rem;
    font-weight: 700;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.abp-col-label::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--grey-color-light);
}

.abp-bio-col {
    padding: 40px 44px;
    border-right: 1px solid var(--grey-color-light);
}
.abp-bio {
    font-size: 1rem;
    color: var(--color-text);
    line-height: 1.9;
}
.abp-bio p { margin: 0 0 16px; }
.abp-bio p:last-child { margin-bottom: 0; }
.abp-bio strong,
.abp-bio b { color: var(--black-color); font-weight: 700; }

.abp-skills-col { padding: 40px 40px; }
.abp-skills-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
.abp-skill-card {
    background: var(--grey-color-xlight);
    border-radius: 12px;
    padding: 14px 16px;
    border: 1px solid var(--grey-color-light);
    border-top: 3px solid var(--primary-color);
    transition: transform .2s ease, border-top-color .2s ease, box-shadow .2s ease;
    cursor: default;
}
.abp-skill-card:hover {
    transform: translateY(-3px);
    border-top-color: var(--color-footer-top);
    box-shadow: 0 6px 20px rgba(26, 42, 74, .09);
}
.abp-skill-name {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 700;
    margin: 0 0 3px;
    line-height: 1.3;
}
.abp-skill-sub { color: var(--grey-color-xxdark); font-size: .9rem; margin: 0; }

.abp-stats-new {
    background: #f0f7f4;
    border-top: 3px solid var(--primary-color);
    border-radius: 0 0 24px 24px;
    overflow: hidden;
}

.abp-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}

.abp-stat-cell:last-child .abp-stat-sub {
    font-size: .9rem;
    line-height: 1.4;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.abp-stat-cell {
    padding: 30px 20px 26px;
    text-align: center;
    position: relative;
    transition: background .2s;
    cursor: default;
}
.abp-stat-cell::after {
    content: '';
    position: absolute;
    right: 0; top: 20%; bottom: 20%;
    width: 1px;
    background: var(--primary-shadow-hover);
}
.abp-stat-cell:last-child::after { display: none; }
.abp-stat-cell:hover { background: rgba(var(--primary-opacity), .05); }

.abp-stat-icon {
    width: 50px;
    height: 50px;
    border-radius: 10px;
    background: var(--primary-color-extra-light);
    border: 1px solid var(--primary-color);
    display: flex; align-items: center; justify-content: center;
    margin: 0 auto 14px;
    transition: background .2s, border-color .2s;
}
.abp-stat-cell:hover .abp-stat-icon {
    background: rgba(var(--primary-opacity), .18);
    border-color: rgba(var(--primary-opacity), .50);
}
.abp-stat-icon svg {
    width: 25px;
    height: 25px;
    stroke: var(--primary-color);
    fill: none;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.abp-stat-number {
    color: var(--primary-color-dark);
    font-size: 28px;
    font-weight: 600;
    line-height: 1;
    margin-bottom: 5px;
    transition: color .2s;
}
.abp-stat-cell:hover .abp-stat-number { color: var(--primary-color-light); }
.abp-stat-number sup {
    font-size: 2rem;
    font-family: inherit;
    font-weight: 600;
    top: -6px;
}

.abp-stat-title {
    color: var(--black-color);
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 3px;
}
.abp-stat-sub {
    color: var(--primary-color-dark);
    font-size: 1rem;
    font-weight: 400;
}

.abp-cta-bar {
    border-top: 1px solid var(--primary-shadow-hover);
    padding: 18px 36px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    background: #f0f7f4;
}
.abp-cta-left {
    display: flex;
    align-items: center;
    gap: 10px;
}
.abp-cta-dot {
    width: 8px; height: 8px;
    border-radius: 50%;
    background: #4caf80;
    box-shadow: 0 0 0 3px rgba(76, 175, 128, .15);
    flex-shrink: 0;
}
.abp-cta-text {
    font-size: 1rem;
    color: var(--color-text);
    font-weight: 400;
}
.abp-cta-text strong {
    color: var(--color-text);
    font-size: 1rem;
    font-weight: 600;
}

.abp-cta-right { display: flex; gap: 8px; align-items: center; }

.abp-cta-btn {
    padding: 10px 20px;
    border-radius: var(--radius-xl);
    font-size: .9rem;
    font-weight: 600;
    cursor: pointer;
    transition: all .2s;
    border: 1px solid;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    text-decoration: none;
    line-height: 1;
    white-space: nowrap;
}
.abp-cta-btn svg {
    width: 13px; height: 13px;
    stroke: currentColor;
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
    flex-shrink: 0;
}

.abp-cta-btn--ghost {
    color: var(--primary-color-dark);
    background: transparent;
    border-color: var(--primary-color-dark);
}
.abp-cta-btn--ghost:hover {
    color: var(--white-color);
    background: var(--primary-color-dark);
}
.abp-cta-btn--primary {
    background: var(--primary-color);
    border-color: var(--primary-color);
    color: var(--white-color);
}
.abp-cta-btn--primary:hover {
    background: var(--primary-color-dark);
    border-color: var(--primary-color-dark);
    transform: translateY(-1px);
}

.abp-skills-col {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.abp-info-section {
    padding: 16px 0;
    border-bottom: 0.5px solid var(--primary-color-extra-light);
}

.abp-info-section:first-child {padding-top: 0;}

.abp-info-section:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.abp-info-section-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
}

.abp-info-icon {
    width: 45px;
    height: 45px;
    border-radius: 7px;
    background: var(--primary-color-extra-light);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.abp-info-icon i {
    color: var(--primary-color-dark);
    font-size: 1.3rem;
}

.abp-info-name {
    color: var(--black-color);
    font-size: 1.1rem;
    font-weight: 600;
}

.abp-info-count {
    color: var(--primary-color-dark);
    font-size: .9rem;
    font-weight: 500;
    margin-left: auto;
    border: 0.5px solid var(--primary-color-light);
    padding: 2px 10px;
    border-radius: 20px;
}

.abp-info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 6px;
}

.abp-info-card {
    padding: 8px 12px;
    border-radius: 8px;
    border: 0.5px solid var(--primary-color-extra-light);
    border-left: 2px solid var(--primary-color);
}

.abp-info-card--gray {
    background: var(--white-color);
    border-left: 2px solid var(--primary-color-dark);
}

.abp-info-card-name {
    color: var(--primary-color-dark);
    font-size: .9rem;
    font-weight: 500;
    line-height: 1.4;
}

.abp-info-card--gray .abp-info-card-name {color: var(--primary-color-dark);}

.abp-info-card-sub {
    color: var(--secondary-color-dark);
    font-size: .9rem;
    margin-top: 2px;
    line-height: 1.4;
}

.abp-info-card {
    transition: all 0.2s;
    cursor: default;
}

.abp-info-card:hover {
    background: var(--primary-color-extra-light);
    border-left-color: var(--primary-color-dark);
    transform: translateY(-1px);
}

.abp-info-card--gray:hover {
    background: var(--primary-color-extra-light);
    border-left-color: var(--primary-color);
}

.abp-info-grid--2col {grid-template-columns: repeat(2, 1fr);}

@media (max-width: 480px) {
    .abp-info-grid--2col {grid-template-columns: 1fr;}
}

.abp-info-edu-list {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.abp-info-edu-item {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 8px 0;
    border-bottom: 0.5px solid var(--primary-color-extra-light);
}

.abp-info-edu-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.abp-info-edu-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--primary-color);
    flex-shrink: 0;
    margin-top: 5px;
}

.abp-info-edu-year {
    font-size: .9rem;
    font-weight: 500;
    color: var(--primary-color);
    min-width: 40px;
    flex-shrink: 0;
}

.abp-info-edu-field {
    color: var(--black-color);
    font-size: .9rem;
    font-weight: 500;
    line-height: 1.4;
}

.abp-info-edu-uni {
    color: var(--black-color);
    font-size: .9rem;
    margin-top: 2px;
}

@media (max-width: 1199px) {
    .abp-info-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 991px) {
    .abp-body {grid-template-columns: 1fr !important;}
    .abp-info-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 767px) {
    .abp-info-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 480px) {
    .abp-info-grid { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════════ */
@media (max-width: 1399px) {
    .abp-glass-item { padding: 7px 14px; }
    .abp-glass-n { font-size: 13px; }
}

@media (max-width: 1199px) {
    .abp-hero { grid-template-columns: 1fr 260px; }
    .abp-hero-left { padding: 36px 36px; }
    .abp-name { font-size: 2rem; }
    .abp-photo-wrap { width: 210px; height: 268px; }
    .abp-glass-item { padding: 7px 12px; }
    .abp-glass-n { font-size: 13px; }
    .abp-glass-l { font-size: 7px; }
}

@media (max-width: 991px) {
    .abp-hero { grid-template-columns: 1fr auto; min-height: auto; }
    .abp-hero-left { padding: 28px 28px; }
    .abp-hero-right { padding: 0 24px; align-items: flex-end; }
    .abp-photo-wrap { width: 170px; height: 218px; }
    .abp-name { font-size: 1.8rem; }
    .abp-bottom-row { flex-wrap: nowrap; gap: 8px; }
    .abp-vdiv { height: 26px; }
    .abp-glass-item { padding: 6px 10px; }
    .abp-glass-n { font-size: 12px; }
    .abp-glass-l { font-size: 6px; }
    .abp-quote-band { padding: 18px 28px; }
    .abp-quote-txt { font-size: 1.2rem; }
    .abp-body { grid-template-columns: 1fr; }
    .abp-bio-col { padding: 32px 28px; border-right: none; border-bottom: 1px solid var(--grey-color-light); }
    .abp-skills-col { padding: 32px 28px; }

    .abp-stats-grid { grid-template-columns: repeat(2, 1fr); }
    .abp-stat-cell:nth-child(2)::after { display: none; }
    .abp-stat-cell:nth-child(3),
    .abp-stat-cell:nth-child(4) { border-top: 1px solid var(--color-footer-divider); }

    .abp-cta-bar { flex-direction: column; align-items: flex-start; padding: 16px 24px; gap: 12px; }
    .abp-cta-right { width: 100%; }
    .abp-cta-btn { flex: 1; justify-content: center; }
}

@media (max-width: 767px) {
    .abp-hero { grid-template-columns: 1fr auto; }
    .abp-hero-left { padding: 24px 22px; }
    .abp-hero-right { padding: 0 18px; align-items: flex-end; }
    .abp-photo-wrap { width: 130px; height: 168px; }
    .abp-name { font-size: 1.5rem; }
    .abp-role { font-size: 11px; margin-bottom: 12px; }
    .abp-bottom-row { flex-wrap: wrap; gap: 8px; }
    .abp-vdiv { display: none; }
    .abp-glass-block { width: 100%; }
    .abp-glass-item { flex: 1; padding: 7px 10px; }
    .abp-glass-n { font-size: 12px; }
    .abp-glass-l { font-size: 6.5px; }
    .abp-quote-band { padding: 16px 22px; gap: 10px; }
    .abp-quote-mark { font-size: 52px; }
    .abp-quote-txt { font-size: 1rem; }
    .abp-bio-col { padding: 26px 22px; }
    .abp-skills-col { padding: 26px 22px; }
    .abp-stat-cell { padding: 22px 14px 18px; }
    .abp-stat-number { font-size: 22px; }
    .abp-stat-title { font-size: 11px; }
    .abp-stat-sub { font-size: 8.5px; }
}

@media (max-width: 575px) {
    #aboutus-details-content { padding: 28px 0; }
    .about-premium { border-radius: 16px; }
    .abp-hero { grid-template-columns: 1fr; min-height: auto; }
    .abp-hero-left { padding: 20px 18px 16px; }
    .abp-hero-right { padding: 0 18px; justify-content: flex-start; align-items: flex-end; }
    .abp-photo-wrap { width: 140px; height: 180px; }
    .abp-name { font-size: 1.4rem; letter-spacing: 0; }
    .abp-role { font-size: 10px; margin-bottom: 12px; }
    .abp-si { width: 28px; height: 28px; border-radius: 7px; }
    .abp-si svg { width: 11px; height: 11px; }
    .abp-bottom-row { flex-wrap: wrap; gap: 7px; }
    .abp-vdiv { display: none; }
    .abp-glass-block { width: 100%; border-radius: 9px; }
    .abp-glass-item { flex: 1; padding: 6px 7px; min-width: 0; }
    .abp-glass-n { font-size: 11px; }
    .abp-glass-l { font-size: 6px; }
    .abp-quote-band { padding: 13px 18px; gap: 8px; }
    .abp-quote-mark { font-size: 42px; }
    .abp-quote-txt { font-size: .9rem; }
    .abp-bio-col { padding: 20px 18px; }
    .abp-skills-col { padding: 20px 18px; }
    .abp-skills-grid { grid-template-columns: 1fr; gap: 8px; }
    .abp-skill-card { padding: 11px 13px; }
    .abp-stats-new { border-radius: 0 0 16px 16px; }
    .abp-stats-grid { grid-template-columns: repeat(2, 1fr); }
    .abp-stat-cell { padding: 18px 10px 14px; }
    .abp-stat-icon { width: 32px; height: 32px; border-radius: 8px; margin-bottom: 10px; }
    .abp-stat-icon svg { width: 14px; height: 14px; }
    .abp-stat-number { font-size: 20px; }
    .abp-stat-title { font-size: 10.5px; }
    .abp-stat-sub { font-size: 8px; letter-spacing: .12em; }
    .abp-cta-bar { padding: 14px 16px; }
    .abp-cta-text { font-size: 11px; }
    .abp-cta-btn { font-size: 10px; padding: 9px 14px; }
}

/*---------------------------------------------------
   5.C Services
-----------------------------------------------------*/


/*---------------------------------------------------
   5.C Our Staff
-----------------------------------------------------*/
.am-team {
    background: #f0f7f4;
    padding: 2rem 0;
    position: relative;
    overflow: hidden;
}

.am-team::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(var(--primary-opacity), 0.2) 40%, var(--secondary-shadow) 60%, transparent);
}

.am-team::after {
    content: '';
    position: absolute;
    bottom: -80px;
    right: -80px;
    width: 280px;
    height: 280px;
    border-radius: 50%;
    border: 1px solid rgba(var(--primary-opacity), 0.08);
    pointer-events: none;
}

.am-team-deco {
    position: absolute;
    top: -60px;
    left: -60px;
    width: 200px;
    height: 200px;
    border-radius: 50%;
    border: 1px solid rgba(var(--primary-opacity), 0.06);
    pointer-events: none;
}

.am-team-head {
    text-align: center;
    margin-bottom: 48px;
    position: relative;
    z-index: 2;
}

.am-team-head .am-section-tag {
    justify-content: center;
    margin-bottom: 12px;
}

.am-team-title {
    color: #071410;
    font-size: 2.25rem;
    font-weight: 900;
    line-height: 1.1;
    margin-bottom: 10px;
    font-family: var(--primary-font);
}

.am-team-sub {font-size: 1rem; color: var(--grey-color-xdark);}

.am-team-slider-wrap {
    position: relative;
    padding: 2rem 0;
    position: relative;
    z-index: 2;
}
.am-services-slider-wrap {position: relative; z-index: 5;}

.am-owl-arr {pointer-events: auto;}

#teamPrev {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
}

#teamNext {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
}

.am-team-head {
    position: relative;
    text-align: center;
    margin-bottom: 48px;
}

.am-team-head-center {text-align: center;}

.am-team-head-nav {
    position: absolute;
    top: 25px;
    left: 50%;
    display: flex;
    gap: 6px;
    z-index: 5;
    transform: translateX(-50%);
}

@media (max-width: 768px) {
    .am-team-head-nav {
        position: absolute;
        bottom: -70px;
        left: 50%;
        transform: translateX(-50%);
        justify-content: center;
    }
}


.am-team-arr {
    background: var(--white-color);
    color: var(--primary-color);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid rgba(var(--primary-opacity), 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.25s;
    box-shadow: 0 4px 16px rgba(var(--primary-opacity), 0.1);
}

.am-team-arr:hover {
    background: var(--primary-color);
    color: var(--white-color);
    border-color: var(--primary-color);
    box-shadow: 0 4px 16px var(--primary-shadow);
}

.am-team-card {
    background: var(--white-color);
    border-radius: 20px;
    padding: 24px 16px;
    max-height: 289px;
    text-align: center;
    border: 1px solid #eee;
    transition: all 0.35s;
    cursor: pointer;
    box-shadow: 0 2px 12px rgba(0,0,0,.04);
    margin: 0 6px;
    position: relative;
    overflow: hidden;
    text-decoration: none;
    display: block;
}

.am-team-card::before {
    background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    transform: scaleX(0);
    transition: transform 0.35s ease;
    transform-origin: left;
}

.am-team-card:hover::before {transform: scaleX(1);}

.am-team-card:hover {
    border-color: var(--primary-border-color);
    box-shadow: 0 12px 40px rgba(var(--primary-opacity), 0.12);
    transform: translateY(-6px);
}

.am-team-photo-wrap {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    margin: 0 auto 16px;
    position: relative;
}

.am-team-photo {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid #eee;
    transition: border-color 0.3s;
    display: block;
}

.am-team-card:hover .am-team-photo {border-color: var(--primary-color);}

.am-team-online {
    background: var(--primary-color);
    bottom: 3px;
    right: 3px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 2px solid var(--white-color);
    position: absolute;
}

.am-team-name {
    color: var(--black-color);
    font-size: 1.2rem;
    font-weight: 800;
    margin-bottom: 4px;
    transition: color 0.3s;
}

.am-team-card:hover .am-team-name {color: var(--primary-color);}

.am-team-role {
    color: var(--grey-color-xdark);
    font-size: 1rem;
    margin-bottom: 12px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.am-team-divider {
    background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));
    width: 40px;
    height: 2px;
    border-radius: 1px;
    margin: 0 auto 12px;
    transition: width 0.35s;
}

.am-team-card:hover .am-team-divider {width: 48px;}

.am-team-exp {
    font-size: 1rem;
    color: #888;
    margin-bottom: 14px;
}

.am-team-btn {
    background: rgba(var(--primary-opacity), 0.08);
    color: var(--primary-color);
    font-size: .8rem;
    font-weight: 600;
    padding: 7px 16px;
    border-radius: 50px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 1px solid rgba(var(--primary-opacity), 0.2);
    transition: all 0.25s;
    opacity: 0;
    transform: translateY(6px);
    transition: all 0.3s;
}

.am-team-card:hover .am-team-btn {
    background: var(--primary-color);
    color: var(--white-color);
    opacity: 1;
    transform: translateY(0);
    border-color: var(--primary-color);
}

.am-team .owl-carousel {overflow: hidden;}

.am-team .owl-stage-outer {overflow: hidden; padding: 12px 0;}

.am-team .owl-nav {display: none;}

.am-team .owl-dots {text-align: center; margin-top: 24px;}

.am-team .owl-dot {display: inline-block;}

.am-team .owl-dot span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(var(--primary-opacity), 0.2) !important;
    display: block;
    margin: 0 3px;
    transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.am-team .owl-dot.active span {
    width: 18px;
    border-radius: 3px;
    background: var(--primary-color) !important;
}

@media(max-width:1023px) {
    .am-team { padding: 60px 0; }
    .am-team-title { font-size: 1.75rem; }
    .am-team-slider-wrap { padding: 0 40px; }
}

@media(max-width:599px) {
    .am-team { padding: 40px 0; }
    .am-team-title { font-size: 1.5rem; }
    .am-team-slider-wrap { padding: 0 36px; }
    .am-team-photo-wrap { width: 64px; height: 64px; }
}

/*---------------------------------------------------
   5.D Videos
-----------------------------------------------------*/
#blogs, #column, #videos {
    scroll-margin-top: 200px;
}
.am-videos {
    background: #f0f7f4;
    padding: 70px 0;
    position: relative;
    overflow: hidden;
}

.am-video-featured {box-shadow: 0 8px 32px rgba(4,13,8,.35), 0 2px 8px rgba(4,13,8,.2);}

.am-video-sm {
    box-shadow: 0 8px 32px rgba(4,13,8,.35), 0 2px 8px rgba(4,13,8,.2);
    border: 1px solid var(--primary-color);
}

.am-video-sm-thumb video,
.am-video-featured-thumb video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    pointer-events: none;
}

.am-video-sm-thumb {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
}

.am-video-sm-photo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    transition: transform 0.5s ease;
}

.am-video-sm:hover .am-video-sm-photo {transform: scale(1.06);}

.am-videos::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(var(--primary-opacity), 0.15) 40%, var(--secondary-shadow) 60%, transparent);
}

.am-videos::after {
    content: '';
    position: absolute;
    bottom: -80px;
    right: -80px;
    width: 300px;
    height: 300px;
    border-radius: 50%;
    border: 1px solid rgba(var(--primary-opacity), 0.04);
    pointer-events: none;
}

.am-videos-head {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    margin-bottom: 28px;
    position: relative;
    z-index: 2;
}

.am-videos-title {
    font-size: 2rem;
    font-weight: 900;
    color: var(--white-color);
    line-height: 1.1;
    margin-bottom: 4px;
}

.am-videos-sub {
    font-size: 1rem;
    color: rgba(255,255,255,.3);
}

.am-videos-viewall {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 18px;
    border-radius: 50px;
    border: 1px solid rgba(var(--primary-opacity), 0.2);
    color: var(--primary-color);
    font-size: 0.688rem;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s;
    font-family: var(--primary-font);
    white-space: nowrap;
    flex-shrink: 0;
}

.am-videos-viewall:hover {
    background: var(--primary-color);
    color: var(--white-color);
    border-color: var(--primary-color);
}

.am-videos-grid {
    padding: 1rem 0;
    padding-bottom: 3rem;
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 8px;
    position: relative;
    z-index: 2;
}

.am-video-featured {
    border-radius: var(--radius-xl);
    overflow: hidden;
    position: relative;
    height: 360px;
    cursor: pointer;
    text-decoration: none;
    display: block;
}

.am-video-featured-thumb {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    transition: transform 0.6s ease;
}

.am-video-featured:hover .am-video-featured-thumb {transform: scale(1.04);}

.am-video-featured-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(4,13,8,.1) 0%, rgba(4,13,8,.6) 50%, rgba(4,13,8,.97) 100%);
    z-index: 1;
}

.am-video-play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -70%);
    width: 64px;
    height: 64px;
    border-radius: 50%;
    border: 2px solid var(--white-color);
    /* background: rgba(255,255,255,.1);*/
    backdrop-filter: blur(8px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 3;
    transition: all 0.35s cubic-bezier(.34,1.56,.64,1);
}

.am-video-play::after {
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 0 10px 18px;
    border-color: transparent transparent transparent var(--white-color);
    margin-left: 4px;
}

.am-video-featured:hover .am-video-play {
    background: rgba(var(--primary-opacity), 0.25);
    transform: translate(-50%, -70%) scale(1.15);
    border-color: var(--primary-color);
}

.am-video-play-sm {
    width: 40px;
    height: 40px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -60%);
}

.am-video-play-sm::after {
    border-width: 6px 0 6px 11px;
    margin-left: 2px;
}

.am-video-sm:hover .am-video-play-sm {
    transform: translate(-50%, -60%) scale(1.1);
    border-color: var(--primary-color);
    background: rgba(var(--primary-opacity), 0.2);
}

.am-video-progress {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: rgba(255,255,255,.08);
    z-index: 3;
}

.am-video-progress-bar {
    height: 100%;
    background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));
    width: 0;
    transition: width 0.3s;
}

.am-video-featured:hover .am-video-progress-bar,
.am-video-sm:hover .am-video-progress-bar {width: 100%;}

.am-video-featured-content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 20px;
    z-index: 2;
}

.am-video-featured-tag {
    background: linear-gradient(135deg, var(--primary-color), var(--primary-color-dark));
    color: var(--white-color);
    font-size: .7rem;
    font-weight: 700;
    display: inline-block;
    padding: 3px 10px;
    border-radius: var(--radius-xs);
    margin-bottom: 7px;
}

.am-video-featured-title {
    font-size: 1.2rem;
    font-weight: 900;
    color: var(--white-color);
    margin-bottom: 5px;
    line-height: 1.2;
    transition: color 0.3s;
}

.am-video-featured:hover .am-video-featured-title {color: var(--primary-color);}

.am-video-featured-meta {
    font-size: 1rem;
    color: var(--grey-color-dark);
    display: flex;
    align-items: center;
    gap: 6px;
}

.am-video-featured-meta-sep {
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: rgba(255,255,255,.25);
    flex-shrink: 0;
}

.am-video-sm {
    border-radius: var(--radius-xl);
    overflow: hidden;
    position: relative;
    cursor: pointer;
    text-decoration: none;
    display: block;
    border: 1px solid rgba(255,255,255,.06);
    transition: border-color 0.3s;
}

.am-video-sm:hover {border-color: rgba(var(--primary-opacity), 0.3);}

.am-video-sm-thumb {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    transition: transform 0.5s ease;
}
/*
.am-video-sm:hover .am-video-sm-thumb {
    transform: scale(1.06);
}*/

.am-video-sm-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent, rgba(4,13,8,.92));
    z-index: 1;
}

.am-video-sm-content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 12px;
    z-index: 2;
}

.am-video-sm-title {
    color: var(--white-color);
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 3px;
    transition: color 0.3s;
}

.am-video-sm:hover .am-video-sm-title {color: var(--primary-color);}

.am-video-sm-dur {color: var(--grey-color-dark); font-size: .8rem;}

.am-video-modal {
    position: fixed;
    inset: 0;
    background: rgba(4,13,8,.95);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s;
    backdrop-filter: blur(8px);
}

.am-video-modal.active {opacity: 1; pointer-events: all;}

.am-video-modal-inner {
    width: 90%;
    max-width: 900px;
    position: relative;
}

.am-video-modal-close {
    position: absolute;
    top: -48px;
    right: 0;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.2);
    background: rgba(255,255,255,.08);
    color: var(--white-color);
    display: flex;
    align-items: center;
    justify-content:center;
    cursor: pointer;
    font-size: 18px;
    transition: all 0.2s;
}

.am-video-modal-close:hover {
    background: var(--secondary-color);
    border-color: var(--secondary-color);
}

.am-video-modal-frame {
    background: var(--black-color);
    width: 100%;
    aspect-ratio: 16/9;
    border-radius: 12px;
    overflow: hidden;
}

.am-video-modal-frame iframe {
    width: 100%;
    height: 100%;
    border: none;
}

@media(max-width:1023px) {
    .am-videos { padding: 50px 0; }
    .am-video-sm{ height: 200px; }
    .am-videos-grid {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto;
    }
    .am-video-featured { height: 240px; grid-column: 1/3; }
    .am-videos-title { font-size: 1.5rem; }
}

@media(max-width:599px) {
    .am-videos { padding: 40px 0; }
    .am-videos-head { flex-direction: column; align-items: flex-start; gap: 10px; }
    .am-videos-grid { grid-template-columns: 1fr; }
    .am-video-featured { grid-column: auto; height: 220px; }
    .am-videos-title { font-size: 1.25rem; }
    .am-video-sm { height: 160px; }
    .am-video-featured,
    .am-video-sm { box-shadow: 0 4px 16px rgba(4,13,8,.25); }
}

/*---------------------------------------------------
   5.E Feedback
-----------------------------------------------------*/
#feedback {
    background: linear-gradient(160deg, #071410 0%, #0a1a12 60%, #0d2218 100%) !important;
    padding: 3rem 0;
    position: relative;
    overflow: hidden;
}

#feedback::before, #feedback::after {
    content: '';
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    z-index: 0;
}

#feedback::before {
    top: -100px; right: -100px;
    width: clamp(200px, 30vw, 400px);
    height: clamp(200px, 30vw, 400px);
    border: 1px solid rgba(var(--primary-opacity), 0.18);
}

#feedback::after {
    top: -50px; right: -50px;
    width: clamp(120px, 18vw, 240px);
    height: clamp(120px, 18vw, 240px);
    border: 1px solid rgba(var(--primary-opacity), 0.12);
}

#feedback .fb-grid {
    padding: 2rem 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    /*gap: clamp(32px, 5vw, 72px);*/
    align-items: start;
}

#feedback .fb-left {
    padding-right: clamp(0px, 3vw, 40px);
    border-right: 1px solid rgba(255,255,255,0.07);
}

.fb-eyebrow {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
}

.fb-eyebrow-line {
    display: block;
    width: 24px; height: 1px;
    background: var(--primary-color);
    flex-shrink: 0;
}

.fb-eyebrow-text {
    color: var(--primary-color);
    font-size: 9px;
}

.fb-title {
    color: var(--white-color) !important;
    font-size: clamp(26px, 4vw, 36px);
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.5px;
    margin-bottom: 12px;
}

.fb-title-accent { color: var(--primary-color); }
.fb-desc {
    color:var(--grey-color-xdark);
    font-size: 1rem;
    line-height: 1.8;
    margin-bottom: 28px;
    max-width: 380px;
}

.fb-cards {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 28px;
}

.fb-card {
    background: rgba(255,255,255,0.045) !important;
    border: 1px solid rgba(255,255,255,0.09) !important;
    border-radius: 14px !important;
    padding: clamp(14px, 2vw, 20px) !important;
    box-shadow: none !important;
    transition: border-color .25s, background .25s;
}

.fb-card:hover {
    border-color: rgba(var(--primary-opacity), 0.28) !important;
    background: rgba(var(--primary-opacity), 0.05) !important;
}

.fb-card-top {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
}

.fb-avatar {
    color: var(--primary-color-light);
    background: rgba(var(--primary-opacity), 0.15);
    font-size: 1rem;
    font-weight: 700;
    width: 40px; height: 40px;
    border-radius: var(--radius-circle);
    border: 1px solid rgba(var(--primary-opacity), 0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.fb-card-meta {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1;
    min-width: 0;
}

.fb-card-name {
    color: var(--white-color);
    font-size: 1rem;
    font-weight: 500;
}

.fb-card-loc {
    color: var(--grey-color-dark);
    font-size: .9rem;
}

.fb-stars {
    display: flex;
    gap: 2px;
    margin-left: auto;
    flex-shrink: 0;
}

.fb-star {
    color: var(--instagram-one-color);
    font-size: 1rem;
}

.fb-card-text {
    color:var(--grey-color-xdark);
    font-size: .9rem;
    line-height: 1.75;
    font-style: italic;
    margin: 0;
}

.fb-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--primary-color) !important;
    color: var(--white-color) !important;
    font-size: 12px;
    font-weight: 500;
    padding: 12px 24px;
    border-radius: 100px;
    text-decoration: none !important;
    border: none;
    cursor: pointer;
    transition: background .25s, transform .2s;
}

.fb-btn:hover {
    background: var(--primary-button-hover) !important;
    color: var(--white-color) !important;
    transform: translateY(-1px);
}

.fb-btn:hover svg { transform: translateX(3px); }
.fb-btn svg { transition: transform .2s; flex-shrink: 0; }
.fb-right { padding-left: clamp(0px, 3vw, 40px); }
.fb-faq-label {
    color: var(--primary-color) !important;
    font-size: 2rem;
    font-weight: 800;
    margin-bottom: 18px;
    display: block;
}

.fb-accordion { display: flex; flex-direction: column; }

.fb-acc-item {
    border-bottom: 1px solid var(--primary-shadow) !important;
    background: transparent !important;
}
.fb-acc-item:first-child {border-top: 1px solid var(--primary-shadow) !important;}

.fb-acc-btn {
    width: 100%;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: clamp(14px, 2vw, 18px) 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    cursor: pointer;
    text-align: left;
}

.fb-acc-btn:focus-visible {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
    border-radius: 4px;
}
.fb-acc-q {
    color:var(--grey-color-mlight) !important;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.45;
    transition: color .25s;
}
.fb-acc-btn[aria-expanded="true"] .fb-acc-q { color: var(--white-color) !important; }

.fb-acc-icon {
    width: 26px; height: 26px;
    border-radius: 50%;
    border: 1px solid rgba(var(--primary-opacity), 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--primary-color);
    flex-shrink: 0;
    background: transparent;
    transition: background .25s, transform .3s;
}

.fb-acc-btn[aria-expanded="true"] .fb-acc-icon {
    background: rgba(var(--primary-opacity), 0.15);
    transform: rotate(45deg);
}

#feedback .fb-acc-body {
    display: grid !important;
    grid-template-rows: 0fr;
    transition: grid-template-rows .35s ease;
    background: transparent !important;
    background-color: transparent !important;
    visibility: visible !important;
    opacity: 1 !important;
    max-height: none !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: inherit !important;
}
.fb-acc-body.fb-open { grid-template-rows: 1fr; }
#feedback .fb-acc-inner {
    overflow: hidden;
    background: transparent !important;
    background-color: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    box-shadow: none !important;
}
.fb-acc-answer {
    font-size: 1rem;
    color: var(--grey-color-dark) !important;
    line-height: 1.8;
    padding-bottom: clamp(12px, 2vw, 18px);
    margin: 0;
    background: transparent !important;
}
.fb-acc-item:has(.fb-acc-btn[aria-expanded="true"]) {
    border-bottom-color: rgba(var(--primary-opacity), 0.2) !important;
}

#feedback .fb-acc-btn[aria-expanded="true"] {
    background: transparent !important;
    background-color: transparent !important;
    color: rgba(255,255,255,0.72) !important;
    box-shadow: none !important;
}

#feedback .fb-acc-body.fb-open {grid-template-rows: 1fr !important;}

@media (max-width: 900px) {
    #feedback .fb-grid { grid-template-columns: 1fr; gap: 44px; }
    .fb-left {
        padding-right: 0;
        border-right: none;
        border-bottom: 1px solid rgba(255,255,255,0.07);
        padding-bottom: 40px;
    }
    .fb-right { padding-left: 0; }
}
@media (max-width: 480px) {
    .fb-card-top { flex-wrap: wrap; }
    .fb-stars { margin-left: 0; }
}
/*---------------------------------------------------
   5.F Column
-----------------------------------------------------*/
#column {
    background: linear-gradient(160deg, #071410 0%, #0a1a12 60%, #0d2218 100%) !important;
    padding: 80px 0;
    position: relative;
    overflow: hidden;
}

#column::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 100px;
    pointer-events: none;
    z-index: 0;
}

#column::after {
    content: '';
    position: absolute;
    top: -80px; right: -80px;
    width: 340px; height: 340px;
    border-radius: 50%;
    border: 60px solid rgba(86,190,146,0.04);
    pointer-events: none;
    z-index: 0;
}

.column-deco-bottom {
    position: absolute;
    bottom: -60px; left: -60px;
    width: 260px; height: 260px;
    border-radius: 50%;
    border: 50px solid rgba(86,190,146,0.03);
    pointer-events: none;
    z-index: 0;
}

.column-dots-bg {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(
        circle,
        rgba(86,190,146,0.07) 1px,
        transparent 1px
    );
    background-size: 28px 28px;
    pointer-events: none;
    z-index: 0;
}

#koseyazilari .container {
    position: relative;
    z-index: 1;
}

.column-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 32px;
}

.column-header-left {}

.column-eyebrow {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.column-eyebrow-dot {
    background: var(--primary-color);
    width: 7px; height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
    animation: kyBlink 2s infinite;
}

@keyframes kyBlink {
    0%,100% { opacity: 1; }
    50%      { opacity: .3; }
}

.column-eyebrow-line {
    background: rgba(86,190,146,0.4);
    width: 18px;
    height: 1.5px;
    flex-shrink: 0;
}

.column-eyebrow-text {
    color: var(--primary-color);
    font-size: 1rem;
    font-weight: 700;
}


.column-wrap {
    padding:2rem 0;
    display: grid;
    grid-template-columns: 1fr 280px;
    gap: 12px;
    align-items: start;
}

.column-left {
    background: rgba(255,255,255,0.03);
    border: 0.5px solid rgba(86,190,146,0.1);
    border-radius: var(--radius-md);
    padding: 28px 24px;
    backdrop-filter: blur(8px);
    position: relative;
    overflow: hidden;
}

.column-left-dots {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(
        circle,
        rgba(86,190,146,0.06) 1px,
        transparent 1px
    );
    background-size: 20px 20px;
    pointer-events: none;
    z-index: 0;
}

.column-articles {
    display: flex;
    flex-direction: column;
    position: relative;
    z-index: 1;
}

.column-art {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 12px;
    margin: 0 -12px;
    border-bottom: 0.5px solid rgba(86,190,146,0.08);
    text-decoration: none;
    border-radius: 10px;
    transition: background .2s;
    position: relative;
}

.column-art:last-child { border-bottom: none; }

.column-art:hover {background: rgba(86,190,146,0.06);}

.column-art::before {
    content: '';
    position: absolute;
    left: 0; top: 8px; bottom: 8px;
    width: 2px;
    background: var(--primary-color);
    border-radius: 2px;
    transform: scaleY(0);
    transform-origin: bottom;
    transition: transform .25s ease;
}

.column-art:hover::before {transform: scaleY(1);}

.column-art-num {
    color: var(--primary-shadow);
    font-size: 2rem;
    font-weight: 900;
    line-height: 1;
    min-width: 32px;
    flex-shrink: 0;
}

.column-art-thumb {
    background: rgba(86,190,146,0.1);
    border: 0.5px solid rgba(86,190,146,0.15);
    width: 52px;
    height: 52px;
    border-radius: 8px;
    overflow: hidden;
    flex-shrink: 0;
}

.column-art-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s ease;
}

.column-art:hover .column-art-thumb img {transform: scale(1.08);}

.column-art-body {
    flex: 1;
    min-width: 0;
}

.column-art-cat {
    color: var(--primary-color);
    font-size: 0.9rem;
    font-weight: 700;
    margin-bottom: 3px;
    transition: color .3s ease;
}

.column-art-title {
    color: var(--grey-color-mlight);
    font-size: 0.9rem;
    font-weight: 600;
    line-height: 1.4;
    margin-bottom: 3px;
    transition: color .3s ease;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.column-art:hover .column-art-cat {color: var(--grey-color-mlight);}
.column-art:hover .column-art-title {color: var(--primary-color);}

.column-art-date {
    color:var(--grey-color-deep);
    font-size: .9rem;
}

.column-art-arrow {
    color: rgba(86,190,146,0.25);
    flex-shrink: 0;
    margin-left: auto;
    transition: color .2s, transform .25s;
}

.column-art:hover .column-art-arrow {
    color: var(--primary-color);
    transform: translateX(4px);
}

.column-empty {
    color: rgba(255,255,255,0.3);
    font-size: 1rem;
    padding: 20px 0;
}


.column-right {
    background: rgba(255,255,255,0.04);
    border: 0.5px solid rgba(86,190,146,0.12);
    border-radius: 16px;
    padding: 28px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    position: relative;
    overflow: hidden;
    backdrop-filter: blur(8px);
}

.column-right-deco-1 {
    position: absolute;
    top: -40px; right: -40px;
    width: 130px; height: 130px;
    border-radius: 50%;
    border: 1px solid var(--primary-shadow-hover);
    pointer-events: none;
}

.column-right-deco-1::after {
    content: '';
    position: absolute;
    inset: 18px;
    border-radius: 50%;
    border: 1px solid var(--primary-shadow-hover);
}

.column-right-deco-2 {
    position: absolute;
    bottom: -30px; left: -30px;
    width: 100px; height: 100px;
    border-radius: 50%;
    border: 1px solid var(--primary-shadow-hover);
    pointer-events: none;
}

.column-profile-img {
    background: rgba(86,190,146,0.1);
    width: 80px; height: 80px;
    border-radius: 50%;
    border: 2px solid var(--primary-shadow-hover);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    margin-bottom: 14px;
    box-shadow:
        0 0 0 6px rgba(86,190,146,0.06),
        0 8px 24px rgba(0,0,0,0.35);
    position: relative;
    z-index: 1;
    transition: transform .35s cubic-bezier(.34,1.56,.64,1);
}

.column-right:hover .column-profile-img {transform: scale(1.05);}

.column-profile-photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.column-profile-img:hover .column-profile-photo {transform: rotate(360deg) scale(1.15);}

.column-profile-initials {
    color: var(--primary-color);
    font-size: 22px;
    font-weight: 700;
}

.column-profile-name {
    color: var(--secondary-color);
    font-size: 1.2rem;
    font-weight: 800;
    line-height: 1.4;
    margin-bottom: 4px;
    position: relative;
    z-index: 1;
}

.column-profile-role {
    color: var(--primary-color);
    font-size: 1rem;
    margin-bottom: 20px;
    position: relative;
    z-index: 1;
}

.column-stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    width: 100%;
    margin-bottom: 16px;
    position: relative;
    z-index: 1;
}

.column-stat {
    background: rgba(86,190,146,0.06);
    border: 0.5px solid rgba(86,190,146,0.12);
    border-radius: var(--radius-md);
    padding: 12px 8px;
    transition: background .2s, border-color .2s;
}

.column-stat:hover {
    background: rgba(86,190,146,0.1);
    border-color: rgba(86,190,146,0.22);
}

.column-stat-num {
    color: var(--primary-color);
    font-size: 1.4rem;
    font-weight: 900;
    line-height: 1;
}

.column-stat-lbl {
    color: var(--grey-color);
    font-size: .9rem;
    margin-top: 4px;
}

.column-ga-badge {
    color: var(--primary-color);
    background: rgba(86,190,146,0.07);
    font-size: .9rem;
    font-weight: 600;
    padding: 8px 12px;
    border-radius: var(--radius-sm);
    width: 100%;
    border: 0.5px solid rgba(86,190,146,0.18);
    display: flex;
    align-items: center;
    gap: 6px;
    justify-content: center;
    margin-bottom: 10px;
    position: relative;
    z-index: 1;
    transition: background .2s;
}

.column-ga-badge:hover {background: rgba(86,190,146,0.12);}

.column-auto {
    color: var(--grey-color);
    font-size: .8rem;
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 16px;
    position: relative;
    z-index: 1;
}

.column-auto-dot {
    width: 6px; height: 6px;
    border-radius: 50%;
    background: var(--primary-color);
    flex-shrink: 0;
    animation: kyBlink 2s infinite;
}

.column-all-btn {
    color: var(--primary-color);
    font-size: .9rem;
    font-weight: 500;
    width: 100%;
    padding: 10px;
    border-radius: var(--radius-sm);
    border: 0.5px solid var(--primary-shadow-hover);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    text-decoration: none;
    transition: color .25s, border-color .25s, background .25s;
    position: relative;
    z-index: 1;
}

.column-all-btn:hover {
    color: var(--white-color);
    background: var(--primary-color);
    border-color: var(--primary-color-dark);
}

@media (max-width: 991px) {
    #column { padding: 60px 0; }
    .column-wrap {grid-template-columns: 1fr; gap: 10px;}
    .column-right {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 14px;
        text-align: left;
        align-items: flex-start;
        padding: 20px;
    }
    .column-stats {grid-template-columns: repeat(4, 1fr); flex: 1;}
    .column-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }
}

@media (max-width: 599px) {
    #column { padding: 40px 0; }
    .column-left { padding: 22px 16px; }
    .column-right { padding: 18px; }
    .column-stats { grid-template-columns: 1fr 1fr; }
    .column-title { font-size: 1.375rem; }
}

/*---------------------------------------------------
   5.G CTA Section
-----------------------------------------------------*/
.cta-link {
    color: var(--color-footer-top);
    border-bottom: 1px solid var(--color-footer-top);
    font-size: 1rem;
    font-weight: 600;
    margin-left: auto;
    gap: 6px;
    padding-bottom: 1px;
    text-decoration: none;
    display: flex;
    align-items: center;
    transition: color 0.2s, border-color 0.2s;
}

.cta-link:hover { color: var(--primary-color); border-color: var(--primary-color); }

.team-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 24px;
}

.team-card {
    background: var(--grey-color-xlight);
    border-radius: var(--radius-lg);
    border: 1px solid var(--grey-color-light);
    overflow: hidden;
    transition: transform 0.3s, box-shadow 0.3s;
    opacity: 0;
    transform: translateY(30px);
    cursor: pointer;
}

.team-card:nth-child(1) { animation: rise 0.6s 0.25s forwards; }
.team-card:nth-child(2) { animation: rise 0.6s 0.35s forwards; }
.team-card:nth-child(3) { animation: rise 0.6s 0.45s forwards; }
.team-card:nth-child(4) { animation: rise 0.6s 0.5s forwards; }
.team-card:nth-child(5) { animation: rise 0.6s 0.55s forwards; }
.team-card:nth-child(6) { animation: rise 0.6s 0.6s forwards; }

.team-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 48px rgba(26,26,26,0.09);
}

.card-photo {
    height: 200px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 56px;
    transition: transform 0.4s;
}

.team-card:hover .card-photo { transform: scale(1.03); }

.card-photo-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, var(--primary-color) 0%, transparent 55%);
    opacity: 0;
    transition: opacity 0.3s;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding-bottom: 16px;
    gap: 8px;
}

.team-card:hover .card-photo-overlay { opacity: 1; }

.card-photo-overlay .social-btn {
    background: rgba(255,255,255,0.15);
    border-color: rgba(255,255,255,0.4);
    color: var(--white-color);
}

.card-photo-overlay .social-btn:hover {
    background: var(--white-color);
    color: var(--color-footer-top);
}

.card-index {
    color: var(--color-footer-text);
    font-size: 2rem;
    font-weight: 700;
    position: absolute;
    top: 14px;
    right: 16px;
    line-height: 1;
}

.card-body {padding: 22px 22px 24px;}

.card-role {
    color: var(--primary-color);
    font-size: 1rem;
    font-weight: 500;
    margin-bottom: 6px;
}

.card-name {
    color: var(--color-footer-top);
    font-size: 1.4rem;
    font-weight: 700;
    margin-bottom: 12px;
    line-height: 1.2;
}

.card-divider {
    background: var(--primary-shadow-hover);
    width: 28px; height: 1.5px;
    border-radius: 2px;
    margin-bottom: 10px;
}

.card-spec {
    color: var(--black-color);
    font-size: 1rem;
    line-height: 1.6;
    font-weight: 400;
}

.bg-1 { background: linear-gradient(150deg, #f5e0dc 0%, #e8c0b8 100%); }
.bg-2 { background: linear-gradient(150deg, #dce8f0 0%, #b0cdd9 100%); }
.bg-3 { background: linear-gradient(150deg, #f0ead8 0%, #d9c88a 100%); }
.bg-4 { background: linear-gradient(150deg, #e8dff5 0%, #bfaad9 100%); }
.bg-5 { background: linear-gradient(150deg, #dcf0e4 0%, #96c9aa 100%); }
.bg-6 { background: linear-gradient(150deg, #f5e8d8 0%, #d9b890 100%); }

.bottom-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    opacity: 0;
    animation: rise 0.6s 0.65s forwards;
}

.quote-card {
    background: var(--color-footer-top);
    border-radius: var(--radius-lg);
    padding: 44px 44px 40px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.quote-card::before {
    content: '\201C';
    position: absolute;
    top: -10px; left: 24px;
    font-size: 10rem;
    color: var(--color-footer-border);
    line-height: 1;
}

.quote-card::after {
    content: '';
    position: absolute;
    bottom: -40px; right: -40px;
    width: 160px; height: 160px;
    border-radius: 50%;
    border: 32px solid var(--primary-shadow-hover);

}

.quote-text {
    color: var(--white-color);
    font-size: 1.3rem;
    font-style: italic;
    line-height: 1.7;
    margin-bottom: 28px;
    position: relative;
    z-index: 1;
}

.quote-author {
    display: flex;
    align-items: center;
    gap: 12px;
    position: relative;
    z-index: 1;
}

.quote-avatar {
    background: var(--primary-shadow-hover);
    font-size: 1.4rem;
    width: 42px;
    height: 42px;
    border-radius: var(--radius-circle);
    display: flex; align-items: center; justify-content: center;
}

.quote-author-name {
    color: var(--white-color);
    font-size: 1.2rem;
    font-weight: 500;
}

.quote-author-role {
    color: var(--grey-color);
    font-size: 1rem;
    margin-top: 2px;
}

.cta-card {
    background: var(--primary-color);
    border-radius: 20px;
    padding: 44px 44px 40px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    overflow: hidden;
}

.cta-card::before {
    background: var(--primary-button-hover);
    content: '';
    position: absolute;
    top: -50px; right: -50px;
    width: 200px; height: 200px;
    border-radius: 50%;
}

.cta-card::after {
    background: rgba(255,255,255,0.06);
    content: '';
    position: absolute;
    bottom: -30px; left: -30px;
    width: 120px; height: 120px;
    border-radius: 50%;
}

.cta-eyebrow {
    color: var(--grey-color-light);
    font-size: 1rem;
    font-weight: 500;
    margin-bottom: 16px;
    position: relative;
    z-index: 1;
}

.cta-title {
    color: var(--white-color);
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 14px;
    position: relative;
    z-index: 1;
}

.cta-desc {
    color: var(--grey-color-light);
    font-size: 1rem;
    line-height: 1.7;
    font-weight: 400;
    margin-bottom: 32px;
    position: relative;
    z-index: 1;
}

.cta-btn {
    background: var(--white-color);
    color: var(--color-footer-top);
    border: none;
    border-radius: var(--radius-xl);
    font-size: 1rem;
    font-weight: 600;
    padding: 14px 28px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    transition: all 0.22s;
    align-self: flex-start;
    position: relative;
    z-index: 1;
    text-decoration: none;
}

.cta-btn:hover {
    background: var(--color-footer-top);
    color: var(--white-color);
    transform: translateX(4px);
}

.cta-btn-arrow {
    background: var(--primary-accent-color);
    color: var(--white-color);
    font-size: 1rem;
    width: 25px;
    height: 22px;
    border-radius: var(--radius-circle);
    display: inline-flex;
    transition: background 0.2s, color 0.2s;
    align-items: center;
    justify-content: center;
}

.cta-btn:hover .cta-btn-arrow {
    background: rgba(255,255,255,0.15);
    color: white;
}

@keyframes rise {
    to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 960px) {
    .featured-wrap { grid-template-columns: 1fr; }
    .featured-photo { min-height: 280px; }
    .featured-content { padding: 36px 32px; }
    .team-grid { grid-template-columns: repeat(2, 1fr); }
    .section-header { grid-template-columns: 1fr; gap: 24px; }
    .bottom-row { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {

    .section-header-inner {
        display: flex !important;
        flex-direction: column !important;
        gap: 24px !important;
    }

    .header-left,
    .header-right {
        width: 100% !important;
        max-width: 100% !important;
    }
    .section-title {font-size: 2rem !important;}
    .header-stat-row {gap: 16px !important;}
    .stat-num {font-size: 2rem !important;}
    .featured-wrap {grid-template-columns: 1fr !important;}
    .featured-photo {
        min-height: unset;
        height: 300px;
    }
    .featured-photo img {
        width: 100%;
        height: 300px;
        object-fit: cover;
        object-position: top;
    }
    .featured-content {padding: 30px 22px 22px !important;}
}
@media (max-width: 600px) {
    .team-grid { grid-template-columns: 1fr; }
    .team-section { padding: 60px 20px 80px; }
}

/*---------------------------------------------------
   5.H Contact
-----------------------------------------------------*/
#contact {
    background: linear-gradient(135deg, #e8f5ef, #f4f9f6);
    padding: 80px 0;
    position: relative;
    overflow: hidden;
}

#contact::before {
    content: '';
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    top: -70px;
    right: -70px;
    width: 320px;
    height: 320px;
    border: 2px solid var(--primary-shadow);
    z-index: 0;
}

#contact::after {
    content: '';
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    bottom: -80px;
    left: -80px;
    width: 260px;
    height: 260px;
    border: 45px solid var(--primary-shadow);
    z-index: 0;
}

.ct-deco-mid {
    position: absolute;
    top: 2%; left: 50%;
    transform: translate(-50%, -50%);
    width: 200px; height: 200px;
    border-radius: 50%;
    border: 2px solid var(--primary-shadow);
    pointer-events: none;
}

.ct-header {
    margin-bottom: 28px;
    position: relative;
    z-index: 1;
}

.ct-eyebrow {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
}

.ct-eyebrow-line {
    background: var(--primary-color);
    display: block;
    width: 20px; height: 1.5px;
    flex-shrink: 0;
}

.ct-eyebrow-text { color: var(--primary-color); font-size: .8rem;}

.ct-header-inner {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 20px;
    flex-wrap: wrap;
}

.ct-body {
    padding:2rem 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    position: relative;
    z-index: 1;
}

.ct-left {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.ct-map-wrap {
    border-radius: 18px;
    overflow: hidden;
    flex: 1;
    min-height: 240px;
    position: relative;
    box-shadow: 0 24px 64px rgba(0,0,0,0.14), 0 8px 24px rgba(0,0,0,0.08), 0 0 0 1px rgba(61,154,114,0.12);
}

.ct-map-click {
    position: absolute;
    inset: 0;
    z-index: 1;
    cursor: pointer;
}

.ct-map-wrap iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.ct-map-badge {
    background: rgba(10,24,16,0.93);
    position: absolute;
    bottom: 12px;
    left: 50%;
    transform: translateX(-50%);
    border: 1px solid rgba(86,190,146,0.25);
    border-radius: 100px;
    padding: 8px 16px;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 10px;
    white-space: nowrap;
    text-decoration: none;
    box-shadow: 0 6px 20px rgba(0,0,0,0.25);
    transition: background .2s, border-color .2s;
}

.ct-map-badge:hover {
    background: rgba(10,24,16,0.98);
    border-color: rgba(86,190,146,0.45);
}

.ct-map-badge-logo {
    height: 25px;
    width: auto;
    object-fit: contain;
}

.ct-map-badge-name {
    color: var(--primary-color);
    font-size: 1rem;
    font-weight: 700;
}

.ct-map-badge-addr {color:var(--primary-color); font-size: .9rem;}
.ct-map-badge-addr:hover{color: var(--white-color);}
.ct-map-badge svg {color: var(--primary-color); flex-shrink: 0;}

.ct-right {
    background: rgba(255,255,255,0.75);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255,255,255,0.9);
    border-radius: 18px;
    padding: 32px 28px;
    box-shadow: 0 24px 64px rgba(0,0,0,0.14), 0 8px 24px rgba(0,0,0,0.08), 0 0 0 1px rgba(61,154,114,0.12);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.ct-form-eyebrow {
    color: var(--primary-color);
    font-size: 1.2rem;
    font-weight: 800;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.ct-form-eyebrow::after {
    background: var(--primary-color);
    content: '';
    flex: 1;
    height: 1px;
}

.ct-form {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.ct-input {
    width: 100%;
    background: rgba(255,255,255,0.7);
    border: 1.5px solid rgba(61,154,114,0.15);
    border-radius: 10px;
    padding: 12px 14px;
    font-size: .9rem;
    color: var(--primary-color);
    outline: none;
    transition: border-color .2s, background .2s, box-shadow .2s;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}

.ct-input::placeholder { color: var(--grey-color-dark); }

.ct-input:focus {
    border-color: var(--primary-color);
    background: var(--white-color);
    box-shadow: 0 0 0 3px rgba(61,154,114,0.1);
}

.ct-textarea {
    width: 100%;
    background: rgba(255,255,255,0.7);
    border: 1.5px solid rgba(61,154,114,0.15);
    border-radius: 10px;
    padding: 12px 14px;
    font-size: .9rem;
    color: var(--primary-color);
    resize: none;
    outline: none;
    min-height: 110px;
    line-height: 1.6;
    transition: border-color .2s, background .2s, box-shadow .2s;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}

.ct-textarea::placeholder { color: var(--grey-color-dark); }

.ct-textarea:focus {
    border-color: var(--primary-color);
    background: var(--white-color);
    box-shadow: 0 0 0 3px rgba(61,154,114,0.1);
}

.ct-checkbox {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.ct-checkbox input { display: none; }

.ct-checkbox-box {
    width: 18px; height: 18px;
    border-radius: 5px;
    border: 1.5px solid rgba(61,154,114,0.3);
    background: rgba(255,255,255,0.7);
    flex-shrink: 0;
    transition: background .2s, border-color .2s;
}

.ct-checkbox input:checked + .ct-checkbox-box {
    background: var(--primary-color);
    border-color: var(--primary-color);
}

.ct-checkbox-text {
    color: var(--grey-color-dark);
    font-size: .8rem;
    line-height: 1.4;
}

.ct-btn {
    background: var(--primary-color);
    color: var(--white-color);
    font-size: 1rem;
    font-weight: 600;
    padding: 13px 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: 100px;
    text-decoration: none;
    cursor: pointer;
    transition: background .2s, transform .2s, box-shadow .2s;
    box-shadow: 0 4px 16px rgba(61,154,114,0.35);
    margin-top: 4px;
}

.ct-btn:hover {
    background: var(--primary-button-hover);
    color: var(--white-color);
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(61,154,114,0.4);
}

.ct-btn svg { transition: transform .2s; }
.ct-btn:hover svg { transform: translateX(3px); }


@media (max-width: 960px) {
    #contact { padding: 56px 0; }
    .ct-header-inner {
        flex-direction: column;
        align-items: flex-start;
    }
    .ct-body {grid-template-columns: 1fr;    }
    .ct-map-wrap {min-height: 220px;    }
}

@media (max-width: 600px) {
    #contact { padding: 44px 0; }
    .ct-title { font-size: 22px; }
}
/*===================================================
   END OF MAIN CONTENT
=====================================================*/

/*===================================================
   6. ADDITIONAL CONTENT
=====================================================*/

/*---------------------------------------------------
   6.A
-----------------------------------------------------*/

/*---------------------------------------------------
   6.F Scroll(Footer) Style
-----------------------------------------------------*/
.scroll-custom {
	overflow-y: auto;
	scrollbar-width: thin;
	scrollbar-color: rgba(var(--white-opacity),5) rgba(var(--white-opacity),.7);
}
.scroll-custom::-webkit-scrollbar {
	width: 8px;
}
.scroll-custom::-webkit-scrollbar-track {
	background: rgba(var(--white-opacity),.7);	/* Arka plan rengi */
}
.scroll-custom::-webkit-scrollbar-thumb {
	background: rgba(var(--white-opacity),.3);	/* Kaydırma çubuğu rengi */
	/*border-radius: 4px;
	border: 2px solid rgba(var(--white-opacity),.7);*/
}
.scroll-custom::-webkit-scrollbar-thumb:hover {
	background: var(--primary-color);
}
/*===================================================
   END OF ADDITIONAL CONTENT
=====================================================*/

/*===================================================
   7. MORE CONTAINER
=====================================================*/

/*---------------------------------------------------
   7.A Title
-----------------------------------------------------*/
/*---------------------------------------------------
   7.B Sidebar Left
-----------------------------------------------------*/

/*---------------------------------------------------
   7.C Sidebar Right
-----------------------------------------------------*/

/*---------------------------------------------------
   7.D File Download
-----------------------------------------------------*/
.sidebar-file-group {
	width: 100%;
	margin-bottom: 1rem;
}

.sidebar-file-group .download-link:nth-child(n+1) a {
	background: var(--secondary-background);
	color: var(--white-color);
}

.sidebar-file-group .download-link:nth-child(2n+1) a {background: var(--primary-color);}

.sidebar-file-group .download-link:nth-child(3n+1) a {background: var(--color-footer);}

.sidebar-file-group .download-link:nth-child(4n+1) a {background: var(--primary-background);}

.sidebar-file-group .download-link:nth-child(n+1) a:hover {background: var(--primary-color);color: var(--background-color);}

.sidebar-file-group .download-link:nth-child(2n+1) a:hover {background: var(--primary-accent-light);}

.sidebar-file-group .download-link:nth-child(3n+1) a:hover {background: var(--color-bg);}

.sidebar-file-group .download-link:nth-child(4n+1) a:hover {background: var(--primary-color-extra-light);}

.download-link a {
	background: var(--primary-background);
	color: var(--background-color);
	font-size: var(--font-size-base);
	font-weight: 400;
	width: 100%;
	padding: 0.8rem 2.5rem 0.8rem 0.8rem;
	border-radius: var(--radius-lg);
	line-height: 1.8;
	position: relative;
	display: inline-block;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	text-align: left;
	transition: background-color 0.3s ease, color 0.3s ease;
	text-decoration: none;
}

.download-link a:hover {
	background: var(--secondary-background);
	color: var(--background-color);
	transition: var(--transition-all);
}

.download-link a i {
	font-size: var(--font-size-xl);
	position: absolute;
	right: 12px;
	top: 50%;
	transform: translateY(-50%);
}

/*---------------------------------------------------
   7.E Comment Form
-----------------------------------------------------*/
.am-form-comment label.input input,
.am-form-comment label.textarea textarea {
	font-size: var(--font-size-base);
	width: 100%;
	padding: 0.5rem;
	border: 1px solid var(--grey-color-mlight);
	border-radius: var(--radius-md);
}

.am-form-comment button.am-btn-primary {
	background-color: var(--primary-color);
	color: var(--background-color);
	border: none;
	padding: 0.75rem 1.5rem;
	border-radius: var(--radius-md);
	cursor: pointer;
	font-weight: 600;
	transition: background-color 0.3s ease;
}

.am-form-comment button.am-btn-primary:hover {
	background-color: var(--primary-background);
}

.am-form-comment {
	background: var(--grey-color-xlight);
	padding: 2.5rem;
	margin:60px 0;
	border-radius: var(--radius-xl) 0  var(--radius-xl) 0;
	display: flex;
	flex-direction: column;
	position: relative;
}

/*-------------------------------------------------
    7.G. Sections Details
---------------------------------------------------*/
#sections-details-content{
	background-color: var(--background-color);
	padding: 3rem 0;
}
/*-------------------------------------------------
    7.I Online Therapy
---------------------------------------------------*/
#online-therapy-wrapper {
	background-color: var(--primary-background);
	color: var(--background-color);
	padding: 3rem 0;
	margin: 3rem 0;
	text-align: center;
}
.online-therapy-head {
	font-size: var(--font-size-xl);
	font-weight: 500;
	line-height: 1.3;
	margin-bottom: 0.5rem;
}
.online-therapy-desc {
	color: var(--background-color);
	font-size: 1rem;
	font-weight: 400;
	margin-bottom: 1.5rem;
}
.btn-therapy {
	background: var(--background-color);
	color: var(--primary-color);
	font-size: 1rem;
	font-weight: 600;
	padding: 0 1rem;
	height: 43px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	transition: background-color 0.3s ease;
	position: relative;
	z-index: 1;
}
.btn-therapy::after {
	content: "\f105";
	font-family: "Font Awesome 5 Pro", serif;
	font-size: 1rem;
	margin-left: 0.75rem;
}
.btn-therapy:hover {
	background-color: var(--primary-color);
}

.am-online-btn {
	color: var(--white-color);
	font-size: 1rem;
	font-style: normal;
	font-weight: 400;
	line-height: 16px;
	border-radius: var(--radius-xl);
	padding: 17px 32px;
	position: relative;
	z-index: 1;
	display: inline-block;
	transition: var(--transition-all-medium);
	cursor: pointer;
}
.am-online-btn::after {
	content: "";
	position: absolute;
	height: 40px;
	width: 40px;
	display: inline-block;
	border-radius: var(--radius-circle);
	transition: var(--transition-all-medium);
	left: 5px;
	top: 5px;
	z-index: -1;
}
.am-online-btn:hover::after {
	width: 94%;
	transition: var(--transition-all-medium);
	border-radius: var(--radius-xl);
}
/*.am-online-btn-primary:hover {color: var(--white-color) !important;}*/
.am-online-btn i {
	margin-left: 4px;
	transform: rotate(-45deg);
}

.am-online-btn-primary {background: var(--email-background-color);color: var(--primary-color) !important;}
.am-online-btn-primary::after {background: rgba(var(--primary-opacity),0.2);}

.am-online-btn-secondary {background: var(--secondary-color);}
.am-online-btn-secondary::after {background: var(--secondary-button-hover);}

.am-online-btn-success {background: var(--color-success);}
.am-online-btn-success::after {background: var(--success-button-hover);}

.am-online-btn-warning {background: var(--color-warning);color: var(--color-heading);}
.am-online-btn-warning::after {background: var(--warning-button-hover);}

.am-online-btn-white {background: var(--white-color);color: var(--primary-color);}
.am-online-btn-white::after {background: var(--white-button-hover);}
/*-------------------------------------------------
    7.J Photo Gallery
---------------------------------------------------*/
#gallery {
    scroll-margin-top: 300px;
}
.am-gallery {
    background: linear-gradient(160deg, #071410 0%, #0a1a12 60%, #0d2218 100%);
    padding: 60px 0 0;
    position: relative;
    overflow: hidden;
}

.am-gallery::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(var(--primary-opacity), 0.15) 40%, var(--secondary-shadow) 60%, transparent);
}

.am-gallery-head {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    margin-bottom: 24px;
    padding: 0 16px;
    position: relative;
    z-index: 2;
}

.am-gallery-head-left .am-gallery-pre {
    color: var(--primary-color);
    font-size: .9rem;
    font-weight: 700;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: 5px;
    margin-bottom: 4px;
}

.am-gallery-head-left .am-gallery-pre::before {
    background: var(--primary-color);
    content: '';
    width: 10px;
    height: 1.5px;
    flex-shrink: 0;
}

.am-gallery-head-left .am-gallery-title {
    color: var(--white-color);
    font-size: 2rem;
    font-weight: 900;
    line-height: 1.1;
}

.am-gallery-nav {
    display: flex;
    gap: 6px;
    flex-shrink: 0;
}

.am-gallery-arr {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    border: 1px solid rgba(255,255,255,.1);
    background: rgba(255,255,255,.04);
    color: rgba(255,255,255,.4);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s;
}

.am-gallery-arr:hover {
    color: var(--white-color);
    background: var(--primary-color);
    border-color: var(--primary-color);
}

.am-gallery-scene {
    perspective: 900px;
    padding: 0 0 40px;
}

.am-gallery-track {
    transform: rotateX(8deg);
    transform-origin: bottom center;
    padding: 0;
}

.am-gallery-track .owl-stage-outer {
    overflow: visible !important;
    padding: 20px 0 !important;
}

.am-gallery-track .owl-stage {
    display: flex;
    align-items: flex-end;
}

.am-gallery-item {padding: 0 5px;}

.am-gallery-card {
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    height: 280px;
    cursor: pointer;
    transition: transform 0.35s cubic-bezier(.34,1.56,.64,1), box-shadow 0.35s;
    display: block;
    text-decoration: none;
}

.am-gallery-card:hover {
    transform: translateY(-10px) scale(1.02);
    box-shadow: 0 24px 48px rgba(0,0,0,.5);
}

.am-gallery-thumb {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    transition: transform 0.6s ease;
}

.am-gallery-card:hover .am-gallery-thumb {transform: scale(1.06);}

.am-gallery-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 30%, rgba(4,13,8,.95) 100%);
    z-index: 1;
}

.am-gallery-glow {
    position: absolute;
    inset: 0;
    box-shadow: inset 0 0 0 1.5px rgba(86,190,146,0);
    border-radius: 12px;
    transition: box-shadow 0.35s;
    z-index: 3;
}

.am-gallery-card:hover .am-gallery-glow {box-shadow: inset 0 0 0 1.5px rgba(86,190,146,.5);}

.am-gallery-content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 16px;
    z-index: 2;
    opacity: 0;
    transform: translateY(8px);
    transition: all 0.35s;
}

.am-gallery-card:hover .am-gallery-content {
    opacity: 1;
    transform: translateY(0);
}

.am-gallery-caption {
    color: var(--white-color);
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 5px;
}

.am-gallery-btn {
    color: var(--primary-color);
    background: rgba(var(--primary-opacity), 0.2);
    font-size: .9rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: var(--radius-xl);
    border: 1px solid rgba(var(--primary-opacity), 0.3);
}

.am-gallery .owl-dots {
    text-align: center;
    padding: 0 0 20px;
    position: relative;
    z-index: 2;
}

.am-gallery .owl-dot {display: inline-block;}

.am-gallery .owl-dot span {
    background: rgba(255,255,255,.15) !important;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    display: block;
    margin: 0 3px;
    transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.am-gallery .owl-dot.active span {
    background: var(--primary-color) !important;
    width: 18px;
    border-radius: 3px;
}

.am-gallery .owl-nav {display: none;}

@media(max-width:1023px) {
    .am-gallery { padding: 50px 0 0; }
    .am-gallery-card { height: 220px; }
    .am-gallery-head-left .am-gallery-title { font-size: 1.5rem; }
}

@media(max-width:599px) {
    .am-gallery { padding: 40px 0 0; }
    .am-gallery-card { height: 200px; }
    .am-gallery-head { flex-direction: column; align-items: flex-start; gap: 12px; padding: 0 12px; }
}

/*---------------------------------------------------
   7.K Page Detail
-----------------------------------------------------*/
#details-title-wrapper {
    background: #f0f7f3;
    padding: 0;
    position: relative;
    overflow: hidden;
}

#details-title-wrapper .dt-topline {
    background: linear-gradient(90deg, #0d2217, var(--primary-color), #4ade80, var(--primary-color), #0d2217);
    height: 3px;
}

#details-title-wrapper .dt-bottomline {
    background: linear-gradient(90deg, #0d2217, var(--primary-color), #4ade80, var(--primary-color), #0d2217);
    height: 3px;
}

#details-title-wrapper .dt-inner {
    display: grid;
    grid-template-columns: 1fr 660px;
    align-items: stretch;
    gap: 0;
    position: relative;
    min-height: 240px;
}

#details-title-wrapper .dt-anka {color: var(--secondary-color);}

#details-title-wrapper .dt-mind {color: var(--primary-color);}

#details-title-wrapper .dt-eyebrow-text {
    font-size: 1rem;
    font-weight: 700;
    margin-left: 5px;
}

#details-title-wrapper .dt-circle1 {
    position: absolute;
    left: 184px;
    bottom: -115px;
    width: 340px;
    height: 340px;
    border-radius: var(--radius-circle);
    border: 1px solid var(--primary-shadow-hover);
    pointer-events: none;
    z-index: 1;
}

#details-title-wrapper .dt-circle2 {
    position: absolute;
    left: 249px;
    bottom: -45px;
    width: 210px;
    height: 210px;
    border-radius: var(--radius-circle);
    border: 1px solid var(--primary-shadow-hover);
    pointer-events: none;
    z-index: 1;
}

#details-title-wrapper .dt-circle3 {
    position: absolute;
    left: 298px;
    bottom: -13px;
    width: 110px;
    height: 110px;
    border-radius: var(--radius-circle);
    border: 1px solid var(--primary-shadow-hover);
    pointer-events: none;
    z-index: 1;
}

#details-title-wrapper .dt-circle4 {
    position: absolute;
    left: 420px;
    top: -70px;
    width: 200px;
    height: 200px;
    border-radius: var(--radius-circle);
    border: 1px solid var(--primary-shadow-hover);
    pointer-events: none;
    z-index: 1;
}

#details-title-wrapper .dt-circle5 {
    position: absolute;
    left: 459px;
    top: -40px;
    width: 120px;
    height: 120px;
    border-radius: var(--radius-circle);
    border: 1px solid var(--primary-shadow);
    pointer-events: none;
    z-index: 1;
}

#details-title-wrapper .dt-left {
    position: relative;
    z-index: 2;
    padding: 70px 40px 70px 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

#details-title-wrapper .dt-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 14px;
}

#details-title-wrapper .dt-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    display: inline-block;
}

#details-title-wrapper .dt-dot1 { background: var(--primary-color); }
#details-title-wrapper .dt-dot2 { background: var(--primary-color-light); }
#details-title-wrapper .dt-dot3 { background: var(--primary-shadow-hover); }

#details-title-wrapper .dt-eyebrow-text {
    color: var(--primary-color);
    font-size: 1.2rem;
    font-weight: 800;
    margin-left: 5px;
}

#details-title-wrapper .blog-title-detail {
    color: #0c4527;
    font-size: 1.4rem;
    font-weight: 800;
    line-height: 1;
    margin-bottom: 20px;
    text-shadow: none;
    padding-top: 0;
    display: block;
    text-align: left;
}

#details-title-wrapper .breadcrumb-link {
    background: var(--white-color);
    border: .5px solid var(--primary-color);
    padding: 7px 18px;
    border-radius: 30px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    width: fit-content;
    margin: 0;
    backdrop-filter: none;
}

#details-title-wrapper .breadcrumb-link li {
    color: var(--primary-color);
    font-size: 1rem;
    display: inline-flex;
    align-items: center;
}

#details-title-wrapper .breadcrumb-link li i {
    color: var(--primary-color);
    font-size: .9rem;
}

#details-title-wrapper .breadcrumb-link li:not(:first-child) i {
    color: var(--grey-color-mlight);
    font-size: .9rem;
}

#details-title-wrapper .breadcrumb-link a {
    color: #0c4527;
    font-size: 1rem;
    font-weight: 700;
    text-decoration: none;
    transition: color .2s;
}

#details-title-wrapper .breadcrumb-link a:hover {color: var(--primary-color);}

#details-title-wrapper .breadcrumb-link li:last-child {
    color: var(--primary-color);
    font-weight: 700;
    max-width: 150px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
}

#details-title-wrapper .dt-right {
    position: relative;
    overflow: hidden;
}

#details-title-wrapper .dt-photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
}

#details-title-wrapper .dt-photo-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to right, #f0f7f3 0%, rgba(240,247,243,0.3) 40%, transparent 100%);
    pointer-events: none;
    z-index: 2;
}

@media (max-width: 1199px) {
    #details-title-wrapper .dt-inner {grid-template-columns: 1fr 420px;}
    #details-title-wrapper .blog-title-detail {font-size: 2rem;}
    #details-title-wrapper .dt-left {padding: 60px 32px 60px 0;}
}

@media (max-width: 991px) {
    #details-title-wrapper .dt-inner {
        grid-template-columns: 1fr 320px;
        min-height: 200px;
    }
    #details-title-wrapper .blog-title-detail {font-size: 2.2rem;}
    #details-title-wrapper .dt-left {padding: 50px 24px 50px 0;}
    #details-title-wrapper .dt-circle1 { width: 240px; height: 240px; left: -70px; bottom: -70px; }
    #details-title-wrapper .dt-circle2 { width: 150px; height: 150px; left: -40px; bottom: -40px; }
    #details-title-wrapper .dt-circle3 { width: 80px; height: 80px; }
}

@media (max-width: 767px) {
    #details-title-wrapper .dt-inner {
        grid-template-columns: 1fr;
        min-height: unset;
    }
    #details-title-wrapper .dt-right {display: none;}
    #details-title-wrapper .dt-left {padding: 44px 0;}+
    #details-title-wrapper .blog-title-detail {font-size: 28px;}
    #details-title-wrapper .dt-eyebrow-text {font-size: .9rem;}
    #details-title-wrapper .breadcrumb-link {padding: 6px 14px;}
    #details-title-wrapper .breadcrumb-link li {font-size: .8rem;}
}

@media (max-width: 575px) {
    #details-title-wrapper .dt-left {padding: 36px 0;    }
    #details-title-wrapper .blog-title-detail {
        font-size: 1.2rem;
        margin-bottom: 16px;
    }
    #details-title-wrapper .dt-eyebrow {margin-bottom: 10px;}
    #details-title-wrapper .dt-circle1,
    #details-title-wrapper .dt-circle2,
    #details-title-wrapper .dt-circle3,
    #details-title-wrapper .dt-circle4,
    #details-title-wrapper .dt-circle5 {display: none;}
    #details-title-wrapper .breadcrumb-link {
        padding: 5px 12px;
        gap: 5px;
    }
}
/*---------------------------------------------------
   7.L Social Media Sharing
-----------------------------------------------------*/

/*---------------------------------------------------
   7.M About Us Detail
-----------------------------------------------------*/
#aboutus-details-content{
	background-color: var(--background-color);
	padding: 4rem 0;
}

.aboutus-wrapper{
	background: var(--grey-color-xlight);
	border-radius: var(--radius-lg);
	padding: 1.5rem;
	position: relative;
}
.aboutus-socialmedia {
	padding: 0;
	margin-top: 20px;
	margin-bottom: 20px;
	display: flex;
	justify-content: center;
	align-items: center;
	list-style: none;
	gap: 10px;
}

.aboutus-socialmedia a {
	background-color:var(--grey-color-light);
	color: var(--color-tooltip);
	font-size: 1rem;;
	width: 44px;
	height: 44px;
	border-radius: var(--radius-circle);
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	transition: all 500ms ease;
}
.aboutus-socialmedia a + a {
	margin-left: 10px;
}
.aboutus-socialmedia a:hover {
	background-color: var(--primary-color);
	color: var(--background-color);
}
.aboutus-socialmedia a svg {
    fill: currentColor; /* bu sayede a'nın color değerini alır */
}

/*.aboutus-gallery a img{border-radius: var(--radius-lg); transition: all 0.4s ease-out 0s;}
.aboutus-gallery a:hover img{transform: scale(1.1);}*/
.aboutus-text{
    color: var(--black-color);
    font-size: var(--font-size-lg);
    border-top: 1px dashed var(--grey-color-mlight);
    border-bottom: 1px dashed var(--grey-color-mlight);
    margin-top: 15px;
    padding: 15px 0 25px;
    line-height: 1.5;
}
.aboutus-gallery a {
	display: block;
	overflow: hidden;
	border-radius: var(--radius-lg);
}
.aboutus-gallery a img {
	transition: transform 3s ease;
	display: block;
	width: 100%;
	height: auto;
}
.aboutus-gallery a:hover img {
	transform: scale(1.3);
}


.aboutus-gallery {
	position: relative;
	display: inline-block;
	z-index: 1;
}
.aboutus-gallery::after {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	border: 4px solid var(--primary-color);
	border-radius: var(--radius-lg);
	bottom: -46px;
	right: -36px;
	z-index: -1;
	transition: all 0.3s ease;
}

/*---------------------------------------------------
   7.N Services Detail
-----------------------------------------------------*/
.sd-section {
    padding: 60px 0;
    background: var(--white-color);
}

.sd-left {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.sd-media {
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    cursor: pointer;
}

.sd-media img {
    width: 100%;
    height: 360px;
    object-fit: cover;
    display: block;
    transition: transform .5s ease;
}

.sd-media:hover img {transform: scale(1.04);}

.sd-media-overlay {
    position: absolute;
    inset: 0;
    background: rgba(29,158,117,0.15);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity .3s;
}

.sd-media:hover .sd-media-overlay {opacity: 1;}

.sd-media-overlay-btn {
    color: var(--white-color);
    background: transparent;
    border: .5px solid var(--white-color);
    font-size: .9rem;
    font-weight: 600;
    border-radius: 30px;
    padding: 9px 22px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.sd-media-tools {
    position: absolute;
    top: 14px;
    right: 14px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    list-style: none;
    padding: 0;
    margin: 0;
    z-index: 10;
}

.sd-media-tools li a {
    color: var(--white-color);
    background: transparent;
    font-size: 1rem;
    width: 36px;
    height: 36px;
    border-radius: var(--radius-circle);
    border: 1.5px solid var(--white-color);
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: all .25s ease;
    box-shadow: none;
}

.sd-media-tools li a:hover {
    color: var(--white-color);
    background: var(--primary-color);
    border-color: var(--white-color);
    transform: translateY(-2px);
}

.sd-media-tools li a svg {
    fill: var(--white-color);
    width: 16px;
    height: 16px;
    transition: fill .25s;
}

.sd-media-tools li a:hover svg {fill: var(--white-color);}

.sd-media-bottom {
    position: absolute;
    bottom: 14px;
    left: 14px;
    right: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    z-index: 5;
}

.sd-media-badge {
    background: rgba(255,255,255,0.12);
    border-radius: 20px;
    padding: 4px 10px;
    font-size: 10px;
    color: var(--white-color);
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.sd-media-actions {
    display: flex;
    gap: 6px;
}

.sd-media-action-btn {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: rgba(255,255,255,0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--white-color);
    font-size: 13px;
    text-decoration: none;
    cursor: pointer;
    transition: background .2s;
}

.sd-media-action-btn:hover {background: rgba(255,255,255,0.3);}

.sd-meta {
    background: #f8fbf9;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    padding: 12px 16px;
    border-radius: var(--radius-lg);
    border: .5px solid var(--primary-color-extra-light);
}

.sd-meta-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 10px;
    color: var(--primary-color);
    background: #e1f5ee;
    border: .5px solid #c5e3d0;
    padding: 3px 10px;
    border-radius: 20px;
    font-weight: 600;
}

.sd-meta-item {
    color: var(--grey-color-deep);
    font-size: .9rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.sd-meta-item i {
    color: var(--primary-color);
    font-size: .9rem;
    margin-right: 4px;
}

.sd-meta-read {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 10px;
    color: #aaa;
    background: #f0f7f3;
    padding: 3px 10px;
    border-radius: 20px;
    border: .5px solid #e0ede6;
}

.sd-meta-size {
    display: flex;
    gap: 4px;
    margin-left: auto;
}

.sd-meta-size a {
    color: var(--primary-color);
    background: var(--white-color);
    border: .5px solid var(--primary-color);
    font-size: .9rem;
    border-radius: var(--radius-xl);
    padding: 3px 9px;
    text-decoration: none;
    cursor: pointer;
    transition: all .2s;
}

.sd-meta-size a:hover {
    background: var(--primary-color);
    color: var(--white-color);
}

.sd-meta-size a.normal {
    color: var(--primary-color);
    font-weight: 700;
}

.sd-meta-size a.normal:hover{color: var(--white-color); background-color: var(--primary-color);}

.sd-meta-vote {
    color: #1d9e75;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    text-decoration: none;
    cursor: pointer;
    transition: opacity .2s;
}

.sd-meta-vote:hover { opacity: .7; }

.sd-meta-vote-count {
    color: #aaa;
    font-size: .8rem;
}

.sd-content-box {
    background: var(--white-color);
    border-radius: var(--radius-lg);
    border: .5px solid var(--primary-color-extra-light);
    padding: 28px;
}

.sd-content-box h2.sd-title {
    color: var(--black-color);
    font-size: 1.6rem;
    font-weight: 900;
    line-height: 1.15;
    margin-bottom: 14px;
    padding-bottom: 12px;
    position: relative;
}

.sd-content-box h2.sd-title::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 48px;
    height: 3px;
    background: linear-gradient(90deg, var(--primary-color-dark), var(--primary-color-extra-light));
    border-radius: 2px;
}

.sd-detail-content {
    color: var(--color-text);
    font-size: 1rem;
    line-height: 1.9;
}

.sd-detail-content > p:first-of-type {
    color: var(--color-text);
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.7;
    border-left: 3px solid var(--primary-button-hover);
    padding-left: 14px;
    margin-bottom: 16px;
}

.sd-detail-content > p {
    color: var(--color-text);
    font-size: 1rem;
    margin-bottom: 14px;
    line-height: 1.7;
}

/* ── Accordion ── */
.sd-detail-content h2 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    padding: 14px 18px;
    margin: 8px 0 0;
    background: var(--primary-color-extra-light);
    border: 1px solid var(--primary-accent-light);
    border-radius: 10px;
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-footer-top);
    transition: background 0.2s, color 0.2s;
    user-select: none;
}

.sd-detail-content h2:hover {
    background: var(--primary-color);
    color: var(--white-color);
}

.sd-detail-content h2.acc-open {
    background: var(--primary-color);
    color: var(--white-color);
    border-radius: 10px 10px 0 0;
    margin-bottom: 0;
}

.sd-detail-content h2::after {
    content: '+';
    font-size: 1.4rem;
    font-weight: 400;
    flex-shrink: 0;
    transition: transform 0.3s;
}

.sd-detail-content h2.acc-open::after {
    content: '−';
}

.acc-body {
    display: none;
    padding: 16px 18px;
    border: 1px solid var(--primary-accent-light);
    border-top: none;
    border-radius: 0 0 10px 10px;
    margin-bottom: 8px;
    background: var(--white-color);
}

.acc-body.acc-active {
    display: block;
    animation: accFadeIn 0.25s ease;
}

@keyframes accFadeIn {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* İlk paragraf accordion dışında normal görünsün */
.sd-detail-content > p:first-of-type {
    margin-bottom: 1.25rem;
}


.acc-body p {
    font-size: .95rem;
    line-height: 1.8;
    color: var(--black-color);
    margin-bottom: .75rem;
}

.acc-body ul {
    padding-left: 1.25rem;
    margin-bottom: .75rem;
}

.acc-body ul li {
    font-size: .95rem;
    line-height: 1.8;
    color: var(--black-color);
    margin-bottom: .25rem;
}

/* Mobil */
@media (max-width: 768px) {
    .sd-detail-content h2 {
        font-size: .9rem;
        padding: 12px 14px;
    }
    .acc-body {
        padding: 12px 14px;
    }
}


.sd-detail-content h2 {
    color: var(--black-color) !important;
    font-size: 1rem ;
    font-weight: 800 !important;
    margin: 24px 0 12px !important;
    padding: 0 !important;
    border: none !important;
    display: flex;
    align-items: center;
    gap: 10px;
}

.sd-detail-content h2::before {
    content: '';
    display: inline-block;
    width: 20px;
    height: 2px;
    background: var(--primary-button-hover);
    flex-shrink: 0;
}

.sd-detail-content h2::after {
    content: '' !important;
    flex: 1;
    height: 1px;
    background: var(--primary-shadow);
    position: static !important;
    width: auto !important;
}

.sd-detail-content h3 {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #0d2217 !important;
    margin: 18px 0 10px !important;
    padding-left: 12px !important;
    border-left: 3px solid #1d9e75 !important;
    border-bottom: none !important;
}

.sd-detail-content ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 16px !important;
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.sd-detail-content ul li {
    color: var(--color-text) !important;
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    padding: 9px 14px !important;
    background: #f8fbf9 !important;
    border-radius: 10px !important;
    border: .5px solid var(--primary-color-extra-light) !important;
    font-size: .9rem !important;
    line-height: 1.6 !important;
    margin: 0 !important;
    transform: none !important;
}

.sd-detail-content ul li::before {
    content: '' !important;
    width: 7px !important;
    height: 7px !important;
    min-width: 7px !important;
    border-radius: 50% !important;
    background: var(--primary-button-hover) !important;
    flex-shrink: 0 !important;
    margin-top: 7px !important;
    display: block !important;
}

.sd-detail-content ul li a {
    color: var(--color-text) !important;
    text-decoration: none !important;
}

.sd-detail-content ol {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 16px !important;
    display: flex;
    flex-direction: column;
    gap: 7px;
    counter-reset: item;
}

.sd-detail-content ol li {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;
    font-size: 12px !important;
    color: #444 !important;
    line-height: 1.7 !important;
    padding: 4px 0 !important;
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
    transform: none !important;
    counter-increment: item;
}

.sd-detail-content ol li::before {
    content: counter(item) !important;
    width: 24px !important;
    height: 24px !important;
    border-radius: 50% !important;
    background: #e1f5ee !important;
    border: .5px solid #c5e3d0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    color: #0f6e56 !important;
    flex-shrink: 0 !important;
    margin-top: 2px !important;
}

.sd-share {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 20px;
    padding-top: 16px;
    border-top: .5px solid var(--primary-shadow);
    list-style: none;
    padding-left: 0;
    flex-wrap: wrap;
}

.sd-share-label {
    color: var(--grey-color-deep);
    font-size: 1rem;
    font-weight: 600;
}

.sd-share-btn {
    color: var(--primary-button-hover);
    background: #f0f7f3;
    width: 32px;
    height: 32px;
    border-radius: var(--radius-circle);
    border: .5px solid var(--primary-accent-light);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    text-decoration: none;
    transition: all .2s;
}

.sd-share-btn:hover {
    color: var(--white-color);
    background: var(--primary-button-hover);
    border-color: var(--primary-background);
}
.sd-share-btn svg {
    fill: var(--primary-button-hover);
    width: 1em;
    height: 1em;
    transition: fill .2s;
}

.sd-share-btn:hover svg {fill: var(--white-color);}

.sd-files-box {
    background: var(--white-color);
    border-radius: 20px;
    border: .5px solid #e0ede6;
    padding: 20px;
}

.sd-comments-box {
    background: var(--white-color);
    border-radius: 20px;
    border: .5px solid #e0ede6;
    padding: 24px;
}

.sd-comments-box .sd-box-title {
    color: var(--black-color);
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.sd-comments-box .sd-box-title::before {
    background: var(--primary-color-dark);
    content: '';
    width: 3px;
    height: 16px;
    border-radius: 2px;
    display: inline-block;
}

.sd-comments-box .sd-box-title::after {
    background: var(--primary-shadow-hover);
    color: var(--primary-color-dark);
    font-size: .8rem;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 20px;
    content: attr(data-count);
}

.sd-comments-box .sd-comments-list {
    position: relative;
    padding-left: 48px;
}

.sd-comments-box .sd-comments-list::before {
    background: var(--primary-shadow-hover);
    content: '';
    position: absolute;
    left: 18px;
    top: 0;
    bottom: 0;
    width: 1.5px;
}

.sd-comment {
    position: relative;
    display: block;
    padding: 0;
    margin-bottom: 20px;
    border-bottom: none;
    gap: 0;
}

.sd-comment:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

.sd-comment-avatar {
    color: var(--white-color);
    font-size: 1rem;
    font-weight: 700;
    position: absolute;
    left: -48px;
    top: 0;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 3px solid var(--white-color);
    box-shadow: 0 0 0 1.5px #e0ede6;
    z-index: 2;
}

.sd-comment-body {
    background: #f8fbf9;
    border-radius: 14px;
    border: .5px solid #e0ede6;
    padding: 14px 16px;
    width: 100%;
}

.sd-comment-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 6px;
}

.sd-comment-date {
    color: var(--grey-color-deep);
    background: var(--white-color);
    font-size: .8rem;
    border: .5px solid var(--primary-color-extra-light);
    padding: 2px 8px;
    border-radius: 20px;
}

.sd-comment-reply {
    background: var(--white-color);
    display: flex;
    gap: 8px;
    margin-top: 10px;
    border-radius: 12px;
    border: .5px solid #e0ede6;
    border-left: 3px solid #1d9e75;
    padding: 10px 12px;
}

.sd-comment-reply .sd-comment-avatar {
    color: var(--white-color);
    background-color: var(--secondary-color-dark);
    font-size: .9rem;
    width: 28px;
    height: 28px;
    border: 2px solid var(--white-color);
    box-shadow: 0 0 0 1px #e0ede6;
    position: static;
}

.sd-comment-reply .sd-comment-header {margin-bottom: 3px;}

.sd-comment-reply .sd-comment-date {
    background: transparent;
    border: none;
    padding: 0;
}

.sd-comment-reply .sd-comment-text {margin: 0;}

.sd-file-item {
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 12px;
    padding: 10px 14px;
    margin-bottom: 7px;
    text-decoration: none;
    transition: all .2s;
    border: .5px solid;
}

.sd-file-item.pdf {
    background: var(--white-color)5f5;
    border-color: #ffd5d5;
}

.sd-file-item.doc {
    background: #f0f4ff;
    border-color: #c3d0ff;
}

.sd-file-item.other {
    background: #f8fbf9;
    border-color: #e0ede6;
}

.sd-file-icon {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 1rem;;
    color: var(--white-color);
}

.sd-file-icon.pdf { background: #e53e3e; }
.sd-file-icon.doc { background: #3b82f6; }
.sd-file-icon.other { background: #0d2217; }

.sd-file-info { flex: 1; min-width: 0; }

.sd-file-name {
    color: #0d2217;
    font-size: .8rem;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sd-file-size {
    color: #aaa;
    font-size: .8rem;
}

.sd-file-dl {
    font-size: 1rem;;
    flex-shrink: 0;
}

.sd-file-dl.pdf { color: #e53e3e; }
.sd-file-dl.doc { color: #3b82f6; }
.sd-file-dl.other { color: #0d2217; }

.sd-comments-box {
    background: var(--white-color);
    border-radius: 20px;
    border: .5px solid #e0ede6;
    padding: 24px;
}

.sd-comment {
    display: flex;
    gap: 12px;
    padding: 16px 0;
    border-bottom: .5px solid #f0f7f3;
}

.sd-comment:first-child { padding-top: 0; }
.sd-comment:last-child { border-bottom: none; padding-bottom: 0; }

.sd-comment-avatar {
    color: var(--white-color);
    font-size: 1rem;
    font-weight: 700;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.sd-comment-author { font-size: 1rem; font-weight: 700; color: var(--black-color); }
.sd-comment-date { font-size: .77rem; color: var(--grey-color-deep); }
.sd-comment-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.sd-comment-text { font-size: .9rem; color: var(--color-text); line-height: 1.7; margin: 0 0 8px; }

.sd-reply-btn {
    color: var(--primary-color-dark);
    background: var(--primary-shadow);
    font-size: .8rem;
    padding: 3px 10px;
    border-radius: 20px;
    text-decoration: none;
    font-weight: 600;
    cursor: pointer;
    transition: all .2s;
}

.sd-reply-btn:hover { color: var(--white-color); background: var(--primary-color-dark);}

.sd-comment-reply {
    background: #f8fbf9;
    display: flex;
    gap: 10px;
    margin-top: 10px;
    border-radius: 12px;
    padding: 10px;
    border-left: 3px solid var(--primary-color-dark);
}

.sd-comment-reply .sd-comment-avatar {
    font-size: .8rem;
    width: 28px;
    height: 28px;
}

.sd-form-box {
    border-radius: 20px;
    overflow: hidden;
    border: .5px solid #e0ede6;
    padding: 0;
}

.sd-form-box .sd-box-title {
    background:linear-gradient(160deg, #071410 0%, #0d2218 55%, #163322 100%);
    padding: 20px 24px;
    margin-bottom: 0;
    display: flex;
    align-items: center;
    gap: 12px;
    border-radius: 0;
}

.sd-form-box .sd-box-title::before {display: none;}

.sd-form-box .sd-box-title::after {
    content: '';
    display: block;
    width: 45px;
    height: 45px;
    border-radius: 12px;
    background: rgba(29,158,117,0.15);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='23' height='23' viewBox='0 0 24 24' fill='none' stroke='%234ade80' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    order: -1;
    flex-shrink: 0;
}

.sd-form-box .sd-box-title {
    color: var(--white-color);
    font-size: 1rem;
    font-weight: 700;
}

.sd-form-box .am-form-comment {
    background: #f8fbf9;
    padding: 24px;
    margin: 0;
    border-radius: 0;
    border: none;
}

.sd-form-box .am-form {
    background: transparent;
    padding: 0;
}

.sd-form-box fieldset {
    border: none;
    padding: 0;
    margin: 0;
}

.sd-form-box label.input,
.sd-form-box label.textarea {
    display: block;
    margin-bottom: 10px;
}

.sd-form-box label.input input,
.sd-form-box label.textarea textarea {
    color: var(--black-color) !important;
    background: var(--white-color) !important;
    font-size: 1rem !important;
    width: 100%;
    border: .5px solid var(--primary-color-extra-light) !important;
    border-radius: 12px !important;
    padding: 12px 14px !important;
    outline: none !important;
    transition: border-color .2s !important;
    box-shadow: none !important;
}

.sd-form-box label.input input:focus,
.sd-form-box label.textarea textarea:focus {border-color: var(--primary-color) !important;}

.sd-form-box label.textarea textarea {
    resize: vertical;
    min-height: 100px;
}

.sd-form-box section {margin-bottom: 0;}

.sd-form-box footer {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-top: 14px;
    background: transparent;
    padding: 0;
}

.sd-form-box footer .am-btn.am-btn-primary {
    background: var(--primary-color-dark) !important;
    color: var(--white-color) !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 11px 24px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    cursor: pointer !important;
    transition: background .2s !important;
    width: auto !important;
    text-decoration: none !important;
}

.sd-form-box footer .am-btn.am-btn-primary:hover {background: var(--primary-color-dark) !important;}

.sd-form-box .row.gy-3 {margin-bottom: 10px;}

.sd-form-box .col-6 label.input input {max-width: 280px;}

.sd-form-box .sd-form-bottom {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
}

.sd-form-box .sd-form-bottom .am-btn.am-btn-primary {
    white-space: nowrap;
    flex-shrink: 0;
}

.sd-sidebar {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.sd-cta {
    background: linear-gradient(160deg, #071410 0%, #0d2218 55%, #163322 100%);
    border-radius: var(--radius-lg);
    padding: 20px;
    position: relative;
    overflow: hidden;
}

.sd-cta::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(74,222,128,0.06) 1.5px, transparent 1.5px);
    background-size: 18px 18px;
    pointer-events: none;
}

.sd-cta::after {
    content: '';
    position: absolute;
    right: -30px;
    bottom: -30px;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    border: 1px solid rgba(29,158,117,0.15);
    pointer-events: none;
}

.sd-cta-icon {
    background: var(--primary-shadow);
    width: 45px;
    height: 45px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
    position: relative;
    z-index: 2;
}

.sd-cta-icon i{color: var(--primary-color); font-size: 1.5rem;}

.sd-cta-title {
    color: var(--white-color);
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 6px;
    position: relative;
    z-index: 2;
}

.sd-cta-desc {
    color: var(--grey-color-deep);
    font-size: .9rem;
    margin-bottom: 14px;
    line-height: 1.5;
    position: relative;
    z-index: 2;
}

.sd-cta-btn {
    color: var(--white-color);
    background: var(--primary-color-dark);
    font-size: 1rem;
    font-weight: 700;
    border-radius: 20px;
    padding: 10px 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    text-decoration: none;
    transition: background .2s;
    position: relative;
    z-index: 2;
}

.abp-cta-right button.am-randevu.appointment-button-trigger:hover {
    background: var(--primary-color) !important;
    color: var(--white-color) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(29,158,117,0.3) !important;
    opacity: 1 !important;
}

.sd-cta-btn:hover { background: var(--primary-shadow); color: var(--white-color); }

.sd-sidebar-box {
    background: #f0f7f3;
    border-radius: 20px;
    padding: 16px;
    border: .5px solid var(--primary-color-extra-light);
}

.vs-video-list-box {
    padding: 0;
    overflow: hidden;
}
.vs-video-list-header {
    background: linear-gradient(160deg, #071410 0%, #0d2218 55%, #163322 100%);
    padding: 14px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.vs-video-list-header span {
    color: var(--white-color);
    font-size: 1rem;
    font-weight: 500;
}
.vs-video-list-count {
    background: var(--primary-color) !important;
    color: var(--white-color) !important;
    font-size: .8rem !important;
    padding: 2px 8px;
    border-radius: 10px;
}
#videoList {
    max-height: 500px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--primary-color-extra-light) transparent;
}
#videoList::-webkit-scrollbar { width: 4px; }
#videoList::-webkit-scrollbar-track { background: transparent; }
#videoList::-webkit-scrollbar-thumb { background: var(--primary-color-extra-light); border-radius: 4px; }
#videoList::-webkit-scrollbar-thumb:hover { background: var(--primary-color); }

.vs-vid-thumb-wrap {
    background: var(--primary-color-dark);
    position: relative;
    width: 70px;
    height: 44px;
    flex-shrink: 0;
    border-radius: 7px;
    overflow: hidden;
}
.vs-vid-thumb-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.vs-vid-thumb-placeholder {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, var(--primary-color-dark), var(--primary-color));
}
.vs-vid-thumb-play {
    color: rgba(255,255,255,0.8);
    font-size: .9rem;
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.vs-vid-thumb-dur {
    color: var(--white-color);
    background: var(--grey-color-xxdark);
    font-size: .8rem;
    padding: 1px 4px;
    border-radius: 2px;
    bottom: 2px;
    right: 3px;
    position: absolute;
}
.sd-list-item.active {
    background: #e1f5ee;
    border-left: 3px solid var(--primary-color);
}
.sd-list-item.active .sd-list-name {color: var(--primary-color-dark);}

.sd-sidebar-title {
    color: var(--black-color);
    font-size: 1.3rem;
    font-weight: 800;
    margin-bottom: 12px;
}

.vs-cat-btn {
    color: var(--primary-color-dark);
    background: var(--white-color);
    font-size: .9rem;
    border: .5px solid var(--primary-color-extra-light);
    padding: 4px 12px;
    border-radius: 20px;
    text-decoration: none;
    transition: all .2s;
    cursor: pointer;
}
.vs-cat-btn:hover,
.vs-cat-btn.active {
    color: var(--white-color);
    background: var(--primary-color-dark);
    border-color: var(--primary-background);
}

.sd-sidebar-title span{color: var(--primary-color-dark);}

.sd-list-item {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--white-color);
    border-radius: 12px;
    padding: 8px;
    border: .5px solid var(--primary-shadow-hover);
    margin-bottom: 7px;
    text-decoration: none;
    transition: all .2s;
}

.sd-list-item:last-child { margin-bottom: 0; }

.sd-list-item:hover {
    background: #f8fbf9;
    border-color: #1d9e75;
}

.sd-list-thumb {
    width: 36px;
    height: 36px;
    border-radius: 9px;
    object-fit: cover;
    flex-shrink: 0;
    background: #e0ede6;
}

.sd-list-thumb-placeholder {
    background: linear-gradient(135deg, #1a3a28, #0d2217);
    width: 36px;
    height: 36px;
    border-radius: 9px;
    flex-shrink: 0;
}

.sd-list-info { flex: 1; min-width: 0; }

.sd-list-name {
    color: var(--black-color);
    font-size: .9rem;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
}

.sd-list-sub {
    color: var(--primary-color-dark);
    font-size: .7rem;
    font-weight: 600;
    margin-top: 3px;
    gap: 3px;
    display: flex;
    align-items: center;
}

.sd-list-sub i {
    color: var(--primary-color);
    font-size: .7rem;
}

.sd-list-date {
    color: var(--grey-color-deep);
    font-size: .8rem;
}

.sd-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.sd-tag {
    color: var(--primary-color-dark);
    background: var(--white-color);
    font-size: .9rem;
    border: .5px solid var(--primary-color-extra-light);
    padding: 4px 12px;
    border-radius: 20px;
    text-decoration: none;
    transition: all .2s;
}

.sd-tag:hover {
    color: var(--white-color);
    background: var(--primary-color-dark);
    border-color: var(--primary-background);
}

.sd-media-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.15);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 1;
    cursor: default;
}
.sd-media-overlay-btn {cursor: pointer;}

.sd-media-overlay-btn:hover {
    background: rgba(255,255,255,0.25);
    transform: scale(1.05);
    transition: all .2s;
}

#videoList::-webkit-scrollbar {width: 4px;}
#videoList::-webkit-scrollbar-track {background: transparent;}
#videoList::-webkit-scrollbar-thumb {
    background: var(--primary-color-extra-light);
    border-radius: 4px;
}
#videoList::-webkit-scrollbar-thumb:hover {background: var(--primary-color);}

/* ── RESPONSIVE ── */
@media (max-width: 1199px) {
    .sd-media img { height: 300px; }
    .sd-content-box { padding: 24px; }
    .sd-detail-content > p:first-of-type { font-size: 13px; }
    .sd-content-box h2.sd-title { font-size: 22px; }
}
/* Tablet yatay — 768px - 991px */
@media (max-width: 991px) {
    .sd-section { padding: 44px 0; }
    .sd-media img { height: 260px; }
    .sd-content-box { padding: 22px; }
    .sd-content-box h2.sd-title { font-size: 20px; }
    .sd-detail-content h2 { font-size: 15px !important; }
    .sd-detail-content h3 { font-size: 14px !important; }
    .sd-sidebar { margin-top: 32px; }
    .sd-cta { padding: 18px; }
}

/* Tablet dikey — 576px - 767px */
@media (max-width: 767px) {
    .sd-section { padding: 32px 0; }
    .sd-media img { height: 220px; }
    .sd-media-overlay-btn { font-size: 11px; padding: 7px 16px; }
    .sd-meta {
        gap: 6px;
        padding: 10px 12px;
    }
    .sd-meta-badge { font-size: 9px; padding: 2px 8px; }
    .sd-meta-item { font-size: 9px; }
    .sd-meta-read { font-size: 9px; padding: 2px 8px; }
    .sd-meta-size a { font-size: 9px; padding: 2px 7px; }
    .sd-content-box { padding: 18px; }
    .sd-content-box h2.sd-title { font-size: 19px; }
    .sd-detail-content > p:first-of-type { font-size: 13px; }
    .sd-detail-content > p { font-size: 12px; }
    .sd-detail-content h2 { font-size: 14px !important; }
    .sd-detail-content h3 { font-size: 13px !important; }
    .sd-detail-content ul li { font-size: 12px !important; padding: 8px 12px !important; }
    .sd-detail-content ol li { font-size: 12px !important; }
    .sd-detail-content blockquote { font-size: 13px; padding: 12px 16px; }
    .sd-share { gap: 6px; }
    .sd-share-btn { width: 26px; height: 26px; font-size: 12px; }
    .sd-files-box { padding: 16px; }
    .sd-file-item { padding: 8px 10px; }
    .sd-file-icon { width: 28px; height: 28px; font-size: 14px; }
    .sd-file-name { font-size: 11px; }
    .sd-form-box { padding: 18px; }
    .sd-comments-box { padding: 18px; }
    .sd-comment { gap: 10px; }
    .sd-comment-avatar { width: 34px; height: 34px; font-size: 13px; }
    .sd-comment-author { font-size: 12px; }
    .sd-comment-text { font-size: 11px; }
    .sd-sidebar { margin-top: 28px; }
    .sd-cta { padding: 16px; }
    .sd-cta-title { font-size: 13px; }
    .sd-cta-desc { font-size: 10px; }
    .sd-cta-btn { font-size: 11px; padding: 8px 14px; }
    .sd-sidebar-box { padding: 14px; }
    .sd-sidebar-title { font-size: 9px; }
    .sd-list-thumb { width: 32px; height: 32px; }
    .sd-list-thumb-placeholder { width: 32px; height: 32px; }
    .sd-list-name { font-size: 11px; }
    .sd-list-sub { font-size: 9px; }
    .sd-list-date { font-size: 9px; }
    .sd-tags { gap: 5px; }
    .sd-tag { font-size: 10px; padding: 3px 10px; }
}

/* Mobil — 575px ve altı */
@media (max-width: 575px) {
    .sd-section { padding: 24px 0; }
    .sd-media img { height: 180px; }
    .sd-media-bottom { flex-direction: column; align-items: flex-start; gap: 8px; }
    .sd-media-actions { align-self: flex-end; }
    .sd-meta { flex-wrap: wrap; }
    .sd-meta-size { margin-left: 0; width: 100%; justify-content: flex-start; }
    .sd-content-box { padding: 16px; border-radius: 14px; }
    .sd-content-box h2.sd-title { font-size: 17px; }
    .sd-content-box h2.sd-title::after { width: 36px; }
    .sd-detail-content > p:first-of-type {
        font-size: 12px;
        padding-left: 10px;
    }
    .sd-detail-content h2 {
        font-size: 13px !important;
        flex-wrap: wrap;
    }
    .sd-detail-content h2::after {display: none !important;}
    .sd-files-box { border-radius: 14px; }
    .sd-form-box { border-radius: 14px; }
    .sd-comments-box { border-radius: 14px; padding: 16px; }
    .sd-comment-reply { padding: 8px; }
    .sd-comment-reply .sd-comment-avatar { width: 24px; height: 24px; font-size: 10px; }
    .sd-cta { border-radius: 14px; }
    .sd-sidebar-box { border-radius: 14px; }
    .sd-list-item { padding: 6px; border-radius: 10px; }
    .sd-form-box .col-sm-6 { width: 100% !important; }
}

@media (max-width: 360px) {
    .sd-media img { height: 160px; }
    .sd-content-box h2.sd-title { font-size: 15px; }
    .sd-detail-content h2 { font-size: 12px !important; }
    .sd-meta-badge,
    .sd-meta-item,
    .sd-meta-read { display: none; }
    .sd-meta-size { margin-left: 0; }
}

/*---------------------------------------------------
   7.O Mission And Vision
-----------------------------------------------------*/
.ft-cb-val {
    display: block;
    word-break: break-word;
    white-space: normal;
    max-width: 200px; /* veya uygun bir genişlik */
}
/*---------------------------------------------------
   7.P Login
-----------------------------------------------------*/
#login-details-wrapper {
    background: var(--white-color);
    padding: 60px 0;
}

.lw-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border-radius: 20px;
    overflow: hidden;
    border: .5px solid #e0ede6;
}

.lw-left {
    background: #f0f7f3;
    padding: 52px 44px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.lw-left::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(29,158,117,0.1) 1.5px, transparent 1.5px);
    background-size: 20px 20px;
    pointer-events: none;
}

.lw-left-circle1 {
    position: absolute;
    right: -60px;
    bottom: -60px;
    width: 220px;
    height: 220px;
    border-radius: var(--radius-circle);
    border: 1px solid var(--primary-shadow-hover);
    pointer-events: none;
}

.lw-left-circle2 {
    position: absolute;
    right: -30px;
    bottom: -30px;
    width: 130px;
    height: 130px;
    border-radius: var(--radius-circle);
    border: 1px solid var(--primary-shadow-hover);
    pointer-events: none;
}

.lw-left-circle3 {
    position: absolute;
    left: -40px;
    top: -40px;
    width: 150px;
    height: 150px;
    border-radius: var(--radius-circle);
    border: 1px solid var(--primary-shadow-hover);
    pointer-events: none;
}

.lw-left-tag {
    color: var(--primary-color);
    font-size: 1rem;
    font-weight: 800;
    margin-bottom: 14px;
    position: relative;
    z-index: 2;
}

.dt-anka { color: var(--secondary-color); font-size: 1.2rem; }
.dt-mind { color: var(--primary-color); font-size:1rem }

.lw-left-title {
    color: #0c4527;
    font-size: 2rem;
    font-weight: 900;
    line-height: 1.05;
    margin-bottom: 14px;
    position: relative;
    z-index: 2;
}

.lw-left-title span {color: #0c4527;}

.lw-left-desc {
    color: var(--grey-color-deep);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.6;
    margin-bottom: 24px;
    position: relative;
    z-index: 2;
}

.lw-switch-link {
    color: var(--grey-color-xxdark);
    font-size: 1rem;
    position: relative;
    z-index: 2;
}

.lw-switch-link a {
    color: var(--primary-color);
    font-weight: 700;
    text-decoration: none;
}

.lw-right {
    background: var(--white-color);
    padding: 52px 44px;
    border-left: .5px solid #e0ede6;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.lw-pills {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    margin-bottom: 24px !important;
    width: 100% !important;
    align-items: stretch !important;
}

.lw-pill {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 8px !important;
    border-radius: 30px !important;
    padding: 10px 16px !important;
    cursor: pointer !important;
    transition: all .2s !important;
    border: none !important;
    text-align: left !important;
}

.lw-pill.active {background: var(--primary-color-dark);}

.lw-pill:not(.active) {
    background: var(--primary-shadow);
    border: .5px solid #e0ede6;
}

.lw-pill-icon {
    font-size: 1rem;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.lw-pill.active .lw-pill-icon {
    color: var(--primary-color);
    background: var(--white-color);
}

.lw-pill:not(.active) .lw-pill-icon {
    color: var(--white-color);
    background:var(--primary-color);
}

.lw-pill-label {
    font-size: 1rem;
    font-weight: 700;
    line-height: 1;
}

.lw-pill.active .lw-pill-label {color: var(--white-color);}

.lw-pill:not(.active) .lw-pill-label {color: var(--primary-color);}

.lw-pill-sub {font-size: .8rem; margin-top: 2px;}

.lw-pill.active .lw-pill-sub {color: var(--grey-color-light);}

.lw-pill:not(.active) .lw-pill-sub {color: var(--grey-color-deep);}

.lw-group {margin-bottom: 14px;}

.lw-label {
    color: var(--grey-color-xdark);
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 6px;
    display: block;
}

.lw-group .input input,
.lw-group select {
    color: #0c4527 !important;
    background: #f8fbf9 !important;
    border: .5px solid #e0ede6 !important;
    border-radius: 10px !important;
    padding: 12px 14px !important;
    font-size: 1rem !important;
    width: 100% !important;
    outline: none !important;
    transition: border-color .2s !important;
}

.lw-group .input input:focus,
.lw-group select:focus {border-color: var(--primary-color) !important;}

.lw-grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.lw-row {
    font-size: 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
}

.lw-row a {
    color: var(--primary-color);
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none;
}

.lw-row .checkbox {
    color: var(--grey-color-deep);
    font-size: .97rem;
}

.am-btn.am-btn-primary {
    width: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
}

.am-btn-primary:hover {background: var(--primary-color) !important;}

.lw-panel {display: none;}

.lw-panel.active {display: block;}

/* Tablet yatay — 992px - 1199px */
@media (max-width: 1199px) {
    .lw-left {padding: 44px 36px;}
    .lw-right {padding: 44px 36px;}
    .lw-left-title {font-size: 30px;}
}

/* Tablet dikey — 768px - 991px */
@media (max-width: 991px) {
    .lw-inner {grid-template-columns: 1fr 1fr;    }
    .lw-left {padding: 36px 28px;}
    .lw-right {padding: 36px 28px;}
    .lw-left-title {font-size: 26px;}
    .lw-left-desc {font-size: 11px;}
    .lw-grid-2 {grid-template-columns: 1fr;}
}

/* Tablet dikey / büyük mobil — 576px - 767px */
@media (max-width: 767px) {
    #login-details-wrapper {padding: 40px 0;}
    .lw-inner {
        grid-template-columns: 1fr;
        border-radius: 16px;
    }
    .lw-left {
        padding: 36px 28px;
        min-height: unset;
    }
    .lw-left-title {font-size: 28px;}
    .lw-left-circle1,
    .lw-left-circle2,
    .lw-left-circle3 {display: none;}
    .lw-right {
        padding: 32px 28px;
        border-left: none;
        border-top: .5px solid #e0ede6;
    }
    .lw-pill-sub {display: none;}
    .lw-pills {margin-bottom: 20px;}
}

/* Mobil — 575px ve altı */
@media (max-width: 575px) {
    #login-details-wrapper {padding: 24px 0;    }
    .lw-inner {border-radius: 12px;    }
    .lw-left {padding: 28px 20px;    }
    .lw-left-title {
        font-size: 24px;
        margin-bottom: 10px;
    }
    .lw-left-desc {display: none;    }
    .lw-right {padding: 24px 20px;    }
    .lw-pill {padding: 8px 12px;    }
    .lw-pill-icon {
        width: 24px;
        height: 24px;
        font-size: 12px;
    }
    .lw-pill-label {font-size: 10px;    }
    .lw-group .input input,
    .lw-group select {
        padding: 10px 12px !important;
        font-size: 12px !important;
    }
    .am-btn-primary {
        padding: 11px !important;
        font-size: 12px !important;
    }
    .lw-grid-2 {
        grid-template-columns: 1fr;
        gap: 0;
    }
}
/*---------------------------------------------------
   7.R Profile Overview
-----------------------------------------------------*/
#dashboard-profile-content{
    background: var(--white-color);
    padding: 2.5rem 0;
}
.dashboard-user {
    background-color: var(--white-color);

    padding-top: 2.5rem;
    position: relative;
}

.dashboard-user-header {
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-lg);
    box-shadow: 0 15px 40px -12px rgba(217,220,232,1);
    padding: 1rem;
}

.dashboard-user-left {
    display: flex;
    align-items: center;
    position: relative;
}

.dashboard-user-left::before {
    background-color: var(--grey-color-light);
    border-radius: var(--radius-lg);
    content: "";
    width: 1px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
}

.dashboard-user-avatar {
    border: 2px solid var(--grey-color-light);
    border-radius: var(--radius-lg);
    width: 125px;
    height: 125px;
    position: relative;
    top: -87px;
}

.dashboard-user-avatar img {
    background-color: var(--white-color);
    width: 100%;
    height: 100%;
    border-radius: var(--radius-md);
}

.dashboard-user-info {
    margin-left: 1.5rem;
}

.dashboard-user-info h4 {
    color: var(--color-footer-top);
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0 0 .5rem 0;
    padding: 0;
}

.dashboard-user-info h4 span {
    font-weight: 400;
}

.dashboard-user-info p {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 500;
    margin: 0;
    padding: 0;
}

.dashboard-user-right ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

ul.social-share {
    margin-top: 1.4rem;
    padding-top: 1rem;
    flex-wrap:wrap;
    position: relative;
}
ul.social-share::before {
    background-color: var(--grey-color-light);
    border-radius:var(--radius-lg);
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
}
ul.social-share li:not(:last-child) {margin:0 10px 10px 0;}
ul.social-share li a {
    background:linear-gradient(145deg,#e2e8ec,var(--white-color));
    font-size:1rem;
    line-height:42px;
    text-align:center;
    border-radius:var(--radius-lg);
    box-shadow:5px 5px 15px #d1d9e6,-5px -5px 15px var(--white-color);
    width:42px;
    height:42px;
    /*letter-spacing:2px;*/
    display:inline-block;
    z-index:1;
    transition: all 0.4s;
}
ul.social-share li a:before {
    background:linear-gradient(to right bottom,#212428,#16181c);
    border-radius:var(--radius-lg);
    content:"";
    width:100%;
    height:100%;
    position:absolute;
    top:0;
    left:0;
    z-index:-1;
    opacity:0;
    transition: all 0.4s;
}
ul.social-share li a:hover {transform:translateY(-5px);}
ul.social-share li a:hover i{color: var(--white-color);}
ul.social-share li a:hover:before {
    opacity:1;
    background: var(--primary-background);
}
ul.social-share li a i {
    font-size: 1rem;
    color:var(--color-footer-top);
    line-height:2.75;
    width:25px;
    position:relative;
}

.tooltip {
    --bs-tooltip-bg: var(--color-footer-top) !important;
    --bs-tooltip-color: var(--white-color) !important;
}

.tooltip-arrow::before {
    border-top-color: var(--color-footer-top) !important;
    border-bottom-color: var(--color-footer-top) !important;
    border-left-color: var(--color-footer-top) !important;
    border-right-color: var(--color-footer-top) !important;
}


/*--------- Profile Social Media ---------*/

.dashboard-user-header .dashboard-user-right {}

.dashboard-user-header .dashboard-user-right ul {
    display: flex;
    flex-wrap: wrap;
    gap:.75rem;
}

.dashboard-user-header .dashboard-user-right ul li{
    font-size: 1rem;
    color: var(--color-footer-top);
    font-weight:500;
    line-height: 1.5;
    margin-bottom: .5rem;
    flex: 1 1 45%;
}

@media (max-width: 767px) {
    .dashboard-user-header .dashboard-user-left::before {
        background:none;
    }
    .dashboard-user-header .dashboard-user-right ul li{
        flex: 1 1 100%;
    }

    .dashboard-user-header .dashboard-user-right ul li:nth-child(even) {
        margin-left: 0;
    }
}

.dashboard-user-header .dashboard-user-right ul li span {
    color:var(--color-footer-top);
    display: block;
    font-size: 1rem;
    font-weight: 700;
}

/* MENU */

.dashboard-menu {
    background: var(--white-color);
    box-shadow: 0 15px 40px -12px rgba(217,220,232,1);
    border: 1px solid var(--grey-color-light);
    border-radius: 12px;
    flex-wrap: nowrap;
    width: 100%;
    height: auto;
    margin: 0;
    padding:1rem;
}

.dashboard-menu .nav-item {
    margin: 0;
    margin-top: 4px;
}

.dashboard-menu .nav-item .nav-link {
    font-size: 1rem;
    color:var(--color-footer-top);
    font-weight: 500;
    border: none;
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    width: 100%;
    height:50px;
    margin: 0;
    padding:.5rem .75rem;
    transition: all 0.4s;
}

.dashboard-menu .nav-item .nav-link.active,
.dashboard-menu .nav-item .nav-link:hover {
    background: var(--primary-color) !important;
    box-shadow: none !important;
    color: var(--white-color);
    transition: all 0.4s;
}


.dashboard-body {}

.dashboard-body .dashboard-card-wrapper {
    background: var(--white-color);
    box-shadow: 0 15px 40px -12px rgba(217,220,232,1);
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-lg);
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}

.dashboard-card-wrapper .dashboard-card-step {
    border-radius: var(--radius-lg);
    /*margin-bottom: 1.5rem;*/
    padding: 0 0 .75rem 0;
    position: relative;
    /* z-index: 1; */
}

h2.dashboard-title {
    font-size:1.2rem;
    font-weight: 700;
    color: var(--color-footer-top);
    line-height: 1.4;
    text-align:left;
    margin-bottom:1.5rem;
    position:relative;
}

h2.dashboard-title::after {
    background:var(--grey-color-light);
    border-radius:var(--radius-lg);
    content:"";
    width:100%;
    height:1px;
    position:absolute;
    bottom:-10px;
    left:0;
}


.cc-one {
    --bg-color: #ffd861;
    --bg-color-light: #ffeeba;
    --text-color:#D98A19;
    --text-color-hover:#D98A19;
    --box-shadow-color: rgba(255, 215, 97, 0.48);
}
.cc-two {
    --bg-color: #B8F9D3;
    --bg-color-light: #e2fced;
    --text-color:#4fc391;
    --text-color-hover: #4fc391;
    --box-shadow-color: rgba(184, 249, 211, 0.48);
}
.cc-three {
    --bg-color: #CEB2FC;
    --bg-color-light: #F0E7FF;
    --text-color:#6a5297;
    --text-color-hover: #6a5297;
    --box-shadow-color: rgba(206, 178, 252, 0.48);
}
.cc-four {
    --bg-color: #DCE9FF;
    --bg-color-light: #f1f7ff;
    --text-color:#3b6cb7;
    --text-color-hover: #3b6cb7;
    --box-shadow-color: rgba(220, 233, 255, 0.48);
}
.cc-five {
    --bg-color: #FFB7B7;
    --bg-color-light: #FFE3E3;
    --text-color: #C0392B;
    --text-color-hover: #C0392B;
    --box-shadow-color: rgba(255, 183, 183, 0.48);
}
.cc-six {
    --bg-color: #E1E6EC;
    --bg-color-light: #F4F6F9;
    --text-color: #4A5A6A;
    --text-color-hover: #4A5A6A;
    --box-shadow-color: rgba(225, 230, 236, 0.48);
}

.card-counter {
    background: var(--white-color);
    border-radius:var(--radius-lg);
    text-decoration: none;
    /*width: 220px;*/
    min-height:225px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
    box-shadow: 0 15px 40px -12px rgba(217,220,232,1);
    transition: all 0.4s ease-out;
}
.card-counter p {
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-footer-top);
    margin-top: 30px;
    position: absolute;
    bottom: 0%;
    /*left: 50%;*/
    z-index: 1000;
    /*transform: translate(-50%,-20%);*/
    transition: color 0.4s ease-out;
}
.card-counter:hover {
    transform: translateY(-5px) scale(1.005) translateZ(0);
    box-shadow: 0 24px 36px rgba(0,0,0,0.11),0 24px 46px var(--box-shadow-color);
}
.card-counter:hover .cc-overlay {transform: scale(5) translateZ(0);}
.card-counter:hover .cc-circle {
    background: var(--bg-color);
    border-color: var(--bg-color-light);
}
.card-counter:hover .cc-circle:after {background: var(--bg-color-light);}
.card-counter:hover p {color: var(--text-color-hover);}
.card-counter:active {
    transform: scale(1) translateZ(0);
    box-shadow: 0 15px 24px rgba(0,0,0,0.11),0 15px 24px var(--box-shadow-color);
}

.cc-circle {
    background: var(--white-color);
    border-radius: var(--radius-circle);
    border: 2px solid var(--bg-color);
    width: 131px;
    height: 131px;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    transform: translate(-50%,-50%);
    transition: all 0.4s ease-out;
}
.cc-circle:after {
    background: var(--bg-color);
    border-radius: var(--radius-circle);
    content: "";
    width: 118px;
    height: 118px;
    position: absolute;
    top: 5px;
    left: 5px;
    display: block;
    transition: opacity 0.4s ease-out;
}
.cc-circle span{
    font-size: 2rem;
    font-weight: 600;
    color:var(--text-color);
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 10000;
    transform: translate(-50%,-50%);
}
.cc-overlay {
    background: var(--bg-color);
    border-radius: var(--radius-circle);
    width: 118px;
    height: 118px;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 0;
    transform: translate(-50%,-50%);
    transition: transform 0.4s ease-out;
}


.dashboard-announcements {
    margin-top: 2rem;
    border-radius: var(--radius-lg);
    margin-bottom: 1.5rem;
    padding: 0 0 1rem 0;
    position: relative;
}

/*------------*/
/*.card-multiple {
    background: var(--white-color);
    border-radius:var(--radius-lg);
    min-height: 325px;
    padding: 1.2rem;
    position: relative;
    box-shadow: 0 15px 40px -12px rgba(217,220,232,1);
    transition: all 0.4s ease-out;
}

.card-multiple h2 {
    font-size:1.2rem;
    font-weight: 700;
    color: var(--color-footer-top);
    line-height: 1.4;
    text-align:left;
    margin-bottom:1.5rem;
    position:relative;
}

.card-multiple h2::after {
    background:var(--grey-color-light);
    border-radius:var(--radius-lg);
    content:"";
    width:100%;
    height:1px;
    position:absolute;
    bottom:-10px;
    left:0;
}

.card-multiple.media ul{
    background: var(--white-color);
    border: none;
    border-radius: 0;
    padding: 6px 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    overflow: visible;
    position: relative;
}

.dbg1 {background: #dbf0fd;}
.dbg2 {background: #eadcf9;}
.dbg3 {background: #f9f7d1;}
.dbg4 {background: #f9e7e7;}

.card-multiple.media ul li{
    !*display: flex;
    align-items: center;
    margin-bottom: .3rem;
    min-height: auto;*!
    margin-bottom: .5rem;
    min-height: 62px;
    display: block;
    width: 100%;
}

.card-multiple.media ul li .cmm-head {
    text-align: center;
    border-radius:var(--radius-lg);
    position: absolute;
    width:3.75rem;
    height: 3.75rem;
}

.card-multiple.media ul li .cmm-head span {
    font-size: 2rem;
    color:rgba(2,3,7,.2);
    font-weight: 300;
    line-height:3.75rem;
}

.card-multiple.media ul li .cmm-body {
    padding-left:70px;
}

.card-multiple.media ul li .cmm-body h4 {
    margin: 0;
    padding: 0;
}

.card-multiple.media ul li .cmm-body div{
    font-size: .9rem;
    color: var(--primary-color);
    font-weight:500;
}

.card-multiple.media ul li .cmm-body h4 a{
    color:var(--color-footer-top);
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.card-multiple.media ul li .cmm-body h4 a:hover {
    color: var(--primary-color);
}*/
.card-multiple {
    background: var(--white-color);
    border-radius:var(--radius-lg);
    min-height: 325px;
    padding: 1.2rem;
    position: relative;
    box-shadow: 0 15px 40px -12px rgba(217,220,232,1);
    transition: all 0.4s ease-out;
}

.card-multiple h2 {
    font-size:1.2rem;
    font-weight: 700;
    color: var(--color-footer-top);
    line-height: 1.4;
    text-align:left;
    margin-bottom:1.5rem;
    position:relative;
}

.card-multiple h2::after {
    background:var(--grey-color-light);
    border-radius:var(--radius-lg);
    content:"";
    width:100%;
    height:1px;
    position:absolute;
    bottom:-10px;
    left:0;
}

.card-multiple.media ul{
    background: var(--white-color);
    border: none;
    border-radius: 0;
    padding: 6px 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    overflow: visible;
    position: relative;
}




/* UPDATED */
.card-multiple.updated ul {
    padding-left:1.5rem;
    margin-bottom: 0;
    position: relative;
    list-style-type: none;
}

.card-multiple.updated ul li {
    color: var(--primary-color);
    font-size:.8rem;
    position: relative;
    line-height: 1;
    padding-bottom:1.5rem;
}

.card-multiple.updated ul li:before {
    background: var(--white-color);
    border: 2px solid var(--primary-color);
    border-radius:var(--radius-lg);
    content: "";
    width: 12px;
    height: 12px;
    margin-right: 15px;
    position: absolute;
    bottom:3px;
    left: -29px;
    z-index: 2;
}

.card-multiple.updated ul li:after {
    content: "";
    border: 1px solid var(--grey-color-light);
    border-radius:var(--radius-lg);
    position: absolute;
    bottom: 0;
    left: -23px;
    height: 100%;
}

.card-multiple.updated ul li:first-child:after {
    height: 92%;
}

.card-multiple.updated ul li:last-child {
    padding-bottom: 0;
}

.card-multiple.updated ul li:last-child:after {
    bottom: 3px;
    height: 100%;
}

.card-multiple.updated ul li div h3{
    color: var(--secondary-color);
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.5;
    margin: 0;
}

.card-multiple.updated ul li div h4 {
    color: var(--color-footer-top);
    font-size: .9rem;
    font-weight: 500;
    line-height: 1.5;
    margin: 0;
}

.card-multiple.updated ul li div h4 .patient-name {
    color: var(--color-footer-top);
    font-weight: 700;
}

.card-multiple.updated ul li div .appointment-date {
    font-size: .8rem;
    color: var(--primary-color);
    font-weight: 400;
    line-height: 1.5;
}

.card-comments {}

.card-comments h2 {
    font-size:1.2rem;
    font-weight: 700;
    color: var(--color-footer-top);
    line-height: 1.4;
    text-align:left;
    margin-bottom:1.5rem;
    position:relative;
}

.card-comments h2::after {
    background:var(--grey-color-light);
    border-radius:var(--radius-lg);
    content:"";
    width:100%;
    height:1px;
    position:absolute;
    bottom:-10px;
    left:0;
}

.ms-body .single-content {
    background: var(--white-color);
    box-shadow: 0 15px 40px -12px rgba(217,220,232,1);
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-lg);
    padding: 1rem;
    margin-bottom: 1.5rem;
}
.cc-item {
    border-radius:var(--radius-lg);
    box-shadow: 0 10px 50px 0 rgba(217,220,232,1);
    display: flex;
    align-items: center;
    /*justify-content: space-between;*/
    margin-bottom: 1.5rem;
    padding:1rem;
}
.cci-head {text-align: center; flex: 0 0 85px;flex-grow: 0;}
.cci-head span {
    color: var(--color-footer-top);
    font-size:1.8rem;
    font-weight: 600;
    line-height: 1;
    margin-bottom: .5rem;
    display: block;
}
.cci-head span + span {
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.2;
    color: var(--primary-color);
}
.cci-body {position: relative;left:32px;flex-grow: 1;}
.cci-body::before {
    background: var(--grey-color-light);
    border-radius:var(--radius-lg);
    content: "";
    width: 1px;
    height: auto;
    position: absolute;
    top: 0;
    bottom:0;
    left: -15px;
    display: inline-block;
}
.cci-body span{
    font-size: 1rem;
    font-weight: 500;
    color: var(--color-footer-top);
    padding-right: .55rem;
    vertical-align: middle;
}
.cci-body span i{
    background-color:var(--primary-shadow-hover);
    border-radius:var(--radius-lg);
    font-size:.9rem;
    color:var(--primary-color);
    line-height: 32px;
    text-align: center;
    margin-right:.3rem;
    width: 32px;
    height: 32px;
    transition: color 0.3s ease-in-out 0s;
}

.cci-body .comment-title p {
    font-size: 1rem;
    font-weight: 500;
    color: var(--color-footer-top);
    margin: 0 0 .6rem;
}

.cci-body .reply p {
    font-size: 1rem;
    font-weight: 500;
    color: var(--color-footer-top);
    margin: 0 0 .6rem;
}

.cci-body .comment-title p:first-child,.cci-body .reply p:first-child
{font-weight: 700;margin:10px 0 2px;}

.comment-category {
    display: flex;
    align-items: center;
    padding: .4rem 0;
    position: relative;
}
.comment-category::before {
    background:var(--grey-color-light);
    border-radius:var(--radius-lg);
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    top: 0;
    display: inline-block;
}
.comment-category a {
    display: block;
    transition: 0.4s;
}
.comment-category a img {
    width: 2rem;
    height: 2rem;
    border-radius: 100%;
    margin-right: .5rem;
    display: inline-block;
}
.comment-category a span {
    color:var(--color-footer-top);
    font-size: .875rem;
    font-weight: 600;
    line-height: 1.2;
    transition: 0.4s;
}
.comment-category a:hover span {color:var(--primary-color);}
.comment-category h5{
    font-size:.9rem;
    font-weight:500;
    color: var(--grey-color-dark);
    line-height: 1.4;
    margin:.4rem 0 0;
    position:relative;
}
.comment-category h5 em{color: var(--primary-color);}

.cci-foot {padding-left:2.5rem;}

.card-comments .btn-reply {
    background-color: rgba(0,0,0,0);
    font: normal normal 300 .8rem/1.5 var(--primary-font), sans-serif;
    color: var(--white-color) !important;
    text-align: center;
    outline: 0;
    border: 1px solid var(--primary-border-color);
    border-radius:var(--radius-lg);
    padding: .5rem 1rem;
    cursor: pointer;
    position: relative;
    z-index: 9;
    display: inline-block;
}
.card-comments .btn-reply:hover{color: var(--white-color);}
.card-comments .btn-reply::after {
    content: "";
    background-color: var(--primary-background);
    border-radius: 14px;
    width: 100%;
    z-index: -1;
    position: absolute;
    height: 100%;
    top: 7px;
    left: 7px;
    transition: 0.2s;
}
.card-comments .btn-reply:hover::after {
    top: 0;
    left: 0;
}

.card-comments .cc-other {
    color: var(--secondary-color);
    font-size: .9rem;
    font-weight: 400;
    line-height: 1.2;
    padding:0.5rem .75rem;
    display: inline-block;
}
.card-comments .cc-other a {
    font-size: .9rem;
    font-weight: 600;
    line-height: 1.2;
    color: var(--secondary-color);
}
.card-comments .cc-other a i{
    line-height: 1.6;
    vertical-align: middle;
    padding-left: .5rem;
}
.card-comments .cc-other a:hover{color:var(--primary-color);}

.card-comments .btn-reply:hover::after {
    top: 0;
    left: 0;
}


/*------*/
.operation-menu {
    background-color: var(--primary-background);
    color: var(--white-color);
    font-size: .9rem;
    border-radius:var(--radius-lg);
    padding: .55rem .75rem;
    position: relative;
    display: inline-block;
    cursor: pointer;
}
.operation-menu.unokay{background-color: var(--grey-color-light);}

.operation-menu .items-content {
    background: var(--white-color);
    border-radius:var(--radius-lg);
    border: 1px solid var(--grey-color-light);
    position: absolute;
    right: 0;
    width: 100%;
    height: auto;
    min-width: 11rem;
    max-width: 13rem;
    margin-top:1.75rem;
    padding: .5rem;
    outline: none;
    z-index: 500;
    opacity: 0;
    visibility: hidden;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    transition: all 0.5s ease-in-out;

}
.operation-menu:hover .items-content{
    margin-top: .5rem;
    opacity: 1;
    visibility: visible;
}
.operation-menu .items-content a {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.25;
    text-transform: capitalize;
    text-rendering: optimizeLegibility;
    text-align: left;
    padding: 0.3rem 0;
    border: none;
    outline: none;
    display:block;
    position: relative;
    transition:all 500ms ease !important;
}
.operation-menu .items-content a:before {
    background-color:var(--primary-background);
    display: inline;
    line-height: 0;
    border-radius:var(--radius-lg);
    content: "";
    width: 10px;
    height: 2px;
    opacity: 0;
    margin-right: 5px;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    transition:all 500ms ease !important;
}
.operation-menu .items-content a:hover {
    color: var(--primary-color);
    padding-left: 1rem !important;
}
.operation-menu .items-content a:hover::before {opacity: 1;}

.operation-menu:hover span,
.operation-menu:active span,
.operation-menu:focus span{color: var(--white-color);}



.no-record-message {
    text-align: center;          /* ortala */
    color: var(--color-footer-top); /* senin belirttiğin renk */
    font-weight: 600;            /* isteğe bağlı: biraz kalın */
    padding: 10px;               /* isteğe bağlı: boşluk */
}

ul.fcourse-tags {
    background: var(--white-color);
    border-radius: 0 0 var(--radius-lg) var(--radius-lg);
    width: 100%;
    list-style: none;
    margin: 0;
    padding:.75rem 0;
    display: inline-block;
}
ul.fcourse-tags li{
    color: var(--media-tags-color);
    font-size: .75rem;
    font-weight: 300;
    line-height: 1rem;
}
ul.fcourse-tags li,
ul.fcourse-tags li i{transition: all 0.4s ease-out;}
ul.fcourse-tags li:first-child{float: left;}
ul.fcourse-tags li:not(:first-child){float: right; margin-left:5px;}
ul.fcourse-tags li i{
    font-size: .8rem;
    color: var(--primary-color);
    margin: 0 5px;
}
ul.fcourse-tags li:hover,
ul.fcourse-tags li:hover i{color: var(--primary-color);}

ul.fcourse-rating {margin:0;display: block;}
ul.fcourse-rating li {
    position: relative;
    display: inline-block;
}
ul.fcourse-rating li:not(:nth-child(2)),
ul.fcourse-rating li.voting-area-result{margin: 0 10px 0 0;}

ul.fcourse-rating span {font-size:.8rem;}
ul.fcourse-rating span b,
ul.fcourse-rating span strong {font-weight: 600;}

ul.fcourse-rating li span {
    color: var(--primary-color);
    font-weight: bold;
}
ul.fcourse-rating li i {font-size: .8rem;padding:0;margin: 0;color: var(--primary-color);}
ul.fcourse-rating li i:not(:first-child){margin: 0 3px;}

.fcourse-content h4 {
    font-size: .9rem;
    font-weight: 600;
    line-height: 1.2;
    min-height: 2.5rem;
    margin:0 0 .7rem 0;
    padding: 0;
}
.fcourse-content h4 a{
    color: var(--secondary-color);
    transition: all 0.4s ease-out;
    white-space: normal;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}
.fcourse-content h4 a i {
    opacity: 0;
    position: relative;
    top: 10px;
    width: 0;
    transition: all 0.4s ease-out;
}
.fcourse-content h4 a:hover{color:var(--primary-color);}
.fcourse-content h4:hover a i {
    color:var(--primary-color);
    opacity: 1;
    top: 2px;
    width: 25px;
}

.password-reset{position: relative;display: block;padding: 15px 0;}
.password-reset a {
    color: var(--secondary-color) !important;
    font-size:1rem;
    font-weight: 600;
    letter-spacing: 2px;
    position: absolute;
    top:28px;
    left:3px;
    transform: translate(0%, -50%);
    text-decoration: none;
    text-align: center;
    padding:.5rem;
}

.password-reset a::before,
.password-reset a::after,
.password-reset a span::before,
.password-reset a span::after {
    background: transparent;
    content: '';
    width: 8px;
    height: 8px;
    position: absolute;
    transition: 1s;
}

.password-reset a::before {
    top: -2px;
    left: -2px;
    border-top: 2px solid var(--primary-border-color);
    border-left: 2px solid var(--primary-border-color);
    border-top-left-radius: var(--radius-lg);
}
.password-reset a::after {
    top: -2px;
    right: -2px;
    border-top: 2px solid var(--primary-border-color);
    border-right: 2px solid var(--primary-border-color);
    border-top-right-radius: var(--radius-lg);
}

.password-reset a span::before {
    bottom: -2px;
    left: -2px;
    border-bottom: 2px solid var(--primary-border-color);
    border-left: 2px solid var(--primary-border-color);
    border-bottom-left-radius: var(--radius-lg);
}
.password-reset a span::after {
    bottom: -2px;
    right: -2px;
    border-bottom: 2px solid var(--primary-border-color);
    border-right: 2px solid var(--primary-border-color);
    border-bottom-right-radius: var(--radius-lg);
}

.password-reset a:hover::before,
.password-reset a:hover::after,
.password-reset a:hover span::before,
.password-reset a:hover span::after  {
    width: calc( 265px / 2);
    height: calc( 50px / 2);
}

/*------*/
.cropsave-wrap {
    position: relative;
    cursor: pointer;
}
.cropsave-wrap input[type="file"] {
    position: absolute;
    z-index: -1;
    top: 6px;
    left: 0;
    font-size: 15px;
    color: rgb(153,153,153);
    display: none;
}

ul.cropsave-btn {
    font-family:var(--primary-font), sans-serif;
    padding: 0;
    list-style-type: none;
}
ul.cropsave-btn li {
    color:var(--white-color);
    font-size:1rem;
    line-height: 3em;
    border-radius:var(--radius-lg);
    width: 12em;
    height: 3em;
    margin:0 auto 1rem;
    box-shadow:0 15px 40px -12px rgba(217,220,232,1);
    transition: 0.3s;
    cursor: pointer;
    box-sizing: border-box;
}
ul.cropsave-btn li a{color: var(--white-color);}
ul.cropsave-btn li:nth-child(odd) {
    background: linear-gradient(to right, var(--primary-color), var(--primary-accent-color));
    text-align: left;
    padding-left: 10%;
    transform: perspective(500px) rotateY(15deg);
}
ul.cropsave-btn li:nth-child(even) {
    background: linear-gradient(to left, var(--primary-color), var(--primary-accent-color));
    text-align: right;
    padding-right: 10%;
    transform: perspective(500px) rotateY(-15deg);
}
ul.cropsave-btn li:nth-child(odd):hover {
    transform: perspective(200px) rotateY(15deg);
    padding-left: 5%;
}
ul.cropsave-btn li:nth-child(even):hover {
    transform: perspective(200px) rotateY(-15deg);
    padding-right: 5%;
}

/* Modifier: Yan yana görünüm */
ul.cropsave-btn--inline {
    display: flex;
    justify-content: center;
    gap: 0;
    flex-wrap: wrap;
}
@media (max-width: 576px) {
    ul.cropsave-btn--inline {
        flex-direction: column;
        gap: 1rem;
    }
}

/*-----*/
#webcam-video {
    border-radius:var(--radius-lg);
    margin: 0 0 -4px 0;
    width:100%;
    height:100%;
    box-shadow:0 15px 40px -12px rgba(217,220,232,1);
}
#webcam-photo {
    border-radius:var(--radius-lg);
    width: 100%;
    height: 100%;
    margin: 0 !important;
}
#webcam-canvas {display:none;}
.webcam-wrap {
    max-width: 320px;
    display: inline-block;
    box-shadow: 0 1px 15px rgba(217,220,232,1);
    padding: .75rem;
    border-radius:var(--radius-lg);
}
.webcam-output {
    max-width: 320px;
    display: inline-block;
    box-shadow: 0 1px 15px rgba(217,220,232,1);
    padding: .75rem;
    border-radius:var(--radius-lg);
}

/*---------------------------------------------------
   7.S Statistics
-----------------------------------------------------*/
.statistics-item {
    border-radius: var(--radius-lg);
    box-shadow: 0 10px 50px 0 rgba(217,220,232,1);
    /*display: flex;*/
    align-items: center;
    margin-top: 1.5rem;
    padding:1rem;
    position: relative;
}

/*---------------------------------------------------
   7.T Patients
-----------------------------------------------------*/
.pt-controls { display: flex; flex-direction: column; gap: 12px; margin-bottom: 24px; }

.pt-search-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

.pt-search-field {
    flex: 1; min-width: 240px;
    display: flex; align-items: center; gap: 10px;
    background: var(--white-color); border: 1.5px solid #e8eaf2;
    border-radius: 14px; padding: 0 16px;
    transition: border-color .2s, box-shadow .2s;
}
.pt-search-field:focus-within {
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--color-footer-top) 10%, transparent);
}
.pt-search-field svg { color: #c0c4d4; flex-shrink: 0; }
.pt-search-field input {
    color: var(--color-footer-top);
    padding: 13px 0;
    background: transparent;
    font-size: 1rem;
    flex: 1; border: none;
    outline: none;
}
.pt-search-field input::placeholder { color: #c0c4d4; }

.pt-search-submit {
    background: var(--color-footer-top);
    color: var(--white-color);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: .9rem;
    font-weight: 700;
    padding: 12px 22px;
    border-radius: 14px;
    border: none;
    cursor: pointer;
    box-shadow: 0 4px 16px color-mix(in srgb, var(--color-footer-top) 28%, transparent);
    transition: filter .18s, transform .18s;
    white-space: nowrap;
}
.pt-search-submit:hover { filter: brightness(1.1); transform: translateY(-1px); }

.pt-search-clear {
    background: #f4f6fb;
    color: var(--color-footer-top);
    border: 1.5px solid #e8eaf2;
    font-size: .9rem;
    font-weight: 700;
    padding: 12px 18px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    text-decoration: none;
    transition: all .18s;
    white-space: nowrap;
}
.pt-search-clear:hover {
    background: var(--color-footer-top);
    color: var(--white-color);
}

.pt-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.pt-filter {
    font-size: .8rem;
    font-weight: 700;
    padding: 7px 15px;
    border-radius: 99px;
    border: 1.5px solid #e8eaf2;
    background: var(--white-color);
    color: #9aa0b4;
    text-decoration: none; transition: all .18s;
}
.pt-filter:hover {
    color: var(--color-footer-top);
    border-color: var(--color-footer-top);
}
.pt-filter.is-active {
    color: var(--white-color);
    background: var(--color-footer-top);
    border-color: var(--color-footer-top);
    box-shadow: 0 3px 14px color-mix(in srgb, var(--color-footer-top) 28%, transparent);
}

.pt-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.pt-card {
    background: var(--white-color);
    border: 1px solid #eaecf2;
    border-radius: 16px;
    padding: 16px 20px;
    display: flex;
    align-items: center;
    gap: 14px;
    transition: border-color .2s, box-shadow .2s, transform .2s;
    animation: ptUp .4s ease both;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.pt-av {
    width: 44px; height: 44px; border-radius: 13px;
    background: color-mix(in srgb, var(--color-footer-top) 10%, var(--white-color));
    color: var(--color-footer-top);
    font-size: 1rem; font-weight: 800;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
    border: 1.5px solid color-mix(in srgb, var(--color-footer-top) 18%, var(--white-color));
}

.pt-info {
    flex: 1; min-width: 0;
}
.pt-info > p {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 700;
    margin: 0 0 3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.pt-info > span {
    color: #9aa0b4;
    font-size: .9rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
}

.pt-meta {
    flex: 1; min-width: 0;
}
.pt-meta > span:first-child {
    color: #c0c4d4;
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 3px;
    display: block;
}
.pt-meta > span:last-child {
    font-size: .9rem;
    font-weight: 600;
    color: var(--color-footer-top);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
}

.pt-badge {
    font-size: .8rem;
    font-weight: 700;
    padding: 5px 10px;
    border-radius: 8px;
    flex: 0 0 130px;
    justify-content: center;
    white-space: normal;
    line-height: 1.3;
    text-align: center;
}
.pt-badge-dot { width: 5px; height: 5px; border-radius: 50%; background: currentColor; flex-shrink: 0; }

.pt-btn {
    color: var(--color-footer-top);
    background: color-mix(in srgb, var(--color-footer-top) 8%, var(--white-color));
    border: 1.5px solid color-mix(in srgb, var(--color-footer-top) 20%, var(--white-color));
    font-size: .9rem;
    font-weight: 700;
    padding: 8px 14px;
    border-radius: 10px;
    text-decoration: none;
    flex-shrink: 0;
    display: inline-flex; align-items: center; gap: 6px;
    transition: all .2s;
    white-space: nowrap;
    cursor: pointer;
}
.pt-btn:hover {
    background: var(--color-footer-top); color: var(--white-color); border-color: var(--color-footer-top);
}

@media (max-width: 640px) {
    .pt-card { flex-wrap: wrap; }
    .pt-av   { flex-shrink: 0; }
    .pt-info { flex: 1; min-width: 0; }
    .pt-meta { flex: 1 0 45%; }
    .pt-badge { margin-left: auto; }
    .pt-btn  { width: 100%; justify-content: center; }
}
.pt-badge-dot { width: 5px; height: 5px; border-radius: 50%; background: currentColor; flex-shrink: 0; }
.pt-badge.yeni_basvuru        { background: #eff6ff; color: #3b82f6; border: 1px solid #bfdbfe; }
.pt-badge.terapi_devam_ediyor { background: #f0fdf4; color: #16a34a; border: 1px solid #bbf7d0; }
.pt-badge.kontrol_bekleniyor  { background: var(--white-color)beb; color: #d97706; border: 1px solid #fde68a; }
.pt-badge.tamamlandi          { background: #f5f3ff; color: #7c3aed; border: 1px solid #ddd6fe; }
.pt-badge.iptal_gelmedi       { background: #fef2f2; color: #dc2626; border: 1px solid #fecaca; }
.pt-badge.unknown             { background: #f4f6fb; color: #9aa0b4; border: 1px solid #e8eaf2; }

.pt-btn {
    color: var(--color-footer-top);
    background: color-mix(in srgb, var(--color-footer-top) 8%, var(--white-color));
    border: 1.5px solid color-mix(in srgb, var(--color-footer-top) 20%, var(--white-color));
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: .8rem;
    font-weight: 700;
    padding: 5px 14px;
    border-radius: 10px;
    text-decoration: none;
    transition: all .2s;
    white-space: nowrap;
}
.pt-btn:hover {
    background: var(--color-footer-top);
    color: var(--white-color);
    border-color: var(--color-footer-top);
}

.pt-empty-state {
    text-align: center;
    padding: 64px 24px;
    background: #f8f9fb;
    border: 1px solid #eaecf2;
    border-radius: 16px;
}
.pt-empty-state svg {
    display: block;
    margin: 0 auto 14px;
    opacity: .25;
}
.pt-empty-state > p {
    color: var(--color-footer-top);
    font-size: 1.2rem;
    font-weight: 700;
    margin: 0 0 5px;
}
.pt-empty-state > span {
    color: var(--grey-color);
    font-size: 1rem;
}

.pt-loader {
    color: #b0b6c8;
    font-size: .8rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 22px;
    opacity: 0;
    transition: opacity .25s;
}
.pt-end {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 800;
    text-align: center;
    padding: 16px;
    opacity: 0;
    transition: opacity .3s;
}

.pt-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.35);
    z-index: 9998;
    opacity: 0;
    pointer-events: none;
    transition: opacity .3s;
    backdrop-filter: blur(3px);
}
.pt-overlay.open { opacity: 1; pointer-events: all; }

.pt-panel {
    position: fixed; top: 0; right: 0; bottom: 0;
    width: 420px; max-width: 100vw;
    background: var(--white-color); z-index: 9999;
    transform: translateX(100%); transition: transform .35s cubic-bezier(.4,0,.2,1);
    display: flex; flex-direction: column;
    box-shadow: -8px 0 48px rgba(0,0,0,.12);
}
.pt-panel.open { transform: translateX(0); }

.pt-panel-head {
    padding: 24px 24px 20px;
    border-bottom: 1px solid #f0f2f7;
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
    flex-shrink: 0;
}
.pt-panel-head-left { display: flex; align-items: center; gap: 14px; }

.pt-panel-av {
    background: color-mix(in srgb, var(--color-footer-top) 12%, var(--white-color));
    color: var(--color-footer-top);
    border: 2px solid color-mix(in srgb, var(--color-footer-top) 20%, var(--white-color));
    font-size: 1.6rem;
    font-weight: 900;
    width: 52px;
    height: 52px;
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.pt-panel-head-left > div > p {
    font-size: 1rem;
    font-weight: 800;
    color: var(--color-footer-top);
    margin: 0 0 4px;
}

.pt-panel-close {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: var(--grey-color-xlight);
    border: 1.5px solid var(--grey-color);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--grey-color-dark);
    transition: all .18s;
    flex-shrink: 0;
}
.pt-panel-close:hover { background: #fee2e2; border-color: #fecaca; color: #dc2626; }

.pt-panel-body { padding: 24px; overflow-y: auto; flex: 1; }

.pt-panel-section { margin-bottom: 24px; }
.pt-panel-section-title {
    color: var(--color-footer-top);
    font-size: 1.2rem;
    font-weight: 800;
    margin-bottom: 12px;
}

.pt-panel-row {
    background: var(--grey-color-xlight);
    padding: 10px 14px;
    border-radius: 10px;
    margin-bottom: 6px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.pt-panel-row > span:first-child {
    color: #b0b6c8;
    font-size: .9rem;
    font-weight: 700;
}
.pt-panel-row > span:last-child {
    color: var(--color-footer-top);
    font-size: .9rem;
    font-weight: 600;
}

@keyframes ptUp {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: translateY(0); }
}


@media (max-width: 768px) {
    .pt-card {
        grid-template-columns: 40px 1fr auto;
        grid-template-rows: auto auto;
        gap: 10px 12px;
    }
    .pt-meta { display: none; }
    .pt-badge { grid-column: 1 / -1; }
    .pt-btn   { grid-column: 3; grid-row: 1; }
    .pt-panel { width: 100vw; }
}


/* ─────────────────────── SECRETER PATIENTS ───────────────────────── */

.pt {
    font-family: inherit;
    padding-bottom: 40px;
}

.pt-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 24px;
    flex-wrap: wrap;
}

.pt-header__title {
    font-size: 1.2rem;
    font-weight: 800;
    color: var(--color-footer-top);
    letter-spacing: -0.02em;
    margin: 0;
}

.pt-header__sub {
    font-size: .82rem;
    color: var(--grey-color-dark);
    margin-top: 3px;
}

.pt-header__right {
    display: flex;
    align-items: center;
    gap: 8px;
}


/* ── BUTONLAR ─────────────────────────────────────────────────── */


.pt-btn--ghost {
    background: transparent;
    color: var(--grey-color-dark);
    border-color: var(--grey-color-light);
}

.pt-btn--ghost:hover {
    background: var(--grey-color-xlight);
    color: var(--black-base);
}


/* ── İSTATİSTİK KARTLARI ──────────────────────────────────────── */

.pt-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 20px;
}

.pt-stat {
    background: var(--white-color);
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-sm);
    padding: 16px 18px;
    box-shadow: 0 15px 40px -12px rgba(217,220,232,1);
}

.pt-stat__num {
    color: var(--color-footer-top);
    font-size: 2rem;
    font-weight: 800;
    line-height: 1;
}

.pt-stat__num--green  { color: var(--primary-color); }
.pt-stat__num--amber  { color: #BA7517; }
.pt-stat__num--red    { color: #A32D2D; }

.pt-stat__label {
    color: var(--grey-color-dark);
    font-size: 1rem;
    font-weight: 500;
    margin-top: 5px;
}

.pt-stat__bar {
    height: 3px;
    border-radius: 2px;
    background: var(--grey-color-light);
    margin-top: 12px;
    overflow: hidden;
}

.pt-stat__bar-fill {
    height: 100%;
    border-radius: 2px;
    transition: width 0.4s ease;
}

.pt-stat__bar-fill--blue  { background: #185FA5; }
.pt-stat__bar-fill--green { background: var(--primary-color); }
.pt-stat__bar-fill--amber { background: #BA7517; }
.pt-stat__bar-fill--red   { background: #A32D2D; }


/* ── TOOLBAR (ARAMA + FİLTRE) ─────────────────────────────────── */

.pt-toolbar {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}

.pt-search-wrap {
    box-shadow: 0 15px 40px -12px rgba(217,220,232,1);
    position: relative;
    flex: 1;
    min-width: 240px;
}

.pt-search-wrap > svg {
    color: var(--grey-color);
    position: absolute;
    left: 11px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    z-index: 1;
}

.pt-search {
    background: var(--white-color);
    color: var(--black-base);
    font-size: 1rem;
    width: 100%;
    height: 36px;
    padding: 0 12px 0 34px;
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    transition: var(--transition-all-fast);
}

.pt-search:focus {
    outline: none;
    box-shadow: 0 0 0 1px rgba(17,34,53,.06);
}

.pt-search::placeholder {color: var(--grey-color);}

.pt-filter-group {
    display: flex;
    align-items: center;
    gap: 8px;
}

.pt-select-wrap {
    position: relative;
    display: flex;
    align-items: center;
}

.pt-select-wrap > svg {
    color: var(--grey-color);
    position: absolute;
    right: 10px;
    pointer-events: none;
}

.pt-filter-select {
    background: var(--white-color);
    color: var(--color-footer-top);
    font-size: 1rem;
    height: 36px;
    padding: 0 30px 0 12px;
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    appearance: none;
    cursor: pointer;
    min-width: 155px;
    transition: var(--transition-all-fast);
}

.pt-filter-select:focus {outline: none;}

/* ── CANLI ARAMA DROPDOWN ─────────────────────────────────────── */

.pt-dropdown {
    background: var(--white-color);
    position: absolute;
    top: calc(100% + 5px);
    left: 0;
    right: 0;
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-sm);
    box-shadow: 0 8px 28px rgba(0,0,0,.1);
    z-index: 500;
    overflow: hidden;
}

.pt-dropdown__item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    cursor: pointer;
    border-bottom: 1px solid var(--grey-color-light);
    text-decoration: none;
    transition: background var(--transition-all-fast);
}

.pt-dropdown__item:last-child {
    border-bottom: none;
}

.pt-dropdown__item:hover {background: var(--grey-color-xlight);}

.pt-dropdown__avatar {
    width: 36px;
    height: 36px;
    border-radius: var(--radius-xs);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .8rem;
    font-weight: 700;
    flex-shrink: 0;
}

.pt-dropdown__info {
    flex: 1;
    min-width: 0;
}

.pt-dropdown__name {
    color: var(--black-base);
    font-size: 1rem;
    font-weight: 600;

}

.pt-dropdown__meta {
    color: var(--grey-color-dark);
    font-size: .9rem;
    margin-top: 1px;
}

.pt-dropdown__badge {
    font-size: .9rem;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: var(--radius-xs);
    white-space: nowrap;
    flex-shrink: 0;
}

.pt-dropdown__empty {
    color: var(--grey-color);
    font-size: 1rem;
    padding: 16px;
    text-align: center;
}

/* ── TABLO ────────────────────────────────────────────────────── */

.pt-table-wrap {
    background: var(--white-color);
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-sm);
    overflow: hidden;
    box-shadow: 0 15px 40px -12px rgba(217,220,232,1);
}

.pt-table-head {
    background: var(--grey-color-xlight);
    padding: 10px 18px;
    border-bottom: 1px solid var(--grey-color-light);
    display: grid;
    grid-template-columns: 44px 1fr 130px 190px 150px 90px;
}

.pt-table-head span {
    color: var(--grey-color-dark);
    font-size: 1rem;
    font-weight: 700;
}

.pt-table-row {
    padding: 12px 18px;
    border-bottom: 1px solid var(--grey-color-light);
    display: grid;
    grid-template-columns: 44px 1fr 130px 190px 150px 90px;
    align-items: center;
    transition: background var(--transition-all-fast);
}

.pt-table-row:last-child {border-bottom: none;}

.pt-table-row:hover {background: var(--grey-color-xlight);}

.pt-row-num {
    color: var(--grey-color-xdark);
    font-size: 1rem;
    font-weight: 600;
}

.pt-row-person {
    display: flex;
    align-items: center;
    gap: 10px;
}

.pt-avatar {
    font-size: .9rem;
    font-weight: 600;
    width: 36px;
    height: 36px;
    border-radius: var(--radius-xs);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.pt-row-name {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 700;
}

.pt-row-date {
    color: var(--grey-color-dark);
    font-size: .9rem;
    margin-top: 2px;
}

.pt-row-phone {
    color: var(--grey-color-dark);
    font-size: 1rem;
    font-variant-numeric: tabular-nums;
}

.pt-row-email {
    color: var(--grey-color-dark);
    font-size: 1rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── DURUM BADGE ──────────────────────────────────────────────── */

.pt-badge {
    font-size: .8rem;
    font-weight: 600;
    padding: 3px 9px;
    gap: 5px;
    border-radius: var(--radius-xs);
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
}

.pt-badge__dot {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    flex-shrink: 0;
}

.pt-badge--yeni    { background: #E6F1FB; color: #042C53; }
.pt-badge--yeni    .pt-badge__dot { background: #185FA5; }

.pt-badge--devam   { background: #EAF3DE; color: #27500A; }
.pt-badge--devam   .pt-badge__dot { background: var(--primary-color); }

.pt-badge--kontrol { background: #FAEEDA; color: #412402; }
.pt-badge--kontrol .pt-badge__dot { background: #BA7517; }

.pt-badge--tamam   { background: #EAF3DE; color: #085041; }
.pt-badge--tamam   .pt-badge__dot { background: #0F6E56; }

.pt-badge--iptal   { background: #FCEBEB; color: #501313; }
.pt-badge--iptal   .pt-badge__dot { background: #A32D2D; }


/* ── AKSIYON BUTONLARI ────────────────────────────────────────── */

.pt-row-actions {
    display: flex;
    align-items: center;
    gap: 5px;
}

.pt-icon-btn {
    background: var(--grey-color-xlight);
    color: var(--color-footer-top);
    width: 30px;
    height: 30px;
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    text-decoration: none;
    transition: var(--transition-all-fast);
}

.pt-icon-btn:hover {
    background: var(--grey-color-xlight);
    color: var(--color-footer-top);
    border-color: var(--color-footer-top);
}

.pt-icon-btn--green:hover {
    background: #EAF3DE;
    color: var(--primary-color);
    border-color: var(--primary-color);
}


/* ── BOŞ DURUM ────────────────────────────────────────────────── */

.pt-empty {
    color: var(--grey-color);
    gap: 14px;
    padding: 56px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.pt-empty p {
    color: var(--grey-color-dark);
    font-size: 1rem;
}


/* ── PAGİNASYON ───────────────────────────────────────────────── */

.pt-pagination {
    margin-top: 16px;
    display: flex;
    justify-content: center;
}


/* ── RESPONSİVE ───────────────────────────────────────────────── */

@media (max-width: 900px) {
    .pt-stats {
        grid-template-columns: repeat(2, 1fr);
    }

    .pt-table-head,
    .pt-table-row {
        grid-template-columns: 36px 1fr 110px 120px 90px;
    }

    .pt-table-head span:nth-child(4),
    .pt-table-row > .pt-row-email {
        display: none;
    }
}

@media (max-width: 600px) {
    .pt-stats {
        grid-template-columns: 1fr 1fr;
    }

    .pt-table-head,
    .pt-table-row {
        grid-template-columns: 1fr 100px 80px;
    }

    .pt-table-head span:nth-child(1),
    .pt-table-head span:nth-child(3),
    .pt-table-head span:nth-child(4),
    .pt-row-num,
    .pt-row-phone,
    .pt-row-email {
        display: none;
    }
}


/* ── LOADER & SON MESAJI ──────────────────────────────────────── */

.pt-loader {
    color: var(--grey-color-dark);
    font-size: 1rem;
    gap: 10px;
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pt-loader__dots {
    display: flex;
    gap: 5px;
}

.pt-loader__dots span {
    background: var(--color-footer-top);
    width: 6px;
    height: 6px;
    border-radius: 50%;
    opacity: 0.3;
    animation: ptDot 0.9s infinite ease-in-out both;
}

.pt-loader__dots span:nth-child(1) { animation-delay: -.3s; }
.pt-loader__dots span:nth-child(2) { animation-delay: -.15s; }

@keyframes ptDot {
    0%, 80%, 100% { transform: scale(0.5); opacity: 0.2; }
    40%            { transform: scale(1);   opacity: 1; }
}

.pt-end {
    color: var(--grey-color);
    font-size: .9rem;
    border-top: 1px solid var(--grey-color-light);
    padding: 16px;
    text-align: center;
}


/* ── SLIDE-OVER PANEL ─────────────────────────────────────────── */

.so-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    z-index: 9998;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease;
}

.so-backdrop--open {
    opacity: 1;
    pointer-events: all;
}

.so-panel {
    background: var(--white-color);
    width: 400px;
    max-width: 100vw;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 9999 !important;
    transform: translateX(100%);
    transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    flex-direction: column;
    box-shadow: -8px 0 32px rgba(0, 0, 0, 0.12);
}

.so-panel--open {transform: translateX(0);}

.so-head {
    background: var(--color-footer-top);
    padding: 18px 20px;
    border-bottom: 1px solid var(--grey-color-light);
    gap: 14px;
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.so-avatar {
    font-size: .9rem;
    font-weight: 700;
    width: 46px;
    height: 46px;
    border-radius: var(--radius-xs);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.so-head-info { flex: 1; min-width: 0; }

.so-head-name {
    color: var(--white-color);
    font-size: 1.5rem;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.so-head-meta {
    color: var(--grey-color-light);
    font-size: .9rem;
    margin-top: 2px;
}

.so-close {
    background: var(--grey-color-light);
    color: var(--color-footer-top);
    width: 30px;
    height: 30px;
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    transition: var(--transition-all-fast);
}

.so-close:hover {
    color: var(--white-color);
    background-color: var(--primary-color);
    border-color: var(--grey-color-light);
}

.so-body {
    flex: 1;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--grey-color-light) transparent;
}

.so-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 48px 20px;
}

.so-section {
    padding: 16px 20px;
    border-bottom: 1px solid var(--grey-color-light);
}

.so-section:last-child { border-bottom: none; }

.so-section-title {
    color: var(--grey-color-dark);
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 12px;
}

/* Bilgi grid */
.so-info-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.so-info-lbl {
    color: var(--grey-color-dark);
    font-size: 1rem;
    font-weight: 500;
    margin-bottom: 3px;
}

.so-info-val {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 600;
}

.so-appt {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid var(--grey-color-light);
}

.so-appt:last-child { border-bottom: none; }

.so-appt-date {
    width: 40px;
    height: 40px;
    border-radius: var(--radius-xs);
    background: var(--grey-color-xlight);
    border: 1px solid var(--grey-color-light);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.so-appt-day {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1;
}

.so-appt-mon {
    color: var(--grey-color-dark);
    font-size: .7rem;
    margin-top: 2px;
}

.so-appt-info { flex: 1; min-width: 0; }

.so-appt-name {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 600;
}

.so-appt-meta {
    color: var(--grey-color-dark);
    font-size: 1rem;
    margin-top: 1px;
}

.so-appt-status {
    font-size: .8rem;
    font-weight: 700;
    padding: 3px 8px;
    border-radius: var(--radius-xs);
    white-space: nowrap;
    flex-shrink: 0;
}

.so-appt-status--ol { background: #E6F1FB; color: #042C53; }
.so-appt-status--yy { background: #EAF3DE; color: #27500A; }
.so-appt-status--bk { background: #FAEEDA; color: #412402; }
.so-appt-status--ip { background: #FCEBEB; color: #501313; }

.so-foot {
    background: var(--grey-color-xlight);
    border-top: 1px solid var(--grey-color-light);
    display: flex;
    gap: 8px;
    padding: 14px 20px;
    flex-shrink: 0;
}

.so-foot-btn {
    font-size: 1rem;
    font-weight: 700;
    height: 36px;
    border-radius: var(--radius-xs);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex: 1;
    cursor: pointer;
    text-decoration: none;
    transition: var(--transition-all-fast);
    border: none;
}

.so-foot-btn--primary {
    background: var(--primary-color);
    color: var(--white-color);
}

.so-foot-btn--primary:hover {
    background: var(--color-footer-top);
    color: var(--white-color);
}

.so-foot-btn--ghost {
    background: var(--white-color);
    color: var(--grey-color-dark);
    border: 1px solid var(--grey-color-light);
}

.so-foot-btn--ghost:hover {
    color: var(--color-footer-top);
    border-color: var(--color-footer-top);
}

.pt-avatar,
.so-avatar,
.pt-dropdown__avatar {
    font-variant: normal;
    text-transform: none;
}

.seans-loader.visible {display: block;}

.seans-loader {
    color: var(--grey-color-dark);
    font-size: 1rem;
    gap: 10px;
    padding: 20px;
    display: flex !important;
    align-items: center;
    justify-content: center;
}

.seans-loader.visible {visibility: visible;}

.seans-loader-dots {
    display: flex;
    gap: 5px;
}

.seans-loader-dots span {
    background: var(--color-footer-top);
    width: 6px;
    height: 6px;
    border-radius: 50%;
    opacity: 0.3;
    animation: seansDot 0.9s infinite ease-in-out both;
}

.seans-loader-dots span:nth-child(1) { animation-delay: -.3s; }
.seans-loader-dots span:nth-child(2) { animation-delay: -.15s; }

@keyframes seansDot {
    0%, 80%, 100% { transform: scale(0.5); opacity: 0.2; }
    40%            { transform: scale(1);   opacity: 1; }
}

/* ─────────────────────── SECRETER PATIENTS CREATE ───────────────────────── */
.pc-wrap {padding-bottom: 40px; }

/* ── HEADER ────────────────────────────────────────────────────── */
.pc-page-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
    flex-wrap: wrap;
    gap: 12px;
}

.pc-page-title {
    font-size: 1.2rem;
    font-weight: 800;
    color: var(--color-footer-top);
    letter-spacing: -0.02em;
    margin: 0;
}

.pc-page-sub {
    font-size: .82rem;
    color: var(--grey-color-dark);
    margin-top: 3px;
}

.pc-back-btn {
    background: var(--white-color);
    color: var(--grey-color-dark);
    font-size: 1rem;
    font-weight: 600;
    border: 1px solid var(--grey-color-light);
    gap: 6px;
    height: 34px;
    padding: 0 14px;
    border-radius: var(--radius-xs);
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    transition: var(--transition-all-fast);
}

.pc-back-btn:hover {
    color: var(--color-footer-top);
    border-color: var(--color-footer-top);
}

/* ── ALERT ─────────────────────────────────────────────────────── */
.pc-alert-error {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 16px;
    background: #FCEBEB;
    border: 1px solid #F09595;
    border-radius: var(--radius-xs);
    font-size: .84rem;
    color: #501313;
    margin-bottom: 20px;
}

/* ── LAYOUT ────────────────────────────────────────────────────── */
.pc-layout {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 20px;
    align-items: start;
}

.pc-main { display: flex; flex-direction: column; gap: 16px; }

.pc-side { display: flex; flex-direction: column; gap: 16px; position: sticky; top: 20px; }

/* ── KARTLAR ───────────────────────────────────────────────────── */
.pc-card {
    background: var(--white-color);
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-sm);
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(0,0,0,.04);
}

.pc-card-head {
    background: var(--grey-color-light);
    gap: 12px;
    padding: 14px 20px;
    border-bottom: 1px solid var(--grey-color-light);
    display: flex;
    align-items: center;
}

.pc-card-head-icon {
    width: 32px;
    height: 32px;
    border-radius: var(--radius-xs);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.pc-card-head-title {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 700;
}

.pc-card-head-sub {
    color: var(--grey-color-dark);
    font-size: .9rem;
    margin-top: 1px;
}

.pc-card-head-step {
    background: var(--color-footer-top);
    color: var(--white-color);
    font-size: 1rem;
    font-weight: 700;
    margin-left: auto;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pc-card-body { background-color: var(--grey-color-xlight);  padding: 20px; }

/* ── FORM ALANLARI ─────────────────────────────────────────────── */
.pc-field-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-bottom: 16px;
}

.pc-field-row:last-child { margin-bottom: 0; }

.pc-field { display: flex; flex-direction: column; gap: 5px; }

.pc-label {
    color: var(--grey-color-dark);
    font-size: .9rem;
    font-weight: 700;
}

.pc-req { color: #A32D2D; margin-left: 2px; }
.pc-opt { color: var(--grey-color-xdark); font-weight: 400; font-size: .9rem; }

.pc-input {
    background: var(--white-color);
    color: var(--black-base);
    font-size: 1rem;
    width: 100%;
    height: 38px;
    padding: 0 12px;
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    transition: var(--transition-all-fast);
}

.pc-input:focus {
    outline: none;
    /*border-color: var(--color-footer-top);*/
    box-shadow: 0 0 0 1px rgba(17,34,53,.06);
}

.pc-input--error { border-color: #A32D2D !important; }

.pc-input--icon { padding-left: 34px; }

.pc-input-wrap {
    position: relative;
    display: flex;
    align-items: center;
}

.pc-input-icon {
    position: absolute;
    left: 11px;
    color: var(--grey-color);
    pointer-events: none;
}

.pc-phone-check {
    position: absolute;
    right: 10px;
    font-size: .72rem;
    font-weight: 600;
}

.pc-phone-check.ok { color: var(--primary-color); }
.pc-phone-check.err { color: #A32D2D; }

.pc-select-wrap {
    position: relative;
    display: flex;
    align-items: center;
}

.pc-select-wrap > svg {
    position: absolute;
    right: 10px;
    pointer-events: none;
    color: var(--grey-color);
}

.pc-select { appearance: none; cursor: pointer; padding-right: 28px; }

.pc-textarea {
    background: var(--white-color);
    color: var(--black-base);
    font-size: 1rem;
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    resize: vertical;
    min-height: 80px;
    transition: var(--transition-all-fast);
}

.pc-textarea:focus {
    outline: none;
    /* border-color: var(--color-footer-top);*/
    box-shadow: 0 0 0 1px rgba(17,34,53,.06);
}

.pc-hint {
    color: var(--grey-color-deep);
    font-size: .9rem;
    display: flex;
    align-items: center;
    gap: 4px;
}

/* ── FORM FOOTER ───────────────────────────────────────────────── */
.pc-form-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.pc-form-footer-note {
    color: var(--grey-color-dark);
    font-size: 1rem;
    display: flex;
    align-items: center;
    gap: 6px;
}

.pc-form-footer-btns { display: flex; gap: 8px; }

.pc-btn {
    font-size: 1rem;
    font-weight: 700;
    gap: 6px;
    height: 38px;
    padding: 0 18px;
    border-radius: var(--radius-xs);
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    text-decoration: none;
    border: none;
    transition: var(--transition-all-fast);
}

.pc-btn--ghost {
    background: var(--white-color);
    color: var(--grey-color-dark);
    border: 1px solid var(--grey-color-light);
}

.pc-btn--ghost:hover { border-color: var(--color-footer-top); color: var(--color-footer-top); }

.pc-btn--primary { background: var(--primary-color); color: var(--white-color); }
.pc-btn--primary:hover { background: var(--color-footer-top); color: var(--white-color); }

/* ── ÖNIZLEME KARTI ────────────────────────────────────────────── */
.pc-preview-card { }

.pc-preview-body {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 24px 20px;
    gap: 8px;
}

.pc-preview-avatar {
    background: #E6F1FB;
    color: var(--color-footer-top);
    font-size: 2rem;
    font-weight: 700;
    width: 64px;
    height: 64px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s;
}

.pc-preview-name {
    color: var(--color-footer-top);
    font-size: 1.2rem;
    font-weight: 700;
    text-align: center;
}

.pc-preview-status {
    background: #E6F1FB;
    color: var(--color-footer-top);
    font-size: .9rem;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: var(--radius-xs);
}

/* ── REHBER ────────────────────────────────────────────────────── */
.pc-guide-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--grey-color-light);
}

.pc-guide-icon {
    width: 35px;
    height: 35px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-top: 1px;
}

.pc-guide-icon.blue   { background: var(--grey-color-light); color: #185FA5; }
.pc-guide-icon.green  { background: var(--grey-color-light); color: var(--primary-color); }
.pc-guide-icon.amber  { background: var(--grey-color-light); color: #BA7517; }
.pc-guide-icon.purple { background: var(--grey-color-light); color: #534AB7; }
.pc-guide-icon.red    { background: var(--grey-color-light); color: #A32D2D; }

.pc-guide-title {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 2px;
}

.pc-guide-text {
    color: var(--grey-color-dark);
    font-size: .9rem;
    line-height: 1.5;
}

/* ── RESPONSIVE ────────────────────────────────────────────────── */
@media (max-width: 860px) {
    .pc-layout { grid-template-columns: 1fr; }
    .pc-side { position: static; }
    .pc-field-row { grid-template-columns: 1fr; }
}








/*---------------------------------------------------
   7.V Messages
-----------------------------------------------------*/

/*------------------- Doktor Message-------------------*/
.msg-wrap {
    background: var(--white-color);
    border: 1px solid var(--grey-color-light);
    height: 680px;
    margin-bottom: 20px;
    border-radius: var(--radius-lg);
    grid-template-columns: 280px 1fr;
    display: grid;
    overflow: hidden;
    box-shadow: 0 2px 24px rgba(0,0,0,0.07);

}

.msg-sidebar {
    display: flex;
    flex-direction: column;
    border-right: 1px solid #eef0f4;
    background: var(--white-color);
    overflow: hidden;
}

.msg-sidebar-head {
    padding: 18px 14px 12px;
    border-bottom: 1px solid #eef0f4;
    flex-shrink: 0;
}

.msg-sidebar-title {
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-footer-top);
    margin-bottom: 10px;
}

.msg-search {
    position: relative;
}

.msg-search input {
    width: 100%;
    padding: 7px 12px 10px 32px;
    border: 1px solid #eef0f4;
    border-radius: var(--radius-lg);
    font-size: 1rem;
    background: #f8f9fc;
    color: var(--black-base);
    outline: none;
    transition: var(--transition-all-fast);
    font-family: inherit;
}

.msg-search input:focus {
    border-color: var(--primary-color-extra-light);
    background: var(--white-color);
}

.msg-search-icon {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--grey-color);
    display: flex;
}

.msg-list {
    flex: 1;
    overflow-y: auto;
    padding: 4px 0;
}

.msg-list::-webkit-scrollbar { width: 3px; }
.msg-list::-webkit-scrollbar-thumb { background: #e8e8e8; border-radius: 4px; }



.msg-doctor-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    cursor: pointer;
    transition: var(--transition-all-fast);
    border-left: 3px solid transparent;
}
.msg-doctor-item:hover { background: #fafafa; }
.msg-doctor-item.active {
    background: var(--white-color)5f4;
    border-left-color: var(--primary-color);
}


.msg-patient {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    cursor: pointer;
    transition: var(--transition-all-fast);
    border-left: 3px solid transparent;
}

.msg-patient:hover { background: #fafafa; }

.msg-patient.active {
    background: var(--white-color)5f4;
    border-left-color: var(--primary-color);
}

.msg-patient-avatar {
    width: 38px;
    height: 38px;
    border-radius: var(--radius-full);
    background: linear-gradient(135deg, var(--primary-color) 0%, #ff7a66 100%);
    color: var(--white-color);
    font-size: 1rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
}

.msg-patient-avatar.no-msg {
    background: linear-gradient(135deg, #c8ccd8 0%, #a8adb8 100%);
}

.msg-patient-online {
    position: absolute;
    bottom: 1px;
    right: 1px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #27ae60;
    border: 2px solid var(--white-color);
}

.msg-patient-info {
    flex: 1;
    min-width: 0;
}

.msg-patient-name {
    font-size: 1rem;
    font-weight: 600;
    color: var(--black-color);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 2px;
}

.msg-patient-preview {
    font-size: .9rem;
    color: var(--grey-color-dark);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 500;
}

.msg-patient-preview.no-msg {
    color: var(--grey-color);
    font-style: italic;
}

.msg-patient-meta {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
    flex-shrink: 0;
}

.msg-patient-time {
    color: var(--grey-color-dark);
    font-size: .8rem;
}

.msg-badge {
    background: var(--primary-color);
    color: var(--white-color);
    font-size: 10px;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: var(--radius-full);
    min-width: 20px;
    text-align: center;
}

.msg-area {
    display: flex;
    flex-direction: column;
    background: #f8f9fc;
    overflow: hidden;
}

.msg-area-head {
    padding: 12px 20px;
    background: var(--white-color);
    border-bottom: 1px solid #eef0f4;
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.msg-area-head-avatar {
    background: linear-gradient(135deg, var(--primary-color) 0%, #ff7a66 100%);
    color: var(--white-color);
    font-size: 1rem;
    font-weight: 700;
    width: 36px;
    height: 36px;
    border-radius: var(--radius-full);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.msg-area-head-name {
    color: var(--black-base);
    font-size: 1rem;
    font-weight: 700;
}

.msg-area-head-status {
    color: #27ae60;
    font-size: .9rem;
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: 1px;
}

.msg-area-head-status::before {
    background: #27ae60;
    content: '';
    width: 6px; height: 6px;
    border-radius: 50%;
}

.msg-empty {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.msg-empty-icon {
    width: 80px;
    height: 80px;
    border-radius: var(--radius-lg);
    background: #eef0f4;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
}

.msg-empty-text {
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--black-color);
}

.msg-empty-sub {
    font-size: 1rem;
    color: var(--grey-color-dark);
    text-align: center;
    max-width: 220px;
    line-height: 1.5;
}

.msg-messages {
    flex: 1;
    overflow-y: auto;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.msg-messages::-webkit-scrollbar { width: 3px; }
.msg-messages::-webkit-scrollbar-thumb { background: #e0e0e0; border-radius: 4px; }

.msg-date-divider {
    text-align: center;
    font-size: .9rem;
    color: var(--grey-color-dark);
    background: #eef0f4;
    border-radius: var(--radius-md);
    padding: 3px 12px;
    align-self: center;
}

.msg-bubble-wrap {
    display: flex;
    gap: 8px;
    align-items: flex-end;
}

.msg-bubble-wrap.sent { flex-direction: row-reverse; }

.msg-bubble-avatar {
    width: 28px; height: 28px;
    border-radius: var(--radius-full);
    background: linear-gradient(135deg, #c8ccd8 0%, #a8adb8 100%);
    color: var(--white-color);
    font-size: 11px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.msg-bubble-wrap.sent .msg-bubble-avatar {
    background: linear-gradient(135deg, var(--primary-color) 0%, #ff7a66 100%);
}

.msg-bubble {
    max-width: 65%;
    padding: 10px 14px;
    border-radius: 16px;
    font-size: var(--font-size-sm);
    line-height: 1.55;
}

.msg-bubble.received {
    font-size: 1rem;
    background: var(--white-color);
    color: var(--black-base);
    border-bottom-left-radius: 4px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
}

.msg-bubble.sent {
    font-size: 1rem;
    background: var(--primary-color);
    color: var(--white-color);
    border-bottom-right-radius: 4px;
}

.msg-bubble-time {
    font-size: .8rem;
    margin-top: 4px;
    opacity: 0.55;
    text-align: right;
}

.msg-footer {
    padding: 12px 16px;
    background: var(--white-color);
    border-top: 1px solid #eef0f4;
    flex-shrink: 0;
}

.msg-form {
    background: #f4f5f9;
    border-radius: var(--radius-xl);
    padding: 6px 6px 6px 16px;
    border: 1px solid transparent;
    display: flex;
    align-items: center;
    gap: 10px;
    transition: var(--transition-all-fast);
}

.msg-form:focus-within {
    border-color: var(--primary-color-extra-light);
    background: var(--white-color);
}

.msg-input {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--black-base);
    outline: none;
    font-family: inherit;
}

.msg-input::placeholder { color: var(--grey-color-dark); }

.msg-send-btn {
    width: 36px;
    height: 36px;
    border-radius: var(--radius-full);
    background: var(--primary-color);
    color: var(--white-color);
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background 0.2s, transform 0.1s;
    font-size: 14px;
}

.msg-send-btn:hover {
    background: var(--primary-color-dark);
    transform: scale(1.05);
}

.msg-messages::-webkit-scrollbar { width: 4px; }
.msg-messages::-webkit-scrollbar-track { background: transparent; }
.msg-messages::-webkit-scrollbar-thumb {
    background: var(--grey-color-light);
    border-radius: 4px;
}

.msg-list::-webkit-scrollbar { width: 3px; }
.msg-list::-webkit-scrollbar-track { background: transparent; }
.msg-list::-webkit-scrollbar-thumb {
    background: var(--grey-color-light);
    border-radius: 4px;
}
.msg-wrap * {
    scrollbar-width: thin;
    scrollbar-color: var(--grey-color-light) transparent;
}

.msg-bubble {
    max-width: 100%;
    word-break: break-word;
}

@media (max-width: 768px) {
    .msg-wrap { grid-template-columns: 1fr; height: auto; }
    .msg-sidebar { height: 250px; }
}
/*------------------- Doktor Message-------------------*/

/*------------------- Patient Message-------------------*/
.am-chat-wrap {
    background: var(--white-color);
    border: 1px solid var(--color-border);
    height: 640px;
    border-radius: var(--radius-xl);
    display: flex;
    overflow: visible;
    box-shadow: 0 20px 60px rgba(var(--black-opacity), 0.10);
    position: relative;
}

.am-chat-sidebar {
    background: var(--color-footer-top);
    width: 270px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
}

.am-chat-sidebar-header {
    padding: 22px 20px 16px;
    border-bottom: 1px solid rgba(var(--white-opacity), 0.08);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.am-chat-sidebar-title {
    color: var(--white-color);
    font-size: 1rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 8px;
}

.am-chat-badge {
    background: var(--primary-color);
    color: var(--white-color);
    font-size: var(--font-size-xs);
    font-weight: 700;
    padding: 3px 10px;
    border-radius: var(--radius-xl);
}

.am-chat-contact-list {
    flex: 1;
    overflow-y: auto;
    padding: 12px 10px;
}

.am-chat-contact {
    padding: 12px;
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    transition: var(--transition-all-fast);
}

.am-chat-contact:hover  { background: rgba(var(--white-opacity), 0.06); }
.am-chat-contact.active { background: rgba(var(--white-opacity), 0.10); }

.am-chat-contact-avatar {
    background: var(--primary-color);
    color: var(--white-color);
    font-size: 1.2rem;
    font-weight: 700;
    width: 44px;
    height: 44px;
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.am-chat-contact-info { flex: 1; min-width: 0; }

.am-chat-contact-info p {
    color: var(--white-color);
    font-size: var(--font-size-sm);
    font-weight: 600;
    margin: 0 0 3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.am-chat-contact-info span {
    color: rgba(var(--white-opacity), 0.5);
    font-size: var(--font-size-xs);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
}

.am-chat-contact-unread {
    background: var(--primary-color);
    color: var(--white-color);
    font-size: .65rem;
    font-weight: 700;
    width: 20px; height: 20px;
    border-radius: var(--radius-circle);
    display: flex;
    align-items: center;
    justify-content: center;
}

.am-chat-main {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
    background: #f8f9fb;
    border-radius: 0 var(--radius-xl) var(--radius-xl) 0;
    overflow: hidden;
}

.am-chat-topbar {
    background: var(--white-color);
    padding: 14px 22px;
    border-bottom: 1px solid var(--color-border);
    display: flex;
    align-items: center;
}

.am-chat-topbar-left {
    display: flex;
    align-items: center;
    gap: 12px;
}

.am-chat-topbar-avatar {
    background: var(--color-footer-top);
    color: var(--white-color);
    font-size: 1rem;
    font-weight: 700;
    width: 40px; height: 40px;
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
}

.am-chat-topbar-left > div > p {
    color: var(--color-footer-top);
    font-size: 1.2rem;
    font-weight: 700;
    margin: 0 0 2px;
}

.am-chat-topbar-left > div > span {
    color: var(--grey-color-dark);
    font-size: 1rem;
}

.am-chat-messages {
    padding: 20px 22px 12px;
    flex: 1;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 10px;
    scroll-behavior: smooth;
}

.am-chat-messages::-webkit-scrollbar { width: 4px; }
.am-chat-messages::-webkit-scrollbar-thumb {
    background: var(--grey-color-light);
    border-radius: 10px;
}

.am-msg-row {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    animation: cpMsgIn .2s ease both;
}

@keyframes cpMsgIn {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: translateY(0); }
}

.am-msg-row.am-msg-out { flex-direction: row-reverse; }

.am-msg-avatar {
    background: var(--color-footer-top);
    color: var(--white-color);
    font-size: .75rem;
    font-weight: 700;
    width: 32px;
    height: 32px;
    border-radius: var(--radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.am-msg-bubble { max-width: 65%; }

.am-msg-text {
    font-size: var(--font-size-sm);
    font-weight: 500;
    padding: 10px 15px;
    border-radius: 18px;
    line-height: 1.55;
    word-break: break-word;
}

.am-msg-out .am-msg-text {
    color: var(--white-color) !important;
}

.am-msg-in .am-msg-text {
    color: var(--color-heading) !important;
}

.am-msg-file a {
    color: inherit !important;
}
.am-msg-file {
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px solid rgba(var(--white-opacity), 0.2);
}

.am-msg-file a {
    color: var(--white-color);
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: .9rem;
    font-weight: 600;
    color: inherit;
    opacity: 0.85;
    text-decoration: none;
}

.am-msg-file a:hover { opacity: 1; text-decoration: underline; }

.am-msg-in .am-msg-file { border-top-color: var(--color-border); }

@media (max-width: 768px) {
    .am-chat-sidebar { display: none; }
    .am-chat-wrap    { height: 540px; }
    .am-msg-bubble   { max-width: 85%; }
    .am-emoji-picker { width: calc(100vw - 36px); }
}

.am-msg-text:empty {
    display: none;
}

.am-msg-bubble {
    min-width: 120px;
}

.am-msg-out .am-msg-file {
    background: var(--color-footer-top);
    color:var(--white-color);
    border-radius: 18px;
    border-bottom-right-radius: 4px;
    padding: 10px 15px;
    border-top: none;
}

.am-msg-in .am-msg-file {
    background: var(--white-color);
    border: 1px solid var(--color-border);
    border-radius: 18px;
    border-bottom-left-radius: 4px;
    padding: 10px 15px;
    border-top: none;
}

.am-msg-in  .am-msg-text {
    background: var(--white-color);
    color: var(--color-heading);
    border: 1px solid var(--color-border);
    border-bottom-left-radius: 4px;
}

.am-msg-out .am-msg-text {
    background: var(--color-footer-top);
    color: var(--white-color);
    border-bottom-right-radius: 4px;
}

.am-msg-time {
    color: var(--grey-color-dark);
    font-size: .8rem;
    margin-top: 4px;
    padding: 0 4px;
}

.am-msg-out .am-msg-time { text-align: right; }

.am-chat-empty {
    padding: 48px 24px;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-align: center;
}

.am-chat-empty svg { opacity: .25; margin-bottom: 8px; }
.am-chat-empty p   { font-size: var(--font-size-sm); font-weight: 600; color: var(--grey-color-dark); margin: 0; }
.am-chat-empty span{ font-size: var(--font-size-xs); color: var(--grey-color); }

.am-chat-footer {
    padding: 12px 18px 14px;
    background: var(--white-color);
    border-top: 1px solid var(--color-border);
    position: relative;
    z-index: var(--z-low);
}

.am-emoji-picker {
    display: none;
    flex-wrap: wrap;
    gap: 4px;
    padding: 10px 12px;
    background: var(--white-color);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    box-shadow: 0 -8px 24px rgba(var(--black-opacity), 0.10);
    position: absolute;
    bottom: 100%;
    left: 18px;
    z-index: var(--z-float);
    width: 280px;
    animation: cpFadeUp .15s ease;
    margin-bottom: 6px;
}

.am-emoji-picker.open { display: flex; }

@keyframes cpFadeUp {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes cpFadeUp {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: translateY(0); }
}

.am-emoji-btn {
    background: transparent;
    font-size: 1.1rem;
    width: 36px; height: 36px;
    border: none;
    border-radius: var(--radius-xs);
    cursor: pointer;
    transition: var(--transition-all-fast);
    display: flex;
    align-items: center;
    justify-content: center;
}

.am-emoji-btn:hover { background: var(--grey-color-xlight); transform: scale(1.2); }

.am-chat-input-wrap {
    background: #f4f5f9;
    border: 1.5px solid var(--color-border);
    display: flex;
    align-items: center;
    gap: 8px;
    border-radius: var(--radius-xl);
    padding: 7px 7px 7px 10px;
    transition: var(--transition-all-fast);
}

.am-chat-input-wrap:focus-within {
    background: var(--white-color);
    border-color: var(--color-footer-top);
}

.am-chat-tool-btn {
    background: transparent;
    color: var(--grey-color-dark);
    width: 34px;
    height: 34px;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition-all-fast);
    flex-shrink: 0;
}

.am-chat-tool-btn:hover {
    background: var(--grey-color-xlight);
    color: var(--color-footer-top);
}

.am-chat-tool-btn.active { color: var(--primary-color); }

.am-chat-input {
    background: transparent;
    color: var(--color-heading);
    font-size: var(--font-size-sm);
    font-weight: 500;
    flex: 1;
    border: none;
    outline: none;
}

.am-chat-input::placeholder { color: var(--grey-color); }

.am-chat-send-btn {
    background: var(--primary-color);
    color: var(--white-color);
    font-size: var(--font-size-sm);
    font-weight: 700;
    border-radius: var(--radius-lg);
    padding: 8px 16px;
    border: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    transition: var(--transition-all-fast);
    flex-shrink: 0;
}

.am-chat-send-btn:hover {
    background: var(--color-footer-top);
    /*box-shadow: 0 4px 14px var(--primary-shadow);
    transform: translateY(-1px);*/
}

.am-chat-send-btn:disabled {
    opacity: .6;
    cursor: not-allowed;
    transform: none;
}

.am-file-preview {
    background: var(--grey-color-xlight);
    color: var(--grey-color-xxdark);
    font-size: var(--font-size-xs);
    font-weight: 600;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
    margin-top: 8px;
    padding: 7px 12px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.am-file-preview span { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.am-file-remove {
    background: transparent;
    color: var(--grey-color-dark);
    font-size: .9rem;
    line-height: 1;
    padding: 2px 4px;
    border-radius: 4px;
    border: none;
    cursor: pointer;
}

.am-file-remove:hover { color: var(--primary-color); }
/*------------------- Patient Message -------------------*/













/*---------------------------------------------------
   7.U Appointments
-----------------------------------------------------*/
.appointment-status {
    padding: 5px 10px;
    border-radius: 12px;
    font-size: 13px;
    color: var(--white-color);
}

.appointment-status--beklemede { background:#f9a825; }
.appointment-status--onaylandı { background:#2e7d32; }
.appointment-status--iptal edildi { background:#c62828; }
.appointment-status--tamamlandı { background:#1565c0; }
.appointment-filters {margin: 10px 0 18px;}

.filter-btn {
    display: inline-block;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: .9rem;
    text-decoration: none;
    background: #f1f1f1;
    color: var(--color-footer-top);
    margin-right: 6px;
    transition: all .2s ease;
    font-weight: 500;
}

.appointment-status {
    color: var(--color-footer-top);
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 6px;
    display: inline-block;
    font-size: 13px;
}

.appointment-status--beklemede {
    background-color: var(--white-color)3cd;
    color: #856404;
}
.appointment-status--onaylandı {
    background-color: #d4edda;
    color: #155724;
}
.appointment-status--tamamlandı {
    background-color: #d1ecf1;
    color: #0c5460;
}
.appointment-status--iptal {
    background-color: #f8d7da;
    color: #721c24;
}

.appointments-list{
    border-radius: var(--radius-lg);
    box-shadow: 0 10px 50px 0 rgba(217,220,232,1);
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.5rem;
    padding: 1rem;
}

.appointments-list th {
    background-color: var(--primary-grey-shadow);
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--color-footer-top);
    padding: 10px;
    text-align: center;
}

.appointments-list td {
    padding: 12px 15px;
    border: 1px solid var(--grey-color-light);
    text-align: center;
    font-size: 1rem;
    color: var(--color-footer-top);
}

.appointments-list table {width: 100%;}

.appointments-list tbody tr:nth-child(odd) {background-color: var(--white-color);}
.appointments-list tbody tr:nth-child(even) {background-color: var(--bs-border-color);}

.status.approved { background-color: var(--android); color: var(--white-color); }
.status.pending  { background-color: var(--behance); color: var(--white-color); }
.status.cancelled{ background-color: var(--youtube); color: var(--white-color); }

.status {
    padding: 4px 8px;
    border-radius: 4px;
    font-size: .8rem;
    font-weight: 600;
}

/*------------------- Patient Appointments -------------------*/
.ap-panel {
    background: var(--white-color);
    border-radius: var(--radius-lg);
    border: 1px solid var(--grey-color-light);
    overflow: hidden;
    box-shadow: 0 2px 20px rgba(var(--black-opacity), 0.05);
}

.ap-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 1px solid var(--grey-color-light);
}

.ap-head-left {
    display: flex;
    align-items: center;
    gap: 14px;
}

.ap-head-icon {
    width: 46px; height: 46px;
    border-radius: var(--radius-sm);
    background: var(--color-footer-top);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}

.ap-head-title {
    font-size: var(--font-size-lg);
    font-weight: 800;
    color: var(--color-footer-top);
}

.ap-head-sub {
    font-size: var(--font-size-xs);
    color: var(--grey-color-dark);
    font-weight: 500;
    margin-top: 1px;
}

.ap-badge {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--grey-color-xlight);
    border: 1.5px solid var(--grey-color-light);
    border-radius: var(--radius-sm);
    padding: 6px 14px;
}

.ap-badge strong {
    font-size: var(--font-size-xl);
    font-weight: 800;
    color: var(--color-footer-top);
}

.ap-badge span {
    font-size: var(--font-size-xs);
    color: var(--grey-color-dark);
    font-weight: 600;
}

.ap-filters {
    display: flex;
    gap: 6px;
    padding: 14px 24px;
    border-bottom: 1px solid var(--grey-color-light);
    flex-wrap: wrap;
}

.ap-filter {
    background: var(--white-color);
    color: var(--grey-color-dark);
    font-size: .8rem;
    font-weight: 700;
    padding: 7px 18px;
    border-radius: var(--radius-lg);
    border: 1.5px solid var(--grey-color-light);
    text-decoration: none;
    transition: var(--transition-all-fast);
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.ap-filter:hover {
    border-color: var(--color-footer-top);
    color: var(--color-footer-top);
}

.ap-filter.active {
    background: var(--color-footer-top);
    border-color: var(--color-footer-top);
    color: var(--white-color);
}

.ap-filter.active::before {
    content: '';
    width: 6px; height: 6px;
    border-radius: var(--radius-circle);
    background: rgba(var(--white-opacity), 0.6);
}

.ap-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    padding: 20px 24px 24px;
}

.ap-card {
    background: var(--white-color);
    border: 1.5px solid var(--grey-color-light);
    border-radius: var(--radius-lg);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: var(--transition-all-fast);
    animation: apUp 0.4s ease both;
}

.ap-card:hover {
    border-color: rgba(var(--intro-opacity), 0.2);
    box-shadow: 0 12px 36px rgba(var(--black-opacity), 0.08);
    transform: translateY(-3px);
}

.ap-card-hero {
    padding: 20px 20px 16px;
    background: linear-gradient(135deg, var(--color-footer-top) 0%, var(--color-footer) 100%);
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
}

.ap-card-hero::after {
    content: attr(data-day);
    position: absolute;
    right: -6px; bottom: -20px;
    font-size: 6rem;
    font-weight: 900;
    color: rgba(var(--white-opacity), 0.05);
    line-height: 1;
    pointer-events: none;
}

.ap-card-hero::before {
    content: '';
    position: absolute;
    right: 16px; top: -20px;
    width: 80px; height: 80px;
    border-radius: var(--radius-circle);
    background: rgba(var(--white-opacity), 0.04);
}

.ap-hero-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 14px;
    position: relative;
    z-index: 1;
}

.ap-date-big {
    color: var(--white-color);
    font-size: 2rem;
    font-weight: 800;
    line-height: 1;
    margin-bottom: 4px;
}

.ap-date-sub {
    font-size: 1rem;
    color: rgba(var(--white-opacity), 0.45);
    font-weight: 500;
}

.ap-status {
    font-size: .9rem;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: var(--radius-md);
    flex-shrink: 0;
}

.ap-status.beklemede  { background: rgba(245,158,11,.2);  color: #fbbf24; border: 1px solid rgba(245,158,11,.3); }
.ap-status.onaylandi  { background: rgba(16,185,129,.2);  color: #34d399; border: 1px solid rgba(16,185,129,.3); }
.ap-status.tamamlandi { background: rgba(139,92,246,.2);  color: #a78bfa; border: 1px solid rgba(139,92,246,.3); }
.ap-status.iptal      { background: rgba(239,68,68,.2);   color: #f87171; border: 1px solid rgba(239,68,68,.3); }

.ap-doctor {
    display: flex;
    align-items: center;
    gap: 10px;
    position: relative;
    z-index: 1;
}

.ap-doctor img {
    width: 45px;
    height: 45px;
    border-radius: var(--radius-circle);
    border: 2px solid rgba(var(--white-opacity), 0.15);
    object-fit: cover;
    flex-shrink: 0;
}

.ap-doctor-name {
    color: var(--white-color);
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 1px;
}

.ap-doctor-role {
    font-size: 1rem;
    color: rgba(var(--white-opacity), 0.4);
}

/* Meta */
.ap-meta {
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1;
}

.ap-meta-row {
    background: var(--grey-color-xlight);
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
}

.ap-meta-left {
    color: var(--grey-color-dark);
    font-size: .9rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
}

.ap-meta-icon {
    background: var(--white-color);
    color: var(--grey-color-dark);
    width: 25px;
    height: 25px;
    border-radius: 6px;
    border: 1px solid var(--grey-color-light);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}

.ap-meta-val {
    color: var(--color-footer-top);
    font-size: .9rem;
    font-weight: 700;
}

.ap-card-foot {
    padding: 12px 16px;
    display: flex;
    gap: 8px;
    border-top: 1px solid var(--grey-color-light);
}

.ap-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    font-size: var(--font-size-xs);
    font-weight: 700;
    padding: 9px 14px;
    border-radius: var(--radius-xs);
    text-decoration: none;
    border: 1.5px solid;
    transition: var(--transition-all-fast);
    cursor: pointer;
    white-space: nowrap;
}

.ap-btn.msg {
    flex: 1;
    background: var(--color-footer-top);
    color: var(--white-color);
    border-color: var(--color-footer-top);
}

.ap-btn.msg:hover {
    background: var(--primary-color);
    border-color: var(--primary-color);
}

.ap-btn.cncl {
    background: rgba(var(--primary-opacity), 0.06);
    color: var(--primary-color);
    border-color: var(--primary-color-extra-light);
}

.ap-btn.cncl:hover {
    background: var(--primary-color);
    color: var(--white-color);
    border-color: var(--primary-color);
}

.ap-empty {
    padding: 60px 24px;
    text-align: center;
    border: 1.5px dashed var(--grey-color-light);
    border-radius: var(--radius-lg);
    color: var(--grey-color-dark);
}

.ap-empty svg { display: block; margin: 0 auto 16px; color: var(--grey-color-light); }

.ap-empty p {
    font-size: var(--font-size-sm);
    font-weight: 700;
    color: var(--grey-color-xxdark);
    margin-bottom: 4px;
}

@keyframes apUp {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
}

@media (max-width: 1024px) { .ap-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  {
    .ap-grid { grid-template-columns: 1fr; padding: 14px; }
    .ap-card-foot { flex-direction: column; }
    .ap-filters { padding: 12px 14px; }
}

/* ============================================
   AF. SECRETARY APPOINTMENTS
   ============================================ */

.sa-alert {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 18px;
    border-radius: var(--radius-sm);
    font-size: var(--font-size-sm);
    font-weight: 500;
    margin-bottom: 16px;
}
.sa-alert--success { background: #f0fdf4; color: #16a34a; border: 1px solid #bbf7d0; }
.sa-alert--error   { background: #fef2f2; color: #dc2626; border: 1px solid #fecaca; }

.sa-panel {
    background: var(--white-color);
    border-radius: var(--radius-lg);
    border: 1px solid var(--grey-color-light);
    overflow: hidden;
    box-shadow: 0 2px 16px rgba(var(--black-opacity), 0.04);
}

.sa-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 1px solid var(--grey-color-light);
    flex-wrap: wrap;
    gap: 12px;
}

.sa-panel-head-left {
    display: flex;
    align-items: center;
    gap: 14px;
}

.sa-panel-icon {
    width: 44px; height: 44px;
    border-radius: var(--radius-sm);
    background: var(--color-footer-top);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}

.sa-panel-title {
    font-size: var(--font-size-lg);
    font-weight: 800;
    color: var(--color-footer-top);
}

.sa-panel-sub {
    font-size: var(--font-size-xs);
    color: var(--grey-color-dark);
    margin-top: 1px;
}

.sa-panel-head-right {
    display: flex;
    align-items: center;
    gap: 10px;
}

.sa-new-btn {
    background: var(--primary-color);
    color: var(--white-color);
    font-size: .9rem;
    font-weight: 600;
    padding: 9px 18px;
    border-radius: var(--radius-xs);
    display: inline-flex;
    align-items: center;
    gap: 7px;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: var(--transition-all-fast);
    box-shadow: 0 4px 12px var(--primary-shadow);
}
.sa-new-btn:hover {
    background: var(--color-footer-top);
    color: var(--white-color);
}

.sa-counters {
    display: flex;
    border-bottom: 1px solid var(--grey-color-light);
}

.sa-counter {
    flex: 1;
    padding: 16px 20px;
    text-align: center;
    border-right: 1px solid var(--grey-color-light);
    transition: var(--transition-all-fast);
}
.sa-counter:last-child { border-right: none; }
.sa-counter:hover { background: var(--grey-color-xlight); }

.sa-counter-num {
    color: var(--color-footer-top);
    font-size: 2.5rem;
    font-weight: 800;
    line-height: 1;
    margin-bottom: 4px;
}

.sa-counter-label {
    color: var(--grey-color-dark);
    font-size: 1rem;
    font-weight: 600;
}

.sa-counter--today    .sa-counter-num { color: var(--secondary-color-dark); }
.sa-counter--pending  .sa-counter-num { color: #d97706; }
.sa-counter--approved .sa-counter-num { color: #16a34a; }
.sa-counter--cancelled .sa-counter-num { color: var(--primary-color); }

.sa-today-bar {
    display: flex;
    align-items: center;
    gap: 0;
    padding: 0 24px;
    background: var(--white-color);
    border-bottom: 1px solid var(--grey-color-light);
    min-height: 48px;
    overflow: hidden;
}


.sa-today-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-right: 20px;
    border-right: 1px solid var(--grey-color-light);
    flex-shrink: 0;
}

.sa-today-meta__icon {
    width: 28px;
    height: 28px;
    border-radius: var(--radius-xs);
    background: var(--grey-color-xlight);
    border: 1px solid var(--grey-color-light);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--grey-color-dark);
    flex-shrink: 0;
}

.sa-today-meta__info {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.sa-today-meta__num {
    font-size: 15px;
    font-weight: 700;
    color: var(--color-footer-top);
    line-height: 1;
}

.sa-today-meta__lbl {
    font-size: .9rem;
    color: var(--grey-color-dark);
    line-height: 1;
}

.sa-today-meta__live {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #10b981;
    flex-shrink: 0;
    animation: saLivePulse 2s infinite;
}

@keyframes saLivePulse {
    0%, 100% { opacity: 1; }
    50%       { opacity: .2; }
}

.sa-today-scroll {
    display: flex;
    align-items: center;
    gap: 0;
    padding-left: 20px;
    overflow-x: auto;
    flex: 1;
    scrollbar-width: none;
}

.sa-today-scroll::-webkit-scrollbar { display: none; }

.sa-today-card {
    background: var(--grey-color-xlight);
    padding: 7px 13px;
    border-radius: var(--radius-xs);
    border: 1px solid var(--grey-color-light);
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    cursor: default;
    transition: var(--transition-all-fast);
}

.sa-today-card:hover {
    border-color: var(--color-footer-top);
    background: var(--white-color);
}

.sa-today-card__time {
    font-size: 13px;
    font-weight: 700;
    color: var(--color-footer-top);
    font-variant-numeric: tabular-nums;
    letter-spacing: .3px;
    white-space: nowrap;
}

.sa-today-card__divider {
    width: 1px;
    height: 13px;
    background: var(--grey-color-light);
    flex-shrink: 0;
}

.sa-today-card__dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    flex-shrink: 0;
}

.sa-today-card__dot--online   { background: #3b82f6; }
.sa-today-card__dot--yuzyuze  { background: #10b981; }

.sa-today-card__name {
    color: var(--grey-color-dark);
    font-size: 12px;
    max-width: 110px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sa-today-arrow {
    background: var(--grey-color-light);
    width: 18px;
    height: 1px;
    flex-shrink: 0;
    position: relative;
}

.sa-today-arrow::after {
    content: '';
    position: absolute;
    right: -1px;
    top: -3px;
    width: 6px;
    height: 6px;
    border-right: 1px solid var(--grey-color-light);
    border-top: 1px solid var(--grey-color-light);
    transform: rotate(45deg);
}

.sa-today-more {
    color: var(--grey-color-dark);
    font-size: 12px;
    font-weight: 600;
    padding: 7px 8px;
    border-radius: var(--radius-xs);
    border: 1px dashed var(--grey-color-light);
    background: transparent;
    flex-shrink: 0;
    white-space: nowrap;
}
@keyframes saPulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.4; }
}

.sa-today-bar strong { color: var(--secondary-color-dark); font-weight: 700; }

.sa-today-appointments {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.sa-today-chip {
    background: rgba(var(--secondary-opacity), 0.12);
    border: 1px solid rgba(var(--secondary-opacity), 0.2);
    border-radius: var(--radius-full);
    padding: 2px 10px;
    font-size: 11px;
    font-weight: 500;
    color: var(--secondary-color-dark);
}

.sa-filters {
    padding: 16px 24px;
    border-bottom: 1px solid var(--grey-color-light);
    background: var(--grey-color-xlight);
}

.sa-filter-form {
    display: flex;
    align-items: flex-end;
    gap: 12px;
    flex-wrap: wrap;
}

.sa-filter-group {
    display: flex;
    flex-direction: column;
    gap: 5px;
    flex: 1;
    min-width: 140px;
}

.sa-filter-group--search { min-width: 200px; }

.sa-label {
    color: var(--grey-color-dark);
    font-size: 1rem;
    font-weight: 600;
}

.sa-select,
.sa-input {
    padding: 8px 12px;
    border: 1.5px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    background: var(--white-color);
    color: var(--color-footer-top);
    font-size: 1rem;
    font-family: inherit;
    outline: none;
    transition: var(--transition-all-fast);
    width: 100%;
}
.sa-select:focus, .sa-input:focus {border-color: var(--primary-color);}

.sa-search-wrap {
    position: relative;
}
.sa-search-wrap svg {
    position: absolute;
    left: 10px; top: 50%;
    transform: translateY(-50%);
    color: var(--grey-color);
    pointer-events: none;
}
.sa-search-input { padding-left: 32px !important; }

.sa-filter-actions {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
}

.sa-btn {
    font-family: inherit;
    font-size: .9rem;
    font-weight: 600;
    padding: 8px 16px;
    border-radius: var(--radius-xs);
    border: 1.5px solid;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    text-decoration: none;
    transition: var(--transition-all-fast);
}

.sa-btn--primary {
    background: var(--color-footer-top);
    color: var(--white-color);
    border-color: var(--color-footer-top);
}
.sa-btn--primary:hover {
    background: var(--primary-color);
    color: var(--white-color);
    border-color: var(--primary-accent-light);
}

.sa-btn--ghost {
    background: var(--white-color);
    color: var(--grey-color-dark);
    border-color: var(--grey-color-light);
}
.sa-btn--ghost:hover { border-color: var(--grey-color-dark); color: var(--black-base); }

.sa-btn--export {
    background: var(--white-color);
    color: #16a34a;
    transition: none;
}
.sa-btn--export:hover {
    background-color: #16a34a;
    color: var(--white-color);
    border: none;
}

.sa-bulk-bar {
    position: fixed;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 9999;
    background: var(--color-footer-top);
    border-radius: 100px;
    padding: 10px 10px 10px 20px;
    box-shadow: 0 8px 32px rgba(var(--black-opacity), 0.25);
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: auto;
    white-space: nowrap;
}

.sa-bulk-info {
    color: var(--white-color);
    font-size: 1rem;
    font-weight: 500;
    flex-shrink: 0;
}

.sa-bulk-info span {
    font-weight: 800;
}

.sa-bulk-actions form {
    display: flex;
    align-items: center;
    gap: 8px;
}

.sa-btn--approve-bulk {
    background: rgba(255,255,255,0.12);
    color: var(--white-color);
    border: 1.5px solid rgba(255,255,255,0.2);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: var(--font-size-sm);
    font-weight: 600;
    padding: 8px 14px;
    border-radius: 100px;
    cursor: pointer;
    transition: var(--transition-all-fast);
    font-family: inherit;
    white-space: nowrap;
}

.sa-btn--approve-bulk:hover {
    background: #16a34a;
    border-color: #16a34a;
}

.sa-btn--cancel-bulk {
    background: rgba(255,255,255,0.08);
    color: rgba(255,255,255,0.85);
    border: 1.5px solid rgba(255,255,255,0.15);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: var(--font-size-sm);
    font-weight: 600;
    padding: 8px 14px;
    border-radius: 100px;
    cursor: pointer;
    transition: var(--transition-all-fast);
    font-family: inherit;
    white-space: nowrap;
}

.sa-btn--cancel-bulk:hover {
    background: rgba(var(--primary-opacity), 0.6);
    border-color: var(--primary-color);
}

.sa-btn--delete-bulk {
    color: var(--primary-color);
    background: rgba(255,255,255,0.08);
    border: 1.5px solid rgba(255,255,255,0.15);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: .9rem;
    font-weight: 600;
    padding: 8px 14px;
    border-radius: 100px;
    cursor: pointer;
    transition: var(--transition-all-fast);
    font-family: inherit;
    white-space: nowrap;
}

.sa-btn--delete-bulk:hover {
    background: var(--primary-color);
    color: var(--white-color);
    border-color: var(--primary-color);
}

.sa-bulk-actions {
    display: flex;
    gap: 8px;
}

.sa-checkbox {
    width: 16px; height: 16px;
    accent-color: var(--color-footer-top);
    cursor: pointer;
}

.sa-th-check, .sa-td-check {
    width: 44px;
    text-align: center;
}

.sa-table-wrap { overflow-x: auto; }

.sa-table {
    width: 100%;
    border-collapse: collapse;
}

.sa-table thead tr {
    border-bottom: 2px solid var(--grey-color-light);
}

.sa-table thead th {
    background: var(--grey-color-xlight);
    color: var(--grey-color-dark);
    padding: 11px 16px;
    font-size: 1rem;
    font-weight: 700;
    text-align: center;
    white-space: nowrap;
}

.sa-table tbody tr {
    border-bottom: 1px solid var(--grey-color-light);
    transition: var(--transition-all-fast);
    animation: saRowIn 0.35s ease both;
}
.sa-table tbody tr:last-child { border-bottom: none; }
.sa-table tbody tr:hover { background: #fafbff; }

.sa-table td {
    color: var(--color-footer-top);
    font-size: 1rem;
    padding: 13px 16px;
    vertical-align: middle;
}

.sa-td-num {
    font-size: var(--font-size-xs);
    color: var(--grey-color-dark);
    font-weight: 600;
    width: 40px;
}

.sa-person { display: flex; align-items: center; gap: 10px; }

.sa-person-avatar {
    background: linear-gradient(135deg, var(--color-footer-top), var(--color-footer));
    color: var(--white-color);
    font-size: 1rem;
    font-weight: 700;
    width: 34px; height: 34px;
    border-radius: var(--radius-circle);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}

.sa-person-avatar--doc {
    background: linear-gradient(135deg, var(--primary-color), var(--primary-accent-color));
}

/*.sa-person-name {
    color: var(--black-base);
    font-size: 1rem;
    font-weight: 600;
    white-space: nowrap;
}*/
.sa-person-avatar--doc ~ div .sa-person-name {
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sa-person-sub {
    font-size:.9rem;
    color: var(--grey-color-dark);
    margin-top: 1px;
}

.sa-date-main { font-size: 1rem; font-weight: 600; color: var(--black-base); }
.sa-date-time { font-size: .9rem; color: var(--grey-color-dark); margin-top: 2px; }

.sa-type {
    font-size: .9rem;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: var(--radius-xs);
    display: inline-flex;
    align-items: center;
    gap: 5px;
}
.sa-type--online {
    background: rgba(var(--secondary-opacity), 0.1);
    color: var(--secondary-color-dark);
    border: 1px solid rgba(var(--secondary-opacity), 0.2);
}
.sa-type--physical {
    background: rgba(var(--primary-opacity), 0.08);
    color: var(--primary-color-dark);
    border: 1px solid var(--primary-color-extra-light);
}

.sa-status-form { margin: 0; }

.sa-status-select {
    font-size: .9rem;
    font-weight: 600;
    padding: 5px 10px;
    border-radius: var(--radius-xs);
    border: 1.5px solid;
    cursor: pointer;
    outline: none;
    transition: var(--transition-all-fast);
    font-family: inherit;
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.5'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 8px center;
    padding-right: 28px;
}

.sa-status-select--beklemede  { background-color: var(--white-color)beb; color: #d97706; border-color: #fde68a; }
.sa-status-select--onaylandi  { background-color: #f0fdf4; color: #16a34a; border-color: #bbf7d0; }
.sa-status-select--tamamlandi { background-color: #f5f3ff; color: #7c3aed; border-color: #ddd6fe; }
.sa-status-select--iptal      { background-color: #fef2f2; color: #dc2626; border-color: #fecaca; }

.sa-actions { display: flex; align-items: center; gap: 6px; }

.sa-action-btn {
    width: 30px; height: 30px;
    border-radius: var(--radius-xs);
    display: flex; align-items: center; justify-content: center;
    border: 1.5px solid;
    cursor: pointer;
    transition: var(--transition-all-fast);
    background: transparent;
    text-decoration: none;
    flex-shrink: 0;
}

.sa-action-btn--edit {
    color: var(--color-footer-top);
    border-color: var(--grey-color-light);
    background: var(--grey-color-xlight);
}
.sa-action-btn--edit:hover { background: var(--color-footer-top); border-color: var(--color-footer-top); color: var(--white-color); }

.sa-action-btn--delete {
    color: var(--primary-color);
    border-color: var(--primary-color-extra-light);
    background: rgba(var(--primary-opacity), 0.05);
}
.sa-action-btn--delete:hover { background: var(--primary-color); border-color: var(--primary-color); color: var(--white-color); }

.sa-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 52px 24px;
    color: var(--grey-color-dark);
}

.sa-empty-icon {
    width: 60px; height: 60px;
    border-radius: var(--radius-lg);
    background: var(--grey-color-xlight);
    border: 1px solid var(--grey-color-light);
    display: flex; align-items: center; justify-content: center;
    color: var(--grey-color);
    margin-bottom: 4px;
}

.sa-empty-text { font-size: var(--font-size-base); font-weight: 700; color: var(--grey-color-xxdark); }
.sa-empty-sub  { font-size: var(--font-size-xs); color: var(--grey-color-dark); }

/* Pagination */
.sa-pagination {
    padding: 16px 24px;
    border-top: 1px solid var(--grey-color-light);
    display: flex;
    justify-content: center;
}

@keyframes saRowIn {
    from { opacity: 0; transform: translateY(5px); }
    to   { opacity: 1; transform: translateY(0); }
}

@media (max-width: 1024px) {
    .sa-counters { flex-wrap: wrap; }
    .sa-counter { flex: 0 0 33.33%; border-bottom: 1px solid var(--grey-color-light); }
}

@media (max-width: 768px) {
    .sa-filter-form { flex-direction: column; }
    .sa-filter-group { min-width: 100%; }
    .sa-panel-head { flex-direction: column; align-items: flex-start; }
    .sa-today-bar { flex-direction: column; align-items: flex-start; }
    .sa-table thead th:nth-child(6),
    .sa-table tbody td:nth-child(6) { display: none; }
}

.sa-autocomplete {
    position: absolute;
    top: calc(100% + 4px);
    left: 0; right: 0;
    background: var(--white-color);
    border: 1.5px solid var(--grey-color-light);
    border-radius: var(--radius-sm);
    box-shadow: 0 8px 24px rgba(var(--black-opacity), 0.1);
    z-index: var(--z-float);
    max-height: 240px;
    overflow-y: auto;
    display: none;
}

.sa-autocomplete-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    cursor: pointer;
    transition: var(--transition-all-fast);
    border-bottom: 1px solid var(--grey-color-light);
}

.sa-autocomplete-item:last-child { border-bottom: none; }

.sa-autocomplete-item:hover {
    background: var(--grey-color-xlight);
}

.sa-autocomplete-avatar {
    width: 30px; height: 30px;
    border-radius: var(--radius-circle);
    background: linear-gradient(135deg, var(--color-footer-top), var(--color-footer));
    color: var(--white-color);
    font-size: var(--font-size-xs);
    font-weight: 700;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}

.sa-autocomplete-name {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--black-base);
}

.sa-autocomplete-phone {
    font-size: var(--font-size-xs);
    color: var(--grey-color-dark);
}

.sa-autocomplete-empty {
    padding: 12px 14px;
    font-size: var(--font-size-xs);
    color: var(--grey-color-dark);
    text-align: center;
}



.sd-btn--confirm-danger {
    background: var(--primary-color);
    color: var(--white-color);
    border-color: var(--primary-color);
}
.sd-btn--confirm-danger:hover {
    background: var(--color-footer-top);
    border-color: var(--color-footer-top);
}

.demo-btns {
    display: flex;
    gap: 12px;
    margin-bottom: 24px;
}

.demo-btn {
    padding: 10px 20px;
    border-radius: var(--radius-xs);
    border: none;
    font-size: var(--font-size-sm);
    font-weight: 600;
    cursor: pointer;
    transition: var(--transition-all-fast);
}

.demo-btn--edit {
    background: var(--color-footer-top);
    color: var(--white-color);
}

.demo-btn--delete {
    background: var(--primary-color);
    color: var(--white-color);
}

/* ══════════════════════════════
   DELETE MODAL (sd-)
══════════════════════════════ */
.sd-overlay {
    position: fixed;
    inset: 0;
    background: rgba(var(--black-opacity), 0.5);
    backdrop-filter: blur(4px);
    z-index: 9998;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: all 0.25s ease;
}

.sd-overlay.active {
    opacity: 1;
    visibility: visible;
}

.sd-modal {
    background: var(--white-color);
    border-radius: var(--radius-lg);
    width: 100%;
    max-width: 400px;
    margin: 16px;
    box-shadow: 0 24px 64px rgba(var(--black-opacity), 0.18);
    transform: scale(0.92) translateY(16px);
    transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
    overflow: hidden;
}

.sd-overlay.active .sd-modal {
    transform: scale(1) translateY(0);
}

.sd-modal-head {
    padding: 24px 24px 0;
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

.sd-modal-icon {
    width: 48px; height: 48px;
    border-radius: var(--radius-sm);
    background: rgba(var(--primary-opacity), 0.1);
    border: 1px solid rgba(var(--primary-opacity), 0.2);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
    color: var(--primary-color);
}

.sd-modal-title {
    color: var(--color-footer-top);
    font-size: 1.2rem;
    font-weight: 700;
    margin-bottom: 6px;
}

.sd-modal-desc {
    color: var(--grey-color-dark);
    font-size: 1rem;
    line-height: 1.5;
}

.sd-modal-info {
    color: var(--color-footer-top);
    background: var(--grey-color-xlight);
    font-size: 1rem;
    font-weight: 500;
    border-radius: var(--radius-xs);
    margin: 16px 24px;
    padding: 12px 16px;
    border-left: 3px solid var(--primary-color);
}

.sd-modal-foot {
    padding: 16px 24px 24px;
    display: flex;
    gap: 10px;
    justify-content: flex-end;
}

.sd-btn {
    font-size: 1rem;
    font-weight: 600;
    font-family: inherit;
    padding: 9px 20px;
    border-radius: var(--radius-xs);
    border: 1.5px solid;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    cursor: pointer;
    transition: var(--transition-all-fast);
}

.sd-btn--cancel {
    background: var(--white-color);
    color: var(--grey-color-dark);
    border-color: var(--grey-color-light);
}

.sd-btn--cancel:hover {
    border-color: var(--grey-color-dark);
    color: var(--black-base);
}

.sd-btn--confirm {
    background: var(--primary-color);
    color: var(--white-color);
    border-color: var(--primary-color);
}

.sd-btn--confirm:hover {
    background: var(--color-footer-top);
    border-color: var(--grey-color-light);
    transform: translateY(-1px);
}

/* ══════════════════════════════
   EDIT DRAWER (se-)
══════════════════════════════ */
.se-overlay {
    position: fixed;
    inset: 0;
    background: rgba(var(--black-opacity), 0.4);
    backdrop-filter: blur(4px);
    z-index: 99999;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
}

.se-overlay.active {
    opacity: 1;
    visibility: visible;
}

.se-drawer {
    position: fixed;
    top: 0; right: 0; bottom: 0;
    width: 480px;
    max-width: 100vw;
    background: var(--white-color);
    z-index: 100000;
    display: flex;
    flex-direction: column;
    box-shadow: -8px 0 40px rgba(var(--black-opacity), 0.12);
    transform: translateX(100%);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.se-overlay.active .se-drawer {
    transform: translateX(0);
}

.se-drawer-head {
    padding: 20px 24px;
    border-bottom: 1px solid var(--grey-color-light);
    display: flex;
    align-items: center;
    gap: 14px;
    flex-shrink: 0;
}

.se-drawer-icon {
    width: 40px; height: 40px;
    border-radius: var(--radius-sm);
    background: var(--color-footer-top);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}

.se-drawer-title {
    color: var(--black-color);
    font-size: 1.2rem;
    font-weight: 700;
    flex: 1;
}

.se-drawer-sub {
    color: var(--grey-color-dark);
    font-size: 1rem;
    margin-top: 1px;
}

.se-drawer-close {
    width: 32px; height: 32px;
    border-radius: var(--radius-xs);
    background: var(--grey-color-xlight);
    border: 1px solid var(--grey-color-light);
    display: flex; align-items: center; justify-content: center;
    cursor: pointer;
    color: var(--grey-color-dark);
    transition: var(--transition-all-fast);
    flex-shrink: 0;
}

.se-drawer-close:hover {
    background: rgba(var(--primary-opacity), 0.08);
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.se-drawer-body {
    flex: 1;
    overflow-y: auto;
    padding: 24px;
}

.se-drawer-body::-webkit-scrollbar { width: 4px; }
.se-drawer-body::-webkit-scrollbar-thumb { background: var(--grey-color-light); border-radius: 4px; }

.se-form-group {
    margin-bottom: 18px;
}

.se-label {
    color: var(--grey-color-dark);
    font-size: 1rem;
    font-weight: 700;
    display: block;
    margin-bottom: 6px;
}

.se-input,
.se-select,
.se-textarea {
    background: var(--white-color);
    color: var(--black-color);
    font-size: 1rem;
    font-family: inherit;
    width: 100%;
    padding: 10px 14px;
    border: 1.5px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    outline: none;
    transition: var(--transition-all-fast);
}

.se-input:focus,
.se-select:focus,
.se-textarea:focus {
    border-color: var(--color-footer-top);
    box-shadow: 0 0 0 3px rgba(17, 34, 53, 0.08);
}

.se-textarea {
    resize: vertical;
    min-height: 80px;
}

.se-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.se-divider {
    height: 1px;
    background: var(--grey-color-light);
    margin: 20px 0;
}

.se-section-title {
    color: var(--grey-color-dark);
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.se-section-title::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--grey-color-light);
}

.se-status-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}

.se-status-option {
    font-size: .9rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border-radius: var(--radius-xs);
    border: 1.5px solid var(--grey-color-light);
    cursor: pointer;
    transition: var(--transition-all-fast);
}

.se-status-option input { display: none; }

.se-status-option.beklemede:has(input:checked),
.se-status-option.beklemede:hover  { background: var(--white-color)beb; border-color: #fde68a; color: #d97706; }
.se-status-option.onaylandi:has(input:checked),
.se-status-option.onaylandi:hover  { background: #f0fdf4; border-color: #bbf7d0; color: #16a34a; }
.se-status-option.tamamlandi:has(input:checked),
.se-status-option.tamamlandi:hover { background: #f5f3ff; border-color: #ddd6fe; color: #7c3aed; }
.se-status-option.iptal:has(input:checked),
.se-status-option.iptal:hover      { background: #fef2f2; border-color: #fecaca; color: #dc2626; }

.se-status-dot {
    width: 8px; height: 8px;
    border-radius: var(--radius-circle);
    background: currentColor;
    flex-shrink: 0;
}

.se-drawer-foot {
    padding: 16px 24px;
    border-top: 1px solid var(--grey-color-light);
    display: flex;
    gap: 10px;
    flex-shrink: 0;
}

.se-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    font-size: 1rem;
    font-weight: 600;
    padding: 10px 20px;
    border-radius: var(--radius-xs);
    border: 1.5px solid;
    cursor: pointer;
    transition: var(--transition-all-fast);
    font-family: inherit;
    text-decoration: none;
}

.se-btn--save {
    flex: 1;
    background: var(--color-footer-top);
    color: var(--white-color);
    border-color: var(--color-footer-top);
}

.se-btn--save:hover {
    background: var(--primary-color);
    border-color: var(--primary-color-light);
}

.se-btn--cancel {
    background: var(--white-color);
    color: var(--grey-color-dark);
    border-color: var(--grey-color-light);
}

.se-btn--cancel:hover {
    border-color: var(--grey-color-dark);
    color: var(--black-base);
}

.sa-btn--delete-bulk {
    background: rgba(var(--primary-opacity), 0.08);
    color: var(--primary-color);
    border-color: var(--primary-color-extra-light);
}
.sa-btn--delete-bulk:hover {
    background: var(--primary-color);
    color: var(--white-color);
    border-color: var(--primary-color);
}

.sa-arrived {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: var(--font-size-xs);
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 20px;
}
.sa-arrived--yes {
    background: rgba(34, 197, 94, 0.12);
    color: #16a34a;
}
.sa-arrived--no {
    background: rgba(239, 68, 68, 0.12);
    color: #dc2626;
}
.sa-arrived-actions {
    display: flex;
    gap: 4px;
}
.sa-arrived-btn {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    border: 1.5px solid;
    background: transparent;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition-all-fast);
}
.sa-arrived-btn--yes {
    border-color: rgba(34, 197, 94, 0.4);
    color: #16a34a;
}
.sa-arrived-btn--yes:hover {
    background: #16a34a;
    border-color: #16a34a;
    color: white;
}
.sa-arrived-btn--no {
    border-color: rgba(239, 68, 68, 0.4);
    color: #dc2626;
}
.sa-arrived-btn--no:hover {
    background: #dc2626;
    border-color: #dc2626;
    color: white;
}

/* ============================================
   AF. SECRETARY APPOINTMENTS CREATE
   ============================================ */
.rc-slot-trigger {
    background: var(--white-color);
    color: var(--grey-color-dark);
    font-size: 1rem;
    font-family: inherit;
    width: 100%;
    padding: 10px 12px;
    border: 1.5px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    text-align: left;
    box-sizing: border-box;
    transition: var(--transition-all-fast);
}
.rc-slot-trigger__arrow {
    color: var(--grey-color);
    margin-left: auto;
    flex-shrink: 0;
    transition: transform .16s ease;
}
.rc-slot-trigger:hover        { border-color: var(--color-footer-top); }
.rc-slot-trigger--open        { border-color: var(--color-footer-top); box-shadow: 0 0 0 2px rgba(17,34,53,.08); }
.rc-slot-trigger--filled      { color: var(--black-base); font-weight: 500; border-color: var(--color-footer-top); }
.rc-slot-trigger--error       { border-color: var(--primary-color) !important; animation: rcShake .35s ease; }

@keyframes rcShake {
    0%,100% { transform: translateX(0); }
    20%      { transform: translateX(-5px); }
    40%      { transform: translateX(5px); }
    60%      { transform: translateX(-4px); }
    80%      { transform: translateX(4px); }
}

.rc-slot-panel-body {
    background: var(--white-color);
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-sm);
    box-shadow: 0 8px 32px rgba(0,0,0,.15);
    position: fixed;
    z-index: 99999;
    overflow: hidden;
}

.rc-slot-panel__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 11px 14px 10px;
    border-bottom: 1px solid var(--grey-color-light);
    background: var(--grey-color-xlight);
}
.rc-slot-panel__title {
    color: var(--color-footer-top);
    font-size: .9rem;
    font-weight: 700;
}
.rc-slot-panel__close {
    background: transparent; color: var(--grey-color-dark);
    width: 26px;
    height: 26px;
    border: none; border-radius: var(--radius-xs);
    display: grid;
    place-items: center;
    cursor: pointer; transition: var(--transition-all-fast);
}
.rc-slot-panel__close:hover { background: var(--grey-color-light); }

.rc-slot-loading {
    color: var(--grey-color-dark);
    font-size: 1rem;
    padding: 22px 16px;
    display: flex;
    align-items: center;
    gap: 6px;
    justify-content: center;
}
.rc-slot-loading__dot {
    background: var(--color-footer-top);
    width: 7px;
    height: 7px;
    border-radius: 50%;
    opacity: .25;
    animation: rcDotBounce .9s infinite ease-in-out both;
}
.rc-slot-loading__dot:nth-child(1) { animation-delay: -.3s; }
.rc-slot-loading__dot:nth-child(2) { animation-delay: -.15s; }
@keyframes rcDotBounce {
    0%,80%,100% { transform: scale(.5); opacity: .2; }
    40%          { transform: scale(1);  opacity: 1; }
}

.rc-slot-placeholder {
    padding: 26px 16px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}
.rc-slot-placeholder p {
    color: var(--grey-color-dark);
    font-size: 1rem;
    line-height: 1.55;
    margin: 0;
}
.rc-slot-placeholder strong { color: var(--color-footer-top); }

.rc-slot-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 6px;
    padding: 12px 12px 4px;
    max-height: 240px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--grey-color-light) transparent;
}

.rc-slot-item {
    background: var(--white-color);
    color: var(--black-base);
    font-size: 1rem;
    font-weight: 600;
    font-family: inherit;
    height: 36px;
    border: 1.5px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: var(--transition-all-fast);
    white-space: nowrap;
}
.rc-slot-item:not(.rc-slot-item--busy):hover {
    background: var(--grey-color-xlight);
    border-color: var(--color-footer-top);
    color: var(--color-footer-top);
    transform: scale(1.05);
}
.rc-slot-item:not(.rc-slot-item--busy):active { transform: scale(.95); }

.rc-slot-item--selected {
    background: var(--color-footer-top) !important;
    border-color: var(--color-footer-top) !important;
    color: var(--white-color) !important;
    box-shadow: 0 2px 8px rgba(17,34,53,.2);
}

.rc-slot-item--busy {
    background: #fef2f2;
    color: #dc2626;
    border-color: #fecaca;
    cursor: not-allowed;
    font-size: .75rem;
    text-decoration: line-through;
    opacity: .8;
}

.rc-slot-legend {
    background: var(--grey-color-xlight);
    border-top: 1px solid var(--grey-color-light);
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 8px 12px 11px;
}
.rc-slot-legend__item  { display: flex; align-items: center; gap: 5px; font-size: .9rem; color: var(--grey-color-dark); }
.rc-slot-legend__dot   { width: 9px; height: 9px; border-radius: 2px; flex-shrink: 0; }
.rc-slot-legend__dot--free     { background: var(--white-color); border: 1.5px solid var(--grey-color-light); }
.rc-slot-legend__dot--busy     { background: #fef2f2; border: 1.5px solid #fecaca; }
.rc-slot-legend__dot--selected { background: var(--color-footer-top); }


.rc-patient-toggle {
    background: var(--grey-color-xlight);
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    margin-bottom: 8px;
    padding: 3px;
    display: flex;
    gap: 4px;
}

.rc-patient-toggle__btn {
    background: transparent;
    color: var(--grey-color-dark);
    font-size: .9rem;
    font-weight: 600;
    font-family: inherit;
    padding: 5px 11px;
    border-radius: var(--radius-xs);
    border: none;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
    transition: var(--transition-all-fast);
    flex: 1;
    justify-content: center;
    white-space: nowrap;
}

.rc-patient-toggle__btn:hover {
    background: var(--white-color);
    color: var(--color-footer-top);
}

.rc-patient-toggle__btn--active {
    background: var(--white-color);
    color: var(--color-footer-top);
    box-shadow: 0 1px 4px rgba(0,0,0,.08);
}

.rc-new-patient {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.rc-new-patient__hint {
    color: var(--grey-color-dark);
    font-size: .9rem;
    margin-top: 2px;
    display: flex;
    align-items: center;
    gap: 5px;
}

.rc-anonymous-info {
    background: var(--grey-color-xlight);
    color: var(--grey-color-dark);
    font-size: .9rem;
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    padding: 10px 12px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.rc-wrap {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 24px;
    align-items: start;
}

.rc-error-bar {
    background: #fef2f2;
    color: #dc2626;
    font-size: var(--font-size-sm);
    margin-bottom: 20px;
    border: 1px solid #fecaca;
    border-radius: var(--radius-sm);
    padding: 14px 18px;
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.rc-header {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 20px;
    animation: rcFadeUp 0.4s ease both;
}

.rc-header-icon {
    background: var(--color-footer-top);
    width: 46px;
    height: 46px;
    border-radius: var(--radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.rc-title {
    color: var(--color-footer-top);
    font-size: var(--font-size-xl);
    font-weight: 800;
    margin: 0;
}

.rc-sub {
    color: var(--grey-color-dark);
    font-size: var(--font-size-xs);
    margin: 2px 0 0;
}

.rc-back-btn {
    background: var(--white-color);
    color: var(--grey-color-dark);
    font-size: var(--font-size-sm);
    font-weight: 600;
    border-radius: var(--radius-xs);
    border: 1.5px solid var(--grey-color-light);
    margin-left: auto;
    padding: 7px 14px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
    transition: var(--transition-all-fast);
}
.rc-back-btn:hover { border-color: var(--color-footer-top); color: var(--color-footer-top); }

.rc-card {
    background: var(--grey-color-xlight);
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-lg);
    padding: 22px 24px;
    margin-bottom: 16px;
    box-shadow: 0 2px 8px rgba(var(--black-opacity), 0.04);
    animation: rcFadeUp 0.4s ease both;
}

.rc-card-label {
    color: var(--grey-color-dark);
    font-size: 1rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 18px;
}

.rc-step {
    background: var(--color-footer-top);
    color: var(--white-color);
    font-size: .9rem;
    font-weight: 800;
    width: 25px;
    height: 25px;
    border-radius: var(--radius-circle);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}

.rc-field-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.rc-field { display: flex; flex-direction: column; gap: 6px; }

.rc-label {
    color: var(--grey-color-dark);
    font-size: 1rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 6px;
}

.rc-req { color: var(--primary-color); font-weight: 700; }
.rc-opt { color: var(--grey-color-dark); font-weight: 500; font-size: .9rem; }

.rc-select-wrap {
    position: relative;
    display: flex;
    align-items: center;
}

.rc-select-icon {
    color: var(--grey-color);
    left: 12px;
    position: absolute;
    pointer-events: none;
    z-index: 1;
}

.rc-select-arrow {
    color: var(--grey-color);
    position: absolute;
    right: 12px;
    pointer-events: none;
}

.rc-select {
    background: var(--white-color);
    color: var(--black-base);
    font-size: 1rem;
    font-family: inherit;
    width: 100%;
    padding: 10px 36px 10px 34px;
    border: 1.5px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    outline: none;
    appearance: none;
    -webkit-appearance: none;
    transition: var(--transition-all-fast);
    cursor: pointer;
}
.rc-select:focus { /*border-color: var(--color-footer-top);*/ box-shadow: 0 0 0 1px rgba(17,34,53,0.08); }

.rc-input-wrap { position: relative; display: flex; align-items: center; }
.rc-input-icon { position: absolute; left: 12px; color: var(--grey-color); pointer-events: none; }
.rc-input {
    background: var(--white-color);
    color: var(--black-base);
    font-size: 1rem;
    font-family: inherit;
    width: 100%;
    padding: 10px 12px 10px 34px;
    border: 1.5px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    outline: none;
    transition: var(--transition-all-fast);
}
.rc-input:focus {/* border-color: var(--color-footer-top);*/ box-shadow: 0 0 0 1px rgba(17,34,53,0.08); }

.rc-date-display {
    color: var(--primary-color);
    font-size: .8rem;
    font-weight: 600;
    min-height: 16px;
}

.rc-conflict {
    color: var(--primary-color);
    font-size: var(--font-size-xs);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 5px;
}

.rc-type-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.rc-type-card {
    background: var(--white-color);
    border: 2px solid var(--grey-color-light);
    border-radius: var(--radius-sm);
    padding: 18px 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    transition: var(--transition-all-fast);
    text-align: center;
}
.rc-type-card input { display: none; }
.rc-type-card:hover { border-color: var(--color-footer-top); background: var(--grey-color-xlight); }
.rc-type-card.active { border-color: var(--color-footer-top); background: rgba(17,34,53,0.04); }

.rc-type-icon {
    background: var(--grey-color-light);
    color: var(--grey-color-dark);
    width: 44px;
    height: 44px;
    border-radius: var(--radius-sm);
    display: flex; align-items: center; justify-content: center;
    transition: var(--transition-all-fast);
}
.rc-type-card.active .rc-type-icon { background: var(--color-footer-top); color: var(--white-color); }

.rc-type-label {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 700;
}
.rc-type-sub   { font-size: 1rem; color: var(--grey-color-dark); }

.rc-textarea-wrap { position: relative; }
.rc-textarea {
    background: var(--white-color);
    color: var(--black-base);
    font-size: 1rem;
    font-family: inherit;
    width: 100%;
    min-height: 90px;
    padding: 10px 14px;
    border: 1.5px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    outline: none;
    resize: vertical;
    transition: var(--transition-all-fast);
}
.rc-textarea:focus { /*border-color: var(--color-footer-top);*/ box-shadow: 0 0 0 1px rgba(17,34,53,0.08); }

.rc-submit-row {
    display: flex;
    align-items: center;
    gap: 14px;
    animation: rcFadeUp 0.4s ease both;
}


.rc-summary-col { position: sticky; top: 24px; }

.rc-summary-card {
    background: var(--grey-color-xlight);
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-lg);
    padding: 22px;
    box-shadow: 0 2px 16px rgba(var(--black-opacity), 0.06);
    animation: rcFadeUp 0.4s ease 0.2s both;
}

.rc-summary-title {
    color: var(--color-footer-top);
    font-size:1.2rem;
    font-weight: 800;
    margin-bottom: 18px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--grey-color-light);
}

.rc-summary-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 14px;
}

.rc-summary-icon {
    background: var(--white-color);
    color: var(--grey-color-dark);
    width: 35px;
    height: 35px;
    border-radius: var(--radius-xs);
    border: 1px solid var(--grey-color-light);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}

.rc-summary-label {
    color: var(--grey-color-dark);
    font-size: .9rem;
    font-weight: 600;
    margin-bottom: 2px;
}

.rc-summary-val {
    color: var(--color-footer-top);
    font-size: .9rem;
    font-weight: 600;
}

.rc-summary-divider {
    background: var(--grey-color-light);
    height: 1px;
    margin: 16px 0;
}

.rc-summary-badge {
    background: var(--white-color)beb;
    color: #d97706;
    font-size: .8rem;
    font-weight: 700;
    border: 1px solid #fde68a;
    border-radius: var(--radius-xs);
    padding: 6px 14px;
    margin-top: 6px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.rc-summary-badge-dot {
    background: #d97706;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    animation: rcPulse 2s infinite;
}

/* Busy slots */
.rc-busy-slots {
    background: var(--white-color)beb;
    margin-top: 6px;
    padding: 8px 10px;
    border: 1px solid #fde68a;
    border-radius: var(--radius-xs);
}

.rc-busy-title {
    color: #d97706;
    font-size: var(--font-size-xs);
    font-weight: 700;
    margin-bottom: 6px;
    display: flex;
    align-items: center;
    gap: 5px;
}

.rc-busy-list {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.rc-busy-chip {
    background: #fef3c7;
    color: #92400e;
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
    border: 1px solid #fde68a;
    border-radius: var(--radius-full);
}

.rc-conflict {
    color: var(--primary-color);
    font-size: var(--font-size-xs);
    font-weight: 600;
    margin-top: 4px;
    display: flex;
    align-items: center;
    gap: 5px;
}

.rc-available {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: var(--font-size-xs);
    font-weight: 600;
    color: #16a34a;
    margin-top: 4px;
}

@keyframes rcFadeUp {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes rcPulse {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.4; }
}

@keyframes rcSpin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

@media (max-width: 900px) {
    .rc-wrap { grid-template-columns: 1fr; }
    .rc-summary-col { position: static; }
}

@media (max-width: 640px) {
    .rc-field-row { grid-template-columns: 1fr; }
    .rc-type-grid  { grid-template-columns: 1fr; }
}







/*---------------------------------------------------
   7.Y Session
-----------------------------------------------------*/
 .session-text {
     color: var(--grey-color-xxdark);
     font-size: .8rem;
     line-height: 1.6;
     font-weight: normal;
 }

 .clinic-bg {
     background: var(--grey-color-xlight);
 }

.clinic-sidebar {
    background: linear-gradient(135deg,#1f2937,var(--color-footer-top));
    color: var(--white-color);
}

.clinic-card {
    background: var(--white-color)fff;
}

.clinic-soft-box {
    background: var(--grey-color-xlight);
    border: 1px solid #e5e7eb;
}

.clinic-main-title {
    color: var(--color-footer-top);
    font-size: 26px;
    font-weight: 700;
    letter-spacing: -0.3px;
}

.clinic-section-title {
    position: relative;
    padding-left: 12px;
    margin-bottom: .8rem;
    font-weight: 600;
    color: var(--color-footer-top);
}

.clinic-section-title::before {
    content: "";
    position: absolute;
    left: 0;
    top: 6px;
    width: 4px;
    height: 14px;
    background: var(--color-footer-top);
    border-radius: 3px;
}

.clinic-soft-box textarea:focus {
    box-shadow: none;
    outline: none;
}

.clinic-badge {
    background: #e5e7eb;
    color: var(--color-footer-top);
}

.clinic-history-item {
    background: var(--white-color)fff;
    border: 1px solid #e5e7eb;
    transition: 0.2s ease;
}

.clinic-history-item:hover {
    background: #f9fafb;
    transform: translateY(-2px);
}

.previus-section-title{
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 12px;
}


.seans-card {
    background: var(--white-color);
    border: 1px solid #e9ecf0;
    border-radius: 14px;
    box-shadow: 0 10px 50px 0 rgba(217,220,232,1);
    display: grid;
    grid-template-columns: auto 1fr auto auto;
    align-items: center;
    position: relative;
    overflow: hidden;
    transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
    animation: fadeUp .3s ease both;
}
.seans-card::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0; width: 3px;
    background: var(--color-footer-top);
    opacity: 0;
    transition: opacity .2s ease;
}
.seans-card:hover {
    box-shadow: 0 12px 30px rgba(17, 34, 53, 0.2);
    transform: translateY(-2px);
    border-color: transparent;
}
.seans-card:hover::before { opacity: 1; }

.seans-avatar-wrap { padding: 20px 0 20px 22px; }
.seans-avatar {
    background: var(--color-footer-top);
    color: var(--white-color);
    width: 50px;
    height: 50px;
    border-radius: 13px;
    display: flex; align-items: center;
    justify-content: center;
    box-shadow: 0 3px 12px rgba(0,0,0,.15);
}

.seans-info {
    padding: 20px 16px;
    min-width: 0;
}
.seans-name {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.seans-date {
    color: var(--grey-color-deep);
    font-size: .9rem;
    display: flex;
    align-items: center;
    gap: 5px;
}
.seans-date svg { opacity: .55; }

.seans-meta {
    padding: 20px 22px;
    border-left: 1px solid var(--grey-color-light);
    border-right: 1px solid var(--grey-color-light);
    display: flex;
    align-items: center; gap: 28px;
}
@media (max-width: 767px) {
    .seans-meta { display: none; }
    .seans-card { grid-template-columns: auto 1fr auto; }
}
.seans-meta-item { text-align: center; min-width: 60px; }
.seans-meta-label {
    color: var(--grey-color-deep);
    font-size: .9rem;
    font-weight: 600;
    display: block;
    margin-bottom: 5px;
}
.seans-badge {
    background: #f3f4f6;
    color: var(--color-footer-top);
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: .8rem;
    font-weight: 600;
    padding: 3px 9px;
    border-radius: 6px;
}
.seans-diagnosis {
    color: var(--color-footer-top);
    font-size: .8rem;
    font-weight: 600;
    max-width: 130px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.seans-actions {
    display: flex;
    flex-direction: column;
    gap: 7px;
    padding: 18px 18px 18px 16px;
}

.seans-btn {
    display: inline-flex; align-items: center; gap: 5px;
    border: none; border-radius: 8px;
    font-size: .76rem; font-weight: 600;
    cursor: pointer; text-decoration: none; padding: 7px 13px; white-space: nowrap;
    transition: filter .2s ease, background .2s ease, color .2s ease;
}
.seans-btn-primary {
    background: var(--color-footer-top);
    color: var(--white-color);
    box-shadow: 0 10px 50px 0 rgb(217, 220, 232);
}
.seans-btn-primary:hover {
    filter: brightness(1.1);
    color: var(--primary-color);
}
.seans-btn-ghost {
    background: #f8f9fb;
    color: #6b7280;
    border: 1px solid #e9ecf0;
}
.seans-btn-ghost:hover {
    background: var(--primary-color-extra-light);
    color: var(--primary-color);
    border-color: var(--primary-color-extra-light);
}
.seans-empty {
    background: var(--white-color);
    border: 1px dashed #e9ecf0;
    border-radius: 14px;
    padding: 64px 24px;
    text-align: center;
}
.seans-empty-icon {
    color: #9ca3af;
    background: #f8f9fb;
    width: 52px;
    height: 52px;
    margin: 0 auto 14px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.seans-empty-title {
    font-size: 1.05rem;
    color: #111827;
    margin: 0 0 5px;
}
.seans-empty-sub {
    font-size: .8rem;
    color: #6b7280;
    margin: 0;
}
.seans-loader {
    color: #6b7280;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 15px 0;
    font-size: 1rem;
    opacity: 0;
    transition: opacity .25s;
}
.seans-loader.visible { opacity: 1; }
.seans-loader-dots { display: flex; gap: 5px; }
.seans-loader-dots span {
    background: var(--color-footer-top);
    width: 7px;
    height: 7px;
    border-radius: 50%;
    animation: dotPulse 1.2s ease-in-out infinite;
}
.seans-loader-dots span:nth-child(2) { animation-delay: .2s; }
.seans-loader-dots span:nth-child(3) { animation-delay: .4s; }
.seans-end {
    color: var(--grey-color-deep);
    text-align: center;
    padding: 20px 0;
    font-size: 1rem;
    opacity: 0;
    transition: opacity .3s;
}
.seans-end.visible { opacity: 1; }

/* ── Infinite Scroll — End Message ────────────────── */
.appt-end,
.pt-end,
.seans-end {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 600;
    text-align: center;
    padding: 16px;
    opacity: 0;
    transition: opacity .3s;
    display: block;
}

.appt-end.visible,
.pt-end.visible,
.seans-end.visible {
    opacity: 1;
}

.appt-end,
.pt-end,
.seans-end {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 600;
    text-align: center;
    padding: 16px;
    opacity: 0;
    transition: opacity .3s;
}

.appt-end.visible,
.pt-end.visible,
.seans-end.visible {
    opacity: 1;
}
/*------------------------------------- Seans Geçmişim----------------*/
.session-panel {color: #0d1117; }

.session-stat-card {
    background: var(--white-color);
    border: 1px solid #eaecf2;
    border-radius: var(--radius-lg);
    padding: 22px 20px;
    position: relative;
    overflow: hidden;
    transition: box-shadow .2s, transform .2s;
    animation: sessionUp .4s ease both;
    height: 100%;
}
.session-stat-card:hover { box-shadow: 0 8px 28px rgba(0,0,0,.08); transform: translateY(-2px); }
.session-stat-card::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0; height: 3px;
    background: var(--color-footer-top);
    transform: scaleX(0);
    transition: transform .3s ease;
    transform-origin: left;
}
.session-stat-card:hover::after { transform: scaleX(1); }

.session-stat-card > div {
    background: color-mix(in srgb, var(--color-footer-top) 10%, transparent);
    color: var(--color-footer-top);
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: flex; align-items: center;
    justify-content: center;
    margin-bottom: 14px;
}

.session-stat-card > span:nth-of-type(1) {
    color: #9aa0b4;
    font-size: .9rem;
    font-weight: 700;
    display: block;
    margin-bottom: 6px;
}
.session-stat-card > span:nth-of-type(2) {
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--color-footer-top);
    line-height: 1;
    display: block;
}
.session-stat-card > span:nth-of-type(3) {
    color: #b0b6c8;
    font-size: .9rem;
    margin-top: 4px;
    display: block;
}

.session-progress-card {
    background: var(--white-color);
    border: 1px solid #eaecf2;
    border-radius: 16px;
    padding: 24px;
    height: 100%;
    animation: sessionUp .4s .22s ease both;
}
.session-progress-card > header {
    display: flex; align-items: center;
    justify-content: space-between; margin-bottom: 16px; gap: 12px;
}
.session-progress-card > header > p {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 700;
    margin: 0;
}
.session-progress-card > header > span {
    background: color-mix(in srgb, var(--color-footer-top) 10%, transparent);
    color: var(--color-footer-top);
    border: 1px solid color-mix(in srgb, var(--color-footer-top) 20%, transparent);
    font-size: .8rem;
    font-weight: 700;
    padding: 4px 12px; border-radius: 20px;
    white-space: nowrap;
}
.session-progress-track {
    height: 8px; background: #f0f2f7; border-radius: 99px; overflow: hidden;
}
.session-progress-fill {
    height: 100%;
    background: linear-gradient(90deg, var(--color-footer-top), color-mix(in srgb, var(--color-footer-top) 70%, var(--white-color)));
    border-radius: 99px;
}
.session-progress-card > footer {
    display: flex; justify-content: space-between;
    align-items: center; margin-top: 10px;
}
.session-progress-card > footer > span:first-child { font-size: .9rem; color: #9aa0b4; }
.session-progress-card > footer > span:last-child {
    font-size: 1rem; font-weight: 700; color: var(--color-footer-top);
}

.session-last-card {
    background: var(--white-color);
    border: 1px solid #eaecf2;
    border-radius: 16px;
    padding: 24px;
    height: 100%;
    position: relative;
    overflow: hidden;
    animation: sessionUp .4s .22s ease both;
}
.session-last-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0; width: 4px; height: 100%;
    background: var(--color-footer-top);
}
.session-last-card > header {
    display: flex; align-items: center;
    justify-content: space-between; margin-bottom: 16px;
}
.session-last-card > header > p {
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-footer-top);
    margin: 0;
}
.session-last-card > header > span {
    color: var(--white-color);
    background: var(--color-footer-top);
    font-size: .8rem;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 20px;
}

.session-last-card .meta { display: flex; flex-direction: column; gap: 10px; margin-bottom: 16px; }
.session-last-card .meta > div {
    display: flex; align-items: center; gap: 10px;
}
.session-last-card .meta > div > i {
    width: 28px; height: 28px; border-radius: 7px;
    background: color-mix(in srgb, var(--color-footer-top) 10%, transparent);
    color: var(--color-footer-top);
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.session-last-card .meta > div > b {
    color: #b0b6c8;
    font-size: .9rem;
    font-weight: 700;
    width: 60px;
    line-height: 1;
    display: block;
}
.session-last-card .meta > div > span {
    font-size: .9rem;
    font-weight: 600;
    color: var(--color-footer-top);
}

.session-last-card hr { border: none; border-top: 1px solid #f0f2f7; margin: 0 0 14px; }
.session-last-card > small {
    font-size: .9rem;
    font-weight: 700;
    color: #9aa0b4;
    display: block;
    margin-bottom: 8px;
}
.session-last-card > p {
    font-size: .9rem;
    color: #4a5168;
    line-height: 1.65;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.session-last-card .empty {
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    min-height: 140px; color: #b0b6c8;
    font-size: .8rem; text-align: center; gap: 10px;
}
.session-last-card .empty svg { opacity: .35; }

.session-history-card {
    background: var(--white-color); border: 1px solid #eaecf2;
    border-radius: 16px; overflow: hidden;
    animation: sessionUp .4s .28s ease both;
}
.session-history-card > header {
    display: flex; align-items: center;
    justify-content: space-between;
    padding: 20px 24px; border-bottom: 1px solid #f0f2f7;
}
.session-history-card > header > p {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 700;
    margin: 0;
}
.session-history-card > header > span {
    color: #9aa0b4;
    background: #f4f5f9;
    font-size: .9rem;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 20px;
}

.session-history-table { width: 100%; border-collapse: collapse; }
.session-history-table thead tr { background: var(--grey-color-xlight); }
.session-history-table thead th {
    color: #9aa0b4;
    font-size: 1rem;
    font-weight: 700;
    padding: 11px 20px;
    text-align: left;
    border-bottom: 1px solid #f0f2f7;
}
.session-history-table tbody tr { border-bottom: 1px solid #f7f8fc; transition: background .15s; }
.session-history-table tbody tr:last-child { border-bottom: none; }
.session-history-table tbody tr:hover { background: #fafbff; }
.session-history-table td {
    color: #3a4058;
    font-size: .9rem;
    font-weight: 700;
    padding: 14px 20px;
    vertical-align: middle;
}

.session-history-table td:first-child { display: table-cell; }
.session-history-table td:first-child div { display: flex; flex-direction: column; gap: 2px; }
.session-history-table td:first-child div > span:first-child { font-weight: 700;
    color: var(--color-footer-top);
    font-size: .9rem; }
.session-history-table td:first-child div > span:last-child  { font-size: .9rem; color: #b0b6c8; }

.session-history-table td:nth-child(2) div { display: flex; align-items: center; gap: 9px; }
.session-history-table td:nth-child(2) div > span:first-child {
    background: color-mix(in srgb, var(--color-footer-top) 10%, transparent);
    color: var(--color-footer-top);
    font-size: .9rem;
    font-weight: 700;
    width: 30px;
    height: 30px;
    border-radius: 8px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.session-history-table td:nth-child(2) div > span:last-child {
    color: var(--color-footer-top);
    font-weight: 600;
    font-size: .9rem;
}

.session-history-table td:last-child span {
    color: #7a8099;
    font-size: .9rem;
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
}

@media (max-width: 767px) {
    .session-history-table thead { display: none; }
    .session-history-table tbody tr { display: block; padding: 14px 16px; border-bottom: 1px solid #f0f2f7; }
    .session-history-table td { display: flex; justify-content: space-between; align-items: center; padding: 5px 0; border: none; font-size: .8rem; }
    .session-history-table td::before { content: attr(data-label); font-size: .67rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: #b0b6c8; flex-shrink: 0; margin-right: 12px; }
}

.session-history-empty { text-align: center; padding: 56px 24px; color: #b0b6c8; font-size: .82rem; }
.session-history-empty svg { display: block; margin: 0 auto 12px; opacity: .4; }

@keyframes sessionUp {
    from { opacity: 0; transform: translateY(14px); }
    to   { opacity: 1; transform: translateY(0); }
}
@keyframes sessionDot {
    0%,80%,100% { transform: scale(.7); opacity: .4; }
    40%         { transform: scale(1);  opacity: 1; }
}

/*--------------------------------------- Seans Geçmişim -----------------------*/


/*---------------------------------------------------
   7.Z Children
-----------------------------------------------------*/
/*.child-card{
    border:0;
    border-radius:16px;
    box-shadow:0 10px 25px rgba(0,0,0,0.08);
    transition:all .25s;
    background:var(--white-color);
}

.child-card:hover{
    transform:translateY(-4px);
    box-shadow:0 15px 35px rgba(0,0,0,0.12);
}

.child-avatar{
    width:50px;
    height:50px;
    border-radius:50%;
    background:#4e73df;
    color:var(--white-color);
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:bold;
    font-size:20px;
}

.child-info{
    font-size:14px;
}

.info-row{
    display:flex;
    justify-content:space-between;
    margin-bottom:10px;
    padding-bottom:6px;
    border-bottom:1px solid #f1f1f1;
}

.info-row span{
    font-weight:600;
}

.therapy-progress-card{
    background:var(--white-color);
    border-radius:16px;
    box-shadow:0 10px 30px rgba(0,0,0,0.08);
}

.therapy-progress{
    height:12px;
    border-radius:20px;
    background:#f1f3f7;
}

.therapy-progress .progress-bar{
    background:linear-gradient(90deg,#4facfe,#00f2fe);
    border-radius:20px;
}

.children-panel { font-family: var(--primary-font), sans-serif; }

.children-panel > header {
    display: flex; align-items: center;
    justify-content: space-between; margin-bottom: 20px;
}
.children-panel > header > p {
    font-size: 1rem; font-weight: 600; color: #0d1117; margin: 0;
}
.children-panel > header > span {
    font-size: .72rem; font-weight: 700;
    color: #9aa0b4; background: #f4f5f9;
    padding: 3px 10px; border-radius: 20px;
}

.child-profile-card {
    background: var(--white-color);
    border: 1px solid #eaecf2;
    border-radius: 20px;
    overflow: hidden;
    height: 100%;
    animation: childUp .4s ease both;
    transition: box-shadow .2s;
}
.child-profile-card:hover { box-shadow: 0 8px 32px rgba(0,0,0,.07); }

.child-profile-card > header {
    background: var(--color-footer-top);
    padding: 24px 22px 20px;
    display: flex; align-items: center; gap: 14px;
}

.child-profile-avatar {
    width: 52px; height: 52px; border-radius: 14px;
    background: rgba(255,255,255,.2);
    border: 2px solid rgba(255,255,255,.3);
    color: var(--white-color);
    font-size: 1.3rem; font-weight: 700;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}

.child-profile-card > header > div > p {
    font-size: .98rem; font-weight: 600;
    color: var(--white-color); margin: 0 0 3px;
}
.child-profile-card > header > div > span {
    font-size: .68rem; font-weight: 700;
    letter-spacing: .09em; text-transform: uppercase;
    color: rgba(255,255,255,.6);
}

.child-session-count {
    margin-left: auto; text-align: right; flex-shrink: 0;
}
.child-session-count > strong {
    font-size: 1.5rem; font-weight: 700;
    color: var(--white-color); display: block; line-height: 1;
}
.child-session-count > small {
    font-size: .65rem; font-weight: 700;
    letter-spacing: .08em; text-transform: uppercase;
    color: rgba(255,255,255,.55);
}

.child-profile-form { padding: 20px 22px; }

.child-field {
    margin-bottom: 14px;
}
.child-field:last-of-type { margin-bottom: 0; }

.child-field > label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: .67rem;
    font-weight: 700;
    color: #9aa0b4; margin-bottom: 6px;
}
.child-field > label > i {
    width: 25px;
    height: 25px;
    border-radius: 5px;
    background: color-mix(in srgb, var(--color-footer-top) 10%, transparent);
    color: var(--color-footer-top);
    display: flex;
    align-items: center;
    justify-content: center;
    font-style: normal;
    flex-shrink: 0;
}

.child-field > input,
.child-field > select,
.child-field > textarea {
    width: 100%;
    background: #f8f9fb;
    border: 1.5px solid #eaecf2;
    border-radius: 10px;
    padding: 10px 14px;
    font-size: .85rem; font-weight: 600;
    color: #0d1117;
    transition: border-color .2s, background .2s, box-shadow .2s;
    outline: none;
    pointer-events: none;
    cursor: default;
}

.child-field > textarea { resize: none; }

.child-profile-card.editing .child-field > input,
.child-profile-card.editing .child-field > select,
.child-profile-card.editing .child-field > textarea {
    pointer-events: all;
    cursor: text;
    background: var(--white-color);
    border-color: #d0d5e8;
}
.child-profile-card.editing .child-field > input:focus,
.child-profile-card.editing .child-field > select:focus,
.child-profile-card.editing .child-field > textarea:focus {
    border-color: var(--color-footer-top);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-footer-top) 12%, transparent);
}

.child-profile-actions {
    display: flex; align-items: center;
    justify-content: space-between;
    padding: 16px 22px;
    border-top: 1px solid #f0f2f7;
    gap: 10px;
}

.child-edit-btn {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: .8rem; font-weight: 700;
    padding: 9px 18px; border-radius: 10px;
    cursor: pointer; transition: all .2s; border: none;
}

.child-edit-btn.trigger {
    background: #f4f5f9;
    color: #4a5168;
    margin-left: auto;
}
.child-edit-btn.trigger:hover { background: #eaecf2; }

.child-edit-btn.save {
    background: var(--color-footer-top);
    color: var(--white-color);
    box-shadow: 0 3px 12px rgba(0,0,0,.15);
    display: none;
}
.child-edit-btn.save:hover { filter: brightness(1.08); }

.child-edit-btn.cancel {
    background: transparent;
    color: #9aa0b4;
    border: 1.5px solid #eaecf2;
    display: none;
}
.child-edit-btn.cancel:hover { border-color: #d0d5e8; color: #4a5168; }

.child-profile-card.editing .child-edit-btn.trigger { display: none; }
.child-profile-card.editing .child-edit-btn.save { display: inline-flex; }
.child-profile-card.editing .child-edit-btn.cancel { display: inline-flex; }

.children-empty {
    text-align: center; padding: 64px 24px;
    color: #b0b6c8; font-size: .85rem;
}
.children-empty svg { display: block; margin: 0 auto 14px; opacity: .35; }*/
.child-card {
    border: 0;
    border-radius: var(--radius-lg);
    box-shadow: 0 10px 25px rgba(var(--black-opacity), 0.08);
    transition: var(--transition-all-fast);
    background: var(--white-color);
}

.child-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 35px rgba(var(--black-opacity), 0.12);
}

.child-avatar {
    width: 50px;
    height: 50px;
    border-radius: var(--radius-circle);
    background: var(--color-footer-top);
    color: var(--white-color);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size: 1.25rem;
}

.child-info {
    font-size: var(--font-size-sm);
}

.info-row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--grey-color-xlight);
}

.info-row span {
    font-weight: 600;
}

.therapy-progress-card {
    background: var(--white-color);
    border-radius: var(--radius-lg);
    box-shadow: 0 10px 30px rgba(var(--black-opacity), 0.08);
}

.therapy-progress {
    height: 12px;
    border-radius: var(--radius-xl);
    background: var(--grey-color-xlight);
}

.therapy-progress .progress-bar {
    background: linear-gradient(90deg, var(--secondary-color), var(--secondary-color-light));
    border-radius: var(--radius-xl);
}

/* ── Children Panel ── */
.children-panel {
    font-family: var(--primary-font), sans-serif;
}

.children-panel > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.children-panel > header > p {
    font-size: var(--font-size-base);
    font-weight: 600;
    color: var(--color-footer-top);
    margin: 0;
}

.children-panel > header > span {
    font-size: var(--font-size-xs);
    font-weight: 700;
    color: var(--grey-color-dark);
    background: var(--grey-color-xlight);
    padding: 3px 10px;
    border-radius: var(--radius-xl);
}

/* ── Child Profile Card ── */
.child-profile-card {
    background: var(--white-color);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    overflow: hidden;
    height: 100%;
    animation: childUp .4s ease both;
    transition: var(--transition-all-fast);
}

.child-profile-card:hover {
    box-shadow: 0 8px 32px rgba(var(--black-opacity), 0.07);
}

.child-profile-card > header {
    background: var(--color-footer-top);
    padding: 24px 22px 20px;
    display: flex;
    align-items: center;
    gap: 14px;
}

.child-profile-avatar {
    width: 52px;
    height: 52px;
    border-radius: var(--radius-md);
    background: var(--color-white-transparent);
    border: 2px solid rgba(var(--white-opacity), 0.3);
    color: var(--white-color);
    font-size: 1.3rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.child-profile-card > header > div > p {
    font-size: var(--font-size-base);
    font-weight: 600;
    color: var(--white-color);
    margin: 0 0 3px;
}

.child-profile-card > header > div > span {
    font-size: 1rem;
    font-weight: 700;
    color: rgba(var(--white-opacity), 0.6);
}

.child-session-count {
    margin-left: auto;
    text-align: right;
    flex-shrink: 0;
}

.child-session-count > strong {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--white-color);
    display: block;
    line-height: 1;
}

.child-session-count > small {
    font-size: var(--font-size-xs);
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: rgba(var(--white-opacity), 0.55);
}

.child-profile-form {padding: 20px 22px;}

.child-field {margin-bottom: 14px;}

.child-field:last-of-type {
    margin-bottom: 0;
}

.child-field > label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: var(--font-size-xs);
    font-weight: 700;
    color: var(--grey-color-dark);
    margin-bottom: 6px;
}

.child-field > label > i {
    width: 25px;
    height: 25px;
    border-radius: var(--radius-xs);
    background: rgba(var(--primary-opacity), 0.1);
    color: var(--color-footer-top);
    display: flex;
    align-items: center;
    justify-content: center;
    font-style: normal;
    flex-shrink: 0;
}

.child-field > input,
.child-field > select,
.child-field > textarea {
    width: 100%;
    background: var(--grey-color-xlight);
    border: 1.5px solid var(--color-border);
    border-radius: var(--radius-sm);
    padding: 10px 14px;
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-heading);
    transition: var(--transition-all-fast);
    outline: none;
    pointer-events: none;
    cursor: default;
}

.child-field > textarea {
    resize: none;
}

.child-profile-card.editing .child-field > input,
.child-profile-card.editing .child-field > select,
.child-profile-card.editing .child-field > textarea {
    pointer-events: all;
    cursor: text;
    background: var(--white-color);
    border-color: var(--grey-color-light);
}

.child-profile-card.editing .child-field > input:focus,
.child-profile-card.editing .child-field > select:focus,
.child-profile-card.editing .child-field > textarea:focus {
    border-color: var(--color-footer-top);
    box-shadow: 0 0 0 3px rgba(var(--primary-opacity), 0.12);
}

.child-profile-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 22px;
    border-top: 1px solid var(--grey-color-xlight);
    gap: 10px;
}

.child-edit-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: var(--font-size-sm);
    font-weight: 700;
    padding: 9px 18px;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: var(--transition-all-fast);
    border: none;
}

.child-edit-btn.trigger {
    background: var(--grey-color-xlight);
    color: var(--grey-color-xxdark);
    margin-left: auto;
}

.child-edit-btn.trigger:hover {
    background: var(--grey-color-light);
}

.child-edit-btn.save {
    background: var(--primary-color);
    color: var(--white-color);
    box-shadow: 0 3px 12px var(--primary-shadow);
    display: none;
}

.child-edit-btn.save:hover {
    background: var(--primary-button-hover);
    box-shadow: 0 4px 16px var(--primary-shadow-hover);
}

.child-edit-btn.cancel {
    background: transparent;
    color: var(--grey-color-dark);
    border: 1.5px solid var(--color-border);
    display: none;
}

.child-edit-btn.cancel:hover {
    border-color: var(--grey-color-light);
    color: var(--grey-color-xxdark);
}

.child-profile-card.editing .child-edit-btn.trigger { display: none; }
.child-profile-card.editing .child-edit-btn.save    { display: inline-flex; }
.child-profile-card.editing .child-edit-btn.cancel  { display: inline-flex; }

.children-empty {
    text-align: center;
    padding: 64px 24px;
    color: var(--grey-color);
    font-size: var(--font-size-sm);
}

.children-empty svg {
    display: block;
    margin: 0 auto 14px;
    opacity: var(--opacity-25);
}

/* ── Animasyon ── */
@keyframes childUp {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: translateY(0); }
}

/*---------------------------------------------------
   7.X Support
-----------------------------------------------------*/
.support-panel { var(--primary-font), sans-serif; color: #0d1117;}
.support-hero {
    background: var(--color-footer-top);
    border-radius: 20px;
    padding: 40px 36px;
    margin-bottom: 24px;
    position: relative;
    overflow: hidden;
    animation: supUp .4s ease both;
}
.support-hero::before {
    content: '';
    position: absolute;
    top: -40px; right: -40px;
    width: 180px; height: 180px;
    border-radius: 50%;
    background: rgba(255,255,255,.07);
}
.support-hero::after {
    content: '';
    position: absolute;
    bottom: -60px; right: 120px;
    width: 220px; height: 220px;
    border-radius: 50%;
    background: rgba(255,255,255,.05);
}
.support-hero-inner {
    position: relative; z-index: 1;
    display: flex; align-items: center;
    justify-content: space-between; gap: 24px;
}
.support-hero-inner > div > span {
    color: var(--grey-color);
    background: var(--color-contact-bg);
    font-size: .9rem;
    font-weight: 700;
    border: 1px solid rgba(255,255,255,.15);
    padding: 4px 12px;
    border-radius: 20px;
    margin-bottom: 14px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.support-hero-inner > div > h2 {
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--white-color);
    margin: 0 0 8px;
    line-height: 1.2;
}
.support-hero-inner > div > p {
    color: var(--grey-color);
    font-size: .9rem;
    font-weight: 600;
    margin: 0;
    max-width: 380px;
}
.support-hero-icon {
    width: 72px; height: 72px; border-radius: 18px;
    background: rgba(255,255,255,.12);
    border: 1.5px solid rgba(255,255,255,.2);
    color: var(--white-color);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
@media (max-width: 576px) {
    .support-hero { padding: 28px 22px; }
    .support-hero-icon { display: none; }
    .support-hero-inner > div > h2 { font-size: 1.2rem; }
}

.support-grid {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 20px; align-items: start;
}
@media (max-width: 991px) { .support-grid { grid-template-columns: 1fr; } }

.support-faq-card {
    background: var(--white-color);
    border: 1px solid #eaecf2;
    border-radius: 20px; overflow: hidden;
    animation: supUp .4s .06s ease both;
}
.support-faq-card > header {
    padding: 20px 24px;
    border-bottom: 1px solid #f0f2f7;
    display: flex; align-items: center;
    justify-content: space-between;
}
.support-faq-card > header > p {
    color: var(--color-footer-top);
    font-size: 1.2rem;
    font-weight: 700;
    margin: 0;
}
.support-faq-card > header > span {
    color: #9aa0b4;
    background: #f4f5f9;
    font-size: 1rem;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 20px;
}

.support-faq-item { border-bottom: 1px solid #f0f2f7; }
.support-faq-item:last-child { border-bottom: none; }

.support-faq-trigger {
    width: 100%; background: none; border: none;
    padding: 20px 24px;
    display: grid;
    grid-template-columns: 32px 1fr 28px;
    align-items: center; gap: 14px;
    cursor: pointer; text-align: left;
    transition: background .15s;
}
.support-faq-trigger:hover { background: #fafbff; }

.support-faq-trigger > b {
    color: color-mix(in srgb, var(--color-footer-top) 40%, transparent);
    background: color-mix(in srgb, var(--color-footer-top) 8%, transparent);
    font-size: .9rem;
    font-weight: 700;
    width: 32px;
    height: 32px;
    border-radius: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background .2s, color .2s;
}

.support-faq-trigger > span {
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-footer-top);
    line-height: 1.5;
}

.support-faq-trigger > i {
    width: 28px; height: 28px; border-radius: 8px;
    background: color-mix(in srgb, var(--color-footer-top) 10%, transparent);
    color: var(--color-footer-top);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0; transition: transform .25s, background .2s, color .2s;
    font-style: normal;
}

.support-faq-item.open .support-faq-trigger { background: #fafbff; }
.support-faq-item.open .support-faq-trigger > b {
    background: var(--color-footer-top);
    color: var(--white-color);
}
.support-faq-item.open .support-faq-trigger > i {
    background: var(--color-footer-top);
    color: var(--white-color);
    transform: rotate(45deg);
}

.support-faq-body {
    max-height: 0; overflow: hidden;
    transition: max-height .35s cubic-bezier(.4,0,.2,1);
}
.support-faq-item.open .support-faq-body { max-height: 600px; }

.support-faq-body > div {
    color: var(--color-contact-bg);
    background: color-mix(in srgb, var(--color-footer-top) 5%, transparent);
    font-size: 1rem;
    margin: 0 24px 20px 70px;
    padding: 14px 18px;
    line-height: 1.75;
    border-left: 3px solid var(--color-footer-top);
    border-radius: 0 10px 10px 0;
}

.support-sidebar {
    display: flex; flex-direction: column; gap: 16px;
    position: sticky; top: 24px;
    animation: supUp .4s .12s ease both;
}

.support-side-card {
    background: var(--white-color);
    border: 1px solid #eaecf2;
    border-radius: 16px; overflow: hidden;
}

.support-side-card > header {
    color: var(--color-footer-top);
    font-size: 1.2rem;
    font-weight: 700;
    padding: 16px 20px;
    border-bottom: 1px solid #f0f2f7;
}

.support-side-card > nav { padding: 8px 0; }

.support-side-card > nav > a {
    color: var(--color-contact-bg);
    font-size: .9rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 20px;
    text-decoration: none;
    transition: background .15s, color .15s;
    border-left: 3px solid transparent;
}
.support-side-card > nav > a:hover {
    background: color-mix(in srgb, var(--color-footer-top) 6%, transparent);
    color: var(--color-footer-top);
    border-left-color: var(--color-footer-top);
}
.support-side-card > nav > a > i {
    width: 28px; height: 28px; border-radius: 8px;
    background: #f4f5f9; color: #7a8099;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0; font-style: normal;
    transition: background .15s, color .15s;
}
.support-side-card > nav > a:hover > i {
    background: color-mix(in srgb, var(--color-footer-top) 12%, transparent);
    color: var(--color-footer-top);
}

.support-side-card > nav > a.whatsapp { color: #16a34a; }
.support-side-card > nav > a.whatsapp > i { background: #dcfce7; color: #16a34a; }
.support-side-card > nav > a.whatsapp:hover {
    background: #f0fdf4; border-left-color: #16a34a;
}
.support-side-card > nav > a.whatsapp:hover > i { background: #bbf7d0; }


.support-contact-card {
    background: var(--color-footer-top);
    border: none; border-radius: 16px;
    padding: 22px 20px;
}
.support-contact-card > p {
    color: var(--white-color);
    font-size: .9rem;
    font-weight: 600;
    margin: 0 0 4px;
}
.support-contact-card > small {
    color: rgba(255,255,255,.65);
    font-size: .9rem;
    display: block;
    margin-bottom: 16px;
}
.support-contact-card > a {
    font-size: .9rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 11px;
    border-radius: 10px;
    text-decoration: none; margin-bottom: 8px;
    transition: filter .2s;
}
.support-contact-card > a:last-child { margin-bottom: 0; }
.support-contact-card > a:hover { filter: brightness(1.05); }

.support-contact-card > a.call {
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.25);
    color: var(--white-color);
}
.support-contact-card > a.wa {
    background: #16a34a;
    border: 1px solid #15803d;
    color: var(--white-color);
}

.support-empty {
    text-align: center; padding: 48px 24px;
    color: #b0b6c8; font-size: .82rem;
}
.support-empty svg { display: block; margin: 0 auto 12px; opacity: .35; }

@keyframes supUp {
    from { opacity: 0; transform: translateY(14px); }
    to   { opacity: 1; transform: translateY(0); }
}

/*---------------------------------------------------
   7.AA. Doctor Comments
-----------------------------------------------------*/
.dc-card {
    background: var(--white-color);
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-lg);
    padding: 20px 24px;
    margin-bottom: 12px;
    transition: var(--transition-all-fast);
    box-shadow: 0 15px 40px -12px rgb(217, 220, 232);
}

.dc-card:hover {
    border-color: var(--grey-color);
    box-shadow: 0 4px 20px rgba(var(--black-opacity), 0.06);
}

/* Head */
.dc-head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}

.dc-avatar {
    background: var(--primary-color);
    color: var(--white-color);
    font-size: 1.2rem;
    font-weight: 700;
    width: 40px;
    height: 40px;
    border-radius: var(--radius-circle);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.dc-info { flex: 1; }

.dc-name {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.3;
}

.dc-time {
    font-size: .8rem;
    color: var(--grey-color-dark);
    margin-top: 2px;
}

.dc-votes {
    display: flex;
    gap: 6px;
}

.dc-vote {
    font-size: .8rem;
    font-weight: 500;
    border-radius: var(--radius-md);
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 12px;
    cursor: pointer;
    border: 1px solid;
    transition: var(--transition-all-fast);
    user-select: none;
}

.dc-vote--up {
    background: rgba(var(--black-opacity), 0.02);
    border-color: var(--color-success);
    color: #27ae60;
}

.dc-vote--up:hover {
    background: #27ae60;
    color: var(--white-color);
    border-color: #27ae60;
}

.dc-vote--down {
    background: rgba(var(--black-opacity), 0.02);
    border-color: var(--primary-color-extra-light);
    color: var(--primary-color);
}

.dc-vote--down:hover {
    background: var(--primary-color);
    color: var(--white-color);
    border-color: var(--primary-color);
}

.dc-body { margin-bottom: 14px; }

.dc-text {
    color: var(--grey-color-xxdark);
    background: var(--grey-color-xlight);
    font-size: 1rem;
    border-radius: var(--radius-sm);
    border-left: 3px solid var(--primary-color);
    line-height: 1.7;
    padding: 12px 16px;
    margin: 0;
}

.dc-service { margin-bottom: 14px; }

.dc-service-link {
    background: var(--grey-color-xlight);
    border-radius: var(--radius-sm);
    border: 1px solid transparent;
    gap: 8px;
    padding: 6px 14px;
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    transition: var(--transition-all-fast);
}

.dc-service-link:hover {
    border-color: var(--color-footer-top);
    background: var(--white-color);
}

.dc-service-link img {
    width: 20px;
    height: 20px;
    border-radius: var(--radius-circle);
    object-fit: cover;
}

.dc-service-link span {
    color: var(--color-footer-top);
    font-size: .9rem;
    font-weight: 500
}

/* Replies */
.dc-replies {
    margin-bottom: 14px;
    padding-left: 14px;
    border-left: 2px solid var(--primary-color-extra-light);
}

.dc-reply {
    display: flex;
    gap: 10px;
    padding: 8px 0;
}

.dc-reply-avatar {
    width: 30px;
    height: 30px;
    border-radius: var(--radius-circle);
    background: var(--color-footer-top);
    color: var(--white-color);
    font-size: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.dc-reply-name {
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-footer-top);
    margin-bottom: 3px;
}

.dc-reply-text {
    font-size: .8rem;
    color: var(--grey-color-dark);
    line-height: 1.6;
    margin: 0;
}

/* Footer */
.dc-foot {
    display: flex;
    gap: 8px;
    padding-top: 14px;
    border-top: 1px solid var(--grey-color-light);
}

.dc-action {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 16px;
    border-radius: var(--radius-xs);
    font-size: var(--font-size-xs);
    font-weight: 500;
    text-decoration: none;
    border: 1px solid;
    transition: var(--transition-all-fast);
}

.dc-action--approve {
    background: rgba(163, 228, 215, 0.15);
    color: #27ae60;
    border-color: var(--color-success);
}

.dc-action--approve:hover {
    background: #27ae60;
    color: var(--white-color);
    border-color: #27ae60;
}

.dc-action--trash {
    background: rgba(var(--primary-opacity), 0.05);
    color: var(--primary-color);
    border-color: var(--primary-color-extra-light);
}

.dc-action--trash:hover {
    background: var(--primary-color);
    color: var(--white-color);
    border-color: var(--primary-color);
}

/*---------------------------------------------------
   7.AB. Dashboard Widgets
-----------------------------------------------------*/

/*---------------- Doctor Dashboard Messages ----------------*/
.dbc-wrap {
    background: var(--white-color);
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-lg);
    box-shadow: 0 15px 40px -12px rgba(217,220,232,1);
    overflow: hidden;
}

.dbc-head {
    padding: 16px 20px;
    border-bottom: 1px solid var(--grey-color-light);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.dbc-head-left {
    display: flex;
    align-items: center;
    gap: 12px;
}

.dbc-icon {
    background: var(--primary-color-extra-light);
    font-size: 1.2rem;
    width: 50px;
    height: 50px;
    border-radius: var(--radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
}

.dbc-title {
    color: var(--color-footer-top);
    font-size: 1.2rem;
    font-weight: 700;
}

.dbc-sub {
    color: var(--grey-color-dark);
    font-size: .9rem;
    margin-top: 1px;
}

.dbc-stats {
    display: flex;
    gap: 16px;
}

.dbc-stat {
    text-align: center;
    padding: 6px 14px;
    border-radius: var(--radius-xs);
    background: var(--grey-color-xlight);
}

.dbc-stat--pending {
    background: rgba(var(--primary-opacity), 0.08);
}

.dbc-stat-num {
    color: var(--color-footer-top);
    font-size: 1.2rem;
    font-weight: 700;
    display: block;
    line-height: 1.2;
}

.dbc-stat--pending .dbc-stat-num {
    color: var(--primary-color);
}

.dbc-stat-label {
    color: var(--grey-color-dark);
    font-size: .9rem;
}

.dbc-list {
    padding: 8px 0;
}

.dbc-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px 20px;
    border-bottom: 1px solid #f4f5f9;
    transition: var(--transition-all-fast);
}

.dbc-item:last-child { border-bottom: none; }

.dbc-item:hover { background: #fafafa; }

.dbc-item-avatar {
    background: linear-gradient(135deg, var(--primary-color), #ff7a66);
    color: var(--white-color);
    font-size: 1rem;
    font-weight: 700;
    width: 36px;
    height: 36px;
    border-radius: var(--radius-full);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.dbc-item-body { flex: 1; min-width: 0; }

.dbc-item-name {
    color: var(--color-footer-top);
    font-size: var(--font-size-sm);
    font-weight: 600;
    gap: 8px;
    margin-bottom: 3px;
    display: flex;
    align-items: center;
}

.dbc-item-time {
    color: var(--grey-color);
    font-size: .9rem;
    font-weight: 400;
}

.dbc-item-text {
    color: var(--grey-color-dark);
    font-size: .9rem;
    line-height: 1.5;
    margin-bottom: 4px;
}

.dbc-item-service {
    color: var(--primary-color);
    background: rgba(var(--primary-opacity), 0.08);
    font-size: 10px;
    font-weight: 500;
    display: inline-block;
    padding: 2px 8px;
    border-radius: var(--radius-full);
}

.dbc-item-votes {
    color: var(--grey-color-dark);
    font-size: .8rem;
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex-shrink: 0;
}

.dbc-vote-up { color: #27ae60; }
.dbc-vote-down { color: var(--primary-color); }

.dbc-empty {
    padding: 24px;
    text-align: center;
    font-size: var(--font-size-sm);
    color: var(--grey-color);
}

.dbc-footer {
    color: var(--color-footer-top);
    background: #fafafa;
    font-size: 1rem;
    font-weight: 600;
    padding: 12px;
    border-top: 1px solid var(--grey-color-light);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    text-decoration: none;
    transition: var(--transition-all-fast);
}

.dbc-footer:hover {
    background: rgba(var(--primary-opacity), 0.05);
    color: var(--primary-color);
}
.card-comments .cc-other a i{
    line-height: 1.6;
    vertical-align: middle;
    padding-left: .5rem;
}
.card-comments .cc-other a:hover{color:var(--primary-color);}


.card-header h5{
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--color-footer-top);
    margin-top: 7px;
}
/*---------------- Doctor Dashboard Messages ----------------*/

/*---------------- Patient Dashboard Messages ----------------*/
.pmsg-wrap {
    background: var(--white-color);
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-lg);
    overflow: hidden;
}

.pmsg-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid var(--grey-color-light);
}

.pmsg-head-left {
    display: flex;
    align-items: center;
    gap: 12px;
}

.pmsg-icon {
    background: var(--primary-color-extra-light);
    font-size: 1.4rem;
    width: 50px;
    height: 50px;
    border-radius: var(--radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
}

.pmsg-title {
    color: var(--color-footer-top);
    font-size: 1.2rem;
    font-weight: 700;
}

.pmsg-sub {
    font-size: .9rem;
    color: var(--grey-color-dark);
    margin-top: 1px;
}

/* Liste */
.pmsg-list { padding: 6px 0; }

.pmsg-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px 20px;
    border-bottom: 1px solid #f4f5f9;
    transition: var(--transition-all-fast);
}

.pmsg-item:last-child { border-bottom: none; }
.pmsg-item:hover { background: #fafafa; }

.pmsg-avatar {
    width: 36px;
    height: 36px;
    border-radius: var(--radius-sm);
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.dbg1 {background: #dbf0fd;}
.dbg2 {background: #eadcf9;}
.dbg3 {background: #f9f7d1;}
.dbg4 {background: #f9e7e7;}
.pmsg-body { flex: 1; min-width: 0; }

.pmsg-name {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
}

.pmsg-time {
    font-size: .8rem;
    color: var(--grey-color-dark);
    font-weight: 400;
}

.pmsg-text {
    font-size: .9rem;
    color: var(--grey-color-dark);
    line-height: 1.55;
}

/* Empty */
.pmsg-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 32px 20px;
    color: var(--grey-color);
    font-size: var(--font-size-sm);
}

.pmsg-empty-icon { font-size: 28px; }

/* Footer buton */
.pmsg-footer {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 12px;
    border-top: 1px solid var(--grey-color-light);
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-footer-top);
    text-decoration: none;
    background: #fafafa;
    transition: var(--transition-all-fast);
}

.pmsg-footer:hover {
    background: rgba(var(--primary-opacity), 0.05);
    color: var(--primary-color);
}
/*---------------- Patient Dashboard Messages ----------------*/

/*---------------- Secreter Dashboard ----------------*/
.sd {padding-bottom: 40px;}

.sd-header {
    gap: 12px;
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.sd-header__greet {
    color: var(--color-footer-top);
    font-size: 1.3rem;
    font-weight: 800;
}

.sd-header__sub {
    color: var(--grey-color-dark);
    font-size: 1rem;
    margin-top: 3px;
}

.sd-header__date {
    background: var(--grey-color-xlight);
    color: var(--grey-color-dark);
    font-size: 1rem;
    font-weight: 600;
    padding: 7px 16px;
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    white-space: nowrap;
}

.sd-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 20px;
}

.sd-stat {
    display: block;
    padding: 16px 18px;
    background: var(--white-color);
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-sm);
    text-decoration: none;
    box-shadow: 0 1px 4px rgba(0,0,0,.04);
    transition: var(--transition-all-fast);
}

.sd-stat:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,.08);
    border-color: var(--color-footer-top);
}

.sd-stat__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.sd-stat__icon {
    width: 50px;
    height: 50px;
    border-radius: var(--radius-xs);
    display: flex;
    align-items: center;
    justify-content: center;
}

.sd-stat__icon--blue   { background: #E6F1FB; color: #185FA5; }
.sd-stat__icon--amber  { background: #FAEEDA; color: #BA7517; }
.sd-stat__icon--green  { background: #EAF3DE; color: var(--primary-color); }
.sd-stat__icon--purple { background: #EEEDFE; color: #534AB7; }

.sd-stat__badge {
    font-size: .9rem;
    font-weight: 700;
    padding: 5px 10px;
    border-radius: 8px;
}

.sd-stat__badge--blue   { background: #E6F1FB; color: #042C53; }
.sd-stat__badge--amber  { background: #FAEEDA; color: #412402; }
.sd-stat__badge--green  { background: #EAF3DE; color: #085041; }
.sd-stat__badge--purple { background: #EEEDFE; color: #26215C; }
.sd-stat__badge--red    { background: #FCEBEB; color: #501313; }

.sd-stat__num {
    color: var(--color-footer-top);
    font-size: 2rem;
    font-weight: 800;
    line-height: 1;
}

.sd-stat__lbl {
    color: var(--grey-color-dark);
    font-size: .9rem;
    font-weight: 500;
    margin-top: 4px;
}

.sd-today {
    background: var(--white-color);
    padding: 16px 20px;
    margin-bottom: 20px;
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-sm);
    box-shadow: 0 1px 4px rgba(0,0,0,.04);
}

.sd-today__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}

.sd-today__title {
    color: var(--color-footer-top);
    font-size: 1.2rem;
    font-weight: 700;
}

.sd-today__count {
    color: var(--grey-color-dark);
    font-size: 1rem;
}

.sd-today__slots {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding-bottom: 6px;

    /* Özelleştirilmiş ince scrollbar */
    scrollbar-width: thin;
    scrollbar-color: var(--grey-color-light) transparent;
}

.sd-today__slots::-webkit-scrollbar {height: 4px;}
.sd-today__slots::-webkit-scrollbar-track {background: transparent;}
.sd-today__slots::-webkit-scrollbar-thumb {
    background: var(--grey-color-light);
    border-radius: 4px;
}

.sd-today__slots::-webkit-scrollbar-thumb:hover {background: var(--grey-color);}

.sd-slot {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 76px;
    padding: 10px 8px;
    background: var(--grey-color-xlight);
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    text-decoration: none;
    cursor: pointer;
    transition: var(--transition-all-fast);
    flex-shrink: 0;
}

.sd-slot:hover {
    background: var(--white-color);
    border-color: var(--color-footer-top);
}

.sd-slot--empty {
    opacity: 0.4;
}

.sd-slot--empty:hover {
    opacity: 0.7;
    border-color: var(--grey-color);
}

.sd-slot__time {
    font-size: .82rem;
    font-weight: 700;
    color: var(--color-footer-top);
}

.sd-slot__name {
    color: var(--grey-color-dark);
    font-size: .9rem;
    margin-top: 3px;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 68px;
}

.sd-slot__dot {
    width: 6px;
    height: 6px;
    margin-top: 6px;
    border-radius: 50%;
}

.sd-slot--online   .sd-slot__dot { background: #185FA5; }
.sd-slot--yuzyuze  .sd-slot__dot { background: var(--primary-color); }
.sd-slot--bk       .sd-slot__dot { background: #BA7517; }
.sd-slot__dot--empty { background: var(--grey-color-light); }

.sd-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 280px;
    gap: 16px;
    align-items: start;
}

.sd-card {
    background: var(--white-color);
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-sm);
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(0,0,0,.04);
}

.sd-card__head {
    background: var(--grey-color-xlight);
    padding: 13px 18px;
    border-bottom: 1px solid var(--grey-color-light);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.sd-card__title {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 700;
}

.sd-card__link {
    color: var(--primary-color);
    font-size: .9rem;
    font-weight: 600;
    text-decoration: none;
    transition: var(--transition-all-fast);
}

.sd-card__link:hover { color: var(--color-footer-top); }

.sd-appt {
    gap: 12px;
    padding: 11px 18px;
    border-bottom: 1px solid var(--grey-color-light);
    display: flex;
    align-items: center;
    transition: var(--transition-all-fast);
}

.sd-appt:last-child { border-bottom: none; }

.sd-appt:hover { background: var(--grey-color-xlight); }

.sd-appt__time {
    color: var(--color-footer-top);
    font-size: .9rem;
    font-weight: 700;
    min-width: 40px;
}

.sd-appt__avatar {
    font-size: .9rem;
    font-weight: 700;
    width: 35px;
    height: 35px;
    border-radius: var(--radius-xs);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.sd-appt__info { flex: 1; min-width: 0; }

.sd-appt__name {
    color: var(--color-footer-top);
    font-size: .9rem;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sd-appt__meta {
    color: var(--grey-color-dark);
    font-size: .9rem;
    margin-top: 2px;
}

.sd-appt__badge {
    font-size: .8rem;
    font-weight: 600;
    padding: 5px 10px;
    border-radius: 8px;
    white-space: nowrap;
    flex-shrink: 0;
}

.sd-appt__badge--ok   { background: #EAF3DE; color: #27500A; }
.sd-appt__badge--bk   { background: #FAEEDA; color: #412402; }
.sd-appt__badge--done { background: #E6F1FB; color: #042C53; }
.sd-appt__badge--ip   { background: #FCEBEB; color: #501313; }


/* ── DOKTOR SATIRI ──────────────────────────────────────────── */
.sd-doc {
    gap: 12px;
    padding: 12px 18px;
    border-bottom: 1px solid var(--grey-color-light);
    display: flex;
    align-items: center;
}

.sd-doc:last-of-type { border-bottom: none; }

.sd-doc__avatar {
    background: var(--color-footer-top);
    color: var(--white-color);
    font-size: .9rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: var(--radius-xs);
    flex-shrink: 0;
}

.sd-doc__name {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 600;
}

.sd-doc__perms {
    display: flex;
    gap: 4px;
    margin-top: 4px;
    flex-wrap: wrap;
}

.sd-doc__perm {
    padding: 2px 6px;
    border-radius: 3px;
    font-size: .8rem;
    font-weight: 600;
}

.sd-doc__perm--appt    { background: #E6F1FB; color: #042C53; }
.sd-doc__perm--patient { background: #EAF3DE; color: #085041; }
.sd-doc__perm--pay     { background: #FAEEDA; color: #412402; }

.sd-week { padding: 4px 0; }

.sd-week__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 9px 18px;
    border-bottom: 1px solid var(--grey-color-light);
}

.sd-week__lbl {
    color: var(--grey-color-dark);
    font-size: 1rem;
}

.sd-week__val {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 700;
}

.sd-week__val--green { color: var(--primary-color); }
.sd-week__val--amber { color: #BA7517; }
.sd-week__val--red   { color: #A32D2D; }

.sd-task {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 18px;
    border-bottom: 1px solid var(--grey-color-light);
    transition: var(--transition-all-fast);
}

.sd-task:last-child { border-bottom: none; }
.sd-task:hover { background: var(--grey-color-xlight); }

.sd-task__pri {
    width: 3px;
    min-height: 36px;
    border-radius: 2px;
    flex-shrink: 0;
}

.sd-task__pri--high   { background: #A32D2D; }
.sd-task__pri--medium { background: #BA7517; }
.sd-task__pri--low    { background: #185FA5; }

.sd-task__body { flex: 1; min-width: 0; }

.sd-task__title {
    color: var(--color-footer-top);
    font-size: .9rem;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sd-task__meta {
    color: var(--grey-color-dark);
    font-size: .9rem;
    margin-top: 2px;
}

.sd-task__check {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    background: var(--white-color);
    border: 1px solid var(--grey-color-light);
    border-radius: 5px;
    color: var(--grey-color);
    cursor: pointer;
    flex-shrink: 0;
    transition: var(--transition-all-fast);
}

.sd-task__check:hover {
    background: #EAF3DE;
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.sd-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 32px 20px;
    color: var(--grey-color);
    text-align: center;
}

.sd-empty p {
    color: var(--grey-color-dark);
    font-size: 1rem;
}

.sd-empty__link {
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-footer-top);
    text-decoration: none;
}

.sd-empty__link:hover { color: var(--color-footer-top); }

/* ── RESPONSİVE ─────────────────────────────────────────────── */
@media (max-width: 1024px) {
    .sd-grid { grid-template-columns: 1fr 1fr; }
    .sd-stats { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
    .sd-grid { grid-template-columns: 1fr; }
    .sd-stats { grid-template-columns: repeat(2, 1fr); }
}

.dw-today {
    padding: 18px 20px;
    background: var(--white-color);
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-sm);
    margin-bottom: 16px;
    box-shadow: 0 15px 40px -12px rgba(217,220,232,1);
}

.dw-today__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}

.dw-today__title {
    font-size: .95rem;
    font-weight: 700;
    color: var(--color-footer-top);
}

.dw-today__sub {
    color: var(--grey-color-dark);
    font-size: 1rem;
    margin-top: 2px;
}

.dw-link {
    color:var(--primary-color);
    font-size: .9rem;
    font-weight: 600;
    text-decoration: none;
}

.dw-link:hover { color: var(--color-footer-top); }

.dw-slots {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding-bottom: 6px;
    scrollbar-width: thin;
    scrollbar-color: var(--grey-color-light) transparent;
}

.dw-slots::-webkit-scrollbar { height: 4px; }
.dw-slots::-webkit-scrollbar-track { background: transparent; }
.dw-slots::-webkit-scrollbar-thumb { background: var(--grey-color-light); border-radius: 4px; }

.dw-slot {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 80px;
    padding: 10px 8px;
    background: var(--grey-color-xlight);
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    text-decoration: none;
    cursor: pointer;
    flex-shrink: 0;
    position: relative;
    transition: var(--transition-all-fast);
}

.dw-slot:hover { background: var(--white-color); border-color: var(--color-footer-top); }

.dw-slot__time {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 700;
}

.dw-slot__name {
    color: var(--grey-color-dark);
    font-size: .8rem;
    margin-top: 3px;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 72px;
}

.dw-slot__type {
    font-size: .8rem;
    color: var(--grey-color);
    margin-top: 2px;
}

.dw-slot--now {
    background: var(--color-footer-top);
    border-color: var(--color-footer-top);
}

.dw-slot--now .dw-slot__time,
.dw-slot--now .dw-slot__name,
.dw-slot--now .dw-slot__type { color: white; }

.dw-slot__now-dot {
    position: absolute;
    top: 5px;
    right: 5px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--primary-color);
    animation: dwPulse 1.5s infinite;
}

@keyframes dwPulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.5; transform: scale(1.3); }
}

.dw-slot--online .dw-slot__type { color: #185FA5; }
.dw-slot--yuzyuze .dw-slot__type { color: var(--primary-color); }
.dw-slot--past { opacity: 0.4; }
.dw-slot--empty { opacity: 0.3; pointer-events: none; }

.dw-empty-slots {
    color: var(--grey-color-dark);
    font-size: 1rem;
    gap: 10px;
    padding: 16px 0;
    display: flex;
    align-items: center;
}


/* ── 3 WIDGET GRID ──────────────────────────────────────────── */

.dw-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 240px;
    gap: 16px;
    margin-bottom: 24px;
}

.dw-card {
    background: var(--white-color);
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-sm);
    overflow: hidden;
    box-shadow: 0 15px 40px -12px rgba(217,220,232,1);
}

.dw-card__head {
    background: var(--grey-color-xlight);
    border-bottom: 1px solid var(--grey-color-light);
    padding: 12px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.dw-card__title {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 700;
}


/* ── RANDEVU SATIRI ─────────────────────────────────────────── */

.dw-appt {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    border-bottom: 1px solid var(--grey-color-light);
    transition: var(--transition-all-fast);
}

.dw-appt:last-child { border-bottom: none; }
.dw-appt:hover { background: var(--grey-color-xlight); }

.dw-appt__time {
    color: var(--color-footer-top);
    font-size: .9rem;
    font-weight: 700;
    min-width: 36px;
}

.dw-appt__av {
    font-size: .9rem;
    font-weight: 700;
    width: 30px;
    height: 30px;
    border-radius: var(--radius-xs);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.dw-appt__info { flex: 1; min-width: 0; }

.dw-appt__name {
    color: var(--color-footer-top);
    font-size: .9rem;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dw-appt__meta {
    font-size: .8rem;
    color: var(--grey-color-dark);
    margin-top: 1px;
}

.dw-badge {
    font-size: .8rem;
    font-weight: 600;
    padding: 2px 7px;
    border-radius: 4px;
    white-space: nowrap;
    flex-shrink: 0;
}

.dw-badge--ok { background: #EAF3DE; color: #27500A; }
.dw-badge--bk { background: #FAEEDA; color: #412402; }
.dw-badge--ip { background: #FCEBEB; color: #501313; }


/* ── SEANS SATIRI ───────────────────────────────────────────── */

.dw-session {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    border-bottom: 1px solid var(--grey-color-light);
    transition: var(--transition-all-fast);
}

.dw-session:last-child { border-bottom: none; }
.dw-session:hover { background: var(--grey-color-xlight); }

.dw-session__av {
    background: var(--color-footer-top);
    color: var(--white-color);
    font-size: 1rem;
    font-weight: 700;
    width: 30px;
    height: 30px;
    border-radius: var(--radius-xs);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.dw-session__info { flex: 1; min-width: 0; }

.dw-session__name {
    color: var(--color-footer-top);
    font-size: .9rem;
    font-weight: 600;
}

.dw-session__date {
    color: var(--grey-color-dark);
    font-size: .9rem;
    margin-top: 1px;
}

.dw-session__diag {
    padding: 2px 7px;
    border-radius: 4px;
    font-size: .68rem;
    font-weight: 700;
    background: #EEEDFE;
    color: #26215C;
    white-space: nowrap;
    flex-shrink: 0;
}


/* ── YENİ DANIŞAN NOTU ──────────────────────────────────────── */

.dw-note {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 16px;
    border-bottom: 1px solid var(--grey-color-light);
}

.dw-note:last-child { border-bottom: none; }

.dw-note__av {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: var(--radius-xs);
    background: #E6F1FB;
    color: #042C53;
    font-size: .68rem;
    font-weight: 700;
    flex-shrink: 0;
    margin-top: 2px;
}

.dw-note__name {
    font-size: .82rem;
    font-weight: 600;
    color: var(--black-base);
}

.dw-note__text {
    font-size: .75rem;
    color: var(--grey-color-dark);
    margin-top: 3px;
    line-height: 1.4;
}

.dw-note__badge {
    display: inline-block;
    padding: 2px 7px;
    border-radius: 4px;
    font-size: .65rem;
    font-weight: 700;
    margin-top: 4px;
}

.dw-note__badge--reason { background: #E6F1FB; color: #042C53; }
.dw-note__badge--note   { background: #FAEEDA; color: #412402; }


/* ── GÖREV SATIRI ───────────────────────────────────────────── */

.dw-task {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    border-bottom: 1px solid var(--grey-color-light);
    transition: var(--transition-all-fast);
}

.dw-task:last-child { border-bottom: none; }
.dw-task:hover { background: var(--grey-color-xlight); }

.dw-task__pri {
    width: 3px;
    min-height: 32px;
    border-radius: 2px;
    flex-shrink: 0;
}

.dw-task__pri--high   { background: #A32D2D; }
.dw-task__pri--medium { background: #BA7517; }
.dw-task__pri--low    { background: #185FA5; }

.dw-task__body { flex: 1; min-width: 0; }

.dw-task__title {
    color: var(--color-footer-top);
    font-size: .9rem;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dw-task__meta {
    color: var(--grey-color-dark);
    font-size: .9rem;
    margin-top: 2px;
}

.dw-task__check {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    background: var(--white-color);
    border: 1px solid var(--grey-color-light);
    border-radius: 5px;
    color: var(--grey-color);
    cursor: pointer;
    flex-shrink: 0;
    transition: var(--transition-all-fast);
}

.dw-task__check:hover {
    background: #EAF3DE;
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.dw-empty {
    color: var(--grey-color-dark);
    font-size: 1rem;
    gap: 8px;
    padding: 20px 16px;
    display: flex;
    align-items: center;
}

/* ── RESPONSİVE ─────────────────────────────────────────────── */

@media (max-width: 1024px) {
    .dw-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 640px) {
    .dw-grid { grid-template-columns: 1fr; }
}

/*---------------- Secreter Dashboard ----------------*/

/*---------------------------------------------------
   7.AC. Doctor Appointments
-----------------------------------------------------*/
.appt-toolbar {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.appt-search-row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.appt-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.appt-search-wrap {
    flex: 1;
    min-width: 200px;
    position: relative;
}
.appt-search-wrap svg {
    position: absolute;
    left: 15px; top: 50%;
    transform: translateY(-50%);
    color: #c0c8d8;
    pointer-events: none;
    transition: color .2s;
}
.appt-search-wrap:focus-within svg { color: var(--color-footer-top); }

.appt-search-input {
    color: var(--color-footer-top);
    background: #f5f6fa;
    border: 1.5px solid #eceef6;
    font-size: 1rem;
    width: 100%;
    border-radius: 14px;
    padding: 12px 16px 12px 42px;
    outline: none;
    transition: all .2s;
    box-sizing: border-box;
}
.appt-search-input::placeholder { color: #c0c8d8; }
.appt-search-input:focus {
    background: var(--white-color);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--color-footer-top) 10%, transparent);
}
.appt-search-row {
    display: flex;
    align-items: center;
    gap: 10px; flex: 1;
    flex-wrap: wrap;
}
.appt-search-submit {
    background: var(--color-footer-top);
    color: var(--white-color);
    font-size: .8rem;
    font-weight: 700;
    padding: 12px 22px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center; gap: 8px;
    border: none;
    cursor: pointer;
    box-shadow: 0 4px 14px color-mix(in srgb, var(--color-footer-top) 28%, transparent);
    transition: filter .18s, transform .18s;
    white-space: nowrap;
}
.appt-search-submit:hover { filter: brightness(1.08); transform: translateY(-1px); }

.appt-search-clear {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: .8rem;
    font-weight: 600;
    padding: 12px 18px;
    border-radius: 14px;
    background: #f4f6fb;
    color: #8892a4;
    border: 1.5px solid #e8eaf2;
    text-decoration: none;
    transition: all .18s;
    white-space: nowrap;
}
.appt-search-clear:hover { background: #fee2e2; color: #dc2626; border-color: #fecaca; }

.appt-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.appt-filter {
    background: var(--white-color);
    color: #a8b0c8;
    font-size: .8rem;
    font-weight: 700;
    padding: 9px 18px; border-radius: 99px;
    border: 1.5px solid #e8eaf4;
    text-decoration: none;
    transition: all .18s; white-space: nowrap;
}
.appt-filter:hover {
    border-color: var(--color-footer-top);
    color: var(--color-footer-top);
    background: color-mix(in srgb, var(--color-footer-top) 5%, var(--white-color));
}
.appt-filter.active {
    background: var(--color-footer-top);
    color: var(--white-color);
    border-color: var(--color-footer-top);
    box-shadow: 0 4px 14px color-mix(in srgb, var(--color-footer-top) 30%, transparent);
}

.appt-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 28px;
}
.appt-filter {
    background: var(--white-color);
    color: #9aa0b4;
    font-size: .9rem;
    font-weight: 700;
    padding: 8px 18px;
    border-radius: 10px;
    border: 1.5px solid #eaecf2;
    text-decoration: none;
    transition: all .18s;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.appt-filter:hover {
    border-color: var(--color-footer-top);
    color: var(--color-footer-top);
    background: color-mix(in srgb, var(--color-footer-top) 5%, var(--white-color));
}
/*.appt-filter.is-active {
    background: var(--color-footer-top);
    border-color: var(--color-footer-top);
    color: var(--white-color);
    box-shadow: 0 4px 14px color-mix(in srgb, var(--color-footer-top) 35%, transparent);
}


.appt-filter.is-active::before {
    content: '';
    width: 6px; height: 6px; border-radius: 50%;
    background: rgba(255,255,255,.7);
    display: inline-block;
}
.appt-status.beklemede  { background: rgba(245,158,11,.2);  color: #fbbf24; border: 1px solid rgba(245,158,11,.3); }
.appt-status.onaylandi  { background: rgba(16,185,129,.2);  color: #34d399; border: 1px solid rgba(16,185,129,.3); }
.appt-status.tamamlandi { background: rgba(139,92,246,.2);  color: #a78bfa; border: 1px solid rgba(139,92,246,.3); }
.appt-status.iptal      { background: rgba(239,68,68,.2);   color: #f87171; border: 1px solid rgba(239,68,68,.3); }*/


.appt-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.appt-card {
    background: var(--white-color);
    border-radius: 18px;
    border: 1.5px solid #eef0f8;
    display: grid;
    grid-template-columns: 80px 110px 1fr 160px 150px 140px;
    align-items: center;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0,0,0,.045);
    transition: box-shadow .22s, transform .22s, border-color .22s;
    animation: apptIn .4s cubic-bezier(.4,0,.2,1) both;
    position: relative;
}
.appt-card:hover {
    box-shadow: 0 10px 36px rgba(0,0,0,.1);
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--color-footer-top) 28%, #eef0f8);
}

.appt-card::before {
    content: '';
    position: absolute;
    left: 0; top: 12%; bottom: 12%;
    width: 3.5px;
    border-radius: 0 4px 4px 0;
    background: var(--color-footer-top);
    opacity: 0;
    transition: opacity .22s;
}
.appt-card:hover::before { opacity: 1; }

.appt-date-col {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 22px 10px;
    background: color-mix(in srgb, var(--color-footer-top) 5%, #f8f9fc);
    border-right: 1.5px solid #eef0f8;
    height: 100%;
    gap: 1px;
}
.appt-day-num {
    color: var(--color-footer-top);
    font-size: 2rem;
    font-weight: 900;
    line-height: 1;
}
.appt-month-txt {
    color: color-mix(in srgb, var(--color-footer-top) 60%, #9aa0b4);
    font-size: .8rem;
    font-weight: 700;
}
.appt-weekday-txt {
    color: #c0c8d8;
    font-size: .9rem;
    font-weight: 700;
    margin-top: 2px;
}

/* ── Saat ── */
.appt-time-col {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 22px 14px;
    border-right: 1.5px solid #eef0f8;
    gap: 4px;
    height: 100%;
}
.appt-time-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: #f5f6fa;
    border: 1.5px solid #eceef6;
    border-radius: 10px;
    padding: 7px 12px;
}
.appt-time-badge-dot {
    width: 7px; height: 7px; border-radius: 50%;
    background: var(--color-footer-top);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-footer-top) 20%, transparent);
    flex-shrink: 0;
}
.appt-time-val {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 800;
}
.appt-time-lbl {
    color: #c0c8d8;
    font-size: .8rem;
    font-weight: 700;
}

.appt-patient-col {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 22px 20px;
    overflow: hidden;
    border-right: 1.5px solid #eef0f8;
}
.appt-av {
    background: color-mix(in srgb, var(--color-footer-top) 10%, #f0f4ff);
    color: var(--color-footer-top);
    border: 1.5px solid color-mix(in srgb, var(--color-footer-top) 18%, #e8ecff);
    width: 40px;
    height: 40px;
    border-radius: 12px;
    flex-shrink: 0;
    font-size: 1.2rem;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
}
.appt-patient-info { overflow: hidden; min-width: 0; }
.appt-patient-name {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 700;
    margin: 0 0 3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.appt-patient-lbl {
    color: #c0c8d8;
    font-size: .9rem;
    font-weight: 700;
}

.appt-badge-col {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 22px 14px;
    border-right: 1.5px solid #eef0f8;
}

.appt-badge {
    font-size: .8rem;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 9px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}
.appt-badge-dot {
    width: 5px; height: 5px; border-radius: 50%;
    background: currentColor; flex-shrink: 0;
}
.appt-badge.beklemede   { background: var(--white-color)beb; color: #d97706; border: 1px solid #fde68a; }
.appt-badge.onaylandi   { background: #f0fdf4; color: #16a34a; border: 1px solid #bbf7d0; }
.appt-badge.tamamlandi  { background: #f5f3ff; color: #7c3aed; border: 1px solid #ddd6fe; }
.appt-badge.iptal       { background: #fef2f2; color: #dc2626; border: 1px solid #fecaca; }
.appt-badge.seans-yok   { background: #f0fdf4; color: #16a34a; border: 1px solid #bbf7d0; }
.appt-badge.seans-var   { background: #eff6ff; color: #3b82f6; border: 1px solid #bfdbfe; }


.appt-action-col {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 22px 16px;
}
.appt-btn {
    font-size: .8rem;
    font-weight: 700;
    padding: 5px 12px;
    border: 1.5px solid;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border-radius: var(--radius-xs);
    cursor: pointer;
    transition: all .2s;
    white-space: nowrap;
    text-decoration: none;
}
.appt-btn.start {
    color: var(--color-footer-top);
    background: color-mix(in srgb, var(--color-footer-top) 8%, var(--white-color));
    border-color: color-mix(in srgb, var(--color-footer-top) 22%, var(--white-color));
}
.appt-btn.start:hover {
    color: var(--white-color);
    background: var(--color-footer-top);
    border-color: var(--color-footer-top);
    box-shadow: 0 4px 16px color-mix(in srgb, var(--color-footer-top) 35%, transparent);
    transform: translateY(-1px);
}
.appt-btn.view {
    color: #7c3aed;
    background: #f5f3ff;
    border-color: #ddd6fe;
}
.appt-btn.view:hover {
    background: #7c3aed; color: var(--white-color); border-color: #7c3aed;
    box-shadow: 0 4px 16px rgba(124,58,237,.28);
    transform: translateY(-1px);
}

.appt-empty {
    padding: 72px 24px; text-align: center;
    background: var(--white-color);
    border: 1.5px dashed #e8eaf4; border-radius: 18px;
}
.appt-empty svg { display: block; margin: 0 auto 18px; color: #d8dce8; }
.appt-empty > p {
    font-family: 'Syne', sans-serif; font-size: .95rem; font-weight: 700;
    color: #b0b8cc; margin: 0 0 6px;
}
.appt-empty > span { font-size: .78rem; color: #c8ccd8; }

.appt-loader {
    display: flex; align-items: center; justify-content: center;
    gap: 8px; padding: 24px; opacity: 0; transition: opacity .25s;
    color: #b8bece; font-family: 'DM Sans', sans-serif; font-size: .8rem;
}
.appt-end {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 600;
    text-align: center;
    padding: 16px;
    opacity: 0;
    transition: opacity .3s;
}

@keyframes apptIn {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
}


@media (max-width: 900px) {
    .appt-card {
        grid-template-columns: 70px 100px 1fr;
        grid-template-rows: auto auto auto;
    }
    .appt-badge-col, .appt-action-col {
        grid-column: 3;
        justify-content: flex-start;
        padding: 8px 20px;
        border-right: none;
        border-top: 1.5px solid #eef0f8;
    }
    .appt-patient-col { border-right: none; }
    .appt-date-col { grid-row: 1 / 4; }
    .appt-time-col { grid-column: 2; border-right: none; padding: 12px 14px; }
}
@media (max-width: 640px) {
    .appt-toolbar { flex-direction: column; align-items: stretch; }
    .appt-filters { justify-content: flex-start; }
}

/*---------------------------------------------------
   7.AC. Expert Detail Hero
-----------------------------------------------------*/
/*.hero {
    background: var(--color-footer);
    position: relative;
    overflow: hidden;
}

.hero::before {
    content: '';
    position: absolute;
    top: -120px; right: -120px;
    width: 480px; height: 480px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(244,76,59,0.18) 0%, transparent 70%);
    pointer-events: none;
}

.hero::after {
    content: '';
    position: absolute;
    bottom: -80px; left: 10%;
    width: 320px; height: 320px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(49,197,244,0.12) 0%, transparent 70%);
    pointer-events: none;
}

.hero-inner {
    max-width: 1260px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 400px;
    min-height: 520px;
    position: relative;
    z-index: 2;
    padding: 0 40px;
}

.hero-content {
    padding: 60px 52px 60px 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.hero-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 36px;
}

.hero-breadcrumb a {
    font-size: 11px;
    color: rgba(255,255,255,0.4);
    text-decoration: none;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    transition: color var(--transition-fast);
}

.hero-breadcrumb a:hover { color: var(--primary-color-light); }

.hero-breadcrumb span {
    font-size: 11px;
    color: rgba(255,255,255,0.2);
}

.hero-role {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 1rem;
    font-weight: 600;
    color: var(--secondary-color);
    margin-bottom: 16px;
}

.hero-role::before {
    content: '';
    width: 24px; height: 2px;
    background: var(--secondary-color);
    border-radius: 2px;
}

.hero-name {
    color: var(--white-color);
    font-family: 'Playfair Display', serif;
    font-size: clamp(2.4rem, 4vw, 3.6rem);
    font-weight: 700;
    line-height: 1.08;
    margin-bottom: 12px;
}

.hero-name em {
    font-style: italic;
    color: var(--primary-color-light);
}

.hero-edu {
    font-size: 1.2rem;
    color: rgba(255,255,255,0.45);
    margin-bottom: 32px;
    font-weight: 400;
    line-height: 1.7;
}

.hero-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 44px;
}

.hero-tag {
    background: rgba(255,255,255,0.07);
    border: 1px solid rgba(255,255,255,0.14);
    border-radius: 100px;
    padding: 6px 16px;
    font-size: .9rem;
    color: rgba(255,255,255,0.7);
    font-weight: 400;
    transition: all var(--transition-fast);
}

.hero-tag:hover {
    background: rgba(244,76,59,0.2);
    border-color: rgba(244,76,59,0.4);
    color: var(--primary-color-light);
}

.hero-stats {
    display: flex;
    gap: 0;
    border-top: 1px solid rgba(255,255,255,0.1);
    padding-top: 32px;
}

.hero-stat {
    padding-right: 36px;
    margin-right: 36px;
    border-right: 1px solid rgba(255,255,255,0.1);
}

.hero-stat:last-child {
    border-right: none;
    margin-right: 0;
    padding-right: 0;
}

.hero-stat-num {
    color: var(--white-color);
    font-size: 3rem;
    font-weight: 800;
    line-height: 1;
}

.hero-stat-num span { color: var(--primary-color); margin-left: 5px; }

.hero-stat-label {
    font-size: 1rem;
    color: rgba(255,255,255,0.35);
    margin-top: 5px;
}

.hero-photo {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding: 0 0 0 16px;
}

.hero-photo::before {
    content: '';
    position: absolute;
    bottom: 0; left: 50%;
    transform: translateX(-50%);
    width: 340px; height: 340px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(244,76,59,0.12) 0%, transparent 65%);
    pointer-events: none;
}

.hero-photo-frame {
    position: relative;
    width: 320px;
    z-index: 2;
}

.hero-photo-frame img,
.hero-photo-frame .photo-placeholder {
    width: 100%;
    height: 480px;
    object-fit: cover;
    object-position: top center;
    display: block;
    border-radius: 24px 24px 0 0;
}

.photo-placeholder {
    background: linear-gradient(160deg, #1e3558 0%, #2a4a70 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 100px;
}

.hero-photo-frame::before {
    content: '';
    position: absolute;
    left: -12px; bottom: 60px;
    width: 4px; height: 120px;
    border-radius: 4px;
    background: linear-gradient(to bottom, var(--primary-color), var(--secondary-color));
}

.hero-photo-badge {
    position: absolute;
    top: 24px; right: -16px;
    background: var(--primary-color);
    color: var(--white-color);
    width: 52px; height: 52px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    font-weight: 700;
    box-shadow: 0 8px 24px rgba(244,76,59,0.4);
}

.hero-bridge {
    background: linear-gradient(to bottom, var(--color-footer) 0%, var(--cream) 100%);
    height: 60px;
}*/


.hero {
    background: var(--white-color);
    position: relative;
    overflow: hidden;
}

.hero::before { content: none; }
.hero::after  { content: none; }

.hero-inner {
    max-width: 1260px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 360px;
    min-height: 460px;
    position: relative;
    z-index: 2;
    padding: 0 40px;
    align-items: center;
    gap: 48px;
}

.hero-content {
    padding: 56px 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.hero-role {
    color: var(--primary-color-dark);
    font-size: 1.5rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
}

.hero-role::before {
    background: var(--primary-color);
    content: '';
    width: 20px;
    height: 2px;
    border-radius: 2px;
    flex-shrink: 0;
}

.hero-name {
    color: var(--black-color);
    font-size: 2rem;
    font-weight: 900;
    line-height: 1.05;
    margin-bottom: 10px;
}


.hero-edu {
    color: var(--color-text);
    font-size: 1rem;
    margin-bottom: 0;
    font-weight: 400;
    line-height: 1.7;
}

.hero-divider {
    background: var(--primary-color);
    width: 40px;
    height: 3px;
    border-radius: 2px;
    margin: 18px 0;
}

.hero-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 28px;
}

.hero-tag {
    color: var(--primary-color-dark);
    background: var(--primary-color-extra-light);
    font-size: 1rem;
    font-weight: 500;
    border: none;
    border-radius: 100px;
    padding: 6px 16px;
    transition: background .2s, color .2s;
}

.hero-tag:hover {
    color: var(--white-color);
    background: var(--primary-color);
}

.hero-stats {
    background: linear-gradient(160deg, #071410 0%, #24593e 60%, #0d2218 100%) !important;
    display: flex;
    gap: 0;
    border-radius: var(--radius-md);
    padding: 16px 24px;
    width: fit-content;
}

.hero-stat {
    padding: 0 24px;
    border-right: 1px solid var(--primary-shadow-hover);
    text-align: center;
}

.hero-stat:first-child { padding-left: 0; }
.hero-stat:last-child  { border-right: none; padding-right: 0; }

.hero-stat-num {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 900;
    line-height: 1;
}

.hero-stat-num span { color: var(--primary-color); }

.hero-stat-label {
    color: var(--grey-color);
    font-size: 1rem;
    margin-top: 4px;
}

.hero-photo {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 32px 0;
}

.hero-photo::before { content: none; }

.hero-photo-frame {
    position: relative;
    width: 100%;
}

.hero-photo-frame img {
    width: 100%;
    height: 420px;
    object-fit: cover;
    object-position: top center;
    display: block;
    border-radius: 20px;
    box-shadow: 0 8px 40px rgba(17,34,53,.12);
}

.hero-photo-frame::before { content: none; }

.hero-photo-badge {
    position: absolute;
    top: 16px;
    right: 16px;
    background: var(--primary-color);
    color: var(--white-color);
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 800;
    box-shadow: 0 4px 16px rgba(86,190,146,.4);
}

.hero-bridge {
    background: var(--white-color);
    height: 0;
}

/* Responsive */
@media (max-width: 1024px) {  .hero-inner {grid-template-columns: 1fr 280px;}
}

@media (max-width: 768px) {
    .hero-inner {
        grid-template-columns: 1fr;
        padding: 0 20px;
        min-height: auto;
    }
    .hero-content { padding: 36px 0 24px; }
    .hero-photo { padding: 0 0 32px; }
    .hero-photo-frame img { height: 300px; }
}


.main {
    max-width: 1260px;
    margin: 0 auto;
    padding: 56px 40px 100px;
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 52px;
    align-items: start;
}

.section-block {
    margin-bottom: 52px;
    opacity: 0;
    transform: translateY(24px);
    animation: fadeUp 0.55s forwards;
}

.section-block:nth-child(1) { animation-delay: 0.08s; }
.section-block:nth-child(2) { animation-delay: 0.16s; }
.section-block:nth-child(3) { animation-delay: 0.24s; }
.section-block:nth-child(4) { animation-delay: 0.32s; }
.section-block:nth-child(5) { animation-delay: 0.40s; }
.section-block:nth-child(6) { animation-delay: 0.48s; }

@keyframes fadeUp { to { opacity: 1; transform: translateY(0); }}

.block-label {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 18px;
}

.block-label-dot {
    background: var(--primary-color);
    width: 8px;
    height: 8px;
    border-radius: 50%;
    box-shadow: 0 0 0 3px var(--primary-shadow-hover);
    flex-shrink: 0;
}

.block-label-text {
    color: var(--primary-color);
    font-size: 1rem;
    font-weight: 700;
}

.block-label-line {
    background: var(--primary-shadow-hover);
    flex: 1;
    height: 1px;
}

.block-title {
    color: var(--black-color);
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 16px;
    line-height: 1.2;
}

.block-text {
    color: var(--color-text);
    font-size: 1rem;
    line-height: 1.9;
    font-weight: 400;
}

.block-text + .block-text { margin-top: 14px; }

.age-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    margin-bottom:52px;
}

.age-card {
    background: var(--white-color);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: 18px 20px;
    display: flex;
    align-items: center;
    gap: 14px;
    transition: all var(--transition-fast);
    cursor: default;
}

.age-card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 20px rgba(244,76,59,0.08);
    transform: translateX(4px);
}

.age-icon {
    width: 42px; height: 42px;
    border-radius: 10px;
    background: var(--primary-color-extra-light);
    border: 1px solid rgba(244,76,59,0.2);
    display: flex; align-items: center; justify-content: center;
    font-size: 18px;
    flex-shrink: 0;
}

.age-name { font-size: 1rem; font-weight: 500; color: var(--color-heading); }
.age-range { font-size: .9rem; color: var(--grey-color-dark); margin-top: 2px; }

.tag-grid { display: flex; flex-wrap: wrap; gap: 8px; }

.tag-item {
    background: var(--primary-color-extra-light);
    color: var(--primary-color-dark);
    border: 1px solid var(--primary-color);
    border-radius: var(--radius-lg);
    padding: 6px 16px;
    font-size: .9rem;
    font-weight: 500;
    transition: all var(--transition-fast);
}

.tag-item:hover {
    background: var(--primary-color);
    color: var(--white-color);
    border-color: var(--primary-color);
}

.cert-list { display: flex; flex-direction: column; gap: 10px; }

.cert-item {
    background: var(--white-color);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: 16px 20px;
    display: flex;
    align-items: flex-start;
    gap: 14px;
    transition: border-color var(--transition-fast);
}

.cert-item:hover { border-color: var(--primary-color); }

.cert-dot {
    width: 8px; height: 8px;
    border-radius: 50%;
    background: var(--primary-color);
    margin-top: 7px;
    flex-shrink: 0;
}

.cert-text { font-size: .9rem; color: var(--color-text); line-height: 1.55; }
.cert-text strong { color: var(--color-heading); font-weight: 600; display: block; margin-bottom: 3px; font-size: .9rem;}

.test-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }

.test-item {
    background: var(--white-color);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    padding: 11px 16px;
    font-size: 1rem;
    color: var(--color-text);
    display: flex;
    align-items: center;
    gap: 10px;
    transition: all var(--transition-fast);
}

.test-item:hover { border-color: var(--secondary-color); color: var(--secondary-color-dark); }

.test-item::before {
    content: '';
    width: 5px; height: 5px;
    border-radius: 50%;
    background: var(--secondary-color);
    flex-shrink: 0;
}

.pub-card {
    background: var(--white-color);
    border: 1px solid var(--color-border);
    border-left: 3px solid var(--primary-color);
    border-radius: 0 var(--radius-lg) var(--radius-lg) 0;
    padding: 22px 26px;
    margin-bottom: 12px;
    transition: box-shadow var(--transition-fast);
}

.pub-card:hover { box-shadow: 0 4px 24px rgba(0,0,0,0.06); }
.pub-title { font-size: 1rem; font-weight: 600; color: var(--black-color); line-height: 1.55; margin-bottom: 8px; }
.pub-meta { font-size: 1rem; color: var(--grey-color-dark); line-height: 1.55; }
.pub-link { display: inline-flex; align-items: center; gap: 4px; font-size: 1rem; color: var(--primary-color); text-decoration: none; margin-top: 10px; font-weight: 500; }
.pub-link:hover { color: var(--primary-color-dark); }

/* ══════════════════════════════════════
   SIDEBAR
══════════════════════════════════════ */
.sidebar {
    position: sticky;
    top: 32px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    opacity: 0;
    animation: fadeUp 0.55s 0.25s forwards;
}

.sidebar-card {
    background: var(--white-color);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0,0,0,0.04);
}

.sidebar-card-head {
    padding: 16px 20px;
    border-bottom: 1px solid var(--color-border);
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--grey-color-xlight);
}

.sidebar-card-head-icon {
    background: var(--primary-color-extra-light);
    border: 1px solid rgba(244,76,59,0.2);
    font-size: 1rem;
    width: 32px; height: 32px;
    border-radius: 8px;
    display: flex; align-items: center; justify-content: center;
}

.sidebar-card-head-title {
    color: var(--black-color);
    font-size: 1.2rem;
    font-weight: 700;
}

.ts-info-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid var(--primary-shadow-hover);
}

.ts-info-row:last-of-type {
    border-bottom: none;
    margin-bottom: 10px;
}

.ts-info-label {
    font-size: 1rem;
    color: var(--primary-color-dark);
    font-weight: 600;
}

.ts-info-value {
    font-size: .9rem;
    color: var(--grey-color-deep);
    font-weight: 500;
    text-align: right;
    max-width: 60%;
}

.ts-stat-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-top: 10px;
}

.ts-stat-item {
    background: var(--white-color);
    border-radius: 10px;
    padding: 10px 12px;
    text-align: center;
}

.ts-stat-label {
    color: var(--grey-color-deep);
    font-size: .8rem;
    font-weight: 600;
    margin-bottom: 4px;
}

.ts-stat-num {
    color: var(--primary-color-dark);
    font-size: 1.2rem;
    font-weight: 900;
}

.ts-stat-num::after {
    color: var(--primary-color);
    content: '';
}

.team-sidebar-box {
    background: #f0f7f3;
    border-radius: 20px;
    padding: 16px;
    border: .5px solid var(--primary-color-extra-light);
    margin-bottom: 16px;
}

.team-sidebar-title {
    font-size: 1.3rem;
    font-weight: 800;
    color: var(--black-color);
    margin-bottom: 12px;
}

.team-sidebar-title span {color: var(--primary-color-dark);}

.sidebar-card-body { padding: 16px 20px; }

.info-row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 0;
    border-bottom: 1px solid var(--color-border);
    font-size: 13px;
}

.info-row:last-child { border-bottom: none; }
.info-label { color: var(--grey-color-dark); font-size: 1rem; min-width: 88px; padding-top: 1px; }
.info-value { color: var(--black-color); font-weight: 500; line-height: 1.4; }

.membership-list { display: flex; flex-direction: column; gap: 0; }

.membership-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 1rem;
    color: var(--color-text);
    line-height: 1.45;
    padding: 10px 0;
    border-bottom: 1px solid var(--color-border);
}

.membership-item:last-child { border-bottom: none; }

.membership-item::before {
    content: '';
    width: 5px; height: 5px;
    border-radius: 50%;
    background: var(--primary-color);
    margin-top: 7px;
    flex-shrink: 0;
}

.academic-link {
    color: var(--primary-color-dark);
    background: var(--white-color);
    font-size: 1rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid var(--primary-color);
    border-radius: 10px;
    text-decoration: none;
    transition: border-color .2s, box-shadow .2s;
    margin-bottom: 6px;
}

.academic-link:hover {
    border-color: var(--primary-color);
    box-shadow: 0 2px 8px var(--primary-color);
}

.academic-link-icon {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: #e8f5ee;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    flex-shrink: 0;
}

.academic-link:hover .academic-link-icon {
    background: var(--primary-color);
    border-color: var(--primary-color);
}

.cta-sidebar {
    background: #0d1f16;
    border-radius: var(--radius-lg);
    padding: 30px 26px;
    position: relative;
    overflow: hidden;
}

.cta-sidebar::before {
    content: '';
    position: absolute;
    top: -40px; right: -40px;
    width: 130px; height: 130px;
    border-radius: 50%;
    border: 12px solid var(--primary-shadow);
}

.cta-sidebar::after {
    content: '';
    position: absolute;
    bottom: -20px; left: -20px;
    width: 80px; height: 80px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(49,197,244,0.12) 0%, transparent 70%);
}

.cta-sidebar-eyebrow {
    color: var(--primary-color-dark);
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 10px;
}

.cta-sidebar-title {
    color: var(--white-color);
    font-size: 1.2rem;
    font-weight: 700;
    line-height: 1.25;
    margin-bottom: 10px;
    position: relative;
    z-index: 1;
}

.cta-sidebar-desc {
    color: var(--grey-color-deep);
    font-size: 1.1rem;
    font-weight: 300;
    line-height: 1.65;
    margin-bottom: 22px;
    position: relative;
    z-index: 1;
}

.cta-sidebar-btn {
    color: var(--white-color);
    background: var(--primary-color-dark);
    font-size: 1rem;
    font-weight: 600;
    border: none;
    border-radius: var(--radius-xl);
    padding: 13px 26px;
    box-shadow: 0 6px 20px var(--primary-shadow-hover);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
    text-decoration: none;
    transition: all var(--transition-fast);
    position: relative;
    z-index: 1;
}

.cta-sidebar-btn:hover {
    color: var(--primary-color-dark);
    background: var(--white-color);
    transform: translateY(-2px);
    box-shadow: 0 10px 28px var(--primary-shadow-hover);
}

/* ══════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════ */
@media (max-width: 1024px) {
    .hero-inner { grid-template-columns: 1fr; padding: 0 24px; }
    .hero-content { padding: 48px 0 32px; order: 2; }
    .hero-photo { order: 1; padding: 40px 0 0; justify-content: flex-start; }
    .hero-photo-frame { width: 200px; }
    .hero-photo-frame img, .hero-photo-frame .photo-placeholder { height: 280px; }
    .hero-photo-badge { right: 0; }
}

@media (max-width: 960px) {
    .main { grid-template-columns: 1fr; padding: 40px 24px 80px; }
    .sidebar { position: static; }
    .age-grid, .test-grid { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
    .hero-stats { gap: 0; flex-wrap: wrap; }
    .hero-stat { flex: 0 0 auto; padding-right: 24px; margin-right: 24px; }
    .hero-name { font-size: 2rem; }
}

/*---------------------------------------------------
   7.AD. Dashboard Calendar
-----------------------------------------------------*/
/* ─────────────────────── DOCTOR CALENDAR ───────────────────────── */

.fc-daygrid-event .fc-event-title {white-space: normal !important;}

.fc-event {
    white-space: normal !important;
    overflow: visible !important;
}

.fc-event-title {
    color: var(--white-color) !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: unset !important;
    font-size: 12px;
    line-height: 1.3;
}

.fc-daygrid-event-dot {
    border-color: var(--android) !important;
    border: calc(var(--white-color)/2) solid var(--white-color);
}

.fc-event-time,
.fc-daygrid-event-harness .fc-event-time {
    color: var(--white-color) !important;
    font-size: .8rem;
    padding-right: 6px;
    display: block;
}

.fc-timegrid-event {min-height: 40px;}

.fc .fc-button {
    font-size: 12px;
    font-weight: 500;
    padding: 10px 14px;
    line-height: 1.2;
    height: auto;
}

.fc-daygrid-dot-event:hover {background-color: var(--color-footer-top);}

.fc-daygrid-event-harness a {background-color: var(--primary-background);}

.fc-col-header-cell,
.fc .fc-scroller-harness {font-size: 1rem;}

.fc-timegrid-event-short .fc-event-main-frame {
    overflow: hidden !important;
    display: block;
}

.fc .fc-button-primary {
    background-color: var(--color-footer-top);
    border-color: var(--color-footer-top);
    border-radius: var(--font-size-lg);
}

.fc .fc-button-group {font-weight: 500;}

.fc .fc-button-primary:hover {
    background-color: var(--color-footer);
    border-color: var(--color-footer);
    opacity: 0.85;
}

.fc .fc-button-primary:not(:disabled).fc-button-active,
.fc .fc-button-primary:not(:disabled):active {
    background-color: var(--color-footer) !important;
    border-color: var(--color-footer) !important;
    color: var(--white-color) !important;
}

.fc .fc-button-primary.fc-button-active {
    background-color: var(--color-footer-top);
    border-color: var(--color-footer-top);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.3);
}

.fc .fc-prev-button,
.fc .fc-next-button {
    font-size: 12px;
    padding: 8px 14px;
}

.fc .fc-toolbar-title {
    font-size: 1.5rem;
    font-weight: 700;
}

.fc .fc-button-primary:disabled {
    background-color: var(--color-footer-top) !important;
    border-color: var(--color-footer-top) !important;
    color: var(--white-color) !important;
    opacity: 1 !important;
    cursor: default;
}

.fc .fc-col-header-cell-cushion {color: var(--color-footer-top);}

.fc .fc-col-header-cell-cushion:hover {color: var(--primary-color);}

.fc .fc-timegrid-slot-label-cushion {
    display: inline-block;
    white-space: nowrap;
    color: var(--color-footer-top);
    font-weight: 500;
    font-size: 1.2rem;
}

.fc-v-event {
    background-color: var(--primary-color);
    border: 1px solid var(--color-footer-top);
    border-radius: var(--font-size-xs);
    display: flex;
    font-weight: 600;
    font-size: 1rem;
    padding-left: 8px;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.fc .fc-daygrid-day-number {
    padding: 4px;
    position: relative;
    z-index: 4;
    color: var(--color-footer-top);
}

#fc-dom-7 {color: var(--color-footer-top);}

.fc-list-day-text,
.fc-list-day-side-text {color: var(--color-footer-top);}

.fc .fc-list-event-dot {border: calc(10px / 2) solid var(--primary-color);}

.fc-list-event-title a {color: var(--primary-color) !important;}

.fc-list-event-time {color: var(--color-footer-top);}

.fc .fc-timegrid-axis-frame {
    text-align: center !important;
    color: var(--color-footer-top);
    font-weight: 600;
}

.fc .fc-timegrid-slot-label,
.fc .fc-timegrid-slot-label-cushion {
    color: var(--color-footer-top);
    vertical-align: middle;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ─────────────────────── SECRETER CALENDAR ───────────────────────── */
.kcal { padding-bottom: 40px;}

.kcal-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.kcal-top__title {
    color: var(--color-footer-top);
    font-size: 1.2rem;
    font-weight: 800;
}

.kcal-top__sub {
    color: var(--grey-color-dark);
    font-size: .9rem;
    margin-top: 2px;
}

.kcal-top__right {
    display: flex;
    align-items: center;
    gap: 8px;
}

.kcal-select-wrap {
    position: relative;
    display: flex;
    align-items: center;
}

.kcal-select-wrap > svg:first-child {
    color: var(--grey-color);
    position: absolute;
    left: 10px;
    pointer-events: none;
    z-index: 1;
}

.kcal-select-arrow {
    color: var(--grey-color);
    position: absolute;
    right: 10px;
    pointer-events: none;
}

.kcal-select {
    background: var(--white-color);
    color: var(--color-footer-top);
    font-size: 1rem;
    min-width: 160px;
    height: 36px;
    padding: 0 32px 0 30px;
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    appearance: none;
    cursor: pointer;
    transition: var(--transition-all-fast);
}

.kcal-select:focus {
    border-color: var(--color-footer-top);
    outline: none;
}

.kcal-card {
    background: var(--white-color);
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0,0,0,.05);
}

.kcal-nav {
    background: var(--grey-color-light);
    padding: 14px 20px;
    border-bottom: 1px solid var(--grey-color-light);
    gap: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.kcal-nav__left {
    display: flex;
    align-items: center;
    gap: 6px;
}

.kcal-nav__title {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 700;
    min-width: 150px;
    text-align: center;
}

.kcal-arrow {
    background: var(--white-color);
    color: var(--grey-color-dark);
    width: 32px;
    height: 32px;
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition-all-fast);
}

.kcal-arrow:hover {
    color: var(--color-footer-top);
    border-color: var(--color-footer-top);
}

.kcal-today-btn {
    background: var(--white-color);
    color: var(--grey-color-dark);
    font-size: .9rem;
    font-weight: 600;
    height: 32px;
    padding: 0 14px;
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    cursor: pointer;
    transition: var(--transition-all-fast);
}

.kcal-today-btn:hover {
    color: var(--color-footer-top);
    border-color: var(--color-footer-top);
}

.kcal-legend {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.kcal-leg {
    font-size: .8rem;
    font-weight: 600;
    gap: 5px;
    padding: 6px 10px;
    border-radius: var(--radius-xs);
    display: flex;
    align-items: center;
}

.kcal-leg__dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    flex-shrink: 0;
}

.kcal-leg--yy { background: #EAF3DE; color: #27500A; }
.kcal-leg--yy .kcal-leg__dot { background: var(--primary-color); }

.kcal-leg--ol { background: #E6F1FB; color: #042C53; }
.kcal-leg--ol .kcal-leg__dot { background: #185FA5; }

.kcal-leg--bk { background: #FAEEDA; color: #412402; }
.kcal-leg--bk .kcal-leg__dot { background: #BA7517; }

.kcal-leg--ip { background: #FCEBEB; color: #501313; }
.kcal-leg--ip .kcal-leg__dot { background: #A32D2D; }

.kcal-views {
    background: var(--white-color);
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    padding: 3px;
    gap: 2px;
    display: flex;
}

.kcal-vbtn {
    background: transparent;
    color: var(--grey-color-dark);
    font-size: .8rem;
    font-weight: 600;
    height: 26px;
    padding: 0 12px;
    border: none;
    border-radius: calc(var(--radius-xs) - 2px);
    cursor: pointer;
    transition: var(--transition-all-fast);
}

.kcal-vbtn:hover { color: var(--color-footer-top); }

.kcal-vbtn--active {
    background: var(--color-footer-top);
    color: var(--white-color);
}

.kcal-loading {
    padding: 20px;
    gap: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.kcal-loading__dot {
    background: var(--color-footer-top);
    width: 7px;
    height: 7px;
    border-radius: 50%;
    opacity: 0.3;
    animation: kcalDot 0.9s infinite ease-in-out both;
}

.kcal-loading__dot:nth-child(1) { animation-delay: -.3s; }
.kcal-loading__dot:nth-child(2) { animation-delay: -.15s; }

@keyframes kcalDot {
    0%, 80%, 100% { transform: scale(0.5); opacity: 0.2; }
    40%           { transform: scale(1);   opacity: 1; }
}

/* ═══════════════════════════════════════════════════════════
   AY GÖRÜNÜMÜ
═══════════════════════════════════════════════════════════ */

.kcal-weekdays {
    background: var(--grey-color-xlight);
    border-bottom: 1px solid var(--grey-color-light);
    display: grid;
    grid-template-columns: repeat(7, 1fr);
}

.kcal-dow {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 700;
    padding: 10px 0;
    text-align: center;
}

.kcal-dow:nth-child(6),
.kcal-dow:nth-child(7) {
    color: #A32D2D;
    opacity: 0.7;
}

.kcal-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
}

.kcal-cell {
    min-height: 92px;
    padding: 8px 6px 6px;
    border-right: 1px solid var(--grey-color-light);
    border-bottom: 1px solid var(--grey-color-light);
    cursor: pointer;
    transition: background var(--transition-all-fast);
}

.kcal-cell:nth-child(7n) {border-right: none;}

.kcal-cell:hover {background: var(--grey-color-xlight);}

.kcal-cell--other {
    opacity: 0.22;
    pointer-events: none;
}

.kcal-cell--today {background: #F0F6FF;}

.kcal-num {
    color: var(--color-footer-top);
    font-size: .9rem;
    font-weight: 600;
    width: 26px;
    height: 26px;
    border-radius: var(--radius-xs);
    margin-bottom: 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.kcal-cell--today .kcal-num {
    background: var(--color-footer-top);
    color: var(--white-color);
}

.kcal-cell:nth-child(7n-1) .kcal-num,
.kcal-cell:nth-child(7n) .kcal-num { color: #A32D2D; }

.kcal-cell--today .kcal-num { color: var(--white-color) !important; }

.kcal-ev {
    font-size: .9rem;
    font-weight: 600;
    padding: 2px 5px;
    border-radius: 4px;
    margin-bottom: 2px;
    gap: 4px;
    display: flex;
    align-items: center;
    overflow: hidden;
    white-space: nowrap;
    cursor: pointer;
    transition: opacity var(--transition-all-fast);
}

.kcal-ev:hover { opacity: 0.8; }

.kcal-ev__bar {
    width: 3px;
    height: 10px;
    border-radius: 2px;
    flex-shrink: 0;
}

.kcal-ev__txt {
    overflow: hidden;
    text-overflow: ellipsis;
}

.kcal-ev--yy { background: #EAF3DE; color: #27500A; }
.kcal-ev--yy .kcal-ev__bar { background: var(--primary-color); }

.kcal-ev--ol { background: #E6F1FB; color: #042C53; }
.kcal-ev--ol .kcal-ev__bar { background: #185FA5; }

.kcal-ev--bk { background: #FAEEDA; color: #412402; }
.kcal-ev--bk .kcal-ev__bar { background: #BA7517; }

.kcal-ev--ip { background: #FCEBEB; color: #501313; }
.kcal-ev--ip .kcal-ev__bar { background: #A32D2D; }

.kcal-ev--more {
    background: transparent;
    color: var(--grey-color-dark);
    font-size: .7rem;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════════
   HAFTA GÖRÜNÜMÜ
═══════════════════════════════════════════════════════════ */

.kcal-week {
    display: flex;
    flex-direction: column;
}

.kcal-week__head {
    background: var(--grey-color-xlight);
    display: grid;
    grid-template-columns: 52px repeat(7, 1fr);
    border-bottom: 1px solid var(--grey-color-light);
}

.kcal-week__corner {
    padding: 10px;
    border-right: 1px solid var(--grey-color-light);
}

.kcal-week__dhead {
    padding: 10px 8px;
    text-align: center;
    border-left: 1px solid var(--grey-color-light);
}

.kcal-week__dhead--today { background: #F0F6FF; }

.kcal-week__dow {
    color: var(--grey-color-dark);
    font-size: 1rem;
    font-weight: 700;
}

.kcal-week__dnum {
    color: var(--color-footer-top);
    font-size: 1.1rem;
    font-weight: 700;
    margin-top: 2px;
}

.kcal-week__dhead--today .kcal-week__dnum { color: var(--primary-color);}

.kcal-week__body {
    display: grid;
    grid-template-columns: 52px repeat(7, 1fr);
    max-height: 500px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--grey-color-light) transparent;
}

.kcal-week__times { border-right: 1px solid var(--grey-color-light);}

.kcal-week__time {
    color: var(--grey-color);
    font-size: .9rem;
    font-weight: 600;
    height: 52px;
    padding: 6px 8px 0;
    border-bottom: 1px solid var(--grey-color-light);
}

.kcal-week__col {
    border-left: 1px solid var(--grey-color-light);
    position: relative;
}

.kcal-week__col--today {background: #FAFCFF;}

.kcal-week__slot {
    height: 52px;
    border-bottom: 1px solid var(--grey-color-light);
    padding: 2px;
    position: relative;
}

.kcal-week__ev {
    font-size: .9rem;
    font-weight: 600;
    margin-bottom: 2px;
    display: block;
    padding: 3px 6px;
    border-radius: 4px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    cursor: pointer;
    border-left: 3px solid;
    transition: opacity var(--transition-all-fast);
}

.kcal-week__ev:hover { opacity: 0.8; }

.kcal-week__ev--yy { background: #EAF3DE; color: #27500A; border-color: var(--primary-color); }
.kcal-week__ev--ol { background: #E6F1FB; color: #042C53; border-color: #185FA5; }
.kcal-week__ev--bk { background: #FAEEDA; color: #412402; border-color: #BA7517; }
.kcal-week__ev--ip { background: #FCEBEB; color: #501313; border-color: #A32D2D; }

/* ═══════════════════════════════════════════════════════════
   GÜN GÖRÜNÜMÜ
═══════════════════════════════════════════════════════════ */

.kcal-day__head {
    background: var(--grey-color-xlight);
    padding: 16px 20px;
    border-bottom: 1px solid var(--grey-color-light);
}

.kcal-day__title {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 8px;
}

.kcal-day__badge {
    background: var(--primary-color);
    color: var(--white-color);
    font-size: .9rem;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: var(--radius-xs);
}

.kcal-day__sub {
    color: var(--grey-color-dark);
    font-size: 1rem;
    margin-top: 3px;
}

.kcal-day__slot {
    border-bottom: 1px solid var(--grey-color-light);
    min-height: 52px;
    display: flex;
    align-items: stretch;
}

.kcal-day__time {
    color: var(--grey-color);
    font-size: 1rem;
    font-weight: 600;
    width: 60px;
    padding: 8px 12px 0;
    flex-shrink: 0;
    border-right: 1px solid var(--grey-color-light);
}

.kcal-day__content {
    flex: 1;
    padding: 6px 10px;
}

.kcal-day__ev {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 12px;
    border-radius: var(--radius-xs);
    margin-bottom: 4px;
    cursor: pointer;
    border-left: 3px solid;
    transition: opacity var(--transition-all-fast);
}

.kcal-day__ev:hover { opacity: 0.85; }

.kcal-day__ev--yy { background: #EAF3DE; border-color: var(--primary-color); }
.kcal-day__ev--ol { background: #E6F1FB; border-color: #185FA5; }
.kcal-day__ev--bk { background: #FAEEDA; border-color: #BA7517; }
.kcal-day__ev--ip { background: #FCEBEB; border-color: #A32D2D; }

.kcal-day__ev-time {
    font-size: 1rem;
    font-weight: 700;
    min-width: 38px;
}

.kcal-day__ev--yy .kcal-day__ev-time { color: #27500A; }
.kcal-day__ev--ol .kcal-day__ev-time { color: #042C53; }
.kcal-day__ev--bk .kcal-day__ev-time { color: #412402; }
.kcal-day__ev--ip .kcal-day__ev-time { color: #501313; }

.kcal-day__ev-name {
    font-size: 1rem;
    font-weight: 600;
    flex: 1;
}

.kcal-day__ev--yy .kcal-day__ev-name { color: #27500A; }
.kcal-day__ev--ol .kcal-day__ev-name { color: #042C53; }
.kcal-day__ev--bk .kcal-day__ev-name { color: #412402; }
.kcal-day__ev--ip .kcal-day__ev-name { color: #501313; }

.kcal-day__ev-type {
    font-size: .9rem;
    font-weight: 500;
    opacity: 0.65;
}

/* ═══════════════════════════════════════════════════════════
   LİSTE GÖRÜNÜMÜ
═══════════════════════════════════════════════════════════ */

.kcal-list {padding: 8px 0;}

.kcal-list__empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 48px 20px;
    text-align: center;
    color: var(--grey-color);
}

.kcal-list__empty p {
    color: var(--grey-color-dark);
    font-size: .85rem;
}

.kcal-list__head {
    background: var(--grey-color-xlight);
    padding: 12px 20px 6px;
    border-bottom: 1px solid var(--grey-color-light);
    display: flex;
    align-items: center;
    gap: 10px;
}

.kcal-list__head-day {
    color: var(--grey-color-dark);
    font-size: 1rem;
    font-weight: 700;
    min-width: 36px;
}

.kcal-list__head-date {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 700;
    flex: 1;
}

.kcal-list__head-count {
    background: var(--color-footer-top);
    color: var(--white-color);
    font-size: .9rem;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: var(--radius-xs);
}

.kcal-list__ev {
    padding: 12px 20px;
    gap: 14px;
    border-bottom: 1px solid var(--grey-color-light);
    display: flex;
    align-items: center;
    cursor: pointer;
    transition: background var(--transition-all-fast);
}

.kcal-list__ev:hover {background: var(--grey-color-xlight);}

.kcal-list__bar {
    width: 4px;
    height: 36px;
    border-radius: 2px;
    flex-shrink: 0;
}

.kcal-list__ev--yy .kcal-list__bar { background: var(--primary-color); }
.kcal-list__ev--ol .kcal-list__bar { background: #185FA5; }
.kcal-list__ev--bk .kcal-list__bar { background: #BA7517; }
.kcal-list__ev--ip .kcal-list__bar { background: #A32D2D; }

.kcal-list__time {
    color: var(--color-footer-top);
    font-size: .9rem;
    font-weight: 700;
    min-width: 42px;
}

.kcal-list__info {
    flex: 1;
    min-width: 0;
}

.kcal-list__name {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.kcal-list__meta {
    color: var(--grey-color-dark);
    font-size: .9rem;
    margin-top: 2px;
}

.kcal-list__badge {
    font-size: .9rem;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: var(--radius-xs);
    white-space: nowrap;
}

.kcal-list__ev--yy .kcal-list__badge { background: #EAF3DE; color: #27500A; }
.kcal-list__ev--ol .kcal-list__badge { background: #E6F1FB; color: #042C53; }
.kcal-list__ev--bk .kcal-list__badge { background: #FAEEDA; color: #412402; }
.kcal-list__ev--ip .kcal-list__badge { background: #FCEBEB; color: #501313; }

/* ═══════════════════════════════════════════════════════════
   MODAL
═══════════════════════════════════════════════════════════ */

.kcal-backdrop {
    background: rgba(0,0,0,.45);
    display: none;
    position: fixed;
    inset: 0;
    z-index: 9000;
    align-items: center;
    justify-content: center;
}

.kcal-backdrop--open {display: flex;}

.kcal-modal {
    background: var(--white-color);
    border-radius: var(--radius-sm);
    width: 100%;
    max-width: 420px;
    margin: 16px;
    overflow: hidden;
    box-shadow: 0 16px 48px rgba(0,0,0,.18);
}

.kcal-modal__head {
    background: var(--color-footer-top);
    color: var(--white-color);
    padding: 16px 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.kcal-modal__patient {
    font-size: 1rem;
    font-weight: 800;
}

.kcal-modal__phone {
    font-size: .9rem;
    opacity: 0.75;
    margin-top: 2px;
}

.kcal-modal__close {
    background: rgba(255,255,255,.15);
    color: var(--white-color);
    width: 30px;
    height: 30px;
    border: none;
    border-radius: var(--radius-xs);
    display: grid;
    place-items: center;
    cursor: pointer;
    transition: var(--transition-all-fast);
}

.kcal-modal__close:hover {background: rgba(255,255,255,.25);}

.kcal-modal__body {padding: 4px 0;}

.kcal-modal__row {
    padding: 11px 18px; gap: 12px;
    border-bottom: 1px solid var(--grey-color-light);
    display: flex;
    align-items: flex-start;
}

.kcal-modal__row:last-child {border-bottom: none;}

.kcal-modal__row > svg {
    color: var(--grey-color);
    flex-shrink: 0;
    margin-top: 2px;
}

.kcal-modal__lbl {
    color: var(--grey-color-dark);
    font-size: .7rem;
    font-weight: 700;
    margin-bottom: 2px;
}

.kcal-modal__val {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 600;
}

.kcal-status {
    font-size: .9rem;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: var(--radius-xs);
    display: inline-flex;
    align-items: center;
}

.kcal-status--yy { background: #EAF3DE; color: #27500A; }
.kcal-status--ol { background: #E6F1FB; color: #042C53; }
.kcal-status--bk { background: #FAEEDA; color: #412402; }
.kcal-status--ip { background: #FCEBEB; color: #501313; }

.kcal-modal__foot {
    background: var(--grey-color-xlight);
    gap: 8px;
    padding: 12px 18px;
    border-top: 1px solid var(--grey-color-light);
    display: flex;
}

.kcal-modal__action-btn {
    font-size: .8rem;
    font-weight: 700;
    width: 100%;
    height: 36px;
    gap: 6px;
    border-radius: var(--radius-xs);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border: 1px solid transparent;
    text-decoration: none;
    transition: var(--transition-all-fast);
}

.kcal-modal__action-btn--approve {
    background: #EAF3DE;
    color: #27500A;
    border-color: #97C459;
}

.kcal-modal__action-btn--approve:hover {
    background: var(--primary-color);
    color: var(--white-color);
    border-color: var(--primary-color);
}

.kcal-modal__action-btn--cancel {
    background: #FCEBEB;
    color: #501313;
    border-color: #F09595;
}

.kcal-modal__action-btn--cancel:hover {
    background: #A32D2D;
    color: var(--white-color);
    border-color: #A32D2D;
}

.kcal-modal__action-btn--edit {
    background: var(--grey-color-xlight);
    color: var(--color-footer-top);
    border-color: var(--grey-color-light);
}

.kcal-modal__action-btn--edit:hover {
    background: var(--color-footer-top);
    color: var(--white-color);
    border-color: var(--color-footer-top);
}

/* ── Responsive ──────────────────────────────────────────────────── */
@media (max-width: 768px) {
    .kcal-nav {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .kcal-legend {
        display: none;
    }

    .kcal-cell {
        min-height: 60px;
        padding: 4px;
    }

    .kcal-ev__txt {
        display: none;
    }

    .kcal-week__body {
        max-height: 360px;
    }
}

/*---------------------------------------------------
   7.AE. Team Page
-----------------------------------------------------*/
.team-section {
    padding: 0 0 100px;
    background: var(--white-color);
    overflow: hidden;
}

.ts-featured-wrap,
.ts-grid-wrap,
.ts-bottom-wrap {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 32px;
    box-sizing: border-box;
}

.ts-header-wrap {
    width: 100%;
    background: transparent;
    padding: 40px 0 0;
    margin-bottom: 56px;
}

.ts-header-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 32px;
    box-sizing: border-box;
}

.ts-header {
    background: var(--white-color);
    border-radius: var(--radius-lg);
    border-top: 1.5px solid var(--primary-color);
    border-right: 5px solid var(--primary-color);
    border-bottom: 1.5px solid var(--primary-color);
    border-left: 6px solid var(--primary-color);
    padding: 40px 48px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 48px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 4px 24px rgba(17,34,53,0.08);
}

.ts-header::after {content: none;}

.ts-eyebrow {
    color: var(--primary-color-dark);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: 14px;
}

.ts-eyebrow-dot {
    background: var(--primary-color);
    width: 6px;
    height: 6px;
    border-radius: 50%;
    flex-shrink: 0;
    animation: ts-dot-pulse 2.5s ease-in-out infinite;
}

@keyframes ts-dot-pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50%       { opacity: 0.5; transform: scale(0.75); }
}

.ts-main-title {
    color: var(--black-color);
    font-size: 3.5rem;
    font-weight: 800;
    line-height: 1.0;
    margin: 0;
}

.ts-title-accent {color: var(--primary-color);}


.ts-header-right {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.ts-header-desc {
    color: var(--grey-color-dark);
    font-size: 1rem;
    line-height: 1.75;
    margin: 0;
}

.ts-header-stat-row {
    background: linear-gradient(160deg, #071410 0%, #24593e 60%, #0d2218 100%) !important;
    padding: 20px 28px;
    width: fit-content;
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    gap: 0;
    border-radius: var(--radius-md);
}

.ts-header-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0 28px;
}

.ts-header-stat:first-child { padding-left: 0; }
.ts-header-stat:last-child  { padding-right: 0; }

.ts-header-stat-num {
    color: var(--primary-color-dark);
    font-size: 2rem;
    font-weight: 800;
    line-height: 1;
}

.ts-header-stat-label {
    color: var(--primary-color-extra-light);
    font-size: 1rem;
    margin-top: 4px;
    font-weight: 600;
    white-space: nowrap;
}

.ts-header-stat-divider {
    width: 1px;
    height: 36px;
    background: rgba(255,255,255,0.1);
    flex-shrink: 0;
}

.ts-featured-wrap {margin-bottom: 40px;}

.ts-featured {
    display: grid;
    grid-template-columns: minmax(0, 320px) minmax(0, 1fr);
    border-radius: var(--radius-lg);
    overflow: hidden;
    border: 1.5px solid var(--primary-color);
    box-shadow: 0 8px 40px var(--primary-shadow);
    transition: box-shadow 0.3s ease;
    width: 100%;
    box-sizing: border-box;
}

.ts-featured:hover {box-shadow: 0 16px 56px var(--primary-shadow-hover);}

.ts-feat-left {
    background: var(--primary-color-dark);
    position: relative;
    min-height: 420px;
    overflow: hidden;
}

.ts-feat-left::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(0,0,0,0.05) 0%,
        rgba(13, 42, 31, 0.55) 100%
    );
    z-index: 1;
    pointer-events: none;
}

.ts-feat-pill {
    color: var(--primary-color-dark);
    background: var(--primary-color-extra-light);
    font-size: .9rem;
    font-weight: 700;
    padding: 6px 14px;
    position: absolute;
    top: 18px;
    left: 18px;
    z-index: 3;
    border-radius: 100px;
    white-space: nowrap;
}

.ts-feat-photo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top center;
    display: block;
    z-index: 0;
}

.ts-feat-num {
    color: var(--grey-color-dark);
    font-size: 80px;
    font-weight: 800;
    position: absolute;
    bottom: 16px;
    right: 16px;
    z-index: 2;
    line-height: 1;
    user-select: none;
}

.ts-feat-right {
    background: var(--white-color);
    padding: 40px 44px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0;
    overflow: hidden;
    min-width: 0;
}

.ts-feat-role {
    color: var(--primary-color);
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 8px;
}

.ts-feat-name {
    color: var(--black-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0 0 6px;
    line-height: 1.2;
}

.ts-feat-edu {
    color: var(--color-text);
    font-size: 1rem;
    margin-bottom: 20px;
}

.ts-feat-divider {
    background: var(--primary-color);
    width: 44px;
    height: 3px;
    border-radius: 2px;
    margin-bottom: 20px;
}

.ts-feat-bio {
    color: var(--color-text);
    font-size: 1rem;
    line-height: 1.8;
    margin-bottom: 22px;
}

.ts-feat-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 28px;
}

.ts-tag {
    color: var(--primary-color-dark);
    background: var(--primary-color-extra-light);
    font-size: .9rem;
    font-weight: 600;
    padding: 5px 14px;
    border-radius: 100px;
    transition: background 0.2s, color 0.2s;
    cursor: default;
}

.ts-tag:hover {
    color: var(--white-color);
    background: var(--primary-color);
}

.ts-feat-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.ts-social-btn {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: 1.5px solid var(--color-border);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--grey-color-dark);
    transition: border-color 0.2s, color 0.2s, background 0.2s;
    text-decoration: none;
    flex-shrink: 0;
}

.ts-social-btn:hover {
    color: var(--primary-color);
    background: var(--primary-color-extra-light);
    border-color: var(--primary-color);
}

.ts-profile-btn {
    color: var(--white-color);
    background: var(--primary-color-dark);
    font-size: .9rem;
    font-weight: 600;
    padding: 12px 24px;
    border-radius: var(--radius-md);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    transition: background 0.2s, transform 0.15s;
    margin-left: auto;
    white-space: nowrap;
}

.ts-profile-btn:hover {
    color: var(--primary-color-dark);
    background: transparent;
    border: 1px solid var(--primary-color-dark);
    transform: translateY(-1px);
}

.ts-profile-btn svg {
    transition: transform 0.2s;
    flex-shrink: 0;
}

.ts-profile-btn:hover svg {transform: translateX(3px);}

.ts-grid-wrap {margin-bottom: 40px;}

.ts-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.ts-card {
    background: var(--white-color);
    border: 1px solid var(--color-border);
    border-left: 4px solid var(--primary-color);
    border-radius: var(--radius-lg);
    overflow: hidden;
    transition: box-shadow 0.25s, transform 0.25s;
    /* FIX: kart taşmasın */
    min-width: 0;
}

.ts-card:hover {
    box-shadow: 0 10px 36px var(--primary-shadow);
    transform: translateY(-4px);
}

.ts-card-photo-link {
    display: block;
    text-decoration: none;
    overflow: hidden;
}
.ts-card-photo {
    position: relative;
    width: 100%;
    height: 0;
    padding-top: 75%;
    overflow: hidden;
    background: var(--primary-color-extra-light);
    display: block;
}

.ts-card-img {
    background: var(--primary-color-extra-light);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease;
}

.ts-card:hover .ts-card-img {transform: scale(1.05);}

.ts-card-num {
    color: var(--primary-color-dark);
    font-size: 40px;
    font-weight: 800;
    position: absolute;
    bottom: 10px;
    right: 12px;
    line-height: 1;
    user-select: none;
    pointer-events: none;
    z-index: 1;
}

.ts-card-overlay {
    background: var(--primary-shadow);
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    opacity: 0;
    transition: opacity 0.3s ease;
    z-index: 2;
}

.ts-card:hover .ts-card-overlay {opacity: 1;}

.ts-overlay-social {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(255,255,255,0.15);
    border: 1.5px solid rgba(255,255,255,0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--white-color);
    text-decoration: none;
    transition: background 0.2s, border-color 0.2s;
}

.ts-overlay-social:hover {
    color: var(--white-color);
    background: var(--primary-color-dark);
    border-color: var(--white-color);
}

.ts-card-body {padding: 18px 20px 20px;}

.ts-card-role {
    color: var(--primary-color);
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 5px;
}

.ts-card-name-link {
    text-decoration: none;
    color: inherit;
}

.ts-card-name {
    color: var(--black-color);
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 10px;
    transition: color 0.2s;
    line-height: 1.3;
}

.ts-card-name-link:hover .ts-card-name {color: var(--primary-color);}

.ts-card-divider {
    background: var(--primary-color);
    width: 28px;
    height: 2.5px;
    border-radius: 2px;
    margin-bottom: 10px;
}

.ts-card-spec {
    color: var(--grey-color-deep);
    font-size: 1rem;
    line-height: 1.6;
    margin-bottom: 16px;
}

.ts-card-btn {
    color: var(--primary-color-dark);
    font-size: .9rem;
    font-weight: 600;
    padding: 7px 14px 7px 16px;
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    border: 1.5px solid var(--primary-color);
    border-radius: var(--radius-md);
    transition: background 0.2s, color 0.2s;
}

.ts-card-btn:hover {
    color: var(--white-color);
    background: var(--primary-color);
}

.ts-card-btn-arrow {
    background: var(--primary-color);
    width: 26px;
    height: 26px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 10px;
    flex-shrink: 0;
    transition: background 0.2s, transform 0.2s;
}

.ts-card-btn:hover .ts-card-btn-arrow {
    background: var(--primary-color-dark);
    transform: translateX(2px);
}

.ts-empty {
    color: var(--grey-color-dark);
    font-size: 1rem;
    grid-column: 1 / -1;
    text-align: center;
    padding: 48px;
}

.ts-bottom {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.ts-quote-card {
    background: #0d1f16;
    border-radius: var(--radius-lg);
    padding: 36px 40px;
    position: relative;
    overflow: hidden;
}

.ts-quote-card::after {
    background: radial-gradient(circle, rgba(86,190,146,0.18) 0%, transparent 70%);
    content: '';
    position: absolute;
    bottom: -20px;
    right: -20px;
    width: 160px;
    height: 160px;
    pointer-events: none;
}

.ts-quote-mark {
    color: var(--primary-color);
    font-size: 60px;
    font-weight: 700;
    line-height: 1;
    margin-bottom: 10px;
    font-family: Georgia, serif;
}

.ts-quote-text {
    color: var(--grey-color-light);
    font-size: 1.1rem;
    font-style: italic;
    line-height: 1.75;
    margin-bottom: 24px;
}

.ts-quote-author {
    display: flex;
    align-items: center;
    gap: 12px;
}

.ts-quote-avatar {
    background: var(--primary-color-dark);
    border: 2px solid var(--primary-color);
    font-size: 22px;
    width: 55px;
    height: 55px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ts-quote-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ts-quote-name {
    color: var(--white-color);
    font-size: 1.1rem;
    font-weight: 600;
}

.ts-quote-role {
    color: var(--primary-color);
    font-size: 1rem;
    margin-top: 3px;
}

.ts-cta-card {
    background: var(--primary-color-extra-light);
    border: 1.5px solid var(--primary-color);
    border-radius: var(--radius-lg);
    padding: 36px 40px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    overflow: hidden;
}

.ts-cta-card::before {
    background: radial-gradient(circle, rgba(86,190,146,0.18) 0%, transparent 70%);
    content: '';
    position: absolute;
    top: -50px;
    right: -50px;
    width: 200px;
    height: 200px;
    pointer-events: none;
}

.ts-cta-inner {flex: 1;}

.ts-cta-eyebrow {
    color: var(--primary-color-dark);
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 10px;
}

.ts-cta-title {
    color: var(--black-color);
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0 0 12px;
    line-height: 1.25;
}

.ts-cta-desc {
    color: var(--grey-color-deep);
    font-size: 1rem;
    line-height: 1.65;
    margin: 0;
}

.ts-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--primary-color);
    color: var(--white-color);
    font-size: 14px;
    font-weight: 700;
    padding: 14px 28px;
    border-radius: var(--radius-md);
    text-decoration: none;
    align-self: flex-start;
    margin-top: 28px;
    transition: background 0.2s, transform 0.15s, box-shadow 0.2s;
    box-shadow: 0 4px 16px var(--primary-shadow);
}

.ts-cta-btn:hover {
    background: var(--white-color);
    transform: translateY(-2px);
    box-shadow: 0 8px 24px var(--primary-shadow-hover);
    border: 1px solid var(--primary-color);
}

.ts-cta-btn svg {
    transition: transform 0.2s;
    flex-shrink: 0;
}

.ts-cta-btn:hover svg {transform: translateX(3px);}

/* ═══════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════ */
@media (max-width: 1024px) {
    .ts-featured {grid-template-columns: minmax(0, 260px) minmax(0, 1fr);    }
    .ts-grid {grid-template-columns: repeat(2, minmax(0, 1fr));    }
    .ts-header-stat-row {
        width: 100%;
        justify-content: space-around;
    }
}

@media (max-width: 768px) {
    .team-section {padding: 56px 0 72px;    }
    .ts-header-wrap,
    .ts-featured-wrap,
    .ts-grid-wrap,
    .ts-bottom-wrap {padding: 0 20px;    }
    .ts-header {
        grid-template-columns: 1fr;
        gap: 24px;
        margin-bottom: 32px;
        padding-bottom: 32px;
    }
    .ts-featured {grid-template-columns: 1fr;    }
    .ts-feat-left {min-height: 300px;    }
    .ts-feat-right {padding: 28px 24px;    }
    .ts-profile-btn {
        margin-left: 0;
        width: 100%;
        justify-content: center;
    }
    .ts-bottom {grid-template-columns: 1fr;    }
    .ts-header-stat-row {width: 100%;    }
}

@media (max-width: 540px) {
    .ts-grid {grid-template-columns: minmax(0, 1fr);    }
    .ts-quote-card,
    .ts-cta-card {padding: 28px 24px;    }
}

@media (prefers-reduced-motion: reduce) {
    .ts-card,
    .ts-card-img,
    .ts-profile-btn,
    .ts-cta-btn,
    .ts-tag,
    .ts-featured,
    .ts-eyebrow-dot {
        transition: none;
        animation: none;
    }
}

@media (max-width: 768px) {
    .ts-header-wrap {
        padding: 24px 0 0;
        margin-bottom: 32px;
    }
    .ts-header-inner {padding: 0 20px;    }
    .ts-header {
        grid-template-columns: 1fr;
        gap: 20px;
        padding: 28px 24px 28px 28px;
    }
    .ts-featured-wrap,
    .ts-grid-wrap,
    .ts-bottom-wrap {padding: 0 20px;    }
}

@media (max-width: 480px) {
    .ts-header {padding: 24px 20px 24px 24px;    }
    .ts-header::before {
        font-size: 8px;
        padding: 7px 12px 8px;
    }
}
/*---------------------------------------------------
   7. AF. Secretary Tasks
-----------------------------------------------------*/
.tc-wrap { padding-bottom: 40px; }

.tc-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
    flex-wrap: wrap;
    gap: 12px;
}
.tc-header__title {
    color: var(--color-footer-top);
    font-size: 1.2rem;
    font-weight: 800;
    margin: 0;
}
.tc-header__sub {
    color: var(--grey-color-dark);
    font-size: 1rem;
    margin-top: 3px;
}

.tc-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 20px;
}

.tc-stat {
    background: var(--white-color);
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-sm);
    padding: 14px 16px;
    display: flex; align-items: center; gap: 12px;
    box-shadow: 0 1px 4px rgba(0,0,0,.04);
}

.tc-stat__icon {
    width: 60px;
    height: 60px;
    border-radius: var(--radius-xs);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.tc-stat__num { font-size: 2rem; font-weight: 800; line-height: 1; }
.tc-stat__lbl { color: var(--grey-color-dark); font-size: 1rem; margin-top: 3px; font-weight: 500; }

.tc-stat--amber .tc-stat__icon { background: #FAEEDA; color: #BA7517; }
.tc-stat--amber .tc-stat__num  { color: #BA7517; }
.tc-stat--red   .tc-stat__icon { background: #FCEBEB; color: #A32D2D; }
.tc-stat--red   .tc-stat__num  { color: #A32D2D; }
.tc-stat--green .tc-stat__icon { background: #EAF3DE; color: var(--primary-color); }
.tc-stat--green .tc-stat__num  { color: var(--primary-color); }
.tc-stat--blue  .tc-stat__icon { background: #E6F1FB; color: #185FA5; }
.tc-stat--blue  .tc-stat__num  { color: #185FA5; }

.tc-layout { display: grid; grid-template-columns: 1fr 300px; gap: 16px; align-items: start; }

.tc-card {
    background: var(--white-color);
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-sm);
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(0,0,0,.04);
}

.tc-toolbar {
    background: var(--grey-color-xlight);
    gap: 10px;
    padding: 14px 16px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--grey-color-light);
    flex-wrap: wrap;
}

.tc-search-wrap { position: relative; flex: 1; min-width: 180px; }
.tc-search-wrap > svg {
    color: var(--grey-color);
    left: 10px; top: 50%;
    position: absolute;
    transform: translateY(-50%);
    pointer-events: none; }

.tc-search {
    background: var(--white-color);
    color: var(--black-base);
    font-size: 1rem;
    width: 100%;
    height: 34px;
    padding: 0 12px 0 32px;
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    transition: var(--transition-all-fast);
}

.tc-search:focus { outline: none; /*border-color: var(--color-footer-top);*/ }

.tc-filter-tabs { display: flex; gap: 4px; }

.tc-filter-tab {
    background: var(--white-color);
    color: var(--grey-color-dark);
    font-size: .8rem;
    font-weight: 600;
    height: 30px;
    padding: 0 12px;
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    cursor: pointer;
    transition: var(--transition-all-fast);
    white-space: nowrap;
}

.tc-filter-tab:hover {
    border-color: var(--color-footer-top);
    color: var(--color-footer-top);
}
.tc-filter-tab--active {
    background: var(--color-footer-top);
    color: var(--white-color);
    border-color: var(--color-footer-top);
}

.tc-item {
    display: flex; align-items: flex-start; gap: 12px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--grey-color-light);
    transition: background var(--transition-all-fast);
}

.tc-item:last-child { border-bottom: none; }
.tc-item:hover { background: var(--grey-color-xlight); }
.tc-item--done { opacity: 0.5; }

.tc-item__priority {
    width: 4px;
    min-height: 44px;
    border-radius: 2px;
    flex-shrink: 0;
    margin-top: 3px;
}
.tc-item__priority--high   { background: #A32D2D; }
.tc-item__priority--medium { background: #BA7517; }
.tc-item__priority--low    { background: #185FA5; }

.tc-item__icon {
    width: 40px;
    height: 40px;
    border-radius: var(--radius-xs);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-top: 3px;
}
.tc-item__icon--call     { background: #FCEBEB; color: #A32D2D; }
.tc-item__icon--doctor   { background: #EEEDFE; color: #534AB7; }
.tc-item__icon--reminder { background: #EAF3DE; color: var(--primary-color); }
.tc-item__icon--general  { background: #F1EFE8; color: #5F5E5A; }

.tc-item__body { flex: 1; min-width: 0; }

.tc-item__title {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 600;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.tc-item--done .tc-item__title { text-decoration: line-through; }

.tc-item__meta {
    display: flex; align-items: center; gap: 8px;
    flex-wrap: wrap; margin-top: 5px;
}

.tc-item__note {
    color: var(--grey-color-dark);
    font-size: 1rem;
    margin-top: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tc-tag {
    font-size: .8rem;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: var(--radius-xs);
    white-space: nowrap;
}
.tc-tag--call     { background: #FCEBEB; color: #501313; }
.tc-tag--doctor   { background: #EEEDFE; color: #26215C; }
.tc-tag--reminder { background: #EAF3DE; color: #085041; }
.tc-tag--general  { background: #F1EFE8; color: #444441; }

.tc-tag--overdue {
    font-size: .9rem;
    font-weight: 700;
    color: #A32D2D;
    display: inline-flex;
    align-items: center;
    gap: 3px;
}

.tc-tag--date {
    color: var(--grey-color-dark);
    font-size: .9rem;
    font-weight: 500;
}
.tc-tag--person {
    color: var(--color-footer-top);
    font-size: .9rem;
}

.tc-item__actions {
    display: flex;
    gap: 4px;
    align-items: center;
    flex-shrink: 0;
}

.tc-action-btn {
    background: var(--white-color);
    color: var(--grey-color-dark);
    width: 32px;
    height: 32px;
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; transition: var(--transition-all-fast);
}

.tc-action-btn--done:hover  { background: #EAF3DE; color: var(--primary-color); border-color: var(--primary-color); }
.tc-action-btn--cancel:hover { background: #FAEEDA; color: #BA7517; border-color: #BA7517; }
.tc-action-btn--del:hover   { background: #FCEBEB; color: #A32D2D; border-color: #A32D2D; }

.tc-empty {
    color: var(--grey-color);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 48px 20px;
}
.tc-empty p { color: var(--grey-color-dark); font-size: 1rem; }

.tc-quick-card {
    background: var(--white-color);
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-sm);
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(0,0,0,.04);
    position: sticky; top: 20px;
}

.tc-quick-head {
    background: var(--grey-color-xlight);
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 700;
    gap: 8px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--grey-color-light);
    display: flex;
    align-items: center;
}

.tc-quick-body { padding: 16px; }


.tc-q-field { margin-bottom: 14px; }
.tc-q-label {
    color: var(--grey-color-dark);
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 6px;
    display: block;
}
.tc-q-req   { color: #A32D2D; }
.tc-q-opt   { color: var(--grey-color); font-weight: 400; }

.tc-q-input {
    background: var(--white-color);
    color: var(--black-base);
    font-size: .9rem;
    width: 100%;
    height: 36px;
    padding: 0 10px;
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    transition: var(--transition-all-fast);
}

.tc-q-input:focus { outline: none; border-color: var(--color-footer-top); }

.tc-q-select-wrap { position: relative; display: flex; align-items: center; }
.tc-q-select-wrap > svg { position: absolute; right: 10px; pointer-events: none; color: var(--grey-color); }
.tc-q-select { appearance: none; padding-right: 28px; cursor: pointer; }

.tc-q-textarea {
    background: var(--white-color);
    color: var(--black-base);
    font-size: .9rem;
    width: 100%;
    padding: 8px 10px;
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    resize: vertical;
    min-height: 70px;
    transition: var(--transition-all-fast);
}

.tc-q-textarea:focus { outline: none; border-color: var(--color-footer-top); }

.tc-type-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }

.tc-type-btn {
    background: var(--white-color);
    color: var(--grey-color-dark);
    font-size: .9rem;
    font-weight: 600;
    padding: 7px 6px;
    border: 1px solid var(--grey-color-light);
    border-radius: var(--radius-xs);
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 5px;
    justify-content: center;
    transition: var(--transition-all-fast);
}

.tc-type-btn:hover { border-color: var(--color-footer-top); color: var(--color-footer-top); }
.tc-type-btn--active { background: var(--grey-color-light); color: var(--color-footer-top); border-color: var(--color-footer-top); }

.tc-pri-row { display: flex; gap: 6px; }

.tc-pri-btn {
    font-size: .9rem;
    font-weight: 700;
    border-radius: var(--radius-xs);
    flex: 1; height: 30px;
    cursor: pointer;
    border: 1px solid transparent;
    transition: var(--transition-all-fast);
    opacity: 0.45;
}

.tc-pri-btn--active { opacity: 1; }

.tc-pri-btn--high   { background: #FCEBEB; color: #501313; border-color: #F09595; }
.tc-pri-btn--medium { background: #FAEEDA; color: #412402; border-color: #EF9F27; }
.tc-pri-btn--low    { background: #E6F1FB; color: #042C53; border-color: #85B7EB; }

.msg-secretary-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    cursor: pointer;
    transition: var(--transition-all-fast);
    border-left: 3px solid transparent;
}
.msg-secretary-item:hover { background: #fafafa; }
.msg-secretary-item.active {
    background: var(--white-color)5f4;
    border-left-color: var(--primary-color);
}

/* ── Doctor Calendar ────────────────────────────────────────────────── */
.appt-step-bar {
    display: flex;
    align-items: flex-start;
    margin-bottom: 20px;
}

.appt-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
}

.appt-step-circle {
    background: var(--grey-color-xlight);
    color: var(--grey-color);
    font-size: 1rem;
    font-weight: 700;
    width: 36px;
    height: 36px;
    border-radius: var(--radius-circle);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: var(--transition-all-fast);
}

.appt-step-circle.active {
    background: var(--white-color);
    color: var(--primary-color);
    border: 2px solid var(--primary-color);
}

.appt-step-circle.done {
    background: var(--primary-color);
    color: var(--white-color);
    border: none;
}

.appt-step-label {
    color: var(--grey-color-dark);
    font-size: .9rem;
    font-weight: 600;
    white-space: nowrap;
    transition: var(--transition-color);
}

.appt-step-label.active {color: var(--primary-color);}

.appt-step-label.done {color: var(--primary-color);}

.appt-step-line {
    flex: 1;
    height: 2px;
    margin: 18px 6px 0;
    background: var(--grey-color-light);
    transition: var(--transition-all-fast);
}

.appt-step-line.done {background: var(--primary-color);}

.appt-section-head {
    background: var(--white-color);
    margin-bottom: 14px;
    padding: 12px 16px;
    border-radius: var(--radius-sm);
    border-left: 3px solid var(--primary-color);
    display: flex;
    align-items: center;
    gap: 10px;
}

.appt-section-head svg {
    color: var(--primary-color);
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}

.appt-section-head span {
    color: var(--color-footer-top);
    font-size: 1rem;
    font-weight: 600;
}

.appt-section-head small {
    color: var(--grey-color-dark);
    font-size: 1rem;
    margin-left: auto;
}

.appt-for-toggle {
    display: flex;
    gap: 8px;
    margin-bottom: 12px;
}

.appt-for-btn {
    background: var(--white-color);
    color: var(--grey-color-dark);
    font-size: 1rem;
    font-weight: 600;
    border: 1.5px solid var(--grey-color-light);
    border-radius: var(--radius-sm);
    flex: 1;
    padding: 12px;
    text-align: center;
    cursor: pointer;
    transition: var(--transition-all-fast);
}

.appt-for-btn.active {
    background: rgba(var(--primary-opacity), .08);
    color: var(--primary-color);
    border-color: var(--primary-color);
}

.appt-cal {
    background: var(--white-color);
    border-radius: var(--radius-md);
    padding: 16px;
    margin-bottom: 10px;
}

.appt-cal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}

.appt-cal-head span {
    color: var(--black-color);
    font-size: 1rem;
    font-weight: 700;
}

.appt-cal-nav {
    background: var(--grey-color-xlight);
    color: var(--grey-color-dark);
    border: 1.5px solid var(--grey-color-light);
    border-radius: var(--radius-circle);
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    cursor: pointer;
    user-select: none;
    transition: var(--transition-all-fast);
}

.appt-cal-nav:hover {
    background: var(--primary-color);
    border-color: var(--primary-color);
    color: var(--white-color);
}

.appt-cal-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
}

.appt-cal-dname {
    color: var(--grey-color-dark);
    font-size: .9rem;
    font-weight: 700;
    text-align: center;
    padding: 4px 0;
}

.appt-cal-day {
    color: var(--black-color);
    font-size: .9rem;
    font-weight: 400;
    aspect-ratio: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-xs);
    gap: 3px;
    cursor: pointer;
    transition: var(--transition-all-fast);
}

.appt-cal-day {
    width: 45px;
    height: 45px;
}

.appt-cal-day:hover:not(.disabled):not(.empty) {
    background: var(--primary-shadow-hover);
    color: var(--primary-color);
}

.appt-cal-day.today {
    background: var(--primary-shadow-hover);
    color: var(--primary-color);
    font-weight: 600;
}

.appt-cal-day.selected {
    background: var(--primary-color);
    color: var(--white-color);
    font-weight: 700;
}

.appt-cal-day.disabled {
    color: var(--grey-color-light);
    cursor: default;
}

.appt-cal-day.empty {cursor: default;}

.appt-cal-dot {
    background: var(--primary-color);
    border-radius: var(--radius-circle);
    width: 4px;
    height: 4px;
}

.appt-cal-day.selected .appt-cal-dot {background: rgba(255, 255, 255, .7);}

.appt-cal-day.disabled .appt-cal-dot,
.appt-cal-day.empty .appt-cal-dot {display: none;}

.appt-slots-section {
    border-top: 1px solid var(--grey-color-xlight);
    margin-top: 14px;
    padding-top: 14px;
}

.appt-slots-label {
    color: var(--grey-color-dark);
    font-size: 1rem;
    margin-bottom: 10px;
}

.appt-slots-label b {color: var(--primary-color);}

.appt-slots {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.appt-slot {
    background: var(--white-color);
    color: var(--black-color);
    font-size: .9rem;
    font-weight: 500;
    border: 1.5px solid var(--grey-color-light);
    border-radius: 20px;
    padding: 8px 16px;
    cursor: pointer;
    transition: var(--transition-all-fast);
}

.appt-slot:hover:not(.busy) {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.appt-slot.selected {
    background: var(--primary-color);
    color: var(--white-color);
    font-weight: 700;
    border-color: var(--primary-color);
}

.appt-slot.busy {
    background: var(--grey-color-xlight);
    color: var(--grey-color-light);
    border-color: var(--grey-color-xlight);
    text-decoration: line-through;
    cursor: default;
}

.appt-slots-loading {
    color: var(--grey-color-dark);
    font-size: 0.85rem;
    padding: 8px 0;
}

.appt-summary {
    background: var(--primary-color-extra-light);
    border-radius: var(--radius-md);
    padding: 14px 16px;
    margin-bottom: 14px;
    display: none;
    align-items: center;
    gap: 12px;
}

.appt-summary.visible {display: flex;}

.appt-summary svg {
    color: var(--primary-color);
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.appt-summary-text {
    color: var(--black-color);
    font-size: 1rem;
    font-weight: 700;
}

.appt-summary-sub {
    color: var(--primary-color-dark);
    font-size: .92rem;
    margin-top: 3px;
}

.appt-child-section {display: none;}

/* ── RESPONSIVE ────────────────────────────────────────────────── */
@media (max-width: 900px) {
    .tc-stats  { grid-template-columns: 1fr 1fr; }
    .tc-layout { grid-template-columns: 1fr; }
    .tc-quick-card { position: static; }
}

@keyframes pcSpin {
    to { transform: rotate(360deg); }
}


/*===================================================
   END OF MORE CONTAINER
=====================================================*/

/*===================================================
   8. FOOTER
=====================================================*/
#footer {
	background: linear-gradient(160deg, #071410 0%, #0a1a12 60%, #0d2218 100%) !important;
	/*min-height: 405px;
	padding-top: 2rem;
	padding-bottom: 3.5rem;*/
	position: relative;
    overflow: hidden;
	z-index: var(--z-low);
}

.ft-deco {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    z-index: 0;
}

.ft-deco-1 {
    width: 420px;
    height: 420px;
    bottom: -180px;
    left: -120px;
    border: 1px solid rgba(86,190,146,0.1);
}

.ft-deco-1::after {
    content: '';
    position: absolute;
    inset: 40px;
    border-radius: 50%;
    border: 1px solid rgba(86,190,146,0.06);
}

.ft-deco-2 {
    width: 280px;
    height: 280px;
    top: -80px;
    right: -60px;
    border: 1px solid rgba(86,190,146,0.08);
}

.ft-deco-2::after {
    content: '';
    position: absolute;
    inset: 30px;
    border-radius: 50%;
    border: 1px solid rgba(86,190,146,0.05);
}

.ft-deco-3 {
    width: 160px;
    height: 160px;
    top: 40%;
    right: 38%;
    border: 1px solid rgba(86,190,146,0.04);
}

.ft-contact-bar,
.ft-main,
.ft-bottom {
    position: relative;
    z-index: 1;
}

/* ── İLETİŞİM ŞERİDİ ── */
.ft-contact-bar {
    background: #0d1f16;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

.ft-cb-inner {
    display: flex;
    align-items: stretch;
}

.ft-cb-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 18px 28px;
    border-right: 1px solid rgba(255,255,255,0.05);
    flex: 1;
    transition: background .2s;
}

.ft-cb-item:first-child {padding-left: 0;}

.ft-cb-item:hover {background: rgba(86,190,146,0.04);}

.ft-cb-icon {
    color: var(--primary-color);
    font-size: 1rem;
    flex-shrink: 0;
}

.ft-cb-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.ft-cb-text:hover .ft-cb-label {color: var(--white-color);}
.ft-cb-text:hover .ft-cb-val {color: var(--primary-color);}

.ft-cb-label {
    color: var(--primary-color);
    font-size: 1rem;
    font-weight: 600;
}

.ft-cb-val {
    color: var(--white-color);
    font-size: .9rem;
    font-weight: 500;
    max-width: 200px;
    text-decoration: none;
    transition: color .2s;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
}

.ft-cb-val:hover {color: var(--primary-color);}

.ft-cb-socials {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 18px 0 18px 20px;
    flex-shrink: 0;
}

.ft-cb-si {
    color: var(--grey-color-light);
    font-size: 1rem;
    width: 35px;
    height: 35px;
    border-radius: var(--radius-xl);
    border: 1px solid var(--primary-color-dark);
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: border-color .2s, color .2s, background .2s;
}

.ft-cb-si:hover {
    color: var(--primary-color);
    background: rgba(86,190,146,0.08);
    border-color: var(--primary-color);
}

.ft-main {padding: 60px 0 52px;}

.ft-body {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: end;
}

.am-footer-logo {
    padding-bottom:18px;
    display: flex;
    align-items: center;
    gap: 7px;
    text-decoration: none;
}

.am-footer-logo-img {
    height: 80px;
    width: auto;
    transition: transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.am-footer-logo:hover .am-footer-logo-img {
    transform: rotate(360deg) scale(1.15);
}


.am-footer-logo:hover .am-logo-img {
    transform: rotate(360deg) scale(1.15);
}
.am-footer-logo-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.am-footer-logo-title {
    color:var(--primary-color);
    font-size: 2rem;
    font-weight: 900;
    line-height: 1.2;
}

.am-footer-logo-anka {color: var(--secondary-color);}

.am-footer-logo-sub {
    color: var(--primary-color);
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.3;
}


.ft-big-white {color: var(--white-color);}
.ft-big-green {color: var(--primary-color);}

.ft-tagline {
    color: var(--grey-color-deep);
    font-size: 1rem;
    line-height: 1.75;
    margin-bottom: 28px;
    max-width: 400px;
}

.ft-wh-pill {
    background: var(--primary-shadow);
    border: 1px solid var(--primary-button-hover);
    display: inline-flex;
    align-items: center;
    gap: 10px;
    border-radius: 100px;
    padding: 9px 20px;
}

.ft-wh-dot {
    background: var(--primary-color);
    width: 7px;
    height: 7px;
    border-radius: var(--radius-circle);
    flex-shrink: 0;
}

.ft-wh-label {
    color: var(--white-color);
    font-size: .9rem;
    font-weight: 600;
}

.ft-wh-sep {color: rgba(255,255,255,0.15);}

.ft-wh-val {
    color: var(--primary-color);
    font-size: .9rem;
    font-weight: 600;
}

.ft-right {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: 40px;
    align-items: start;
}

.ft-col-title {
    color: var(--primary-color);
    font-size: 1.2rem;
    font-weight: 800;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.ft-col-title::after {
    background: var(--primary-color);
    content: '';
    flex: 1;
    height: 1px;
}

.ft-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.ft-list li a {
    color: var(--grey-color-light);
    font-size: 1rem;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: color .2s;
}

.ft-list li a::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: var(--radius-circle);
    background: var(--primary-color);
    opacity: .5;
    flex-shrink: 0;
    transition: opacity .2s;
}

.ft-list li a:hover {color: var(--primary-color);}

.ft-list li a:hover::before {opacity: 1;}

.ft-bulten-desc {
    color: var(--grey-color-deep);
    font-size: 1rem;
    line-height: 1.8;
    margin-bottom: 16px;
}

.ft-bulten-form {
    display: flex;
    border-radius: var(--radius-xl);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,0.1);
}

.ft-bulten-input {
    color:var(--white-color);
    font-size: 1rem;
    background: rgba(255,255,255,0.05);
    border: none;
    padding: 13px 15px;
    flex: 1;
    outline: none;
    min-width: 0;
}

.ft-bulten-input::placeholder {color: rgba(255,255,255,0.22);}

.ft-bulten-btn {
    color: var(--white-color);
    background: var(--primary-color);
    font-size: 1rem;
    border: none;
    padding: 13px 20px;
    cursor: pointer;
    transition: background .2s;
    flex-shrink: 0;
}

.ft-bulten-btn:hover {background: var(--primary-button-hover);}

.ft-bulten-msg {
    margin-top: 10px;
    font-size: 12px;
    color: var(--primary-color);
}

.ft-bottom {
    border-top: 1px solid rgba(255,255,255,0.05);
    padding: 18px 0;
}

.ft-bottom-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.ft-copy {color: var(--grey-color-xdark); font-size: 1rem;}
.ft-copy a {color: var(--primary-color); text-decoration: none; transition: color .2s;}
.ft-copy a:hover{color: var(--secondary-color);}
.ft-design {color: var(--grey-color-xdark); font-size: 1rem;}
.ft-design a {color: var(--primary-color); text-decoration: none;}
.ft-design a:hover{color: var(--secondary-color);}

.ft-copy a span{color: var(--secondary-color);}



/* ── RESPONSIVE ── */
@media (max-width: 1100px) {
    /*.ft-cb-val {max-width: 140px;}*/
    .ft-cb-item {padding: 16px 18px;}
}

@media (max-width: 960px) {
    .ft-cb-inner {flex-wrap: wrap;    }
    .ft-cb-item {flex: 0 0 calc(50% - 1px); border-bottom: 1px solid rgba(255,255,255,0.05);    }
    .ft-cb-item:first-child {padding-left: 16px;    }
    .ft-cb-socials {
        width: 100%;
        padding: 14px 16px;
        border-top: 1px solid rgba(255,255,255,0.05);
        justify-content: center;
    }
    .ft-body {grid-template-columns: 1fr; gap: 48px;    }
    .ft-big-title {font-size: 40px;}
}

@media (max-width: 600px) {
    .ft-main {padding: 44px 0 40px;    }
    .ft-cb-item {flex: 0 0 100%;    }
    .ft-right {grid-template-columns: 1fr; gap: 32px;    }
    .ft-big-title {font-size: 32px;}
    .ft-bottom-inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
    }
}
/*-------------------------------------------------
    8.A Working Hours
---------------------------------------------------*/
.working-hours__start {
	position: relative;
	display: flex;
	align-items: center;
}
@media (max-width: 768px) {
    .working-hours__start{justify-content: center;}
}
.working-hours__start .wh-icon {
	position: relative;
	display: inline-block;
	padding-right: 2rem;
}
.working-hours__start .wh-icon::before {
	background-color: rgba(var(--white-opacity),.1);
	content: "";
	position: absolute;
	top: 2px;
	bottom: 8px;
	right: 0;
	width: 1px;
}
.working-hours__start .wh-icon img {
	width: 64px;
	height: auto;
	position: relative;
	transition: transform 500ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
	transition-delay: 0.1s;
	will-change: transform;
}
.working-hours__start .wh-icon:hover img {
	transform: scale(0.875);
}

.working-hours__start .wh-text {
	position: relative;
	display: block;
	margin-left: 2rem;
}
.working-hours__start h4{
	color: var(--white-color);
	font-weight: 500;
	font-size: 1.375rem;
	margin: 0;
	gap: .25rem;
	justify-content: center;
	align-items: center;
	display: flex;
	flex-direction: column;
}
.working-hours__start h4 span:not(:first-child) {
	font-size: 1rem;
	font-weight: 400;
	color: var(--color-footer-text);
	margin-left: .75rem;
}
/*---------------------------------------------------
   8.B Social Media
-----------------------------------------------------*/
.social-media__end {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: end;
}
.social-media__end h5{
	color: var(--white-color);
	font-weight: 500;
	font-size: 1.125rem;
	margin: 0;
}
.social-media__end h5{
	color: var(--white-color);
	font-weight: 500;
	font-size: 1.125rem;
	margin: 0;
}
/*.social-media__end h5::after{
	content: " :";
	margin-right: 4px;
}*/
@media (min-width: 1199.99px) {
    .social-media__end h5::after,
    .working-hours__start span:first-child::after {
        content: " :";
    }
}

ul.social-media{
	list-style: none;
	padding: 0;
	margin:0 0 0 .75rem;
	display: flex;
	align-items: center;
}
ul.social-media li{
	margin-right: 5px !important;
	padding: 0 !important;
	border:none;
	outline:none;
	position:relative;
	z-index:var(--z-0);
	cursor:pointer;
	display:inline-block;
}
ul.social-media li:last-child{margin-right:0 !important;}

ul.social-media li:hover::before {
	background:var(--white-color);
	box-shadow:none;
	opacity:1;
	transform:scale(0.7)
}
ul.social-media li::before {
	background:none;
	border-radius:var(--radius-circle);
	content:'';
	display:block;
	position:absolute;
	top:-10px;
	right:-10px;
	bottom:-10px;
	left:-10px;
	opacity:0;
	z-index:var(--z-minus);
	box-sizing:border-box;
	transform:scale(0);
	transition-property:transform, opacity;
	transition-duration:.25s;
	transition-timing-function:cubic-bezier(0.4,0.0,0.2,1);
}
ul.social-media li a {
	background-color:var(--color-social-bg);
	font-size: 1rem !important;
	color:var(--white-color);
	/*line-height: 40px !important;*/
	border-radius: var(--radius-full);
	text-align: center;
	margin: 0 !important;
	padding: 0 !important;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: var(--transition-all-fast);
}
ul.social-media li:hover a:hover{color: var(--white-color);}

ul.social-media li[att*="facebook"]:hover a{
	background-color: transparent;
	color:var(--facebook) !important;
}
ul.social-media li[att*="facebook"]:hover::before{border:2px solid var(--facebook);}

[att="twitter"]  svg{fill:var(--white-color);}
ul.social-media li[att*="twitter"]:hover a {
	background-color: transparent;
	color:var(--black-color) !important;
}
ul.social-media li[att*="twitter"]:hover a svg{
	fill:var(--black-color) !important;
}
ul.social-media li[att*="twitter"]:hover::before{border:2px solid var(--black-color);}

ul.social-media li[att*="instagram"]:hover a {
	background-color: transparent;
	color:var(--instagram) !important;
}
ul.social-media li[att*="instagram"]:hover::before{border:2px solid var(--instagram);}

ul.social-media li[att*="google"]:hover a {
	background-color: transparent;
	color:var(--youtube) !important;
}
ul.social-media li[att*="google"]:hover::before{border:2px solid var(--youtube);}

ul.social-media li[att*="linkedin"]:hover a {
	background-color: transparent;
	color:var(--linkedin) !important;
}
ul.social-media li[att*="linkedin"]:hover::before{border:2px solid var(--linkedin);}

ul.social-media li[att*="youtube"]:hover a {
	background-color: transparent;
	color:var(--youtube) !important;
}
ul.social-media li[att*="google"]:hover::before{border:2px solid var(--youtube);}
/*---------------------------------------------------
   8.C Title
-----------------------------------------------------*/
.foot-title{
	font-size: 1.375rem;
	font-weight: 600;
	color: var(--white-color);
	line-height: 1.5;
	padding-bottom: .25rem;
	margin-bottom: 1rem;
	position: relative;
}
/* beklet
.foot-title::after {
	background: var(--primary-background) none repeat scroll 0 0;
	content: "";
	border-radius:var(--radius-lg);
	display: block;
	height: 4px;
	width: 30px;
	position: absolute;
	bottom: 0;
	transition: var(--transition-all-fast);
}
.foot-title:hover::after {width:50px;}
*/
/*-------------------------------------------------
    8.D Logo, Site Name, Address...
---------------------------------------------------*/
.footer-branding {text-align: center;}

.footer-branding__logo-wrap {
	display: flex;
	align-items: end;
	justify-content: center;
	gap: 0.5rem;
	margin-bottom: .5rem;
}
.footer-branding__title-pre {
	font-family: var(--fourth-font), sans-serif;
	font-size: 1.375rem;
	font-weight: 500;
	color: var(--secondary-color);
	white-space: nowrap;
}
.footer-branding__logo {
	transition: var(--transition-transform);
}
.footer-branding:hover .footer-branding__logo {
	transform: rotateY(180deg);
}
.footer-branding__img {
	max-width: 95px;
}
.footer-branding__title {
	font-family: var(--secondary-font), sans-serif;
	font-size: 1.55rem;
	font-weight: 600;
	color: var(--primary-color);
	line-height: 1.3;
	display: block;
}
.footer-branding__subtitle {
	font-family: var(--tertiary-font), sans-serif;
	font-size: .9rem;
	font-weight: 500;
	color: var(--secondary-color);
	display: block;
}
.footer-branding__desc {
	color: var(--white-color);
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.3;
	margin-top: 1rem;
}

/*-------------------------------------------------
    8.E Lists
---------------------------------------------------*/
ul.foot-list li{line-height: 1;}
ul.foot-list li a {
	color:var(--color-footer-text);
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.4;
	display: inline-block;
	position: relative;
	transition: var(--transition-color);
}
ul.foot-list li a:before {
	background:var(--primary-background);
	border-radius: var(--radius-lg);
	content: "";
	width: 0;
	height: 1px;
	display: inline-block;
	position: absolute;
	right: 0;
	bottom: 0;
	transition: var(--transition-width-linear);
}
ul.foot-list li a:hover {color:var(--primary-color);}
ul.foot-list li a:hover:before {
	width: 100%;
	left: 0;
	right: auto;
}
ul.foot-list li:not(:last-child) {margin-bottom:7px;}
/*-------------------------------------------------
    8.F Contact
---------------------------------------------------*/
.footer-contact{}
.footer-contact__item{
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0 0 15px;
    transition: var(--transition-all);
    text-wrap: wrap;
}
.footer-contact__item:last-child{margin-bottom: 0;}

.footer-contact__item a{color:var(--white-color);}
.footer-contact__item a:hover{color:var(--primary-color);}

.footer-contact__item:hover .footer-contact__icon span:before {transform: scale(1);}
.footer-contact__item:hover .footer-contact__icon i{ color:var(--white-color);}
.footer-contact__item:hover .footer-contact__info p{ color:var(--primary-color);}

.footer-contact__item i {
    font-size: 1.125rem;
    color: var(--primary-color);
    text-align: center;
    line-height: 50px;
    border-radius: var(--radius-circle);
    width: 50px;
    height: 50px;
}

.footer-contact__info {
    display: block;
    text-align: left;
    word-wrap: break-word;
}

.footer-contact__info h4{
    font-size: 1rem;
    font-weight: 400;
    color: var(--color-footer-text);
    line-height: 1.2;
    margin: 0 0 .25rem;
}

.footer-contact__info p{
    font-size: 1rem;
    font-weight: 400;
    color: var(--white-color);
    line-height: 1.2;
    margin: 0;
    padding: 0;
    transition: all var(--transition-medium);
    text-wrap: wrap;
    word-break: break-word;
}

.footer-contact__icon{
    flex-shrink: 0;
    padding-right: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.footer-contact__icon span{
    background-color: var(--color-contact-bg);
    border-radius: var(--radius-circle);
    display: inline-block;
    position: relative;
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    transform: translateZ(0);
    backface-visibility: hidden;
    transition-property: color;
    transition-duration: 0.3s;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.footer-contact__icon span:before {
    background: var(--primary-background);
    content: "";
    border: 2px solid var(--primary-color-dark);
    border-radius: var(--radius-circle);
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: var(--z-minus);
    transform: scale(0);
    transition: var(--transition-transform-fast);
}

.footer-contact__icon:hover,
.footer-contact__icon:focus,
.footer-contact__icon:active {
    color: var(--primary-color);
}

.footer-contact__icon:hover:before,
.footer-contact__icon:focus:before,
.footer-contact__icon:active:before {
    transform: scale(1);
}

.footer-contact__icon:hover i {
    color: var(--primary-color);
}

/*-------------------------------------------------
    8.G Newsletter
---------------------------------------------------*/
.bulten-content {
	position: relative;
	z-index: var(--z-low);
}
.bulten-info{
	color:var(--color-footer-text);
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	margin-bottom: 1.5rem;
}
.bulten-info > p {margin: 0;}
.bulten-info > p > b,
.bulten-info > p > strong {font-weight: 600;}

.bulten-info h3{
	font-size:1.5rem;
	font-weight: 300;
	margin-bottom: 10px;
}
.bulten-info span{
	font-weight: bold;
	line-height: 1.6rem;
	margin-bottom: 0;
}

.bulten-form input {
	background-color:transparent;
	color:var(--color-footer-text);
	font-size: 1rem;
	font-weight: 300;
	border: 2px solid var(--color-footer-border);
	border-radius:var(--radius-xl);
	width: 100%;
	height: 60px;
	padding: 0 20px;
	outline: 0;
	transition: var(--transition-all-medium);
}
.bulten-form input:active,
.bulten-form input:focus{
	border-color:var(--primary-border-color);
	color:var(--primary-color);
}

.bulten-form ::placeholder {color:rgba(var(--white-color),.9);}            /* Firefox */
.bulten-form :-ms-input-placeholder {color:rgba(var(--white-color),.9);}   /* Internet Explorer 10-11 */
.bulten-form ::-ms-input-placeholder {color:rgba(var(--white-color),.9);}  /* Microsoft Edge */

.bulten-content .bulten-form button {
	background-color:var(--primary-background);
	color:var(--white-color);
	font-size: 1rem;
	border: none;
	border-radius: var(--radius-circle);
	position: absolute;
	right:7px;
	bottom: 8px;
	height: 45px;
	width: 45px;
	line-height: 45px;
	transition: var(--transition-fast);
}
.bulten-content .bulten-form button:hover {background-color:var(--primary-color-dark);}
.bulten-content .bulten-form button i{color:var(--white-color);}
/*-------------------------------------------------
    8.H Copyright & Design
---------------------------------------------------*/
.copyright{width: 100%;}
.copyright a,
.design-info a{
	color:var(--primary-color);
	position: relative;
}
.copyright a:before,
.design-info a:before{
	background: var(--primary-background);
	border-radius: var(--radius-lg);
	content: "";
	width: 0;
	height: 1px;
	display: inline-block;
	position: absolute;
	right: 0;
	bottom: 0;
	transition: var(--transition-width-linear);
}
.copyright a:hover:before,
.design-info a:hover:before{
	width: 100%;
	left: 0;
	right: auto;
}
.copyright a:hover,
.design-info a:hover{
	color:var(--primary-color);
	text-decoration: none;
}
/*---------------------------------------------------
   8.I Scroll Up/ Down
-----------------------------------------------------*/
.scroll-up {
	color: transparent;
	font-size: 0;
	text-align: center;
	text-decoration: none;
	line-height: 2rem;
	border-radius:var(--radius-circle);
	width:40px;
	height:40px;
	padding: 0;
	margin-right: 0 !important;display: flex;align-items: center;justify-content: center;
	position: fixed;
	right: 25px !important;
	bottom: 50px;
	z-index: var(--z-float);
	opacity: 1 !important;
	box-shadow: 0 0 0 3px var(--primary-background);
	transition: var(--transition-all-medium);
}
.scroll-up::before {
	background: var(--primary-background) none repeat scroll 0 0;
	content: "";
	border-radius:var(--radius-circle);
	width: 100%;
	height: 100%;
	padding: 2px;
	position: absolute;
	top: -2px;
	left: -2px;
	z-index: var(--z-minus);
	opacity: 1;
	pointer-events: none;
	box-sizing: content-box;
	transition: var(--transition-transform-faster), var(--transition-opacity-ease);
}
.scroll-up::after {
	font-family: "Font Awesome 5 Pro", serif;
	color: var(--white-color);
	font-weight: 300;
	font-size: 1.25rem;
	/*line-height: 2.375;*/
	content: "\f176";
	transition: all 0.4s ease 0s;
}
.scroll-up:hover {box-shadow: 0 0 0 2px var(--primary-background);}
.scroll-up:hover::before {
	opacity: 0;
	transform: scale(1.3);
}
.scroll-up:hover::after {color: var(--primary-color);}
/*===================================================
   END OF FOOTER
=====================================================*/

/*===================================================
   9. RESPONSIVE DESIGN
=====================================================*/

/*---------------------------------------------------
   9.A 100 x 576 (mobile)
-----------------------------------------------------*/
@media (min-width: 100px) and (max-width: 576px) {

	/*-------- Detail --------*/
    .mission-vision-wrapper{margin-top: 2rem;}
    section.timeline {
        width: auto;
        float: none;
        margin-left: 0;
        margin-right: 0;
    }
    section.timeline .timeline-box{ width: auto; !important}
    section.timeline .timeline-box.right {
        margin: 15px auto;
        max-width: 90%;
    }
	.aboutus-gallery::after{display: none;}
	#aboutus-details-content{padding: 2rem 0;}
	.breadcrumb-link{padding: 8px 15px;}
	.breadcrumb-link span,
	.breadcrumb-link a,
	.breadcrumb-link i,
	.breadcrumb-link span:not(:first-child) i {font-size: var(--font-size-md);}
	.sidebar-content,
	.am-form-comment,
	.comments{padding: 2rem;}
	/*-------- Detail --------*/

	.header-branding__title-pre{font-size: 1rem;}
	.header-branding__title{font-size: .8rem;}
	.header-branding__subtitle{font-size: .9rem;}
	.header-branding__img{max-width: 55px;}
	.header-carousel-one .owl-nav button {display: inline-block;}
	.header-topbar{display: none;}
	.header-item-right{display: none;}
	.header-carousel-one .intro-area {
		min-height: 500px;
		padding: 1rem;
	}
	.header-carousel-one .owl-nav{
		bottom: 50px;
		left: 38%;
		top: auto;
		right: auto;
	}
	.intro-area {
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
	.intro-area .intro-content h5{
		font-size:1.2rem;
		line-height: 1;!important;
	}
	.intro-area .intro-content h2{
		font-size: 1.5rem;
		line-height: 1;!important;
	}
	.intro-area .intro-content p{
		font-size: .8rem;
		line-height: 1;!important;
	}
	.shape-bottom{bottom: 12px;}
	.shape-bottom svg{height: 50px;}
	.am-btn{padding: 12px 27px;}
	.am-btn::after{height: 30px; width: 30px;}
	.section-title span{font-size: 1.3rem;}
	.about-thumbnail {
        border-radius: var(--radius-xl );
        margin-top:2rem;
    }
    .about-thumbnail.one img{margin-top: 0; }
	/*.about-thumbnail:last-child img {border-radius: 0 0 var(--radius-xl) var(--radius-xl)!important;}
	.about-thumbnail.one img{border-radius: 0 0 var(--radius-xl) var(--radius-xl);}*/
	.working-hours__start h4{
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		gap: .25rem;
	}
	.working-hours__start .wh-text{margin-left: 1rem;}
	.working-hours__start h4 span:not(:first-child){
		font-size: .9rem;
		margin-left: 0;
	}

	#aboutus{padding: 2rem 0;}
	.about-play-button{
		font-size:1.2rem;
		width: 50px;
		height: 50px;
		/*top: 20%;*/
	}
	.about-play-button.play-top {
		position: absolute;
		top: 20%;
		left: 50%;
		z-index: var(--z-low);
	}
	.about-play-button i{font-size: 1.2rem;}
	.column-modifier{align-items: unset;}
	#slider{padding: 0 0 2rem 0;}
	#online-therapy-wrapper{
		padding: 2rem 0;
		margin: unset;
	}
	#services{padding: 2rem 0;}
	#gallery{padding: 2rem 0;}
	#feedback{padding: 2rem 0;}
	.testimonial-intro{margin-bottom: 1rem;}
	#memberships{padding: 2rem 0;}
	#blogs{padding: 2rem 0;}
	.contact-form-area{margin-bottom: 0!important;}
	.contact-map{height: 550px;}
	.contact-title h2::after{font-size: 45px;}
	/*.contact-form-content {
        border-radius: 0;
		padding: 2rem;
		display: block;
		position: static;
	}*/
	.social-media__end{justify-content: center;}
	.footer-center{padding:2rem 0;}
	.foot-title{margin-top: 2rem;}
	.copyright, .design-info{text-align: center;}
}
/*---------------------------------------------------
   9.B 576 x 768 (tablet)
-----------------------------------------------------*/
@media (min-width: 576px) and (max-width: 768px) {

	/*-------- Detail --------*/

    .mission-vision-wrapper{margin-top: 2rem;}
    .mission-vision a img{
        max-width: 100%;
        height: auto !important;
    }
    section.timeline {
        width: 100%;
        margin: 0;
        float: none;
    }
    section.timeline .timeline-box,
    section.timeline .timeline-box.right {
        margin: 15px auto;
        width: 90% !important;
        float: none;
        clear: both;
    }
    .timeline .timeline-box.left .timeline-box-arrow,
    .timeline .timeline-box.right .timeline-box-arrow {display: none;}
	.aboutus-gallery::after{display: none;}
	#aboutus-details-content{padding: 2rem 0;}
	.breadcrumb-link{padding: 8px 15px;}
	.breadcrumb-link span,
	.breadcrumb-link a,
	.breadcrumb-link i,
	.breadcrumb-link span:not(:first-child) i {font-size: var(--font-size-md);}
	/*-------- Detail --------*/

	.header-branding__title-pre{font-size: 1rem;}
	.header-branding__title{font-size: .8rem;}
	.header-branding__subtitle{font-size: .9rem;}
	.header-branding__img{max-width: 55px;}
	.header-carousel-one .owl-nav button {
		display: inline-block;
		margin-left: 10px;
	}
	.header-topbar{display: none;}
	.header-item-right{display: none;}
	.header-carousel-one .intro-area {
		min-height: 500px;
		padding: 1rem;
	}
	.header-carousel-one .owl-nav{
		bottom: 25px;
		left: 40%;
		top: auto;
		right: auto;
	}
	.intro-area {
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
	.intro-area .intro-content h5{
		font-size:1.2rem;
		line-height: 1;!important;
	}
	.intro-area .intro-content h2{
		font-size: 1.5rem;
		line-height: 1;!important;
	}
	.intro-area .intro-content p{
		font-size: .8rem;
		line-height: 1;!important;
	}
	/*.shape-bottom{display: none;}*/
	.am-btn{padding: 10px 20px;}
	.am-btn::after{height: 27px; width: 27px;}
	.about-play-button i{font-size: 1.2rem;}
	.working-hours__start h4{
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		gap: .25rem;
	}
	.working-hours__start .wh-text{margin-left: 1rem;}
	.working-hours__start h4 span{
		font-size: .9rem;
		margin-left: 0;
	}

	.section-title span{font-size: 1.3rem;}
	#online-therapy-wrapper{margin: unset;}
	#aboutus{padding: 2rem 0;}
	.about-play-button{
		font-size:1.2rem;
		width: 60px;
		height: 60px;
	}
	#online-therapy-wrapper{padding: 2rem 0;}
	#services{padding: 2rem 0;}
	#gallery{padding: 2rem 0;}
	#feedback{padding: 2rem 0;}
	.testimonial-intro{margin-bottom: 1rem;}
	#memberships{padding: 2rem 0;}
	#blogs{padding: 2rem 0;}
	.contact-form-area{margin-bottom: 0!important;}
	.contact-map{height: 550px;}
	.contact-title h2::after{font-size: 45px;}
	/*.contact-form-content {
        border-radius: 0;
		padding: 2rem;
		max-width: none;
		position: static;
	}*/
	.social-media__end{justify-content: center;}
	.footer-center{padding:2rem 0;}
	.copyright, .design-info{text-align: center;}
}

/*---------------------------------------------------
   9.C 992 (medium tablet and phone)
-----------------------------------------------------*/
@media (min-width: 992px) {

    .mission-vision-wrapper{margin-top: 2rem;}
    .mission-vision a img{
        width: 100%;
        max-width: 100%;
        height: auto;
    }
    section.timeline .timeline-box {
        width: 45%;
        margin: 50px 0;
        float: none;
        clear: none;
        position: relative;
        left: 0;
        right: 0;
    }
    section.timeline .timeline-box.left {
        margin-left: 0;
        text-align: left;
    }
    section.timeline .timeline-box.right {
        margin-left: auto;
        text-align: left;
    }
    section.timeline .timeline-box.left:after,
    section.timeline .timeline-box.right:after,
    section.timeline .timeline-box.left:before,
    section.timeline .timeline-box.right:before {
        display: block;
    }
}
/*---------------------------------------------------
   9.D 768 x 1024 (medium tablet and phone)
-----------------------------------------------------*/
@media (min-width: 768px) and (max-width: 1024px) {

    /*-------- Detail --------*/

    .mission-vision-wrapper{margin-top: 2rem;}
    section.timeline {
        width: 100%;
        margin: 0;
        float: none;
    }

    section.timeline .timeline-box,
    section.timeline .timeline-box.right {
        margin: 15px auto;
        width: 90% !important;
        float: none;
        clear: both;
    }
    .timeline .timeline-box.left .timeline-box-arrow,
    .timeline .timeline-box.right .timeline-box-arrow {display: none;}
    /*-------- Detail --------*/
	.header-branding__title-pre{font-size: 1rem;}
	.header-branding__title{font-size: .8rem;}
	.header-branding__subtitle{font-size: .9rem;}
	.header-branding__img{max-width: 55px;}
	.header-carousel-one .owl-nav button.owl-next {margin-left: 10px;}
	.header-carousel-one .owl-nav button {display: inline-block;}
	.header-topbar{display: none;}
	.header-item-right{display: none;}
	.header-carousel-one .intro-area {min-height: 500px; padding: 1rem;}
	.header-carousel-one .owl-nav{
		bottom: 25px;
		left: 40%;
		top: auto;
		right: auto;
	}
	.intro-area {
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
	.intro-area .intro-content h5{font-size:1.2rem; line-height: 1;!important;}
	.intro-area .intro-content h2{font-size: 1.5rem; line-height: 1;!important;}
	.intro-area .intro-content p{font-size: .8rem; line-height: 1;!important;}

	.shape-bottom{display: none;}
	.am-btn{padding: 10px 20px;}
	.am-btn::after{height: 27px; width: 27px;}
	.header-contact{display: none;}
	.header-item-right{display: none;}
	#online-therapy-wrapper{margin: unset;}
	#aboutus{padding: 2rem 0;}
	.about-play-button{font-size:1.2rem; width: 60px; height: 60px;}

	#online-therapy-wrapper{padding: 2rem 0;}
	#services{padding: 2rem 0;}
	#gallery{padding: 2rem 0;}
	#feedback{padding: 2rem 0;}
	.testimonial-intro{margin-bottom: 1rem;}
	#memberships{padding: 2rem 0;}
	#blogs{padding: 2rem 0;}
	.contact-title h2::after{font-size: 45px;}

	.footer-center{padding:2rem 0;}
	.copyright, .design-info{text-align: center;}
}
/*---------------------------------------------------
   9.E 1024 x 1199 (large tablet and laptop)
-----------------------------------------------------*/
@media (min-width: 1024px) and (max-width: 1199px) {



	.header-carousel-one .owl-nav button.owl-next {
		margin-left:0;
		margin-top: 5px;
	}
	.about-play-button{font-size:1.2rem; width: 60px; height: 60px;}
	.header-contact{display: none;}
	.header-item-right{display: none;}
}


/*---------------------------------------------------
   9.F 1199 x 1399 (large desktop and wide monitor)
-----------------------------------------------------*/
@media (min-width: 1199px) and (max-width: 1399px) {

    .header-carousel-one .owl-nav button.owl-next {
		margin-left:0;
		margin-top: 5px;
	}
	.working-hours__start h4{flex-direction: unset;}

}

/*---------------------------------------------------
   9.G 1400 > (Larger than 1400px) (large desktop)
-----------------------------------------------------*/
@media (min-width: 1400px) {
	.header-carousel-one .owl-nav button.owl-next {
		margin-left:0;
		margin-top: 5px;
	}
	.aboutus-socialmedia {
		margin-top: 25px;
		margin-bottom: 40px;
	}
	.working-hours__start h4{flex-direction: unset;}
}
/*---------------------------------------------------
   9.H Print
-----------------------------------------------------*/
@media print {
	.no-print {
		display: none;
	}
	.content {
		width: 100%;
		margin: 0;
	}
}
/*===================================================
   END OF RESPONSIVE DESIGN
=====================================================*/

/*===================================================
   10. ANIMATIONS
=====================================================*/

/*---------------------------------------------------
   10.A Video Icon
-----------------------------------------------------*/
@keyframes video-effect{
	0%{opacity:0.4}
	40%{opacity:0.6;box-shadow:0 0 0 2px rgba(var(--white-opacity),.2), 0 0 10px 10px var(--white-color), 0 0 0 10px rgba(var(--white-opacity),.6)}
	100%{box-shadow:0 0 0 2px rgba(var(--white-opacity),.2), 0 0 10px 10px var(--white-color), 0 0 0 10px rgba(var(--white-opacity),.5);transform:scale(1.4);opacity:0; }
}
@keyframes single-video-effect{
	0%{opacity:0.4}
	40%{opacity:0.6;box-shadow:0 0 0 2px rgba(var(--secondary-opacity),.2), 0 0 10px 10px var(--secondary-color-dark), 0 0 0 10px rgba(var(--secondary-opacity),.7)}
	100%{box-shadow:0 0 0 2px rgba(var(--secondary-opacity),.2), 0 0 10px 10px var(--secondary-color-dark), 0 0 0 10px rgba(var(--secondary-opacity),.7);transform:scale(1.4);opacity:0; }
}
/*---------------------------------------------------
   10.B Fixed Menu
-----------------------------------------------------*/
@-webkit-keyframes fadeInDown {
	0% {
		opacity: 0;
		transform: translateY(-20px);
	}
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}
@keyframes fadeInDown {
	0% {
		opacity: 0;
		transform: translateY(-20px);
	}
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}
.fadeInDown {
	animation-name: fadeInDown;
}
/*---------------------------------------------------
   10.C About Icon
-----------------------------------------------------*/
@keyframes pulse-border {
	0% {
		transform: scale(1);
		opacity: 0.5;
	}
	100% {
		transform: scale(1.5);
		opacity: 0;
	}
}
/*---------------------------------------------------
   10.D
-----------------------------------------------------*/

/*===================================================
   END OF ANIMATIONS
=====================================================*/