/*
 * MOBILE FIX - LOAD LAST
 * This file MUST be loaded after all other CSS files
 * Contains aggressive overrides to fix mobile layout issues
 *
 * DO NOT REMOVE OR MODIFY WITHOUT TESTING ON MOBILE FIRST
 */

/* Force viewport to 100% width - highest priority */
@media (max-width: 768px) {
  /* Prevent horizontal scrolling */
  html, body {
    max-width: 100vw !important;
    overflow-x: hidden !important;
  }
  /* Container overrides */
  .admin-page .container,
  .admin-container .container,
  div.container,
  body .container,
  html body .container,
  html body .admin-page .container,
  html body .admin-container .container,
  html body div.container {
    padding-left: 15px !important;
    padding-right: 15px !important;
    max-width: 100% !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }

  /* Card overrides */
  .card,
  div.card,
  body .card,
  html body .card,
  html body div.card {
    padding: 1.25rem !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* All input elements */
  input[type="text"],
  input[type="email"],
  input[type="search"],
  input[type="password"],
  input[type="url"],
  input[type="tel"],
  select,
  textarea,
  body input[type="text"],
  body input[type="email"],
  body input[type="search"],
  body select,
  body textarea,
  html body input[type="text"],
  html body input[type="email"],
  html body input[type="search"],
  html body select,
  html body textarea {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  /* Specific input classes */
  .filter-select,
  .search-input,
  .filter-input,
  .form-input,
  .form-textarea,
  .time-input,
  .tag-input,
  body .filter-select,
  body .search-input,
  body .filter-input,
  body .form-input,
  body .form-textarea,
  body .time-input,
  body .tag-input,
  html body .filter-select,
  html body .search-input,
  html body .filter-input,
  html body .form-input,
  html body .form-textarea,
  html body .time-input,
  html body .tag-input,
  html body input.filter-select,
  html body select.filter-select,
  html body input.search-input,
  html body input.filter-input,
  html body input.form-input,
  html body textarea.form-textarea,
  html body input.time-input,
  html body input.tag-input {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  /* Form groups and filter groups */
  .form-group,
  .filter-group,
  body .form-group,
  body .filter-group,
  html body .form-group,
  html body .filter-group,
  html body div.form-group,
  html body div.filter-group {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  /* Toolbar */
  .inbox-toolbar,
  body .inbox-toolbar,
  html body .inbox-toolbar,
  html body div.inbox-toolbar {
    padding: 1rem !important;
  }
}

@media (max-width: 480px) {
  /* Container overrides */
  .admin-page .container,
  .admin-container .container,
  div.container,
  body .container,
  html body .container,
  html body .admin-page .container,
  html body .admin-container .container,
  html body div.container {
    padding-left: 10px !important;
    padding-right: 10px !important;
    max-width: 100% !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }

  /* Card overrides */
  .card,
  div.card,
  body .card,
  html body .card,
  html body div.card {
    padding: 1rem !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* All input elements */
  input[type="text"],
  input[type="email"],
  input[type="search"],
  input[type="password"],
  input[type="url"],
  input[type="tel"],
  select,
  textarea,
  body input[type="text"],
  body input[type="email"],
  body input[type="search"],
  body select,
  body textarea,
  html body input[type="text"],
  html body input[type="email"],
  html body input[type="search"],
  html body select,
  html body textarea {
    padding: 0.625rem !important;
    font-size: 0.9rem !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  /* Specific input classes */
  .filter-select,
  .search-input,
  .filter-input,
  .form-input,
  .form-textarea,
  .time-input,
  .tag-input,
  body .filter-select,
  body .search-input,
  body .filter-input,
  body .form-input,
  body .form-textarea,
  body .time-input,
  body .tag-input,
  html body .filter-select,
  html body .search-input,
  html body .filter-input,
  html body .form-input,
  html body .form-textarea,
  html body .time-input,
  html body .tag-input,
  html body input.filter-select,
  html body select.filter-select,
  html body input.search-input,
  html body input.filter-input,
  html body input.form-input,
  html body textarea.form-textarea,
  html body input.time-input,
  html body input.tag-input {
    padding: 0.5rem 0.75rem !important;
    font-size: 0.875rem !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  /* Toolbar */
  .inbox-toolbar,
  body .inbox-toolbar,
  html body .inbox-toolbar,
  html body div.inbox-toolbar {
    padding: 0.875rem !important;
  }

  /* Thread sections */
  .thread-detail-header,
  .thread-messages,
  .reply-composer,
  .thread-tags-section,
  html body .thread-detail-header,
  html body .thread-messages,
  html body .reply-composer,
  html body .thread-tags-section {
    padding: 1rem !important;
  }
}