/*
Theme Name: Dashwall Child
Theme URI: https://agnarson.com/wpthemes/dashwall/
Template: dashwall
Author: Alexander Agnarson
Author URI: https://agnarson.com
Description: Dashwall is a flexible blog and magazine theme with plenty of options. Optimized for all devices, this theme will stand out with a unique design, including dark/light mode. Demo: https://demo.agnarson.com/?theme=Dashwall
Tags: blog,one-column,two-columns,right-sidebar,left-sidebar,custom-colors,custom-menu,featured-images,flexible-header,full-width-template,sticky-post,theme-options,threaded-comments,translation-ready,custom-logo,custom-header,custom-background,news,entertainment,footer-widgets
Version: 1.0.1.1751610522
Updated: 2025-07-04 06:28:42
*/

/*
 * Child theme presentation styles are modularized under /css
 * and enqueued via functions.php for maintainability and caching.
 */

/* ===== Header logo responsive tweaks: avoid overlap with mobile hamburger ===== */

/* 기본: 부모 테마의 .site-title img 최대 높이 60px 그대로 사용 */
.site-title a img {
	max-height: 60px;
	height: 60px;
	width: auto;
	max-width: 240px;
}

@media (max-width: 768px) {
	/* 상단 헤더 로고: 모바일에서 살짝 더 작게 */
	.site-title a img {
		max-height: 52px;
		height: 52px;
		width: auto;
		max-width: 200px;
	}

	/* 헤더 전체 높이를 줄여 햄버거 메뉴와 간격 확보 */
	.page-header {
		padding-top: 8px;
		padding-bottom: 8px;
	}

	/* 로고와 메뉴 아이콘이 한 줄에 정렬되도록 여유 공간 확보 */
	.page-header.nav-menu-dropdown-left {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	/* 사이트 설명은 모바일에서 숨겨서 좌우 공간 확보 (원하지 않으면 주석 처리) */
	.site-description {
		display: none;
	}

	/* 모바일 메뉴 스타일 개선: 간격 및 여백 조정 */
	.nav-menu.mobile .menu ul {
		padding-left: 20px !important;
		padding-right: 20px !important;
		padding-top: 20px !important;
		padding-bottom: 20px !important;
		gap: 8px !important;
	}

	.nav-menu.mobile .menu li {
		margin-bottom: 8px !important;
	}

	.nav-menu.mobile .menu li:last-child {
		margin-bottom: 0 !important;
	}

	.nav-menu.mobile .menu li a {
		padding: 12px 16px !important;
		display: block !important;
		border-radius: 8px !important;
		transition: background-color 0.2s ease !important;
	}

	.nav-menu.mobile .menu li a:hover {
		background-color: rgba(0, 0, 0, 0.05) !important;
	}
}

/* ===== 업체등록 페이지: 이미지 업로드 섹션 숨기기 ===== */
/* 이미지 업로드 버튼과 설명만 숨기기 (로고 섹션은 유지) */
#dn-image-upload-btn,
.dn-image-upload-btn {
	display: none !important;
}

/* 광고 이미지 추가 버튼 숨기기 (1개만 업로드 가능) */
#dn-add-promo-image,
.dn-add-image-btn {
	display: none !important;
}

/* ===== 모바일에서 이모지 색상 진하게 표시 및 검은색 테두리 추가 ===== */
@media (max-width: 768px) {
	/* 카테고리 아이콘 이모지 */
	.dn-category-icon,
	.dn-category-icon * {
		filter: contrast(1.3) saturate(1.4) brightness(0.95) !important;
		-webkit-font-smoothing: antialiased !important;
		text-rendering: optimizeLegibility !important;
		-webkit-text-stroke: 0.5px #000 !important;
		text-stroke: 0.5px #000 !important;
	}
	
	/* 업체 디렉토리 안내 카드의 이모지 */
	.dn-business-info-box span[style*="font-size: 24px"],
	.dn-business-info-box h3 span {
		filter: contrast(1.3) saturate(1.4) brightness(0.95) !important;
		-webkit-font-smoothing: antialiased !important;
		text-rendering: optimizeLegibility !important;
		-webkit-text-stroke: 0.5px #000 !important;
		text-stroke: 0.5px #000 !important;
	}
	
	/* 일반 이모지 (카테고리 그리드 외부) */
	main .dn-container span[style*="font-size"],
	main .dn-container emoji,
	main .dn-container [class*="icon"] {
		filter: contrast(1.25) saturate(1.35) brightness(0.97) !important;
		-webkit-font-smoothing: antialiased !important;
		-webkit-text-stroke: 0.5px #000 !important;
		text-stroke: 0.5px #000 !important;
	}
}

/* ===== Fixed bottom banner slider: keep mobile banner size on desktop, no cropping ===== */

/* 고정 배너 컨테이너: 흰 배경 제거 + 필요 시 전체 너비 사용 */
.fixed-banner-container {
	display: flex;
	align-items: center; /* 세로 가운데 */
	background: transparent !important; /* 플러그인 기본 #fff 제거 */
	box-shadow: none !important;        /* 필요 없으면 그림자 제거 */
	border-radius: 0 !important;        /* 모서리 둥근 효과 제거 */
	/* PC에서 화면 전체 폭을 쓰고 싶다면 아래 주석 해제
	width: 100% !important;
	max-width: 100% !important;
	*/
}

.fixed-banner-container .banner-slides {
	width: 100%;
}

/* 각 슬라이드 안의 링크/이미지가 슬라이드 전체를 덮지 않도록 기본값만 유지 */
.fixed-banner-container .banner-slide a {
	display: inline-block;
}

/* 배너 이미지는 모바일에서 제작한 실제 크기(예: 380x100)에 맞춰 고정 */
.fixed-banner-container .banner-slide img {
	height: 100px !important;   /* 모바일에서 디자인한 배너 높이 */
	width: auto !important;     /* 가로는 비율에 맞게 자동 */
	object-fit: contain !important; /* 안전: 혹시라도 다른 스타일이 있어도 크롭 방지 */
	display: block;
	margin: 0 auto;             /* 가로 가운데 정렬 */
}