/* purpose: Translate portal layout
   author: MD Hub
   date: 2026-10-02 */
#mdt_root{
	--mdt-accent:var(--bo-accent,#0369a1);
	--mdt-ink:var(--bo-text,#0f172a);
	--mdt-muted:var(--bo-text-muted,#64748b);
	--mdt-card:var(--bo-bg-elevated,#fff);
	--mdt-line:var(--bo-border,#e2e8f0);
	--mdt-page:var(--bo-bg,#fff);
	max-width:720px;
	margin:0 auto;
	color:var(--mdt-ink);
	padding-bottom:1.5rem;
}
#mdt_root.is-portal{padding:0 0 2rem}
.mdt-lead{margin:0 0 .9rem;font-size:.95rem;line-height:1.45;color:var(--mdt-muted)}
.mdt-langs{display:grid;grid-template-columns:1fr auto 1fr;gap:.5rem;align-items:end;margin:0 0 .85rem}
.mdt-field{display:flex;flex-direction:column;gap:.25rem;min-width:0}
.mdt-field span,.mdt-kicker{font-size:.72rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--mdt-muted)}
.mdt-field select,#mdt_text{
	width:100%;
	box-sizing:border-box;
	border:1px solid var(--mdt-line);
	border-radius:.75rem;
	background:var(--mdt-page);
	color:var(--mdt-ink);
	font:inherit;
	font-size:1rem;
}
.mdt-field select{padding:.65rem .7rem}
#mdt_text{padding:.75rem .8rem;resize:vertical;min-height:8.5rem}
.mdt-swap{
	width:44px;height:44px;border-radius:12px;border:1px solid var(--mdt-line);
	background:var(--mdt-card);color:var(--mdt-ink);cursor:pointer
}
.mdt-tabs{display:flex;gap:.35rem;margin:0 0 .75rem}
.mdt-tab{
	flex:1;border:1px solid var(--mdt-line);background:var(--mdt-card);color:var(--mdt-muted);
	border-radius:.8rem;padding:.6rem .4rem;font-weight:700;cursor:pointer
}
.mdt-tab.on{background:var(--mdt-accent);color:#fff;border-color:transparent}
.mdt-hint{margin:0 0 .7rem;font-size:.85rem;line-height:1.4;color:var(--mdt-muted)}
.mdt-row{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.mdt-go,.mdt-alt{
	border:0;border-radius:.8rem;padding:.75rem 1rem;font-weight:700;cursor:pointer;font-size:.95rem
}
.mdt-go{background:var(--mdt-accent);color:#fff}
.mdt-alt{background:var(--mdt-card);color:var(--mdt-ink);border:1px solid var(--mdt-line)}
.mdt-go:disabled,.mdt-alt:disabled,.mdt-swap:disabled{opacity:.55;cursor:wait}
.mdt-rec{min-width:9rem}
.mdt-rec.is-on{background:#b91c1c}
.mdt-file{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.mdt-preview{display:block;width:100%;max-height:280px;object-fit:contain;margin:.75rem 0 0;border-radius:.9rem;background:#0f172a}
.mdt-timer{margin:.55rem 0 0;font-variant-numeric:tabular-nums;font-weight:700}
.mdt-status{min-height:1.2rem;margin:.75rem 0;font-size:.85rem;color:var(--mdt-muted)}
.mdt-status.is-error{color:#b91c1c}
.mdt-result{margin-top:.25rem;display:flex;flex-direction:column;gap:.65rem}
.mdt-block{border:1px solid var(--mdt-line);border-radius:.9rem;padding:.75rem .85rem;background:var(--mdt-card)}
.mdt-out{background:color-mix(in srgb,var(--mdt-accent) 10%,var(--mdt-card));border-color:color-mix(in srgb,var(--mdt-accent) 28%,var(--mdt-line))}
.mdt-body{margin-top:.35rem;white-space:pre-wrap;line-height:1.45;font-size:1.02rem}
.mdt-note{margin:0;font-size:.82rem;color:var(--mdt-muted)}
.mdt-recent{margin-top:1rem}
.mdt-recent-item{
	display:block;width:100%;text-align:left;margin:.4rem 0 0;padding:.55rem .7rem;
	border:1px solid var(--mdt-line);border-radius:.75rem;background:var(--mdt-card);color:inherit;cursor:pointer
}
.mdt-recent-item small{display:block;color:var(--mdt-muted);margin-top:.15rem}
.mdt-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
@media (max-width:560px){
	.mdt-langs{grid-template-columns:1fr}
	.mdt-swap{justify-self:center}
}