/* Frontend styles (patched for non-overlap) */
*,
*::before,
*::after { box-sizing: border-box; }

.am-card { background: var(--am-bg,#111827); color: #e5e7eb; padding: 1rem; border-radius: 1rem; box-shadow: 0 10px 20px rgba(0,0,0,.2); }
.am-card h2 { margin-top: 0; }

.am-form { line-height: 1.35; }
.am-form label { display:block; margin-bottom: .9rem; min-width: 0; }
.am-form input[type="text"],
.am-form input[type="number"],
.am-form input[type="datetime-local"],
.am-form select,
.am-form textarea {
  width: 100%;
  min-width: 0; /* allow shrinking inside grid */
  padding: .65rem .8rem;
  border-radius: .6rem;
  border: 1px solid #374151;
  background:#0b1220;
  color:#e5e7eb;
}

.am-form textarea { resize: vertical; min-height: 140px; }

.am-btn { background:#2563eb; color:white; border:none; padding:.6rem 1rem; border-radius:.6rem; cursor:pointer; }
.am-btn:hover { opacity:.9; }
.am-btn-secondary { background:#374151; color:white; text-decoration:none; display:inline-block; }
.am-btn-small { padding:.35rem .6rem; font-size:.9rem; }

.am-grid {
  display:grid;
  grid-template-columns: repeat(auto-fit,minmax(280px,1fr)); /* wider min to avoid collisions */
  gap: 1rem;
  margin-bottom: 1rem;
}

.am-table-wrap { overflow:auto; }
.am-table { width:100%; border-collapse: collapse; }
.am-table th, .am-table td { border-bottom:1px solid #374151; padding:.5rem; text-align:left; }
.am-inline-form { display:flex; gap:.4rem; align-items:center; flex-wrap: wrap; }
.am-link { color:#93c5fd; }

@media (max-width: 480px){
  .am-grid { grid-template-columns: 1fr; } /* single column on very small screens */
}

@media (prefers-color-scheme: light) {
  .am-card { background:#f9fafb; color:#111827; }
  .am-form input,.am-form select,.am-form textarea { background:#fff; color:#111827; border-color:#d1d5db; }
  .am-table th, .am-table td { border-bottom:1px solid #e5e7eb; }
}



/* ===== Dashboard readability improvements ===== */
.am-filters { 
  display: grid; 
  grid-template-columns: repeat(auto-fit, minmax(180px, max-content)); 
  gap: .75rem 1rem;
  align-items: end;
  margin-bottom: 1rem;
}
.am-filters .am-btn,
.am-filters .am-btn-secondary { height: 40px; line-height: 40px; padding: 0 1rem; }

.am-table-wrap { max-width: 100%; overflow: auto; border-radius: .75rem; }
.am-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: .95rem; }
.am-table thead th {
  position: sticky; top: 0; z-index: 2;
  background: #0b1220; /* dark header background */
  color: #cbd5e1;
  font-weight: 600;
  letter-spacing: .02em;
  text-transform: none;
  white-space: nowrap;
  padding: .6rem .75rem;
  border-bottom: 1px solid #1f2937;
}
.am-table tbody td {
  padding: .55rem .75rem; 
  vertical-align: top; 
  border-bottom: 1px solid #1f2937;
  color: #e5e7eb;
}
.am-table tbody tr:nth-child(odd){ background: #0e172a; }
.am-table tbody tr:nth-child(even){ background: #0b1220; }
.am-table tbody tr:hover { background: #111827; }

/* Narrow numeric columns */
.am-table td:nth-child(1),
.am-table th:nth-child(1),
.am-table td:nth-child(3),
.am-table th:nth-child(3),
.am-table td:nth-child(6),
.am-table th:nth-child(6),
.am-table td:nth-child(9) { 
  text-align: center;
  width: 70px;
  white-space: nowrap;
}

.am-table td:nth-child(7) { /* Title column allows wrap */
  word-break: break-word;
  max-width: 360px;
}

/* Inline status update form */
.am-inline-form select,
.am-inline-form input[type="text"]{ 
  width: 180px; 
  min-width: 140px;
}
.am-inline-form .am-btn { height: 34px; padding: 0 .8rem; }

@media (max-width: 900px){
  .am-inline-form { display: grid; grid-template-columns: 1fr; gap: .35rem; }
  .am-inline-form select, .am-inline-form input[type="text"] { width: 100%; min-width: 0; }
  .am-inline-form .am-btn { width: 100%; }
}

@media (prefers-color-scheme: light){
  .am-table thead th { background: #f3f4f6; color: #111827; border-bottom-color: #e5e7eb; }
  .am-table tbody tr:nth-child(odd){ background: #ffffff; }
  .am-table tbody tr:nth-child(even){ background: #f9fafb; }
  .am-table tbody td { color: #111827; border-bottom-color: #e5e7eb; }
}