/* Shared small-screen rules for customer, authentication and public status pages. */
html { overflow-wrap: anywhere; }
img, canvas, video { max-width: 100%; }
.app-main { min-width: 0; max-width: 100%; }
.row > *, .card, .card-body, .main-content, .screen-title > *, .domain-card > * { min-width: 0; }
pre { max-width: 100%; overflow-x: auto; }
@media (max-width: 767.98px) {
  input:not([type=checkbox]):not([type=radio]), select, textarea, .form-control, .form-select { font-size: 16px !important; }
  input:not([type=hidden]):not([type=checkbox]):not([type=radio]), select, textarea { min-height: 44px; }
  li a[href], main a[href], .footer-bottom a[href] { min-height: 44px; min-width: 44px; display: inline-flex; align-items: center; }
  .btn-close { min-width: 44px; min-height: 44px; }
  button { min-width: 44px; min-height: 44px; }
  .btn, .nav-link, .sidebar-toggle, .password-toggle-btn { min-height: 44px; min-width: 44px; display: inline-flex; align-items: center; justify-content: center; white-space: normal; }
  .form-check { padding-block: 10px; }
  .form-check-label { min-height: 44px; display: inline-flex; align-items: center; }
  .btn-group, .nav, .d-flex { flex-wrap: wrap; }
  .chart-container { max-width: 100%; }
  .phone-table, .phone-table tbody, .phone-table tr, .phone-table td { display: block; width: 100%; }
  .phone-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .phone-table tr { margin-bottom: 16px; border: 1px solid #dce5ef; border-radius: 12px; padding: 8px; }
  .phone-table td { white-space: normal !important; overflow-wrap: anywhere; border: 0; text-align: left !important; }
  .phone-table td[data-label]::before { content: attr(data-label); display: block; font-size: .8rem; font-weight: 700; color: #46576b; }
  .sidebar-menu-open { overflow: hidden; }
  .sticky-save { position: sticky; bottom: 8px; z-index: 2; background: white; padding: 8px; border-radius: 10px; }
}
dialog.confirmation { width: min(92vw,440px); padding: 24px; border: 1px solid #dce5ef; border-radius: 16px; color: #132238; }
dialog.confirmation::backdrop { background: rgba(6,42,88,.6); }
dialog.confirmation button { margin: 8px; min-height: 48px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; } }