/* Full staff Declarations mobile UX: Admin, Agent and Super Admin. */
@media (max-width: 767px) {
  .staff-declarations-view {
    width: 100% !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
  }

  .staff-declarations-view > .flex:first-child {
    align-items: stretch !important;
  }

  .staff-declarations-view > .flex:first-child input,
  .staff-declarations-view > .flex:first-child button {
    width: 100% !important;
    min-height: 44px !important;
  }

  .staff-declarations-view .declaration-status-tabs {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 6px !important;
    border-bottom: 0 !important;
  }

  .staff-declarations-view .declaration-status-tabs button {
    width: 100% !important;
    min-height: 44px !important;
    justify-content: flex-start !important;
    padding: 10px 12px !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 10px !important;
    background: #fff !important;
  }

  .staff-declarations-view .declarations-table-container {
    overflow: visible !important;
    padding: 8px !important;
    background: #f8fafc !important;
  }

  .staff-declarations-view .declarations-table,
  .staff-declarations-view .declarations-table tbody {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .staff-declarations-view .declarations-table > thead {
    display: none !important;
  }

  .staff-declarations-view .declaration-summary-row {
    display: block !important;
    width: 100% !important;
    margin: 0 0 12px !important;
    padding: 10px !important;
    border: 1px solid #dbe4f0 !important;
    border-radius: 14px !important;
    background: #fff !important;
    box-shadow: 0 5px 18px rgba(15,23,42,.06) !important;
  }

  .staff-declarations-view .declaration-summary-row > td {
    display: grid !important;
    grid-template-columns: minmax(94px, 34%) minmax(0, 1fr) !important;
    align-items: start !important;
    gap: 10px !important;
    width: 100% !important;
    padding: 9px 4px !important;
    border-bottom: 1px solid #edf2f7 !important;
    text-align: left !important;
    overflow-wrap: anywhere !important;
  }

  .staff-declarations-view .declaration-summary-row > td:last-child {
    border-bottom: 0 !important;
  }

  .staff-declarations-view .declaration-summary-row > td::before {
    content: attr(data-label);
    color: #64748b !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: .04em;
    text-transform: uppercase;
  }

  .staff-declarations-view .declaration-row-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
  }

  .staff-declarations-view .declaration-row-actions::before {
    width: 94px !important;
    flex: 0 0 94px !important;
  }

  .staff-declarations-view .declaration-row-actions button {
    min-width: 42px !important;
    min-height: 40px !important;
    justify-content: center !important;
  }

  .staff-declarations-view .declaration-detail-row {
    display: block !important;
    width: 100% !important;
    margin: -7px 0 16px !important;
  }

  .staff-declarations-view .declaration-detail-row > td {
    display: block !important;
    width: 100% !important;
    padding: 10px 4px !important;
    border: 0 !important;
  }

  .staff-declarations-view [data-declaration-detail] {
    width: 100% !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
  }

  .staff-declarations-view [data-declaration-detail] :is(.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: minmax(0, 1fr) !important;
  }

  .staff-declarations-view [data-declaration-detail] :is(input,select,textarea,button) {
    max-width: 100% !important;
    min-height: 44px !important;
    font-size: 16px !important;
  }

  .staff-declarations-view [data-declaration-detail] img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 360px !important;
    object-fit: contain !important;
    border-radius: 12px !important;
    background: #f8fafc !important;
  }

  .staff-declarations-view [data-declaration-detail] .overflow-x-auto {
    overflow-x: visible !important;
  }

  .staff-declarations-view [data-declaration-detail] .flex {
    min-width: 0 !important;
  }

  .staff-declarations-view [data-declaration-detail] .justify-between {
    flex-wrap: wrap !important;
    gap: 8px !important;
  }

  .staff-declarations-view [data-declaration-detail] button.btn,
  .staff-declarations-view [data-declaration-detail] > button {
    width: 100% !important;
    justify-content: center !important;
  }

  .staff-declarations-view .fixed.inset-0 {
    align-items: flex-start !important;
    overflow-y: auto !important;
    padding: 10px !important;
  }

  .staff-declarations-view .fixed.inset-0 > div {
    max-width: 100% !important;
    margin: 10px 0 !important;
    padding: 14px !important;
  }
}