/* cards */

.content .cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
  gap: 10px;
  text-align: left;
  padding-top: 5px;
}

.cntnt_showfaqs .faq_list_block {
  margin-bottom: 2rem;
}

.cntnt_showfaqs .widecards {
  margin-top: 1rem;
}
.border_accent {
    border: 2px solid var(--border-accent) !important;
}
.border_warning {
    border: 2px solid var(--border-warning) !important;
}
.border_warning h2 {
    color: var(--border-warning) !important;
}

.cntnt_showfaqs .widecards h2,
.cntnt_faq_list .widecards h2 {
  /* display: block; */
  margin-bottom: 1rem;
}
.cntnt_showfaqs img,
.cntnt_faq_list img {
  margin-bottom: 1rem;
}
.cntnt_showfaqs .cardheader,
.cntnt_faq_list .cardheader {
    display: inline-flex;
}
.cntnt_showfaqs p,
.cntnt_faq_list p {
}

.content .card {
    overflow: visible; /* Laat de schaduw weer buiten de kaart vallen */
    height: 100%; /* Zorgt dat kaarten in een rij even hoog zijn */  
  background: var(--bg-card);
  padding: 2rem 1rem;
  /* padding-top: 32px; */
  border: 1px solid var(--border);
  border-radius: 20px;
  transition: var(--transition);
  box-shadow: var(--shadow-card);
  
}
.content .card:hover {
    border-color: var(--border-card);
    transform: translateY(-2px);
}
.content .card h2 {
    font-size: 1.2rem;
    margin-bottom: 1rem;
}
.content .cntnt_topic_2_cards .card h2 {
    font-size: 1.2rem;
    margin-bottom: 0rem;
}
.card_selected {
    border-color: var(--border-card) !important;
  background: var(--bg-card-soft) !important;
}
.content_item_description {
    border-radius: inherit;
}
/* Blockquotes */
.content blockquote {
      border-left: 12px solid var(--text-secondary);
      padding-left: 2rem;
      margin: 1.5rem 0;
      font-style: italic;
      color: var(--text-secondary);
    }

    /* Tables */
.OLDcontent details .table-wrapper,
.OLDcontent .content_item_description .table-wrapper {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;    }

.table-wrapper {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin-bottom: 1rem;
}
.table-wrapper table {
    width: 100%;
    min-width: 600px; /* Forceert het scrollen op mobiel */
    border-collapse: collapse;
}

.content details table,
.content .content_item_description table {
      width: 100%;
      border-collapse: collapse;
      margin: 2rem 0;
      font-size: 16px;
      /* background: #fff;*/
    }
.content details table {
  margin: 0;
    }
    .content details th, 
    .content details td,
    .content .content_item_description th, 
    .content .content_item_description td {
      padding: 0.75rem 1rem;
      text-align: left;
      border-bottom: 1px solid #e6e6e6;
    }
.content details th,
.content .content_item_description th {
      background: var(--bg-th);
      font-weight: 600;
      /* color: #333;*/
    }
.content details tr:nth-child(even),
.content .content_item_description tr:nth-child(even) {
      background: var(--bg-tr);
    }
.content details tr:hover,
.content .content_item_description tr:hover {
      background: var(--bg-tr-hover);
    }

.content_list_description img,
.content_item_description img,
.content_list_image img,
.content_item_image img {
  display: inline-block;
    box-shadow: var(--shadow);
    margin: auto;
    margin-right: 0.5rem;
    margin-bottom: 1rem;
    max-width: 100%;
    height: auto;
}

.img_align_left {
    margin: 0 1em 1em 0;
}
.img_align_right {
    margin: 0 0 1em 1em;
}
/* --------------------------------------------------------------------------------------------------------
 * specifically for forms
 */
/* --------------------------------------------------------------------------------------------------------
 * specifically for news archive in table
 */

.html_news_archive a:link,
.html_news_archive a:visited {
	text-decoration: none;
}
.html_news_archive a:hover,
.html_news_archive a:active {
	text-decoration: underline;
}
.html_news_archive ul {
	list-style: none;
}
.html_news_archive ul ul {
	margin-left: 16px;
}