/* MUK Health Affiliates — partner page. Mobile-first, big touch targets, MUK palette. */
.muka {
	--g: #1F3D2C; --g2: #26301F; --ink: #0E1C13; --cream: #F7F4EC; --cream2: #EFE9DB; --line: #E7E0CD;
	--gold: #C9A86A; --gold2: #82652F; --mut: #60665B; --wa: #1FA855; --bad: #B3261E;
	--r: 18px; --serif: "Cormorant Garamond", Georgia, serif; --sans: "Jost", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	max-width: 1080px; margin: 0 auto; padding: 8px 16px 40px; color: var(--ink); font-family: var(--sans); font-size: 16px; line-height: 1.5;
	-webkit-font-smoothing: antialiased; box-sizing: border-box;
}
.muka *, .muka *::before, .muka *::after { box-sizing: border-box; }
.muka--ur { --sans: "Noto Nastaliq Urdu", "Noto Naskh Arabic", "Jameel Noori Nastaleeq", "Segoe UI", Tahoma, sans-serif; line-height: 1.9; }
.muka--ur .muka-h1, .muka--ur .muka-h2, .muka--ur .muka-h3 { font-family: var(--sans); font-weight: 700; letter-spacing: 0; line-height: 1.6; }
.muka p { margin: 0; }
.muka a { color: var(--g); }
.muka-i { width: 20px; height: 20px; flex: none; }

/* Top bar */
.muka-top { display: flex; justify-content: flex-end; margin-bottom: 8px; }
.muka-lang { display: inline-flex; background: #fff; border: 1px solid var(--line); border-radius: 999px; padding: 3px; }
.muka-lang a { padding: 6px 14px; border-radius: 999px; font-size: 14px; text-decoration: none; color: var(--mut); line-height: 1.4; }
.muka-lang a.is-on { background: var(--g); color: var(--cream); }

/* Type */
.muka-kicker { font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: var(--gold2); font-weight: 600; margin-bottom: 10px !important; }
.muka--ur .muka-kicker { letter-spacing: 0; font-size: 14px; }
.muka-h1 { font-family: var(--serif); font-weight: 700; font-size: clamp(32px, 8vw, 50px); line-height: 1.05; color: var(--g); margin: 0 0 12px; letter-spacing: -.01em; }
.muka-h2 { font-family: var(--serif); font-weight: 700; font-size: 30px; line-height: 1.1; color: var(--g); margin: 8px 0 8px; }
.muka-h3 { font-family: var(--serif); font-weight: 700; font-size: 25px; line-height: 1.15; color: var(--g); margin: 0 0 12px; }
.muka-sub { color: var(--mut); font-size: 17px; }
.muka-hint { color: var(--mut); font-size: 14px; margin-top: 8px !important; }
.muka-label { font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: var(--mut); font-weight: 600; margin-bottom: 8px !important; }
.muka--ur .muka-label { letter-spacing: 0; font-size: 14px; }
.muka-mt { margin-top: 22px !important; }

/* Hero */
.muka-hero { padding: 18px 2px 22px; }
.muka-steps { list-style: none; margin: 22px 0 0; padding: 0; display: grid; gap: 10px; }
.muka-steps li { display: grid; grid-template-columns: 44px 1fr; grid-template-rows: auto auto; column-gap: 12px; align-items: center; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; }
.muka-steps__n { grid-row: span 2; width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: var(--cream); color: var(--g); }
.muka-steps strong { font-size: 16px; color: var(--ink); }
.muka-steps em { font-style: normal; color: var(--mut); font-size: 14px; }

/* Cards */
.muka-card { background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 22px 18px; margin-bottom: 14px; box-shadow: 0 1px 0 rgba(14, 28, 19, .03), 0 12px 30px -18px rgba(14, 28, 19, .18); }
.muka-card [hidden] { display: none !important; }

/* Forms */
.muka-form { display: grid; gap: 14px; }
.muka-f { display: grid; gap: 6px; margin: 0; }
.muka-f > span:first-child, .muka-f > span[data-num-m], .muka-f > span[data-num-b] { font-size: 15px; font-weight: 600; color: var(--ink); }
.muka-f small { font-weight: 400; color: var(--mut); font-size: 13px; }
.muka input[type="text"], .muka input[type="tel"], .muka input[type="email"], .muka input[type="password"] {
	width: 100%; height: 54px; padding: 0 16px; font: inherit; font-size: 17px; color: var(--ink); background: var(--cream);
	border: 1.5px solid transparent; border-radius: 14px; outline: none; box-shadow: none; margin: 0; transition: border-color .15s, background .15s;
}
.muka input::placeholder { color: #9AA093; }
.muka input:focus { border-color: var(--g); background: #fff; }
.muka-f.is-bad input { border-color: var(--bad); background: #fff; }
.muka-pw { position: relative; display: block; }
.muka-pw input { padding-inline-end: 84px !important; }
.muka .muka-pw__t, .muka .muka-pw__t:hover, .muka .muka-pw__t:focus { position: absolute; inset-inline-end: 6px; top: 7px; height: 40px; padding: 0 14px; border: 0; border-radius: 10px; background: #fff; color: var(--g); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; }
.muka-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.muka-note { background: var(--cream); border-radius: 12px; padding: 12px 14px; color: var(--g2); font-size: 15px; }
.muka-fine { font-size: 13px; color: var(--mut); text-align: center; }
.muka-switch { text-align: center; margin-top: 18px !important; color: var(--mut); font-size: 15px; }
.muka-switch a { font-weight: 700; text-decoration: none; border-bottom: 2px solid var(--gold); }
.muka-alert { background: #FCEEEC; border: 1px solid #F2C9C4; color: var(--bad); border-radius: 12px; padding: 12px 14px; margin-bottom: 14px; font-size: 15px; }
.muka-alert p + p { margin-top: 4px; }
.muka-ok { display: flex; align-items: center; gap: 8px; color: var(--g); font-weight: 600; margin-bottom: 10px !important; }

/* Buttons */
.muka .muka-btn, .muka button.muka-btn, .muka a.muka-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 50px; padding: 0 22px; border-radius: 999px;
	border: 1.5px solid var(--g); background: var(--g); color: var(--cream) !important; font: inherit; font-size: 16px; font-weight: 600;
	text-decoration: none !important; cursor: pointer; transition: transform .12s, background .15s, color .15s, opacity .15s; -webkit-tap-highlight-color: transparent; line-height: 1.2;
}
.muka .muka-btn:hover, .muka .muka-btn:focus { background: var(--g2); }
.muka .muka-btn:active { transform: scale(.98); }
.muka .muka-btn:focus-visible { outline: 3px solid var(--gold); outline-offset: 2px; }
.muka .muka-btn--big { width: 100%; min-height: 58px; font-size: 18px; margin-top: 4px; }
.muka .muka-btn--ghost { background: #fff; color: var(--g) !important; }
.muka .muka-btn--ghost:hover, .muka .muka-btn--ghost:focus { background: var(--cream); }
.muka .muka-btn--soft { background: var(--cream); border-color: var(--cream); color: var(--g) !important; }
.muka .muka-btn--soft:hover, .muka .muka-btn--soft:focus { background: var(--cream2); }
.muka .muka-btn--text { background: none; border-color: transparent; color: var(--mut) !important; }
.muka .muka-btn--text:hover, .muka .muka-btn--text:focus { background: var(--cream); }
.muka .muka-btn--wa { background: var(--wa); border-color: var(--wa); }
.muka .muka-btn--wa:hover, .muka .muka-btn--wa:focus { background: #188f47; }
.muka .muka-btn--sm { min-height: 40px; padding: 0 14px; font-size: 14px; }
.muka .muka-btn.is-done { background: var(--g) !important; color: var(--cream) !important; }
.muka .muka-btn[disabled] { opacity: .6; cursor: progress; }

/* Dashboard */
.muka-toast { display: flex; align-items: center; gap: 10px; background: var(--g); color: var(--cream); border-radius: 14px; padding: 14px 16px; margin-bottom: 14px; font-weight: 600; animation: muka-in .5s ease both; }
@keyframes muka-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.muka-dash-head { padding: 8px 2px 16px; }
.muka-code { background: linear-gradient(160deg, #fff 0%, #fff 55%, var(--cream) 100%); }
.muka-code__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.muka-code__val { font-family: var(--serif); font-size: clamp(38px, 11vw, 54px); line-height: 1; color: var(--g); letter-spacing: .06em; word-break: break-all; font-weight: 700; }
.muka-link { display: flex; gap: 8px; }
.muka-link input { flex: 1; min-width: 0; font-size: 15px !important; height: 50px !important; }
.muka-share { display: grid; gap: 10px; margin-top: 18px; }
.muka-share .muka-btn { width: 100%; min-height: 56px; font-size: 17px; }
.muka-money { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-bottom: 8px; }
.muka-money .muka-tile--hero { grid-column: 1 / -1; order: -1; flex-direction: row; flex-wrap: wrap; align-items: baseline; column-gap: 12px; padding: 16px 18px; }
.muka-money .muka-tile--hero span { width: 100%; }
.muka-money .muka-tile--hero strong { font-size: 34px; }
@media (min-width: 640px) {
	.muka-money { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.muka-money .muka-tile--hero { grid-column: auto; order: 0; flex-direction: column; padding: 14px 12px; }
	.muka-money .muka-tile--hero strong { font-size: 24px; }
}
.muka-tile { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 14px 12px; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.muka-tile span { font-size: 13px; color: var(--mut); font-weight: 600; }
.muka-tile strong { font-family: var(--serif); font-size: 24px; line-height: 1.15; color: var(--g); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 700; }
.muka-tile em { font-style: normal; font-size: 12px; color: var(--mut); line-height: 1.3; }
.muka-tile--hero { background: var(--g); border-color: var(--g); }
.muka-tile--hero span, .muka-tile--hero em { color: #CFD6C9; }
.muka-tile--hero strong { color: var(--cream); }
.muka-meta { font-size: 13px; color: var(--mut); text-align: center; margin: 4px 0 16px !important; }

.muka-pay--need { border: 2px solid var(--gold); }
.muka-pay__acc { font-size: 17px; margin: 6px 0 12px !important; }
.muka-methods { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.muka-method { position: relative; margin: 0; }
.muka-method input { position: absolute; opacity: 0; inset: 0; margin: 0; }
.muka-method span { display: flex; align-items: center; justify-content: center; text-align: center; min-height: 52px; padding: 6px; border-radius: 14px; border: 1.5px solid var(--line); background: #fff; font-weight: 600; font-size: 15px; color: var(--g2); cursor: pointer; line-height: 1.2; }
.muka-method input:checked + span { border-color: var(--g); background: var(--cream); color: var(--g); box-shadow: inset 0 0 0 1px var(--g); }
.muka-method input:focus-visible + span { outline: 3px solid var(--gold); outline-offset: 2px; }
.muka-row { display: flex; gap: 10px; flex-wrap: wrap; }

.muka-empty { color: var(--mut); background: var(--cream); border-radius: 12px; padding: 16px; text-align: center; }
.muka-sales { list-style: none; margin: 0; padding: 0; }
.muka-sale { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.muka-sale:last-child { border-bottom: 0; }
.muka-sale div { display: flex; flex-direction: column; }
.muka-sale strong { font-size: 18px; color: var(--ink); }
.muka-sale em { font-style: normal; font-size: 13px; color: var(--mut); }
.muka-pill { font-size: 13px; font-weight: 600; padding: 5px 11px; border-radius: 999px; background: #FBF6EA; color: var(--gold2); white-space: nowrap; }
.muka-sale--approved .muka-pill { background: #EEF6F0; color: var(--g); }
.muka-sale--paid .muka-pill { background: var(--g); color: var(--cream); }
.muka-sale--rejected .muka-pill { background: #f2f2f0; color: #8a8f85; }
.muka-sale--rejected strong { text-decoration: line-through; color: #8a8f85; }
.muka-how { margin-top: 14px; background: var(--cream); border-radius: 12px; padding: 4px 14px; }
.muka-how summary { cursor: pointer; font-weight: 600; color: var(--g); padding: 10px 0; }
.muka-how ol { margin: 0 0 12px; padding-inline-start: 20px; color: var(--g2); font-size: 15px; }

.muka-caps { display: grid; gap: 10px; margin-top: 12px; }
.muka-cap { background: var(--cream); border-radius: 14px; padding: 14px; display: grid; gap: 10px; }
.muka-cap p { font-size: 15px; color: var(--g2); word-break: break-word; }
.muka-cap .muka-btn { justify-self: start; }

.muka-prods { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.muka-prod { display: grid; grid-template-columns: 56px 1fr auto; gap: 12px; align-items: center; padding: 8px; border: 1px solid var(--line); border-radius: 14px; }
@media (max-width: 479px) {
	.muka-prod { grid-template-columns: 56px 1fr; row-gap: 8px; }
	.muka-prod .muka-btn { grid-column: 1 / -1; width: 100%; }
}
.muka-prod__img, .muka-prod img { width: 56px !important; height: 56px !important; object-fit: cover; border-radius: 10px; background: var(--cream); margin: 0 !important; }
.muka-prod__t { display: flex; flex-direction: column; min-width: 0; }
.muka-prod__t strong { font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.muka-prod__t em { font-style: normal; color: var(--mut); font-size: 13px; }

.muka-status { text-align: center; padding: 34px 20px; }
.muka-status__i { width: 64px; height: 64px; margin: 0 auto 6px; border-radius: 50%; background: var(--cream); color: var(--g); display: grid; place-items: center; }
.muka-status__i .muka-i { width: 30px; height: 30px; }

.muka-help { display: flex; justify-content: center; gap: 22px; flex-wrap: wrap; margin-top: 18px !important; font-size: 15px; }
.muka-help a { display: inline-flex; align-items: center; gap: 6px; color: var(--mut); text-decoration: none; }
.muka-help a:hover { color: var(--g); }

/* Larger screens: hero beside the form; dashboard stays one comfortable column. */
@media (min-width: 900px) {
	.muka { padding-top: 16px; }
	.muka:has(.muka-hero) { display: grid; grid-template-columns: 1.1fr 1fr; column-gap: 48px; align-items: start; }
	.muka:has(.muka-hero) .muka-top, .muka:has(.muka-hero) .muka-help { grid-column: 1 / -1; }
	.muka-hero { padding-top: 34px; }
	.muka-auth { padding: 30px 28px; margin-top: 18px; }
	.muka:has(.muka-dash-head) > *:not(.muka-top) { max-width: 620px; margin-inline: auto; }
	.muka:has(.muka-status) > *:not(.muka-top) { max-width: 560px; margin-inline: auto; }
	.muka-share { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 380px) {
	.muka-tile strong { font-size: 19px; }
	.muka-method span { font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) { .muka-toast { animation: none; } .muka-btn { transition: none; } }

/* Hide the theme's own page title on the partner page: the hero is the title. */
body.muka-page .page-header, body.muka-page .entry-header, body.muka-page h1.entry-title { display: none; }
.muka .muka-share .muka-btn, .muka .muka-row .muka-btn { text-transform: none; letter-spacing: 0; }