/* Phone usability fixes for the public site, loaded on every theme and skin by app/Views/common/_skin.php.
   See app/CUSTOMIZATIONS.md. */
@media (max-width:767.98px){
  /* iPhone zooms into fields whose text is under 16px */
  input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]),textarea,select{font-size:16px!important}

  /* the cookie notice must stay under the mobile menu and the login/register windows */
  .cookies-warning{z-index:1040!important;left:10px!important;right:10px!important;bottom:10px!important;width:auto!important;padding:28px 18px 18px!important}
  .cookies-warning .close{width:44px;height:44px;top:2px!important;right:2px!important;font-size:16px!important;display:flex;align-items:center;justify-content:center}
  .cookies-warning .text{line-height:22px!important;margin-bottom:14px!important}

  /* larger touch targets */
  .nav-footer ul li{margin:0 14px 0 0!important}
  .nav-footer ul li a,.footer-bottom a,.nav-footer a{display:inline-block;padding:10px 0;min-height:44px;line-height:24px}
  .poll .option,.poll .form-check{margin-bottom:6px!important}
  .poll .option label,.poll .form-check-label,.poll label{display:block;padding:9px 0;cursor:pointer}
  .poll input[type=radio],.form-check-input{width:20px;height:20px}
  .btn-reply,.btn-comment-like,.btn-delete-comment,.comment-meta a{display:inline-block;padding:8px 6px;min-height:36px}
  .modal .btn-close,.modal .close{width:44px;height:44px;padding:0!important;display:inline-flex;align-items:center;justify-content:center;opacity:.8}
  .tag-list a,.tags a{padding:8px 12px!important;margin-bottom:6px}
  .pagination .page-link,.pagination a{min-width:40px;min-height:40px;display:inline-flex;align-items:center;justify-content:center}

  /* long words / links never push the page wider than the screen */
  .post-content,.post-text,.comment-text,.page-content{overflow-wrap:anywhere}
  .post-content iframe,.post-content video,.post-content table,.page-content iframe,.page-content table{max-width:100%!important}
  .post-content table,.page-content table{display:block;overflow-x:auto}
}

/* small phones (iPhone SE, entry-level Android): the header and small cards must fit 320px */
@media (max-width:767.98px){
  .header-mobile .d-flex,.header-mobile-container,.header-mobile .container-fluid{min-width:0;max-width:100%}
  .header-mobile .mobile-logo{flex:1 1 0;min-width:0;display:flex;justify-content:center;overflow:hidden}
  .header-mobile .mobile-logo a{display:block;min-width:0;max-width:100%}
  .header-mobile .mobile-logo img{width:auto!important;max-width:100%!important;height:auto!important;max-height:46px}
  .header-mobile .menu-button,.header-mobile .mobile-search{flex:0 0 auto}
  .post-item,.post-item-small,.tbl-container,.sidebar-widget,.widget-body{box-sizing:border-box;max-width:100%}
  .tbl-container{width:100%;table-layout:fixed}
  .tbl-container .tbl-cell.right{width:auto}
}
@media (max-width:767.98px){
  /* comments: the action row (time, like, reply, delete) wraps instead of overflowing */
  .comments .row-custom,.comment-list .row-custom,.comments li .right{min-width:0;max-width:100%}
  .comments .d-flex,.comment-list .d-flex,.comments .row-custom .d-flex{flex-wrap:wrap;row-gap:4px}
  .comments li .right,.comment-list li .right{flex:1 1 auto}
  .btn-reply,.btn-comment-like,.btn-delete-comment{padding:6px 4px!important}
  /* small post meta (author, date, views) wraps on narrow screens */
  .small-post-meta,.post-meta,.item-meta{flex-wrap:wrap;white-space:normal!important;row-gap:2px}
  .small-post-meta span,.post-meta span{white-space:nowrap}
}