/** * LIKIOMO — global mobile hardening (load last in ) * Safe areas, overflow, filter toolbars, prose tables, app shells. */ html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; } img, video, canvas { max-width: 100%; height: auto; } /* Marketing + guides: avoid accidental horizontal scroll from full-bleed sections */ body.home-page, body.guide-page, .page-about-v2 { overflow-x: hidden; } /* App shells (dashboard / employer / admin) — class set on */ body.likiomo-app { overflow-x: hidden; } body.likiomo-app .main-content { max-width: 100%; box-sizing: border-box; } /* Home — Available Tasks toolbar: safe-area padding on small phones */ @media (max-width: 480px) { body.home-page .jobs-table-section .home-task-toolbar { padding-left: max(14px, env(safe-area-inset-left)); padding-right: max(14px, env(safe-area-inset-right)); } body.home-page .jobs-table-section .home-task-filters { gap: 8px; } } /* Enterprise strip — tabs can shrink without forcing page width */ @media (max-width: 520px) { .home-enterprise-tabs__link { padding-left: 10px; padding-right: 10px; font-size: 13px; } } /* Legal prose tables */ .page-legal-v2 .legal-content table { display: block; width: 100%; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; } /* Hirer guide markdown-style tables */ .hirer-guide-table-wrap { max-width: 100%; } /* Employer: wide data tables already use .table-responsive in markup; reinforce */ body.likiomo-app .table-responsive { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; } @media (max-width: 768px) { body.likiomo-app .content-grid, body.likiomo-app .content-grid-equal { grid-template-columns: 1fr !important; } } /* Login — two-column auth layout stacks on small screens (styles mostly inline; this supplements) */ @media (max-width: 900px) { .auth-layout { flex-direction: column !important; min-height: auto !important; } .auth-image-panel { display: none !important; } .auth-card { max-width: 100% !important; width: 100% !important; } .auth-wrapper { padding-left: max(16px, env(safe-area-inset-left)); padding-right: max(16px, env(safe-area-inset-right)); } } /* Legal v2 — horizontal padding on small / notched viewports */ @media (max-width: 480px) { .page-legal-v2 .container { padding-left: max(16px, env(safe-area-inset-left)); padding-right: max(16px, env(safe-area-inset-right)); } .page-contact-v2 .container { padding-left: max(16px, env(safe-area-inset-left)); padding-right: max(16px, env(safe-area-inset-right)); } }