/* ==============================================================
    # Logo Custom Styles for Okeanos Software Company
=================================================================== */

/* Small Logo - Navbar - Desktop */
.navbar-brand .logo {
	max-height: 60px;
	width: auto;
	transition: all 0.3s ease-in-out;
	filter: brightness(1);
	object-fit: contain;
}

.navbar-brand:hover .logo {
	transform: scale(1.05);
	filter: brightness(1.1);
}

/* Logo Display Class */
.logo-display {
	display: block !important;
}

/* Small Logo - Mobile Menu */
.navbar-collapse .logo {
	max-height: 80px;
	width: auto;
	margin: 20px auto;
	display: block;
	object-fit: contain;
}

/* Small Logo - Side Navbar */
.side-nav-menu .logo {
	max-height: 80px;
	width: 80px;
	height: 80px;
	object-fit: contain;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.1);
	padding: 10px;
	transition: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
	box-shadow: 0 4px 15px rgba(40, 233, 140, 0.2);
}

.side-nav-menu a:hover .logo {
	transform: scale(1.15) rotate(8deg);
	background: rgba(40, 233, 140, 0.25);
	box-shadow: 0 6px 25px rgba(40, 233, 140, 0.4);
}

/* Big Logo - Footer */
.logos {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 20px;
	margin: 30px 0;
}

.logos .logo-footer {
	max-height: 250px;
    max-width: 500px;
	transition: all 0.1s ease-in-out;
	filter: brightness(0.95);
	object-fit: contain;
}

.logos .logo-footer:hover {
	transform: translateY(-5px) scale(1.08);
	filter: brightness(1.9);
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
}

/* Legacy support for .logo class in footer */
.logos .logo {
	max-height: 150px;
	width: auto;
	transition: all 0.3s ease-in-out;
	filter: brightness(0.95);
	object-fit: contain;
}

.logos .logo:hover {
	transform: translateY(-5px) scale(1.08);
	filter: brightness(1.1);
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
}

/* Logo Animation on Page Load */
@keyframes logoFadeIn {
	from {
		opacity: 0;
		transform: translateY(-20px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.navbar-brand .logo,
.navbar-collapse .logo,
.side-nav-menu .logo {
	animation: logoFadeIn 0.8s ease-out;
}

/* Responsive Logo Adjustments */

/* Large Tablets and Small Desktops */
@media (max-width: 1199px) {
	.navbar-brand .logo {
		max-height: 55px;
	}

	.side-nav-menu .logo {
		max-height: 75px;
		width: 75px;
		height: 75px;
	}

	.logos .logo,
	.logos .logo-footer {
		max-height: 130px;
	}
}

/* Tablets */
@media (max-width: 991px) {
	.navbar-brand .logo {
		max-height: 50px;
	}

	.navbar-collapse .logo {
		max-height: 75px;
	}

	.side-nav-menu .logo {
		max-height: 70px;
		width: 70px;
		height: 70px;
	}

	.logos .logo,
	.logos .logo-footer {
		max-height: 120px;
	}
}

/* Mobile Devices */
@media (max-width: 767px) {
	.navbar-brand .logo {
		max-height: 45px;
	}

	.navbar-collapse .logo {
		max-height: 70px;
	}

	.side-nav-menu .logo {
		max-height: 65px;
		width: 65px;
		height: 65px;
		padding: 8px;
	}

	.logos {
		justify-content: center;
		gap: 15px;
	}

	.logos .logo,
	.logos .logo-footer {
		max-height: 110px;
	}
}

/* Small Mobile Devices */
@media (max-width: 480px) {
	.navbar-brand .logo {
		max-height: 40px;
	}

	.navbar-collapse .logo {
		max-height: 65px;
	}

	.side-nav-menu .logo {
		max-height: 60px;
		width: 60px;
		height: 60px;
		padding: 6px;
	}

	.logos .logo,
	.logos .logo-footer {
		max-height: 300px;
		margin: 10px 5px;
	}
}

/* Extra Small Devices */
@media (max-width: 360px) {
	.navbar-brand .logo {
		max-height: 35px;
	}

	.side-nav-menu .logo {
		max-height: 55px;
		width: 55px;
		height: 55px;
	}

	.logos .logo,
	.logos .logo-footer {
		max-height: 70px;
	}
}

/* Dark Mode Compatibility */
.bg-dark .navbar-brand .logo,
.bg-dark .navbar-collapse .logo,
.bg-dark .side-nav-menu .logo {
	filter: brightness(1.1);
}

/* Logo Loading State */
.logo[src*="okeanos-logo.png"] {
	image-rendering: -webkit-optimize-contrast;
	image-rendering: crisp-edges;
}

/* Print Styles */
@media print {
	.navbar-brand .logo,
	.logos .logo {
		max-height: 100px;
		filter: none;
	}
}