/* EasyPrintDz CRM - Mobile Polish V20 Safe */
@media (max-width: 768px) {
  html, body {
    overflow-x: hidden !important;
  }

  body {
    background: #f6f8fb !important;
  }

  main,
  .main-content,
  .content,
  .container,
  .container-fluid,
  .max-w-7xl,
  .max-w-6xl,
  .mx-auto {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  h1 {
    font-size: 22px !important;
    line-height: 1.2 !important;
  }

  h2 {
    font-size: 18px !important;
    line-height: 1.25 !important;
  }

  h3 {
    font-size: 16px !important;
  }

  .grid {
    gap: 10px !important;
  }

  .grid-cols-2,
  .grid-cols-3,
  .grid-cols-4,
  .md\:grid-cols-2,
  .md\:grid-cols-3,
  .md\:grid-cols-4,
  .lg\:grid-cols-2,
  .lg\:grid-cols-3,
  .lg\:grid-cols-4 {
    grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
  }

  .card,
  .bg-white,
  .shadow,
  .shadow-sm,
  .rounded,
  .rounded-lg,
  .rounded-xl,
  .rounded-2xl {
    border-radius: 16px !important;
  }

  .bg-white {
    box-shadow: 0 8px 24px rgba(15, 23, 42, .06) !important;
  }

  table {
    min-width: 720px !important;
  }

  .overflow-x-auto,
  .table-responsive {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    border-radius: 16px !important;
  }

  th {
    font-size: 11px !important;
    white-space: nowrap !important;
  }

  td {
    font-size: 12px !important;
    white-space: nowrap !important;
  }

  input,
  select,
  textarea {
    width: 100% !important;
    min-height: 42px !important;
    font-size: 14px !important;
    border-radius: 12px !important;
  }

  button,
  a.btn,
  .btn,
  [type="submit"] {
    min-height: 40px !important;
    border-radius: 12px !important;
    font-size: 13px !important;
  }

  form .flex,
  .actions,
  .button-group {
    gap: 8px !important;
    flex-wrap: wrap !important;
  }

  .hidden-mobile {
    display: none !important;
  }
}

@media (max-width: 480px) {
  main,
  .main-content,
  .content,
  .container,
  .container-fluid,
  .max-w-7xl,
  .max-w-6xl,
  .mx-auto {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  h1 {
    font-size: 20px !important;
  }

  .p-6,
  .p-5,
  .p-4 {
    padding: 12px !important;
  }

  .px-6,
  .px-5,
  .px-4 {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .py-6,
  .py-5,
  .py-4 {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
  }
}