/*
	Theme Name: Bonamore
	Theme URI: http://bonamore.ee
	Author: Raido Martinson
*/

/*------------------------------------*\
    MAIN
\*------------------------------------*/
*,
*:after,
*:before {
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	-webkit-font-smoothing:antialiased;
	font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
}

.clear:before,
.clear:after {
    content:' ';
    display:table;
}

.clear:after {
    clear:both;
}
.clear {
    *zoom:1;
}
img {
	max-width:100%;
	vertical-align:bottom;
}
a {
	color:#444;
	text-decoration:none;
}
a:hover {
	color:#444;
}
a:focus {
	outline:0;
}
a:hover,
a:active {
	outline:0;
}
button:focus {
	outline:0;
}

/*------------------------------------*\
    STRUCTURE
\*------------------------------------*/

/*------------------------------------*\
    HEADER STYLING
\*------------------------------------*/

header {
	background-color: #fff;
	border-bottom: 1px solid #eee;
	padding: 15px 0;
	position: sticky;
	top: 0;
	z-index: 10000;
}

.header-container {
	display: flex;
	justify-content: space-between;
	align-items: center;
	max-width: 1400px;
	margin: 0 auto;
	padding: 0 20px;
}

.logo {
	display: flex;
	align-items: center;
	color: #444;
	font-size: 24px;
	font-weight: bold;
	text-decoration: none;
	transition: opacity 0.3s ease;
}

.logo:hover {
	opacity: 0.8;
}

.header-right {
	display: flex;
	align-items: center;
	gap: 30px;
}

/*------------------------------------*\
    PHONE SECTION
\*------------------------------------*/

.phone-section {
	display: flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    color: #261900;
    font-family: Inter;
    font-size: 18px;
}

.phone-icon {
	color: #261900;
	width: 20px;
	height: 20px;
	flex-shrink: 0;
}

.phone-text {
	white-space: nowrap;
	font-weight: 500;
}

.phone-section:hover .phone-icon {
	color: #0056b3;
}

/*------------------------------------*\
    LANGUAGE SWITCHER
\*------------------------------------*/

.language-switcher {
	display: flex;
	align-items: center;
	gap: 8px;
	
	padding: 8px 12px;
	border-radius: 6px;
	
}

.lang-option {
	display: flex;
	align-items: center;
	gap: 2px;
	padding: 6px 10px;
	color: #261900;
	text-decoration: none;
	border-radius: 4px;
	font-size: 13px;
	font-weight: 600;
	transition: all 0.3s ease;
	cursor: pointer;
	text-decoration: none;
}

.lang-option:hover {
	text-decoration: none;
}

.lang-option span {
	display: inline;
    text-decoration: none;
    line-height: 100%;
    padding: 5px 0 2px;
}

.lang-option:hover {
	background-color: #261900;
	color: #fff;
}

.lang-option.active {
	background-color: #261900;
	color: #fff;
}

.lang-option.active:hover {
	background-color: #261900;
}

/* Mobile responsive */
@media (max-width: 768px) {
	.header-container {
		flex-wrap: wrap;
		gap: 15px;
	}

	header {
		position: relative !important;
	}

	.header-right {
		width: 100%;
		justify-content: space-between;
		gap: 15px;
	}

	.language-switcher {
		gap: 8px;
	}

	

	.lang-option {
		padding: 6px 8px;
	}
}

@media (max-width: 420px) {
	.header-right {
        width: 100%;
        justify-content: space-between;
        gap: 5px;
        flex-direction: column;
    }

	header .logo {
		flex: 0 0 auto;
		width: 100%;
		text-align: center;
		display: block;
		margin: 10px 0 10px;
	}
}