/* ==============================================
   Table Styles — Professional & Responsive
   ============================================== */

article.content table,
.mori-page-Start table:not([class]) {
  width: 100%;
  border-collapse: collapse;
  margin: 24px 0;
  font-size: 15px;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 1px 4px color-mix(in srgb, var(--black) 12%, transparent);
  display: block;
  overflow-x: auto;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
}

article.content thead,
.mori-page-Start thead {
  border-bottom: 2px solid var(--light-Gray);
}

article.content thead th,
.mori-page-Start thead th {
  background-color: var(--Dark-Gray);
  color: var(--white);
  padding: 12px 16px;
  text-align: right;
  font-weight: 600;
  white-space: nowrap;
}

article.content tbody td,
.mori-page-Start tbody td {
  padding: 10px 16px;
  border-bottom: 1px solid var(--Dark-Gray);
  vertical-align: middle;
  transition: background-color 0.2s ease;
}

article.content tbody tr:last-child td,
.mori-page-Start tbody tr:last-child td {
  border-bottom: none;
}

article.content tbody tr:nth-child(even),
.mori-page-Start tbody tr:nth-child(even) {
  background-color: color-mix(in srgb, var(--light-Gray) 15%, transparent);
}

article.content tbody tr:hover td,
.mori-page-Start tbody tr:hover td {
  background-color: color-mix(in srgb, var(--white) 8%, transparent);
}

@media only screen and (max-width: 767px) {
  article.content thead th,
  article.content tbody td,
  .mori-page-Start thead th,
  .mori-page-Start tbody td {
    padding: 8px 12px;
    font-size: 14px;
  }
}