/* icons.css — Tally Business Manager icon styles */
.icon-ok    { color: #22c55e; font-style: normal; }
.icon-warn  { color: #f59e0b; font-style: normal; }
.icon-err   { color: #ef4444; font-style: normal; }
.icon-lock, .icon-unlock { color: #6b7280; font-style: normal; }
.icon-user, .icon-users  { color: #3b82f6; font-style: normal; }
.icon-box, .icon-list, .icon-chart { color: #6366f1; font-style: normal; }
.icon-key, .icon-card    { color: #8b5cf6; font-style: normal; }
.icon-gear, .icon-shield { color: #6b7280; font-style: normal; }
.icon-brand { color: #0B1F3A; font-weight: 700; font-style: normal; }
.icon-phone, .icon-msg   { color: #10b981; font-style: normal; }
.icon-money, .icon-receipt { color: #f59e0b; font-style: normal; }
.icon-biz, .icon-pin     { color: #0B1F3A; font-style: normal; }
.icon-search, .icon-add  { color: #6b7280; font-style: normal; }
.icon-star   { color: #f59e0b; font-style: normal; }
.icon-no, .icon-door     { color: #ef4444; font-style: normal; }
.icon-save, .icon-cal    { color: #3b82f6; font-style: normal; }
.icon-sq     { color: #6b7280; font-style: normal; }
.dot-green   { color: #22c55e; font-style: normal; }
.dot-gray    { color: #9ca3af; font-style: normal; }
[class^="icon-"], [class*=" icon-"], .dot-green, .dot-gray {
  display: inline-block; vertical-align: middle; line-height: 1;
}

/* ══════════════════════════════════════════
   GLOBAL RESPONSIVE RULES — all pages
══════════════════════════════════════════ */

/* Horizontal scroll on ALL tables at any screen size */
.sa-table-wrap,
.od-table-wrap,
table.sa-table,
table.od-table {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  display: block;
  width: 100%;
}

/* Generic table wrapper — applies to any table not already wrapped */
table {
  min-width: 100%;
  border-collapse: collapse;
}

/* Scrollable table wrapper for any page using class .table-responsive */
.table-responsive {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  width: 100%;
}

/* ── Responsive meta rules — all pages ── */
@media (max-width: 768px) {
  /* Ensure no page overflows horizontally */
  body { overflow-x: hidden; }

  /* Stack any flex row on mobile */
  .lt-receipt-banner { padding: 10px 14px; flex-direction: column; align-items: flex-start; }
  .lt-receipt-btn { width: 100%; justify-content: center; }

  /* Topbar: stack or shrink */
  .od-topbar { flex-wrap: wrap; gap: 8px; }
  .od-business-title h1 { font-size: 20px !important; }
  .od-top-actions { margin-left: auto; }

  /* Cards: single column */
  .od-quick-actions,
  .od-stats,
  .sa-cards-grid { grid-template-columns: 1fr 1fr !important; }

  /* Full width cards on very small screens */
}

@media (max-width: 480px) {
  .od-quick-actions,
  .od-stats,
  .sa-cards-grid { grid-template-columns: 1fr !important; }

  .od-business-title h1 { font-size: 17px !important; }
}
