/* =====================================================
   TALOSAI SA — Country bubbles (dark background friendly)
   ===================================================== */

/* Grid stays the same */
.talosai-sa-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(190px,1fr));
  gap:12px;
}

/* Country bubble */
.talosai-sa-card{
  display:flex;
  align-items:center;
  gap:10px;

  padding:12px 14px;
  border-radius:14px;
  text-decoration:none !important;

  /* Light pastel bubble */
  background: rgba(255, 252, 235, 0.96);   /* off-white / soft ivory */
  border: 1px solid rgba(15, 45, 80, 0.18);

  /* Text */
  color: rgba(12, 30, 52, 0.95);

  /* Depth */
  box-shadow: 0 6px 18px rgba(0,0,0,0.20);

  transition:
    transform .14s ease,
    box-shadow .14s ease,
    background .14s ease,
    border-color .14s ease;
}

/* Hover state */
.talosai-sa-card:hover{
  background: rgba(255, 246, 210, 0.98);   /* warmer pastel */
  border-color: rgba(120, 190, 255, 0.55);
  box-shadow: 0 10px 28px rgba(0,0,0,0.32);
  transform: translateY(-1px);
}

/* Country name */
.talosai-sa-name{
  font-weight:600;
  color: rgba(12, 30, 52, 0.95);
}

/* Flag icon */
.talosai-sa-flag{
  font-size:20px;
  line-height:1;
}

/* Ensure inner text never inherits dark theme colors */
.talosai-sa-card *{
  color: rgba(12, 30, 52, 0.95);
}