/* Style for tables with the class 'wp-block-table' and modifier class 'is-style-regular' */
figure.wp-block-table table {
  border-collapse: collapse;
  overflow: hidden;
}

/* Style for the first row of the table header */
figure.wp-block-table thead tr:first-child th {
  border-top: none;
}

/* Style for table header cells */
figure.wp-block-table thead tr th {
  border-bottom: 1px solid #101010;
  vertical-align: bottom;
}

/* Vertical alignment for table header cells */
figure.wp-block-table thead th {
  vertical-align: bottom;
}

/* Padding for the first column of each row */
figure.wp-block-table td:first-child,
figure.wp-block-table th:first-child,
figure.wp-block-table thead tr th:first-child {
  padding-left: 0;
}

/* Padding for the first cell of each row */
figure.wp-block-table td:first-child {
  padding-left: 0;
}

/* Style for table cells */
figure.wp-block-table td,
figure.wp-block-table th {
  border: none;
  padding: 12px 12px 12px 0;
  position: relative;
  border-bottom: 1px solid #DADEE0;
}

/* Style for table cells in rows without 'strong' elements */
figure.wp-block-table tr:not(:has(strong)) td,
figure.wp-block-table tr:not(:has(strong)) th {
  border-top: 1px solid #DADEE0;
  padding-bottom: 12px;
}

/* Style for 'strong' elements within table cells */
figure.wp-block-table td strong:before,
figure.wp-block-table th strong:before {
  content: "";
  position: absolute;
  top: -1px;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #101010;
}

/* Style for the line below 'strong' elements within table cells */
figure.wp-block-table td strong:after,
figure.wp-block-table th strong:after {
  content: "";
  position: absolute;
  bottom: -1px;
  left: -1px;
  width: 100%;
  height: 1px;
  background-color: #101010;
  z-index: -1;
}

/* Style for 'strong' elements within table cells (displayed as block) */
figure.wp-block-table td strong {
  margin-top: -1px;
  padding-top: 12px;
}

/* Style for the horizontal line above cells in rows with 'strong' elements */
figure.wp-block-table tr:has(strong) td:not(:first-child):before,
figure.wp-block-table th:not(:first-child):before {
  content: "";
  position: absolute;
  top: -1px;
  left: 0;
  height: 1px;
  width: 100%;
  background-color: #101010;
}

/* Adjust padding for cells in rows with <strong> tags */
figure.wp-block-table tr:has(strong) td,
figure.wp-block-table tr:has(strong) th {
  padding-left: 0;
  padding-bottom: 12px;
}

/* Adjust spacing between cells in rows with <strong> tags */
figure.wp-block-table tr:has(strong) td:not(:first-child),
figure.wp-block-table tr:has(strong) th:not(:first-child) {
  margin-left: 24px;
}

/* Apply bullet point for columns with <em> tag within the table */
figure.wp-block-table td:has(em) em {
  display: block;
  margin-left: 24px;
  position: relative;
}

/* Bullet point size and placement */
figure.wp-block-table td:has(em) em::before {
  content: "•";
  top: 4px;
  font-size: 16px;
  position: absolute;
  left: -24px;
}

/* Remove italics for <em> tags within the cells */
figure.wp-block-table td:has(em) em {
  font-style: normal; /* Remove italics */
}

figure.wp-block-table td:has(strong) {
  border-left: none solid white;
}

/* MEDIA QUERY for mobile devices */
@media (max-width: 767px) {

  /* Handles Images in table */
  .wp-block-table img {
    max-width: 100%;
    max-height: 24px; /* Define the maximum height for the images */
  }

  /* Column minimum height and cell padding */
  figure.wp-block-table td,
  figure.wp-block-table th,
  figure.wp-block-table thead th {
    height: 48px;
  }

  /* Set the first column to take up most of the space */
  figure.wp-block-table td:first-child,
  figure.wp-block-table th:first-child {
    flex: 2;
    min-width: 160px;
    padding: 12px 0 12px 24px !important;
  }

  /* Set fixed width for the remaining columns */
  figure.wp-block-table td:not(:first-child),
  figure.wp-block-table th:not(:first-child) {
    flex: 1;
    min-width: 100px; /* Adjust the width as needed */
    padding: 12px 6px 12px 6px !important;
  }

  /* Add 24px of empty space after the last column in the table */
  figure.wp-block-table td:last-child,
  figure.wp-block-table th:last-child {
    padding-right: 24px !important;
  }

  /* Replace italics with bullet in front */
  figure.wp-block-table td:has(em) em {
    margin-left: 16px;
  }

  /* Adjust the position of bullet points on Mobile */
  figure.wp-block-table td:has(em) em::before {
    left: -16px;
    top: -1px;
  }

  /* Adjust the font size for the entire table and rows with <strong> tags */
  figure.wp-block-table table,
  figure.wp-block-table thead,
  figure.wp-block-table thead th,
  figure.wp-block-table tbody,
  figure.wp-block-table tr,
  figure.wp-block-table th,
  figure.wp-block-table td,
  figure.wp-block-table td strong,
  figure.wp-block-table th strong {
    font-size: 14px !important;
  }
}