html, body { height: 100%; }
body { display: flex; flex-direction: column; }
.ratio-21x9 { --bs-aspect-ratio: calc(9 / 21 * 100%); }
.object-fit-cover { object-fit: cover; height: 160px; }
@media (min-width: 768px) { .object-fit-cover { height: 180px; } }
@media (min-width: 1200px) { .object-fit-cover { height: 200px; } }

/* Simple RTL helpers */
.rtl { direction: rtl; }
.rtl .input-group > :not(:last-child) { border-top-left-radius: .375rem; border-bottom-left-radius: .375rem; }
.rtl .input-group > :not(:first-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }