/* =====================================================================
   Kerd One panel theme (logo colors)
   Loaded after bootstrap/core/components in views/common/header.php
   Brand green : #173B1D (dark)  #2E6B35 (primary)  #3F7D45 (light)
   Brand brown : #8A4525 (accent) #B0683A (light)    #6E3519 (dark)
   ===================================================================== */

:root {
	--ko-green-dark: #173B1D;
	--ko-green: #2E6B35;
	--ko-green-light: #3F7D45;
	--ko-green-tint: #EEF5EC;
	--ko-brown: #8A4525;
	--ko-brown-light: #B0683A;
	--ko-brown-dark: #6E3519;
}

/* ---------- Buttons ---------- */
.btn-primary,
.btn-info,
.btn-blue {
	background-color: var(--ko-green) !important;
	border-color: var(--ko-green) !important;
	color: #fff !important;
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active,
.btn-info:hover, .btn-info:focus, .btn-info:active,
.btn-blue:hover, .btn-blue:focus, .btn-blue:active {
	background-color: var(--ko-green-dark) !important;
	border-color: var(--ko-green-dark) !important;
	color: #fff !important;
}

.btn-success {
	background-color: var(--ko-green-light) !important;
	border-color: var(--ko-green-light) !important;
	color: #fff !important;
}

.btn-success:hover, .btn-success:focus, .btn-success:active {
	background-color: var(--ko-green) !important;
	border-color: var(--ko-green) !important;
}

.btn-warning {
	background-color: var(--ko-brown) !important;
	border-color: var(--ko-brown) !important;
	color: #fff !important;
}

.btn-warning:hover, .btn-warning:focus, .btn-warning:active {
	background-color: var(--ko-brown-dark) !important;
	border-color: var(--ko-brown-dark) !important;
	color: #fff !important;
}

.btn-outline-primary {
	color: var(--ko-green) !important;
	border-color: var(--ko-green) !important;
}

/* Brown gradient buttons/badges (core.css) - dark text ki jagah white */
.login-form .btn-login,
.login-right .hero-badge,
.main_card_user_box .btn:hover,
.main_card_user_box .btn-outline-primary:hover,
.refereal_links .ref-header .badge-premium,
.refereal_links .copy-feedback,
.refereal_links .solicl_lins li a:hover,
.news-section .incon_vouleu i {
	color: #fff !important;
}

.main_card_user_box .btn:hover i {
	color: #fff !important;
}

/* ---------- Forms ---------- */
.form-control:focus,
.form-select:focus {
	border-color: var(--ko-green-light) !important;
	box-shadow: 0 0 0 0.2rem rgba(46, 107, 53, 0.18) !important;
}

input[type="checkbox"],
input[type="radio"] {
	accent-color: var(--ko-green);
}

.required {
	color: #c0392b;
}

/* ---------- Pagination / DataTables ---------- */
.page-item.active .page-link,
.pagination > .active > a,
.pagination > .active > span,
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
	background: var(--ko-green) !important;
	border-color: var(--ko-green) !important;
	color: #fff !important;
}

.page-link {
	color: var(--ko-green);
}

/* ---------- Top bar ---------- */
nav.navbar.bg-white {
	border-bottom: 3px solid var(--ko-green-dark) !important;
}

.account-user-avatar {
	color: var(--ko-green);
}

/* ---------- Sidebar ---------- */
#sidebar-menu > ul > li > a i {
	color: var(--ko-green);
}

#sidebar-menu > ul > li > a:hover i,
#sidebar-menu .subdrop i {
	color: #fff;
}

#sidebar-menu ul ul a:hover {
	color: var(--ko-brown) !important;
}

/* ---------- Headings / page title ---------- */
.page-title,
h4.page-title,
.card-box .form-section,
.card-box h3.form-section {
	color: var(--ko-green-dark);
}

.breadcrumb a {
	color: var(--ko-green);
}

/* ---------- Login page (dark green hero) ---------- */
.login-right .hero-title .highlight {
	background: linear-gradient(135deg, #E8B07A, #C98A55) !important;
	-webkit-background-clip: text !important;
	background-clip: text !important;
}

.login-left .logo img {
	max-height: 110px;
	width: auto;
}

/* ---------- Loader (third_party/js/kerdone-loader.js) ---------- */
.ko-loader {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 14px;
}

.ko-loader-ring {
	position: relative;
	width: 92px;
	height: 92px;
	border-radius: 50%;
	background: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
}

.ko-loader-ring::before {
	content: '';
	position: absolute;
	inset: -6px;
	border-radius: 50%;
	border: 5px solid rgba(255, 255, 255, 0.25);
	border-top-color: var(--ko-brown-light);
	border-right-color: var(--ko-green-light);
	animation: ko-spin 0.9s linear infinite;
}

.ko-loader-ring img {
	width: 58px;
	height: 58px;
	object-fit: contain;
	animation: ko-pulse 1.4s ease-in-out infinite;
}

.ko-loader-text {
	color: #fff;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.5px;
}

@keyframes ko-spin {
	to { transform: rotate(360deg); }
}

@keyframes ko-pulse {
	0%, 100% { transform: scale(1); }
	50% { transform: scale(0.9); }
}

@media (prefers-reduced-motion: reduce) {
	.ko-loader-ring::before,
	.ko-loader-ring img {
		animation-duration: 3s;
	}
}

/* ---------- Dialogs (third_party/js/kerdone-dialog.js -> SweetAlert2) ---------- */
.swal2-container.swal2-backdrop-show {
	background: rgba(15, 42, 20, 0.55) !important;
}

.ko-swal.swal2-popup {
	width: 26em;
	padding: 1.6em 1.4em 1.4em;
	border-radius: 14px;
	border-top: 6px solid var(--ko-green-dark);
	box-shadow: 0 18px 40px rgba(0, 0, 0, 0.25);
	font-family: inherit;
}

.ko-swal .ko-swal-text {
	color: #1f2a1f;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.5;
	margin-top: 0.6em;
}

.ko-swal .swal2-icon {
	margin-top: 0.4em;
	transform: scale(0.85);
}

.ko-swal .swal2-icon.swal2-success {
	border-color: var(--ko-green-light) !important;
	color: var(--ko-green-light) !important;
}

.ko-swal .swal2-icon.swal2-success [class^='swal2-success-line'] {
	background-color: var(--ko-green) !important;
}

.ko-swal .swal2-icon.swal2-success .swal2-success-ring {
	border-color: rgba(63, 125, 69, 0.3) !important;
}

.ko-swal .swal2-icon.swal2-info {
	border-color: var(--ko-brown-light) !important;
	color: var(--ko-brown) !important;
}

.ko-swal-btn {
	min-width: 120px;
	padding: 10px 28px;
	border: 0;
	border-radius: 8px;
	background: var(--ko-green);
	color: #fff;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
	transition: background 0.2s ease;
}

.ko-swal-btn:hover,
.ko-swal-btn:focus {
	background: var(--ko-green-dark);
	outline: none;
	box-shadow: 0 0 0 3px rgba(46, 107, 53, 0.25);
}