/**
 * TeachDemy — header/footer "chrome" only.
 *
 * This is a scoped subset of teachdemy-shared.css: the exact same
 * rules used to style header-redesign.php / footer-redesign.php, but
 * every selector is anchored to the actual header/top-bar/footer
 * regions (body.td-page .top, body.td-page header.header,
 * footer#site-footer) instead of the broad ".td-page X" pattern.
 *
 * Why: teachdemy-shared.css assumes EVERY element inside body.td-page
 * is bespoke redesign markup — true on Home/Disciplines/Instructors,
 * but NOT true on Shop, single Course, Blog, Upcoming or My Account,
 * where the space between header and footer is still Woodmart's/
 * WooCommerce's own templates. Those reuse common class names like
 * .container and .btn, so loading the broad stylesheet there would
 * also restyle parts of Woodmart's own layout. This file gives those
 * pages the same-looking header + footer without that side effect.
 */

:root {
	--navy: #062b2b;
	--navy2: #07504b;
	--blue: #1769e8;
	--cyan: #20b9e8;
	--green: #16a673;
	--green2: #27c58b;
	--mint: #e9fbf4;
	--ink: #12243d;
	--muted: #6b7b90;
	--bg: #f5fbf8;
	--line: #dcebe6;
	--white: #fff;
	--gold: #f7bd31;
}

body.td-page .top,
body.td-page .top *,
body.td-page header.header,
body.td-page header.header *,
.td-page footer#site-footer,
.td-page footer#site-footer * {
	box-sizing: border-box;
}
body.td-page .top,
body.td-page header.header,
.td-page footer#site-footer {
	font-family: Inter, system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
}
body.td-page .top a,
body.td-page header.header a,
.td-page footer#site-footer a {
	text-decoration: none;
	color: inherit;
}

/* Shared: the 1220px content container, used inside all three regions */
body.td-page .top .container,
body.td-page header.header .container,
.td-page footer#site-footer .container {
	width: min(1220px, 92%);
	margin: auto;
}

/* ---------- Top bar ---------- */
body.td-page .top {
	background: linear-gradient(90deg, #062b2b, #07504b);
	color: #dbe8f7;
	font-size: 12px;
}
body.td-page .top .container {
	height: 36px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
body.td-page .top .top-right {
	display: flex;
	gap: 20px;
}
body.td-page .top a {
	color: #fff;
	font-weight: 700;
}

/* ---------- Header / nav ---------- */
body.td-page header.header {
	min-height: 76px;
	background: #fff;
	border-bottom: 1px solid var(--line);
	position: sticky;
	top: 0;
	z-index: 100;
}
/*
 * BUG FIX (client Edits list, item 33 — "header flickers on scroll"):
 * the WordPress admin bar is ALSO `position: fixed; top: 0` (32px tall,
 * 46px on screens <= 782px) for any logged-in user — which is exactly
 * who was testing this. With nothing here accounting for it, this
 * sticky header and the admin bar both claimed the same `top: 0`,
 * so on every scroll frame the browser had two fixed/sticky elements
 * fighting over the same position — the visible "flicker". Anyone
 * testing while logged out would never see it, which is why it read
 * as intermittent ("خیلی پیش اومده" — happens a lot, not always).
 */
body.td-page.admin-bar header.header {
	top: 32px;
}
@media screen and (max-width: 782px) {
	body.td-page.admin-bar header.header {
		top: 46px;
	}
}
body.td-page header.header .nav {
	min-height: 76px;
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: nowrap;
	padding: 8px 0;
}
body.td-page header.header .brand {
	display: flex;
	align-items: center;
	gap: 9px;
	min-width: 0;
	flex: none;
	margin-right: 4px;
}
body.td-page header.header .brandmark {
	width: 38px;
	height: 38px;
}
body.td-page header.header .brandmark svg {
	width: 38px;
	height: 38px;
}
body.td-page header.header .brandname {
	font-size: 20px;
	font-weight: 900;
	letter-spacing: -0.6px;
	color: var(--navy);
}
body.td-page header.header .brandname span {
	color: var(--green);
}
body.td-page header.header .navlinks {
	display: flex;
	gap: 13px;
	flex: 1;
	min-width: 0;
}
body.td-page header.header .navlinks a {
	font-size: 12px;
	font-weight: 750;
	color: #34465e;
}
body.td-page header.header .navlinks a:hover {
	color: var(--blue);
}
body.td-page header.header .navactions {
	display: flex;
	gap: 7px;
	flex-wrap: nowrap;
	flex: none;
}
body.td-page header.header .nav-cta-group {
	display: flex;
	gap: 6px;
}
body.td-page header.header .menu {
	display: none;
	background: none;
	border: 0;
	font-size: 25px;
	color: var(--navy);
}
body.td-page header.header .mobile-menu {
	display: none;
}
body.td-page header.header .cart-link {
	position: relative;
}
body.td-page header.header .cart-count {
	position: absolute;
	top: -6px;
	right: -6px;
	background: var(--blue);
	color: #fff;
	border-radius: 999px;
	font-size: 9px;
	min-width: 16px;
	height: 16px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0 3px;
}

/* ---------- Buttons (used in header + footer) ---------- */
body.td-page header.header .btn,
.td-page footer#site-footer .btn {
	border: 0;
	border-radius: 10px;
	padding: 12px 17px;
	font-size: 12px;
	font-weight: 800;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 7px;
	cursor: pointer;
	white-space: nowrap;
}
body.td-page header.header .btn.icon-only {
	width: 38px;
	height: 38px;
	padding: 0;
	font-size: 16px;
	flex: none;
	position: relative;
}
body.td-page header.header .btn.ghost {
	background: transparent;
	border: 1.5px solid transparent;
	color: #4b6076;
	padding: 9px 12px;
	font-size: 10px;
}
body.td-page header.header .btn.ghost:hover {
	background: #f2f6fa;
	color: var(--blue);
}
body.td-page header.header .primary,
.td-page footer#site-footer .primary {
	background: linear-gradient(135deg, var(--green), var(--green2));
	color: #fff;
	box-shadow: 0 8px 20px rgba(22, 166, 115, 0.2);
}
body.td-page header.header .secondary,
.td-page footer#site-footer .secondary {
	background: #fff;
	color: var(--navy);
	border: 1px solid #ccd7e6;
}
body.td-page header.header .secondary:hover,
.td-page footer#site-footer .secondary:hover {
	border-color: var(--green);
	color: var(--green);
}
body.td-page header.header .dark,
.td-page footer#site-footer .dark {
	background: var(--navy);
	color: #fff;
}
body.td-page header.header .brand-logo,
.td-page footer#site-footer .brand-logo {
	height: 48px;
	width: auto;
	display: block;
}

/* ---------- Footer ---------- */
.td-page footer#site-footer {
	background: #03172d;
	color: #b9c8da;
	padding: 58px 0 24px;
}
.td-page footer#site-footer .footgrid {
	display: grid;
	grid-template-columns: 1.6fr repeat(4, 1fr);
	gap: 35px;
}
.td-page footer#site-footer .footbrand p {
	max-width: 330px;
	font-size: 11px;
	line-height: 1.8;
	color: #b9c8da;
}
.td-page footer#site-footer .footbrand .brand-logo {
	height: 52px;
	width: auto;
	margin-bottom: 14px;
}
.td-page footer#site-footer .foot h3 {
	color: #fff;
	font-size: 12px;
	margin: 0 0 15px;
}
.td-page footer#site-footer .foot a {
	display: block;
	font-size: 10px;
	margin: 9px 0;
	color: #9eb0c5;
}
.td-page footer#site-footer .foot-socials {
	display: flex;
	gap: 14px;
	flex-wrap: wrap;
	margin-top: 16px;
}
.td-page footer#site-footer .foot-socials a {
	margin: 0;
	font-weight: 700;
	color: #cfe0ea;
}
.td-page footer#site-footer .foot-socials a:hover {
	color: #fff;
}
.td-page footer#site-footer .foot-contact {
	margin-top: 14px;
	padding-top: 14px;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.td-page footer#site-footer .foot-contact a,
.td-page footer#site-footer .foot-contact span {
	display: block;
	font-size: 10px;
	margin: 8px 0;
	color: #9eb0c5;
}
.td-page footer#site-footer .bottom {
	border-top: 1px solid rgba(255, 255, 255, 0.12);
	margin-top: 30px;
	padding-top: 15px;
	font-size: 8px;
	display: flex;
	justify-content: space-between;
}

/* ---------- Responsive ---------- */
@media (max-width: 1440px) {
	body.td-page header.header .nav-cta-group {
		display: none;
	}
}
@media (max-width: 1050px) {
	body.td-page header.header .navlinks {
		display: none;
	}
	body.td-page header.header .menu {
		display: block;
	}
	body.td-page header.header .navlinks.is-open {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 2px;
		position: absolute;
		top: 76px;
		left: 0;
		right: 0;
		background: #fff;
		border-bottom: 1px solid var(--line);
		padding: 12px 5%;
		box-shadow: 0 12px 24px rgba(7, 31, 61, 0.08);
		z-index: 99;
	}
	body.td-page header.header .navlinks.is-open > a {
		padding: 10px 0;
		width: 100%;
		border-bottom: 1px solid var(--line);
	}
	.td-page footer#site-footer .footgrid {
		grid-template-columns: repeat(3, 1fr);
	}
}
@media (max-width: 650px) {
	.td-page footer#site-footer .footgrid {
		grid-template-columns: 1fr;
	}
	body.td-page .top .top-right {
		display: none;
	}
	body.td-page .top .container {
		justify-content: center;
	}
	.td-page footer#site-footer .bottom {
		display: block;
		line-height: 2;
	}
}

/* ---------- Item 36: always-visible Log In / Sign Up buttons ---------- */
body.td-page header.header .td-auth-buttons {
	display: flex;
	gap: 6px;
	flex: none;
}
body.td-page header.header .td-auth-buttons .btn {
	padding: 10px 14px;
	font-size: 11px;
}

/* Keep the header tidy on phones: drop the (redundant) Explore Courses
   button so Log In / Sign Up always stay visible next to the cart. */
@media (max-width: 620px) {
	body.td-page header.header .td-explore-cta {
		display: none;
	}
	body.td-page header.header .td-auth-buttons .btn {
		padding: 10px 11px;
		font-size: 10.5px;
	}
	body.td-page header.header .td-auth-buttons ~ .cart-link,
	body.td-page header.header .navactions .cart-link {
		flex: none;
	}
}
[data-theme="dark"] body.td-page header.header .td-auth-buttons .btn.secondary,
body.woodmart-dark header.header .td-auth-buttons .btn.secondary {
	background: #0e2a33;
	color: #e6f2f0;
	border-color: #1d4653;
}

/* Item 40: follower-count chip (chrome pages) */
.td-page footer#site-footer .foot-socials a { display: inline-flex; align-items: center; gap: 7px; }
.td-page footer#site-footer .foot-socials .td-follower-count {
	display: inline-flex;
	align-items: center;
	padding: 3px 8px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.12);
	border: 1px solid rgba(255, 255, 255, 0.16);
	font-size: 10px;
	font-weight: 800;
	letter-spacing: 0.3px;
	color: #e6f2f0;
	line-height: 1;
}
.td-page footer#site-footer .foot-socials a:hover .td-follower-count {
	background: rgba(255, 255, 255, 0.2);
	color: #fff;
}

/* ============================================================
 * Item 23 — Course page REVIEWS UI aligned with the Home design
 * (testimonial-style cards, initial-circle avatars, brand colors).
 * Scoped to single-product pages so Woodmart's own templates on
 * other pages are untouched.
 * ============================================================ */
body.td-page.single-product #reviews {
	max-width: 920px;
	margin: 40px auto 0;
}
body.td-page.single-product #reviews h2.woocommerce-Reviews-title,
body.td-page.single-product #reviews .woocommerce-Reviews-title {
	font-size: 22px;
	font-weight: 800;
	color: #06272f;
	letter-spacing: -0.4px;
}
body.td-page.single-product #reviews ol.commentlist {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 14px;
}
body.td-page.single-product #reviews ol.commentlist li {
	background: #fff;
	border: 1px solid #dce9e7;
	border-radius: 17px;
	padding: 18px 20px;
	box-shadow: 0 8px 28px rgba(7, 31, 61, 0.05);
	margin-bottom: 0 !important;
}
body.td-page.single-product #reviews ol.commentlist li img.avatar {
	width: 44px;
	height: 44px;
	border-radius: 999px;
	object-fit: cover;
	border: 2px solid #e9fbf4;
	background: #087d72;
	padding: 0;
	float: none;
	position: static;
}
body.td-page.single-product #reviews ol.commentlist li .comment-text {
	border: 0 !important;
	margin: 0 0 0 0 !important;
	padding: 0 0 0 16px !important;
	display: flex;
	flex-direction: column;
	gap: 6px;
}
body.td-page.single-product #reviews .comment-text .woocommerce-review__author {
	font-size: 14px;
	font-weight: 800;
	color: #092b36;
}
body.td-page.single-product #reviews .comment-text .woocommerce-review__dash,
body.td-page.single-product #reviews .comment-text .woocommerce-review__published-date {
	color: #6b7b90;
	font-size: 11.5px;
}
body.td-page.single-product #reviews .star-rating {
	color: #f3b82f;
}
body.td-page.single-product #reviews .star-rating::before {
	color: #c9d6d2;
}
body.td-page.single-product #reviews .comment-text .description p {
	font-size: 13.5px;
	line-height: 1.8;
	color: #354a55;
	margin: 0;
}
/* Review submit form */
body.td-page.single-product #review_form #commentform {
	background: #fff;
	border: 1px solid #dce9e7;
	border-radius: 17px;
	padding: 22px 24px;
	box-shadow: 0 8px 28px rgba(7, 31, 61, 0.05);
}
body.td-page.single-product #review_form #reply-title {
	font-size: 16px;
	font-weight: 800;
	color: #06272f;
}
body.td-page.single-product #review_form label {
	font-size: 12px;
	font-weight: 700;
	color: #092b36;
}
body.td-page.single-product #review_form input[type='text'],
body.td-page.single-product #review_form input[type='email'],
body.td-page.single-product #review_form textarea {
	border: 1px solid #dce9e7 !important;
	border-radius: 11px !important;
	padding: 11px 13px !important;
	font-size: 13px !important;
	background: #fbfefc !important;
}
body.td-page.single-product #review_form input[type='text']:focus,
body.td-page.single-product #review_form input[type='email']:focus,
body.td-page.single-product #review_form textarea:focus {
	border-color: #087d72 !important;
	outline: none;
	box-shadow: 0 0 0 3px rgba(8, 125, 114, 0.12);
}
body.td-page.single-product #review_form p.form-submit input[type='submit'],
body.td-page.single-product #review_form .submit {
	background: linear-gradient(135deg, #16a673, #27c58b) !important;
	color: #fff !important;
	border: 0 !important;
	border-radius: 11px !important;
	padding: 12px 22px !important;
	font-weight: 800 !important;
	cursor: pointer;
	box-shadow: 0 8px 20px rgba(22, 166, 115, 0.2);
}
[data-theme='dark'] body.td-page.single-product #reviews ol.commentlist li,
body.woodmart-dark.single-product #reviews ol.commentlist li {
	background: #0e2a33;
	border-color: #1d4653;
}
[data-theme='dark'] body.td-page.single-product #reviews ol.commentlist li .comment-text .woocommerce-review__author,
body.woodmart-dark.single-product #reviews .woocommerce-review__author {
	color: #e6f2f0;
}
[data-theme='dark'] body.td-page.single-product #review_form #commentform,
body.woodmart-dark.single-product #review_form #commentform {
	background: #0e2a33;
	border-color: #1d4653;
}
[data-theme='dark'] body.td-page.single-product #reviews h2.woocommerce-Reviews-title,
[data-theme='dark'] body.td-page.single-product #review_form #reply-title {
	color: #e6f2f0;
}

/* ============================================================
 * Round 6 — Accessibility + print
 * ============================================================ */

/* Skip-to-content link: invisible until focused with keyboard. */
.td-skip-link {
	position: absolute;
	top: -100px;
	left: 12px;
	z-index: 9999;
	background: #087d72;
	color: #fff;
	padding: 12px 18px;
	border-radius: 0 0 11px 11px;
	font-size: 13px;
	font-weight: 800;
	text-decoration: none;
	transition: top .18s ease;
	box-shadow: 0 6px 16px rgba(8, 125, 114, .35);
}
.td-skip-link:focus,
.td-skip-link:focus-visible {
	top: 0;
	outline: 3px solid #f3b82f;
	outline-offset: 2px;
}

/* Enhanced focus-visible rings for keyboard users (mouse clicks don't get one). */
body.td-page a:focus-visible,
body.td-page button:focus-visible,
body.td-page input:focus-visible,
body.td-page select:focus-visible,
body.td-page textarea:focus-visible,
body.td-page summary:focus-visible,
body.td-page [tabindex]:focus-visible {
	outline: 3px solid #087d72;
	outline-offset: 2px;
	border-radius: 4px;
}
[data-theme='dark'] body.td-page a:focus-visible,
[data-theme='dark'] body.td-page button:focus-visible,
body.woodmart-dark a:focus-visible,
body.woodmart-dark button:focus-visible {
	outline-color: #f3b82f;
}

/* Honour reduced-motion preferences (accessibility + UX). */
@media (prefers-reduced-motion: reduce) {
	body.td-page *,
	body.td-page *::before,
	body.td-page *::after {
		animation-duration: .001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .001ms !important;
		scroll-behavior: auto !important;
	}
}

/* ----- Print stylesheet (single course + general pages) ----- */
@media print {
	body.td-page .top,
	body.td-page header.header,
	body.td-page .navactions,
	body.td-page .td-search-toggle,
	body.td-page .menu,
	body.td-page #td-menu-toggle,
	body.td-page footer#site-footer .foot-socials,
	body.td-page #td-scroll-top,
	body.td-page .td-cookie-banner,
	body.td-page .td-compare-bar,
	body.td-page .td-reading-progress,
	body.td-page .td-auth-buttons,
	body.td-page .td-explore-cta,
	body.td-page .foot-socials,
	body.td-page .top-right,
	body.td-page button.cart-link,
	body.td-page .td-search-live,
	body.td-page .td-theme-toggle {
		display: none !important;
	}
	body.td-page {
		background: #fff !important;
		color: #000 !important;
	}
	body.td-page header.header,
	body.td-page footer#site-footer,
	body.td-page .wd-page-wrapper {
		display: block !important;
	}
	body.td-page footer#site-footer {
		border-top: 2px solid #000;
		padding: 16px 0 !important;
		color: #000 !important;
	}
	body.td-page footer#site-footer * {
		color: #000 !important;
	}
	body.td-page .container,
	body.td-page .foot {
		max-width: 100% !important;
		width: 100% !important;
		padding: 0 !important;
		margin: 0 !important;
	}
	body.td-page a[href]::after {
		content: ' (' attr(href) ')';
		font-size: 9px;
		color: #555;
	}
	body.td-page a[href^='#']::after,
	body.td-page a[href^='javascript']::after,
	body.td-page a[href^='mailto']::after {
		content: '';
	}
	body.td-page img,
	body.td-page video,
	body.td-page iframe {
		max-width: 100% !important;
		page-break-inside: avoid;
	}
	body.td-page .card,
	body.td-page .td-course-instructor,
	body.td-page #reviews ol.commentlist li,
	body.td-page .td-checkout-wallet,
	body.td-page .td-checkout-intro {
		break-inside: avoid;
		page-break-inside: avoid;
		box-shadow: none !important;
		border: 1px solid #bbb !important;
		background: #fff !important;
	}
	body.td-page .td-course-faq .card {
		border: 1px solid #000 !important;
	}
	body.td-page h1, body.td-page h2, body.td-page h3 {
		page-break-after: avoid;
		break-after: avoid;
	}
	body.td-page .td-page {
		background: #fff !important;
	}
}

/* ============================================================
 * Round 18 — WISHLIST PAGE (client: "the wishlist page is still
 * the old theme — replace it with the new one").
 *
 * The WoodMart wishlist page (slug 'wishlist') now runs inside the
 * redesigned chrome (see teachdemy_use_redesigned_chrome()). This
 * block restyles the wishlist CONTENT to match the TeachDemy design
 * system: mint cards, navy headings, green buttons — for the two
 * common wishlist renderers (WoodMart's product grid + the
 * table-based wishlist plugins), light + dark mode.
 * ============================================================ */

/* Page title + spacing */
.page-id-wishlist .td-page main .entry-title,
body.page .td-page main h1.entry-title { margin: 28px 0 18px; }

/* WoodMart wishlist product cards → TeachDemy cards */
.td-page .woodmart-wishlist-page .product-grid-item,
.td-page .wd-wishlist-grid .product-grid-item,
.td-page .wishlist-content .product-grid-item {
        background:#fff;
        border:1px solid var(--td-line, #dcebe6);
        border-radius:18px;
        box-shadow:0 10px 30px rgba(6,43,43,.06);
        overflow:hidden;
        transition:box-shadow .25s ease, transform .25s ease;
}
.td-page .woodmart-wishlist-page .product-grid-item:hover,
.td-page .wd-wishlist-grid .product-grid-item:hover {
        transform:translateY(-4px);
        box-shadow:0 18px 44px rgba(6,43,43,.12);
}

/* Table-based wishlist (TI-style) → clean mint table */
.td-page table.wishlist_table,
.td-page .wishlist_table {
        background:#fff;
        border:1px solid var(--td-line, #dcebe6);
        border-radius:18px;
        border-collapse:separate;
        border-spacing:0;
        overflow:hidden;
}
.td-page table.wishlist_table th {
        background:var(--td-navy, #062b2b);
        color:#e9fbf4;
        font-weight:600;
        padding:14px 12px;
}
.td-page table.wishlist_table td {
        padding:16px 12px;
        border-bottom:1px solid var(--td-line, #dcebe6);
        vertical-align:middle;
}
.td-page table.wishlist_table tr:last-child td { border-bottom:0; }

/* Wishlist action buttons → TeachDemy buttons */
.td-page .woodmart-wishlist-page .wd-add-btn,
.td-page .wishlist_table .button,
.td-page .wishlist-content .button,
.td-page .wd-wishlist-grid .button {
        background:var(--td-green, #16a673);
        color:#fff !important;
        border-radius:10px;
        padding:10px 18px;
        min-height:44px;
        border:0;
        font-weight:600;
        line-height:1.2;
}
.td-page .woodmart-wishlist-page .wd-add-btn:hover,
.td-page .wishlist_table .button:hover,
.td-page .wishlist-content .button:hover {
        background:var(--td-green2, #27c58b);
}

/* Empty-wishlist state */
.td-page .woodmart-wishlist-page .wd-empty-wishlist,
.td-page .wishlist-empty {
        background:var(--td-mint, #e9fbf4);
        border:1px dashed var(--td-green, #16a673);
        border-radius:18px;
        padding:40px 24px;
        text-align:center;
}

/* Dark mode */
html[data-theme="dark"] .td-page .woodmart-wishlist-page .product-grid-item,
html[data-theme="dark"] .td-page .wd-wishlist-grid .product-grid-item,
html[data-theme="dark"] .td-page .wishlist-content .product-grid-item,
html[data-theme="dark"] .td-page table.wishlist_table,
html[data-theme="dark"] .td-page .wishlist_table {
        background:#0a1f1f;
        border-color:#1a3030;
        color:#e8f0ee;
}
html[data-theme="dark"] .td-page table.wishlist_table th { background:#0d2e2a; color:#e9fbf4; }
html[data-theme="dark"] .td-page table.wishlist_table td { border-bottom-color:#1a3030; }
html[data-theme="dark"] .td-page .woodmart-wishlist-page .wd-empty-wishlist,
html[data-theme="dark"] .td-page .wishlist-empty {
        background:rgba(39,197,139,.08);
        border-color:var(--td-green, #16a673);
        color:#e8f0ee;
}

/* Mobile */
@media (max-width:768px) {
        .td-page table.wishlist_table,
        .td-page .wishlist_table {
                display:block;
                overflow-x:auto;
                -webkit-overflow-scrolling:touch;
        }
        .td-page .wishlist_table .button { width:100%; }
}