/* =============================================
   Oyun Hakları - Responsive CSS
   ============================================= */

/* Tablet: 1024px ve altı */
@media (max-width: 1024px) {
	:root { --oh-sidebar-w: 60px; }
	.oh-sidebar { width: var(--oh-sidebar-w-collapsed); }
	.oh-sidebar .oh-nav-label,
	.oh-sidebar .oh-logo-img,
	.oh-sidebar .oh-search-form { opacity: 0; width: 0; overflow: hidden; }
	.oh-main { margin-left: var(--oh-sidebar-w-collapsed); }
	.oh-sidebar.expanded { width: var(--oh-sidebar-w); }
	.oh-sidebar.expanded .oh-nav-label { opacity: 1; width: auto; }
	.oh-sidebar.expanded .oh-logo-img { opacity: 1; }
	.oh-sidebar.expanded .oh-search-form { opacity: 1; width: auto; }
	.oh-content-grid { grid-template-columns: 1fr 280px; gap: 24px; }
	.oh-social-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 900px) {
	.oh-main { padding: 0 24px 40px; }
	.oh-content-grid { grid-template-columns: 1fr; }
	.oh-content-col--live { order: -1; }
	.oh-post-card-thumb { width: 140px; height: 100px; }
	.oh-single-title { font-size: 24px; }
	.oh-related-grid { grid-template-columns: repeat(2, 1fr); }
	.oh-contact-grid { grid-template-columns: 1fr; }
	.oh-post-nav { grid-template-columns: 1fr; }
}

/* Mobil: 600px ve altı */
@media (max-width: 600px) {
	.oh-main { padding: 70px 16px 40px; margin-left: 0 !important; }
	.home .oh-main { padding-left: 16px; padding-right: 16px; }
	.oh-sidebar { display: none !important; }
	.oh-mobile-nav { display: none !important; }

	/* Mobil menü butonu */
	.oh-mobile-menu-btn {
		display: flex !important;
		position: fixed;
		top: 14px;
		left: 14px;
		width: 40px;
		height: 40px;
		background: #222222;
		border: 1px solid var(--oh-border);
		border-radius: 10px;
		align-items: center;
		justify-content: center;
		z-index: 200;
		cursor: pointer;
		box-shadow: 0 2px 8px rgba(0,0,0,0.1);
	}
	.oh-mobile-menu-btn svg { width: 20px; height: 20px; fill: var(--oh-text-muted); }

	/* Overlay */
	.oh-mobile-overlay {
		display: none;
		position: fixed;
		inset: 0;
		background: rgba(0,0,0,0.5);
		z-index: 1000;
	}
	.oh-mobile-overlay.active { display: block; }

	/* Tam ekran menü */
	.oh-mobile-fullmenu {
		position: fixed;
		top: 0;
		left: -100%;
		width: 80%;
		max-width: 300px;
		height: 100vh;
		background: var(--oh-card-bg);
		z-index: 1001;
		transition: left 0.3s ease;
		display: flex;
		flex-direction: column;
		box-shadow: 4px 0 20px rgba(0,0,0,0.15);
	}
	.oh-mobile-fullmenu.active { left: 0; }

	.oh-mobile-fullmenu-header {
		padding: 24px 20px 16px;
		border-bottom: 1px solid var(--oh-border);
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.oh-mobile-fullmenu-logo img { height: 36px; width: auto; }
	.oh-mobile-fullmenu-close {
		width: 32px; height: 32px;
		background: #2a2a2a; border: none;
		border-radius: 8px;
		display: flex; align-items: center; justify-content: center;
		cursor: pointer;
	}
	.oh-mobile-fullmenu-close svg { width: 16px; height: 16px; fill: var(--oh-text-muted); }

	.oh-mobile-fullmenu-nav { flex: 0 0 auto; padding: 16px 0; overflow-y: auto; max-height: 60vh; }
	.oh-mobile-fullmenu-nav a {
		display: flex; align-items: center; gap: 14px;
		padding: 14px 20px;
		color: var(--oh-text-muted);
		font-size: 15px; font-weight: 500;
		text-decoration: none;
		transition: all 0.2s;
	}
	.oh-mobile-fullmenu-nav a:hover { background: rgba(255, 155, 0, 0.12); color: var(--oh-primary); }
	.oh-mobile-fullmenu-nav a.active { background: var(--oh-primary); color: white; }
	.oh-mobile-fullmenu-nav .oh-nav-icon { width: 22px; height: 22px; flex-shrink: 0; }
	.oh-mobile-fullmenu-nav .oh-nav-icon svg { width: 20px; height: 20px; fill: currentColor; }

	.oh-mobile-fullmenu-search {
		padding: 12px 16px;
		border-top: 1px solid var(--oh-border);
		flex: 0 0 auto;
	}
	.oh-mobile-fullmenu-search-inner {
		display: flex;
		align-items: center;
		gap: 8px;
		border: 1.5px solid var(--oh-border);
		border-radius: 6px;
		padding: 0 10px;
		background: var(--oh-bg);
		transition: border-color 0.2s;
	}
	.oh-mobile-fullmenu-search-inner:focus-within {
		border-color: var(--oh-primary);
		background: var(--oh-card-bg);
	}
	.oh-mobile-search-icon {
		display: flex;
		align-items: center;
		flex-shrink: 0;
		color: var(--oh-text-muted);
	}
	.oh-mobile-search-icon svg {
		width: 16px;
		height: 16px;
		fill: currentColor;
	}
	.oh-mobile-fullmenu-search input {
		flex: 1;
		border: none;
		border-radius: 0;
		padding: 10px 0;
		font-size: 14px;
		outline: none;
		background: transparent;
		color: var(--oh-text);
		font-family: var(--oh-font);
	}

	/* Mobil içerik yatay boşlukları — oh-main padding'i tüm sayfalara uygular */
	.oh-frontpage { padding-left: 0; padding-right: 0; box-sizing: border-box; }
	.oh-archive-page,
	.oh-single-page,
	.oh-contact-page,
	.oh-search-page { padding-left: 0; padding-right: 0; }

	/* Social */
	.oh-social-grid { grid-template-columns: repeat(3, 1fr); max-width: 100%; }
	.oh-social-card { padding: 12px 8px; }
	.oh-social-icon svg { width: 28px; height: 28px; }
	.oh-social-label { font-size: 10px; }

	/* Yazı kartı */
	.oh-post-card-link { gap: 12px; }
	.oh-post-card-thumb { width: 110px; height: 80px; }
	.oh-post-card-title { font-size: 14px; }
	.oh-post-card-meta { gap: 8px; }

	/* Tekil */
	.oh-single-title { font-size: 20px; }
	.oh-single-content { font-size: 15px; }
	.oh-related-grid { grid-template-columns: 1fr; }
	.oh-404-number { font-size: 80px; }
	.oh-sponsor-inner { padding: 20px 16px; }
	.oh-sponsor-title { font-size: 17px; }
	.oh-archive-title { font-size: 20px; }
	.oh-section-title { font-size: 16px; }
}

@media (min-width: 601px) {
	.oh-mobile-menu-btn { display: none !important; }
	.oh-mobile-fullmenu { display: none !important; }
	.oh-mobile-overlay { display: none !important; }
}

/* MOBİL ÜST BAR */
.oh-mobile-header {
	display: none;
}

@media (max-width: 600px) {
	/* Üst bar */
	.oh-mobile-header {
		display: flex;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		height: 56px;
		background: var(--oh-card-bg);
		border-bottom: 1px solid var(--oh-border);
		align-items: center;
		padding: 0 16px;
		z-index: 999;
		box-shadow: 0 2px 8px rgba(0,0,0,0.06);
		gap: 12px;
	}

	.oh-mobile-toggle-btn {
		width: 36px;
		height: 36px;
		background: var(--oh-card-bg);
		border: 1px solid var(--oh-border);
		border-radius: 8px;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		flex-shrink: 0;
	}

	.oh-mobile-toggle-btn svg {
		width: 14px;
		height: 14px;
		fill: var(--oh-text-muted);
	}

	.oh-mobile-header-logo {
		flex: 1;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-right: 44px; /* toggle buton genişliği kadar — tam ortalama için */
	}

	.oh-mobile-header-logo .oh-logo-img {
		height: 32px;
		width: auto;
	}

	/* Mobil menü butonu gizle (artık üst barda) */
	.oh-mobile-menu-btn {
		display: none !important;
	}

	/* Instagram üstte, canlı yayın altta */
	.oh-order-mobile-1 { order: 1; }
	.oh-order-mobile-2 { order: 2; }

	/* Stüdyo sayfası üst boşluk */
	.oh-studyo-page { padding-top: 8px; }
	.oh-studyo-hero { padding-top: 16px; }

	/* Akış sayfası üst boşluk */
	.oh-archive-page { padding-top: 8px; }
	.oh-akis-header { padding-top: 12px; }

	/* İletişim sayfası üst boşluk */
	.oh-contact-page { padding-top: 8px; }
	.oh-contact-hero { padding-top: 16px; padding-bottom: 20px; }

	/* Kapak fotoğrafı */
	.oh-live-cover {
		width: 100%;
		height: 100%;
		object-fit: cover;
		position: absolute;
		inset: 0;
	}
}
