.cpia-explore-data {
    margin: 2rem 0;
  }

  .explore-data-content {
    background-color: #5BA73C;  /* Green background color */
    border-radius: 1rem;
    padding: 3rem;
    overflow: hidden;
  }

  .explore-data-title {
    font-size: 2.5rem;
    font-weight: 600;
  }

  .explore-data-description {
    font-size: 1.1rem;
    line-height: 1.6;
    opacity: 0.9;
  }

  .explore-data-years .btn {
    font-weight: 500;
    transition: all 0.3s ease;
  }

  .explore-data-years .btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  }

  .africa-map-outline {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    max-width: 40%;
    width: 100%;
    background-image: url('../img/africa-bg-outline.png');
    background-repeat: no-repeat;
    background-position: bottom right;
    background-size: contain;
  }

  /* Overview filter bar: form-select styles from theme forms.scss; button below */
  .cpia-country-overview .filters .btn-primary {
    border-radius: 0.5rem;
    padding: 0.5rem 1.25rem;
    min-height: 2.5rem;
    font-weight: 500;
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
  }

  .cpia-country-overview .filters .btn-primary:hover {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
  }

  /* Global Bootstrap nav-tabs styling: rounded pills with primary active state */
  .nav.nav-tabs {
    border-bottom: 0;
    gap: 0.25rem;
  }

  .nav.nav-tabs .nav-link {
    border-radius: 999px;
    border: 1px solid transparent;
    padding: 0.4rem 0.9rem;
    color: var(--bs-gray-700);
    background-color: #f3f6f8;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
  }

  .nav.nav-tabs .nav-link:hover {
    border-color: var(--bs-primary);
    color: var(--bs-primary);
  }

  .nav.nav-tabs .nav-link.active {
    color: #fff;
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
  }

  /* Knowledge Center landing: 4 clickable blocks */
  .cpia-knowledge-center__block {
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
  }

  .cpia-knowledge-center__block:hover {
    border-color: var(--bs-primary);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
  }

  .cpia-knowledge-center__block-icon {
    width: 48px;
    height: 48px;
    border-radius: 0.75rem;
    background-color: rgba(34, 152, 70, 0.1);
  }

  .cpia-knowledge-center__block-icon .ti {
    font-size: 1.5rem;
  }

  .cpia-knowledge-center__block-arrow {
    opacity: 0.6;
    transition: transform 0.2s ease;
  }

  .cpia-knowledge-center__block:hover .cpia-knowledge-center__block-arrow {
    opacity: 1;
    transform: translateX(4px);
  }

  /* CPIA CARD BLOCK */
  .cpia-card-block {
    position: relative;
    color: black;
    padding: 1.5rem;
    border-radius: 1rem;
    border: 1px solid var(--bs-gray-300);
  }

  .cpia-card-block.cpia-card-block-primary{
    background-color: var(--bs-primary);
    border: 1px solid var(--bs-primary);
    color: white;
  }

  .cpia-card-block.cpia-card-block-secondary{
    background-color: var(--bs-secondary);
    border: 1px solid var(--bs-secondary);
    color: white;
  }

  /* Country comparison: custom modal overlay (full-screen gray, dialog on top) */
  .cpia-modal-overlay {
    position: fixed;
    inset: 0;
    background-color: rgba(15, 23, 42, 0.55);
    z-index: 1060;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .cpia-modal-overlay__dialog {
    margin: 0 1rem;
    max-width: 720px;
    width: 100%;
  }

  .cpia-modal-overlay .modal-content {
    border-radius: 1rem;
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.35);
    background-color: #fff;
    padding: 1rem;
  }

  /* Country comparison filter card: form-select from theme forms.scss */

  /* Country profile page */
  .cpia-country-profile__year-bar {
    border-bottom: 1px solid var(--bs-gray-200);
    padding-bottom: 0.5rem;
  }

  .cpia-country-profile__year-tabs {
    background-color: #f3f6f8;
    border-radius: 999px;
    padding: 0.2rem;
  }

  .cpia-country-profile__year-tabs .nav {
    gap: 0.15rem;
  }

  .cpia-country-profile__year-tabs .nav-link {
    color: var(--bs-gray-700);
    padding: 0.35rem 0.85rem;
    border-radius: 999px;
    border-radius: 999px;
    border: 1px solid transparent;
  }

  .cpia-country-profile__year-tabs .nav-link.active {
    background-color: var(--bs-secondary);
    color: #fff;
    border-radius: 8px;
    border-color: var(--bs-secondary);
  }

  .cpia-country-profile__final-score .display-6 {
    line-height: 1;
  }

  .cpia-country-profile__toolbar {
    border-bottom: 1px solid var(--bs-gray-200);
    padding-bottom: 0.75rem;
  }

  .cpia-country-picker__item {
    border-radius: 0.75rem;
    border: 1px solid var(--bs-gray-200);
    background-color: #f8fafb;
    color: var(--bs-gray-900);
  }

  .cpia-country-picker__item:hover {
    border-color: var(--bs-primary);
    background-color: #eef5f0;
  }

  .cpia-country-picker__item--active {
    border-color: var(--bs-primary);
    background-color: rgba(34, 152, 70, 0.12);
  }

  .cpia-country-picker__name {
    font-size: 0.95rem;
    font-weight: 500;
  }

  /* Country information cards */
  .cpia-country-info {
    border-radius: 1.25rem;
  }

  .cpia-country-info__item {
    display: flex;
    gap: 0.75rem;
    padding: 0.9rem 1rem;
    border-radius: 0.75rem;
    background-color: #f8fafb;
    border: 1px solid var(--bs-gray-200);
  }

  .cpia-country-info__icon {
    width: 32px;
    height: 32px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #e6f3ea;
    color: var(--bs-primary);
    flex-shrink: 0;
  }

  .cpia-country-info__label {
    font-size: 0.7rem;
    letter-spacing: 0.06em;
    color: var(--bs-gray-500);
  }

  .cpia-country-info__value {
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--bs-gray-900);
  }

  .cpia-country-info__value--accent {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--bs-success);
  }

  .cpia-country-info__mini-bars {
    display: inline-flex;
    gap: 3px;
  }

  .cpia-country-info__mini-bars span {
    width: 6px;
    border-radius: 3px;
    background-color: var(--bs-success);
  }

  .cpia-country-info__mini-bars span:nth-child(1) { height: 10px; opacity: 0.5; }
  .cpia-country-info__mini-bars span:nth-child(2) { height: 14px; opacity: 0.7; }
  .cpia-country-info__mini-bars span:nth-child(3) { height: 18px; }
  .cpia-country-info__mini-bars span:nth-child(4) { height: 14px; opacity: 0.8; }

  /* Cluster scores card */
  .cpia-cluster-card {
    border-radius: 1.25rem;
  }

  .cpia-cluster-card__header {
    font-size: 0.7rem;
    letter-spacing: 0.08em;
  }

  .cpia-cluster-card__header-score {
    min-width: 3.5rem;
    text-align: right;
  }

  .cpia-cluster-card__body {
    border-radius: 1rem;
    overflow: hidden;
    border: 1px solid var(--bs-gray-200);
  }

  .cpia-cluster-card__cluster {
    padding: 0.75rem 1rem;
  }

  .cpia-cluster-card__cluster-score {
    min-width: 3.5rem;
    text-align: right;
    font-weight: 600;
  }

  .cpia-cluster-card__criteria {
    margin-top: 0.35rem;
    padding-top: 0.35rem;
    border-top: 1px dashed var(--bs-gray-200);
    font-size: 0.875rem;
  }

  .cpia-cluster-card__criteria li + li {
    margin-top: 0.15rem;
  }

  .cpia-cluster-card__criteria-label {
    color: var(--bs-gray-700);
  }

  .cpia-cluster-card__criteria-score {
    min-width: 3rem;
    text-align: right;
    color: var(--bs-gray-900);
  }

  .cpia-card-block-title {
    font-size: 2.5rem;
    font-weight: 600;
  }

  .cpia-card-block-description {
    font-size: 1.1rem;
    line-height: 1.6;
    opacity: 0.9;
  }

  .cpia-card-block-button {
    font-weight: 500;
    transition: all 0.3s ease;
  }

  .cpia-card-block-button a:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  }

  /* Circular scores overview on regional overview (score 1–6: fill proportional, 3 = half, 6 = full) */
  .cpia-score-circle-row:last-child {
    margin-bottom: 0;
  }

  .cpia-score-circle {
    --score: 0;
    --circle-fill: #6c757d; /* default, overridden per-cluster via inline style */
    width: 56px;
    height: 56px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--bs-gray-800);
    background: conic-gradient(
      var(--circle-fill) 0deg,
      var(--circle-fill) calc(var(--score) / 6 * 360deg),
      #e8ecef calc(var(--score) / 6 * 360deg)
    );
    flex-shrink: 0;
  }

  .cpia-score-circle__value {
    width: 68%;
    height: 68%;
    border-radius: 999px;
    background-color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.06);
  }

  .cpia-score-circle__label {
    font-size: 0.9rem;
  }

  .cpia-score-circle__value {
    color: var(--bs-gray-900);
  }

  /* Make SVG countries clickable on overview map */
  #react-svg-map [data-iso2] {
    cursor: pointer;
  }



  .bg-first-draft {
    background-color: #BFBFBF;
  }

  .bg-peer-review {
    background-color: #A02B93;
  }

  .bg-second-draft {
    background-color: #46B0E1;
  }

  .bg-second-draft-review {
    background-color: #46B0E1;
  }

  .bg-second-draft-update {
    background-color: #46B0E1;
  }

  .bg-validation {
    background-color: #0C769F;
  }

  .bg-completed {
    background-color: #8ED873;
  }