
/* Scoped admin mobile: ONLY quarantine + products. Do not rewrite other admin tables. */
html.elvensong-admin-mobile,
html.elvensong-admin-mobile body {
  overflow-x: hidden;
  overscroll-behavior-x: none;
  background: #020617;
}
html.elvensong-admin-mobile #root {
  width: 100%;
  max-width: 100vw;
}

@media (max-width: 767px) {
  html.elvensong-admin-mobile body [class*="overflow-y-auto"] {
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch;
  }

  /* ---------- QUARANTINE ---------- */
  html.elvensong-admin-mobile[data-admin-page="quarantine"] main > div {
    padding-left: 12px !important;
    padding-right: 12px !important;
    max-width: 100% !important;
  }
  html.elvensong-admin-mobile[data-admin-page="quarantine"] main table {
    display: block;
    width: 100% !important;
  }
  html.elvensong-admin-mobile[data-admin-page="quarantine"] main thead {
    display: none !important;
  }
  html.elvensong-admin-mobile[data-admin-page="quarantine"] main tbody {
    display: block;
    width: 100%;
  }
  html.elvensong-admin-mobile[data-admin-page="quarantine"] main tbody tr {
    display: grid !important;
    grid-template-columns: 28px 56px minmax(0, 1fr);
    grid-template-areas:
      "cb photo name"
      "actions actions actions";
    gap: 8px 10px;
    align-items: start;
    width: 100%;
    box-sizing: border-box;
    padding: 12px 10px !important;
    border-bottom: 1px solid rgb(30 41 59);
    background: rgba(2, 6, 23, 0.55);
  }
  html.elvensong-admin-mobile[data-admin-page="quarantine"] main tbody td {
    display: block !important;
    width: auto !important;
    max-width: 100%;
    padding: 0 !important;
    border: 0 !important;
    white-space: normal !important;
  }
  html.elvensong-admin-mobile[data-admin-page="quarantine"] main tbody td:nth-child(1) { grid-area: cb; padding-top: 6px !important; }
  html.elvensong-admin-mobile[data-admin-page="quarantine"] main tbody td:nth-child(2) { grid-area: photo; }
  html.elvensong-admin-mobile[data-admin-page="quarantine"] main tbody td:nth-child(2) img {
    width: 56px !important;
    height: 56px !important;
    object-fit: cover;
    border-radius: 8px;
  }
  html.elvensong-admin-mobile[data-admin-page="quarantine"] main tbody td:nth-child(3) {
    grid-area: name;
    min-width: 0;
  }
  html.elvensong-admin-mobile[data-admin-page="quarantine"] main tbody td:nth-child(3) p {
    overflow-wrap: anywhere;
    word-break: break-word;
  }
  /* hide stock/price cells if somehow visible */
  html.elvensong-admin-mobile[data-admin-page="quarantine"] main tbody td:nth-child(4),
  html.elvensong-admin-mobile[data-admin-page="quarantine"] main tbody td:nth-child(5) {
    display: none !important;
  }
  /* ACTIONS UNDER product */
  html.elvensong-admin-mobile[data-admin-page="quarantine"] main tbody td:nth-child(6) {
    grid-area: actions;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
    text-align: left !important;
    white-space: normal !important;
    padding-top: 4px !important;
  }
  html.elvensong-admin-mobile[data-admin-page="quarantine"] main tbody td:nth-child(6) > a {
    align-self: flex-start;
    margin: 0 !important;
  }
  html.elvensong-admin-mobile[data-admin-page="quarantine"] main tbody td:nth-child(6) button,
  html.elvensong-admin-mobile[data-admin-page="quarantine"] main tbody td:nth-child(6) [role="button"] {
    width: 100% !important;
    max-width: 100% !important;
    justify-content: center !important;
    white-space: normal !important;
    height: auto !important;
    min-height: 40px;
    padding: 10px 12px !important;
  }

  /* ---------- PRODUCTS ---------- */
  html.elvensong-admin-mobile[data-admin-page="products"] main > div.p-6,
  html.elvensong-admin-mobile[data-admin-page="products"] main > div[class*="p-6"] {
    padding: 12px !important;
  }
  html.elvensong-admin-mobile[data-admin-page="products"] main .flex.items-center.gap-2.flex-wrap,
  html.elvensong-admin-mobile[data-admin-page="products"] main .flex.items-center.justify-between {
    gap: 8px !important;
  }
  html.elvensong-admin-mobile[data-admin-page="products"] main button {
    max-width: 100%;
  }
  /* danger delete buttons full width stack */
  html.elvensong-admin-mobile[data-admin-page="products"] main button.border-red-700,
  html.elvensong-admin-mobile[data-admin-page="products"] main button[class*="border-red"] {
    width: 100% !important;
    justify-content: center !important;
  }

  html.elvensong-admin-mobile[data-admin-page="products"] main table {
    display: block;
    width: 100% !important;
  }
  html.elvensong-admin-mobile[data-admin-page="products"] main thead {
    display: none !important;
  }
  html.elvensong-admin-mobile[data-admin-page="products"] main tbody {
    display: block;
  }
  html.elvensong-admin-mobile[data-admin-page="products"] main tbody tr {
    display: grid !important;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    gap: 6px 10px;
    align-items: center;
    width: 100%;
    box-sizing: border-box;
    padding: 12px 10px !important;
    border-bottom: 1px solid rgb(30 41 59);
  }
  html.elvensong-admin-mobile[data-admin-page="products"] main tbody td {
    display: block !important;
    width: auto !important;
    padding: 0 !important;
    border: 0 !important;
    text-align: left !important;
  }
  html.elvensong-admin-mobile[data-admin-page="products"] main tbody td:nth-child(1) {
    grid-column: 1;
    grid-row: 1;
  }
  html.elvensong-admin-mobile[data-admin-page="products"] main tbody td:nth-child(2) {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
  }
  html.elvensong-admin-mobile[data-admin-page="products"] main tbody td:nth-child(2) .line-clamp-1,
  html.elvensong-admin-mobile[data-admin-page="products"] main tbody td:nth-child(2) span.font-medium {
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical;
    overflow: hidden;
    white-space: normal !important;
    overflow-wrap: anywhere;
    line-height: 1.25;
  }
  html.elvensong-admin-mobile[data-admin-page="products"] main tbody td:nth-child(2) img,
  html.elvensong-admin-mobile[data-admin-page="products"] main tbody td:nth-child(2) .w-9 {
    width: 40px !important;
    height: 40px !important;
    flex-shrink: 0;
  }
  html.elvensong-admin-mobile[data-admin-page="products"] main tbody td:nth-child(3),
  html.elvensong-admin-mobile[data-admin-page="products"] main tbody td:nth-child(4) {
    display: none !important;
  }
  html.elvensong-admin-mobile[data-admin-page="products"] main tbody td:nth-child(5) {
    grid-column: 2;
    grid-row: 2;
    font-size: 13px;
  }
  html.elvensong-admin-mobile[data-admin-page="products"] main tbody td:nth-child(6) {
    grid-column: 3;
    grid-row: 2;
    font-size: 13px;
    text-align: right !important;
  }
  html.elvensong-admin-mobile[data-admin-page="products"] main tbody td:nth-child(7) {
    grid-column: 3;
    grid-row: 1;
    justify-self: end;
  }
  html.elvensong-admin-mobile[data-admin-page="products"] main tbody td:nth-child(7) > div {
    display: flex !important;
    gap: 4px;
  }

  /* ---------- SALES / ORDERS (/admin/sales) ---------- */
  html.elvensong-admin-mobile[data-admin-page="sales"] main > div.p-6,
  html.elvensong-admin-mobile[data-admin-page="sales"] main > div[class*="p-6"] {
    padding: 12px !important;
  }
  html.elvensong-admin-mobile[data-admin-page="sales"] main .flex.items-center.gap-2 {
    flex-wrap: wrap !important;
    width: 100%;
  }
  html.elvensong-admin-mobile[data-admin-page="sales"] main select {
    max-width: 100%;
    flex: 1 1 140px;
  }
  html.elvensong-admin-mobile[data-admin-page="sales"] main table {
    display: block;
    width: 100% !important;
  }
  html.elvensong-admin-mobile[data-admin-page="sales"] main thead {
    display: none !important;
  }
  html.elvensong-admin-mobile[data-admin-page="sales"] main tbody {
    display: block;
    width: 100%;
  }
  /* main order row */
  html.elvensong-admin-mobile[data-admin-page="sales"] main tbody > tr:not(:has(td[colspan])) {
    display: grid !important;
    grid-template-columns: 52px minmax(0, 1fr) 28px;
    grid-template-areas:
      "oid client chev"
      "sum status status";
    gap: 6px 10px;
    align-items: center;
    width: 100%;
    box-sizing: border-box;
    padding: 12px 10px !important;
    border-bottom: 1px solid rgb(30 41 59);
  }
  html.elvensong-admin-mobile[data-admin-page="sales"] main tbody > tr:not(:has(td[colspan])) > td {
    display: block !important;
    width: auto !important;
    padding: 0 !important;
    border: 0 !important;
    text-align: left !important;
    white-space: normal !important;
  }
  html.elvensong-admin-mobile[data-admin-page="sales"] main tbody > tr:not(:has(td[colspan])) > td:nth-child(1) {
    grid-area: oid;
    font-size: 11px;
  }
  html.elvensong-admin-mobile[data-admin-page="sales"] main tbody > tr:not(:has(td[colspan])) > td:nth-child(2) {
    grid-area: client;
    min-width: 0;
  }
  html.elvensong-admin-mobile[data-admin-page="sales"] main tbody > tr:not(:has(td[colspan])) > td:nth-child(2) .font-medium {
    overflow-wrap: anywhere;
  }
  /* delivery - show under client on mobile instead of hiding completely */
  html.elvensong-admin-mobile[data-admin-page="sales"] main tbody > tr:not(:has(td[colspan])) > td:nth-child(3) {
    display: none !important;
  }
  html.elvensong-admin-mobile[data-admin-page="sales"] main tbody > tr:not(:has(td[colspan])) > td:nth-child(4) {
    grid-area: sum;
    font-weight: 600;
    font-size: 13px;
  }
  html.elvensong-admin-mobile[data-admin-page="sales"] main tbody > tr:not(:has(td[colspan])) > td:nth-child(5) {
    grid-area: status;
    justify-self: end;
  }
  html.elvensong-admin-mobile[data-admin-page="sales"] main tbody > tr:not(:has(td[colspan])) > td:nth-child(6) {
    display: none !important;
  }
  html.elvensong-admin-mobile[data-admin-page="sales"] main tbody > tr:not(:has(td[colspan])) > td:nth-child(7) {
    grid-area: chev;
    justify-self: end;
  }
  /* expanded details row */
  html.elvensong-admin-mobile[data-admin-page="sales"] main tbody > tr:has(td[colspan]) {
    display: block !important;
    width: 100%;
    padding: 0 10px 12px !important;
    border-bottom: 1px solid rgb(30 41 59);
    background: rgba(15, 23, 42, 0.55);
  }
  html.elvensong-admin-mobile[data-admin-page="sales"] main tbody > tr:has(td[colspan]) > td {
    display: block !important;
    width: 100% !important;
    padding: 8px 0 0 !important;
  }
  html.elvensong-admin-mobile[data-admin-page="sales"] main tbody > tr:has(td[colspan]) button {
    max-width: 100%;
  }
  html.elvensong-admin-mobile[data-admin-page="sales"] main tbody > tr:has(td[colspan]) .flex.flex-wrap {
    gap: 8px !important;
  }
  html.elvensong-admin-mobile[data-admin-page="sales"] main tbody > tr:has(td[colspan]) input {
    max-width: 100% !important;
    width: 100% !important;
  }
}


/* AUDIT_CONTRAST_1_0_4 — readable admin text + no sticky overlays */
html.elvensong-admin-mobile .muted,
html.elvensong-admin-mobile .text-slate-400,
html.elvensong-admin-mobile .text-slate-500,
html.elvensong-admin-mobile .text-slate-600,
html.elvensong-admin-mobile .text-gray-400,
html.elvensong-admin-mobile .text-gray-500 {
  color: #e2e8f0 !important;
}
html.elvensong-admin-mobile button:not(:disabled) {
  color: #f8fafc !important;
}
html.elvensong-admin-mobile input::placeholder,
html.elvensong-admin-mobile textarea::placeholder {
  color: #94a3b8 !important;
  opacity: 1 !important;
}
html.elvensong-admin-mobile main .sticky,
html.elvensong-admin-mobile main [class*="sticky"] {
  position: static !important;
  top: auto !important;
  z-index: auto !important;
}
