/**
 * My Dagang — front-end styles.
 * Aesthetic: refined, trustworthy minimalism. Ink + teal palette, generous
 * spacing, restrained shadows. Scoped under .mydg to avoid theme bleed.
 */

.mydg {
	--mydg-ink: #14202b;
	--mydg-ink-soft: #4a5b68;
	--mydg-line: #e3e8ec;
	--mydg-bg: #ffffff;
	--mydg-bg-soft: #f6f8f9;
	--mydg-teal: #0e7c7b;
	--mydg-teal-dark: #0a5d5c;
	--mydg-teal-soft: #e3f1f0;
	--mydg-amber: #b76e00;
	--mydg-red: #b3261e;
	--mydg-green: #14794a;
	--mydg-radius: 12px;
	--mydg-radius-sm: 8px;
	--mydg-shadow: 0 1px 2px rgba(20, 32, 43, .06), 0 6px 20px rgba(20, 32, 43, .06);

	color: var(--mydg-ink);
	font-size: 16px;
	line-height: 1.55;
	-webkit-font-smoothing: antialiased;
}

.mydg *,
.mydg *::before,
.mydg *::after {
	box-sizing: border-box;
}

.mydg .mydg-section-title {
	font-size: 1.5rem;
	font-weight: 650;
	letter-spacing: -0.01em;
	margin: 0 0 1.25rem;
}

.mydg .mydg-empty {
	color: var(--mydg-ink-soft);
	background: var(--mydg-bg-soft);
	border: 1px dashed var(--mydg-line);
	border-radius: var(--mydg-radius);
	padding: 1.5rem;
	text-align: center;
}

/* ---------------- buttons ---------------- */
.mydg .mydg-btn {
	display: inline-flex;
	align-items: center;
	gap: .5em;
	font: inherit;
	font-weight: 600;
	line-height: 1;
	color: var(--mydg-ink);
	background: var(--mydg-bg);
	border: 1px solid var(--mydg-line);
	border-radius: var(--mydg-radius-sm);
	padding: .7em 1.1em;
	cursor: pointer;
	text-decoration: none;
	transition: background .15s ease, border-color .15s ease, transform .05s ease;
}
.mydg .mydg-btn:hover { border-color: #cbd4da; background: var(--mydg-bg-soft); }
.mydg .mydg-btn:active { transform: translateY(1px); }
.mydg .mydg-btn[disabled] { opacity: .55; cursor: not-allowed; }

.mydg .mydg-btn--primary {
	color: #fff;
	background: var(--mydg-teal);
	border-color: var(--mydg-teal);
}
.mydg .mydg-btn--primary:hover { background: var(--mydg-teal-dark); border-color: var(--mydg-teal-dark); }
.mydg .mydg-btn--lg { padding: .9em 1.5em; font-size: 1.05rem; }
.mydg .mydg-btn--sm { padding: .5em .8em; font-size: .9rem; }
.mydg .mydg-btn--block { width: 100%; justify-content: center; }
.mydg .mydg-btn svg { flex: none; }

.mydg .mydg-link-danger {
	background: none;
	border: none;
	color: var(--mydg-ink-soft);
	font-size: 1.4rem;
	line-height: 1;
	cursor: pointer;
	padding: .1em .3em;
	border-radius: 6px;
}
.mydg .mydg-link-danger:hover { color: var(--mydg-red); background: #fbeceb; }

/* ---------------- pills / badges ---------------- */
.mydg .mydg-pill {
	display: inline-block;
	font-size: .8rem;
	font-weight: 600;
	padding: .25em .7em;
	border-radius: 999px;
	white-space: nowrap;
}
.mydg .mydg-pill--success { background: #e4f3eb; color: var(--mydg-green); }
.mydg .mydg-pill--pending { background: #fdf0db; color: var(--mydg-amber); }
.mydg .mydg-pill--failed  { background: #fbeceb; color: var(--mydg-red); }
.mydg .mydg-pill--muted   { background: var(--mydg-bg-soft); color: var(--mydg-ink-soft); }

.mydg .mydg-badge {
	display: inline-block;
	font-size: .75rem;
	font-weight: 600;
	padding: .25em .6em;
	border-radius: 6px;
}
.mydg .mydg-badge--type {
	position: absolute;
	top: .75rem;
	left: .75rem;
	background: rgba(20, 32, 43, .72);
	color: #fff;
	backdrop-filter: blur(4px);
}

.mydg .mydg-notice {
	border-radius: var(--mydg-radius-sm);
	padding: .8rem 1rem;
	font-size: .95rem;
}
.mydg .mydg-notice--warn { background: #fdf0db; color: var(--mydg-amber); }

/* ---------------- products grid ---------------- */
.mydg-products {
	display: grid;
	grid-template-columns: repeat(var(--mydg-cols, 3), 1fr);
	gap: 1.5rem;
}
@media (max-width: 900px) { .mydg-products { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .mydg-products { grid-template-columns: 1fr; } }

.mydg .mydg-card {
	background: var(--mydg-bg);
	border: 1px solid var(--mydg-line);
	border-radius: var(--mydg-radius);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: box-shadow .2s ease, transform .2s ease;
}
.mydg .mydg-card:hover { box-shadow: var(--mydg-shadow); transform: translateY(-2px); }

.mydg .mydg-card__media {
	position: relative;
	display: block;
	aspect-ratio: 4 / 3;
	background: var(--mydg-bg-soft);
	overflow: hidden;
}
.mydg .mydg-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mydg .mydg-card__placeholder {
	display: flex; align-items: center; justify-content: center;
	height: 100%; color: #b5c0c7;
}

.mydg .mydg-card__body { padding: 1rem 1.1rem 1.2rem; display: flex; flex-direction: column; gap: .55rem; flex: 1; }
.mydg .mydg-card__title { font-size: 1.05rem; font-weight: 600; margin: 0; line-height: 1.35; }
.mydg .mydg-card__title a { color: inherit; text-decoration: none; }
.mydg .mydg-card__title a:hover { color: var(--mydg-teal); }
.mydg .mydg-card__price { font-size: 1.15rem; font-weight: 700; color: var(--mydg-teal-dark); }
.mydg .mydg-card__actions { margin-top: auto; padding-top: .35rem; }
.mydg .mydg-card__actions .mydg-btn { width: 100%; justify-content: center; }

.mydg .mydg-pagination {
	grid-column: 1 / -1;
	display: flex;
	gap: .4rem;
	flex-wrap: wrap;
	justify-content: center;
	margin-top: 1rem;
}
.mydg .mydg-pagination .page-numbers {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 2.2em; height: 2.2em; padding: 0 .6em;
	border: 1px solid var(--mydg-line); border-radius: var(--mydg-radius-sm);
	text-decoration: none; color: var(--mydg-ink);
}
.mydg .mydg-pagination .page-numbers.current { background: var(--mydg-teal); color: #fff; border-color: var(--mydg-teal); }
.mydg .mydg-pagination .page-numbers:hover:not(.current) { background: var(--mydg-bg-soft); }

/* ---------------- cart ---------------- */
.mydg-cart__table { width: 100%; border-collapse: collapse; margin-bottom: 1.5rem; }
.mydg-cart__table th {
	text-align: left;
	font-size: .8rem;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: var(--mydg-ink-soft);
	border-bottom: 1px solid var(--mydg-line);
	padding: .6rem .5rem;
}
.mydg-cart__table td { padding: .85rem .5rem; border-bottom: 1px solid var(--mydg-line); vertical-align: middle; }
.mydg-cart__product { display: flex; align-items: center; gap: .8rem; }
.mydg-cart__product img { width: 52px; height: 52px; object-fit: cover; border-radius: var(--mydg-radius-sm); }
.mydg .mydg-qty {
	width: 70px; padding: .45em .5em;
	border: 1px solid var(--mydg-line); border-radius: var(--mydg-radius-sm);
	font: inherit; text-align: center;
}

.mydg-cart__summary {
	max-width: 380px;
	margin-left: auto;
	background: var(--mydg-bg-soft);
	border: 1px solid var(--mydg-line);
	border-radius: var(--mydg-radius);
	padding: 1.1rem 1.3rem;
}
.mydg .mydg-summary-row {
	display: flex; justify-content: space-between; gap: 1rem;
	padding: .35rem 0; color: var(--mydg-ink-soft);
}
.mydg .mydg-summary-row--total {
	margin-top: .4rem; padding-top: .7rem;
	border-top: 1px solid var(--mydg-line);
	color: var(--mydg-ink); font-size: 1.15rem; font-weight: 700;
}
.mydg-cart__actions { margin-top: 1.25rem; display: flex; justify-content: flex-end; }

/* ---------------- checkout ---------------- */
.mydg-checkout__grid {
	display: grid;
	grid-template-columns: 1.5fr 1fr;
	gap: 2rem;
	align-items: start;
}
@media (max-width: 800px) { .mydg-checkout__grid { grid-template-columns: 1fr; } }

.mydg .mydg-fieldset {
	border: 1px solid var(--mydg-line);
	border-radius: var(--mydg-radius);
	padding: 1.2rem 1.3rem 1.4rem;
	margin: 0 0 1.25rem;
}
.mydg .mydg-fieldset legend {
	font-weight: 650; padding: 0 .5rem; font-size: 1.05rem;
}
.mydg .mydg-field { display: block; margin-bottom: .9rem; }
.mydg .mydg-field > span { display: block; font-size: .9rem; font-weight: 500; margin-bottom: .35rem; color: var(--mydg-ink-soft); }
.mydg .mydg-field input {
	width: 100%; font: inherit; padding: .65em .8em;
	border: 1px solid var(--mydg-line); border-radius: var(--mydg-radius-sm);
	background: var(--mydg-bg); color: var(--mydg-ink);
}
.mydg .mydg-field input:focus {
	outline: none; border-color: var(--mydg-teal);
	box-shadow: 0 0 0 3px var(--mydg-teal-soft);
}
.mydg .mydg-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 480px) { .mydg .mydg-field-row { grid-template-columns: 1fr; } }

.mydg .mydg-radio { display: flex; align-items: center; gap: .6rem; padding: .5rem 0; cursor: pointer; }
.mydg .mydg-radio input { width: auto; }

.mydg-checkout__summary {
	background: var(--mydg-bg-soft);
	border: 1px solid var(--mydg-line);
	border-radius: var(--mydg-radius);
	padding: 1.3rem;
	position: sticky;
	top: 1.5rem;
}
.mydg-checkout__summary h3 { margin: 0 0 .9rem; font-size: 1.1rem; }
.mydg .mydg-order-lines { list-style: none; margin: 0 0 1rem; padding: 0; }
.mydg .mydg-order-lines li {
	display: flex; justify-content: space-between; gap: 1rem;
	padding: .4rem 0; border-bottom: 1px dashed var(--mydg-line); font-size: .95rem;
}
.mydg .mydg-order-lines__name { color: var(--mydg-ink-soft); }
.mydg-checkout__summary .mydg-cart__summary { max-width: none; margin: 0 0 1.1rem; background: var(--mydg-bg); }
.mydg .mydg-checkout__error { color: var(--mydg-red); font-size: .9rem; margin: .8rem 0 0; }

/* ---------------- toast ---------------- */
.mydg-toast {
	position: fixed;
	bottom: 1.5rem;
	left: 50%;
	transform: translate(-50%, 1rem);
	background: var(--mydg-ink, #14202b);
	color: #fff;
	padding: .8rem 1.3rem;
	border-radius: 999px;
	font-size: .95rem;
	font-weight: 500;
	box-shadow: 0 8px 28px rgba(20, 32, 43, .25);
	opacity: 0;
	z-index: 99999;
	transition: opacity .25s ease, transform .25s ease;
	pointer-events: none;
}
.mydg-toast.is-visible { opacity: 1; transform: translate(-50%, 0); }

/* ---------------- thank-you ---------------- */
.mydg-wrap.mydg-thankyou { max-width: 720px; margin: 3rem auto; padding: 0 1.25rem; }
.mydg-thankyou .mydg-card {
	border: 1px solid var(--mydg-line, #e3e8ec);
	border-radius: 14px;
	padding: 2rem;
	text-align: center;
}
.mydg-thankyou .mydg-badge-success { color: #14794a; font-weight: 700; }
.mydg-thankyou .mydg-badge-pending { color: #b76e00; font-weight: 700; }
.mydg-thankyou .mydg-badge-failed  { color: #b3261e; font-weight: 700; }

/* ---------------- single product ---------------- */
.mydg-single__media {
	margin: 0 0 1.75rem;
	border-radius: var(--mydg-radius, 12px);
	overflow: hidden;
	background: var(--mydg-bg-soft, #f6f8f9);
}
.mydg-single__media img { display: block; width: 100%; height: auto; }

.mydg.mydg-single { display: block; }
.mydg-single__content { margin-bottom: 1.75rem; }

.mydg-single__purchase {
	border: 1px solid var(--mydg-line, #e3e8ec);
	border-radius: var(--mydg-radius, 12px);
	padding: 1.4rem 1.5rem;
	background: var(--mydg-bg, #fff);
	box-shadow: var(--mydg-shadow, 0 6px 20px rgba(20,32,43,.06));
	max-width: 420px;
}
.mydg-single__meta {
	display: flex; align-items: center; gap: .75rem; flex-wrap: wrap;
	margin-bottom: .75rem;
}
.mydg-single__sku { font-size: .85rem; color: var(--mydg-ink-soft, #4a5b68); }
.mydg-single__price {
	font-size: 1.9rem; font-weight: 700; line-height: 1;
	color: var(--mydg-teal-dark, #0a5d5c); margin-bottom: 1.1rem;
}
.mydg-single__buy { display: flex; align-items: flex-end; gap: .9rem; flex-wrap: wrap; }
.mydg-single__qty { display: flex; flex-direction: column; gap: .35rem; }
.mydg-single__qty > span { font-size: .85rem; font-weight: 500; color: var(--mydg-ink-soft, #4a5b68); }
.mydg-single__qty .mydg-qty { width: 90px; }
.mydg-single__buy .mydg-add-to-cart { flex: 1; min-width: 200px; justify-content: center; }

/* ---------------- cart count badge (nav menu) ---------------- */
.mydg-cart-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.4em;
	height: 1.4em;
	padding: 0 .4em;
	margin-left: .35em;
	font-size: .72em;
	font-weight: 700;
	line-height: 1;
	color: #fff;
	background: #0e7c7b;
	border-radius: 999px;
	vertical-align: middle;
}

/* v1.1.0 — courses */
.mydg .mydg-qty-locked { display: inline-block; min-width: 2.5em; text-align: center; font-weight: 600; }
.mydg .mydg-field-hint { font-size: .85rem; color: #4a5b68; margin: -.25rem 0 .75rem; }
.mydg-course-access { display: flex; justify-content: space-between; align-items: center; gap: 1rem; border: 1px solid #e3e8ec; border-radius: 12px; padding: 1rem 1.2rem; margin-bottom: .8rem; background: #f6fbfa; }
.mydg-course-access__name { font-weight: 700; }
.mydg-course-access__meta { font-size: .9rem; color: #4a5b68; }