/* Shared responsive safety net for every learner/customer-facing surface. */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { min-width: 0; overflow-x: hidden; }
img, svg, video, canvas { max-width: 100%; height: auto; }
iframe { max-width: 100%; }
pre, code { max-width: 100%; overflow-wrap: anywhere; }
table { max-width: 100%; }
button, input, select, textarea { max-width: 100%; font: inherit; }

/* Dialogs and pop-out content must remain usable below their desktop width. */
.modal-dialog, [role="dialog"] { max-width: calc(100vw - 1rem); }
.modal-body, [role="dialog"] { overflow-wrap: anywhere; }

@media (max-width: 767.98px) {
  :root { --app-safe-inline: max(12px, env(safe-area-inset-left)); }
  body { padding-left: env(safe-area-inset-left); padding-right: env(safe-area-inset-right); }
  main, .container, .container-fluid { min-width: 0; }
  .row > *, [class*="col-"] { min-width: 0; }
  .modal-dialog { margin: .5rem; }
  .modal-content { max-height: calc(100dvh - 1rem); }
  .modal-body { overflow-y: auto; overscroll-behavior: contain; }
  .table-responsive, table { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  input, select, textarea { font-size: max(16px, 1em); }
  button, .btn, a[role="button"] { min-height: 44px; }
  h1 { overflow-wrap: anywhere; }
}

@media (max-width: 479.98px) {
  .modal-footer { align-items: stretch; flex-direction: column; }
  .modal-footer > .btn, .modal-footer > button { width: 100%; margin-inline: 0; }
  .btn-group:not(.btn-group-vertical) { display: flex; flex-wrap: wrap; }
}

@media (hover: none) and (pointer: coarse) {
  [title] { -webkit-tap-highlight-color: transparent; }
  input[type="checkbox"], input[type="radio"] { min-width: 20px; min-height: 20px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

.public-language-picker { position:fixed; right:max(12px,env(safe-area-inset-right)); bottom:max(12px,env(safe-area-inset-bottom)); z-index:1090; display:flex; align-items:center; gap:6px; padding:7px 9px; border:1px solid rgba(127,127,127,.35); border-radius:12px; background:rgba(255,255,255,.94); color:#222; box-shadow:0 4px 18px rgba(0,0,0,.18); font:600 12px/1.2 system-ui; }
.public-language-picker select { min-height:36px; border:1px solid #aaa; border-radius:8px; background:#fff; color:#222; }
@media(max-width:480px){.public-language-picker span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.public-language-picker{padding:5px}.public-language-picker select{max-width:132px}}
