/* Import Google Font */
@import url("https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@400;700&family=Open+Sans:wght@400;600&display=swap");

#mainNav {
  display: none;
}

body {
  font-family: "Open Sans", sans-serif;
  color: #212529 !important;
  font-size: 1rem;
}

#fullArticle h1,
#fullArticle h2,
#fullArticle h3,
#fullArticle h4,
#fullArticle h5,
#fullArticle h6,
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Roboto Slab", serif;
  color: #064c79;
}

#fullArticle,
#fullArticle p,
#fullArticle ul,
#fullArticle ol,
#fullArticle li,
#fullArticle div,
#fullArticle blockquote,
#fullArticle dd,
#fullArticle table {
  color: #212529;
  font-size: 1rem;
}

#serp-dd .result a:hover,
#serp-dd .result > li.active,
#fullArticle strong a,
#fullArticle a strong,
.collection a,
.contentWrapper a,
.most-pop-articles .popArticles a,
.most-pop-articles .popArticles a:hover span,
.category-list .category .article-count,
.category-list .category:hover .article-count {
  color: #064c79;
}

/* Base table */
table {
  border-collapse: collapse; /* merge borders into single lines */
  width: 100%;
  border: 1px solid #585858; /* outer border */
}

/* Table header */
th {
  background-color: #064c79;
  color: #ffffff;
  text-align: left;
  padding: 8px;
}

/* Table cells */
td {
  padding: 8px;
  border: 1px solid #585858;
}

/* Striped effect */
tr:nth-child(even) {
  background-color: #f2f2f2; /* light gray stripe */
}

tr:nth-child(odd) {
  background-color: #ffffff; /* white stripe */
}

/* Custom Cards */
/* Component variables */
:root {
  --ttsc-navy: #064c79;
  --ttsc-light-blue: #a7c1e5;
  --ttsc-border: #e0e0e0;
  --ttsc-card-bg: var(--ttsc-light-blue);
  --ttsc-radius: 0.75rem;
}

/* Box-sizing limited to component */
.ttsc-cards,
.ttsc-cards * {
  box-sizing: border-box;
}

/* Responsive grid */
.ttsc-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 1rem;
  margin: 1.5rem 0;
  align-items: stretch;
  font-family: inherit;
}

/* Whole card is now the link */
.ttsc-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 100px;
  padding: 1rem;
  border: 1px solid var(--ttsc-border);
  background: var(--ttsc-card-bg);
  border-radius: var(--ttsc-radius);
  text-align: center;
  text-decoration: none !important; /* remove underline */
  color: var(--ttsc-navy) !important;
  font-weight: 600;
  transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease;
  box-shadow: 0 2px 6px rgba(6, 76, 121, 0.06);
}

/* Hover / focus lift */
.ttsc-card:hover,
.ttsc-card:focus {
  transform: translateY(-6px);
  box-shadow: 0 10px 22px rgba(6, 76, 121, 0.12);
  background: #91aed7; /* darker shade */
  text-decoration: none !important; /* ensure no underline on hover */
}

/* Icon circle */
.ttsc-card__icon {
  width: 72px; /* larger */
  height: 72px; /* larger */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  font-size: 1.75rem; /* larger */
  margin-bottom: 0.75rem;
  background: rgba(255, 255, 255, 0.4);
  color: var(--ttsc-navy) !important; /* ensure navy */
}

/* Title */
.ttsc-card__title {
  word-break: break-word;
  max-width: 100%;
  font-size: 1rem;
  line-height: 1.25;
}

/* Keyboard focus ring */
.ttsc-card:focus-visible {
  outline: 3px solid var(--ttsc-navy);
  outline-offset: 2px;
  border-radius: var(--ttsc-radius);
}

/* Small screen tweak */
@media (max-width: 360px) {
  .ttsc-card {
    padding: 0.9rem;
    min-height: 110px;
  }
  .ttsc-card__icon {
    width: 60px;
    height: 60px;
    font-size: 1.4rem;
  }
}