/* Exclusivo do template de testes /mobile/: Teatro. */
.mh-teatro { display: none !important; }
@media (max-width: 767px) {
  .mh-teatro { display: block !important; width: 100%; max-width: 100%; overflow: hidden; background: #fff; margin: 0; padding: 0 0 20px; box-sizing: border-box; }
  .mh-teatro, .mh-teatro * { box-sizing: border-box; }
  .mh-teatro-heading { height: 34px; border-top: 1px solid #e6e6e6; margin: 0 0 8px; }
  .mh-teatro-heading span { display: inline-block; background: #7900ff; color: #fff; font: 700 14px/26px Arial,sans-serif; padding: 0 19px 0 15px; border-radius: 0 9px 9px 0; }
  .mh-teatro-content { display: flex; align-items: flex-start; width: 100%; padding-left: 16px; }
  .mh-teatro-symbol { flex: 0 0 74px; display: block; width: 74px !important; max-width: 74px !important; height: 103px !important; object-fit: contain; margin: 0 8px 0 0; }
  .mh-teatro-track { display: flex; flex: 1 1 auto; min-width: 0; gap: 18px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity; scrollbar-width: none; -webkit-overflow-scrolling: touch; touch-action: pan-x; padding: 0 16px 8px 0; }
  .mh-teatro-track::-webkit-scrollbar { display: none; }
  .mh-teatro-card { flex: 0 0 100px; width: 100px; min-width: 100px; scroll-snap-align: start; text-align: center; text-decoration: none !important; color: #222 !important; }
  .mh-teatro-card img { display: block !important; width: 100px !important; height: 100px !important; min-width: 100px !important; max-width: 100px !important; min-height: 100px !important; max-height: 100px !important; border-radius: 50%; object-fit: cover !important; margin: 0 !important; padding: 0 !important; }
  .mh-teatro-card span { display: block; font: 400 13px/18px Arial,sans-serif; padding-top: 8px; white-space: nowrap; }
}
