/* assets/dashboard-page.css
   Page specific styles for the dashboard (tiles + widgets)
*/
.page-wrap { max-width: 1200px; margin: 18px auto; padding: 8px; }

/* Quick actions: force horizontal layout, wrap and stable tile sizing */
.quick-actions {
  display: flex;
  flex-direction: row;      /* ensure horizontal row */
  gap: 14px;
  flex-wrap: wrap;
  padding: 18px;
  border-radius: 12px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.04);
  background: #fff;
  margin-bottom: 18px;
  overflow-x: auto;         /* allow horizontal scrolling on very narrow screens */
  -webkit-overflow-scrolling: touch;
}

/* tile size and layout: explicit flex so tiles don't stretch to full width */
.quick-btn {
  display: inline-flex;
  flex: 0 0 110px;          /* fixed base width: do not grow or shrink to 100% */
  box-sizing: border-box;
  min-width: 90px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 86px;
  border-radius: 8px;
  text-decoration: none;
  color: #333;
  border: 1px solid #eef2f5;
  background: #fafbfc;
  transition: transform .12s ease, box-shadow .12s ease;
}
.quick-btn:hover { transform: translateY(-4px); box-shadow:0 8px 20px rgba(0,0,0,0.06); }
.qa-icon { font-size:28px; margin-bottom:8px; }
.qa-label { font-size:14px; text-align:center; word-break:break-word; }

/* widgets row */
.widgets-row { display:flex; gap:18px; margin-bottom:18px; align-items:flex-start; }
.widget { flex:1; border-radius:12px; overflow:hidden; }
.widget-header{ padding:12px 16px; border-bottom:1px solid #f1f4f6; background:transparent; }
.widget-header h3{ margin:0; font-size:16px; }
.widget-body{ padding:12px 16px; }

/* Notifications list */
.notif-list { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:10px; }
.notif-list li { display:flex; justify-content:space-between; align-items:center; padding:8px 6px; border-radius:8px; background:#fafbfc; border:1px solid #f3f6f8; }
.badge{ background:#eef2f6; color:#0b84ff; padding:6px 10px; border-radius:12px; font-weight:700; }
.badge-warning{ background:#fff4e6; color:#a65b00; }

/* Sales summary */
.sum-row{ display:flex; justify-content:space-between; padding:10px 6px; border-radius:6px; border-bottom:1px solid #f1f4f6; align-items:center; }
.sum-label{ color:#6b7280; }
.sum-value{ background:#e6ffef; color:#086; padding:8px 12px; border-radius:8px; font-weight:800; }

/* recent sales table */
.recent-sales { margin-top:12px; border-radius:12px; overflow:hidden; }
.admin-table { width:100%; border-collapse:collapse; }
.admin-table thead th { background: #fff; padding:10px 12px; text-align:left; font-weight:700; color:#6b7280; }
.admin-table td { padding:10px 12px; border-bottom:1px solid #f1f4f6; }

/* Responsive adjustments */
@media (max-width:900px){
  .widgets-row { flex-direction:column; }
  .quick-actions { justify-content:flex-start; }
}

@media (max-width:720px) {
  .quick-btn { flex-basis: 90px; height: 80px; }
  .page-wrap { padding: 6px; }
}

@media (max-width:420px) {
  /* keep horizontal scroll rather than stacking too tall */
  .quick-actions { flex-wrap: nowrap; gap:10px; }
  .quick-btn { flex-basis: 90px; height:76px; }
}